@charset "UTF-8";
/* CSS Document */

#menu, #child_menu {
	z-index: 2;
}

#menu ul li div, #menu ul li a {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 11px;
	text-decoration:none;
	color: #000000;
	font-weight: bold;
}
#menu ul li:hover li a {
	color: #000000;
}
#menu ul li:hover a, #menu ul ul li:hover a, #menu ul li:hover li.submenu_title a {
	color: #ffffff;
}

#menu ul li.submenu_title, #menu ul li.submenu_title:hover {
	height: 39px;
	background-image:url(../design/submenu-top.png);
}
#menu ul li.submenu_title a {
	margin-top: 11px;
}



#menu { /* Overbyd eventuelle browser-standarder mht. padding/margin, og sørg for at menuen åbner foran alt andet */
	margin: 0px;
	padding: 0px;
	
	position: absolute;
	top: 161px;
	left: 50%;
	margin-left:-458px;
}

#menu ul { /* Overbyd igen standarder og fjern punkter fra punktopstilling */
	list-style: none;
	margin: 0px;
	padding: 0px 0px 0px 0px;
	height: 269px;

	position: absolute; /* Absolute positionering er i forhold til parent-elementet øverste venstre hjørne, og ikke i forhold til skærmens hjørne som jeg før troede */
	background-color:transparent;
	background-image:url(../design/menu-bg.png);
	background-repeat:no-repeat;
	background-position:top left;
}

#menu ul li {
	position: relative; /* LI-elementer positioneres relativt i forhold til deres UL-parent-element */
	margin: 0px;

	float: left; /* Sørger for at punkterne i over-menuen er ved siden af hinanden i stedet for over/under */
	cursor: pointer; /* Sætter cursoren til pegende finger - i IE hedder den cursor: hand, men det er forkert */

	display: block;
	clear:left;/* Fix til Safari, så undermenupunkter ikke står ved siden af hinanden*/
	width: 190px; /* Her sættes bredden af punkter i undermenuerne */
	background-color:transparent;
}
#menu ul li:hover {
	background-image:url(../design/menu-bg-hover.png);
	background-repeat:repeat-y;
}

#menu ul li a {
	float: none;  /* Undermenupunkter skal IKKE være ved siden af hinanden, som vi ellers definerede tidligere, så her modsiger vi lige os selv (påvirker kun undermenuer de skal være inde i 2 UL'er) */
	display:block;	/* Sørger for A-elementet opfører sig som et block-element i stedet for et inline-element.
	Hvis det ikke giver mening: Til sammenligning er en DIV block, mens SPAN er inline. BLOCK tager en hel linje 
	med mindre andet er specificeret, og kan nogle flere ting, mens INLINE kan sættes midt i tekst*/
	line-height: 28px; /* Sætter man line-height til blokkens højde, vil teksten være centreret vertikalt. Bedre end at bøvle med vertical-align - den gør aldrig det man regner med */
	height: 28px;
	padding: 0px 23px 0px 32px;
	white-space:nowrap;
	overflow: hidden;
}

#menu ul ul { /* Her begynder vi at ændre ting for undermenuerne i forhold til overmenuen. Vi beder om alle UL'er, som er inde i en anden UL i #cssmenu = det må være en undermenu*/
	display: none; /* Undermenuer er som standard skjult */

	top:-11px; /* Position er allerede absolute fra UL UL (som også tæller her, da under-undermenuer også tæller som undermenuer) Højden skal være uændret, så undermenuen kommer ud for menupunktet*/
	left:100%; /* Men undermenuen flyttes 100% af den overliggende LI til højre. Og da under-undermenuen er præcis samme bredde som undermenuen, så er det meget passende :-)  */

	margin: 0px 0px 0px -28px;
	padding: 0px 0px 46px 0px;
	z-index: -100;
	
	height:auto;
	
	background-image:url(../design/submenu-bottom.png);
	background-position:bottom left;
	background-repeat:no-repeat;
}

#menu ul ul li {
	background-color:transparent;
	background-image:url(../design/submenu-bg.png);
	background-repeat:repeat-y;
}
#menu ul ul li:hover {
	background-image:url(../design/submenu-bg-hover.png);
}

/* Og her kommer så det, som sørger for at åbne og lukke menuen. Først skjuler vi alle menuer, som er 2 niveauer under den menu vi holder musen på */
div#menu li:hover ul ul,
div#menu li li:hover ul ul,
div#menu li li li:hover ul ul,
div#menu li li li li:hover ul ul,
div#menu li li li li li:hover ul ul,
div#menu li li li li li li:hover ul ul,
div#menu li li li li li li li:hover ul ul,
div#menu li li li li li li li li:hover ul ul
{display:none;}

/* Og så viser vi alle menuer, som kun er 1 niveau under den menu vi holder musen på. Dette skal stå til sidst, da det vil overbyde den første kommando */
div#menu li:hover ul,
div#menu li li:hover ul,
div#menu li li li:hover ul,
div#menu li li li li:hover ul,
div#menu li li li li li:hover ul,
div#menu li li li li li li:hover ul,
div#menu li li li li li li li:hover ul,
div#menu li li li li li li li li:hover ul
{display:block;}
