/* ---------level 1 - horizontal menu--------------*/

/* Bereich der horizontalen Navigationsleiste */
div.navigation {
	position: absolute;
	top: 100px;
	margin-left: 50%;
	margin-right: 50%;
	left: -352px;
	height: 26px;
	width: 705px;
}
/* IE Hack */
* html div.navigation{
	left: -705px;
}


/* Die Navigationselemente sind innerhalb von geschachtelten Listen organisiert. */
div.navigation ul {
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}

/* Die Elemente der ersten Ebene sind horizontal angeordnet
 * und werden wie Karteireiter angezeigt.
 */

div.navigation li {
	position: relative;
	float: left;
	height: 26px;
	background: url(../ornaments/top_link_right.png) top right no-repeat;
	border-bottom: 1px solid black;
	padding-left: 0px;
	cursor: pointer;
}
/* IE Hack */
* html div.navigation li {
	border-bottom: none;
}

/* add a rounded border to the leftmost element */
div.navigation li#praxis.first a {
	margin-left: 12px;
}
div.navigation li#praxis span.first{
	display: block;
	float: left;
	width: 12px;
	height: 26px;
	background: url(../ornaments/top_menu_left.png) top left no-repeat;
}

/* add a rounded border to the rightmost element */
div.navigation li#aktuelles a {
	margin-right: 13px;
}
div.navigation li#aktuelles {
	background: url(../ornaments/top_menu_right.png) top right no-repeat;
}

div.navigation li span.left {
	display: block;
	float: left;
	width: 1px;
	height: 26px;
	background: url(../ornaments/top_link_left.png) top left no-repeat;
}
/* IE Hack */
* html div.navigation li span.left {
	height: 27px;
}

div.navigation li a {
	display: block;
	line-height: 26px;
	margin: 0px 1px 0px 1px;
	padding: 1px;
	background: url(../ornaments/top_menu_bg.png) repeat-x;
	text-align: center;
	vertical-align: middle;
	white-space: nowrap;
	font-weight: bold;
	font-size: 0.8em;
	color: #FFFFFF;
	text-decoration: none;
}

/* Jeder Karteireiter bekommt eine genau definierte Breite */
div.navigation li#praxis {

	width: 89px;
}

div.navigation li#person {
	width: 117px;
}

div.navigation li#untersuchungen {
	width: 145px;
}

div.navigation li#vorsorge {
	width: 92px;
}

div.navigation li#medinfo {
	width: 155px;
}

div.navigation li#aktuelles {
	width: 107px;
}

/* Element der ersten Ebene werden hervorgehoben, wenn die angezeigte Seite zu dem
 * Navigationsbereich gehört bzw. wenn mit der Maus darübergefahren wird.
 */

div.navigation li.hover,
body.praxis li#praxis, 
body.person li#person,
body.untersuchungen li#untersuchungen, 
body.vorsorge li#vorsorge, 
body.medinfo li#medinfo, 
body.aktuelles li#aktuelles
{
	background-image: url(../ornaments/top_link_left.png);
}

div.navigation li.hover span.left,
body.praxis li#praxis span.left,
body.person li#person span.left,
body.untersuchungen li#untersuchungen span.left,
body.vorsorge li#vorsorge span.left,
body.medinfo li#medinfo span.left,
body.aktuelles li#aktuelles span.left
{
	background-image: url(../ornaments/top_link_right.png);
}

div.navigation li.hover a,
body.praxis li#praxis a,
body.person li#person a,
body.untersuchungen li#untersuchungen a,
body.vorsorge li#vorsorge a,
body.medinfo li#medinfo a,
body.aktuelles li#aktuelles a
{
	background-image: url(../ornaments/top_link_active.png);
	color: white;
}

/* Aufgrund der Vererbung müssen den Unterpunkte ihre alte Formatierungen noch einmal extra
 * zugewiesen werden.
 */
div.navigation li.hover li a,
body.praxis li#praxis li a,
body.person li#person li a,
body.untersuchungen li#untersuchungen li a,
body.vorsorge li#vorsorge li a,
body.medinfo li#medinfo li a,
body.aktuelles li#aktuelles li a
{
	background-image: none;
	color: black;
}

/* Außerdem werden sie bei onMousOver anders formatiert. */
div.navigation li li.hover
{
	background: url(../ornaments/black.gif) top right repeat-y;
}

div.navigation li li.hover a,
body.praxis li#praxis li.hover a,
body.person li#person li.hover a,
body.untersuchungen li#untersuchungen li.hover a,
body.vorsorge li#vorsorge li.hover a,
body.medinfo li#medinfo li.hover a,
body.aktuelles li#aktuelles li.hover a,
div.navigation li li#last.hover a
{
	background-color: #ffdc9f;
	color: black;
}

div.navigation li li#last.hover
{

	background: url(../ornaments/sub_menu_right_hover.gif) top right no-repeat;
}

/* ---------level 2 - vertical menu--------------*/

/* Elemente der zweiten Ebene werden als Listenlemente organisiert. */
div.navigation li ul {
	position: absolute;
}
/* IE Hack */
* html div.navigation li ul {
	padding-top: 0px;
}

/* Untermenüs sind zunächst unsichtbar.
 * Die Formatierung unterscheidet sich von derjeniger der ersten Ebene.
 */
div.navigation li ul li {
	display: none;
	float: none;
	width: 200px;
	text-align: center;
	height: 25px;
	background: url(../ornaments/black.gif) top right repeat-y;
	border-bottom: none;
	border-top: 1px solid black;
}

div.navigation li ul li a {
	line-height: 23px;
	width: 196px;
	margin: 0px 0px 0px 0px;
	background: #e2a333 none;
	border-left: 1px solid black;
}

div.navigation li ul li#last a {
	width: auto;
}

/* Position und Ausrichtung der Untermenüs wird separat festgelegt. */
div.navigation li#praxis ul {
	left: 0px;
}
div.navigation li#praxis ul li {
	text-align: left;
}
div.navigation li#person ul {
	left: -57px;
}
div.navigation li#untersuchungen ul {
	left: -33px;
}
div.navigation li#vorsorge ul {
	left: -48px;
}
div.navigation li#medinfo ul {
	left: -18px;
}
div.navigation li#aktuelles ul {
	right: 0px;
}


/* Letzes Element bekommt abgerundete Ecken. */
div.navigation li ul li#last {
	border-left: 0px solid white;
	border-right: 0px solid white;
	background: url(../ornaments/sub_menu_right.gif) top right no-repeat;
}

div.navigation li ul li#last span.left {
	display: block;
	float: left;
	width: 5px;
	height: 25px;
	border-left: 0px solid white;
	background: url(../ornaments/sub_menu_left.gif) top left no-repeat;
}

div.navigation li ul li#last a {
	margin: 0px 4px 0px 4px;
	background-color: #e2a333;
	border-bottom: 1px solid black;
}

div.navigation li li#last.hover span.left
{
	background: url(../ornaments/sub_menu_left_hover.gif) top left no-repeat;
}