* { padding: 0; margin: 0;} 
html {height: 101%;}
a { text-decoration: none;
    outline: none;
    color: #009999;}

h1 {font-size: 20px;
    font-style: italic;
    font-weight: bold;
    letter-spacing: 1.5px;
    padding: 10px 0 5px 0;
    }
h1 a {color: black;
     text-decoration: underline;}
h1 a:hover {
     color: #009999;}

h2 {font-size: 16px;
    font-weight: bold;
    letter-spacing: 0.1px;
    padding: 10px 0 5px 0}

h3 {
    text-decoration: underline;
    }
h3 a {color: #009999;
     text-decoration: underline;}

h4 {font-size: 12px;
    font-weight: bold;
    }
    


body {
   background-color: #7f7f7f;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 12px;
   font-weight: bold;
   
   
   }
#wrapper {
   background-color: #dfdfdf;
   width: 980px;
   height: 450px;
   margin-left: auto;
   margin-right: auto;
   }
/*-----------------------------------------------
  Leiste oben
-------------------------------------------------*/



#oben {
   background-color: #b5e3e3;
   position: relative;
   height: 102px;
   width: 980px;
}
#visit {
   background-image: url(../pic/eck3.png);
   background-repeat: no-repeat;
   position: absolute;
   height: 102px;
   margin: 0;
   padding: 10px 10px 10px 100px;
    }

#visit p {font-size: 12px;font-weight:bold;}
#visit span {font-size: 20px;
    font-style: italic;
    font-weight: bold;
    letter-spacing: 1.5px;
    }
#visit a {color: #009999;}

#visit2 {
   position: absolute;
   margin: 10px 10px 10px 436px;
   padding-top: 20px;
   height: 82px;
   
}
#visit2 p {font-size: 10px;font-weight:bold;}
#visit2 span {font-size: 20px;
    font-style: italic;
    font-weight: bold;
    letter-spacing: 1.5px;
    }
#visit2 a {color: #009999;}

#haus {
   position: absolute;
   margin-top: 0;
   margin-left: 700px;
   height: 102px;
}


/*-----------------------------------------------
  Menue1 - waagerecht
-------------------------------------------------*/


#menue1 {
   background-color: #87d1d0; 
   margin-top: 0;
   padding-top: 8px;
   padding-right: 15px;
   text-align: right;
   font-size: 13px;
   font-weight: bold;
   letter-spacing: 1px;
   border-bottom: 2px solid #009999;


}
#menue1 li {

   margin-top: 5px;
   display: inline;
   list-style-type: none;
}
#menue1 ul {

}
#menue1 a {
   color: #3f3f3f;
   background-color: #dfdfdf;
   padding: 2px 10px 5px 10px;
   border-right: 2px solid #009999;
   border-top: 2px solid #009999;
   border-left: 2px solid #009999;
}
#menue1 a:hover,
#home #m-home a,
#impressum #m-impressum a,
#restposten #m-restposten a,
#kontakt #m-kontakt a,
#ausstellung #m-ausstellung a {
   color: #009999;
   }



/*-----------------------------------------------
  Menue2 - senkrecht
-------------------------------------------------*/

#menue2 {
   position: absolute;
   background-color: #87d1d0;
   width: 230px;
   height: 325px;
   margin-top: 10px;
   margin-left: 80px;
   padding-top: 20px;
   z-index: 5;
  }
#menue3 {
   position: absolute;
   background-color: #87d1d0;
   width: 230px;
   height: 337px;
   margin-top: 10px;
   margin-left: 80px;
   padding-top: 20px;
   z-index: 5; 
}

*html #menue2 { margin-top: 10px;padding-top:30px; height: 322px;}
*html #menue3 { margin-top: 10px;padding-top:30px; height: 335px;}

*html #m-bodenbelaege,
*html #m-tueren,
*html #m-markisen,
*html #m-faltstore,
*html #m-terrasse,
*html #m-aktuell,
*html #m-insekten{
          margin-top: 10px;
}
*html #m-tueren1 {margin-top: 0;}

#m-bodenbelaege a,
#m-tueren a,
#m-markisen a,
#m-faltstore a,
#m-terrasse a,
#m-aktuell a,
#m-insekten a {
     color: #3f3f3f;
     display: block;
     height: 15px;
     width: 215px;
     font-size: 13px;
     font-weight: bold;
     letter-spacing: 1px;
     padding: 10px 0 10px 15px;
     margin-top: 10px;
     background-color: #e8e8e8;
     background-image: url(../pic/menue2.jpg);
     background-repeat: no-repeat;


}
#m-tueren1 a {
     color: #3f3f3f;
     display: block;
     height: 15px;
     width: 210px;
     font-size: 13px;
     font-weight: bold;
     letter-spacing: 1px;
     padding: 10px 0 10px 20px;
     margin-top: 5px;
     background-image: url(../pic/menue2.jpg);
     background-repeat: no-repeat;
}

