body {
	color: #333333;
	margin: 0;
	padding: 1%;
	min-width: 640px;
	font-size: Kein;
	font-family: verdana, arial, sans-serif;
	line-height: 0.8em;
}
a { color: #0B4D8C; text-decoration: underline; } 
a:visited { color: #0000FF; } 
.skip {
 position: absolute;
 margin-left: -10000px;
}
h1 { /* Die Überschrift jeder Seite stellen wir besonders da, denn sie ist sehr wichtig. */
 font-size: 3em;
 line-height: 0.8em;
 padding: 20px 0 5px 5%;
 margin: 0;
 border-bottom: 1px solid #aaa;
}
h1, h2, h3, h4, h5, h6 { /* Alle Überschriften bekommen eine besondere Farbe und da sie sehr groß sind können wir es uns erlauben hier eine Schrift mit Serifen zu wählen. Wir spielen hier ein wenig mit Typographie, und entgegen dem Einheitsbrei auf vielen Seiten. */
 color: #333333;
 font-family: Arial, Helvetica, sans-serif;
}
img { 
	
	border-top: none #999999;
	border-right: none #999999;
	border-bottom: none #999999;
	border-left: none #999999;
}
.fleft { /* Sachen an denen der Text vorbeifließen soll werden diese Klassen zugewiesen. */
	float: left;
	width: 230px;
	height: 138px;
	padding: 10px;
}
.fright {
	float: right;
	margin: 0 0 1.0em 1em;
	padding: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
}


/* -- Layoutspezifisches -- */
#container { /* Ist dafür gedacht dass die viele Formatierungen einfacher werden, und auch ein gemeinsammer Rand entstehen kann, der nicht ganz außen am Fenster ist. */
	max-width: 900px; /* Eine Begrenzung der Breite auf höhstens 900px. Das machen wir um nicht zu lange Textbreiten zu erhalten welche dann schlecht zu lesen sind. Für den IE gibt es in ielte.css einen Woraround. */
	margin: auto;
	width: 900px;
	left: 100px;
	border-right: 1px solid #666666;
	border-bottom: 1px solid #666666;
	border-left: 1px solid #666666;
	border-top-style: solid;
	border-top-width: 1px;
	border-top-color: #666666;
}

/* - Logo bzw. Kopf - */
#logo {
	background: url(../img/header.jpg) no-repeat 0 0; 
	height: 100px; 
	padding: 0 900px 0 100px;
	line-height: 100px;
	/* Das Logo soll auch in unseren Kopf passen deswegen ist es ein wenig kleiner. Durch die Angabe der Textgröße in px verhindern wir im IE die Vergrößerung und zerstörung des Layouts durch den Benutzer. Der Opera vergrößert das Bild proportional mit also kann da auch nichts passieren. */
 overflow: hidden; /* Wieder ein wenig Typografie damit das Logo besser aussieht. */
	margin: 0; /* Manche Browser haben das schon voreingestellt aber nicht alle, deshalb vereinheitlichen wir das. */
	font-size: 0.8em;
}




/* - Menü - */
#menu {
	background: #000033 url(../img/navi.jpg); /* Je kleiner das Fenster desto kleiner soll auch der Abstand des Menüs rechts und links sein. */
	margin: 0;
	text-align: right;
	color: white;
	padding: 5px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.9em;
}
#menu li {
	font-size: 0.9em;
	display: inline; /* Damit die Menüpunkte nebeneinander und nicht untereinander erscheinen. */
	list-style-type: none; /* Die Bullets vor den Menüpunkten schalten wir ab. */
	border-left: none; /* Ein optischer Trennungsstrich */
	padding: 0 20px;
	font-weight: bold;
}
#menu li a {
 color: white; /* Hier ist das mit der Linkfarbe genau so, sie soll weiß sein. */
 text-decoration: none;
}

/* - Subnavigation, Rechte Spalte - */
#subnav {
	width: 100px; /* Je kleiner das Fenster desto kleiner soll auch die Breite der Subnavigation werden, damit immer genügend Platz für den richtigen Inhalt bleibt. */
	min-width: 10em; /* Damit uns die Subnavigarion nicht zu sehr zusammengeschoben wird. */
	float: right;
	border-left: 1px solid #999999; /* Hiermit trennen wir optisch die Subnavigation vom eigentlichen Inhalt ab. */
	font-size: 0.9em; /* Die Schriftgröße setzen wir hier ein wenig herunter damit erkennbar wird dass das Informationen zweiter Rangordnung sind. */
	font-style: normal;
	padding-top: 0px;
	padding-right: 0%;
	padding-bottom: 0px;
	padding-left: 0px;
	font-family: Arial, Helvetica, sans-serif;
	margin: 100px;
	text-align: left;
	vertical-align: top;
}
#subnav dt { /* Die einzelnen Überschriften in der Subnavigation */
	font-size: 1.0em;
	font-family: Arial, Helvetica, sans-serif;
	padding: 0.5em;
	margin-top: 1em;
	border-top: 1px solid #aaa; /* Hier eine optische Trennungslinie zwischen den einzelnen Bereichen der Subnavigation. */
	width: 100px;
}
#subnav dd { /* Die Unterpunkte der Subnavigation. */
 padding: 0;
 margin: 0.2em 0;
}

/* - Her Hauptinhaltsteil - */
#main {
	 no-repeat 100% 0 white; /* Die kleine blaue halbdurchsichtige Blume wird als Hintergrundbild, welches rechts oben in der Ecke steht, deffiniert. */
	font-family: Arial, Helvetica, sans-serif;
	clear: left;
	color: #333333;
	font-size: 0.8em;
	line-height: 1.5em;
}

