/* Horizontales Menü mit 3 drop-down Ebenen */
/* ------------- 1. EBENE: ---------------- */

#top_menu ul { /* 1. Liste mit allen 1. Elementen */
	margin: 0;
	padding: 0;
	width: 900px;
	float: left;
	background: #665b54;
} 

#top_menu ul li { /* 1. Elemente, floatend links, horizontal angeordnet und relative positioniert (als container) */
	list-style: none;
	margin: 0;
	float: left;
	position: relative;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #353535;
}

#top_menu ul li a { /* 1. Link ohne UNTERLISTE: normaler bg */
	display: block;
	margin: 0;
	line-height: 30px;
	color: #fff;
	background: #665b54;
	text-decoration: none;
	font-family: arial, helvetica, sans-serif;
	font-size: 0.95em;
	padding-top: 0;
	padding-right: 30px;
	padding-bottom: 0;
	padding-left: 30px;
}

#top_menu ul li.parent a { /* 1. Link mit UNTERLISTE (.parent) : pfeil als bg, mehr padding rechts */
	padding-top: 0;
	padding-right: 46px;
	padding-bottom: 0;
	padding-left: 36px;
	background-color: #665b54;
	background-image: url(../bilder/layout/top_menu_drop_down.png);
	background-repeat: no-repeat;
	background-position: right;
}

#top_menu ul li a:hover { /* 1. Link - HOVER Effekt */
	background-color: #786f68;
}

#top_menu ul li.active a { /* Aktiver Link - 1. Ebene */
	font-weight: bold;
	color: #000;
	background-color: #fff;
}

/* ------------- 2. EBENE: ---------------- */

#top_menu ul ul { /* 2. LISTE: absolut positioniert, aus dem dok-fluss, über allen anderen elementen, fixe breite, kein bg mehr*/
	position: absolute;
	z-index: 500;
	width: auto;
	background: none; /* background übernehmen die "a" elemente */

}

#top_menu ul ul li { /* 2. ELEMENTE: nicht mehr floatend, relativ positioniert (als container) */
	float: none;
	margin: 0;
	position: relative;
	border: none;
}

* +html #top_menu ul ul li {
	/* IE - White Space BUG - workaround -> siehe bei links -> display: block! */
	display: inline;
}

* html #top_menu ul ul li {
	/* IE - White Space BUG - workaround -> siehe bei links -> display: block! */
	display: inline;
}

#top_menu ul li.parent ul li a { /* 2. LINK ohne Unterliste: fixe breite, kein img als bg */
	color: #fff;
	background: #697172;
	border-top: 1px solid #57696a;
	border-bottom: 1px solid #4b5b5c;
	width: 13em;
	line-height: 1.5em;
	font-weight: normal; /* weniger padding auf der linken seite */
	display: block;
	padding-top: 2px;
	padding-right: 25px;
	padding-bottom: 3px;
	padding-left: 15px;
}

#top_menu ul li.parent ul li.parent a { /* 2. LINK mit Unterliste: drop right als bg */
	background: #697172 url(../bilder/layout/top_menu_drop_right.png) no-repeat right;
	padding: 2px 25px 3px 15px; /* weniger padding auf der linken seite */
}

#top_menu ul li.parent ul li a:hover { /* 2. LINK - HOVER Effekt */
	background-color: #737b7c;
}


/* ------------- 3. EBENE: ---------------- */
#top_menu ul ul ul { /* 3. LISTE: absolut positioniert, aus dem dok-fluss, gleiche höhe wie parent, erbt breite, links verschoben*/
	position: absolute;
	z-index: 1000;
	width: auto;
	top: 0;
	left: 100%;
}

#top_menu ul ul ul li { /* 3. ELEMENTE: nicht mehr floatend, relativ positioniert (als container) */
	float: none;
	margin: 0;
	position: relative;

}

#top_menu ul li.parent ul li.parent ul li a { /* 3. LINK ohne Unterliste: erbt breite, neue bg-color, neue border-color*/
	background: #979d97;
	border-color:#7d8d7e;
}

#top_menu ul li.parent ul li.parent ul li a:hover { /* 3. LINK ohne Unterliste - HOVER Effekt*/
	background: #adb8ad;
}

/* listen die versteckt sein müssen */

div#top_menu ul ul,
div#top_menu ul li:hover ul ul,
div#top_menu ul ul li:hover ul ul
{display: none;}

div#top_menu ul li:hover ul,
div#top_menu ul ul li:hover ul,
div#top_menu ul ul ul li:hover ul
{display: block;}

