html  { 
min-height:100%;
}

body {
  font-family: "Open Sans", sans-serif;
  background-color: #ffffff;
}

img alt {
	color: #FFF;
	}
	
#nav {
	font-family: "Open Sans", sans-serif;
	width: 100%;
	margin: 0 0 30px 0;
	position: relative;
	}
	
#nav ul {
	list-style: none;
	/* contain the list items */
	overflow: hidden;
	/*display: table;  ul will behave like a table now */
	text-align: center;
	}

#nav ul li {
	/* float: left; */
	color: #888;
	height:35px;
	display: inline-block; 
	margin: 0;!important	
}

#nav ul li a {
	color: #000;
	padding: 5px 12px 5px 12px;
	font-size: 0.7em;
	letter-spacing: 2px;
	/*float: left;*/
	/* some height would be nice */
	/* adjusting height */
	text-transform: uppercase;
	text-decoration: none;
}

#nav ul li a:hover {
	background: #000;
	color: #FFF;!important
	text-decoration: none;!important
}

#nav .current-n {
	border-bottom: 1px solid #000;/* aktiver Link  */
	}	

#footer-mobile {
		display: none;
}
		
#footer {
	clear:both;
	padding: 0;
	font-size:0.6em; 
font-family:'Open Sans', sans-serif; 
font-weight: 400;
color: #fff;
line-height: 1.1em;
	}

#footer .cd-pagination a:hover {
  color: #000;
  text-decoration:none;
  border-bottom: solid 1px #000000;
}


.main a {
	font-family:'Open Sans', sans-serif; 
font-weight: 300;
	color: #000;
	text-decoration: none;
	}
	
.main a:hover {
	font-family:'Open Sans', sans-serif; 
font-weight: 300;
	color: #000;
	text-decoration: none;
	}
@-webkit-keyframes bg{ 
	0%{ background-size:120% 120%; }
	100%{ background-size:100% 100%; } 
}

#wrap{
	width: 70%;
	max-width: 720px;
	margin: 20px auto;
	background-color: #FFF;
}


.main{ 
position: relative;
margin: 0 0 30px  0;
font-size:1.2em; 
color:#000;
font-family:'Open Sans', sans-serif; 
font-weight: 300;
line-height: 1.1em;
letter-spacing:2px;
text-align: center;
}
	

	
.fotograf { 
	font-size:1.4em; 
	margin:0 20px 0 0 ;  
	font-family: 'Open Sans', sans-serif;
	color:#000;
	font-weight: 300;
	line-height: 0.9em;
}

.main p{ margin:2% 0;
padding-bottom: 4%;
color: #888;
 }

.main .btn{ box-shadow:0 0 2px rgba(0,0,0,0.2); }
.main footer{ margin-top:50px; text-shadow:none; font-size:0.9em; color:#D8FF16;}
.main footer a{ color:#D8FF16; -webkit-transition:0.2s; -ms-transition:0.2s; transition:0.2s; }

#inhalt { 
width:400px;
font-family: 'Open Sans', sans-serif;
font-size: 0.8em;
line-height: 1.6em;
	font-weight: 400;
text-align: center;
letter-spacing: 1px;
height:auto;
margin: 100px auto 0;
}

#inhalt a {
	padding: 5px 6px;
	background: #fff;
	color: #444;
	font-size: 0.9em;
	letter-spacing: 2px;
	/*float: left;*/
	/* some height would be nice */
	line-height: 1.5em;
	/* adjusting height */
	/* display: block; or inline-block */
	text-transform: uppercase;
}	
#inhalt a:hover {
	background: #000;
	color: #fff;
	text-decoration: none;
}

	
/*.main footer a:hover{ text-decoration:none; color:#FF1668; }  */

#gallery{ 
width:100%; /* ----------------------------- breite Gallery --------------------------------- */
min-height: 480px;
margin-bottom: 20px;
}

#gallery li{ list-style:none; 
	perspective:100px; 
	-webkit-perspective:100px; 
	margin:0px; 
	float:left; /* ----------------------------------- Thumbnails links oder rechts angeschlagen --------------------------------- */
	position:relative; 
	transition:.1s; 
	-webkit-transition:0.1s; }
	
	#gallery a{ 
	display:block; 
	/*width:75px;
	 height:68px; */
	 width:120px; /* ----------------------- gršsse der Thumbnails */
	 height:96px; 
	 vertical-align:bottom; 
	 overflow:hidden; 
	 background:rgba(255,255,255,8);  /* ------------------- Hintergrundfarbe Thumbnails ---------------*/
	transition:.4s ease-out; 
	-webkit-transition:0.4s ease-out;
	-webkit-transform:rotateX(90deg) translateY(-50%); 
	transform:rotateX(90deg) translateY(-50%); }
				
				
	#gallery a img{ 
	min-height:100%;
	 min-width:100%; 
	 transition:.3s ease-out; 
	 -webkit-transition:0.3s ease-out; 
	 }
	 
	#gallery .loaded a{ 
	-webkit-transform:rotateX(0deg) translateY(0); 
	transform:rotateX(0deg) translateY(0); 
	}
	#gallery li.loaded:hover{ 
	transform:scale(1.2); 
	-webkit-transform:scale(1.2); 
	z-index:2; 
	}
	
	#gallery li.loaded a:hover{ 
	/* box-shadow:0 0 0 2px #FFF, 0 0 5px 2px #000;   -------------------- Schatten Thumbnail --------------*/
	transition:.1s; 
	-webkit-transition:0.1s; 
	}
	#gallery li.loaded:hover img{  /*------------------- zoom des Thumbnails  -------------------*/
	transform:scale(1.0); 
	-webkit-transform:scale(1.0); 
	}
	
