html *{font-size:100%} /* Default Font Size, 16px */


:root {
--main-ci-color: #2694c7;
--main-hover-color: #2c7fa5;
--second-ci-color: #FFDD00;
--third-ci-color: #BAD5F0;
--light-ci-color: ;
--gray-ci-color: ;

--main-ci-color: #095f8d;
--second-ci-color: #36a7d9;
--third-ci-color: ;
--dark-ci-color: #0f3a54;
--light-ci-color: #e0f2f9;
--gray-ci-color: #e1e7ea;


}




* {margin:0; padding:0;}
.ym-grid{display:table; width:100%; table-layout:fixed; list-style-type:none; padding-left:0; padding-right:0;margin-left:0;margin-right:0}
.ym-gl{float:left;margin:0}
.ym-gr{float:right;margin:0}
.ym-center{float:left;margin: 0;padding:0;}
.ym-g10{width:10%}
.ym-g12{width:12.5%}
.ym-g20{width:20%}
.ym-g25{width:25%}
.ym-g30{width:30%}
.ym-g33{width:33.333%}
.ym-g37{width:37.5%}
.ym-g40{width:40%}
.ym-g45{width:45%}
.ym-g50{width:50%}
.ym-g55{width:55%}
.ym-g60{width:60%}
.ym-g66{width:66.666%}
.ym-g70{width:70%}
.ym-g75{width:75%}
.ym-g80{width:80%}
.ym-g90{width:90%}

.ym-gbox{padding:0 10px}
.ym-gbox-left{padding:0 20px 0 0; }
.ym-gbox-right{padding:0 0 0 20px;}

