* {
	margin:0;
	padding:0;
 	list-style:none;
	box-sizing:border-box;
	font-family: Trebuchet MS, "Open Sans", sans-serif,  Arial;      
  /*color: #333;*/
  /*line-height: 1.35;
  font-size: 1rem;*/
}

body::after {
	/*content:'Resize Viewport ?';
	position: fixed;
	bottom:1em;
	right:1em;
	opacity: 0.5;
	font-size: 0.8em;*/
}

header {
	width:100%;
	background: #fff; /* #ebebeb */  
  border-bottom: 1px solid #DADFE2;
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1); /*  0 1px 20px rgba(0, 0, 0, 0.2); */
  overflow: hidden;    
}

.logo {
	display:block;
	width:100%;
	padding:1em;
	text-decoration:none;
	color:white;
}

nav {
	width:100%;
	float:right;
	background:#fff;
	height:0;
	overflow:hidden;
	transition: .2s ease-in-out;    
  z-index:9999;
    /*
    Höhe für normale Ansicht wird unten beim @media gemacht
  */
}

nav li {
	float:left;
	width:100%; 
  /*border-bottom: 0.1rem inset #DADFE2;*/
}

nav a {
	display:block;
	height:59px; /* Hier was geändert wegen dem transition beim hover */
	width:100%;
	padding:1em 0.5em 1em 0.5em;
  /*margin:1em 0.5em 1em 0.5em;*/
	text-decoration:none;
	color:black;
  border-bottom: 3px solid white; /* nicht sichtbare Border wegen transition umschalten und INIT Farbe*/
}

nav a.ALT:hover { /* Menübuttons im Normalen Menü - hover */
	background: WhiteSmoke; /*rgba(0,0,0,0.2);*/      
  height:65px;
}

nav a:hover { /* Menübuttons im Normalen Menü - hover */
	background: WhiteSmoke; /*rgba(0,0,0,0.2);*/    
  height:59px;   
  border-bottom: 3px solid #00FFFF; /*LightSkyBlue;*/ 
  transition: .2s ease-in-out;  
  /*INFO:::: in nav a beim height was geändert wegen dem transition beim hover */
}

nav a.aktiv_ALT { /* Aktiver Menübutton im Normalen Menü */
	background: WhiteSmoke;*/ /*rgba(0,0,0,0.2);*/ 
  height:65px;   
       
}

nav a.aktiv { /* Aktiver Menübutton im Normalen Menü */
	background: WhiteSmoke; /*rgba(0,0,0,0.2);*/  
  height:59px;   
  border-bottom: 3px solid #00FFFF; /*LightSkyBlue;*/   
}
 
.nav-toggle { /* Burgermenü Normalzustand*/
	background: white; /*LightSkyBlue - LightSteelBlue*/ ;/*rgba(0,0,0,0.3);*/
	display:block;
	position:absolute;
	right:0;
	top:5;
	padding:0.5em;
  padding-left:1rem;
	color:black;
	cursor:pointer;
	text-decoration:none; 
  height:58px;  
  min-width:55px;
  z-index:9990;
  font-size:24px;
  font-weight:bold;    
}

.nav-toggle:hover { /* Burger-Menü Button beim hover */
	background: LightSkyBlue;  /*LightSteelBlue; LightSkyBlue;/*rgba(0,0,0,0.2);*/
}

#nav-open:target .nav-closed {
	display:block; 
}

.nav-closed,
#navi-closed:target .nav-closed,
#nav-open:target .nav-open {
	display:none;
}


.submenue {
		width:100%;
		display:block !important;
		min-height:40px; 
    overflow: hidden;  
    float:right;
    position: fixed;  
    top:60px;    
    -moz-transform: translateZ(0);
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    z-index: 1000;          
    /* background-color:red;*/  
    text-align:center;   
    border-bottom: 0.1rem inset #D4D4D4; /*#DADFE2;*/
    /* INFO::::
    Eigenschaften werden unten nochmal für den Chrome per media query gesetzt 
    */
}

a.menueContentHeader {
    line-height: 20px;
    font-weight: 500;
    color: black; /*#848484*/
    text-decoration: none;   
    border-bottom: 0px solid silver; /* 0px border da das dann die Zustand/Farbe ist vor dem einlbenden des aktiven border welcher durch transition verzögert wird */ 
    cursor: pointer;
}  
   
a.menueContentHeaderAktiv {    
    line-height: 20px;
    font-weight: 500;
    color: black; /*#848484*/
    text-decoration: none;   
    border-bottom: 1px solid #00FFFF; /* Start-Farbe kommt vo der Border im nicht Aktiv Zustand welche dann über transition eingelendet wird*/
    cursor: pointer;        
    transition: .4s ease-in-out;
}

