/*
  Menu Stylesheet. E.F. de Moor, nov  1204
  Naming conventions: top level = level 1

  Any menu is built as an unordered list with links.
  The behaviour and appearance of the menu is regulated in a stylesheet.
  Tags are used for the following purposes:

  UL : Group the menu items of a menu (level)
       The entire (sub) menu can be hidden by hiding the UL tag
  LI : A single list item.
       If it has a submenu, its surrounding UL tag must be witin the LI
       After processing the tree, The items derived from LI triggers it's submenu (from UL)
       to be displayed or hidden.
       The stylesheet may do some tweaking with the position, e.g. place it over the border of the previous item
  A  : The link, used for rendering the actual menu item.
  Tags are defined in a style sheet.

  Behaviour of these menus is defined by the position attribute of the _sub class
  If UL is defined as:
    fixed     : The submenu is positioned independently of the parent item
    relative  : The submenu is rendered as a folding menu (between the list)
    absolute  : The submenu is rendered as a popup menu (above the list)
*/

/* Definitions for unsupported browsers   */

.m1 {
    /* Definition for firstly defined menu */

    /* CAUTION: Don't define a position, otherwise IE level2 will dissapear on mouse-over of level1 items...?!?!? */
    /*position: relative; */
    margin: 0px;
    padding: 0px;
    z-index: 10;
  }

/* Positioning individual menu items */

.m1 .level1 {
    float: none;
    width: 120px;
    margin: 0px;
    padding: 1px;
    padding-left: 60px;
    margin-bottom:  1px;
  }

/* Positioning menu items level 2 and further */

.m1 .level2 {
    float: none;
    width: 105px;
    margin: 0px;
    padding: 0px;
    margin-left: 13px;
    margin-bottom: 1px;
  }

/* Positioning submenus */

.m1 .level1_sub {
    position: relative;
    z-index: 40;
    width: 120px;
    margin: 0px;
    padding: 2px;
  }

/* Appearance of the menu items */

.m1 .level1 .layer1 {
    color: #3B3ACD;
    font-size: 14px;
    font-family:  Apple Chancery, Verdana, Arial, Helvetica, sans-serif;
    text-decoration: none;
    font-weight: bold;
    text-align: left;
    height: 17px;
    padding: 0x;
    padding-top: 0px;
    margin: 0px;
    padding-left: 20px;
    padding-right: 0px;
    margin-bottom: 0px;
    background-color: #FFFFFF;
    border-style: double;
    border-color: #FFFFFF;
  }

.m1 .level1 .level2 .layer1 {
    color: #3B3ACD;
    font-size: 10px;
    font-family:  Apple Chancery, Verdana, Arial, Helvetica, sans-serif;
    text-decoration: none;
    font-weight: bold;
    text-align: left;
    height: 17px;
    padding: 0x;
    padding-top: 0px;
    margin: 0px;
    padding-left: 20px;
    padding-right: 0px;
    margin-bottom: 0px;
    background-color: #FFFFFF;
    border-style: double;
    border-color: #FFFFFF;
  }

.m1 .level1.expanded .layer1 {
    color: 3B3ACD;
    background-color:  #FFFFFF;
    border-style: double;
    border-color: #3B3ACD;
  }

.m1 .level1.expanded .layer1:hover,
.m1 .level1.selected .layer1:hover,
.m1 .level1.expanded .level2.selected .layer1 {
    color: #282899;
    background-color:  #FFFFFF;
  }


.m1 .level1.selected .layer1 {
    color:  #3B3ACD;
    background-color:  #FFFFFF;
    border-style: double;
    border-color: #3B3ACD;
   }

.m1 .level1 .layer1:hover {
    color:  #282899;
    background-color:  #FFFFFF;
  }
  
.m1 .level1.expanded .level2 .layer1, 
.m1 .level1.selected .level2 .layer1 {
    color:  #3B3ACD;
    background-color:  #FFFFFF;
    border-style: double;
    border-color: #3B3ACD;
  }

.m1 .level1.expanded .level2 .layer1:hover, 
.m1 .level1.selected .level2 .layer1:hover {
    color:  #282899;
    background-color:  #FFFFFF;
  }
