@font-face {
    font-display: swap; 
    font-family: 'Jost';
    font-style: normal;
    font-weight: 500;
    src: url('../Fonts/jost-v20-latin-500.woff2') format('woff2'), 
    url('../Fonts/jost-v20-latin-500.ttf') format('truetype'); 
}
@font-face {
    font-display: swap; 
    font-family: 'Jost';
    font-style: normal;
    font-weight: 600;
    src: url('../Fonts/jost-v20-latin-600.woff2') format('woff2'), 
    url('../Fonts/jost-v20-latin-600.ttf') format('truetype'); 
}
@font-face {
    font-display: swap; 
    font-family: 'Jost';
    font-style: normal;
    font-weight: 800;
    src: url('../Fonts/jost-v20-latin-800.woff2') format('woff2'), 
    url('../Fonts/jost-v20-latin-800.ttf') format('truetype'); 
}
@font-face {
    font-display: swap;
    font-family: 'JostHarztheater';
    font-style: normal;
    font-weight: 800;
    src: url('../Fonts/Harztheater-Black.woff2') format('woff2');
}
@font-face {
    font-display: swap; 
    font-family: 'Jost';
    font-style: normal;
    font-weight: 900;
    src: url('../Fonts/jost-v20-latin-900.woff2') format('woff2'), 
    url('../Fonts/jost-v20-latin-900.ttf') format('truetype'); 
}
@font-face {
    font-display: swap;
    font-family: 'Jost';
    font-style: normal;
    font-weight: 400;
    src: url('../Fonts/jost-v20-latin-regular.woff2') format('woff2'),
    url('../Fonts/jost-v20-latin-regular.ttf') format('truetype');
}

:root {
    --color-1:#010112;
    --color-2:#EDECF2;
    --color-2-50: rgb(237, 236, 242, .5);


    --sec-color:#fff;
    --main-color:var(--color-1);

    --color-hl:#F8E14F;
    --color-hl-contrast:#000;

}

html, body {
    height: 100%;

    background-repeat:repeat-x;
    margin: 0;
    padding: 0;
    font-family: 'Jost', arial, sans-serif;
    font-size:22px;
    font-weight:500;

    color:var(--color-1);
}
html{scroll-behavior:smooth}


table, tr, td, th {
    font-family: 'Jost', arial, sans-serif;
    font-size:22px;
    font-weight:500;

}

strong,b {font-weight:600;}

.text-right,
.align-right {
    text-align:right;

}
.text-center,
.align-center {
    text-align:center;
}
.clear { clear:both; }



* { box-sizing:border-box;    -webkit-font-smoothing: antialiased;   -moz-osx-font-smoothing: grayscale; }

.team .c33,
img,
svg,
.item,
.plays__item .cover:before,
.frame-40 * ,
.item svg,
.top, .top .main, .nav,
.teaser img, input, .nbar, .st0, .st1,
a, li {
    -webkit-transition: all 400ms ease;
  -moz-transition: all 400ms ease;
  -o-transition: all 400ms ease-out;
  transition: all 400ms ease;
  }
img {
  border:0px;
}


.all {
  width:100%;
  min-width:100%;
  padding-left:40px;
  padding-right:40px;
}
.all.content {  scroll-margin-top: 0px; } /* sticky navi offset */

.main {
  max-width:1600px;
  margin: 0px auto;
  padding:0px;
  position:relative;
  text-align: left;
}
.main:after { content:''; display:table; clear:both; }


.cStage {display: flex;margin:0 -15px;flex-wrap: wrap;}
.cStage > div{padding:0 15px;}

.cStage.l-50 {margin:0 -50px;}
.cStage.l-50 > div{padding:0 50px;}

.cStage.f-10 {align-items: center}
.cStage.f-11 {align-items: flex-end}

