/* WEB FONT */



/* SECTION - PICTURE */

.box_head 
{
	height:							300px;	
	background-position:			50% 50%;
	margin-top:						50px;
	background-image:				url(/bilder/header_tiny.jpg); /* freedom.png 20100303-koeln-028.jpg*/ 
	background-repeat:				no-repeat;
	background-size:				cover;	
}

@media screen and (min-width: 500px)
{
.box_head 
{
	height:							400px;
	margin-top:						50px;
	background-position:			50% 50%;	
	background-image:				url(/bilder/header_small.jpg);/**/ 
	background-repeat:				no-repeat;
	background-size:				cover;	
}
}


@media screen and (min-width: 700px)
{
.box_head 
{
	height:							600px;
	margin-top:						50px;
	background-position:			50% 50%;	
	background-image:				url(/bilder/header_medium.jpg);/**/
	background-repeat:				no-repeat;
	background-size:				cover;	
}
}




@media screen and (min-width: 1100px)
{
.box_head 
{
	height:							800px;
	margin-top:						50px;
	background-position:			40% gaston0%;	
	background-image:				url(/bilder/header_large.jpg);/**/
	background-repeat:				no-repeat;
	background-size:				cover;	
}
}


@media screen and (min-width: 2200px)
{
.box_head 
{
	height:							1000px;
	margin-top:						50px;
	background-position:			50% 50%;	
	background-image:				url(/bilder/header_xlarge.jpg);/**/
	background-repeat:				no-repeat;
	background-size:				cover;	
}
}




.box_head h1 
{
	font: 							normal 3.2em "Elektra";
	padding-top:					200px;
	margin-left:					auto;
	margin-right:					auto;	
	text-align: 					center;
	width:							auto;	
	color:							#fff;
	text-transform:					none;
	text-shadow: 					-1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;	
}


/* SECTION - ZITAT - QUOTATION */

.credo
{
	background: 					#6f6f6e; /**/
}

.credo h4
{
	font:							normal 1.0em "Elektra";	
	color: 							#fff; 
	padding:						40px 5% 0px 5%;		
}

.credo h5
{
	font:							normal 0.6em "Elektra";	
	color: 							#fff; 
	padding:						20px 5% 30px 5%;	
}

.service
{
	padding-top:					100px;
	padding-bottom:					100px;
/*	background: 					#fff; /**/
	background-image:				url(/bilder/background/iStock_000015584055_Large.jpg); /*whitewood.jpg*/
}

.credo2
{
	font:							normal 1.0em "Elektra";	
	background: 					#6cf; /**/
	color:							#fff;
}

.credo2 h4
{
	font:							normal 1.0em "Elektra";		
	color: 							#3d3d3d; 
	padding:						40px 5% 0px 5%;	
}

.credo2 h5
{
	font:							normal 0.6em "Elektra";		
	color: 							#3d3d3d; 
	padding:						20px 5% 30px 5%;	
}

 @media screen and (min-width: 420px)
{
	
.credo h4
{
	font:							normal 1.2em "Elektra";	
	color: 							#fff; 
	padding:						80px 5% 20px 5%;	
}	
	
.credo h5
{
	font:							normal 0.8em "Elektra";	
	color: 							#fff; 
	padding:						0px 5% 40px 5%;	
}	
		
	
.credo2 h4
{
	font:							normal 1.2em "Elektra";		
	color: 							#3d3d3d; 
	padding:						80px 5% 20px 5%;	
}

.credo2 h5
{
	font:							normal 0.8em "Elektra";		
	color: 							#3d3d3d; 
	padding:						0px 5% 40px 5%;	
}
}

.quotation
{
	background: 					#F7F7F7; /**/
}


/* SECTION - WORK */

.work
{
	background: 					#fff; /**/
	padding-top:					40px;
	padding-bottom:					60px;
}

.box_work
{
	display:						inline-block;

	position:						relative;
	float:							left;
	height:							auto;	
	width:							100%;
	margin-left:					auto;
	margin-right:					auto;	
/*	background: 					#ccc;	/**/
}

.box_work img
{
	display:						block;	
	position:						relative;
	float:							none;
	overflow:						hidden; /**/
	height:							auto;	
	width:							90px;
	margin-top:						0px;
	margin-left:					auto;
	margin-right:					auto;

}

.box_work h1
{
	padding:						20px 0px 10px 0px;
	margin-top:						0px;
}


.box_work p
{
	font: 							normal 1.0em "Elektra";	
	padding:						0px;
	text-align: 					center;
	width:							80%;
	position:						relative;
	margin-left:					auto;
	margin-right:					auto;
	padding-bottom:					20px;
	color:							#777;	
}

 @media screen and (min-width: 920px)
{
.work
{
	background: 					#fff; /**/
	padding:						0px;	
	padding-top:					40px;
	padding-bottom:					60px;
}	
	
.box_work
{
	display:						inline-block;
	position:						relative;
	float:							left;
	height:							auto;
	padding-top:					0px;
	padding-bottom:					0px;	
	width:							33.3%;	
}

.box_work img
{
	width:							100px;	
}


.box_work h1, h2
{
	font: 							normal 1.2em "Elektra";
}

.box_work p 
{
	font: 							normal 1.0em "Elektra";
	padding:						0px;
	padding-top:					0px;
	margin-left:					auto;
	margin-right:					auto;		
	text-align: 					center;
	width:							280px;		
}
}

 @media screen and (min-width: 1080px)
{

	
.box_work
{
	display:						inline-block;
	position:						relative;
	float:							left;
	height:							auto;	
	width:							33.3%;	
}

.box_work img
{
	height:							120px;	
	width:							120px;	
}

.box_work h1, h2
{
	font: 							normal 1.2em "Elektra";
}

.box_work p 
{
	font: 							normal 1.0em "Elektra";
	padding:						0px;
	margin-left:					auto;
	margin-right:					auto;	
	text-align: 					center;
	width:							340px;		
}
}


.team
{
	padding-top:					60px;		
	padding-bottom:					50px;		
	background-color: 				rgb(225, 225, 225);
}

