﻿/**/
.stop-all-animations {
    -webkit-animation: none !important;
    -moz-animation: none !important;
    -o-animation: none !important;
    -ms-animation: none !important;
    animation: none !important;
}

/* Preloader bis Seite voll geladen ist*/
#loading {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  position: fixed;
  display: block;
  opacity: 0.0;
  background-color: #fff;
  z-index: 99999;
  text-align: center;
}

#loading-image {
  margin-top:10%;
  z-index: 100;
}

.nur_auf_handys{
		display:none;
}
@media (max-width: 768px) {
	.nur_auf_handys{
		display:inline;
	}
}

body, html{
	
	overflow:hidden; /*keine Scroleisten*/
	
	/*markieren von text verhindern*/
	-moz-user-select: none;
	-khtml-user-select: none;
	user-select: none;
	
	margin: 0px;
	padding:0px;	

	font-family:Arial, Verdana;
	font-size:16px;
	
	font-weight:bold;
	text-shadow: 4px 4px 5px #000;
	color:#f7f5f5;
}

/*Abstand Formelemente*/
.column{
	padding: 5px 10px 5px 10px;
}



#seite7 .column{
padding: 6px 5px 0px 10px;
}

.hero-body {
  padding: 33px 1.5rem;
}



#seite3 .column {
    padding: 0px 10px 0px 10px;
}
@media (max-width: 768px) {
	
	.column {
    padding: 10px 10px 10px 10px;
	}
	
	.hero-body {
		padding: 23px 1.5rem;
	}

	#seite3 .column {
	padding: 0px 10px 40px 10px;
	}	
	
	#seite8.column {
    padding: 5px 10px 15px 10px;
	}
	
}



.spacer-is-very-small{
	
	margin:5px;
	
}
.spacer-is-small{
	
	margin:10px;
	
}

.spacer-is-medium{
	
	margin:20px;
	
}

.spacer-is-large{
	
	margin:40px;
	
}

/* Hintergrund der gesamten APP*/
#container{
	
	margin-top:22px;
	
	padding:25px; /* Einrücken aller Elemente der Seiten für Desktops/Tablets */
    padding-top:90px;
	
	/* Screen 800 x 560 px */
	
	height:560px; /*für Desktops/Tablets */
	
	background-image: url("../pics/backgrounds/portal.jpg");  
	background-position: left top; 
	background-size: 100% 100%; /*Background wird gestreckt in Höhe und Breite zu 100% */ /* cover */
	background-repeat: no-repeat;
	/*background-attachment: fixed; */
	
	/* Perspektivischen Angaben für Rotations-3D-Effekte */
	-moz-perspective: 3000px;
    -ms-perspective: 3000px;
    -webkit-perspective: 3000px;
    perspective: 3000px; 
  
    -moz-perspective-origin: 50% 50%;
    -ms-perspective-origin: 50% 50%;
    -webkit-perspective-origin: 50% 50%;
    perspective-origin: 50% 50%; 
}

@media (max-width: 768px) {
	#container{
		
		background-image: ;  
		padding:0px; /* Einrücken aller Elemente der Seiten für Desktops/Tablets */
		padding-top:90px;
	
		height:100vh; /*für Handys*/
		
		background-image: url("none.none"); 
		background-color: #000;
		background-image: linear-gradient(to right top, #000, #2b6d93, #000);
		
		-moz-perspective-origin: 50% 10%;
		-ms-perspective-origin: 50% 10%;
		-webkit-perspective-origin: 50% 10%;
		perspective-origin: 50% 10%; 		
		
		

	}
}

#medientyp_3d_container{
	
	perspective-origin: 0% 50%;
	
	perspective: 300px; 
	height: 130px;
}
.counter_3d_countainer{
		
		perspective-origin: 50% 50%;
		
		perspective: 300px; 
		
		width: 130px;
}


@media (max-width: 768px) {
	
	#medientyp_3d_container{
		
		  text-align: center;	
  
		  display: flex;
		  align-items: center;
		  justify-content: center;
		  margin: 0 auto;
		  
		  margin-bottom: -70px;
		  margin-left: -215px;
	}
	
	#medientyp_3d_container img{
		
		  width:90%;
	}
}


#fragebox, #fragebox_static{
	
  
  position: absolute;
  z-index:10000;
  width: 100%;
  padding: 3px 10px 3px 10px;
	
  background-color: #246a2c;
  background-image: linear-gradient(to top, #246a2c 0%, #28a911 50%);
  font-size: 25px;
  color: #fff;
  top: -25px;
  left:0px;
  
}

#fragebox p{
	  text-shadow: 2px 2px 4px #000;
}

#seitenzahlbox {
	
    margin-top: -12px;
    position: absolute;
    width: 79%;	
	
	background-image: linear-gradient(to right, transparent 0%, #2732bf 99%);

}
@media (max-width: 768px) {
	
	#fragebox, #fragebox_static{
		font-size: 22px;
	}
	
	#seitenzahlbox {

		width: 86%;
	}
}

#seitenzahlbox p{
	
	text-align: right;
    padding-right: 10px;
}
	
.sichtbar{
	
	display:block;
}

#seite1 #fragebox, #seite2 #fragebox, #seite3 #fragebox, #seite4 #fragebox, #seite5 #fragebox, #seite6 #fragebox, #seite7 #fragebox, #seite8 #fragebox, #seite9 #fragebox,
#seite10 #fragebox, #seite11 #fragebox, #seite12 #fragebox, #seite13 #fragebox, #seite14 #fragebox, #text11, .slidedown_f1, .slidedown_f3, .slidedown_f5, .slidedown_f8, #seitenzahlbox,
#medientyp_box1, #medientyp_box2, #medientyp_box3, #medientyp_box4,
#counter1, #counter2, #counter3, #counter4,
.agenturtask_container{
	
		display:none;
}

#medientyp_box1, #medientyp_box2, #medientyp_box3, #medientyp_box4{
	
		position:asolute;
}

.medientyp_beschr_box{
	
	height:80px;
}

@media (max-width: 768px) {
	
	
	.medientyp_beschr_box{
		
		  height:60px;	
		  
		  text-align: center;	
  
		  display: flex;
		  align-items: center;
		  justify-content: center;
		  margin: 0 auto;
		  
		
	}
}

@media (max-width: 768px) {
	#seite5 #slider_label_container1, #seite5 #slider_label_container2, #seite5 #slider_label_container3, #seite5 #slider_label_container4{
		  text-align: center;	
  
		  display: flex;
		  align-items: center;
		  justify-content: center;
		  margin: 0 auto;
	}
}

.globe{
		height:202px;
		display:none;
		position:absolute;
		margin-top: -15px;
}




