.footer-left {
 position: relative;
 float: left;
 text-align: left;
}

.footer-right {
 position: relative;
 float: right;
 text-align: right;
}

.footer-link {
 border-bottom: 1px solid rgba(255, 255, 255, 0.5);
}

@media screen and (max-width:1299px) {
 .portrait-6x7-spacer {
   display: none;
 }
 .landscape-6x7-spacer {
   display: none;
 }
}

.ch3-species-name-subhead {
 font-family: 'IBM Plex Mono', monospace;
 font-size: 1.5rem;
 font-style: italic;
}

/* BEGIN inline image floating parameters */

.landscape-2x3-float-left {
 float: left;
 padding: 0 3ch 0 0;
 margin-left: -35rem;
}

.landscape-2x3-float-right {
 float: right;
 padding: 0 0 0 3ch;
 margin-right: -35rem;
}

.landscape-2x3-float-left img,
.landscape-2x3-float-right img {
 max-width: 60ch;
 -o-object-fit: contain;
    object-fit: contain;
 max-height: calc(40ch - 1ch);
}

.portrait-6x7-float-left {
 float: left;
 padding: 0 3ch 0ch 0;
 margin-left: -35rem;
}

.portrait-6x7-float-right {
 float: right;
 padding: 0 0 0 3ch;
 margin-right: -35rem;
}

.portrait-6x7-float-left img,
.portrait-6x7-float-right img {
 max-height: 60ch;
 -o-object-fit: contain;
    object-fit: contain;
 max-width: calc(60ch * 6/7);
}

.landscape-6x7-float-left {
 float: left;
 padding: 0 4ch 0ch 0;
 margin-left: -35rem;
}

.landscape-6x7-float-right {
 float: right;
 padding: 0 0 0 3ch;
 margin-right: -35rem;
}

.landscape-6x7-float-left img,
.landscape-6x7-float-right img {
 max-width: 60ch;
 -o-object-fit: contain;
    object-fit: contain;
 max-height: calc((60ch * 6/7) - 1ch);
}

@media screen and (min-width:1000px) and (max-width:1299px) {
 .landscape-2x3-float-left {
   float: left;
   padding: 0 3ch 0 0;
   margin-left: -15rem;
 }
 .landscape-2x3-float-right {
   float: right;
   padding: 0 0 0 3ch;
   margin-right: -15rem;
 }
 .landscape-2x3-float-left img,
 .landscape-2x3-float-right img {
   max-width: 40ch;
   -o-object-fit: contain;
      object-fit: contain;
   max-height: calc((40ch * 2/3) - 1ch);
 }
 .portrait-6x7-float-left {
   float: left;
   padding: 0 3ch 0ch 0;
   margin-left: -15rem;
 }
 .portrait-6x7-float-right {
   float: right;
   padding: 0 0 0 3ch;
   margin-right: -15rem;
 }
 .portrait-6x7-float-left img,
 .portrait-6x7-float-right img {
   max-height: 40ch;
   -o-object-fit: contain;
      object-fit: contain;
   max-width: calc(40ch * 6/7);
 }
 .landscape-6x7-float-left {
   float: left;
   padding: 0 4ch 0ch 0;
   margin-left: -15rem;
 }
 .landscape-6x7-float-right {
   float: right;
   padding: 0 0 0 3ch;
   margin-right: -15rem;
 }
 .landscape-6x7-float-left img,
 .landscape-6x7-float-right img {
   max-width: 40ch;
   -o-object-fit: contain;
      object-fit: contain;
   max-height: calc((40ch * 6/7) - 1ch);
 }
}

@media screen and (max-width:999px) {
 .landscape-2x3-float-left {
   float: left;
   padding: 0 3ch 0 0;
   margin-left: 0;
 }
 .landscape-2x3-float-right {
   float: right;
   padding: 0 0 0 3ch;
   margin-right: 0;
 }
 .landscape-2x3-float-left img,
 .landscape-2x3-float-right img {
   max-width: 40ch;
   -o-object-fit: contain;
      object-fit: contain;
   max-height: calc((40ch * 2/3) - 1ch);
 }
 .portrait-6x7-float-left {
   float: left;
   padding: 0 3ch 0ch 0;
   margin-left: 0;
 }
 .portrait-6x7-float-right {
   float: right;
   padding: 0 0 0 3ch;
   margin-right: 0;
 }
 .portrait-6x7-float-left img,
 .portrait-6x7-float-right img {
   max-height: 40ch;
   -o-object-fit: contain;
      object-fit: contain;
   max-width: calc(40ch * 6/7);
 }
 .landscape-6x7-float-left {
   float: left;
   padding: 0 4ch 0ch 0;
   margin-left: 0;
 }
 .landscape-6x7-float-right {
   float: right;
   padding: 0 0 0 3ch;
   margin-right: 0;
 }
 .landscape-6x7-float-left img,
 .landscape-6x7-float-right img {
   max-width: 40ch;
   -o-object-fit: contain;
      object-fit: contain;
   max-height: calc((40ch * 6/7) - 1ch);
 }
}

@media screen and (orientation:portrait) {
 .landscape-2x3-float-left,
 .landscape-2x3-float-right,
 .portrait-6x7-float-left,
 .portrait-6x7-float-right,
 .landscape-6x7-float-left,
 .landscape-6x7-float-right {
   float: none;
   display: block;
   margin-left: 0;
   margin-right: 0;
   padding: 0 0 0 0;
 }
 .landscape-2x3-float-left img,
 .landscape-2x3-float-right img,
 .portrait-6x7-float-left img,
 .portrait-6x7-float-right img,
 .landscape-6x7-float-left img,
 .landscape-6x7-float-right img {
   max-width: 100%;
   max-height: 100%;
 }
}

