/*** adding sf-vertical in addition to sf-menu creates a vertical menu ***/

.sf-vertical {
  width:	203px !important;
}

.sf-vertical li {
  width:	192px !important;
  white-space: nowrap;
}

li.horizontal_bars_menu {
  width: 180px;
  background: url('images/backgrounddotshorizontal.gif') left bottom repeat-x;
}

.sf-menu li {
  background-color: #FAFAFA;
}

.sf-vertical li {
   padding: 4px;
   width: 192px !important;
}

.sf-vertical li li {
   width: 252px !important;
}

/* this lacks ul at the start of the selector, so the styles from the main CSS file override it where needed */
.sf-vertical li:hover ul,
.sf-vertical li.sfHover ul {
  left:	202px;
  top:	0px; /* alter to align submeu up and down to primary menu list items */
  width: 262px !important;
}