/*-----------------
    # Typography
-----------------*/
@import url("https://fonts.googleapis.com/css?family=Inter:400,500,600,700&display=swap");
:root {
  --main-color-one: #1976D2;
  --main-color-two: #105FA0;
  --white-color:#fff;
  --heading-color: #192335;
  --paragraph-color: #545454;
  --icon-bg-color-one:#E6E6E6;
  --icon-bg-color-primary: #3692ED;
  --body-font: "Inter", sans-serif;
  --heading-font: "Inter", sans-serif;
  --body-font-size: 16px;
  --line-height30: 1.7;
}

html {
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  overflow-x: hidden;
  font-family: var(--body-font);
  color: var();

}

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  outline: none;
  -moz-osx-font-smoothing: grayscale;
  /* Firefox */
  -webkit-font-smoothing: antialiased;
  /* WebKit  */
  margin: 0;
  padding: 0;
}

html, body {
  max-width: 100%;
  overflow-x: hidden !important;
}
body {
  
  font-family: "Plus Jakarta Sans", sans-serif;
  font-optical-sizing: auto;
 /* padding-top: 80px; importatnt
  background-color:var(--main-color-two); */

}
p {font-weight: 300;}
a {
  text-decoration: none;
}
h1 {

  font-size: 1.9rem;
}
h2 {
  font-size: 1.7rem;
}

h3 {
  font-size: 1.5rem;
}
h4 {
  font-size: 1.1rem;
}
/* ########## Header Main ########*/

.admin-bar .fixed-top {
  top:36px;
}

.wrapper {
padding-top: 115px;
}
.page-header {
  padding-top: 3rem;;
}

.header-main {
  background-color: var(--main-color-one);
  color:var(--white-color);
  font-size:20px;
}


.header-main ul li {
  list-style: none;
}

.header-main ul {
  padding-left: 40px;
    list-style: none;
    align-self: center;
   /* background-color: pink;*/
    
  
  }
  .header-main ul li {
    position: relative;
    padding-right: 10px;
    padding-left: 5px;
   
  }
.header-main a , .header-main i.fa
{
  color:var(--white-color);
  font-size:20px;

}


.header-main i.fa
{
font-size: 1.5rem;
  
}

.header-main .btn-menu-contact {
  background-color: var(--white-color);
  padding: 10px;
  width: 12.5rem;
  font-size: 19px;
  color: var(--main-color-one) ;
  font-weight: 300;
}

.home .header-main {
  background-color: var(--white-color);
  color:var(--paragraph-color);
}

.home .header-main ul li ul li a ,
 .home .btn-menu-contact

{
  color:var(--white-color);
 

}

.home .header-main i.fa {
color: var(--main-color-one);
}


.home .header-main ul li ul li a ,
  .home .btn-menu-contact

{
  color:var(--white-color);
 

}
.home .btn-menu-contact

{
  background-color: var(--main-color-one);
}

.home .header-main ul li a , .home a
{
  color:var(--paragraph-color);
 

}

/** droddown Icon **/
.dropdown::after {
  
  /* Icon content here */
  content: "\f107"; /* Example using Font Awesome for user icon */
  font-family: FontAwesome; 
  font-style: normal;
  font-weight: normal;
  font-size: 25px;
  speak: none; /* Hide any screen reader announcement */
  position: absolute;
  right: 0;
  top: 55%;
  transform: translateY(-50%);
  color:var(--white-color);

}
.home .dropdown::after {
  color: var(--main-color-one);
}

/* Drop down menu start */

.header-main ul li ul {

  visibility: hidden;
  opacity: 0;
  display: none;
  position: absolute;
  width: 300px;
  left:-40px;
  transition: all ease-in-out 100ms;
}

.header-main ul li ul li {
  background-color:  var(--main-color-two);
}

.header-main ul li ul li:hover{
  background-color:  var(--main-color-one);
}

.header-main ul li ul li a {
  white-space:nowrap;
  color: #fff;
}

.header-main ul li:hover > ul {
  visibility: visible;
  opacity: 1;
  display: block;
 
 
}

/*sub items n icons*/
  
.icon {
  background: url('icons/turn-right.png');
  height: 24px;
  width: 24px;
  /* Other styles here */
  margin-right: 7px;
  margin-left: 5px;
  margin-top: 4px;
  display: inline-block !important;
  
}

.navbar ul li ul li:first-child {
    
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
 }
 
 
 .navbar ul li ul li:last-child {
   
   border-bottom-left-radius: 5px;
   border-bottom-right-radius: 5px;
  }
