
/*#######################
#### MAIN NAVIGATION ####
#######################*/ 


/* remove all the bullets, borders and padding from the default list styling */
.topNavMenu ul {
	margin 					: 0px 0px 0px 2px;
	padding					: 0px 0px 0px 0px;
	display 				: block;
	list-style 				: none;
	width					: 893px;
	height					: 23px;
	border					: 2px solid #38267A;
	background-image		: url(../images/navBkgrnd.gif);
	background-position		: top left;
	background-repeat		: repeat-x;

}

*html .topNavMenu ul {
	margin 					: -3px 0px 0px 2px;
	
}

.topNavMenu ul ul {
	width					: 120px;
}

*html .topNavMenu ul ul {
	width					: 120px;
}


/* float the list to make it horizontal and a relative positon so that you can control the dropdown topNavMenu positon */
.topNavMenu li {
	float					: left;
	position				: relative;
	border	 				: 0px;
	
}

.topNavMenu li li{
	border					: 0px none !important;
	width					: 120px;
	text-transform			: none;
}

/* style the links for the top level */
.topNavMenu a{
	margin					: 0px 0px 0px 0px;
	padding					: 0px 10px 0px 9px;
	display 				: block;
	float 					: left;
	color					: #AFBCE0;
	text-decoration 		: none;
	font-size 				: 13px;
	line-height				: 1.8em;
	height 					: 23px;
	border-right			: 1px solid #38267A;
}



/* style the second level background */
.topNavMenu ul ul a.drop {
	background-color		: #666666;
}

/* style the second level hover */
.topNavMenu ul ul a.drop:hover{
	background-color		: #666666;
}
.topNavMenu ul ul :hover > a.drop {
	background-color		: #666666;
}



/* hide the sub levels and give them a positon absolute so that they take up no room */
.topNavMenu ul ul {
	visibility				: hidden;
	position				: absolute;
	height					: auto;
	top						: 23px;
	left					: -2px; 
	width					: 120px;
	border					: 1px solid #000000;
	text-align				: left;
}

*html .topNavMenu ul ul {
	top						: 26px;
}



/* style the table so that it takes no part in the layout - required for IE to work */
.topNavMenu table {
	position				: absolute; 
	top						: 0; 
	left					: 0; 
	border-collapse			: collapse;
}

/* style the second level links */
.topNavMenu ul ul a{
	background				: #333333; 
	height					: auto; 
	line-height				: 1.2em; 
	font-size 				: 12px;
	width					: 120px;
	padding					: 5px 10px; 
	border-bottom			: 1px solid #000000;
}


/* style the top level hover */
.topNavMenu a:hover, .topNavMenu a.selected{
	text-decoration 		: none;
	color					: #FFFFFF;
	background-image		: url(../images/navBkgrndOver.gif);
	background-position		: top left;
	background-repeat		: repeat-x;
}

.topNavMenu ul ul a:hover{
	background-color		: #666666;
	background-image		: none;
	text-decoration 		: none;
	color					: #FFFFFF;
}

.topNavMenu :hover > a{
	background-image		: url(../images/navBkgrndOver.gif);
	background-position		: top left;
	background-repeat		: repeat-x;
	color					: #FFF;
}

.topNavMenu ul ul :hover > a {
	background-color		: #666666;
	background-image		: none;
	text-decoration 		: none;
	color					: #FFF;
}

/* make the second level visible when hover on first level list OR link */
.topNavMenu ul li:hover ul, .topNavMenu ul a:hover ul{
	visibility				: visible; 
}


.topNavMenu ul ul a{
	width					: 99px !important;
	border					: 0x none !important;

}


