/* **************************************************************************************** */
/* ======================================================================================== */
/*									HORIZONTALES CSS MENU									*/
/* ---------------------------------------------------------------------------------------- */
/*								Copyright © 2007 MUELLER.RO									*/
/* ======================================================================================== */
/* **************************************************************************************** */

/* ======================================================================================== */
/* - Definitionen für das DIV des Menus (Hauptcontainer) - */
#menu_container {
	margin:0px;		/* Entfernen der Platzhalter/Ränder */
	position:relative;	/* Position */
	width:762px;	/* Weite des DIVs */
	height:27px;	/* Höhe des DIVs */
/*	z-index:100;	 "Layer"-Ebene des DIVs = 100 ( = Hinterste) */
	background:transparent url(../images/menu_bg.gif);
}

/* ======================================================================================== */
/* - Säubern/Entfernen der Liste (ul) - */
#cssmenu, #cssmenu ul {
	padding:0;	/* Padding entfernen */
	margin:0;	/* Margin entfernen */
	list-style-type: none;	/* Bullets entfernen */
}

/* ======================================================================================== */
/* - Definieren der ersten Menupunkte - */
#cssmenu a, #cssmenu a:visited {
	display:block;	/* Darstellung als ein Element */
	width:94px;	/* Weite der Submenupunkte */
	font-size:11px;	/* Schriftgrösse des ganzen Menus */
	font-family: tahoma;	/* Schriftart des ganzen Menus */
	color:#FFFFFF;	/* Schriftfarbe des ganzen Menus */
	height:25px;	/* Höhe der Submenupunkte */
	line-height:25px;	/* Positionieren des Textes in der Höhe! */
	text-decoration:none;	/* Keine zusätzlichen Textformatierungen erlauben */
	text-indent:5px;	/* Einrücken des Textes von links */
	border:1px solid #000000;	/* Dicke und Farbe des Randes festlegen */
	border-width:1px 0 1px 1px;	/* Positionen des Randes festlegen */
}

/* ======================================================================================== */
/* - Ränder der Submenus festlegen - */
#cssmenu li ul li a, #cssmenu li ul li a:visited {
	border-width:0 1px 1px 1px;	/* Positionen des Randes des Sublevels festlegen */
}
#cssmenu li a.enclose, #cssmenu li a.enclose:visited {
	border-width:1px;	/* Randes für den ersten Punkt des Sublevels festlegen */
}

/* ======================================================================================== */
/* - Ausrichtung der Subelemente - */
#cssmenu li {
	float:left;	/* Positionierung nachfolgender Elemente des aktuelle Element (umfließen) */
	background:#E70104;	/* Hintergrungfarbe der Submenupunkte */
}

/* ======================================================================================== */
/* - Definieren des Hover Zustandes - */
#cssmenu li:hover {
	position:relative;	/* Position für Non-IE Browser und IE7*/
}
#cssmenu li:hover > a {
	background:#F9D200;	/* Hintergrungfarbe für den Hover-Zustand */
	color:#E70104;	/* Schriftfarbefarbe für den Hover-Zustand */
}
#cssmenu li ul {
	display:none;	/* Verhindern, dass die Submenues angezeigt werden */
}

#cssmenu li:hover > ul {
	display:block;	/* Erzwingt einen Block - d.h. das Element erzeugt eine neue Zeile */
	position:absolute;	/* Position für Non-IE Browser und IE7*/
	top:-7px;	/* Positionieren der 3.Ebene von oben */
	left:65px;	/* Positionieren der 3.Ebene von links */
	padding:6px 30px 30px 30px; /* Paddings fuer 2. Ebene */
	background:transparent url(../images/transparent.gif);	/* Hintergrund um das Submenu */
}

#cssmenu > li:hover > ul {
	left:-30px;	/* Positionieren des Submenus von links */
	top:20px;	/* Positionieren des Submenus von oben */
}

/* ======================================================================================== */
/* - Entfernen des Table-Hacks für IE 6 - */
#cssmenu table {
	position:absolute;
	border-collapse:collapse;
	top:0;
	left:0;
	z-index:100;
	font-size:1em;
}

