/* Style the modal background overlay */
.modal-backdrop {
  background-color: rgba(0, 0, 0, 0.5);
}

/* Style the modal container */
.modal-dialog {
  max-width: 800px; /* Adjust the maximum width as needed */
}

/* Style the modal title */
.modal-title {
  color: #333;
}

/* Style the modal body */
.modal-body {
  background-color: #f9f9f9;
  padding: 20px;
}

/* Style the balloon container */
.balloon-container {
  position: relative;
  /* height: 300px; Adjust the height as needed */
}

/* Style the balloons */
.balloon {
  position: absolute;
  background: url(../img/images1.png); /* Adjust the path to your balloon image */
  pointer-events: none;
  background-size: cover;
  transform: translate(-50%, -50%);
  animation: animate 2s linear infinite;
}

/* Keyframes for balloon animation */
@keyframes animate {
  0% {
    transform: translate(-50%, -50%);
    opacity: 1;
    filter: hue-rotate(0deg);
    top: 0;
  }
  100% {
    transform: translate(-50%, 100vh);
    opacity: 0;
    filter: hue-rotate(720deg);
    top: 100vh;
  }
}