/* Drop down menu end */

/* Nav toggler 
*/ 
 
.navbar-toggler  {
  border: 2px solid #ffffff00;
}
.home .navbar-toggler  {
  border: 2px solid #1976d300;
}
.mobile-toggler-text {
color: var(--white-color);
}
.home .mobile-toggler-text {
  color: var(--paragraph-color);
  }
  

.navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgb(255, 255, 255)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='4' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.home .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgb(25, 119, 211)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='4' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

 /* Active link class */
 .home .navbar .active {
  font-weight: bold; 
color: var(--main-color-one);

}
.btn-menu-contact {
  margin-left: 20px;
  
 }

 .btn-menu-contact:hover {
  background-color: var(--main-color-two);
  color: var(--white-color);
  
 }
/* ########## Header Main end ########*/


/* ########## Pages Sart ########*/

/* home page styles*/

/* first two columns financial stress */
.heading-primary-light {
  font-size: 2.7rem;
  font-weight: 300;
  line-height: 3.17rem;
  color: var(--main-color-one);
}
.p-text-primary {
font-size: 1.5rem;
font-weight: 400;
line-height: 2rem;
}

/* buttons  */

.btn-primary {
  color: var(--white-color) !important;
  background-color: var(--main-color-one);
}
.btn-primary:hover {
  color: var(--white-color) !important;
  background-color: var(--main-color-two);
}



/*hero section */

.hero-section {

  background-image: linear-gradient(
    to bottom,
     rgba(45, 46, 43, 0.292),
     rgba(12, 12, 12, 0.843)),
     url('../img/here-desktop.png'); 
      padding:10px; background-repeat: no-repeat; background-size: cover;
}
.home-4blocks .card {
  padding: 1rem;
  border-radius: 7%;
}
.home-4blocks .card-title {
  font-size: 1.3rem;
  font-weight: 200;
}


/* card images the debt Road map*/

.debt-map-card .card {
  
  background-color: #F7F7F7;
  background-clip: border-box;
  border: 2px solid #F7F7F7;
 

}

.debt-map-card  .numbers {
  background-color: #1976D2;
  width: 60px;
padding: .7rem 1.5rem;
  border-radius: 100% !important;
  margin-top: -1rem;
  margin-left: -1rem;
  color: #FFF;
}
.debt-service .numbers{
  font-size: 1rem;
  background-color: #1976D2;
  width: 50px;
padding: 15px 10px;
  border-radius: 100% !important;
  color:var(--white-color);
 
}
.bg-services {
  background-color: #F7F7F7;
  padding: 20px;
}

.bg-why-us {
  background-color: #F7F7F7;
  padding: 20px;
}
/*why us section */

.bg-why-us img {
  margin-top: -70px;
}

.why-us-circle {
  background-color: #1976D2;
  width: 40px;
padding: 6px 12px;
  border-radius: 100% !important;
  color: #fff;
}
.bg-why-us ul {
list-style: none;

}


.why-us-list li {
  list-style: none;
}

.why-us-list li span,
.why-us-list li h3 {
  display: inline-block;
  margin-right: 5px; /* Optional: Add spacing between children */
}
.why-us-list p {
  margin-left: 3.6rem;
}

/* Testmonials sections*/

.p-testmonial {
  margin-top: 50px;
}
.p-testmonial p{
 color: var(--paragraph-color);
}

.p-testmonial .card{
  border: 2px solid #fff;
 }

.testmonial-prev {
  border-radius: 100%;
  color: #FFF;
  padding: 10px;
  background-color: var(--main-color-one);
  border: 2px solid  var(--main-color-one);
}
.testmonial-next {
  border-radius: 100%;
  color:#545454;
  padding: 10px;
  background-color: #E6E6E6;
  border: 2px solid #E6E6E6;
}

.testmonial-prev:hover {
  color:#545454;
  background-color: #E6E6E6;
  border: 2px solid #1976D2;
  
}
.testmonial-next:hover {
  color: #1976D2;
  background-color: #E6E6E6;
  border: 2px solid #1976D2;
  
  
}


.testmonial-prev i,.testmonial-next i {
font-size: 28px;
font-weight: 100 !important;
}

/* call to action front page*/



.debt-call-2-action .row {
  background-color: #fff;
}

/* services section */

.line {
  color: transparent;
  
  
  }
/* home page styles end */

/* about us page*/
.debt-about-us .card-text , .debt-about-us  ul li {

  font-size: 14px !important;
}

.debt-card-image img {
  margin-top: 1rem;
  padding-top: rem;
  background-color: var(--icon-bg-color-primary);
  padding: 2rem;
  border-radius: 100%;
}

