@import url("https://fonts.googleapis.com/css2?family=Cairo:wght@200..1000&display=swap");

* {
  font-family: "Cairo", sans-serif;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

.media-center {
  padding: 60px 20px;

  .container {
    max-width: 1236px;
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    margin-inline: auto;
    position: relative;

    a {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
    }

    .box-media {
      position: relative;
      background: rgba(247, 247, 249, 1);
      -webkit-border-radius: 31px;
      -moz-border-radius: 31px;
      -ms-border-radius: 31px;
      -o-border-radius: 31px;
      border-radius: 31px;
      height: 375px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      flex: 1;
      padding: 62px 51px;
      min-width: 400px;
      transition: 0.5s all ease-in-out;
      -webkit-transition: 0.5s all ease-in-out;
      -moz-transition: 0.5s all ease-in-out;
      -ms-transition: 0.5s all ease-in-out;
      -o-transition: 0.5s all ease-in-out;

      &:hover {
        box-shadow: 0 0 10px 0 #3f3f3f;
      }

      @media (max-width: 992px) {
        height: 320px;
        min-width: 300px;
      }

      .title-box {
        font-weight: 600;
        font-size: clamp(24px, 3.4vw, 32px);
        color: rgba(41, 41, 41, 1);
      }

      .icon-box {
        margin-inline-start: auto;

        img {
          width: 100%;
          height: 100%;
        }

        @media (max-width: 992px) {
          max-width: 80px;
        }
      }
    }
  }
}

.media-assets {
  padding: 60px 20px;

  .container {
    max-width: 1516px;
    margin-inline: auto;
    position: relative;
  }

  .tab-wrapper {
    text-align: center;
    display: flex;
    margin: auto;
    position: relative;

    @media (max-width: 668px),
    (orientation: landscape) {
      display: flex;
      flex-direction: column-reverse;
    }

    .arrow-back {
      position: absolute;
      width: fit-content;
      top: 50%;
      left: 0;
      translate: 0 -50%;
      display: flex;
      align-items: center;
      gap: 6px;
      text-decoration: none;
      color: rgba(10, 56, 105, 1);
      font-size: clamp(18px, 2vw, 22px);

      @media (max-width: 668px),
      (orientation: landscape) {
        position: static;
        translate: 0 0;
      }
    }

    .tabs {
      margin: 0;
      padding: 0;
      display: flex;
      justify-content: center;
    }

    .tab-link {
      margin: 0 1%;
      padding: 10px 40px;
      list-style: none;

      .title-filter {
        color: rgba(10, 56, 105, 0.4);
        cursor: pointer;
        font-weight: 400;
        transition: all ease 0.5s;
        font-size: clamp(24px, 3.4vw, 41px);
      }

      &:hover {
        .title-filter {
          color: rgba(10, 56, 105, 1);
        }
      }

      &.active {
        .title-filter {
          color: rgba(10, 56, 105, 1);
        }
      }
    }
  }

  .content-wrapper {
    padding-block: 40px;
  }

  .tab-content {
    display: none;
    text-align: center;
    color: #888;
    font-weight: 300;
    font-size: 15px;
    opacity: 0;
    transform: translateY(15px);
    -webkit-animation: fadeIn 0.5s ease 1 forwards;
    animation: fadeIn 0.5s ease 1 forwards;

    .media-container {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 38px;

      @media (max-width: 778px) {
        gap: 12px;
      }

      .box-video,
      .box-image {
        flex: 1 1 auto;
        max-width: 350px;
        display: flex;
        overflow: hidden;
        -webkit-border-radius: 11.73px;
        -moz-border-radius: 11.73px;
        -ms-border-radius: 11.73px;
        -o-border-radius: 11.73px;
        border-radius: 11.73px;
        cursor: pointer;

        &:hover img,
        &:hover video {
          transform: scale(1.1);
        }

        @media (max-width: 778px) {
          width: 40%;
        }

        video,
        img {
          transition: 0.5s all ease-in-out;
          -webkit-transition: 0.5s all ease-in-out;
          -moz-transition: 0.5s all ease-in-out;
          -ms-transition: 0.5s all ease-in-out;
          -o-transition: 0.5s all ease-in-out;
          width: 100%;
          height: 100%;
          object-fit: cover;
        }
      }
    }
  }

  .tab-content.active {
    display: block;
  }

  .popup-assets {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #1f1f1f6f;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    opacity: 0;
    pointer-events: none;
    transition: 0.3s all ease-in-out;
    -webkit-transition: 0.3s all ease-in-out;
    -moz-transition: 0.3s all ease-in-out;
    -ms-transition: 0.3s all ease-in-out;
    -o-transition: 0.3s all ease-in-out;
    padding-inline: 20px;

    &.active {
      opacity: 1;
      pointer-events: all;
    }

    .container-popup {
      width: 100%;
      max-width: 600px;
    }

    .popup-header {
      position: relative;
      text-align: center;
      color: #fff;
      margin-bottom: 20px;

      h2 {
        font-size: clamp(18px, 2vw, 28px);
      }

      .close-popup {
        position: absolute;
        top: 50%;
        right: 0;
        translate: 0 -50%;
        width: 30px;
        height: 30px;
        background: none;
        border: none;
        cursor: pointer;

        img {
          width: 100%;
        }
      }
    }

    .popup-content {
      position: relative;
      padding-inline: 30px;

      .video-container,
      .image-container {
        width: 100%;
        height: 300px;
        -webkit-border-radius: 24px;
        -moz-border-radius: 24px;
        -ms-border-radius: 24px;
        -o-border-radius: 24px;
        border-radius: 24px;
        overflow: hidden;
        display: none;

        @media (max-width: 778px) {
          height: 250px;
        }

        img,
        video,
        iframe {
          width: 100%;
          height: 100%;
          object-fit: cover;
        }
      }

      .video-container.active,
      .image-container.active {
        display: flex;
      }

      .navigateLeft,
      .navigateRight {
        height: 48px;
        width: 48px;
        position: absolute;
        background: none;
        border-radius: 50%;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        -o-border-radius: 50%;
        transition: 0.3s all ease-in-out;
        -webkit-transition: 0.3s all ease-in-out;
        -moz-transition: 0.3s all ease-in-out;
        -ms-transition: 0.3s all ease-in-out;
        -o-transition: 0.3s all ease-in-out;
        top: 50%;
        border: none;
        translate: 0 -50%;
        cursor: pointer;

        &:hover {
          scale: 1.1;
        }

        img {
          width: 100%;
          height: 100%;
          object-fit: contain;
        }
      }

      .navigateLeft {
        left: -20px;
      }

      .navigateRight {
        right: -20px;
      }
    }
  }
}

html:has(.popup-assets.active) {
  overflow: hidden;
}

.media-kit {
  padding: 60px 20px;
  position: relative;

  .red-box {
    background-color: rgba(193, 16, 26, 1);
    border-top-left-radius: 71.92px;
    position: absolute;
    bottom: 0;
    right: 0;
    height: clamp(50px, 16vw, 92px);
    width: clamp(60px, 12vw, 120px);
    z-index: -1;
  }

  .blue-box {
    z-index: -1;
    background-color: rgba(10, 56, 106, 1);
    border-top-right-radius: 71.92px;
    position: absolute;
    bottom: 0;
    left: 0;
    height: clamp(50px, 16vw, 92px);
    width: clamp(60px, 12vw, 120px);
  }

  .yellow-box {
    z-index: -1;
    background-color: rgba(255, 202, 54, 1);
    border-top-left-radius: 55.57px;
    border-top-right-radius: 55.57px;
    position: absolute;
    bottom: 0;
    right: clamp(100px, 20vw, 200px);
    height: 95px;
    width: 92px;
    height: clamp(50px, 16vw, 95px);
    width: clamp(50px, 12vw, 92px);
  }

  .container {
    max-width: 1516px;
    margin-inline: auto;
    position: relative;

    .header {
      display: flex;
      justify-content: center;
      position: relative;

      @media (max-width: 668px),
      (orientation: landscape) {
        display: flex;
        flex-direction: column-reverse;
      }

      .title {
        font-size: clamp(24px, 2.8vw, 48px);
        color: rgba(10, 56, 105, 1);
        font-weight: 400;
        text-align: center;
      }

      .arrow-back {
        position: absolute;
        width: fit-content;
        top: 50%;
        left: 0;
        translate: 0 -50%;
        display: flex;
        align-items: center;
        gap: 6px;
        text-decoration: none;
        color: rgba(10, 56, 105, 1);
        font-size: clamp(18px, 2vw, 22px);

        @media (landscape) {
          position: static;
          translate: 0 0;
        }

        @media (max-width: 668px),
        (orientation: landscape) {
          position: static;
          translate: 0 0;
        }
      }
    }

    .content {
      margin-block: 60px;
      display: flex;
      justify-content: space-between;
      height: 378px;
      width: 100%;
      max-width: 692px;
      padding: 60px 45px;
      margin-inline: auto;
      border-radius: 38px;
      -webkit-border-radius: 38px;
      -moz-border-radius: 38px;
      -ms-border-radius: 38px;
      -o-border-radius: 38px;
      border: 0.75px solid rgba(10, 58, 106, 1);
      position: relative;
      background-color: #fff;
      gap: 8px;

      @media (max-width: 778px) {
        padding: 40px 25px;
      }

      .hero {
        display: flex;
        flex-direction: column;
        justify-content: center;
        max-width: 379px;

        .logo {
          width: 80%;

          img {
            width: 100%;
          }
        }

        .title {
          font-size: clamp(20px, 3vw, 32px);
          color: rgba(197, 32, 38, 1);
          font-weight: 700;
          margin-block: 26px 8px;
        }

        .description {
          font-size: 16px;
          line-height: 21.56px;
          color: rgba(41, 41, 41, 1);
        }

        a {
          margin-top: auto;
          font-weight: 700;
          font-size: 18px;
          display: flex;
          align-items: center;
          gap: 8px;
          color: rgba(197, 32, 38, 1);
          text-decoration: none;
          width: fit-content;

          img {
            transition: 0.2s all ease-in;
            -webkit-transition: 0.2s all ease-in;
            -moz-transition: 0.2s all ease-in;
            -ms-transition: 0.2s all ease-in;
            -o-transition: 0.2s all ease-in;
          }

          &:hover img {
            translate: 10px 0;
          }
        }
      }

      .pattern {
        align-self: flex-end;
        min-width: 60px;

        img {
          width: 100%;
          height: auto;
        }
      }

      .shadows {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: -1;

        .blue,
        .yellow,
        .red {
          content: "";
          position: absolute;
          width: 660px;
          max-width: 90%;
          height: 360px;
          max-height: 98%;
          -webkit-border-radius: 38px;
          -moz-border-radius: 38px;
          -ms-border-radius: 38px;
          -o-border-radius: 38px;
          border-radius: 38px;
        }

        .red {
          top: 35.55px;
          left: 71.01px;
          transform: rotate(3.03deg);
          -webkit-transform: rotate(3.03deg);
          -moz-transform: rotate(3.03deg);
          -ms-transform: rotate(3.03deg);
          -o-transform: rotate(3.03deg);
          background-color: rgba(193, 16, 26, 1);
          z-index: -1;
        }

        .yellow {
          background: rgba(255, 202, 54, 1);
          top: 40.55px;
          left: 71.01px;
          transform: rotate(9deg);
          -webkit-transform: rotate(9deg);
          -moz-transform: rotate(9deg);
          -ms-transform: rotate(9deg);
          -o-transform: rotate(9deg);
          z-index: -4;
        }

        .blue {
          background: rgba(10, 56, 106, 1);
          top: 60.55px;
          left: 71.01px;
          transform: rotate(12deg);
          -webkit-transform: rotate(12deg);
          -moz-transform: rotate(12deg);
          -ms-transform: rotate(12deg);
          -o-transform: rotate(12deg);
          z-index: -5;
        }
      }
    }
  }
}

@keyframes fadeIn {
  100% {
    opacity: 1;
    transform: none;
  }
}

html[lang="ar"]:not([dir="rtl"]) {
  .media-assets .tab-wrapper {
    justify-content: flex-end;
  }
}

html[lang="ar"],
html[dir="rtl"] {
  .arrow-back {
    left: auto;
    right: 0;

    img {
      scale: -1;
    }
  }

  .media-kit {
    .container {
      .content {
        .hero {
          a {
            img {
              scale: -1;
            }

            &:hover {
              img {
                translate: -10px 0;
              }
            }
          }
        }
      }
    }
  }
}

.text_popup_checker {
  color: #efefef;
  font-weight: 600;
  font-size: 1.2rem;
  line-height: 1.4;
  margin-block: 8px 20px;
}

.modal-box-content {

  .form-group,
  .form-group .form-control,
  html[lang="ar"] .modal-box-body .form-group,
  html[lang="ar"] .modal-box-body .form-group .form-control {
    margin: 0;
    font-size: 16px;

    input {
      padding: 0;
      height: fit-content;
    }
  }
}

#resultMessage * {
  font-size: 14px;
  color: #fff !important;
}

