/* @group NOTIZEN */

/*
- Hier zum Beispiel Farben notieren 
*/

/* @end */

/* @group RESET */

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, p, blockquote, abbr, em, img, strong, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, video {
	margin:0;
	border:0;
	padding:0;
	outline:0;
	vertical-align:baseline;
	font-size:100%;
	background:transparent;
}


article, aside, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
	display:block
}

/* Zitate ohne Anführungszeichen */

/* @group LINKS */

a {
	margin:0;
	border:0;
	padding:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}


a:hover, a:active {
	outline: 0
}
/*
:focus {
	outline:thin dotted
}


a:link { 
	-webkit-tap-highlight-color: #FF5E99; iOS rausnehmen, ist zu ressourcenhungrig
}
*/

/* @end */

/* @group TEXTAUSZEICHNUNG */

h1, h2, h3, h4, h5 { 
	font-weight: bold
}



abbr[title] {
	border-bottom:1px dotted #000;
	cursor:help
}



/* @end */

/* @group LISTEN */

ul, ol {
	margin-left: .9em;
}

nav ul {
	margin: 0;
	list-style:none
}


dd {
	margin: 0 0 0 1em;
}



/* @end */

/* @group TABELLEN */


table {
	border-collapse:collapse;
	border-spacing:0
}


caption, th, td {
	text-align:left;
	font-weight:400
}

/* @end */

/* @group FORMULARE */


legend { 
	*margin-left: -7px; /* ≤ IE7 */
}

label {
	cursor: pointer
}

button, input, select, textarea {
	margin: 0;
	vertical-align: baseline;
	*vertical-align: middle; /* ≤ IE */
	font-size: 100%;
}

button, input {
	*overflow: visible;
	line-height: normal; /* FF */
}


table button, table input { 
	*overflow: auto; /* ≤ IE 7 */
}


button, input[type="button"], input[type="reset"], input[type="submit"], [role="button"] {
	cursor: pointer;
	-webkit-appearance: button; /* iOS */
}

/* Größen angleichen ->  */

input[type="checkbox"], input[type="radio"] { 
	padding: 0;
	box-sizing: border-box;
}


/* <- Größen angleichen */


button::-moz-focus-inner {
	border: 0;
	padding: 0;
}

textarea { 
	overflow: auto;
	vertical-align: top;
	resize: vertical;
}

input, textarea {
border:  1px solid #ddd;
background-color: none;	
}

input:invalid, textarea:invalid { 
	background-color: #f0dddd;	
}

/* @end */

/* @group BILDER */

img {
 	border: 0;
  	vertical-align: middle;
 }

/* @end */

/* @group DIVERSE */


/* @end */

html {
	height:100%;
	min-height:100.5%;
	overflow-y: scroll;
}

/* @end */

/* @group HELFER */

/* -> verstecken, für Screenreader zugänglich */
.vs {
	position:absolute; 
	left:-5000px; 
	top:-5000px; 
	width:1px; 
	height:1px; 
	overflow:hidden;
	voice-volume:soft
}

/* <- verstecken */

/* -> ausschalten */
.aus {
	display: none;
	visibility: hidden;
}

/* <- ausschalten */

/* @group Clear */

.cl:before, .cl:after {
	display: block; 
	height: 0; 
	content: "\0020"; 
	visibility: hidden;
}
.cl:after { 
	clear: both;
}


/* @end */

/* @end */


/* @group BASICS */

/* Hier nur die Basisformate eingeben, den Rest im Bereich BILDSCHIRMBREITE */


html {
height: 100%;

    background:rgb(227,82,52);
  	background: #8a817c url("https://filmkunsttage.de/client/grafik/bg-pattern-25.jpg") no-repeat fixed center;
	background-size: cover;
}



body{
	/* 1em = 10px */ 
	height: 100%;
	
	font:normal 10px /*"HelveticaNeue-Light", "Helvetica Neue Light",*/ "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 	color:#000;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
		
	}


/* äußerer Rahmen */

#rahmen{

	display:block;
	margin:0 auto 0 auto;
	width: 80em;
	min-height: 100%;
/* 	background: rgb(227,82,52);
	background:#8a817c; */
	padding-top:3.5em;
	
	
}
/*
#glow {
	position: absolute;
	z-index: 0;
	width: 600px;
	height:  600px;
	background:url('/client/grafik/glow.png')no-repeat 0 0;
}*/

#kopf {
	float: left;
	margin-top: 2.1em;
	width: 18.5em;
	height: 44.8em;
	z-index: 5000;
	position: relative;

    background: url(/client/grafik/s2022.svg) no-repeat 0 bottom;
    background-size: 66%;
}

#kopf img {
    margin-left: -.8em;
    margin-top: -2.8em;

}


/* @group NAVIGATION */

#n1, #n2 {
	float: left;
}

#n1 {
	margin:6.6em 0 2em 0em;
	width: 100%;
}

#n2 {
	margin:0 0 2em 0em;
}



#n2 {
	padding: 4.5em 0 1em 0;
	width: 50em;
}

#n1 ul {
	margin-bottom: 1em;
	font-size: 1.2em;
	line-height: 1.5;
	
	
}

#n1 li, #n2 li {
	float:left;
}

#n1 a, #n1 span, #n2 a, #n2 span {
	border-left: 1px solid #fff;
	padding:0 0.4em;
	text-transform: none;
	color: #fff;
	background: #000;
	font: 500 1.4em "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
	text-decoration: underline;
}

#n2 a, #n2 span {
	font-size: 0.9em;
}