.illustration-float-left {
 float: left;
 padding: 0 2ch 0 0;
 margin-left: -25rem;
}

.illustration-float-left img,
.illustration-float-right img {
 max-width: 60ch;
 -o-object-fit: contain;
    object-fit: contain;
 max-height: calc((60ch * 2/3) - 1ch);
}

.illustration-float-right {
 float: right;
 padding: 0 2ch 0 0;
 margin-right: -25rem;
}

@media screen and (min-width:1000px) and (max-width:1299px) and (orientation:landscape) {
 .illustration-float-left {
   float: left;
   padding: 0 2ch 0 0;
   margin-left: -15rem;
 }
 .illustration-float-left img {
   max-width: 40ch;
   -o-object-fit: contain;
      object-fit: contain;
   max-height: calc((40ch * 2/3) - 1ch);
 }
 .illustration-float-right {
   float: right;
   padding: 0 0 0 0;
   margin-right: -15rem;
 }
 .illustration-float-right img {
   max-width: 40ch;
   -o-object-fit: contain;
      object-fit: contain;
   max-height: calc((40ch * 2/3) - 1ch);
 }
}

@media screen and (max-width:999px) {
 .illustration-float-left {
   float: left;
   padding: 0 2ch 0 0;
   margin-left: 0rem;
 }
 .illustration-float-right {
   float: right;
   padding: 0 0 0 2ch;
   margin-right: 0rem;
 }
 .illustration-float-left img,
 .illustration-float-right img {
   max-width: 40ch;
   -o-object-fit: contain;
      object-fit: contain;
   max-height: calc((40ch * 2/3) - 1ch);
 }
}

@media screen and (orientation:portrait) {
 .illustration-float-left {
   float: none;
   margin-left: 0;
   padding: 0 0 0 0;
 }
 .illustration-float-left img,
 .illustration-float-right img {
   max-width: 100%;
   max-height: 100%
 }
 .illustration-float-right {
   float: none;
   margin-right: 0;
   padding: 0 0 0 0;
 }
}

/* END inline image floating parameters */

/* BEGIN Tooltip test */

.tooltip {
 display: inline;
 position: -webkit-sticky;
 position: sticky;
 border-bottom: 1px dotted #666;
}

.tooltip .top {
 max-width: 60vw;
 top: -20px;
 left: 50%;
 transform: translate(-50%, -100%);
 padding: 10px 20px;
 color: rgba(255, 255, 255, 0.75);
 background-color: rgba(0, 0, 0, 0.75);
 font-weight: normal;
 text-align: center;
 border-radius: 8px;
 position: absolute;
 z-index: 99999999;
 box-sizing: border-box;
 box-shadow: 0 1px 8px rgba(0, 0, 0, 0.5);
 visibility: hidden;
 opacity: 0;
 transition: opacity 0.8s;
}

.tooltip small {
 font-size: 1rem;
}

.tooltip:hover .top {
 visibility: visible;
 opacity: 1;
}

.tooltip .top i.arrow {
 position: absolute;
 top: 100%;
 left: 50%;
 margin-left: -12px;
 width: 24px;
 height: 12px;
 overflow: hidden;
}

.tooltip .top i.arrow::after {
 content: '';
 position: absolute;
 width: 12px;
 height: 12px;
 left: 50%;
 transform: translate(-50%, -50%) rotate(45deg);
 background-color: rgba(0, 0, 0, 0.75);
 box-shadow: 0 1px 8px rgba(0, 0, 0, 0.5);
}

/* END Tooltip test */

.footer-text h2 {
 border-bottom: 1px solid rgba(255, 255, 255, 0.4);
}

.index-fullsize-wrapper {
 margin-bottom: 0;
}

.index-image-wrapper {
 opacity: 0;
 -webkit-animation: imgFadeInOnLoad 1.5s ease forwards;
         animation: imgFadeInOnLoad 1.5s ease forwards;
 -webkit-animation-delay: 1s;
         animation-delay: 1s;
}

@-webkit-keyframes imgFadeInOnLoad {
 100% {
   opacity: 1;
 }
}

@keyframes imgFadeInOnLoad {
 100% {
   opacity: 1;
 }
}

@media screen and (max-width:1299px) and (orientation:portrait) {
 .index-image-wrapper img {
   min-height: 200vh;
   min-width: 200%;
 }
 .index-image-wrapper {
   margin-left: -50%;
   margin-right: 50%;
 }
}

#bg-image-wrapper {
 filter: brightness(50%) blur(5px);
 transition: all 1.5s linear;
}

#bg-image-wrapper-noanimation {
 filter: brightness(50%) blur(5px);
 transition: all 1.5s linear;
}

/* BEGIN Div classes for paragraph arrangement */

div.bodyparagraph-style1 {
 width: 60ch;
 padding-left: 0;
 padding-right: 0;
 margin-left: auto;
 margin-right: auto;
 position: relative;
 left: -17rem;
}

div.bodyparagraph-style2 {
 width: 60ch;
 padding-left: 0;
 padding-right: 0;
 margin-left: auto;
 margin-right: auto;
 position: relative;
 left: 17rem;
}

div.bodyparagraph-style3 {
 position: relative;
 width: 60ch;
 padding-left: 0;
 padding-right: 0;
 margin-left: auto;
 margin-right: auto;
}

div.bodyparagraph-style4 {
 width: 50ch;
 margin-left: auto;
 margin-right: auto;
}