/* Hintergrund + Borderstyles aller Einzelseiten*/

.upper_part, .upper_part_start{
		
	padding:0px;
	background-color:rgba(30, 30, 30, 0.9);
	box-shadow: 3px 3px 10px 0px black;
	-webkit-box-shadow: 3px 3px 10px 0px black;
	-moz-box-shadow: 3px 3px 10px 0px black;	
	border: 1px solid yellow;
	border-radius:0px;
	
	box-shadow: 0 0 40px 5px #fffa6d;	
}
.upper_part_start{
	
	padding:25px;
	
}

.reference_col{
		position:relative; /*Animationen (apsolut positioniert) verhalten sich relativ zur Spalte*/
}


#seite1, #seite2, #seite3, #seite4, #seite5, #seite6, #seite7, #seite8, #seite9, #seite10, #seite11, #seite12, #seite13, #seite14, 
#buttons-cover,
#animations_demo_box{

	display:none; /* Alle Seiten zunächst ausgeblendet */
}

#seite1, #seite2, #seite3, #seite4, #seite5, #seite6, #seite7, #seite8, #seite9, #seite10, #seite11, #seite12, #seite13, #seite14{
	padding-left: 7%;
	padding-right: 7%;
}

@media (max-width: 768px) {	
	#seite1, #seite2, #seite3, #seite4, #seite5, #seite6, #seite7, #seite8, #seite9, #seite10, #seite11, #seite12, #seite13, #seite14{
		padding-top: 0px;
	}
	/*
	#seite1{
		padding-top: 0px;
	}	
	#seite3{
		padding-top: 100px;
	}	
	#seite3 #seitenzahlbox{
		margin-top: -45px;
	}		
	#seite5{
		padding-top: 80px;
	}	
	#seite6{
		padding-top: 120px;
	}	
	#seite7{
		padding-top: 100px;
	}*/		
	.globe{
		margin-top: 0px;
	}	
}



#seite3{	
	margin-top: -45px;
}

@media (max-width: 768px) {	
	#seite3{	
	margin-top: 0px;
	}
	#seite3 .upper_part{	
	margin-top: -35px;
	}
	#seite3 #slider_label_box0{
	margin-top: -30px;
	}
}

#popup_container{
	
		/* Perspektivischen Angaben für Rotations-3D-Effekte */
	-moz-perspective: 500px;
    -ms-perspective: 500px;
    -webkit-perspective: 500px;
    perspective: 500px; 
  
    -moz-perspective-origin: 50% 50%;
    -ms-perspective-origin: 50% 50%;
    -webkit-perspective-origin: 50% 50%;
    perspective-origin: 50% 50%; 	
	
}

#seite1_popup, #seite2_popup, #seite3_popup, #seite4_popup, #seite5_popup, #seite6_popup, #seite7_popup, #seite8_popup, #seite9_popup, #seite10_popup, #seite11_popup, #seite12_popup, #seite13_popup, #seite14_popup, 
#popup_firma, #popup_ansprechpartner, #popup_email, #popup_einwilligung{
	
	display:none;
	
	z-index:10000000000000000;
	position: fixed;	
	top:150px;
	
	padding:20px;
	margin-left: 33% ; /* ungefähr mittig */
	
	width:33%;
	
	text-align:center;
	


}


@media (max-width: 768px) {
#seite1_popup, #seite2_popup, #seite3_popup, #seite4_popup, #seite5_popup, #seite6_popup, #seite7_popup, #seite8_popup, #seite9_popup, #seite10_popup, #seite11_popup, #seite12_popup, #seite13_popup, #seite14_popup, 
	#popup_firma, #popup_ansprechpartner, #popup_email, #popup_einwilligung{
		
		top:50%;
		margin-left: 15% ; /* ungefähr mittig */
		
		width:70%;
		


	}
}

/*Divs und Objekte zentrieren (keine Schrift! Für Text passiert das direkt via STYLE-Attribut im HTML-Code)*/
.zentrieren{

	
  text-align: center;	
  
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  
}

@media (max-width: 768px) {
	#seite3 .columns{
		 
		text-align: center;	
  
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 0 auto;
	}
}


@media (max-width: 768px) {
	
	#seite3 columns, #seite3 label, .wichtigkeit, #slider21 , #slider22, #slider23, #slider24, #slider25, #slider26, #slider27,
	#seite4 columns,{
	  text-align: center;	
	  
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  margin: 10px auto;		
	}
	
}

.zentrieren_vertical{
	
	display: table-cell; 
	vertical-align: middle;
}

.weiter, .zurueck{
	
	color:#fff;
	text-decoration:none; /*kein unterstrichener Link*/
	
	float:left;
	margin:10px;
	padding:10px;
	
	/*background-color:rgba(255, 255, 255, 0.4);*/
	background: transparent;
	box-shadow: 3px 3px 10px 0px black;
	-webkit-box-shadow: 3px 3px 10px 0px black;
	-moz-box-shadow: 3px 3px 10px 0px black;	
	
	border: 1px solid black;
	border-radius:0px;
	
}

.weiter:hover, .zurueck:hover{
	
	background-color:rgba(255, 0, 0, 0.9);
	
}

/* Button-Cover (solange Animationen laufen) */
#buttons-cover{
	
	background-color:transparent; 
	position:absolute;
	width:80%;
	height:90px;
	
}

/*Minus und Plus-Buttons für Nummernfelder*/
#minus, #plus { 

    font-size:20px;
	color:#ffffff;
	
	padding: 5px 5px 9px 5px; 
	background: #004173; 
	box-shadow: 0 1px 5px #0062aa, inset 0 10px 20px #b7f9ff;
	-webkit-box-shadow: 0 1px 5px #0062aa, inset 0 10px 20px #b7f9ff;
	-moz-box-shadow: 0 1px 5px #0062aa, inset 0 10px 20px #b7f9ff;		
	
	display: inline-block;
}

/*Start-Teaser-Titel*/
#start_teaser_titel{
	
	width:70%;
	text-align:center;
	
	font-size:22px;
}
@media (max-width: 768px) {	
	#start_teaser_titel{
		
		width:90%;
	}
}

/*Start-Teaser-Untertitel*/
#start_teaser_untertitel{
	
	text-align:center;
	font-size:19px;
	color:#00ff19;
	
}

.andere_frage1{
	
	width:65%;
}

.anderes_ziel_frage2{
	
	width:35%;
}

.label_frage1_industrien, .label_frage3_regionen, .label_frage5_medien_bevorzugt, .label_frage5_medien, .label_frage6_mengen{
	
	font-size: 17px;
	color: #00fd11;
	text-shadow: 2px 2px 2px #000;
}

