@charset "UTF-8";
/* 
	CHANGELOG
		v0	Interim	2020-juni			hsl(348, 100%, 50%);	// lindgrün
		v6	Spielzeit 2020-herbst		rgba( 229,35,45, 1);	// himbeer		#e5232c
		v7	Spielzeit 2021-fruehling	rgba( 0,165,167, 1); 	// türkis		#00a4a6
		v8	Spielzeit 2021-herbst
				neu: Archiv, …

		v10	Spielzeit 2024-herbst
		- akzentfarbe -> farbe1 (grün): hsl(125, 45%, 44%)
*/
.home main::-webkit-scrollbar, aside::-webkit-scrollbar, .over::-webkit-scrollbar {
  width: 13px;
  height: 13px;
}
.home main::-webkit-scrollbar-thumb, aside::-webkit-scrollbar-thumb, .over::-webkit-scrollbar-thumb {
  background: var(--farbe2);
  border-radius: 13px;
  border: 2px solid white;
  min-height: 100px;
}
.home main::-webkit-scrollbar-track, aside::-webkit-scrollbar-track, .over::-webkit-scrollbar-track {
  background: white;
}
.home main, aside, .over {
  scrollbar-face-color: var(--farbe2);
  scrollbar-track-color: white;
}
.home main, aside, .over {
  scrollbar-color: var(--farbe2) white;
}

/* VARIABLEN */
:root {
  --farbe1: hsl(125, 45%, 44%);
  --farbe2: hsl(290, 22%, 56%);
}

/* TYPOGRAPHY */
@font-face {
  font-family: "Messina Sans";
  src: url("../webfonts/messina/MessinaSansWeb-Regular.eot");
  /* IE9 Compat Modes */
  src: url("../webfonts/messina/MessinaSansWeb-Regular.eot?#iefix") format("embedded-opentype"), url("../webfonts/messina/MessinaSansWeb-Regular.woff2") format("woff2"), url("../webfonts/messina/MessinaSansWeb-Regular.woff") format("woff");
  /* Pretty Modern Browsers */
  font-weight: 400;
  font-style: normal;
  font-stretch: normal;
  unicode-range: U+000D-FB04;
}
@font-face {
  font-family: "Messina Sans";
  src: url("../webfonts/messina/MessinaSansWeb-Bold.eot");
  /* IE9 Compat Modes */
  src: url("../webfonts/messina/MessinaSansWeb-Bold.eot?#iefix") format("embedded-opentype"), url("../webfonts/messina/MessinaSansWeb-Bold.woff2") format("woff2"), url("../webfonts/messina/MessinaSansWeb-Bold.woff") format("woff");
  /* Pretty Modern Browsers */
  font-weight: 700;
  font-style: normal;
  font-stretch: normal;
  unicode-range: U+000D-FB04;
}
@font-face {
  font-family: "Messina Sans";
  src: url("../webfonts/messina/MessinaSansWeb-RegularItalic.eot");
  /* IE9 Compat Modes */
  src: url("../webfonts/messina/MessinaSansWeb-RegularItalic.eot?#iefix") format("embedded-opentype"), url("../webfonts/messina/MessinaSansWeb-RegularItalic.woff2") format("woff2"), url("../webfonts/messina/MessinaSansWeb-RegularItalic.woff") format("woff");
  /* Pretty Modern Browsers */
  font-weight: 400;
  font-style: italic;
  font-stretch: normal;
  unicode-range: U+000D-FB04;
}
@font-face {
  font-family: "Beirut Text";
  src: url("../webfonts/beirut/BeirutTextWeb-Regular.eot");
  /* IE9 Compat Modes */
  src: url("../webfonts/beirut/BeirutTextWeb-Regular.eot?#iefix") format("embedded-opentype"), url("../webfonts/beirut/BeirutTextWeb-Regular.woff2") format("woff2"), url("../webfonts/beirut/BeirutTextWeb-Regular.woff") format("woff");
  /* Pretty Modern Browsers */
  font-weight: 400;
  font-style: normal;
  font-stretch: normal;
  unicode-range: U+000D-FB04;
}
@font-face {
  font-family: "Beirut Text";
  src: url("../webfonts/beirut/BeirutTextWeb-BookItalic.eot");
  /* IE9 Compat Modes */
  src: url("../webfonts/beirut/BeirutTextWeb-BookItalic.eot?#iefix") format("embedded-opentype"), url("../webfonts/beirut/BeirutTextWeb-BookItalic.woff2") format("woff2"), url("../webfonts/beirut/BeirutTextWeb-BookItalic.woff") format("woff");
  /* Pretty Modern Browsers */
  font-weight: 400;
  font-style: italic;
  font-stretch: normal;
  unicode-range: U+000D-FB04;
}
@font-face {
  font-family: "Beirut Text";
  src: url("../webfonts/beirut/BeirutDisplayWeb-Bold.eot");
  /* IE9 Compat Modes */
  src: url("../webfonts/beirut/BeirutDisplayWeb-Bold.eot?#iefix") format("embedded-opentype"), url("../webfonts/beirut/BeirutDisplayWeb-Bold.woff2") format("woff2"), url("../webfonts/beirut/BeirutDisplayWeb-Bold.woff") format("woff");
  /* Pretty Modern Browsers */
  font-weight: 700;
  font-style: normal;
  font-stretch: normal;
  unicode-range: U+000D-FB04;
}
@font-face {
  font-family: "Beirut Display";
  src: url("../webfonts/beirut/BeirutDisplayWeb-Bold.eot");
  /* IE9 Compat Modes */
  src: url("../webfonts/beirut/BeirutDisplayWeb-Bold.eot?#iefix") format("embedded-opentype"), url("../webfonts/beirut/BeirutDisplayWeb-Bold.woff2") format("woff2"), url("../webfonts/beirut/BeirutDisplayWeb-Bold.woff") format("woff");
  /* Pretty Modern Browsers */
  font-weight: 700;
  font-style: normal;
  font-stretch: normal;
  unicode-range: U+000D-FB04;
}
@font-face {
  font-family: "Beirut Display";
  src: url("../webfonts/beirut/BeirutDisplayWeb-Black.eot");
  /* IE9 Compat Modes */
  src: url("../webfonts/beirut/BeirutDisplayWeb-Black.eot?#iefix") format("embedded-opentype"), url("../webfonts/beirut/BeirutDisplayWeb-Black.woff2") format("woff2"), url("../webfonts/beirut/BeirutDisplayWeb-Black.woff") format("woff");
  /* Pretty Modern Browsers */
  font-weight: 900;
  font-style: normal;
  font-stretch: normal;
  unicode-range: U+000D-FB04;
}
@font-face {
  font-family: "Beirut Display";
  src: url("../webfonts/beirut/BeirutDisplayWeb-BookItalic.eot");
  /* IE9 Compat Modes */
  src: url("../webfonts/beirut/BeirutDisplayWeb-BookItalic.eot?#iefix") format("embedded-opentype"), url("../webfonts/beirut/BeirutDisplayWeb-BookItalic.woff2") format("woff2"), url("../webfonts/beirut/BeirutDisplayWeb-BookItalic.woff") format("woff");
  /* Pretty Modern Browsers */
  font-weight: 400;
  font-style: italic;
  font-stretch: normal;
  unicode-range: U+000D-FB04;
}
@font-face {
  font-family: "Beirut Text";
  src: url("../webfonts/beirut/BeirutTextWeb-BoldItalic.eot");
  /* IE9 Compat Modes */
  src: url("../webfonts/beirut/BeirutTextWeb-BoldItalic.eot?#iefix") format("embedded-opentype"), url("../webfonts/beirut/BeirutTextWeb-BoldItalic.woff2") format("woff2"), url("../webfonts/beirut/BeirutTextWeb-BoldItalic.woff") format("woff");
  /* Pretty Modern Browsers */
  font-weight: 700;
  font-style: italic;
  font-stretch: normal;
  unicode-range: U+000D-FB04;
}
@font-face {
  font-family: "Beirut Display";
  src: url("../webfonts/beirut/BeirutDisplayWeb-BoldItalic.eot");
  /* IE9 Compat Modes */
  src: url("../webfonts/beirut/BeirutDisplayWeb-BoldItalic.eot?#iefix") format("embedded-opentype"), url("../webfonts/beirut/BeirutDisplayWeb-BoldItalic.woff2") format("woff2"), url("../webfonts/beirut/BeirutDisplayWeb-BoldItalic.woff") format("woff");
  /* Pretty Modern Browsers */
  font-weight: 700;
  font-style: italic;
  font-stretch: normal;
  unicode-range: U+000D-FB04;
}
body {
  text-rendering: optimizeLegibility;
  /* emphasizes in legibility over rendering speed */
  -webkit-font-smoothing: antialiased;
  /* apply font anti-aliasing */
  -moz-osx-font-smoothing: grayscale;
  /* optimize font rendering */
  /* turn on kerning, highly recomened */
  -ms-font-feature-settings: "kern" 1;
  /* turn on kerning, highly recomened */
  -o-font-feature-settings: "kern" 1;
  /* turn on kerning, highly recomened */
  /* turn on kerning, highly recomened */
  font-feature-settings: "kern" 1;
  /* turn on kerning, highly recomened */
  -webkit-font-kerning: normal;
          font-kerning: normal;
  /* turn on kerning, highly recomened */
  font-feature-settings: "liga" off;
  /* ligatures: on or off */
  font-feature-settings: "dlig" off;
  /* discretionary-ligatures: on or off */
  font-feature-settings: "tnum" off;
  /* tabular figures: on or off */
  font-feature-settings: "onum" off;
  /* old-style-figures: on or off */
  font-feature-settings: "ss01" off;
  /* alternate glyphs (stylistic Set): on or off */
  font-variant-ligatures: none;
}

body {
  font-size: 1.8rem;
  line-height: 1.3;
  font-family: "Beirut Text", Georgia, serif;
  font-weight: 400;
  color: #222;
}

h1, h2, h3, b {
  font-family: "Beirut Text", Georgia, serif;
  font-weight: 700;
}

h3 {
  font-size: 1.25em;
}

i, b {
  font-family: "Beirut Text", Georgia, serif;
  font-weight: 600;
  font-style: italic;
}

nav, aside, figcaption, date, time, .legende, .autorschaft, .sbozs.subpage main li, th, footer {
  font-family: "Messina Sans", Helvetica, sans-serif;
}

