/*** ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {
  margin:    0;
  padding:    0;
  list-style:  none;
}
.sf-menu {
  line-height:  1.0;
}
.sf-menu ul {
  position:  absolute;
  top:      -999em;
  width:    10em; /* left offset of submenus need to match (see below) */
}
.sf-menu ul li {
  width:    100%;
}

.sf-menu li a {
  font-weight: bold;
}

.sf-menu li a:hover {
  color: white;
  background-color: black;
}

.sf-menu li:hover {
  visibility:  inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
  float:    left;
  position:  relative;
}
.sf-menu a {
  display:    block;
  position:  relative;
  text-decoration: none;
}

.sf-menu a:visited {
  text-decoration: none;
}

.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
  left:      0;
  top:      14px; /* match top ul list item height */
  margin:     0px 0px 0px 3px;
  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:      147px; /* 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:      147px; /* match ul width */
  top:      0;
}

/*** DEMO SKIN ***/
.sf-menu {
  float:      left;
}
.sf-menu a {
  text-align:center;
  padding: 0 0 0 0;
  line-height: 14px;
  text-decoration:none;
  background: none;
}

.sf-menu li li a {
  height:auto; 
  line-height:normal; 
  padding: 5px 0px 5px 5px; 
  width: auto; 
  text-align:left; 
  color: black;
  font-weight: normal;
}

.sf-menu li li a:visited {
  color: black;
}

.sf-menu li li a:hover {
  color: black;
  background-color: #dae6f8;
}

.sf-menu li li a:hover {
  color: black;
  background-color: #dae6f8;
}

.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
  color: black;
}
.sf-menu li {
  margin: 0 1px 0 0;
  padding-left: 7px;
  padding-right: 7px;
  text-align:left;
  border-left: 1px solid black;
}
.sf-menu li li {
  background: white;
  padding-left: 0px;
  padding-right: 0px;
  border: 1px solid #000066;
  border-collapse: collapse;
  width: 150px;
  margin: 0 -1px -1px 0;  
}
.sf-menu li li li {
  background: white;
}
.sf-menu li:hover, .sf-menu li.sfHover{ 
  background:none;
  outline:    0;
}

.sf-menu li li:hover {
  background: #dae6f8;
}
.sf-menu li li.sfHover {
  background:  #dae6f8;
}

.sf-menu li.sfHover a {
  color: white;
}

.sf-menu li.sfHover li a {
  color: black;
}

.sf-menu a:hover { 
  text-decoration:none;
} 

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

.sf-menu li li.hasChild {
  background:    url('/images/layout/arrow_o.gif') no-repeat right 8px; /* 8-bit indexed alpha png. IE6 gets solid image only */
  background-color: white;
}

.sf-menu li li.hasChild:hover {
  background:    url('/images/layout/arrow_o.gif') no-repeat right 8px; /* 8-bit indexed alpha png. IE6 gets solid image only */
  background-color: #dae6f8;
}

.sf-menu li li.hasChildOpen {
  background:    url('/images/layout/arrow_o.gif') no-repeat right 8px; /* 8-bit indexed alpha png. IE6 gets solid image only */
  background-color: #c9c9c9;
}

.sf-menu li li.menuULDocOpen,
.sf-menu li li.menuULDirOpen {
  background-color: #c9c9c9;
}