.regionen_links{
	flex-basis: unset;
    margin-right: -190px;
}

@media (max-width: 768px) {
	.regionen_rechts{
	padding-top: 220px;
	}

}

	
@media (max-width: 768px) {
	
	nobr{
		width:150px;
	}
	#checkbox41, #checkbox42, #checkbox43, #checkbox44{
	margin-left: 10px;
	}
}

#frage6_mengen_container{
	
	padding:25px;
}

#frage6_mengen_container{
	
}

#frage6_mengen_container img{
	
	float:left;
}

.f6_nobr{
	float: right;
	margin-top: -20px;
}

@media (max-width: 660px) {
	
	.f6_beschreibung{
		padding-bottom: 40px;
	}
	
}



#seite7 hr{
	margin:22px 0px 0px 0px;
}

#counter1, #counter2, #counter3, #counter4{
	
	perspective: 300px; /*für 3D-Nummern-Effekte*/
	
	width: 50px;
	height: 50px;
	float: left;
	margin: -10px 2px 15px 2px;	
	
	text-align: center;
	font-size: 20px;
	padding: 6px;
	background-color: #2452d0;
	border: 3px solid #2445a2;
	box-shadow: 0px 0px 0px 3px #fff;
	border-radius: 2px;	

}

#textarea81{
	
	height:70px;
}



/*STANDARD ELEMENTE CSS*/
/* ######################################################################################################### */


/* Textshatten für texte*/
p.is-shadowed, span.is-shadowed, h1.is-shadowed, h2.is-shadowed, h3.is-shadowed{

	text-shadow: 2px 2px 0px #fff; /* h-shadow v-shadow blur-radius color|none|initial|inherit; */
	
}

/* Textglowing für  texte*/
p.is-glowing, span.is-glowing, h1.is-glowing, h2.is-glowing, h3.is-glowing{

	text-shadow: 0px 0px 7px #fff; /* h-shadow v-shadow blur-radius color|none|initial|inherit; */
	
}

/* Schatten für Sectionen, Divs, Buttons, Bilder*/

section.is-shadowed, div.is-shadowed, a.is-shadowed{

	box-shadow: 3px 3px 5px 0px #000; /* none|h-offset v-offset blur spread color |inset|initial|inherit; */
	-webkit-box-shadow: 3px 3px 5px 0px #000;
	-moz-box-shadow: 3px 3px 5px 0px #000;	
	
}



label{
	
	vertical-align:top; 
}

#slider_label_box0, #slider_label_box1, #slider_label_box2, #slider_label_box3, #slider_label_box4, #slider_label_box5, #slider_label_box6, #slider_label_box7 {
	
	float: left;
	min-width: 360px;
}
@media (max-width: 768px) {	
	#slider_label_box0, #slider_label_box1, #slider_label_box2, #slider_label_box3, #slider_label_box4, #slider_label_box5, #slider_label_box6, #slider_label_box7 {
		
		float: none;
	}
}

.wichtigkeit img{
	margin-left: -15px;
}
@media (max-width: 768px) {	
	.wichtigkeit img {
		margin-left: 0px;
	}
}

.is-small.input, .is-small.textarea {
	font-size: 16px;
	margin-top: 0px;
}

.is-small.input {
	height: 34px;
}

.Regler_Nein{
	margin-left:-10px;
	margin-top:-2px;
	float:left;
	padding:2px;
	
	background-color: #222222;
	
	box-shadow: 3px 3px 5px 0px #000; 
	-webkit-box-shadow: 3px 3px 5px 0px #000;
	-moz-box-shadow: 3px 3px 5px 0px #000;	
}

@media (max-width: 768px) {	
.Regler_Nein{
margin-right: 10px;

}
}

.Regler_Ja{
	
	margin-left:5px;
	padding:3px;

	background-color: #222222;
	
		box-shadow: 3px 3px 5px 0px #000; 
	-webkit-box-shadow: 3px 3px 5px 0px #000;
	-moz-box-shadow: 3px 3px 5px 0px #000;	
}

#seite8 .label_box_checkbox_radio{
	
	float:left;
	width:65%;
}

.agenturtask_container{
	float:right;
	margin: -35px 20px 10px 20px;
}
@media (max-width: 768px) {
	.agenturtask_container img{
		display:none;
	}
	#seite8 .label_box_checkbox_radio{
		
		float:none;
		width:100%;
		
		padding-left: 40px;
	}	
}

.agenturtask_container img{
	width:65px;
	margin-right: 60px;
	
}
.agenturtask_container #task_pic_drei{
	margin-top: 10px;
	width:120px;
	margin-right: 0px;
}

.slidedown_f8{
	margin-top:5px;
}

/*FOMULAR CSS*/
/* ######################################################################################################### */

/*Placeholder*/
.input::placeholder, .select select::placeholder, .textarea::placeholder {
  color: rgb(34, 30, 30);
}

/* Standard Checkboxes und Radiobuttons ausblenden*/
input[type="checkbox"], input[type="radio"] {
    display:none;
}

/* Über Slidern nicht aktuellen Wert als Tooltip anzeigen*/
input[type=range]::-ms-tooltip {
    display: none;
}

/* Breite und vertikale Abstände aller Formularelemente*/

	input[type="text"], input[type="email"], .textarea{
		/*min-width:75%;
		width:75%;*/
		border:0px;
		font-size:16px;
		margin-top:-1px;
		
	}		

	}

	.numbertype {	
		text-align:center;
	}
	.select{
	
	}
	.slider_horizontal_container input[type=range]{
		min-width:30%;
		width:30%;	
	}	
	@media (max-width: 768px) {

		.slider_horizontal_container input[type=range] {
		min-width: 210px;
		width: 210px;
		}
	}

#seite5 .label_box_checkbox_radio{
	 -ms-user-select: None;  /* Klick auf DIV führt nicht zu versehentlichem Markieren*/
	-moz-user-select: None;
	-webkit-user-select: None;
	user-select: None; 
	
	margin-left: 40px; /*Label nach rechts einrücken */
}

.label_box_checkbox_radio_horizontal{
	
	float:left;
		
	 -ms-user-select: None;  /* Klick auf DIV führt nicht zu versehentlichem Markieren*/
	-moz-user-select: None;
	-webkit-user-select: None;
	user-select: None; 
	
	margin-left: 0px; /*Label nach rechts einrücken */
	margin-right: 5px; 
}

.slider_horizontal_container label {
    margin-right: 0px; /*Abstand Label und horiz. Slider*/
	padding: 0px;
}



.slider_vertikal_container label {
    vertical-align: top;
    text-align: center;
    margin: 0px 0px 0px 35px;
}