small, .legende, .autorschaft, .sbozs.subpage section li, th {
  font-size: 0.8em;
}

footer {
  padding: 8rem;
  font-size: 0.8em;
}

.small-caps {
  font-size: 1.7rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.not-available {
  color: #aaa;
}

.produktionen h1, .produktionen h2, .programm.subpage h1, .programm.subpage h2, .type-festival h1, .type-festival h2 {
  margin: 0.4em 0 0.5em 0;
  text-transform: uppercase;
  font-style: italic;
}
.produktionen .text *:not(h1), .produktionen .spieldaten *, .produktionen h6, .programm.subpage .text *:not(h1), .programm.subpage .spieldaten *, .programm.subpage h6, .type-festival .text *:not(h1), .type-festival .spieldaten *, .type-festival h6 {
  font-family: "Messina Sans", Helvetica, sans-serif;
  font-style: normal;
  margin-top: 0;
}
.produktionen h6, .programm.subpage h6, .type-festival h6 {
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--farbe1);
  font-size: 1.8rem;
  font-weight: normal !important;
}
.produktionen main, .programm.subpage main, .type-festival main {
  padding-top: 4vw;
}
.produktionen .byline, .programm.subpage .byline, .type-festival .byline {
  margin-top: 1.5em;
  font-size: 0.86em;
}
.produktionen em, .programm.subpage em, .type-festival em {
  font-style: italic !important;
}
.produktionen .spieldaten, .programm.subpage .spieldaten, .type-festival .spieldaten {
  float: right;
  width: 25vw;
  padding-right: 0;
  min-height: 100vw;
  overflow: hidden;
}
.produktionen .spieldaten ol, .programm.subpage .spieldaten ol, .type-festival .spieldaten ol {
  list-style: none;
  padding-left: 0;
  margin: 0;
}
.produktionen .spieldaten li, .programm.subpage .spieldaten li, .type-festival .spieldaten li {
  list-style: none;
  padding: 0.5em 0;
  line-height: 1.2;
  font-size: 0.86em;
}
.produktionen .spieldaten li, .programm.subpage .spieldaten li, .type-festival .spieldaten li {
  border-top: 0.1rem solid var(--farbe1);
}
.produktionen .spieldaten li:last-child, .programm.subpage .spieldaten li:last-child, .type-festival .spieldaten li:last-child {
  border-bottom: 0.1rem solid var(--farbe1);
}
.produktionen .spieldaten ol a:not(.pfeil, .vcal-eintrag), .programm.subpage .spieldaten ol a:not(.pfeil, .vcal-eintrag), .type-festival .spieldaten ol a:not(.pfeil, .vcal-eintrag) {
  float: right;
  color: var(--farbe1);
  border: 0.12rem solid var(--farbe1);
  font-weight: bold;
  border-radius: 0.7em;
  padding: 0.1em 0.4em;
  margin-top: 0.5em;
  margin-right: 2vw;
}
.produktionen .spieldaten ol a.inaktiv, .produktionen .spieldaten ol .notiz-zeigen a, .programm.subpage .spieldaten ol a.inaktiv, .programm.subpage .spieldaten ol .notiz-zeigen a, .type-festival .spieldaten ol a.inaktiv, .type-festival .spieldaten ol .notiz-zeigen a {
  color: #ccc;
  border-color: #ccc;
  pointer-events: none;
}
.produktionen .spieldaten ol a.pfeil, .programm.subpage .spieldaten ol a.pfeil, .type-festival .spieldaten ol a.pfeil {
  font-weight: normal;
  border: none;
}
.produktionen .spieldaten ol a.pfeil:after, .programm.subpage .spieldaten ol a.pfeil:after, .type-festival .spieldaten ol a.pfeil:after {
  content: " →";
  color: var(--farbe1);
}
.produktionen .spieldaten a.vcal-eintrag, .programm.subpage .spieldaten a.vcal-eintrag, .type-festival .spieldaten a.vcal-eintrag {
  border-bottom: none;
  margin-left: 0.2em;
  position: relative;
  top: -0.1rem;
}
.produktionen .spieldaten a.vcal-eintrag svg, .programm.subpage .spieldaten a.vcal-eintrag svg, .type-festival .spieldaten a.vcal-eintrag svg {
  fill: var(--farbe1);
  width: auto;
  height: 1em;
}
.produktionen .spieldaten a.vcal-eintrag:hover svg, .programm.subpage .spieldaten a.vcal-eintrag:hover svg, .type-festival .spieldaten a.vcal-eintrag:hover svg {
  fill: black;
}
.produktionen .spieldaten .eckdaten, .programm.subpage .spieldaten .eckdaten, .type-festival .spieldaten .eckdaten {
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}
.produktionen .spieldaten .eckdaten li, .programm.subpage .spieldaten .eckdaten li, .type-festival .spieldaten .eckdaten li {
  list-style: none;
  margin-bottom: 0.66em;
  padding: 0 1.5em 0 0;
  border: 0;
}
.produktionen .beteiligte, .programm.subpage .beteiligte, .type-festival .beteiligte {
  padding-bottom: 2em;
  padding-left: 8rem;
}
.produktionen .beteiligte p, .programm.subpage .beteiligte p, .type-festival .beteiligte p {
  padding-left: 0;
  display: inline;
  font-size: 0.8em;
}
.produktionen .beteiligte p + p:before, .programm.subpage .beteiligte p + p:before, .type-festival .beteiligte p + p:before {
  content: " / ";
}
.produktionen .beteiligte p.leerzeile, .programm.subpage .beteiligte p.leerzeile, .type-festival .beteiligte p.leerzeile {
  display: block;
}
.produktionen .beteiligte p.leerzeile:before, .produktionen .beteiligte p.leerzeile + p:before, .programm.subpage .beteiligte p.leerzeile:before, .programm.subpage .beteiligte p.leerzeile + p:before, .type-festival .beteiligte p.leerzeile:before, .type-festival .beteiligte p.leerzeile + p:before {
  content: "";
}
.produktionen .rezensionen, .programm.subpage .rezensionen, .type-festival .rezensionen {
  padding-bottom: 2em;
  padding-left: 8rem;
}
.produktionen .rezensionen p, .programm.subpage .rezensionen p, .type-festival .rezensionen p {
  padding-left: 1.2em !important;
  border-left: 1px solid var(--farbe1);
  font-size: 0.8em;
}

.programm.subpage .spieldaten, .type-festival .spieldaten {
  min-height: 0;
  overflow: auto;
}
.programm.subpage .text, .type-festival .text {
  padding-right: 1em;
}

.type-festival summary {
  cursor: pointer;
}
.type-festival summary::marker {
  color: var(--farbe1);
}
.type-festival summary h4 {
  display: inline;
  margin-left: 1em;
}
.type-festival details p {
  font-size: 2.064rem;
}
.type-festival .festivalprogramm, .type-festival .rahmenprogramm {
  height: auto;
  background-color: white !important;
}
.type-festival .festivalprogramm h4, .type-festival .rahmenprogramm h4 {
  margin-bottom: 0;
  color: black;
  display: inline;
}
.type-festival .festivalprogramm li, .type-festival .rahmenprogramm li {
  list-style: square;
  color: var(--farbe1);
}
.type-festival .festivalprogramm small, .type-festival .rahmenprogramm small {
  color: black;
  display: block;
}
.type-festival .festivalprogramm a.teaser, .type-festival .rahmenprogramm a.teaser {
  box-shadow: inset -2em -1em 4em rgba(0, 0, 0, 0.1);
}
.type-festival .festivalprogramm .teaser, .type-festival .rahmenprogramm .teaser {
  justify-content: flex-end;
  align-items: flex-start;
  text-align: left;
  font-family: "Messina Sans", Helvetica, sans-serif;
}
.type-festival .festivalprogramm .teaser .titelei, .type-festival .rahmenprogramm .teaser .titelei {
  display: block;
  width: 100%;
  min-height: 9rem;
  padding: 1.8rem;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0));
}
.type-festival .festivalprogramm .teaser .titelei *, .type-festival .rahmenprogramm .teaser .titelei * {
  color: white !important;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}
.type-festival .festivalprogramm .teaser span, .type-festival .rahmenprogramm .teaser span {
  display: inline-block;
  float: left;
  font-size: 0.6em;
  text-transform: uppercase;
  text-shadow: none !important;
  padding: 1px 0.3em;
  margin-bottom: 0.6rem;
}
.type-festival .festivalprogramm .teaser span.vorort, .type-festival .rahmenprogramm .teaser span.vorort {
  background-color: #fb44b6;
}
.type-festival .festivalprogramm .teaser span.online, .type-festival .rahmenprogramm .teaser span.online {
  background-color: #2d2cff;
}
.type-festival .festivalprogramm .teaser span.spielort, .type-festival .rahmenprogramm .teaser span.spielort {
  background-color: var(--farbe1);
  color: white !important;
  font-weight: bold;
  margin-top: 0.6rem;
}
.type-festival .festivalprogramm .teaser .spielort svg, .type-festival .rahmenprogramm .teaser .spielort svg {
  width: 12px;
  height: 11px;
  margin-bottom: 2px;
  opacity: 0.8;
}
.type-festival .festivalprogramm .teaser h4, .type-festival .rahmenprogramm .teaser h4 {
  display: block;
  clear: both;
  line-height: 1.1;
  margin: 0.4rem 0;
}
.type-festival .festivalprogramm .teaser small, .type-festival .rahmenprogramm .teaser small {
  font-weight: normal;
  line-height: 1.1;
}
.type-festival .festivalprogramm + footer, .type-festival .rahmenprogramm + footer {
  display: none;
}
.type-festival .rahmenprogramm .teaser.klein {
  height: 16vw;
  justify-content: flex-start;
  align-items: flex-start;
}
.type-festival .rahmenprogramm .teaser.klein .titelei {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0));
}
.type-festival .byline.kompakt + p:after {
  content: "Weiterlesen…";
  cursor: pointer;
  margin-left: 0.33em;
  border-bottom: 1px solid var(--farbe1);
  color: var(--farbe1);
}
.type-festival .byline.kompakt + p ~ p {
  display: none;
}