div.bodyparagraph-video {
 padding: 45% 0 0 0;
 position: relative;
 max-width: 80%;
 margin-right: auto;
 margin-left: auto;
}

div.bodyparagraph-video iframe {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
}

div.bodyparagraph-figure {
 margin-left: auto;
 margin-right: auto;
 width: 85%;
 text-align: center;
}

@media screen and (min-width:1000px) and (max-width:1299px) {
 div.bodyparagraph-style1 {
   width: 60ch;
   left: -5rem;
   ;
 }
 div.bodyparagraph-style2 {
   width: 60ch;
   margin: auto auto auto auto;
   left: 5rem;
   ;
 }
 div.bodyparagraph-style3 {
   width: 65ch;
   margin-left: auto;
   margin-right: auto;
 }
 div.bodyparagraph-style4 {
   width: 55%;
   margin-left: auto;
   margin-right: auto;
 }
}

@media screen and (orientation:portrait) {
 div.bodyparagraph-style1 {
   width: 75%;
   padding-left: 0;
   padding-right: 0;
   left: 0;
 }
 div.bodyparagraph-style2 {
   width: 75%;
   padding-left: 0;
   padding-right: 0;
   margin-left: auto;
   margin-right: 0;
   left: 0;
 }
 div.bodyparagraph-style3 {
   width: 75%;
   margin-left: auto;
   margin-right: auto;
   left: 0;
 }
 div.bodyparagraph-style4 {
   width: 65%;
   margin-left: auto;
   margin-right: auto;
   left: 0;
 }
    
  div.bodyparagraph-figure {
   width: 100%;
   padding: 0 0 0 0;
   text-align: center;
 }
 div.bodyparagraph-video iframe {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
 }
 div.bodyparagraph-video {
   padding: 56.25% 0 0 0;
   position: relative;
   max-width: 100%;
   max-height: 100%;
 }
}

@media screen and (max-width:999px) {
 div.bodyparagraph-style1,
 div.bodyparagraph-style2,
 div.bodyparagraph-style3,
 div.bodyparagraph-style4,
 div.bodyparagraph-style5,
 div.bodyparagraph-style6 {
   width: 100%;
   padding: 0 0 0 0;
   left: 0;
 }
}

@media screen and (max-width:1299px) {
}

/* END Div classes for paragraph arrangement */

/* Global a:hover full opacity */

a:hover {
 color: rgba(255, 255, 255, 1.0);
}

img.logotype_header {
 display: inline-block;
 height: 4rem;
 opacity: 0.75;
 vertical-align: text-top;
}

.header-left:hover .logotype_header,
h3 {
 opacity: 1;
}

@media screen and (max-width:999px) and (orientation:portrait) {
 .desktop-header {
   display: none;
 }
}

@media screen and (orientation:portrait) {
 img.logotype-header {
   height: 1rem;
 }
 .header-left h3 {
   font-size: 1rem;
 }
}

/*BEGIN Chapter contents dropdown menu (DESKTOP-ONLY) */

.dropbtn {
 background: transparent;
 color: white;
 padding: 0;
 border: none;
 cursor: pointer;
 border-bottom: 1px solid rgba(255, 255, 255, 0.4);
}

.dropbtn:hover {
 opacity: 0.7;
 cursor: pointer;
}

.dropdown {
 position: relative;
 display: inline-block;
 justify-content: right;
 margin-top: 0.0em;
}

/* Dropdown Content (Hidden by Default) */

.dropdown-content {
 right: 0;
 display: none;
 position: absolute;
 background-color: rgba(0, 0, 0, 0.5);
 width: 33vw;
 box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
 z-index: 1;
 text-align: right;
}

.dropdown-content h2,
small {
 color: rgba(255, 255, 255, 0.75);
}

/* Links inside the dropdown */

.dropdown-content a {
 padding: 10px 10px;
 text-decoration: none;
 display: block;
}

/* Change color of dropdown links on hover */

.dropdown-content a:hover {
 opacity: 0.7;
 background: transparent;
}

.dropdown-content a:active {
 opacity: 0.7;
 background: transparent;
}

/* Show the dropdown menu on hover */

.dropdown:hover .dropdown-content {
 opacity: 1;
 display: block;
 cursor: pointer;
}

@media screen and (orientation:portrait) {
 .desktop-header,
 .header-left,
 .dropbtn,
 .dropdown,
 .dropdown-content {
   display: none;
 }
}

@media screen and (any-hover:none) {
 .dropdown {
   display: none;
 }
}

/* END DESKTOP-ONLY Chapter contents dropdown menu stylesheet */

/* BEGIN MOBILE-ONLY Chapter contents dropdown menu */

@media screen and (orientation:landscape) {
 .topnav {
   display: none;
 }
}

@media screen and (orientation:portrait) {
 .topnav {
   overflow: hidden;
   background-color: rgba(0, 0, 0, 0.5);
   position: relative;
   border-bottom: 1px solid rgba(255, 255, 255, 0.5);
   cursor: pointer;
 }
 .topnav .dropdown-links {
   display: none;
 }
 .topnav .home-button {
   float: left;
 }
 .topnav .links-button {
   float: right;
 }
 .topnav .dropdown-links {
   position: relative;
   float: left;
   width: 100%;
 }
 .topnav a {
   color: white;
   padding: 14px 16px;
   text-decoration: none;
   display: block;
 }
 .topnav a.icon {
   background: black;
   display: block;
   position: absolute;
   top: 10px;
   right: 0;
   float: right;
 }
 .topnav a:hover {
   background-color: rgba(255, 255, 255, 0.25);
   opacity: 1;
 }
 .topnav a:active {
   opacity: 1;
   background: rgba(255, 255, 255, 0.25)
 }
 .topnav a:after {
   background: rgba(255, 255, 255, 0.5);
 }
}

