@charset "utf-8";
@import url("hpa-reset.css");
/* Nail charset (utf-8 w/o BOM) for this file with some german umlauts: äöüß */

/* ... SECTION: Fonts ......................... */
@font-face {
    font-family: 'Droid Sans';
    src: url('../fonts/DroidSans-webfont.eot');
    src: url('../fonts/DroidSans-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/DroidSans-webfont.woff') format('woff'),
         url('../fonts/DroidSans-webfont.ttf') format('truetype'),
         url('../fonts/DroidSans-webfont.svg#droidsansregular') format('svg');
    font-weight: 400;
    font-style: normal;
}

	@media screen and (-webkit-min-device-pixel-ratio:0) {
		@font-face {
			font-family: 'Droid Sans';
			src: url('../fonts/DroidSans-webfont.svg#droidsansregular') format('svg');
		    font-weight: 400;
			font-style: normal;
		}
	}
	
@font-face {
    font-family: 'Droid Sans';
    src: url('../fonts/DroidSans-Bold-webfont.eot');
    src: url('../fonts/DroidSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/DroidSans-Bold-webfont.woff') format('woff'),
         url('../fonts/DroidSans-Bold-webfont.ttf') format('truetype'),
         url('../fonts/DroidSans-Bold-webfont.svg#droidsansbold') format('svg');
    font-weight: 700;
    font-style: normal;
}

	@media screen and (-webkit-min-device-pixel-ratio:0) {
		@font-face {
			font-family: 'Droid Sans';
			src: url('../fonts/DroidSans-Bold-webfont.svg#droidsansbold') format('svg');
		    font-weight: 700;
			font-style: normal;
		}
	}

/* ... SECTION: GLOBAL ......................... */
html {
	background-color:	rgb(29, 25, 19);
	}
html, body {
	font-family:		'Droid Sans', Arial, sans-serif;
	width:				100%;
	height:				100%;
	overflow:			hidden;
	color:				rgb(255,255,255);
	}
/* ... SECTION: TEXT/IMAGE LAYOUT .............. */
h1 {
	font-size: 			27px;
	line-height: 		1.7em;
	margin-bottom: 		8px;
	text-align: 		left;
	}
h2 {
	font-size: 			21px;
	font-weight:		400;
	line-height: 		1.5em;
	margin-bottom: 		8px;
	text-align: 		left;
	}
h3 {
	font-size: 			17px;
	line-height: 		1.3em;
	margin-bottom: 		8px;
	}
h4 {
	font-size: 			14px;
	line-height: 		1.3em;
	margin-bottom: 		8px;
	font-weight:		700;
	}
p,address,figcaption {
	text-align: 		justify;
	font-size: 			14px;
	line-height: 		21px;
	margin-bottom: 		8px;
	font-style:			normal;
	}
ul,ol {
	margin: 			0px 0px 12px 0px;
	padding: 			0 0 0 13px;
	text-align: 		justify;
	}
ul.bullDisc {
	list-style-type:	disc;
	text-align:			left;
	}
ul.bullDisc li {
	line-height: 		21px;
	}
li {
	font-size:			14px;
	line-height:		1.1em;
	margin-bottom:		0.3em;
	}	
ul li ul {
	margin: 			6px 0px 6px 0px;
	}
a {
	text-decoration:	none;
	}
a:link, a:visited, a:active { 
	color:				rgb(255, 250, 238); /*#c2c597;*/
	}
a:hover {
	color:				rgb(254,95,2);
	}
.bold, .b {
	font-weight:		700;
	}
#txt a, .dottedLink {
	border-width:		0 0 1px 0;
	border-style:		dotted;
	border-color:		rgb(255, 250, 238); /*rgb(254,95,2); /*#c6c7b5;*/
	}
.adr {
	display:			block;
	margin-bottom:		8px;
	}
acronym {
	cursor:				help;
	border-width:		0 0 1px 0;
	border-style:		solid;
	border-color:		rgb(102,102,102);
	}
.trenn {
	border-width: 		1px 0 0 0;
	border-style: 		solid;
	border-color: 		rgb(198,199,181);
	text-align: 		right;
	margin-top: 		13px ! important;
	margin-bottom: 		13px ! important;
	opacity:			0.5;
	}

/*.......... SECTION: SELECTORS .................*/
p + h2 {
	margin-top: 		18px;
	}
p + h3 {
	margin-top: 		18px;
	}
p + h4 {
	margin-top: 		10px;
	}
table + h2, table + h3 {
	margin-top:			18px;
	}

/*###############################################*/
/*########## POSITION / BLOCKS ##################*/
/*###############################################*/
#bgr, #bgr div {
	position:			absolute;
	top:				0px;
	left:				0px;
	width:				100%;
	height:				100%;
	/* BUG:OPERA - without 'hidden' opera will scroll the whole background >> */
	overflow:			hidden;
	/*background-image:			url(../gal/img0105_01.jpg);*/
	background-position:		center center;
	-webkit-background-size: 	cover;
	-moz-background-size: 		cover;
	-o-background-size: 		cover;
	background-size:			cover;	
	}
