@charset "utf-8";

	html, body
	{
		padding: 0;
		margin: 0;
	}
	body
	{
		background-color: black;
		font-family: source_sans_proregular, Helvetica Neue, Helvetica, Verdana, Arial, sans-serif;
		font-size: 18px;
		line-height: 150%;
		color: #DCDCDC;
		position: relative;
		-webkit-text-size-adjust: none;
	}
	body *
	{
		text-shadow: none;
	}
	.grau {
		color: #666;
	}
	
	.fs08 {
		font-size:0.8em;
	}
	p {
		/* font: normal 0.7em "Verdana", "Arial", "Helvetcia", sans-serif; */
		font-family:"source_sans_proregular", "Verdana", "Arial", "Helvetcia", sans-serif;
		font-weight: 400;
		font-size: 18px;
		margin: 0;
		padding: 0;
	}
	.ues1 {
		font-size:1.2em;
		font-family: "source_sans_proextralight", "Verdana", "Arial", "Helvetcia", sans-serif; /* 300 */
		line-height:150%;
	}
	.ues3 {
		font-size:2.0em;
		font-family: "source_sans_proextralight", "Verdana", "Arial", "Helvetcia", sans-serif; /* 300 */
		line-height:100%;
	}
	h1 {
		color:white;
		font-size:3.0em;
		font-family:"source_sans_proextralight", "Verdana", "Arial", "Helvetcia", sans-serif; /* 200 */
		line-height:150%;
		letter-spacing:0.2em
	}
	h2 {
		color:white;
		font-size:2.0em;
		font-family:"source_sans_proextralight", "Verdana", "Arial", "Helvetcia", sans-serif; /* 200 */
		line-height:100%;
	}
	h3 {
		color:white;
		font-size:1.2em;
		font-family:"source_sans_proextralight", "Verdana", "Arial", "Helvetcia", sans-serif; /* 200 */
		line-height:100%;
	}
	.ulli ul li{
		font-family:"source_sans_proregular", "Verdana", "Arial", "Helvetcia", sans-serif; /* 400 */
		font-weight: 400;
		line-height: 200%;
	}
	.sp1 {/*Leerzeile mit space.gif*/
		vertical-align:top;
		width:1px;
		height:10px;
		border: 0px;
		}
	.sp2 {/*Leerzeile mit space.gif*/
		vertical-align:top;
		width:1px;
		height:20px;
		border: 0px;
		}
	.sp3 {/*Leerzeile mit space.gif*/
		vertical-align:top;
		width:1px;
		height:30px;
		border: 0px;
		}
	.sp4 {/*Leerzeile mit space.gif*/
		vertical-align:top;
		width:1px;
		height:40px;
		border: 0px;
		}
	.abst_1 {
		line-height:100%;
	}
	.abst_15 {
		line-height:150%;
	}
	.abst_2 {
		line-height:200%;
	}
	.abst_3,
	.abst_300 {
		line-height:300%;
	}
	.abst_4 {
		line-height:400%;
	}
	.abst_5 {
		line-height:500%;
	}
	.blocked {
		display: none;
	}
	p.abst_x {
		line-height:100%;
	}
	a {
		color:#666666;
		text-decoration:none;
		font-family:"source_sans_proregular", "Verdana", "Arial", "Helvetcia", sans-serif; /* 400 */
		font-weight:400;
		outline: none;
		border:0px;
		}
	a:hover {
		color:white;
		text-decoration:none;
		font-family:"source_sans_proregular", "Verdana", "Arial", "Helvetcia", sans-serif; /* 400 */
		font-weight:400;
		outline: none;
		border:0px;
		}
	a:active {
		color:white;
		text-decoration:none;
		font-family:"source_sans_proregular", "Verdana", "Arial", "Helvetcia", sans-serif; /* 400 */
		font-weight:400;
		outline: none;
		border:0px;
		}
	.titel {
		text-align: center;
		font-size: 22px;
		color:#444;
	}
	.cent {
		text-align: center;
	}
	.cent2 {
		text-align: center;
		font-size: 18px;
	}
	.abstand2 {
		letter-spacing: 0.2em;
	}
	.abstand3 {
		letter-spacing: 0.3em;
	}
	.abstand5 {
		letter-spacing: 0.5em;
	}
	nav:not(.mm-menu)
	{
		display: none;
	}
	#headerl {
		position: fixed;
		top: 0;
		width: 100%;
		height: 90px;
		background: black;
	}
	.space {
		width: 1px;
		height:1px;
	}
	.space_w20 {
		width: 20px;
	}
	.space_h10 {
		height: 10px;
	}
	/* select: */
	option[value=””][disabled] {
		display: none;
	}
	option {
		color: #fff;
	}
	select:required:invalid {
		color: #999;
	}
	
	div#text_mitte {
		position: absolute;
		z-index: 999;
		width: 100%;
		height:100%;
		display:block;
	}
	
	div.text_mitte2 {
		position: fixed;
		text-align:center;
		display:block;
		left: 0;
		right: 0;
		margin-left: 5%;
		margin-right: 5%;
		top: 40%;
		/* -webkit-backface-visibility: hidden;  Most Important*/
	}
	
	div.text_mitte2 h1 {
		color:white;
		font-size:3.0em;
		font-family:"source_sans_proextralight", "Verdana", "Arial", "Helvetcia", sans-serif; /* 200 */
		line-height:150%;
		letter-spacing:0.2em
	}
	
	.text {
		color:white;
		font-size:1.0em;
		font-family:"source_sans_proextralight", "Verdana", "Arial", "Helvetcia", sans-serif; /* 200 */
		line-height:150%;
		letter-spacing:0.2em
	}
	#bild {
		margin: 0 auto;
		max-width: 1000px;
		position: relative;
		
	}
	#bild356 {
		margin: 0 auto;
		max-width: 356px;
		position: relative;
		padding-bottom:30px;
	}
	#bild310 {
		margin: 0 auto;
		max-width: 310px;
		position: relative;
		padding-bottom:30px;
	}
	.content{
		padding: 70px 10%;
		width:80%;
	}
	.contentop{
		padding: 10px 15% 70px 15%;
		width:70%;
	}
	.content_ppp {
		width: 90%;
		margin: 7% 5%;
		display: flex;
	}
	.spalte_rahmen {
		border: 1px solid #444;
		padding: 10px 3%;
	}
	.spalte0 {
		float:left;
		width: 6%;
	}
	.spalte1, 
	.spalte2, 
	.spalte3,
	.spalte11, 
	.spalte22, 
	.spalte33 {
		float:left;
		width: 29%;
	}
	#logo2 {
		position: absolute;
		right:7%;
		width:300px;
		height: 65px;
		top:10px;
		background-image:url('../Bilder/logo_tf.png');
		background-repeat:no-repeat;
	}
	div#dia{ /* Bereich Text unter UES */
		position: relative;
		top: 90px;
		}
	div#seite{ /* Bereich Text unter UES */
		position: relative;
		max-width:50%;
		min-width:240px;
		margin: 90px auto 0;
		}
	div#seitebreit{ /* Bereich Text unter UES */
		position: relative;
		max-width: 1000px;
		min-width:240px;
		margin: 90px auto 0;
	}
	div#tf {
		max-width: 300px;
		margin: 0 auto;
	}
	div#mobil{ /* Bereich Text unter UES */
		position: relative;
		max-width:70%;
		margin: 30px auto 0px;
		}
	figure {
		margin: 0;
	}
	.schmal {
		max-width: 280px !important;
	}
	span.codedirection {
		unicode-bidi:bidi-override; 
		direction: rtl;
		display:inline-block;
	}
	.cont {
		top:0px;
		width:100%;
	}
