/*
Theme Name: Kinder- und Jugendarztzentrum, Datteln
Theme URI: http://www.staude.de
Author: Das Staude Software Team
Author URI: http://www.staude.de
Description: Kinder- und Jugendarztzentrum, Datteln
Version: 3.5.1
Tags: staude, kundendesign
Update: 19.10.2025 KOLTON DESIGN
*/

/* Bootstrap */
/* Basic structure */



body {
	background: rgb(255,255,255);
	color: var(--third-color);
	font-size: 14pt;
	line-height:1.4em;
	font-family: 'Livvic', sans-serif !important;
	font-weight:300;
}

#content img.wp-post-image {
    border-radius: 0px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.0);
	margin-bottom: 25px;
}

.flex-row{display: -webkit-flex;   display: -ms-flex;   display: flex;   -webkit-flex-wrap: wrap;   -ms-flex-wrap: wrap;   flex-wrap: wrap;}
.flex-col{display: -webkit-flex;display: -ms-flexbox; display: flex;}

.main-color{color: var(--main-color);}

.no-padding{padding:0px !important;}

a { 
color: var(--main-color);
text-decoration: none;
  -webkit-transition: all 0.33s ease-in-out;
  -moz-transition: all 0.33s ease-in-out;
  -o-transition: all 0.33s ease-in-out;
  transition: all 0.33s ease-in-out;
}
a:hover {
    color: #fff;

}

p{ margin-bottom: 15px; }

.center{text-align:center; margin: auto;}

.trenner{
	border-top:1px solid #ccc;
	padding-top:40px;
	margin-top:40px;
}

.swipeit { 
	height:40px; 
	overflow: hidden;
	padding: 5px 0 5px 55px; 
	width: 0; 
	-webkit-transition: width .33s ease-in 0s; 
	-moz-transition: width .33s ease-in 0s; 
	transition: width .33s ease-in 0s; 
}
.swipeit .inner-txt {display: block;min-width: 106px;}
.swipeit:hover, .swipeit:focus {padding: 5px 0px 5px 55px; width: 150px;}

.row{margin-right:-15px;margin-left:-15px}
.row:after,.row:before, .section-content:after, .section-content:before{display:table;content:" ";}
.row:after,.section-content:after {clear:both;}
:before,:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
[class*="col-"] {padding-top:10px; padding-bottom: 10px;}
[class*="col-"] {padding-left:15px; padding-right: 15px;min-height:1px;position:relative;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; }

#wrapper{ margin: 0px auto; position: relative; /* min-width: 996px; */ }

/** Empfehlen QR und Vorbestellen Button **/
#btn-empfehlen, #btn-qrcode, #btn-termin, #btn-facebook, #btn-insta, #btn-twitter, #btn-linkedin{
	background-repeat:no-repeat;
	float: right;
	border: 1px solid var(--main-color);
	border-radius: 100%;
	position: relative;	
	-webkit-transition: all 0.33s ease-in-out;
	-moz-transition: all 0.33s ease-in-out;
	-o-transition: all 0.33s ease-in-out;
	transition: all 0.33s ease-in-out;
}

#btn-qrcode:before, #btn-empfehlen:before, #btn-termin:before, #btn-facebook:before, #btn-insta:before, #btn-twitter:before, #btn-linkedin:before{
	content: '';
	background-color: var(--main-color);
	-webkit-mask-size: contain;
	width: 18px;
	height: 18px;
	display: inline-block;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center center;
	vertical-align: middle;
	position:absolute;
	top: 6px;
	left:6px;
	transform: rotate(0deg);
	-webkit-transition: all 0.33s ease-in-out;
	-moz-transition: all 0.33s ease-in-out;
	-o-transition: all 0.33s ease-in-out;
	transition: all 0.33s ease-in-out;	
}

#btn-qrcode:before{-webkit-mask-image: url("images/icons/icon-qrcode.svg");}
#btn-empfehlen:before{-webkit-mask-image: url("images/icons/icon-empfehlen.svg");}
#btn-termin:before{-webkit-mask-image: url("images/icons/icon-termin.svg");}
#btn-facebook:before{-webkit-mask-image: url("images/icons/icon-facebook.svg");top: 6px;left:6px;}
#btn-insta:before{-webkit-mask-image: url("images/icons/icon-instagram.svg");}
#btn-twitter:before{-webkit-mask-image: url("images/icons/icon-twitter.svg");}
#btn-linkedin:before{-webkit-mask-image: url("images/icons/icon-in.svg");}


#btn-empfehlen:hover, #btn-qrcode:hover, #btn-termin:hover, #btn-facebook:hover, #btn-insta:hover, #btn-twitter:hover, #btn-linkedin:hover{
background-color: var(--secondary-color);
}

#btn-qrcode:hover:before, #btn-empfehlen:hover:before, #btn-termin:hover:before, #btn-facebook:hover:before, #btn-insta:hover:before, #btn-twitter:hover:before, #btn-linkedin:hover:before{
	background-color: #fff;
	transform: rotate(360deg);	
}

#btn-en{
	background-image: url(images/en-btn.png);
    background-size: contain;
    display: inline-block;
    height: 32px;
    width: 32px;
    position: relative;
    float: right;
    margin-top: 14px;
    margin-right: 3px;
}

@media( max-width: 767px ) {
	#btn-qrcode:before, #btn-empfehlen:before, #btn-termin:before, #btn-insta:before, #btn-twitter:before, #btn-linkedin:before{top: 6px;left:6px;}
	#btn-empfehlen, #btn-qrcode, #btn-termin, #btn-facebook, #btn-insta, #btn-twitter, #btn-linkedin{display:none;width:30px;height:30px;margin-right:5px;margin-top: 12px;}
}

@media( min-width: 768px ) {
	#btn-qrcode:before, #btn-empfehlen:before, #btn-termin:before, #btn-insta:before, #btn-twitter:before, #btn-linkedin:before{top: 6px;left:6px;}
	#btn-empfehlen, #btn-qrcode, #btn-termin, #btn-facebook, #btn-insta, #btn-twitter, #btn-linkedin{display:none;width:30px;height:30px;margin-right:5px;margin-top: 12px;}
}

@media( min-width: 992px ) {
	#btn-qrcode:before, #btn-empfehlen:before, #btn-termin:before, #btn-insta:before, #btn-twitter:before, #btn-linkedin:before{top: 6px;left:6px;}
	#btn-empfehlen, #btn-qrcode, #btn-termin, #btn-facebook, #btn-insta, #btn-twitter, #btn-linkedin{display: inline-block;width: 30px;height: 30px;margin-right: 5px;margin-top: 12px;}
}

@media( min-width: 1200px ) { 
	#btn-qrcode:before, #btn-empfehlen:before, #btn-termin:before, #btn-insta:before, #btn-twitter:before, #btn-linkedin:before{top: 6px;left:6px;}
	#btn-empfehlen, #btn-qrcode, #btn-termin, #btn-facebook, #btn-insta, #btn-twitter, #btn-linkedin{display: inline-block;width: 30px;height: 30px;margin-right: 5px;margin-top: 12px;}
}