/*.......... text area ..........................*/	
#txt {
	position:			absolute;
	top:				141px;
	bottom:				162px;
	/*top:				21px;
	bottom:				21px;*/
	left:				3%;
	height:				auto;
	width:				97%;
	display:			none;
	overflow:			auto ! important;
	z-index:			10;
	background-color:	rgba(29, 25, 19, 0.8);
	}
	#contentInnr {
		padding:		35px 324px 5px 84px;
		/*padding:		17% 324px 21px 84px;*/
		}
	#txt h1, #txt h2, #txt h3 {
		text-align:		left;
		margin-right:	1.5%;
		}
	#txt p {
		text-align:		justify;
		margin-right:	1.5%;	
		-webkit-hyphens: auto;
		-moz-hyphens: auto;
		hyphens: auto;
		}
	#contentUeb, #contentKon, #contentGal {
		display:		none;
		}
	#contentGal div {
		position:		relative;
		left:			0px;
		top:			-17px;
		width:			auto;
		height:			100%;
		}
	#contentGal figure, #contentGal figcaption, #contentGal img {
		width:			90%;
		height:			auto;		
		}
	#contentGal figure {
		margin-bottom:	11px;
		}
	#contentGal figcaption {
		margin-bottom:	0px;
		color:			rgb(29, 25, 19);
		background-color:rgb(255,255,255);
		}
	#contentGal figcaption span {
		padding-left:	5px;
		}
	#contentGal figcaption a {
		color:			rgb(29, 25, 19);
		}

/*.......... navigation/logo area ...............*/	
#overlay, #overlayIEWrapper {
	position:			absolute;
	top:				0px;
	right:				38px;	/*3% bei 1280 = 38,4px ;*/
	width:				231px; /* 231 px = BR zu 1280 */
	height: 			100%;
	overflow:			hidden;	
	z-index:			20;
	}
#overlay {
	background-color:	rgba(255,255,255,0.2);
	}
/* separate area for <= IE8 - 'cause "filter" inherits and makes child elements nearly invisible */
#overlayIEWrapper {
	}
	#logo {
		position:			relative;
		top:				47px;
		left:				0px;
		}	
	#logo h1 {
		font-size:			26px;
		line-height:		32px;
		margin-left:		11px;
		text-indent: 		0px; 
		color:				rgb(255,255,255);
		text-shadow: 		2px 2px 4px #888;
		}
		#logoRowFirst {
			}
		#logoRowSecond {
			font-weight:	400;
			letter-spacing:	7px;
			}
		#logoWordLeft {
			}
		#logoWordRight {
			position:		relative;
			top:			0px;
			left:			15px;
			}
		#logo a:link, #logo a:visited, #logo a:active, #logo a:hover { 
			color:				rgb(255, 250, 238);
			}
	#orangebar {
		position:			absolute;
		right:				0px;
		bottom:				162px;
		width:				88px;			/* 88 px = BR zu 1280 (76px) */ 
		height:				13px;			/* 13 px = BR zu 1280 (11px) */ 
		background-color: 	rgb(254,95,2);  /* rgb 254,95,2 = FE5F02 */ 
		}
		#imgLoader {
			position:		absolute;
			left:			5px;
			top:			5px;
			width:			16px;
			height:			16px;
			display:		none;
			}
	#navigationList {
		position:			absolute;
		left:				0px;
		bottom:				18px;
		width:				189px;
		height:				124px;
		list-style-type:	none;
		margin:				0px 0px 0px 11px;
		}
		#navigationList a:link, #navigationList a:visited, #navigationList a:active  {
			text-decoration: none;
			color:			rgb(255,255,255);
							/* x y [blur] color */
			text-shadow: 	2px 2px 4px #444;
		}
#galleryArea {
	position:			absolute;
	bottom:				0px;
	right:				38px;
	width:				88px;
	height:				100%;
	display:			none;
	z-index:			30;
	}
	#galleryArea div {
		position:		absolute;
		right:			0px;
		}
	#galleryArea div, #galleryArea img {
		width:			88px;
		height:			66px;
		}
	#galleryArea .proNr {
		position:		absolute;
		left:			92px;
		top:			0px;
		font-size:		12px; /*12px;*/
		text-align:		right;
		color:			rgb(255,255,255);
		}

/*###############################################*/
/*########## PRINT ##############################*/
/*###############################################*/
@media print {
	* {
		background:			none;
		}
	html, body {
		overflow:			visible ! important;
		font-family:		'Droid Sans', Arial, sans-serif;
		}
	
	#bgr, #bgr div, #backstretch, #galleryArea, #orangebar, #imgLoader, #navigationList, .noprint {
		display: none ! important;
		}
	#txt {
		top:				140px;
		bottom:				0px;
		left:				0px;
		display:			block ! important;
		background-color:	transparent;
		color:				rgb(0,0,0);
		overflow:			visible ! important;
		}
		#contentInnr {
			padding:		0px 50px 50px 210px;
			}
	#contentUeb, #contentKon {
		display:			block ! important;
		margin-bottom:		22px;
		}
	#contentImp, #contentDse {
		text-align:			left ! important;
		}
	#contentGal {
		display:			none ! important;
		}

	#overlay, #overlayIEWrapper {
		position:			absolute;
		top:				0px;
		left:				0px;
		background-color:	transparent;
		}
	#logo {
		position:			absolute;
		}
	#logo h1 {
		margin-left:		0px;
		color:				rgb(0,0,0);
		text-shadow: 		none;
		}
		
/* Abkürzungen auflösen */
acronym[title]:after {
	content:			" ("attr(title)")";
	color: 				#000;
	background-color: 	#FFF;
	font-style: 		italic;
	}
/* Links auflösen, wenn http */
a[href^="http"]:after {
	content:			" ("attr(href)")";
	color: 				#000;
	background-color: 	#FFF;
	font-style: 		italic;
	}
/* Symbol für externen Link weg */
.extLink {
	display:			none;
	}
}