/* DropSENSE V1.2
Created by Stefan Weinmann
Email: info@w-project.de
visit: www.w-project.de

Joomla1.5:
-----------
1. Menustyle des Menus auf list setzen. TIPP: Suffix vergeben
2. Die CSS Datei in eurem Templateordner per ftp kopieren
3. CSS Datei in der index.php migrieren
4. Suffixe in CSS Datei anpassen.
*/

/* Menumodul mit suffix: _dropdown*/
.module_dropdown *{
	color: #ffffff;
	list-style-type: none;
	padding: 0px;
	margin: 0px;
}
.module_dropdown {
	position:relative;
	}
/* Allgemeine Angaben zu den Listenelementen */
/* ------------------------------------------*/

/* erstes ul des Menumodules */
.module_dropdown ul{
	position: absolute;                  /* Wichtig um den Dropdown über dem Content zu legen*/
	display: inline;
	width: 1000px;                       /* IE BUGFIX --> möglichst Breiter als die tatsächlich benötigte Breite des Menus*/
	z-index: 1;
	height: auto;
	overflow:visible;
	}

/* erstes li des Menumodules */
.module_dropdown ul li{
	position:relative;
	width: 87px;                        /* Breite der einzelnen Menupunkte erster Ebene */
	float: left;
	height: 30px;                        /* Höhe des Menüs erster Ebene */
	display: inline;
	background: transparent;             /* Farbe des Menüs erste Ebene */
	overflow: visible;
	z-index: 3;                          /* Opera Bugfix --> Hiermit wird im Opera eine Scrolleiste verindert! */
	}


/* zweites ul des Menumodules == submenu welches den DROPDOWN-EFFEKT haben soll*/
.module_dropdown ul ul{
	text-align:left;
	position:absolute;
	top:30px;
	left: 0px;
	visibility: hidden;
	margin-top: 0px;
	padding-top: 0px;                   /* Setzt etwas Abstand zwischen erster und zweiter Ebene */
	width: 150px;                       /* Breite zweiter Ebene */
	height: auto;
	overflow: visible;

	}

/* zweites li des Menumodules == einzelne Elemente des Submenus */
.module_dropdown ul ul li{
	list-style-type: none;/* Keine Aufzählungszeichen */
	background: #36980B;   /* Hintergrundfarbe der Ersten Menüebene */
	width: 130px;         /* Breite der ersten Menüebene (muss mit der Breite des ul übereinstimmen!) */
	height: 30px;         /* Höhe der einzelnen Listen-Elemente */
	margin: 0px;          /* Kein marging */
	padding: 0px;         /* Kein padding */
	overflow:visible;     /* Sonst erscheint das Menü nicht */
	position:relative;    /* Diese Positionsart MUSS relativ sein */
	float:left;           /* IE6 Bugfix */
	border: 0px;
	}

/* drittes ul des Menumodules == zweites submenu welches rechts neben dem ersten Submenu angezeigt wird*/
.module_dropdown ul ul ul{
	visibility: hidden;   /* Dies MUSS hidden sein */
	position: absolute;   /* Diese Positionsart MUSS relativ sein */
	left:150px;           /* Breite des Container der folgenden Ebenen */
	top: 0px;            /* Aufgrund des borders hier 1 nach oben gerückt */

	}
/* drittes li des Menumodules == einzelne Elemente des Submenus */
.module_dropdown ul ul ul li{
	list-style-type: none;/* Keine Aufzählungszeichen */
	background:#36980B;   /* Hintergrundfarbe für alle folgenden Ebenen */
	width: 150px;         /* Breite der ersten Menüebene (muss mit der Breite des ul übereinstimmen!) */
	height: 30px;         /* Höhe der einzelnen Listen-Elemente */
	margin: 0px;          /* Kein marging */
	padding: 0px;         /* Kein padding */
	overflow:visible;     /* Sonst erscheinen die folgenden Menüebenen nicht */
	position:relative;    /* Diese Positionsart MUSS relativ sein */
	}

/* Hover-Effekte des Menus */
/* ------------------------*/



/* Mouse-over des ersten li */
.module_dropdown ul li:hover{
	background: #36980B; /* Farbe des HOVER-EFFEKTS erster Ebene */
	height: 30px;
	}

/* Mouse-over aller folgenden li */
.module_dropdown ul ul li:hover{
	background: #2BC013;    /* Farbe des HOVER-EFFEKTS der folgenden Ebenen */
	height: 30px;
	}




/* Es gehören immer ein "li:hover ul" und ein "li:hover ul ul" zu einer Menüebene. 
Wenn eine zusätzliche Menüebenen gebraucht wird muss das letze Pärchen kopiert werden und ein "ul" als Präfix bei Beiden vorangestellt werden.
Das wiederholt man so oft wie man Menüebenen zusätzlich benötigt. */


/* 1.Ebene = 1 ul */
.module_dropdown ul li:hover ul{
	visibility:visible;   /* Muss visible sein sonst erscheint das Menü nicht */
	}
.module_dropdown ul li:hover ul ul{
	visibility:hidden;    /* Muss hidden sein, sonst erscheinen alle folgenden Menüebenen auf einmal */
	}
/* 2.Ebene = 2 ul */
.module_dropdown ul ul li:hover ul{
	visibility:visible;   /* Muss visible sein sonst erscheint das Menü nicht */
	}
.module_dropdown ul ul li:hover ul ul{
	visibility:hidden;    /* Muss hidden sein, sonst erscheinen alle folgenden Menüebenen auf einmal */
	}
/* 3.Ebene = 3 ul */
.module_dropdown ul ul ul li:hover ul{
	visibility:visible;   /* Muss visible sein sonst erscheint das Menü nicht */ 
	}
.module_dropdown ul ul ul li:hover ul ul{
	visibility:hidden;    /* Muss hidden sein, sonst erscheinen alle folgenden Menüebenen auf einmal */
	}
/* 4.Ebene = 4 ul */
.module_dropdown ul ul ul ul li:hover ul{
	visibility:visible;   /* Muss visible sein sonst erscheint das Menü nicht */ 
	}
.module_dropdown ul ul ul ul li:hover ul ul{
	visibility:hidden;    /* Muss hidden sein, sonst erscheinen alle folgenden Menüebenen auf einmal */
	}

/* Allgemeine Schriftformatierung  */
/* --------------------------------*/

/* Link Beschriftung des ersten li */
.module_dropdown ul li a{
	position:absolute; /*Ie Bugfix*/
	line-height: 30px; 
	width: 100%;
	text-align: center;
	}
.module_dropdown ul li a span{
	color:white;  /* Schriftfarbe der ersten Ebene */
	}
.module_dropdown ul li:hover a span{
	color:black;  /* Schriftfarbe der ersten Ebene bei hover der ersten Ebene*/
	}


/* Link Beschriftung des zweiten li bzw. Submenu*/
.module_dropdown ul ul li a{
	line-height: 30px;
	height: 30px;
	width: 100%;
	display:block;
	padding-left: 5px;
	text-align:left;
	}