.team_pic
{
	display:						inline-block; 	
	position: 						relative;
	float:							left;
	width:							100%; /**/
  	height:							auto;
	padding:						3% 0px 3% 0px;	
}

.team_text
{
	display:						inline-block; 	
	position: 						relative;
	float:							left;
	width:							50%; /**/
  	height:							auto;
	padding:						3% 0px 3% 0px;				
/*   	border-left: 					2px solid rgba(255,255,255,1.0);		/**/
}

.team img
{
	display:						inline-block; 
	position: 						relative;	
	float:							left;	
	padding-left:					15%;
	height:							auto;		
	width:							70%;		
}

.team_text_inner
{
	display:						inline-block; 
	position: 						relative;	
	float:							left;	
	padding:						15% 0px 15% 15%;	
	height:							auto;		
	width:							70%;	
}


.team_text_inner h1
{
	width: 							100%;
	font: 							normal 1.4em "Elektra";
	font-weight: 					600;
	text-align: 					left;
	padding: 						0px;
	padding-left: 					0px;
	color: 							#8a8989;
	text-shadow: 					0 -1px 1px #000, 0 1px 1px #FFFFFF;
	opacity: 						0.6;
}

.team p
{
	position: 						relative;
	width: 							auto;
	padding:						0;
	padding-top:					15px;
	padding-left:					5%;		
	font: 							normal 0.8em "Elektra";				
}


.gaston
{
	position: 						realtive;	
	height: 						200px;
	width:							200px;
	background-position:			40% 40%;	
	background-image:				url(/bilder/gaston.jpg);/**/
	background-repeat:				no-repeat;
	background-size:				cover;	
	background-color:				#fff;
	border-radius: 					100%;	
	margin: 						auto;
	left:							0;
	right:							0;
	top:							0;
	bottom:							100px;	
 	border: 						12px solid #fff; /*e01021*/
}

.sandrine
{
	position: 						relative;	
	height: 						200px;
	width:							200px;	
	background-position:			60% 20%;	
	background-image:				url(/bilder/sandrine.jpg);/**/
	background-repeat:				no-repeat;
	background-size:				130%;	
	background-color:				#fff;
	border-radius: 					100%;
	margin: 						auto;
	left:							0;
	right:							0;
	top:							0;
	bottom:							100px;	
 	border: 						12px solid #fff; /*e01021*/	
}


.team h1
{
	width: 							100%;
	font: 							normal 1.6em "Elektra";	
	text-align:						center;	
}

.team h3
{
	position:						relative;
	top:							10px;
	width: 							40%;
	left:							55%;
	font: 							normal 1.2em "Elektra";
	text-align:						left;			
}

.team h4
{
	position:						relative;
	width: 							40%;
	left:							55%;
	font: 							normal 1.0em "Elektra";
	text-align:						center;	
	top:							-7px;	
	text-align:						left;			
}


@media screen and (min-width: 860px)
{
	
.team_pic
{
	position: 						relative;
	float:							left;
	width:							50%; /**/
  	height:							200px;
	margin-top:						10%;
	margin-bottom:					0%;
	padding:						0px;	
	bottom:							40px;
}
	
.team img
{
	width:							100%;	
}

.gaston
{
	position: 						absolute;	
	height: 						200px;
	width:							200px;
	background-position:			40% 40%;	
	background-image:				url(/bilder/gaston.jpg);/**/
	background-repeat:				no-repeat;
	background-size:				cover;	
	background-color:				#fff;
	border-radius: 					100%;	
	margin: 						auto;
	left:							0;
	right:							0;
	top:							40px;
	bottom:							100px;	
 	border: 						12px solid #fff; /*e01021*/
}

.sandrine
{
	position: 						absolute;	
	height: 						200px;
	width:							200px;	
	background-position:			60% 20%;	
	background-image:				url(/bilder/sandrine.jpg);/**/
	background-repeat:				no-repeat;
	background-size:				130%;	
	background-color:				#fff;
	border-radius: 					100%;
	margin: 						auto;
	left:							0;
	right:							0;
	top:							40px;
	bottom:							100px;	
 	border: 						12px solid #fff; /*e01021*/	
}


.team h1
{
	width: 							100%;
	font: 							normal 1.6em "Elektra";	
	text-align:						center;	
}

.team h3
{
	position:						absolute;
	left:							0;
	top:							200px;
	width: 							100%;
	font: 							normal 1.2em "Elektra";
	text-align:						center;			
}

.team h4
{
	position:						absolute;
	top:							200px;
	left:							0;	
	width: 							100%;
	font: 							normal 1.0em "Elektra";
	text-align:						center;	
	top:							225px;	
	text-align:						center;			
}

}




@media screen and (min-width: 1024px)
{


.team_text
{
	padding:						0px 0px 0px 0px;
	margin:							0px 0px 0px 0px;
	width:							100%;
}

.team img
{
	width:							50%;	
	padding:						0px;
	padding-left:					25%;	
}

.team_text_inner
{
	display:						inline-block; 
	position: 						relative;	
	float:							left;	
	padding:						0% 0px 3% 0%;	
	height:							auto;		
	width:							100%;	
}

.gaston
{
	position: 						absolute;	
	height: 						250px;
	width:							250px;
	background-position:			40% 40%;	
	background-image:				url(/bilder/gaston.jpg);/**/
	background-repeat:				no-repeat;
	background-size:				cover;	
	background-color:				#fff;
	border-radius: 					100%;	
	margin: 						auto;
	left:							0;
	right:							0;
	top:							0;
	bottom:							100px;	
 	border: 						12px solid #fff; /*e01021*/
}

.sandrine
{
	position: 						absolute;	
	height: 						250px;
	width:							250px;	
	background-position:			60% 20%;	
	background-image:				url(/bilder/sandrine.jpg);/**/
	background-repeat:				no-repeat;
	background-size:				130%;	
	background-color:				#fff;
	border-radius: 					100%;
	margin: 						auto;
	left:							0;
	right:							0;
	top:							0;
	bottom:							100px;	
 	border: 						12px solid #fff; /*e01021*/	
}


.team h1
{
	width: 							100%;
	font: 							normal 1.6em "Elektra";	
	text-align:						center;	
}

.team h3
{
	position:						absolute;
	top:							200px;
	width: 							100%;
	font: 							normal 1.2em "Elektra";
	text-align:						center;			
}

.team h4
{
	position:						absolute;
	top:							200px;
	width: 							100%;
	font: 							normal 1.0em "Elektra";
	text-align:						center;	
	top:							225px;	
	text-align:						center;			
}


}