/***********************************/
/********* Quick Actions **********/
/**********************************/

#quick-actions{
	display:block;
	width:100%;
	position:fixed;
	bottom:0px;
	left:0px;
	background-color: var(--main-color);
	z-index:9999;
	text-align:center;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	overflow:hidden;
	height: 67px;
	-webkit-transition: all 0.33s ease-in-out;
	-moz-transition: all 0.33s ease-in-out;
	-o-transition: all 0.33s ease-in-out;
	transition: all 0.33s ease-in-out;
	
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	}

#quick-actions.more{height: 134px;}

#quick-actions .btn-more-smart{display:block;width:25px;height:134px;position:absolute;top:0px;right:0px;background-color: var(--secondary-color);cursor: pointer;}

#quick-actions .btn-more-smart:before{content:"mehr";transform: rotate(-90deg);color:#fff;position:absolute;top:23px;left: -5px;}
#quick-actions.more .btn-more-smart:before{content:"weniger";transform: rotate(-90deg);color:#fff;position:absolute;top: 54px;left: -15px;}

#quick-actions .quick-actions-call, 
#quick-actions .quick-actions-mail, 
#quick-actions .quick-actions-nav, 
#quick-actions .quick-actions-termin,
#quick-actions .quick-actions-empfehlen,
#quick-actions .quick-actions-facebook,
#quick-actions .quick-actions-insta,
#quick-actions .quick-actions-twitter,
#quick-actions .quick-actions-linkedin{
    display: inline-block;
    background-color: var(--main-color);
    color: #fff;
    width: 25%;
    padding: 35px 0px 10px 0px;
    text-align: center;
    font-size: 0.6em;
    color: #fff;
    position: relative;
    font-weight: 400;

}



#quick-actions .quick-actions-call:hover, 
#quick-actions .quick-actions-mail:hover, 
#quick-actions .quick-actions-nav:hover, 
#quick-actions .quick-actions-termin:hover,
#quick-actions .quick-actions-empfehlen:hover,
#quick-actions .quick-actions-facebook:hover,
#quick-actions .quick-actions-insta:hover,
#quick-actions .quick-actions-twitter:hover,
#quick-actions .quick-actions-linkedin:hover{background-color: var(--secondary-color);}

#quick-actions .quick-actions-call:before,
#quick-actions .quick-actions-mail:before,
#quick-actions .quick-actions-nav:before,
#quick-actions .quick-actions-termin:before,
#quick-actions .quick-actions-empfehlen:before,
#quick-actions .quick-actions-facebook:before,
#quick-actions .quick-actions-insta:before,
#quick-actions .quick-actions-twitter:before,
#quick-actions .quick-actions-linkedin:before{
	content: '';
	background-color: #fff;
	-webkit-mask-size: contain;
	width: 24px;
	height: 24px;
	display: inline-block;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center center;
	vertical-align: middle;
	position:absolute;
	top: 10px;
	left: calc(50% - 12px);
}

#quick-actions .quick-actions-call:before{-webkit-mask-image: url("images/icons/icon-phone.svg");}
#quick-actions .quick-actions-mail:before{-webkit-mask-image: url("images/icons/icon-mail.svg");}
#quick-actions .quick-actions-nav:before{-webkit-mask-image: url("images/icons/icon-location.svg");}
#quick-actions .quick-actions-termin:before{-webkit-mask-image: url("images/icons/icon-termin.svg");}
#quick-actions .quick-actions-empfehlen:before{-webkit-mask-image: url("images/icons/icon-empfehlen.svg");}
#quick-actions .quick-actions-facebook:before{-webkit-mask-image: url("images/icons/icon-facebook.svg");}
#quick-actions .quick-actions-insta:before{-webkit-mask-image: url("images/icons/icon-instagram.svg");}
#quick-actions .quick-actions-twitter:before{-webkit-mask-image: url("images/icons/icon-twitter.svg");}
#quick-actions .quick-actions-linkedin:before{-webkit-mask-image: url("images/icons/icon-in.svg");}

@media( max-width: 767px ) {
#quick-actions{display:block;}
}

@media( min-width: 768px ) { 
#quick-actions{display:none;}
}

@media( min-width: 992px ) {
#quick-actions{display:none;}
}

@media( min-width: 1200px ) {
#quick-actions{display:none;}
}

/***************************/
/********* Header **********/
/***************************/
#header-wrapper{
	width:100%;
	position:fixed;
	top:0px;
	z-index:9999;
	background-color: rgba(255,255,255,0);
	-webkit-transition: all 0.33s ease-in-out;
	-moz-transition: all 0.33s ease-in-out;
	-o-transition: all 0.33s ease-in-out;
	transition: all 0.33s ease-in-out;
}
body.down #header-wrapper{top:-56;background-color: rgba(255,255,255,0.9);}

#header-kontakt{width:100%;text-align:left;border-bottom: 1px solid #fff;color:var(--third-color);font-weight:300;display:block;font-size:0.9em;} 

#header-kontakt a{color:var(--main-color);}
#header-kontakt a:hover{color:var(--main-color);text-decoration:underline;}

.icon-phone, .icon-location, .icon-mail, .icon-fax{padding: 2px 5px 5px 30px;display: inline-block;text-align: left;position: relative;margin-top: 3px;}

.icon-phone:before, .icon-location:before, .icon-mail:before, .icon-fax:before{
	content: '';
	background-color: var(--main-color);
	-webkit-mask-size: contain;
	width: 25px;
	height: 25px;
	display: inline-block;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center center;
	vertical-align: middle;
	position:absolute;
	top: 0px;
	left:0px;
}

.icon-phone:before{-webkit-mask-image: url("images/icons/icon-phone.svg");}
.icon-location:before{-webkit-mask-image: url("images/icons/icon-location.svg");}
.icon-mail:before{-webkit-mask-image: url("images/icons/icon-mail.svg");}
.icon-fax:before{-webkit-mask-image: url("images/icons/icon-fax.svg");}

#header-navigation{
	width:100%;
	position: relative;
	-webkit-transition: all 0.33s ease-in-out;
	-moz-transition: all 0.33s ease-in-out;
	-o-transition: all 0.33s ease-in-out;
	transition: all 0.33s ease-in-out;
}

.show-up{display:block;} 
.show-down{display:none;}

body.down .show-up{display:none;}
body.down .show-down{display:block;}

#logo{
	width: 100%;
	max-width: 450px;
	-webkit-transition: all 0.33s ease-in-out;
	-moz-transition: all 0.33s ease-in-out;
	-o-transition: all 0.33s ease-in-out;
	transition: all 0.33s ease-in-out;
	z-index: 9999;	
	}
#logo-sm{
	width: 100%;
	max-width: 170px;
	-webkit-transition: all 0.33s ease-in-out;
	-moz-transition: all 0.33s ease-in-out;
	-o-transition: all 0.33s ease-in-out;
	transition: all 0.33s ease-in-out;
	z-index: 9999;
	display:none;
}
body.down #logo{display:none;}
body.down #logo-sm{display:block;}
	