#n1 a:link, #n1 a:visited, #n2 a:link, #n2 a:visited {
	text-decoration: none;
	color: #fff !important;
}

#n1 a:hover, #n1 a.aktiv, #n1 span, #n2 a:hover, #n2 a.aktiv, #n2 span {
	text-decoration: none;
	color: #000 !important;
	background: #fff  !important;
	
} 



/* @end */


/* @group TEXTAUSZEICHUNG */

#inhalt {
	float: right;
	margin: 0;
	padding:0 4.5em 0 4.5em;
	width: 50em;
	z-index: 10;
	background: #fff;
	/*min-height: 100% !important;*/
	background: #fff;
}

#startfilm {
	width: 100%;
}

#inhalt h1, #inhalt h2, #inhalt h3, dt#einzelkino {
	margin:0 0 0.9em -0.1em;
	font-size: 2.8em;
	font-family: "Helvetica Narrow","HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
	font-weight: 800;
	text-transform: none;
	clear: both;
}


dt#einzelkino {
    font-size:1.8em;
}

#inhalt h2 {
	margin:1em 0 0.6em -0.1em;
	font-size: 1.8em;
}

#inhalt h3, dt.kino {
	margin:.5em 0  0.5em 0;
	font-size: 1.5em;
	font-weight: 800;
	text-transform: none;
}

dt.kino {
    	margin:0 0  0.5em 0;
}

.beginn {
    font-weight:400 !important;
}

 #inhalt p, #inhalt ul, #inhalt dl, #inhalt tr, figcaption {
	margin-bottom: 1em;
	font-size: 1.2em;
	line-height: 1.5;
    float: left;
     width:100%;
}
#inhalt p + ul {
    margin-top:-1em;
}

p.ortzeit {
	margin-top: -.8em;
	font-weight: 800;
}

table {
	width: 100%;
	margin-bottom: 1em;
}

th, td {
	padding:0.2em 0.5em 0 0.5em;
}

#inhalt tr {
    margin-bottom: .2em;
}


tr:nth-child(odd) {
	background: #ddd;
}

th {
	width: 123px;
}

.spielplan span {
	float: left;
}


.tag {
	width: 2.1em;
}

.datum {
	width: 3.5em;
}

span[itemprop="streetAddress"] {
	width: 100%;
	display: block;
}

#inhalt dt {
	float:left;
	width: 100%;
	padding-right: 0.8em;
	font-weight: 800;
	
}

#inhalt dt:after {
	content:":";
}

#inhalt dd {
	float:left;
	width: 100%;
	margin-left: 0;

	
}

#inhalt dt[itemprop="name"] {
	float: none;
} 

#inhalt dt[itemprop="name"]:after {
	content:"";
} 


dl.kurzcredits {
	width: 100%;
	float: left;
	margin-top: -.9em;
	margin-bottom: .4em !important;
}



.kurzcredits dt, .kurzcredits dd {
	width: inherit !important;
	display: inline !important;
	float: none !important;
	}

.kurzcredits dt {
	margin-right:-.8em;
	
}


.kontakte {
float: left !important;
margin-top: 0;
}

.kontakte:first-of-type{
	YYYmargin-top: -2.3em;
}


#map {
	margin-top: 1em;
	float: left;
}


/* @group BILDER */

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


#startimg {
	width: 250px;
	float: left;
	margin: 5px 15px 15px 0;
}

#szene {
	margin-bottom: .7em;
	width: 50em;
	height: 33em;
	float:left;
	
}




.notrailer, .einzelbild {
	top: 0;
}


.einzelbild figcaption {
	position: inherit;
	float:left;
	margin: 1em 0 2em;
	font-size:1.2em;
	
}

.einzelbild {
	
	float: left;
	display: block;
    height: auto;
}












/* @end */

/* @group LINKS */

#inhalt a:link, #inhalt a:visited {
	color: #000;
}

#inhalt a:hover {
	color: #fff;
	background: #000;
}


h1 a, h3 a, .kino a, h2 a {
	color: rgb(227,82,52) !important;
}

#inhalt h1 a:hover,#inhalt h3 a:hover,#inhalt .kino a:hover,#inhalt h2 a:hover {
	color: #fff !important;
	background: rgb(227,82,52);
}

/* MOBIL */
@media (max-width: 768px) {
	
	html {
		background: #8a817c url(https://filmkunsttage.de/client/grafik/bg-pattern-25.jpg) center;
	}
	
	#rahmen {
		display: flex;
	    flex-direction: column;
	    align-content: center;
    	align-items: center;
		width: 100%;
	}
	
	#kopf {
		background: none;
		height: 530px;
	}
	
	#kopf img {
		    font: 500 3rem "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
			display: none;
	}
	
	#mobileheader {
		width: 100%;
		background: url(/client/grafik/web-f-new-min.png);
		height: 500px;
		background-size: contain;
	}
	
	#inhalt {
		width: 80%;
        margin: 25px 0;
	}
	
	#inhalt h2 {
		margin: none;
		font-size: 2.5rem;
    	line-height: 3rem;
	}
	
	#inhalt p, #inhalt ul, #inhalt dl, #inhalt tr, figcaption {
	    font-size: 1rem;
	}
	
	.einzelbild figcaption {
		    font-size: 1rem;
	}
	
	#n1 li, #n2 li {
		float: left;
	}
	
	#n2 {
		width: 100%;	
	}
}



/* @end */




/* @end */


/* @group HOCHAUFLÖSENDE DISPLAYS */

/* -> dieser Bereich ist fakultativ */


/* <- dieser Bereich ist fakultativ */

/* @end */

/* @end */

/* @group DRUCK */


/* @end */