*{
	margin:0;
	padding:0;
	}

html{height: 100%}
body	{
	margin:0;
	padding:0;
	text-align:center;
	font-family: 'robotoregular', sans-serif;
	font-size:15px;
	line-height:21px;
  font-weight: 300;
	color: rgb(87,77,74);
	background-color:rgb(240,240,240);
}

:focus {outline: none;}

p {margin-bottom:20px;}

a {text-decoration: none; color:rgb(68,180,194)}

strong {font-weight: 600;}

h1, h2, h3, h4 {font-family: 'oswalddemibold', sans-serif;}
h1 {font-size: 80px; line-height: 90px; margin-bottom:20px; text-transform: uppercase; font-weight:bold;}
h2 {font-size: 40px; line-height: 50px; margin-bottom:20px; text-transform: uppercase; font-weight:bold;}
h3 {font-size: 25px; line-height: 30px; margin-bottom:20px;}


#header { margin-bottom:50px; text-align: left;}

.stage { height: 540px; margin-top:20px; clear: both;}
.stage-txt h1 {font-size: 35px; line-height: 45px; margin-left:20px; text-align: left; position: absolute; bottom:60px;}
.mod_article {clear:both;}

.module-onepage-navigation {display: none;}
.mod_article.first {clear:both;}

.logo {
	float:left;
	text-align:left;
	font-size: 20px;
	font-family: 'oswalddemibold', sans-serif; 
	margin:25px 0 10px 20px;
	text-transform: uppercase;}
.logo a:focus {border-bottom:1px solid black;}

.logo strong {font-weight: normal; color:rgb(57,205,231);}



#container {clear:both;}

/* ----- Einstieg ----- */
.ce_rsce_texteinstieg {text-align: left; margin:0 20px 90px 20px;}
.ce_rsce_texteinstieg h2 {width:100%!important; color:rgb(57,205,231); word-wrap: break-word; }
.ce_rsce_texteinstieg .leftbar {margin:0 0 20px 0;}

.ce_rsce_texteinstieg .handorgel__content ul {list-style-image: url(/files/images/bullet-dark.jpg); margin:0 40px 20px 15px;}
.ce_rsce_texteinstieg .handorgel__content ul li{margin:0 0 10px 0;}


/* ----- Leistungen ----- */
.ce_rsce_leistungen {
	color:rgb(255,255,255); 
	padding:0 auto 0 auto!important;
	display: flex; 
	flex-wrap: wrap;
	background:url(/files/images/bg-white.jpg) repeat-x bottom;
	}
	
.ce_rsce_leistungen h2 {color:rgb(255,255,255); text-align: left; margin:0 0 30px 0px; padding:50px 0 0 0 }
.ce_rsce_leistungen ul {list-style-image: url(/files/images/bullet-white.jpg); margin:0 0 30px 15px; text-align: left;}
.ce_rsce_leistungen ul li {margin:0 0 5px 0;}			
	
.ce_rsce_leistungen .leftbar { 
	background:rgb(87,77,74)!important;
	text-align: left; 
	margin:0 0 0 0; 
	width:90%;
	}
	
.ce_rsce_leistungen .leftbar span { 
	display: block;
	margin:0 50px 0 20px;
	}

.ce_rsce_leistungen .rightbar span.last { 
	display: none!important;
	}
		
.ce_rsce_leistungen .rightbar {
	background:rgb(87,77,74)!important;
	text-align: right!important; 
	width: 90%;
	margin:0 0 0 0;
	}
.ce_rsce_leistungen .leftbar p strong { margin:0!important; padding:0;}
.ce_rsce_leistungen .leftbar p { margin:0 0 10px 0!important; padding:0;}

/* ----- Versprechen ----- */	
.ce_rsce_versprechen  {margin:20px;}
.ce_rsce_versprechen h2 {color:rgb(57,205,231); text-align: left;}
.ce_rsce_versprechen .rightbar {text-align: left;}		
.ce_rsce_versprechen ul {list-style-image: url(/files/images/bullet-dark.jpg); margin:0 40px 0 15px;}		
.ce_rsce_versprechen ul li {margin:0 0 5px 0;}		

