.moo-lang-switch {
    margin: 0 2rem;
}

.moo-lang-switch a {
    text-decoration: none;
}

.moo-lang-switch a:hover {
    text-decoration: underline;
}

.moo-lang-switch .lang-current {
    position: relative;
}

.moo-lang-switch .lang-current:hover .sub-menu,
.moo-lang-switch .lang-current:focus .sub-menu {
    right: 0;
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.15s linear, transform 0.15s linear;
}

.moo-lang-switch .sub-menu {
    background-color: #ffffff;
    border: 1px solid #000000;
    border-radius: 0.4rem;
    color: #000000;
    opacity: 0;
    padding: 0;
    position: absolute;
    right: 9999rem;
    bottom: calc(100% + 2rem);
    transition: opacity 0.15s linear, transform 0.15s linear, right 0s 0.15s;
    transform: translateY(0.6rem);
    width: 20rem;
    z-index: 1;
}

.moo-lang-switch .sub-menu.down {
    top: calc(100% + 2rem);
    bottom: revert;
}

.moo-lang-switch .sub-menu::before,
.moo-lang-switch .sub-menu::after {
    content: "";
    display: block;
    position: absolute;
    top: 100%;
}

.moo-lang-switch .sub-menu.down::before,
.moo-lang-switch .sub-menu.down::after {
    bottom: 100%;
    top: revert;
}

.moo-lang-switch .sub-menu::before {
    height: 2rem;
    left: 0;
    right: 0;
}

.moo-lang-switch .sub-menu::after {
    border: 0.8rem solid transparent;
    border-top-color: #000000;
    right: 1.8rem;
}

.moo-lang-switch .sub-menu.down::after {
    border-bottom-color: #000000;
    border-top-color: transparent;
}

.moo-lang-switch .lang-option a {
    display: block;
    padding: 1rem;
}

.moo-lang-switch__icon {
    display: inline-block;
    min-width: 1.5rem;
    width: 1.5rem;
    max-height: 1.5rem;
    vertical-align: bottom;
    pointer-events: none;
}

.moo-lang-switch__icon.parent {
    vertical-align: baseline;
}