/* @font-face {
    font-family: 'Effra';
    src: url('../fonts/effra/Effra_Trial_Rg.ttf') format('truetype');
    font-weight: normal;
  }

  @font-face {
    font-family: 'Effra';
    src: url('../fonts/effra/Effra_Trial_Md.ttf') format('truetype');
    font-weight: Medium;
  }

  @font-face {
    font-family: 'Effra';
    src: url('../fonts/effra/Effra_Trial_Bd.ttf') format('truetype');
    font-weight: Bold;
  } */
@font-face {
    font-family: "Ping AR";
    src: url("../fonts-new/xqQ1drj6MO31K5Rptone3CjU.otf") format("opentype");
    font-weight: 500; /* Medium = 500 */
}

@font-face {
    font-family: "Ping AR";
    src: url("../fonts-new/SkuIuvoGvvJnpf3w3x0891Rh88.otf") format("opentype");
    font-weight: 700; /* Bold = 700 */
}

* {
    font-family: "Ping AR", sans-serif;
}

  html {
    -webkit-text-size-adjust: 100%;
  }
  .contact-page .link,
  .contactus-page .link,
  .sucsses-page .link,
  .packages-page .link,
  .partener-page .link {
    display: flex;
    justify-content: end;
    text-align: end;
    margin-top: -30px;
    padding-left: 190px;
  }
  .contact-page .link2,
  .contactus-page .link2,
  .sucsses-page .link2,
  .packages-page .link2,
  .partener-page .link2 {
    display: flex;
    justify-content: end;
    text-align: end;
    padding: 10px 20px;
    border: 1px solid black;
    border-radius: 50px;
  }
  .contact-page .back a,
  .contactus-page .back a,
  .sucsses-page .back a,
  .packages-page .back a,
  .partener-page .back a {
    font-family: 'Effra', sans-serif !important;
    margin-top: -5px;
  }

  .contact-page .link a,
  .contactus-page .link a,
  .sucsses-page .link a,
  .packages-page .link a,
  .partener-page .link a {
    font-size: 15px;
    color: black;
  }
  .new-graph {
    padding-top: 1em !important;
  }
  .new-graph h2 {
    line-height: unset !important;
    margin-bottom: unset !important;
    padding: 0 10px !important;
  }
  #page-content.account-summary .account-sales .carousel-control.disable .icon {
    color: #b4b4b4 !important;
    opacity: 0.5 !important;
    cursor: not-allowed;
    transition: 0.5s;
  }

  #page-content.account-summary .account-sales .carousel-control .icon {
    color: #b4b4b4 !important;
    opacity: 0.5 !important;
    transition: 0.5s;
  }
  #page-content.account-summary .account-sales .carousel-control:hover .icon {
    color: #2c1d65 !important;
    opacity: 1 !important;
  }
  #page-content.account-summary
    .account-sales
    .carousel-control.disable:hover
    .icon {
    color: #b4b4b4 !important;
    opacity: 0.5 !important;
    cursor: not-allowed;
  }
  .partener-page .container-lg,
  .add-services-page .container-lg,
  .vip-page .container-lg,
  .booking-page .container-lg,
  .contact-page .container-lg,
  .contactus-page .container-lg,
  .packages-page .container-lg,
  .sucsses-page .container-lg {
    max-width: 1250px;
  }
  .add-services-page .containerPg .btn {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
    text-align: center;
  }
  .btn-check:checked + .btn,
  .btn.active,
  .btn.show,
  .btn:first-child:active,
  :not(.btn-check) + .btn:active {
    color: #fff !important;
    background-color: #2c1d65 !important;
    border-color: unset !important;
  }

  .btn-check:checked + .btn,
  .btn.active,
  .btn.show,
  .btn:first-child:active,
  :not(.btn-check) + .btn:active {
    color: #fff !important;
    background-color: #2c1d65 !important;
    border-color: unset !important;
  }
  .vip-page .packagesInfo,
  .booking-page .packagesInfo,
  .sucsses-page .packagesInfo {
    width: 100%;
  }
  .vip-page .basic p.price {
    padding-top: 0;
  }
  .vip-page .basic p:nth-of-type(1) {
    padding-bottom: 0 !important;
  }
  .vip-page .basic p.price:after {
    top: 30% !important;
  }
  .contact-page .packages .containerPg,
  .contactus-page .packages .containerPg {
    width: 100%;
  }

  .sucsses-page .carousel-indicators [data-bs-target] {
    background-color: #bbbbbb;
  }
  .sucsses-page .carousel-indicators .active {
    background-color: #cb1b64;
  }
  .booking-page .back {
    margin-left: unset;
  }
  .visa-btn,
  .tabby-btn,
  .pay-btn {
    display: none;
  }
  .visa-btn.activee,
  .tabby-btn.activee,
  .pay-btn.activee {
    display: block;
  }
  .payment-form .button-div .btn {
    height: 51px;
  }
  #page-content.account-summary .account-sales .nav-tabs {
    margin-bottom: 1.3em;
  }
  .packagesInfo {
    border: unset;
  }
  .transactions .card {
    border-color: transparent;
  }
  .transfer .card {
    border-color: #2c1d6524;
  }
  .payment-form {
    border: unset;
  }
  .input-service-type,
  .input-uploadd {
    width: 98% !important;
  }
  .containerPg .image-uploader {
    border: 2px dashed #8686864c !important;
    padding: 18px 17px 17px !important;
    margin: 10px 5px;
  }

  .input-service-type,
  .image-uploader {
    width: 98% !important;
  }
  .add-services-page .containerPg .download {
    margin-right: 0px;
    margin-left: 0px;
    justify-content: end;
  }

  /* web */
  @media (min-width: 767px) {
    .vip-page .info {
      box-shadow: 8px 19px 29.3px 0px #0000000a;
      padding-inline-start: unset;
      margin-right: -65px;
      border-radius: 10px;
      padding: 50px 90px 35px 0;
      width: 100%;
      margin-top: -1.5em;
    }
    .packages-page .packages .btn {
      padding: 13px 50px;
    }
    .new-graph .nav-tabs {
      justify-content: center !important;
    }

    .partener-page .pack3.text-end.px-4.bttn {
      width: unset !important;
    }
    .partener-page .pack3.text-end.px-4.bttn {
      margin: 0 110px 0 -10px;
    }
    .partener-page .breadcrumbs .breadcrumb {
      padding: 0 50px;
    }
    .partener-page .packages .packagesDetails {
      height: unset;
      padding: 0;
      padding-bottom: unset;
    }
    .add-services-page .link,
    .vip-page .link,
    .booking-page .link,
    .packages-page .link,
    .contact-page .link,
    .contactus-page .link,
    .sucsses-page .link,
    .partener-page .link {
      padding-left: 15px;
    }
    .add-services-page .down {
      display: flex;
    }
    .add-services-page .containerPg .download {
      display: flex;
      margin-top: -15px;
    }
    .add-services-page .down .send2 {
      margin: 0 5px;
    }
    .add-services-page .containerPg .download {
      margin-right: 270px;
    }
    .booking-page .h4,
    h4 {
      font-size: 1rem;
    }
    .sucsses-page .carousel-indicators {
      bottom: -20px;
    }
    #page-content.account-summary .carousel.slide {
      margin-top: -0.7em;
    }
  }
  /* mobile */
  @media (max-width: 767px) {
    .add-services-page .containerPg .download {
      margin-right: 5px;
      margin-left: 5px;
      justify-content: end;
    }
    .packages-page .packages .btn {
      padding: 12px 15px;
    }
    .sucsses-page .slider.mt-5 {
      margin-top: 0 !important;
    }
    #page-content.account-summary .carousel.slide {
      margin: 0 !important;
    }
    #page-content {
      padding: 24px 0 0 0;
    }
    .add-services-page .down {
      display: flex;
    }
    .add-services-page .containerPg .download {
      display: flex;
      margin-top: -20px;
    }
    .add-services-page .down .send2 {
      margin: 0 5px;
    }
    ol.breadcrumb {
      max-width: 260px;
    }
    .contact-page .link,
    .contactus-page .link,
    .sucsses-page .link,
    .packages-page .link,
    .partener-page .link {
      display: flex;
      justify-content: end;
      text-align: end;
      margin-top: -45px;
      padding-left: unset;
    }
    #page-content.account-summary .account-sales .nav-tabs .nav-link {
      width: 90px !important;
      margin: 0px 3px !important;
    }
    .new-graph h2 {
      text-align: center;
    }
    .link2,
    .contactus-page .link2,
    .sucsses-page .link2,
    .packages-page .link2,
    .partener-page .link2 {
      /* margin-top: 15px; */
    }
    .packagesInfo {
      max-height: unset;
      overflow-y: unset;
    }
    .partener-page .packages .pack2 {
      width: 35%;
      display: inline-block;
      /* margin-top: 20px; */
      text-align: right;
    }
    .partener-page .packages .pack3 {
      width: 40% !important;
      display: inline-block;
    }
    .partener-page .packages .pack1 {
      width: 22%;
    }
    .packages-page .packages .containerPg {
      width: 100%;
    }
    .packages-page .packages .pack1 {
      width: 31%;
    }
    .packages-page .packages .pack1 h2 {
      font-size: 18px;
    }
    .packages-page .packages .pack1 h3 {
      font-size: 16px;
    }
    .sucsses-page .packages .info .btn {
      width: 100%;
      margin: 20px auto;
      background-color: #2c1d65;
      color: white;
      padding: 15px;
      display: block;
    }
    .sucsses-page .carding {
      padding-inline-end: 10px;
      padding-inline-start: 10px;
    }
    .breadcrumbs {
      /* padding: 0px 15px; */
    }
    .booking-page .packages .cardText .btn {
      background-color: #b4b4b4;
    }
    .booking-page .breadcrumbs {
      padding: 0px 0px;
    }
    .add-services-page .link {
      display: flex;
      justify-content: end;
      text-align: end;
      margin-top: -50px;
      padding-left: 20px;
    }

    .contactus-page .link {
      margin-top: -35px;
      padding-left: 15px;
    }
    .contact-page .link {
      margin-top: -20px;
      padding-left: 15px;
    }
    .packages-page .link,
    .partener-page .link {
      margin-top: -32px;
    }
    .sucsses-page .breadcrumbs {
      /* padding: 0px 15px; */
    }
    .x-gutter-mob {
      --bs-gutter-x: 0px;
    }
    .sucsses-page .link2 {
      margin-top: 12px;
    }
    .transfeer-page
      #page-content.transactions
      article.transactions-transfers
      .transfer
      .card
      .info {
      font-size: 8px;
    }
    .transfeer-page
      #page-content.transactions
      article.transactions-transfers
      .transfer
      .status {
      position: relative;
      bottom: auto;
      width: 50px;
      font-size: 10px;
    }
    .transfeer-page
      #page-content.transactions
      article.transactions-transfers
      .transfer
      .status {
      border-radius: 6px;
      padding: 0em 0.5rem;
      color: #ffffff !important;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: 500;
    }
    .transfeer-page .pagination a,
    .wallet-page .pagination a,
    .invoices-page .pagination a {
      padding: 3px 14px;
      margin: 0px 3px !important;
    }
    .prices-page #page-content.prices .special-prices .nav li {
      width: 100%;
    }
    #header .navbar .account-avatar {
      padding: 8px 0;
    }
    .prices-page #page-content.prices .special-prices {
      margin-top: 50px;
    }
    .prices-page header.second-menu h1.title-page {
      font-size: 15px;
    }
    .wallet-page ul.user-info li {
      text-align: center;
    }
    .wallet-page ul.user-info li {
      padding: 0.5em 1.3em;
    }
    .wallet-page .has-estate {
      padding: 1em 0.5em;
    }
    .wallet-page .has-estate .add-estate {
      font-size: 13px;
    }
    .invoices-page .transiction-card {
      margin-top: 3em;
    }
    ul.user-info li div p {
      text-align: center;
    }
    .input-service-type,
    .image-uploader {
      width: 100% !important;
    }
    .btnn-default img {
      width: 50%;
    }
    .btn-defaultt img {
      width: unset;
    }
  }

  /* mobile less */
  @media (max-width: 390px) {
    .add-services-page .containerPg .download {
      margin-right: 5px;
      margin-left: 5px;
      justify-content: end;
    }
    .partener-page .packages .pack2 p {
      font-size: 9px;
    }
    ul.user-info li div p {
      text-align: center;
    }
    .input-service-type,
    .image-uploader {
      width: 100% !important;
    }
    .vip-page ol.breadcrumb {
      max-width: 220px;
    }
    .vip-page .link {
      margin-top: -50px;
    }
    .vip-page .info {
      /* position: absolute; */
      bottom: 5%;
      padding: 15px 30px;
      left: 32px;
      background-color: white;
      box-shadow: 8px 19px 29.3px 0px #0000000a;
      border-radius: 10px;
      width: 95%;
      margin: auto;
      transform: translate(0px, -25px);
    }
    .vip-page .slider .cardImg::before {
      font-size: 12px;
      padding: 0;
    }
    .vip-page .slider .cardImg {
      height: 170px;
      padding-inline-start: 0px;
    }
    .vip-page .slider .cardImg .plus p {
      margin-inline-start: 30px;
    }
  }
  /* mobile more than less */
  @media (max-width: 359px) {
    .add-services-page .containerPg .download {
      margin-right: 5px;
      margin-left: 5px;
      justify-content: end;
    }
    #page-content.account-summary .account-sales .nav-tabs .nav-link {
      width: 80px !important;
      margin: 0px 2px !important;
    }
    .partener-page a.bttn2 {
      padding: 8px 7px !important;
      /* margin-top: 20px !important; */
      font-size: 10px !important;
    }
    .booking-page .back .icon {
      max-width: 20px;
      height: 20px;
    }
    .booking-page .link a {
      color: black;
      font-size: 14px;
      margin-top: 0px;
    }
    .booking-page .link2 {
      display: flex;
      justify-content: end;
      text-align: end;
      padding: 5px 7px;
      border: 1px solid black;
      border-radius: 50px;
    }
    .booking-page .packages .cardText .btn {
      padding: 10px 15px;
      font-size: 12px;
    }
    .booking-page .packages .cardText h3 {
      font-size: 12px;
      margin: 8px 10px;
    }
    .booking-page .imgage img {
      height: 90px;
    }
    .transactions .card-body {
      padding: 0 !important;
    }
    #page-content.transactions
      article.transactions-transfers
      .transfer
      .card
      .transfers-code {
      justify-content: center;
      padding-left: 7em;
      color: rgba(44, 29, 101, 1);
      font-size: 10px;
    }
    ul.user-info li div p {
      text-align: center;
    }
    .transfeer-page .pagination a,
    .wallet-page .pagination a,
    .invoices-page .pagination a {
      padding: 3px 12px;
      margin: 0px 3px !important;
    }
    .input-service-type,
    .image-uploader {
      width: 100% !important;
    }
    #page-content.transactions
      article.transactions-transfers
      .transfer
      .card
      .card-body
      article
      .box
      .text {
      width: 90%;
      margin: auto;
    }
    .packages-page .link2,
    .vip-page .link2 {
      margin-top: 5px;
      padding: 5px 10px;
    }
    .packages .phone {
      padding-inline-start: 10px;
    }
  }
  .booking-page .packages .cardText .btn {
    background-color: rgba(231, 231, 231, 1);
  }
  .booking-page .packages .cardText .btn {
    color: rgba(112, 112, 112, 1);
  }

  /*profile - wallet*/
  .avatar-upload {
    position: relative;
    max-width: 205px;
    max-height: 205px;
  }
  .avatar-upload .avatar-edit {
    position: absolute;
    right: -10px;
    z-index: 1;
    bottom: -10px;
    transform: translate(-50%, -50%);
  }
  .avatar-upload .avatar-edit input {
    display: none;
  }
  .avatar-upload .avatar-edit input + label {
    display: inline-block;
    width: 34px;
    height: 34px;
    margin-bottom: 0;
    border-radius: 100%;
    background: #ffffff;
    cursor: pointer;
    font-weight: normal;
    transition: all 0.2s ease-in-out;
    display: flex;
  }
  .avatar-upload .avatar-edit input + label:hover {
    background: #f1f1f1;
    border-color: #d6d6d6;
  }
  .avatar-upload .avatar-edit input + label:after {
    content: '\f030';
    font-family: 'FontAwesome';
    color: #2f375f;
    text-align: center;
    margin: auto;
  }
  .avatar-upload .avatar-preview {
    aspect-ratio: 3 / 3;
    width: 100%;
    /*height: 172px;*/
    position: relative;
    border-radius: 100%;
    border: 1px solid lightgrey;
  }
  .avatar-upload .avatar-preview > div {
    width: 100%;
    height: 100%;
    border-radius: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
  }
  /*breadcrumb*/
  ul.breadcrumb {
    padding: 10px 16px;
    list-style: none;
    display: flex;
    align-items: center;
  }
  ul.breadcrumb li {
    display: inline;
    font-size: 16px;
    font-weight: 700;
  }
  ul.breadcrumb li:last-child {
    color: #2c1d65;
  }
  ul.breadcrumb li svg {
    margin-right: 0.5rem;
    margin-left: 0.5rem;
  }
  ul.breadcrumb li a {
    color: #9b9b9b;
    text-decoration: none;
  }
  ul.breadcrumb li a:hover {
    color: #797979;
  }

  ul.user-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  ul.user-info li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: 1px solid #2c1d6524;
    padding: 0.3em 1em;
    border-radius: 5px;
  }
  ul.user-info li img {
    margin-left: 1em;
  }
  ul.user-info li div p {
    /* font-family: Effra; */
    font-family: 'Effra', sans-serif !important;

    font-size: 12px;
    font-weight: 500;
    line-height: 21px;
    text-align: start;
  }
  @media (max-width: 767px) {
    ul.user-info li div p {
      text-align: center;
    }
  }
  .user-name {
    /* font-family: Effra; */
    font-family: 'Effra', sans-serif !important;

    font-size: 22px;
    font-weight: 700;
    text-align: start;
    margin-bottom: 0.8em;
  }
  ul.user-info li div h3 {
    /* font-family: Effra; */
    font-family: 'Effra', sans-serif !important;

    font-size: 16px;
    font-weight: 700;
    line-height: 21px;
    text-align: start;
  }
  .user-infoo {
    display: inline-grid;
    align-items: end;
    height: 100%;
    width: 100%;
  }

  .has-estate {
    display: inline-flex;
    border: 1px solid rgba(211, 211, 211, 0.46);
    border-radius: 10px;
    justify-content: space-between;
    align-items: center;
    padding: 1em;
    width: 70%;
  }

  .has-estate h3 {
    color: #524782;
    font-size: 18px;
    font-weight: 600;
  }
  .has-estate p {
    color: #bababa;
    font-size: 13px;
  }
  .has-estate .add-estate {
    border-radius: 10px;
    padding: 0.6em 1.5em;
    transition: 0.5s;
  }
  .has-estate .add-estate:hover {
    background: #524782;
    color: #ffffff;
  }
  .addstate-col {
    align-items: center;
    display: flex;
    justify-content: end;
  }
  .profile-tabs .nav-tabs .nav-item .nav-link {
    padding-right: 0;
    padding-left: 0;
    background: transparent;
    border: none !important;
    border-color: transparent;
    margin-left: 2em;
    color: rgba(115, 115, 115, 0.87);
    font-weight: 800;
  }

  .profile-tabs .nav-tabs .nav-link:focus,
  .profile-tabs .nav-tabs .nav-link:hover {
    border: none;
  }
  .profile-tabs .nav-tabs .nav-link.active {
    color: #cb1b64;
    border-bottom: 2px solid #cb1b64 !important;
  }
  .profile-tabs .total-row {
    display: flex;
    justify-content: center;
  }
  .profile-tabs .total-row .total-div {
    background: linear-gradient(90deg, #cb1b64 0%, #331d66 100%);
    padding: 1em;
    border-radius: 10px;
  }
  .profile-tabs .total-row .total-div a {
    color: #ffffff;
    border-bottom: 1px solid #ffffff;
  }
  .profile-tabs .total-row .total-number {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 1.5em 0 3em 0;
  }
  .profile-tabs .total-row .total-number * {
    margin: 0 0.2em;
    color: #ffffff;
  }
  .profile-tabs .total-row .total-number small {
    margin: 0 2em;
  }
  .profile-tabs .total-row .total-number h3 {
    font-size: 30px;
    font-weight: 700;
    line-height: 26px;
    text-align: left;
  }
  .transactions-list .nav-pills .nav-link.active,
  .transactions-list .nav-pills .show > .nav-link {
    background: transparent;
  }
  .transactions-list .nav-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: transparent;
    font-size: 10px !important;
    font-weight: 500 !important;
    line-height: 21px !important;
    color: #2c1d656e !important;
  }
  .transactions-list .nav-link img {
    display: block !important;
  }
  .transactions-list {
    background: #ffffff;
    border-radius: 10px;
    margin-top: -20px;
    box-shadow: 8px 19px 29.3px 0px #0000000a;
  }
  .transactions-list .item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #2c1d650a;
    margin: 1em;
    border-radius: 5px;
    padding: 0.5em;
  }
  .transactions-list .item h3 {
    font-size: 12px;
    font-weight: 500;
    line-height: 26px;
    text-align: right;
    color: #000000;
  }
  .transactions-list .item p {
    font-size: 10px;
    font-weight: 500;
    line-height: 21px;
    text-align: right;
    color: #2c1d656e;
  }
  .transactions-list .item .price {
    font-size: 12px;
    font-weight: 500;
    line-height: 26px;
    text-align: left;
  }
  .transactions-list .item .price.minus {
    color: #ff0404;
  }
  .transactions-list .item .price.plus {
    color: var(--main-color);
  }
  .transactions-list .tab-content {
    padding-bottom: 1em;
    margin-bottom: 4em;
  }

  .primary-bg {
    background: #2c1d65;
    color: #ffffff;
  }
  @media (max-width: 767px) {
    .container-lg-mob {
      /* display: none; */
      padding: 0 10px !important;
    }
    .avatar-upload {
      position: relative;
      width: 60%;
      aspect-ratio: 3 / 3;
      display: inline-block;
    }
    ul.user-info li {
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 1em 2em;
    }
    ul.user-info li img {
      margin-left: 0;
    }
    .has-estate {
      margin-top: 2em;
      width: 100%;
    }
    .profile-tabs .total-row .total-number small {
      margin-right: 0;
    }
    .transactions-list {
      margin-right: 15px;
      margin-left: 15px;
    }
    .user-name {
      text-align: center;
    }
  }

  /*wallet payment form*/
  .payment-form {
    border: 1px solid #2c1d6524;
    border-radius: 15px;
    padding: 2em;
    margin-bottom: 4em;
  }
  .payment-form form {
    margin-right: 6vw;
    margin-left: 6vw;
  }

  .payment-form .title {
    font-size: 24px;
    font-weight: 700;
    line-height: 28.8px;
    text-align: center;
    color: #2c1d65;
  }

  .payment-form .form-group {
    display: block;
    position: relative;
    overflow: hidden;
  }
  .payment-form .clearBtn {
    position: absolute;
    top: 39px;
    left: 1em;
    transition: right 0.2s;
  }
  .payment-form input {
    border: 1px solid #2c1d65;
  }
  .payment-form label {
    /* font-family: Effra; */
    font-family: 'Effra', sans-serif !important;
    font-size: 13px;
    font-weight: 400;
    line-height: 16px;
    text-align: right;
    color: #2c1d65;
    margin-bottom: 1em;
  }

  #wrapper .radio-button-container {
    color: rgba(0, 0, 0, 0.75);
    display: block;
    position: relative;
    padding-right: 45px;
    line-height: 25px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 18px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid #2c1d6533;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    border-radius: 10px;
    background: rgba(234, 230, 255, 1);
  }
  #wrapper .radio-button-container:has(> input:checked) {
    border-color: #2c1d65;
  }
  #wrapper .radio-button-container input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
  }

  #wrapper .checkmark {
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    right: 0;
    height: 15px;
    width: 15px;
    background-color: rgba(0, 0, 0, 0);
    border-radius: 50%;
    border: 2px solid rgba(0, 0, 0, 0.25);
    transition: all 0.3s;
  }

  #wrapper .radio-button-container:hover input ~ .checkmark {
    border-color: rgba(0, 0, 0, 0.5);
  }

  #wrapper .radio-button-container input:checked ~ .checkmark {
    background-color: rgba(0, 0, 0, 0);
    border-color: #2c1d65;
  }

  #wrapper .checkmark:after {
    content: '✓';
    position: absolute;
    display: none;
    color: #fff;
    line-height: 1.6;
    font-size: 10px;
    text-align: center;
  }

  #wrapper .radio-button-container input:checked ~ .checkmark:after {
    display: block;
  }

  #wrapper .radio-button-container .checkmark:after {
    top: -2px;
    right: -2px;
    height: 15px;
    width: 15px;
    border-radius: 50%;
    background: #2c1d65;
  }
  #wrapper {
    margin-bottom: 5rem;
  }
  .payment-form .button-div {
    box-shadow: 0px 0px 18.7px 0px #0000000f;
    padding: 1em;
    border-radius: 10px;
  }
  .payment-form .button-div .total-btn {
    color: #000000;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .payment-form .button-div .total-btn * {
    font-size: 14px;
    font-weight: 500;
    line-height: 26px;
    text-align: right;
  }
  .payment-form .button-div .btn-black {
    background: #000000;
    color: #ffffff;
  }
  .payment-form .button-div .btn-black:hover {
    background: #ffffff;
    color: #000000;
    border: 1px solid black;
  }
  .payment-form .button-div .btn-green {
    background: var(--main-color);
    color: #000000;
  }
  .payment-form .button-div .tabby-btn,
  .payment-form .button-div .visa-btn {
    width: 100%;
    font-size: 14px;
    font-weight: 400;
    line-height: 26px;
    color: white;
    background-color: var(--main-color);
    padding: 13px 30px;
    border: 2px solid var(--main-color);
    border-radius: 8px;
    -webkit-transition: var(--main-transition);
    transition: var(--main-transition);
    text-align: center;
    transition: 0.5s;
  }
  .payment-form .button-div .tabby-btn:hover,
  .payment-form .button-div .visa-btn:hover {
    background-color: white;
    color: var(--main-color);
    font-weight: 600;
  }
  .payment-form .button-div .btn-default {
    background: #ffffff;
    color: #000000;
    border: 1px solid #000000 !important;
  }
  .payment-form .button-div .btn-default:hover {
    background: #000000;
    color: #ffffff;
    border: 1px solid #ffffff;
  }
  .payment-form .button-div .btn {
    direction: ltr;
    padding: 0;
    margin-top: 1.5em;
    transition: 0.5s;
    /* border:1px solid transparent; */
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
    text-align: center;
  }
  .payment-form .button-div .btn.btn-green {
    color: white;
    background-color: var(--main-color);
    /* padding: 13px 30px; */
    border: 2px solid var(--main-color);
    border-radius: 8px;
    -webkit-transition: var(--main-transition);
    transition: var(--main-transition);
    text-align: center;
    /* margin-top: 32px; */
  }
  .payment-form .button-div .btn-green:hover {
    background-color: #fff;
    color: var(--main-color);
    border: 1px solid var(--main-color);
  }
  .nav.nav-pills li.nav-item button.nav-link.active svg {
    /* filter: invert(48%) sepia(79%) saturate(2476%) hue-rotate(86deg) brightness(118%) contrast(119%); */
    /* filter: invert(11%) sepia(86%) saturate(6053%) hue-rotate(351deg) brightness(89%) contrast(84%); */
    /* filter: invert(15%) sepia(94%) saturate(6201%) hue-rotate(1deg) brightness(116%) contrast(107%); */
    filter: invert(16%) sepia(61%) saturate(5342%) hue-rotate(355deg)
      brightness(93%) contrast(134%);
  }
  @media (max-width: 767px) {
    .payment-form {
      border: none;
      padding: 2em;
    }
    .payment-form form {
      margin-right: 1vw;
      margin-left: 1vw;
    }
    #myChart {
      width: 100% !important;
    }
    #page-content.account-summary
      .account-sales
      .nav-tabs
      .nav-item.show
      .nav-link,
    #page-content.account-summary .account-sales .nav-tabs .nav-link {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 60px;
      margin: 0 1em;
      height: 30px;
      border-radius: 5px;
      border: 1px solid #2c1d6512;
      color: #2c1d6566;
      font-weight: 500;
      background: #ffffff;
      font-size: 12px;
    }
    /* #page-content.account-summary .account-sales .nav-tabs .nav-link {
          width: 100px !important;
          height: 55px !important;
          border-radius: 8px !important;
          margin: 0 !important;
      } */
  }
  @media (min-width: 992px) {
    #page-content.account-summary .account-sales .info {
      /* margin-top: 3.5em; */
    }
  }

  /* pagination */

  .pagination {
    display: inline-block;
    direction: ltr;
  }

  .pagination a {
    color: #2c1d65;
    background: #f7f6f9;
    float: left;
    padding: 8px 16px;
    text-decoration: none;
    margin: 0 0.3em;
    font-weight: 600;
    border-radius: 5px;
    transition: 0.5s;
  }
  .pagination a.active {
    background: #2c1d65;
    color: #ffffff;
  }
  .pagination a:hover {
    background: #2c1d65;
    color: #ffffff;
  }
  .pagination a.more {
    color: #000000;
    background: transparent;
    margin: 0;
    padding-right: 0;
    padding-left: 0;
  }
  .vip-page .slider .cardImg::after {
    display: none;
  }
  .payment-div img {
    width: unset;
    height: unset;
    object-fit: unset;
    display: unset !important;
  }
  .payment-div .btnn-default img {
    width: 50%;
  }
  .payment-div .containerPg {
    width: 100%;
    margin: auto;
    border: 1px solid #2c1d6524;
    border-radius: 10px;
    padding: 0.5em;
    padding-left: 4em;
    padding-bottom: 2em;
    margin-bottom: 2em;
  }
  .payment-div .containerPg .input {
    width: 99%;
    margin: 10px auto;
  }
  .payment-div h3 {
    font-size: 13px;
    text-align: start;
    font-weight: 700;
    color: #2c1d65;
    border-radius: 10px;
    margin-bottom: 10px;
  }
  .payment-div h2 {
    font-size: 16px;
    text-align: start;
    font-weight: bold;
    /* color: #2C1D65; */
    border-radius: 10px;
    margin-bottom: 20px;
  }
  .payment-div .payment-form form {
    margin-right: unset;
    margin-left: unset;
  }
  .payment-div .containerPg h3 {
    font-size: 13px;
    text-align: start;
    font-weight: 700;
    color: #000;
    border-radius: 10px;
    margin-bottom: 50px;
  }
  .payment-div .containerPg label {
    font-size: 13px;
    text-align: start;
    font-weight: 700;
    color: #000;
    border-radius: 10px;
    margin-bottom: 0px;
  }
  .payment-div input {
    padding: 10px 17px !important;
  }
  .payment-div .last-input input {
    border: unset !important;
    margin: 0 !important;
    padding: 5px 17px !important;
  }
  .payment-div .last-input .input-two {
    border-right: 1px solid #2c1d6524 !important;
  }
  .last-input-div {
    padding: 5px 0;
    border: 1px solid #2c1d6524;
    border-radius: 5px !important;
  }
  .row.margin-t {
    margin-top: 5px !important;
  }
  .payment-div .payment-form {
    padding: 0 !important;
    border: unset !important;
  }
  .payment-div .radio-button-container h2,
  .payment-div .radio-button-container h3 {
    margin: 0 10px;
  }
  .new-booking .row.mt-0 {
    margin-top: 0 !important;
  }
  .payment-div #wrapper .radio-button-container {
    min-height: 55px;
    background: rgba(234, 230, 255, 1);
    display: flex;
    align-items: center;
  }
  @media (max-width: 767px) {
    .payment-div .payment-form {
      padding: 0 !important;
      border: unset !important;
      border-top: 1px dashed rgba(44, 29, 101, 0.2) !important;
      border-radius: 0;
      margin-top: 25px;
      padding-top: 25px !important;
    }
    .payment-div .containerPg {
      padding-left: 2em;
    }
    .wallet-page .transactions-list .tab-content {
      margin-bottom: unset;
    }
  }
  /* new 3/7 mazaya and marafeq */
  .filed-box.mazaya-box .checkbox-field label {
    display: flex;
    border: 1px solid rgba(0, 0, 0, 0.09);
    width: 95%;
    height: 60px;
    border-radius: 10px;
    align-items: center;
    justify-content: start;
    padding-right: 8px;
    margin: 0;
    transition: 0.5s;
  }
  .icon-meza {
    object-fit: contain;
    margin: 0px 0px 0px 8px;
  }
  .filed-box.mazaya-box .checkbox-field input[type='checkbox'] {
    width: 0px !important;
    height: 0px !important;
    opacity: 0 !important;
  }
  .filed-box.mazaya-box .checkbox-field input[type='checkbox']:checked {
    width: 2px !important;
    height: 0px !important;
    opacity: 0 !important;
  }
  /* .filed-box.mazaya-box .checkbox-field label > input[type=checkbox]:checked {
   background-color: red !important;
  } */
  .filed-box.mazaya-box
    .checkbox-field
    label:has(> input[type='checkbox']:checked) {
    background-color: rgba(215, 0, 96, 1);
    color: #fff !important;
  }
  .filed-box.mazaya-box
    .checkbox-field
    label:has(> input[type='checkbox']:checked)
    img {
    filter: brightness(0) invert(1);
  }
  #content.add-real-estate
    section.add-estate-section
    .real-estate-info
    form.add-estate-info
    .checkbox-field {
    justify-content: center;
  }
  #content.add-real-estate
    section.add-estate-section
    .real-estate-info
    form.add-estate-info
    .checkbox-field
    label {
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    line-height: 14px;
    color: var(--black-color);
    width: 100%;
  }
  @media (min-width: 767px) {
    #content.add-real-estate section.add-estate-section .layout .filed-box {
      grid-template-columns: repeat(4, calc((100% - 0px) / 4));
    }
    #content.add-real-estate section.add-estate-section .layout .filed-box,
    #content.add-real-estate
      section.add-estate-section
      .real-estate-info
      form.add-estate-info
      .checkbox-field {
      gap: 12px 0;
    }
  }

  @media (max-width: 767px) {
    .filed-box.mazaya-box .checkbox-field label {
      width: 100px;
      height: 50px;
    }
  }

  /*************** Start style protection claims *****************/
  #page-content.host-protection section.protection-claims {
    display: -ms-grid;
    display: unset;
    -ms-grid-columns: 1fr 24px 350px;
    grid-template-columns: 1fr 350px;
    gap: 24px;
    margin-bottom: 24px;
  }
  @media (max-width: 991px) {
    #page-content.host-protection section.protection-claims {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: reverse;
      -ms-flex-direction: column-reverse;
      flex-direction: column-reverse;
      gap: 64px;
    }
  }
  #page-content.host-protection section.protection-claims .claim {
    border: 1px solid #d6d6d6;
    border-radius: 8px;
    padding: 16px 12px;
    position: relative;
  }
  #page-content.host-protection
    section.protection-claims
    .claim:not(:last-child) {
    margin-bottom: 16px;
  }
  #page-content.host-protection section.protection-claims .claim .text {
    margin-bottom: 4px;
  }
  #page-content.host-protection section.protection-claims .claim .text h3 {
    font-size: 14px;
    font-weight: 600;
    line-height: 26px;
    color: var(--black-color);
    display: inline;
  }
  #page-content.host-protection section.protection-claims .claim .text p {
    font-size: 14px;
    font-weight: 600;
    line-height: 26px;
    color: var(--text-color);
    display: inline;
  }
  #page-content.host-protection section.protection-claims .claim .text .price {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    gap: 4px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }
  #page-content.host-protection
    section.protection-claims
    .claim
    .text
    .price
    .number {
    font-size: 16px;
    font-weight: 600;
    line-height: 30px;
    color: var(--main-color);
  }
  #page-content.host-protection
    section.protection-claims
    .claim
    .text
    .price
    .currency {
    font-size: 10px;
    font-weight: 400;
    line-height: 19px;
    color: var(--text-color);
  }
  #page-content.host-protection section.protection-claims .claim .status {
    position: absolute;
    top: 16px;
    left: 12px;
    font-size: 14px;
    font-weight: 600;
    line-height: 26px;
  }
  #page-content.host-protection section.protection-claims .claim .status.accept {
    color: #136616;
  }
  #page-content.host-protection
    section.protection-claims
    .claim
    .status.unaccept {
    color: var(--second-color);
  }
  .claim-item > section {
    /* transition: 0.5s; */
  }
  .claim-item > section:hover {
    /* transform: scale(0.9); */
  }
  @media (min-width: 767px) {
    #page-content.host-protection section.protection-claims {
      margin-top: 1.2em;
      display: block;
    }
    .payment-sec {
      margin-top: 1em;
    }
    .claims-user #header .container-lg,
    .my-index #header .container-lg {
      max-width: 1250px;
    }
  }

  /* clickable img */
  .popup {
    margin: auto;
    display: flex;
    flex-wrap: wrap;
  }
  .popup img {
    cursor: pointer;
    width: 128px;
    height: 128px;
    margin: 5px;
  }
  /*.show{*/
  /*  z-index: 999;*/
  /*}*/
  .showw {
    z-index: 999;
    display: none;
  }
  .show .overlay {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.66);
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 9;
  }
  .show .img-show {
    width: 600px;
    height: 400px;
    background: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    overflow: hidden;
    position: fixed;
    z-index: 99;
  }
  .img-show span {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 99;
    cursor: pointer;
    background: #fff;
    border-radius: 50px;
    padding-top: 1px;
    width: 25px;
    height: 25px;
    text-align: center;
  }
  .img-show img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain;
  }
  body {
    position: relative;
  }
  @media (max-width: 767px) {
    .show .img-show {
      width: 100%;
      height: 250px;
    }
  }
  /*************** End style protection claims *****************/
  /* edits for new wallet page */
  .myidtab {
    display: none;
  }
  /* edits for dashboard pages style */
  @media (min-width: 767px) {
    header.second-menu .menu {
      margin-top: 2.5em;
    }
  }
  @media (max-width: 767px) {
    .my-new-user-info {
      display: flex !important;
      flex-direction: row !important;
    }
    ul.my-new-user-info li {
      padding: 1em !important;
    }
  }
  /* old mazaya */
  /* .filed-box.mazaya-box .checkbox-field label.real_estate_unit_facilities_internet-1,
  .filed-box.mazaya-box .checkbox-field label.real_estate_unit_facilities_elevators-2,
  .filed-box.mazaya-box .checkbox-field label.real_estate_unit_facilities_security-3,
  .filed-box.mazaya-box .checkbox-field label.real_estate_unit_facilities_beach-4,
  .filed-box.mazaya-box .checkbox-field label.real_estate_unit_facilities_tv-5,
  .filed-box.mazaya-box .checkbox-field label.real_estate_unit_facilities_football-6,
  .filed-box.mazaya-box .checkbox-field label.real_estate_unit_facilities_balcony-7,
  .filed-box.mazaya-box .checkbox-field label.real_estate_unit_facilities_cinema-8
  {
    display: none;
  } */
  /* new mazaya */
  #content.add-real-estate
    section.add-estate-section
    .real-estate-info
    form.add-estate-info
    .checkbox-field.real_estate_unit_facilities_internet-1,
  #content.add-real-estate
    section.add-estate-section
    .real-estate-info
    form.add-estate-info
    .checkbox-field.real_estate_unit_facilities_elevators-2,
  #content.add-real-estate
    section.add-estate-section
    .real-estate-info
    form.add-estate-info
    .checkbox-field.real_estate_unit_facilities_security-3,
  #content.add-real-estate
    section.add-estate-section
    .real-estate-info
    form.add-estate-info
    .checkbox-field.real_estate_unit_facilities_beach-4,
  #content.add-real-estate
    section.add-estate-section
    .real-estate-info
    form.add-estate-info
    .checkbox-field.real_estate_unit_facilities_tv-5,
  #content.add-real-estate
    section.add-estate-section
    .real-estate-info
    form.add-estate-info
    .checkbox-field.real_estate_unit_facilities_football-6,
  #content.add-real-estate
    section.add-estate-section
    .real-estate-info
    form.add-estate-info
    .checkbox-field.real_estate_unit_facilities_balcony-7,
  #content.add-real-estate
    section.add-estate-section
    .real-estate-info
    form.add-estate-info
    .checkbox-field.real_estate_unit_facilities_cinema-8 {
    display: none;
  }
  .hidden-mazaya-box label {
    background-color: rgba(215, 0, 96, 1) !important;
    color: #fff !important;
  }
  .hidden-mazaya-box label img {
    filter: brightness(0) invert(1);
  }

  /* new edits 18/7 */
  .pagination a {
    float: right;
  }
  .pagination a svg {
    transform: rotate(180deg);
  }
  /* new edits 21/7 */
  #page-content.account-summary .account-sales .content header {
    display: none !important;
  }
  #page-content {
    overflow-y: unset !important;
  }
  @media (min-width: 992px) {
    #page-content.account-summary .account-sales .info {
      margin-top: unset !important;
    }
  }
  /* new 31/7 */
  .payment-divv .containerPg {
    width: 100%;
    margin: auto;
    border: 1px solid #2c1d6524;
    border-radius: 10px;
    padding: unset;
    padding-left: 4em;
    padding-bottom: 2em;
    margin-bottom: 2em;
  }
  .payment-divv .payment-form {
    border: 1px solid #2c1d6524 !important;
    padding: 2em !important;
  }
  .packagesInfo h3,
  .packages .cardText .btn {
    /* font-family: 'Tajawal', sans-serif; */
  }
  .packages .containerPg .input {
    padding: 17px;
    /* width: 48%; */
    /* display: inline-block; */
    margin: 10px 5px;
    border: 1px solid #8686864c;
    border-radius: 5px;
    font-size: 12px;
  }
  .packagesInfo {
    /* font-family: 'Cairo'; */
  }
  .containerPgbigdiv {
    width: 100%;
    margin: auto;
    border: 1px solid #2c1d6524;
    border-radius: 20px;
    padding: 0.5em;
    padding-bottom: 2em;
    margin-bottom: 2em;
    padding-top: 1em;
  }
  .payment-divv .containerPg {
    border: unset;
    padding-bottom: 0;
    margin: 0;
  }
  .last-input {
    width: 50%;
  }

  /* new 5/8 */
  .img-show img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain;
  }

  body,
  .packagesInfo {
    /* font-family: 'Tajawal', sans-serif; */
    font-family: 'Effra', sans-serif !important;
    /* font-weight: bold; */
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
    line-height: 1.5;
    /* font-weight: Medium; */
  }
  .packagesInfo {
    font-size: 17px;
  }
  /* new 6/8 */
  .link2 {
    border: 1px solid var(--main-color) !important;
    transition: 0.5s;
  }
  .link2 a {
    color: var(--main-color) !important;
    margin-left: 10px;
  }
  .link2:hover {
    background: var(--main-color);
    cursor: pointer;
  }
  .link2:hover a {
    color: #fff !important;
  }

  .my-arrow {
    margin: auto;
    fill: var(--main-color);
    color: var(--main-color);
  }
  .link2:hover .my-arrow {
    fill: #fff;
    color: #fff;
  }
  /* new for packages and real state */
  /* #card .imgage img {
    display: block;
    width: 100% !important;
    object-fit: cover;
    border-radius: 20px;
    overflow: hidden;
    margin: 1rem 0;
  }
  .packages.mb-0.mb-md-5 .packagesInfo.rounded-3.pt-5 .slider.mt-5.px-3 {
    margin-bottom: 3rem;
  }
  #card {
    margin: 1rem 0;
  } */

  /* new 13/8 */
  @media (min-width: 767px) {
    .vip-page .info {
      box-shadow: 8px 19px 29.3px 0px #0000000a;
      padding-inline-start: unset;
      margin-right: -65px;
      border-radius: 10px;
      padding: 7px 90px 50px 50px !important;
      width: 100%;
      margin-top: -1.5em !important;
      height: 21.5rem;
    }
    .vip-page .info ul {
      display: flex;
      flex-direction: column;
      height: 12.5rem;
      overflow: auto;
    }
    .vip-page .info .send2 {
      display: block;
      margin-bottom: 0;
      margin-top: auto;
    }
    .vip-page .slider .cardImg {
      padding-inline-start: unset !important;
      justify-content: center !important;
    }
    .vip-page .slider .cardImg .send .btn {
      display: none;
    }
    .vip-page .packages .info .btn {
      margin-top: 0 !important;
    }
    .vip-page .info ul li {
      padding-bottom: 13px !important;
    }
  }

  #content.add-real-estate
    section.add-estate-section
    .real-estate-info
    form.add-estate-info
    .checkbox-field
    input[type='checkbox'] {
    width: 20px !important;
    height: 20px !important;
  }
  #content.add-real-estate
    section.add-estate-section
    .real-estate-info
    form.add-estate-info
    .box-between
    .checkbox-field
    input[type='radio'] {
    width: 30px !important;
    height: 16px !important;
  }
  @media (max-width: 360px) {
    #page-content.transactions
      article.transactions-transfers
      .transfer
      .card
      .transfers-code {
      justify-content: start;
      padding-right: 5rem;
    }
  }
  @media (min-width: 361px) and (max-width: 400px) {
    #page-content.transactions
      article.transactions-transfers
      .transfer
      .card
      .transfers-code {
      justify-content: start;
      padding-right: 6rem;
    }
  }
  @media (max-width: 767px) {
    #page-content {
      overflow-y: hidden !important;
    }
    .packages .packagesDetails {
      height: unset;
      padding-top: unset;
      padding-bottom: unset;
    }
    #content.add-real-estate
      section.add-estate-section
      .real-estate-info
      form.add-estate-info
      .add-estate {
      width: 100% !important;
      margin: unset !important;
    }
  }
  a,
  button,
  .btn {
    font-family: 'Effra', sans-serif !important;
  }