There are a couple ways to do this by customizing your style.css file. The first way is to change the main background for the body (look for the following code around line 150) –
body {
background-color: #fff;
color: #333;
font-family: 'Open Sans', sans-serif;
font-size: 20px;
font-size: 2.0rem;
font-weight: 300;
line-height: 1.625;
margin: 0;
}<!--formatted-->
Then change the .site-inner
background color around line 651 –
.site-inner {
background-color: #fff;
clear: both;
margin-top: 170px;
position: relative;
z-index: 9;
-word-wrap: break-word;
}
^ That controls the inner content background color.
And finally, if you’re using Widgets in your Sidebar area, you can change the background color for those around line 1983 –
.sidebar .widget {
background-color: #fff;
margin-bottom: 40px;
}
^ Each widget has a white background color, so that’s why you’d need to change it.
An easier way to do this would be to leave the body background-color code as it is and change the color to what you want it to be. Then remove the background colors for the .site-inner
and the .sidebar .widget
. This would make it easier so you would only have to change 1 line of code instead of 3.
If you need assistance changing this code just let me know and I can log in and do it for you.
Let me know if this helps.