body {
margin: 0 auto;  
padding: 0;
background: #ccc;
color: #333;
}

h1, h2, h3 {
font-family: lucida grande, verdana, arial, helvetica, sans-serif;
letter-spacing: 0.09em;
}

h4 {
font-family: lucida grande, verdana, arial, helvetica, sans-serif;
margin-bottom: 4px;
}

p {
font-family: lucida grande, verdana, arial, helvetica, sans-serif;
}

.center {
text-align: center;
}

blockquote {
font-family: trebuchet ms, verdana, arial, helvetica, sans-serif;
}

ul {
list-style: square;
margin-top: 3px;
margin-bottom: 3px;
margin-left: 1em;
padding-left: 1em;
}

li {
font-size: 100%;
font-family: lucida grande, verdana, arial, helvetica, sans-serif;
}

img {
margin: 0;
padding: 0;
border: 0;
}

a:link { background-color: transparent; text-decoration: none; color: #0033CC; }
a:hover { background-color: #0033CC; text-decoration: none; color: #fff; }
a:visited { background-color: transparent; text-decoration: none; color: #0033CC; }

#wrapper {
margin: 0px auto;
padding-bottom: 10px;
width: 970px;
border-top: 7px solid #FFCC00;
border-right: 1px solid #aaa;
border-bottom: 20px solid #FFCC00;
border-left: 1px solid #aaa;
background: #eee;
color: #333;
}

#header {
margin-bottom: 10px;
padding: 5px 10px 5px 20px;
border-bottom: 1px solid #ccc;
background: #fff;
color: #003300;
font-variant: small-caps;
}

#blogtitle {
float: left;
margin: 0;
padding: 0;
width: 550px;
text-align: left;
}

#blogtitle h1 {
margin: 0;
padding: 0;
font-size: 160%;
font-family: lucida grande, verdana, arial, helvetica, sans-serif;
letter-spacing: 0.1em;
text-align: left;
}

#nav {
float: left;
margin: 0;
padding: 0;
width: 350px;
text-align: right;
background: transparent;
color: #333;
font-family: lucida grande, verdana, arial, helvetica, sans-serif;
font-size: 70%;
letter-spacing: 0.09em;
}

#content {
float: left;
margin-bottom: 10px;
padding: 0 10px;
}

#blog {
float: left;
margin-right: 5px;
padding: 5px;
border: 1px solid #ccc;
width: 680px;
background: #fff;
color: #333;
font-size: 70%;
text-align: left;
}

#sidebar {
float: left;
margin-left: 5px;
padding: 10px;
border: 1px solid #ccc;
width: 225px;
background: #fff;
color: #333;
text-align: left;
font-size: 70%;
}

#footer {
margin: 0;
padding: 5px 10px;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
background: #fff;
color: #333;
font-family: trebuchet ms, verdana, arial, helvetica, sans-serif;
font-size: 70%;
letter-spacing: 0.09em;
}

.date {
font-size: 100%;
background: transparent;
color: #000;
}

.title {
font-size: 110%;
font-weight: bold;
background: transparent;
color: #0033CC;
}

.title2 {
font-size: 100%;
font-weight: normal;
background: transparent;
color: #336600;
}

.righttitle {
text-align: right;
font-size: 120%;
font-style: italic
font-weight: bold;
background: transparent;
color: #0033CC;
}

.lefttitle {
text-align: left;
font-size: 120%;
font-style: italic
font-weight: bold;
background: transparent;
color: #0033CC;
}

.blog2 {
font-size: 90%;
font-weight: normal;
background: transparent;
color: #336600;
}

.posted {
margin-bottom: 30px;
font: 10px lucida grande, verdana, arial, helvetica, sans-serif;
background: transparent;
color: #666;
} 

.sidetitle {
margin: 10px 0;
font-size: 115%;
letter-spacing: 0.09em;
font-weight: bold;
background: transparent;
color: #666600;
border-bottom: 1px dotted #ccc;
}

.spacer {
clear: both;
}

.paginate {
 font-family:		Verdana, Geneva, Tahoma, Trebuchet MS, Arial, Sans-serif;
 font-size:			12px;
 font-weight: 		normal;
 letter-spacing:	.1em;
 padding:			10px 6px 10px 4px;
 margin:			0;
 background-color:	transparent;  
}

.pagecount {
 font-family:		Verdana, Geneva, Tahoma, Trebuchet MS, Arial, Sans-serif;
 font-size:			10px;
 color:				#666;
 font-weight:		normal;
 background-color: transparent;  
}


 .submit {
background-color:  #fff;
font-family:       Arial, Verdana, Sans-serif;
font-size:         10px;
font-weight:       normal;
letter-spacing:    .1em;
padding:           1px 3px 1px 3px;
margin-top:        6px;
margin-bottom:     4px;
text-transform:    uppercase;
color:             #000;
} 

/*  
	Small size links - used for the individual letter links in the "view all members" page 
*/
.smLinks, .smLinks a:link, .smLinks a:active, .smLinks a:visited, .smLinks a:hover { 
 color:       #ffffff;
 font-family: verdana,trebuchet,sans-serif;
 font-size:   10px; 
 font-weight: bold;
} 
.smLinks a:link    { color:  #333399; text-decoration: underline; }
.smLinks a:visited { color:  #333399; text-decoration: underline; }
.smLinks a:active  { color:  #333333; text-decoration: underline; }
.smLinks a:hover   { color:  #000000; text-decoration: none; }


/*  
    White colored header text used at the top of all forms. 
*/
.whiteText {
 color:       #ffffff;
 font-family: verdana,trebuchet,arial,sans-serif;
 font-size:   10px; 
 font-weight: bold;
}


/*  
    Red text used for "required field" markers in forms.
*/
.red {
 font-family: verdana,trebuchet,sans-serif;
 font-size:   11px;
 color:       #ff0000;
 font-weight: bold;
}

/*
	Input fields
*/
input {
 font : bold 11px/12px verdana,trebuchet,sans-serif;
 border : 1px solid #999999;
 color : black;
 background-color : #eeeeee;
 margin-top: 2px;
 margin-bottom: 2px;
}

/*
	Input field used in "email member" form.
*/
input.large {
 width: 200px;
}

input:focus {
 background-color : #ffffff;
}


/*
	Textarea at for "bio" and email "body" fields.
*/
textarea {
 border: 1px solid #999999;
 margin-bottom: 10px;
 color: black;
 background-color: #eeeeee;
 font: 11px/16px verdana,trebuchet,sans-serif;
}

/*
	When you put your cursor in an input field it changes to this color.
*/
textarea:focus {
 background-color : #ffffff;
}