.input, .textarea, .select{ /* Rahmengetaltung aller Formular-Elemente*/
	margin-top: 5px;
	resize: none;
	
	font-family:Arial, Verdana;
	
	box-shadow: inset 2px 2px 2px #aaa;
	-webkit-box-shadow: inset 2px 2px 2px #aaa;
	-moz-box-shadow: inset 2px 2px 2px #aaa;
	border: 0px solid #bbb;
	
	background-color: #eeeeee;
	background-image: linear-gradient(to top left, #b9bbb9fc 5%, #fdf1ff 50%);
	border-radius: 3px;	
	
	
	
}

/* Popup-Optionen Optionen*/
/*########################################*/

.pop_modern{
	
	color:#fff;
	
	border-radius:5px;	
	border: 2px solid #fff;
	
	background-color: #2732BD; /*dark blue*/
	
	box-shadow: rgba(0, 0, 0, 0.20) 0px 14px 25px, rgba(0, 0, 0, 0.20) 0px 10px 10px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.20) 0px 14px 25px, rgba(0, 0, 0, 0.20) 0px 10px 10px;
	-moz-box-shadow: rgba(0, 0, 0, 0.20) 0px 14px 25px, rgba(0, 0, 0, 0.20) 0px 10px 10px;
	
}


/* Checkboxes Radio Optionen*/
/*########################################*/
	
	/* .quadrat */
	/*********************************************/
	.quadrat input[type="checkbox"] + label::before,
	.quadrat input[type="radio"] + label::before{
	  width: 24px;
	  height: 24px;

	  display: block;
	  content: "";
	  float: left;
	  margin: 2px 10px 5px 3px;
	  
	  background: #ddd;
	  box-shadow: inset 2px 2px 5px #222;
	  
	  border: 3px solid #bbb;
	  
	}
	
	.quadrat input[type="checkbox"]:checked+label::before,
	.quadrat input[type="radio"]:checked+label::before{

	  background-color: lightgreen; 
	}
	
	/* .kreis */
	/*********************************************/
	.kreis input[type="checkbox"] + label::before,
	.kreis input[type="radio"] + label::before{
	  width: 25px;
	  height: 25px;

	  display: block;
	  content: "";
	  float: left;
	  margin: 0px 10px 5px 5px;
	  
	  background: #ddd;
	  box-shadow: inset 2px 2px 5px #222;
	  border: 3px solid #bbb;
	  
	  border-radius:13px; 
	}
	
	.kreis input[type="checkbox"]:checked+label::before,
	.kreis input[type="radio"]:checked+label::before{
		
	 background-color: #1b1d1f;
	box-shadow: 0px 0px 5px 5px #00FF19;
	-webkit-box-shadow:0px 0px 5px 5px #00FF19;
	-moz-box-shadow: 0px 0px 5px 5px #00FF19;
	  
	}	
	
	/* .kreis_schwarz*/
	/*********************************************/	
	.kreis_schwarz input[type="checkbox"] + label::before,
	.kreis_schwarz input[type="radio"] + label::before{
	  width: 20px;
	  height: 20px;
	  border: 1px solid black;
	  background-color: white;
	  display: block;
	  content: "";
	  float: left;
	  margin: 3px 10px 5px 8px;
	  
	  box-shadow: none;
	  
	  border-radius:10px; 
	}

	.kreis_schwarz input[type="checkbox"]:checked+label::before,
	.kreis_schwarz input[type="radio"]:checked+label::before{
	  background: white url("../pics/icons/media-record-2x.png") no-repeat center;
	  box-shadow: none;
	  border: 1px solid black;
	}	


	
	/* .haken_schwarz */
	/*********************************************/
	.haken_schwarz input[type="checkbox"] + label::before,
	.haken_schwarz input[type="radio"] + label::before	{
	  width: 20px;
	  height: 20px;
	  border: 1px solid black;
	  background-color: white;
	  display: block;
	  content: "";
	  float: left;
	  margin: 3px 10px 5px 5px;
	}
	
	.haken_schwarz input[type="checkbox"]:checked+label::before,
	.haken_schwarz input[type="radio"]:checked+label::before{

	  background: white url("../pics/icons/check-2x.png") no-repeat center;
	}	

	/* .haken_weiss */
	/*********************************************/
	.haken_weiss input[type="checkbox"] + label::before,
	.haken_weiss input[type="radio"] + label::before{
	  width: 20px;
	  height: 20px;
	  border: 1px solid black;
	  background-color: white;
	  box-shadow: 0px 0px 20px #868686;
	  display: block;
	  content: "";
	  float: left;
	  margin: 3px 10px 5px 5px;
	}
	
	/* .angekreuzt_schwarz */
	/*********************************************/
	.angekreuzt_schwarz input[type="checkbox"] + label::before,
	.angekreuzt_schwarz input[type="radio"] + label::before	{
	  width: 20px;
	  height: 20px;
	  border: 1px solid black;
	  background-color: white;
	  box-shadow: 0px 0px 20px #ffffff;
	  display: block;
	  content: "";
	  float: left;
	  margin: 3px 10px 5px 5px;
	}
	
	.angekreuzt_schwarz input[type="checkbox"]:checked+label::before,
	.angekreuzt_schwarz input[type="radio"]:checked+label::before{

	  background: white url("../pics/icons/x-2x.png") no-repeat center;
	}	

	/* .haken_weiss */
	/*********************************************/
	.haken_weiss input[type="checkbox"] + label::before,
	.haken_weiss input[type="radio"] + label::before{
	  width: 25px;
	  height: 25px;
	  border: 3px solid #d3d3d3;
	  background-color: #727272;
	  box-shadow: 0px 0px 20px #868686;
	  display: block;
	  content: "";
	  float: left;
	  margin: 0px 10px 2px 2px;
	}	
	
	.haken_weiss input[type="checkbox"]:checked+label::before,
	.haken_weiss input[type="radio"]:checked+label::before{

	background: #ffe31a url(../pics/icons/check-2x.png) no-repeat center;
	border: 3px solid #221f1f;
	box-shadow: 0px 0px 20px #333333;
    filter: invert(100%);
	}
	
	/* .slider_checkbox */
	/*********************************************/
	.slider_checkbox input[type="checkbox"] + label { /* Slider_Checkbox_BG OFF*/
	  width: 70px;
	  height: 16px;
	  border-radius: 3px;
	  margin-top:7px;
	  background: #a2a1a1;
	  box-shadow: inset 2px 2px 5px #222;
	  border: 3px solid #bbb;
	  
	  display: inline-block;
	  content: "";	  
	  float:left;
	  transition: background-color 0.4s linear;
	}
	.slider_checkbox input[type="checkbox"] + label:hover {
	  cursor: pointer;
	}
	.slider_checkbox input[type="checkbox"] + label::before { /* Slider_Checkbox_Knopf OFF*/
	  width: 46px;
	  height: 35px;
	  border-radius: 0px;
	  display: block;
	  content: "";
	  float: left;
	  margin: -12px 0px 0px -8px ;
	  transition: margin 0.1s linear;
	  background-color: #fff;
	  background: transparent url("../pics/buttons/regler-knopf.png") 0px 0px no-repeat;	  
	  box-shadow: 2px 2px 5px #333333; 
	}

	.slider_checkbox input[type="checkbox"]:checked+label{ /* Slider_Checkbox_BG ON*/
	  background-color: lightgreen;
	  
	}
	.slider_checkbox input[type="checkbox"]:checked+label::before { /* Slider_Checkbox_Knopf ON*/
	  margin: -12px 0px 0px 20px;
	  box-shadow: 2px 2px 5px #333333;
	}	
	
	/* Checkboxes Zusatz-Optionen*/
	/* .schatten_schwarz */
    .schatten_schwarz input[type="checkbox"] + label::before,
	.schatten_schwarz input[type="radio"] + label::before{
	  box-shadow: 2px 2px 5px #333333;
	}
	
	/* .schatten_schwarz */
    .schatten_weiss input[type="checkbox"] + label::before,
	.schatten_weiss input[type="radio"] + label::before{
	  box-shadow: 2px 2px 5px #ffffff;
	}	
	
	
	
