.capsule {
  display: flex;
  justify-content: left;
  margin-top: 50px;
}

.item {
  width: 200px;
  height: 50px;
  margin: 10px;
  position: relative;
  padding-left: 25px;
}

button {
  border: 1px solid #000000;
  background: white;
  width: 100%;
  padding: 15px;
  border-radius: 3px;
  color: black;
  transition: background 0.5s ease;
  font-size: 1em;
  font-family: "Questrial";
}

button:hover {
  background: black;
  color: white;
  font-weight: strong;
}

@keyframes slide1 {
  0%,
  100% {
    transform: translate(0, 0);
  }

  50% {
    transform: translate(10px, 0);
  }
}

@keyframes slide2 {
  0%,
  100% {
    transform: translate(0, 0) rotate(45deg);
  }

  50% {
    transform: translate(10px, 10px) rotate(45deg);
  }
}

@keyframes slide3 {
  0%,
  100% {
    transform: rotate(-45deg);
  }

  50% {
    transform: rotate(45deg);
  }
}

@keyframes slide4 {
  0% {
    transform: rotate(0);
  }

  100% {
    transform: rotate(360deg);
  }
}