#menu-div {
  width: 47em;
  height: 4em;
  /*  border-style: solid;
  border-color: red;*/
  margin-left: auto;
  margin-right: auto;
  }

#menu-spacer {
  width: 100%;
  height: 0.7em;
  }

#menu {
  list-style: none;
  margin: 0;
  padding: 0;
  font-family: CinsualFont,serif;
  font-size: 1.5em;
  white-space: nowrap;
  }

#menu ul {
  padding: 0;
  margin: 0;
  z-index: 99;
  visibility: hidden;
  }

#menu>li ul {
  /* Sub-menu settings. */
  list-style: none;
  width: 90%;
  text-align: left /* Aligns sub-menu to the left. */;
  font-size: 0.8em /* Sets sub-menu font size. */;
  }

#menu li {
  /* Appearance settings (eye candy) */
  background: #000000;
  color: #FF00FF;
  border: solid 1px #663366;
  height: auto;
  max-width: 9em /* Maximum width of menus. */;
  }

#menu>li {
  margin: 0;
  float: left;
  text-align: center;
  height: 1.6em;
  }

#menu a {
  text-decoration: none;
  padding: 0 0.5em;
  line-height: 1.6em;
  background: transparent;
  color: inherit;
  overflow: hidden;
  }

#menu ul, #menu li, #menu a { display: block; }

/* Shadow! */
#menu li:hover {
  /*  border-style: outset;*/
  /*  background: #D7D7D7;*/
  background: #1AD;
  color: white;
  }

#menu>li ul {
  /*  background: #666;*/
  /*  background: transparent url("trans/black40.png"); */
  }

#menu>li>ul {
  margin: -1px /* This is to make the width equal to parent li width. */;
  position: relative;
  top: 4px;
  left: 4px;
  }

#menu>li ul li {
  position: relative;
  top: -4px;
  left: -4px;
  }
/* end shadow */

/* Interactive lines: show/hide menus */
#menu li:hover ul {
  visibility: visible;
}