Wordpress- How do i change the default font of navigation menu?

Tags: jquery,html,css,wordpress,fonts

Problem :

i am trying to change the default font of the site. i have edited the css file and changed the font. everything works fine. except the nav menu font. its not changing. it is set to default ""Trebuchet MS", Arial, Helvetica, sans-serif" font.

.sf-menu > li > a {
font: bold 21px/66px "Trebuchet MS", Arial, Helvetica, sans-serif;
color: #333333;
}

I can change the font here.. but the problem i am facing here is, this code is pointing to (index):67 (when i do inspect element in chrome). where can find this code? which file i have to edit.?

screen shot -> http://i39.tinypic.com/2rzqcld.png

in css file main_style.css,

.sf-menu > li > a {
    padding:0 28px;
    border:none;
    color:#323232;
    -webkit-transition:0.3s;
    -moz-transition:0.3s;
    -o-transition:0.3s;
    transition:0.3s;
}

I am not able to find anything about this font family. even if i add font face here, its not changing the navigation menu's font family. if i add other properties like background color is working, only the font properties not working.

How to fix this??

---

Solution :

You can create your own custom class and give the fonts property an "!important" tag, and apply that class to the menu too. This way only font property will be overwrited.

Eg:

example

{
font-size: 14px !important; 
    font: "Your Own Fonts", Arial, Helvetica, sans-serif !important;
}

---

You can read more about it here: http://coding.smashingmagazine.com/2010/11/02/the-important-css-declaration-how-and-when-to-use-it/