html {
                padding:0px;
                margin:0px;
                height:96%;
        }

body {margin:0px;
        padding:0px;
        height:96%;
         font-family:'Arial', 'Helvetica', 'sans-serif';
         font-size:1em;
         color:#404042;
         background-color:#ffffff;}

p {}



h1  {
        font-size:1.3em;
        font-weight:300;
        margin:0px;
        margin-top:3px;
         }

h3  {color:#ffffff;
        font-size:1.1em;
        margin:0px;
        margin-top:3px;
         }
ul {margin-left:12px;
         padding:0px;}
li {margin-left:3px;
         padding:0px;}


.link1  {color:#404042;
         font-size:1.4em;
         text-decoration:none;
         line-height:1.8em;
         font-weight:300;}

.link2  {color:#404042;
         font-size:1.4em;
         text-decoration:none ;
         line-height:1.8em;
         font-weight:600;}

.linkklein1  {color:#ffffff;
         font-size:1em;
         text-decoration:none;
         line-height:1.4em;
         font-weight:300;
         margin-right:0px;}

.linkklein2  {color:#ffffff;
         font-size:1em;
         text-decoration:none;
         line-height:1.2em;
         font-weight:300;
         margin-right:0px;}

.listenlink {color:#404042;
         text-decoration:underline;}




@media all and (orientation:landscape)
         {


#navi_button  {display:none;}
.kontakt {font-size:1em;}

#haupt {                min-height: 100%;
                         height: auto !important;
                        height:100%;
                        margin: 0 auto ;}

#logo  { position:absolute;
         left:3em;
         top:3em;
         height:auto;
         width:20%;}

#navi { position:absolute;
         left:3em;
         top:28%;
         height:40%;
         width:16%;
         text-align:right;}

#mitte {position:absolute;
         top:0%;
         left:30%;
         width:38%;
         height:85%;
         background-color:#c0c1c2;}

#headline {position:absolute;
         top:2%;
         left:10%;
         width:80%;
         height:auto;}

#bilder  {position:absolute;
         top:24%;
         left:11%;
         width:80%;
         height:auto;}

.tab_bilder {width:88%;}

#map  {position:absolute;
         top:5%;
         left:11%;
         width:80%;
         height:auto;}



#rechts {position:absolute;
         right:2%;
         top:17%;
         height:40%;
         width:28%;
         }

#referenzen {
float:left;

}

#footer{
         position:absolute;
         left:0em;
         bottom:0em;
         background-color:#404042;
         height:10em;
         width:100%;}
#wir {position:absolute;
     left:1em;
     top:1em;
     width:29%;
     font-size:0.8em;
     color:#ffffff;}

#anschrift {position:absolute;
     left:32%;
     top:1em;
     width:19%;
     font-size:0.9em;
     color:#ffffff;}

#naviuntenlinks {position:absolute;
     left:56%;
     top:1em;
     width:19%;
     font-size:1em;
     color:#ffffff;}

#naviuntenrechts {position:absolute;
     left:76%;
     top:1em;
     width:19%;
     font-size:1em;
     line-height:1.5em;
     color:#ffffff;}
}

@media all and (orientation:landscape) and (max-height : 680px)  {
body  {font-size:0.8em;}
}

@media all and (orientation:landscape) and (max-height : 595px)  {

.link1  {
         font-size:1.5em;
         line-height:1.8em;}

.link2  {
         font-size:1.5em;
         line-height:1.8em;
         font-weight:600;}

.linkklein1  {
         font-size:1em;
         line-height:1.2em;
         margin-right:0px;}

.linkklein2  {
         font-size:1em;
         line-height:1.2em;
         margin-right:0px;}

#logo  { position:absolute;
         left:2em;
         top:1em;
         height:auto;
         width:20%;}

body  {font-size:0.6em;}
}

input  {font-size:0.6em;}

.kontakt {font-size:0.6em;}

@media all and (orientation:landscape) and (max-height : 380px)  {
body  {font-size:0.5em;}
input  {font-size:0.5em;}

.kontakt {font-size:0.5 em;}
}







@media all and (orientation:portrait)
         {
h1  {text-align:center;}

#haupt {                min-width: 100%;
                         width: auto;
                        height:100%;
                        margin: 0 auto ;}

#navi {  display:none;
         position:absolute;
         right:0em;
         top:18%;
         height:auto;
         width:40%;
         text-align:left;
         z-index:30;
         background-color:#ffffff;
         padding:0.5em;}

#navi_button  { position:absolute;
         right:0.2em;
         top:0.2em;
         height:auto;
         width:20%;}

#logo  { position:absolute;
         left:0.2em;
         top:0.2em;
         height:auto;
         width:70%;}

#mitte {position:absolute;
         top:18%;
         left:0%;
         width:100%;
         height:58%;
         background-color:#c0c1c2;}

#headline {position:absolute;
         top:0.5em;
         left:10%;
         width:80%;
         height:auto;}

#bilder  {position:absolute;
         top:25%;
         left:10%;
         width:80%;
         height:auto;}

.tab_bilder {width:88%;}

#map  {position:absolute;
         top:2%;
         left:2%;
         width:96%;
         height:auto;}



#rechts {position:absolute;
         left:2%;
         top:79%;
         height:auto;
         width:92%;
         }

#referenzen {
float:left;

}

#footer{
         position:absolute;
         left:0em;
         top:150%;
         background-color:#404042;
         height:13em;
         width:100%;}
#wir {position:absolute;
     left:1em;
     top:12em;
     width:90%;
     font-size:0.6em;
     color:#ffffff;}

#anschrift {position:absolute;
     left:3%;
     top:1em;
     width:40%;
     font-size:0.6em;
     color:#ffffff;}

#naviuntenlinks {position:absolute;
     left:46%;
     top:1em;
     width:30%;
     font-size:0.7em;
     color:#ffffff;}

#naviuntenrechts {position:absolute;
     left:78%;
     top:1em;
     width:30%;
     font-size:0.7em;
     line-height:1em;
     color:#ffffff;}

}

@media all and (orientation:portrait) and (max-height : 500px) {

body  {font-size:0.8em;}
input  {font-size:0.8em;}

.kontakt {font-size:0.8 em;}
 .tab_bilder {width:70%;}

 #headline {position:absolute;
         top:0.4em;
         left:20%;
         width:60%;
         height:auto;}

}