/*  =========================================================
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; 
}

.bildhead {
   padding: 10px 0 20px 10px; 
   border: 0;
}

.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 
   ======================================= */