/* --------- COOKIE
================================================== */
#cookiedingsbums a {
	color:#fff; 
	text-decoration:none; 
	font-family: "CorporateS-Bold"; font-weight: normal
}
#cookiedingsbums a:hover {text-decoration:underline;}

#cookiedingsbums {
    z-index:10000000 !important; 
   background: rgba(150, 150, 150, 0.6);
		
   position:fixed;
   bottom:0; 
   font-size:13px; 
   line-height:1.2em;
   color: #fff;
   width: 100%;
   padding: .8em 0;
   margin-left: auto;
   margin-right: auto;
   left: 0
   }
#cookiedingsbums .container {
	padding-bottom: 0 !important;
	padding: 0 30px !important;
	}
#cookiedingsbums .info {
	width: 85%;
	float: left;
	text-align: left
	}	
#cookiedingsbumsCloser {
  float: right;
  width: auto;
  text-align: center;
  color: #555;
  position: relative;
  text-decoration: none;
  cursor:pointer;
  border-radius: 3px;
  padding:.2em .5em;
  font-size: 13px;
  text-shadow: 0 1px 0 #fff;
  text-transform: uppercase;
  
  border: 1px solid #ccc;
  background-image: -webkit-linear-gradient(top, #fff 0%, #e0e0e0 100%);
  background-image:      -o-linear-gradient(top, #fff 0%, #e0e0e0 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e0e0e0));
  background-image:         linear-gradient(to bottom, #fff 0%, #e0e0e0 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  background-repeat: repeat-x;
 }
#cookiedingsbumsCloser:hover {
  background-color: #e0e0e0;
  background-position: 0 -15px;
   } 
/* --------- end COOKIE -------- */




body,
html {
  position: relative;
  width: 100%;
  height: 100%; 
  }
  


.text-center {
	width: 100%;
	text-align: center
}





/* --------- ICONS
================================================== */ 
.icons {
	width: 100%;
	float: left;
	padding-left: 80px;
	padding-top: 1em;
	margin-bottom: .5em;
	line-height: 1.2em
}
.icons img {
	width: 60px;
	margin-right: 1em;
	float: left;
	margin-left: -80px;
	margin-top: -1em;
}
@media (max-width: 768px) {
	.icons {
		margin-left: 20%;
		padding-top: .5em;
	}
	.icons img {
		width: 40px;
		margin-right: 0;
		margin-left: -60px;
		margin-top: -.5em;
	}
}	
@media (max-width: 650px) {
	.icons {
		margin-left: 0;
		padding-top: .5em;
	}
	.icons img {
		width: 40px;
		margin-right: 0;
		margin-left: -60px;
		margin-top: -.5em;
	}
}	
/* --------- end ICONS -------- */






/* --------- HEADER
================================================== */  
header {
	margin: 0 !important;
	padding: 0 !important
}
header .container {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	padding-top: 1em !important;
	padding-bottom: 0 !important
}

header a:hover {
	text-decoration: none !important;
	color: #fff !important
	}
	
.mb {
	float: left
	}
.mb-claim {
	font-family: 'CorporateA-Regular';
	font-weight: normal !important; 
	color: #ddd;
	font-size: 130%;
	margin: 1em 0 0 1.3em;
	padding: .4em 1em;
	float: left
	}
.peter-name {
	font-family: 'CorporateS-Light';
	font-weight: normal !important; 
	color: #ddd;
	font-size: 115%;
	float: right;
	margin-right: 1.5em;
	margin-top: 1.65em;
	}	
.peter-logo img {
	float: right;
	width: 115px;
	height: auto;
	margin-top: .7em
	}
.peter-logo:hover img {
	opacity: .8
	}	
				
@media (max-width: 670px) {
	header .container {
		padding-top: .9em !important;
	}
	.mb {
		margin-bottom: -1.5em !important
	}
	.mb-claim {
		font-size: 115%;
		margin: 1.3em 0 0 0;
		padding: .3em 1em;
		border-right: 1px solid #444;
	
		}
	.peter-name {
		font-size: 100%;
		margin-right: 1em;
		margin-top: 1.85em;
		}
	.peter-logo img {
		width: 100px;
		margin-top: .95em
		}
}	
@media (max-width: 540px) {
	header .container {
		padding-top: .5em !important;
	}
	.mb-claim {
		font-size: 105%;
		padding-right: .7em;
		}
	.peter-name {
		font-size: 95%;
		letter-spacing: -.03em;
		margin-right: .6em
		}
	.peter-logo img {
		width: 90px;
		margin-top: 1.05em
		}
}
@media (max-width: 480px) {
	header .container {
		padding-top: .5em !important;
	}
	.mb-claim {
		font-size: 105%;
		}
	.peter-name {
		display: none
		}
	.peter-logo img {
		width: 90px;
		margin-top: 1.05em
		}
}		  
/* --------- end LHEADERGO -------- */








/* --------- LOGO
================================================== */  
.logo {
	margin: .5em auto !important;	
	}
	.logo img {
		width: 15%;
		height: auto;
		margin-top: .7em 
		}
	.logo:hover {
		opacity: .8;
		background-color: none !important
		}	
@media (max-width: 992px) {
	.logo img {
		width: 20%;
		margin-top: 1em 
		}
}	
@media (max-width: 768px) {
	.logo img {
		width: 15%;
		margin-top: .5em;
		margin-bottom: -.7em
		}
}	
@media (max-width: 480px) {
	.logo img {
		width: 25%;
		}
}		  
/* --------- end LOGO -------- */	





/* --------- AUFBAU
================================================== */
body {
   font-family: 'CorporateS-Regular';
   font-weight: normal;
   font-size: medium;
   line-height: 1.5em;
   color: #545454;
   padding: 0;
   margin: 0;
   background: #000
   }	
.wrapper {
	padding: 0;
	box-shadow: 0 .8em 3em rgba(0, 0, 0, 0.4);
	background: #fff;
	}	
.wrapper,
footer,
nav,
nav.affix,
header .container,
#cookiedingsbums .container {
	margin: 0 auto !important;
	width: 900px !important
	}
