.lang-selector {
  position: fixed;
  z-index: 3;
  right: 6px;
  top: 6px;
  cursor: pointer;
  list-style: none;
  margin: 0;
  border: 2px solid #fff;
  min-width: 40px;
  padding: 0 0 3px;
  text-align: center;
  background: #402;
}
.lang-selector:hover {
  border-color: #1c74bc;
}

html[lang=en] .lang-selector li[lang=en] {
  display: none;
}

html[lang=nl] .lang-selector li[lang=nl] {
  display: none;
}

.multi-lang-block {
  display: flex;
  overflow: hidden;
}
.multi-lang-block *[lang] {
  display: block;
  width: 100%;
  padding-left: 1px;
  overflow: hidden;
}

html[lang=en] .multi-lang-block *[lang=en] {
  margin-left: 0;
}

html[lang=en] .multi-lang-block *[lang=nl] {
  margin-right: -100%;
}

html[lang=en].lang-animate .multi-lang-block *[lang=en] {
  animation-duration: 1s;
  animation-timing-function: cubic-bezier(0.68, -0.55, 0.27, 1.55);
  animation-name: en_to_en;
}

html[lang=en].lang-animate .multi-lang-block *[lang=nl] {
  animation-duration: 1s;
  animation-timing-function: cubic-bezier(0.68, -0.55, 0.27, 1.55);
  animation-name: nl_to_en;
}

@keyframes en_to_en {
  from {
    margin-left: -100%;
  }
  to {
    margin-left: 0;
  }
}
@keyframes en_to_nl {
  from {
    margin-right: 0;
  }
  to {
    margin-right: -100%;
  }
}
html[lang=nl] .multi-lang-block *[lang=en] {
  margin-left: -100%;
}

html[lang=nl].lang-animate .multi-lang-block *[lang=en] {
  animation-duration: 1s;
  animation-timing-function: cubic-bezier(0.68, -0.55, 0.27, 1.55);
  animation-name: en_to_nl;
}

html[lang=nl] .multi-lang-block *[lang=nl] {
  margin-right: 0;
}

html[lang=nl].lang-animate .multi-lang-block *[lang=nl] {
  animation-duration: 1s;
  animation-timing-function: cubic-bezier(0.68, -0.55, 0.27, 1.55);
  animation-name: nl_to_nl;
}

html[lang=nl] .change-language *[lang=en],
html[lang=nl] .change-language[lang=en] {
  display: none;
}

html[lang=en] .change-language *[lang=nl],
html[lang=en] .change-language[lang=nl] {
  display: none;
}

/*# sourceMappingURL=language.css.map */