/*--------------------------------------------------------------------------------------*/
/*General-Css-Here
/*--------------------------------------------------------------------------------------*/

@import url('https://fonts.googleapis.com/css2?family=Inter+Tight:wght@100;200;300;400;500;600;700;800;900&display=swap');

:root {
  --primary-colors: #F54583;
  --secondary-color: #3CC2FA;
  --white: #fff;
  --black: #1E333E;
  --gry: #F6F6F6;
  --gry-text: #6D7174;
}

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

p {
  margin: 0;
}

body {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: 'Inter Tight', sans-serif;
  font-size: 14px;
  font-weight: 400;
  background: #fff;
  letter-spacing: 0.02em;
  color: var(--black);
}

a {
  -webkit-transition: 0.5s ease-out;
  -moz-transition: 0.5s ease-out;
  -o-transition: 0.5s ease-out;
  transition: 0.5s ease-out;
  text-decoration: none;
}

a {
  color: #165cea;
  text-decoration: underline;
}

ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

h1,
h2,
h3,
h4,
h5,
h6,
figure {
  margin: 0;
  padding: 0;
}

img {
  max-width: 100%;
}

.site_content {
  display: block;
  padding-top: 89px;
}

.site_content::after,
.site_content::before {
  display: table;
  clear: both;
  content: "";
}

a:hover {
  text-decoration: none;
}

header,
footer,
section {
  display: block;
}

address {
  margin: 0
}

.container::after,
.container::before {
  display: table;
  clear: both;
  content: "";
}

[type="radio"]:checked,
[type="radio"]:not(:checked) {
  position: absolute;
  left: -9999px;
}

[type="radio"]:checked+label,
[type="radio"]:not(:checked)+label {
  position: relative;
  padding-left: 28px;
  cursor: pointer;
  line-height: 20px;
  display: inline-block;
  color: #666;
}

[type="radio"]:checked+label::before,
[type="radio"]:not(:checked)+label::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 18px;
  height: 18px;
  border: 1px solid #ddd;
  border-radius: 100%;
  background: #fff;
}

[type="radio"]:checked+label::after,
[type="radio"]:not(:checked)+label::after {
  content: "";
  background: #24c4e9;
  width: 12px;
  height: 12px;
  position: absolute;
  top: 3px;
  left: 3px;
  border-radius: 100%;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}

[type="radio"]:not(:checked)+label::after {
  opacity: 0;
  -webkit-transform: scale(0);
  transform: scale(0);
}

[type="radio"]:checked+label::after {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}

a:focus {
  outline: none;
}

button:focus {
  border: none;
  outline: none;
}

select {
  appearance: none;
}

.container {
  max-width: 1300px;
}

.common_title h2 {
  text-align: center;
  font-size: 30px;
  font-weight: 700;
  color: #cf8b46;
  padding-bottom: 40px
}

.md-form input[type="date"]:focus:not([readonly]),
.md-form input[type="datetime-local"]:focus:not([readonly]),
.md-form input[type="email"]:focus:not([readonly]),
.md-form input[type="number"]:focus:not([readonly]),
.md-form input[type="password"]:focus:not([readonly]),
.md-form input[type="search-md"]:focus:not([readonly]),
.md-form input[type="search"]:focus:not([readonly]),
.md-form input[type="tel"]:focus:not([readonly]),
.md-form input[type="text"]:focus:not([readonly]),
.md-form input[type="time"]:focus:not([readonly]),
.md-form input[type="url"]:focus:not([readonly]),
.md-form textarea.md-textarea:focus:not([readonly]) {
  box-shadow: 0 1px 0 0 #ffee04;
  border-bottom: 1px solid #ffee04;
}

.md-form input[type="date"]:focus:not([readonly])+label,
.md-form input[type="datetime-local"]:focus:not([readonly])+label,
.md-form input[type="email"]:focus:not([readonly])+label,
.md-form input[type="number"]:focus:not([readonly])+label,
.md-form input[type="password"]:focus:not([readonly])+label,
.md-form input[type="search-md"]:focus:not([readonly])+label,
.md-form input[type="search"]:focus:not([readonly])+label,
.md-form input[type="tel"]:focus:not([readonly])+label,
.md-form input[type="text"]:focus:not([readonly])+label,
.md-form input[type="time"]:focus:not([readonly])+label,
.md-form input[type="url"]:focus:not([readonly])+label,
.md-form textarea.md-textarea:focus:not([readonly])+label {
  color: #ffee04;
}

/*buttons*/
.btn {
  height: 45px;
  font-size: 15px;
  line-height: 42px;
  padding: 0px 15px;
  font-weight: 600;
  border-radius: 10px;
  border: none;
  box-shadow: none !important;
}

.btn-primary {
  background: var(--primary-colors);
  color: var(--white);
}

.btn-primary:hover {
  background: #E1306E
}

.btn-secondary {
  background: var(--secondary-color);
  color: var(--white);
}

.btn-secondary:hover {
  background: #14AFF0;
}

.btn-black {
  background: var(--black);
  color: var(--white);
}

.btn-black:hover {
  background: #000;
}

.btn-white {
  background: var(--white);
  color: var(--black);
}

header {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 999;
  transition: 0.3s ease-in-out;
  padding: 5px 0px;
}

body.fixed header {
  background: #fff;
  box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.2);
}

.navbar-brand img {
  max-width: 165px;
}

.navbar-expand-lg .navbar-nav .nav-link {
  color: var(--black);
  font-weight: 500;
}

.button-header {
  margin-left: 20px;
}

.button-header .dropdown {
  margin-left: 10px;
  display: inline-block;
}

.home-banner-text h1 {
  font-size: 52px;
  font-weight: 700;
  color: var(--black);
  line-height: 60px;
}

.home-banner-text p {
  color: #1E333E;
  font-size: 30px;
  margin-top: 10px;
  font-weight: 700;
}

/* .home-banner-text { max-width: 585px; } */
.home-banner-text .btn {
  margin-top: 40px;
}

.home-banner {
  position: relative;
  padding-top: 80px;
}