.ce_rsce_versprechen {
	margin:0 auto 0 auto;
	padding:100px 20px;
	display: flex; 
	flex-wrap: wrap;
	background-color: #fff;
	}	

/* ----- Projektbeispiele ----- */	
.ce_rsce_projekte {
	margin-bottom:100px;	
	background:url(/files/images/bg-white.jpg) repeat-x top;
	}
	
.ce_rsce_projekte .inside {
	background:rgb(87,77,74)!important; 
	padding:50px 20px;
	margin:auto auto;
	text-align: left;
	color: rgb(255,255,255)
	}
	
.ce_rsce_projekte h2 {color:rgb(255,255,255); text-align: left; margin:0 0 40px 0;}
.ce_rsce_projekte ul {list-style-image: url(/files/images/bullet-white.jpg); margin:0 0 40px 15px;}		
.ce_rsce_projekte ul li {margin:0 0 5px 0;}		
.ce_rsce_projekte p {margin:0 0 10px 0;}		


/* ----- Anschrift ----- */

	.ce_rsce_kontakt {margin:0 0 50px 0; }
	.ce_rsce_kontakt .inside.first {float:left; width:5%;}
	.ce_rsce_kontakt .inside.last {float:left; width: 95%;}
	.ce_rsce_kontakt .inside .rightbar { 
	text-align: left; 
	padding:50px 0 30px 0; 
	border-top:1px solid rgb(87,77,74); 
	border-bottom:1px solid rgb(87,77,74);
}

/* ----- Textblock // Impressum Datenschutz ----- */
.colmn--one {margin:0 auto 30px auto!important;}
.colmn--one .content-text {margin:0 auto 30px auto!important; text-align:left; padding-left:20px;}
.colmn--one .content-text  h2 {font-size: 30px; line-height: 50px;margin-bottom: 10px!important;}
.colmn--one .content-text  h3 { line-height: 40px;margin-bottom: 0!important;}
.colmn--one .content-text  ul { margin:20px 0 20px 20px;}

#footer {text-align: left; margin:0 20px 0 20px;}
#footer .inside {padding-bottom:50px;}
#footer .inside ul li {display: inline-block;  margin:0 20px 0 0; }
#footer .inside ul li a {color:rgb(87,77,74);}
#footer .inside ul li a:hover {color:rgb(57,205,231);}
#footer .inside ul li a:focus {color:rgb(57,205,231);}

.contao-cookiebar .cc-btn.success {background:rgb(57,205,231); border:1px solid rgb(57,205,231);}
.contao-cookiebar .cc-btn.success:hover {color:rgb(57,205,231);background:rgb(255,255,255); border:1px solid rgb(57,205,231);}


/* Small devices (Mobile, 640 and up) */
@media (min-width: 640px) {
h1 {font-size: 60px; line-height: 70px; margin-bottom:20px;}

		}

