/* page fixes */
  /* fix hide old visuals - nav and footer */
  footer.page-footer {padding-bottom: 0px;}
  .footer-section p {font-size: 15px;}
  header.page-header {display: none!important;}
  /* fix cookie message */
  .notification-bar {background-color: white;}
  #cookie-bar h5 {color: #814595;}
  #cookie-bar p, #cookie-bar a {text-align: left;color: #814595;}
  span.icon.icon-white.icon-close-sm {background-position: -1px -1767px;width: 29px;height: 29px;}
  /* fix browser compatability message */
  .notification-msg h5,  .notification-msg a {color: #814595;}
  /* fix page wide rules */
  .outer-wrapper {width: 100%!important; padding: 0px!important;}
  body {background-color: #fff;}
  .clear {clear: both;line-height:0;}

/* nav */
  .nav-container {
    display: table;
    width: 100%;
    height: 62px;
    text-align:center;
  }
  .nav-inner {
    display: table-cell;
    vertical-align:middle;
    width: 1170px;
  }
  .nav-left {
    position: relative;
    top: -10px;
  }
  .nav-bar:before {
    z-index: 0;
  }

/* central */
  .page-section {
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .page-content {
    width: 1170px;
    margin-left: auto;
    margin-right: auto;
  }
  h3, p, span, sub {
    text-align: center;
    font-family: Din,Helvetica,Arial,sans-serif;
    font-weight: 100;
    color: #6c6c6c;
  }
  h1 {
    font-family: Kapra,sans-serif;
    text-align: center;
    color: #fff;
  }
  h2 {
    font-family: Kapra,sans-serif;
    text-align: center;
    color: #814595;
  }
  p {
    font-size: 15px ;
    margin: 0 0 11px;
  }
  h1 + p {
    margin-bottom: 35px;
  }
  .sub-text {
    line-height: 20px;
    margin-bottom: 30px;
    font-size: 16px!important;
  }
  .col-center {
    float: none;
    margin-left: auto;
    margin-right: auto;
  }
  .vertical-container {
    display: table;
  }
  .vertical-content {
    display: table-cell;
    vertical-align: middle;
  }

/* sections */
  .section-grey {
    background-color: #979797;
  }
  .section-grey h2, .section-grey h3, .section-grey p {
    color:  #fff;    
  }
  .section-purple {
    background-color: #944397;
  }
  .section-purple h2, .section-purple h3, .section-purple p {
    color:  #fff;    
  }
  .down-arrow-white, .down-arrow-purple {
    border-style: solid;
    border-radius: 2px;
    border-width: 0.65em 0.65em 0 0;
    content: '';
    height: 2em;
    width: 2em;
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    margin-left: auto;
    margin-right: auto;
    display: block;
    position: relative;
    top: 60px;
    margin-bottom: 60px;
  }
  .down-arrow-white {
    border-color: #fff;
  }
  .down-arrow-purple {
    border-color: #944397;
  }

/* ctas */
  .cta-blue, .cta-blue-secondary, .cta-green, .cta-green-secondary {
    text-align: center;
    font-weight: 600;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
  }
  .cta-cap {
    float: right;
    height: 100%;
  }
  .cta-angle {
    text-align: right;
    float: right;
    transform: skew(-30deg);
    -webkit-transform: skew(-30deg);
    -ms-transform: skew(-30deg);
    height: 100%;
  }
  .cta-angle p {
    color: #fff;
  }
.cta-angle div {
    transform: skew(30deg);
    -webkit-transform: skew(30deg);
    -ms-transform: skew(30deg);
  }

  /* blue */
  .cta-blue {
    color: #fff;
    background-color: #00A0DC;
  }
  .cta-blue .cta-angle, .cta-blue .cta-cap {
    color: #fff;
    background-color: #01709B;
  }
  .cta-blue:hover {
    color: #fff;
    background-color: #01709B;
    cursor:pointer;
    transition: all 0.5s ease;
  }
  .cta-blue:hover .cta-cap, .cta-blue:hover .cta-angle {
    color: #fff;
    background-color: #00A0DC;
    transition: all 0.5s ease;
  }

  /* blue secondary */
  .cta-blue-secondary {
    color: #00A0DC;
    background-color: #fff;
    border: 2px solid #00A0DC;
  }
  .cta-blue-secondary .cta-cap {
    border-radius: 3px;
  }
  .cta-blue-secondary .cta-angle, .cta-blue-secondary .cta-cap {
    color: #fff;
    background-color: #01709B;
  }
  .cta-blue-secondary:hover {
    color: #fff;
    background-color: #01709B;
    cursor:pointer;
    transition: all 0.5s ease;
  }
  .cta-blue-secondary:hover .cta-cap, .cta-blue-secondary:hover .cta-angle {
    color: #fff;
    background-color: #00A0DC;
    transition: all 0.5s ease;
  }

  /* green */
  .cta-green {
    color: #fff;
    background-color: #01C351;
  }
  .cta-green .cta-angle, .cta-green .cta-cap {
    color: #fff;
    background-color: #02863A;
  }
  .cta-green:hover {
    color: #fff;
    background-color: #02863A;
    cursor:pointer;
    transition: all 0.5s ease;
  }
  .cta-green:hover .cta-cap, .cta-green:hover .cta-angle {
    color: #fff;
    background-color: #01C351;
    transition: all 0.5s ease;
  }

  /* green secondary */
  .cta-green-secondary {
    color: #01C351;
    background-color: #fff;
    border: 2px solid #01C351;
  }
  .cta-green-secondary .cta-cap {
    border-radius: 3px;
  }
  .cta-green-secondary .cta-angle, .cta-green-secondary .cta-cap {
    color: #fff;
    background-color: #02863A;
  }
  .cta-green-secondary:hover {
    color: #fff;
    background-color: #02863A;
    cursor:pointer;
    transition: all 0.5s ease;
  }
  .cta-green-secondary:hover .cta-cap, .cta-green-secondary:hover .cta-angle {
    color: #fff;
    background-color: #01C351;
    transition: all 0.5s ease;
  }

/* dividing borders */
  .horizontal-line {
    border-left: 1px solid#fff;
    position: relative;
    left: 50%;
  }
  .vertical-line {
    border-top: 1px solid#fff;
    position: relative;
    top: 50%;
  }

/* icons */
  .proof-icon {
    margin-left: auto;
    margin-right: auto;
  }

/* margins */
  .no-margin-bottom {
    margin-bottom: 0px;
  }
  .no-margin-top {
    margin-top: 0px;
  }

/* responsive video */
  .video {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
  }
  .video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

/* data layout */
  .data-display > div:nth-child(odd) > h3 {
    text-align: left;
    border-bottom: 1px solid white;
    margin: 5px 0px 10px 0px;
  }
  .data-display > div:nth-child(even) > h3 {
    text-align: left;
    font-weight: 600;
  }

/* xs settings */
  @media screen and (max-width: 767px) {
    /* nav */
    .nav-outer {
      display: none;
    }
    /* central */
    h1 {
      font-size: 50px;
    }
    h2 {
      font-size: 40px;
      margin: 0px 0px 60px 0px;
    }
    h3 {
      font-size: 25px;
      font-weight: 400;
      margin: 15px 0px 15px 0px;
    }
    p {
      font-size: 20px ;
    }
    /* sections */
    .page-section {
      padding-top: 70px;
      padding-bottom: 30px;
    }
    .page-content {
      width: 100%;
      position: relative;
      min-height: 100%;
      overflow: visible;
      transition: all .5s;
      margin-bottom: 30px;
    }
    /* ctas */
    .cta-blue, .cta-blue-secondary, .cta-green, .cta-green-secondary {
      height: 45px;
      line-height: 45px;
      font-size: 20px;
      border-radius: 5px;
      margin-bottom: 20px;
    }
    .cta-cap {
      width: 48px;
      border-top-right-radius: 5px;
      border-bottom-right-radius: 5px;
    }
    .cta-angle {
      margin-right: -23px;
      width: 46px;
    }
    .cta-container .cta-angle p {
      font-size: 25px;
      line-height: 45px;
      margin-left: 35px;
      font-weight: 400;
      margin-top: 0px!important;
    }
    .cta-container p {
      font-size: 20px!important;
      line-height: 60px;
      margin-top: -10px;
      margin-bottom: -10px;
    }
    /* icons */
    .icon-circle-fill, .icon-circle-empty, .icon-open {
      max-width: 130px;
    }
    .icon-open.proof-icon {
      max-width: 250px;
    }
    /* data layout */
    .data-display > div:nth-child(even) > h3 {
      font-size: 40px;
      margin: initial;
    }
    .data-display > div:nth-child(odd) > h3 {
      font-size: 15px;
    }
    /* home page - hero */
    #hero {
      background-color: #814595!important;
      background-size: auto 1500px!important;
      background-attachment: fixed!important;
      background-position: top left!important;
      padding-top: 10px;
    }
    .hero-rate {
      width: 100%;
    }
    .rate-percent {
      padding-top: 35px;
      margin-bottom: 15px;
      margin-top: 35px;
      letter-spacing: -5px;
    }
    .hero-rate-box {
      width: 70%;
    }
    .hero-rate .rate {
      font-size: 150px;
      line-height: 10px;
      margin: 65px 0px 0px 0px;
    }
    .hero-rate .percent {
      bottom: 50px;
      line-height: 0px;
      letter-spacing: 2px;
      font-size: 80px;
    }
    /* home page promo content */
    #hero #promo-content {
      background-color: rgba(129,69,149,0.5);
      padding: 25px 0px;
      margin-bottom: -22px;
    }
    #hero #promo-content p {
      text-align: center;
      font-weight: 400;
      margin-bottom: 0px;
      font-size: 34px;
    }
    #hero #promo-content .cta-blue {
      margin: 15px 0px 0px 0px;
    }
    /* home page tabs */
    .tab-link {
      padding: 0px 40px 0px 40px;
      background-color: rgba(255, 255, 255, 0.75);
      margin-top: -3px;
      cursor: pointer;
    }
    .tab-link h2 {
      margin: 10px 0px 10px 0px;
    }
    .tab-link.tab-link-on {
      background-color: #fff;
      margin-top: -15px;
      cursor: initial;
    }
    #tab-invest-link.tab-link-on {
      border-top: 12px solid #00A0DC;
    }
    #tab-borrow-link.tab-link-on {
      border-top: 12px solid #01C351;
    }
    #tabs {
      position: fixed;
      width: 100%;
      z-index: 1;
      bottom: -23px;
    }
    .tab-triangle-blue{
      margin-top: -15px;
      float: left;
    }
    .tab-triangle-blue img {
      width: 50px;
      margin-right: -74px;
    }
    .tab-triangle-green {
      margin-top: -15px;
      margin-left: -43px;
      float: left;
      z-index: 1;
    }
    .tab-triangle-green img {
      width: 43px;
    }
    /* home page investor performance */
    #s-22 {
      background-color: #814595!important;
      background-size: auto 400px!important;
      background-position: top center!important;
    }
    /* home page investor video and borrower usps */
    #s-23 {
      background-color: #814595!important;
      background-size: auto 1750px!important;
      /* background-attachment: fixed!important;
      background-position: top center!important; */
    }
    /* home page investor process */
    #s-25 p {
      text-align: left;
    }
    #s-25 .icon-circle-empty, #s-25 .icon-circle-fill, #s-34 .icon-circle-empty, #s-34 .icon-circle-fill {
      max-width: 100px;
    }
    /* home page borrower usps */
    #s-33 {
      background-color: #814595!important;
      background-size: auto 2000px!important;
      /* background-attachment: fixed!important;
      background-position: top center!important; */
    }
  }

