Basically I want to change the background of the site to a different colour using the:

{body
background-color:
}

But when i do that the colour will be seen within the wrapper div content (the main body content).

so everything with in the wrapper div i want to be 'on top' of the background colour or background image.

here is the css for the site:

Code:
#wrapper {
margin:auto;
width:960px;
border: 3px solid #a30d0d;
overflow:hidden
background-color:#fffff
}
#header {
background-color:#a30d0d;
height:76px;
background-image:url(http://www.propertieschiangmai.com/i...bcolour2.png);
background-repeat:no-repeat;
}
#alpha-logo {
display:block;
height:76px;
text-indent:-9999px;
width:216px;
}
#topmenu {
height:20px;
background-color:#fffff;
}
#left {
text-align:right;
float:left;
width:145px;
background-color:#a30d0d;


}
#right {
float:right;
width:145px;
background-color:#a30d0d;
}
#mainbody {
margin-left:155px;
margin-right:155px;
background-color:#fffff;
}
#middle {
margin-left:155px;
margin-right:155px;
background-color:#fffff;
}
#footer {
background-color:#a30d0d;
height:50px;
clear:both;
}
body {
font-family:Calibri, Verdana, sans-serif;
margin: 0 auto;
padding: 0;
background-color:#fffff;


}
#clearer {
clear:both;
height:1px;
overflow:hidden;
margin-top:-1px;

I'm guessing when i set a background colour for the Wrapper div that everything within the wrapper should have that as its default background colour?

Also there is a white gap between the bottom of the right column and the footer of about 40px or so.

Thanks.