/* ======================================================================================== */
/* - Der "hovered" Link für IE 5.5 & 6  - */
* html #cssmenu li a:hover {
	position:relative;	/* Anpassungen für IE 5.5 und IE 6 */
	background:#F9D200;	/* Hintergrundfarbanpassungen für IE 5.5 und IE 6 :hover */
	color:#E70104;	/* Schriftfarbanpassungen für IE 5.5 und IE 6 :hover */
}

/* ======================================================================================== */
/* - Der "active & focus" Link für IE 5.5 & 6  - */
#cssmenu li a:active, #cssmenu li a:focus {
	background:#F9D200F;	/* Hintergrundfarbe anpassen für :active bzw. :focus im IE 5.5 und IE 6 */
	color:#E70104;	/* Schriftfarbe anpassen für :active bzw. :focus im IE 5.5 und IE 6 */
}

/* ======================================================================================== */
/* - Grafiken für Sublevels - */
#cssmenu li.sub {
	background:#E70104 no-repeat right center;	/* Hintergrundfarbe & Grafik der Subpunkte mit untermenu */
}
#cssmenu li.first {
	background:#E70104 url(../images/drop.gif) no-repeat right center; /* Hintergrundfarbe der Hauptpunkte */
}

/* ======================================================================================== */


/* Spezifische Definitionen nur für den IE (5.5 & 6) - (Ermöglichen des erscheinen für IE) */
/* ======================================================================================== */
/* - Anpassen des Drop Down Levels - (display:none; zu visibility:hidden;) */
* html #cssmenu li ul {
	visibility:hidden;
	display:block;
	position:absolute;
	top:-7px;
	left:65px;
	padding:10px 30px 30px 30px;
	background:transparent url(../images/transparent.gif);
}

/* ======================================================================================== */
/* - 3.Ebene verstecken bei öffnen der 1.Ebene - */
#cssmenu li a:hover ul ul{
	visibility:hidden;
}
/* - 4.Ebene verstecken bei öffnen der 2.Ebene - */
#cssmenu li a:hover ul a:hover ul ul{
	visibility:hidden;
}
/* - 5.Ebene verstecken bei öffnen der 3.Ebene - */
#cssmenu li a:hover ul a:hover ul a:hover ul ul{
	visibility:hidden;
}
/* - 6.Ebene verstecken bei öffnen der 4.Ebene - */
#cssmenu li a:hover ul a:hover ul a:hover ul a:hover ul ul {
	visibility:hidden;
}

/* ======================================================================================== */
/* - 2. Ebene sichtbar machen und positionieren, wenn 1.Ebene geöffnet wird - */
#cssmenu li a:hover ul {
	visibility:visible;
	left:-30px;
	top:14px;
	lef\t:-31px;
	to\p:15px;	/* Positionieren der 2.Ebene von oben für IE */
}
/* - 3. Ebene sichtbar machen und positionieren(aller weiterer Unterebenen), wenn 2.Ebene geöffnet wird - */
#cssmenu li a:hover ul a:hover ul{ 
	visibility:visible;
	top:-11px;	/* Positionieren der 3.Ebene von oben für IE */
	left:64px;	/* Positionieren der 3.Ebene von links für IE */
}
/* - 4. Ebene sichtbar machen, wenn 3.Ebene geöffnet wird - */
#cssmenu li a:hover ul a:hover ul a:hover ul { 
	visibility:visible;
}
/* - 5. Ebene sichtbar machen, wenn 4.Ebene geöffnet wird - */
#cssmenu li a:hover ul a:hover ul a:hover ul a:hover ul { 
	visibility:visible;
}
/* - 6. Ebene sichtbar machen, wenn 5.Ebene geöffnet wird - */
#cssmenu li a:hover ul a:hover ul a:hover ul a:hover ul a:hover ul { 
	visibility:visible;
}
/* Weitere Ebenen können nach dem gleichen Schema hinzugefügt werden! */

.down { padding-top:1px; }