/* Rotating Text Animation CSS */

/* Footer Form Control Spacing */
.footer-form .wpcf7-form-control-wrap{
  margin-right: 12px;
}

/* Rotating Text Animation */
.rotating-text {
  display: inline-block;
  overflow: hidden;
  height: 1.5em; /* same as line height of your text */
  vertical-align: bottom;
}

.rotating-text span {
  display: block;
  animation: slideUp 8s infinite;
}

@keyframes slideUp {
  0%, 15% { transform: translateY(0%); }
  20%, 35% { transform: translateY(-100%); }
  40%, 55% { transform: translateY(-200%); }
  60%, 75% { transform: translateY(-300%); }
  80%, 95% { transform: translateY(-400%); }
  100% { transform: translateY(0%); } /* Show the 5th text before looping */
}

/* Responsive adjustments for rotating text */
@media (max-width: 768px) {
  .rotating-text {
    height: 1.2em; /* Slightly smaller on mobile */
  }
}


/* Rotating Text Animation */
.rotating-text-4 {
  display: inline-block;
  overflow: hidden;
  height: 1.5em; /* same as line height of your text */
  vertical-align: bottom;
}

.rotating-text-4 span {
  display: block;
  animation: slideUp-4 8s infinite;
}

@keyframes slideUp-4 {
  0%, 15% { transform: translateY(0%); }
  20%, 35% { transform: translateY(-100%); }
  40%, 55% { transform: translateY(-200%); }
  60%, 75% { transform: translateY(-300%); }
  /* 80%, 95% { transform: translateY(-400%); } */
  100% { transform: translateY(0%); } /* Show the 5th text before looping */
}

/* Responsive adjustments for rotating text */
@media (max-width: 768px) {
  .rotating-text-4 {
    height: 1.2em; /* Slightly smaller on mobile */
  }
}