

body {
  margin: 0;
  background-color:#f0f0f0;
  color:#ccc;
}

div#button {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  height: 50px;
  width: 50px;
}

div#button:hover {
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}

div#slider {
  white-space: nowrap; /* nobr */
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99;
  
  width: 230px;
  /*height: 300px; NOT NEEDED */
  background: #fff;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  
  /* Drop Shadow (offset left, top, thickness, color with alpha) */
  -webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.3);
  box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.3);
  /* IE */
  filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='gray', Positive='true');
  /* slightly different syntax for IE8 */
  -ms-filter:"progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='gray')";
}

div#slider h1 {
  color: #000;
  margin: 10px 20px 0 60px; /* same as button width + 10 */
  padding: 0;
  font-size: 24px;
  height: 50px; /* same as button height */
}

ul#menu {
  /* Gradient */
  background: #fff url('grad.png') repeat-x bottom left;
  background-image: -moz-linear-gradient(top, #fff, #ccc);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#cccccc));
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffff33,endColorstr=#cccccc33);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#fffff33,endColorstr=#cccccc33)";
   
  margin: 0;
  padding: 0;
  list-style-type: none;
}

ul#menu li {
  width: 100%;
  background: #fff;
  display: inline; /* KLUDGE: REmoves large gaps in IE/Win */
}

ul#menu li a {
  display: block;
  width: 100%;
  height: 30px;
  line-height: 30px;
  color: #000;
  text-decoration: none;
  text-indent: 1em;
  font-family: Verdana, Arial, sans-serif;
  font-size: 16px;
}
ul#menu li a span.witticism {
  font-size: 12px;
  color: #999;
  display: none;
}

ul#menu li a:hover {
  color: #00f;
  background: #cdf;
}

ul#menu li a:hover span.witticism {
  display: inline;
}