<!--                                                                 /* Anfang CSS */

   *{                                                                /* Stern bedeutet auf alles Anwenden was folgt */
  margin:0;                                                          /* löscht Bikinistreifen Aussenabstand 0 (Boxmodell) */
  padding:0;                                                         /* löscht Bikinistreifen Innenabstand 0 Boxmodell */
    }

  html, body {
  font: 100% Arial, Helvetica, sans-serif;                           /* bevorzugte Schriftarten für gesamtes Projekt */
    }

  #kopfbereich {
    background:url(bilder/kopfzeile.jpg) no-repeat left top;         /* Kopfzeilengrafik linksausgerichtet */
    height:150px;                                                    /* Platzreservierung 150 px für Kopfzeilengrafik */
    }


  #kopfbereich p {                                                   /* alle Absätze den Kopfbereich betreffend bekommen... */
    font-size:2em;                                                   /* die relative Schriftgrösse 2em */
    text-align:right;                                                /* die Textausrichtung "rechts" */
    color:#232323;                                                   /* die definierte Farbe */
    padding:.4em .4em 0 0;                                           /* den Abstand 0.4em oben und rechts; unten und li 0em */
    }                                                                /* (Angabe im Uhrzeigersinn ob, re, un, li) */






  #steuerung {
    background-color:#997533;                                        /* Steuerungsleiste mit definierter Farbe versehen */
    padding-left:1em;                                                /* Text mit dem relativen Seitenabstand 1em nach links */
    }

  #steuerung a:link { color:black; text-decoration:none; }           /* Steuerungsleiste: alle unbesuchten links schwarz */
  #steuerung a:visited { color:black; text-decoration:none; }        /* alle besuchten links in schwarz */
  #steuerung a:focus { color:orange; text-decoration:none; }         /* alle fokusierten links orange (Test mit TAB-Taste) */
  #steuerung a:hover { color:red; text-decoration:none; }            /* alle links auf die Mauszeiger zeigt in rot */
  #steuerung a:active { color:orange; text-decoration:none; }        /* alle aktiven ??? links in orange */






  #schatten {
    background:url(bilder/schattenwurf grau.png) repeat-x;          /* Schattengrafik laden und endlos wiederholen */
    height:12px;                                                    /* Platzreservierung 12px (Bild hat 1 x 12px) */
    }





  #steuerunglinks {                                                 /* Angaben zur Steuerung links von "Inhalt" */
    background-color:#eeeeee;                                       /* Hintergrundfarbe von Steuerung links */
    float:left;                                                     /* wird dazu missbraucht, das der "Inhalt" neben Steuerunglinks steht und nicht drunter */
    width:11em;                                                     /* gibt die relative Größe 10 em für den Inhalt von Steuerungslinks an. Im Zusammenspiel mit Zeile 63 "margin-left 13em" bewirkt die relative Größenangabe, daß "Steuerunglinks" immer gleich groß angezeigt wird, während bei Fensterverkleinerung der Bereich "Inhalt" auch verkleinert wird. Dabei bleibt aber immmer ein Abstand (weißer Bereich) zwischen "Steuenglinks" und "Inhalt" bestehen. Wichtig ist immmer das Zusammenspiel zwischen der relativen Größenangabe 10em in dieser Zeile und der relativen Größenangabe aus Zeile 63 von 13em, damit die zweispaltige Fensteranpassung von "Steuerunglinks" und "Inhalt" funktioniert. */
    padding:1em;                                                    /* dient nur dafür,daß Steuerunglinks etwas Abstand zum rechten Bildschirmrand bekommt */
    }

  #steuerunglinks h1 { font-size:160%; }                            /* Größe von h1 Überschriften in Prozent */
  #steuerunglinks h2 { font-size:130%; }                            /* Größe von h2 Überschriften in Prozent */
  #steuerunglinks h3 { font-size:100%; }                            /* Größe von h3 Überschriften in Prozent */
  #steuerunglinks p { font-size:95%; }                              /* Größe von Texten in Absätzen */
  #steuerunglinks { font-size:95%; }                                /* Größe von normaler Schrift */

  #steuerunglinks a:link { color:blue; text-decoration:underline; }           /* Steuerungsleiste: alle unbesuchten links blau und unterstrichen */
  #steuerunglinks a:visited { color:blue; text-decoration:underline; }        /* alle besuchten links in blau und unterstrichen */
  #steuerunglinks a:hover { color:red; text-decoration:underline; }           /* alle links auf die Mauszeiger zeigt in rot und unterstrichen */





  #steuerunglinks2 {                                                 /* Angaben zur Steuerung links von "Inhalt" */
    background-color:#eeeeee;                                       /* Hintergrundfarbe von Steuerung links */
    float:left;                                                     /* wird dazu missbraucht, das der "Inhalt" neben Steuerunglinks steht und nicht drunter */
    width:11em;                                                     /* gibt die relative Größe 10 em für den Inhalt von Steuerungslinks an. Im Zusammenspiel mit Zeile 63 "margin-left 13em" bewirkt die relative Größenangabe, daß "Steuerunglinks" immer gleich groß angezeigt wird, während bei Fensterverkleinerung der Bereich "Inhalt" auch verkleinert wird. Dabei bleibt aber immmer ein Abstand (weißer Bereich) zwischen "Steuenglinks" und "Inhalt" bestehen. Wichtig ist immmer das Zusammenspiel zwischen der relativen Größenangabe 10em in dieser Zeile und der relativen Größenangabe aus Zeile 63 von 13em, damit die zweispaltige Fensteranpassung von "Steuerunglinks" und "Inhalt" funktioniert. */
    padding:1em;                                                    /* dient nur dafür,daß Steuerunglinks etwas Abstand zum rechten Bildschirmrand bekommt */
    }

  #steuerunglinks2 h1 { font-size:160%; }                            /* Größe von h1 Überschriften in Prozent */
  #steuerunglinks2 h2 { font-size:130%; }                            /* Größe von h2 Überschriften in Prozent */
  #steuerunglinks2 h3 { font-size:100%; }                            /* Größe von h3 Überschriften in Prozent */
  #steuerunglinks2 p { font-size:95%; }                              /* Größe von Texten in Absätzen */
  #steuerunglinks2 { font-size:95%; }                                /* Größe von normaler Schrift */

  #steuerunglinks2 a:link { color:black; text-decoration:none; }           /* Steuerungsleiste: alle unbesuchten links blau und unterstrichen */
  #steuerunglinks2 a:visited { color:black; text-decoration:none; }        /* alle besuchten links in blau und unterstrichen */
  #steuerunglinks2 a:hover { color:red; text-decoration:none; }           /* alle links auf die Mauszeiger zeigt in rot und unterstrichen */





  #inhalt {
  padding:2em;                                                      /* Abstand vom Inhalt nach links u. rechts */
  background-color:#eeeeee;
  margin: 0em 14em 0em 13em;                                                 /* läßt 13em Aussenabstand für die Steuerung links und bewirkt wie in Zeile 50 beschrieben, das relative fenstergrößeabhängige Verhältnis zwischen "Steuerunglinks" und "Inhalt". (2 spalten Layout) */
  }

  #inhalt h1, h2, h3, p, ul { padding-bottom:.7em; }                /* für Überschriften h1-3, Absätze und Stickpunktlisten */
                                                                    /* gilt ein relativer Abstand nach unten von 7em */
  #inhalt h1 { font-size:160%; }                                    /* Größe von h1 Überschriften in Prozent */
  #inhalt h2 { font-size:130%; }                                    /* Größe von h2 Überschriften in Prozent */
  #inhalt h3 { font-size:100%; }                                    /* Größe von h3 Überschriften in Prozent */                                    /* Größe von h4 Überschriften in Prozent */
  #inhalt p { font-size:87%; }                                      /* Größe von Texten in Absätzen */

  #inhalt a:link { color:black; text-decoration:none; font-size:87%; }           /* Steuerungsleiste: alle unbesuchten links schwarz */
  #inhalt a:visited { color:black; text-decoration:none; font-size:87%; }       /* alle besuchten links in schwarz */
  #inhalt a:hover { color:red; text-decoration:none; font-size:87%; }           /* alle links auf die Mauszeiger zeigt in rot */

  #inhalt img { border-color:black; border-style:solid; }           /* verlinkte Bilder sollen eine schwarze Border bekommen, nicht blau und lila */





  #kastenrechts {
  float:right;
  width:180px;
  padding:1em;
  background-color:#eeeeee;
  }

  #kastenrechts h1 { font-size:160%; }                            /* Größe von h1 Überschriften in Prozent */
  #kastenrechts h2 { font-size:130%; }                            /* Größe von h2 Überschriften in Prozent */
  #kastenrechts h3 { font-size:100%; }                            /* Größe von h3 Überschriften in Prozent */
  #kastenrechts p { font-size:95%; }                              /* Größe von Texten in Absätzen */
  #kastenrechts { font-size:95%; }                                /* Größe von normaler Schrift */

  #kastenrechts a:link { color:black; text-decoration:none; }           /* Steuerungsleiste: alle unbesuchten links schwarz */
  #kastenrechts a:visited { color:black; text-decoration:none; }       /* alle besuchten links in schwarz */
  #kastenrechts a:hover { color:red; text-decoration:none; }           /* alle links auf die Mauszeiger zeigt in rot */



-->                                                                 /* Ende CSS */