/* Big tablet to 1200px (widths smaller than the 1140px row) */
@media only screen and (max-width: 1200px) {

    /* Header */

    .navigation-container {
        width: 95%;
    }

    .navigation li a:link, .navigation li a:visited {
        font-size: 70%;
    }

    header img {
        width: 145.56px;
        height: 78.39px;
        margin-top: -8px;
    }

    .navigation {
        padding: 20px 20px 20px 0;
    }

    /* content */

    #guide {
        padding: 7em 1em 0 1em;
    }
}


/* Small tablet to big tablet: from 768px to 1023px */
@media only screen and (max-width: 1023px) {
    
    /* Header */

    .navigation {
        display: none;
    }

    .navigation-container {
        width: 90%;
    }

    .burger-menu-white-container {
        display: -webkit-box;
        display: flex;
    }

    .mobile-navigation-white {
        line-height: 40px;
    }

    .closebtn-white {
        font-size: 50px !important;
    }

    .mobile-navigation-white li a {
        font-size: 115%;
    }

    /* content */

    #guide__titles {
        display: none;
    }

    #side-menu-button {
        display: -webkit-box;
        display: flex;
    }

    #guide {
        padding: 5em 1em 0 0em;
    }

    #guide__content section {
        padding: 2rem 0 0 2rem;
    }

    .youtube {
        padding-top: 52.25%;
        width: 90%;
    }

    footer #separate_div{
        justify-content: center;
        padding-bottom: 20px;
        padding-right: 0px;
    }
}


/* Small phones to small tablets: from 481px to 767px */
@media only screen and (max-width: 767px) {
    .youtube {
        padding-top: 52.25%;
        width: 90%;
    }

    .mobile-navigation-white {
        line-height: 35px;
    }

    .closebtn-white {
        font-size: 35px !important;
    }

    .mobile-navigation-white li a {
        font-size: 83%;
    }
}


/* Small phones: from 0 to 480px */
@media only screen and (max-width: 480px) {
    
    /* header */

    .burger-menu-white {
        width: 35px;
    }

    header img {
        width: 133.56px;
        height: 71.94px;
    }

    .youtube {
        padding-top: 56.25%;
        width: 100%;
    }

    #side-menu-button {
        font-size: 45px;
        -webkit-box-flex: 0;
                flex: 0 0 40px;
    }

    #guide {
        font-size: 75%;
    }

    #guide__content p {
        line-height: 25px;
        padding-left: 0px;
    }

}