/* END MOBILE-ONLY Chapter contents dropdown menu */

/* BEGIN TABLET LANDSCAPE-ONLY Chapter contents dropdown menu */

@media screen and (any-hover:none) {
 .dropdown-tablet {
   position: relative;
   display: inline-block;
   justify-content: right;
   margin-top: 0.0em;
 }
 .dropdown-tablet a:active {
   opacity: 0.7;
 }
 .links-button-tablet {
   float: right;
   border-bottom: 1px solid rgba(255, 255, 255, 0.5);
 }
 .dropdown-links-tablet {
   right: 0;
   display: none;
   position: absolute;
   background-color: rgba(0, 0, 0, 0.5);
   width: 33vw;
   box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
   z-index: 1;
   text-align: right;
 }
 .dropdown-links-tablet a {
   padding: 10px 10px;
   text-decoration: none;
   display: block;
 }
 .dropdown-links-tablet h2,
 small {
   color: rgba(255, 255, 255, 0.75);
 }
}

@media screen and (orientation:portrait),
(any-hover:hover) {
 .dropdown-tablet {
   display: none;
 }
}

/* END TABLET LANDSCAPE-ONLY Chapter contents dropdown menu */

/* BEGIN Table of Contents */

.toc-container {
 display: grid;
 text-align: center;
 align-items: center;
 justify-content: center;
 grid-template-columns: 1fr 1fr;
 grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr;
 gap: 10 10;
 grid-template-areas: "ChPrologue ChI" "ChII ChIII" "ChIV ChV" "ChVI ChVII" "ChVIII ChIX" "ChX ChEpilogue";
 padding-left: 30%;
 padding-right: 30%;
 margin-top: -10%;
}

#ChPrologue {
 grid-area: ChPrologue;
}

#ChI {
 grid-area: ChI;
}

#ChII {
 grid-area: ChII;
}

#ChIII {
 grid-area: ChIII;
}

#ChIV {
 grid-area: ChIV;
}

#ChV {
 grid-area: ChV;
}

#ChVI {
 grid-area: ChVI;
}

#ChVII {
 grid-area: ChVII;
}

#ChVIII {
 grid-area: ChVIII;
}

#ChIX {
 grid-area: ChIX;
}

#ChX {
 grid-area: ChX;
}

#ChEpilogue {
 grid-area: ChEpilogue;
}

.toc-chapter-wrapper {
 width: 25vw;
 position: relative;
 margin-top: -15%;
 margin-right: auto;
}

.toc-chapter-wrapper img {
 opacity: 0;
 display: block;
 width: 100%;
 transition: opacity 0.5s ease;
}

.toc-chapter-wrapper img.thumb-left {
 margin-left: -50%;
}

.toc-chapter-wrapper img.thumb-right {
 margin-left: 50%;
}

.toc-chapter-wrapper:hover img {
 opacity: .5;
}

.toc-chapter--content-text {
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 -ms-transform: translate(-50%, -50%);
 -webkit-transform: translate(-50%, -50%);
 overflow: hidden;
 white-space: nowrap;
}

.toc-chapter--content-text h2 {
 padding-bottom: 10px;
 border-bottom: 1px solid rgba(255, 255, 255, 0.4);
 font-size: 2.3rem;
}

.toc-chapter--content-text a {
 display: inline;
 text-align: center;
 padding: 0px;
 cursor: pointer;
}

@media screen and (orientation:portrait) {
 .toc-container {
   display: block;
   text-align: center;
   width: 100%;
   padding-left: 0;
   padding-right: 0;
   padding-top: 10px;
   padding-bottom: 10px;
 }
 .toc-chapter-wrapper img {
   opacity: 0;
   display: block;
   width: 100%;
   transition: opacity 0.5s ease;
 }
 .toc-chapter-wrapper img.thumb-left {
   margin-left: 0;
 }
 .toc-chapter-wrapper img.thumb-right {
   margin-left: 0;
 }
 .toc-chapter-wrapper:hover img {
   opacity: .5;
 }
 .toc-chapter-wrapper {
   display: block;
   height: 20rem;
   margin: 0 auto;
 }
 .toc-chapter--content-text {
   white-space: nowrap;
 }
}

@media screen and (max-width:999px) and (orientation:portrait) {
 .toc-chapter-wrapper img {
   display: none;
 }
}

/* END Table of Contents */

/* BEGIN Chapter header (cover image & title) formatting */

.chapter-header-flexbox-wrapper {
 display: flex;
 flex-direction: row;
 flex-wrap: wrap;
 min-height: 140px;
 /*arbitrary height */
}

.chapter-title-text-wrapper {
 padding: 50px 50px 0 50px;
 align-self: flex-end;
 max-width: 41%;
 white-space: pre-line;
}

h2.chapter-title-text {
 font-size: 6vw;
}

@media screen and (max-width:999px) {
 .chapter-header-flexbox-wrapper {
   width: 100%;
   display: block;
   /* Stops it from floating */
   margin: auto;
   /* Ensures that it is centered */
   margin-bottom: 25px;
   /* Space between the stacked elements */
 }
 .chapter-title-text-wrapper {
   padding: 25px 0 0 0;
   max-width: 100%;
 }
}

@media screen and (max-width:1399px) {
 h2.chapter-title-text {
   font-size: 4rem;
 }
}

@media screen and (orientation:portrait) {
 h2.chapter-title-text {
   font-size: 3rem;
 }
 .chapter-title-text-wrapper {
   align-self: flex-end;
   padding: 50px 0 0 50px;
 }
}

