html, body{
	font-family:"fontregular";
	margin: 0px;
	padding: 0px;
	color:#000;
	font-weight:normal;
	font-size:18px;	
	line-height:24px;
	letter-spacing:0.025em;
}
body{
	background:none;	
}
#equipologo{
	cursor:pointer;
	padding: 10px 0px 0px 10px;
}
#equipologokurz{
	cursor:pointer;
	padding: 10px 0px 0px 10px;
}
#equipologospecial{
	cursor:pointer;
	padding: 10px 10px 0px 10px;
}
#equipologobereich{
	font-family:"fontitalic";
	font-size: 27px;
    padding: 16px 20px 0px 0px;
	cursor: pointer;
	/*background:rgba(0,200,0,0.2);*/
}
#container{
	margin:0px;
	padding:0px;
}
#content {
	position:relative;
	top:0px;
	padding:54px 20px 40px 20px;
}		
.centerbox {
	max-width:1024px;
	margin:0px auto 0px auto; 	
}
.box {
	display:inline-block;
	width:285px;
	margin:0px 18px 50px 20px;
	vertical-align:top;
}
.clear{
	clear:both;	
}
.nolineheight{
	line-height:0px;	
}
.textblock{
	width:10px;
	margin:0px 0px 0px 0px;
	overflow:visible;
	line-height:10px;	
	z-index:600;
}
#tool_legende{
	font-family:"fontitalic";
	position:fixed;
	display:block;
	float:right;
	width:auto;
	background:#000000;
	color:#FFFFFF;
	bottom:0px;
	right:0px;
	padding:3px 25px 3px 6px;
	opacity:0.0;
	z-index:10;
}
h1 {
	font-family:"fontitalic";
	display:inline-block;
	background:#000;
	color:#FFFFFF;	
	font-size:36px;
	line-height:40px;
	/* letter-spacing:0.02em; */
	letter-spacing:0.04em;
	padding:7px 30px 5px 10px;
	white-space: nowrap;
}
h2 {
	font-family:"fontitalic";
	display:inline-block;
	background:#000;
	color:#FFFFFF;	
	font-size:24px;
	line-height:36px;
	/* letter-spacing:0.02em; */
	letter-spacing:0.04em;
	padding:1px 30px 0px 8px;
	white-space: nowrap;
}
h3 {
	font-family:"fontitalic";
	display:inline-block;
	background:#000;
	color:#FFFFFF;	
	line-height:24px;
	padding:2px 30px 1px 8px;
	white-space: nowrap;
	/* letter-spacing:0.03em; */
	letter-spacing:0.06em;
}
.secure_at{
	width:16px;	
	vertical-align:middle;
}
.mail_icon{
	width:20px;	
	vertical-align:middle;
	margin-right:6px;
}
.white_big{
	display:inline-block;
	width:auto;
	background:#fff;
	color:#000;	
	font-size:24px;
	line-height:30px;
	letter-spacing:0.02em;
	padding:0px 30px 1px 8px;	
	white-space: nowrap;
}
.white{
	display:inline-block;
	width:auto;
	background:#fff;
	color:#000;	
	line-height:24px;
	padding:0px 30px 0px 8px;	
	white-space: nowrap;
	/*-webkit-box-shadow: 3px 5px 10px 0px rgba(0,0,0,0.05);
	-moz-box-shadow:3px 5px 10px 0px rgba(0,0,0,0.05);
	box-shadow: 3px 5px 10px 0px rgba(0,0,0,0.05);*/
}
.black{
	display:inline-block;
	width:auto;
	background:#000;
	color:#fff;	
	line-height:24px;
	padding:0px 30px 0px 8px;	
	white-space: nowrap;
}
.firstspace{
	padding:3px 30px 0px 8px;
}
.whitespace{
	padding:0px;
	display:block;
	width:12px;
	height:12px;
}
p {
	margin-left:2px;
	margin-bottom:20px;
	padding-right:5px;
}
a {
	color:#000;
	text-decoration:none;
}
#legende{
	position:fixed;
	display:none;
	left:0px;
	top:0px;
	width:auto;
	background:#FFFFFF;
	font-size:16px;	
	line-height:16px;
	padding:4px 30px 4px 6px;
	-webkit-box-shadow: 2px 2px 8px 0px rgba(20,20,20,0.3);
	-moz-box-shadow: 2px 2px 8px 0px rgba(20,20,20,0.3);
	box-shadow: 2px 2px 8px 0px rgba(20,20,20,0.3);
	white-space: nowrap;
	z-index:900;
}
#kunden{
	line-height:10px;	
	max-width:1200px;
	margin:0px auto 0px auto;
	padding-left:45px;
}
.kunde{
	display:inline-block;
	width:19%;
	max-width:230px;
	margin:0px 2px 2px 0px;	
	padding:0px;
	transition:all 200ms linear;
}
.kunde img{
	width:100%;
	height:auto;
	margin:0px;
	padding:0px;
	opacity:0.0;
}
.underlay{
	position:relative;
}
.overlay{
	display:block;
	position:absolute;
	top:0px;
	left:0px;
	background:#ffffff;
	width:100%;
	height:100%;	
	opacity:0.0;
}
#jmap{
	float:left;
	position:relative;
	left: 0px;
	top: 0px;
	width: 450px;
	height: 450px;
	overflow: hidden;
	z-index: 1;
	transform-origin:left top;
	transition:transform 300ms ease-in-out;
	opacity:0.0;
}
area:active, area:focus {
    outline: none;
}
.tram{
	position: absolute;
	left: 0px;
	top: 500px;
	z-index: 60;
}
#jmap_canvas{
	position:absolute; 
	top:0px; 
	left:0px; 
	z-index:50;
}
#jmap_bg { 
   position:absolute; 
   z-index:10;
}
#jmap_transparent{
	position:absolute; 
	top:0px; 
	left:0px; 
	z-index:100;
}
#jmap_mobile_fixtext{
	position:absolute;
	left:229px;
	top:155px;
	background:#fff;
	padding:7px 35px 5px 7px;
	font-size:14px;
	line-height:14px;
	letter-spacing:0.03em;
	white-space:nowrap;
	visibility:visible;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
	z-index:105;
}
#kontakt{
	max-width:900px;
	margin:0px auto 0px auto;
}		
#kontakt_block{
	float:left;
	width:10px;
	margin:285px 200px 20px 30px;
	overflow:visible;
	opacity:0.0;
}
#equipo{
	max-width:870px;
	margin:0px auto 0px auto;
	padding-left:4px;
	/*background:rgba(0,100,200,0.3);*/
}	
.equipo_themen_block{
	float:left;
	display:inline-block;
	width:31%;
	margin:0px 2% 20px 0px;
	line-height:10px;
	/*background:rgba(200,100,200,0.5);*/
}
.equipo_themen_img {
	width:100%;
	height:auto;	
	margin:0px;
	/*-webkit-box-shadow: 3px 5px 10px 0px rgba(0,0,0,0.15);
	-moz-box-shadow:3px 5px 10px 0px rgba(0,0,0,0.15);
	box-shadow: 3px 5px 10px 0px rgba(0,0,0,0.15);*/
}
#equipo_block1{display:block; margin-bottom:50px;}
#equipo_block1_mobile{display:none; margin-bottom:50px;}
#equipo_unterricht{display:block; margin-top:15px;}
#equipo_unterricht_mobile{display:none; margin-top:15px;}

