@import "../../../scss/variables";
@import "../../../scss/breakpoints.mixins";
@import "../../../scss/typo.mixins";
@import "../../../scss/grid.mixins";

.footer-language {
  @extend %typo-20;

  display: flex;
  line-height: 1;
  color: rgba(255, 255, 255, 0.65);
  text-decoration: none;
  text-transform: uppercase;
  align-items: center;

  @include media-breakpoint-up(tablet) {
    @include typo-14;
  }

  & + &::before {
    display: block;
    width: 1px;
    height: 10px;
    margin: 0 10px;
    content: "";
    background: rgba(255, 255, 255, 0.65);
  }

  &:hover,
  &:focus,
  &.is-active {
    color: #fff;
    text-decoration: none;
  }
}