In my template it's for both the product list and search pages but you may have different setting for each page.

Here's what I recommend:

  • If you don't already use the Firefox browser, install it.


  • Restart Firefox (if it's already open)

  • Open your page and do a search

  • Click on the Web Developer Button: Information => Display ID & Class Details

  • It should look something like this

  • Look at the "#" and "." fields to the left of the names you want to change, here they are:

#listCell0-1 .productListing-heading and #listCell0-1 .productListing-heading

That's what you need to change in your templates/[CUSTOM]/CSS/stylesheet in the following format

#[#name1], #[#name2], .[.nameheading1] a {
color: #[hex color];
font-size: [size number];
}


NOTE: It is case sensitive, so you need to type EXACTLY what it says in the Web developer display

Some this one here is:

[FONT="Courier New"]#listCell0-1, #listCell0-2, .productListing-heading a {
color: #ffffff;
font-size: 1em;
text-align: center;
}[/FONT]

Note that I only needed to put the .productListing-heading once since it was the same for both fields.

Good Luck!