/* Slider Horizontal Optionen*/
/*########################################*/


	/* Grundgerüst für alle Browser */
	/*********************************************/
	
	.label_box_slider_horizontal{
		float:left;
		margin:12px 20px 0px 0px;
	}
	 
	.slider_horizontal_container {
	  background-color: transparent;
	  margin: 0px 0px 0px 0px;
	  height: 40px;
	  
	}

	.slider_horizontal_container input[type=text] {
	  height: 34px;
	  width: 55%;
	}
	.slider_horizontal_container input[type=text],
	.slider_horizontal_container input[type=range] {
	  -webkit-appearance: none;
	  background-color:transparent;
	  
	  margin-top: 5px;
	}
	@media (max-width: 768px) {
		.slider_horizontal_container input[type=text], 
		.slider_horizontal_container input[type=range] {
			margin-top: 10px;
		}
	}
	
	.slider_horizontal_container input[type=range]:focus {
	  outline: none;
	}
	.slider_horizontal_container input[type=range]::-webkit-slider-runnable-track { /*Chrome*/
	  height: 15px;
	  cursor: pointer;
	  animate: 0.2s;
	  background: darkgrey;
	  border-radius: 1.3px;
	  
	  box-shadow: inset 2px 2px 5px #222;
	  border: 3px solid #bbb;
	}
	.slider_horizontal_container input[type=range]::-webkit-slider-thumb {  /*Chrome*/
	  box-shadow: 1px 1px 1px #000000;
	  border: 1px solid #000000;
	  height: 36px;
	  width: 16px;
	  border-radius: 3px;
	  background: #ffffff;
	  cursor: pointer;
	  -webkit-appearance: none;
	  margin-top: -14px;
	}
	.slider_horizontal_container input[type=range]:focus::-webkit-slider-runnable-track { /*Chrome*/
	  background-color: #00ff19; /*green*/
	  cursor: pointer;
	}
	.slider_horizontal_container input[type=range]::-moz-range-track { /* Firefox*/
	  height: 10px;
	  cursor: pointer;
	  animate: 0.2s;
	  background: darkgrey;
	  border-radius: 3px;
	  box-shadow: inset 2px 2px 5px #222;
	  border: 3px solid #bbb;
	}
	.slider_horizontal_container input[type=range]:focus::-moz-range-track { /* Firefox*/
	  background-color: #00ff19; /*green*/
	  cursor: pointer;
	}	
	.slider_horizontal_container input[type=range]::-moz-range-thumb { /* Firefox*/
	  box-shadow: 1px 1px 1px #000000, 0px 0px 1px transparent;
	  border: 1px solid #000000;
	  height: 36px;
	  width: 16px;
	  border-radius: 3px;
	  background: #ffffff;
	  cursor: pointer;
	}

	.slider_horizontal_container input[type=range]::-ms-track { /* IE Edge*/
	  height: 15px;
	  cursor: pointer;
	  animate: 0.2s;
	  background: transparent;
	  border-color: transparent;
	  border-width: 16px 0;
	  color: transparent;

	}
	.slider_horizontal_container input[type=range]::-ms-fill-lower { /* IE Edge*/
	  background: darkgrey;
	  border: 3px solid #bbb;
	  border-radius: 2.6px;
	  box-shadow: inset 2px 2px 5px #222;
	}
	.slider_horizontal_container input[type=range]::-ms-fill-upper { /* IE Edge*/
	  background: darkgrey;
	  border: 3px solid #bbb;
	  border-radius: 2.6px;
	  box-shadow: inset 2px 2px 5px #222;
	}
	.slider_horizontal_container input[type=range]::-ms-thumb { /* IE Edge*/
	  box-shadow: 1px 1px 1px #000000, 0px 0px 1px transparent;
	  border: 1px solid #000000;
	  height: 36px;
	  width: 16px;
	  border-radius: 3px;
	  background: #ffffff;
	  margin-top:1px;
	  cursor: pointer;
	}
	.slider_horizontal_container input[type=range]:focus::-ms-fill-lower { /* IE Edge*/
	  background-color: #00ff19; /*green*/
	  cursor: pointer;
	}
	.slider_horizontal_container input[type=range]:focus::-ms-fill-upper { /* IE Edge*/
	  background-color:  #00ff19; /*green*/
	  cursor: pointer;
	}
	
	/* Slider Horizontal Zusatz-Optionen*/
	
	/* .modern_version */
	/*********************************************/
	
	.modern_version input[type=range]::-webkit-slider-thumb {
		
	  background: transparent url("../pics/buttons/regler-knopf.png") 0px 0px no-repeat; 
	  box-shadow: none;
	  border: 0px solid #000000;
	  height: 58px;
	  width: 50px;
	  border-radius: 0px;
	  cursor: pointer;
	  -webkit-appearance: none;
	  
	  margin-top: -13px; /* Chrome*/
	}	

	.modern_version input[type=range]::-moz-range-thumb {
		
	  background: transparent url("../pics/buttons/regler-knopf.png") -2px 12px no-repeat;  /* Firefox*/
	  box-shadow: none;
	  border: 0px solid #000000;
	  height: 58px;
	  width: 50px;
	  border-radius: 0px;
	  cursor: pointer;
	  
	  /*margin-top: 20px; */

	}	

	.modern_version input[type=range]::-ms-thumb {
		
	  background: transparent url("../pics/buttons/regler-knopf.png") 0px 0px no-repeat; 
	  box-shadow: none;
	  border: 0px solid #000000;
	  height: 58px;
	  width: 50px;
	  border-radius: 0px;
	  cursor: pointer;
	  
	  margin-top:9px; /* IE Edge*/
	}	
	
	
