/*** ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {
	margin:0;
	padding:0;
	list-style:none;
	font-size:13px;
    font-weight:bold;
	font-family:Tahoma, Arial, "Times New Roman";
}
.sf-menu {
	line-height:1.0;
	}
	
.sf-menu ul {
	background:url(../images/ulSubMenuBg.png) repeat top left; 
	position:absolute;
	top:-999em;
	width:240px;
	z-index:99999;
	margin:-30px 0 0 207px; /* left offset of submenus need to match (see below) */
    }
	
.sf-menu ul li {
    background:none !important;
	}
	

.sf-menu ul li ul {
	 background: none;
    margin: 0px 0 0 110px;
    position: absolute;
    top: -999em;
    width: 240px;
    z-index: 99999;
	 }

.sf-menu li:hover {
	visibility:inherit; /* fixes IE7 'sticky bug' */
    }
	
.sf-menu li {
	background:url(../images/arrow.png) no-repeat 160px 10px;
	position:relative;
	text-align:left;
	line-height:19px;
    padding:0 20px 0 0;
	}
	
.sf-menu a {
	display:block;
	position:relative;
    }
	
.sf-menu li:hover ul, .sf-menu li.sfHover ul {
	left:0;
	top:2.5em; /* match top ul list item height */
	z-index:99; 
    }
	
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:10em; /* 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 {
	float:left;
	width:87%;
	padding:2px 0 0 32px;
    }
	
.sf-menu a {
	padding:3px 10px;
	text-decoration:none;
    }
	
.sf-menu a { /* visited pseudo selector so IE6 applies text colour*/
	color:#f8ffd4;
	font-size:12px;
	font-weight:bold;
	text-decoration:none;
	font-family:Arial, Helvetica, sans-serif;
    }
	
.sf-menu li li a {
     background:url(../images/arrow.png) no-repeat right 9px;
    }
	
.sf-menu li li li {
	background:url(../images/ulSubMenuBg.png) repeat top left;
    }
.sf-menu li li ul {
	background:url(../images/ulSubMenuBg.png) repeat top left;
    }
	
.sf-menu li li li a {
	background:url(../images/arrow.png) no-repeat right 9px;
    }
	
.sf-menu li:hover, .sf-menu li.sfHover, .sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
	outline:0;
	color: #FFFFFF;
    }
	
/*** arrows **/

.sf-menu a.sf-with-ul {
	padding-right:2.25em;
	min-width:1px; /* trigger IE7 hasLayout so spans position accurately */
    }


