html *{font-size:100%} /* Default Font Size, 16px */


* {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-top: solid 0px #eee444;}

@media (min-width: 1600px) {  
.ym-wrapper{text-align:left; margin:0 auto; max-width:1300px; border:0px solid #eee666;}
.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;}
@media screen and (max-width:1400px){#main {border-top: solid 3px #eee; padding-top:20px;}}
@media screen and (max-width:1024px){#main {border-top: solid 3px #eee; padding-top:20px;}}
@media screen and (max-width:740px){#main {border-top: solid 3px #eee; padding-top:10px;}}
@media screen and (max-width:600px){#main {border-top: solid 3px #eee; padding-top:20px;}}
@media screen and (max-width:480px){#main {border-top: solid 3px #eee; padding-top:8px;}}

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: rgb(185, 130, 37);
	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.75rem;   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.35rem; line-height: 1.3; margin:1.8rem 0 1.2rem 0; /* 1.35rem */} /* 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 */


* 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 1.2rem 0; padding-top:1.5rem; 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; }}


/*@media screen and (max-width:480px) {h1{font-size: 165% !important; line-height:1.25rem; letter-spacing:-0.01rem; margin:15px 0 0 0;} h2,h3,h4,h5,h6{font-size: 148% !important; line-height:1.25rem; letter-spacing:-0.01em; margin:15px 0 0 0;} p {font-size:1.2rem;}}*/

/*
p {padding:0; margin:0;}
p {font-size:1.1em; line-height:1.7em; margin:1.20em 0 0 0;}
p {font-size:1.1em; line-height:1.7em; margin:0 0 1.2em 0;}

@media screen and (max-width:1024px){p {font-size:1rem;}}*/


small {font-size: 0.7rem;}
a {color: #666; text-decoration: none}
a:hover {color: #333}

img {display: block}
.bordered {border: solid 1px #999999}


.flexible {max-width: 100%}
.flexible2, .flexible100 {width: 100%}


.ym-clearfix:before{content:"";display:table}
.ym-clearfix:after{clear:both;content:".";display:block;font-size:0;height:0;visibility:hidden}







/* ###################### HEADER UND LOGO PC und HEADER PC SMALLER ######################### */

header {width: 100%;
	height: 188px;
	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: height 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/kosmosophia-logo-text.jpg");
	background-repeat: no-repeat;
	background-position: center;
	background-size: auto 115px;
	height: 130px; 
	padding: 5px 0 0 0;
	}

header.smaller .logo-header {background-image: url("../bilderpfad/logo/kosmosophia-logo.jpg");
	background-repeat: no-repeat;
	background-position: center;
	background-size: auto 78px;
	height: 80px; 
	padding: 0;
	transition: width 0.5s, height 0.5s, transform 5s;
	}
	
header.smaller {height: 125px;}

@media screen and (max-width:1400px){header {height: 160px;} header .logo-header {background-size: auto 95px; height: 100px; padding: 5px 0 0 0;}}
@media screen and (max-width:1100px){header {height: 150px;} header .logo-header {background-size: auto 95px; height: 100px; padding: 5px 0 0 0;}}


/* ###################### 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: 100px; background: #fff; z-index: 999999; box-shadow: 0 3px 11px 2px rgba(0,0,0,0.4); position: relative;} .logo-header-mobile {margin: 0 auto 10px auto; padding-top:10px;}}
@media screen and (max-width:960px) {#mobil-header {height: 90px; background: #fff;} .logo-header-mobile {margin: 0 auto 10px auto; }}	
@media screen and (max-width:850px) {#mobil-header {height: 90px; background: #fff;} header .logo-header {background-size: auto 150px; height: 100px; padding: 25px 0 0 0;} .logo-header-mobile {margin: 0 auto 10px auto; }}	
@media screen and (max-width:740px) {#mobil-header {height: 85px; background: #fff;} header .logo-header {background-size: auto 150px; height: 100px; padding: 25px 0 0 0;} .logo-header-mobile {margin: 0 auto 10px auto;  padding-top:5px; }}	
@media screen and (max-width:650px) {#mobil-header {height: 80px; background: #fff;} .logo-header-mobile {padding-top: 3px; }}
/*
@media screen and (max-width:550px) {#mobil-header {height: 80px; background: #fff;} .logo-header-mobile {margin-left: 45px; padding-top: 3px; }}
@media screen and (max-width:480px) {#mobil-header {height: 80px; background: #fff;} .logo-header-mobile {margin-left: 15px; padding-top: 3px; }}
@media screen and (max-width:400px) {#mobil-header {height: 80px; background: #fff;} .logo-header-mobile {margin-left: 0px; padding-top: 3px; }}
*/

@media screen and (max-width:550px) {.logo-header-mobile {width: 250px; padding: 15px 0 0 0}}































































/* ###################### E N D E HEADER ######################### */



/* ###################### ABSTAND SLIDER ZUM BILDANFANG IM HEADER ######################### */

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



/*  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;
	position: relative;
	z-index:5;
	}


footer p {color: #fff!important}
footer p a{color: #fff!important}


.ym-wrapper-footer{text-align:left;margin:0 auto; padding:0px 10px 0px 10px;  max-width:1200px}
.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}
}