@media( max-width: 767px ) {
#header-wrapper{position:absolute;}
body.down #header-wrapper{top:0px;}
#btn-empfehlen, #btn-qrcode, #btn-vorbestellen, #btn-facebook{display:none;}
#header-kontakt{display:none;}
/* #header-navigation:before, #header-navigation:after{display: none;} */
/* .icon-phone:before, .icon-location:before, .icon-mail:before, .icon-fax:before{display:none;} */
.icon-phone, .icon-location, .icon-mail, .icon-fax{padding: 2px 5px 5px 30px;}
/* .icon-location{display:none;} */
#logo{max-width: 450px;	}
}

@media( min-width: 768px ) { 
#header-wrapper{position:fixed;}
body.down #header-wrapper{top:-66px;}
#btn-empfehlen, #btn-qrcode, #btn-vorbestellen, #btn-facebook{display:none;}
#header-kontakt{display:block;}
/* #header-navigation:before, #header-navigation:after{display: none;} */
/* .icon-phone:before, .icon-location:before, .icon-mail:before, .icon-fax:before{display:none;} */
.icon-phone, .icon-location, .icon-mail, .icon-fax{padding: 2px 5px 5px 30px;}
/* .icon-location{display:none;} */
#logo{max-width: 450px;	}
}

@media( min-width: 992px ) {
#header-wrapper{position:fixed;}
body.down #header-wrapper{top:-66px;}
#btn-empfehlen, #btn-qrcode, #btn-vorbestellen, #btn-facebook{display:none;}
#header-navigation:before, #header-navigation:after{display: block;}
/* .icon-phone:before, .icon-location:before, .icon-mail:before, .icon-fax:before{display:none;} */
.icon-phone, .icon-location, .icon-mail, .icon-fax{padding: 2px 5px 5px 30px;display:inline-block;}
#logo{max-width: 450px;	}
}

@media( min-width: 1200px ) {
#header-wrapper{position:fixed;} 
body.down #header-wrapper{top:-66px;}
#btn-empfehlen, #btn-qrcode, #btn-vorbestellen, #btn-facebook{display:inline-block;}
#header-navigation:before, #header-navigation:after{display: block;}
.icon-phone:before, .icon-location:before, .icon-mail:before, .icon-fax:before{display:block;}
.icon-phone, .icon-location, .icon-mail, .icon-fax{padding: 2px 5px 5px 30px;display:inline-block;}
#logo{max-width: 450px;	}
}

/** Navigation Oben **/
#navigation{ text-align: right; width: 100%;font-size: 1em; }
#nav_oben { display: inline-block; z-index: 99; }

#nav_oben > li.menu-item { float:left; display: inline-block; }

#nav_oben > li + li.menu-item { 	
	padding-left: 0; 
	margin-left: 0; 
}

/*Hauptnanigation*/
#nav_oben > li.menu-item a{
	display: block;
	padding: 33px 10px;
	color: var(--main-color);
	/* background-color: var(--third-color); */
	font-weight:600;
	font-size:0.75em;
	line-height:120%;
	text-transform: uppercase;	
	-webkit-transition: all 0.33s ease-in-out;
	-moz-transition: all 0.33s ease-in-out;
	-o-transition: all 0.33s ease-in-out;
	transition: all 0.33s ease-in-out;	
	}
	
#nav_oben > li.menu-item a:hover{
	color:var(--secondary-color);
	/* background-color: var(--secondary-color); */
	}

#nav_oben ul.sub-menu { display:none; }

#nav_oben.dropdown li.menu-item:hover > ul.sub-menu,
#navigation  li.page_item:hover > ul.children {
	display:block;
	position: absolute;
	z-index: 109;
}
#navigation .dropdown ul.sub-menu li:hover a:after,
#navigation .dropdown ul.children li:hover a:after{
	float:left;
	display: inline-block;
	content: "";
}

/*Unternavigation*/
#nav_oben > li > ul.sub-menu > li > a{ padding: 10px; color:#fff; text-align: left; }
#nav_oben > li > ul.sub-menu > li { background-color: var(--main-color); border-bottom:1px solid #efefef; }

body.down #nav_oben > li > ul.sub-menu > li > a{	padding: 10px;	}

#nav_oben > li > ul.sub-menu > li:hover > a { color: var(--fourth-color); }
#nav_oben > li > ul.sub-menu > li:hover { background-color:var(--secondary-color); }


#navigation .dropdown ul.sub-menu li:hover ul.sub-menu,
#navigation .dropdown ul.children li:hover ul.children{ left: 100%; }


@media( max-width: 767px ) {

}

@media( min-width: 768px ) { 

}

@media( min-width: 992px ) {
#nav_oben > li.menu-item a{padding: 33px 10px;}
}

@media( min-width: 1200px ) {
#nav_oben > li.menu-item a{padding: 33px 9px;}
}

/********************************************/
/********** CONTENT / SECTIONS *************************/
/********************************************/

.pre-title{
	font-weight: 300;
    color: #ccc3b9;
    font-size: 1.2em;
    /* font-family: 'Chilanka', cursive; */
    display: block;
    position: relative;
    border-bottom: 1px solid #ccc3b9;
    margin-bottom: 5px;
    padding-bottom: 5px;
    display: inline-block;
} 

.headline-wrapper{background-image: url("images/headline-wrapper.png");width:100%;padding:25px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;background-attachment:fixed;}
.headline-wrapper-inner{/* background-color: var(--third-color); */width:100%;padding:25px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}

#content hr{background-color: #efefef;border: 0;height: 1px;margin: 24px auto;width:100%}

