@charset "UTF-8";
@font-face { font-family: 'DM Mono'; font-style: normal; font-weight: 300; src: local(""), url("/fonts/dm-mono-v10-latin-300.woff2") format("woff2"), url("/fonts/dm-mono-v10-latin-300.woff") format("woff"); }
@font-face { font-family: 'DM Mono'; font-style: italic; font-weight: 300; src: local(""), url("/fonts/dm-mono-v10-latin-300italic.woff2") format("woff2"), url("/fonts/dm-mono-v10-latin-300italic.woff") format("woff"); }
@font-face { font-family: 'DM Mono'; font-style: normal; font-weight: 400; src: local(""), url("/fonts/dm-mono-v10-latin-regular.woff2") format("woff2"), url("/fonts/dm-mono-v10-latin-regular.woff") format("woff"); }
@font-face { font-family: 'DM Mono'; font-style: italic; font-weight: 400; src: local(""), url("/fonts/dm-mono-v10-latin-italic.woff2") format("woff2"), url("/fonts/dm-mono-v10-latin-italic.woff") format("woff"); }
@font-face { font-family: 'DM Mono'; font-style: normal; font-weight: 500; src: local(""), url("/fonts/dm-mono-v10-latin-500.woff2") format("woff2"), url("/fonts/dm-mono-v10-latin-500.woff") format("woff"); }
@font-face { font-family: 'DM Mono'; font-style: italic; font-weight: 500; src: local(""), url("/fonts/dm-mono-v10-latin-500italic.woff2") format("woff2"), url("/fonts/dm-mono-v10-latin-500italic.woff") format("woff"); }
@font-face { font-family: 'W droge'; font-style: normal; font-weight: 400; src: local(""), url("/fonts/W-Droge-MP.woff2") format("woff2"), url("/fonts/W-Droge-MP.woff") format("woff"); }
@media screen, projection { :root { --fill: 4vw; --color-main: #736c8d; --color-main-light: #9d93bf; --wht: #fffef9; --gap: min(1.4em, var(--fill)); --brdr: 10px; --wdl: clamp(1.5rem, 1.393rem + 0.54vw, 1.875rem); }
  html { height: 100%; box-sizing: border-box; -ms-text-size-adjust: 100%; -moz-text-size-adjust: none; -webkit-text-size-adjust: none; text-size-adjust: none; line-height: 1.15; scroll-behavior: smooth; }
  *, *::before, *::after { box-sizing: inherit; }
  body { min-height: 100%; max-width: 80em; margin: 0 1em; color: #111310; font-family: "DM Mono", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif; font-size: 93.75%; line-height: 1.4; font-weight: 300; background-color: #fffef9; }
  @supports (width: 0px) { body { width: min(80em, 100% - (var(--fill) * 2)); margin-right: auto; margin-left: auto; } }
  h1, h2, h3, h4, h5, h6 { line-height: 1.2; overflow-wrap: break-word; }
  h1 { margin: 2.8em 0 1.4em 0; font-size: 150%; font-size: clamp(1.125rem, 0.955rem + 0.85vw, 1.5rem); font-weight: normal; text-transform: uppercase; letter-spacing: 0.05em; }
  h2 { margin: 2em 0 .5em; font-size: 125%; font-size: clamp(1.125rem, 1.068rem + 0.28vw, 1.25rem); font-weight: normal; text-transform: uppercase; }
  h3, h4, h5, h6 { margin: 1.4em 0 0; font-size: 100%; font-weight: 500; font-weight: 400; }
  h3 + * { margin-top: .5rem; }
  a { color: inherit; text-underline-offset: .125em; background-color: transparent; }
  b, strong { font-weight: 500; }
  u { text-decoration: none; text-transform: uppercase; letter-spacing: .1em; }
  img { max-width: 100%; height: auto; border: 0; -ms-interpolation-mode: bicubic; }
  svg { max-width: 100%; height: auto; }
  img[src$=".svg"] { width: 100%; height: auto; max-width: none; }
  svg:not(:root) { overflow: hidden; }
  video, picture, canvas, iframe, object { display: block; max-width: 100%; height: auto; }
  figure { margin-left: auto; margin-right: auto; }
  figure img { vertical-align: top; }
  hr { height: 0; margin: 1.4em auto; color: inherit; border: none; border-top: 1px solid; }
  hr + * { margin-top: 0; }
  abbr { text-decoration: none; }
  *:focus:not(:focus-visible) { outline: none; }
  button, input, optgroup, select, textarea { font: inherit; line-height: 1.15; margin: 0; }
  textarea { resize: vertical; }
  button { color: inherit; }
  button, input { overflow: visible; }
  button, select { text-transform: none; }
  button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; }
  button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; }
  button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; }
  fieldset { padding: 0; margin: 0; border: none; }
  button, summary { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
  [hidden] { display: none; }
  .visually_hidden, .vh, .dots i { position: absolute; clip: rect(0 0 0 0); overflow: hidden; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; }
  /* HEADER */
  header { position: -webkit-sticky; position: sticky; top: 0; z-index: 11; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 1em; margin-left: calc(var(--fill) * -1); margin-right: calc(var(--fill) * -1); padding-left: var(--fill); padding-right: var(--fill); color: var(--color-main); background: #fffef9; border-bottom: 1px solid var(--color-main-light); }
  header h1 { margin: 0; text-align: center; font-size: 100%; }
  header a, header svg { display: inline-block; }
  header > a { margin-left: auto; }
  #logo { width: 46vw; min-width: 10em; max-width: 200px; vertical-align: bottom; }
  /* NAV */
  nav { color: var(--color-main); }
  nav ul { list-style: none; margin: 0; padding: 0; }
  nav a { display: block; text-decoration: none; }
  #menu { line-height: 1.2; }
  #menu ul ul li { padding-left: var(--fill); }
  #menu li { border-top: 1px solid var(--color-main-light); }
  #menu > ul > li:last-child { border-bottom: 1px solid var(--color-main-light); }
  #menu a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: .5em 0; font-size: clamp(1rem, 0.862rem + 0.79vw, 1.25rem); }
  #menu a[hassubmenu]:after { content: '>'; margin-left: auto; transition: -webkit-transform .2s; transition: transform .2s; }
  #navicon { display: block; color: var(--color-main); }
  #navicon svg { display: block; width: 2em; height: 2em; pointer-events: none; }
  .nav_icon { opacity: 1; transition: opacity .25s; }
  .nav_icon_expanded { opacity: 0; transition: opacity .25s; }
  #navicon[aria-expanded="true"] .nav_icon { opacity: 0; }
  #navicon[aria-expanded="true"] .nav_icon_expanded { opacity: 1; }
  /* MAIN */
  main { position: relative; margin-top: 1.4em; padding-bottom: 1.4em; }
  main:before { content: ''; display: block; position: absolute; z-index: -1; top: -1.4em; left: calc(var(--fill) * -1); right: calc(var(--fill) * -1); bottom: 0; background-image: repeating-linear-gradient(#e8f2f9 1px, rgba(255, 255, 255, 0) 2px, rgba(255, 255, 255, 0) 2em); }
  main > *:first-child, main > #stoerer:first-child + * { margin-top: 0; }
  main h1 { padding-left: 2.25em; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em; }
  main h1:before { content: ''; display: inline-block; vertical-align: text-bottom; width: 1.5em; height: 1.5em; margin-left: -2.25em; margin-right: .75em; background: no-repeat center; background-size: contain; background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 44' fill='%23736c8d'%3E %3Cpath d='M26.3 2.9c2 .2 4.2.5 6.1 1.3.9.4 1.4 1.4 1 2.4-.4.9-1.5 1.4-2.4 1-1.4-.6-3.2-.9-5-1-1.9-.2-3.7-.2-5-.1-4.7 0-8.8 2.2-12.5 6.9-2.8 3.3-4.4 8.6-3.7 13.7.3 2.4 1.6 4.4 3.2 6 2.3 2.3 5.1 3.4 8.2 4.1 2.8.6 5.8.6 8.6.1 1.6-.3 3-.6 4.3-1.2 1.3-.5 2.6-1.4 3.9-2.5 1.9-1.6 3.8-3.6 4.9-6 1.2-2.5 1.8-5.7.9-8.2-.7-1.9-2.1-3.4-3.6-4.1-1.1-.6-2.2-.9-3.6-1.3-.2-.1-.4-.1-.6-.2-1.8-.5-3.5-1-5.2-1.2-3-.3-5.8-.2-8.4.8-.8.3-1.4.7-2.1 1.3-1.4 1.3-2.5 2.5-3.3 4.1-.7 1.6-1.1 3.5-.8 5.2.3 2.4 1.7 4 3.4 5.2 1.9 1.4 4 2.1 6 2 1.5 0 2.9-.3 4.4-.9 2-.7 3.8-1.4 5.5-2.5.8-.5 1.5-1.2 2.2-2 .6-.7.9-1.2 1-1.8.4-1.7-.2-2.9-1.1-3.5-.6-.4-1.7-.8-2.9-1.2-.9-.3-1.8-.5-2.6-.7-.3-.1-.6-.1-.8-.2-3.6-.9-6.4.7-7.4 2.5-.9 1.6-.6 2.2-.4 2.4.3.3.9.7 2 .7s1.9-.3 2.2-.7c.1-.1.2-.2.2-.4 0-.1 0-.4-.3-1-.5-.9-.2-2 .6-2.5.9-.5 2-.2 2.5.7.6 1 .9 2.1.8 3.1-.1 1.1-.6 2-1.3 2.6-1.3 1.3-3.2 1.7-4.9 1.7-1.7 0-3.6-.6-4.8-2.2-1.3-1.7-1.2-4 .2-6.4 1.9-3.3 6.4-5.5 11.5-4.2.2.1.5.1.7.2.8.2 1.9.5 2.9.8 1.3.4 2.8.9 3.9 1.7 2.3 1.6 3.1 4.4 2.5 7.3-.3 1.5-1.2 2.6-1.7 3.3-.9 1.1-1.9 2-3 2.8-2 1.4-4.3 2.2-6.2 2.9-1.8.6-3.6 1-5.5 1.1-3 .1-5.8-1-8.2-2.6-2.3-1.6-4.4-4-5-7.7-.1-2.5.4-5 1.3-7.1 1-2.4 2.7-4 4.1-5.3 1-1 2.1-1.5 3.1-2C19.5 8.7 23 8.6 26.3 9c2 .2 4 .8 5.8 1.3.2.1.4.1.6.2 1.3.4 2.8.8 4.2 1.5 2.2 1.1 4.4 3.3 5.4 6.1 1.3 3.7.4 8-1.1 11s-3.7 5.3-5.9 7.1c-1.5 1.3-3.1 2.4-5 3.1-1.7.7-3.4 1-5 1.3-3.3.7-6.7.6-10.1-.1-3.5-.7-7-2-10-5.1-1.9-1.9-3.8-4.6-4.2-8.1-.8-6 1.1-12.4 4.4-16.6 4.5-5 9.5-7.9 15.6-7.9 1.3-.1 3.2-.1 5.3.1'/%3E%3C/svg%3E"); }
  main .aktuell h1:before { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 44' fill='%23736c8d'%3E %3Cpath d='M13.1 30.6c-1.8-.5-3.3-1.5-4.9-2.4-1.7-1.1-3.5-2.4-4.6-4.2-.5-.9-.9-2-1.1-3.1-.5-2.5-.4-5 .4-7.3.6-2 1.3-3.8 2.8-5.3 1-1.1 2.2-2.1 3.5-3C11 4 12.8 2.9 14.9 2.2c2.7-.9 5.6-1 8.4-1.1 3.3-.1 6.9-.1 10 1.2 1.8.8 3 1.8 4.4 3.1.7.6 1.2 1.1 1.7 2 1.7 3.1 2.7 6.6 2.3 10.2-.2 2.2-1 4.2-2 6.1-1.7 3.2-5.9 4.5-6.9 8.2-.4 1.4.1 2.7 0 4.2-.2 2.9-.4 3.2-.8 6.2-.1.7-1.5 1.2-1.8 0-.7-2.7-.5-3.1-1.4-5.3-.4-1-1.2-2-1.8-2.9-1.4-2.1-4.3-1.9-6.4-2-2.6-.2-5.1-.5-7.5-1.5'/%3E%3C/svg%3E"); }
  main * + * > h1:first-child { margin-top: 1.5em; }
  main .banner + h1 { margin-top: 0; }
  main .lbx + h1 { margin-top: 0; }
  main li + li { margin-top: .5em; }
  main li > ul, main li > ol { margin-top: .5em; }
  main *[id] { scroll-margin-top: 1.4em; }
  main b, main strong { /*
	font-weight: 400;
	text-transform: uppercase;
	font-size: 100% * 15 / 16;
	letter-spacing: $letter_spacing;
*/ }
  #stoerer { --red_alt: #db3a48; --bs: 0 0 20px rgba(0,0,0, 1); position: relative; z-index: 9; display: grid; place-items: center; width: 20em; height: 20em; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; margin: auto; padding: 1em 2em; color: #fff; background: var(--red_alt); border-radius: 50%; box-shadow: var(--bs); -webkit-transform: rotate(10deg); transform: rotate(10deg); }
  #stoerer > div { text-align: center; }
  #stoerer p { margin: 0; }
  #stoerer span:first-child { text-transform: uppercase; }
  #stoerer > button { cursor: pointer; position: absolute; top: .5em; right: .5em; padding: 1em; color: #fff; background: var(--red_alt); border: 0; border-radius: 50%; box-shadow: var(--bs); }
  #stoerer > button svg { vertical-align: top; width: 1em; height: 1em; }
  .programm h1:before { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 44' fill='%23736c8d'%3E%3Cpath d='M16.1 17.7c-1.5 0-1.1-1.9-1.6-3.2-1-2.5-2.2-5-3.2-7.5-.3-.8-1.3-2.6-1.5-3.4.2-.2 1.3-.6 1.7-.8.9-.4 1.5-.7 2.4-.7.1 0 .4.7.5.8.5.9.8 1.8 1.3 2.8l4.5 9c.2.4 1.3 3 1.6 3 .1 0-.1-.8-.1-.8 0-.4-.1-.9-.1-1.4 0-1.3 0-2.6.1-4 .2-2 .3-4.3.3-6.4 0-.4-.3-2.6-.1-2.9.1-.1.5.2.5.2.6 0 1.3.1 1.9.2.5.1 2-.4 2.4-.1.2.2.1 3.1.1 3.5 0 3.1.1 6.1.1 9.1 0 .5-.1 3.1-.1 3.6 0 0 .8-1.2.9-1.5.5-.8 1.3-1.6 2-2.4 1.8-2.1 3.7-4.2 5.6-6.2l1.9-1.9 1.1-1.1c1.4 0 2.8 2.1 3.9 3 .2.2.3.4.8 1.2.1.2-.8.9-1.2 1.3-1.1 1.1-2.5 2.2-3.8 3.2-2.7 2-5.5 3.9-8.1 6.1-.2.1-2.5 2.1-2.5 2.1 0 .1.2 0 .2 0 .3 0 .5.1.9.1.6 0 1.3.2 2.1.4 2.5.3 4.8 1.4 7.4 1.4.3 0 2.5.1 2.6.2.1.1-.1.4-.1.4-.4.9-.4 2-.7 3-.2.5-.3.9-.3 1.4 0 .1-.1.8-.1.8-1.3-.4-2.6-.9-4.1-1.2-1.8-.4-3.8-1.1-5.6-1.6-1.1-.3-2.3-.7-3.4-1.1-.2-.1-1.6-.7-1.6-.6 0 .5.5 1.2.5 1.8.2 1.9.5 4 1.1 6 .4 1.2.8 2.3 1 3.6.2.7 1.2 2.6 1.2 3.7 0 .7-4.5 1.6-4.7 1.3-.1-.1 0-.5 0-.6 0-.8-.4-1.6-.6-2.6-.8-3.3-1.2-6.6-1.8-9.9-.1-.6.2-4.1-.3-4.1 0 0-.6.5-.6.6 0 .4-.2.6-.4.9-.5.8-1.2 1.5-1.8 2.2-2.3 2.7-5 5.5-7.7 7.6-.9.7-1.6 1.5-2.4 2.2-.1.1-.9 1.2-.9 1.2-.6 0-2.5-3.6-2.7-4.2-.1-.1-.8-1.2-.8-1.3 0-.8 1.5-1.1 2.1-1.6 2.5-2.1 5.2-4 8-5.8 1.1-.7 2.5-1.3 3.4-2.2.1-.1 1.3-.5 1.3-.6 0 0-1-.3-1.1-.3-1.4 0-2.9-.4-4.2-.5-2.9-.2-6-.2-9-.2-.1 0-3.1.2-3.2.2-.2-.2.2-1.3.2-1.5 0-.9.5-4.1 1.1-4.8.1-.1 1.7-.1 2.3-.2 2.6-.2 5 .3 7.5.5.8.1 2.1-.1 2.8.4.4.2.5.2.8.4 0-.3.4-.2.3-.2z'/%3E%3C/svg%3E"); }
  img.abend { border-color: #80B0B8; }
  .banner.abend { border: var(--brdr) solid #80B0B8; }
  .lbx.abend { border: var(--brdr) solid #80B0B8; }
  .tile.abend .img img { border-color: #80B0B8; }
  img.familie { border-color: #fbdc84; }
  .banner.familie { border: var(--brdr) solid #fbdc84; }
  .lbx.familie { border: var(--brdr) solid #fbdc84; }
  .tile.familie .img img { border-color: #fbdc84; }
  img.kinder { border-color: #e4ccd1; }
  .banner.kinder { border: var(--brdr) solid #e4ccd1; }
  .lbx.kinder { border: var(--brdr) solid #e4ccd1; }
  .tile.kinder .img img { border-color: #e4ccd1; }
  .rarr, p:last-child > a:only-child:after, .lbtn:after, .invers p:last-child > a:only-child:after, .invers #cal + p > a:only-child:after, .spielplan .btn span:after { content: ' >'; font-size: 150%; line-height: 0.6666666667; vertical-align: middle; }
  p:last-child > a:only-child, .lbtn, .invers p:last-child > a:only-child, .invers #cal + p > a:only-child { display: inline-block; padding: .3em .5em .1em; line-height: 1; font-family: "W droge", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif; font-size: 125%; color: var(--wht); text-decoration: none; text-transform: uppercase; background: var(--color-main); }
  p.back:last-child > a:only-child:after { content: none; }
  p.back:last-child > a:only-child:before { content: '< '; }
  /* Coming */
  .slides { position: relative; display: grid; grid-template: "billboard"; place-items: start; place-content: center; }
  .slides button { position: absolute; z-index: 2; cursor: pointer; top: 0; width: 10%; height: 74%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: var(--wht); background: rgba(255, 255, 255, 0); border: none; }
  .slides button svg { margin: auto; width: 2em; height: 2em; }
  .slides .nxt { right: 0; }
  .hero { position: relative; width: 100%; grid-area: billboard; opacity: 0; }
  .hero h2 { margin: 0 0 .5rem; text-transform: uppercase; font-family: "W droge", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif; font-size: 150%; font-size: var(--wdl); line-height: 1; font-weight: normal; }
  .hero h2 span { -webkit-box-decoration-break: clone; box-decoration-break: clone; padding: .1em .25em 0; color: var(--wht); background: var(--color-main); }
  .hero.current { opacity: 1; z-index: 1; }
  .ready .hero { transition: opacity 3s; }
  .hero_image { width: 100%; aspect-ratio: 3/2; }
  .hero_image img { vertical-align: top; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; border-width: var(--brdr); border-style: solid; }
  .hero_content { margin: 1em 0 0; text-align: center; line-height: 1.2; }
  .hero_info p { margin: .5em 0; }
  .hero_info a:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; }
  .dots { display: none; margin: 0.5em 0 1.4em; padding: 0; list-style: none; text-align: center; }
  .dots li { display: inline-block; margin: 0 .5em; }
  .dots a:before { content: ''; display: inline-block; width: .75em; height: .75em; background: var(--wht); border: 2px solid var(--color-main); border-radius: 999px; transition: background .2s; }
  .dots a.current:before { background: var(--color-main); }
  .js .dots { display: block; }
  .block > div { margin: 1em 0; }
  .block > * > *:first-child { margin-top: 0; }
  .block > * > *:last-child { margin-bottom: 0; }
  .invers { padding: var(--gap); color: var(--wht); background: var(--color-main); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
  .invers > *:first-child { margin-top: 0; }
  .invers h1 { margin-bottom: .25em; padding-bottom: .25em; padding-left: 0; font-family: "W droge", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif; font-size: clamp(1.125em, 0.807em + 1.59vw, 2em); text-decoration: none; text-align: center; border-bottom: 2px solid; }
  .invers h1:before { content: none; }
  .invers h2 { margin-bottom: .25em; padding-bottom: .25em; font-family: "W droge", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif; font-weight: normal; text-transform: uppercase; border-bottom: 1px solid; }
  .invers p:last-child > a:only-child, .invers #cal + p > a:only-child { color: var(--color-main); background: var(--wht); }
  .invers a[href$=".pdf"]:before { content: ''; display: inline-block; vertical-align: bottom; width: 1.4em; height: 1.4em; margin-right: 1em; background: no-repeat center; background-size: 100%; background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 44' fill='%23ffffff'%3E %3Cpath d='M32 21.4l-2.2-2.2-6.2 6.1V2.8h-3.2v22.6l-6.2-6.2-2.2 2.2 10 10z'/%3E %3Cpath d='M36.8 30.8V38H7.2v-7.2H4v10.4H40V30.8z'/%3E%3C/svg%3E"); }
  .cal { width: 100%; margin: 0 0 1em; border-collapse: collapse; }
  .cal caption { padding: .25rem 0; font-family: "W droge", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif; font-size: var(--wdl); text-transform: uppercase; }
  .cal caption > div { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
  .cal caption button { -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; padding: 0 .25em; }
  .cal caption span { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-top: .25em; line-height: 1.2; }
  .cal button { cursor: pointer; color: inherit; background: transparent; border: 0; }
  .cal button svg { vertical-align: middle; }
  .cal thead, .cal tbody { font-size: 92.8571428571%; }
  .cal thead { border-top: 2px solid; }
  .cal tbody { border-bottom: 2px solid; }
  .cal tfoot { display: none; }
  .cal time { cursor: pointer; display: block; outline: 1px solid transparent; transition: outline .2s; }
  .cal #today { outline: 1px solid var(--wht); }
  .cal .selected, .cal time:hover { font-weight: 500; outline: 1px solid var(--wht); }
  .cal th { text-transform: uppercase; font-weight: normal; }
  .cal th, .cal td { padding: 0; text-align: center; border: 1px solid rgba(255, 255, 255, 0.05); }
  .cal th, .cal td time { padding: .5em; }
  .cal .busy { background: rgba(255, 255, 255, 0.2); }
  .shortlist { margin: 0 0 1.4em; padding: 0; list-style: none; line-height: 1.25; }
  .shortlist li { padding: 0 0 1em 0; margin: 1em 0; }
  .shortlist li { border-bottom: 1px solid rgba(255, 255, 255, 0.3); }
  .shortlist svg { float: left; width: 1em; height: 1em; margin-top: .2em; margin-right: .5em; margin-bottom: 1em; }
  .shortlist .title { text-transform: uppercase; }
  .shortlist .btn { display: block; margin: .25em 0; white-space: nowrap; text-transform: uppercase; font-family: "W droge", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif; font-size: 114.2857142857%; line-height: 1; }
  .shortlist .btn span { display: inline-block; padding: .375em .5em .25em; color: var(--color-main); background: var(--wht); }
  .banner { position: relative; overflow: hidden; height: 38vw; min-height: 14em; margin: 1.4em auto; max-height: max(50vh, 28em); background: #fff; }
  .banner .slide { position: absolute; top: 0; left: 0; right: 0; bottom: 0; opacity: 0; transition: opacity 2s; }
  .banner .slide.current { opacity: 1; z-index: 1; }
  .banner img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; }
  .banner .dots { position: absolute; z-index: 8; bottom: .5em; width: 100%; margin: 0; text-align: center; }
  .banner .dots a:before { width: 0.75em; height: 0.75em; border-color: var(--wht); background: rgba(0, 0, 0, 0); }
  .banner .dots a.current:before { background: var(--wht); }
  .lbx { position: relative; overflow: hidden; height: 38vw; min-height: 14em; margin: 1.4em auto; max-height: max(50vh, 28em); background: #fff; }
  .lbx a { display: block; width: 100%; height: 100%; }
  .lbx .lnk { position: absolute; top: -999em; }
  .lbx img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; }
  .lbx .info { pointer-events: none; position: absolute; right: 1em; bottom: .5em; color: var(--wht); line-height: 2; }
  .lbx .info svg { width: 1.5em; height: 1.5em; vertical-align: middle; }
  .filter { display: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; margin: 1.4em 0; }
  .filter button, .filter a { cursor: pointer; margin: 0 1em .75em 0; padding: .375em 1em .25em 1em; line-height: 1; text-decoration: none; background: var(--wht); border: 1px solid; border-width: 1.5px; border-radius: 999px; transition: color .2s, border-color .2s, background .2s; }
  .filter button svg, .filter a svg { pointer-events: none; width: 1.5em; height: 1.5em; vertical-align: middle; }
  .filter button.checked, .filter a.checked { color: var(--wht); background: var(--color-main); border-color: var(--color-main); }
  .filter button:hover, .filter a:hover { background: rgba(0, 0, 0, 0.05); }
  .filter button { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .filter a { display: inline-block; }
  .filter a:before { content: ''; display: inline-block; vertical-align: middle; height: 1.5em; }
  .filter:before { content: attr(aria-label); display: block; margin: 0 0 1em; }
  .filter button.active { color: var(--wht); background: var(--color-main); border-color: var(--color-main); }
  .js .filter { display: block; }
  .hide { pointer-events: none; opacity: .2; }
  .tiles { padding: 0; list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(20em, 1fr)); gap: 1em 1.4em; }
  .tiles > * { margin: 0; text-align: center; transition: opacity .25s; }
  .tiles img { display: block; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; }
  .tiles h3 { margin: 1.5rem 0 0; text-transform: uppercase; font-family: "W droge", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif; font-size: 150%; line-height: 1; font-weight: normal; }
  .tiles h3 a { text-decoration: none; }
  .tiles h3 span { -webkit-box-decoration-break: clone; box-decoration-break: clone; padding: .2em .25em 0; color: var(--wht); background: var(--color-main); }
  .tiles .summary { margin: 1em 0; font-size: 93.75%; line-height: 1.25; }
  .plays img { border-width: var(--brdr); border-style: solid; }
  .plays .img { aspect-ratio: 3/2; }
  .team { margin: 1.4em 0; grid-template-columns: repeat(auto-fit, minmax(15em, 1fr)); }
  .team .img { aspect-ratio: 1/1; }
  .team figcaption { padding-top: 1em; }
  .team p { margin: .5em 0; }
  .team h3 { margin-top: 0; }
  .team h3 + p { margin-top: .75em; }
  .team p:last-child > a:only-child { display: inline; padding: .0; line-height: 1inherit; font-family: "DM Mono", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif; color: inherit; text-transform: none; background: transparent; }
  .team p:last-child > a:only-child:after { content: none; }
  .spielplan { width: 100%; line-height: 1.25; border-collapse: collapse; }
  .spielplan thead th { position: absolute; clip: rect(0 0 0 0); overflow: hidden; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; }
  .spielplan svg { width: 1em; height: 1em; max-width: initial; }
  .spielplan td { border-top: 0.5em solid var(--wht); padding: .5em .75em .75em; vertical-align: top; }
  .spielplan td:first-child { padding-left: 0; }
  .spielplan td:nth-child(3) { width: 75%; }
  .spielplan .familie td { background: #fbdc84; }
  .spielplan .abend td { background: #80B0B8; }
  .spielplan .ks td { background: #e4ccd1; }
  .spielplan tr { transition: opacity .25s; }
  .spielplan tr td:first-child { background-color: transparent; }
  .spielplan .month { padding: 1em 0; text-align: left; }
  .spielplan .month h3 { text-transform: uppercase; font-family: "W droge", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif; font-size: 171.4285714286%; line-height: 1; font-weight: normal; }
  .spielplan .month h3 span { display: inline-block; padding: .2em .25em .05em; color: var(--wht); background: var(--color-main); }
  .spielplan .type, .spielplan .location { display: block; font-size: 92.8571428571%; line-height: 1.3461538462; text-transform: uppercase; letter-spacing: 0.05em; word-spacing: -0.25em; }
  .spielplan .location { margin-top: .5em; padding: .25em; color: var(--wht); background: var(--color-main); }
  .spielplan .location:before { content: ''; display: inline-block; vertical-align: text-top; width: 1.1em; height: 1.1em; margin-right: .25em; background: no-repeat left center transparent; background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E %3Cpath fill='%23FFFFFF' d='M8 19.7c.1-.4 0-2.9 0-4 .2-3.2.5-5.4 1.9-5.8.6-.2 2.8-.1 3.5 0 3.5.8 3.2 4.1 3.2 6.8 0 .9-.3 3.1.7 3.5.9.4 4.7.6 5.5 0 .4-.3.5-2.5.5-3 .2-2.9.6-8.5-1.6-10.9-1.4-1.5-4.7-2-6.7-2.2-2.6-.3-4.8-1-7.8-.3-2.5.7-4.7.6-5.8 3.2-.3.7-.7 3.2-.8 3.9-.3 2.7-.2 5.9.6 8.5.1.4.9.3 1.2.3.3 0 5.5.2 5.6 0'/%3E%3C/svg%3E"); background-size: contain; }
  .spielplan .stpetridom:before { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E %3Cpath fill='%23FFFFFF' d='M2.2 16.1c-.4 1.6-1.2 4.4-.3 5.5 1.1 1.3 9 1.2 11.8 1.3 3.6.2 8.5.4 8.7-1 .5-1.9-.2-7.9-.5-9.7-.2-1.8-1.2-6.5-1.4-6.8-.6-1.7-1.7-4.1-2.6-4.1-1.3 0-2.2 3.1-2.5 3.9 0 0-.8 3.1-1.3 4.8-.3 1.2-.7 5.2-1.7 5.1-1-.3-2.2-12.9-4.5-14.2C6.7.8 5.4 5 5.1 6.1c-.2.5-1.6 4.5-1.6 5-.5 1.5-.6 1.9-1.3 5'/%3E%3C/svg%3E"); }
  .spielplan .status { color: #f00; font-size: 93.75%; text-transform: uppercase; letter-spacing: 0.05em; }
  .spielplan .status, .spielplan .type, .spielplan .title, .spielplan .subtitle { display: block; margin: .5em 0; }
  .spielplan td:nth-child(3) > *:first-child { margin-top: 0; }
  .spielplan td:nth-child(3) > *:last-child { margin-bottom: 0; }
  .spielplan .title { text-transform: uppercase; }
  .spielplan .btn { display: block; margin: .25em 0; white-space: nowrap; color: var(--color-main); font-family: "W droge", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif; font-size: 114.2857142857%; text-transform: uppercase; }
  .spielplan .btn span { display: inline-block; padding: .2em .375em 0; background: var(--wht); }
  .spielplan .cancelled td:nth-child(2) { color: #f00; text-decoration: line-through; }
  .spielplan .cancelled .status { color: #f00; }
  .spielplan .cancelled .tickets { color: #f00; }
  .spielplan .cancelled .tickets span:after { content: none; }
  .spielplan .deferred td:nth-child(2) { color: #f00; }
  .spielplan .deferred .tickets { color: #f00; }
  .spielplan .deferred .tickets span:after { content: none; }
  .spielplan .soldout .tickets span:after { content: none; }
  .spielplan .relocated .tickets span:after { content: none; }
  article dl { margin: 2.8em 0; }
  article dt { display: inline; text-transform: uppercase; }
  article dt:before { content: '\A'; white-space: pre; }
  article dd { display: inline; margin: 0; padding: 0; }
  article .back { margin-top: 2.8em; }
  .icon svg { width: 1.5em; height: 1.5em; vertical-align: middle; }
  .attachments { padding: 0; list-style: none; }
  .av { position: relative; overflow: auto; margin: 1.4em 0; }
  .av:first-child { margin-top: 0; }
  .av:before { content: ''; display: block; width: 1px; padding-bottom: 56.25%; }
  .av > iframe { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; }
  blockquote { margin: 1.4em 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; font-style: italic; }
  blockquote p { width: max(32em, 60%); margin: 0; }
  blockquote br + em { display: block; text-align: right; font-style: normal; }
  .ensemble h3 { grid-area: name; text-transform: uppercase; font-family: "W droge", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif; font-size: 150%; line-height: 1; font-weight: normal; }
  .ensemble h3 span { -webkit-box-decoration-break: clone; box-decoration-break: clone; padding: .1em .25em 0; color: var(--wht); background: var(--color-main); }
  .ensemble figure { grid-area: image; }
  .ensemble > div { grid-area: txt; }
  .ensemble figcaption::first-line { text-transform: uppercase; }
  .logotiles { padding: 0; list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(10em, 1fr)); gap: var(--gap) calc(var(--gap) * 5); }
  .logotiles li { display: -webkit-box; display: -ms-flexbox; display: flex; }
  .logotiles img { margin: auto; max-width: 12em; }
  .downloads { margin: 2.8em 0; }
  .downloads h3 { margin: 1.5rem 0 0; text-transform: uppercase; font-family: "W droge", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif; font-size: 150%; line-height: 1; font-weight: normal; }
  .downloads h3 span { -webkit-box-decoration-break: clone; box-decoration-break: clone; padding: .1em .25em 0; color: var(--wht); background: var(--color-main); }
  .downloads ul { padding: 0; list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(10em, 1fr)); gap: 1em 1.4em; }
  .downloads figcaption { margin-top: .5em; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 87.5%; }
  .downloads figcaption:before { content: ''; display: inline-block; width: 1.2em; height: 1.2em; background: no-repeat left; background-size: contain; background-image: url("/assets/icons/download.svg"); }
  .downloads a { color: var(--color-main); }
  .links ul { padding: 0; list-style: none; }
  .links li + li { margin-top: 1em; }
  .links li a { text-decoration: none; }
  /* FOOTER */
  footer { position: relative; padding: 1em 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0 var(--fill); color: var(--color-main); }
  footer ul { margin: 0; padding: 0; list-style: none; }
  footer a { text-decoration: none; }
  footer #signet { grid-column: 1; grid-row: 1 / 3; height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; }
  footer #signet svg { vertical-align: bottom; width: auto; height: 100%; max-width: 68%; margin: 0 auto .25em; }
  footer #signet + p { display: none; }
  footer #signet + p + ul { grid-column: 2; grid-row: 2; }
  footer .sm { grid-column: 2; grid-row: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding-bottom: 1em; }
  footer .sm li { -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; }
  footer .sm li + li { -webkit-margin-start: 1em; -moz-margin-start: 1em; margin-inline-start: 1em; }
  footer .sm a, footer .sm svg { display: block; }
  footer:after { content: ''; position: absolute; z-index: -1; top: 0; left: calc(var(--fill) * -1); right: calc(var(--fill) * -1); bottom: 0; background: var(--wht); }
  /* Lightbox */
  /*!
   * baguetteBox.js
   * @author  feimosi
   * @version %%INJECT_VERSION%%
   * @url https://github.com/feimosi/baguetteBox.js
   */
  #baguetteBox-overlay { display: none; opacity: 0; position: fixed; overflow: hidden; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000000; background-color: #222; background-color: rgba(0, 0, 0, 0.8); transition: opacity .5s ease; }
  #baguetteBox-overlay.visible { opacity: 1; }
  #baguetteBox-overlay .full-image { display: inline-block; position: relative; width: 100%; height: 100%; text-align: center; padding: 2em 5vw; }
  #baguetteBox-overlay .full-image figure { display: inline; margin: 0; height: 100%; }
  #baguetteBox-overlay .full-image img { display: inline-block; width: auto; height: auto; max-height: 100%; max-width: 100%; vertical-align: middle; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); }
  #baguetteBox-overlay .full-image figcaption { display: block; position: absolute; left: 0; bottom: 0; width: 100%; text-align: center; line-height: 1.8; white-space: normal; color: #ccc; background-color: #000; background-color: rgba(0, 0, 0, 0.6); font-family: sans-serif; }
  #baguetteBox-overlay .full-image:before { content: ""; display: inline-block; height: 50%; width: 1px; margin-right: -1px; }
  #baguetteBox-slider { position: absolute; left: 0; top: 0; height: 100%; width: 100%; white-space: nowrap; transition: left .4s ease, -webkit-transform .4s ease; transition: left .4s ease, transform .4s ease; }
  #baguetteBox-slider.bounce-from-right { -webkit-animation: bounceFromRight .4s ease-out; animation: bounceFromRight .4s ease-out; }
  #baguetteBox-slider.bounce-from-left { -webkit-animation: bounceFromLeft .4s ease-out; animation: bounceFromLeft .4s ease-out; }
  @-webkit-keyframes bounceFromRight { 0% { margin-left: 0; }
    50% { margin-left: -30px; }
    100% { margin-left: 0; } }
  @keyframes bounceFromRight { 0% { margin-left: 0; }
    50% { margin-left: -30px; }
    100% { margin-left: 0; } }
  @-webkit-keyframes bounceFromLeft { 0% { margin-left: 0; }
    50% { margin-left: 30px; }
    100% { margin-left: 0; } }
  @keyframes bounceFromLeft { 0% { margin-left: 0; }
    50% { margin-left: 30px; }
    100% { margin-left: 0; } }
  .baguetteBox-button#next-button, .baguetteBox-button#previous-button { top: 50%; top: calc(50% - 30px); width: 44px; height: 60px; }
  .baguetteBox-button { position: absolute; cursor: pointer; outline: none; padding: 0; margin: 0; border: 0; border-radius: 15%; background-color: #323232; background-color: rgba(50, 50, 50, 0.5); color: #ddd; font: 1.6em sans-serif; transition: background-color .4s ease; }
  .baguetteBox-button:focus, .baguetteBox-button:hover { background-color: rgba(50, 50, 50, 0.9); }
  .baguetteBox-button#next-button { right: 2%; }
  .baguetteBox-button#previous-button { left: 2%; }
  .baguetteBox-button#close-button { top: 20px; right: 2%; right: calc(2% + 6px); width: 30px; height: 30px; }
  .baguetteBox-button svg { position: absolute; left: 0; top: 0; }
  /* Preloader Borrowed from http://tobiasahlin.com/spinkit/ */
  .baguetteBox-spinner { width: 40px; height: 40px; display: inline-block; position: absolute; top: 50%; left: 50%; margin-top: -20px; margin-left: -20px; }
  .baguetteBox-double-bounce1, .baguetteBox-double-bounce2 { width: 100%; height: 100%; border-radius: 50%; background-color: #fff; opacity: .6; position: absolute; top: 0; left: 0; -webkit-animation: bounce 2s infinite ease-in-out; animation: bounce 2s infinite ease-in-out; }
  .baguetteBox-double-bounce2 { -webkit-animation-delay: -1s; animation-delay: -1s; }
  @-webkit-keyframes bounce { 0%, 100% { -webkit-transform: scale(0); transform: scale(0); }
    50% { -webkit-transform: scale(1); transform: scale(1); } }
  @keyframes bounce { 0%, 100% { -webkit-transform: scale(0); transform: scale(0); }
    50% { -webkit-transform: scale(1); transform: scale(1); } }
  #baguetteBox-overlay { margin: 0; }
  #baguetteBox-overlay * + * { margin-top: 0; }
  #baguetteBox-overlay .full-image { padding: 2em min(var(--fill), 6vw); }
  #baguetteBox-overlay .full-image figcaption { bottom: -1%; padding: .5em; }
  #baguetteBox-slider { top: 1%; height: 98%; }
  .baguetteBox-button { background: rgba(0, 0, 0, 0); }
  .baguetteBox-button g, .baguetteBox-button polyline { stroke: var(--color-main); transition: stroke .2s; }
  .baguetteBox-button:focus, .baguetteBox-button:hover { background: rgba(0, 0, 0, 0.3); }
  .baguetteBox-button:hover g, .baguetteBox-button:hover polyline { stroke: var(--wht); }
  .baguetteBox-button#close-button { top: 1vw; right: calc(1% + 6px); }
  .baguetteBox-button#previous-button { left: 1%; }
  .baguetteBox-button#next-button { right: 1%; } }
@media (prefers-reduced-motion: reduce) { * { /*
animation-duration: 0.01ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.01ms !important;
scroll-behavior: auto !important;
*/ } }
@media only screen and (min-width: 24em) { :root { --mq: '24'; } }
@media only screen and (max-width: 32em) { .spielplan tbody tr { position: relative; display: block; margin-top: 1em; }
  .spielplan tbody .month { padding: 0; }
  .spielplan tbody td { display: block; width: 100%; border-top: 1px solid rgba(255, 255, 255, 0.3); border-top: 0; }
  .spielplan tbody td:nth-child(1) { display: none; }
  .spielplan tbody td:nth-child(3) { width: 100%; }
  .spielplan tbody .btn { display: inline-block; }
  .spielplan tbody .hide td:nth-child(2) ~ td { position: absolute; left: -999em; }
  .spielplan .title { margin: 1em 0; } }
@media only screen and (min-width: 36em) { :root { --mq: '36'; }
  body { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
  body > * { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; min-width: 100%; }
  header { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; }
  main { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }
  #stoerer { position: absolute; top: 0; right: 0; }
  .ensemble { margin: 2em 0; display: grid; grid-template-areas: "name name" "image txt"; grid-template-columns: 1fr 3fr; gap: 1em; }
  .ensemble h3 { margin: 0; }
  .ensemble div > *:first-child { margin-top: 0; }
  .ensemble figcaption a { -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; }
  footer { margin-top: auto; } }
@media only screen and (min-width: 44em) { :root { --mq: '44'; }
  .hero_content { margin-top: 1.4em; }
  .hero_info p { margin: 1em 0; }
  main { padding-bottom: 4.2em; }
  footer { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; gap: 1em; padding-top: 1.4em; padding-bottom: 1.4em; }
  footer #signet { -ms-flex-negative: 0; flex-shrink: 0; margin: 0; }
  footer #signet svg { margin: 0 0 .25em; height: 8em; max-width: none; }
  footer #signet + p { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; display: block; margin: 0; font-size: 112.5%; line-height: 1.2444444444; }
  footer #signet + p + ul { -webkit-columns: 2 6em; -moz-columns: 2 6em; columns: 2 6em; -ms-flex-negative: 0; flex-shrink: 0; }
  footer #signet + p + ul li { padding-right: 1em; }
  footer #signet + p + ul:before { content: ''; display: block; height: 1.4em; }
  footer .sm { -ms-flex-negative: 0; flex-shrink: 0; padding-bottom: .25em; }
  footer:after { top: calc(5.6em + 2.6em); } }
@media only screen and (max-width: 51.99em) { @-webkit-keyframes highlight { 0% { background-color: rgba(157, 147, 191, 0.2); }
    100% { background-color: rgba(0, 0, 0, 0); } } @keyframes highlight { 0% { background-color: rgba(157, 147, 191, 0.2); }
    100% { background-color: rgba(0, 0, 0, 0); } }
  .js nav { position: fixed; z-index: 10; overflow-y: auto; top: calc(68px + 2em); top: var(--hhght, calc(68px + 2em + 1px)); left: -100%; bottom: 0; width: 100%; padding: 0 var(--fill) 1.4em; background: #fffef9; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); transition: -webkit-transform .25s 0s, left .25s .25s; transition: transform .25s 0s, left .25s .25s; will-change: transform; }
  .js .navigating nav { left: 0; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); transition: -webkit-transform .25s, left 0s; transition: transform .25s, left 0s; }
  .js #menu > ul > li:first-child { border: none; }
  .js #menu ul ul { display: none; }
  .js #menu ul ul li { padding-left: calc(var(--fill) * 2); }
  .js #menu li { margin-left: calc(var(--fill) * -1); margin-right: calc(var(--fill) * -1); padding-left: var(--fill); padding-right: var(--fill); }
  .js #menu a[hassubmenu].open + ul { display: block; }
  .js #menu a[hassubmenu].open + ul li { -webkit-animation: highlight 2s; animation: highlight 2s; }
  .js #menu a[hassubmenu].open:after { -webkit-transform: rotate(90deg); transform: rotate(90deg); }
  .js #menu a:hover, .js #menu .current > a, .js #menu .active > a { opacity: .7; } }
@media only screen and (min-width: 52em) { :root { --mq: '52'; }
  header { display: block; text-align: center; position: relative; border: none; }
  #logo { width: initial; max-width: none; }
  #navicon { display: none; }
  #menu { position: relative; transition: color .2s; /*
	li:nth-child(2) li:first-child {
	margin-left: 8.5%;
	}
	li:nth-child(3) li:first-child {
	margin-left: 28.5%;
	}
*/ }
  #menu:after { content: ''; position: absolute; z-index: -1; top: 0; left: calc(var(--fill) * -1); right: calc(var(--fill) * -1); bottom: 0; background: var(--wht); border-top: 1px solid var(--color-main-light); border-bottom: 1px solid var(--color-main-light); transition: background-color .1s; }
  #menu:hover { color: var(--wht); }
  #menu:hover:after { background: var(--color-main); border-bottom-color: #5b5670; }
  #menu ul ul { color: var(--color-main); background: var(--wht); transition: color .2s, background-color .1s; }
  #menu ul ul:after { content: ''; position: absolute; z-index: -1; top: 0; left: calc(var(--fill) * -1); right: calc(var(--fill) * -1); bottom: -1px; background: var(--wht); border-bottom: 1px solid var(--color-main); transition: background-color .1s; box-shadow: 0 4px 4px -2px rgba(0, 0, 0, 0.2); }
  #menu ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
  #menu ul ul { display: none; position: absolute; z-index: 2; top: 100%; left: 0; right: 0; }
  #menu ul ul li { padding-left: 0; }
  #menu ul ul li + li { margin-left: 1em; }
  #menu ul ul:hover { color: var(--wht); background: var(--color-main); }
  #menu ul ul:hover:after { background: var(--color-main); }
  #menu > ul { position: relative; }
  #menu li { border-top: 0; }
  #menu > ul > li:last-child { border-bottom: 0; }
  #menu a { padding: .75em 0; white-space: nowrap; font-size: 87.5%; }
  #menu a span { display: none; }
  #menu ul ul a { padding: .75em 1em .75em 0; }
  #menu a:not([hassubmenu]):hover, #menu .current > a, #menu .active > a { text-decoration: underline; }
  #menu a[hassubmenu] { cursor: pointer; position: relative; }
  #menu a[hassubmenu]:after { content: none; }
  #menu a[hassubmenu]:hover:after { content: ''; position: absolute; top: 50%; left: -4em; right: -4em; bottom: 0; }
  #menu li:last-child a[hassubmenu]:hover:after { right: 0; }
  #menu li:hover > ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: initial; -ms-flex-pack: initial; justify-content: initial; }
  #menu li:hover li:first-child { margin-left: var(--smml, 0); }
  #menu li:last-child:hover > ul, #menu li:nth-last-child(2):hover > ul { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }
  #menu li:last-child > ul li:last-child a { padding-right: 0; }
  .js nav { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } }
@media only screen and (min-width: 52em) { :root { --mq: '52'; --fill: 1em; }
  #stoerer { position: absolute; top: 20em; right: 1em; }
  .block { display: grid; grid-template-columns: 2fr 1fr; gap: var(--gap); margin: 1em 0; }
  .block > div { margin: 0; }
  .block.revers { grid-template-columns: 1fr 2fr; } }
@media only screen and (min-width: 56em) { :root { --mq: '56'; --fill: 1.5em; }
  #menu a { font-size: 100%; } }
@media only screen and (min-width: 64em) { :root { --mq: '64'; --fill: 4.6vw; }
  body { font-size: 100%; }
  #menu a { padding: .75em 0; white-space: nowrap; font-size: 106.25%; }
  #menu a span { display: inline-block; }
  #menu ul ul a { padding: .75em 1.5em .75em 0; }
  #stoerer { right: 0; padding: 2em 3em; }
  #stoerer > button { top: 1em; right: 1em; }
  .spielplan { width: calc(100% + 1.75em); margin-left: -1.75em; }
  .spielplan .month { padding-left: 1.75em; }
  .spielplan td:nth-child(2) { width: 18%; }
  .spielplan td:nth-child(3) { width: 56%; }
  .spielplan td:nth-child(4) { width: 24%; }
  footer #signet + p { font-size: 125%; } }
@media only screen and (min-width: 80em) { :root { --mq: '80'; }
  html { overflow-x: hidden; }
  body { font-size: 100%; }
  header { position: relative; }
  header:after { content: ''; position: absolute; z-index: -1; top: 0; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; bottom: 0; background: var(--wht); }
  #menu:after, #menu ul ul:after, footer:after { left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; }
  #menu a { padding: .75em 0; white-space: nowrap; font-size: 125%; }
  main:before { left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; }
  #stoerer { right: -1em; } }
@media only screen and (min-width: 96em) { :root { --mq: '96'; --fill: 6rem; --__gap: 2rem; } }
/* IE 10+ */
@media print { * { color: #000 !important; text-shadow: none !important; background-color: transparent !important; }
  body { margin: 1cm; font: 12pt/1.2 'Helvetica Neue',sans-serif; }
  h1 { font-size: 125%; }
  h2 { font-size: 112.5%; }
  h3, h4, h5, h6 { font-size: 100%; margin: 0; }
  h2, h3 { page-break-after: avoid; }
  p, h2, h3 { orphans: 3; widows: 3; }
  ul, ol { page-break-inside: avoid; }
  li { margin: 0 0 0 1em; padding: 0; }
  a, a:visited { text-decoration: underline; }
  img { max-width: 100% !important; height: auto; page-break-inside: avoid; }
  pre, blockquote { padding: 1em; border: 1px solid #999; page-break-inside: avoid; }
  hr { margin: 2em 0; border: 0; border-bottom: 1px solid #000; }
  table { page-break-inside: auto; }
  tr { page-break-inside: avoid; page-break-after: auto; }
  thead { display: table-header-group; }
  tfoot { display: table-footer-group; }
  /* #divs { display : none; } */ }
.dev body:before { content: var(--mq); position: fixed; z-index: 1000; bottom: 10px; left: 10px; padding: .5em 2em; color: #fff; background: rgba(0, 0, 0, 0.7); -webkit-font-smoothing: antialiased; }