/*-----------------------------------------------------------------------------< Dimensionen + Farben >---*/

#wrapper{
    margin-top:9.24rem;
}

main > .inside > .mod_article:not(.fullWidth) > .inside,
header > .inside,
#footerNav ul,
#footerInfos,
.mod_search .inside{
    width:100%;
    max-width:calc(1640px + 2rem);
    margin:0 auto;
    padding:0 1rem;
}

main > .inside > .mod_article.thin > .inside{
    max-width:calc(1364px + 2rem);
}

main > .inside > .mod_article:not(.fullWidth),
#searchResults,
#searchForm,
#results{
    padding:5rem 0;
}

main .mod_article p:not(:last-child),
main .mod_article ul:not(:last-child),
main .mod_article ol:not(:last-child),
main .mod_article .ce_columns > div:not(:last-child),
main .mod_article table:not(:last-child),
footer p:not(:last-child){
    margin-bottom:1rem;
}

main .mod_article > .inside > div:not(:last-child),
main .mod_article > .inside > section:not(:last-child):not(.ce_accordion),
main .mod_newsreader .layout_full > div:not(:last-child),
main .mod_eventreader .layout_full > div:not(:last-child){
    margin-bottom:2rem;
}

/* .mod_article:not(.mod_article.fullWidth).grey{
    background-color:var(--background-grey);
} */

.mod_article.grey,
#searchForm{
    background-color:var(--background-grey);
}

/*-----------------------------------------------------------------------------< Kopf >---*/

header{
    position:fixed;
    top:0;
    left:0;
    right:0;
    background-color:#fff;
    box-shadow:0 .12rem .4rem 0px rgba(0,0,0,.16);
    z-index:10;
    transition:height var(--scroll_transition), top var(--scroll_transition);
}

body:not(.smallNav) header{
    height:9.24rem;
}

body.smallNav header,
body.hideNav header{
    height:3rem;
}

body.hideNav:not(.openNav) header{
    top:-4rem;
}



header > .inside{
    height:100%;
    display:grid;
    grid-template-columns: 1fr 1.2fr;
}

#navContainer{
    position:relative;
    align-self:center;
    justify-self: end;
    height:1.6rem;
}

header .homelink{
    position:relative;
    display:block;
    align-self:center;
    width:40vw;
    height:100%;

    /* background-color:tomato; */
}

header .homelink svg{
    position:absolute;
    height:72%;
    max-width:100%;
    /* width:100%; */
    transform:translateY(-50%);
    top:50%;
    left:0;
}


/*-----------------------------------------------------------------------------< Navigationspfad >---*/

.mod_breadcrumb{
    padding:.3rem 1rem;
    background-color:var(--light-gray_2);
    box-shadow:0 .12rem .4rem 0px rgba(0,0,0,.25);
}

.mod_breadcrumb ul{
    display:flex;
    justify-content: center;
    gap:var(--grid__gutter);
    font-size:var(--fs_extra_small);
}

.mod_breadcrumb a.root:before{
    content:"";
    display:inline-block;
    vertical-align: middle;
    width:1em;
    height:1em;
    background-color: var(--font-color);
    -webkit-mask-image: url('../img/burg_icon.svg');
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: contain;
    mask-image: url('../img/burg_icon.svg');
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
}

.mod_breadcrumb a.root:where(:hover, :focus):before{
    background-color:var(--yellow);
}

.mod_breadcrumb li:not(:last-child){
    display:flex;
    align-items: center;
    gap:var(--grid__gutter);
}

.mod_breadcrumb li:not(:last-child):after{
    content: "";
    display: block;
    height: .3rem;
    width: .3rem;
    background-color: var(--font-color);
    -webkit-mask-image: url('../img/marker.svg');
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: contain;
    mask-image: url('../img/marker.svg');
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
    transform-origin: center;
    transform: rotate(-90deg);
}

.mod_breadcrumb a{
    font-weight:var(--fw_semi_bold);
    color:var(--font-color);
}

.mod_breadcrumb a:where(:hover, :focus){
    color:var(--yellow);
}

/*-----------------------------------------------------------------------------< Bühne >---*/

#stage{
    position:relative;
    overflow:hidden;
    /* height:calc(100vh - 9.24rem + 4rem); */
    height:calc(100vh - 9.24rem + 0rem);
    width:100%;
}

#stage::after{
    content:"";
    position:absolute;
    transform:translateX(-50%);

    bottom:0;
    left:50%;

    display:block;
    width:22rem;
    height:4rem;
    background: rgb(236,237,240);
    background: linear-gradient(0deg, rgba(236,237,240,1) 0%, rgba(255,255,255,1) 40%);
    -webkit-mask-image: url('../img/silhouette.svg');
    -webkit-mask-image: url('../img/silhouette.svg');
    -webkit-mask-size: contain;
    -webkit-mask-position:center bottom;
    -webkit-mask-repeat:no-repeat;
            mask-image: url('../img/silhouette.svg');
            mask-image: url('../img/silhouette.svg');
            mask-size: contain;
            mask-position:center bottom;
            mask-repeat:no-repeat;
}

