.tumbler__wrapper {
width: 50px;
height: 30px;
background-color: black;
border: darken(#aae2f1, 40);
border-radius: 30px;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 6px;
cursor: pointer;
display: flex;
position: relative;
}

.tumbler__wrapper svg {
  width: 15px;
  height: 15px;
}

.tumbler {
  position: absolute;
height: 20px;
width: 20px;
border-radius: 50%;
background-color: #fff;
will-change: transform;
}

.tumbler--night-mode {
  transform: translateX(calc(100% - 2px));
}

.credits {
  display: none;
}

.sun-svg,
.moon-svg {
  display: none;
}

@media screen and(max-width: 700px) {
  .tumbler__wrapper {
    cursor: default !important;
  }
}