/* Drop styles */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p,
blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em,
font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ul, ol, li, fieldset, form, label, legend, table, caption, tbody,
tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0;
font-weight: inherit; font-style: inherit; font-size: inherit;
font-family: inherit; vertical-align: baseline; background: transparent;}
:focus {outline: 0;}
body {line-height: 1em;color: black;background: white;}
ul {list-style: none;}
table {border-collapse: collapse; border-spacing: 0;}
caption, th, td {text-align: left;font-weight: normal;}
/* End of drop */

/* ---- palette ----
 * #ffedbf - neutral warm
 * #f7803c - ultrasonic motion
 * #f54828 - underwater
 * #2e0d23 - sound waves
 * #f8e4c1 - falling light
 */

body {
  font-family: "Trebuchet MS", Helvetica, sans-serif;
  font-size: 16px;
  line-height: 2.6ex;
}
h1, h2, h3, h4, h5, h6 {
  font-family: Georgia, serif;
  font-weight: normal;
  margin: 2.6em 0 0.4em 0;
}
h1 { font-size: 400%; }
h2 { font-size: 200%; }
h3 {
  font-style: italic;
  font-size: 110%;
  font-weight: lighter;
  border-right: 2px solid #f8e4c1;
  border-left: 2px solid #2e0d23;
  margin-left: -14px;
  margin-right: -14px;
  padding-left: 14px;
  padding-right: 14px;
}

a, a:visited {
  text-decoration: underline;
  color: #f54828;
}
a:hover {
  color: #f8e4c1;
  background-color: #f54828;
}

p { margin: 0.4em 0; }
li { margin-bottom: 1.2em; }

sup {
  position: relative;
  top: -1ex;
  margin-left: 0.5ex;
  font-size: 65%;
}
code {
  font-family: "Andale Mono", monospace;
  background-color: rgba(150, 150, 150, 0.15);
}

html, body { height: 100%; }
#wrapper { min-height: 100%; }
* html #wrapper { height: 100%; }
body {
  background-color: #f8e4c1;
  min-width: 760px;
}
#left, #right {
  width: 50%;
  float: left;
  position: relative;
  padding-bottom: 30064px;
  margin-bottom: -30000px;
}
* html #left, * html #right { width: 49.9%; }
#wrapper {
  overflow: hidden !important;
  overflow: visible;
  position: relative;
}
* html #wrapper, * html #footer { width: expression(((document.documentElement.clientWidth || document.body.clientWidth) < 760)? "760px" : "100%"); }

#left {
  color: #f8e4c1;
  background: #2e0d23 url(left-top.png) top left no-repeat;
  text-align: right;
}
#right {
  color: #2e0d23;
  background: #f8e4c1;
}

h1 {
  width: 760px;
  text-align: center;
  line-height: 120%;
  margin: 0.8em 0 0 0;
  display: inline-block;
}
#left h1 { margin-right: -380px; }
#right h1 { margin-left: -380px; }
.header { overflow: hidden; }
.content { padding: 40px; }

#footer {
  background: url(right-bottom.png) bottom right no-repeat;
  color: #f7803c;
  text-align: right;
  height: 64px;
  margin-top: -64px;
  position: relative;
  overflow: hidden;
}
#footer p {
  padding-right: 50px;
  font-size: 75%;
}

#left li {
  background: url('dot.gif') top right no-repeat;
  margin-right: -17px;
  padding-right: 17px;
}
#right li {
  background: url('dot.gif') top left no-repeat;
  margin-left: -17px;
  padding-left: 17px;
}
* html li { width: 100%; } /* hasLayout */
* html li p { margin-top: 0; }

p.note { font-size: 75%; }

