/* ------------------------------------ HEADER -------------------------------- */
header#sp-header {height: 110px!important; position: relative; background: rgba(255,255,255,0.8);}
#sp-header.menu-fixed {position: fixed; z-index: 9999; background: rgba(255,255,255,1.0);}

/* ------------------------------------ BODY --------------------------------- */
.body-innerwrapper {overflow: hidden!important;}
body {font-family: 'Mali'!important; font-weight: 300; line-height: 30px; font-size: 16px;}
section#sp-main-body.mainkontakt {background-position:50% 15%!important; border-top:10px solid #fff; border-bottom:10px solid #fff;}
section#sp-main-body {overflow:hidden!important; padding:40px 0px!important;}
section#sp-steckbrief {border-bottom:1px solid #ddd!important;}
h3.contenttitel {font-family: 'Mali'!important; font-weight: 300; font-size: 150%; color:#000; margin-bottom: 2%;}
h3.contenttitel:after {display: block; border-bottom: 3px solid #00B050; width: 100%; max-width: 50px; margin: 13px 0 27px; content: '';}
h3.contenttitelkontakt {font-family: 'Mali'!important; font-weight: 300; font-size: 150%; color:rgba(255,255,255,0.8); margin-bottom: 2%;}
h3.contenttitelkontakt:after {display: block; border-bottom: 3px solid #00B050; width: 100%; max-width: 50px; margin: 13px 0 27px; content: '';}
div#mod-custom130 a, a:visited, a:focus {color:rgba(255,255,255,0.8)!important;}
div#mod-custom130 a:hover {color:#00B050!important;}
a.noicon.mainlink.wfpopup {color:#00B050!important;}
a:visited.noicon.mainlink.wfpopup {color:#00B050!important;}
a:hover.noicon.mainlink.wfpopup {color:#333!important;}
i.fa.fa-instagram {font-size: 200%; vertical-align: middle; margin-left: 1%; margin-right:3%;}
section#sp-karte.map div.container {max-width: 100%!important; width:100%!important; padding:0px; margin:0px;}
div#mod-custom130.mod-custom.custom {color:rgba(255,255,255,0.8);}
i.fa.fa-facebook-square {font-size: 200%; vertical-align: middle; margin-left: 1%; margin-right:3%;}

/* ------------------------------------ MENU --------------------------------- */
.sp-megamenu-parent > li > a, .sp-megamenu-parent > li > span {font-size:14px!important;}
li.sp-menu-item.current-item.active a, a:hover, a:focus, a:active {color:#00B050!important;}

/* ------------------------------------ KONTAKT ------------------------------ */
div.cf-form-wrap.cf-col-16 {padding:0px!important; background-color:transparent!important;}
.feld {background:rgba(255,255,255,0.8)!important; border:none!important; border-bottom:1px solid rgba(33,33,33,0.3)!important; border-radius:0px!important;}
.textfeld {background:rgba(255,255,255,0.8)!important; border:1px solid rgba(33,33,33,0.3)!important; border-radius:0px!important; margin-top:5%!important;}
input::placeholder {color:#333!important;}
.feld:focus {border-color:#00B050!important;}
.feld:focus::placeholder {color:#00B050!important; font-size:12px!important; position:relative; left:50%;}
.textfeld:focus {border-color:#00B050!important;}
.textfeld:focus::placeholder {color:#00B050!important; font-size:12px!important; position:relative; top:30px;}
button.cf-btn.cf-btn-style-flat.cf-btn-shadow-0  {background:#00B050!important;}
div.sp-module.contactcontent {padding-left:20%;}
 
/* ------------------------------------ FOOTER ------------------------------ */
div#sp-footer1 {text-align:left;}
div#sp-footer2 {text-align:right;}
a.scrollup {background-color:#00B050!important;}
a.scrollup:before {color:#fff!important;}
a.scrollup:hover {background-color:#333!important;}
a.scrollup:before:hover {color:#fff!important;}

div.n2-ss-layer.n2-ow.slog_1 {}
div.n2-ss-layer.n2-ow.slog_2 {}
div.n2-ss-layer.n2-ow.slog_3 {}

/***---------------------------------------- MEDIA QUERIES -------------------------------------------------***/

@media only screen and (min-width: 0px) and (max-width: 320px) {
h3.contenttitel {font-size: 120%; margin-bottom: 2%;}
h3.contenttitelkontakt {font-size: 100%;}
div.sp-module.contactcontent {padding-left: 0%; margin-top: 10%;} 
div#sp-footer1 {font-size:80%!important;}  
div#sp-footer2 {text-align: left;}  
}

@media only screen and (min-width: 321px) and (max-width: 375px) {
h3.contenttitel {font-size: 120%; margin-bottom: 2%;}
h3.contenttitelkontakt {font-size: 100%;}
div.sp-module.contactcontent {padding-left: 0%; margin-top: 10%;} 
div#sp-footer1 {font-size:80%!important;}  
div#sp-footer2 {text-align: left;}
}

@media only screen and (min-width: 376px) and (max-width: 425px) {
h3.contenttitel {font-size: 120%; margin-bottom: 2%;}
h3.contenttitelkontakt {font-size: 100%;}
div.sp-module.contactcontent {padding-left: 0%; margin-top: 10%;} 
div#sp-footer1 {font-size:80%!important;}  
div#sp-footer2 {text-align: left;}
}

@media only screen and (min-width: 426px) and (max-width: 479px) {
header#sp-header {height:120px!important;} 
h3.contenttitel {font-size: 120%; margin-bottom: 2%;}
h3.contenttitelkontakt {font-size: 100%;}
div.sp-module.contactcontent {padding-left: 0%; margin-top: 10%;} 
div#sp-footer1 {font-size:80%!important;}  
div#sp-footer2 {text-align: left;}
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
header#sp-header {height:130px!important;}   
h3.contenttitel {font-size: 120%; margin-bottom: 2%;}
h3.contenttitelkontakt {font-size: 100%;}
div.sp-module.contactcontent {padding-left: 0%; margin-top: 10%;} 
div#sp-footer1 {font-size:80%!important;}  
div#sp-footer2 {text-align: left;}
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
header#sp-header {height:130px!important;} 
div.sp-module.contactcontent {padding-left: 0%; margin-top: 10%;} 
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

}

@media only screen and (min-width: 1200px) {

}