.home-banner:after {
  position: absolute;
  content: "";
  width: 65%;
  right: 0;
  top: 0;
  height: 100%;
  background: linear-gradient(-90deg, #3cc2fa 0%, #fff 100%);
  opacity: 0.3;
  z-index: -11;
}

.home-shape-in {
  height: 60px;
}

.l-gry {
  background: var(--black);
}

.l-blue {
  background: var(--secondary-color);
  opacity: 0.3;
}

.l-pink {
  background: var(--primary-colors);
  opacity: 0.3;
}

.left-shape {
  position: absolute;
  bottom: -60px;
  left: 0;
  width: 50%;
  animation-name: animate-width;
  -webkit-animation-name: animate-width;
  animation-duration: 2s;
  /** Tốc độ chạy **/
  animation-delay: 2s;
  /** Thời gian chạy **/
  animation-iteration-count: infinite;
  /** Lặp lại **/
  animation-direction: alternate;
  /** Quay lại **/
}

.right-shape {
  position: absolute;
  bottom: -60px;
  right: 0;
  width: 50%;
  display: flex;
  flex-direction: column;
  align-items: end;
  animation-name: animate-width2;
  -webkit-animation-name: animate-width2;
  animation-duration: 3s;
  /** Tốc độ chạy **/
  animation-delay: 2s;
  /** Thời gian chạy **/
  animation-iteration-count: infinite;
  /** Lặp lại **/
  animation-direction: alternate;
  /** Quay lại **/
}

.left-shape .l-gry {
  width: 10%;
}

.left-shape .l-blue {
  width: 62%;
}

.left-shape .l-pink {
  width: 35%;
}

.right-shape .l-gry {
  width: 60%;
  margin-right: 100px;
  z-index: -1;
}

.right-shape .l-blue {
  width: 62%;
}

.right-shape .l-pink {
  width: 100%;
  z-index: -1;
}

@keyframes animate-width {
  from {
    width: 50%;
  }

  to {
    width: 30%;
  }
}

@keyframes animate-width2 {
  from {
    width: 50%;
  }

  to {
    width: 60%;
  }
}

.section-padding {
  padding: 100px 0px;
}

.headings {
  margin-bottom: 50px;
}

.headings span {
  font-size: 22px;
  color: var(--primary-colors);
  font-weight: 700;
}

.headings h2 {
  font-size: 45px;
  font-weight: 700;
  color: #274250;
}

.how-it-work-box {
  display: flex;
}

.how-it-work-box article {
  width: 100%;
  border-radius: 23px;
  background: var(--white);
  box-shadow: 0px 15px 50px rgba(0, 0, 0, 0.06);
  padding: 30px;
  transition: 0.3s ease-in-out;
}

.how-it-work-box article:hover {
  box-shadow: 0px 15px 50px rgba(0, 0, 0, 0.2);
}

.how-it-work-box article figure {
  transition: 0.3s ease-in-out;
  width: 55px;
  height: 55px;
  border-radius: 10px;
  background: #E3F7FF;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--secondary-color);
  font-size: 26px;
  margin-bottom: 30px;
}

.how-it-work-box article h4 {
  color: var(--black);
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 10px;
}

.how-it-work-box article p {
  color: var(--black);
  font-size: 14px;
}

.how-it-work-box article:hover figure {
  color: var(--white);
  background: var(--secondary-color);
}

.about-home {
  position: relative;
  padding-top: 80px;
}

.about-home:after {
  content: "";
  width: 96%;
  background-color: var(--primary-colors);
  background-image: url(../images/bg.jpg);
  background-repeat: no-repeat;
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  z-index: -1;
  border-radius: 50px 0px 0px 50px;
  background-size: auto 100%;
}

.about-home .headings h2 {
  color: var(--white);
  margin-bottom: 10px;
}

.about-home .headings span {
  color: var(--white);
}

.about-home .headings p {
  font-size: 18px;
  font-weight: 500;
  color: var(--white);
}

.video-how {
  border-radius: 30px;
  overflow: hidden;
  height: 450px;
  position: relative;
}

.video-how img {
  object-fit: cover;
  object-position: center;
  width: 100%;
  height: 100%;
  position: relative;
  z-index: -1
}

.video-how .video-how-btn {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.video-how .video-how-btn a {
  position: relative;
  width: 80px;
  background: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  height: 80px;
  border-radius: 50%;
  font-size: 50px;
  text-decoration: none;
  color: var(--secondary-color);
}

.video-how .video-how-btn a:before {
  opacity: 0;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: absolute;
  right: 0;
  bottom: 0;
  content: "";
  height: 100%;
  width: 100%;
  border: 8px solid rgba(0, 0, 0, 0.5);
  border-radius: 100%;
  -webkit-animation-name: ripple;
  animation-name: ripple;
  -webkit-animation-duration: 3s;
  animation-duration: 3s;
  -webkit-animation-delay: 0.5s;
  animation-delay: 0.5s;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: cubic-bezier(0.65, 0, 0.34, 1);
  animation-timing-function: cubic-bezier(0.65, 0, 0.34, 1);
  z-index: -1;
}

.video-how .video-how-btn a:after {
  opacity: 0;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: absolute;
  right: 0;
  bottom: 0;
  content: "";
  height: 100%;
  width: 100%;
  border: 8px solid rgba(0, 0, 0, 0.5);
  border-radius: 100%;
  -webkit-animation-name: ripple;
  animation-name: ripple;
  -webkit-animation-duration: 3s;
  animation-duration: 3s;
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: cubic-bezier(0.65, 0, 0.34, 1);
  animation-timing-function: cubic-bezier(0.65, 0, 0.34, 1);
  z-index: -1;
}

@keyframes ripple {
  from {
    opacity: 1;
    transform: scale3d(0.75, 0.75, 1);
  }

  to {
    opacity: 0;
    transform: scale3d(1.5, 1.5, 1);
  }
}

#videomodal iframe {
  width: 100%;
  height: 100%;
}

#videomodal .modal-body {
  padding: 60;
}

#videomodal .btn-close {
  position: absolute;
  right: 15px;
  top: 15px;
  z-index: 1;
  color: var(--white);
  width: 30px;
  height: 30px;
  background-color: var(--white);
}

#videomodal .modal-content {
  background: none;
  background-color: rgba(0, 0, 0, 0.2);
}

.video-how {
  margin-top: 80px;
}

.app-info-box {
  background: red;
  padding: 50px 0px;
  border-radius: 50px;
  padding-bottom: 30px;
  margin-bottom: 70px;
}

.app-info-box figure {
  width: 360px;
  margin: auto;
}

.app-info-box1 {
  background: linear-gradient(-90deg, #D1F1FE 0%, #fff 100%);
}

.app-info-box2 {
  background: linear-gradient(-90deg, #fff 0%, #FDD3E2 100%);
}

.app-info-box .headings p {
  font-size: 18px;
  margin: 0;
  margin-top: 15px;
  color: var(--black);
}

.app-info .container .app-info-box:last-child {
  margin-bottom: 0;
}

.sec-secure-text h4 {
  font-size: 50px;
  font-weight: 700;
  color: var(--black);
  margin-top: 10px;
  margin-bottom: 10px;
}

.sec-secure-text p {
  font-size: 22px;
  color: var(--gry-text);
}

.sec-secure-text {
  max-width: 720px;
  margin: auto;
}

.faq-sec .headings p {
  font-size: 18px;
}

.faq-sec {
  background: #F5FCFF;
}

.faq-sec .accordion {
  max-width: 750px;
  margin: auto;
}

.accordion-item {
  border-radius: 15px !important;
  margin: 15px 0px;
  border: none;
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.10);
}

.accordion-button {
  border-radius: 15px !important;
  border: none;
  font-size: 20px;
  font-weight: 600;
  color: var(--black);
}

.accordion-button:not(.collapsed) {
  background: var(--white);
  box-shadow: none;
  color: var(--primary-colors);
}

.accordion-button::after {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none"  d="M0 0h24v24H0z"/><path d="M11 11V5h2v6h6v2h-6v6h-2v-6H5v-2z"/></svg>');
}

.accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3Csvg id='x-close' xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Crect id='x-close-2' data-name='x-close' width='24' height='24' fill='none'/%3E%3Cpath id='Icon' d='M12,0,0,12m12,0L0,0' transform='translate(6 6)' fill='none' stroke='%23f54583' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'/%3E%3C/svg%3E");
}

