.iframe-wrapper { @include constrain_wide() } .taxon { display: none !important; } #birds, .birds { .post--title { @include fontsize(18); a { font-style: normal; @include fontsize(22); } } .audio-figure { audio { display: block; width: 100%; } small { display: block;} } .post--image { position: relative; width: 100%; figcaption { opacity: 0; @include fancy-sans; @include fontsize(13); position: absolute; bottom: 0; text-align: left; width: 99%; background: rgba(0, 0, 0, 0.75); padding: .5em 0 .5em .5em; margin-bottom: .5em; color: #ccc; a { color: #ccc; } } img { max-width: 100%; width: 100%; padding: 0; background: none; } .picfull { margin: 0; } } .post--image:hover figcaption { -webkit-transition: opacity .25s ease-in; -moz-transition: opacity .25s ease-in; transition: opacity .25s ease-in; opacity: 1; } } .sci { font-style: italic; } .birds { article { @include constrain_narrow; } audio { width: 100%;} .audio-figure { margin-top: 2em; margin-bottom: 2em; } article h2, h3 { font-weight: 400;} article h2 { margin-bottom: 0;} h3 { margin-top: 0; } .map { margin: 0 auto; width: 99%; height: 400px; @include breakpoint(beta) { @include constrain_narrow; } } #endnode { @include breakpoint(beta) { text-align: left; } @include fancy-sans; @include fontsize(14); margin-top: 4rem; h5 { @include fontsize(14); @include smcaps; @include fancy_sans; margin-bottom: 1rem; margin-top: 2rem; } ul { margin-bottom: 2em; li { color: lighten($body_font, 30); &:before { content: "\2022"; color: lighten($body_font, 30); margin-right: .35rem; } } } a { text-decoration: none; color: lighten($body_font, 10); } &:before { @include faded_line_after; } } #detail-map-canvas { width: 100vw; @include constrain_wide; position: relative; @include breakpoint(gamma) { left: calc(-20%); } @include breakpoint(delta) { left: calc(-38%); } @include breakpoint(epsilon) { left: calc(-45%); } } } .life-list { @include constrain_wide; text-align: left; h4 { @include fancy_sans;} ul { @include breakpoint(beta){ height: 1200px; display: flex; flex-direction: column; flex-wrap: wrap; } @include breakpoint(gamma){ height: 1000px; } @include breakpoint(epsilon){ height: 800px; } } li { margin-bottom: .35rem; } a { color: $body_font; text-decoration: none; } }