@font-face {
 font-family: 'Caveat';
 font-style: normal;
	font-weight: 400;
 src: url('/fonts/static/Caveat-Regular.ttf');
}
@font-face {
font-family: "Oswald-Medium";
src: url("/fonts/Oswald-Medium.ttf");
}
@font-face {
font-family: "opensans-light";
src: url("/fonts/opensans-light.eot");
src: url("/fonts/opensans-light.eot?#iefix") format("embedded-opentype"),
url("/fonts/opensans-light.woff2") format("woff2"),
url("/fonts/opensans-light.woff") format("woff"),
url("/fonts/opensans-light.ttf") format("truetype"),
url("/fonts/opensans-light.svg#open_sanslight") format("svg");
font-weight: normal;
font-style: normal;
}

html {height: 100%; max-height: 100%; width: 100%; min-width: 100%; margin: 0; padding: 0; scroll-behavior: smooth;}
body {height: 100%; min-height: 60%; max-height: 100%; border: 0; margin: 0; padding: 0; background-color: #140000; color: #111111;; letter-spacing: 0.3pt;}
div.WebFenster {position: absolute; display: block; top: 0px; right: 0px; bottom: 0px; left: 0px; margin: 0; padding: 0;}
div.WebHeader {position: relative; display: block; background-color: #cc0000; margin: 0; padding: 0;}
div.WebSeitenTitel {position: relative; display: flex; margin: 0; padding: 0; background-color: #dd0000; font-family: Caveat, sans-serif;}
div.WebSeitenTitel header {display: block;}
div.WebContent {position: relative; display: flex; background-color: #ffffff; margin: 0; padding: 0 0 0 0;}
div.WebContent article {display: block; padding-bottom: 40px;}
div.WebContent div.bereich1 {width: 100%; background-color: #ffffff; padding-bottom: 40px;}
div.WebContent div.bereich2 {width: 100%; background-color: #fafafa; padding-bottom: 40px;}
div.WebFooter {position: relative; display: flex; margin: 0; padding: 0; background-color: #aaaaaa;}

div.WebFenster {font-family: "opensans-light",Helvetica,sans-serif;}

p {color: #111111;}
h1, h2, h3 	{text-align: left; letter-spacing: -0.03em; font-weight: normal; color: #FF8F02;}
h1					{letter-spacing: 0.15em;}
h2					{color: #bf3922;}
h3					{letter-spacing: 0.1em;}
h4					{color: #bf3922; font-weight: normal; letter-spacing: -0.3pt;}
h2 + p {margin-top: 0px;}
h3 + p {margin-top: 0px;}
h4 + p {margin-top: 0px;}
a {text-decoration: none; color: #ee0000;}
a:hover {color: #00eeee;}
a:visited { color: #cc0000;}
p {line-height: 1.75em;}

/* MENU */

div.WebHeader ul {margin: 0; padding: 0;}
div.WebHeader ul li {float: left; display: inline; list-style: none; margin: 0; padding: 0; text-transform: uppercase; color: #eeeeee;}
div.WebHeader ul li a { color: #eeeeee; text-decoration: none;}

div.bilderliste ul li p {margin: 0; padding: 0;}
div.presseliste ul li p {margin: 0; padding: 0;}

iframe {max-width: 100%;}

/* PRODUKTIONS-PLAKATE (Startseite) - Hochformat, nicht beschneiden.
   Quelle sind die images_small/-Thumbs (300 px breit), darum max-width 300px,
   damit sie nie hochskaliert werden. */
div.plakatliste ul {list-style: none; margin: 0; padding: 0;}
div.plakatliste ul li {display: inline-block; vertical-align: top; width: 31%; max-width: 300px; margin: 0 1.5% 20px 0; padding: 0; text-align: center;}
div.plakatliste ul li a {display: block;}
div.plakatliste ul li img {width: 100%; height: auto; max-height: none; object-fit: fill; border: 1px solid #cc0000;}
div.plakatliste ul li p {margin: 4px 0 0 0; padding: 0; font-size: 15px; line-height: 1.3em;}

/* ZEILE AUS BILD + TEXT (Termin-/Produktionsuebersichten) */
div.medienzeile {display: flex; gap: 18px; align-items: flex-start; margin: 0 0 28px 0;}
div.medienzeile div.bild {flex: 0 0 150px; max-width: 150px;}
div.medienzeile div.bild img {width: 100%; height: auto; border: 1px solid #cc0000;}
div.medienzeile div.text {flex: 1; min-width: 0;}
div.medienzeile div.text p {margin: 0 0 10px 0;}
div.medienzeile div.text h2, div.medienzeile div.text h3 {margin-top: 0;}

/* DATENTABELLEN (Terminlisten) */
table.datentabelle {width: 100%; border-collapse: collapse; margin: 0 0 24px 0;}
table.datentabelle td, table.datentabelle th {padding: 7px 10px; border-bottom: 1px solid #e0e0e0; vertical-align: top; text-align: left; font-size: 16px; line-height: 1.5em;}
table.datentabelle tr:first-child td {font-weight: bold; border-bottom: 2px solid #cc0000;}
table.datentabelle p {margin: 0;}

