body, table, p, td {
   font: normal 1em sans-serif;
}

body {
   margin: 0px;
   padding: 0px;
   color: gray;
   background-color: <% color.bg %>;
   font: normal 1em sans-serif;
}

a {text-decoration: none;}
a:hover {text-decoration: underline;}
a:link, a:visited  {color: <% color.button %>;}
//a.visited {color: <% color.box %>;}
a:active {color: <% color.head %>;}

tt, code, pre {
   font-size: 1.3em;
}

pre {
   margin: 0 0 -0.7em 0;
}

form {
   margin: 3px 0;
}

input {
   margin: 3px 0;
}

input.text {
   border: 1px solid <% color.ink %>;
   padding: 1px;
   color: gray;
   font-size: 0.9em;
}

input.button {
   border: 1px solid <% color.ink %>;
   color: white;
   background-color: <% color.button %>;
   font-size: 0.9em;
}

input.checkbox {
}

table.body {
   padding: 0 20px;
}

td.body {
   padding-top: 20px;
   padding-right: 50px;
   padding-bottom: 20px;
   vertical-align: top;
}

td.sidebar {
   width: 200px;
   vertical-align: top;
}

table.main {
   background-color: <% color.paper %>;
   color: <% color.ink %>;
   border: 1px dashed <% color.button %>;
   border-collapse: collapse;
}

table.main tr {
   color: <% color.ink %>;
}

table.main tr.head {
   background-color: <% color.button %>; 
   color: <% color.sub %>;
}

table.main td, table.main th {
   padding: 3px 10px;
}

table.main th {
   color: <% color.sub %>;
   background-color: <% color.button %>;
   border: 1px dotted <% color.bg %>;
   vertical-align: top;
   font-size: 0.7em;
}

table.main td {
   border: 1px dotted <% color.bg %>;
   vertical-align: top;
   font-size: 0.7em;
}

table.main th.middle {
   vertical-align: middle;
}

table.header {
   margin-top: -5px;
   padding: 0 20px 15px 20px;
   border-bottom: 1px solid <% color.box %>;
   background-color: <% color.head %>;
   color: white;
}

table.header td.message {
   vertical-align: bottom;
}

span.message {
   padding: 2px 5px;
   color: <% color.page %>;
   font: bold 0.8em sans-serif;
}

span.alert {
   padding: 2px 5px;
   color: <% color.msg %>;
   background-color: <% color.paper %>;
   border-left: 5px double <% color.msg %>;
   font: bold 0.8em sans-serif;
}

div.parss1 {
   width: 200px;
   text-align: left;
   font: normal 4.2em serif;
}

span.parss2 {
   margin-left: 3px;
   font: bold 0.65em sans-serif;
   letter-spacing: 1px;
}

div.subtitle {
   position: relative;
   top: -1.23em;
   left: 1.7em;
   margin-bottom: -1.23em;
   margin-right: 1.7em;
   color: <% color.sub %>;
   font: normal 0.2em sans-serif;
}

div.section {
   margin-bottom: 5px;
   color: <% color.button %>;
   font: normal 1.5em serif;
}

div.copy {
   margin-bottom: 40px;
   color: <% color.paper %>;
   line-height: 1.2em;
}

div.legend {
   margin-bottom: 2px;
   color: <% color.paper %>;
   font-size: 0.7em;
}

div.code {
   padding: 5px;
   border: 1px dashed <% color.button %>;
   color: <% color.ink %>;
   background-color: <% color.paper %>;
   font: normal 0.9em monospace;
   white-space: pre;
}

div.box {
   width: 160px;
   margin-top: 20px;
   border: 1px dashed <% color.box %>;
   background-color: <% color.bg %>;
   text-align: left;
   font-size: 0.7em;
}

div.box div.title {
   padding: 2px;
   color: <% color.sub %>;
   background-color: <% color.box %>;
   font-weight: bold;
   text-align: center;
}

div.box input.text {
   width: 90px;
}

div.box div.content {
   padding: 5px;
   background-color: <% color.paper %>;
}

div.button {
   margin-top: 10px;
   margin-left: 20%;
}

.smallcaps {
   font-size: 0.9em;
   font-variant: small-caps;
   letter-spacing: 1px;
}