.festivalprogramm .festival-ticketing {
  margin-top: 6rem;
  padding-bottom: 16rem;
  padding-left: 4rem;
}
.festivalprogramm .festival-ticketing p {
  font-size: 0.86em;
  max-width: 40em;
}
.festivalprogramm .festival-ticketing p + p {
  margin-top: 1em !important;
}
.festivalprogramm .festival-ticketing a {
  display: inline;
  background-color: white !important;
  border-bottom: 1px solid var(--farbe1);
  color: black;
}

h6 a.festival-link {
  color: #070ef0;
  border-color: #070ef0;
}

@media screen and (max-width: 800px) {
  .rahmenprogramm .teaser.klein,
.festivalprogramm .teaser.klein {
    width: 100%;
    border-top: 1px solid white;
  }
}
@media screen and (min-width: 1300px) {
  .festivalprogramm .teaser.klein {
    width: 33.33%;
  }

  .rahmenprogramm .teaser.klein {
    width: 33.33%;
    height: 16vw;
  }
}
li.ausverkauft em {
  color: var(--farbe1);
  font-style: normal !important;
}

li.abgesagt, li.abgesagt *, li.verschoben, li.verschoben * {
  color: #aaa !important;
}
li.abgesagt:hover, li.abgesagt:hover *, li.verschoben:hover, li.verschoben:hover * {
  color: #aaa !important;
}

li.viaKasse .notiz-kasse {
  color: var(--farbe1);
  font-weight: bold;
  margin: 0.33em 0;
}

ol li.viaKasse:target {
  background-color: var(--farbe1);
}
ol li.viaKasse:target strong:after {
  content: "nur via Kasse";
  display: block;
}

/* BOX MODEL, SCALING */
* {
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
}

/* POSITIONIERUNG 

	.raster { 
		border: 1px solid pink;
		display: grid; 
		grid-gap: 8.0rem; 
		padding-left: 8.0rem;
		grid-template-columns: 2fr 1fr; 
		grid-template-rows: auto auto; 
		grid-template-areas:
			"oben oben"
	    	"links rechts"
			"unten unten";
	}
	.raster * { 
		border: 1px solid #eee; padding: 0; }
	.raster {

		.hauptspalte { grid-area:links; }
		.nebenspalte { grid-area:rechts; }                                                   
		footer { grid-area:unten; }
	}
	footer { margin-bottom: 8.0rem; padding-right: 8.0rem; }
*/
main, .over {
  overflow-y: scroll;
  font-size: 2.4rem;
}
main section, main .raster, .over section, .over .raster {
  width: 100%;
  max-width: 112rem;
  padding: 0 4rem 0 8rem;
  line-height: 1.4;
}
main .raster, .over .raster {
  padding: 0;
  max-width: 75vw;
}
main .text, .over .text {
  padding-left: 0;
}
main .text .lead p, .over .text .lead p {
  font-style: italic !important;
  color: black !important;
}
main .text p, main .text h1, main .text h2, main .text h3, main .text ul, main .text table, main .text .lb-inline, main .text form, .over .text p, .over .text h1, .over .text h2, .over .text h3, .over .text ul, .over .text table, .over .text .lb-inline, .over .text form {
  padding-left: 8rem;
}
main .text table, .over .text table {
  width: 100%;
}
main .text table th, main .text table td, .over .text table th, .over .text table td {
  vertical-align: top;
  width: 50%;
}
main .text table td, .over .text table td {
  padding-right: 2em;
  line-height: 1.2;
  padding-bottom: 0.66em;
}
main .text table th, .over .text table th {
  text-align: left;
  padding-top: 0.2em;
  font-weight: normal;
}
main section.galerie, .over section.galerie {
  max-width: 100%;
  padding: 4rem 0;
}
.produktionen main section:last-of-type, .produktionen .over section:last-of-type {
  padding-bottom: 16rem;
}
main h1, main h2, .over h1, .over h2 {
  font-size: 7.2rem;
  line-height: 1;
  margin-top: 0;
  margin-bottom: 2rem;
}
main h3, .over h3 {
  font-size: 3.6rem;
  margin-bottom: 0.66em;
  margin-top: 1.5em;
}
main .text h2, .over .text h2 {
  margin-bottom: 1em;
  font-size: 6rem;
}
main p + h2, .over p + h2 {
  margin-top: 2em;
}
main p, .over p {
  margin-top: 0;
}
main .autorschaft, .over .autorschaft {
  font-style: normal;
  font-size: 0.8em;
  margin-bottom: 4rem;
}
main section.text ul, .over section.text ul {
  margin-left: 2.5em;
  list-style: none;
  padding-left: 2.2em;
}
main section.text ul li:before, .over section.text ul li:before {
  content: "– ";
  position: relative;
  left: -0.4em;
}
main section.text ul li, .over section.text ul li {
  list-style: none;
  text-indent: -0.8em;
  margin-bottom: 0.5em;
}
main section iframe, .over section iframe {
  border: 0;
  max-width: 100%;
}

.sbozs.subpage main {
  overflow: visible !important;
  padding-top: 10vw;
}
.sbozs.subpage h2 {
  font-family: "Beirut Display", Georgia, serif !important;
  font-style: italic;
  font-weight: normal;
}
.sbozs.subpage .text > h3 {
  margin-top: 5.6em;
  font-family: "Messina Sans", Helvetica, sans-serif;
  font-size: 0.9em;
  color: black;
}
.sbozs.subpage article h3 {
  color: black;
  margin-top: 1.5em;
}
.sbozs.subpage article p.bild img {
  height: 32rem;
  width: auto;
  transform: translateX(-8.1rem);
}
.sbozs.subpage section.programmbezug {
  width: 75vw !important;
  max-width: none;
  overflow-x: scroll;
  padding: 0;
}
.sbozs.subpage .zeile, .sbozs.subpage .kategorie {
  max-width: 100%;
}
.sbozs.subpage .zeile {
  padding: 1.6rem 8rem 4rem 4rem;
  margin-right: 8rem;
  display: grid;
  grid-gap: 1vw;
  grid-template-columns: repeat(999, 1fr);
  grid-template-rows: 1;
}
.sbozs.subpage .zeile img {
  margin: 0;
  padding: 0;
  vertical-align: top;
  width: 100%;
  height: auto;
  background-color: var(--farbe1);
  background-blend-mode: multiply;
  background-size: contain;
}
.sbozs.subpage .zeile h3 {
  font-family: "Messina Sans", Helvetica, sans-serif;
  font-size: 1.8rem;
  margin: 0.66em 0 0 0;
  line-height: 1.2;
}
.sbozs.subpage .zeile p {
  font-family: "Messina Sans", Helvetica, sans-serif;
  font-size: 1.8rem;
  margin-top: 0;
  line-height: 1.2;
}
.sbozs.subpage .tickets-und-mehr {
  color: var(--farbe1);
  font-weight: bold;
  font-size: 1.8rem;
}
.sbozs.subpage .programmbezug {
  overflow-x: hidden !important;
}
.sbozs.subpage .programmbezug article {
  width: 200px;
  min-height: 300px;
}
.sbozs.subpage .programmbezug article * {
  padding-left: 0;
}
.sbozs.subpage .programmbezug .zeile {
  padding-left: 8rem;
}
.sbozs.subpage .vita {
  max-width: 30em;
  padding-left: 0;
}
.sbozs.subpage .vita p {
  font-family: "Messina Sans", Helvetica, sans-serif;
  font-size: 1.8rem;
  margin-top: 0;
  line-height: 1.2;
}

.home main, .startseite main {
  padding: 0;
  position: relative;
  background-color: black;
}
.home main, .startseite main {
  display: flex;
  justify-content: center;
  align-items: center;
}
.home video, .startseite video {
  width: 100%;
  height: 100vh;
  -o-object-fit: cover;
     object-fit: cover;
}
.home .willkommen, .startseite .willkommen {
  transition-delay: 7s !important;
  transition: opacity 0.2s ease-out;
  opacity: 1;
  font-family: "Beirut Display", Georgia, serif;
  font-size: 5.6vmax;
  font-weight: 900;
  text-align: center;
  position: absolute;
  z-index: 100;
}
.home .willkommen a, .startseite .willkommen a {
  color: white;
  border-bottom: none;
}
.home .fadeout, .startseite .fadeout {
  transition-delay: 2s;
  opacity: 0;
}

.intro {
  width: 100%;
  height: 100vh;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  background-color: var(--farbe1);
}
.intro a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: var(--farbe1);
  color: white;
  font-weight: bold;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  border-bottom: none;
}
.intro a:hover {
  -webkit-filter: brightness(1.15);
          filter: brightness(1.15);
}
.intro a:active {
  -webkit-filter: brightness(1.3);
          filter: brightness(1.3);
}
.intro a.gross:active * {
  color: var(--farbe1);
}
.intro a.hyperlink:hover * {
  color: #555 !important;
}
.intro a.hyperlink:active * {
  color: var(--farbe1) !important;
}
.intro a.produktion:hover {
  background-color: #191919 !important;
}
.intro a.produktion:active {
  background-color: black !important;
  color: var(--farbe1);
}
.intro a.gross {
  padding: 1.2em 1.4em;
  justify-content: flex-end;
  align-items: flex-end;
  width: 100%;
  height: 85vh;
  border-bottom: 1px solid var(--farbe1);
  line-height: 0.95;
}
.intro a.gross time {
  font-family: "Messina Sans", Helvetica, sans-serif;
}
.intro .blog-anriss {
  font-family: "Beirut Text", Georgia, serif !important;
  font-style: normal;
  padding: 0 3vw;
  background-color: white;
  color: black;
  border-top: 1.4rem solid var(--farbe1);
  padding-top: 1rem;
  padding-bottom: 1.6rem;
}
.intro .blog-anriss h3 {
  font-family: "Beirut Display", Georgia, serif !important;
  font-style: italic;
  font-weight: normal !important;
}
.intro .blog-anriss p {
  font-size: 1.8rem;
  font-family: "Messina Sans", Helvetica, sans-serif;
  text-align: left;
}
.intro .blog-anriss date.beitrag {
  margin: 0 0 1.25em 0;
  color: var(--farbe1);
}
.intro .hyperlink {
  font-family: "Messina Sans", Helvetica, sans-serif !important;
  background-color: white;
  color: black;
  padding: 1.2rem 3.6rem;
}
.intro .hyperlink h3 {
  font-size: 3.6rem;
  line-height: 1.15;
  padding-bottom: 0.9em;
  margin-top: 0;
  padding-top: 0;
}
.intro .hyperlink p {
  font-size: 2.1rem;
  line-height: 1.25;
}
.intro .hyperlink h3 {
  font-family: "Messina Sans", Helvetica, sans-serif !important;
}
.intro .produktion {
  background-color: #141414;
  align-items: flex-start;
  padding: 1.6em;
}
.intro .produktion div {
  margin-top: 0;
  margin-bottom: 0;
}
.intro .produktion h3 {
  line-height: 1.15;
}
.intro .produktion time {
  font-size: 2.1rem !important;
  line-height: 1 !important;
  font-family: "Messina Sans", Helvetica, sans-serif !important;
}
.intro .klein {
  width: 50%;
  min-height: 28vh;
  height: auto;
}
.intro .teaser h3 {
  margin: 0 0 0.25em 0;
}
.intro .teaser.gross h3, .intro .teaser.produktion h3 {
  text-transform: uppercase;
  font-style: italic;
}
.intro .teaser.produktion h3 {
  font-weight: normal !important;
}
.intro .teaser p, .intro .teaser time {
  margin: 0;
  font-weight: normal;
}
.intro .klein {
  text-align: center;
}
.intro .klein img {
  width: 46%;
  height: auto;
  margin: 2%;
}
.intro .mit-bild {
  display: flex;
  flex-direction: row !important;
}
.intro .mit-bild div {
  width: 50%;
  padding: 0 1em;
}
.intro .ohne-bild div {
  margin-left: auto !important;
  margin-right: auto !important;
}
.intro .produktion {
  padding: 0.8rem;
}
.intro .produktion {
  line-height: 1.1 !important;
}
.intro .produktion h3 {
  margin-top: 0.5em;
}
.intro #item8825 {
  background-color: black;
  color: white;
}

