/*  =========================================================
Stylesheet für www.barit.de
Datei:  bildschirm.css
Datum:  November 2008
Autor:  Oliver Wild
Aufbau  1. Kalibrierung und allgemeine Styles
        2. Styles für Layoutbereiche
        3. Sonstige Styles
========================================================== */

/* ======================================
   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; }
li li { margin-left: 3em; }

/* Allgemeine Selektoren */

html { height: 101%; } /* erzwingt Scrollbar im Firefox */
body {
   color: white;
   background-color: #eeeeee;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 11px;
   line-height: 16px;
}
h1 { font-size: 14px;
   line-height: 20px;
   color:#747474;
        background: url(bilder/dotorange.gif) 0 6px no-repeat;
        padding-left: 18px;
        margin-bottom: 1.2em;}
h2 { font-size: 120%; }
h3 { font-size: 100%; font-weight: bold; }

strong {color: #404040;}

address {
   text-align: center;
   font-size: 80%;
   font-style: normal;
   letter-spacing: 2px;
   line-height: 1.5em;
}
/* Hyperlinks */
a { text-decoration: none; outline: none;}
a:link { color: #EE7F01; }
a:hover { color: e0e0e0; }
a:visited { color: silver; }
a:focus { color: black; }
a:active { color: green; }



/* Allgemeine Klassen und IDs */
.skiplink {
   position: absolute;
   left: -3000px;
   top: -2000px;
   width: 0px;
   height: 0px;
   overflow: hidden;
   display: inline;
}
#logo {
   color: black;
   background-color: white;
   padding: 5px;
   border: 5px solid #d9d9d9;
}

.bildrechts {
   float:right;
   padding: 3px;
   border: 1px solid #ccc;
   margin-bottom: 10px;
   margin-left: 10px;
}

.bildrechtsnoboder {
   float:right;
   padding: 3px;
   margin-bottom: 10px;
   margin-left: 10px;
}

.bildhead {
   padding: 10px 0 20px 10px;
   border: 0;}


.galerie
{
        background: #eee;
        border-color: #ddd #bbb #aaa #ccc;
        border-style: solid;
        border-width: 1px;
        margin: 3px;
        padding: 5px;
}

.grau {        padding: 5px 5px 5px 15px;
                background-color: #e0e0e0;
                width: 800px
                margin0: }

.news {margin-bottom: 0}

.newsletter { text-align: right;
                          font-family: times, garamond, serif;
                          font-style: italic;
                          font-size: 1.5em;
                          color: silver;
                          border-bottom: 1px silver solid;
                          margin-bottom: 6px;
                          padding: 0;
                          }


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

#wrapper { /* Das HTML-Element mit dem Attribut id="wrapper" */
   color: black;
   background-color: white;
   width: 860px; /* Breite der Seite / des Wrappers */
   margin: 20px auto;
   border: 2px solid #d4d4d4;
}

#kopfbereich {
   color: black;
   background: #fff url(bilder/head_hg.gif);
   padding: 25px 0 0 0;
}
   #kopfbereich p {
      padding: 5px 0 5px 0;
      margin-bottom: 0; /* war 1em */
   }



#hauptbereich { padding: 25px 10px 25px 10px; background-color: white;}


#navilinks {float: left;
                        width:178px;
                        padding:0px;
                        margin:0px;
                        }

#navilinks ul {list-style-type:none;}
#navilinks li {margin-bottom:5px;margin-left:10px;border-bottom:1px solid silver}
#navilinks li li{margin-left:15px;border-bottom:1px solid white}
#navilinks li a {text-decoration:none;color:black}

/* Steuerung des linken Menüs */
   #navilinks li:hover,
   #navilinks li:focus,
   #beratung #navilinks01, #anfrage-termin #navilinks01, #anfrage-floor-consult #navilinks01, #anfrage-planungsmappe #navilinks01, #anfrage-produktinfos #navilinks01,
   #kontakt #navilinks02, #galerie #navilinks03, #presse #navilinks04, #links #navilinks05, #barit #navilinks06, #impressum #navilinks07,
   #reinraum-pharma-terrazzo #navilinks01, #reinraum-atexterrazzo #navilinks02, #reinraum-atexpower #navilinks03, #reinraum-atexelastic #navilinks04, #reinraum-power #navilinks05, #reinraum-elastic #navilinks06, #reinraum-wand #navilinks07,
   #gastro-kuechenboden #navilinks01, #gastro-museumsterrazzo #navilinks02, #gastro-antiskid #navilinks03,
   #industrie-terrazzo #navilinks01, #industrie-power #navilinks02, #industrie-hrl #navilinks03, #industrie-antiskid #navilinks04, #industrie-atexpower #navilinks05, #industrie-atexelastik #navilinks06, #industrie-elasticB65 #navilinks07, #industrie-versiegelungen #navilinks08, #industrie-impraegnierungen #navilinks09,
   #objekte-museumsterrazzo #navilinks01, #objekte-terrazzoveneziani #navilinks02,  #objekte-terrazzolight #navilinks03,  #objekte-colorfloor #navilinks04,  #objekte-power #navilinks05,  #objekte-b65softsound #navilinks06,  #objekte-versiegelung #navilinks07,
   #details-bodenablaeufe #navilinks01, #details-schlitzrinnen #navilinks02, #details-kastenrinnen #navilinks03, #details-hohlkehle #navilinks04, #details-dreikantsockel #navilinks05, #details-mediendurchfuehrung #navilinks06, #details-baudehnfugen #navilinks07, #details-cleaner #navilinks08,
   #bodenkonstruktionen-navifloor #navilinks01, #bodenkonstruktionen-bodenausgleich #navilinks02, #bodenkonstruktionen-waermedaemmausgleich #navilinks03, #bodenkonstruktionen-estrich #navilinks04
   {border-bottom:1px solid #E97B14}

#inhalte {float: right;
                        width:650px;
                        padding:2px;
                        margin-bottom: 20px;
                        }

#bildbereich {float: left;
                        width:160px;
                        padding:0px;
                        margin:0px;
                        }


#textbereich {float: right;
                        width:460px;
                        padding-bottom:0px;
                        margin-right: 10px;
                        }

#infobereich {clear: all;
                          float: left;
                          width: 300px;
                          padding: 75px 0 15px 10px;}

#infobereich a {background: url(bilder/pfeil04.gif) 0 4px no-repeat;
                                padding-left: 17px;}

#textbereich a {background: url(bilder/pfeil04.gif) 0 4px no-repeat;
                                padding-left: 17px;}


#fussbereich {
   clear: both;
}




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

/* Das Kontaktformular */
form {
   background-color: #ffffff;
   width: 600px; /* Breite des Formulars */
   padding: 0;
   /*border: 1px solid #8c8c8c;*/
}
/* Beschriftung auf eigener Zeile */
label {
   display: block;
   cursor: pointer;
}
input#absender,
textarea {
   width: 300px;
   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
   ======================================= */