* { margin: 0; padding: 0; list-style:none; }
a img { text-decoration: none; border-style: none;}
img {border-radius: 8px;}
body {margin: 10px auto auto; color: #CCCCFF; background:#000000 ;
text-align: justify; font: 14px/20px "Times New Roman", Times, serif; }
center {text-align:center;}
a { color: #CCCCFF; text-decoration: underline; }
a:hover { color: #C63EE6; text-decoration: underline; }
#alles { max-width: 1250px; width: 100%; margin: auto; height: auto !important;/* overflow: hidden !important; border: 2px solid #545D6C; padding: 3px; border-radius: 8px; background: #BEC2CB;*/ }
#head { background: url(../img/header.jpg) no-repeat center center; border-radius: 8px; background-size: 100% auto; max- width: 1300px; width: 100%; height: 320px; margin: auto;}
#mother { width: 100%; text-align: justify; margin: auto; height: auto; }
h1, h2, h3 { text-align: center; color: #666; padding-bottom: 2px; height: auto; text-shadow: 1px 1px 4px #BA32DA; width: 90%; margin: auto; font-size: 2.5vw; line-height: 6vh; font-weight: bold; }
h2, h3 { font-size: 24px; line-height: 35px;}
nav ul{ display: inline-block; width: 99%; margin: auto; height: auto; text-align: center; }
nav { width: 99%; height: auto; text-align: center; margin: auto; padding: 5px; }
nav li{ display: inline-block; border: 1px none #BF37DF; list-style-type: none; color: #BF37DF; margin: 3px; height: auto; text-align: center; font-weight: bold; line-height: 30px; font-size: 12px; border-radius: 8px; background: #BF37DF; }
nav li a{ display: inline-block; color: #000000; text-decoration: none; padding:0 5px 0 5px; background: #9FADCA; background: linear-gradient(to bottom, #8294b9 1%,#92a4bf 25%,#92a4bf 75%,#8294b9 100%);

height: auto; border-radius: 8px; border: 1px solid #BF37DF; }
nav li a:hover{ background: #000000; -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: #D8E6F3; border-radius: 8px; text-decoration: none; }

#content { /*width: 99%; padding: 5px 0px; margin: auto; height: auto; text-align: center; */ }
article { width: 100%; text-align: center; margin: auto; }
.textbox { margin: 8px auto; text-align: justify; padding: 15px; border: 1px solid;  border-color: #8693AA; border-radius: 8px; }
.flexbox { display: flex; flex-direction: row; flex-wrap: wrap; }
.flexbox h2 { }
.flexbox .box { box-sizing: border-box; min-width: 200px; flex-grow: 1; flex-shrink: 1; flex-basis: 27%; padding: 20px;}
.flexbox .box:nth-child(2) {	flex-basis: 70%; padding-top:10px; }
.flexbox .box:nth-child(1) {padding-top: 10px;}
.flexbox .liste ul li { list-style: url(../img/herz.png) none inside; }
.flexbox .liste a:link { color: #000000; text-decoration: none; font-size: 16px; padding:3px; }
.flexbox .liste a:hover { text-decoration: none; color: #FF6600; }
.flexbox .box p { padding-bottom: 10px; }
.flexbox1 { display: flex; flex-direction: row; flex-wrap: wrap; }
.flexbox1 h2 { }
.flexbox1 .box { box-sizing: border-box; min-width: 200px; flex-grow: 1; flex-shrink: 1; flex-basis: 47%; padding: 20px;}
.flexbox1 .box:nth-child(2) {	flex-basis: 45%; padding-top:30px; }
.flexbox1 .box:nth-child(1) {padding-top: 30px;}
.flexbox1 .liste ul li { list-style: url(../img/herz.png) none inside; }
.flexbox1 .liste a:link { color: #CCCCFF; text-decoration: none; font-size: 16px; padding:3px; }
.flexbox1 .liste a:hover { text-decoration: none; color: #C0C0C0; }
.flexbox1 .box p { padding-bottom: 10px; }
.flexbox2 { display: flex; flex-direction: row; flex-wrap: wrap; }
.flexbox2 h2 { }
.flexbox2 .box { box-sizing: border-box; min-width: 200px; flex-grow: 1; flex-shrink: 1; flex-basis: 27%; padding: 20px;}
.flexbox2 .box:nth-child(3) {	flex-basis: 20%; padding-top:40px; }
.flexbox2 .box:nth-child(2) {	flex-basis: 50%; padding-top:30px; }
.flexbox2 .box:nth-child(1) {padding-top: 35px;}
.flexbox2 .liste ul li { list-style: url(../img/herz.png) none inside; }
.flexbox2 .liste a:link { color: #000000; text-decoration: none; font-size: 16px; padding:3px; }
.flexbox2 .liste a:hover { text-decoration: none; color: #FF6600; }
.flexbox2 .box p { padding-bottom: 10px; }
.flexbox2 ul {padding-top: 70px;}
.flex { display: flex; flex-direction: row; flex-wrap: wrap; }
.flex h2 { }
.flex .box { box-sizing: border-box; min-width: 400px; flex-grow: 1; flex-shrink: 1; flex-basis: 65%; padding: 10px;}
.flex .box:nth-child(2) { flex-basis: 35%; padding-top: 0px; }
.flex .box:nth-child(1) {padding-top: 10px;}
.flex .box p.chat { padding-top: 10px; text-align: center; margin:auto; }
.flex0 { display: flex; flex-direction: row; flex-wrap: wrap; }
.flex0 h2 { }
.flex0 .box { box-sizing: border-box; min-width: 300px; flex-grow: 1; flex-shrink: 1; flex-basis: 35%; padding: 10px;}
.flex0 .box:nth-child(2) {	flex-basis: 65%; padding-top:10px; }
.flex0 .box:nth-child(1) {padding-top: 100px;}
.flex1 { display: flex; flex-direction: row; flex-wrap: wrap; }
.flex1 .box { box-sizing: border-box; min-width: 300px; flex-grow: 1; flex-shrink: 1; flex-basis: 75%; padding: 20px;}
.flex1 .box:nth-child(2) {	flex-basis: 20%; padding-top:70px; }
.flex1 .box:nth-child(1) {padding-top: 30px;}
.flex1 .box p { padding-bottom: 10px; }
.flex2 { display: flex; flex-direction: row; flex-wrap: wrap; }
.flex2 .box { box-sizing: border-box; min-width: 400px; flex-grow: 1; flex-shrink: 1; flex-basis: 65%; padding: 20px;}
.flex2 .box:nth-child(2) {	flex-basis: 35%; padding-top:10px; }
.flex2 .box:nth-child(1) {padding-top: 10px;}
.flex2 .box p.chat { padding-bottom: 10px; text-align:center; margin:auto; }
.flex3 { display: flex; flex-direction: row; flex-wrap: wrap;}
.flex3 .box { box-sizing: border-box; min-width: 300px; flex-grow: 1; flex-shrink: 1; flex-basis: 27%; padding: 10px;}
.flex3 .box:nth-child(3) {	flex-basis: 27%; padding-top:10px; }
.flex3 .box:nth-child(2) {	flex-basis: 27%; padding-top:10px; }
.flex3 .box:nth-child(1) {padding-top: 10px;}
.flex3 .box p { padding-bottom: 10px}
.flex3 h3 { font-size: 20px; }
.flex3 .box .bild { max-width: 450px; width: 100%; height: auto; margin: auto; padding: 5px; }
.flex50 { display: flex; flex-direction: row; flex-wrap: wrap; }
.flex50 .box { box-sizing: border-box; min-width: 300px; flex-grow: 1; flex-shrink: 1; flex-basis: 50%; padding: 10px;}
.flex50 .box:nth-child(2) {	flex-basis: 50%; padding-top:10px; }
.flex50 .box:nth-child(1) {padding-top: 10px;}
.flex50 .liste ul li { list-style: url(../img/herz.png) none inside; padding-left: 50px; font-size: 20px; padding-top: 10px; padding-bottom: 10px; }
.flex50 .liste a:link { color: #000000; text-decoration: none; font-size: 16px; padding:3px; }
.flex50 .liste a:hover { text-decoration: none; color: #FF6600; }
.flex50 .box p { padding-bottom: 10px; }
.flex50 ul p { padding-bottom: 10px; padding-left: 70px; text-align: left; }
.ueberschrift { font-size: 14px; font-weight: bold; }
.werbung { text-align: left; margin: 80px auto 10px; padding-right: 30px; }
.werbung img {max-width: 280px; width: 100%; height:auto; text-align:center; margin:auto;}
.bild {max-width: 210px; width: 100%; height: auto; display:inline-block; padding: 15px; margin: auto; }
.bild_li { padding: 10px; float: left; }
.bild_re { padding: 10px; float: right; }
.banner { text-align: center; max-width:1000px; width: 100%; margin: auto;}
.banner img { max-width:1000px; width: 100%; margin: auto; }
/*.textbox, .textbox01, .banner {border: 2px inset #EF6418;  border-radius: 8px;box-shadow: 1px 0px 5px 0px #000;}*/
.frame { max-width: 1450px; width: 100%; margin: auto; height: 2800px; border-style: none; text-align:center; }
.kontaktformular { text-align: center; max-width: 453px; width: 100%; }
.formgruppe {margin-bottom: 15px; max-width:450px; width: 100%; text-align:left;}
input[type="text"],
input[type="email"],
input[type="tel"],
textarea { max-width: 450px; width:100%; font: 24px/40px "Times New Roman", Times, serif; }
.captcha {font: 24px/30px "Times New Roman", Times, serif;}
.abschicken {font: 24px/30px "Times New Roman", Times, serif; padding:5px; margin-top:8px; background-color:#69C; border-color:#C09; border-radius: 8px; text-align:left;}
footer { width: 100%; height: auto; border-top: 1px solid #CDCDCD; text-align: center; }
footer a { margin-right: 20px; }
.mobilbox {display: none;}
.center { text-align: center; }
.clear { clear: both; }
.datum { text-align: center; padding: 5px; }
#cookieNotice { position: fixed; border-bottom: solid 1px #a0a0a0; padding: 10px; text-align: center; background: #9FADCA; background: -moz-linear-gradient(top, #9FADCA 0%, #000000 30%, #000000 70%, #9FADCA 100%); background: -webkit-linear-gradient(top, #9FADCA 0%, #000000 30%, #000000 70%, #9FADCA 100%); background: linear-gradient(to bottom, #9FADCA 0%, #000000 30%, #000000 70%, #9FADCA 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9FADCA', endColorstr='#9FADCA', GradientType=0 );
color: #FF3; width: 100%; margin: auto; cursor: pointer; top: 0px; z-index: 1; font-size: 16px; font-weight: bold; line-height: 26px; }
#cookieNoticeCloser { color: #FF3; font-weight: bold; float: right; margin-right: 50px; font-size: 18px; }
#cookieNoticeCloser:before { content: ''; position: absolute; width: 1px; height: 9px; background-color: #000000; left: 7px; top: 5px; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); }
#cookieNoticeCloser:after { content: ''; position: absolute; width: 1px; height: 9px; background-color: #000000; left: 7px; top: 5px; transform: rotate(45deg); -webkit-transform: rotate(45deg); }
 @media only screen and (max-width: 1150px) {
h1, h2, h3 {  font-size: 2.5vw; line-height: 6vh;}
.flexbox .box:nth-child(2) {
	flex-basis: 30%;
}
}
 @media only screen and (max-width: 1100px) {
 #head { background:url(../img/header.jpg) no-repeat center center; border-radius: 8px; background-size: 95% auto; height: 22.0vw; margin: auto; } 
}
 @media only screen and (max-width: 950px) {
#alles { width: 98%; }
.flexbox { display: block; width: 98%; margin: auto; }
.flexbox1 { display: block; width: 98%; margin: auto; }
.flexbox2 { display: block; width: 98%; margin: auto; }
.flexbox .box:nth-child(1) {padding-top: 20px;}
.flex { display: block; width: 98%; margin: auto; }
.flex .box:nth-child(1) {padding-top: 20px;}
.flex1 { display: block; width: 98%; margin: auto; }
.flex1 .box:nth-child(1) {padding-top: 20px;}
.flex2 { display: block; width: 98%; margin: auto; }
.flex50 { display: block; width: 98%; margin: auto; }
#cookieNoticeCloser { font-size: 36px; }
}
@media only screen and (max-width: 530px) {
h1, h2, h3 { font-size: 16px; line-height: 25px; }
.mobilbox { display: block; padding: 5px; margin: auto; text-align: center; }
}