a.menueContentHeaderZurueck {
    line-height: 12px;
    font-weight: 200;
    color: black; /*#848484*/
    text-decoration: none;   
    border-bottom: 0px solid #00FFFF ; /* 0px border da das dann die Zustand/Farbe ist vor dem einlbenden des aktiven border welcher durch transition verzögert wird */ 
    cursor: pointer;
    font-size:0.7rem;
}

a.menueContentHeaderZurueck:hover {
  text-decoration:underline;
}


/* Kleine Auflösung - Links 2 reihig und NAV-Menü  */
@media screen and (max-width: 749px) { /* IPHONE / PAD */

  .nav-toggle-2 {display:none !important;} /* DIV wo links oben  Voltigieren Herxheim steht 1 Reihig*/  
  .nav-toggle-3 {display:block !important;} /* DIV wo links oben Voltigieren Herxheim steht 2 Reihig*/

	#nav-open:target nav { /* Aufgeklapptes Burger-Menü */
		min-height:502px; /* 448 */     
    max-height:560px;
    background: AliceBlue; /*LightSteelBlue;*/ ;/*rgba(0,0,0,0.1);*/
    z-index:9999;   
	} 
  
  nav li { /* Menüeintrage im Burger-Menü */
   border-bottom: 0.1rem dotted LightSteelBlue;
  } 
  
  nav a { /* Menüeintrag im Burgermenü */ 
	    
   height:55px;   
   border-bottom: 0px solid LightSkyBlue; /*Border immer da lassen wegen dem transition, aber ausgeblendet */
  }   
  
  nav a:hover { /* Beim Überfahren eines Menüeintrages im Burger-Menü */ 
	 background: LightSkyBlue; /*rgba(0,0,0,0.2);*/   
   height:55px;   
   border-bottom: 3px solid LightSteelBlue;
  } 
  
  nav a.aktiv { /* Aktiver Menüeintrag im Burger-Menü */
	 /*background:rgba(0,0,0,0.2);*/        
    height:55px;
    border-bottom: none;
   }    
   
  .submenue {
    position: relative; 
    top:12px; 
  }
  
    
  /*.nav-toggle {display:block;} */ /* PG 07.05.2018::: Wozu ist das gut ?? dadurch hat sich das Menü nicht mehr geöffnet ?!? */ 
}

@media screen and (max-width: 749px) and (-webkit-min-device-pixel-ratio:0) { /* IPHONE / PAD UND Chrome */
  nav li {    
    /*border-bottom: 0.1rem dotted LightSteelBlue;*/ 
  }
    
}


/* Mittlere Auflösung - Links 2 Reihig und Rechts normales Menü */
@media screen and (min-width: 750px) {
  
	.nav-toggle {display:none !important;} /* BurgerMenue abschalten */
  .nav-toggle-2 {display:none !important;} /* DIV wo links oben  Voltigieren Herxheim steht 1 Reihig*/  
  .nav-toggle-3 {display:block !important;} /* DIV wo links oben Voltigieren Herxheim steht 2 Reihig*/
  
	div.erstesElement {
    position:relative;
    top:45px;
	}
  
	nav {
		width:auto;
		display:block !important;
		min-height:60px; 
    overflow: hidden;  
    float:right;
    position: fixed;
    right:10px;
    -moz-transform: translateZ(0);
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    z-index: 9999;
	}     
  
	header {
		display:block !important;
		height:60px; 
    overflow: hidden;  
    position: fixed;
    -moz-transform: translateZ(0);
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    z-index: 9999;
	}  

	
	nav li {
		width:auto;
		padding:0;	
	}
  
  

  
}


/* Breite Auflösung */
@media screen and (min-width:1070px) {
	
	.nav-toggle {display:none !important;}
  .nav-toggle-2 {display:block !important;} /* DIV wo links oben  Voltigieren Herxheim steht 1 Reihig*/
  .nav-toggle-3 {display:none !important;} /* DIV wo links oben  Voltigieren Herxheim steht 2 Reihig*/
  
	
	.logo {
		width:auto;
		float:left;	
	}           
  
	
	nav {
		width:auto;
		display:block !important;
		height:60px; 
    overflow: hidden;  
    float:right;
    position: fixed;
    right:50px;
    -moz-transform: translateZ(0);
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    z-index: 9999;
	}     
  
	header {
		display:block !important;
		height:60px; 
    overflow: hidden;  
    position: fixed;
    -moz-transform: translateZ(0);
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    z-index: 9999;
	}  

	
	nav li {
		width:auto;
		padding:0;	
	}   
  
	div.erstesElement {
    position:relative;
    top:61px;
	}  
  
  .submenue {
		min-height:40px; 
    position: fixed;  
  }    
  
  
}


/* Chrome */
@media screen and (-webkit-min-device-pixel-ratio:0) {

 .submenue {    
    border-bottom: 1px inset #DADFE2; 
 }


}