:host(.menu--language) { align-items: center; display: flex; flex-flow: row; position: absolute; right: 0; top: 0; @include breakpoint($medium) { position: relative; right: auto; top: auto; } } .menu--language__toggle { @include font-size(14px, 24px); align-items: center; background: transparent; border: 0 none; color: var(--brand-main-nearly-black); display: flex; flex-flow: row; letter-spacing: -0.4px; margin: 0 -4px; padding: 0; text-transform: uppercase; &:focus { outline: solid 2px var(--additional-yellow); outline-offset: 2px; } &.is-open { .menu--language__toggle__caret { transform: rotate(180deg); } } > * { padding: 0 4px; } } .menu--language__dropdown { background-color: var(--grayscale-white); border: 1px solid var(--brand-main-nearly-black); border-radius: 0 0 5px 5px; display: flex; flex-flow: column; justify-items: center; margin: 0; padding: 10px; position: absolute; right: 15px; text-transform: uppercase; top: 40px; visibility: hidden; &.is-open { visibility: visible; a { @include font-size(16px, 20px); margin-left: 0; } } }