/*Space between the top of the page and the logo*/
#header > .wrapper::before {
    padding-top: 2.1%;
}

/*Display svg or png logo*/
.site-logo {
    display: block !important;
}

/*Logo adjustments*/

#logo {
    max-width: 100%;
}

#logo-container {
    width: 21%;
}

@media only screen and (max-width: 980px) {
    #logo-container {
        width: 26%;
    }
}

@media only screen and (max-width: 768px) {
    #logo-container {
        width: 33%;
    }
}

@media only screen and (max-width: 599px) {
    #logo-container {
        width: 45%;
    }
}

@media only screen and (max-width: 479px) {
    #logo-container {
        width: 53%;
    }
}

@media only screen and (max-width: 379px) {
    #header > .wrapper::before {
        padding-top: 5%;
    }
    #logo-container {
        width: 50%;
    }
}