/* sm settings */
  @media screen and (min-width: 768px) {
    /* nav */
    .nav-outer {
      display: table-cell;
      vertical-align:middle;
      background-color: #814595;
    }
    .slide-nav {
      top: 120px;
    }
    /* central */
    h1 {
      font-size: 80px ;
      margin: 30px 0px 20px 0px;
    }
    h2 {
      font-size: 55px ;
      margin: 30px 0px 60px 0px;
    }
    h3 {
      font-size: 20px;
      font-weight: 400;
      margin: 40px 0px 35px 0px;
    }
    p {
      font-size: 18px ;
    }
    /* sections */
    .page-section {
      padding-top: 50px;
      padding-bottom: 50px;
    }
    .page-content {
      width: 100%;
    }
    /* ctas */
    .cta-container {
      margin-top: 60px;
    }          
    .cta-container p {
      font-size: 30px!important;
      line-height: 60px;
      margin-top: 0px;
      margin-bottom: 0px;
    }
    .cta-blue, .cta-blue-secondary, .cta-green, .cta-green-secondary {
      height: 60px;
      line-height: 60px;
      font-size: 20px;
      border-radius: 5px;
      margin-bottom: 20px;
    }
    .cta-cap {
      width: 48px;
      border-top-right-radius: 5px;
      border-bottom-right-radius: 5px;
    }
    .cta-angle {
      margin-right: -23px;
      width: 46px;
    }
    .cta-container .cta-angle p {
      font-size: 30px;
      font-weight: 400;
      margin-left: 20px;
      margin-top: 0px!important;
    }
    /* dividing borders */   
    .border-right {
      border-right: 1px solid #979797;
    }
    .border-left {
      border-left: 1px solid #979797;
    }
    .horizontal-line {
      height: 150px;
    }
    /* icons */
    .icon-join-right:after {
      content: "";
      background-color: #814595;
      height: 4px;
      display: block;
      position: relative;    
      top: -75px;
      left: 75%;
      width: 85%;
      z-index: -1;
    }
    .icon-open {
      max-width: 100px;
    }
    .icon-circle-empty, .icon-circle-fill {
      max-width: 150px;
    }
    .proof-icon {
      max-width: 90%;
      max-height: 100px;
    }
    .icon-open.proof-icon {
      max-width: initial;
    }
    /* data layout */
    .data-display > div:nth-child(even) > h3 {
      font-size: 60px;
      margin: -15px 0px 10px -20px;
    }
    h3.sub-text {
      margin-top: 20px;
      font-size: 20px!important;
    }
    /* home page - hero */
    #hero {
      background-color: #814595!important;
      background-size: auto 1500px!important;
      background-attachment: fixed!important;
      background-position: top left!important;
    }
    #hero-content {
      min-height: 750px;
    }
    .hero-rate {
      width: 42%;
    }
    .rate-percent {
      padding-top: 55px;
      margin-bottom: 15px;
      margin-top: 0px;
      letter-spacing: -5px;
    }
    .hero-rate-box {
      width: 90%;
    }
    .hero-rate .rate {
      font-size: 120px;
      line-height: 10px;
      margin: 65px 0px 0px 0px;
    }
    .hero-rate .percent {
      bottom: 43px;
      line-height: 0px;
      letter-spacing: 2px;
      font-size: 60px;
    }
    /* home page promo content */
    #hero #promo-content {
      background-color: rgba(129,69,149,0.5);
      padding: 25px 0px 35px 0px;
    }
    #hero #promo-content p {
      text-align: left;
      margin-bottom: 0px;
      font-weight: 400;
      font-size: 26px;
    }
    #hero #promo-content .cta-blue {
      margin: 5px 0px 0px 0px;
    }
    /* home page tabs */
    .tab-link {
      padding: 0px 80px 0px 80px;
      background-color: rgba(255, 255, 255, 0.5);
      cursor: pointer;
    }
    .tab-link h2 {
      margin: 25px 0px 15px 0px;
    }
    .tab-link.tab-link-on {
      background-color: #fff;
      margin-top: -15px;
      cursor: initial;
    }
    #tab-invest-link.tab-link-on {
      border-top: 15px solid #00A0DC;
    }
    #tab-borrow-link.tab-link-on {
      border-top: 15px solid #01C351;
    }
    .tab-content section:first-child {
      padding-top: 65px;
    }
    .tab-triangle-blue{
      margin-top: -15px;
      float: left;
    }
    .tab-triangle-blue img {
      width: 63px;
      margin-right: -74px;
    }
    .tab-triangle-green {
      margin-top: -15px;
      margin-left: -54px;
      float: left;
      z-index: 1;
    }
    .tab-triangle-green img {
      width: 54px;
    }
    /* home page investor performance */
    #s-22 {
      background-color: #814595!important;
      background-size: auto 300px!important;
      background-position: top center!important;
    }
    /* home page investor video and borrower usps */
    #s-23 {
      background-color: #814595!important;
      background-size: auto 1000px!important;
      /* background-attachment: fixed!important;
      background-position: top center!important; */
    }
    /* home page investor process */
    #s-25 .icon-circle-empty, #s-25 .icon-circle-fill, #s-34 .icon-circle-empty, #s-34 .icon-circle-fill {
      max-width: 130px;
    }
    /* home page borrower products */
    .borrower-product-decription {
      min-height: 200px;
    }
    /* home page borrower usp */
    #s-33 {
      background-color: #814595!important;
      background-size: auto 2000px!important;
      /* background-attachment: fixed!important;
      background-position: top center!important; */
    }
    .usp-line {
      display: block;
      position: relative;
      width: 220%;
      left: -60%;
      top: 125px;
      height: 2px;
      background-color: #fff;
    }
    _:-ms-fullscreen, :root .usp-line { top: 175px!important; }
  }

