*
   Cyan aka Randy Gregory CSS Document
   Copyright © Randy Gregory
*/

/* =Undo HTML
------------------------------------------------------------------------*/

/* undohtml.css */
/* (CC) 2004 Tantek Celik. Some Rights Reserved.             */
/*   http://creativecommons.org/licenses/by/2.0                   */
/* This style sheet is licensed under a Creative Commons License. */

/* Purpose: undo some of the default styling of common (X)HTML browsers */


/* link underlines tend to make hypertext less readable,
   because underlines obscure the shapes of the lower halves of words */
:link,:visited { text-decoration:none; }

/* remove the dotted link border that Firefox put around the edge when clicked */
:link,:visited { outline:none; }

/* no list-markers by default, since lists are used more often for semantics */
ul,ol { list-style:none; }

/* avoid browser default inconsistent heading font-sizes */
/* and pre/code too */
h1,h2,h3,h4,h5,h6,pre,code { font-size:1em; }

/* remove the inconsistent (among browsers) default ul,ol padding or margin  */
/* the default spacing on headings does not match nor align with
   normal interline spacing at all, so let's get rid of it. */
/* zero out the spacing around pre, form, body, html, p, blockquote as well */
/* form elements are oddly inconsistent, and not quite CSS emulatable. */
/*  nonetheless strip their margin and padding as well */
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input
{ margin:0; padding:0; }

/* whoever thought blue linked image borders were a good idea? */
a img,:link img,:visited img { border:none; }

/* de-italicize address */
address { font-style:normal; }

/* more varnish stripping as necessary... */


/* Imported Styles
---------------------------------------------------------------------- */

/********To make scrool-bar space in Firefox & Opera
*************************************************************/

html { height: 100%; margin-bottom: 1px; }

/* IE 6 hack to make entire button clickable */
* html #nav a { width: 1px; }


/* =Basic HTML
----------------------------------------------------------------------*/

body {
   margin: 0;
   font: 1em "Lucida Grande", Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
}

/* =Wrapper
----------------------------------------------------------------------*/

#wrapper {
   background: #fff;
   border: solid 2px #0ff;
}

/* uncomment or comment-out to use a fixed width ... or not
*************************************************************/

#wrapper {
   width: 1000px;
}


/* =Header
----------------------------------------------------------------------*/

#header
{
   background: url(../img/cyan_header.png) no-repeat left;
   width:100%;
   height: 200px
}

#header h3 {
   visibility:hidden;
   letter-spacing:0;
   font-size:2em;
   line-height:2em;
}

/*
#header
{
   padding: 5px;
   margin-bottom: ;
   background-color: #000
}
*/

#header {
   position: relative;
}

/* =About
*********************************************************/

.about {
   text-align:left;
   font: 1.25em "Lucida Grande", Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
   margin: 110px 0 0 700px;
   padding: 0;
}

.about a:link
{
   background:transparent;
   color:#000;
}

.about a:visited
{
   background:transparent;
   color:#999;
}

.about a:hover
{
   background:transparent;
   color:#000;
   text-decoration: overline
}

.about a:active
{
   background:transparent;
   color:#00ffff;
}

/* =Navigation Bar
----------------------------------------------------------------------*/

#nav ul {
   margin: 0;
   padding: 0;
   list-style: none;
   background: url(../img/bg_nav.png) repeat-x left top;
   float: left;
   border-bottom: 1px solid #000;
   width: 100%;
}

#nav li {
   float: left;
   padding: 0;
   margin: 0;
}

#nav li a, #nav li a:link {
   color: #000;
   text-decoration: none;
   padding: .5em 1em;
   border-right: 1px solid #000;
   display: block;
   font: bold 1em "Lucida Grande", Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
}

#nav li a:hover {
   background: url(../img/bg_nav_h.png);
}

/* =Container
----------------------------------------------------------------------*/

#container {
   position: relative;
   clear: both;
   width: 100%;
}


/* =Left Sidebar
----------------------------------------------------------------------*/

#left {
   position: absolute;
   top: 5px;
   left: 5px;
   width: 50px;
   height:500px;
   background: #fff url(../img/marks.gif) no-repeat;
}

#left p {
   visibility:hidden;
   letter-spacing:0;
}

/* =Content
----------------------------------------------------------------------*/

#content {
   margin-left: 70px;
   margin-right: 260px;
   padding: 0 15px 15px 20px;
   border-left: 2px solid #0ff;
   border-right: 2px solid #0ff;
   background: #fff;
}

