@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto'), local('Roboto-Regular'), url(fonts/Roboto-Regular.woff2) format('woff2'),url(fonts/Roboto-Regular.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: local('Roboto Medium'), local('Roboto-Medium'), url(fonts/Roboto-Medium.woff2) format('woff2'),url(fonts/Roboto-Medium.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: local('Roboto Bold'), local('Roboto-Bold'), url(fonts/Roboto-Bold.woff2) format('woff2'),url(fonts/Roboto-Bold.ttf) format('truetype');  
}
@font-face {
    font-family: 'RobotoCN';
    src: url('../fonts/robotocondensed-light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}
html,body{margin: 0px;padding: 0px;}
html{height:100%;}
body{height:auto;min-height:100%;margin: 0px;padding: 5.5em 0 3em 0;position:relative;min-width:320px;}
*{-moz-box-sizing: border-box;-webkit-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box;border:0 solid #fff;}
.clearfix:after {content: ".";display: block; clear: both;visibility: hidden;line-height: 0; height: 0;}
.mw{max-width:50em;margin:auto;}
header .mw,.body_footer .mw{max-width:48em;position:relative;height:100%;}

header,.background_out,.body_footer{width:100%;}
header,.body_footer{border-width:1em;}

/* Navi allgemein */
nav.top_menu,nav.main_menu{display:none;}
nav.nojs_menu{margin:1em auto;max-width:48em;}
nav ul{margin:0;padding:0;list-style-type:none;width:100%;}
nav ul li{margin: 0;padding:1em 0;} 
nav ul a{text-decoration:none;}

/* Navi oben */
nav.top_menu ul li::after{content:'\002022';color:rgb(204, 7,30);} 
nav.top_menu ul li:last-child::after{content:none;} 
nav.top_menu ul a{padding:0 .7em;font-weight: bold;}

/* Navi Mitte */

nav.main_menu{left:0;z-index:999;width:100%;border-width:0 1em;position:absolute;top:0em}
nav.main_menu ul,nav.nojs_menu ul{position:relative;background-color:#fff;padding:1em;width:100%;font-weight:500;}
nav.main_menu li,nav.nojs_menu li{border-bottom: 1px solid #000;}
nav.main_menu li:last-child,nav.nojs_menu li:last-child{border-bottom: none;}
nav.main_menu ul ul,nav.nojs_menu ul ul{white-space:nowrap;font-weight:400;padding:.5em 0 0 0;}
nav.main_menu ul ul a,nav.nojs_menu ul ul a{font-size:.9em;}

nav.main_menu ul ul li,nav.nojs_menu ul ul li{border-bottom:none;padding:.3em 0 .3em .5em;}
nav.main_menu ul ul li::before,nav.nojs_menu ul ul li::before{content:'\002022';color:rgb(204, 7,30);padding-right:.5em;}
nav.main_menu li.sub_back,nav.nojs_menu li.sub_back{position:relative;font-weight:bold;padding-left:1.4em;padding-bottom:.5em;cursor:pointer;}
nav.main_menu li.sub_back::before,nav.nojs_menu li.sub_back::before{content:'';display:block;position:absolute;left:-.1em;top:.5em;width:1em; height:.8em;background:url('../images/grafics/arrow_left.svg') no-repeat left center;background-size:auto 100%;}

.hide_xlow{display:none;}
@media (min-height: 500px){	
	nav.main_menu ul{padding:1em 2em;}
}
@media (min-width: 400px) {	
	.hide_xlow{display:inherit;}
	nav.main_menu,nav.main_menu ul{width:auto;}
	nav.main_menu li{position:relative;}
	nav.main_menu ul ul{display:none;position:absolute;left:100%;top:0;margin-left:2em;padding:.7em 2em 1em 2em;}
	nav.main_menu ul ul::before{content:'';display:block;position:absolute;left:-1.1em;top:1.2em;width:1em; height:.9em;background:url('../images/grafics/arrow_right.svg') no-repeat left center;background-size:auto 100%;}
}
@media (min-height: 500px) AND (min-width: 400px){	
	nav.main_menu{position:fixed;top:5.5em}
	nav.main_menu{padding:0 1em;border-width:0;}
}

/*header */
header{position:fixed;top:0;left:0;height:5.5em;background-color:#fff;z-index:2000;}

a.logo{display:block;height:90%;width:auto;position:absolute;top:10%;right:0;z-index:10;}
@media (min-width: 400px) {	
	a.logo{height:100%;position:absolute;top:0;}
}
a.logo img{height:100%;width:auto;}
header nav{position:absolute;left:0;bottom:0;padding-right:20em;padding-left:1em;}

#menu_button{display:block;position:fixed;top:0;left:0;padding:2em .5em 0 .5em;z-index:1000;text-decoration:none;line-height:2em;}

/*Mittlere Reihe */
.pos_in{position:relative;width:100%;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.background_out,.background_text{border-color:#fff;text-align:center;}
.background_out iframe{width:100%;height:100%;border:none;}
.pos_out{padding:0 1em;}
.background_text{position:absolute;bottom:0;left:0;width:100%;margin-bottom:2em;}
.background_text.top{top:0;bottom:auto;margin-top:2em;}
.background{height:100%;min-height:15em;background:no-repeat center top;background-size:cover;background-color:#e7e5d4;padding:2em 1em;}
.bg_lebensberatung{background-image:url('../images/bg/lebensberatung_lr.jpg');}
.bg_partnerschaft{background-image:url('../images/bg/partnerschaft_lr.jpg');background-position:center center;}
.bg_erziehung_pubertaet{background-image:url('../images/bg/erziehung_pubertaet_lr.jpg');background-position:center bottom;}
.bg_leben_mit_behinderung{background-image:url('../images/bg/leben_mit_behinderung_lr.jpg');background-position:center center;}
.bg_eltern{background-image:url('../images/bg/eltern_lr.jpg');background-position:center center;}
.bg_geistliches_leben{background-image:url('../images/bg/geistliches_leben_lr.jpg');background-position:center bottom;}
.bg_lebensstilanalyse{background-image:url('../images/bg/lebensstilanalyse_lr.jpg');background-position:center center;}
.bg_tamara_buettner{background-image:url('../images/bg/tamara_buettner_lr.jpg');background-position:center center;}
.bg_vortraege{background-image:url('../images/bg/vortraege_lr.jpg');}
.bg_individualpsychologie{background-image:url('../images/bg/alfred_adler.jpg');background-position:center center;}
.bg_kosten{background-image:url('../images/bg/kosten_lr.jpg');}
.bg_aktuell{background-image:url('../images/bg/aktuell_lr.jpg');}

img.fragezeichen{display:block;width:auto;height:12em;margin:auto;}
.bg_big_text{font-size:1.8em;}
.article_out{padding:2em 1em 1em 1em;}
@media (min-width: 500px) {
	img.fragezeichen{display:block;width:auto;height:14em;margin:auto;}
	.bg_text{font-size:1.2em;}
	.background{min-height:18em;}
}
@media (min-width: 600px)  AND (max-width:1099px) {
	img.fragezeichen{height:16em;}
	.bg_text{font-size:1.4em;}
	.background{min-height:20em;}
}

@media (min-width: 1100px) AND (max-width:1199px) {
	.bg_text{font-size:1.5em;}
}
@media (min-width: 1200px) AND (max-width:1299px) {
	.bg_text{font-size:1.6em;}
}
@media (min-width: 1300px) AND (max-width:1399px) {
	.bg_text{font-size:1.7em;}
}
@media (min-width: 1400px) AND (max-width:2299px) {
	.bg_text{font-size:1.8em;}
}

@media (min-width: 2300px) AND (max-width:2399px) {
	.bg_text{font-size:1.9em;}
}
@media (min-width: 2400px) {
	.bg_text{font-size:2em;}
}
/* Footer */
.body_footer{position:absolute;top:100%;left:0;height:3em;margin-top:-3em;background-color:#fff;}
.footer_left{width:auto;float:left;}
.footer_left a,.footer_left span{font-size:.8em;padding-top:.2em;}
.footer_right{width:auto;float:right;}

/* TYPO */
*{font-family:'Roboto',Arial,Helvetica,sans-serif;-moz-text-size-adjust:none; -webkit-text-size-adjust:none; -ms-text-size-adjust:none; text-size-adjust:none;}
body{font-size: 14px;}
* *{font-size:1em;}
sup{font-size:.8em;line-height:.8em;}
h1{margin-top:3em; font-size: 2em; font-family: "RobotoCN"; font-weight: 300; color: #CD071E; }
// h1::before{content:' ';background-color:#E2001A;height:1em;width:1em;border-radius:50%;display:inline-block;vertical-align:top;position:relative;left:-.1em;top:.25em;margin-right:.4em;}
// h1:first-child{margin-top:1em;}
h2{margin-bottom:0;margin-top:2em;}
h2::before{content:'\002022';color:rgb(204, 7,30);padding-right:.5em;}
h2 + p{margin-top:0;}
article{line-height:1.5;}

/* Margin und Padding */
.mt0{margin-top:0;}
.mt2{margin-top:2em;}
.mb0{margin-bottom:0;}

/* Listen im Text */
article ul{margin:0;padding:0;list-style-type:none;width:100%;}
article ul li{position:relative;padding-left:1em;}
article ul li::before{content:'\002022';color:rgb(204, 7,30);position:absolute;left:0;top:0;}

/* Farben */
body{color:#000;background-color: #fff;}
*{color:inherit;}
#menu_button{background-color:rgb(204, 7,30);color:#fff;}
nav ul{}
nav ul li{}
a:hover,.current_page a,.current_menu > a{color:rgb(204, 7,30);}

/* ab hier wird das Menu komplett angezeigt */
@media (min-height: 500px) AND (min-width: 1000px) {	
	noscript,.nojquery nav#menu{display:none;}
	.mw,header .mw,.body_footer .mw{max-width:none;margin:0;}
	body{height:100%;}
	.pos_out{width:100%;height:100%;padding: 5.5em 1em 3em 1em;position:fixed;top:0;left:0;}
	.pos_in{width:100%;height:100%;position:relative;}
	nav.top_menu,nav.main_menu{display:block;}
	#menu_button{display:none;}
	nav.top_menu nav ul{padding:0;}
	nav.top_menu ul li{display:inline-block;padding:.4em 0 0 0;}
	nav.main_menu{padding:0;}
	nav.main_menu ul{background-color:rgba(255,255,255,.5);}
	nav.main_menu ul ul{background-color:rgba(255,255,255,.7);}
	nav.main_menu,.background_text,.background_out{position:absolute;}
	nav.main_menu ul li {padding: .6em 0;}
	.background_text,.background_text.top{min-height:0;margin-top:0;z-index: 1000;pointer-events: none;width:50%;left:2em;top:85%;bottom:auto;}
	.bg_text{text-align:left;margin-top:-1em;pointer-events: auto;}
	nav.main_menu,nav.main_menu > ul{height:100%;top:0;}
	.background_out{border-width:0;height:100%;width:100%;top:0;left:0;}
	.background{padding:0 0 0 11.5em;}
	.bg_lebensberatung{background-image:url('../images/bg/lebensberatung.jpg');}
	.bg_partnerschaft{background-image:url('../images/bg/partnerschaft.jpg');}
	.bg_erziehung_pubertaet{background-image:url('../images/bg/erziehung_pubertaet.jpg');}
	.bg_leben_mit_behinderung{background-image:url('../images/bg/leben_mit_behinderung.jpg');}
	.bg_eltern{background-image:url('../images/bg/eltern.jpg');}
	.bg_geistliches_leben{background-image:url('../images/bg/geistliches_leben.jpg');}
	.bg_lebensstilanalyse{background-image:url('../images/bg/lebensstilanalyse.jpg');}
	.bg_tamara_buettner{background-image:url('../images/bg/tamara_buettner.jpg');}
	.bg_vortraege{background-image:url('../images/bg/vortraege.jpg');}
	.bg_kosten{background-image:url('../images/bg/kosten.jpg');}
	.bg_aktuell{background-image:url('../images/bg/aktuell.jpg');}
	.body_footer::before{content:' ';display:block;height:2px;width:100%;background-color:#000;position:absolute;top:-1em;left:0;}
	.footer_left{padding-left:2em;}
	.footer_right{padding-right:1em;}
	.body_footer{position:fixed;margin-top:0;bottom:0;top:auto;}
	img.fragezeichen{height:60%;position:relative;top:25%;}
	.article_out{padding:0 0 0 5.8em;border-right:1em solid #fff;height:100%;width:50%;margin:0 0 0 auto;position:relative;pointer-events: none;}
	.article_out article{margin:0 0 0 auto;min-height:100%;position:relative;background-color:rgba(255,255,255,.7);border-top:1px solid transparent;padding:1em 1em 5em 2em;pointer-events: auto;}
	.js_wrap{position:relative;width:100%;overflow:hidden;min-height:100%}


}
@media (min-height: 550px) AND (min-width: 1000px) {
	nav.main_menu ul li {padding: .8em 0;}
}
@media (min-height: 600px) AND (min-width: 1000px) {
	.bg_text{margin-top:-1.5em;}
	nav.main_menu ul li {padding: .9em 0;}
}
@media (min-height: 640px) AND (min-width: 1000px) {
	.bg_text{margin-top:-2.5em;}
	nav.main_menu ul li {padding: .9em 0;}
}
@media (min-height: 500px) AND (min-width: 1200px) {
	body{padding: 7.5em 0 3em 0;}
	.pos_out{padding: 7.5em 1.5em 3em 1.5em;}
	header{border-width:2em;height:7.5em;}
	.body_footer{border-width:1em 1.5em;}
	.article_out{border-right:1.5em solid #fff}

}

@media (min-width: 1500px) AND (max-width:1599px) {
body{font-size:15px;}
}
@media (min-width: 1600px) AND (max-width:1699px) {
body{font-size:16px;}
}
@media (min-width: 1700px) AND (max-width:1799px) {
body{font-size:17px;}
}
@media (min-width: 1800px) AND (max-width:1899px) {
body{font-size:18px;}
}
@media (min-width: 1900px) AND (max-width:1999px) {
body{font-size:19px;}
}
@media (min-width: 2000px) AND (max-width:2099px)  {
body{font-size:20px;}
}
@media (min-width: 2100px) AND (max-width:2199px)  {
body{font-size:20px;}
}
@media (min-width: 2200px) {
body{font-size:22px;}
}