/* END Chapter header (cover image & title) formatting */

@media screen and (max-width: 999px) {
 .par {
   width: 100%;
   display: block;
   /* Stops it from floating */
   padding: 0 0 0 0;
   margin: auto;
   position: static;
 }
}

.jumptarget {
 display: block;
 height: 150px;
 /*same height as header*/
 margin-top: -150px;
 /*same height as header*/
 visibility: visible;
}

.jumptarget:before {
 display: block;
 content: "";
 height: 150px;
 margin: -150px 0 0 150px;
}

.alg-header {
 display: block;
 position: absolute;
 left: 0;
 right: 0;
 top: 5%;
 margin-left: auto;
 margin-right: auto;
 width: 85%;
 height: auto;
 opacity: 0;
 transform: scale(0.9);
 -webkit-animation: revealHeader 30s ease-in-out forwards;
         animation: revealHeader 30s ease-in-out forwards;
}

.alg-header-noanimation {
 display: block;
 margin-left: auto;
 margin-right: auto;
 left: 0;
 right: 0;
 width: 85%;
 opacity: 0.7;
 mix-blend-mode: screen;
 top: 5%;
 position: absolute;
 z-index: 999;
}

@-webkit-keyframes revealHeader {
 25% {
   opacity: 0.3;
 }
 100% {
   opacity: 0.7;
   transform: scale(1);
 }
}

@keyframes revealHeader {
 25% {
   opacity: 0.3;
 }
 100% {
   opacity: 0.7;
   transform: scale(1);
 }
}

@media screen and (orientation:portrait) {
 .alg-header {
   display: block;
   justify-content: center;
   text-align: center;
   padding: 0 0 0 0;
   width: 100%;
 }
 .alg-header-noanimation {
   display: block;
   justify-content: center;
   text-align: center;
   padding: 0 0 0 0;
   width: 100%;
 }
}

.splash-text {
 display: block;
 justify-content: center;
 text-align: center;
 opacity: 0;
 -webkit-animation: splashtext-fadein 2s ease-in-out forwards;
 /* Safari, Chrome and Opera > 12.1 */
 /* Firefox < 16 */
 /* Internet Explorer */
 /* Opera < 12.1 */
 animation: splashtext-fadein 2s ease-in-out forwards;
 -webkit-animation-delay: 25s;
         animation-delay: 25s;
}

.splash-text-noanimation {
 display: block;
 justify-content: center;
 text-align: center;
 opacity: 1;
}

@-webkit-keyframes splashtext-fadein {
 from {
   opacity: 0;
   transform: translateY(-25px);
 }
 to {
   opacity: 1;
   transform: translateY(0px);
 }
}

@keyframes splashtext-fadein {
 from {
   opacity: 0;
   transform: translateY(-25px);
 }
 to {
   opacity: 1;
   transform: translateY(0px);
 }
}

/**
* Content
*/

/**
* External Webfonts
**/

/* Normal weight; Italic style */

@font-face {
 font-family: 'Mazius Display';
 font-style: extra-italic;
 src: url('https://files.cargocollective.com/c953506/MAZIUSREVIEW20.09-Extraitalic.woff') format('woff'), url('https://files.cargocollective.com/c953506/MAZIUSREVIEW20.09-Extraitalic.woff2') format('woff2');
}

/* Della Respira TTF upload */

@font-face {
 font-family: 'Della Respira';
 src: url('https://files.cargocollective.com/c953506/DellaRespira-Regular.ttf') format('truetype');
}

/* Marion TTF uploads */

/* Normal */

@font-face {
 font-family: 'Marion';
 src: url('https://files.cargocollective.com/c953506/Marion-Regular.eot'), format('embedded-opentype');
 font-weight: 400;
 font-style: normal;
}

/* Emphasis */

@font-face {
 font-family: 'Marion';
 src: url('https://files.cargocollective.com/c953506/Marion-Italic.eot'), format('embedded-opentype');
 font-weight: 400;
 font-style: italic;
}

/* Strong */

@font-face {
 font-family: 'Marion';
 src: url('https://files.cargocollective.com/c953506/Marion-Bold.eot'), format('embedded-opentype');
 font-weight: 700;
 font-style: normal;
}

/**
*Cargo default styles
**/

html {
 background: #fff;
}

body {
 background-color: #000000;
 color: #000;
}

a:active {
 opacity: 0.75;
}

.page a.active {
 opacity: .75;
}

i,
em {
 font-style: italic;
}

b,
strong {
 font-weight: bold;
}

sub,
sup {
 position: relative;
 vertical-align: baseline;
}

sub {
 top: 0.3em;
}

sup {
 top: -0.4em;
}

s {
 text-decoration: line-through;
}

img {
 border: 0;
 padding: 0;
}

ul,
ol {
 margin: 0;
 padding: 0 0 0 1em;
}

ol {
 /*counter-reset: item;*/
}

ol {
 margin: 0 0 1.5em;
 padding: 0;
 /*counter-reset: item;*/
}

ol li {
 /*counter-increment: step-counter;*/
}

ol li::marker {
 display: block;
 width: 1em;
 padding-right: 1.5em;
 font-size: 1.5rem;
 line-height: 1.3;
 font-family: "IBM Plex Mono", Icons;
 font-style: normal;
 font-weight: 400;
 color: rgba(255, 255, 255, 0.5);
 letter-spacing: .05rem;
 text-align: right;
 /*   content: counter(step-counter) ". ";*/
 /* content: counter(item) ". "; /*Original from imported code */
 margin-top: 150px;
}

