rst/themes/lifescience-theme/static/css/bio-custom.css (42 lines of code) (raw):
img.align-center, .figure.align-center img {
display: block;
margin: 1em auto;
}
.figure.align-center {
text-align: center;
}
.section:target h2 {
padding: 16px;
margin: 10px -16px 0;
animation: highlight 3s;
}
.section:target h3 {
padding: 10px;
margin: -10px -10px 0;
animation: highlight 3s;
}
@keyframes highlight {
0% { background-color: #c1e6ee; color: white }
20% { color: #333 }
100% { background-color: none; }
}
/* https://stackoverflow.com/questions/12121090/responsively-change-div-size-keeping-aspect-ratio */
.aspect-ratio-wrapper {
max-width: 720px;
width: 100%;
display: block;
position: relative;
margin: 1em auto;
}
.aspect-ratio-wrapper:after {
padding-top: 56.25%; /* = 100%/(640/360) */
display: block;
content: '';
}
.aspect-ratio-wrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: none;
}