.btn.btn-reset {
  top: 10px;

  svg {
    height: 24px;
    width: 24px;
  }
}

.icon.icon-refresh {
  height: 24px;
  width: 24px;
}

#checkerModalBox {
  .captcha-input {
    padding-inline: 0;
    display: flex;
    align-items: center;
    max-width: 240px;

    input {
      width: 200px;
      font-size: 16px !important;
    }
  }

  .modal-box-body .form-group:has(.captcha-input) .btn-group {
    top: 35px;
  }
}

@media (max-width: 575px) {
  .modal-box-body .form-group.with-btn .btn-reset {
    flex: none;
  }

  #checkerModalBox {
    .modal-box-body .form-group:has(.captcha-input) .btn-group {
      top: 0;
    }
  }

  .modal-box-body .form-group.with-btn .btn-group {
    justify-content: flex-end;
  }
}

@media (min-width: 1200px) {
  .widget-tools .tool-link {
    height: 100%;
    display: flex;
    align-items: center;
  }
}

.col-sm.captcha-img {
  padding-inline: 0;
  max-width: 220px;

  img {
    width: 220px;
  }
}

.page-nav.with-btns .nav-line {
  padding-right: 15px;
  padding-left: 15px;
  display: flex;
  justify-content: space-between;
}

.page-nav.with-btns .action-btns {
  position: static;
  flex: 1 1 100%;
  max-width: fit-content;
}

