html, body {
margin: 0 0 0 0;
padding: 0;
text-align: center;
background: #fff;
width: 100%; float: left;
height: 100%;
}

#wrap {float: left; width: 100%; margin: 0; padding: 0; position: relative; min-height: 100%; min-width: 960px; overflow: hidden; }
#wrap2 {float: left; width: 100%; margin: 0; padding:0; background: #fff; min-width: 960px; position: fixed; top: 0; left; 0; z-index: 110;}

@font-face {
      font-family: 'fontello';
      src: url('./font/fontello.eot?50837079');
      src: url('./font/fontello.eot?50837079#iefix') format('embedded-opentype'),
           url('./font/fontello.woff?50837079') format('woff'),
           url('./font/fontello.ttf?50837079') format('truetype'),
           url('./font/fontello.svg?50837079#fontello') format('svg');
      font-weight: normal;
      font-style: normal;
    }

header {
max-width: 1160px; width: 100%;
margin: 0 auto;  padding: 0;
position: relative;
text-align: left;
z-index: 8;
}


.zc {
    width: 100%; margin: 0 auto; max-width: 1160px; text-align: left;
}

#logocontainer {
float: left;
width: 18%;
margin: 20px 2% 10px;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
#logocontainer img {
    float: left; width: 100%;
}

#navcontainer {
float: right;
margin:80px 0 0;
padding: 0;
width: 70%;  position: relative;
-webkit-transition: margin 0.3s;
-moz-transition: margin 0.3s;
transition: margin 0.3s;
}

#bilder {float: left; width: 100%; position: relative; margin:0;
background-color: #d5c7a1; background-position: center center;
text-align: left;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover; text-align: center;
min-height: 450px;
background-image:url('images/bild1.jpg');
}

#footbild {float: left; width: 100%; position: relative; margin:0;
background-color: #d5c7a1; background-position: center center;
text-align: left;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover; text-align: center;
background-image:url('images/bild1.jpg');
}

.filter {
    float: left; width: 100%; background: rgba(213,199,161,0.6); margin: 0; padding: 0;color: #fff;
}

#bilder .filter {position: absolute; top: 0; left: 0; height: 100%; z-index: 1;}
.bcontent  {
    position: relative; z-index: 2; margin: 100px 0; color: #fff;
}
.bcontent img { max-width: 15%; margin: 30px 0; }
.bcontent > div { display: inline-block; max-width: 450px; width: 95%; text-align: left; }
.bcontent a { color: #fff; text-decoration: underline;}

.filter.f1 {background-image:url('images/filter.png'); background-repeat: no-repeat; background-position: left bottom; background-size: 600px auto; }
.filter.f2 {background-image:url('images/filter2.png'); background-repeat: no-repeat; background-position: right bottom; background-size: 600px auto;}



@media only screen and (min-width: 960px)
{
#wrap2.fixiert { box-shadow: 0px 0px 5px 0px #666; -moz-box-shadow: 0px 0px 5px 0px #666; -webkit-box-shadow: 0px 0px 5px 0px #666; height: auto;}
.fixiert #navcontainer {margin: 15px 0 10px;}
.fixiert #logocontainer {width:9%; margin: 10px 2%;   }
#bilder {margin: 155px 0 0;  }
.fixiert #headtel {  display: none;}
#footbild {  background-attachment: fixed;}

}



#content {
width: 100%;
text-align: left;
padding: 0;
float: left;
}
.contentelement {float: left; width: 100%; padding: 0; margin: 0;}

#content_2 { float: left; width:100%; padding:0; background: #fff; }
#content_2 .contentelement {
padding: 0 5%;
margin: 30px 0;
width: 90%;
}


#inhalt {
margin: 0 auto;
width: 1160px;
padding: 40px 0;
min-height:300px;
position: relative;
}

#textfeld {
float: right;
padding: 0 5%;
margin: 0 0 20px 0;
width: 90%;
}


#footinhalt {float: left; width: 100%; margin: 0; padding: 0; background: #E6E7E8; }
#aktheadline {background: #fff; padding: 10px 0; margin: 0; float: left; width: 100%;}
#footinhalt h1 { margin: 0 auto; width: 1100px; }
#footinhalt div#aktuelles {margin: 0 auto; width: 1160px; padding: 20px 0; }
#aktcontainer {float: left; width: 100%;}

footer {
float: left;
width: 100%;
padding: 0;
min-width: 960px;
background: #d5c7a1; background: rgba(213,199,161,0.8);
font-size:1.0em;
padding: 0 0 20px;
color: #fff;
border-top: 20px solid #fff;
}
#footcontent {width: 1060px; margin: 0 auto; }