.image
{
	padding-top:					60px;		
	padding-bottom:					120px;		
	background-color: 				#fff;
}


.box_image_button
{
	position:						absolute;
	top:							0;
	bottom:							0;
	left:							0;
	right:							0;
	margin:							auto;
	height:							70px;
	width:							300px;	
	background-color:				#223d8d;
	border-radius: 					70px;	
    border: 						7px solid #223d8d;	/**/	
}

.box_image_button:active,
.box_image_button:active span,
.box_image_button:hover,
.box_image_button:hover span

{
	background-color:				#fff;	/**/
	color:							#6f6f6f;
/*	border: 						12px solid #e01021;	/**/	
}


.box_image_button:visited,
.box_image_button:visited span
{
	background-color:				#223d8d;	/**/
	color:							#6f6f6f;
/*	border: 						12px solid #e01021;	/**/	
}

.box_image_button a
{
	position:						absolute;
	top:							0;
	bottom:							0;
	left:							0;
	right:							0;
	margin:							auto;
	height:							100%;
	width:							100%;
	text-align:						center;
}

.box_image_button span
{
	position:						absolute;
	top:							0;
	bottom:							0;
	left:							0;
	right:							0;
	margin:							auto;
	height:							15px;
	width:							80%;
	text-align:						center;
	color:							#fff; /**/
	text-transform:					uppercase; /**/
}

.customers
{
	padding-top:					10px;
	padding-bottom:					10px;
	background: 					#eee;	/**/		
}


.box_customers
{
	display:						inline-block;
	position:						relative;
	float:							left;
	height:							70px;	
	width:							50%;
	margin-left:					auto;
	margin-right:					auto;	/**/
    border: 						0px solid rgba(0,0,0,0.1);	/**/
}

.box_customers img
{
	position:						absolute;
	height:							auto;	
	width:							70%;
	margin:							auto;	/**/
	left:							0;
	right:							0;
	top: 							0;
	bottom:							0;	
}


@media screen and (min-width: 620px)
{
.customers
{
	padding-top:					60px;
	padding-bottom:					60px;
}

.box_customers
{
	width:							50%;

}

.box_customers img
{
	position:						absolute;
	height:							100%;	
	width:							auto;
	margin:							auto;	/**/
	left:							0;
	right:							0;
	top: 							0;
	bottom:							0;	
}
}

@media screen and (min-width: 920px)
{
.box_customers
{
	width:							25%;
}
}





/* SECTION - SERVICE */

.box_service
{
	display:						inline-block;
	position:						relative;
	float:							none;
	height:							200px;	
	width:							100%;
	margin-left:					auto;
	margin-right:					auto;	
	background: 					#fff;	/**/	
	opacity:						1;
    border: 						1px solid rgba(0,0,0,0.1);
}


@media screen and (min-width: 420px)
{
.box_service
{
	position:						relative;
	float:							left;
	width:							80%;
	margin-left:					10%;
	margin-right:					10%;	
}

}




.officework
{
	padding:						0px 0px 0px 0px;		
	background-color:				#3d3d3d;
}

.officework_image,
.officework_image2
{
	display:						inline-block; 	
	position: 						relative;
	float:							left;
	width:							50%; /**/
  	height:							auto;
	padding:						0px;	
}


.officework img
{
	display:						inline-block; 
	position: 						relative;	
	float:							left;	
	height:							auto;		
	width:							100%;	
	opacity:						0.8; /*0.4*/
}

.officework_blau
{
	background:						#223d8d;
}

.officework_grau
{
	background:						#6f6f6e;
}

.officework_rot
{
	background:						#e01021;	
}

.officework img :hover
{
	opacity:						1.0;
}

.officework_show
{
	display:						inline-block;
}

.officework_hide
{
	display:						none;
}

.officework_image h1
{
	font: 							normal 1.0em "Elektra";	
	text-transform:					none;
	position: 						absolute;	
	width: 							100%;
	text-align: 					center;
	padding: 						32% 0 0 0;
	margin:							0;
	color: 							#fff;
}

.officework_image2 h1
{
	font: 							normal 1.0em "Elektra";	
	text-transform:					none;
	position: 						absolute;	
	width: 							90%;
	text-align: 					center;
	padding: 						28% 5% 0 5%;
	margin:							0;
	color: 							#fff;
	-ms-hyphens: 					auto;
	-moz-hyphens: 					auto;
	-webkit-hyphens: 				auto;
	hyphens: 						auto;	
}

@media screen and (min-width: 420px)
{
.officework_image h1
{
	font: 							normal 1.2em "Elektra";	
	padding: 						34% 0px 0px 0px;
}	
	
}

@media screen and (min-width: 460px)
{

.officework_image h1
{
	font: 							normal 1.4em "Elektra";	
	padding: 						33% 0px 0 0px;	
}

.officework_image2 h1
{
	font: 							normal 1.2em "Elektra";	
	width: 							90%;
	text-align: 					center;
	padding: 						28% 5% 0 5%;
	-ms-hyphens: 					auto;
	-moz-hyphens: 					auto;
	-webkit-hyphens: 				auto;
	hyphens: 						auto;	
}
}


@media screen and (min-width: 540px)
{
.officework_image2 h1
{
	font: 							normal 1.2em "Elektra";	
	width: 							90%;
	text-align: 					center;
	padding: 						28% 5% 0 5%;
	-ms-hyphens: 					none;
	-moz-hyphens: 					none;
	-webkit-hyphens: 				none;
	hyphens: 						none;	
}
}