.c33 { -ms-flex: 0 0 33.3333%;flex: 0 0 33.3333%; max-width: 33.3333%; }
.c66 { -ms-flex: 0 0 66.6666%;flex: 0 0 66.6666%; max-width: 66.6666%; }
.c16 { -ms-flex: 0 0 16.6666%;flex: 0 0 16.6666%; max-width: 16.6666%; }
.c30 { -ms-flex: 0 0 30%;flex: 0 0 30%; max-width: 30%; }
.c70 { -ms-flex: 0 0 70%;flex: 0 0 70%; max-width: 70%; }
.c40 { -ms-flex: 0 0 40%;flex: 0 0 40%; max-width: 40%; }
.c20 { -ms-flex: 0 0 20%;flex: 0 0 20%; max-width: 20%;}
.c50 { -ms-flex: 0 0 50%;flex: 0 0 50%; max-width: 50%;}
.c25 { -ms-flex: 0 0 25%;flex: 0 0 25%; max-width: 25%; }
.c75 { -ms-flex: 0 0 75%;flex: 0 0 75%; max-width: 75%; }
.c30 { -ms-flex: 0 0 30%;flex: 0 0 30%; max-width: 30%;}
.c35 { -ms-flex: 0 0 35%;flex: 0 0 35%; max-width: 35%; }
.c60 { -ms-flex: 0 0 60%;flex: 0 0 60%; max-width: 60%; }
.c80 { -ms-flex: 0 0 80%;flex: 0 0 80%; max-width: 80%; }
.c20 { -ms-flex: 0 0 20%;flex: 0 0 20%; max-width: 20%; }

svg,
img,video {max-width: 100%; height:auto;}

a + p,
.main * > *:first-child {margin-top:0px;}
.main * > *:last-child {margin-bottom:0px;}


a {color:inherit; text-decoration: none}




a + p,
.main div > *:first-child {margin-top:0px;}


