@font-face {
     font-family: times new roman;
   
}
 a {
     display: inline-block;
     transition: .3s ease;
     z-index: 40;
}
 a:hover {
     transform: translateY(-9%);
     z-index: 40;
}
 body {
     background-color: #e4e4e4;
     background-repeat: repeat;
     background-size: 8em;
     width: 48em;
     margin: auto;
     margin-top: 5em;
     font-size: 0.9em;
     text-shadow: 1px 1px 1px #000, 
               3px 3px 5px beige; 
}
 #main {
     background-color: #F3F1EB;
     border: 4px double #e9e9e9;
     border-radius: 6px;
     height: auto;
     font-size: 1.3em;
     text-align: center;
     font-family: byte;
     padding: 6px;
     line-height: 1em;
     overflow: hidden;
}
 #main iframe {
     width: 95%;
     border: 1px solid black;
     height: 22em;
}
 #nav {
     border: 1px solid black;
     width: 85%;
     border-radius: 6px;
     position: sticky;
     top: 0;
     background: white;
     padding: 4px;
     margin: auto;
}
 a:link {
     color: #3266a8;
     text-decoration: none;
}
 a:visited {
     color: #3266a8;
     text-decoration: none;
}
 a:hover {
     color: #3266a8;
     text-decoration: none;
}
 a:active {
     color: #3266a8;
     text-decoration: none;
}
 h1 {
     font-size: 1.8em;
}
 * {
     scrollbar-width: auto;
     scrollbar-color: #3266a8;
}


::-webkit-scrollbar {
  width: 6px;
}


::-webkit-scrollbar-track {
  background: #66023c; 
}
 

::-webkit-scrollbar-thumb {
  background: #e6e6e6; 
}


::-webkit-scrollbar-thumb:hover {
  background: #555; 


}
 #music {
     position:absolute;
     z-index:10;
     margin-top:-4em;
     margin-left:31em;
     height:3em;
     width:17em;
}
 #back {
     text-align:center;
}
 #back img{
     width: 9em;
     margin-top: 0.5em;
}
 #main #nav {
     width: 96%;
     font-size: 0.9em;
}
 #main #nav a {
     padding: 4px 8px;
     margin: 0.1em 0;
     border: 1px solid #3266a8;
     border-radius: 0.5em;
     color: #3266a8!important;
}
 @media screen and (max-width: 799px) {
     body {
         width: 100%;
         margin: 0;
         padding: 0;
         font-size: 1em;
    }
     #main {
         font-size: 1em;
         position: relative;
         display: block;
         width: 92%;
         margin: 1em auto auto auto;
         height: auto;
    }
     #main h1 {
         line-height: 1em;
    }
}