.impressum-menu {
  position: fixed;
  bottom: 10px;
  left: 20px;

  font-size: 14px;
  transition: font-variation-settings 0.25s ease, width 0.5s ease;
  font-variation-settings: "wght" 400;

  cursor: pointer;

  z-index: 5;
  user-select: none;
}

.impressum-menu:hover {
  font-variation-settings: "wght" 900;
  transition: font-variation-settings 0.4s, letter-spacing 0.4s, width 0.5s ease;
  /* letter-spacing: 0.025em; */
}

.inactive-impressum {
  transition: font-variation-settings 0.25s ease, width 0.5s ease;
  color: white;
  font-variation-settings: "wght" 900;
  /* width: 28vw; */
  /* background-color: black; */
  pointer-events: none;
}

.impressum-menu-background {
  width: 30vw;
  background-color: black;
  /* border: solid blue; */
  position: sticky;
  bottom: 6px;
  height: 22px;
}

/* .impressum-menu {
  position: fixed;
  right: 0;
  top: 0;
  height: 100vh;
  width: 5vw;

  display: flex;
  justify-content: center;
  align-items: center;

  /* border: solid turquoise; */
  background-color: black;
  z-index: 1;
} */

.impressum-text {
  transform: rotate(-90deg) scaleX(130%);
  font-size: 2em;
  font-weight: bold;
  color: white;
  cursor: pointer;
  transition: transform 0.25s ease;
  z-index: 1;
  user-select: none;
}

.impressum-text:hover {
  transform: rotate(-90deg) scaleX(100%);
}

.impressum-text-hover {
  transform: rotate(-90deg) scaleX(100%);
}

.impressum-content {
  /* border: solid blue; */
  background-color: black;
  color: white;

  height: 100vh;
  position: fixed;
  width: 30vw;
  left: 0;
  top: 0;
  transform: translateX(-101%);
  transition: transform 0.5s ease;

  padding-left: 20px;
  padding-right: 5vw;

  overflow-y: scroll;
  overflow-x: hidden;

  z-index: 4;
  font-size: 14px;

  padding-top: 5vh;
}

.impressum-frame {
  /* position: absolute; */
  width: 90%;
  overflow-x: hidden;
}

.transformed {
  transform: translateX(0%);
}