/*
CSS for dropdown menu.  the colour codes for each section are further down:
Colour codes:  [COL]
*/


#header, #menuContainer { /* This is for IE to display the menu ABOVE the page content */
	z-index: 10;
}

ul.topnav {
	list-style: none;
	padding: 0 0px;
	margin: 18px 0 0 11px;
	float: left;
	text-transform: uppercase;
}

ul.topnav li {
	float: left;
	margin: 0;
	width:87px;
	margin: 0 4px 0 0;
	height:auto !important;
	position: relative; /*--Declare X and Y axis base for sub navigation--*/
}

ul.topnav li a {
	padding: 2px 0px;
	height:14px;
	width:87px;
	text-align: center;
	color: #fff;
	background: #545452;
	font-weight:700;
	display: block;
	text-decoration: none;
	float: left;
	font-size: 0.8em !important;
	letter-spacing:-0.05em;
}

ul.topnav li span.subhover {
	background-position: center bottom; 
	cursor: pointer;
} /*--Hover effect for trigger--*/

ul.topnav li ul.subnav {
	list-style: none;
	position: absolute; /*--Important - Keeps subnav from affecting main navigation flow--*/
	left: 0; 
	top: 18px;
	margin: 0; 
	padding: 4px 0 0 0;
	display: none;
	float: left;
	width: 87px;
	z-index: 10;
	height:auto;
}

ul.topnav li ul.subnav li{
	margin: 0 0 4px 0;
	padding: 0;
	clear: both;
	width: 87px;
	z-index: 10;
}

html ul.topnav li ul.subnav li a {
	float: left;
	width: 87px;
	z-index: 10;
}

li.nav-what_we_do,
li.nav-forums,
li.nav-events,
li.nav-members,
li.nav-experts {
	cursor: default;
}

/* [COL] - Colour codes for each section's active on hover display: */

/* Homepage */
li.nav-home a.active,
li.nav-what_we_do a.active,
li.nav-forums a.active,
li.nav-events a.active,
li.nav-members a.active,
li.nav-experts a.active,
li.nav-contact_us a.active,
li.nav-home a:hover,
li.nav-what_we_do a:hover,
li.nav-forums a:hover,
li.nav-events a:hover,
li.nav-members a:hover,
li.nav-experts a:hover,
li.nav-contact_us a:hover {
	background: #0083b2;
}

/* submenu colours */
li ul li a.active, li ul li a:hover {
	background: #0083b2;
}