@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 100;
  src: url('/fonts/roboto-v18-latin-100.eot');
  src: local('Roboto Light'), local('Roboto-Light'),
       url('/fonts/roboto-v18-latin-100.eot?#iefix') format('embedded-opentype'), 
       url('/fonts/roboto-v18-latin-100.woff2') format('woff2'), 
       url('/fonts/roboto-v18-latin-100.woff') format('woff'), 
       url('/fonts/roboto-v18-latin-100.ttf') format('truetype'), 
       url('/fonts/roboto-v18-latin-100.svg#Roboto') format('svg'); 
}


/* roboto-300italic - latin */
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 300;
  src: url('/fonts/roboto-v18-latin-300italic.eot');
  src: local('Roboto Light Italic'), local('Roboto-LightItalic'),
       url('/fonts/roboto-v18-latin-300italic.eot?#iefix') format('embedded-opentype'), 
       url('/fonts/roboto-v18-latin-300italic.woff2') format('woff2'), 
       url('/fonts/roboto-v18-latin-300italic.woff') format('woff'), 
       url('/fonts/roboto-v18-latin-300italic.ttf') format('truetype'), 
       url('/fonts/roboto-v18-latin-300italic.svg#Roboto') format('svg'); 
}

/* roboto-300 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: url('/fonts/roboto-v18-latin-300.eot');
  src: local('Roboto Light'), local('Roboto-Light'),
       url('/fonts/roboto-v18-latin-300.eot?#iefix') format('embedded-opentype'), 
       url('/fonts/roboto-v18-latin-300.woff2') format('woff2'), 
       url('/fonts/roboto-v18-latin-300.woff') format('woff'), 
       url('/fonts/roboto-v18-latin-300.ttf') format('truetype'), 
       url('/fonts/roboto-v18-latin-300.svg#Roboto') format('svg'); 
}

/* roboto-regular - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/roboto-v18-latin-regular.eot');
  src: local('Roboto'), local('Roboto-Regular'),
       url('/fonts/roboto-v18-latin-regular.eot?#iefix') format('embedded-opentype'), 
       url('/fonts/roboto-v18-latin-regular.woff2') format('woff2'), 
       url('/fonts/roboto-v18-latin-regular.woff') format('woff'), 
       url('/fonts/roboto-v18-latin-regular.ttf') format('truetype'), 
       url('/fonts/roboto-v18-latin-regular.svg#Roboto') format('svg'); 
}

/* roboto-italic - latin */
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 400;
  src: url('/fonts/roboto-v18-latin-italic.eot');
  src: local('Roboto Italic'), local('Roboto-Italic'),
       url('/fonts/roboto-v18-latin-italic.eot?#iefix') format('embedded-opentype'), 
       url('/fonts/roboto-v18-latin-italic.woff2') format('woff2'), 
       url('/fonts/roboto-v18-latin-italic.woff') format('woff'), 
       url('/fonts/roboto-v18-latin-italic.ttf') format('truetype'), 
       url('/fonts/roboto-v18-latin-italic.svg#Roboto') format('svg'); 
}

