* { margin: 0; padding: 0; list-style: none; }
a img { text-decoration: none; border-style: none; }
body { margin: 10px auto auto; color: #DFA678; text-align: justify; font: 12px/20px Georgia, "Times New Roman", Times, serif; background: #000000; background: -moz-linear-gradient(left, #532100 0%, #000000 10%, #000000 90%, #532100 100%); background: -webkit-linear-gradient(left, #532100 0%,#000000 10%,#000000 90%,#532100 100%); background: linear-gradient(to right, #532100 0%,#000000 10%,#000000 90%,#532100 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#532100', endColorstr='#532100',GradientType=1 ); }
a, a:visited { color: #DFA678; }
a:hover, a:visited:hover { color: #EF6100; text-decoration: none; }
#alles { max-width: 1300px; width: 98%; margin: auto; height: auto !important; overflow: hidden !important; border: 2px solid #8C3800; padding: 3px; border-radius: 5px; background: #000000; }
#mother { width: 100%; text-align: center; margin: auto; height: auto; }
h1, h2, h3 { width: 75%; margin: auto auto 5px; text-align: center; padding-bottom: 2px; height: auto; font-size: 25px; line-height: 35px; font-weight: bold; text-shadow: 1px 1px #990000; /* border: 1px solid #953400; background: #ba4100; background: -moz-linear-gradient(top, #ba4100 0%, #000000 25%, #000000 75%, #ba4100 100%); background: -webkit-linear-gradient(top, #ba4100 0%,#000000 25%,#000000 75%,#ba4100 100%); background: linear-gradient(to bottom, #ba4100 0%,#000000 25%,#000000 75%,#ba4100 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ba4100', endColorstr='#ba4100',GradientType=0 );*/ color: #DFA678; }
h2, h3 {font-size: 22px; line-height: 28px; width:90%;}
#head { max-width: 1295px; height: 128px; margin: auto; width: 100%; border-radius: 8px; text-align: center; background: url(../img/header.jpg) no-repeat; background-size: 100% auto; }
#flexbox {display: flex; max-width: 1200px; width:100%; text-align:center; height:128px; align-items: center; margin:auto;}
#head .flex1 { padding-right: 10px; padding-top: 10px; }
#head .flex2 {text-algin: center; max-width:1200px; width:100%; margin:auto; }
#head .flex2 h1 { text-align: center;}
#head .flex2 img {max-width: 800px; width:100%;}
#head .flex3 {}
#navline { display: none; }
#sidebar { display: block; width: 98%; margin: 5px auto auto; height: auto; }
#sidebar .menu { display: inline-block; width: 97%; overflow: visible; height: auto; margin-bottom: 10px; text-align: center; margin-right: auto; margin-left: auto; }
#sidebar .menu li{ display: inline-block; max-width: 148px; width: 100%; border: 1px solid #953400; list-style-type: none; color: #532100; margin: auto; text-decoration: none; height: auto; text-align: center; font-weight: bold; line-height: 35px; font-size: 12px; border-radius: 8px; background: #515151; }
#sidebar .menu li a { display: inline-block; width: 100%; height: auto; border-radius: 8px; color: #DFA678; text-decoration: none; margin: 0px; background: #000000; background: -moz-linear-gradient(top, #ba4100 0%, #000000 30%, #000000 70%, #ba4100 100%); background: -webkit-linear-gradient(top, #ba4100 0%,#000000 30%,#000000 70%,#ba4100 100%); background: linear-gradient(to bottom, #ba4100 0%,#000000 30%,#000000 70%,#ba4100 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ba4100', endColorstr='#ba4100',GradientType=0 ); }
#sidebar .menu li a:hover{ background: #DFA678; -webkit-transition: all 400ms ease-in; -moz-transition: all 400ms ease-in; -ms-transition: all 400ms ease-in; -o-transition: all 400ms ease-in; transition: all 400ms ease-in; color: #532100; border-radius: 8px; }
#sidebar .menu li a.active { background: #DFA678; -webkit-transition: all 400ms ease-in; -moz-transition: all 400ms ease-in; -ms-transition: all 400ms ease-in; -o-transition: all 400ms ease-in; transition: all 400ms ease-in; color: #532100; border-radius: 8px; }
#content { width: 99%; padding: 5px 0px; margin: auto; height: auto; text-align: center; }
article { width: 100%; text-align: center; margin: auto; }
.textbox { margin: 5px; text-align: justify; color: #; padding-right: 5px; padding-left: 5px; }
.textbox a, a:visited { color: #DFA678; text-decoration: underline; }
.textbox a:hover, a:visited:hover { text-decoration: none; color: #C55000; }
.textbox img { margin: auto; padding: 5px; float: left; }
.textbox .bild { margin: auto; padding: 5px; float: right; }
.linkbox { margin: 5px; border-radius: 0px 0px 8px 8px; text-align: center; color: #DFA678; padding-right: 5px; padding-left: 5px; }
.linkbox a { font-weight: bold; color: #EF6100; padding: 10px; }
.linkbox a:hover { font-weight: bold; color: #999999; padding: 10px; }
.box { text-align: center; width:98%;}
.bildbox { margin: auto; padding: 5px; height: auto; max-width: 500px; width: 100%; vertical-align: top; text-align: center; display: inline-block; }
.bildbox .titel { color: #DFA678; margin: auto; text-align: left; padding-bottom: 2px; height: auto; font-size: 14px; line-height: 35px; font-weight: bold; border-radius: 10px; text-shadow: 1px 1px #990000; }
.bildbox img { margin: auto; height: auto; max-width: 100px; width: 100%; float: left; }
.bildbox .text { text-align: justify; padding: 5px; }
.banner {max-width: 1000px; width: 100%; margin:auto;}
.banner img { width: 100%; height: auto; margin: auto; border-radius: 20px; }
.proftextbox { margin: auto; border-radius: 0px 0px 8px 8px; text-align: justify; color: #DFA678; padding-right: 5px; padding-left: 5px; height: auto; width: 90%; }
.proftextbox img{ margin: auto; padding: 5px; float: left; max-width: 200px; width: 100%; height: auto; }
footer { width: 100%; height: auto; background: #000000; border-top: 1px solid #CDCDCD; text-align: center; }
footer a { margin-right: 20px; }
.center { text-align: center; }
.clear { clear: both; }
.vx-frame { height: 1950px; width: 100%; border-style: none; overflow: auto; text-align: center; margin: auto; }
.bas-frame { height: 2900px; width: 100%; border-style: none; margin: auto; overflow: auto; }
.ruf-frame { height: 2100px; width: 98%; border-style: none; margin:auto;overflow:auto; }
.cwframe { display: block; height: 2550px; width: 99%; border-style: none; text-align: center; margin: auto; }
.cwframe-mobi { display: none; }
.px-frame { height: 1600px; width: 90%; border-style: none; overflow: auto; text-align: center; margin: auto; }
.datum { text-align: center; padding: 5px; }
.zurueck { width: 98%; height: auto; text-align: right; font-size: 18px; line-height: 25px;}
.zurueck a{ color: #F2ED85; text-decoration: none; margin: 0px; height: auto; border-radius: 8px; border: 1px solid #887844;  padding-right: 5px; padding-left: 5px; margin-right: 10px;
background: #000000; background: -moz-linear-gradient(top, #ba4100 0%, #000000 30%, #000000 70%, #ba4100 100%); background: -webkit-linear-gradient(top, #ba4100 0%,#000000 30%,#000000 70%,#ba4100 100%); background: linear-gradient(to bottom, #ba4100 0%,#000000 30%,#000000 70%,#ba4100 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ba4100', endColorstr='#ba4100',GradientType=0 );
 }
.zurueck a:hover { background: #999999; -webkit-transition: all 400ms ease-in; -moz-transition: all 400ms ease-in; -ms-transition: all 400ms ease-in; -o-transition: all 400ms ease-in; transition: all 400ms ease-in; color: #000000; border-radius: 8px; }
  #cookieNotice              { position: fixed; border-bottom: solid 1px #a0a0a0; padding: 10px; text-align: center; color: #FF3; width: 100%; margin: auto; cursor: pointer; top: 0px;
background: #000000; background: -moz-linear-gradient(top, #ba4100 0%, #000000 30%, #000000 70%, #ba4100 100%); background: -webkit-linear-gradient(top, #ba4100 0%,#000000 30%,#000000 70%,#ba4100 100%); background: linear-gradient(to bottom, #ba4100 0%,#000000 30%,#000000 70%,#ba4100 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ba4100', endColorstr='#ba4100',GradientType=0 );}
  #cookieNoticeCloser        { color: #FF3; font-weight: bold; float: right; margin-right: 50px; }
  #cookieNoticeCloser:before {content:'';position:absolute;width:1px;height:9px;background-color:#000000;left:7px;top:3px;transform:rotate(-45deg);-webkit-transform:rotate(-45deg);}
  #cookieNoticeCloser:after  {content:'';position:absolute;width:1px;height:9px;background-color:#000000;left:7px;top:3px;transform:rotate(45deg);-webkit-transform:rotate(45deg);}

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

.cwframe { height: 2350px; }
.bas-frame {height: 4000px;}

}
@media only screen and (max-width: 1200px) {
#sidebar { }
.ruf-frame { height: 1550px; width:90%;}
}

@media only screen and (max-width: 1100px) {
.ruf-frame { height: 1850px;}
.vx-frame { height:2000px}
}
@media only screen and (max-width: 1050px) {
.bas-frame {height: 6000px;}
}
@media only screen and (max-width: 950px) {
.cwframe { height: 3150px;}
.ruf-frame { height: 1550px;}
}
@media only screen and (max-width: 750px) {
#alles { width: 98%; }
h1,h2,h3 { font-size: 14px; line-height: 22px; }
#navline { text-align: center; display: block; height: auto; position: fixed; visibility: visible; text-decoration: none; width: 70px; line-height: 35px; margin: auto; }
#navline li a { width: 98%; height: auto; display: block; color: #EF6100; text-decoration: none; webkit-transition: all 200ms ease-in; -moz-transition: all 200ms ease-in; -ms-transition: all 200ms ease-in; -o-transition: all 200ms ease-in; transition: all 200ms ease-in; background: #532100; border-top: 2px solid #000; border-bottom: 2px solid #000; font-size: 16px; font-weight: bold; border-radius: 8px; margin: auto; }
#navline li a:hover { background: #131313; -webkit-transition: all 400ms ease-in; -moz-transition: all 400ms ease-in; -ms-transition: all 400ms ease-in; -o-transition: all 400ms ease-in; transition: all 400ms ease-in; border: thin solid #635832; color: #DFA678; }
#sidebar { display: none; position: fixed; visibility: visible; top: 110px; } 
.box1 { width: 99%; float: none; }
.box2 { width: 99%; float: none; }

.vx { float: none; height: auto; width: 100%; max-width: 468px; text-align: center; margin: 0px; }
.px { float: none; height: auto; width: 100%; max-width: 468px; text-align: center; margin: 0px; }
}
@media only screen and (max-width: 530px) {
#head { height: 220px; background: url(../img/head-mobil.jpg) no-repeat center; background-size: 90% auto; }
#head .flex2 h1 { margin-top: 300px; }
#flexbox { margin-right: auto; background: top; }
.banner {display: none;}
.cwframe { display: none; }
.cwframe-mobi { display: block; height: 3900px; width: 99%; border-style: none;}
.proftextbox img  {float: none;}
.bildbox {display:block; margin:auto;}
.bildbox img {display:block;}
}