/* page colors */
html {
  background-color: #ddd; /* Opera 10.x doesn't support CSS gradients */
  background:      linear-gradient(top, black 0%, #eaeaea 50%, white 100%);
  background:   -o-linear-gradient(top, black 0%, #eaeaea 50%, white 100%);
  background: -moz-linear-gradient(top, black 0%, #eaeaea 50%, white 100%);
  background: -webkit-gradient(linear, left top, left bottom, from(black), to(white), color-stop(50%, #eaeaea));
}
body {
  /*background-color: #efeae0;*/
  background-color: white;
  border: 1px solid #aaa;
  box-shadow         : 0px 1px 10px #888;
  -o-box-shadow      : 0px 1px 10px #888;
  -moz-box-shadow    : 0px 1px 10px #888;
  -webkit-box-shadow : 0px 1px 10px #888;
}
h1 {
  text-shadow         : 1px 1px 1px gray;
  -o-text-shadow      : 1px 1px 1px gray;
  -moz-text-shadow    : 1px 1px 1px gray;
  -webkit-text-shadow : 1px 1px 1px gray;
  color: white;
  background-color: #743; /* Opera 10.x doesn't support CSS gradients */
  background:      linear-gradient(left, black 5%, #fa6e12);
  background:   -o-linear-gradient(left, black 5%, #fa6e12);
  background: -moz-linear-gradient(left, black 5%, #fa6e12);
  background: -webkit-gradient(linear, left center, right center, from(black), to(#fa6e12));
  box-shadow         : -2px 1px 10px #888;
  -o-box-shadow      : -2px 1px 10px #888;
  -moz-box-shadow    : -2px 1px 10px #888;
  -webkit-box-shadow : -2px 1px 10px #888;
}
h1 + p {
  color: brown;
  text-shadow         : 1px 1px 1px gray;
  -o-text-shadow      : 1px 1px 1px gray;
  -moz-text-shadow    : 1px 1px 1px gray;
  -webkit-text-shadow : 1px 1px 1px gray;
}
h2 {
  color: brown;
  border-bottom: 1px inset brown;
}
h3 {
  border-bottom: 1px dashed #cccccc;
}

/* main blocks */
header {
  background-color: white;
}
footer {
  background-color: white;
  border-top: 1px dashed #cccccc;
}
.highlight {
  background-color: #fed;
  border: 1px solid #fdd;
  box-shadow         : 0px 1px 10px #888;
  -o-box-shadow      : 0px 1px 10px #888;
  -moz-box-shadow    : 0px 1px 10px #888;
  -webkit-box-shadow : 0px 1px 10px #888;
}
#warning {
  background-color: #fee;
}
blockquote {
  background-color: #eee;
  box-shadow         : 0px 1px 10px #888;
  -o-box-shadow      : 0px 1px 10px #888;
  -moz-box-shadow    : 0px 1px 10px #888;
  -webkit-box-shadow : 0px 1px 10px #888;
}

/* navigation menu */
header nav ul {
  border-bottom: 2px solid brown;
}
header nav li a {
  transition         : all 0.3s;
  -o-transition      : all 0.3s;
  -moz-transition    : all 0.3s;
  -webkit-transition : all 0.3s;
}
header nav li a {
  background-color: brown;
  border-top   : 2px solid brown;
  border-left  : 2px solid brown;
  border-right : 2px solid brown;
  color: white !important;
}
header nav li.active a,
header nav li:hover a,
* html nav li a:hover {
  background-color: white;
  color: brown !important;
}

/* navigation submenu */
.submenu a {
  color: navy !important;
}
.submenu a.active {
  color: brown !important;
}

/* SMIL navigation buttons */
.menu button {
  background-color: #ddf;
  border: 1px solid #cce;
}
.menu button:hover {
  background-color: #ccf;
}