@import url(https://fonts.googleapis.com/css2?family=Maven+Pro:wght@400;500;600;700;800;900&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Merriweather:wght@700;900&display=swap);
/* REGISTER PAGE */
.register {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr;
}

.bg-theme-blue {
  background-color: #001D3F !important;
}

.user-panel {
  border-bottom: 1px solid rgba(255, 255, 255, 0.062745098);
  border-top: 1px solid rgba(255, 255, 255, 0.062745098);
  padding: 12px 0px 12px 0px;
}

/* Apply styles to the first and last header cells */
table.dataTable thead th:first-child,
table.dataTable thead th:last-child {
  width: 10%;
  text-align: center;
}

/* Apply styles to the first and last data cells */
table.dataTable tbody td:first-child,
table.dataTable tbody td:last-child,
table.dataTable tfoot th:first-child,
table.dataTable tfoot th:last-child {
  width: 10%;
  text-align: center;
}

table.dataTable tbody td {
  vertical-align: middle;
}

.font-secondary {
  font-family: "Merriweather", serif;
}

* {
  font-family: "Maven Pro", sans-serif;
}

@media (min-width: 1024px) {
  .register {
    display: grid;
    width: 100%;
    grid-template-columns: 1fr 1fr;
  }
}
.register-img {
  display: none;
}

.content-layer {
  padding: 40px;
  color: #fff !important;
}

.background-layer {
  background: linear-gradient(180deg, rgba(0, 91, 185, 0.6) 0%, rgba(0, 215, 236, 0.6) 100%);
  mix-blend-mode: multiply;
  top: 0;
  left: 0;
}

@media (min-width: 1024px) {
  .register-img {
    display: block;
    position: sticky;
    top: 0;
    height: 100vh;
    overflow: hidden;
  }
}
.register-img img {
  -o-object-position: center;
     object-position: center;
  -o-object-fit: cover;
     object-fit: cover;
  height: 100%;
}

@media (min-width: 1024px) {
  .register-content {
    width: 100%;
    padding: 50px 100px;
  }
}
.register-content {
  width: 100%;
  padding: 50px 16px;
}

@media (min-width: 768px) {
  .register-content {
    width: 100%;
    padding: 50px 40px;
  }
}
.custom-input-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  /* gap: 1px; */
}
.custom-input-container label:not(.form-check-label):not(.custom-file-label) {
  font-weight: 500 !important;
}

.custom-input-label {
  font-size: 16px;
  color: #001D3F;
  /* Adjust for sm:text-base */
  margin-bottom: 8px !important;
  font-weight: 500;
}

.custom-input-label span {
  color: #f56565;
  /* Tailwind red-500 */
}

.custom-input-field-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.custom-input {
  background-color: #ffffff;
  border: 1px solid rgba(107, 114, 128, 0.3);
  width: 100%;
  padding: 0.75rem;
  outline: none;
  border-radius: 6px;
  color: #66778C;
  font-size: 16px;
  font-weight: 500;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
}

.custom-input.disabled {
  cursor: not-allowed;
  border-color: rgba(75, 85, 99, 0.5);
  /* disabled:border-theme-dark-gray disabled:border-opacity-50 */
  color: rgba(75, 85, 99, 0.5);
  /* disabled:text-theme-dark-gray disabled:text-opacity-50 */
}

.custom-input-caption {
  font-size: 0.75rem;
  color: rgb(0, 91, 185);
  /* text-xs sm:text-sm */
}

.phone-no-input {
  border-radius: 0.5rem;
  -webkit-border-radius: 0.5rem;
  -moz-border-radius: 0.5rem;
  -ms-border-radius: 0.5rem;
  -o-border-radius: 0.5rem;
}

.otp-form input {
  font-size: 16px;
  border-radius: 0.5rem;
  border: 1px solid rgba(0, 92, 185, 0.1294117647);
  background-color: rgba(0, 92, 185, 0.0156862745);
  outline: none;
  width: 60px !important;
  aspect-ratio: 1/1 !important;
  -webkit-border-radius: 0.5rem;
  -moz-border-radius: 0.5rem;
  -ms-border-radius: 0.5rem;
  -o-border-radius: 0.5rem;
}

.react-international-phone-input-container .react-international-phone-input {
  background-color: #ffffff;
  border: 1px solid rgba(107, 114, 128, 0.3);
  width: 100%;
  padding: 0.75rem !important;
  outline: none;
  border-radius: 0px 0.5rem 0.5rem 0px !important;
  font-size: 16px !important;
  height: auto !important;
  -webkit-border-radius: 0px 0.5rem 0.5rem 0px !important;
  -moz-border-radius: 0px 0.5rem 0.5rem 0px !important;
  -ms-border-radius: 0px 0.5rem 0.5rem 0px !important;
  -o-border-radius: 0px 0.5rem 0.5rem 0px !important;
}

.react-international-phone-input-container .react-international-phone-country-selector-button {
  border-radius: 0.5rem 0px 0px 0.5rem !important;
  font-size: 16px !important;
  height: 100% !important;
  padding: 0px 8px !important;
  -webkit-border-radius: 0.5rem 0px 0px 0.5rem !important;
  -moz-border-radius: 0.5rem 0px 0px 0.5rem !important;
  -ms-border-radius: 0.5rem 0px 0px 0.5rem !important;
  -o-border-radius: 0.5rem 0px 0px 0.5rem !important;
}

/* Custom Select */
.theme-custom-select-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.theme-custom-select {
  width: 100%;
  background-color: #ffffff;
  border: 1px solid rgba(107, 114, 128, 0.3);
  border-radius: 0.5rem;
  /*rounded-md*/
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 16px;
  -webkit-border-radius: 0.5rem;
  -moz-border-radius: 0.5rem;
  -ms-border-radius: 0.5rem;
  -o-border-radius: 0.5rem;
}

.theme-custom-select-control {
  width: 100%;
  height: 100%;
  padding: 0.75rem;
  /* p-3 */
  border-radius: 0.375rem;
  /* rounded-md */
}

.theme-custom-select-value-container {
  gap: 0.25rem;
}

.theme-custom-select-multi-value {
  background-color: rgba(59, 130, 246, 0.1);
  /* bg-theme-secondary bg-opacity-10 */
  padding: 0.25rem 0.5rem;
  /* px-2 py-1 */
  border-radius: 0.25rem;
  /* rounded-md */
  color: #001D3F;
  /* text-theme-secondary */
  gap: 0.5rem;
  font-size: 0.875rem;
  /* text-sm */
  text-transform: capitalize;
}

.error-input {
  border: 1px solid rgba(255, 0, 0, 0.671) !important;
}

.error-text {
  color: rgba(255, 0, 0, 0.671);
  margin-top: 4px;
  font-size: 14px;
}

.theme-custom-select-menu {
  border-radius: 0.625rem;
  /* rounded-xl */
  background-color: #ffffff;
  /* bg-theme-white */
  border: 1px solid rgba(107, 114, 128, 0.1);
  /* border-theme-secondary border-opacity-10 */
  padding: 0.375rem;
  /* p-1.5 */
  margin-top: 0.25rem;
  /* mt-1 */
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  /* shadow-xl */
}

.theme-custom-select-option {
  padding: 0.5rem 0.75rem;
  /* px-3 py-2 */
  margin: 0.125rem 0;
  /* my-0.5 */
  border-radius: 0.375rem;
  /* rounded-lg */
}

.theme-custom-select-option-focused {
  background-color: rgb(0, 91, 185);
  /* bg-theme-secondary bg-opacity-5 */
  color: #fff;
  /* text-theme-secondary */
}

.theme-custom-select-option-selected {
  background-color: #001d3f;
  /* bg-theme-secondary bg-opacity-10 */
  color: #fff;
  /* text-theme-secondary */
}

.theme-custom-select-option:hover {
  cursor: pointer;
  background-color: rgb(0, 91, 185);
  /* hover:bg-theme-secondary hover:bg-opacity-5 */
  color: #fff;
  /* hover:text-theme-secondary */
  transition: all 0.2s;
}

.grid-cols-2 {
  width: 100%;
  display: grid;
  gap: 16px;
  grid-template-columns: 1fr;
}

@media (min-width: 767px) {
  .grid-cols-2 {
    width: 100%;
    display: grid;
    gap: 16px;
    grid-template-columns: 1fr 1fr;
  }
}
.btn-v1 {
  background-color: #005BB9;
  color: #fff;
  width: 100%;
  border-radius: 0.5rem;
  padding: 12px 36px 12px 36px;
  outline: none;
  border: none;
}

.btn-v2 {
  background-color: rgba(0, 29, 63, 0.1254901961);
  color: #001d3f;
  width: 100%;
  border-radius: 0.5rem;
  padding: 12px 36px 12px 36px;
  outline: none;
  border: none;
}

.text-theme-primary {
  color: #005BB9;
}

.progress-bar-container {
  width: 100%;
  background-color: #DDE6EF;
  border-radius: 4px;
  position: relative;
}

.progress-bar {
  height: 2px;
  background-color: #005BB9;
  border-radius: 4px;
  transition: width 0.3s ease;
}

.progress-steps {
  display: flex;
  justify-content: space-between;
  position: absolute;
  top: 50%;
  width: 100%;
  transform: translateY(-50%);
  width: 100%;
}

.step {
  width: 30px;
  height: 30px;
  background-color: #DDE6EF;
  border-radius: 50%;
  font-size: 14px;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #005BB9;
}

.step.completed {
  background-color: #005BB9;
  color: #fff;
}

.link {
  color: #005BB9;
  cursor: pointer;
  font-weight: bold;
}

/* ----------- SIDEBAR ------------ */
.sidebar-theme {
  background-color: rgb(0, 29, 63) !important;
}

.sidebar-theme-item {
  width: 100%;
}

.sidebar-theme-link {
  display: flex;
  align-items: center;
  color: rgb(179, 187, 197) !important;
  gap: 10px;
  text-decoration: none;
  padding: 16px;
  border-radius: 8px;
  width: 100%;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  font-weight: 500 !important;
}

.sidebar-theme-link:hover {
  background-color: rgba(255, 255, 255, 0.1) !important;
  color: #fff !important;
}

.active-sidebar-theme-link {
  background-color: rgba(255, 255, 255, 0.1) !important;
  color: #fff !important;
}

.sidebar-theme-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  aspect-ratio: 1/1;
}

