html, body {
	background-color: #f4f4f4; 
	font-family: 	'Roboto Condensed', sans-serif;
	height:			100%;
	width:			100%;
	min-width: 	700px;
	margin: 		0;
}

html {	
	overflow-y:	hidden;	/*overflow nicht auf body!*/
	overflow-x: scroll;
}

.pictures {
	position:	absolute;
	display: 	block;
	bottom: 		50%;
	-webkit-transform: 	translateY(+50%); /*un-fixed fixed child-elements */
	-ms-transform: 		translateY(+50%);
	transform: 			translateY(+50%);
	height: 94vh;
	max-height: 700px;
	min-height:	450px;
	min-width: 	700px;
	width: 		100%;
	z-index: 			1;
	white-space:		nowrap;	/*verhindert den Umbruch der Bilder! */
	background: 		#f4f4f4;
	font-size:			0px;
	font-size: 			0px; 
}


.pic {
	display: inline-block; 
	position: relative;
	height: 100%;
	z-index: 1;
	left: calc(5vw + 151px);
}

.info {
	position: absolute;
	height: 100px;
	width: 	100%;
	bottom:	0;
	background-color: #f4f4f4; 
	opacity: 	0;
	font-size:	10px;
	overflow: hidden;
}

.pic:hover .info {opacity: 0.9;}

.nopictures {
	position:	fixed;
	display: 	block;
	top: 		50%;
	-webkit-transform: 	translateY(-50%); /*un-fixed fixed child-elements */
	-ms-transform: 		translateY(-50%);
	transform: 			translateY(-50%);
	padding: 	20px;
	height:		calc(94vh - 40px);
	max-height: calc(700px - 40px);
	min-height:	calc(450px - 40px);
	min-width: 	calc(700px - 40px);
	width:		calc(95vw - 151px);
	left:		calc(5vw + 151px);
	z-index: 		1;
	white-space:	nowrap;	
	background: 	#ffffff; 
	font-size: 		0px; 		/* verhindert Lücke */
	overflow: 		hidden;		/* verhindert Scollbalken */
}

.left {
	display: 	inline-block;
	height: 	100%;
	vertical-align:	top; 
	text-align: 	center; 
	white-space:	normal;    
	/*background-color: #FFFFFF; */
}

.middle {
	display: 	inline-block;
	height: 	100%;
	vertical-align:	top; 
	text-align: 	center; 
	white-space:	normal;    
	/*background-color: #f4f4f4; */
}

.right {
	display: 	inline-block; 
	height: 	100%;  
	top: 		0px; 
	margin-left: 	0px; 
	white-space:	normal; 
	/*background-color:#f4f4f4;*/
	/*overflow-y:			scroll;*/
}

.frame {
	z-index: 	10;
	opacity: 	0.65;
	top: 		50%;
	-webkit-transform: 	translateY(-50%); /*un-fixed fixed child-elements */
	-ms-transform: 		translateY(-50%);
	transform: 			translateY(-50%);
	background-color: #f4f4f4;	
	position:	fixed;
	display: 	block;
	height: 94vh;
	max-height: 700px;
	min-height:	450px;
	width:		5vw;
}

.menu {
	top: 		50%;
	-webkit-transform: 	translateY(-50%);
	-ms-transform: 		translateY(-50%);
	transform: 			translateY(-50%);
	z-index: 	11;
	width: 		150px;
	height: 94vh;
	max-height: 700px;
	min-height:	450px;
	left:		5vw;
	background-color: #FCFCFC;
	position:	fixed;
	display: 	block;
	opacity: 	1;
	text-align:	right;
	overflow: hidden;
}

/* Vorgaben für Text */

.menu a {
	font-family:	'Roboto Condensed', sans-serif;
	font-weight:	300;	
	/*"grundlegende" Farbe abhängig von div*/
	color:			#888888;
	transition:		color 1s ease;
	transition-delay: 1s;}	

.menu:hover a {
	/*farbe der schrift im div "menu" (definiert über Klasse von <a>) wird geändert wenn man div mit maus...*/
	color:	#1d1d1d;
	transition:	color 0.5s ease;}

h1 {
	font-family:	'Roboto Condensed', sans-serif;
	font-weight:	400;
	font-size:		20px;
	color:			#1d1d1d;
	margin-top:		0px;
	height: 		50px;
}

a {
	font-family:	'Roboto Condensed', sans-serif;
	font-weight:	300;}

.nopictures a {
	font-size:		18px;
}

.menu a.copy {
	font-size:		13px;
	color:		#888888;}

a.title {
	margin-right:	10px;
	font-size:	25px;
	color:		#1d1d1d;}

a.link_small{
	font-size: 16px;
}
	
a.link_small:link, a.link_small:visited{

	color: #1d1d1d;
	text-decoration: none;
	color:			#002d4a;
}

a.link_small:link:hover, a.link_small:visited:hover{
	color:			#006bb1;
}

/*	
a:link{
	color: #1d1d1d;
	text-decoration: none;
	color:			#002d4a;
}
*/

a:link:hover {
	color:			#006bb1;
}

.menu a.ref {
	margin-right:	15px;
	font-size:		20px;}

.menu:hover a.ref:hover {
	/* ändert farbe beim "überfahren" von <a>*/
	color: 		#006bb1;}

a.ref:link {
	text-decoration: none;}
	
/* Vorgaben für Bilder */

img {
	height:		100%;
	vertical-align:	middle;
	opacity: 1;
}

.pic img {
	height: 94vh;
	max-height: 700px;
	min-height: 450px;
}