#navbar{left:120px;position:absolute;top:70px;z-index:2}
#navigation{margin: 0 0 0 40px;padding:0}
#navigation li{float:left;list-style:none;margin:0;padding:0}

/* first level */
a.first,a.aboutus,a.spas,a.accessories,a.testimonials,a.spainfo,a.contactus{border-right:1px solid #000;color:#000;display:block;/*float:left; not needed */
font-size:11px;font-weight:bold;margin:0;padding:7px 8px 3px 8px;text-decoration:none}
.first{width:36px}
.aboutus{width:60px}
.spas{width:31px}
.accessories{width:80px}
.testimonials{width:86px}
.spainfo{width:58px}
.contactus{width:72px}

/* dropdown/out navigation */
#navigation li a.first{border-left:1px solid #000}
#navigation li a.first:hover,#navigation li a.aboutus:hover,#navigation li a.spas:hover,#navigation li a.accessories:hover,#navigation li a.testimonials:hover,#navigation li a.spainfo:hover,#navigation li a.contactus:hover{background:url(../grfx/nav_bakgrd.gif) top left repeat-x;color:#FFF}

/* Second level - if top margin is too big, the sub menu items are harder to "hit" and select - but removing the float on the anchors removes the need for any top margin  */
#navigation li ul{left:-999em;padding:0;position:absolute;margin:0;/*margin-top:1.9em*/}

/* increasing the line-height here increases the submenu height in IE but not Mozilla */
#navigation li ul li{line-height:28px;display:inline;white-space:nowrap;border-color:#000; border-style:solid;border-width:1px 0} 

/* set borders on the first and last elements so it's all pretty */
.subfirst{border-left-width:1px !important}
.sublast{border-right-width:1px !important}

/* increasing the top/bottom padding from 4 to 8 increases the submenu height in Mozilla but not IE */
#navigation li ul li a{text-decoration:none;color:#000;margin:0;background-color:#F36F21;padding:8px 7px}

#navigation li ul li a:hover{background-color:#000 !important;color:#FFF !important}
#navigation li:hover ul,#navigation li.sfhover ul{left:-10px} 

/* force Hover 1st element */
#navigation li:hover,#navigation li.sfhover{background:url(../grfx/nav_bakgrd.gif) top left repeat-x;color:#fff !important}

/* sub menu widths for IE only... */
* html ul.subone{width:520px}
* html ul.subtwo{width:590px}
* html ul.subthree{width:360px}

/* offsets for all sub menus */
ul.subone{margin-left:50px !important}
ul.subtwo{margin-left:50px !important}
ul.subthree{margin-left:300px !important}

/* make opera behave */
@media all and (min-width: 0px){
	#navigation{margin-top:7px}
  #navigation li{width:4em !important;float:none;display:inline}
	a.first,a.aboutus,a.spas,a.accessories,a.testimonials,a.spainfo,a.contactus{display:inline}
}