/* md settings */
  @media screen and (min-width: 992px) {
    /* central */
    h1 {
      font-size: 70px;
      margin: 40px 0px 5px 0px;
    }
    h2 {
      font-size: 55px ;
      margin: 30px 0px 60px 0px;
    }
    h3 {
      font-size: 20px;
      font-weight: 400;
      margin: 40px 0px 35px 0px;
    }
    p {
      font-size: 17px ;
    }
    .sub-text {
      line-height: 20px;
    }
    /* sections */
    .page-section {
      padding-top: 50px;
      padding-bottom: 50px;
    }
    .page-content {
      width: 970px;
      margin-left: auto;
      margin-right: auto;
    }
    /* ctas */
    .cta-blue, .cta-blue-secondary, .cta-green, .cta-green-secondary {
      height: 60px;
      line-height: 60px;
      font-size: 25px;
    }
    .cta-container .col-sm-5 {
      width: 45%          
    }
    .cta-container .col-md-2 {
      width: 10%          
    }
    h3.sub-text {
      margin-top: 40px;
    }
    /* dividing borders */
    .horizontal-line {
      height: 120px;
    }
    /* home hero */
    #hero {
      background-color: #814595!important;
      background-size: auto 1500px!important;
      background-attachment: fixed!important;
      background-position: top left!important;
    }
    #hero-content {
      height: 900px;
      margin-bottom: -150px;
    }
    #hero p {
      font-size: 20px;
    }
    .hero-rate-box {
      width: 70%;
    }
    .hero-rate .rate {
      font-size: 120px;
      line-height: 10px;
      margin: 65px 0px 0px 0px;
    }
    .hero-rate .percent {
      bottom: 50px;
      line-height: 0px;
      letter-spacing: 2px;
      font-size: 40px;
    }
    .rate-percent {
      padding-top: 40px;
      margin-bottom: 5px;
    }
    /* home page promo content */
    #hero #promo-content p {
      font-size: 34px;
    }
    #hero #promo-content .cta-blue {
      margin: 15px 0px 0px 0px;
    }
    .promo-arrow-right {
      transform: rotate(-90deg);
      -webkit-transform: rotate(-90deg);
      -ms-transform: rotate(-90deg);
      position: relative;
      top: -37px;
      width: 20px;
      right: -69%;
    }
    .promo-arrow-left {
      transform: rotate(-90deg);
      -webkit-transform: rotate(-90deg);
      -ms-transform: rotate(-90deg);
      position: relative;
      top: -73px;
      width: 20px;
      right: -28%;
    }
    /* home page tabs */
    .tab-link {
      padding: 0px 60px 0px 60px;
    }
    .tab-content section:first-child {
      padding-top: 80px;
    }
    /* home page investor performance */
    #s-22 {
      background-color: #814595!important;
      background-size: cover!important;
      background-position: top center!important;
    }
    /* home page investor video */
    #s-23 {
      background-color: #814595!important;
      background-size: cover!important;
      background-attachment: fixed!important;
      background-position: top center!important;
    }
    /* home page borrower products */
    .borrower-product-decription {
      min-height: 120px;
    }
    /* home page borrower usps */
    #s-33 {
      background-color: #814595!important;
      background-size: cover!important;
      background-attachment: fixed!important;
      background-position: top center!important;
    }
  }

