@font-face {
  font-family: 'Gotham';
  src: url('fonts/gotham/Gotham-Bold.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Gotham';
  src: url('fonts/gotham/Gotham-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Gotham';
  src: url('fonts/gotham/Gotham-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Gotham';
  src: url('fonts/gotham/Gotham-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/********** Template CSS **********/
:root {
  --primary: #797CFF;
  --secondary: #999999;
  --light: #F2F8FE;
  --dark: #111111;
  --font-family: 'Rajdhani', sans-serif;  
}

.back-to-top {
  position: fixed;
  display: none;
  right: 30px;
  bottom: 60px;
  z-index: 99;
}

/*** Spinner ***/
#spinner {
  opacity: 0;
  visibility: hidden;
  transition: opacity .5s ease-out, visibility 0s linear .5s;
  z-index: 99999;
}

#spinner.show {
  transition: opacity .5s ease-out, visibility 0s linear 0s;
  visibility: visible;
  opacity: 1;
}

/*** Navbar ***/
.navbar.sticky-top {
  top: -100px;
  transition: .5s;
  box-shadow: 0 0 10px #f3f3f3;
  background-color: #797cff !important;
}

.navbar .navbar-brand {
  height: 75px;
}
.navbar-collapse{justify-content: center;}

.navbar .navbar-nav .nav-link {
  margin-right: 20px;
  padding: 25px 0;
  color: white;
  font-weight: 600;
  outline: none;
  font-family: rajdhani;
}
.navbar .dropdown-toggle::after {
  border: none;
  content: "\f107";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  vertical-align: middle;
  margin-left: 8px;
}

@media (max-width: 991.98px) {
  .navbar .navbar-nav .nav-link  {
      margin-right: 0;
      padding: 10px 0;
  }

  .navbar .navbar-nav {
      border-top: 1px solid #EEEEEE;
  }
}

@media (min-width: 992px) {
  .navbar .nav-item .dropdown-menu {
      display: block;
      border: none;
      margin-top: 0;
      top: 102%;
      right:-50px;
      opacity: 0;
      visibility: hidden;
      transition: .5s;
  }

  .navbar .nav-item:hover .dropdown-menu {
      top: 100%;
      visibility: visible;
      transition: .5s;
      opacity: 1;
      margin-right: 20px;
  }
}
.dropdown-menu[data-bs-popper] {
    top: 100%;
    left: auto !important;
    margin-top: 0.125rem;
}

.navbar .btn:hover {
  color: #FFFFFF !important;
  background: var(--primary) !important;
}

/*** FAQs ***/
.accordion .accordion-item {
  border: none;
  margin-bottom: 15px;
}

.accordion .accordion-button {
  background: var(--light);
  border-radius: 2px;
}

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

.accordion .accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

.accordion .accordion-body {
  padding: 15px 0 0 0;
}

label {font-weight: bold; color: #000;}
.form-control, .form-select, .table-striped>tbody>tr:nth-of-type(odd),
.table td {color: #000!important;}
/* .table tr td{width: 200px;} */
.nav-tabs .nav-link{font-weight: bold; }
.nav-tabs{border-bottom: none !important;}
.input-group-text {
  font-weight: 600;
  color: #fff;
  background-color: #797cff;
  border: 1px solid #5d60f4;
  padding: 0px 25px 0px 25px;
  /* border-radius: 20px 20px 20px 20px; */
}
.table-striped>tbody>tr>td{background-color: white !important;
}
.table-striped>tbody>tr:nth-of-type(odd){
    --bs-table-accent-bg: var(white !important);
}
 /* Dashboard css Card css*/

 .welcome-box{background: none;}
 .dash-card img{
  width: 70px;
  height: 70px;
 }
 .dash-card {
     padding:33px 40px  33px  40px;
     border-radius: 16px !important;
     margin-bottom: 5px;
 }
 .dash-card h6 a{
     font-size:20px;
     color: #000;
 }
 .dboard-btn-f{
  height: 50px;
  width: 295px;
  border-radius: 100px;
  padding: 12px 19px 12px 12px;
  font-size: 16px;
  font-weight: 600;
  font-family: 'Roboto', sans-serif;
  color: white;
}
.cards-dashboard{
  margin-top: 5px;
}
.price-h{
  color: #28B446;
  size: 28px;
  font-weight: 700;
  font-family: 'Roboto';
}
.c-icon-box img{
  height:20px;
  width: 20px;
 }
 .edit-property-boxes ul li{
  background-color: transparent !important;
  border-radius: 12px;
  border:1px solid #494BBB !important;
  font-size: 8px;
  font-family: 'Roboto', sans-serif !important;
  line-height: 1 !important;
 }
 .edit-property-boxes a{
  padding-bottom: 5px;
 }
 .percent-rate{color:#28B446;}

 .form-control-search{
  margin-left: 0px;
  font-size: 14px;
  margin-top: 28px;

}
.form-control-search a{
  color: #797cff !important;
  font-weight: 600 !important;
}

.opprtunity-detail{margin-top: 10px;}
/* tr:nth-child(even) {background-color: #e4e5ff;} */
.my-loan-table{margin-bottom: 0px;}
.alert-property-boxes ul li{
  border-radius: 30px;
  background-color: transparent !important;
  border:1px solid #6566ab !important;
  font-size: 13px;
  font-family: 'Roboto', sans-serif !important;
  text-align: center;
  display: flex;
}
.alert-property-boxes ul{line-height: 1; gap: 5px; display: flex;}
.input-money-format{
  margin: 0px;
}
.nav-search a{
  border: hidden;
  background-color:white;
  color: black;
  padding: 8px 15px;
  text-decoration: none;
  border-radius: 30px;
}
.diagram-coin img{margin-right: 4px;}
.price-f{font-size: 23px;}
.property-mortage-fields{border-radius: 30px;}
.property-home-icon{
  border-top-left-radius: 30px;
  border-bottom-left-radius: 30px;
}
.current-icon-radious{
  border-top-right-radius: 30px;
  border-bottom-right-radius: 30px;
}
.edit-property-buttons button{
  float: right;
  margin-top: 15px;
  border-radius: 30px;
  margin-bottom: 10px;
}
.edit-mortage{padding-top: 4px;}
.edit-mortage-box{padding-top: 13px;}
.edit-property-buttons .remove{
  margin-right: 26px;
  padding: 12px 50px 12px 50px;
}
.edit-property-buttons .update{
  margin-right: 26px;
  padding: 12px 80px 12px 80px
}
.main-container-a {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}
.a-form {
  background-color: #ffffff;
  padding: 50px;
  border-radius: 16px;
  box-shadow: 0px 4px 30px 0px #8284d626;
  width: 40% !important;
}
.notification-icon{
  margin-top: 20px;
  margin-left: 20px;
  font-size: 22px;
  color: white;
}
.opportunity-table thead .table-primary{border-style:hidden;}
.table-primary{border-style:hidden;}
.card-header{background-color: #DEDEFF;}
.card{box-shadow:  0px 4px 30px 0px #8284D626;}
.name-icon{
  margin-left: 15px;
  margin-top: 23px;
  height: 28px;
  width: 30px;
  border-radius: 50%;
  background-color: white;
  text-align: center;
  font-size: 16px;
}
.dropdown-icon{margin-left: 10px;}
.owner-expence{font-weight: 400;}
.label-f {
  font-size: 16px;
  font-weight: 500;
  font-family: "Roboto", sans-serif !important;
}
.input-end {
  height: 45px !important;
  border-radius: 0px 20px 20px 0px !important;
  padding: 1.3rem 1.3rem !important;
  background-color: #797cff !important;
  color: white !important;
  border: 1px solid #ced4da !important;
}




/* newwwwwww cssssssss */

.input-end{
  border-color: #797CFF !important;
}
.input-a{
  padding: 0px 20px !important;
  border-color:  #797CFF !important;
  background-color: white !important;
  margin: 0 !important;
  color: #797CFF !important;
}
.week{
  padding-left: 9px !important;
}
.main-a-pading{
  padding: 20px 30px !important;
}
.m-calculator{
  box-shadow: 0px 4px 30px 0px #8284D626;
  border-radius: 16px;
  padding: 10px !important;
}
.input-mon {
  height: 45px !important;
  border-radius: 20px 0 0 20px !important;
  padding: 1.3rem 1.1rem !important;
  background-color: #797cff !important;
  color: white !important;
  border: 1px solid #ced4da !important;
}
.m-payment {
  background-color: #DEDEFF !important;
  padding: 25px !important;
  box-shadow: 0px 4px 30px 0px #8284D626;
  border-radius: 16px;
}
.t-money {
  background-color: white;
  padding: 17px 15px !important;
}

.text-center .f-font{
  font-size: 11px !important;
  font-family: Roboto;

font-weight: 800;
line-height: 26px;
letter-spacing: 0em;
text-align: center;

}

.a-border{
  border: none !important;
padding-bottom: 20px !important;
margin: 0px 0px 10px 0px !important;
}
.total-month{
  padding: 0px 0px 0px 22px !important;
}

.n-border{
  border-bottom: 1px solid white !important;
  padding-bottom: 20px;
margin: 0px 0px 10px 0px !important;
}


.text-end{
  font-family: Rajdhani;
font-size: 24px;
font-weight: 600;
line-height: 46px;
/* letter-spacing: 0em; */
/* text-align: right; */
color: #494BBB;
}

.letter-m{
  font-family: Roboto;
font-size: 16px;
font-weight: 400;
line-height: 28px;
letter-spacing: 0em;
text-align: left;

}

.text-h{
  font-family: Roboto;
font-size: 15px;
font-weight: 400;
line-height: 28px;
letter-spacing: 0em;
text-align: left;
}
.text-n{
  font-family: Rajdhani;
font-size: 18px;
font-weight: 600;
line-height: 35px;
letter-spacing: 0em;
text-align: center;
display: flex;
flex-direction: column;
align-items: center;
}
.p-box2{
  background-color:white !important ;
  box-shadow: 0px 4px 30px 0px #8284D626;
}
.m-box2{
  background-color: #F4F4FF;
}
.ext-heading{
  font-family: Rajdhani;
font-size: 24px;
font-weight: 600;
line-height: 34px;
letter-spacing: 0em;
}


/* circular progress bar css */

@keyframes growProgressBar {
  0%, 33% { --pgPercentage: 0; }
  100% { --pgPercentage: var(--value); }
}

@property --pgPercentage {
  syntax: '<number>';
  inherits: false;
  initial-value: 0;
}

div[role="progressbar"] {
  --size: 4rem;
  --fg: #797cff;
  --bg: #def;
  --pgPercentage: var(--value);
  animation: growProgressBar 3s 1 forwards;
  width: var(--size);
  height: var(--size);
  border-radius: 50%;
  display: grid;
  place-items: center;
  background:
    radial-gradient(closest-side, white 80%, transparent 0 99.9%, white 0),
    conic-gradient(var(--fg) calc(var(--pgPercentage) * 1%), var(--bg) 0)
    ;
    font-family: Rajdhani;
  /* font-size: calc(var(22px) / 5); */
  font-size: 12px;
  color: var(black);
}

div[role="progressbar"]::before {
  counter-reset: percentage var(--value);
  content: counter(percentage) '%';
}

.form-st {
  height: 45px !important;
  border-radius: 100px !important;
  padding-left: 20px !important;
  background-color: #ffffff !important;
}
.form-st-g {
  height: 45px !important;
  border-radius: 0 100px 100px 0 !important;
  padding-left: 20px !important;
}
.form-st-g-h {
  height: 45px !important;
  border-radius: 100px 0px 0px 100px !important;
  padding-left: 20px !important;
}

.input-dec {
  height: 45px !important;
  border-radius: 20px 0 0 20px !important;
  padding: 1.3rem 1.5rem !important;
  background-color: #797cff !important;
  color: white !important;
  border: 1px solid #ced4da !important;
}
.input-end {
  height: 45px !important;
  border-radius: 0px 20px 20px 0px !important;
  padding: 1.3rem 1.3rem !important;
  background-color: #797cff !important;
  color: white !important;
  border: 1px solid #ced4da !important;
}

::placeholder {
  font-size: 14px !important;
  color: black !important;
  font-size: 16px;
  font-weight: 400;
  font-family: "Roboto", sans-serif !important;
}

.table-data{font-size: 13px; text-align: center;}
.table-data td{padding: 12px;}
.my-loan-table thead{
  border-style: hidden !important;
}



.update-btn{
  border-radius: 100px !important;
  padding: 12px 50px 12px 50px !important;
  width: 40%;
}
#progressbar{padding: 0px !important;}

.edit-loan-button{
  float: right;
  width: 100px;
}
.btn.btn-primary{
  border-radius: 25px;
  font-size: 15px;
}


/* Home blade CSS start here */

.box1-page-h h1{
  font-family: Rajdhani;
font-size: 55px;
font-weight: 600;
/* line-height: 88px; */
letter-spacing: 0em;
}
.l-box1-btn{
  width: auto !important;
  padding: 12px 60px 12px 60px;
  color: white;
  background-color: #797CFF;
  border-radius: 40px;
  text-decoration: none;
  margin-top: 20px;
}
.l-box1-btn:hover{
    color: white !important;
}
.l-box1-btn button{margin-top: 20px; color: white;}
.f-img{
  align-items: center;
  justify-content: center;
  display: flex;
}

.f-contnt h1{
  font-family: Rajdhani;
  font-size: 54px;
  font-weight: 600;
  letter-spacing: 0em;
}
.f-contnt p{
  font-family: Roboto;
  font-size: 20px;
  line-height: 30px;
  letter-spacing: 0em;
  text-align: left;
}
.f-contnt{
  padding:40px 0px 40px 0px;
}

.l-card{
  border: 1px solid #DCDFF4;
  background: linear-gradient(0deg, #FFFFFF, #FFFFFF),
  linear-gradient(0deg, #DCDFF4, #DCDFF4);
  box-shadow: 0px 4px 30px 0px #8284D626;
box-shadow: 0px 2px 0px 0px #494BBB;
/* width: auto !important;  */
height: 120px;
  padding: 24px 16px 24px 16px;
  border-radius: 8px;
  border: 1px;
  /* gap: 18px; */
  /* margin-right: 16px; */
}
.l-owner{
  /* background-image: url('/images/bg.png');
  background-size: cover;
  background-repeat: no-repeat; */
  background-color: #F0F4FF !important;
}
.c-hed1{
  width: fit-content;
  transform: rotate(270deg);
  color: #FEC908;
  font-family: Roboto;
font-size: 24px;
font-weight: 600;
line-height: 34px;
letter-spacing: 0em;
text-align: left;
}
.c-hed2{
  width: fit-content;
  transform: rotate(270deg);
  color: #494BBB;
  font-family: Roboto;
font-size: 24px;
font-weight: 600;
line-height: 34px;
letter-spacing: 0em;
text-align: left;
}
.c-hed3{
  width: fit-content;
  transform: rotate(270deg);
  color: #28B446;
  font-family: Roboto;
font-size: 24px;
font-weight: 600;
line-height: 34px;
letter-spacing: 0em;
text-align: left;
}
.c-para{
  font-size: 15px !important;
}
.card-main p{
  font-family: Roboto;
font-size: 16px;
font-weight: 500;
line-height: 26px;
letter-spacing: -0.015em;
text-align: left;
}
.owner-content h3{
  font-family: Roboto;
font-size: 24px;
font-weight: 600;
line-height: 34px;
letter-spacing: 0em;
text-align: left;
}
.img-strt{
  margin: 0 !important;
}
.m-end{
  justify-content: end !important;
  display: flex;
  padding: 50px 0px !important;
  background-color: #797CFF;
  border-radius: 80px 0px 0px 80px;
}
.form-box{
  width: 100% !important;
  height: auto !important;
  display: block !important;
}
.e-form{
  padding: 20px;
}
.form-box{
  box-shadow: 0px 4px 30px 0px #8284D626;
  padding: 20px 30px 20px 30px;
}
.last-h{
  font-family: Rajdhani;
font-size: 53px;
font-weight: 700;
line-height: 64px;
letter-spacing: 0em;
text-align: left;
font-family: Rajdhani;
font-size: 53px;
font-weight: 600;
line-height: 64px;
letter-spacing: 0em;
text-align: left;
}
::placeholder{
  color:#999999 !important;
}

.box1-c{margin-left: 95px; margin-top: 169px; margin-bottom: 15px;}

@media only screen and (max-width: 768px){
  .box1-c{margin-left: 0px !important;}
  .img-strt{width: 300px;}
  .footer-new{display: block !important;}
  .alert-property-boxes ul{display: block !important;}
  .px-4{padding-left: 0px !important;}
  .alert-property-boxes ul li{margin-bottom: 10px; width: 203px;}
  .tags{display: block !important;}
  .tags li{margin-bottom: 10px !important; width: 134px;}
  video{top: 0px !important;}
  .f-contnt h1{font-size: 25px;}
  .last-h{font-size: 25px !important; line-height: 1.2;}
  .box1-page-h h1{font-size: 25px !important;}
  .width-phone-tab{width: 50% !important;}
  .l-logo{margin-top: -37px !important;}
  .form-box{padding: 1px 10px 2px 10px;}
  .thanks-note{font-size: 17px !important;}
  .box-1{margin-top: -80px !important;}
  .modal-content{width: fit-content !important;}
  .modal-open .modal{overflow-x: auto !important;}
  .back-to-top{right: 4px; bottom: 72px;}
  .l-logo .logo{margin-top: 6px !important; margin-left: 14px;}
  .logo{margin-left: 15px !important;}
  .l-owner{padding-bottom: 30px !important;}
  .e-form{margin-bottom: 20px;}
  .m-end{margin-top: 15px !important;}
  .sign-up{padding:12px 40px 12px 40px !important;}
  .login{padding: 12px 30px 12px 30px !important;}

}
.small-image{
  position: absolute; top: 187px !important; left: -73px !important;
}

.footer-new{
  display: flex;
  justify-content: space-between;
}
.footer{
  background-color: #797CFF !important;
}
.homepage-paragraph p{font-family: roboto; font-size: 20px;}
.homepage-paragraph{margin-top: 15px !important;}
.request-demo-button{
  margin-top: 35px;
    margin-left: 84px;
}
.request-demo-button2{
  margin-top: 35px !important;
}
.loan-capm-video{
    width: 400px;
    height: 400px;
    margin-left: 50px;
}
.star{color: red; margin-left: 4px;}
.thanks-note{
  font-family: Rajdhani !important;
  font-size: 26px;
  font-weight: 600;
  line-height: 36px;
  letter-spacing: 0em;
  text-align: left;
}
.footer-links a{padding-right: 15px;}
.sign-up{
  margin-left: 10px;
  padding:12px 40px 12px 40px !important;
}
.login{
  margin-left: 10px;
  padding: 12px 30px 12px 30px !important;
}
.navbar-light{
display: flex !important;
justify-content: space-between !important;
}
.logo{
  margin-left: 177px;
}
.new-navbar{
  background-color: none !important;
}
.alert-table-content{
  padding-left: 7px;
  font-size: 16px;
  text-align: justify;
  font-weight: 100;
  line-height: 1.5;
}
.bi-geo-alt{
  color: #797CFF;
}
.add-property-form{
  border-radius: 30px;
}
.insurance{
  border-top-left-radius: 30px;
  border-bottom-left-radius: 30px;
}
.balances{
  border-top-right-radius: 30px;
  border-bottom-right-radius: 30px;
}
.text-style{
  color: black;
}
.modal-header{
  background-color: white !important;
}
.edit-loan-info{
  padding:6px 25px 2px 25px;
}
.alert_badge{
  border-radius: 200px !important;
  width: 17px !important;
  font-size: 13px !important;
}
.contact-officer{
  padding: 6px 20px 6px 20px;
}
.name{
  margin-bottom:0px;
}
.info-officer{
  padding: 25px;
}
.footer-position{
  min-height: 81vh;
}
.show_modal{cursor: pointer;}

.error-color{color: red;}
.datepicker table tr td span{
  width: 31% !important;
}
#calmortgage input.leadpops-btn-calculate{
  border-radius: 20px !important;
}
#show_payments{
    border-radius: 20px !important;
}
.get-rate{
  height: 100vh;
}
.dash-cards{
  width: 275px !important;
}
@media only screen and (max-width: 768px){
  .main-box{
    flex-wrap: wrap;
  }
  .dashboard-cards{
      margin: auto !important;
  }
  .contact-button{
    text-align: center !important;
  }
  .dboard-btn-f{
    width: 220px !important;
    padding: 12px 19px 12px 19px !important;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {
  .main-box{
    flex-wrap: wrap !important;
    justify-content: left !important;
  }
  .dashboard-cards{
    margin: 8px !important;
  }
  .dboard-btn-f{
    width: 100% !important;
    font-size: 14px !important;
    padding: 13px 26px 6px 26px;
  }
  .dash-cards {
    width: 224px !important;
 }
}



@media (max-width: 1920px) and (max-width: 2750px) {
  .dash-cards{
    width: 250px !important;
  }
}
@media screen and (min-width: 1400px) {
  .dash-cards{
    width: 260px !important;
  }
}

/* Below style added to hide browse text form file input */
::-webkit-file-upload-button,
::file-selector-button {
  display: none;
}

/* Admin Login CSS */
#admin-login .login-end {
  background-color: #797CFF;
  border-radius: 80px 0px 0px 80px;
  font-family: 'Rajdhani', sans-serif;
}
#admin-login input[type=email],
#admin-login input[type=password] {
  background-color: transparent !important;
  color: #fff !important;
  border-radius: 100px !important;
  border: 3px solid #ced4da;
  font-family: 'Rajdhani', sans-serif;
  height: 50px;
  font-size: 15px;
}

#admin-login input::-webkit-input-placeholder {
  color: #fff !important;
  font-size: 15px!important;
  font-family: 'Rajdhani', sans-serif!important;
  font-weight: 400;
}
#admin-login input::placeholder{
  color: #fff !important;
}
#admin-login .log_in{
  width: 100%;
  border-radius: 100px;
  font-size: 18px;
}
#admin-login .form-label{
  color: white !important; 
  font-size: 18px !important; 
}
#admin-login #logo-holder, #admin-login .text-sec{
  height: 100vh;
}
#admin-login .forget-pw{
  font-size: 18px!important;
  color: #fff!important;
}
#admin-login .forget-pw:hover{
  color: #999999!important; 
}
#admin-login .form-box{
  max-width: 400px;
  margin: 0 auto;
}

/**
START - Changed  Colour for Two  Factor Send Code Message
Author : Gurupriya Solanki
Update Date : 15 July 2024
*/
.custom-two-factor-error{
  color :#FFF1A6!important;
}
.custom-two-factor-error a{
  color :#fff!important;
  font-weight: bold;
}
/**END = Changed  Colour for Two  Factor Send Code Message**/
#refer{
  font-family: rajdhani;
}

 
/**
START - Change the Upload mortgage button color
Author : Gurupriya Solanki
Update Date : 4 Sep 2024
*/
.custom-btn-outline-primary{
  color: #00a2ea !important;
  border-color: #00a2ea !important;
}

.custom-btn-outline-primary:hover{
  background-color: #00a2ea !important;
  border-color: #00a2ea !important;
  color: #fff !important;
}
/**END = Change the Upload mortgage button color**/