html, body  /* allgemein */ {
    font-family: Arial, Helvetica, sans-serif ;    /* Schriftarten, die vom Browser verwendet werden sollen */ 
    
    /* anschließend kommt der Farbverlauf für die einzelnen Browser */
    background-image: -ms-linear-gradient(bottom, #838B8B 0%, #D3D3D3 100%);   /* IE10 Consumer Preview */ 
    background-image: -moz-linear-gradient(bottom, #838B8B 0%, #D3D3D3 100%);  /* Mozilla Firefox */ 
    background-image: -o-linear-gradient(bottom, #838B8B 0%, #D3D3D3 100%);    /* Opera */ 
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #838B8B), color-stop(1, #D3D3D3))    ;   /* Webkit (Safari/Chrome 10) */ 
    background-image: -webkit-linear-gradient(bottom, #838B8B 0%, #D3D3D3 100%);   /* Webkit (Chrome 11+) */ 
    background-image: linear-gradient(to top, #838B8B 0%, #D3D3D3 100%);      /* W3C Markup, IE10 Release Preview */ 
    background-color: #C1CDCD;   /* Hintergrundfarbe, wenn kein Farbverlauf vom Browser unterstützt wird*/
    /* Farbverlauf kann bei Microsoft für alle Browser generiert werden unter 
    http://ie.microsoft.com/testdrive/graphics/cssgradientbackgroundmaker/ */
    
    /* Bestimmung der Position und Wiederholung des Hintergrundes */
    background-position: top;
    background-attachment: fixed;  
}

a:link /* Noch nicht besuchter Link */  {
      color: #000000;   /* Textfarbe */ 
      text-decoration: none;   /* Keine Unterstreichung */
}
a:visited /* Bereits besuchter Link */  {
      color: #FF00FF;    /* Textfarbe */ 
      text-decoration: none;  /* Keine Unterstreichung */
}
a:focus /* Links, auf denen der Fokus steht */  {
      color: #0000FF;  /* Textfarbe */ 
      text-decoration: none;   /* Keine Unterstreichung */
}
a:hover /* Link, über dem der Mauszeiger steht */   {
      color: #0043FF;  /* Textfarbe */ 
      text-decoration: none;  /* Keine Unterstreichung */
}
a:active /* Link, der gerade aktiv ist */   {
      color: #7F7F7F;   /* Textfarbe */ 
      font-weight: bold;   /* Text wird Fett abgebildet */
      text-decoration: none;  /* Keine Unterstreichung */
}

.font_klein {
    font-size: 7pt;
    text-align: left;
}

.font_fett {
    font-weight: bold ;
}

h1 {
    color: #000000;
}

h2  {
    font-size: 18px;
    font-weight: bold;
    color: #000000;
}



#wrap /* Gesamte Homepage */  {
    width: 100%;   /* Automatische Bildauflösung */
    max-width: 980px; /* Maximale Anzeige der Website */
    min-width: 727px;  /* Minimale Anzeige der Website */
    margin: 0 auto;     /* Automatische Ausrichtung der Webiste in der Mitte */   
}

#header  /* Kopfzeile */  {
    background-color: #FFFFFF;     /* Hintergrundfarbe Elfenbein */
    /* Deklarationen der Schatten; Wert 1 steht für die Y-Achse, Wert 2 für die X-Achse und Wert 3 für die      
    Weichzeichnung des Schattens. Der letzte Wert ist die Farbe, hier Schwarz */
    webkit-box-shadow: 4px 4px 5px #838B8B;   /* Safari und Chrome */
    moz-box-shadow: 4px 4px 5px #838B8B;      /* Firefox */
    box-shadow: 4px 4px 5px #838B8B;        /* Opera und Internet Explorer */
    top: 0;  /* Kopfzeile soll bei Position 0 von oben beginnen */
    
    padding: 20px 30px 20px 30px;   /* Rand innerhalb der Kopfzeile */

    max-width: 930px; /* Maximale Anzeige der Website */
    min-width: 667px;  /* Minimale Anzeige der Website */
    margin: 0 auto;     /* Automatische Ausrichtung der Webiste in der Mitte */  
}


body {
    font: normal 100.01% Helvetica, Arial, sans-serif;
    color: black; background-color: #FFFFFF;
  }

  ul#Navigation {
    margin: 0; padding: 0.8em;
    text-align: center;
    border: 0px #ffffff;
    background-color: #ffffff;
  }
  ul#Navigation li {
    list-style: none;
    display: inline;
    margin: 0.4em; padding: 0;
  }

  ul#Navigation a, ul#Navigation span {
    padding: 0.2em 1em;
    text-decoration: none; font-weight: bold;
    border: 1px solid black;
    border-left-color: white; border-top-color: white;
    color: #000000; background-color: #ffffff;
  }
  * html ul#Navigation a, * html ul#Navigation span {
    width: 1em;    /* nur fuer IE 5.0x erforderlich */
    w/idth: auto;  /* sicherheitshalber fuer IE 6 zurueckgesetzt */
  }
  ul#Navigation a:hover, ul#Navigation span {
    border-color: white;
    border-left-color: black; border-top-color: black;
    color: white; background-color: gray;
  }
     
