kod3x-logo {
  position: fixed;
  top: 5px;
  left: 10px;
  z-index: 110;
}
kod3x-logo a {
  display: block;
  width: 80px;
  border: 0;
}
kod3x-logo a svg #Line {
  stroke: var(--color-logo-1);
}
kod3x-logo a svg #K,
kod3x-logo a svg #D,
kod3x-logo a svg #T,
kod3x-logo a svg #X {
  fill: var(--color-logo-1);
}
kod3x-logo a svg #o {
  fill: var(--color-logo-2);
}
@media screen and (width <= 319px) {
  kod3x-logo {
    display: none;
  }
}

kod3x-search {
  position: fixed;
  top: 6px;
  right: 40px;
  z-index: 110;
}
kod3x-search a {
  display: block;
  height: 28px;
  width: 28px;
  border: 0;
}
kod3x-search a #loupe {
  stroke: var(--color-logo-icon);
}
@media screen and (width <= 319px) {
  kod3x-search {
    display: none;
  }
}

kod3x-light {
  position: fixed;
  top: 8px;
  right: 10px;
  z-index: 110;
}
kod3x-light button {
  padding: 0;
  height: 26px;
  width: 26px;
  border: 0;
  background-color: transparent;
  cursor: pointer;
}
kod3x-light #Bolt-v2 path {
  fill: var(--color-logo-icon);
}
@media screen and (width <= 319px) {
  kod3x-light {
    display: none;
  }
}

kod3x-outsize {
  display: none;
  height: 100vh;
  text-align: center;
}
kod3x-outsize svg {
  max-width: 200px;
}
kod3x-outsize #Octopus {
  fill: var(--color-logo-1);
}
@media screen and (width <= 319px) {
  kod3x-outsize {
    display: block;
  }
}

kod3x-copyright {
  position: fixed;
  right: 10px;
  bottom: 5px;
  z-index: 110;
}
kod3x-copyright svg {
  width: 50px;
}
kod3x-copyright svg #Octopus {
  fill: var(--color-logo-3);
}

@keyframes spin {
  to {
    transform: rotateX(1turn) rotateY(1turn) rotateZ(1turn);
  }
}
@supports (animation-timeline: scroll()) {
  kod3x-copyright {
    animation: spin linear both;
    animation-timeline: scroll();
  }
}
