/* GLOBAL STYLES
-------------------------------------------------- */
/* Padding below the footer and lighter body text */

body {
  font-family: "Google Sans", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: #181818;
  background-color: #ffffff;
}
footer{background-color: #131313;width:100%;color:#fff}
.reviews a{color:#00f7ff;text-decoration: none;}
.reviews a:hover{color:#80fbff;text-decoration: none;}
a:hover, .btn-primary {border-bottom:0;}
a {text-decoration: none;}
.readmore:hover { color:#4b4356;}


.btn-primary {background-color: #000000;color:rgb(255, 255, 255);border-color: #0f86f7;padding:10px 40px; border-radius: 25px;}
.btn-primary:active,.btn-primary:focus{background-color: #0f86f7;color:rgb(27, 27, 27);border-color: #0f86f7;}
.btn-primary:hover{background-color: #0f86f7;color:#fff;border-color: #0f86f7;}
.btn-block {width:20%}
.brandprimary{color: #0f86f7;font-weight: 800;}
.bg-brandprimary{background: #ffffff;background-color: rgba(255, 255, 255, 0.9);}
.bg-disclosure {background: #1b8cc0;}
.bg-satisfaction{background:#212529; margin-top:50px;}
.bg-white-top {background:rgba(255,255,255, 0.9);}
.color-brand{color:#0f86f7;}
.navbar-brand {letter-spacing: 1px;font-weight: 800;color:#000;text-transform: uppercase;}
.nav-link {color:#000;}
.dropdown:hover .dropdown-menu {
  display: block;
  margin: 0;
}
.dropdown-menu{background-color: #e7e7e7;}
.dropdown-item{font-weight:600;color:#000;}
.dropdown-item.active{background-color: #0f86f7;color:#fff}
.dropdown-item:hover{background-color: #0f86f7;color:#fff}
.callus{color:#fff;padding:40px 0}
.logolink:hover {border-bottom: 0;}


/*.page-header { background: url(../img/header-bg.jpg)no-repeat; position: relative; background-size: cover; text-shadow: 2px 2px 3px #000;}*/
.page-header-about { background: url(../img/header-bg.jpg)no-repeat; position: center; background-size: cover; text-shadow: 2px 2px 3px #000;}
.page-header-baddebt { background: url(../img/header-bg.jpg)no-repeat; position: center; background-size: cover; text-shadow: 2px 2px 3px #000;}
.page-header-debtconsolidation { background: url(../img/header-bg.jpg)no-repeat; position: center; background-size: cover; text-shadow: 2px 2px 3px #000;}
.page-header-mortgages { background: url(../img/header-bg.jpg)no-repeat; position: center; background-size: cover; text-shadow: 2px 2px 3px #000;}
.page-header-personalloans { background: url(../img/header-bg.jpg)no-repeat; position: center; background-size: cover; text-shadow: 2px 2px 3px #000;}
.page-caption { padding-top: 68px; padding-bottom: 68px; }
.page-title { font-size: 46px; line-height: 1; color: #fff; font-weight: 600; text-align: center; }
.card-top {margin-top:50px;}
.card-section { position: relative; bottom: 60px; }
.card-block { padding: 24px 48px; }
.card-block-top { padding: 24px 48px 0 48px; border-bottom: 4px solid #e4cb1b; }
.card-title{ background-color:#4b4356;color:#e4cb1b;padding:24px 48px; border-bottom: 4px solid #e4cb1b; }
.title-brandprimary {font-weight: 800;}
.section-title { margin-bottom: 60px; }

.form-control:focus{border-color:#4b4356;box-shadow: 0 0 0 .25rem rgb(0, 50, 212);}

.google-sans-thin {
  font-family: "Google Sans", sans-serif;
  font-weight: 100;
  font-style: normal;
}

.google-sans-light {
  font-family: "Google Sans", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.google-sans-regular {
  font-family: "Google Sans", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.google-sans-bold {
  font-family: "Google Sans", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.google-sans-black {
  font-family: "Google Sans", sans-serif;
  font-weight: 900;
  font-style: normal;
}

.google-sans-thin-italic {
  font-family: "Google Sans", sans-serif;
  font-weight: 100;
  font-style: italic;
}

.google-sans-light-italic {
  font-family: "Google Sans", sans-serif;
  font-weight: 300;
  font-style: italic;
}

.google-sans-regular-italic {
  font-family: "Google Sans", sans-serif;
  font-weight: 400;
  font-style: italic;
}

.google-sans-bold-italic {
  font-family: "Google Sans", sans-serif;
  font-weight: 700;
  font-style: italic;
}

.google-sans-black-italic {
  font-family: "Google Sans", sans-serif;
  font-weight: 900;
  font-style: italic;
}

.profile-card-4 {
    background-color: #FFF;
    border-radius: 5px;
    box-shadow: 0px 0px 25px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    position: relative;
    margin: 10px auto;
    cursor: pointer;
}

.profile-card-4 img {
    transition: all 0.25s linear;
}

.profile-card-4 .profile-content {
    position: relative;
    padding: 15px;
    background-color: #FFF;
}

.profile-card-4 .profile-name {
    font-weight: bold;
    position: absolute;
    left: 0px;
    right: 0px;
    top: -70px;
    color: #FFF;
    font-size: 17px;
}

.profile-card-4 .profile-name p {
    font-weight: 600;
    font-size: 13px;
    letter-spacing: 1.5px;
}

.profile-card-4 .profile-description {
    color: #777;
    font-size: 1.2ems;
    padding: 10px;
}

.profile-card-4 .profile-overview {
    padding: 15px 0px;
}

.profile-card-4 .profile-overview p {
    font-size: 10px;
    font-weight: 600;
    color: #777;
}

.profile-card-4 .profile-overview h4 {
    color: #273751;
    font-weight: bold;
}

.profile-card-4 .profile-content::before {
    content: "";
    position: absolute;
    height: 30px;
    top: -10px;
    left: 0px;
    right: 0px;
    background-color: #FFF;
    z-index: 0;
    transform: skewY(3deg);
}

.profile-card-4:hover img {
    transform: rotate(5deg) scale(1.1, 1.1);
    filter: brightness(110%);
}

.card{
  border: none;
  transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1);
 overflow:hidden;
 border-radius:20px;
 min-height:450px;
   box-shadow: 0 0 12px 0 rgba(0,0,0,0.2);

 @media (max-width: 768px) {
  min-height:350px;
}

@media (max-width: 420px) {
  min-height:300px;
}

 &.card-has-bg{
 transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1);
  background-size:120%;
  background-repeat:no-repeat;
  background-position: center center;
  &:before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: inherit;
    -webkit-filter: grayscale(1);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);}

  &:hover {
    transform: scale(0.98);
     box-shadow: 0 0 5px -2px rgba(0,0,0,0.3);
    background-size:130%;
     transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1);

    .card-img-overlay {
      transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1);
      background: rgb(255,186,33);
     background: linear-gradient(0deg, rgba(10, 10, 10, 0.5) 0%, rgb(8, 211, 126) 100%);
     }
  }
}
 .card-footer{
  background: none;
   border-top: none;
    .media{
     img{
       border:solid 3px rgba(255,255,255,0.3);
     }
   }
 }
  .card-title{font-weight:800}

 .card-body{ 
   transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1);
 

  }
 &:hover {
   .card-body{
     margin-top:30px;
     transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1);
   }
 cursor: pointer;
 transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1);
}
 .card-img-overlay {
  transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1);
 background: rgb(255,186,33);
background: linear-gradient(0deg, rgba(18, 36, 31, 0.579) 0%, rgb(90, 141, 116) 100%);
}
}


.featurette-divider {
  margin: 5rem 0; /* Space out the Bootstrap <hr> more */
}

/* Thin out the marketing headings */
.featurette-heading {
  font-weight: 300;
  line-height: 1;
  /* rtl:remove */
  letter-spacing: -.05rem;
}

.bg-offset-hero::after {
	position: absolute;
	content: '';
	width: 75%;
	top: 0;
	left: 0;
	bottom: 0;
	z-index: -1;
	background-color: #1b8cc0;
}

.quote_ {
	opacity: 0.1;
}

@media (max-width: 767.98px) {
	.bg-offset-hero::after {
		width: 100%;
	}


/* RESPONSIVE CSS
-------------------------------------------------- */
@media (min-width: 40em) {
  /* Bump up size of carousel content */
  .carousel-caption p {
    margin-bottom: 1.25rem;
    font-size: 1.25rem;
    line-height: 1.4;
  }

  .featurette-heading {
    font-size: 50px;
  }
}

@media (min-width: 62em) {
  .featurette-heading {
    margin-top: 7rem;
  }
}

@media only screen and (max-width: 600px) {
  .card-block{padding:20px}
}