@media screen and (min-width: 640px)
{
	
.officework_image,
.officework_image2
{
	width:							50%;	
}

.officework_image h1
{
	font: 							normal 1.4em "Elektra";	
	padding: 						35% 0px 0px 0px;	
}

.officework_text_inner h1
{
	width: 							100%;
	font: 							normal 1.2em "Elektra";	
	font-weight: 					600;	
}

.officework_image2 h1
{
	font: 							normal 1.2em "Elektra";	
	width: 							100%;
	text-align: 					center;
	padding: 						35% 0 0 0;
	-ms-hyphens: 					none;
	-moz-hyphens: 					none;
	-webkit-hyphens: 				none;
	hyphens: 						none;	
}
}



@media screen and (min-width: 1048px)
{
	
.officework_show
{
	display:						none;
}

.officework_hide
{
	display:						inline-block;
}	
	
.officework_image,
.officework_image2
{
	width:							25%;	
}

.officework_image h1
{
	font: 							normal 1.2em "Elektra";	
	padding: 						34% 0px 0px 0px;	
}

.officework_text_inner h1
{
	position: 						relative;	
	float:							left;
	text-align:						center;							
	width: 							33%;
	font: 							normal 1.6em "Elektra";	
	font-weight: 					600;	
}

.officework_image2 h1
{
	font: 							normal 1.2em "Elektra";	
	width: 							90%;
	text-align: 					center;
	padding: 						30% 5% 0 5%;
	-ms-hyphens: 					none;
	-moz-hyphens: 					none;
	-webkit-hyphens: 				none;
	hyphens: 						none;	
}

}




.box_service_sub
{
	position:						absolute;	
	display:						block;
	opacity:						0;
	height:							0%;
	width:							100%;
	background: 					#aaa;	/**/
}

/*
.box_service div:hover
{
	height:							100%;
	width:							100%;
	display:						block;
	opacity:						1;	
	z-index:						900;	
}
/**/

.box_service img
{
	display:						block;	
	position:						relative;
	float:							none;
	height:							auto;	
	width:							180px;
	height:							120px;
	margin-top:						10px;
	margin-left:					auto;
	margin-right:					auto;	
	background: 					rgba(255,255,255,0.0);	/*#6CF;	/**/	
}

.box_service h1
{
	padding:						0px;
	margin-top:						0px;
}

.box_service h2
{
	font: 							normal 0.8em "Elektra";	
	padding:						0px;
	position:						relative;
	text-align:						center;
	margin-top:						0px;	
}




.box_about
{
	display:						inline-block;
	position:						relative;
	float:							left;
	height:							auto;
	min-height:						100px;
	width:							100%;
	margin-left:					auto;
	margin-right:					auto;	
	padding:						0 0 0 0;
	background: 					#eee;	/**/
/*	background-image: 				url(/bilder/background/schiefer.jpg);
    background-position: 			center 20%;
    background-repeat:				no-repeat;
	background-size: 				cover; /*100% auto;/**/	
/*	-webkit-box-shadow: 		 	0px 0px 0px 0px rgba(0,0,0,0.0);
	-moz-box-shadow: 				0px 0px 0px 0px rgba(0,0,0,0.0);
	box-shadow: 					0px 0px 0px 0px rgba(0,0,0,0.0);			/**/
}

.box_about_image
{
	width:							100%;
	position:						relative;
	float:							left;
	margin:							0px 0px 0px 0px;
	background-image: 				url(/bilder/plan_sw_dark.png);
    background-position: 			center 20%;
    background-repeat:				no-repeat;
	background-size: 				cover; /*100% auto;/**/		
}

.box_about_image h1
{
	position:						relative;	
	font: 							normal 1.6em "Elektra";	
	width:							100%;
	text-align:						center;
	padding:						150px 0 0 0;
	margin:							0;
	color:							#fff;
}

.box_about_image h2
{
	position:						relative;	
	font: 							normal 1.0em "Elektra";
	text-transform:					none;	
	width:							100%;
	text-align:						center;
	padding:						0px 0 0 0;
	margin:							0;
	color:							#fff;
}

.box_about_image p
{
	position:						relative;	
	font: 							normal 1.0em "Elektra";
	text-transform:					none;	
	text-align:						center;	
	width:							80%;
	text-align:						center;
	padding:						20px 0 40px 10%;
	margin:							0;
	color:							#fff;		/*#a2a2a2;/**/

/*	padding:						60px 0px 60px 0px;	 /* oben, rechts, unten, links /**/
}

.box_about_social
{
	position:						relative;
	float:							none;	
	width:							180px;
	height:							50px;
	margin:							20px auto 110px auto;
}

.box_about_social_facebook
{
	background-image: 				url(/bilder/icons/icon_facebook_hollow.png);
    background-position: 			center center;
    background-repeat:				no-repeat;
	background-size: 				cover; 
	position:						relative;
	float:							left;	
	width:							50px;
	height:							50px;
	margin:							0;
}

.box_about_social_facebook:hover
{
	background-image: 				url(/bilder/icons/icon_facebook_hollow_activ.png);
}

.box_about_social_xing
{
	background-image: 				url(/bilder/icons/icon_xing_hollow.png);
    background-position: 			center center;
    background-repeat:				no-repeat;
	background-size: 				cover; 
	position:						relative;
	float:							left;	
	width:							50px;
	height:							50px;
	margin: 						0 0 0 15px;
}

.box_about_social_xing:hover
{
	background-image: 				url(/bilder/icons/icon_xing_hollow_activ.png);
}

.box_about_social_linkedin
{
	background-image: 				url(/bilder/icons/icon_linkedin_hollow.png);
    background-position: 			center center;
    background-repeat:				no-repeat;
	background-size: 				cover; 
	position:						relative;
	float:							left;	
	width:							50px;
	height:							50px;
	margin:							0 0 0 15px;
}

.box_about_social_linkedin:hover
{
	background-image: 				url(/bilder/icons/icon_linkedin_hollow_activ.png);
}


