/*Default styles*/

.sf-menu ul {width:  150px; /* left offset of submenus need to match (see below) */}
.sf-menu li:hover ul, 
.sf-menu li.sfHover ul {top: 69px; /* match top ul list item height */ left:15px;}
ul.sf-menu li li:hover ul, 
ul.sf-menu li li.sfHover ul {left: 151px; /* match ul width */ top: -20px;}
ul.sf-menu li li li:hover ul, 
ul.sf-menu li li li.sfHover ul {left: 151px; /* match ul width */}


.sf-menu {float: left;  margin: 0 0 0 3.5%; position: relative;}
.sf-menu ul{}

ul.sf-menu > li {padding: 14px 0; margin:0 1px 0 0; }
ul.sf-menu > li.lastItem{}
ul.sf-menu > li.firstItem{}

ul.sf-menu > li > a,
ul.sf-menu > li > span{
  height:58px;
  line-height:58px;
  font-family:Times New Roman, Times, serif;
  color:#CCCCCC;
  font-weight:bold;
  font-size:18px;
  text-transform:uppercase;
  padding:0 11px;
  border-radius:9px;
  display: block;
  letter-spacing:-1px;
  position: relative;
}

ul.sf-menu > li.parent > a:before,
ul.sf-menu > li.parent > span:before{
  background:url(../images/menu-parent-bg.png) left top no-repeat;
  content:".";
  letter-spacing:-999em;
  font-size:0px;
  line-height:0px;
  position: absolute;
    left: 50%;
    margin: 0 0 0 -6px;
    bottom:9px;
  display: block;
  width:11px;
  height:6px;
}


ul.sf-menu > li > a:hover, ul.sf-menu > li.active > a, ul.sf-menu > li.current > a, ul.sf-menu > li.sfHover > a,
ul.sf-menu > li > span:hover, ul.sf-menu > li.active > span, ul.sf-menu > li.current > span, ul.sf-menu > li.sfHover > span{
  background:url(../images/top-menu-item-bg.jpg) left top repeat;
}

ul.sf-menu > li > a.lastLeft,
ul.sf-menu > li > span.lastLeft{margin-right: 219px;}
  
ul.sf-menu > li > a.lastLeft:after,
ul.sf-menu > li > span.lastLeft:after{display: none;}
    
ul.sf-menu ul li{padding:0px; margin-bottom:1px;}


ul.sf-menu ul li a,
ul.sf-menu ul li span{
  line-height:30px;
  padding: 8px 10px 10px;
  margin:0 5px;
  border-radius:16px;
  font-weight:normal;
  color:#CCCCCC;
}

ul.sf-menu ul > li:hover > a,
ul.sf-menu ul > li:hover > span,
ul.sf-menu ul > li.active > a,
ul.sf-menu ul > li.active > span,
ul.sf-menu ul > li.current > a,
ul.sf-menu ul > li.current > span,
ul.sf-menu ul > li.sfHover > a,
ul.sf-menu ul > li.sfHover > span{background:#056839; color:#CCCCCC;}


ul.sf-menu ul{
  background:url(../images/sub-menu.png) left top repeat;
  border-radius:16px;
  padding:20px 0;
}
  
ul.sf-menu ul ul{}