@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Kalam:wght@300;400&family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700&display=swap");
@import url('https://fonts.googleapis.com/css2?family=Kalam:wght@300;400;700&display=swap');

* {
  padding: 0px;
  margin: 0px;
  box-sizing: border-box;
}

body {
  padding: 0px;
  margin: 0px;
  font-family: "Poppins", sans-serif;
  background-color: #616264;
}

body::-webkit-scrollbar {
  width: 10px;
  height: 150px;
}

body::-webkit-scrollbar-track {
  background: #fff;
}

body::-webkit-scrollbar-thumb {
  background-color: #e50916;
  border: 1px solid #fff;
  border-radius: 5px;
}

a {
  text-decoration: none !important;
  outline: none !important;
}

img {
  border: none;
}

.clr {
  clear: both;
}

/*HEADER-SECTION*/

/* NAV-STRIP */

.nav-wrap {
  width: 100%;
  padding: 5px 0px;
  height: auto;
  background: #000;
}

.nav-wrap a.navbar-brand {
  width: auto;
}

.nav-wrap a.navbar-brand img {
  width: 100%;
  min-width: 190px;
  height: auto;
}

.nav-location {
  margin-right: auto;
  margin-left: 100px;
  display: flex;
  align-items: center;
  gap: 4px;
}

.nav-location select {
  background: none;
  border: none;
  color: #4f4f4f;
  font-size: 16px;
  font-weight: 400;
  outline: none;
  cursor: pointer;
}

.nav-wrap ul.navbar-nav {
  gap: 50px;
  display: flex;
  align-items: center;
  margin-left: auto;
}

/* #navbarNav {
  display: flex;
  justify-content: flex-end;
} */

.nav-wrap ul.navbar-nav li.nav-item a {
  color: #fff;
  font-size: 16px;
  font-weight: 500;
  padding: 0;
}

.my-profile-nav a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 13px !important;
}

.my-profile-nav a img {
  width: 20px;
  height: auto;
}

.nav-wrap ul.navbar-nav li.nav-item a.active {
  color: #ce2127;
}

.nav-wrap ul.navbar-nav li.nav-item a:hover {
  color: #ce2127;
}