/* lg settings */
  @media screen and (min-width: 1200px) {
    /* central */
    h1 {
      font-size: 100px ;
      margin: 30px 0px 0px 0px;
    }
    h2 {
      font-size: 55px ;
      margin: 30px 0px 60px 0px;
    }
    h3 {
      font-size: 20px;
      font-weight: 400;
      margin: 40px 0px 35px 0px;
    }
    p {
      font-size: 17px ;
    }
    .sub-text {
      line-height: 20px;
    }
    /* sections */
    .page-section {
      padding-top: 50px;
      padding-bottom: 100px;
    }
    .page-section.section-bar {
      padding-top: 50px;
      padding-bottom: 60px;
    }
    .page-content {
      width: 1170px;
      margin-left: auto;
      margin-right: auto;
    }
    /* dividing borders */
    .horizontal-line {
      height: 150px;
    }
    /* icons */
    .icon-join-right:after {
      content: "";
      background-color: #814595;
      height: 4px;
      display: block;
      position: relative;
      top: -75px;
      left: 68%;
      width: 90%;
      z-index: -1;
    }
    /* home hero */
    #hero p {
      font-size: 25px;
    }
    #hero {
      background-size: auto 1800px!important;
    }
    #hero-content {
      /* height: 100vh; */
      min-height: 900px;
      margin-bottom: -35px;
    }
    .hero-rate .rate {
      font-size: 130px;
      line-height: 10px;
      margin: 65px 0px 0px 0px;
    }
    .hero-rate .percent {
      bottom: 50px;
      line-height: 0px;
      letter-spacing: 2px;
      font-size: 60px;
    }
    .rate-percent {
      padding-top: 55px;
      margin-bottom: 15px;
      margin-top: 0px;
      letter-spacing: -5px;
    }
    /* home page promo content */
    #hero #promo-content p {
      font-size: 40px;
    }
    .promo-arrow-right {
      right: -70%;
    }
    .promo-arrow-left {
      right: -28%;
    }
    _:-ms-fullscreen, :root #svg-100 { margin-top: -30px!important; }
    /* home page tabs */
    .tab-content section:first-child {
      padding-top: 100px;
    }
  }


