/*  =========================================================
Stylesheet für Familienbildungsstätte Esslingen
Datei:  bildschirm.css
Datum:  Juli/August 2007
Autor:  Oliver Wild
========================================================== */

/* ======================================
   1. Kalibrierung und allgemeine Styles
   ====================================== */

/* Kalibrierung der wichtigsten Abstände */
*  { padding: 0; margin: 0; }
h2, h3, p, ul, ol { margin-bottom: 1em; }
ul ul { margin-bottom: 0; }
li { margin-left: 2em;margin-top:8px; }
li li { margin-left: 3em; }

/* Allgemeine Selektoren */

html { height: 101%; } /* erzwingt Scrollbar im Firefox */
body {
   color: white;
   background-color: #8c8c8c;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: small;
}
h1 { font-size: 150%; }
h2 { font-size: 120%; }
h3 { font-size: 100%; font-weight: bold; }

table {
background: white;
}

td {
background:#ECF3DD;padding:1px }

.ohnelinie {
background: #ECF3DD;
}

.rot
{color:red;}

.box
{width:350px;background-color:#eeeeee;margin:2px 0 2px 0;border:1px solid #D0E0C0;padding:3px}

/* Hyperlinks */
a { text-decoration: none; outline: none;}
a:link { color: #d90000; }
a:visited { color: #cc6666; }


a:active {
   color: white;
   background-color: #d90000;
}
/* Allgemeine Klassen und IDs */




.bildrechts {
        clear: all;
   float:right;
   padding: 5px;
   border: 0;
   margin-bottom: 10px;
   margin-top: 10px;
   margin-left: 15px;
}


.bildlinks {
   clear: all;
   float:left;
   padding: 5px;
   border: 0;
   margin-bottom: 10px;
   margin-top: 0;
   margin-right: 15px;
}

/* ====================================
   2. Styles für die  Layoutbereiche
   ==================================== */

#banneroben { /* Das HTML-Element mit dem Attribut id="banneroben" */
   color: black;
   width: 850px; /* Breite des Inhaltsbereiches */
   margin: 10px auto;
}

#wrapper { /* Das HTML-Element mit dem Attribut id="wrapper" */
   color: black;
   background: white url(bilder/hintergrund800.gif) repeat-y top left;
   width: 850px; /* Breite des Inhaltsbereiches */
   margin: 10px auto;
}

#kopfbereich {
   color: black;
   background: url(bilder/head800.gif) repeat-y top left;
   padding: 10px 20px 0 20px;
   height: 110px;
}
   #kopfbereich p {
      padding: 5px 0 5px 0;
      margin-bottom: 0; /* war 1em */
   }

#navibereich {
   text-align: left;  /* linksbündig */
   font-weight: bold;
   margin-left:197px;
   margin-right:60px;
   color: #D51B4F;
   background: #786EA7;
   padding: 25px 10px 4px 10px;
}
   #navibereich ul { margin-bottom: 0; }
   #navibereich li {
      display: inline;
      list-style-type: none;
      list-style-position: inside;
      margin: 0 ; /* war vorher 10px für rechts */
   }
   #navibereich a {
      color: #D51B4F;
      background-color: #D0E0C0;
      padding: 4px 8px;
      border: 2px solid #fff;
   }
   #navibereich a:hover,
   #navibereich a:focus,
   #startseite #navi01 a,
   #kursprogramm #navi02 a,
   #veranstaltungen #navi03 a
   {
      color: #D51B4F;
      background-color: #ECF3DD;
      border-bottom-color: #ECF3DD; /* Rahmenlinie weiss */
   }


/*----Beginn linke Spalte----*/

#linkespalte {
        float:left;
        padding: 50px 4px 20px 4px;
}


#linkespalte ul li {
      list-style-type: none;
          }

#linkespalte a          {
        display:block;
        padding: 4px;
        margin-top:8px;
        background: #D0E0C0;}

#linkespalte a:hover,
#linkespalte a:focus,
#kontakt #navikontakt a,
#anmeldung #navianmeldung a,
#teilnahmebedingungen #naviteilnahmebedingungen        a,
#wir #naviwir a,
#wegbeschreibung #naviwegbeschreibung a,
#mitarbeiter #navimitarbeiter a,
#einrichtungen #navieinrichtungen a,
#bildergalerie #navibildergalerie a,
#mitgliedschaft #navimitgliedschaft a,
#impressum #naviimpressum a,
#weblinks #naviweblinks a
                {
      background-color: #ECF3DD;
      border-color: #ECF3DD; /* Rahmenlinie */
          }

#textbereich { padding: 50px 10px 20px 20px;
                margin-left:200px;
                margin-right:80px;
                }
   #textbereich a {
      border-bottom: 1px dotted #cc0000;
   }
   #textbereich a:hover,
   #textbereich a:focus {
      border-bottom: 1px solid #d90000;
   }

#textlinkespalte {        float:left;
                                        width: 330px;
                                        }

#textrechtespalte {        float:right;
                                        width: 160px;
                                        }


#fussbereich {
   padding: 10px 20px 20px 20px;
   margin: 20px 50px 0 50px;
   background: #786EA7;
}


/* ====================================
   3. Sonstige Styles
   ==================================== */

/* Das Kontaktformular */
form {
    /* Breite des Formulars */
   padding: 20px;
   /*border: 1px solid #8c8c8c;*/
}
/* Beschriftung auf eigener Zeile */
label {
   display: block;
   cursor: pointer;
}
input#absender,
textarea {
   width: 450px;
   border: 1px solid #8c8c8c;
   margin-bottom: 1em;
}
textarea {
   height: 7em;
}
input#absender:focus,
textarea:focus {
   background-color: #d9d9d9;
}


/* =======================================
   E N D E   D E S   S T Y L E S H E E T S
   ======================================= */