/*All items*/
@font-face {
  font-family: Somar-Medium;
  src: url("../Fonts/Somar-Medium.otf");
}
@font-face {
  font-family: Somar-Light;
  src: url("../Fonts/Somar-Light.otf");
}
@font-face {
  font-family: Somar-Regular;
  src: url("../Fonts/Somar-Regular.otf");
}
@font-face {
  font-family: SomarSans-Bold;
  src: url("../Fonts/SomarSans-Bold.ttf");
}
@font-face {
  font-family: SomarSans-ExtraBold;
  src: url("../Fonts/SomarSans-ExtraBoldCondensed.ttf");
}
@font-face {
  font-family: SomarSans-SemiBold;
  src: url("../Fonts/SomarSans-SemiBoldExpanded.ttf");
}
* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.almarai-light {
  font-family: "Almarai", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.almarai-regular {
  font-family: "Almarai", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.almarai-bold {
  font-family: "Almarai", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.almarai-extrabold {
  font-family: "Almarai", sans-serif;
  font-weight: 800;
  font-style: normal;
}

ul {
  list-style: none;
}
li a {
  color: #fff;
  text-decoration: none;
}
/*/////////////////////////////////////////////////////////INDEX PAGE ////////////////////////////////////////////////////////////////////////////////////////////*/
/*All items*/

/*Header*/
.header {
  background: -o-radial-gradient(center, circle, #e84354 0%, #8c1320 50%);
  background: radial-gradient(circle at center, #e84354 0%, #8c1320 50%);
  font-family: Somar-Regular;
  font-size: 18px;
  .nav-item a {
    color: #fff;
    font-size: 20px;
  }
  .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; /* Set the height to 100% */
    background-image: url("../imgs/Vector.png");
  }

  .item:hover {
    border-bottom: 5px solid #fb8d1a;
    font-size: 18px;
  }
  i {
    color: #fff;
  }
  .custom-toggler.navbar-toggler {
    outline: none;
    border-color: white;
  }
  .custom-toggler .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255,1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
  }
}
/*Header*/

/*Hero*/
@media (max-width: 991.98px) {
  .Hero {
    /*Text Area*/
    .TextArea {
      .Hero_text {
        font-size: 54px;
        span {
          font-size: 33px;
        }
      }
      .uderline {
        width: 30%;
      }
      .subtitle {
        font-size: 20px;
      }
      .decription {
        font-size: 18px;
      }
    }
    /*Text Area*/
    .swiper-pagination {
      top: 90% !important;
    }
  }
}

@media (min-width: 992px) {
  .Hero {
    /*Text Area*/
    .TextArea {
      .Hero_text {
        font-size: 64px;
        span {
          font-size: 66px;
        }
      }
      .uderline {
        width: 12%;
      }
      .subtitle {
        font-size: 29px;
      }
      .decription {
        font-size: 20px;
      }
    }
    /*Text Area*/
    .swiper-pagination {
      top: 86% !important;
    }
  }
}

.Hero {
  .swiper-slide {
    position: relative;
    background-image: url("../imgs/Hero.jpg");
    width: 100% !important;
    background-repeat: no-repeat;
    background-size: cover;
    -o-object-fit: contain;
    object-fit: contain;
    height: 840px;
  }
  .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; /* Set the height to 100% */
    background-color: rgba(0, 0, 0, 0.8);
    z-index: -1;
  }
  .slide-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%; /* Cover the entire slide */
    height: 100%; /* Cover the entire slide */
    -o-object-fit: cover;
    object-fit: cover; /* Ensure the video covers the entire slide */
    z-index: -1;
  }
  /*Text Area*/
  .TextArea {
    .Hero_text {
      font-family: SomarSans-ExtraBold;
      letter-spacing: 1rem;
      span {
        font-family: Somar-Light;
      }
    }
    .uderline {
      border-radius: 5px;
      height: 7px;
      background-color: #210d9c;
    }
    .subtitle {
      word-spacing: 10px;
      letter-spacing: 1rem;
      font-size: 32px;
      font-family: Somar-Regular;
    }
    .decription {
      font-family: Somar-Regular;
      font-size: 30px;
      background-color: rgba(0, 0, 0, 0.6);
    }
  }
  /*Text Area*/

  .btn-more {
    background-color: #8c1320;
    color: #fff;
    border-radius: 50px;
    font-size: 15px;
    border: 4px solid rgba(250, 250, 250, 1);
    padding: 0 38px;
    outline: none;
  }
  .btn-more:hover {
    background-color: #8c1320;
    border: 4px solid rgba(250, 250, 250, 1);
    color: #fff;
    outline: none;
  }
  .swiper-pagination {
    position: absolute;
  }
  .swiper-pagination-bullet {
    background: white;
    border-radius: 20px;
    width: 40px;
  }
}
/*Hero*/

/*leadership*/
.leadership {
  margin-bottom: 6rem;
  .admin {
    background-color: #8c1320;
    color: #fff;
    border-radius: 50px;
    font-size: 15px;
    border: 4px solid rgba(250, 250, 250, 1);
    padding: 0px 38px;
    outline: none;
    cursor: pointer;
  }
  .admin:hover {
    color: #fff;
  }
  .Title {
    h1 {
      font-family: SomarSans-Bold;
    }
    .titleImg {
      img {
        height: 35px;
      }
    }
  }

  .leaders {
    .leader {
      position: relative;

      .info {
        font-family: Somar-Medium;
        p {
          font-size: 30px;
        }
        span {
          font-size: 24px;
          color: #be2233;
        }
      }

      .underling {
        height: 2px;
        width: 40%;
        background: -webkit-gradient(
          linear,
          left top,
          right top,
          from(rgba(255, 255, 255, 0)),
          color-stop(20%, rgba(255, 255, 255, 0)),
          color-stop(47%, #8c1320),
          color-stop(53%, #8c1320),
          color-stop(80%, rgba(255, 255, 255, 0)),
          to(rgba(255, 255, 255, 0))
        );
        background: -o-linear-gradient(
          left,
          rgba(255, 255, 255, 0) 0%,
          rgba(255, 255, 255, 0) 20%,
          #8c1320 47%,
          #8c1320 53%,
          rgba(255, 255, 255, 0) 80%,
          rgba(255, 255, 255, 0) 100%
        );
        background: linear-gradient(
          to right,
          rgba(255, 255, 255, 0) 0%,
          rgba(255, 255, 255, 0) 20%,
          #8c1320 47%,
          #8c1320 53%,
          rgba(255, 255, 255, 0) 80%,
          rgba(255, 255, 255, 0) 100%
        );
      }
      .z::after {
        content: "";
        display: block;
        height: 2px;
        width: 40%;
        background: -webkit-gradient(
          linear,
          left top,
          right top,
          from(rgba(255, 255, 255, 0)),
          color-stop(20%, rgba(255, 255, 255, 0)),
          color-stop(47%, #8c1320),
          color-stop(53%, #8c1320),
          color-stop(80%, rgba(255, 255, 255, 0)),
          to(rgba(255, 255, 255, 0))
        );
        background: -o-linear-gradient(
          left,
          rgba(255, 255, 255, 0) 0%,
          rgba(255, 255, 255, 0) 20%,
          #8c1320 47%,
          #8c1320 53%,
          rgba(255, 255, 255, 0) 80%,
          rgba(255, 255, 255, 0) 100%
        );
        background: linear-gradient(
          to right,
          rgba(255, 255, 255, 0) 0%,
          rgba(255, 255, 255, 0) 20%,
          #8c1320 47%,
          #8c1320 53%,
          rgba(255, 255, 255, 0) 80%,
          rgba(255, 255, 255, 0) 100%
        );
        -webkit-transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
        transform: rotate(-90deg);
        position: absolute;
        right: 80%;
        top: 50%;
      }
    }
  }
}
@media (max-width: 991.98px) {
  .leadership {
    & .leaders {
      & .leader {
        .z::after {
          content: "";
          display: none;
        }
      }
    }
  }
}
/*leadership*/

/*Partners*/
.Partners {
  background-color: #8c1320;
  border-radius: 15px;
  color: #fff;
  .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; /* Set the height to 100% */
    background-image: url("../imgs/Vector.png");
    z-index: 0;
  }
  .Title {
    h1 {
      font-family: SomarSans-Bold;
      font-size: 36px;
    }
    .titleImg {
      img {
        height: 35px;
      }
    }
  }

  .company {
    .swiper-slide {
      background-color: #fff;
      border-radius: 11px;
      .img-fluid {
        height: 122px;
      }
      .r {
        height: 121px !important;
      }
    }
    .swiper {
      .swiper-pagination {
        position: absolute;
        top: 86% !important;
      }
      .swiper-pagination-bullet {
        background: white;
        border-radius: 20px;
        width: 40px;
      }
    }

    .btn-more {
      position: relative;
      background-color: #8c1320;
      color: #fff;
      border-radius: 50px;
      font-size: 15px;
      border: 4px solid rgba(250, 250, 250, 1);
      padding: 0px 38px;
      outline: none;
      cursor: pointer;
      z-index: 10;
    }
    .btn-more:hover {
      background-color: #8c1320;
    }

    .swiper-button-prev,
    .swiper-button-next {
      padding: 1rem;
      border-radius: 50%;
      border: 5px solid #fff;
      cursor: pointer;
    }
    .swiper-button-prev::after,
    .swiper-button-next::after {
      font-size: 20px;
      color: white;
    }
  }
}
@media (max-width: 991.98px) {
  .Partners {
    .Title {
      h1 {
        font-size: 24px;
      }
    }
  }
}
/*Partners*/

/*prodects*/
.prodects {
  .Title {
    h1 {
      font-family: SomarSans-Bold;
      font-size: 36px;
    }
    .titleImg {
      img {
        height: 35px;
      }
    }
  }
  .yellowDiv {
    border-radius: 11px;
    background: -o-radial-gradient(
      circle,
      rgba(244, 236, 189, 1),
      rgba(255, 214, 0, 1)
    );
    background: radial-gradient(
      circle,
      rgba(244, 236, 189, 1),
      rgba(255, 214, 0, 1)
    );
    -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    img {
      margin-top: -5rem;
    }
    .prodectInfo {
      h4 {
        font-family: SomarSans-SemiBold;
      }
      p {
        font-family: Somar-Regular;
        font-size: 23px;
      }
    }
  }
  .btn-more {
    background-color: #8c1320;
    color: #fff;
    border-radius: 50px;
    font-size: 15px;
    border: 4px solid rgba(250, 250, 250, 1);
    padding: 0px 38px;
    outline: none;
    cursor: pointer;
    z-index: 10;
    width: 180px;
  }
  .btn-more:hover {
    background-color: #8c1320;
    color: #fff;
  }
}

@media (max-width: 991.98px) {
  .prodects {
    .Title {
      h1 {
        font-size: 26px;
      }
    }
    .btn-more {
      width: 95%;
    }
    .yellowDiv {
      img {
        margin: 0;
      }
    }
  }
}
/*prodects*/

/*OurVision*/

.OurVision {
  background: -o-radial-gradient(circle, #7464d2, #2e15c2);
  background: radial-gradient(circle, #7464d2, #2e15c2);
  border-radius: 11px;
  .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; /* Set the height to 100% */
    background-image: url("../imgs/Vector.png");
    z-index: 0;
  }
  .Vision {
    .WhiteDiv {
      border-radius: 11px;
      background-color: #fff;
    }
    .text {
      color: #fff;
      margin-top: 2rem;
      h1 {
        font-family: SomarSans-Bold;
      }
      p {
        font-family: Somar-Medium;
        font-size: 30px;
        line-height: normal;
      }
    }
  }
}

/*OurVision*/

/*AboutUs*/
.AboutUs {
  .number {
    background-color: white;
    border-radius: 33px;
    -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    h1 {
      font-family: SomarSans-Bold;
      color: #8c1320;
      font-size: 60px;
    }
    p {
      font-family: Somar-Regular;
      color: #1c1a27;
      font-size: 30px;
    }
  }
}
/*AboutUs*/

/*Footer*/
.Footer {
  background: -o-radial-gradient(center, circle, #e84354 0%, #8c1320 50%);
  background: radial-gradient(circle at center, #e84354 0%, #8c1320 50%);
  /* height: calc(100vh-); */
  border-radius: 11px 11px 0 0;
  .logo {
    img {
      width: 182px;
    }
  }
  .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; /* Set the height to 100% */
    background-image: url("../imgs/Vector.png");
  }
  .info i {
    font-size: 14px;
  }
  .location {
    span {
      font-family: SomarSans-Bold;
      font-size: 14px;
      color: #fff;
    }
  }
  .phone {
    .q {
      color: #fb8d1a;
    }
    span {
      font-family: SomarSans-Bold;
      font-size: 14px;
      color: #fff;
    }
  }

  .email {
    .q {
      color: #fb8d1a;
    }
    span {
      font-family: SomarSans-Bold;
      font-size: 14px;
      color: #fff;
    }
  }
  .soical {
    h5 {
      font-family: SomarSans-Bold;
      font-size: 14px;
      color: #fff;
    }
    .S_icon {
      color: #fff;
      font-size: 14px;
    }
  }
  hr {
    color: #fff;
    height: 10px;
  }
  h4 {
    font-size: 15px;
  }
}
/*Footer*/
/*/////////////////////////////////////////////////////////INDEX PAGE ////////////////////////////////////////////////////////////////////////////////////////////////////////*/

/*/////////////////////////////////////////////////////////////////Signle PAGE////////////////////////////////////////////////////////////////////////////////////////////////*/

#SinglePage {
}
/*Header*/
.header-item {
  background: -o-radial-gradient(center, circle, #e84354 0%, #8c1320 50%);
  background: radial-gradient(circle at center, #e84354 0%, #8c1320 50%);
  font-family: Somar-Regular;
  font-size: 18px;
  .nav-item a {
    color: #fff;
    font-size: 20px;
  }
  .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; /* Set the height to 100% */
    background-image: url("../imgs/Vector.png");
  }
  .item:hover {
    border-bottom: 5px solid #fb8d1a;
    font-size: 18px;
  }
  i {
    color: #fff;
  }
  .custom-toggler.navbar-toggler {
    outline: none;
    border-color: white;
  }
  .custom-toggler .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255,1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
  }
}
/*Header*/

/*item*/
.item {
  .description {
    h1 {
      font-family: SomarSans-Bold;
      color: #8c1320;
    }
    p {
      font-family: Somar-Regular;
      font-size: 25px;
    }
  }
}
/*item/
/*Footer*/

/*Footer*/
/*/////////////////////////////////////////////////////////////////Signle PAGE////////////////////////////////////////////////////////////////////////////////////////////////*/

/*/////////////////////////////////////////////////////////Prodects Page//////////////////////////////////////////////////////////////////////////////////////////////////////*/

.Products {
  .searcharea {
    input {
      background: url(../imgs/search-normal.png) no-repeat scroll 7px;
      padding-left: 42px;
      padding-top: 1rem;
      padding-bottom: 1rem;
      padding-right: 1rem;
    }
  }
  hr {
    background-color: rgb(108, 117, 125) !important;
    opacity: 0.25;
  }
  .checkboxs {
    position: relative;
    .input-assumpte:checked {
      background-color: #1dc9a0 !important;
      border: #1dc9a0;
    }
  }
  .checkboxs::after {
    content: "";
    background-color: #6c757d;
    opacity: 0.25;
    position: absolute;
    width: 1px;
    height: 550px;
    top: -90px;
    left: 77%;
    display: block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  .cards {
    -ms-grid-column: 2;
    grid-column: 2rem;
    row-gap: 2rem;
    .card {
      border: none;
      h5 {
        font-family: SomarSans-Bold;
      }
      p {
        font-family: Somar-Regular;
        font-size: 20px;
      }
      a {
        font-family: Somar-Regular;
        font-size: 25px;
        color: #fff;
        width: 100%;
        border-radius: 11px;
        padding: 2px;
        background-color: #8c1320;
        opacity: 0.8;
      }
    }
  }
}

@media (max-width: 991.98px) {
  .Products {
    .checkboxs::after {
      content: none;
      height: 0;
      width: 0;
    }
  }
}
/*/////////////////////////////////////////////////////////Prodects Page//////////////////////////////////////////////////////////////////////////////////////////////////////*/

/*/////////////////////////////////////////////////////////Content US//////////////////////////////////////////////////////////////////////////////////////////////////////////*/
.Content_Us {
  .conteantHeader {
    h1 {
      font-family: SomarSans-Bold;
      font-size: 48px;
      opacity: 0.9;
      color: #8c1320;
    }
    p {
      font-family: Somar-Regular;
      font-size: 30px;
      opacity: 0.8;
      span {
        font-size: 25px;
      }
    }
  }
  .info {
    h1 {
      color: #8c1320;
      opacity: 0.9;
    }
    .location {
      i {
        color: #292d32;
        opacity: 0.8;
      }
      span {
        font-family: SomarSans-Bold;
        font-size: 17px;
        color: #292d32;
        opacity: 0.8;
      }
    }

    .email {
      i {
        color: #292d32;
        opacity: 0.8;
      }
      span {
        font-family: SomarSans-Bold;
        font-size: 17px;
        color: #292d32;
        opacity: 0.8;
      }
    }

    .phone {
      i {
        color: #292d32;
        opacity: 0.8;
      }
      span {
        font-family: SomarSans-Bold;
        font-size: 17px;
        color: #292d32;
        opacity: 0.8;
      }
    }
  }

  .ContentForm {
    h1 {
      font-family: SomarSans-Bold;
      font-size: 20px;
      opacity: 0.9;
    }
    p {
      font-family: Somar-Regular;
      font-size: 20px;
      opacity: 0.8;
      span {
        font-size: 25px;
      }
    }

    .form-group {
      label {
        font-family: SomarSans-Bold;
        font-size: 20px;
        color: black;
      }
      input {
        border: none;
        border-bottom: 1px solid gray;
      }
    }
  }
}
@media (max-width: 991.98px) {
  .Content_Us {
    .info {
      .location {
        span {
          font-size: 15px;
        }
      }
    }
  }
}
/*/////////////////////////////////////////////////////////Content US//////////////////////////////////////////////////////////////////////////////////////////////////////////*/

/*/////////////////////////////////////////////////////////vedios//////////////////////////////////////////////////////////////////////////////////////////////////////////*/
.vedios {
  .title {
    h1 {
      font-family: SomarSans-Bold;
      font-size: 48px;
      opacity: 0.9;
      color: #8c1320;
    }
    p {
      font-family: Somar-Regular;
      font-size: 30px;
      opacity: 0.8;
    }
  }
}