html {
   color: #5f380c;
   font-size: 62.5%;
}

body {
   margin-left: 0;
   padding: 0;
   /* background: url(/static/template.png); */
}

body.main #controls button a {
   text-decoration: none;
   color: black;
}

body.main #controls {
   margin: 20px 0;
}

a {
   color: #508df8;
   text-decoration: none;
}

a:hover {
   color: #ab5e04;
}

hr {
   height: 1px;
   margin: 0;
   padding: 0;
   border: none;
   border-bottom: 1px dashed #5f380c;
   line-height: 0;
}

h1 {
   font-size: 1.5em;
   padding-top: 1em;
}

h2 {
   font: 1.2em sans-serif;
   padding-top: 1em;
}

h1.first, h2.first {
   padding-top: 0;
}

h1.first .controls {
   display: block;
   margin-bottom: 0.5em;
   color: #ab5e04;
   font-size: 0.66em;
}

form.form textarea, form.form select {
   width: 400px;
}

form div.detail {
   margin-top: 5px;
}

form label {
   margin-left: 5px;
}

form.form textarea {
   height: 50px;  
}

form input[type=radio], input[type=checkbox] {
   vertical-align: middle;
   margin: 3px 0;
}

button {
   margin-right: 5px;
   border: 1px solid #ab5e04;
   color: #ffffff;
   background-color: #508df8;
   font: 0.85em sans-serif;
}

button:hover {
   background-color: #5f380c;
}

div .input input[type=text] {
   width: 2em;
   margin: 3px 0;
}

div#controls {
   padding-top: 1em;
}

em {
   font-style: italic;
}

strong {
   font-weight: bold;
}

ol li, ul.numbered li, .toc li {
   list-style: decimal inside;
}

.paragraph {
   margin: 0.7em 0;
}

.preview .paragraph {
   margin: 0;
}

.controls a, .grid-header li a {
   padding-left: 7px;
}

.small {
   font: 0.85em sans-serif;
}

.error {
   padding: 1px; 
   color: white;
   background: #cc0000;
}

.images span {
   display: block;
}

.right {
   text-align: right;
}

.print {
   display: none;
}

.mapLink {
   padding-left: 0.5em;
}

/* YUI Grid */

#yui-grid {
   /* width: 78.77em; FIXME: Why em? */
   /* *width: 76.87em; FIXME: What's that syntax??? */
   width: 1024px;
   min-width: 1024px;
   margin: 0;
   text-align: left;
}

#yui-grid.yui-t1 #yui-main .yui-b {
   margin-left: 182px;
}

#yui-hd {
   margin: 0 44px 0 42px;
}

#yui-main .yui-u.first {
   width: 402px;
   border: 0;
   outline: 0;
   border-top: 27px solid #ffffff;
   border-bottom:27px solid #ffffff;
   border-left: 18px solid #ffffff;
   border-right: 18px solid #ffffff;
   background-color: #ffffff;
   overflow: hidden;
   /* text-align: justify; */
}

#yui-main .yui-u.second {
   width: 360px;
   margin-top: 27px;
   padding-right: 44px;
}

#yui-ft {
   margin: 45px 44px 0 42px;
   padding-top: 3px;
   border-top: 1px dashed #5f380c;
}

#platform-title {
   margin: 5px 0 4px 0;
}

/* Header */

#header {
   width: 938px;
   height: 120px;
   background-color: #508df8;
   position: relative;
}

#header #title {
   width: 402px;
   height: 27px;
   margin-left: 140px;
   padding: 0 18px;
   background-color: #ffffff;
   position: absolute;
   bottom: 0;
}

#header #title h1 {
   position: absolute;
   width: 402px;
   bottom: -0.3em;
   overflow: hidden;
   white-space: nowrap;
}

#header #slogan {
   padding: 15px 18px 0 3px;
   background-color: white;
   position: absolute;
   right: 0;
   bottom: -0.3em;
   font: 0.85em sans-serif;
}

/* Navigation */