.infos main, .type-menuepunkt main, .informationen main, .das-haus main, .type-info main, .sbozs.landing main, .team.landing main {
  padding-top: 10vw;
}
.infos main article, .type-menuepunkt main article, .informationen main article, .das-haus main article, .type-info main article, .sbozs.landing main article, .team.landing main article {
  margin-bottom: 4em;
}
.infos main section:last-child, .type-menuepunkt main section:last-child, .informationen main section:last-child, .das-haus main section:last-child, .type-info main section:last-child, .sbozs.landing main section:last-child, .team.landing main section:last-child {
  padding-bottom: 4em;
}
.infos main .text h2, .type-menuepunkt main .text h2, .informationen main .text h2, .das-haus main .text h2, .type-info main .text h2, .sbozs.landing main .text h2, .team.landing main .text h2 {
  font-size: 3.2rem;
  font-family: "Messina Sans", Helvetica, sans-serif;
}
.infos main .text h3, .type-menuepunkt main .text h3, .informationen main .text h3, .das-haus main .text h3, .type-info main .text h3, .sbozs.landing main .text h3, .team.landing main .text h3 {
  font-size: 2.4rem;
}
.infos main p, .infos main table, .infos main li, .infos main h3, .type-menuepunkt main p, .type-menuepunkt main table, .type-menuepunkt main li, .type-menuepunkt main h3, .informationen main p, .informationen main table, .informationen main li, .informationen main h3, .das-haus main p, .das-haus main table, .das-haus main li, .das-haus main h3, .type-info main p, .type-info main table, .type-info main li, .type-info main h3, .sbozs.landing main p, .sbozs.landing main table, .sbozs.landing main li, .sbozs.landing main h3, .team.landing main p, .team.landing main table, .team.landing main li, .team.landing main h3 {
  font-family: "Messina Sans", Helvetica, sans-serif;
}
.infos main td, .type-menuepunkt main td, .informationen main td, .das-haus main td, .type-info main td, .sbozs.landing main td, .team.landing main td {
  font-weight: bold;
}
.infos main ul.mappe, .type-menuepunkt main ul.mappe, .informationen main ul.mappe, .das-haus main ul.mappe, .type-info main ul.mappe, .sbozs.landing main ul.mappe, .team.landing main ul.mappe {
  margin-top: -0.33em;
  margin-top: 1em;
}
.infos main .text .sponsor, .type-menuepunkt main .text .sponsor, .informationen main .text .sponsor, .das-haus main .text .sponsor, .type-info main .text .sponsor, .sbozs.landing main .text .sponsor, .team.landing main .text .sponsor {
  width: 200px;
  max-width: 100%;
  display: inline;
  -webkit-filter: grayscale(1);
          filter: grayscale(1);
  vertical-align: baseline;
  margin-right: 1.5em;
  margin-bottom: 1.5em;
}

.sponsoren-partner .text a {
  border-bottom: none !important;
}

.abonnieren .blickfang img {
  float: left;
  margin-right: 2vw;
  width: 25% !important;
  margin-bottom: 2em;
}
.abonnieren .blickfang div {
  float: left;
  width: 70%;
  margin-bottom: 2em;
  margin-right: 0;
}
.abonnieren article {
  clear: both;
  margin-left: 8rem;
}
.abonnieren article h3 {
  margin-top: 0;
}

.programm.subpage .embed-container, .type-festival .embed-container {
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100%;
  position: relative;
}
.programm.subpage .embed-container iframe,
.programm.subpage .embed-container object,
.programm.subpage .embed-container embed, .type-festival .embed-container iframe,
.type-festival .embed-container object,
.type-festival .embed-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.danke.landing section.text h3 {
  margin-top: 3em;
  margin-bottom: 0em;
}

.saisonstart h2, .saisonstart21 h2, .saisonstart22 h2, .reservation h2 {
  font-family: "Messina Sans", Helvetica, sans-serif;
}
.saisonstart label.form-radio-label, .saisonstart21 label.form-radio-label, .saisonstart22 label.form-radio-label, .reservation label.form-radio-label {
  margin-top: 0.33em;
}
.saisonstart label[for=apero], .saisonstart21 label[for=apero], .saisonstart22 label[for=apero], .reservation label[for=apero] {
  padding-bottom: 1em;
}
.saisonstart .form-group, .saisonstart21 .form-group, .saisonstart22 .form-group, .reservation .form-group {
  margin-top: 2em;
  margin-bottom: 2em;
}
.saisonstart .form-group label, .saisonstart21 .form-group label, .saisonstart22 .form-group label, .reservation .form-group label {
  margin-top: 0.33em;
}
.saisonstart .div-mA, .saisonstart21 .div-mA, .saisonstart22 .div-mA, .reservation .div-mA {
  margin-bottom: 0.5em;
}
.saisonstart .div-mA + article, .saisonstart21 .div-mA + article, .saisonstart22 .div-mA + article, .reservation .div-mA + article {
  margin-bottom: 3em;
  padding-left: 1.33em;
}
.saisonstart .div-mA + article input, .saisonstart21 .div-mA + article input, .saisonstart22 .div-mA + article input, .reservation .div-mA + article input {
  width: 2em;
}
.saisonstart .div-mA + article label, .saisonstart21 .div-mA + article label, .saisonstart22 .div-mA + article label, .reservation .div-mA + article label {
  margin-top: 0em;
}
.saisonstart .group-reservationen .form-check-label, .saisonstart21 .group-reservationen .form-check-label, .saisonstart22 .group-reservationen .form-check-label, .reservation .group-reservationen .form-check-label {
  margin-top: 0.2em;
}

.sbozs.landing main {
  padding: 10vw 0;
}
.sbozs.landing section.text {
  padding-bottom: 4rem !important;
}
.sbozs.landing .intro {
  background-color: white;
}
.sbozs.landing .blog-anriss {
  padding: 3rem 0 0 0 !important;
  border-top: 1px solid var(--farbe1) !important;
  margin-left: 4%;
  width: 42% !important;
  justify-content: flex-start !important;
  margin-bottom: 2em;
}
.sbozs.landing .blog-anriss date.beitrag {
  margin: 0 0 1em 0;
  color: black;
}
.sbozs.landing .blog-anriss h3 {
  line-height: 1.13;
}
.sbozs.landing .blog-anriss p, .sbozs.landing .blog-anriss date {
  font-size: 1.8rem !important;
}
.sbozs.landing .blog-anriss p {
  text-align: left;
}
@media screen and (max-width: 640px) {
  .sbozs.landing .blog-anriss {
    width: 88% !important;
  }
}

.thc-button {
  padding: 0.25em 1em;
  color: white;
  font-weight: bold;
  border: 1px solid var(--farbe1);
  background-color: var(--farbe1);
  border-radius: 0 !important;
  white-space: nowrap;
}
.thc-button:hover {
  color: white;
  border: 1px solid black;
  background-color: black;
}
.thc-button:active {
  color: var(--farbe1);
  border: 1px solid var(--farbe1);
  background-color: white;
}

