/* CSS Document */


/* alles zuruecksetzen */

* { margin: 0; padding: 0; }




/* ###################### */
/* 	body-text und sonstige 
formatierungen definieren */


body {
	font-family: 'trebuchet ms',verdana,arial,sans-serif;
	font-size: small;
	color: #666;
	height: 100%;	
}

/*  die hyperlinks gestalten */

a { 
	text-decoration: none;	
}


h1, h2, h3, h4, h5 {
	font-family: 'trebuchet ms',arial,verdana,sans-serif;
	color: #333;
	padding: 5px;	
}

h1 { font-size: 115%; }
h2 { font-size: 105%; }
h3 { font-size: 101%; }
h4 { font-size: 95%; }




/* ###################### */
/* 	verschachtelte styles */


address {
	font-family: 'trebuchet ms',arial,verdana,sans-serif;
	color: #000;
	text-align: center;
	/* font-weight: bold; */
	padding: 0;
	margin: 0;
	line-height: 0.3em;	
}



/* ###################### */
/* 	die div-container definieren */


#wrap {
	width: 760px;	
	margin: 0 auto; 
}

/* der dreigeteilte kopfbereich */

#header {
	width: 100%;
	background-color: #bf0202;
	height: 170px;
}

/* navi top siehe weiter unten */

/* .... \\\\ |||||  /////  .... */



/* ######### NAVI ############ 
*/

/*  das menue oben : */



#navi-top {
	width: 100%;
	background-color: #bf0202;
	height: 25px;
	text-align: center;
}

#navi-top ul {
	width: 760px;
	list-style-type: none;
}


#navi-top ul li {
	display: inline;
	padding: 0 15px 0 15px;
	border-left: 1px solid #fff;
}

#navi-top a {

	font-size: 101%;
}

/* aktive seite soll grau hinterlegt sein */
/* wird ueber definition des body-id festgesetzt */

/*
#navi-top a:hover,
#navi-top a:focus,
#start #navi01 a,
#aktuelles #navi02 a,
#veranstaltungen #navi02 a,
#anderswelten #navi03 a,
#ueber-uns #navi04 a,
#bezug #navi05 a,
#redaktion #navi06 a,
#kontakt #navi07 a,
{
	color: #999;

}
*/
/* von bo hinzugefügt */
.top:link { color: #fff; text-decoration: none; }
.top:visited { color: #fff; text-decoration: none; }
/*.top:focus { color: #fff; text-decoration: none; }*/
.top:active { color: #fff; text-decoration: none; }
.top:hover { color: #999; text-decoration: none; }

.topaktuell:link { color: #999; text-decoration: none; }
.topaktuell:visited { color: #999; text-decoration: none; }
/*.topaktuell:focus { color: #999; text-decoration: none; }*/
.topaktuell:active { color: #999; text-decoration: none; }
.topaktuell:hover { color: #999; text-decoration: none; }


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

/* ....   'container' 

- folgt dem kopfbereich, ist relativ zu diesem positioniert 
und somit positionieren sich die beiden spalten-divs darin 
absolut zu 'container' */


#container {
	position: relative;
}


/* das menue links */
/* 31-1-2010: geaendert von
	width: 170px;
auf
	width: 170px;
*/

#navi-links {
	position: absolute;
	width: 140px;
	padding: 10px;
	text-align: left;
}

/* sternchen-hack fuer ie lte 6 */

* html #navi-links { padding-left: 38px; }



#navi-links ul li {
	list-style-type: none;
	padding: 15px 0 0 0;
	text-align: left;
}


#navi-links a {
	font-size: 101%;
	text-align: left;
}


/* und die zweite ebene eingerueckt */

#navi-links ul ul li {
	list-style-type: none;
	padding-left: 35px;
}

/* von bo hinzugefügt */
.aktuell:link { color: red; text-decoration: none; }
.aktuell:visited { color: red; text-decoration: none; }
/*.aktuell:focus { color: red; text-decoration: none; }*/
.aktuell:active { color: red; text-decoration: none; }
.aktuell:hover { color: red; text-decoration: underline; }

.linke:link { color: #333; text-decoration: none; }
.linke:visited { color: #333; text-decoration: none; }
/*.linke:focus { color: #333; text-decoration: none; }*/
.linke:active { color: red; text-decoration: underline; }
.linke:hover { color: red; text-decoration: underline; }



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


/* #####  der INHALT #######

positioniert sich durch margin-left 
rechts des div navi-links

*/


#inhalt {
	background-color: white;
	padding: 30px;
	margin: 10px;
	margin-left: 211px;
	border-left: 1px dotted #669;
	
	/* durch min-height wird springen der gesamten seite
	bei	geringem imhalt vermieden */
	min-height: 550px;
}

#inhalt p {
	margin: 5px;
	padding: 10px;
}

#inhalt p a {
	text-decoration: underline;
	color: red;
}

#inhalt ul {
	list-style-type: circle;
	padding-left: 25px;
}

#inhalt ul a {
	text-decoration: underline;
	color: red;
}

