CSS Styling- color

In your stylesheet called custom.css.

Change

.sf_footer {
background-color:#59613C;
color:#999999;
}

to...

.sf_footer {
background-color:#CCCCCC;
color:#999999;
}

Hi there,

Thanks for the response. I tried to follow those changes on the color but whats happening now is the whole background is turning green.

I am still stuck with the green strip at the bottom of the homepage.

Please advise.

Well, there is no way that is possible, so you must have changed the background-color value on the wrong element.

jon19870 has explained what to do to change the color from green to #cccccc. Look for a class called .sf_footer, and simply change the background color to #cccccc. But this class isnt in custom.css. Its located in color_1 css file.

color_1 css file? Im totally lost. Here is the copy of the code I edited.

Im a newbie to this CSS stuff so I dont have a clue.

Here is what I have below. Im not sure

body {
color:#000;
background-color: #59613c;
}
a:link, a:visited {
color: #59613C;
}

a:hover {
color: #000;
}
.sf_outer_wrapper {

}

.sf_wrapper {
position: relative;
background-image: url(images/bg_1.gif);
background-color: #fbfffe;
}

.sf_navigation_top {

}

.sf_header_wrapper {
background-image: url(images/header_1.jpg);
}

.sf_extra2 {

}

.sf_extra4 {

}

.sf_extra10 {

}

.sf_extra10 span {

}

.sf_main_header {
color: #3d422a;
}

.sf_sub_header {

}

.sf_navigation {
border-left: 1px solid #59613C;
border-right: 1px solid #59613C;
border-top: 5px solid #59613c;
border-bottom: 5px solid #59613c;
background-color: #f2faf8;
background-image: url(images/sidebar_1.jpg);
}

.sf_navigation ul {

}

.sf_navigation ul li {
border-bottom: 1px solid #59613C;
}

.sf_navigation ul li.sf_last_nav_item {

}

.sf_navigation ul li a, .sf_navigation ul li a:visited {
background-image: url(images/bttn_bg_1.gif);
}

.sf_navigation ul li a:hover {

}
.sf_content {
border-left: 1px solid #59613C;
border-top: 1px solid #59613C;
}
.sf_footer {
background-color: #CCCCCC;
color: #999;
}

.sf_pagetitle {

}

.sf_banner a:link, .sf_banner a:visited {
color: #999;
text-decoration: underline;
}
.sf_banner a:hover {
color: #000;
text-decoration: none;
}

/**
* -------------------------------
* @section DBNow
* -------------------------------
*/

.Data_Central_color7 {
background-color:#95b3ac;
color:#000;
}

.Data_Central_color1 {
background-color:#BACCC8;
color:#000;
}

.Data_Central_color2 {
background-color:#d2d2d2;
}

.Data_Central_color3 {
background-color:#e0e0e0;
}

.Data_Central_color6 {
background-color:#f0f0f0;
}

.Data_Central_color4 {
background-color:#ffffff;
}

.Data_Central_color5 {
border-color:#f0f0f0;
}

You have three style sheets links to this page. Edit the color_1 css file as explained above.

    <link rel='stylesheet' type='text/css' id='theme.css' href='theme.css?1477211795' />
    <link rel='stylesheet' type='text/css' id='color_1.css' href='color_1.css?1477211795' />
    <link rel='stylesheet' type='text/css' id='custom.css' href='custom.css?1477211795' />

If you still dont understand what we're talking about, you'll need to teach yourself html and css, or have somebody make changes for you.