.box_about_textblock
{
	position:						relative;
	float:							left;		
	width:							100%;
	height:							auto;
	background: 					#6f6f6f;	/**/	
}


.box_about_textblock h1
{
	position:						relative;
	float:							left;	
	font: 							normal 1.4em "Elektra";	
	width:							100%;
	text-align:						center;
	padding:						40px 0 0px 0;
	margin:							0;
	color:							#fff;	
}

.box_about_textblock p
{
	position:						relative;	
	float:							left;
	font: 							normal 1.0em "Elektra";
	text-transform:					none;	
	text-align:						center;	
	width:							80%;
	text-align:						center;
	padding:						30px 0 60px 10%;
	margin:							0;
	color:							#fff;		/*#a2a2a2;/**/
	background:						#6f6f6f;
/*	padding:						60px 0px 60px 0px;	 /* oben, rechts, unten, links /**/
	line-height:					1.2;
}


@media screen and (min-width: 800px)
{
	
.box_about
{
/*	background: 					#202020;	/**/	
}
	
.box_about_image
{
	width:							50%;
	position:						relative;
	float:							left;
	height:							500px;	
	margin:							0px 0px 0px 0px;
	background-image: 				url(/bilder/plan_sw_dark.png);
    background-position: 			center 30%;
    background-repeat:				no-repeat;
	background-size: 				cover; /*100% auto;/**/		
}
	
.box_about_image h1
{
	padding:						35% 0 0 0;
}

.box_about_textblock
{
	position:						relative;
	float:							left;		
	width:							50%;
	height:							500px;
	background: 					#6f6f6f;	/**/	
}

.box_about_textblock h1
{
	padding:						22% 0 0px 0%;
	text-align:						center;		
}
	

}

@media screen and (min-width: 1250px)
{
	
.box_about
{
	padding:						100px 0 100px 0;			
}
	
.box_about_textblock h1 
{
	float:							left;
	width:							80%;
	padding:						22% 0% 0px 10%;
	text-align:						left;		
}

.box_about_textblock p
{
	float:							left;
	text-align:						left;
	width:							80%;	
	padding:						20px 10% 70px 10%;	
}		
}



.buero
{
	width: 							100%;
	padding:						0px 0px 0px 0px;	
}

.box_buero_text
{
	position:						relative;
	float:							left;
	width: 							100%;
	padding:						0px 0px 0px 0px;
/*	background-color: 				#ccc;	/**/
}

.box_buero_text h1
{
	font: 							normal 1.4em "Elektra";	
	text-align:						center;
	padding-left:					0;
	padding-top:					60px;
	padding-bottom:					0px;
	margin-bottom:					0px;	
}

.box_buero_text h2
{
	font: 							normal 1.1em "Elektra";	
	text-align:						center;
	padding-left:					5%;
	padding-top:					0px;
	margin-top:						0px;
	padding-bottom:					0px;
}

.box_buero_image
{
	position:						relative;
	float:							right;
	width: 							100%;
	padding-top:					0px;
	padding-right:					0%;
/*	background-color: 				#666;	/**/
}

.box_buero_sentence
{
	position:						relative;
	float:							left;
	width: 							90%;
	padding-right:					5%;
	padding-left:					5%;	
	padding-top:					20px;
	padding-bottom:					0px;	
	line-height: 					1.5;		
}

.box_buero_sentence p
{	
	line-height: 					1.5;		
}

.box_buero_image img
{
	position:						relative;
	float:							right;
	width: 							100%;
	height:							100%;
	margin-top:						20px;
	padding-right:					5%;

  border: 10px solid #000;  
  overflow: hidden;
  
/*  -webkit-box-shadow: 5px 5px 5px #111;
          box-shadow: 5px 5px 5px #111; 	/**/
}


@media screen and (min-width: 620px)
{
.box_berlonia_text h1
{
	font: 							normal 1.4em "Elektra";	
	text-align:						left;
}
}

@media screen and (min-width: 990px)
{
.box_buero_text
{
	position:						relative;
	float:							left;
	width: 							100%;
	padding:						0px 0px 40px 0px;
/*	background-color: 				#ccc;	/**/
}

.box_buero_image
{
	position:						relative;
	float:							left;
	width: 							0%;
}

.box_buero_image img
{
	position:						relative;
	float:							right;
	width: 							100%;
	max-width:						350px;
	padding-top:					220px;
	padding-right:					10%;
}

}


/* SECTION - USP */
/*
@media screen and (min-width: 320px)
{

.box_usp img
{
	display:						inline-block;
	position:						relative;
	float:							left;
	margin-top:						20px;
	margin-left:					auto;
	margin-right:					auto;
	width:							100%;
}

.box_usp h1
{
	display:						block;
	position:						absolute;
	text-align:						right;
	font: 							normal 0.8em "Elektra";	
	margin:							40px 0px 0px 0px;
}

.box_usp div
{
	width:							auto;
	position:						relative;
	float:							left;
	margin-left:					auto;
	margin-right:					auto;
}
}/**/

.box_usp
{
	display:						inline-block;
	position:						relative;
	float:							left;
	height:							auto;	
	width:							100%;
	margin-left:					auto;
	margin-right:					auto;	
	background: 					#fff;	/**/	
  	/*border: 						1px solid rgba(0,0,0,0.1);	
	-webkit-box-shadow: 			inset 0px 0px 100px -13px rgba(98,107,127,0.52);
	-moz-box-shadow: 				inset 0px 0px 100px -13px rgba(98,107,127,0.52);
	box-shadow: 					inset 0px 0px 100px -13px rgba(98,107,127,0.52);	/**/
}

.box_usp_text_color {
	color: #fe00f5;
}

.box_usp img
{
	display:						inline-block;
	position:						relative;
	float:							none;
	margin-top:						20px;
	margin-bottom:					0px;
	margin-left:					2%;
	margin-right:					2%;
	width:							96%;
}


.box_usp_pic
{
	display:						inline-block;	
	width:							100%;
	position:						relative;
	float:							left;
	margin-top:						20px;
	margin-left:					auto;
	margin-right:					auto;
}




