/* Code copyright (c) Willett Consulting Limited 2010-2016 */

/* This style sheet will be included by all browsers. Styles will be overridden
 * by styles in the browser specific style sheets. It contains the styles for the menu. */

.menuBar
{
  display: inline;
  border: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

#leftMenuBar
{
  float: left;
}

#rightMenuBar
{
  float: right;
  padding-right: 3px;
}

.menuBar li
{
  padding-left: 3px;
  padding-right: 3px;
  list-style: none;
  float: left;
}

.menuBar li a
{
  display: block;
  padding-left: 3px;
  padding-right: 3px;
  color: #FFFFFF;
  text-decoration: none;
}

.menuBar li a:hover
{
  color: #FFA500;
  background-color: #009966;
  text-decoration: none;
}

.menuBar li ul
{
  display: none;
  background-color: #FFFFFF;
  /* Put a frame on the sides of the menu. The bottom is added in the li elements.
   * This allows for a separator without getting a double line at the bottom. This
   * could be done with sibling selector style but this doesn't work in IE. */
  border-left:1px solid #009966;
  border-right:1px solid #009966;
}

.menuBar li:hover ul,
.menuBar li.hover ul
{
  display: block;
  position: absolute;
  margin: 0;
  padding: 0;
  z-index: 100;
}

.menuBar li:hover li,
.menuBar li.hover li
{
  float: none;
  border-bottom:1px solid #009966;
  background-color: #FFFFFF;
}

.menuBar li:hover li a,
.menuBar li.hover li a
{
  padding-left: 5px;
  padding-right: 5px;
  color: #009966;
}

.menuBar li:hover li:hover,
.menuBar li:hover li:hover a,
.menuBar li.hover li.hover,
.menuBar li.hover li.hover a
{
  color: #FFA500;
  background-color: #009966;
}

.menuBar li li a:hover
.menuBar li li a.hover
{
  text-decoration:none;
}