/* ----- home page ----- */

  /* hero */
    /* spacing */
    #hero {
      padding-bottom:0px
    }

    /* headlines & rates */
    #hero p, #hero span, #hero sub {
      color: #fff;
      text-align: center;
    }
    .hero-rate-box {
      margin-left: auto;
      margin-right: auto;
      margin-bottom: 65px;
    }
    .hero-rate {
      float: left;
    }
    .hero-rate .rate {
      text-align: center;
      font-weight: 600;
      color: #fff;
    }
    .hero-rate .percent {
      position: relative;
      font-weight: 600;
    }
    .hero-rate-or {
      float: left;
      width: 16%;
    }

    /* hero down arrow positioning */
    @media screen and (min-height: 900px) and (min-width: 992px){
      #hero .down-arrow-white {
        position: absolute;
        top: 90vh;
        left: 50%;
        margin-left: -15px;
      }
      .hero-rate-box {
        margin-top: 5vh;
      }
    }

    /* fix firefox */
    @-moz-document url-prefix() { 
      .tab-triangle-green {
        margin-top: -14px;;
      }
    }


  /* investor usp's */

  /* investor performance */

  /* investor video */

  /* investor proof */
  #icon-bbb {
    max-width: 100%;
  }

  /* investor process */
  .process-step {
    text-align: center;
    min-height: 125px;
  }
  #s-25 p {
    margin-top: 20px;
  }
  .cta-angle p {
    margin-top: 0px!important;
    margin-left: 20px;
    font-size: 35px!important;
    font-weight: 400;
  }
  /* borrower products */

  /* borrower proof */

  /* borrower usp's */
  .line-circle {
    display: block;
    height: 15px;
    width: 15px;
    border-radius: 50%;
    background-color: #fff;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: -30px;
    margin-top: 10px;
  }

  /* borrower process */

 /* ctas */