/* roboto-700 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: url('/fonts/roboto-v18-latin-700.eot');
  src: local('Roboto Bold'), local('Roboto-Bold'),
       url('/fonts/roboto-v18-latin-700.eot?#iefix') format('embedded-opentype'), 
       url('/fonts/roboto-v18-latin-700.woff2') format('woff2'), 
       url('/fonts/roboto-v18-latin-700.woff') format('woff'), 
       url('/fonts/roboto-v18-latin-700.ttf') format('truetype'), 
       url('/fonts/roboto-v18-latin-700.svg#Roboto') format('svg'); 
}

html, body{
padding: 0px; 
margin:0px; 
font-family: 'Roboto', Segoe, Helvetica, Arial, Verdana, Sans, Lucida;
font-size: 1.0em; 
}

#coronainfo.offen {
    left: 0%;
}
#coronainfo {
    position: relative;
    left: -150%;
    top: 140px;
    width: 60%;
    margin: 0px 19% 0px 20%;
    padding: 20px;
    border: 5px solid #DFDFDF;
    border-radius: 30px;
    background-color: #FFFFFF;
    opacity: 0.95;
    -webkit-transition: 1.5s ease-in-out;
    -moz-transition: 1.5s ease-in-out;
    -o-transition: 1.5s ease-in-out;
    -ms-transition: 1.5s ease-in-out;
    transition: 1.5s ease-in-out;
    z-index: 20000;
    font-size: 1.1em;
}
#coronainfo a#schliessen {
    text-decoration: none;
    color: #FFFFFF;
    padding: 15px 30px 15px 30px !important;
    border-radius: 20px;
    font-weight: bold;
    float: right !important;
    display: inline-block;
    background-color: #666666;
    border: 0px solid #FF0000;
}
#coronainfo a:link, #coronainfo a:visited {
    text-decoration: none;
    color: #A38000;
    -webkit-transition: 1.0s ease-in-out;
    -moz-transition: 1.0s ease-in-out;
    -o-transition: 1.0s ease-in-out;
    -ms-transition: 1.0s ease-in-out;
    transition: 1.0s ease-in-out;
}


#linkeseite{
width: 24%; 
height: 100%; 
border-left: 0px solid #FF0000; 
border-right: 0px solid #FF0000; 
border-top: 0px solid #FF0000; 
border-bottom: 0px solid #FF0000; 
position: fixed; 
left: 0px; 
top: 0px; 
}

div.custom_slogan{
border: 0px solid #FF0000; 
font-family: 'Amatic SC', Segoe, Helvetica, Arial, Verdana, Sans, Lucida; 
font-size: 1.6em; 
margin: 0px 0px 0px 0px; 
padding: 0px 5% 30px 10%; 
transform: rotate(-2deg); 
color: #000000; 
opacity: 0.5;
width: 80%; 
float: left; 
} 
div.custom_oeffnungszeiten{
padding: 30px 10px 10px 30px; 
margin: 30px 0px 0px 0px; 
font-weight: 100;
line-height: 0.9em; 
}
div.custom_oeffnungszeiten strong{
font-weight: 300; 
color: #999999; 
}
div.custom_oeffnungszeiten table{
border-bottom: 1px solid #999999; 
padding: 0px 0px 10px 0px; 
}
div.custom_oeffnungszeiten td{
text-align: right; 
}

#logo{
width: 100%; 
height: 130px; 
float: left; 
position: relative; 
border-bottom: 30px solid #000000; 
}
#logo #signet{
padding: 0px 0px 0px 0px; 
margin: 0px 0px 0px 0px; 
width: 100%; 
height: auto; 
position: absolute;  
bottom: 5px; 
left: 0px; 
border: 0px solid #FF0000; 
}
#logo #meister{
position: absolute;  
bottom: -30px; 
left: 0px; 
border: 0px solid #FF0000; 
height: auto; 
width: 35%; 
padding: 0px 0px 0px 30px;
margin: 0px 0px 0px 0px; 
}

#biber{
position: fixed;  
right: 10px;
width: 140px; 
height: 140px; 
padding: 10px 0px 0px 10px; 
margin: 0px 0px 0px 0px; 
z-index: 1000; 
border: 0px solid #FF0000; 
}
#biber img{
-webkit-transition: 0.5s ease-in-out 1.8s;
-moz-transition: 0.5s ease-in-out 1.8s;
-o-transition: 0.5s ease-in-out 1.8s;
-ms-transition: 0.5s ease-in-out 1.8s;
transition: 0.5s ease-in-out 1.8s; 
transform: rotate(0deg); 
width: 100%; 
height: auto; 
margin: 0px 0px 0px 0px;  
padding: 0px; 
}

#navigation{
width: 100%; 
min-height: 450px; 
padding: 30px 0px 0px 0px; 
margin: 0px; 
border: 0px solid #FF0000; 
background: #3F3F3F; 
float: left;
}

#navigation ul{
font-weight: 400; 
list-style-type: none; 
margin: 0px; 
padding: 0px 0px 0px 11%; 
}
#navigation ul ul{
font-weight: 300; 
padding: 0px 0px 10px 5%;
}
#navigation ul li{
display: block; 
margin: 0px; 
padding: 0px; 
}
#navigation ul li a:link,#navigation ul li a:visited {
line-height: 40px; 
color: #FFFFFF; 
text-decoration: none;
text-transform: uppercase; 
}
#navigation ul li li a:link,#navigation ul li a:visited{
line-height: 30px; 
text-transform:none;
padding: 0px; 
margin: 0px; 
}

#rechteseite{
position: absolute; 
top: 0px; 
left: 24%; 
width: 76%; 
height: 100%; 
border: 0px solid #FF0000; 
margin: 0px; 
padding: 0px;
} 

#topnav{
background-image: url('../images/weiss_80.png'); 
background-repeat: repeat; 
opacity: 1.0; 
border-bottom: 30px solid #000000; 
padding: 0px 0px 0px 0px; 
margin: 0px 0px 0px 24%; 
width: 76%; 
height: 130px; 
position: fixed; 
top: 0px; 
left: 0px; 
display: block; 
z-index: 300; 
}
#topnav span.image-title{
display: none; 
}

#topnav ul{ 
border: 0px solid #00FF00; 
width: auto; 
list-style-type: none; 
padding: 0px; 
margin: 40px 0px 0px 0px; 
position: absolute; 
left: 0px; 
}

#topnav ul li{
float: left;
line-height: 40px; 
}
#topnav ul li a:link, #topnav ul li a:visited{
padding: 0px 20px 0px 20px; 
margin: 0px;
text-decoration: none; 
}

#page_1{
width: 100%; 
min-height: 100%; 
height: 100%; 
margin: 0px 0px 0px 0px; 
padding: 0px 0px 0px 0px; 
z-index: 100; 
border: 0px solid #FF0000; 
display: block; 
background-repeat: no-repeat; 
background-position: center center; 
background-attachment: fixed; 
background-size: cover;
}

#page{
width: 100%; 
margin: 0px 0px 0px 0px; 
padding: 0px 0px 0px 0px; 
z-index: 100; 
display: block; 
border: 0px solid #FF0000; 
position:relative; 
min-height: 100%; 
}

a#pageend{
margin: 0px 0px 0px 0px; 
padding: 60px 0px 0px 0px; 
width: 100%; 
height: auto; 
position:relative; 
border:0px solid #FF0000; 
display: inline; 
}
.spacebetween{
height: 250px; 
width: 100%; 
border: 0px solid #FF0000; 
float: left; 
}
.spacebtn{
height: 150px; 
width: 100%; 
border: 0px solid #FF0000; 
float: left; 
}

.item-page hr, .item-page h4{
width: 100%; 
float: left; 
}

.item-page{
width: 80%; 
min-height: 100%; 
margin: 0px 0px 0px 0px; 
padding: 0px 0px 0px 10%; 
z-index: 10; 
border:0px solid #FF0000;  
-ms-hyphens: auto;
-moz-hyphens: auto;
-webkit-hyphens: auto;
hyphens: auto; 
font-weight: 300; 
font-size: 1.2em; 
line-height: 1.3em; 
}
/*.item-page a:link + img, .item-page a:visited + img{
border: 1px solid #FFFFFF !important; 
:visited
:link
}*/

