/* CSS Document */
body {
	margin:0; 
	padding:0;
	font: 90% Arial, Helvetica, Verdana, sans-serif;
	text-align:center;
	color: #383838;
	background: #383838 url(../imgs/hg_bild_gross_alt.jpg) repeat-x center top;
	line-height: 1.1em;
}
#logo {
	position: relative;
	margin: 0 auto;
	width: 832px;
	height: 31px;
	text-align: left;
	background: transparent url(../imgs/logo_bild_gross_alt.gif) no-repeat left top;
}
#logo a img.logo {	
	border: none;
	position:absolute;
	left:-1000px;
	top:-1000px;
	width:0px;
	height:0px;
	overflow:hidden;
	display:inline;
}
#logo .farbwechsel {
	position: absolute;
	right: 0;
	top: 0;
	background: #383838 url(../imgs/styleswitcher_ecke_mittel.gif) no-repeat left bottom;
	color: #767676;
	margin: 0;
	padding: 3px 5px 2px 8px;
	font-size: 90%;
}
#logo .farbwechsel a img {
	border: none; 
}
#center_quer {
	/*width:830px;*/ /*470*/
	/*height:735px; 705*/
	/*position:absolute;*/
	/*margin-top:-407px; 1/2 Hoehe plus 30-40 px fuer die Untertitel*/
	/*margin-left:-250px;*/
	/*top: 50%;*/
	/*left:50%;*/
	margin: 10px auto 5px auto;
/*	background-color:#ccc;*/
	text-align:center;
	font-size:0.9em;
/*	border: 1px solid #ff00ff;*/	
}
/*
#center_quer {
	width:830px;
	height:533px; 
	position:absolute;
	margin-top:-307px;
	margin-left:-415px;
	top: 50%;
	left:50%;
	text-align:center;
	font-size:0.9em;
}
*/
#hintergrund_quer {
	width:831px;
	margin:0 auto;
	background-color:#767676;
	padding: 0 0 .4em 0;
	border: 1px solid #383838;
}
#hintergrund_hoch {
	width:500px;
	margin:0 auto;
	background-color:#767676;
	padding: 0 0 .4em 0;
	border: 1px solid #383838;
}


/* ################################################################################ */
/* ################################################################################ */

/* Erweiterung der Styles fuer zusaetzliche Navigation UEBER den Bildern */ 

/* ################################################################################ */
/* ################################################################################ */


/* ############## # # # ############### */
/* Querformat */
#hintergrund_quer #hintergrund-bild-einfuegen {
	position: relative;
	border: 1px solid #383838;
	width: 800px; 
	height: 533px;
	margin: 15px;
}
#hintergrund_quer .button_bild_vor {
	position: absolute;	
	top: 0;
	left: 539px;
/*	border: 1px solid #ff00ff;*/
	width: 261px;
	height: 531px;
	margin: 1px;
}
#hintergrund_quer .button_bild_zurueck {
	position: absolute;	
	top: 0;
	left: -2px;
	width: 260px;
	height: 531px;
	margin: 1px;
}
#hintergrund_quer .button_galerieuebersicht {
	position: absolute;	
	top: -2px;
	left: 264px;
	width: 270px;
	height: 170px;
/*	border: 1px solid blue; */
	margin: 1px;
}
#hintergrund_quer .button_kommentare, 
#hintergrund_quer .button_kommentare_eins, 
#hintergrund_quer .button_kommentare_zwei, 
#hintergrund_quer .button_kommentare_drei, 
#hintergrund_quer .button_kommentare_dreiplus, 
#hintergrund_quer .button_kommentare_ohne {
	position: absolute;	
	top: 174px;
	left: 264px;
	width: 270px;
	height: 180px;
/*	border: 1px solid yellow;*/
	margin: 1px;
}

#hintergrund_quer .button_infos, #hintergrund_quer .button_infos_ohne {
	position: absolute;	
	top: 358px;
	left: 264px;
	width: 270px;
	height: 175px;
/*	border: 1px solid red; */
	margin: 1px;
}

/* ############## # # # ############### */
/* Hochformat */
#hintergrund_hoch #hintergrund-bild-einfuegen {
	position: relative;
	border: 1px solid #383838; 
	width: 470px; 
	height: 705px;
	margin:15px;
}
#hintergrund_hoch .button_bild_vor {
	position: absolute;	
	top: 0;
	left: 313px;
/*w	border: 1px solid #ff00ff; */
	width: 158px;
	height: 703px;
}
#hintergrund_hoch .button_bild_zurueck {
	position: absolute;	
	top: 0;
	left: -1px;
/*	border: 1px solid #00ff00; */
	width: 155px;
	height: 703px;
}
#hintergrund_hoch .button_galerieuebersicht {
	position: absolute;	
	top: -1px;
	left: 159px;
	width: 150px;
	height: 231px;