#inhalt td a {
	text-decoration: underline;
	color: red;
}


/* zu beginn des inhalts-containers 
steht ein absatz mit kleinem bild 
der div-container toptext als class */

div.toptext {
}

div.toptext img {
	float: right;
	margin: 0 5px 15px 15px;
}


div.toptext p {
	float: left;
}


/* unordered list im inhalt soll in sich mehr abstand haben */

#inhalt ul li {
	margin: 3px;
}


/* #####  der INHALT der STARTSEITE #######
*/


#inhaltstart {
	background-color: white;
	padding: 30px;
	margin: 10px;
	margin-left: 51px;
	/* border-left: 1px dotted #669; */
}

#inhaltstart p {
	margin: 5px;
	padding: 10px;
}

#inhaltstart p a {
	text-decoration: underline;
	color: red;
}

#inhaltstart ul {
	list-style-type: circle;
	padding-left: 25px;
}


/* wir definieren noch eine kleine
galerie fuer die bilderseiten  */


#galerie {
	background-color: white;
	/* der IE mag position: relative nicht :-( */
	/* position: relative; */
	padding: 30px;
	margin: 10px;
	margin-left: 211px;
	border-left: 1px dotted #669;
	
	/* durch min-height wird springen der gesamten seite
	bei	geringem imhalt vermieden */
	min-height: 550px;
	float: left;
	width: 390px;	
}

#galerie dl {
	overflow: hidden;
	margin: 5px 10px;
	padding: 4px;
	float: left;
	display: block;
	width: 134px;
	border: 1px solid #fff;
}

#galerie dt {
	border: 1px solid #eee;
	background-color: #fff;
	border-bottom: 1px solid #aaa;
	padding: 10px;
	margin: 5px 0;
}

#galerie dt img {
	border: 1px solid #aaa;
	border-bottom: 1px solid #333;
}

#galerie dd {
	font-size: 0.7em;
	padding: 0 5px;
	color: #333;
}

#galerie dl:hover {
	background: #EFEFEF;
	border: 1px solid #eee;	
	border-bottom: 1px solid #aaa;
}



/* ###################### */
/* 	der Footer */


#footer {
	position: relative;
	width: 740px;
	padding: 5px;
	margin: 0 auto;
	text-align: center;
	height: 150px;
	border-top: 1px dotted #669;	
}

#subfoot {
    min-height: 250px;
}



/* ###################### */
/* 	klassen definieren */

/*  leer */


table { padding-left: 15px; }

table img { padding: 10px; }




/* ###################### */
/* Das Kontaktformular */

form {
	background-color: #EEEEEE;
	width: 370px;
	padding: 20px;
	border: 1px solid #8C8C8C;
}

label {
	display: block;
	cursor: pointer;
}
input#absender,
textarea {
	width: 300px;
	border: 1px solid #8C8C8C;
	margin-bottom: 1em;
}
textarea {
	height: 7em;
}

input#absender:focus,
textarea:focus {
	background-color: #D9D9D9;
}

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