.btn-green-small {
    width: 100%;
    color: #fff;
	font-family: 'Livvic', sans-serif;
    cursor: pointer;
    margin: 10px 0;
    text-align: center;
    border-radius: 100px;
    background-size: 300% 100%;
    font-weight: 300;
    border: 1px solid #ffffff;
    max-width: 300px;
    display: inline-block;
    padding: 10px;
    moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

.btn-green-small:hover {
    background-position: 100% 0;
    moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}
.bg-box .btn-green-small:hover{
	background-color: #fff;
	color: var(--main-color);
}
.btn-green-small:focus {
    outline: none;
}
.btn-green-small.color-1 {
    background-image: linear-gradient(to right, var(--main-color), var(--secondary-color));
    box-shadow: 0 0px 5px 0 rgba(0,0,0, 0.2);
}

.themen-link{
	border-bottom: 1px solid #ccc;
    padding-bottom: 10px;
    margin-bottom: 15px;
}


#content { line-height:1.4em;width:100%;max-width:100%;overflow:hidden; min-height: 500px;}

#content h1, #content h2, #content h3, #content h4, #content h5, #content h6 {line-height: 1.15;color:var(--main-color);font-weight:300;}
#content h1 {font-size: 2.5em;}
#content h2, h2 {font-size: 2em;margin-bottom: 25px;font-weight: 400;color:var(--main-color);line-height: 120%;}
#content h3 {font-size: 1.6em;margin-bottom:15px;font-weight:300;color:var(--main-color);}
#content h4 {font-size: 1.5em;margin-bottom: 15px;border-bottom: 1px solid #e2e2e2;display: inline-block;padding-bottom: 20px;}
#content h5 {font-size: 1.33em;}
#content h6 {font-size: 1.25em;}

#site-content { padding-top: 245px; }

body.home #site-content{ padding-top: 0px; }

.section-wrapper { }
.section-content { width: 85%; min-height: 1px; max-width:1380px;margin:auto;}
.section-content.unfixed { min-height: initial; }

/*********************************************/
/**************** HOME ***********************/
/*********************************************/

#home{height:100vh;background-image:url("images/bg-home.jpg");background-size:cover;background-position: top center;position:relative;overflow:hidden;background-attachment: fixed;text-align:center;}

#home-pic{width:100%;height:auto;/* max-width:820px; */position:absolute;bottom:0;left: 0;z-index:0;}

#content .gesundheitsnews-btn-search { background-color: var(--main-color); font-size: 0.9em; }

#home .sec-title{color: var(--fourth-color);text-align:center;text-transform:uppercase;margin-bottom:40px;background-color: rgba(255,255,255,0.7);padding: 5px 10px 8px;display: inline-block;}
#home .main-solgan{color:var(--main-color);font-size:2.6em;font-weight:800;text-align:center;line-height:1.25em;text-shadow: 2px 2px 12px rgba(255,255,255,0.95);text-transform:uppercase;background-color: rgba(255,255,255,0.7);padding: 5px 10px 8px;display: inline-block;}

.center-content-wrapper{width:100%;height:100vh;position:relative;}

.center-content-elements{width:100%;text-align:center;z-index:30;position:absolute;bottom:100px;}

#content #home .center-content-elements h1{text-align:center;}

.standort-box{background-color: rgba(255,255,255,0.9);padding: 20px;border-radius: 14px;max-width: 250px;margin:10px 0;}

@media( max-width: 767px ) {
#home .main-solgan{font-size:2em;margin-bottom: 25px;}
.btn-green-small{font-size:0.8em;}
#home-pic{display:none;}
}

@media( min-width: 768px ) { 
#home .main-solgan{font-size:2.5em;margin-bottom: 25px;}
.btn-green-small{font-size:0.9em;}
}

@media( min-width: 992px ) {
#home .main-solgan{font-size:2em;margin-bottom: 25px;}
.btn-green-small{font-size:0.9em;}
}

@media( min-width: 1200px ) {
#home .main-solgan{font-size:2em;margin-bottom: 25px;}
#home .sec-title{font-size: 1.3em;}
.btn-green-small{font-size:1em;}
}

/*************************************************/
/**************** SECTIONS ***********************/
/************************************************/
#home::after{
	content: '';
    background-image: url(images/curve.png);
    background-position: bottom left;
    background-repeat: no-repeat;
    height: 221px;
    width: 100%;
    position: absolute;
	bottom: 0;
}

#philosophie{padding: 80px 0;}
.img-box{min-height: 300px;}

.signatur {
    color: var(--secondary-color);
    /* font-family: 'Chilanka', cursive; */
    font-size: 2em;
    line-height: 140%;
	margin-top:40px;
	display:block;
}
.red-bg{
	background-color: rgba(199, 23, 24, 0.8);
    padding: 20px;
    color: #fff;
}
.red-bg h2{color:#fff !important;}
.red-bg .pre-title{color:var(--main-color);border-bottom:1px solid var(--main-color);}

.metaslider .flex-control-nav{bottom: 45px !important;}
.flex-control-paging li a.flex-active{background: var(--secondary-color);background: var(--secondary-color) !important;}
.metaslider .flexslider{margin:0px !important;}
.flex-control-paging li a{background: var(--main-color);background:var(--main-color) !important;border: 1px solid rgba(255,255,255,0.6);}

/* Rundgang */
#gallery-1 { position:relative;overflow:hidden;display: inline-block;border-radius: 15px; }
#gallery-1:hover{opacity:0.8;}
#gallery-1::before { 
	content:"";
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	background-image: url("images/praxis-before.png");
	background-size:100%;
	background-repeat: no-repeat;
	background-position: top center; 
	z-index: 2;
	border: 8px solid rgba(255,255,255,0.4);
	border-radius: 15px;
}

 
/* Slogan */
#sprichwort {
	background: url(images/bg-slogan.jpg) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	position: relative;
}
#sprichwort-2 {
	background: url(images/bg-slogan-2.jpg) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	position: relative;
}
#sprichwort::before, #sprichwort-2::before{
	content: '';
    background-image: url(images/curve-after.png);
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    z-index: 2;
    min-width: 100%;
    width: 400px;
	height: 165px;
    top: 0px;
	
}
#sprichwort::after, #sprichwort-2::after{
	content: '';
    background-image: url(images/curve-before.png);
	background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    z-index: 2;
    min-width: 100%;
    width: 400px;
    height: 214px;
    bottom: -24px;
	
}
#sprichwort .pre-title, #sprichwort-2 .pre-title{color: var(--fourth-color);font-weight: 400;font-family: 'Livvic', sans-serif;font-size: 1.8em;line-height: 120%;text-shadow: 0px 0px 10px rgba(0,0,0,0.4);}
.sprichwort-title{margin:50px;padding:200px 0px;text-align:center;}

.sprichwort-pre {
	color: var(--fourth-color);
    font-size: 1em;
    font-weight: 300;
    text-align: center;
    line-height: 1.25em;
    text-shadow: 2px 2px 12px rgba(27, 85, 139, 0.9);
    margin-bottom: 25px;
    display: block;
}
.sprichwort-main{color:var(--main-color);font-size:2em;text-align:center;text-transform: uppercase;margin-bottom:25px;display:block;line-height: 120%;}
.sprichwort-title{margin:50px;padding:200px 0px;text-align:center;}

.quote{font-family: 'amithenregular';color:var(--fourth-color);text-align:center;font-size:2em;line-height: 120%;}

@media( max-width: 767px ) {
.sprichwort-title{margin:50px 0px;padding:100px 0px;}
}

@media( min-width: 768px ) { 
.sprichwort-title{margin:50px 0px;padding:150px 0px;}
}

@media( min-width: 992px ) {
.sprichwort-title{margin:50px 0px;padding:200px 0px;}
}

@media( min-width: 1200px ) {	
.sprichwort-title{margin:50px 0px;padding:200px 0px;}
}


/*********************************************/
/**************** KONTAKT ***********************/
/*********************************************/

.bg-box{
	background: var(--secondary-color);
	width: 90%;
	padding: 5%;
	display: block;
	min-height: 250px;
	color:#fff;
	position:relative;
	-webkit-box-shadow: 0px 10px 17px 0px rgba(129,129,129,0.5);
	-moz-box-shadow: 0px 10px 17px 0px rgba(129,129,129,0.5);
	box-shadow: 0px 10px 17px 0px rgba(129,129,129,0.5);
	border-radius: 5px;
}

.bg-box.grau {
	background:#d9dadd;
	padding: 25px;
	margin-top: 0px;
	margin-bottom: 25px;
}

@media( max-width: 767px ) {
.bg-box{margin-top: -0px;}
}