/*	border: 1px solid blue; */
}
#hintergrund_hoch .button_kommentare, 
#hintergrund_hoch .button_kommentare_eins, 
#hintergrund_hoch .button_kommentare_zwei, 
#hintergrund_hoch .button_kommentare_drei, 
#hintergrund_hoch .button_kommentare_dreiplus,
#hintergrund_hoch .button_kommentare_ohne {
	position: absolute;	
	top: 235px;
	left: 159px;
	width: 150px;
	height: 231px;
/*	border: 1px solid yellow; */
}
#hintergrund_hoch .button_infos, #hintergrund_hoch .button_infos_ohne {
	position: absolute;	
	top: 472px;
	left: 159px;
	width: 150px;
	height: 234px;
/*	border: 1px solid red; */
}


/* ############## # # # ############### */
/* Buttons allgemein */

.button_bild_vor a:link, .button_bild_vor a:visited, .button_bild_vor a:hover, .button_bild_vor a:active, .button_bild_vor a:focus, 
.button_galerieuebersicht a:link, .button_galerieuebersicht a:visited, .button_galerieuebersicht a:hover, .button_galerieuebersicht a:active, .button_galerieuebersicht a:focus, 
.button_kommentare a:link, .button_kommentare a:visited, .button_kommentare a:hover, .button_kommentare a:active, .button_kommentare a:focus, 
.button_kommentare_eins a:link, .button_kommentare_eins a:visited, .button_kommentare_eins a:hover, .button_kommentare_eins a:active, .button_kommentare_eins a:focus, 
.button_kommentare_zwei a:link, .button_kommentare_zwei a:visited, .button_kommentare_zwei a:hover, .button_kommentare_zwei a:active, .button_kommentare_zwei a:focus, 
.button_kommentare_drei a:link, .button_kommentare_drei a:visited, .button_kommentare_drei a:hover, .button_kommentare_drei a:active, .button_kommentare_drei a:focus, 
.button_kommentare_dreiplus a:link, .button_kommentare_dreiplus a:visited, .button_kommentare_dreiplus a:hover, .button_kommentare_dreiplus a:active, .button_kommentare_dreiplus a:focus, 
.button_kommentare_ohne a:link, .button_kommentare_ohne a:visited, .button_kommentare_ohne a:hover, .button_kommentare_ohne a:active, .button_kommentare_ohne a:focus, 
.button_infos a:link, .button_infos a:visited, .button_infos a:hover, .button_infos a:active, .button_infos a:focus,
.button_infos_ohne a:link, .button_infos_ohne a:visited, .button_infos_ohne a:hover, .button_infos_ohne a:active, .button_infos_ohne a:focus,
.button_bild_zurueck a:link, .button_bild_zurueck a:visited, .button_bild_zurueck a:hover, .button_bild_zurueck a:active, .button_bild_zurueck a:focus 
{
	display: block; 
	margin: 0;
	padding: 0;
/*	border: 1px solid #00ff00;*/
	width: auto; 
	height: 100%;
}

/* Zuweisung der Bilder fuer die Mouseovers ... */

/* ein Bild vor */
.button_bild_vor a:link, .button_bild_vor a:visited 
{
	background: transparent url(../imgs/button_bild_vor.gif) no-repeat center center;
}
.button_bild_vor a:hover, .button_bild_vor a:active, .button_bild_vor a:focus
{
	background: transparent url(../imgs/button_bild_vor_over.gif) no-repeat center right;	
}

/* Galerieuebersicht */
.button_galerieuebersicht a:link, .button_galerieuebersicht a:visited 
{
	background: transparent url(../imgs/button_bild_galerieuebersicht.gif) no-repeat center center;
}
.button_galerieuebersicht a:hover, .button_galerieuebersicht a:active, .button_galerieuebersicht a:focus
{
	background: transparent url(../imgs/button_bild_galerieuebersicht_over.gif) no-repeat center top;	
}