.email{
	/*padding-top:12px;	*/
}
.italic{
	font-family:"fontitalic";	
}
.einzug{
	padding-left:22px;	
}
/* Projekt Detailseiten */
.thema{
	height:100%;
	padding:0px;
	margin:0px 25px 0px 25px;
	line-height:0px;
}
#xprojekte{
	/* Stufe 1: Gesamter Block */
	margin:0px auto 0px auto;
	/*background:rgba(200,0,0,0.3);*/
}
.xp_holder{
	/* Stufe 2: Spaltenbreite Flattersatz */
	width:auto;
	max-width:600px;
	padding:0px;
	margin:2px 0px 0px 0px;
	/*background:rgba(0,200,0,0.3);*/
}
#borderleft{
	position:absolute;
	left:0px;
	top:0px;
	background:#FFF;
	height:100%;
	width:25px;	
	z-index:10;
}
#borderright{
	position:absolute;
	right:0px;
	top:0px;
	background:#FFF;
	height:100%;
	width:25px;	
	z-index:10;
}
#borderbottom{
	position:absolute;
	left:0px;
	bottom:0px;
	background:#FFF;
	height:0px;
	width:100%;	
	z-index:10;
}
.bordertransition{
	transition:all 1000ms ease-in-out;	
}
#th_overlay{
	position:absolute;
	left:0px;
	top:51px;
	z-index:35;	
}
#th_titel{
	margin:1px 0px 20px 0px;
	/* CURSOR */
	cursor:pointer;
}
.th_titel_small{
	margin:1px 0px 0px 0px;
	cursor:pointer;
}
.th_legende{
	position:absolute;
	background:#FFF;
	right:25px;
	bottom:21px;
	font-size:15px;
	transform: translateY(2px);
    padding: 2px 0px 2px 6px;
	z-index:15;
	text-align:left;
	line-height:21px;
	display:none;
	max-width:80%;
	opacity:0.0;
	flex-direction:row;
}
.shiftin{
	padding-left:30px;	
}
.detail_dot{
	display:inline-block; 
	margin-right:11px;
	width:8px; 
	height:8px; 
	background:#fff; 
	cursor:pointer; 
	border:#000 1px solid;	
}
#th_titel_mobile{
	background:#fff;
	cursor:default;
	width:100%;
	padding:20px 0px 20px 0px;
	display:none;
}
#shifter{
	background:#fff;
	display:none;
	height:0px;	
}
.bereich_titelzusatz_neu{
}


