/* zuerst einmal Schriftgröße und Farbe für das ganze Dokument einstellen */
html { font-family: Verdana, Helvetica, sans-serif; }
body  { font-size: 100.01%; margin: 0; padding: 0; }

/* verhindert float-Probleme beim IE/Win */
* html #pageContainer {
	/* \*/
	word-wrap: break-word;
}

/* hier gehen alle Pseudoframes rein Referenzierung über <div id="..." */
#pageContainer {
	border: solid 1px #ffc; border-width: 0 1px; margin: 0;
	min-width: 60em; width: auto; 
	font-family: Verdana, Helvetica, sans-serif; 
}

/* jetzt alle Teilcontainer definieren */
#kopf   { background: #ffc; margin: 0; padding: 0.1em 2em }
#haupt {
	border-left: 14em solid #fefecc; background: #f8f8f8;
	margin: 0; padding: 0;
}

/* alle dürfen floaten */
#nav, #inhalt,  #SOWrap { overflow: visible; position: relative;}

/* wird für rechts vor links gebraucht, besser für Barrierefreiheit */
#SOWrap  { margin-right: -1px; margin-bottom: 0; margin-left: 0; z-index: 3; width: 100%; float: left }
#inhalt  { margin: 0 0 0 -1px; padding-top: 1em; z-index: 5; width: 100%; float: right }
#nav { 
	background: #ffc; margin: 0 1px 0 -14em; z-index: 4; width: 14em;
	float: left;
}
#fuss  { background: #ffc; margin: 0; padding: 0.5em 1em 0.5em 14em }

/* ohne den sieht es nach den floats etwas grauslich aus */
.cleaner {
	clear:both; height:1px; font-size:1px; 	border:0px none;
	margin:0; padding:0; background:transparent;
}

/* und hier ein paar Formate mit Kopf und Fuss */
#kopf h1 {
	font-size: 1.5em; line-height: 1; text-align: center;
	font-weight: normal;
}
#kopf h2 {
	font-size: 1em; line-height: 1; text-align: center;
	font-weight: normal;
}
#fuss p {color: #000; line-height: 1; font-weight: normal;}
#fuss .links {font-size: 1em;}
#fuss .rechts {font-size: 0.8em;}
#fuss a:link  { text-decoration: none; color: #00f;}
#fuss a:hover, a:focus, a:active {
	font-weight: bolder; text-decoration: none;
	color: #00f; border-style: solid; border-width: 0 0 0.2em 0; 
	border-color: #00f;
}
#fuss a:visited {color: #c0c; text-decoration: none;}

/* alle Navigationselemente etwas einrücken */
#nav p {
	font-size: 0.8em; line-height: 1; color: #333; padding-left: 0.6em}
/* Klassen navi1 und navi2 für die Navigation */
a.navi1 { color: #f00; text-decoration: none; margin-left: 0 }
a.navi1:visited {color: #c0c}
a.navi1:hover, a.navi1:focus, a.navi1:active {
	border-style: solid; border-width: 0 0 0 0.5em;
	border-color: #00f; font-weight: bolder
}
a.navi2 {
	font-size: 0.9em; line-height: 1; color: #00f;
	text-decoration: none; padding: 0 0 0 1.5em;
}
a.navi2:visited {color: #c0c}
a.navi2:hover, a.navi2:focus, a.navi2:active {
	border-style: solid; border-width: 0 0 0 0.5em;
	border-color: #00f; font-weight: bolder
}
/* und die nicht-Links müssen weitestgehend auch so aussehen */
#nav p.navi1 {
	font-size: 0.8em; line-height: 1; color: #666; padding-left: 0.7em}
#nav p.navi2 {
  font-size: 0.8em; line-height: 1; color: #666; padding-left: 1.8em}

/* Hilfe-Cursor für Abkürzungen und Acronyme */
abbr[title], acronym[title] {border-bottom: 1px dashed #aaa; cursor: help}

/* "Normal"-Tags */
#inhalt h1  { color: #730; font-size: 1.1em; line-height: 1.4em; padding: 0 12px; letter-spacing: 1px}
#inhalt h2  { color: #733; font-size: 0.9em; line-height: 1.3em; padding: 0 12px; }
#inhalt h3  { color: #533; font-size: 0.8em; line-height: 1.2em; padding: 0 12px; }
#inhalt h4  { color: #333; font-size: 0.8em; line-height: 1.1em; padding: 0 12px; font-style: italic; }
#inhalt p   { font-size: 0.8em; padding: 0 12px }
#inhalt p.liste { font-size: 0.7em; line-height: 1.0em; padding: 0 12px; }

/* und Anchors */
#inhalt a {color: #00f}
#inhalt a:visited {color: #c0c;}
#inhalt a:hover, #inhalt a:focus, #inhalt a:active {background: #ade}

/* Listen */
#inhalt li {font-size: 0.8em; line-height: 1.2em;}
#inhalt li li { font-size: 0.9em }


/* Tabellen */
th,td { text-align: left; font-size: 0.8em; padding: 0 12px; }
caption { font-size: 0.9em; line-height: 0.9em; font-weight: bolder; }

/* und noch ein paar ungebundene Klassen */
.datum {color: #aaa;} /* wird grau */
/* für Standard Bild rechts etwas Luft an den Seiten */
.bildrechts {float: right; margin: 0.2em 0.4em 0.2em 0.4em;}
/* dto. bild links */
.bildlinks {float: left; margin: 0.2em 0.4em 0.2em 0.4em;}
/* Klasse für Bildergalerie */
.bild  { font-size: 0.7em; text-align: center; margin-bottom: 25px; width: 230px; float: left }
/* Bilder mit Unterschrift, rechts und links */
.bildurechts { font-size: 0.7em; text-align: center; margin-bottom: 25px; float: right }
.bildulinks { font-size: 0.7em; text-align: center; margin-bottom: 25px; float: left }

/* Absatz javascript zurück */
a.zur { font-size: 0.7em; text-align: left; color: #f00;}