In your custom CSS, instead of this:
.main-navigation li a {
color: #465045;
}
.main-navigation li a:hover {
color: #465045;
}
Use this:
#site-navigation ul a {
color: #465045;
}
#site-navigation ul a:hover {
color: #465045;
}
The existing rule for the menu link color uses an ID for the navigation element, while your rule uses the class name. Because of the way CSS specificity works, an ID has a higher specificity than a class, so to override the existing rule, you need to make your selector either equal or higher in specificity. What you want to try first, to overriding an existing property, is to find out what rule is in effect for that property, and then just copy the selector for that rule as part of your new rule.