.item-page a:link, .item-page a:visited{
text-decoration: none; 
border-bottom: 1px dashed #000000; 
color: #666666; 
}


a.backbtn:link, a.backbtn:visited{
display: block; 
width: 20%; 
clear: both; 
float: left; 
background: rgba(219,219,219,1);
background: -moz-linear-gradient(left, rgba(219,219,219,1) 0%, rgba(209,209,209,1) 0%, rgba(226,226,226,0.82) 60%, rgba(254,254,254,0.7) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(219,219,219,1)), color-stop(0%, rgba(209,209,209,1)), color-stop(60%, rgba(226,226,226,0.82)), color-stop(100%, rgba(254,254,254,0.7)));
background: -webkit-linear-gradient(left, rgba(219,219,219,1) 0%, rgba(209,209,209,1) 0%, rgba(226,226,226,0.82) 60%, rgba(254,254,254,0.7) 100%);
background: -o-linear-gradient(left, rgba(219,219,219,1) 0%, rgba(209,209,209,1) 0%, rgba(226,226,226,0.82) 60%, rgba(254,254,254,0.7) 100%);
background: -ms-linear-gradient(left, rgba(219,219,219,1) 0%, rgba(209,209,209,1) 0%, rgba(226,226,226,0.82) 60%, rgba(254,254,254,0.7) 100%);
background: linear-gradient(to right, rgba(219,219,219,1) 0%, rgba(209,209,209,1) 0%, rgba(226,226,226,0.82) 60%, rgba(254,254,254,0.7) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dbdbdb', endColorstr='#fefefe', GradientType=1 );
color: #000000; 
padding: 10px 0px 10px 1%; 
margin: 10px 79% 0px 0px; 
}

