body{ background: #000; color: #ddd; font-family: verdana, sans-serif; font-size: 14pt; margin: 0px; 
}

a{ color: #99f; text-decoration: none; border-bottom: 1px #99f dotted; }
a:visited{ color: #f9f; text-decoration: none; border-bottom: 1px #f9f dotted; }
a:hover{ border-bottom: 1px #ffc solid; color: #ffc; }

h1{ /* one per page + subhead */
  position: absolute; top: 150px; left: 150px; color: #222; z-index: 0;
  font-size: 70pt; font-weight: normal; font-style: italic; letter-spacing: -1px; margin: 0x;
}
h1.subhead{ top: 210px; left: 170px; color: #333; z-index: 1; font-size: 60pt;}
h1.subhead2{ top:290px; left: 200px; color: #444; z-index: 2; font-size: 40pt;}

h2{ /* more than one per page */  
  color: #666; z-index: 2; font-size: 30pt; font-weight: normal; display: inline;
  border-left: 1px #660 dotted; padding-left: 10px;
}
a:hover h3{ color: #fff; }

h3{ /* more than one per page, subsection of h2 */
  color: #aaa; font-size: 15pt; font-weight: normal; margin: 0px; margin-left: 10px;
}

h4{ /* more than one per page, subsection of h3 */
  position: relative; color: #ddd; font-size: 8pt; font-weight: normal; margin: 5px;
  margin-left: 20px;
}
.over{ color: #aa8; }
.hide{ display: none; }
.show{ display: block; }
.panelinfo td{ position: relative; z-index: 5; border: 1px #222 solid; background: #111;
  padding: 10px; opacity: 0.75; -moz-border-radius: 10px 10px 10px 10px;
}
.panelinfo h2{ color: #fff; }
.none td{ border:0; -moz-border-radius: 0; }
iframe{ position: relative; z-index: 3; }

hr{ height: 0px; color: #f00; border:0; border-bottom: 1px #333 dashed; }

.panel1{
  border: 1px #222 dotted; background: #111;
  padding: 10px; opacity: 0.75;
  -moz-border-radius: 10px 10px 10px 10px;
  color: #555; font-size: 8pt; 
}

#rendered_surface{ 
  /* because this interface is positioned dynamically after loading, wait until it's positioned to render it */
  position: absolute;
  left: -2000px;
}