/* SLIDERABSTAND PLAZIERT DEN KOPF PRÄZISE ***

.index-slider-abstand {padding: 190px 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: 0;}}
*/


/* #####################   ZITATZEILE, die ab und zu eingepflegt wird   ################################################## */

.zitat-ab, .zitat-zeile {background: rgba(243,214,97,1); padding: 50px 0 25px 0; margin: 0; border-top:0px solid #f90;}
.zitat-zeile {background: rgba(205,205,205,0.5);}
.zitat-zeile p {margin: 0}

.zitat-ab .like-h1, .zitat-zeile .like-h1  {font-size: 2.5rem; text-transform: uppercase; letter-spacing: 0.1em; line-height: 120%; line-height: 1.3; font-weight: 300; margin: 0;}
.zitat-ab .like-h1 span, .zitat-zeile .like-h1  span{padding:0 0 014 10px; font-size: 1rem; color:#474747; letter-spacing: 0.1em;}

@media screen and (max-width: 960px){
	.zitat-ab .like-h1, .zitat-zeile .like-h1 {font-size: 2rem; margin: 0 0 10px 0;  padding-bottom:20px; margin:0 0 0 20px}
	.zitat-ab, .zitat-zeile {padding: 20px 0 0px 0; margin: 30px 0 30px 0;}
	}

@media screen and (max-width: 650px){
	.zitat-ab .like-h1, .zitat-zeile .like-h1 {font-size: 1.8rem; margin: 0 0 10px 0;  padding-bottom:20px; margin:0 0 0 15px}
	.zitat-ab, .zitat-zeile {padding: 15px 0 0px 0; margin: 20px 0 20px 0}
	}
	
@media screen and (max-width: 480px){
	.zitat-ab .like-h1, .zitat-zeile .like-h1 {font-size: 1.6rem; padding-bottom:20px; margin: 0 0 20px 10px}
	}




/* #####################    Button Socialmedia, Telefon, Lageplan SEITE ############################ Heller c89b0c   dunkler c89b0c*/

.sz-box {border:solid 0px #f90; position: fixed; top: 30%; right: 0; z-index: 999}
.sz-button {width: 60px;
	height: 60px;
	color: #fff;
	font-size: 2.45em;
	line-height: 50px;
	background: #e9ca4c;
	text-align: center;
	margin: 0 0 5px 0;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
	}
.sz-button span:before {margin: 10px 0 0 2px}



.sz-box-r {border:solid 0px #f90; position: absolute; top: -65px; right: 0; z-index: 999}
.sz-button-r {
	width: 100px;
	height: 60px;
	color: #fff;
	font-size: 2.45em;
	line-height: 50px;
	background: #dcb207;
	text-align: center;
	margin: 0 0 5px 0;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
	}
.sz-button-r span {position: absolute; left: 0; top: 2px}

.sz-button-r-inner {
	position: relative;
	top: 3px;
	display: inline-block;
	font-size: 16px;
	margin: 0 0 0 5px;
	line-height: 100%;
	text-align:left;
	}


/* #####################    Button Socialmedia, Telefon, Lageplan UNTER EINER HANDYSEITE ###################### */

.social-link-box-bottom {position: fixed; bottom: 0; height: 50px; width: 100%; background: #c89b0c;  z-index: 9999;}
.social-link-box-bottom-inner {width: 800px; margin: 0 auto; border: solid 0px #fff;}
.social-link-bottom {display: inline-block; margin: 0 8% 0 8%; border: solid 0px #fff}
.social-link-bottom span {color: #fff; font-size: 1.85em;}

.imp-link {padding: 0}
.social-link-bottom div.imp-link-bottom1 {color: #fff; font-size: 0.85em; font-weight: 600; letter-spacing: -0.1em; position: relative; top:5px}
.social-link-bottom div.imp-link-bottom2 {color: #fff; font-size: 0.85em; font-weight: 600; letter-spacing: -0.1em;position: relative; top: 4px}



@media screen and (max-width:740px){
.social-link-box-bottom-inner {width: 480px; border: solid 0px #69eee0; margin: 0 auto;}
.social-link-bottom {display: inline-block; margin: 3px 7%}
.social-link-bottom span {font-size: 1.85em;}
.social-link-bottom span.icon-phone {font-size: 1.85em; position: relative; top: 2px; left: 5px}
}

@media screen and (max-width:470px){
.social-link-box-bottom-inner {width: 350px; border: solid 0px #f90; margin: 0 auto;}
.social-link-bottom {display: inline-block; margin: 0 5%}
.social-link-bottom span {font-size: 1.5em;}
}

@media screen and (max-width:360px){
.social-link-box-bottom-inner {width: 340px; border: solid 0px #f90; margin: 0 auto;}
.social-link-bottom {display: inline-block; margin: 0 5%}
.social-link-bottom span {font-size: 1.5em;}
.social-link-bottom div.imp-link-bottom1 {font-size: 0.85em; font-weight: 600; letter-spacing: -0.11em; position: relative; top:5px}
.social-link-bottom div.imp-link-bottom2 {font-size: 0.85em; font-weight: 600; letter-spacing: -0.11em;position: relative; top: 4px}

}


.teilnehmen-button {background: #b98225; color: #fff; padding:15px 40px; border-radius: 5px; width: max-content; text-align: center; margin: 0 auto;}
.teilnehmen-button h3{color: #fff; text-align: center; }
.teilnehmen-button a{color: #fff; text-align: center; }
@media screen and (max-width:640px){
.teilnehmen-button {padding:20px 20px; width: 80%; margin: 0 auto;}
}




/* #####################     Funktion Testemonials ###################################################### */

.bewertung {position: relative; padding: 25px; width: 90%; margin: 0 auto; height: 240px}
.bewertung-quote-top {position: absolute; top: 10px; left: 5px; z-index: 99}
.bewertung-quote-bottom {position: absolute; bottom: 10px; right: 10px;}
.bewertung-innen {position: relative; overflow: visible; padding: 25px 100px}
.bewertung-innen p {font-size: 1rem; font-style: italic}


@media screen and (max-width:1350px){
.bewertung {height: 300px}
}

@media screen and (max-width:1150px){
.bewertung {height: 330px}
}

@media screen and (max-width:740px){
.bewertung {height: 100%}
}

@media screen and (max-width:1024px){
.bewertung {padding: 25px; width: 75%; border: solid 0px #f90;}
.bewertung-innen {padding: 20px;}
}

.bewertung2 {position: relative; padding: 25px; width: 65%; margin: 0 auto;}
.bewertung2-innen {position: relative; overflow: visible; padding: 25px 100px}
.bewertung2-innen p {font-size: 1rem; font-style: italic}

@media screen and (max-width:1024px){
.bewertung2 {padding: 25px; width: 75%; border: solid 0px #f90;}
.bewertung2-innen {padding: 20px;}
}



.info-hint {font-size: 1rem; color: #fff; padding-top:7px;}


.sprach-switch {border: solid 0px #f90; max-width: max-content; position: fixed; top: 5px; left: 5px; z-index:999999 }
.sprach-switch a{display: inline-block;}

@media screen and (max-width:1024px){.sprach-switch {max-width: max-content; position: absolute; top: 5px; left: 5px; z-index:9999999999 }}
@media screen and (max-width:500px){.sprach-switch {transform: scale(0.7); top: 0px; left: -5px;}}

.team-unterschrift {text-align: center; margin: 0 0 35px 0}
.team-unterschrift h2{margin: 0; font-size: 1.25rem}




.linkzeile > * span{font-size:40px; text-align:center; color:#666;}
.linkzeile > * div{margin:0 auto;padding:0;}
.linkzeile > * p{margin:0;padding:5px;}
.linkzeile > * a span:hover{color:#c89b0c;}



.alinkpfeil {color: #666;}
.alinkpfeil:hover {color: #000;}
.alinkpfeil:before {
	font-family: 'fontello';
	content: '\e845';
	padding: 0 5px 0 0;
	color: #c89b0c;
	}



h2.gr { font-size: 3.4rem; margin:0px 0 50px 0;}
@media screen and (max-width:740px){h2.gr { font-size: 2.4rem; margin:0px 0 50px 0;}}


/* #####################   HINTERGRUND BEI SLIDERFULL ########################################## */
.backslider {background: #eee}
.bordersliderpic {border:30px solid #eee}



.back-vfeldbeton {background: #939598}
.back-vabstand {padding: 50px 0 0 0; margin: -280px 0 10px}
@media screen and (max-width:1024px){.back-vabstand {padding: 100px 0 0 0; margin: -200px 0 10px}}
@media screen and (max-width:740px){.back-vabstand {padding: 0 0 0 0; margin: 0 0 10px}}



/* #####################   A N G B O T   ########################################## */

.angebot {background: #fff;
	border-radius: 10px;
	text-align: center;
	padding: 20px 20px 50px;
	-webkit-box-shadow: 5px 5px 20px 0px rgba(0,0,0,0.2);
	-moz-box-shadow: 5px 5px 20px 0px rgba(0,0,0,0.2);
	box-shadow: 5px 5px 20px 0px rgba(0,0,0,0.2);
}
@media screen and (max-width:1024px){.angebot {margin-botom: 50px; border: solid 1px #ccc}}
@media screen and (max-width:740px){.angebot {padding: 20px 50px 50px;}}

.angebot h2{margin: 0; font-size: 1.5rem }
.angebot h3{margin: 15px 0 0 0; font-size: 1.15rem }
.angebot h4{margin: 15px 0 0 0; font-size: 2rem }


.preis-button {margin: 25px 0 10px 0; background: #c89b0c; border-radius: 5px; padding: 10px; color: #fff }
.preis-button:hover {background: rgba(176,189,175,0.8)}

.preis-buttons-inhalt {}
.preis-buttons-inhalt h2 {margin: 0; font-size: 1.5rem}
.preis-buttons-inhalt h3 {font-size: 1.25rem}
.preis-buttons-inhalt p {font-size: 0.95rem}



/* #####################   Z O O M   ########################################## */

.zoom {transition: transform .2s; height: auto; margin: 0 auto; }
.zoom:hover {transform: scale(1.025);}

@media screen and (max-width:740px){.zoom:hover {  transform: scale(1);}}

.zoom2 {transition: transform .2s; height: auto; margin: 0 auto;}
.zoom2:hover {transform: scale(1.1);}

/* #####################   F O O T E R B A N N E R   ########################################## */

.color-fff-footer {color: #fff!important}

#footerbanner {margin: 0px; padding-top:0px; }
#footerbanner .container{width:100%; position:relative;}
#footerbanner img{position:relative; margin-left:100px}
#footerbanner .container2{width:50%; height:100%; position:absolute; right:1%; top:10%;}

#footerbanner .cta-button{margin:0 auto;}

#footerbanner h3{color: #666}
#footerbanner h2{font-size: 2.5rem; line-height:3.3rem; margin:0 auto }

#footerbanner h3{font-size:1.6rem; padding:50px 0 150px 0; text-align:center}



/* #####################    C T A    BUTTONS   ######################################################################## */

.cta-button{
	background: #c89b0c;
	font-size: 1.5rem;

	letter-spacing:-0.03em;

	/*border-radius: 5px;*/
	color: #fff;
	width: 340px;
	height: 70px;
	padding: 15px 40px;
	margin: 15px auto;
	text-align: center
	}


/* Innen-Kreis Stil */
.cta-button.btn-inline-cirle {
    position: relative;
    box-sizing: border-box;
    line-height: 40px;
    margin: 25px auto 25px auto;
    padding: 16px 0px 12px 2px;
    border-radius: 100px;
}
.cta-button.btn-inline-cirle span {
    padding-left: 35px;
}
.cta-button.btn-inline-cirle:before {
    position: absolute;
    top: 6px;
    left: 6px;
    display: block;
    width: 30px;
    height: 30px;
    color: #fff;
    font-size: 2rem;
    background: transparent;
    border-width: 4px;
    border-style: solid;
    border-color: transparent;
    padding: 10px 10px 10px 10px;
    margin: 0px;
    }


@media screen and (max-width:1600px){#footerbanner .container2{width:40%;}}

@media screen and (max-width:1280px){

#footerbanner h2{font-size: 2.2rem; line-height:3.0rem; margin:0 10px }
#footerbanner img{margin-left:0px}
}

@media screen and (max-width:1024px){#footerbanner h2{font-size: 2.0rem; line-height:2.5rem; margin:0 0 0 20px }}

@media screen and (max-width:960px){
	#footerbanner h2{font-size: 1.8rem;}
	#footerbanner h3{font-size:1.4rem; padding:30px 0 30px 0; text-align: left; margin:0 0 0 20px }
	#footerbanner img{width:60%; margin:0 0 0 0; padding:0; border: solid 0px #f90; position: relative; left: 0;}
	#footerbanner .cta-button{margin: 15px auto}
}

@media screen and (max-width:960px){#footerbanner .cta-button{transform: scale(0.7);}}

@media screen and (max-width:480px){
.cta-button{
	width: 300px;
	height: 70px;
	padding: 15px 40px;
	margin: 15px auto;
	text-align: center
	}


/* Innen-Kreis Stil */
.cta-button.btn-inline-cirle {
    position: relative;
    box-sizing: border-box;
    line-height: 40px;
    margin: 25px auto 25px auto;
    padding: 16px 0px 12px 2px;
    border-radius: 100px;
}
}



.cta2-button {
	width: max-content;
	margin: 50px 0;
	padding: 20px 45px;
	background: #e9ca4c;
	border-radius: 5px;
	text-align: center;
	}
@media screen and (max-width:500px){.cta2-button {width: 100%; padding: 20px 0;}}

.cta2-button a{
	color: #fff;
	text-align: center;	
	}

.cta2-button a span{
	font-weight: 600;
	color: #666;
	
}




.jump-style {padding: 200px 0 0 0; margin: -200px 0 0 0; visibility: hidden; }
@media screen and (max-width:1024px){.jump-style {padding: 5px 0 0 0; margin: -5px 0 0 0;}}


#sidebar {margin: 25px 0 0 0; padding: 0}
@media screen and (max-width:960px){#sidebar {margin: 50px 0 0 0; padding: 0}}

.sidebar-box {background: rgba(233,202,76, 0.4); border-radius: 5px; padding: 10px 15px}



#aufz-vorteile1 li::before {list-style-type: none; padding:0 0 10px 50px; margin-left: 0px;  display: block; position: relative; z-index: 1}
#aufz-vorteile1 li {list-style-type: none;
	padding: 15px 0 0 70px;
	margin: 0 0;
	line-heihgt: 15px;
	margin-left: 0px;
	display: block;
	position: relative;
	z-index: 1;
	border: solid 0px #f90;
	min-height: 50px}
	
#aufz-vorteile1 li h3{margin: 0; color: #333}

.icon-aufz-ok::after {background:url(../bilderpfad/icon/aufz-ok.png) 3px 10px no-repeat;
	opacity: 0.9;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	position: absolute;
	z-index: 0; 
	content: ""; 
	}


/* #####################    LINKS im FOOTER ####################################################### */

.linkkl {text-align:left;padding: 35px 0 50px 0}
.linkkl .color-fff{color:#fff}

.linkkl h3,.linkkl h4,.linkkl h5{
	font-size: 1.2rem !important;
	color: #fff;
	font-weight:normal;
	margin: 0;
	padding: 0;
	}


.linkkl p {color:#fff000;
	line-height:110%;
	margin-top:8px;
	margin-bottom:1px;
	font-size:1.1rem;
	padding:0px;
	}
.linkkl p.padding-top-10{color:#fff000;
	line-height:110%;
	margin-top:8px;
	margin-bottom:1px;
	font-size:1.1rem;
	padding:10px 0 0 0 ;
	}
	
	
.linkkl a p {color:#fff;
	line-height:115%;
	font-size:0.9rem;
	padding:0px;
	text-decoration:none;
	}

.linkkl .alink {color:#fff;
	line-height:115%;
	font-size:0.9rem;
	margin-top:15px;
	margin-left:0px;
	padding:0;
	text-decoration:none;
	}

.linkkl .alink:hover {
	color:#f90;
	}


.linkkl .telphrase {}
.linkkl .telphrase a{color: #c89b0c}
.linkkl .telphrase span:before{color: #c89b0c}



/* #####################    TEL PHRASE   ####################################################### */

.telphrase {margin: 0 0 0 -10px}
.telphrase a{color: #000}
.telphrase span:before{color: #000; font-size: 1.4rem}




.user-gebuchte-module p span:before{font-size: 1.5em;}
.user-gebuchte-module p span.icon-cancel-circled{color: #f00;}
.user-gebuchte-module p span.icon-ok-circled{color: #0f0;}


.nutzer-new-kurse p span.icon-cancel-circled{color: #f00;}




/* #####################    NACH OBEN HOCHFAHREN SEITE   ####################################################### */

#nachoben {
	position: fixed;
	bottom:70px;
	right:20px;
	width: 55px;
	height: 55px;
	border-radius: 5px;
	background-color: rgb(185, 130, 37, 0.5);
        padding: 0;
        display:none;
        z-index:100000;
        border: solid 1px #fff;
	}

#nachoben span.icon-up-open {
	font-size: 25px;
	color: #fff;
	line-height: 20px;
	position: relative;
	top:25%;
	left: 17%;
	}

@media screen and (max-width:740px){#nachoben {transform: scale(0.75); bottom: 50px; right:0.5%;} }





/* #####################    HR UND VARIANTEN   ####################################################### */


.hr{clear: both;
	display:block;
	width:100%;
	height:25px;
	line-height:25px;
	position: relative;
	margin:30px 0;
	float:left;
	}


.hr-inner{
	width:100%;
	position: absolute;
	height:1px;
	left:0;
	top:50%;
	width:100%;
	margin-top:-1px;
	border-top-width:1px;
	border-top-style:solid;
	/*border-top-color: #c89b0c;*/
	border-top-color: #9d9c9c;
	}




.hr-short .icon-kosmo-nur-logo, .hr-middle .icon-kosmo-nur-logo, .hr-long .icon-kosmo-nur-logo{
	display:block;
	position: absolute;
	left: 50%;
	margin-left: -30px;
	margin-top: -30px;
	background-image: url(../bilderpfad/buttons/icon-kosmo-nur-logo.png);
	border: solid 0px #f90; 
	border-radius: 50%; 
	height: 60px;
	width: 60px; 
	}







/* #####################     TABELLE SPRECHSTUNDEN   ####################################################### */

table{max-width:700px;
	border-collapse:collapse;
	margin: 0;
	color:#333;
	border-bottom:1px #ccc solid}

th,td{line-height:1.5em; vertical-align:top; padding:.7143em .3em}



thead th {
    text-align: left;
    font-size: 1.4rem;
    line-height: 1.5rem;
    padding-bottom: 3px;
    font-weight: normal;
    color: #333;
    border-bottom: 2px #000 solid;
    padding: 0 0 10px 0;
}
	
tbody th{text-align:left;border-top:1px solid #ccc;text-align:left}
tbody td{text-align:left;border-top:1px solid #ccc}
.bordertable tbody td{border-right:1px solid #ccc}

.thklein{padding-top:20px; font-size:1.3rem}







/* #####################     TEAMSEITE STYLES   ####################################################### */


.teamstyle h2.bigger {font-size:2.2rem; margin:25px 0 5px 0;}
.teamstyle h2{font-size:1.75rem; margin:25px 0 5px 0;}
.teamstyle p{font-size:1.0rem; 	margin:0px 0 20px 0;}





.bild-lfloat-abstand {float: left; margin: 0 50px 20px 0}
@media screen and (max-width:1200px){img.bild-lfloat-abstand {max-width:50%;}}
@media screen and (max-width:960px){img.bild-lfloat-abstand {max-width:100%;}}
@media screen and (max-width:900px){.bild-lfloat-abstand {float: none; margin: 0 0 15px 0; overflow: hidden}}

.bild-rfloat-abstand {float: right; margin: 0 0 20px 50px}
@media screen and (max-width:1200px){img.bild-rfloat-abstand {max-width:50%;}}
@media screen and (max-width:960px){img.bild-rfloat-abstand {max-width:100%; margin:0 auto}}
@media screen and (max-width:900px){.bild-rfloat-abstand {float: none; margin: 0 0 15px 0; overflow: hidden}}


.aufzaehlung-1 {margin: 20px 0 0 0; padding: 0 0 0 50px}
.aufzaehlung-1 ul {font-size:30px; list-style-type: none;}
.aufzaehlung-1 li {background: url(../bilderpfad/buttons/aufz-icon.png) no-repeat 0 16px; padding: 15px 0 0 35px; font-size:32px; line-height:22px; margin: 0; color: #b0bdaf;}
.aufzaehlung-1 li span{font-size:18px; color:#333; line-height:22px;  position:relative; bottom: 4px;}

/*
.aufzaehlung-2 {margin: 20px 0 0 0; padding: 0}
.aufzaehlung-2 ul {list-style-type:none}
.aufzaehlung-2 li {background: url(../bilderpfad/buttons/aufz-icon.png) no-repeat 0 1px; padding: 0 0 30px 45px}
.aufzaehlung-2 li h3 {margin: 0; padding: 0}
*/

.aufzaehlung-2 {margin: 20px 0 0 0; padding: 0 0 0 50px}
.aufzaehlung-2 ul {font-size:30px; list-style-type: square;}
.aufzaehlung-2 li {font-size:32px; line-height:22px; padding:10px 0 0 0; margin:0; color: #c89b0c;}
.aufzaehlung-2 li span{font-size:18px; color:#333; line-height:22px;  position:relative; bottom: 4px;}


.ml-button {border: solid 0px #f90;width: max-content;}
.ml-button-innen {border: solid 2px #c89b0c; background: #fff; color: #666; padding: 15px 15px 15px 25px; border-radius: 20px; font-size:1.25rem}
.ml-button-innen:hover {border: solid 2px #fff; background: #c89b0c; color: #fff;}
@media screen and (max-width:420px){.ml-button-innen {padding: 15px 15px 15px 25px; font-size:1rem}}

.ml-button-center-kl{border: solid 0px #f90;width: max-content; margin: 0 auto;}
.ml-button-center-innen-kl {border: solid 0px #f90; background: #b9a2c5; background: #c89b0c; color: #333; padding: 12px; border-radius: 5px; font-size:1.2rem}


.ml-button-index {border: solid 0px #f90;width: 335px; position: absolute; bottom: 10px; left: 50%; margin: 0 0 0 -168px}
.ml-button-innen-index {border: solid 2px #c89b0c; background: #fff; color: #666; padding: 15px 15px 15px 25px; border-radius: 20px; font-size:1.25rem}
.ml-button-innen-index:hover {border: solid 2px #fff; background: #c89b0c; color: #fff;}
@media screen and (max-width:420px){.ml-button-innen-index {padding: 15px 15px 15px 25px; font-size:1rem}}

@media screen and (max-width:1730px){.ml-button-index {transform: scale(0.7);}}



.ml-button-orange {border: solid 0px #f90;width: max-content;}
.ml-button-orange-innen {border: solid 0px #c89b0c; background: #f90; color: #666; padding: 15px 15px 15px 25px; border-radius: 20px; font-size:1.25rem}
.ml-button--orangeinnen:hover {border: solid 2px #fff; background: #c89b0c; color: #fff;}
@media screen and (max-width:500px){.ml-button-orange-innen {padding: 15px 15px 15px 25px; font-size:1rem}}
@media screen and (max-width:420px){.ml-button-orange {transform: scale(0.9);padding: 0; marin: 50px 0 0 0}}



/* #####################     I N F O - F E L D E R  Evt. auch noch nicht gebrauchte, könnte abgespeckt werden ####################################################### */

.info-button {text-align: center; margin: 0 0 -25px 0;}
.info-button .icon-info-circled:before {color: #c89b0c}
.info-button a{color: #c89b0c}
.info-button span {
	font-size: 40px; 
	padding:0 ; 
	margin: 0; 
	background: #fff; 
	border-bottom: solid 1px #eee;
	border-radius: 100px;
	}
	
	
.info-feld {display: block;
	height: 100%;
	max-width: 100%;
	background: #FCFCFC;
	border: solid 1px #999;
	border-radius: 5px;
	padding: 20px;
	margin: 0 20px;
	text-align: center;
	font-size: 16px;
	z-index: 900
	}
@media screen and (max-width:460px){.info-feld {margin: 0;}}



.info-feld a{color: #333;}
.info-feld a:hover{color: #c89b0c}
.info-feld a.button.link:hover {color: #fff} 

.info-feld.border2 {border: solid 2px #997ec1; height:220px;}
.info-feld.termin {padding: 20px 0 0 20px; float:left; background:#FCFCFC url(../bilderpfad/home/hint-terminbuchung.png) top right no-repeat;}
.info-feld.smile {background:#FCFCFC url(../bilderpfad/home/hint-smile-design-neu.png) top right no-repeat;}




/* #####################     I N F O - F E L D E R  alternativ INDEX.php ####################################################### */

.info-feld-index {padding: 10px 25px 50px 25px; border-radius: 5px; background: #d3bc7e;}
.info-feld-index p{font-size: 0.8em;}
.info-feld-index .info_title {color: #fff}
.info-feld-index .unter_title {color: #333; font-size: 1.2em; line-height: 100%; margin-top: 10px}
.info-feld-index h1,.info-feld-index h2,.info-feld-index h3,.info-feld-index h4 {color: #fff}
.info-feld-index table {}
.info-feld-index tbody {}
.info-feld-index tr {}
.info-feld-index td {border-top: solid 1px #fff; font-size: 0.8em}
.info-feld-index td:last-child {border-bottom: solid 1px #fff}




/* #####################     ACCORDION ####################################################### */


button.accordion {
	background-color: #98D1DF;
	color: #444;
	cursor: pointer;
	padding: 18px;
	width: 100%;
	border: none;
	text-align: left;
	outline: none;
	font-size: 1.25em;
	transition: 0.4s;

}

button.accordion.active, button.accordion:hover {
	background-color: rgba(0, 103, 129, 0.4);
}

button.accordion:before {
	font-family: "fontello";
	content: '\e848';
	color: #fff;
	float: left;
	margin-right: 20px;
}

button.accordion.active:before {
	content: "\e84a";
}

div.panel {
	padding: 0 18px;
	background-color: white;
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.5s ease-out;
	border-left:1px solid #fff;
	border-right:1px solid #fff;
	border-bottom:1px solid #fff;
}

div.panel p {
	font-size: 1em
	}

@media screen and (max-width:960px){button.accordion {font-size: 1em;} div.panel table h4{font-size: 1em} div.panel table td{font-size: 1em}}




/* #####################     VIDEO CONTAINER  ####################################################### */
 
.video-container {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}