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

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

/* Allgemeine Selektoren */

html { height: 100%; } /* erzwingt Scrollbar im Firefox */

body { 
  color: black; 
  background-color: #faf7e6; 
  font-family:  Tahoma,Verdana, Helvetica, Arial,sans-serif;
  font-size: 100.01%;
  min-width: 40em; /* Mindestbreite verhindert Umbruch und Anzeigefehler in modernen Browsern */
}

h1{
  font-family: Tahoma,Verdana, Helvetica, Arial,sans-serif;
  font-size: 55px;
  font-weight: lighter;
  margin-bottom: 10px;
}

h2{
  font-family: Tahoma, Verdana, Helvetica, Arial,sans-serif;
  font-size: 30px;
  margin: 20px 0 15px 30px;
}

h3{
  font-family: Tahoma, Verdana, Helvetica, Arial,sans-serif;
  font-weight: bold;
  font-size: 14px;
  color: black;
  margin: 0px 0 5px 0;
}

h4{
  font-family:  Tahoma, Verdana, Helvetica, Arial,sans-serif;
  font-size: 13px;
  font-weight: bold;
  color: black;
  margin-bottom: 8px;
}
address {
   text-align: center;  
   font-size: 80%;      
   font-style: normal;  
   letter-spacing: 2px; 
   line-height: 1.5em;  
}
/* Hyperlinks */
a { 
  text-decoration: none;
  outline: none;
  color: #CD2628; /* dunkelrot */
  font-weight: bold;
} 
a img {
  border: 0;
}

table {
  margin: 0 0 0 30px;
  border: 0px solid  red;
}

.vdate {
font-size: 1.3em;
padding: 0px 20px 0 0px;
}

.wievdate {
font-size: 1.2em;
font-weight: bold;
}

.vname {
font-size: 1.8em;
text-align: left;
border-bottom: 1px dotted black;
}

.vbeschr {
font-size: 1.2em;
}

/* Allgemeine Klassen und IDs */
.skiplink { 
   position: absolute; 
   left: -3000px; 
   top: -2000px; 
   width: 0px; 
   height: 0px; 
   overflow: hidden; 
   display: inline; 
}

.kursiv {
 font-style:italic; 
 }
 
.fett {
 font-style: bold;
 } 

.leftfloat {
float: left;
}

.rightfloat {
float: right;
}

.unten {
padding: 0px 0 15px 0;
}

/* ==================================== 
   2. Styles für die  Layoutbereiche 
   ==================================== */
#hg{ 
  background-repeat: repeat-y;
  background-position:  center;
  background-image: url('images/hintergrund.jpg');
  height:700px;
}
#wrapper {
  width: 856px; /*war 720 */
  font-size: 12px;
  height: 700px;
  background-color: #F6F3E2; 
  background-image: url('images/logo_hg.gif');
  background-repeat: no-repeat;
  background-position:  center;
  margin-top: 0px;
  margin-right: auto;
  margin-bottom: 0px;
  margin-left: auto; 
  border: 0px red solid; /* zu testen und Fehler suchen */
}

#kopfbereich {
   height: 200px;
 }

#navibereich {
visibility:hidden
} 
    #navibereich ul {
    	    margin-bottom: 0;
    	    padding-top: 2px;
    	  }
    
    #navibereich li{
          display: inline; 
          list-style-type: none;
          padding: 3px;
        }
        
    #navibereich a {
          color: black;
          padding: 3px;
          /* border: 1px solid green;*/ 
    	   }
        
       
    #navibereich a:hover,
    #impressum #navi06 a,
    #kontakt #navi05 a,
    #termine #navi04 a,
    #moebel #navi03 a,
    #laden #navi02 a,
    #startseite #navi01 a {
        text-decoration: none; /* Unterstreichung aus */ 
        color: white;
      }
    	  
  
#textbereich {
  width: 700px;
  height: 400px;
  font-family:  Verdana, Helvetica, Arial,sans-serif;
  border: 0px solid green;
  margin: 0px 0px 0px 0px;
  padding-top: 0px ;
  padding-right: 0px; 
  padding-bottom: 30px;
  padding-left: 0px;
 }



/*Krücke zum ausrichten der Grafik */
#postbox {
  text-align: left;
}
#postbox img {
  position: relative;
  top: -14px;   
  right: -50px;
  height: 15px;
  margin-bottom: 0px;
} 


#postbox p{
  margin: 0px;
}


#unten {
  width: 100%;
  border: 0px solid green;
  background-repeat: no-repeat;
  background-position:  center;
  background-image: url('images/unten.jpg');
  height:50px;
}
#fussbereich {
  width: 100%;
  clear: both;
  text-align:center;
	padding-top: 10px; 
  border-top: 2px solid #333333; 
  margin-top: 50px;
}

#logobereich {
clear: both;
width: 100%;
text-align: center;
}

#logobereich img {
padding: 5px 10px 5px 10px;
}

/* ==================================================================== 
                      SEITENSPEZIFISCHES
   ==================================================================== */

   
#startseite img {
  border: 0;
}   

   
#startseite #pic01{
  float: left;
  height: 128px;
  width: 128px;
  border: 0px yellow solid; /* zu testen und Fehler suchen */
  padding: 60px 10px 0 10px;
}

#startseite #txt1{
  float: left;
  height: 195px;
  width: 290px;
  margin: 20px 15px 0 15px;
  padding: 30px 0 0 0;
  border: px red solid; /* zu testen und Fehler suchen */
}

