/*sizes nav*/

body {
    --burger-line-height: 5px;
    --nav-icon-height: 31px;
    --nav-icon-width: 68px;
    --nav-icon-padding-X: 2.4vw;
    --nav-icon-padding-Y: 3.1vw;
}


/*color*/

:root {
    --basic: #363636;
    --purple: #642062;
    --dunkelgrau: #363636;
    --hellgrau: #F2F2F2;
    --mainfont: Rubik;
    --margin-bottom-row: 8vw;
    --padding-mehr-abstand: 3vw;
    --after-font-size: 2.37rem;
    --afer-padding-Y: 0.7em;
}


/*VC*/

@media (min-width: 1920px) {
    /*----------------- ELEMENT -------------*/
    /*----------------- END ELEMENT ---------*/
}

@media (max-width: 1700px) {
    :root {
        --after-font-size: 1.67rem;
    }
}

@media (max-width: 1500px) {
    :root {
        --after-font-size: 1.47rem;
    }
}

@media (max-width: 1200px) {
    /*----------------- ELEMENT -------------*/
    /*----------------- END ELEMENT ---------*/
}

@media (max-width: 990px) {
    body {
        --nav-icon-padding-Y: 35px;
    }

    :root {
        --after-font-size: 1.27rem;
    }
}

@media (max-width: 767px) {
    /*----------------- ELEMENT -------------*/
    /*----------------- END ELEMENT ---------*/
}

@media (max-width: 576px) {
    :root {
        --after-font-size: 18px;
        --margin-bottom-row: 13vw;
    }

    body {
        --burger-line-height: 4px;
        --nav-icon-height: 22px;
        --nav-icon-width: 44px;
        --nav-icon-padding-X: 5vw;
        --nav-icon-padding-Y: 25px;
    }

}

@media (max-width: 420px) {

    #theme-logo {
        width: 195px;
        margin-right: 7vw;
    }
}

@media (max-width: 320px) {
    /*----------------- ELEMENT -------------*/
    /*----------------- END ELEMENT ---------*/
}