/*//////////////////////////////////////////////////*/
/* (c) 2007 by Stephan Kochs for EinGrafikbuero.de  */
/* Der Code muss nocheinmal überarbeitet werden.    */
/* Die Struktur ist nicht klar. Vieles lässt sich   */
/* noch zusammenfassen! Sauber ist anders!          */
/*//////////////////////////////////////////////////*/

body {
	overflow: -moz-scrollbars-vertical;
	background-image: url(../images/bg_a.jpg);
	background-color: #8c8c8c;
	text-align: left;
	margin: 0 0 0 0px;
	background-attachment: fixed;
	background-repeat: repeat;	
	padding: 0;
	}
	
#page {
	text-align: left;
	top: 0px;
	margin: 0 auto;
	width: 980px;
	text-align: left;
	position: relative;


	}
	
#pageshadow {
	background-color: #577e87;
	/*background-color: #1b9dbf;*/
	position: absolute;
	top: 70px;
	left: 572px;
	height: 61px;
	width: 478px;
	z-index: 59;

	}
	
.datetime {
float:left;
height:50px;
width:50px;
background-image:url(../images/date.png);
font-size:10px;
font-weight:700;
text-align:center;
color:#161803;
line-height:20px;
margin:0 10px 0 0;
}

/*//////////////////////////////////////////////////*/
/* Style-Anweisungen für den grundsätzlichen        */
/* Seitenaufbau und Platzierung                     */
/*//////////////////////////////////////////////////*/

#header {

	width: 980px;
	height: 355px;
	position: relative;
	top: 73px;
	background-color: #77aab5;
	background-image:url(../images/cm_header_bg.jpg);
	border-top: 10px solid #77aab5;

	border-bottom: 0px solid #2e3d49;
	/*background-color: #7b989e;*/
	padding: 0 0 0 0px;
	text-align: left;
	vertical-align: top;

}

#banner {
	text-align: center;
	top: 5px;
	left: 460px;
	width: 475px;
	height: 58px;
	position: absolute;
	background-color: #77aab5;
	margin-top: 0px;
	padding: 5px;
	border: 5px solid #77aab5;

	z-index: 60;
}

#bannershadow {
	background-color: #577e87;
	/*background-color: #1b9dbf;*/
	position: absolute;
	top: 12px;
	left: 472px;
	height: 61px;
	width: 478px;
	z-index: 59;
	}
	
#banner img {
	border: 0px solid #8B1312;
}

#mainmenue {
	top: 378px;
	left: 47px;
	height: 64px;
	width: 368px;
	position: absolute;
	padding: 0 0 0 5px;
	background-color: #2e3d49;
	z-index: 13;
}
#mainmenue A {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: bold;
	text-transform: uppercase;
	color: #FFFFFF;
	text-decoration: none;
	letter-spacing: -1px;
}

#mainmenue a:hover {

	color: #78adb9;
	text-decoration: none;

}

#mainmenueshadow {
	background-color: #577e87;
	/*background-color: #1b9dbf;*/
	position: absolute;
	top: 388px;
	left: 57px;
	height: 50px;
	width: 373px;
	z-index: 12;
	}






/* Footer mit Maillist Feld*/
#footer {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	width: 932px;
	background-color: #202C35;
	background-image:url(../images/cm_footer_bg.jpg);
	border: 0px;
	height: 78px;
	color: #FFFFFF;
	padding-top: 6px;
	padding-left: 48px;
}

#footer .text {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	color: #FFFFFF;
	}

#footer .text2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	color: #FFFFFF;
	}

#footer .text2 A {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	color: #FFFFFF;
	}

#rand {
	height: 60px;
	width: 10px;
	border-left-width: 3px;
	border-left-style: solid;
	border-left-color: #2e3d49;
}


/*//////////////////////////////////////////////////*/
/* Latest Updates Oben                              */
/*//////////////////////////////////////////////////*/

#latest {
	text-align: left;
	background-color: #2e3d49;
	/*width: 780px;*/
	padding: 0 10px;
	margin: 0 auto;
	text-align: left;
	border: 10px solid #FFFFFF;
	position: absolute;
	left: 562px;
	top: 37px;
	height: 246px;
	width: 324px;
	letter-spacing: -1px;
	z-index: 8;

}

#latestshadow {
	background-color: #577e87;
	position: absolute;
	left: 572px;
	top: 47px;
	height: 266px;
	width: 362px;
	z-index: 7;
	}



#latest .latestheader {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #FFFFFF;
	text-transform: uppercase;
	font-weight: bold;
	}



/*//////////////////////////////////////////////////*/
/* Formatierungen und Platzierung der Content-Seiten*/
/*//////////////////////////////////////////////////*/


#contentbox {
	padding: 5px 0;
	margin: 10px auto;
	text-align: center;
	top: 125px;
	left: 30px;
	width: 889px;
	background-color: #5A5A5A;
	position: absolute;
	height: auto;
	color: #FFFFFF;

	}

#content {
		background-color: #2e3d49;
/* "!important" box-model hack for IE */
			width: 900px!important;
	/*width: 780px;*/
			padding: 100px 30px 20px 50px;
			text-align: left;
	}

#content .text {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	color: #FFFFFF;
	}
	
#content .text A:link, A:active, A:visited {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	color: #afb8ba;
	text-decoration: none;
}

#content .text a:hover {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	color: #FFFFFF;
	text-decoration: none;

}
#content .newsheader A {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 22px;
	color: #77aab5;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: -1px;
	text-decoration: none;
	}