.accordion-body {
  font-size: 15px;
}

.blog-list .headings p {
  font-size: 18px;
}

.blog-box figure {
  margin-bottom: 20px;
}

.blog-box figure a {
  height: 260px;
  overflow: hidden;
  display: block;
  border-radius: 20px;
  background: var(--black);
}

.blog-box figure a img {
  transition: 0.3s;
  object-fit: cover;
  object-position: center;
  width: 100%;
  height: 100%;
}

.blog-box figcaption span {
  color: var(--black);
  opacity: 0.74;
}

.blog-box figcaption h4 a {
  text-decoration: none;
  color: var(--black);
  font-size: 25px;
  font-weight: 600;
}

.blog-box figcaption .link-btn {
  font-size: 16px;
  font-weight: 600;
  color: var(--primary-colors);
  display: flex;
  align-items: center;
  text-decoration: none;
  margin-top: 15px;
}

.blog-box figcaption .link-btn i {
  font-weight: normal;
  font-size: 25px;
}

.blog-box figcaption .link-btn:hover {
  color: var(--black);
}

.blog-box figcaption h4:hover a {
  text-decoration: underline;
}

.blog-box article:hover figure img {
  transform: scale(1.1) rotate(3deg);
  opacity: 0.8
}

.social-icon a {
  width: 45px;
  min-width: 45px;
  height: 45px;
  border-radius: 10px;
  background: var(--primary-colors);
  text-decoration: none;
  color: var(--white);
  display: inline-flex;
  margin-right: 5px;
  font-size: 22px;
  align-items: center;
  justify-content: center;
}

footer {
  background: #0A1A23;
  position: relative;
}

footer:after {
  content: "";
  position: absolute;
  left: 0;
  top: 0px;
  background: var(--primary-colors);
  width: 215px;
  height: 45px;
}

footer:before {
  content: "";
  position: absolute;
  right: 0;
  top: -45px;
  background: var(--secondary-color);
  width: 215px;
  height: 45px;
}

.footer-logo img {
  max-width: 211px;
}

.footer-logo {
  margin-bottom: 30px;
}

.footer-logo p {
  color: var(--white);
  opacity: 0.7;
  margin-top: 15px;
}

.footer-head {
  font-weight: 600;
  font-size: 24px;
  color: var(--white);
  margin-bottom: 40px;
}

.footer-link a {
  padding: 7px 0px;
  font-size: 15px;
  color: var(--white);
  opacity: 0.7;
  display: block;
  text-decoration: none;
}

.footer-link a:hover {
  opacity: 1;
}

.footer-app a {
  display: block;
  margin-bottom: 15px;
}

.footer-copyright {
  padding: 20px 15px;
  border-top: 1px solid #202F37;
}

.footer-copyright span {
  color: var(--white);
  opacity: 0.7;
  font-weight: 300;
}

.button-header .btn {
  min-width: 100px;
}

/*login*/
body.inner-pages header {
  background: #fff;
  border: 1px solid #e5e5e5;
}

body.inner-pages .site-container {
  background: var(--gry);
  min-height: 700px;
  padding-top: 75px;
}

.card-shadow {
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.16);
  border-radius: 20px;
  padding: 30px;
  background: var(--white);
}

.card-shadow-in {
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.16);
  border-radius: 20px;
  padding: 20px;
  background: var(--white);
}

.login-box {
  background: var(--white);
  max-width: 450px;
  margin: 0px auto;
}

.form-control {
  height: 45px;
  font-size: 14px;
  border-radius: 10px;
  border-width: 1.5px;
}

.form-label {
  font-size: 14px;
  font-weight: 600;
  color: var(--black);
  margin-bottom: 5px;
}

.form-label span {
  color: red;
}

.input-group-text {
  min-width: 50px;
  background: none;
}

.input-group-text svg {
  stroke: #ADAABC;
}

.input-group .form-control {
  padding-left: 50px;
  border-radius: 10px !important;
}

.needs-validation.was-validated .input-group.has-validation .input-group-text {
  border-color: #198754
}

.needs-validation.was-validated .input-group.has-validation .input-group-text:is-invalid {
  border-color: red
}

.input-group {
  position: relative;
}

.input-group .input-group-text {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 11;
  height: 45px;
  border: none;
}

.form-group {
  margin-bottom: 15px;
}

.login-head h4 {
  font-weight: 700;
  color: var(--black);
}

.login-head p {
  color: #949CA4;
  max-width: 80%;
  margin: 0px auto;
}

.login-head figure {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: auto;
  margin-bottom: 20px;
  width: 65px;
  height: 65px;
  border-radius: 22px;
  background: var(--white);
  box-shadow: 0px 3px 15px #dce4ec;
}

.login-head {
  margin-bottom: 25px;
}

.or-divider {
  position: relative;
  text-align: center;
}

.or-divider:after {
  content: "";
  height: 1px;
  background-color: #E0DDE5;
  width: 100%;
  position: absolute;
  top: 10px;
  left: 0;
}

.or-divider span {
  color: #ADAABC;
  padding: 10px;
  background-color: var(--white);
  position: relative;
  z-index: 1;
}

.form-check-input {
  width: 20px;
  height: 20px;
}

.form-check-input[type="checkbox"] {
  border-radius: 6px;
}

.form-check-input:checked {
  background-color: var(--black);
  border-color: var(--black);
}

.form-check label {
  margin-left: 10px;
  margin-top: 2px;
}

.button-login {
  position: relative;
}

.button-login span {
  width: 35px;
  height: 35px;
  border-radius: 8px;
  background-color: rgba(255, 255, 255, 0.2);
  display: flex;
  position: absolute;
  top: 5px;
  right: 5px;
  align-items: center;
  justify-content: center;
}

.social-btn .btn-fb {
  background: #1877F2;
  color: #fff;
}

.social-btn .btn-google {
  background: #242324;
  color: #fff;
}

.social-btn .btn {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-right: 5px;
}

.or-divider {
  margin: 15px 0px;
}

.forgot-pass a {
  font-weight: 600;
  text-decoration: none;
  color: var(--secondary-color);
}

.new-user-text {
  font-size: 16px;
  text-align: center;
  margin-top: 20px;
}

.new-user-text p {
  margin-bottom: 0;
  color: var(--black);
}

.new-user-text p a {
  color: var(--primary-colors);
  font-weight: 600;
  text-decoration: none;
}

.signup-form {
  max-width: 730px;
}

.input-file {
  position: relative;
  cursor: pointer;
}

.input-file input {
  opacity: 0;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 45px;
  cursor: pointer;
}