/* service CM */

.service-cm-btn {

  background-color:var(--main-color-two);
  width: 70%;
  color: #fff;
  padding-top: 5px;
  padding-bottom: 5px;

}
.service-cm-btn:hover {

  background-color:var(--main-color-one);
 

}


/* debt consolidation service*/

.debt-consolidation-card .card ,
.debt-service .card {
 
  border: 2px solid #ffffff;

}

.debt-consolidation-card .numbers {
  background-color: var(--main-color-one);
  width: 60px;
padding: 9px 20px;
  border-radius: 100% !important;
  color: #FFF;
}



/* social icons */

/* debt contact*/
.debt-contact i {
  background-color:#E6E6E6;
  border-radius: 50%;
  padding: 10px;
  color: #1976D2;
  }
  
  .debt-contact i.fa-whatsapp {
  
    color:green;
    }
  .debt-contact i.fa-map-marker{
    padding: 10px 15px;
  }

.home .header-main .header-contact-number-link {
  color: var(--main-color-one) ;
}

/* General Items */

/* cf7 contact form 7 start*/



/*** Call back form **/

.hero-section  .call-back-form {
  margin-top: -25px;
  
}
.call-back-form .debt-link {
  text-decoration: underline;
}


div.wpcf7 { 
 
  padding:20px 10px 0 10px ;
  background-color:var(--main-color-two);
  border-radius: 10%;
  }
  .wpcf7 P {
    font-weight: 300;
    font-size: 1rem;
   
    margin-top: -3px;
  }
  .wpcf7 small {
  
    font-size: .8rem;
   
  }
  .wpcf7 small a {
  
    text-decoration:underline !important;
   
  }
 .wpcf7 input,
 .wpcf7 select
{
  background: var(--main-color-one);
  color:#FFF;
  font-size: .8rem;
  font-weight: 300;
  padding: 15px 10px 10px 15px;
  width: 100%;
  border: 1px solid var(--main-color-one);
     
  }
  .wpcf7 input[type="submit"],
  .wpcf7 input[type="button"] { 
    background: #FFFFFF;
    color: var(--main-color-one);
    width: 100%;
  text-align:center;
  text-transform:uppercase;
  padding: 20px 0px 20px 0px;
  margin-bottom: -13px;
  }
/*
  .wpcf7 input[type="date"]:before {
    content: attr(placeholder);
    width: 100%;
    }
  
    .wpcf7 input,
    .wpcf7 input[type="date"]:before 
  {
    width: 100%;
  }*/


    ::-webkit-calendar-picker-indicator {
      filter: invert(1);
      opacity: 0.6;
  }
  ::-webkit-input-placeholder { /* WebKit browsers */
    color: #fff!important;
    opacity: 1;
    }
    :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: #fff !important;
    opacity: 1;
    }
    ::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #fff !important;
    opacity: 1;
    }
    :-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #fff !important;
    opacity: 1;
    }
/*
    input[type='date'] {
      -webkit-appearance: none;
  }*/


    .call-back-form {
      background-color:var(--main-color-two);
      border-radius: 5% !important;
      
    }

/* cf7contact form 7 end */

/*##### mouse scroll**/



.mouse {
  margin-top: 5rem;
	width: 30px;
	height: 60px;
	border: 2px solid #ffffff;
	border-radius: 60px;
	position: relative;
	&::before {
		content: '';
		width: 8px;
		height: 8px;
		position: absolute;
		top: 10px;
		left: 50%;
		transform: translateX(-50%);
		background-color: #ffffff;
		border-radius: 50%;
		opacity: 1;
		animation: wheel 2s infinite;
		-webkit-animation: wheel 2s infinite;
	}
}
keyframes wheel {
	to {
		opacity: 0;
		top: 60px;
	}
}

@-webkit-keyframes wheel {
	to {
		opacity: 0;
		top: 60px;
	}
}

/* end of mouse scrolls*/

/* margin top oan all sections*/

.debtmap-section {
  margin-top: 100px;

}

/* bg primary*/

.bg-primary {

  background-color: var(--main-color-one) !important;
}

.text-primary {
  color: var(--main-color-one) !important;
}

/* curved bg */

.curved-bg {

  background-image:url('../img/page-xlbg.png'); 
 background-repeat: no-repeat; 
 background-size:cover;
}

/* aacordion */

