.rotator-area ul
 {
    display: flex;
    gap: 1rem;
}
    .rotator-area ul li
 {
    list-style: none;
}
    .rotator-area ul li img
 {
   border-radius: 15px;
   width: 130px;
}

 .step-row {
    display: flex;
    flex-wrap: wrap;
    gap: 4rem; 
  }
  .step-col {
    flex: 1 1 calc(50% - 2rem); 
  }

  @media (max-width: 767.98px) {
    .step-col {
      flex: 1 1 100%; /* full width on mobile */
    }
  }
    @media (min-width: 991px) {
      @keyframes flashHighlight {
  0%   { background-color: #eafbfd; border-radius: 12px; }
  50%  { background-color: #ccf2f4; border-radius: 12px; }
  100% { background-color: transparent; border-radius: 12px; }
}

.flash-highlight {
  animation: flashHighlight 1.5s ease-out;
  border-radius: 15px;
}

 .scrollable-col {
  overflow: visible !important;
  height: auto !important;
}
  }

/* Custom scrollbar style */
.scrollable-col::-webkit-scrollbar {
  width: 8px;
}
.scrollable-col::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 4px;
}
.scrollable-col::-webkit-scrollbar-thumb {
  background: #888;
  border-radius: 4px;
}
.scrollable-col::-webkit-scrollbar-thumb:hover {
  background: #555;
}

/* Highlight active link */
.intro-group a.intro-active {
  font-weight: bold;
}
.intro-group a{
  font-size: 18px;
}
.intro-group h4{
  font-size: 24px;
  color: #000;
  font-weight: bold;
}
.intro-group,
.faq-group,
.tour-group{
    display: flex;
    flex-direction: column;
    gap:10px;
    padding: 8px;
}

.intro-group{
position: sticky;
top: 15rem;
}

.intro-group,
.faq-group,

.right-box h4{
    font-size: 12px;
    color: #737373;
}

.right-box a{
    font: 400 16px/normal 'geist';
    color: black;
}

.tour-group h2{
    color: black;
    font-weight: 600;
}

.tour-group {
    width: 240px;
    padding: 15px;
    background-color: #F8F8F8;
    border-radius: 20px;
}

.tour-view-p{
    background-color: black;
    color: white;
    font-weight: 300px;
    padding: 8px;
    margin-top: -4px;
    text-align: center;
    border-radius: 50px;
}
  .active {
  background-color: lightblue;
  padding: 5px;
  border-radius: 8px;
  font: 800 16px/italic 'geist';
  color: white;
}

/* Special yellow highlight for Introduction link */
.intro-active {
  background-color: #F5F5F5;
  padding: 5px;
  border-radius: 8px;
  font: 800 16px/italic 'geist';
  color: black;
}
p, li{
  font-size: 16px !important;
}
 
     .homepage-area-v3 {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  }
  
/* specific site style */
.banner-rotator-v3 .rotator-area ul
 {
   margin-left: 0 !important;
}
   .banner-rotator-v3-bg
 {
        margin-top: 1rem !important;
    }
    .accordion button.accordion-button{
      font-size: 17px;
      background-color: transparent !important;
    }
    .accordion button.accordion-button:hover{
      background-color:#F5F5F5 !important;
    }
  .tour-group h2{
      font-size: 18px !important;
    }
    .tour-group p{
      font-size: 12px !important;
    }
    .banner-container
    {
    margin-top: 5px !important;
    }
 

    @media screen and (max-width:1600px) {
      .new-homepage-body{
        max-width: 1400px !important;
      }
      .banner-rotator-v3 .rotator-area ul li a img
      {
    width: 100px !important;
    }
    figure.has-yt-play-btn
      {
        max-width: 360px !important;
        }
    }

        @media screen and (max-width:1400px) {
           .rotator-area ul
        {
      gap: 0;
        }
      .banner-rotator-v3 .rotator-area ul li a img
      {
    width: 90px !important;
    }
    .banner-rotator-v3 .rotator-area ul {
    margin-left: 30px !important;
}
    }

    @media screen and (max-width: 1250px) {
    .banner-rotator-v3-bg .banner-rotator-v3 .rotator-area ul li a img {
        width: 85px !important;
    }
    figure.has-yt-play-btn {
        max-width: 310px !important;
    }
    .banner-content-v3 .banner-text p {
    display: none !important;
}
  }


  @media screen and (max-width: 1024px) {
       .banner-rotator-v3-bg .banner-rotator-v3 .rotator-area ul li a img
 {
        width: 75px !important;
        border-radius: 50%;
        height: 75px !important;
        object-fit: cover;
    }
    .scrollable-col{
      padding: 0 2rem !important;
    }
    .tour-group h2{
      font-size: 18px !important;
    }
    .tour-group p{
      font-size: 12px !important;
    }
    .tour-group
 {
    width: 210px !important;
}
  .tour-view-p {
    font-size: 12px !important;
  }
  }

  @media screen and (max-width: 991px) {
       .banner-rotator-v3-bg{
        margin-top: -2rem !important;
       }
  }
    @media screen and (max-width: 576px) {
      #introduction h1{
        font-size: 23px !important;
      }
      figure.has-yt-play-btn
 {
    margin: 0 auto !important;
    float: none !important;
    max-width: 100% !important;
}
    .col-12.col-lg-10.scrollable-col
  {
      padding: 0 !important;
  }
     .step-row p{
      line-height: 1.5em !important;
    }

  }

@media only screen and (max-width: 506px) {
   .video-wrap .video iframe {
        max-width: 100%;
        max-height: 100%;
        width: revert-layer !important;
        height: 230px !important;
    }
}

@media only screen and (max-width: 375px) {
     .banner-rotator-v3-bg .banner-rotator-v3 .rotator-area ul li a img
    {
        width: 60px !important;
        height: 60px !important;
    }
        #introduction h1
 {
        font-size: 20px !important;
    }

}