html, body {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: black;
}

.zoom-in {
  width: 300px;
  height: 300px;
  animation: zoom-in-zoom-out 3s ease, glow 1s ease-in-out infinite alternate;
}

@keyframes zoom-in-zoom-out {
  0% {
    scale: 40%;
    opacity: 0%;
  }
  100% {
    scale: 100%;
    opacity: 100%;
  }
}

@keyframes glow {
  from {
    -webkit-filter: drop-shadow(0px 0px 12px rgb(255, 255, 255));
    filter: drop-shadow(0px 0px 20px rgb(255, 255, 255));
  }
  to {
    -webkit-filter: drop-shadow(0px 0px 4px rgb(255, 255, 255));
    filter: drop-shadow(0px 0px 8px rgb(255, 255, 255));
  }
}