/* Menüsteuerung
======================================================================================================================================================================================= */
nav {
	width:100%;								/* Menüleiste über die ganze Containerbreite */
	height:50px;							/* Höhe der Menüleiste für alle Geräte */
	font-size:1em;							/* Textgrösse in allen Menüblocks */
}

nav ul {
	width:100%;								/* Breite der Itemliste (wenn 100%, dann gleich breit wie die Mnnüleiste) */
	margin:0 auto;							/* Itemliste auf der Menüleiste zentrieren */
	height:auto;							/* Höhe des Menüs */
	list-style:none;						/* Ganze Liste ohne List-Styles */
}

/* Hauptmenü-Items */
.hm {
	position:relative;						/* Vorbereitung für korrekte horizontale Ausrichtung der Untermenüs unter den entsprechenden Hauptmenü-Items */
	width:20%;								/* Breite der Hauptmenü-Items (entsprechend der Anzahl Hauptmenü-Items */
	font-weight:bold;						/* Hauptmenü-Items in Fettschrift */
	border-right:1px solid #fff;			/* Trennlinie der Hauptmenü-Items rechts */
	float:left;								/* Hauptmenü-Items horizontal nebeneinander */
}
		
.hm:last-of-type {
	border-right:none;						/* Letzter Hauptmemü-Item ohne rechten Rand */
}

#hm_1 {width:10%;}
#hm_2 {width:18%;}
#hm_3 {width:18%;}
#hm_4 {width:15%;}
#hm_5 {width:15%;}
#hm_6 {width:12%;}
#hm_7 {width:12%;}

nav ul li a {								/* gilt primär für Haupt- und Untermenü-Links */
	text-decoration:none;					/* keine Unterstreichung der Menü-Links */					
	display:block;							/* ganzer Link-Bereich ankilckbar (nicht nur Text) */
	height:50px;							/* Höhe der Menü-Links (entsprechend der Höhe der Menüleiste */
	line-height:50px;						/* Text vertikal zentrieren */
	padding-left:3px;						/* Einzug des Textes in den Menü-Links */
}


/* Untermenü-Items */
.um {
	position:absolute;						/* Ausrichtung der Untermeü-Items */
	top:50px;								/* entsprechend der Höhe von nav ul li a */ 
	left:0;									/* Ausrichtung exakt unter dem entsprechenden Hauptmenü-Item */
	width:130%;								/* Breite der Untermenü-Items (an Textinhalt anpassen) */
	display:none; 							/* Untermenüs sind vorerst ausgeblendet */
	z-index:2;
}

#sub_5	{
	width:170%;
}

nav ul ul li a {							/* Überschreibungen für Untermenü-Links */
	font-weight:normal;						/* Untermenü-Links in Normalschrift */
	padding-left:10px;						/* Untermenü-Links stärker eingerückt */
	border-bottom:1px solid #960000;		/* Abschlusslinie unten für Untermenü-Links */
}


/* Farben für Items
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
nav {										
	background:#E5DAC0;						/* Hintergrundfarbe der Menüleiste */	
}

nav ul li a {								/* Hauptmenü-Links im Normalzustand */
	background:#ccc;
	color:#555;
}

nav > ul > li.active > a {					/* aktivierter Hauptmenü-Link */
	background:#666;
	color:#fff;
}

nav ul li a:hover {							/* Hauptmenü-Links beim Hovern */
	background:#aaa;
	color:#fff;
}

nav ul ul li a {							/* Untermenü-Links im Normalzustand */
	background:#eee;
	color:#555;
}

nav ul ul li a:hover {						/* Untermenü-Links beim Hovern */
	background:#aaa;
	color:#fff;
}

/* Spezielle Gestaltung einzelner Items
--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
#hm_btn_2,									/* Formatierung der zweizeiligen Menü-Items */
#hm_btn_3,
#sub_btn_4_1,
#sub_btn_4_2,
#sub_btn_5_1,
#sub_btn_5_2 {
	line-height:20px;
	padding-top:5px;
}		

#hm_btn_2:after {			
	content:'Prof. Dr. phil. nat. \A Sabina Gallati'; 
	white-space: pre;
}

#hm_btn_3:after {			
	content:'Prof. Dr. med. \A Richard Kraemer'; 
	white-space: pre;
}

#sub_btn_5_1:after {			
	content:'Prof. Dr. phil. nat. \A Sabina Gallati'; 
	white-space: pre;
}

#sub_btn_5_2:after {			
	content:'Prof. Dr. med. \A Richard Kraemer'; 
	white-space: pre;
}