/* CSS Document www.cvo-media.de/ copyright by Anne-Marie Hensel / www.web-printdesign.net*/

html {margin:0;padding: 0;height:100%;}
body {
font-family:"Helvetica", "Arial", sans-serif;
margin:0;
padding:0;
color: #000000;
background:#ffffff;
font-size: 16px;
line-height:1.5em;
}

/*On Top Bar*/
#menubar{
display:none;   /*immer volle Breite Bildschirm*/
position:relative;
z-index:100;
/*background: hsla(350,50%,50%,0.3); */
border-top: 0px solid #cdcdcd;
border-bottom: 0px solid #cdcdcd;
border-left: 0pxsolid #cdcdcd;
border-right: 0px solid #cdcdcd;#
background:#ffffff;
height:auto;
padding:0;
text-align:right;
}
#menubar img {margin:0em;width:auto;}

#menubar ul{
display:block; 
width:auto; 
height:auto;
margin:0em;
background:#ffffff;
}
#menubar ul li{
display:block;   /*Aufzählungspunkte werden in einer Linie horizontal abgebildet*/
width:0em; 
padding:0em;
margin:0em;
}

#menubar ul li a.menubotton{
display:block;  /*Button soll unsichtbar werden, wenn in der mobilen Ansicht*/
margin:0;
}
#menubar img { border:none;}
/*FOTOS*/


/*HEADER ggf. nicht dynamisch*/
header {
display:block; 
position:fixed;
z-index:10;
top:10;
box-sizing: border-box;
background: #ffffff;
width:100%;
height:auto;
min-height:6.875em;
padding-left:6%;
border-bottom:1px solid #cccccc;

}
header img{
display:inline; 
position:relative;
z-index:10;
width:auto; 
min-height:auto;
vertical-align: top;
float:left;
}

/* MENÜ */
nav {
display:inline; 
position:relative;
z-index:50;
width:90%;
float: none;
background: #ffffff;
color:#666666;
font-size: 1.1em;
left:5%;
font-family:"Open Sans", sans-serif;
font-weight:bold;
text-decoration:none;
}

/* Mainmanue */
nav ul ul {
  margin: 0;
  padding: 0;
  background:#ffffff;
  }
 
nav a {
background: #ffffff;
  display: block;
  color: #000000;
  text-decoration: none;
}

nav ul li {
  position: relative;
  float: left;
  list-style: none;
   text-decoration: none;
  }
 
nav ul li:hover {
  background: #ffffff;
  text-decoration:none;
}
 
nav ul li a {
    padding: 10px;
}

/* Submenue */

nav ul ul {
  position: absolute;
  top: -9999px;
  left: -9999px;
  background: #ffffff;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.6);
}
 
nav ul ul li {
  float: none;
  min-width: 150px;
  width:auto;
  border-bottom: 1px solid #999999;
}
 
nav ul ul li a {
  padding: 8px 8px;
}


/* Sondereinstellungen für Mainmenue und Submenue */
nav ul li:hover > ul {
  top: 100%;
  left: 0;
}

nav ul ul li:hover > ul {
  top: 0;
  left: 200px;
}

nav ul li.submenu > a:after {
  position: relative;
  float: right;
  content: '';
  margin-left: 10px;
  margin-top: 5px;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid #fff;
  border-bottom: 5px solid transparent;
}

nav ul ul li.submenu a:after {
  margin-left: auto;
  margin-right: -10px;
  border-left: 5px solid #fff;
  border-right: 5px solid transparent;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
}

nav ul ul li:last-child {
  border-bottom: none;
}

/* MENÜ ENDE */


#fotos{
display:block; 
position:relative;
z-index:0;
background:#ffffff;
width:100%;
height:auto;
}
.carousel{padding-top:110px;}

/*INHALTE*/
/*Fotos im Text*/
.portrait{border-radius: 50%; width:150px; float:left;padding:10px;}
.coaching1{border-radius: 50%; width:220px; float:left;padding:10px;}
.coaching2{border-radius: 0%; width:180px; float:left;padding:10px;}
.kommunikation{border-radius: 0%; width:200px; float:right;padding:10px;}
.veranstaltungen{border-radius: 0%; width:250px; float:right;padding:10px;}
/*Fotos im Text Ende*/

