/*
    RESPONSIVE
*/
@media (max-width:1114px) {
    body:not(.noscroll) .header-sidebar-wrap .hamburger-menu .hamburger-icon{
        width:31px;
    }
    
    header .widget_nav_menu ul li:hover a{
        font-size: inherit;
    }
    header .widget_nav_menu.menu-open {
        transform: translateX(0) !important;
    }

    body .mbgi-block-akkordeon .akkordeon-wrap > p:after{
        opacity: 1;
    }
}

@media (max-width:1024px) {
    .flip-gallery.alignwide{
        width: 100%;
        left: 0;
        }
        .flip-gallery .wp-block-column {
            width: 130px;
            height: 130px;
        }

    .coworking-preise > div p:nth-child(1){
        font-size: 22px;
    }
    .coworking-preise > div p:nth-child(2){
        font-size: 32px;
    }

    .ueber-den-bunker-hero-bild {
        right:-30%
    }
    
    .scroll-to-top-button-wrap{
        background: var(--brigthBlue);
    }
}

@media (max-width:834px) {
    :root{
        --singleAbststandSeite:40px
    }

    .referenzen-animation > div > div.wp-block-columns:nth-child(odd) > div:first-child{
        order: 1;
    }

    .loop.person article {
        padding: 0 0 40px;
    }
    .loop-wrapper .loop-meta-info{
        margin-bottom: 40px;
    }

    .coworking-preise{
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    
    /*Mehr-Button*/
    body > .hover-cursor{
        display:none;
    }

    /*Formular*/
    .submit-container .nf-field-element {
        text-align: center;
    }
}

@media (max-width:768px) {
    /*Logo/Menü*/
    header .header-sidebar-wrap #block-7 > div {
        gap: 10px;
    }
    
    header .header-sidebar-wrap #block-7 > div > div:nth-child(2){
        order: -1;
        display: block;
        max-width:31px;
        min-width:31px
        }
        .header-sidebar-wrap .modulbuero-logo, .header-sidebar-wrap .modulbuero-logo svg{
            width:31px
        }
    
    .header-sidebar-wrap.hamburger-on .hamburger-menu{
        position: relative;
        top:0;
        min-width: 100px;
    }
    
    /*Architektur*/
    .flip-gallery.wp-block-columns:not(.is-not-stacked-on-mobile)>.wp-block-column{
        flex-basis: auto !important;
    }
    .flip-gallery .wp-block-column {
        width: 148px;
        height: 148px;
    }
    .flip-gallery > div:nth-child(5){
        display: none;
    }

    .menu-footer-container ul{
        gap:28px;
        }

    /*Kontaktform*/
    form .nf-form-content nf-fields-wrap nf-field{
        width: 100% !important
    }

    /*Akkorden*/
    body .mbgi-block-akkordeon.mbgi-block .akkordeon-wrap > p strong{
        line-height: 125%;
    }

    /*Team*/
    div.mbgi-block.mbgi-block-post-loop.person{
        display: block;
        }
        div.mbgi-block.loop.person article .loop-wrapper .loop-portrait {
            width: 100%;
            padding: 47% 0;
            height: unset;
            }
            div.mbgi-block.loop.person article .loop-wrapper .loop-portrait img{
                width: 100%;
                height: 100%;
                position: absolute;
                top: 0;
                left: 0;
                object-fit: none;
                object-position: top;
            }
            div.mbgi-block.loop.person article .loop-wrapper .checked ~ .loop-portrait{
                padding: 0;
            }
        

    /*Über den Bunker*/
    .ueber-den-bunker-hero-bild{
        right: -20%;
        max-width: 300px;
    }
    .bunker-zahlen-fakten.wp-block-columns{
        display: grid;
        grid-template-columns: 1fr 1fr;
        }
        .bunker-zahlen-fakten > div {
            padding: 20px 30px;
            }
            .bunker-zahlen-fakten > div p:nth-child(2){
                font-size: 40px;
            }
 
    /*Footer*/
    .menu-footer-container ul{
        flex-wrap: wrap;
        gap:40px
        }
        .menu-footer-container ul li{
            width: calc(50% - 20px);
        }
}