.wrapper { margin-top: 20px !important }	

@media (max-width: 992px) {
	.wrapper,
	footer,
	nav,
	nav.affix,
	header .container,
	#cookiedingsbums .container  { width: 740px !important  }
}
@media (max-width: 768px) {
	body { padding: 0; line-height: 1.6em !important }
	
	.wrapper,
	footer,
	nav,
	nav.affix,
	header .container,
	#cookiedingsbums .container  { width: 100% !important }
	
	header .container  { width: 90% !important }
}	


	
	
	
	
section {
	padding: 4em 0 0 0;
	text-align: left;
	}
@media (max-width: 992px) {
	section { padding: 3.5em 0 0 0 }
	}	
@media (max-width: 768px) {
	section { padding: 3em 0 0 0 }
	}	
@media (max-width: 480px) {
	section { padding: 3em 0 0 0 }
	}
	
	

.container {
  	margin: 0 12.5%;
  	width: 75% !important;
  	padding: 0 0 6em 0 !important;
  	}
  	@media (max-width: 992px) {
		.container				{ margin: 0 10%; width: 80% !important; }
	}
	@media (max-width: 768px) {
		.container				{ padding-bottom: 3.5em !important }
	}	
	@media (max-width: 480px) {
		.container				{ padding-bottom: 3em !important }
	}
  	
/* --------- end AUFBAU -------- */	







/* --------- START
================================================== */
.IE-Loesung {
	left: -50%;
	float: right !important;
	position: relative
}


#start {
	margin: 0 !important;
	padding: 0 !important;
	height: 680px !important;
	text-align: center !important;
	background: url(../images/JungeSterne_20200701.jpg) no-repeat top center;
	background-position-y: 0;
	background-size: 100%;
	}
#start h1 {
	text-shadow: .05em .05em .1em rgba(0, 0, 0, 0.8);
	line-height: 1.15em !important;
	margin: 2.2em 0 4.3em 0;
	font-size: 400%
	}
.pagedown-scroll {
	opacity: .4;
	color: #fff !important;
   	border: 1px solid rgba(255, 255, 255, .5);
	background: #000;
	border-radius: 100%;
	padding: 1.25em 1.6em 1.1em 1.6em;
	margin: 0 auto 0 auto !important;
	left: 47.5%;
	position: absolute !important;
	}
	.pagedown-scroll:hover {
		opacity: 1;
		color: #fff !important;
		border-color: #000;
	}
		
		
@media (max-width: 992px) {
#start {
	height: 550px !important;
	}	
#start h1 {
	margin: 2.4em 0 4.1em 0;
	font-size: 330%;
	}	
.pagedown-scroll {
	padding: .75em 1.1em .65em 1.1em
	}		
}
@media (max-width: 768px) {	
#start {
	height: 510px !important;
	}	
#start h1 {
	margin: 1.9em 0 3.9em 0;
	font-size: 330%;
	}					
}
@media (max-width: 670px) {	
#start {
	height: 280px !important;
	background-position-y: -90px;
	}
#start h1 {
	font-size: 220% !important;
	margin: 2em 2em 1.5em 2em;
	line-height: 1.1em !important
	}
.pagedown-scroll {
	left: 43.5%;
	opacity: .6
	}					
}
@media (max-width: 580px) {	
#start {
	height: 265px !important;
	background-position-y: -50px;
	}
#start h1 {
	font-size: 200% !important;
	margin: 2.5em 1em 1.8em 1em;
	}		
.pagedown-scroll {
	padding: .5em .8em .4em .8em;
	}	
}	
@media (max-width: 480px) {	
#start {
	background-position-y: 0;
	}	
#start h1 {
	font-size: 205% !important;
	margin: 2em .2em 2.2em .2em;
	}	
}

