/*======================================
 Das ist mein Stylesheeten 

Stand: 18.06.08

Aufbau:   1. Kalibrierung
          2. Allgemeine Styles
          3. Styles fuer Layoutbereich
          4. Sonstige Styles
======================================*/



/*====================================
  1. Kalibrierung
======================================*/

* { padding: 0; margin: 0; }

h2, p, ul, ol { margin-bottom: 1em; }

li { margin-left: 2em; }

ol ul { margin-bottom: 0; }                  
                                                   
/*====================================
  2. Allgemeine Styles
======================================*/                  
                  
body {
  background-color: #353535; /* dunkles Grau */
  color: white; 
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: small;
}                  
 
h1 { font-size: 150%; }
h2 { font-size: 130%; }

address {
  text-align: center;
  font-size: 80%;
  font-style: normal;
  letter-spacing: 2px;
  line-height: 1.5;
}

/*============
  Hyperlinks */
  
a { text-decoration: none;} /* Keine Unterstriche mehr bei Hyperlinks */
    
    
a:link { color: #d90000; } /* nicht besuchte Links anders faerben */
a:visited { color: #cc6600; } /* besuchte links faerben */

a:hover, a:focus { text-decoration: underline; } /* Hyperlink unterstreichen, wenn Maus darueber faehrt! border-bottom: 1px solid #d90000; */
a:active { background-color: #d90000;
           color: white; } /* beim Anklicken des Links roter Rahmen mit weisser Schrift */
           
/*==============
  Klassen und ID's*/

.skiplink {
  position: absolute;
  top: -5000px;
  left: -5000px;
  width: 0;
  height: 0;
  overflow: hidden;
  display: inline;           /* Skiplink verschwinden lassen */
}           
                  
#logo {
  position: relative;
  background-color: white;
  color: black;
  
  border: 1px solid #000000;
}                  
                  
/*====================================
  3. Styles fuer Layoutbereich
======================================*/                  
                  
 #wrapper {
  background-color: white;
  color: black;
  width: 1024px;
  margin: 10px auto; /* auto=jede seite 10px*/
}

#kopfbereich {
  position: relative;
  background-color: #ffe574;
  background-image: url(farbverlauf.jpg);
  background-repeat: repeat-y; /* nur noch vertikal wiederholen */
  color:  black;
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 0px;
  padding-left: 20px; /* oder 1 x padding: 10px 20px 0px 20px */
  
}

    #kopfbereich p {
    position: absolute;
    top: 10px;
    right: 20px;
    padding: 5px 0px;
    margin-bottom: 0px;} /*Zwischenraum entfernen zwischen kopf-
                                           und navibereich*/
    #kopfbereich span {
      color: red;
      }
#navibereich {
  text-align: right;
  background: #ffe574 url(farbverlauf.jpg) repeat-y top left;
  padding: 5px 10px 4px 10px;
  border-bottom: 1px solid #8c8c8c;
  }

    #navibereich ul {
      margin-bottom: 0px;
      }
      
    #navibereich li {
      display: inline;
      list-style-type: none;
      margin-left: 0;
      margin-right: 10px;
      
    }
    
    #navibereich a,
    #navibereich span {
      background-color: #ffeda0;
      color: black;
      padding: 4px 8px 4px 8px;
      border: 1px solid #8c8c8c;
    }
    
    #navibereich a:hover,
    #navibereich a:focus {
      background-color:white;
      color: black;
      border-bottom-color:white;
      }
      
     #startseite #navi01 span,
     #kontaktseite #navi02 span {
      background-color:white;
      color: black;
      border-bottom-color:white;
      }
      
#textbereich {
  padding: 20px 10px 20px 20px /* top-right-bottom-left */
}
    /* Alle Hyperlinks im textbereich mit gepunktetem Unterstrich versehen:
    #textbereich a {
      border-bottom: 1px dotted #cc0000 ;
    }
    */
    
    /*Listenelemente im textbereich mit rechteckigen Auzaehlungspunkten
      versehen: */
    #textbereich ul li { list-style-type: square; }

#fussbereich {
  padding: 10px 20px 20px 20px;
  border-top: 1px solid #353535; 
  margin-top: 20px;
}
                  
/*====================================
  4. Sonstige Styles
======================================*/                                    

/*Kontaktformular*/

form {
  background-color: #eeeeee;
  color: black;
  width: 370px;
  padding: 20px;
  border: 1px solid #8c8c8c;
}

label {
  display: block;
  cursor: pointer;
}

input#absender, textarea {
  width: 300px;
  border: 1px solid #8c8c8c;
  margin-bottom: 1em;
}

textarea {
  height: 7em;
}
input#absender:focus,
textarea:focus { background-color: #d9d9d9;
                 color: black;
                 }
                  
/* ENDE vom Gelaende */