/* -- Allgemeines -- */
body {
  color: black;
  margin: 0;
/*  padding: 1%;*/ /* Ein wenig Abstand, damit der Anschein eines Blattes auf der Wand immer erhalten bleibt. */
  min-width: 760px; /* Bei weniger als 640px Breite soll ein Scrollbalken erscheinen. */
  font-size: 100.01%; /* umgeht den Font-Size-Bug im Safari, �teren Operas und IE */
  font-family: verdana, arial, sans-serif ;
}
a { color: #0B4D8C; text-decoration: underline; } /* Alle unbesuchten Links bekommen eine leicht bl�liche Farbe und werden unterstrichen, damit man Sie gleich im Text erkennt. */
a:visited { color: black; } /* Besuchte Links werden schwarz, bleiben dennoch unterstrichen. Somit erkennt man wo man sich schon befunden hat. */
.skip { /* Da ein wichtiger Screenreader das display: none; auch fr sich versteht und nichts vorlie� obwohl das hier sich vor allem an Blinde richtet, muss man es so l�en dass man diesen Link au�rhalb des Sichtfeldes bringt. Somit wird er trotzdem vorgelesen. */
  position: absolute;
  margin-left: -999px;
  width: 990px;
}
h1 { /* Die �erschrift jeder Seite stellen wir besonders da, denn sie ist sehr wichtig. */
  font-size: 16px;
  font-weight: bold;
  padding: 0.6em 0 0.2em 2%;
  margin: 0;
}

h2 { /* Die �erschrift jeder Seite stellen wir besonders da, denn sie ist sehr wichtig. */
  font-size: 12px;
  font-weight: bold;
  padding: 0.6em 0 0.2em 2%;
  margin: 0;
}

h3 { /* Die �erschrift jeder Seite stellen wir besonders da, denn sie ist sehr wichtig. */
  font-size: 10px;
  font-weight: bold;
  padding: 0.6em 0 0.2em 2%;
  margin: 0;
}

h2, h3, h4 { font-weight: normal; }
h1, h2, h3, h4, h5, h6 { /* Alle �erschriften bekommen eine besondere Farbe, und da sie sehr gro�sind, k�nen wir es uns erlauben hier eine Schrift mit Serifen zu w�len. Wir spielen hier ein wenig mit Typographie, und entgegen dem Einheitsbrei auf vielen Seiten. */
  color: #976324;
  font-family: Georgia, "Times New Roman", Times, serif;
}
img { /* Alle Bilder bekommen einen sch�en Rahmen. */
  /*border: solid 1px #aaa;*/
  padding: 1px;
}
.fleft { /* Sachen, an denen der Text vorbeiflie�n soll, wierden diese Klassen zugewiesen. */
  float: left;
  margin: 0 1em 0.2em 0; /* Man sollte einen sch�en Abstand w�len, sonst kleben die Sachen so am Text. */
}
.fright {
  float: right;
  margin: 0 0 0.2em 1em;
  padding: 1px;
}


/* -- Layoutspezifisches -- */
#container { /* Ist dafr gedacht dass die viele Formatierungen einfacher werden, und auch ein gemeinsammer Rand entstehen kann, der nicht ganz au�n am Fenster ist. */
  width: 750px; /* Eine Begrenzung der Breite auf h�stens 70em. Das machen wir um nicht zu lange Textbreiten zu erhalten, welche dann schlecht zu lesen sind. Fr den IE gibt es in ielte6.css einen Woraround. */
  height: 550px;
  margin: auto; /* Hiermit zentrieren wir unsere Seite. */
  border: 1px solid #aaa; /* Eine kleine optische Abgr�zung. */
  border-top: 1; /* Ganz oben allerdings wrde es mit dem grauen komisch aussehen, deshalb weg damit. */
  background: white;
  position:relative;
}

#header {
  /*background: url(./farbverlauf_menue.png) #ffae11;*/
  background: url(./kopfbalken.jpg);
  background-repeat: repeat;
  padding: 1px; /* Je kleiner das Fenster desto kleiner soll auch der Abstand des Mens rechts und links sein. */
  margin: 0;
  color: red;
}
* html body #header { padding-left: 30px; } /* IE 6 / 5.5 Hack */

/* - Men - */
#menu {
  background: inherit;
  padding: 1px; /* Je kleiner das Fenster desto kleiner soll auch der Abstand des Mens rechts und links sein. */
  margin: 1px;
  color: red;
}

#menu td {
  color: black; /* Hier ist das mit der Linkfarbe genau so, sie soll wei�sein. */
  font-weight: bold;
  width: 100px;
  height: 65px;
  text-align: center;
}

/* - Men - */
#menux {
  background: inherit;
  padding: 2px; /* Je kleiner das Fenster desto kleiner soll auch der Abstand des Mens rechts und links sein. */
  margin: 0;
  color: red;
}
#menux td {
  color: black; /* Hier ist das mit der Linkfarbe genau so, sie soll wei�sein. */
  text-align: center;
  font-weight: bold;
  font-size: 10pt;
  width: 100px;
}

#menux td:hover {
  background-color: #FFA73C;
  color: black; /* Hier ist das mit der Linkfarbe genau so, sie soll wei�sein. */
  font-weight: bold;
}


#end {
  /*background: url(./farbverlauf_menue.png) #ffae11;*/
  background: url(./kopfbalken.jpg);
  background-repeat: repeat;
  margin: 0;
  padding: 0;
  padding-top: 8px;
  bottom:0px;
  position:absolute;
  display:block;
  width: 100%;
  font-weight:bold;
  text-align: center;
  vertical-align: center;
  color: #976324;
  height: 20px;
  font-size:11px;
}

/* - Subnavigation, Rechte Spalte - */
#subnav {
  width: 26%; /* Je kleiner das Fenster desto kleiner soll auch die Breite der Subnavigation werden, damit immer gengend Platz fr den richtigen Inhalt bleibt. */
  min-width: 10em; /* Damit uns die Subnavigarion nicht zu sehr zusammengeschoben wird. */
  float: right; /* Damit erreichen wir dass der Inhalt links neben der Subnavigation vorbeiflie� und nicht erst unten drunter anf�gt. */
  padding: 70px 1% 1em 1%;
  margin: 1em 1% 0 1%;
  border-left: 1px dotted #aaa; /* 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. */
}
#subnav dt { /* Die einzelnen �erschriften in der Subnavigation */
  font-size: 1.2em;
  font-family: Georgia, "Times New Roman", Times, serif;
  padding: 0.5em;
  margin-top: 1em;
  border-top: 1px dotted #aaa; /* Hier eine optische Trennungslinie zwischen den einzelnen Bereichen der Subnavigation. */
}
#subnav dd { /* Die Unterpunkte der Subnavigation. */
  padding: 0;
  margin: 0.2em 0;
}

/* - Der Hauptinhaltsteil - */
#main {
  /*padding: 0 31% 0 20px;  Der rechte Abstand (31%) stellt sicher, dass auch nach dem Umflie�n der Subnavigation der Text genau so breit wird wie oben und ein zwei-Spalten Eindruck entsteht. */
  /*line-height: 1.5em;*/ /* Zur besseren Lesbarkeit erh�en wir die Zeilenh�e. */
}