#stageSlider{
    position:absolute;
    width:100%;
    height:100%;
}

#stage .slick-dots{
    position:absolute;
    transform:tranlateY(-50%);
    right:1rem;
    top:50%;
}

.slick-dots li{
    background-color:var(--blue);
    height:.6rem;
    width:.6rem;
    border-radius:100%;
    font-size:0;
    overflow:hidden;
}

.slick-dots li.slick-active{
    background-color:var(--yellow);
}

#stage .slick-dots li:not(:last-child){
    margin-bottom:.3rem;
}

.slick-dots button{
    padding:0;
    margin:0;
    border:inherit;
    font-size:0;
    width:100%;
    height:100%;
    background-color:transparent;
}



.slide figure{
    position:absolute;
    transform:translate(-50%, -50%);
    top:50%;
    left:50%;
}





.slideContent{
    position:absolute;
    text-transform:uppercase;
    text-shadow:0 3px .5rem rgba(0, 0, 0, .5);
    color:#fff;
    text-align:center;
    left:1rem;
    right:1rem;
}

.slideContent .slideText_small{
    line-height:1em;
    font-weight:500;
}

.slideContent .slideText_big{
    font-size:2rem;
    line-height:1em;
    font-weight:700;
}

@media screen and (min-width:425px){
    .slideContent .slideText_big{
        font-size:3rem;
    }
}

@media screen and (min-width:1600px){
    .slideContent .slideText_big{
        font-size:5rem;
    }
}

.slideContent.up{
    top:15vh;

}
.slideContent.down{
    bottom:15vh;

}
.slideContent.middle{
    transform:translateY(-50%);
    top:50%;
}







/*-----------------------------------------------------------------------------< Formulare >---*/



input[type=text]{
    display:block;
    width:100%;
    padding:.3rem .5rem;
    line-height:1rem;
    font-size:65%;

    border:none;
    background-color:var(--light-gray_1);
    outline: none;
}

input[type=text]:focus{
    background-color:var(--light-gray_2);
}

/*-----------------------------------------------------------------------------< Bildtrenner >---*/

.mod_article.fullWidth > .inside > .content-image{
    height:15rem;
    width:100%;
    position:relative;
    overflow:hidden;
}

.mod_article.fullWidth > .inside > .content-image img{
    position:absolute;
    transform:translate(-50%, -50%);
    top:50%;
    left:50%;
}

/*-----------------------------------------------------------------------------< Main >---*/

main .small{
    font-size:var(--fs_small);
}

main .content-image img:not(.spacer){
    width:100%;
    height:auto;
    display:block;
}

main .content-text ul,
main .content-text ol{
    padding-left:1rem;
}

main .content-text ul{
    list-style-type: disc;
}

main .mod_article table{
    width:100%;
    border:1px solid var(--light-gray_1);
    border-radius:var(--border-radius);
    overflow:hidden;
}

main .mod_article.grey tbody tr:nth-child(even){
    background-color:#fff;
}

main .mod_article:not(.grey) tbody tr:nth-child(odd){
    background-color:var(--background-grey);
}

main .mod_article td,
main .mod_article th{
    padding:.5rem;
}

main .mod_article td:not(:last-child),
main .mod_article th:not(:last-child){
    border-right:1px solid var(--light-gray_1);
}

@media screen and (max-width:calc(1000px + 2rem)){
    .table.content-text > .rte{
        overflow-x:scroll;
    }
    
    .table.content-text > .rte > table{
        min-width:1000px;
    }

    .table.content-text{
        position:relative;
        /* padding-bottom:2rem; */
    }

    .table.content-text:after,
    .table.content-text:before{
        content:"";
        display:block;
        position:absolute;
        transform:translate(-50%, 50%);
        height:1.5rem;
        width:5rem;
        bottom:0;
        left:50%;

        background-repeat:no-repeat;
    }

    .table.content-text:after{
        background-image:url('../img/Hand-Cursor.svg');
        background-size:contain;
        animation: table 1500ms ease-in-out infinite alternate;
    }

    /* .table.content-text:before{
        background-image:url('../img/Linie.svg');
        background-position:center;
        background-size:100%;
    } */

    @keyframes table {
        from { background-position: 20% 50%; }
        to  { background-position: 80% 50%; }
    }
}










main figure figcaption{
    margin-top:.2rem;
    font-size:var(--fs_extra_small);
}