.box_usp_text
{
	display:						inline-block;	
	width:							100%;
	position:						relative;
	float:							left;
	margin:							0px 0px 20px 0px;
}

.box_usp h1
{
	display:						block;
	position:						relative;	
	font: 							normal 1.2em "Elektra";	
	color:							#3d3d3d;
	width:							30%;
	padding:						0px;
	text-align:						left;
	margin:							0;
	margin-top:						0px;
	margin-bottom:					20px;
	margin-left:					10%;
/*	padding:						60px 0px 60px 0px;	 /* oben, rechts, unten, links /**/
}

.box_usp p
{
	padding:						0px;
	text-align: 					block;
	position:						relative;
	margin-left:					10%;
	margin-right:					10%;
	padding-bottom:					40px;
	color:							#777;	
}


/* SECTION - SOLUTIONS */

.box_solutions
{
	display:						inline-block;
	position:						relative;
	float:							left;
	height:							auto;
	min-height:						100px;
	width:							100%;
	margin-left:					auto;
	margin-right:					auto;	
	background: 					#fff;	/**/	
/*  border: 						1px solid rgba(0,0,0,0.1);	
	-webkit-box-shadow: 			inset 0px 0px 250px -13px rgba(98,107,127,0.52);
	-moz-box-shadow: 				inset 0px 0px 250px -13px rgba(98,107,127,0.52);
	box-shadow: 					inset 0px 0px 250px -13px rgba(98,107,127,0.52);	/**/
	background-image: 				url(/bilder/background/schiefer.jpg);
    background-position: 			center center;
    background-repeat:				no-repeat;
	background-size: 				cover; /*100% auto;/**/
}

.box_solutions img
{
	display:						inline-block;
	position:						relative;
	float:							right;
	width:							100%;
	margin:					   		0px auto 0px 0px;
	padding:						0px 0 0px 0px;	 /* oben, rechts, unten, links /**/	
}

.box_solutions_pic
{
	width:							100%;
	position:						relative;
	float:							left;
	margin:							0px;
	padding:						0px 0px 20px 0px;	
/*	background-color:				#0C6; /**/
/*    border: 						4px dashed rgba(0,0,0,0.1);	 /**/
}

.box_solutions_text
{
	width:							100%;
	position:						relative;
	float:							left;
	margin:							0px;
/*	background-color:				#0C6; /**/
/*    border: 						4px dashed rgba(0,0,0,0.1);	 /**/
}

.box_solutions h1
{
	display:						block;
	position:						relative;	
	font: 							normal 1.2em "Elektra";	
	color:							#66ffff;
	width:							80%;
	padding:						0px;
	text-align:						left;
	margin:							0;
	padding:						60px 0px 0px 10%;	 /* oben, rechts, unten, links /**/
}

.box_solutions h2
{
	font: 							normal 1.2em "Elektra";	
	color:							#fff;	
	width:							80%;
	padding:						0px;
	text-align:						left;
	margin:							0;
	padding:						0px 0px 0px 10%;	 /* oben, rechts, unten, links /**/
}

@media screen and (min-width: 640px)
{
.box_solutions_pic
{
	width:							65%;
	position:						relative;
	float:							left;
	margin:							0px;
	padding:						0px 0px 20px 0px;	
/*	background-color:				#0C6; /**/
/*    border: 						4px dashed rgba(0,0,0,0.1);	 /**/
}

.box_solutions_text
{
	width:							35%;
	position:						relative;
	float:							left;
	margin:							0px;
	padding:						0px;
/*	background-color:				#0C6; /**/
/*    border: 						4px dashed rgba(0,0,0,0.1);	 /**/
}

.box_solutions h1
{
	font: 							normal 1.0em "Elektra";	
	width:							75%;
	margin-top:						45px;
	margin:							0px;
	padding:						33% 0 0 25%;	
}

.box_solutions h2
{
	font: 							normal 1.0em "Elektra";	
	width:							75%;
	margin:							0px;
	padding:						0px 0 0 25%;	
}

.box_solutions img
{
	display:						inline-block;
	position:						relative;
	float:							right;
	width:							70%;
	max-width:						450px;	
	margin:					   		0px;
	padding:						0px 15% 0px 0px;	 /* oben, rechts, unten, links /**/	
}


}


@media screen and (min-width: 920px)
{

.box_solutions h1
{
	font: 							normal 1.2em "Elektra";	
}
.box_solutions h2
{
	font: 							normal 1.2em "Elektra";	
}
}

@media screen and (min-width: 1170px)
{

.box_solutions h1
{
	font: 							normal 1.2em "Elektra";	
	padding:						120px 0 0 45%;	
}
.box_solutions h2
{
	font: 							normal 1.2em "Elektra";	
	padding:						0px 0 0 45%;	
}
}




/* SECTION - WORLD */
.box_world
{
	display:						inline-block;
	position:						relative;
	height:							auto;
	min-height:						180px;		
	width:							100%;
	margin-left:					auto;
	margin-right:					auto;
}

.box_world div
{
	position:						relative;	
	height:							100%;
	min-height:						auto;
	width:							100%;
	background-color:				#fff;		
}

.box_world img
{
	width:							100%;
	height:							auto;
	position:						relative;
	float:							none;
	height:							auto;	
	margin-top:						5%;
	margin-bottom:					5%;
	margin-left:					auto;
	margin-right:					auto;
	z-index:						0;
}

.box_world h1
{
	font: 							normal 1.4em "Elektra";	
	position:						absolute;
	z-index:						10;
	width:							100%;
	color:							#3d3d3d;
	padding:						0px;
	padding-top:					14%;
	margin-top:						5%;
	margin-bottom:					5%;	
/*	background-color:				#999; /**/
	text-align:						center;					
}



/* SECTION - SKILLS */
.skills
{
	width: 							100%;
	padding:						0px 0px 40px 0px;
	background-color: 				#F9F9F9;
}

.box_skills
{	
	position:						relative;
	float:							left;
	width:							100%;
	padding:						20px 0px 20px 0px;		
/*	background-color:				#333; /**/
}