@media (max-width: 380px) {	
#start {
	height: 255px !important;
	}	
#start h1 {
	font-size: 170% !important;
	margin: 2.8em .2em 2.2em .2em;
	}	
}		
/* --------- end START -------- */	




/* --------- PAGESCROLL
================================================== */
.pagetop-scroll {
    position: fixed;
    bottom: 100px;
    right: 10px;
    display:none;
    z-index: 10;
    
    opacity: .7;
	margin: 22em auto 0 auto !important;
	background: none;
   	color: #fff !important;
   	border: 1px solid rgba(150, 150, 150, 0.5);
   	background: rgba(150, 150, 150, 0.5);
	padding: 1.15em 1.6em;
	
	z-index: 10000
}
.pagetop-scroll:hover {
   	opacity: 1;
	
}
.pagetop-scroll:hover i {
	color: #fff !important
}

@media (max-width: 992px) {
	.pagetop-scroll { padding: .8em 1.2em; }
}
@media (max-width: 768px) {
	.pagetop-scroll {
	    bottom: 90px;
	    right: 0
   	}
}
/* --------- end PAGESCROLL -------- */	







/* --------- NAVIGATION
================================================== */
nav {
	z-index: 100;
	-webkit-transition: all 0.2s;
	-moz-transition: all 0.2s;
	transition: all 0.2s;
	line-height: 1em;
	position: relative !important;
	text-align: center;
	background: none;
	padding: 31px 0 0 0 !important;
	margin: 0 0 -70px 0 !important;
	width: 100% !important;
	height: auto !important;
	height: 70px !important;
	}
	nav ul	{ 
	  	width: 100%;
	  	padding: 0 !important;
	  	margin: 0 !important;
	  	}
	nav .nav li	{ 
	  	float: none;
	  	display: inline-block;
	  	}
	nav a.nav-link {
		font-size: 105%;
	    padding: .55em 1em .45em 1em;
	    margin: 0 .1em;
	    font-weight: 500;
	    color: rgba(255, 255, 255, 0.8);
	    background: rgba(0, 0, 0, 0.5);
	    text-transform: uppercase;
	    float: left;
	    border: 1px solid rgba(0, 0, 0, 0.2);
	    letter-spacing: .01em;
	   }
	nav a.nav-link:focus,
	nav a.nav-link:hover,
	nav a.nav-link:focus:hover {
      	color: #000;
      	background: #fff !important;
      	}
	nav a.nav-link.active,
	nav a.nav-link:focus.active {
	    color: #000;
      	background: #fff !important;
      	}
		           	     

  	nav.affix {
		position: fixed !important;
		background: rgba(150, 150, 150, 0.6);
		padding-top: 15px !important;
		margin-bottom: 0 !important;
		z-index: 100000
	    }
	nav.affix ul	{ 
	  	padding: 1em 0;
	  	}   	  
	
	
	nav a.nav-link.top 						{ display: none}   	  	
	nav.affix a.nav-link.top 				{ display: inline-block;  }
	nav.affix a.nav-link.active.top 		{ background: rgba(0, 0, 0, 0.5) !important; color: #fff }
	nav.affix a.nav-link.active.top:hover 	{ background: #fff !important; color: #000 }        

@media (max-width: 767px) {
	nav .navbar-collapse.collapse	{
		padding: 0 !important
		}
	nav .collapse {
		display: inline
		}
		
	nav	{ 
		padding-top: 20px !important;
		}
	nav.affix {
		padding-top: 8px !important;
		height: 50px !important
		}
	    	
	nav a.nav-link {
		font-size: 90% !important;
		padding: .35em .8em .3em .8em !important
	    } 	
}
@media (max-width: 520px) {
	nav.affix {
		padding-top: 13px !important;
		}
	nav a.nav-link {
		font-size: 85% !important;
	    padding: .3em .7em .2em .7em !important;
	    margin: 0;
	    }  
	    nav li:first-child 	{ margin-left: .0 } 
	    nav li:last-child 	{ margin-right: 0 }  
}
@media (max-width: 440px) {
	nav.affix {
		}
	nav a.nav-link {
		font-size: 75% !important;
	    padding: .1em .45em 0 .45em !important;
	    letter-spacing: -.002em
	    }  
	nav.affix a.nav-link.top 	{ 
		display: none
		}
	    
}
/* --------- end NAVIGATION -------- */	


	






/* --------- FOOTER
================================================== */
footer {
	background: #444;
	color: #777;
	text-align: center;
	line-height: 1.2em;
	font-size: 80%;
	padding: 2em 0 1em 0;
	width: 100% !important
  }
footer a {
	color: #777;
}
footer a:hover {
	color: #fff;
	text-decoration: none
}
/* --------- end FOOETR -------- */	





/* --------- OHNE RAND
================================================== */
.no-gutters {
  margin-right: 0;
  margin-left: 0;
}

.no-gutters > .col,
.no-gutters > [class*="col-"] {
  padding-right: 0;
  padding-left: 0;
}
/* --------- end OHNE RAND -------- */


.popup-gallery{
  	margin: 0 !important;
  	}


/* --------- HEDALINES
================================================== */
h1, h2, h3, h4, h5 {
	color: #fff;
	letter-spacing: 0;
	font-family: 'CorporateACon-Reg';
	font-weight: normal !important; 
	text-align: center;
	letter-spacing: 0 !important
}

h1 				{ font-size: 350%; margin-bottom: .5em; font-weight: 400 !important; text-transform: uppercase; line-height: 1.1em !important  }
h2 				{ font-size: 300%; margin-top: .3em; margin-bottom: 1em;   }
h3 				{ font-size: 180%; margin-top: 1.5em; margin-bottom: .5em;  }
h4 				{ font-size: 130%; margin-top: 2em; margin-bottom: 1em; font-family: "CorporateS-Demi"; font-weight: normal; }
h5 				{ font-size: 110%; font-family: "CorporateS-Bold"; font-weight: normal; margin-top: .5em; margin-bottom: 1em; letter-spacing: .1em; font-weight: 400 !important; }

@media (max-width: 992px) {
h1 				{ font-size: 300% }
h2 				{ font-size: 260% }
h3 				{ font-size: 180% }
h4 				{ font-size: 130% }
h5 				{ font-size: 110% }
}

@media (max-width: 768px) {
h1 				{ font-size: 290% }
h2 				{ font-size: 250% }
h3 				{ font-size: 170% }
h4 				{ font-size: 130% }
h5 				{ font-size: 110% }
}
@media (max-width: 480px) {
h1, h2, h3, h4, h5 {
	letter-spacing: .02em
}
h1 				{ font-size: 240%; letter-spacing: 0 }
h2 				{ font-size: 210% }
h3 				{ font-size: 140% }
h4 				{ font-size: 120% }
h5 				{ font-size: 105% }
}


/* --------- end HEDALINES -------- */	



.border { border-bottom: 1px dotted rgba(255, 255, 255, 0.2)}

.muted {
	font-family: 'CorporateACon-Reg';
	font-weight: normal !important; 
}



/* --------- LISTE
================================================== */

section ul {
	list-style: none;
	margin: 1.5em 0 1.5em 0;
	padding: 0;
	line-height: 1.3em
}
section ul li {
	list-style: none;
	margin: 0 0 .9em 0;
	padding: 0;
	margin-left: 25px !important
}

section ul li:before {
	content: '\F061';
	font-family: 'Font Awesome 5 Free'; font-weight: 900 !important;
    color: #bbbfc4;
	display: inline-block;
	margin-left: -23px;
	width: 15px;
	font-size: 80%;
	margin-right: .5em
	}
/* --------- end LISTE -------- */	
		





/* --------- LISTE nebeneinander
================================================== */
.liste 					{ margin: -1.7em 0 4em 0 !important; float: left; width: 100%; line-height: 1.2em }
.liste .muted 			{ margin-bottom: -.37em; display: inline-block}
.liste .txt_xl 			{ font-size: 45pt !important }
.liste .col 			{ width: 23%; float: left; margin-right: 2%; text-align: center }
.liste .col:last-child 	{ width: 25%; margin-right: 0 }
	
@media (max-width: 992px) { 
	.liste 					{ margin: -2em 0 4em 0 !important; }
	.liste .muted 			{  }
	.liste .txt_xl 			{ font-size: 33pt !important }
	}
@media (max-width: 768px) { 
	.liste 					{ font-size:80%; letter-spacing: -.01em}
	}
@media (max-width: 550px) { 
	.liste 					{ font-size: 100%; margin: -1.5em 0 2.5em 0 !important; letter-spacing: 0}
	.liste .muted 			{ }
	.liste .txt_xl 			{ font-size: 38pt !important }
	.liste .col 			{ width: 48%;  margin-right: 2%; margin-bottom: 1em }
	.liste .col:last-child 	{ width: 50%; margin-right: 0 }

	}	 
/* --------- end LISTE nebeneinander -------- */



/* --------- ICON
================================================== */
.icon	{ 
	padding-left: 30px;
	margin: 0 auto .7em auto;
	padding-bottom: 0;
	width: 100%;
	text-align: left
	}	
	@media (max-width: 992px) {
		.icon	{ width: 75%}
	}
	@media (max-width: 768px) {
		.icon	{ width: 100%}
	}
.icon:last-child	{ 
	border-bottom: none;
	padding-bottom: 0
	}		
.icon,
.icon a {
	text-decoration: none;
	color: #000 !important
	}

.icon a:hover {
	color: #000
}
.icon i 	{ 
	margin-left: -30px; 
	width: 20px;
	text-align: center;
	border-radius: 2px;
	font-size: 100%;
	float: left;
	margin-top: 2px;
	color: #bbbfc4;
	}

.icon .row {
	margin: 0;
}
.icon .row > [class*="col-"] {
	padding-left: 0;
	padding-right: .3em;
	margin-bottom: .4em
}	

.icon.icon-leer	{ 
	padding-left: 0;
	}
	
	
	

#kontakt .row [class*="col-"] {
		margin-bottom: 3em
	}
@media (max-width: 992px) {
	#kontakt .row {
		margin-left: 19%;
	}
}
@media (max-width: 768px) {
	#kontakt .row {
		margin-left: 25%;
	}
	#kontakt .row [class*="col-"] {
		margin-bottom: 2em
	}
}
@media (max-width: 480px) {
	#kontakt .row {
		margin-left: 10%;
	}
}
/* --------- end ICON -------- */