.content-text.media:not(.noShadow) img,
.content-gallery img,
.ce_rowStart img{
    border-radius:var(--border-radius);
    overflow:hidden;
    box-shadow: var(--box-shadow);
}



.content-text.media--right figure{
    float:right;
    margin:0 0 1.5rem 3rem;
}

.content-text.media--left figure{
    float:left;
    margin:0 3rem 1.5rem 0;
}



/*--< Float: 3/12 >---*/
@media screen and (max-width:689px){
    .content-text.media figure:has(.float_3_12){
        float:none;
        margin:0 0 1.5rem 0;
        width:100%;
    }
    .content-text.media figure:has(.float_3_12) img{
        width:100%;
        height:auto;
    }
}


/*--< Float: 4/12 >---*/
@media screen and (max-width:850px){
    .content-text.media figure:has(.float_4_12){
        float:none;
        margin:0 0 1.5rem 0;
        width:100%;
    }
    .content-text.media figure:has(.float_4_12) img{
        width:100%;
        height:auto;
    }
}

/*--< Float: 5/12 >---*/
@media screen and (max-width:1023px){
    .content-text.media figure:has(.float_5_12){
        float:none;
        margin:0 0 1.5rem 0;
        width:100%;
    }
    .content-text.media figure:has(.float_5_12) img{
        width:100%;
        height:auto;
    }
}







.content-gallery ul{
    display:flex;
    flex-wrap:wrap;
    list-style-type: none;
    gap:var(--grid__gutter);
    padding:0;
}

.content-gallery.grid ul{
    display:grid;
}

.content-gallery ul li img{
    max-width:100%;
    height:auto;
}

.content-gallery--cols-6.grid ul{grid-template-columns:repeat(6, 1fr);}
.content-gallery--cols-5.grid ul{grid-template-columns:repeat(5, 1fr);}
.content-gallery--cols-4.grid ul{grid-template-columns:repeat(4, 1fr);}
.content-gallery--cols-3.grid ul{grid-template-columns:repeat(3, 1fr);}
.content-gallery--cols-2.grid ul{grid-template-columns:repeat(2, 1fr);}

@media screen and (max-width: 767px){
    .content-gallery--cols-6.grid ul,
    .content-gallery--cols-5.grid ul{grid-template-columns:repeat(4, 1fr);}
}

@media screen and (max-width: 565px){
    .content-gallery--cols-6.grid ul,
    .content-gallery--cols-5.grid ul{grid-template-columns:repeat(3, 1fr);}
}

@media screen and (max-width: 400px){
    .content-gallery--cols-6.grid ul,
    .content-gallery--cols-5.grid ul{grid-template-columns:repeat(2, 1fr);}
}

.content-gallery.right ul{flex-direction:row-reverse;}
.content-gallery.center ul{justify-content: center;}

figure a{
    position:relative;
    display:block;
}

figure a:before,
figure a:after{
    content:"";
    position:absolute;
    border-radius:var(--border-radius);
}

figure a:before{
    inset:0;
    background-color:#000;
    opacity:0;
    transition:opacity .3s;
}

figure a:hover:before,
figure a:focus:before{
    opacity:.3;
}



figure a:after{
    background-image:url(../img/resize.svg);
    background-repeat:no-repeat;
    background-size:contain;
    background-position: center;
    width:2rem;
    height:2rem;
    transform:translate(-50%, -50%) scale(0);
    top:50%;
    left:50%;
    opacity:.8;
    transition:transform .3s;
}

figure a:hover:after,
figure a:focus:after{
    transform:translate(-50%, -50%) scale(1);
}

#cboxTitle, #cboxCurrent{
    font-size:var(--fs_small);
    top:-1rem;
}



blockquote{
    padding:1rem;
    margin:3rem 0;
    position:relative;
    border-radius:var(--border-radius);
    background-color:var(--light-gray_1);
    text-align: center;
    color:#fff;
}

blockquote::before,
blockquote::after{
    position:absolute;
    transform:translate(-50%, -50%);
    top:50%;
    font-size:4rem;
    line-height:1em;
    font-weight:400;
    text-shadow:0 0 15px rgba(0,0,0,.3);
}

blockquote::before{
    content:"\00BB";
    left:0;
}

blockquote::after{
    content:"\00AB";
    left:100%;
}

.mod_image_copyright_list .item:not(:last-child){
    margin-bottom:.5rem;
}

.mod_image_copyright_list .item{
    display:flex;
    align-items: center;
    gap:1rem;
    font-size:var(--fs_small);
}

.mod_article.fullWidth .row > div[class^=col-] > .content-text{
    padding:3rem;
}

