Nav Menu Color Issue

Hello all!

I am developing a small website and there is a simple CSS issue that I am looking for some help with.

Here is my goal: Create a dropdown navigation menu. When the choices are hovered over, have a blue background with white letters. Like that pictured below.

When I am outside the folder - say I am on the "Meeting Links" page - and then, I drag my mouse over to "Schedules", the dropdown menu works exactly as I like it. Blue background with white letters when hovered over. 

Here's the issue: When I am inside the folder - say on the "Meeting Schedule" page, or another page in that folder - and then I do the same thing, I get a blue background, but no white letters.

How can I fix this so that it looks the same in box situations? Inside and outside the navigation folder?

Here is the CSS I am working with:

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

Any thoughts would be greatly appreciated. Thank you!