.ms-header__title {
  flex: 1 1 100%;
  width: 100%;
  text-align: center;
  font-size: 2rem;
  font-weight: bold;
  color: #fff;
  text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.4);
  padding: 40px 0px;
}

.ms-slider {
  display: inline-block;
  height: 80px;
  overflow: hidden;
  vertical-align: middle;
  mask-type: luminance;
  mask-mode: alpha;
  padding: 0px 100px;
}
.ms-slider__words {
  display: inline-block;
  margin: 0;
  padding: 0;
  list-style: none;
  animation-name: wordSlider;
  animation-timing-function: ease-in-out;; /* Changed to linear */
  animation-iteration-count: infinite;
  animation-duration: 20s;
}

.ms-slider__word {
  display: block;
  line-height: 1.4em;
  text-align: center;
  font-size: 1.80rem;
}

@keyframes wordSlider {
  0%, 25% {
    transform: translateY(0%);
  }
  
  27%, 52% {
    transform: translateY(-33%);
  }
  54%, 79% {
    transform: translateY(-66%);
  }
  81%, 100% {
    transform: translateY(0%);
  }
}



.bounce {
  animation: bounce 3s infinite  cubic-bezier(0.445, 0.05, 0.55, 0.95); 
}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-30px);
  }
  60% {
    transform: translateY(-15px);
  }
}

@keyframes floater {
  0% {
    transform: translateY(-4%);
  }
  50% {
    transform: translateY(4%);
  }
  100% {
    transform: translateY(-4%);
  }
}

@keyframes floater2 {
  0% {
    transform: translateY(-6%);
  }
  50% {
    transform: translateY(6%);
  }
  100% {
    transform: translateY(-6%);
  }
}

@keyframes floater3 {
  0% {
    transform: translateY(-8%);
  }
  50% {
    transform: translateY(8%);
  }
  100% {
    transform: translateY(-8%);
  }
}

@keyframes floater4 {
  0% {
    transform: translateY(-5%);
  }
  50% {
    transform: translateY(5%);
  }
  100% {
    transform: translateY(-5%);
  }
}

@keyframes floater5 {
  0% {
    transform: translateY(-7%);
  }
  50% {
    transform: translateY(7%);
  }
  100% {
    transform: translateY(-7%);
  }
}

.floating-1 {
  animation: floater 10s infinite;
}

.floating-2 {
  animation: floater2 10s infinite;
}

.floating-3 {
  animation: floater3 10s infinite;
}

.floating-4 {
  animation: floater4 10s infinite;
}

.floating-5 {
  animation: floater5 10s infinite;
}
.mk-partner-item h4 {
  width: 100%;
  position: absolute;
  top: 94px;
  text-align: center;
}

.navbar-toggler {
  color: #be8c3c !important;
}



.meetussheader {
  display: flex;
  justify-content: center; /* Horizontally center */
  align-items: center; /* Vertically center */

  border-radius: 20px;
  height: 343px;
}

.meetussheader h2 {
  font-size: 8rem;
  text-align: left;
  margin: 0; /* Remove default margins */
  padding: 0; /* Remove default padding */
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  color:#ffffff;
  text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5); /* Add text shadow */
  line-height: 8rem;
}



.meetusslide1,.meetusslide2,.meetusslide3,.meetusslide4,.meetusslide5 {
  position: absolute;
  width: 100%;
  height: 100%;

}
.meetusslide1 {

    animation:fade 15s infinite;
-webkit-animation:fade 15s infinite;

} 
.meetusslide2 {
      
    animation:fade2 15s infinite;
-webkit-animation:fade2 15s infinite;
}
.meetusslide3 {
    animation:fade3 15s infinite;
-webkit-animation:fade3 15s infinite;
}
.meetusslide4 {
  animation:fade4 15s infinite;
-webkit-animation:fade4 15s infinite;
}
.meetusslide5 {
  animation:fade5 15s infinite;
-webkit-animation:fade5 15s infinite;
}
@keyframes fade
{
  0%   {opacity:0}
  20% { opacity: 1}
  40% { opacity: 0}
  60% { opacity: 0}
  80% { opacity: 0}
  100% { opacity: 0}
}
@keyframes fade2
{
  0%   {opacity:0}
  20% { opacity: 0}
  40% { opacity: 1}
  60% { opacity: 0}
  80% { opacity: 0}
  100% { opacity: 0}
}
@keyframes fade3
{
  0%   {opacity:0}
  20% { opacity: 0}
  40% { opacity: 0}
  60% { opacity: 1}
  80% { opacity: 0}
  100% { opacity: 0}
}
@keyframes fade4
{
  0%   {opacity:0}
  20% { opacity: 0}
  40% { opacity: 0}
  60% { opacity: 0}
  80% { opacity: 1}
  100% { opacity: 0}
}
@keyframes fade5
{
  0%   {opacity:0}
  20% { opacity: 0}
  40% { opacity: 0}
  60% { opacity: 0}
  80% { opacity: 0}
  100% { opacity: 1}
}

.digi-service-single img {
  width: 100%;
  background: #ddd;
  border-radius: 10px;
}


@media (min-width: 320px) and (max-width: 767px)
{
  .meetussheader {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 20px;
    height: 130px;
}
.meetussheader h2 {
    font-size: 4rem;
    text-align: left;
    margin: 0;
    padding: 0;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    color: #ffffff;
    text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
    line-height: 4rem;
}

}


/* Ensure you include Swiper's CSS */
/* @import url('https://unpkg.com/swiper/swiper-bundle.min.css'); */

/* Custom styles for Swiper buttons */
.swiper-button-next,
.swiper-button-prev {
  color: #fff; /* Change this to your desired color */
  background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent background */
  border-radius: 50%;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.3s;
  position: static; /* Remove default positioning */
  margin: 0 10px; /* Space between buttons */
}

.swiper-button-next:hover,
.swiper-button-prev:hover {
  background-color: rgba(0, 0, 0, 0.7);
}

.swiper-button-next:after,
.swiper-button-prev:after {
  font-size: 20px;
}

/* Positioning the navigation container */
.swiper-navigation {
  display: flex;
  justify-content: center;
  position: absolute;
  bottom: 10px; /* Adjust as needed */
  left: 50%;
  transform: translateX(-50%);
  width: auto;
  z-index: 10;
}

.swiper-container {
  position: relative;
  padding-bottom: 50px; /* Adjust as needed to make space for navigation */
}