body   {
background-image: url(my_css/css8_bg.gif); 
background-repeat: repeat-x;
background-attachment: fixed;
}

/*

The site's main mojo.
This is the big box everything goes in.

*/

#container    {
width: 800px;
background: #ffffff;
border: 1px solid black;
margin: 20px auto auto auto;
}

/*

This is the blue box at the top of the page that
you see the words "scratchpad" in.

*/

#header   {
height:98px;
background:#3399ff url(my_css/atwill-banner.jpg) repeat-x;	
}

#header_image {
	margin:0 0 0 0;
	padding:0 0 0 0;
}

/*

I put the words "scratchpad" in a <p> tag so I
could give them styles without messing with other
things I (or you) may decide to put up there.

*/

#header_title  {
font-family: Trebuchet MS, Verdana, helvetica, arial, sans-serif;
font-size: 2.6em;
font-weight: bolder;
color: #fff;
text-align: left;
padding-left: 20px;
margin-top: 0px;
padding-top: 0.5em;
}

/*

This is the box that the headlines, their sub-headlines
and the paragraphs go in.

*/ 

#containerbody   {
width: 780px;
line-height: 1.1em;
}

/*

The paragraph text.

*/


#content  {
padding: 20px 50px 20px 50px;
text-align: justify;
font-size: 90%;
font-family:Arial;
}

/*

These are the big and small headlines.

*/


#content h1  {
font-family: helvetica, Verdana, sans-serif;
font-size: 180%;
}

#content h2  {
font-family:Trebuchet MS, helvetica, helvetica, arial, sans-serif;
font-size:125%;
color:#3879ff;
}

/*

This makes links change color and become
underlined when moused over.

*/


#content a  {
color:#3879ff;
text-decoration:none;
}

#content a:hover  {
color:#33cc33;
text-decoration:underline;
}

/*

This is stuff for the fine print
at the bottom of the page.

*/

#footer  {
clear: both;
width:700px;
margin: 30px auto 20px auto;
padding-bottom: 10px;
text-align:center;
font-family:Trebuchet MS, Verdana, helvetica, arial, sans-serif;
color:#383838;
padding-top:5px;
text-decoration:none;
font-size:70%;
border-top:1px dotted #383838;
background: #ffffff;
}

/*

I had this in place so that my "Made on a Mac"
button would be centered next to the footer
text, but OSWD doesn't allow buttons.  I left
this code here in case you decide to add buttons
of your own.

*/

#footer img  {
margin: 0px 0px 0px 0px;
}

#footer a  {
text-decoration:none;
color:#383838;
}

#footer a:hover  {
text-decoration:underline;
}

/*

Stuff for the top navbar

This makes the unordered list appear like a
menu bar, and not as a real list.

*/

#navcontainer ul
{
list-style: none;
margin: 10px auto auto 40px;
padding-bottom: 10px;
}

#navcontainer li
{
font-family: Trebuchet MS, Verdana, helvetica, arial, sans-serif;
float: left;
padding-top: 0px;
text-align: center;
}

/*

If you don't like the "tab effect" I have on the
navbar buttons, then remove all the "border" atribs.
from the all the nav elements bellow.

*/

#navcontainer li a
{
font-family: Trebuchet MS, Verdana, helvetica, arial, sans-serif;
font-size: 100%;
height: 25px;
line-height: 1.5em;
border-bottom: 1px solid #3879ff;
border-left: 2px solid #fff;
border-right: 2px solid #fff;
border-top: 2px solid #fff;
width: 7em;
display: block;
color: #383838;
text-decoration: none;
text-align: center;
}

#navcontainer li a:hover
{
color: #3879ff;
border-top: 2px groove #000;
border-left: 2px groove #000;
border-right: 2px groove #000;
}

#navcontainer li a:active
{
background:#395EA8;
color:#fff;
}


/* 

This makes the navbar work correctly on old
versions of IE on the MacOS 9.  I only put this
here because there are people still using OS9
that can't get FireFox, Camino, or any other
modern browser.

 */
#navcontainer li a
{
float: none
}

/* Contact us stuff */

	div.row {
	  clear: both;
	  padding-top: 5px;
	  width:650px;
	}

	div.row span.label {
	  float: left;
	  width:250px;
	  text-align: left;
	}
			
	div.row span.formw {
	  float: left;
	  width:400px;
	  text-align: left;
	}

#subnavcontainer
{
padding: 10px 0 0 20px;
float: left;
width: 150px;
}		
	
#subnavcontainer p
{
font-family: Trebuchet MS, Verdana, helvetica, arial, sans-serif;
padding-top: 10px;
text-align: center;
}	

#subnavcontainer p a
{
font-family: Trebuchet MS, Verdana, helvetica, arial, sans-serif;
font-size: 100%;
height: 25px;
line-height: 1.5em;
border-bottom: 1px solid #ff7938;
border-left: 2px solid #fff;
border-right: 2px solid #fff;
border-top: 2px solid #fff;
width: 7em;
display: block;
color: #383838;
text-decoration: none;
text-align: center;
}

#subnavcontainer p a:hover
{
color: #3879ff;
border-top: 2px groove #000;
border-left: 2px groove #000;
border-right: 2px groove #000;
}

#subnavcontainer p a:active
{
background:#C85E39;
color:#fff;
}


/* 

This makes the navbar work correctly on old
versions of IE on the MacOS 9.  I only put this
here because there are people still using OS9
that can't get FireFox, Camino, or any other
modern browser.

 */
#subnavcontainer p a
{
float: none
}

#contentright  {
float: right;
width: 570px;
padding: 15px 20px 35px 20px;
text-align: justify;
font-size: 90%;
font-family:Arial;
}

/*

These are the big and small headlines.

*/


#contentright h1  {
font-family: helvetica, Verdana, sans-serif;
font-size: 180%;
}

#contentright h2  {
font-family:Trebuchet MS, helvetica, helvetica, arial, sans-serif;
font-size:125%;
color:#3879ff;
}

/*

This makes links change color and become
underlined when moused over.

*/


#contentright a  {
color:#3879ff;
text-decoration:none;
}

#contentright a:hover  {
color:#33cc33;
text-decoration:underline;
}