/* Kommentare */
.button_kommentare a:link, .button_kommentare_eins a:link, .button_kommentare_zwei a:link, .button_kommentare_drei a:link, .button_kommentare_dreiplus a:link, .button_kommentare_ohne a:link,
.button_kommentare a:visited, .button_kommentare_eins a:visited, .button_kommentare_zwei a:visited, .button_kommentare_drei a:visited, .button_kommentare_dreiplus a:visited, .button_kommentare_ohne a:visited
{
	background: transparent url(../imgs/button_bild_kommentar.gif) no-repeat center center;
}
/* Kommenate over */
.button_kommentare a:hover, .button_kommentare a:active, .button_kommentare a:focus
{
	background: transparent url(../imgs/button_bild_kommentar_over.gif) no-repeat center center;	
}
.button_kommentare_eins a:hover, .button_kommentare_eins a:active, .button_kommentare_eins a:focus
{
	background: transparent url(../imgs/button_bild_ein_kommentar_over.gif) no-repeat center center;	
}
.button_kommentare_zwei a:hover, .button_kommentare_zwei a:active, .button_kommentare_zwei a:focus
{
	background: transparent url(../imgs/button_bild_zwei_kommentar_over.gif) no-repeat center center;	
}
.button_kommentare_drei a:hover, .button_kommentare_drei a:active, .button_kommentare_drei a:focus
{
	background: transparent url(../imgs/button_bild_drei_kommentar_over.gif) no-repeat center center;	
}
.button_kommentare_dreiplus a:hover, .button_kommentare_dreiplus a:active, .button_kommentare_dreiplus a:focus
{
	background: transparent url(../imgs/button_bild_dreiplus_kommentar_over.gif) no-repeat center center;	
}
.button_kommentare_ohne a:hover, .button_kommentare_ohne a:active, .button_kommentare_ohne a:focus
{
	background: transparent url(../imgs/button_bild_kommentar_ohne_over.gif) no-repeat center center;	
}
/* War gedacht um die Anzahl der Kommentare auf dem Bild auszugeben ... mal abwarten ob das zum Zuge kommt.
.button_kommentare a:hover .anzahl_kommentare_bildmitte, .button_kommentare a:active .anzahl_kommentare_bildmitte, .button_kommentare a:focus .anzahl_kommentare_bildmitte
{
	position: absolute;	
	top: 0px !important;
	left: 0px !important;
	width: 268px;
	height: 178px;
	height: 89px;
	margin-top: 50px;
	padding-top: 27px;
	border: 1px solid #00ff00;
	text-decoration: none;
	color: #767676;
}

/* Bildinfo */
.button_infos a:link, .button_infos a:visited 
{
	background: transparent url(../imgs/button_bild_info.gif) no-repeat center center;
}
.button_infos a:hover, .button_infos a:active, .button_infos a:focus
{
	background: transparent url(../imgs/button_bild_info_over.gif) no-repeat center bottom;	
}

/* OHNE Bildinfo */
.button_infos_ohne a:link, .button_infos_ohne a:visited 
{
	background: transparent url(../imgs/button_bild_info.gif) no-repeat center center;
}
.button_infos_ohne a:hover, .button_infos_ohne a:active, .button_infos_ohne a:focus
{
	background: transparent url(../imgs/button_bild_info_ohne_over.gif) no-repeat center bottom;	
}

/* ein Bild zurueck */
.button_bild_zurueck a:link, .button_bild_zurueck a:visited 
{
	background: transparent url(../imgs/button_bild_zurueck.gif) no-repeat center center;
}
.button_bild_zurueck a:hover, .button_bild_zurueck a:active, .button_bild_zurueck a:focus
{
	background: transparent url(../imgs/button_bild_zurueck_over.gif) no-repeat center left;	
}
/* ################################################################################ */
/* ################################################################################ */


#center_quer img {
	margin:15px;
	padding:0;
}
#center_quer a img {
	border:1px solid #383838;
}
h1 {
	font-weight:bold;
	font-size: 1.4em;
	line-height:1.2em;
	margin:0;
	padding:0;
}
.datum {
	font-weight:normal;
	font-size:.7em;
	margin:0;
	padding:0;
}
p.navi  {
	font-size:1em;
	margin:5px 0;
	padding:.6em .2em .6em .2em;
	background-color:none;
	color:#5E5E5E;
}
p.navi a:link {
	margin:0;
	padding: 10px 10px 10px 18px;
	font-size:1em;
	color:#5E5E5E;
	text-decoration:none;
}
p.navi a:visited {
	margin:0;
	padding: 10px 10px 10px 18px;
	font-size:1em;
	color:#5E5E5E;
	text-decoration:none;
}
p.navi a:hover, p.navi a:active, p.navi a:focus {
	margin:0;
	padding: 10px 10px 10px 18px;
	font-size:1em;
	color:#5E5E5E;
	text-decoration:underline;
}
p.navi a.kommentar {
	background: url(../imgs/bild_gross_kommentar.gif) no-repeat left center;
}
p.navi a.ohne_kommentar {
	background: url(../imgs/bild_gross_ohne_komentar.gif) no-repeat left center;
}
p.navi a.infos {
	background: url(../imgs/bild_gross_info.gif) no-repeat left center;
}
p.navi a.ohne_infos {
	background: url(../imgs/bild_gross_ohne_info.gif) no-repeat left center;
}
p.navi a.vor {
	background: url(../imgs/bild_gross_vor.gif) no-repeat right center;
	padding: 10px 18px 10px 0px;
}
p.navi a.zurueck {
	background: url(../imgs/bild_gross_zurueck.gif) no-repeat left center;
}
p.navi a.uebersicht {
	background: url(../imgs/bild_gross_uebersicht.gif) no-repeat left center;
}
/* ******************************* */
/* ****** Fehlermeldungen ******** */
	.fehlermeldung {
		background:#FFF url(../imgs/errormessage.gif) no-repeat 15px .5em;
		border-top: 1px dotted #394600;
		border-bottom: 1px dotted #394600;
		padding: .5em;
		margin: 0;
		min-height: 35px;
}
	.fehlermeldung p {
		margin: 0;
		padding: 0;
		margin-left:45px;
}