.formular h2, .formular-danke h2, .mailing h2, .freunde-beitrittsformular h2, .saisonstart h2, .saisonstart21 h2, .saisonstart22 h2, .reservation h2, .abo-empfehlung h2 {
  font-size: 3.2rem;
  font-family: "Messina Sans", Helvetica, sans-serif;
}
.formular p, .formular-danke p, .mailing p, .freunde-beitrittsformular p, .saisonstart p, .saisonstart21 p, .saisonstart22 p, .reservation p, .abo-empfehlung p {
  margin: 1.5em 0;
  padding: 0 !important;
}
.formular label, .formular-danke label, .mailing label, .freunde-beitrittsformular label, .saisonstart label, .saisonstart21 label, .saisonstart22 label, .reservation label, .abo-empfehlung label {
  display: block;
  margin-top: 1.5em;
}
.formular label, .formular input, .formular-danke label, .formular-danke input, .mailing label, .mailing input, .freunde-beitrittsformular label, .freunde-beitrittsformular input, .saisonstart label, .saisonstart input, .saisonstart21 label, .saisonstart21 input, .saisonstart22 label, .saisonstart22 input, .reservation label, .reservation input, .abo-empfehlung label, .abo-empfehlung input {
  font-family: "Messina Sans", Helvetica, sans-serif;
  font-size: 2.4rem;
}
.formular input[type=checkbox], .formular-danke input[type=checkbox], .mailing input[type=checkbox], .freunde-beitrittsformular input[type=checkbox], .saisonstart input[type=checkbox], .saisonstart21 input[type=checkbox], .saisonstart22 input[type=checkbox], .reservation input[type=checkbox], .abo-empfehlung input[type=checkbox] {
  font-size: 2em;
  margin-right: 0.25em;
}
.formular input, .formular-danke input, .mailing input, .freunde-beitrittsformular input, .saisonstart input, .saisonstart21 input, .saisonstart22 input, .reservation input, .abo-empfehlung input {
  font-weight: bold;
}
.formular input[type=text], .formular input[type=email], .formular textarea, .formular-danke input[type=text], .formular-danke input[type=email], .formular-danke textarea, .mailing input[type=text], .mailing input[type=email], .mailing textarea, .freunde-beitrittsformular input[type=text], .freunde-beitrittsformular input[type=email], .freunde-beitrittsformular textarea, .saisonstart input[type=text], .saisonstart input[type=email], .saisonstart textarea, .saisonstart21 input[type=text], .saisonstart21 input[type=email], .saisonstart21 textarea, .saisonstart22 input[type=text], .saisonstart22 input[type=email], .saisonstart22 textarea, .reservation input[type=text], .reservation input[type=email], .reservation textarea, .abo-empfehlung input[type=text], .abo-empfehlung input[type=email], .abo-empfehlung textarea {
  border: 1px solid var(--farbe1);
  border-radius: 0 !important;
  padding: 0.25em;
  margin-top: 0.2em;
  width: 50vw;
  min-width: 300px;
}
.formular input[type=submit], .formular button, .formular-danke input[type=submit], .formular-danke button, .mailing input[type=submit], .mailing button, .freunde-beitrittsformular input[type=submit], .freunde-beitrittsformular button, .saisonstart input[type=submit], .saisonstart button, .saisonstart21 input[type=submit], .saisonstart21 button, .saisonstart22 input[type=submit], .saisonstart22 button, .reservation input[type=submit], .reservation button, .abo-empfehlung input[type=submit], .abo-empfehlung button {
  padding: 0.25em 1.2em;
  color: white;
  border: 1px solid var(--farbe1);
  background-color: var(--farbe1);
  border-radius: 0 !important;
}
.formular input[type=submit]:hover, .formular button:hover, .formular-danke input[type=submit]:hover, .formular-danke button:hover, .mailing input[type=submit]:hover, .mailing button:hover, .freunde-beitrittsformular input[type=submit]:hover, .freunde-beitrittsformular button:hover, .saisonstart input[type=submit]:hover, .saisonstart button:hover, .saisonstart21 input[type=submit]:hover, .saisonstart21 button:hover, .saisonstart22 input[type=submit]:hover, .saisonstart22 button:hover, .reservation input[type=submit]:hover, .reservation button:hover, .abo-empfehlung input[type=submit]:hover, .abo-empfehlung button:hover {
  color: white;
  border: 1px solid black;
  background-color: black;
}
.formular input[type=submit]:active, .formular button:active, .formular-danke input[type=submit]:active, .formular-danke button:active, .mailing input[type=submit]:active, .mailing button:active, .freunde-beitrittsformular input[type=submit]:active, .freunde-beitrittsformular button:active, .saisonstart input[type=submit]:active, .saisonstart button:active, .saisonstart21 input[type=submit]:active, .saisonstart21 button:active, .saisonstart22 input[type=submit]:active, .saisonstart22 button:active, .reservation input[type=submit]:active, .reservation button:active, .abo-empfehlung input[type=submit]:active, .abo-empfehlung button:active {
  color: var(--farbe1);
  border: 1px solid var(--farbe1);
  background-color: white;
}
.formular label[for=auswahl], .formular-danke label[for=auswahl], .mailing label[for=auswahl], .freunde-beitrittsformular label[for=auswahl], .saisonstart label[for=auswahl], .saisonstart21 label[for=auswahl], .saisonstart22 label[for=auswahl], .reservation label[for=auswahl], .abo-empfehlung label[for=auswahl] {
  display: none;
}
.formular label[for=auswahl-kalender], .formular-danke label[for=auswahl-kalender], .mailing label[for=auswahl-kalender], .freunde-beitrittsformular label[for=auswahl-kalender], .saisonstart label[for=auswahl-kalender], .saisonstart21 label[for=auswahl-kalender], .saisonstart22 label[for=auswahl-kalender], .reservation label[for=auswahl-kalender], .abo-empfehlung label[for=auswahl-kalender] {
  margin-top: 0.5em;
}
.formular .errors, .formular-danke .errors, .mailing .errors, .freunde-beitrittsformular .errors, .saisonstart .errors, .saisonstart21 .errors, .saisonstart22 .errors, .reservation .errors, .abo-empfehlung .errors {
  margin-top: 0;
  margin-left: 0;
}
.formular .errors li, .formular-danke .errors li, .mailing .errors li, .freunde-beitrittsformular .errors li, .saisonstart .errors li, .saisonstart21 .errors li, .saisonstart22 .errors li, .reservation .errors li, .abo-empfehlung .errors li {
  color: var(--farbe1);
  font-style: italic;
  padding-left: none;
}
.formular .errors li:before, .formular-danke .errors li:before, .mailing .errors li:before, .freunde-beitrittsformular .errors li:before, .saisonstart .errors li:before, .saisonstart21 .errors li:before, .saisonstart22 .errors li:before, .reservation .errors li:before, .abo-empfehlung .errors li:before {
  content: "→ ";
  font-style: normal;
}
.formular article + input[type=submit], .formular-danke article + input[type=submit], .mailing article + input[type=submit], .freunde-beitrittsformular article + input[type=submit], .saisonstart article + input[type=submit], .saisonstart21 article + input[type=submit], .saisonstart22 article + input[type=submit], .reservation article + input[type=submit], .abo-empfehlung article + input[type=submit] {
  margin-top: 1.5em;
}

.saisonstart label[for=auswahl], .saisonstart21 label[for=auswahl], .saisonstart22 label[for=auswahl], .reservation label[for=auswahl] {
  display: block;
}

.type-info form article {
  margin-bottom: 0;
}
.type-info .form-check + .form-check label {
  margin-top: 0 !important;
}

.freunde-theater-chur form button, .freunde-beitrittsformular form button, .digidays-2 form button {
  padding: 0.33em 1em;
  font-family: "Messina Sans", Helvetica, sans-serif;
  font-weight: bold;
  margin-bottom: 1em;
}
.freunde-theater-chur input[type=submit], .freunde-theater-chur button, .freunde-beitrittsformular input[type=submit], .freunde-beitrittsformular button, .digidays-2 input[type=submit], .digidays-2 button {
  padding: 0.25em 1.2em;
  color: white;
  border: 1px solid var(--farbe1);
  background-color: var(--farbe1);
}
.freunde-theater-chur input[type=submit]:hover, .freunde-theater-chur button:hover, .freunde-beitrittsformular input[type=submit]:hover, .freunde-beitrittsformular button:hover, .digidays-2 input[type=submit]:hover, .digidays-2 button:hover {
  color: white;
  border: 1px solid black;
  background-color: black;
}
.freunde-theater-chur input[type=submit]:active, .freunde-theater-chur button:active, .freunde-beitrittsformular input[type=submit]:active, .freunde-beitrittsformular button:active, .digidays-2 input[type=submit]:active, .digidays-2 button:active {
  color: var(--farbe1);
  border: 1px solid var(--farbe1);
  background-color: white;
}

.freunde-beitrittsformular .form-check strong {
  margin: 0 0.2em;
}

.digidays-2 button svg circle {
  fill: white;
}
.digidays-2 button svg path {
  fill: var(--farbe1);
}
.digidays-2 button:hover svg path {
  fill: black;
}
.digidays-2 .nach-datum {
  margin-top: -4em !important;
}

@media screen and (min-width: 1300px) {
  .digidays-2 .nach-datum {
    position: relative;
    top: 15vw !important;
  }
}
#introvideo {
  height: 0 !important;
  overflow: hidden;
  max-height: 0vw;
  opacity: 0;
  transition: all 0.4s ease;
}

#introvideo.zeigen {
  height: auto !important;
  overflow: visible;
  margin: 1.5em 0;
  opacity: 1;
  max-height: 80vh;
}

@media screen and (min-width: 800px) {
  nav#menu {
    position: absolute;
    width: 75vw;
    right: 0;
    top: 0;
    padding: 3rem 8rem 2rem 4rem;
    z-index: 1000;
  }
  nav#menu .menu-button {
    display: none;
  }
  nav#menu > ul {
    display: inline;
    width: 100%;
  }
  nav#menu > ul > li {
    list-style: none;
    float: left;
  }
  nav#menu > ul > li {
    margin-right: 1.85em;
  }
  nav#menu a {
    border-bottom: none !important;
    font-weight: bold;
  }
  nav#menu a:hover {
    color: var(--farbe1) !important;
  }
  nav#menu > ul li {
    position: relative;
  }
  nav#menu ul ul {
    max-height: 0;
    overflow-y: hidden;
    position: absolute;
    top: 1.33em;
    left: 0.3rem;
    display: block;
    padding: 0.5em 0.75em 0em 0;
    transition: all 0.4s ease-in-out;
    opacity: 0;
    border-left: 1px solid var(--farbe1);
  }
  nav#menu ul ul li {
    display: block;
  }
  nav#menu ul li:hover ul {
    display: block;
    max-height: 50rem;
    opacity: 1;
  }
  nav#menu ul ul a {
    display: block;
    padding: 0.05em 0;
    white-space: nowrap;
    margin-left: 0.66em;
  }
  nav#menu ul ul li:last-child a {
    padding-bottom: 0.5em;
  }

  .landing .lightsforpeace22, .subpage .lightsforpeace22 {
    display: none;
  }

  nav.nebel {
    position: fixed;
    top: 0;
    width: calc(75vw - 16px);
    min-height: 0;
    padding: 2rem;
    padding-left: 8rem;
    padding-top: 1rem;
    font-weight: bold;
    border-bottom: none;
    transition: all 0.4s ease-out;
    transition: background 0.4s ease-out;
  }
  nav.nebel:hover, body.neblig nav.nebel {
    color: black !important;
    transition: all 0.4s ease-out;
  }
  nav.nebel ul {
    padding: 0;
  }
  nav.nebel ul li {
    list-style: none;
    display: inline-block;
  }
  nav.nebel:hover {
    background-color: white !important;
    transition: background 0.4s ease-out;
  }
  nav.nebel > ul > li + li {
    position: relative;
    /*left: -4em;*/
  }
  nav.nebel ul ul {
    visibility: hidden;
    position: static;
    background-color: white;
  }
  nav.nebel ul li:hover ul {
    visibility: visible;
  }
  nav.nebel ul a {
    border-color: transparent;
    text-shadow: 1px 1px 24px 3px white;
  }
  nav.nebel ul a:hover {
    border-color: var(--farbe1);
    color: var(--farbe1);
  }

  .home nav#menu a, .home nav#menu li {
    color: white !important;
  }
  .home nav#menu:hover a, .home nav#menu:hover li {
    color: black !important;
  }
  .home nav#menu a:hover {
    color: var(--farbe1) !important;
  }
  .home nav#menu.nebel, .home nav#menu.nebel:hover {
    background-color: black !important;
  }
  .home nav#menu.nebel li, .home nav#menu.nebel a, .home nav#menu.nebel:hover li, .home nav#menu.nebel:hover a {
    color: white !important;
  }
  .home nav#menu.nebel > ul > li > a:hover, .home nav#menu.nebel:hover > ul > li > a:hover {
    color: var(--farbe1) !important;
  }
  .home nav#menu.nebel ul, .home nav#menu.nebel:hover ul {
    background-color: black;
    color: white;
  }
  .home nav#menu.nebel ul ul a:hover, .home nav#menu.nebel:hover ul ul a:hover {
    color: var(--farbe1) !important;
  }
}
nav#menu .lightsforpeace22 {
  position: absolute;
  top: 1em;
  right: 1.5em;
  width: 2em;
}