/* Slider vertikal*/
/*########################################*/

	.drehen_90grad_links{
		
	transform: rotate(90deg);
	/*transform-origin: left;*/
	margin-top: 80px;  /* EInrücken Regler Links*/
	}

	.slider_vertikal_container input[type="range"]{
		
		
		cursor: pointer;
		-webkit-appearance: none;
		width:160px; /*meint Höhe des Reglers, weil gedreht*/
		z-index: 200;
		
		border: 0px;
		border-radius:0px;
		background-color: transparent;
	}
	
	.slider_vertikal_container input:focus{
		outline: none;
	}
	
	.slider_vertikal_container input[type=range]::-webkit-slider-runnable-track { /*Chrome track*/
	  height: 15px;
	  cursor: pointer;
	  animate: 0.2s;
	  background: lightgrey;
	  border-radius: 1.3px;
	  
	  box-shadow: inset 2px 2px 5px #222;
	  border: 3px solid #bbb;
	}	
	.slider_vertikal_container input[type=range]:focus::-webkit-slider-runnable-track { /*Chrome track focus*/
	  background: lightgreen;
	}	
	
	.slider_vertikal_container input[type=range]::-moz-range-track { /* Firefox track*/
	  height: 10px;
	  cursor: pointer;
	  animate: 0.2s;
	  background: lightgrey;
	  border-radius: 3px;
	  box-shadow: inset 2px 2px 5px #222;
	  border: 3px solid #bbb;
	}
	.slider_vertikal_container input[type=range]:focus::-moz-range-track { /* Firefox track focus*/
	  background: lightgreen;
	}	
	
	.slider_vertikal_container input[type=range]::-ms-track { /* IE Edge track*/
	  height: 15px;
	  cursor: pointer;
	  animate: 0.2s;
	  background: transparent;
	  border-color: transparent;
	  border-width: 16px 0;
	  color: transparent;
	}	
	
	.slider_vertikal_container input[type=range]::-ms-fill-lower { /* IE Edge track*/
	  background: lightgrey;
	  border: 3px solid #bbb;
	  border-radius: 2.6px;
	  box-shadow: inset 2px 2px 5px #222;
	}
	
	.slider_vertikal_container input[type=range]::-ms-fill-upper { /* IE Edge track*/
	  background: lightgrey;
	  border: 3px solid #bbb;
	  border-radius: 2.6px;
	  box-shadow: inset 2px 2px 5px #222;
	}		
	
	.slider_vertikal_container input[type=range]:focus::-ms-fill-lower { /* IE Edge track focus*/
	  background: lightgreen;
	}
	.slider_vertikal_container input[type=range]:focus::-ms-fill-upper { /* IE Edge track focus*/
	  background:  lightgreen;
	}	
	
	.slider_vertikal_container input[type=range]::-webkit-slider-thumb {  /*Chrome sliderbutton*/
	  box-shadow: 1px 1px 1px #000000;
	  border: 1px solid #000000;
	  height: 36px;
	  width: 16px;
	  border-radius: 3px;
	  background: #ffffff;
	  cursor: pointer;
	  -webkit-appearance: none;
	  margin-top: -14px;
	}	
	
	.slider_vertikal_container input[type=range]::-moz-range-thumb { /* Firefox sliderbutton*/
	  box-shadow: 1px 1px 1px #000000, 0px 0px 1px transparent;
	  border: 1px solid #000000;
	  height: 36px;
	  width: 16px;
	  border-radius: 3px;
	  background: #ffffff;
	  cursor: pointer;
	}
	
	.slider_vertikal_container input[type=range]::-ms-thumb { /* IE Edge sliderbutton */
	  box-shadow: 1px 1px 1px #000000, 0px 0px 1px transparent;
	  border: 1px solid #000000;
	  height: 36px;
	  width: 16px;
	  border-radius: 3px;
	  background: #ffffff;
	  margin-top:1px;
	  cursor: pointer;
	}

	.horizontal-lowest-first
	{
		 -webkit-transform:rotate(0deg);
		 -moz-transform:rotate(0deg);
		 -o-transform:rotate(0deg);
		 -ms-transform:rotate(0deg);
		 transform:rotate(0deg);
	}

	.horizontal-highest-first
	{
		 -webkit-transform:rotate(180deg);
		 -moz-transform:rotate(180deg);
		 -o-transform:rotate(180deg);
		 -ms-transform:rotate(180deg);
		 transform:rotate(180deg);
	}

	.vertical-lowest-first
	{
		 -webkit-transform:rotate(90deg);
		 -moz-transform:rotate(90deg);
		 -o-transform:rotate(90deg);
		 -ms-transform:rotate(90deg);
		 transform:rotate(90deg);
	}

	.vertical-heighest-first
	{
		 -webkit-transform:rotate(270deg);
		 -moz-transform:rotate(270deg);
		 -o-transform:rotate(270deg);
		 -ms-transform:rotate(270deg);
		 transform:rotate(270deg);
	}
	

		/* Slider Optionen speziell vertikal*/
		/*-----------------------------------------------*/

			.slider_vertikal_container{
				float:left; /* horizontal ausrichten*/	
				height:200px; /* sliderhöhe*/	
				margin:0px 5px 20px 0px; /* Abstände Slider*/
			}
			
			.label_vert_slider{
				text-align:center;
			}	
	
	
	/* .modern_version sliderbutton */
	/*********************************************/
	
	.modern_version_vertikal input[type=range]::-webkit-slider-thumb {
		
	  background: transparent url("../pics/buttons/regler-knopf-grau-3d-vertikal.png") 0px 0px no-repeat; 
	  box-shadow: none;
	  border: 0px solid #000000;
	  height: 90px; /*meint Breite, weil gedreht*/
	  width: 50px; /*meint Höhe, weil gedreht*/
	  border-radius: 0px;
	  cursor: pointer;
	  -webkit-appearance: none;
	  
	  margin-left: 0px; /* Chrome meint OBEN wegen Drehung*/
	  margin-top: -40px; /* Chrome meint LINKS wegen Drehung*/
	}	

	.modern_version_vertikal input[type=range]::-moz-range-thumb {
		
	  background: transparent url("../pics/buttons/regler-knopf-grau-3d-vertikal.png") 0px 0px no-repeat;  /* Firefox*/
	  box-shadow: none;
	  border: 0px solid #000000;
	  height: 90px; /*meint Breite, weil gedreht*/
	  width: 50px; /*meint Höhe, weil gedreht*/
	  border-radius: 0px;
	  cursor: pointer;

	}	

	.modern_version_vertikal input[type=range]::-ms-thumb {
		
	  background: transparent url("../pics/buttons/regler-knopf-grau-3d-vertikal.png") 0px -20px no-repeat; 
	  box-shadow: none;
	  border: 0px solid #000000;
	  height: 90px; /*meint Breite, weil gedreht*/
	  width: 50px; /*meint Höhe, weil gedreht*/
	  border-radius: 0px;
	  cursor: pointer;
	  
	  margin-left: px; /* Chrome meint OBEN wegen Drehung*/
	  margin-top: -40px0; /* Chrome meint LINKS wegen Drehung*/
	}	