#m-kork,
#m-laminat,
#m-parkett,
#m-vinyl {
    color: #3f3f3f;
    font-size: 12px;
    font-weight: bold;
    letter-spacing: 0;
    text-align: center;
    text-decoration: underline;
    padding: 0 4px 0 6px;
}


#m-kork:hover,
#m-laminat:hover,
#m-parkett:hover,
#m-vinyl:hover {color: #009999;
}

#kork #m-kork,
#laminat #m-laminat,
#parkett #m-parkett,
#vinyl #m-vinyl { color: #009999;}


#m-bodenbelaege a:hover,
#bodenbelaege #m-bodenbelaege a {
    background-image: url(../pic/boden.jpg);
    background-repeat: no-repeat;
    color: #009999;
}
#m-tueren1 a:hover,
#m-tueren a:hover,
#tueren #m-tueren a {
    background-image: url(../pic/tuer.jpg);
    background-repeat: no-repeat;
    color: #009999;
}
#m-markisen a:hover,
#markisen #m-markisen a {
    background-image: url(../pic/markisen.jpg);
    background-repeat: no-repeat;
    color: #009999;
}
#m-faltstore a:hover,
#faltstore #m-faltstore a {
    background-image: url(../pic/faltstore.jpg);
    background-repeat: no-repeat;
    color: #009999;
}

#m-insekten a:hover,
#insekten #m-insekten a {
    background-image: url(../pic/insekten.jpg);
    background-repeat: no-repeat;
    color: #009999;
}
#m-terrasse a:hover,
#terrasse #m-terrasse a {
    background-image: url(../pic/terrasse.jpg);
    background-repeat: no-repeat;
    color: #009999;
}
#m-terrasse a:hover,
#terrasse #m-terrasse a {
    background-image: url(../pic/terrasse.jpg);
    background-repeat: no-repeat;
    color: #009999;
}
#m-aktuell a:hover,
#aktuell #m-aktuell a {
    background-image: url(../pic/aktuell.jpg);
    background-repeat: no-repeat;
    color: #009999;
}


/*-----------------------------------------------
  unten
-------------------------------------------------*/




#unten {
   position: relative;
   background-color: #dfdfdf;
   width: 980px;
   height: 100%; 


}
/*-----------------------------------------------
  unten links
-------------------------------------------------*/



#inhalt-links {
    position: absolute;
    z-index: 3;
    left: 0;
    width: 349px;
    height: 450px;
    background-image: url(../pic/hg3.jpg);
    border-right: solid 1px #009999;

}


#inhalt-links table {

   position: absolute;
   background-image: url(../pic/hg4.jpg);
   /*background-color: #dfdfdf;*/
   width: 349px;
   /*border: solid 1px #009999;   */
   border-bottom: solid 1px #009999;
   height: 100px;
   margin-top: 346px;
   padding-bottom: 10px;
   }

#inhalt-links th {
   padding-top: 10px;
   font-size: 10px;
   letter-spacing: 0.5px;
   color: #5f5f5f;

}
#inhalt-links th span {
   font-size: 17px;
   letter-spacing: -0.5px;
   color: #009999;
   font-weight: bold;
  }

#inhalt-links td {
   text-align: center;
   color: #009999;
   font-weight: bold;
   font-size: 18px;
   letter-spacing: 0.5px;

}



/*-----------------------------------------------
  unten  rechts
-------------------------------------------------*/


#inhalt-rechts1 {
    position: absolute;
    left: 350px;
    height: 450px;
    width: 630px;
    background-color: #dfdfdf;

    }
#inhalt-rechts2 {
    position: absolute;
    padding-left: 350px;
    height: auto;
    width: 630px;
    background-color: #dfdfdf;
    z-index: 2;
    }

#text {
    padding: 10px;
    line-height: 160%;
}

#text span a {
    color: #009999;
    font-weight: bold;
}

#text ul {
    margin-left: 30px;
    
}
#text ul a {
     color: #009999;
}

/*-----------------------------------------------
  klassen
-------------------------------------------------*/
.zoom-bereich {
 position: absolute;
 text-align: center;
 font-weight: bold;
 cursor: pointer;
 z-index:100;
}

.zoom-beschreibung {
 color: #FFFFFF;
 background-color: #000000;
 padding: 10px;
 display: none;
}



.bild-zoom {
   float: right;
   padding: 10px;
   border: 3px solid #f2f2f2;
   margin-bottom: 10px;
   margin-left: 10px;
   cursor: pointer; 
}



.bild-rest,
.bildrechts2 {
   float: right;
   padding: 10px;
   border: 3px solid #f2f2f2;
   margin-bottom: 10px;
   margin-left: 10px;
}
.bild-rechts {
   float: right;
   padding: 10px;
   margin-bottom: 10px;
   margin-left: 10px;
}


#lauf {
   height: 300px;
   width: 580px;
   padding: 8px;
   border: 3px solid #f2f2f2;
   margin-top: 6px;
}
.bilderscroll {
   width: 100%;
   padding-top: 5px;
   white-space: nowrap;
   overflow-x: scroll;
}
.schrift-klein {
   font-size: x-small;
 }