/* Small devices (tablets, 768 and up) */
@media (min-width: 768px) {
	

#header  {height: auto!important; margin:0 auto 30px auto;}
h1 {font-size: 60px; line-height: 70px; margin-left:25px;}
h2 {font-size: 50px; line-height: 60px; margin-bottom:10px; text-transform: uppercase; font-weight:bold;}
	
	
	.stage {margin:20px auto 0 auto; text-align: center!important;}
	.stage-txt {width:750px; margin:auto auto; text-align: center!important;}
	.stage-txt h1{font-size: 50px; line-height:60px; text-align: left;}	
	
/* ----- Einstieg ----- */
.ce_rsce_texteinstieg {text-align: center; margin:0 auto 100px auto!important;}
.ce_rsce_texteinstieg h2 {color:rgb(57,205,231); word-wrap: break-word; text-align: left;}
.ce_rsce_texteinstieg .leftbar {display:inline-block; vertical-align: top; width:300px; margin:0 50px 20px 0;}
.ce_rsce_texteinstieg .rightbar {display:inline-block; vertical-align: top; text-align: left; width:350px; margin:125px 0 20px 0;}

/* ----- Leistungen ----- */
.ce_rsce_leistungen {
	color:rgb(255,255,255); 
	padding:0 auto 0 auto!important;
	display: flex; 
	flex-wrap: wrap!important;
	background:url(/files/images/bg-white.jpg) repeat-x bottom;
	}
	
.ce_rsce_leistungen h2 {color:rgb(255,255,255); text-align: left; padding:50px 0}
.ce_rsce_leistungen ul {margin:0 0 40px 15px; text-align: left;}
.ce_rsce_leistungen ul li {margin:0 0 5px 0;}			
	
.ce_rsce_leistungen .leftbar { 
	padding:25px 0 25px 0;
	background:rgb(87,77,74)!important;
	text-align: right; 
	width:50%; 
	margin:0 0 0 0; 
	}
.ce_rsce_leistungen .leftbar span.first { 
	display: none!important;
	}
			
.ce_rsce_leistungen .rightbar span.last { 
	display: block!important;
	}
			
.ce_rsce_leistungen .leftbar span { 
	text-align:left;
	display: block;
	float:right;
	width: 300px!important;
	margin:0 50px 0 0;
	}
		
.ce_rsce_leistungen .rightbar {
	background:rgb(87,77,74)!important;
	text-align: right!important; 
	width: 350px;
	margin:0 0 0 0;
	}

.ce_rsce_leistungen .leftbar strong {
	text-align: left!important; margin:0!important; padding:0!important;
	}
	
/* ----- Versprechen ----- */	
.ce_rsce_versprechen {padding:100px 0!important;}	

.ce_rsce_versprechen .leftbar {width:50%;}	
.ce_rsce_versprechen .rightbar {width:350px;}
	
/* ----- Projektbeispiele ----- */	
.ce_rsce_projekte .inside {width:600px; padding:50px 50px;}

	
/* ----- Anschrift ----- */
.ce_rsce_kontakt .inside .rightbar {width:900px!important; margin-left:-350px!important; 	text-align: left; }
.ce_rsce_kontakt .inside.first {float:left;width:50%;}
.ce_rsce_kontakt .inside.last {float:left;width:50%;}
	
.ce_rsce_kontakt .anschrift {display: inline-block;vertical-align: top; margin-right: 40px;}
.ce_rsce_kontakt .kontakt {display: inline-block; vertical-align: top;}
	
/* ----- Textblock // Impressum Datenschutz ----- */
.colmn--one .content-text {padding-left:0; width:700px;}


	
#footer .inside  {margin:0 auto 0 auto;width:700px;}
}

/* Small devices (desktop, 900 and up) */
@media (min-width: 900px) {

.offcanvas {display:none;}
	
#header {height: 640px; margin-bottom:60px}
	
.module-onepage-navigation {display: inline-block; float:right; margin: 25px 20px 25px 0;}
	
	.stage {margin:auto auto; text-align: center!important;}
	.stage-txt {width:885px; margin:auto auto; text-align: center!important;}
	.stage-txt h1{font-size: 60px; line-height:70px; text-align: left;}	
	
/* ----- Einstieg ----- */
.ce_rsce_texteinstieg .leftbar {width:360px; margin:0 50px 20px 0;}
.ce_rsce_texteinstieg .rightbar {width:430px;}
	
/* ----- Leistungen ----- */
.ce_rsce_leistungen .leftbar span { 
	width: 360px!important;
	margin:0 50px 0 0;
	}
		
.ce_rsce_leistungen .rightbar {
	width: 430px;
	margin:0 0 0 0;
	}
	
/* ----- Versprechen ----- */	
.ce_rsce_versprechen .rightbar {width:430px; text-align: left;}	
	
/* ----- Projektbeispiele ----- */		
.ce_rsce_projekte .inside {width:755px; padding:50px;}
	
/* ----- Anschrift ----- */
.ce_rsce_kontakt .inside .rightbar {
	width:1024px!important; 
	margin-left:-430px!important;}
	
/* ----- Textblock // Impressum Datenschutz ----- */
.colmn--one .content-text  {padding-left:0; width:855px;}
	

	#footer {margin:0 auto 0 auto; text-align: left;}
	#footer .inside  {margin:0 auto 0 auto;width:855px;}
	
}


