/* Instructions for changing package colors and background images */

/*
  1. MAIN BACKGROUND FOR FIRST-TIER LINKS
*/
ul#pack_nav {
  background-image:url(http://images.oprah.com/images/obc_classic/book/2009/syoot/20090918-syoot-navbg-1x40.gif);
} 

/*
  2. DIVIDING BORDER COLOR AND TEXT COLOR FOR FIRST-TIER LINKS
*/
ul#pack_nav li a,ul#pack_nav li.sub ul,ul#pack_nav li.current ul {
  color:#FFFFFF !important;
  border-color: #941117;
}

/*
  3.ROLLOVER IMAGE FOR FIRST-TIER NAVIGATION BG (should fade to white. Second and third tier backgrounds are always white.)
*/
ul#pack_nav li:hover,ul#pack_nav li.over,ul#pack_nav li.current {
  background-image: url(http://images.oprah.com/images/obc_classic/book/2009/syoot/20090918-syoot-navbgactive-1x40.gif);
}

/*
  4. FIRST-TIER ROLLOVER TEXT COLOR AND IS ALSO SECOND AND THIRD TIER TEXT LINK COLOR
*/
ul#pack_nav li:hover,ul#pack_nav li:hover a,ul#pack_nav li.over,ul#pack_nav li.current, ul#pack_nav li.over a,ul#pack_nav li.current,ul#pack_nav li.current a,ul#pack_nav li ul li a { 
  color:#A02D0A !important;
}

/*
  5. SET THE DEFAULT ARROW FOR THE SECOND-TIER NAVIGATION (IF IT HAS A THIRD-TIER). TRANSPARENT GIF WITH WHITE MATTE.
*/
ul#pack_nav li ul li.supersub {
  background-image: url(http://static.oprah.com/images/global/package_default_rightarrow_5x8.gif) !important;
}

/*
  6. SET THE ROLLOVER ARROW STATE (which is a down-facing arrow versus the right-facing arrow in #5)
*/
ul#pack_nav li ul li.supersub:hover,ul#pack_nav li ul li.over { 
  background-image: url(http://static.oprah.com/images/global/package_default_downarrow_8x5.gif) !important;
}