@media( min-width: 768px ) { 
.bg-box{margin-top: -100px;}
}

@media( min-width: 992px ) {
.bg-box{margin-top: -150px;}
}

@media( min-width: 1200px ) {
.bg-box{margin-top: -170px;}
}

#content .bg-box h6{color:#fff;}

.icon-anschrift, .icon-open, .icon-bestellen{background-repeat:no-repeat;background-position: top left;display:block;padding:10px 0px 10px 64px;font-size:18px;color:#cd1719;text-align:left;margin-top:10px;}

.icon-anschrift{background-image: url("images/icon-anschrift.png");color:#fff;padding:10px 0px 10px 40px;}
.icon-open{background-image: url("images/icon-open.png");color:#fff;padding:10px 0px 10px 50px;}
.icon-bestellen{background-image: url("images/vorbestell-icn.png");color:#fff;padding:10px 0px 10px 60px;}

.btn-leistungen{display:block;width:100%;border:1px solid #fff;padding: 15px;color:#fff;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}

/***********************************/
/********* Leistungen **************/
/***********************************/
.leistung-content{padding-right:45px;}
.leistung-box{
	background-color: #f4f4f4;
    border-radius: 10px;
    padding: 20px;
    margin-bottom: 50px;
}
.leistung-box a:hover{padding-left:10px;-webkit-transition: all 0.33s ease-in-out;
	-moz-transition: all 0.33s ease-in-out;
	-o-transition: all 0.33s ease-in-out;
	transition: all 0.33s ease-in-out;
}
.leistung-box a:hover::after{content:"»";padding-left:5px;}

.grid figure {
	position: relative;
	float: left;
	overflow: hidden;
	/* margin: 10px 1%; */
	/* min-width: 320px; */
	width: 100%;
	height: auto;
	background: #efefef;
	text-align: center;
	cursor: pointer;
	max-height: 415px;
	border-radius:15px;
}

.grid figure img {
	position: relative;
	display: block;
	/* min-height: 100%; */
	max-width: 100%;
	opacity: 0.8;

}

.grid figure figcaption {
	padding: 0.5em;
	color: #fff;
	/* text-shadow: 0px 0px 2px rgba(150, 150, 150, 1); */
	font-size: 1em;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;
}

.grid figure figcaption::before,
.grid figure figcaption::after {
	pointer-events: none;
}

.grid figure figcaption,
.grid figure figcaption > a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.grid figure figcaption > a {
	z-index: 1000;
	text-indent: 200%;
	white-space: nowrap;
	font-size: 0;
	opacity: 0;
}

.grid figure h2 span {
	font-weight: 800;
}

.grid figure h2,
.grid figure p {
	margin: 0;
}

figure.effect-ruby {
	background-color: #efefef;
}

figure.effect-ruby img {
	opacity: 1;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: scale(1.15);
	transform: scale(1.15);
}

figure.effect-ruby:hover img {
	opacity: 0.5;
	-webkit-transform: scale(1);
	transform: scale(1);
}

#content figure.effect-ruby h2 {
	margin-top: 40%;
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
	-webkit-transform: translate3d(0,20px,0);
	transform: translate3d(0,20px,0);
	color:#fff;
	font-size:1em;
	font-weight:400;
	-webkit-transition: all 0.33s ease-in-out;
	-moz-transition: all 0.33s ease-in-out;
	-o-transition: all 0.33s ease-in-out;
	transition: all 0.33s ease-in-out;
	background-color:var(--main-color);
	padding: 10px;
	border-radius: 100px;
}

#content figure.effect-ruby:hover h2 {
	margin-top: 30%;background-color:var(--secondary-color);
}

figure.effect-ruby a{color:var(--main-color);}

figure.effect-ruby p {
    margin: 10px 0 0;
    padding: 10px;    
    opacity: 0;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    -webkit-transform: translate3d(0,20px,0) scale(1.1);
    transform: translate3d(0,20px,0) scale(1.1);
    font-size: 1em;
	border-radius: 100px;
	background-color: #efefef;
}

figure.effect-ruby:hover h2 {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

figure.effect-ruby:hover p {
	opacity: 1;
	-webkit-transform: translate3d(0,0,0) scale(1);
	transform: translate3d(0,0,0) scale(1);
}
.metaslider img{border-radius:10px;}
.doc-list{
	text-align: center;
    width: 200px;
    display: inline-block;
    height: 150px;
}

.details {
	opacity: 0;
	transition: all .3s ease-in-out;
	width: 0;
	/* overflow: hidden; */
	position: fixed;
	font-size: 1em;
	top: 0px;
	left: 0px;
}

/* .details:after{content: "";position:absolute;top:0px;left:33vw;background-color:#efefef;opacity:0.3;width:67vw;height:100vh;z-index: -1;} */

.details.open {
	background-color: rgba(255,255,255,0.97);
	height: 100vh;
	width: 100vw;	
	color: #3d3d3d;
	z-index: 9999;
	box-sizing: border-box;
	overflow: auto;
	opacity: 1;
	padding: 50px;
	/* -webkit-box-shadow: 0px 10px 13px -7px #000000, 5px 5px 15px 5px rgba(0,0,0,0); 
box-shadow: 0px 10px 13px -7px #000000, 5px 5px 15px 5px rgba(0,0,0,0); */
	
}

.details .close{
	position: absolute;
    top: 50px;
    right: 50px;
    /* background-color: #ebeaf0; */
    color: var(--main-color);
    font-size: 1.5em;
    cursor: pointer;
    text-align: center;
    padding-top: 14px;
    -webkit-transition: all 0.33s ease-in-out;
    -moz-transition: all 0.33s ease-in-out;
    -o-transition: all 0.33s ease-in-out;
    transition: all 0.33s ease-in-out;
}

.details .close:hover{color: #ebeaf0;}

.details > .row.row-flex {min-height: 100%;}
.details img{max-width:100%;height:auto;}
.details ul { list-style-type: disc; padding-left: 10px; margin: 0 0px 1em 10px;}

.details .blue-point{color:#ebeaf0;display:inline-block;width:20px;font-weight:900;text-align:center;}
.details a{color: var(--secondary-color);}

.details h2{padding-top:40px;}

/* Team */

#team img{width:100%;border-radius:15px;}

/* .btn-team-details{display:inline-block; padding:.5em; color:#ffffff; background-color:#8cb800; background-color:var(--green); border-radius:.5em;} */

.details{top:20vh;left:27vw;
	opacity:0;
	transition: all .3s ease-in-out;
	height: 0;
	width: 0;
	overflow: hidden;
	position: fixed;
}
.details.open{
	background: var(--fourth-color);
    right: 20vw;
    bottom: 20vh;
    height: 60vh;
    width: 45vw;
    color: var(--third-color);
    z-index: 9999;
    box-sizing: border-box;
    overflow: auto;
    opacity: 1;
    padding: 15px 20px;
    border: 1px solid #eee;
}
.details.open li{padding:5px 0;}

.team-details {top: 5%;left: 5%;}
.team-details.open {
	bottom: 10%;
	height: 90vh;
	right: 10%;
	width: 90vw;
}

.leistungen-details.open{padding:2em 15px 1em;}

.details .close{
	position: absolute;
    top: 0;
    right: 0;
    padding: 15px 15px 15px;
    background-color: var(--secondary-color);
    color: var(--fourth-color);
    cursor: pointer;
}

.details > .row.row-flex {min-height: 100%;}
.details img{max-width:100%;height:auto;}

.team-details > .row.row-flex {min-height: 100%;}
.team-details img{max-width:100%;height:auto;}

#kontakt img{width: 100%;max-width: 1024px;-webkit-transition: all 0.33s ease-in-out;-moz-transition: all 0.33s ease-in-out;-o-transition: all 0.33s ease-in-out;transition: all 0.33s ease-in-out;}
#kontakt img:hover{transform:scale(1.05);-webkit-transition: all 0.33s ease-in-out;-moz-transition: all 0.33s ease-in-out;-o-transition: all 0.33s ease-in-out;transition: all 0.33s ease-in-out;}

/********************************************/
/********** QR-Code *************************/
/********************************************/

#qr-row{align-items: center;}
#qr-row .qr-item + .qr-item{border-top:1px solid var(--secondary-color);}
#qr-row .qr-item::before, #qr-row .howto-flip::before{ background-color:var(--secondary-color); }
#qr-row .qr-item::before {width: 55px;}


/********************************************/
/********** NEWS ****************************/
/********************************************/

#content #staude_gesundheits_suche {
    background-color: transparent;
    
}

#content #staude_search_header {
    height: 100px;
	background-color: transparent;
	box-shadow: 0 .2em .2em rgba(33,33,33,.0);
}

#content #staude_search_bar {
    left: 4%;
    width: 92%;
    height: 50px;

}

#content #staude_btn_search {   
    float: right;
    height: 100%;
    margin: 0;
    padding: 0;
    width: 21.58%;
	color: #324c3b;
	text-transform: uppercase;
	border:1px solid transparent;
	background-color: transparent;
	border: 1px solid var(--main-color);	
	-webkit-transition: all 0.33s ease-in-out;
	-moz-transition: all 0.33s ease-in-out;
	-o-transition: all 0.33s ease-in-out;
	transition: all 0.33s ease-in-out;
	text-decoration: none;
	background: linear-gradient( to bottom,transparent,transparent 0%,transparent 0% );
	cursor: pointer;
}

#content .gesundheitssuche.matches {
    background-color: transparent;
    padding: 1em;
    box-shadow: .2em .2em .2em rgba(33,33,33,.0);
    width: 92%;
    box-sizing: border-box;
    margin: 0 auto;
    position: relative;
}

#content #staude_search_wrapper .matches .rss-title a {
    color: var(--main-color);
    text-decoration: none;
	font-size: 1.2em;
	font-weight:400;
}