.accordion-body {
 
  border-left: 2px solid var(--main-color-one);
}
.accordion-header button {
  font-size: 1.6rem;
  color: var(--main-color-one);
  background-color: transparent !important;
}
.accordion-header {
  background-color: transparent;
}
.accordion-header button:focus {
  border-color: transparent !important;
}

.debt-contact-page a {

  color: var(--paragraph-color);
}


/* genral items end */




/* ########## Pages end ########*/




/* #########FOOTER START#########*/
.debt-footer {
  background-color: #05478A;
  margin-top: -15px;
/*margin-left: -12px;
margin-right: -12px;*/
padding: 20px;

}

.debt-footer .navbar-nav {
  background-color: transparent;

}
.debt-address {
  display: inline-flex;
}


.debt-footer-socials i {
  font-size: 1.2rem;
  padding:5px;
  text-align: end;
}
.debt-footer-socials .fa {
  color:#fff;
}


.Debt-footer-contact span {
  margin-left: 10px;
 
}



.debt-footer li span,
.debt-footer li a ,  .debt-footer a {
  display: inline-block !important;
  margin-right: 10px; /* Optional: Add spacing between children */
  color: var(--white-color);
}

.debt-footer .navbar-nav {
  margin-left: -20px;
}

/*###footer end #*/


/* Mobile query*/

/* Desktop query*/
@media (min-width: 1000px) {

  .curved-bg {

    margin-left: -24px;
    margin-right: -24px;
     
     }
     .header-main {
     /* border-top: 10px solid var(--main-color-two);*/
    }

  /* home page intro text */

  .home .home-intro-text .btn-primary {
    width: 300px;
  }

	/*articles h3 size */
	
	.blog-h3 {
		font-size:1.2rem;
	}
	
	/* Single post content*/

	.single-content {
		margin: 0 135px;
	}


  /* home page hero section */
.hero-section {

  margin-left: -12px;
  margin-right: -12px;
}

.hero-icons .card-body p {

  font-size:.7rem;
}
/* cf7contact form 7 start */

/* genral items start */
  .call-back-form {
  
    width: 24rem;
    margin: auto;
      }
      /* cf7contact form 7 end */

/* genral items end */

/* About us whoe we are cards */

.who-we-are-cards-row {
  margin-top: -265px;
}

/* debt counselling service*/

.debt-counselling-service-cards {

  margin-top: -350px !important;
}

.header-main .contact-info .mobile-menu-text {
  display: none;
}


.mobile-copyright {
  display: none;
}
.desktop-copyright {
  display: block;
}

}

