/* styles for @clarksource/client/styles/app.css */
@keyframes bounceInDown {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-30px);
  }
  60% {
    transform: translateY(-15px);
  }
}

@keyframes dash {
  0% {
    stroke-dasharray: 1, 200;
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dasharray: 89, 200;
    stroke-dashoffset: -35px;
  }
  100% {
    stroke-dasharray: 89, 200;
    stroke-dashoffset: -124px;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes rotate {
  100% {
    transform: rotate(360deg);
  }
}

@keyframes rotateCurvedArrow {
  from {
    transform-origin: center top;
    transform: rotate3d(0, 0, 10, 30deg);
    opacity: 0;
  }
  to {
    transform-origin: center top;
    transform: translate3d(0, 0, 0deg);
    opacity: 1;
  }
}

@keyframes zoominoutsinglefeatured {
  0% {
    transform: scale(1, 1);
  }
  50% {
    transform: scale(1.2, 1.2);
  }
  100% {
    transform: scale(1, 1);
  }
}


/* The :global pseudoselector prevents ember-css-modules from hashing class names */
 {
  /* END: modules/demandcheck/demandcheck */
}
[data-ember-action] {
    cursor: pointer;
  }
.hide {
    display: none !important;
  }
/*for elements that need 100% height on the page*/
.debug-text {
    background-color: red;
    color: white;
    padding: 2px;
    border-radius: 3px;
    font-size: 11px;
    line-height: 11px;
  }
.debug-text--button {
    width: 100%;
    float: left;
  }
/* BEGIN: modules/app/ember-custom-radio */
.ember-custom-radio {
    top: 19px;
    margin: 0;
  }
.ember-custom-radio__text {
    padding-left: 25px;
    line-height: 60px;
  }
.clark2 .ember-custom-radio__text {
    color: #283e66;
  }
.ember-custom-radio__label {
    padding-left: 40px;
    padding-top: 2px;
    margin: 0 10px 0 0;
  }
/* END: modules/app/ember-custom-radio */
/* BEGIN: brand/typography */
@font-face {
    font-family: "Cera Round Pro";
    font-weight: 700;
    src: local("CeraRoundPro-Bold"), url("https://app.clark.de/assets/fonts/CeraRoundPro-Bold-46a8ca34a6741cd6a5fcb24374bc17ba.woff") format("woff"), url("https://app.clark.de/assets/fonts/CeraRoundPro-Bold-777bcfe6cbf73d808cde25e4e6ea6610.ttf") format("truetype");
    font-style: normal;
  }
@font-face {
    font-family: "Cera Round Pro";
    font-weight: 500;
    src: local("CeraRoundPro-Medium"), url("https://app.clark.de/assets/fonts/CeraRoundPro-Medium-37e56931d6e1178581da05de57355b95.woff") format("woff"), url("https://app.clark.de/assets/fonts/CeraRoundPro-Medium-7e617f11754ed6a4378977d90562c0b3.ttf") format("truetype");
    font-style: normal;
  }
@font-face {
    font-family: "Cera Round Pro";
    font-weight: 400;
    src: local("CeraRoundPro-Regular"), url("https://app.clark.de/assets/fonts/CeraRoundPro-Regular-0987ee886588a1b62af79e0ea456db9d.woff") format("woff"), url("https://app.clark.de/assets/fonts/CeraRoundPro-Regular-86f1c2945c600ed89554875a9e52aed5.ttf") format("truetype");
    font-style: normal;
  }
@font-face {
    font-family: "Cera Round Pro";
    font-weight: 300;
    src: local("CeraRoundPro-Light"), url("https://app.clark.de/assets/fonts/CeraRoundPro-Light-77f3f70ccddba33a925ea9d83a2b5b74.woff") format("woff"), url("https://app.clark.de/assets/fonts/CeraRoundPro-Light-5e83b7d23c59612d3c87ec475574816e.ttf") format("truetype");
    font-style: normal;
  }
@font-face {
    font-family: "Tiempos Headline";
    font-weight: 400;
    src: local("TiemposHeadline-Regular"), url("https://app.clark.de/assets/fonts/TiemposHeadline-Regular-dba5419369c99e7cc0c95fb47eafe236.woff") format("woff"), url("https://app.clark.de/assets/fonts/TiemposHeadline-Regular-23378ffd609557cb01c51816e9d459f8.ttf") format("truetype");
    font-style: normal;
  }
@font-face {
    font-family: "Tiempos Headline";
    font-weight: 600;
    src: local("TiemposHeadline-Semibold"), url("https://app.clark.de/assets/fonts/TiemposHeadline-Semibold-46296af55ecfe5413a8d2dd5ef18ff64.woff") format("woff"), url("https://app.clark.de/assets/fonts/TiemposHeadline-Semibold-89d3686938f64dcc5b8aa5fc766a33c8.ttf") format("truetype");
    font-style: normal;
  }
@font-face {
    font-family: "Tiempos Headline";
    font-weight: 500;
    src: local("TiemposHeadline-Medium"), url("https://app.clark.de/assets/fonts/TiemposHeadline-Medium-5768b69188fcf52b5bdaa54b17230803.woff") format("woff"), url("https://app.clark.de/assets/fonts/TiemposHeadline-Medium-bc04dc6afe074fe13c7a3781a4120347.ttf") format("truetype");
    font-style: normal;
  }
/* ================= HEADERS ================= */
/* ================= General text ================= */
/* ================= General text ================= */
.font-bold {
    font-weight: 500;
  }
.clark2 .font-bold {
    font-weight: 600;
  }
.font-regular {
    font-weight: 300;
  }
.clark2 .font-regular {
    font-weight: 400;
  }
.font-semi-bold {
    font-weight: 400;
  }
.clark2 .font-semi-bold {
    font-weight: 300;
  }
.font-light {
    font-weight: 300;
  }
body {
    font-family: "Cera Round Pro", sans-serif;
    color: #333;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
  }
body.clark2 {
    color: #283e66;
  }
p {
    font-size: 14px;
    line-height: 22px;
  }
.clark2 h1, .clark2 h2, .clark2 h3, .clark2 h4 {
    font-weight:500
  }
.clark2 h1>small {
    font-weight:400
  }
.center {
    text-align: center;
  }
.center--mobile {
    text-align: center;
  }
@media only screen and (min-width: 730px) {
    .center--mobile {
      text-align: left;
    }
  }
.text-max-width {
    max-width: 250px;
    margin: auto;
  }
.font-white {
    color: #fff;
  }
.font-grey-dark {
    color: #787878;
  }
.font-blue {
    color: #2b6cde;
  }
.text--is-small {
    font-size: 0.8em;
    line-height: 1.1;
  }
/* IMPRINT SECTION */
.text-page {
    text-align: left;
    max-width: 70em;
    margin: 0 auto 4em auto;
    padding-left: 16px;
    padding-right: 16px;
    font-size: 14px;
    line-height: 22px;
    color: #626262;
    font-weight: 300;
    word-break: break-word;
    /* spacing the paragraphs and the lists */
  }
@media only screen and (min-width: 450px) {
    .text-page {
      font-size: 15px;
      line-height: 20px;
    }
  }
@media only screen and (min-width: 730px) {
    .text-page {
      line-height: 20px;
    }
  }
@media only screen and (min-width: 1000px) {
    .text-page {
      font-size: 15px;
      line-height: 20px;
    }
  }
@media only screen and (min-width: 730px) {
    .text-page {
      padding-left: 2rem;
      padding-right: 2rem;
      margin: 6rem auto;
    }
  }
.text-page h1, .text-page h2, .text-page h3, .text-page h4, .text-page h5 {
    color: #333;
  }
.text-page h3 {
    margin: 0;
    padding: 0 0 15px 0;
  }
@media only screen and (min-width: 730px) {
    .text-page h3 {
      padding-bottom: 20px;
    }
  }
.text-page__a, .text-page a {
    color: #626262;
  }
.text-page__strong {
    color: #333;
    font-weight: 500;
  }
.text-page article, .text-page__article {
    padding-bottom: 35px;
  }
@media only screen and (min-width: 730px) {
    .text-page article, .text-page__article {
      padding-bottom: 40px;
    }
  }
.text-page article:last-child, .text-page__article:last-child {
    padding-bottom: 0;
  }
.text-page p, .text-page__p, .text-page ul, .text-page__ul, .text-page ol, .text-page__ol {
    margin: 0;
    padding-bottom: 15px;
  }
@media only screen and (min-width: 730px) {
    .text-page p, .text-page__p, .text-page ul, .text-page__ul, .text-page ol, .text-page__ol {
      padding-bottom: 20px;
    }
  }
.text-page p:last-child, .text-page__p:last-child, .text-page ul:last-child, .text-page__ul:last-child, .text-page ol:last-child, .text-page__ol:last-child {
    padding-bottom: 0;
  }
.text-page__header {
    padding-left: 16px;
    padding-top: 2rem;
    max-width: 70em;
    margin: 0 auto;
  }
@media only screen and (min-width: 730px) {
    .text-page__header {
      padding-left: 2rem;
    }
  }
.text-page__header .text-page__logo-link {
    display: block;
    width: 7.5rem;
  }
@media only screen and (min-width: 730px) {
    .text-page__header .text-page__logo-link {
      width: 11.25rem;
    }
  }
.text-page__header .text-page__logo {
    width: inherit;
    height: auto;
  }
.text-page__ul, .text-page ul, .text-page__ol, .text-page ol {
    padding-left: 20px;
    margin: 0;
  }
.text-page__ul li, .text-page ul li, .text-page__ol li, .text-page ol li {
    padding-left: 5px;
  }
.imrpint strong {
    color: #333;
    font-weight: 500;
  }
/* For Homepage */
.mega-headline {
    font-size: 24px;
    line-height: 30px;
  }
@media only screen and (min-width: 450px) {
    .mega-headline {
      font-size: 26px;
      line-height: 32px;
    }
  }
@media only screen and (min-width: 730px) {
    .mega-headline {
      font-size: 35px;
      line-height: 44px;
    }
  }
@media only screen and (min-width: 1000px) {
    .mega-headline {
      font-size: 44px;
      line-height: 50px;
    }
  }
.half_size {
    width: 55%;
  }
.error-text {
    color: #fd5740;
  }
/* END: brand/typography */

/* BEGIN: modules/app/grid */
/*
    Generated from https://getbootstrap.com/docs/3.3/customize
    and added some of our media queries in here
  */
.container {
    margin-right: auto;
    margin-left: auto;
    padding-left: 8px;
    padding-right: 8px;
  }
@media only screen and (min-width: 730px) {
    .container {
      padding-left: 16px;
      padding-right: 16px;
    }
  }
.container-fluid {
    margin-right: auto;
    margin-left: auto;
    padding-left: 16px;
    padding-right: 16px;
  }
.row {
    margin-left: -8px;
    margin-right: -8px;
  }
@media only screen and (min-width: 730px) {
    .row {
      margin-left: -16px;
      margin-right: -16px;
    }
  }
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
    position: relative;
    min-height: 1px;
    padding-left: 16px;
    padding-right: 16px;
  }
.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
    float: left;
  }
.col-xs-12 {
    width: 100%;
  }
.col-xs-11 {
    width: 91.66666667%;
  }
.col-xs-10 {
    width: 83.33333333%;
  }
.col-xs-9 {
    width: 75%;
  }
.col-xs-8 {
    width: 66.66666667%;
  }
.col-xs-7 {
    width: 58.33333333%;
  }
.col-xs-6 {
    width: 50%;
  }
.col-xs-5 {
    width: 41.66666667%;
  }
.col-xs-4 {
    width: 33.33333333%;
  }
.col-xs-3 {
    width: 25%;
  }
.col-xs-2 {
    width: 16.66666667%;
  }
.col-xs-1 {
    width: 8.33333333%;
  }
.col-xs-pull-12 {
    right: 100%;
  }
.col-xs-pull-11 {
    right: 91.66666667%;
  }
.col-xs-pull-10 {
    right: 83.33333333%;
  }
.col-xs-pull-9 {
    right: 75%;
  }
.col-xs-pull-8 {
    right: 66.66666667%;
  }
.col-xs-pull-7 {
    right: 58.33333333%;
  }
.col-xs-pull-6 {
    right: 50%;
  }
.col-xs-pull-5 {
    right: 41.66666667%;
  }
.col-xs-pull-4 {
    right: 33.33333333%;
  }
.col-xs-pull-3 {
    right: 25%;
  }
.col-xs-pull-2 {
    right: 16.66666667%;
  }
.col-xs-pull-1 {
    right: 8.33333333%;
  }
.col-xs-pull-0 {
    right: auto;
  }
.col-xs-push-12 {
    left: 100%;
  }
.col-xs-push-11 {
    left: 91.66666667%;
  }
.col-xs-push-10 {
    left: 83.33333333%;
  }
.col-xs-push-9 {
    left: 75%;
  }
.col-xs-push-8 {
    left: 66.66666667%;
  }
.col-xs-push-7 {
    left: 58.33333333%;
  }
.col-xs-push-6 {
    left: 50%;
  }
.col-xs-push-5 {
    left: 41.66666667%;
  }
.col-xs-push-4 {
    left: 33.33333333%;
  }
.col-xs-push-3 {
    left: 25%;
  }
.col-xs-push-2 {
    left: 16.66666667%;
  }
.col-xs-push-1 {
    left: 8.33333333%;
  }
.col-xs-push-0 {
    left: auto;
  }
.col-xs-offset-12 {
    margin-left: 100%;
  }
.col-xs-offset-11 {
    margin-left: 91.66666667%;
  }
.col-xs-offset-10 {
    margin-left: 83.33333333%;
  }
.col-xs-offset-9 {
    margin-left: 75%;
  }
.col-xs-offset-8 {
    margin-left: 66.66666667%;
  }
.col-xs-offset-7 {
    margin-left: 58.33333333%;
  }
.col-xs-offset-6 {
    margin-left: 50%;
  }
.col-xs-offset-5 {
    margin-left: 41.66666667%;
  }
.col-xs-offset-4 {
    margin-left: 33.33333333%;
  }
.col-xs-offset-3 {
    margin-left: 25%;
  }
.col-xs-offset-2 {
    margin-left: 16.66666667%;
  }
.col-xs-offset-1 {
    margin-left: 8.33333333%;
  }
.col-xs-offset-0 {
    margin-left: 0%;
  }
@media only screen and (min-width: 450px) {
    .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
      float: left;
    }

    .col-sm-12 {
      width: 100%;
    }

    .col-sm-11 {
      width: 91.66666667%;
    }

    .col-sm-10 {
      width: 83.33333333%;
    }

    .col-sm-9 {
      width: 75%;
    }

    .col-sm-8 {
      width: 66.66666667%;
    }

    .col-sm-7 {
      width: 58.33333333%;
    }

    .col-sm-6 {
      width: 50%;
    }

    .col-sm-5 {
      width: 41.66666667%;
    }

    .col-sm-4 {
      width: 33.33333333%;
    }

    .col-sm-3 {
      width: 25%;
    }

    .col-sm-2 {
      width: 16.66666667%;
    }

    .col-sm-1 {
      width: 8.33333333%;
    }

    .col-sm-pull-12 {
      right: 100%;
    }

    .col-sm-pull-11 {
      right: 91.66666667%;
    }

    .col-sm-pull-10 {
      right: 83.33333333%;
    }

    .col-sm-pull-9 {
      right: 75%;
    }

    .col-sm-pull-8 {
      right: 66.66666667%;
    }

    .col-sm-pull-7 {
      right: 58.33333333%;
    }

    .col-sm-pull-6 {
      right: 50%;
    }

    .col-sm-pull-5 {
      right: 41.66666667%;
    }

    .col-sm-pull-4 {
      right: 33.33333333%;
    }

    .col-sm-pull-3 {
      right: 25%;
    }

    .col-sm-pull-2 {
      right: 16.66666667%;
    }

    .col-sm-pull-1 {
      right: 8.33333333%;
    }

    .col-sm-pull-0 {
      right: auto;
    }

    .col-sm-push-12 {
      left: 100%;
    }

    .col-sm-push-11 {
      left: 91.66666667%;
    }

    .col-sm-push-10 {
      left: 83.33333333%;
    }

    .col-sm-push-9 {
      left: 75%;
    }

    .col-sm-push-8 {
      left: 66.66666667%;
    }

    .col-sm-push-7 {
      left: 58.33333333%;
    }

    .col-sm-push-6 {
      left: 50%;
    }

    .col-sm-push-5 {
      left: 41.66666667%;
    }

    .col-sm-push-4 {
      left: 33.33333333%;
    }

    .col-sm-push-3 {
      left: 25%;
    }

    .col-sm-push-2 {
      left: 16.66666667%;
    }

    .col-sm-push-1 {
      left: 8.33333333%;
    }

    .col-sm-push-0 {
      left: auto;
    }

    .col-sm-offset-12 {
      margin-left: 100%;
    }

    .col-sm-offset-11 {
      margin-left: 91.66666667%;
    }

    .col-sm-offset-10 {
      margin-left: 83.33333333%;
    }

    .col-sm-offset-9 {
      margin-left: 75%;
    }

    .col-sm-offset-8 {
      margin-left: 66.66666667%;
    }

    .col-sm-offset-7 {
      margin-left: 58.33333333%;
    }

    .col-sm-offset-6 {
      margin-left: 50%;
    }

    .col-sm-offset-5 {
      margin-left: 41.66666667%;
    }

    .col-sm-offset-4 {
      margin-left: 33.33333333%;
    }

    .col-sm-offset-3 {
      margin-left: 25%;
    }

    .col-sm-offset-2 {
      margin-left: 16.66666667%;
    }

    .col-sm-offset-1 {
      margin-left: 8.33333333%;
    }

    .col-sm-offset-0 {
      margin-left: 0%;
    }
  }
@media only screen and (min-width: 730px) {
    .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
      float: left;
    }

    .col-md-12 {
      width: 100%;
    }

    .col-md-11 {
      width: 91.66666667%;
    }

    .col-md-10 {
      width: 83.33333333%;
    }

    .col-md-9 {
      width: 75%;
    }

    .col-md-8 {
      width: 66.66666667%;
    }

    .col-md-7 {
      width: 58.33333333%;
    }

    .col-md-6 {
      width: 50%;
    }

    .col-md-5 {
      width: 41.66666667%;
    }

    .col-md-4 {
      width: 33.33333333%;
    }

    .col-md-3 {
      width: 25%;
    }

    .col-md-2 {
      width: 16.66666667%;
    }

    .col-md-1 {
      width: 8.33333333%;
    }

    .col-md-pull-12 {
      right: 100%;
    }

    .col-md-pull-11 {
      right: 91.66666667%;
    }

    .col-md-pull-10 {
      right: 83.33333333%;
    }

    .col-md-pull-9 {
      right: 75%;
    }

    .col-md-pull-8 {
      right: 66.66666667%;
    }

    .col-md-pull-7 {
      right: 58.33333333%;
    }

    .col-md-pull-6 {
      right: 50%;
    }

    .col-md-pull-5 {
      right: 41.66666667%;
    }

    .col-md-pull-4 {
      right: 33.33333333%;
    }

    .col-md-pull-3 {
      right: 25%;
    }

    .col-md-pull-2 {
      right: 16.66666667%;
    }

    .col-md-pull-1 {
      right: 8.33333333%;
    }

    .col-md-pull-0 {
      right: auto;
    }

    .col-md-push-12 {
      left: 100%;
    }

    .col-md-push-11 {
      left: 91.66666667%;
    }

    .col-md-push-10 {
      left: 83.33333333%;
    }

    .col-md-push-9 {
      left: 75%;
    }

    .col-md-push-8 {
      left: 66.66666667%;
    }

    .col-md-push-7 {
      left: 58.33333333%;
    }

    .col-md-push-6 {
      left: 50%;
    }

    .col-md-push-5 {
      left: 41.66666667%;
    }

    .col-md-push-4 {
      left: 33.33333333%;
    }

    .col-md-push-3 {
      left: 25%;
    }

    .col-md-push-2 {
      left: 16.66666667%;
    }

    .col-md-push-1 {
      left: 8.33333333%;
    }

    .col-md-push-0 {
      left: auto;
    }

    .col-md-offset-12 {
      margin-left: 100%;
    }

    .col-md-offset-11 {
      margin-left: 91.66666667%;
    }

    .col-md-offset-10 {
      margin-left: 83.33333333%;
    }

    .col-md-offset-9 {
      margin-left: 75%;
    }

    .col-md-offset-8 {
      margin-left: 66.66666667%;
    }

    .col-md-offset-7 {
      margin-left: 58.33333333%;
    }

    .col-md-offset-6 {
      margin-left: 50%;
    }

    .col-md-offset-5 {
      margin-left: 41.66666667%;
    }

    .col-md-offset-4 {
      margin-left: 33.33333333%;
    }

    .col-md-offset-3 {
      margin-left: 25%;
    }

    .col-md-offset-2 {
      margin-left: 16.66666667%;
    }

    .col-md-offset-1 {
      margin-left: 8.33333333%;
    }

    .col-md-offset-0 {
      margin-left: 0%;
    }
  }
@media only screen and (min-width: 1000px) {
    .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {
      float: left;
    }

    .col-lg-12 {
      width: 100%;
    }

    .col-lg-11 {
      width: 91.66666667%;
    }

    .col-lg-10 {
      width: 83.33333333%;
    }

    .col-lg-9 {
      width: 75%;
    }

    .col-lg-8 {
      width: 66.66666667%;
    }

    .col-lg-7 {
      width: 58.33333333%;
    }

    .col-lg-6 {
      width: 50%;
    }

    .col-lg-5 {
      width: 41.66666667%;
    }

    .col-lg-4 {
      width: 33.33333333%;
    }

    .col-lg-3 {
      width: 25%;
    }

    .col-lg-2 {
      width: 16.66666667%;
    }

    .col-lg-1 {
      width: 8.33333333%;
    }

    .col-lg-pull-12 {
      right: 100%;
    }

    .col-lg-pull-11 {
      right: 91.66666667%;
    }

    .col-lg-pull-10 {
      right: 83.33333333%;
    }

    .col-lg-pull-9 {
      right: 75%;
    }

    .col-lg-pull-8 {
      right: 66.66666667%;
    }

    .col-lg-pull-7 {
      right: 58.33333333%;
    }

    .col-lg-pull-6 {
      right: 50%;
    }

    .col-lg-pull-5 {
      right: 41.66666667%;
    }

    .col-lg-pull-4 {
      right: 33.33333333%;
    }

    .col-lg-pull-3 {
      right: 25%;
    }

    .col-lg-pull-2 {
      right: 16.66666667%;
    }

    .col-lg-pull-1 {
      right: 8.33333333%;
    }

    .col-lg-pull-0 {
      right: auto;
    }

    .col-lg-push-12 {
      left: 100%;
    }

    .col-lg-push-11 {
      left: 91.66666667%;
    }

    .col-lg-push-10 {
      left: 83.33333333%;
    }

    .col-lg-push-9 {
      left: 75%;
    }

    .col-lg-push-8 {
      left: 66.66666667%;
    }

    .col-lg-push-7 {
      left: 58.33333333%;
    }

    .col-lg-push-6 {
      left: 50%;
    }

    .col-lg-push-5 {
      left: 41.66666667%;
    }

    .col-lg-push-4 {
      left: 33.33333333%;
    }

    .col-lg-push-3 {
      left: 25%;
    }

    .col-lg-push-2 {
      left: 16.66666667%;
    }

    .col-lg-push-1 {
      left: 8.33333333%;
    }

    .col-lg-push-0 {
      left: auto;
    }

    .col-lg-offset-12 {
      margin-left: 100%;
    }

    .col-lg-offset-11 {
      margin-left: 91.66666667%;
    }

    .col-lg-offset-10 {
      margin-left: 83.33333333%;
    }

    .col-lg-offset-9 {
      margin-left: 75%;
    }

    .col-lg-offset-8 {
      margin-left: 66.66666667%;
    }

    .col-lg-offset-7 {
      margin-left: 58.33333333%;
    }

    .col-lg-offset-6 {
      margin-left: 50%;
    }

    .col-lg-offset-5 {
      margin-left: 41.66666667%;
    }

    .col-lg-offset-4 {
      margin-left: 33.33333333%;
    }

    .col-lg-offset-3 {
      margin-left: 25%;
    }

    .col-lg-offset-2 {
      margin-left: 16.66666667%;
    }

    .col-lg-offset-1 {
      margin-left: 8.33333333%;
    }

    .col-lg-offset-0 {
      margin-left: 0%;
    }
  }
.clearfix:before, .clearfix:after, .container:before, .container:after, .container-fluid:before, .container-fluid:after, .row:before, .row:after {
    content: " ";
    display: table;
  }
.clearfix:after, .container:after, .container-fluid:after, .row:after {
    clear: both;
  }
.center-block {
    display: block;
    margin-left: auto;
    margin-right: auto;
  }
.pull-right {
    float: right !important;
  }
.pull-left {
    float: left !important;
  }
/* END: modules/app/grid */
/* BEGIN: modules/app/svgs */
/* colour swapping for the svg's */
.svg-highlight-stroke {
    stroke: #f99400;
  }
.svg-highlight-fill {
    fill: #f99400;
  }
.svg-highlight-stop-colour {
    stop-color: #f99400;
  }
.svg-brand-primary-stroke {
    stroke: #2b6cde;
  }
.svg-brand-primary-fill {
    fill: #2b6cde;
  }
.svg-brand-primary-stop-colour {
    stop-color: #2b6cde;
  }
.svg-brand-secondary-stroke {
    stroke: #17203d;
  }
.svg-brand-secondary-fill {
    fill: #17203d;
  }
.svg-brand-secondary-stop-colour {
    stop-color: #17203d;
  }
.svg-cta-color {
    color: #2b6cde;
  }
.svg-cta-stroke {
    stroke: #2b6cde;
  }
.svg-cta-path-stroke path {
    stroke: #2b6cde;
  }
.svg-cta-fill {
    fill: #2b6cde;
  }
.svg-cta-path-fill path {
    fill: #2b6cde;
  }
.svg-cta-stop-colour {
    stop-color: #2b6cde;
  }
.svg-positive-stroke {
    stroke: #2b6cde;
  }
.svg-positive-fill {
    fill: #2b6cde;
  }
.svg-positive-stop-colour {
    stop-color: #2b6cde;
  }
.svg-negative-stroke {
    stroke: #d0021b;
  }
.svg-negative-fill {
    fill: #d0021b;
  }
.svg-negative-stop-colour {
    stop-color: #d0021b;
  }
.svg-health-stroke {
    stroke: #fb4d7c;
  }
.clark2 .svg-health-stroke {
    stroke: #7055bc;
  }
.svg-health-fill {
    fill: #fb4d7c;
  }
.clark2 .svg-health-fill {
    fill: #7055bc;
  }
.svg-health-stop-colour {
    stop-color: #fb4d7c;
  }
.clark2 .svg-health-stop-colour {
    stop-color: #7055bc;
  }
.svg-retirement-stroke {
    stroke: #2b6cde;
  }
.clark2 .svg-retirement-stroke {
    stroke: #4a85d5;
  }
.svg-retirement-fill {
    fill: #2b6cde;
  }
.clark2 .svg-retirement-fill {
    fill: #4a85d5;
  }
.svg-retirement-stop-colour {
    stop-color: #2b6cde;
  }
.clark2 .svg-retirement-stop-colour {
    stop-color: #4a85d5;
  }
.svg-things-stroke {
    stroke: #31ec79;
  }
.clark2 .svg-things-stroke {
    stroke: #75ddf2;
  }
.svg-things-fill {
    fill: #31ec79;
  }
.clark2 .svg-things-fill {
    fill: #75ddf2;
  }
.svg-things-stop-colour {
    stop-color: #31ec79;
  }
.clark2 .svg-things-stop-colour {
    stop-color: #75ddf2;
  }
.clark2 .svg-faded-rings-bg {
    stroke: #f4f8ff;
  }
/* END: modules/app/svgs */
/* LEGACY: Formerly in `rails` subfolder, now cleaned up, still subject to further cleanups and refactors */
/* styles for the body when the modal window is open, remove scrolling on full width modal window */
body.modal-open {
    overflow: hidden;
  }
body.side-menu-active {
    overflow: hidden;
  }
.hidden {
    display: none;
  }
.max-width, .page-footer-content, .page-header__wrap, .section__wrapper, .section__mobile-btn-wrapper {
    max-width: 1000px;
    margin: 0 auto;
  }
/* Margin / padding styles */
.no-margin {
    margin: 0;
  }
.no-padding {
    padding: 0;
  }
.not-mobile {
    display: none !important;
  }
@media only screen and (min-width: 450px) {
    .not-mobile {
      width: 100%;
      display: inline-block !important;
      display: initial !important;
    }
  }
.width-40 {
    width: 40%;
  }
.width-40--only-medium {
    width: 100%;
  }
@media only screen and (min-width: 730px) {
    .width-40--only-medium {
      width: 40%;
    }
  }
.space-top {
    margin-top: 20px;
  }
.space-top--medium {
    margin-top: 20px;
  }
@media only screen and (min-width: 730px) {
    .space-top--medium {
      margin-top: 0;
    }
  }
.space-bottom {
    margin-bottom: 20px;
  }
.date-placeholder:before {
    content: attr(placeholder) !important;
    color: #aaa;
    margin-right: 0.5em;
    white-space: nowrap;
  }
.date-placeholder:focus:before, .date-placeholder.picked:before {
    opacity: 0;
    width: 0;
    content: "" !important;
    margin-right: 0;
  }
/* END: modules/app/legacy-general */
/* BEGIN: modules/app/flex */
.flex {
    display: flex;
  }
.flex__column, .flex__row {
    width: 100%;
    /* IE flexbox fix */
  }
.flex__column--30, .flex__row--30 {
    width: 30%;
    flex-basis: 30%;
  }
.flex__column--33, .flex__row--33 {
    width: 33%;
    flex-basis: 33%;
  }
.flex__column--20, .flex__row--20 {
    width: 20%;
    flex-basis: 20%;
  }
.flex__column--40, .flex__row--40 {
    width: 40%;
    flex-basis: 40%;
  }
.flex__column--50, .flex__row--50 {
    width: 50%;
    flex-basis: 50%;
  }
.flex__column--60, .flex__row--60 {
    width: 60%;
    flex-basis: 60%;
  }
.flex__column--66, .flex__row--66 {
    width: 66%;
    flex-basis: 66%;
  }
.flex__column--70, .flex__row--70 {
    width: 70%;
    flex-basis: 70%;
  }
.flex__column--100, .flex__row--100 {
    width: 100%;
    flex-basis: 100%;
  }
@media only screen and (min-width: 450px) {
    .flex__column--small-30, .flex__row--small-30 {
      width: 30%;
      flex-basis: 30%;
    }
  }
@media only screen and (min-width: 450px) {
    .flex__column--small-33, .flex__row--small-33 {
      width: 33%;
      flex-basis: 33%;
    }
  }
@media only screen and (min-width: 450px) {
    .flex__column--small-20, .flex__row--small-20 {
      width: 20%;
      flex-basis: 20%;
    }
  }
@media only screen and (min-width: 450px) {
    .flex__column--small-40, .flex__row--small-40 {
      width: 40%;
      flex-basis: 40%;
    }
  }
@media only screen and (min-width: 450px) {
    .flex__column--small-50, .flex__row--small-50 {
      width: 50%;
      flex-basis: 50%;
    }
  }
@media only screen and (min-width: 450px) {
    .flex__column--small-60, .flex__row--small-60 {
      width: 60%;
      flex-basis: 60%;
    }
  }
@media only screen and (min-width: 450px) {
    .flex__column--small-66, .flex__row--small-66 {
      width: 66%;
      flex-basis: 66%;
    }
  }
@media only screen and (min-width: 450px) {
    .flex__column--small-70, .flex__row--small-70 {
      width: 70%;
      flex-basis: 70%;
    }
  }
@media only screen and (min-width: 450px) {
    .flex__column--small-100, .flex__row--small-100 {
      width: 100%;
      flex-basis: 100%;
    }
  }
@media only screen and (min-width: 730px) {
    .flex__column--medium-30, .flex__row--medium-30 {
      width: 30%;
      flex-basis: 30%;
    }
  }
@media only screen and (min-width: 730px) {
    .flex__column--medium-33, .flex__row--medium-33 {
      width: 33%;
      flex-basis: 33%;
    }
  }
@media only screen and (min-width: 730px) {
    .flex__column--medium-20, .flex__row--medium-20 {
      width: 20%;
      flex-basis: 20%;
    }
  }
@media only screen and (min-width: 730px) {
    .flex__column--medium-40, .flex__row--medium-40 {
      width: 40%;
      flex-basis: 40%;
    }
  }
@media only screen and (min-width: 730px) {
    .flex__column--medium-50, .flex__row--medium-50 {
      width: 50%;
      flex-basis: 50%;
    }
  }
@media only screen and (min-width: 730px) {
    .flex__column--medium-60, .flex__row--medium-60 {
      width: 60%;
      flex-basis: 60%;
    }
  }
@media only screen and (min-width: 730px) {
    .flex__column--medium-66, .flex__row--medium-66 {
      width: 66%;
      flex-basis: 66%;
    }
  }
@media only screen and (min-width: 730px) {
    .flex__column--medium-70, .flex__row--medium-70 {
      width: 70%;
      flex-basis: 70%;
    }
  }
@media only screen and (min-width: 730px) {
    .flex__column--medium-100, .flex__row--medium-100 {
      width: 100%;
      flex-basis: 100%;
    }
  }
@media only screen and (min-width: 1000px) {
    .flex__column--large-30, .flex__row--large-30 {
      width: 30%;
      flex-basis: 30%;
    }
  }
@media only screen and (min-width: 1000px) {
    .flex__column--large-33, .flex__row--large-33 {
      width: 33%;
      flex-basis: 33%;
    }
  }
@media only screen and (min-width: 1000px) {
    .flex__column--large-20, .flex__row--large-20 {
      width: 20%;
      flex-basis: 20%;
    }
  }
@media only screen and (min-width: 1000px) {
    .flex__column--large-40, .flex__row--large-40 {
      width: 40%;
      flex-basis: 40%;
    }
  }
@media only screen and (min-width: 1000px) {
    .flex__column--large-50, .flex__row--large-50 {
      width: 50%;
      flex-basis: 50%;
    }
  }
@media only screen and (min-width: 1000px) {
    .flex__column--large-60, .flex__row--large-60 {
      width: 60%;
      flex-basis: 60%;
    }
  }
@media only screen and (min-width: 1000px) {
    .flex__column--large-66, .flex__row--large-66 {
      width: 66%;
      flex-basis: 66%;
    }
  }
@media only screen and (min-width: 1000px) {
    .flex__column--large-70, .flex__row--large-70 {
      width: 70%;
      flex-basis: 70%;
    }
  }
@media only screen and (min-width: 1000px) {
    .flex__column--large-100, .flex__row--large-100 {
      width: 100%;
      flex-basis: 100%;
    }
  }
.flex--auto {
    width: auto;
  }
@media only screen and (min-width: 450px) {
    .flex--auto-small {
      width: auto;
    }
  }
.flex__column {
    flex-direction: column;
  }
.flex__column--33 {
    min-width: 33%;
    flex-basis: 33%;
    padding: 0 2%;
  }
.flex__column--small-row {
    flex-direction: row;
    justify-content: space-between;
    width: 100%;
  }
@media only screen and (min-width: 450px) {
    .flex__column--small-row {
      flex-direction: column;
      justify-content: inherit;
      width: inherit;
    }
  }
.flex__column--medium-row {
    flex-direction: row;
    width: 100%;
  }
@media only screen and (min-width: 730px) {
    .flex__column--medium-row {
      flex-direction: column;
      justify-content: inherit;
      width: inherit;
    }
  }
.flex__row {
    flex-direction: row;
    flex-wrap: wrap;
  }
@media only screen and (min-width: 730px) {
    .flex__row {
      flex-wrap: nowrap;
    }
  }
@media only screen and (min-width: 730px) {
    .flex__row--wrap-medium {
      flex-wrap: wrap !important;
    }
  }
@media only screen and (min-width: 1000px) {
    .flex__row--wrap-medium {
      flex-wrap: nowrap !important;
    }
  }
.flex__row--always-wrap {
    flex-wrap: wrap !important;
  }
.flex__row--small-column {
    flex-direction: column;
  }
@media only screen and (min-width: 450px) {
    .flex__row--small-column {
      flex-direction: row;
    }
  }
.flex__row--medium-column {
    flex-direction: column;
  }
@media only screen and (min-width: 730px) {
    .flex__row--medium-column {
      flex-direction: row;
    }
  }
.flex__row--nowrap {
    flex-wrap: nowrap;
  }
.flex__row--space-around {
    justify-content: space-around;
  }
.flex--center {
    align-items: center;
  }
.flex--self-center {
    align-self: center;
  }
.flex--justify-center {
    justify-content: center;
  }
.flex--justify-space-between {
    justify-content: space-between;
  }
.flex--not-medium {
    display: none;
  }
@media only screen and (min-width: 730px) {
    .flex--not-medium {
      display: flex;
    }
  }
.dot {
    width: 60px;
  }
.space-around {
    margin: 15px;
  }
.full-width {
    width: 100%;
  }
.flex-start {
    align-items: flex-start;
    text-align: left;
  }
/* END: modules/app/flex */
/* BEGIN: modules/app/page-content */
.page-content {
    transition: all 0.5s ease;
    position: relative;
    left: 0;
    overflow: initial;
    display: flex;
    flex-direction: column;
    min-height: 100%;
    height: auto;
    width: 100%;
  }
.page-content .page-footer {
    margin-top: auto;
    width: 100%;
  }
.body--mobile-ios .page-content, .body--mobile-android .page-content {
    display: block;
    height: 100%;
    transition: none;
    overflow: initial;
  }
.body--mobile-ios .page-main, .body--mobile-android .page-main {
    display: block;
    flex-direction: initial;
  }
.body--mobile-ios .page-main--mobile {
    height: calc(100% + 1px);
    /* the 1px here fixes iOS flashing on click */
  }
.page-container {
    height: 100%;
  }
.page-main-wrapper {
    flex: 1;
    position: relative;
  }
:root {
    --fixed-area-inset-top: calc(
      env(safe-area-inset-top, 0px) + var(--title-bar-offset, 0px) +
      var(--web-header-offset, 0px)
    );
    --fixed-area-inset-bottom: calc(
      env(safe-area-inset-bottom, 0px) + var(--tab-bar-offset, 0px)
    );
  }

@media only screen and (max-width: 600px) {
  script#ze-snippet ~ div iframe.open {
    box-shadow: none !important;
    padding-top: calc(env(safe-area-inset-top, 0px) + 0px) !important;
    padding-top: calc(env(safe-area-inset-top, 0px) + var(--web-header-offset, 0px)) !important;
    background: white;
    bottom: calc(
      env(safe-area-inset-bottom, 0px) + 0px
    ) !important;
    bottom: var(--fixed-area-inset-bottom) !important;
    height: calc(100% - calc(
      env(safe-area-inset-bottom, 0px) + 0px
    )) !important;
    height: calc(100% - var(--fixed-area-inset-bottom)) !important;
    max-height: calc(-45px + 100vh) !important;
    width: 100% !important;
    left: 0% !important;
    right: 0 !important;
  }

  @supports (-webkit-touch-callout: none) {
    script#ze-snippet ~ div iframe.open {
      bottom: calc(calc(
      env(safe-area-inset-bottom, 0px) + 0px
    ) - 2px) !important;
      bottom: calc(var(--fixed-area-inset-bottom) - 2px) !important;
    }
  }
}

.page-main {
    display: flex;
    flex-direction: column;
    padding-bottom: calc(
      env(safe-area-inset-bottom, 0px) + 0px
    );
    padding-bottom: var(--fixed-area-inset-bottom);
  }
@media only screen and (min-width: 730px) {
  .page-main {
    padding-top: calc(env(safe-area-inset-top, 0px) + 0px);
    padding-top: calc(env(safe-area-inset-top, 0px) + var(--web-header-offset, 0px));
  }
}
.page-main .tabbar-minimal-margin {
    margin-bottom: calc(
      env(safe-area-inset-bottom, 0px) + 0px
    );
    margin-bottom: var(--fixed-area-inset-bottom);
  }
@media only screen and (max-width: 729.98px) {
    .page-main .section--mandate-funnel {
      padding-bottom: 94px !important;
    }
  }
.page-main--mobile {
    /* TODO these styles should be replaced when these pages use standard headers and typography */
    /* insurance overview page */
  }
.page-main--mobile .section {
    padding-top: 0;
  }
.page-main--mobile .section--fullpage {
    padding-top: 35px;
  }
.page-main--mobile .section--mandate-funnel {
    padding-top: 35px !important;
  }
.page-main--mobile .headline-bar--bit-small {
    margin: 30px 0 0 0;
  }
.page-main--mobile .edit_mandate h2 {
    margin: 30px 0;
  }
.page-main--mobile .question {
    padding-top: 10px;
  }
/* fixes for browsers that cant handle height of 100% inside a flex container .. welcome to 2017 */
body.safari .page-main {
    display: block;
  }
.page-main:focus {
    outline: none;
  }
body.ie .page-content {
    display: block;
  }
body.ie .page-main-wrapper {
    flex: none;
  }
.page-container.is-active {
    overflow: hidden;
  }
.page-container.is-active .page-content {
    left: 220px;
  }
.page-container.is-active .page-content__wide {
    left: 220px;
  }
@media only screen and (min-width: 730px) {
    .page-container.is-active .page-content {
      left: 0;
    }
  }
/* END: modules/app/page-content */
/* BEGIN: modules/app/section */
.section {
    padding: 35px 0 20px;
    position: relative;
    overflow: hidden;
    display: block;
  }
.section:after {
    content: "";
    clear: both;
    display: table;
  }
.section--fullheight {
    height: 100%;
  }
.section__mobile-btn-wrapper {
    position: relative;
    padding: 0;
  }
.section__mobile-btn-wrapper .btn {
    min-width: 0;
  }
.section__mobile-btn-wrapper .btn:after {
    display: none;
  }
@media only screen and (min-width: 450px) {
    .section__mobile-btn-wrapper {
      margin-top: 0;
      padding: 40px 10px;
      /* back button */
    }
    .section__mobile-btn-wrapper .btn {
      min-width: 180px;
    }
    .section__mobile-btn-wrapper .btn:after {
      display: block;
    }
    .section__mobile-btn-wrapper .btn-secondary {
      display: block;
      margin-right: 20px;
      /* for when there is only one button */
    }
    .section__mobile-btn-wrapper .btn-secondary--no-margin {
      margin-right: 0;
    }
  }
@media only screen and (min-width: 450px) {
    .section__mobile-btn-wrapper.next-fixed-flag {
      min-height: 124px;
    }
  }
.section__wrapper {
    position: relative;
    padding: 0 10px;
    width: 100%;
  }
.section__white {
    background-color: white;
  }
.section__grey {
    background-color: #bbb;
  }
.section__grey-lightest {
    background-color: #f6f6f6;
  }
.clark2 .section__grey-lightest {
    background-color: #f5f6fa;
  }
.section__grey-light {
    background-color: #d6d6d6;
  }
.section__grey-dark {
    background-color: #787878;
  }
.section__grey--mobile {
    padding: 0;
    margin-bottom: 0;
  }
.section__grey--only-mobile {
    margin-bottom: 0;
    padding: 0;
  }
@media only screen and (min-width: 450px) {
    .section__grey--only-mobile {
      background: none;
    }
  }
.section__dark--transparent {
    background-color: rgba(51, 51, 51, 0.42);
  }
.section--extra-padding {
    padding-bottom: 35px;
  }
.section--extra-margin {
    margin-bottom: 20px;
  }
.section--overflow {
    overflow: visible;
  }
.clark2 .section__headline {
    color: #283e66;
  }
@media only screen and (min-width: 730px) {
    .section__headline {
      margin-bottom: 50px;
    }
  }
.section__headline--separated {
    padding-bottom: 1em;
    border-bottom: 2px solid #f6f6f6;
  }
.clark2 .section__headline--separated {
    border-bottom-color: #daddec;
  }
.section__headline--no-margin {
    margin: 0;
  }
.section__sub-headline {
    margin-top: -40px;
    margin-bottom: 50px;
  }
.section__sub-headline--no-margin {
    margin: 0;
  }
.section-seperator {
    display: block;
    height: 2px;
    background-color: #d6d6d6;
  }
.clark2 .section-seperator {
    background-color: #daddec;
  }
.section--tight {
    padding: 20px 0;
  }
.section--no-space-bottom {
    margin-bottom: 0;
    padding-bottom: 0;
  }
.section--large {
    height: 0;
    min-height: 400px;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
.section__video {
    width: 80%;
    display: block;
    margin: 0 auto;
  }
@media only screen and (min-width: 730px) {
    .section__video {
      float: right;
      max-width: 300px;
      margin: 25px 0 50px 100px;
    }
  }
.section__seperator:before {
    content: "";
    position: absolute;
    top: -50px;
    width: 100%;
    left: 0%;
    height: 2px;
    background-color: rgba(43, 108, 222, 0.15);
    /* #2b6cde */
  }
.section--compact {
    padding-top: 0;
  }
.section--invert {
    background-color: #d6d6d6;
  }
.section--gradient {
    background: linear-gradient(white, #d6d6d6);
  }
.section__image {
    margin: 15px -10px;
    width: calc(100% + 20px);
  }
.section__image img {
    display: block;
  }
@media only screen and (min-width: 450px) {
    .section__image {
      display: block;
      position: relative;
      width: 50%;
      /* margin-top: -135px; */
      /* transform: scale(1.3) translateX(15%); */
    }
  }
.section__image--only-mobile {
    display: block;
  }
@media only screen and (min-width: 730px) {
    .section__image--only-mobile {
      display: none;
    }
  }
.section__image--only-desktop {
    display: none;
  }
@media only screen and (min-width: 730px) {
    .section__image--only-desktop {
      display: block;
    }
  }
.section__image--no-margin {
    margin: 0;
  }
.section__image--right {
    float: none;
    height: 260px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center bottom;
  }
@media only screen and (min-width: 450px) {
    .section__image--right {
      float: right;
      height: 360px;
      background-position: right bottom;
    }
  }
.section__image--left {
    float: none;
    display: none;
    height: 250px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center bottom;
  }
@media only screen and (min-width: 450px) {
    .section__image--left {
      display: inline-block;
      float: left;
      height: 500px;
      background-position: right bottom;
    }
  }
@media only screen and (min-width: 450px) {
    .section__image--out-of-wrapper {
      margin-left: -50%;
      width: 90%;
      margin-right: 10%;
    }
  }
.section__button {
    margin-left: 20px;
    padding-left: 0;
  }
.section--triangle-crossing {
    position: relative;
    overflow: visible;
  }
.section--triangle-crossing:before {
    content: "";
    border-bottom: 30px solid white;
    border-left: 100vw solid transparent;
    border-right: 0 solid transparent;
    position: absolute;
    top: -30px;
    left: 0;
  }
.section__line-seperator {
    background-color: #f6f6f6;
    border: none;
    height: 2px;
  }
.clark2 .section__line-seperator {
    background-color: #daddec;
  }
.section--fullpage {
    /* min-height: 100vh; */
  }
@media only screen and (min-width: 730px) {
    .section--fullpage {
      padding-top: 70px;
    }
  }
.section--fullpage .section__wrapper {
    max-width: 500px;
    margin: 0 auto;
    padding: 0;
    /* 990px = 730px + 260px */
  }
@media only screen and (min-width: 730px) {
    .section--fullpage .section__wrapper {
      margin-left: 260px;
    }
  }
@media only screen and (min-width: 990px) {
    .section--fullpage .section__wrapper {
      margin-left: auto;
    }
  }
.section--outstanding {
    margin-top: 180px;
    padding-bottom: 15px;
    overflow: visible;
    text-align: center;
  }
.section--outstanding .section__headline {
    position: absolute;
    top: -180px;
    margin: auto;
    left: 0;
    right: 0;
  }
.section--outstanding .section__image--outstanding {
    position: absolute;
    top: -140px;
    height: 120px;
    width: auto;
    margin: auto;
    right: 0;
    left: 0;
  }
@media only screen and (min-width: 730px) {
    .section--outstanding {
      padding: 50px 0;
      margin-bottom: 50px;
      margin-top: 90px;
    }
    .section--outstanding .section__headline {
      margin-bottom: 1em;
      position: static;
    }
    .section--outstanding .section__image--outstanding {
      top: -140px;
      height: 120px;
      margin: auto;
      left: 0;
      right: 0;
    }
  }
.section--head .section__parts {
    text-align: center;
  }
.section--head .section__headline {
    text-align: center;
  }
.section--head .top-spacer {
    margin-top: 50px;
  }
.section--head .section__sub-headline {
    text-align: center;
    margin-top: 0px;
  }
@media only screen and (min-width: 730px) {
    .section--head {
      min-height: 650px;
    }
    .section--head .section__headline {
      margin-bottom: 5%;
      max-width: 68%;
      text-align: left;
    }
    .section--head .section__sub-headline {
      text-align: left;
      margin-top: -4%;
    }
    .section--head .section__parts {
      text-align: left;
    }
    .section--head .section__parts > .btn {
      width: 250px;
      margin-left: 0;
    }
    .section--head .top-spacer {
      margin-top: 100px;
    }
  }
@media only screen and (min-width: 1000px) {
    .section--head .section__sub-headline {
      margin-top: -50px;
    }
    .section--head .section__headline {
      margin-bottom: 60px;
    }
  }
.section--light-background {
    background-color: #d6d6d6;
  }
.clark2 .section--light-background {
    background-color: #f5f6fa;
  }
.section--lightest-background {
    background-color: #f6f6f6;
  }
.clark2 .section--lightest-background {
    background-color: #f5f6fa;
  }
.section-content__text {
    margin-bottom: 3vh;
  }
.section--not-mobile {
    display: none;
  }
@media only screen and (min-width: 730px) {
    .section--not-mobile {
      display: block;
    }
  }
.section--middle-of-page {
    max-width: 500px;
    margin: 0 auto;
  }
/* END: modules/app/section */
/* BEGIN: modules/app/fixed-element-scroll */
.next-fixed-flag {
    /* stop the page from jumping when it pops into fixed */
    min-height: 68px;
  }
@media only screen and (min-width: 450px) {
    .next-fixed-flag {
      transition: left 0.5s ease;
      margin: 0 auto;
    }
  }
.next-fixed-btn {
    -webkit-transform: translate3d(0, 0, 0);
  }
.next-fixed-btn--fixed {
    position: fixed;
    bottom: calc(
      env(safe-area-inset-bottom, 0px) + 0px
    );
    bottom: var(--fixed-area-inset-bottom);
    left: 0;
    right: 0;
    background: linear-gradient(0deg, #fff 0%, rgba(255, 255, 255, 0.15) 100%);
    margin: 0;
    padding: 0;
    max-width: none;
    -webkit-transform: translate3d(0, 0, 0);
    /* remove the gradient for desktop */
  }
@media only screen and (min-width: 450px) {
    .next-fixed-btn--fixed {
      background: rgba(255, 255, 255, 0.8);
    }
  }
@media only screen and (min-width: 450px) {
    .next-fixed-btn--fixed {
      padding: 10px 0;
    }
  }
/* when on mobile app fixed buttons are always fixed! */
.body--mobile-ios .next-fixed-btn, .body--mobile-android .next-fixed-btn {
    position: fixed;
    bottom: calc(
      env(safe-area-inset-bottom, 0px) + 0px
    );
    bottom: var(--fixed-area-inset-bottom);
    left: 0;
    right: 0;
    background: linear-gradient(0deg, #fff 0%, rgba(255, 255, 255, 0.15) 100%);
    margin: 0;
    padding: 0;
    max-width: none;
    -webkit-transform: translate3d(0, 0, 0);
    /* remove the gradient for desktop */
  }
@media only screen and (min-width: 450px) {
    .body--mobile-ios .next-fixed-btn, .body--mobile-android .next-fixed-btn {
      background: rgba(255, 255, 255, 0.8);
    }
  }
.next-fixed-btn, .search-fixed-field {
    width: 100%;
    transition: left 0.5s ease;
    flex-wrap: wrap;
  }
.next-fixed-btn .full-width, .search-fixed-field .full-width {
    flex-basis: 100%;
  }
/* Fixed search bar */
.search-fixed-min-height {
    /* stop page jumping when the serch input becomes fixed */
    min-height: 63px;
    margin-bottom: -10px;
  }
@media only screen and (min-width: 450px) {
    .search-fixed-min-height {
      margin-bottom: 0;
      margin-top: 30px;
    }
  }
/* specific search wrapper fixed styles */
.search-fixed-field {
    -webkit-transform: translate3d(0, 0, 0);
  }
.search-fixed-field--fixed {
    position: fixed;
    top: calc(
      env(safe-area-inset-top, 0px) + 0px +
      0px
    );
    top: var(--fixed-area-inset-top, 0);
    z-index: 999;
    left: 0;
    padding: 10px 20px;
    right: 0;
    background-color: #f6f6f6;
    /* style changes to the search input in this case */
    /* search icon */
  }
.search-fixed-field--fixed--no-progress {
    z-index: 2;
  }
.search-fixed-field--fixed input[type=search] {
    margin: 0;
  }
.search-fixed-field--fixed span {
    top: 0;
  }
.search-fixed-field--app {
    top: 4px;
  }
.search-fixed-field--app.search-fixed-field--fixed--no-progress {
    top: 0;
  }
/* END: modules/app/fixed-element-scroll */
/* BEGIN: modules/app/circle-list */
/* sizes of the icons at different bp's */
.circle-list {
    margin: 0 auto;
  }
.circle-list--570 {
    max-width: 570px;
  }
.circle-list--720 {
    max-width: 720px;
  }
.circle-list.flex__column .circle-list__item {
    align-items: baseline;
  }
@media only screen and (min-width: 730px) {
    .circle-list.flex__column .circle-list__item {
      padding: 20px 20px;
    }
  }
.circle-list__item {
    padding: 10px 20px;
    width: 100%;
    /* 1, 2, 3 icons in the list */
  }
@media only screen and (min-width: 730px) {
    .circle-list__item {
      padding-top: 0;
    }
    .circle-list__item:first-child {
      padding-left: 0;
    }
    .circle-list__item:last-child {
      padding-right: 0;
    }
  }
.circle-list__item p {
    text-align: left;
    width: 90%;
    /* good ol IE10 */
    color: #626262;
  }
.clark2 .circle-list__item p {
    color: #283e66;
  }
.circle-list__item p em {
    font-size: 15px;
    line-height: 21px;
    font-weight: 300;
    color: #626262;
    font-style: normal;
    display: block;
  }
@media only screen and (min-width: 450px) {
    .circle-list__item p em {
      font-size: 16px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .circle-list__item p em {
      font-size: 18px;
      line-height: 28px;
    }
  }
@media only screen and (min-width: 1000px) {
    .circle-list__item p em {
      font-size: 20px;
      line-height: 30px;
    }
  }
.clark2 .circle-list__item p em {
    color: #283e66;
  }
.circle-list__item__icon {
    display: block;
    background-color: #f6f6f6;
    /* by default we assume number */
    width: 28px;
    min-width: 28px;
    height: 28px;
    min-height: 28px;
    color: #2b6cde;
    text-align: center;
    border-radius: 25px;
    margin: -3px 15px 0 0;
    font-size: 14px;
    line-height: 24px;
  }
.clark2 .circle-list__item__icon {
    background-color: white;
  }
@media only screen and (min-width: 730px) {
    .circle-list__item__icon {
      margin: -8px 20px 0 0;
      width: 36px;
      min-width: 36px;
      height: 36px;
      min-height: 36px;
      font-size: 16px;
      line-height: 33px;
    }
  }
.circle-list__item__icon--primary-border {
    background-color: transparent;
    border: 2px solid #2b6cde;
  }
/* END: modules/app/circle-list */
/* BEGIN: modules/app/card-list */
.card-list {
    list-style-type: none;
    padding: 0;
    margin: 0;
    background-color: #f6f6f6;
  }
.card-list__item {
    margin: 0px 10px 10px 10px;
    background-color: #fff;
    box-shadow: rgba(0, 0, 0, 0.15) 0 1px 1px 0, rgba(0, 0, 0, 0.05) 0 5px 8px 0;
    border-radius: 4px;
  }
.clark2 .card-list__item {
    box-shadow: 0 2px 6px 0 #daddec;
  }
.card-list__item--orange {
    border-right: 10px solid #f6a823;
  }
.card-list__item--things {
    border-left: solid 5px #31ec79;
  }
.card-list__item--health {
    border-left: solid 5px #fb4d7c;
  }
@media only screen and (min-width: 450px) {
    .card-list__item {
      margin: 0 0 6px 0;
    }
  }
@media only screen and (min-width: 730px) {
    .card-list__item {
      margin: 0 0 10px 0;
    }
  }
@media only screen and (min-width: 1000px) {
    .card-list__item {
      margin: 0 0 15px 0;
    }
  }
/* END: modules/app/card-list */
/* BEGIN: modules/app/custom-radio */
.custom-radio {
    margin: 0;
  }
.custom-radio label {
    padding-top: 2px;
    margin: 0 10px 0 0;
  }
.custom-radio input[type=radio] + span {
    width: 22px;
    height: 22px;
    border: 2px solid #bbb;
    border-radius: 50%;
    position: relative;
    display: inline-block;
    background-color: transparent;
    cursor: pointer;
    vertical-align: top;
  }
.clark2 .custom-radio input[type=radio] + span {
    border-color: #daddec;
  }
.custom-radio input[type=radio] + span:after {
    content: "";
    position: absolute;
    border-radius: 50%;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    margin: auto;
    background-color: #2b6cde;
    width: 0;
    height: 0;
    transition: all linear 0.1s;
  }
.custom-radio input[type=radio] {
    display: none;
  }
.custom-radio input[type=radio]:checked + span {
    border-color: #2b6cde;
  }
.custom-radio input[type=radio]:checked + span:after {
    width: 10px;
    height: 10px;
  }
/* END: modules/app/custom-radio */
/* BEGIN: modules/app/custom-check */
.custom-checkbox > input[type=checkbox] {
    display: none;
  }
.custom-checkbox__label {
    width: 19px;
    height: 20px;
    border: 2px solid #bbb;
    border-radius: 3px;
    position: relative;
    display: block;
    cursor: pointer;
  }
.clark2 .custom-checkbox__label {
    border-color: #daddec;
  }
.custom-checkbox__label__tick {
    width: 0px;
    height: 0px;
    top: -2px;
    right: 0px;
    left: -2px;
    bottom: 0;
    position: absolute;
  }
.custom-checkbox__label__tick > svg {
    height: 0;
    max-width: unset;
  }
.custom-checkbox__label__tick__middle {
    position: absolute;
    top: -2px;
    left: 3px;
    display: block;
  }
.custom-checkbox__label__tick__middle svg {
    display: block;
    width: 20px;
    height: 0px;
    transition: height 0.1s linear;
    max-width: unset;
  }
.custom-checkbox__label--active {
    border: 2px solid white;
  }
.custom-checkbox__label--active .custom-checkbox__label__tick #check-blue, .custom-checkbox__label--active .custom-checkbox__label__tick .check-stroke {
    stroke: #2b6cde;
  }
.custom-checkbox__label--active .custom-checkbox__label__tick > svg {
    height: 20px;
  }
.custom-checkbox__label--active .custom-checkbox__label__tick__middle svg {
    height: 20px;
  }
/* END: modules/app/custom-check */
/* BEGIN: modules/app/wizard-profiling */
.wizard-profiling__consesus {
    margin: 20px auto 0 auto;
    display: block;
    position: relative;
    /* strange ios bug :S */
  }
@media only screen and (min-width: 730px) {
    .wizard-profiling__consesus {
      margin: 30px auto 0 5%;
    }
  }
.wizard-profiling__consesus__content {
    color: #333;
    text-align: center;
    font-size: 14px;
    line-height: 18px;
  }
.clark2 .wizard-profiling__consesus__content {
    color: #283e66;
  }
.wizard-profiling__consesus__content__link {
    cursor: pointer;
    text-decoration: underline;
  }
.wizard-profiling__date-helper {
    position: absolute;
    top: 14px;
    right: calc(100% - 110px);
    text-align: right;
    width: 100%;
    letter-spacing: -1px;
    color: rgba(187, 187, 187, 0.3);
    /* #bbb */
  }
.clark2 .wizard-profiling__date-helper {
    color: rgba(40, 62, 102, 0.3);
    /* #283e66 */
  }
.wizard-profiling__mandate__personal--gender {
    display: flex;
    flex-direction: row;
    align-self: flex-start;
    flex: 1 1 auto;
    text-align: left;
  }
.wizard-profiling__mandate__personal--gender label {
    min-width: 100px;
  }
.wizard-profiling__mandate__personal--grid {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
.wizard-profiling__mandate__personal--data {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
@media only screen and (min-width: 450px) {
    .wizard-profiling__mandate__personal--data {
      flex-direction: row;
    }
  }
.wizard-profiling__mandate__personal--data ul {
    display: flex;
    flex: 0 1 48%;
    flex-direction: column;
  }
.wizard-profiling__intro {
    text-align: left;
    color: #626262;
    font-size: 15px;
    line-height: 21px;
    margin: 0;
  }
@media only screen and (min-width: 450px) {
    .wizard-profiling__intro {
      font-size: 16px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .wizard-profiling__intro {
      font-size: 17px;
      line-height: 25px;
    }
  }
@media only screen and (min-width: 1000px) {
    .wizard-profiling__intro {
      font-size: 18px;
      line-height: 26px;
    }
  }
.clark2 .wizard-profiling__intro {
    color: #283e66;
  }
@media only screen and (min-width: 450px) {
    .wizard-profiling__intro {
      text-align: center;
      display: block;
      max-width: 600px;
      margin: 0 auto;
    }
  }
.wizard-profiling__label {
    flex-basis: 30% !important;
  }
.wizard-profiling__maklerpdf__link__icon svg {
    width: 28px;
    height: 36px;
  }
.clark2 .wizard-profiling__maklerpdf__link__icon svg > g > g > g > g > g {
    stroke: #283e66;
  }
.clark2 .wizard-profiling__maklerpdf__link__icon svg > g > g > g > g > path {
    fill: #283e66;
  }
/* END: modules/app/wizard-profiling */
/* BEGIN: modules/app/wizard-status */
.wizard-status {
    display: block;
    height: calc(100% - 51px);
  }
@media only screen and (min-width: 450px) {
    .wizard-status {
      height: calc(100% - 124px);
    }
  }
.wizard-status--app {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    height: auto;
    min-height: calc(100% - 51px);
    overflow: visible;
  }
.wizard-status__top-leaf-container {
    position: relative;
    margin: auto;
    width: 95%;
  }
@media only screen and (min-width: 450px) {
    .wizard-status__top-leaf-container {
      width: 100%;
      max-width: 570px;
    }
  }
.wizard-status__top-leaf-container__box {
    background: #f99400;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.25);
    position: absolute;
    width: 120px;
    height: 25px;
    left: calc(100% - 113px);
    top: 4px;
    z-index: 1;
  }
.clark2 .wizard-status__top-leaf-container__box {
    box-shadow: none;
  }
@media only screen and (min-width: 450px) {
    .wizard-status__top-leaf-container__box {
      left: calc(100% - 113px);
    }
  }
@media only screen and (min-width: 730px) {
    .wizard-status__top-leaf-container__box {
      width: 150px;
      height: 28px;
      left: calc(100% - 143px);
      top: 8px;
    }
  }
@media only screen and (min-width: 1000px) {
    .wizard-status__top-leaf-container__box {
      width: 180px;
      height: 32px;
      left: calc(100% - 173px);
    }
  }
.wizard-status__top-leaf-container__badge {
    line-height: 25px;
    font-size: 12px;
    color: #fff;
    font-weight: 300;
    font-weight: 600;
  }
@media only screen and (min-width: 730px) {
    .wizard-status__top-leaf-container__badge {
      line-height: 28px;
      font-size: 16px;
    }
  }
@media only screen and (min-width: 1000px) {
    .wizard-status__top-leaf-container__badge {
      line-height: 32px;
      font-size: 16px;
    }
  }
.wizard-status__top-leaf-container__triangle {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 7px 0 0;
    border-color: #f99400 transparent transparent transparent;
    position: absolute;
    left: 100%;
    top: 29px;
  }
@media only screen and (min-width: 730px) {
    .wizard-status__top-leaf-container__triangle {
      top: 36px;
    }
  }
@media only screen and (min-width: 1000px) {
    .wizard-status__top-leaf-container__triangle {
      border-width: 6px 7px 0 0;
      top: 40px;
    }
  }
.wizard-status .white-box {
    background-color: #fff;
    box-shadow: #bbbbbb 0px 1px 2px 0px;
    border-radius: 2px;
    padding: 20px 0;
    width: 95%;
  }
.clark2 .wizard-status .white-box {
    box-shadow: 0 2px 6px 0 #daddec;
  }
@media only screen and (min-width: 450px) {
    .wizard-status .white-box {
      padding: 20px 40px;
      width: 100%;
    }
  }
@media only screen and (min-width: 1000px) {
    .wizard-status .white-box {
      padding: 30px 60px;
    }
  }
.wizard-status .white-box .circle-list__item__icon {
    line-height: 24px;
    font-weight: bold;
  }
@media only screen and (min-width: 730px) {
    .wizard-status .white-box .circle-list__item__icon {
      line-height: 32px;
    }
  }
.wizard-status__headline--app {
    margin: 30px 10px;
  }
.wizard-status__partner_product_msg {
    padding-bottom: 20px;
    max-width: 720px;
    margin: auto;
  }
/* END: modules/app/wizard-status */
/* stuff that was in rails AND ember */
/* BEGIN: modules/app/rails/page-header */
.page-header {
    height: 50px !important;
    /* text-align: right; */
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    background-color: #fff;
    transition: height 0.5s ease, left 0.5s ease, background-color 0.5s ease, box-shadow 0.5s ease;
    box-shadow: rgba(0, 0, 0, 0.15) 0 1px 1px 0, rgba(0, 0, 0, 0.05) 0 5px 8px 0;
  }
@media only screen and (min-width: 730px) {
    .page-header {
      height: 60px !important;
    }
  }
/*
    the phone with email section that brands can optionally have
    this is done here and not just for weasley so others can use
    later if they would like to
  */
.phone-with-email {
    display: flex;
    flex-direction: row;
    align-items: center;
    position: absolute;
    right: 10px;
    padding-top: 12px;
    z-index: 2;
  }
@media only screen and (min-width: 730px) {
    .phone-with-email {
      padding-top: 16px;
    }
  }
.phone-with-email__icon {
    display: block;
  }
.phone-with-email__icon--phone {
    width: 18px;
    height: 18px;
    min-width: 18px;
    /* IE */
    min-height: 18px;
    /* IE */
    transform: rotateY(180deg);
  }
.phone-with-email__icon--email {
    width: 24px;
    height: 24px;
    min-width: 24px;
    /* IE */
    min-height: 24px;
    /* IE */
  }
.phone-with-email__divider {
    margin: 0 8px;
    color: white;
  }
@media only screen and (min-width: 450px) {
    .phone-with-email__divider {
      margin: 0 12px;
    }
  }
@media only screen and (min-width: 1000px) {
    .phone-with-email__divider {
      margin: 0 24px;
    }
  }
.phone-with-email__link {
    text-decoration: none;
    outline: none;
    display: flex;
    align-items: center;
  }
.phone-with-email__text {
    color: white;
    font-size: 14px;
    line-height: 17px;
    font-weight: 500;
    padding-left: 20px;
    display: none;
  }
@media only screen and (min-width: 1000px) {
    .phone-with-email__text {
      display: block;
    }
  }
.page-header--transparent {
    background-color: transparent;
    border: 0;
    box-shadow: none;
  }
.page-header--transparent.page-header--scrolled {
    background-color: #fff;
    box-shadow: rgba(0, 0, 0, 0.15) 0 1px 1px 0, rgba(0, 0, 0, 0.05) 0 5px 8px 0;
  }
.page-container.is-active .page-header {
    left: 220px;
  }
.page-container.is-active .page-header__wide {
    left: 220px;
  }
@media only screen and (min-width: 730px) {
    .page-container.is-active .page-header {
      left: 0px;
    }
  }
.page-header__wrap {
    height: 100%;
    position: relative;
    padding: 0 10px;
  }
.page-header__wrap__wide {
    padding: 0 17px;
  }
.page-header__grid--wrapper {
    height: 100%;
    position: relative;
  }
@media only screen and (min-width: 1000px) {
    .page-header__grid--wrapper {
      max-width: 1440px;
      position: relative;
      height: 100%;
    }
  }
.page-header__grid__inner {
    height: 100%;
    /* fallback for IE 11 */
    justify-content: center !important;
  }
@media only screen and (min-width: 730px) {
    .page-header__grid__inner {
      justify-content: space-between !important;
    }
  }
.page-header__grid__inner__name--wrapper {
    margin: auto 0 auto 0;
    padding: 5px 10px 5px 5px;
    display: flex;
    position: relative;
    justify-content: center;
  }
@media only screen and (min-width: 730px) {
    .page-header__grid__inner__name--wrapper {
      justify-content: start;
      padding: 5px 0 5px 0;
    }
  }
.page-header__grid__inner__name--outbrain {
    background-image: url("https://app.clark.de/assets/svgs/clarkLogoBlue-9d248239a681af024d1a3bcc4bb00661.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    color: transparent;
    min-height: 16px;
    height: 20px;
    z-index: 10;
    overflow: hidden;
    transition: width 0.5s ease, height 0.5s ease;
    position: static;
    width: 105px;
    display: inline-block;
    margin: auto 0 auto 0;
  }
.page-header__grid__inner__name--outbrain--blue {
    background-image: url("https://app.clark.de/svgs/clarkLogoNew-e8eb16752fc14750ed296c3ee8fb856f.svg");
  }
@media only screen and (min-width: 730px) {
    .page-header__grid__inner__name--outbrain {
      width: 100px;
    }
  }
.page-header__grid__inner__name__text {
    display: inline;
    padding: 0 0 0 5px;
    font-size: 22px;
    font-weight: 500;
    /* fallback for IE 11 */
    line-height: 36px;
  }
@media only screen and (min-width: 730px) {
    .page-header__grid__inner__name__text {
      line-height: 46px;
    }
  }
@supports not (display: -ms-grid) {
    .page-header__grid__inner__name__text {
      line-height: 26px;
    }
  }
.page-header__grid__inner__cta {
    display: none;
  }
@media only screen and (min-width: 730px) {
    .page-header__grid__inner__cta {
      display: flex;
      justify-self: end;
      margin: auto 0 auto 0;
    }
  }
.page-header__grid__inner__cta__button {
    height: 40px;
    line-height: 21px;
    font-size: 16px;
    border-radius: 4px;
    min-width: 275px;
    border: none;
    font-weight: 500;
    margin: auto 0 auto 0;
  }
.page-header__name {
    position: absolute;
    background-image: url("https://app.clark.de/assets/svgs/clarkLogoBlue-9d248239a681af024d1a3bcc4bb00661.svg");
    width: 61px;
    display: block;
    background-repeat: no-repeat;
    background-size: 100%;
    color: transparent;
    left: calc(50% - 25px);
    top: 17px;
    min-height: 16px;
    height: 20px;
    z-index: 10;
    margin: 0 auto;
    overflow: hidden;
    transition: width 0.5s ease, height 0.5s ease;
  }
@media only screen and (min-width: 730px) {
    .page-header__name {
      width: 70px;
      left: 10px;
      top: 21px;
    }
  }
.page-header__name--white {
    background-image: url("https://app.clark.de/svgs/clarkLogoNew-e8eb16752fc14750ed296c3ee8fb856f.svg");
  }
.page-header--transparent.page-header--scrolled .page-header__name--white {
    background-image: url("https://app.clark.de/assets/svgs/clarkLogoBlue-9d248239a681af024d1a3bcc4bb00661.svg");
  }
@media only screen and (min-width: 730px) {
    .page-header--scrolled {
      height: 60px;
    }
  }
.only-mobile {
    display: inline-block;
    text-decoration: none;
    width: 1.6rem;
    margin-top: 12px;
    float: right;
  }
@media only screen and (min-width: 450px) {
    .only-mobile {
      display: none !important;
    }
  }
.only-mobile img {
    height: 100%;
    width: 100%;
  }
.page-header__flash {
    font-size: 12px;
    line-height: 16px;
    padding: 0.5em;
    text-align: center;
    top: 50px;
    width: 100%;
    position: absolute;
    z-index: 100;
  }
@media only screen and (min-width: 450px) {
    .page-header__flash {
      font-size: 13px;
      line-height: 18px;
    }
  }
@media only screen and (min-width: 730px) {
    .page-header__flash {
      font-size: 14px;
      line-height: 22px;
    }
  }
@media only screen and (min-width: 1000px) {
    .page-header__flash {
      font-size: 14px;
      line-height: 22px;
    }
  }
@media only screen and (min-width: 450px) {
    .page-header__flash {
      top: 60px;
    }
  }
.page-header__flash.page-header__flash--success {
    background-color: #2b6cde;
    color: #fff;
  }
.page-header__flash.page-header__flash--failure {
    background-color: #fd5740;
    color: #fff;
  }
/* END: modules/app/rails/page-header */
/* BEGIN: modules/app/buttons */
.btn, [class^=btn] {
    padding: 14px 37px;
    min-width: 180px;
    border: 2px solid;
    border-radius: 4px;
    text-decoration: none;
    outline: none;
    display: inline-block;
    text-transform: initial;
    -webkit-appearance: none;
    text-align: center;
    font-weight: 500;
    line-height: 1em;
  }
.btn-link {
    color: #2b6cde;
    border: none;
    background: none;
  }
.btn-link:hover {
    color: #094fcb;
  }
.body--web .btn-primary:hover, .body--web .btn-primary:active {
    background-color: #094fcb;
    border-color: #094fcb;
    cursor: pointer;
  }
.clark2 .body--web .btn-primary:hover {
    border-color: #094fcb;
    background-color: #094fcb;
    color: #ffffff;
  }
.clark2 .body--web .btn-primary:active {
    border-color: #0f3b8a;
    background-color: #0f3b8a;
    color: #ffffff;
  }
.body--web .btn-primary--special:hover, .body--web .btn-primary--special:active {
    background-color: #094fcb;
    border-color: #094fcb;
    cursor: pointer;
  }
.clark2 .body--web .btn-primary--special:hover {
    border-color: #094fcb;
    background-color: #094fcb;
    color: #ffffff;
  }
.clark2 .body--web .btn-primary--special:active {
    border-color: #0f3b8a;
    background-color: #0f3b8a;
    color: #ffffff;
  }
.body--web .btn-primary--orange:hover, .body--web .btn-primary--orange:active {
    background-color: #f97726;
    border-color: #f97726;
    cursor: pointer;
  }
.clark2 .body--web .btn-primary--orange:hover {
    border-color: #094fcb;
    background-color: #094fcb;
    color: #ffffff;
  }
.clark2 .body--web .btn-primary--orange:active {
    border-color: #0f3b8a;
    background-color: #0f3b8a;
    color: #ffffff;
  }
.body--web .btn-primary--important:hover, .body--web .btn-primary--important:active {
    background-color: #df4020;
    border-color: #df4020;
    cursor: pointer;
  }
.clark2 .body--web .btn-primary--important:hover {
    border-color: #094fcb;
    background-color: #094fcb;
    color: #ffffff;
  }
.clark2 .body--web .btn-primary--important:active {
    border-color: #0f3b8a;
    background-color: #0f3b8a;
    color: #ffffff;
  }
.body--web .btn-secondary:hover, .body--web .btn-secondary:active {
    background-color: #2b6cde;
    border-color: #2b6cde;
    color: white;
  }
.body--web .btn-secondary:hover .button--arrow__icon svg .left-arrow, .body--web .btn-secondary:hover .button--arrow__icon svg .right-arrow, .body--web .btn-secondary:active .button--arrow__icon svg .left-arrow, .body--web .btn-secondary:active .button--arrow__icon svg .right-arrow {
    fill: white;
  }
.clark2 .body--web .btn-secondary:hover {
    border-color: #094fcb;
    background-color: #094fcb;
    color: #ffffff;
  }
.clark2 .body--web .btn-secondary:active {
    border-color: #0f3b8a;
    background-color: #0f3b8a;
    color: #ffffff;
  }
.btn-primary {
    background-color: #2b6cde;
    border-color: #2b6cde;
    color: #fff;
    /* primary buttons that appear on blue bg's */
  }
.clark2 .btn-primary {
    border-color: #2b6cde;
    background-color: #2b6cde;
    color: #ffffff;
    transition: all 0.2s;
  }
.clark2 .btn-primary:hover {
    border-color: #094fcb;
    background-color: #094fcb;
    color: #ffffff;
  }
.clark2 .btn-primary:active {
    border-color: #0f3b8a;
    background-color: #0f3b8a;
    color: #ffffff;
  }
.btn-primary.btn--is-disabled, .btn-primary[disabled] {
    background-color: #bcd0f3;
    border-color: #bcd0f3;
  }
.clark2 .btn-primary.btn--is-disabled, .clark2 .btn-primary[disabled] {
    border-color: #bbcff2;
    background-color: #bbcff2;
    color: #ffffff;
  }
.btn-primary.btn--is-disabled:hover, .btn-primary.btn--is-disabled:active, .btn-primary[disabled]:hover, .btn-primary[disabled]:active {
    cursor: not-allowed;
    background-color: #bcd0f3;
    border-color: #bcd0f3;
  }
.clark2 .btn-primary.btn--is-disabled:hover, .clark2 .btn-primary.btn--is-disabled:active, .clark2 .btn-primary[disabled]:hover, .clark2 .btn-primary[disabled]:active {
    border-color: #bbcff2;
    background-color: #bbcff2;
    color: #ffffff;
  }
.btn-primary.btn--is-active {
    background-color: #094fcb;
    color: #fff;
    border-color: #094fcb;
  }
.clark2 .btn-primary.btn--is-active {
    border-color: #0f3b8a;
    background-color: #0f3b8a;
    color: #ffffff;
  }
.btn-primary--blue-bg {
    background-color: #fff;
    color: #333;
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.33);
    border: none;
  }
.btn-primary--blue-bg:hover, .btn-primary--blue-bg:active {
    background-color: #fff;
  }
.btn-primary--special {
    background-color: #2b6cde;
    border-color: #2b6cde;
    color: #fff;
    /* primary buttons that appear on blue bg's */
  }
.clark2 .btn-primary--special {
    border-color: #2b6cde;
    background-color: #2b6cde;
    color: #ffffff;
    transition: all 0.2s;
  }
.clark2 .btn-primary--special:hover {
    border-color: #094fcb;
    background-color: #094fcb;
    color: #ffffff;
  }
.clark2 .btn-primary--special:active {
    border-color: #0f3b8a;
    background-color: #0f3b8a;
    color: #ffffff;
  }
.btn-primary--special.btn--is-disabled, .btn-primary--special[disabled] {
    background-color: #bcd0f3;
    border-color: #bcd0f3;
  }
.clark2 .btn-primary--special.btn--is-disabled, .clark2 .btn-primary--special[disabled] {
    border-color: #bbcff2;
    background-color: #bbcff2;
    color: #ffffff;
  }
.btn-primary--special.btn--is-disabled:hover, .btn-primary--special.btn--is-disabled:active, .btn-primary--special[disabled]:hover, .btn-primary--special[disabled]:active {
    cursor: not-allowed;
    background-color: #bcd0f3;
    border-color: #bcd0f3;
  }
.clark2 .btn-primary--special.btn--is-disabled:hover, .clark2 .btn-primary--special.btn--is-disabled:active, .clark2 .btn-primary--special[disabled]:hover, .clark2 .btn-primary--special[disabled]:active {
    border-color: #bbcff2;
    background-color: #bbcff2;
    color: #ffffff;
  }
.btn-primary--special.btn--is-active {
    background-color: #094fcb;
    color: #fff;
    border-color: #094fcb;
  }
.clark2 .btn-primary--special.btn--is-active {
    border-color: #0f3b8a;
    background-color: #0f3b8a;
    color: #ffffff;
  }
.btn-primary--special--blue-bg {
    background-color: #fff;
    color: #333;
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.33);
    border: none;
  }
.btn-primary--special--blue-bg:hover, .btn-primary--special--blue-bg:active {
    background-color: #fff;
  }
.btn-primary--orange {
    background-color: #f99400;
    border-color: #f99400;
    color: #fff;
    /* primary buttons that appear on blue bg's */
  }
.clark2 .btn-primary--orange {
    border-color: #2b6cde;
    background-color: #2b6cde;
    color: #ffffff;
    transition: all 0.2s;
  }
.clark2 .btn-primary--orange:hover {
    border-color: #094fcb;
    background-color: #094fcb;
    color: #ffffff;
  }
.clark2 .btn-primary--orange:active {
    border-color: #0f3b8a;
    background-color: #0f3b8a;
    color: #ffffff;
  }
.btn-primary--orange.btn--is-disabled, .btn-primary--orange[disabled] {
    background-color: #fcc97f;
    border-color: #fcc97f;
  }
.clark2 .btn-primary--orange.btn--is-disabled, .clark2 .btn-primary--orange[disabled] {
    border-color: #bbcff2;
    background-color: #bbcff2;
    color: #ffffff;
  }
.btn-primary--orange.btn--is-disabled:hover, .btn-primary--orange.btn--is-disabled:active, .btn-primary--orange[disabled]:hover, .btn-primary--orange[disabled]:active {
    cursor: not-allowed;
    background-color: #fcc97f;
    border-color: #fcc97f;
  }
.clark2 .btn-primary--orange.btn--is-disabled:hover, .clark2 .btn-primary--orange.btn--is-disabled:active, .clark2 .btn-primary--orange[disabled]:hover, .clark2 .btn-primary--orange[disabled]:active {
    border-color: #bbcff2;
    background-color: #bbcff2;
    color: #ffffff;
  }
.btn-primary--orange.btn--is-active {
    background-color: #f97726;
    color: #fff;
    border-color: #f97726;
  }
.clark2 .btn-primary--orange.btn--is-active {
    border-color: #0f3b8a;
    background-color: #0f3b8a;
    color: #ffffff;
  }
.btn-primary--orange--blue-bg {
    background-color: #fff;
    color: #333;
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.33);
    border: none;
  }
.btn-primary--orange--blue-bg:hover, .btn-primary--orange--blue-bg:active {
    background-color: #fff;
  }
.btn-primary--important {
    background-color: #fd5740;
    border-color: #fd5740;
    color: #fff;
    /* primary buttons that appear on blue bg's */
  }
.clark2 .btn-primary--important {
    border-color: #2b6cde;
    background-color: #2b6cde;
    color: #ffffff;
    transition: all 0.2s;
  }
.clark2 .btn-primary--important:hover {
    border-color: #094fcb;
    background-color: #094fcb;
    color: #ffffff;
  }
.clark2 .btn-primary--important:active {
    border-color: #0f3b8a;
    background-color: #0f3b8a;
    color: #ffffff;
  }
.btn-primary--important.btn--is-disabled, .btn-primary--important[disabled] {
    background-color: #df4020;
    border-color: #df4020;
  }
.clark2 .btn-primary--important.btn--is-disabled, .clark2 .btn-primary--important[disabled] {
    border-color: #bbcff2;
    background-color: #bbcff2;
    color: #ffffff;
  }
.btn-primary--important.btn--is-disabled:hover, .btn-primary--important.btn--is-disabled:active, .btn-primary--important[disabled]:hover, .btn-primary--important[disabled]:active {
    cursor: not-allowed;
    background-color: #df4020;
    border-color: #df4020;
  }
.clark2 .btn-primary--important.btn--is-disabled:hover, .clark2 .btn-primary--important.btn--is-disabled:active, .clark2 .btn-primary--important[disabled]:hover, .clark2 .btn-primary--important[disabled]:active {
    border-color: #bbcff2;
    background-color: #bbcff2;
    color: #ffffff;
  }
.btn-primary--important.btn--is-active {
    background-color: #df4020;
    color: #fff;
    border-color: #df4020;
  }
.clark2 .btn-primary--important.btn--is-active {
    border-color: #0f3b8a;
    background-color: #0f3b8a;
    color: #ffffff;
  }
.btn-primary--important--blue-bg {
    background-color: #fff;
    color: #333;
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.33);
    border: none;
  }
.btn-primary--important--blue-bg:hover, .btn-primary--important--blue-bg:active {
    background-color: #fff;
  }
.btn-secondary {
    background-color: white;
    border-color: #2b6cde;
    color: #2b6cde;
  }
.clark2 .btn-secondary {
    border-color: #daddec;
    background-color: #ffffff;
    color: #2b6cde;
    transition: all 0.2s;
  }
.clark2 .btn-secondary:hover {
    border-color: #094fcb;
    background-color: #094fcb;
    color: #ffffff;
  }
.clark2 .btn-secondary:active {
    border-color: #0f3b8a;
    background-color: #0f3b8a;
    color: #ffffff;
  }
.btn-secondary.btn--is-disabled, .btn-secondary[disabled] {
    background-color: #bcd0f3;
    border-color: #bcd0f3;
  }
.clark2 .btn-secondary.btn--is-disabled, .clark2 .btn-secondary[disabled] {
    border-color: #bbcff2;
    background-color: #bbcff2;
    color: #ffffff;
  }
.btn-secondary.btn--is-disabled:hover, .btn-secondary.btn--is-disabled:active, .btn-secondary[disabled]:hover, .btn-secondary[disabled]:active {
    cursor: not-allowed;
  }
.clark2 .btn-secondary.btn--is-disabled:hover, .clark2 .btn-secondary.btn--is-disabled:active, .clark2 .btn-secondary[disabled]:hover, .clark2 .btn-secondary[disabled]:active {
    border-color: #bbcff2;
    background-color: #bbcff2;
    color: #ffffff;
  }
.btn-secondary .button--arrow__icon svg .left-arrow, .btn-secondary .button--arrow__icon svg .right-arrow {
    fill: #2b6cde;
  }
.btn-outline {
    background-color: white;
    border-color: #2b6cde;
    color: #2b6cde;
    /* the orange one */
    /* the light grey one */
  }
.btn-outline:hover, .btn-outline:active {
    border-color: #094fcb;
    color: #094fcb;
  }
.btn-outline.btn--is-disabled, .btn-outline[disabled] {
    background-color: #bcd0f3;
    border-color: #bcd0f3;
  }
.btn-outline.btn--is-disabled:hover, .btn-outline.btn--is-disabled:active, .btn-outline[disabled]:hover, .btn-outline[disabled]:active {
    cursor: not-allowed;
  }
.btn-outline--secondary {
    background-color: white;
    border-color: #2b6cde;
    color: #2b6cde;
  }
.btn-outline--secondary:hover, .btn-outline--secondary:active {
    border-color: #094fcb;
    color: #094fcb;
  }
.btn-outline--secondary.btn--is-disabled, .btn-outline--secondary[disabled] {
    background-color: #bcd0f3;
    border-color: #bcd0f3;
  }
.btn-outline--secondary.btn--is-disabled:hover, .btn-outline--secondary.btn--is-disabled:active, .btn-outline--secondary[disabled]:hover, .btn-outline--secondary[disabled]:active {
    cursor: not-allowed;
  }
.btn-outline--tertiary {
    background-color: white;
    border-color: #787878;
    color: #787878;
  }
.btn-outline--tertiary:hover, .btn-outline--tertiary:active {
    border-color: #333;
    color: #333;
  }
.btn-outline--tertiary.btn--is-disabled, .btn-outline--tertiary[disabled] {
    background-color: #f6f6f6;
    border-color: #f6f6f6;
  }
.btn-outline--tertiary.btn--is-disabled:hover, .btn-outline--tertiary.btn--is-disabled:active, .btn-outline--tertiary[disabled]:hover, .btn-outline--tertiary[disabled]:active {
    cursor: not-allowed;
  }
.btn--block {
    display: block;
    max-width: 95%;
    margin: 30px auto;
    text-align: center;
  }
@media only screen and (min-width: 730px) {
    .btn--block {
      max-width: 300px;
    }
  }
.btn--block.btn--block-left {
    margin-left: 0;
  }
.btn--text {
    background: none;
    border: none;
    color: #787878;
    text-align: center;
    padding: 10px 3px;
  }
.clark2 .btn--text {
    color: #283e66;
  }
.btn--text.btn--text-underline {
    text-decoration: underline;
  }
.btn--mobile-block {
    width: 100%;
    border-radius: 0;
  }
@media only screen and (min-width: 450px) {
    .btn--mobile-block {
      border-radius: 4px;
      width: auto;
    }
  }
@media only screen and (min-width: 450px) {
    .body--mobile-ios .next-fixed-btn, .body--mobile-android .next-fixed-btn {
      padding: 0;
    }
  }
.btn-back-split, .btn-next-split {
    flex-basis: 45%;
    margin-top: 10px;
    margin-bottom: 10px;
    border-radius: 4px;
    padding: 14px 0;
  }
@media only screen and (min-width: 450px) {
    .btn-back-split, .btn-next-split {
      margin-top: 0;
      margin-bottom: 0;
      flex-basis: auto;
      padding: 14px 37px;
    }
  }
.btn-back-split {
    margin-right: 3% !important;
  }
@media only screen and (min-width: 450px) {
    .btn-back-split {
      margin-right: 20px !important;
    }
  }
.btn--arrow {
    position: relative;
    /*
      secondary btn hacky override for Clark2 theme only
      TODO: Implement in a clean way when revamping buttons
    */
  }
.btn--arrow:disabled .button--arrow__icon {
    display: none;
  }
.clark2 .btn--arrow.btn-secondary {
    border-color: #2b6cde;
  }
.clark2 .btn--arrow.btn-secondary:hover {
    border-color: #094fcb;
  }
.clark2 .btn--arrow.btn-secondary:active {
    border-color: #0f3b8a;
  }
.clark2 .btn--arrow.btn-secondary:disabled {
    border-color: #bbcff2;
  }
.button--arrow {
    position: relative;
  }
.button--arrow__icon, .button--arrow__icon svg {
    display: block;
    width: 10px;
    height: 13px;
  }
.button--arrow__icon {
    position: absolute;
    /* Calc as we dont know the height of the button, depends on the markup its wrapped in with padding etc */
    top: calc(50% - 7px);
  }
.button--arrow__icon--right {
    right: 12px;
  }
.button--arrow__icon--left {
    left: 12px;
  }
.btn--icon {
    position: relative;
  }
.btn--icon i {
    position: absolute;
    top: calc(50% - 13px);
  }
.btn--icon--left i {
    left: 11px;
  }
.btn--icon--right i {
    right: 11px;
  }
/* END: modules/app/buttons */
/* BEGIN: modules/app/rails/page-nav */
.page-navigation {
    height: 100vh;
    width: 220px;
    padding-top: 20px;
    position: absolute;
    left: 0;
    top: 0;
    transform: translateX(-100%);
    transition: left 0.5s ease;
    z-index: 2;
    background: #fff;
    box-shadow: inset -28px 0 28px -28px rgba(0, 0, 0, 0.4);
  }
@media only screen and (min-width: 730px) {
    .page-navigation {
      position: relative;
      transform: translateX(0);
      top: 0;
      float: right;
      width: 100%;
      height: 100%;
      box-shadow: none;
      padding: 0 35px 0 70px;
    }
  }
@media only screen and (min-width: 1000px) {
    .page-navigation {
      margin-right: 19%;
      padding-right: 0;
      width: 81%;
    }
  }
.page-navigation .list {
    display: flex;
    flex-direction: column;
    text-align: left;
    list-style: none;
    padding-top: 35px;
    background-image: url("/assets/clienthttps://app.clark.de/assets/svgs/clarkLogoBlue-9d248239a681af024d1a3bcc4bb00661.svg");
    background-repeat: no-repeat;
    background-size: 30% auto;
    background-position: center top;
    font-size: 0.9em;
  }
@media only screen and (min-width: 730px) {
    .page-navigation .list {
      flex-direction: row;
      font-size: 0.8em;
      justify-content: space-around;
      flex-wrap: nowrap;
      height: 100%;
      margin: 0 0 0 auto;
      background: none;
      padding-top: 0;
      padding-left: 40px;
    }
  }
.page-navigation .list--left {
    padding-left: 10px;
  }
.page-navigation .list-ing, .page-navigation .list-psd, .page-navigation .list-primoco, .page-navigation .list-partner {
    display: flex;
    flex-direction: column;
    text-align: left;
    list-style: none;
    padding-top: 35px;
    background-image: url("/assets/clienthttps://app.clark.de/assets/svgs/clarkLogoBlue-9d248239a681af024d1a3bcc4bb00661.svg");
    background-repeat: no-repeat;
    background-size: 30% auto;
    background-position: center top;
    font-size: 0.9em;
  }
@media only screen and (min-width: 730px) {
    .page-navigation .list-ing, .page-navigation .list-psd, .page-navigation .list-primoco, .page-navigation .list-partner {
      flex-direction: row;
      font-size: 0.8em;
      justify-content: flex-start;
      flex-wrap: nowrap;
      height: 100%;
      margin: 0 0 0 auto;
      background: none;
      padding-top: 0;
      padding-left: 40px;
    }
  }
.page-navigation .list__item {
    margin: 0;
    padding: 10px 0 10px 20px;
    border: none;
    border-top: 1px solid #d6d6d6;
    border-radius: 0;
    background-color: transparent;
    -webkit-box-ordinal-group: 1;
    box-ordinal-group: 1;
  }
.page-navigation .list__item.register {
    -webkit-box-ordinal-group: 2;
    box-ordinal-group: 2;
  }
@media only screen and (min-width: 730px) {
    .page-navigation .list__item {
      margin-bottom: 0;
      margin-right: 10px;
      align-self: center;
      text-align: center;
      border: none;
      padding: 20px 0;
    }
  }
.miles-and-more-register {
    margin-right: 30px !important;
  }
.miles-and-more-login {
    margin-right: 20px !important;
  }
.nav-only-with-register-and-login {
    justify-content: flex-end !important;
  }
.finanzblick-navigation, .psd-navigation, .primoco-navigation, .partner-navigation {
    height: 100%;
    width: 220px;
    position: absolute;
    left: 0;
    top: 20px;
    transform: translateX(-100%);
    transition: left 0.5s ease;
    z-index: 2;
  }
@media only screen and (min-width: 730px) {
    .finanzblick-navigation, .psd-navigation, .primoco-navigation, .partner-navigation {
      position: relative;
      transform: translateX(0);
      top: 0;
      float: right;
      width: 100%;
      padding: 0 35px 0 70px;
    }
  }
@media only screen and (min-width: 1000px) {
    .finanzblick-navigation, .psd-navigation, .primoco-navigation, .partner-navigation {
      margin-right: 19%;
      padding-right: 0;
      width: 81%;
    }
  }
.finanzblick-navigation .list, .psd-navigation .list, .primoco-navigation .list, .partner-navigation .list {
    display: flex;
    flex-direction: column;
    text-align: left;
    list-style: none;
    padding-top: 35px;
    background-image: url("/assets/clienthttps://app.clark.de/assets/svgs/clarkLogoBlue-9d248239a681af024d1a3bcc4bb00661.svg");
    background-repeat: no-repeat;
    background-size: 30% auto;
    background-position: center top;
    font-size: 0.9em;
  }
@media only screen and (min-width: 730px) {
    .finanzblick-navigation .list, .psd-navigation .list, .primoco-navigation .list, .partner-navigation .list {
      flex-direction: row;
      font-size: 0.8em;
      flex-wrap: nowrap;
      height: 100%;
      margin: 0 0 0 auto;
      background: none;
      padding-top: 0;
      padding-left: 40px;
    }
  }
.finanzblick-navigation .list__item, .psd-navigation .list__item, .primoco-navigation .list__item, .partner-navigation .list__item {
    margin: 0;
    padding: 10px 0 10px 20px;
    border: none;
    border-top: 1px solid #d6d6d6;
    border-radius: 0;
    background-color: transparent;
    -webkit-box-ordinal-group: 1;
    box-ordinal-group: 1;
  }
.finanzblick-navigation .list__item.register, .finanzblick-navigation .list__item.mein_konto, .psd-navigation .list__item.register, .psd-navigation .list__item.mein_konto, .primoco-navigation .list__item.register, .primoco-navigation .list__item.mein_konto, .partner-navigation .list__item.register, .partner-navigation .list__item.mein_konto {
    -webkit-box-ordinal-group: 2;
    box-ordinal-group: 2;
  }
@media only screen and (min-width: 450px) {
    .finanzblick-navigation .list__item.register, .finanzblick-navigation .list__item.mein_konto, .psd-navigation .list__item.register, .psd-navigation .list__item.mein_konto, .primoco-navigation .list__item.register, .primoco-navigation .list__item.mein_konto, .partner-navigation .list__item.register, .partner-navigation .list__item.mein_konto {
      margin-left: auto;
    }
  }
@media only screen and (min-width: 730px) {
    .finanzblick-navigation .list__item, .psd-navigation .list__item, .primoco-navigation .list__item, .partner-navigation .list__item {
      margin-bottom: 0;
      margin-right: 10px;
      align-self: center;
      text-align: center;
      border: none;
      padding: 0;
    }
  }
.list__item--margin-top {
    margin-top: 80px;
  }
@media only screen and (min-width: 730px) {
    .list__item--margin-top {
      margin-top: 0;
    }
  }
@media only screen and (min-width: 730px) {
    .list__item--margin-left {
      margin-left: 15px;
    }
  }
.list__item--left-items {
    display: flex;
    align-items: flex-start !important;
    flex-direction: column;
  }
@media only screen and (min-width: 730px) {
    .list__item--left-items {
      flex-direction: row;
    }
  }
.list__item--finanzblick {
    position: absolute;
    background-image: url("/svgs/finanzBlickLogo.svg");
    width: 4.8rem;
    height: 1.9rem;
    display: block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    text-indent: 9999px;
    text-decoration: none;
    left: 0;
    right: 0;
    overflow: hidden;
    margin-bottom: 4px !important;
  }
@media only screen and (min-width: 450px) {
    .list__item--finanzblick {
      float: left;
      position: relative;
      left: auto;
      right: auto;
      width: 6.2rem;
      height: 2.4rem;
    }
  }
.list__item--ing {
    position: absolute;
    background-image: url("/svgs/ingLogo.svg");
    display: block;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    text-indent: 9999px;
    text-decoration: none;
    left: 0;
    right: 0;
    overflow: hidden;
    margin-bottom: 4px !important;
    height: 27px;
    width: 107px;
  }
@media only screen and (min-width: 730px) {
    .list__item--ing {
      margin-top: 12px !important;
    }
  }
@media only screen and (min-width: 450px) {
    .list__item--ing {
      float: left;
      position: relative;
    }
  }
.list__item--1822direkt {
    position: absolute;
    background-image: url("/svgs/1822direktLogo.svg");
    display: block;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    text-indent: 9999px;
    text-decoration: none;
    left: 0;
    right: 0;
    overflow: hidden;
    margin-bottom: 4px !important;
    height: 27px;
    width: 134px;
  }
@media only screen and (min-width: 730px) {
    .list__item--1822direkt {
      margin-top: 12px !important;
    }
  }
@media only screen and (min-width: 450px) {
    .list__item--1822direkt {
      float: left;
      position: relative;
    }
  }
.list__item--volksbank {
    position: absolute;
    background-image: url("/svgs/volksbank.svg");
    display: block;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    text-indent: 9999px;
    text-decoration: none;
    left: 0;
    right: 0;
    overflow: hidden;
    height: 22px;
    width: 107px;
    padding-top: 0 !important;
  }
@media only screen and (min-width: 450px) {
    .list__item--volksbank {
      float: left;
      position: relative;
    }
  }
.list__item--psd-logo {
    position: absolute;
    background-image: url("https://app.clark.de/svgs/psdLogo-c3ea1f5de1936f2690ece451fd9c2812.svg");
    display: block;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    text-indent: 9999px;
    text-decoration: none;
    left: 0;
    right: 0;
    overflow: hidden;
    margin-bottom: 4px !important;
    height: 70px;
    width: 70px;
  }
@media only screen and (min-width: 730px) {
    .list__item--psd-logo {
      margin-left: 12px !important;
      margin-top: 10px !important;
      margin-bottom: 10px !important;
      height: 43px;
      width: 45px;
    }
  }
@media only screen and (min-width: 450px) {
    .list__item--psd-logo {
      float: left;
      position: relative;
    }
  }
.list__item--primoco-logo {
    background-image: url("https://app.clark.de/svgs/primocoLogo-5575bc232d6ff621a03e0f8915b90e89.svg");
    display: block;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    margin-bottom: 4px !important;
    width: 89px;
    height: 30px;
    border-top: none;
  }
@media only screen and (min-width: 730px) {
    .list__item--primoco-logo {
      margin-left: 18px;
      margin-top: 10px !important;
      margin-bottom: 10px !important;
    }
  }
@media only screen and (min-width: 450px) {
    .list__item--primoco-logo {
      float: left;
      position: relative;
    }
  }
.list__item--assona-logo {
    background-image: url("/svgs/assonaLogo.svg");
    display: block;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    margin-bottom: 4px !important;
    width: 83px;
    height: 33px;
    border-top: none;
    margin-left: -9px;
  }
@media only screen and (min-width: 730px) {
    .list__item--assona-logo {
      margin-left: 0px;
      margin-top: 10px !important;
      margin-bottom: 10px !important;
    }
  }
@media only screen and (min-width: 450px) {
    .list__item--assona-logo {
      float: left;
      position: relative;
    }
  }
.list__item--mam-logo {
    background-image: url("/svgs/mamNew.svg");
    display: block;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    margin-bottom: 4px !important;
    width: 122px;
    height: 70px;
    border-top: none;
    margin-left: -9px;
  }
@media only screen and (min-width: 730px) {
    .list__item--mam-logo {
      margin-left: 0px;
      margin-top: 10px !important;
      margin-bottom: 10px !important;
    }
  }
@media only screen and (min-width: 450px) {
    .list__item--mam-logo {
      float: left;
      position: relative;
    }
  }
.list__item--dkb {
    position: absolute;
    background-image: url("/svgs/dkb.svg");
    display: block;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    text-indent: 9999px;
    text-decoration: none;
    left: 0;
    right: 0;
    overflow: hidden;
    margin-bottom: 4px !important;
    height: 43px;
    margin-top: 5px;
    width: 63px;
  }
@media only screen and (min-width: 730px) {
    .list__item--dkb {
      margin-top: 4px !important;
    }
  }
@media only screen and (min-width: 450px) {
    .list__item--dkb {
      float: left;
      position: relative;
    }
  }
.list__item--geldboost {
    position: absolute;
    background-image: url("/svgs/geldboost-logo.png");
    display: block;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    text-indent: 9999px;
    text-decoration: none;
    left: 0;
    right: 0;
    overflow: hidden;
    margin-bottom: 4px !important;
    height: 30px;
    margin-top: 5px;
    width: 170px;
  }
@media only screen and (min-width: 730px) {
    .list__item--geldboost {
      margin-top: 4px !important;
    }
  }
@media only screen and (min-width: 450px) {
    .list__item--geldboost {
      float: left;
      position: relative;
    }
  }
.list__item--optiopay {
    position: absolute;
    background-image: url("/svgs/op-2016.png");
    display: block;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    text-indent: 9999px;
    text-decoration: none;
    left: 0;
    right: 0;
    overflow: hidden;
    margin-bottom: 4px !important;
    height: 30px;
    margin-top: 5px;
    width: 140px;
  }
@media only screen and (min-width: 730px) {
    .list__item--optiopay {
      margin-top: 4px !important;
    }
  }
@media only screen and (min-width: 450px) {
    .list__item--optiopay {
      float: left;
      position: relative;
    }
  }
.list__item--fianancescout24 {
    position: absolute;
    background-image: url("/svgs/financescout24-logo.png");
    display: block;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    text-indent: 9999px;
    text-decoration: none;
    left: 0;
    right: 0;
    overflow: hidden;
    margin-bottom: 4px !important;
    height: 30px;
    margin-top: 5px;
    width: 70px;
  }
@media only screen and (min-width: 730px) {
    .list__item--fianancescout24 {
      margin-top: 4px !important;
    }
  }
@media only screen and (min-width: 450px) {
    .list__item--fianancescout24 {
      float: left;
      position: relative;
    }
  }
.list__item--finanzblick-title, .list__item--partner-title, .list__item--ing-title, .list__item--psd-title {
    font-size: 14px;
    color: #626262;
    padding-left: 0px !important;
  }
.list__item--assona-title, .list__item--primoco-title {
    font-size: 14px;
    color: #333;
    padding-left: 0px !important;
  }
.list__item--no-border {
    border-top: none !important;
  }
.list__item--has-subnav {
    position: relative;
  }
.list__item--has-subnav:hover .page-subnav {
    display: block;
  }
.page-subnav {
    margin-top: 0;
    margin-bottom: 0;
    list-style: none;
    padding-left: 0;
  }
.toggle-submenu {
    display: none;
    margin-bottom: 0.8rem;
    padding-bottom: 0 !important;
    border-bottom: 2px solid transparent;
  }
@media only screen and (min-width: 450px) {
    .toggle-submenu {
      display: inline-block;
      margin-bottom: 0;
    }
  }
.list-simple li {
    font-size: 1em;
    line-height: 1.5;
  }
.page-navigation__link {
    color: #626262;
    font-weight: 500;
    text-decoration: none;
  }
.page-navigation__link:active, .page-navigation__link:hover {
    color: #2b6cde;
  }
@media only screen and (min-width: 730px) {
    .page-header--transparent .page-navigation__link {
      color: #fff;
    }
    .page-header--transparent .page-navigation__link:hover, .page-header--transparent .page-navigation__link:active {
      color: #d6d6d6;
    }
  }
.page-header--transparent.page-header--scrolled .page-navigation__link {
    color: #626262;
  }
.page-header--transparent.page-header--scrolled .page-navigation__link:active, .page-header--transparent.page-header--scrolled .page-navigation__link:hover {
    color: #2b6cde;
  }
.page-navigation__link.toggle_product-sub-menu {
    display: flex;
    justify-content: space-between;
    width: 100%;
  }
.toggle_product-sub-menu__arrow {
    margin-right: 25px;
    margin-top: 6px;
    border: solid #17203d;
    border-width: 0px 2px 2px 0px;
    transform: rotate(315deg);
    width: 9px;
    height: 9px;
  }
@media only screen and (min-width: 450px) {
    .toggle_product-sub-menu__arrow {
      display: none;
    }
  }
.page-navigation .btn {
    display: inline-block;
    padding: 12px 37px;
  }
.page-navigation__toggle {
    float: left;
    position: relative;
    -webkit-appearance: none;
    border-radius: 0;
    box-shadow: none;
    border: none;
    background-color: transparent;
    padding: 0;
    margin: 12px 0 0;
    height: 25px;
    outline: none;
    color: #2b6cde;
  }
.page-header--transparent .page-navigation__toggle {
    color: #fff;
  }
.page-header--transparent.page-header--scrolled .page-navigation__toggle {
    color: #2b6cde;
  }
.page-navigation__toggle .hamburger-menu {
    display: inline-block;
    position: relative;
    width: 15px;
    height: 2px;
    border-radius: 3px;
    background-color: #2b6cde;
  }
.page-navigation__toggle .hamburger-menu:after, .page-navigation__toggle .hamburger-menu:before {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    border-radius: 3px;
    background-color: #2b6cde;
  }
.page-navigation__toggle .hamburger-menu:after {
    bottom: 5px;
  }
.page-navigation__toggle .hamburger-menu:before {
    bottom: 10px;
  }
.page-header--transparent .page-navigation__toggle .hamburger-menu {
    background-color: #fff;
  }
.page-header--transparent .page-navigation__toggle .hamburger-menu:after, .page-header--transparent .page-navigation__toggle .hamburger-menu:before {
    background-color: #fff;
  }
.page-header--transparent.page-header--scrolled .page-navigation__toggle .hamburger-menu {
    background-color: #2b6cde;
  }
.page-header--transparent.page-header--scrolled .page-navigation__toggle .hamburger-menu:after, .page-header--transparent.page-header--scrolled .page-navigation__toggle .hamburger-menu:before {
    background-color: #2b6cde;
  }
@media only screen and (min-width: 730px) {
    .page-navigation__toggle {
      display: none;
    }
  }
.page-subnav {
    text-align: left;
  }
@media only screen and (min-width: 450px) {
    .page-subnav {
      padding: 1rem;
      position: absolute;
      display: none;
      top: 68px;
      right: -1.25rem;
      min-width: 11.25rem;
      border-radius: 2px;
    }
  }
@media only screen and (min-width: 450px) and (min-width: 450px) {
    .page-subnav {
      background-color: #fff;
      box-shadow: rgba(0, 0, 0, 0.15) 0 1px 1px 0, rgba(0, 0, 0, 0.05) 0 5px 8px 0;
    }
  }
@media only screen and (min-width: 450px) {
    .page-subnav:before {
      position: absolute;
      content: "";
      width: 0;
      height: 0;
      border-left: 10px solid transparent;
      border-right: 10px solid transparent;
      border-bottom: 10px solid #17203d;
      top: -0.625rem;
      right: 3.75rem;
    }
  }
@media only screen and (min-width: 450px) and (min-width: 450px) {
    .page-subnav:before {
      border-bottom: 10px solid #fff;
    }
  }
@media only screen and (min-width: 450px) {
    .page-subnav:after {
      content: "";
      top: -1.875rem;
      right: 0;
      height: 1.875rem;
      width: 100%;
      position: absolute;
    }
  }
.page-subnav__link {
    color: #666666;
    text-decoration: none;
    display: block;
    margin-bottom: 0.8rem;
    font-weight: 400;
  }
@media only screen and (min-width: 450px) {
    .page-subnav__link {
      margin-bottom: 0.3rem;
    }
  }
.page-subnav__link span {
    border-bottom: 2px solid transparent;
    display: inline-block;
  }
.page-subnav__link:hover span, .page-subnav__link:active span {
    color: #2b6cde;
    cursor: pointer;
  }
.register-btn {
    background-color: transparent;
    border-color: #2b6cde;
    color: #2b6cde;
  }
.register-btn:hover, .register-btn:active {
    border-color: #2b6cde;
    background-color: #2b6cde;
    color: #fff;
  }
@media only screen and (min-width: 730px) {
    .page-header--transparent .register-btn:hover, .page-header--transparent .register-btn:active {
      border-color: transparent;
      background: #fff;
      color: #2b6cde;
    }
  }
.page-header--transparent.page-header--scrolled .register-btn {
    background-color: transparent;
    border-color: #2b6cde;
    color: #2b6cde;
  }
.page-header--transparent.page-header--scrolled .register-btn:hover, .page-header--transparent.page-header--scrolled .register-btn:active {
    border-color: #2b6cde;
    background-color: #2b6cde;
    color: #fff;
  }
.login-btn {
    color: #2b6cde;
  }
.login-btn:hover, .login-btn:active {
    color: #094fcb;
  }
@media only screen and (min-width: 730px) {
    .page-header--transparent .login-btn:hover, .page-header--transparent .login-btn:active {
      color: #d6d6d6;
    }
  }
.phone-number {
    position: absolute;
    right: 0;
    top: 16px;
    width: 35px;
    text-decoration: none;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    height: 18px;
    align-items: center;
    font-size: 0.8em;
    z-index: 9999;
  }
@media only screen and (min-width: 730px) {
    .phone-number {
      top: 21px;
    }
  }
@media only screen and (min-width: 1000px) {
    .phone-number {
      top: 21px;
      width: 19%;
    }
  }
.phone-number:hover {
    border: none;
  }
.phone-number .phone-image {
    height: 100%;
    width: 30px;
    margin-right: 5px;
    fill: #2b6cde;
  }
.phone-number .phone-image #phone {
    fill: #2b6cde;
  }
.page-header--transparent .phone-number .phone-image #phone {
    fill: #fff;
  }
.page-header--transparent.page-header--scrolled .phone-number .phone-image #phone {
    fill: #3a6bc1;
  }
.phone-number .phone-number__tel {
    font-weight: 500;
    display: none;
    white-space: nowrap;
  }
.phone-number .phone-number__tel:hover {
    color: #d6d6d6 !important;
  }
@media only screen and (min-width: 1000px) {
    .phone-number .phone-number__tel {
      display: inline;
      color: #626262;
    }
  }
@media only screen and (min-width: 1000px) {
    .page-header--transparent .phone-number .phone-number__tel {
      display: inline;
      color: #fff;
    }
  }
.page-header--transparent.page-header--scrolled .phone-number .phone-number__tel {
    color: #626262;
  }
/* END: modules/app/rails/page-nav */
/* BEGIN: modules/app/rails/page-footer */
.page-footer {
    background-color: #17203d;
    color: #fff;
    text-align: center;
    clear: both;
    font-weight: 400;
    font-size: 14px;
    line-height: 27px;
    text-align: left;
    line-height: 37px !important;
  }
@media only screen and (min-width: 450px) {
    .page-footer {
      font-size: 15px;
      line-height: 27px;
    }
  }
@media only screen and (min-width: 730px) {
    .page-footer {
      font-size: 16px;
      line-height: 34px;
    }
  }
@media only screen and (min-width: 1000px) {
    .page-footer {
      font-size: 16px;
      line-height: 34px;
    }
  }
.page-footer__outbrain__links {
    font-size: 16px;
    line-height: 24px;
  }
@media only screen and (min-width: 730px) {
    .page-footer__outbrain__links {
      margin: auto 0 auto 0;
    }
  }
.page-footer--white-label .page-footer__wrapper {
    display: flex;
    flex-direction: column;
  }
@media only screen and (min-width: 730px) {
    .page-footer--white-label .page-footer__wrapper {
      flex-direction: row;
      align-items: center;
    }
  }
.page-footer--white-label .page-footer__col {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
@media only screen and (min-width: 730px) {
    .page-footer--white-label .page-footer__col {
      width: 33%;
      align-items: left;
    }
  }
.page-footer--white-label .page-footer__col__logo {
    display: block;
    width: 108px;
    margin-bottom: 30px;
  }
@media only screen and (min-width: 730px) {
    .page-footer--white-label .page-footer__col__logo {
      margin-bottom: 0;
    }
  }
.page-footer--white-label .page-footer__col__logo svg {
    width: 108px;
    display: block;
    height: auto;
  }
.page-footer--white-label .page-footer__col__logo svg polyline, .page-footer--white-label .page-footer__col__logo svg polygon, .page-footer--white-label .page-footer__col__logo svg path {
    fill: white;
    stroke: white;
  }
.page-footer--white-label .page-footer__col__trust {
    list-style-type: none;
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0;
    margin: 0;
  }
.page-footer--white-label .page-footer__col__trust__item {
    padding: 0;
    margin: 0 20px;
  }
.page-footer--white-label .page-footer__col__trust__item__image {
    display: block;
  }
.page-footer--white-label .page-footer__col__trust__item__image--tuv {
    width: 64px;
    /* @TODO we cant support mix blend mode right now due to IE so wil request a new asset in a new ticket */
    /* mix-blend-mode: screen; */
  }
.page-footer--white-label .page-footer__col__trust__item__image--aus {
    width: 45px;
  }
.page-footer--white-label .page-footer__col__trust__item__image--norton {
    width: 67px;
  }
.page-footer--white-label .page-footer__col__legal {
    list-style-type: none;
    margin: 30px 0 0 0;
    padding: 0;
    display: flex;
    flex-direction: row;
    align-self: center;
    line-height: 1em;
  }
@media only screen and (min-width: 730px) {
    .page-footer--white-label .page-footer__col__legal {
      margin: 0;
      align-self: flex-end;
      flex-direction: column;
    }
  }
.page-footer--white-label .page-footer__col__legal__item {
    margin: 0 10px;
    padding: 0;
  }
@media only screen and (min-width: 730px) {
    .page-footer--white-label .page-footer__col__legal__item {
      margin: 0 0 10px 0;
    }
  }
@media only screen and (min-width: 730px) {
    .page-footer--white-label .page-footer__col__legal__item:last-child {
      margin-bottom: 0;
    }
  }
.page-footer--white-label .page-footer__col__legal__item__link {
    color: white;
    text-decoration: none;
  }
.page-footer--white-label--centered .page-footer__wrapper {
    display: flex;
    flex-direction: column;
  }
.page-footer--white-label--centered .page-footer__col {
    width: 100%;
    align-items: center;
  }
.page-footer--white-label--centered .page-footer__col--last {
    margin-bottom: -39px;
  }
@media only screen and (min-width: 730px) {
    .page-footer--white-label--centered .page-footer__col--last {
      margin-bottom: -24px;
    }
  }
@media only screen and (min-width: 730px) {
    .page-footer--white-label--centered .page-footer__col--last .page-footer__col__legal__item {
      margin: 0 20px 0px 20px;
    }
  }
.page-footer--white-label--centered .page-footer__col__legal {
    flex-wrap: wrap;
  }
@media only screen and (min-width: 730px) {
    .page-footer--white-label--centered .page-footer__col__legal {
      flex-wrap: nowrap;
      flex-direction: row;
      margin: 0 auto;
      justify-content: space-evenly;
    }
  }
.page-footer--white-label--centered .page-footer__col__legal__item {
    text-align: center;
    width: 50%;
    margin: 0 0 20px 0;
  }
.page-footer--white-label--centered .page-footer__col__legal__item__link {
    color: white;
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
  }
@media only screen and (min-width: 730px) {
    .page-footer--white-label--centered .page-footer__col__legal__item {
      width: auto;
      margin: 0 20px 32px 20px;
    }
  }
.page-footer a {
    color: inherit;
    text-decoration: none;
  }
.page-footer a:hover {
    color: #bbb;
  }
.page-footer__list {
    /* the three in the middle are not 20% each on large bp so had to have some custom flex basis here */
    /* due to not being able to pad flex cosl in IE (flex-basis adds to border-box ...) */
  }
.page-footer__list a {
    display: block;
  }
@media only screen and (min-width: 730px) {
    .page-footer__list--three {
      flex-basis: 23% !important;
      width: 23% !important;
    }
  }
@media only screen and (min-width: 1000px) {
    .page-footer__list--one, .page-footer__list--three, .page-footer__list--four {
      flex-basis: 18% !important;
      width: 18% !important;
    }
  }
@media only screen and (min-width: 730px) {
    .page-footer__list--two {
      flex-basis: 44% !important;
      width: 44% !important;
    }
  }
@media only screen and (min-width: 1000px) {
    .page-footer__list--two {
      flex-basis: 24% !important;
      width: 24% !important;
    }
  }
.page-footer__list--two a, .page-footer__list--three a {
    margin-right: 15px;
  }
.page-footer__list--outbrain-links {
    display: flex;
    justify-content: space-around;
    width: 100%;
  }
@media only screen and (min-width: 730px) {
    .page-footer__list--outbrain-links {
      flex-direction: column;
      width: 20%;
      flex-basis: auto;
    }
  }
@media only screen and (min-width: 1000px) {
    .page-footer__list--outbrain-links {
      flex-direction: column;
      width: 20%;
      flex-basis: auto;
    }
  }
.page-footer__minor {
    font-size: 12px;
    line-height: 16px;
  }
@media only screen and (min-width: 450px) {
    .page-footer__minor {
      font-size: 13px;
      line-height: 18px;
    }
  }
@media only screen and (min-width: 730px) {
    .page-footer__minor {
      font-size: 14px;
      line-height: 22px;
    }
  }
@media only screen and (min-width: 1000px) {
    .page-footer__minor {
      font-size: 14px;
      line-height: 22px;
    }
  }
.page-footer__minor a {
    margin: 0 15px 10px 15px;
  }
.page-footer .two-columns a {
    width: 50%;
    text-align: left;
  }
.page-footer .contact {
    align-items: center;
    margin: 0 auto;
    width: 80%;
  }
@media only screen and (min-width: 730px) {
    .page-footer .contact {
      width: auto;
      margin: 0;
    }
  }
.page-footer .contact a {
    width: 100%;
    text-align: left;
    justify-content: center;
    display: flex !important;
  }
@media only screen and (min-width: 730px) {
    .page-footer .contact a {
      justify-content: flex-start;
    }
  }
.page-footer .contact svg {
    overflow: hidden;
    float: left;
    text-align: left;
    width: 20px;
  }
@media only screen and (min-width: 730px) {
    .page-footer .contact svg {
      display: none;
    }
  }
@media only screen and (min-width: 1000px) {
    .page-footer .contact svg {
      display: inherit;
      margin-top: 10px;
      margin-right: 27px;
    }
  }
@media only screen and (min-width: 450px) {
    .page-footer .flex__column {
      margin-top: 37px;
    }
  }
@media only screen and (min-width: 1000px) {
    .page-footer .flex__column {
      margin-top: 0;
      width: auto;
    }
  }
.page-footer .hide-small {
    display: none;
  }
@media only screen and (min-width: 450px) {
    .page-footer .hide-small {
      display: block;
    }
  }
.page-footer__subtitle {
    display: none;
    width: 100%;
    margin: 0 0 11px 0;
    font-weight: 500;
  }
@media only screen and (min-width: 1000px) {
    .page-footer__subtitle {
      display: block;
    }
  }
.page-footer__mobile-links {
    padding: 26px 0 35px 0;
  }
@media only screen and (min-width: 450px) {
    .page-footer__mobile-links {
      display: none !important;
    }
  }
.page-footer__mobile-links a {
    width: 50%;
    margin-bottom: 10px;
  }
@media only screen and (min-width: 1000px) {
    .page-footer__clark-details {
      flex-direction: column !important;
      padding-right: 10px;
      height: 100%;
    }
  }
.page-footer__clark-details__day-time {
    display: block;
  }
.page-footer__clark-details .call-us {
    width: 100%;
  }
.page-footer__clark-details__call-us {
    display: block;
  }
@media only screen and (min-width: 730px) {
    .page-footer__clark-details__call-us {
      display: inline-block;
    }
  }
@media only screen and (min-width: 1000px) {
    .page-footer__clark-details__call-us {
      display: block;
    }
  }
.page-footer__clark-details--outbrain {
    width: 100%;
  }
@media only screen and (min-width: 730px) {
    .page-footer__clark-details--outbrain {
      width: auto;
      display: flex;
    }
  }
.page-footer__clark-details__logo-container {
    /* needed for safari */
  }
@media only screen and (min-width: 1000px) {
    .page-footer__clark-details__logo-container {
      min-height: 75px;
    }
  }
.page-footer__clark-details__logo-container--outbrain {
    margin: 0 0 0 0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }
@media only screen and (min-width: 730px) {
    .page-footer__clark-details__logo-container--outbrain {
      margin: auto 0 auto 0;
    }
  }
.page-footer__trust-logos {
    padding-bottom: 30px;
  }
@media only screen and (min-width: 450px) {
    .page-footer__trust-logos {
      padding-top: 37px;
    }
  }
@media only screen and (min-width: 1000px) {
    .page-footer__trust-logos {
      padding-top: 17px;
    }
  }
.page-footer__trust-logos__wrapper {
    display: flex;
  }
.page-footer__trust-logos__wrapper img {
    margin: auto 10px auto 10px;
  }
.page-footer__trust-logos--outbrain {
    display: flex;
    justify-content: space-around;
    width: 100%;
    padding-bottom: 0;
  }
@media only screen and (min-width: 730px) {
    .page-footer__trust-logos--outbrain {
      padding-top: 0;
    }
  }
.page-footer__trust-logos--outbrain.image-wrapper img:nth-child(1) {
    margin: auto 0 auto 0;
    width: 85px;
    align-self: center;
  }
@media only screen and (min-width: 730px) {
    .page-footer__trust-logos--outbrain.image-wrapper img:nth-child(1) {
      width: 65px;
    }
  }
.page-footer__trust-logos img {
    width: 85px;
    height: auto;
  }
@media only screen and (min-width: 730px) {
    .page-footer__trust-logos img {
      width: 107px;
    }
  }
.page-footer__trust-logos img:nth-child(1), .page-footer__trust-logos img:nth-child(2) {
    margin-right: 35px;
  }
.page-footer__trust-logos img:nth-child(2) {
    width: 71px;
  }
.page-footer__trust-logos__without-tuv img {
    height: 48px;
    width: auto;
  }
.page-footer-content {
    padding: 45px 20px 40px 20px;
  }
@media only screen and (min-width: 1000px) {
    .page-footer-content {
      padding-left: 0;
      padding-right: 0;
    }
  }
.page-footer-content--outbrain {
    padding: 24px 16px 40px 16px;
  }
.page-footer-logo {
    height: 34px;
    width: 89px;
    text-align: left;
    display: block;
    margin-bottom: 35px;
  }
@media only screen and (min-width: 730px) {
    .page-footer-logo {
      width: auto;
      margin-bottom: 0;
    }
  }
@media only screen and (min-width: 1000px) {
    .page-footer-logo {
      margin-bottom: 41px;
    }
  }
.page-footer-logo--outbrain {
    margin: auto 0 35px 0;
    width: 105px;
  }
@media only screen and (min-width: 450px) {
    .page-footer-logo--outbrain {
      margin-bottom: 0;
    }
  }
@media only screen and (min-width: 1000px) {
    .page-footer-logo--outbrain {
      margin-top: 0;
    }
  }
.page-footer-logo img {
    height: 100%;
    display: block;
    width: 105px;
  }
/* END: modules/app/rails/page-footer */
/* BEGIN: modules/app/base */
/* layouts for the new re-branding */
.body--mobile-android, .body--mobile-ios {
    /* Disable overscroll effect */
    overscroll-behavior: none;
  }
.body--mobile-android *, .body--mobile-ios * {
    /* Disable text selection */
    user-select: none;
    -webkit-user-select: none;
    /* Disable 3D touch popups on iOS */
    -webkit-touch-callout: none;
    /* Disable tap highlight */
    -webkit-tap-highlight-color: transparent;
  }
.body--mobile-android input, .body--mobile-android textarea, .body--mobile-ios input, .body--mobile-ios textarea {
    /* Enable text selection for inputs (fix for safari) */
    -webkit-user-select: auto;
  }
/* END: modules/app/base */
/* BEGIN: modules/app/modal */
.body--mobile-ios .ember-modal__body, .body--mobile-android .ember-modal__body {
    max-height: 80%;
    top: -3%;
    position: relative;
    -webkit-overflow-scrolling: touch;
  }
.body--mobile-ios .ember-modal__body--icon-header, .body--mobile-android .ember-modal__body--icon-header {
    top: 6%;
    /* iphone 4 height up */
  }
@media only screen and (min-height: 480px) {
    .body--mobile-ios .ember-modal__body--icon-header, .body--mobile-android .ember-modal__body--icon-header {
      top: 3%;
    }
  }
.body--mobile-ios .ember-modal__body--full-screen, .body--mobile-android .ember-modal__body--full-screen {
    width: 100%;
    height: 100%;
    max-height: none;
    border-radius: 0;
    top: 0;
  }
.body--mobile-ios .ember-modal__body--full-screen .ember-modal__body__content-wrapper, .body--mobile-android .ember-modal__body--full-screen .ember-modal__body__content-wrapper {
    display: flex;
    flex-direction: column;
    height: 100%;
  }
.body--mobile-ios .ember-modal__body--full-screen .ember-modal__body__content, .body--mobile-android .ember-modal__body--full-screen .ember-modal__body__content {
    max-height: none;
  }
.body--mobile-ios .ember-modal__body--full-screen .ember-modal__body__footer, .body--mobile-android .ember-modal__body--full-screen .ember-modal__body__footer {
    margin-top: auto;
  }
.body--mobile-ios .ember-modal__body--full-screen .ember-modal__body__footer__cta, .body--mobile-android .ember-modal__body--full-screen .ember-modal__body__footer__cta {
    border-radius: 0 !important;
  }
.ember-modal {
    position: fixed;
    left: 0;
    top: 0;
    z-index: -1;
    opacity: 0;
    visibility: hidden;
    width: 100%;
    height: 100%;
    transition: opacity 0.2s ease, visibility 0.2s ease, z-index 0.2s ease;
    background-color: rgba(23, 32, 61, 0.8);
    /* #17203d */
    display: flex;
    align-items: center;
    justify-content: center;
    /* long (scrollable versions of the ember modal) */
  }
.clark2 .ember-modal {
    background-color: rgba(32, 49, 81, 0.9);
    /* #203151 */
  }
.ember-modal--visible {
    opacity: 1;
    visibility: visible;
    z-index: 999999999;
  }
.ember-modal--visible .ember-modal__body {
    opacity: 1;
    margin-top: 0;
  }
@media only screen and (min-width: 730px) {
    .ember-modal--20 .ember-modal__body {
      max-width: 20rem;
    }
  }
@media only screen and (min-width: 730px) {
    .ember-modal--30 .ember-modal__body {
      max-width: 30rem;
    }
  }
@media only screen and (min-width: 730px) {
    .ember-modal--40 .ember-modal__body {
      max-width: 40rem;
    }
  }
@media only screen and (min-width: 730px) {
    .ember-modal--50 .ember-modal__body {
      max-width: 50rem;
    }
  }
@media only screen and (min-width: 730px) {
    .ember-modal--60 .ember-modal__body {
      max-width: 60rem;
    }
  }
@media only screen and (min-width: 730px) {
    .ember-modal--70 .ember-modal__body {
      max-width: 70rem;
    }
  }
@media only screen and (min-width: 730px) {
    .ember-modal--80 .ember-modal__body {
      max-width: 80rem;
    }
  }
@media only screen and (min-width: 730px) {
    .ember-modal--90 .ember-modal__body {
      max-width: 90rem;
    }
  }
.ember-modal--long .ember-modal__body__footer__cta {
    box-shadow: 0px -7px 24px 8px rgba(0, 0, 0, 0.15);
  }
@media only screen and (min-width: 730px) {
    .ember-modal--long .ember-modal__body__footer__cta {
      box-shadow: none;
      padding-bottom: 23px;
    }
  }
.ember-modal__body {
    width: 90%;
    max-height: 80%;
    background-color: #fff;
    border-radius: 4px 4px 6px 6px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    box-shadow: 0px 7px 30px 0px rgba(0, 0, 0, 0.3);
    position: relative;
    transition: margin 0.3s linear, opacity 0.3s linear;
    transition-delay: 0.2s;
    margin-top: 20px;
    opacity: 0;
    /* close icons on the ember modal */
    /* header with an icon */
    /* header with an icon for amazon from zzv */
    /* generic header with larger image */
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body {
      height: auto;
      max-height: 600px;
    }
  }
.ember-modal__body--full-screen {
    max-height: 90%;
    overflow-y: auto;
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body--full-screen {
      max-height: 90%;
    }
  }
.ember-modal__body--full-screen .ember-modal__body__content {
    max-height: none;
  }
.ember-modal__body__close {
    position: absolute;
    top: 0px;
    right: 0px;
    padding: 12px;
    cursor: pointer;
    z-index: 99;
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__close {
      width: 20px;
      height: 20px;
      padding: 0;
      right: 12px;
      top: 12px;
    }
  }
.ember-modal__body__close--offer-reject {
    position: absolute;
    width: 100px;
    height: 100px;
    padding: 0;
    top: -3px;
    right: -20px;
  }
.ember-modal__body__close--offer-reject:hover {
    cursor: pointer;
  }
.ember-modal__body__close--offer-reject svg {
    width: 100px;
    height: 100px;
  }
.ember-modal__body__close svg {
    width: 20px;
    height: 20px;
  }
.ember-modal__body__close svg .x-in-circle-icon {
    stroke: #575970;
  }
.clark2 .ember-modal__body__close svg .x-in-circle-icon {
    stroke: #b0bacd;
  }
.ember-modal__body--icon-header .ember-modal__body__header {
    box-shadow: none;
    border-radius: 100%;
    border: 6px solid #fff;
    padding: 0;
    width: 115px;
    height: 115px;
    top: -58px;
    left: calc(50% - 58px);
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
  }
.ember-modal__body--icon-header .ember-modal__body__header--reject-offer svg {
    margin-left: 7px;
    margin-top: 3px;
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body--icon-header .ember-modal__body__header {
      width: 150px;
      height: 150px;
      top: -75px;
      left: calc(50% - 75px);
    }
  }
.ember-modal__body--icon-header .ember-modal__body__content {
    padding-top: 40px;
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body--icon-header .ember-modal__body__content {
      padding-top: 60px;
    }
  }
.ember-modal__body__header-zzv {
    transition: transform 0.3s linear;
    transition-delay: 1s;
    box-shadow: none;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    border-radius: 5px;
    width: 197px;
    height: 118px;
    left: calc(50% - 97px);
    border: 8px solid #fff;
    background-color: #fff;
    top: -72px;
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__header-zzv {
      width: 213px;
      height: 138px;
      top: -92px;
    }
  }
.ember-modal__body__header-zzv img {
    height: 95px;
    width: 176px;
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__header-zzv img {
      height: 123px;
      width: 196px;
    }
  }
.ember-modal__body__header-zzv--visible {
    transform: rotate(-7deg);
  }
.ember-modal__body__header-large_image {
    color: #fff;
    border-radius: 4px;
    padding: 30px 70px 0px;
    top: -23px;
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
    align-self: center;
    min-height: 35px;
  }
.ember-modal__body__header-large_image img {
    max-width: 300px;
    margin: auto;
    display: block;
  }
.ember-modal__body__header {
    position: relative;
    color: #fff;
    border-radius: 4px;
    padding: 8px 36px;
    font-size: 15px;
    line-height: 21px;
    top: -23px;
    align-self: center;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.15);
    min-height: 35px;
    background-color: #2b6cde;
    /* various icon specific styles */
  }
@media only screen and (min-width: 450px) {
    .ember-modal__body__header {
      font-size: 16px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__header {
      font-size: 18px;
      line-height: 28px;
    }
  }
@media only screen and (min-width: 1000px) {
    .ember-modal__body__header {
      font-size: 20px;
      line-height: 30px;
    }
  }
.ember-modal__body__header--dark {
    background-color: #17203d;
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__header {
      padding: 9px 50px;
    }
  }
.ember-modal__body__header--grey {
    background-color: #bbb;
  }
.ember-modal__body__header--light-grey {
    background-color: #d6d6d6;
  }
.ember-modal__body__header--lightest-grey {
    background-color: #f6f6f6;
  }
.ember-modal__body__header .email-outline, .ember-modal__body__header .email-sent {
    width: 56px;
    height: 36px;
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__header .email-outline, .ember-modal__body__header .email-sent {
      width: 80px;
      height: 60px;
    }
  }
.ember-modal__body__header--upgrade svg {
    margin-top: 4px;
  }
.ember-modal__body__header--plusDocument svg {
    width: 56px;
    height: 56px;
    margin-left: 5px;
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__header--plusDocument svg {
      width: 80px;
      height: 80px;
      margin-left: 7px;
    }
  }
.ember-modal__body__header--cancelDocument svg {
    margin: 4px 0 0 4px;
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__header--cancelDocument svg {
      width: 90px;
      height: 90px;
    }
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__header .continue-mandate-prompt {
      width: 85px;
      height: 75px;
    }
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__header .continue-mandate {
      width: 80px;
      height: 80px;
    }
  }
.ember-modal__body__header .add-health-insurance {
    width: 70px;
    margin-left: 9px;
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__header .add-health-insurance {
      width: 90px;
      height: 70px;
      margin-left: 13px;
    }
  }
.ember-modal__body__header .add-phv-insurance {
    width: 70px;
    margin-left: 15px;
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__header .add-phv-insurance {
      width: 90px;
      height: 80px;
      margin-left: 21px;
    }
  }
.ember-modal__body__header .add-hr-insurance {
    width: 63px;
    margin-left: 8px;
    margin-top: -3px;
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__header .add-hr-insurance {
      width: 90px;
      height: 80px;
      margin-left: 10px;
      margin-top: -5px;
    }
  }
.ember-modal__body__header--placeholder-products {
    position: relative;
  }
.ember-modal__body__header--placeholder-products svg {
    width: 50px;
    height: 54px;
  }
.ember-modal__body__header--placeholder-products svg path {
    stroke: #fff;
  }
.ember-modal__body__header--placeholder-products svg #ion-alert---Ionicons {
    stroke: none;
    fill: #fff;
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__header--placeholder-products svg {
      width: 62px;
      height: 66px;
      margin-left: -3px;
    }
  }
.ember-modal__body__content {
    overflow-y: auto;
    padding: 30px 20px 20px 20px;
    max-height: 570px;
    /* This is ugly until we get the new styles */
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__content {
      padding: 30px 50px 20px 50px;
    }
  }
.ember-modal__body__content--new {
    padding: 30px 15px 15px 15px !important;
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__content--new {
      padding: 30px 25px 25px 25px !important;
    }
  }
.ember-modal__body__content__blue-inner {
    padding: 0 15px;
    background-color: #17203d;
    border-radius: 4px;
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__content__blue-inner {
      padding: 0 25px;
    }
  }
.ember-modal__body__content--large_image {
    padding: 0 20px 20px;
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__content--large_image {
      max-height: 570px;
      padding: 0 20px 20px;
    }
  }
.ember-modal__body__content__title {
    color: #2b6cde;
    font-weight: 400;
    font-size: 16px;
    line-height: 23px;
    margin: 25px 0 13px 0;
    text-align: center;
  }
@media only screen and (min-width: 450px) {
    .ember-modal__body__content__title {
      font-size: 17px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__content__title {
      font-size: 21px;
      line-height: 30px;
    }
  }
@media only screen and (min-width: 1000px) {
    .ember-modal__body__content__title {
      font-size: 22px;
      line-height: 32px;
    }
  }
.ember-modal__body__content__descr {
    color: #333;
    font-size: 12px;
    line-height: 16px;
    text-align: center;
    margin: 0 0 24px 0;
  }
@media only screen and (min-width: 450px) {
    .ember-modal__body__content__descr {
      font-size: 13px;
      line-height: 18px;
    }
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__content__descr {
      font-size: 14px;
      line-height: 22px;
    }
  }
@media only screen and (min-width: 1000px) {
    .ember-modal__body__content__descr {
      font-size: 14px;
      line-height: 22px;
    }
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__content__descr {
      font-size: 14px;
      line-height: 22px;
    }
  }
@media only screen and (min-width: 730px) and (min-width: 450px) {
    .ember-modal__body__content__descr {
      font-size: 15px;
      line-height: 20px;
    }
  }
@media only screen and (min-width: 730px) and (min-width: 730px) {
    .ember-modal__body__content__descr {
      line-height: 20px;
    }
  }
@media only screen and (min-width: 730px) and (min-width: 1000px) {
    .ember-modal__body__content__descr {
      font-size: 15px;
      line-height: 20px;
    }
  }
.ember-modal__body__content__descr--no-margin {
    margin: 0;
  }
.ember-modal__body__footer {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    flex: 1 0 auto;
    background-color: #fff;
    border-radius: 0 0 6px 6px;
    padding: 15px;
    /* when there are multiple CTA's on top of each other */
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__footer {
      justify-content: center;
      box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.15);
    }
  }
.ember-modal__body__footer--min-height {
    min-height: 78px;
  }
.ember-modal__body__footer--zzv-splash {
    padding: 0;
    margin: 0;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
  }
.ember-modal__body__footer--stack-cta {
    flex-direction: column;
    box-shadow: none;
  }
.ember-modal__body__footer--stack-cta .ember-modal__body__footer__cta--border-divider {
    border-bottom: 1px solid #3a6bc1;
  }
.ember-modal__body__footer__cta {
    width: 100%;
    height: 48px;
    padding: 14px 4px !important;
  }
.ember-modal__body__footer__cta:nth-child(2) {
    margin-top: 8px;
  }
@media only screen and (min-width: 375px) {
    .ember-modal__body__footer__cta {
      padding-right: 16px !important;
      padding-left: 16px !important;
    }
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__footer__cta {
      min-width: 223px;
    }
  }
.ember-modal__body__footer__cta--zzv-cta {
    width: 100%;
    text-decoration: none;
    border-radius: 0;
    align-items: center;
    display: flex;
    justify-content: center;
    cursor: pointer;
    padding: 20px;
    box-shadow: none !important;
  }
@media only screen and (min-width: 730px) {
    .ember-modal__body__footer__cta--zzv-cta {
      width: 100%;
      border-radius: 0;
    }
  }
.ember-modal__body__footer__cta:focus, .ember-modal__body__footer__cta:active {
    border: none;
    outline: 0;
  }
/* END: modules/app/modal */
/* BEGIN: modules/app/clarkordion */
.clarkordion {
    list-style-type: none;
    margin: 0;
    padding: 0;
    background-color: #f6f6f6;
  }
.clark2 .clarkordion {
    background-color: #f5f6fa;
  }
.clarkordion--with-border-top {
    border-top: 1px solid #d6d6d6;
  }
.clarkordion__item {
    /* styles for the icon to the left of the item title */
  }
.clarkordion__item__header {
    padding: 20px 23px;
    border-bottom: 1px solid #d6d6d6;
    position: relative;
    cursor: pointer;
    color: #333;
    overflow: hidden;
    font-weight: 500;
    -webkit-user-select: none;
            user-select: none;
    display: flex;
    align-items: center;
    font-size: 16px;
    line-height: 23px;
    transition: color 0.2s linear;
  }
@media only screen and (min-width: 450px) {
    .clarkordion__item__header {
      font-size: 17px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .clarkordion__item__header {
      font-size: 21px;
      line-height: 30px;
    }
  }
@media only screen and (min-width: 1000px) {
    .clarkordion__item__header {
      font-size: 22px;
      line-height: 32px;
    }
  }
.clark2 .clarkordion__item__header {
    border-bottom-color: #daddec;
  }
@media only screen and (min-width: 730px) {
    .clarkordion__item__header {
      padding: 24px 55px;
    }
  }
@media only screen and (min-width: 1000px) {
    .clarkordion__item__header {
      color: #2b6cde;
      border-top: 1px solid #d6d6d6;
    }
    .clark2 .clarkordion__item__header {
      border-top-color: #daddec;
    }
  }
.clarkordion__item__header--active {
    color: #2b6cde;
  }
.clarkordion__item__header--active .clarkordion__item__arrow svg {
    transform: rotate(90deg);
  }
.clarkordion__item__content {
    overflow: hidden;
  }
.clarkordion__item__content--open {
    border-bottom: 1px solid #d6d6d6;
  }
.clark2 .clarkordion__item__content--open {
    border-bottom-color: #daddec;
  }
@media only screen and (min-width: 1000px) {
    .clarkordion__item__content--open {
      border: none;
    }
  }
.clarkordion__item__arrow, .clarkordion__item__icon {
    display: block;
  }
.clarkordion__item__arrow svg, .clarkordion__item__icon svg {
    display: block;
  }
.clarkordion__item__arrow svg .arrow-stroke, .clarkordion__item__icon svg .arrow-stroke {
    stroke: #2b6cde;
  }
@media only screen and (min-width: 1000px) {
    .clarkordion__item__arrow {
      display: none;
    }
  }
.clarkordion__item__icon {
    margin-right: 22px;
  }
.clarkordion__item__arrow {
    margin-left: auto;
    padding-left: 10px;
  }
.clarkordion__item__arrow svg {
    transition: transform 0.2s linear;
    transform: rotate(-90deg);
    width: 14px;
    height: 14px;
  }
/* END: modules/app/clarkordion */

/* BEGIN: modules/app/auth-form */
.auth-form {
    max-width: 450px;
    margin: 0 auto;
    /* the wrapping element for the input hint */
  }
.auth-form__header {
    display: flex;
    flex-direction: column;
  }
.auth-form__header__logo {
    margin: 30px auto;
  }
.auth-form__header__logo, .auth-form__header__logo svg {
    display: block;
    width: 109px;
    height: 100%;
  }
.auth-form__header__logo .clark-logo-fill, .auth-form__header__logo svg .clark-logo-fill {
    fill: #0439d7;
  }
.auth-form__header__title {
    margin: 0 0 28px;
    padding: 0;
    font-size: 18px;
    line-height: 24px;
    color: #333;
    width: 100%;
    text-align: left;
    font-weight: 500;
  }
.clark2 .auth-form__header__title {
    color: #283e66;
  }
@media only screen and (min-width: 730px) {
    .auth-form__header__title {
      font-size: 22px;
      line-height: 28px;
      margin: 20px 0 40px 0;
      text-align: center;
    }
  }
.auth-form__intro {
    font-size: 16px;
    line-height: 21px;
    font-weight: 400;
    margin: 0 0 10px 0;
    color: #717582;
  }
.clark2 .auth-form__intro {
    color: #283e66;
  }
@media only screen and (min-width: 730px) {
    .auth-form__intro {
      text-align: center;
      max-width: 335px;
      margin: 0 auto;
    }
  }
.auth-form__input-wrapper {
    margin: 10px 0 20px 0 !important;
  }
.auth-form__input-hint {
    position: relative;
    width: 100%;
    /* when the content of the input is valid the icons are blue :D */
    /* the icons, can be email icon etc, this is the positioning class */
  }
.auth-form__input-hint--valid .auth-form__input-hint__icon .email-icon, .auth-form__input-hint--valid .auth-form__input-hint__icon .padlock-fill {
    fill: #2b6cde;
  }
.auth-form__input-hint--valid .auth-form__input-hint__icon .padlock-stroke {
    stroke: #2b6cde;
  }
.auth-form__input-hint__icon {
    position: absolute;
    top: 0;
    left: 0;
    border-right: 1px solid #bbb;
    height: 47px;
    width: 46px;
    display: flex;
    justify-content: center;
    align-items: center;
  }
.clark2 .auth-form__input-hint__icon {
    border-right-color: #daddec;
  }
.auth-form__input-hint__icon .email-icon, .auth-form__input-hint__icon .padlock-fill {
    fill: #d6d6d6;
  }
.clark2 .auth-form__input-hint__icon .email-icon, .clark2 .auth-form__input-hint__icon .padlock-fill {
    fill: #daddec;
  }
.auth-form__input-hint__icon .padlock-stroke {
    stroke: #d6d6d6;
  }
.clark2 .auth-form__input-hint__icon .padlock-stroke {
    stroke: #daddec;
  }
.auth-form__input, .auth-form__label {
    color: #17203d;
  }
.clark2 .auth-form__input, .clark2 .auth-form__label {
    color: #283e66;
  }
.auth-form__input {
    font-weight: 400;
    border: 1px solid #bbb;
    padding-left: 53px;
  }
.clark2 .auth-form__input {
    border-color: #daddec;
  }
.auth-form__label {
    font-weight: 400;
    font-size: 14px;
    line-height: 18px;
    margin-bottom: 5px;
    /* hide on very small devices so can see both inputs */
    display: none;
  }
@media only screen and (min-width: 450px) {
    .auth-form__label {
      display: block;
    }
  }
.auth-form__cta-wrapper {
    margin-top: auto;
  }
.auth-form__cta-wrapper--app {
    margin-top: auto;
  }
/* END: modules/app/auth-form */
/* BEGIN: modules/app/error */
.error-page__top {
    background-color: #17203d;
    box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.1), inset 0 1px 1px 0 rgba(0, 0, 0, 0.15);
  }
.clark2 .error-page__top {
    background-color: #fff;
    box-shadow: 0 2px 5px 0 rgba(173, 182, 217, 0.5);
  }
.error-page__bottom {
    padding-top: 35px !important;
  }
.error-page__header {
    margin: 40px 0 16px 0;
    display: flex;
    justify-content: center;
    flex-direction: column;
  }
.error-page__header__avatar {
    display: block;
    margin: 0 auto 20px auto;
  }
@media only screen and (min-width: 730px) {
    .error-page__header__avatar {
      margin-bottom: 30px;
    }
  }
.error-page__header__avatar svg {
    width: 50px;
    height: 50px;
    display: block;
    margin: 0 auto;
  }
@media only screen and (min-width: 730px) {
    .error-page__header__avatar svg {
      width: 70px;
      height: 70px;
    }
  }
.error-page__header__avatar svg polyline, .error-page__header__avatar svg polygon, .error-page__header__avatar svg path {
    fill: white;
    stroke: white;
  }
.error-page__header__title {
    margin: 0;
    font-weight: 300;
    font-size: 21px;
    line-height: 26px;
    color: #fff;
    text-align: center;
    max-width: 600px;
    margin: 0 auto;
  }
@media only screen and (min-width: 450px) {
    .error-page__header__title {
      font-size: 22px;
      line-height: 29px;
    }
  }
@media only screen and (min-width: 730px) {
    .error-page__header__title {
      font-size: 27px;
      line-height: 36px;
    }
  }
@media only screen and (min-width: 1000px) {
    .error-page__header__title {
      font-size: 36px;
      line-height: 40px;
    }
  }
.clark2 .error-page__header__title {
    color: #283e66;
  }
.error-page__intro {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    flex-wrap: nowrap;
    text-align: center;
    margin: 0 0 19px 0;
  }
@media only screen and (min-width: 730px) {
    .error-page__intro {
      margin: 0 0 39px 0;
    }
  }
.error-page__intro__copy {
    font-weight: 400;
    font-size: 15px;
    line-height: 21px;
    width: 100%;
    color: #df4020;
  }
@media only screen and (min-width: 450px) {
    .error-page__intro__copy {
      font-size: 16px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .error-page__intro__copy {
      font-size: 17px;
      line-height: 25px;
    }
  }
@media only screen and (min-width: 1000px) {
    .error-page__intro__copy {
      font-size: 18px;
      line-height: 26px;
    }
  }
.error-page__report-bug, .error-page__actions {
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: 640px;
    margin: 0 auto;
    border-top: 1px solid #f6f6f6;
  }
.clark2 .error-page__report-bug, .clark2 .error-page__actions {
    border-top-color: #daddec;
  }
.error-page__report-bug {
    padding: 20px 0;
    margin-top: 20px;
  }
.error-page__report-bug__title {
    text-align: center;
    font-size: 14px;
    line-height: 22px;
    font-weight: 300;
    margin: 0 0 10px 0;
  }
@media only screen and (min-width: 450px) {
    .error-page__report-bug__title {
      font-size: 15px;
      line-height: 20px;
    }
  }
@media only screen and (min-width: 730px) {
    .error-page__report-bug__title {
      line-height: 20px;
    }
  }
@media only screen and (min-width: 1000px) {
    .error-page__report-bug__title {
      font-size: 15px;
      line-height: 20px;
    }
  }
.error-page__report-bug__content, .error-page__report-bug__link {
    text-align: center;
    font-weight: 300;
    font-size: 10px;
    line-height: 13px;
  }
@media only screen and (min-width: 450px) {
    .error-page__report-bug__content, .error-page__report-bug__link {
      font-size: 12px;
      line-height: 16px;
    }
  }
@media only screen and (min-width: 730px) {
    .error-page__report-bug__content, .error-page__report-bug__link {
      font-size: 13px;
      line-height: 18px;
    }
  }
@media only screen and (min-width: 1000px) {
    .error-page__report-bug__content, .error-page__report-bug__link {
      font-size: 14px;
      line-height: 22px;
    }
  }
.error-page__report-bug__link {
    color: #2b6cde;
    text-decoration: underline;
    outline: none;
    background: none;
    border: none;
  }
.error-page__actions__title {
    text-align: center;
    font-weight: 300;
    font-size: 14px;
    line-height: 22px;
  }
@media only screen and (min-width: 450px) {
    .error-page__actions__title {
      font-size: 15px;
      line-height: 20px;
    }
  }
@media only screen and (min-width: 730px) {
    .error-page__actions__title {
      line-height: 20px;
    }
  }
@media only screen and (min-width: 1000px) {
    .error-page__actions__title {
      font-size: 15px;
      line-height: 20px;
    }
  }
.error-page__actions__cta {
    max-width: 300px;
    margin: 0 auto;
  }
/* END: modules/app/error */
/* BEGIN: modules/app/form-list */
/* Duplicated from rails side; items like labels and inputs */
/* colour for errors on the forms */
.form-list {
    list-style: none;
    /* to stop the red border from appearing on firefox */
    /* centered form lists like the one on the mandate and the edit account */
    /* some forms with max width */
    /* 100 percent width items always */
    /* col wrappers for the forms */
    /* list item inside the list */
  }
.form-list input:required {
    box-shadow: none;
  }
@media only screen and (min-width: 730px) {
    .form-list--centered {
      margin: 0 20px;
    }
  }
@media only screen and (min-width: 1000px) {
    .form-list--centered {
      margin: 0 80px;
    }
  }
.form-list--max-630 {
    max-width: 630px;
    margin: 0 auto;
  }
.form-list--margin-bottom {
    margin-bottom: 20px;
  }
@media only screen and (min-width: 730px) {
    .form-list--100 .form-list__item {
      flex-wrap: wrap;
    }
  }
.form-list__col {
    position: relative;
    padding: 0 10px;
  }
.form-list__col:first-child, .form-list__col--first {
    padding-left: 0;
  }
.form-list__col:last-child {
    padding-right: 0;
  }
@media only screen and (min-width: 730px) {
    .form-list__col--right-align label {
      text-align: right;
    }
  }
.form-list__col--10 {
    width: 10%;
  }
.form-list__col--20 {
    width: 20%;
  }
.form-list__col--25 {
    width: 25%;
  }
.form-list__col--30 {
    width: 30%;
  }
.form-list__col--35 {
    width: 35%;
  }
.form-list__col--40 {
    width: 40%;
  }
.form-list__col--50 {
    width: 50%;
  }
.form-list__col--60 {
    width: 60%;
  }
.form-list__col--70 {
    width: 70%;
  }
.form-list__col--75 {
    width: 75%;
  }
.form-list__col--80 {
    width: 80%;
  }
.form-list__col--90 {
    width: 90%;
  }
.form-list__col--100 {
    width: 100%;
  }
.form-list .ig__input--has-error, .form-list__has-error {
    border: 1px solid #d0021b !important;
  }
.clark2 .form-list .ig__input--has-error, .clark2 .form-list__has-error {
    border-color: #d51e4f !important;
  }
.form-list .ig__error--wrapper {
    width: 100%;
  }
.form-list .ig__error-button--floating {
    margin: 16px auto;
  }
.form-list .ig__error-msg, .form-list__error {
    display: block;
    width: 100%;
    position: relative;
    margin: 8px 0 0 0;
    text-align: left;
  }
.form-list .ig__error-msg > span, .form-list__error > span {
    color: #d0021b;
    display: inline-block;
    width: 100%;
    font-size: 12px;
    line-height: 16px;
  }
.clark2 .form-list .ig__error-msg > span, .clark2 .form-list__error > span {
    color: #d51e4f;
  }
.form-list .ig__error-msg > span a, .form-list__error > span a {
    color: #d0021b;
    text-decoration: underline;
  }
.clark2 .form-list .ig__error-msg > span a, .clark2 .form-list__error > span a {
    color: #d51e4f;
  }
.form-list__item {
    flex-direction: row;
    flex-wrap: wrap;
    display: flex;
    justify-content: space-around;
    position: relative;
    /* labels */
    /* select inputs */
    /* input items */
  }
.form-list__item--wrap {
    margin-top: 10px;
  }
.form-list__item__radios {
    justify-content: flex-start;
  }
.form-list__item__radios label {
    flex-basis: 35%;
    text-align: left;
  }
.clark2 .form-list__item__radios label {
    color: #283e66;
  }
@media only screen and (min-width: 730px) {
    .form-list__item {
      align-items: flex-start;
      flex-direction: row;
      flex-wrap: wrap;
    }
    .form-list__item--wrap {
      flex-wrap: wrap;
      margin-bottom: 5px;
      min-height: 28px;
    }
  }
.form-list__item__label {
    color: #575970;
    width: 100%;
    margin-bottom: 5px;
    display: inline;
    float: left;
    text-align: left;
    font-size: 14px;
    line-height: 18px;
  }
.clark2 .form-list__item__label {
    color: #283e66;
  }
@media only screen and (min-width: 730px) {
    .form-list__item__label {
      display: block;
    }
  }
.form-list__item__label--inline {
    width: auto;
    padding: 0 10px;
  }
.form-list__item__label--required:after {
    content: "*";
  }
.form-list__item__label--disabled {
    color: #bbbbbb;
    /* things like icons and radio buttons */
  }
.form-list__item__label--disabled span {
    opacity: 0.4;
  }
.clark2 .form-list__item__label--disabled {
    color: rgba(32, 49, 81, 0.5);
    /* #283e66 */
  }
.form-list__item__select {
    /* hide the end */
    border: 1px solid #adb0bb;
    padding: 13px 15px;
    transition: background-color 0.3s ease;
    min-height: 47px;
    cursor: pointer;
    width: 100%;
    border-radius: 4px !important;
    overflow: hidden;
    position: relative;
    background-color: white;
    /* select tags */
  }
.clark2 .form-list__item__select {
    background-color: #ffffff;
    border-color: #daddec;
    color: #283e66;
  }
.form-list__item__select select {
    background: transparent;
    width: 130%;
    position: relative;
    border: none;
    z-index: 2;
    padding: 0;
    min-height: auto;
    -webkit-appearance: none;
  }
.form-list__item__select select:focus, .form-list__item__select select:active {
    border: none;
    outline: none;
  }
.form-list__item__select__icon {
    display: block;
    position: absolute;
    right: 15px;
    top: 14px;
    z-index: 1;
  }
.form-list__item__select__icon svg g {
    stroke: #2b6cde;
    stroke-width: 2px;
  }
.form-list__item__input {
    border: 1px solid #adb0bb;
    padding: 10px 20px;
    transition: background-color 0.3s ease;
    background-color: #fff;
    /* margin-bottom: 10px; */
    cursor: pointer;
    width: 100%;
    border-radius: 4px !important;
    min-height: 47px;
    /* IE */
    /* cross button appears in IE, overlaps icon suppressing it */
  }
.clark2 .form-list__item__input {
    border-color: #daddec;
    background-color: #ffffff;
    color: #283e66;
  }
.form-list__item__input:focus, .form-list__item__input:active {
    outline: none;
  }
.clark2 .form-list__item__input:focus {
    border-color: #2b6cde;
  }
.form-list__item__input.with_icon_left {
    padding-left: 53px;
  }
.form-list__item__input--inline {
    width: auto;
  }
.form-list__item__input--no-border {
    border: none;
    min-height: 49px;
  }
.form-list__item__input--search {
    position: relative;
    padding-right: 60px;
    border: none;
    box-sizing: border-box !important;
    -webkit-appearance: none !important;
  }
.form-list__item__input--search__icon {
    position: relative;
    right: 0px;
    top: 0px;
    background-color: #2b6cde;
    display: block;
    width: 47px;
    height: 47px;
    color: #fff;
    border-radius: 0 4px 4px 0;
    flex-grow: 0;
  }
.form-list__item__input--search__icon svg {
    position: absolute;
    content: "";
    top: 12px;
    left: 12px;
    display: block;
    width: 23px;
    height: 23px;
  }
.form-list__item__input[type=date] {
    /* for mobile safari date pickers :D */
    -webkit-appearance: none;
  }
.form-list__item__input[disabled] {
    color: #bbbbbb;
  }
.clark2 .form-list__item__input[disabled] {
    border-color: rgba(218, 221, 236, 0.5);
    /* #daddec */
    background-color: rgba(218, 221, 236, 0.2);
    /* #daddec */
    color: rgba(40, 62, 102, 0.5);
    /* #283e66 */
  }
.form-list__item__input::-ms-clear {
    display: none !important;
  }
@media only screen and (min-width: 450px) {
    .form-list__item__input::-webkit-input-placeholder {
      opacity: 0;
    }
  }
@media only screen and (min-width: 450px) {
    .form-list__item__input:-moz-placeholder {
      opacity: 0;
    }
  }
@media only screen and (min-width: 450px) {
    .form-list__item__input::-moz-placeholder {
      opacity: 0;
    }
  }
.form-list__item__input--with-placeholder::-webkit-input-placeholder {
    color: #adb0bb;
  }
.clark2 .form-list__item__input--with-placeholder::-webkit-input-placeholder {
    color: #a9b3c2;
  }
@media only screen and (min-width: 450px) {
    .form-list__item__input--with-placeholder::-webkit-input-placeholder {
      opacity: 1;
    }
  }
.form-list__item__input--with-placeholder:-moz-placeholder {
    color: #adb0bb;
  }
.clark2 .form-list__item__input--with-placeholder:-moz-placeholder {
    color: #a9b3c2;
  }
@media only screen and (min-width: 450px) {
    .form-list__item__input--with-placeholder:-moz-placeholder {
      opacity: 1;
    }
  }
.form-list__item__input--with-placeholder::-moz-placeholder {
    color: #adb0bb;
  }
.clark2 .form-list__item__input--with-placeholder::-moz-placeholder {
    color: #a9b3c2;
  }
@media only screen and (min-width: 450px) {
    .form-list__item__input--with-placeholder::-moz-placeholder {
      opacity: 1;
    }
  }
.form-list__item__input--with-placeholder:-ms-input-placeholder {
    color: #adb0bb;
  }
.clark2 .form-list__item__input--with-placeholder:-ms-input-placeholder {
    color: #a9b3c2;
  }
@media only screen and (min-width: 450px) {
    .form-list__item__input--with-placeholder:-ms-input-placeholder {
      text-indent: 0px;
    }
  }
.reveal_wrapper {
    width: 100%;
    position: relative;
    display: block;
  }
.reveal_wrapper__eye {
    position: absolute;
    right: 10px;
    top: 12px;
    cursor: pointer;
    display: block;
    z-index: 99;
    opacity: 0.5;
  }
.reveal_wrapper__eye--active {
    opacity: 1;
  }
.reveal_wrapper__eye.disabled {
    cursor: not-allowed;
    pointer-events: none;
  }
.reveal_wrapper__eye img {
    width: auto;
    height: 25px;
  }
@media only screen and (min-width: 730px) {
    .reveal_wrapper__eye img {
      width: 25px;
    }
  }
.reveal_wrapper input {
    padding-right: 50px;
  }
/* END: modules/app/form-list */
/* BEGIN: modules/app/quality-standards */
.qs-modal {
    /* Hack */
  }
.qs-modal__title {
    font-size: 18px;
    line-height: 22px;
    text-align: left;
    margin: 0 0 10px 0;
    color: #333;
    font-weight: 500;
  }
.clark2 .qs-modal__title {
    color: #283e66;
  }
@media only screen and (min-width: 730px) {
    .qs-modal__title {
      font-size: 28px;
      line-height: 34px;
    }
  }
.qs-modal__cat-name {
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    margin: 0 0 5px 0;
  }
@media only screen and (min-width: 730px) {
    .qs-modal__cat-name {
      font-size: 22px;
      line-height: 26px;
    }
  }
.qs-modal__intro {
    color: #787878;
    font-weight: 400;
    line-height: 17px;
    font-size: 14px;
    margin: 0 0 15px 0;
  }
.clark2 .qs-modal__intro {
    color: #283e66;
  }
@media only screen and (min-width: 730px) {
    .qs-modal__intro {
      font-size: 18px;
      line-height: 22px;
      margin: 0 0 30px 0;
    }
  }
.qs-modal__extra-data {
    padding: 20px 0 0 0;
  }
@media only screen and (min-width: 730px) {
    .qs-modal__extra-data {
      padding: 30px 0 0 0;
    }
  }
.qs-modal__extra-data__title, .qs-modal__extra-data__content {
    font-size: 14px;
    line-height: 17px;
    margin: 0;
  }
@media only screen and (min-width: 730px) {
    .qs-modal__extra-data__title, .qs-modal__extra-data__content {
      font-size: 18px;
      line-height: 22px;
    }
  }
.qs-modal__extra-data__title {
    font-weight: 500;
    color: #333;
    margin: 0 0 5px 0;
  }
.clark2 .qs-modal__extra-data__title {
    color: #283e66;
  }
.qs-modal__extra-data__content {
    font-weight: 400;
    color: #787878;
  }
.clark2 .qs-modal__extra-data__content {
    color: #283e66;
  }
.clark2 .qs-modal .ember-modal__body__content__blue-inner {
    background-color: transparent;
  }
/* END: modules/app/quality-standards */
/* BEGIN: modules/app/quality-standards-stats */
.qs-stats {
    /* rating stars in our modal */
  }
.qs-stats .rating-star {
    margin-top: 5px;
  }
.qs-stats .rating-star__star, .qs-stats .rating-star__star svg {
    width: 20px;
    height: 20px;
  }
@media only screen and (min-width: 730px) {
    .qs-stats .rating-star__star, .qs-stats .rating-star__star svg {
      width: 30px;
      height: 30px;
    }
  }
.qs-stats .rating-star__star .star-bg, .qs-stats .rating-star__star svg .star-bg {
    fill: #384255;
  }
.clark2 .qs-stats .rating-star__star .star-bg, .clark2 .qs-stats .rating-star__star svg .star-bg {
    fill: #daddec;
  }
.qs-stats__accordion {
    margin: 10px 0 0;
    padding: 0;
    list-style-type: none;
  }
.qs-stats__robo-row {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    border-bottom: 1px solid #384255;
    /* needs to be pulled out because of the border at the bottom needing to be full width */
    height: 60px;
    margin: 0 -15px;
    padding: 0 15px;
  }
.clark2 .qs-stats__robo-row {
    border-bottom-color: #daddec;
  }
@media only screen and (min-width: 730px) {
    .qs-stats__robo-row {
      margin: 0 -25px;
      padding: 0 25px;
    }
  }
.qs-stats__robo-row__icon, .qs-stats__robo-row__icon svg {
    display: block;
    width: 24px;
    height: 27px;
  }
.clark2 .qs-stats__robo-row__icon > g > g > g:first-child > path, .clark2 .qs-stats__robo-row__icon svg > g > g > g:first-child > path {
    fill: #f4f8ff;
  }
.clark2 .qs-stats__robo-row__icon > g > g > path:nth-child(3), .clark2 .qs-stats__robo-row__icon > g > g > path:nth-child(5), .clark2 .qs-stats__robo-row__icon svg > g > g > path:nth-child(3), .clark2 .qs-stats__robo-row__icon svg > g > g > path:nth-child(5) {
    fill: #d3cceb;
  }
.clark2 .qs-stats__robo-row__icon > g > path, .clark2 .qs-stats__robo-row__icon svg > g > path {
    fill: #4a85d5;
  }
.qs-stats__robo-row__icon {
    margin: 0 10px 0 0;
  }
@media only screen and (min-width: 730px) {
    .qs-stats__robo-row__icon {
      margin: 0 22px 0 0;
    }
  }
.qs-stats__robo-row__title {
    color: white;
    font-weight: 500;
    font-size: 18px;
    line-height: 22px;
  }
.clark2 .qs-stats__robo-row__title {
    color: #283e66;
  }
@media only screen and (min-width: 730px) {
    .qs-stats__robo-row__title {
      font-size: 22px;
      line-height: 26px;
    }
  }
.qs-stats__robo {
    /* where we have all the figures */
  }
.qs-stats__robo__figures {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
  }
.qs-stats__robo__figures--top-row {
    padding-top: 20px;
  }
@media only screen and (min-width: 730px) {
    .qs-stats__robo__figures--top-row {
      padding-top: 30px;
    }
  }
.qs-stats__robo__figures--bottom-row {
    padding-bottom: 20px;
  }
@media only screen and (min-width: 730px) {
    .qs-stats__robo__figures--bottom-row {
      padding-bottom: 30px;
    }
  }
.qs-stats__robo__figures--bottom-row-gkv {
    padding-top: 20px;
    padding-bottom: 5px;
  }
@media only screen and (min-width: 730px) {
    .qs-stats__robo__figures--bottom-row-gkv {
      padding-bottom: 20px;
    }
  }
.qs-stats__robo__figures--gkv {
    padding-top: 8px;
  }
.qs-stats__robo__figures__col {
    width: 45%;
    color: white;
    font-size: 14px;
    line-height: 17px;
    font-weight: 500;
    /* Large figure numbers */
  }
.clark2 .qs-stats__robo__figures__col {
    color: #283e66;
  }
@media only screen and (min-width: 730px) {
    .qs-stats__robo__figures__col {
      font-size: 18px;
      line-height: 22px;
    }
  }
.qs-stats__robo__figures__col--full {
    width: 100%;
  }
.qs-stats__robo__figures__col--half-on-med {
    width: 100%;
  }
@media only screen and (min-width: 730px) {
    .qs-stats__robo__figures__col--half-on-med {
      width: 45%;
    }
  }
@media only screen and (min-width: 730px) {
    .qs-stats__robo__figures__col--order-1 {
      order: 1;
    }
  }
@media only screen and (min-width: 730px) {
    .qs-stats__robo__figures__col--order-2 {
      order: 2;
    }
  }
.qs-stats__robo__figures__col--order-3 {
    padding-bottom: 20px;
  }
@media only screen and (min-width: 730px) {
    .qs-stats__robo__figures__col--order-3 {
      padding-bottom: 0;
      order: 3;
    }
  }
@media only screen and (min-width: 730px) {
    .qs-stats__robo__figures__col--order-4 {
      order: 4;
    }
  }
.qs-stats__robo__figures__col--figure {
    font-size: 32px;
    line-height: 38px;
  }
@media only screen and (min-width: 730px) {
    .qs-stats__robo__figures__col--figure {
      font-size: 36px;
      line-height: 43px;
    }
  }
.qs-stats__features {
    padding: 20px 0;
    /* all text in here is the same */
  }
.qs-stats__features--gkv {
    padding: 20px 0 0;
  }
.qs-stats__features__title, .qs-stats__features__subtitle, .qs-stats__features__feature__header__title, .qs-stats__features__feature__content {
    color: white;
    font-size: 14px;
    line-height: 17px;
    font-weight: 400;
    margin: 0;
  }
.clark2 .qs-stats__features__title, .clark2 .qs-stats__features__subtitle, .clark2 .qs-stats__features__feature__header__title, .clark2 .qs-stats__features__feature__content {
    color: #283e66;
  }
@media only screen and (min-width: 730px) {
    .qs-stats__features__title, .qs-stats__features__subtitle, .qs-stats__features__feature__header__title, .qs-stats__features__feature__content {
      font-size: 18px;
      line-height: 22px;
    }
  }
.qs-stats__features__title {
    font-weight: 500;
  }
.qs-stats__features__feature {
    background-color: #17203d;
  }
.clark2 .qs-stats__features__feature {
    background-color: transparent;
  }
.qs-stats__features__feature__header {
    display: flex;
    align-items: center;
    background-color: #17203d;
    padding: 11px 0;
    border: none;
    -webkit-tap-highlight-color: transparent;
    cursor: pointer;
  }
.clark2 .qs-stats__features__feature__header {
    background-color: white;
  }
.qs-stats__features__feature__header__icon, .qs-stats__features__feature__header__icon svg {
    width: 14px;
    height: 14px;
    display: block;
  }
@media only screen and (min-width: 730px) {
    .qs-stats__features__feature__header__icon, .qs-stats__features__feature__header__icon svg {
      width: 16px;
      height: 16px;
    }
  }
.qs-stats__features__feature__header__icon {
    margin: 0 10px 0 0;
  }
.qs-stats__features__feature__header__icon .tick-stroke {
    stroke: #00f87d;
  }
.qs-stats__features__feature__header__question-mark, .qs-stats__features__feature__header__question-mark svg {
    width: 18px;
    height: 18px;
    min-width: 18px;
    /* for IE when the content forces the issue */
  }
@media only screen and (min-width: 730px) {
    .qs-stats__features__feature__header__question-mark, .qs-stats__features__feature__header__question-mark svg {
      width: 22px;
      min-width: 22px;
      height: 22px;
    }
  }
.qs-stats__features__feature__header__question-mark {
    margin: 0 15px 0 auto;
  }
@media only screen and (min-width: 730px) {
    .qs-stats__features__feature__header__question-mark {
      margin: 0 50px 0 auto;
    }
  }
.qs-stats__features__feature__header__question-mark .question-mark {
    stroke: #787878;
    fill: #787878;
    transition: all 0.2s linear;
  }
.clark2 .qs-stats__features__feature__header__question-mark .question-mark {
    stroke: #daddec;
    fill: #daddec;
  }
.qs-stats__features__feature__header__question-mark--active .question-mark {
    stroke: #2b6cde;
    fill: #2b6cde;
  }
.qs-stats__features__feature__content {
    border: none;
    margin: 0 -15px;
    padding: 10px 30px;
    position: relative;
    z-index: 2;
    overflow: visible;
    font-size: 14px;
    line-height: 17px;
    font-weight: 400;
  }
@media only screen and (min-width: 730px) {
    .qs-stats__features__feature__content {
      margin: 0 -25px;
      padding: 10px 50px;
      font-size: 18px;
      line-height: 22px;
    }
  }
.qs-stats__features__feature__content--expanded:after {
    top: -14px;
  }
/* END: modules/app/quality-standards-stats */
/* BEGIN: modules/app/appointment/form */
.appointment-form {
    /* the ctas on the web version only */
    /* increase the height of the select for this page only for now */
  }
.appointment-form--app {
    padding: 0;
    display: flex;
    min-height: calc(100% - 51px);
    overflow: initial;
  }
.appointment-form--app .section__wrapper {
    display: flex;
    flex-direction: column;
  }
.appointment-form--app .appointment-form__footer {
    align-self: flex-end;
    width: 100%;
    margin-bottom: 10px;
    margin-top: auto;
  }
.appointment-form--app .appointment-form__form {
    margin-bottom: 50px;
  }
@media only screen and (min-width: 730px) {
    .appointment-form--app .appointment-form__form {
      margin-bottom: 70px;
    }
  }
.appointment-form__header {
    margin: 40px 0 16px 0;
    display: flex;
    justify-content: center;
  }
@media only screen and (min-width: 730px) {
    .appointment-form__header {
      margin-bottom: 60px;
    }
  }
.appointment-form__header__title {
    margin: 0;
    font-weight: 300;
    font-size: 18px;
    line-height: 24px;
    color: #333;
    text-align: center;
    max-width: 300px;
  }
@media only screen and (min-width: 450px) {
    .appointment-form__header__title {
      font-size: 19px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .appointment-form__header__title {
      font-size: 24px;
      line-height: 29px;
    }
  }
@media only screen and (min-width: 1000px) {
    .appointment-form__header__title {
      font-size: 26px;
      line-height: 39px;
    }
  }
.clark2 .appointment-form__header__title {
    color: #283e66;
  }
@media only screen and (min-width: 730px) {
    .appointment-form__header__title {
      max-width: none;
    }
  }
.appointment-form__intro {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    flex-wrap: nowrap;
    text-align: center;
    margin: 0 0 19px 0;
    margin: 0 0 17px 0;
  }
@media only screen and (min-width: 730px) {
    .appointment-form__intro {
      margin: 0 0 39px 0;
    }
  }
@media only screen and (min-width: 730px) {
    .appointment-form__intro {
      margin-bottom: 39px;
      margin-top: 50px;
    }
  }
.appointment-form__intro__copy {
    font-weight: 400;
    color: #626262;
    font-size: 15px;
    line-height: 21px;
    width: 100%;
  }
@media only screen and (min-width: 450px) {
    .appointment-form__intro__copy {
      font-size: 16px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .appointment-form__intro__copy {
      font-size: 17px;
      line-height: 25px;
    }
  }
@media only screen and (min-width: 1000px) {
    .appointment-form__intro__copy {
      font-size: 18px;
      line-height: 26px;
    }
  }
.clark2 .appointment-form__intro__copy {
    color: #283e66;
  }
.appointment-form__intro svg {
    width: 30px;
    max-height: 30px;
    height: auto;
    margin: 0 0 17px 0;
  }
@media only screen and (min-width: 730px) {
    .appointment-form__intro svg {
      margin-bottom: 30px;
    }
  }
.appointment-form__intro .phone-icon {
    fill: #2b6cde;
  }
.appointment-form__form {
    max-width: 500px;
    margin: 0px auto 20px auto;
  }
@media only screen and (min-width: 450px) {
    .appointment-form__web-ctas {
      padding: 20px 10px 0 0;
      min-height: 64px !important;
    }
  }
.appointment-form input {
    height: 47px;
  }
.appointment-form__footer {
    margin-top: 50px;
  }
@media only screen and (min-width: 730px) {
    .appointment-form__footer {
      margin-top: 70px;
    }
  }
/* END: modules/app/appointment/form */
/* BEGIN: modules/app/appointment/type */
.appointment-type--app {
    padding: 0;
    display: flex;
    min-height: calc(100% - 51px);
    overflow: initial;
    min-height: 100%;
  }
.appointment-type--app .section__wrapper {
    display: flex;
    flex-direction: column;
  }
.appointment-type--app .appointment-type__footer {
    align-self: flex-end;
    width: 100%;
    margin-bottom: 10px;
    margin-top: auto;
  }
.appointment-type--app .appointment-type__ctas {
    margin-bottom: 50px;
  }
@media only screen and (min-width: 730px) {
    .appointment-type--app .appointment-type__ctas {
      margin-bottom: 70px;
    }
  }
.appointment-type__header {
    margin: 40px 0 16px 0;
    display: flex;
    justify-content: center;
    margin: 40px 0 30px 0;
  }
@media only screen and (min-width: 730px) {
    .appointment-type__header {
      margin-bottom: 60px;
    }
  }
.appointment-type__header__title {
    margin: 0;
    font-weight: 300;
    font-size: 18px;
    line-height: 24px;
    color: #333;
    text-align: center;
    max-width: 300px;
  }
@media only screen and (min-width: 450px) {
    .appointment-type__header__title {
      font-size: 19px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .appointment-type__header__title {
      font-size: 24px;
      line-height: 29px;
    }
  }
@media only screen and (min-width: 1000px) {
    .appointment-type__header__title {
      font-size: 26px;
      line-height: 39px;
    }
  }
.clark2 .appointment-type__header__title {
    color: #283e66;
  }
@media only screen and (min-width: 730px) {
    .appointment-type__header__title {
      max-width: none;
    }
  }
.appointment-type__intro {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    flex-wrap: nowrap;
    text-align: center;
    margin: 0 0 19px 0;
    margin: 0 0 19px 0;
  }
@media only screen and (min-width: 730px) {
    .appointment-type__intro {
      margin: 0 0 39px 0;
    }
  }
@media only screen and (min-width: 730px) {
    .appointment-type__intro {
      margin-bottom: 70px;
      margin-top: 50px;
    }
  }
.appointment-type__intro__avatar {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    width: 60px;
    height: 60px;
    border-radius: 100%;
    border: 1px solid #d6d6d6;
    margin: 0 0 13px 0;
  }
.clark2 .appointment-type__intro__avatar {
    border-color: #daddec;
  }
@media only screen and (min-width: 730px) {
    .appointment-type__intro__avatar {
      width: 75px;
      height: 75px;
      margin: 0 0 25px 0;
    }
  }
.appointment-type__intro__copy {
    font-weight: 400;
    color: #626262;
    font-size: 15px;
    line-height: 21px;
    width: 100%;
  }
@media only screen and (min-width: 450px) {
    .appointment-type__intro__copy {
      font-size: 16px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .appointment-type__intro__copy {
      font-size: 17px;
      line-height: 25px;
    }
  }
@media only screen and (min-width: 1000px) {
    .appointment-type__intro__copy {
      font-size: 18px;
      line-height: 26px;
    }
  }
.clark2 .appointment-type__intro__copy {
    color: #283e66;
  }
.appointment-type__ctas {
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
  }
.appointment-type__ctas__item {
    margin: 0 7px;
    padding: 0;
  }
.appointment-type__ctas__item__link {
    border: 1px solid #d6d6d6;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    word-wrap: break-word;
    align-items: center;
    text-align: center;
    height: 105px !important;
    padding: 0 10px;
    border-radius: 4px;
    text-decoration: none;
    color: #787878;
    font-weight: 300;
    font-size: 14px;
    line-height: 22px;
    width: 90px;
  }
@media only screen and (min-width: 450px) {
    .appointment-type__ctas__item__link {
      font-size: 15px;
      line-height: 20px;
    }
  }
@media only screen and (min-width: 730px) {
    .appointment-type__ctas__item__link {
      line-height: 20px;
    }
  }
@media only screen and (min-width: 1000px) {
    .appointment-type__ctas__item__link {
      font-size: 15px;
      line-height: 20px;
    }
  }
.clark2 .appointment-type__ctas__item__link {
    border-color: #daddec;
    color: #283e66;
  }
@media only screen and (min-width: 730px) {
    .appointment-type__ctas__item__link {
      width: 190px;
    }
  }
.appointment-type__ctas__item__link--video svg {
    margin: 19px 0 18px 0;
  }
@media only screen and (min-width: 730px) {
    .appointment-type__ctas__item__link--video svg {
      margin: 30px 0 18px 0;
    }
  }
.appointment-type__ctas__item__link--phone svg {
    margin: 14px 0 24px 0;
  }
@media only screen and (min-width: 730px) {
    .appointment-type__ctas__item__link--phone svg {
      margin: 25px 0 13px 0;
    }
  }
.appointment-type__ctas__item__link .phone-icon {
    fill: #2b6cde;
  }
.appointment-type__footer {
    margin-top: 50px;
  }
@media only screen and (min-width: 730px) {
    .appointment-type__footer {
      margin-top: 70px;
    }
  }
/* END: modules/app/appointment/type */
/* BEGIN: modules/app/appointment/confirmation */
.appointment-confirmation--app {
    padding: 0;
    display: flex;
    min-height: calc(100% - 51px);
    overflow: initial;
  }
.appointment-confirmation--app .section__wrapper {
    display: flex;
    flex-direction: column;
  }
.appointment-confirmation--app .appointment-confirmation__footer {
    align-self: flex-end;
    width: 100%;
    margin-bottom: 10px;
    margin-top: auto;
  }
.appointment-confirmation--app .appointment-confirmation__intro {
    margin-bottom: 50px;
  }
@media only screen and (min-width: 730px) {
    .appointment-confirmation--app .appointment-confirmation__intro {
      margin-bottom: 70px;
    }
  }
.appointment-confirmation__header {
    margin: 40px 0 16px 0;
    display: flex;
    justify-content: center;
  }
@media only screen and (min-width: 730px) {
    .appointment-confirmation__header {
      margin-bottom: 60px;
    }
  }
.appointment-confirmation__header__title {
    margin: 0;
    font-weight: 300;
    font-size: 18px;
    line-height: 24px;
    color: #333;
    text-align: center;
    max-width: 300px;
  }
@media only screen and (min-width: 450px) {
    .appointment-confirmation__header__title {
      font-size: 19px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .appointment-confirmation__header__title {
      font-size: 24px;
      line-height: 29px;
    }
  }
@media only screen and (min-width: 1000px) {
    .appointment-confirmation__header__title {
      font-size: 26px;
      line-height: 39px;
    }
  }
.clark2 .appointment-confirmation__header__title {
    color: #283e66;
  }
@media only screen and (min-width: 730px) {
    .appointment-confirmation__header__title {
      max-width: none;
    }
  }
.appointment-confirmation__intro {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    flex-wrap: nowrap;
    text-align: center;
    margin: 0 0 19px 0;
    margin: 0 0 17px 0;
  }
@media only screen and (min-width: 730px) {
    .appointment-confirmation__intro {
      margin: 0 0 39px 0;
    }
  }
@media only screen and (min-width: 730px) {
    .appointment-confirmation__intro {
      margin-bottom: 39px;
      margin-top: 50px;
    }
  }
.appointment-confirmation__intro__copy {
    font-weight: 400;
    color: #626262;
    font-size: 15px;
    line-height: 21px;
    width: 100%;
    /* blue link in rails styles, porting over */
  }
@media only screen and (min-width: 450px) {
    .appointment-confirmation__intro__copy {
      font-size: 16px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .appointment-confirmation__intro__copy {
      font-size: 17px;
      line-height: 25px;
    }
  }
@media only screen and (min-width: 1000px) {
    .appointment-confirmation__intro__copy {
      font-size: 18px;
      line-height: 26px;
    }
  }
.clark2 .appointment-confirmation__intro__copy {
    color: #283e66;
  }
.appointment-confirmation__intro__copy .cta-secondary {
    color: #2b6cde;
  }
.appointment-confirmation__intro svg {
    width: 30px;
    max-height: 30px;
    height: auto;
    margin: 0 0 17px 0;
  }
@media only screen and (min-width: 730px) {
    .appointment-confirmation__intro svg {
      margin-bottom: 30px;
    }
  }
.appointment-confirmation__intro .phone-icon {
    fill: #2b6cde;
  }
@media only screen and (min-width: 450px) {
    .appointment-confirmation__web-cta {
      padding: 20px 10px 0 0;
      min-height: 64px !important;
    }
  }
.appointment-confirmation__footer {
    margin-top: 50px;
  }
@media only screen and (min-width: 730px) {
    .appointment-confirmation__footer {
      margin-top: 70px;
    }
  }
/* END: modules/app/appointment/confirmation */
/* BEGIN: modules/app/iban */
.iban-form--app {
    padding: 0;
    display: flex;
    min-height: calc(100% - 51px);
    overflow: initial;
  }
.iban-form--app .section__wrapper {
    display: flex;
    flex-direction: column;
  }
.iban-form--app .iban-form__footer {
    align-self: flex-end;
    width: 100%;
    margin-bottom: 10px;
    margin-top: auto;
  }
.iban-form--app .iban-form__form {
    margin-bottom: 50px;
  }
@media only screen and (min-width: 730px) {
    .iban-form--app .iban-form__form {
      margin-bottom: 70px;
    }
  }
.iban-form__header {
    margin: 40px 0 16px 0;
    display: flex;
    justify-content: center;
  }
@media only screen and (min-width: 730px) {
    .iban-form__header {
      margin-bottom: 60px;
    }
  }
.iban-form__header__title {
    margin: 0;
    font-weight: 300;
    font-size: 18px;
    line-height: 24px;
    color: #333;
    text-align: center;
    max-width: 300px;
  }
@media only screen and (min-width: 450px) {
    .iban-form__header__title {
      font-size: 19px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .iban-form__header__title {
      font-size: 24px;
      line-height: 29px;
    }
  }
@media only screen and (min-width: 1000px) {
    .iban-form__header__title {
      font-size: 26px;
      line-height: 39px;
    }
  }
.clark2 .iban-form__header__title {
    color: #283e66;
  }
@media only screen and (min-width: 730px) {
    .iban-form__header__title {
      max-width: none;
    }
  }
.iban-form__intro {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    flex-wrap: nowrap;
    text-align: center;
    margin: 0 0 19px 0;
    margin: 0 0 15px 0;
  }
@media only screen and (min-width: 730px) {
    .iban-form__intro {
      margin: 0 0 39px 0;
    }
  }
.iban-form__intro__copy {
    font-weight: 400;
    color: #626262;
    font-size: 15px;
    line-height: 21px;
    width: 100%;
  }
@media only screen and (min-width: 450px) {
    .iban-form__intro__copy {
      font-size: 16px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .iban-form__intro__copy {
      font-size: 17px;
      line-height: 25px;
    }
  }
@media only screen and (min-width: 1000px) {
    .iban-form__intro__copy {
      font-size: 18px;
      line-height: 26px;
    }
  }
.clark2 .iban-form__intro__copy {
    color: #283e66;
  }
@media only screen and (min-width: 450px) {
    .iban-form__web-cta {
      padding: 20px 10px 0 0;
      min-height: 64px !important;
    }
  }
.iban-form__form {
    max-width: 500px;
    margin: 0 auto 20px auto;
  }
.iban-form__footer {
    margin-top: 50px;
  }
@media only screen and (min-width: 730px) {
    .iban-form__footer {
      margin-top: 70px;
    }
  }
/* END: modules/app/iban */
/* BEGIN: modules/app/select-category */
.select_category {
    height: 100%;
    /* list of the categories at the bottom of the page */
  }
.select_category .wizard-select-insurance__intro--app {
    text-align: center;
  }
.select_category input[type=radio] {
    display: none;
  }
.select_category__categories {
    list-style-type: none;
    padding: 0;
    margin: 0;
    width: 100%;
    border-top: 1px solid #d6d6d6;
    /* each category item the user can click on */
  }
@media only screen and (min-width: 1000px) {
    .select_category__categories {
      border: none;
    }
  }
.select_category__categories__category {
    color: #626262;
    font-size: 15px;
    line-height: 21px;
    padding: 0;
    position: relative;
    border-bottom: 1px solid #d6d6d6;
    line-height: 25px;
  }
@media only screen and (min-width: 450px) {
    .select_category__categories__category {
      font-size: 16px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .select_category__categories__category {
      font-size: 17px;
      line-height: 25px;
    }
  }
@media only screen and (min-width: 1000px) {
    .select_category__categories__category {
      font-size: 18px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 1000px) {
    .select_category__categories__category:last-child {
      border: none;
    }
  }
.select_category__categories__category--item {
    /* check marks */
    /* active state check marks */
  }
.select_category__categories__category--item:before, .select_category__categories__category--item:after {
    position: absolute;
    content: "";
    display: block;
    border-radius: 100%;
    transition: all linear 0.1s;
  }
.select_category__categories__category--item:before {
    width: 23px;
    height: 23px;
    border: 2px solid #bbb;
    top: 17px;
    left: 19px;
  }
@media only screen and (min-width: 730px) {
    .select_category__categories__category--item:before {
      top: 16px;
      left: 27px;
      width: 25px;
      height: 25px;
    }
  }
.select_category__categories__category--item:after {
    width: 11px;
    height: 11px;
    top: 23px;
    background-color: #fff;
    transform: scale(0);
    transform-origin: center;
    left: 25px;
  }
@media only screen and (min-width: 730px) {
    .select_category__categories__category--item:after {
      left: 34px;
    }
  }
@media only screen and (min-width: 1000px) {
    .select_category__categories__category--item:after {
      left: 34px;
    }
  }
.select_category__categories__category--item--active:before {
    border: 2px solid #2b6cde;
  }
.select_category__categories__category--item--active:after {
    background-color: #2b6cde;
    transform: scale(1);
  }
@media only screen and (min-width: 1000px) {
    .select_category__categories__category--item--preceeds-divider {
      border: none;
    }
  }
.select_category__categories__category--item--filtered {
    display: none;
  }
.select_category__categories__category--divider {
    padding: 3px 20px;
    background-color: #f6f6f6;
    border-bottom: 1px solid #d6d6d6;
    color: #626262;
    font-weight: 400;
    font-size: 10px;
    line-height: 12px;
  }
@media only screen and (min-width: 1000px) {
    .select_category__categories__category--divider {
      border: none;
      padding: 4px 11px;
      font-size: 8px;
      line-height: 12px;
    }
  }
@media only screen and (min-width: 1000px) and (min-width: 450px) {
    .select_category__categories__category--divider {
      font-size: 8px;
      line-height: 14px;
    }
  }
@media only screen and (min-width: 1000px) and (min-width: 730px) {
    .select_category__categories__category--divider {
      font-size: 12px;
      line-height: 16px;
    }
  }
@media only screen and (min-width: 1000px) and (min-width: 1000px) {
    .select_category__categories__category--divider {
      font-size: 14px;
      line-height: 22px;
    }
  }
.select_category__categories__section {
    padding: 0;
  }
.select_category__categories__section__wrapper {
    padding: 0;
  }
@media only screen and (min-width: 1000px) {
    .select_category__categories__section__wrapper {
      padding: 40px 0;
    }
  }
/* END: modules/app/select-category */
/* BEGIN: modules/app/push-toggle */
.body--mobile-ios .push-toggle {
    display: block;
    /* If already enabled */
  }
.body--mobile-ios .push-toggle--hidden {
    display: none;
  }
.push-toggle {
    /* only show on ios (above) */
    display: none;
  }
.push-toggle__controls {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
  }
.push-toggle__controls__title {
    font-size: 16px;
    line-height: 21px;
    font-weight: 500;
    color: #17203d;
    margin: 0;
  }
.clark2 .push-toggle__controls__title {
    color: #283e66;
  }
.push-toggle__controls__toggle {
    width: 44px;
    height: 28px;
    border-radius: 30px;
    background-color: #d4d0d0;
    position: relative;
    transition: background-color linear 0.3s;
  }
.push-toggle__controls__toggle--toggled {
    background-color: #2b6cde;
  }
.clark2 .push-toggle__controls__toggle--toggled {
    background-color: #2b6cde;
  }
.push-toggle__controls__toggle--toggled .push-toggle__controls__toggle__btn {
    transform: translate3d(18px, 0, 0);
  }
.push-toggle__controls__toggle__btn {
    transition: transform linear 0.1s;
    position: absolute;
    top: 2px;
    transform: translate3d(2px, 0, 0);
    width: 24px;
    height: 24px;
    border-radius: 100%;
    background-color: white;
  }
.push-toggle__deselect {
    display: none;
    color: #787878;
    font-size: 16px;
    line-height: 21px;
    font-weight: 400;
  }
.clark2 .push-toggle__deselect {
    color: #283e66;
  }
.push-toggle__deselect--visible {
    display: block;
  }
/* END: modules/app/push-toggle */
/* BEGIN: modules/mandate-funnel/wizard-select-insurance */
/* don't have a hover color for the items on mobile */
.body--web .wizard-select-insurance__companies__item:hover {
    border: 2px solid #2b6cde;
  }
@media only screen and (min-width: 730px) {
    .body--web .wizard-select-insurance__companies__item:hover {
      border: 3px solid #2b6cde;
      /* when we have 2px border, there are issues on hover with content */
    }
    .body--web .wizard-select-insurance__companies__item:hover .wizard-select-insurance__companies__item__logo img {
      margin-top: 10px;
    }
    .body--web .wizard-select-insurance__companies__item:hover .wizard-select-insurance__companies__item__name {
      bottom: 9px;
    }
  }
.body--web .wizard-select-insurance__companies__item--owned:hover {
    border: 2px solid #f5a623;
  }
@media only screen and (min-width: 730px) {
    .body--web .wizard-select-insurance__companies__item--owned:hover {
      border: 3px solid #f5a623;
    }
  }
.wizard-select-insurance__title {
    display: none;
    text-align: center;
  }
@media only screen and (min-width: 450px) {
    .wizard-select-insurance__title {
      display: block;
    }
  }
.wizard-select-insurance__process {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
  }

@media only screen and (min-width: 450px) {
    .wizard-select-insurance__process {
      display: block;
    }
  }
.wizard-select-insurance__process .mandate_process_number {
    min-width: 30px;
    margin: 20px 20px 0 0;
    display: block;
  }
@media only screen and (min-width: 450px) {
    .wizard-select-insurance__process .mandate_process_number {
      margin: 0 0 10px 0;
    }
  }
.wizard-select-insurance__process .form-list__item--search-wrapper {
    width: 100%;
  }
.wizard-select-insurance__companies-title {
    font-size: 15px;
    line-height: 21px;
  }
@media only screen and (min-width: 450px) {
    .wizard-select-insurance__companies-title {
      font-size: 16px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .wizard-select-insurance__companies-title {
      font-size: 17px;
      line-height: 25px;
    }
  }
@media only screen and (min-width: 1000px) {
    .wizard-select-insurance__companies-title {
      font-size: 18px;
      line-height: 26px;
    }
  }
.wizard-select-insurance__search-section {
    padding-top: 0;
  }
@media only screen and (min-width: 450px) {
    .wizard-select-insurance__search-section {
      padding-top: 35px;
    }
  }
.wizard-select-insurance__search-section .search-fixed-min-height {
    margin-top: 20px;
  }
.wizard-select-insurance__search-section__inner {
    width: 100%;
    max-width: 420px;
    margin: 0 auto;
    position: relative;
    display: flex;
  }
.wizard-select-insurance__search-section__inner > div {
    width: 100%;
  }
.wizard-select-insurance__intro {
    max-width: 600px;
    margin: 0;
    display: block;
    margin-top: 20px;
    text-align: left;
  }
@media only screen and (min-width: 450px) {
    .wizard-select-insurance__intro {
      margin: 0 auto;
      text-align: center;
    }
  }
.wizard-select-insurance__intro--hidden {
    display: none;
  }
@media only screen and (min-width: 730px) {
    .wizard-select-insurance__intro--hidden {
      display: block;
    }
  }
.wizard-select-insurance__companies {
    list-style-type: none;
    margin: 20px 0 0px 0;
    flex-wrap: wrap;
  }
.wizard-select-insurance__companies__item {
    width: 85px;
    height: 85px;
    min-width: 85px;
    min-height: 85px;
    border: 2px solid #d6d6d6;
    border-radius: 4px;
    margin: 7px;
    position: relative;
    cursor: pointer;
    order: 2;
    display: none;
  }
.clark2 .wizard-select-insurance__companies__item {
    border-color: #daddec;
  }
@media only screen and (min-width: 730px) {
    .wizard-select-insurance__companies__item {
      width: 136px;
      min-width: 136px;
      height: 136px;
      min-height: 136px;
      margin: 13px;
    }
  }
.wizard-select-insurance__companies__item--selected, .wizard-select-insurance__companies__item--filtered, .wizard-select-insurance__companies__item--not-found, .wizard-select-insurance__companies__item--owned {
    display: block;
  }
.wizard-select-insurance__companies__item--selected {
    border: 2px solid #2b6cde;
    position: relative;
    z-index: 1;
  }
.wizard-select-insurance__companies__item--selected .wizard-select-insurance__companies__item__name {
    color: #2b6cde;
  }
@media only screen and (min-width: 730px) {
    .wizard-select-insurance__companies__item--selected {
      border: 3px solid #2b6cde;
      /* when we have 2px border, there are issues on hover with content */
    }
    .wizard-select-insurance__companies__item--selected .wizard-select-insurance__companies__item__logo img {
      margin-top: 10px;
    }
    .wizard-select-insurance__companies__item--selected .wizard-select-insurance__companies__item__name {
      bottom: 9px;
    }
  }
.wizard-select-insurance__companies__item--selected::before, .wizard-select-insurance__companies__item--selected::after {
    content: " ";
    position: absolute;
    width: 20px;
    height: 20px;
    top: -8px;
    right: -8px;
  }
@media only screen and (min-width: 730px) {
    .wizard-select-insurance__companies__item--selected::before, .wizard-select-insurance__companies__item--selected::after {
      width: 26px;
      height: 26px;
      top: -12px;
      right: -12px;
    }
  }
.wizard-select-insurance__companies__item--selected::before {
    background-color: #2b6cde;
    border-radius: 100%;
    z-index: 2;
  }
.wizard-select-insurance__companies__item--selected::after {
    z-index: 3;
    background-size: 12px;
    background-repeat: no-repeat;
    background-position: 50% 50%;
  }
@media only screen and (min-width: 730px) {
    .wizard-select-insurance__companies__item--selected::after {
      background-size: 14px;
    }
  }
.wizard-select-insurance__companies__item--selected--searching {
    order: 3;
  }
.wizard-select-insurance__companies__item--owned {
    order: 1;
    border: 2px solid #f5a623;
  }
.wizard-select-insurance__companies__item--owned .wizard-select-insurance__companies__item__name {
    color: #f5a623;
  }
@media only screen and (min-width: 730px) {
    .wizard-select-insurance__companies__item--owned {
      border: 3px solid #f5a623;
    }
  }
.wizard-select-insurance__companies__item--owned::before {
    background-color: #f5a623;
  }
.wizard-select-insurance__companies__item--owned--searching {
    order: 4;
  }
.wizard-select-insurance__companies__item--not-found {
    border: 2px solid #2b6cde;
    order: 5;
  }
.wizard-select-insurance__companies__item--not-found .wizard-select-insurance__companies__item__name {
    color: #2b6cde;
    word-break: normal;
    word-wrap: break-word;
  }
@media only screen and (min-width: 730px) {
    .wizard-select-insurance__companies__item--not-found {
      border: 3px solid #2b6cde;
    }
  }
.wizard-select-insurance__companies__item--not-found:hover {
    border: 2px solid #3a6bc1;
  }
.wizard-select-insurance__companies__item--not-found:hover .wizard-select-insurance__companies__item__name {
    color: #3a6bc1;
  }
@media only screen and (min-width: 730px) {
    .wizard-select-insurance__companies__item--not-found:hover {
      border: 3px solid #3a6bc1;
    }
    .wizard-select-insurance__companies__item--not-found:hover .wizard-select-insurance__companies__item__name {
      bottom: 10px;
    }
  }
.wizard-select-insurance__companies__item--not-found:hover .plus-circle {
    stroke: #3a6bc1;
  }
.wizard-select-insurance__companies__item--not-found__icon {
    color: #2b6cde;
    width: 40px;
    height: 40px;
    margin: 8px auto 0 auto;
    display: block;
    text-align: center;
    font-size: 1.9em;
    font-style: normal;
    line-height: 35px;
  }
@media only screen and (min-width: 730px) {
    .wizard-select-insurance__companies__item--not-found__icon {
      width: 60px;
      height: 60px;
      font-size: 3.4em;
      line-height: 55px;
      margin-top: 18px;
    }
  }
.wizard-select-insurance__companies__item--not-found__icon svg {
    width: 100%;
    height: 100%;
  }
.wizard-select-insurance__companies__item__logo img {
    width: auto;
    margin: 8px auto 0 auto;
    display: block;
    max-height: 40px;
    max-width: 68px;
  }
@media only screen and (min-width: 730px) {
    .wizard-select-insurance__companies__item__logo img {
      max-height: 80px;
      max-width: 108px;
      margin-top: 11px;
    }
  }
.wizard-select-insurance__companies__item__name {
    position: absolute;
    text-align: center;
    padding: 0 5px;
    font-size: 10px;
    line-height: 11px;
    bottom: 5px;
    left: 0;
    right: 0;
    color: #626262;
  }
.clark2 .wizard-select-insurance__companies__item__name {
    color: #283e66;
  }
@media only screen and (min-width: 730px) {
    .wizard-select-insurance__companies__item__name {
      bottom: 10px;
      font-size: 14px;
      line-height: 14px;
    }
  }
.wizard-select-insurance__missing {
    text-align: center;
    font-size: 15px;
    line-height: 21px;
    margin-bottom: 30px;
  }
@media only screen and (min-width: 450px) {
    .wizard-select-insurance__missing {
      font-size: 16px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .wizard-select-insurance__missing {
      font-size: 17px;
      line-height: 25px;
    }
  }
@media only screen and (min-width: 1000px) {
    .wizard-select-insurance__missing {
      font-size: 18px;
      line-height: 26px;
    }
  }
.wizard-select-insurance__missing__add-new {
    color: #2b6cde;
    cursor: pointer;
    margin-top: 10px;
  }
@media only screen and (min-width: 450px) {
    .wizard-select-insurance__missing__add-new {
      margin: 0 0 0 15px;
    }
  }
.wizard-select-insurance__modal__content {
    margin-top: 50px;
    width: 100%;
    text-align: center;
  }
.wizard-select-insurance__modal__submit, .wizard-select-insurance__modal__cancel {
    width: 100%;
  }
@media only screen and (min-width: 450px) {
    .wizard-select-insurance__modal__submit, .wizard-select-insurance__modal__cancel {
      width: auto;
    }
  }
@media only screen and (min-width: 730px) {
    .wizard-select-insurance__modal__submit {
      order: 0;
    }
  }
@media only screen and (min-width: 730px) {
    .wizard-select-insurance__modal__cancel {
      order: 1;
    }
  }
.wizard-select-insurance__modal__form {
    margin-bottom: 30px;
  }
/* END: modules/mandate-funnel/wizard-select-insurance */
/* BEGIN: modules/mandate/cockpit-preview */
body.whitelabel {
    /* only on white label do we do this change */
  }
body.whitelabel .cockpit-preview__section-background {
    background-color: #2b6cde;
  }
body.whitelabel .cockpit-preview-svg-fill {
    fill: #2b6cde;
  }
.manager__cockpit__add-insurances-cta__btn__icon-new svg {
    width: 16px;
    height: 16px;
  }
.manager__cockpit__add-insurances-cta__btn__icon-new .plus-in-circle {
    stroke: #fff;
  }
.cockpit-preview--animate {
    transition-property: all;
    transition-duration: 0.5s;
    transition-fill-mode: forwards;
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    /* easeOutBack */
  }
.cockpit-preview--fade-in {
    opacity: 0;
  }
.cockpit-preview--spin {
    transform-origin: 0 0;
  }
.cockpit-preview__section-background {
    padding: 0;
    background-color: #17203d;
    height: 100%;
  }
@media only screen and (min-width: 450px) {
    .cockpit-preview__section-background {
      height: auto;
    }
  }
.cockpit-preview__section-background--app {
    height: calc(100% - 53px);
  }
@media only screen and (min-width: 450px) {
    .cockpit-preview__section-background--app {
      /*
        makes the button look .. a little better on apps,
        we still need to come back to this button when we get more time
      */
      height: calc(100% - 73px);
    }
  }
.cockpit-preview__section-background--app .just-mobile, .cockpit-preview__section-background--app .not-mobile {
    height: 100%;
  }
.cockpit-preview__section-background .just-mobile, .cockpit-preview__section-background .not-mobile {
    width: 100% !important;
  }
.cockpit-preview__button {
    /* this was broken for all small break points the cockpit preview CTA that is */
    margin-top: -54px;
    background-color: white;
  }
@media only screen and (min-width: 450px) {
    .cockpit-preview__button {
      margin-top: 28px;
      margin-bottom: 28px;
    }
  }
.cockpit-preview__floater-button-container {
    position: fixed;
    z-index: 10;
    bottom: env(safe-area-inset-bottom);
    width: 100%;
    background-color: white;
  }
@media only screen and (max-width: 729.98px) {
    .page-main--with-web-tab-bar .cockpit-preview__floater-button-container {
      bottom: calc(45px + env(safe-area-inset-bottom));
    }
  }
@media only screen and (min-width: 730px) {
    .page-main.footer-sticky .cockpit-preview__floater-button-container {
      bottom: calc(60px + env(safe-area-inset-bottom));
    }
  }
.cockpit-preview__customised-cockpit-preview {
    height: auto;
    min-height: calc(100vh - 160px);
    /* 80px header, 80px floating button bar */
    background-color: #283250;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center top;
    display: flex;
    align-items: center;
    justify-content: center;
    /* IE11 min height bug fix*/
  }
@media only screen and (max-width: 729.98px) {
    .cockpit-preview__customised-cockpit-preview {
      min-height: 100vh;
    }
    .page-main--with-web-tab-bar .cockpit-preview__customised-cockpit-preview {
      min-height: calc(100vh - 45px - env(safe-area-inset-bottom));
    }
  }
.cockpit-preview__customised-cockpit-preview:after {
    content: "";
    min-height: inherit;
    font-size: 0;
  }
.cockpit-preview__customised-cockpit-preview .tip {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-self: center;
    align-items: center;
    justify-content: center;
  }
.cockpit-preview__customised-cockpit-preview .tip p, .cockpit-preview__customised-cockpit-preview .tip i {
    margin: 25px 0;
  }
.cockpit-preview__customised-cockpit-preview .text {
    color: white;
    font-size: 26px;
    line-height: 140%;
    flex-basis: 100%;
    text-align: center;
    margin: 20px 0;
  }
@media only screen and (min-width: 730px) {
    .cockpit-preview__customised-cockpit-preview .text {
      font-size: 32px;
      flex-basis: auto;
    }
  }
.cockpit-preview__customised-cockpit-preview i.arrow {
    animation: bounceInDown 3s infinite;
    width: 20px;
    height: 120px;
  }
.cockpit-preview__customised-cockpit-preview--for-clark {
    background-image: url("https://app.clark.de/assets/images/clark_cockpit_preview_bg_mobile-981e91ae256e9fe2b416a4b541533308.png");
  }
@media only screen and (min-width: 730px) {
    .cockpit-preview__customised-cockpit-preview--for-clark {
      background-image: url("https://app.clark.de/assets/images/clark_cockpit_preview_bg_desktop-c3692444f72b1a91111eecc63b3c9116.png");
    }
  }
/* END: modules/mandate/cockpit-preview */
/* BEGIN: modules/mandate/select-category/company */
.manager__company-select {
    height: 100%;
    /* list of the companies at the bottom of the page */
  }
.manager__company-select .wizard-select-insurance__intro--app {
    text-align: center;
  }
.manager__company-select__companies {
    list-style-type: none;
    padding: 0;
    margin: 0;
    width: 100%;
    border-top: 1px solid #d6d6d6;
    /* each company item the user can click on */
  }
.clark2 .manager__company-select__companies {
    border-top-color: #daddec;
  }
@media only screen and (min-width: 1000px) {
    .manager__company-select__companies {
      border: none;
    }
  }
.manager__company-select__companies__company {
    color: #333;
    font-size: 15px;
    line-height: 21px;
    padding: 10px 20px;
    position: relative;
    border-bottom: 1px solid #d6d6d6;
    line-height: 26px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    cursor: pointer;
    /* for Firefox and its flex child image sizing bugs */
  }
@media only screen and (min-width: 450px) {
    .manager__company-select__companies__company {
      font-size: 16px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .manager__company-select__companies__company {
      font-size: 17px;
      line-height: 25px;
    }
  }
@media only screen and (min-width: 1000px) {
    .manager__company-select__companies__company {
      font-size: 18px;
      line-height: 26px;
    }
  }
.clark2 .manager__company-select__companies__company {
    border-bottom-color: #daddec;
    color: #283e66;
  }
@media only screen and (min-width: 1000px) {
    .manager__company-select__companies__company {
      padding: 12px 20px;
    }
  }
@media only screen and (min-width: 1000px) {
    .manager__company-select__companies__company:last-child {
      border: none;
    }
  }
.manager__company-select__companies__company--filtered {
    display: none;
  }
.manager__company-select__companies__company--selected .manager__company-select__companies__company__icon {
    transform: scale(1);
  }
.manager__company-select__companies__company__icon {
    transform-origin: center;
    transition: transform 0.1s linear;
    width: 22px;
    height: 22px;
    margin: 0 5px 0 auto;
    border-radius: 100%;
    transform: scale(0);
  }
@media only screen and (min-width: 730px) {
    .manager__company-select__companies__company__icon {
      width: 25px;
      height: 25px;
    }
  }
.manager__company-select__companies__company__icon svg {
    width: 22px;
    height: 22px;
  }
.manager__company-select__companies__company__icon svg .tick-icon-fill {
    fill: #2b6cde;
  }
@media only screen and (min-width: 730px) {
    .manager__company-select__companies__company__icon svg {
      height: 25px;
      width: 25px;
    }
  }
.manager__company-select__companies__company__add-more-icon {
    width: 22px;
    height: 22px;
    display: block;
    margin: 0 auto;
  }
.manager__company-select__companies__company__add-more-icon svg {
    width: 22px;
    height: 22px;
  }
.manager__company-select__companies__company__img-wrapper-wrapper {
    display: flex;
    flex-direction: row;
    align-items: center;
    height: 31px;
  }
@media only screen and (min-width: 1000px) {
    .manager__company-select__companies__company__img-wrapper-wrapper {
      height: 37px;
    }
  }
.manager__company-select__companies__company__img-wrapper {
    width: 56px;
    margin: 0 20px 0 0;
  }
@media only screen and (min-width: 1000px) {
    .manager__company-select__companies__company__img-wrapper {
      width: 62px;
      margin: 0 52px 0 0;
    }
  }
.manager__company-select__companies__company__img {
    max-width: 56px;
    max-height: 31px;
    width: auto;
    display: block;
    margin: 0 auto;
  }
@media only screen and (min-width: 1000px) {
    .manager__company-select__companies__company__img {
      max-height: 31px;
      max-width: 62px;
    }
  }
.manager__company-select__companies__company--divider {
    padding: 3px 20px;
    background-color: #f6f6f6;
    border-bottom: 1px solid #d6d6d6;
    color: #333;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
  }
@media only screen and (min-width: 450px) {
    .manager__company-select__companies__company--divider {
      font-size: 13px;
      line-height: 18px;
    }
  }
@media only screen and (min-width: 730px) {
    .manager__company-select__companies__company--divider {
      font-size: 14px;
      line-height: 22px;
    }
  }
@media only screen and (min-width: 1000px) {
    .manager__company-select__companies__company--divider {
      font-size: 14px;
      line-height: 22px;
    }
  }
.clark2 .manager__company-select__companies__company--divider {
    border-bottom-color: #daddec;
    background-color: #f5f6fa;
  }
@media only screen and (min-width: 1000px) {
    .manager__company-select__companies__company--divider {
      border: none;
      padding: 4px 30px;
      font-size: 8px;
      line-height: 12px;
    }
  }
@media only screen and (min-width: 1000px) and (min-width: 450px) {
    .manager__company-select__companies__company--divider {
      font-size: 8px;
      line-height: 14px;
    }
  }
@media only screen and (min-width: 1000px) and (min-width: 730px) {
    .manager__company-select__companies__company--divider {
      font-size: 12px;
      line-height: 16px;
    }
  }
@media only screen and (min-width: 1000px) and (min-width: 1000px) {
    .manager__company-select__companies__company--divider {
      font-size: 14px;
      line-height: 22px;
    }
  }
.manager__company-select__companies__company--divider--hidden {
    display: none;
  }
.manager__company-select__companies__section {
    padding: 0;
  }
.manager__company-select__companies__section__wrapper {
    padding: 0;
  }
@media only screen and (min-width: 1000px) {
    .manager__company-select__companies__section__wrapper {
      padding: 40px 0;
    }
  }
/* END: modules/mandate/select-category/company */
/* BEGIN: modules/mandate/select-category/selection */
.wizard-select-insurance__search-section em {
    color: #2b6cde;
    font-weight: 500;
    font-style: normal;
    margin-right: 5px;
  }
.body--mobile-ios .manager__cat-select__categories__section, .body--mobile-android .manager__cat-select__categories__section {
    padding-bottom: 56px;
  }
.sticky-element {
    z-index: 9;
  }
.sticky-element--sticky {
    border-bottom: 1px solid #d6d6d6;
  }
.clark2 .sticky-element--sticky {
    border-bottom-color: #daddec;
  }
.manager__cat-select {
    height: 100%;
    background-color: #fff;
    /* list of the categories at the bottom of the page */
  }
.manager__cat-select .wizard-select-insurance__intro--app {
    text-align: center;
  }
@media only screen and (min-width: 1000px) {
    .manager__cat-select__letters {
      display: none;
    }
  }
.manager__cat-select__categories {
    list-style-type: none;
    padding: 0;
    margin: 0;
    width: 100%;
    border-top: 1px solid #d6d6d6;
    /* each category item the user can click on */
  }
.clark2 .manager__cat-select__categories {
    border-top-color: #daddec;
  }
@media only screen and (min-width: 1000px) {
    .manager__cat-select__categories:first-child {
      border: none;
    }
  }
.manager__cat-select__categories--regular {
    border-top: none;
  }
.manager__cat-select__categories--selected .manager__cat-select__categories__category {
    padding: 0;
  }
@media only screen and (min-width: 1000px) {
    .manager__cat-select__categories--selected .manager__cat-select__categories__category {
      padding: 0;
    }
  }
.manager__cat-select__categories--selected .manager__cat-select__categories__category:last-child {
    border-bottom: none;
  }
.manager__cat-select__categories--selected .manager__cat-select__categories__category__icon {
    margin: 20px 17px 20px 20px;
  }
@media only screen and (min-width: 1000px) {
    .manager__cat-select__categories--selected .manager__cat-select__categories__category__icon {
      margin: 20px 17px 20px 30px;
    }
  }
.manager__cat-select__categories__category {
    color: #333;
    font-size: 15px;
    line-height: 21px;
    padding: 11px 20px;
    position: relative;
    border-bottom: 1px solid #d6d6d6;
    line-height: 26px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    cursor: pointer;
    /* need the inner so we dont get confusion on the actions (one for removing and one for editing) */
    /* check mark icons */
    /* the chevron icon for the selected categories card */
  }
@media only screen and (min-width: 450px) {
    .manager__cat-select__categories__category {
      font-size: 16px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .manager__cat-select__categories__category {
      font-size: 17px;
      line-height: 25px;
    }
  }
@media only screen and (min-width: 1000px) {
    .manager__cat-select__categories__category {
      font-size: 18px;
      line-height: 26px;
    }
  }
.clark2 .manager__cat-select__categories__category {
    color: #283e66;
    border-bottom-color: #daddec;
  }
@media only screen and (min-width: 1000px) {
    .manager__cat-select__categories__category {
      padding: 17px 30px;
      height: 60px;
    }
  }
@media only screen and (min-width: 1000px) {
    .manager__cat-select__categories__category:last-child {
      border: none;
    }
  }
.manager__cat-select__categories__category--filtered {
    display: none;
  }
.manager__cat-select__categories__category--locked {
    opacity: 0.5;
  }
.manager__cat-select__categories__category--selected .manager__cat-select__categories__category__icon {
    border: none;
  }
.manager__cat-select__categories__category--selected .manager__cat-select__categories__category__icon svg {
    transform: scale(1);
  }
.manager__cat-select__categories__category__inner {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    flex-grow: 1;
  }
@media only screen and (min-width: 450px) {
    .manager__cat-select__categories__category__inner {
      padding-top: 7px;
      padding-bottom: 10px;
    }
  }
@media only screen and (min-width: 1000px) {
    .manager__cat-select__categories__category__inner {
      padding: 20px 30px 20px 0;
    }
  }
.manager__cat-select__categories__category__icon {
    width: 22px;
    height: 22px;
    min-height: 22px;
    min-width: 22px;
    border: 2px solid #d6d6d6;
    margin: 0 17px 0 0;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 100%;
  }
.clark2 .manager__cat-select__categories__category__icon {
    border-color: #daddec;
  }
@media only screen and (min-width: 450px) {
    .manager__cat-select__categories__category__icon {
      margin-top: 15px;
      margin-bottom: 15px;
    }
  }
@media only screen and (min-width: 730px) {
    .manager__cat-select__categories__category__icon {
      width: 25px;
      height: 25px;
      min-height: 25px;
      min-height: 25px;
    }
  }
.manager__cat-select__categories__category__icon svg {
    transform: scale(0);
    transform-origin: center;
    transition: transform 0.1s linear;
    width: 22px;
    height: 22px;
  }
.manager__cat-select__categories__category__icon svg .tick-icon-fill {
    fill: #2b6cde;
  }
.manager__cat-select__categories__category__icon svg .tick-icon {
    fill: #2b6cde;
    stroke: #2b6cde;
  }
@media only screen and (min-width: 730px) {
    .manager__cat-select__categories__category__icon svg {
      height: 25px;
      width: 25px;
    }
  }
.manager__cat-select__categories__category__checkbox {
    width: 24px;
    height: 24px;
    min-height: 22px;
    min-width: 22px;
    border: 2px solid #d6d6d6;
    margin: 0 17px 0 0;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 3px;
  }
.clark2 .manager__cat-select__categories__category__checkbox {
    border-color: #daddec;
  }
@media only screen and (min-width: 730px) {
    .manager__cat-select__categories__category__checkbox {
      width: 25px;
      height: 25px;
      min-height: 25px;
      min-height: 25px;
    }
  }
.manager__cat-select__categories__category__checkbox svg {
    transform: scale(0);
    transform-origin: center;
    transition: transform 0.1s linear;
    width: 22px;
    height: 22px;
  }
.manager__cat-select__categories__category__checkbox svg .tick-icon-fill {
    fill: #2b6cde;
  }
.manager__cat-select__categories__category__checkbox svg .tick-icon {
    fill: #2b6cde;
    stroke: #2b6cde;
  }
@media only screen and (min-width: 730px) {
    .manager__cat-select__categories__category__checkbox svg {
      height: 25px;
      width: 25px;
    }
  }
.manager__cat-select__categories__category__company-wrapper {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
  }
.manager__cat-select__categories__category__company-wrapper__company {
    font-size: 12px;
    line-height: 12px;
    color: #697188;
    margin: 0;
  }
.clark2 .manager__cat-select__categories__category__company-wrapper__company {
    color: #697188;
  }
@media only screen and (min-width: 1000px) {
    .manager__cat-select__categories__category--item--preceeds-divider {
      border: none;
    }
  }
.manager__cat-select__categories__category--divider {
    padding: 3px 20px;
    background-color: #f6f6f6;
    border-bottom: 1px solid #d6d6d6;
    color: #333;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
  }
@media only screen and (min-width: 450px) {
    .manager__cat-select__categories__category--divider {
      font-size: 13px;
      line-height: 18px;
    }
  }
@media only screen and (min-width: 730px) {
    .manager__cat-select__categories__category--divider {
      font-size: 14px;
      line-height: 22px;
    }
  }
@media only screen and (min-width: 1000px) {
    .manager__cat-select__categories__category--divider {
      font-size: 14px;
      line-height: 22px;
    }
  }
.clark2 .manager__cat-select__categories__category--divider {
    border-bottom-color: #daddec;
    background-color: #f5f6fa;
    color: #283e66;
  }
@media only screen and (min-width: 1000px) {
    .manager__cat-select__categories__category--divider {
      border: none;
      padding: 4px 30px;
      font-size: 8px;
      line-height: 12px;
    }
  }
@media only screen and (min-width: 1000px) and (min-width: 450px) {
    .manager__cat-select__categories__category--divider {
      font-size: 8px;
      line-height: 14px;
    }
  }
@media only screen and (min-width: 1000px) and (min-width: 730px) {
    .manager__cat-select__categories__category--divider {
      font-size: 12px;
      line-height: 16px;
    }
  }
@media only screen and (min-width: 1000px) and (min-width: 1000px) {
    .manager__cat-select__categories__category--divider {
      font-size: 14px;
      line-height: 22px;
    }
  }
.manager__cat-select__categories__category--divider--blue {
    color: #2b6cde;
  }
.manager__cat-select__categories__category--divider--hidden {
    display: none;
  }
.manager__cat-select__categories__section {
    padding: 0;
  }
.manager__cat-select__categories__section__wrapper {
    padding: 0;
  }
@media only screen and (min-width: 1000px) {
    .manager__cat-select__categories__section__wrapper {
      padding: 40px 0;
    }
  }
/* END: modules/mandate/select-category/selection */
/* BEGIN: modules/mandate/add-company */
.manager__add-company {
    height: 100%;
    display: flex;
    flex-wrap: nowrap;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
    height: 100%;
    padding-top: 30px;
    background-color: #f6f6f6;
  }
.clark2 .manager__add-company {
    background-color: #f5f6fa;
  }
.manager__add-company__section {
    height: 100%;
  }
.manager__add-company__wrapper {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
    height: 100%;
  }
.manager__add-company__close-icon {
    position: absolute;
    top: 20px;
    right: 20px;
    display: block;
    width: 30px;
    height: 30px;
    z-index: 1;
  }
.manager__add-company__close-icon svg {
    display: block;
    width: 30px;
    height: 30px;
  }
.manager__add-company__close-icon .x-in-circle-icon {
    stroke: #2b6cde;
  }
.manager__add-company__icon {
    margin: 20px 0;
    display: block;
    width: 121px;
    height: 121px;
    min-height: 121px;
    position: relative;
  }
.manager__add-company__icon svg {
    width: 121px;
    height: 121px;
    min-height: 121px;
  }
.manager__add-company__intro, .manager__add-company__copy {
    text-align: center;
    color: #626262;
  }
.clark2 .manager__add-company__intro, .clark2 .manager__add-company__copy {
    color: #283e66;
  }
.manager__add-company__intro {
    font-size: 21px;
    line-height: 26px;
    margin: 0 0 16px 0;
  }
@media only screen and (min-width: 450px) {
    .manager__add-company__intro {
      font-size: 22px;
      line-height: 29px;
    }
  }
@media only screen and (min-width: 730px) {
    .manager__add-company__intro {
      font-size: 27px;
      line-height: 36px;
    }
  }
@media only screen and (min-width: 1000px) {
    .manager__add-company__intro {
      font-size: 36px;
      line-height: 40px;
    }
  }
.manager__add-company__copy {
    font-size: 16px;
    line-height: 23px;
    font-weight: 300;
    margin: 0 0 30px 0;
  }
@media only screen and (min-width: 450px) {
    .manager__add-company__copy {
      font-size: 17px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .manager__add-company__copy {
      font-size: 21px;
      line-height: 30px;
    }
  }
@media only screen and (min-width: 1000px) {
    .manager__add-company__copy {
      font-size: 22px;
      line-height: 32px;
    }
  }
.manager__add-company__ctas {
    padding: 0;
    margin: 0;
    list-style-type: none;
    width: 100%;
  }
.manager__add-company__ctas__cta {
    width: 100%;
  }
.manager__add-company__ctas__cta a {
    width: 100%;
  }
.manager__add-company__form {
    width: 100%;
    margin: 30px 0 20px 0;
  }
/* END: modules/mandate/add-company */
/* BEGIN: modules/mandate/status */
.mandate-status {
    background-color: #3a6bc1;
    display: block;
    height: calc(100% - 51px);
    /* app variant of the screen */
    /* this only shows on large */
  }
@media only screen and (min-width: 450px) {
    .mandate-status {
      height: calc(100% - 124px);
    }
  }
.mandate-status__inner {
    padding: 0 28px 0 48px;
    margin: 0 auto;
    max-width: 600px;
  }
@media only screen and (min-width: 1000px) {
    .mandate-status__inner {
      padding: 0;
      max-width: 1000px;
    }
  }
.mandate-status--app .mandate-status__inner {
    padding: 0 20px;
    height: 100%;
    display: flex;
    flex-direction: column;
  }
.mandate-status--app .mandate-status__headline {
    margin: 30px 0;
  }
.mandate-status--app .mandate-status__steps {
    flex: 1;
    display: flex;
    flex-direction: column;
  }
.mandate-status--app .mandate-status__steps__step {
    padding: 0 0 20px 0;
    margin: 0 0 auto 0;
  }
.mandate-status__dashed-border-large {
    display: none;
    background-repeat: repeat-y;
    margin: 0;
    padding: 0;
    border: none;
    width: 6px;
    height: 660px;
    position: absolute;
    top: 20px;
    left: 163px;
    transform: rotate(-90deg);
    transform-origin: 50% 0;
  }
@media only screen and (min-width: 1000px) {
    .mandate-status__dashed-border-large {
      display: block;
    }
  }
.mandate-status__headline {
    color: #fff;
    font-size: 21px;
    line-height: 26px;
    margin: 40px 0 50px 0;
  }
@media only screen and (min-width: 450px) {
    .mandate-status__headline {
      font-size: 22px;
      line-height: 29px;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate-status__headline {
      font-size: 27px;
      line-height: 36px;
    }
  }
@media only screen and (min-width: 1000px) {
    .mandate-status__headline {
      font-size: 36px;
      line-height: 40px;
    }
  }
.mandate-status__headline em {
    font-style: normal;
    display: inline-block;
    font-weight: 500;
  }
@media only screen and (min-width: 730px) {
    .mandate-status__headline {
      margin: 30px 0 50px 0;
    }
  }
@media only screen and (min-width: 1000px) {
    .mandate-status__headline {
      margin: 70px 0 120px 0;
    }
  }
.mandate-status__steps {
    margin: 0;
    padding: 0;
    list-style-type: none;
    background-repeat: repeat-y;
    background-position: 10px 0;
  }
@media only screen and (min-width: 730px) {
    .mandate-status__steps {
      background-position: 17px 0;
    }
  }
@media only screen and (min-width: 1000px) {
    .mandate-status__steps {
      display: flex;
      flex-direction: row;
      padding-bottom: 140px;
      /* relative for the abs dashed border inside it for mobile */
      position: relative;
      background: none;
    }
  }
.mandate-status__steps__step {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
    position: relative;
    margin: 0 0 auto 0;
    padding: 0 0 40px 0;
    width: 100%;
    /* tick icon styles (only svg in here now) */
    /* tick icon color */
  }
@media only screen and (min-width: 730px) {
    .mandate-status__steps__step {
      padding: 0 0 60px 0;
    }
  }
@media only screen and (min-width: 1000px) {
    .mandate-status__steps__step {
      flex-direction: column;
      align-items: center;
      padding: 0 33px;
    }
  }
.mandate-status__steps__step:nth-child(4) {
    background-color: #3a6bc1;
    /* android needed to be hoisted up a little (else you see the border a little) */
    margin-bottom: -1px;
  }
@media only screen and (min-width: 1000px) {
    .mandate-status__steps__step:nth-child(4) {
      margin: 0;
      background: none;
    }
  }
.mandate-status__steps__step svg {
    width: 11px;
  }
@media only screen and (min-width: 730px) {
    .mandate-status__steps__step svg {
      width: 16px;
    }
  }
.mandate-status__steps__step .tick-check-icon {
    stroke: #fff;
  }
.mandate-status__steps__step__number {
    width: 25px;
    min-width: 25px;
    height: 25px;
    border: 2px solid #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 25px;
    font-size: 12px;
    font-weight: 500;
    background-color: #3a6bc1;
    color: #fff;
    border-radius: 100%;
    margin: 0 20px 0 0;
  }
@media only screen and (min-width: 730px) {
    .mandate-status__steps__step__number {
      line-height: 40px;
      height: 40px;
      width: 40px;
      min-width: 40px;
      font-size: 19px;
      border: 3px solid #fff;
    }
  }
@media only screen and (min-width: 1000px) {
    .mandate-status__steps__step__number {
      margin: 0 0 30px 0;
    }
  }
.mandate-status__steps__step__text {
    color: #fff;
    font-size: 14px;
    line-height: 22px;
    font-weight: 300;
    text-align: left;
    margin: 0;
  }
@media only screen and (min-width: 450px) {
    .mandate-status__steps__step__text {
      font-size: 15px;
      line-height: 20px;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate-status__steps__step__text {
      line-height: 20px;
    }
  }
@media only screen and (min-width: 1000px) {
    .mandate-status__steps__step__text {
      font-size: 15px;
      line-height: 20px;
    }
  }
@media only screen and (min-width: 1000px) {
    .mandate-status__steps__step__text {
      text-align: center;
    }
  }
.mandate-status__top-cooperation-section {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    margin-top: 27px;
  }
.mandate-status__top-cooperation-section__center-text {
    font-weight: 300;
    color: #626262;
    margin-top: 27px;
    margin-bottom: 8px;
  }
.clark2 .mandate-status__top-cooperation-section__center-text {
    color: #283e66;
  }
.mandate-status__top-cooperation-section__clark-logo, .mandate-status__top-cooperation-section__clark-logo svg {
    width: 183px;
    height: 50px;
    display: block;
  }
.mandate-status__top-cooperation-section__clark-logo--middle {
    margin: 20px auto 0 auto;
  }
.mandate-status__top-cooperation-section__clark-logo svg .clark-logo-fill {
    fill: #0439d7;
  }
.mandate-status__web-cta {
    padding: 0;
    margin: 30px 0;
  }
.mandate-status__line-break {
    display: none;
  }
@media only screen and (min-width: 730px) {
    .mandate-status__line-break {
      display: block;
    }
  }
/* END: modules/mandate/status */
/* BEGIN: modules/mandate/confirming */
/* override the insign styles */
.wizard-confirmation__signature--fullscreen .wizard-confirmation__signature__canvas-wrapper__reset {
    display: none;
  }
.mandate-confirmation {
    background-color: #f6f6f6;
    /* more details modal */
    /* the toggle links to open and close the accordion */
  }
@media only screen and (max-width: 729.98px) {
    .mandate-confirmation {
      min-height: 100vh;
    }
    .page-main--with-web-tab-bar .mandate-confirmation {
      min-height: calc(100vh - 45px - env(safe-area-inset-bottom));
    }
  }
.clark2 .mandate-confirmation {
    background-color: #f5f6fa;
  }
.mandate-confirmation__signature-modal {
    /* app version with crazy spinning! */
    /* new styles for the validate signature section */
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__signature-modal__cta {
      max-width: 200px;
    }
  }
.mandate-confirmation__signature-modal--app {
    transition: transform linear 0.2s;
    transform: rotate(0deg);
    background: none;
    opacity: 1;
    box-shadow: none;
  }
.mandate-confirmation__signature-modal--app .mandate-confirmation__signature-modal__reset {
    left: auto;
    right: 8px;
    top: 50px;
    z-index: 2;
    padding: 20px;
  }
.mandate-confirmation__signature-modal--app .mandate-confirmation__signature-modal__reset svg {
    width: 24px;
  }
.mandate-confirmation__signature-modal--app.ember-modal {
    left: calc(50vw - 50vh);
    top: calc(50vh - 50vw);
    width: 100vh;
    height: 100vw;
  }
.mandate-confirmation__signature-modal--app.ember-modal--visible {
    transform: rotate(-90deg);
  }
.mandate-confirmation__signature-modal--app .ember-modal__body {
    width: 100%;
    height: 100%;
    max-height: none;
    border-radius: 0;
    justify-content: space-between;
    background-color: #f6f6f6;
    top: 0;
  }
.clark2 .mandate-confirmation__signature-modal--app .ember-modal__body {
    background-color: #f5f6fa;
  }
.mandate-confirmation__signature-modal--app .ember-modal__body__back {
    position: absolute;
    z-index: 2;
    top: -10px;
    left: 0px;
    padding: 20px;
    color: #fff;
  }
.mandate-confirmation__signature-modal--app .ember-modal__body__header {
    /* importants are for breakpoint overrides */
    position: relative !important;
    border-radius: 0 !important;
    width: 100%;
    padding: 12px 0 10px 0;
    top: 0;
  }
.mandate-confirmation__signature-modal--app .ember-modal__body__content {
    z-index: 1;
    flex: 1 0 auto;
    margin: 15px;
    padding: 0 !important;
    border-radius: 4px 4px 0 0;
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.2);
    background-color: #fff;
    position: relative;
    overflow: hidden;
  }
.mandate-confirmation__signature-modal--app .ember-modal__body__content > div {
    width: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: auto;
  }
.mandate-confirmation__signature-modal--app .ember-modal__body__footer {
    flex: 0 1 auto;
  }
.mandate-confirmation__signature-modal--app .ember-modal__body__footer__cta {
    border-radius: 0;
  }
.mandate-confirmation__signature-modal__validate {
    opacity: 0;
    transition: opacity linear 0.2s;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    margin: -40px 0 0 0;
  }
.mandate-confirmation__signature-modal__validate--app {
    position: absolute;
    margin: 13px 0 0 0;
    width: 100%;
    top: 0;
    left: 0;
  }
.mandate-confirmation__signature-modal__validate--visible {
    opacity: 1;
  }
.mandate-confirmation__signature-modal__validate__icon, .mandate-confirmation__signature-modal__validate__icon svg {
    width: 22px;
    height: 22px;
    display: block;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__signature-modal__validate__icon, .mandate-confirmation__signature-modal__validate__icon svg {
      width: 26px;
      height: 26px;
    }
  }
.mandate-confirmation__signature-modal__validate__icon {
    margin-right: 10px;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__signature-modal__validate__icon {
      margin-right: 12px;
    }
  }
.mandate-confirmation__signature-modal__validate__information {
    color: #2b6cde;
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__signature-modal__validate__information {
      font-size: 19px;
      line-height: 27px;
    }
  }
.mandate-confirmation__signature-modal__reset {
    position: absolute;
    top: 40px;
    left: 20px;
  }
@media only screen and (min-width: 450px) {
    .mandate-confirmation__signature-modal__reset {
      top: 20px;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__signature-modal__reset {
      position: relative;
      top: auto;
      left: auto;
      margin-left: 40px;
    }
  }
.mandate-confirmation__signature-modal__reset svg {
    width: 18px;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__signature-modal__reset svg {
      width: 23px;
    }
  }
.mandate-confirmation__signature-modal .ember-modal__body__header {
    text-align: center;
    position: relative;
    border-radius: 0;
  }
@media only screen and (min-width: 450px) {
    .mandate-confirmation__signature-modal .ember-modal__body__header {
      border-radius: 4px;
    }
  }
.mandate-confirmation__signature-modal .ember-modal__body__close {
    top: 42px;
  }
@media only screen and (min-width: 450px) {
    .mandate-confirmation__signature-modal .ember-modal__body__close {
      top: 20px;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__signature-modal .ember-modal__body__close {
      top: 10px;
    }
  }
.mandate-confirmation__signature-modal .ember-modal__body__content {
    padding-top: 10px;
  }
@media only screen and (min-width: 450px) {
    .mandate-confirmation__signature-modal .ember-modal__body__content {
      padding-top: 50px;
    }
  }
.mandate-confirmation__signature-modal .ember-modal__body__footer {
    align-items: center;
  }
.mandate-confirmation__modal .ember-modal__body__content {
    padding-top: 0;
  }
.mandate-confirmation__modal__intro-detail {
    padding: 25px 0px;
    border-bottom: 1px solid #d6d6d6;
  }
.clark2 .mandate-confirmation__modal__intro-detail {
    border-bottom-color: #daddec;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__modal__intro-detail {
      padding: 25px 39px;
    }
  }
.mandate-confirmation__modal__intro-detail__item {
    font-size: 13px;
    line-height: 21px;
    font-weight: 300;
    color: #626262;
  }
.clark2 .mandate-confirmation__modal__intro-detail__item {
    color: #283e66;
  }
.mandate-confirmation__modal__title {
    font-weight: 400;
    color: #333;
    font-size: 15px;
    line-height: 21px;
    text-align: center;
    max-width: 555px;
    margin: 6px auto 20px auto;
  }
@media only screen and (min-width: 450px) {
    .mandate-confirmation__modal__title {
      font-size: 16px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__modal__title {
      font-size: 17px;
      line-height: 25px;
    }
  }
@media only screen and (min-width: 1000px) {
    .mandate-confirmation__modal__title {
      font-size: 18px;
      line-height: 26px;
    }
  }
.clark2 .mandate-confirmation__modal__title {
    color: #283e66;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__modal__title {
      margin: 19px auto 43px auto;
    }
  }
.mandate-confirmation__modal__details {
    padding: 25px 0px;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__modal__details {
      padding: 25px 39px;
    }
  }
.mandate-confirmation__modal__reasons {
    list-style-type: none;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    padding-bottom: 10px;
    border-bottom: 1px solid #d6d6d6;
  }
.clark2 .mandate-confirmation__modal__reasons {
    border-bottom-color: #daddec;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__modal__reasons {
      justify-content: space-between;
    }
  }
.mandate-confirmation__modal__reasons__reason {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    margin: 0 0 15px 0;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__modal__reasons__reason {
      margin: 0 0 27px 0;
      width: 45%;
    }
  }
.mandate-confirmation__modal__reasons__reason__icon {
    width: 18px;
    height: 18px;
    margin: 4px 15px 0 0;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__modal__reasons__reason__icon {
      width: 24px;
      height: 24px;
      margin: 5px 15px 0 0;
    }
  }
.mandate-confirmation__modal__reasons__reason__icon--no-margin-top {
    margin: 0 10px 0 0;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__modal__reasons__reason__icon--no-margin-top {
      margin: 0 10px 0 0;
    }
  }
.mandate-confirmation__modal__reasons__reason__icon svg {
    width: 18px;
    height: 18px;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__modal__reasons__reason__icon svg {
      width: 24px;
      height: 24px;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__modal__reasons__reason__text {
      padding-left: 10px;
    }
  }
.mandate-confirmation__modal__reasons__reason__text__title {
    color: #2b6cde;
    font-weight: 500;
    font-size: 16px;
    line-height: 23px;
    width: 100%;
    margin: 0 0 4px 0;
  }
@media only screen and (min-width: 450px) {
    .mandate-confirmation__modal__reasons__reason__text__title {
      font-size: 17px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__modal__reasons__reason__text__title {
      font-size: 21px;
      line-height: 30px;
    }
  }
@media only screen and (min-width: 1000px) {
    .mandate-confirmation__modal__reasons__reason__text__title {
      font-size: 22px;
      line-height: 32px;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__modal__reasons__reason__text__title {
      margin: 0 0 10px 0;
    }
  }
.mandate-confirmation__modal__reasons__reason__text__descr {
    width: 100%;
    color: #333;
    font-size: 14px;
    line-height: 22px;
  }
@media only screen and (min-width: 450px) {
    .mandate-confirmation__modal__reasons__reason__text__descr {
      font-size: 15px;
      line-height: 20px;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__modal__reasons__reason__text__descr {
      line-height: 20px;
    }
  }
@media only screen and (min-width: 1000px) {
    .mandate-confirmation__modal__reasons__reason__text__descr {
      font-size: 15px;
      line-height: 20px;
    }
  }
.clark2 .mandate-confirmation__modal__reasons__reason__text__descr {
    color: #283e66;
  }
.mandate-confirmation__modal__list-item-intro, .mandate-confirmation__modal__list-item-outro {
    margin-top: 20px;
    font-size: 13px;
    line-height: 21px;
    font-weight: 300;
    color: #626262;
  }
.clark2 .mandate-confirmation__modal__list-item-intro, .clark2 .mandate-confirmation__modal__list-item-outro {
    color: #283e66;
  }
.mandate-confirmation__modal__list-item-intro--first, .mandate-confirmation__modal__list-item-outro--first {
    margin-top: 0;
  }
.mandate-confirmation__modal__list-item {
    font-weight: 300;
    width: 97%;
    margin-left: 6%;
    color: #626262;
    font-size: 13px;
    line-height: 21px;
  }
.clark2 .mandate-confirmation__modal__list-item {
    color: #283e66;
  }
@media only screen and (min-width: 450px) {
    .mandate-confirmation__modal__list-item {
      margin-left: 3%;
    }
  }
.mandate-confirmation__trust {
    height: 100vh;
  }
.mandate-confirmation__trust .experiment-modal-container {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
.mandate-confirmation__trust .experiment-modal-container h2 {
    line-height: 32px;
    font-weight: bold;
    margin: -15px auto 10px;
    font-size: 18px;
    text-align: left;
    width: 100%;
    color: #17203d;
  }
.clark2 .mandate-confirmation__trust .experiment-modal-container h2 {
    color: #283e66;
    font-weight: 500;
  }
@media only screen and (min-width: 450px) {
    .mandate-confirmation__trust .experiment-modal-container h2 {
      font-size: 22px;
      text-align: center;
      margin-top: 0px;
    }
  }
.mandate-confirmation__trust .experiment-modal-container h2.text-centered {
    text-align: center;
  }
.mandate-confirmation__trust .experiment-modal-container p {
    line-height: 20px;
    color: #575970;
  }
.clark2 .mandate-confirmation__trust .experiment-modal-container p {
    color: #283e66;
  }
.mandate-confirmation__trust .experiment-modal-container p img {
    width: calc(100% + 40px);
    margin: 0 -20px;
    display: block;
  }
.mandate-confirmation__trust .experiment-modal-container .hero-text {
    text-align: left;
    width: 100%;
  }
@media only screen and (min-width: 450px) {
    .mandate-confirmation__trust .experiment-modal-container .hero-text {
      text-align: center;
      width: 560px;
    }
  }
.mandate-confirmation__trust .experiment-modal-container .hero-text.with-icon {
    margin-bottom: 30px;
    text-align: center;
  }
.mandate-confirmation__trust .experiment-modal-container .hero-text + p {
    height: 160px;
  }
.mandate-confirmation__trust .experiment-modal-container ul {
    display: flex;
    flex-direction: column;
    background: #f2f2f2;
    list-style: none;
    width: calc(100% + 40px);
    padding: 20px 10px 0;
  }
.clark2 .mandate-confirmation__trust .experiment-modal-container ul {
    background-color: #f5f6fa;
  }
@media only screen and (min-width: 450px) {
    .mandate-confirmation__trust .experiment-modal-container ul {
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: space-between;
      padding: 20px 50px 0;
      width: calc(100% + 100px);
    }
  }
.mandate-confirmation__trust .experiment-modal-container ul li {
    position: relative;
    width: 100%;
    margin-bottom: 20px;
    padding-left: 35px;
  }
@media only screen and (min-width: 450px) {
    .mandate-confirmation__trust .experiment-modal-container ul li {
      width: 49%;
    }
  }
.mandate-confirmation__trust .experiment-modal-container ul li i {
    width: 20px;
    height: 20px;
    position: absolute;
    top: 5px;
    left: 5px;
  }
@media only screen and (min-width: 450px) {
    .mandate-confirmation__trust .experiment-modal-container ul li i {
      left: 0px;
    }
  }
.mandate-confirmation__trust .experiment-modal-container ul li h5 {
    font-weight: bold;
    font-size: 14px;
    line-height: 18px;
    margin: 5px 0 0;
    color: #17203d;
  }
.clark2 .mandate-confirmation__trust .experiment-modal-container ul li h5 {
    color: #283e66;
    font-weight: 500;
  }
@media only screen and (min-width: 450px) {
    .mandate-confirmation__trust .experiment-modal-container ul li h5 {
      font-size: 16px;
      line-height: 22px;
      margin: 5px 0;
    }
  }
.mandate-confirmation__trust .experiment-modal-container ul li p {
    line-height: 20px;
  }
.mandate-confirmation__trust .experiment-modal-container .file-with-checkmark {
    margin-bottom: 25px;
  }
.mandate-confirmation__trust .experiment-modal-container .file-with-checkmark i {
    width: 80px;
    height: 70px;
    display: block;
  }
.mandate-confirmation__trust .ember-modal__body__close {
    top: 0px;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__trust .ember-modal__body__close {
      top: 12px;
    }
  }
.mandate-confirmation__trust footer.ember-modal__body__footer {
    height: auto;
    position: relative;
    box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.15);
  }
.mandate-confirmation__trust footer.ember-modal__body__footer button {
    box-shadow: none;
  }
.mandate-confirmation__process {
    /* app version of the process data */
  }
.mandate-confirmation__process .mandate_process_number {
    margin: 0 0 10px 0;
    min-width: 40px;
  }
.clark2 .mandate-confirmation__process__wrapper h3 {
    font-weight: 500;
  }
.mandate-confirmation__process--app {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 20px 10px 0 10px;
    flex-wrap: wrap;
  }
.mandate-confirmation__process--app .mandate_process_number {
    display: inline-block;
    margin: 0;
  }
.mandate-confirmation__process--app .mandate-confirmation__process__wrapper {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    margin: 0 0 20px 0;
  }
.mandate-confirmation__process--app .mandate-confirmation__intro {
    text-align: left;
    margin: 0;
  }
.mandate-confirmation__process--app .mandate-confirmation__toggle--more {
    display: inline-block;
  }
.mandate-confirmation__intro {
    font-size: 15px;
    line-height: 21px;
    max-width: 620px;
    margin: 0 auto 20px auto;
    color: #626262;
  }
@media only screen and (min-width: 450px) {
    .mandate-confirmation__intro {
      font-size: 16px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__intro {
      font-size: 17px;
      line-height: 25px;
    }
  }
@media only screen and (min-width: 1000px) {
    .mandate-confirmation__intro {
      font-size: 18px;
      line-height: 26px;
    }
  }
.clark2 .mandate-confirmation__intro {
    color: #283e66;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__intro {
      margin-bottom: 40px;
    }
  }
.mandate-confirmation__intro--app {
    text-align: left;
    margin: 10px 20px 10px 0;
  }
.mandate-confirmation__download-pdf {
    margin-bottom: 0;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__download-pdf {
      margin-bottom: 50px;
    }
  }
.mandate-confirmation__info-section {
    padding-top: 20px;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__info-section {
      padding: 36px 0;
    }
  }
.mandate-confirmation__checkmarks {
    list-style-type: none;
    margin: 0 0 22px 0;
    padding: 0 10px;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__checkmarks {
      margin: 0;
      padding: 0 40px 0 0;
    }
  }
.mandate-confirmation__checkmarks--varient {
    margin-bottom: 15px;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__checkmarks--varient {
      display: flex;
      flex-direction: row;
      align-items: center;
      padding: 0;
      margin: 0 0 20px 0;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__checkmarks--varient .mandate-confirmation__checkmarks__check {
      margin: 0 10px 0 0;
    }
    .mandate-confirmation__checkmarks--varient .mandate-confirmation__checkmarks__check:last-child {
      margin: 0;
    }
  }
.mandate-confirmation__checkmarks--varient .mandate-confirmation__checkmarks__check__text {
    font-size: 11px;
  }
@media only screen and (min-width: 375px) {
    .mandate-confirmation__checkmarks--varient .mandate-confirmation__checkmarks__check__text {
      font-size: 12px;
      line-height: 16px;
    }
  }
.mandate-confirmation__checkmarks__check {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    margin: 0 0 5px 0;
  }
.mandate-confirmation__checkmarks__check:last-child {
    margin-bottom: 0;
  }
.mandate-confirmation__checkmarks__check__icon {
    display: block;
    margin-right: 10px;
    width: 16px;
    height: 16px;
  }
.mandate-confirmation__checkmarks__check__icon svg {
    width: 16px;
    height: 18px;
  }
.mandate-confirmation__checkmarks__check__icon--tick {
    width: 8px;
    display: flex;
    align-items: flex-start;
  }
.mandate-confirmation__checkmarks__check__icon--tick svg {
    display: block;
    width: 8px;
    height: 16px;
  }
.mandate-confirmation__checkmarks__check__text {
    color: #787878;
    font-size: 12px;
    line-height: 16px;
    text-align: left;
  }
.clark2 .mandate-confirmation__checkmarks__check__text {
    color: #283e66;
  }
@media only screen and (min-width: 450px) {
    .mandate-confirmation__checkmarks__check__text {
      white-space: nowrap;
    }
  }
.mandate-confirmation__checkmarks__check__text em {
    font-style: normal;
    font-weight: 500;
  }
.mandate-confirmation__toggle {
    position: relative;
    display: block;
    text-align: center;
    color: #2b6cde;
    font-weight: 300;
    font-size: 14px;
    line-height: 22px;
    text-decoration: none;
    width: 100%;
    cursor: pointer;
  }
@media only screen and (min-width: 450px) {
    .mandate-confirmation__toggle {
      font-size: 15px;
      line-height: 20px;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__toggle {
      line-height: 20px;
    }
  }
@media only screen and (min-width: 1000px) {
    .mandate-confirmation__toggle {
      font-size: 15px;
      line-height: 20px;
    }
  }
.mandate-confirmation__toggle:after {
    transform-origin: center;
    width: 18px;
    height: 8px;
    transition: transform linear 0.2s;
    content: "";
    display: inline-block;
    margin-left: 5px;
    position: relative;
    top: -1px;
  }
.mandate-confirmation__toggle--grey-link {
    color: #787878;
    text-decoration: underline;
  }
.clark2 .mandate-confirmation__toggle--grey-link {
    color: #283e66;
    font-weight: 400;
  }
.mandate-confirmation__toggle--grey-link:after {
    display: none;
  }
.mandate-confirmation__toggle--more-active:after {
    transform: rotate(180deg);
  }
.mandate-confirmation__toggle--less {
    margin-top: 10px;
  }
.mandate-confirmation__toggle--less:after {
    transform: rotate(180deg);
  }
.mandate-confirmation__data-protection {
    font-weight: 400;
  }
.mandate-confirmation__ontro-app {
    padding: 0;
  }
.mandate-confirmation__mandate__signature__img {
    max-width: 100px;
    margin: 20px 0;
  }
.mandate-confirmation__instructions {
    width: 100%;
    border-top: 1px solid #d6d6d6;
    padding: 5px 0;
    color: #666;
    font-size: 14px;
    line-height: 22px;
    font-weight: 300;
    text-align: center;
    opacity: 0;
    transition: opacity linear 0.2s;
  }
@media only screen and (min-width: 450px) {
    .mandate-confirmation__instructions {
      font-size: 15px;
      line-height: 20px;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__instructions {
      line-height: 20px;
    }
  }
@media only screen and (min-width: 1000px) {
    .mandate-confirmation__instructions {
      font-size: 15px;
      line-height: 20px;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__instructions {
      padding: 8px 0 0 0;
    }
  }
.mandate-confirmation__instructions--loaded {
    opacity: 1;
  }
.mandate-confirmation__loader {
    position: absolute;
    top: calc(50% - 25px);
    margin: 0 auto;
    width: 50px;
    height: 50px;
  }
.mandate-confirmation__loader:before {
    content: "";
    display: block;
    padding-top: 100%;
  }
.mandate-confirmation__loader__circle {
    animation: rotate 2s linear infinite;
    height: 100%;
    transform-origin: center center;
    width: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
  }
.mandate-confirmation__loader__circle__path {
    stroke-dasharray: 1, 200;
    stroke-dashoffset: 0;
    animation: dash 1.5s ease-in-out infinite;
    stroke-linecap: round;
    stroke: #2b6cde;
  }
.mandate-confirmation__iframe {
    width: 100%;
    height: 140px;
    overflow: hidden;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__iframe {
      height: 250px;
    }
  }
.mandate-confirmation__bottom-ctas {
    background-color: rgba(255, 255, 255, 0.8);
    border-top: 1px solid #d6d6d6;
  }
.clark2 .mandate-confirmation__bottom-ctas {
    border-top-color: #daddec;
  }
@media only screen and (min-width: 450px) {
    .mandate-confirmation__bottom-ctas {
      display: flex;
      align-items: center;
      border-top: none;
      min-height: 124px;
      transition: min-height 0.6s ease-out;
    }
    .sticked .mandate-confirmation__bottom-ctas {
      min-height: 68px;
    }
    .mandate-confirmation__bottom-ctas .section__mobile-btn-wrapper {
      padding: 10px 0;
    }
  }
.mandate-confirmation__bottom-ctas--no-border {
    border: none;
  }
.mandate-confirmation__bottom-ctas--no-border .form-list {
    display: none;
  }
.mandate-confirmation .mandate-confirmation__custom-funnel-consent, .mandate-confirmation .mandate-confirmation__consent, .mandate-confirmation .mandate-confirmation__toc, .mandate-confirmation .mandate-confirmation__check-and-trust, .mandate-confirmation .mandate-confirmation__signature {
    margin: 20px 10px;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation .mandate-confirmation__custom-funnel-consent, .mandate-confirmation .mandate-confirmation__consent, .mandate-confirmation .mandate-confirmation__toc, .mandate-confirmation .mandate-confirmation__check-and-trust, .mandate-confirmation .mandate-confirmation__signature {
      max-width: 600px;
      margin-left: auto;
      margin-right: auto;
      margin-bottom: 36px;
    }
  }
.mandate-confirmation__signature {
    background-color: #fff;
    border-radius: 4px;
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.2);
    /* text about correcting signature */
  }
.mandate-confirmation__signature__animation {
    height: 113px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__signature__animation {
      height: 162px;
    }
  }
.mandate-confirmation__signature__animation__image {
    width: auto;
    max-width: 100%;
    height: 75px;
    /* a customers custom image preview needs to be a bit bigger */
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__signature__animation__image {
      height: 93px;
    }
  }
.mandate-confirmation__signature__animation__image--varient {
    height: 55px;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__signature__animation__image--varient {
      height: 93px;
    }
  }
.mandate-confirmation__signature__animation__image--customers {
    height: 100%;
    padding: 0 20px;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__signature__animation__image--customers {
      padding: 0 50px;
    }
  }
.mandate-confirmation__signature__correct {
    border-top: 1px solid #d6d6d6;
    padding: 5px 0 9px 0;
    color: #bbb;
    font-size: 12px;
    line-height: 16px;
    text-align: center;
    margin: 0 20px;
  }
@media only screen and (min-width: 450px) {
    .mandate-confirmation__signature__correct {
      font-size: 13px;
      line-height: 18px;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__signature__correct {
      font-size: 14px;
      line-height: 22px;
    }
  }
@media only screen and (min-width: 1000px) {
    .mandate-confirmation__signature__correct {
      font-size: 14px;
      line-height: 22px;
    }
  }
.clark2 .mandate-confirmation__signature__correct {
    border-top-color: #daddec;
    color: #283e66;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__signature__correct {
      padding: 10px 0 12px 0;
      margin: 0 50px;
    }
  }
.mandate-confirmation__signature__cta {
    background-color: #2b6cde;
    color: #fff;
    text-align: center;
    padding: 16px 30px;
    font-weight: 500;
    font-size: 14px;
    line-height: 22px;
    width: 100%;
    border: none;
    border-radius: 0 0 4px 4px;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__signature__cta {
      font-size: 16px;
      line-height: 26px;
    }
  }
.mandate-confirmation__check-and-trust {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
  }
.clark2 .mandate-confirmation__check-and-trust {
    border-top-color: #daddec;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__check-and-trust {
      justify-content: flex-start;
      flex-direction: column;
    }
  }
.mandate-confirmation__check-and-trust .trust-icons {
    flex-wrap: wrap;
    justify-content: space-around;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__check-and-trust .trust-icons {
      flex-grow: 1;
      justify-content: space-around;
    }
  }
.mandate-confirmation__check-and-trust .trust-icons__wrapper {
    display: flex;
    justify-content: center;
    flex-direction: column;
    width: 100%;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__check-and-trust .trust-icons__wrapper {
      flex-direction: row;
      padding: 0 15px;
    }
  }
.mandate-confirmation__check-and-trust .trust-icons__icon {
    margin: 0 10px 15px 10px;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__check-and-trust .trust-icons__icon {
      margin: 0 10px 21px 10px;
    }
  }
.mandate-confirmation__toc {
    font-weight: 300;
    color: #787878;
    padding: 0 20px;
    font-size: 11px;
    line-height: 16px;
  }
.clark2 .mandate-confirmation__toc {
    color: #283e66;
    font-weight: 400;
  }
.mandate-confirmation__toc__link {
    color: #787878;
    text-decoration: underline;
  }
.clark2 .mandate-confirmation__toc__link {
    color: #283e66;
  }
.mandate-confirmation__consent {
    border: 1px solid #d6d6d6;
    font-weight: 300;
    color: #787878;
    padding: 10px 20px;
    font-size: 11px;
    line-height: 16px;
  }
.clark2 .mandate-confirmation__consent {
    border-color: #daddec;
    color: #283e66;
    font-weight: 400;
  }
@media only screen and (min-width: 730px) {
    .mandate-confirmation__consent {
      padding: 10px;
    }
  }
.mandate-confirmation__consent__link {
    cursor: pointer;
    text-decoration: underline;
  }
.mandate-confirmation__custom-funnel-consent__title, .mandate-confirmation__custom-funnel-consent__checkbox {
    font-size: 16px;
    text-align: left;
    align-items: flex-start;
    margin-bottom: 10px;
  }
.mandate-confirmation__custom-funnel-consent__title {
    font-weight: 500;
  }
.mandate-confirmation__custom-funnel-consent a {
    color: #787878;
  }
.clark2 .mandate-confirmation__custom-funnel-consent a {
    color: #283e66;
  }
.body--mobile-ios.modal-open #confirming_step_two_buttons, .body--mobile-android.modal-open #confirming_step_two_buttons {
    z-index: 0;
  }
.body--mobile-ios .mandate-confirmation, .body--mobile-android .mandate-confirmation {
    padding-top: 0;
    padding-bottom: 48px;
  }
.body--mobile-ios .fixed-to-bottom, .body--mobile-android .fixed-to-bottom {
    position: fixed;
    bottom: 0;
    width: 100%;
  }
/* END: modules/mandate/confirming */
/* BEGIN: modules/mandate/mam */
.mandate-mam, .mam-form {
    display: block;
    height: calc(100% - 51px);
  }
@media only screen and (min-width: 450px) {
    .mandate-mam, .mam-form {
      height: calc(100% - 124px);
    }
  }
.mandate-mam__wrapper, .mam-form__wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
  }
.mandate-mam .mission, .mam-form .mission {
    margin-bottom: 2em;
  }
.mandate-mam .mam-card, .mam-form .mam-card {
    max-width: 360px;
    margin: 0 auto;
  }
.mandate-mam .toggle-modal, .mam-form .toggle-modal {
    margin-top: 2em;
    font-size: 15px;
    color: #2b6cde;
    letter-spacing: 0;
    line-height: 24.61px;
  }
@media only screen and (min-width: 450px) {
    .mandate-mam__web-cta, .mam-form__web-cta {
      padding: 20px 10px 0 0;
      min-height: 64px !important;
    }
  }
/* END: modules/mandate/mam */
/* BEGIN: modules/mandate/phone-verification */
.mandate-phone-verification {
    /* not using but keeping it here */
  }
.mandate-phone-verification + div {
    height: 88px;
  }
.mandate-phone-verification *:focus {
    outline: none;
  }
.mandate-phone-verification input[type=number]::-webkit-outer-spin-button, .mandate-phone-verification input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
.mandate-phone-verification input[type=number] {
    -moz-appearance: textfield;
  }
.mandate-phone-verification__process {
    /* app version of the process data */
  }
.mandate-phone-verification__process .mandate_process_number {
    margin: 0 0 10px 0;
    min-width: 40px;
  }
.mandate-phone-verification__process--app {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 20px 0 0 0;
    flex-wrap: wrap;
  }
.mandate-phone-verification__process--app .mandate_process_number {
    display: inline-block;
    margin: 0;
  }
.mandate-phone-verification__process--app .mandate-phone-verification__process__wrapper {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    margin: 0 0 20px 0;
  }
.mandate-phone-verification__process--app .mandate-phone-verification__intro {
    text-align: left;
    margin: 0;
  }
.mandate-phone-verification__process--app .mandate-phone-verification__toggle--more {
    display: inline-block;
  }
.mandate-phone-verification__intro {
    font-size: 15px;
    line-height: 21px;
    max-width: 620px;
    margin: 0 auto 20px auto;
    color: #626262;
  }
@media only screen and (min-width: 450px) {
    .mandate-phone-verification__intro {
      font-size: 16px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate-phone-verification__intro {
      font-size: 17px;
      line-height: 25px;
    }
  }
@media only screen and (min-width: 1000px) {
    .mandate-phone-verification__intro {
      font-size: 18px;
      line-height: 26px;
    }
  }
.clark2 .mandate-phone-verification__intro {
    color: #283e66;
  }
.mandate-phone-verification__intro--blue {
    color: #2b6cde;
  }
.clark2 .mandate-phone-verification__intro--blue {
    color: #2b6cde;
  }
.mandate-phone-verification__intro--app {
    text-align: left;
    margin: 10px 20px 10px 0;
  }
.mandate-phone-verification__title-with-svg {
    display: flex;
    justify-content: center;
    align-items: center;
  }
.mandate-phone-verification__title-with-svg__title {
    color: #17203d;
    font-weight: 500;
    font-size: 20px;
    line-height: 28px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
.clark2 .mandate-phone-verification__title-with-svg__title {
    color: #283e66;
  }
@media only screen and (min-width: 730px) {
    .mandate-phone-verification__title-with-svg__title {
      font-size: 28px;
      line-height: 38px;
    }
  }
.mandate-phone-verification__title-with-svg__tool-section {
    flex: 1 0 100%;
    margin-left: -10px;
    margin-right: -10px;
  }
.mandate-phone-verification__title-with-svg__tool-section--app {
    margin-left: -50px;
    margin-top: 9px;
  }
@media only screen and (min-width: 730px) {
    .mandate-phone-verification__title-with-svg__tool-section {
      margin-left: 0;
      margin-right: 0;
    }
  }
.mandate-phone-verification__title-with-svg__tooltip-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    margin-left: 8px;
    position: relative;
  }
.mandate-phone-verification__title-with-svg__tooltip-icon--app {
    display: inline-flex;
    vertical-align: -8px;
    margin-left: 0;
  }
.mandate-phone-verification__title-with-svg__tooltip-icon__top-arrow {
    display: block;
    position: absolute;
    z-index: 1;
    top: 33px;
    left: 9px;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 10px solid #f2f2f2;
    opacity: 0;
    visibility: hidden;
    transition: visibility 0s, opacity 0.2s linear;
  }
.clark2 .mandate-phone-verification__title-with-svg__tooltip-icon__top-arrow {
    border-bottom-color: #daddec;
  }
.mandate-phone-verification__title-with-svg__tooltip-icon__top-arrow--app {
    top: 30px;
  }
@media only screen and (min-width: 730px) {
    .mandate-phone-verification__title-with-svg__tooltip-icon__top-arrow {
      top: 42px;
      border-left: 12px solid transparent;
      border-right: 12px solid transparent;
      border-bottom: 16px solid #f2f2f2;
    }
    .clark2 .mandate-phone-verification__title-with-svg__tooltip-icon__top-arrow {
      border-bottom-color: #daddec;
    }
  }
.mandate-phone-verification__title-with-svg__tooltip-icon__top-arrow--toggled {
    opacity: 1;
    visibility: visible;
  }
.mandate-phone-verification__title-with-svg__tooltip-icon svg {
    height: 24px;
    width: 24px;
  }
.clark2 .mandate-phone-verification__title-with-svg__tooltip-icon svg path {
    fill: #daddec;
  }
.mandate-phone-verification__title-with-svg__tooltip-icon--toggeled path {
    fill: #2b6cde;
  }
.clark2 .mandate-phone-verification__title-with-svg__tooltip-icon--toggeled path {
    fill: #2b6cde;
  }
.mandate-phone-verification__tip-section {
    display: flex;
    flex-direction: column;
    max-width: 780px;
    background-color: #f2f2f2;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
    padding: 22px 24px 28px;
    margin-bottom: 12px;
    position: relative;
  }
.clark2 .mandate-phone-verification__tip-section {
    background-color: #daddec;
  }
.mandate-phone-verification__tip-section__heading {
    color: #17203d;
    font-weight: 500;
    font-size: 16px;
    font-weight: 500;
    line-height: 20px;
  }
.clark2 .mandate-phone-verification__tip-section__heading {
    color: #283e66;
  }
@media only screen and (min-width: 730px) {
    .mandate-phone-verification__tip-section__heading {
      font-size: 14px;
      line-height: 18px;
    }
  }
.mandate-phone-verification__tip-section__content {
    color: #575970;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
  }
.clark2 .mandate-phone-verification__tip-section__content {
    color: #283e66;
  }
.mandate-phone-verification__heading {
    color: #626262;
    font-weight: 300;
    margin-top: 20px;
  }
.clark2 .mandate-phone-verification__heading {
    color: #283e66;
    font-weight: 400;
  }
.mandate-phone-verification__heading--blue-text {
    color: #2b6cde;
  }
.clark2 .mandate-phone-verification__heading--blue-text {
    color: #2b6cde;
  }
.mandate-phone-verification__secure {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin: 21px 0;
  }
@media only screen and (min-width: 730px) {
    .mandate-phone-verification__secure {
      margin: 30px 0;
    }
  }
.mandate-phone-verification__secure__icon, .mandate-phone-verification__secure__icon svg {
    display: block;
    width: 12px;
    /* height: 17px; */
  }
@media only screen and (min-width: 730px) {
    .mandate-phone-verification__secure__icon, .mandate-phone-verification__secure__icon svg {
      width: 17px;
    }
  }
.mandate-phone-verification__secure__icon {
    margin: 0 6px 0 0;
  }
@media only screen and (min-width: 730px) {
    .mandate-phone-verification__secure__icon {
      margin-top: 1px;
    }
  }
.mandate-phone-verification__secure__icon svg .padlock-fill {
    fill: #2b6cde;
  }
.mandate-phone-verification__secure__icon svg .padlock-stroke {
    stroke: #2b6cde;
  }
.mandate-phone-verification__secure__text {
    display: block;
    font-weight: 300;
    font-size: 14px;
    line-height: 22px;
    color: #2b6cde;
    text-align: left;
  }
@media only screen and (min-width: 450px) {
    .mandate-phone-verification__secure__text {
      font-size: 15px;
      line-height: 20px;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate-phone-verification__secure__text {
      line-height: 20px;
    }
  }
@media only screen and (min-width: 1000px) {
    .mandate-phone-verification__secure__text {
      font-size: 15px;
      line-height: 20px;
    }
  }
.clark2 .mandate-phone-verification__secure__text {
    font-weight: 400;
  }
.mandate-phone-verification .phoneVerification {
    max-width: 360px;
    margin: 0 auto;
    overflow: visible;
  }
.mandate-phone-verification__verification-body {
    margin: 0;
  }
.mandate-phone-verification__verification-body__heading {
    font-weight: 300;
    color: #626262;
    font-size: 16px;
    margin: 55px 0 11px 0;
    text-align: left;
  }
.clark2 .mandate-phone-verification__verification-body__heading {
    color: #283e66;
    font-weight: 400;
  }
.mandate-phone-verification__verification-body__input-wrapper {
    display: flex;
    align-items: center;
  }
.clark2 .mandate-phone-verification__verification-body__input-wrapper:focus-within .mandate-phone-verification__verification-body__input-flag, .clark2 .mandate-phone-verification__verification-body__input-wrapper:focus-within .mandate-phone-verification__verification-body__input-code {
    border-color: #2b6cde;
  }
.mandate-phone-verification__verification-body__input-flag {
    border: 1px solid #adb0bb;
    padding: 13px 11px 12px 11px;
    height: 15px;
    box-sizing: content-box;
    border-radius: 4px;
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
  }
.clark2 .mandate-phone-verification__verification-body__input-flag {
    border-color: #daddec;
  }
.mandate-phone-verification__verification-body__input-flag svg {
    border-radius: 2px;
    width: 20px;
  }
.mandate-phone-verification__verification-body__input-code {
    border: 1px solid #adb0bb;
    padding: 9px 8px 6px 8px;
    height: 25px;
    border-left: 0;
    border-right: 0;
    display: flex;
    align-items: center;
    color: #606278;
    box-sizing: content-box;
    width: 35px;
  }
.clark2 .mandate-phone-verification__verification-body__input-code {
    border-color: #daddec;
    color: #283e66;
  }
.mandate-phone-verification__verification-body__input {
    -webkit-appearance: none;
    min-height: 25px;
    padding: 9px 8px 6px 0px;
    border-left: 0;
    border-bottom-left-radius: 0 !important;
    border-top-left-radius: 0 !important;
    box-sizing: content-box;
  }
.mandate-phone-verification__token-body {
    margin-bottom: 18px;
  }
.mandate-phone-verification__errors {
    text-align: center;
    font-size: 14px;
    color: #fd5740;
    font-weight: 300;
    margin: 0;
  }
.clark2 .mandate-phone-verification__errors {
    color: #d51e4f;
    font-weight: 400;
  }
.mandate-phone-verification__digit-input {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    list-style: none;
  }
.mandate-phone-verification__phone-num-input {
    height: 50px !important;
    width: 100%;
    border: 1px solid #bbb;
    border-radius: 3px;
  }
.clark2 .mandate-phone-verification__phone-num-input {
    border-color: #daddec;
  }
.mandate-phone-verification__token-text {
    text-align: center;
    color: #626262;
    font-size: 14px;
    font-weight: 300;
  }
.clark2 .mandate-phone-verification__token-text {
    color: #283e66;
    font-weight: 400;
  }
.mandate-phone-verification__token-text__href {
    color: #2b6cde;
    text-decoration: underline;
    cursor: pointer;
  }
.mandate-phone-verification__token-text__href-text__animation-text {
    transition: transform 200ms;
    transform: translate3D(0, 20%, 0);
  }
.mandate-phone-verification__token-text__code-underway {
    color: var(--clark-color-text-information);
    font-weight: 500;
    text-align: center;
    visibility: hidden;
    opacity: 0;
  }
.mandate-phone-verification__token-text__code-underway__code-underway-display {
    visibility: visible;
    opacity: 1;
    transition: visibility 0s linear 0s, opacity 200ms, transform 200ms;
    transform: translate3D(0, -20%, 0);
    margin-top: 10px;
  }
.mandate-phone-verification .trust-icons {
    justify-content: space-around;
    max-width: 320px;
    margin: 0 auto;
  }
.mandate-phone-verification__last-box {
    position: relative;
  }
.mandate-phone-verification__check-mark {
    opacity: 0;
    position: absolute;
    transition: opacity linear 0.5s;
    top: -7px;
    right: -5px;
  }
.mandate-phone-verification__check-mark .tick-icon {
    fill: #2b6cde;
    stroke: #2b6cde;
  }
.mandate-phone-verification__check-mark--visible {
    opacity: 1;
  }
.mandate-phone-verification__subtitle-experiment {
    display: inline-block;
    text-align: left;
    margin: 10px 20px;
  }
/* END: modules/mandate/phone-verification */
/* BEGIN: modules/mandate/mandate-iban */
.mandate-iban__container {
    display: flex;
    justify-content: space-around;
    flex-direction: column;
    align-items: center;
  }
.mandate-iban__container__top-heading {
    text-align: center;
    font-weight: 300;
    font-size: 18px;
    line-height: 24px;
    color: #333;
  }
@media only screen and (min-width: 450px) {
    .mandate-iban__container__top-heading {
      font-size: 19px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate-iban__container__top-heading {
      font-size: 24px;
      line-height: 29px;
    }
  }
@media only screen and (min-width: 1000px) {
    .mandate-iban__container__top-heading {
      font-size: 26px;
      line-height: 39px;
    }
  }
.clark2 .mandate-iban__container__top-heading {
    color: #283e66;
    font-weight: 500;
  }
.mandate-iban__container__explanation-text {
    text-align: center;
    font-weight: 300;
    font-size: 15px;
    line-height: 21px;
    color: #626262;
    margin-top: 30px;
    margin-bottom: 22px;
  }
@media only screen and (min-width: 450px) {
    .mandate-iban__container__explanation-text {
      font-size: 16px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate-iban__container__explanation-text {
      font-size: 17px;
      line-height: 25px;
    }
  }
@media only screen and (min-width: 1000px) {
    .mandate-iban__container__explanation-text {
      font-size: 18px;
      line-height: 26px;
    }
  }
.clark2 .mandate-iban__container__explanation-text {
    color: #283e66;
  }
@media only screen and (min-width: 730px) {
    .mandate-iban__container__explanation-text {
      margin-top: 60px;
      margin-bottom: 44px;
    }
  }
.mandate-iban__container__bottom-text {
    text-align: center;
    font-weight: 300;
    font-size: 10px;
    line-height: 13px;
    color: #bbb;
    margin-top: 22px;
  }
@media only screen and (min-width: 450px) {
    .mandate-iban__container__bottom-text {
      font-size: 12px;
      line-height: 16px;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate-iban__container__bottom-text {
      font-size: 13px;
      line-height: 18px;
    }
  }
@media only screen and (min-width: 1000px) {
    .mandate-iban__container__bottom-text {
      font-size: 14px;
      line-height: 22px;
    }
  }
.clark2 .mandate-iban__container__bottom-text {
    color: #283e66;
  }
@media only screen and (min-width: 730px) {
    .mandate-iban__container__bottom-text {
      margin-top: 44px;
    }
  }
/* END: modules/mandate/mandate-iban */
/* BEGIN: modules/mandate/finished */
.body--mobile-ios .mandate-finished, .body--mobile-android .mandate-finished {
    flex: 1;
  }
.mandate-finished {
    background-color: #f6f6f6;
  }
.clark2 .mandate-finished {
    background-color: #f5f6fa;
  }
.mandate-finished__wrapper {
    display: flex;
    flex-direction: column;
    height: 100%;
  }
.mandate-finished__web-cta {
    padding: 0;
    margin: 30px auto;
  }
.mandate-finished__cta-wrapper {
    width: 100%;
  }
.mandate-finished__title {
    text-align: center;
    margin-bottom: 28px;
    width: 100%;
  }
@media only screen and (min-width: 730px) {
    .mandate-finished__title {
      margin-bottom: 58px;
    }
  }
.mandate-finished__subtitle {
    margin: 0 0 11px 0;
    font-weight: 500;
    font-size: 15px;
    line-height: 21px;
  }
@media only screen and (min-width: 450px) {
    .mandate-finished__subtitle {
      font-size: 16px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate-finished__subtitle {
      font-size: 17px;
      line-height: 25px;
    }
  }
@media only screen and (min-width: 1000px) {
    .mandate-finished__subtitle {
      font-size: 18px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate-finished__subtitle {
      margin: 0 0 22px 0;
    }
  }
.mandate-finished__container {
    background-color: #fff;
    padding: 26px 32px;
    border-radius: 3px;
    box-shadow: rgba(0, 0, 0, 0.15) 0 1px 1px 0;
    margin: 0 auto;
    max-width: 639px;
  }
@media only screen and (min-width: 730px) {
    .mandate-finished__container {
      padding: 32px 56px;
      margin: 0 auto 58px auto;
    }
  }
.mandate-finished__items {
    list-style-type: none;
    margin: 0;
    padding: 0;
  }
.mandate-finished__items__item {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
  }
.mandate-finished__items__item:not(:last-child) {
    margin: 0 0 12px 0;
  }
@media only screen and (min-width: 730px) {
    .mandate-finished__items__item:not(:last-child) {
      margin: 0 0 18px 0;
    }
  }
.mandate-finished__items__item__icon {
    display: block;
    margin: 1px 10px 0 0;
  }
@media only screen and (min-width: 730px) {
    .mandate-finished__items__item__icon {
      margin: 3px 16px 0 0;
    }
  }
.mandate-finished__items__item__icon svg {
    width: 15px;
    height: 15px;
  }
@media only screen and (min-width: 730px) {
    .mandate-finished__items__item__icon svg {
      width: 20px;
      height: 20px;
    }
  }
.mandate-finished__items__item__content {
    display: block;
    margin: 0;
    font-weight: 300;
    font-size: 14px;
    line-height: 22px;
    color: #626262;
  }
@media only screen and (min-width: 450px) {
    .mandate-finished__items__item__content {
      font-size: 15px;
      line-height: 20px;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate-finished__items__item__content {
      line-height: 20px;
    }
  }
@media only screen and (min-width: 1000px) {
    .mandate-finished__items__item__content {
      font-size: 15px;
      line-height: 20px;
    }
  }
.clark2 .mandate-finished__items__item__content {
    color: #283e66;
  }
/* END: modules/mandate/finished */
/* BEGIN: modules/mandate/process-number */
.mandate_process_number {
    font-size: 16px;
    line-height: 23px;
    font-weight: 400;
    color: #bbb;
    letter-spacing: 0;
  }
@media only screen and (min-width: 450px) {
    .mandate_process_number {
      font-size: 17px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .mandate_process_number {
      font-size: 21px;
      line-height: 30px;
    }
  }
@media only screen and (min-width: 1000px) {
    .mandate_process_number {
      font-size: 22px;
      line-height: 32px;
    }
  }
.clark2 .mandate_process_number {
    color: #283e66;
  }
.mandate_process_number__amount {
    color: #2b6cde;
    display: inline-block;
    font-weight: 500;
  }
/* END: modules/mandate/process-number */
/* BEGIN: modules/mandate/register-lead */
.register-lead {
    max-width: 450px;
    margin: 0 auto;
  }
.register-lead__process .mandate_process_number {
    margin: 0 0 10px 0;
    min-width: 40px;
    text-align: center;
  }
@media only screen and (min-width: 730px) {
    .register-lead__process {
      margin-bottom: 30px;
    }
  }
.register-lead__process--app {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 20px 0 0 0;
    flex-wrap: wrap;
  }
.register-lead__process--app .mandate_process_number {
    display: inline-block;
    margin: 0;
    text-align: left;
  }
.register-lead__process--app .register-lead__process__wrapper {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    margin: 0 0 20px 0;
  }
.register-lead__process--app .register-lead__intro {
    text-align: left;
    margin: 0;
  }
.register-lead__process--app .register-lead__toggle--more {
    display: inline-block;
  }
.register-lead__intro {
    text-align: left;
    color: #666666;
    font-size: 15px;
    line-height: 21px;
    margin: 0;
  }
@media only screen and (min-width: 450px) {
    .register-lead__intro {
      font-size: 16px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 730px) {
    .register-lead__intro {
      font-size: 17px;
      line-height: 25px;
    }
  }
@media only screen and (min-width: 1000px) {
    .register-lead__intro {
      font-size: 18px;
      line-height: 26px;
    }
  }
.clark2 .register-lead__intro {
    color: #283e66;
  }
.register-lead__input-wrapper {
    margin: 0 0 19px 0;
  }
.register-lead__input-hint {
    position: relative;
    width: 100%;
    /* when the content of the input is valid, the icons are blue */
  }
.register-lead__input-hint--valid .register-lead__input-hint__icon .email-icon, .register-lead__input-hint--valid .register-lead__input-hint__icon .padlock-fill {
    fill: #2b6cde;
  }
.register-lead__input-hint--valid .register-lead__input-hint__icon .padlock-stroke {
    stroke: #2b6cde;
  }
.register-lead__input-hint__icon {
    position: absolute;
    top: 0;
    left: 0;
    border-right: 1px solid #bbbbbb;
    height: 47px;
    width: 46px;
    display: flex;
    justify-content: center;
    align-items: center;
    /* when the user is typing in the input, the icon is dark grey */
  }
.clark2 .register-lead__input-hint__icon {
    top: 1px;
    bottom: 1px;
    height: 45px;
    border-right-color: #daddec;
  }
.register-lead__input-hint__icon .email-icon, .register-lead__input-hint__icon .padlock-fill {
    fill: #d4d0d0;
  }
.clark2 .register-lead__input-hint__icon .email-icon, .clark2 .register-lead__input-hint__icon .padlock-fill {
    fill: #daddec;
  }
.register-lead__input-hint__icon .padlock-stroke {
    stroke: #d4d0d0;
  }
.clark2 .register-lead__input-hint__icon .padlock-stroke {
    stroke: #daddec;
  }
.register-lead__input, .register-lead__label {
    color: #666666;
  }
.clark2 .register-lead__input, .clark2 .register-lead__label {
    color: #283e66;
  }
.register-lead__input {
    font-weight: 400;
    border: 1px solid #bbbbbb;
    padding-left: 53px !important;
  }
.clark2 .register-lead__input {
    border-color: #daddec;
  }
.register-lead__label {
    font-weight: 300;
    /* hide on very small devices so can see both inputs */
    display: none;
  }
@media only screen and (min-width: 450px) {
    .register-lead__label {
      display: block;
    }
  }

/* END: modules/mandate/register-lead */

/* BEGIN: modules/manager/demandcheck-reminder */
.demancheck_reminder__top_image {
    display: flex;
    justify-content: center;
    margin-top: 22.5px;
  }
.demancheck_reminder__middle {
    margin-top: -30px;
    max-height: 490px;
    height: 290px;
  }
@media only screen and (min-width: 730px) {
    .demancheck_reminder__middle {
      padding: 45px;
    }
  }
.demancheck_reminder__middle__heading {
    font-weight: 400;
    font-size: 22px;
    line-height: 1.18;
    text-align: center;
    color: #17203d;
  }
.clark2 .demancheck_reminder__middle__heading {
    color: #283e66;
  }
.demancheck_reminder__middle__content {
    font-weight: 400;
    font-size: 16px;
    line-height: 1.5;
    text-align: center;
    color: #575970;
  }
.clark2 .demancheck_reminder__middle__content {
    color: #283e66;
  }
/* END: modules/manager/demandcheck-reminder */
/* BEGIN: modules/manager/empty-status */
.manager__empty-status {
    background-color: #f6f6f6;
    height: calc(100% - 56px);
    overflow: initial;
    padding-top: 0px;
  }
@media only screen and (min-width: 450px) {
    .manager__empty-status {
      height: calc(100% - 124px);
    }
  }
@media only screen and (min-width: 450px) {
    .manager__empty-status {
      background-color: #fff;
    }
  }
.manager__empty-status--app {
    height: auto;
    min-height: 100%;
  }
.manager__empty-status--app .manager__empty-status__right {
    padding-top: 30px;
  }
.manager__empty-status__header {
    background: #17203d;
    padding: 20px 15px;
    max-height: 500px;
    box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.1), 0 1px 1px 0 rgba(0, 0, 0, 0.15);
  }
@media only screen and (min-width: 1000px) {
    .manager__empty-status__header {
      padding: 40px 15px;
    }
  }
.manager__empty-status__icons {
    flex-direction: row;
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin: auto;
    max-width: 1200px;
  }
@media only screen and (min-width: 730px) {
    .manager__empty-status__icons {
      width: 92%;
    }
  }
.manager__empty-status__icon {
    text-align: center;
    flex: 1;
    padding: 0 5px;
  }
.manager__empty-status__icon svg {
    margin-top: 27px;
    width: 102px;
    height: 102px;
  }
@media only screen and (min-width: 730px) {
    .manager__empty-status__icon svg {
      width: 102px;
      height: 102px;
      margin-top: 40px;
    }
  }
@media only screen and (min-width: 1000px) {
    .manager__empty-status__icon svg {
      width: 172px;
      height: 172px;
      margin-top: 55px;
    }
  }
.manager__empty-status__icon__text {
    font-weight: 500;
    font-size: 18px;
    text-align: center;
    line-height: 22px;
    margin: auto;
    padding-top: 15px;
    color: #fff;
    max-width: 600px;
  }
@media only screen and (min-width: 730px) {
    .manager__empty-status__icon__text {
      font-size: 45px;
      line-height: 51px;
    }
  }
.manager__empty-status__body {
    text-align: center;
    margin: 25px auto 10px;
  }
@media only screen and (min-width: 730px) {
    .manager__empty-status__body {
      margin: 40px auto 20px;
    }
  }
.manager__empty-status__body__content {
    font-weight: 300;
    font-size: 16px;
    line-height: 22px;
    padding: 0 20px;
    color: #717582;
    text-align: center;
    max-width: 510px;
    margin: 0 auto;
  }
@media only screen and (min-width: 730px) {
    .manager__empty-status__body__content {
      padding: 0;
    }
  }
/* END: modules/manager/empty-status */
/* BEGIN: modules/manager/notification-item */
.manager__notification--important {
    background-color: #d0021b;
    border: none;
  }
.manager__notification--important.section {
    padding: 8px 12px;
  }
@media only screen and (min-width: 1200px) {
    .manager__notification--important {
      padding: 25px 0;
    }
  }
.manager__notification--important .section__wrapper {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0;
  }
@media only screen and (min-width: 1200px) {
    .manager__notification--important .section__wrapper {
      padding: 0 30px;
    }
  }
.manager__notification--important .manager__notification__text {
    color: #fff;
    max-width: none;
  }
@media only screen and (min-width: 1200px) {
    .manager__notification--important .manager__notification__text {
      text-align: left;
      font-size: 15px;
      line-height: 21px;
    }
  }
@media only screen and (min-width: 1200px) and (min-width: 450px) {
    .manager__notification--important .manager__notification__text {
      font-size: 16px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 1200px) and (min-width: 730px) {
    .manager__notification--important .manager__notification__text {
      font-size: 17px;
      line-height: 25px;
    }
  }
@media only screen and (min-width: 1200px) and (min-width: 1000px) {
    .manager__notification--important .manager__notification__text {
      font-size: 18px;
      line-height: 26px;
    }
  }
.manager__notification--important .manager__notification__text a {
    color: #fff;
  }
.manager__notification__text {
    max-width: 520px;
    margin: 0 auto;
    font-size: 12px;
    line-height: 16px;
    color: #787878;
  }
@media only screen and (min-width: 450px) {
    .manager__notification__text {
      font-size: 13px;
      line-height: 18px;
    }
  }
@media only screen and (min-width: 730px) {
    .manager__notification__text {
      font-size: 14px;
      line-height: 22px;
    }
  }
@media only screen and (min-width: 1000px) {
    .manager__notification__text {
      font-size: 14px;
      line-height: 22px;
    }
  }
@media only screen and (min-width: 1200px) {
    .manager__notification__text {
      font-size: 16px;
      line-height: 23px;
    }
  }
@media only screen and (min-width: 1200px) and (min-width: 450px) {
    .manager__notification__text {
      font-size: 17px;
      line-height: 26px;
    }
  }
@media only screen and (min-width: 1200px) and (min-width: 730px) {
    .manager__notification__text {
      font-size: 21px;
      line-height: 30px;
    }
  }
@media only screen and (min-width: 1200px) and (min-width: 1000px) {
    .manager__notification__text {
      font-size: 22px;
      line-height: 32px;
    }
  }
/* END: modules/manager/notification-item */



/* styles for @clarksource/client/components/shell/settings-route/toggle/button.css */
/* stylelint-disable color-function-notation, custom-property-pattern, no-descending-specificity */
._checkbox_1v11rk {
  --base: var(--toggle-button--base, 1.8em);
  --aspect-ratio: var(--toggle-button--aspect-ratio, 1.6);
  --roundness: var(--toggle-button--roundness, 1);
  --transition: var(
    --toggle-button--transition,
    var(--time-transition-fast) ease-in-out
  );
  --color-backdrop-off: var(--color-pale-navy);
  --color-backdrop-on: var(--color-lawn-green);
  --color-backdrop-off-disabled: rgba(218 221 236 / 40%);
  --color-backdrop-on-disabled: rgba(24 193 84 / 40%);
  --color-knob: var(--color-white);
  --height: var(--toggle-button--height, var(--base));
  --width: var(
    --toggle-button--width,
    calc(var(--height) * var(--aspect-ratio))
  );

  /* Implicitly assumes that `--width >= --height`. */
  --radius: calc(var(--height) / 2 * var(--roundness));
  --knob-ratio: var(--toggle-button--knob-ratio, 0.75);
  --size: calc(var(--base) * var(--knob-ratio));
  --knob-width: var(--toggle-button--knob-width, var(--size));
  --knob-height: var(--toggle-button--knob-height, var(--size));

  /* Implicitly assumes that `--width >= --height >= --knob-height`. */
  --knob-gap: calc((var(--height) - var(--knob-height)) / 2);
  --knob-radius: calc(var(--knob-height) / 2 * var(--roundness));
  --knob-position: 0;

  -webkit-appearance: none;

          appearance: none;
  border: 0;
  border-radius: calc(1.8em / 2 * 1);
  border-radius: var(--radius);
  box-shadow: 0 0 2px 4px rgba(4 57 215 / 0%);
  display: inline-block;
  height: 1.8em;
  height: var(--height);
  position: relative;

  /* Prevent grey flashing box on tap. */
  -webkit-tap-highlight-color: rgb(0 0 0 / 0%);
  transition: var(--transition) background;
  width: calc(1.8em * 1.6);
  width: var(--width);
}

._checkbox_1v11rk:not(:checked):not(:disabled):not([aria-disabled="true"]):not([aria-busy="true"]) {
  background: var(--color-backdrop-off);
}

._checkbox_1v11rk:not(:checked):disabled,
._checkbox_1v11rk:not(:checked)[aria-disabled="true"],
._checkbox_1v11rk:not(:checked)[aria-busy="true"] {
  background: var(--color-backdrop-off-disabled);
}

._checkbox_1v11rk:checked:not(:disabled):not([aria-disabled="true"]):not([aria-busy="true"]) {
  background: var(--color-backdrop-on);
}

._checkbox_1v11rk:checked:disabled,
._checkbox_1v11rk:checked[aria-disabled="true"],
._checkbox_1v11rk:checked[aria-busy="true"] {
  background: var(--color-backdrop-on-disabled);
}

._checkbox_1v11rk:disabled,
._checkbox_1v11rk[aria-disabled="true"] {
  cursor: not-allowed;
}

._checkbox_1v11rk[aria-busy="true"] {
  cursor: wait;
}

._checkbox_1v11rk:focus {
  box-shadow: 0 0 2px 2px rgba(4 57 215 / 20%);

  /* Fallback for browsers without `:focus-visible` */
  outline: 2px solid #fff;
}

._checkbox_1v11rk:focus:not(:focus-visible) {
  box-shadow: 0 0 0 2px rgba(4 57 215 / 20%);

  /* Pointer-activated focus. */
  outline: 0;
}

._checkbox_1v11rk:focus-visible {
  box-shadow: 0 0 0 4px rgba(4 57 215 / 100%);

  /* Keyboard-activated focus. */
  outline: 2px solid #fff;
}

._checkbox_1v11rk:focus-visible:disabled,
._checkbox_1v11rk:focus-visible[aria-disabled="true"],
._checkbox_1v11rk:focus-visible[aria-busy="true"] {
  box-shadow: 0 0 0 4px rgba(4 57 215 / 40%);
}

._checkbox_1v11rk::after {
  background: var(--color-knob);
  border-radius: var(--knob-radius);
  content: "";
  display: block;
  height: var(--knob-height);
  left: var(--knob-gap);
  position: absolute;
  top: var(--knob-gap);
  transform: translateX(
    calc(
      (var(--width) - var(--knob-width) - var(--knob-gap) * 2) *
        var(--knob-position)
    )
  );
  transition:
    var(--transition) box-shadow,
    var(--transition) transform,
    var(--transition) width;
  width: var(--knob-width);
}

._checkbox_1v11rk:indeterminate {
  --knob-width: calc(var(--knob-gap) * 2);
  --knob-position: 0.5;

  /* height: calc(var(--knob-height) * 0.5); */
}

._checkbox_1v11rk:not(:disabled):not([aria-disabled="true"])::after {
  box-shadow:
    0 3px 8px rgb(0 0 0 / 15%),
    0 3px 1px rgb(0 0 0 / 6%);
}

._checkbox_1v11rk:checked {
  --knob-position: 1;
}

/* styles for @clarksource/client/components/cookie-banner/tracking-option.css */
._cookie-banner-tracking_r6rjkk {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

._header_r6rjkk {
  font-weight: bold;
  margin-bottom: 1rem;
  padding: 0.5rem 0;
}

._description_r6rjkk {
  font-size: 0.9rem;
  line-height: 1.2rem;
  margin-bottom: 1rem;
}

._inner_r6rjkk {
  color: var(--grey-1);
  display: flex;
  flex: 1 0 0;
  flex-direction: column;
  width: 100%;
}

._toggle-button-container_r6rjkk {
  margin-right: 2px;
}

._toggle-button_r6rjkk {
}

/* styles for @clarksource/client/components/manager/category-details.css */
/* stylelint-disable selector-class-pattern */
._category_eamcx0 {
  align-items: center;
  display: flex;
  flex-direction: column;
  height: auto !important;
  justify-content: center;
  min-height: 100%;
  padding: 0;
}

@media only screen and (min-width: 1000px) {
  ._category_eamcx0 {
    border-bottom: none;
  }
}

._wrapper_eamcx0 {
  padding: 0;
}

._section_eamcx0 {
  width: 100%;
}

._section--grey_eamcx0 {
  background: #f6f6f6;
}

._section--dark_eamcx0 {
  background: #17203d;
}

._section--dark--spaced_eamcx0 {
  border-bottom: 40px #f6f6f6 solid;
}

._inset-section_eamcx0 {
  align-items: center;
  display: flex;
  flex-direction: column;
}

._inset-section_eamcx0 > *:last-child {
  margin-bottom: 40px;
}

._related-recommendations_eamcx0 {
  width: calc(100% - 2 * 20px);
}

@media only screen and (min-width: 730px) {
  ._related-recommendations_eamcx0 {
    max-width: 770px;
    width: 100%;
  }
}

/* styles for @clarksource/client/components/manager/category-details/reasons.css */
/* stylelint-disable no-descending-specificity, selector-class-pattern */
._section_1x3s4f {
}

.clark2 ._section_1x3s4f {
  background-color: white;
  border-top: 1px solid var(--divider);
}

._wrapper_1x3s4f {
}

._reasons_1x3s4f {
  display: flex;
  flex-flow: column nowrap;
  padding: 23px 20px 60px;
}

@media only screen and (min-width: 730px) {
  ._reasons_1x3s4f {
    flex-direction: row;
    padding: 53px 20px 60px;
  }
}

._why_1x3s4f {
  display: flex;
  flex-direction: column;
  margin: 0 0 37px;
}

@media only screen and (min-width: 730px) {
  ._why_1x3s4f {
    margin: 0 144px 0 0;
    max-width: 335px;
  }
}

._why__title_1x3s4f {
  color: #17203d;
  font-size: 22px;
  line-height: 26px;
  margin: 0 0 11px;
}

.clark2 ._why__title_1x3s4f {
  color: var(--typo-dark);
}

@media only screen and (min-width: 730px) {
  ._why__title_1x3s4f {
    margin: 0 0 13px;
  }
}

._why__subtitle_1x3s4f {
  color: #17203d;
  font-size: 14px;
  font-weight: 500;
  line-height: 17px;
  margin: 0 0 5px;
}

.clark2 ._why__subtitle_1x3s4f {
  color: var(--typo-dark);
}

._why__content_1x3s4f {
  color: #17203d;
  font-size: 14px;
  line-height: 21px;
  margin: 0;
}

.clark2 ._why__content_1x3s4f {
  color: var(--typo-dark);
}

._guarantee_1x3s4f {
  display: flex;
  flex-direction: column;
}

._guarantee__title_1x3s4f {
  color: #17203d;
  font-size: 22px;
  line-height: 26px;
  margin: 0 0 13px;
}

.clark2 ._guarantee__title_1x3s4f {
  color: var(--typo-dark);
}

._guarantee__items_1x3s4f {
  list-style-type: none;
  margin: 0 0 20px;
  padding: 0;
}

._guarantee__items__item_1x3s4f {
  align-items: center;
  display: flex;
  flex-direction: row;
  margin: 0 0 12px;
  padding: 0;
}

._guarantee__items__item__icon_1x3s4f {
  align-items: center;
  background-color: #2b6cde;
  border-radius: 100%;
  display: flex;
  height: 16px;
  justify-content: center;
  margin: 0 15px 0 0;
  min-width: 16px;
  width: 16px;
}

._guarantee__items__item__icon_1x3s4f svg {
  display: block;
  height: 5px;
  width: 6px;
}

._guarantee__items__item__icon_1x3s4f svg .tick-stroke {
  stroke: white;
}

.clark2 ._guarantee__items__item__icon_1x3s4f svg path {
  stroke: white;
}

._guarantee__items__item__content_1x3s4f {
  display: flex;
  flex-direction: column;
}

._guarantee__items__item__content__title_1x3s4f,
._guarantee__items__item__content__text_1x3s4f {
  color: #17203d;
  font-size: 14px;
  line-height: 18px;
  margin: 0;
}

.clark2 ._guarantee__items__item__content__title_1x3s4f,
.clark2 ._guarantee__items__item__content__text_1x3s4f {
  color: var(--typo-dark);
}

._guarantee__items__item__content__title_1x3s4f {
  font-weight: 500;
}

._guarantee__trust_1x3s4f {
  display: block;
  margin: 0 auto;
}

@media only screen and (max-width: 449.98px) {
  ._guarantee__trust_1x3s4f {
    max-width: 250px;
  }
}

/* styles for @clarksource/client/components/manager/category-details/robo.css */
/* stylelint-disable selector-class-pattern */

._section_1b3f86 {
}

.clark2 ._section_1b3f86 {
  background-color: white;
  border-bottom-color: white;
}

._wrapper_1b3f86 {
}

._robo_1b3f86 {
}

.clark2 ._robo_1b3f86 {
  background-color: white;
}

._stats-accordion_1b3f86 {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

._stats-accordion__header_1b3f86 {
  align-items: center;
  display: flex;
}

._stats_1b3f86 {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 0 0 20px;
}

@media only screen and (min-width: 730px) {
  ._stats_1b3f86 {
    flex-direction: row;
    padding: 0 0 40px;
  }
}

._stats_1b3f86 .qs-stats__accordion {
  margin: 13px 0 10px;
}

@media only screen and (min-width: 730px) {
  ._stats_1b3f86 .qs-stats__accordion {
    margin: 13px 0 0;
  }
}

._stats_1b3f86 .qs-stats__features {
  width: 100%;
}

@media only screen and (min-width: 730px) {
  ._stats_1b3f86 .qs-stats__features {
    padding: 20px 0 0;
    width: 45%;
  }
}

._stats_1b3f86 .qs-stats__features__subtitle {
  font-size: 14px;
  font-weight: 500;
  line-height: 17px;
}

._stats_1b3f86 .qs-stats__features__subtitle--gkv {
  font-weight: 400;
  padding-top: 10px;
}

._stats_1b3f86 .qs-stats__features__feature__header {
  cursor: auto;
  padding: 7px 0;
}

@media only screen and (min-width: 730px) {
  ._stats_1b3f86 .qs-stats__features__feature__header {
    padding: 10px 0;
  }
}

._stats_1b3f86 .qs-stats__features__feature__header__title {
  font-size: 14px;
  line-height: 17px;
}

._stats_1b3f86 .qs-stats__features__feature__header__icon {
  margin: 0 10px 3px 0;
}

._stats_1b3f86 .qs-stats__features__feature__header__icon,
._stats_1b3f86 .qs-stats__features__feature__header__icon svg {
  height: 8px;
  width: 8px;
}

._stats_1b3f86 .qs-stats__robo__figures-wrapper {
  width: 100%;
}

@media only screen and (min-width: 730px) {
  ._stats_1b3f86 .qs-stats__robo__figures-wrapper {
    padding: 20px 0 0 20px;
    width: 45%;
  }
}

._stats_1b3f86 .qs-stats__robo__figures__col {
  font-size: 14px;
  line-height: 17px;
}

._stats_1b3f86 .qs-stats__robo__figures__col--figure {
  font-size: 32px;
  line-height: 38px;
}

@media only screen and (min-width: 730px) {
  ._stats_1b3f86 .qs-stats__robo__figures__col--figure {
    font-size: 36px;
    line-height: 43px;
  }
}

._stats_1b3f86 .qs-stats__robo__figures--top-row {
  padding-top: 10px;
}

@media only screen and (min-width: 730px) {
  ._stats_1b3f86 .qs-stats__robo__figures--top-row {
    padding-top: 20px;
  }
}

._stats_1b3f86 .qs-stats__robo__figures--bottom-row {
  padding-bottom: 10px;
}

@media only screen and (min-width: 730px) {
  ._stats_1b3f86 .qs-stats__robo__figures--bottom-row {
    padding-bottom: 20px;
  }
}

@media only screen and (min-width: 730px) {
  ._stats_1b3f86 .qs-stats__robo__figures--gkv {
    padding-top: 0;
  }
}

/* styles for @clarksource/client/components/mandate/mandate-profiling.css */
/* stylelint-disable selector-class-pattern */
@media only screen and (min-width: 768px) {
  ._wizard-profiling_6nd4i3 {
    background-color: #f5f6fa;
  }
}

._wizard-profiling-section-wrapper_6nd4i3 {
  padding-left: 24px;
  padding-right: 24px;
}

@media only screen and (min-width: 768px) {
  ._wizard-profiling-section-wrapper_6nd4i3 {
    background-color: #f5f6fa;
    padding: 32px 56px;
  }
}

/* NOTE: Loosely aligned with Ui::Panel implementation */
._form-panel_6nd4i3 {
  background-color: white;
  padding: 0;
}

@media only screen and (min-width: 768px) {
  ._form-panel_6nd4i3 {
    border-radius: 4px;
    box-shadow: 0 2px 2px 0 rgb(173 182 217 / 50%);
    padding: 32px 48px;
  }
}

._floater__button_6nd4i3 {
  background: #f5f6fa;
}

._floater-container_6nd4i3 {
  position: relative;
  z-index: 20;
}

._mandate__doc-wrapper_6nd4i3 {
  margin-top: 40px;
  padding: 8px 0;
}

._form-cell_6nd4i3 {
  display: flex;
  flex-grow: 0;
}

._form-cell_6nd4i3:not(:last-of-type) {
  margin-bottom: 16px;
}

._field-group_6nd4i3 ._form-cell_6nd4i3 {
  flex-grow: 1;
  margin-bottom: 0;
}

._field-group_6nd4i3 ._form-cell_6nd4i3:not(:last-of-type) {
  margin-right: 16px;
}

._form-cell_6nd4i3._custom-cell-width_6nd4i3 {
  flex-grow: 0;
}

._form-cell_6nd4i3._left-align-text_6nd4i3 {
  text-align: left;
}

._form-cell_6nd4i3 > * {
  width: 100%;
}

._form-layout_6nd4i3 {
  display: flex;
  flex-direction: column;
  width: 100%;
}

._field-group_6nd4i3 {
  display: flex;
  margin-bottom: 16px;
  width: 100%;
}

._form-block_6nd4i3 {
  display: flex;
  flex-direction: column;
  width: 100%;
}

._form-block_6nd4i3:not(:last-of-type) {
  margin-bottom: 16px;
}

._form-block_6nd4i3._direction-horizontal_6nd4i3 {
  flex-direction: row;
}

._form-block_6nd4i3._direction-horizontal_6nd4i3 > ._form-block_6nd4i3 {
  flex: 1;
  margin-bottom: 0;
  width: auto;
}

._form-block_6nd4i3._direction-horizontal_6nd4i3 > ._form-block_6nd4i3:not(:last-of-type) {
  margin-right: 28px;
}

._form-filling-help_6nd4i3 {
  font-size: var(--size-font-body-1-base-desktop);
  font-weight: var(--font-weight-body-1-base-desktop);
  text-align: left;
}

/* Based on global .form-list__item__input */
._field-birthdate_6nd4i3 {
  min-height: 47px !important;
  padding: 10px 20px !important;
}

.clark2 ._mandate-id_6nd4i3:disabled {
  background-color: #f5f6fa;
  color: var(--dark-4);
}

._delete-mandate-container_6nd4i3 {
  align-items: center;
  display: flex;
  flex-direction: column;
  margin-top: 48px;
}

._delete-mandate-link_6nd4i3 {
  color: var(--color-cardinal) !important;
}

._delete-mandate-link_6nd4i3:focus,
._delete-mandate-link_6nd4i3:active,
._delete-mandate-link_6nd4i3:hover {
  color: #c00f40 !important;
}

._mandate-doc-wrapper_6nd4i3 {
  display: flex;
  justify-content: center;
  padding-top: 16px;
}

._mandate-doc-link_6nd4i3 {
  display: flex;
}

/* styles for @clarksource/client/components/mandate/mam-profile.css */
/* stylelint-disable selector-class-pattern */
._form-panel_1rgpxj {
  border-top: 1px solid #b0bacc;
  padding-top: 24px;
}

@media only screen and (min-width: 768px) {
  ._form-panel_1rgpxj {
    border-top: none;
    padding-top: 32px;
  }
}

._wizard-profiling-section-wrapper_1rgpxj {
  padding-top: 30px;
}

@media only screen and (min-width: 450px) {
  ._wizard-profiling-section-wrapper_1rgpxj {
    flex-direction: row;
    margin-bottom: 0;
  }
}

@media only screen and (min-width: 768px) {
  ._wizard-profiling-section-wrapper_1rgpxj {
    padding-top: 0;
  }
}

._form-panel--center_1rgpxj {
  align-items: center;
  display: flex;
  justify-content: center;
  text-align: center;
}

._mam__wrapper_1rgpxj {
  align-items: stretch;
  display: flex;
  flex-direction: column;
  font-size: 14px;
  justify-content: space-between;
  margin-bottom: 16px;
}

@media only screen and (min-width: 450px) {
  ._mam__wrapper_1rgpxj {
    flex-direction: row;
    margin-bottom: 0;
  }
}

._mam__account_number_1rgpxj {
  align-items: flex-start;
  display: flex;
  flex: 1;
  flex-direction: column;
  font-size: 14px;
  justify-content: flex-start;
  margin-bottom: 16px;
}

@media only screen and (min-width: 450px) {
  ._mam__account_number_1rgpxj {
    margin-bottom: 0;
    margin-right: 30px;
  }
}

@media only screen and (min-width: 730px) {
  ._mam__account_number_1rgpxj {
    margin-right: 48px;
  }
}

/* Hacky IE11 fix */

._mam__account_number_1rgpxj > p {
  max-width: 100%;
}

.clark2 ._mam__input_1rgpxj:disabled {
  color: var(--dark-4);
  width: 100%;
}

._mam__points_wrapper_1rgpxj {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: flex-start;
}

._mam__field_title_1rgpxj {
  align-self: flex-start;
  border-bottom: 1px solid var(--divider);
  margin-bottom: 12px;
  padding-bottom: 8px;
  width: 100%;
}

._points__summary_1rgpxj {
  list-style: none;
}

._points__summary_1rgpxj > li {
  border-bottom: 1px solid var(--divider);
  display: flex;
  justify-content: space-between;
  padding: 12px 0;
}

._mam__section-title_1rgpxj {
  margin-bottom: 18px;
  margin-top: 0;
}

/* styles for @clarksource/client/components/mandate/payback-profile.css */
/* stylelint-disable selector-class-pattern */
._form-panel_lhxdff {
  border-top: 1px solid #b0bacc;
  padding-top: 24px;
}

@media only screen and (min-width: 768px) {
  ._form-panel_lhxdff {
    border-top: none;
    padding-top: 32px;
  }
}

._wizard-profiling-section-wrapper_lhxdff {
  padding-top: 30px;
}

@media only screen and (min-width: 450px) {
  ._wizard-profiling-section-wrapper_lhxdff {
    flex-direction: row;
    margin-bottom: 0;
  }
}

@media only screen and (min-width: 768px) {
  ._wizard-profiling-section-wrapper_lhxdff {
    padding-top: 0;
  }
}

._form-panel--center_lhxdff {
  align-items: center;
  display: flex;
  justify-content: center;
  text-align: center;
}

._payback__wrapper_lhxdff {
  align-items: stretch;
  display: flex;
  flex-direction: column;
  font-size: 14px;
  justify-content: space-between;
  margin-bottom: 16px;
}

@media only screen and (min-width: 450px) {
  ._payback__wrapper_lhxdff {
    flex-direction: row;
    margin-bottom: 0;
  }
}

._payback__account_number_lhxdff {
  align-items: flex-start;
  display: flex;
  flex: 1;
  flex-direction: column;
  font-size: 14px;
  justify-content: flex-start;
  margin-bottom: 16px;
}

@media only screen and (min-width: 450px) {
  ._payback__account_number_lhxdff {
    margin-bottom: 0;
    margin-right: 30px;
  }
}

@media only screen and (min-width: 730px) {
  ._payback__account_number_lhxdff {
    margin-right: 48px;
  }
}

/* Hacky IE11 fix */

._payback__account_number_lhxdff > p {
  max-width: 100%;
}

._payback__input_lhxdff {
  background: var(--c-grey-light);
  border: 0;
  border-radius: 4px;
  color: var(--dark-4);
  margin: 12px 0;
  padding: 8px;
  width: 100%;
}

._payback__info_lhxdff {
  color: var(--grey-1);
  font-size: 12px;
}

._payback__points_wrapper_lhxdff {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: flex-start;
}

._payback__points_title_lhxdff {
  align-self: flex-start;
  border-bottom: 1px solid var(--divider);
  margin-bottom: 12px;
  padding-bottom: 8px;
  width: 100%;
}

._points__summary_lhxdff {
  list-style: none;
  padding-left: 16px;
}

._points__summary_lhxdff > li {
  border-bottom: 1px solid var(--divider);
  display: flex;
  justify-content: space-between;
  padding: 12px 0;
}

._payback__account_link_lhxdff h4 {
  margin: 8px 0;
}

._payback__account_link_lhxdff p {
  margin-bottom: 12px;
}

._payback__money_icon_lhxdff {
  color: var(--brand-primary);
  height: 52px;
  width: 52px;
}

._payback__link_lhxdff {
  align-items: center;
  color: var(--brand-primary);
  display: flex;
  font-weight: 500;
  justify-content: center;
  text-decoration: none;
}

._payback__link_lhxdff svg {
  height: 20px;
  margin-right: 5px;
  width: 20px;
}

._payback__section-title_lhxdff {
  margin-bottom: 18px;
  margin-top: 0;
}

/* styles for @clarksource/client/components/api-error-page.css */
._container_1kja2z {
  display: flex;
  flex-direction: column;
  height: 100vh;
  margin: 0 !important;
  max-height: 100% !important;
  max-width: 100% !important;
  width: 100%;

  /* the maximum value of z-index */
  z-index: 2147483647;
}

._error-page_1kja2z {
  margin-left: 150px;
  margin-top: 200px;
}

._error-intro_1kja2z {
  display: block;
  margin-top: 15px;
}

._error-details_1kja2z {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-bottom: 10px;
  margin-top: 40px;
}

._icon_1kja2z {
  margin: 0 !important;
}

._title_1kja2z {
  font-size: 36px;
  font-weight: 600;
  line-height: 48px;
  margin-top: 10px;
}

._text-default_1kja2z {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

._error-description_1kja2z {
  max-width: 600px;
}

@media only screen and (max-width: 729.98px) {
  ._error-page_1kja2z {
    margin-left: 0;
    margin-top: 100px;
    padding: 40px;
  }
}

/* styles for @clarksource/client/components/app-footer/mini-footer.css */
._mini-footer_1wblex {
  align-items: center;
  background-color: #fff;
  border-top: 1px solid var(--c-grey-light);
  bottom: 0;
  display: flex;
  font-size: 14px;
  height: 60px;
  justify-content: center;
  width: 100%;
}

._mini-footer_1wblex ._link_1wblex {
  color: var(--grey-5);
  padding: 15px;
  text-decoration: none;
}

._sticked_1wblex {
  position: fixed;
}

main.page-main.footer-sticky {
  padding-bottom: 60px;
}

/* styles for @clarksource/client/components/app-header/mobile-menu.css */
/* stylelint-disable no-descending-specificity, selector-class-pattern */

/* breakpoints */

._base-action_1wcjfq {
  cursor: pointer;
  text-decoration: none;
}

._action_1wcjfq {
}

._decent-action_1wcjfq {
  color: var(--header-decent-link-fg);
}

/**
  Main Header Menu
*/
._header_1wcjfq {
  background-color: #fff;
  border-top: 1px solid var(--header-border);
  bottom: 0;
  justify-content: center;
  left: 0;
  min-height: 45px;
  padding-bottom: env(safe-area-inset-bottom);
  position: fixed;
  top: auto !important;
  z-index: 101;
}

/* Iphone X */
@media only screen and (max-device-width: 375px) and (max-device-height: 812px) {
  ._header--iphoneX-adjustments-on_1wcjfq {
    height: calc(45px + env(safe-area-inset-bottom));
    padding-bottom: env(safe-area-inset-bottom);
  }
}

@media only screen and (min-width: 768px) {
  ._header_1wcjfq {
    height: 80px;
    position: static;
    top: 0 !important;
  }
}

._sections_1wcjfq,
._actions_1wcjfq {
  display: flex;
}

/**
   * Header Builder to be redone, see:
   * https://clarkteam.atlassian.net/browse/JCLARK-53394
   *
   * This will also tackel the !important usage
   */

@media only screen and (min-width: 768px) {
  ._sections_1wcjfq,
  ._actions_1wcjfq {
    align-items: center;
  }
}

._sections-link_1wcjfq,
._actions-link_1wcjfq {
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center;
  outline: none;
  text-align: center;
  transition: 0.3s ease color;
  width: 100%;
}

._sections_1wcjfq ._active-link_1wcjfq,
._actions_1wcjfq ._active-link_1wcjfq {
  color: var(--color-assure);
}

._sections_1wcjfq ._menu-item_1wcjfq,
._actions_1wcjfq ._menu-item_1wcjfq {
  flex: 1 1 0px;
}

@media only screen and (min-width: 768px) {
  ._sections_1wcjfq ._menu-item_1wcjfq,
  ._actions_1wcjfq ._menu-item_1wcjfq {
    align-items: center;
  }
}

._sections_1wcjfq ._menu-item_1wcjfq ._disabled_1wcjfq,
._actions_1wcjfq ._menu-item_1wcjfq ._disabled_1wcjfq {
  color: var(--grey-3);
  pointer-events: none;
}

._sections_1wcjfq ._menu-item_1wcjfq ._inactive-link_1wcjfq,
._actions_1wcjfq ._menu-item_1wcjfq ._inactive-link_1wcjfq {
  color: var(--header-link-fg);
}

._sections_1wcjfq {
  flex-grow: 2;
  justify-content: space-around;
}

._sections-link_1wcjfq {
  align-items: center;
  padding-top: 6px;
}

@media only screen and (min-width: 768px) {
  ._sections-link_1wcjfq {
    margin: 0 24px;
  }

  ._sections-link_1wcjfq ._icon_1wcjfq {
    display: none;
  }
}

@media only screen and (min-width: 1200px) {
  ._sections-link_1wcjfq {
    margin: 0 28px;
  }
}

@media only screen and (min-width: 768px) {
  ._sections_1wcjfq {
    flex-grow: unset;
    justify-content: flex-end;
  }
}

._actions_1wcjfq {
  flex-grow: 1;
}

@media only screen and (min-width: 768px) {
  ._actions_1wcjfq {
    flex-grow: unset;
    margin-left: 100px !important;
  }
}

._sections-label_1wcjfq,
._actions-label_1wcjfq {
  font-size: 10px;
  line-height: 16px;
  white-space: nowrap;
}

@media only screen and (min-width: 768px) {
  ._sections-label_1wcjfq {
    font-size: 16px;
    line-height: 24px;
    margin-top: 0;
  }
}

@media only screen and (min-width: 768px) {
  ._actions-label_1wcjfq {
    display: none;
  }
}

._icon_1wcjfq {
  cursor: pointer;
  display: block;
  height: 20px;
  position: relative;
}

._icon-contract_1wcjfq svg {
  height: 100%;
  width: 100%;
}

@media only screen and (min-width: 768px) {
  ._icon_1wcjfq {
    height: 26px;
    margin-top: 0;
  }
}

._messenger_1wcjfq {
  position: relative;
}

@media only screen and (min-width: 768px) {
  ._messenger_1wcjfq::after {
    background-color: var(--header-border);
    content: "";
    display: block;
    height: 24px;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
  }
}

._messenger_1wcjfq::before {
  z-index: -1;
}

._messenger_1wcjfq._has-messages_1wcjfq {
  padding-right: 12px;
}

/* BURDER MENU */

/* Focus state for desktop */
@media only screen and (min-width: 768px) {
  .body--web ._sections-link_1wcjfq,
  .body--web ._messenger_1wcjfq {
    position: relative;
  }

  .body--web ._sections-link_1wcjfq:focus,
  .body--web ._messenger_1wcjfq:focus {
    outline: none;
  }

  .body--web ._sections-link_1wcjfq:focus::before,
  .body--web ._messenger_1wcjfq:focus::before {
    opacity: 0.1;
  }

  .body--web ._sections-link_1wcjfq::before,
  .body--web ._messenger_1wcjfq::before {
    background-color: var(--header-active-fg);
    border-radius: 4px;
    content: "";
    opacity: 0;
    position: absolute;
    transition: 0.3s ease opacity;
  }

  .body--web ._sections-link_1wcjfq::before {
    inset: -1px -12px;
  }

  .body--web ._messenger_1wcjfq::before {
    inset: -2px 4px -1px;
  }
}

._demand-check-active-link_1wcjfq {
  color: var(--clark-color-text-selected);
}

/* styles for @clarksource/client/components/app-header/notification-badge.css */
._notification-badge_15y6wa {
  background-color: var(--color-red-umbrella);
  border: 2px solid var(--color-white);
  border-radius: 100%;
  cursor: pointer;
  height: 14px;
  position: absolute;
  right: 7px;
  top: -7px;
  width: 14px;
}

@media only screen and (max-width: 729.98px) {
  ._notification-badge_15y6wa {
    height: 12px;
    right: -6px;
    top: -6px;
    width: 12px;
  }
}

/* styles for @clarksource/client/components/app-header/old-header.css */
/* stylelint-disable no-descending-specificity, selector-class-pattern */
._base-action_1c6fij {
  cursor: pointer;
  text-decoration: none;
}

._action_1c6fij {
  color: var(--header-link-fg);
}

._decent-action_1c6fij {
  color: var(--header-decent-link-fg);
}

/**
  Main Header Menu
*/
._header_1c6fij {
  background-color: #fff;
  border-bottom: 1px solid var(--header-border);
  height: 80px;
  justify-content: center;
  z-index: 101;
}

._content_1c6fij {
  display: flex;
  justify-content: space-between;
  width: 100%;
}

@media only screen and (min-width: 1200px) {
  ._content_1c6fij {
    width: 1200px;
  }
}

._brand_1c6fij {
  align-items: center;
  display: flex;
  flex-grow: 1;
  margin-left: 10px;
  text-decoration: none;
}

._brand_1c6fij:focus {
  outline: none;
}

._logo_1c6fij {
  height: 24px;
  width: auto;
}

._logo_1c6fij .clark-logo-fill {
  fill: var(--header-active-fg);
}

._icons-section_1c6fij {
  gap: var(--s-2);
}

._sections_1c6fij,
._actions_1c6fij {
  align-items: center;
  display: flex;
}

._sections_1c6fij {
  display: flex !important;
  flex-grow: 2;
  justify-content: flex-end;
}

._sections-link_1c6fij {
  font-size: 16px;
  line-height: 24px;
  margin: 0 24px;
  outline: none;
  transition: 0.3s ease color;
  white-space: nowrap;
}

._sections-link_1c6fij:hover {
  color: var(--header-active-fg);
}

@media only screen and (min-width: 1200px) {
  ._sections-link_1c6fij {
    margin: 0 28px;
  }
}

._actions_1c6fij {
  margin-left: 32px !important;
}

@media only screen and (min-width: 1200px) {
  ._actions_1c6fij {
    margin-left: 100px;
  }
}

._has-unread_1c6fij::before,
._has-dot_1c6fij::before {
  background-color: #d51e50;
  border: 2px solid #fff;
  border-radius: 50%;
  content: " ";
  display: block;
  height: 12px;
  left: 12px;
  position: absolute;
  top: -1px;
  width: 12px;
  z-index: 3;
}

._has-dot_1c6fij::before {
  border: none;
  height: 8px;
  left: 6px;
  top: 12px;
  width: 8px;
}

._disabled_1c6fij {
  color: var(--grey-3);
  pointer-events: none;
}

._icon_1c6fij {
  cursor: pointer;
  display: block;
  height: 24px;
  padding: 0 var(--s-4);
  position: relative;
}

._icon-messenger_1c6fij path {
  fill: var(--header-link-fg);
}

._disabled_1c6fij ._icon-messenger_1c6fij path {
  fill: var(--grey-3);
}

._icon-profile_1c6fij path,
._icon-profile_1c6fij use,
._icon-profile_1c6fij g,
._icon-profile_1c6fij rect {
  stroke: var(--header-link-fg);
}

._icon-burger_1c6fij path,
._icon-burger_1c6fij use,
._icon-burger_1c6fij g,
._icon-burger_1c6fij rect {
  fill: var(--header-link-fg);
  stroke: var(--header-link-fg);
}

._icon-close_1c6fij path,
._icon-close_1c6fij use,
._icon-close_1c6fij g,
._icon-close_1c6fij rect {
  fill: var(--header-link-fg);
  stroke: var(--header-link-fg);
}

._messenger_1c6fij {
  height: 24px;
  position: relative;
}

._messenger_1c6fij::before {
  inset: -2px 4px -1px;
  z-index: -1;
}

._notification-centre_1c6fij {
  cursor: pointer;
  margin: 2px 2px 0 0;
  position: relative;
}

._active_1c6fij ._icon-messenger_1c6fij path,
._active_1c6fij ._icon-messenger_1c6fij use,
._active_1c6fij ._icon-messenger_1c6fij g,
._active_1c6fij ._icon-messenger_1c6fij rect {
  fill: var(--header-active-fg);
}

._active_1c6fij ._icon-profile_1c6fij path,
._active_1c6fij ._icon-profile_1c6fij use,
._active_1c6fij ._icon-profile_1c6fij g,
._active_1c6fij ._icon-profile_1c6fij rect {
  stroke: var(--header-active-fg);
}

._active_1c6fij ._icon-burger_1c6fij path,
._active_1c6fij ._icon-burger_1c6fij use,
._active_1c6fij ._icon-burger_1c6fij g,
._active_1c6fij ._icon-burger_1c6fij rect {
  fill: var(--header-active-fg);
  stroke: var(--header-active-fg);
}

._active_1c6fij ._icon-close_1c6fij path,
._active_1c6fij ._icon-close_1c6fij use,
._active_1c6fij ._icon-close_1c6fij g,
._active_1c6fij ._icon-close_1c6fij rect {
  fill: var(--header-active-fg);
  stroke: var(--header-active-fg);
}

/**
  Profile Menu
*/
._content_1c6fij ._profile_1c6fij {
  display: flex;
}

._profile_1c6fij:active,
._profile_1c6fij:focus,
._profile_1c6fij:hover {
  opacity: 1;
}

._profile_1c6fij:focus,
._profile__label_1c6fij:focus {
  outline: none;
}

._profile-menu_1c6fij {
  box-shadow: 0 8px 32px 0 rgb(0 0 0 / 8%);
  min-width: 275px;
}

._profile-menu-user_1c6fij {
  background-color: #fff;
  padding: 8px 16px;
}

._profile-menu-user-link_1c6fij {
  color: var(--header-link-fg);
  display: inline-block;
  font-size: 16px;
  line-height: 24px;
  padding: 8px 0;
}

._profile-menu-user-link__wrapper_1c6fij {
  display: block;
}

._profile-menu-legal_1c6fij {
  background-color: var(--header-decent-bg);
  border-top: 1px solid var(--header-border);
  box-sizing: content-box;
  display: flex;
  flex-flow: wrap;
  min-width: 270px;
  padding: 8px 16px;
}

._profile-menu-legal-link_1c6fij {
  color: var(--header-decent-link-fg);
  display: inline-block;
  font-size: 12px;
  line-height: 18px;
}

._profile-menu-legal-link__wrapper_1c6fij {
  display: block;
  width: 50%;
}

/* Focus state for desktop */
._sections-link_1c6fij,
._profile-menu-legal-link_1c6fij {
  position: relative;
}

._sections-link_1c6fij:focus,
._profile-menu-legal-link_1c6fij:focus {
  outline: none;
}

._sections-link_1c6fij:focus::before,
._profile-menu-legal-link_1c6fij:focus::before {
  opacity: 0.1;
}

._sections-link_1c6fij::before,
._profile-menu-legal-link_1c6fij::before {
  background-color: var(--header-active-fg);
  border-radius: 4px;
  content: "";
  opacity: 0;
  position: absolute;
  transition: 0.3s ease opacity;
}

._sections-link_1c6fij::before {
  inset: -1px -12px;
}

._profile-menu-legal-link_1c6fij::before {
  inset: 0 -8px;
}

._legal-links-wrapper_1c6fij {
  align-items: center;
  display: flex;
}

._login-link_1c6fij {
  align-self: center;
  color: var(--color-assure);
  font-size: calc(var(--ls-1) + var(--s-4));
  font-weight: 500;
  margin: var(--s-3) var(--s-1) 0 var(--s-1);
  text-decoration: none;
}

._icon-button_1c6fij::before {
  background-color: #0439d7;
  border: none;
}

._icon-button_1c6fij:focus::before {
  opacity: 0.1 !important;
}

._profile-icon_1c6fij {
  color: var(--color-summer-night);
  transition: var(--time-transition-base) ease color;
}

._profile-icon_1c6fij._active_1c6fij {
  color: var(--color-assure);
}

._popover-container_1c6fij {
  overflow-y: scroll;
}

._profile-button_1c6fij {
  display: flex !important;
}

._app-referral_1c6fij {
  background-color: #f2f7ff !important;
  border: 2px solid #f2f7ff !important;
  border-radius: 26px !important;
  color: var(--color-assure) !important;
  font-size: 16px !important;
  height: unset !important;
  padding: 12px 24px !important;
}

@media only screen and (max-width: 729.98px) {
  ._app-referral_1c6fij {
    min-height: 40px !important;
    padding: 8px 0 !important;
  }
}

._app-referral_1c6fij:active {
  background-color: #bbd0fc !important;
  border-color: #bbd0fc !important;
}

._app-referral_1c6fij:hover {
  background-color: #d6e3fe !important;
  border-color: #d6e3fe !important;
}

._app-referral-icon_1c6fij {
  margin-right: 4px;
}

._pill-label_1c6fij {
  background: var(--color-safety-blue);
  border-radius: 100px;
  color: white;
  font-size: 14px;
  font-weight: 500;
  left: auto;
  line-height: 22px;
  margin-left: var(--size-spacing-base);
  padding: 4px 12px;
}

/* styles for @clarksource/client/components/article-screen.css */
._article-screen_1s7i9b {
  display: block;
  width: 100%;
}

._iframe_1s7i9b._override_1s7i9b {
  display: flex;
  height: calc(100vh - var(--title-bar-offset) - 80px);
  margin-bottom: 80px;
}

._button-container_1s7i9b {
  background-color: var(--color-white);
  border-top: 1px solid var(--color-mystic-gray);
  bottom: 0;
  display: flex;
  height: 80px;
  justify-content: center;
  left: 0;
  padding: var(--contracts-s0);
  position: fixed;
  right: 0;
}

._cta_1s7i9b._override_1s7i9b {
  flex-grow: 1;
}

@media only screen and (min-width: 730px) {
  ._iframe_1s7i9b._override_1s7i9b {
    height: calc(100vh - var(--web-header-offset) - 80px);
  }

  ._cta_1s7i9b._override_1s7i9b {
    flex-grow: 0;
  }
}

/* styles for @clarksource/client/components/button-floater.css */
._button-content_18dpgs ._button_18dpgs + ._button_18dpgs {
  margin-left: 16px;
}

@media only screen and (max-width: 729.98px) {
  ._button-content_18dpgs ._button_18dpgs:not(:only-of-type) {
    max-width: 250px;
    width: calc(50% - 8px);
  }
}

@media only screen and (min-width: 730px) {
  ._button-content_18dpgs ._button_18dpgs:not(:only-of-type) {
    width: 250px;
  }
}

@media only screen and (max-width: 729.98px) {
  ._button-content_18dpgs ._button_18dpgs:only-of-type {
    width: 100%;
  }
}

@media only screen and (min-width: 730px) {
  ._button-content_18dpgs ._button_18dpgs:only-of-type {
    width: 400px;
  }
}

/* styles for @clarksource/client/components/clark-native-tour-slides/default.css */
._slide-description_vka334 {
  color: var(--color-summer-night);
  display: flex;
  flex-direction: column;
  font-size: var(--size-font-header-2-mobile);
  font-weight: var(--font-weight-body-1-base-mobile);
  line-height: var(--height-line-header-2-mobile);
  min-height: 76px;
}

._slide-content_vka334 {
  display: flex;
  flex-flow: column;
  justify-content: space-evenly;
  margin: 0 auto;
  max-width: 500px;
  padding: calc(36px + env(safe-area-inset-top)) var(--size-spacing-slight) 0;
  text-align: center;
}

@media only screen and (min-width: 730px) {
  ._slide-content_vka334 {
    padding-top: calc(4vh + var(--ls1) + env(safe-area-inset-top));
  }
}

._title-container_vka334 {
  margin: 10px 0 0;
}

@media (min-height: 568px) {
  ._title-container_vka334 {
    margin-top: 3vh;
  }
}

@media only screen and (max-width: 449.98px) and (min-height: 720px) {
  ._title-container_vka334 {
    margin-top: 5vh;
  }
}

._title-container_vka334 h1 {
  color: var(--color-rich-black);
  font-family: var(--font-family-hero-header);
  font-size: var(--size-font-hero-header-mobile);
  font-weight: var(--font-weight-hero-header-mobile);
  line-height: var(--height-line-hero-header-mobile);
}

@media only screen and (min-width: 768px) {
  ._title-container_vka334 h1 {
    font-size: var(--size-font-hero-header-desktop);
    line-height: var(--height-line-hero-header-desktop);
  }
}

@media only screen and (max-width: 449.98px) and (max-height: 568px) {
  ._title-container_vka334 h1 {
    margin: 0;
  }
}

._media-container_vka334 {
  display: flex;
  justify-content: center;
  padding: 0 var(--spacing-primitive-padding-2);
}

@media only screen and (max-width: 449.98px) and (max-height: 568px) {
  ._media-container_vka334 {
    padding: 0;
  }
}

@media (min-height: 568px) {
  ._media-container_vka334 {
    margin: 3vh 0;
  }
}

@media only screen and (max-width: 449.98px) and (min-height: 720px) {
  ._media-container_vka334 {
    margin-top: 4vh;
  }
}

._sized-image_vka334 {
  max-width: 100%;
}

._slide-container_vka334 {
  background-image: url("https://app.clark.de/assets/images/brand/clark-tour/version1/background-0785128ad4e06963ec21af058c61ef11.svg");
  background-position: 0 40%;
  background-size: contain;
}

._header_vka334 h1 {
  font-weight: var(--font-weight-hero-header-mobile);
  margin: 0 0 var(--s-3);
}

._logo-container_vka334 {
  margin-bottom: var(--s2);
}

._logo-container_vka334 ._brand-logo_vka334 {
  width: 80px;
}

._logo-container_vka334 ._brand-logo_vka334 .clark-logo-fill {
  fill: var(--color-assure);
}

/* styles for @clarksource/client/components/clark-native-tour.css */
._wrapper_1nm9sv {
  inset: 0;
  position: fixed;
}

._container_1nm9sv {
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: flex-start;
  width: 100%;
}

._bottom-section_1nm9sv {
  bottom: 0;
  display: flex;
  flex-direction: column;
  height: 40vh;
  justify-content: flex-end;
  padding: var(--size-spacing-slight);
  padding-bottom: var(--size-spacing-loosest);
  position: fixed;
  width: 100%;
  z-index: 99;
}

._bottom-section_1nm9sv ._cta-button_1nm9sv {
  margin: var(--s-2) 0 0 0;
}

._bottom-section_1nm9sv._bg-gradient_1nm9sv {
  background: linear-gradient(
    180deg,
    rgb(255 255 255 / 0%),
    var(--color-white) 47.4%
  );
}

/* styles for @clarksource/client/components/cookie-banner.css */
/* stylelint-disable color-function-notation */
._cookie-banner-container_o62h22 {
  align-items: flex-end;
  background-color: rgba(23 32 61 / 60%);
  display: flex;
  inset: 0;
  justify-content: flex-end;
  opacity: 1;
  padding: 16px;
  position: fixed;
  transition:
    0.3s opacity,
    0.3s display;
  z-index: 999999999;
}

._cookie-banner-contents_o62h22 {
  margin-bottom: 10px;
  max-height: 50vh;
  overflow-y: auto;
}

._cookie-banner-category_o62h22 {
  padding-right: 7px;
}

._cookie-banner-inner_o62h22 {
  background: white;
  border-radius: 4px;
  flex-flow: column wrap;
  padding: 1.5rem;
  z-index: 1000;
}

@media only screen and (max-width: 729.98px) {
  ._cookie-banner-inner_o62h22 {
    max-height: 100%;
    max-width: 100%;
  }
}

@media only screen and (min-width: 730px) {
  ._cookie-banner-inner_o62h22 {
    max-width: 500px;
  }
}

._cookie-banner-inner_o62h22 ._header_o62h22 {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

._cookie-banner-inner_o62h22 ._header-label_o62h22 {
  color: var(--color-black);
  font-size: 1rem;
  font-weight: bold;
  margin-bottom: 1rem;
}

._cookie-banner-inner_o62h22 ._description_o62h22 {
  color: var(--grey-1);
  line-height: 1.5rem;
  margin-bottom: 1rem;
  padding: 0.5rem 0;
}

._cookie-banner-inner_o62h22 ._more-information_o62h22 {
  padding: 0.5rem 0;
}

._cookie-banner-inner_o62h22 ._more-information_o62h22 a {
  color: var(--brand-primary);
  text-decoration: none;
}

._cookie-banner-collapse_o62h22 {
  display: flex;
  flex-direction: column;
}

._cookie-banner-ctas-primary_o62h22 {
  display: flex;
  flex-direction: column;
}

._cookie-banner-ctas-secondary_o62h22 {
  align-items: center;
  column-gap: 1em;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

@media only screen and (min-width: 730px) {
  ._cookie-banner-ctas-secondary_o62h22 {
    flex-direction: row;
  }
}

._cookie-banner-legal-links_o62h22 {
  margin-bottom: 10px;
  text-align: center;
}

._link_o62h22 {
  color: var(--brand-primary);
  font-size: var(--size-font-body-2-base-mobile);
  font-weight: var(--font-weight-body-1-medium-desktop);
  line-height: var(--height-line-body-2-base-desktop);
  padding: var(--size-spacing-base);
  text-decoration: none;
}

@media only screen and (min-width: 730px) {
  ._link_o62h22 {
    font-size: var(--size-font-body-2-base-desktop);
    padding: var(--size-spacing-tight);
  }
}

/* styles for @clarksource/client/components/cookie-banner/button.css */
._button_1ss5e0 {
  font-size: 14px;
  margin: 0 5px 10px 0;
  min-height: 0;
  min-width: 0;
  padding: 10px;
  width: 100%;
}

/* styles for @clarksource/client/components/customer-support.css */
._link_86z4bl {
  color: var(--typo-dark);
  text-decoration: none;
}

._container_86z4bl {
  display: grid;
  grid-row-gap: 24px;
  grid-template-areas:
    "body"
    "header"
    "footer";
  grid-template-columns: 1fr;
  grid-template-rows: auto 1fr auto;
}

._header_86z4bl {
  grid-area: header;
  padding: 0 20px;
}

._title_86z4bl {
  margin-top: 0;
}

@media only screen and (max-width: 767.98px) {
  ._title_86z4bl {
    font-size: 20px;
  }
}

._body_86z4bl {
  display: flex;
  flex-direction: column;
  grid-area: body;
  justify-content: center;
  min-height: 144px;
  padding: 0 20px;
}

._body-background_86z4bl {
  background-position: right;
  background-repeat: no-repeat;
  background-size: cover;
}

._agent-name_86z4bl {
  font-size: 24px;
  font-weight: 600;
  line-height: 28px;
  max-width: 50%;
  word-break: break-word;
}

._agent-description_86z4bl {
  font-size: 16px;
  font-weight: 500;
  margin-top: 12px;
  max-width: 50%;
  word-break: break-word;
}

._footer_86z4bl {
  display: flex;
  flex-direction: column;
  grid-area: footer;
  padding: 0 20px;
  width: 100%;
}

._footer_86z4bl > * {
  border: 1px solid var(--divider);
  border-bottom: 0;
  margin-bottom: 1px;
}

._footer_86z4bl > *:last-child {
  border-bottom: 1px solid var(--divider);
  margin-bottom: 0;
}

._footer-cta_86z4bl {
  display: grid;
  grid-column-gap: 24px;
  grid-template-areas: "icon label";
  grid-template-columns: auto 1fr;
  grid-template-rows: 1fr;
  padding: 15px 20px;
}

._footer-cta-icon_86z4bl {
  fill: #2b6cde;
  grid-area: icon;
}

._footer-cta-label_86z4bl {
  grid-area: label;
}

/* styles for @clarksource/client/components/demandcheck/demandcheck-question.css */
/* stylelint-disable selector-class-pattern */
._question_73ill7 {
  color: var(--dark-4);
  margin: auto;
  max-width: 600px;
  padding: 0 10px;
}

.clark2 ._question_73ill7 {
  color: var(--typo-dark);
}

@media only screen and (min-width: 730px) {
  ._question_73ill7 {
    padding: 20px 0 10px;
  }
}

._question__intro_73ill7 {
  align-items: flex-start;
  display: flex;
  flex-flow: row nowrap;
  justify-content: flex-start;
  padding: 30px 0 12px;
}

@media only screen and (min-width: 730px) {
  ._question__intro_73ill7 {
    padding: 30px 0 20px;
  }
}

._question__intro__question_73ill7 {
  color: var(--dark-2);
  display: inline;
  font-size: 18px;
  font-weight: 500;
  line-height: 24px;
  width: 92%;
}

.clark2 ._question__intro__question_73ill7 {
  color: var(--typo-dark);
}

@media only screen and (min-width: 730px) {
  ._question__intro__question_73ill7 {
    font-size: 22px;
    line-height: 32px;
  }
}

._question__intro__question--optional_73ill7 {
  font-size: 16px;
  font-weight: 300;
}

._question__intro__heading_73ill7 {
  display: inline;
  font-size: 26px;
  font-weight: 500;
  max-width: 300px;
}

._question__hint_73ill7 {
  padding: 0 0 13px;
  width: 100%;
}

._question__hint__text_73ill7 {
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-align: left;
  width: 100%;
}

@media only screen and (min-width: 730px) {
  ._question__hint__text_73ill7 {
    font-size: 16px;
    line-height: 26px;
    margin: auto;
  }
}

._explanation-mark_73ill7 {
  flex: 0 0 auto;
  margin-left: 12px;
}

@media only screen and (min-width: 730px) {
  ._explanation-mark_73ill7 {
    margin-top: 4px;
  }
}

._explanation-body_73ill7 {
  margin-bottom: 16px;
}

@media only screen and (min-width: 730px) {
  ._explanation-body_73ill7 {
    margin-bottom: 32px;
  }
}

/* styles for @clarksource/client/components/demandcheck/questionnaire-intro.css */
/* stylelint-disable selector-class-pattern */
._intro_1tqnka {
  background: var(--color-white);
  text-align: center;
}

.clark2 ._intro_1tqnka {
  background-color: var(--color-athens-gray);
}

._guarantee_1tqnka {
  padding-bottom: 10px;
  padding-top: 10px;
}

@media only screen and (min-width: 730px) {
  ._guarantee_1tqnka {
    padding-top: 30px;
  }
}

._header_1tqnka {
  background: var(--brand-secondary);
  color: var(--color-white);
  padding: calc(var(--fixed-area-inset-top) + var(--size-spacing-slight)) 0
    var(--size-spacing-slight);
}

.clark2 ._header_1tqnka {
  background-color: #fff;
  color: var(--typo-dark);
}

@media only screen and (min-width: 730px) {
  ._header_1tqnka {
    max-height: 200px;
    padding: 50px 0 30px;
  }
}

._body_1tqnka {
  background: var(--color-white);
  color: var(--dark-4);
  margin: auto;
  max-width: 600px;
  padding: 10px 0;
}

.clark2 ._body_1tqnka {
  background-color: var(--color-athens-gray);
  color: var(--typo-dark);
}

@media only screen and (min-width: 730px) {
  ._body_1tqnka {
    padding: 40px 0;
  }
}

._heading_1tqnka {
  color: var(--dark-2);
  font-size: 18px;
  font-weight: 500;
  line-height: 24px;
}

.clark2 ._heading_1tqnka {
  color: var(--typo-dark);
}

@media only screen and (min-width: 730px) {
  ._heading_1tqnka {
    font-size: 20px;
    line-height: 28px;
  }
}

._message_1tqnka {
  color: var(--dark-4);
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  padding: 0 8px;
}

.clark2 ._message_1tqnka {
  color: var(--typo-dark);
}

@media only screen and (min-width: 730px) {
  ._message_1tqnka {
    padding: 0;
  }
}

._info_1tqnka {
  color: var(--dark-2);
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-around;
  margin: auto;
  max-width: 30%;
  min-width: 320px;
  padding: 20px 50px;
}

.clark2 ._info_1tqnka {
  color: var(--typo-dark);
}

@media only screen and (min-width: 730px) {
  ._info_1tqnka {
    padding: 60px 50px 10px;
  }
}

._info__subsection_1tqnka {
  display: block;
}

._cta_1tqnka {
  height: 50px;
  margin: 0 20px;
  max-width: 335px;
  width: 100%;
}

._cta-section_1tqnka {
  margin-bottom: 20px;
}

@media only screen and (min-width: 730px) {
  ._cta-section_1tqnka {
    margin-bottom: 0;
  }
}

._mins_1tqnka {
  font-size: 28px;
  font-weight: 500;
  line-height: 38px;
}

._text_1tqnka {
  color: var(--grey-1);
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
}

.clark2 ._text_1tqnka {
  color: var(--typo-dark);
}

._medium_1tqnka {
  font-weight: 500;
  padding-bottom: 0;
}

@media only screen and (min-width: 730px) {
  ._medium_1tqnka {
    padding-bottom: 10px;
  }
}

._title_1tqnka {
  font-size: 22px;
  line-height: 32px;
}

@media only screen and (min-width: 730px) {
  ._title_1tqnka {
    font-size: 28px;
    line-height: 40px;
    margin: auto;
    width: 60%;
  }
}

/* styles for @clarksource/client/components/demandcheck/radio-button-input.css */
._radiobutton_1scpgk {
  border-top: 1px solid var(--grey-3);
  color: var(--dark-4);
}

.clark2 ._radiobutton_1scpgk {
  border-top-color: var(--divider);
  color: var(--typo-dark);
}

._list-item_1scpgk {
  border-bottom: 1px solid var(--grey-3);
  display: block;
}

.clark2 ._list-item_1scpgk {
  border-bottom-color: var(--divider);
}

._label_1scpgk {
  line-height: 60px;
  padding-left: 20px;
}

._radio_1scpgk {
  top: 19px;
}

._text_1scpgk {
  cursor: pointer;
  font-size: 14px;
  line-height: 20px;
  padding-left: 25px;
}

@media only screen and (min-width: 730px) {
  ._text_1scpgk {
    font-size: 16px;
    line-height: 24px;
  }
}

/* styles for @clarksource/client/components/floater.css */
._floater-container_1024xq {
  min-height: 80px;
  position: relative;
  transition: min-height 0.25s ease-out;
}

._floater_1024xq {
  background-color: rgb(255 255 255 / 80%);
  bottom: 0;
  width: 100%;
}

._floater_1024xq:not(._is-floating_1024xq) {
  position: absolute;
}

._is-floating_1024xq {
  position: fixed;
}

._content_1024xq {
  display: flex;
  justify-content: center;
  padding: 16px;
}

/* styles for @clarksource/client/components/iframe.css */
._spinner_1wtono {
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
}

._iframe_1wtono {
  border: 0;
  height: calc(
    100vh - var(--fixed-area-inset-top) - var(--fixed-area-inset-bottom)
  );
  width: 100%;
}

/* styles for @clarksource/client/components/invitees-list.css */
/* stylelint-disable no-descending-specificity */

._container_1fkwzy {
  display: flex;
  flex-direction: column;
  gap: var(--size-spacing-base);
  margin: 0 auto;
  padding: var(--size-spacing-base);
  width: 100%;
}

._container_1fkwzy ul > li {
  border-top: 1px solid #f5f6fa;
  margin: 0 !important;
}

._container_1fkwzy ul > li:first-child {
  border-top: 0;
}

@media only screen and (min-width: 450px) {
  ._container_1fkwzy {
    padding: var(--size-spacing-slight) 0;
    width: 714px;
  }
}

._disclaimer-text_1fkwzy {
  color: var(--color-silver-cup);
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  padding: 0 16px;
}

._user-avatar_1fkwzy {
  align-items: center;
  background-color: #d6e3fe;
  border-radius: 50%;
  display: flex;
  height: 48px;
  justify-content: center;
  width: 48px;
}

._icon_1fkwzy {
  color: var(--color-assure);
}

._status-icon_1fkwzy {
  color: #575970;
  margin-right: 5px !important;
}

._list-item-container_1fkwzy {
  cursor: pointer;
  display: flex;
  padding: 16px 0;
  width: 100%;
}

._list-item-body_1fkwzy {
  align-items: center;
  display: flex;
  justify-content: space-between;
  width: 100%;
}

._invite-status_1fkwzy {
  display: flex;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  margin-right: 15px;
}

._list-item-content_1fkwzy {
  display: flex;
  flex-direction: column;
}

._user-info_1fkwzy {
  color: #01051c;
  font-weight: 500;
}

._status-modal-container_1fkwzy {
  padding: 64px 24px;
}

._status-modal-title_1fkwzy {
  margin-bottom: 30px;
}

._status-item_1fkwzy {
  margin-bottom: 15px;
}

._status-title_1fkwzy {
  font-weight: 500;
}

._status-modal-actions_1fkwzy {
  margin-top: 25px;
}

/* styles for @clarksource/client/components/legal-links.css */
._link_exyzcq {
  color: #0439d7;
  font-size: 12px;
  font-weight: 500;
  line-height: 18px;
  padding: 15px;
  text-decoration: none;
}

@media only screen and (min-width: 730px) {
  ._link_exyzcq {
    font-size: 14px;
    padding: 10px;
  }
}

/* styles for @clarksource/client/components/login-form.css */
/* stylelint-disable selector-class-pattern */
._header-logo_11q2a3 {
  margin: 15px 0 30px;
}

._logo-svg_11q2a3 {
  margin: 30px auto 16px;
  width: 140px;
}

._logo-svg_11q2a3 svg {
  width: 140px;
}

._form-wrapper_11q2a3 {
  padding: 0 15px;
}

._form-wrapper_11q2a3 ._reveal_wrapper__eye_11q2a3 {
  top: 10px;
}

._form-subtitle_11q2a3 {
  font-size: 18px;
  font-weight: 500;
  line-height: 26px;
  margin: 0 auto;
}

._form-input_11q2a3 {
  height: 40px;
}

._base-label_11q2a3 {
  color: #203151;
}

._button-container_11q2a3 {
  padding: 16px 0;
}

._button-container_11q2a3 button {
  width: 100%;
}

._button-container_11q2a3 button + button {
  margin-top: 16px;
}

._intro_11q2a3 {
  color: #626e85;
}

._base-action_11q2a3 {
  color: var(--brand-primary);
  cursor: pointer;
  font-weight: 500;
  text-decoration: none;
}

._form-options_11q2a3 {
  justify-content: space-between;
}

._font-small_11q2a3 {
  font-size: 14px;
}

._login-button-for-apple_11q2a3 {
  background: white;
  border: 1px solid var(--color-summer-night);
  color: var(--color-summer-night);
  transition:
    opacity var(--time-transition-fast),
    color var(--time-transition-fast),
    background var(--time-transition-fast),
    border var(--time-transition-fast);
}

._login-button-for-apple_11q2a3:active {
  background: var(--color-summer-night);
  color: white;
  opacity: 1;
}

._login-button-for-apple_11q2a3:hover {
  opacity: 0.8;
}

._login-button-for-apple_11q2a3 ._icon_11q2a3 {
  position: relative;
  top: -2px;
}

._divider-solid_11q2a3 {
  border-top: 1px solid #cfd3da;
}

._signup-options_11q2a3 {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

._signup-description_11q2a3 {
  color: #888da0;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 22px;
  margin-top: 16px;
}

._signup-link_11q2a3 {
  color: #0439d7;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  margin-top: 24px;
  text-align: center;
}

/* styles for @clarksource/client/components/mandate-iban.css */
._field-container_1lke1y {
  margin-bottom: 32px;
}

/* styles for @clarksource/client/components/mandate/app-recommendation.css */
._title_16bny6 {
  font-size: var(--size-font-header-2-mobile);
}

._container_16bny6 {
  padding: var(--size-spacing-base) var(--size-spacing-slight);
}

._clark-mobile-image_16bny6 {
  width: 100%;
}

._app-download-link_16bny6 {
  align-items: center;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

._advantage-list-title_16bny6 {
  font-size: var(--size-font-header-2-mobile);
  font-weight: 500;
}

._advantage-list_16bny6 {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  list-style: none;
  margin-bottom: var(--size-spacing-slight);
}

._advantage-list_16bny6 > ._advantage-list-item_16bny6 {
  align-items: flex-start;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  margin-bottom: var(--size-spacing-base);
}

._advantage-list-item-icon_16bny6 {
  color: var(--brand-primary);
  display: block;
  margin: 0;
  margin-right: var(--size-spacing-tight);
  min-height: 18px;
  min-width: 18px;
}

._points-heading_16bny6 {
  font-size: var(--size-font-header-3-mobile);
  font-weight: 500;
}

._points-content_16bny6 {
  font-size: var(--size-font-header-3-mobile);
}

._not-now-link-wrapper_16bny6 {
  align-items: center;
  display: flex;
  justify-content: center;
  margin-top: var(--size-spacing-base);
}

/* styles for @clarksource/client/components/mandate/exit-poll.css */
._fields_1jgmnf {
  align-items: center;
  display: flex;
  flex-direction: column;
  width: 100%;
}

._fieldset_1jgmnf {
  border: 0;
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  width: 100%;
}

._legend_1jgmnf {
  color: var(--color-summer-night);
  font-size: var(--size-font-header-2-mobile);
  font-weight: var(--font-weight-header-2-mobile);
  line-height: var(--height-line-header-2-mobile);
  padding: var(--size-spacing-base);
  width: 100%;
  word-break: break-word;
}

._legend_1jgmnf ._text-small_1jgmnf {
  font-size: var(--size-font-body-1-base-mobile);
  font-weight: var(--font-weight-body-1-base-mobile);
  line-height: var(--height-line-body-1-base-mobile);
  word-break: break-word;
}

._radio-button-container_1jgmnf {
  border-top: var(--size-border-base) solid var(--color-border-base);
  font-size: var(--size-font-body-1-base-mobile);
  line-height: var(--height-line-body-1-base-mobile);
}

._radio-button-container_1jgmnf:last-of-type {
  border-bottom: var(--size-border-base) solid var(--color-border-base);
}

._radio-button-container_1jgmnf label {
  padding: var(--size-spacing-base) !important;
  width: 100% !important;
  word-break: break-word !important;
}

._text-field-container_1jgmnf {
  border-top: var(--size-border-base) solid var(--color-border-base);
  padding: var(--size-spacing-base);
  width: 100%;
}

._actions_1jgmnf {
  margin-top: calc(2 * var(--size-spacing-loosest));
}

._actions_1jgmnf > * {
  z-index: 20;
}

@media only screen and (min-width: 730px) {
  ._fieldset_1jgmnf {
    width: 600px;
  }

  ._legend_1jgmnf {
    font-size: var(--size-font-header-2-desktop);
    font-weight: var(--font-weight-header-2-desktop);
    line-height: var(--height-line-header-2-desktop);
    padding: var(--size-spacing-base) 0;
  }

  ._legend_1jgmnf ._text-small_1jgmnf {
    font-size: var(--size-font-body-1-base-desktop);
    font-weight: var(--font-weight-body-1-base-desktop);
    line-height: var(--height-line-body-1-base-desktop);
  }

  ._radio-button-container_1jgmnf {
    font-size: var(--size-font-body-1-base-desktop);
    line-height: var(--height-line-body-1-base-mobile);
  }

  ._radio-button-container_1jgmnf label {
    padding: var(--size-spacing-base) 0 !important;
  }

  ._text-field-container_1jgmnf {
    padding: var(--size-spacing-base) 0;
    width: 600px;
  }

  ._actions_1jgmnf {
    margin-top: var(--size-spacing-base);
  }
}

/* styles for @clarksource/client/components/mandate/fde-consent.css */
._card_1xk8oa {
  align-items: center;
  background: white;
  border-radius: 4px;
  box-shadow: 0 2px 2px 0 rgb(173 182 217 / 50%);
  display: flex;
  flex-direction: column;
  margin: 24px 16px;
  max-width: 650px;
  padding: 24px;
}

._card_1xk8oa > *:not(:last-child) {
  margin-bottom: 24px;
}

._title_1xk8oa {
  text-align: center;
}

._consent_1xk8oa {
  align-items: center;
  display: flex;
  flex-direction: row-reverse;
}

._consent_1xk8oa > *:not(:last-child) {
  flex: 1;
  margin-left: 12px;
}

@media only screen and (min-width: 730px) {
  ._card_1xk8oa {
    margin: 24px auto auto;
  }
}

/* styles for @clarksource/client/components/mandate/mandate-cockpit-preview.css */
._icon-container_tvaunf {
  background-image: url("https://app.clark.de/assets/svgs/mobileStraightArrow-a02dc81e102e463be6157b51cf576db7.svg");
}

@media only screen and (min-width: 768px) {
  ._icon-container_tvaunf {
    background-image: url("https://app.clark.de/assets/svgs/desktopStraightArrow-5e916edfe506e90d3c5b9047f5852010.svg");
  }
}

/* styles for @clarksource/client/components/mandate/mandate-confirming.css */
._popup-hero-text_1rvbzr {
  margin-bottom: 10px;
}

._popup-trust-icons_1rvbzr {
  margin: 32px;
  width: 280px;
}

._popup-trust-icons_1rvbzr > * {
  min-height: 50px;
}

._popup-trust-list_1rvbzr {
  margin-top: 10px;
}

._heading_1rvbzr {
  margin: 0 14px;
  text-align: left;
}

@media only screen and (min-width: 450px) {
  ._heading_1rvbzr {
    text-align: center;
  }
}

._subtitle_1rvbzr {
  color: black;
  display: block;
  font-size: 18px;
  line-height: 26px;
  margin: 0 auto;
  max-width: 600px;
  text-align: left;
}

@media only screen and (min-width: 450px) {
  ._subtitle_1rvbzr {
    color: var(--color-summer-night);
    font-size: 16px;
    line-height: 24px;
    text-align: center;
  }
}

._subtitle-button_1rvbzr {
  margin-bottom: 4px;
  margin-top: 20px;
}

@media only screen and (min-width: 450px) {
  ._subtitle-button_1rvbzr {
    margin-bottom: 28px;
    margin-top: 24px;
  }
}

._subtitle-button-text_1rvbzr {
  font-size: 14px;
  font-weight: normal;
  line-height: 22px;
}

/* styles for @clarksource/client/components/mandate/mandate-confirming/signature.css */
._modal-close_b09wn0 {
  cursor: pointer !important;
  padding: 12px !important;
  position: absolute !important;
  right: 0;
  top: 0;
  z-index: 524;
}

@media only screen and (min-width: 730px) {
  ._modal-close_b09wn0 {
    height: 20px;
    padding: 0;
    right: 12px;
    top: 12px;
    width: 20px;
  }
}

button._modal-reset_b09wn0 {
  position: absolute;
}

@media only screen and (min-width: 730px) {
  button._modal-reset_b09wn0 {
    position: relative;
  }
}

._signature-container_b09wn0 {
  cursor: pointer;
}

/* styles for @clarksource/client/components/mandate/mandate-confirming/terms-checkbox.css */
._terms_kwk9nf {
  align-items: center;
  display: flex;
  flex-direction: row;
  margin: 0 0 24px;
}

._label_kwk9nf {
  color: var(--grey-5);
  cursor: pointer;
  font-size: 14px;
  line-height: 18px;
  margin: 0 0 0 15px;
}

.clark2 ._label_kwk9nf {
  color: var(--typo-dark);
}

._error_kwk9nf label {
  border-color: #d0021b;
  color: #d0021b;
}

/* styles for @clarksource/client/components/mandate/mandate-finished.css */
._mandte-finished-item-content_rf1yv {
  font-size: 16px;
}

@media only screen and (max-width: 729.98px) {
  ._mandte-finished-item-content_rf1yv {
    font-size: 14px;
  }
}

._mandate-finished-next-button_rf1yv {
  background-color: var(--color-assure) !important;
}

/* styles for @clarksource/client/components/mandate/mandate-intro-short.css */
._screen_1l27yk {
  background-color: var(--color-athens-gray);
  padding: var(--size-spacing-extra-loose) var(--size-spacing-none) 94px;
}

@media only screen and (min-width: 730px) {
  ._screen_1l27yk {
    min-height: calc(100vh - var(--web-header-offset));
    padding: var(--size-spacing-extra-loose) var(--size-spacing-none)
      var(--size-spacing-loose);
  }
}

._padding-top-none_1l27yk {
  padding-top: var(--size-spacing-none) !important;
}

._wrapper_1l27yk {
  margin: auto;
  max-width: 650px;
  padding: var(--size-spacing-none) var(--size-spacing-base);
  text-align: center;
}

._headline_1l27yk {
  color: var(--color-rich-black);
  font-size: var(--size-font-body-1-base-mobile);
  font-weight: var(--font-weight-header-2-mobile);
  line-height: var(--height-line-body-1-base-mobile);
  white-space: normal;
}

@media only screen and (min-width: 730px) {
  ._headline_1l27yk {
    font-size: var(--size-font-header-3-desktop);
    font-weight: var(--font-weight-header-1-desktop);
    line-height: var(--height-line-header-3-desktop);
  }
}

._container_1l27yk {
  background: var(--color-white);
  border-radius: var(--radius-border-base);
  box-shadow: 0 3px 5px rgb(173 182 217 / 40%);
  margin-top: var(--size-spacing-slight);
  padding: var(--size-spacing-base);
}

@media only screen and (min-width: 730px) {
  ._container_1l27yk {
    margin-top: var(--size-spacing-loose);
    padding: var(--size-spacing-extra-loose) var(--size-spacing-loosest);
  }
}

._container_1l27yk > :not(:last-child) {
  margin-bottom: var(--size-spacing-slight);
}

@media only screen and (min-width: 730px) {
  ._container_1l27yk > :not(:last-child) {
    margin-bottom: var(--size-spacing-loose);
  }
}

._list-headline_1l27yk {
  color: var(--color-rich-black);
  font-size: var(--size-font-body-1-medium-mobile);
  font-weight: var(--font-weight-body-1-medium-mobile);
  line-height: var(--height-line-body-1-medium-mobile);
  margin: var(--size-spacing-none);
  padding: var(--size-spacing-none) var(--size-spacing-base);
}

@media only screen and (min-width: 730px) {
  ._list-headline_1l27yk {
    font-size: var(--size-font-header-3-desktop);
    font-weight: var(--font-weight-header-3-desktop);
    line-height: var(--height-line-header-3-desktop);
    padding: var(--size-spacing-none);
  }
}

._list-title_1l27yk {
  color: var(--color-rich-black);
  font-size: var(--size-font-header-2-mobile);
  font-weight: var(--font-weight-header-3-mobile);
  text-align: left;
}

@media only screen and (min-width: 730px) {
  ._list-title_1l27yk {
    font-size: var(--size-font-header-2-desktop);
    text-align: center;
  }
}

@media only screen and (min-width: 730px) {
  ._list-item-icon_1l27yk {
    margin-top: var(--size-spacing-tightest);
  }
}

._list-item-icon_1l27yk {
  color: var(--color-assure);
}

._list-item-text_1l27yk {
  display: flex;
  flex-direction: column;
}

._list-item-heading_1l27yk {
  color: var(--color-rich-black);
  font-size: var(--size-font-header-3-mobile);
  font-weight: var(--font-weight-header-3-mobile);
  line-height: var(--height-line-header-3-mobile);
  margin: var(--size-spacing-none);
}

@media only screen and (min-width: 730px) {
  ._list-item-heading_1l27yk {
    font-size: var(--size-font-header-3-desktop);
    font-weight: var(--font-weight-header-3-desktop);
    line-height: var(--height-line-header-3-desktop);
  }
}

._list-item-body_1l27yk {
  color: var(--color-summer-night);
  font-size: var(--size-font-body-1-base-mobile);
  font-weight: var(--font-weight-body-1-base-mobile);
  line-height: var(--height-line-body-1-base-mobile);
}

@media only screen and (min-width: 730px) {
  ._list-item-body_1l27yk {
    font-size: var(--size-font-body-1-base-desktop);
    font-weight: var(--font-weight-body-1-base-desktop);
    line-height: var(--height-line-body-1-base-desktop);
    margin-top: var(--size-spacing-tightest);
  }
}

._button-wrapper_1l27yk {
  margin: var(--size-spacing-slight) auto auto;
  padding: var(--size-spacing-none) var(--size-spacing-tight);
  text-align: center;
}

@media only screen and (min-width: 730px) {
  ._button-wrapper_1l27yk {
    margin: var(--size-spacing-loose) auto auto;
    max-width: 325px;
  }
}

._next-button_1l27yk {
  width: 100%;
}

._mobile-legal-links_1l27yk {
  margin-top: var(--size-spacing-slight);
}

._mobile-legal-links_1l27yk > a {
  font-size: var(--size-font-body-1-medium-mobile);
  font-weight: var(--font-weight-body-1-medium-mobile);
  line-height: var(--height-line-body-1-medium-mobile);
}

/* styles for @clarksource/client/components/mandate/mandate-mam.css */
._icon-container_glqmp0 {
  background-image: url("https://app.clark.de/assets/svgs/mamLogo-014564ecb2b3d53f90cced62e623ddfc.svg");
  background-position: center center;
  background-repeat: no-repeat;
  height: 54px;
}

/* styles for @clarksource/client/components/mandate/mandate-payback.css */
/* stylelint-disable selector-class-pattern */
._payback-input__wrapper_k26juu {
  position: relative;
}

._payback-hint_k26juu {
  position: absolute;
  right: 10px;
  top: 15px;
}

._question-icon_k26juu {
  height: 18px;
  width: 18px;
}

._payback-floater_k26juu {
  align-items: center;
  display: flex;
}

@media only screen and (max-width: 449.98px) {
  ._payback-floater_k26juu button {
    flex-basis: 50%;
  }
}

._mobile-skip-button-wrapper_k26juu {
  margin-top: 24px;
}

._mobile-skip-button_k26juu {
  width: 100%;
}

._logo-container_k26juu {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-bottom: 20px;
}

._payback-logo_k26juu {
  height: 83px;
  width: 200px;
}

/* styles for @clarksource/client/components/mandate/mandate-phone-verification.css */
._section-wrapper_17ad4r {
  padding: 0 24px;
}

._heading_17ad4r {
  text-align: left;
}

@media only screen and (min-width: 450px) {
  ._heading_17ad4r {
    margin-top: 8px;
    text-align: center;
  }
}

._phone-title_17ad4r {
  color: black;
  font-size: 22px;
  font-weight: normal;
  line-height: 30px;
  margin: 0;
  text-align: left;
}

@media only screen and (min-width: 450px) {
  ._phone-title_17ad4r {
    font-size: 28px;
    line-height: 36px;
    text-align: center;
  }
}

._phone-subtitle_17ad4r {
  color: var(--color-summer-night);
  font-size: 14px;
  line-height: 22px;
  margin: 20px auto 0;
  max-width: 620px;
  text-align: left;
}

@media only screen and (min-width: 450px) {
  ._phone-subtitle_17ad4r {
    font-size: 16px;
    line-height: 24px;
    text-align: center;
  }
}

._code-title_17ad4r {
  color: black;
  display: none;
  font-weight: normal;
  margin: 0;
}

@media only screen and (min-width: 450px) {
  ._code-title_17ad4r {
    display: block;
    font-size: 28px;
    line-height: 36px;
    text-align: center;
  }
}

._code-subtitle_17ad4r {
  color: black;
  font-size: 18px;
  line-height: 26px;
  margin: 0 auto;
  max-width: 620px;
  text-align: left;
}

@media only screen and (min-width: 450px) {
  ._code-subtitle_17ad4r {
    color: var(--color-summer-night);
    font-size: 16px;
    line-height: 24px;
    margin-top: 20px;
    text-align: center;
  }
}

._phone-number_17ad4r {
  font-weight: 500;
}

._subtitle-button_17ad4r {
  margin: 20px 0 4px;
}

@media only screen and (min-width: 450px) {
  ._subtitle-button_17ad4r {
    margin: 24px 0 28px;
  }
}

._subtitle-button-text_17ad4r {
  font-size: 14px;
  font-weight: normal;
  line-height: 22px;
}

/* styles for @clarksource/client/components/mandate/mandate-phone-verification/phone-verification-input.css */
._trust-icons_gsob0x {
  margin: auto 48px;
}

._secure-wrapper_gsob0x {
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin: 21px 0;
  width: 100%;
}

@media only screen and (min-width: 450px) {
  ._secure-wrapper_gsob0x {
    margin: 30px 0;
  }
}

._secure-icon_gsob0x {
  height: 21px;
  margin-right: 10px;
  width: 12px;
}

._secure-icon_gsob0x svg {
  color: var(--clark-color-text-weak);
  height: 100%;
  width: 100%;
}

._secure-text_gsob0x {
  color: var(--clark-color-text-weak);
  font-size: 14px;
  line-height: 22px;
}

/* styles for @clarksource/client/components/mandate/mandate-phone-verification/verification-code-input.css */
/* stylelint-disable font-family-no-missing-generic-family-keyword, no-descending-specificity, selector-class-pattern */
._token-body_77s0dc {
  align-items: center;
  display: flex;
  flex-direction: column;
}

.mandate-phone-verification__verification-body__heading._token-body-title_77s0dc {
  color: var(--color-summer-night);
  font-weight: 500;
}

._phone-verification-input-code_77s0dc {
  color: var(--color-summer-night);
  font-family: "Cera Round Pro";
  font-size: 36px;
  height: 65px;
  letter-spacing: 20px;
  line-height: 36px;
  padding: 16px 30px 13px 50px;
  text-align: center;
  width: 256px;
}

._phone-verification-input-code_77s0dc:focus._has-error_77s0dc,
._phone-verification-input-code_77s0dc._has-error_77s0dc {
  border-color: #d51e50;
}

._token-input-wrapper_77s0dc {
  position: relative;
}

._tick-symbol_77s0dc .svg-cta-stroke {
  fill: #0439d7;
  stroke: #0439d7;
}

._token-error-wrapper_77s0dc {
  display: flex;
  justify-content: center;
}

._link_77s0dc {
  font-weight: normal;
}

/* styles for @clarksource/client/components/mandate/mandate-process-progress.css */
._container_1xr96y {
  position: -webkit-sticky;
  position: sticky;
  top: calc(env(safe-area-inset-top, 0) + 0);
  top: calc(env(safe-area-inset-top, 0) + var(--web-header-offset, 0));
}

._progress-bar-container_1xr96y {
  background-color: #daddec;
  height: 6px;
  left: 0;
  width: 100%;
  z-index: 100;
}

._progress-bar_1xr96y {
  background-color: #0439d7;
  border-radius: 0 3px 3px 0;
  height: 100%;
  transition: width 1s cubic-bezier(0.1, 0.68, 0.08, 0.92);
  width: 0;
}

/* styles for @clarksource/client/components/mandate/mandate-profiling-short/form.css */
._container_1shd4q {
  background-color: var(--color-white);
  min-width: 100vw;
  padding: 20px var(--size-spacing-slight);
}

@media only screen and (min-width: 730px) {
  ._container_1shd4q {
    background-color: var(--color-athens-gray);
    padding: 60px 60px var(--size-spacing-slight);
  }
}

._screen_1shd4q {
  display: flex;
  flex-direction: column;
  margin: 0;
  width: 100%;
}

@media only screen and (min-width: 730px) {
  ._screen_1shd4q {
    background-color: var(--color-white);
    border-radius: 4px;
    box-shadow: 0 2px 2px 0 rgb(173 182 217 / 50%);
    margin: 0 auto;
    max-width: 900px;
    padding: var(--size-spacing-loose) var(--size-spacing-extra-loose);
  }
}

._header_1shd4q {
  align-self: center;
  margin-bottom: 30px;
  margin-top: var(--size-spacing-tight);
  max-width: 400px;
  text-align: left;
}

@media only screen and (min-width: 730px) {
  ._header_1shd4q {
    margin-bottom: 38px;
    margin-top: var(--size-spacing-extra-tight);
    text-align: center;
  }
}

._header_1shd4q ._title_1shd4q {
  display: none;
  font-size: var(--size-font-header-1-desktop);
  line-height: var(--height-line-header-1-desktop);
  margin-bottom: var(--size-spacing-base);
  margin-top: 0;
}

@media only screen and (min-width: 730px) {
  ._header_1shd4q ._title_1shd4q {
    display: block;
  }
}

._header_1shd4q ._subtitle_1shd4q {
  font-size: var(--size-font-header-2-mobile);
  line-height: var(--height-line-header-1-mobile);
}

@media only screen and (min-width: 730px) {
  ._header_1shd4q ._subtitle_1shd4q {
    font-size: var(--size-font-body-1-base-desktop);
    line-height: var(--height-line-body-1-base-desktop);
  }
}

._profile-form_1shd4q {
  margin: 0 auto;
  max-width: 400px;
  position: relative;
}

._form-layout_1shd4q {
  display: flex;
  flex-direction: column;
  width: 100%;
}

._form-block_1shd4q {
  display: flex;
  flex-direction: column;
  width: 100%;
}

._form-block_1shd4q:not(:last-of-type) {
  margin-bottom: var(--size-spacing-base);
}

._field-group_1shd4q {
  display: flex;
  margin-bottom: var(--size-spacing-base);
  width: 100%;
}

._form-label_1shd4q,
div._form-cell_1shd4q > div > label {
  color: var(--color-silver-cup);
  display: none;
  font-size: var(--size-font-body-1-base-mobile);
  line-height: var(--height-line-body-1-base-mobile);
  width: 100%;
}

@media only screen and (min-width: 450px) {
  ._form-label_1shd4q,
  div._form-cell_1shd4q > div > label {
    align-items: center;
    display: flex;
  }
}

._form-cell_1shd4q {
  display: flex;
  flex-grow: 0;
}

@media only screen and (min-width: 450px) {
  ._form-cell_1shd4q input::placeholder {
    opacity: 0;
  }
}

._form-cell_1shd4q:not(:last-of-type) {
  margin-bottom: var(--size-spacing-base);
}

._field-group_1shd4q ._form-cell_1shd4q {
  flex-grow: 1;
  margin-bottom: 0;
}

._field-group_1shd4q ._form-cell_1shd4q:not(:last-of-type) {
  margin-right: var(--size-spacing-base);
}

._form-cell_1shd4q._custom-cell-width_1shd4q {
  flex-grow: 0;
}

._form-cell_1shd4q > * {
  width: 100%;
}

._form-cell_1shd4q._hidden_1shd4q {
  display: none;
}

._form-cell_1shd4q._contains-choice-set_1shd4q {
  align-items: center;
  display: flex;
  min-height: 40px;
}

@media only screen and (max-width: 449.98px) {
  ._form-cell_1shd4q._contains-choice-set_1shd4q._gender-section_1shd4q fieldset legend {
    display: none;
  }
}

._form-filling-help_1shd4q {
  font-size: var(--size-font-body-1-base-desktop);
  font-weight: var(--font-weight-body-1-base-desktop);
  text-align: left;
}

._hint-container_1shd4q {
  margin: 0 auto;
  max-width: 400px;
}

._floater-button_1shd4q {
  background: var(--color-athens-gray);
}

._floater-container_1shd4q {
  position: relative;
  z-index: 20;
}

/* styles for @clarksource/client/components/mandate/mandate-profiling/delete-account-modal.css */
/* stylelint-disable no-descending-specificity */

._actions_serh2v {
  margin-top: 32px;
}

._actions_serh2v button span,
._actions_serh2v span {
  font-size: 16px;
  font-weight: 500;
  line-height: 16px;
}

._actions_serh2v > * {
  margin-bottom: 32px;
}

@media only screen and (min-width: 730px) {
  ._actions_serh2v > * {
    margin-bottom: 16px;
  }
}

._container_serh2v {
  margin: 24px 16px 48px;
}

@media only screen and (min-width: 730px) {
  ._container_serh2v {
    margin: 24px 16px;
  }
}

._header_serh2v {
  padding-bottom: 22px;
  padding-top: 8px;
}

._title_serh2v {
  font-size: 22px;
  font-weight: 500;
  line-height: 30px;
}

._body_serh2v {
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
}

._body_serh2v > p:not(:first-child) {
  margin-top: 16px;
}

._delete-account-link_serh2v {
  color: var(--color-cardinal);
}

._delete-account-link_serh2v:focus,
._delete-account-link_serh2v:active,
._delete-account-link_serh2v:hover {
  color: #c00f40;
}

/* styles for @clarksource/client/components/mandate/mandate-register.css */
@media only screen and (max-width: 729.98px) {
  ._signup-button_bcw31o {
    display: block;
    width: 100%;
  }
}

._section-wrapper_bcw31o {
  padding: 0 24px;
}

._title_bcw31o {
  color: black;
  font-size: 18px;
  line-height: 26px;
  margin-bottom: 48px;
  margin-top: 0;
  text-align: left;
}

@media only screen and (min-width: 450px) {
  ._title_bcw31o {
    color: var(--color-rich-black);
    font-size: 28px;
    font-weight: 500;
    line-height: 36px;
    margin-bottom: 16px;
    margin-top: 8px;
    text-align: center;
  }
}

._password-strength_bcw31o {
  color: var(--color-comet-gray);
  font-size: 14px;
  line-height: 22px;
}

/* styles for @clarksource/client/components/mandate/payback-calculator.css */
._payback-calculator-wrapper_1ff2az {
  margin: 0 auto;
  margin-top: 18px;
  max-width: 1000px;
  padding: 0 10px;
  position: relative;
  width: 100%;
}

@media only screen and (max-width: 729.98px) {
  ._payback-calculator-wrapper_1ff2az {
    margin: 18px auto;
    width: 90%;
  }
}

._payback-calculator-info-wrapper_1ff2az {
  background-color: var(--c-grey-lightest);
}

._payback-calculator-info-content_1ff2az span {
  font-weight: 500;
}

._payback-calculator-info-content_1ff2az span,
._payback-calculator-info-content_1ff2az p {
  font-size: 14px;
}

._payback-calculator-title_1ff2az {
  align-items: center;
  color: var(--brand-primary);
  display: flex;
  justify-content: center;
  margin: 12px 0;
}

._payback-calculator-title_1ff2az ._payback-money-icon_1ff2az {
  height: 26px;
  margin: 0;
  margin-right: 10px;
  width: 26px;
}

._payback-calculator-title_1ff2az svg {
  fill: var(--brand-primary);
  margin-right: 10px;
}

._payback-calculator-points_1ff2az {
  color: var(--dark-2);
  display: flex;
  font-size: 22px;
  justify-content: center;
}

@media only screen and (max-width: 729.98px) {
  ._payback-calculator-points_1ff2az {
    font-size: 16px;
  }
}

._payback-calculator-info_1ff2az {
  cursor: pointer;
  position: absolute;
  right: 10px;
  top: 10px;
}

._payback-calculator-info_1ff2az ._info-icon-wrapper_1ff2az {
  height: 18px;
  width: 18px;
}

._payback-calculator-info_1ff2az svg {
  color: #c3cbd9;
  height: 18px;
  width: 18px;
}

/* styles for @clarksource/client/components/mandate/select-category-selection.css */
._selected-item_hctq4m {
  border: none;
  padding: 11px 20px !important;
}

._selected-company-wrapper_hctq4m {
  align-items: center;
  display: flex;
  flex-direction: row;
}

._delete-button_hctq4m {
  background: none;
  border: none;
  display: flex;
}

._popular-category-icon_hctq4m {
  align-items: center !important;
  display: flex !important;
  justify-content: center !important;
  margin: 0 !important;
  margin-right: 10px !important;
}

._popular-category-icon_hctq4m svg {
    fill: currentcolor !important;
    height: 24px !important;
    margin-left: -10px !important;
    width: 24px !important;
  }

._company-img-container_hctq4m {
  align-items: center;
  display: flex;
  height: 24px;
  justify-content: center;
  margin-right: 17px;
  overflow: hidden;
  width: 24px;
}

._company-img-container_hctq4m img {
  height: 100%;
  object-fit: contain;
  width: 100%;
}

@media only screen and (min-width: 1000px) {
  ._selected-item_hctq4m {
    padding: 17px 30px !important;
  }
}

/* styles for @clarksource/client/components/mandate/select-category.css */
._search-field_12rzmr {
  font-size: var(--size-font-body-1-base-desktop);
  height: 47px;
}

/*
  The following selectors can be removed once
  A) https://github.com/emberjs/rfcs/issues/497 is merged
  B) We have a design system in place that includes proper TextField sizing
*/

/* Gross way of selecting the suffix icon */
._search-field_12rzmr ~ div > span {
  color: var(--color-assure);
}

/* Gross way of selecting the clear button icon */
._search-field_12rzmr ~ button > span:last-child {
  height: 24px !important;
  width: 24px !important;
}

._heading_12rzmr {
  padding: 0 24px;
  text-align: left;
}

@media only screen and (min-width: 450px) {
  ._heading_12rzmr {
    text-align: center;
  }
}

._skip-add-contracts_12rzmr {
  color: #0439d7;
  margin-top: var(--size-spacing-base);
}

._flex-column_12rzmr {
  display: flex;
  flex-direction: column;
}

@media only screen and (min-width: 450px) {
  ._flex-column_12rzmr {
    align-items: center;
  }
}

._justify-center_12rzmr {
  flex-direction: column;
  justify-content: center;
}

._text-center_12rzmr {
  text-align: center;
}

/* styles for @clarksource/client/components/mandate/select-category/heading.css */
._title_1eluid {
  color: var(--color-rich-black);
  font-size: var(--size-font-header-2-mobile);
  font-weight: normal;
  line-height: 36px;
  margin-top: var(--size-spacing-loose);
  text-align: center;
}

@media only screen and (min-width: 450px) {
  ._title_1eluid {
    font-size: var(--size-font-hero-header-small-desktop);
  }
}

._subtitle_1eluid {
  color: black;
  display: block;
  font-size: 18px;
  line-height: 26px;
  margin: 0;
  margin-top: var(--size-spacing-loose);
  max-width: 450px;
}

._title_1eluid + ._subtitle_1eluid {
  margin-top: 0;
  text-align: left;
}

@media only screen and (min-width: 450px) {
  ._title_1eluid + ._subtitle_1eluid {
    text-align: center;
  }
}

@media only screen and (min-width: 450px) {
  ._subtitle_1eluid {
    color: var(--color-summer-night);
    font-size: 16px;
    line-height: 24px;
    margin: 0 auto;
  }
}

._skip-button_1eluid {
  margin-top: 24px;
}

._skip-button-text_1eluid {
  font-size: 16px;
  line-height: 24px;
  margin-right: 10px;
}

._skip-button-icon_1eluid {
  height: 10px;
  width: 4px;
}

/* styles for @clarksource/client/components/mandate/signature/intro.css */
._intro_1xmqnm {
  align-items: center;
  display: flex;
  flex-direction: column;
}

._intro-header_1xmqnm {
  font-size: var(--size-font-hero-header-small-mobile);
  font-weight: var(--font-weight-body-1-base-mobile);
  line-height: var(--height-line-hero-header-small-mobile);
  margin: 32px auto auto 24px;
  width: 100%;
}

._intro-description_1xmqnm {
  font-size: var(--size-font-body-1-base-mobile);
  font-weight: var(--font-weight-body-1-base-mobile);
  line-height: var(--height-line-body-1-base-mobile);
  margin: 20px 24px auto;
}

@media only screen and (min-width: 730px) {
  ._intro-header_1xmqnm {
    font-size: var(--size-font-hero-header-small-desktop);
    font-weight: var(--font-weight-body-1-base-desktop);
    line-height: var(--height-line-hero-header-small-desktop);
    margin-left: 0;
    text-align: center;
  }

  ._intro-description_1xmqnm {
    font-size: var(--size-font-body-1-base-desktop);
    font-weight: var(--font-weight-body-1-base-desktop);
    line-height: var(--height-line-body-1-base-desktop);
    margin-left: 0;
    margin-right: 0;
    max-width: 600px;
    text-align: center;
  }

  ._floater-container_1xmqnm > div > div {
    left: 0;
  }
}

/* styles for @clarksource/client/components/mandate/signature/intro/mandate-terms.css */
._list-container_12v4cz {
  align-items: center;
  display: flex;
  flex-direction: column;
  margin: auto 12px auto 24px;
}

._list_12v4cz {
  display: flex;
  flex-direction: column;
  list-style: none;
  margin-top: 10px;
  max-width: 520px;
  padding: 20px 10px 0;
  width: calc(100% + 40px);
}

._list-item_12v4cz {
  margin-bottom: 20px;
  padding-left: 35px;
  position: relative;
}

._item_12v4cz {
  background-color: var(--color-athens-gray);
  border: 1px solid var(--color-border-base);
  border-radius: 100%;
  height: 40px;
  left: 5px;
  position: absolute;
  text-align: center;
  top: 3px;
  width: 40px;
}

._item-svg_12v4cz {
  height: 24px;
  position: relative;
  top: 20%;
  width: 24px;
}

._term-title_12v4cz {
  font-size: var(--size-font-body-1-medium-mobile);
  font-weight: var(--font-weight-body-1-medium-mobile);
  line-height: var(--height-line-body-1-medium-mobile);
  margin: auto 12px auto 24px;
}

._item-description_12v4cz {
  font-size: var(--size-font-body-1-base-mobile);
  font-weight: var(--font-weight-body-1-base-mobile);
  line-height: var(--height-line-body-1-base-mobile);
  margin: auto 12px auto 24px;
}

@media only screen and (min-width: 730px) {
  ._item_12v4cz {
    left: 0;
  }

  ._term-title_12v4cz {
    font-size: var(--size-font-body-1-medium-desktop);
    font-weight: var(--font-weight-body-1-medium-desktop);
    line-height: var(--height-line-body-1-medium-desktop);
    margin-right: 0;
  }

  p {
    font-size: var(--size-font-body-1-base-desktop);
    font-weight: var(--font-weight-body-1-base-desktop);
    line-height: var(--height-line-body-1-base-desktop);
    margin-right: 0;
  }
}

._terms-title_12v4cz {
  font-size: var(--size-font-header-2-mobile);
  font-weight: 500;
  margin-top: var(--size-spacing-loose);
  text-align: left;
  width: 100%;
}

@media only screen and (min-width: 730px) {
  ._terms-title_12v4cz {
    font-size: var(--size-font-header-2-desktop);
    text-align: center;
  }
}

/* styles for @clarksource/client/components/mandate/signature/sign.css */
/* stylelint-disable selector-class-pattern */
._sign-container_6b4szq {
  align-items: center;
  display: flex;
  flex-direction: column;
  margin-left: auto;
  margin-right: auto;
  max-width: 648px;
  padding: var(--size-spacing-loose) var(--size-spacing-slight);
}

._confirmation-container_6b4szq {
  cursor: pointer;
  width: 100%;
}

._sign-header_6b4szq {
  font-size: var(--size-font-hero-header-small-mobile);
  font-weight: var(--font-weight-body-1-base-mobile);
  line-height: var(--height-line-hero-header-small-mobile);
  margin-bottom: var(--size-spacing-base);
  margin-top: 0;
  width: 100%;
}

._sign-description_6b4szq {
  font-size: var(--size-font-body-1-base-mobile);
  font-weight: var(--font-weight-body-1-base-mobile);
  line-height: var(--height-line-body-1-base-mobile);
}

._info-modal_6b4szq {
  margin-bottom: var(--size-spacing-slight);
  text-align: left;
  width: 100%;
}

._subtitle-button_6b4szq {
  margin-bottom: 4px;
  margin-top: var(--size-spacing-base);
}

._subtitle-button-text_6b4szq {
  font-size: var(--size-font-body-1-base-mobile);
  font-weight: var(--font-weight-body-1-base-mobile);
  line-height: var(--height-line-body-1-base-mobile);
}

._terms-conditions_6b4szq {
  color: #787878;
  font-size: 11px;
  font-weight: 300;
  line-height: 16px;
  margin: 20px 10px;
  padding: 0 20px;
}

@media only screen and (min-width: 730px) {
  ._terms-conditions_6b4szq {
    margin-bottom: 36px;
    margin-left: auto;
    margin-right: auto;
    max-width: 600px;
  }
}

._clark2_6b4szq ._terms-conditions_6b4szq {
  color: #283e66;
  font-weight: 400;
}

._terms-conditions__link_6b4szq {
  color: #787878;
  text-decoration: underline;
}

._clark2_6b4szq ._terms-conditions__link_6b4szq {
  color: #283e66;
}

@media only screen and (min-width: 730px) {
  ._sign-header_6b4szq {
    font-size: var(--size-font-hero-header-small-desktop);
    font-weight: var(--font-weight-body-1-base-desktop);
    line-height: var(--height-line-hero-header-small-desktop);
    margin-left: 0;
    text-align: center;
  }

  ._sign-description_6b4szq {
    font-size: var(--size-font-body-1-base-desktop);
    font-weight: var(--font-weight-body-1-base-desktop);
    line-height: var(--height-line-body-1-base-desktop);
    margin-left: 0;
    margin-right: 0;
    max-width: 600px;
    text-align: center;
  }

  ._info-modal_6b4szq {
    text-align: center;
  }

  ._subtitle-button-text_6b4szq {
    font-size: var(--size-font-body-1-base-desktop);
    font-weight: var(--font-weight-body-1-base-desktop);
    line-height: var(--height-line-body-1-base-desktop);
  }
}

/* styles for @clarksource/client/components/mandate/signature/sign/consent.css */
._container_z37i4n {
  display: flex;
  flex-direction: column;
  margin-top: var(--size-spacing-loose);
}

._container_z37i4n > * {
  margin-bottom: 0;
  margin-top: 0;
}

._container_z37i4n > * + * {
  margin-top: var(--size-spacing-tight);
}

@media only screen and (min-width: 768px) {
  ._container_z37i4n {
    margin: var(--size-spacing-loose) 40px;
    width: calc(100% - 80px);
  }

  ._container_z37i4n > * + * {
    margin-top: var(--size-spacing-slight);
  }
}

._terms-of-service_z37i4n ._legal-link_z37i4n {
  font-size: 12px !important;
  font-weight: var(--font-weight-body-1-base-desktop);
  min-height: 0 !important;
  min-width: 0 !important;
  padding: 0 !important;
  text-decoration: underline !important;
}

._legal-link-secondary_z37i4n {
  color: var(--typo-dark) !important;
}

._terms-of-service_z37i4n,
._consent_z37i4n,
._consent_z37i4n ._legal-link_z37i4n {
  font-size: 11px;
  line-height: var(--height-line-body-3-base-mobile);
  min-height: 0;
  padding: 0;
  text-align: center;
}

._consent_z37i4n {
  border: 1px solid var(--c-grey-light);
  padding: var(--size-spacing-tight);
}

._consent-container_z37i4n {
  padding: 30px 20px 20px;
  text-align: center;
}

@media only screen and (min-width: 768px) {
  ._consent-container_z37i4n {
    padding: 30px 50px 20px;
  }
}

._consent-title_z37i4n {
  color: var(--brand-primary);
  font-size: var(--size-font-body-1-medium-desktop);
  font-weight: var(--font-weight-header-1-desktop);
  line-height: var(--height-line-body-1-medium-mobile);
  margin-bottom: var(--size-spacing-tight);
  margin-top: var(--size-spacing-slight);
}

@media only screen and (min-width: 768px) {
  ._consent-title_z37i4n {
    font-size: 21px;
    line-height: var(--height-line-header-2-desktop);
  }
}

._consent-content_z37i4n {
  color: #333;
  font-size: var(--size-font-body-2-base-mobile);
  line-height: var(--height-line-body-3-base-mobile);
  margin-bottom: var(--size-spacing-slight);
  padding: 0;
}

@media only screen and (min-width: 768px) {
  ._consent-content_z37i4n {
    font-size: 15px;
    line-height: 20px;
  }
}

/* styles for @clarksource/client/components/messenger-window.css */
._messenger-window_kgc0l1 {
  align-self: flex-end;
  bottom: 0;
  bottom: var(--fixed-area-inset-bottom, 0);
  box-shadow:
    rgb(0 0 0 / 15%) 0 1px 1px 0,
    rgb(0 0 0 / 5%) -5px 5px 10px 0;
  display: none;
  flex: auto;
  flex-direction: column;
  height: calc(
    100% - 0 - 0
  );
  height: calc(
    100% - var(--fixed-area-inset-top, 0) - var(--fixed-area-inset-bottom, 0)
  );
  position: fixed;
  right: 0;
  top: 0;
  top: var(--fixed-area-inset-top, 0);
  width: 100%;
  z-index: 100;
}

@media only screen and (min-width: 730px) {
  ._messenger-window_kgc0l1 {
    /* 80px is the header height */
    height: calc(100% - 80px - 0);
    height: calc(100% - 80px - var(--fixed-area-inset-bottom, 0));
    top: 80px;
    width: 375px;
  }
}

._messenger-window_kgc0l1._open_kgc0l1 {
  display: flex;
}

._close_kgc0l1 {
  align-self: center;
  cursor: pointer;
  height: 24px;
  padding: 0 16px;
  position: absolute;
  right: 16px;
  top: 16px;
  width: 24px;
  z-index: 2;
}

._close_kgc0l1 svg {
  max-width: unset;
}

._close_kgc0l1 g {
  stroke: #c3cbd9;
}

._conversation_kgc0l1 {
  flex: 100%;
}

._pixel_kgc0l1 {
  display: none;
  visibility: hidden;
}

@media only screen and (min-width: 730px) {
  ._pixel_kgc0l1 {
    visibility: visible;
  }
}

._disable-body-scroll_kgc0l1 {
  height: 100%;
  overflow: hidden;
}

/* styles for @clarksource/client/components/messenger.css */
._messenger_1sdowm {
  bottom: 0;
  top: 0;
  width: 100%;
}

/* styles for @clarksource/client/components/mobile-next-button.css */
._button-fixed_koiymu {
  bottom: 24px;
  position: fixed !important;
  top: auto !important;
}

._button-sticky_koiymu {
  pointer-events: none; /* To make it possible to handle MouseEvent when button overlaps input */
  position: absolute !important;
}

button._button_koiymu {
  color: var(--color-assure);
  right: 24px;
  z-index: 101;
}

button._button_koiymu:active,
button._button_koiymu._pressed_koiymu {
  color: var(--color-safety-blue);
}

button._button_koiymu._disabled_koiymu {
  color: var(--color-silver-cup);
}

button._button_koiymu:focus {
  outline: none;
}

button._button_koiymu:focus::before {
  border: 0;
}

._cucumber-button-text_koiymu {
  display: none;
}

/* styles for @clarksource/client/components/payback-tos-modal.css */
._payback-card_49byhz {
  width: 100%;
}

._info-text_49byhz {
  margin-top: 5px;
}

/* styles for @clarksource/client/components/questionnaire-offer-modal.css */
/* stylelint-disable selector-class-pattern */
._container--questionnaire-offer-modal_wr7td7 {
  padding: 32px 16px 16px;
}

@media only screen and (min-width: 730px) {
  ._container--questionnaire-offer-modal_wr7td7 {
    padding: 32px;
  }

  ._container--questionnaire-offer-modal_wr7td7 ._questionnaire-offer-modal_wr7td7 {
    width: 400px;
  }
}

/* styles for @clarksource/client/components/rating-feedback.css */
._container-rating-feedback_1akxt5 {
  padding: 32px 16px 16px;
}

@media only screen and (min-width: 730px) {
  ._container-rating-feedback_1akxt5 {
    padding: 32px;
  }
}

@media only screen and (min-width: 730px) {
  ._modal-content-rating-feedback_1akxt5 {
    width: 400px;
  }
}

._cta-button_1akxt5 {
  width: 100%;
}

/* styles for @clarksource/client/components/recommendations/demandcheck-primer.css */
/* stylelint-disable font-family-no-missing-generic-family-keyword */
._header_f8070v {
  align-items: center;
  box-shadow: 0 2px 2px rgb(173 182 217 / 50%);
  display: flex;
  flex-direction: column;
  text-align: center;
}

._header_f8070v > * {
  max-width: 736px;
  padding: 0 16px;
}

._title_f8070v {
  color: #01051c;
  font-family: "Tiempos Headline";
  font-size: 28px;
  font-style: normal;
  font-weight: 600;
  line-height: 38px;
  margin-bottom: 0;
  margin-top: 64px;
}

._tagline_f8070v {
  color: #203151;
  font-weight: 500;
  margin-bottom: 24px;
}

._trust-icons_f8070v {
  margin: 16px 0;
}

._body_f8070v {
  align-items: center;
  display: flex;
  flex-direction: column;
  margin-bottom: 64px;
}

._body_f8070v > * {
  max-width: 500px;
  padding: 0 16px;
  width: 100%;
}

._body_f8070v > *:not(:first-child) {
  margin-top: 16px;
}

._body_f8070v > *._remind-me-later_f8070v {
  margin-top: 24px;
}

._answer-options_f8070v > ul > li:last-child {
  border-bottom: 0;
}

._continue_f8070v {
  width: 100%;
}

._remind-me-later_f8070v {
  text-align: center;
}

/* styles for @clarksource/client/components/shell/settings-route.css */
._wrapper_eympc7 {
  margin: 0 auto;
  max-width: 564px;
  padding: var(--size-spacing-tight);
  width: 100%;
}

._settings-section_eympc7 {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

._item_eympc7 {
  align-items: center;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding: var(--size-spacing-tight) var(--size-spacing-slight);
}

/* styles for @clarksource/client/components/shell/settings-route/toggle.css */
._label_2lsaai {
  transition: opacity 0.3s;
}

._label_2lsaai[aria-disabled]:not([aria-busy]) {
  opacity: 0.5;
}

/* styles for @clarksource/client/components/title-bar.css */
._more_oekncr {
  position: absolute;
  right: 16px;
}

/* styles for @clarksource/client/components/trustpilot-widget.css */
._trustpilot-widget_1l0vu7 {
  align-items: center;
  background-color: #cdf8eb;
  flex-direction: column;
  justify-content: center;
  padding: 8px;
  padding: var(--space-200, 8px);
  width: 100%;
}

/* styles for @clarksource/client/components/update-native-app-modal.css */
._container_3vyzgw {
  align-items: stretch;
  display: flex;
  flex-direction: column;
  height: 100vh;
  padding: 16px;
}

._body_3vyzgw {
  align-self: center;
}

._update-button_3vyzgw {
  margin-top: auto;
}

/* styles for @clarksource/client/styles/application.css */
.ember-a11y-refocus-skip-link {
  z-index: 522;
}

/* styles for @clarksource/client/styles/errors.css */
._css-modules-active-route-app_maldxw._css-modules-active-route-app_maldxw._css-modules-active-route-app_maldxw {
  background-color: var(--c-grey-lightest);
}

._css-modules-active-route-app_maldxw._css-modules-active-route-app_maldxw._css-modules-active-route-app_maldxw.clark2 {
  background-color: var(--light-bg);
}

/* styles for @clarksource/client/styles/fde-onboarding.css */
/* stylelint-disable selector-class-pattern */
:root {
  --header-outer-height: calc(env(safe-area-inset-top) + 112px);
  --header-inner-height: calc(env(safe-area-inset-top) + 44px);
  --header-height-difference: calc(
    var(--header-outer-height) - var(--header-inner-height)
  );
}

._contracts-wrapper_3hjjf2 {
  background-color: #f5f6fa;
  height: 100%;
}

._page-wrapper_3hjjf2 {
  height: auto;
  margin: 0 auto;
  max-width: 1200px;
  min-height: 100%;
  position: relative;
  width: 100%;
}

._card-list-container_3hjjf2 {
  height: 100vh;
}

._cards_3hjjf2 {
  height: auto;
  margin: 0 auto 8px;
  max-width: 714px;
  padding: 0 8px;
}

@media only screen and (min-width: 730px) {
  ._cards_3hjjf2 {
    margin-bottom: 16px;
  }
}

._header_3hjjf2 {
  align-items: baseline;
  display: flex;
  justify-content: space-between;
  margin-bottom: 16px;
  margin-top: 20px;
  padding-left: 8px;
  padding-right: 8px;
}

@media only screen and (min-width: 730px) {
  ._header_3hjjf2 {
    padding-left: 0;
    padding-right: 0;
  }
}

._title_3hjjf2 {
  color: var(--dark-2);
  font-size: 16px;
  font-weight: 500;
  line-height: 20px;
  margin: 0;
}

@media only screen and (min-width: 730px) {
  ._title_3hjjf2 {
    font-size: 20px;
    line-height: 28px;
  }
}

._greeting_3hjjf2 {
  color: #222326;
  color: var(--typography-main, #222326);
  font-family: "Tiempos Headline", sans-serif;
  font-size: var(--s3);
  line-height: 48px;
}

._header-top_3hjjf2 {
  background-color: #fff;
  box-shadow: 0 1px 0 rgb(0 0 0 / 6%);
  contain: content;
  display: flex;
  flex-direction: column;
  height: 80px;
  padding: 0;
  z-index: 5;
}

._header-top_3hjjf2,
._header-inner_3hjjf2 {
  position: -webkit-sticky;
  position: sticky;
}

._header-inner_3hjjf2 {
  align-self: center;
  height: calc(env(safe-area-inset-top) + 44px);
  height: var(--header-inner-height);
  max-width: 714px;
  padding-top: env(safe-area-inset-top);
  top: 0;
  width: 100%;
}

@media only screen and (max-width: 729.98px) {
  ._greeting_3hjjf2 {
    height: 56px;
    margin-top: var(--s-1);
    padding: 0 var(--s0) var(--s0);
  }

  ._header-top_3hjjf2 {
    height: calc(env(safe-area-inset-top) + 112px);
    height: var(--header-outer-height);
    margin-bottom: var(--s0);
    padding: unset;
    top: calc(calc(
    calc(env(safe-area-inset-top) + 112px) - calc(env(safe-area-inset-top) + 44px)
  ) * -1);
    top: calc(var(--header-height-difference) * -1);
  }
}

/* styles for @clarksource/client/styles/index/demandcheck/index/intro.css */
._css-modules-active-route-app_blz4hr._css-modules-active-route-app_blz4hr._css-modules-active-route-app_blz4hr._css-modules-active-route-app_blz4hr._css-modules-active-route-app_blz4hr._css-modules-active-route-app_blz4hr {
  background-color: var(--c-grey-lightest);
}

._css-modules-active-route-app_blz4hr._css-modules-active-route-app_blz4hr._css-modules-active-route-app_blz4hr._css-modules-active-route-app_blz4hr._css-modules-active-route-app_blz4hr._css-modules-active-route-app_blz4hr.clark2 {
  background-color: var(--light-bg);
}

/* styles for @clarksource/client/styles/index/invitations.css */
._css-modules-active-route-app_1w53wn._css-modules-active-route-app_1w53wn._css-modules-active-route-app_1w53wn._css-modules-active-route-app_1w53wn {
  background-color: var(--c-grey-lightest);
}

._css-modules-active-route-app_1w53wn._css-modules-active-route-app_1w53wn._css-modules-active-route-app_1w53wn._css-modules-active-route-app_1w53wn.clark2 {
  background-color: var(--light-bg);
}

/* styles for @clarksource/client/styles/index/invitees.css */
._css-modules-active-route-app_1lrvxw._css-modules-active-route-app_1lrvxw._css-modules-active-route-app_1lrvxw._css-modules-active-route-app_1lrvxw {
  background-color: var(--c-grey-lightest);
}

._css-modules-active-route-app_1lrvxw._css-modules-active-route-app_1lrvxw._css-modules-active-route-app_1lrvxw._css-modules-active-route-app_1lrvxw.clark2 {
  background-color: var(--light-bg);
}

/* styles for @clarksource/client/styles/index/manager/landing.css */
._css-modules-active-route-app_4po15h._css-modules-active-route-app_4po15h._css-modules-active-route-app_4po15h._css-modules-active-route-app_4po15h._css-modules-active-route-app_4po15h {
  background-color: var(--c-grey-lightest);
}

._css-modules-active-route-app_4po15h._css-modules-active-route-app_4po15h._css-modules-active-route-app_4po15h._css-modules-active-route-app_4po15h._css-modules-active-route-app_4po15h.clark2 {
  background-color: var(--light-bg);
}

/* styles for @clarksource/client/styles/index/messenger.css */
._css-modules-active-route-app_1iitxs._css-modules-active-route-app_1iitxs._css-modules-active-route-app_1iitxs._css-modules-active-route-app_1iitxs {
  background-color: var(--c-grey-lightest);
}

._css-modules-active-route-app_1iitxs._css-modules-active-route-app_1iitxs._css-modules-active-route-app_1iitxs._css-modules-active-route-app_1iitxs.clark2 {
  background-color: var(--light-bg);
}

/* styles for @clarksource/client/styles/index/questionnaire.css */
._css-modules-active-route-app_1yhv7s._css-modules-active-route-app_1yhv7s._css-modules-active-route-app_1yhv7s._css-modules-active-route-app_1yhv7s {
  background-color: var(--c-grey-lightest);
}

._css-modules-active-route-app_1yhv7s._css-modules-active-route-app_1yhv7s._css-modules-active-route-app_1yhv7s._css-modules-active-route-app_1yhv7s.clark2 {
  background-color: var(--light-bg);
}

/* styles for @clarksource/client/styles/index/retirement-check/index.css */
._css-modules-active-route-app_1ji6qq._css-modules-active-route-app_1ji6qq._css-modules-active-route-app_1ji6qq._css-modules-active-route-app_1ji6qq._css-modules-active-route-app_1ji6qq {
  background-color: var(--c-grey-lightest);
}

._css-modules-active-route-app_1ji6qq._css-modules-active-route-app_1ji6qq._css-modules-active-route-app_1ji6qq._css-modules-active-route-app_1ji6qq._css-modules-active-route-app_1ji6qq.clark2 {
  background-color: var(--light-bg);
}

/* styles for @clarksource/client/styles/loading.css */
._spinner_1x1287 {
  color: var(--color-assure);
  left: 50%;
  position: fixed;
  top: 50%;
  transform: translate(-50%, -50%);
}

/* styles for @clarksource/client/styles/sign-up/thank-you.css */
._brand-logo_1c7acf {
  display: inline-flex;
  height: 16px;
  margin: 60px 0 20px;
}

._brand-logo_1c7acf .clark-logo-fill {
  fill: var(--color-assure);
}

._container_1c7acf {
  color: var(--color-rich-black);
  font-family: Arial, Helvetica, sans-serif;
  margin: 0 24px;
  text-align: center;
}

._heading_1c7acf {
  font-size: var(--height-line-header-3-mobile);
  font-weight: var(--font-weight-intro-header-mobile);
  margin: 20px 0;
}

._content_1c7acf {
  font-size: var(--size-font-body-1-base-desktop);
  margin: 0 auto;
  max-width: 600px;
}

._actions_1c7acf {
  margin: 0 auto;
  max-width: 400px;
  padding-top: 28px;
}

._button_1c7acf {
  font-family: var(--font-family-base);
  font-size: var(--size-font-body-1-base-desktop);
  width: 100%;
}

/* styles for @clarksource/client/styles/signup-with-promocode.css */
._spinner_1a5g9c {
  color: var(--color-assure);
  left: 50%;
  position: fixed;
  top: 50%;
  transform: translate(-50%, -50%);
}

/* styles for @clarksource/client/styles/signup.css */
._spinner_18yv0f {
  color: var(--color-assure);
  left: 50%;
  position: fixed;
  top: 50%;
  transform: translate(-50%, -50%);
}