Styling the navbar, adding the effects to active navbar as well.

Hello,

I have been trying to style my navbar so that once I hover, there is an effect which inverts the font colour and adds a background. The code I have now has been working well until I added another dropdown menu (resources), where the active style does not work as intended.

The effects under "products" are the effects I am trying to achieve on "support," but if I am already on support, the dropdown on the navbar does not look good.

This is the CSS I use at the moment:

//Stylized Folder Dropdown Menu
@linkBGColor: #d20c0d;
@linkTextColor: #fff;
.header-nav .header-nav-item--folder .header-nav-folder-content {
  padding: 1em;
  .header-nav-folder-item {
    padding: .5em 1em;
  }
  .header-nav-folder-item:hover {
    background: @linkBGColor;
    a {
      color: @linkTextColor;
    }
  }
}

Can you share site url? We can check easier