.input-file .label {
  margin-top: 5px;
  display: inline-block;
  pointer-events: none;
}

.input-file .button {
  position: absolute;
  right: 7px;
  top: 7px;
  height: 30px;
  line-height: 30px;
  border-radius: 8px;
}

.form-check a {
  color: var(--primary-colors);
  text-decoration: none;
  font-weight: 600;
}

.verification-box .form-control {
  text-align: center;
  font-weight: 600;
  font-size: 22px;
}

.login-head p span {
  font-weight: 600;
  color: var(--secondary-color);
}

.success-msg-box {
  height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.success-msg-icon {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: var(--secondary-color);
  box-shadow: 0px 10px 15px rgba(60, 194, 250, 0.28);
  margin: 0px auto;
  margin-bottom: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.success-msg-icon svg {
  stroke: #fff;
  width: 35px;
  height: 35px;
  stroke-width: 4px;
}

/*login*/
.dashboard-main {
  padding-top: 100px;
  display: flex;
  flex-wrap: wrap;
  min-height: calc(100vh - 75px);
  background: var(--gry);
  position: relative;
}

.dashboard-main .sidebar-nav {
  flex: 0 0 auto;
  width: 250px;
  border-right: 1px solid #E5E5E5;
  background: #fff;
}

.dashboard-main .dashboard-container {
  flex: 0 0 auto;
  width: calc(100% - 250px);
}

hr {
  border-color: #E5E5E5;
  opacity: 1;
}

.sidebar-nav ul {
  padding: 10px;
}

.sidebar-nav ul li {
  margin: 2px 0px;
}

.sidebar-nav ul li a {
  display: flex;
  padding: 10px 15px;
  border-radius: 6px;
  color: var(--black);
  text-decoration: none;
  font-weight: 500;
}

.sidebar-nav ul li a .icon-nav {
  width: 24px;
  margin-right: 15px;
}

.sidebar-nav hr {
  margin: 0px;
}

.sidebar-nav ul li a .icon-nav svg path {
  stroke: var(--black);
}

.sidebar-nav ul li:hover a {
  background: #eaeaea;
}

.sidebar-nav ul li.active a {
  background: var(--primary-colors);
  color: var(--white);
}

.sidebar-nav ul li.active .icon-nav svg path {
  stroke: var(--white);
}

.sidebar-nav ul li.active .icon-nav svg line {
  stroke: var(--white);
}

.sidebar-nav .logout-li li a {
  color: #F1194C;
}

.sidebar-nav .logout-li li .icon-nav svg path {
  stroke: #F1194C;
}

.btn-icon {
  height: 42px;
  width: 42px;
  min-width: 42px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  background: #F6F6F6;
}

.after-login-act .btn-icon {
  background: #F6F6F6;
}

.after-login-act .user-btn-header {
  display: inline-block;
}

.after-login-act .user-btn-header .btn {
  border: none;
  height: 42px;
  width: 42px;
  border-radius: 50%;
  padding: 0;
  overflow: hidden;
  background: var(--white);
  white-space: initial;
}

.after-login-act .user-btn-header .btn>img {
  object-fit: cover;
  object-position: center;
  width: 100%;
  height: 100%;
}

.profile-menu li a {
  display: flex;
  padding: 8px 25px;
  font-size: 14px;
  color: var(--black);
  font-weight: 500
}

.profile-menu li a svg path {
  stroke: var(--black);
}

.profile-menu li a .icon-nav {
  width: 24px;
  margin-right: 15px;
}

header .dropdown-menu[data-bs-popper] {
  left: auto;
  right: 0;
}

.dropdown-menu hr {
  margin: 5px 0px;
}

.profile-menu li:last-child a {
  color: #F1194C;
}

.profile-menu li:last-child a svg path {
  stroke: #F1194C;
}

.dashboard-head {
  background: var(--white);
  border-bottom: 1px solid #E5E5E5;
  display: flex;
  height: 60px;
  align-items: center;
  padding: 0px 30px;
}

.dashboard-head h4 {
  font-size: 22px;
  font-weight: 600;
}

.dashboard-container-in {
  padding: 20px 30px;
  padding-bottom: 80px;
}

.add-remove-box .plus-btn {
  max-width: 65px;
}

.add-remove-box .plus-btn a {
  background: var(--secondary-color) !important;
}

.add-remove-box .plus-btn a svg {
  stroke: var(--white);
}

.add-remove-box .plus-btn a.btn-line-remove {
  background: var(--white) !important;
  border: 1px solid var(--secondary-color);
}

.add-remove-box .plus-btn a.btn-line-remove svg {
  stroke: var(--secondary-color);
}

[type="radio"]:checked+label::before {
  top: -1px;
  width: 22px;
  height: 22px;
  border-width: 2px;
  border-color: var(--secondary-color);
}

[type="radio"]:not(:checked)+label::before {
  top: -1px;
  width: 22px;
  height: 22px;
  border-width: 2px;
}

[type="radio"]:not(:checked)+label::after {
  top: -1px;
  width: 10px;
  height: 10px;
  top: 6px;
  left: 6px;
}

[type="radio"]:checked+label::after {
  width: 10px;
  height: 10px;
  top: 5px;
  left: 6px;
}

[type="radio"]:checked+label::after {
  top: 5px;
  left: 6px;
}

.form-check-radio label {
  font-weight: 600;
  margin: 0;
}

.form-check-radio {
  padding-left: 0;
  margin-right: 30px;
}

.loan-form .form-control {
  font-weight: 600;
  color: var(--black);
}

[type="radio"]:not(:checked)+label,
[type="radio"]:checked+label {
  font-weight: 600;
  color: var(--black);
}

.budget-calculator-head h4,
.budget-calculator h4 {
  font-size: 22px;
  font-weight: 600;
}

.budget-calculator-head p {
  font-weight: 600;
}

.budget-calculator-head {
  margin-bottom: 20px;
}

.loan-form-head h4 {
  font-size: 18px;
  font-weight: 600;
}

.loan-form-head p {
  opacity: 0.7;
  color: var(--black);
}

.bid-user-search input {
  padding-left: 40px;
}

.bid-user-search .form-group {
  position: relative;
}

.bid-user-search .feather-search {
  position: absolute;
  top: 10px;
  left: 10px;
  opacity: 0.4;
}

.user-img {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  /* overflow: hidden; */
  min-width: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  font-weight: 600;
  background: #000;
}

.user-img a {
  text-decoration: none;
  color: #fff !important;
}

.user-img img {
  object-fit: cover;
  object-position: center;
  width: 100%;
  height: 100%;
}

.bid-user-list li {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}

.bid-user-list li .form-check {
  margin-left: auto;
}

.bid-send-info {
  display: flex;
  align-items: center;
}

.bid-send-info h4 {
  font-size: 16px;
  font-weight: 600;
  margin-left: 15px;
}

.bid-req-info-more h4 {
  font-size: 18px;
  font-weight: 600;
}

.bid-req-info-more time {
  opacity: 0.7;
}

.bid-req-box .bid-req-list {
  padding-bottom: 15px;
  margin-bottom: 15px;
  border-bottom: 1px solid #E5E5E5;
  align-items: center;
}

.bid-req-box .bid-req-list:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0px;
}

.bid-action .btn {
  min-width: 120px;
}

.no-result-found {
  min-height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.no-result-found h4 {
  font-size: 24px;
  font-weight: 700;
  margin-top: 30px;
}

.no-result-found p {
  opacity: 0.7;
  margin-bottom: 0;
}

.tabing-site .nav-link {
  font-size: 16px;
  color: #ADAABC;
  padding: 15px 30px;
  position: relative;
  border-radius: 0;
  font-weight: 600
}

.tabing-site .nav-link.active:after {
  content: "";
  height: 5px;
  background-color: var(--primary-colors);
  width: 100%;
  position: absolute;
  bottom: -3px;
  left: 0
}

.tabing-site {
  border-bottom: 1px solid #E0DDE5;
}

.tabing-site .nav-link.active {
  background: none;
  color: #1765BA;
}

.loan-user-info .loan-user-name h4 a {
  font-size: 18px;
  font-weight: 600;
  color: var(--black);
  text-decoration: none;
}

.amount-text {
  font-size: 18px;
  font-weight: 600;
  color: var(--primary-colors);
}

.interest-info {
  border-radius: 10px;
  background: #f9f9f9;
  border: 1px solid #e0dde5;
  display: flex;
  padding: 15px;
  margin-right: 15px;
}

.interest-info .interest-info-in {
  margin-right: 30px;
}

.interest-info .interest-info-in:last-child {
  margin-right: 0;
}

.interest-info .interest-info-in p {
  font-weight: 600;
}

.interest-info .interest-info-in span {
  opacity: 0.7;
}

.loan-box-info time {
  opacity: 0.7;
}

.loan-box .loan-box-row {
  padding-bottom: 15px;
  margin-bottom: 15px;
  border-bottom: 1px solid #E5E5E5;
}

.loan-box .loan-box-row:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0px;
}

.loan-user-name {
  width: 200px;
}

.btn-icon {
  position: relative;
}

.btn-icon span {
  position: absolute;
  top: 0;
  right: -10px;
  width: 22px;
  height: 22px;
  background: #f1194c;
  border-radius: 50%;
  color: var(--white);
  font-size: 11px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.notification-list .noti-bell-ic {
  background: var(--secondary-color);
}

.notification-list .noti-bell-ic path {
  stroke: var(--white);
}

.noti-msg h4 {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 5px;
}

.noti-msg time {
  opacity: 0.7;
}

.noti-delete .btn {
  padding: 0;
  opacity: 0.3;
  height: auto;
}

.noti-delete .btn:hover {
  opacity: 0.9;
}

.notification-list li {
  padding-bottom: 15px;
  margin-bottom: 15px;
  border-bottom: 1px solid #E5E5E5;
}

.notification-list li:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0px;
}

.card-sm {
  max-width: 600px;
  margin: auto;
}

.user-img-lg {
  width: 120px;
  height: 120px;
}

.input-button {
  position: relative;
  background: var(--white) !important;
  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.23) !important;
  margin-top: -22px !important;
}

