.hero-cards {
  padding: 92px 0 156px;
  background-color: #f9f9f9;
  background-repeat: no-repeat;
  background-position: top left;
  background-size: 100%;
  background-image: url('../images/quiz/Hero-Desktop-BG-1920x1010.png');
  text-align: center; }
  @media (max-width: 767px) {
    .hero-cards {
	  background-image: url('../images/quiz/Hero-Mobile-BG-375x1710.png');
      padding: 49px 0 127px; } }
  .hero-cards .container {
    margin: auto;
    max-width: 1120px;
    padding: 0 20px; }
  .hero-cards .sub-heading {
    margin-bottom: 20px;
    font: 900 26px/50px "proxima-nova";
    letter-spacing: -0.33px;
    color: #000; }
    @media (max-width: 767px) {
      .hero-cards .sub-heading {
        margin-bottom: 0;
        font-size: 28px;
        line-height: 40px;
        letter-spacing: -0.35px; } }
  .hero-cards .heading {
    margin-bottom: 30px;
    font: 900 55px/50px "proxima-nova";
    letter-spacing: -0.69px;
    color: #389aff; }
    @media (max-width: 767px) {
      .hero-cards .heading {
        margin-bottom: 34px;
        font-size: 40px;
        line-height: 40px;
        letter-spacing: -0.5px; } }
  .hero-cards .desc {
    margin-bottom: 85px;
    font: 400 18px/25px "proxima-nova";
    letter-spacing: -0.23px;
    color: #777; }
    @media (max-width: 767px) {
      .hero-cards .desc {
        margin-bottom: 55px;
        font-size: 16px;
        line-height: 22px;
        letter-spacing: -0.2px; } }
  .hero-cards .cards {
    margin: 0 -30px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }
    @media (max-width: 1023px) {
      .hero-cards .cards {
        margin: 0 -15px;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; } }
    @media (max-width: 767px) {
      .hero-cards .cards {
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        margin: 0; } }
    .hero-cards .cards .card {
      -webkit-box-flex: 0;
          -ms-flex: 0 0 calc(100% / 3 - 60px);
              flex: 0 0 calc(100% / 3 - 60px);
      margin: 0 30px;
      padding: 52px 26px 0;
      overflow: hidden;
      border: none;
      border-top: 5px solid;
      border-radius: 0 0 30px 30px;
      background: #fff;
      -webkit-box-shadow: 0 2px 14px 3px rgba(74, 74, 74, 0.1);
              box-shadow: 0 2px 14px 3px rgba(74, 74, 74, 0.1); }
      @media (max-width: 1023px) {
        .hero-cards .cards .card {
          margin: 0 15px 30px;
          -webkit-box-flex: 0;
              -ms-flex: 0 0 calc(50% - 30px);
                  flex: 0 0 calc(50% - 30px); } }
      @media (max-width: 767px) {
        .hero-cards .cards .card {
          margin: 0 27px 30px;
          -webkit-box-flex: 0;
              -ms-flex: 0 0 100%;
                  flex: 0 0 100%;
          max-width: 400px; } }
      .hero-cards .cards .card.card--blue {
        border-color: #389aff; }
        .hero-cards .cards .card.card--blue .btn-quiz {
          border-color: #389aff;
          color: #389aff; }
          .hero-cards .cards .card.card--blue .btn-quiz:hover {
            background: #389aff; }
      .hero-cards .cards .card.card--red {
        border-color: #ea1d6f; }
        .hero-cards .cards .card.card--red .btn-quiz {
          border-color: #ea1d6f;
          color: #ea1d6f; }
          .hero-cards .cards .card.card--red .btn-quiz:hover {
            background: #ea1d6f; }
      .hero-cards .cards .card.card--yellow {
        border-color: #edaa42; }
        .hero-cards .cards .card.card--yellow .btn-quiz {
          border-color: #edaa42;
          color: #edaa42; }
          .hero-cards .cards .card.card--yellow .btn-quiz:hover {
            background: #edaa42; }
      .hero-cards .cards .card-heading {
        margin-bottom: 15px;
        font: 900 20px/26px "proxima-nova";
        letter-spacing: -0.25px;
        color: #171717; }
      .hero-cards .cards .card-text {
        margin-bottom: 15px;
        font: 400 14px/20px "proxima-nova";
        letter-spacing: -0.18px;
        color: #777; }
	  .hero-cards .cards .card .card-image {
		margin: 0 -26px;
		}
      .hero-cards .cards .card .btn-quiz {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        margin-bottom: 50px;
        padding: 10px;
        border: 2px solid;
        border-radius: 20px;
        width: 154px;
        height: 40px;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        text-align: center;
        font: 600 14px/20px "proxima-nova";
        letter-spacing: -0.18px;
        text-decoration: none;
        -webkit-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out; }
        .hero-cards .cards .card .btn-quiz:hover {
          color: #fff; }
@media (max-width: 767px) {
	.hero-cards .cards .card .card-image {
		display: none;	}
}
.insights {
  margin: 136px 0 66px;
  padding: 0 20px; }
  @media (max-width: 767px) {
    .insights {
      margin: 121px 0 47px; } }
  .insights-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 118px 46px 130px 94px;
    margin: auto;
    max-width: 1252px;
    width: 100%;
    border-radius: 0 0 82px 0;
    background-color: #f9f9f9;
    -webkit-box-shadow: 0 10px 10px 4px rgba(50, 50, 50, 0.1);
            box-shadow: 0 10px 10px 4px rgba(50, 50, 50, 0.1); }
    @media (max-width: 1023px) {
      .insights-inner {
        padding: 80px 40px; } }
    @media (max-width: 767px) {
      .insights-inner {
        padding: 80px 10px 116px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        text-align: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center; } }
    @media (max-width: 767px) {
      .insights-inner .image {
        margin-top: 44px;
        -webkit-box-ordinal-group: 2;
            -ms-flex-order: 1;
                order: 1; } }
    .insights-inner .image img {
      max-width: 100%; }
    .insights-inner .content {
      margin-left: 123px; }
      @media (max-width: 1023px) {
        .insights-inner .content {
          margin-left: 50px; } }
      @media (max-width: 767px) {
        .insights-inner .content {
          margin-left: 0; } }
      .insights-inner .content .heading {
        margin-bottom: 26px;
        font: 900 38px/1 "proxima-nova";
        letter-spacing: -0.48px;
        color: #389aff; }
      .insights-inner .content .text {
        margin-bottom: 33px;
        font: 400 18px/1.39 "proxima-nova";
        letter-spacing: -0.23px;
        color: #777; }
      .insights-inner .content .btn-calculator {
        display: inline-block;
        padding: 10px 20px;
        border-radius: 20px;
        border: 2px solid #ea1d6f;
        background-color: #ea1d6f;
        color: #fff;
        -webkit-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
        text-decoration: none;
        font-weight: bold;
        }
        .insights-inner .content .btn-calculator:hover {
          color: #ea1d6f;
          background-color: #fff; }

.join {
  padding: 88px 0 107px;
/*   background-image: -webkit-gradient(linear, left top, left bottom, from(#228fff), color-stop(99%, #389aff));
  background-image: linear-gradient(to bottom, #228fff, #389aff 99%); */
  background-repeat: no-repeat;
  background-position: top left;
  background-size: cover;
  background-image: url('../images/quiz/Newsletter-Desktop-BG-1920x420.png');
  text-align: center; }
  @media (max-width: 767px) {
    .join {
      background-image: url('../images/quiz/Newsletter-Mobile-BG-428x650.png');
      padding: 108px 0 123px; } }
  .join .container {
    margin: auto;
    padding: 0 20px;
    max-width: 628px; }
  .join .heading {
    margin-bottom: 36px;
    font: 900 40px/1 "proxima-nova";
    letter-spacing: -0.5px;
    color: #fff; }
    @media (max-width: 767px) {
      .join .heading {
        margin-bottom: 40px; } }
  .join .desc {
    margin-bottom: 36px;
    font: 400 18px/25px "proxima-nova";
    letter-spacing: -0.23px;
    color: #fff; }
  .join .form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center; }
    @media (max-width: 767px) {
      .join .form {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column; } }
    .join .form .form-control {
      max-width: 300px;
      padding: 16px;
      border-radius: 4px;
      border: solid 1px #ccc;
      background-color: #fff;
      font: 400 16px/22px "proxima-nova";
      letter-spacing: -0.2px;
      color: #777; }
      @media (max-width: 767px) {
        .join .form .form-control {
          margin-bottom: 35px; } }
		  
		  
    .join .form .btn-submit {
      margin-left: 20px; }
      @media (max-width: 767px) {
        .join .form .btn-submit {
          margin-left: 0; } }
		  
		  
.fancybox-modal {
	display: none;
}

.join .form .hbspt-form {
	display: flex;
	justify-content: center;
	margin: 0 auto;
	max-width: 500px;
	width: 100%;
}

.join .form .hbspt-form form {
	align-items: center;
	display: flex;
	justify-content: center;
	position: relative;
	width: 100%;
}

.join .form .hbspt-form .hs-form-field {
	margin: 0 !important;
	max-width: 300px;
	width: 100%;
}

.join .form .hbspt-form .hs-form-field label {
	display: none;
}

.join .form .hbspt-form .hs-form-field .input {
	width: 100%;
}

.join .form .hbspt-form .hs-form-field input[type="email"] {
	width: 100%;
}

.join .form .hbspt-form .hs_error_rollup {
	left: 0;
	padding: 5px 0 0;
	position: absolute;
	top: 100%;
}

.join .form .hbspt-form .hs-error-msgs {
	margin: 0;
}

.join .form .hbspt-form .hs-error-msgs label {
	line-height: 125%;
	padding: 0;
}

.join .form .hbspt-form .hs-submit {
	margin-left: 20px;
}

.join .form .hbspt-form .hs-submit .actions {
}

.join .form .hbspt-form .hs-submit input[type="submit"] {
	margin: 0;
}

.join .form .hbspt-form .submitted-message {
	color: #fff;
	font-size: 16px;
	line-height: 125%;
}