@media screen and (max-width:1099px){
    .mod_article.fullWidth .row > div[class^=col-]:first-child > .content-text{
        padding:5rem 1rem 1rem 1rem;
    }
    .mod_article.fullWidth .row > div[class^=col-]:last-child > .content-text{
        padding:1rem 1rem 5rem 1rem;
    }  
}

.content-youtube figure{
    width:100%;
    border-radius:var(--border-radius);
    box-shadow: var(--box-shadow);
    overflow:hidden;
}

.content-youtube iframe{
    aspect-ratio:16/9;
    width:100%;
}

.content-player figure{
    display:block;
}

figure video{
    display:block;
    width:100%;
    height:auto;
}


/*-----------------------------------------------------------------------------< Slider-Galerie >---*/

.content-slidedGallery{
    position:relative;
    width:100%;
    height:100%;
    min-height:350px;
    overflow:hidden;
}

.slidedGallery .sliderImage{
    position:relative;
    overflow:hidden;
}

/*-----------------------------------------------------------------------------< Links, Button >---*/

/* .content-text:not(.button) a,
.content-hyperlink > a,
.download-element > a,
.connectedTextfields a,
.addresses a,
.contacts a,
{
    background: linear-gradient(0deg, var(--yellow), var(--yellow));
    background-repeat:no-repeat;
    background-size:0 100%;
    background-position: right bottom;
    transition:background-size 350ms;
} */

.content-text:not(.button) a:not(.cboxElement),
.content-hyperlink:not(.button) > a,
.connectedTextfields a,
.richcard a,
.addresses a,
.contacts a,
footer .mod_customnav a,
footer .mod_customnav strong{
    background: linear-gradient(0deg, var(--yellow), var(--yellow));
    background-repeat:no-repeat;
    background-size:0 100%;
    background-position: right bottom;
    transition:background-size 350ms;
    border-bottom:1px solid var(--font-color);
}

.content-text:not(.button) a:not(.cboxElement):where(:hover, :focus-visible),
.content-hyperlink:not(.button) > a:where(:hover, :focus-visible),
.download-element > a:where(:hover, :focus-visible),
.connectedTextfields a:where(:hover, :focus-visible),
.richcard a:where(:hover, :focus),
.addresses a:where(:hover, :focus-visible),
.contacts a:where(:hover, :focus-visible),
footer .mod_customnav a:where(:hover, :focus),
footer .mod_customnav strong{
    background-size:100% 100%;
    background-position-x: left;
}

.mod_articlelist a,
.content-hyperlink.button a,
a.button,
.content-hyperlink button,
p.back a,
.formbody button,
.contao-cookiebar .cc-footer button{
    border:1px solid var(--yellow);
    background-color:var(--yellow);
    color:var(--font-color);
    font-size:inherit;
    border-radius:var(--border-radius);
    padding:.5rem 1rem;
    display:inline-block;
    transition:background-color .2s;
}

.mod_articlelist a:where(:hover, :focus),
.content-hyperlink.button a:where(:hover, :focus),
a.button:where(:hover, :focus),
.content-hyperlink button:where(:hover, :focus),
p.back a:where(:hover, :focus),
.formbody button:where(:hover, :focus),
.contao-cookiebar .cc-footer button:where(:hover, :focus){
    background-color:var(--yellow_hover);
}


.contao-cookiebar .cc-footer button{
    background-color:inherit;
    border-color:inherit;
}

.center.content-hyperlink{
    text-align: center;
}

.mod_articlelist a:before,
.content-hyperlink.button a:before,
.content-toplink a:before,
a.button:before,
.content-hyperlink button:before,
p.back a:before,
.formbody button:before,
.contao-cookiebar .cc-footer button:before{
    content: "";
    height: 0.48rem;
    width: 0.56rem;
    display: inline-block;
    background-image: url(../img/button_arrow.svg);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    margin-right: .5rem;
    position: relative;
    top: -0.05rem;
}

.mod_articlelist ul{
    display:flex;
    flex-wrap:wrap;
    gap:var(--grid__gutter);
}

.content-toplink{
    text-align: right;;
}

.content-toplink a{
    font-size:var(--fs_small);
    position:relative;
}

.content-toplink a:after{
    content:"";
    display:inline-block;
    height:2rem;
    width:2rem;
    background-color:var(--yellow);
    border-radius:100%;
    vertical-align: middle;
    margin-left:.5rem;
    transition:background-color .2s;
}

.content-toplink a:hover:after{
    background-color:var(--yellow_hover);
}

.content-toplink a:before{
    position:absolute;
    margin:0;
    transform:translateY(-50%) rotate(-90deg);
    top:50%;
    right:.76rem;
}


p.more{
    text-align: right;
}

p.more a:before{
    content:"...";
    display:block;
    color:var(--blue);
    letter-spacing:0rem;
    width:2.6rem;
    position:absolute;
    left:0;
    top:.5rem;
    text-align:center;
    font-weight:var(--fw_semi_bold);
    z-index:1;
}