.cta-blue, .cta-blue-secondary, .cta-green, .cta-green-secondary, .cta-purple-secondary {
    text-align: center;
    font-weight: 600;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    -moz-min-width: 215px;
    -ms-min-width: 215px;
    -o-min-width: 215px;
    -webkit-min-width: 215px;
    min-width: 215px;
}

.cta-cap {
    float: right;
    height: 100%;
}

.cta-angle {
    text-align: right;
    float: right;
    transform: skew(-30deg);
    height: 100%;
}

    .cta-angle p {
        color: #fff;
    }

    .cta-angle div {
        transform: skew(30deg);
    }

/* New design */
.cta-2 {
    width: 215px;
    height: 45px;
    border-radius: 5px;
    display: inline-block;
    line-height: 45px;
    white-space: nowrap;
    text-align: center;
}

.cta-2, .cta-2 * {
    font-size: 20px;
    font-weight: 600;
    letter-spacing: -1px;
    border: none;
    padding: 0;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    color: white;
}

    .cta-2 a {
        border-bottom-style: none;
    }

    .cta-2 .cta-cap {
        width: 40px;
        border-radius: 0 3px 3px 0;
    }

    .cta-2 .cta-angle {
        margin-right: -20px;
    }

        .cta-2 .cta-angle p {
            line-height: inherit;
            font-size: 26px;
            transform: skew(30deg);
            color: white !important;
            margin: 0;
            text-align: right;
        }

.cta-2:hover, .cta-2:hover * {
    cursor: pointer;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    color: white;
}

/* Extra Large */

.cta-2.xl {
    width: 340px;
    height: 60px;
    line-height: 60px;
}

.cta-2.xl, .cta-2.xl * {
    font-size: 24px;
    font-weight: 600;
}
    
    .cta-2 .cta-angle.xl {
        margin-right: -20px;
    }

    .cta-2.xl .cta-angle p {
        font-size: 33px;
    }

/* Scaling */

.cta-2.full {
    width: 100%;
}

.cta-2.scaling {
    padding-left: 20px;
    -moz-min-width: 150px;
    -ms-min-width: 150px;
    -o-min-width: 150px;
    -webkit-min-width: 150px;
    min-width: 150px;
    max-width: 100%;
    width: auto;
}

.cta-2.scaling.xl {
    padding-left: 25px;
}

.cta-2.scaling .cta-angle {
    margin-left: 20px;
}

.cta-2.scaling * {
   padding: 0; 
}

.cta-2.limited {
    max-width: 100%;
}

/* Directional buttons */

.cta-2.confirm, .cta-2.next {
    float: right;
}

.cta-2.back .cta-cap {
    float: left;
    height: 100%;
    border-radius: 3px 0 0 3px;
}

.cta-2.back .cta-angle {
    float: left;
    text-align: left;
    margin-left: -26px;
    margin-right: 0;
    transform: skew(30deg);
}
        .cta-2.back .cta-angle p {
            transform: skew(-30deg);
            padding-left: 5px;
            text-align: left;
        }

    .cta-2.back.xl .cta-angle {
        margin-left: -20px;
    }

.cta-2.back.scaling {
    padding-left: 0;
    padding-right: 20px;
}

.cta-2.back.scaling  .cta-angle {
    margin-right: 20px;
}

.cta-2.back.scaling.xl {
    padding-left: 0;
    padding-right: 25px;
}

.cta-2.central {
    margin-left: auto;
    margin-right: auto;
    float: none;
    display: block;
}

/* Multi-line */

.cta-2 .multiline {
    font-weight: 500;
    font-size: 12px;
    line-height: 14px;
}

.cta-2 .multiline, .cta-2 .multiline * { 
    display: inline-block;
    vertical-align: middle;
    margin: 0;
}

.cta-2 .multiline * {
    font-size: 18px;
    line-height: 18px;
}

.cta-2.large .multiline, .cta-2.xl .multiline {
    font-size: 14px;
    line-height: 16px;
}

.cta-2.large .multiline *, .cta-2.xl .multiline * {
    font-size: 22px;
    line-height: 22px;
}

/* Colours */

.cta-2.alt, .cta-2.purple {
    border: 2px solid black;
    border-radius: 5px;
    line-height: 42px;
}

.cta-2.alt.xl, .cta-2.purple.xl {
    line-height: 56px;
}

/* New blue */

