/* Haupt Navigation */
#nav {
	position:relative;
	width:100%; 
	margin: 0px;
	padding:0px;
}

ul#navigation {
	display:inline;
	margin-right: 0px;
	margin-top: 0.200em;
	margin-bottom: 0.000em;
	position:relative;
	border-left:0px solid #c4dbe7;
	border-right:0px solid #c4dbe7;
	background-color: transparent;  /* Navigation hintergrund */
    float: right;
}


ul#navigation li {
	display:inline;
	font-size: 100%;
	font-weight: 600;
	font-family: var(--menuschrift);
	margin-right:0.063em;
	padding:0;
	float:left;
	position:relative;
	border-top:0px solid #CCCCCC;
	border-left:0px solid #CCCCCC;
	border-right:0px solid #CCCCCC;
	border-bottom:0px solid #CCCCCC;
	border-top-left-radius: 0.000em;
 	border-top-right-radius: 0.000em; 
	border-bottom-left-radius: 0.000em;
 	border-bottom-right-radius: 0.000em; 
    }

ul#navigation li a {
	padding: 8px 8px;
	color:#000000;
	text-decoration:none;
	text-transform: uppercase;
	display:inline-block;
	border-right:0px solid #fff;
	border-left:0px solid #C2C2C2;
	border-top:0px solid #fff;
	border-bottom:0px solid #fff;
	background: #ffffff; /* stufe1 hintergrund */

	
	-webkit-transition:color 0.1s linear, background 0.1s linear;	
	-moz-transition:color 0.1s linear, background 0.1s linear;	
	-o-transition:color 0.1s linear, background 0.1s linear;	
	transition:color 0.1s linear, background 0.1s linear;	
}

ul#navigation li a:hover { /* stufe1 hover */
	color:#ffffff;
}
ul#navigation li:hover > a { /* stufe1 hover */
	background: var(--grundfarbemenu_hintergrund);
	color: var(--grundfarbemenu);
}
ul#navigation li a.aktiv, ul#navigation li a.aktiv:hover { /* stufe1 aktiv */
	background: var(--grundfarbemenu_hintergrund);
	color: var(--grundfarbemenu);
}

ul#navigation li a.first {
	border-left: 0 none;
}

ul#navigation li a.last {
	border-right: 0 none;
}


/* Drop-Down Navigation */
ul#navigation li:hover > ul
{
/*these 2 styles are very important, 
being the ones which make the drop-down to appear on hover */
	visibility:visible;
	opacity:1;
}

ul#navigation ul, ul#navigation ul li ul {
	list-style: none;
    margin: 0;
    padding: 0;    
/*the next 2 styles are very important, 
being the ones which make the drop-down to stay hidden */
    visibility:hidden;
    opacity:0;
    position: absolute;
    z-index: 99999;
	font-size: 90%;
	width:260px;
	background:#ff0000;
	text-align: left;
/* css3 transitions for smooth hover effect */
	-webkit-transition:opacity 0.2s linear, visibility 0.2s linear; 
	-moz-transition:opacity 0.2s linear, visibility 0.2s linear; 
	-o-transition:opacity 0.2s linear, visibility 0.2s linear; 
	transition:opacity 0.2s linear, visibility 0.2s linear; 	
}

ul#navigation ul {
    left: 0px;
	background: var(--grundfarbemenu_hintergrund); /* stufe2 hintergrund */
	width:230px;
	color:#000000;
}
ul#navigation ul li a:hover { /* stufe2 hover */
	background: var(--grundfarbemenu_hintergrund);
	color: var(--grundfarbemenu);
    width:230px;
}

ul#navigation ul li a.aktiv, ul#navigation ul li a.aktiv:hover { /* stufe2 aktiv */
	background: var(--grundfarbemenu_hintergrund);
	color: var(--grundfarbemenu);	
}


ul#navigation ul li ul {
    top: 0;
    left: 230px; /* strong related to width:180px; from above */
	background: var(--grundfarbemenu_hintergrund); /* stufe3 hintergrund */
	width:230px;
}
ul#navigation ul li ul a:hover { /* stufe3 hover */
	background: var(--grundfarbemenu_hintergrund);
	color: var(--grundfarbemenu);
}

ul#navigation ul li ul a.aktiv, ul#navigation ul li ul a.aktiv:hover { /* stufe3 aktiv */
	background: var(--grundfarbemenu_hintergrund);
	color: var(--grundfarbemenu);
}


ul#navigation ul li ul li ul {
    top: 0;
    left: 230px; /* strong related to width:180px; from above */
	background:#f9f9f9; /* stufe4 hintergrund */
	width:230px;
}
ul#navigation ul li ul li ul a:hover { /* stufe4 hover */
	background:#999999;
	color: var(--grundfarbe);
}
ul#navigation ul li ul li ul a.aktiv, ul#navigation ul li ul li ul a.aktiv:hover { /* stufe4 aktiv */
	background:#999999;
	color:#ffffff;
}


ul#navigation ul li {
	clear:both;
	width:100%;
	border:0 none;
    margin: 0px;
	border-bottom: 1px solid #c9c9c9;
}


ul#navigation ul li a {
	background:none;
	padding:7px 15px;
    margin: 0px;
	color:#000000;
	text-decoration:none;
	display:inline-block;
	border:0 none;
	float:left;
	clear:both;
	width:230px;
	text-transform: uppercase;
    font-weight: 400;
}