/*------- media queries -----------*/
/*------- tablet -----------*/
@media only screen and (max-width: 1024px) {  
	#wrap{
	width: 100%;
	margin: 40px auto;
	background-color: #FFF;
}

#gallery{ 
width:100%; /* ----------------------------- breite Gallery --------------------------------- */
margin: 0 auto 40px;
min-heigh:500px;
}

}
@media only screen and (min-width:46.875em) and (orientation: landscape) {
	#wrap{
	width: 100%;
	margin: 20px auto 0;
}

.main{ 
position: relative;
margin: 0 0 20px  0;
font-size:1.2em; 
color:#000;
font-family:'Open Sans', sans-serif; 
font-weight: 300;
line-height: 1.1em;
letter-spacing:2px;
text-align: center;
}

#nav {
	font-family: "Open Sans", sans-serif;
	width: 100%;
	margin: 0 0 5px 0;
	position: relative;
	}
	#gallery{ 
width:100%; /* ----------------------------- breite Gallery --------------------------------- */
min-height: 480px;
margin-bottom: 20px;
}
}

@media only screen and (min-width:46.875em) and (orientation: portrait) {
	
#wrap{
	width: 600px;
	margin: 50px auto 0;
}

.main{ 
position: relative;
margin: 0 0 10px 0;
font-size:1.2em; 
color:#000;
font-family:'Open Sans', sans-serif; 
font-weight: 300;
line-height: 1.1em;
}

.fotograf { 
	font-size:1.4em; 
	margin:0 20px 0 0 ;  
	font-family: 'Open Sans', sans-serif;
	color:#000;
	font-weight: 300;
	line-height: 0.9em;
}

#footer {
	display:none;
	}

#footer-mobile {
	display: inline;
	clear:both;
	padding: 0;
	font-size:0.6em; 
font-family:'Open Sans', sans-serif; 
font-weight: 400;
color: #fff;
line-height: 1.1em;
	}
	
#footer-mobile .cd-pagination a:hover {
  color: #000;
  text-decoration:none;
  border-bottom: solid 1px #000000;
}

#gallery > a{ width:45px; height:45px; }

#gallery{ 
width:100%; /* ----------------------------- breite Gallery --------------------------------- */
height: 590px;
margin-bottom: 20px;
}
	
} 

@media only screen and (max-width:46.875em) {
	
#wrap{
	width: 600px;
	margin: 50px auto 0;
}

.main{ 
position: relative;
margin: 0 0 10px 0;
font-size:1.2em; 
color:#000;
font-family:'Open Sans', sans-serif; 
font-weight: 300;
line-height: 1.1em;
}

.fotograf { 
	font-size:1.4em; 
	margin:0 20px 0 0 ;  
	font-family: 'Open Sans', sans-serif;
	color:#000;
	font-weight: 300;
	line-height: 0.9em;
}

#footer {
	display:none;
	}

#footer-mobile {
	display: inline;
	clear:both;
	padding: 0;
	font-size:0.6em; 
font-family:'Open Sans', sans-serif; 
font-weight: 400;
color: #fff;
line-height: 1.1em;
	}
	
#footer-mobile .cd-pagination a:hover {
  color: #000;
  text-decoration:none;
  border-bottom: solid 1px #000000;
}

#gallery > a{ width:45px; height:45px; }

#gallery{ 
width:100%; /* ----------------------------- breite Gallery --------------------------------- */
height: 590px;
margin-bottom: 20px;
}
	
} 
@media only screen and (max-width: 30em) {
	#wrap{
	width: 90%;
	margin: 20px auto 0;
}

.main{ 
margin: 0 0 10px  0;
}

.fotograf { 
	font-size:1.4em; 
	margin:0;  
	font-family: 'Open Sans', sans-serif;
	color:#000;
	font-weight: 300;
	line-height: 0.9em;
}

#nav {
	margin: 0 0 10px 0;
	}

#nav ul li a {
	color: #000;
	padding: 5px 4px 5px 4px;
	font-size: 0.8em;
	letter-spacing: 1px;
	/*float: left;*/
	/* some height would be nice */
	/* adjusting height */
	text-transform: uppercase;
	text-decoration: none;
}

#inhalt { 
width:100%;
font-family: 'Open Sans', sans-serif;
font-size: 0.9em;
line-height: 1.4em;
	font-weight: 400;
text-align: center;
letter-spacing: 0;
height:auto;
margin: 40px auto 0;
}
#gallery{ 
width:240px; /* ----------------------------- breite Gallery --------------------------------- */
height: 590px;
margin-bottom: 20px;
}

#footer {
	display:none;
	}

#footer-mobile {
	position:relative;
	display: inline;
	clear:both;
	margin:15px 0 50px 0;
	padding: 0;
	font-size:0.6em; 
font-family:'Open Sans', sans-serif; 
font-weight: 400;
color: #fff;
line-height: 1.1em;
	}
}