.googlemaps{
width: 98%; 
padding: 1px; 
margin: 0px; 
border: 1px solid #999999; 
}


h2{
-webkit-transition: 0.5s ease-in-out;
-moz-transition: 0.5s ease-in-out;
-o-transition: 0.5s ease-in-out;
-ms-transition: 0.5s ease-in-out;
transition: 0.5s ease-in-out;
margin: 0px 0px 0px 24%; 
padding: 120px 10% 0px 30%;  
background: #000000; 
opacity: 0.7; 
font-family:'Amatic SC', Segoe, Helvetica, Arial, Verdana, Sans, Lucida;
font-size: 3.0em; 
line-height: 1.2em; 
color: #FFFFFF; 
text-align: right; 
position: fixed; 
width: 36%; 
height: 360px; 
left: 0px; 
top: 160px; 
z-index: 200; 
-ms-hyphens: none;
-moz-hyphens: none;
-webkit-hyphens: none;
hyphens: none; 
}

span.headline{
display: block; 
padding: 0px 20px 0px 0px; 
}

h2.startseite{
line-height: 1.2em; 
height: 360px; 
z-index: 210; 
overflow: hidden; 
}

#leseweiter{
border: 0px solid #FF0000; 
position: absolute; 
left: 42%; 
bottom: 50px; 
z-index: 10; 
width: 100px; 
height:100px; 
}
#leseweiter img{
width: 100%; 
height:100%; 
padding: 0px; 
margin: 0px; 
}
.item-page img{max-width: 90%; height: auto;}

#footerzentrieren{
-webkit-transition: 0.8s ease-in-out 0.5s;
-moz-transition: 0.8s ease-in-out 0.5s;
-o-transition: 0.8s ease-in-out 0.5s;
-ms-transition: 0.8s ease-in-out 0.5s;
transition: 0.8s ease-in-out 0.5s; 
position: fixed; 
bottom: 0px; 
width: 76%; 
right: 0px; 
z-index: 300; 
}
#footer{
background: #000000;
opacity: 0.7;
color: #FFFFFF; 
text-align: center; 
height: 40px; 
line-height: 40px; 
}
#footer a:link, #footer a:visited{
color: #FFFFFF; 
text-decoration: none; 
}



img.headerbild, a.iwu_logo{
display: none; 

}

a.backbutton{
border: 3px solid #999999; 
height: 32px; 
width: 47px; 
border-radius: 40px; 
position: fixed; 
left: 30px; 
bottom: 50px; 
background-color: #DFDFDF; 
line-height: 1.0em; 
text-decoration: none; 
color: #000000; 
font-size: 0.7em; 
font-weight: 300; 
text-align: center; 
z-index: 2000; 
opacity: 0.5; 
margin: 0px; 
padding: 12px 0px 3px 0px;  
display: none; 
}
a.backbutton:hover, a.backbutton:focus{opacity: 1.0;}

a#onlineplaner, a#budgetplaner, a#hzplaner, a#virtuell{
color: #FFFFFF; 
background-color: #3F3F3F; 
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.50);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.50);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.50);
font-size: 0.8em; 
line-height: 25px; 
text-decoration:none; 
text-align: center; 
border: 1px solid #999999; 
border-radius: 20px; 
height: 25px; 
position: fixed; 
z-index: 1010; 
opacity: 1.0; 
padding: 5px 10px 5px 10px; 
margin: 25px 0px 0px 0px; 
-webkit-transition: 0.5s ease-in-out;
-moz-transition: 0.5s ease-in-out;
-o-transition: 0.5s ease-in-out;
-ms-transition: 0.5s ease-in-out;
transition: 0.5s ease-in-out;
}
a#onlineplaner{
left: calc(25% + 280px); 
top: 100px; 
width: 100px; 
}
a#budgetplaner{
left: calc(25% + 420px); 
top: 100px; 
width: auto; 
}
a#hzplaner{
left: 25%; 
top: 100px; 
width: 100px; 
}
a#virtuell{
left: calc(25% + 140px);
top: 100px; 
width: 100px; 
}