#content #staude_search_wrapper .rss-item{padding-top:15px;margin-bottom:15px;border-bottom:1px solid #efefef;}

#content #staude_search_header .deko {
    height: 18%;
    width: 92.2%;
    position: absolute;
    bottom: 0;
    left: 3.9%;
    box-sizing: border-box;
    border-top: 0px solid;
        border-top-color: currentcolor;
    border-left: 0px solid;
        border-left-color: currentcolor;
    border-right: 0px solid;
        border-right-color: currentcolor;
    border-color: #999;
        border-bottom-color: rgb(153, 153, 153);
    background-color: transparent;
    border-bottom: 0;
    font-weight: 700;
    font-size: .85em;
    line-height: 2.5em;
    text-align: center;
    z-index: -1;
}


#content #staude_btn_search:hover {   
	color:var(--main-color);	
	border: 1px solid var(--main-color);
	background-color: transparent;
	}

#content #staude_search_image { display: none; }



#content #staude_gesundheits_suche {
    background-color: transparent;
	    font-family: 'Livvic', sans-serif;
}


/* Aktuelles */
#content.category { overflow: auto; padding: 20px 20px 0; }
#content.post-detail { overflow: auto; padding: 20px 20px 0; }
#content .post-content h1{ font-size: 2em; }
#content .post-content h2{ font-size: 1.5em; }
#content .post-content h3{ font-size: 1.17em; }
#content .post-content h4{ font-size: 1.33em; }
#content .post-content h5{ font-size: 0.83em; }
#content .post-content h6{ font-size: 0.67em; }
#content .post-content h7{ font-size: 0.67em; }
#content .post-content h8{ font-size: 0.67em; }
#content .post-content h9{ font-size: 0.67em; }

/** Leere-Seite wie Popup */
#content.empty { background: none; height: auto; }

#sitemap{}
#content.sitemap ul{
	list-style-type: disc;
	padding-left: 2em;
}

#footer-a {	
	clear:both;	
	padding: 50px 0px;
	color: #fff;	
	width:100%;
	max-width:100%;
	background-color: var(--main-color);
	position:relative;
	font-size:0.9em;
}

.page-id-2932 #footer-a, .page-id-2951 #footer-a{display:none;}

#footer-a::before{
	content: '';
    background-image: url(images/footer-waves.png);
    height: 22px;
    width: 100%;
    position: absolute;
    z-index: 20;
    top: -11px;
}

#footer-a h6{font-size:1.2em; font-family: 'Livvic', sans-serif;color: #fff;text-transform: uppercase;}

#footer-a .icon-phone:before, #footer-a .icon-location:before, #footer-a .icon-mail:before, #footer-a .icon-fax:before{background-color: #fff;}

.trennstrich{border-top: 1px solid #fff;padding-top: 20px;margin-top:20px;}

#footer-b {	
	clear:both;		
	overflow:hidden;
	width:100%;
	max-width:100%;
	padding: 25px 0px 0px 0px;
	position: relative;
	background-color: var(--third-color);
	border-top: 1px solid #efefef;
}

#footer-b a, #footer-a a{color: #fff;}
#footer-b a:hover, #footer-a a:hover{color: var(--main-color);}
#social_icons a{color:#fff;}

.footer-kontakt{display:inline-block;width:45px;} 

#nav_footer{ float:right; }
#nav_footer > li.menu-item{ display: inline-block; }

#footer-car-wrapper{width:100%;max-width:100%;overflow:hidden;}


#footer-car{
	max-width:500px;
	width:100%;
	height:auto;
	margin-top:35px;
	position:relative;
	bottom:-5px;
	animation-name: drive;
	animation: drive 18s infinite;
	animation-timing-function: linear;
	left: -500px;
	}

@keyframes drive {
	from {left: -500px;}
	to {left: calc(100vw + 500px);}
}


#social_icons{ margin-top: 5px; }

@media( max-width: 767px ) {
#social_icons {margin: 25px auto;display: inline-block;}
}

@media( min-width: 768px ) {
#social_icons {margin: 25px auto;display: inline-block;}
}

@media( min-width: 992px ) {
#social_icons {margin: 5px 0px;display: inline-block;}
}

@media( min-width: 1200px ) {
#social_icons {margin: 5px 0px;display: inline-block;}
}