/*BEGIN Endnotes formatting */

ol.notes li {
 padding: 0;
 padding-top: 200px;
 margin-top: -200px;
 /*same height as header*/
}

ol.notes {
 margin-left: 3rem;
}

@media screen and (orientation:portrait) {
 ol.notes {
   margin-left: 5rem;
 }
}

/*END Endnotes formatting */

blockquote {
 margin: 0;
 padding: 0 0 0 2em;
 font-family: 'Forum', cursive;
 font-size: 1.2em;
}

hr {
 background: rgba(127, 127, 127, 0.2);
 border: 0;
 height: 1px;
 display: block;
}

.content img {
 float: none;
 margin-bottom: .5em;
}

.gallery_image_caption {
 margin-top: 1.2rem;
 margin-bottom: 0.5rem;
 font-size: 1.5rem;
 font-weight: 400;
 color: rgba(0, 0, 0, 0.35);
 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif, "Sans Serif", Icons;
 font-style: normal;
 line-height: 1.3;
}

/**
* Loading Animation
*/

.loading[data-loading] {
 position: fixed;
 bottom: 8px;
 left: 8px;
}

/**
* Editor styles
*/

[data-predefined-style="true"] bodycopy {
 font-size: 1.9rem;
 color: rgba(255, 255, 255, 0.6);
 font-family: "Marion", "Dolly Pro", Icons;
 line-height: 1.4;
 font-style: normal;
 font-weight: 400;
}

[data-predefined-style="true"] bodycopy a {
 color: rgba(255, 255, 255, 0.75);
 border-bottom: 1px solid rgba(255, 255, 255, 0.4);
 text-decoration: none;
}

[data-predefined-style="true"] bodycopy a:hover {
 color: rgba(255, 255, 255, 1.0);
}

bodycopy a.image-link,
bodycopy a.icon-link,
bodycopy a.image-link:hover,
bodycopy a.icon-link:hover {
 border-bottom: 0;
 padding-bottom: 0;
}

[data-predefined-style="true"] h1 {
 font-family: "Mazius Display", Icons;
 font-style: extra-italic;
 padding: 0;
 margin: 0;
 font-size: 5.0rem;
 line-height: 1.1;
 color: rgba(255, 255, 255, 0.6);
 mix-blend-mode: multiply;
}

.blend {
 mix-blend-mode: difference;
}

[data-predefined-style="true"] h1 a {
 color: rgba(255, 255, 255, 0.75);
 border: none;
}

[data-predefined-style="true"] h2 {
 font-family: 'Della Respira', serif;
 /*font-weight: 700;*/
 font-weight: 400;
 /*color: rgba(255, 255, 255, 0.5); Removed from predefined */
 /*font-size: 4rem; Disabling hard-coded font-sizes
line-height: 1.2;

}

[data-predefined-style="true"] h2 a {
/*color: rgba(255, 255, 255, 0.75); Removed from predefined */
}

/* H3 for intra-chapter section headers */

[data-predefined-style="true"] h3 {
 font-family: "Alegreya Sans", Icons, sans-serif;
 font-weight: 400;
 font-style: italic;
 padding: 0;
 margin: 0;
 color: rgba(255, 255, 255, 0.75);
 font-size: 2.7rem;
 line-height: 1.2;
}

[data-predefined-style="true"] h3 a {
 color: rgba(255, 255, 255, 0.75);
}

h3 b {
 font-family: 'Alegreya Sans', Icons, sans-serif;
 font-style: italic;
 font-weight: 700;
}

h3.major {
 font-style: italic;
 font-weight: 700;
}

h3.minor {
 font-family: 'Alegreya Sans', serif;
 font-style: italic;
 font-weight: 400;
}

/* End H3 */

[data-predefined-style="true"] small {
 display: inline-block;
 font-size: 1.5rem;
 line-height: 1.3;
 font-family: "IBM Plex Mono", Icons;
 font-style: normal;
 font-weight: 400;
 /*color: rgba(255, 255, 255, 0.5); */
 letter-spacing: .05rem;
}

[data-predefined-style="true"] small a {
 color: rgba(255, 255, 255, 0.6);
 /*border-bottom-width: 0em;*/
 border-bottom: 1px solid rgba(255, 255, 255, 0.4)
}

/**
* Breakpoints
*/

[data-css-preset] .page {
 background-color: initial/*!page_bgcolor*/
 ;
}

.mobile .page,
[data-css-preset].mobile .page {
 position: relative;
 min-height: 10px;
 max-width: 100%;
 width: 100%;
 background-color: transparent/*!page_bgcolor*/
 ;
}

[data-css-preset] .container {
 margin-left: 0/*!content_left*/
 ;
 margin-right: auto/*!content_left*/
 ;
 text-align: left/*!text_left*/
 ;
}

[data-css-preset] body {
 background-color: rgb(0, 0, 0)/*!body_bgcolor*/
 ;
}

[data-css-preset] .container_width {
 width: 100%/*!content_left*/
 ;
}

[data-css-preset] .content_padding {
 padding-top: 5rem/*!main_margin*/
 ;
 padding-bottom: 5rem/*!main_margin*/
 ;
 padding-left: 5rem/*!main_margin*/
 ;
 padding-right: 5rem/*!main_margin*/
 ;
}

[data-css-preset] text-limit {
 display: inline-block/*!text_width*/
 ;
 max-width: 65rem/*!text_width*/
 ;
}

/**
* Thumbnails
*/

div[thumbnails] {
 justify-content: flex-start;
}

[data-css-preset] .thumbnails {
 background-color: transparent/*!thumbnails_bgcolor*/
 ;
}