@media (max-width:601px) {
    :root{
        --gridColumnDefault:1fr;
        --singleAbststandSeite:20px;
        --headerHeight: 60px;
        --paragraph: 14px;
        --abstandVerwandte:80px;
    }

    /*Businez Label*/
    .header-sidebar-wrap > div:nth-child(2) > div > div:first-child {
        min-width: 150px;
    }

    /*Main Menü*/
    #mb-container header .widget_nav_menu .menu{
        align-items: center;
        }
        #mb-container header .widget_nav_menu .menu li a{
            background:var(--middleBlue);
            color:white;
        }

    /*Hero*/
    .hero-wrap {
        padding: 20px 0;
        }
        
    /*Architektur*/
    body.architektur .hero-wrap h1 {
        font-size: 40px;
    }
    body.architektur .flip-gallery .wp-block-image img{
        height: 100%;
        object-fit: contain;
    }
    body.architektur .flip-gallery > div:nth-child(4),
    body.architektur .flip-gallery > div:last-child{
        display: none;
    }

    
    /*Filter*/
    .home .mb-filtermanager-wrapper .filter-wrap .mb-filtermanager-tags > span:first-child{
        display:none
    }
    .home .mb-filtermanager-wrapper .filter-wrap .mb-filtermanager-tags > div label{
        width: 100%;
    }    

    /*KundenLogos*/
    .mbdk-kundenlogos,
    .swiper.wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image:not(#individual-image) img{
        max-height: 280px;
        }


    .ueber-den-bunker-hero-bild {
        right: -19%;
        max-width: 230px;
    }
    .bunker-zahlen-fakten > div{
        min-width: auto;
    }

    .goto-team{
        display: none
    }

    /*Footer*/
    footer {
        padding-top: var(--abstandVerwandte);
    }
}

@media (max-width:480px) {
    :root{
        --abstandSeiten: 20px;
        --headline-1: 36px !important;
        --headline-2: 32px;
        --headline-3: 26px;
        --headline-4: 20px;
    }

    /*Menu*/
    header .widget_nav_menu ul li{
        font-size: 24px;
    }

    /*Content*/
    .flip-gallery .wp-block-column {
        width: 120px;
        height: 120px;
    }

    body .mbgi-block-akkordeon .akkordeon-wrap > p.active:after {
        font-size: 50px;
    }

    .mb-subpage .hero-wrap h2,
    body .mbgi-block-akkordeon.mbgi-block .akkordeon-wrap > p strong {
        font-size: 18px;
    }
    .bilderleiste{
        flex-wrap: wrap;
    }
    .coworking-preise{
        grid-template-columns: 1fr;
    }

    body.datenschutz h2, 
    body.impressum h2, 
    body.coworking-im-modulbuero h3 {
        font-size: 24px;
        margin-bottom: 15px;
    }

    .bunker-zahlen-fakten.wp-block-columns {
        grid-template-columns: 1fr;
        }
        .bunker-zahlen-fakten > div p:nth-child(2) {
            font-size: 33px;
        }


    .loop.person article .loop-wrapper img{
        width: 100%;
        height: 100%;
    }

    /*Kontaktform*/
    form .nf-form-content nf-fields-wrap nf-field:nth-child(2), 
    form .nf-form-content nf-fields-wrap nf-field:nth-child(3){
        width:100%
    }

    /*Footer*/
    .menu-footer-container ul{
        flex-direction: column;
        }
        .menu-footer-container ul li{
            width: 100%;
            text-align: center;
        }
}

@media (max-width:474px) {
    /*Architektur*/
    .flip-gallery{
        flex-wrap: nowrap !important;
        gap: 10px;
    }
}

@media (max-width:428px) {
    /*Header*/
    .header-sidebar-wrap .modulbuero-logo, 
    .header-sidebar-wrap .modulbuero-logo svg{
        height:39px
    }

    

    header .widget_nav_menu.menu-open ul li {
        font-size: var(--menuItemSize);
    }
    
    /*Hero*/
    .mb-subpage .hero-wrap h1 {
        margin-bottom: 20px;
    }
    .mb-subpage .hero-wrap .wp-block-group .distanceBottom{
        margin-bottom: 0;
    }
    .mb-subpage .hero-wrap h2 {
        margin-bottom: 30px;
    }
    .mb-subpage .hero-wrap .projekte-news-link{
        padding-bottom:10px
    }

    /*Loop*/
    .loop-wrapper .loop-meta-info{
        margin-bottom: 40px;
    }

    /*Kontaktform*/
    form .nf-form-content{
        --paddingForm: 20px 10px;
    }
    form .nf-form-content .nf-field-container:not(.checkbox-container) .nf-field-label{
        left: 10px;
        top: 20px;
        }
    #nf-field-9-container .nf-field-element p{
        font-size: 13px;
        line-height: 150%;
    }
}

@media (max-width:375px) {
    header .widget_nav_menu.menu-open ul li {
        font-size: 18px;
    }
    /*Kontaktform*/
    #nf-field-9-container .nf-field-element p{
        font-size: 10px;
        line-height: 200%;
    }
    #nf-field-10-container label{
        font-size: 13px;
    }
}

@media (max-width:360px) {
    .mb-subpage .hero-wrap h1 {
        font-size: 38px;
    }

    
}