p.more a{

    position:relative;
    padding:.5rem 1.3rem .5rem 1.3rem;
    background-color:var(--yellow);
    border-radius:2.6rem;
    display:inline-block;
    text-wrap: nowrap;
    overflow:hidden;
    margin-left:-2.6rem;
    letter-spacing: -1rem;
    color:transparent;
    transition:letter-spacing .2s, padding .2s, color .2s, background-color .2s;
    box-shadow:var(--box-shadow);
    vertical-align: bottom;
}

p.more a:hover,
p.more a:focus{
    letter-spacing: 0rem;
    padding:.5rem 1rem .5rem 1.8rem;
    color:var(--font-color);
    background-color:var(--yellow_hover);
}

p.back{
    margin-top:5rem;
}

/*-----------------------------------------------------------------------------< Download-Elemente >---*/

.content-downloads ul,
.content-download{
    /* border-radius:var(--border-radius); */
    /* border:1px solid var(--light-gray_1); */
    /* border-left:1px solid var(--light-gray_1); */
    /* padding:1rem; */
    padding:1rem;
    
}

.download-element:not(:last-child){
    padding-bottom:1rem;
    border-bottom:1px solid var(--light-gray_2);
    margin-bottom:1rem;
}

.download-element:after{
    content:"";
    clear:both;
    display:block;
}

.download-element > a{
    font-size:var(--fs_small);
    font-weight:var(--fw_medium);
}

.download-element .previewFiles{
    display:flex;
    flex-wrap:wrap;
    justify-content: flex-end;
    gap:var(--grid__gutter);
    float:right;
    margin:1rem 0 0 1rem;
}

.download-element .previewFiles figure{
    box-shadow:var(--box-shadow);
}

.download-element .previewFiles img{
    border:1px solid var(--light-gray_2);
    border-radius:var(--border-radius);
    transition:border-color .2s;
}

.download-element .previewFiles a:where(:hover, :focus-visible) img{
    border-color:var(--yellow);
}

@media screen and (min-width:940px){
    main .row div[class^='col']:not(:first-child) .content-downloads ul,
    main .row div[class^='col']:not(:first-child) .content-download{
        padding-left:2rem;
        box-shadow:-1rem 0 1rem -1.5rem;
    }
    
    main .row div[class^='col']:first-child .content-downloads ul,
    main .row div[class^='col']:first-child .content-download{
        padding-right:2rem;
        box-shadow:1rem 0 1rem -1.5rem;
    }
}



/*-----------------------------------------------------------------------------< Bildnavigation >---*/

.navigation_bar{
    display:grid;
    grid-template-columns: repeat(6, 1fr);
    gap:var(--grid__gutter);
}

@media screen and (max-width: 1300px){ .navigation_bar{ grid-template-columns: repeat(4, 1fr); } }
@media screen and (max-width: 1000px){ .navigation_bar{ grid-template-columns: repeat(3, 1fr); } }
@media screen and (max-width: 600px){ .navigation_bar{ grid-template-columns: repeat(2, 1fr); } }

.navigation_bar .card{
    width:100%;
    border-radius:var(--border-radius);
}


.navigation_bar.icon .shadow{
    position:absolute;
    inset:0 0 -1rem;
    background-color:rgba(0,0,0,.5);
    filter:blur(1rem);
    transform: translateZ(-100px);
}

.navigation_bar.icon .card{
    aspect-ratio: 1 / 1;
    position:relative;
    perspective:1000px;
}

.navigation_bar.icon .card-inner{
    position:absolute;
    display:block;
    inset:0;
    perspective:1000px;
    transform-style: preserve-3d;
    transform-origin: center center;
    background-color:var(--font-color);
    transition:transform .3s;
    border-radius:var(--border-radius);
}

.navigation_bar.icon .image_container{
    position:absolute;
    transform:translateX(-50%);
    top:15%;
    left:50%;
    width:50%;
    height:50%;
    overflow:hidden;
    filter:grayscale(1);
    transition:filter .2s;

}

.navigation_bar.icon .card:hover .card-inner{
    transform:rotateX(30deg);
}

.navigation_bar.icon a:hover .image_container{
    filter:grayscale(0) drop-shadow(0 3px 5px rgba(0,0,0,.5));
}

.navigation_bar.icon .image_container img{
    width:100%;
    height:100%;
}

.navigation_bar .linkText{
    position:absolute;
    left:1rem;
    right:1rem;
    line-height:1.1em;
}

.navigation_bar.image .card-inner{
    position:relative;
}

.navigation_bar.image .linkText{ top:1rem; }
.navigation_bar.icon .linkText{ bottom:1rem; text-align:center; }

