body{
font-size: 1.6em; 
font-weight: 300; 
}

h2{
font-size: 1.2em; 
font-weight: 300; 
line-height: 1.2em;  
border: 0px solid #FF0000; 
}
h6{
font-size: 1.2em; 
font-weight: 300; 
}
.social.instagram, .social.fbook{
top: 340px; 
filter: invert(1);
}
#logobox{
width: 30%; 
max-height: 420px; 
margin: 50px 5% 0px 60%; 
}
img.rightimg{
max-width: 50%; 
}
table.grafiken td{
width: 100%; 
float: left; 
border-bottom: 1px solid #999999; 
}

ul.nav, ul.infos{
display: none; 
}

ul.responsive{
font-size: 1.1em; 
list-style-type: none; 
display: block; 
border: 0px solid #FF0000; 
width: 90%; 
position: relative; 
left: 0px; 
padding-top:50px; 
padding-right: 5%; 
padding-left: 5%; 
margin: 0px 0px 50px 0px; 
float: left; 
background-color: #3f6eba;
overflow: hidden; 
background-image: url(images/nav_resp.png);
background-repeat: no-repeat; 
background-position: right 0px; 
}
ul.responsive{
height: 0px; 
padding-bottom: 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; 
list-style-type: none; 
}
ul.responsive ul{
font-size: 0.9em; 
padding: 0px; 
margin: 0px; 
}

.mobil ul.infos{
display: block; 
list-style-type: none; 
}
.mobil ul#subnav_pro{
list-style-type: none; 
}
ul.responsive li, ul.responsive li ul li{
line-height: 40px; 
padding: 0px; 
margin: 0px; 
display: block; 
float: left; 
width: 90%; 
}
ul.responsive li{
border-top: 1px dotted #FFFFFF; 
}
ul.responsive li ul li{
border-top: 0px dotted #FFFFFF; 
}
ul.responsive li.first{
border-top: 0px dotted #FFFFFF; 
}
ul.responsive li.close{
border-top: 0px dotted #FFFFFF; 
}
ul.responsive .prodlast{
width: 100%; 
padding-bottom:50px; 
}
#close{
position: absolute; 
right: 64px; 
top: 60px; 
}
#closer{
position: absolute; 
top: 5px; 
right: 9%; 
opacity: 0.0; 
z-index: 1000; 
border: 0px dotted #FF0000; 
}

ul.responsive li ul li{
padding-left: 15px; 
}
ul.responsive li a:link, ul.responsive li a:visited{
color: #FFFFFF; 
display: block; 
text-decoration: none; 
-webkit-transition: 0.2s ease-in-out;
-moz-transition: 0.2s ease-in-out;
-o-transition: 0.2s ease-in-out;
-ms-transition: 0.2s ease-in-out;
transition: 0.2s ease-in-out; 

}
ul.responsive li a:hover, ul.responsive li a:focus{
color:#000000; 
}



ul.infos{
font-size: 0.8em; 
margin-top: 0px; 
margin-left: 0px; 
margin-right: 0px; 
margin-bottom: 50px; 
padding: 0px; 
list-style-type: none; 
position: relative; 
top: 0px; 
left: 10%;
z-index: 2000; 
border-bottom: 1px solid #999999; 
float: left; 
width: 80%; 
background-image: url(images/sys/weiss_90.png);
background-repeat: repeat; 
}
ul.infos li{
margin-bottom: 5px;
margin-top: 0px;
margin-right: 2%; 
padding-left: 2%; 
padding-right: 0%; 
padding-top: 0px; 
padding-bottom: 0px; 
list-style-type: none; 
float: left; 
border: 0px solid #FF0000; 
display: block; 
width: auto; 
height: 40px; 
}
ul.infos li a:link, ul.infos li a:visited{
margin: 0px; 
padding-left: 15px; 
padding-right: 15px; 
padding-top: 5px; 
padding-bottom: 5px; 
color: #3f6eba;
-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;
border: 0px solid #FF0000; 
display: block; 
border-radius: 20px; 
font-weight: 300; 
text-align: center; 
}
ul.infos li a:hover{
color: #000000; 
background-color: #DFDFDF; 
}


#bild_box{
position: relative; 
width: 100%; 
margin: 0px; 
height: 250px; 
border: 0px solid #7FB734; 
border-radius: 0px 0px 0px 0px; 
overflow: hidden; 
background-image: url(images/sys/weiss_90.png);
background-repeat: repeat; 
z-index: 5; 
float: left; 
}
#headertext{
margin-left: 10%; 
}