@media screen and (max-width: 800px) {
  nav#menu {
    width: 100vw;
    display: none;
  }
  nav#menu ul, nav#menu li, nav#menu a {
    display: block !important;
    width: 100%;
    margin: 0;
  }

  .show-menu nav#menu {
    display: block;
  }

  nav#menu .lightsforpeace22 {
    width: 2em;
    -webkit-filter: invert(1);
            filter: invert(1);
    border: none;
    top: 10rem;
  }
}
.galerie figure {
  margin: 0;
}
.galerie img {
  height: 30vw;
  width: auto;
  margin-right: 1.6rem;
}
.galerie .legende {
  padding: 2rem;
  max-width: 44em;
}
.galerie.einzelbild {
  max-width: 75vw;
  overflow-x: hidden;
}

/* PRÄSENTATION */
main a {
  text-decoration: none;
  border-bottom: 1px solid var(--farbe1);
  color: inherit;
}

aside {
  position: relative;
}
aside a {
  color: black !important;
  display: block;
}
aside a:hover {
  color: var(--farbe1) !important;
}
aside a:active {
  color: black !important;
}
aside h4 {
  color: var(--farbe1);
  font-size: 2.6rem;
  margin: 0 !important;
  padding: 0 !important;
}
aside h4 {
  position: -webkit-sticky;
  position: sticky;
  top: 0px;
  z-index: 10;
  margin-bottom: 0.75em;
  padding-bottom: 0.25em;
}
aside h4 {
  transform: rotate(0);
  transform-origin: top left;
  border-top: 1px solid var(--farbe1);
}
aside h4 > span {
  transform: rotate(270deg);
  transform-origin: top right;
  display: inline-block;
  text-align: right;
  position: relative;
  top: -0.2rem;
  left: -24.2vw;
  width: 100%;
  background-color: white;
}
aside h4 > span span {
  background-color: var(--farbe1);
  color: white;
  padding: 0 0.6rem;
}
aside .alle-einblenden {
  display: none;
}
aside ol {
  margin-bottom: 3em;
  margin-top: 0;
}
aside ol {
  list-style: none;
  margin-left: 3.2rem;
  padding-left: 0;
  margin-left: 4rem;
}
aside ol li {
  margin-bottom: 1.5em;
  margin-right: 1em;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
aside ol time {
  min-width: 2em;
  color: var(--farbe1);
}
aside ol time, aside ol strong, aside ol h5 {
  font-weight: bold;
  font-size: 2.2rem;
  margin: 0;
}
aside ol span {
  font-size: 1.7rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
aside ol time {
  position: relative;
  line-height: 1.2;
}
aside ol time small {
  font-weight: normal;
}
aside ol h5 {
  font-family: "Beirut Text", Georgia, serif !important;
  font-style: italic;
  font-weight: bold;
  text-transform: uppercase;
}
aside ol:last-of-type {
  margin-bottom: 16rem;
}
aside a {
  text-decoration: none;
  color: var(--farbe1);
}

li.inaktiv, i.inaktiv {
  background-color: #fe9;
}

aside .vergangen {
  opacity: 0.66;
  display: none;
}
aside.mit-vergangenheit .vergangen {
  display: block;
}
aside h4.vergangen {
  opacity: 1;
}
aside .alle-einblenden {
  float: right;
  padding: 0 1em;
  color: var(--farbe1) !important;
}
aside .vergangen {
  transform: scaleY(0);
  opacity: 0;
}
aside.mit-vergangenheit .vergangen {
  transform: scaleY(1);
  transition: 0.4s opacity ease;
}
aside.mit-vergangenheit h4.vergangen {
  color: #999;
}
aside.mit-vergangenheit ol.vergangen {
  opacity: 0.66;
}
aside.mit-vergangenheit .alle-einblenden {
  visibility: hidden;
  overflow: hidden;
  padding: 0;
}
aside.mit-vergangenheit .alle-einblenden:before {
  content: "ab heute ";
  visibility: visible;
  font-size: 1.7rem;
  white-space: nowrap;
}

svg.vermietung {
  width: 0.33em;
  height: 0.33em;
  position: relative;
  top: -0.25em;
}
svg.vermietung circle {
  fill: var(--farbe1);
}

@media screen and (max-width: 1280px) {
  html {
    font-size: 54%;
  }
}
.raster {
  flex: 1;
  display: flex;
  flex-direction: column;
}
.programm.subpage .raster, .type-festival .raster {
  flex-direction: row;
}

footer {
  padding-left: 8rem;
}

.nebenspalte {
  flex: 0 0 25vw;
  height: auto;
  padding-top: 4rem;
}

.hauptspalte {
  flex: 1;
}

@media screen and (max-width: 800px) {
  html {
    font-size: 50%;
  }

  section {
    max-width: 100vw;
    overflow-x: hidden;
  }

  nav, .container > aside, .container > header {
    display: none;
  }

  section:last-of-type {
    padding-bottom: 12rem !important;
  }

  main section {
    padding-left: 4rem;
  }

  main section.text p, main section.text h2, main section.text h3, main section.text ul, main section.text table, main section.text .lb-inline, main section.text form, main section.text .lead {
    padding-left: 4rem;
  }

  blockquote {
    margin-right: 0;
  }

  blockquote p {
    padding-left: 0 !important;
  }

  main {
    display: block;
    width: 100vw !important;
    border-left: none !important;
  }
  main h2 {
    font-size: 6rem;
  }
  main h2.willkommen {
    font-size: 7vmax !important;
  }
  main section.galerie {
    padding-left: 0;
    padding-right: 0;
  }
  main section.galerie img {
    height: 40vw;
    width: auto;
  }

  .raster {
    margin-left: 4rem;
  }
  .raster div > * {
    padding-left: 0 !important;
  }

  footer {
    padding: 4rem !important;
    padding-bottom: 8rem !important;
  }
  footer span {
    display: inline-block;
    width: 100%;
    text-align: right;
    margin-top: 0.66em;
  }

  nav {
    display: block;
  }

  nav ul {
    display: none;
  }

  nav .menu-button {
    display: inline-block;
    position: fixed;
    top: 2rem;
    right: 3.6rem;
  }
  nav .menu-button svg {
    width: 3.6rem;
    height: 3rem;
  }
  nav .menu-button svg .open {
    stroke: rgba(0, 0, 0, 0.9);
  }

  #kalender img {
    width: 66vw !important;
    height: 26.18vw !important;
  }

  #kalender:target {
    display: block;
    width: 66vw;
    left: 17vw;
  }
  #kalender:target + aside {
    margin-top: 40vw !important;
    padding-top: 1em !important;
    display: block;
    width: 100vw;
    background-color: white;
    margin-top: 10rem;
    padding-top: 10rem;
  }
  #kalender:target ~ main {
    display: none;
  }

  aside h4 > span {
    left: -100vw;
  }
  aside ol li {
    margin-left: 3.2rem;
  }

  .programm.landing h2, .programm.landing .zeile, .archiv h2, .archiv .zeile, .schule.landing h2, .schule.landing .zeile {
    padding-left: 1.6rem !important;
  }

  .home main {
    display: none;
  }
  .home aside {
    margin-top: 56vw !important;
    padding-top: 0 !important;
    display: block;
    width: 100vw;
    background-color: white;
    margin-top: 10rem;
    padding-top: 10rem;
  }
  .home header {
    display: block;
    width: 66vw;
    left: 17vw;
  }

  #kurzwahl {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    z-index: 10000;
  }
  #kurzwahl a {
    width: 100%;
    background-color: #f8f8f8;
    text-align: center;
    padding: 0.66em;
  }
  #kurzwahl h4 {
    background-color: transparent;
    box-shadow: none !important;
    margin: 0;
  }
  #kurzwahl a.covid {
    background-color: black;
    color: white !important;
    border-top: 4px solid black;
  }
  #kurzwahl a.uniform {
    border-top: 3px solid var(--farbe1);
    color: black;
  }
  #kurzwahl a.uniform + a.uniform {
    border-left: 1px solid var(--farbe1);
  }
  #kurzwahl a.stt22 {
    background-color: #1e1d82;
    color: #fde307 !important;
    border-top: 4px solid #1e1d82;
  }
  #kurzwahl a.stt22 h4 {
    line-height: 1.15;
    font-size: 2rem;
    color: #fde307;
    margin-left: 0;
  }
  #kurzwahl a.sbozs {
    font-family: "Beirut Display", Georgia, serif;
    font-style: italic;
    border-top: 4px solid var(--farbe1);
    font-weight: 400 !important;
  }
  #kurzwahl a.sbozs h4  {
    font-weight: 400 !important;
  }
  #kurzwahl h4 {
    color: inherit;
    margin-bottom: 0;
    padding-bottom: 0;
  }

  aside ol:last-of-type {
    margin-bottom: 12rem;
  }

  .produktionen, .programm.subpage, .type-festival {
    /*	main, .oscontent { 
    		section { flex: 1 0 100%; }
    		.heading { order: 1; }
    		.galerie { order: 2; }
    	//	.text { order: 3; }
    		.spieldaten { order: 2; float: none; width: 100vw !important; padding-right: 4rem; }
    	}	*/
  }
  .produktionen main, .programm.subpage main, .type-festival main {
    flex-direction: column;
  }
  .produktionen section:last-of-type, .programm.subpage section:last-of-type, .type-festival section:last-of-type {
    padding-bottom: 0 !important;
  }
}
x.wrap {
  display: flex;
  min-height: 100vh;
  flex-direction: column;
  max-width: 1200px;
  margin: auto;
}

