changing color, fonts, and background

[WISR]

can someone show me where I change the following on my site. http://www.WiSR.ca

1. font size and font style of primary navigation menu

2.change 'Featured Communities" widget background color (white to black) and font color(black to white)

http://www.wisr.ca

[wmwebdes]

Hi
This is the CSS for your primary nav

#nav {
color: #fff;
font-size: 13px;
}

Looks as though it picks up font-family from the CSS below.

body, h1, h2, h2 a, h2 a:visited, h3, h4, h5, h6, p, input, select, textarea {
font-family: 'Droid Serif', arial, serif;
font-weight: normal;
line-height: 22px;
}

Change the font size under #nav and add the font you want under #nav.

Let me know if you are OK with that.

[wmwebdes]

For the Featured Communities add the background colour to .communities as shown below:

.communities {
border-bottom: 3px double #000;
clear: both;
margin: 0 auto 25px;
overflow: hidden;
padding: 0 0 15px;
width: 930px;
background-color: #000000;
}

[WISR]

Got it to work but now can't figure out how to change the font color in the "Featured Properties" widget.

Would like the background to be black but it washed out the font so I'll leave it for now.

Thanks for your help 🙂

[wmwebdes]

Font colour in “Featured Properties” widget is black (slightly off black) so you can't see it with a dark background.

Add
color: #333;
to .communities and change the colour to whatever you like.

#333 is almost black.

Free colour picker here... http://www.iconico.com/colorpic/

[WISR]

Tried adding a color to the .communities (Featured Communities) but it wouldn't take.

Below is how it looks and I tried adding, color: #fff, (not shown below), directly below .communities { , but it didn't change the color of any fonts.
.communities {
border-bottom: 3px double #000;
clear: both;
margin: 0 auto 25px;
overflow: hidden;
padding: 0 0 15px;
width: 930px;
background-color: #000;
}

.communities p {
font-size: 13px;
line-height: 20px;
padding: 0;

 

I'm thinking it must be changed elsewhere, maybe under my "red theme" in .css?

 

[AnitaC]

Each home is a Featured Post, so the settings are there - but because a lot of elements are now combined, if you change 1 element, they change something else. You need to break it down so here's what to do:

For the black background, do this. Look for this code and change the background color to #000000 for black.

.communities {
    background-color: #DDDDDD;
    border-bottom: 3px double #000000;
    clear: both;
    margin: 0 auto 25px;
    overflow: hidden;
    padding: 0 0 15px;
    width: 930px;
}

Then, copy and paste this at the bottom of your style.css sheet. I added the color in there - change the color to what you want.

.communities h2, .communities h2 a, .communities h2 a:visited {
    font-family: 'Droid Serif',arial,serif;
    font-size: 14px;
    color: #cc9900;
    line-height: 22px;
    margin: 0;
    text-align: center;
    text-transform: uppercase;
}

---

Need help with customization or troubleshooting? Reach out to me.

[ramseyp]

If you want the whole widget background to be black, this should work (in your style.css):

`.widget.featured-listings { background: #000; }`

To turn the widget's font to white, this should work (also placed in style.css):

`.featured-listings .listing { color: #fff; }`

---

Community • Work • Conversations

[AnitaC]

Open up your style... you added the at the beginning and end of the style sheet. Remove that code.

---

Need help with customization or troubleshooting? Reach out to me.

[WISR]

I was able to make the color change for the font below the images in "Featured Communities", and make the background black too.

The problem I'm having is when I change the color of the word " Featured Communities" to white, (so its visible with the black background), it also changes the headlines in my "From the Blog" section and the lower part of my slider text to white as well and they become invisible unless I hover over them with my mouse.

How can I change the color of  the word "Featured Communities" to white and have the other 2 sections (stay black) not be affected?

Thanks for all your suggestions! This is quite a learning experience 🙂

 

[AnitaC]

Add this to the bottom of your style sheet:

.communities h4 {
color: #ffffff;
}

---

Need help with customization or troubleshooting? Reach out to me.

[WISR]

WOOHOOO!!!   Thank you 🙂

 

[Author]

Posts