/*Formular Seite 9*/
#seite9 .formbox0 , #seite9 .formbox1 , #seite9 .formbox2 , #seite9 .formbox3 {
	display:flex;
	justify-content:center;
}
#seite9 .formbox0{
	text-align: center;
    padding: 0px 8% 15px 8%;
    font-size: 18px;
    margin-top: -5px;
}
#seite9 .formbox4 {
	padding-left: 12%;
	margin-top:15px;
}

#seite9 .formbox1 label, #seite9 .formbox2 label, #seite9 .formbox3 label{
	float:left;
	min-width: 130px;

	text-align: right;	
	font-size: 16px;
	color: #00fd11;
	text-shadow: 2px 2px 2px #000;
}

#seite9 input[type="text"], #seite9 input[type="email"]{
	height:32px;
	font-size: 17px;
	width: 240px;
	margin-left: 15px;
	margin-bottom:5px;
}

#seite9 .label_box_checkbox_radio{
	padding: 5px;
	margin-left: 40px;
	border: 1px solid #66686a;

	font-size: 14px;
	

}

#seite9 .sendebox{

	display:none;
}

@media (max-width: 520px) {
	
	#seite9 .formbox1 , #seite9 .formbox2 , #seite9 .formbox3 {
		
		display:block;
	}
	#seite9 .formbox1 label, #seite9 .formbox2 label, #seite9 .formbox3 label{
		
		text-align: left;		
	}
	#seite9 .formbox4 {
		padding-left: 0px;
	}
	
	#seite9 .label_box_checkbox_radio{
		font-size: 12px;
	}	
	
	
}
	