.lang {background:var(--color-1);color:#fff;}
.lang .main {padding:10px; font-size:17px; text-align: right;}
.lang .main ul {margin:0; padding:0; list-style-type:none;}
.lang .main ul li {display: inline-block;}
.lang .main ul li.act {font-weight:800}
.lang .main ul li + li {margin-left:10px;}


.top .main {display: flex;    align-items: center; font-size:110%; font-weight:800; text-transform: uppercase; color:var(--main-color);  padding:30px 0; justify-content: space-between;}
.top .main:after {display: none;}
.top .main ul {margin:0; padding:0; list-style-type:none;}
.top .main ul li span,
.top .main ul li {display: inline-block; vertical-align: middle }
.top .main ul li + li {margin-left:20px;}
.top .main ul li a {padding:5px 20px; display: block; height:48px;}
.top .main ul li svg {display: inline-block; margin-left:15px; margin-bottom:5px; vertical-align: middle; }


.top .main ul li a.shownav {margin-top:-8px}

body.job nav.all.top,
header + nav.all.top {position: absolute; position: fixed; background:var(--sec-color); z-index: 4; top:0px;}
body.job nav.all.top,
header.detail + nav.all.top,
body.nav-open nav.all.top,
header.l-10 + nav.all.top {--main-color:#fff; --sec-color:var(--color-1);}


.headerslider [data-name="Gruppe 1364"] { transform-box: fill-box; transform-origin: center center; transform: rotate(0deg) scale(1);  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);}
.headerslider svg:hover [data-name="Gruppe 1364"] { transform: rotate(-5deg) scale(1.10);}
.headerslider svg { max-width: 100%; height:auto; overflow: visible;padding: 25px; box-sizing: content-box;}

.header .main {padding:200px 0 30px 0}
.headerpic .overlay h1,
.header h1 {font-size:140px;text-align: right; line-height:1em; margin:0}
.header h1 svg {display: inline-block; vertical-align: baseline}
.header.l-10 {--main-color:#fff; --sec-color:var(--color-1); color:var(--main-color);}


nav.all.lang,
nav.all.top { position: relative; z-index: 4; }
.all.footer.bottom { position: relative; z-index: 4; }
.nav-open .all.footer.bottom {position: fixed; bottom:0px;}


.nav-overlay { display: none; position: fixed; inset: 0; z-index: 2; }
.nav-overlay.is-open { display: block; }

nav.all.page { position: fixed; inset: 0; z-index: 3; background: var(--color-1); color: #fff; visibility: hidden; opacity: 0; pointer-events: none; transition: opacity 0.25s ease, visibility 0.25s ease; }
nav.all.page:focus { outline: none; }
nav.all.page.is-open { visibility: visible; opacity: 1; pointer-events: auto; }
nav.all.page > .main { height: 100%; display: flex; position: relative; padding-top: 250px; }

button.openSub { display: none !important; visibility: hidden !important; }

nav.all.page .main > ul[role="menubar"] { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 0; position: relative; width: 60%; }
nav.all.page .main > ul[role="menubar"] > li { display: flex; align-items: center; position: relative; width: 100%; padding: 10px 0; transition: opacity 0.15s ease !important; }
nav.all.page .main > ul[role="menubar"] > li:has(ul[role="menu"]) > a { pointer-events: none; cursor: default; }
nav.all.page .main > ul[role="menubar"] > li > a { display: block; color: #fff; text-decoration: none; font-size: 54px; font-weight: 900; letter-spacing: 0.05em; text-transform: uppercase; line-height: 1.1; transition: opacity 0.15s ease !important; width: 100%; text-align: right; }
nav.all.page .main > ul[role="menubar"] > li.is-dimmed > a { opacity: 0.25; }
nav.all.page .main > ul[role="menubar"] > li > a:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
nav.all.page .main > ul[role="menubar"] > li.act > a { text-decoration: underline; text-underline-offset: 0.15em; }
nav.all.page .main > ul[role="menubar"] > li + li {margin-top:8px}

nav.all.page ul[role="menu"],
nav.all.page ul[role="menu"][hidden] { list-style: none; margin: 0; padding: 0 0 0 3rem; display: flex !important; flex-direction: column; align-items: flex-start; gap: 0.3rem; position: absolute; left: 100%; top: 50%; transform: translateY(-50%); width: calc(40 / 60 * 100%); white-space: normal; visibility: hidden; opacity: 0; pointer-events: none; transition: opacity 0.15s ease, visibility 0.15s ease; }
nav.all.page ul[role="menu"].is-open { visibility: visible; opacity: 1; pointer-events: auto; }

nav.all.page ul[role="menu"] > li { transition: none !important; }
nav.all.page ul[role="menu"] > li > a[role="menuitem"] { display: block; color: #fff; text-decoration: none; font-size: 24px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; padding: 0; border-bottom: 1px solid transparent; transition: border-color 0.15s ease !important; }
nav.all.page ul[role="menu"] > li > a[role="menuitem"]:hover,
nav.all.page ul[role="menu"] > li > a[role="menuitem"]:focus-visible { border-bottom-color: #fff; }
nav.all.page ul[role="menu"] > li > a[role="menuitem"]:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
nav.all.page ul[role="menu"] > li.act > a[role="menuitem"] { border-bottom-color: #fff; }
nav.all.page ul[role="menu"] > li + li {margin-top:8px}

.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

@media (prefers-reduced-motion: reduce) {
    nav.all.page, nav.all.page ul[role="menu"] { transition: none; }
}

.content {color:var(--main-color);--sec-color:#fff; --main-color:var(--color-1);}

.l-10 {background:var(--color-1); --main-color:#fff; --sec-color:var(--color-1);}
.l-11 {background:var(--color-2); }
.overlay {background:rgba(0,0,0,.5); color:#fff; --main-color:#fff; --sec-color:var(--color-1);}
.l-12 {background:var(--color-hl); }



.h1,.h2,.h3,.h4,
h1,h2,h3,h4 {font-weight:800;hyphens:auto; -webkit-hyphens: auto; hyphenate-character: ''; -webkit-hyphenate-character: ''}

.h1,.h2,
h1,h2 {font-size:120px; text-transform: uppercase;     font-family: 'JostHarztheater','Jost', arial, sans-serif;
}

h1.icon {padding-right:165px;}
h1.icon svg {position: absolute; right:0; bottom:50px; height:100px; width: auto}

.news-single h1 {font-size:54px; margin-top:10px;}



.news-single h2,
.l-70 h2,
.frame-layout-70 h2,
h2.schedule__month-heading,
.h3,.h4,
h4,
h3 {font-size:24px; text-transform: uppercase; }

.l-70 h3,
.frame-layout-70 h3 {font-size:100%; font-weight:700}

.big {font-size:128%; line-height:1.6em}
.small {font-size:80%;}

h2.schedule__month-heading {margin:20px 0 !important;}

a svg {display: inline-block; vertical-align: middle}

.content {position: relative;overflow:hidden;}
.content#c39 { overflow: unset !important;}

.content .main {padding:180px 0; }
main .content:first-child .main {padding-top:50px;}
.content.l-0 + .content.l-0 .main {padding-top:0;}
.content.l-10 + .content.l-10 .main {padding-top:0;}

.content.note .main {padding:15px 0; text-align: center;}
.content.note .main span {display: inline-block; vertical-align: middle; margin:0 5px}
.content.note .tag {background:var(--color-1); color:#fff;}

.frame-type-header.frame-layout-20 {position: absolute; top:0; width:100%; }
.frame-type-header.frame-layout-20 * {line-height: .7em;margin:0; }

main .content:first-child .main .frame-type-header.frame-layout-20 + .frame {padding-top:100px;}

.frame-30,
.f-30 {padding-left:20%; padding-right:20%;}

.content p {margin:15px 0;}

.content p,
.content li {line-height:1.6em;}

.content p sub {font-size:80%; line-height:1m;}

.frame-layout-30 {background:var(--color-1); color:#fff; padding:25px;}

.frame table {width:100%; border-collapse: collapse}
.frame table td.bordertop {border-top:2px solid var(--main-color)}
.frame table td.paddingtop {padding-top:30px;}
.frame table td.paddingbottom {padding-bottom:30px;}
.frame table th {padding:10px 10px 20px 0}
.frame table td {padding:10px 10px}


.frame-40 {position: relative; border-top:1px solid var(--main-color); border-bottom:1px solid var(--main-color);  padding:20px 0;  }
.frame-40 + .frame-40 {border-top:0}
.frame-40 .text{max-height:0px; visibility: hidden; overflow: hidden; padding:0 40px 0 0;}
.frame-40.show .text {max-height:2000px;padding-bottom:20px; visibility: visible; }
.frame-40 h3 {margin:0; font-size:54px; line-height: 1.2em;}
.frame-40 header {cursor:pointer;    display: flex;
    justify-content: space-between;
    align-items: center;}
.frame-40 header * {display: inline-block; vertical-align: middle;}
.frame-40.show svg .vertical {opacity: 0}
.frame-40 header .openAkkordeon {margin-left:40px; width:50px;flex-shrink: 0;}
.frame-40 .wrap {padding-top:30px;}

.frame.counter {padding:20px 0;border-top:1px solid var(--main-color);border-bottom:1px solid var(--main-color);}
.frame.counter .count {font-size:90px; font-weight:800; display: block; text-align: center;}


footer {font-size:20px; font-weight:400}
footer strong, footer b {font-size:110%;}

footer ul {margin:0; list-style-type:none; padding:0}

.footer.bottom .main {padding:20px 0; font-size:17px;}
.footer.bottom li {display: inline-block; vertical-align: middle; color:#fff; }
.footer.bottom li + li {margin-left:25px;}

header + div,
header + ul {padding-top:14px}


.dist {position: relative; }
.dist > picture > img {position: absolute; left:0; top:0; width:100%; height:100%; object-fit: cover; }
.dist .main {min-height:550px; padding-bottom:200px;}
.dist .main > a.btn {position: absolute; right:0; bottom:100px;}


.btn { display: inline-flex;  background:none; border:0; cursor: pointer; font-family: inherit; font-size:inherit;  line-height: 1.42em; align-items: center; gap: 20px; font-weight: 800; text-transform: uppercase;}
.btn span {flex:1;}
.btn span + span {flex:unset;}
.btn-icon { display: inline-block; overflow: hidden; }
.btnSmall .btn-icon {width:25px; height:25px}
.btn-icon svg {display: block;}
.btn-arrow {transition: none; }
.btn-arrow {
    transform-box: fill-box;
    transform-origin: center center;
    transform: translate(36.558px, 19.743px) rotate(0deg) scale(1);
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
a:hover .btn-arrow,
.logos .item:hover .btn-icon .btn-arrow,
.btn:hover .btn-arrow {
    transform: translate(36.558px, 19.743px) rotate(-10deg) scale(1.15);
}

.btn1 {background:var(--color-1); color:#fff; display: inline-block; padding:8px 20px; font-weight:800; text-transform: uppercase; }
.btn1.grey {background:var(--color-2); color:var(--color-1);}

.content p > a:not(.btn) {font-weight:700;}
footer .content p > a:not(.btn) {font-weight:400;}

body > header {padding-top:100px}

.content p > a:not(.btn) {
    text-decoration: none;
    background-image: linear-gradient(currentColor, currentColor);
    background-position: 0% 100%;
    background-repeat: no-repeat;
    background-size: 0% 2px;
    transition: background-size 0.3s ease;
}

.content p > a:not(.btn):hover {
    background-size: 100% 2px;
}


.frame-type-menu_pages ul {margin:0; text-align: right; padding:0; list-style-type: none;border-top:2px solid #000;border-bottom:2px solid #000;}
.frame-type-menu_pages li {display:block;padding:20px 0; font-size:200%; font-weight:800}
.frame-type-menu_pages li + li {border-top:2px solid #000;}
.frame-type-menu_pages .btn {align-items: flex-end}


.frame-type-menu_pages.jobs li {border-top:1px solid var(--main-color);border-bottom:1px solid var(--main-color);}
.frame-type-menu_pages.jobs li + li {border-top:0}


.frame + .frame {margin-top:80px;}
.frame.frame-40 + .frame.frame-40 {margin-top:0px;}
.frame.frame-layout-20 + .frame {margin-top:0}

.frame-type-textpic header + div {padding-top:1em;}

.venues_main .venues__item {text-align: center;}
.venues_main .venues__image {padding:10px 0 25px 0;}
.venues_main .c50 {margin-top:80px;}
.venues_main .c50:nth-child(1),
.venues_main .c50:nth-child(2) {margin-top:0}
 
.venues__group--other .venues__info {display: flex;    align-items: center;justify-content: space-between;padding:30px 0; border-top:2px solid var(--main-color)}
.venues__group--other .venues__info .venues__address {flex:1; }
.venues__group--other .venues__info * {margin:0;}
.venues__group--other .venues__info * + * {padding-left:40px;}
.venues__group--other h3 {font-size:36px;}
.venues__group--other .btn-icon {width:46px;}

.logos {display: flex; flex-wrap:wrap;    justify-content: center; gap:20px; margin:0 -10px;}
.logos .item {width:calc(25% - 20px); border:1px solid var(--color-1); }
.l-11 .logos .item {border:0}
.logos .item.no-link,
.logos .item a {display: block; justify-content: center; position: relative;    align-items: center;  display: flex; padding:20px;height:350px; background:#fff;}
.logos .item .btn-icon {width:47px; position: absolute; right:0; bottom:0}

html {scroll-padding-top:120px;}
.schedule .item {border-top:2px solid var(--color-1);border-bottom:2px solid var(--color-1);padding:35px 10px; display: flex;     align-items: center;}
.schedule .item + .item {border-top:0; }
.schedule .item h3 {margin:0;}
.schedule .item > * + * {padding-left:40px;}
.schedule .item > * {width:300px;}
.schedule .item > .date {width:200px;}
.schedule .item > .date strong {font-weight:700}
.schedule .item > .date strong.x {font-weight:800; font-size:165%; margin-right:15px;}

.schedule .item > .location {width:400px;}
.schedule .item > .button {width:400px;}
.schedule .item > .button .btn1 {margin:5px 0 5px 5px}

.schedule .item:hover {background:var(--color-2-50);}
.schedule .item h3 svg {opacity:0; width:25px; height:auto; display: inline-block; vertical-align: middle;}
.schedule .item h3 a:hover svg {opacity:1;}
.schedule .item.cancel .date,
.schedule .item.cancel .location,
.schedule .item.cancel h3 {text-decoration: line-through}

.schedule .item > .title {width:unset; flex:1}


.announcement-slider {max-width: 375px; }
.announcement-slider__item {position: relative;font-size:20px;}
.announcement-slider__item .badge {background:var(--color-hl);  z-index:1; color:var(--color-1); width:125px; height:125px; border-radius: 50%; font-weight:700; text-align: center;  position: absolute;display: flex;top: 0;right: 0;transform: translate(50%, -50%);align-items: center;justify-content: center;padding: 15px;hyphens: auto;-webkit-hyphens: auto;}

.plays__title svg,
.announcement-slider__title svg { opacity:0; width:25px; height:auto; display: inline-block; vertical-align: middle; padding:0 !important; margin:0 0 0 0 !important;}
a:hover .plays__title svg,
.plays__link:hover .announcement-slider__title svg {opacity: 1}



.announcement-slider .splide__arrow--next {right:-30px;}
.announcement-slider .splide__arrow--prev {left:-30px;z-index: 1}


.announcement-slider .splide__arrow {background:none;}
.announcement-slider .splide__arrow svg {fill:#fff; width:70px; height:70px}

.announcement-slider .splide__slide {overflow:hidden; opacity: 0;}
.announcement-slider .splide__slide.is-active {opacity: 1}
.announcement-slider .splide__slider,
.announcement-slider .splide__track,
.announcement-slider .splide__list,
.announcement-slider .splide__slide.is-active {
    overflow: visible;
}
.splide-wrapper {
    overflow: hidden;
    padding: 80px 0 0 0;
    margin-top:-180px !important;
    padding-left:50px; margin-left:-50px
}

.plays__item {margin-bottom:30px !important;}
.plays__item .cover {display: block;display: flex;justify-content: center;align-items: center; position: relative; margin-bottom:8px; aspect-ratio: 727 / 1024;overflow: hidden; background:var(--color-2);}

.plays__item .cover:before {content: '';     width: 100px; height:100px; background:url(../Images/more.svg) center center no-repeat; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%); }


.plays__item .cover img {opacity: 0;}

.plays__item .cover:hover img {opacity: 1;}
.plays__item .cover:hover:before {opacity: 0;}


.contacts__item + .contacts__item {margin-top:30px}
.contacts__name {font-weight:700}

.press__item .imageslider {padding-bottom:100px;}

body .glightbox-clean .gclose path {fill:#000}
body .glightbox-clean .gclose:hover,
body .glightbox-clean .gclose {color:#000; opacity: .7; border-radius: 0; width:58px; height:58px; background:#fff;}
body .glightbox-clean .gprev {width: 58px; height:58px; opacity: .7; border-radius: 0; background:url(../Images/prev.svg) no-repeat;}
body .glightbox-clean .gprev:hover {opacity: 1}
.imageslider .splide__arrow--prev {width: 58px; height:58px; border-radius: 0; background:url(../Images/prev.svg) no-repeat;bottom: 0;top: unset;left:unset; right: 0;transform: translate(calc(-100% - 20px), calc(100% + 20px)); }
body .glightbox-clean .gnext {width: 58px; height:58px; opacity: .7; border-radius: 0; background:url(../Images/next.svg) no-repeat;}
body .glightbox-clean .gnext:hover {opacity: 1;}
.imageslider .splide__arrow--next {width: 58px; height:58px; border-radius: 0; background:url(../Images/next.svg) no-repeat;bottom: 0;top: unset;right: 0;transform: translate(0, calc(100% + 20px)); }

.imageslider .glightbox {position: relative}
.imageslider .glightbox:after {content:''; background:url(../Images/lightbox-open.svg); width: 48px; height:48px; position:absolute; right:0; bottom:-2px }

body .glightbox-clean .gprev svg,
body .glightbox-clean .gnext svg,
.imageslider .splide__arrow--next svg,
.imageslider .splide__arrow--prev svg {opacity: 0}

.l-0 .imageslider .splide__arrow--prev,
.l-11 .imageslider .splide__arrow--prev { opacity:1; background:url(../Images/prev1.svg) no-repeat;}

.l-0 .imageslider .splide__arrow--next,
.l-11 .imageslider .splide__arrow--next {opacity:1; background:url(../Images/next1.svg) no-repeat;}


.tag {font-size:17px; display: inline-block; margin:2px 0; padding:3px 7px; background:var(--color-2);}
.tag.hl {background:var(--color-hl);}
.tag + .tag {margin-left:5px}

.l-10 .tag {background:var(--color-2); color:var(--color-1);}

.ensemble__group {border-top:1px solid var(--main-color); border-bottom:1px solid var(--main-color); padding:40px 0 80px 0}
.ensemble__group + .ensemble__group {border-top:0}
.ensemble__group h4 {margin-bottom:0}
.ensemble__group h4 + p {margin-top:0px;}
.ensemble__group h3 {font-weight:400}

.frame-type-igharztheater_ensemble {padding-right:calc(100% / 12 * 3);}


.ensemble__person {cursor: default; margin-bottom:30px;}

.ensemble__person--has-detail .ensemble__name {
    cursor: pointer;
}

.ensemble__person--has-detail .ensemble__name:hover,
.ensemble__person--has-detail .ensemble__name:focus-visible {
    text-decoration-color: currentColor;
    outline: none;
}

.ensemble__person--has-detail .ensemble__name:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 3px;
    border-radius: 2px;
}

.ensemble__name-toggle-icon {
    display: inline-block;
    margin-left: 0.4em;
    font-size: 0.75em;
    transition: transform 0.25s ease;
    aria-hidden: true; /* nur dekorativ */
}

.ensemble__person.is-active .ensemble__name-toggle-icon {
    transform: rotate(180deg);
}

/* Das versteckte Quell-Panel */
.ensemble__detail-source {
    display: none !important;
}

/* Das eingefügte floating Panel */
.ensemble__detail-panel {
    flex-basis: calc(100% + 150px);
    width: calc(100% + 150px);
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    transition: max-height 0.35s ease, opacity 0.25s ease;
    /* Visuelle Gestaltung nach Bedarf */
    padding: 0;
    background: var(--color-hl);
    color: var(--color-hl-contrast);
    box-sizing: border-box;
    margin:15px;
    margin-right:-150px;
}

.ensemble__detail-inner {
    padding: 50px;
}
.ensemble__detail-panel.is-visible {
    max-height: 3000px; /* großzügig, aber realistisch */
    opacity: 1;
}

/* Mobil: Panel direkt unter der Person, kein Floating */
@media (max-width: 767px) {
    .ensemble__detail-panel {
        flex-basis: 100%;
        /* im einspaltigen Layout ist die Reihe ohnehin nur 1 Person breit –
           das Panel landet automatisch direkt darunter */
    }
}

.ensemble__detail-panel a {font-weight:700}
.ensemble__detail-panel ul {margin:0; padding:0; list-style-type: none; width:100%; flex-wrap: wrap; display: flex;}
.ensemble__detail-panel ul li {width: 50%; margin-bottom:5px; padding-right:20px;}
.ensemble__detail-panel ul li a {font-size:110%; font-weight:800;}

.ensemble.has-open-detail .ensemble__occupation,
.ensemble.has-open-detail .ensemble__person {opacity: .5}

.ensemble.has-open-detail .ensemble__group.has-open-detail .ensemble__occupation,
.ensemble.has-open-detail .ensemble__person.is-active {opacity: 1}

ul.cast {display: flex; flex-wrap: wrap; margin:0; padding:0; list-style-type: none}
ul.cast li {padding-right:30px; margin-bottom:30px; width:25%;}
ul.cast strong {font-weight:700}



.reservation-form__context {border-top:2px solid var(--color-1);border-bottom:2px solid var(--color-1); padding:20px 0; margin-bottom:80px }
.reservation-form__context h3 + *,
.reservation-form__context h3 {margin:0}

.headerpic {position: relative; }
.headerpic > picture > img,
.headerpic > img {position: absolute; left:0; top:0; width:100%; height:100%; object-fit: cover;}
.headerpic .overlay {position: relative; }
.headerpic .overlay .main {min-height:1050px; padding-bottom:150px; display: flex;    justify-content: flex-end;flex-direction: column;}
.headerpic .overlay .main {text-align: right;}
.headerpic .overlay h1 {margin:20px 0 0 0; line-height:1em; }
.headerpic .overlay .tag {color:var(--color-1);}

.no-image .headerpic .overlay {background:var(--color-1);}
.no-image .headerpic .overlay .main {background:url(../Images/dummy-bg.png) center center no-repeat;    background-position: center -100px; background-size:100% auto}

#schedule-month-select {border:0; margin-bottom:40px; font-family: inherit; font-size:22px; font-weight:800; text-transform: uppercase; }
.schedule__month-label,
.schedule__month-submit {visibility: hidden; display: none}

.infos {display:flex; flex-wrap: wrap;    align-items: flex-end;}
.infos img {display: block;}
.infos * + * {padding-left:25px;}

.splide__slide {padding:0 10px}
.splide__pagination {bottom:-40px !important;}



.news-list-view .article {padding:30px 0; display:flex; border-top:2px solid var(--main-color);border-bottom:2px solid var(--main-color);    align-items: center;justify-content: space-between;}
.news-list-view a + a .article {border-top:0}
.news-list-view .news-list-date {padding-right:50px;}
.news-list-view .header {padding-right:50px; flex:1; flex-grow: 1}

.news-single {padding-top:200px}

.f3-widget-paginator {margin-top:30px;    display: flex;align-items: center;justify-content: flex-end; padding:0; list-style-type: none; text-align: right;}
.f3-widget-paginator li {display: inline-block; vertical-align: middle;}
.f3-widget-paginator li + li {margin-left:10px;}
.f3-widget-paginator li.current,
.f3-widget-paginator li a {display: flex; font-weight:800;    align-items: center;justify-content: center; width: 45px; height:45px; text-align: center; background:var(--main-color); color:var(--sec-color); }
.f3-widget-paginator li.current {background:var(--color-hl); color:var(--color-hl-contrast)}

.ce-gallery[data-ce-columns="3"] .ce-column {
    width:calc(33.3333% - 15px)
}
.ce-gallery[data-ce-columns="2"] .ce-column {
    width:calc(50% - 15px)
}

@media (max-width: 1100px) {
	.projects .c25 {width:33.3333%;}
    .ce-textpic.ce-intext .ce-gallery {max-width:50%;}
}

.l-81,
.frame-layout-81 {display: none; visibility: hidden}

/* Only Phones */
@media (max-width: 900px) {


    .l-81,
    .frame-layout-81 {display: unset; visibility: visible}

    .l-80,
    .frame-layout-80 {display: none; visibility: hidden}


    .c33,
    .c66,
    .c16,
    .c30,
    .c70,
    .c40,
    .c20,
    .c50,
    .c80,
    .c25,
    .c75,
    .c30,
    .c35,
    .c60 { -ms-flex: 0 0 100%;flex: 0 0 100%; max-width: 100%; }

    .cStage > div + div {margin-top:30px;}
    .cStage.l-99 {flex-direction: column-reverse}


}

@media (max-width: 650px) {

    .content .ce-left .ce-gallery,
    .content .ce-right .ce-gallery {
        float: none;
    }
    .content .ce-intext.ce-right .ce-gallery {
        margin-left: 0px;
    }
    .content .ce-intext.ce-left .ce-gallery {
        margin-right: 0px;
    }
    .ce-textpic.ce-intext .ce-gallery {max-width:100%;}

	.c30, .c35 {width:100%; padding-bottom:20px;}
}




/* Formulare */


.frame-type-form_formframework p { font-size:90%; }

input[type="checkbox"] { margin-right:15px; }

.control-label { display:none; }

.reservation-form input[type="text"],
.reservation-form input[type="number"],
.reservation-form select,
.reservation-form input[type="tel"],
.reservation-form input[type="email"],
.reservation-form textarea,

.form-group input[type="text"],
.form-group textarea,
.csc-form-element-textline input {
  font-family:inherit;
  font-size:inherit;
  color: var(--color-1);
  background:var(--color-2);
  width:100%;
  border:1px solid var(--color-2);
  padding:8px 15px;

  margin-bottom:6px;
}

.f3-form-error {border-color:red !important;}




form .row {display: flex; flex-wrap: wrap; margin:0 -10px;}
form .row .col-1 { --cols: calc( 100% / 12 * 1); }
form .row .col-2 { --cols: calc( 100% / 12 * 2); }
form .row .col-3 { --cols: calc( 100% / 12 * 3); }
form .row .col-4 { --cols: calc( 100% / 12 * 4); }
form .row .col-5 { --cols: calc( 100% / 12 * 5); }
form .row .col-6 { --cols: calc( 100% / 12 * 6); }
form .row .col-7 { --cols: calc( 100% / 12 * 7); }
form .row .col-8 { --cols: calc( 100% / 12 * 8); }
form .row .col-9 { --cols: calc( 100% / 12 * 9); }
form .row .col-10 { --cols: calc( 100% / 12 * 10); }
form .row .col-11 { --cols: calc( 100% / 12 * 11); }
form .row .col-12 { --cols: calc( 100% / 12 * 12); }
form .row > div {-ms-flex: 0 0 var(--cols);flex: 0 0 var(--cols); max-width: var(--cols); padding:0 10px;}

@media (max-width: 1000px) {
    form .row > div {-ms-flex: 0 0 100%;flex: 0 0 100%; max-width: 100%; padding:0 10px;}
}



/* The container */
.form-check-label {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.form-check-label input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.form-check-label span {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: transparent;
  border:2px solid  var(--color-1);
}
.form-check-label span.required { position:relative;width:auto; height:auto; border:0px; }

/* On mouse-over, add a grey background color */
.form-check-label:hover input ~ span {
  background-color:  var(--color-1);
}

/* When the checkbox is checked, add a blue background */
.form-check-label input:checked ~ span {
  background-color:  var(--color-1);
}

/* Create the checkmark/indicator (hidden when not checked) */
span:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.form-check-label input:checked ~ span:after {
  display: block;
}

/* Style the checkmark/indicator */
.form-check-label span:after {
  left: 6px;
  top: 3px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}