/*

This is the style sheet for scratchpad.
It's free to use, just like the site template.
Mod it, copy it, build on it.
You're the man now, dog.

*/

body   {
background: url(bg.png);
background-repeat: repeat-x;
background-attachment: fixed;
}

/*

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

*/

#bigbox    {
width: 800px;
background: #fff;
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.

*/

#head   {
height:100px;
background:url(topgrad.png);
}

/*

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.

*/

#head  p  {
font-family: Trebuchet MS, Verdana, helvetica, arial, sans-serif;
font-size: 150%;
color: #fff;
text-align: left;
margin-left: 20px;
margin-top: 0px;
padding-top: 1em;
}

/*

The second word is bigger than the first because
of this code.  Look at the XHTML source and you'll
understand.

*/

#head strong  {
font-size:150%;
}

/*

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

*/ 

#contentbox   {
width: 700px;
padding: 35px 50px 35px 50px;
line-height: 1.1em;
}

/*

The paragraph text.

*/


#contentbox p  {
text-align: justify;
font-size: 90%;
font-family:Verdana, times new roman, helvetica, arial, sans-serif;
}

/*

These are the big and small headlines.

*/


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

#contentbox 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.

*/


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

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

/*

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

*/

#fineprint  {
width:400px;
margin: 20px auto 40px auto;
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;
}

/*

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.

*/

#fineprint img  {
margin: 0px 0px -10px 0px;
}

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

#fineprint 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.

*/

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

#nav li
{
font-family: Trebuchet MS, Verdana, helvetica, arial, sans-serif;
float: left;
padding-top: 10px;
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.

*/

#nav 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: 1px solid #fff;
border-right: 1px solid #fff;
border-top: 1px solid #fff;
width: 5em;
display: block;
color: #383838;
text-decoration: none;
text-align: center;
}

#nav li a:hover
{
color: #3879ff;
border-top: 1px solid #000;
border-left: 1px solid #000;
border-right: 1px solid #000;
}

#nav 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.

 */
#nav li a
{
float: none
}