/*!
* Style Sheet for ""
* version: 1
* last modified:2023 By Applab
* author: Applab
* website: www.applab.qa
*/
/*b5 start -------------------------------------------------------------------------------------------------------------------*/
/*b5 end ---------------------------------------------------------------------------------------------------------------------*/
.index-page .banner {
  display: flex;
  position: relative;
  overflow: hidden;
}
.index-page .banner::before {
  position: absolute;
  background-image: url("../../assets/images/banner-icon1.svg");
  background-size: contain;
  background-repeat: no-repeat;
  inset-block-start: 15%;
  inset-inline-start: 6%;
  z-index: 2;
  width: 193px;
  height: 84px;
}
@media (min-width: 1400px) {
  .index-page .banner::before {
    content: "";
  }
}
@media (min-width: 1200px) and (max-width: 1399.98px) {
  .index-page .banner::before {
    content: "";
    transform: scale(0.9);
    inset-block-start: 15%;
    inset-inline-start: 1%;
  }
}
.index-page .banner::after {
  position: absolute;
  background-image: url("../../assets/images/banner-icon2.svg");
  background-size: contain;
  background-repeat: no-repeat;
  inset-block-start: 25%;
  inset-inline-end: -50px;
  z-index: 2;
  width: 162px;
  height: 256px;
}
@media (min-width: 1400px) {
  .index-page .banner::after {
    content: "";
  }
}
@media (min-width: 1200px) and (max-width: 1399.98px) {
  .index-page .banner::after {
    content: "";
    transform: scale(0.9);
  }
}
.index-page .banner .banner-swiper {
  margin-top: auto;
  position: relative;
  width: 100%;
}
.index-page .banner .banner-swiper::after {
  position: absolute;
  background-image: url("../../assets/images/banner-icon3.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: bottom;
  inset-block-end: 0;
  inset-inline-start: 30%;
  z-index: 2;
  width: 208px;
  height: 125px;
}
@media (min-width: 1400px) {
  .index-page .banner .banner-swiper::after {
    content: "";
  }
}
@media (min-width: 1200px) and (max-width: 1399.98px) {
  .index-page .banner .banner-swiper::after {
    content: "";
    transform: scale(0.9);
  }
}
@media (max-width: 575.98px) {
  .index-page .banner .banner-swiper::after {
    content: "";
    width: 81px;
    height: 128px;
    inset-inline-start: 65%;
  }
}
.index-page .banner .banner-swiper .swiper-slide {
  max-height: 1022px;
  background-color: #475E5D;
  min-height: 100vh;
  display: flex;
  align-items: flex-end;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  position: relative;
  z-index: 2;
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  .index-page .banner .banner-swiper .swiper-slide {
    min-height: initial;
    height: 700px;
  }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  .index-page .banner .banner-swiper .swiper-slide {
    min-height: initial;
    height: 600px;
  }
}
@media (min-width: 576px) and (max-width: 767.98px) {
  .index-page .banner .banner-swiper .swiper-slide {
    min-height: initial;
    height: 550px;
  }
}
@media (max-width: 575.98px) {
  .index-page .banner .banner-swiper .swiper-slide {
    min-height: initial;
    height: initial;
    padding-top: 130px;
  }
}
.index-page .banner .banner-swiper .swiper-slide .banner-content {
  padding: 50px 0 100px 0;
  color: #fff;
  position: relative;
}
@media (max-width: 575.98px) {
  .index-page .banner .banner-swiper .swiper-slide .banner-content {
    padding: 0 0 75px 0;
    margin-bottom: 25px;
  }
}
.index-page .banner .banner-swiper .swiper-slide .banner-content h1 {
  font-size: 96px;
  color: #F3D37A;
}
[dir=rtl] .index-page .banner .banner-swiper .swiper-slide .banner-content h1 {
  font-size: 80px;
}
@media (min-width: 1200px) and (max-width: 1399.98px) {
  [dir=rtl] .index-page .banner .banner-swiper .swiper-slide .banner-content h1 {
    font-size: 70px;
  }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  [dir=rtl] .index-page .banner .banner-swiper .swiper-slide .banner-content h1 {
    font-size: 65px;
  }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  [dir=rtl] .index-page .banner .banner-swiper .swiper-slide .banner-content h1 {
    font-size: 45px;
  }
}
@media (min-width: 576px) and (max-width: 767.98px) {
  [dir=rtl] .index-page .banner .banner-swiper .swiper-slide .banner-content h1 {
    font-size: 35px;
  }
}
@media (max-width: 575.98px) {
  [dir=rtl] .index-page .banner .banner-swiper .swiper-slide .banner-content h1 {
    font-size: 30px;
  }
}
@media (min-width: 1200px) and (max-width: 1399.98px) {
  .index-page .banner .banner-swiper .swiper-slide .banner-content h1 {
    font-size: 75px;
  }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  .index-page .banner .banner-swiper .swiper-slide .banner-content h1 {
    font-size: 75px;
  }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  .index-page .banner .banner-swiper .swiper-slide .banner-content h1 {
    font-size: 50px;
  }
}
@media (min-width: 576px) and (max-width: 767.98px) {
  .index-page .banner .banner-swiper .swiper-slide .banner-content h1 {
    font-size: 40px;
  }
}
@media (max-width: 575.98px) {
  .index-page .banner .banner-swiper .swiper-slide .banner-content h1 {
    font-size: 35px;
  }
}
.index-page .banner .banner-swiper .swiper-slide .banner-content h1 span {
  color: #fff;
}
.index-page .banner .banner-swiper .swiper-slide .banner-content p {
  font-size: 24px;
}
@media (min-width: 1200px) and (max-width: 1399.98px) {
  .index-page .banner .banner-swiper .swiper-slide .banner-content p {
    font-size: 22px;
  }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  .index-page .banner .banner-swiper .swiper-slide .banner-content p {
    font-size: 20px;
  }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  .index-page .banner .banner-swiper .swiper-slide .banner-content p {
    font-size: 18px;
  }
}
@media (min-width: 576px) and (max-width: 767.98px) {
  .index-page .banner .banner-swiper .swiper-slide .banner-content p {
    font-size: 18px;
  }
}
@media (max-width: 575.98px) {
  .index-page .banner .banner-swiper .swiper-slide .banner-content p {
    font-size: 16px;
  }
}
.index-page .banner .banner-swiper .swiper-slide .banner-image img {
  max-height: 80vh;
  margin-inline-start: auto;
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  .index-page .banner .banner-swiper .swiper-slide .banner-image img {
    max-height: 500px;
  }
}
@media (min-width: 576px) and (max-width: 767.98px) {
  .index-page .banner .banner-swiper .swiper-slide .banner-image img {
    max-height: 400px;
  }
}
.index-page .banner .banner-swiper .swiper-button-next,
.index-page .banner .banner-swiper .swiper-button-prev {
  inset-block-end: 0 !important;
  inset-block-start: auto;
  inset-block-end: auto;
  inset-inline-start: auto;
  inset-inline-end: auto;
  margin: 0;
  transform: none;
  background-color: #ffffff;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  position: absolute;
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  .index-page .banner .banner-swiper .swiper-button-next,
  .index-page .banner .banner-swiper .swiper-button-prev {
    inset-block-end: 25px !important;
  }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  .index-page .banner .banner-swiper .swiper-button-next,
  .index-page .banner .banner-swiper .swiper-button-prev {
    inset-block-end: 25px !important;
  }
}
@media (min-width: 576px) and (max-width: 767.98px) {
  .index-page .banner .banner-swiper .swiper-button-next,
  .index-page .banner .banner-swiper .swiper-button-prev {
    inset-block-end: 25px !important;
  }
}
@media (max-width: 575.98px) {
  .index-page .banner .banner-swiper .swiper-button-next,
  .index-page .banner .banner-swiper .swiper-button-prev {
    width: 40px;
    height: 40px;
  }
}
.index-page .banner .banner-swiper .swiper-button-next::after,
.index-page .banner .banner-swiper .swiper-button-prev::after {
  display: none;
}
.index-page .banner .banner-swiper .swiper-button-next::before,
.index-page .banner .banner-swiper .swiper-button-prev::before {
  position: absolute;
  inset-block-start: 50%;
  inset-inline-start: 50%;
  transform: translate(-50%, -50%);
  -webkit-mask-image: url("../../assets/images/arrow-theme.svg");
          mask-image: url("../../assets/images/arrow-theme.svg");
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  content: "";
  width: 30%;
  height: 30%;
  background-color: #475E5D;
}
[dir=rtl] .index-page .banner .banner-swiper .swiper-button-next::before,
[dir=rtl] .index-page .banner .banner-swiper .swiper-button-prev::before {
  transform: translate(50%, -50%);
}
.index-page .banner .banner-swiper .swiper-button-next {
  inset-inline-start: 75px !important;
}
[dir=rtl] .index-page .banner .banner-swiper .swiper-button-next {
  transform: scale(-1);
}
@media (max-width: 575.98px) {
  .index-page .banner .banner-swiper .swiper-button-next {
    inset-inline-start: 50px !important;
  }
}
.index-page .banner .banner-swiper .swiper-button-prev {
  inset-inline-start: 0 !important;
  transform: scale(-1);
}
[dir=rtl] .index-page .banner .banner-swiper .swiper-button-prev {
  transform: scale(1);
}
@media (max-width: 575.98px) {
  .index-page .index-about-warif .about-block .row {
    flex-direction: column-reverse;
  }
}
.index-page .index-about-warif .about-block .text-content h2 {
  font-size: 64px;
  color: #475E5D;
}
[dir=rtl] .index-page .index-about-warif .about-block .text-content h2 {
  font-size: 56px;
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  [dir=rtl] .index-page .index-about-warif .about-block .text-content h2 {
    font-size: 43px;
  }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  [dir=rtl] .index-page .index-about-warif .about-block .text-content h2 {
    font-size: 37px;
  }
}
@media (min-width: 576px) and (max-width: 767.98px) {
  [dir=rtl] .index-page .index-about-warif .about-block .text-content h2 {
    font-size: 30px;
  }
}
@media (max-width: 575.98px) {
  [dir=rtl] .index-page .index-about-warif .about-block .text-content h2 {
    font-size: 22px;
  }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  .index-page .index-about-warif .about-block .text-content h2 {
    font-size: 50px;
  }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  .index-page .index-about-warif .about-block .text-content h2 {
    font-size: 40px;
  }
}
@media (min-width: 576px) and (max-width: 767.98px) {
  .index-page .index-about-warif .about-block .text-content h2 {
    font-size: 40px;
  }
}
@media (max-width: 575.98px) {
  .index-page .index-about-warif .about-block .text-content h2 {
    font-size: 25px;
  }
}
.index-page .index-about-warif .about-block:nth-child(odd) {
  padding-top: 50px;
}
@media (max-width: 575.98px) {
  .index-page .index-about-warif .about-block:nth-child(odd) {
    padding-top: 0;
  }
}
.index-page .index-about-warif .about-block:nth-child(odd) .row {
  flex-direction: row-reverse;
}
@media (max-width: 575.98px) {
  .index-page .index-about-warif .about-block:nth-child(odd) .row {
    flex-direction: column-reverse;
  }
}
.index-page .upcoming-events {
  background-color: #fdfbf2;
  margin: 75px 0 0 0;
}
.index-page .upcoming-events .upcoming-events-inner {
  padding: 50px 0 40px 0;
  position: relative;
}
.index-page .upcoming-events .upcoming-events-inner::before {
  position: absolute;
  inset-block-start: 0;
  inset-inline-end: 0;
  transform: translateY(-40%);
  width: 329px;
  height: 127px;
  background-image: url("../../assets/images/upcoming-event-icon.svg");
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
}
@media (min-width: 1400px) {
  .index-page .upcoming-events .upcoming-events-inner::before {
    content: "";
  }
}
@media (min-width: 1200px) and (max-width: 1399.98px) {
  .index-page .upcoming-events .upcoming-events-inner::before {
    content: "";
  }
}
.index-page .upcoming-events .event-blocks {
  margin-top: 20px;
}
.index-page .upcoming-events .event-blocks .event-item {
  margin-top: 20px;
}
.index-page .upcoming-events .event-blocks .event-item .event-image {
  border-radius: 24px;
  overflow: hidden;
  margin-block-end: 16px;
}
.index-page .upcoming-events .event-blocks .event-item .event-details .title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 48px;
}
@media (max-width: 575.98px) {
  .index-page .upcoming-events .event-blocks .event-item .event-details .title {
    -webkit-line-clamp: initial;
    min-height: auto;
  }
}
.index-page .upcoming-events .event-blocks .event-item .event-details .date-time,
.index-page .upcoming-events .event-blocks .event-item .event-details .location {
  position: relative;
  padding-inline-start: 36px;
  min-height: 24px;
  margin-bottom: 16px;
}
.index-page .upcoming-events .event-blocks .event-item .event-details .date-time img,
.index-page .upcoming-events .event-blocks .event-item .event-details .location img {
  position: absolute;
  inset-inline-start: 0;
  inset-block-start: 0;
}
.index-page .index-news {
  padding-bottom: 75px;
}
.index-page .index-news .news-blocks .news-item {
  margin-top: 25px;
}
.index-page .index-news .news-blocks .news-item .news-details .date {
  font-size: 12px;
  margin-bottom: 5px;
}
.index-page .index-news .news-blocks .news-item .news-details .title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 48px;
}
@media (max-width: 575.98px) {
  .index-page .index-news .news-blocks .news-item .news-details .title {
    -webkit-line-clamp: initial;
    min-height: auto;
  }
}
.index-page .index-news .news-blocks .news-item .news-image {
  border-radius: 24px;
  overflow: hidden;
}