/*******************************************************************
 * Reset pre-formatted styles to null values.
 * This will help avoid browser differences and
 * give us complete control over the final appearance.
 *******************************************************************/

body, h1, h2, h3, h4, h5, h6, p, ol, ul, form, blockquote
{
 padding: 0;
 margin: 0;
}

h1, h2, h3, h4, h5, h6, pre, code
{
 font-size: 100%;
}

a
{
 text-decoration: none;
}

img
{
 border: none;
}

/*******************************************************************
 * Define the basic appearance of the body, major tags, etc.
 *******************************************************************/

body
{
 background-color: white;
 color: black;
 font: normal 100% Georgia, "Times New Roman", Times, serif;
 height: 100%;
}

h1, h2, h3, h4, h5, h6
{
 color: black;
 font: bold 100% Arial, Helvetica, sans-serif;
 font: bold 100% Verdana, Geneva, sans-serif;
 margin: 1em 0 0.5em 0;
 page-break-after: avoid;
}

h1
{
 font-size: 200%;
}
h2
{
 font-size: 150%;
}
h3
{
 font-size: 120%;
}

p
{
 margin: 0 0 0.5em 0;
}

a:link, a:visited
{
 text-decoration: none;
 color: #000099;
}
a:hover
{
 text-decoration: underline;
 color: red;
}

/*******************************************************************
 * Define the major structural elements - sidebars, etc.
 *******************************************************************/

#sidebar
{
 position: absolute;
 left: 0;
 top: 0;
 background-color: black;
 color: white;
 width: 180px;
 height: 100%; /* Make it a full column. Requires absolute position. */
}

#logo
{
 padding: 9px; /* Related to sidebar width and image size. */
}

#header
{
}

#footer
{
 clear: both;
 margin: 10em 0 1em 0;
 padding: 0.5em 0;
 border-top: 1pt solid black;
 font-size: 80%;
 font-style: italic;
 letter-spacing: 1px;
 word-spacing: 2px;
}

#main
{
 margin-left: 220px; /* Related to sidebar width +40px */
 margin-right: 40px;
 margin-top: 1em;
 margin-bottom: 1em;
}

.menu
{
 padding: 20px;
 font: bold 180% Arial, Helvetica, sans-serif;
 font: bold 180% Verdana, Geneva, sans-serif;
}
.menu li
{
 margin: 0.2em 0;
 list-style-type: none;
}
.menu a
{
 color: white;
 text-decoration: none;
}
.menu a:hover
{
 color: red;
}

.imglink
{
}
.imglink img
{
 border: 2px solid transparent;
}
.imglink img:hover
{
 border: 2px solid red;
}

.dialog
{
 color: black;
 background-color: #EEEEFF;
 border: outset #EEEEFF;
 padding: 1em 2em;
 margin: 20px 50px;
}

.dialog h1, .dialog h2, .dialog h3
{
 border: none;
 background-color: transparent;
 margin: 0 0 .6em 0;
 padding: 0;
}

.dialog p
{
 margin: 0.6em 0;
}

.dialog fieldset
{
 border: none;
 padding: 0;
 margin: 0;
}

.dialog .field
{
 margin: .5em 0;
}

.dialog .label
{
 float: left;
 width: 5em;
 font: 90% Arial, Helvetica, sans-serif;
 font: 90% Verdana, Geneva, sans-serif;
 margin-right: 1em;
 clear: left;
}

.dialog .radio
{
 font: 90% Arial, Helvetica, sans-serif;
 font: bold 90% Verdana, Geneva, sans-serif;
}

/*******************************************************************
 * Define styles for specific pages.
 *******************************************************************/

#frontpage #content
{
 font: normal 120% Arial, Helvetica, sans-serif;
 font: normal 120% Verdana, Geneva, sans-serif;
 line-height: 1.3;
 letter-spacing: 0.05em;
 word-spacing: 0.1em;
}
#frontpage h1
{
 font-size: 240%;
}
#frontpage p
{
 margin: 1em 0;
}
