.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; a:hover { color: $primary; } } .right-align { height: 100%; width: 16em; margin-right: 4em; 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: 2.5em; } &.active { border-bottom: 5px solid $primary; color: white; } &:hover { color: white; } &.active, &:hover { a { color: white; } } a { color: $text-inactive; text-decoration: none; } } } } .profile { img { width: 3em; padding: 0.2em; border-radius: 50%; } } .burger-menu { margin-right: 20px; color: $primary; } .polyglot-dropdown { background-color: $navbar-background; li { a { color: $text-inactive; &:hover { color: white; background-color: $background; } } } } }