/*
 * Globals
 */
/* Fonts */
@import url(https://fonts.googleapis.com/css?family=Istok+Web:400,400italic,700,700italic);


/*
 * Base structure
 */

html,
body {

  background-color: #000;
  font-family: 'Istok Web', sans-serif;

}
body {
  color: #fff;
  text-align: center;
}
header nav ul{
	margin:0;
	padding:0;
	list-style:none;	
}
header nav ul li{
	margin:0;
	padding:0;
	text-align:right;
	
}
header nav ul li a{
	position:absolute;
	top:20px;
	right:20px;
}
#logo{
	display:block;
	margin:14em auto;
	width:30%;
	height:auto;	
}
#kontakt{
	width:50px;
	height:auto;	
}
#home{
	width:54px;
	height:auto;	
}
main{
	margin:5em 30em;	
}
footer{
	text-align:left;
	position:absolute;
	bottom:2em;
	left:2em;
}
a{
	color:#333;	
	text-decoration:none;
}
a:hover{
	color:#fff;	
	text-decoration:none;
}
@media screen and (max-width: 500px){

	#logo{
		display:block;
		margin:12em auto;
		width:60%;
		height:auto;	
	}
	main{
		margin:5em auto;	
		width:100%;		
	}		
}

@media screen and (max-width: 667px) and (orientation: landscape){

	#logo{
		display:block;
		margin:5em auto;
		width:40%;
		height:auto;	
	}
	main{
		margin:5em auto;
		width:100%;			
	}		
}
@media screen and (min-width: 668px) and (orientation: portrait){

	#logo{
		display:block;
		margin:15em auto;
		width:40%;
		height:auto;	
	}
	main{
		margin:5em auto;	
		width:95%;
	}	
}
@media screen and (min-width: 668px) and (orientation: landscape){

	#logo{
		display:block;
		margin:15em auto;
		width:40%;
		height:auto;	
	}
	main{
		margin:5em auto;	
		width:85%;
	}	
}