.cta-2.blue, .cta-2.blue:hover .cta-angle, .cta-2.blue:hover .cta-cap {
    background-color: #00A0DC;
}

.cta-2.blue:hover, .cta-2.blue .cta-angle, .cta-2.blue .cta-cap, .cta-2.blue.alt:hover {
    background-color: #01709B;
}

.cta-2.blue.alt {
    background-color: #fff;
    border-color: #00A0DC;
}

.cta-2.blue.alt, .cta-2.blue.alt * {
    color: #00A0DC;
}

.cta-2.blue.alt:hover, .cta-2.blue.alt:hover * {
    color: white;
}

/* New green */

.cta-2.green, .cta-2.green:hover .cta-angle, .cta-2.green:hover .cta-cap {
    background-color: #01C351;
}

.cta-2.green:hover, .cta-2.green .cta-angle, .cta-2.green .cta-cap, .cta-2.green.alt:hover {
    background-color: #02863A;
}

.cta-2.green.alt {
    background-color: white;
    border-color: #01C351;
}

.cta-2.green.alt, .cta-2.green.alt * {
    color: #01C351;
}

.cta-2.green.alt:hover, .cta-2.green.alt:hover * {
    color: white;
}

/* New purple */

.cta-2.purple {
    border-radius: 7px;
}

.cta-2.purple, .cta-2.purple:hover .cta-angle, .cta-2.purple:hover .cta-cap {
    border-color: #814595;
    background-color: #814595;
}

.cta-2.purple:hover, .cta-2.purple.alt:hover {
    background-color: #663477;
}

.cta-2.purple .cta-angle, .cta-2.purple .cta-cap {
    background-color: white;
}

.cta-2.purple .cta-angle p, .cta-2.purple.alt:hover .cta-angle p {
    color: #814595 !important;
}

.cta-2.purple.alt, .cta-2.purple.alt:hover .cta-angle,
.cta-2.purple.alt:hover .cta-cap {
    background-color: white;
    border-color: #814595;
}

.cta-2.purple.alt .cta-cap, .cta-2.purple.alt .cta-angle, .cta-2.purple.alt:hover {
    background-color: #814595;
}

.cta-2.purple:hover .cta-angle p, .cta-2.purple.alt:hover, 
.cta-2.purple.alt .cta-angle p {
    color: white !important;
}

.cta-2.purple.alt, .cta-2.purple.alt * {
    color: #814595;
}

.cta-2.purple.alt:hover, .cta-2.purple.alt:hover * {
    color: white;
}

/* Disabled */

.cta-2.disabled {
    background-color: #fff !important;
    border: 2px solid #CACACA !important;
}

.cta-2.disabled .cta-angle, .cta-2.disabled .cta-cap {
    background-color: #CACACA !important;
}

.cta-2.disabled, .cta-2.disabled * {
    color: #CACACA !important;
    -webkit-transition: none;
    -moz-transition: none;
    -ms-transition: none;
    -o-transition: none;
    transition: none;
    cursor: not-allowed !important;
}

/* old colours (deprecated) */

/* blue */
.cta-blue {
    color: #fff;
    background-color: #00A0DC;
}

    .cta-blue .cta-angle, .cta-blue .cta-cap {
        color: #fff;
        background-color: #01709B;
    }

    .cta-blue:hover {
        color: #fff;
        background-color: #01709B;
        cursor: pointer;
        transition: all 0.5s ease;
    }

        .cta-blue:hover .cta-cap, .cta-blue:hover .cta-angle {
            color: #fff;
            background-color: #00A0DC;
            transition: all 0.5s ease;
        }

/* blue secondary */
.cta-blue-secondary {
    color: #00A0DC;
    background-color: #fff;
    border: 2px solid #00A0DC;
}

    .cta-blue-secondary .cta-cap {
        border-radius: 5px;
    }

    .cta-blue-secondary .cta-angle, .cta-blue-secondary .cta-cap {
        color: #fff;
        background-color: #01709B;
    }

    .cta-blue-secondary:hover {
        color: #fff;
        background-color: #01709B;
        cursor: pointer;
        transition: all 0.5s ease;
    }

        .cta-blue-secondary:hover .cta-cap, .cta-blue-secondary:hover .cta-angle {
            color: #fff;
            background-color: #00A0DC;
            transition: all 0.5s ease;
        }

/* green */
.cta-green {
    color: #fff;
    background-color: #01C351;
}

    .cta-green .cta-angle, .cta-green .cta-cap {
        color: #fff;
        background-color: #02863A;
    }

    .cta-green:hover {
        color: #fff;
        background-color: #02863A;
        cursor: pointer;
        transition: all 0.5s ease;
    }

        .cta-green:hover .cta-cap, .cta-green:hover .cta-angle {
            color: #fff;
            background-color: #01C351;
            transition: all 0.5s ease;
        }