.nav-wrap ul.navbar-nav li.nav-item:last-child a {
  border-radius: 4px;
  background: var(--App-Red, #ce2127);
  color: #fff;
  padding: 10px 35px;
  font-weight: 500;
}

/* NAV-STRIP */

/* LOGIN CSS */

/* USER-SIGN-IN */

/* new */

.sign-in-wrap {
  width: 100%;
  height: calc(100vh - 85px);
  padding: 40px 0;
  background: linear-gradient(90deg, #1f1f1f 50%, #616264 50%);
}

.sign-in-inner {
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  flex-direction: column;
  margin-top: 3%;
}

.login-box-wrap {
  border-radius: 11px;
  border: 1px solid #343434;
  background: #000;
  padding: 32px;
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.25);
}

.login-box-wrap h1 {
  color: var(--white, #fff);
  text-align: center;
  font-family: Poppins;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
}

.sign-in-inner ul {
  padding-left: 0px;
  margin-top: 45px;
}

.sign-in-inner li i {
  margin-right: 7px;
}

.inner-image {
  /* margin: revert; */
  display: flex;
  justify-content: center;
}

.inner-image img {
  width: 100%;
  min-width: 270px;
}

.sign-in-inner li {
  color: #fff;
  font-family: Poppins;
  font-size: 18px;
  font-weight: 400;
  line-height: 23px;
  list-style-type: none;
  margin-bottom: 21px;
}

.login-box-wrap form {
  width: 80%;
  height: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 15px;
}

.share-detail-wrap {
  height: auto;
  max-width: 650px;
  padding: 20px;
  border-radius: 20px;
  border: 1px solid #343434;
  background: #000;
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.25);
  margin: auto;
}

.share-detail-heading {
  width: 100%;
  height: auto;
  text-align: center;
}

.share-detail-heading h1 {
  font-weight: 600;
  font-size: 24px;
  color: #fff;
  margin: 17px 0 18px 0;
  font-family: "Poppins";
}

.share-detail-form {
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 15px;
}

.share-detail-form label {
  border: none;
  outline: none;
  width: 100%;
  height: 45px;
  margin: 0;
  /* background: #fff; */
  border-radius: 0px 30px 30px 0px;
  position: relative;
  display: flex;
  align-items: center;
}

.share-detail-form label input[type="text"] {
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  border-radius: 50px;
  background: var(--text-color, #58585a);
  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.25);
  /* border-radius: 6px 6px 6px 6px; */
  padding-left: 55px;
  /* margin-bottom: 6px; */
  padding-right: 40px;
  font-size: 14px;
  /* border: 1px solid #B6B6B6; */
  color: #fff;
}

.share-detail-form label input[type="text"]::placeholder {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.share-detail-form label input[type="password"]::placeholder {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.share-detail-form label input[type="password"] {
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  border-radius: 50px;
  background: var(--text-color, #58585a);
  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.25);
  /* border-radius: 6px 6px 6px 6px; */
  padding-left: 55px;
  /* margin-bottom: 6px; */
  padding-right: 40px;
  font-size: 14px;
  /* border: 1px solid #B6B6B6; */
  color: #fff;
}

.share-detail-form label .password-eye {
  position: absolute;
  right: 10px;
}

.share-detail-form label .eye-close {
  background-image: url(../images/login-imgs/eye-close.svg);
  width: 30px;
  height: 30px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 22px;
  filter: brightness(0) invert(11);
}

.share-detail-form label i {
  position: absolute;
  padding: 0px;
  right: 12px;
}

.share-detail-form label img {
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  /* height: fit-content; */
  /* background: #E50916; */
  position: absolute;
  padding: 0px;
  border-radius: 6px 6px 6px 6px;
  left: 15px;
  top: auto;
}

.signin-forgotpass-wrap {
  text-align: center;
  margin-bottom: 10px;
}

.signin-forgotpass-wrap a {
  font-weight: 500;
  font-size: 16px;
  text-align: center;
  font-family: "Poppins";
  color: #fff;
  cursor: pointer;
}

.common-popup-btn {
  width: 100%;
  height: auto;
  font-weight: 500;
  font-size: 16px;
  text-transform: capitalize;
  padding: 10px 0px 10px 0px;
  margin-bottom: 0px;
  border-radius: 5px;
  color: #fff;
  border-radius: 30px;
  background: var(--App-Red, #ce2127);
  margin-top: 0px;
  border: none;
}

.or-sec-wrap h3 {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 14px;
  color: #fff;
}

.or-sec-wrap h3::before {
  content: "";
  border: 1px solid #b8b8b8;
  width: 7%;
  margin-right: 4px;
}

.or-sec-wrap h3::after {
  content: "";
  border: 1px solid #b8b8b8;
  width: 7%;
  margin-left: 4px;
}

.social-container {
  display: flex;
  width: 100%;
  justify-content: center;
}

.social-item {
  color: #000;
  font-weight: 700;
  font-size: 14px;
  margin: 4px;
  font-family: "Poppins";
}

.signin-forgotpass-wrap {
  text-align: center;
  margin-bottom: 10px;
  font-weight: 400;
  font-size: 14px;
  text-align: center;
  font-family: "Poppins";
  color: #fff;
  margin-bottom: 0;
}

.signin-forgotpass-wrap a {
  font-weight: 400;
  font-size: 14px;
  text-align: center;
  font-family: "Poppins";
  color: #828282;
  cursor: pointer;
}

.signin-forgotpass-wrap a span {
  font-family: "Poppins";
  color: #828282;
}

.forgot-password-wrap {
  text-align: right;
}

.forgot-password-wrap a {
  color: var(--Active, #ce2127);
  font-family: Poppins;
  font-size: 13px;
  font-style: normal;
  font-weight: 500;
}

.forgot-password button.btn-close {
  right: 5px;
  position: absolute;
  top: 5px;
  background: url(../images/close-icon.svg);
  background-size: 18px;
  background-repeat: no-repeat;
  background-position: center;
  z-index: 9999;
  padding: 0;
  border-radius: 50%;
  outline: none;
  opacity: 1;
  box-shadow: none;
}

.modal-content {
  border: 1px solid #414040;
}

.modal-backdrop.show {
  background: rgba(43, 43, 43, 0.8);
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.25);
}

/* .modal-backdrop.show {
  opacity: 0.7;
} */

.forgot-password .modal-body {
  padding: 2rem 2rem 2rem 2rem;
  border-radius: 6px;
  /* border: 1px solid #414040; */
  background: var(--Black, #000);
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
}

.forgot-password .modal-dialog {
  padding: 9rem 1rem 1rem 1rem;
  margin-top: 4rem;
}

.forgot-password-in {
  width: 100%;
  height: auto;
}

.forgot-password-in img {
  display: block;
  width: 60px;
  height: 60px;
  margin: auto;
  margin-bottom: 20px;
}

.forgot-password-in h1 {
  margin-bottom: 28px;
  color: var(--white, #fff);
  text-align: center;
  font-family: Poppins;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
}

.forgot-password-in form {
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.forgot-password-input {
  width: 100%;
  height: auto;
}

.forgot-password-input input[type="text"] {
  width: 100%;
  height: auto;
  padding: 8px 15px;
  /* border-radius: 6px; */
  border: 1px solid #ddd;
  color: #fff;
  font-size: 16px;
  border: none;
  font-weight: 400;
  border-radius: 50px;
  background: #58585a;
  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.25);
}

.forgot-password-input input[type="text"]::placeholder {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.forgot-password-in p {
  color: #fff;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  margin-top: 10px;
  margin-bottom: 0;
}

.forgot-password-in a {
  color: var(--App-Red, #ce2127);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
}

.forgot-password-in form input[type="button"] {
  width: 100%;
  padding: 8px 0;
  border-radius: 30px;
  background: var(--App-Red, #ce2127);
  /* border-radius: 6px; */
  /* background: linear-gradient(90deg, #099D90 0%, #659F00 97.52%); */
  border: none;
  color: #fff;
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  margin-top: 6px;
}

.otp-verification-input {
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 15px;
  margin-bottom: 15px;
}

.otp-verification-input .inputs {
  width: 50px;
  height: 50px;
  padding: 0;
  border-radius: 6px;
  border: 1px solid #ddd;
  background: #58585a;
  color: #fff;
  font-size: 16px;
  font-weight: 400;
  text-align: center;
}

.otp-verification-input .inputs::-webkit-outer-spin-button,
.otp-verification-input .inputs::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.sign-in-inner form label {
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: column;
  color: #333;
  font-size: 16px;
  font-weight: 400;
  gap: 5px;
}

.sign-in-inner form label input[type="text"] {
  width: 100%;
  height: auto;
  padding: 12px 5px 12px 15px;
  border-radius: 6px;
  border: 1px solid #ddd;
  background: #fff;
}

.sign-in-inner form label input.password::placeholder {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.sign-in-inner form label input.password {
  width: 100%;
  height: auto;
  padding: 8px 15px;
  /* border-radius: 6px; */
  border: 1px solid #ddd;
  color: #fff;
  font-size: 16px;
  border: none;
  font-weight: 400;
  border-radius: 50px;
  background: #58585a;
  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.25);
}

.password-inner {
  width: 100%;
  height: auto;
  position: relative;
  display: flex;
  align-items: center;
  cursor: pointer;
}

.password-inner .password-eye {
  position: absolute;
  right: 10px;
}

.eye-close {
  background-image: url(../images/login-imgs/eye-close.svg);
  width: 30px;
  height: 30px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 22px;
  filter: brightness(0) invert(11);
}

.eye-open {
  background-image: url(../images/login-imgs/eye-open.svg);
  width: 30px;
  height: 30px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 22px;
  filter: brightness(0) invert(11);
}

.heading-left-filter {
  width: 100%;
  height: auto;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  margin-bottom: 15px;
}

.heading-left-filter ul {
  padding: 0;
  margin: 0;
  width: 100%;
  display: flex;
  justify-content: center;
  overflow: hidden;
  border-radius: 54px;
  background: var(--white, #fff);
  gap: 1px;
  border: none;
}

.heading-left-filter ul li {
  list-style: none;
  width: 49.9%;
}

.heading-left-filter ul li button {
  width: 100%;
  height: 100%;
  padding: 9px 0 !important;
  font-weight: 400 !important;
  margin-bottom: 0 !important;
  border: none !important;
}

.available-coupons-right .nav-tabs {
  --bs-nav-tabs-border-width: 1px;
  --bs-nav-tabs-border-color: #dee2e6;
  --bs-nav-tabs-border-radius: 0.375rem;
  --bs-nav-tabs-link-hover-border-color: #e9ecef #e9ecef #dee2e6;
  --bs-nav-tabs-link-active-color: #495057;
  --bs-nav-tabs-link-active-bg: #fff;
  --bs-nav-tabs-link-active-border-color: #dee2e6 #dee2e6 #fff;
  border-bottom: none !important;
}

.available-coupons-right .nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
  color: #fff;
  background-color: var(--bs-nav-tabs-link-active-bg);
  /* border-color: var(--bs-nav-tabs-link-active-border-color); */
  font-weight: 500;
  padding: 10px 39px;
  border-radius: 54px;
  background: var(--App-Red, #ce2127);
  border: none;
}

.available-coupons-right .nav-tabs .nav-link {
  margin-bottom: calc(-1 * var(--bs-nav-tabs-border-width));
  background: 0 0;
  color: #000;
  border: none !important;
  /* border-top-left-radius: var(--bs-nav-tabs-border-radius); */
  /* border-top-right-radius: var(--bs-nav-tabs-border-radius); */
}

.available-coupons-right .nav-tabs .nav-link:focus,
.nav-tabs .nav-link:active {
  isolation: isolate;
  color: #000;
  font-weight: 500;
  font-size: 16px;
  border: none;
}

.available-coupons-right .nav-tabs .nav-link:focus,
.nav-tabs .nav-link:hover {
  isolation: isolate;
  border-color: transparent !important;
}

.available-coupons-right .nav-link {
  display: block;
  padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);
  font-size: var(--bs-nav-link-font-size);
  font-weight: var(--bs-nav-link-font-weight);
  color: #000 !important;
  text-decoration: none;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
    border-color 0.15s ease-in-out;
}

.available-coupons-right .nav-link:hover {
  color: var(--bs-nav-link-hover-color);
}

.available-coupons-right .nav-link {
  display: block;
  padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);
  font-size: var(--bs-nav-link-font-size);
  font-weight: 500;
  color: #4f4f4f;
  text-decoration: none;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
    border-color 0.15s ease-in-out;
}

.available-coupons-right form ul li .nav-link.active {
  border-bottom: 2px solid #20a99d;
  color: #20a99d;
}

.heading-left-filter ul li:focus,
.heading-left-filter ul li:hover {
  border: 0 !important;
  box-shadow: none !important;
  outline: none !important;
}

.heading-left-filter ul li button:focus,
.heading-left-filter ul li button:hover {
  border: 0 !important;
  box-shadow: none !important;
  outline: none !important;
}

/* reason for call popup */

.reason-for-call .modal-dialog {
  padding: 2rem 1rem 1rem 1rem;
  margin-top: 4rem;
}

.reason-for-call {
  width: 100%;
  height: auto;
}

.reason-for-call img {
  display: block;
  width: 60px;
  height: 60px;
  margin: auto;
  margin-bottom: 20px;
}

.reason-for-call h1 {
  margin-bottom: 28px;
  color: var(--white, #fff);
  text-align: center;
  font-family: Poppins;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
}

.reason-for-call form {
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.forgot-password-input {
  width: 100%;
  height: auto;
}

.reason-for-call .modal-body {
  padding: 2rem 2rem 2rem 2rem;
  border-radius: 6px;
  /* border: 1px solid #414040; */
  background: var(--Black, #000);
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
}

.reason-for-call button.btn-close {
  right: 5px;
  position: absolute;
  top: 5px;
  background: url(../images/close-icon.svg);
  background-size: 18px;
  background-repeat: no-repeat;
  background-position: center;
  z-index: 9999;
  padding: 0;
  border-radius: 50%;
  outline: none;
  opacity: 1;
  box-shadow: none;
}

.reason-for-call-wrap h2 {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  text-align: center;
}

.reason-for-call-wrap textarea {
  border: none;
  outline: none;
  width: 100%;
  height: auto;
  padding: 14px 14px;
  margin: 0px 0 19px 0px;
  border-radius: 0px 30px 30px 0px;
  position: relative;
  display: flex;
  color: #fff;
  align-items: center;
  border-radius: 10px;
  background: var(--text-color, #58585a);
}

.reason-for-call-wrap textarea::placeholder {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.reason-for-call-wrap button {
  width: 100%;
  padding: 8px 0;
  border-radius: 30px;
  background: var(--App-Red, #ce2127);
  /* border-radius: 6px; */
  /* background: linear-gradient(90deg, #099D90 0%, #659F00 97.52%); */
  border: none;
  color: #fff;
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  margin-top: 6px;
}

.all-list-wrap {
  margin: 20px 0 18px 0;
}

.all-list-wrap {
  height: 150px;
  overflow-y: scroll;
  overflow-x: hidden;
}

.all-list-wrap::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

.all-list-wrap::-webkit-scrollbar-track {
  border-radius: 2px;
  background: var(--Gray-1, #333);
}

.all-list-wrap::-webkit-scrollbar-thumb {
  background-color: #e50916;
  /* border: 1px solid #fff; */
  border-radius: 2px;
}

.list-reason-checklist {
  display: flex;
  justify-content: space-between;
  padding: 0px 5px;
  margin: 10px 0 0 0;
}

.list-reason-checklist p {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  margin-bottom: 0;
}

.list-reason-checklist input[type="checkbox"] {
  width: 19px;
  height: 18px;
  margin-right: 4px;
  cursor: pointer;
  appearance: none;
  border: 2px solid #ce2127;
  /* background-color: #CE2127; */
  border-radius: 3px;
  outline: none;
}

.list-reason-checklist input[type="checkbox"]:checked {
  background-image: url(../images/start-project-imgs/arrow-check.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 12px;
  background-color: #ce2127;
}

/* reason for call popup */

/* new */

/* USER-SIGN-IN */

/* LOGIN CSS */

/* PERSONAL INFORMATION CSS */

.steping-header {
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 10px 10px 0px 0px;
  background: var(--silver-1,
      linear-gradient(90deg,
        #adadad 10.42%,
        #ebebeb 40.63%,
        #eee 63.54%,
        #b5b5b5 86.46%));
  padding: 10px 20px 10px 20px;
  position: relative;
  margin-bottom: -15px;
}

.steping-header h2 {
  color: var(--App-Red, #ce2127);
  text-align: center;
  font-family: Poppins;
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 0;
}

.steping-header2 {
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 10px 10px 0px 0px;
  background: var(--silver-1,
      linear-gradient(90deg,
        #adadad 10.42%,
        #ebebeb 40.63%,
        #eee 63.54%,
        #b5b5b5 86.46%));
  padding: 10px 20px 10px 20px;
  position: relative;
  margin-bottom: -15px;
}

.steping-header2 h2 {
  color: var(--App-Red, #ce2127);
  text-align: center;
  font-family: Poppins;
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 0;
}

.steping-header span {
  color: var(--App-Red, #ce2127);
  text-align: right;
  font-family: Poppins;
  font-size: 16px;
  font-weight: 600;
}

.steping-header a i {
  color: var(--App-Red, #ce2127);
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
}

.start-project-wrap {
  width: 100%;
  height: 100vh;
  padding: 40px 0;
  background: #616264;
  margin-bottom: 57px;
}

.start-project-inner-wrap {
  border-radius: 11px;
  background: #000;
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.25);
}

.start-project-inner-wrap {
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: row;
  gap: 0px;
  padding: 41px;
  border-radius: 10px;
  border: 1px solid #343434;
  /* background: #000; */
  box-shadow: 0px 0px 4px 0px rgba(255, 255, 255, 0.25);
}

.start-project-inner-wrap .project-left-area {
  width: 50%;
  height: auto;
  border-radius: 10px 0px 0px 10px;
  border: 1px solid #343434;
  background: #181818;
  display: flex;
  flex-direction: column;
  padding: 23px;
  justify-content: center;
}

.project-left-area .inner-image img {
  width: 50%;
}

.project-left-area .content h3 {
  color: var(--white, #fff);
  text-align: center;
  font-family: cursive;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  margin: 10px 0 10px 0;
}

.project-left-area .content p {
  color: #fff;
  text-align: center;
  font-family: Poppins;
  font-size: 12px;
  font-weight: 500;
  margin-top: 15px;
}

.project-right-area .category-wrap h3 {
  color: var(--white, #fff);
  text-align: center;
  font-family: Poppins;
  font-size: 19px;
  font-weight: 600;
  margin: 14px 0 16px 0;
}

.start-project-inner-wrap .project-right-area {
  width: 50%;
  height: auto;
  /* display: flex; */
  flex-direction: column;
  justify-content: center;
  padding: 31px;
  border-radius: 0px 10px 10px 0px;
  border: 1px solid #343434;
}

.project-right-area form label {
  border: none;
  outline: none;
  width: 100%;
  height: 45px;
  margin: 0px 0 19px 0px;
  border-radius: 0px 30px 30px 0px;
  position: relative;
  display: flex;
  align-items: center;
  border-radius: 50px;
  background: var(--text-color, #58585a);
}

.project-right-area select {
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  border-radius: 6px 6px 6px 6px;
  padding-left: 60px;
  /* margin-bottom: 6px; */
  padding-right: 40px;
  font-size: 20px;
  cursor: pointer;
  appearance: none;
  color: #000;
  background: url(../images/category-imgs/down-arrow.svg);
  background-position: right 10px center;
  background-repeat: no-repeat;
}

.project-right-area label input[type="text"] {
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  border-radius: 50px;
  background: var(--text-color, #58585a);
  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.25);
  /* border-radius: 6px 6px 6px 6px; */
  padding-left: 52px;
  /* margin-bottom: 6px; */
  padding-right: 51px;
  font-size: 14px;
  /* border: 1px solid #B6B6B6; */
  color: #fff;
}

.project-right-area label input[type="text"]::placeholder {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.project-right-area label .loaction-img-wrap img {
  right: 16px;
  left: inherit !important;
  top: 8px;
}

.right-icons-wrap {
  position: absolute;
  top: 10px;
  left: inherit !important;
  right: 59px;
}

.left-icons-wrap {
  position: absolute;
  top: 14px;
  right: inherit !important;
  left: 3px;
}

.project-right-area label img {
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  /* height: fit-content; */
  /* background: #E50916; */
  position: absolute;
  padding: 0px;
  border-radius: 6px 6px 6px 6px;
  left: 15px;
  top: auto;
}

.project-right-area form textarea {
  border: none;
  outline: none;
  width: 100%;
  height: auto;
  padding: 14px 14px;
  margin: 0px 0 19px 0px;
  border-radius: 0px 30px 30px 0px;
  position: relative;
  display: flex;
  color: #fff;
  align-items: center;
  border-radius: 10px;
  background: var(--text-color, #58585a);
}

.project-right-area textarea::placeholder {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.project-right-area select option {
  background: var(--text-color, #58585a);
  color: #fff;
}

.project-right-area select {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.project-right-area label img {
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  /* height: fit-content; */
  /* background: #E50916; */
  position: absolute;
  padding: 0px;
  border-radius: 6px 6px 6px 6px;
  left: 19px;
  top: auto;
}

.project-right-area .common-popup-btn {
  width: 100%;
  height: auto;
  font-weight: 500;
  font-size: 16px;
  text-transform: capitalize;
  padding: 10px 0px 10px 0px;
  margin-bottom: 0px;
  border-radius: 5px;
  color: #fff;
  border-radius: 30px;
  background: var(--App-Red, #ce2127);
  margin-top: 0px;
  border: none;
}

#user-dropp {
  border-radius: 4px;
  background: var(--App-Red, #ce2127);
  padding: 10px 16px;
  display: flex;
  gap: 7px;
  color: #fff;
}

.add-blog-image .upload-wrap span {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.edit-_txt-blog {
  width: 100%;
  height: 120px;
  background: #efefef;
  border: none;
  font-size: 13px;
  margin-bottom: 20px;
  position: relative;
  font-weight: 500;
  color: transparent;
  font-family: "Aleo", serif;
  padding: 0px 10px;
  border-radius: 4px !important;
  display: flex;
  align-items: center;
  cursor: pointer;
}

.add-blog-image {
  overflow: inherit !important;
  /* background: #efefef; */
  border: 2px dashed #c0c0c0;
  font-size: 14px;
  margin-bottom: 4px;
  margin-top: 19px;
  font-weight: 500;
  width: 34%;
  color: #444444;
  /* font-family: sans-serif; */
  display: flex;
  margin: 0;
  padding: 17px 54px;
  text-align: initial;
  border-radius: 50px;
  cursor: pointer;
}

.upload-wrap img {
  right: 20px;
  left: inherit !important;
}

.uploaded-imge-wrap {
  display: flex;
  gap: 10px;
  margin-bottom: 16px;
}

.uploaded-imge-wrap img:nth-child(2) {
  width: 93px;
  height: 82px;
  object-fit: cover;
}

.arrange-upload-wrap {
  display: flex;
  gap: 13px;
  align-items: center;
  margin-top: 6px;
  width: 100%;
}

.imgae-manage {
  position: relative;
}

.imgae-manage a {
  width: 18px;
  height: 18px;
  display: block;
  position: absolute;
  right: -5px;
  top: -5px;
  border-radius: 50%;
}

.inner-img {
  width: auto;
}

.divide-sec {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 7px 0 10px 0;
  flex-direction: column;
}

.divide-sec span {
  color: var(--white, #fff);
  text-align: center;
  font-family: Roboto;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
}

.divide-sec p {
  color: var(--Gray-5, #e0e0e0);
  text-align: center;
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

/* PREVIEW REQUEST POPUP */

.preview-request button.btn-close {
  right: 7px;
  position: absolute;
  top: 7px;
  background: url(../images/close-icon.svg);
  background-size: 18px;
  background-repeat: no-repeat;
  background-position: center;
  z-index: 9999;
  padding: 0;
  border-radius: 50%;
  outline: none;
  opacity: 1;
  box-shadow: none;
}

.preview-request .modal-content {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  color: var(--bs-modal-color);
  pointer-events: auto;
  background-color: var(--bs-modal-bg);
  background-clip: padding-box;
  border: var(--bs-modal-border-width) solid var(--bs-modal-border-color);
  border-radius: var(--bs-modal-border-radius);
  outline: 0;
  border-radius: 8px;
  border: 1px solid #414040;
  background: var(--Black, #000);
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
}

.preview-request h1 {
  margin-bottom: 0;
  color: var(--white, #fff);
  text-align: center;
  font-family: Poppins;
  font-size: 24px;
  border-radius: 6px 6px 0px 0px;
  padding: 12px 3px;
  font-style: normal;
  background: #2b2b2b;
  font-weight: 600;
}

.modal-backdrop.show {
  background: rgba(43, 43, 43, 0.8);
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.25);
}

/* .modal-backdrop.show {
  opacity: 0.7;
} */

.preview-request .modal-body {
  padding: 2rem 2rem 2rem 2rem;
  border-radius: 6px;
  /* border: 1px solid #414040; */
  background: var(--Black, #000);
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
}

.preview-request .modal-dialog {
  padding: 0rem 1rem 1rem 1rem;
  margin-top: 4rem;
  max-width: 552px;
}

.preview-request-in .description-wrappp {
  display: flex;
  gap: 6px;
  align-items: baseline;
}

.preview-request-in .description-wrappp-2 {
  display: flex;
  gap: 0px;
  align-items: baseline;
  flex-direction: column;
}

.preview-request-in .description-wrappp h5 {
  color: var(--Gray-1, #fff);
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
}

.preview-request-in .description-wrappp-2 h5 {
  color: var(--Gray-1, #fff);
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
}

.preview-request-in .description-wrappp p {
  color: var(--Gray-3, #fff);
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
}

.preview-request-in .description-wrappp-2 p {
  color: var(--Gray-3, #fff);
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
}

.preview-request-in {
  width: 100%;
  height: auto;
}

.preview-request-in .uploaded-imge-wrap .inner-img img {
  width: 85px;
  height: 50px;
  object-fit: cover;
}

.preview-request-in .detailss {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  justify-content: flex-start;
}

.preview-request-in .detailss input[type="checkbox"] {
  width: 24px;
  height: 18px;
  margin-right: 4px;
  cursor: pointer;
  appearance: none;
  border: 2px solid #ce2127;
  /* background-color: #CE2127; */
  border-radius: 3px;
  outline: none;
}

.preview-request-in .detailss input[type="checkbox"]:checked {
  background-image: url(../images/start-project-imgs/arrow-check.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 12px;
  background-color: #ce2127;
}

.preview-request-in .detailss p {
  color: #fff;
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
}

.preview-request-in .detailss p span {
  color: var(--App-Red, #ce2127);
  font-family: Poppins;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
}

.preview-request-in .detailss p a {
  color: #5aa1ff;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  text-decoration: underline !important;
}

/* PREVIEW REQUEST POPUP */

/* Multi seclect checkbox css */

.dropdown-check-list {
  /* display: inline-block; */
  position: relative;
  margin-bottom: 23px;
}

.dropdown-check-list img {
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  /* height: fit-content; */
  /* background: #E50916; */
  position: absolute;
  padding: 0px;
  border-radius: 6px 6px 6px 6px;
  left: 19px;
  top: 13px;
  z-index: 99;
}

.dropdown-check-list .anchor {
  position: relative;
  cursor: pointer;
  display: inline-block;
  padding: 5px 50px 5px 62px;
  border: none;
  color: #fff;
  outline: none;
  width: 100%;
  height: 45px;
  margin: 0px 0 7px 0px;
  border-radius: 0px 30px 30px 0px;
  /* position: relative; */
  display: flex;
  align-items: center;
  border-radius: 50px;
  background: var(--text-color, #58585a);
}

.dropdown-check-list input[type="checkbox"] {
  width: 18px;
  height: 18px;
  /* margin-right: 0; */
  position: absolute;
  right: 0px;
  cursor: pointer;
  appearance: none;
  border: 2px solid #363636;
  /* background-color: #CE2127; */
  border-radius: 3px;
  outline: none;
}

.dropdown-check-list input[type="checkbox"]:checked {
  background-image: url(../images/start-project-imgs/arrow-check.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 12px;
  border: none;
  background-color: #ce2127;
}

.dropdown-check-list ul {
  overflow-y: scroll;
  height: 121px;
  cursor: pointer;
  border-radius: 5px;
}

.dropdown-check-list ul::-webkit-scrollbar {
  width: 10px;
  overflow-y: scroll;
  border-radius: 2px;
}

.dropdown-check-list ul::-webkit-scrollbar-track {
  background: #d9d9d9;
  border-radius: 2px;
  position: absolute;
  right: 10px;
  z-index: 999;
}

.search-drop-wrap input[type="text"] {
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  color: #4f4f4f;
  border-radius: 30px;
  padding: 8px 13px;
  background: #333333;
  margin-bottom: 12px;
  /* position: relative; */
  font-size: 16px;
  font-weight: 400;
  padding-left: 15px;
  padding-right: 40px;
}

.search-drop-wrap {
  position: relative;
}

.search-drop-wrap button {
  height: 100%;
  outline: none;
  border: none;
  position: absolute;
  right: 0;
  background: none;
  padding: 10px;
}

.search-drop-wrap button img {
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  /* height: fit-content; */
  /* background: #E50916; */
  position: relative;
  padding: 0px;
  border-radius: 6px 6px 6px 6px;
  left: -3px;
  top: -4px;
  z-index: 99;
}

.search-drop-wrap input::placeholder {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
}

.dropdown-check-list ul::-webkit-scrollbar-thumb {
  background-color: #e50916;
  border-radius: 2px;
}

.dropdown-check-list .anchor:after {
  position: absolute;
  content: "";
  border-left: 2px solid #fff;
  border-top: 2px solid #fff;
  padding: 4px;
  right: 16px;
  top: 32%;
  -moz-transform: rotate(-135deg);
  -ms-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg);
}

.dropdown-check-list .anchor:active:after {
  right: 8px;
  top: 21%;
}

.dropdown-check-list ul.items {
  padding: 14px 26px;
  display: none;
  margin: 0;
  border-top: none;
  background: var(--text-color, #58585a);
}

.dropdown-check-list ul.items li {
  list-style: none;
  position: relative;
  /* color: #fff; */
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  line-height: 27px;
  font-style: normal;
  font-weight: 400;
}

.dropdown-check-list.visible .anchor {
  color: #fff;
}

.dropdown-check-list.visible .items {
  display: block;
  margin-bottom: 18px;
}

/* Multi seclect checkbox css */

/* PROFILE SUBMITTED POPUP CSS */

.profile-submit-popup button.btn-close {
  right: 5px;
  position: absolute;
  top: 5px;
  background: url(../images/close-icon.svg);
  background-size: 18px;
  background-repeat: no-repeat;
  background-position: center;
  z-index: 9999;
  padding: 0;
  border-radius: 50%;
  outline: none;
  opacity: 1;
  box-shadow: none;
}

.profile-submit-popup .modal-body {
  padding: 2rem 2rem 2rem 2rem;
  border-radius: 6px;
  /* border: 1px solid #414040; */
  background: var(--Black, #000);
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
}

.profile-submit-popup .modal-dialog {
  padding: 3rem 1rem 1rem 1rem;
}

.profile-submit-popup-in {
  width: 100%;
  height: auto;
}

.profile-submit-popup-in img {
  display: block;
  width: 60px;
  height: 60px;
  margin: auto;
  margin-bottom: 7px;
}

.profile-submit-popup-in h1 {
  margin-bottom: 28px;
  color: var(--white, #fff);
  text-align: center;
  font-family: Poppins;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
}

.profile-submit-popup-in .content-sec h3 {
  color: var(--white, #fff);
  text-align: center;
  font-family: Roboto;
  font-size: 23px;
  font-style: normal;
  font-weight: 600;
}

.profile-submit-popup-in form {
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.profile-submit-popup-input {
  width: 100%;
  height: auto;
}

.profile-submit-popup-input input[type="text"] {
  width: 100%;
  height: auto;
  padding: 8px 15px;
  /* border-radius: 6px; */
  border: 1px solid #ddd;
  color: #fff;
  font-size: 16px;
  border: none;
  font-weight: 400;
  border-radius: 50px;
  background: #58585a;
  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.25);
}

.profile-submit-popup-input input[type="text"]::placeholder {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.profile-submit-popup-in p {
  color: #fff;
  text-align: center;
  font-size: 15px;
  font-weight: 400;
  margin-top: 10px;
  margin-bottom: 5px;
}

.profile-submit-popup-in p span {
  color: #ce2127;
  text-align: center;
  font-size: 15px;
  font-weight: 400;
  margin-top: 10px;
  margin-bottom: 5px;
}

.profile-submit-popup-in a {
  color: var(--App-Red, #ce2127);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
}

.profile-submit-popup-in form input[type="button"] {
  width: 100%;
  padding: 8px 0;
  border-radius: 30px;
  background: var(--App-Red, #ce2127);
  /* border-radius: 6px; */
  /* background: linear-gradient(90deg, #099D90 0%, #659F00 97.52%); */
  border: none;
  color: #fff;
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  margin-top: 6px;
}

/* PROFILE SUBMITTED POPUP CSS */

/* OPEN ASAP RQUEST ACCEPT POPUP CSS */

.request-accept-popup button.btn-close {
  right: 5px;
  position: absolute;
  top: 5px;
  background: url(../images/close-icon.svg);
  background-size: 18px;
  background-repeat: no-repeat;
  background-position: center;
  z-index: 9999;
  padding: 0;
  border-radius: 50%;
  outline: none;
  opacity: 1;
  box-shadow: none;
}

.request-accept-popup .modal-body {
  padding: 2rem 2rem 2rem 2rem;
  border-radius: 6px;
  /* border: 1px solid #414040; */
  background: var(--Black, #000);
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
}

.request-accept-popup .modal-dialog {
  padding: 8rem 1rem 1rem 1rem;
}

.request-accept-popup-in {
  width: 100%;
  height: auto;
}

.request-accept-popup-in img {
  display: block;
  width: 60px;
  height: 60px;
  margin: auto;
  margin-bottom: 7px;
}

.request-accept-popup-in h1 {
  margin-bottom: 28px;
  color: var(--white, #fff);
  text-align: center;
  font-family: Poppins;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
}

.request-accept-popup-in .content-sec h3 {
  color: var(--white, #fff);
  text-align: center;
  font-family: Roboto;
  font-size: 23px;
  font-style: normal;
  font-weight: 600;
}

.request-accept-popup-in form {
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.request-accept-popup-input {
  width: 100%;
  height: auto;
}

.request-accept-popup-input input[type="text"] {
  width: 100%;
  height: auto;
  padding: 8px 15px;
  /* border-radius: 6px; */
  border: 1px solid #ddd;
  color: #fff;
  font-size: 16px;
  border: none;
  font-weight: 400;
  border-radius: 50px;
  background: #58585a;
  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.25);
}

.request-accept-popup-input input[type="text"]::placeholder {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.request-accept-popup-in p {
  color: #fff;
  text-align: center;
  font-size: 15px;
  font-weight: 400;
  margin-top: 10px;
  margin-bottom: 5px;
}

.request-accept-popup-in p span {
  color: #ce2127;
  text-align: center;
  font-size: 15px;
  font-weight: 400;
  margin-top: 10px;
  margin-bottom: 5px;
}

.request-accept-popup-in a {
  color: var(--App-Red, #ce2127);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
}

.request-accept-popup-in form input[type="button"] {
  width: 100%;
  padding: 8px 0;
  border-radius: 30px;
  background: var(--App-Red, #ce2127);
  /* border-radius: 6px; */
  /* background: linear-gradient(90deg, #099D90 0%, #659F00 97.52%); */
  border: none;
  color: #fff;
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  margin-top: 6px;
}

/* OPEN ASAP RQUEST ACCEPT POPUP CSS */

/* PROFILE VERIFICATION CSS */

.profile-verify-img {
  display: flex;
  justify-content: center;
  margin-bottom: 16px;
}

.profile-verification-wrap h3 {
  color: var(--Active, #ce2127);
  text-align: center;
  font-family: Poppins;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
}

.profile-verification-wrap p {
  color: var(--Gray-6, #f2f2f2);
  text-align: center;
  font-family: Roboto;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

/* PROFILE VERIFICATION CSS */

/* PERSONAL INFORMATION CSS */

/* UPCOMING JOBS CSS */

.upcoming-jobs-inner-wrap {
  width: 100%;
  height: auto;
  /* display: flex; */
  flex-direction: row;
  gap: 0px;
  padding: 41px;
  border-radius: 10px;
  border: 1px solid #343434;
  background: #000;
  box-shadow: 0px 0px 4px 0px rgba(255, 255, 255, 0.25);
}

.upcoming-jobs-inner-wrap {
  overflow-y: scroll;
  height: 430px;
  border-radius: 5px;
}

.jobs-topsec-divide {
  display: flex;
  justify-content: center;
  align-items: center;
}

.cliam-asp-btn-wrap a {
  width: 100%;
  height: auto;
  font-weight: 500;
  font-size: 16px;
  text-transform: capitalize;
  padding: 10px 9px 10px 13px;
  margin-bottom: 0px;
  border-radius: 5px;
  color: #fff;
  border-radius: 30px;
  background: var(--App-Red, #ce2127);
  margin-top: 0px;
  border: none;
  margin-left: -171px;
}

.upcoming-jobs-wrap {
  display: flex;
  gap: 14px;

  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  /* Adjust spacing between cards */
}

.upcoming-jobs-cards {
  width: 33%;
  height: auto;
  display: flex;
  /* border-radius: 0px 40px; */
  /* background: #FFF; */
  /* box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.25); */
  flex-direction: column;
  align-items: center;
  border-radius: 4px;
  background: #333333;
  position: relative;
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.25);
  padding: 15px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  padding-top: 20px;
  padding-bottom: 20px;
  margin: 60px 0px 10px 0px;
  gap: 15px;
}

.jobs-img-wrap {
  border-radius: 76px;
  background: var(--text-color, #58585a);
  box-shadow: 0px 1px 8px 0px rgba(0, 0, 0, 0.25);
  width: 76px;
  height: 76px;
}

.jobs-img-wrap img {
  margin: 14px auto;
  display: flex;
  object-fit: cover;
  width: 42px;
  height: 43px;
}

.content-jobs p {
  color: var(--white, #fff);
  text-align: center;
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  margin-bottom: 0;
}

.content-jobs blockquote {
  color: var(--white, #219653);
  text-align: center;
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  margin-bottom: 0;
  margin-top: 5px;
}

.complete-incomplte-alert {
  position: absolute;
  /* display: flex; */
  right: 9px;
  top: 10px;
}

.complete-incomplte-alert span {
  color: var(--white, #219653);
  text-align: center;
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  margin-bottom: 0;
  margin-top: 5px;
}

.upcoming-jobs-cards a {
  width: 100%;
  height: auto;
  font-weight: 500;
  font-size: 16px;
  text-transform: capitalize;
  padding: 10px 0px 10px 0px;
  margin-bottom: 0px;
  border-radius: 5px;
  color: #fff;
  text-align: center;
  border-radius: 30px;
  background: var(--App-Red, #ce2127);
  margin-top: 0px;
  border: none;
}

.content-jobs h3 {
  color: var(--card-black-text-white, #fff);
  text-align: center;
  font-family: Poppins;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  margin-top: 9px;
}

.upcoming-jobs-inner-wrap::-webkit-scrollbar {
  width: 8px;
  overflow-y: scroll;
  border-radius: 6px;
}

.upcoming-jobs-inner-wrap::-webkit-scrollbar-track {
  background: #333;
  border-radius: 6px;
}

.upcoming-jobs-inner-wrap::-webkit-scrollbar-thumb {
  background-color: #e50916;
  border-radius: 6px;
}

.heading-center-filter {
  width: auto;
  height: auto;
  margin: 0 auto;
  /* display: flex; */
  /* justify-content: center; */
  /* margin-bottom: 15px; */
}

.heading-center-filter ul {
  padding: 0;
  margin: 0;
  width: auto;
  display: flex;
  /* border-radius: 4px; */
  justify-content: center;
  overflow: hidden;
  border-radius: 54px;
  background: var(--white, #fff);
  /* background: aliceblue; */
  gap: 1px;
  border: none;
}

.heading-center-filter ul li {
  list-style: none;
}

.upcoming-jobs-inner-wrap .nav-tabs {
  --bs-nav-tabs-border-width: 1px;
  --bs-nav-tabs-border-color: #dee2e6;
  --bs-nav-tabs-border-radius: 0.375rem;
  --bs-nav-tabs-link-hover-border-color: #e9ecef #e9ecef #dee2e6;
  --bs-nav-tabs-link-active-color: #495057;
  --bs-nav-tabs-link-active-bg: #fff;
  --bs-nav-tabs-link-active-border-color: #dee2e6 #dee2e6 #fff;
  border-bottom: none !important;
}

.upcoming-jobs-inner-wrap .nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
  color: #fff !important;
  background-color: var(--bs-nav-tabs-link-active-bg);
  /* border-color: var(--bs-nav-tabs-link-active-border-color); */
  font-weight: 500;
  padding: 10px 39px;
  border-radius: 54px;
  background: var(--App-Red, #ce2127) !important;
  border: none;
}

.upcoming-jobs-inner-wrap .nav-tabs .nav-link {
  margin-bottom: calc(-1 * var(--bs-nav-tabs-border-width));
  background: 0 0;
  color: #000;
  border: none !important;
  /* border-top-left-radius: var(--bs-nav-tabs-border-radius); */
  /* border-top-right-radius: var(--bs-nav-tabs-border-radius); */
}

.upcoming-jobs-inner-wrap .nav-tabs .nav-link:focus,
.nav-tabs .nav-link:active {
  isolation: isolate;
  color: #000;
  font-weight: 500;
  font-size: 16px;
  border: none;
}

.upcoming-jobs-inner-wrap .nav-tabs .nav-link:focus,
.nav-tabs .nav-link:hover {
  isolation: isolate;
  border-color: transparent !important;
}

.upcoming-jobs-inner-wrap .nav-link {
  display: block;
  padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);
  font-size: var(--bs-nav-link-font-size);
  font-weight: var(--bs-nav-link-font-weight);
  color: #000 !important;
  text-decoration: none;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
    border-color 0.15s ease-in-out;
}

.upcoming-jobs-inner-wrap .nav-link:hover {
  color: var(--bs-nav-link-hover-color);
}

.upcoming-jobs-inner-wrap .nav-link {
  display: block;
  padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);
  font-size: var(--bs-nav-link-font-size);
  font-weight: 500;
  color: #4f4f4f;
  text-decoration: none;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
    border-color 0.15s ease-in-out;
}

.upcoming-jobs-inner-wrap form ul li .nav-link.active {
  border-bottom: 2px solid #20a99d;
  color: #20a99d;
}

.heading-center-filter ul li:focus,
.heading-center-filter ul li:hover {
  border: 0 !important;
  box-shadow: none !important;
  outline: none !important;
}

.heading-center-filter ul li button:focus,
.heading-center-filter ul li button:hover {
  border: 0 !important;
  box-shadow: none !important;
  outline: none !important;
}

.upcoming-jobs-inner-wrap .heading-center-filter a {
  width: 100%;
  height: auto;
  font-weight: 500;
  font-size: 16px;
  text-transform: capitalize;
  padding: 10px 11px 10px 11px;
  margin-bottom: 0px;
  border-radius: 5px;
  color: #fff;
  border-radius: 30px;
  background: var(--App-Red, #ce2127);
  margin-top: 0px;
  border: none;
}

/* UPCOMING JOBS CSS */

/* SELECT TIME SLOT */

.project-left-area .wrapper {
  width: 100%;
  border-radius: 7.494px;
  background: var(--Black, #000);
  box-shadow: 0px 2.49784px 19.98276px 0px rgba(170, 170, 170, 0.03);
}

.project-left-area .wrapper header {
  display: flex;
  align-items: center;
  padding: 25px 30px 10px;
  justify-content: space-between;
}

.project-left-area .wrapper header .icons {
  display: flex;
  justify-content: space-between;
  width: 100%;
}

.project-left-area .wrapper header .icons span {
  height: 38px;
  width: 38px;
  margin: 0 1px;
  cursor: pointer;
  color: #878787;
  text-align: center;
  line-height: 38px;
  font-size: 1.9rem;
  user-select: none;
  border-radius: 50%;
}

.project-left-area .wrapper header .icons span:last-child {
  margin-right: -10px;
}

.project-left-area .wrapper header .icons span:hover {
  /* background: #f2f2f2; */
}

.project-left-area .wrapper header .icons span i {
  font-size: 20px;
  color: #fff;
}

.project-left-area .wrapper header .current-date {
  font-size: 20px;
  font-weight: 500;
  color: #fff;
}

.project-left-area .wrapper .calendar {
  padding: 20px;
}

.project-left-area .wrapper .calendar ul {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  text-align: center;
}

.project-left-area .wrapper .calendar .days {
  margin-bottom: 20px;
}

.project-left-area .wrapper .calendar li {
  color: #828282;
  width: calc(100% / 7);
  font-size: 1.07rem;
}

.project-left-area .wrapper .calendar .weeks li {
  font-weight: 500;
  cursor: default;
  color: #fff;
}

.project-left-area .wrapper .calendar .days li {
  z-index: 1;
  cursor: pointer;
  position: relative;
  margin-top: 30px;
}

.project-left-area .wrapper .days li.inactive {
  color: #aaa;
}

.project-left-area .wrapper .days li.active {
  color: #fff;
}

.project-left-area .wrapper .days li::before {
  position: absolute;
  content: "";
  left: 50%;
  top: 50%;
  height: 40px;
  width: 40px;
  z-index: -1;
  border-radius: 50%;
  transform: translate(-50%, -50%);
}

.project-left-area .wrapper .days li.active::before {
  background: #ce2127;
}

.project-left-area .wrapper .days li:not(.active):hover::before {
  background: #f2f2f2;
}

/* book servcie popup */

#book-service .modal-dialog {
  padding: 4rem 1rem 1rem 1rem;
  margin-top: 4rem;
}

.book-service-wrap .content-sec h3 {
  color: var(--white, #fff);
  text-align: center;
  font-family: Roboto;
  font-size: 23px;
  font-style: normal;
  font-weight: 600;
}

.book-service-wrap .content-sec p {
  color: var(--white, #fff);
  text-align: center;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  margin-bottom: 10px;
}

.book-service-wrap .bottom-des p {
  color: var(--Gray-4, #bdbdbd);
  font-family: Roboto;
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  margin-bottom: 0;
}

.book-service-wrap .time-selected {
  text-align: center;
  margin-bottom: 10px;
  margin-top: 21px;
}

.book-service-wrap .time-selected span {
  color: var(--white, #fff);
  font-family: Roboto;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
}

.book-service-wrap .image-content-wrap {
  width: 70px;
  height: 70px;
  object-fit: cover;
  margin: 0 auto;
}

.book-service-wrap .content-sec a span {
  color: var(--Blue-1, #2f80ed);
  text-align: center;
  font-family: Roboto;
  font-size: 18px;
  font-weight: 500;
  display: block;
  margin-bottom: 10px;
}

.book-service-wrap .or-sec-divide {
  display: flex;
  align-items: center;
  justify-content: center;
}

.book-service-wrap .or-sec-divide span {
  color: var(--App-Red, #ce2127);
  text-align: center;
  font-family: Roboto;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
}

.book-service-wrap button {
  width: 100%;
  padding: 8px 0;
  border-radius: 30px;
  background: var(--App-Red, #ce2127);
  /* border-radius: 6px; */
  /* background: linear-gradient(90deg, #099D90 0%, #659F00 97.52%); */
  border: none;
  color: #fff;
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  margin-top: 6px;
}

/* book service popup */

.time-slot-wrap {
  display: flex;
  gap: 11px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}

.time-slot-wrap a {
  border-radius: 4px;
  border: 1px solid var(--white, #fff);
  padding: 10px 12px;
  color: #fff;
  text-align: center;
  font-family: Roboto;
  font-size: 14px;
  width: auto;
  font-style: normal;
  font-weight: 500;
}

.time-slot-wrap a:focus {
  border-radius: 4px;
  background: var(--App-Red, #ce2127);
  border: none;
}

#treadesman-schedule-slider {
  width: 100%;
  height: auto;
  position: relative;
}

.banner-cat-in {
  width: 100%;
  height: auto;
  padding: 0px 0px 10px 0px;
  border-radius: 4px;
  background: #fff;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  position: relative;
  margin-top: 16px;
  /* margin-bottom: 10px; */
}

.banner-cat-in .rating-schedule {
  display: flex;
  width: 100%;
  justify-content: center;
  align-items: center;
}

.banner-cat-in .rating-schedule img {
  width: 20px !important;
  height: 20px;
}

.banner-cat-in .rating-schedule span {
  color: var(--Gray-1, #333);
  font-family: Roboto;
  font-size: 13px;
  font-style: normal;
  font-weight: 500;
  margin-left: 5px;
}

.user-img-wrap {
  width: 100%;
  margin-bottom: 14px;
}

.banner-cat-in-image {
  width: 60px;
  height: 60px;
  position: absolute;
  top: -30px;
  z-index: 99999;
  border-radius: 44px;
  border: 1px solid #e7e7e7;
  background: #fff;
  padding: 10px;
}

.banner-cat-in-image img {
  width: 100% !important;
  height: 100%;
  object-fit: contain;
}

.banner-cat-in h1 {
  color: #000;
  text-align: center;
  font-family: Poppins;
  font-size: 15px;
  font-style: normal;
  font-weight: 500;
}

.banner-cat-in p {
  color: #4f4f4f;
  text-align: center;
  font-size: 13px;
  font-weight: 400;
  margin-bottom: 0;
}

#treadesman-schedule-slider .owl-nav {
  width: 100%;
  height: auto;
  padding-left: 20px;
  transition: 0.5s;
}

#treadesman-schedule-slider .owl-nav button {
  width: 30px;
  height: 30px;
  box-shadow: none;
  position: absolute;
  top: 50%;
  left: -20px;
  right: inherit;
  z-index: 0;
  opacity: 0.8;
  background: #ce2127;
  outline: none;
  border-radius: 50%;
}

#treadesman-schedule-slider .owl-nav button i {
  font-size: 14px;
  text-align: center;
  display: flex;
  font-weight: 500;
  justify-content: center;
  height: 100%;
  color: #fff;
  place-items: flex-end;
  align-items: center;
}

#treadesman-schedule-slider .owl-nav button:last-child {
  right: -20px;
  left: inherit;
}

/* SELECT TIME SLOT */

/* SELECT PAYMENT CSS */

.paymentplan-wrap {
  display: flex;
  gap: 14px;
  align-items: center;
}

.paymentplan-wrap .box {
  border-radius: 14px;
  background: var(--Black, #000);
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.25);
  padding: 17px;
  width: 34%;
}

.box .check-icon {
  display: flex;
  justify-content: flex-end;
}

.box .image-payment-icon {
  width: 150px;
  height: 158px;
  object-fit: cover;
  margin: 0 auto;
}

.box .head-section-wrap h2 {
  color: var(--white, #fff);
  text-align: center;
  font-family: Roboto;
  font-size: 28px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  margin: 10px 0 5px 0;
}

.box .head-section-wrap span {
  color: var(--white, #fff);
  /* text-align: center; */
  font-family: Roboto;
  font-size: 33px;
  font-style: normal;
  display: flex;
  justify-content: center;
  margin-bottom: 4px;
}

.descripttion-payment ul {}

.descripttion-payment li {
  color: var(--white, #fff);
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  list-style-type: none;
  font-weight: 400;
  display: flex;
  align-items: center;
  gap: 5px;
}

.payment-btns-warp {
  display: flex;
  justify-content: center;
  gap: 16px;
  margin: 30px 0 0px 0;
}

.payment-btns-warp a:nth-child(1) {
  border-radius: 30px;
  background: var(--Black, #000);
  color: #fff;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  padding: 11px 43px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.payment-btns-warp a:nth-child(2) {
  border-radius: 30px;
  background: var(--Black, #ce2127);
  color: #fff;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  padding: 11px 43px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

#add-card .modal-dialog {
  padding: 2rem 1rem 1rem 1rem;
  margin-top: 4rem;
}

.add-card-wrap .top-saving-msg p {
  color: var(--white, #fff);
  text-align: center;
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  margin-top: -16px;
  margin-bottom: 0;
}

.head-card-sec h1 {
  margin-bottom: 28px;
  color: var(--white, #fff);
  text-align: center;
  font-family: Poppins;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  margin-top: 16px;
}

.add-card-wrap-form {
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 39px;
  margin-top: 45px;
}

.add-card-wrap label {
  border: none;
  outline: none;
  width: 100%;
  height: 45px;
  margin: 0;
  /* background: #fff; */
  border-radius: 0px 30px 30px 0px;
  position: relative;
  display: flex;
  align-items: flex-end;
  align-content: flex-end;
  flex-direction: row-reverse;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.add-card-wrap label h3 {
  color: var(--white, #fff);
  font-family: Roboto;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.add-card-wrap label input[type="text"] {
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  border-radius: 50px;
  background: var(--text-color, #58585a);
  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.25);
  /* border-radius: 6px 6px 6px 6px; */
  padding-left: 55px;
  /* margin-bottom: 6px; */
  padding-right: 40px;
  font-size: 14px;
  /* border: 1px solid #B6B6B6; */
  color: #fff;
}

.add-card-wrap label img {
  font-weight: 600;
  color: #fff;
  width: 35px;
  /* height: fit-content; */
  /* background: #E50916; */
  position: absolute;
  padding: 0px;
  border-radius: 6px 6px 6px 6px;
  left: 15px;
  top: -8px;
}

.add-card-wrap label input[type="text"]::placeholder {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.cvv-mnth-wrap {
  display: flex;
  gap: 19px;
}

.cvv-mnth-wrap label input[type="text"] {
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  border-radius: 50px;
  background: var(--text-color, #58585a);
  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.25);
  /* border-radius: 6px 6px 6px 6px; */
  padding-left: 35px;
  /* margin-bottom: 6px; */
  padding-right: 18px;
  font-size: 14px;
  /* border: 1px solid #B6B6B6; */
  color: #fff;
}

.add-card-wrap-form .detailss {
  display: flex;
  align-items: center;
  gap: 2px;
  justify-content: flex-start;
}

#add-card .modal-dialog {
  padding: 0rem 1rem 1rem 1rem;
  margin-top: 3rem;
}

.add-card-wrap button {
  width: 100%;
  padding: 8px 0;
  border-radius: 30px;
  background: var(--App-Red, #ce2127);
  /* border-radius: 6px; */
  /* background: linear-gradient(90deg, #099D90 0%, #659F00 97.52%); */
  border: none;
  color: #fff;
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  margin-top: 6px;
}

.add-card-wrap-form .detailss input[type="checkbox"] {
  width: 20px;
  height: 18px;
  margin-right: 2px;
  cursor: pointer;
  appearance: none;
  border: 2px solid #fff;
  /* background-color: #CE2127; */
  border-radius: 3px;
  outline: none;
  margin-top: -7px;
}

.add-card-wrap-form .detailss input[type="checkbox"]:checked {
  background-image: url(../images/start-project-imgs/arrow-check.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 12px;
  background-color: #fff;
}

.add-card-wrap-form .detailss p {
  color: #fff;
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
}

/* SELECT PAYMENT CSS */

/* SAVED CARD PAY CSS */

.saved-card-wrap {
  border-radius: 11px;
  background: #000;
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.25);
  padding: 24px 47px;
}

.top-saved-wrap {}

.top-saved-wrap img {
  margin: 0 auto;
  display: flex;
}

.top-saved-wrap h3 {
  color: var(--white, #fff);
  text-align: center;
  font-family: Poppins;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  margin: 14px 10px 0;
}

.top-saved-wrap p {
  color: var(--white, #fff);
  text-align: center;
  font-family: Roboto;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  margin-top: 6px;
}

.main-card-saved {
  display: flex;
  justify-content: center;
  position: relative;
  width: 350px;
  margin: auto;
  align-items: center;
}

.main-card-saved .atm-card-wrap {
  position: relative;
  width: 100%;
  height: 100%;
}

.main-card-saved .content-card h4 {
  color: var(--white, #fff);
  font-family: Roboto;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin-bottom: 0;
}

.main-card-saved .content-card p {
  color: var(--white, #fff);
  font-family: Roboto;
  font-size: 24px;
  font-style: normal;
  font-weight: 400;
  margin-bottom: 0;
}

.valid-date span {
  color: #fff;
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
}

.main-card-saved .content-card {
  position: absolute;
  width: 100%;
  height: auto;
  padding: 20px;
  margin-top: 43px;
}

.valid-date {
  display: flex;
  align-items: center;
  gap: 12px;
}

.main-card-saved .action-wrap {
  display: flex;
  width: 100%;
  /* gap: 20px; */
  justify-content: space-between;
  position: absolute;
  top: 17px;
  margin-left: 37px;
}

.action-wrap .influ-btns-label input[type="radio"] {
  appearance: none;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: transparent;
  outline: 2px solid #fff;
  outline-offset: 2px;
}

.action-wrap .influ-btns-label input[type="radio"]:checked {
  background: #ce2127;
  outline: 1px solid #ce2127;
}

.add-new-card {
  display: flex;
  justify-content: end;
  position: relative;
  top: 51px;
  right: -43px;
  align-items: center;
  gap: 4px;
  color: #fff;
  text-align: right;
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
}

.add-new-card:hover {
  color: #fff;
}

.btn-paynow-wrap {
  display: flex;
  justify-content: center;
  /* flex-direction: row-reverse; */
  margin-right: -38px;
}

.saved-card-wrap button {
  width: 35%;
  padding: 8px 0;
  border-radius: 30px;
  background: var(--App-Red, #ce2127);
  /* border-radius: 6px; */
  /* background: linear-gradient(90deg, #099D90 0%, #659F00 97.52%); */
  border: none;
  color: #fff;
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  margin-top: 44px;
}

#amount-pay .modal-dialog {
  padding: 0rem 1rem 1rem 1rem;
  margin-top: 7rem;
}

.new-card-add-wrap {
  position: relative;
  width: 100%;
  height: 100%;
  margin: 17px 0 14px 0;
}

.new-card-add-wrap img {
  width: 100%;
  height: 100%;
  position: relative;
  margin-bottom: -8px;
}

.content-wrap-card h3 {
  color: var(--white, #fff);
  font-family: Roboto;
  font-size: 22px;
  font-style: normal;
  font-weight: 400;
}

.content-wrap-card h4 {
  color: var(--white, #fff);
  font-family: Roboto;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
}

.content-wrap-card p {
  color: var(--white, #fff);
  font-family: Roboto;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
}

.content-wrap-card {
  position: absolute;
  top: 30px;
  left: 21px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  color: white !important;
}

.new-card-add-wrap .form-card-wrap label {}

.form-card-wrap {
  margin: 14px 0 10px 0;
  display: flex;
}

.form-card-wrap a {
  border-radius: 50px;
  /* background: var(--icon-color, linear-gradient(90deg, #27C3B6 0%, #72B006 100%)); */
  border-radius: 4px;
  background: var(--App-Red, #ce2127);
  color: #fff;
  width: 60%;
  padding: 10px 35px;
  font-weight: 400;
  text-align: center;
}

.new-card-add-wrap .form-card-wrap label input[type="text"] {
  width: 71%;
  height: 100%;
  border: none;
  outline: none;
  border-radius: 4px;
  border: 1px solid var(--Gray-3, #828282);
  background: #62627a00;
  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.25);
  padding-left: 14px;
  padding-right: 18px;
  font-size: 14px;
  color: #fff;
}

.new-card-add-wrap .form-card-wrap label img {
  font-weight: 600;
  color: #fff;
  width: 28px;
  height: 27px;
  position: absolute;
  padding: 0px;
  border-radius: 6px 6px 6px 6px;
  right: -12px;
  top: 8px;
}

/* SAVED CARD PAY CSS */

/* HOME PAGE CSS */

/* ABOUT US */

.about-main-wrap {
  width: 100%;
  height: auto;
  padding: 40px 0;
  background: #000;
}

.about-right-wrap h1 {
  color: var(--App-Red, #ce2127);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  text-transform: uppercase;
}

.about-right-wrap h3 {
  color: var(--white, #fff);
  font-family: Kalam;
  font-size: 36px;
  font-style: normal;
  font-weight: 700;
  margin-bottom: 14px;
}

.about-right-wrap h3 span {
  color: var(--App-Red, #ce2127);
  font-family: Kalam;
  font-size: 36px;
  font-style: normal;
  font-weight: 700;
}

.about-right-wrap p {
  color: #fff;
  text-align: justify;
  font-size: 15px;
  font-weight: 400;
  line-height: 27px;
  margin-bottom: 8px;
  WORD-BREAK: break-all;
}

.about-right-wrap p span {
  color: var(--App-Red, #ce2127);
  font-family: Poppins;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
}

.about-img-wrap {
  display: flex;
  flex-wrap: nowrap;
  align-content: flex-start;
  gap: 13px;
  width: 100%;
  height: 100%;
}

.about-left-image {
  gap: 12px;
  display: flex;
  flex-wrap: wrap;
  margin-top: 0;
  height: 100%;
  align-content: flex-start;
  padding-top: 5rem;
}

.about-left-image img:nth-child(1) {
  width: 204px;
  height: 268px;
  object-fit: cover;
}

.about-left-image img:nth-child(2) {
  width: 204px;
  height: 204px;
  object-fit: cover;
}

.about-center-image img:nth-child(1) {
  width: 178px;
  height: 125px;
  object-fit: cover;
}

.about-center-image img:nth-child(2) {
  width: 178px;
  height: 222px;
  object-fit: cover;
}

.about-center-image img:nth-child(3) {
  width: 178px;
  height: 107px;
  object-fit: cover;
}

.about-right-image img:nth-child(1) {
  width: 141px;
  height: 118px;
  object-fit: cover;
}

.about-right-image img:nth-child(2) {
  width: 141px;
  height: 226px;
  object-fit: cover;
}

.about-center-image {
  gap: 12px;
  display: flex;
  flex-wrap: wrap;
  height: auto;
  align-content: flex-start;
  width: 60%;
}

.about-right-image {
  gap: 12px;
  display: flex;
  margin-top: 0;
  flex-wrap: wrap;
  height: auto;
  align-content: flex-start;
  padding-top: 5rem;
}

.trust-with-luvshare-wrap {
  width: 100%;
  height: auto;
  padding: 40px 0;
}

.trust-with-wrap {
  width: 100%;
  height: auto;
  margin: 0px 0 30px 0;
}

.trust-with-wrap h1 {
  color: var(--white, #fff);
  text-align: center;
  font-family: Kalam;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
}

.trust-with-wrap p {
  color: var(--white, #fff);
  text-align: center;
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.trusted-wrap {
  display: flex;
  gap: 28px;
  align-items: center;
  flex-wrap: wrap;
}

.trusted-item {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  padding: 0px;
  height: 237px;
  border-radius: 10px;
  border-radius: 10px;
  background: var(--Black, #000);
  box-shadow: 0px 5px 13px 0px rgba(0, 0, 0, 0.18);
  box-shadow: 0px 5px 13px 0px rgba(0, 0, 0, 0.18);
  background-clip: border-box;
  border-radius: 0.25rem;
  width: 23%;
}

.trusted-wrap .trusted-item h3 {
  color: var(--App-Red, #ce2127);
  text-align: center;
  font-family: Poppins;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
}

.trusted-wrap .trusted-item p {
  color: var(--Gray-5, #e0e0e0);
  text-align: justify;
  font-family: Poppins;
  font-size: 15px;
  font-style: normal;
  text-align: center;
  font-weight: 400;
  margin: 10px 0 21px 0;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
}

.about-img-wrap img {
  width: 100%;
}

.trusted-wrap .trusted-item img {
  width: 60px;
  height: 65px;
  object-fit: cover;
  display: flex;
  margin: 0 auto;
  margin-top: 14px;
  margin-bottom: -9px;
}

.trusted-content-inner {
  padding: 21px 14px 7px 14px;
}

/* ABOUT US */

/* BANNER CSS */

.banner-wrap {
  width: 100%;
  height: auto;
  padding: 120px 0 120px 0;
  background: #616264;
  position: relative;
  isolation: isolate;
}

.banner-wrap::before {
  width: 100%;
  height: 100%;
  content: "";
  position: absolute;
  background-image: url(../images/home-imgs/banner.svg);
  background-size: cover;
  top: 0;
  left: 0;
  z-index: -1;
}

.banner-inner {
  width: 100%;
  height: auto;
}

.banner-inner-image {
  width: 100%;
  height: 100%;
  position: relative;
}

.banner-inner-image img {
  width: 100%;
  height: 100%;
  position: absolute;
}

.banner-inner h1 {
  color: var(--white, #fff);
  text-align: center;
  text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  font-family: Poppins;
  font-size: 48px;
  font-weight: 700;
}

.icons-warp {
  display: flex;
  justify-content: center;
  gap: 20px;
}

.icons-warp .box h3 {
  color: var(--white, #fff);
  text-align: center;
  font-family: Poppins;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}

/* BANNER CSS */

/* SERVICE CSS */

.services-events-wrap {
  width: 100%;
  height: auto;
  padding: 40px 0;
}

.bg-service-black {
  --bs-bg-opacity: 1;
  background-color: #000;
}

.bg-technician-gray {
  --bs-bg-opacity: 1;
  background-color: #616264;
}

.loaction-wrap {
  display: flex;
  align-items: baseline;
  gap: 19px;
  justify-content: center;
  position: relative;
}

.select-location {
  display: flex;
  position: absolute;
  right: 15px;
  top: 4px;
}

.select-location form {
  display: flex;
  gap: 0;
}

.select-location select {
  border-radius: 30px;
  border: 2px solid var(--white, #fff);
  background: rgba(11, 239, 154, 0);
  color: #fff;
  padding: 7px 13px;
  outline: none;
  cursor: pointer;
  width: auto;
}

.select-location select option {
  color: #000;
  cursor: pointer;
}

.services-events-wrap h1 {
  color: var(--white, #fff);
  text-align: center;
  font-size: 34px;
  font-style: normal;
  font-weight: 700;
  font-family: "Kalam", cursive;
  margin: -5px 0 24px -1px;
  line-height: normal;
}

.service-box {
  width: 100%;
  height: 100%;
  display: flex;
  border-radius: 10px 10px 10px 10px;
  background: #fff;
  box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.25);
  flex-direction: column;
  align-items: center;
  padding: 0px;
  padding-top: 0px;
  padding-bottom: 0px;
  margin: 1px 0px 0px 0px;
  gap: 0px;
  overflow: hidden;
}

.service-box .service-img {
  width: 100%;
  height: 180px;
}

.service-box .service-img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.service-content {
  border-radius: 0px 0px 10px 10px;
  background: var(--silver-1,
      linear-gradient(90deg,
        #adadad 10.42%,
        #ebebeb 40.63%,
        #eee 63.54%,
        #b5b5b5 86.46%));
  width: 100%;
}

.service-content h3 {
  color: var(--Black, #000);
  text-align: center;
  font-family: Poppins;
  font-size: 14px;
  font-style: normal;
  padding: 15px 14px;
  font-weight: 500;
  margin-bottom: 0;
}

#services-slider .owl-nav {
  width: 100%;
  height: auto;
  padding-left: 20px;
  transition: 0.5s;
}

#services-slider .owl-nav button {
  width: 30px;
  height: 30px;
  box-shadow: none;
  position: absolute;
  top: 41%;
  left: -20px;
  right: inherit;
  z-index: 0;
  opacity: 0.8;
  background: var(--silver-1,
      linear-gradient(90deg,
        #adadad 10.42%,
        #ebebeb 40.63%,
        #eee 63.54%,
        #b5b5b5 86.46%));
  outline: none;
  border-radius: 50%;
}

#services-sliderr .owl-nav button i {
  font-size: 14px;
  text-align: center;
  display: flex;
  font-weight: 500;
  justify-content: center;
  height: 100%;
  color: #fff;
  place-items: flex-end;
  align-items: center;
}

#services-slider .owl-nav button:last-child {
  right: -20px;
  left: inherit;
}

.service-content h2 {
  color: var(--Black, #000);
  text-align: center;
  font-family: Poppins;
  font-size: 18px;
  font-style: normal;
  padding: 6px 14px;
  font-weight: 500;
  margin-bottom: 0;
}

.service-content p {
  color: var(--Black, #000);
  text-align: center;
  font-family: Poppins;
  font-size: 14px;
  font-style: normal;
  padding: 1px 0 10px 0px;
  font-weight: 500;
  margin-bottom: 0;
}

/* SERVICE CSS */

/* DOWNLOAD APP CSS BANNER */

.refer-earn-rewards {
  width: 100%;
  height: auto;
  padding: 40px 0;
}

.refer-earn-rewards-in {
  width: 100%;
  height: auto;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.refer-earn-rewards-in-image {
  width: 90%;
  height: auto;
  margin: auto;
}

.refer-earn-rewards-in-image img {
  width: 100%;
  height: 100%;
}

.refer-earn-rewards-in h1 {
  color: var(--white, #fff);
  text-align: center;
  font-family: Poppins;
  font-size: 45px;
  font-style: normal;
  font-weight: 600;
}

.refer-earn-rewards-in h2 {
  color: var(--white, #fff);
  text-align: center;
  font-family: Poppins;
  font-size: 30px;
  font-style: normal;
  font-weight: 500;
}

.refer-earn-rewards-in p {
  color: var(--white, #fff);
  text-align: center;
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.refer-earn-rewards-in a img {
  width: 176px;
  height: 55px;
  object-fit: cover;
  height: auto;
}

.app-downloadimg {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: center;
  margin-top: 28px;
}

/* DOWNLOAD APP CSS BANNER */

/* HOW IT WORK CSS */

.how-it-works-wrap {
  display: flex;
  gap: 35px;
  position: relative;
}

.how-works-in {
  width: 33%;
  height: auto;
  display: flex;
  /* border-radius: 0px 40px; */
  /* background: #FFF; */
  /* box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.25); */
  flex-direction: column;
  align-items: center;
  border-radius: 4px;
  background: var(--Black, #000);
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.25);
  padding: 30px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  padding-top: 70px;
  padding-bottom: 30px;
  margin: 60px 0px 10px 0px;
  gap: 15px;
}

.how-works-img {
  width: 100px;
  height: 100px;
  position: absolute;
  top: 10px;
  border-radius: 100px;
  /* background: #FFF; */
  background: var(--silver-1,
      linear-gradient(90deg,
        #adadad 10.42%,
        #ebebeb 40.63%,
        #eee 63.54%,
        #b5b5b5 86.46%));
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
  padding: 2px;
}

.how-works-img img {
  width: 48px;
  height: 49px;
  object-fit: cover;
  display: flex;
  margin: 21px auto;
}

.how-works-in h1 {
  color: var(--white, #fff);
  text-align: center;
  font-family: Poppins;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  margin-bottom: 0;
}

.how-works-in p {
  color: var(--white, #fff);
  text-align: justify;
  font-family: Poppins;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
}

/* HOW IT WORKS CSS */

/* TRADESMAN WELCOME BANNER */

.trademan-welcome {
  width: 100%;
  height: auto;
  padding: 40px 0;
}

.trademan-welcome-in {
  width: 100%;
  height: auto;
  /* text-align: center; */
}

.trademan-welcome-in-image {
  width: 75%;
  height: auto;
  margin: auto;
}

.trademan-welcome-in-image img {
  width: 100%;
  height: 100%;
}

.trademan-welcome-in h1 {
  color: var(--white, #fff);
  font-family: Kalam;
  font-size: 36px;
  font-style: normal;
  font-weight: 700;
}

.trademan-welcome-in h1 span {
  color: var(--white, #ce2127);
  font-family: Kalam;
  font-size: 36px;
  font-style: normal;
  font-weight: 700;
}

.trademan-welcome-in h2 {
  color: var(--white, #fff);
  text-align: center;
  font-family: Poppins;
  font-size: 30px;
  font-style: normal;
  font-weight: 500;
}

.trademan-welcome-in p {
  color: var(--white, #fff);
  text-align: justify;
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.trademan-welcome-in .about-btn {
  display: flex;
  justify-content: flex-start;
}

.trademan-welcome-in a {
  border-radius: 5px;
  background: #ce2127;
  /* display: inline-flex; */
  justify-content: center;
  /* margin: auto; */
  align-items: center;
  color: #fff;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  padding: 8px 40px;
}

/* TRADESMAN WELCOME BANNER */

/* FAQ SECTION */

.faq-main-wrap {
  width: 100%;
  height: auto;
  padding: 40px 0;
}

.faq-left-wrap img {
  width: 472px;
  height: 329px;
  object-fit: cover;
}

.faq-section-rpp {
  display: flex;
  margin: 23px 0 18px 0;
}

.accordion {
  --bs-accordion-color: #212529;
  --bs-accordion-bg: #000;
}

.accordion .accordion-item {
  border-radius: 0px;
  /* border: 1px solid rgba(23, 23, 72, 0.5); */
  margin-bottom: 5px;
  border: none;
}

.accordion .accordion-item button[aria-expanded="true"] {
  border-bottom: 1px solid rgba(23, 23, 72, 0.5);
}

.accordion button {
  position: relative;
  display: flex;
  text-align: left;
  width: 100%;
  padding: 10px 10px;
  color: #fff;
  font-size: 1.15rem;
  font-weight: 400;
  border: none;
  background: #000;
  /* outline: none; */
  align-items: center;
}

.accordion button:hover,
.accordion button:focus {
  cursor: pointer;
  color: #fff;
}

.accordion button:hover::after,
.accordion button:focus::after {
  cursor: pointer;
  color: #fff;
  border: 1px solid #171748;
}

.accordion button .accordion-title {
  padding: 0;
  color: var(--White, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
}

.accordion button .icon {
  display: inline-block;
  position: absolute;
  top: auto;
  right: 10px;
  width: 24px;
  height: 24px;
  /* border: 1px solid; */
  border-radius: 40px;
  overflow: hidden;
}

.accordion button .icon::before {
  display: block;
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 1;
  background-image: url("../images/faq-plus.svg");
  /* background: currentColor; */
}

.accordion button .icon::after {
  display: block;
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  /* background: currentColor; */
  background-image: url("../images/faq-cross.svg");
}

.accordion button[aria-expanded="true"] {
  color: #fff;
}

.accordion button[aria-expanded="true"] .icon::after {
  opacity: 1;
}

.accordion button[aria-expanded="true"] .icon::before {
  opacity: 0;
}

.accordion button[aria-expanded="true"]+.accordion-content {
  opacity: 1;
  max-height: 100em;
  transition: all 200ms linear;
  will-change: opacity, max-height;
  background: #686868;
  padding: 10px;
}

.accordion .accordion-content {
  opacity: 0;
  max-height: 0;
  overflow: hidden;
  transition: opacity 200ms linear, max-height 200ms linear;
  will-change: opacity, max-height;

}

.accordion .accordion-content p {
  /* font-weight: 400; */
  padding: 0px;
  margin: 0;
  /* color: #333333; */
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 25px;
}

/* FAQ SECTION */

/* CONTACT WITH US */

.connect-with-us-wrap {
  width: 100%;
  height: auto;
  padding: 40px 0;
  margin-bottom: 0px;
}

.connect-with-us-wrap h1 {
  color: var(--white, #fff);
  text-align: center;
  font-size: 34px;
  font-style: normal;
  font-weight: 700;
  font-family: "Kalam", cursive;
  margin: -5px 0 0px -1px;
  line-height: normal;
}

.connect-with-us {
  width: 100%;
  height: auto;
  padding: 40px 0;
}

.connect-with-us-in {
  width: 100%;
  height: auto;
  text-align: center;
}

.connect-with-us-in-image img {
  width: 60%;
  height: auto;
  margin: auto;
}

.connect-with-us-wrap p {
  color: var(--Gray-4, #bdbdbd);
  text-align: center;
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  margin-bottom: 33px;
}

.connect-with-us-in form label {
  border: none;
  outline: none;
  width: 100%;
  height: 45px;
  margin: 0px 0 19px 0px;
  border-radius: 0px 30px 30px 0px;
  position: relative;
  display: flex;
  align-items: center;
  border-radius: 4px;
  background: var(--text-color, #58585a);
}

.connect-with-us-in select {
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  border-radius: 6px 6px 6px 6px;
  padding-left: 60px;
  /* margin-bottom: 6px; */
  padding-right: 40px;
  font-size: 20px;
  cursor: pointer;
  appearance: none;
  color: #000;
  background: url(../images/category-imgs/down-arrow.svg);
  background-position: right 10px center;
  background-repeat: no-repeat;
}

.connect-with-us-in label input[type="text"] {
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  border-radius: 50px;
  background: var(--text-color, #58585a);
  /* box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.25); */
  /* border-radius: 6px 6px 6px 6px; */
  padding-left: 20px;
  /* margin-bottom: 6px; */
  padding-right: 40px;
  font-size: 14px;
  /* border: 1px solid #B6B6B6; */
  color: #fff;
}

.connect-with-us-in label input[type="text"]::placeholder {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.connect-with-us-in label .loaction-img-wrap img {
  right: 16px;
  left: inherit !important;
  top: 8px;
}

.connect-with-us-in label img {
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  /* height: fit-content; */
  /* background: #E50916; */
  position: absolute;
  padding: 0px;
  border-radius: 6px 6px 6px 6px;
  left: 15px;
  top: auto;
}

.connect-with-us-in form textarea {
  border: none;
  outline: none;
  width: 100%;
  height: auto;
  padding: 14px 14px;
  margin: 0px 0 19px 0px;
  border-radius: 0px 30px 30px 0px;
  position: relative;
  display: flex;
  color: #fff;
  align-items: center;
  border-radius: 4px;
  background: var(--text-color, #58585a);
}

.connect-with-us-in textarea::placeholder {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.connect-with-us-in select option {
  background: var(--text-color, #58585a);
  color: #fff;
}

.connect-with-us-in select {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.connect-with-us-in label img {
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  /* height: fit-content; */
  /* background: #E50916; */
  position: absolute;
  padding: 0px;
  border-radius: 6px 6px 6px 6px;
  left: 19px;
  top: auto;
}

.connect-with-us-in .common-popup-btn {
  width: 100%;
  height: auto;
  font-weight: 500;
  font-size: 16px;
  text-transform: capitalize;
  padding: 10px 0px 10px 0px;
  margin-bottom: 0px;
  border-radius: 5px;
  color: #fff;
  border-radius: 30px;
  background: var(--App-Red, #ce2127);
  margin-top: 0px;
  border: none;
}

/* CONTACT WITH US */

/* HOME PAGE CSS */

/* MY-PROFILE-PAGE */

.my-profile-inner {
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: row;
  gap: 20px;
}

.profile-img-wrap {
  border-radius: 4px 4px 0px 0px;
  background: #2e2e2e;
  padding: 18px 14px 19px 14px;
}

.profile-img-wrap img {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: block;
  margin: 0 auto;
}

.my-profile-left {
  width: 25%;
  height: auto;
  border-radius: 8px;
  overflow: hidden;
  background: #000;
}

.my-profile-left ul {
  padding: 0;
  margin: 0;
}

.my-profile-left ul li {
  list-style: none;
}

.my-profile-left ul li a {
  padding: 12px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #454545;
  color: #fff;
  font-size: 16px;
  font-weight: 400;
}

.my-profile-left ul li:last-child a {
  /* border-bottom: none; */
}

.my-profile-left ul li a:hover {
  background: #ce2127;
  color: #fff;
}

.my-profile-left ul li.active a {
  background: #ce2127;
  color: #fff;
}

.my-profile-right {
  width: 100%;
  height: auto;
  padding: 25px 15px 32px 15px;
  border-radius: 8px;
  /* border: 1px solid #EFEFEF; */
  background: #000;
  margin-bottom: 58px;
}

.my-profile-right form {
  width: 100%;
  height: auto;
  position: relative;
  padding-top: 5px;
}

.edit-btn {
  color: #fff;
  font-size: 16px;
  font-weight: 400;
  outline: none;
  padding: 8px 20px;
  display: flex;
  align-items: center;
  gap: 10px;
  border-radius: 50px;
  /* border: 1px solid #099D90; */
  /* background: #fff; */
  border: none;
  border-radius: 4px;
  background: var(--App-Red, #ce2127);
  position: absolute;
  right: 0;
}

.edit-btn img {
  width: 20px;
  height: 20px;
}

.profile-right-img {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  margin: auto;
  background: #fff;
  position: relative;
  /* background: linear-gradient(90deg, #099D90 0%, #659F00 97.52%); */
  padding: 3px;
  margin-bottom: 20px;
  border: 2px solid var(--App-Red, #ce2127);
}

.profile-right-img img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
}

.profile-right-img-prev {
  height: 100%;
  width: 100%;
  background-size: cover;
  /* border: 3px solid #CE2127; */
  border-radius: 50%;
  background-position: center;
  background-repeat: no-repeat;
}

.upload-icon {
  width: 35px;
  height: 34px;
  position: absolute;
  bottom: 9px;
  display: flex;
  right: -4px;
  margin: 0;
  background: #ce2127;
  line-height: 25px;
  text-align: center;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
}

.upload-icon img {
  border-radius: 0;
  object-fit: contain;
  transform: scale(0.5);
  cursor: pointer;
}

.upload-icon input[type="file"] {
  visibility: hidden;
  display: none;
}

.my-profile-right-inner {
  width: 100%;
  height: auto;
  display: flex;
  flex-wrap: wrap;
  gap: 20px 10px;
  justify-content: space-between;
  margin: 40px 0 30px 0;
}

.my-profile-save-wrap {
  display: flex;
  justify-content: center;
}

.my-profile-save-wrap a {
  border-radius: 50px;
  /* background: var(--icon-color, linear-gradient(90deg, #27C3B6 0%, #72B006 100%)); */
  border-radius: 30px;
  background: var(--App-Red, #ce2127);
  color: #fff;
  width: 38%;
  padding: 10px 35px;
  font-weight: 400;
  text-align: center;
}

.loaction-img-wrap img {
  right: 16px;
  left: inherit !important;
  top: 8px !important;
}

.my-profile-right-inner label {
  border: none;
  outline: none;
  width: 49%;
  height: 45px;
  margin: 0;
  /* background: #fff; */
  border-radius: 0px 30px 30px 0px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: end;
  flex-wrap: wrap;
  margin-bottom: 14px;
}

.my-profile-right-inner label span {
  color: #00c253;
  text-align: right;
  font-family: Poppins;
  font-size: 16px;
  margin-top: 5px;
  font-style: normal;
  font-weight: 400;
}

.my-profile-right-inner label input[type="text"] {
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  border-radius: 50px;
  background: var(--text-color, #58585a);
  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.25);
  /* border-radius: 6px 6px 6px 6px; */
  padding-left: 55px;
  /* margin-bottom: 6px; */
  padding-right: 40px;
  font-size: 14px;
  /* border: 1px solid #B6B6B6; */
  color: #fff;
}

.my-profile-right-inner label input[type="password"] {
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  border-radius: 50px;
  background: var(--text-color, #58585a);
  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.25);
  /* border-radius: 6px 6px 6px 6px; */
  padding-left: 55px;
  /* margin-bottom: 6px; */
  padding-right: 40px;
  font-size: 14px;
  /* border: 1px solid #B6B6B6; */
  color: #fff;
}

.my-profile-right-inner label img {
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  /* height: fit-content; */
  /* background: #E50916; */
  position: absolute;
  padding: 0px;
  border-radius: 6px 6px 6px 6px;
  left: 15px;
  top: auto;
}

.my-profile-right-inner label input[type="text"]::placeholder {
  color: #fff;
}

/* MY-PROFILE-PAGE */

/* SERVICE INFORMATION CSS */

.service-information-wrap {
  padding: 30px;
}

.service-information-wrap .service-img-wrap {
  display: flex;
  margin: 0 auto;
  justify-content: center;
  margin-bottom: 16px;
}

.service-information-wrap .content-no-service h1 {
  color: var(--white, #fff);
  text-align: center;
  font-family: Poppins;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
}

.service-information-wrap .content-no-service p {
  color: var(--Gray-6, #f2f2f2);
  text-align: center;
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.service-information-btn-wrap {
  display: flex;
  justify-content: center;
}

.service-information-btn-wrap a {
  border-radius: 50px;
  /* background: var(--icon-color, linear-gradient(90deg, #27C3B6 0%, #72B006 100%)); */
  border-radius: 30px;
  background: var(--App-Red, #ce2127);
  color: #fff;
  width: auto;
  padding: 10px 35px;
  font-weight: 400;
  text-align: center;
}

.system-info-define-wrap {
  display: flex;
  gap: 22px;
  margin: 18px 0 18px 0;
  flex-direction: row;
  flex-wrap: wrap;
}

.system-info-define-wrap .box-inner {
  padding: 0px;
  height: auto;
  border-radius: 10px;
  border-radius: 10px;
  background: var(--Black, #000);
  box-shadow: 0px 5px 13px 0px rgba(0, 0, 0, 0.18);
  box-shadow: 0px 5px 13px 0px rgba(0, 0, 0, 0.18);
  background-clip: border-box;
  border-radius: 0.25rem;
  width: 32%;
  padding: 13px;
  background: #333333;
}

.selec-service-actions .service-name {
  display: flex;
  align-items: center;
  gap: 4px;
}

.selec-service-actions .service-name h4 {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  margin-bottom: 0;
}

.selec-service-actions {
  display: flex;
  justify-content: space-between;
}

.selec-service-actions .service-name input[type="checkbox"] {
  width: 19px;
  height: 18px;
  margin-right: 4px;
  cursor: pointer;
  appearance: none;
  border: 2px solid #fff;
  /* background-color: #CE2127; */
  border-radius: 3px;
  outline: none;
}

.selec-service-actions .service-name input[type="checkbox"]:checked {
  background-image: url(../images/start-project-imgs/arrow-check.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 12px;
  background-color: #ce2127;
  border: none;
}

.system-info-define-wrap .box-inner .content-service {
  margin-top: 13px;
  display: flex;
  position: relative;
  flex-wrap: wrap;
  flex-direction: column;
}

.system-info-define-wrap .box-inner .content-service .image-show {
  position: absolute;
  right: 0;
}

.system-info-define-wrap .box-inner .content-service .image-show img {
  width: 70px;
  height: 61px;
  object-fit: cover;
}

.system-info-define-wrap .box-inner p {
  color: var(--Gray-5, #e0e0e0);
  font-family: Roboto;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 30px;
  /* margin-top: 18px; */
  margin-bottom: 0;
}

.system-info-define-wrap .box-inner span {
  color: var(--white, #fff);
  font-family: Roboto;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
}

.system-info-define-wrap .view-detail-service {
  text-align: end;
}

.system-info-define-wrap .view-detail-service a {
  color: var(--white, #fff);
  text-align: right;
  font-family: Roboto;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.system-dropdowns-wrap {
  border: 1px dashed #58585a;
  height: auto;
  margin: 13px 0 10px 0px;
  padding: 10px;
}

.system-dropdowns-wrap form {
  width: 100%;
  height: auto;
  position: relative;
  padding-top: 5px;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.system-dropdowns-wrap form label {
  border: none;
  outline: none;
  width: 24%;
  height: 45px;
  margin: 0px 0 19px 0px;
  border-radius: 0px 30px 30px 0px;
  position: relative;
  display: flex;
  /* gap: 20px; */
  /* margin-bottom: 0; */
  border-radius: 4px;
  background: var(--text-color, #58585a);
}

.system-dropdowns-wrap label input[type="text"] {
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  border-radius: 4px;
  background: var(--text-color, #58585a);
  /* border-radius: 6px 6px 6px 6px; */
  padding-left: 25px;
  /* margin-bottom: 6px; */
  padding-right: 25px;
  position: relative;
  font-size: 14px;
  /* border: 1px solid #B6B6B6; */
  color: #fff;
}

.system-dropdowns-wrap label span {
  color: var(--Gray-5, #e0e0e0);
  font-family: Poppins;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  position: absolute;
  bottom: -20px;
}

.system-dropdowns-wrap label input[type="text"]::placeholder {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
}

.system-dropdowns-wrap select {
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  border-radius: 4px;
  padding-left: 25px;
  position: relative;
  /* margin-bottom: 6px; */
  padding-right: 25px;
  cursor: pointer;
  color: var(--white, #fff);
  font-size: 14px;
  appearance: none;
  background: url(../images/category-imgs/down-arrow.svg);
  background-position: right 10px center;
  background-repeat: no-repeat;
}

.system-dropdowns-wrap select option {
  background: var(--text-color, #58585a);
  color: #fff;
}

.add-components-btn-wrap {
  display: flex;
  justify-content: end;
  margin-bottom: 12px;
}

.add-components-btn-wrap a {
  /* background: var(--icon-color, linear-gradient(90deg, #27C3B6 0%, #72B006 100%)); */
  border-radius: 4px;
  background: #333;
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.25);
  color: #fff;
  font-size: 16px;
  width: auto;
  width: auto;
  padding: 10px 10px;
  font-weight: 400;
  text-align: center;
}

.save-component-btn-wrap {
  position: absolute;
  /* justify-content: end; */
  margin-bottom: 12px;
  right: 15px;
  bottom: 0;
}

.save-component-btn-wrap a {
  /* background: var(--icon-color, linear-gradient(90deg, #27C3B6 0%, #72B006 100%)); */
  border-radius: 4px;
  background: var(--App-Red, #ce2127);
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.25);
  color: #fff;
  font-size: 15px;
  width: auto;
  width: auto;
  padding: 10px 10px;
  font-weight: 400;
  text-align: center;
}

.serch-compntents-service {
  display: flex;
  justify-content: center;
  align-items: center;
}

.serch-compntents-service label {
  border: none;
  outline: none;
  width: 48%;
  height: 45px;
  margin: 0px 0 0px 0px;
  border-radius: 0px 30px 30px 0px;
  position: relative;
  display: flex;
  /* gap: 20px; */
  /* margin-bottom: 0; */
  border-radius: 4px;
  background: var(--text-color, #58585a);
}

.serch-compntents-service label input[type="text"] {
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  border-radius: 4px;
  background: var(--text-color, #58585a);
  /* border-radius: 6px 6px 6px 6px; */
  padding-left: 25px;
  /* margin-bottom: 6px; */
  padding-right: 25px;
  position: relative;
  font-size: 14px;
  /* border: 1px solid #B6B6B6; */
  color: #fff;
}

.serch-compntents-service label input::placeholder {
  color: #bdbdbd;
  font-size: 16px;
  font-weight: 400;
}

.serch-compntents-service label button {
  height: 100%;
  outline: none;
  border: none;
  position: absolute;
  right: 0;
  background: none;
  padding: 10px;
}

.or-divide-section {
  display: flex;
  justify-content: center;
  margin: 8px 0 8px 0px;
}

.or-divide-section span {
  color: var(--App-Red, #ce2127);
  font-family: Poppins;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
}

.add-component-image {
  overflow: inherit !important;
  /* background: #efefef; */
  border: 2px dashed #c0c0c0;
  font-size: 14px;
  margin-bottom: 4px;
  margin-top: 19px;
  font-weight: 500;
  width: auto;
  color: #444444;
  /* font-family: sans-serif; */
  /* display: flex; */
  margin: 5px 0 5px 0 !important;
  padding: 17px 38px;
  text-align: initial;
  position: relative;
  border-radius: 3px;
  cursor: pointer;
}

.add-component-image h4 {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  width: max-content;
  position: absolute;
  top: -27px;
  left: 0;
}

/* SERVICE INFORMATION CSS */

/* NO SERVICE CSS */

.no-service-wrap {
  padding: 19px;
}

.no-service-wrap .service-img-wrap {
  display: flex;
  margin: 0 auto;
  justify-content: center;
  margin-bottom: 16px;
}

.no-service-wrap .content-no-service h1 {
  color: var(--white, #fff);
  text-align: center;
  font-family: Poppins;
  font-size: 32px;
  font-style: normal;
  font-weight: 600;
}

.no-service-wrap .content-no-service p {
  color: var(--white, #fff);
  text-align: center;
  font-family: Poppins;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
}

.service-box-inner {
  border-radius: 8px;
  background: #1f1f1f;
  padding: 11px 6px 14px 6px;
  margin-bottom: 15px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.service-box-inner .left-section {
  display: flex;
  align-items: center;
  gap: 11px;
}

.service-box-inner h3 {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.service-box-inner .content-inner h4 {
  color: var(--white, #fff);
  font-family: Roboto;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
}

.service-box-inner .content-inner p {
  color: var(--white, #fff);
  font-family: Roboto;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  margin-bottom: 0;
}

.service-box-inner .right-section .content-inner {
  display: flex;
  flex-direction: column;
  align-content: stretch;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-end;
}

.service-box-inner .right-section .content-inner p {
  color: var(--white, #fff);
  font-family: Roboto;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  margin-bottom: 0;
  margin-top: 9px;
}

.service-box-inner .right-section .content-inner p span {
  color: var(--Active, #ce2127);
  text-align: right;
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
}

.service-box-inner .right-section .content-inner a {
  color: var(--white, #fff);
  text-align: right;
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  text-decoration: underline !important;
  font-weight: 400;
}

.service-box-inner .right-section .content-inner .tag-btn span {
  border-radius: 24px;
  background: var(--App-Red, #ce2127);
  padding: 4px 7px;
  font-size: 14px;
  color: #fff;
}

.service-box-inner .content-inner p span {
  color: #f2994a;
  font-family: Roboto;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
}

.feedback-callback-wrap {
  display: flex;
  gap: 14px;
  align-items: center;
  margin-right: 4px;
}

.feedback-callback-wrap .cal-back-wrap a {
  color: var(--Blue-1, #2f80ed) !important;
  font-family: Roboto;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  text-decoration: inherit !important;
}

.feedback-callback-wrap .feedback-wrap a {
  color: var(--Blue-1, #2f80ed) !important;
  font-family: Roboto;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  text-decoration: inherit !important;
}

.feedback-wrap {
  display: flex;
  align-items: center;
  gap: 4px;
}

/* CALLBACK POPUP */

.call-request .modal-body {
  padding: 2rem 0rem 2rem 0rem;
  border-radius: 6px;
  /* border: 1px solid #414040; */
  background: var(--Black, #000);
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
}

.call-request .modal-dialog {
  padding: 2rem 0rem 2rem 0rem;
  margin-top: 4rem;
  max-width: 552px;
}

.call-request .service-box-inner {
  border-radius: 8px;
  background: transparent;
  padding: 11px 6px 14px 6px;
  margin-bottom: 15px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.call-request-in {
  width: 100%;
  height: auto;
}

.call-request button.btn-close {
  right: 5px;
  position: absolute;
  top: 5px;
  background: url(../images/close-icon.svg);
  background-size: 18px;
  background-repeat: no-repeat;
  background-position: center;
  z-index: 9999;
  padding: 0;
  border-radius: 50%;
  outline: none;
  opacity: 1;
  box-shadow: none;
}

.problem-wrap {
  padding: 10px 16px 10px 16px;
  border-top: 1px solid #393939;
}

.problem-wrap h4 {
  color: var(--App-Red, #ce2127);
  font-family: Poppins;
  font-size: 22px;
  font-style: normal;
  font-weight: 500;
  margin-bottom: 17px;
}

.problem-img-wrap {
  display: flex;
  gap: 10px;
}

.problem-wrap p {
  color: var(--white, #fff);
  text-align: justify;
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  margin-top: 14px;
}

.btn-roblm-wrap a:nth-child(1) {
  border-radius: 24px;
  background: #3a3a3a;
  padding: 14px 14px;
  color: #fff;
  text-align: center;
  /* display: flex; */
}

.btn-roblm-wrap a:nth-child(2) {
  border-radius: 24px;
  background: #ce2127;
  padding: 14px 14px;
  color: #fff;
  text-align: center;
  /* display: flex; */
}

.btn-roblm-wrap {
  display: flex;
  justify-content: center;
  gap: 10px;
}

.cancel-appointment-wrap a:nth-child(1) {
  border-radius: 24px;
  background: #ce2127;
  padding: 14px 32px;
  color: #fff;
  text-align: center;
}

.cancel-appointment-wrap a:nth-child(2) {
  border-radius: 24px;
  background: #3a3a3a;
  padding: 14px 32px;
  color: #fff;
  text-align: center;
  /* display: flex; */
}

.cancel-appointment-wrap {
  display: flex;
  justify-content: center;
  gap: 10px;
}

/* CALLVACK POPUP */

/* LOGOUT POPUP CSS */

.logoutpop-in {
  width: 100%;
  height: auto;
}

.logoutpop-in h2 {
  color: var(--white, #fff);
  text-align: center;
  font-family: Roboto;
  font-size: 30px;
  font-style: normal;
  font-weight: 600;
}

.logoutpop-in p {
  color: var(--Gray-5, #e0e0e0);
  text-align: center;
  font-family: Roboto;
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
}

.btn-logout-wrap {
  display: flex;
  justify-content: center;
  gap: 10px;
}

.btn-logout-wrap a:nth-child(1) {
  border-radius: 50px;
  background: #ce2127;
  padding: 14px 14px;
  color: #fff;
  text-align: center;
  width: 28%;
  /* display: flex; */
}

.btn-logout-wrap a:nth-child(2) {
  border-radius: 50px;
  background: #3a3a3a;
  padding: 14px 14px;
  color: #fff;
  width: 28%;
  text-align: center;
  /* display: flex; */
}

/* LOGOUT POPUP CSS */

/* FEEDBACK POPUP CSS */

.feedback-request .modal-body {
  padding: 2rem 0rem 2rem 0rem;
  border-radius: 6px;
  /* border: 1px solid #414040; */
  background: var(--Black, #000);
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
}

.feedback-request .modal-dialog {
  padding: 2rem 0rem 2rem 0rem;
  margin-top: 4rem;
  max-width: 552px;
}

.feedback-request .service-box-inner {
  border-radius: 8px;
  background: transparent;
  padding: 11px 6px 14px 6px;
  margin-bottom: 15px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.feedback-request-in {
  width: 100%;
  height: auto;
}

.feedback-request button.btn-close {
  right: 5px;
  position: absolute;
  top: 5px;
  background: url(../images/close-icon.svg);
  background-size: 18px;
  background-repeat: no-repeat;
  background-position: center;
  z-index: 9999;
  padding: 0;
  border-radius: 50%;
  outline: none;
  opacity: 1;
  box-shadow: none;
}

.feedback-request-in h2 {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 30px;
  font-style: normal;
  font-weight: 600;
  text-align: center;
}

.star-cb-group {
  /* remove inline-block whitespace */
  font-size: 0;
  /* flip the order so we can use the + and ~ combinators */
  unicode-bidi: bidi-override;
  direction: rtl;
  /* the hidden clearer */
}

.star-cb-group * {
  font-size: 2rem;
}

.star-cb-group>input {
  display: none;
}

.star-cb-group>input+label {
  /* only enough room for the star */
  display: inline-block;
  overflow: hidden;
  text-indent: 9999px;
  width: 1em;
  white-space: nowrap;
  cursor: pointer;
}

.star-cb-group>input+label:before {
  display: inline-block;
  text-indent: -9999px;
  content: "☆";
  color: #f2994a;
}

.star-cb-group>input:checked~label:before,
.star-cb-group>input+label:hover~label:before,
.star-cb-group>input+label:hover:before {
  content: "★";
  color: #f2994a;
  text-shadow: 0 0 1px #333;
}

.star-cb-group>.star-cb-clear+label {
  text-indent: -9999px;
  width: 0.5em;
  margin-left: -0.5em;
}

.star-cb-group>.star-cb-clear+label:before {
  width: 0.5em;
}

.star-cb-group:hover>input+label:before {
  content: "☆";
  color: #888;
  text-shadow: none;
}

.star-cb-group:hover>input+label:hover~label:before,
.star-cb-group:hover>input+label:hover:before {
  content: "★";
  color: #f2994a;
  text-shadow: 0 0 1px #333;
}

#log {
  margin: 1em auto;
  width: 5em;
  text-align: center;
  background: transparent;
}

.conten-inner-feedback {
  padding: 14px 20px;
}

.rate-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.rate-inner p {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  margin-bottom: 0;
}

.feedback-request-in form textarea {
  border: none;
  outline: none;
  width: 100%;
  height: auto;
  border: 1px solid var(--Gray-5, #e0e0e0);
  padding: 14px 14px;
  margin: 0px 0 19px 0px;
  border-radius: 0px 30px 30px 0px;
  position: relative;
  display: flex;
  color: #fff;
  align-items: center;
  border-radius: 10px;
  background: transparent;
  margin-top: 12px;
}

.feedback-request-in form textarea::placeholder {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
}

.feedback-request-in form a {
  border-radius: 4.311px;
  background: var(--App-Red, #ce2127);
  padding: 14px 14px;
  width: auto;
  display: flex;
  width: 100%;
  justify-content: center;
  color: #fff;
  margin-bottom: 0;
}

.iamge-review-wrap {
  margin: 0 auto;
  display: flex;
  justify-content: center;
}

.review-succesfull-wrap h2 {
  color: var(--white, #fff);
  text-align: center;
  font-family: Roboto;
  font-size: 30px;
  font-style: normal;
  font-weight: 600;
}

.review-succesfull-wrap p {
  color: var(--Gray-5, #e0e0e0);
  text-align: center;
  font-family: Roboto;
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
}

/* FEEDBACK POPUP CSS */

/* CANCEL REQUEST POPUP */

.cancel-request-wrap {
  padding: 14px 31px;
}

.imagecancel-wrap {
  display: flex;
  justify-content: center;
  margin-bottom: 10px;
}

.cancel-request-wrap label {
  border: none;
  outline: none;
  width: 100%;
  height: 45px;
  margin: 0px 0 19px 0px;
  border-radius: 0px 30px 30px 0px;
  position: relative;
  display: flex;
  align-items: center;
  border-radius: 4px;
  background: var(--text-color, #58585a);
}

.cancel-request-wrap p {
  color: var(--white, #fff);
  text-align: center;
  font-family: Roboto;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
}

.cancel-request-wrap select {
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  border-radius: 6px 6px 6px 6px;
  padding-left: 60px;
  /* margin-bottom: 6px; */
  padding-right: 40px;
  font-size: 20px;
  cursor: pointer;
  appearance: none;
  color: #000;
  background: url(../images/category-imgs/down-arrow.svg);
  background-position: right 10px center;
  background-repeat: no-repeat;
}

.cancel-request-wrap label input[type="text"] {
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  border-radius: 50px;
  background: var(--text-color, #58585a);
  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.25);
  /* border-radius: 6px 6px 6px 6px; */
  padding-left: 20px;
  /* margin-bottom: 6px; */
  padding-right: 40px;
  font-size: 14px;
  /* border: 1px solid #B6B6B6; */
  color: #fff;
}

.cancel-request-wrap label input[type="text"]::placeholder {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.cancel-request-wrap label .loaction-img-wrap img {
  right: 16px;
  left: inherit !important;
  top: 8px;
}

.cancel-request-wrap label img {
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  /* height: fit-content; */
  /* background: #E50916; */
  position: absolute;
  padding: 0px;
  border-radius: 6px 6px 6px 6px;
  left: 15px;
  top: auto;
}

.cancel-request-wrap textarea {
  border: none;
  outline: none;
  width: 100%;
  height: auto;
  padding: 14px 14px;
  margin: 0px 0 0px 0px;
  border-radius: 0px 30px 30px 0px;
  position: relative;
  display: flex;
  color: #fff;
  align-items: center;
  border-radius: 4px;
  background: var(--text-color, #58585a);
}

.cancel-request-wrap textarea::placeholder {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.cancel-request-wrap select option {
  background: var(--text-color, #58585a);
  color: #fff;
}

.cancel-request-wrap select {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.cancel-request-wrap label img {
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  /* height: fit-content; */
  /* background: #E50916; */
  position: absolute;
  padding: 0px;
  border-radius: 6px 6px 6px 6px;
  left: 19px;
  top: auto;
}

/* CANCEL REQUEST POPUP */

/* NO SERVICE CSS */

/* TERMS AND CONDITION */

.terms-main-wrap {
  width: 100%;
  height: auto;
  padding: 40px 0;
  background: #000;
}

.terms-main-wrap h3 {
  color: var(--App-Red, #ce2127);
  font-family: Poppins;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
}

.terms-main-wrap p {
  color: #fff;
  text-align: justify;
  font-size: 15px;
  font-weight: 400;
  line-height: 27px;
  margin-bottom: 8px;
}

/* TERMS AND CONDITION */

/* CHECKLIST QUALITY CONTROL INSCEPTION CSS */

.checklist-flow-wrap {
  border-radius: 8px;
  background: #1f1f1f;
  padding: 14px 14px;
}

.checklist-flow-wrap h2 {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.checklist-flow-wrap a i {
  color: #fff;
  margin-top: 8px;
}

.checklist-flow-wrap {
  border-radius: 8px;
  background: transparent;
  padding: 14px 14px;
}

.quality-checklist-heading h3 {
  color: var(--App-Red, #ce2127);
  font-family: Poppins;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
  text-transform: capitalize;
}

.selec-service-actions {
  display: flex;
  justify-content: space-between;
}

.checklistquality-checkbox-wrap input[type="checkbox"] {
  width: 19px;
  height: 18px;
  margin-right: 4px;
  cursor: pointer;
  appearance: none;
  border: 2px solid #fff;
  /* background-color: #CE2127; */
  border-radius: 3px;
  outline: none;
}

.checklistquality-checkbox-wrap input[type="checkbox"]:checked {
  background-image: url(../images/start-project-imgs/arrow-check.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 12px;
  background-color: #ce2127;
  border: none;
}

.checklist-checkbox-wrap input[type="checkbox"] {
  width: 19px;
  height: 18px;
  margin-right: 4px;
  cursor: pointer;
  appearance: none;
  border: 2px solid #fff;
  /* background-color: #CE2127; */
  border-radius: 3px;
  outline: none;
}

.all-checklist-wrap {
  display: flex;
  width: 100%;
  /* justify-content: space-between; */
  flex-wrap: wrap;
  gap: 14px;
}

.checklist-checkbox-wrap {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 30%;
}

.checklistquality-checkbox-wrap {
  position: absolute;
  z-index: 999;
  margin: 22px -2px 10px 9px;
}

.checklist-active {
  color: var(--App-Red, #ce2127);
}

.checklist-checkbox-wrap input[type="checkbox"]:checked {
  background-image: url(../images/start-project-imgs/arrow-check.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 12px;
  background-color: #ce2127;
  border: none;
}

.checklist-checkbox-wrap span {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.checklist-checkbox-wrap2 {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 49%;
}

.checklist-checkbox-wrap2 input[type="checkbox"]:checked {
  background-image: url(../images/start-project-imgs/arrow-check.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 12px;
  background-color: #ce2127;
  border: none;
}

.checklist-checkbox-wrap2 input[type="checkbox"] {
  width: 19px;
  height: 18px;
  margin-right: 4px;
  cursor: pointer;
  appearance: none;
  border: 2px solid #fff;
  /* background-color: #CE2127; */
  border-radius: 3px;
  outline: none;
}

.checklist-checkbox-wrap2 span {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.checkbox-related-textarea {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 5px 0 0 0;
  width: 100%;
  flex-direction: column;
}

.checkbox-related-textarea textarea {
  border: none;
  outline: none;
  width: 50%;
  height: auto;
  padding: 12px 12px;
  margin: 0;
  border-radius: 0px 30px 30px 0px;
  position: relative;
  display: flex;
  color: #fff;
  align-items: center;
  border-radius: 2px;
  background: var(--text-color, #58585a);
}

.checkbox-related-textarea textarea::placeholder {
  color: var(--white, #fff);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.other-inscep-head h3 {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.view-estate-disgonse-report {
  display: flex;
  justify-content: space-between;
}

.view-estate-disgonse-report a {
  color: var(--Blue-1, #2f80ed);
  font-family: Poppins;
  font-size: 13px;
  font-style: normal;
  font-weight: 500;
}

.approved-alert-msg {
  color: var(--Green-2, #27ae60);
  text-align: center;
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  margin: 12px;
}

#job-compete-popup .modal-dialog {
  padding: 0rem 1rem 1rem 1rem;
  margin-top: 2rem;
}

.content-list-type h3 {
  color: var(--Active, #ce2127);
  font-family: Roboto;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
}

.content-list-type ul {
  padding-left: 1rem;
}

.id-verifile-profile {
  padding: 6px 2px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.content-list-type li {
  color: var(--white, #fff);
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
}

.id-verifile-profile .name-profile h4 {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  margin-bottom: 0;
}

.id-verifile-profile .name-profile img {
  width: 43.077px;
  height: 30px;
  object-fit: cover;
}

.profile-edit-icon a {
  color: #fff;
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

/* CHECKLIST QUALITY CONTROL INSCEPTION CSS */

/* PROFILE INFORMATION CSS */

.content-profile-info {
  position: absolute;
  left: 25px;
}

.sec-name-bank {
  display: flex;
  gap: 5px;
}

.sec-name-bank p {
  color: #939393;
  font-family: Poppins;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  margin-bottom: 0;
}

.main-detail-profile-vcard h3 {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 17px;
  font-style: normal;
  font-weight: 400;
  position: relative;
  display: flex;
  left: 29px;
  top: -4px;
}

.align-form-profile {
  display: flex;
  justify-content: center;
  /* margin: 1px 19px; */
  margin-left: 34px;
  margin-top: 14px;
}

.bank-form-details {
  display: flex;
  width: 35%;
  padding: 22px 21px;
  border-radius: 18px;
  background: #1f1f1f;
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.25);
  flex-direction: column;
}

.bank-form-details h2 {
  display: flex;
  border-radius: 18px;
  background: #1f1f1f;
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.25);
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
}

.bank-form-details form label {
  border: none;
  outline: none;
  width: 100%;
  height: 45px;
  margin: 0px 0 19px 0px;
  border-radius: 0px 30px 30px 0px;
  position: relative;
  display: flex;
  align-items: center;
  border-radius: 50px;
  background: var(--text-color, #58585a);
}

.bank-form-details select {
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  border-radius: 6px 6px 6px 6px;
  padding-left: 34px;
  /* margin-bottom: 6px; */
  padding-right: 34px;
  font-size: 20px;
  cursor: pointer;
  appearance: none;
  color: #000;
  background: url(../images/category-imgs/down-arrow.svg);
  background-position: right 10px center;
  background-repeat: no-repeat;
}

.bank-form-details label input[type="text"] {
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  border-radius: 50px;
  background: var(--text-color, #58585a);
  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.25);
  /* border-radius: 6px 6px 6px 6px; */
  padding-left: 34px;
  /* margin-bottom: 6px; */
  padding-right: 34px;
  font-size: 14px;
  /* border: 1px solid #B6B6B6; */
  color: #fff;
}

.bank-form-details select option {
  background: var(--text-color, #58585a);
  color: #fff;
}

.bank-form-details label input[type="text"]::placeholder {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.bank-form-details select {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

/* PROFILE INFORMATION CSS */

/* JOB ACCEPTED CSS */

.job-accepted-flow-wrap {
  border-radius: 8px;
  background: #1f1f1f;
  padding: 14px 14px;
}

.service-system-info-wrap {
  display: flex;
  gap: 10px;
  position: relative;
  top: -25px;
  right: 12px;
  justify-content: end;
}

.service-system-info-wrap a h4 {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.job-accepted-flow-wrap h2 {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.job-accepted-flow-wrap a i {
  color: #fff;
  margin-top: 19px;
}

.job-accepted-flow-wrap2 {
  border-radius: 8px;
  background: #1f1f1f;
  padding: 14px 14px;
}

.job-accepted-flow-wrap2 h2 {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  margin-bottom: 0;
}

.job-accepted-flow-wrap2 a i {
  color: #fff;
  margin-top: 8px;
}

.job-accepted-flow-wrap p {
  color: var(--white, #fff);
  font-family: Roboto;
  font-size: 15px;
  font-style: normal;
  margin-bottom: 0;
  font-weight: 400;
}

.left-section-wrap {
  display: flex;
  gap: 13px;
  flex-direction: row;
}

.top-wrap-service {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.right-section-wrap {
  display: flex;
  gap: 11px;
}

.problem-accodation .accordion .accordion-item {
  border-radius: 10px;
  /* border: 1px solid rgba(23, 23, 72, 0.5); */
  margin-bottom: 15px;
  margin-top: 14px;
}

.problem-accodation .accordion .accordion-item button[aria-expanded="true"] {
  background: #f1f1f1;
  border-radius: 4px 4px 0 0px;
  background: var(--New-Footer-color, #1f1f1f);
  color: #fff;
  padding: 18px 36px;
}

.problem-accodation .accordion button {
  position: relative;
  display: flex;
  text-align: left;
  width: 100%;
  /* padding: 0px 0px; */
  /* color: #000; */
  font-size: 1.15rem;
  font-weight: 400;
  border: none;
  background: none;
  background: #f1f1f1;
  border-radius: 8px;
  background: var(--New-Footer-color, #1f1f1f);
  color: #fff;
  padding: 18px 36px;
  outline: none;
  align-items: center;
}

.problem-accodation .accordion button .accordion-title a.show-modal {
  margin-left: auto;
  margin-right: 20px;
}

.problem-accodation .accordion button:hover,
.accordion button:focus {
  cursor: pointer;
  color: #fff;
}

.problem-accodation .accordion button:hover::after,
.accordion button:focus::after {
  cursor: pointer;
  color: #171748;
  border: 1px solid #171748;
}

.problem-accodation .accordion button .accordion-title {
  padding: 0;
  font-weight: 600;
  font-size: 13px;
  color: #000;
  display: flex;
  justify-content: flex-start;
  width: 100%;
  align-items: center;
  padding: 24px 90px;
  background: #f1f1f1;
}

.problem-accodation .accordion button .icon {
  display: inline-block;
  position: absolute;
  top: 18px;
  right: 23px;
  width: 30px;
  /* display: flex; */
  color: #fff;
  /* background: aqua; */
  /* background: var(--btn-color, linear-gradient(90deg, #099D90 0%, #659F00 97.52%)); */
  height: 31px;
  /* border: 1px solid; */
  border-radius: 43px;
}

.problem-accodation .accordion button .icon::before {
  display: block;
  position: absolute;
  content: "";
  top: 13px;
  left: 5px;
  width: 17px;
  height: 2px;
  background: currentColor;
}

.problem-accodation .accordion button .icon::after {
  display: block;
  position: absolute;
  content: "";
  top: 7px;
  left: 13px;
  width: 2px;
  height: 14px;
  background: currentColor;
}

.problem-accodation .accordion button[aria-expanded="true"] {
  color: #000;
}

.problem-accodation .accordion button[aria-expanded="true"] .icon::after {
  width: 0;
}

.problem-accodation .accordion button[aria-expanded="true"]+.accordion-content {
  opacity: 1;
  max-height: 100em;
  transition: all 200ms linear;
  will-change: opacity, max-height;
  background: #000;
}

.problem-accodation .accordion .accordion-content {
  opacity: 0;
  max-height: 0;
  overflow: hidden;
  /* transition: opacity 200ms linear, max-height 200ms linear; */
  will-change: opacity, max-height;
}

.problem-accodation .accordion .accordion-content p {
  font-size: 14px;
  font-weight: 400;
  margin: 0;
  color: #333333;
  line-height: 29px;
}

.current-status-wrap {
  background: #000;
  height: 185px;
  overflow-y: scroll;
  overflow-x: hidden;
  margin: 10px 0 3px 0px;
}

.current-status-wrap::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

.current-status-wrap::-webkit-scrollbar-track {
  border-radius: 4px;
  background: var(--Gray-1, #333);
}

.current-status-wrap::-webkit-scrollbar-thumb {
  background-color: #e50916;
  /* border: 1px solid #fff; */
  border-radius: 5px;
}

.current-status-wrap h1 {
  color: var(--App-Red, #ce2127);
  font-family: Poppins;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  margin: 14px 10px 0;
  /* position: absolute; */
}

.linewap {
  position: relative;
}

.linewap:after {
  width: 3px;
  height: 90%;
  position: absolute;
  content: "";
  top: 0px;
  left: 19px;
  background: #219653;
  z-index: 99;
}

.imgae-track img {
  position: relative;
  z-index: 9999;
}

.track-section-one {
  display: flex;
  gap: 10px;
  align-items: baseline;
  margin: -9px 0 10px 8px;
}

.track-section-one .content-track h3 {
  color: var(--Green-1, #219653);
  font-family: Poppins;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  margin-bottom: 4px;
}

.content-track a {
  font-size: 14px;
  color: var(--bs-link-color);
}

.track-section-one .content-track p {
  color: var(--white, #fff) !important;
  font-family: Poppins;
  font-size: 13px !important;
  font-style: normal;
  padding: 0 !important;
  font-weight: 400 !important;
  line-height: 21px !important;
}

.track-section-one .content-track span {
  color: var(--Gray-4, #bdbdbd);
  font-family: Poppins;
  font-size: 13px;
  font-style: normal;
  padding: 0;
  font-weight: 500;
}

.view-estimate-wrap {
  margin: 19px 0 18px 0;
}

.view-estimate-wrap a {
  border-radius: 4px;
  border: 1px solid var(--App-Red, #ce2127);
  padding: 10px 14px;
  color: var(--App-Red, #ce2127);
  text-align: center;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
}

.client-location-wrap {
  margin: 19px 0 18px 0;
}

.client-location-wrap a {
  border-radius: 30px;
  background: var(--App-Red, #ce2127);
  padding: 10px 24px;
  color: var(--App-Red, #ce2127);
  text-align: center;
  color: #fff;
  text-align: center;
  font-size: 14px;
}

.pause-btn-wrap {
  margin: 19px 11px 18px 2px;
  display: flex;
  justify-content: end;
}

.pause-btn-wrap a {
  /* border-radius: 4px; */
  /* border: 1px solid var(--App-Red, #ce2127); */
  border-radius: 30px;
  border: 1px solid var(--white, #fff);
  padding: 10px 14px;
  color: #fff;
  text-align: center;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
}

/* VIEW ESTIMATE POPUP CSS */

#view-estimate .modal-dialog {
  padding: 0rem 0rem 2rem 0rem;
  margin-top: 2rem;
  max-width: 552px;
}

.view-estimate-main-wrap {
  display: flex;
  justify-content: space-between;
  padding: 14px 24px;
  margin-bottom: -14px;
}

.left-estiamte-sec {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}

.right-estiamte-sec {
  display: flex;
  flex-direction: column;
  gap: 9px;
  margin-top: 21px;
}

.view-estimate-main-wrap2 {
  display: flex;
  justify-content: space-between;
  padding: 14px 24px;
  margin-bottom: -14px;
}

.left-estiamte-sec2 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}

.right-estiamte-sec2 {
  display: flex;
  flex-direction: column;
  gap: 9px;
  margin-top: 0px;
}

.view-estimate-main-wrap .left-estiamte-sec h2 {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
}

.view-estimate-main-wrap .left-estiamte-sec p {
  color: var(--Gray-4, #bdbdbd);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  margin-bottom: 6px;
  font-weight: 400;
}

.view-estimate-main-wrap2 .right-estiamte-sec2 p {
  color: var(--Gray-4, #bdbdbd);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  margin-bottom: 6px;
  font-weight: 400;
}

.view-estimate-main-wrap .right-estiamte-sec span {
  color: var(--Gray-4, #bdbdbd);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.view-estimate-main-wrap2 .left-estiamte-sec2 h2 {
  color: #ce2127;
  font-family: Poppins;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
}

.view-estimate-main-wrap2 .left-estiamte-sec2 p {
  color: var(--Gray-4, #bdbdbd);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  margin-bottom: 6px;
  font-weight: 400;
}

.view-estimate-main-wrap2 .right-estiamte-sec2 span {
  color: #ce2127;
  font-family: Poppins;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
}

.estimate-btns-wrap {
  display: flex;
  padding: 0 19px 0 20px;
  gap: 21px;
  margin-top: 19px;
}

.estimate-btns-wrap a:nth-child(1) {
  border-radius: 24px;
  background: #3a3a3a;
}

.estimate-btns-wrap a:nth-child(2) {
  border-radius: 24px;
  background: var(--App-Red, #ce2127);
}

/* VIEW ESTIMATE POPUP CSS */

/* JOB ACCEPTED CSS */

/* REOCURRING PROBLEM CSS */

.problem-accodation .preview-request-in {
  width: 100%;
  height: auto;
}

.problem-accodation .preview-request-in .uploaded-imge-wrap .inner-img img {
  width: 85px;
  height: 50px;
  object-fit: cover;
}

.problem-accodation .preview-request-in .detailss {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  justify-content: flex-start;
}

.problem-accodation .preview-request-in .detailss input[type="checkbox"] {
  width: 24px;
  height: 18px;
  margin-right: 4px;
  cursor: pointer;
  appearance: none;
  border: 2px solid #ce2127;
  /* background-color: #CE2127; */
  border-radius: 3px;
  outline: none;
}

.problem-accodation .preview-request-in .detailss input[type="checkbox"]:checked {
  background-image: url(../images/start-project-imgs/arrow-check.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 12px;
  background-color: #ce2127;
}

.problem-accodation .preview-request-in .description-wrappp {
  display: flex;
  gap: 6px;
  align-items: baseline;
}

.problem-accodation .preview-request-in .description-wrappp-2 {
  display: flex;
  gap: 0px;
  align-items: baseline;
  flex-direction: column;
}

.problem-accodation .preview-request-in .description-wrappp h5 {
  color: var(--Gray-1, #fff);
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
}

.problem-accodation .preview-request-in .description-wrappp-2 h5 {
  color: var(--Gray-1, #fff);
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
}

.problem-accodation .preview-request-in .description-wrappp p {
  color: var(--Gray-3, #fff);
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
  padding: 3px;
}

.problem-accodation .preview-request-in .description-wrappp-2 p {
  color: var(--Gray-3, #fff);
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
  padding: 3px;
}

.reocurring-form-wrap h3 {
  color: var(--white, #fff);
  text-align: left;
  font-family: Poppins;
  font-size: 19px;
  font-weight: 600;
  margin: 4px 0 16px 0;
}

.reocurring-form-wrap {
  border-radius: 4px;
  /* background: #232323; */
  padding: 14px 0px;
  width: 39%;
}

.reocuur-btn-wrap {
  display: flex;
  justify-content: center;
}

.reocuur-btn-wrap a {
  border-radius: 30px;
  background: var(--App-Red, #ce2127);
  padding: 14px 10px;
  width: auto;
  font-size: 14px;
  display: flex;
  width: 34%;
  justify-content: center;
  color: #fff;
  margin-bottom: 0;
}

.reocurring-form-wrap textarea {
  border: none;
  outline: none;
  width: 100%;
  height: auto;
  padding: 14px 14px;
  margin: 0px 0 19px 0px;
  border-radius: 0px 30px 30px 0px;
  position: relative;
  display: flex;
  color: #fff;
  align-items: center;
  border-radius: 10px;
  background: var(--text-color, #58585a);
}

.reocurring-form-wrap textarea::placeholder {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.reocurring-form-wrap label {
  border: none;
  outline: none;
  width: 100%;
  height: 45px;
  margin: 0px 0 19px 0px;
  border-radius: 0px 30px 30px 0px;
  position: relative;
  display: flex;
  align-items: center;
  border-radius: 50px;
  background: var(--text-color, #58585a);
}

.reocurring-form-wrap .add-blog-image .upload-wrap span {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.reocurring-form-wrap .edit-_txt-blog {
  width: 100%;
  height: 120px;
  background: #efefef;
  border: none;
  font-size: 13px;
  margin-bottom: 20px;
  position: relative;
  font-weight: 500;
  color: transparent;
  font-family: "Aleo", serif;
  padding: 0px 10px;
  border-radius: 4px !important;
  display: flex;
  align-items: center;
  cursor: pointer;
}

.reocurring-form-wrap .add-blog-image {
  overflow: inherit !important;
  /* background: #efefef; */
  /* border: 2px dashed #C0C0C0; */
  font-size: 14px;
  margin-bottom: 4px;
  margin-top: 19px;
  font-weight: 500;
  width: 100%;
  color: #444444;
  /* font-family: sans-serif; */
  display: flex;
  margin: 0;
  padding: 17px;
  text-align: initial;
  border-radius: 50px;
  cursor: pointer;
  margin-bottom: 20px;
}

.reocurring-form-wrap label img {
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  /* height: fit-content; */
  /* background: #E50916; */
  position: absolute;
  padding: 0px;
  border-radius: 6px 6px 6px 6px;
  left: 19px;
  top: auto;
}

.reocurring-form-wrap .upload-wrap img {
  right: 20px;
  left: inherit !important;
}

.reocurring-form-wrap .uploaded-imge-wrap {
  display: flex;
  gap: 10px;
  margin-bottom: 16px;
}

.reocurring-form-wrap .uploaded-imge-wrap img:nth-child(2) {
  width: 93px;
  height: 82px;
  object-fit: cover;
}

.reocurring-form-wrap .arrange-upload-wrap {
  display: flex;
  gap: 13px;
  align-items: center;
  margin-top: 6px;
  width: 100%;
}

.reocurring-form-wrap .imgae-manage {
  position: relative;
}

.reocurring-form-wrap .imgae-manage a {
  width: 18px;
  height: 18px;
  display: block;
  position: absolute;
  right: -5px;
  top: -5px;
  border-radius: 50%;
}

.reocurring-form-wrap .inner-img {
  width: auto;
}

/* REOCUURING PROBLEM CSS */

/* TRANSCTION CSS */

.transction-heading {
  text-align: left;
}

.transction-heading h3 {
  color: var(--white, #fff);
  font-family: Roboto;
  font-size: 32px;
  font-style: normal;
  font-weight: 600;
}

/* TRANSCTION CSS */

/* PAYMENT METHOD CSS */

.payment-heading {
  text-align: left;
  margin-bottom: 19px;
}

.payment-heading h3 {
  color: var(--white, #fff);
  font-family: Roboto;
  font-size: 32px;
  font-style: normal;
  font-weight: 600;
}

.payment-method-cards {
  display: flex;
  justify-content: center;
  gap: 3px;
  margin-left: -32px;
}

.add-card-wrap-btn {
  display: flex;
  margin: 10px;
  justify-content: end;
}

.add-card-wrap-btn a {
  color: #fff;
}

/* PAYMENT METHOD CSS */

/* MEMBERSHIP CSS */

.memberplan-wrap {
  display: flex;
  gap: 14px;
  align-items: center;
}

.memberplan-wrap .box {
  border-radius: 10.274px;
  background: var(--New-Footer-color, #1f1f1f);
  box-shadow: 0px 0px 14.67694px 0px rgba(0, 0, 0, 0.25);
  padding: 17px;
  width: 34%;
  position: relative;
}

.active-img-wrap {
  position: absolute;
  right: 0;
  top: 0px;
}

.memberplan-wrap .box .image-payment-icon {
  width: 150px;
  height: 158px;
  object-fit: cover;
  margin: 0 auto;
}

.memberplan-wrap .box.active {
  animation: Shake 0.8s linear infinite;
}

@keyframes Shake {
  0% {
    transform: translateX(0);
  }

  25% {
    transform: translateX(5px);
  }

  50% {
    transform: translateX(-5px);
  }

  75% {
    transform: translateX(5px);
  }

  100% {
    transform: translateX(0);
  }
}

.memberplan-wrap .box .head-section-wrap h2 {
  color: var(--white, #fff);
  text-align: center;
  font-family: Roboto;
  font-size: 22px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  margin: 10px 0 5px 0;
}

.memberplan-wrap .box .head-section-wrap span {
  color: #ce2127;
  /* text-align: center; */
  font-family: Roboto;
  font-size: 26px;
  font-style: normal;
  display: flex;
  justify-content: center;
  margin-bottom: 4px;
}

.memberplan-wrap .descripttion-payment ul {
  padding-left: 0rem;
}

.memberplan-wrap .descripttion-payment li {
  color: var(--white, #fff);
  font-family: Roboto;
  font-size: 14px;
  font-style: normal;
  list-style-type: none;
  font-weight: 400;
  display: flex;
  align-items: center;
  gap: 5px;
}

.memberplan-wrap .payment-btns-warp {
  display: flex;
  justify-content: center;
  gap: 16px;
  margin: 30px 0 0px 0;
}

.memberplan-wrap .payment-btns-warp a:nth-child(1) {
  border-radius: 30px;
  background: var(--Black, #000);
  color: #fff;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  padding: 11px 43px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.memberplan-wrap .payment-btns-warp a:nth-child(2) {
  border-radius: 30px;
  background: var(--Black, #ce2127);
  color: #fff;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  padding: 11px 43px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.memberplan-btns-warp {
  display: flex;
  justify-content: center;
  gap: 16px;
  margin: 30px 0 0px 0;
}

.memberplan-btns-warp a {
  border-radius: 30px;
  background: var(--Black, #ce2127);
  color: #fff;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  padding: 11px 43px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

/* MEMBERSHIP CSS */

/* SIDEBAR CSS */

.sidenav2 {
  height: auto;
  width: 0;
  position: fixed;
  z-index: 99;
  top: 0;
  /* left: 0; */
  right: 3px;
  background-color: #292929;
  overflow-x: hidden;
  /* padding-top: 60px; */
  transition: 0.5s;
}

.sidenav2 a {
  padding: 8px 8px 8px 2px;
  text-decoration: none;
  font-size: 25px;
  font-family: Gotham;
  color: #818181;
  display: block;
  transition: 0.3s;
}

.sidenav2 a:hover,
.offcanvas a:focus {
  color: #f1f1f1;
}

.sidenav2 .closebtn {
  position: absolute;
  top: 6px;
  right: 6px;
  font-size: 23px;
  margin-left: 50px;
  background: #fff;
  color: #21a99d;
}

.sidenav2 .closebtn:hover {
  font-size: 23px;
  margin-left: 50px;
  background: #fff;
  color: #21a99d;
}

.sidenav2 h3 {
  color: #fff;
  font-family: Poppins;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin: 10px 0 10px 0px;
  padding: 10px 14px;
  border-bottom: 1px solid #3c3c3c;
  width: 100%;
}

.sidenav2 h3 img {
  margin-right: 4px;
}

.sidenav2 h4 {
  color: #fff;
  font-family: Poppins;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin: -17px 0 12px -6px;
  padding: 10px 14px;
  border-bottom: 1px solid #3c3c3c;
  width: 100%;
}

.sidenav2 h4 img {
  margin-right: 4px;
}

.notification-content-wrap {
  padding: 0px 10px;
}

.inner-content {
  display: flex;
  gap: 7px;
  align-items: flex-start;
  background: #404040;
  padding: 10px 8px;
  margin-bottom: 4px;
}

.inner-content .user-logo img {
  width: 26px;
  height: 26px;
  object-fit: cover;
  border-radius: 30px;
  margin-top: 4px;
}

.inner-content .description-wrap {
  display: flex;
  flex-direction: column;
}

.inactive-wrap img {
  width: 16px !important;
}

.inner-content p {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 11px;
  font-style: normal;
  font-weight: 500;
  margin-bottom: 0;
}

.inner-content span {
  color: var(--Gray-5, #e0e0e0);
  font-family: Poppins;
  font-size: 10px;
  font-style: normal;
  font-weight: 400;
}

.sidenav2 .closebtn {
  position: absolute;
  top: 6px;
  right: 6px;
  font-size: 23px;
  margin-left: 50px;
  background: #fff;
  color: #313636;
}

.close-btn-front {
  position: absolute;
  top: 7px;
  right: 7px;
  border-radius: 50%;
  width: 25px;
  height: 25px;
  box-shadow: none;
  color: #fff;
  background: #20a99d;
  margin-left: auto;
  text-shadow: none;
  font-size: 23px;
  font-weight: 400;
  opacity: 1;
  line-height: 23px;
  z-index: 9;
}

.sidenav2 .closebtn:hover {
  font-size: 23px;
  margin-left: 50px;
  background: #fff;
  color: #313636;
}

/* SIDEBAR CSS */

/* CHATBOX SIDEBAR CSS */

.sidenav3 {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 99;
  top: 0;
  /* left: 0; */
  right: 3px;
  background-color: #292929;
  overflow-x: hidden;
  /* padding-top: 60px; */
  transition: 0.5s;
}

.sidenav3 a {
  padding: 8px 8px 8px 2px;
  text-decoration: none;
  font-size: 25px;
  font-family: Gotham;
  color: #818181;
  display: block;
  transition: 0.3s;
}

.sidenav3 a:hover,
.offcanvas a:focus {
  color: #f1f1f1;
}

.sidenav3 .closebtn {
  position: absolute;
  top: 6px;
  right: 6px;
  font-size: 23px;
  margin-left: 50px;
  background: #fff;
  color: #21a99d;
}

.sidenav3 .closebtn:hover {
  font-size: 23px;
  margin-left: 50px;
  background: #fff;
  color: #21a99d;
}

.sidenav3 h3 {
  color: #fff;
  font-family: Poppins;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin: 10px 0 10px 0px;
  padding: 10px 14px;
  border-bottom: 1px solid #3c3c3c;
  width: 100%;
}

.sidenav3 h3 img {
  margin-right: 4px;
}

.sidenav3 h4 {
  color: #fff;
  font-family: Poppins;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin: -17px 0 12px -6px;
  padding: 10px 14px;
  border-bottom: 1px solid #3c3c3c;
  width: 100%;
}

.sidenav3 h4 img {
  margin-right: 4px;
}

.sidenav3 .closebtn {
  position: absolute;
  top: 6px;
  right: 6px;
  font-size: 23px;
  margin-left: 50px;
  background: #fff;
  color: #313636;
}

.close-btn-front {
  position: absolute;
  top: 7px;
  right: 7px;
  border-radius: 50%;
  width: 25px;
  height: 25px;
  box-shadow: none;
  color: #fff;
  background: #20a99d;
  margin-left: auto;
  text-shadow: none;
  font-size: 23px;
  font-weight: 400;
  opacity: 1;
  line-height: 23px;
  z-index: 9;
}

.sidenav3 .closebtn:hover {
  font-size: 23px;
  margin-left: 50px;
  background: #fff;
  color: #313636;
}

.sidebarbar-chatbox-wrap {
  padding: 62px 10px 14px 12px;
}

/* .bottomright-chat-box {
    padding-top: 19px;
    position: absolute;
    right: 14px;
  }

  .topleft-chat-box {
    position: relative;
    left: 2px;
  } */

.topleft-chat-box {
  position: relative;
  left: 2px;
  background: #fff;
  border-radius: 6px;
  padding: 8px;
  width: 90%;
}

.topleft-chat-box::before {
  width: 20px;
  height: 20px;
  content: " ";
  background-image: url(../images/chat-imgs/arrow-top.png);
  position: absolute;
  left: -3px;
  bottom: -8px;
  z-index: 99999;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.bottomright-chat-box {
  position: absolute;
  background: #646464;
  right: 9px;
  border-radius: 6px;
  padding: 8px;
  width: 90%;
  margin-top: 16px;
}

.bottomright-chat-box::before {
  width: 20px;
  height: 20px;
  content: " ";
  background-image: url(../images/chat-imgs/arrow-bottom.png);
  position: absolute;
  right: 1px;
  bottom: -10px;
  z-index: 99999;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.topleft-chat-box .topimage-chat-box {
  position: absolute;
}

.topleft-chat-box .content-chat {
  position: relative;
}

.topleft-chat-box .content-chat p {
  color: #000;
  font-family: Poppins;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  margin-bottom: 0;
  margin-left: 15px;
  padding: 5px 0 0 0;
}

.topleft-chat-box .content-chat span {
  color: var(--Input-color, #58585a);
  font-family: Poppins;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  position: relative;
  display: flex;
  justify-content: end;
  right: 6px;
}

.bottomright-chat-box .content-chat p {
  color: #fff;
  font-family: Poppins;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  margin-bottom: 0;
  margin-left: 15px;
  padding: 5px 0 0 0;
}

.bottomright-chat-box .content-chat span {
  color: #fff;
  font-family: Poppins;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  position: relative;
  display: flex;
  justify-content: end;
  right: 6px;
}

.replys-btn-wrap {
  position: absolute;
  bottom: 91px;
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  /* align-content: space-around; */
  flex-wrap: wrap;
  padding: 0 14px 0 5px;
}

.replys-btn-wrap button {
  border-radius: 50px;
  border: 1px solid var(--Gray-5, #e0e0e0);
  color: var(--white, #fff);
  text-align: center;
  padding: 9px 20px;
  width: 100%;
  font-family: Poppins;
  background: transparent;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
}

.msg-input-wrap {
  position: absolute;
  bottom: 4px;
  display: flex;
  padding: 10px 19px;
  gap: 5px;
  align-items: center;
  justify-content: center;
}

.msg-input-wrap input[type="text"] {
  padding: 9px 24px 9px 19px;
  border: none;
  outline: none;
  border-radius: 30px;
  background: #202021;
  color: #fff;
}

.msg-input-wrap a {
  padding: 8px 9px 8px 8px;
  text-decoration: none;
  font-size: 25px;
  font-family: Gotham;
  /* color: #818181; */
  border-radius: 30px;
  display: block;
  background: #202021;
  transition: 0.3s;
}

.msg-input-wrap input::placeholder {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
}

/* CHATBOX SIDEBAR CSS */

/* FOOTER-SECTION */

.footer-wrap {
  background: var(--btn-color,
      linear-gradient(90deg, #099d90 0%, #659f00 97.52%));
  width: 100%;
  height: auto;
  padding: 40px 0;
}

.footer-in {
  width: 100%;
  height: auto;
}

.footer-in-mid {
  padding-left: 100px;
}

.footer-in img {
  filter: brightness(0) invert(1);
  width: 160px;
  height: auto;
  margin-bottom: 22px;
}

.footer-in h1 {
  color: #fff;
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 20px;
}

.footer-in p {
  color: #fff;
  font-size: 15px;
  font-weight: 400;
  line-height: 25px;
  margin-bottom: 10px;
}

.footer-in p a {
  color: #fff;
}

.footer-in ul {
  padding: 0;
  margin: 0;
  display: flex;
  gap: 15px;
}

.footer-in ul li {
  list-style: none;
}

.footer-in ul li a {
  display: flex;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.4);
  color: #fff;
  align-items: center;
  justify-content: center;
  transform: rotate(0deg);
  transition: 0.5s;
}

.footer-in ul li a:hover {
  transform: rotate(360deg);
  transition: 0.5s;
}

.footer-bottom {
  width: 100%;
  height: auto;
  background: #111;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  padding: 17px 0;
  position: relative;
  bottom: 0;
}

.footer-bottom-in {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;
}

.footer-bottom-in p {
  margin: 0;
  color: #fff;
  font-size: 14px;
  font-weight: 400;
  display: flex;
  align-items: center;
  gap: 5px;
}

.footer-bottom-in p a {
  color: #fff;
}

.footer-bottom-in p i {
  font-size: 18px;
  color: red;
}

.footer-bottom-in .social-wrap {
  display: flex;
  gap: 10px;
  align-items: center;
}

.social-wrap .inner-icons {
  display: flex;
  gap: 8px;
}

/* FOOTER-SECTION */

/* VIEW ESTIMATE POPUP CSS */

.feedback-request-in {
  width: 100%;
  height: auto;
}

#view-estimate .modal-dialog {
  padding: 0rem 0rem 2rem 0rem;
  margin-top: 2rem;
  max-width: 552px;
}

.view-estimate-main-wrap {
  display: flex;
  justify-content: space-between;
  padding: 14px 24px;
  margin-bottom: -14px;
}

.left-estiamte-sec {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}

.right-estiamte-sec {
  display: flex;
  flex-direction: column;
  gap: 9px;
  margin-top: 21px;
}

.view-estimate-main-wrap2 {
  display: flex;
  justify-content: space-between;
  padding: 14px 24px;
  margin-bottom: -14px;
}

.left-estiamte-sec2 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}

.right-estiamte-sec2 {
  display: flex;
  flex-direction: column;
  gap: 9px;
  margin-top: 0px;
}

.view-estimate-main-wrap .left-estiamte-sec h2 {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
}

.view-estimate-main-wrap .left-estiamte-sec p {
  color: var(--Gray-4, #bdbdbd);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  margin-bottom: 6px;
  font-weight: 400;
}

.view-estimate-main-wrap2 .right-estiamte-sec2 p {
  color: var(--Gray-4, #bdbdbd);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  margin-bottom: 6px;
  font-weight: 400;
}

.view-estimate-main-wrap .right-estiamte-sec span {
  color: var(--Gray-4, #bdbdbd);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.view-estimate-main-wrap2 .left-estiamte-sec2 h2 {
  color: #ce2127;
  font-family: Poppins;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
}

.view-estimate-main-wrap2 .left-estiamte-sec2 p {
  color: var(--Gray-4, #bdbdbd);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  margin-bottom: 6px;
  font-weight: 400;
}

.view-estimate-main-wrap2 .right-estiamte-sec2 span {
  color: #ce2127;
  font-family: Poppins;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
}

.estimate-btns-wrap {
  display: flex;
  padding: 0 19px 0 20px;
  gap: 21px;
  margin-top: 19px;
}

.estimate-btns-wrap a:nth-child(1) {
  border-radius: 24px;
  background: #3a3a3a;
}

.estimate-btns-wrap a:nth-child(2) {
  border-radius: 24px;
  background: var(--App-Red, #ce2127);
}

/* VIEW ESTIMATE POPUP CSS */

/* ESTIMATION DATA LIST CSS */

.estmation-inner-list {}

.estimation-datalist-wrap form {
  width: 100%;
  height: auto;
  position: relative;
  padding-top: 5px;
  display: flex;
  gap: 10px;
  /* flex-wrap: wrap; */
  justify-content: center;
}

.estimation-datalist-wrap h3 {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
}

.estimation-datalist-wrap p {
  color: var(--Gray-6, #f2f2f2);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  margin-bottom: 5px;
}

.para-estimate-wrap {
  display: flex;
  justify-content: space-between;
  gap: 190px;
}

.total-sec-wrap {
  margin: 14px 0 14px 0;
}

.border-line-sec {
  border-bottom: 1px solid #3e3e3e;
}

/* .estimation-perticular-sec {
  border-bottom: 1px solid #3E3E3E;
} */

.total-sec-wrap label {
  display: flex;
  justify-content: center;
  width: 47%;
  margin-top: 10px;
  height: 37px !important;
  margin-bottom: 4px;
  background: transparent !important;
  margin-bottom: 0 !important;
}

.total-sec-wrap label input[type="text"] {
  width: 73%;
  height: 100%;
  border: none;
  outline: none;
  border-radius: 0px;
  /* padding-left: 21px; */
  /* margin-bottom: 6px; */
  background: #000;
  /* padding-right: 40px; */
  padding: 9px 15px;
  font-size: 14px;
  border: 1px solid #ce2127;
  color: #fff;
}

.total-sec-wrap button {
  width: 57%;
  height: 37.428px;
  /* border-radius: 0px; */
  background: #ce2127;
  color: #fff !important;
  font-size: 20px;
  border-radius: 0 4px 4px 0;
  border: none;
  display: flex;
  font-weight: 500;
  left: 0px;
  position: relative;
  text-align: center;
  align-items: center;
  justify-content: center;
}

.grand-total-wrap {
  display: flex;
  justify-content: space-between;
  gap: 190px;
}

.grand-total-wrap p {
  color: var(--App-Red, #ce2127);
  font-family: Poppins;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.service-type-wrap {
  display: flex;
  justify-content: center;
  gap: 7px;
  align-items: baseline;
}

.service-type-wrap p {
  color: var(--App-Red, #ce2127);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.service-type-wrap span {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
}

/* ESTIMATION DATA LIST CSS */

/* CHOOSE REPALCE REPAIR CSS */

.replace-repair-wrap {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.left-repair-wrap {
  border-radius: 6.575px;
  background: var(--text-color, #58585a);
  box-shadow: 0px 0px 2.63px 0px rgba(0, 0, 0, 0.25);
  padding: 19px 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 17px;
  position: relative;
}

.left-repair-wrap img {
  display: block;
  width: 60px;
  height: 60px;
  margin: 0 !important;
  margin-bottom: 7px;
}

.left-repair-wrap h3 {
  color: var(--white, #fff);
  text-align: center;
  font-family: Poppins;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin-bottom: 0;
}

.right-replace-wrap {
  border-radius: 6.575px;
  background: var(--text-color, #58585a);
  box-shadow: 0px 0px 2.63px 0px rgba(0, 0, 0, 0.25);
  padding: 19px 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 17px;
  position: relative;
}

.right-replace-wrap img {
  display: block;
  width: 60px;
  height: 60px;
  margin: 0 !important;
  margin-bottom: 7px;
}

.right-replace-wrap h3 {
  color: var(--white, #fff);
  text-align: center;
  font-family: Poppins;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin-bottom: 0;
}

.left-repair-wrap input[type="radio"] {
  appearance: none;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: transparent;
  outline: 2px solid #fff;
  outline-offset: 2px;
  position: absolute;
  right: 10px;
  top: 13px;
  left: inherit;
}

.left-repair-wrap input[type="radio"]:checked {
  background: #ce2127;
  outline: 1px solid #ce2127;
}

.right-replace-wrap input[type="radio"] {
  appearance: none;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: transparent;
  outline: 2px solid #fff;
  outline-offset: 2px;
  position: absolute;
  right: 10px;
  top: 13px;
  left: inherit;
}

.right-replace-wrap input[type="radio"]:checked {
  background: #ce2127;
  outline: 1px solid #ce2127;
}

.job-accepted-flow-wrap3 {
  border-radius: 8px;
  background: transparent;
  padding: 14px 14px;
}

.job-accepted-flow-wrap3 h2 {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  margin-bottom: 0;
}

.job-accepted-flow-wrap3 a i {
  color: #fff;
  margin-top: 8px;
}

/* CHOOSE REPALCE REPAIR CSS */

/* SERVICES CSS */

.show-services-wrap {
  border-radius: 6.575px;
  background: var(--text-color, #58585a);
  box-shadow: 0px 0px 2.63px 0px rgba(0, 0, 0, 0.25);
  padding: 19px 15px;
  display: flex;
  /* align-items: center; */
  /* justify-content: center; */
  gap: 4px;
  position: relative;
  flex-direction: column;
  /* flex-wrap: wrap; */
  width: 99%;
}

.service-card-wrap {
  width: 48%;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 7px 0 0px 0;
  flex-direction: row;
}

.head-service {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.head-service h4 {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
}

.head-service span {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
}

.show-service-content p {
  color: var(--Gray-5, #e0e0e0);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  margin-bottom: 0;
}

.bottom-services {
  display: flex;
  justify-content: space-between;
  align-items: center;
  /* margin-bottom: 0; */
}

.bottom-services a {
  color: var(--Blue-1, #2f80ed);
  font-family: Poppins;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
}

.bottom-services button {
  border-radius: 3px;
  border: 1px solid var(--white, #fff);
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 12px;
  font-style: normal;
  padding: 5px 13px;
  font-weight: 400;
  background: transparent;
}

.service-card-wrap {
  /* background: #000; */
  height: 295px;
  overflow-y: scroll;
  overflow-x: hidden;
  margin: 10px 0 3px 0px;
}

.service-card-wrap::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

.service-card-wrap::-webkit-scrollbar-track {
  border-radius: 4px;
  background: var(--Gray-1, #333);
}

.service-card-wrap::-webkit-scrollbar-thumb {
  background-color: #e50916;
  /* border: 1px solid #fff; */
  border-radius: 5px;
}

.system-dropdowns-wrap form .uploadrap {
  width: 100%;
}

.system-dropdowns-wrap form .uploadrap .add-component-image {
  overflow: inherit !important;
  /* background: #efefef; */
  border: 2px dashed #c0c0c0;
  font-size: 14px;
  margin-bottom: 4px;
  margin-top: 19px;
  font-weight: 500;
  width: 10%;
  color: #444444;
  /* font-family: sans-serif; */
  /* display: flex; */
  margin: 5px 0 5px 0 !important;
  padding: 17px 38px;
  text-align: initial;
  position: relative;
  border-radius: 3px;
  cursor: pointer;
}

.checklist-price-wrap {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 30%;
}

.checklist-price-wrap input[type="checkbox"] {
  width: 19px;
  height: 18px;
  margin-right: 4px;
  cursor: pointer;
  appearance: none;
  border: 2px solid #fff;
  /* background-color: #CE2127; */
  border-radius: 3px;
  outline: none;
}

.checklist-price-wrap input[type="checkbox"]:checked {
  background-image: url(../images/start-project-imgs/arrow-check.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 12px;
  background-color: #ce2127;
  border: none;
}

.checklist-price-wrap span {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.price-checkbox-wrap span {
  color: #ce2128;
  text-align: center;
  font-family: Poppins;
  background: transparent;
  font-size: 15px;
  font-style: normal;
  border-radius: 38px;
  font-weight: 400;
}

.price-checkbox-wrap {
  position: absolute;
  right: 0;
  left: inherit;
  display: flex;
  gap: 14px;
  align-items: center;
}

.minus,
.plus {
  width: 24px;
  height: 25px;
  background: #f2f2f2;
  border-radius: 4px;
  padding: 1px 1px 1px 1px;
  border: 2px solid #ce2128;
  display: inline-block;
  vertical-align: middle;
  color: #0b0c0c;
  text-align: center;
  cursor: pointer;
}

.number input {
  height: 27px;
  width: 41px;
  text-align: center;
  font-size: 16px;
  color: #ce2128;
  border: 1px solid #ce2128;
  border-radius: 4px;
  background: transparent;
  display: inline-block;
  vertical-align: middle;
}

/* SERVICES CSS */

/* tradesman profile detail */

.project-left-area .wrapper header .icons {
  display: flex;
  justify-content: space-between;
  width: 100%;
  align-items: baseline;
}

.problem-accodation .accordion .accordion-content p.current-date {
  color: #fff;
  font-size: 18px;
}

.trademan-detail-profile {
  padding-top: 36px;

  .trdesman-img-wrap img {
    display: block;
    margin: 0 auto;
    border-radius: 60px;
    width: 74px;
    height: 74px;
    object-fit: cover;
    border: 3px solid #ce2127;
  }

  .name-details-trdesman {
    display: flex;
    align-items: center;
    gap: 8px;
    justify-content: center;
    padding-top: 14px;

    h5 {
      color: var(--Gray-1, #fff);
      font-size: 16px;
      font-style: normal;
      font-weight: 700;
      margin-bottom: 0;
    }
  }

  .job-complete-ratings {
    padding: 10px 14px;
    display: flex;
    gap: 5px;
    flex-direction: column;
    align-items: center;

    h5 {
      color: var(--Gray-1, #fff);
      font-size: 14px;
      font-style: normal;
      font-weight: 400;
      margin-bottom: 0px;
    }

    .ratings-count {
      display: flex;
      align-items: center;
      gap: 14px;

      h5 {
        color: var(--Gray-1, #fff);
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        margin-bottom: 0;
      }
    }
  }
}

.problem-accodation .preview-request-in .description-wrappp .listing-wrap li {
  color: var(--Gray-3, #fff);
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
  display: flex;
  align-items: center;
  gap: 6px;
}

.problem-accodation .preview-request-in .description-wrappp .listing-wrap ul {
  padding-left: 0;
}

.problem-accodation .preview-request-in .description-wrappp .listing-wrap li::before {
  content: "";
  background-color: var(--App-Red, #ce2127);
  padding: 4px 4px;
  height: 1px;
  border-radius: 54px;
}

.description-wrappp.list-break {
  display: flex;
  flex-direction: column;
}

/* / SELECT AVAILABLITY PAGE CSS / */

.start-project-inner-wrap .add-availability-time-area {
  width: 50%;
  height: auto;
  flex-direction: column;
  justify-content: center;
  padding: 31px;
  border-radius: 0px 10px 10px 0px;
  border: 1px solid #343434;
}

.add-availability-time-wpp {
  display: flex;
  justify-content: center;
  gap: 22px;
  align-items: center;
  padding-bottom: 28px;
}

.add-availability-scroll {
  height: 290px;
  overflow-y: scroll;
  overflow-x: hidden;
  margin: 10px 0 3px 0px;
}

.add-availability-scroll::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

.add-availability-scroll::-webkit-scrollbar-track {
  border-radius: 4px;
  background: var(--Gray-1, #333);
}

.add-availability-scroll::-webkit-scrollbar-thumb {
  background-color: #e50916;
  border-radius: 5px;
}

.add-availability-time-wpp span {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  margin-bottom: 0;
}

.add-availability-time-wpp label {
  border: none;
  outline: none;
  width: 30%;
  height: 45px;
  margin: 0;
  border-radius: 0px 30px 30px 0px;
  position: relative;
  display: flex;
  border-radius: 4px;
}

.add-availability-time-wpp select {
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  border-radius: 4px;
  padding-left: 25px;
  position: relative;
  padding-right: 25px;
  cursor: pointer;
  color: var(--white, #fff);
  font-size: 14px;
  appearance: none;
  background: url(../images/category-imgs/down-arrow.svg);
  background-position: right 10px center;
  background-repeat: no-repeat;
}

.add-availability-time-wpp select option {
  background: var(--text-color, #58585a);
  color: #fff;
}

.action-availbaility-btns {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 10%;
}

.tag-availabilty {
  display: flex;
  justify-content: space-between;
  padding: 17px 0px;
  margin-top: 50px;
  gap: 30px;
}

.tag-availabilty span {
  color: var(--white, #fff);
  font-family: Poppins;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  margin-bottom: 0;
  border: 1px solid #fff;
  display: flex;
  padding: 10px 15px;
  border-radius: 30px;
  width: 50%;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.action-availability-btns {
  position: relative;
  display: flex;
  align-items: center;

  a.add-slot {
    position: absolute;
    right: -30px;
    width: 23px;
    height: auto;

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

.add-availability-time-wpp label input[type="time"] {
  color: #fff;
  width: 100%;
  border: none;
  outline: none;
  border-radius: 8px;
  padding: 0px 5px 0px 10px;
  background-color: #58585a;
  background-image: url(../images/category-imgs/down-arrow.svg);
  background-position: right 5px center;
  background-repeat: no-repeat;
}

.add-availability-time-wpp label input[type="time"]::-webkit-calendar-picker-indicator {
  filter: invert(100%) brightness(100%);
  opacity: 0;
  cursor: pointer;
}

/* / SELECT AVAILABLITY PAGE CSS / */

/* tradesman profile detail */

/* NEW-CSS-DK */

#technician-slider .service-img {
  height: 320px;
}

#technician-slider .service-content {
  height: 66px;
}

#technician-slider .owl-nav {
  width: 100%;
  height: auto;
  padding-left: 20px;
  transition: 0.5s;
}

#technician-slider .owl-nav button {
  width: 30px;
  height: 30px;
  box-shadow: none;
  position: absolute;
  top: 41%;
  left: -20px;
  right: inherit;
  z-index: 0;
  opacity: 0.8;
  background: var(--silver-1,
      linear-gradient(90deg,
        #adadad 10.42%,
        #ebebeb 40.63%,
        #eee 63.54%,
        #b5b5b5 86.46%));
  outline: none;
  border-radius: 50%;
}

#technician-slider .owl-nav button i {
  font-size: 14px;
  text-align: center;
  display: flex;
  font-weight: 500;
  justify-content: center;
  height: 100%;
  color: #000;
  place-items: flex-end;
  align-items: center;
}

#technician-slider .owl-nav button:last-child {
  right: -20px;
  left: inherit;
}

.select-location input#address {
  background-color: #fff;
  border-radius: 20px 0px 0px 20px;
  border: none;
  outline: none;
  padding: 5px 10px;
  height: 35px;
  font-size: 14px;
  color: #000;
}

.select-location button {
  height: 35px;
  background: var(--App-Red, #ce2127);
  border-radius: 0px 20px 20px 0px;
  border: none;
  outline: none;
  padding: 0px 15px;
  color: #fff;
  font-size: 14px;
}

/* NEW-CSS-DK */
/* DK-CSS */

.about-main-wrap .row.mb-5 {
  align-items: center;
}

.new-about-image {
  width: 100%;

  img {
    width: 100%;
  }
}

/* DK-CSS */


/* SS060825 Begin */

#view-estimate {
  padding: 20px;
  display: none !important;
}

.view-estimate-main-wrap {
  padding: 14px 0;
}

.disabled-link {
  background: none !important;
  border: none;
  padding: 0 !important;
  color: #ff0000;
  cursor: not-allowed;
  text-decoration: none;
  font-weight: 600;
}

/* End of SS060825 */


/* DAMAN-04-26 */

.terms-main-wrap h1,
.terms-main-wrap h2,
.terms-main-wrap h3,
.terms-main-wrap h4,
.terms-main-wrap h5,
.terms-main-wrap h6 {
  color: var(--App-Red, #ce2127);
  font-family: Poppins;
  font-size: 20px;
  font-weight: 400;
}

.icons-warp a .box img {
  width: 90px;
  height: 90px;
  border-radius: 50%;
  object-fit: cover;
  box-shadow: 0px 1px 8px 0px #00000040;
  margin-bottom: 10px;
}

.add-components-btn-wrap a {
  display: flex;
  align-items: center;
  justify-content: flex-start;

  &:last-child img {
    margin-left: auto;
  }
}


/* DAMAN-04-26 */


/* DAMAN-05-26 */


.sign-in-wrap {
  padding: 0px 0;
}

.sign-in-wrap .container-fluid {
  height: 100%;
}

.sign-in-wrap .container-fluid .row {
  height: 100%;
  align-items: center;
}

#technician-slider .service-img {
  height: 284px;
}

/* DAMAN-05-26 */