#content /* Inhalt */  {
    background-color: #FFFFFF;   /* Hintergrundfarbe Elfenbein */
    /* Deklarationen der Schatten; Wert 1 steht für die Y-Achse, Wert 2 für die X-Achse und Wert 3 für die
    Weichzeichnung des Schattens. Der letzte Wert ist die Farbe, hier Schwarz */
    webkit-box-shadow: 4px 4px 5px #838B8B;   /* Safari und Chrome */
    moz-box-shadow: 4px 4px 5px #838B8B;      /* Firefox */
    box-shadow: 4px 4px 5px #838B8B;        /* Opera und Internet Explorer */
    margin-top: 5px;   /* Inhalt soll vom obersten Rand ab 45px beginnen */
    padding: 30px;      /* Rand innerhalb des Inhalts */
}

#footer  /* Fußzeile */  {
    background-color: #FFFFFF;    /* Hintergrundfarbe Elfenbein */
    /* Deklarationen der Schatten; Wert 1 steht für die Y-Achse, Wert 2 für die X-Achse und Wert 3 für die
    Weichzeichnung des Schattens. Der letzte Wert ist die Farbe, hier Schwarz */
    webkit-box-shadow: 4px 4px 5px #838B8B;   /* Safari und Chrome */
    moz-box-shadow: 4px 4px 5px #838B8B;      /* Firefox */
    box-shadow: 4px 4px 5px #838B8B;        /* Opera und Internet Explorer */
    margin-top: 5px;    /* Fußzeile soll 5px Abstand zum Inhalt haben */
    padding: 1px 30px 1px 30px;   /* Rand innerhalb der Fußzeile */
}






    /* Nachstehend beginnt die Feinjustierung der JQuery für die Slideshows*/
 #slides {
      display: none
    }

    #slides .slidesjs-navigation {
      margin-top:5px;
    }

    a.slidesjs-next,
    a.slidesjs-previous,
    a.slidesjs-play,
    a.slidesjs-stop {
      background-image: url(images/btns-next-prev1.png);
      background-repeat: no-repeat;
      display:block;
      width:12px;
      height:18px;
      overflow: hidden;
      text-indent: -9999px;
      float: left;
      margin-right:5px;
    }

    a.slidesjs-next {
      margin-right:10px;
      background-position: -12px 0;
    }

    a:hover.slidesjs-next {
      background-position: -12px -18px;
    }

    a.slidesjs-previous {
      background-position: 0 0;
    }

    a:hover.slidesjs-previous {
      background-position: 0 -18px;
    }

    a.slidesjs-play {
      width:15px;
      background-position: -25px 0;
    }

    a:hover.slidesjs-play {
      background-position: -25px -18px;
    }

    a.slidesjs-stop {
      width:18px;
      background-position: -41px 0;
    }

    a:hover.slidesjs-stop {
      background-position: -41px -18px;
    }

    .slidesjs-pagination {
      margin: 7px 0 0;
      float: right;
      list-style: none;
    }

    .slidesjs-pagination li {
      float: left;
      margin: 0 1px;
    }

    .slidesjs-pagination li a {
      display: block;
      width: 13px;
      height: 0;
      padding-top: 13px;
      background-image: url(images/pagination.png);
      background-position: 0 0;
      float: left;
      overflow: hidden;
    }

    .slidesjs-pagination li a.active,
    .slidesjs-pagination li a:hover.active {
      background-position: 0 -13px;
    }

    .slidesjs-pagination li a:hover {
      background-position: 0 -26px;
    }

    #slides a:link,
    #slides a:visited {
      color: #333;
    }

    #slides a:hover,
    #slides a:active {
      color: orange;
    }

    .navbar {
      overflow: hidden;
    }
    
    .container {
      margin: 0 auto;
    }

    /* Für Tablets und Smartphones */
    @media (max-width: 667px) {
      body {
        padding-left: 20px;
        padding-right: 20px;
      }
      .container {
        width: auto;
      }
    }

    /* Für Smartphones */
    @media (max-width: 480px) {
      .container {
        width: auto;
      }
    }

    /* Für kleine Bildschirme, wie z.B. bei Laptops */
    @media (min-width: 667px) and (max-width: 920px) {
      .container {
        width: 724px;
      }
    }

    /* Für größere Bildschirme */
    @media (min-width: 667px) {
      .container {
        width: 920px;
      }