@media screen and (max-width: 1080px) {
  .raster {
    flex-direction: column;
  }

  .hauptspalte {
    order: 1;
  }

  .nebenspalte {
    order: 2;
    flex: 0;
    padding-left: 8rem;
    width: 100% !important;
  }
}
@media screen and (max-width: 800px) {
  main .raster {
    max-width: none;
    overflow-x: hidden;
    margin: 0 auto;
  }
  .programm.subpage main .raster, .type-festival main .raster {
    max-width: 90vw;
  }
  main .raster h1, main .raster h2 {
    font-size: 5.4rem;
  }

  .raster {
    display: block;
  }

  .raster .hauptspalte.text {
    max-width: 100%;
    padding-right: 0;
  }

  .raster .nebenspalte {
    padding-left: 0;
    width: 100% !important;
  }
}
.infopanel {
  background-color: #00003c;
  color: white;
  overflow-y: hidden !important;
  max-height: 100vh;
}
.infopanel header {
  -webkit-filter: invert(1);
          filter: invert(1);
  left: 5vw;
}
.infopanel aside {
  margin-top: 20vw;
  min-width: 100vw;
  -moz-column-count: auto;
       column-count: auto;
  -moz-column-width: 100vw;
       column-width: 100vw;
  overflow-y: hidden !important;
  overflow-x: scroll;
}
.infopanel article {
  width: auto;
  max-width: auto;
}
.infopanel article a {
  color: white !important;
  pointer-events: none;
}
.infopanel article br {
  display: inline-block;
}
.infopanel article span, .infopanel article span + br {
  display: none;
}
.infopanel li {
  page-break-inside: avoid;
  margin-bottom: 0.5em;
  align-items: flex-start !important;
}
.infopanel li.verschoben, .infopanel li.abgesagt {
  opacity: 0.66;
}

@media screen and (device-width: 1080px) and (orientation: portrait) {
  .infopanel {
    background-color: black !important;
  }

  html {
    font-size: 1.8vw;
  }
}
@media screen and (min-width: 800px) {
  .mobile-only {
    display: none !important;
  }

  .pfannkuchen {
    display: block;
    z-index: 1000;
    position: fixed;
    top: 3rem;
    right: 3.6rem;
    transform: translateX(10rem);
    transition-delay: 0;
    transition: all 0.2s ease-out;
    width: 3.6rem;
    height: 3rem;
  }
  .pfannkuchen g.open {
    stroke: black;
  }

  .show-button .pfannkuchen {
    transform: translateX(0);
    transition: all 0.4s ease-in;
    transition-delay: 0.2s;
  }

  .show-button nav#menu {
    opacity: 0;
    position: fixed;
    transform: translateY(-50px);
    background-color: rgba(255, 255, 255, 0.8);
    transition: 0.4s transform ease;
  }

  .show-menu nav#menu {
    opacity: 1;
    transform: none;
    transition: 0.4s transform ease;
    -webkit-backdrop-filter: blur(2px);
            backdrop-filter: blur(2px);
  }

  .show-menu .pfannkuchen g.open {
    stroke: transparent;
  }
  .show-menu .pfannkuchen g.close {
    stroke: var(--farbe1);
  }
}
@media screen and (max-width: 800px) {
  .menu-button {
    display: none;
  }

  .pfannkuchen {
    display: block;
    z-index: 1000;
    position: fixed;
    top: 3rem;
    right: 3.6rem;
    width: 3.6rem;
    height: 3rem;
  }
  .pfannkuchen g.open {
    stroke: black;
    stroke: var(--farbe1);
  }

  .show-menu .pfannkuchen g.open {
    stroke: transparent;
  }
  .show-menu .pfannkuchen g.close {
    stroke: var(--farbe1);
  }

  .home.show-menu main {
    display: flex;
  }
  .home.show-menu nav#menu a {
    color: black;
  }

  .show-menu nav#menu {
    display: block;
    height: 100vh;
    width: 100vw;
    position: fixed;
    top: 0;
    left: 0;
    background-color: white;
    z-index: 900;
    overflow: scroll;
  }
  .show-menu nav#menu > ul {
    background-image: url("../img/TheaterChur-Logo_de.svg");
    background-size: 126px 50px;
    background-position: 50% 20px;
    background-repeat: no-repeat;
    padding-bottom: 22rem;
  }
  .show-menu nav#menu > ul > li > a {
    font-weight: bold;
  }
  .show-menu nav#menu ul {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding-top: 10rem;
    padding-left: 0;
  }
  .show-menu nav#menu ul li {
    font-size: 2.1rem;
    text-align: left;
    padding-left: 1.5em;
    line-height: 1.4;
  }
  .show-menu nav#menu ul li, .show-menu nav#menu ul li + li {
    margin: 0.5em 0 0 0;
  }
  .show-menu nav#menu ul a {
    border-color: transparent;
  }
  .show-menu nav#menu ul ul {
    padding-top: 0;
  }
  .show-menu nav#menu ul ul li {
    margin-top: 0;
  }
  .show-menu nav#menu li a {
    font-weight: bold;
  }
  .show-menu nav#menu .lightsforpeace22 {
    display: none !important;
  }

  .raster {
    margin-left: 0;
    margin-right: 0;
  }

  .programm.landing main, .programm.landing .kategorie, .programm.landing .zeile, .archiv main, .archiv .kategorie, .archiv .zeile, .schule.landing main, .schule.landing .kategorie, .schule.landing .zeile {
    width: 100vw !important;
    max-width: 100vw !important;
  }

  .home #intro {
    display: none;
  }
}
/* SCROLLING */
html, body {
  overflow: hidden;
}

.container {
  display: flex;
  flex: 1;
  justify-content: flex-start;
  overflow: scroll;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
}

aside, main {
  padding-bottom: 12rem;
}

.raster .hauptspalte aside {
  padding-bottom: 4rem;
  padding-top: 4rem;
}

aside {
  width: 25vw;
  height: auto;
  top: 0;
  bottom: 0;
  margin-top: 14vw;
  overflow-x: hidden;
  overflow-y: scroll;
}

main {
  width: 75vw;
  height: 100vh;
  padding-top: 10vw;
  border-left: 1px solid var(--farbe2);
}

img {
  width: 100%;
  height: auto;
}

header {
  position: fixed;
  top: 0;
  left: 2vw;
  width: 20vw;
  padding: 4rem 0;
  background-color: white;
}

header img {
  width: 20vw;
  height: 7.9333vw;
}

/* horizontal layout with CSS grid, netflix style https://uxdesign.cc/creating-horizontal-scrolling-containers-the-right-way-css-grid-c256f64fc585 */
.programm.landing main, .archiv main, .schule.landing main {
  width: 75vw;
  max-width: 75vw;
  padding-top: 10vw;
}
.programm.landing main article, .archiv main article, .schule.landing main article {
  width: 200px;
  min-height: 300px;
}
.programm.landing main h2, .archiv main h2, .schule.landing main h2 {
  font-family: "Messina Sans", Helvetica, sans-serif;
  font-size: 3.2rem;
  color: var(--farbe1);
  border-bottom: 1px solid var(--farbe2);
  margin: 0;
  padding: 0 8rem 0.8rem 4rem;
  position: relative;
  top: 0;
  padding-bottom: 2.4rem;
}
.programm.landing main h2:first-child, .archiv main h2:first-child, .schule.landing main h2:first-child {
  padding-top: 0;
}
.programm.landing main h2.titel-archiv, .archiv main h2.titel-archiv, .schule.landing main h2.titel-archiv {
  border: none;
  padding-bottom: 2em;
  color: black;
}
.programm.landing section, .archiv section, .schule.landing section {
  width: 75vw !important;
  max-width: none;
  overflow-x: scroll;
  padding: 0;
}
.programm.landing .zeile, .programm.landing .kategorie, .archiv .zeile, .archiv .kategorie, .schule.landing .zeile, .schule.landing .kategorie {
  max-width: 100%;
}
.programm.landing .zeile, .archiv .zeile, .schule.landing .zeile {
  padding: 1.6rem 8rem 4rem 4rem;
  margin-right: 8rem;
  display: grid;
  grid-gap: 1vw;
  grid-template-columns: repeat(999, 1fr);
  grid-template-rows: 1;
}
.programm.landing .zeile img, .archiv .zeile img, .schule.landing .zeile img {
  margin: 0;
  padding: 0;
  vertical-align: top;
  width: 100%;
  height: auto;
  background-color: var(--farbe1);
  background-blend-mode: multiply;
  background-size: contain;
}
.programm.landing .zeile h3, .archiv .zeile h3, .schule.landing .zeile h3 {
  font-family: "Messina Sans", Helvetica, sans-serif;
  font-size: 1.8rem;
  margin: 0.66em 0 0 0;
  line-height: 1.2;
}
.programm.landing .zeile p, .archiv .zeile p, .schule.landing .zeile p {
  font-family: "Messina Sans", Helvetica, sans-serif;
  font-size: 1.8rem;
  margin-top: 0;
  line-height: 1.2;
}
.programm.landing .tickets-und-mehr, .archiv .tickets-und-mehr, .schule.landing .tickets-und-mehr {
  color: var(--farbe1);
  font-weight: bold;
  font-size: 1.8rem;
}
.programm.landing .rueckblick, .archiv .rueckblick, .schule.landing .rueckblick {
  width: 260px !important;
  padding-right: 60px;
  transition: 0.3s all ease;
}
.programm.landing .rueckblick.zeigen, .archiv .rueckblick.zeigen, .schule.landing .rueckblick.zeigen {
  width: 180px !important;
  padding-right: 0;
}
.programm.landing .vergangenheit, .archiv .vergangenheit, .schule.landing .vergangenheit {
  transform: scaleX(0);
  opacity: 0;
  transition: 0.6s opacity ease;
}
.programm.landing .zeigen ~ .vergangenheit, .archiv .zeigen ~ .vergangenheit, .schule.landing .zeigen ~ .vergangenheit {
  transform: scaleX(1);
  opacity: 1;
}
.programm.landing .rueckblick h3, .archiv .rueckblick h3, .schule.landing .rueckblick h3 {
  text-align: right;
}