/* ----------------- fof ---------------------------- */

	.qa { clear:both; list-style-type:none; padding:0 }
	.qa > li { margin:0.5em 0 }
	.qa-question { display:block; position:relative; padding:0.5em 2.5em 0.5em 0.75em; cursor:pointer; -webkit-transition:all 0.3s ease; transition:all 0.3s ease }
	.qa-question:after { content:'+'; position:absolute; right:0; top:50%; margin-top:-0.875em; display:block; width:2.5em; text-align:center; font-weight:bold }
	.qa-question.item-open:after { content:'\2013' }
	.qa .y1 { background: #1a1a1a }
	.qa .y2 { background: #1a1a1a }
	.qa .y3 { background: #1a1a1a }
	.qa .y4 { background: #1a1a1a }
	.qa .y5 { background: #1a1a1a }
	.qa .y6 { background: #1a1a1a }
	.qa .y7 { background: #1a1a1a }
	.qa .y8 { background: #1a1a1a }
	.qa .y9 { background: #1a1a1a }
	.qa .qa-question:hover { background:#333 }
	.js .qa-answer { display:none }
	.qa-answer { position:relative; padding:0.25em 1em }
	.qa .y1 + .qa-answer { background:black; padding: 40px 0 }
	.qa .y2 + .qa-answer { background:black; padding: 40px 0 }
	.qa .y3 + .qa-answer { background:black; padding: 40px 0 }
	.qa .y4 + .qa-answer { background:black; padding: 40px 0 }
	.qa .y5 + .qa-answer { background:black; padding: 40px 0 }
	.qa .y6 + .qa-answer { background:black; padding: 40px 0 }
	.qa .y7 + .qa-answer { background:black; padding: 40px 0 }
	.qa .y8 + .qa-answer { background:black; padding: 40px 0 }
	.qa .y9 + .qa-answer { background:black; padding: 40px 0 }
	
/* ---------------Produkte-Stil------------------------ */
	
	.pfs_li {
		float:left;
		width:30%;
		margin:0;
		padding:0;
	}
	.pfs_li .pfs_li-inside {
		margin-left:0;
		margin-right:30px;
		padding:0;
	}
	#pfs_lire {
		float:left;
		width:70%;
		margin:0;
		padding:0;
	}
	.pfs_lire .pfs_re-inside {
		margin-left:10%;
		margin-right:0;
		padding:0;
	}
	.pfs_lire .pfs_li-inside_re {
		float:right;
		margin-left:0;
		margin-right:3%;
		padding:0;
	}
	
/* ---------------Impressum-Stil------------------------ */
	
	.fs_lire {
		float:left;
		width:50%;
		margin:0;
		padding:0;
	}
	.fs_lire .fs_li-inside {
		margin-left:0;
		margin-right:10%;
		padding:0;
	}
	
	.fs_lire .fs_re-inside {
		margin-left:10%;
		margin-right:0;
		padding:0;
	}
	.fs_lire .fs_li-inside_re {
		float:right;
		margin-left:0;
		margin-right:3%;
		padding:0;
	}
	
	.alrechts{
		text-align: right;
	}

/* ---------------Formular------------------------ */
	
		
	form{
			position: relative;
			padding: 30px 0px 45px 0px;
			margin: auto;
		}
		
	.capt {
		position: relative;
		width: 250px;
		}
		
	.cap{
		position: 	relative;
		top: 		-20px;
		left: 		0px;
		display: 	block;
		border:		1px solid gray;
		padding:	3px;
		background:	black;
		color:		white;
		width:		92%;
		height:		50px;
		/* font-family:VERDANA,ARIAL,HELVETICA; */
		font-family:"source_sans_proregular", "Verdana", "Arial", "Helvetcia", sans-serif;
		font-weight:400;
		font-size:0.8em;
		padding:	0 4%;
		}
		
	.caplad {
			position: relative;
			top: -6px;
		}
		
	.weiss_me { /* Bereich Text unter UES */
		text-align: center;
		font-size: 1.3em;
		padding: 15px 0px 100px 0px;
		background: black;
		color:#CE712B;
	}
		
	fieldset
	{
		text-align:	left; 
		border:		0px solid white;
		display:	block;
		padding:	0px 0px 0px 0px;	/*Innenabstand zum Rahmen - oben wg. IE mit Space*/
		clear:		both;
		margin:		0px 0px 0px 0px;	/*Abstand des f. nach aussen: Oben zum Text, bzw. nächstem Element*/
		font-size:	20px;
	}

	select.form1
	{
		position: 	relative;
		top: 		-20px;
		display:	block;
		border:		1px solid gray;
		background: black;
		color:		white;
		/* font-family: VERDANA,ARIAL,HELVETICA; */
		font-family:"source_sans_proregular", "Verdana", "Arial", "Helvetcia", sans-serif;
		font-weight:400;
		font-size:	0.8em;
		padding:	0 4%;
		width:		100%;
		height:		50px;
	}

	legend
	{
		color:		#000;
	}

	.links
	{
		clear: 		left;
		float: 		left;
		display: 	block;
		width: 		100%; /* 100px mit Text */
		margin-top: 10px;
		font-family:"source_sans_proregular", "Verdana", "Arial", "Helvetcia", sans-serif; /* 400 */
		font-weight:400;
		color:		white;
	}

	.linksbutton	/* Zeile Zurücksetzen-Button */
	{
		clear: 		left;
		float: 		left;
		display: 	block;
		width: 		100%; /* 100px mit Text */
		margin-top: -10px;
		font-family:"source_sans_prosemibold", "Verdana", "Arial", "Helvetcia", sans-serif; /* 500 */
		font-weight:500;
		color:		#292f37;
	}
	
	.buttons {
		position: relative;
		text-align:center;
	}

	.rechts
	{
		position: 	relative;
		clear: 		both;
		float: 		left;
		display: 	block;
		width: 		250px;
		font-family:"source_sans_prosemibold", "Verdana", "Arial", "Helvetcia", sans-serif; /* 500 */
		font-weight:500;
		line-height:100%;
	}

	.info2 
	{
		/* font-family:VERDANA,ARIAL,HELVETICA; */
		position: 	relative;
		width:	258px;
		font-family: "source_sans_proregular", "Verdana", "Arial", "Helvetcia", sans-serif;
		font-size:0.8em;
		font-weight:400;
		color:		white;
		line-height:100%;
		position: 	relative;
		left: 		20px;
	}

	.fo1
	{ /* formularbreite - (width+padding)/2 = left */
		position: 	relative;
		top: 		-20px;
		display: 	block;
		border:		1px solid gray;
		background:	black;
		color:		white;
		height:		50px;
		/* font-family:VERDANA,ARIAL,HELVETICA; */
		font-family:"source_sans_proregular", "Verdana", "Arial", "Helvetcia", sans-serif;
		font-weight:400;
		font-size:0.8em;
		padding:	0 4%;
		width:		92%;
	}
	
	.sm
	{
		position: 	relative;
		top: 		-20px;
		left: 		110px;
		display: 	block;
		border:		1px solid gray;
		padding:	3px;
		background:	#DEEAF7;
	}

	.fradio
	{
		position: 	relative;
		top: 		-15px;
		left: 		110px;
		display: 	block;
		
	}

	.fbutton
	{
		position: 	relative;
		top: 		-15px;
		left: 		0px; /* mit Text 110px */
		display: 	block;
		padding:	3px;
		width: 50%;
		margin: 0 auto;
		background:	black;
			/* Breite plus 2xpadding + 2xborder */
		height:		50px;
		/* font-family: VERDANA,ARIAL,HELVETICA; */
		font-family:"source_sans_proregular", "Verdana", "Arial", "Helvetcia", sans-serif;
		font-weight:400;
		font-size:0.8em;
		text-decoration:none;
		outline: none;
	}
	
	.fbuttond
	{
		position: 	relative;
		top: 		-15px;
		left: 		0px; /* mit Text 110px */
		display: 	block;
		padding-top:	3px;
		padding-bottom:	30px;
		width: 50%;
		margin: 0 auto;
		background:	black;
			/* Breite plus 2xpadding + 2xborder */
		/* font-family: VERDANA,ARIAL,HELVETICA; */
		font-family:"source_sans_proregular", "Verdana", "Arial", "Helvetcia", sans-serif;
		font-weight:400;
		font-size:0.8em;
		text-decoration:none;
		outline: none;
	}
	
	.col_weiss {
		color: white;
	}
	
	.col_orange {
	color: #CE712B;
	border:		1px solid #CE712B;
	}
	
	.col_rot {
	color: #b40000;
	border:	1px solid #b40000; /* #990000 , ad0000 , b40000 , c80000 */
	}
	
	.col_grau {
		color:#666666;
		border:		1px solid gray;
	}
	
	textarea { /* Berechnung s. .fo */
		position: 	relative;
		top: 		-15px;
		left: 		0px;
		overflow: auto; /* Scrollbalken IE auto */
		display: 	block;
		border:		1px solid gray;
		padding:	4% 4%;
		width:		92%;
		height:		200px;
		/* font-family: VERDANA,ARIAL,HELVETICA; */
		font-family:"source_sans_proregular", "Verdana", "Arial", "Helvetcia", sans-serif;
		font-weight:400;
		font-size:0.8em;
		background: black;
		color: white;
	}
	
	.messl {
		max-width: 350px;
		float:left;
	}
	
	.messr {
		max-width: 350px;
		float:right;
	}
	.leer {/*Leerzeile mit space.gif - mittig*/
		width:10px;
		border: 0px;
		}
	img.m 
		{
		border: 1px solid #444;
		}
	img.x {
		border: 0px solid #404040;
		position: 	relative;
		left: 		0px;
		top:		10px;
		}
		
	img.z {
		padding-top: 10px;
		}
		
	img.c {
		position: fixed;
		left: 50%;
		/* bring your own prefixes */
		transform: translate(-50%, 0px);
	}
	img.resp {
		border: 0px;
		width: 100%; 
		height: auto;
		}
	.inno{
		max-width: 617px;
		margin: 0 auto;
	}
	.bild_rechts {
		float:right;
		margin: 0px 10px 15px 20px;
		}
		
	.form2 {
		position:relative;
		left:110px;
		top:-20px;
	}
	
	.form3 {
		position:relative;
		left:380px;
		top:-32px;
	}
	
	.scode {
		border:0;
		width:120px;
		height:50px;
		display:inline;
		float:left;
		overflow: hidden; /* ab hier iframe von src/captcha.php*/
		scrolling: no;
		border:0px;
	}
	
	.active {
		background: #e6e6e6;
	}

	/* ------------------ Formular  Ende ------------------------ */

/* ----------------- mm. ------------------------------------------- */

	#menu .fa
	{
		width: 15px;
		color: #ccc;
	}
	.mm-panel > p
	{
		font-size: 14px;
		margin-top: 20px;
		margin-bottom: 15px;
	}
	.mm-counter.badge
	{
		right: 20px;
	}
	
	.mm-search input {
		border: none;
		border-radius: 26px;
		font: inherit;
		font-size: 17px;
		line-height: 26px;
		outline: none;
		display: block;
		width: 100%;
		height: 26px;
		margin: 0;
		padding: 0 10px; }
		
	.mm-noresultsmsg {
		font-size:1.2em;
	}

	.mm-listview {
	  
	  font-size: 18px; }  /* Schriftgroesse Menue */

	.mm-menu {
	background: white; /* Hintergrund Navbar #f3f3f3 */
	color: rgba(0, 0, 0, 0.7); 
	}
	  
	.mm-menu .mm-navbar a {
	  color: rgba(0, 0, 0, 0.3); 
	  font-size:18px;
	  font-weight:500;
	  }
	  
	.mm-menu.mm-theme-white .mm-navbar > *,
	.mm-menu.mm-theme-white .mm-navbar a {
	color: rgba(0, 0, 0, 0.7);  /* Impressum, Kontakt */
	}

	.bgselected {
		background: rgba(0, 0, 0, 0.1);
		}
	
	#medias {
		padding: 10px 20px 30px 20px;
	}
	
	#medias:after
	{
		border: none !important;
	}

/*-------------------------------------------------------------------*/

	#hamburger
	{
		box-sizing: border-box;
		display: block;
		width: 100px;
		height: 45px;
		position: relative;
		top: 20px;
		left: 0;
		z-index: 2;
	}
	#hamburger:before,
	#hamburger:after,
	#hamburger span
	{
		background: #fff;
		content: '';
		display: block;
		width: 45px;
		height: 4px;
		position: absolute;
		left: 40px;
	}
	#hamburger:before
	{
		top: 10px;
	}
	#hamburger span
	{
		top: 20px;
	}
	#hamburger:after
	{
		top: 30px;
	}

	/* Hamburger animation */
	#hamburger:before,
	#hamburger:after,
	#hamburger span
	{
	-webkit-transition: none 0.5s ease 0.5s;
	transition: none 0.5s ease 0.5s;

	-webkit-transition-property: transform, top, bottom, left, opacity;
	transition-property: transform, top, bottom, left, opacity;
	}
	html.mm-opening #hamburger:before,
	html.mm-opening #hamburger:after
	{
		top: 20px;	
	}
	html.mm-opening #hamburger span
	{
		left: -50px;
		opacity: 0;
	}
	html.mm-opening #hamburger:before
	{
		transform: rotate( 45deg );
	}
	html.mm-opening #hamburger:after
	{
		transform: rotate( -45deg );
	}

	/* -------------------------- MEDIA -----------------------*/

@media all and (max-width: 1000px) {	
		div.text_mitte2 {
			top: 30%;
		}
		div.text_mitte2 h1 {
			font-size:2.6em;
		}
}
	
	
@media all and (max-width: 799px) {
		div.text_mitte2 {
			top: 30%;
		}
		div.text_mitte2 h1 {
			font-size:2.4em;
		}
		.spalte0 {
			width: 0%;
			display:none;
		}
		.spalte1, 
		.spalte2, 
		.spalte3 {
			width: 100%;
		}
		.abst_300 {
			line-height:50%;
		}
		.none {
			display:none;
		}
		.blocked {
			display: block;
		}
		.content_ppp {
			display: inline-block;
			margin: 5% 5%;
		}
		.spalte11, 
		.spalte22, 
		.spalte33 {
			width: 80%;
		}
		.spalte_rahmen {
			border: 0px solid #444;
			padding: 0;
			margin: 10px 10%;
		}
	}

@media all and (max-width: 549px) {
		#hamburger:before,
		#hamburger:after,
		#hamburger span
		{
			left: 15%;
		}
		div.text_mitte2 {
			top: 20%;
		}
		div.text_mitte2 h1 {
			font-size:2.2em;
		}
		h1 {
			font-size:1.6em;
		}
		.text {
		font-size:0.6em;
		}
		.fs_lire {
			width:100%;
		}
		.fs_lire .fs_li-inside {
			margin-left:0%;;
		}
		.fs_lire .fs_re-inside {
			margin-left:0%;
		}
		.fs_lire .fs_li-inside_re {
			float:left;
			margin-right:0%;
		}
		.alrechts{
			text-align: left;
		}
		.pfs_li {
			float:left;
			width:100%;
			margin:0;
			padding:0;
		}
		.pfs_li .pfs_li-inside {
			margin-left:0;
			margin-right:0;
			padding:0;
		}
		h3 {
			color:#666666;
			font-size:0.6em;
			font-family:"source_sans_proextralight", "Verdana", "Arial", "Helvetcia", sans-serif; /* 200 */
			line-height:100%;
			letter-spacing:0.2em
		}
		#pfs_lire {
			float:left;
			width:100%;
			margin:0;
			padding:0;
		}
		
		.ues3 {
			font-size:1.4em;
		}
		figcaption {
			padding: 0px 0px;
		}
	}
	
@media all and (max-width: 420px) {
		div.text_mitte2 {
			top: 20%;
		}
		div.text_mitte2 h1 {
			font-size:2.0em;
		}
		p.abst_x {
			line-height:400%;
		}
		#logo2 {
		width:177px;
		background-image:url('../Bilder/logo_f.png');
		background-repeat:no-repeat;
		}
		h3 {
			color:#666666;
			font-size:0.6em;
			font-family:"source_sans_proextralight", "Verdana", "Arial", "Helvetcia", sans-serif; /* 200 */
			line-height:100%;
			letter-spacing:0.2em
		}
		div#tf {
			margin: 0 10%;
		}
		.abstand5 {
		letter-spacing: 0.4em;
		}
	}
	
@media all and (max-width: 370px) {
		div.text_mitte2 {
			top: 20%;
		}
		div.text_mitte2 h1 {
			font-size:2.0em;
		}
		p.abst_x {
			line-height:400%;
		}
	}