/* Small devices (desktop, 1024 and up) */
@media (min-width: 1024px) {
	
	.stage-txt {width:990px;}
	.stage-txt h1{font-size: 60px; line-height:70px;}
	
/* ----- Einstieg ----- */
.ce_rsce_texteinstieg .leftbar {width:400px; margin:0 70px 20px 0;}
.ce_rsce_texteinstieg .rightbar {width:490px;}

/* ----- Leistungen ----- */
.ce_rsce_leistungen .leftbar span {width: 400px!important;margin:0 70px 0 0;}
.ce_rsce_leistungen .rightbar {width: 490px;}
/* ----- Versprechen ----- */	
.ce_rsce_versprechen .rightbar {width:490px; text-align: left;}	
/* ----- Projektbeispiele ----- */		
.ce_rsce_projekte .inside {width:875px; padding:60px 50px;}
	
/* ----- Anschrift ----- */
.ce_rsce_kontakt .inside .rightbar {
	width:1200px!important; 
	margin-left:-490px!important;}
	
/* ----- Textblock // Impressum Datenschutz ----- */
.colmn--one .content-text  {padding-left:0; width:980px;}
		
#footer .inside  {margin:0 auto 0 auto;width:980px;}
	
}

/* Small devices (desktop, 1200 and up) */
@media (min-width: 1200px) {

#header  {margin:0 auto 90px auto!important;}
	.stage {height:740px;}
	.stage-txt {width:1150px;}
	.stage-txt h1{font-size: 60px; line-height:70px;}
	
/* ----- Einstieg ----- */
.ce_rsce_texteinstieg .leftbar {width:450px; margin:0 100px 20px 0;}
.ce_rsce_texteinstieg .rightbar {width:550px;}
	
/* ----- Leistungen ----- */
.ce_rsce_leistungen .leftbar span {width: 450px!important;margin:0 100px 0 0;}
.ce_rsce_leistungen .leftbar  {padding:40px 0 40px 0;}
.ce_rsce_leistungen .rightbar {width: 550px;}	
.ce_rsce_leistungen h2 {margin:15px 0 0 0;}
.ce_rsce_leistungen ul {margin:0 0 40px 15px; text-align: left;}
/* ----- Versprechen ----- */	
.ce_rsce_versprechen .rightbar {width:550px; text-align: left;}	
/* ----- Projektbeispiele ----- */		
.ce_rsce_projekte .inside {width:1000px;}
	
/* ----- Anschrift ----- */
.ce_rsce_kontakt .inside .rightbar {
	width:2900px!important; 
	margin-left:-550px!important;}
/* ----- Textblock // Impressum Datenschutz ----- */
.colmn--one .content-text  {padding-left:0; width:1100px;}
#footer .inside  {margin:0 auto 0 auto;width:1100px;}	
	
	
}


/* Small devices (desktop, 1300 and up) */
@media (min-width: 1300px) {
#header  {margin:0 auto 30px auto; text-align:center!improtant;}	
	.stage {height:840px;}
	.stage-txt {width:1150px;}
	.stage-txt h1{font-size: 80px; line-height: 90px;}

}

/* Small devices (desktop, 1400 and up) */
@media (min-width: 1400px) {
#header  {width:1350px; margin:0 auto 30px auto;}
.logo {margin:25px 0 0 0;}
.stage-txt {width:1150px; margin:auto auto; text-align: center!important;}
.onepage_navigation__list { margin: 25px 0 25px 0;}

}

/* Small devices (desktop, 1600 and up) */
@media (min-width: 1600px) {
#header  {width:1550px;}


	
	
}

/* Small devices (desktop, 1920 and up) */
@media (min-width: 1920px) {
	
#stage {width:1600px;}

	
	
}