nav{ position:relative; margin: 0px 0 3px 0; height:60px; padding: 0px 0 7px 20px; position:relative; background:url(../images/nav_bg.png) 20px 0 no-repeat;}
nav:after{ position:absolute; display:block; height:7px; left:0; width:960px; bottom:0px; background:url(../images/nav_shadow.png) no-repeat; content:"";}
.sf-menu ul {position:absolute;top:-999px; display:none;/* left offset of submenus need to match (see below) */}
.sf-menu ul li {width:100%}
.sf-menu li {float:left;position:relative}
.sf-menu>li{ padding:0 0px 0;}
.sf-menu>li:first-child{margin-left:0;}
.sf-menu>li:first-child:before{ display:none;}
.sf-menu>li>a{display:block;position:relative; font-size: 14px; line-height: 19px; color:#fff; font-weight:bold; padding: 19px 0px 22px; text-align:center;}

.sf-menu>li:before{ display:block; top:19px; width:1px;height:20px; position:absolute; background:url(../images/nav_stripe.jpg) no-repeat; content:"";}
.sf-menu>li.item1 a:after{ background:url(../images/nav_before.png) no-repeat; left:-20px;}
.sf-menu>li.item8 a:after{ background:url(../images/nav_after.png) no-repeat; right:-20px;}
.sf-menu>li.item1 a:after, .sf-menu>li.item8 a:after{ display:block; position:absolute; top:0;width:20px;height:60px; content:""; cursor:pointer;}

.sf-menu>li:hover,.sf-menu>li.current, .sf-menu>li.sfHover{ background:url(../images/nav_li_h.jpg) repeat-x;}
.sf-menu>li:hover a:after, .sf-menu>li.current a:after{ background-position: 0 bottom;}

.item1{width:85px;}
.item2{width:130px;}
.item3{width:130px;}
.item4{width:118px;}
.item5{width:136px;}
.item6{width:103px;}
.item7{width:95px;}
.item8{width:123px;}
/*================================>> 2 Level <<========================================*/
.sf-menu>li>ul,.sf-menu>li.sfHover>ul{left:0;top:60px; background:url(../images/sub_ul.png) repeat; width: 124px;padding:0px 0 0 0;/* match top ul list item height */z-index:99}
.sf-menu>li>ul>li{ background:url(../images/sub_li.jpg) 0 bottom repeat-x;}
.sf-menu>li>ul>li>a{ font-size:12px; color:#ffbf44; line-height:18px; font-weight:bold; display:block; padding: 9px 0 13px 24px; padding-left:24px;width:100px;}
.sf-menu>li>ul>li>a:hover, .sf-menu>li.sfHover li.sfHover>a{ color:#FFFFFF;}

/*================================>> 3 Level <<========================================*/
.sf-menu li li ul{left:124px;top:0px;width: 111px;padding:0 0 0 0;/* match top ul list item height */z-index:99; background:url(../images/sub_ul2.png) repeat;}
.sf-menu li li li{}
.sf-menu li li li a{ color:#c44005; font-size:12px; font-weight:bold; padding: 3px 22px 6px; display:block;}
.sf-menu li li li a:hover{ color:#FFF;}