/* green secondary */
.cta-green-secondary {
    color: #01C351;
    background-color: #fff;
    border: 2px solid #01C351;
}

    .cta-green-secondary .cta-cap {
        border-radius: 5px;
    }

    .cta-green-secondary .cta-angle, .cta-green-secondary .cta-cap {
        color: #fff;
        background-color: #02863A;
    }

    .cta-green-secondary:hover {
        color: #fff;
        background-color: #02863A;
        cursor: pointer;
        transition: all 0.5s ease;
    }

        .cta-green-secondary:hover .cta-cap, .cta-green-secondary:hover .cta-angle {
            color: #fff;
            background-color: #01C351;
            transition: all 0.5s ease;
        }

/* purple */
.cta-purple {
    color: #fff;
    background-color: #814595;
    border: 2px solid #814595;
    text-align: center;
}

    .cta-purple .cta-cap {
        border-radius: 5px;
    }

    .cta-purple .cta-angle, .cta-purple .cta-cap {
        color: #814595;
        background-color: #fff;
    }

    .cta-purple:hover {
        color: #fff;
        background-color: #663477;
        cursor: pointer;
        transition: all 0.5s ease;
    }

        .cta-purple:hover .cta-cap, .cta-purple:hover .cta-angle {
            color: #fff;
            background-color: #814595;
            transition: all 0.5s ease;
        }

            .cta-purple .cta-angle p {
                color: #814595;
            }

            .cta-purple:hover .cta-angle p {
                color: #fff;
            }

/* purple secondary */
.cta-purple-secondary {
    color: #814595;
    background-color: #fff;
    border: 2px solid #8a2be2;
}

    .cta-purple-secondary .cta-cap {
        border-radius: 5px;
    }

    .cta-purple-secondary .cta-angle, .cta-purple-secondary .cta-cap {
        color: #fff;
        background-color: #814595;
    }

    .cta-purple-secondary:hover {
        color: #fff;
        background-color: #814595;
        cursor: pointer;
        transition: all 0.5s ease;
    }

        .cta-purple-secondary:hover .cta-cap, .cta-purple-secondary:hover .cta-angle {
            color: #814595;
            background-color: #fff;
            transition: all 0.5s ease;
        }

            .cta-purple-secondary:hover .cta-angle p {
                color: #814595;
            }

/* xs settings */
@media screen and (max-width: 767px) {
    /* ctas */
    .cta-blue, .cta-blue-secondary, .cta-green, .cta-green-secondary , .cta-purple, .cta-purple-secondary {
        height: 45px;
        line-height: 45px;
        font-size: 20px;
        border-radius: 5px;
        margin-bottom: 20px;
    }

    .cta-cap {
        width: 48px;
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
    }

    .cta-angle {
        margin-right: -23px;
        width: 46px;
    }

    .cta-container .cta-angle p {
        font-size: 25px;
        line-height: 45px;
        margin-left: 35px;
        font-weight: 400;
        margin-top: 0px!important;
    }

    .cta-container p {
        font-size: 20px!important;
        line-height: 60px;
        margin-top: -10px;
        margin-bottom: -10px;
    }

    #hero #promo-content .cta-blue {
        margin: 15px 0px 0px 0px;
    }
}

/* sm settings */
@media screen and (min-width: 768px) {
    /* ctas */
    .cta-container {
        margin-top: 60px;
    }

        .cta-container p {
            font-size: 30px!important;
            line-height: 60px;
            margin-top: 0px;
            margin-bottom: 0px;
        }

    .cta-blue, .cta-blue-secondary, .cta-green, .cta-green-secondary, .cta-purple, .cta-purple-secondary {
        height: 60px;
        line-height: 60px;
        font-size: 20px;
        border-radius: 5px;
        margin-bottom: 20px;
    }

    .cta-cap {
        width: 48px;
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
    }

    .cta-angle {
        margin-right: -23px;
        width: 46px;
    }

    .cta-container .cta-angle p {
        font-size: 30px;
        font-weight: 400;
        margin-left: 20px;
        margin-top: 0px!important;
    }

    #hero #promo-content .cta-blue {
        margin: 5px 0px 0px 0px;
    }
}

/* md settings */
@media screen and (min-width: 992px) {
    /* ctas */
    .cta-blue, .cta-blue-secondary, .cta-green, .cta-green-secondary, .cta-purple, .cta-purple-secondary {
        height: 60px;
        line-height: 60px;
        font-size: 25px;
    }

    .cta-container .col-sm-5 {
        width: 45%;
    }

    .cta-container .col-md-2 {
        width: 10%;
    }

    #hero #promo-content .cta-blue {
        margin: 15px 0px 0px 0px;
    }
}


/* lg settings */
@media screen and (min-width: 1200px) {
    .cta-angle p {
        margin-top: 0!important;
        margin-left: 20px;
        font-size: 35px;
        font-weight: 400;
    }
}

/*Clear button style*/

.ctaButtonClear {
    background: none!important;
    border: none;
    padding: 0!important;
}