.main {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

html,
body {
  width: 100%;
  height: 100%;
  transition: all 0.2s ease;
  animation: changeColor 10s infinite;
  overflow: hidden;
}

.main marquee {
  width: 400px;
  height: 100px;
}

.main img {
  transition: all 0.2s ease;
  animation: borderRadius 1s infinite;
  height: 400px;
}

span {
  width: 500px;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

@keyframes borderRadius {
  0% {
    border-radius: 0px;
  }

  50% {
    border-radius: 100px;
  }
  100% {
    border-radius: 0px;
  }
}

@keyframes changeColor {
  0% {
    background-color: red;
  }

  10% {
    background-color: rgb(240, 61, 240);
  }
  20% {
    background-color: rgb(61, 94, 240);
  }
  30% {
    background-color: rgb(61, 240, 210);
  }
  40% {
    background-color: rgb(240, 142, 61);
  }
  50% {
    background-color: rgb(0, 6, 83);
  }
  60% {
    background-color: rgb(153, 105, 105);
  }
  70% {
    background-color: rgb(255, 255, 255);
  }
  80% {
    background-color: rgb(61, 240, 142);
  }
  90% {
    background-color: rgb(134, 4, 113);
  }
  90% {
    background-color: rgb(95, 10, 10);
  }
}