Support » Themes and Templates » cant find this font anywhere, need to change the color

  • Resolved blackss32


    hi, i have been looking through templates for the last hour looking for the font color and hover color on the main index page. rg: screen shoot.

    screen shot

    that font is not in the style css, the only place i thought it could be is the main index template.

    im totally at a hold here.

    some support would be amazing please.
    just need to change that font color.

    the before you click the link and after you click the link color font.

Viewing 11 replies - 1 through 11 (of 11 total)
  • That would be the anchor styling; in your css do a search for a. You will be changing the a:hover styles.

    hi, thanks but still cant find it in style css

    /* global resets */
    html, body, h1, h2, h3, h4, ul, ol, code, blockquote, p, img, table, th, td, hr, br {border: none; margin: 0; padding: 0;}
    /* general styles */
    body {background: #000000 url(images/gradient.jpg) repeat-x; font: 75%/160% Verdana, Arial, Geneva, sans-serif; text-align: center;}
    h1, h2, h3, h4 {font-family: Georgia, "Times New Roman", Times, serif; margin-bottom: 10px;}
    p {margin-bottom: 25px;}
    ul, ol {margin-bottom: 10px;}
    table {border-collapse: collapse; margin: 0 auto 25px;}
    th, td {padding: 3px;}
    /* layout */
    #wrap {background-color: #ffffff; color: #000000; width: 980px; margin: 10px auto; text-align: left;}
    #content {float: left; width: 650px; margin: 25px 0 25px 20px;}
    #sidebar {float: right; width: 250px; margin: 25px 20px 25px 0; padding: 0 10px}
    #footer {clear: both; text-align: center;}
    /* header */
    #header h1, #header h2, #header h3 {font-size: 1.4em;}
    #header {background-color: #000000; border-bottom: 15px solid #000; margin: 0; padding: 0;}
    #header hr.clear {border: none; color: #; clear: both; line-height: 0;}
    #topnav {background-color: #000; padding: 5px; color: #33CC33; text-align: right;}
    #topnav a {color: #33CC33;}
    #header .benefits-banner {width: 450px; float: left; margin-left: 20px;}
    #header .ratings-banner {width: 450px; float: right; margin-right: 20px;}
    #header .ratings-banner ul {list-style: none;}
    /* content */
    #content h1, #content h2, #content h3 {font-size: 2em;}
    #content ul, #content ol {margin: 0 0 25px 35px;}
    #content blockquote {margin: 10px 25px; padding: 10px; border: 1px solid #000000; background-color: #0D0D0D;}
    /* sidebar */
    #sidebar {background-color: #0D0D0D; border: 1px solid #33CC33; text-align: right;}
    #sidebar h4 {border-bottom: 1px solid #ffffff; margin-top: 5px; font-weight: normal; font-size: 1.3em; text-align: right;}
    #sidebar ul {list-style: none; margin: 0 0 15px;}
    #sidebar ul li {margin-bottom: 5px;}
    #sidebar ul ul {margin: 0;}
    /* footer */
    #bottomnav {background-color: #000; color: #33CC33; padding: 5px;}
    #bottomnav a {color: #33CC33;}
    .designer-credit {font-size: 0.8em; color: #CC0033; padding-bottom: 10px;}
    .designer-credit a {color: #BCBCBC;}
    /* img styling */
    img.floatleft {float: left; margin-right: 8px;}
    img.floatright {float: right; margin-left: 8px;}
    img.centered {display: block; margin: 0 auto; text-align: center;}
    /* misc */
    #wrap, #header, #content, #sidebar, #footer {overflow: hidden;} /* avoid theme breakage by large images or elements */
    a.hilight {color: #CC0033 !important;}
    .center {text-align: center;}
    .justify {text-align: justify;}
    .right {text-align: right;}
    .left {text-align: left;}

    Then add a a:hover element to your stylesheet with the font and color properties you want. For the sake of organization, I would add it to your Misc section.

    thanks, but im not the best with codes.
    would it be pushing it to ask you for an example please?
    of where and what to put.
    thanks dude.

    ah got the hover working:

    a:hover {
    color: #147;
    text-decoration: underline;

    but just need the font change

    Use font-family: Arial for example.

    im not sure what you mean without a code sorry m8.

    i have used this code:
    a:visited {
    color: #ffffff;

    a:hover {
    color: #000000;

    works ok apart from edit and contact are still blue.

    ah this works:
    a {
    color: #CC0033;

    a img {
    border: none;

    a:visited {
    color: ##BCBCBC;

    a:hover {
    color: #ffffff;

    thanks heaps m8, cheers.

    a {
       color: #ff0000;
       font-family: Times New Roman;
    a:visited {
       color: #ffffff;
       font-family: Arial;
    a:hover {
       color: #000000;
       font-family: Verdana;

    Obviously you wouln’t use this combination, but I am giving you an example. You can also do it like so:

    a, a:visited, a:hover, a:active {
       color: #0000ff;
       font-family: Arial;
       text-decoration: underline;

    but again, you wouldn’t want these exact styles, as chances are they would not work well together, but it is given as an example.

    thanks jeromyboyd, i have one more font to change, the writing in the posts, sorry.

    ahhh found it, thx.

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘cant find this font anywhere, need to change the color’ is closed to new replies.