@font-face {
    font-family:'Pixel';
    src: url(fonts/Pixel.otf)
}  

@media screen and (min-width: 801px) {

.header {
 color: white;
 top: 6vw;
 left: 3vw;
 font-size:10vw;
 font-family:'Pixel';
 position: absolute;
 }
 
 .songs {
 color: white;
 font-size:2.5vw;
 font-family:'Pixel';
 list-style-type: none;
 top: 24vw;
 left: 3vw;
 position: absolute;
 }

a:link,
a:visited,
a:hover,
a:active {
  color: white;
}

.songsheader {
 color: white;
 text-decoration: underline;
 font-size:3.5vw;
 top:18vw;
 font-family:'Pixel';
 position:absolute;
}

.player {
width: 100%;
top: 0vw;
left: 0vw;
position: fixed;
}
#playlist,audio{width:100vw;}

.bio {
 text-indent: 4vw;
 color: white;
 font-size:1.7vw;
 font-family:'Pixel';
 width: 55vw;
 right: 12vw;
 top: 25vw;
 position: absolute;
 }
 
.bottom {
  top: 70vw;
  position: absolute;
}

}
@media (max-width:800px) {
html, body {
height: 100%;
overflow-x: hidden;
overflow-y: auto; 
}

.header {
 color: white;
 text-align: center;
 font-size:10vw;
 font-family:'Pixel';
 top:20vw;
 margin: auto;
 }
 
 .songs {
 color: white;
 font-size:6vw;
 font-family:'Pixel';
 list-style-type: none;
 list-style-position: inside;
 }

a:link,
a:visited,
a:hover,
a:active {
  color: white;
}

.player {
width: 100%;
bottom: 0vw;
left: 0vw;
position: fixed;
}
#playlist,audio{width:100vw;}

.songsheader {
 color: white;
 text-decoration: underline;
 font-size:10vw;
 font-family:'Pixel';
 text-align: center;
 justify-content: center;
 margin: auto; 
  
}  
.bio {
 text-indent: 3.2vw;
 color: white;
 width: 70vw;
 font-size:4vw;
 font-family:'Pixel';
 text-align: center;
 justify-content: center;
 margin: auto;
 
 }
 
.bottom {
  top: 320vw;
}

}