@charset "utf-8";
/* CSS Document */

html {
	height:100%;
}

body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #2A2A2A;
	text-align: center;
	display: block;
	margin: 0;
	padding: 0 0 60px;
	position:relative;
	height:100%;
	
	-webkit-box-sizing: border-box;
	     -moz-box-sizing: border-box;
	          box-sizing: border-box;
	}
	
.wrapper {
	position:relative;
	top:10%;
}
	
a{
	text-decoration:none;
}
a img {
 border:none;
}
h1 {
	font-size: 20px;
	font-weight: normal;
	margin:0 25px 60px 25px;
	text-align: center;
	z-index:2;
	position:relative;
}
h2 {
	font-size: 15px;
	font-weight: normal;
	margin: 25px;
	color: #000;
}
h3 {
	font-size: 11px;
	font-weight: normal;
	margin: 25px;
	color: #AAAAAA
}
h4 {
	font-size: 13px;
	font-weight: normal;
	margin: 25px;
	color: #000;
}

a.gateway-link {
	height: 100%;
}

.column {
	float: left;
	border-left: solid 1px #DDDDDD;
	display: block;
	width: 24%;
	height: 500px;
	position: relative;
}

.column .image img {
	margin: 0 auto;
	max-width: 100%;
	display: block;
	bottom: 0;
	}

.logo {
	height: auto;
	z-index: 1;
	position: relative;
	padding-top: 160px;
}


.column .logo a img {
	position: relative;
}

#camera {
	border-left: none;
}
#camera .image img {
	margin-top: 110px;
}
#bio .image img {
	margin-top: 30px;
}
#geo .image img {
	margin-top: 30px;
}
footer {
	clear: both;
	color: #AAAAAA;
	font-size: 11px;
	position:relative;
	z-index:3;
}
.gateway-link .TRA_CONT  {
    background: none repeat scroll 0 0 transparent;
    margin-left: 0;
   transition: all 0.6s ease 0s;
	-webkit-transition:all 0.6s ease 0s;
	-moz-transition:all 0.6s ease 0s;
	-o-transition:all 0.6s ease 0s;
    width: 100%;
	position:relative;
	z-index:3;
	margin-top: -320px;
}
.column .description{
   opacity: 0;
   	z-index:1;
	transition: all 0.6s ease 0s;
	-webkit-transition:all 0.6s ease 0s;
	-moz-transition:all 0.6s ease 0s;
	-o-transition:all 0.6s ease 0s;
}
.lt-ie9 .column .description{
	display:none;
}

.gateway-link:hover .TRA_CONT, gateway-link.active .TRA_CONT  {
	background: none repeat scroll 0 0 rgba(255,255,255,0.9);
	background-repeat:repeat;
	height: 800px;
    margin-top: -583px;
    width: 100%;
}
.lt-ie9 .gateway-link:hover .TRA_CONT, .lt-ie9 .gateway-link.active .TRA_CONT{
	background-image:url(img/hintegrund_transparent.png);
	background-repeat:repeat;
	height: 800px;
    margin-top: -583px;
    width: 100%;
}
.gateway-link:hover .column .description, .gateway-link.active .column .description {
    opacity: 1;
}

.lt-ie9 .gateway-link:hover .column .description, .lt-ie9 .gateway-link.active .column .description{
	display: block;
}


#container {
	max-width: 1024px;
	margin: auto;
	min-height: 100%;
	overflow: hidden !important;
	clear: both;
	margin-bottom: 60px;
}
.column .image {
	position: relative;
	overflow: hidden;
	z-index: 0;
	display: block;
}
.column .image {
	height: 270px;
	margin: 10%;	
}
body.touch{
	margin-top:50px;
}
::-moz-selection{
    background-color:Transparent;
    color:#000;
    }
::selection {
    background-color:Transparent;
    color:#000;
    }

/*=========================================================== BUTTON*/
.button{
	font-size: 12px;
	font-weight: normal;
	margin: 25px;
	color: #EC1A2E;
}

@media (max-width: 600px){
	h4{
		margin:10px;
	}
	
	.column .image {
		margin:0;	
	}

	body {
		margin: 10%;
		top:0%;
	}
	.column {
		float: none;
		border-left: none;
		border-bottom: solid 1px #DDDDDD;
		height: 430px;
		overflow:hidden;
		width:100%;
	}
	#camera.column{
		height: 330px;
	}
	#camera .logo {
		padding-top:120px;
	}
	
	#geo.column{
		height: 445px;
	}
			
	.logo {
		padding-top:156px;
	}
	
	#camera .image img {
		margin-top: 20px;
	}
	
	#bio .image img {
		margin-top: 40px;
		width:200px;
	}
	#micro .image img {
		margin-top: 40px;
	}
	
	a{
		text-decoration:none;
	}
	.gateway-link.TRA_CONT  {
		height:380px;
		margin-top: -230px;	
	}
	.column .description {
		margin:0 12%;
	}
	.gateway-link:hover .TRA_CONT, .gateway-link.active .TRA_CONT {
		height:630px;
	    margin-top:-510px; 
	}
	#container {
		display:block;
	}
}