.navigation_bar.image .image_container{
    border-radius: var(--border-radius);
    overflow: hidden;
}

.navigation_bar.image img{
    width:100%;
    height:auto;
}

.navigation_bar.icon .linkText{
    font-size:var(--fs_small);
    color:#fff;
    font-weight:var(--fw_medium);
}

.navigation_bar.image .linkText{
    font-weight:var(--fw_bold);
    font-size:var(--fs_small);
    text-shadow:var(--text-shadow);
    color:#fff;

}

.navigation_bar.image .arrow{
    position:absolute;
    left:0;
    bottom:-35px;
    height:65px;
    width:55px;
    background-image:url('../img/arrow_full.svg');
    background-repeat:no-repeat;
    transition:left .2s;
}

.navigation_bar.image a:hover .arrow{
    left:10%;
}

/*-----------------------------------------------------------------------------< Kontakte, Connected Fields >---*/

.mod_article.grey .contact,
.mod_article.grey .address,
.mod_article.grey .connectedTextfields .content,
.mod_article.grey .richcard{
    background-color:#fff;
}

.mod_article:not(.grey) .contact,
.mod_article:not(.grey) .address,
.mod_article:not(.grey) .connectedTextfields .content,
.mod_article:not(.grey) .richcard{
    background-color:var(--background-grey);
}

.richcard{
    display:grid;
    grid-template-columns: 1fr 1fr;
    padding:0 !important;
    overflow:hidden;
}


.contacts:not(.single),
.addresses:not(.single){
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap:var(--grid__gutter);
}

.richcards:not(.single){
    display:grid;
    grid-template-columns: repeat(2, 1fr);
    gap:var(--grid__gutter);
}

@media screen and (max-width:1100px){
    .contacts:not(.single),
    .addresses:not(.single){
        grid-template-columns: repeat(2, 1fr);
    }

    .richcard{
        display:block;
    }

    .richcard > .content-image{
        aspect-ratio: 2 / 1;
    }
}

@media screen and (max-width:670px){
    .contacts:not(.single),
    .addresses:not(.single),
    .richcards:not(.single){
        grid-template-columns: repeat(1, 1fr);
    }
}



.mod_article .contact,
.mod_article .address,
.mod_article .richcard{
    border-radius:var(--border-radius);
    padding:1rem;
    box-shadow: var(--box-shadow);
}

.contacts p.resort{
    font-size:var(--fs_small);
}

.connectedTextfields > div{
    display: flex;
    flex-direction:column;
    overflow:hidden;
}

.connectedTextfields .content{
    flex-grow:2;
}



.richcard .content-image{
    position:relative;
    overflow:hidden;
}

.richcard .content-image img{
    position:absolute;
    transform:translate(-50%, -50%);
    top:50%;
    left:50%;
    width:auto !important;
}

.richcard .content{
    padding:1rem;
}

.richcard p{
    font-size:var(--fs_small);
}

@media screen and (max-width:999px){

    .connectedTextfields > div:nth-child(even){
        margin-bottom:var(--grid__gutter);
        border-radius: 0 0 var(--border-radius) var(--border-radius);
    }

    .connectedTextfields > div:nth-child(odd){
        border-radius:var(--border-radius) var(--border-radius) 0 0;
    }

    .connectedTextfields > div:nth-child(odd) .cfHeadline{
        background-color:var(--font-color);
    }

    .connectedTextfields .cfHeadline{
        background-color:var(--light-gray_1);
        color:#fff;
        padding:.5rem 1rem;
        font-size: var(--fs_extra_small);
    }

    .connectedTextfields .content{
        padding:1rem; 
    }

}

@media screen and (min-width:1000px){

    .connectedTextfields{
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap:var(--grid__gutter);
    }

    .connectedTextfields .content,
    .connectedTextfields .cfHeadline{
        padding:1rem;
        border-radius: var(--border-radius);
    }

    .connectedTextfields .cfHeadline{
        display: none;
    }

    .connectedTextfields > div:nth-child(-n + 2) .cfHeadline{
        display:block;
        color:#fff;
        background-color: var(--font-color) !important;
    }

    .connectedTextfields > div{
        row-gap: var(--grid__gutter);
    }

}




/*-----------------------------------------------------------------------------< Akkordion >---*/



.ce_accordion{
    border:1px solid var(--font-color);
    border-radius:var(--border-radius);
    box-shadow:var(--box-shadow);
    overflow:hidden;
}

.ce_accordion:not(:last-child){
    margin-bottom:.5rem;
}

.ce_accordion > .toggler{
    background-color:var(--font-color);
    transition:background-color .2s;
    color:#fff;
    padding:.5rem 1rem;
    cursor:pointer;

    display:flex;
    align-items: center;
}