.clear {clear: both;
position: relative;}

.rot {color:red; font-weight:bold;}


/*-----------------------------------------------
  kontakt
-------------------------------------------------*/
form { width: 100%;} 

fieldset {
   padding: 10px;
   border: solid 2px #009999; 
}
legend {
    color: #009999;
    font-size: 12px;
    padding: 2px;
    margin: 2px;
}

#adresse p {
   clear: left;
   float: left;
   width: 100%;
   padding: 2px; 
}
#adresse input {
   width: 300px;
   float: left;
   margin: 4px;
   padding: 2px;
   border: solid 1px silver;
   display: block;
}

#adresse label {
  width: 60px;
  cursor: pointer;
  font-weight: bold;
  text-align: right;
  float: left;
  margin: 2px 0;
  padding: 2px;
  }
#adresse label[for="nachname"] {     width: 80px; }

/* IE 7 */
* + html #adresse label {
   width: 80px;
}
/* IE 7 */
* + html #adresse input#nachname { width: 185px; }


#adresse input#vorname,
#adresse input#nachname {  width: 165px; }

#adresse input#plz,
#adresse input#nr {   width: 50px; }



#box ul {
    margin-top: 210px;
    margin-bottom: 15px;
    margin-left: 0;
    list-style-type: none;
}

#box li {  padding-left: 10px; }
#box p {   padding: 10px 0 10px 0;}

*html #box ul { margin-top: 10px;  }

/* IE 7 */
* + html #box ul {
   margin-top: 10px;
}


#mit {
   display: block;
   text-align: left;
}

#mit textarea {
   margin-top: 8px;
   height: 60px;
}
#send input {
   cursor: pointer;
   color:#000000;
   border: 1px solid #009999;
   background-color: #f2f2f2;
   width:150px;
   height: 25px;
}  

#vorname, #nachname, #strasse, #nr, #plz, #ort, #telefon, #absender, #mit  {
   background: #dfdfdf;
}

input#vorname:focus,
input#nachname:focus,
input#strasse:focus,
input#nr:focus,
input#plz:focus,
input#ort:focus,
input#absender:focus,
input#telefon:focus,
input#checkbox:focus,
textarea#mit:focus {
   background-color: #87d1d0;
}

/*-----------------------------------------------
  Info-Feld
-------------------------------------------------*/

#info {
  position: absolute; 
  left: 380px;
  top:140px;
  z-index:10; 
  width:600px; 
  height:70px; 
  background-image: url(../pic/halb-transp.png);
  
  border: 1px solid #009999;
  font-family: Verdana; 
  font-weight: lighter;
  padding: 2px;
  
  
  
}
#info-oben {
    height: 20px;
   
    
}
#info-oben p {
    padding-left: 0;
    font-size: 13px;
    color: #ff0000;
}

.info-bild-rechts {
    float: right;
    border: none;
}
#info-mitte {
   height: 35px;
    
}

#info-unten {
   height: 15px;
   margin-top: 7px; 
}
                                                                                          
                                                                                          
/*-----------------------------------------------
  NEU BEI UNS
-------------------------------------------------*/
                                                                                          
#neu-bei-uns {
    position: absolute;
    margin-top: 95px;
    margin-left: 38px;
    width: 300px;
    height: 40px;
    z-index: 30;
   
}                                                                                         
#neu-bei-uns p {
    padding-top: 15px;
    padding-left: 60px;
}
#neu-bei-uns p em {
    background-color: #dfdfdf;
    padding: 3px 5px 3px 5px;
    border-left: 2px solid #009999;
    border-top: 2px solid #009999;
    border-right: 2px solid #009999;
    font-style: normal;
    letter-spacing: 1px;
}
#neu-bei-uns a { color: #000000;}                                                         
#neu-bei-uns a:hover { color: #009999;}
#strom #neu-bei-uns a { color: #009999;}

                                
#neu-bei-uns img  {
    position: absolute;
    top: 0;
    left: 0;
    float: left;
    border: 0;
    
}                                                                                          
                                                                                          
                                                                                          
                                                                                          
                                                                                          
                                                                                                      

/*-----------------------------------------------
  NEU
-------------------------------------------------*/

#neu {
    position: absolute;
    margin-top: 270px;
    margin-left: 30px;
    width: 56px;
    height: 56px;
    z-index: 20; 
}
#neu img {
    border: 0;
}


/*-----------------------------------------------
  Ende
-------------------------------------------------*/


/* ******************************************
 * Betriebsferien
 * ******************************************* */
 
#betriebsferien {
    position: absolute;
    top: 20px;
    left: 370px;
    width: 450px;
    height: 280px;
    background-color: #87d1d0;
    border: solid 2px #009999;
    z-index: 100;
    padding: 10px;
}
#betriebsferien .kreuz {
    position: absolute;
    text-align: right;
    bottom: 0px;
    right: 0px;
    z-index: 120;
}
#betriebsferien .text {
    line-height: 18px;
}
#betriebsferien .text u {
    font-size: larger;
}