[data-css-preset] .thumbnails_width {
 width: 100%/*!thumbnails_width*/
 ;
}

[data-css-preset] [thumbnails-pad] {
 padding: 2.5rem/*!thumbnails_padding*/
 ;
}

[data-css-preset] [thumbnails-gutter] {
 margin: -5rem/*!thumbnails_padding*/
 ;
}

[data-css-preset] [responsive-layout] [thumbnails-pad] {
 padding: 0.8rem/*!responsive_thumbnails_padding*/
 ;
}

[data-css-preset] [responsive-layout] [thumbnails-gutter] {
 margin: -1.6rem/*!responsive_thumbnails_padding*/
 ;
}

.thumbnails .thumb_image {
 outline: 1px solid rgba(0, 0, 0, .12);
 outline-offset: -1px;
}

.thumbnails .title {
 margin-top: 2.0rem;
 margin-bottom: .3rem;
 font-size: 2.4rem;
 color: rgba(255, 255, 255, 0.6);
 font-family: 'Cormorant Upright', Icons;
 font-style: normal;
 font-weight: 700;
 line-height: 1.3;
}

.thumbnails .tags {
 margin-top: 1.2rem;
 margin-bottom: 0.5rem;
 font-size: 1.4rem;
 font-weight: 400;
 color: rgba(255, 255, 255, 0.25);
 font-family: 'Space Mono', Icons;
 font-style: normal;
 line-height: 1.2;
 text-transform: uppercase;
 letter-spacing: .05rem;
}

.thumbnails .tags a {
 pointer-events: none;
 border-bottom: 0;
 color: rgba(255, 255, 255, 0.25);
 text-decoration: none;
}

.thumbnails .has_title .tags {
 margin-top: 0rem;
}

/**
* Site Menu
*/

[data-css-preset] #site_menu_button {
 color: rgba(255, 255, 255, 0.95);
 line-height: 1;
 font-size: 28px/*!site_menu_button*/
 ;
 padding: 6px;
 line-height: 1;
 background: rgba(33, 32, 46, 0);
 position: fixed;
 top: 1rem/*!site_menu_button*/
 ;
 right: 1rem/*!site_menu_button*/
 ;
}

body.mobile #site_menu_button {
 margin: -6px;
 font-size: 34px;
}

#site_menu_button.custom_icon {
 width: 40px;
 height: auto;
}

#site_menu_button.active {
 display: none;
}

/**
* Site Menu
*/

#site_menu {
 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif, "Sans Serif", Icons;
 background: rgba(20, 20, 20, 0.95);
 font-size: 20px;
 font-style: normal;
 font-weight: 400;
 padding: 20px 30px 90px 30px;
 max-width: 400px;
 min-width: 300px;
 text-align: left;
 display: flex;
 justify-content: flex-start;
}

body.mobile #site_menu {
 width: 100%;
}

#site_menu .page-link a {
 color: rgba(255, 255, 255, 0.75);
}

#site_menu .set-link>a {
 color: rgba(255, 255, 255, 0.75);
 font-weight: bold;
}

#site_menu a:active {
 opacity: .7;
}

#site_menu a.active {
 opacity: .4;
}

#site_menu .close {
 display: none;
 color: rgba(255, 255, 255, 0.4);
 line-height: .85em;
 font-size: 45px;
}

body.mobile #site_menu .close {
 display: block;
 font-size: 50px;
 line-height: 1em;
}

#site_menu .break {
 height: 28px;
}

#site_menu .indent {
 margin-left: 28px;
}

/*
* Shop Button
*/

[data-css-preset] #shop_button {
 color: rgba(255, 255, 255, 1);
 background: transparent;
 font-size: 34px;
 font-style: normal;
 font-weight: 400;
 line-height: 1;
 position: fixed;
 padding: 6px;
 top: 1rem/*!shop_button*/
 ;
 right: 1rem/*!shop_button*/
 ;
}

#shop_button.text {
 font-size: 1.4rem;
 line-height: 1.3;
 font-family: "Space Mono", Icons;
 font-style: normal;
 font-weight: 400;
 padding: 0;
 line-height: 1.2;
}

#shop_button.custom_icon {
 width: 40px;
 height: auto;
}

body.mobile #shop_button:not(.text) {
 margin: -6px;
 font-size: 38px;
}

/*
* Shop Product Widget
*/

.shop_product {
 width: 100%;
 max-width: 22rem;
 position: relative;
 display: block;
}

.shop_product .price {
 font-family: "Space Mono", Icons;
 font-size: 1.4rem;
 line-height: 1;
 color: rgba(255, 255, 255, 0.6);
 display: block;
 margin-bottom: 1rem;
 font-style: normal;
 font-weight: 400;
}

.shop_product .dropdown {
 font-family: "Space Mono", Icons;
 font-size: 1.4rem;
 color: rgba(0, 0, 0, 0.9);
 display: inline-block;
 width: 100%;
 border: 1px solid rgba(255, 255, 255, .4);
 background: #ffffff url(https://static.cargo.site/assets/images/select-line-arrows.svg) no-repeat right;
 margin-bottom: 1rem;
 line-height: 1.2;
 padding: .7rem 2rem .7rem 1rem;
 font-style: normal;
 font-weight: 400;
}

.shop_product .button {
 font-family: "Space Mono", Icons;
 font-size: 1.4rem;
 background: rgba(255, 255, 255, 0.25);
 color: rgba(255, 255, 255, 1);
 flex: 0 0 50%;
 text-align: left;
 display: inline-block;
 line-height: 1;
 padding: .8rem 1rem .9rem;
 font-style: normal;
 font-weight: 400;
 border-bottom: none;
}