.input-button input {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}

.number-verify {
  position: relative;
}

.number-verify .number-verify-btn {
  position: absolute;
  top: 37px;
  right: 15px;
  background: none;
  border: none;
  font-weight: 600;
  color: #F1194C;
}

.login-sg-btns a {
  display: inline-block;
  padding: 0px 15px
}

.form-switch .form-check-input {
  height: 35px;
  border-radius: 100px;
  width: 55px;
  border: none;
  background-color: #D4D4D4;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e") !important;
  box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.06);
  cursor: pointer;
}

.form-switch .form-check-input:checked {
  background-color: #35C759;
}

.offcanvas-header {
  border-bottom: 1px solid #E5E5E5;
  padding: 15px 30px;
}

.offcanvas-body {
  padding: 15px 30px;
}

.address-page>div {
  display: flex;
}

.address-page>div .card-shadow {
  width: 100%;
}

.btn-adds .btn {
  min-width: 100px;
}

.address-page .card-shadow .add-tag {
  text-transform: uppercase;
  font-weight: 600;
  font-size: 15px;
  margin-bottom: 15px;
  color: var(--primary-colors);
}

body.inner-pages .site-container-white {
  background: var(--white);
}

.inner-head {
  height: 180px;
  background: linear-gradient(90deg, rgba(235, 249, 255, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(235, 249, 255, 1) 100%);
  position: relative;
}

.inner-head h2 {
  text-align: center;
  font-size: 42px;
  font-weight: 700;
}

.inner-head .shape-left {
  position: absolute;
  top: 0;
  right: 0;
}

.inner-head .shape-right {
  position: absolute;
  bottom: 0;
  left: 0;
}

.cms-pages-wrap .blog-box {
  margin: 20px 0px;
}

.privacy-policy-text h4 {
  margin-bottom: 10px;
  font-size: 22px;
  font-weight: 600;
  margin-top: 30px;
}

.privacy-policy-text p {
  margin-bottom: 10px;
  opacity: 0.8;
}

textarea.form-control {
  height: 100px;
}

.form-box .social-icon a {
  border-radius: 50%;
  color: var(--black);
  background: var(--white);
  filter: drop-shadow(0px 1px 2px rgba(0, 0, 0, 0.19));
  margin: 0px 8px;
}

.blog-img {
  margin-bottom: 30px;
}

.blog-img img {
  width: 100%;
  border-radius: 20px;
}

.blog-content {
  max-width: 950px;
  margin: auto;
}

blockquote {
  background: #F6FCFF;
  padding: 30px;
  border-left: 10px solid #3CC2FA;
  font-size: 15px;
  margin: 20px 0px;
}

.blog-content h2 {
  font-size: 40px;
  font-weight: 600;
  margin-bottom: 10px;
}

.blog-content p {
  margin-bottom: 10px;
  opacity: 0.8;
}

.blog-content h4 {
  margin-bottom: 10px;
  font-size: 22px;
  font-weight: 600;
  margin-top: 30px;
}

.blog-li {
  margin-bottom: 20px;
  margin-top: 20px;
}

.blog-li li {
  padding-left: 35px;
  position: relative;
  margin-bottom: 10px;
  font-weight: 500;
  font-size: 16px;
}

.blog-li li:after {
  content: "";
  position: absolute;
  left: 0px;
  top: 0;
  border-radius: 50px;
  width: 20px;
  height: 20px;
  background: var(--primary-colors);
  border: 2px solid #fff;
  filter: drop-shadow(0px 3px 6px rgba(0, 0, 0, 0.16));
}

.blog-content time {
  opacity: 0.8;
}

.about-head img {
  border-radius: 20px;
}

.about-head h2 {
  font-size: 40px;
  font-weight: 600;
  margin-bottom: 10px;
}

.about-head p {
  font-size: 18px;
}

.about-sec-in p {
  font-size: 18px;
}

.download-the-app p {
  font-size: 18px;
}

.download-the-app {
  background: var(--black);
  color: var(--white);
}

.download-the-app .headings h2 {
  color: var(--white);
}

.download-the-app .headings p {
  color: var(--white);
}

.app-d-btn a {
  display: inline-block;
  width: 185px;
  margin-right: 10px;
}

.team-ui-box .user-img {
  width: 200px;
  height: 200px;
}

.team-ui-box .user-img img {
  position: relative;
  transition: all 0.3s ease;
}

.team-ui-box article:hover .user-img img {
  transform: scale(1.25);
  top: -23px;
}

.btn-border-primary {
  color: var(--primary-colors) !important;
  background: var(--white);
  border: 1px solid var(--primary-colors) !important;
}

.custom-list .list-group-item {
  font-size: 16px;
  border-top: none;
  padding: 10px 0px;
  border-left: none;
  border-right: none;
  border-radius: 0 !important;
}

.custom-list .list-group-item:last-child {
  border-bottom: none;
}

.wallet-box {
  background: url(../images/wallet.jpg) no-repeat;
  border-radius: 20px;
  position: relative;
  padding: 20px;
  color: var(--white);
  background-size: cover;
}

.wallet-box .btn {
  margin-top: 20px;
  background-color: rgba(255, 255, 255, 0.3);
  color: var(--white);
}

.wallet-box span {
  text-transform: uppercase;
  font-size: 16px;
  font-weight: 600;
}

.wallet-box h4 {
  font-size: 38px;
  font-weight: 600;
}

.amount-text-add {
  color: #4ECC70;
}

.tag-text {
  border-radius: 50px;
  padding: 2px 10px;
  ;
  color: var(--gry-text);
  border: 1px solid var(--gry-text);
  display: inline-block;
  background: #F4F9FC;
  font-size: 12px;
}

.shop-box .show-info h4 a {
  font-size: 18px;
  font-weight: 600;
  color: var(--black);
  text-decoration: none;
}

.shop-box .show-info h4 span {
  font-size: 14px;
  color: #ADAABC;
}

.ratings {
  display: flex;
}

.ratings span {
  color: #ADAABC;
  display: inline-block;
  margin-left: 10px;
}

.ratings i {
  color: #F5B026
}

.tag-new {
  border-color: #4890FC;
  color: #4890FC;
  background-color: #E1EDFF
}

.tag-pro {
  border-color: #37ECAF;
  color: #37ECAF;
  background-color: #DFFCF2
}

.tag-premium {
  border-color: #FC7948;
  color: #FC7948;
  background-color: #FFE9E1;
}

.location-info a {
  color: #ADAABC;
  text-decoration: none;
}

.location-info a:hover {
  color: var(--primary-colors);
}

.location-info a svg {
  color: #F54583
}

.bid-details {
  position: relative;
}

.bid-details .comment-ic {
  position: absolute;
  right: 0px;
  top: 0px;
}

.tabing-big ul {
  display: inline-flex;
  background: #fff;
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.16);
  border-radius: 15px;
  padding: 10px;
}

