:root{
  --swiper-pagination-bullet-size : 15px;
}
@font-face {
  font-family: ArabicFont;
  src:  url("./fonts/alfont_com_SST-Arabic-Medium.3ddca43f8f09.ttf") format('truetype');
}
ul {
  list-style-type: initial;
  margin-top: 1rem;
  margin-bottom: 1rem;
  padding-left:1.5rem;
  padding-right:1.5rem;
}
.description-border:before {
    content : "";
    position: absolute;
    left    : 0;
    bottom  : 0;
    height  : 2px;
    width   : 3rem;  
    border-bottom:2px solid #60A3F8;
  }
  .TIMELINE:before {
    content : "";
    position: absolute;
    bottom  : 0;
    height  : 2px;
    width   : 3rem;  
    border-bottom:2px solid  #1E40AD;
  }
  @media only screen and (min-width: 1888px) {
    .blog-in-home-max-width {
     max-width: 100rem!important;
    }
  }
  h2{
    padding-top: 0.25rem;
    padding-bottom:0.25rem;
  }
.product-journey-quarter-body-height {
  height: calc(100vh - 3.5rem);
}
@keyframes zoom-in {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
  .popup {
    animation: zoom-in 0.3s;
  }
  .carousel-open:checked + .carousel-item {
    position: static;
    opacity: 100;
  }
  .carousel-item {
    -webkit-transition: opacity 0.6s ease-out;
    transition: opacity 0.6s ease-out;
  }
  #carousel-1:checked ~ .control-1,
  #carousel-2:checked ~ .control-2,
  #carousel-3:checked ~ .control-3 {
    display: block;
  }
  .richtext p {
    padding-bottom: 1rem!important;
  }
  .richtext ul {
    margin-top: 0px!important;
  }
  .carousel-indicators {
    list-style: none;
    margin: 0;
    padding: 0;
    position: absolute;
    bottom: 2%;
    left: 0;
    right: 0;
    text-align: center;
    z-index: 10;
  }
  #carousel-1:checked ~ .control-1 ~ .carousel-indicators li:nth-child(1) .carousel-bullet,
  #carousel-2:checked ~ .control-2 ~ .carousel-indicators li:nth-child(2) .carousel-bullet,
  #carousel-3:checked ~ .control-3 ~ .carousel-indicators li:nth-child(3) .carousel-bullet {
    color: #2b6cb0;  /*Set to match the Tailwind colour you want the active one to be */
  }

  .dropdown:hover .dropdown-menu {
    display: block;
  }

.clickable {
    cursor: pointer;
  }

  .smallwidth {
    animation-name: smallwidth;
  }
  .logodiv {
    animation-duration: 3s;
    /* animation-iteration-count: 3; */
    animation-timing-function: linear;
  }
  @keyframes smallwidth {
    from {
      width: 8rem;
    }
  
    to {
      width: 4rem;
    }
  }

  .break {
    flex-basis: 100%;
    height: 0;
  }
.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after {
  content: ''!important;
}
.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after {
  content: ''!important;
}
.iti--allow-dropdown{
  width: 100%;
}
.swiper-button-next svg, .swiper-button-prev svg {
  width: auto!important;
  height: auto!important;
  object-fit: contain;
  transform-origin: center;
}
.w-75percent {
  width: 75%!important;
}
.swiper-slide {
  height: auto;
}
.loader {
  position: fixed;
  top: 0;
  right: 0;
  width: 10px; /* Adjust width as needed */
  height: 0;
  background: #22C55E; /* Example style */
  z-index: 9999;
}
.tooltip {
  position: relative;
  display: inline-block;
  cursor: pointer;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: #555;
  color: #fff;
  text-align: center;
  padding: 5px 0;
  border-radius: 6px;
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: -60px;
  opacity: 0;
  transition: opacity 0.3s;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}