@charset "UTF-8";

/* SpryMenuBarVertical.css - Revision: Spry Preview Release 1.4 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

/*******************************************************************************

 LAYOUT INFORMATION: describes box model, positioning, z-order

 *******************************************************************************/

/*
  The outermost container of the Menu Bar.
  A fixed width box with no margin or padding
  Since all menu items are links, font-size here has no effect.
*/
ul.MenuBarVertical
{
  margin: 0;
  padding: 0;
  list-style-type: none;
  font-size: 20px;   /* was 100%. seems to have no effect with IE6 */
  cursor: default;
  width: 135px;     /* was 8em */
  background: transparent;
}

/*
  Set the active Menu Bar with this class, currently setting z-index to accomodate
  IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html
*/
ul.MenuBarActive
{
  z-index: 1000;
}

/*
  Top level menu item containers.
  Position children relative to this container
  and same fixed width as parent.
  Since all menu items are links, font-size here has no effect.
*/
ul.MenuBarVertical li
{
  margin: 0px 0px 0px 0px;   /* was 0 */
  padding: 0px 0px 0px 0px; /* was 0 */
  list-style-type: none;
  font-size: 8px;           /* was 100%. Seems to have no effect in IE6 */
  position: relative;
  text-align: right;         /* was left */
  cursor: pointer;
  width: 135px;              /* was 8em then 110px */  /*  border: 1px solid yellow; */
}

/*
  Submenus appear slightly overlapping to the right (95%) and
  up (margin: -5% 0 0 95%) with a higher z-index,
  but they are initially off the left side off the screen (-1000em).
  This controls the white box that contains the menu element. changing the width
  alters the width of the white box, but does not alter the width of the
  contained menu element.
*/
ul.MenuBarVertical ul
{
  margin: 4% 0 0 95%; /* was -5% 0 0 95% */
  padding: 0;
  list-style-type: none;
  font-size: 100%;
  position: absolute;
  z-index: 1020;
  cursor: default;
  width: 250px;       /* was 8.2em then 200px */
  left: -1000em;      /* push submenu off the left side of the screen */
  top: 0;
  background-color: #FFFFFF;
}

/*
  Submenu with class designation MenuBarSubmenuVisible,
  is set left to 0 so it comes onto the screen.
*/
ul.MenuBarVertical ul.MenuBarSubmenuVisible
{
  left: 0px;
}

/*
  Submenu item containers. These are the individual menu containers in the
  floating menus. These can be of a width less than the overall floating contaier.
*/
ul.MenuBarVertical ul li
{
  text-align: left;
  width: 250px;            /* was 8.2em then 250px */
  border: 0px solid #eee;
}

/*******************************************************************************

 DESIGN INFORMATION: describes color scheme, borders, fonts

 *******************************************************************************/

/*
  Main menu container has no borders on all sides
*/
ul.MenuBarVertical
{
  border: 0px solid #CCC;
  color: #000000;        /* seems to have no effect in IE6 */
}

/*
  Submenu containers have borders on all sides with
  a bottom-right shadow effect.
*/
ul.MenuBarVertical ul
{
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
  border-right: 3px solid #aaa;
  border-bottom: 3px solid #aaa;
}

/*
  Menu items are a light gray block with padding and no text decoration.
  Padding put space betwen letters and the right arrow.
  Set menu font size and font weight
  Cursor set to "pointer" to get finger image, otherwise it would be arrow.
*/
ul.MenuBarVertical a
{
  display: block;
  /* cursor: pointer; */
  margin: 0px 0px 0px 0px; /* new */
  padding: 5px 15px;          /* was 0.5em 0.75em; */
  color: #000;
  text-decoration: none;
  font-size: 18px;        /* was 0.8em */
  font-weight: bold;
}

/*
  Menu items that have mouseover or focus have a burgundy background and white text
*/
ul.MenuBarVertical a:hover,
ul.MenuBarVertical a:focus
{
  background-color: #9B0545;
  color: #FFF;
  text-decoration: none;
}

/*
  Menu items that are open with submenus are set to MenuBarItemHover with a
  burgundy background and white text
*/
ul.MenuBarVertical a.MenuBarItemHover,
ul.MenuBarVertical a.MenuBarItemSubmenuHover,
ul.MenuBarVertical a.MenuBarSubmenuVisible
{
  background-color: #9B0545;
  color: #FFFFFF;
}

/*******************************************************************************

 SUBMENU INDICATION: styles if there is a submenu under a given menu item

 *******************************************************************************/

/*
  Menu items that have a submenu have the class designation MenuBarItemSubmenu and
  are set to use a background image positioned on the far right (100%) and centered
  vertically (50%)
*/
ul.MenuBarVertical a.MenuBarItemSubmenu
{
  background-image: url(SpryMenuBarRight.gif);
  background-repeat: no-repeat;
  background-position: 100% 50%;
  color: #000000;
}

/*
  Menu items that are open with submenus have the class designation
  MenuBarItemSubmenuHover and are set to use a "hover" background image
  positioned on the far right (100%) and centered vertically (50%)
*/
ul.MenuBarVertical a.MenuBarItemSubmenuHover
{
  background-image: url(SpryMenuBarRightHover.gif);
  background-repeat: no-repeat;
  background-position: 100% 50%;
  color: #FFFFFF;
  background-color: #9B0545;
}

/*******************************************************************************

 BROWSER HACKS: the hacks below should not be changed unless you are an expert

 *******************************************************************************/

/*
  HACK FOR IE: to make sure the sub menus show above form controls,
  we underlay each submenu with an iframe
*/
ul.MenuBarVertical iframe
{
  position: absolute;
  z-index: 1010;
}

/*
  HACK FOR IE: to stabilize appearance of menu items;
  the slash in float is to keep IE 5.0 from parsing
*/
@media screen, projection
{
  ul.MenuBarVertical li.MenuBarItemIE
  {
  display: inline;
  f\loat: left;
  background: transparent;
  }
}