#content h1 {
   color: #f0f;
   font: bold 2em Georgia, "Times New Roman", Times, serif;
   padding-top: 15px;
   margin-bottom: 10px;
}

#content h2 {
   color: #f0f;
   font: normal 1.5em "Lucida Grande", Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
   margin-bottom: 5px;
}

#content h3 {
   color: #f0f;
   font: normal 1.3em "Lucida Grande", Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
   margin-bottom: 5px;
}

#content h4 {
   color: #f0f;
   font: normal 1em "Lucida Grande", Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
   margin-bottom: 5px;
}

#content h5 {
   color: #f0f;
   font: normal .75em "Lucida Grande", Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
   margin-bottom: 5px;
}

#content h6 {
   color: #f0f;
   font: normal .6em "Lucida Grande", Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
   margin-bottom: 5px;
}

#content p {
   line-height: 1.4em;
   margin-bottom: 10px;
}

#content ol {
   line-height: .9em;
   list-style-type: decimal;
   margin-left:50px;
}

#content .figure {
   float: right;
   width: 200px;
   margin-bottom: 2px;
   margin-left: 10px;
   position: relative;
}

#content .figure p {
   position: absolute;
   left: 10px;
   bottom: 10px;
   width: 168px;
   background-color: #FFF;
   border: 1px dashed #666666;
   font-size: 1.1em;
   font-weight: bold;
   text-align: center;
   padding: 5px;
   margin: 0;
}

#content .figure img {
   display: block;
}

#content a:link
{
   background:transparent;
   color:#f0f;
}

#content a:visited
{
   background:transparent;
   color:#999;
}

#content a:hover
{
   background:transparent;
   color:#0ff;
   text-decoration: overline
}

#content a:active
{
   background:transparent;
   color:#f0f;
}

/* =Navigation aka Sidebar - Right-side
----------------------------------------------------------------------*/

#right {
   position: absolute;
   top: 15px;
   right: 5px;
   width: 250px;
   background-color: #fff;
}

#right h1 {
float: left;
   font-size: 1.4em;
   color: #000;
   padding: 7px 8px 0 8px;
   margin-bottom: 5px;
   /*border-top: 2px solid #0ff;*/
}

#right h2 {
float: left;
   font-size: 1.2em;
   color: #000;
   padding: 13px;
   margin: 10px;
}

#right h3 {
float: left;
   font-size: 1.1em;
   color: #000;
   margin: 0;
   padding: 0 15px 0 0;
}

#right li {
   float: left;
   display: block;
   width: 250px;
   font: bold 1em "Lucida Grande", Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
   text-decoration: none;
   padding: 10px 0 0 0;
   margin: 0 10px;
}
/*
#right li a, #right li a:link {
   color: #000;
   text-decoration: none;
   padding: 10px 10px;
   display: block;
   width: 250px;
   font: bold 1em "Lucida Grande", Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
}
*/
#right a:link
{
   background:transparent;
   color:#f0f;
}

#right a:visited
{
   background:transparent;
   color:#999;
}

#right a:hover
{
   background:transparent;
   color:#0ff;
   text-decoration: overline;
}

#right a:active
{
   background:transparent;
   color:#f0f;
}

/* =Footer
----------------------------------------------------------------------*/

#footer {
   text-align:left;
   clear:both;
   font: 0.7em verdana, arial, helvetica, sans-serif;
   height: 24px;
   line-height: 24px;
   margin: 0;
   padding: 0 0 0 20px;
}

#footer {
   padding: 5px;
   border-top: 2px solid #0ff;
   background-color: #f0f;
   font-weight: bold;
   color: #fff;
}

#footer a:link {
   background:transparent;
   color:#0ff;
}

#footer a:visited {
   background:transparent;
   color:#0ff;
}

#footer a:hover {
   background:transparent;
   color:#0ff;
   text-decoration: underline
}

#footer a:active {
   background:transparent;
   color:#0ff;
}

/* =Misc Classes + IDs
----------------------------------------------------------------------*/

.last {
   margin-bottom: 0;
}

.clearing {
   height: 0;
   clear: both;
}

/* =Images
----------------------------------------------------------------------*/
img.float-right { margin: 0 0 10px 15px;}
img.float-left { margin: 2px 15px 5px 0px;}
img.top { margin: 5px 0 10px; }


/* =Alignment Classes
-------------------------------------------------------------------*/
.float-left  { float: left; }
.float-right { float: right; }
.align-left  { text-align: left; }
.align-right { text-align: right; }

/* =Extra Stuff
----------------------------------------------------------------------*/