@import url("https://use.typekit.net/ptc2yzh.css");
 @import url("https://use.typekit.net/ptc2yzh.css");

*{
	box-sizing: border-box;
	padding: 0;
	margin: 0;
	border: 0;
}

:root {
	--brand-grau: #e5e3e0;
	--brand-rosa: #e76779;
	--brand-text: #282827;
	--brand-weiss:#fafaf7;
	--rotate-minus: -2deg;
	--rotate-plus:  2deg;
	--brand-gradient: linear-gradient(135deg, rgba(163, 201, 227, 1) 0%, rgba(244, 213, 106, 1) 100%);

}
.rotate-minus{ rotate: var(--rotate-minus);}
.rotate-plus{ rotate: var(--rotate-plus);}

.iframe-wrapper {
  width: 100%;            /* passt sich Breite des Containers an */
  max-width: 1200px;      /* optional: maximale Breite */
  margin: 0 auto 22px auto;
  display: block;
  /* Höhe wird über aspect-ratio bestimmt */
}

.iframe-wrapper iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}
.aspect-16-9 { aspect-ratio: 16 / 9; }
.aspect-4-3  { aspect-ratio: 4 / 3; }
.aspect-21-9 { aspect-ratio: 21 / 9; }

video{
	width: 100%;
}

body {
	font-family: 'Open Sans', sans-serif;
	font-family: "june-expt-variable", sans-serif;
	font-variation-settings: "STYL" 42;
	font-weight: 400;
	/* color: #D9D9D6; */
	color: var(--brand-text);
	font-size: .9em;
	line-height: 1.2em;

	}

.wrapper{
	margin: 0px auto 0px auto;
	padding: 0;
	width: 1200px; /* +22 wg black left border */
	z-index: 4;
}

#aktuell .wrapper,
#hv .wrapper{
	padding: 88px 0 0 0;
}

content{

		position: relative;
		float: left;
		width: 100%;
		height: auto;
		min-height: 800px;
		padding-bottom: 88px;
/* 		border-left: 22px solid #000 */
}



section{
			width: 100%;
			float: inherit;
			padding-bottom: 120px;
}

section#infamis, section#wiedergang{background: #fafaf7;}
/* section#musik{background: rgba(79, 183, 135, 0.57);} */
section#film{background: rgba(224, 221, 207, 1);}
section#live{background: rgba(194, 0, 72, 0.8);}
section#hv{background: rgba(224, 221, 207, 1);}
section#aktuell{background: rgba(224, 221, 207, 1);}
section#aktuell{background: rgb(241, 241, 241);}
.hg{
	position: absolute;
	height: 100%;
	width: 100%;
/* 	background:url(../backgroundslider/slides/inf_weih_2015.jpg); */
	background-position: center center;
	background-size: cover;
}


a{
color: #000;
text-decoration: none;
cursor: pointer;

}
p a,
a p{
	text-decoration: underline;
}

.clear {clear:both;}



nav{
	position: relative;
	float: left;
	width: 100%;
	z-index: 3;
	}

nav ul{
	display: flex;
flex-direction: row;
align-content: center;
justify-content: center;
flex-wrap: wrap;
	}	
	
nav ul li{
	display: inline-block;
	list-style: none;
	padding: 0;
	padding: 8px 16px;
	margin: 2px;

	line-height: 1;
	background: var(--brand-grau);
	color: var(--brand-rosa);
	}
	nav ul li:hover{
		background: var(--brand-rosa)
	}	


nav ul li a{
color: var(--brand-rosa);
font-size: 3.2em;
font-weight: 400;
text-decoration: none;
cursor: pointer;

transition: color 0.3s ease;
}
nav ul li a:hover{ color: var(--brand-grau);}






header{
height: calc(100vh - 88px);
width: 100vw;
padding: 44px 40px;
display: flex;
flex-direction: column;
justify-content: space-between
}
iframe{
	width: 100%;
	height: 576px
}


.unsichtbar{ width:0px; height:0px; display:none;}

.impressum_btn{
	z-index: 7;
	position: absolute;
	font-size: 0.7em;
	text-align: right;
	color: #dad6d0;
	text-decoration: none;
	/* height: 76px; width: 70px; */
	height: 12px;
	width: 170px;
	margin: 116px 0 0 -72px;
	-webkit-transform:rotate(270deg);
	-moz-transform:rotate(270deg);
	-ms-transform: rotate(270deg);
	-o-transform: rotate(270deg);
	transform: rotate(270deg);
}

