Hey guys, i need to change the background color of each "content" block or portion of each page [which is presently "white"] on this site to black,

www.mywholesalephones.com

this is the site's existing CSS code, what exactly do I need to change please? I am not seeing anything referring to "background" color of the blocks in this coding?

/************************************************** *******
************************************************** ********

Folder: Theme315_Generic1
Name: Generic 1
Cat: Generic

************************************************** ********
************************************************** *******/
/*------------------------------------
GENERAL
------------------------------------*/
body {
margin: auto;
}

.sf_outer_wrapper {
width: 798px;
margin: 50px auto;
}

.sf_wrapper {
width: 798px;
position: relative;
}

a {
color: #000;
}

.sf_extra10 {
display: none;
}

/* ------------------------------------
HEADER
------------------------------------ */
.sf_header_wrapper {
margin-top: 0px;
height: 133px;
background-image:url(images/dreamstime_1140097.jpg);
background-repeat:no-repeat;
width:798px;
}

.sf_main_header p, .sf_sub_header p { margin: 0; padding: 0; }
.sf_main_header {
padding-top: 25px;
text-align: left;
font: bold 24px Helvetica, Arial, sans-serif;
line-height: .9;
margin-left: 18px;
height: 40px;
overflow: hidden;
}

.sf_sub_header {
text-align: left;
font: normal 12px Helvetica, Arial, sans-serif;
padding: 4px 0 30px 50px;
width: 450px;
height: 30px;
overflow: hidden;
}
/* ------------------------------------
NAVIGATION
------------------------------------ */
.sf_navigation_top { display: none; }

.sf_navigation {
clear: both;
height: auto;
width: 798px;
}

.sf_navigation ul {
margin: 0 0;
height: auto !important; height: 1%;
padding-left: 0;
}

.sf_navigation ul:after {
content: ".";
display: block;
visibility: hidden;
height: 0;
font-size: 1px;
clear: both;
}

.sf_navigation ul {
list-style-type: none;
}

.sf_navigation ul li {
float: left;
width: auto !important;
width: 5px;
white-space: nowrap;
}

.sf_navigation ul li a {
height: 40px;
margin: 0 0 0 1px;
text-decoration: none;
display: block;
font: normal 12px Verdana, Arial, Helvetica, sans-serif;
line-height: 28px;
padding: 0 10px;
}

.sf_navigation ul li a:hover {
text-decoration: none;
color: #fff;
display: block;
}

/*------------------------------------
CONTENT
------------------------------------*/
.sf_pagetitle {
clear: both;
padding: 10px 0 0 20px;
font: normal 1.5em Helvetica, Arial, sans-serif;
text-align: left;
height: auto !important;
min-height: 30px;
}

.sf_content {
height: 300px;
padding: 20px 20px 0 20px;
margin: 0px;
font-size: 12px;
font-family: Verdana, Arial, Helvetica, sans-serif;
height: auto !important;
height: 200px;
min-height: 200px;
}

.sf_content:after {
content: ".";
display: block;
visibility: hidden;
height: 0;
font-size: 1px;
clear: both;
}

/*------------------------------------
FOOTER
------------------------------------*/
.sf_footer {
font-size: .8em;
padding: 25px 0 0 20px;
text-align: center;
font-family: Verdana, Arial, Helvetica, sans-serif;
height: 30px;
}

/*------------------------------------
BANNER
------------------------------------*/
div.sf_banner {
margin-bottom: 35px;
padding-top: 50px;
text-align: center;
font-size: .8em;
}

div.sf_banner div#bannerLink {
padding-top: 10px;
}

I am being told this:

White, or #FFFFFF; is the default value for background colours. All you need to do is add this to the sections you want to have a black background:

{background-color: #000; }

but I need to know exactly where to add it, let's narrow this down please, I want the content block's background alone to be black so I add the black color code to this section of the code? If so, I am told to add it to .sf_content, therefore the Content code should be?

.sf_content {
{background-color: #000; }
height: 300px;
padding: 20px 20px 0 20px;
margin: 0px;
font-size: 12px;
font-family: Verdana, Arial, Helvetica, sans-serif;
height: auto !important;
height: 200px;
min-height: 200px;
}

or should I remove the before and after {} surrounding the color code?

Remove the curly braces that you now have around the background color property, you only need 1 set per selector.

Great, works [thanks], so tell me, does this mean that if you are building a site and want the background color to be white you simply don't add any background color code?

Well, no, that's not a good habit to get into. For instance, my default desktop background color is a pale pink (doesn't cause eye strain). When I view sites that have NOT set a bg color, what I see is their (often) colored boxes sitting on top of pale pink. Who knows what colors someone else might have. So it's a good practice to ALWAYS specify a bg color, even if it's just white.

ok, noted, will do, thanks.

strange style setting in browsers are EXACTLY why "style re-setters" were invented.

http://developer.yahoo.com/yui/reset/

good stuff

I'd hardly call a default of white a 'strange setting'