/* ---------- Responsive ---------- */
@media (max-width: 1020px) {
	.kunde{
		width:24.5%;
	}
	.box {
		width:44%;
		margin:0px 15px 40px 15px;
	}
	#kunden{
		margin:0px auto 0px 8px;
		padding-left:0px;
	}
}
@media (max-width: 930px) {
	.equipo_themen_block{
		width:48%;
		margin:0px 2% 20px 0px;
	}
}

@media (max-width: 800px) {
	.kunde{
		width:32.5%;
	}
	#kunden{
		margin:0px auto 0px 6px;
	}
	/* Kein grosser Text mehr */
	.white_big{
		font-size:18px;
		line-height:24px;
		letter-spacing:0.0em;
		padding:0px 30px 0px 8px;	
	}
	h2 {
		font-size:18px;
		line-height:24px;
		letter-spacing:0.02em;
		padding:2px 30px 1px 8px;

	}
}
@media (max-width: 760px) {
	#kontakt_block{
		clear:both;
		margin:30px 200px 20px 0px;
	}
	#content {
		padding:40px 15px 40px 15px;
	}	
	.box {
		display:block;
		margin:0px 10px 40px 10px;
		width:auto;
		min-width:240px;
	}
	.equipo_themen_block{
		display:block;
		width:100%;
		max-width:357px;
		margin:0px 0px 40px 0px;
	}
}
@media (max-width: 600px) {
	#equipo_block1{display:none;}
	#equipo_block1_mobile{display:block;}
	#equipo_unterricht{display:none;}
	#equipo_unterricht_mobile{display:block;}
}
@media (max-width: 510px) {
	.kunde{
		width:49%;
		min-width:50px;
	}
	#kunden{
		margin:0px auto 0px 2px;
	}
	#jmap{
		top:185px;
		transform-origin:left top;
		transform:scale(0.7);
		margin-bottom:100px;
	}
	#kontakt_block{
		transition:all 300mx ease-in-out;
		position:absolute;
		top:0px;
	}
}
@media (max-width: 325px) {
	#jmap{
		transform:scale(0.5);
	}
}
@media (max-width: 300px) {
	.kunde{
		max-width:300px;
		width:100%;
		margin:0px 0px 2px 0px;
	}
	#kunden{
		margin:0px auto 0px 0px;
	}
}
@media (max-width: 250px) {
	#jmap{
		transform:scale(0.4);
	}
}


