* {margin: 0; padding: 0; }

body { font: 100% Helvetica, Arial, sans-serif; background: #dad6c5 url('images/marbled_top.gif') repeat-x;}

/* div, h1 { border: 1px dashed red; } */
img {visibility: hidden; width: 0px; height: 0px;}


#container {  width: 822px; margin: 0 auto;  padding: 0 40px 0 38px;}

div.clear {clear: both;}

.container_top, .container_bottom { height: 37px; width: 900px; margin: 0 auto; }
.container_middle {background: url('images/dark_middle.png') repeat-y 0 0; }
.container_top { margin-top: 20px; background: url('images/dark_top.png') no-repeat 0 0; }
.container_bottom { margin-bottom: 20px; background: url('images/dark_bottom.png') no-repeat 0 0; }

#header { background-color: #ad8; min-height: 1.4em; border-bottom: 2px dotted #aaa; padding: 1em; position: relative;}
h1 { font-size: 1.5em; color: #574; position: absolute; bottom: 11px; left: 12px; width: 65%; font-family: Verdana, sans-serif; }
h2 { text-align: right; position: absolute; bottom: 9px; right: 12px; width: 35%; }
#nav { width: 130px; float: left; position: relative;}

div#nav ul {margin-top: 2em; margin-bottom: .8em;}
div#nav li {font-size: .8em; line-height: 2.5em; font-weight: bold; border-bottom: 1px dotted #696; border-right: 1px dotted #696; display: block; padding-left: 1em;}
div#nav ul:first-child {border-top: 1px dotted #696;}
div#nav a {text-decoration: none; color: #600;}
div#nav li a:hover {text-decoration: underline;}
div#nav li a:visited {color: #876; }

#content {  width: 650px; float: left; font-size: .9em; line-height: 1.5em; padding-left: 2em;}
#content p { margin-top: 2em; }

#footer { clear: both; padding-top: 5em; color: #aa8; font-size: .7em; text-align: right;}

pre, .callout {border: 1px dotted #aaa; margin: 1.5em 3em; padding: .6em;}
.callout { background-color: #fec;   font-family: Geneva, Monaco, sans-serif; font-size: .9em;}
pre { background-color: #ffc;  }