.nav { &__list { overflow-x: auto; padding: .5rem; margin: -.5rem; -webkit-overflow-scrolling: touch; -ms-overflow-style: none; display: flex; align-items: center; justify-content: flex-end; &::-webkit-scrollbar { display: none; } > * + * { margin-left: 2rem; } } &__item { padding: get-size(300) 0; flex-shrink: 0; a { @include apply-utility('weight', 'mid'); color: currentColor; &:not(:hover) { text-decoration: none; } } &.active a { text-decoration: underline; cursor: default; } } } @media (max-width: 1199.98px) { .nav { margin-top: 1rem; &__list { justify-content: flex-start; } } } @media (max-width: 767.98px) { .nav { display: none; margin-top: 0; &.show { display: block; width: 100%; } &__list { flex-direction: column; align-items: flex-end; > * + * { margin-left: 0; } } } }