.page-nav.with-btns .multi-btns .btn-wrapper {
  /* width: auto; */
  text-wrap: nowrap;
}

@media (max-width: 558px) {
  .page-nav.with-btns:has(.action-btns ul:has(li)) .nav-line {
    flex-direction: column;
    gap: 4px !important;
  }

  .page-nav.with-btns .nav-line ul.nav {
    justify-content: center !important;
  }

  .page-nav.with-btns .action-btns {
    align-self: flex-end;
  }
}

html.modal {
  display: block;
}

#formDeposit .row,
#formChecker .row {
  row-gap: 30px !important;
}

#formApply .row .form-group {
  margin-bottom: 20px;
}

#formApply .row {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.widget-tools .tool-link {
  height: 100%;
}

.modal-box-body #formWealthLoan .form-group {
  height: 100%;
}

.modal-box-body #formWealthLoan .answer-list {
  margin: 0;
  display: flex;
  gap: 8px;
}

.modal-box-body #formWealthLoan .col-sm-6 {
  margin-block: 8px !important;
}

.modal-box-body #formWealthLoan .answer-list .answer-item {
  padding: 0;
}

.modal-box-body #formWealthLoan .form-group .selectric {
  background-color: #dcdfe5;
}

.modal-box-body #formWealthLoan .form-group #inputWLCollAmount {
  max-width: 250px;
}