address {float: left; width: 100%; margin: 0; padding: 20px 0 0; font-style: normal; text-align: center;}
address p.firma {
    font-size: 1.2em; font-weight: 700; text-transform: uppercase;
}
address p.firma img {
    max-width: 200px; display: inline-block; margin: 10px;
}

#social {font-family: fontello; font-size: 2.0em; float: left; margin: 0; width: 100%; text-align: center; }
#footcontent #social a {
    display: inline-block; margin: 5px 2px; padding:0; text-decoration: none; color:#878786; padding: 5px; border: 2px solid #878786; width: 40px;
}
footer #footcontent #social a:hover { color: #fff; background: #e30f18; }


#suche {
    position: absolute; bottom: -80px; left: 50%; width: 500px; margin: 0 0 0 -260px; background: #fff; padding: 10px;
    box-shadow: 0px 0px 3px 0px #666; -moz-box-shadow: 0px 0px 3px 0px #666; -webkit-box-shadow: 0px 0px 3px 0px #666;
}
input#suchstr {
    box-sizing: border-box; width: 60%;
}
#suche input.button {
    padding: 6px 10px; width: 30%; box-sizing: border-box;
}


.teaserbox_r p {margin: 5px 0; color: #fff; font-size: 100%;}

ul.sitemap {
    float: left;
}

ul.sitemap li {
margin: 5px 0 10px;
font-weight: normal;
font-size: 1.3em;
}


ul.sitemap_unterpunkt {
list-style-type: square;
}

ul.sitemap_unterpunkt li {
margin: 5px 0;
list-style-image: none;
font-weight: 300;
font-size: 0.8em;
}

.bildrahmen {
padding: 5px 5px 4px 5px;
text-align: center;
font-size: 0.9em;
color: #000;
position: relative; max-width: 45%;
}

.bildrahmen img { width: 100%; box-sizing: border-box; }


.balken {background: #f6f6f6; margin: 50px 0; padding: 0; position: relative;}
.balken::after {
    background: #f6f6f6;
    content: "";
    display: block;
    height: 100%;
    position: absolute;
    right: -100%;
    top: 0;
    width: 100%;
    z-index: 1;
}

.balken::before {
    background: #f6f6f6;
    content: "";
    display: block;
    height: 100%;
    left: -100%;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
}

.floatrechts {
margin: 0 0 10px 4%;
float: right;
}

.floatlinks {
margin: 0 4% 10px 0;
float: left;
}

.galerie {
float: left;
margin: 10px 0 10px -1%;
width: 102%;
}

.galerie dl {
float: left;
height: 230px;
margin: 2px 1% 2px;
text-align: left;
background: #fff;
width: 23%;
}

.galerie dd {
margin: 0; 
padding: 0;
}

img.gal {
padding: 0;
}


.kontaktformular {
width: 100%; padding:0; max-width: 500px;
}
.formfeld {
    float: left; width: 100%; margin: 1px 0;
}

.kontaktformular p {
width: 100%;
float: left;
}

legend {
display: none;
}
fieldset {border: none; margin: 0; padding: 0;}

.kontaktformular label {
float: left;
width: 30%;
margin: 3px 0;
font-size: 100%;
}

.kontaktformular input {
float: left;
width: 70%;
box-sizing: border-box;
padding: 5px;
}

.kontaktformular select {
float: left;
width: 70%;
margin: 1px 0;
font-weight: bold;
padding: 4px;
}

div.formclear {
float: left;
width: 100%;
}

input#Ort, input#re_ort, input#rb_ort {
width: 49%;
margin-left:1%;
}
input#PLZ, input#re_plz, input#rb_plz {
width: 20%;
}
input#captcha {
width: 130px;
}

.kontaktformular textarea {
width: 100%;
max-width: 500px;
height: 90px;
margin-bottom: 10px;
box-sizing: border-box;
padding: 5px;
}


div.formfehler {
width: 70%;
float: right;
color: #f00;
text-align: center;
font-size: 0.9em;
}

input.fehlerfeld {
background: #fcc;
border: 1px solid #f00;
}

form {
margin: 0;
}

input, textarea {
color: #000;
padding: 5px;
}

input.button {
background: #e30f18;
color: #fff;
font-weight: bold;
width: 150px;
padding: 7px 10px;
cursor: pointer;
-webkit-appearance: none;
-moz-appearance:none;
appearance:none;
border: 0;
}



a.backlink {
display: inline-block;
text-decoration: none;
color: #e30f18; background: #fff; padding: 5px 20px 5px 45px;
border: 1px solid #e30f18; text-transform: uppercase;
margin: 10px 0; position: relative;
}



