:root {            
                --main-font: #4a4a4a;
                --accent-color: #CC6326;
            }

            body {
              background: #000 url(/shrines/monkey/mi_carnival.png) fixed;
              background-size: cover;
              font-family: 'ONE SIZE';
              color: #000;
              font-size: 15px;
              line-height: 130%;
            }
            
            strong, b {
              color: #962A18;
              font-weight: 600;
            }
            
            i, em {
              color: #4A264B;
              font-style: italic;
            }
            
            .credits li {
              list-style-image: url('/shrines/monkey/bullet_rum.png');
            }
            
            .credits ul {
              padding: 0 25px;
            }

            html, a, a:visited { 
              color: #724C1E;
              text-decoration: none;
              cursor:url('/shrines/monkey/cur_sword.png'), auto;
              -webkit-transition: all 0.3s;
              -moz-transition: all 0.3s;
              -ms-transition: all 0.3s;
              -o-transition: all 0.3s;
              transition: all 0.3s;
            }
            
            a:hover {
              color: #CF4B4D;
              text-decoration: none;
              letter-spacing: 0.2em;
              cursor: url('/shrines/monkey/cur_swordhelp.png'), auto;
              -webkit-transition: all 0.3s;
              -moz-transition: all 0.3s;
              -ms-transition: all 0.3s;
              -o-transition: all 0.3s;
              transition: all 0.3s;
            }
            
            ::-moz-selection{
                background: var(--accent-color);
                color: #E5E3DB;
            }
 
            ::selection{
                background: var(--accent-color);
                color: #E5E3DB;
            }
            
            @font-face {
              font-family: "Caslon Antique";
              src: url("/fonts/CaslonAntique.ttf");
            }

            @font-face {
              font-family: "ONE SIZE";
              src: url("/fonts/ONESIZE.ttf");
            }
            
            main {
              background-image: url('/shrines/monkey/bg_treasurechest.png');
              background-size: cover;
              margin-top: 20px;
              position: relative;
              left: 50%;
              transform: translateX(-50%);
              width: 63vw;
              height: 91vh;
            }

            section {
              position: absolute;
              top: 50%;
              left: 50%;
              transform: translate(-40%, -50%);
              width: 35vw;
              height: 60vh;
              overflow: auto;
              padding: 20px;
              background-color: rgba(239,192,92,0.8);
              border: 3px solid #a04315;
            }
            
            nav {
              position: absolute;
              top: 47vh;
              left: 12vw;
              transform: translate(-50%, -50%);
              width:7vw;
              height: 50vh;
              overflow: auto;
              padding: 10px;
              background-color: rgba(239,192,92,0.8);
              border-top: 3px solid #a04315;
              border-bottom: 3px solid #a04315;
              border-left: 3px solid #a04315;
              font-size: 11px;
            }
            
            nav li, ul {
              list-style-type: none;
              position: relative;
              padding-left: 0;
            }
            
            nav li {
              margin-bottom: 5px;
            }
            
            nav li:last-of-type {
              margin-bottom: 0;
            }
            
           /* nav li:before {
              content: url('/shrines/monkey/xmarks.png');
              position: absolute;
              left: 0;
            }
            
            nav li:hover {
              content: url('/shrines/monkey/xmarksv2.png');
            } */
            
            nav a {
              position: relative;
              padding-left: 20px;
            }
            
            nav a:hover {
              letter-spacing: 0;
              text-decoration-style: wavy;
              text-decoration-color: var(--accent-color);
            }
            
            nav a:before {
              content: url('/shrines/monkey/xmarks.png');
              position: absolute;
              left: 0;
              bottom: -105%;
            }
            
            nav a:hover:before {
              content: url('/shrines/monkey/xmarksv2.png');              
            }

            #welcome-banner {
              float: left;
              position: absolute;
              top: 5vh;
              left: 1vw;
              z-index: 1000;
              transform: rotate(-9deg);
            }

            #welcome-banner img {
              width: 400px;
            }
            
            #back-button {
              float: right;
              position: absolute;
              top: 13vh;
              right: -13vw;
              z-index: 1000;
              width: 400px;
              transform: rotate(15deg);
            }

            #back-button img {
              width: 140px;
            }
            
            #accessory1 {
              float: right;
              position: absolute;
              bottom: 10vh;
              left: 52vw;
              z-index: 1000;
            }
            
            #accessory2 {
              float: left;
              position: absolute;
              bottom: 13vh;
              right: 54vw;
              z-index: 1000;
            }

            h1 {
              font-family: 'Caslon Antique';
              font-size: 35px;
              color: #FEC32A;
              text-shadow: -1px 0  var(--accent-color), 0 1px  var(--accent-color), 1px 0  var(--accent-color), 0 -1px  var(--accent-color);
              text-align: center;
              letter-spacing: 0.1em;
              line-height: 130%;
            }
            
            h2 {
              font-family: 'Caslon Antique';
              font-size: 25px;
              text-align: center;
              color: #FEC32A;
              text-shadow: -1px 0  var(--accent-color), 0 1px  var(--accent-color), 1px 0  var(--accent-color), 0 -1px  var(--accent-color);
            }
            
            h3 {
              font-family: 'Caslon Antique';
              font-size: 15px;
              text-align: center;
              color: #F5B758;
              text-shadow: -1px 0  #28110F, 0 1px  #28110F, 1px 0  #28110F, 0 -1px  #28110F;
              letter-spacing: 0.1em;
            }
            
            .hr {
              display: block;
              margin: 20px auto 10px;
              text-align: center;
            }

/* MUSIC PLAYER */

 #glenplayer02 {
              position:fixed;
              bottom:0;
              margin-bottom:10px;
              margin-left:10px;
              display:flex;
              z-index:99;
            }
            
            #glenplayer02 a {
              text-decoration:none;
            }

            #glenplayer02 > div {
              align-self:center;
              -webkit-align-self:center;
            }

            .music-controls {
              user-select:none;
              -webkit-user-select:none;
              -moz-user-select:none;
              -ms-user-select:none;
              width:22px;
              font-size:16px;
              cursor:pointer;
            }

            .playy, .pausee {
              -webkit-background-clip: text;
              -webkit-text-fill-color: var(--accent-color);
              -webkit-text-stroke-width: 1px;
              -webkit-text-stroke-color: var(--accent-color);
              font-size: 22px;
              border-bottom: none;
            }

            .pausee {
              display:none;
            }