.tabing-big ul .nav-link {
  height: 42px;
  line-height: 12px;
  color: var(--gry-text);
  padding: 15px 30px;
  font-size: 16px;
}

.tabing-big ul .nav-link.active {
  background: var(--black);
}

.bid-details-in h4 {
  margin-bottom: 10px;
}

.bid-details-in h4 a {
  text-decoration: none;
  color: var(--black);
}

.cashuu-score-box {
  padding: 0;
}

.cashuu-score-box .tab-pane {
  padding: 30px;
}

header .container {
  max-width: 100%;
}

.store-info-tit {
  display: flex;
  margin-bottom: 10px;
}

.store-info-tit h4 {
  color: #1765BA;
  font-size: 16px;
  text-transform: uppercase;
}

.store-info .store-info-sec {
  padding: 15px 0px;
  border-bottom: 1px solid #DEE2EE;
}

.store-info .store-info-sec:last-child {
  padding-bottom: 0px;
  border-bottom: 0px;
}

.map-view {
  margin-top: 10px;
  border-radius: 20px;
  overflow: hidden;
}

.ratings-list .user-img {
  width: 45px;
  height: 45px;
  min-width: 45px;
}

.ratings-list li {
  margin-bottom: 20px;
}

.ratings-list li:last-child {
  margin-bottom: 0;
}

.ratings-info {
  display: flex;
  align-items: center;
}

.ratings-info h6 {
  color: #274250;
  font-size: 24px;
  font-weight: 600;
  margin-right: 10px;
}

.ratings-info-star {
  border-radius: 50px;
  background: #fff;
  box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.11);
  padding: 5px 15px;
}

.ratings-info-star i {
  font-size: 24px;
  color: #F5B026;
}

.tag-store {
  margin-top: -10px;
}


#rate-1:checked~.msg:before {
  content: "1.0";
}

#rate-2:checked~.msg:before {
  content: "2.0";
}

#rate-3:checked~.msg:before {
  content: "3.0";
}

#rate-4:checked~.msg:before {
  content: "4.0";
}

#rate-5:checked~.msg:before {
  content: "5.0";
}

.ratings-box [type="radio"]:checked+label::before,
.ratings-box [type="radio"]:not(:checked)+label::before {
  font-family: 'remixicon' !important;
  content: "\f186";
  position: static;
  width: 35px;
  height: 35px;
  display: inline-block;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 32px;
  border: none;
}

.ratings-box .msg {
  text-align: center;
  position: absolute;
  margin-top: 60px;
}

.ratings-box .msg:before {
  border-radius: 45px;
  background: #fff;
  box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.11);
  font-size: 26px;
  font-weight: 600;
  padding: 5px;
  width: 100px;
  display: block;
}

.ratings-box [type="radio"]:checked+label::before {
  color: #F5B026;
}

.ratings-box>input:checked~label {
  color: #F5B026;
}

.ratings-box {
  display: flex;
  flex-direction: row-reverse;
  justify-content: center;
}

.ratings-box [type="radio"]:checked+label::after {
  display: none;
}

.ratings-box [type="radio"]:checked+label,
.ratings-box [type="radio"]:not(:checked)+label {
  padding: 0 !important;
  margin: 0px 10px;
}

.star-widget {
  margin-top: 10px;
  margin-bottom: 75px;
}

.card-img {
  width: 100px;
  margin-bottom: 15px;
}

.card-img img {
  height: 55px;
}

.address-page h6 {
  font-size: 20px;
}