#textfeld {
width:100%;
height:150px;
margin:0;
overflow:scroll;
scrollbar-base-color: #ffffff;
overflow-x: hidden;
box-sizing: border-box;
text-align:left;
}
#textfeld h3 {margin-top:0;}
#titelzeile{display:block; position:relative; z-index:0; height: 100px; background: #ffffff; padding-top:20px; margin:0;  text-align:center; font-family:"Open Sans", sans-serif; font-size: 1.8em; color:#cc0000;}
/*Sprungziele*/
#profilmarker, #coachingmarker, #kommunikationmarker, #textmarker, #terminemarker, #kontaktmarker{
display:block;
position:relative;
z-index:0;
margin:auto;
padding-top:6.875em;
padding-bottom:0px;
padding-left:8%;
text-align:left;
font-family:"Open Sans", sans-serif;
}
#profilmarker h1{color:#cc0000; font-size:1.5em;} 
#coachingmarker h1{color:#cc0000; font-size:1.5em;}
#kommunikationmarker h1{color:#cc0000; font-size:1.5em;}
#textmarker h1{color:#cc0000; font-size:1.5em;}
#terminemarker h1{color:#cc0000; font-size:1.5em;}
#kontaktmarker h1{color:#cc0000; font-size:1.5em;}

#profilmarker, #kommunikationmarker {background:#ffffff;}
#coachingmarker, #textmarker , #terminemarker {background:#eeeeee;}
#kontaktmarker {background:#cdcdcd;}

/*Container-Inhalte*/
#profil, #coaching, #kommunikation, #text, #termine, #kontakt{
display:block;
position:relative;
z-index:0;
box-sizing: border-box;
padding-top:15px;
padding-bottom:50px;
padding-left:0%;
padding-right:8%;
width:100%;
height:auto;
text-align:left;
text-align:left;
font-size: 1.0em; 
}

#profil {
-webkit-column-count: 2; /* Chrome, Safari, Opera */
-moz-column-count: 2; /* Firefox */
column-count: 2;
-webkit-column-gap: 100px; /* Chrome, Safari, Opera */
-moz-column-gap: 100px; /* Firefox */
column-gap: 100px;
 -webkit-column-rule: 1px solid #cdcdcd; /* Chrome, Safari, Opera */
    -moz-column-rule: 1px solid #cdcdcd; /* Firefox */
    column-rule: 1px solid #cdcdcd;
}
#profil h1 {font-family:"Open Sans", sans-serif; color:#cc0000;}
#profil h3 {font-family:"Open Sans", sans-serif; color:#000000; font-size: 1.3em; }
#profil a {color:#cc0000;}

#coaching {
-webkit-column-count: 2; /* Chrome, Safari, Opera */
-moz-column-count: 2; /* Firefox */
column-count: 2;
-webkit-column-gap: 100px; /* Chrome, Safari, Opera */
-moz-column-gap: 100px; /* Firefox */
column-gap: 100px;
 -webkit-column-rule: 1px solid #cdcdcd; /* Chrome, Safari, Opera */
    -moz-column-rule: 1px solid #cdcdcd; /* Firefox */
    column-rule: 1px solid #cdcdcd;
}
#coaching h1 {font-family:"Open Sans", sans-serif; color:#cc0000;}
#coaching h3 {font-family:"Open Sans", sans-serif; color:#000000;  font-size: 1.3em;}
#coaching a {color:#cc0000;}

#kommunikation {
-webkit-column-count: 2; /* Chrome, Safari, Opera */
-moz-column-count: 2; /* Firefox */
column-count: 2;
-webkit-column-gap: 100px; /* Chrome, Safari, Opera */
-moz-column-gap: 100px; /* Firefox */
column-gap: 100px;
 -webkit-column-rule: 1px solid #cdcdcd; /* Chrome, Safari, Opera */
    -moz-column-rule: 1px solid #cdcdcd; /* Firefox */
    column-rule: 1px solid #cdcdcd;
}
#kommunikation  h1 {font-family:"Open Sans", sans-serif; color:#cc0000;}
#kommunikation  h3 {font-family:"Open Sans", sans-serif; color:#000000;  font-size: 1.3em;}
#kommunikation a {color:#cc0000;}

