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

.nav_main,
.nav_main li
{
   width: 217px;
}

.nav_main
{
   float: left;
   margin-bottom: 1em;
   line-height: 1.0;
}

.nav_main ul
{
   position: absolute;
   top: -999em;
   width: 217px; /* 217px width + 2px border offset = 219px */ /* left offset of submenus need to match (see below) */
}

.nav_main ul li
{
   width: 217px;
}

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

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

.nav_main a
{
   display: block;
   position: relative;
}

.nav_main li:hover ul,
.nav_main li.sfHover ul
{
   left: 0;
   top: 32px; /* match top ul list item height */
   z-index: 99;
}

ul.nav_main li:hover li ul,
ul.nav_main li.sfHover li ul
{
   top: -999em;
}

ul.nav_main li li:hover ul,
ul.nav_main li li.sfHover ul
{
   left: 219px; /* match ul width */
   top: 0;
}

ul.nav_main li li:hover li ul,
ul.nav_main li li.sfHover li ul
{
   top: -999em;
}

ul.nav_main li li li:hover ul,
ul.nav_main li li li.sfHover ul
{
   left: 219px; /* match ul width */
   top: 0;
}

.nav_main li:hover,
.nav_main li.sfHover,
.nav_main a:focus,
.nav_main a:hover,
.nav_main a:active
{
   outline: 0;
}

/*** arrows **/
.nav_main a.sf-with-ul
{
   /* trigger IE7 hasLayout so spans position accurately */
   min-width: 1px;
}

/*** shadows for all but IE6 ***/
.nav_main ul
{
   padding: 0;
   border: 2px solid #624F91;
   border-left: none;
}

/* this lacks ul at the start of the selector, so the styles from the main CSS file override it where needed */
.nav_main li:hover ul,
.nav_main li.sfHover ul
{
   left: 222px; /* match ul width */
   top: -2px; /* 2px border */
}