.ce_accordion > .toggler:hover,
.ce_accordion > .toggler:hover:focus{
    background-color:var(--font-color-light);
}

.ce_accordion .accordion{
    padding:1rem;
}

.ce_accordion .marker{
    height: .56rem;
    width: .56rem;
    margin-right:1rem;
    display:block;
    position: relative;
    flex-shrink:0;
}

/* .ce_accordion .toggler:before */
.ce_accordion .marker:before{
    position: absolute;
    background-color:var(--yellow) !important;
    transform:rotate(-90deg);
    margin-left:0 !important;
}

.ce_accordion .toggler.ui-state-active .marker:before{
    transform:rotate(0deg);
}

.accordion > div > div:not(:last-child){
    margin-bottom:1rem;
}

.accordion .ui-accordion-header-icon{
    display:none;
}


/*-----------------------------------------------------------------------------< Footer >---*/

footer{
    position:relative;
}

footer::before{
    content:"";
    position:absolute;
    inset:0;
    background-image:url(../img/polygone.svg);
    background-repeat:no-repeat;
    background-size:cover;
    background-position:center;
    z-index:0;
    opacity:.3;
}

#footerNav{
    background-color:rgba(88,88,88,.8);
}

#footerNav ul{
    display:flex;
    justify-content: flex-start;
}

#footerNav a,
#footerNav strong{
    text-decoration:none;
    font-weight:400;
    color:#fff;
    display:block;
    padding:.75rem 3vw;
}

#footerNav li:first-child a,
#footerNav li:first-child strong{
    padding-left:0;
}

@media screen and (max-width:650px){
    #footerNav ul{
        flex-direction: column;
        padding-top:.5rem;
        padding-bottom:.5rem;
    }
    #footerNav a,
    #footerNav strong{
        padding:.5rem 0;
    }
}

#footerNav strong,
#footerNav a:hover,
#footerNav a:focus{
    color:var(--yellow);
}

#footerInfos{
    padding-top:5rem;
    padding-bottom:5rem;
}


footer > .inside{
    position:relative;
    z-index:1;
}

footer a.homelink{
    display:block;
    width:100%;
}

footer a.homelink svg{
    width:100%;
}

@media screen and (max-width:1099px){
    footer a.homelink svg{
        margin-top:2rem;
        max-width:300px;
    }
}

footer .socialMedia{
    display:flex;
    gap:var(--grid__gutter);
    margin:3rem 0;
}

/*-----------------------------------------------------------------------------< Brand >---*/

.BrandContainer{

    /* position:absolute;
    transform:translate(-50%, -50%);
    left:50%;
    top:50%;
    width:75%; */

    display:grid;
    grid-template-columns: .5fr 1.5fr;
    gap:4.5%;
}

.BrandContainer svg{
    align-self: center;
    width:100%;
}

.Brand{
    /* filter:drop-shadow(0 .2rem .3rem rgba(0,0,0,.2)); */
    filter:drop-shadow(0 1.5rem .7rem rgba(0,0,0,.4));
    justify-self: end;
}

.Brand_Text{
    justify-self: start;
}

/*-----------------------------------------------------------------------------< Teaser >---*/


@media screen and (max-width:1023px){
    .teaserGroup{
        display:flex;
        flex-direction: column;
        gap:var(--grid__gutter);
    }
}

@media screen and (min-width:1024px){
    .teaserGroup{
        display:grid;
        grid-template-columns: repeat(3, 1fr);
        gap:var(--grid__gutter);
    }
}



.teaserCard{
    position:relative;
    background-color:#fff;
    border-radius:var(--border-radius);
    overflow:hidden;

    display:flex;
    flex-direction:column;
}

.teaserCard .content-image{
    position:relative;
    /* aspect-ratio: 4 / 3; */
    overflow:hidden;
}

/* .teaserCard .content-image img{
    position:absolute;
    transform:translate(-50%, -50%);
    top:50%;
    left:50%;
} */

.teaserTop{
    position:relative;
}

.teaserTop :is(h2, h3, h4, h5){
    color:#fff;
    position:absolute;
    left:1rem;
    right:1rem;
    bottom:1rem;

    margin-bottom:0;

    line-height:1em;
    font-weight:var(--fw_semi_bold);
    font-size:2.2rem;
    text-shadow: var(--text-shadow);
    
}

.teaserBottom{
    display:flex;
    flex-direction: column;
    justify-content: space-between;
    padding:1rem;
    height:100%;
    gap:1rem;
}

/*-----------------------------------------------------------------------------< Link mit Warnung >---*/

.warningOverlay{
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,.75);
    z-index:9999;
    visibility: hidden;
    pointer-events: none;
    opacity:0;
    transition: opacity .5s, visibility 0s .5s;
}

