/* reset ========================================================================================================*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{border:0;margin:0;padding:0;}a{outline:none;text-decoration:none;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}img{vertical-align:bottom;}del,ins{text-decoration:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup,sub{vertical-align:baseline;}legend{color:#000;}input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}input,button,textarea,select{font-size:100%;}li{list-style:none;}
/*========================================================================================================*/
/* basics */
*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-smooth:always;}
*:before, *:after{box-sizing:inherit;}

html{overflow-y:scroll;font-family:"Lato", Geneva, sans-serif;font-size:100%;line-height:1.4;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;color:#000;}
body{-webkit-text-size-adjust:none;}
/* container */
#containerbox{width:100%;max-width:980px;margin:0 auto;}
#container{width:100%;}

/* header */
.headerbox{width:100%;}
#logo{height:50px;font-size:24px;padding:20px 15px;font-weight:600!important;margin-bottom:20px;float:right;}
#contentbox{clear:both;}
/* accordion */
.accordion{background-color:#e70033;color:#fff;cursor:pointer;padding:0px 15px;;width:42%;height:42px;border:none;text-align:left;outline:none;font-size:20px;transition:0.4s;width:100%;}
.panel{padding:0 15px;max-height:0;overflow:hidden;transition:max-height 0.4s ease-out;background-color:#fff;width:100%;margin-bottom:5px;}
.active, .accordion:hover{background-color:#af1127;color:#fff;}

#accordionfooter{background-color:#fff!important;color:#000!important;cursor:pointer;padding:0px 15px;height:22px!important;font-size:12px;transition:0.4s;position:relative;top:-2px;}
#accordionfooter:hover{color:#e70033!important;}

.kreis{height:16px;width:16px;border-radius:8px;background-color:#fff;float:right;position:relative;top:-15px;left:-168px;}
.kreis2{height:16px;width:16px;border-radius:8px;background-color:#f39b90;float:left;position:relative;top:20px;left:58px;}
.kreis3{height:16px;width:16px;border-radius:8px;background-color:#e70033;float:right;position:relative;top:60px;left:-58px;}
.kreis4{height:16px;width:16px;border-radius:8px;background-color:#fff;float:right;margin:9px 75px 0 0;}
.kreis5{height:16px;width:16px;border-radius:8px;background-color:#e70033;position:relative;top:90px;left:249px;}

.kreis:hover{background-color:#00ff69;}
.kreis2:hover{background-color:#04F3FF;}
.kreis3:hover{background-color:#CEFF00;}
.kreis4:hover{background-color:#ffed00;}
.kreis5:hover{background-color:#1300FF;}


.bild{max-width:100%;}
.bild img{width:100%!important;height:auto;}


.panelinner{padding: 15px 0 20px 0;margin-bottom:20px;border-top:1px #f0847f solid;border-bottom:1px #f0847f solid;margin-top:25px;}
#panelimpressum .panelinner {margin-top:10px!important;}
.leer{display:inline-block;width:4px;}
.doppel{color:#e70033;}
#mainkontakt{text-align:center!important;}
#panelimpressum{font-size:8o%;}

.headline{font-weight:700;font-size:20px;}
.laufhf{font-weight:700;}
.panelinner img{max-width:750px;}
.panelinner a{color:#e70033!important;}
.linie{font-display:block;width:100%;border-top:1px #f0847f solid;margin-bottom:15px;}

/* footer */
#footerbox{diplay:block;clear:both;width:100%;height:60px;}

/* großer Bildschirm ========================================================================================================*/

@media screen and (min-width:680px){
#logo{font-size:24px;}
.accordion{width:28%;min-width:260px;}
.panel{margin:0 10% 5px 10%;width:78.5%;}
.kreis{background-color:#e70033;top:20px;left:368px;}
.kreis2{top:30px;}
.kreis3{left:558px;}
}