/* --------- FAHRZEUG
================================================== */
section#fahrzeuge {
	
}
section#fahrzeuge h1,
section#fahrzeuge h2,
section#fahrzeuge h3,
section#fahrzeuge h4,
section#fahrzeuge h5,
section#fahrzeuge h6 {
	color: #000 !important;
}

@media (max-width: 768px) {
	#fahrzeuge .container	{ width: 86% !important; margin: 0 7% }
	}	
@media (max-width: 480px) {
	#fahrzeuge .container	{ width: 90% !important; margin: 0 5% }
	}


.fahrzeug {
	background: #ecebeb;
	padding: 3em 1em;
	box-shadow: 0 .15em .4em rgba(0, 0, 0, 0.6);
	display: inline-block;
	margin: 0 auto 2em auto;
	color: #4c4c4c !important;
	-webkit-transition: all 0.2s;
	-moz-transition: all 0.2s;
	transition: all 0.2s;
	
}
.fahrzeug:hover {
	transition: .3s;
	background: #bbb;
	box-shadow: 0 .15em .4em rgba(0, 0, 0, 1);
	}
	.fahrzeug:hover .btn-primary,
	.fahrzeug:hover .btn-primary:focus,
	.fahrzeug:hover .btn-primary:visited {
	background: #000;
	color: #fff !important
	}
	.fahrzeug:hover .btn-primary:hover {
	background: #000;
	color: #23b1fa !important
	}
	
	.fahrzeug .bild {
	border: 1px solid rgba(0, 0, 0, 0)
	}
	.fahrzeug:hover .bild {
	border-color: rgba(0, 0, 0, 0.3)
	}