.impressum_btn a{text-decoration: none; color: #dad6d0;}
.impressum_btn a:hover{text-decoration: none; color: #fff;}


.platte{

position: absolute;
bottom: 80px;
right: 320px;
text-align: right;
	display: none;
}

.live{
z-index: 3;
text-align: left;
color: #dad6d0;
/* text-shadow: 0px 0px 6px rgba(0,0,0,0.3); */
font-size: 2.7em;
text-decoration: none;
}

.live2{
color: #ffffff;
}


ul.live-liste{
	display: flex;
	flex-direction: row;
	align-content: center;
	justify-content: center;
	flex-wrap: wrap;
}

.live li, .live2 li{
	display: inline-block;
	background: var(--brand-grau);
	color: var(--brand-rosa);
	list-style: none;
	padding: 0;
	margin: 2px;
letter-spacing: .03em;
	line-height: 1;
}
.live .rt_gr, 
.live2 .rt_gr, 
.rt{
	color: var(--brand-grau);
	background: var(--brand-rosa);
	display: inline-flex;
	padding: 3px 6px;
 } 

.live ul li a, 
.live2 ul li a{
	background: var(--brand-grau); 
	color: var(--brand-rosa);
	display: inline-flex;
	padding: 3px 6px;
}
.live ul li a:hover, .live2 ul li a:hover{ color: var(--brand-text);}

span.live-zusatz{
	font-size: .73rem;
	display: inline-block;
	color: var(--brand-rosa);
	transform: rotate(0deg);
	padding-right: 4px;

	
}

.kl {font-size: .8em}

.durchgestrichen{
	text-decoration: line-through
}
.nichtDurchgestrichen{
	text-decoration: none
}
.zentriert{text-align: center;}


.headline{
	font-size: 3.2em;

	color: #000;
	text-align: center;
	padding: 44px 0;
}








.transparentBox{
	margin: 0px 1px 2px 0px;
}
.bildBox,
.videoBox{
	padding: 32px;
/* 	margin: 0px 1px 2px 0px; */
}

.bildBox img{
	border: 4px solid #fff;
	margin-bottom: -4px


}
.kasten{
	color: #000;
	padding: 32px;
	margin: 0px;
	border: 1px solid #000;
}

.bottomLine{
	border-bottom: 0px solid #000;
}

img.hv-img{
	width: 100%;
	height: auto;
}

p{
	font-family: "finlandica", sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 1.2em;
	line-height: 1.25em;
	margin-bottom: 1.45em;
	hyphens: auto;
}
#film .txtBox{
	font-size: .9em;
	line-height: 1.25em;
	margin-bottom: 1.45em;
/*
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
*/
}

h1{
	font-family: "june-expt-variable", sans-serif;
	font-variation-settings: "STYL" 42;
	font-weight: 400;
	font-size: 1.4em;
	line-height: 1.45em;
	margin-bottom: 0.4em;

}
h2 {
  font-family: "june-expt-variable", sans-serif;
  font-variation-settings: "STYL" 52;
  font-size: 2.4em;
  font-weight: 400;
  display: inline-block;
text-align: left;
  margin-bottom: 0;
  line-height: 1.5;
  margin-bottom: 0.5em;
}

.highlight-headline{
	background: var(--brand-rosa);
	color: var(--brand-grau);
	  padding: 0px 13px;
	  /* Padding pro Zeile klonen */
	  box-decoration-break: clone;
}

.live2 h2{
	color: #fff;
}
h3{
font-family: "june-expt-variable", sans-serif;
font-variation-settings: "STYL" 52;
font-size: 1.7em;
font-weight: 400;
display: ruby-text;
/* background: var(--brand-grau); */
color: var(--brand-text);

margin-bottom: 0;
}
h2.zentriert,
h3.zentriert{
	text-align: center;
}


.klein{font-size: .8em;}

.topAbstand{margin-top: 44px}
.bottomAbstand{margin-bottom: 44px}
.entfaellt,
.entfaellt a,
.entfaellt span{text-decoration: line-through; color: #adadad !important; font-size: 1em}


.section_musik{

	background-image: url(../elemente/infamistapete-transparent.png);
	background-repeat: repeat;
	background-color: rgba(219, 215, 204, 0.1);
}

a.button{
	background: #000;
	color: #fff;
	padding: 4px 8px;
	margin-top: 16px;
	display: table;
	text-decoration: none;
}




/* ---------------------------- < 920 ---------------------------- */


@media only screen and (max-width:920px){
	
	
	body{
		font-size: .7em
	}
	

	p{
		font-size: 1.4em;
		hyphens: auto;
		hyphenate-limit-chars: 10 4 4;
	}
	
	
	header{
		float:left;
		text-align: left;
		top:8px;
		height: 66vh;
	}
	nav {
		position: relative; float: left;
	}
	nav a{
		font-size: 2.4em;
	}
	.wrapper{
		width: 100%;
		display: flex;
		flex-direction: column; 
		padding: 22px;
	}
	
	iframe {
		width: 100%;
		height: 194px;
	}

	

	/* xx.videoBox{
		position: relative;
		padding-bottom: 156.25%; /* Default for 1600x900 videos 16:9 ratio*/
		padding-top: 0px;
		height: 0;
		overflow: hidden;
	} */
	.videoBox iframe,
	.col2 iframe{
		position: relative;
		top: 0;
		left: 0;
		width: 100%;
		height: 50vw;
		}
	audio{
		width: 100%
	}
	nav{
		margin-top: 22px;
		font-size: .8em;
		line-height: .4;
	}
	.live{
		margin-top: 2px;
		font-size: 1.1em;
		display: flex;
		  justify-content: center;
	}
	.live2{
		margin-top: 22px;
		font-size: 1.7em;
	}
	.live2 li{
	margin-bottom: 7px;
	}
	
	ul.live-liste{
		font-size: 1.6em
	}
	
}

















}