/*** ESSENTIAL STYLES ***/
.sub_menu, .sub_menu * {
	margin:				0;
	padding:			0;
	
	list-style:			none;
}

.sub_menu {
	float:				left;
	
	position:			absolute;
	z-index:			999;
	
	top:				0;
	left:				0;

	line-height:		normal;
}

.sub_menu ul {
	position:			absolute;
	z-index:			999;
	
	top:				-999em;
	width:				10em; /* left offset of submenus need to match (see below) */
	
	padding:			0 0 8px 0;
	background:			#ffffff;
}

.sub_menu ul li {
	width:				280px;
}

.sub_menu li:hover {
	visibility:			inherit; /* fixes IE7 'sticky bug' */
}

.sub_menu li {
	float:				left;
	position:			relative;
}

.sub_menu a {
	display:			block;	
	position:			relative;
	
	padding:			0 0 0 8px;
	outline:			none;
}

.sub_menu li:hover ul,
.sub_menu li.sfHover ul {
	z-index:			999;
	left:				-1px;
	top:				22px; /* match top ul list item height */
	_top:				22px;
	width:				280px;
	
	border-left:		1px solid #cccccc;
	border-bottom:		1px solid #cccccc;
	border-right:		1px solid #cccccc;
}

ul.sub_menu li:hover li ul,
ul.sub_menu li.sfHover li ul {
	top:				-999em;
}
ul.sub_menu li li:hover ul,
ul.sub_menu li li.sfHover ul {
	left:				10em; /* match ul width */
	top:				0;
}
ul.sub_menu li li:hover li ul,
ul.sub_menu li li.sfHover li ul {
	top:				-999em;
}
ul.sub_menu li li li:hover ul,
ul.sub_menu li li li.sfHover ul {
	left:				10em; /* match ul width */
	top:				0px;
}


/*** SKIN ***/
.sub_menu {
	float:				left;
}
.sub_menu a {
	font-size:			15px;
	line-height:		22px;
	text-decoration:	none;
}
.sub_menu a, .sub_menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
	font-size:			15px;
	color:				#999999;
	text-decoration:	none;
}
.sub_menu li {
	width:				280px;

	background:			#ffffff;
	border:				1px solid #ffffff;
}
.sub_menu li li {
	background:			#ffffff;
	border:				0px solid #ffffff;
	
	padding:			0 0 1px 0;
	margin:				2px 0 2px 0;
}
.sub_menu li.active,
.sub_menu li:hover, .sub_menu li.sfHover {
	outline:			none;
	
	width:				280px;
	_padding-bottom:	5px;
	
	border:				1px solid #cccccc;
	border-bottom:		1px solid #ffffff;
 	background:			#ffffff; 
}

.sub_menu a:focus, .sub_menu a:hover, .sub_menu a:active{
	text-decoration:	none;
	font-size:			15px;
	color:				#999999;
}

.sub_menu li li.active,
.sub_menu li li:hover, .sub_menu li li.sfHover {
	border:				0px solid #999999;
	background:			#f3f3f1;
}

.sub_menu li ul li a {	
	padding-left:		8px	!important;
	padding-right:		8px	!important;
	
	_text-indent:		8px;
	
	color:				#999999;
	line-height:		normal;
	padding:			0;
}

.sub_menu li ul li a:hover {	
	color:				#333333;
	background:			#f3f3f1;
}