#contentwrapper { position: relative;
		width: 100%;
		height: 46px;
}

#listMenuRoot { position: absolute;
		top: 0px;
		left: 0px;
		z-index: 100; /*1000;*/
}

/* menu font */
.menulist { font: 13px Arial, Sans-serif; }

/* first tier list items (buttons across global nav) */
.menulist li {	text-transform: uppercase;
		text-align: center;
		line-height: 46px;
}

/* secondary and tertiary menus (override) */
.menulist ul li { font: 12px Arial, Sans-serif;
		border: 1px solid #84ccdb;
		background: #002833; 							/* background color of 2 level menu */
		text-align: left;
		line-height: 20px;
		text-transform: none;
}

/* Menu links -- top level and down */
.menulist a { color: #ffffff;								/* font color of 1 level menu */
		text-decoration: none;
		font-weight: normal;
		letter-spacing: normal;
}

/* Menu links - second level down (override) */
.menulist ul li a { color: #ffffff;							 /* font color of 2 and 3 level menu */
		text-decoration: none;
		font-weight: normal;
		letter-spacing: normal;
}

/* More on menu links -- top level ad down */
/* 'hover' is mouseover, 'highlighted' are parent items to visible menus */
.menulist a:hover, .menulist a.highlighted:hover, .menulist a:focus { color: #ffffff; 	/* font color of 1 level menu when it is mouseover */
		background: url('../images/usermenu.jpg') repeat-x left center;
}
.menulist a.highlighted, .menulist a.active { color: #ffffff; 				/* font color of 1 level menu when mouse go to 2 level menu */
		background: url('../images/usermenu.jpg') repeat-x left center;
}

/* same goes for second tier and down */
.menulist ul li a.highlighted, .menulist ul li a.active { color: #ffffff;
		background-image: none;
		background-color: #1b718b; 						/* font color of 2 and 3 level menu when mouse go evey */
}
.menulist ul li a:hover, .menulist ul li a.highlighted:hover, .menulist ul li a:focus {
		color: #ffffff;
		background-color: #0d586f; 						/* font color of 2 and 3 level menu when it is mouseover */
		background-image: none;
}

/* ************************************************************************** */

/* HORIZONTAL FREESTYLE MENU LAYOUT */
/* All <ul> tags in the menu including the first level */
.menulist, .menulist  ul { margin: 0;  padding: 0; list-style: none; }

/* Submenus (<ul> tags) are hidden and absolutely positioned downwards from their parent */
.menulist ul { display: none; position: absolute; top: 1.0em; margin-top: 30px; /* I'm using ems and px to allow people to zoom their font */
		left: -1px; width: 150px; }

.menulist ul.goleft { display: none; position: absolute; top: 1.0em; margin-top: 30px; /* I'm using ems and px to allow people to zoom their font */
		left: -39px; width: 150px; }

/* Second and third etc. level submenus - position across from parent instead */
.menulist ul ul { top: -1px; margin-top: 0; left: 148px; /* or left:-148 to put 'em on the left side */
}

.menulist ul ul.goleft { top: -1px; margin-top: 0; left: -150px; /* or left:-148 to put 'em on the left side */ }

/* All menu items (<li> tags). 'float: left' lines them up horizontally, and they are
 positioned relatively to correctly offset submenus. Also, they have overlapping borders. */
.menulist li { float: left; display: block; position: relative; margin: 0px 0px; width: 108px; height: 46px; }

/* Items in submenus - override float/border/margin from above, restoring default vertical style */
.menulist ul li { float: none; top:0px; margin: 0; margin-bottom: -1px; width:auto; height:auto; }

/* offset the top:Xpx; above */
.menulist ul li li { top:0px; }
.menulist ul>li:last-child { margin-bottom: 1px; } /* Mozilla fix */

/* Links inside the menu -- top level and down */
.menulist a { display: block; height:46px; }

/*override top level */
.menulist ul li a { display: block; padding: 3px; padding-left:15px; height:auto; }

/* Lit  items: 'hover' is mouseover, 'highlighted' are parent items to visible menus */
.menulist a:hover, .menulist a.highlighted:hover, .menulist a:focus { }
.menulist a.highlighted { }
.menulist ul li a.highlighted { }
.menulist ul li a:hover, .menulist ul li a.highlighted:hover, .menulist ul li a:focus { }

/* Only style submenu indicators within submenus. */
.menulist a .subind { display: none; }
.menulist ul a .subind { display: block; float: right; margin-top:5px; }

/* 'Escaped Comment' hack for horizontal menubar width in IE5/Mac */
.menulist a { float: left; }
.menulist ul a { float: none; }

/* \ */
.menulist a { float: none; }

/* HACKS: IE/Win: A small height on <li> and <a> tags and floating prevents gaps in menu. *html affects <=IE6 and *:first-child+html affects IE7.
   You may want to move these to browser-specific style sheets. 
*:first-child+html .menulist ul li { float: left; width: 100%; }
* html .menulist ul li { float: left; height: 1%; }
* html .menulist ul a { height: 1%; }