html{
		box-sizing: border-box;
}

body{
	background-color: #000;
	margin: 0;
	padding: 0;

}
body.archive{
	background-color: #a6aba7;
}

body.project{
	background-color: #2c3033;
	}

header{
	height:60px;
	width:250px;
	margin:auto;
	margin-top:20px;
	// background-color: #333;
	color:#fff;
}

header a{
	display:block;
	float:left;
	width:60px;
	padding:10px;
	border:1px solid #fff;
	font-family: 'Fjalla One', sans-serif;
	text-transform: uppercase;
	font-size: 14px;
	text-align:center;
}

a{
	color:#fff;
	text-decoration: none;
}

body.archive header a.active{
	background-color: #fff;
	color:#a6aba7;
}
body.project header a.active{
	background-color: #fff;
	color:#2c3033;
}
.clear{
	clear:both;
}

ul{
	margin: 0;
	padding: 0;	
}

// #Stage{	transform-origin:0 0; 
// 	-ms-transform-origin:0 0; 
// 	-webkit-transform-origin:0 0; 
// 	-moz-transform-origin:0 0; 
// 	-o-transform-origin:0 0; }


	img {
max-width:100%;
width:auto;
height:auto;
-ms-interpolation-mode: bicubic; }	


iframe{
	overflow:hidden;
	// scrolling:no;
}
	.projects img{
// width:33%;
height:auto;
	}
	ul.projects  li{
		list-style:none;
		width:100%;
		float:left;
	}
	.fblock{
	width:95%;
		float:left;	
	}

#previous img, #next img{
width:40%;
height:40%;
	}


@media only screen and (min-width:480px) {
		ul.projects  li{
		
		width:50%;
		
	}
	.fblock{
	width:45%;
		
	}
	#previous img, #next img{
width:auto;
height:auto;
	}
	}
	@media only screen and (min-width:640px) {
		ul.projects  li{
		
		width:50%;
		
	}
	.fblock{
	width:45%;
		
	}
	}



	@media only screen and (min-width:960px) {
		ul.projects  li{
		
		width:33%;
		
	}
	.fblock{
	width:30%;
		
	}
	}
	@media only screen and (min-width:1480px) {
		ul.projects  li{
		
		width:33%;
		
	}
	.fblock{
	width:30%;
		
	}
	}
ul.projects  li img{
	width:95%;
	height:auto;
	border:4px solid #000;
}
body.archive ul.projects  li img{
	border:4px solid #fff;
}


.fblock {
		padding:1.5%;
}

ul.projects  li img:hover{
	width:95%;
	height:auto;
	border:4px solid #fff;
}

ul.projects  li a{

}

ul.projects  {
	margin-left:1%;
}
ul.projects li {
	margin-bottom:5px;
}


	

	#thumbnails{
margin-top: 2px;
margin-left: 2px;
	}
li{
		margin: 0;
		// margin-left, margin-right:1px;
		padding: 0;
		list-style-type: none;
	}

	#thumbnails li{
		// display:block;
			float:left;	
			width:4.16%;
margin: 0px;
// border:2px solid white;
	}

#thumbnails img{
	margin: 0px;
}

	#thumbnails img{
		height:auto;
		width:96%;
			// outline: 1px solid black;
	// padding-right: 5px !important;		
	}


	#next{
		color:white;
position: absolute;
bottom:8%;
right:10px;
cursor: pointer;
width:50%;
height:90%;
	}
	#next img{
position: absolute;	
bottom:0;	
right:0;
	}

	#previous{
				color:white;
position: absolute;
bottom:8%;
left:10px;
cursor: pointer;
width:50%;
height:90%;
	}

		#previous img{
position: absolute;	
bottom:0;	
left:0;
	}

#01{
	border:1px solid #fff;
}	

	body{
		background-color: #000;
	}


	.fancybox-inner{
overflow:hidden !important;
	}

	iframe{
		outline:1px solid #fff;
	}

	.fancybox-wrap{
		top: 0px;
	}
	#startbild{
		height:100%;

	}
	#startbild img{
		height:100%;
width:auto;
	}

footer{
	// width:90%;
	// margin:auto;
// text-align:center;
	margin-left:1%;
		font-family: 'Fjalla One', sans-serif;;
		color:#eee;
		font-size: 14px;
		line-height: 22px;
}
footer a{
	text-decoration: underline;
}
#copyright p{
	font-size: 12px;
}

hr{
	margin-top: 40px;
	color:#fff;
}