.modal-box-body .form-group.with-btn .btn-reset {
  top: 0;
  background-color: transparent;
}

#formChecker .row:has(> .col-sm.captcha-img) {
  flex-direction: column;
  gap: 0 !important;
}

#formChecker .row:has(> .col-sm.captcha-img) .col-sm.captcha-img {
  padding: 0;
  max-width: 100%;
}

#formChecker .row:has(> .col-sm.captcha-img) .col-sm.captcha-img img {
  width: 240px;
}

.blue-lookup .btn-filters span {
  color: #fff;
}

.tag-item .custom-control-label::before,
.tag-item .custom-control-label:after,
.blue-lookup .custom-control-label:after,
.blue-lookup .custom-control-label::before {
  left: -24px;
}

.megamenu .dropdown-menu .container {
  gap: 32px;
  align-items: first baseline;

}

.megamenu .dropdown-menu .container>.row {
  flex: 1;
  justify-content: flex-start;
  row-gap: 40px;
}

.megamenu .dropdown-menu .container>.row .col-lg-3 {
  max-width: 250px;
}

#formDeposit .row .col-sm-3 {
  padding-bottom: 4px;
}

#formDeposit .row .col-sm-3:last-child {
  padding-left: 2px !important;
  flex: 1;
}

#formDeposit .row .col-sm-3:not(:last-child) {
  padding-right: 2px !important;
}

html[lang="ar"] #formDeposit .row .col-sm-3:last-child {
  padding-left: 15px !important;
  padding-right: 2px !important;
}