/*
* Image Zoom
*/

.content img.image-zoom:active {
 opacity: .7;
}

/**
* Quick View
*/

[data-css-preset] .quick-view {
 padding-top: 2.5rem/*!quick_view_padding*/
 ;
 padding-bottom: 2.5rem/*!quick_view_padding*/
 ;
 padding-left: 2.5rem/*!quick_view_padding*/
 ;
 padding-right: 2.5rem/*!quick_view_padding*/
 ;
 height: 100%/*!quick_view_height*/
 ;
 width: 100%/*!quick_view_width*/
 ;
}

body.mobile .quick-view {
 width: 100%;
 height: 100%;
 margin: 0;
}

[data-css-preset] .quick-view-background {
 background: rgba(0, 0, 0, 0.85)/*!quick_view_bgcolor*/
 ;
}

.quick-view-caption {
 font-family: "IBM Plex Mono", Icons;
 transition: 100ms opacity ease-in-out;
 position: absolute;
 bottom: 0;
 left: 0;
 right: 0;
 margin: 3.5rem 0;
 text-align: center;
 font-size: 1.2rem;
 font-style: normal;
 font-weight: 400;
}

.quick-view-caption span {
 padding: 0.5rem 1rem;
 display: inline-block;
 background: rgba(0, 0, 0, 0.5);
 color: white;
}

/**
* Quick View Navigation
*/

.quick-view-navigation .left-arrow {
 left: 10px;
}

.quick-view-navigation .right-arrow {
 right: 10px;
}

.quick-view-navigation .left-arrow,
.quick-view-navigation .right-arrow {
 /* Change height/width together to scale */
 height: 36px;
 width: 36px;
}

.quick-view-navigation .left-arrow .inner-color,
.quick-view-navigation .right-arrow .inner-color {
 stroke: #fff;
 stroke-width: 1.5px;
}

.quick-view-navigation .left-arrow .outer-color,
.quick-view-navigation .right-arrow .outer-color {
 stroke: #000;
 stroke-width: 2.5px;
 opacity: 0.6;
}

.quick-view-navigation .close-button {
 top: 10px;
 right: 10px;
 /* Change height/width together to scale */
 width: 36px;
 height: 36px;
}

.quick-view-navigation .close-button .inner-color {
 stroke: #fff;
 stroke-width: 1.5px;
}

.quick-view-navigation .close-button .outer-color {
 stroke: #000;
 stroke-width: 2.5px;
 opacity: 0.6;
}

/**
* Image Gallery Navigation Arrows
*/

.image-gallery-navigation .left-arrow,
.image-gallery-navigation .right-arrow {
 /* Change height/width together to scale */
 height: 36px;
 width: 36px;
}

.image-gallery-navigation .left-arrow .inner-color,
.image-gallery-navigation .right-arrow .inner-color {
 stroke: #fff;
 stroke-width: 1.5px;
}

.image-gallery-navigation .left-arrow .outer-color,
.image-gallery-navigation .right-arrow .outer-color {
 stroke: #000;
 stroke-width: 2.5px;
 opacity: 0.6;
}

/**
* Wallpaper Backdrop Navigation Arrows
*/

.wallpaper-navigation .left-arrow,
.wallpaper-navigation .right-arrow {
 /* Change height/width together to scale */
 width: 36px;
 height: 36px;
}

.wallpaper-navigation .left-arrow .inner-color,
.wallpaper-navigation .right-arrow .inner-color {
 stroke: #fff;
 stroke-width: 1.5px;
}

.wallpaper-navigation .left-arrow .outer-color,
.wallpaper-navigation .right-arrow .outer-color {
 stroke: #000;
 stroke-width: 2.5px;
 opacity: 0.6;
}

/**
* Feed
*/

.feed .content_container .page {
 border-top: 0px dashed rgba(0, 0, 0, 0.2);
}

.feed .content_container .page_container:first-child .page {
 border-top: 0;
}

/*
* Audio Player
*/

.audio-player {
 max-width: 36rem;
 height: 3.3rem;
 outline: 1px solid rgba(255, 255, 255, 0.14);
 color: rgba(255, 255, 255, 0.6);
 background: rgba(0, 0, 0, 0.4);
 font-size: 1.2rem;
 line-height: 1.3;
 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif, "Sans Serif", Icons;
 font-style: normal;
 font-weight: 400;
 text-align: left;
 margin: 1px 1px 1em 1px;
}

body.mobile .audio-player {
 max-width: 100%;
}

.audio-player .separator {
 width: 1px;
 background-color: rgba(255, 255, 255, 0.14);
}

.audio-player .button {
 background: transparent;
 cursor: pointer;
 fill: rgba(255, 255, 255, 0.85);
}

.audio-player .icon {
 fill: rgba(255, 255, 255, 0.75);
 padding: 30%;
 width: 100%;
 margin: auto;
}

.audio-player .buffer {
 background: rgba(255, 255, 255, 0.05);
}

.audio-player .progress {
 background: rgba(255, 255, 255, 0.09);
}

.audio-player .progress-indicator {
 border: 1px solid rgba(255, 255, 255, 0.7);
 width: 1px;
 height: 100%;
 right: 0;
 position: absolute;
 cursor: ew-resize;
}

.audio-player .note-icon {
 height: 100%;
 width: 3.8rem;
 padding: 1rem;
 fill: rgba(255, 255, 255, 0.6);
}

.audio-player .current-time {
 padding-left: 1rem;
}

.audio-player .total-time {
 padding-right: 1rem;
}