/******************************
Style Responsive CSS
Author: Adam Kammerer - https://light-work.eu/
Version: 1.0 | 2025-09-04 
******************************/

@media (max-width:2400px) {

    .sammlung .act-outer {
        width: calc(100% / 10);
    }

}

@media (max-width:2200px) {

    .sammlung .act-outer {
        width: calc(100% / 9);
    }

}

@media (max-width:2000px) {

    .sammlung .act-outer {
        width: calc(100% / 8);
    }

}

@media (max-width:1800px) {

    .sammlung .act-outer {
        width: calc(100% / 7);
    }

}
@media (max-width:1600px) {

    .sammlung .act-outer {
        width: calc(100% / 6);
    }

}
@media (max-width:1400px) {

    .sammlung .act-outer {
        width: calc(100% / 5);
    }

}
@media (max-width:1300px) {

    div#footer-content {
        align-items: center;
        text-align: center;
    }

    div#content-inner {
        margin-top: 30px;
        margin-bottom: 30px;
    }

}

@media (max-width:1200px) {

    .mitwirkende-tabelle {
        margin: 0 20px;
    }

    div#landing-page.preview {
        height: calc(100% - 170px);
        min-height: calc(100% - 170px);
        padding-top: 170px;
    }

    div#act-preview .images {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        opacity: 0.5;
        pointer-events: none;
    }

    div#act-preview .image {
        flex: 0.25;
        transition: 3s ease-in-out;
        border-left: none;
        border-right: none;
        box-sizing: border-box;
    }

    div#act-preview {
        position: initial;
        justify-content: center;
    }

    div#act-preview .image:nth-of-type(1), div#act-preview .image:nth-of-type(2), div#act-preview .image:nth-of-type(3), div#act-preview .image:nth-of-type(4), div#act-preview .image:nth-of-type(5) {
        width: 100%;
    }

    div#act-preview .image img {
        height: 100%;
        min-height: 90vh;
        transition: transform 10s ease-in-out;
    }

    div#act-preview .image.act-outerive img {
        transform: scale(1.1);
    }

    div#act-preview .text {
        width: calc(100% - 60px);
        margin: 0 30px;
        text-align: center;
        align-items: center;
        max-width: 500px;
    }

    div#act-preview .swiper-slide {
        width: 100%;
    }

    div#content .frame-type-text, div#content .frame-type-textpic  {
        padding: 20px 20px;
        padding-top: 0;
    }

    div#footer {
        padding: 50px 10px;
        width: calc(100% - 20px);
    }

    .sammlung {
        width: 100%;
        margin: 0 0px;
        margin-top: 20px;
    }

    .sammlung .act-outer {
        width: calc(100% / 4);
    }

}

@media (max-width:1000px) {

    .sammlung .act-outer {
        width: calc(100% / 3);
    }

}

@media (max-width:850px) {

    .mitwirkende-tabelle {
        margin: 0 10px;
    }

    .mitwirkende-tabelle ul {
        /* justify-content: center; */
    }

    
    html, body {
        font-size: 16px;
    }

    header {
        margin-bottom: 15px;
    }

    h1 {
        font-size: 32px;
    }
    h2 {
        font-size: 22px;
    }
    h3 {
        font-size: 18px;
    }
    h4 {
        font-size: 16px;
    }
    h5 {
        font-size: 16px;
    }

    div#landing-page .quote {
        font-size: 50px;
        width: 90%;
    }

    div#footer {
        flex-direction: column;    
        align-items: center;
    }

    div#footer-links a {
        text-align: center;
    }

    div#footer-logo {
        display: none;
    }

    div#footer-content {
        align-items: center;
        text-align: center;
    }

    .swiper {
        height: 200px;
    }


}

@media (max-width:700px) {

    div#landing-page .quote {
        font-size: 36px;
    }

    div#landing-page .button-group, div#landing-page.index .button-group {
        flex-direction: column;
        row-gap: 15px;
        padding: 0 20px;
        padding-top: 30px;
    }
    div#landing-page .button-group a {
        width: -webkit-fill-available;
        text-align: center;
    }

    div#landing-page.index {
        height: 100%;
    }


}

@media (max-width:600px) {
    .sammlung .act-outer {
        width: calc(50% - 1px);
    }

}

@media (max-width:500px) {
    .sammlung { 
        margin: 0 1px;
    }
    div#header .logo img {
        height: 100px;
    }
    div#header-background {
        top: 36px;
        height: 37px;
    }
    div#burger-menu {
        top: 30px;
    }

    div#content .frame-type-text, div#content .frame-type-textpic {
        padding: 20px 10px;
    }

}

@media (max-width:300px) {

    .sammlung .act-outer {
        width: 100%;
    }
}

@media (min-width:1000px) {



}

@media (min-width:1000px) {

    div#mobilenav-outer.open {
        opacity: 0 !important;
        pointer-events: none !important;
    }

}

@media (max-height:800px) {

    div#landing-page .quote {
        margin-top: -100px;
    }

}