/** Kontaktformular **/
div.wpcf7 .wpcf7-form label {
	cursor: pointer;
    vertical-align: top;
    display: inline-block;
}
#kontaktformular {
    margin: auto;
}
#kontaktformular .wpcf7 .wpcf7-form label { width: 10em; }

#vorbestellformular span.vorbestell-label{
     display: inline-block;
	 vertical-align:middle;
}
#vorbestellformular span.vorbestell-label.left{ width: 85px; }
#vorbestellformular span.vorbestell-label.right{
    width: 75px;
    margin-left: 10px;
}

#content div.wpcf7 .wpcf7-form label span{
	/* color: #ffffff; */
}

.section-content div.wpcf7 input.wpcf7-text ,
#kontaktformular input.wpcf7-text ,
.section-content div.wpcf7 input.wpcf7-captchar,
#kontaktformular input.wpcf7-captchar,
#kontaktformular select.wpcf7-form-control {
	border: 1px solid var(--main-color);
	background-color: #efefef;
	color:var(--third-color);
	padding: 15px;
	min-height: 40px;
	width: 100%;
	/* font-family: 'Exo', sans-serif; */
	box-sizing: border-box;
	font-size: 11pt;
	font-size:1em;
	font-family: 'Livvic', sans-serif;
		
}
#kontaktformular input.wpcf7-text ,
#kontaktformular input.wpcf7-captchar { width: 100%; }
#vorbestellformular span.vorbestell-fields{ vertical-align: middle; }
#vorbestellformular span.vorbestell-fields input.wpcf7-text{ width: 170px;}
.section-content div.wpcf7 textarea.wpcf7-textarea,
#kontaktformular textarea.wpcf7-textarea {
    border: 1px solid var(--main-color);
    background-color: #efefef;
	color:var(--main-color);

    padding: 15px;
    min-height: 80px;
    /*	font-family: sans-serif;*/
    box-sizing: border-box;
	transition: background-color ease-in-out .3s;
    font-size:1em;
	    font-family: 'Livvic', sans-serif;
	width:100%;
}
.section-content div.wpcf7 input.wpcf7-text:focus, 
.section-content div.wpcf7 textarea.wpcf7-textarea:focus,
.section-content div.wpcf7 input.wpcf7-captchar:focus,
#kontaktformular input.wpcf7-text:focus, 
#kontaktformular textarea.wpcf7-textarea:focus,
#kontaktformular input.wpcf7-captchar:focus
 {
   background-color: #f7faec;
   transition: background-color ease-in-out .3s;
    outline: 0px;
    border: 1px solid #fff;
    box-shadow: 0em 0em .3em #fff;
}
/* .wpcf7 input.wpcf7-text:focus,
.wpcf7 input.wpcf7-textarea:focus,
.wpcf7 input.wpcf7-captchar:focus{outline: 0px;} */
#kontaktformular .wpcf7-form-control.wpcf7-submit:hover, input.wpcf7-form-control.wpcf7-submit:focus,input.wpcf7-form-control.wpcf7-submit:active {
	background-position: 100% 0;
    moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

#kontaktformular .wpcf7-form-control.wpcf7-submit {
	background-image: linear-gradient(to right, var(--main-color), var(--secondary-color));
    box-shadow: 0 0px 5px 0 rgba(0,0,0, 0.2);
    width: 100%;
    font-size: 1em;
    color: #fff;
        font-family: 'Livvic', sans-serif;
    cursor: pointer;
    margin: 10px 0;
    text-align: center;
    border: none;
    background-size: 300% 100%;
    font-weight: 300;
    border: 1px solid #ffffff;
    max-width: 300px;
    display: inline-block;
    padding: 10px;
    moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

/** Vorbestellformular - Produkte **/
#produktliste .removeProduct{
	background: transparent url("https://cdn.staude.info/themes/images/delete-icon.png" ) no-repeat center center;
	display: inline-block;
	height: 16px;
	margin-left: 8px;
	width: 16px;
}

#content .slide .caption{ font-size: 13px; }

#gmapoverlay{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;z-index:2;}
#gmapoverlay.hidden{display:none;}