.modal-footer > button:first-child {
  background-color: #fff;
  border: 1px solid rgb(0, 91, 185);
  outline: none;
  font-size: 16px;
  border-radius: 12px;
  font-weight: 500;
  cursor: pointer;
  padding: 12px 20px;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  -o-border-radius: 12px;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
@media (min-width: 768px) {
  .modal-footer > button:first-child {
    font-size: 16px;
    padding: 12px 28px;
  }
}
.modal-footer > button:first-child:hover {
  background-color: rgb(0, 91, 185);
  color: #fff;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
.modal-footer > button:last-child {
  background-color: rgb(0, 91, 185);
  border: 1px solid rgb(0, 91, 185);
  font-weight: 500;
  outline: none;
  font-size: 16px;
  border-radius: 12px;
  cursor: pointer;
  padding: 12px 20px;
  color: #fff;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  -o-border-radius: 12px;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
@media (min-width: 768px) {
  .modal-footer > button:last-child {
    font-size: 16px;
    padding: 12px 28px;
  }
}
.modal-footer > button:last-child:hover {
  background-color: #fff;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
.modal-footer > button:last-child:disabled {
  cursor: not-allowed;
  background-color: rgba(75, 85, 99, 0.2);
  border: 1px solid rgba(75, 85, 99, 0.2);
  color: rgb(75, 85, 99);
  pointer-events: none;
}

.header {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 16px;
  color: #fff;
  padding: 10px 0px;
  font-size: 14px;
}
@media (min-width: 1280px) {
  .header {
    flex-direction: row;
    justify-content: flex-start;
    font-size: 16px;
    gap: 14%;
  }
}
.header-left {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: center;
}
@media (min-width: 640px) {
  .header-left {
    justify-content: flex-start;
  }
}
@media (min-width: 768px) {
  .header-left {
    gap: 30px;
  }
}
.header-left_social {
  display: flex;
  align-items: center;
  gap: 20px;
}
.header-left_social__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: #fff !important;
  transition: 0.3s all linear;
  -webkit-transition: 0.3s all linear;
  -moz-transition: 0.3s all linear;
  -ms-transition: 0.3s all linear;
  -o-transition: 0.3s all linear;
}
.header-left_social__icon:hover {
  opacity: 80%;
}
.header-center {
  width: 100%;
}
@media (min-width: 640px) {
  .header-center {
    width: 60%;
  }
}
@media (min-width: 1024px) {
  .header-center {
    width: 40%;
  }
}
@media (min-width: 1280px) {
  .header-center {
    width: 30%;
  }
}
.header-right {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  justify-content: center;
}
@media (min-width: 640px) {
  .header-right {
    justify-content: flex-start;
  }
}
@media (min-width: 768px) {
  .header-right {
    gap: 32px;
  }
}
.header-right_item {
  display: flex;
  align-items: center;
  color: #fff;
  gap: 8px;
}
.header-right_item:hover {
  color: rgba(255, 255, 255, 0.8);
}
.header-right_item > a {
  color: #fff;
}
.header-right_item > a:hover {
  color: rgba(255, 255, 255, 0.8);
}

.menubar-wrapper {
  border-bottom: 1px solid rgba(0, 91, 185, 0.2);
}

.menubar {
  width: 100%;
  display: flex;
  align-items: center;
  position: sticky;
  top: 0;
  gap: 16px;
  padding: 16px 0px;
  justify-content: space-between;
}
@media (min-width: 1024px) {
  .menubar {
    padding: 24px 0px;
  }
}
.menubar-logo img {
  width: 100px;
  -o-object-fit: contain;
     object-fit: contain;
}
@media (min-width: 768px) {
  .menubar-logo img {
    width: auto;
  }
}
.menubar-nav {
  display: none;
  font-weight: 500;
  color: rgb(102, 119, 140);
  font-size: 16px;
}
@media (min-width: 1080px) {
  .menubar-nav {
    display: flex;
    align-items: center;
    gap: 28px;
  }
}
.menubar-nav_link {
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
}
.menubar-nav .dropdown-menu {
  border-radius: 10px !important;
  top: 18px !important;
  border-top: 4px solid rgb(0, 91, 185);
  padding: 18px;
  background-color: #fff;
  -webkit-border-radius: 10px !important;
  -moz-border-radius: 10px !important;
  -ms-border-radius: 10px !important;
  -o-border-radius: 10px !important;
}
@media (min-width: 1280px) {
  .menubar-nav .dropdown-menu {
    padding: 28px;
  }
}
.menubar-nav .dropdown-menu_container {
  width: 100%;
  display: flex;
  align-items: flex-start;
  gap: 18px;
}
@media (min-width: 1280px) {
  .menubar-nav .dropdown-menu_container {
    gap: 28px;
  }
}
.menubar-nav .dropdown-menu .dropdown-item {
  width: 210px;
  height: 140px;
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  position: relative;
  overflow: hidden;
}
@media (min-width: 1280px) {
  .menubar-nav .dropdown-menu .dropdown-item {
    width: 250px;
    height: 180px;
  }
}
.menubar-nav .dropdown-menu .dropdown-item > img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center center;
     object-position: center center;
}
.menubar-nav .dropdown-menu .dropdown-item_content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(267.17deg, rgba(0, 215, 236, 0.5019607843) 0%, rgba(0, 91, 185, 0.5019607843) 100%);
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: end;
  padding: 10px;
  text-wrap: balance;
}
@media (min-width: 1280px) {
  .menubar-nav .dropdown-menu .dropdown-item_content {
    padding: 20px;
  }
}
.menubar-nav .dropdown-menu .dropdown-item_content h6 {
  font-size: 16px;
  font-weight: 700;
}
.menubar-nav .dropdown-menu .dropdown-item_content p {
  font-size: 14px;
  font-weight: 400;
}
.menubar-nav .active {
  color: rgb(0, 91, 185);
  font-weight: 700;
}
.menubar-btns {
  display: flex;
  align-items: center;
  gap: 12px;
}
@media (min-width: 1024px) {
  .menubar-btns {
    gap: 20px;
  }
}
.menubar-btns_btn__pri {
  display: none;
  color: rgb(0, 91, 185);
}
@media (min-width: 768px) {
  .menubar-btns_btn__pri {
    display: block;
    background-color: #fff;
    border: 1px solid rgb(0, 91, 185);
    outline: none;
    font-size: 16px;
    border-radius: 50px;
    font-weight: 500;
    cursor: pointer;
    padding: 12px 20px;
    color: rgb(0, 91, 185);
    transition: all 0.3s ease-in-out;
  }
}
@media (min-width: 768px) and (min-width: 768px) {
  .menubar-btns_btn__pri {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
@media (min-width: 768px) {
  .menubar-btns_btn__pri:hover {
    background-color: rgb(0, 91, 185);
    color: #fff;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
  }
}
.menubar-btns_btn__sec {
  display: none;
  color: #fff;
}
@media (min-width: 768px) {
  .menubar-btns_btn__sec {
    display: block;
    background-color: rgb(0, 91, 185);
    border: 1px solid rgb(0, 91, 185);
    font-weight: 500;
    outline: none;
    font-size: 16px;
    border-radius: 50px;
    cursor: pointer;
    padding: 12px 20px;
    color: #fff;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    -ms-border-radius: 50px;
    -o-border-radius: 50px;
    transition: all 0.3s ease-in-out;
  }
}
@media (min-width: 768px) and (min-width: 768px) {
  .menubar-btns_btn__sec {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
@media (min-width: 768px) {
  .menubar-btns_btn__sec:hover {
    background-color: #fff;
    color: rgb(0, 91, 185);
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
  }
}
.menubar-btns_btn__close {
  justify-content: center;
  display: flex;
  align-items: center;
  color: rgb(0, 91, 185);
  font-size: 30px;
  cursor: pointer;
}
@media (min-width: 1080px) {
  .menubar-btns_btn__close {
    display: none;
  }
}
.menubar-nav > a {
  color: rgb(102, 119, 140);
}

.footer {
  width: 100%;
  color: #fff;
}
.footer-top {
  padding-top: 160px;
  padding-bottom: 30px;
}
.footer-middle {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr;
  gap: 30px;
  padding: 160px 0px 30px 0;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #fff;
  font-size: 16px;
}
.footer-middle a {
  color: #fff !important;
}
.footer-middle a:hover {
  color: rgba(255, 255, 255, 0.8) !important;
}
@media (min-width: 768px) {
  .footer-middle {
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 1024px) {
  .footer-middle {
    grid-template-columns: 1fr 1fr 1fr 2fr;
  }
}
.footer-middle_col {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 5px;
}
.footer-middle_col .social {
  display: flex;
  align-items: center;
  gap: 16px;
}
.footer-middle_col .social__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #fff;
  color: rgb(0, 29, 63) !important;
  padding: 12px;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  transition: 0.3s all linear;
  -webkit-transition: 0.3s all linear;
  -moz-transition: 0.3s all linear;
  -ms-transition: 0.3s all linear;
  -o-transition: 0.3s all linear;
  cursor: pointer;
}
.footer-middle_col .social__icon:hover {
  color: rgb(0, 29, 63) !important;
  opacity: 80%;
}
.footer-middle_col__first {
  padding: 20px 0;
}
.footer-middle_col h6 {
  font-size: 18px;
  font-weight: 700;
}
.footer-middle_col__input {
  display: flex;
  align-items: center;
  width: 100%;
  background-color: #fff;
  padding: 1px;
  border-radius: 4px;
  overflow: hidden;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
}
.footer-middle_col__input input {
  width: 100%;
  padding: 10px;
  border: none;
  outline: none;
}
.footer-middle_col__input button {
  outline: none;
  border: 1px solid rgb(0, 91, 185);
  padding: 10px 30px;
  color: #fff;
  background-color: rgb(0, 91, 185);
  white-space: nowrap;
  font-weight: 500;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  transition: 0.3s linear all;
  -webkit-transition: 0.3s linear all;
  -moz-transition: 0.3s linear all;
  -ms-transition: 0.3s linear all;
  -o-transition: 0.3s linear all;
}
.footer-middle_col__input button:hover {
  background-color: #fff;
  color: rgb(0, 91, 185);
}
.footer-bottom {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
  font-weight: 500;
  width: 100%;
  padding: 16px 0px;
  text-align: center;
  gap: 16px;
}
@media (min-width: 768px) {
  .footer-bottom {
    padding: 30px 0px;
    text-align: left;
    justify-content: space-between;
  }
}
.footer-bottom_left {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
}
.footer-bottom_left > a {
  color: #fff !important;
}
.footer-bottom_left > a:hover {
  color: rgba(255, 255, 255, 0.8) !important;
}
@media (min-width: 768px) {
  .footer-bottom_left {
    gap: 30px;
  }
}

.heroSection-container {
  width: 100%;
  min-height: 676px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 1;
}
@media (min-width: 768px) {
  .heroSection-container {
    height: 100vh;
  }
}
.heroSection-container .hero-bg {
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.heroSection-container::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(0, 91, 185, 0.4) 0%, rgba(0, 215, 236, 0.4) 100%);
}

.heroSection {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  gap: 20px;
  color: #fff;
  z-index: 99;
}
.heroSection-heading {
  font-size: 28px;
  font-weight: 700;
}
@media (min-width: 768px) {
  .heroSection-heading {
    font-size: 36px;
    padding: 0px 90px;
  }
}
@media (min-width: 1024px) {
  .heroSection-heading {
    font-size: 48px;
  }
}
.heroSection-subtitle {
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
}
@media (min-width: 768px) {
  .heroSection-subtitle {
    font-size: 18px;
    line-height: 28px;
    width: 60%;
  }
}
.heroSection-btn {
  background-color: #fff;
  border: 1px solid rgb(0, 91, 185);
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  font-weight: 500;
  cursor: pointer;
  padding: 12px 20px;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
}
@media (min-width: 768px) {
  .heroSection-btn {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.heroSection-btn:hover {
  background-color: rgb(0, 91, 185);
  color: #fff;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}

.textSlider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 40px;
  color: #fff;
  padding-block: 18px;
}
@media (min-width: 1024px) {
  .textSlider {
    padding-block: 30px;
  }
}
.textSlider > p {
  font-size: 18px;
  font-weight: 800;
  text-transform: uppercase;
}
@media (min-width: 768px) {
  .textSlider > p {
    font-size: 20px;
  }
}
@media (min-width: 1024px) {
  .textSlider > p {
    font-size: 24px;
  }
}

.textSlider-sm {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px !important;
  color: #fff;
  width: 100%;
}
@media (min-width: 768px) {
  .textSlider-sm {
    gap: 16px !important;
  }
}
@media (min-width: 1024px) {
  .textSlider-sm {
    gap: 20px !important;
  }
}
.textSlider-sm img {
  width: 28px;
}
.textSlider-sm > p {
  font-size: 14px;
  font-weight: 800;
  white-space: nowrap;
  text-transform: uppercase;
}
@media (min-width: 768px) {
  .textSlider-sm > p {
    font-size: 16px;
  }
}
@media (min-width: 1024px) {
  .textSlider-sm > p {
    font-size: 16px;
  }
}
@media (min-width: 1280px) {
  .textSlider-sm > p {
    font-size: 16px;
  }
}

.scroller {
  max-width: 100%;
  overflow: hidden;
}
.scroller[data-animated=true] .scroller__inner {
  width: -moz-max-content;
  width: max-content;
  flex-wrap: nowrap;
  animation: scroll var(--_animation-duration, 40s) var(--_animation-direction, forwards) linear infinite;
}
.scroller__inner {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}
.scroller__inner_small {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}
.scroller[data-direction=right] {
  --_animation-direction: reverse;
}
.scroller[data-direction=left] {
  --_animation-direction: forwards;
}
.scroller[data-speed=fast] {
  --_animation-duration: 20s;
}
.scroller[data-speed=slow] {
  --_animation-duration: 60s;
}

@keyframes scroll {
  to {
    transform: translate(calc(-50% - 0.5rem));
  }
}
.serviceSection {
  width: 100%;
  color: rgb(0, 29, 63);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  padding-top: 40px;
  padding-bottom: 40px;
}
@media (min-width: 768px) {
  .serviceSection {
    gap: 30px;
    padding-top: 80px;
    padding-bottom: 0px;
  }
}
.serviceSection > h2 {
  font-size: 28px;
  font-weight: 900;
  text-align: center;
}
@media (min-width: 640px) {
  .serviceSection > h2 {
    font-size: 32px;
  }
}
@media (min-width: 768px) {
  .serviceSection > h2 {
    font-size: 38px;
  }
}
@media (min-width: 1024px) {
  .serviceSection > h2 {
    font-size: 40px;
  }
}
.serviceSection-tab {
  width: 100%;
  display: flex;
  overflow-x: scroll;
  white-space: nowrap;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
@media (min-width: 640px) {
  .serviceSection-tab {
    justify-content: center;
  }
}
.serviceSection-tab::-webkit-scrollbar {
  display: none;
}
.serviceSection-tab_item {
  display: flex;
  align-items: center;
  gap: 12px;
  font-weight: 700;
  padding: 16px 16px;
  font-size: 16px;
  border-bottom: 1px solid rgba(0, 91, 185, 0.1);
  cursor: pointer;
  position: relative;
  transition: all 0.2s ease-2in-out;
  -webkit-transition: all 0.2s ease-2in-out;
  -moz-transition: all 0.2s ease-2in-out;
  -ms-transition: all 0.2s ease-2in-out;
  -o-transition: all 0.2s ease-2in-out;
}
.serviceSection-tab_item > .icon {
  font-size: 24px;
  width: 24px;
  -o-object-fit: contain;
     object-fit: contain;
}
@media (min-width: 768px) {
  .serviceSection-tab_item {
    font-size: 18px;
    padding: 16px 50px;
  }
}
.serviceSection-tab_item:hover {
  border-bottom: 1px solid rgb(0, 91, 185);
}
.serviceSection-tab_item:hover::after {
  content: "";
  position: absolute;
  width: 50%;
  height: 100%;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  border-bottom: 5px solid rgb(0, 91, 185);
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
}
.serviceSection-tab_item__active {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 18px;
  font-weight: 700;
  padding: 16px 50px;
  border-bottom: 1px solid rgb(0, 91, 185);
  cursor: pointer;
  position: relative;
  color: rgb(0, 91, 185);
  transition: all 0.2s ease-2in-out;
  -webkit-transition: all 0.2s ease-2in-out;
  -moz-transition: all 0.2s ease-2in-out;
  -ms-transition: all 0.2s ease-2in-out;
  -o-transition: all 0.2s ease-2in-out;
}
.serviceSection-tab_item__active svg {
  fill: rgb(0, 91, 185);
}
.serviceSection-tab_item__active svg path {
  fill: rgb(0, 91, 185);
}
.serviceSection-tab_item__active::after {
  content: "";
  position: absolute;
  width: 50%;
  height: 100%;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  border-bottom: 5px solid rgb(0, 91, 185);
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
}
.serviceSection-services {
  width: 100%;
}
.serviceSection-services .mySwiper {
  min-height: 430px;
}
.serviceSection-services .mySwiper .swiper-pagination {
  position: relative;
  top: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.serviceSection-services .mySwiper .swiper-pagination .swiper-pagination-bullet {
  opacity: 1;
  width: 12px !important;
  height: 12px !important;
  background-color: rgb(0, 91, 185) !important;
}
.serviceSection-services .mySwiper .swiper-pagination .swiper-pagination-bullet-active {
  width: 22px !important;
  height: 22px !important;
  background-color: transparent !important;
  border: 1px solid rgb(0, 91, 185) !important;
  position: relative !important;
}
.serviceSection-services .mySwiper .swiper-pagination .swiper-pagination-bullet-active::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  background-color: rgb(0, 91, 185) !important;
  border-radius: 9999px !important;
  width: 12px !important;
  height: 12px !important;
  -webkit-transform: translate(-50%, -50%) !important;
  -moz-transform: translate(-50%, -50%) !important;
  -ms-transform: translate(-50%, -50%) !important;
  -o-transform: translate(-50%, -50%) !important;
  -webkit-border-radius: 9999px !important;
  -moz-border-radius: 9999px !important;
  -ms-border-radius: 9999px !important;
  -o-border-radius: 9999px !important;
}

.serviceCard {
  width: 100%;
  overflow: hidden;
  border-radius: 12px;
  height: 340px;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  -o-border-radius: 12px;
  position: relative;
}
.serviceCard > img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center center;
     object-position: center center;
}
.serviceCard-wrapper {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(0, 29, 63, 0) 0%, #001D3F 100%);
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  justify-content: flex-end;
  color: #fff;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
.serviceCard-wrapper_label {
  font-size: 14px;
  font-weight: 400;
}
.serviceCard-wrapper h3 {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 0;
}
.serviceCard-wrapper_description {
  opacity: 0;
  display: none;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
.serviceCard-wrapper:hover {
  background: linear-gradient(180deg, rgba(0, 215, 236, 0.9) 0%, rgba(0, 91, 185, 0.9) 100%);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
.serviceCard-wrapper:hover > .serviceCard-wrapper_description {
  opacity: 100;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}

.pricingSection {
  width: 100%;
  color: rgb(0, 29, 63);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 20px 0px;
  gap: 20px;
}
@media (min-width: 768px) {
  .pricingSection {
    gap: 30px;
    padding: 50px 0px;
  }
}
@media (min-width: 1024px) {
  .pricingSection {
    padding: 100px 0px;
  }
}
.pricingSection > h2 {
  font-weight: 900;
  font-size: 28px;
  font-weight: 900;
}
@media (min-width: 640px) {
  .pricingSection > h2 {
    font-size: 32px;
  }
}
@media (min-width: 768px) {
  .pricingSection > h2 {
    font-size: 38px;
  }
}
@media (min-width: 1024px) {
  .pricingSection > h2 {
    font-size: 40px;
  }
}
.pricingSection-tab {
  width: 100%;
  display: flex;
  overflow-x: scroll;
  white-space: nowrap;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
@media (min-width: 640px) {
  .pricingSection-tab {
    justify-content: center;
  }
}
.pricingSection-tab::-webkit-scrollbar {
  display: none;
}
.pricingSection-tab_item {
  display: flex;
  align-items: center;
  gap: 12px;
  font-weight: 700;
  padding: 16px 16px;
  font-size: 16px;
  border-bottom: 1px solid rgba(0, 91, 185, 0.1);
  cursor: pointer;
  position: relative;
  transition: all 0.2s ease-2in-out;
  -webkit-transition: all 0.2s ease-2in-out;
  -moz-transition: all 0.2s ease-2in-out;
  -ms-transition: all 0.2s ease-2in-out;
  -o-transition: all 0.2s ease-2in-out;
}
@media (min-width: 768px) {
  .pricingSection-tab_item {
    font-size: 18px;
    padding: 16px 50px;
  }
}
.pricingSection-tab_item:hover {
  border-bottom: 1px solid rgb(0, 91, 185);
}
.pricingSection-tab_item:hover::after {
  content: "";
  position: absolute;
  width: 50%;
  height: 100%;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  border-bottom: 5px solid rgb(0, 91, 185);
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
}
.pricingSection-tab_item__active {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 18px;
  font-weight: 700;
  padding: 16px 50px;
  border-bottom: 1px solid rgb(0, 91, 185);
  cursor: pointer;
  position: relative;
  color: rgb(0, 91, 185);
  transition: all 0.2s ease-2in-out;
  -webkit-transition: all 0.2s ease-2in-out;
  -moz-transition: all 0.2s ease-2in-out;
  -ms-transition: all 0.2s ease-2in-out;
  -o-transition: all 0.2s ease-2in-out;
}
.pricingSection-tab_item__active svg {
  fill: rgb(0, 91, 185);
}
.pricingSection-tab_item__active svg path {
  fill: rgb(0, 91, 185);
}
.pricingSection-tab_item__active::after {
  content: "";
  position: absolute;
  width: 50%;
  height: 100%;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  border-bottom: 5px solid rgb(0, 91, 185);
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
}
.pricingSection-prices {
  width: 100%;
}
.pricingSection-prices .noExtraHeight {
  height: auto !important;
  min-height: auto !important;
}
@media (min-width: 768px) {
  .pricingSection-prices .noExtraHeight {
    height: auto !important;
    min-height: auto !important;
  }
}
@media (min-width: 1024px) {
  .pricingSection-prices .noExtraHeight {
    height: auto !important;
    min-height: 516px !important;
  }
}
.pricingSection-prices .mySwiper {
  padding-top: 40px;
  min-height: 800px;
}
@media (min-width: 768px) {
  .pricingSection-prices .mySwiper {
    min-height: 900px;
    padding-top: 80px;
  }
}
.pricingSection-prices .mySwiper .swiper-pagination {
  position: relative;
  top: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (min-width: 768px) {
  .pricingSection-prices .mySwiper .swiper-pagination {
    top: 60px;
  }
}
@media (min-width: 1024px) {
  .pricingSection-prices .mySwiper .swiper-pagination {
    top: 80px;
  }
}
.pricingSection-prices .mySwiper .swiper-pagination .swiper-pagination-bullet {
  width: 12px !important;
  height: 12px !important;
  background-color: rgb(0, 91, 185) !important;
  opacity: 1;
}
.pricingSection-prices .mySwiper .swiper-pagination .swiper-pagination-bullet-active {
  width: 22px !important;
  height: 22px !important;
  background-color: transparent !important;
  border: 1px solid rgb(0, 91, 185) !important;
  position: relative !important;
}
.pricingSection-prices .mySwiper .swiper-pagination .swiper-pagination-bullet-active::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  background-color: rgb(0, 91, 185) !important;
  border-radius: 9999px !important;
  width: 12px !important;
  height: 12px !important;
  -webkit-transform: translate(-50%, -50%) !important;
  -moz-transform: translate(-50%, -50%) !important;
  -ms-transform: translate(-50%, -50%) !important;
  -o-transform: translate(-50%, -50%) !important;
  -webkit-border-radius: 9999px !important;
  -moz-border-radius: 9999px !important;
  -ms-border-radius: 9999px !important;
  -o-border-radius: 9999px !important;
}

.pricingCard {
  width: 100%;
  border-radius: 16px;
  position: relative;
  background: linear-gradient(267.17deg, rgba(0, 215, 236, 0.05) 0%, rgba(0, 91, 185, 0.05) 100%);
  border: 1px solid rgba(0, 29, 63, 0.1);
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -ms-border-radius: 16px;
  -o-border-radius: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  padding: 50px 24px 24px 24px;
}
@media (min-width: 768px) {
  .pricingCard {
    padding: 60px 32px 32px 32px;
  }
}
.pricingCard-category {
  position: absolute;
  left: 50%;
  white-space: nowrap;
  transform: translateX(-50%);
  top: -30px;
  background: linear-gradient(267.17deg, #00d7ec 0%, #005bb9 100%);
  color: #fff;
  border-radius: 12px;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  -o-border-radius: 12px;
  font-size: 12px;
  padding: 16px 18px;
}
@media (min-width: 640px) {
  .pricingCard-category {
    padding: 16px 18px;
    font-size: 14px;
  }
}
@media (min-width: 768px) {
  .pricingCard-category {
    padding: 16px 18px;
    font-size: 14px;
  }
}
@media (min-width: 1024px) {
  .pricingCard-category {
    padding: 16px 20px;
    font-size: 14px;
  }
}
@media (min-width: 1280px) {
  .pricingCard-category {
    padding: 16px 24px;
    font-size: 14px;
  }
}
.pricingCard .end-line {
  font-size: 14px;
  font-weight: 500;
  color: rgb(0, 91, 185);
}
.pricingCard-price {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.pricingCard-price h3 {
  color: rgb(0, 29, 63);
  font-weight: 700;
  font-size: 30px;
}
@media (min-width: 768px) {
  .pricingCard-price h3 {
    font-size: 34px;
  }
}
@media (min-width: 1024px) {
  .pricingCard-price h3 {
    font-size: 38px;
  }
}
.pricingCard-price p {
  color: rgb(102, 119, 140);
  font-size: 14px;
  font-weight: 500;
}
@media (min-width: 768px) {
  .pricingCard-price p {
    font-size: 16px;
  }
}
@media (min-width: 1024px) {
  .pricingCard-price p {
    font-size: 18px;
  }
}
.pricingCard-description {
  text-align: center;
  white-space: pre-wrap;
}
.pricingCard-time {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
  padding: 10px;
  font-size: 26px;
  font-weight: 500;
}
.pricingCard-time_icon {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px;
  font-size: 24px;
  border-radius: 4px;
  background: linear-gradient(267.17deg, #00d7ec 0%, #005bb9 100%), linear-gradient(0deg, #ffffff, #ffffff);
  color: #fff;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
}
.pricingCard-divider {
  width: 100%;
  height: 1px;
  background-color: #b3bbc5;
}
.pricingCard > button {
  background-color: rgb(0, 91, 185);
  border: 1px solid rgb(0, 91, 185);
  font-weight: 500;
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  cursor: pointer;
  padding: 12px 20px;
  color: #fff;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  transition: all 0.3s ease-in-out;
  width: 100%;
}
@media (min-width: 768px) {
  .pricingCard > button {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.pricingCard > button:hover {
  background-color: #fff;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
.pricingCard > .link-btn {
  background-color: rgb(0, 91, 185);
  border: 1px solid rgb(0, 91, 185);
  font-weight: 500;
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  cursor: pointer;
  padding: 12px 20px;
  color: #fff;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  transition: all 0.3s ease-in-out;
  text-align: center;
  width: 100%;
}
@media (min-width: 768px) {
  .pricingCard > .link-btn {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.pricingCard > .link-btn:hover {
  background-color: #fff;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}

.pricingCard-active {
  width: 100%;
  white-space: pre-wrap;
  border-radius: 16px;
  position: relative;
  background: rgb(0, 91, 185);
  color: #fff;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -ms-border-radius: 16px;
  -o-border-radius: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  padding: 50px 24px 24px 24px;
}
@media (min-width: 1024px) {
  .pricingCard-active {
    transform: scale(1.14);
    -webkit-transform: scale(1.14);
    -moz-transform: scale(1.14);
    -ms-transform: scale(1.14);
    -o-transform: scale(1.14);
  }
}
@media (min-width: 1024px) {
  .pricingCard-active {
    padding: 80px 32px 32px 32px;
  }
}
.pricingCard-active-category {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: -30px;
  white-space: nowrap;
  background: rgb(0, 29, 63);
  color: #fff;
  padding: 16px 50px;
  border-radius: 12px;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  -o-border-radius: 12px;
  font-size: 12px;
  padding: 16px 18px;
}
@media (min-width: 640px) {
  .pricingCard-active-category {
    padding: 16px 18px;
    font-size: 14px;
  }
}
@media (min-width: 768px) {
  .pricingCard-active-category {
    padding: 16px 18px;
    font-size: 14px;
  }
}
@media (min-width: 1024px) {
  .pricingCard-active-category {
    padding: 16px 20px;
    font-size: 14px;
  }
}
@media (min-width: 1280px) {
  .pricingCard-active-category {
    padding: 16px 30px;
    font-size: 14px;
  }
}
.pricingCard-active-price {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.pricingCard-active-price h3 {
  color: #fff;
  font-weight: 700;
  font-size: 40px;
}
@media (min-width: 1024px) {
  .pricingCard-active-price h3 {
    font-size: 48px;
  }
}
.pricingCard-active-price p {
  color: #fff;
  font-size: 14px;
  font-weight: 500;
}
@media (min-width: 1024px) {
  .pricingCard-active-price p {
    font-size: 18px;
  }
}
.pricingCard-active-description {
  text-align: center;
}
.pricingCard-active-time {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
  padding: 10px;
  font-size: 26px;
  font-weight: 500;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
  background-color: rgba(255, 255, 255, 0.2);
}
.pricingCard-active-time_icon {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px;
  font-size: 24px;
  border-radius: 4px;
  background: #fff;
  color: rgb(0, 91, 185);
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
}
.pricingCard-active-divider {
  width: 100%;
  height: 1px;
  background-color: #fff;
}
.pricingCard-active > button {
  background-color: #fff;
  border: 1px solid rgb(0, 91, 185);
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  font-weight: 500;
  cursor: pointer;
  padding: 12px 20px;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  width: 100%;
}
@media (min-width: 768px) {
  .pricingCard-active > button {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.pricingCard-active > button:hover {
  background-color: rgb(0, 91, 185);
  color: #fff;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
.pricingCard-active > .link-btn {
  background-color: #fff;
  border: 1px solid rgb(0, 91, 185);
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  font-weight: 500;
  cursor: pointer;
  padding: 12px 20px;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  text-align: center;
  width: 100%;
}
@media (min-width: 768px) {
  .pricingCard-active > .link-btn {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.pricingCard-active > .link-btn:hover {
  background-color: rgb(0, 91, 185);
  color: #fff;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
.pricingCard-active > .link-btn:hover {
  border: 1px solid #fff !important;
}

.whyChooseUsSection {
  gap: 20px;
  width: 100%;
  padding-bottom: 40px;
}
@media (min-width: 768px) {
  .whyChooseUsSection {
    gap: 50px;
    padding-bottom: 80px;
  }
}
.whyChooseUsSection-top {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr;
  margin-top: 16px;
  gap: 8px;
}
@media (min-width: 768px) {
  .whyChooseUsSection-top {
    margin-top: 0px;
    grid-template-columns: 1fr 1fr;
  }
}
.whyChooseUsSection-top_left {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.whyChooseUsSection-top_left h2 {
  font-size: 28px;
  font-weight: 900;
}
@media (min-width: 640px) {
  .whyChooseUsSection-top_left h2 {
    font-size: 32px;
  }
}
@media (min-width: 768px) {
  .whyChooseUsSection-top_left h2 {
    font-size: 38px;
  }
}
@media (min-width: 1024px) {
  .whyChooseUsSection-top_left h2 {
    font-size: 40px;
  }
}
.whyChooseUsSection-top_left p {
  font-size: 20px;
  font-weight: 400;
}
.whyChooseUsSection-top_right {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr;
  gap: 16px;
  margin-top: 16px;
}
@media (min-width: 768px) {
  .whyChooseUsSection-top_right {
    grid-template-columns: 1fr 1fr;
    margin-top: 0px;
    gap: 30px;
  }
}
.whyChooseUsSection-top_right__list {
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.whyChooseUsSection-bottom {
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
  position: relative;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
}
.whyChooseUsSection-bottom::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: linear-gradient(180deg, rgba(0, 91, 185, 0.4) 0%, rgba(0, 215, 236, 0.4) 100%);
}
.whyChooseUsSection-bottom .section-img {
  width: 100%;
  border-radius: 8px;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center center;
     object-position: center center;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
}
.whyChooseUsSection-bottom .logo {
  position: absolute;
  right: 0;
  bottom: -20px;
  opacity: 20%;
}
.whyChooseUsSection .link-btn {
  align-self: center;
  text-align: center;
  background-color: rgb(0, 91, 185);
  border: 1px solid rgb(0, 91, 185);
  font-weight: 500;
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  cursor: pointer;
  padding: 12px 20px;
  color: #fff;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  transition: all 0.3s ease-in-out;
}
@media (min-width: 768px) {
  .whyChooseUsSection .link-btn {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.whyChooseUsSection .link-btn:hover {
  background-color: #fff;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}

.space-top {
  padding-top: 40px;
}
@media (min-width: 768px) {
  .space-top {
    padding-top: 50px;
  }
}
@media (min-width: 1024px) {
  .space-top {
    padding-top: 60px;
  }
}

.whyChooseContent {
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-items: flex-start;
}
.whyChooseContent-item {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
}
.whyChooseContent-item > h3 {
  font-weight: 700;
  font-size: 24px;
}
@media (min-width: 768px) {
  .whyChooseContent-item > h3 {
    font-size: 24px;
  }
}
@media (min-width: 1024px) {
  .whyChooseContent-item > h3 {
    font-size: 30px;
  }
}

.testimonialSection-wrapper {
  width: 100%;
  background-color: rgba(0, 91, 185, 0.05);
  border-radius: 20px;
  overflow: hidden;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  -o-border-radius: 20px;
  display: grid;
  position: relative;
  grid-template-columns: 1fr;
  gap: 30px;
  z-index: 1;
  padding: 60px 20px;
}
@media (min-width: 768px) {
  .testimonialSection-wrapper {
    padding: 80px 35px;
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 1024px) {
  .testimonialSection-wrapper {
    padding: 100px 45px;
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 1280px) {
  .testimonialSection-wrapper {
    padding: 100px 55px;
    grid-template-columns: 1fr 1fr 1fr;
  }
}
.testimonialSection-wrapper_slider {
  grid-column: span 2;
  width: 100%;
}
.testimonialSection-wrapper_slider > .mySwiper {
  height: 100% !important;
}
.testimonialSection-right {
  height: 100%;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  flex-direction: column-reverse;
}
@media (min-width: 1024px) {
  .testimonialSection-right {
    flex-direction: column;
  }
}
.testimonialSection-right h2 {
  font-size: 28px;
  font-weight: 900;
}
@media (min-width: 640px) {
  .testimonialSection-right h2 {
    font-size: 32px;
  }
}
@media (min-width: 768px) {
  .testimonialSection-right h2 {
    font-size: 38px;
  }
}
@media (min-width: 1024px) {
  .testimonialSection-right h2 {
    font-size: 40px;
  }
}
.testimonialSection-right h2 > br {
  display: none;
}
@media (min-width: 1024px) {
  .testimonialSection-right h2 > br {
    display: block;
  }
}
.testimonialSection-right .slider-controls {
  display: flex;
  align-items: center;
  gap: 10px;
}
.testimonialSection-right .slider-controls_previous {
  color: #fff;
  background-color: rgb(0, 91, 185);
  border-radius: 6px;
  border: 1px solid rgb(0, 91, 185);
  display: flex;
  align-items: center;
  justify-content: center;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
  font-size: 14px;
  padding: 12px;
}
@media (min-width: 1024px) {
  .testimonialSection-right .slider-controls_previous {
    padding: 13px;
    font-size: 14px;
  }
}
.testimonialSection-right .slider-controls_previous:hover {
  background-color: #fff;
  color: rgb(0, 91, 185);
}
.testimonialSection-right .slider-controls_next {
  color: rgb(0, 91, 185);
  background-color: #fff;
  border-radius: 6px;
  border: 1px solid rgb(0, 91, 185);
  display: flex;
  align-items: center;
  justify-content: center;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
  font-size: 14px;
  padding: 12px;
}
@media (min-width: 1024px) {
  .testimonialSection-right .slider-controls_next {
    padding: 13px;
    font-size: 14px;
  }
}
.testimonialSection-right .slider-controls_next:hover {
  background-color: rgb(0, 91, 185);
  color: #fff;
}
.testimonialSection .bg-vector {
  position: absolute;
  top: 0;
  right: 0;
  z-index: -1;
}

.testimonialCard {
  width: 100%;
  padding: 30px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  align-items: flex-start;
  background-color: #fff;
  border-radius: 20px;
  justify-content: space-between;
  height: 100%;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  -o-border-radius: 20px;
}
.testimonialCard-top {
  display: flex;
  flex-direction: column;
  gap: 18px;
  align-items: flex-start;
  width: 100%;
}
.testimonialCard-bottom {
  display: flex;
  width: 100%;
  flex-direction: column;
  gap: 18px;
  align-items: flex-start;
}
.testimonialCard-reviews {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 20px;
}
.testimonialCard-heading {
  color: rgb(0, 29, 63);
  font-weight: 700;
  font-size: 18px;
}
.testimonialCard .divider {
  width: 100%;
}
.testimonialCard-profile {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px;
  border-radius: 6px;
  background: linear-gradient(267.17deg, rgba(0, 215, 236, 0.05) 0%, rgba(0, 91, 185, 0.05) 100%);
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
}
.testimonialCard-profile img {
  width: 60px;
  height: 60px;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center center;
     object-position: center center;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
}
.testimonialCard-profile_name {
  display: flex;
  flex-direction: column;
}
.testimonialCard-profile_name h3 {
  font-weight: 900;
  margin-bottom: 0;
  font-size: 16px;
}
@media (min-width: 768px) {
  .testimonialCard-profile_name h3 {
    font-size: 18px;
  }
}
.testimonialCard-profile_name p {
  font-size: 12px;
  font-weight: 500;
}
@media (min-width: 768px) {
  .testimonialCard-profile_name p {
    font-size: 14px;
  }
}

.faqSection {
  width: 100%;
  color: rgb(0, 29, 63);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  padding: 50px 0px;
}
@media (min-width: 768px) {
  .faqSection {
    gap: 60px;
    padding: 100px 0px;
  }
}
.faqSection > h2 {
  font-size: 28px;
  font-weight: 900;
  text-align: center;
}
@media (min-width: 640px) {
  .faqSection > h2 {
    font-size: 32px;
  }
}
@media (min-width: 768px) {
  .faqSection > h2 {
    font-size: 38px;
  }
}
@media (min-width: 1024px) {
  .faqSection > h2 {
    font-size: 40px;
  }
}
.faqSection-accordian {
  align-items: start;
  display: grid;
  grid-gap: 10px;
  margin: 30px;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  grid-template-rows: repeat(var(--grid-rows, 5), auto);
  grid-auto-flow: row;
}
@media (min-width: 768px) {
  .faqSection-accordian {
    grid-template-columns: 1fr 1fr;
    gap: 30px;
    grid-auto-flow: initial;
  }
}

.accordian-client {
  width: 100%;
  border-radius: 8px !important;
  position: relative !important;
  overflow: hidden !important;
  text-align: left !important;
  background: linear-gradient(79.7deg, #005BB9 0%, #00D7EC 100%);
  -webkit-border-radius: 8px !important;
  -moz-border-radius: 8px !important;
  -ms-border-radius: 8px !important;
  -o-border-radius: 8px !important;
  z-index: 1;
}
.accordian-client_header {
  width: 100%;
}
.accordian-client_header button {
  width: 100%;
  border: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  text-align: left !important;
  padding: 22px;
  color: rgb(0, 91, 185);
  font-weight: 700;
  font-size: 18px;
  background: linear-gradient(267.17deg, rgba(0, 215, 236, 0.05) 0%, rgba(0, 91, 185, 0.05) 100%);
  color: rgb(0, 29, 63);
}
.accordian-client_header button .accordian-client_icon {
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  color: rgb(0, 91, 185);
}
.accordian-client_header button.collapsed .accordian-client_icon {
  color: rgb(0, 29, 63);
  transform: rotate(0deg);
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
}
.accordian-client::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border-top: 2px solid transparent;
  border-right: 2px solid transparent;
  border-bottom: 2px solid transparent;
  border-left: 10px solid transparent;
  /*Adjustedasapseudo-border*/
  background: linear-gradient(0deg, #FFFFFF, #FFFFFF), linear-gradient(267.17deg, rgba(0, 215, 236, 0.05) 0%, rgba(0, 91, 185, 0.05) 100%);
  background-clip: padding-box;
  z-index: -1;
  border-radius: 8px !important;
  -webkit-border-radius: 8px !important;
  -moz-border-radius: 8px !important;
  -ms-border-radius: 8px !important;
  -o-border-radius: 8px !important;
}
.accordian-client_icon {
  font-size: 20px;
}
.accordian-client_body {
  background: linear-gradient(267.17deg, rgba(0, 215, 236, 0.05) 0%, rgba(0, 91, 185, 0.05) 100%);
}
.accordian-client_body > .desc {
  color: rgb(0, 29, 63);
  font-weight: 400;
  font-size: 16px;
  padding: 0px 20px 20px 20px;
}

.ctaBanner-wrapper {
  width: 100%;
  background: linear-gradient(267.17deg, #00D7EC 0%, #005BB9 100%);
  padding: 40px;
  gap: 14px;
  display: flex;
  align-items: center;
  margin-bottom: -100px;
  justify-content: space-between;
  flex-wrap: wrap;
  color: #fff;
  border-radius: 20px;
  overflow: hidden;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  -o-border-radius: 20px;
  z-index: 1;
  position: relative;
}
@media (min-width: 768px) {
  .ctaBanner-wrapper {
    padding: 60px;
  }
}
@media (min-width: 1024px) {
  .ctaBanner-wrapper {
    padding: 80px;
    gap: 20px;
  }
}
.ctaBanner-wrapper_content {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ctaBanner-wrapper_content h2 {
  font-size: 24px;
  font-weight: 700;
}
@media (min-width: 640px) {
  .ctaBanner-wrapper_content h2 {
    font-size: 28px;
  }
}
@media (min-width: 768px) {
  .ctaBanner-wrapper_content h2 {
    font-size: 30px;
  }
}
@media (min-width: 1024px) {
  .ctaBanner-wrapper_content h2 {
    font-size: 32px;
  }
}
.ctaBanner-wrapper > .link-btn {
  background-color: rgb(0, 91, 185);
  border: 1px solid rgb(0, 91, 185);
  font-weight: 500;
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  cursor: pointer;
  padding: 12px 20px;
  color: #fff;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  transition: all 0.3s ease-in-out;
}
@media (min-width: 768px) {
  .ctaBanner-wrapper > .link-btn {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.ctaBanner-wrapper > .link-btn:hover {
  background-color: #fff;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
.ctaBanner-wrapper .cta-vector {
  position: absolute;
  z-index: -1;
  opacity: 20%;
  bottom: 0;
  right: 0;
  -o-object-fit: cover;
     object-fit: cover;
}
@media (min-width: 1024px) {
  .ctaBanner-wrapper .cta-vector {
    opacity: 50%;
  }
}

.subHeroSection-container {
  width: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: left;
  min-height: 280px;
  height: 100%;
  display: flex;
  align-items: start;
  flex-direction: column;
  color: #fff;
  justify-content: center;
  position: relative;
}
@media (min-width: 768px) {
  .subHeroSection-container {
    min-height: 326px;
    background-position: center;
  }
}
.subHeroSection-container_overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: linear-gradient(180deg, rgba(0, 91, 185, 0.4) 0%, rgba(0, 215, 236, 0.4) 100%);
  mix-blend-mode: difference;
}

.subHeroSection {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 10px;
  z-index: 999;
}
.subHeroSection h1 {
  font-size: 28px;
  font-weight: 900;
}
@media (min-width: 640px) {
  .subHeroSection h1 {
    font-size: 32px;
  }
}
@media (min-width: 768px) {
  .subHeroSection h1 {
    font-size: 38px;
  }
}
@media (min-width: 1024px) {
  .subHeroSection h1 {
    font-size: 40px;
  }
}
.subHeroSection p {
  font-size: 18px;
  font-weight: 500;
}
@media (min-width: 768px) {
  .subHeroSection .half-size {
    width: 50% !important;
  }
}

.pageHeadingSection {
  width: 100%;
  gap: 30px;
  padding-top: 20px;
  padding-bottom: 20px;
}
@media (min-width: 768px) {
  .pageHeadingSection {
    padding-top: 50px;
    padding-bottom: 50px;
  }
}
@media (min-width: 1024px) {
  .pageHeadingSection {
    gap: 60px;
    padding-top: 60px;
    padding-bottom: 60px;
  }
}
.pageHeadingSection-top {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr;
  margin-top: 16px;
  gap: 20px;
}
@media (min-width: 768px) {
  .pageHeadingSection-top {
    margin-top: 0px;
    grid-template-columns: 1fr 1fr;
  }
}
.pageHeadingSection-top_left {
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 20px;
}
.pageHeadingSection-top_left h2 {
  color: rgb(0, 29, 63);
  font-size: 28px;
  font-weight: 900;
}
@media (min-width: 640px) {
  .pageHeadingSection-top_left h2 {
    font-size: 32px;
  }
}
@media (min-width: 768px) {
  .pageHeadingSection-top_left h2 {
    font-size: 38px;
  }
}
@media (min-width: 1024px) {
  .pageHeadingSection-top_left h2 {
    font-size: 40px;
  }
}
@media (min-width: 1024px) {
  .pageHeadingSection-top_left h2 {
    line-height: 50px;
  }
}
.pageHeadingSection-top_left .link-btn {
  background-color: rgb(0, 91, 185);
  border: 1px solid rgb(0, 91, 185);
  font-weight: 500;
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  cursor: pointer;
  padding: 12px 20px;
  color: #fff;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  transition: all 0.3s ease-in-out;
}
@media (min-width: 768px) {
  .pageHeadingSection-top_left .link-btn {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.pageHeadingSection-top_left .link-btn:hover {
  background-color: #fff;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
.pageHeadingSection-top_right {
  width: 100%;
  gap: 16px;
}
.pageHeadingSection-top_right > p {
  font-size: 16px;
}
@media (min-width: 768px) {
  .pageHeadingSection-top_right > p {
    font-size: 18px;
    line-height: 30px;
  }
}
@media (min-width: 768px) {
  .pageHeadingSection-top_right {
    gap: 30px;
  }
}
.pageHeadingSection-top_right__list {
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.pageHeadingSection-bottom {
  width: 100%;
  border-radius: 20px;
  overflow: hidden;
  position: relative;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  -o-border-radius: 20px;
}
.pageHeadingSection-bottom::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: linear-gradient(180deg, rgba(0, 91, 185, 0.4) 0%, rgba(0, 215, 236, 0.4) 100%);
}
.pageHeadingSection-bottom .section-img {
  width: 100%;
  border-radius: 8px;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center center;
     object-position: center center;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
}
.pageHeadingSection-bottom .logo {
  position: absolute;
  right: 0;
  bottom: -20px;
  opacity: 20%;
}
.pageHeadingSection button {
  background-color: rgb(0, 91, 185);
  border: 1px solid rgb(0, 91, 185);
  font-weight: 500;
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  cursor: pointer;
  padding: 12px 20px;
  color: #fff;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  transition: all 0.3s ease-in-out;
}
@media (min-width: 768px) {
  .pageHeadingSection button {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.pageHeadingSection button:hover {
  background-color: #fff;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}

.termContent {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 30px;
  padding: 40px 0px;
}
.termContent h1, .termContent h2, .termContent h3, .termContent h4, .termContent h5, .termContent h6 {
  color: rgb(0, 29, 63);
}
.termContent p, .termContent ul li {
  color: rgb(102, 119, 140);
  margin-top: 12px;
}
@media (min-width: 640px) {
  .termContent {
    gap: 40px;
  }
}
@media (min-width: 768px) {
  .termContent {
    gap: 50px;
  }
}
@media (min-width: 1024px) {
  .termContent {
    gap: 60px;
  }
}
@media (min-width: 1024px) {
  .termContent {
    padding: 80px 0px;
  }
}
.termContent-heading {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 16px;
}
.termContent-heading > h2 {
  color: rgb(0, 29, 63);
  font-size: 28px;
  font-weight: 900;
}
@media (min-width: 640px) {
  .termContent-heading > h2 {
    font-size: 32px;
  }
}
@media (min-width: 768px) {
  .termContent-heading > h2 {
    font-size: 38px;
  }
}
@media (min-width: 1024px) {
  .termContent-heading > h2 {
    font-size: 40px;
  }
}
.termContent-content {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 50px;
}
@media (min-width: 640px) {
  .termContent-content {
    gap: 54px;
  }
}
@media (min-width: 768px) {
  .termContent-content {
    gap: 56px;
  }
}
@media (min-width: 1024px) {
  .termContent-content {
    gap: 60px;
  }
}
.termContent-content_items {
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 28px;
}
@media (min-width: 640px) {
  .termContent-content_items {
    gap: 32px;
  }
}
@media (min-width: 768px) {
  .termContent-content_items {
    gap: 36px;
  }
}
@media (min-width: 1024px) {
  .termContent-content_items {
    gap: 40px;
  }
}
.termContent-content_items__sub {
  margin-left: 30px;
  gap: 20px;
  display: flex;
  flex-direction: column;
  align-items: start;
}
@media (min-width: 640px) {
  .termContent-content_items__sub {
    margin-left: 40px;
    gap: 24px;
  }
}
@media (min-width: 768px) {
  .termContent-content_items__sub {
    margin-left: 50px;
    gap: 28px;
  }
}
@media (min-width: 1024px) {
  .termContent-content_items__sub {
    margin-left: 60px;
    gap: 32px;
  }
}

.listItemContent {
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 16px;
}
.listItemContent > h2 {
  font-size: 20px;
  font-weight: 700;
  display: flex;
  align-items: flex-start;
  gap: 4px;
  margin-bottom: 0 !important;
}
@media (min-width: 768px) {
  .listItemContent > h2 {
    font-size: 24px;
    gap: 4px;
  }
}
.listItemContent > p {
  font-size: 16px;
}

.contactSection {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr;
  align-items: start;
  margin-top: 0 !important;
  gap: 40px;
  padding: 40px 0px;
}
@media (min-width: 768px) {
  .contactSection {
    padding: 80px 0px;
    gap: 40px;
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 1310px) {
  .contactSection {
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: end;
    margin-top: -316px !important;
  }
}
.contactSection-contact {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 48px;
}
.contactSection-contact h3 {
  font-size: 24px;
  font-weight: 700;
}
@media (min-width: 640px) {
  .contactSection-contact h3 {
    font-size: 28px;
  }
}
@media (min-width: 768px) {
  .contactSection-contact h3 {
    font-size: 30px;
  }
}
@media (min-width: 1024px) {
  .contactSection-contact h3 {
    font-size: 32px;
  }
}
.contactSection-contact_list {
  display: flex;
  flex-direction: column;
  gap: 28px;
}
.contactSection-contact_list__item {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}
.contactSection-contact_list__item .contact-icon {
  font-size: 22px;
  color: #fff;
  padding: 18px;
  border-radius: 50%;
  aspect-ratio: 1/1;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  background: linear-gradient(267.17deg, #00D7EC 0%, #005BB9 100%);
  display: flex;
  align-content: center;
  justify-content: center;
}
.contactSection-contact_list__item .contact-details {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 4px;
}
.contactSection-contact_list__item .contact-details h4 {
  margin-bottom: 0px !important;
  font-size: 18px;
  font-weight: 700;
}
.contactSection-contact_list__item .contact-details p {
  font-size: 16px;
}

.google-embed-container iframe {
  width: 100%;
  height: 500px !important;
  border: none !important;
  border-radius: 12px !important;
  -webkit-border-radius: 12px !important;
  -moz-border-radius: 12px !important;
  -ms-border-radius: 12px !important;
  -o-border-radius: 12px !important;
}

.contactForm {
  width: 100%;
  padding: 24px;
  z-index: 99;
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 24px;
  background: linear-gradient(267.17deg, rgba(0, 215, 236, 0.05) 0%, rgba(0, 91, 185, 0.05) 100%), linear-gradient(0deg, #FFFFFF, #FFFFFF);
  border-radius: 20px;
}
@media (min-width: 768px) {
  .contactForm {
    padding: 40px;
  }
}
@media (min-width: 1024px) {
  .contactForm {
    padding: 48px;
  }
}
.contactForm > h2 {
  font-size: 24px;
  font-weight: 700;
  color: rgb(0, 29, 63);
}
@media (min-width: 640px) {
  .contactForm > h2 {
    font-size: 28px;
  }
}
@media (min-width: 768px) {
  .contactForm > h2 {
    font-size: 30px;
  }
}
@media (min-width: 1024px) {
  .contactForm > h2 {
    font-size: 32px;
  }
}
.contactForm > p {
  color: rgb(102, 119, 140);
}
.contactForm-form {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 16px;
}
.contactForm-form_input {
  background-color: #fff;
  border: 1px solid rgba(0, 91, 185, 0.2);
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
  outline: none;
  padding: 16px;
  width: 100%;
}
.contactForm-form > button {
  margin-top: 24px;
  background-color: rgb(0, 91, 185);
  border: 1px solid rgb(0, 91, 185);
  font-weight: 500;
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  cursor: pointer;
  padding: 12px 20px;
  color: #fff;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  transition: all 0.3s ease-in-out;
}
@media (min-width: 768px) {
  .contactForm-form > button {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.contactForm-form > button:hover {
  background-color: #fff;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}

.serviceContactSection {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr;
  padding-top: 50px;
  padding-bottom: 20px;
  gap: 30px;
}
@media (min-width: 768px) {
  .serviceContactSection {
    padding-bottom: 50px;
  }
}
@media (min-width: 1024px) {
  .serviceContactSection {
    padding-bottom: 100px;
  }
}
@media (min-width: 768px) {
  .serviceContactSection {
    grid-template-columns: 1fr 1fr;
  }
}
.serviceContactSection-left {
  display: flex;
  flex-direction: column;
  gap: 28px;
  align-items: center;
}
@media (min-width: 640px) {
  .serviceContactSection-left {
    align-items: flex-start;
  }
}
.serviceContactSection-left h2 {
  font-size: 28px;
  font-weight: 900;
  text-align: center;
}
@media (min-width: 640px) {
  .serviceContactSection-left h2 {
    font-size: 32px;
  }
}
@media (min-width: 768px) {
  .serviceContactSection-left h2 {
    font-size: 38px;
  }
}
@media (min-width: 1024px) {
  .serviceContactSection-left h2 {
    font-size: 40px;
  }
}
@media (min-width: 640px) {
  .serviceContactSection-left h2 {
    text-align: left;
  }
}
.serviceContactSection-left_stats {
  position: relative;
  width: 100%;
}
.serviceContactSection-left_stats .white-circle-space {
  width: 36px;
  height: 36px;
  position: absolute;
  top: 50%;
  left: 50%;
  background-color: #fff;
  border-radius: 9999px;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  -webkit-border-radius: 9999px;
  -moz-border-radius: 9999px;
  -ms-border-radius: 9999px;
  -o-border-radius: 9999px;
  display: none;
}
@media (min-width: 640px) {
  .serviceContactSection-left_stats .white-circle-space {
    display: block;
  }
}
.serviceContactSection-left_stats__grid {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr;
}
@media (min-width: 640px) {
  .serviceContactSection-left_stats__grid {
    grid-template-columns: 1fr 1fr;
  }
}
.serviceContactSection-left_stats__grid .statCard-wrapper {
  width: 100%;
  padding-top: 28px;
  padding-bottom: 28px;
}
@media (min-width: 640px) {
  .serviceContactSection-left_stats__grid .statCard-wrapper:nth-child(-n+2) {
    border-bottom: 1px solid rgba(179, 187, 197, 0.5);
  }
  .serviceContactSection-left_stats__grid .statCard-wrapper:nth-child(2n+1) {
    border-right: 1px solid rgba(179, 187, 197, 0.5);
  }
}

.statCard-wrapper {
  width: 100%;
}

.statCard {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 16px;
  padding: 10px 14px;
}
@media (min-width: 1024px) {
  .statCard {
    gap: 20px;
    padding: 0px 28px;
  }
}
.statCard-icon {
  font-size: 32px;
  color: rgb(0, 29, 63);
  background: linear-gradient(267.17deg, rgba(0, 215, 236, 0.1) 0%, rgba(0, 91, 185, 0.1) 100%);
  border-radius: 8px;
  display: flex;
  padding: 16px;
  align-items: center;
  justify-content: center;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
}
.statCard-icon-img {
  width: 28px;
  height: 28px;
  -o-object-fit: contain;
     object-fit: contain;
}
.statCard-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.statCard-content > h3 {
  font-size: 28px;
  font-weight: 800;
  color: #161616;
}
.statCard-content > p {
  color: #66778C;
  font-size: 16px;
  font-weight: 500;
}

.aboutStats {
  width: 100%;
  padding: 20px 0px;
}
@media (min-width: 768px) {
  .aboutStats {
    padding: 50px 0px;
  }
}
@media (min-width: 1024px) {
  .aboutStats {
    padding: 100px 0px;
  }
}
.aboutStats-top {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.aboutStats-top-hr {
  width: 268px;
  background-color: rgb(102, 119, 140);
  height: 1px;
  opacity: 40%;
}
.aboutStats-top-heading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}
.aboutStats-top-heading h2 {
  font-weight: 900;
  background: -webkit-linear-gradient(267.17deg, #00D7EC 0%, #005BB9 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  font-size: 80px;
  margin-bottom: 0;
  text-align: center;
}
@media (min-width: 768px) {
  .aboutStats-top-heading h2 {
    font-size: 140px;
  }
}
@media (min-width: 1024px) {
  .aboutStats-top-heading h2 {
    font-size: 200px;
    line-height: 220px;
  }
}
.aboutStats-subHeading {
  color: rgb(0, 29, 63);
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 0;
  text-align: center;
  font-size: 20px;
}
@media (min-width: 1024px) {
  .aboutStats-subHeading {
    font-size: 32px;
  }
}
.aboutStats-bottom {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr;
  gap: 48px 0px;
  margin-top: 30px;
}
@media (min-width: 640px) {
  .aboutStats-bottom {
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 768px) {
  .aboutStats-bottom {
    margin-top: 60px;
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 1024px) {
  .aboutStats-bottom {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
.aboutStats-bottom > .statCard-wrapper {
  position: relative; /* Ensure positioning context for pseudo-element */
  width: 100%;
  /* Add border on the right side of each grid item */
}
.aboutStats-bottom > .statCard-wrapper::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 1px;
  background-color: #B3BBC5; /* Choose your border color */
  opacity: 50%; /* Adjust border opacity as needed */
  display: none;
}
@media (min-width: 1024px) {
  .aboutStats-bottom > .statCard-wrapper::after {
    display: block;
  }
}
@media (min-width: 1024px) {
  .aboutStats-bottom > .statCard-wrapper:nth-child(3n)::after {
    display: none !important;
  }
}

.serviceCardLg {
  border-radius: 10px;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  color: rgb(0, 29, 63);
  background: rgba(0, 91, 185, 0.05);
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  gap: 24px;
  padding: 24px;
}
@media (min-width: 768px) {
  .serviceCardLg {
    gap: 32px;
    padding: 32px;
  }
}
.serviceCardLg-header {
  display: flex;
  align-items: center;
  gap: 24px;
}
.serviceCardLg-header_icon {
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  background: linear-gradient(267.17deg, #00D7EC 0%, #005BB9 100%);
  font-size: 24px;
  padding: 18px;
}
.serviceCardLg-header_icon .icon-img {
  width: 32px;
  height: 32px;
  -o-object-fit: contain;
     object-fit: contain;
}
@media (min-width: 768px) {
  .serviceCardLg-header_icon {
    font-size: 32px;
    padding: 20px;
  }
}
.serviceCardLg-header h2 {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 0px !important;
}
@media (min-width: 640px) {
  .serviceCardLg-header h2 {
    font-size: 20px;
  }
}
@media (min-width: 768px) {
  .serviceCardLg-header h2 {
    font-size: 22px;
  }
}
@media (min-width: 1024px) {
  .serviceCardLg-header h2 {
    font-size: 24px;
  }
}
.serviceCardLg-body {
  padding-top: 32px;
  padding-bottom: 32px;
  border-top: 1px solid #B3BBC5;
  border-bottom: 1px solid #B3BBC5;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
}
@media (min-width: 768px) {
  .serviceCardLg-body {
    gap: 24px;
    grid-template-columns: 1fr 1fr;
  }
}
.serviceCardLg-body > .logoListItem {
  width: 100%;
}
.serviceCardLg-body > .logoListItem img {
  width: 24px;
}
.serviceCardLg-body > .logoListItem > p {
  font-size: 14px !important;
  font-weight: 500;
}
@media (min-width: 768px) {
  .serviceCardLg-body > .logoListItem > p {
    font-size: 16px !important;
  }
}
.serviceCardLg-footer {
  width: 100%;
  display: flex;
  justify-content: flex-end;
}
.serviceCardLg-footer > button {
  background-color: rgb(0, 91, 185);
  border: 1px solid rgb(0, 91, 185);
  font-weight: 500;
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  cursor: pointer;
  padding: 12px 20px;
  color: #fff;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  transition: all 0.3s ease-in-out;
}
@media (min-width: 768px) {
  .serviceCardLg-footer > button {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.serviceCardLg-footer > button:hover {
  background-color: #fff;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}

.serviceCardSm {
  border-radius: 16px;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  color: rgb(0, 29, 63);
  background: rgba(0, 91, 185, 0.05);
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -ms-border-radius: 16px;
  -o-border-radius: 16px;
  gap: 24px;
  padding: 24px;
}
@media (min-width: 768px) {
  .serviceCardSm {
    gap: 32px;
    padding: 32px;
  }
}
.serviceCardSm-header {
  display: flex;
  align-items: center;
  gap: 24px;
}
.serviceCardSm-header_icon {
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  background: linear-gradient(267.17deg, #00d7ec 0%, #005bb9 100%);
  font-size: 24px;
  padding: 18px;
}
.serviceCardSm-header_icon .icon-img {
  width: 32px;
  height: 32px;
  -o-object-fit: contain;
     object-fit: contain;
}
@media (min-width: 768px) {
  .serviceCardSm-header_icon {
    font-size: 32px;
    padding: 20px;
  }
}
.serviceCardSm-header h2 {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 0px !important;
}
@media (min-width: 640px) {
  .serviceCardSm-header h2 {
    font-size: 20px;
  }
}
@media (min-width: 768px) {
  .serviceCardSm-header h2 {
    font-size: 22px;
  }
}
@media (min-width: 1024px) {
  .serviceCardSm-header h2 {
    font-size: 24px;
  }
}
.serviceCardSm-body {
  width: 100%;
  display: flex;
  flex-direction: column;
  font-size: 16px;
}
.serviceCardSm-text {
  width: 100%;
  font-size: 16px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.serviceCardSm-footer {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
}
.serviceCardSm-footer > button {
  background-color: rgb(0, 91, 185);
  border: 1px solid rgb(0, 91, 185);
  font-weight: 500;
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  cursor: pointer;
  padding: 12px 20px;
  color: #fff;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  transition: all 0.3s ease-in-out;
}
@media (min-width: 768px) {
  .serviceCardSm-footer > button {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.serviceCardSm-footer > button:hover {
  background-color: #fff;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
.serviceCardSm-footer > button .link {
  color: white;
  font-weight: 500;
}
.serviceCardSm-footer > button:hover .link {
  color: rgb(0, 91, 185);
}

.virtualServicePage-loadmore-btn {
  background-color: rgb(0, 91, 185);
  border: 1px solid rgb(0, 91, 185);
  font-weight: 500;
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  cursor: pointer;
  padding: 12px 20px;
  color: #fff;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  transition: all 0.3s ease-in-out;
}
@media (min-width: 768px) {
  .virtualServicePage-loadmore-btn {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.virtualServicePage-loadmore-btn:hover {
  background-color: #fff;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}

.professionalServiceList {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr;
  gap: 32px;
}
@media (min-width: 768px) {
  .professionalServiceList {
    grid-template-columns: 1fr 1fr;
  }
}

.client-note {
  font-size: 12px;
  color: rgb(0, 91, 185);
  padding: 8px;
  border-radius: 6px;
  border: 1px solid rgb(0, 91, 185);
  font-weight: 500;
  background-color: rgba(0, 91, 185, 0.05);
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
  margin-top: 32px;
}
.client-note-heading {
  font-weight: 700;
}

.client-main {
  position: relative;
}

.preview-img {
  width: 100%;
  padding: 16px;
  background-color: rgba(0, 29, 63, 0.1);
  height: 240px;
  border-radius: 12px;
  overflow: hidden;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  -o-border-radius: 12px;
}
.preview-img img {
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  border-radius: 12px;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  -o-border-radius: 12px;
}

input::file-selector-button {
  background-color: rgb(0, 91, 185);
  border: 1px solid rgb(0, 91, 185);
  font-weight: 500;
  outline: none;
  font-size: 16px;
  border-radius: 12px;
  cursor: pointer;
  padding: 12px 20px;
  color: #fff;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  -o-border-radius: 12px;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  margin-right: 12px;
}
@media (min-width: 768px) {
  input::file-selector-button {
    font-size: 16px;
    padding: 12px 28px;
  }
}
input::file-selector-button:hover {
  background-color: #fff;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}

.client-sidebar {
  position: fixed;
  width: 100%;
  min-height: 100vh;
  overflow-y: scroll;
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  left: 100%;
  top: 0;
  bottom: 0;
  padding: 48px;
  background-color: #fff;
  color: rgb(0, 91, 185);
  z-index: 99999;
  display: block;
  transition: left 0.3s ease;
}
.client-sidebar::-webkit-scrollbar {
  display: none;
}
@media (min-width: 1080px) {
  .client-sidebar {
    display: none;
  }
}
.client-sidebar .close-icon {
  font-size: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 48px;
  right: 48px;
  cursor: pointer;
}
.client-sidebar-nav {
  display: flex;
  width: 100%;
  justify-content: center;
  flex-direction: column;
  align-items: flex-start;
  gap: 28px;
  font-size: 16px;
  font-weight: 500;
}
.client-sidebar-nav_link {
  display: flex;
  cursor: pointer;
  align-items: center;
  gap: 6px;
  color: #66778C;
}
.client-sidebar-nav .client-accordian {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: flex-start;
}
.client-sidebar-nav .client-accordian_item {
  background-color: rgba(0, 29, 63, 0.05);
  color: rgb(0, 29, 63);
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  width: 100%;
}
.client-sidebar-nav .client-accordian_item img {
  width: 80px;
  height: 64px;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center center;
     object-position: center center;
  position: relative;
}
.client-sidebar-nav .client-accordian_item img::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: linear-gradient(267.17deg, #00D7EC 0%, #005BB9 100%);
  opacity: 60%;
}
.client-sidebar-nav .client-accordian_item h5 {
  text-wrap: balance;
  text-align: left;
  font-weight: 700;
  font-size: 14px;
}
.client-sidebar-nav > .active {
  font-weight: 700;
  color: rgb(0, 91, 185);
}
.client-sidebar-btns {
  display: flex;
  gap: 20px;
  align-items: center;
  width: 100%;
  margin-top: 30px;
  white-space: nowrap;
}
.client-sidebar-btns__pri {
  text-align: center;
  background-color: #fff;
  border: 1px solid rgb(0, 91, 185);
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  font-weight: 500;
  cursor: pointer;
  padding: 12px 20px;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  font-size: 18px !important;
  width: 100%;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
}
@media (min-width: 768px) {
  .client-sidebar-btns__pri {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.client-sidebar-btns__pri:hover {
  background-color: rgb(0, 91, 185);
  color: #fff;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
.client-sidebar-btns__sec {
  text-align: center;
  background-color: rgb(0, 91, 185);
  border: 1px solid rgb(0, 91, 185);
  font-weight: 500;
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  cursor: pointer;
  padding: 12px 20px;
  color: #fff;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  transition: all 0.3s ease-in-out;
  font-size: 18px !important;
  width: 100%;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
}
@media (min-width: 768px) {
  .client-sidebar-btns__sec {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.client-sidebar-btns__sec:hover {
  background-color: #fff;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
.client-sidebar-contact {
  display: flex;
  flex-direction: column;
  gap: 32px;
  width: 100%;
  padding: 50px 0px;
  border-top: 2px solid #B3BBC5;
  border-bottom: 2px solid #B3BBC5;
  margin-top: 50px;
}
.client-sidebar-contact_item {
  display: flex;
  align-items: center;
  gap: 16px;
}
.client-sidebar-contact_item .contact-icon {
  background-color: rgb(0, 91, 185);
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  border-radius: 9999px;
  -webkit-border-radius: 9999px;
  -moz-border-radius: 9999px;
  -ms-border-radius: 9999px;
  -o-border-radius: 9999px;
  color: #fff;
}
.client-sidebar-contact_item__content {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
}
.client-sidebar-contact_item__content h5 {
  margin-bottom: 0;
  padding-bottom: 0;
  color: rgb(0, 29, 63);
  font-weight: 600;
  font-size: 16px;
}
.client-sidebar-contact_item__content a {
  font-size: 14px;
  color: rgb(0, 29, 63);
}
.client-sidebar > .header-left {
  margin-top: 50px;
  justify-content: flex-start;
}
.client-sidebar .header-left_social__icon {
  color: rgb(0, 91, 185) !important;
}

.client-sidebar.activeSidebar {
  left: 0;
  /* Move into view */
}

.link-hover :hover {
  cursor: pointer;
}

.custom-modal .modal-body {
  padding: 30px;
}
@media (min-width: 1024px) {
  .custom-modal .modal-body {
    padding: 50px;
  }
}
.custom-modal .modal-content {
  position: relative;
  border-radius: 20px !important;
  -webkit-border-radius: 20px !important;
  -moz-border-radius: 20px !important;
  -ms-border-radius: 20px !important;
  -o-border-radius: 20px !important;
}
.custom-modal .modal-content .payment-check {
  font-size: 24px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: -40px;
  color: #fff;
  padding: 16px;
  border-radius: 999px;
  border: 6px solid #3BCD5B;
  background-color: #3BCD5B;
  display: flex;
  align-items: center;
  justify-content: center;
  -webkit-border-radius: 999px;
  -moz-border-radius: 999px;
  -ms-border-radius: 999px;
  -o-border-radius: 999px;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
}
.custom-modal .border-green {
  border: 6px solid #3BCD5B;
}

.subscription-custom-modal-button {
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 0 10px;
}

.modal-description {
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  color: #66778C;
}

.request-form {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 28px;
  width: 100%;
  background-color: #fff;
}
.request-form h2 {
  font-size: 24px;
  font-weight: 700;
  color: rgb(0, 29, 63);
}
@media (min-width: 640px) {
  .request-form h2 {
    font-size: 28px;
  }
}
@media (min-width: 768px) {
  .request-form h2 {
    font-size: 30px;
  }
}
@media (min-width: 1024px) {
  .request-form h2 {
    font-size: 32px;
  }
}
.request-form_inputs {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr;
  gap: 12px;
  white-space: nowrap;
}
@media (min-width: 1024px) {
  .request-form_inputs {
    gap: 20px;
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 1024px) {
  .request-form_inputs .client-col-12 {
    grid-column: span 2;
  }
}
.request-form_input {
  background-color: #fff;
  border: 1px solid rgba(0, 91, 185, 0.2);
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  outline: none;
  padding: 16px;
  width: 100%;
}
.request-form .theme-custom-select {
  border: 1px solid rgba(0, 91, 185, 0.2) !important;
  border-radius: 4px !important;
}
.request-form .theme-custom-select-control {
  padding: 16px !important;
  border-radius: 4px !important;
  -webkit-border-radius: 4px !important;
  -moz-border-radius: 4px !important;
  -ms-border-radius: 4px !important;
  -o-border-radius: 4px !important;
}
.request-form .react-international-phone-input-container .react-international-phone-input {
  padding: 16px !important;
  border: 1px solid rgba(0, 91, 185, 0.2) !important;
  border-radius: 4px !important;
  -webkit-border-radius: 4px !important;
  -moz-border-radius: 4px !important;
  -ms-border-radius: 4px !important;
  -o-border-radius: 4px !important;
}
.request-form .react-international-phone-input-container .react-international-phone-country-selector-button {
  border-radius: 4px !important;
  -webkit-border-radius: 4px !important;
  -moz-border-radius: 4px !important;
  -ms-border-radius: 4px !important;
  -o-border-radius: 4px !important;
}
.request-form_btns {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}
.request-form_btns__primary {
  background-color: rgb(0, 91, 185);
  border: 1px solid rgb(0, 91, 185);
  font-weight: 500;
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  cursor: pointer;
  padding: 12px 20px;
  color: #fff;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  transition: all 0.3s ease-in-out;
  width: 100%;
}
@media (min-width: 768px) {
  .request-form_btns__primary {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.request-form_btns__primary:hover {
  background-color: #fff;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
@media (min-width: 360px) {
  .request-form_btns__primary {
    width: auto;
  }
}
.request-form_btns__outlined {
  background-color: #fff;
  border: 1px solid rgb(0, 91, 185);
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  font-weight: 500;
  cursor: pointer;
  padding: 12px 20px;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  width: 100%;
}
@media (min-width: 768px) {
  .request-form_btns__outlined {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.request-form_btns__outlined:hover {
  background-color: rgb(0, 91, 185);
  color: #fff;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
@media (min-width: 360px) {
  .request-form_btns__outlined {
    width: auto;
  }
}

.select-document {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 32px;
  background: rgba(0, 91, 185, 0.031372549);
  gap: 6px;
  border: 1px dashed rgba(0, 91, 185, 0.2);
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
}
.select-document-icon {
  padding: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  font-size: 24px;
  aspect-ratio: 1/1;
  color: rgb(0, 29, 63);
  border-radius: 999px;
  -webkit-border-radius: 999px;
  -moz-border-radius: 999px;
  -ms-border-radius: 999px;
  -o-border-radius: 999px;
}

.selectedFile-preview {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 18px;
  width: 100%;
}
.selectedFile-preview_files {
  width: 100%;
  padding-top: 16px;
  padding-bottom: 16px;
  display: grid;
  grid-template-columns: 1fr;
  align-items: start;
  gap: 16px;
  overflow: hidden;
}
@media (min-width: 640px) {
  .selectedFile-preview_files {
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 768px) {
  .selectedFile-preview_files {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media (min-width: 1024px) {
  .selectedFile-preview_files {
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
}
.selectedFile-preview_files__file {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  overflow: hidden;
  gap: 4px;
  background-color: rgba(0, 91, 185, 0.1);
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
  position: relative;
  padding: 4px;
}
.selectedFile-preview_files__file > .img-preview {
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  background-color: rgba(0, 91, 185, 0.05);
  color: rgb(0, 29, 63);
  font-size: 40px;
  overflow: hidden;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
}
.selectedFile-preview_files__file > .close-btn {
  position: absolute;
  top: 0px;
  right: 0px;
  padding: 4px;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
  color: #fff;
  background-color: rgb(0, 91, 185);
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  outline: none;
  transition: 0.2s all linear;
  -webkit-transition: 0.2s all linear;
  -moz-transition: 0.2s all linear;
  -ms-transition: 0.2s all linear;
  -o-transition: 0.2s all linear;
}
.selectedFile-preview_files__file > .close-btn:hover {
  transform: scale(0.9);
  -webkit-transform: scale(0.9);
  -moz-transform: scale(0.9);
  -ms-transform: scale(0.9);
  -o-transform: scale(0.9);
}
.selectedFile-preview_files__file > .file-name {
  font-weight: 600;
  font-size: 12px;
  white-space: pre-wrap;
}

.line-clamp {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.customerTable-wrapper {
  border: 1px solid rgba(0, 91, 185, 0.2);
  padding: 20px;
  overflow: hidden;
}
.customerTable-wrapper .customer-overflow-x-auto {
  overflow-x: auto;
}
.customerTable-wrapper h5 {
  margin-bottom: 20px;
}

.customerTable {
  width: 100%;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
}
.customerTable thead {
  background-color: rgba(0, 91, 185, 0.05);
}
.customerTable thead tr th,
.customerTable tbody tr td {
  padding: 12px 24px;
}
.customerTable thead tr th {
  color: rgb(0, 29, 63);
  font-weight: 600;
}
.customerTable tbody tr td {
  color: #66778C;
}
.customerTable-footer {
  width: 100%;
  padding: 12px 24px;
  background-color: rgba(0, 91, 185, 0.05);
  color: rgb(0, 29, 63);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.customerTable-footer select {
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-color: #66778C;
  color: #66778C;
  background-color: #fff;
}

.customer-badge {
  padding: 6px 10px;
  border-radius: 9999px;
  text-align: center;
  font-size: 12px;
  font-weight: 500;
  -webkit-border-radius: 9999px;
  -moz-border-radius: 9999px;
  -ms-border-radius: 9999px;
  -o-border-radius: 9999px;
}
.customer-badge-success {
  background-color: rgba(59, 205, 91, 0.05);
  color: #3BCD5B;
  border: 1px solid #3BCD5B;
}
.customer-badge-yellow {
  background-color: rgba(255, 207, 85, 0.05);
  color: #FFCF55;
  border: 1px solid #FFCF55;
}
.customer-badge-blue {
  background-color: rgba(0, 91, 185, 0.05);
  color: rgb(0, 91, 185);
  border: 1px solid rgb(0, 91, 185);
}
.customer-badge-gray {
  background-color: rgba(102, 119, 140, 0.05);
  color: #66778C;
  border: 1px solid #66778C;
}

.scrollbar-new {
  max-height: 400px;
  min-height: 400px;
  overflow-y: scroll;
}

.scrollbar-full {
  min-height: 400px;
  max-height: 60vh;
  overflow-y: scroll;
}

.customer-layout-wrapper {
  width: 100%;
  display: flex;
  align-items: flex-start;
}
.customer-layout-wrapper .customer-sidebar {
  min-height: 100vh;
  white-space: nowrap;
}
.customer-layout-wrapper .customer-sidebar-close {
  display: flex;
  align-items: center;
  cursor: pointer;
  justify-content: center;
  background-color: #fff;
  color: rgb(0, 29, 63);
  border-radius: 9999px;
  -webkit-border-radius: 9999px;
  -moz-border-radius: 9999px;
  -ms-border-radius: 9999px;
  -o-border-radius: 9999px;
  padding: 10px;
}
@media (min-width: 768px) {
  .customer-layout-wrapper .customer-sidebar-close {
    display: none;
  }
}
.customer-layout-wrapper .customer-sidebar-close > .icon {
  font-size: 24px;
}
.customer-layout-wrapper .customer-main {
  width: 100%;
}

.customer-tabs {
  width: 100%;
  border-bottom: 1px solid rgba(179, 187, 197, 0.3137254902);
  display: flex;
  align-items: center;
}
.customer-tabs_tab {
  padding: 8px 24px;
  font-weight: 600;
  color: #B3BBC5;
  cursor: pointer;
}
.customer-tabs .active {
  color: rgb(0, 91, 185);
  border-bottom: 2px solid rgb(0, 91, 185);
  background-color: rgba(0, 91, 185, 0.05);
}

.subscription-card {
  min-width: 100%;
  min-height: 188px;
  padding: 20px;
  border-radius: 10px;
  background: linear-gradient(93.6deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0) 100%), linear-gradient(0deg, #001D3F, #001D3F);
  color: #fff;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  font-size: 14px;
  overflow: hidden;
}
@media (min-width: 768px) {
  .subscription-card {
    min-width: 100%;
  }
}
.subscription-card_bg {
  position: absolute;
  bottom: 0;
  right: 0;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}
.subscription-card_change-plan {
  position: absolute;
  top: 0;
  right: 0;
  padding: 8px 16px;
  background: linear-gradient(267.17deg, #00D7EC 0%, #005BB9 100%);
  border-bottom-left-radius: 12px;
}
.subscription-card_plan {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 18px;
  font-weight: 600;
}
.subscription-card_plan .icon {
  width: 40px;
  height: 40px;
  -o-object-fit: contain;
     object-fit: contain;
  font-size: 28px;
}
.subscription-card_bottom {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.subscription-card_bottom__top .price {
  font-size: 40px;
  font-weight: 700;
}
.subscription-card_bottom__top span {
  font-weight: 700;
}
.subscription-card_bottom__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.subscription-card_bottom__bottom .card-badge {
  font-size: 14px;
  padding: 6px 12px;
  background-color: #005BB9;
  color: #fff;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
}
.subscription-card a:hover {
  color: #fff;
}

.credit-card-container {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
  width: 100%;
}
@media (min-width: 768px) {
  .credit-card-container {
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 1280px) {
  .credit-card-container {
    grid-template-columns: 1fr 1fr 1fr;
  }
}

.cancel-subscription-button {
  z-index: 10;
  background: linear-gradient(306.17deg, #00D7EC 0%, #005BB9 100%);
  border: none;
  padding: 8px;
  color: white;
}

.subscription-text {
  font-size: larger;
  font-weight: 600;
}

.customer-credit-card_wrapper {
  background-color: rgba(0, 29, 63, 0.05);
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  align-items: flex-start;
}
.customer-credit-card_wrapper_footer {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 20px;
  font-weight: 500;
}
.customer-credit-card_wrapper_footer_delete {
  color: #FF6A55;
}
.customer-credit-card_wrapper_footer_default {
  color: #66778C;
}

.customer-credit-card {
  width: 100%;
  min-height: 230px;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  justify-content: space-between;
  gap: 16px;
  border-radius: 10px;
  padding: 20px;
  background: linear-gradient(90deg, rgba(0, 215, 236, 0.25) -0.01%, rgba(0, 91, 185, 0.25) 99.99%), linear-gradient(0deg, #001D3F, #001D3F);
  color: #fff;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  position: relative;
}
.customer-credit-card_bg {
  position: absolute;
  bottom: 0;
  right: 0;
}
.customer-credit-card_header {
  display: flex;
  width: 100%;
  gap: 16px;
  align-items: flex-start;
  justify-content: space-between;
}
.customer-credit-card_header p {
  font-size: 18px;
  text-transform: uppercase;
}
.customer-credit-card_number {
  font-size: 16px;
  font-weight: 500;
}
.customer-credit-card_footer {
  display: flex;
  align-items: flex-start;
  gap: 24px;
}
.customer-credit-card_footer_item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  align-items: flex-start;
}
.customer-credit-card_footer_title {
  font-size: 12px;
  font-weight: 400;
}
.customer-credit-card_footer_heading {
  font-size: 14px;
  font-weight: 500;
}

.add-credit-card {
  background: linear-gradient(267.17deg, rgba(0, 215, 236, 0.05) 0%, rgba(0, 91, 185, 0.05) 100%);
  border: 2px dashed rgba(0, 215, 236, 0.2);
  border-radius: 10px;
  height: 230px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  cursor: pointer;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  font-size: 18px;
  font-weight: 600;
  gap: 10px;
}
.add-credit-card .icon {
  font-size: 32px;
}

.subscriptionModal {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.subscriptionModal-success {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  overflow: hidden;
}
.subscriptionModal-success h6 {
  margin-top: 6px;
  font-size: 20px;
  font-weight: 700;
  color: rgb(0, 29, 63);
}
.subscriptionModal-success > .title {
  font-size: 14px;
  font-weight: 500;
  color: #66778C;
}
.subscriptionModal-success > .price {
  font-size: 28px;
  font-weight: 700;
  color: #3BCD5B;
  background: rgba(59, 205, 91, 0.1);
  border-radius: 10px;
  padding: 16px;
  width: 100%;
  text-align: center;
  margin-top: 16px;
  margin-bottom: 16px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
}
.subscriptionModal-success > .divider {
  width: 100%;
  height: 1px;
  background-color: #B3BBC5;
}
.subscriptionModal-success > .btn-payment-success {
  background-color: rgb(0, 91, 185);
  border: 1px solid rgb(0, 91, 185);
  font-weight: 500;
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  cursor: pointer;
  padding: 12px 20px;
  color: #fff;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  transition: all 0.3s ease-in-out;
  width: 100%;
}
@media (min-width: 768px) {
  .subscriptionModal-success > .btn-payment-success {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.subscriptionModal-success > .btn-payment-success:hover {
  background-color: #fff;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
.subscriptionModal-action-cancel {
  width: 100%;
  background-color: #fff;
  border: 1px solid #FF6A55;
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  font-weight: 500;
  cursor: pointer;
  padding: 12px 20px;
  color: #FF6A55;
  transition: all 0.3s ease-in-out;
}
@media (min-width: 768px) {
  .subscriptionModal-action-cancel {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.subscriptionModal-action-cancel:hover {
  background-color: #FF6A55;
  color: #fff;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
.subscriptionModal-action-submit {
  width: 100%;
  background-color: rgb(0, 91, 185);
  border: 1px solid rgb(0, 91, 185);
  font-weight: 500;
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  cursor: pointer;
  padding: 12px 20px;
  color: #fff;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  transition: all 0.3s ease-in-out;
}
@media (min-width: 768px) {
  .subscriptionModal-action-submit {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.subscriptionModal-action-submit:hover {
  background-color: #fff;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
.subscriptionModal .btn-disabled {
  cursor: not-allowed !important;
  background-color: rgba(0, 29, 63, 0.2) !important;
  border: 1px solid rgba(0, 29, 63, 0.2) !important;
  color: rgba(0, 29, 63, 0.4) !important;
}
.subscriptionModal-heading {
  font-size: 24px;
  font-weight: 700;
  color: rgb(0, 29, 63);
  margin-bottom: 0 !important;
}
.subscriptionModal-plan-card {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 22px;
  background: linear-gradient(93.6deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0) 100%), linear-gradient(0deg, #001D3F, #001D3F);
  position: relative;
  border-radius: 12px;
  color: #fff;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  -o-border-radius: 12px;
}
.subscriptionModal-plan-card_bg {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center center;
     object-position: center center;
  opacity: 5%;
}
.subscriptionModal-plan-card_left {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.subscriptionModal-plan-card_left .plan-name {
  font-size: 18px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 10px;
}
.subscriptionModal-plan-card_left .plan-name .icon {
  width: 40px;
  height: 40px;
  -o-object-fit: contain;
     object-fit: contain;
  font-size: 32px;
}
.subscriptionModal-plan-card_left .hours-remaining {
  font-size: 12px;
  background: rgba(255, 255, 255, 0.062745098);
  font-weight: 500;
  padding: 4px 8px;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
}
.subscriptionModal-plan-card_right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
.subscriptionModal-plan-card_right h4 {
  margin: 0;
  padding: 0;
  font-size: 24px;
  font-weight: 700;
}
.subscriptionModal-plan-card_right p {
  font-size: 14px;
  font-weight: 500;
}
.subscriptionModal-add-card-btn {
  width: 100%;
  background-color: rgba(0, 91, 185, 0.1);
  padding: 12px 24px;
  border: none;
  outline: none;
  border-radius: 999px;
  color: rgb(0, 91, 185);
  font-weight: 500;
  -webkit-border-radius: 999px;
  -moz-border-radius: 999px;
  -ms-border-radius: 999px;
  -o-border-radius: 999px;
}
.subscriptionModal-divider {
  display: flex;
  align-items: center;
  gap: 24px;
  width: 100%;
}
.subscriptionModal-divider > div {
  height: 1px;
  width: 100%;
  background-color: #B3BBC5;
}
.subscriptionModal-divider > p {
  color: #B3BBC5;
  font-size: 14px;
  font-weight: 500;
}
.subscriptionModal-billing {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.subscriptionModal-billing h5 {
  font-size: 24px;
  font-weight: 700;
  color: rgb(0, 29, 63);
  margin-bottom: 0 !important;
}
.subscriptionModal-billing-details {
  width: 100%;
}
.subscriptionModal-billing-details_item {
  font-size: 14px;
  margin-top: 4px;
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: space-between;
  flex-wrap: wrap;
}
.subscriptionModal-billing-details_item > h6 {
  font-size: 14px;
  font-weight: 600;
  color: #66778C;
}
.subscriptionModal-billing-details_item > p {
  font-size: 14px;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 10px;
  color: #66778C;
}

.planSelectionCard {
  border: 1px solid rgba(0, 91, 185, 0.1019607843);
  border-radius: 12px;
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  -ms-border-radius: 12px;
  -o-border-radius: 12px;
  padding: 20px 15px;
  cursor: pointer;
}
.planSelectionCard-active {
  background: linear-gradient(267.17deg, rgba(0, 215, 236, 0.05) 0%, rgba(0, 91, 185, 0.05) 100%) !important;
  border: 1px solid rgba(0, 91, 185, 0.5) !important;
}
.planSelectionCard-radio {
  width: 20px;
  height: 20px;
  margin-right: 10px;
  border-radius: 9999px;
  background-color: #fff;
  border: 1px solid rgba(0, 91, 185, 0.1);
  -webkit-border-radius: 9999px;
  -moz-border-radius: 9999px;
  -ms-border-radius: 9999px;
  -o-border-radius: 9999px;
  position: relative;
}
.planSelectionCard-radio-active {
  width: 20px;
  height: 20px;
  margin-right: 10px;
  border-radius: 9999px;
  background-color: #fff;
  border: 1px solid rgb(0, 91, 185);
  -webkit-border-radius: 9999px;
  -moz-border-radius: 9999px;
  -ms-border-radius: 9999px;
  -o-border-radius: 9999px;
  position: relative;
}
.planSelectionCard-radio-active::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: rgb(0, 91, 185);
  border-radius: 9999px;
  -webkit-border-radius: 9999px;
  -moz-border-radius: 9999px;
  -ms-border-radius: 9999px;
  -o-border-radius: 9999px;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
}
.planSelectionCard-left {
  display: flex;
  align-items: center;
  gap: 6px;
}
.planSelectionCard-left h5 {
  margin: 0;
  padding: 0;
  font-size: 16px;
  font-weight: 600;
  color: rgb(0, 29, 63);
}
.planSelectionCard-left p {
  background-color: rgb(0, 29, 63);
  padding: 4px;
  font-size: 10px;
  color: #fff;
  font-weight: 500;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
}
.planSelectionCard-right p {
  font-weight: 600;
  font-size: 14px;
}

.addCardModal {
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: flex-start;
}
.addCardModal-heading {
  font-size: 24px;
  font-weight: 700;
}
.addCardModal-action-submit {
  background-color: rgb(0, 91, 185);
  border: 1px solid rgb(0, 91, 185);
  font-weight: 500;
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  cursor: pointer;
  padding: 12px 20px;
  color: #fff;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  transition: all 0.3s ease-in-out;
}
@media (min-width: 768px) {
  .addCardModal-action-submit {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.addCardModal-action-submit:hover {
  background-color: #fff;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}

.customerHeader {
  padding: 24px;
  background-color: rgba(0, 29, 63, 0.05);
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.customerHeader-left {
  display: flex;
  align-items: center;
  gap: 10px;
}
.customerHeader-left-input {
  border: 1px solid rgba(0, 29, 63, 0.2);
  padding: 12px;
  min-width: 360px;
  background-color: #fff;
  border-radius: 6px;
  display: none;
  align-items: center;
  gap: 10px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
}
@media (min-width: 1280px) {
  .customerHeader-left-input {
    display: flex;
  }
}
.customerHeader-left-input > .icon {
  font-size: 22px;
  color: rgba(0, 29, 63, 0.2);
}
.customerHeader-left-input > input {
  font-size: 14px;
  outline: none;
  border: none;
  background-color: transparent;
  padding: 1px 10px 1px 0px;
  width: 100%;
}
.customerHeader-right {
  display: flex;
  align-items: center;
  gap: 24px;
}
@media (min-width: 1024px) {
  .customerHeader-right {
    gap: 40px;
  }
}
.customerHeader-right .hours {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 18px;
  color: rgb(0, 29, 63);
}
.customerHeader-right .hours > .icon {
  font-size: 24px;
}
.customerHeader-right .dropdown-toggle::after {
  display: none !important;
}
.customerHeader-right .dropdown-menu {
  width: 280px;
  min-width: 100%;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  margin: 0.5rem 0 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
}
@media (min-width: 768px) {
  .customerHeader-right .dropdown-menu {
    width: auto;
    min-width: -moz-max-content;
    min-width: max-content;
  }
}
.customerHeader-right .dropdown-menu .addOnDropdown {
  padding: 24px !important;
  background-color: #fff !important;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}
.customerHeader-right .dropdown-menu .addOnDropdown h5 {
  color: rgb(0, 29, 63);
  font-weight: 700;
  font-size: 24px;
}
.customerHeader-right .dropdown-menu .addOnDropdown-hours {
  display: flex;
  align-items: center;
  gap: 12px;
}
.customerHeader-right .dropdown-menu .addOnDropdown-hours_icon {
  padding: 16px;
  background-color: rgba(0, 91, 185, 0.1);
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.customerHeader-right .dropdown-menu .addOnDropdown-hours_icon > .icon {
  font-size: 28px;
  color: rgb(0, 91, 185);
}
.customerHeader-right .dropdown-menu .addOnDropdown-hours_content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.customerHeader-right .dropdown-menu .addOnDropdown-hours_content h6 {
  font-size: 28px;
  font-weight: 700;
  color: rgb(0, 91, 185);
}
.customerHeader-right .dropdown-menu .addOnDropdown-hours_content p {
  color: #66778C;
  font-size: 14px;
  font-weight: 500;
}
.customerHeader-right .dropdown-menu .addOnDropdown-btn {
  background-color: rgb(0, 91, 185);
  border: 1px solid rgb(0, 91, 185);
  font-weight: 500;
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  cursor: pointer;
  padding: 12px 20px;
  color: #fff;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  transition: all 0.3s ease-in-out;
}
@media (min-width: 768px) {
  .customerHeader-right .dropdown-menu .addOnDropdown-btn {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.customerHeader-right .dropdown-menu .addOnDropdown-btn:hover {
  background-color: #fff;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
.customerHeader-right .dropdown-menu .notificationDropdown {
  max-width: 500px;
  padding: 24px !important;
  background-color: #fff !important;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}
.customerHeader-right .dropdown-menu .notificationDropdown-item {
  display: flex;
  align-items: center;
  gap: 12px;
}
.customerHeader-right .dropdown-menu .notificationDropdown-item > p {
  font-size: 14px;
  color: #66778C;
  font-weight: 500;
}
.customerHeader-right .dropdown-menu .notificationDropdown-link {
  font-size: 14px;
  font-weight: 600;
  color: rgb(0, 91, 185);
  text-decoration: underline;
}
.customerHeader-right > .divider {
  color: #B3BBC5;
}
.customerHeader-right > .whatsapp .icon {
  font-size: 24px;
  color: rgb(0, 29, 63);
}
.customerHeader-right > .message {
  position: relative;
}
.customerHeader-right > .message .unread-count {
  position: absolute;
  top: -4px;
  right: -6px;
  width: 16px;
  height: 16px;
  aspect-ratio: 1/1;
  text-align: center;
  font-size: 10px;
  background-color: rgb(0, 91, 185);
  border-radius: 999px;
  color: #fff;
  -webkit-border-radius: 999px;
  -moz-border-radius: 999px;
  -ms-border-radius: 999px;
  -o-border-radius: 999px;
}
.customerHeader-right > .message .icon {
  font-size: 24px;
}
.customerHeader-right > .notification .icon {
  font-size: 24px;
}
.customerHeader-btn {
  background-color: rgb(0, 91, 185);
  border: 1px solid rgb(0, 91, 185);
  font-weight: 500;
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  cursor: pointer;
  padding: 12px 20px;
  color: #fff;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  transition: all 0.3s ease-in-out;
  display: none;
}
@media (min-width: 768px) {
  .customerHeader-btn {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.customerHeader-btn:hover {
  background-color: #fff;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
@media (min-width: 768px) {
  .customerHeader-btn {
    display: block;
  }
}

.customerDashboard-stats {
  display: grid;
  gap: 24px;
  width: 100%;
  grid-template-columns: 1fr;
}
@media (min-width: 640px) {
  .customerDashboard-stats {
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 768px) {
  .customerDashboard-stats {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media (min-width: 1024px) {
  .customerDashboard-stats {
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
}
.customerDashboard-stats_item {
  width: 100%;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  overflow: hidden;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  background: linear-gradient(267.17deg, rgba(0, 215, 236, 0.05) 0%, rgba(0, 91, 185, 0.05) 100%);
  border: 1px solid #00d7ec;
  position: relative;
  max-height: 110px;
}
.customerDashboard-stats_item__bgicon {
  position: absolute;
  bottom: -22px;
  right: -14px;
  font-size: 80px;
  color: rgba(0, 29, 63, 0.2);
}
.customerDashboard-stats_item__top {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  color: rgb(0, 29, 63);
  font-weight: 500;
}
.customerDashboard-stats_item__bottom {
  color: rgb(0, 91, 185);
  font-size: 28px;
  font-weight: 700;
  margin: 0;
  padding: 0;
}
.customerDashboard-bottom {
  display: grid;
  gap: 24px;
  width: 100%;
  grid-template-columns: 1fr;
}
@media (min-width: 768px) {
  .customerDashboard-bottom {
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 768px) {
  .customerDashboard-bottom > .subscription-card {
    min-width: 100% !important;
  }
}
.customerDashboard-middle {
  display: grid;
  gap: 24px;
  width: 100%;
  grid-template-columns: 1fr;
}
@media (min-width: 768px) {
  .customerDashboard-middle {
    grid-template-columns: 1fr 1fr;
  }
}
.customerDashboard .recent-activity {
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  font-size: 20px;
  padding: 20px;
  border: 1px solid rgba(0, 91, 185, 0.2);
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.customerDashboard .recent-activity_heading {
  font-size: 18px;
  font-weight: 700;
  margin: 0;
  padding: 0;
}
.customerDashboard .recent-activity_list {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 28px;
  position: relative;
  z-index: 1;
}
.customerDashboard .recent-activity_list::before {
  position: absolute;
  content: "";
  width: 1px;
  height: 100%;
  z-index: -1;
  top: 0;
  left: 19px;
  border-left: 2px dashed #b3bbc5;
}
.customerDashboard .connect-card {
  min-width: 100%;
  height: 188px;
  padding: 20px 20px 20px 40px;
  box-sizing: border-box;
  border-radius: 10px;
  background: #005bb9;
  color: #fff;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  font-size: 14px;
  overflow: hidden;
  z-index: 1;
}
@media (min-width: 768px) {
  .customerDashboard .connect-card {
    min-width: 100%;
  }
}
.customerDashboard .connect-card_bg {
  position: absolute;
  bottom: 0;
  right: 0;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.customerDashboard .connect-card > h5 {
  font-size: 18px;
  font-weight: 700;
}
.customerDashboard .connect-card_btn {
  background-color: #fff;
  border: 1px solid rgb(0, 91, 185);
  outline: none;
  font-size: 16px;
  border-radius: 50px;
  font-weight: 500;
  cursor: pointer;
  padding: 12px 20px;
  color: rgb(0, 91, 185);
  transition: all 0.3s ease-in-out;
}
@media (min-width: 768px) {
  .customerDashboard .connect-card_btn {
    font-size: 16px;
    padding: 12px 36px;
    line-height: 22px;
  }
}
.customerDashboard .connect-card_btn:hover {
  background-color: rgb(0, 91, 185);
  color: #fff;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
.customerDashboard .connect-card_btn:hover {
  border: 1px solid #fff;
}
.customerDashboard .review-text {
  font-size: 18px;
  color: #66778c;
  font-weight: 500;
  text-align: center;
  justify-content: center;
  width: 100%;
  margin-top: 10px;
}
.customerDashboard .review-text p {
  color: rgb(0, 29, 63);
  text-decoration: underline;
  cursor: pointer;
}

.activityListItem {
  display: flex;
  align-items: center;
  gap: 16px;
}
.activityListItem-icon {
  width: 40px;
  height: 40px;
  border-radius: 9999px;
  -webkit-border-radius: 9999px;
  -moz-border-radius: 9999px;
  -ms-border-radius: 9999px;
  -o-border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
  overflow: hidden;
  background-color: rgb(0, 29, 63);
  color: #fff;
  font-size: 16px;
  font-weight: 600;
}
.activityListItem-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
}
.activityListItem-heading {
  font-size: 14px;
  font-weight: 500;
  color: #66778C;
}
.activityListItem-date {
  font-size: 12px;
  font-weight: 500;
  color: #B3BBC5;
}

.notificationSection {
  width: 100%;
}
.notificationSection-list {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.notificationSection-list_item {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}
.notificationSection-list_item__left {
  display: flex;
  align-items: center;
  gap: 16px;
}
@media (min-width: 768px) {
  .notificationSection-list_item__left {
    width: 85%;
  }
}
.notificationSection-list_item__left > p {
  font-size: 14px;
  color: #66778C;
  font-weight: 500;
}
.notificationSection-list_item__right {
  font-size: 12px;
  font-weight: 500;
  color: #B3BBC5;
}
@media (min-width: 768px) {
  .notificationSection-list_item__right {
    width: 10%;
  }
}

.notification-icon {
  min-width: 40px;
  min-height: 40px;
  width: 40px;
  height: 40px;
  aspect-ratio: 1/1;
  border-radius: 9999px;
  -webkit-border-radius: 9999px;
  -moz-border-radius: 9999px;
  -ms-border-radius: 9999px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  line-height: 0;
  -o-border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgb(0, 29, 63);
  color: #fff;
  font-weight: 600;
}

.customer-serviceSection-accordians {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
}

.customer-serviceTab {
  display: flex;
  align-items: center;
  background-color: rgba(0, 91, 185, 0.1);
  padding: 6px;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
  color: #66778C;
}
.customer-serviceTab_tab {
  border-radius: 6px;
  padding: 8px 36px;
  box-sizing: border-box;
}
.customer-serviceTab > .active {
  background-color: rgb(0, 29, 63);
  color: #fff;
  border-radius: 6px;
  padding: 8px 36px;
  box-sizing: border-box;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
}

.customer-service-accordian {
  width: 100%;
}
.customer-service-accordian_header {
  width: 100%;
}
.customer-service-accordian_header button {
  padding: 20px;
  width: 100%;
  border: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 8px;
  background-color: rgba(0, 91, 185, 0.05);
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
}
.customer-service-accordian_header button > span {
  font-size: 18px;
  font-weight: 700;
  color: rgb(0, 29, 63);
}
.customer-service-accordian_header {
  font-size: 18px;
  font-weight: 700;
  color: rgb(0, 29, 63);
  width: 100%;
}
.customer-service-accordian_body {
  width: 100%;
  display: grid;
  padding: 0px 20px 20px 20px;
  gap: 20px;
  background-color: rgba(0, 91, 185, 0.05);
  grid-template-columns: 1fr;
}
@media (min-width: 768px) {
  .customer-service-accordian_body {
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 1024px) {
  .customer-service-accordian_body {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media (min-width: 1280px) {
  .customer-service-accordian_body {
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
}

.service-accordian-card {
  width: 100%;
  background-color: #fff;
  padding: 20px;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
}
.service-accordian-card_header {
  display: flex;
  align-items: center;
  gap: 20px;
}
.service-accordian-card_header > .accordian-count {
  font-size: 18px;
  font-weight: 800;
  color: rgb(0, 29, 63);
  border-radius: 6px;
  background: linear-gradient(267.17deg, rgba(0, 215, 236, 0.05) 0%, rgba(0, 91, 185, 0.05) 100%);
  width: 52px;
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1/1;
  overflow: hidden;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
}
.service-accordian-card_header > .accordian-title {
  font-size: 16px;
  font-weight: 500;
  color: rgb(0, 29, 63);
}
.service-accordian-card > .accordian-description {
  color: #66778C;
  font-size: 14px;
  font-weight: 500;
}
.service-accordian-card > .accordian-link {
  color: rgb(0, 91, 185);
  font-weight: 600;
  padding-bottom: 2px;
  border-bottom: 2px solid rgb(0, 91, 185);
}

.service-accordian-card-gray {
  width: 100%;
  background: linear-gradient(267.17deg, rgba(0, 215, 236, 0.05) 0%, rgba(0, 91, 185, 0.05) 100%);
  padding: 20px;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
}
.service-accordian-card-gray_header {
  display: flex;
  align-items: center;
  gap: 20px;
}
.service-accordian-card-gray_header > .accordian-count {
  font-size: 18px;
  font-weight: 800;
  color: rgb(0, 29, 63);
  border-radius: 6px;
  background: #fff;
  width: 52px;
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1/1;
  overflow: hidden;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
}
.service-accordian-card-gray_header > .accordian-title {
  font-size: 16px;
  font-weight: 500;
  color: rgb(0, 29, 63);
}
.service-accordian-card-gray > .accordian-description {
  color: #66778C;
  font-size: 14px;
  font-weight: 500;
}
.service-accordian-card-gray > .accordian-link {
  color: rgb(0, 91, 185);
  font-weight: 600;
  padding-bottom: 2px;
  border-bottom: 2px solid rgb(0, 91, 185);
}

.professional-service-list {
  width: 100%;
  display: grid;
  gap: 20px;
  grid-template-columns: 1fr;
}
@media (min-width: 768px) {
  .professional-service-list {
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 1024px) {
  .professional-service-list {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media (min-width: 1280px) {
  .professional-service-list {
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
}

.submodalactivecard {
  width: 100%;
  padding: 20px;
  border-radius: 10px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 32px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  border: 1px solid rgba(0, 91, 185, 0.1);
}
.submodalactivecard-left {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.submodalactivecard-details {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 14px;
  font-weight: 500;
  color: rgb(0, 29, 63);
}
.submodalactivecard-details .card-expiry {
  font-weight: 400;
}
.submodalactivecard-details .card-name {
  font-weight: 600;
}

.submodalactivecard-active {
  width: 100%;
  padding: 20px;
  border-radius: 10px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  background: linear-gradient(267.17deg, rgba(0, 215, 236, 0.05) 0%, rgba(0, 91, 185, 0.05) 100%);
  border: 1px solid;
  gap: 32px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  border: 1px solid rgba(0, 91, 185, 0.7);
}
.submodalactivecard-active-left {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.submodalactivecard-active-details {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 14px;
  font-weight: 500;
  color: rgb(0, 91, 185);
}
.submodalactivecard-active-details .card-expiry {
  font-weight: 400;
}
.submodalactivecard-active-details .card-name {
  font-weight: 600;
}
.submodalactivecard-active > .check-icon {
  font-size: 26px;
  color: rgb(0, 91, 185);
  align-self: center;
}

.requestDetails {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.requestDetails-header {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
}
.requestDetails-header_left {
  display: flex;
  flex-direction: column;
  gap: 2px;
  align-items: flex-start;
}
.requestDetails-header_left > h3 {
  font-size: 24px;
  font-weight: 700;
  color: rgb(0, 29, 63);
}
.requestDetails-header_left > p {
  font-weight: 400;
  color: rgb(0, 29, 63);
  font-size: 14px;
}
.requestDetails-divider {
  height: 1px;
  width: 100%;
  margin-top: 24px;
  background-color: rgba(179, 187, 197, 0.5);
}
.requestDetails-desc {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
}
.requestDetails-desc > h5 {
  font-weight: 700;
  font-size: 18px;
  color: rgb(0, 29, 63);
}
.requestDetails-desc > p {
  padding: 20px;
  width: 100%;
  background-color: rgba(0, 91, 185, 0.05);
  font-size: 16px;
  font-weight: 400;
  color: rgba(0, 29, 63, 0.7);
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
}
.requestDetails-docs > h5 {
  font-weight: 700;
  font-size: 18px;
  color: rgb(0, 29, 63);
}
.requestDetails-activity > h5 {
  font-weight: 700;
  font-size: 18px;
  color: rgb(0, 29, 63);
}

.doc-grid {
  width: 100%;
  display: grid;
  gap: 16px;
  grid-template-columns: 1fr;
}

@media (min-width: 1024px) {
  .doc-grid {
    width: 100%;
    display: grid;
    gap: 16px;
    grid-template-columns: 1fr 1fr;
  }
}
.documentCard {
  padding: 16px;
  border-radius: 10px;
  border: 1px solid rgba(0, 91, 185, 0.2);
  background-color: #FFFFFF;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  border: 1px solid rgba(0, 91, 185, 0.2);
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
  overflow: hidden;
  position: relative;
}
.documentCard .documentCard__delete-btn {
  display: flex;
  align-items: end;
  justify-content: flex-end;
  position: absolute;
  bottom: 0;
  right: 0;
}
.documentCard .documentCard__delete-btn .documentCard-button {
  border: none;
  background-color: rgb(0, 91, 185);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 12px;
  font-size: 16px;
  border-radius: 10px 0px 10px 0px;
  -webkit-border-radius: 10px 0px 10px 0px;
  -moz-border-radius: 10px 0px 10px 0px;
  -ms-border-radius: 10px 0px 10px 0px;
  -o-border-radius: 10px 0px 10px 0px;
}
.documentCard .documentCard__delete-btn .documentCard-button .icon {
  font-size: 24px;
}
.documentCard-icon {
  font-size: 18px;
  padding: 8px;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 91, 185, 0.0509803922);
  -webkit-border-radius: 9999px;
  color: rgb(0, 91, 185);
  -moz-border-radius: 9999px;
  -ms-border-radius: 9999px;
  -o-border-radius: 9999px;
}
.documentCard .icon-wrapper {
  font-size: 18px;
  padding: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  background: rgba(0, 91, 185, 0.0509803922);
  -webkit-border-radius: 9999px;
  -moz-border-radius: 9999px;
  -ms-border-radius: 9999px;
  -o-border-radius: 9999px;
}
.documentCard-file {
  display: flex;
  flex-direction: column;
  gap: 2px;
  color: rgb(0, 29, 63);
  font-weight: 500;
  font-size: 14px;
}
.documentCard-file-size {
  color: #66778C;
}

.chatbar {
  position: fixed;
  min-height: 100vh;
  overflow-y: scroll;
  width: 100%;
  -ms-overflow-style: none;
  /*IEandEdge*/
  scrollbar-width: none;
  top: 0;
  bottom: 0;
  right: 0;
  background-color: #fff;
  color: rgb(0, 91, 185);
  z-index: 99999;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  transition: left 0.3s ease;
  -webkit-transition: left 0.3s ease;
  -moz-transition: left 0.3s ease;
  -ms-transition: left 0.3s ease;
  -o-transition: left 0.3s ease;
}
@media (min-width: 640px) {
  .chatbar {
    width: 550px;
  }
}
.chatbar::-webkit-scrollbar {
  display: none;
}
.chatbar-header {
  padding: 24px;
  border-bottom: 1px solid rgba(179, 187, 197, 0.1882352941);
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: #fff;
  gap: 8px;
}
.chatbar-header-left .chatbar-profile {
  display: flex;
  align-items: center;
  gap: 12px;
}
.chatbar-header-left .chatbar-profile-icon {
  width: 48px;
  height: 48px;
  aspect-ratio: 1/1;
  border-radius: 999px;
  overflow: hidden;
  -webkit-border-radius: 999px;
  -moz-border-radius: 999px;
  -ms-border-radius: 999px;
  -o-border-radius: 999px;
}
.chatbar-header-left .chatbar-profile-icon img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.chatbar-header-left .chatbar-profile-details {
  display: flex;
  flex-direction: column;
}
.chatbar-header-left .chatbar-profile-details h5 {
  font-size: 20px;
  margin-bottom: 0;
  font-weight: 600;
  color: rgb(0, 29, 63);
}
.chatbar-header-left .chatbar-profile-details .status {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: #66778C;
}
.chatbar-header-left .chatbar-profile-details .status .icon {
  font-size: 10px;
  color: #3BCD5B;
}
.chatbar-header-right {
  display: flex;
  align-items: center;
  gap: 6px;
}
.chatbar-header-right .close-icon {
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  background-color: rgba(0, 91, 185, 0.1);
  color: rgb(0, 91, 185);
  border-radius: 999px;
  padding: 12px;
  -webkit-border-radius: 999px;
  -moz-border-radius: 999px;
  -ms-border-radius: 999px;
  -o-border-radius: 999px;
}
.chatbar-middle {
  padding: 24px;
  min-height: 200px;
  height: 100%;
  overflow-y: scroll;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.chatbar-middle::-webkit-scrollbar {
  display: none;
}
.chatbar-bottom {
  padding: 24px;
  border-top: 1px solid rgba(179, 187, 197, 0.1882352941);
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  background-color: #fff;
}
.chatbar-bottom-attach {
  padding: 16px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  background-color: rgb(0, 91, 185);
  color: #fff;
  font-size: 20px;
}
.chatbar-bottom-input {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
  width: 100%;
}
.chatbar-bottom-input .input {
  padding: 13px;
  width: 100%;
  border-radius: 8px;
  border: 1.5px solid rgba(179, 187, 197, 0.1882352941);
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.chatbar-bottom-input .input input {
  font-size: 14px;
  width: 100%;
  border: none;
  outline: none;
}
.chatbar-bottom-input .input .icon {
  color: rgb(0, 91, 185);
  font-size: 20px;
}
.chatbar-bottom-input .chat-error-input-txt {
  font-size: 12px;
  color: rgba(255, 0, 0, 0.671);
}
.chatbar-btn {
  background: none;
  border: none;
  outline: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

.chatMessage {
  display: flex;
  width: 100%;
  align-items: flex-start;
  gap: 12px;
}
.chatMessage-active {
  flex-direction: row-reverse;
}
.chatMessage-avatar {
  width: 36px;
  height: 36px;
  aspect-ratio: 1/1;
  border-radius: 999px;
  overflow: hidden;
  -webkit-border-radius: 999px;
  -moz-border-radius: 999px;
  -ms-border-radius: 999px;
  -o-border-radius: 999px;
}
.chatMessage-avatar img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.chatMessage-content {
  max-width: 75%;
  padding: 8px 16px;
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  font-size: 14px;
  color: rgb(0, 29, 63);
  background-color: rgba(0, 29, 63, 0.05);
}
.chatMessage .active-content {
  background-color: rgb(0, 29, 63) !important;
  color: #fff !important;
}

.howItWorks > h2 {
  font-weight: 900;
  font-size: 28px;
  font-weight: 900;
}
@media (min-width: 640px) {
  .howItWorks > h2 {
    font-size: 32px;
  }
}
@media (min-width: 768px) {
  .howItWorks > h2 {
    font-size: 38px;
  }
}
@media (min-width: 1024px) {
  .howItWorks > h2 {
    font-size: 40px;
  }
}

.titleIcon {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 28px;
}
.titleIcon img {
  width: 28px;
  height: 28px;
  -o-object-fit: contain;
     object-fit: contain;
  aspect-ratio: 1/1;
}

.panel-parent {
  width: 100%;
  border: 2px solid #00d7ec;
  padding: 15px 10px;
  margin-top: 10px;
  position: relative;
}
@media (min-width: 640px) {
  .panel-parent {
    padding: 25px 10px;
  }
}

.panel-title {
  position: absolute;
  top: -17px;
  left: 40px;
  background: white;
  padding: 0 10px;
  font-weight: 700;
}

.grid {
  display: grid;
  gap: 16px;
  align-items: center;
  grid-template-columns: 100%;
}
@media (min-width: 640px) {
  .grid {
    grid-template-columns: 100%;
  }
}
@media (min-width: 768px) {
  .grid {
    grid-template-columns: 1fr 1fr;
  }
  .grid > *:nth-child(3) {
    grid-column: 1/-1;
  }
}
@media (min-width: 1024px) {
  .grid {
    grid-template-columns: 30% 30% auto;
  }
  .grid > *:nth-child(3) {
    grid-column: auto;
  }
}

.two-layout-grid {
  padding: 15px 0px;
  display: grid;
  width: 100%;
  gap: 16px;
  grid-template-columns: 100%;
}
@media (min-width: 640px) {
  .two-layout-grid {
    grid-template-columns: 100%;
  }
}
@media (min-width: 768px) {
  .two-layout-grid {
    grid-template-columns: 100%;
  }
}
@media (min-width: 1024px) {
  .two-layout-grid {
    grid-template-columns: 1fr 1fr;
  }
}

.messageContainer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 15px;
  flex-wrap: nowrap;
  padding: 4px 5px;
  cursor: pointer;
  font-family: "Maven Pro", sans-serif;
  font-weight: 600;
}
.messageContainer .envelop {
  display: flex;
  align-items: center;
  gap: 5px;
}
.messageContainer .title {
  font-family: "Maven Pro", sans-serif;
}

.chatContainer {
  display: grid;
  gap: 16px;
  align-items: center;
  grid-template-columns: 55px 1fr;
  width: 100%;
  /* Added this line */
  min-height: 80px;
  justify-content: start;
  gap: 10px;
  align-items: flex-start;
  padding-right: 5px;
}
.chatContainer .avatar {
  border-radius: 50%;
  height: 40px;
  width: 40px;
  border: 1px solid gray;
}
.chatContainer .center-section .chat-header {
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: flex-start;
  justify-content: space-between;
}
.chatContainer .center-section .chat-header .timeStamp {
  font-size: 14px;
}
.chatContainer .center-section .chat-header .edited-label {
  border: 2px solid #00d7ec;
  padding: 2px 4px;
  font-size: 14px;
  margin: 2px 4px;
}

.msg-container {
  position: relative;
  width: 100%;
}
.msg-container .messageInput {
  width: 100%;
  position: relative;
  z-index: 1;
}
.msg-container .messageInput .sendIcon {
  position: absolute;
  bottom: 10px;
  right: 10px;
  z-index: 3;
  color: #00d7ec;
  cursor: pointer;
}

.chatbox-input {
  width: 100%;
}

textarea.chatbox-input {
  outline: 1px solid #00d7ec;
  border-radius: 10px;
  padding: 10px;
  border: none;
}

.status-filter {
  position: relative;
}
.status-filter th {
  color: rgb(0, 29, 63);
  font-weight: 600;
}
.status-filter .filter-btn {
  background: none;
  border: none;
  cursor: pointer;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px;
  font-size: 16px;
  color: rgb(0, 29, 63);
  font-weight: 600;
}
.status-filter .popover {
  position: absolute;
  top: 100%;
  left: 0;
  margin-top: 8px;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 6px;
  padding: 10px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  z-index: 100;
  width: 180px;
}
.status-filter .status-select {
  width: 100%;
  padding: 8px;
  font-size: 14px;
  border: 1px solid #ccc;
  border-radius: 4px;
}

.loadMore {
  background-color: transparent;
  border: none;
  color: #000;
  position: absolute;
  bottom: 5px;
  left: 45%;
  right: auto;
  cursor: pointer;
}

.message-wrapper {
  max-height: 20vh;
  overflow-y: auto;
  padding: 5px 2px;
  width: 100%;
  min-height: 50px;
}
.message-wrapper .edit-button {
  color: #00d7ec;
  font-weight: 700;
  cursor: pointer;
}

.readAll {
  cursor: pointer;
  text-align: end;
}

.trial {
  border: 1px solid #00d7ec;
  padding: 2px 4px;
  font-weight: 300;
  font-size: 14px;
}

.h-full {
  height: 400px;
}

.client-container {
  max-width: 1440px;
  margin: 0 auto;
  padding-left: 20px;
  padding-right: 20px;
}
@media (min-width: 768px) {
  .client-container {
    padding-left: 30px;
    padding-right: 30px;
  }
}
@media (min-width: 1024px) {
  .client-container {
    padding-left: 60px;
    padding-right: 60px;
  }
}
@media (min-width: 1280px) {
  .client-container {
    padding-left: 95px;
    padding-right: 95px;
  }
}

.client-small-container {
  max-width: 1440px;
  margin: 0 auto;
  padding-left: 20px;
  padding-right: 20px;
}
@media (min-width: 1280px) {
  .client-small-container {
    padding-left: 40px;
    padding-right: 40px;
  }
}

.bg-client-blue {
  background-color: rgb(0, 91, 185);
}

.bg-client-dark-blue {
  background-color: rgb(0, 29, 63);
}

.bg-client-light {
  background-color: #fff;
}

.bg-client-gray {
  background-color: rgb(102, 119, 140);
}

.text-client-blue {
  color: rgb(0, 91, 185);
}

.text-client-dark-blue {
  color: rgb(0, 29, 63);
}

.text-client-light {
  color: #fff;
}

.text-client-yellow {
  color: #ffcf55;
}

.text-client-green {
  color: #3bcd5b;
}

.text-client-gray {
  color: rgb(102, 119, 140);
}

.text-client-cyan-blue {
  color: rgb(0, 215, 236);
}

p {
  margin: 0 !important;
}

.font-secondary {
  font-family: "Merriweather", serif;
}

#banner_table_wrapper {
  overflow-x: auto;
}

.cursor-hand {
  cursor: pointer !important;
}

.chat-bubble {
  position: relative;
  margin-right: 100px;
}

.vertical-timeline::before {
  background-color: rgb(0, 29, 63) !important;
}

.vertical-timeline-element-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 20px;
  border: none !important;
  font-weight: 700;
}

.vertical-timeline-element-content {
  background-color: #005bb9 !important;
  border-radius: 16px !important;
  color: #fff;
  padding: 20px !important;
  -webkit-border-radius: 16px !important;
  -moz-border-radius: 16px !important;
  -ms-border-radius: 16px !important;
  -o-border-radius: 16px !important;
}
@media (min-width: 768px) {
  .vertical-timeline-element-content {
    padding: 24px !important;
  }
}

.vertical-timeline-element-content-arrow {
  border-right-color: #005bb9 !important;
}

.vertical-timeline-element-title {
  font-weight: 700;
  font-size: 18px;
}
@media (min-width: 640px) {
  .vertical-timeline-element-title {
    font-size: 20px;
  }
}
@media (min-width: 768px) {
  .vertical-timeline-element-title {
    font-size: 24px;
  }
}
@media (min-width: 1024px) {
  .vertical-timeline-element-title {
    font-size: 28px;
  }
}

.vertical-timeline-element-date {
  display: none !important;
}

.vertical-timeline-element-subtitle {
  font-weight: 400;
  color: rgba(255, 255, 255, 0.5);
  font-size: 16px;
}
@media (min-width: 640px) {
  .vertical-timeline-element-subtitle {
    font-size: 18px;
  }
}
@media (min-width: 768px) {
  .vertical-timeline-element-subtitle {
    font-size: 20px;
  }
}
@media (min-width: 1024px) {
  .vertical-timeline-element-subtitle {
    font-size: 24px;
  }
}

.vertical-timeline-element-desc {
  margin-top: 16px !important;
  color: rgba(255, 255, 255, 0.5);
}

.about-dynamic-content {
  display: flex;
  flex-direction: column;
}

.rounded-block {
  background-color: rgba(0, 91, 185, 0.05);
  padding: 10px;
  border-radius: 8px;
  color: rgba(0, 29, 63, 0.7);
  width: 100%;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
}

/* For Chrome, Safari, Edge, and other WebKit browsers */
.zip-code-input::-webkit-outer-spin-button,
.zip-code-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* For Firefox */
.zip-code-input[type=number] {
  -moz-appearance: textfield;
}

button:disabled {
  pointer-events: none !important; /* Prevent any mouse interactions */
  opacity: 0.5; /* Optional: visually indicate that the button is disabled */
  cursor: not-allowed; /* Optional: change cursor to indicate the button is not clickable */
}

.swiper-button-prev:after,
.swiper-rtl {
  /* content: 'prev'; */
  content: "prev";
  font-size: 18px !important;
  font-weight: 700;
  padding: 7px 12px 7px 10px !important;
  color: rgb(0, 91, 185) !important;
  background: #ffffff !important;
  border-radius: 100%;
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.3); /* Adding box shadow */
}
@media (min-width: 768px) {
  .swiper-button-prev:after,
  .swiper-rtl {
    font-size: 18px;
    color: #ffffff !important;
    background: rgb(0, 91, 185) !important;
  }
}

.swiper-button-next:after,
.swiper-rtl {
  /* content: 'prev'; */
  content: "next";
  font-size: 18px !important;
  font-weight: 700;
  padding: 7px 10px 7px 12px !important;
  border-radius: 100%;
  color: rgb(0, 91, 185) !important;
  background: #ffffff !important;
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.3); /* Adding box shadow */
}
@media (min-width: 768px) {
  .swiper-button-next:after,
  .swiper-rtl {
    font-size: 18px;
    color: #ffffff !important;
    background: rgb(0, 91, 185) !important;
  }
}

.swiper-button-prev {
  position: absolute !important;
  left: 1 !important;
  z-index: 99999999999 !important;
}

.swiper-button-next {
  position: absolute !important;
  right: 1 !important;
  z-index: 99999999999 !important;
}
