/*
	Main navigation container styles
*/
#mainNav {
	position: absolute;
	top: 8px; 
	left: 319px;
	width: 655px;
	height: 59px;
	z-index: 100;
}

/*
	Hack to correct IE5.5 faulty box model
*/
* html #mainNav {
	width:655px;
	w\idth:655px;
	z-index:100;
}

/*
	Remove all bullets, borders and padding from list items within menu structure
*/
#mainNav ul {
	padding:0;
	margin:0;
	list-style-type:none;
}

/*
	Float list to make it horizontal and a relative position so that we can control the dropdown menu position
*/
#mainNav li {
	float:left;
	margin:0;
	position:relative;
}

/* 
	Style links for top level
*/
#mainNav li a {
	background:url(/images/mainNav.gif) no-repeat;
	color:#333;
	display:block;
	font:11px/13px Arial, Helvetica, sans-serif;
	line-height:59px;
	text-decoration:none;
	text-transform:uppercase;
	text-indent:-9999px;
	font-size:1%;
}

li#navTab1 a {
	left: 0px;
	width: 173px;
	background-position: 0px 0px;
}

li#navTab2 a {
	left: 173px;
	width: 152px;
	background-position: -173px 0px;
}

li#navTab3 a {
	left: 325px;
	width: 188px;
	background-position: -325px 0px;
}

li#navTab4 a {
	left: 513px;
	width: 142px;
	background-position: -513px 0px;
}

/*
	Hide sublevels and give them an absolute position so that they take up no room
	(as hidden elements in the flow still reserve space bumping other elements around)
*/
#mainNav ul ul {
	visibility: hidden;
	position:absolute;
	height:0px;
	top:59px;
	left:0px;
}

/*
	Another IE5.5 hack
*/
* html #mainNav ul ul {
	top:59px;
	t\op:59px;
}

/*
	Style top level to show the on state for a given section
*/
li#navTab1.on > a {background-position:0px -59px;}
li#navTab2.on > a {background-position:-173px -59px;}
li#navTab3.on > a {background-position:-325px -59px;}
li#navTab4.on > a {background-position:-513px -59px;}

/*
	Style top level hover and make second layer visible
*/
li#navTab1 :hover > a {background-position:0px -59px;}
li#navTab2 :hover > a {background-position:-173px -59px;}
li#navTab3 :hover > a {background-position:-325px -59px;}
li#navTab4 :hover > a {background-position:-513px -59px;}

/*
	Another IE5.5 hack
*/
li#navTab1 a:hover {background-position: 0px -59px;}
li#navTab2 a:hover {background-position:-173px -59px;}
li#navTab3 a:hover {background-position:-325px -59px;}
li#navTab4 a:hover {background-position:-513px -59px;}

#mainNav ul li:hover ul,
#mainNav ul a:hover ul {visibility: visible !important; width: 222px !important;}

/* 
	Style the table so that it takes no part in the layout - required for IE to work 
*/
#mainNav table {
	position: absolute; 
	top: 0px; left:0px; 
	border-collapse: collapse;
}

/* 
	Aligning 3rd and 4th menu drop-downs flush with right side of menu
*/
#navTab3 ul {
	left: -32px !important;
}

#navTab4 ul {
	left: -78px !important;
}

/*
	Second-level styles
*/
#mainNav ul ul a, #navTop ul ul a:visited, #mainNav table a, #mainNav table a:visited {
	background:#d2def0;
	border-bottom:1px solid #a1bbe0;
	border-left:none;
	border-right:none;
	border-top:1px solid #fff;
	color:#335588;
	font-weight:normal;
	font-size:10px;
	height:auto;
	line-height:1.5em;
	padding:5px 10px;
	width: 200px;
	text-indent:0;
}

/* 
	Right-aligning text for 3rd and 4th menu item drop-down items.
*/
#navTab3 ul a, #navTab4 ul a
{
	text-align: right !important;
}

#mainNav ul ul li.first {
	border-top:none;
}

#mainNav ul ul a:hover {
	background:#e3ebf6;
}