I'm trying to make the main test area white background with black text think i have got it now but if someone could check my css code i'd be grateful.

I've also made changes to all points above many thanks for your comments, please keep them coming.



*
{
margin: 0px;
padding: 0px;
}

body {
background: #187AD5 url(images/back_all.gif) repeat-x;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
color: #A4E4F5;
}

input, textarea {
background: #A4E4F5;
border: 1px solid #ffffff;
font: bold 13px Arial, Helvetica, sans-serif;
color: #0F5B96;
}

h1, h2, h3, p, ol, ul {
margin-top: 0;
}

h1, h2, h3 {
font-family: Arial, Helvetica, sans-serif;
}

h1, h2 {
text-transform: normal;
font-weight: normal;
}

h1 {
font-size: 24pt;
}

h2 {
font-size: 1.8em;
}

p, ol, ul {
margin-bottom: 1.5em;
line-height: 150%;
}

a {
color: #1D74A6;
}

a:hover {
text-decoration: none;
color: #1D74A6;
}



hr {
display: none;
}

#main
{
width: 1036px;
margin: 0 auto;
}

/* Header */

#header {
height: 320px;
width: 1036px;
}

#logo {
width: 1036px;
height: 204px;
background: url(images/header.jpg) repeat-x;
}

#logo h1, #logo p {
margin: 0;
line-height: normal;
}

#logo h1 {
padding: 47px 0 0 20px;
font-size: 36px;
color: #000000;
}
#logo h2 {
padding: 10px 0 0 20px;
font-size: 10px;
text-transform: uppercase;
color: #000000;
}

#logo a {
text-decoration: none;
color: #ffffff;
}

#menu {
height: 84px;
padding-top: 30px;
}

#menu ul {
margin: 0;
list-style: none;
}

#menu li {
display: inline;
}

#menu a {
float: left;
width: 136px;
height: 32px;
margin: 0 0 0 5px;
padding: 14px 0 0 0;
text-decoration: none;
text-align: center;
letter-spacing: -1px;
font-size: 1.1em;
font-weight: bold;
color: #187AD5;
background: url(images/button.gif) no-repeat;
}

#menu a:hover {
height: 37px;
margin-top: -4px;
padding-top: 18px;
background: url(images/button_r.gif) repeat-x;
}

/* Page */

#page {
width: 1036px;
background: #ffffff url(images/page_back.gif) repeat-y;
margin: 0 auto;
margin-top: 12px;
}

/* Content */

#content {
float: left;
width: 532px;
margin-left: 10px;
}

#content .post ul, #content .post ol
{
margin-left: 30px;
}

.post {
margin-bottom: 15px;
padding: 10px;
color: #000000;
}

.post a {
color: #000000;
}

.post a:hover {
color: #000000;
}


/* Sidebars */

.sidebar {
float: left;
width: 221px;
margin-top: 10px;
color: #0D699B;

}

.sidebar ul {
margin: 0;
padding: 0;
list-style: none;
line-height: normal;
}


.sidebar li {
padding: 6px 0 6px 20px;
}

.sidebar a {
text-decoration: none;
color: #;
font-size: 11px;
}
.sidebar a:hover {
color: #0D699B;
text-decoration: underline;
}

.sidebar h2 {
padding-top: 10px;
color: #000000;
background: url(images/title.gif) no-repeat;
height: 33px;
padding-left: 20px;
font-size: 16px;
font-weight: bold;
}

/* Left Sidebar */

#leftbar {
margin-left: 15px;
}

/* Right Sidebar */

#rightbar {
margin-left: 20px;
}

#leftbar .back, #rightbar .back
{
background: url(images/back.gif) repeat-y;
padding: 10px;
}

#leftbar .bottom, #rightbar .bottom
{
background: url(images/bottom.gif) no-repeat;
height: 6px;
width: 221px;
margin-bottom: 10px;
}


/* Calendar */

#calendar table {
width: 100%;
text-align: center;
}

#calendar thead {

}

#calendar tbody td {
border: 1px solid #F1F1F1;
}

#calendar #prev {
text-align: left;
}

#calendar #next {
text-align: right;
}

#calendar tfoot a {
text-decoration: none;
font-weight: bold;
}

#calendar #now {
background: #696969;
border: 1px solid #ff0000;
font-weight: bold;
color: #ffffff
}


/* Footer */

#footer {
clear: both;
padding-top: 20px;
height: 62px;
background: url(images/footer.gif) repeat-x;
}

#footer p {
text-align: center;
font-size: smaller;
color: #0F5B96;
}

#footer a {
color: #0F5B96;
}