#content .intheader {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 22px;
	color: #77aab5;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: -1px;
	}	

#content h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 22px;
	color: #77aab5;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: -1px;
	}	
	
/*//////////////////////////////////////////////////*/
/* Header Formatierung Boxen                        */
/*//////////////////////////////////////////////////*/

#newsheadeline {
	/*background-color:#BFE10E;
	 background-image:url(../images/blog-title-back.png);*/
	background-repeat:repeat-x;
	filter : alpha(opacity=100);
	-moz-opacity: 1.0;
	text-align: left;
	width: auto;
	padding: 0px;
	margin: 5px 5px 5px 15px;
	height: auto;
	color: #FFFFFF;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-transform: uppercase;
	font-weight: bold;
	
	}

#latestheadeline {
	text-align: left;
	width: auto;
	padding: 0px;
	margin: 5px 5px 5px 15px;
	height: auto;
	color: #FFFFFF;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-transform: uppercase;
	font-weight: bold;
	
	}

/*//////////////////////////////////////////////////*/
/* Images bekommen Rahmen in den Content Seiten     */
/*//////////////////////////////////////////////////*/
#mainmenue img {
	border: 1px solid #000000;
}

#content img {
	border: 4px solid #FFFFFF;
}

#content .img_ohne {
	border: 0px solid #8B1312;
}

#latest img {
	border: 4px solid #FFFFFF;
}

#footer img {
	border: 0px solid #FFFFFF;
}


/*//////////////////////////////////////////////////*/
/* ToolTip Bubbles                                  */
/*//////////////////////////////////////////////////*/

div.tooltip {
	width: 200px;
	color: #000;
	text-align: center;
	z-index:40;
}

div.tooltip h4 {
	font-family: Arial, Helvetica, sans-serif;
	color: #000;
	font-weight: bold;
	text-shadow: 2px 2px 1px #222;
	margin: 0;
	padding: 13px 10px 5px;
	background: url(../images/balloonw.png) top left no-repeat !important;
	background: url(../images/balloonw.gif) top left no-repeat;
	font-size: 11px;
}

div.tooltip p {
	font-family: Arial, Helvetica, sans-serif;
	margin: 0;
	padding: 0 10px 15px;
	text-shadow: 2px 2px 1px #222;
	background: url(../images/balloonw.png) bottom left no-repeat !important;
	background: url(../images/balloonw.gif) bottom left no-repeat;
	font-size: 12px;
}

.inner {
	z-index:40;
	position:relative;
}

/*//////////////////////////////////////////////////*/
/* AB HIER DIE STYLE-ANWEISUNGEN FÜR LIGHTBOX AJAX EFFEKTE 
/* - Steuert die Bilder Pop-Ups*/
/* LIGHTBOX EFFEKT */
/*//////////////////////////////////////////////////*/
#lightbox{
	position: absolute;
	top: 2;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#lightbox a img{ border: none; }

#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	}

#imageContainer{
	padding: 6px;
	}

#loading{
	position: absolute;
	top: 20%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
	}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(../images/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }


#imageDataContainer{
	font: 10px "Times New Roman", Times, serif;
	color: #647928;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	}

#imageData{
	padding:0 10px;
	}
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: normal;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	}	
		
#overlay{
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 90;
	width: 100%;
	height: 400px;
	background-color: #647928;
	filter:alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
	}
	

.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}

* html>body .clearfix {
	display: inline-block; 
	width: 100%;
	}

* html .clearfix {
	/* Hides from IE-mac \*/
	height: 1%;
	/* End hide from IE-mac */
	}	
#contentPad{
margin:20px;
}


/*//////////////////////////////////////////////////*/
/* Syle-Code für Buttons, Auswahlfelder, etc.       */
/*//////////////////////////////////////////////////*/	
.button{
	border: 1px solid #FFFFFF;
	font-family:Arial, Helvetica,sans-serif;
	font-size: 9px;
	text-align:left;
	padding-left:2px;
	padding-top:1px;
	padding-bottom:1px;
	font-weight:normal;
	color: #FFF;
	background-color: #77aab5;
	display:inline;
	width:auto;
	cursor: hand;
	height: 14px;
}
.input{
	font-family:Arial, Helvetica, sans-serif;
	font-size: 9px;
	text-align:left;
	padding-left:2px;
	padding-top:2px;
	padding-bottom:2px;
	font-weight:normal;
	color: #FFF;
	background-color: #77aab5;
	display:inline;
	width:auto;
	cursor: hand;
	border: 1px solid #FFFFFF;
	height: 10px;
}

/*//////////////////////////////////////////////////*/
/* Syle-Code für Newsletter Felder.                 */
/*//////////////////////////////////////////////////*/	
.buttonletter {
	border: 0px solid #FFFFFF;
	font-family:Arial, Helvetica,sans-serif;
	font-size: 9px;
	text-align:left;
	padding-left:2px;
	padding-top:1px;
	padding-bottom:1px;
	font-weight:normal;
	color: #FFF;
	background-color: #2e3d49;
	display:inline;
	width:auto;
	cursor: hand;
	height: 14px;
}
.inputletter {
	font-family:Arial, Helvetica, sans-serif;
	font-size: 9px;
	text-align:left;
	padding-left:2px;
	padding-top:2px;
	padding-bottom:2px;
	font-weight:normal;
	color: #FFF;
	background-color: #2e3d49;
	display:inline;
	width:auto;
	cursor: hand;
	border: 0px solid #FFFFFF;
	height: 10px;
}