@charset "utf-8";

@font-face {
    font-family: 'mainzer_groteskhalbfett';
    src: url('mainzergrotesk-halbfett-webfont.eot');
    src: url('mainzergrotesk-halbfett-webfont.eot?#iefix') format('embedded-opentype'),
         url('mainzergrotesk-halbfett-webfont.woff') format('woff'),
         url('mainzergrotesk-halbfett-webfont.ttf') format('truetype'),
         url('mainzergrotesk-halbfett-webfont.svg#mainzer_groteskhalbfett') format('svg');
    font-weight: normal;
    font-style: normal;

}

body {
	
	font-family: 'mainzer_groteskhalbfett', Arial, Helvetica, sans-serif;
	font-size: 14px;
	color:#FFF;
	background-color:#000;
	margin:0;
	padding:0;
	overflow:hidden;
}

::selection {
	background:none;
	color:#606060;
}

::-moz-selection {
	background:none;
	color:#606060;
}
  
  html{
		margin: 0;
		padding: 0;
		-webkit-font-smoothing: antialiased;
		text-rendering: optimizelegibility;
  }

  /* Sprache */
.en {
	display:none;
}

.marker {
	border-bottom-width:1px;
	border-bottom-style:solid;
}

.nomarker:hover {
	border-bottom-width:1px;
	border-bottom-style:solid;
}
  
/* Text Formatierungen*/  

.headline {
	margin:0;
	border-bottom-width:1px;
	border-bottom-style:solid;
}

.info {
	margin:0;
	text-indent:20px;
}

.infolink {
	border-bottom-width:1px;
	border-bottom-style:solid;
}

.infolink:hover {
	border-bottom-width:0px;
}

.infolink_inline {
	border-bottom-width:0px;
	border-bottom-style:solid;
}

.infolink_inline:hover {
	border-bottom-width:1px;
}

/*Permanent Navigation */

#about_link {
	text-align:left;
	position: fixed;
	left: 1%;
	top: 11px;
	z-index:100;
	cursor:pointer;
	border-bottom-style:solid;
	border-bottom-width:1px;
}


#claim_link {
	text-align:center;
	width: 300px;
	position: fixed;
	left: 50%;
	margin-left: -150px;
	top: 11px;
	z-index:100;
}

#de_link {
	text-align:right;
	position: fixed;
	right: 1%;
	top: 11px;
	z-index:100;
	cursor:pointer;
}

#en_link {
	display:none;
	text-align:right;
	position: fixed;
	right: 1%;
	top: 11px;
	z-index:100;
	cursor:pointer;
}

/* About */

#about_text {
	width:100%;
	height:100%;
	position:fixed;
	top:0;
	z-index:96;
	overflow-y:auto; /*wichtig für Mobile-Funktionalität. Txt wird nicht abgeschnitten sondern scrollbar.*/
	overflow-x:hidden;
	margin:55px 0 0 0; /*abstand oben unter about (+padding #about_container =70px */
	padding:0;
}

/*About_Unterseiten*/

#about_container {
	padding: 15px 0 0 0;
}

.about_spalte {
	width:23%;
	padding:1%;
	float:left;
}

.about_spalte_sec {
	width:23%;
	padding:1%;
	float:left;
}

.about_spalte_team {
	width:23%;
	padding:1% 1% 100px 1%;
	float:left;
}

.foto {
	width:48%;
	padding:1%;
	float:left;
}

/* Links */
a {  
	color: #FFF; 
	text-decoration:none; 
}

a:link {  
	color: #FFF; 
	text-decoration:none; 
}
a:visited {  
	color:#FFF; 
	text-decoration:none; 

}
a:focus {  
	color:#FFF; 	
	text-decoration:none; 

}
a:hover { 
	color:#FFF; 
	text-decoration:none;
}
a:active {  
	color: #FFF; 
	text-decoration:none; 
}
/* Typoanpassung für große Bildschirme */
@media (min-width: 1600px) {
body {
	font-size:16px;
}
}
/* unter 700px höhe balken einblenden */
@media (max-height: 700px) {
#about {
	opacity:1;
}

#balken_screen {
	background:#000;
	width:100%;
	height:35px;
	bottom:0;
	position:fixed;
	z-index:2;
}
}

/* Mobile Anpassungen */

/* unter 1024px auf desktops 2-spaltig */
@media (max-width: 1024px) {
#about {
	opacity:1;
}

#balken_screen {
	background:#000;
	width:100%;
	height:35px;
	bottom:0;
	position:fixed;
	z-index:2;
}

.about_spalte {
	width:48%;
}

.about_spalte_sec {
	width:48%;
	clear:both;
}

.about_spalte_team {
	width:48%;
}

.foto {
	width:98%;
}
}

/* unnötig????? 2-spaltig auf tablets (außer iPad 4) 
@media (max-device-width: 768px) {
#about {
	opacity:1;
}

.about_spalte {
	width:48%;
}

.about_spalte_sec {
	width:48%;
	clear:both;
}

.about_spalte_team {
	width:48%;
}

.foto {
	width:98%;
}
}
*/

/* 1-spaltig auf smartphones */
@media (max-device-width: 640px) {
#balken_mobile {
	background:#000;
	width:100%;
	height:80px;
	bottom:0;
	position:fixed;
	z-index:2;
}

.about_spalte {
	width:98%;
}

.about_spalte_sec {
	width:98%;
}

.about_spalte_team {
	width:98%;
}

.foto {
	width:98%;
}

#about_container {
	padding:0;
}

#about_text {
	margin:100px 0 0 0;
}

body {
	font-size:56px;
	}
	
.info {
	margin:0;
	text-indent:80px;
}

#claim_link {
	display:none;
	}

#picture_link {
	display:none;
	}

#blog_link {
	display:none;
	}
}
/* unter 800px auf desktops 1-spaltig */
@media (max-width: 800px) {
.about_spalte {
	width:98%;
}

.about_spalte_sec {
	width:98%;
}

.about_spalte_team {
	width:98%;
}

.foto {
	width:98%;
}
}
/* unter 500px auf desktops claim, pictures, blog ausblenden */
@media (max-width: 500px) {
#claim_link {
	display:none;
	}

#picture_link {
	display:none;
	}

#blog_link {
	display:none;
	}
}