body {
    margin: 0;
}

.mega-div {
    width: 100vw; 
    height: 100vh; 
    background-color:#A3593E;
}

.home {
    width: 100%; 
    height: 59vw; 
    background-color: #A3593E; 
    background-image: url(images/woodbg.png); 
    background-size:cover;
    align-items: center;
    justify-content: center;
}
h1 {
    font-weight: normal; 
    line-height:10vw; 
}
h2 {
    font-weight: normal; 
    margin-top: 0; 
    line-height:10vw; 


}
.home-header {
    width: 50%; 
    height: 58vw; 
    float: right; 
}

.rollie-pollie {
    width: 99%; 
    height: 15vw; 
    font-size: 3.6vw; 
    font-family: "espiritu-expanded", sans-serif;
    font-weight: 400;
    font-style: normal;
    text-align: center;  
    color: #F0AD32; 
    line-height:10vw; 

}

.rollie-pollie h1 {
    margin-top: .5vw; 
    line-height:8vw; 

}

.radio {
    width: 99%; 
    height: 23vw; 
    font-size: 13.5vw; 
    font-family: "espiritu-condensed", sans-serif;
    font-weight: 400;
    font-style: normal;
    text-align: center; 
    color: #9CD9A4; 
    line-height:9vw; 

}

.radio h1 {
    margin-top: 2vw; 
    line-height:27vw; 

}

.with-host {
    width: 99%; 
    height: 5vw; 
    font-size: 2.8vw;
    font-family: "espiritu-expanded", sans-serif;
    font-weight: 400;
    font-style: normal;
    text-align: center; 
    color: #9CD9A4; 
}

.with-host h2 {
    margin-top: 1vw;
    line-height:7vw; 

}

.julia-ferrara {
    width: 99%; 
    height: 11vw; 
    font-size: 6.7vw;
    font-family: "espiritu-condensed", sans-serif;
    font-weight: 400;
    font-style: normal;
    text-align: center; 
    color: #F0AD32; 
    margin-top: 2vw; 
}
.julia-ferrara h2 {
    margin-top: 1vw; 
}