@media (max-width: 980px){


  body {
    background-color: var(--white-color) !important;
  }
  

  .curved-bg {

    margin: 0 -12px;
     
     }

     .curved-bg  .call-back-form {
      margin-top: 60px;
    
     }

     .home-4blocks .card {
      padding: .001rem;
    }
     /* Typography */

     .home-4blocks .card-title {
      font-size: 1rem;
      font-weight: 200;
    }

     h1 {
      font-size: 1.7rem;
    }

     h4 {

      font-size: 1.2rem;
     }
     .p-testmonial {
      margin-top: 0px;
    }
    /* wrapper styling for mobile */

    .wrapper {
      margin-top: 80px;
    }

.wrapper {
  padding-top: 64px;
}
  .debtmap-section  {

    margin-top: 50px;
  }

  .roadmap-icon img {
    background:var(--icon-bg-color-one);
    padding: 10px;
    border-radius: 100% !important;
}
  
  /* ########## Header Main Mobile Start ########*/

  /* styling for mobile curved image*/



  .header-main {
  
    padding: 0;
    justify-content: flex-start;
    
  }
   .header-main .mobile-header i.fa ,  .header-main a {
    color: var(--white-color);
    }
    .header-main .mobile-header  {
      background-color: #cccccc5a;
    }
  .home .header-main .mobile-header a , .home .mobile-header i.fa {
    color: var(--main-color-one);
    }

  .header-main .contact-info .mobile-span ,
   .header-main .contact-info .btn-menu-contact {
    display: none;
  }


  .header-main ul {
    margin-top:  2rem;
    padding-left: 0px;
    margin: 0;
    flex-wrap: wrap;
    flex-direction: column;
    align-content: space-between;
      
    }

    .header-main ul li {
      width: 100%;
      padding: 5px;
      margin: 0;
      border-top:1px solid #3388DB;
      display: flex;
      flex-wrap: nowrap;
      flex-direction: column;

    }
 
    .header-main ul li:nth-last-child(1){
      border-bottom: 1px solid #3388DB;
    }
    .header-main .mobile-menu-text ul {
      width: 100%;
    }
    .header-main .mobile-menu-text  li {
      width: 100%;
      border-top: 1px solid transparent ;
      border-bottom: 1px  solid transparent !important;
    }

    .header-main nav {
      overflow-y: scroll;
      overflow-x: hidden;
    }

    .header-main ul li ul {

      display: none;
      width: 100%;
      position: absolute;
      flex-wrap: nowrap;
      flex-direction: column;
      top:0;
      left: 0;
      z-index: 2000;
     
    }

    .header-main ul li ul li {
      height: fit-content;
      width: 100%;
      display: block;
      
      
    }

    .header-main ul li:focus>ul,
    .header-main ul li:hover>ul {
      margin-top: 40px;
      display: flex;
      visibility: visible;
      opacity: 1;
    }
    .header-main ul li ul li a {
      font-size: 2rem;
    
    }

    .btn-menu-contact {
     margin: auto;
      font-size: 1.5rem;
    }

  
    
    .page-header h1, .page-header p{
    margin-top: 20px;
      text-align: center !important;
      padding: 0 .8rem;
    
    }

    .page-header ._404-error {
      margin-left: 20% !important;
    }
    ._404-error input[type="submit"] { 
      background: var(--main-color-two) !important;
      color: var(--white-color) !important;
   border: 2px solid rgb(255, 255, 255);
   padding: 0 2px;
    }

    
    .debt-mouse {
      margin-left: 50% !important;
    }
    .page-header .mouse {
      
      
     margin-top: 50px;
    }
    
   

    .call-back-form small {
      font-size: .7rem;
    }
    .debt-call-2-action .row {
      background-color: transparent;
    }
    .wpcf7 P {
    
      margin-top: -3px;
    }
 

    /* ########## Header Main Mobile desktop ########*/


    /* ########## Pages Sart ########*/

/* home page styles*/

/*hero section */
.hero-mobile-call-back-form  {
  margin-top: -10px;
}
.hero-section {

  background-image: linear-gradient(
    to bottom,
     rgba(45, 46, 43, 0.292),
     rgba(12, 12, 12, 0.843)),
     url('../img/hero-mobile.png'); 
      padding:0 10px; background-repeat: no-repeat; background-size: cover;
}
.hero-icons .card-body p {

  font-size:.6rem;
}


/* styling card numbers on mobile */


  .debt-map-card .numbers {
    background-color: var(--main-color-one);
    width: 48px;
    padding: 7px 11px; }

  .debt-settlement .numbers {
    padding: 15px 20px;
  }

  /* why us section */

  .why-us-list-section  {

    margin-left: 0rem !important;
  }


  /* testmonials */



  /* Mobile utilies */

  .debt-map-center-text-mobile {
    text-align: center;
  }

  /* home intro text*/

  .home-intro-text h2 {

    font-size: 1.6rem;
    line-height: 1.9rem;
    font-weight: 300;
    text-align: right;
	  padding-right:16px !important;
  }

  .home-intro-text p {

    font-size: 1.1rem;
    font-weight: 200;
    line-height: normal;
    text-align: right;
	  padding-right:16px !important;
  }

  .home-intro-text .btn-primary {
  
    font-size: .8rem;
  
  }
  .home-intro-text a {
   
    font-size: .7rem;
  }
/* ########## Pages end ########*/

/* ########## footer mobile ########*/
.debt-footer-socials .fa {
 
}
.debt-footer-socials  p {
 
  text-align: center !important;

}
.mobile-copyright {
  display: block;
}
.desktop-copyright {
  display: none;
}

debt-footer li span, .debt-footer li a {

  font-size: 15px;
}

.debt-footer .icon {
  
  height: 20px;
  width: 24px;

}
.debt-footer  ul li {
  margin-left: 13px;
}

.fa-facebook-official {
  border-bottom: 2px solid rgb(213, 206, 206);
  color: #fff;
}

/* ########## footer mobile end ########*/
  /*curve*/

  .curved-bg {

    background-image:url('../img/mobile-curve.png'); 
   background-repeat: no-repeat; 
   background-size:cover;

  }
  .bg-why-us {
    background-color: #F7F7F7;
    padding: 0;
  }

}

@media (max-width:480px) {

  .curved-bg, .hero-section {

    margin: 0 -24px;
     
     }

     .curved-bg {

      background-image:url('../img/mobile-curve.png'); 
     background-repeat: no-repeat; 
     background-size:contain;
  
    }

     .why-us-list li h3 {
      display: inline-block;
      margin-right: 5px;
      font-size: 1.2rem;
  }


.mobile-copyright {
  font-size: .8rem;
}
}