a.weiterlink  {
display: inline-block;
text-decoration: none;
color: #fff; background: transparent; padding: 8px 25px;
margin: 10px 10px 10px 0;
font-weight: 700;
font-size: 1.0em;
background: #e30f18;
border: 2px solid #e30f18;
}
a.weiterlink.button1 {
background: transparent;
border: 2px solid #fff; margin-right: 20px;
}

a.backlink:hover, a.pfeillink:hover {
text-decoration: none;
color: #fff; background: #575656;
}

a.weiterlink:hover {
color: #fff;
text-decoration: none; background: #575656;
}


p.captchafehler {
border: 1px solid #c00;
color: #f00;
margin: 10px 0;
padding: 10px;
background: #ffc;
}

.meldung { color: red }

#werbeportal {float: left; margin: 10px 0; width: 100%; text-align: center; font-size: 0.9em; }

img { max-width: 100%; height: auto;}
iframe { max-width: 100%; }


#cookie-bar {background:#575756; height:auto; color:#fff; text-align:center; padding:10px 0; z-index: 200; position: relative;
box-shadow: 0px 0px 5px 0px #000000; -moz-box-shadow: 0px 0px 5px 0px #000000; -webkit-box-shadow: 0px 0px 5px 0px #000000; font-size: 0.9em; }
#cookie-bar.fixed {position:fixed; top:0; left:0; width:100%;}
#cookie-bar.fixed.bottom {bottom:0; top:auto;}
#cookie-bar p {margin:0; padding:0;}
#cookie-bar a {color:#ffffff; display:inline-block; text-decoration:none; padding:0 6px; margin-left:8px;}
#cookie-bar .cb-enable {background:#8D8F8F;}
#cookie-bar .cb-enable:hover {background:#fff;  color: #e30f18;}
#cookie-bar .cb-disable {background:#8D8F8F; color: #fff;}
#cookie-bar .cb-disable:hover {background:#fff; color: #e30f18;}
#cookie-bar .cb-policy {background:#fff;  color: #e30f18;}
#cookie-bar .cb-policy:hover {background:#8D8F8F; color: #fff;}


@media only screen and (min-height: 900px)
{
.bcontent  {
    margin: 250px 0 100px;
}

}

@media only screen and (max-width: 1160px)
{
 header {width: 100%;}
 #inhalt {width: 100%;}
 #footcontent {width: 100%;}

#footinhalt h1 { margin: 0 auto; width: 95%; }
#textfeld img {max-width: 100%;}

.filter.f1 { background-size: 450px auto; }
.filter.f2 { background-size: 450px auto;}
}

@media only screen and (max-width: 960px)
{
#wrap {min-width: 680px;}
#navcontainer {margin: 0; width: 100%;}
#wrap2 {min-width: 680px; position: relative;}

#inhalt {min-height: 300px;}
#logocontainer { width: 22%; }
footer {min-width: 680px;}
.galerie dl {height: 170px;}

ul.liste2 li {width: 100%; }

#suche { bottom: -60px; left: 50%; width: 300px; margin: 0 0 0 -155px; background: #fff; padding: 5px;}
}

@media only screen and (max-width: 680px)
{
#wrap {min-width: 320px;}
#logocontainer { width: 30%; }
header {width: 100%; min-width: 320px;}
header h1 {float: left; width: 95%; margin: 10px 0 10px 5px;}
#wrap2 {min-width: 320px; width: 100%; }

#content {min-width: 320px; width: 100%; min-height: 350px;}
#inhalt {min-width: 315px; width: 100%;}
#navcontainer {width: 100%;  }
.suchteaserbox {width: 100%;}
footer {min-width: 300px;}

ul.unavseite_menue2 li {width: 100%; }
#social a.tellink {  right: 60px; font-size: 20px; padding: 8px 13px; }
#social a.cryptmail3 { right: 10px; font-size: 20px; padding:8px 13px; }

.filter.f1 { background-size: 300px auto; }
.filter.f2 { background-size: 300px auto;}

}

 @media only screen and (max-width: 460px)
{
#logocontainer { width: 40%;}
.kontaktformular label {width: 100%;}
div.formfehler {width: 100%;}
.kontaktformular input , .kontaktformular select {width: 100%;}
input#Ort, input#re_ort, input#rb_ort {width: 69%;}
input#PLZ, input#re_plz, input#rb_plz {width: 30%;}

.galerie dl {
margin: 2px 2% 2px;
width: 46%;
}
#suche { bottom: -60px; left: 50%; width: 250px; margin: 0 0 0 -130px; background: #fff; padding: 5px;}
 .filter.f1 { background-size: 150px auto; }
.filter.f2 { background-size: 150px auto;}
  }