I have added custom CSS for the active li element of navbar. But it seems to be picking the default color. Other colors such as navbar BG and text color seems to have change
Well, I had a similar challenge. Using the inspect element tool in Firefox, I was able to trace the markup and the CSS used to style the link when clicked. On click, the list item (li) is given a class of .open and it's the anchor tag in the class that is formatted with the grey color background.
To fix this, just add this to your stylesheet.
.nav .open > a
{
background:#759ad6;
// Put in styling
}