Problem With Responsiveness

[closeupman]

I'm trying to make the font size of my menu items change, depending on the screen size.

 

So far I've got Vekia's code working (thanks Vekia!) if they make it too small and it creates a mobile friendly menu.

 

However, what I'd also like is if they make it smaller than the ideal size(i.e. menu all on one line), I'd like to reduce the font size.

 

In a nutshell:

from about 960px till about 1181px I want the font size to change to 12px.

 

I've tried media queries in both the .sf-menu > li and .sf-menu > li > a, in Superfish modified, to no avail, actually it kinda broke my menu if I put it in the .sf-menu > li, and made no change if did with the .sf-menu > li > a

 

Any ideas? It's driving me nuts!

 

Check out:

www.sitinuriatistudio.com

 

Thanks