@import "../../../styles/colors.scss";
@import "../../../styles/values.scss";

#header {

  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: $bg-color-2;

  font-size: 18px;

  div.menu {
    height: 100%;

    ul {
      height: 100%;
      display: flex;
      align-items: flex-end;

      li {
        margin-left: 40px;
      }
    }

    a {
      display: block;
      padding-bottom: 7px;
      color: $font-color-2;
      border-bottom: 6px solid transparent;
      text-transform: uppercase;
    }

    a.active {
      color: $font-color-2;
      border-bottom-color: $accent-color-1;
    }
  }

  div.logo {
    img {
      display: block;
      margin-right: 40px;
    }
  }

}

@import "../../../styles/colors.scss";
@import "../../../styles/values.scss";

#header {

  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: $bg-color-2;

  font-size: 18px;

  div.menu {
    height: 100%;

    ul {
      height: 100%;
      display: flex;
      align-items: flex-end;

      li {
        margin-left: 40px;
      }
    }

    a {
      color: $font-color-4;
      display: block;
      padding-bottom: 7px;
      border-bottom: 6px solid transparent;
      text-transform: uppercase;
    }

    a.active {
      color: $font-color-2;
      border-bottom-color: $accent-color-1;
    }
  }

  div.logo {
    img {
      display: block;
      margin-right: 40px;
    }
  }

}

Fix header non-active link colors
Fix header non-active link colors