#footer{
padding: 30px 0px 0px 0px; 
margin: 0px; 
font-size: 0.5em; 
z-index: 2000; 
color: #FFFFFF; 
text-align: center; 
height: 100px; 
max-width: 100%; 
width: 100%; 
line-height: 1.2em; 
position: fixed; 
bottom: -100px; 
background-repeat: repeat; 
background-color: #3f6eba;
-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;
background-image: url(images/sys/arrow_1c.png);
background-repeat: no-repeat; 
background-position: 10% 0px; 
}

#footer:hover, #footer:focus{

}

#footer strong{
display: block; 
}

#footer a:link, #footer a:visited{
-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;
color: #FFFFFF; 
display: block;
}
#footer a:hover{
color: #000000; 
}
.foto{
width: 100%; 
height: auto; 
border: 0px solid #FFFFFF; 
position: relative; 
left: 0px; 
border-radius: 15px; 
}
.anfahrt iframe{
width: 100%; 
height: 300px; 
border: 0px solid #FFFFFF; 
}

.download #texte img{
width: 100%; 
height: auto; 
}
span.dot{
display: none; 
}


#logotext{ 
margin: 0px; 
padding: 0px; 
border: 0px solid #0000FF;  
position: absolute; 
top: 0px; 
left: 25%; 
width: 50%; 
font-size: 0.8em; 
}
#logotext img{ 
width: 100%; 
}

#texte, .anfahrtskarte{
font-size: 0.8em; 
width: 80%; 
border: 0px solid #FF0000; 

}

@media screen and (max-width: 1024px) {
img.ic_grafik.eins{width: 80%; position: relative; left: 10%; }
img.ic_grafik.zwei{width: 80%; position: relative; left: 10%; }
img.ic_grafik.drei{width: 80%; position: relative; left: 10%; }
table.grafiken{width: 80%; }
.rightimg.hund{
position: relative; 
right: 0px; 
float: left; 
width: 60%; 
min-width: 60%; 
display: block; 
transform: rotate(-1deg);
margin-bottom: 30px; 
margin-left: 20%;
margin-right: 20%; 
}
}

@media screen and (max-width: 768px) {
#texte, .anfahrtskarte{margin-left: 5%; }
#bild_box{
height: 230px; 
}
#logotext{
width: 70%; 
left: 15%; 
max-width: 400px; 
}
ul.infos li{
width: 45%; 
}
ul.liste, ul.liste_s{width:100% !important; max-width:100% !important; margin:0%;}

}
@media screen and (max-width: 600px) {
#bild_box{
height: 200px; 
}
ul.liste, ul.liste_s{width:100% !important; max-width:100% !important; margin:0%;}
}

@media screen and (max-width: 480px) {

.rightimg.hund{
position: relative; 
right: 0px; 
float: left; 
width: 100%; 
min-width: 100%; 
display: block; 
transform: rotate(-1deg);
margin-bottom: 30px; 
margin-left: 0%;
margin-right: 0%; 
}

.social.instagram, .social.fbook{
top: 340px; 
}
#logobox{
width: 20%; 
max-height: 420px; 
margin: 50px 5% 0px 50%; 
}
#logoic{
width: 100%; 
min-width: 180px; 
}
ul.responsive{font-size: 0.8em; }
#bild_oben{ overflow: hidden;}
#bild_oben #logo{height: 130px; width: auto; padding: 0px; margin: 0px; }
#texte, .anfahrtskarte{margin-left: 0%; margin-right: 0%; width: 81%; font-size: 0.7em; }
.textimg{width: 100%; } 
.img_box{width: 100%; } 
ul.infos{margin-top: 20px; padding-bottom: 20px;}
ul.infos li{width: 100%; font-size: 0.8em; line-height: 0.8em; padding: 0px; margin: 0px; height: auto; border: 0px solid #ff0000;}
ul.infos li a:link, ul.infos li a:visited{padding: 5px; margin:0px; line-height: 0.8em; }
#logotext{width: 80%; left: 10%; }
#bild_box{height: 180px; }
hr{padding:0px;margin:0px; }
a.rightimg, a.leftimg, img.rightimg.ganzebreite{min-width: 100% !important; border:0px solid #FF0000; display: inline-block; margin: 0px 0px 20px 0px; }
a.rightimg img, a.leftimg img{width: 80%; margin-left:5%; } 
ul.liste{width: 100%; max-width: 100%; margin:0%;}
}