/*** ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {
	margin:			0;
	padding:		0;
	list-style:		none;
}
.sf-menu {
	line-height:	1.0;
}
.sf-menu ul {
	position:		absolute;
	top:			-999em;
	width:			20em; /* left offset of submenus need to match (see below) */
	z-index: 9999;
}
.sf-menu ul li {
	width:			100%;
}
.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
	float:			left;
	position:		relative;
	z-index:		9999;
}
.sf-menu a {
	display:		block;
	position:		relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			0;
	top:			36px; /* match top ul list item height */
	z-index:		9999;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			20em; /* match ul width */
	top:			0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}

/*** DEMO SKIN ***/
.sf-menu {
	background:		url('../images/sf-menu-bck.png') no-repeat left bottom;
	float:			left;
	width:			100%;
}
.sf-menu-bck {
	background:		url('../images/sf-menu-bck.png') no-repeat right bottom;
	min-width:		50px;
	height:			36px;
	margin:			0;
	display:		block;
}
.sf-menu-bck:hover {
    background: url("../images/top-nav-hover.jpg") repeat-x scroll 0 0 transparent;
}

.sf-menu a {
	text-decoration: none;
	font-size: 		12px;
	margin:			0 1px;
}
ul.sf-menu li ul li:first-child {z-index: 9999;}

a.top-sf-menu, a:visited.top-sf-menu { /* visited pseudo selector so IE6 applies text colour*/
	color:			white;
	font-size: 		14px;
	padding:		12px 14px;
	text-align:		center;
	font-weight: 	bold;
}
a:hover.top-sf-menu { /* visited pseudo selector so IE6 applies text colour*/
}
.sf-menu li li a {
	padding:		5px 3px;
}
.sf-menu li li li {
}
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
	z-index: 99999999;
	outline:		0;
}

ul.level1, ul.level2 {
 	background-color: #333333;
	z-index: 99999999;
 	width: 20em;
    position: absolute !important;
}
.level1 a, .level2 a {
	color: #ffffff;
}
.level1 li, .level2 li {
 	min-width: 200px !important;
}

.level1 a.popout, .level2 a.popout {
	background-image: url('../images/arrow.gif') !important;
}
.level1 li:hover, .level2 li:hover {
 	background-color: #2f3d8a;
}