/** Aufklappbares MenÃ¼**/
.flipper .panel, .flipper .flip { padding:5px; text-align:left;border:1px solid #dadada;background-color:#efefef;margin-bottom:10px; }
.flipper .flip {
	background-image: url( 'images/btn-open.png' );
	background-repeat: no-repeat;
	background-position: 5px 50%;
	padding-left: 40px;
	color: #000;
	border:1px solid #dadada;
	background-color:transparent;
	
}
.flipper .flip:hover { cursor: pointer; }
.flipper .flip.open { background-image: url( 'images/btn-close.png' ); }
.flipper .panel { display:none; padding:1em; }.fb-like iframe {max-width:none;}

#content .flipper h3{font-size:1em;}

/*
<div class="flipper"><h3 class="flip"></h3>
<div class="panel">

</div></div>
*/

.btn-mutter{display:none;padding:10px 15px; background-color:var(--main-color);color:#fff;margin-top:10px;text-decoration:none;}
.parent-pageid-756 .btn-mutter{display:inline-block;}

.blue-box{background-color:var(--main-color);padding:25px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;color:#fff;text-align:center;}

#content .blue-box h3{color:#fff;    font-family: 'Livvic', sans-serif;font-weight:700;font-size:2em;}

.hide-xs{display:block;}
.hide-sm{display:block;}
.hide-md{display:block;}
.hide-lg{display:block;}

.show-xs{display:none;}
.show-sm{display:none;}
.show-md{display:none;}
.show-lg{display:none;}

@media( max-width: 500px ) {
.img-box {min-height: 200px;}
}

@media( max-width: 767px ) {
	#nav_oben {display:none;}
	.slicknav_menu { display: block; }
	
	#site-content {padding-top: 150px;}
	#footer-b{padding-bottom:80px;}
	#navigation .menu-item-2909, #navigation .menu-item-2908, #navigation .menu-item-2910, #navigation .menu-item-2899{display:none;}
	.details.open{height:100vh;top: 0;}
	
	.start-small{padding-top:100px;}

	#content h1 {font-size: 1.5em;}
	#content h2 {font-size: 1.5em;}
	#content h3 {font-size: 1.4em;}
	#content h4 {font-size: 1.3em;}
	#content h5 {font-size: 1.2em;}
	#content h6 {font-size: 1.1em;}
	
	.hide-xs{display:none;}
	.hide-sm{display:none;}
	.hide-md{display:none;}
	.hide-lg{display:none;}

	.show-xs{display:block;}
	.show-sm{display:block;}
	.show-md{display:block;}
	.show-lg{display:block;}
	
	/* .btn-kontakt{display: none;} */
	.col-lg-offset-45{margin-left: 0%;}
}

@media( min-width: 768px ) {
	.slicknav_menu { display: block; } 
	#nav_oben {display:none;}

	#content h1 {font-size: 1.5em;}
	#content h2 {font-size: 1.5em;}
	#content h3 {font-size: 1.4em;}
	#content h4 {font-size: 1.2em;}
	#content h5 {font-size: 1.2em;}
	#content h6 {font-size: 1.1em;}
	
	.hide-xs{display:block;}
	.hide-sm{display:none;}
	.hide-md{display:none;}
	.hide-lg{display:none;}

	.show-xs{display:none;}
	.show-sm{display:block;}
	.show-md{display:block;}
	.show-lg{display:block;}
	
	.btn-kontakt{display: inline-block;}
	.col-lg-offset-45{margin-left: 0%;}
}

@media( max-width: 991px ) {
	.leistung-content{padding-right:0px;}
	.metaslider.ms-theme-outline .flexslider ol.flex-control-nav:not(.flex-control-thumbs) li a, .metaslider.ms-theme-outline ul.rslides_tabs li a, .metaslider.ms-theme-outline div.slider-wrapper .nivo-controlNav:not(.nivo-thumbs-enabled) a, .metaslider.ms-theme-outline .coin-slider .cs-buttons a{display:none !important;}
	#home{display:none;}
}

@media( min-width: 992px ) {
	.slicknav_menu { display: block; } 
	#nav_oben {display:none;}
	
	#content h1 {font-size: 1.75em;}
	#content h2 {font-size: 1.75em;}
	#content h3 {font-size: 1.6em;}
	#content h4 {font-size: 1.3em;}
	#content h5 {font-size: 1.33em;}
	#content h6 {font-size: 1.25em;}
	
	.hide-xs{display:block;}
	.hide-sm{display:block;}
	.hide-md{display:none;}
	.hide-lg{display:none;}

	.show-xs{display:none;}
	.show-sm{display:none;}
	.show-md{display:block;}
	.show-lg{display:block;}
	
	.btn-kontakt{display: inline-block;}
	.col-lg-offset-45{margin-left: 12.5%;}
}

@media( max-width: 1199px ) {
	.details{left:0;}
	.details.open{width:100vw;}
}

@media( min-width: 1200px ) {
	.slicknav_menu { display: none; } 
	#nav_oben {display:inline-block;}
	
	ul.kontakt li {display:inline-block;}
	
	#content h1 {font-size: 2em;}
	#content h2 {font-size: 1.8em;}
	#content h3 {font-size: 1.6em;}
	#content h4 {font-size: 1.3em;}
	#content h5 {font-size: 1.33em;}
	#content h6 {font-size: 1.25em;}
	
	.hide-xs{display:block;}
	.hide-sm{display:block;}
	.hide-md{display:block;}
	.hide-lg{display:none;}

	.show-xs{display:none;}
	.show-sm{display:none;}
	.show-md{display:none;}
	.show-lg{display:block;}
	
	.btn-kontakt{display: inline-block;}
	.col-lg-offset-45{margin-left: 12.5%;}
}

ul.list.download-1 li,
ul.list.download-2 li,
ul.list.download-3 li {
  padding: 0px 0px 0px calc(25px * 2);
  cursor: pointer;
  position: relative;
}

ul.list.download-1 li:after,
ul.list.download-1 li:before,
ul.list.download-2 li:after,
ul.list.download-2 li:before,
ul.list.download-3 li:after,
ul.list.download-3 li:before {
  content: "";
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
  display: block;
  background-color: var(--main-color);
  width: 25px;
  height: 25px;
  top: 2px;
  left: 0;
  position: absolute;
}

ul.list.download-1 li:hover:before,
ul.list.download-2 li:hover:before,
ul.list.download-3 li:hover:before {
  animation: downloads 1s infinite;
}

ul.list.download-1 li:after {
  -webkit-mask-image: url("https://cdn.staude.info/css/icons/icon-download-1.svg");
  mask-image: url("https://cdn.staude.info/css/icons/icon-download-1.svg");
}

ul.list.download-1 li:before {
  -webkit-mask-image: url("https://cdn.staude.info/css/icons/icon-download-1-1.svg");
  mask-image: url("https://cdn.staude.info/css/icons/icon-download-1-1.svg");
}

ul.list.download-2 li:after {
  -webkit-mask-image: url("https://cdn.staude.info/css/icons/icon-download-2.svg");
  mask-image: url("https://cdn.staude.info/css/icons/icon-download-2.svg");
}

ul.list.download-2 li:before {
  -webkit-mask-image: url("https://cdn.staude.info/css/icons/icon-download-2-1.svg");
  mask-image: url("https://cdn.staude.info/css/icons/icon-download-2-1.svg");
}

ul.list.download-3 li:after {
  -webkit-mask-image: url("https://cdn.staude.info/css/icons/icon-download-3.svg");
  mask-image: url("https://cdn.staude.info/css/icons/icon-download-3.svg");
}

ul.list.download-3 li:before {
  -webkit-mask-image: url("https://cdn.staude.info/css/icons/icon-download-3-1.svg");
  mask-image: url("https://cdn.staude.info/css/icons/icon-download-3-1.svg");
}
ul.list {
    margin: 0 0 25px;
    padding: 0;
    list-style-type: none;
    text-decoration: none;
    border: medium;
    outline:medium
}

ul.list li {
    margin: 0 0 5px;
    padding: 2px 0 5px 30px;
    position:relative
}

ul.list li::after {
    content: '';
    background-color: var(--main-color);
    -webkit-mask-size: contain;
    mask-size: contain;
    width: 15px;
    height: 15px;
    display: inline-block;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center center;
    mask-position: center center;
    vertical-align: middle;
    position: absolute;
    top: 7px;
    left:0
}

ul.list.arrow-1 li::after {
    -webkit-mask-image: url(https://cdn.staude.info/css/icons/icon-arrow-1.svg);
    mask-image:url(https://cdn.staude.info/css/icons/icon-arrow-1.svg)
}

@keyframes downloads {
  0% {
    top: -2px;
    opacity: 1;
  }

  50% {
    top: 4px;
    opacity: 0.5;
  }

  100% {
    top: -2px;
    opacity: 1;
  }
}
.btn-kontakt {
    position: fixed;
    width: 140px;
    height: 105px;
    background-color: var(--main-color);
    border: 3px solid #fff;
    bottom: 75px;
    right: 5px;
    border-radius: 10%;
    z-index: 99999;
    overflow: hidden;
    text-align: center;
    color: #fff!important;
    padding-top: 20px;
    font-size: 0.9em;
	}

.btn-kontakt:hover {
	overflow: visible;
	
}

.btn-kontakt::before {
    content: '';
    background-color: #fff;
    width: 40px;
    height: 40px;
    display: inline-block;
    -webkit-mask-position: center center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    vertical-align: middle;
    position: absolute;
    top: 60px;
    left: calc(50% - 20px);
    -webkit-mask-image: url(https://cdn.staude.info/css/icons/icon-outline-calendar.svg);
    -webkit-transition: all 0.33s ease-in-out;
    -moz-transition: all 0.33s ease-in-out;
    transition: all 0.33s ease-in-out;
    transform: rotate(0deg);

}



.btn-kontakt:hover::before {
	transform: rotate(360deg);
}

.btn-kontakt:hover::after {
	transform: translateX(0px);
	opacity: 1;
	background-color: var(--main-color);
}