.ym-gbox-0 {padding:0; border-top: solid 0px #f90;}
.ym-gbox-1 {padding:0 15px 0 15px; border-top: solid 0px #f90;}
.ym-gbox-2 {padding:0 15px 0 15px; border-top: solid 0px #ffcc00;}
.ym-gbox-3 {padding:0 15px 0 15px; border-top: solid 0px #ffcc00;}

.ym-gbox-index-links{padding:0 100px 0 10px}

.ym-innen-g25 {width:25%}
.ym-innen-g75 {width:75%}
.ym-innen-left-box{padding: 0 50px 0 0;}
.ym-innen-right-box{padding: 0 0 0 75px;}



/* #####################   WRAPPER UND WBOX ############################################## */
.ym-wrapper{text-align:left; margin:0 auto; padding: 0 10px; max-width:1200px; border: solid 0px #0f0;}

@media (min-width: 1600px) {  
.ym-wrapper{text-align:left; margin:0 auto; max-width:1100px;}
.ym-wrapper-footer{text-align:left;margin:0 auto; padding:25px 10px 0px 10px;  max-width:1300px}
}


.ym-wbox{padding:35px 0 0 0; border: solid 0px #f90;}
@media screen and (max-width:1024px){.ym-wbox{padding: 15px 0 50px 0;}}
@media screen and (max-width:740px){.ym-wbox{padding: 5px 0 50px 0;}}
@media screen and (max-width:600px){.ym-wbox{padding: 0px 0 50px 0;}}


.ym-wbox:first-child{padding:0px 0 0 0; border: solid 0px #f90;}
@media screen and (max-width:1024px){.ym-wbox:first-child{padding: 0px 0 50px 0;}}
@media screen and (max-width:740px){.ym-wbox:first-child{padding: 0px 0 50px 0;}}
@media screen and (max-width:600px){.ym-wbox:first-child{padding: 0px 0 50px 0;}}



body{font-family:'Open Sans','Arial', sans-serif; font-display: swap; color:#435264; -webkit-text-size-adjust:100%; margin: 0; padding: 0; }

/* ##################   Silbentrennung aktiv   ###################################### */

body { -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; }
.nonehyphens { -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; hyphens: none; }


/* ##################   M A I N   Einheitlicher Abstand nach Bild oder Slider   ###################################### */

#main {border-top: solid 3px #eee; padding-top:25px; border: solid 0px #f90;}
@media screen and (max-width:1400px){#main {border-top: solid 0px #eee; padding-top:20px;}}
@media screen and (max-width:1024px){#main {border-top: solid 0px #eee;}}
@media screen and (max-width:740px){#main {border-top: solid 0px #eee;}}
@media screen and (max-width:600px){#main {border-top: solid 0px #eee;}}
@media screen and (max-width:480px){#main {border-top: solid 0px #eee;}}

ul,ol,dl{margin:0;padding:0;}

h1,h2,h3,h4,h5,h6{font-family: 'Open Sans', Arial,Helvetica,sans-serif; font-display: swap;
	font-weight:300;
	color:#435264;
	margin:0;
	letter-spacing:0.0em;
	border-top: solid 0px #f90;
	border-bottom: solid 0px #0000CD;	
	}
	


h1 { font-size: 40px; font-size: 2rem;	 line-height: 1.3; margin: 3rem 0 1.2rem 0;   /* 2.5rem */} /* 40/16 = 2.5 */ 
h2 { font-size: 32px; font-size: 1.8rem; line-height: 1.3; margin: 2.5rem 0 1.2rem 0;  /* 2rem */} /* 32/16 = 2 */
h3 { font-size: 24px; font-size: 1.5rem; line-height: 1.3; margin: 2rem 0 1.2rem 0;  /* 1.5rem */} /* 24/16 = 1.5 */
h4 { font-size: 22px; font-size: 1.4rem; line-height: 1.3; margin: 1.8rem 0 1.2rem 0; /* 1.4rem */} /* 22,4/16 = 1.4 */
h5 { font-size: 19px; font-size: 1.2rem; line-height: 1.3; margin: 1.7rem 0 1.2rem 0;  /* 1.2rem */} /* 19,2/16 = 1.2 */
h6 { font-size: 18px; font-size: 1.1rem; line-height: 1.3; margin: 1.6rem 0 1.2rem 0;  /* 1.1rem */} /* 17,6/16 = 1.1 */

p  { font-size: 17.6px; font-size: 1.1rem; line-height: 1.55; margin:0 0 1.2rem 0;} /* 16/16 = 1 */

hr{color:#fff;background:transparent;margin:0 0 .75em 0;padding:0 0 .75em 0;border:0;border-bottom:1px #e7e7e7 solid}

* h1 div, h1 div{ font-size: 0.73em; line-height:130%; margin:15px 0 0 0;}  * h1 span, h1 span{ font-size: 0.73em; line-height:130%; margin:15px 0 0 0;}

/* Reduzierung nur der ersten H1 Überschrift im Abstand nach oben. Farbe f90 nur um das zu symbolisieren */
h1:first-child { margin:0 0 2rem 0; padding-top:2rem; border-top: 0px solid #000;/*background-color: lime;*/ }
h2.nachhzeile, h3.nachhzeile {margin:0 0 1.2rem 0;  /* Margin-top auf Null gesetzt für Kombi mit H1 */} 
.textcenter-600left {text-align:center}
@media screen and (max-width:600px){.textcenter-600left{text-align:left; padding:0 0.6rem 0 0.6rem!important;}}

@media screen and (max-width:1024px){h1{font-size: 32px; font-size: 2rem; line-height:1.25;} h1:first-child { padding:0.7rem 0 0.7rem 0; } h2,h3,h4,h5,h6{font-size: 1.6rem; line-height:1.25;} p{font-size: 18px; font-size: 1.1rem;}}
@media screen and (max-width:740px){h1{font-size: 27px; font-size: 1.7rem; line-height:1.25; margin: 2rem 0 0.5rem 0;} h1:first-child { margin-top:0rem; padding:0 0 0.7rem 0; /*color:#f90; background-color: lime;*/ } h2{font-size: 1.5rem; line-height:1.25; margin:2.5rem 0 0.5rem 0;} h3,h4,h5,h6{font-size: 1.35rem; line-height:1.34; margin:2.5rem 0 0.5rem 0;} p{font-size: 17px; font-size: 1.05rem; line-height: 1.65; } }
@media screen and (max-width:600px){h1{font-size: 27px; font-size: 1.7rem; line-height:1.25; margin: 2rem 0 0.5rem 0;} h1:first-child { margin-top:0.3rem; margin-bottom:0.5rem; padding:0 0 0.7rem 0; /*color:#f90; background-color: lime;*/ } h2{font-size: 1.5rem; line-height:1.25; margin:2.5rem 0 0.5rem 0;} h3,h4,h5,h6{font-size: 1.35rem; line-height:1.34; margin:2.5rem 0 0.5rem 0;} p{font-size: 17px; font-size: 1.05rem; line-height: 1.65; } }
@media screen and (max-width:480px){h1{font-size: 24px; font-size: 1.5rem; line-height:1.25; margin: 3rem 0 0.5rem 0;} h1:first-child { margin-top:0.3rem; padding:0rem; /* color:#f90; background-color: lime;*/ } h2{font-size: 1.45rem; line-height:1.25; margin:2.5rem 0 0.5rem 0;} h3,h4,h5,h6{font-size: 1.3rem; line-height:1.34; margin:2.5rem 0 0.5rem 0;} p{font-size: 16px; font-size: 1rem; line-height: 1.6; }}


small {font-size: 0.7rem;}
small2 {font-size: 1.7rem;}

a {color: #666; text-decoration: none}
a:hover {color: #333}

img {display: block}
.bordered {border: solid 1px #999999}


.flexible {max-width: 100%; height: auto}
.flexible2, .flexible100 {width: 100%; height: auto}

.display-inline {
  display: inline;
}

.ym-clearfix:before{content:"";display:table}
.ym-clearfix:after{clear:both;content:".";display:block;font-size:0;height:0;visibility:hidden}

.bigger {font-size: 180%!important}

/* ###################### B E G I N N HEADER UND LOGO PC und HEADER PC SMALLER ######################### */


.grid-container {display: grid;}

.grid-50-50 {grid-template-columns: 1fr 1fr;}
.grid-55-45 {grid-template-columns: 55% 45%;}
.grid-40-60 {grid-template-columns: 40% 60%;}
.grid-30-70 {grid-template-columns: 30% 70%;}
.grid-20-80 {grid-template-columns: 20% 80%;}
.grid-15-85 {grid-template-columns: 15% 85%;}
.grid-10-90 {grid-template-columns: 10% 90%;}

.grid-ki-block {grid-template-columns: 85px 1fr;}

.grid-60-40 {grid-template-columns: 60% 40%;}
.grid-70-30 {grid-template-columns: 70% 30%;}
.grid-80-80 {grid-template-columns: 80% 20%;}

.grid-20-60-20 {grid-template-columns: 20% 60% 20%;}
.grid-25-50-25 {grid-template-columns: 25% 50% 25%;}
.grid-25-50-25-header {grid-template-columns: 25% 50% 25%;}
.grid-25-40-35-header {grid-template-columns: 25% 40% 35%}


.grid-40-20-20-20 {grid-template-columns: 40% 20% 20% 20%;}
.grid-footer-4er {grid-template-columns: 30% 1fr 1fr 1fr;}

.grid-3er {grid-template-columns: 1fr 1fr 1fr;}
.grid-4er {grid-template-columns: 1fr 1fr 1fr 1fr;}

.grid-3er-no {grid-template-columns: 1fr 1fr 1fr;}
.grid-4er-no {grid-template-columns: 1fr 1fr 1fr 1fr;}
@media screen and (max-width:1024px){
.grid-4er {grid-template-columns: 1fr 1fr;}

.grid-25-50-25-header {grid-template-columns: 1fr 1fr;}
.grid-footer-4er {grid-template-columns: 1fr 1fr;}

}

@media screen and (max-width:960px){
.grid-50-50 {grid-template-columns: 1fr;}
.grid-55-45 {grid-template-columns: 1fr;}
.grid-40-60 {grid-template-columns: 1fr;}
.grid-30-70 {grid-template-columns: 1fr;}
.grid-20-80 {grid-template-columns: 1fr;}

.grid-60-40 {grid-template-columns: 1fr;}
.grid-70-30 {grid-template-columns: 1fr;}
.grid-80-80 {grid-template-columns: 1fr;}

.grid-3er {grid-template-columns: 1fr;}

.grid-20-60-20 {grid-template-columns: 1fr;}
.grid-25-50-25 {grid-template-columns: 1fr;}
.grid-25-40-35 {grid-template-columns: 1fr;}

.grid-40-20-20-20 {grid-template-columns: 1fr;}
}


@media screen and (max-width:740px){
.grid-4er {grid-template-columns: 1fr;}

.grid-ki-block {grid-template-columns: 60px 1fr;}
}


@media screen and (max-width:520px){
.grid-footer-4er {grid-template-columns: 1fr;}

}
.gap-10 {gap: 10px;}
.gap-15 {gap: 15px;}
.gap-20 {gap: 20px;}
.gap-25 {gap: 25px;}
.gap-30 {gap: 30px;}
.gap-40 {gap: 40px;}
.gap-50 {gap: 50px;}
.gap-75 {gap: 75px;}
.gap-100 {gap: 100px;}
.gap-150 {gap: 150px;}

.gap-leistungen-block {gap: 35px}






header {position: fixed;
	background: #fff;
	width: 100%;
	z-index:9999;
	padding: 0;
	height: 112px;
	box-shadow: 0px 2px 5px rgba(0,0,0,0.25);
	}

@media (min-width: 1024px) {
header nav {
    position: absolute; 
    bottom: 0;          
    left: 0;
    right: 0;
}
}	




.header-logo{
	max-width: 250px;
	padding: 0;
	margin: 5px auto 0;
	}

@media (max-width: 1024px) {

header {position: absolute;
	height: 100px;
	}

.header-logo{
	max-width: 500px;
	padding: 0;
	margin: 20px 5% 0;
	}


}


.header-social {
	text-align: center;
	border: solid 0px #f90;
	margin: 5px 0 0 0;
	}
	
	
@media (max-width: 1024px) {
.header-social {
	display: none;
	}
}

	
.header-social ul {
	list-style: none;
	display: inline;
	margin: 0;
	padding: 0;
	}
	
	
.header-social ul li {
	display: inline-block;
	list-style-type: none;
	margin: 0 20px 0 0;
	}

.header-social ul li img{
	width: 25px;
	height: 25px;
	}

.header-social ul li img.spende{
	width: 75px;
	height: 25px;
	}	



.header-logo {
    justify-self: start; /* Inhalt linksbündig in der linken Spalte */
}

.header-social {
    justify-self: end; /* Inhalt rechtsbündig in der rechten Spalte */
}

/* Optional mittlere Spalte zentriert */
.grid-25-40-35-header > div:nth-child(2) {
    justify-self: center;
}







.intro-zeile {
	display: none;
	}

@media screen and (max-width:1024px){

.intro-zeile {
	display: block;
	background: var(--second-ci-color);
	color: #fff;
	padding: 2px 0;
	width: 100%;
	margin: 0 auto;
	font-size: 1rem;
	text-align: center;
	}

.intro-zeile a{
	color: #fff;
	margin: 0 15px;
	}

.intro-zeile img{
	display: inline-block;
	width: 20px;
	height: 20px;
	}

.intro-zeile img.spende{
	display: inline-block;
	width: 60px;
	height: 20px;
	}

.intro-zeile a span.icon-facebook-1{
	color: #fff;
	font-size: 1.4rem;
	border: solid 0px #f90;
	margin: 0 15px 0 0;
	}
.intro-zeile a span.icon-instagramm{
	color: #fff;
	font-size: 1.4rem;
	border: solid 0px #f90;
	margin: 0 20px 0 0;
	}

.intro-zeile a span.icon-phone{
	color: #fff;
	font-size: 1.4rem;
	border: solid 0px #f90;
	margin: 0 15px 0 15px;
	}
.intro-zeile a span.icon-mail{
	color: #fff;
	font-size: 1.4rem;
	border: solid 0px #f90;
	margin: 0 15px 0 0;
	}
.icon-tiktok {
	border: solid 0px #f90;
	position: relative;
	top: 4px;
	width: 22px;
	height: 22px; 
	margin: 0 15px 0 0;
	}

.icon-spenden {
	border: solid 0px #f90;
	position: relative;
	top: 4px;
	width: 66px;
	height: 22px; 
	margin: 0 15px 0 0;
	}

}





/*
@media screen and (max-width: 600px) {
  nav, .mobile-menu {
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.3s ease;
  }

  .menu-open nav, .menu-open .mobile-menu {
    visibility: visible;
    opacity: 1;
  }
}
*/



.index-header-abstand {padding-top: 50px;}

@media screen and (max-width:1024px){
.index-header-abstand {padding-top: 50px;}
}




.hero-section {
	position: relative;
	height: 480px;
	overflow: hidden;
	}

.hero-video {
	position: absolute;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center bottom;
	left: 0;
	top: 0;
	z-index: 1;
	}


.hero-content {
	border: solid 0px #f90;
	position: absolute;
	z-index: 99;
  	left: 10%;
  	top: 75px;
  	width: 450px;
  	height: 100%;
	}

@media (max-width: 540px) {

.hero-content {
	position: relative;
  	width: 90%;
  	top: 25px;
	left: unset;
  	margin: 25px;
	}
}

.hero-content-inhalt {
	position: absolute;
	width: 450px;
	height: 210px;
	background-color: rgba(54, 167, 217, 0.34);
	z-index: 3;
	color: #fff;
	padding: 30px 20px;
	box-sizing: border-box;
	border: solid 0px #f00;
	}

@media (max-width: 540px) {
.hero-content-inhalt {
	position: relative;
	width: 100%;
	height: auto;
	background-color: rgba(54, 167, 217, 0.34);
	z-index: 3;
	color: #fff;
	padding: 30px 20px;
	box-sizing: border-box;
	border: solid 0px #f00;
	}
}

.hero-content-inhalt h2 {
	text-align: left;
	color: #fff;
	font-size: 1.35rem;
	line-height: 1.49;
	letter-spacing: 0.06em;
	margin: 0;
	padding: 0;
	font-weight: 500;
	}
	
.hero-content-inhalt h2 span {
	font-weight: 800;
	}
.hero-content-inhalt h2 span.light {
	color: var(--second-ci-color);
	}

.hero-content-inhalt h3 {
	text-align: left;
	color: #fff;
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.154em;
	margin: 0 0 20px 0;
	padding: 0
	}

@media (max-width: 540px) {


.hero-content-inhalt h2 {
	text-align: left;
	color: #fff;
	font-size: 1.2rem;
	line-height: 1.49;
	letter-spacing: 0.06em;
	margin: 0 0 25px 0;
	padding: 0;
	font-weight: 500;
	}
	
.hero-content-inhalt h2 span {
	font-weight: 800;
	}
.hero-content-inhalt h2 span.light {
	color: var(--second-ci-color);
	}

.hero-content-inhalt h3 {
	text-align: left;
	color: #fff;
	font-size: 0.7rem;
	font-weight: 500;
	letter-spacing: 0.154em;
	margin: 0 0 30px 0;
	padding: 0
	}



}




.hero-cta-1 {
	background: var(--second-ci-color);
	color: #fff;
	padding: 5px 10px;
	font-size: 0.9rem;
	font-weight: 400;
	margin: 0 15px 0 0;
	letter-spacing: 0.08em;
	}

.hero-cta-2 {
	background: var(--dark-ci-color);
	color: #fff;
	padding: 5px 10px;
	font-size: 0.9rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	}

.hero-auszeichnung-fixed {
	position: absolute;
	top: -20px;
	right: 30px;
	z-index:99;
	width: 50px;
	height: auto;
	}
.hero-auszeichnung-fixed img {
	width: 75px;
	height: auto;
	}

@media (max-width: 540px) {

.hero-cta-1 {
	padding: 5px 10px;
	font-size: 0.7rem;
	font-weight: 400;
	margin: 0 15px 0 0;
	letter-spacing: 0.08em;
	}

.hero-cta-2 {
	padding: 5px 10px;
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	}

.hero-auszeichnung-fixed {
	position: absolute;
	top: -20px;
	right: 20px;
	z-index:99;
	width: 50px;
	height: auto;
	}
}








.hero-auszeichnungen {
	position: relative;
	top: 210px;
	left: 0;
	border: solid 0px #0f0;
	}

@media (max-width: 540px) {

.hero-auszeichnungen {
	position: relative;
	top: 0;
	left: 0;
	}


}



.test-all-space {
	margin: 15px 0 0 0;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr)); /* Drei exakt gleich breite Spalten */
	gap: 20px; 
	}

.test-all-space > div {
	display: flex;
	align-items: center;
	justify-content: center;
	}

.hero-auszeichnung {
	max-width: 90px;
	height: auto;
	}

@media (max-width: 380px) {
.test-all-space {gap: 6px;}
.hero-auszeichnung {max-width: 60px;}
}


.hero-zeile {
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translate(-50%, 0);
	width: 100%;
	max-width: 1140px;
	background-color: rgba(9, 95, 141, 0.75);
	color: #fff;
	padding: 11px 20px;
	z-index:99;
	text-align: center;
	text-transform: uppercase;
	font-size: 0.8rem;
	font-weight: 400;
	letter-spacing: 0.2em;
	}

@media (max-width: 960px) {

.hero-zeile {
	padding: 11px 20px;
	text-align: center;
	font-size: 0.5rem;
	}

}

.grid-container-hero-zeile  {
	display: flex;
	gap: 24px;
	flex-direction: row;
	align-items: center; 
	}

.grid-container-hero-zeile > div {
	display: flex;
	align-items: center;
	text-align: center !important;
	flex-grow: 1;
	text-align: center;
	justify-content: center;
	flex-direction: row; 
	gap: 0px;
    }



@media (max-width: 470px) {
  .grid-container-hero-zeile {
    flex-direction: column;
    gap: 16px; /* Optional, etwas weniger Abstand für mobile */
  }
  .grid-container-hero-zeile > div {
    flex: none; /* Volle Breite, siehe unten */
    width: 100%;
  }
}


.hero-zeile-icon {
	width: 20px; /* ggf. passend anpassen */
	height: auto;
	margin: 0 5px 0 0;
	}















.begruessungs-block {}
.begruessungs-block h1{color: var(--main-ci-color);}
.begruessungs-block h2{color: var(--dark-ci-color);  font-size: 2rem; font-weight:400; line-height: 1.3; margin:2rem 0 1.2rem 0; text-transform: uppercase;}
.begruessungs-block h2 span{color: var(--second-ci-color); font-weight: 700}
@media screen and (max-width:1024px){
.begruessungs-block h2{color: var(--dark-ci-color);  font-size: 1.25rem; font-weight:400; line-height: 1.3; margin:2rem 0 1.2rem 0; text-transform: uppercase;}

}


.begruessungs-block p{}
.begruessungs-block p span{}


.leistungs-block {
	margin: 35px 0 0 0;
	}

@media screen and (max-width:1024px){
.leistungs-block {
	margin: 35px 45px 0 45px;
	}
}

@media screen and (max-width:520px){
.leistungs-block {
	margin: 35px 25px 0 25px;
	}
}


.leistungs-feld {
	background: var(--light-ci-color);
	text-align: center;
	padding: 10px 10px 5px 10px;
	position: relative;
	}

.leistungs-feld h2 {
	font-size: 0.94rem;
	margin: 15px 0 0 0;
	font-weight: 700;
	letter-spacing: 0.1em;
	}
	
.leistungs-feld p {
	font-size: 0.65rem;
	margin: 10px 0 0 0;
	font-weight: 400;
	line-height: 1.43;
	}

.leistungs-feld a {
	background: var(--dark-ci-color);
	color: #fff;
	padding: 5px 10px;
	font-size: 0.7em;
	font-weight: 400;
	position: absolute;
	bottom: 15px;
	left: 50%;
	transform: translate(-50%, 0);
	width: max-content;
	}

.leistungs-feld a:hover {
	}

.leistungs-icon {
	margin: -40px auto 0 auto;
	border-radius: 5px;
	width: 50px;
	height: auto;
	}






.cta-block {
	background: #deeffa;
	padding: 15px 0;
	margin: 70px 0;
	}
	
.cta-block-inhalt {
	}

.cta-block-inhalt h2 {
	font-size: 0.9rem;
	letter-spacing: 0.138em;
	margin: 0;
	/*text-align: left;*/
	}

.cta-block-inhalt h2 span{
	font-weight: 700;
	}


.cta-block-inhalt a {
	background: var(--dark-ci-color);
	color: #fff;
	padding: 10px 14px;
	margin: 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: max-content;
	font-weight: 400;
	font-size: 0.75rem;
	letter-spacing: 0.128em;
	text-transform: uppercase;
	gap: 8px; 
	text-decoration: none;
	}

@media screen and (max-width:960px){
	.cta-block-inhalt a {
		padding: 10px 14px;
		margin: 25px auto 0;
		font-size: 0.65rem;
	}
}

@media screen and (max-width:420px){
	.cta-block-inhalt a {
		padding: 10px;
		margin: 25px auto 0;
		width: 90%;
	}
}

.cta-block-inhalt a span {
	font-weight: 700;
}

.cta-block-inhalt a img.cta-block-pfeil {
	width: 20px;
	height: auto;
	flex-shrink: 0;
}




.ki-block {}
.ki-block h2{color: var(--main-ci-color);}
.ki-block h3{color: var(--dark-ci-color);}
.ki-block h3 span.bold500{font-weight: 500}
.ki-block h3 span.light{color: var(--second-ci-color); font-weight: 700}



.ki-block-inhalt {max-width: 1075px; border: solid 0px #f90; margin: 30px auto 0;}

.ki-block-inhalt-header {
	background: rgba(14,57,82,0.86);
	padding: 10px;
	color: #fff;
	font-size: 1.11rem;
	font-weight: 400;
	letter-spacing: 0.128em;
	text-transform: uppercase;
	width: fit-content;
	margin: 0;
	}

.ki-block-inhalt-header span{
	color: var(--second-ci-color);
	font-weight: 700;
	}

@media screen and (max-width:960px){
.ki-block-inhalt-header {
	font-size: 1.1rem;
	margin: 0 auto;
	}
}
@media screen and (max-width:520px){
.ki-block-inhalt-header {
	font-size: 0.95rem;
	margin: 0 auto;
	}
}

.ki-block-inhalt h4 {
	font-size: 1.1rem;
	color: var(--second-ci-color);
	color: #36a7d9;
	color: rgba(54,167,217,0.86);
	text-align: left;
	font-weight: 700;
	margin: 0 0 15px 0;
	}
	
@media screen and (max-width:740px){
.ki-block-inhalt h4 {
	font-size: 1rem;
	margin: 0 0 15px 0;
	}
}

@media screen and (max-width:520px){
.ki-block-inhalt h4 {
	font-size: 0.9rem;
	margin: 0 0 15px 0;
	}
}

.ki-block-inhalt-bild {width: 70px; height: auto;}
@media screen and (max-width:740px){
.ki-block-inhalt-bild {width: 50px; height: auto;}
}
.ki-block-inhalt ul{
	list-style-type: none;
	padding-left: 0;
	}
	
.ki-block-inhalt ul li{
	position: relative;
	padding-left: 30px;
	text-transform: uppercase;
	font-size: 0.63rem;
	letter-spacing: 0.05em;
	font-weight: 600;
	margin: 0 0 10px 0;
	color: rgba(22,69,58,0.8);
	}

.ki-block-inhalt ul li::before{
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 23px;
	height: 23px;
	background-image: url('../bilderpfad/icons/check-blau.png');
	background-size: cover;
	background-repeat: no-repeat;
	}


.ki-block-inhalt-button {
	background: var(--second-ci-color);
	color: #fff;
	padding: 12px 15px;
	display: block;
	width: fit-content;
	margin: 0 0 0 22%;
	text-transform: uppercase;
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.18em;
	}

a.ki-block-inhalt-button:hover{
	color: #fff;
	cursor: pointer;
	}

@media screen and (max-width:960px){
.ki-block-inhalt-button {
	padding: 10px 15px;
	margin: 30px auto 0;
	font-size: 0.85rem;
	}
}





.ki-block-inhalt-bild-gr {
	width: 360px;
	height: auto;
	margin: 0 0 0 20px;}

@media screen and (max-width:960px){
.ki-block-inhalt-bild-gr {
	width: 70%;
	height: auto;
	margin: 25px auto 0;}

}







.vorteile-block-bg {
	background: rgba(222,239,250,0.67);
	margin: 55px 0 0 0;
	padding: 30px 0 10px 0;}

.vorteile-block {
	max-width: 800px;
	margin: 0 auto;
	}
	
.vorteile-block h2 {
	font-size: 1.35rem;
	font-weight: 400;
	letter-spacing: 0.06em;
	margin-top: 0;
	}
	
.vorteile-block h2 span{
	font-weight: 700;
	color: var(--second-ci-color);
	}

.vorteile-block h3{
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.085em;
	color: rgba(9,95,141,0.86);
	}


.vorteile-block-aufzaehlung {
	margin: 10px 0 0 0;
	padding: 0;}

.vorteile-block-aufzaehlung ul{
	list-style-type: none;
	padding-left: 0;
	}
	
.vorteile-block-aufzaehlung ul li{
	position: relative;
	padding-left: 40px;
	text-transform: uppercase;
	font-size: 0.8rem;
	font-weight: 600;
	margin: 0 0 30px 0;
	}

.vorteile-block-aufzaehlung ul li.light::before{
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 23px;
	height: 23px;
	background-image: url('../bilderpfad/icons/check-mark-full-light.png');
	background-size: cover;
	background-repeat: no-repeat;
	}

.vorteile-block-aufzaehlung ul li.dark::before{
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 23px;
	height: 23px;
	background-image: url('../bilderpfad/icons/check-mark-full-dark.png');
	background-size: cover;
	background-repeat: no-repeat;
	}


.vorteile-block-aufzaehlung ul li.light {color: var(--second-ci-color);}
.vorteile-block-aufzaehlung ul li.dark {color: var(--dark-ci-color);}

.vorteile-block-button {
	background: var(--dark-ci-color);
	font-size:0.8rem;
	font-weight: 700;
	letter-spacing: 0.078em;
	color: #fff;
	padding: 15px 25px;
	text-transform: uppercase;
	margin: 10px auto 0;
	display: block;
	width: fit-content;
	}


.cta-mit-bild {
	display: flex;
	align-items: center;
	gap: 12px;
	width: fit-content;
	margin: 0 auto;
}

.cta-pfeil {
	width: 50px;
	height: auto;
}





.aerzteteam-block {
	margin: 55px 0 0 0;
	padding: 30px 0;
	border: solid 1px #f90;
	}
.aerzteteam-block-inhalt {
	max-width: 915px;
	margin: 25px auto 0;
	}
	
.aerzteteam-block h2{
	color: var(--main-ci-color);
	opacity: 0.86;
	}
.aerzteteam-block h3{color: var(--dark-ci-color);}
.aerzteteam-block h3 span{color: var(--second-ci-color); font-weight: 700; opacity: 0.86;}


.aerzteteam-block-dr-ghiassi {position: relative;}
.aerzteteam-block-dr-ghiassi img {margin: 0}
.aerzteteam-block-dr-ghiassi h4{
	color: var(--second-ci-color);
	font-size: 1.3rem;
	font-weight: 700;
	letter-spacing: 0.111em;
	text-align: left
	}
.aerzteteam-block-dr-ghiassi h5{
	text-align: left;
	font-size: 0.95rem;
	font-weight: 600;
	letter-spacing: 0.025em;
	line-height: 2.09;
	}


.aerzteteam-block-aufzaehlung {
	margin:20px 0 0 0;}

.aerzteteam-block-aufzaehlung ul{
	margin: 0 0 0 10px;
	}
	
.aerzteteam-block-aufzaehlung ul li{
	font-size: 1em;
	font-weight: 600;
	letter-spacing: 0.052em;
	line-height: 1.78;
	margin: 0 0 15px 0;
	text-transform: uppercase;
	}
.aerzteteam-block-aufzaehlung ul li span{
	color: var(--second-ci-color);
	font-weight: 700;
	}

.aerzteteam-block-zitat {
	max-width: 915px;
	margin: 25px auto 0;
	font-size: 0.8rem;
	color: #2e789f;
	line-height: 1.94;
	text-transform: uppercase;
	font-weight: 500;
	}



hr.vert {
width: 2px;
min-height: 90%; /* gewünschte Höhe */
border: none;
background: var(--second-ci-color);
opacity: 0.45;
position: absolute;
top:20px;
right: 35px;
}
















footer {
	border-top: solid 2px #000;
	margin: 55px 0 0 0;
	padding: 50px 0 25px 0;
	}


.footer-logo {
	max-width: 220px;
	height: auto;
	margin: 0;
	}

footer h3 {
	font-size: 1rem;
	font-weight: 700;
	margin: 0 0 15px 0;
	padding: 0;
	text-align: left;
	text-transform: none;
	}
	
footer h4 {
	text-align: left;
	font-size: 1rem;
	font-weight: 400;
	margin: 25px auto 0 auto;
	padding: 0;
	text-transform: none;
	}


.footer-links ul {list-style: none;}
.footer-links ul li{
	margin: 0 0 15px 0;
	font-size: 1rem;
	font-weight: 400;
	}


.footer-social {
	text-align: left;
	border: solid 0px #f90;
	margin: 0 0 25px 0;
	}
	
.footer-social ul {
	list-style: none;
	display: inline;
	margin: 0 auto;
	padding: 0;
	border: solid 0px #f90;
	}
	
	
.footer-social ul li {
	display: inline-block;
	list-style-type: none;
	margin: 10px 35px 0 0;
	}

.footer-social ul li img{
	width: 40px;
	height: 40px;
	}



@media screen and (max-width:520px){

.footer-logo {
	max-width: 220px;
	height: auto;
	margin: 0 auto;
	}
	
footer h3 {
	text-align: center;
	}
	
footer h4 {
	text-align: center;
	}


.footer-links ul {list-style: none; margin: 0 0 50px 0;}
.footer-links ul li{
	text-align: center;
	margin: 0 0 15px 0;
	}

.footer-social {
	text-align: center;
	border: solid 0px #f90;
	margin: 0 0 25px 0;
	}

.footer-social ul li {
	display: inline-block;
	list-style-type: none;
	margin: 10px auto;
	}

.footer-social ul li img{
	width: 40px;
	height: 40px;
	margin: 0 10px;
	}

}
















/* ###################### E N D E GRID-CONTAINER, HEADER UND LOGO PC und HEADER PC SMALLER ######################### */



/* ###################### HEADER UND LOGO PC und HEADER PC SMALLER ######################### */
/*
header {width: 100%;
	height: 120px;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 99999;
	background-color: #fff;
	-webkit-transition: height 0.5s;
	-moz-transition: height 0.5s;
	-ms-transition: height 0.5s;
	-o-transition: height 0.5s;
	transition: all 0.5s;
	border: solid 0px #f90;
	box-shadow: 0 3px 11px 2px rgba(0,0,0,0.3);
	border: solid 0px #f90;
	}

header .logo-header {background-image: url("../bilderpfad/logo/bruno-groening-now.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: auto;
	height: 57px; 
	padding: 5px 0 0 0;
	transition: all 0.5s;
	border: solid 0px #f90;
	}

header.smaller .logo-header {
	height: 0;
	margin: 0;
	padding: 0;
	transition: all 0.5s;
	}
	
header.smaller {height: 40px; border: solid 0px #f90;}




.header-login {
	position: absolute;
	top: 0;
	right: 10px;
	border: solid 0px #f90;
	transition: all 0.5s;
	}
.header-login a {color: var(--main-ci-color); font-size: 0.9rem;}
.header-login a:hover {color: var(--main-hover-color); font-size: 0.9rem; text-decoration: underline;}
.header-login a span {color: var(--main-ci-color);font-size: 1.1rem;}

header.smaller .header-login {
	top: -150px;
	}

*/

/* ###################### HEADER UND LOGO M O B I L ####################################### */
/*
.logo-header-mobile {margin: 0px auto 10px auto}

@media screen and (max-width:1024px) {
#mobil-header {height: 85px; background: #fff; z-index: 999999; box-shadow: 0 3px 11px 2px rgba(0,0,0,0.4); position: relative;}
.logo-header-mobile {margin: 5px auto 10px auto;}
}

@media screen and (max-width:640px) {
.logo-header-mobile {width: 400px; height:auto; margin: 5px 0 10px 1%;}
}

@media screen and (max-width:470px) {
.logo-header-mobile {width: 300px; height:auto; margin: 15px 0 10px 1%;}
}

@media screen and (max-width:370px) {
.logo-header-mobile {width: 250px; height:auto; margin: 15px 0 10px 0;}
}

@media screen and (max-width:320px) {
.logo-header-mobile {width: 240px; height:auto;}
}

*/



















































/* ###################### E N D E HEADER ######################### */



/* ###################### ABSTAND SLIDER ZUM BILDANFANG IM HEADER ######################### */

.index-slider-abstand, .kopf-bild {padding:100px 0 0 0;}
/*
@media screen and (max-width:1400px){.index-slider-abstand {padding: 160px 0 0 0;}}
@media screen and (max-width:1100px){.index-slider-abstand {padding: 150px 0 0 0;}}
*/
@media screen and (max-width:1024px){.index-slider-abstand {padding: 50px;}}



/*  WIRD BEI GEÄNDERTER TABLE1 nicht mehr benötigt
.kopf-bild {margin: 190px 0 0 0; width: 100%; border: solid 1px #f90;}
.no-kopf-bild {margin-top: 190px; border-bottom: solid 1px #eee;}

@media screen and (max-width:1400px){.kopf-bild {margin: 180px 0 0 0; z-index:1} .no-kopf-bild {margin-top: 180px; border-bottom: solid 1px #eee;}}
@media screen and (max-width:1300px){.kopf-bild {margin: 180px 0 0 0; z-index:1}}
@media screen and (max-width:1200px){.kopf-bild {margin: 150px 0 0 0; z-index:1} .no-kopf-bild {margin-top: 150px; border-bottom: solid 1px #eee;}}
@media screen and (max-width:1024px){.kopf-bild {margin: 0; z-index:1} .no-kopf-bild {margin-top: 0px; border-bottom: solid 1px #eee;} }
*/




/* ######################     DISPLAY UND DISPLAY NONE     ################################# */

.displaynone1024 {display: block}
.display1024 {display: none}

@media screen and (max-width:1024px){
.displaynone1024 {display: none}
.display1024 {display: block}
}


.displaynone1400 {display: block}
.display1400 {display: none}

@media screen and (max-width:1400px){
.displaynone1400 {display: none}
.display1400 {display: block}
}


.displaynone1150 {display: block}
.display1150 {display: none}

@media screen and (max-width:1150px){
.displaynone1150 {display: none}
.display1150 {display: block}
}


.displaynone960 {display: block}
.display960 {display: none}

@media screen and (max-width:960px){
.displaynone960 {display: none}
.display960 {display: block}
}


.displaynone780 {display: block}
.display780 {display: none}

@media screen and (max-width:780px){
.displaynone780 {display: none}
.display780 {display: block}
}


.displaynone740 {display: block}
.display740 {display: none}

@media screen and (max-width:740px){
.displaynone740 {display: none}
.display740 {display: block}
}


.displaynone740l {display: block}
.display740l {display: none}
@media only screen and (max-width:740px) and (orientation:landscape){
.displaynone740l {display: block; border:10px solid #f90}
.display740l {display: block}
}


.displaynone600 {display: block}
.display600 {display: none}

@media screen and (max-width:600px){
.displaynone600 {display: none}
.display600 {display: block}
}

.displaynone480 {display: block}
.display480 {display: none}

@media screen and (max-width:480px){
.displaynone480 {display: none}
.display480 {display: block}
}


.displaynone360 {display: block}
.display360 {display: none}

@media screen and (max-width:360px){
.displaynone360 {display: none}
.display360 {display: block}
}


.displaynone320-inline {display: inline-block}
.display320-inline {display: none}

@media screen and (max-width:320px){
.displaynone320-inline {display: none}
.display320-inline {display: inline-block}
}




/* ######################    F O O T E R    ######################### */


footer{color: #fff!important; 
	background: #444;
	padding: 35px 0 20px 0;
	margin: 0;
	position: relative;
	z-index:5;
	}


footer p {color: #fff!important}
footer p a{color: #fff!important}
footer a{color: #fff!important}
footer a:hover{color: #1D8FA9!important}


.ym-wrapper-footer{text-align:left;margin:0 auto; padding:0px 10px 0px 10px;  max-width:1600px}
.ym-wbox-footer{padding:0px}



/* ######################    L I N E A R I S A T I O N    ######################### */


@media screen and (max-width:1400px){
.linearize-level-1400,.linearize-level-1400>[class*="ym-g"],.linearize-level-1400>[class*="ym-col"]{display:block;float:none;margin-left:0;margin-right:0;width:100%!important}
.linearize-level-1400>[class*="ym-g"]>[class*="ym-gbox"],.linearize-level-1400>[class*="ym-col"]>[class*="ym-cbox"]{overflow:hidden;padding:0}
}

@media screen and (max-width:1024px){
.linearize-level-0,.linearize-level-0>[class*="ym-g"],.linearize-level-0>[class*="ym-col"]{display:block;float:none;margin-left:0;margin-right:0;width:100%!important}
.linearize-level-0>[class*="ym-g"]>[class*="ym-gbox"],.linearize-level-0>[class*="ym-col"]>[class*="ym-cbox"]{overflow:hidden;padding:0}
}

@media screen and (max-width:960px){
.linearize-level-1,.linearize-level-1>[class*="ym-g"],.linearize-level-1>[class*="ym-col"]{display:block;float:none;margin-left:0;margin-right:0;width:100%!important}
.linearize-level-1>[class*="ym-g"]>[class*="ym-gbox"],.linearize-level-1>[class*="ym-col"]>[class*="ym-cbox"]{overflow:hidden;padding:0}
}

@media screen and (max-width:740px){
.linearize-level-2,.linearize-level-2>[class*="ym-g"],.linearize-level-2>[class*="ym-col"]{display:block;float:none;margin-left:0;margin-right:0;width:100%!important}
.linearize-level-2>[class*="ym-g"]>[class*="ym-gbox"],.linearize-level-2>[class*="ym-col"]>[class*="ym-cbox"]{overflow:hidden;padding:0}
}

@media screen and (max-width:600px){
.linearize-level-3,.linearize-level-3>[class*="ym-g"],.linearize-level-3>[class*="ym-col"]{display:block;float:none;margin-left:0;margin-right:0;width:100%!important}
.linearize-level-3>[class*="ym-g"]>[class*="ym-gbox"],.linearize-level-3>[class*="ym-col"]>[class*="ym-cbox"]{overflow:hidden;padding:0}
}

@media screen and (max-width:480px){
.linearize-level-4,.linearize-level-4>[class*="ym-g"],.linearize-level-4>[class*="ym-col"]{display:block;float:none;margin-left:0;margin-right:0;width:100%!important}
.linearize-level-4>[class*="ym-g"]>[class*="ym-gbox"],.linearize-level-4>[class*="ym-col"]>[class*="ym-cbox"]{overflow:hidden;padding:0}
}