.fahrzeug img {
}

.f_headline,
.f_headline a {
	font-family: "CorporateS-Bold";
	font-weight: normal;
	color: #000 !important;
	font-size: 140%;
	line-height: 1.2em;
	margin-bottom: .5em;
	
	font-family: "CorporateACon-Reg";
}
.f_headline a:hover {
	color: #000 !important;
	text-decoration: underline
}


.fahrzeug .btn {
	position: absolute;
	margin-left: -9.8em;
	margin-top: -4em;
	box-shadow: 0 .2em .4em rgba(0, 0, 0, 0.3);
	color: #fff !important
	}
.fahrzeug .btn.btn-primary:hover {
	color: #000 !important;
	background: #fff !important;
	border: 1px solid rgba(0, 0, 0, 0.5)
}	


@media (max-width: 768px) {
	.fahrzeug {
		font-size: 85%;
		padding: 2em 1em 1.5em 1em;
	}
	.fahrzeug .btn {
	margin: -40px 0 0 0;
	font-size: 90%;
	float: right;
	right: -15px;
	padding: .4em .8em
	}
}
@media (max-width: 480px) {
	.fahrzeug {
		font-size: 75%;
		padding: 1.5em 0 1em 0;
	}
	
	.fahrzeug .txt_xs {
		font-size: 75%;
	}
	
	.fahrzeug .btn {
	right: 15px;
	margin-top: -29px;
	padding: .3em .6em
	}
}
/* --------- end FAHRZEUG -------- */	





/* --------- BUTTON
================================================== */
.btn {
	background: #fff;
	color: #545454;
	border-radius: 5px;
	font-weight: 700;
	white-space: normal
}
.btn:hover {
	background: #bbbfc4;
	color: #fff
}


.btn-primary {
	background: #23b1fa;
	color: #000 !important;
	color: #fff !important;
	border: none
}
.btn-primary:hover {
	background: #4ac3ff;
	color: #000 !important;
	color: #fff !important
}

/* --------- end BUTTON -------- */	





/* --------- SONSTIGES
================================================== */

hr {
  max-width: 150px;
  border-width: 1px;
  border-color: rgba(255, 255, 255, 0.5);
  margin-top: 4em;
  margin-bottom: 4em;
  }