.box_skills_text
{
	position:						relative;
	float:							left;
	width:							100%;	
}

.skills h1
{
	font: 							normal 1.4em "Elektra";	
}

.skills h2
{
	position:						relative;
	float:							left;
	width:							150px;
	font: 							normal 0.8em "Elektra";	
	padding:						0px;
	padding-left:					10%;
	padding-bottom:					5px;
	text-align:						left;
}

.box_skills_bar
{
	position:						relative;
	float:							left;	
	width: 							80%;
	height:							20px;	
	padding-left:					10%;
/*	background-color:				#eee; /**/
}

@media screen and (min-width: 640px)
{
.box_skills
{	
	position:						relative;
	float:							left;
	width:							100%;
/*	background-color:				#333; /**/
}

.box_skills_text
{
	position:						relative;
	float:							left;
	width:							100%;	
}

.skills h1
{
	font: 							normal 1.4em "Elektra";	
}

.skills h2
{
	position:						relative;
	float:							left;
	width:							150px;
	font: 							normal 0.8em "Elektra";	
	padding:						0px;
	padding-left:					10%;
	padding-bottom:					10px;
	text-align:						left;
}


.box_skills_bar
{
	position:						relative;
	float:							left;	
	width: 							80%;
	height:							25px;	
	padding-left:					10%;
/*	background-color:				#eee; /**/
}

}




@media screen and (min-width: 880px)
{

.skills h1
{
	font: 							normal 1.4em "Elektra";	
}

.skills h2
{
	position:						relative;
	float:							left;
	width:							200px;
	font: 							normal 1.0em "Elektra";	
	padding:						0px;
	padding-left:					10px;
	padding-bottom:					20px;
}

.box_skills_text
{
	position:						relative;
	float:							left;
	width:							15%;	
}

.box_skills_bar
{
	position:						relative;
	float:							left;	
	width: 							65%;
	height:							25px;	
	padding-left:					10%;
/*	background-color:				#eee; /**/
}

}


.box_skills_01, .box_skills_02, .box_skills_03, .box_skills_04, .box_skills_05, .box_skills_06, .box_skills_07
{
	position:						relative;
	float:							left;	
	height:							100%;	
}


.box_skills_01
{
	width: 							98%;
	background-color: 				#555;
}

.box_skills_02
{
	width: 							92%;
	background-color: 				#666;
}

.box_skills_03
{
	width: 							89%;
	background-color: 				#777;
}

.box_skills_04
{
	width: 							87%;
	background-color: 				#888;
}

.box_skills_05
{
	width: 							94%;
	background-color: 				#999;
}

.box_skills_06
{
	width: 							92%;
	background-color: 				#aaa;
}

.box_skills_07
{
	width: 							90%;
	background-color: 				#bbb;
}




/* SECTION - LIVINGVISIONS */

