body {
    width: 100%;
    height: 100vh;
    margin: 0 !important;
    padding: 0 !important;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1rem;
    color: #303030;
}

.wrapper {
    width: 100%;
    height: 100vh;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.container {
    width: auto;
    max-width: min(450px, 90%);
}

.container .lichtware-logo {
    background-color: hsl(0, 100%, 41%);
    width: auto;
    max-width: 450px;
    padding: 0 5vw;
}

.container .logo-schrift {
    padding: 20px;
    min-height: 100px;
}

.container img {
    width: 100%;
    height: auto;
    display: block;
}
/*
.kontakt {
    position: absolute;
    top: 50px;
    right: 0;
}

.kontakt a {
    color: #303030;
    text-decoration: none;
    display: none;
    padding: 1em 3em;
}

.kontakt:hover a {
    display: inline;
    margin: 0 2em;
    background-color: #f7f7f7;
}

.kontakt p span {
    background-color: hsl(0, 100%, 41%);
    padding: 1em 3em;
    color: #fff;
    cursor: pointer;
}

@keyframes {
    .sliden {

    }
}

*/

.kontakt {
  position: absolute;
  top: 50px;
  right: 0;
}

/* Button fix rechts */
.kontakt span {
  position: absolute;
  right: 0;
  background-color: hsl(0, 100%, 41%);
  color: #fff;
  padding: 1em 3em;
  cursor: pointer;
  white-space: nowrap;
  z-index: 2;
}

/* Link startet unsichtbar links vom Button */
.kontakt a {
  position: absolute;
  top: 0;
  right: 100%; /* direkt links vom Button */
  opacity: 0;
  transform: translateX(0);
  pointer-events: none;
  transition: all 0.4s ease;
  background-color: #f7f7f7;
  color: #303030;
  text-decoration: none;
  padding: 1em 3em;
  white-space: nowrap;
}

/* Hover-Animation */
.kontakt:hover a {
  opacity: 1;
  transform: translateX(-150px);
  pointer-events: auto;
}