/**
 * mobile.css
 * 
 * @author Roman Schlöricke
 * @created 16.07.25
 */
@media only screen and (max-width: 900px) {
    #header nav.main > div ul.menu li a::after {
        content: none;
    }

    #header .menu-icon {
        display: block;
        background-image: url("/template/borbet.de/menu.svg");
    }
    #MenuButton {
        display: none;
        top: 12px;
        right: 20px;
    }

    #MenuButton .line.top {
        top: 12px;
        display: block;
    }

    #MenuButton .line.middle {
        top: 19px;
    }

    #MenuButton .line.bottom {
        top: 26px;
        transform: rotate(0deg);
    }

    .ext_Shop .ArtikelSingle > form .artContent {
        display: grid;
        grid-template-columns: repeat(1,1fr);
        gap: 30px;
        margin-top: 50px;
    }

}
@media only screen and (max-width: 700px) {
    :root{
        --footerHeight: 770px;
    }
    #Consent {
        display: none;
    }


    #FooterWrapper #footer {
        justify-content: center;
        flex-wrap: wrap;
        gap: 20px;
    }

    #FooterWrapper #footer > *:not(.logo){
        width: 100%;
        text-align: center;
    }

    #FooterWrapper .logo{
        width: calc((100% / 4) - 10px );
        max-height: calc(var(--footerHeight) - 45px);
    }

    #header .firstline #infos {
        margin-top: 10px;
        flex-wrap: wrap;
    }

    #header .firstline #infos > *{
        margin: 0;
        order: 0;
    }

    #header .firstline #infos #quikbutton{
        order: 1;
        margin-top: 10px;
        width: 100%;
        justify-content: center;
    }

    #header .firstline{
        flex-direction: row-reverse;
    }

    #footer ul.menu li a {
        margin: 0 0 10px 0;
        padding: 0 !important;
    }

    #footer .socialmedia{
        flex-wrap: wrap;
        gap: 10px;
    }

    #footer .socialmedia > *{
        width: 100%;
        flex-wrap: wrap;
    }

    .ext_Mediatek #SearchForm{
        flex-wrap: wrap;
    }
}