#text {
-webkit-column-count: 3; /* Chrome, Safari, Opera */
-moz-column-count: 3; /* Firefox */
column-count: 3;
-webkit-column-gap: 100px; /* Chrome, Safari, Opera */
-moz-column-gap: 100px; /* Firefox */
column-gap: 100px;
 -webkit-column-rule: 1px solid #cdcdcd; /* Chrome, Safari, Opera */
    -moz-column-rule: 1px solid #cdcdcd; /* Firefox */
    column-rule: 1px solid #cdcdcd;
}
#text h1 {font-family:"Open Sans", sans-serif; color:#cc0000;}
#text h3 {font-family:"Open Sans", sans-serif; color:#000000;  font-size: 1.3em;}
#text a {color:#cc0000;}
#text hr {width:30px}


#termine{
-webkit-column-count: 2; /* Chrome, Safari, Opera */
-moz-column-count: 2; /* Firefox */
column-count: 2;
-webkit-column-gap: 100px; /* Chrome, Safari, Opera */
-moz-column-gap: 100px; /* Firefox */
column-gap: 100px;
 -webkit-column-rule: 1px solid #cdcdcd; /* Chrome, Safari, Opera */
    -moz-column-rule: 1px solid #cdcdcd; /* Firefox */
    column-rule: 1px solid #cdcdcd;
}
#termine h1 {font-family:"Open Sans", sans-serif; color:#cc0000;}
#termine h3 {font-family:"Open Sans", sans-serif; color:#000000;  font-size: 1.3em;}
#termine a {color:#cc0000;}
#termine hr {width:30px}

#kontakt {
-webkit-column-count: 2; /* Chrome, Safari, Opera */
-moz-column-count: 2; /* Firefox */
column-count: 2;
-webkit-column-gap: 100px; /* Chrome, Safari, Opera */
-moz-column-gap: 100px; /* Firefox */
column-gap: 100px;
 -webkit-column-rule: 1px solid #ffffff; /* Chrome, Safari, Opera */
    -moz-column-rule: 1px solid #ffffff; /* Firefox */
    column-rule: 1px solid #ffffff;
	
}
#kontakt h1 {font-family:"Open Sans", sans-serif; color:#cc0000;}
#kontakt h3 {font-family:"Open Sans", sans-serif; color:#000000;  font-size: 1.3em;}
#kontakt a{color:#cc0000;}
#kontakt a:hover{color:#cc0000;}
#kontakt hr {width:30px}

#maps {
display:block;
position:relative;
width:100%;
margin:auto;
padding-left:0%;
padding-right:0%;
-webkit-column-count: 0; /* Chrome, Safari, Opera */
-moz-column-count: 0; /* Firefox */
column-count: 0;
text-align:left;
background:#eeeeee;
text-align:left;
font-size: 1.2em; 
}