#startseite #pic02 {
  float: right;
  padding: 30px 30px 0 0;
}

#startseite #pic03 {
   float: left;
   padding: 23px 10px 0 10px;
}

#startseite #pic04 {
  float: right;
  padding: 0px 80px 0 0;
}

/* Laden ======================================================= */
#laden #hg{
  height: 1180px;
}

#laden #unten{
  margin-top:-20px
}


#laden #endwurf{
padding-top: 8px;
}

#laden #fussbereich {
  margin-top: 5px;
}

#laden #bildbereich01{
  margin-top:15px
}


#laden #container01{
  float:left;
  padding: 5px 10px 0 10px;  
}

#laden #container02{
  float:left;
  padding: 5px 10px 0 5px;  
  border: 0px blue solid; /* zu testen und Fehler suchen */
}

#laden #container03{
  float:right;
  width: 298px;
  padding: 5px 10px 0 5px;
  margin: 0px 200px 0px 0px;  
  border: 0px red solid; /* zu testen und Fehler suchen */
}

#laden #container04{
  position: relative;
  top:-90px;
   float: left;
   width: 800px;
   height: 420px;
   padding: 5px 0 0 10px; 
   border: 0px green solid; /* zu testen und Fehler suchen */
}

#laden #pic01{
height: 73px;
 }
  
#laden #pic02{
  height: 73px;
  padding: 10px 0 10px 0;
}

#laden #pic03{
   height: 73px;
}

#laden #pic05{
float: right;
}

#laden #pic06{
position: relative;
top: -25px;
left: 20px;
}

#laden #pic08{
position: relative;
top: -65px;
left: 50px;
z-index:4;
}

#laden #pic09{
position: relative;
top: -75px;
z-index: 2;
}

#laden #pic10{
float:right;
position: relative;
top: -250px;
left: -260px;
}

#laden #pic11{
float:right;
position: relative;
top: -370px;
left: 200px;
}

#laden #txt01{
float:right;
position: relative;
top: -180px;
left: -195px;
height: 50px;
}

#laden h2{
  font-size: 20px;
  margin: 20px 0 5px 0px;
}

#laden h3{
  font-size: 15px;
  }



/* Werkstatt ======================================================= */

#werkstatt #container01{
margin: 20px 0 0 0;
height:550px;
width: 800px;
border: 0px green solid; /* zu testen und Fehler suchen */
}


#werkstatt #txt01{
color: #3d3426;
font-size: 16px;
padding:0px 0px 0 10px;
height:218px;
width: 580px;
border: 0px green solid; /* zu testen und Fehler suchen */
}

#werkstatt #pic01{
position: relative;
left: 45px;
padding: 0 0 5px 0;
}

#werkstatt #pic02{
float: right;
position: relative;
top: -190px;
right: 85px;
}

#werkstatt #pic04{
position: relative;
top: -125px;
right: 70px;
}

#werkstatt #pic05{
display: inline;
margin-top: 10px;
}

#werkstatt #pic06{
display: inline;
}

#werkstatt #pic07{
float: right;
position: relative;
top:-150px;
right: 208px;

}

#werkstatt p{
padding: 5px 18px 5px 5px;
}

#werkstatt img{
padding: 8px 0 0 5px;
}

#werkstatt #hg{
  height: 700px;
}

/* Termine ======================================================= */
#termine h3{
  margin: 0px 0px 0px 50px;
}

#termine h2{
  margin: 5px 0px 5px 30px;
}

#termine #textbereich {
  background-image: url('images/kochsw.gif');
  background-repeat: no-repeat;
  background-position: 400px 5px;
  text-align: left;
  }
  

#termine #txt01{
    margin: 15px 100px 0 30px;
}

#termine #zusatz{
    margin: 15px 100px 0 30px;
}
/* KONTAKT und BESTAETIGUNG ===========================================*/
#kontakt #hg{
  height: 800px;
}

#kontakt #unten{
  margin-top: 100px;
}

#bestaetigung #textbereich {
  height: 250px;
  padding-top: 150px;
  padding-left: 15px;
  text-align: center;
}

.oben {
  margin-top: 50px;
}

#kontakt #textbereich {
  background-image: url('images/besteck.jpg');
  background-repeat: no-repeat;
  background-position: 440px 20px;
  text-align: center;
  }


input {
  display: block;
  width: 175px;
  float: left;
  margin-bottom: 10px;
}   
   
label {
  display: block;
  text-align: right;
  width: 210px;
  float: left;
  padding-right: 10px;
}

textarea {
  display: block;
  text-align: left;
  width: 240px;
  height: 100px;
  float: left;
  padding-right: 20px;
  margin-bottom: 10px;
}

select   {
  display: block;
  width: 120px;
  float: left;
  margin: 0px 0 10px 0;
}  

#kontakt br {
clear: left;
} 

.first {
clear: left;
} 

.buttonsubmit {
    color: white;
    background-color: #333333;
    float:left;
    width: 100px;
    margin-left: 170px;
}

.buttonreset {
    color: white;
    background-color: #333333;
    float: left;
    width: 100px;
    margin-left: 20px;
}

/* Impressum =============================================================================== */
#impressum #textbereich{
  padding: 15px 0 0 40px;
  width: 500px;
  height: 410px;
  background-image: url('images/besteck.jpg');
  background-repeat: no-repeat;
  background-position: 345px 5px;
}

#impressum #unten{
  margin-top:50px
}

#impressum #hg{
  height: 750px;
}