html {
    position: relative
}
/* navigation bar */

.navbar {
    background-color: #10929090;
}
.navbar-brand {
    padding: 10px;
    color: #152637 ;
    font-weight: bold;
}

.nav-item {
    padding: 10px;
    font-weight: bold;
    color: #152637;
}



/* main body */
body {
    font-family: Georgia, 'Times New Roman', Times, serif;
    background-color: #eaededd4;
    margin-bottom: 100px;
}


.content-header {
    position: relative;
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    font-style: bold;
    color: #284869 ;
    
}

.content-main {
    position: relative;
    padding: 25px;
    margin-top: 30px;
    background-color: white;


}

.content-main > p {
    padding: 25px;
    line-height: 30px;
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-size: 15;
    
}

/* main img for */
#content-img {
    overflow: auto;
    float: left;
    width: 350px;
    height: auto;
    margin-top: 25px;
    margin-right: 25px;

}

/* plot preview sidebar */
#plotPreview-main {
    width: auto;
    padding: 25px;
    margin-top: 32px;
    background-color: white;

}

.plotPreview-header {
    font-size: x-large;
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    font-style: bold;
    color: #284869 ;
}

.plotPreview-photo {
    padding: 15px;
    width: 180px;
    height: auto;
}

#plotPreview-img {
    padding-top: 20px;
    text-align: center;

}

/* comparison page */
.comparison-header {
    font-size: x-large;
    font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
    font-variant: small-caps;
    text-align: center;
    color: #284869;
}

.comparison-image {
    width: 500px;
    height: auto;
    padding: 15px;
  

}

.responsive {
    width: 100%;
    height: auto;
}

/* plot pages */
#content-img.plots {
    width: 100%;
    padding: 25px;
}

.container-video {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-top: 56.25%; /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
  }

.responsive-video {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
  }

.video-credit {
    font-style: italic;
}