/*Footer nicht dynamisch*/
footer{
display:block;
position:relative;
width:100%;
bottom:0px;
margin:auto;
background: rgba(102,102,102,0.9); 
color:#ffffff;
padding-top:0.5em;
padding-bottom:0.3em;
padding-left:8%;
padding-right:8%;
text-align:left;
background:#666666;
text-align:center;
font-size: 1.1em; 
}
footer a{color:#ffffff;}
footer a:hover{color:#ffffff;}


/*MOBILE STYLE*/


/*wenn Bildschirm kleiner als 600 Pixel, dann wird dieses Skript ausgeführt*/
@media screen and (max-width:800px){
	body {font-size: 90%;}
	header {display:block; position:relative; z-index:1000; width:100%; padding-left:0;}
	header img {width:auto; height: 90px; margin:auto; padding-left:6%; padding-right:6%; }
	#menubar {display:nn; z-index:2000; width:100%; left:0; padding-left:0%; padding-right:0%;/*soll  dargestellt werden*/}
	#menubar ul li a.menubotton {display:block; z-index:2000; width:100%;/*soll dargestellt werden*/	}
	nav {display:block; left:0;font-size:0.9em;}
	nav nav {
	display:block; 
	position:relative;
	z-index:2000;
	width:100%;
	left:0;
	}
	.fotos{padding-top:0px;}
	.carousel{padding-top:0px;}
	.carousel-caption{display:none}
	.portrait{border-radius: 50%; width:120px; float:left;padding:10px;}

	#titelzeile{display:block; position:relative; z-index:0; height: 100px; background: #ffffff; padding-top:20px; margin:0;  text-align:center; font-family:"Open Sans", sans-serif; font-size: 1.3em; color:#cc0000;}

	#profilmarker, #coachingmarker, #kommunikationmarker, #textmarker, #terminemarker, #kontaktmarker{
	display:block;
	position:relative;
	z-index:2000;
	margin:auto;
	padding-top:10px;
	padding-bottom:0px;
	text-align:left;
	font-family:"Open Sans", sans-serif;
	}
	#profilmarker h1{color:#cc0000; font-size:1.2em;} 
	#coachingmarker h1{color:#cc0000; font-size:1.2em;}
	#kommunikationmarker h1{color:#cc0000; font-size:1.2em;}
	#textmarker h1{color:#cc0000; font-size:1.2em;}
	#terminemarker h1{color:#cc0000; font-size:1.2em;}
	#kontaktmarker h1{color:#cc0000; font-size:1.2em;}

	#profil, #coaching, #kommunikation, #text, #termine, #kontakt, #maps {display:block; z-index:2000; width:100%; column-count:1;}
	#profil, #coaching, #kommunikation, #text, #termine, #kontakt, h1 {font-size:1.1em;}
	#profil, #coaching, #kommunikation, #text, #termine, #kontakt, h3 {font-size:1.0em;}
	footer {display:block;width:100%;font-size:0.9em;}
}


/*wenn Bildschirm kleiner 550 Pixel, dann wird dieses Skript ausgeführt*/
@media screen and (max-width:550px){
	body {font-size: 90%;}
    header {display: block; z-index:10; width:100%;}
	#menubar {display:none; z-index:2000; width:100%; margin-left:0; padding-left:0%; padding-right:0%;/*soll  dargestellt werden*/}
	#menubar ul li a.menubotton {
	display: none; z-index:2000; position:relative; width:100%; /*soll dargestellt werden*/
	}
	#fotos {display:block;}
	/* MENÜ */
	nav {
	display:none; 
	position:relative;
	z-index:2000;
	width:100%;
	padding-left:0%;
	padding-right:0%;
	left:0;
	top:0;
	min-height:auto;
	height:auto;
	box-sizing: border-box;
	float: none;	
	font-size: 0.85em;
	background:#ffffff;
	
		}
	/* Mainmenue */
	nav ul {
	display:none; 
 	 margin: 0;
	 padding: 0;
	
	 	}
 
	nav a {
  	display: block;
	width:100%;
 	 color: #000000;
	 text-decoration: none;
	 
	}

	nav ul li {
	display:none;
	width:100%;
 	 position: relative;
 	 float: left;
	  list-style: none;
	  	}
 
	nav ul li:hover {
	position:relative;
	z-index:500;
 	 background:#ffffff;
	}
 
	nav ul li a {
  	  padding: 1em;;
	}

	/* Submenue */

	nav ul ul {
  	position: absolute;
  	top: -9999px;
 	 left: -9999px;
 	box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.6);
	}
 
	nav ul ul li {
 	 float: none;
 	 min-width: 150px;
	 width:auto;
 	 border-bottom: 1px solid #999999;
	}
 
	nav ul ul li a {
 	 padding: 10px 10px;
	}

	/* Sondereinstellungen für Mainmenue und Submenue */
	nav ul li:hover > ul {
  	top: 100%;
 	 left: 0;
	}

	nav ul ul li:hover > ul {
  	top: 0;
 	 left: 200px;
	}

	nav ul li.submenu > a:after {
  	position: relative;
  	float: right;
  	content: '';
  	margin-left: 10px;
 	 margin-top: 5px;
  	border-left: 5px solid transparent;
 	 border-right: 5px solid transparent;
  	border-top: 5px solid #fff;
 	 border-bottom: 5px solid transparent;
	}

	nav ul ul li.submenu a:after {
  	margin-left: auto;
 	 margin-right: -10px;
  	border-left: 5px solid #fff;
  	border-right: 5px solid transparent;
 	 border-top: 5px solid transparent;
 	 border-bottom: 5px solid transparent;
	}

	nav ul ul li:last-child {
 	 border-bottom: none;
	}

	/* MENÜ ENDE */
	/*Fotos im Text*/
.portrait{display:block; border-radius: 50%; width:65%; float:none;padding:10px;}
.coaching1{display:block; border-radius: 50%; width:70%; float:none;padding:10px;}
.coaching2{display:block; border-radius: 0%; width:100%; float:none;padding:10px;}
.kommunikation{border-radius: 0%; width:160px; float:right;padding:10px;}
.veranstaltungen{border-radius: 0%; width:250px; float:right;padding:10px;}
/*Fotos im Text Ende*/
	/*Sprungziele*/
	footer {font-size:0.9em;}
		

}