#mainNav {
  background: #cc0000 url("/vimages/L6/skin2/mainNavBG.gif") repeat;
  border-bottom: 1px solid #000;
  float: left;
  width: 100%;

  /* background graphic height = 29px
     bottom padding to push text up = 5px
     change line-height to 24px (29 - 5) */
  line-height: 24px;

  /* In order for the background image to match up with the tab graphics on all tested browsers
     (Windows and Mac), the font-size had to be specified in pixels instead of the normal ems. */
  font-size: 12px;
}

#mainNav ul {
  list-style: none;
  margin: 0;
  padding: 0 0 0 10px;
}

#mainNav li {
  display: inline;
  margin: 0;
  padding: 0;
}

#mainNav li.first a {
/* Adjust this to set the distance the first tab is from the left side of the page */
/* Example -  margin-left: 55px; */
  margin-left: 0;
}

#mainNav a {
  background: url("../images/mainNavLeftTab.gif") no-repeat left top;
  color: #fff;
  float: left;
  margin: 0;
  padding: 0 0 0 7px; /* Left padding = width of left graphic */
  text-decoration: none;
  white-space: nowrap;
}

#mainNav a span {
  background: url("/vimages/L6/skin2/mainNavRightTab.gif") no-repeat right top;
  display: block;
  float: left; /* Mac IE5 - Need to float the anchor to get it to size correctly */
  padding: 0 15px 5px 8px; /* 7px left padding (above) + 8px left padding = 15px left padding */
}

/* Use the Commented Backslash Hack to hide a new rule from IE5/Mac which removes the float for all other browsers */
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#mainNav a span { float: none; }
/* End IE5-Mac hack */

#mainNav #currentMainNav a {
  background-position: 0% -29px;
  cursor: default;
}

#mainNav #currentMainNav a span {
  background-position: 100% -29px;
  color: #000;
}

#mainNav a:hover {
  background-position: 0% -58px;
  color: #fff;
}

#mainNav a:hover span {
  background-position: 100% -58px;
}