Help please font colors

[Mrsb]

Hi ~ I am trying to change the color of the fonts on my site - http://www.designsbyj3.com
I have read everything I can get my hands on, I have changed, altered the css a million times and nothing I try is working!

Example the right and left box's - some are in white font, some are in black. I am trying to change them all to white.

/*list box contents*/
.centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .additionalImages, .centerBoxContentsSpecials, .centerBoxContentsAlsoPurch, .centerBoxContentsFeatured, .centerBoxContentsNew {
margin: 1em 0em;
}
.centerBoxWrapper {
border:1px solid #9A9A9A;
height:1%;
margin:1.1em 0pt;
}
h2.centerBoxHeading {
color:#FFFFFF;
font-size:1.3em;
/*sideboxes*/
}
.columnLeft {
}
h3.leftBoxHeading, h3.leftBoxHeading a, h3.rightBoxHeading, h3.rightBoxHeading a {
color:#FFFFFF;
font-size:1em;
}
#manufacturersHeading, #currenciesHeading, #musicgenresHeading, #recordcompaniesHeading, #searchHeading, #search-headerHeading {
color:#FFFFFF;
font-size:0.9em;
}
.leftBoxHeading, .centerBoxHeading, .rightBoxHeading {
background-color:#ffffff;
background-image:url(../images/tile_back.gif);
margin:0em;
padding:0.2em;
}
.leftBoxContainer, .rightBoxContainer {
border-color:#ffffff rgb(154, 154, 154) rgb(51, 102, 51);
border-style:solid;
border-width:1px 1px 5px;
margin:1.5em 0em 0em;
}
.sideBoxContent {
background-color:#FFFFFF;
padding:0.4em;
}
h3.leftBoxHeading a:hover, h3.rightBoxHeading a:hover {
color:#FFFF33;
text-decoration:none;
}
.rightBoxHeading a:visited, .leftBoxHeading a:visited, .centerBoxHeading a:visited {
color:#FFFFFF;
}

I am completely at a loss! If anyone could please help me I would be forever in your debt! lol

Yes I have Firefox web developer - as well as Firebug - they don't tell me diddly!

Thank you in advance!

[gjh42]

You have stylesheetBAK.css in your /includes/templates/gloss_black/css/ folder, which is still loaded even though you have changed its name, comes after stylesheet.css, and overrides almost everything you do in stylesheet.css.
Everything with a .css extension in your /css/ folder will be loaded and applied.
Get rid of that and your life will be much easier.

[Mrsb]

Thank you! I was not sure what that was so I just left it there! I have removed it - and some of the fonts changed that I wanted. (your a legend!) but now...

I want the center to be white - it is now clear?
I also want to get rid of that green bit on the bottom of the side boxes - I have removed any green I could find in the CSS and it is still there? Suggestions?


Thank you so much! I was up for 2 nights trying to change those font colors!!

[Mrsb]

I got rid of the green YEAH! lol

Now - still trying to work out why the center is clear?

Thank you so much for your help!!!

[gjh42]

.centerColumn {background-color: #ffffff;}

You have this:

.leftBoxContainer, .rightBoxContainer {
border-color:#ffffff rgb(154, 154, 154) rgb(51, 102, 51);
border-style:solid;
border-width:1px 1px 5px;
margin:1.5em 0em 0em;
}

which makes the top white, left & right gray, and bottom green.

[Mrsb]

I found this -
.centerColumn, #bannerOne, #bannerTwo, #bannerThree, #bannerFour, #bannerFive, #bannerSix {
padding: 0.8em;

Is that where the centerColumn {background-color: #ffffff;} would go?

I am so sorry to be a pain!!

[gjh42]

No, you need the
.centerColumn {background-color: #ffffff;}
on its own line, so all those other things don't also get a white background.

It's good to keep similar declarations near each other, though, to make it easier to find things, and also good to keep properties of one selector in one place. So you could change the line you show to:

#bannerOne, #bannerTwo, #bannerThree, #bannerFour, #bannerFive, #bannerSix {
    padding: 0.8em;
    }

.centerColumn {
    background-color: #ffffff;
    padding: 0.8em;
    }