﻿/*
	--- statisches hor. Dropdown menu ohne JS, Level 0-1 ---
	09.08.2009, dogan

	©2009 Tanyel Dogan, alle Rechte vorbehalten

*/

.dropdown_outer_container{
	padding:0;
	float:left;
	clear:both;
	position:relative;
	/*optimalerweise hier schon relative und z-index für das komplette Dropdownmenu,
	da die nachfolgenden floats auch alle position relative haben*/
	z-index:1000000;
}
.dropdown_container{
	float:left;
	clear:both;
	/*Sicherheitshalber, damit immer über absolut positioniertem Element steht.*/
	position:relative;
}


.dropdown{
	width:750px;

	/*Schriftgrösse festgesetzt, um CMS Schriftskalierung zu umgehen*/
	font-size:12px;
	float:left;
	clear:both;
}
.dropdown ul{
	list-style:none;
	margin:0;
	padding:0;
}
.dropdown li{
	margin:0;
	padding:0;
}

.dropdown li.li0{
	float:left;
	position:relative;
}
.dropdown li.li_last{
	margin-right:0px;
}
.dropdown a{
	color:black;
	text-decoration:none;
}
.dropdown .tab{
	/*Dadurch, dass hier position:absolute ist, aber kein left/top angegeben, können
	die übergeordneten li-Elemente direkt aufeinander floaten. Sie orientieren sich jedoch wg. der
	fehlenden left/top-Angabe weiter an der Position, die sie auch im floating einnehmen würden (unterhalb des li0-Buttons).
	Der untergeordnete DIV nimmt durch die absolute Positionierung im floating keinen Platz ein.*/
	position:absolute;
/*Kein padding, da das tab in diesem Projekt direkt ohne Spalt unter dem REgisterbutton stehen soll. Typisch wäre ca. 2-3px*/
padding-top:0px;
	/*höheren z-Index setzen, damit der Untercontainer immer über den Buttons schweben kann.*/
	z-index:1;
	/*dieser Container ist standardmässig unsichtbar und wird/bleibt sichtbar sobald/solange die Maus auf einem
	seiner untergeordneten Elemente ist.
	Funktioniert nur mit CSS in allen Browsern ausser IE6, da dieser hover nur auf A oder IMG erkennt.*/
	display:none;
}
	/*--- hover ---*/
	.dropdown li.li0:hover .tab{
		/*Findet auf dem übergeordneten LI ein hover statt, so wird sub eingeblendet. Dies hält so lange, wie
		die Maus auf dem li0 oder einem seiner Unterelemente ist.
		ACHTUNG: aus Performancegründen wird auf darauf verzichtet parallel einen hover nur für IE6 festzulegen.
		Dies macht sich spürbar positiv bemerkbar beim Aufklappen des sub-Containers in allen anderen Browsern*/
		display:block;
	}
		.dropdown li.li0:hover a.a0{
			background-color:#66A5CE;
		}
			.dropdown li.li0:hover a.a0 span{
				color:white;
				background-image:url(images-apra/hm-on.png);
			}

/*tabjoin besteht aus 2 ineinandergeschachtelten DIVs, die als optische Brücke zwischen Registerbutton und tab
dienen. DIes überdeckt z.B. eine border-top des tab-DIV. Hierzu muss tabjoin in z-Richtung hinter dem Registerbutton stehen,
aber vor dem dem tab-DIV*/
.dropdown .tabjoin{
	position:absolute;
	left:0px;
	top:0px;
	width:100%;
	font-size:12px;
	visibility:hidden;
}
	.dropdown .tabjoin div{
		background-repeat:repeat-y;
		background-position:right top;
		width:100%;
		padding:5px 0 12px 0;
	}
		.dropdown li.li0:hover .tabjoin{
			visibility:visible;
		}


.dropdown .sub{
	width:220px;
	padding:1px;
	border-top:1px solid white;
	background-color:#19308D;
}
.dropdown ul.ul1{
	background-color:white;
}
.dropdown ul.ul1 li{
	display:inline;
}
.dropdown a{
	display:block;
}
.dropdown a.a0{
	display:block;
	text-decoration:none;
	font-weight:bold;
	background-repeat:repeat-x;
	background-position:left top;
	position:relative;
	/*BEACHTE: für die Buttons wird die CMS Schriftskalierung nicht übernommen, da sie sich nicht vertikal ausdehnen können.
	Hierzu wird eine fixe Schriftgrösse in Pixel gesetzt. Dies verhindert aber nicht, dass die Schrift mit browsereigenen
	Funktion global vergrössert wird !*/
	font-size:12px;
	color:white;
	padding:3px 7px 4px 8px;
	margin-right:1px;
}
	.dropdown a.m_first{
	}
	.dropdown a.m_last{
	}

.dropdown a.a0 span{
	padding:0 13px 0 24px;
	background-image:url(images-apra/hm.png);
	background-repeat:no-repeat;
	/*BEACHTE: wg. NS7 dürfen absolute Pixelwerte und Stringwerte in position nicht gemischt werden.
	Die vertikale Positionierung funktioniert zwar in allen Browsers, aber im Opera ist das Bullet 1px höher als
	in allen anderen Browsern.*/
	background-position:6px 0px;
	display:block;
	/*WICHTIG für IE6, da sonst rechte ecke nicht gezeigt wird.*/
	position:relative;
}
/*alle Browser, aktiver lvl0 Menupunkt fett*/
.dropdown li.li0 a.lvl_0_act{
	background-color:#66A5CE;
}
.dropdown li.li0 a.lvl_0_act span{
	font-weight:bold;
	background-image:url(images-apra/hm-on.png);
}

.dropdown .tab a{
	padding:4px 5px 5px 32px;
	display:block;
	position:relative;

	background-image:url(images-apra/hm.png);
	background-repeat:no-repeat;
	background-position:13px 4px;

}
.dropdown .tab a:hover{
	color:white;
	background-color:#66A5CE;
	background-image:url(images-apra/hm-on.png);
}

