/* Menu styles (pure CSS - see Meyer) */

ul.menu {
  padding: 0;
  margin: 1em 0 1em 0;
  border-style: none;
  border-width: 0;
  font-family: verdana, arial, helvetica, sans-serif;
  background-color: transparent;
}

ul.h {
  float: left;
  margin: 0 1em 0 0;
}

ul.menu li {
  list-style-type: none;
  border: 1px solid transparent;
  position: relative;
  margin: 0;
  padding: 1px 1em 1px 1em;
  background-color: transparent;
  opacity: 1;
  color: white;
  white-space: no-wrap;
}

* html ul.menu li {       /* IE6 only because transparent border not supported */
  border-color: #888;
  margin: 1px !important;
}

ul.h li {
  float: left;
  padding: 1px;
}

ul.h > li {
  width: 10em;
}

ul.menu > li > a {
  font-weight: bold !important;
  font-size: 12pt;
}

ul.menu li:hover {
  background-color: #7BBDBD;
  border-color: #7BBDBD;
  border-style: outset;
  z-index: 100;
}

ul.menu ul {
  display: none;
}

ul.menu li:hover > ul {
  display: block;
  position: absolute;
  margin: 0;
  padding: 0;
  left: 90%;
  width: 12em;
}

ul.h > li:hover > ul {
  top: 100%;
  left: 0.5em;
}

ul li:hover > ul {
 top: 2px;
 left: auto;
 right: 95%;
}

ul.menu li:hover ul li {
  background-color: #008484;
  width: 90%;
  margin: 0;
  border: 1px solid #006060;
  padding: 1px 1em 1px 1em;
  color: white;
}

*+html ul.menu li:hover ul li {      /* IE7 only hack */
  xxxwidth: 10em;
}

ul.menu li ul li:hover {
  background-color: #7BBDBD;
  border-style: outset;
  border-color: #7BBDBD;
}

ul.menu li a {
  display: block;
  margin: 0;
  padding: 0;
  text-decoration: none;
  color: white !important;
  font-weight: normal;
  white-space: no-wrap;
}

ul.menu li a.selected {
  outline-width: 1px;
  outline-style: dashed;
  outline-color: white;
}

ul.menu li b {
  display: block;
  text-decoration: none;
  font-weight: 500;
  color: white;
}


ul.menu li a[title='Courts'] + ul li ul {
  width: 24em;
  max-height: 28em;
  overflow: auto;
}