@font-face {
    font-family: MicrogrammaBold;
    src: url(../assets/Microgramma\ D\ Extended\ Bold.otf);
    font-weight: bold;
}

@font-face {
    font-family: Microgramma;
    src: url(../assets/Microgramma\ D\ Extended\ Medium.otf);
}

body {
    background-color: transparent !important;
    color: #000 !important;
}

p {
    margin: 0;
}

a {
    color: goldenrod;
}

.logo {
    bottom: 200px !important;
}
.player {
    bottom: 100px !important;
}
.chevron {
    bottom: 20px !important;
}

.text {
    font-family: Microgramma;
    font-size: large;
    color: goldenrod;
    padding: 5rem;
    padding-top: 10rem;
}

.lyrics-song-title {
    font-family: Microgramma;
    font-size: large;
    font-weight: bolder;
    color: goldenrod;
    -webkit-text-stroke: 0.2px #bbb;
}

.manifesto {
    font-family: MicrogrammaBold;
    font-size: large;
}

.nav-text-button {
    font-family: MicrogrammaBold;
    font-size: x-large;
    color: goldenrod;
    -webkit-text-stroke: 0.2px #bbb;
}
.nav-text-button:hover, .nav-text-button:focus {
    color: bisque;
    -webkit-text-stroke: 0.2px #bbb;
}

.nav-text-button-active {
    font-family: MicrogrammaBold;
    font-size: x-large;
    color: bisque;
    -webkit-text-stroke: 0.2px #bbb;
}

.nav-text-button-active:hover, .nav-text-button-active:focus {
    color: bisque;
    -webkit-text-stroke: 0.2px #bbb;
}

#bg-video {
    position: fixed;
    right: 0;
    bottom: 0;
    height: auto;
    width: 100%;
    min-height: 100%;
    max-width: 100%;
    z-index: -1;
}

button {
    outline: none !important;
    border: none !important;
    box-shadow: none;
}

.invert {
    -webkit-filter: invert(100%); /* safari 6.0 - 9.0 */
    filter: invert(100%);
}

.scrubber {
    height: 0.1rem;
}
.scrubber_fill {
    height: 0.2rem;
}

.footer-text {
    font-family: Microgramma;
    font-size: 1vw;
    color: goldenrod;
}

footer {
    padding-left: 5rem !important;
    padding-right: 5rem !important;
    padding-bottom: 3rem !important;
    padding-top: 3rem !important;
}

@media (max-width: 992px) {

    .logo {
        bottom: 300px !important;
    }
    .player {
        bottom: 200px !important;
    }
    .chevron {
        bottom: 100px !important;
    }

    .navbar {
        flex-flow: row nowrap;
    }

    .nav-container {
        height: 85px;
    }

    .navbar-nav {
        flex-flow: row nowrap;
        display: inline-flex;
    }

    .navbar-collapse.collapsing {
        -webkit-transition: height 0.01s;
        -moz-transition: height 0.01s;
        -ms-transition: height 0.01s;
        -o-transition: height 0.01s;
        transition: height 0.01s;
    }

    .navbar-toggler:not(.collapsed) {
        rotate: 90deg;
    }
    
    .navbar-toggler {
        outline: none !important;
        border: none !important;
        box-shadow: none !important;

        display: flex;
        align-items: center;
    }

    .navbar-toggler-icon {
        background-color: goldenrod !important;
    }

    .nav-item:first-child {
        padding-left: 2.75rem !important;
        padding-right: 1.9rem !important;
    }

    .nav-item {
        padding-left: 2.75rem !important;
        padding-right: 2.75rem !important;
        padding-bottom: .8rem !important;
    }

    .nav-text-button, .nav-text-button-active {
        font-size: xxx-large;
    }

    .email {
        width: 85px;
        height: 85px;
        padding-top: 0;
        padding-bottom: 0;
    }
    .sc {
        width: 65px;
        height: 65px;
    }
    .bc {
        width: 55px;
        height: 55px;
    }
    
    .video-container video {
        min-height: 120%; 
    }

    .name {
        padding-bottom: 4rem !important;
        max-width: 80% !important;
    }

    .manifesto {
        max-height: 70vh !important;
    }
    .lyrics {
        max-height: 70vh !important;
        padding-right: 1rem;
    }

    p {
        font-size: 4vw !important;
        -webkit-text-stroke: 0.5px black;
        
    }

    p.footer-text {
        font-size: 1vw !important;
        -webkit-text-stroke: 0;
    }
    
    .text-headers {
        font-size: 6vw !important;
        padding-top: 15px !important;
        padding-bottom: 15px !important;
        -webkit-text-stroke: 0.6px black;
    }

    .play {
        font-size: 4.4rem !important;
    }
    .scrubber {
        height: 0.3rem !important;
    }
    .scrubber_fill {
        height: 0.6rem !important;
    }
    .time_elapsed {
        font-size: 1.45rem !important;
    }

    .btn:active, .btn:focus {
        background-color: transparent;
    }

}