/* ========================================================================= 
Stylesheet für Roßlau
Datei: bildschirm.css
Stand: 09.04.2014
Auto: Christel Heppner
Kunde: Roßlau

Aufbau:	1. Kalibrierung und allgemeine Styles
		2. Styles für Layoutbereiche
		3. Sonstige Styles
========================================================================= */


/* ========================================================================= 
1. Kalibrierung und allgemeine Styles
========================================================================= */

* { padding: 0; margin: 0; } /* Abstände für alle Elemente auf Null setzen */
/*  * html #navibereich { width: 18em; }  Patch für ausschließlich IE6 */



  * html #navibereich {
    width: 100%;   /* Breitenangabe fuer IE 5.x */
    w\idth: 18em;  /* Breitenangabe fuer IE 6 */
  }





h2, p, ul, ol { margin-bottom: 1em; } /* Abstand nach unten korrigieren */
ul ul { margin-bottom: 0; } /* ohne Abstand bei verschachtelten Listen */
li { margin-left: 1em; } /* Abstand nach links korrigieren */

/* allgemeine Selektoren */

html { height: 101% } /* erzwingt Scrollbar im Firefox */
body { /* Gestalte das HTML-Element mit dem Namen body = allg. Hintergrund */
	color: black; /* Schriftfarbe */
	background-color: #004080; /* Hintergrundfarbe */
	font-family: Verdana, Arial, Helvetica, sans-serif; /* Schriftart */
	font-size: small;  /* Schriftgröße ... veränderbar */
}


h1 { font-size: 150%; }
h2 { font-size: 130%; }

.bildlinks {
	display: inline;
	float: left;
	padding: 3px;
	border: 1px solid #13467b;
	margin-right: 10px;
	margin-bottom: 10px;
}
.bildrechts {
	display: inline;
	float: right;
	padding: 3px;
	border: 1px solid #13467b;
	margin-bottom: 10px;
	margin-left: 10px;
}

.bildohne {
	display: inline;
	float: right;
	padding: 3px;
	border: none;
	margin-bottom: 10px;
	margin-left: 10px;
}

address {
	text-align: center; /* zentrieren */
	font-size: 70%; /* etwas kleiner */
	font-style: normal; /* normale Schrift, nicht kursiv */
	letter-spacing: 2px; /* Laufweite etwas grösser */
	line-height: 1.5em; /* Zeilenabstand */
}

/* Hyperlinks allgemein */

a { text-decoration: none; } /* Unterstreichung entfernen */
a:link { color: #000; } /* Reihenfolge der Zustände ist sehr wichtig!!! */
a:visited { color: #000; } 
a:hover, a:focus { /* hover: wenn der Mauszeiger darüber schwebt; focus: beim Durchsteppen mit TAB-Taste  */
	border-bottom: 1px solid #000; /* Blau */
} 
a:active { /* active: der gerade angeklickt wird */
	color: white;
	background-color: #009; /* Hinterlegung des Links mit Farbbalken hier: Blau */
}

/* allgemeine Klassen und ID's */

.skiplink { /* den Skiplink für Screenreader ausblenden ... mit display: none liest auch der screenreader nicht mehr vor!!! */
	position: absolute;
	top: -2000px;
	left: -3000px;
	width: 0px;
	height: 0px;
	overflow: hidden;
	display: inline;
}
#logo { 
	color: black;
	background-color: white;
	padding: 5px; /* Auffüllung der Inhaltsfarbe Weiß um 5px um das Logo herum */
	border: 5px solid #d9d9d9; /* hellgraue durchgezogene Linie von 5px */
}

/* ========================================================================= 
2. Styles für Layoutbereiche
========================================================================= */

#wrapper { /* Gestalte das HTML-Element mit der id="wrapper" = Schutzumschlag */
	color: #031c47; /* Legt Farbe für Schrift im Inhalt fest o. Bild in Inhaltsbereich bei mehr Text überlagert */
	background: white;  /* Legt Farbe für bg im Inhalt fest o. Bild in Inhaltsbereich bei mehr Text überlagert */
	width: 660px; /* Breite des Inhaltsbereiches */
	margin: 0px auto; /* Abstand nach oben */
}



#kopfbereich {
	position: relative; /* Element ist positioniert für eingebundene Elemente bleibt aber im Fluss */
	color: #000000;
	background-color: #019be1; /* Head bg Farbe */
	background-image: url(image/other/bg_logo.jpg);  /*für Head */
	padding: 0px 0px 0px 0px; /* Innenabstände definieren */
	/* border-top: 2px solid #cc0000;*/
}
	#kopfbereich p {
		position: absolute;
		top: 10px;
		right: 10px;
		font-weight: bold;
		padding: 5px 0;
		margin-bottom: 0;
	}
	#kopfbereich p span {
		color: #cc0000;  /* Farbe der Schrift im Absatz im Kopfbereich */
	}



#textbereich {
	float: left; /*Platzierung des Textes neben der Navigation*/
	width: 630px;
	padding: 15px 10px 20px 20px; /* Innenabstände definieren o re u li*/
	background-color: #ffffff; /* Hintergrundfarbe */
}

#textbereich a { /* Hyperlinks nur im Textbereich anders markieren??? */
	border-bottom: 1px dotted #019be1;
}
	#textbereich a:hover, /* Hyperlinks nur im Textbereich werden durchgezogen ... vorher gepunktet */
	#textbereich a:focus {
		border-bottom: 1px solid #019be1;
	}
	
.Hellblau {
	color: #019be1
	}	
	
.Klein {
	font-size:9px
	}
	

/* #textbereich p {
	margin-right: 300px;
	}
*/

#fussbereich { /* Abstand und eine obere Rahmenlinie für den Fussbereich erstellen */
	clear: both;
	color: #ffffff;
	background-color: #13467b;
	padding: 5px 20px 10px 20px; /* Abstand zwischen address und Rahmenlinie darüber ... re unten li */
	border-top: 4px solid #fbec9a; /* Rahmenlinie oben */
	border-bottom: 1px solid #009add;
	/* margin-top: 20px; Abstand zwischen Linie und Element darüber entfernt */
}


#fussbereich a { text-decoration: none; } /* Unterstreichung entfernen */
#fussbereich a:link { color: #f019be1; } /* Reihenfolge der Zustände ist sehr wichtig!!! */
#fussbereich a:visited { color: #019be1; } 
#fussbereich a:hover, a:focus { /* hover: wenn der Mauszeiger darüber schwebt; focus: beim Durchsteppen mit TAB-Taste  */
	border-bottom: 1px solid #019be1; /*  */
} 
#fussbereich a:active { /* active: der gerade angeklickt wird */
	color: white;
	background-color: #019be1; /* Hinterlegung des Links mit Farbbalken hier:  */
}



/* ========================================================================= 
ENDE des Stylesheets (standardkonform, barrierefrei und flexibel!!!
========================================================================= */