select.form-control {
  background-image: url("data:image/svg+xml,%3Csvg id='chevron-down' xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Crect id='chevron-down-2' data-name='chevron-down' width='24' height='24' fill='none'/%3E%3Cpath id='Icon' d='M12,0,6,6,0,0' transform='translate(6 9)' fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-repeat: no-repeat;
  background-position-x: right 10px;
  background-position-y: center;
  padding-right: 40px;
}

.comment-container {
  max-width: 850px;
  margin: auto;
  padding: 20px 0px;
  position: relative;
  z-index: 1;
}

.comment-container-in {
  background: #fff;
  height: calc(100vh - 110px);
  display: flex;
  flex-direction: column;
  border-radius: 15px;
}

.comment-area {
  display: flex;
  width: 65%;
}

.comment-area .avatar {
  width: 40px;
  height: 40px;
  min-width: 40px;
  border-radius: 50%;
  overflow: hidden;
}

.comment-area .avatar img {
  object-fit: cover;
  object-position: center;
  width: 100%;
  height: 100%;
}

.comment-text span {
  display: inline-block;
  padding: 5px 15px;
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.25);
  border-radius: 20px;
}

.comment-text {
  margin-top: 5px;
  margin-left: 10px;
}

.my-comment .comment-area {
  margin-left: auto;
  flex-direction: row-reverse;
}

.my-comment .comment-text {
  margin-left: 0;
  margin-right: 10px;
}

.comment-header {
  padding: 10px;
  border-bottom: 1px solid #E5E5E5;
}

.comment-type {
  padding: 10px;
  border-top: 1px solid #E5E5E5;
}

.comment-list {
  height: 100%;
  padding: 15px;
  overflow: auto;
  position: relative;
  display: flex;
  flex-direction: column;
}

.comment-list .comment-action-btns {
  padding: 10px;
  background: white;
  margin-bottom: -15px;
}

.comment-list-in ul li {
  margin-bottom: 10px;
}

.offer-box {
  background: #274250;
  color: #fff;
  min-width: 190px;
  padding: 15px;
  margin-right: 10px;
  border-radius: 10px;
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.25);
}

.offer-box span {
  font-size: 14px;
  text-transform: uppercase;
  display: block;
  margin-bottom: 10px;
  font-weight: 500;
}

.offer-box h4 {
  font-size: 32px;
  font-weight: 600;
}

.user-comment .offer-box {
  margin-left: 10px;
  margin-right: 0;
  background-color: #fff;
  color: #274250;
}

.my-comment .comment-text span {
  background: #f0f0f0;
}

.comment-list-in {
  height: 100%;
  overflow: auto;
}

.comment-type .btn-icon {
  background: #274250;
  color: #fff;
}

.comment-action-btns .btn {
  border: 1px solid var(--primary-colors);
  color: var(--primary-colors);
  width: 100%;
}

.modal-plan .modal-content {
  background: linear-gradient(180deg, rgba(245, 69, 131, 1) 0%, rgba(212, 13, 83, 1) 100%);
  border-radius: 20px;
}

.modal-plan .modal-content .modal-plan-head {
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(245, 69, 131, 1) 0%, rgba(212, 13, 83, 1) 100%);
  padding: 15px;
  color: var(--white);
}

.modal-plan .btn-close {
  position: absolute;
  right: 0;
  top: -45px;
  width: 30px;
  height: 30px;
  background-color: #fff;
  opacity: 1;
  border-radius: 50px;
}

.modal-plan-feature,
.plan-btns {
  padding: 15px;
}

ul.plan-li li {
  position: relative;
  padding-left: 20px;
  color: var(--white);
}

ul.plan-li li:after {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50px;
  background: var(--white);
  position: absolute;
  left: 0;
  top: 8px;
}

.modal-plan-head h3 {
  background: var(--white);
  color: var(--primary-colors);
  display: inline-block;
  border-radius: 10px;
  padding: 10px 15px;
  font-size: 16px;
  margin-bottom: 10px;
}

.skip-btn {
  display: inline-block;
  color: #fff;
}

.active-paln {
  border: 1px solid #E5E5E5;
  border-radius: 10px;
  padding: 15px;
  position: relative;
}

.active-paln ul.plan-li li {
  color: var(--black);
}

.active-paln ul.plan-li li:after {
  background: var(--secondary-color);
}

.tag-free {
  position: absolute;
  right: 15px;
  top: 15px;
  font-weight: 600;
  border: 2px solid var(--primary-colors);
  color: var(--primary-colors);
  font-size: 14px;
  padding: 7px 10px;
  min-width: 80px;
  text-align: center;
  border-radius: 30px;
}

.active-paln h4 {
  font-size: 16px;
  color: var(--black);
}

.active-paln h5 {
  font-size: 22px;
  color: var(--black);
  font-weight: 700;
  margin-bottom: 10px;
}

.more-paln {
  background: linear-gradient(180deg, rgba(245, 69, 131, 1) 0%, rgba(212, 13, 83, 1) 100%);
  border-radius: 10px;
  padding: 15px;
  position: relative;
}

.more-paln h5 {
  background: var(--white);
  color: var(--primary-colors);
  border-radius: 30px;
  display: inline-flex;
  position: absolute;
  right: 15px;
  top: 15px;
  padding: 7px 15px;
}

.more-paln h4 {
  font-size: 24px;
  color: var(--white);
  font-weight: 700;
}

.mobile-number-box .input-group {
  position: relative;
}

.mobile-number-box .country-code {
  position: absolute;
  left: 52px;
  top: 12px;
  background: none;
  border: none;
  z-index: 9;
  background: url(../images/arrow01.svg) no-repeat right center;
  padding-right: 20px;
}

.mobile-number-box .form-control {
  padding-left: 120px;
  outline: none;
  box-shadow: none;
}

.otp-box {
  padding: 0px 85px;
}

.two-button-box {
  display: flex;
  align-items: center;
  justify-content: center;
}

.two-button-box button {
  margin-right: 10px;
}

.two-button-box button:last-child {
  margin-right: 0;
}

.card-box svg {
  fill: #1e333e;
}

.card-top-des {
  display: flex;
  align-items: center;
}

.card-top-des figcaption {
  flex: 1;
  padding-left: 15px;
}

.card-top-des .card-img {
  width: auto;
  margin: 0;
}

.card-top-des figcaption p {
  color: #198754;
}

.min-max-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.min-max-box span {
  color: var(--black);
  font-size: 14px;
}

i.toggle-password {
  color: #adaabb;
}

.btn:disabled {
  opacity: 1;
  background-color: #b8b8b8 !important;
}

#emi-data {
  padding: 15px;
}

#emi-data .row.py-2 {
  border: solid 1px #ccc;
  margin-bottom: 10px;
}

#emi-data .row.py-2:last-child {
  margin-bottom: 0;
}

.headings p {
  font-size: 18px;
  color: #274250;
  font-weight: 500;
  line-height: 26px;
}


.get-started {
  background: url(/media/homepage-body/get-started-banner.png);
  border-radius: 30px;
  height: 437px;
  display: flex;
  align-items: center;
  position: relative;
  margin: 0 60px 130px;
  background-repeat: no-repeat;
  background-size: cover;
}

.get-started:after {
  background: rgb(0 0 0 / 23%);
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  content: "";
  border-radius: 30px;
}

.get-started-content .headings {
  z-index: 99;
  position: relative;
}

section.works-banner {
  position: relative;
  padding-top: 80px;
  text-align: center;
}

