#menu {
	width: 713px;
	height: 30px;
	background-image: url("../images/menu/menu-off.gif");
	background-repeat: no-repeat;
	background-position: 0px 0px;
}

.mpri1 { width: 57px; }
.mpri2 { width: 82px; }
.mpri3 { width: 98px; }
.mpri4 { width: 96px; }
.mpri5 { width: 136px; }
.mpri6 { width: 114px; }
.mpri7 { width: 116px; }

/* Setup for the 1st, 2nd & 3rd level menus */
#menu ul {
	list-style: none;
	margin: 0px;
	padding: 0px;
}

/* Setup for the 2nd level menu */
#menu ul ul {
	position: absolute;
	top: 24px;	/* vertical offset between the 1nd and 2rd level menu */
	left: 5px;	/* horizontal offset between the 1st and 2nd level menu */
	padding: 0px;	/* reset the padding from the 1st level menu to zero */
}

/* Setup for the 3rd level menu */
#menu ul ul ul {
	position: absolute;
	top: 0;			/* vertical offset between the 2nd and 3rd level menu */
	left: 100%;		/* horizontal offset between the 2nd and 3rd level menu */
	padding: 0px;	/* reset the padding from the 2nd level to zero */
	padding-top: 0px;		/* vertical offset between the 2nd-3rd level */
}

/* Setup for each menu items in the 1st */
#menu ul li {
	position: relative;
	float: left;
	height: 30px;
	padding-bottom: 0px;	/* vertical seperation between the 1st level item and the first 2nd level item */	
	padding-right: 0px;	/* horizontal spacing between the 1st level items */
	text-align: center;
	cursor: default;
	z-index: 99;
}

/* Setup for the 1st level menu */
#menu a, #menu span {
	font-size: 11px;
	text-decoration: none;
	width: auto;
	height: 24px;			/* this height + this padding-top must equal to menu height which is 30px */
	color: #FFFFFF;
	display: block;
	padding-top: 7px;
}

/* Setup for each menu item in the 2nd level */
#menu ul ul li {
	clear: both;
	padding: 0px;			/* reset the padding that was set above in the 1st level li */
	width: 174px;
	height: 24px;
	text-align: left;
	background-image: url("../images/menu/menulv2-off.jpg");
	background-repeat: repeat;
	background-position: 0px 0px;
}

/* Setup for each menu item in the 3rd level */
#menu ul ul ul li {
	/* inherits the css properties set in the 2nd level */
	clear: both;
	padding: 0px;			/* reset the padding that was set above in the 2nd level li */
}

/* Setup for the 2nd & 3rd level menu */
#menu ul ul a, #menu ul ul span {
	font-size: 11px;
	text-decoration: none;
	width: auto;
	height: 21px;			/* this height + this padding-top must equal to 2nd level menu height which is 24px */
	color: #081449;
	display: block;
	padding-top: 3px;
	padding-left: 7px;
}

/* Rollover for 1st level menu is implemented using the script common.js */
#menu a:hover, #menu span:hover {
	color: #081449;
}

/* Rollover for the 2nd & 3rd level menu */
#menu ul ul li:hover {
   background-image: url("../images/menu/menulv2-on.jpg");
   background-repeat: repeat-x;
}

#menu ul ul,   /* no hovering over any levels */
#menu ul li:hover ul ul /* disable 3rd level menu when hovering over 1st level */
{
   display: none;
}

#menu ul li:hover ul,   /* enable 2nd level menu when hovering over 1st level */
#menu ul ul li:hover ul /* enable 3rd level menu when hovering over 2nd level */
{
   display: block;
}
