/* VERTICAL FREESTYLE MENU LAYOUT */

/* All <ul> tags in the menu including the first level */

.fsmenu, .fsmenu ul
{
   margin: 0px;
   padding: 0px;

   width: 180px;

   list-style: none;
}

/*
 Submenus (<ul> tags) are hidden and absolutely positioned across from their parent.
 They don't *have* to touch their parent menus, but is' a good idea as CSS-only fallback
 mode requires menus to touch/overlap (when JS is disabled in the browser).
*/

.fsmenu ul
{
   top: -1px;
   left: 178px;

   display: none;

   position: absolute;
}

/*
 All menu items (<li> tags) are relatively positioned to correctly offset their submenus.
 They have borders that are slightly overlaid on one another to avoid doubling up.
*/

.fsmenu li
{
   position: relative;

   border: 1px solid #330;

   background-color: #F27900;

   margin-bottom: -1px;
}

.fsmenu ul>li:last-child
{
   margin-bottom: 1px; /* Mozilla fix */
}

/* Links inside the menu */

.fsmenu a
{
   color: #303030;

   padding: 9px 9px 9px 30px;

   display: block;

   text-decoration: none;

   background-image: url(../img/menu/img-mnu-bkg.gif);
   background-repeat: no-repeat;
}

/*
 Lit items: 'hover' is mouseover, 'highlighted' are parent items to visible menus.
*/

.fsmenu a:hover, .fsmenu a.highlighted:hover, .fsmenu a:focus
{
   color: #000000;
   background-color: #FFCC00;
}

.fsmenu li ul li a:hover, .fsmenu  li ul li a.highlighted:hover, .fsmenu li ul li a:focus
{
   color: #000000;
   background-color: #FFCC00;
}

.fsmenu a.highlighted
{
   color: #000000;
   background-color: #FFCC00;
}

/*
 If you want per-item background images in your menu items, here's how to do it.
 1) Assign a unique ID tag to each link in your menu, like so: <a id="xyz" href="#">
 2) Copy and paste these next lines for each link you want to have an image:
    .fsmenu a#xyz {
      background-image: url(out.gif);
    }
    .fsmenu a#xyz:hover, .fsmenu a.highlighted#xyz, .fsmenu a:focus {
     background-image: url(over.gif);
    }
*/


/* 'subind' submenu indicators, which are automatically prepended to 'A' tag contents. */

.fsmenu a .subind
{
   float: right;

   padding-top: 4px;
}

/*
 HACKS: IE/Win:
 A small height on <li> and <a> tags and floating prevents gaps in menu.
 * html affects <=IE6 and *:first-child+html affects IE7.
 You may want to move these to browser-specific style sheets.
*/

*:first-child+html .fsmenu li
{
   float: left;
   width: 100%;
}

* html .fsmenu li
{
   float: left;
   height: 1%;
}

* html .fsmenu a
{
   height: 1%;
}

/* End Hacks */