/* ******************************* */
/* ********* Text-Kaesten ******** */

.kasten_eintrag {
	text-align:left;
	width: 338px; /*362px - 2*10px = 342px <-- IE Win macht Probleme, also zur Sicherheit 338px, ein Geschenk an Microsoft!*/
	height: auto;
	background:#767676 url(../imgs/hg_kasten_bild_gross_mittel.gif) no-repeat right bottom;
/*	background-color:#E9E9E2;*/
/*	border: 1px solid #333;*/
	margin: 1.6em auto;
	padding: 10px;
	color: #383838;
}
.kasten_datum {
	margin: 0;
}
.kasten_eintrag h2 {
		font-size:1em;
		margin: 0.2em 0 0.4em 0;
}
.kasten_absatz {
	border-top: 1px dotted #383838;
	margin: 0;
	padding: 0.6em 0 0 0;
	color: #383838;
}
.kasten_zusatzinfo {
	display:block;
	width: 100%;
	background-color: #FFF;
	border-top: 1px dotted #5E5E5E;
	padding: 0.6em 0;
}
.kasten_zusatzinfo p  {
	margin:0;
	padding: 0 0.6em;	
}
.texterlaeuterung {
	margin:0;
	padding: .4em 0 0 0;
}

/* ******************************* */
/* ********** Formulare ********** */
	form { 
		margin:0;
		padding: 0;
		
	}
	input {
		display: block;
		width: 200px;
		color: #5E5E5E;
		font-size: 1em;
		font: 100% Arial, Helvetica, Verdana, sans-serif;
		background-color:#FFFFFF;
		border: 1px solid #5E5E5E;
		margin: 0 0 0 120px;
		padding: 0.2em;
		}
	.input {
		display: block;
		width: 200px;
		font-size: 1em;
		font: 100% Arial, Helvetica, Verdana, sans-serif;
		margin: 0 0 0 120px;
		padding: 0.2em;
		}
	.submit{
		text-align: center; /* fuer den lieben IE(Win), da er den Button breiter anzeigt, als definiert*/
		width: auto;
		clear: left;
		color:#FFF;
		background-color:#383838; 
		border: 1px solid #383838;
		padding: 0.2em;
		cursor: pointer;
	}
	label {
		width: 100px;
		float: left;
		text-align: right;
		margin: 0;
		padding: 0.2em;
	}
	textarea {
		display: block;
		width: 200px;
		color: #5E5E5E;
		font-size: 1em;
		font: 100% Arial, Helvetica, Verdana, sans-serif;
		background-color:#FFFFFF;
		border: 1px solid #5E5E5E;
		margin: 0 0 0 120px;
		padding: 0.2em;
	}
	.unsichtbar {
		visibility: hidden;
		display:none;
	}
	.formularbemerkung {
		margin: 0 0 0 120px;
	}




/* ******************************* */
/* ***** Links im Fliestext ****** */

.kasten_eintrag a:link, .kasten_eintrag a:visited  
{
	color:#383838;
    font-size: 100%;
    font-weight: normal;
    letter-spacing:0;
    text-decoration: none;	
	text-decoration: underline;
}

/* Mit visited-Bild rechts vom Link!
a:visited 
{
    color: #DC9F35;
    font-size: 100%;
    font-weight: normal;
    letter-spacing:0;
    text-decoration: none;
	padding-right: 15px;
	background: url(../imgs/link_visited_right.gif) no-repeat 100% 50%; 
}*/
.kasten_eintrag a:hover, .kasten_eintrag a:active, .kasten_eintrag a:focus 
{
	color:#383838;
    font-size: 100%;
    font-weight: normal;
    letter-spacing:0;
	text-decoration: none;	
	padding-right: 0;
}
.kasten_eintrag a[href^="http:"] {
	background: transparent url('../imgs/link_extern.gif') 98% 50% no-repeat;
	background: transparent url('../imgs/link_extern.gif') right 50% no-repeat;
	padding-right: 14px;	
}
.kasten_eintrag a:hover[href^="http:"] {
	background: transparent url('../imgs/link_extern.gif') 98% 50% no-repeat;
	background: transparent url('../imgs/link_extern_over.gif') right 50% no-repeat;
	padding-right: 14px;	
}