html[lang="ar"] #formDeposit .row .col-sm-3:not(:last-child) {
  padding-right: 15px !important;
  padding-left: 2px !important;
}

@media (max-width: 572px) {

  #formDeposit .row .col-sm-3:last-child,
  #formDeposit .row .col-sm-3:not(:last-child) {
    padding-right: 15px !important;
    padding-left: 15px !important;
  }
}

.tag-item .custom-control-label::before,
.tag-item .custom-control-label:after {
  left: -20px !important;
  top: 50% !important;
  translate: 0 -50% !important;
}

html[lang="ar"] .tag-item .custom-control-label::before,
html[lang="ar"] .tag-item .custom-control-label:after {
  left: initial !important;
  right: -20px !important;
}

.bio-content ul {
  padding-inline-start: 26px;
}

:is(#formDeposit, #formLoan, #formConverter)>.row {
  margin-block: 20px;
}

:is(#formLoan, #formConverter)>.row .col-sm-6 .form-group {
  height: 100%;
}

.modal-box-body .answer-list {
  margin-bottom: 0;
}

.article-wrapper .feature-content ol,
.article-wrapper .feature-content ul {
  padding-inline-start: 24px;
}

.rewards-search .btn-search,
.blue-lookup .btn-filters {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
}

.rewards-search .btn-search .icon {
  top: 0px
}

.blue-lookup .btn-filters {
  color: #fff;
}

.article-wrapper ol:not(.check-list),
.article-wrapper ul:not(.check-list) {
  padding-inline-start: 2.2rem;
}

.comp-right,
.comp-left {
  display: flex;
  align-items: center;
  justify-content: center
}

.top-nav .nav-lang-link:hover {
  text-decoration: underline;
}

.top-nav .nav-lang-link span {
  transition: .3s all ease;
}

.top-nav .nav-lang-link:hover span {
  color: black
}

.search-form {
  flex: 1;
}

.modal-box-close .icon-bar {
  background-color: #3c3c3c;
}

.social-list li a img {
  transition: .3s all ease;
}

.social-list li a:hover img {
  scale: 1.2;
}

.page-nav.with-btns .nav-line {
  gap: 30px;
}

.page-nav.with-btns .left-paddle,
.page-nav.with-btns .right-paddle {
  display: flex;
  align-items: center;
  justify-content: center;
}

.page-nav.with-btns .right-paddle {
  right: 140px;
  left: auto;
}

.page-nav.with-btns .left-paddle {
  left: 10px;
  right: auto;
}

html[lang="ar"] .page-nav.with-btns .right-paddle {
  left: 140px;
  right: auto;
}

html[lang="ar"] .page-nav.with-btns .left-paddle {
  right: 0;
  left: auto;
}

@media (min-width: 992px) {
  .page-nav.with-btns:has(.action-btns ul:has(li)) .right-paddle {
    right: 270px;

  }

  html[dir="rtl"] .page-nav.with-btns:has(.action-btns ul:has(li)) .right-paddle {
    left: 270px;
    right: auto;

  }
}

@media (min-width: 768px) {
  .page-nav.with-btns .nav-line {
    padding-inline: 40px;
  }

  .action-btns {
    padding: 10px 0 10px 0;
  }
}

.page-nav.with-btns .container:after {
  right: 20px;
}

html[lang="ar"] .page-nav.with-btns .container:after {
  right: auto;
  left: 20px;
}

html[lang="ar"] .left-paddle .icon {
  position: relative;
  right: 8px;
  width: 100%;
}

.right-paddle .icon {
  position: relative;
  right: 12px;
  width: 100%;
}

@media (max-width: 558px) {
  .page-nav.with-btns .nav-line ul.nav {
    justify-content: normal !important;
    margin-inline: 10px;
  }

  .right-paddle .icon {
    position: relative;
    right: 0;
    width: 100%;
  }

  .page-nav.with-btns .container::before {
    left: 25px;
  }

  html[lang="ar"] .page-nav.with-btns .container::before {
    left: auto;
    right: 25px;
  }

  .page-nav.with-btns .container:after {
    right: 25px;
  }

  html[dir="rtl"] .page-nav.with-btns .container::before {
    left: auto;
    right: 25px;
  }

  html[dir="rtl"] .page-nav.with-btns .container:after {
    right: auto;
    left: 25px;
  }
}