.produktionen .heading.ohne-bilder, .produktionen .spieldaten.ohne-bilder, .programm.subpage .heading.ohne-bilder, .programm.subpage .spieldaten.ohne-bilder, .type-festival .heading.ohne-bilder, .type-festival .spieldaten.ohne-bilder {
  padding-top: 5vw;
}
.produktionen .enupal-stripe-button span, .programm.subpage .enupal-stripe-button span, .type-festival .enupal-stripe-button span {
  font-family: "Messina Sans", Helvetica, sans-serif;
}

.limited-handles > .os-scrollbar-horizontal > .os-scrollbar-track > .os-scrollbar-handle {
  max-width: 30px;
  min-width: 30px;
}

.os-scrollbar-horizontal > .os-scrollbar-track > .os-scrollbar-handle {
  max-width: 200px;
  min-width: 90px;
}

.limited-handles > .os-scrollbar-vertical > .os-scrollbar-track > .os-scrollbar-handle {
  max-height: 60px;
  min-height: 120px;
}

.os-scrollbar-handle {
  background-color: var(--farbe2) !important;
}

.os-scrollbar-vertical {
  width: 1.4rem !important;
  right: 0.2rem !important;
}

.os-scrollbar-horizontal {
  height: 1.3rem !important;
  top: -0.1rem !important;
}

.programm.landing .os-scrollbar-horizontal, .archiv .os-scrollbar-horizontal, .schule.landing .os-scrollbar-horizontal {
  bottom: auto;
  top: 0.3rem;
  z-index: 1000;
}

/* icon color */
.flickity-button-icon {
  fill: var(--farbe1);
}

/* hide disabled button */
.flickity-button:disabled {
  display: none;
}

/* no circle */
.flickity-button {
  background: transparent;
}

.lb-inline div {
  margin-bottom: 0.5em;
}

/* Logo slideshow */
.korrektorat {
  position: fixed;
  right: 2em;
  bottom: 0.4em;
  background-color: #f22f0d;
  padding: 0.2em 0.5em;
  font-family: "Messina", sans-serif;
  font-size: 0.72em;
  font-weight: bold;
  opacity: 0.75;
}

.korrektorat a {
  color: white;
  border: none;
}

.korrektorat a:hover {
  color: black;
}

section.prospect {
  display: flex;
  flex: 1;
  align-items: flex-start;
  border-top: 1px solid var(--farbe1);
  /* .inhaltsverzeichnis a:hover h3 > * { border-bottom: 1px solid var(--farbe1); } */
  /* .inhaltsverzeichnis a:after { content: '\2192'; color: var(--farbe1); display: inline; } */
}
section.prospect * {
  font-family: "Messina Sans", Helvetica, sans-serif;
  font-size: 2.1rem;
  line-height: 1.2;
}
section.prospect .titelseite {
  max-width: 25vw;
  margin-top: 0;
}
section.prospect .titelseite img, section.prospect .titelseite svg {
  max-width: 90%;
  height: auto;
  margin-bottom: 1.8rem;
}
section.prospect .inhaltsverzeichnis {
  width: 50vw;
  padding-bottom: 8rem;
  padding-top: 1.2em;
}
section.prospect .inhaltsverzeichnis a {
  margin-bottom: 1.2rem;
  padding: 0 0 1.2rem 0;
  display: block;
  border: none;
}
section.prospect .inhaltsverzeichnis a:hover {
  color: var(--farbe1);
}
section.prospect .inhaltsverzeichnis a > * {
  margin: 0;
}
section.prospect .heftnr {
  font-weight: bold;
  color: var(--farbe1);
}
section.prospect .inhaltsverzeichnis h3 * {
  font-weight: normal;
  font-family: "Beirut Text", Georgia, serif;
}
section.prospect .inhaltsverzeichnis h3 * {
  font-size: 1.94rem;
}
section.prospect sup {
  color: var(--farbe1);
}

@media screen and (max-width: 800px) {
  section.prospect {
    display: block;
  }

  section.prospect > aside {
    display: flex;
    flex-direction: rows;
    width: 100% !important;
    padding-bottom: 3.6rem;
  }

  section.prospect .titelseite {
    display: flex;
    max-width: 100%;
    align-items: flex-end;
  }
  section.prospect .titelseite img, section.prospect .titelseite svg {
    width: 50%;
    height: auto;
  }
  section.prospect .titelseite p {
    margin-left: 1em;
  }
  section.prospect .inhaltsverzeichnis {
    width: 100%;
  }
}
body.prospect-detail nav#menu {
  display: none;
}
body.prospect-detail .pfannkuchen {
  display: none;
}
body.prospect-detail .os-scrollbar {
  display: none;
}
body.prospect-detail .schliesskreuz {
  color: var(--farbe1) !important;
}

body.prospektiv main, body.prospect main {
  z-index: 1000;
}
body.prospektiv .verborgen, body.prospect .verborgen {
  display: none;
}

.over {
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  width: 100vw;
  padding: 6rem;
  z-index: 2000;
  overflow-y: scroll;
  background-color: rgba(235, 235, 235, 0.5);
}
.over .kopfzeile {
  position: fixed;
  width: inherit;
  padding: 0 3rem 0 3rem;
  top: 0.5rem;
  left: 0;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  color: var(--farbe1);
  font-family: "Messina Sans", Helvetica, sans-serif;
}
.over .kopfzeile h4 {
  margin: 0;
}
.over .kopfzeile a {
  border: none;
  font-size: 1.8em;
  text-decoration: none;
}
.over article {
  min-height: 100vh;
  padding-bottom: 10vh;
  border: 1px solid var(--farbe1);
  background-color: white;
}
.over article header + * {
  padding: 3rem 6rem;
}
.over article header {
  position: static;
  background-size: cover;
  background-position: center center;
  width: 100%;
  height: 66vh;
  margin-bottom: 4.8rem;
}
.over article header.ohne-titelbild {
  height: auto;
  margin: 3rem 0 0 0;
}
.over article .mit-titelbild h2 {
  padding-top: 6vh;
  padding-left: 10%;
  padding-right: 10%;
  font-family: "Beirut Display", Georgia, serif !important;
  font-weight: 900 !important;
  color: white;
  text-align: center;
  text-shadow: 0 0 1em rgba(0, 0, 0, 0.5), 1px 1px 2px rgba(0, 0, 0, 0.1);
}
.over article .ohne-titelbild h2 {
  padding: 0 6rem;
  text-align: left;
  color: black;
  font-family: "Beirut Display", Georgia, serif !important;
  font-weight: normal;
  font-style: italic;
}
.over article .heftrubrik {
  padding-left: 6rem;
  text-transform: uppercase;
  color: var(--farbe1);
  font-family: "Messina Sans", Helvetica, sans-serif;
}
.over article header .spitzmarke {
  margin-left: 6rem;
  color: var(--farbe1);
  font-family: "Messina Sans", Helvetica, sans-serif;
}
.over article h3 {
  font-size: inherit;
  color: var(--farbe1);
}
.over article h3:first-child {
  margin: 0;
}
.over article h3 ~ p + p {
  text-indent: 4.8rem;
}
.over article h3 ~ p {
  margin: 0;
}
.over article p + blockquote {
  margin-left: 4.8rem;
  font-size: 1.33em;
}
.over article.fragen .filet h2 {
  margin: 0.75em 0.5em 1rem 0;
  text-align: center;
  color: var(--farbe1);
  font-weight: 900;
  font-family: "Beirut Display";
  font-size: 9.6rem;
}
.over article.fragen .filet h2 + h3 {
  font-weight: bold;
  font-style: italic;
}
.over article .programmbezug a {
  color: var(--farbe1);
}
.over article.layout-interview .filet h3 ~ p {
  margin: 0.66em;
}
.over article.layout-interview .filet h3 ~ p + p {
  text-indent: 0;
  margin-top: 0.66em;
}
@media screen and (min-width: 1300px) {
  .over article {
    max-width: 80vw;
    margin: 0 auto;
  }
}
.over .flexi {
  display: flex;
}
.over .filet {
  width: 70%;
  padding-right: 3.6rem;
}
.over .beilage {
  width: 30%;
  font-size: 0.72em;
  margin-left: 2.5%;
  padding-right: 0%;
}
.over .beilage .vita, .over .beilage .seitenspalte {
  border-left: 1px solid #666;
  padding-left: 1em;
}
.over .beilage .vita p strong {
  font-weight: normal !important;
  letter-spacing: 0.08em;
  word-spacing: 0.04em;
  text-transform: uppercase;
}
.over .lead strong {
  font-weight: normal;
  font-size: 1.25em;
}
.over .lead, .over .autorschaft {
  margin-bottom: 2.4em;
}
.over .autorschaft {
  font-size: 0.72em;
}
.over .autorschaft span {
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.over .programmbezug {
  margin-bottom: 2em;
  color: var(--farbe1);
  font-family: Messina, sans-serif;
}
.over .programmbezug a {
  font-weight: bold;
}
.over .programmbezug p {
  margin-top: 0.33em;
  font-weight: bold;
}

@media screen and (max-width: 768px) {
  .over {
    padding: 6rem 1.5rem;
  }
  .over header.mit-titelbild {
    min-height: 33vh;
  }
  .over header.mit-titelbild {
    min-height: 33vh;
  }
  .over header .spitzmarke {
    margin-left: 3rem !important;
    margin-right: 3rem !important;
  }
  .over header h2 {
    padding-left: 3rem !important;
    padding-right: 3rem !important;
  }
  .over header h2 {
    -webkit-hyphens: auto;
        -ms-hyphens: auto;
            hyphens: auto;
  }
  .over .flexi {
    flex-direction: column;
    padding: 3rem;
  }
  .over .flexi > * {
    width: 100%;
    padding: 0;
  }
  .over .filet {
    margin-bottom: 6rem;
  }
  .over header h2 {
    font-size: 6.4rem;
  }
  .over .filet {
    font-size: 2.1rem;
    -webkit-hyphens: auto;
        -ms-hyphens: auto;
            hyphens: auto;
  }
  .over .filet .autorschaft {
    font-size: 0.86em;
  }
}