.warningOverlay.show{
    opacity:1;
    transition: visibility 0s, opacity .5s;
    visibility: visible;
    pointer-events:all;
}

.warningOverlay.clicked{
    transition: visibility 0s !important;
}



.warningContent{
    position:absolute;
    transform:translate(-50%, -50%) scale(.8);
    top:50%;
    left:50%;
    background-color:#fff;
    border-radius: var(--border-radius);
    box-shadow: var(--box-shadow);
    padding:2rem;
    transition:transform .2s;
}

.warningOverlay.show .warningContent{
    transform:translate(-50%, -50%) scale(1);
}

.warningContent .content-text{
    margin-bottom:2rem;
}

.warningContent button.closeWarning{
    background-color:#fff;
    border:1px solid var(--light-gray_1);
    margin-right:1rem;
}

/*-----------------------------------------------------------------------------< Bibliothek >---*/

.library{
    background-color:var(--blue);
    color:#fff;
}

@media screen and (min-width:769px){
    .library > .inside{
        padding-right:15rem !important;
        position:relative;
    }
}


.library > .inside:before{
    content:"";
    display:block;
    width:10rem;
    height:10rem;
    background-image:url(../img/buch.svg);
    background-repeat: no-repeat;
    background-size:contain;
    background-position:center;

    position:absolute;
    transform:translateY(-50%);
    top:50%;
    right:1rem;
}

@media screen and (max-width:768px){
    .library > .inside:before{
        position:relative;
        transform:translateY(0);
        right:inherit;
        top:0;
        width:5rem;
        height:5rem;
        margin-bottom:1rem;
    }

}

/*-----------------------------------------------------------------------------< Company Cards >---*/

.companyCards{
    display:grid;
    gap:var(--grid__gutter);
}

.companyCard{
    box-shadow:var(--box-shadow);
    border-radius:var(--border-radius);
    overflow:hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background-color:#fff;

}

.companyCards.cols_2{ grid-template-columns: repeat(2, 1fr); }
.companyCards.cols_3{ grid-template-columns: repeat(3, 1fr); }

.companyCard .companyTop :is(h2, h3, h4 ,h5){
    margin-bottom:0 !important;
    font-size:1rem;
    font-weight:var(--fw_bold);
}

.companyCard .companyTop :is(p){
    font-size:var(--fs_small);
}

.companyCard .companyTop,
.companyCard .content-hyperlink{
    padding:1rem;
}

.companyCards .companyLogo{
    margin:2rem 0;
    padding:1rem;
}

.companyCard .companyLogo figure{
    width:80%;
}


/*-----------------------------------------------------------------------------< Suchergebnisse >---*/

main .formbody > .widget:not(:last-child){
    margin-bottom:1rem;
}

.mod_search input.text{
    padding:.5rem 1rem;
    width:100%;
    font-size:inherit;
    border:1px solid var(--yellow);
    border-radius:var(--border-radius);
}

#searchForm form{
    margin-bottom:2rem;
}

#searchForm p.info{
    font-size:var(--fs_small);
}

.search_default:not(:last-child){
    margin-bottom:3rem;
    border-bottom:1px solid var(--light-gray_1);
    padding-bottom:3rem;
}

.search_default .highlight{
    background-color:var(--yellow);
}

.search_default .url{
    font-size:var(--fs_small);
}

/*-----------------------------------------------------------------------------< Cookie-Bar >---*/

.contao-cookiebar .cc-footer{
    display:flex;
    gap:var(--grid__gutter);
    font-size:var(--fs_small);
}

.contao-cookiebar .cc-footer > button{
    flex-grow: 1;
}

.contao-cookiebar .cc-footer > button{
    border:1px solid var(--light-gray_1);
}

.contao-cookiebar .cc-footer > button:hover{
    background-color:var(--yellow);
    border-color:var(--yellow);
}

/*-----------------------------------------------------------------------------< Sitemap >---*/

.mod_sitemap a:where(:hover, :focus){
    color:var(--blue);
}

.mod_sitemap ul.level_2{
    list-style-type: disc;
}

.mod_sitemap ul.level_3{
    list-style-type:circle;
}

.mod_sitemap ul.level_1 ul{
    margin-left:2rem;
}

.mod_sitemap ul.level_1 > li > a{
    font-weight:var(--fw_bold);
}

.mod_sitemap ul.level_2 > li > a{
    font-weight:var(--fw_semi_bold);
}

.mod_sitemap ul.level_1 > li:not(:last-child){
    margin-bottom:2rem;
}

/*-----------------------------------------------------------------------------< Beteiligungsportal >---*/

.nbp-widget{
    padding:.5rem;
    border:1px solid var(--light-gray_1);
    border-radius:var(--border-radius);
    background-color:#fff;
}