/* CSS Document */
html, body, ul, li, p, h2 {
margin: 0;
padding: 0;
border: 0;
}
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
background-color: #000000;
}
/* set width, margins and text alignment on the page's main container */
#pageWrapper {
width: 900px;
margin: 6px auto;
text-align: left;
background-color: #ccbc9d;
}
/* set the attributes for the header */
#header {
height: 66px;
background: #000000 url(../uigfx/ray_header.gif) no-repeat;
}
#gfxFooter {
height: 255px;
background: #000000 url(../uigfx/ray_footer.gif) no-repeat;
}
/* set the size, image, margins, padding and positioning for the navigation bar.
set the position to relative so that the navbar elements can be positioned
absolutely in relation to the navbar's relative position on the page. */
#navlistContainer {
background-color: #703D27;
border-bottom: 4px solid #703D27;
}
#navlist {
height: 23px;
width: 490px;
background: #703D27 url(../uigfx/navbar.gif);
overflow: hidden;
margin: 0;
padding: 0;
position: relative;
}
/* set margins, padding, positioning, etc to all navbar elements */
#navlist li {margin: 0; padding: 0; list-style: none; position: absolute; top: 0;}
/* set size and display mode for navbar elements and links */
#navlist li, #navlist a {height: 23px; top: 0px; display: block;}

/* set position and width for each individual element */
#home {left: 0px; width: 123px;}
#unteaching {left: 124px; width: 103px;}
#trickster {left: 227px; width: 109px;}
#writing {left: 336px; width: 83px;}
#about {left: 419px; width: 72px;}

/* position the graphic for each other element in the hover state */
#home a:hover, #home a:active {background: transparent url(../uigfx/navbar.gif) -0px -27px no-repeat;}
#unteaching a:hover, #unteaching a:active {background: transparent url(../uigfx/navbar.gif) -124px -27px no-repeat;}
#trickster a:hover, #trickster a:active {background: transparent url(../uigfx/navbar.gif) -227px -27px no-repeat;}
#writing a:hover, #writing a:active {background: transparent url(../uigfx/navbar.gif) -336px -27px no-repeat;}
#about a:hover, #about a:active {background: transparent url(../uigfx/navbar.gif) -419px -27px no-repeat;}

/* set the text paragraph attributes */
p {
color: #703D27;
margin-bottom: 12px;
font-size: 14px;
}
h1 {
font-size: 14px;
font-weight: bold;
color: #703D27;
}
h2 {
font-size: 16px;
font-weight: bold;
color: #703D27;
margin-bottom: 20px;
text-align: center;
}
/* set the size and attributes of the container for the page title and/or title graphic */
.pagetitle {margin: 20px 0 0 80px}
/* classes for text alignment */
.indented {padding-left: 30px}
.justified {text-align: justify}
.centered {text-align: center}
.left {text-align: left}
/* attributes for the wrapper that contains the content and the footer - for a border, etc. */
#bodyWrapper {
border-left: 6px solid #703D27;
border-right: 6px solid #703D27;
border-top: 4px solid #703D27;
margin: 0;
padding: 0;
}
/* set the common attributes for the page content */
#content {
margin: 20px 20px 50px 20px;
}
#content ul {
list-style-type: none;
padding: 10px;
}
#content ul li {
list-style-type: none;
}
a {
color: #e37830;
text-decoration: none;
}
a:hover, a:active {
color: #eeaa11;
text-decoration: none;
}
#rightColumnBorder {
padding-left: 20px;
border-left: #703D27 1px solid;
}
/* float classes for img tags */
.floatRight {
float: right;
margin: 10px 0 10px 10px;
}
.floatLeft {
float: left;
margin: 10px 10px 10px 0;
}
/* set the footer attributes */
#footer {
background-color: #703D27;
clear: both;
height: 1em;
padding: 10px;
}
#footer p {
color: #ccbc9d;
text-align: left;
font-size: 10px;
}