.livingvisions
{
	width: 							100%;
	padding:						0px 0px 40px 0px;
	background: 					-moz-linear-gradient(45deg, #ddd 0%, #ffffff 100%);
	background: 					-webkit-gradient(linear, left bottom, right top, color-stop(0%,#ddd), color-stop(100%,#ffffff));
	background: 					-webkit-linear-gradient(45deg, #ddd 0%,#ffffff 100%);
	background: 					-o-linear-gradient(45deg, #ddd 0%,#ffffff 100%);
	background: 					-ms-linear-gradient(45deg, #ddd 0%,#ffffff 100%);
	background: 					linear-gradient(45deg, #ddd 0%,#ffffff 100%);	
}


.box_livingvisions_text
{
	position:						relative;
	float:							left;
	width: 							100%;
	padding-right:					0%;
/*	background-color: 				#ccc;	/**/
}


.box_livingvisions_text p
{
	padding:						0px 0px 60px 0px;
}


.box_livingvisions_text h1
{
	font: 							normal 1.4em "Elektra";	
	text-align:						center;
	padding-top:					60px;
	padding-bottom:					0px;
}


@media screen and (min-width: 620px)
{
.box_livingvisions_text h1
{
	font: 							normal 1.4em "Elektra";	
	text-align:						center;
}
}



.box_livingvisions_button
{
	padding:						140px 0px 0px 0%;	
}

h6
{
	text-align:						center;	
}

.box_livingvisions_button a
{
	color:							#fff;	
}

.myButton 
{	
	background-color:				#f6b162;
}

.myButton:hover 
{
	background-color:				#54cefc;
}


.box_livingvisions_image
{
	position:						relative;
	float:							right;
	width: 							100%;
	padding-right:					0%;
	padding-top:					20px;	
/*	background-color: 				#666;	/**/
}


.box_livingvisions_sentence
{
	position:						relative;
	float:							left;
	width: 							80%;
	padding-right:					10%;
	padding-left:					10%;	
	padding-top:					20px;
	padding-bottom:					0%;		
}

.box_livingvisions_image img
{
	position:						relative;
	float:							right;
	width: 							50%;
	margin-top:						20px;
	padding-right:					5%;
}

@media screen and (min-width: 880px)
{

.box_livingvisions_text h1
{
	font: 							normal 1.4em "Elektra";	
	text-align:						left;
	padding-left:					10%;	
}	
	
.box_livingvisions_text
{
	position:						relative;
	float:							left;
	width: 							60%;
	padding-right:					0%;
/*	background-color: 				#ccc;	/**/
}

.box_livingvisions_list
{
	position:						relative;
	float:							left;
	width: 							100%;
	padding-left:					5%;		
	padding-top:					40px;
}

.box_livingvisions_image
{
	position:						relative;
	float:							left;
	width: 							40%;
}

.box_livingvisions_image img
{
	position:						relative;
	float:							right;
	width: 							80%;
	max-width:						350px;
	padding-top:					10%;
	padding-right:					10%;
}


.box_livingvisions_button
{
	padding:						150px 0px 0px 10%;	
}

h6
{
	text-align:						left;	
}

}


/* SECTION - CONTACT */


.contact
{
	width: 							100%;
	height:							auto;
	padding: 						0px;
	margin:							0px;
	background-color: 				#fff; /*#F9F9F9;/**/
	opacity:						1.0;
	padding-top:					70px;
	padding-bottom:					40px;
}

.box_contact_text
{
	position:						relative;
	float:							left;
	width: 							100%;
	padding-right:					0%;
/*	background-color: 				#ccc;	/**/
}

.box_contact_text h1
{
	font: 							normal 1.4em "Elektra";	
	color:							#000;
	text-align:						center;
	padding-left:					10%;
	padding-top:					0px;
}

@media screen and (min-width: 620px)
{
.box_contact_text h1
{
	font: 							normal 1.4em "Elektra";	
	text-align:						center;
}
}

.box_contact_image
{
	position:						relative;
	float:							right;
	width: 							100%;
	padding-right:					0%;
/*	background-color: 				#666;	/**/
}


.box_contact_sentence
{
	position:						relative;
	float:							left;
	width: 							80%;
	padding-right:					10%;
	padding-left:					10%;	
	padding-top:					20px;
	padding-bottom:					0%;		
}


.box_contact_image img
{
	position:						relative;
	float:							right;
	width: 							80%;
	margin-top:						20px;
	padding-right:					5%;
}

@media screen and (min-width: 880px)
{
.contact
{
	padding-top:					0px;
	padding-bottom:					20px;
}	
	
	
.box_contact_text
{
	position:						relative;
	float:							left;
	width: 							50%;
	padding-right:					0%;
/*	background-color: 				#ccc;	/**/
}

.box_contact_text h1
{
	font: 							normal 1.4em "Elektra";	
	text-align:						left;
	padding-top:					80px;
	padding-left:					25%;
	color:							#3d3d3d;
}

.box_contact_image
{
	position:						relative;
	float:							left;
	width: 							50%;
}

.box_contact_image img
{
	position:						relative;
	float:							left;
	width: 							100%;
	max-width:						450px;
	padding-top:					10%;
	padding-right:					0%;
}

}







.box_usp
{
	display:						inline-block;
	position:						relative;
	float:							left;
	height:							auto;	
	width:							100%;
	margin-left:					auto;
	margin-right:					auto;	
/*	background: 					#fff;	/**/	
/*  border: 						1px solid rgba(0,0,0,0.1);	
	-webkit-box-shadow: 			inset 0px 0px 250px -13px rgba(0,0,0,0.52);
	-moz-box-shadow: 				inset 0px 0px 250px -13px rgba(0,0,0,0.52);
	box-shadow: 					inset 0px 0px 250px -13px rgba(0,0,0,0.52);/**/
}

.box_usp img
{
	display:						inline-block;
	position:						relative;
	float:							left;
	width:							70%;
	margin:					   		30px 15% 0px 15%;
/*  padding:						0px 0px 0px 5px;	 /* oben, rechts, unten, links /**/	
}


.box_world h1
{
	font: 							normal 1.4em "Elektra";	
}

.box_world div
{
	width:							100%;
	position:						relative;
	float:							none;
	margin-left:					auto;
	margin-right:					auto;
}


.box_world img
{
	width:							100%;
	position:						relative;
	float:							none;
	height:							auto;	
	margin-left:					auto;
	margin-right:					auto;
}


.box_usp h1
{
	font: 							normal 1.4em "Elektra";	
}

}



 @media screen and (min-width: 1080px)
{

.box_service
{
	display:						inline-block;
	position:						relative;
	float:							left;
	height:							220px;	
	width:							24.8%;
/*	margin-left:					auto;
	margin-right:					auto;	/**/
	background: 					#fff;	/**/	
    border: 						1px solid rgba(0,0,0,0.1);	/**/
}


.box_usp
{
	display:						inline-block;
	position:						relative;
	float:							left;
	height:							auto;	
	width:							100%;
	margin-left:					auto;
	margin-right:					auto;	
/*	background: 					#fff;	/**/	
/*  border: 						1px solid rgba(0,0,0,0.1);	
	-webkit-box-shadow: 			inset 0px 0px 250px -13px rgba(0,0,0,0.52);
	-moz-box-shadow: 				inset 0px 0px 250px -13px rgba(0,0,0,0.52);
	box-shadow: 					inset 0px 0px 250px -13px rgba(0,0,0,0.52); /**/
}

.box_usp img
{
	display:						inline-block;
	position:						relative;
	float:							right;
	width:							80%;
	margin:					   		30px 10% 30px 10%;
	padding:						0px 0px 0px 0px;	 /* oben, rechts, unten, links /**/	
}

.box_usp_pic
{
	width:							70%;
	display:						inline-block;
	position:						relative;
	float:							right;
	margin:							0px;
/*	background-color:				#0C6; /**/
/*    border: 						0px dashed rgba(0,0,0,0.1);	
/*	background:						#6cf; /**/
}

.box_usp_text
{
	width:							30%;
	display:						inline-block;
	position:						relative;
	float:							right;
	margin:							0px;
/*	background-color:				#0C6; /**/
/*    border: 						0px dashed rgba(0,0,0,0.1);	
/*	background:						#6cf; /**/
}


.box_usp h1
{
	display:						block;
	position:						relative;	
	font: 							normal 1.4em "Elektra";	
	width:							100%;
	padding:						0px;
	text-align:						left;
	padding-top:					0px;
	margin:							180px 0px 0px 40% ;
/*	padding:						60px 0px 60px 0px;	 /* oben, rechts, unten, links /**/
}

.box_usp p
{
	padding:						0px;
	text-align: 					block;
	width:							60%;
	position:						relative;
	padding-top:					0px;
	margin-left:					auto;
	margin-right:					auto;
	padding-bottom:					40px;
	color:							#777;	
}


.box_world div
{
	width:							100%;
	height:							100%;
	display:						inline-block;
	position:						relative;
	float:							none;
	margin-left:					auto;
	margin-right:					auto;
/*	background-color:				#0C6; /**/
/*    border: 						0px dashed rgba(0,0,0,0.1);	/**/
/*	background:						#6cf; /**/
}



}