.text-black 			{ color: #000 !important } 
.text-primary 			{ color: #f5a600 !important } 
.text-hausfarbe 		{ color: #f6e200 !important } 
.text-light 			{ color: #bbbfc4 !important }

a.text-primary:hover 	{ color: #cd7500 !important } 
a.text-hausfarbe:hover 	{ color: #23b1fa !important } 
a.text-muted:hover 		{ color: #5d6d73 !important }  



.bg-primary {
  background-color: #ddd !important;
  }


.bg-hausfarbe {
  background-color: #ecebeb !important;
  color: #000 !important;
  }  
   .bg-hausfarbe h1, .bg-hausfarbe h2, .bg-hausfarbe h3, .bg-hausfarbe h4, .bg-hausfarbe h5 {
  color: #000 !important
  } 
  .bg-hausfarbe .icon {
  color: #000 !important;
  }
  .bg-hausfarbe .icon i {
  color: #000 !important;
  }
   .bg-hausfarbe hr {
  border-color: rgba(0, 0, 0, 0.3) !important;
  }
  


.bg-hausfarbe .grau,
.bg-hausfarbe .grey,
.bg-hausfarbe .gray {
  color: rgba(0, 0, 0, 0.5) !important;
  }
  
  
.bg-light {
  background-color: #fff !important;
  } 
  .bg-light h1, .bg-light h2, .bg-light h3, .bg-light h4, .bg-light h5 {
  color: #000 !important
  } 
  .bg-light .icon a {
	  color: #545454 !important
  }
  .bg-light .icon a:hover {
  color: #000 !important;
  text-decoration: underline !important;
  }
  .bg-light .icon i {
  }
  .bg-light form label {
  color: #545454 !important;
  }
  .bg-light form .btn {
  background: rgba(255, 255, 255, 0.4) !important;
  color: #545454 !important;
  }
  .bg-light form .btn:hover {
  background: #fff !important;
  }
   
   

.bg-dark {
  background-color: #000 !important;
  color: #fff;
  box-shadow: 0 -.2em .4em rgba(255, 255, 255, 0.5) inset
  }
  .bg-dark h1, .bg-dark h2, .bg-dark h3, .bg-dark h4, .bg-dark h5 {
  color: #fff !important
  }
  .bg-dark .icon,
  .bg-dark .icon a {
  color: #23b1fa !important
  }
  .bg-dark .icon a:hover {
  color: #23b1fa !important;
  text-decoration: underline !important;
  }
  .bg-dark .grau,
  .bg-dark .grey,
  .bg-dark .gray {
	  color: rgba(255, 255, 255, 0.5) !important;
	  }
  
  
  
  
.bg-special {
  background-color: #ee0000 !important;
  color: #fff
  }
  .bg-special h1, .bg-special h2, .bg-special h3, .bg-special h4, .bg-special h5 {
  color: #23b1fa !important
  }
  .bg-special .icon,
  .bg-special .icon a {
  color: #23b1fa !important
  }
  .bg-special .icon a:hover {
  color: #23b1fa !important;
  text-decoration: underline !important;
  }  
  
  
  



section a 		{ color: #23b1fa !important; text-decoration: none }
section a:hover { color: #4ac3ff !important; text-decoration: underline }


p {  }
	
	
.text-left { text-align: left}
.uppercase { text-transform: uppercase !important } 
.lowercase { text-transform: none !important } 
b, .bold		{ font-family: "CorporateS-Bold"; font-weight: normal }
.semibold	{ font-family: "CorporateS-Demi"; font-weight: normal }
.normal 	{ font-family: "CorporateS-Regular"; font-weight: normal }
.light 		{ font-family: "CorporateS-Light"; font-weight: normal }


.grau, .gray	{ color: #999 !important}		
.rot, .red 	{ color: #ee0000 !important }
.hausfarbe 	{ color: #23b1fa !important }

h1.hausfarbe,
h2.hausfarbe,
h3.hausfarbe,
h4.hausfarbe,
h5.hausfarbe,
h6.hausfarbe 	{ color: #23b1fa !important }

.blau, a.blau, a .blau,
icon.blau, .icon.blau a 		{ color: #23b1fa !important; text-decoration: none }
.blau:hover, a.blau:hover, a:hover .blau,
icon.blau, .icon.blau a:hover  { color: #4ac3ff !important; text-decoration: underline }
  
  
.txt_xxxs 				{ font-size: 60%; line-height: 1.2em !important; }
.txt_xxs 				{ font-size: 75%; line-height: 1.2em !important; }
.txt_xs 				{ font-size: 80%; line-height: 1.3em !important; }
.txt_s 					{ font-size: 90%; line-height: 1.4em !important; }
.txt_m 					{ font-size: 100% }
.txt_l 					{ font-size: 115%; line-height: 1.4em !important; }
.txt_xl 				{ font-size: 140%; line-height: 1.5em !important; }
.txt_xxl 				{ font-size: 180%; line-height: 1.5em !important; }
.txt_xxxl 				{ font-size: 230%; line-height: 1.6em !important; }
 

  
.lineheight-1			{ line-height: 1em !important;  }
.lineheight-11			{ line-height: 1.1em !important; }
.lineheight-12			{ line-height: 1.2em !important; }
.lineheight-13			{ line-height: 1.3em !important; }
.lineheight-14			{ line-height: 1.4em !important; }
.lineheight-15			{ line-height: 1.6em !important; }
.lineheight-17			{ line-height: 1.7em !important; }
.lineheight-18			{ line-height: 1.8em !important; }
.lineheight-19			{ line-height: 1.9em !important; }
.lineheight-2			{ line-height: 2em !important; }

.letterspacing-1		{ letter-spacing: -0.01em }
.letterspacing-2		{ letter-spacing: -0.02em }
.letterspacing-3		{ letter-spacing: -0.03em }
.letterspacing-4		{ letter-spacing: -0.04em }
.letterspacing-5		{ letter-spacing: -0.05em }
.letterspacing-6		{ letter-spacing: -0.06em }
.letterspacing-7		{ letter-spacing: -0.07em }
.letterspacing-8		{ letter-spacing: -0.08em }
.letterspacing-9		{ letter-spacing: -0.09em }


.nowrap					{ white-space: nowrap !important }
.lowercase 				{ text-transform: none !important }
.uppercase 				{ text-transform: uppercase !important }


/* --------- end SONSTIGES -------- */	





/* --------- FORMULAR
================================================== */
form {
}

form .btn {
	margin-top: 1em
}

.pflichtfeld {
	text-align: right !important;
	right: 0 !important;
	color: #ff4949;
	font-size: 80%
}


form label {
  color: #bbbfc4;
  font-weight: 400
  }
.form-group {
	text-align: left;
	line-height: 1.2em;
}
.form-control { background: #bbbfc4 }

/* --------- end FORMULAR -------- */	












/* --------- FORMULAR
================================================== */

form {
	margin: 2em 5% 0 5%;
}
form .form-control {
	background: #eee;
	border: none;
	font-weight: 300;
}
form .form-control:focus {
	background: #eee;
}

#message {
	min-height: 9em
}

.form_error {
	background: #ffbaba;
	color: #ff0000;
	padding: .1em .3em .2em .3em;
	line-height: 1.2em;
	border-radius: 3px;	
}
.form_error:before {
	color: #ff0000;
	content: '\f06a';
	font-family: 'Font Awesome 5 Free'; font-weight: 900 !important;
    display: inline-block;
	margin-right: .3em;
	}
/* --------- end FORMULAR -------- */	
	










/* --------- ABSTAND
================================================== */
.margin-oben-0 		{ margin-top: 0 !important }	
.margin-oben-xs 	{ margin-top: .2em !important }
.margin-oben-s 		{ margin-top: .4em !important }
.margin-oben-m 		{ margin-top: 1em !important }
.margin-oben-l 		{ margin-top: 1.5em !important }
.margin-oben-xl 	{ margin-top: 2.5em !important }		
	
.margin-unten-0 	{ margin-bottom: 0 !important }
.margin-unten-xs 	{ margin-bottom: .2em !important }
.margin-unten-s 	{ margin-bottom: .4em !important }
.margin-unten-m 	{ margin-bottom: 1em !important }
.margin-unten-l 	{ margin-bottom: 1.5em !important }	
.margin-unten-xl 	{ margin-bottom: 2.5em !important }	

.margin-0 			{ margin-top: 0 !important; margin-bottom: 0 !important }
.margin-xs 			{ margin-top: .4em !important; margin-bottom: .4em !important }
.margin-s 			{ margin-top: .4em !important; margin-bottom: .4em !important }
.margin-m 			{ margin-top: 1em !important; margin-bottom: 1em !important }
.margin-l 			{ margin-top: 1.5em !important; margin-bottom: 1.5em !important }
.margin-xl 			{ margin-top: 2.5em !important; margin-bottom: 2.5em !important }	

.margin-left-xs 		{ margin-left: .25em !important }
.margin-left-s 		{ margin-left: .5em !important }
.margin-left-m 		{ margin-left: 1em !important }
.margin-left-l 		{ margin-left: 1.5em !important }
.margin-left-xl 		{ margin-left: 2em !important }

.margin-right-xs 	{ margin-right: .25em !important }
.margin-right-s 		{ margin-right: .5em !important }
.margin-right-m 		{ margin-right: 1em !important }
.margin-right-l 		{ margin-right: 1.5em !important }
.margin-right-xl 	{ margin-right: 2em !important }

.margin-side-0 		{ margin-right: 0 !important; margin-left: 0 !important }
.margin-side-xs 		{ margin-right: .25em !important; margin-left: .25em !important }
.margin-side-s 		{ margin-right: .5em !important; margin-left: .5em !important }
.margin-side-m 		{ margin-right: 1em !important; margin-left: 1em !important }
.margin-side-l 		{ margin-right: 1.5em !important; margin-left: 1.5em !important }
.margin-side-xl 		{ margin-right: 2em !important; margin-left: 2em !important }

.nomargin 			{ margin: 0 !important }		

	
.padding-oben-0 		{ padding-top: 0 !important }	
.padding-oben-xs 	{ padding-top: .2em !important }
.padding-oben-s 		{ padding-top: .4em !important }
.padding-oben-m 		{ padding-top: 1em !important }
.padding-oben-l 		{ padding-top: 1.5em !important }
.padding-oben-xl 	{ padding-top: 2.5em !important }		
	
.padding-unten-0 	{ padding-bottom: 0 !important }
.padding-unten-xs 	{ padding-bottom: .2em !important }
.padding-unten-s 	{ padding-bottom: .4em !important }
.padding-unten-m 	{ padding-bottom: 1em !important }
.padding-unten-l 	{ padding-bottom: 1.5em !important }	
.padding-unten-xl 	{ padding-bottom: 2.5em !important }	

.padding-0 			{ padding-top: 0 !important; padding-bottom: 0 !important }
.padding-s 			{ padding-top: .2em !important; padding-bottom: .2em !important }
.padding-s 			{ padding-top: .4em !important; padding-bottom: .4em !important }
.padding-m 			{ padding-top: 1em !important; padding-bottom: 1em !important }
.padding-l 			{ padding-top: 1.5em !important; padding-bottom: 1.5em !important }
.padding-xl 			{ padding-top: 2.5em !important; padding-bottom: 2.5em !important }	

.padding-left-xs 	{ padding-left: .25em !important }
.padding-left-s 		{ padding-left: .5em !important }
.padding-left-m 		{ padding-left: 1em !important }
.padding-left-l 		{ padding-left: 1.5em !important }
.padding-left-xl 	{ padding-left: 2em !important }

.padding-right-xs 	{ padding-right: .25em !important }
.padding-right-s 	{ padding-right: .5em !important }
.padding-right-m 	{ padding-right: 1em !important }
.padding-right-l 	{ padding-right: 1.5em !important }
.padding-right-xl 	{ padding-right: 2em !important }

.padding-side-0 		{ padding-right: 0 !important; padding-left: 0 !important }
.padding-side-xs 	{ padding-right: .25em !important; padding-left: .25em !important }
.padding-side-s 		{ padding-right: .5em !important; padding-left: .5em !important }
.padding-side-m 		{ padding-right: 1em !important; padding-left: 1em !important }
.padding-side-l 		{ padding-right: 1.5em !important; padding-left: 1.5em !important }
.padding-side-xl 	{ padding-right: 2em !important; padding-left: 2em !important }

.nopadding-right 	{ padding-right: 0 }
.nopadding-left 	{ padding-left: 0 }
.nopadding 			{ padding: 0 !important }	
	
	
.negativ-oben-xs 	{ margin-top: -.25em !important }
.negativ-oben-s 	{ margin-top: -.5em !important }
.negativ-oben-m 	{ margin-top: -1em !important }
.negativ-oben-l 	{ margin-top: -2.5em !important }
.negativ-oben-xl 	{ margin-top: -6em !important }
.negativ-unten-xs 	{ margin-bottom: -.25em !important }
.negativ-unten-s 	{ margin-bottom: -.5em !important }
.negativ-unten-m 	{ margin-bottom: -1em !important }
.negativ-unten-l 	{ margin-bottom: -2.5em !important }
.negativ-unten-xl 	{ margin-bottom: -6em !important }

.negativ-oben .well {
	box-shadow: 0 .5em .9em 0 rgba(0, 0, 0, 0.15);
}
@media (max-width: 767px) {
	.negativ-oben,
	.container.content.negativ-oben {
		margin-top: 20px !important;
	}	
}	

@media (max-width: 767px) {
	.margin-768-oben,
	.equalheight.margin-768-oben {
		margin-top: 20px !important;
		}
		.margin-768-oben-s 		{ margin-top: .5em !important; }
		.margin-768-oben-m 		{ margin-top: 1em !important; }
		.margin-768-oben-l 		{ margin-top: 1.5em !important; }
		.margin-768-oben-xl 	{ margin-top: 2.5em !important; }
		
	.margin-768-unten,
	.equalheight.margin-768-unten {
		margin-bottom: 20px !important;
		}
		.margin-768-unten-s 	{ margin-bottom: .5em !important; }
		.margin-768-unten-m 	{ margin-bottom: 1em !important; }
		.margin-768-unten-l 	{ margin-bottom: 1.5em !important; }
		.margin-768-unten-xl 	{ margin-bottom: 2.5em !important; }

	
	.nomargin-768-oben {
		margin-top: 0 !important }
	.nomargin-768-unten {
		margin-bottom: 0 !important }	
}


.hide-480,
.hide-768 {
	}
.show-480,
.show-768 {
	display: none !important
	}				
@media (max-width: 767px) {
	.hide-768 {
		display: none !important;
		}	
	.show-768 {
		display:inherit !important;
		}
	}
@media (max-width: 480px) {
	.hide-480 {
		display: none !important;
		}
	.show-480 {
		display:inherit !important;
		}		
	}
			
/* --------- end ABSTAND -------- */