Phil, I have already informed you of your issues above:
1. You're using PageLines Framework version 2.0.1, which is like I mentioned nearly a year old and in not updating, you may be putting your site in jeopardy i.e. security risk.
2. You're using !important declaration in your CSS.
In order to correctly override PageLines CSS, you need to use one of the PageLines overrides, more information on the overrides is available on the Custom CSS link I provided you above. Another thing to note is that when using !important it overrides everything, so the first thing you need to do is remove this declaration from your CSS. Removing !important and starting again using the PageLines overrides will make your life much easier.
Once removed, inspect the navigation to correctly find the selectors/classes using Firebug or your browsers built-in web dev tools. Once found, use them to correctly configure your CSS and style your navigation.
You're using this CSS:
Instead you should use this:
But you're making your life more difficult using the PageLines version you're using, as with the latest version all sections have unique classes. These classes, make your life super easy and there would be no need to use the following CSS, all you would need to do is inspect the section and view the class being used, usually it should look like this:
and so on, but with you using the version you're, these classes are not available.
Also, read the Wordpress article here for menu item CSS classes -