/* Page-Css-Transition Animationsoptionen*/
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

		/* Fader In/out*/	
		.fade-in {
			-webkit-animation: fade-in 0.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
					animation: fade-in 0.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
		}
		.fade-out {
			-webkit-animation: fade-out 0.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
					animation: fade-out 0.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
		}	

		/* Slide-In/out top*/	
		.slide-in-top {
			-webkit-animation: slide-in-top 0.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s both;
					animation: slide-in-top 0.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s both;
		}
		.slide-out-top {
			-webkit-animation: slide-out-top 0.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;
					animation: slide-out-top 0.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;
		}		

		/* Slide-In/out left */	
		.slide-in-left {
			-webkit-animation: slide-in-left 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.3s both;
					animation: slide-in-left 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.3s both;
					animation: slide-in-left 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) 1.3s both;
		}
		.slide-out-left {
			-webkit-animation: slide-out-left 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;
					animation: slide-out-left 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;
		}		
		
		/* Slide-In/out right */	
		.slide-in-right {
			-webkit-animation: slide-in-right 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
					animation: slide-in-right 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
		}
		.slide-out-right {
			-webkit-animation: slide-out-right 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;
					animation: slide-out-right 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;
		}	
		.slide-out-right-delayed {
			-webkit-animation: slide-out-right-delayed 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse 1.5s both;
					animation: slide-out-right-delayed 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse 1.5s both;
		}	

		/* Slide-In/out right 3D-Fade */			
		.slide-in-right-3d-flip {
			-webkit-animation: slide-in-right-3d-flip 1.0s cubic-bezier(0.550, 0.085, 0.680, 0.530) reverse both;
					animation: slide-in-right-3d-flip 1.0s cubic-bezier(0.550, 0.085, 0.680, 0.530) reverse both;			
		}
		.slide-out-right-3d-flip {
			-webkit-animation: slide-out-right-3d-flip 1.0s cubic-bezier(0.550, 0.085, 0.680, 0.530) reverse both;
					animation: slide-out-right-3d-flip 1.0s cubic-bezier(0.550, 0.085, 0.680, 0.530) reverse both;					
		}		
		
		/* Slide-In/out left 3D-Fade */			
		.slide-in-left-3d-flip {
			-webkit-animation: slide-in-left-3d-flip 1.0s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;
					animation: slide-in-left-3d-flip 1.0s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;						
		}
		.slide-out-left-3d-flip {
			-webkit-animation: slide-out-left-3d-flip 1.0s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;
					animation: slide-out-left-3d-flip 1.0s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;						
		}
		
		
		
		/* Scale-In/out topleft corner*/
		.scale-in-topleft {
			-webkit-animation: scale-in-topleft 1.0s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
					animation: scale-in-topleft 1.0s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
		}
		.scale-out-topleft {
			-webkit-animation: scale-in-topleft 1.0s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;
					animation: scale-in-topleft 1.0s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;
		}
		
		/* Scale-In/out center */
		.scale-in-center {
		-webkit-animation: scale-in-center 1.0s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: scale-in-center 1.0s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
		}
		.scale-out-center {
			-webkit-animation: scale-in-center 1.0s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;
					animation: scale-in-center 1.0s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;
		}	
		/* Scale-In/out top*/
		.scale-in-up-top {
			-webkit-animation: scale-in-up-top 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
					animation: scale-in-up-top 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
		}		
		.scale-out-up-top {
			-webkit-animation: scale-out-up-top 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) reverse both;
					animation: scale-out-up-top 1s cubic-bezier(0.390, 0.575, 0.565, 1.000) reverse both;
		}
		/* Scale-In/out center with fixed width */		
		.scale-in-center-fixed-width {
			-webkit-animation: scale-in-center-fixed-width 0.75s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
					animation: scale-in-center-fixed-width 0.75s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
		}		
		.scale-out-center-fixed-width {
			-webkit-animation: scale-out-center-fixed-width 0.75s cubic-bezier(0.390, 0.575, 0.565, 1.000) reverse both;
					animation: scale-out-center-fixed-width 0.75s cubic-bezier(0.390, 0.575, 0.565, 1.000) reverse both;
		}	
	
		
		/* Flip-In/out vertical towards left */			
		.flip-in-ver-left {
			-webkit-animation: flip-in-ver-left 0.75s linear;
					animation: flip-in-ver-left 0.75s linear ;
		}
		.flip-out-ver-left {
			-webkit-animation: flip-out-ver-left 0.75s linear reverse 2s both;
					animation: flip-out-ver-left 0.75s linear reverse 2s both;
		}

		/* Flip-In/out vertical towards left + Scale */					
		.flip-in-ver-left-scale {
			-webkit-animation: flip-in-ver-left-scale 0.75s linear;
					animation: flip-in-ver-left-scale 0.75s linear ;
		}
		.flip-out-ver-left-scale {
			-webkit-animation: flip-out-ver-left-scale 0.75s linear reverse both;
					animation: flip-out-ver-left-scale 0.75s linear reverse both;
		}		
	
		/* Flip-In/out horizontal towards down */			
		.flip-in-hor-left {
			-webkit-animation: flip-in-hor-left 0.75s linear;
					animation: flip-in-hor-left 0.75s linear ;
		}
		.flip-out-hor-left {
			-webkit-animation: flip-out-hor-left 0.75s linear reverse both;
					animation: flip-out-hor-left 0.75s linear reverse both;
		}
		
		/* Zoom-In center STARTSEITE (delayed)*/	
		.zoom-in-center-start {
		-webkit-animation: zoom-in-center-start 3.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) 5s both; /*5s*/
				animation: zoom-in-center-start 3.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) 5s both;  /*5s*/
		}
		
		
		/* Zoom-In/out center */	
		.zoom-in-center {
		-webkit-animation: zoom-in-center 3.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0s both;
				animation: zoom-in-center 3.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0s both;
		}
		.zoom-out-center{
			-webkit-animation: zoom-out-center 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;
					animation: zoom-out-center 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;
		}	
		
		.zoom-in-center-megazoom-quick {
		-webkit-animation: zoom-in-center-megazoom-quick  0.5s linear reverse both;
				animation: zoom-in-center-megazoom-quick  0.5s linear reverse both;	
		}		
		.zoom-in-center-megazoom {
		-webkit-animation: zoom-in-center-megazoom 3.8s cubic-bezier(0.550, 0.085, 0.680, 0.930) 0.2s reverse both;
				animation: zoom-in-center-megazoom 3.8s cubic-bezier(0.550, 0.085, 0.680, 0.930) 0.2s reverse both;
		}
		.zoom-out-center-megazoom {
			-webkit-animation: zoom-out-center-megazoom 1.2s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
					animation: zoom-out-center-megazoom 1.2s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
		}
	
		/* fall-In/out center elliptic */	
		.fall-in-center-elliptic {
			-webkit-animation: fall-in-center-elliptic 0.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
					animation: fall-in-center-elliptic 0.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
		}
		.fall-out-center-elliptic {
		-webkit-animation: fall-out-center-elliptic 0.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;
				animation: fall-out-center-elliptic 0.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;
		}
		
		/* fall-In/out topleft */			
		.fall-in-topleft{
			-webkit-animation: fall-in-topleft 0.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
					animation: fall-in-topleft 0.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
		}		
		.fall-out-topleft {
			-webkit-animation: fall-out-topleft 0.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;
					animation: fall-out-topleft 0.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;
		}		
		
		/* rotate-In/out right */			
		.rotate-in-right {
			-webkit-animation: rotate-in-right 0.75s cubic-bezier(0.165, 0.840, 0.440, 1.000) both;
					animation: rotate-in-right 0.75s cubic-bezier(0.165, 0.840, 0.440, 1.000) both;
		}	
		.rotate-out-right {
			-webkit-animation: rotate-out-right 0.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
					animation: rotate-out-right 0.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
		}	
		
		/* rotate-In/out left */			
		.rotate-in-left {
			-webkit-animation: rotate-in-left 2.55s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
					animation: rotate-in-left 2.55s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
		}	
		.rotate-out-left {
			-webkit-animation: rotate-out-left 0.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
					animation: rotate-out-left 0.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
		}	

		/* rotate-In/out left */			
		.lower-opacity {
			-webkit-animation: lower-opacity 1.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
					animation: lower-opacity 1.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
		}	
		.higher-opacity {
			-webkit-animation: higher-opacity 1.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
					animation: higher-opacity 1.75s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
		}	
		
		/* rotate-In/out left */			
		.label-glow-in {
			-webkit-animation: label-glow-in 0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
					animation: label-glow-in 0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
		}	
		.label-glow-out {
			-webkit-animation: label-glow-out 0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
					animation: label-glow-out 0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
		}		

		.slide-in-bck-center {
			-webkit-animation: slide-in-bck-center 4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: slide-in-bck-center 4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
		}
		
		/* bounce-in-top */			
		.bounce-in-top {
		-webkit-animation: bounce-in-top 1.1s both;
				animation: bounce-in-top 1.1s both;
		}
		
		.flip-in-ver-left{
			-webkit-animation: flip-in-ver-left 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
					animation: flip-in-ver-left 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
		}
		
		.tracking-in-expand {
			-webkit-animation: tracking-in-expand 1.3s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
					animation: tracking-in-expand 1.3s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
		}	

		.tilt-in-fwd-tl {
			-webkit-animation: tilt-in-fwd-tl 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
					animation: tilt-in-fwd-tl 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
		}		
		
		/* In and OUT Animations mixed */	
		/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++  */	
		
		/* 360 Scale-Flip to the front */		
		.flip-scale-2-hor-top {
		-webkit-animation: flip-scale-2-hor-top 1.5s linear both;
	        animation: flip-scale-2-hor-top 1.5s linear both;
		}

		/* 360 Scale-Rotatie to the front */	
		.rotate-scale-up {
		-webkit-animation: rotate-scale-up 1.5s linear both;
	        animation: rotate-scale-up 1.5s linear both;
		}
		
		.slide-up-top {
		-webkit-animation: slide-up-top 0.8s ease-in both;
	        animation: slide-up-top 0.8s ease-in both;
		}
		
		.slide-down-top {
			-webkit-animation: slide-down-top 0.8s ease-out both;
					animation: slide-down-top 0.8s ease-out both;
		}		
		
		
		/* INFINITE LOOP Animations mixed */	
		/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++  */			
		
		.rotate-scale-up-down {
		-webkit-animation: rotate-scale-up 2s linear infinite both;
	        animation: rotate-scale-up 2s linear infinite both;
}
