@keyframes pulse {
  0%,
  100% {
    opacity: 0.3;
  }
  50% {
    opacity: 0.5;
  }
}

@keyframes pulsate {
  0%,
  100% {
    transform: scale(0.9);
  }
  50% {
    transform: scale(1.1);
  }
}

#orbit-container {
  position: absolute;
  z-index: 1;
  margin-top: -200px;
  width: 100%;
  height: 1400px;
  transform: scale(1.3);
  pointer-events: none;

  @media (max-width: 768px) {
    right: -50%;
    margin-top: -200px;
    width: 200%;
    height: 1200px;
    transform: scale(1);
  }
}
#orbit-container image {
  pointer-events: all;
  cursor: pointer;
  z-index: 2;
}

svg image {
  pointer-events: all;
  cursor: pointer;
  z-index: 2;
  border: 20px solid red;
}

.pagination.dots .dot.active {
  width: 30px;
  background-color: #ad0a04;
  opacity: 100;
  z-index: 4;
}

#benefits {
  position:relative;
  z-index: 5;
}

/* .planet {
  transition: transform 3s ease-in-out, left 3s ease-in-out, top 3s ease-in-out;
} */

@keyframes zoomIn {
  0% {
      transform: scale(1);
      opacity: 1;
  }
  100% {
      transform: scale(4);
      opacity: 0;
  }
}
/* .slider-item {
  opacity: 0;
  transform: translateX(100%);
  transition: all 0.5s ease-in-out;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
} */

.slider-item-active {
  opacity: 1;
  transform: translateX(0); 
  z-index: 10;
}
.slider-container {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}


image {
  transform-box: fill-box;
  transform-origin: center center;
  transition: transform 0.3s ease;

}