polyglot/app/assets/stylesheets/components/_navbar.scss

.polyglot-navbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100vw;
  height: 3.5em;
  background: $navbar-background;

  .logo {
    color: $primary;
    margin-left: 1em;

    font-size: 2em;
    font-weight: bold;
  }


  .right-align {
    height: 100%;
    width: 16em;
    margin-right: 5em;
    display: flex;
    align-items: center;
    justify-content: space-between;
    .links {
      display: flex;
      height: inherit;
      div {
        height: inherit;
        display: flex;
        align-items: center;
        border-bottom: 5px solid transparent;

        &:first-child {
          margin-right: 1em;
        }

        &.active {
          border-bottom: 5px solid $primary;
          color: white;

           a {
            color: white;
           }
        }
        a {
          color: #C4C4C4;
          text-decoration: none;
        }
      }
    }
  }

  .profile {
    img {
      width: 3.25em;
    }
  }
}