.top-nav .nav-lang-link:hover span {
  color: var(--main-color);
}

:is(.article-wrapper ol:last-child, .article-wrapper ul:last-child) li img {
  transition: .3s all ease-in-out
}

:is(.article-wrapper ol:last-child, .article-wrapper ul:last-child) li:hover img {
  scale: 1.2;
}

.compare-table .col-cell .square-list>li,
.compare-table .col-cell ul>li {
  list-style: none;
}

.compare-table .col-cell ul>li:before {
  content: "";
  float: left;
  width: 6px;
  height: 6px;
  margin: 0.55rem -1.1rem;
  color: #797984;
  background: #797984;

}

.compare-table .col-cell .square-list>li:before,
.compare-table .col-cell ul>li:before {
  border-radius: 50%;
}

.blue-lookup .btn-filters span {
  display: flex;
  align-items: center;
  gap: 8px
}

.blue-lookup .btn-filters span svg {
  position: static !important;
}

.compare-table .col-cell .square-list>li,
.compare-table .col-cell ul>li {
  padding: 1px 0 0 18px;
}

body:has(.privating_banking) .top-nav .nav-lang .nav-lang-link span {
  color: #FFF
}

body:has(.privating_banking) .top-nav .nav-lang .nav-lang-link span:hover {
  color: var(--main-color)
}

.page-nav.with-btns .nav-line .action-btns .btn-wrapper {
  display: flex;
  align-items: center;
  padding-inline: 4px
}

@media(max-width:991px) {
  .gb-map #frmLocationsSearch .blue-lookup .btn-filters span {
    display: none
  }
}

@media (max-width: 448px) {
  .nav-global li .nav-link {
    padding: 10px 4px 4px;
  }

  .navbar-brand img {
    width: 120px !important;
    height: 40px !important;
    margin-inline: auto;
  }
}

@media (max-width: 767px) {
  .nav {
    margin-inline: 0 4px;
  }

  #navLine:has(.action-btns ul li) .right-paddle {
    right: 110px
  }

  html[lang="ar"] #navLine:has(.action-btns ul li) .right-paddle {
    right: auto;
    left: 110px;
  }
}

.page-nav .nav-line ul.nav {
  scroll-behavior: smooth;
}

.megamenu .dropdown-menu .sub-menu ul li a {
  text-align: start;
}

#frmLocationsSearch .branch-search .btn-search {
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (max-width:991px) {

  .branch-types .custom-control-label:after,
  .branch-types .custom-control-label::before {
    left: -1.5rem;

  }
}

html[lang="ar"] #branchFilters .branch-types .custom-checkbox {
  padding-left: 15px;
  padding-right: 40px
}

html[lang="ar"] .search-filters .custom-checkbox {
  padding-left: 15px;
  padding-right: 1.5rem
}

html[lang="ar"] .search-filters .custom-control-label::after,
html[lang="ar"] .search-filters .custom-control-label::before {
  left: auto;
  right: -1.5rem
}

.map-toggle {
  padding: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.comp-tab a,
.comp-tab a:before,
.comp-tab a:after {
  height: 100%;
  min-height: 53px;
}

.bio-wrapper {
  flex: 1 1 100%;
}

.feature-wrapper {
  align-items: center
}

.feature-item:has(.feature-img):after {
  height: 600px;
  top: 50%;
  translate: 0 -50%;
}

@media (min-width: 778px) {
  .feature-item:has(.feature-img):after {
    height: 350px
  }

  .feature-img {
    width: 60%;
    max-width: 60%;
    flex: 0 0 50%;
  }
}

@media (min-width: 1024px) {
  .feature-item:has(.feature-img):after {
    height: 450px
  }

  .feature-img {
    width: 60%;
    max-width: 60%;
    flex: 0 0 55%;
  }
}

@media (min-width: 992px) {
  .sub-menu ul li.menu-title>a:before {
    left: -1.5px;
    width: 2px;
  }

  html[dir="rtl"] .sub-menu ul li.menu-title>a:before {
    left: auto;
    right: -1.5px;
  }
}

#readArea .feature-item:not(:has(.feature-img)) {
  display: none
}

#readArea .feature-item:has(.feature-img) {
  margin-block: 0;
}

#readArea .section-no-heading,
#readArea .page-article {
  padding-block: 10px
}

#readArea .section-no-heading {
  margin: 0 auto;

}

#readArea .page-article:has(.section-no-heading) {
  min-height: auto;
}

