body{
    color:#303030;
    font-family:'Inter', sans-serif;
    line-height:1.4
}
body h1,body h2,body h3,body h4{
    font-family:'Bebas Neue', sans-serif;
    line-height:1
}
body h2,body h3,body h4,body h5{
    letter-spacing:2px;
    text-transform:uppercase
}
body h1{
    display:none;
    font-size:3rem;
    font-weight:800;
    letter-spacing:2px;
    text-transform:uppercase
}
body h2{
    font-family:'Bebas Neue', sans-serif;
    font-size:3rem;
    font-weight:800
}
body h3,body h4{
    font-weight:700
}
body h3{
    font-size:2rem
}
body h4{
    font-size:1.5rem
}
body h5{
    font-weight:400
}
body h5,body p{
    font-size:1.25rem
}
body a{
    color:inherit
}
body a.btn{
    border:solid 1px;
    border-radius:0;
    color:inherit;
    font-size:inherit;
    padding:.5rem;
    text-transform:uppercase
}
body .nowrap{
    white-space:nowrap
}
body header{
    background-color:white;
    box-shadow:0 0 6px rgba(0,0,0,0.4);
    position:fixed;
    width:100%;
    top:0
}
body header nav .navbar-brand{
    background-image:url("../assets/img/logo-western-slang.png");
    background-position:center;
    background-repeat:no-repeat;
    background-size:contain;
    height:40px;
    width:60%
}
body header nav .navbar-toggler{
    border:0
}
body header nav .navbar-toggler .navbar-toggle-icon{
    width:30px;
    height:20px;
    position:relative;
    margin:0px;
    -webkit-transform:rotate(0deg);
    -moz-transform:rotate(0deg);
    -o-transform:rotate(0deg);
    transform:rotate(0deg);
    -webkit-transition:.5s ease-in-out;
    -moz-transition:.5s ease-in-out;
    -o-transition:.5s ease-in-out;
    transition:.5s ease-in-out;
    cursor:pointer
}
body header nav .navbar-toggler .navbar-toggle-icon span{
    display:block;
    position:absolute;
    height:3px;
    width:100%;
    border-radius:9px;
    opacity:1;
    left:0;
    -webkit-transform:rotate(0deg);
    -moz-transform:rotate(0deg);
    -o-transform:rotate(0deg);
    transform:rotate(0deg);
    -webkit-transition:.25s ease-in-out;
    -moz-transition:.25s ease-in-out;
    -o-transition:.25s ease-in-out;
    transition:.25s ease-in-out
}
body header nav .navbar-toggler .navbar-toggle-icon span{
    background:#303030
}
body header nav .navbar-toggler .navbar-toggle-icon span:nth-child(1){
    top:0px;
    -webkit-transform-origin:left center;
    -moz-transform-origin:left center;
    -o-transform-origin:left center;
    transform-origin:left center
}
body header nav .navbar-toggler .navbar-toggle-icon span:nth-child(2){
    top:10px;
    -webkit-transform-origin:left center;
    -moz-transform-origin:left center;
    -o-transform-origin:left center;
    transform-origin:left center
}
body header nav .navbar-toggler .navbar-toggle-icon span:nth-child(3){
    top:20px;
    -webkit-transform-origin:left center;
    -moz-transform-origin:left center;
    -o-transform-origin:left center;
    transform-origin:left center
}
body header nav .navbar-toggler .navbar-toggle-icon.open span:nth-child(1){
    -webkit-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -o-transform:rotate(45deg);
    transform:rotate(45deg);
    top:0px;
    left:8px
}
body header nav .navbar-toggler .navbar-toggle-icon.open span:nth-child(2){
    width:0%;
    opacity:0
}
body header nav .navbar-toggler .navbar-toggle-icon.open span:nth-child(3){
    -webkit-transform:rotate(-45deg);
    -moz-transform:rotate(-45deg);
    -o-transform:rotate(-45deg);
    transform:rotate(-45deg);
    top:21px;
    left:8px
}
body header nav .navbar-toggler:focus{
    box-shadow:none
}
body header nav .navbar-collapse{
    height:0vh;
    text-align:center;
    transition:height .125s
}
body header nav .navbar-collapse .navbar-nav .nav-item{
    padding:1rem 0
}
body header nav .navbar-collapse .navbar-nav .nav-item .nav-link{
    color:#303030;
    font-family:'Bebas Neue', sans-serif;
    font-size:2rem;
    font-weight:300;
    letter-spacing:3px;
    text-transform:uppercase
}
body header nav .navbar-collapse .navbar-nav .nav-item .nav-link:not(.dropdown-toggle):hover{
    text-decoration:underline
}
body header nav .navbar-collapse .navbar-nav .dropdown-menu{
    background-color:#101010;
    border-radius:0;
    padding:0
}
body header nav .navbar-collapse .navbar-nav .dropdown-menu .dropdown-item{
    color:white;
    font-size:.9rem;
    padding:.5rem 1rem
}
body header nav .navbar-collapse .navbar-nav .dropdown-menu .dropdown-item:hover{
    background-color:#ececec;
    color:#202020
}
body header nav .navbar-collapse .socials{
    font-size:.8rem;
    margin:30px 0;
    text-align:center
}
body header nav .navbar-collapse .socials ul{
    list-style:none;
    margin:0;
    padding:0
}
body header nav .navbar-collapse .socials ul li{
    display:inline;
    margin-right:1.5rem
}
body header nav .navbar-collapse .socials ul li a{
    text-decoration:none
}
body header nav .navbar-collapse .socials ul li a img{
    height:1.5rem
}
body header nav .navbar-collapse .socials ul li:first-child,body header nav .navbar-collapse .socials ul li:last-child{
    font-weight:800
}
body header nav .navbar-collapse .socials ul li:first-child:before{
    content:"~";
    margin-right:1.5rem
}
body header nav .navbar-collapse .socials ul li:last-child:after{
    content:"~";
    margin-left:1.5rem
}
body header nav .navbar-collapse.show{
    height:100vh
}
body header nav .navbar-collapse.show .navbar-nav{
    height:40%;
    justify-content:center
}
body header video{
    display:none
}
body main{
    min-height:100vh;
    margin-top:55px;
    padding:30px 0
}
body main .section-header{
    border-bottom:solid 1px;
    font-weight:700
}
body main .subhead{
    margin-top:3rem
}
body main section{
    margin:60px 0
}
body footer{
    padding:15px 0;
    text-align:center
}
body footer p{
    border-top:solid 1px;
    display:inline-block;
    font-size:.8rem;
    padding:1rem 2rem
}
body.home main{
    padding:0
}
body.home main h1{
    visibility:hidden
}
body.home main .hero-image{
    background-image:url("../assets/img/spirits-of-leisure.webp");
    background-size:33%;
    color:white;
    height:90vh;
    padding:0;
    width:100%
}
body.home main .hero-image .mask{
    background-color:rgba(0,0,0,0.55);
    height:100%
}
body.home main .hero-image .mask .hero-content{
    align-items:center;
    display:flex;
    flex-direction:column-reverse;
    justify-content:center
}
body.home main .hero-image .mask .hero-content .na{
    font-weight:200;
    text-transform:uppercase
}
body.home main .hero-image .mask .hero-content .album-name{
    font-size:4rem;
    font-weight:900;
    line-height:.8;
    text-transform:uppercase
}
body.home main .hero-image .mask .hero-content .of{
    display:inline-block;
    font-family:'Bitter', serif;
    font-size:1.5rem;
    font-style:italic;
    font-weight:200;
    margin-left:1rem;
    text-transform:none;
    vertical-align:super
}
body.home main .hero-image .mask .hero-content .platforms{
    margin-top:15px;
    text-align:center
}
body.home main .hero-image .mask .hero-content .platforms .listen-now{
    margin-bottom:5px
}
body.home main .hero-image .mask .hero-content .platforms a{
    margin-right:2rem;
    text-decoration:none
}
body.home main .hero-image .mask .hero-content .platforms a img{
    height:35px
}
body.home main .hero-image .mask .hero-content .platforms a:last-of-type{
    margin-right:0
}
body.home main .hero-image .mask .hero-content .album-cover{
    display:block;
    margin:0 auto 30px auto;
    width:85%
}
body.home main .hero-image .album{
    box-shadow:4px 10px 10px rgba(0,0,0,0.2);
    width:600px
}
body.home main section#about-the-band .row{
    flex-direction:column
}
body.home main section#about-the-band .row .band-photo{
    background-color:antiquewhite;
    height:300px;
    width:100%
}
body.page-not-found main .container{
    min-height:100vh;
    padding-top:20vh;
    text-align:center
}
body.page-not-found main .container p{
    font-size:2.5rem;
    line-height:1.2
}
body.fixed{
    overflow:hidden
}
@media screen and (min-width: 992px){
    body header{
        background-color:white;
        height:100px;
        overflow:hidden
    }
    body header .container{
        padding-top:14px;
        position:relative;
        z-index:100
    }
    body header nav .navbar-brand{
        background-image:url("../assets/img/logo-western-slang-white.png");
        height:50px;
        width:40%
    }
    body header nav .navbar-collapse .navbar-nav .nav-item{
        margin-right:1rem
    }
    body header nav .navbar-collapse .navbar-nav .nav-item .nav-link{
        font-size:1.5rem
    }
    body header nav .navbar-collapse .socials{
        margin:0
    }
    body header nav .navbar-collapse .socials ul li a img{
        height:1.25rem
    }
    body header nav .navbar-collapse .socials ul li:first-child:before{
        margin-right:1rem
    }
    body header nav .navbar-collapse .socials ul li:last-child:after{
        margin-left:1rem
    }
    body header video{
        display:initial;
        opacity:.7;
        position:absolute;
        top:-0px;
        transition:opacity .5s;
        width:100%;
        z-index:50
    }
    body header.simple .navbar-brand{
        background-image:url("../assets/img/logo-western-slang.png")
    }
    body header.simple video{
        opacity:0
    }
    body main{
        margin-top:100px
    }
    body.home main .hero-image{
        height:665px
    }
    body.home main .hero-image .mask .hero-content{
        display:flex;
        flex-direction:row;
        justify-content:space-evenly;
        padding:4% 0 0 1%
    }
    body.home main .hero-image .mask .hero-content .na{
        font-size:3rem
    }
    body.home main .hero-image .mask .hero-content .album-name{
        font-size:7rem
    }
    body.home main .hero-image .mask .hero-content .album-name .of{
        font-size:3rem
    }
    body.home main .hero-image .mask .hero-content .platforms{
        margin-top:50px
    }
    body.home main .hero-image .mask .hero-content .platforms .listen-now{
        font-size:1.5rem;
        font-weight:200
    }
    body.home main .hero-image .mask .hero-content .platforms a img{
        height:40px
    }
    body.home main .hero-image .mask .hero-content .album-cover{
        width:400px
    }
    body.home main .band-photo{
        height:600px;
        margin:auto;
        width:600px
    }
    body.page-not-found main .container p{
        font-size:4rem
    }
}
@media screen and (min-width: 1200px){
    body header nav .navbar-collapse .navbar-nav .nav-item{
        margin-right:3rem
    }
    body header nav .navbar-collapse .navbar-nav .nav-item .nav-link{
        font-size:2rem
    }
    body.home main .hero-image{
        background-size:25%
    }
    body.home main .hero-image .mask .hero-content .na{
        font-size:3rem
    }
    body.home main .hero-image .mask .hero-content .album-name{
        font-size:10rem
    }
    body.home main section#about-the-band .row{
        flex-direction:row
    }
    body.home main section#about-the-band .row .band-photo{
        height:600px;
        width:600px
    }
}
@media screen and (min-width: 1650px){
    body header nav .navbar-collapse .navbar-nav .nav-item{
        margin-right:5rem
    }
    body.home main .hero-image{
        height:900px
    }
    body.home main .hero-image .mask .hero-content{
        display:flex;
        flex-direction:row;
        justify-content:space-evenly;
        padding:4% 0 0 1%
    }
    body.home main .hero-image .mask .hero-content .na{
        font-size:3rem
    }
    body.home main .hero-image .mask .hero-content .album-name{
        font-size:14rem
    }
    body.home main .hero-image .mask .hero-content .album-name .of{
        font-size:3rem
    }
    body.home main .hero-image .mask .hero-content .platforms{
        margin-top:50px
    }
    body.home main .hero-image .mask .hero-content .platforms .listen-now{
        font-size:1.5rem;
        font-weight:200
    }
    body.home main .hero-image .mask .hero-content .platforms a img{
        height:40px
    }
    body.home main .hero-image .mask .hero-content .album-cover{
        width:600px
    }
    body.home main .band-photo{
        height:600px;
        margin:auto;
        width:600px
    }
}
/*# sourceMappingURL=main.css.map */