/* ---------- Navigation ---------- */
#kopfzeile{
	display:flex;
	background:#fff;	
	height:54px;
	padding:0px 0px 0px 0px;
}
#schriftzug{
	/*float:left;
	margin:10px 0px 0px 10px;	
	width:78%;
	max-width:400px;
	padding-left:10px;
	display:block;*/
}
#schriftzugkurz{
	/*float:left;
	margin:10px 0px 0px 10px;	
	height:35px;
	width:auto;
	padding-left:10px;*/
	display:none;
}
#navigation{
	/*float:right;
	display:block;
	margin:0px 20px 0px 0px;	*/
	font-size:17px;

	/*background: rgba(200, 0, 0, 0.2);*/
    flex: 1;
    display: flex;
    justify-content: flex-end;
	padding:0px 20px 0px 0px;
}
.navpoint{
	font-family:"fontitalic";
	float:left;
	display:block;
	cursor:pointer;	
	padding:22px 0px 0px 10px;
	height:30px;
	line-height:18px;
	letter-spacing:0.06em;
}
.navpointselected{
	font-family:"fontblack";
	float:left;
	display:block;
	cursor:pointer;	
	padding:22px 0px 0px 10px;
	height:30px;
	line-height:18px;
	letter-spacing:0.025em;
}
.np1{ width:86px; }
.np2{ width:79px; }
.np3{ width:73px; }
.np4{ width:80px; }

.navpoint:hover{
	font-family:"fontblack";
	letter-spacing:0.025em;
}
#mobilenav_stripes {
	display:none;
	/*float:right;*/
	flex:1;
	justify-content: flex-end;
	padding:0px 15px 0px 0px;
	width:67px;
	height:54px;
	cursor:pointer;
}
#mobilenav_stripes img{
	margin:10px 0px 0px 10px;
	height:34px;	
}
#mobilenav{
	display:none;
	position:absolute;
	top:54px;
	left:0px;
	height:0px; 
	width:100%;
	overflow:hidden;
	z-index:1000;
}
.mobilequadrat{
	display:table-cell;
	width:120px;
	height:120px;
	background:#fff;
	margin:0px;
	padding:0px 0px 0px 0px;
	border-left:1px #999999 solid;
	border-top:1px #999999 solid;
	text-align:center;
	vertical-align:middle;
	line-height:24px;
	opacity:0.0;
}
.mobileitalic{
	font-family:"fontitalic";
}
.mobilebold{
	font-family:"fontblack";
}
.mobilequadrat:hover{
	cursor:pointer;
	font-family:"fontblack";
}

@media (max-width: 940px) {
	/* Normale Navi Stauchen */ 
	#navigation{
		padding:0px 10px 0px 0px;	
	}
	.navpoint{
		padding:22px 0px 0px 10px;
	}
	.navpointselected{
		padding:22px 0px 0px 10px;
	}
	#equipologobereich{
		display:none;
	}
}
@media (max-width: 820px) {
	#schriftzug{
		display:none;
	}
	#schriftzugkurz{
		display:block;	
	}
}
@media (max-width: 600px) {
	/* Show Mobile Navi */ 
	#navigation{
		display:none;
	}
	#mobilenav_stripes {
		display:flex;
	}
	#mobilenav{
		display:block;
	}
	/*#schriftzug{
		display:block;	
		padding-left:0px;
	}
	#schriftzugkurz{
		display:none;	
	}*/
	#tool_legende{
		float:left;
		bottom:0px;
		right:0px;
		margin:0px 15px 0px 15px;
	}
}
@media (max-width: 400px) {
	#schriftzug{
		margin:15px 0px 0px 10px;	
		width:70%;
		max-width:340px;
	}
}
@media (max-width: 320px) {
	#schriftzug{
		margin:18px 0px 0px 10px;	
	}
}
@media (max-width: 260px) {
	#schriftzug{
		display:none;
	}
	#schriftzugkurz{
		/*display:block;	
		margin:10px 0px 0px 0px;*/
	}
}