.spinning-record {
    width: 55vw; 
    height: 55vw; 
    position: absolute; 
    z-index: 2; 
    margin-top: 1.5vw; 
    margin-left: 2.5vw; 
    animation-name: spin;
    animation-duration: 10s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
@keyframes spin {
from {transform:rotate(360deg);}
to {transform:rotate(0deg);}

}

.playlist{ 
    width: 100vw; 
    height: 15vw; 
    background-color:#9CD9A4; 
    background-image:url(images/playlistbackgroundbutton.png);
    background-size:cover;
    transition: height 0.5s;
    -webkit-transition: height 0.5s;
    text-align: center;
    overflow: hidden;
  }
  .playlist:hover {
    height: 23.5vw;
      width: 100%;
}

.support{ 
    width: 100vw; 
    height: 15vw; 
    background-color:#9CD9A4; 
    background-image:url(images/supportbackgroundbutton.png);
    background-size:cover;
    transition: height 0.5s;
    -webkit-transition: height 0.5s;
    text-align: center;
    overflow: hidden;
  }
  .support:hover {
    height: 23.5vw;
      width: 100%;
}
.im-buggin-home {
    width: 100vw; 
    height: 59vw; 
    background-color: #9CD9A4; 
}

.top-bar {
    width: 99vw; 
    height: 23vw; 
}

.logo {
    width: 19.5vw; 
    height: 19.5vw; 
    margin-top: 3vw; 
    margin-left: 1.5vw; 
    float: left; 
}

.buggin-header {
    width: 75vw; 
    height: 20vw; 
    float: right; 
    margin-top: 2vw; 
    font-size: 15vw; 
    font-family: "espiritu-condensed", sans-serif;
    font-weight: 400;
    font-style: normal;
    text-align: right; 
    color: #A3593E; 
}

.buggin-header h2 {
    text-decoration: none; 
    font-weight: normal; 
    margin-top: 2vw; 
    line-height:18vw; 

}

.bottom-bar {
    width: 99.9vw; 
    height: 34vw; 
    margin-top: 1vw; 

}

.bottom-left {
    width: 33vw; 
    height: 100%; 
    float: left; 
}

.buggin-menu {
    width: 94%; 
    height: 15vw; 
    margin-left: 2vw; 
    font-family: "espiritu-expanded", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 2vw; 
    color: #A3593E; 
}

        .buggin-item-1 {
            width: 20vw; 
            height: 4vw; 
            margin: 2vw; 

        }
        .buggin-item-2 {
            width: 20vw; 
            height: 4vw; 
            margin: 2vw; 
        }
            .buggin-menu li a {
                text-decoration-line: none; 
                color: #A3593E; 
                text-align: left; 

            }

            li {
                list-style: none;
            }

.buggin-copy {
    width: 99.9%; 
    height: 50%; 
    margin-left: 0vw; 
    font-size: 1.5vw; 
    font-family: "espiritu", sans-serif;
    font-weight: 400;
    font-style: normal;
    background-color:#A3593E; 
    color:#9CD9A4;  
    float: right; 
}
 .buggin-copy p {
    margin-left: 2vw; 
    font-weight: normal; 
    line-height: 2vw; 
}

.buggin-bottom-right {
    width: 66.9vw; 
    height: 35vw; 
    float: left; 
    background-color: #220B42;
}











/* BEGIN SUPPORT PAGE */ 

.support-mega-div-page {
    width: 100vw; 
    height: 100vw; 
    background-color:#220B42; 
}

.support-home {
    width: 100vw; 
    height: 59vw; 
    background-color:#220B42; 
}

.top-bar {
    width: 99vw; 
    height: 22vw; 
}

.logo {
    width: 19.5vw; 
    height: 19.5vw; 
    margin-top: 1vw; 
    margin-left: 1.5vw; 
    float: left; 
}

.support-header {
    width: 75vw; 
    height: 20vw; 
    float: right; 
    margin-top: 2vw; 
    font-size: 15vw; 
    font-family: "espiritu-condensed", sans-serif;
    font-weight: 400;
    font-style: normal;
    text-align: right; 
    color:#4A8A6D; 
}

.support-header h2 {
    text-decoration: none; 
    font-weight: normal; 
    margin-top: 3vw; 
    line-height: 18vw; 

}

.bottom-bar {
    width: 99.9vw; 
    height: 36vw; 
    margin-top: 1vw; 


}

.bottom-left {
    width: 33vw; 
    height: 100%; 
    float: left; 
}

.support-menu {
    width: 94%; 
    height: 15vw; 
    margin-left: 2vw; 
    font-family: "espiritu-expanded", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 2vw; 
    color: #4A8A6D; 
}

        .support-item-1 {
            width: 20vw; 
            height: 4vw; 
            margin: 2vw; 

        }
        .support-item-2 {
            width: 20vw; 
            height: 4vw; 
            margin: 2vw; 
        }
            .support-menu li a {
                text-decoration-line: none; 
                color: #4A8A6D; 
                text-align: left; 


            }

            li {
                list-style: none;
            }

.support-copy {
    width: 100%; 
    height: 50%; 
    margin-left: 0vw; 
    font-size: 1.5vw; 
    font-family: "espiritu", sans-serif;
    font-weight: 400;
    font-style: normal;
    background-color:#4A8A6D; 
    color:#9CD9A4; 
    float: right; 
}
 .support-copy p {
    margin-left: 2vw; 
    font-weight: normal; 
    line-height: 2vw; 
}

.a-bug {
    width: 66vw; 
    height: 11vw; 
    float: left; 
    font-family: "espiritu-expanded", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 10vw; 
    color: #4A8A6D; 
    text-align: right; 
    line-height: 10vw; 

}

 .a-bug p{
    margin-top:0vw; 
    margin-right: 1vw; 
}

.support-bottom-right {
    width: 66vw; 
    height: 24vw; 
    float: left; 
    background-color:#A3593E;
    border: 0.05vw solid #9CD9A4; 
}
.support-row-1 {
    width: 100%; 
    height: 19%; 
    border: 0.05vw solid #9CD9A4; 
}
.support-row-2 {
    width: 100%; 
    height: 19%; 
    border: 0.05vw solid #9CD9A4; 
}.support-row-3 {
    width: 100%; 
    height: 19%; 
    border: 0.05vw solid #9CD9A4; 
}.support-row-4 {
    width: 100%; 
    height: 19%; 
    border: 0.05vw solid #9CD9A4; 
}.support-row-5 {
    width: 100%; 
    height: 22.5%; 
    border: 0.05vw solid #9CD9A4; 
}

.support-bottom-right .left-side-of-rows {
    width: 49%; 
    height: 99%; 
    float: left; 
    font-size: 1vw; 
    font-family: "espiritu-expanded", sans-serif;
    font-weight: 400;
    font-style: normal;
    text-align: left; 
    color:#9CD9A4; 
    margin-bottom: 0vw; 
    line-height: 1vw; 

}

.support-bottom-right .left-side-of-rows p {
    margin-top: 3.75vw; 
    margin-left: 1vw; 

}
.support-bottom-right .right-side-of-rows {
    width: 49%; 
    height: 99%; 
    float: right; 
    font-size: 2vw; 
    font-family: "espiritu-condensed", sans-serif;
    font-weight: 400;
    font-style: normal;
    text-align: right; 
    color:#9CD9A4; 
    margin-bottom: 0vw; 
    line-height: 1.8vw; 

}

.support-bottom-right .right-side-of-rows p {
    margin-top: 3.05vw; 
    margin-right: 1vw; 

}


/*END SUPPORT PAGE */ 
/* START PLAYLIST PAGE */ 

.playlist-mega-div-page {
    width: 100vw; 
    height: 100vw; 
    background-color:#4A8A6D; 
}

.playlist-home {
    width: 100vw; 
    height: 59vw; 
    background-color:#4A8A6D; 
}


.playlist-header {
    width: 75vw; 
    height: 20vw; 
    float: right; 
    margin-top: 4vw; 
    font-size: 15vw; 
    font-family: "espiritu-condensed", sans-serif;
    font-weight: 400;
    font-style: normal;
    text-align: right; 
    color:#220B42; 
}

.playlist-header h2 {
    text-decoration: none; 
    font-weight: normal; 
    margin-top: 1.5vw; 
    line-height: 18vw; 

}


.playlist-menu {
    width: 94%; 
    height: 15vw; 
    margin-left: 2vw; 
    font-family: "espiritu-expanded", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 2vw; 
    color:#220B42; 
}

        .playlist-item-1 {
            width: 20vw; 
            height: 4vw; 
            margin: 2vw; 

        }
        .playlist-item-2 {
            width: 20vw; 
            height: 4vw; 
            margin: 2vw; 
        }
            .playlist-menu li a {
                text-decoration-line: none; 
                color:#220B42; 
                text-align: left; 


            }


.playlist-copy {
    width: 100%; 
    height: 50%; 
    margin-left: 0vw; 
    font-size: 1.3vw; 
    font-family: "espiritu", sans-serif;
    font-weight: 400;
    font-style: normal;
    background-color:#220B42; 
    color:#9CD9A4; 
    float: right; 
}
 .playlist-copy p {
    margin-left: 2vw; 
    font-weight: normal; 
    line-height: 2vw; 
}


.playlist-bottom-right {
    width: 66.5vw; 
    height: 35vw; 
    float: left; 
    background-color:#9CD9A4;
    border: 0.05vw solid #220B42; 

}

.playlist-row-1 {
    width: 100%; 
    height: 12.5%; 
    border: 0.05vw solid #220B42; 
}

.playlist-row-2 {
    width: 100%; 
    height: 12.5%; 
    border: 0.05vw solid #220B42; 
}.playlist-row-3 {
    width: 100%; 
    height: 12.5%; 
    border: 0.05vw solid #220B42; 
}.playlist-row-4 {
    width: 100%; 
    height: 12.5%; 
    border: 0.05vw solid #220B42; 
}.playlist-row-5 {
    width: 100%; 
    height: 12.5%; 
    border: 0.05vw solid #220B42; 
}

.playlist-row-6 {
    width: 100%; 
    height: 12.5%; 
    border: 0.05vw solid #220B42; 
}

.playlist-row-7 {
    width: 100%; 
    height: 12.5%; 
    border: 0.05vw solid #220B42; 
}

.playlist-row-8 {
    width: 100%; 
    height: 11%; 
    border: 0.05vw solid #220B42; 
    background-color:#9CD9A4;
}

.playlist-bottom-right .left-side-of-rows {
    width: 49%; 
    height: 99%; 
    float: left; 
    font-size: 1vw; 
    font-family: "espiritu-expanded", sans-serif;
    font-weight: 400;
    font-style: normal;
    text-align: left; 
    color:#220B42; 
    margin-bottom: 0vw; 
    line-height: 1vw; 

}

.playlist-bottom-right .left-side-of-rows p {
    margin-top: 3.65vw; 
    margin-left: 1vw; 

}
.playlist-bottom-right .right-side-of-rows {
    width: 49%; 
    height: 99%; 
    float: right; 
    font-size: 2.5vw; 
    font-family: "espiritu-script", sans-serif;
    font-weight: 400;
    font-style: normal;
    text-align: right; 
    color:#220B42; 
    margin-bottom: 0vw; 
    line-height: 2.1vw; 

}

.playlist-bottom-right .right-side-of-rows p {
    margin-top: 2.5vw; 
    margin-right: 1vw; 

}