@import url('https://fonts.googleapis.com/css?family=IBM+Plex+Sans|Montserrat|Scada');

body {font-family: 'IBM Plex Sans', sans-serif; font-size:1.1em; color:#000; margin:0; }

p {margin:0; }
h1, h2 {text-align:center; hyphens:auto; color:#a5a096; }
h3 {text-align:left; hyphens:auto; color:#000}
a,
a:link,
a:hover,
a:active,
a:focus {color:#000; }
a:hover {background-color:#68aca7; color:#000; text-decoration:none; }
a:visited {color:#000;}


#hamburger {display:none; }
#hamburger img {max-width:57px;}

#logodiv { }
#logodiv img {max-width:80px; height:auto; }

header {position:sticky; top:0; z-index:60; width:100%; display:flex; justify-content:space-between; align-items:flex-end; margin:10px auto 0px auto ; padding:0;
		background-color:#fff; border-bottom:1px solid black;}

nav {display:flex; align-items:flex-end; width:70%; margin-bottom:10px; background-color:#fff; }
nav > ul {width:100%; display:flex; flex-direction:row; justify-content:space-around; flex-wrap:wrap; list-style:none; margin:0; }
nav li {position:relative; margin:0; padding:0; color:#fff; font-size:0.9em;}
nav li a {text-decoration:none; padding:2px; color:#000; font-size:0.9em; }
nav li a:visited {color:#000; }


nav li a:hover {color:#fff; background-color:#68aca7;}


li.active {color:#fff; background-color:#307772;}
li.active > a {padding:0.1em 0.7em 0.1em 0.7em; color:#fff; background-color:#307772;}
li.active > a:visited {color:#fff; }


/*.navitext {color:#fff; background-color:#1fbddf; }*/

.submenu {display:none; position:absolute; z-index: 1000; list-style:none; margin-left:0px; padding-left:0px; padding-top:0.5em; background-color:#fff; }
.submenu li {padding:5px; background-color:#fff; border-bottom:1px solid black;}
.submenue li a {color:#000; background-color:#fff;}

.submenue li a:visited {color:#000; background-color:#fff;}
.submenu li.active {color:#fff; background-color:#307772;}
.submenu li.active a {color:#fff; background-color:#307772;}

.subactive {padding:0px 4px; border:1px solid #8da49e;}

nav li:hover .submenu,
nav li:active .submenu, 
nav li:focus .submenu {display:block; }

nav li:focus-within .submenu  {visibility: visible; height: auto;}


#foto {display:flex; justify-content:center; width:100%; background-color:#a5a096; }
#foto-text {display:flex; flex-direction:column; justify-content:center; width:30%; padding:0px; color:#fff; background-color:#dad6d1; }


#foto-text h1 {text-shadow: 1px 1px 1px black; }
#foto-text p {color:#000; width:80%; margin-left:auto; margin-right:auto; text-align:center; font-size:1.1em;}
#foto-text p.zitat-name {margin-top:0.5em; font-size:0.9em;}
#foto img {width:50%; height:50%; }
	
main {display:block; width:50%; padding-bottom:1em; text-align:justify; margin:auto; }
main.impress {width:35%;}
main.ds {width:75%;}
#foto.weck {display:none;}

main p{ margin-top: 20px; }
main img {float:right; width:40%; max-width:300px; margin-left:2em;}
p.fett {font-weight:bold;}
p.rechts {text-align:right;}
p.gruen {color:green;}
p.zitat-unten {margin-top:0.5em; font-size:0.9em;}
ul.coach {list-style:none; list-style-type:decimal; width:50%;}
ul.mich li {margin-bottom:0.6em;}
ul.kind li {margin-bottom:0.4em;}

footer {clear:both; width:100%; font-size:0.9em; border-top:1px solid #307772;}

div.impress {display:flex; justify-content:space-between; width:40%; margin:auto; font-size:0.9em; padding:0.3em 0 0.5em; background-color:#fff; }
div.tel {padding:0.3em 0; margin:0; border:0; color:#fff; text-align:center; background-color:#307772;}





@media (max-width: 1350px) {
nav {width:95%; }
main {display:block; width:70%;}

}


	
@media (orientation: portrait), (max-width: 950px) {
body {font-size:97%; }
#hamburger {display:block; }
#hamburger img {display:block; }
#logodiv img {display:block; }


#foto {display:block; width:100%; }
#foto img {display:block; width:100%; }
#foto-text {width:100%; }
#foto-text h1 {margin:0; padding:5% 0% 5%;}
#foto-text p {margin-top:0; padding-top:2%;}
#foto-text p.zitat-name {padding-top:0; padding-bottom:2%;}


header {width:100%; }
main, main.ds {width:94%; text-align:left;}
main.impress {width:80%;}

nav {display:none; position:absolute; left:0px; top:68px; width:70%; background-color:#ebe6e0;}
nav > ul {display:flex; flex-direction:column; 
		width:100%; margin-left:0px; padding-left:0px; list-style:none; font-size:1.2em; line-height:2.5em; }
nav li {padding-left:5px; border-bottom:1px solid black;}
	
.submenu {position:relative; width:100%; margin-left:2.0em; padding-top:0;  background-color:#8da49e; } 
.submenu li {width:95%; background-color:#8da49e; border-bottom:1px solid #fff;}
.submenu li:hover {width:95%; background-color:#68aca7;}

div.impress {width:75%;}
}


@media (max-width: 600px) {
#logodiv img {}
}