a#onlineplaner span, a#budgetplaner span, a#hzplaner span, a#virtuell span{display:block; }
a#onlineplaner strong, a#budgetplaner strong, a#hzplaner strong, a#virtuell strong{
font-size: 1.1em; 
font-weight: 500;
}
a#onlineplaner img, a#budgetplaner img, a#hzplaner img, a#virtuell img{
width: 100px; 
height: 100px; 
border: 0px solid #FFFFFF; 
}
a#budgetplaner:hover, a#budgetplaner:focus, 
a#onlineplaner:hover, a#onlineplaner:focus,
a#hzplaner:hover, a#hzplaner:focus,
a#virtuell:hover, a#virtuell:focus {
opacity: 1.0; 
background-color: #6F6F6F; 
}

/* KONTAKTFORMULAR*/
#formular {
width: 70%; 
margin-right: 10%; 
padding: 0px; 
font-size: 0.9em; 
}
#musthave{margin-top: 20px; margin-bottom: 20px; border-bottom: 1px solid #999999;}
.red{color: #FF0000;}
#name, #vorname, #strasse, #plzort, #email, #telefon, #fax, #infotext{width: 100%; float: left; margin: 0px; padding-bottom: 20px; border: 0px solid #FF0000;}
.label{width: 100%; float: left;}
.input input{float: left; width: 100%; border: 1px solid #999999; border-radius: 8px; padding: 5px; font-size: 1.0em; color: #666666;}
#infotext, #infomediatext, #kommentar{border-top: 0px solid #999999; }
.infocheck, .callme, .mailme, .snailme{border: 0px solid #FF0000; width: 100%; }
.infocheck input, #infomediatext input{margin-right: 15px;}
#infomediatext{margin-top: 15px; width: 100%; float: left; }
#kommentar textarea{font-family: 'Roboto', sans-serif, Arial, Verdana; width: 100%; height: 100px; border: 1px solid #999999; padding: 5px; font-size: 1.0em; color: #666666; border-radius: 8px; margin-top: 20px;}

#pruefung{background-color: #E5E5E5; padding-top: 10px; padding-bottom: 10px; padding-left: 0px; padding-right: 0px; text-indent: 10px; margin-top: 10px; margin-bottom: 10px; border: 1px solid #999999;}
#pruefung .label{width: 100%; float: none;}
#pruefung .label b{margin-right: 10px;}
#pruefung .label strong{font-size: 1.2em; color: #FF0000;}
#pruefung .label input{float: none; border: 1px solid #999999; border-radius: 8px; padding: 5px; font-size: 1.0em; font-weight: 300; text-align: center; color: #FF3333;}
#yodata{border-top: 1px solid #999999; margin-top: 30px; margin-bottom: 10px;}
#submitit input{border: 1px solid #999999; border-radius: 8px; padding: 5px; font-size: 1.0em; font-weight: 300; text-align: center; color: #000000;}
#submitit input:hover{background-color: #E5E5E5;}

#datenschutzoptin{border: 1px solid #999999; background: #F5F5F5;border-radius: 8px; padding: 10px; font-size: 0.9em; }
#datenschutzoptin b{background: #FFFFFF;padding: 10px;border-radius: 8px;display:block; width: 98%; }
#daten_ok{border: 1px solid #999999;background: #FFFFFF;padding: 10px;border-radius: 8px;display:block; width: 98%;}
.label_dsgvo{border: 0px solid #999999;}

/* KONTAKTFORMULAR*/
 
 #downloadfiles a:link, #downloadfiles a:visited{
 line-height: 0px; 
 height: 40px; 
 vertical-align: center; 
 border: 0px solid #FF0000; 
 display: block; 
 padding:0px 0px 10px 0px; 
 margin: 0px; 
 color: #666666; 
 font-weight: 500; 
}
#downloadfiles a:hover, #downloadfiles a:focus{
color: #000000; 
}
 
 #downloadfiles a:link img, #downloadfiles a:visited img{
 margin: 0px 10px 0px 0px; 
 padding: 0px; 
 position: relative; 
 bottom: -10px; 
 }
 
#ref_seite{}
#ref_seite h3{
font-size: 1.1em; 
font-weight: 500; 
display: block; 
width: 100%; 
float: left; 
border: 0px solid #FF0000; 
background: rgba(219,219,219,1);
background: -moz-linear-gradient(left, rgba(219,219,219,1) 0%, rgba(209,209,209,1) 0%, rgba(226,226,226,0.82) 60%, rgba(254,254,254,0.7) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(219,219,219,1)), color-stop(0%, rgba(209,209,209,1)), color-stop(60%, rgba(226,226,226,0.82)), color-stop(100%, rgba(254,254,254,0.7)));
background: -webkit-linear-gradient(left, rgba(219,219,219,1) 0%, rgba(209,209,209,1) 0%, rgba(226,226,226,0.82) 60%, rgba(254,254,254,0.7) 100%);
background: -o-linear-gradient(left, rgba(219,219,219,1) 0%, rgba(209,209,209,1) 0%, rgba(226,226,226,0.82) 60%, rgba(254,254,254,0.7) 100%);
background: -ms-linear-gradient(left, rgba(219,219,219,1) 0%, rgba(209,209,209,1) 0%, rgba(226,226,226,0.82) 60%, rgba(254,254,254,0.7) 100%);
background: linear-gradient(to right, rgba(219,219,219,1) 0%, rgba(209,209,209,1) 0%, rgba(226,226,226,0.82) 60%, rgba(254,254,254,0.7) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dbdbdb', endColorstr='#fefefe', GradientType=1 );
color: #000000; 
padding: 10px 10px 10px 10px; 
margin: 30px 0px 0px 0px; 
}
#ref_seite #baeder, #ref_seite #saunaplan, #ref_seite #realesaunen, #ref_seite #extrasaunen{
clear: both; 
display: block; 
float: left;  
width: 100%; 
border: 0px solid #FF0000; 
}

