/* latin-ext */
@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 300;
  src: local('Roboto Condensed Light'), local('RobotoCondensed-Light'), url(../font/b9QBgL0iMZfDSpmcXcE8nPVFL0ofnRu5Y2lP-UpEUGU.woff2) format('woff2');
  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 300;
  src: local('Roboto Condensed Light'), local('RobotoCondensed-Light'), url(../font/b9QBgL0iMZfDSpmcXcE8nBBQ_Gf4FfI8J4SYljBAylk.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
/* latin-ext */
@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto Condensed'), local('RobotoCondensed-Regular'), url(../font/Zd2E9abXLFGSr9G3YK2MsD86pq2NkPzVgw_9lpT6RGI.woff2) format('woff2');
  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto Condensed'), local('RobotoCondensed-Regular'), url(../font/Zd2E9abXLFGSr9G3YK2MsDAdhzWOYhqHvOZMRGaEyPo.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}

html, body	{
	/*background: url("../images/bg.png") repeat scroll 0 0 #aaa;*/
	font-family: 'Roboto Condensed', 'Open Sans', sans-serif;
	font-weight:300; font-size: 20px; font-size: 3vh;
	text-decoration: none;
	height:100%;
	color: #777777;
}

h4	{
	/*background: url("../images/bg.png") repeat scroll 0 0 #aaa;*/
	font-family: 'courier';
	font-weight:300; font-size: 14px; font-size: 2.0vh;
	text-decoration: none;
	height:100%;
	color: #777777;
}

.courier	{
	font-family: 'courier';
	font-weight:300; font-size: 16px; font-size: 2.5vh;
	text-decoration: none;
	height:100%;
	color: #777777;
}

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

img	{ border: 0px; }

#container {
	background-color: #fff;
	width: 120.1vh; /*with left border: 130vh;*/
	height: 100.3vh;
	margin-left: auto;
	margin-right: auto;
}
#picture	{
	background-color: #fff;
	left: 0px;
	width: 72.05vh;
	height:100vh;
	float: right;
}
#page	{
	right:0px;
	width: 36%;
	padding-left:4%;
	float: right;
}
#page-footer {
	position:absolute;
	bottom:0.5vh;
	font-size: 13px; font-size: 2.2vh;
	font-weight:300;
	display: inline-block; 
}
#footer {
	display: none;
	font-size: 13px; font-size: 2.2vh;
	font-weight:300;
}

.sprachen	{ position:relative; padding-right: 8%; top: -5px; top:-0.5vh; color:#999; text-align:right; }
.sprachen a {	color:#999; font-weight:300;font-size: 13px; font-size: 2.3vh; text-decoration: none; }
.sprachen a:hover, a:active { color: #333;}

.copyright { color: #999; text-align:left; }

.imprint { text-align:right; margin-left:20vh; width: 20vh; }
.imprint a { color: #999; }
.imprint a:hover { color: #000; }

#headline	{
	position:relative;
	padding: 8% 8% 0px 0px;
	color: #999;
	font-weight:300;
	font-size: 24px; font-size: 4.2vh;
	letter-spacing: 0.1px;
	text-align:right;
}

.nav ul { padding: 0; }
.nav li { list-style:none; margin-top: -0.4vh; }
.nav	{
	position:relative;
	color: #999;
	margin-top: 11vh;
	font-size: 20px; font-size: 3.2vh;
	font-weight:400;
}
.nav a {
	color: #999; /*#4D4D4D;*/
	font-weight:300;
	font-size: 17px; font-size: 2.7vh;
	text-decoration:none;
}
.nav a:hover { color: #ccc; }
.nav .active a { color: #666; }

div.img_title_container {
	position: relative;
	width:110px; 
	height: 30px; 
    margin-top: -33px; 
	margin-left:173px;
}
div.img_title_container div.img_title	{
	position: absolute;
	right:0px;
	bottom: 0px;
	color: #ccc;/*#4D4D4D;*/
	font-weight:300;
	font-size: 11px;
	text-align:right;
}

.camera_caption {
	bottom:19vh !important;
	left: 76.8vh;
	width:38vh !important;
	font-size: 20px; font-size: 2.6vh;
}
.camera_caption > div { background: transparent !important; }
.camera_caption > div {	padding: 0 !important; }

.camera_wrap .camera_html {
	color: #555;
	padding: 4vh;
}

/*@media screen and (orientation:portrait) {*/ 
@media screen and (max-width: 130vh), screen and (orientation:portrait) { 

	#container { width:72vh;height:100vw; }
	#picture	{
		background-color: #fff;
		left:0px;
		width:100%;
		height:100vh;
		float: left;
	}
	#page	{
		left:0px;
		width: 96%;
		padding-left:4%;
		float: left;
	}
	#page-footer { display:none; }
	#footer {
		display:inline;
		background-color: white;
		left:0px;
		width: 96%;
		padding-left:4%;
		float: left;
		padding-top: 1vh;
		padding-bottom: 1vh;	
	}
	
	.copyright { float: left;}
	.imprint { float: right; width: 17vh; margin-right:3vh;}

	#headline { padding: 2% 4% 0px 0px; }
	.sprachen { padding-right: 4%; top: -5px; top:-0.5vh; }

	.nav { margin-top: 3vh;	}
	.nav ul { padding: 0; list-style-type: none; margin-bottom: 11vh !important; }
	.nav li { list-style:none; display: inline;	margin-top: -0.4vh;	}
	.nav li + li:before{ content: "| "; padding: 0 0.2vh; }
	.nav a { font-size: 14px; font-size: 2.7vh;	}
	
	.camera_pag { 
		left: 2.7vh !important; 
		top: -4.6vh !important;/*top: -5.8vh !important;*/
		width: 32vh !important;
	}
	.camera_pag ul { text-align:left !important; }
	.camera_wrap .camera_pag .camera_pag_ul li > span {
		height: 8px; height: 1.6vh !important;
		left: 4px; left: 0vh;
		top: 4px; top: 0vh;
		width: 8px;	width: 1.6vh !important;
	}
	.camera_wrap .camera_pag .camera_pag_ul li {
		height: 8px; height: 1.6vh !important;
		margin: 20px 5px; margin: 0.3vh 0.3vh !important;
		width: 8px; width: 1.6vh !important;
	}
	.camera_wrap a { font-size: 2.5vh !important; }
	.camera_wrap .camera_html {
		padding: 3vh !important;
	}
	
	.camera_caption {
		bottom: 102.3vh !important;
		left: 37.2vh !important;
		width:32vh !important;
		text-align:right;
	}

}