#navigation {
   width: 155px;
   margin: 27px 0 0 27px;
   overflow: hidden;
}

#navigation div.hrule {
   margin: 3px 0;
   padding: 0;
   border: none;
   border-top: 1px dashed #5f380c;
}

#navigation li {
   padding-left: 15px;
   background: #ffffff;
}

#navigation li a {
   color: #ab5e04;
}

#navigation li.big {
   font: 1.2em sans-serif;
   line-height: 1.2em;
}

#navigation li.current {
   background: #ffffff url(/static/gui.png) 
         no-repeat -30px -105px;
}

#navigation li.current a {
   color: #5f380c;
}

#navigation li div.hrule {
   display: none;
}

#navigation li.offset div.hrule {
   display: block;
}

#link-list {
   width: 140px;
   margin: 10px 0 0 42px;
   overflow: hidden;
}

#link-list li {
   padding-bottom: 0.4em;
}

/* Footer */

#footer {
   position: relative;
   left: 158px;
   width: 402px;
   margin: -2px 0 35px 0;
}

#footer li {
   margin: 0 20px;
   float: left;
}

#footer li.first {
   margin: 0 80px 0 0;
}

#footer li.last {
   margin: 0 0 0 20px;
   position: absolute;
   right: 0;
}

#footer a {
   color: #5f380c;
}

/* Inline Editor */

div.editable:first-child .paragraph:first-child {
   margin-top: 0;
}

div.editable textarea#source {
   width: 100%;
   height: 10em;
}

div.editable {
   margin-bottom: 5px;
}

div.editable .controls .status {
   padding: 1px 2px;;
   color: #ffffff;
   background-color: #5f380c;
}

/* Rhenon Editor */

form#editor textarea#source {
   width: 400px;
   height: 30em;
   margin-bottom: 10px;
   padding: 0;
   border: 1px solid gray;
}

form#editor #preview {
   margin-top: 1px;
   margin-bottom: 11px;
   border: 1px solid gray;
   overflow: auto;
}

form#editor #submit {
   font-weight: bold;
}

form#editor #preview {
   width: 100px;
   vertical-align: top;
}

/* Property Editor */

form .magic {
   display: none;
}

form.propertyEditor {
   margin: 0.8em 0;
}

form.propertyEditor dt {
   /*color: #cccccc;*/
   margin-top: 0.8em;
}

form.propertyEditor dd {
   margin-bottom: 1em;
}

form.propertyEditor dd input {
   width: 100%;
   margin: 0.2em 0;
   padding-top: 0.1em;
   border: 0;
   border-bottom: 1px dotted #5f380c;
   font: normal 1em monospace;
}

form.propertyEditor dd input[type=radio], 
form.propertyEditor dd input[type=checkbox] {
   width: auto;
}

form.propertyEditor .enabled {
   border-bottom: 1px solid black;
}

/* Grid */

ul.grid-header {
   margin-bottom: 2px;
}

ul.grid-header .title {
   font: 1.2em sans-serif;
}

ul.grid-header li {
   display: inline;
}

div.grid {
   width: 360px;
   margin-bottom: 1em;
   text-align: left;
}

div.grid, div.grid th, div.grid td {
   border: none;
   border-collapse: collapse;
   border-spacing: 0;
   empty-cells: show;
}

div.grid table a {
   color: #5f380c;
}

div.grid tr.selected {
   color: #ffffff;
   background-color: #508df8;
}

div.grid tr.selected a {
   color: #ffffff;
}

div.grid th, div.grid td {
   padding: 0 2px 0 1px;
   cursor: default;
   font: 0.85em sans-serif;
}

div.grid td {
   line-height: 1.5em;
}

div.grid th {
   padding: 1px;
   border-top: 1px solid #5f380c;
   border-bottom: 1px solid #5f380c;
}

div.grid th#index, div.grid td.index {
   text-align: right;
}

div.grid td div {
   width: inherit;
   overflow: hidden;
   white-space: nowrap;
}