.elementor-widget-slides .elementor-slide-heading{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-slides .elementor-slide-description{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-slides .elementor-slide-button{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-1604 .elementor-element.elementor-element-e839ac9 .elementor-repeater-item-b8518b0 .swiper-slide-bg{background-color:#E7E7E7;background-image:url(https://routesnrootstravels.com/wp-content/uploads/2026/08/WhatsApp-Image-2026-08-31-at-10.20.04-PM.jpeg);background-size:cover;}.elementor-1604 .elementor-element.elementor-element-e839ac9 .elementor-repeater-item-05d3a5b .swiper-slide-bg{background-color:#C3C3C3;background-image:url(https://routesnrootstravels.com/wp-content/uploads/2026/07/WhatsApp-Image-2026-07-20-at-8.22.37-PM.jpeg);background-size:cover;}.elementor-1604 .elementor-element.elementor-element-e839ac9 .swiper-slide{height:380px;transition-duration:calc(5000ms*1.2);}.elementor-1604 .elementor-element.elementor-element-e839ac9 .swiper-slide-contents{max-width:65%;}.elementor-1604 .elementor-element.elementor-element-e839ac9 .swiper-slide-inner{padding:32px 32px 32px 32px;text-align:center;}.elementor-1604 .elementor-element.elementor-element-c08c674{--display:flex;--flex-direction:column-reverse;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;--gap:3px 0px;--row-gap:3px;--column-gap:0px;--background-transition:0.3s;--margin-top:-31px;--margin-bottom:7px;--margin-left:7px;--margin-right:7px;--z-index:1;}.elementor-1604 .elementor-element.elementor-element-c08c674:hover{background-color:transparent;background-image:linear-gradient(180deg, #FFFFFF 0%, #f2295b 100%);}.elementor-widget-form .elementor-field-group > label, .elementor-widget-form .elementor-field-subgroup label{color:var( --e-global-color-text );}.elementor-widget-form .elementor-field-group > label{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-form .elementor-field-type-html{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-form .elementor-field-group .elementor-field{color:var( --e-global-color-text );}.elementor-widget-form .elementor-field-group .elementor-field, .elementor-widget-form .elementor-field-subgroup label{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-form .elementor-button{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-form .e-form__buttons__wrapper__button-next{background-color:var( --e-global-color-accent );}.elementor-widget-form .elementor-button[type="submit"]{background-color:var( --e-global-color-accent );}.elementor-widget-form .e-form__buttons__wrapper__button-previous{background-color:var( --e-global-color-accent );}.elementor-widget-form .elementor-message{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-form .e-form__indicators__indicator, .elementor-widget-form .e-form__indicators__indicator__label{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-form{--e-form-steps-indicator-inactive-primary-color:var( --e-global-color-text );--e-form-steps-indicator-active-primary-color:var( --e-global-color-accent );--e-form-steps-indicator-completed-primary-color:var( --e-global-color-accent );--e-form-steps-indicator-progress-color:var( --e-global-color-accent );--e-form-steps-indicator-progress-background-color:var( --e-global-color-text );--e-form-steps-indicator-progress-meter-color:var( --e-global-color-text );}.elementor-widget-form .e-form__indicators__indicator__progress__meter{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-1604 .elementor-element.elementor-element-c744aab .elementor-field-group{padding-right:calc( 14px/2 );padding-left:calc( 14px/2 );margin-bottom:11px;}.elementor-1604 .elementor-element.elementor-element-c744aab .elementor-form-fields-wrapper{margin-left:calc( -14px/2 );margin-right:calc( -14px/2 );margin-bottom:-11px;}.elementor-1604 .elementor-element.elementor-element-c744aab .elementor-field-group.recaptcha_v3-bottomleft, .elementor-1604 .elementor-element.elementor-element-c744aab .elementor-field-group.recaptcha_v3-bottomright{margin-bottom:0;}body.rtl .elementor-1604 .elementor-element.elementor-element-c744aab .elementor-labels-inline .elementor-field-group > label{padding-left:8px;}body:not(.rtl) .elementor-1604 .elementor-element.elementor-element-c744aab .elementor-labels-inline .elementor-field-group > label{padding-right:8px;}body .elementor-1604 .elementor-element.elementor-element-c744aab .elementor-labels-above .elementor-field-group > label{padding-bottom:8px;}.elementor-1604 .elementor-element.elementor-element-c744aab .elementor-field-type-html{padding-bottom:0px;}.elementor-1604 .elementor-element.elementor-element-c744aab .elementor-field-group .elementor-field:not(.elementor-select-wrapper){background-color:#ffffff;}.elementor-1604 .elementor-element.elementor-element-c744aab .elementor-field-group .elementor-select-wrapper select{background-color:#ffffff;}.elementor-1604 .elementor-element.elementor-element-c744aab .elementor-button{border-style:solid;border-width:-7px -7px -7px -7px;border-radius:17px 17px 17px 17px;padding:12px 12px 12px 12px;}.elementor-1604 .elementor-element.elementor-element-c744aab .e-form__buttons__wrapper__button-next{background-color:#ED6C3B;color:#ffffff;border-color:#FFFFFF;transition-duration:500ms;}.elementor-1604 .elementor-element.elementor-element-c744aab .elementor-button[type="submit"]{background-color:#ED6C3B;color:#ffffff;border-color:#FFFFFF;transition-duration:500ms;}.elementor-1604 .elementor-element.elementor-element-c744aab .elementor-button[type="submit"] svg *{fill:#ffffff;transition-duration:500ms;}.elementor-1604 .elementor-element.elementor-element-c744aab .e-form__buttons__wrapper__button-previous{background-color:#5BDA6D;color:#ffffff;transition-duration:500ms;}.elementor-1604 .elementor-element.elementor-element-c744aab .e-form__buttons__wrapper__button-next:hover{background-color:#C47C29;color:#ffffff;}.elementor-1604 .elementor-element.elementor-element-c744aab .elementor-button[type="submit"]:hover{background-color:#C47C29;color:#ffffff;}.elementor-1604 .elementor-element.elementor-element-c744aab .elementor-button[type="submit"]:hover svg *{fill:#ffffff;}.elementor-1604 .elementor-element.elementor-element-c744aab .e-form__buttons__wrapper__button-previous:hover{color:#ffffff;}.elementor-1604 .elementor-element.elementor-element-c744aab .elementor-message{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-1604 .elementor-element.elementor-element-c744aab{--e-form-steps-indicators-spacing:20px;--e-form-steps-indicator-inactive-secondary-color:#ffffff;--e-form-steps-indicator-active-secondary-color:#ffffff;--e-form-steps-indicator-completed-secondary-color:#ffffff;--e-form-steps-divider-width:1px;--e-form-steps-divider-gap:10px;}@media(max-width:767px){.elementor-1604 .elementor-element.elementor-element-e839ac9 .swiper-slide{height:200px;}.elementor-1604 .elementor-element.elementor-element-e839ac9 .swiper-slide-contents{max-width:200%;}.elementor-1604 .elementor-element.elementor-element-e839ac9 .swiper-slide-inner{padding:0px 0px 0px 0px;}}/* Start custom CSS */<style>
.routes-slider {
  position: relative;
  width: 100%;
  height: 550px;
  overflow: hidden;
  border-radius: 0px;
}

.routes-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.routes-slide.active {
  opacity: 1;
}

.routes-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.routes-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(0,0,0,0.65),
    rgba(0,0,0,0.15)
  );
}

.routes-content {
  position: absolute;
  top: 50%;
  left: 8%;
  transform: translateY(-50%);
  color: #fff;
  max-width: 600px;
  z-index: 5;
}

.routes-content h1 {
  font-size: 52px;
  line-height: 1.1;
  margin: 0 0 15px;
  font-weight: 700;
}

.routes-content p {
  font-size: 20px;
  margin-bottom: 25px;
}

.routes-btn {
  display: inline-block;
  padding: 14px 28px;
  background: #D4AF37;
  color: #ffffff;
  text-decoration: none;
  border-radius: 5px;
  font-weight: 600;
  transition: 0.3s;
}

.routes-btn:hover {
  background: #ffffff;
  color: #0D005D;
}

/* Mobile */
@media (max-width: 767px) {
  .routes-slider {
    height: 500px;
  }

  .routes-content {
    left: 6%;
    right: 6%;
  }

  .routes-content h1 {
    font-size: 34px;
  }

  .routes-content p {
    font-size: 16px;
  }
}
</style>

<div class="routes-slider">

  <!-- Slide 1 -->
  <div class="routes-slide active">
    <img src="https://yourwebsite.com/image1.jpg" alt="Tempo Traveller in Bangalore">
    <div class="routes-overlay"></div>

    <div class="routes-content">
      <h1>Tempo Traveller in Bangalore</h1>
      <p>Comfortable group travel starts here.</p>
      <a href="/contact-us/" class="routes-btn">Book Now</a>
    </div>
  </div>

  <!-- Slide 2 -->
  <div class="routes-slide">
    <img src="https://yourwebsite.com/image2.jpg" alt="Airport Taxi in Bangalore">
    <div class="routes-overlay"></div>

    <div class="routes-content">
      <h1>Airport Taxi in Bangalore</h1>
      <p>Reliable airport transfers available 24/7.</p>
      <a href="/contact-us/" class="routes-btn">Book Now</a>
    </div>
  </div>

  <!-- Slide 3 -->
  <div class="routes-slide">
    <img src="https://yourwebsite.com/image3.jpg" alt="Outstation Travel">
    <div class="routes-overlay"></div>

    <div class="routes-content">
      <h1>Outstation Travel</h1>
      <p>Travel comfortably with Routes N Roots Travels.</p>
      <a href="/contact-us/" class="routes-btn">Get Quote</a>
    </div>
  </div>

</div>

<script>
document.addEventListener("DOMContentLoaded", function () {

  const slides = document.querySelectorAll(".routes-slide");
  let currentSlide = 0;

  setInterval(function () {

    slides[currentSlide].classList.remove("active");

    currentSlide++;

    if (currentSlide >= slides.length) {
      currentSlide = 0;
    }

    slides[currentSlide].classList.add("active");

  }, 5000);

});
</script>/* End custom CSS */