a.reflink:link, a.reflink:visited{
width: 150px; 
height: 250px; 
border: 0px solid #FF0000; 
float: left; 
color: #000000; 
font-size: 0.8em; 
text-align: center; 
margin: 0px; 
padding: 0px; 
 }
a.reflink img{
display: inline; 
border: 1px solid #000000; 
margin: 0px; 
padding: 0px; 
  }

a.linkthumb{
width: 200px; 
height: 200px; 
padding: 0px; 
margin: 1px; 
overflow: hidden; 
float: left; 
} 
img.thumb{
min-width: 200px; 
height: auto; 
width: 200px; 
}


@media screen and (min-width: 998px) and (max-width: 1068px){
#linkeseite{width: 30%; }
#rechteseite{width: 70%; left: 30%; }
#topnav{width: 70%;margin: 0px 0px 0px 30%;}
h2{width: 50% !important; left: 6% !important; border: 0px solid #FF0000; padding-right: 10%  !important;
padding-left: 10% !important;}
#footerzentrieren{width: 100%; }
#topnav ul.menu li img{width: 30px; height: auto; }
} 

@media screen and (min-width: 800px) and (max-width: 997px){
#linkeseite{width: 35%; }
#rechteseite{width: 65%; left: 35%; }
#topnav{width: 65%;margin: 0px 0px 0px 35%;}
h2{width: 55% !important; left: 11% !important}
#topnav ul.menu li a:link, #topnav ul.menu li a:visited{padding: 0px 5px 0px 5px;}
#topnav ul.menu li img{width: 30px; height: auto; padding: 0px 5px 0px 5px;}
#logo {min-width: 180px;}
#footerzentrieren{width: 100%; font-size: 0.8em;}
} 