@media (max-width:992px) {
  .blue-lookup .btn-filters span {
    display: none;
  }
}

.teaser-content ul {
  padding-inline-start: 21px;
}

html[lang="ar"] .breadcrumb-item+.breadcrumb-item::before {
  float: right;
}

html[lang="ar"] .compare-table .col-cell .square-list>li,
html[lang="ar"] .compare-table .col-cell ul>li {
  padding: 10px 0 0 1px
}

html[lang="ar"] .compare-table .col-cell ul>li:before {
  float: right;
  margin: 0.55rem 1.1rem;
}

.action-btns ul li .btn {
  text-wrap-style: none;
}

.page-nav.with-btns.show-btns .container:after {
  width: 0;
}

.page-nav.with-btns.show-btns .container:after {
  width: 100%;
  right: 20%;
  pointer-events: none;
}

.custom-checkbox .custom-control-input:checked~.custom-control-label::after {
  filter: brightness(0);
  -webkit-filter: brightness(0);
}

.custom-control-input:checked~.custom-control-label::before {
  background-color: #FFF;
  border-color: #FFF;
}

@media (min-width:992px) {
  :has(.privating_banking) .sub-menu ul li {
    border-left-color: var(--main-color);
  }
}

.why-card:before {
  display: none
}

.page-nav:not(:has(.btn-toggler)) .container:after {
  display: none;
}

.custom-why-cards .owl-nav {
  display: flex;
  justify-content: flex-end;
  gap: 24px;
  padding: 12px 32px;
}

.custom-why-cards .owl-nav :is(.owl-next, .owl-prev) {
  width: 38px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #efefef !important;
  border-radius: 50%;
  transition: .3s all ease-in-out
}

.custom-why-cards .owl-nav :is(.owl-next, .owl-prev).disabled {
  cursor: initial;
  opacity: .5;
}

.custom-why-cards .owl-nav :is(.owl-next, .owl-prev):not(.disabled):hover {
  background: #dfdfdf !important;
}

.custom-why-cards .owl-nav :is(.owl-next, .owl-prev) span {
  line-height: 24px !important;
  height: auto !important;
  font-size: 32px;
  margin-top: -4px
}

@media (min-width: 992px) {

  .left-paddle.hidden,
  .right-paddle.hidden {
    display: none !important;
  }
}

.container-btn-banner {
  position: absolute;
  bottom: 60px;
  z-index: 10;
  left: 50%;
  translate: -50% 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 768px) {
  .container-btn-banner {
    justify-content: center;
  }
}

.btn-banner {
  padding: 0.35rem 0.75rem 0.275rem;
  border-color: #ca1700;
  background: #ca1700;
  color: #fff;
  width: 151px;
  padding-block: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-weight: bold;
  border-radius: 23px;
}

.btn-banner:hover {
  color: #ca1700;
  background: white;
}

.section-hero .carousel-controls {
  position: absolute;
  top: 50%;
  translate: 0 -50%;
  inset-inline-end: 0;
  width: 100%;
  display: flex;
  z-index: 1;
  pointer-events: none;

  .container {
    display: flex;
    align-items: center;
    align-items: flex-end;
    flex-direction: column;
    gap: 16px;
    max-width: 100%;
  }

  .carousel-btn-next,
  .carousel-btn-prev {
    position: static;
    pointer-events: all;
  }

  .indexSlider {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 9px;
    font-size: clamp(16px, 3.4vw, 24px);
    font-weight: bold;
    min-width: 28px;

  }

  .currentIndex {
    color: #ca1700;
  }

  .indexSlider .line {
    height: 44px;
    width: 2px;
    background-color: rgba(103, 103, 103, 0.4);
  }
}

/* 
.hero-carousel .carousel-item {
  min-height: 576px;
  max-height: 763px;

  &.carousel-item-next,
  &.carousel-item-prev,
  &.carousel-item.active {
    display: flex;
    align-items: center;
  }
}
.hero-carousel .carousel-item>a>img,
.hero-carousel .carousel-item>a>picture>img,
.hero-carousel .carousel-item>img,
.hero-carousel .carousel-item>picture>img {
  top: auto;
  left: auto;
  right: auto;
  transform: none;
  height: auto;
  object-position: center;
  width: 100%;
}
.hero-carousel .carousel-item > a{
  display: flex;
  justify-content: center;
  width: 100%;
  height: 100%;
} */