body { 
  background: #009933;
}

#top {
  border: #000 2px solid;
  background: #cccc99;
  color: #000;
  padding: 5px;
  margin-bottom: 5px;
  width: 99%;
  text-align: center;
  font-size: xx-large;
  font-weight: bold;
}

#main { 
  border: #000 2px solid;
  padding: 0px 20px 50px 18px;
  background: #fff;
}

#side {
  width: 20%;
  float: left;
  border-right: #000 2px solid;
  border-bottom: #000 2px solid;
  margin-left: -18px;
  margin-right: 18px;
  background: #cccc99;
  padding: 5px 5px 5px 30px;
}

div.code {
  background: #ffffcc;
  border: #000 1px solid;
  padding: 5px;
  width: 65%;
  margin-top: 5px;
  margin-bottom: 5px;
}

div.longcode {
  background: #ffffcc;
  border: #000 1px solid;
  padding: 5px;
  width: 90%;
  margin-top: 5px;
  margin-bottom: 5px;
}

div.note { 
  float: right; 
  width: 30%; 
  background: #ff9; 
  color: #000;
  border: #000 1px solid; 
  padding: 5px;
  margin-top: 10px;
  font-style: italic;
} 

li { margin-top: 20px; }
td { valign: top; }

#main p, #main li, #main td, #main ol, #main ul {
  font: Georgia, serif;
}

#side *, #top * { font-family: Tahoma, Verdana, sans-serif; }

code {
  color: #630;
  font: medium courier, monospace;
}

dt { font-size: large; 
     text-indent: -25px;}

a { color: #006600 }

span.file { font: medium courier, monospace; }
span.prog { font-family: Tahoma, Verdana, sans-serif; }
span.out  { font: medium courier, monospace; }