@media screen and (min-width: 300px) and (max-width: 799px){
#linkeseite, #rechteseite, #topnav, #page{width:100%;position: relative; float: left; padding: 0px; margin: 0px; left: 0px; border:0px solid #FF0000;}
h2, h2.startseite{position: relative !important;
width: 100% !important; display: block !important; clear: both !important; margin: 30px 0px 30px 0px !important; padding: 0px !important; top: 0px !important; left:0px !important; text-align:center; height: auto !important;} 
div.spacebetween, #leseweiter{display: none; }
#logo{background: none; width: 100%; border: 0px solid #FF0000; margin: 0px !important; }
#logo img#signet{margin: 0px 0px 30px 0px; width: 80% !important;  padding: 0px 0px 0px 10%;border:0px solid #FF0000 !important;}
#logo img#meister{width: 30% !important;border:0px solid #FF0000 !important;margin: 0px 0px 30px 0px; padding: 0px 35% 0px 35%; background-color: #000000;}
#navigation{ height: auto; min-height: 20px; padding: 0px 0px 30px 0px;  }
#navigation ul.nav li{border-bottom: 1px solid #999999;} 
#navigation ul.nav li ul li{border: 0px solid #999999;} 
#navigation ul.nav ul{padding: 0px 0px 0px 0px; margin: 0px 0px 10px 0px;  }
#footerzentrieren{display: none; !important;}
#biber{padding: 0px; margin: 20px; width: 100px; display: block; position: relative;top: 0px; right: 0px; border:0px solid #FF0000 !important; z-index: 2000; }
#biber img{width: 100px; height: 100px; }
#topnav{position: relative; height: 60px; margin: 30px 0px 30px 0px; border:0px solid #FF0000 !important;}
#topnav ul.menu{position: relative; margin: 0px; height: 60px; border:0px solid #FF0000 !important; }
#topnav ul.menu li{padding: 0px 1% 0px 1%; width: 14% !important; border: 0px solid #FF0000; text-align: center;}
#topnav ul.menu li img{width: 30px; height: auto; padding: 0px 5px 0px 5px; position:relative; margin: 0px auto;}
#topnav img:hover, #topnav img:focus{opacity: 0.8; }
a.backbutton{position: fixed; right: 10px; bottom: 10px; }
a#onlineplaner, a#budgetplaner, a#hzplaner, a#virtuell{ position: static; border: 0px solid #FF0000; float: right; margin: 50px 0px 0px 0px;  }
a#virtuell{margin: 50px 12% 0px 0px; border-radius:0px 20px 20px 0px; }
a#budgetplaner, a#hzplaner{border-radius:0px 0px 0px 0px; }
a#onlineplaner{border-radius:20px 0px 0px 20px; }
}
@media screen and (min-width:300px) and (max-width:570px){
a#onlineplaner, a#budgetplaner, a#hzplaner, a#virtuell{ position: static; border: 0px solid #FF0000; float: right; margin: 5px 23% 0px 0px;  width: 49%; }
a#virtuell{border-radius: 20px; }
a#budgetplaner, a#hzplaner{border-radius: 20px; }
a#onlineplaner{border-radius: 20px; }


}

@media screen and (min-height:300px) and (max-height:800px){ 
#topnav ul.menu{margin: 0px 0px 0px 0px; 
#topnav{ right: 0px !important; margin: 0px !important; width: 100% !important; } 
h2, h2.startseite{ position: relative !important; top: 0px !important; left: 0px !important; width: 99% !important; line-height: 80px; margin: 0px 0px 30px 0px !important; padding: 0px 1% 0px 0px !important; font-size: 1.0em !important; color: #FFFFFF; display: block; clear: both;  }

}
@media screen and (min-width:300px) and (max-width:480px){
#topnav{top: 0px; margin: 30px 0px 0px 0px; }
#topnav ul.menu{margin: 0px 0px 60px 0px;}
#page_1{display: none !important;}
#page{display: block; border: 0px solid #FF0000; float: left; margin: 0px 0px 0px 0px; position: relative; top: 0px;}
#linkeseite, #topnav, #onlineplaner{position:relative !important; z-index: 2000;}
#biber{position: relative !important; margin: 0px 0px 50px 0px; border: 0px solid #FF0000 !important; width: 99%; padding: 0px; }
#biber img.biber{margin: 0px; position: relative !important; left: calc(50% - 50px); top: 0px; }
#logo{margin: 100px 0px 0px 0px; }
#onlineplaner{display: none;}
}

@media screen and (min-height: 500px) and (max-height: 700px){
#linkeseite{position: static !important; }
}