section.works-banner:after {
  position: absolute;
  content: "";
  width: 100%;
  right: 0;
  top: 0;
  height: 100%;
  background: linear-gradient(-90deg, #3cc2fa 0%, #fff 100%);
  opacity: 0.3;

}

section.works-banner .headings {
  z-index: 9;
  position: relative;
}


ul.step-process-list>li {
  display: flex;
  justify-content: space-between;
  background: #FBFBFB;
  border-radius: 20px;
  border: 1px solid #E8E8E8;
  padding: 45px 45px;
  margin-bottom: 20px;
}

.step-process-content-left h5 {
  font-size: 16px;
  color: #3CC2FA;
  font-weight: 700;
  padding-bottom: 10px;
  text-transform: uppercase;
}

.step-process-content-left h1 {
  font-size: 30px;
  color: #274250;
  font-weight: 700;
}

ul.step-inner-process li h5 {
  font-size: 14px;
  color: #F54583;
  font-weight: bold;
  padding-bottom: 3px;
}

ul.step-inner-process li:last-child {
  padding-bottom: 0px;
}

ul.step-inner-process li {
  padding-bottom: 15px;
  position: relative;
}

ul.step-inner-process li:after {
  border: 2px solid #F54583;
  position: absolute;
  left: -15px;
  top: 5px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  content: "";
}

ul.step-process-list {
  width: 70%;
  margin: auto;
}

.step-process-content-left {
  width: 35%;
}

.step-process-content-right {
  flex: 1;
  padding-left: 135px;
}

.in-select .form-control {
  padding-left: 15px;
  border-radius: 10px !important;
  background-position: right 8px center;
}

.radio-filters.d-flex {
  height: 45px;
  border: 1px solid #ced4da;
  border-radius: 10px;
  align-items: center;
  padding: 10px 19px;
}

.category-filter .input-group {
  width: 165px;
}

.sidebar-menu {
  width: 45px;
  border: none;
  padding: 8px;
  background: var(--primary-colors);
  color: var(--white);
  position: absolute;
  left: 250px;
  top: 160px;
}

.sidebar-menu svg {
  fill: var(--white);
}

.interest-info {
  margin-right: 0;
  margin-bottom: 10px;
}

div#bid-group-head .interest-info {
  margin-bottom: 0;
  margin-left: 5px;
}

div#bid-group-head {
  height: 90px;
}

#bid-group-container-in {
  padding-top: 105px !important;
}

.card-shadow-in .interest-info {
  margin-right: 10px;
}

.download-app-button {
  position: fixed;
  bottom: 30px;
  right: 30px;
  z-index: 99;
}

.download-app-button a {
  display: block;
  max-width: 250px;
}



.tabs-top .nav-item .nav-link {
  color: #274250;
  font-size: 14px;
  font-weight: 600;
  min-width: 140px;
  border-radius: 6px;
  margin-bottom: 0;
  border: 0
}

.tabs-top {
  background: #e0dde5;
  border-radius: 6px;
  padding: 3px 3px;
  --bs-nav-tabs-border-width: 0
}

.tabs-top li.nav-item {
  --bs-nav-tabs-border-width: 0;
  border-bottom: 0
}

.search-box {
  position: relative;
  width: 432px
}

.search-box .btn {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  font-size: 19px;
  color: #274250
}

.search-box input.form-control {
  padding-left: 48px;
  background: #f3f3f3;
  border-radius: 7px;
  border: 0
}

.how-works-body {
  padding-top: 100px;
  padding-bottom: 100px
}

.top-works-head {
  padding-bottom: 25px;
  border-bottom: 1px solid #e0dde5;
  margin-bottom: 35px
}

.sub-tabs .nav-tabs .nav-link {
  background: #f3f3f3;
  font-weight: 600;
  border-radius: 6px;
  border: 0;
  color: #274250;
  height: 40px;
  padding: 10px 25px
}

.sub-tabs .nav-tabs .nav-link {
  margin-right: 10px
}

.sub-tabs .nav-tabs .nav-link.active {
  background: #f1194c;
  color: #fff
}

.sub-tabs .nav-tabs {
  border: 0;
  margin: 0
}

.how-works-body {
  padding-top: 100px;
  padding-bottom: 100px
}

.top-works-head {
  padding-bottom: 25px;
  border-bottom: 1px solid #e0dde5;
  margin-bottom: 35px
}

.sub-tabs .nav-tabs .nav-link {
  background: #f3f3f3;
  font-weight: 600;
  border-radius: 6px;
  border: 0;
  color: #274250;
  height: 40px;
  padding: 10px 25px
}

.sub-tabs .nav-tabs .nav-link {
  margin-right: 10px
}

.sub-tabs .nav-tabs .nav-link.active {
  background: #f1194c;
  color: #fff
}

.sub-tabs .nav-tabs {
  border: 0;
  margin: 0
}

.wrapper-video {
  position: relative;
  width: 100%;
  overflow: hidden;
  height: 243px;
  border-radius: 10px;
  border: 1px solid #e0dde5
}

.wrapper-video:after {
  background: rgb(0 0 0 / 20%);
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  content: ""
}

.wrapper-video img {
  height: 100%;
  width: 100%
}

.wrapper-video iframe {
  display: none;
  z-index: 1;
  position: relative;
  width: 100%;
  height: 100%
}

.wrapper-video .play-btn {
  position: absolute;
  z-index: 666;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: transparent;
  border: 0
}

.wrapper-video .play-btn:hover {
  cursor: pointer
}

.wrapper-video .play-btn:focus {
  outline: 0
}

.play-btn:after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: block;
  width: 59px;
  height: 59px;
  background: rgb(13 13 13 / 60%);
  border-radius: 50%;
  transition: all .2s
}

.play-btn {
  position: absolute;
  z-index: 10;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  box-sizing: content-box;
  display: block;
  width: 32px;
  height: 44px;
  border-radius: 50%;
  padding: 18px 20px 18px 28px
}

.play-btn span {
  display: flex;
  position: relative;
  z-index: 3;
  width: 0;
  height: 0;
  border-left: 28px solid #fff;
  border-top: 18px solid transparent;
  border-bottom: 18px solid transparent;
  align-items: center;
  justify-content: center
}

.video-content-box figcaption {
  padding-top: 15px
}

.video-content-box figcaption h4 {
  font-size: 16px;
  color: #274250;
  font-weight: 600;
  padding-bottom: 6px
}

.video-content-box figcaption p {
  font-size: 14px;
  color: #908c97
}

.rows-box .col-md-4 {
  margin-bottom: 35px
}

.search-box input.form-control:focus {
  box-shadow: none;
}


.tabs-box-sec {
  z-index: 9;
  position: relative;
  width: auto;
  margin: auto;
  margin-bottom: 35px;
  padding: 4px 5px;
  display: inline-flex;
}

.tabs-top.tabs-box-sec .nav-item .nav-link.active {
  background: #f54583;
  color: #fff;
}

.tabs-top.tabs-box-sec .nav-item .nav-link {
  color: rgb(39 66 80 / 54%);
  height: 42px;
}