/*! - - - - - - - - - - - - - - - - *\

SASS library created by
Yuri van Essen

info@yurivanessen.nl
www.yurivanessen.nl

\* - - - - - - - - - - - - - - - - */
.color-attention {
    color: #ff6c6c
}

.color-primary {
    color: #4a4a4a
}

.font-bold {
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap
}

#fold-out h3 {
    cursor: pointer;
    padding-left: 2rem;
    transition: .15s ease-in-out;
    position: relative
}

#fold-out h3::before {
    content: "";
    position: absolute;
    background-image: url("../img/chevron.svg");
    background-repeat: no-repeat;
    background-size: 12px 34px;
    width: 12px;
    height: 34px;
    top: -10px;
    left: 0;
    transition: .15s ease-in-out
}

#fold-out h3:hover {
    color: #0bc6ea
}

#fold-out h3:hover::before {
    left: 4px;
    transform: rotate(90deg)
}

#fold-out h3:focus {
    color: #0bc6ea
}

#fold-out h3:focus::before {
    left: 4px;
    transform: rotate(90deg)
}

#fold-out h3:active {
    color: #0bc6ea
}

#fold-out h3:active::before {
    left: 4px;
    transform: rotate(90deg)
}

#fold-out h3.show::before {
    left: 4px;
    transform: rotate(90deg)
}

#fold-out .info-div {
    max-height: 0;
    overflow: hidden;
    transition: max-height .15s ease-out
}

#fold-out .info-div p {
    padding-left: 1rem
}

#fold-out .info-div p:last-of-type {
    margin-bottom: 2rem
}

#fold-out .info-div.show {
    max-height: 100vh;
    overflow: visible;
    transition: max-height .15s ease-in
}

#fold-out .even, #fold-out .odd {
    padding: 30px 0 5px 0
}

#fold-out .even {
    border-top: 1px solid #4a4a4a;
    border-bottom: 1px solid #4a4a4a;
    background-color: rgba(255, 255, 255, .5)
}

.toggliafico {
    padding: 15px 15px;
    display: flex;
    cursor: pointer;
    transition-property: opacity, filter;
    transition-duration: .15s;
    transition-timing-function: linear;
    font: inherit;
    color: inherit;
    text-transform: none;
    background-color: rgba(0, 0, 0, 0);
    border: 0;
    margin: 0;
    overflow: visible
}

.toggliafico:hover {
    opacity: 1
}

.toggliafico-box {
    width: 40px;
    height: 21px;
    display: inline-block;
    position: relative
}

.toggliafico-inner {
    display: block;
    top: 50%;
    margin-top: -1.5px
}

.toggliafico-inner, .toggliafico-inner::before, .toggliafico-inner::after {
    width: 40px;
    height: 3px;
    background-color: #4a4a4a;
    border-radius: 4px;
    position: absolute;
    transition-property: transform;
    transition-duration: .15s;
    transition-timing-function: ease
}

.toggliafico-inner::before, .toggliafico-inner::after {
    content: "";
    display: block
}

.toggliafico-inner::before {
    top: -9px
}

.toggliafico-inner::after {
    bottom: -9px
}

.toggliafico-emphatic {
    overflow: hidden
}

.toggliafico-emphatic .toggliafico-inner::before {
    left: 0;
    transition: transform .125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top .05s .125s linear, left .125s .175s ease-in
}

.toggliafico-emphatic .toggliafico-inner::after {
    top: 9px;
    right: 0;
    transition: transform .125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top .05s .125s linear, right .125s .175s ease-in
}

.toggliafico-emphatic.is-active .toggliafico-inner {
    transition-delay: 0s;
    transition-timing-function: ease-out;
    background-color: rgba(0, 0, 0, 0)
}

.toggliafico-emphatic.is-active .toggliafico-inner::before {
    left: -80px;
    top: -80px;
    transform: translate3d(80px, 80px, 0) rotate(45deg);
    transition: left .125s ease-out, top .05s .125s linear, transform .125s .175s cubic-bezier(0.075, 0.82, 0.165, 1)
}

.toggliafico-emphatic.is-active .toggliafico-inner::after {
    right: -80px;
    top: -80px;
    transform: translate3d(-80px, 80px, 0) rotate(-45deg);
    transition: right .125s ease-out, top .05s .125s linear, transform .125s .175s cubic-bezier(0.075, 0.82, 0.165, 1)
}

.wp-block-columns {
    display: flex
}

.wp-block-column {
    flex: 1
}

.gform_wrapper.gravity-theme .gf_progressbar_title {
    display: none
}

.gform_wrapper.gravity-theme .gf_progressbar_percentage.percentbar_blue {
    background-color: #0bc6ea;
    color: #fff
}

.gform_wrapper.gravity-theme .gf_progressbar_percentage {
    height: 26px
}

.gform_wrapper.gravity-theme .gf_progressbar_percentage span {
    margin-top: 4px;
    font-size: 18px
}

.gform_wrapper.gravity-theme .gf_progressbar_percentage.percentbar_0 span {
    position: relative;
    top: 4px;
    font-size: 18px
}

.gform_wrapper.gravity-theme .gfield_label {
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    font-size: 26px;
    line-height: 1.2;
    margin: 0;
    color: inherit;
    margin: 2rem 0 2rem 0;
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important
}

.gform_wrapper span.gfield_required {
    display: none
}

.gfield_radio .gchoice {
    background-color: #fff;
    border-radius: 10.5px 0 0 10.5px;
    margin: 1rem 0
}

.gfield_radio .gchoice .gfield-choice-input {
    visibility: hidden;
    opacity: 0;
    text-indent: -9999px;
    display: none
}

.gfield_radio .gchoice label {
    width: 100%;
    max-width: none !important;
    border-radius: 10.5px 0 0 10.5px;
    font-size: 18px !important;
    font-weight: 700;
    line-height: 24px;
    padding-left: 0;
    padding: 1.15rem;
    cursor: pointer;
    transition: .15s ease-in-out
}

.gfield_radio .gchoice label:hover {
    color: #fff !important;
    background-color: #00a6c8
}

.gfield_radio .gchoice label:focus {
    color: #fff !important;
    background-color: #00a6c8
}

.gfield_radio .gchoice label:active {
    color: #fff !important;
    background-color: #00a6c8
}

.gform_wrapper.gravity-theme .gform_footer button, .gform_wrapper.gravity-theme .gform_footer input, .gform_wrapper.gravity-theme .gform_page_footer button, .gform_wrapper.gravity-theme .gform_page_footer input {
    font-size: 1rem;
    display: inline-block;
    text-align: center;
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    border-radius: 4px;
    padding: .75rem 3rem;
    margin: 0;
    white-space: initial;
    transition: .15s ease-in-out;
    font-size: 20px;
    color: #fff;
    background: #ff6c6c;
    border: 1px solid #ff6c6c
}

.gform_wrapper.gravity-theme .gform_footer button:hover, .gform_wrapper.gravity-theme .gform_footer input:hover, .gform_wrapper.gravity-theme .gform_page_footer button:hover, .gform_wrapper.gravity-theme .gform_page_footer input:hover {
    color: #fff;
    background: #0bc6ea;
    border: 1px solid #0bc6ea
}

.gform_wrapper.gravity-theme .gform_footer button:focus, .gform_wrapper.gravity-theme .gform_footer input:focus, .gform_wrapper.gravity-theme .gform_page_footer button:focus, .gform_wrapper.gravity-theme .gform_page_footer input:focus {
    color: #fff;
    background: #0bc6ea;
    border: 1px solid #0bc6ea
}

.gform_wrapper.gravity-theme .gform_footer button:active, .gform_wrapper.gravity-theme .gform_footer input:active, .gform_wrapper.gravity-theme .gform_page_footer button:active, .gform_wrapper.gravity-theme .gform_page_footer input:active {
    color: #fff;
    background: #0bc6ea;
    border: 1px solid #0bc6ea
}

.gform_wrapper.gravity-theme .gform_previous_button.button, .gform_wrapper.gravity-theme .gform_previous_button.button__outline, .gform_wrapper.gravity-theme .gform_previous_button.button__block, .gform_wrapper.gravity-theme .gform_previous_button.button__attention, .gform_wrapper.gravity-theme .gform_previous_button.button__brand, .gform_wrapper.gravity-theme .gform_save_link.button, .gform_wrapper.gravity-theme .gform_save_link.button__outline, .gform_wrapper.gravity-theme .gform_save_link.button__block, .gform_wrapper.gravity-theme .gform_save_link.button__attention, .gform_wrapper.gravity-theme .gform_save_link.button__brand {
    color: #ff6c6c
}

img.gquiz-indicator {
    display: block;
    width: 26px;
    margin: 10px auto 0 auto
}

.gquiz-answer-explanation {
    font-size: 1.25rem;
    margin: 2rem 0
}

div[id^=gform_wrapper_] {
    max-width: 800px;
    margin: 0 auto
}

.swiper-button-prev:after, .swiper-button-next:after {
    display: none
}

.swiper-pagination {
    right: 1rem;
    top: 1rem
}

.article-swiper .swiper-slide .title-next {
    display: flex;
    align-items: flex-start
}

.article-swiper .swiper-slide .title-next .swiper-button-next, .article-swiper .swiper-slide .title-next .swiper-button-prev {
    position: relative;
    top: 0;
    right: 0;
    margin-top: 0;
    display: block;
    width: auto
}

.article-swiper .swiper-slide .title-next .swiper-button-next .chevron, .article-swiper .swiper-slide .title-next .swiper-button-prev .chevron {
    right: 0;
    width: 12px;
    position: relative;
    transition: .15s ease-in-out
}

.article-swiper .swiper-slide .title-next .swiper-button-next:hover .chevron, .article-swiper .swiper-slide .title-next .swiper-button-prev:hover .chevron {
    right: -4px
}

.article-swiper .swiper-slide .title-next .swiper-button-next:focus .chevron, .article-swiper .swiper-slide .title-next .swiper-button-prev:focus .chevron {
    right: -4px
}

.article-swiper .swiper-slide .title-next .swiper-button-next:active .chevron, .article-swiper .swiper-slide .title-next .swiper-button-prev:active .chevron {
    right: -4px
}

.swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    border: 1px solid #fff;
    opacity: 1;
    background-color: rgba(0, 0, 0, 0);
    cursor: pointer;
    margin: 0 .25rem;
    position: relative
}

.swiper-pagination-bullet-active {
    background-color: #fff
}

.swiper-pagination-bullet:hover {
    background-color: #fff
}

.swiper-pagination-bullet:focus {
    background-color: #fff
}

.swiper-pagination-bullet:active {
    background-color: #fff
}

.who {
    position: absolute;
    bottom: 1rem;
    left: 2rem;
    z-index: 2;
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    font-size: 15px
}

.who a {
    color: #fff
}

.switchery {
    background-color: #fff;
    border: 1px solid #dfdfdf;
    border-radius: 20px;
    cursor: pointer;
    display: inline-block;
    height: 30px;
    position: relative;
    vertical-align: middle;
    width: 50px;
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none;
    box-sizing: content-box;
    background-clip: content-box
}

.switchery > small {
    background: #fff;
    border-radius: 100%;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
    height: 30px;
    position: absolute;
    top: 0;
    width: 30px
}

.switchery-small {
    border-radius: 20px;
    height: 20px;
    width: 33px
}

.switchery-small > small {
    height: 20px;
    width: 20px
}

.switchery-large {
    border-radius: 40px;
    height: 40px;
    width: 66px
}

.switchery-large > small {
    height: 40px;
    width: 40px
}

#calculatorPage {
    transition: .75s ease-in-out;
    overflow: hidden
}

.scan__error {
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    font-size: .85rem;
    display: flex;
    color: #ff6c6c;
    max-height: 0;
    transition: max-height .5s ease-out;
    overflow: hidden;
    background: url("../img/alert.svg") 0 0 no-repeat;
    padding: 0 0 0 2rem
}

.scan__error span {
    transform: translateY(3px)
}

.scan__error--show {
    max-height: 500px;
    transition: max-height .5s ease-in
}

.hide-box {
    transition: .75s ease-in-out;
    height: 0;
    opacity: 0;
    position: absolute;
    z-index: -100
}

.show-box {
    transition: .75s ease-in-out;
    height: auto;
    opacity: 1;
    position: relative;
    z-index: 1
}

.more-info {
    cursor: pointer;
    position: relative;
    z-index: 99;
    margin-left: 1rem
}

.different-col {
    display: flex;
    justify-content: space-between;
    align-items: center
}

.fancybox-bg {
    background: rgba(74, 74, 74, .32)
}

.fancybox-button svg path {
    fill: #0bc6ea
}

.fancybox-content {
    max-width: 660px;
    border-radius: 20px;
    box-shadow: 0 0 99px 0 rgba(0, 0, 0, .16)
}

.fancybox-slide--image .fancybox-content {
    background-color: #fff
}

.quiz__step-divider {
    position: relative;
    margin-bottom: 0;
    margin-left: 10px
}

.quiz__step-divider .line {
    display: none;
    position: absolute;
    z-index: 1;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    height: 10px;
    background-color: #574d89
}

.quiz__step-divider .step-text {
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;
    transform: translate(-50%, calc(-50% - 6px));
    color: #574d89;
    font-size: 18px;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 3px;
    padding: .75rem 2rem;
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    background: #f4f4f4
}

a.link-quiz {
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    font-size: 16px;
    color: #574d89
}

a.link-quiz svg .a {
    fill: #574d89
}

a.link-quiz:hover {
    color: #0bc6ea
}

a.link-quiz:hover svg .a {
    fill: #0bc6ea
}

a.link-quiz:focus {
    color: #0bc6ea
}

a.link-quiz:focus svg .a {
    fill: #0bc6ea
}

a.link-quiz:active {
    color: #0bc6ea
}

a.link-quiz:active svg .a {
    fill: #0bc6ea
}

.thermometer-small {
    margin: -2rem 0 -3rem 0
}

.quiz-vrouw {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 10px
}

.quiz-map {
    width: 124px;
    height: 166px;
    -o-object-fit: cover;
    object-fit: cover
}

.quiz-kaart {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 10px
}

.wq_quizProgressBar {
    font-size: 1rem;
    line-height: 1.285;
    position: relative;
    box-sizing: initial;
    width: 100%;
    height: 28px;
    margin: 0 1px;
    text-align: center;
    color: #fff;
    border-radius: 10px
}

.wq_quizProgressBar > span {
    background-color: #0bc6ea;
    border-color: #0bc6ea;
    line-height: 1.75
}

.wq-quiz-trivia .wq_questionTextCtr, .wq-quiz.wq-skin-flat .wq_questionTextCtr {
    background-color: #f4f4f4;
    width: 100%
}

.wq-skin-traditional .wq_singleAnswerCtr, .wq-quiz.wq-skin-flat .wq_singleAnswerCtr {
    background-color: #fff;
    border: 0;
    padding: 1rem
}

.wq-skin-traditional .wq_singleAnswerCtr:hover, .wq-quiz.wq-skin-flat .wq_singleAnswerCtr:hover {
    color: #fff;
    background-color: #0bc6ea
}

.wq-skin-traditional .wq_singleAnswerCtr:focus, .wq-quiz.wq-skin-flat .wq_singleAnswerCtr:focus {
    color: #fff;
    background-color: #0bc6ea
}

.wq-skin-traditional .wq_singleAnswerCtr:active, .wq-quiz.wq-skin-flat .wq_singleAnswerCtr:active {
    color: #fff;
    background-color: #0bc6ea
}

.wq_singleAnswerCtr .wq_answerTxtCtr:before, .wq_singleAnswerCtr.chosen .wq_answerTxtCtr:after {
    top: 3px
}

.wq_singleAnswerCtr.chosen .wq_answerTxtCtr:after {
    top: 7px;
    left: 4px;
    border-radius: 0;
    width: 10px;
    height: 9px
}

.wq_singleAnswerCtr .wq_answerTxtCtr {
    line-height: 1.5
}

.wq_retakeQuizBtn, .wq-force-login button, .wq_singleQuestionWrapper .wq_continue button, .wq_triviaQuizTimerInfoCtr button, .wq-pay-locker button, .wq_quizEmailCtr form button, .wq-subscribe-locker button {
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    font-size: 20px;
    color: #fff;
    background: #ff6c6c;
    border: 1px solid #ff6c6c;
    text-decoration: none;
    padding: .75rem 3rem
}

html {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 16px;
    vertical-align: baseline;
    height: 100%
}

body {
    font-family: "Open Sans", Arial, sans-serif;
    color: #4a4a4a;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    background-color: #f4f4f4!important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

p {
    font-family: "Open Sans", Arial, sans-serif;
}

@media (min-width: 576px) {
    body {
        background-image: url("../img/body-ruler.svg");
        background-repeat: repeat-y;
        background-position: -1.5rem 0
    }
}

@media (min-width: 992px) {
    body {
        background-position: 0 0
    }
}

::-moz-selection {
    background: #0bc6ea;
    color: #fff
}

::selection {
    background: #0bc6ea;
    color: #fff
}

p:last-of-type {
    margin-bottom: 0
}

p:not(:last-of-type) {
    margin-bottom: 2rem
}

img {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
    border-style: none
}

table {
    margin: 0 0 18px 0;
    border-collapse: collapse;
    border-spacing: 0
}

.table-responsive {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch
}

td {
    padding: 4px 2px 4px 0;
    vertical-align: top;
    text-align: left
}

th {
    padding: 4px 2px 4px 0;
    vertical-align: top;
    text-align: left
}

hr {
    width: 100%;
    border: none 0;
    border-top: 1px solid #000;
    height: 1px;
    margin: 10px auto
}

hr.large {
    width: 75%
}

hr.medium {
    width: 50%
}

hr.small {
    width: 25%
}

hr.transparent {
    border-top: 1px solid rgba(0, 0, 0, 0);
    background-color: rgba(0, 0, 0, 0);
    height: 1px;
    padding: 0;
    margin: 0
}

em, i {
    font-style: italic
}

strong, b {
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap
}

sup {
    vertical-align: baseline;
    font-size: 1rem;
    position: relative;
    top: -6px
}

sub {
    vertical-align: baseline;
    font-size: 1rem;
    position: relative;
    bottom: -6px
}

small {
    font-size: .8em
}

fieldset {
    padding: 20px;
    border: 1px solid #474747;
    margin: 0 0 19px 0
}

legend {
    padding: 0 4px 0 4px
}

textarea, input {
    outline: none
}

figure {
    margin: 0
}

ul {
    margin-bottom: 2rem
}

ul.plus, ul.minus {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0
}

ul.plus li, ul.minus li {
    font-size: 19px;
    list-style: none;
    padding-left: 70px;
    margin-bottom: 1.5rem;
    position: relative;
    min-height: 46px
}

ul.plus li:before, ul.minus li:before {
    content: "";
    position: absolute;
    left: 0;
    top: 1px;
    width: 46px;
    height: 46px
}

ul.plus li:before {
    background-image: url("../img/li-plus.svg")
}

ul.minus li:before {
    background-image: url("../img/li-minus.svg")
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    margin: 0 0 19px 0
}

h1 {
    color: #0bc6ea;
    font-size: 64px;
    text-transform: uppercase;
    font-size: 44px
}

@media (min-width: 576px) {
    h1 {
        font-size: calc(5.2083333333vw + 14px)
    }
}

@media (min-width: 768px) {
    h1 {
        font-size: calc(4.4642857143vw + 19.7142857143px)
    }
}

@media (min-width: 992px) {
    h1 {
        font-size: 64px
    }
}

.subpage h1 {
    text-transform: none;
    font-size: 30px;
    font-size: 30px
}

@media (min-width: 576px) {
    .subpage h1 {
        font-size: calc(7.2916666667vw - 12px)
    }
}

@media (min-width: 768px) {
    .subpage h1 {
        font-size: calc(7.1428571429vw - 10.8571428571px)
    }
}

@media (min-width: 992px) {
    .subpage h1 {
        font-size: 60px
    }
}

h1.article {
    color: #4a4a4a;
    font-size: 80px;
    font-size: 33px
}

@media (min-width: 576px) {
    h1.article {
        font-size: calc(8.8541666667vw - 18px)
    }
}

@media (min-width: 768px) {
    h1.article {
        font-size: calc(9.375vw - 22px)
    }
}

@media (min-width: 992px) {
    h1.article {
        font-size: calc(4.3269230769vw + 28.0769230769px)
    }
}

@media (min-width: 1200px) {
    h1.article {
        font-size: 80px
    }
}

h2 {
    color: #4a4a4a;
    font-size: 38px;
    text-transform: uppercase;
    margin-bottom: 2rem;
    font-size: 26px
}

@media (min-width: 576px) {
    h2 {
        font-size: calc(2.0833333333vw + 14px)
    }
}

@media (min-width: 768px) {
    h2 {
        font-size: calc(3.5714285714vw + 2.5714285714px)
    }
}

@media (min-width: 992px) {
    h2 {
        font-size: 38px
    }
}

.subpage h2 {
    text-transform: none
}

h3 {
    color: #4a4a4a;
    font-size: 19px
}

.box__attention--alt h3 {
    font-size: 25px;
    margin: 0
}

.box__attention .title h3 {
    font-size: 25px;
    margin: 0
}

a {
    color: #0bc6ea;
    text-decoration: none;
    transition: .15s ease-in-out
}

a:hover {
    color: #ff6c6c;
    text-decoration: none;
    outline: none
}

a:focus {
    color: #ff6c6c;
    text-decoration: none;
    outline: none
}

a:active {
    color: #ff6c6c;
    text-decoration: none;
    outline: none
}

a.link {
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    font-size: 16px
}

a.link svg .a {
    fill: #0bc6ea;
    transition: .15s ease-in-out
}

a.link:hover {
    color: #574d89
}

a.link:hover svg .a {
    fill: #574d89
}

a.link:focus {
    color: #574d89
}

a.link:focus svg .a {
    fill: #574d89
}

a.link:active {
    color: #574d89
}

a.link:active svg .a {
    fill: #574d89
}

.link-dark {
    color: #00a6c8
}

input[type=submit] {
    transition: .15s ease-in-out
}

nav#site-nav ul#top-nav li {
    font-size: 15px;
    font-family: "Open Sans";
    color: #0bc6ea
}

nav#site-nav ul#top-nav li a {
    font-size: 15px;
    font-family: "Open Sans";
    color: #0bc6ea
}

nav#site-nav ul#top-nav li a:hover {
    color: #ff6c6c
}

nav#site-nav ul#top-nav li a:focus {
    color: #ff6c6c
}

nav#site-nav ul#top-nav li a:active {
    color: #ff6c6c
}

@media (min-width: 992px) {
    nav#site-nav ul#top-nav li a::after {
        padding-right: 1.25rem;
        content: "";
        border-right: 1px solid #0bc6ea
    }
}

nav#site-nav ul#top-nav li:last-child a {
    padding-right: 0
}

nav#site-nav ul#top-nav li:last-child a::after {
    display: none
}

nav#site-nav ul#main-nav li {
    font-size: 18px;
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    color: #4a4a4a
}

nav#site-nav ul#main-nav li a {
    font-size: 18px;
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    color: #4a4a4a;
    position: relative;
    overflow: hidden
}

nav#site-nav ul#main-nav li a::after {
    transition: .15s ease-in-out;
    position: absolute;
    content: "";
    height: 2px;
    background-color: #4a4a4a;
    width: calc(100% - 3rem);
    bottom: -2px;
    left: 1.5rem
}

nav#site-nav ul#main-nav li a:hover::after {
    bottom: 2px
}

nav#site-nav ul#main-nav li a:focus::after {
    bottom: 2px
}

nav#site-nav ul#main-nav li a:active::after {
    bottom: 2px
}

nav#site-nav ul#main-nav li:last-child a {
    margin-right: -1.5rem
}

nav#site-nav ul#main-nav li.doe-de-test {
    display: inline-flex;
    transition: .15s ease-in-out
}

nav#site-nav ul#main-nav li.doe-de-test a {
    padding: .5rem 1rem;
    color: #fff;
    background-color: #ff6c6c;
    border-radius: 3px
}

nav#site-nav ul#main-nav li.doe-de-test a::after {
    display: none
}

nav#site-nav ul#main-nav li.doe-de-test a:hover {
    background-color: #0bc6ea
}

nav#site-nav ul#main-nav li.doe-de-test a:hover::after {
    display: none
}

nav#site-nav ul#main-nav li.doe-de-test a:focus {
    background-color: #0bc6ea
}

nav#site-nav ul#main-nav li.doe-de-test a:focus::after {
    display: none
}

nav#site-nav ul#main-nav li.doe-de-test a:active {
    background-color: #0bc6ea
}

nav#site-nav ul#main-nav li.doe-de-test a:active::after {
    display: none
}

nav#site-nav .navbar-collapse {
    flex-direction: column;
    align-items: flex-end
}

@media (min-width: 992px) {
    .navbar-expand-lg ul#main-nav .nav-link {
        padding-right: 1.5rem;
        padding-left: 1.5rem
    }

    nav#site-nav ul#main-nav li.doe-de-test {
        margin-left: 1rem
    }
}

.navbar-toggler {
    padding: 0;
    display: flex
}

.navbar-toggler:focus {
    box-shadow: none
}

.header__nav {
    position: sticky;
    top: 0;
    z-index: 99;
    background-color: #fff
}

.header__banner {
    height: calc(100% - 97px);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative
}

.header__banner__risk {
    display: flex;
    position: relative;
    color: #fff;
    background-color: rgba(11, 198, 234, .9);
    border-radius: 10px
}

.header__banner__risk .thermometer {
    -o-object-fit: cover;
    object-fit: cover;
    position: absolute;
    display: none
}

.header__banner__risk .content {
    margin: 1rem;
    padding: 1rem;
    border-radius: 10px;
    border: 2px solid #fff;
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap
}

.header__banner__risk .content .sub-heading {
    color: #fff;
    font-size: 23px;
    margin-bottom: 1rem
}

.header__banner__risk .content h1 {
    color: #fff;
    font-size: 32px;
    line-height: 1;
    font-size: 32px
}

@media (min-width: 576px) {
    .header__banner__risk .content h1 {
        font-size: calc(5.2083333333vw + 2px)
    }
}

@media (min-width: 768px) {
    .header__banner__risk .content h1 {
        font-size: calc(9.8214285714vw - 33.4285714286px)
    }
}

@media (min-width: 992px) {
    .header__banner__risk .content h1 {
        font-size: 64px
    }
}

.header__banner__risk .content p:last-of-type {
    margin-bottom: 1rem
}

.header__banner .go-to-main {
    position: absolute;
    bottom: 0;
    left: calc(50% - 37.5px);
    width: 75px;
    height: 41px;
    background-color: rgba(11, 198, 234, .5);
    border-radius: 10px 10px 0 0;
    transition: .15s ease-in-out
}

.header__banner .go-to-main a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%
}

.header__banner .go-to-main img {
    transform: rotate(90deg);
    width: 13px
}

.header__banner .go-to-main:hover {
    background-color: #0bc6ea
}

.header__banner .go-to-main:focus {
    background-color: #0bc6ea
}

.header__banner .go-to-main:active {
    background-color: #0bc6ea
}

#logo-LDBZ .b, #logo-LDBZ .c, #logo-LDBZ .d {
    transition: .15s ease-in-out
}

#logo-LDBZ:hover .b, #logo-LDBZ:hover .c, #logo-LDBZ:hover .d {
    fill: #4a4a4a
}

#logo-LDBZ:focus .b, #logo-LDBZ:focus .c, #logo-LDBZ:focus .d {
    fill: #4a4a4a
}

#logo-LDBZ:active .b, #logo-LDBZ:active .c, #logo-LDBZ:active .d {
    fill: #4a4a4a
}

footer {
    border-bottom: 4px solid #0bc6ea;
    background-color: #f4f4f4;
    font-size: 14px
}

footer a.nav-link {
    color: #4a4a4a;
    font-size: 14px;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: .5rem
}

footer a.nav-link:hover {
    color: #0bc6ea
}

footer a.nav-link:focus {
    color: #0bc6ea
}

footer a.nav-link:active {
    color: #0bc6ea
}

footer ul {
    list-style: none;
    margin-bottom: 0;
    padding-left: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end
}

footer ul li {
    display: inline-flex;
    margin-bottom: 1rem
}

footer ul li:after {
    content: "";
    border-right: 1px solid #0bc6ea
}

footer ul li:last-child::after {
    display: none
}

.content-wrapper {
    padding-top: calc(19px * 5);
    padding-bottom: calc(19px * 5)
}

.mt-10 {
    margin-top: calc(19px * 10) !important
}

.mt-15 {
    margin-top: calc(19px * 15) !important
}

.mb-10 {
    margin-bottom: calc(19px * 10) !important
}

.mb-15 {
    margin-bottom: calc(19px * 15) !important
}

.mt-n10 {
    margin-top: calc(-19px * 10) !important
}

.mt-n15 {
    margin-top: calc(-19px * 15) !important
}

.mb-n10 {
    margin-bottom: calc(-19px * 10) !important
}

.mb-n15 {
    margin-bottom: calc(-19px * 15) !important
}

.my-10 {
    margin-top: calc(19px * 10) !important;
    margin-bottom: calc(19px * 10) !important
}

.my-15 {
    margin-top: calc(19px * 15) !important;
    margin-bottom: calc(19px * 15) !important
}

.my-n10 {
    margin-top: calc(-19px * 10) !important;
    margin-bottom: calc(-19px * 10) !important
}

.my-n15 {
    margin-top: calc(-19px * 15) !important;
    margin-bottom: calc(-19px * 15) !important
}

.pt-10 {
    padding-top: calc(19px * 10) !important
}

.pt-15 {
    padding-top: calc(19px * 15) !important
}

.pb-10 {
    padding-bottom: calc(19px * 10) !important
}

.pb-15 {
    padding-bottom: calc(19px * 15) !important
}

.py-10 {
    padding-top: calc(19px * 10) !important;
    padding-bottom: calc(19px * 10) !important
}

.py-15 {
    padding-top: calc(19px * 15) !important;
    padding-bottom: calc(19px * 15) !important
}

.content__padding--y {
    padding-top: 4rem;
    padding-bottom: 4rem
}

.content__padding--X {
    padding-top: 4rem;
    padding-bottom: 4rem
}

.content__margin--y {
    margin-top: 4rem;
    margin-bottom: 4rem
}

.content__margin--X {
    margin-top: 4rem;
    margin-bottom: 4rem
}

.container--ruler {
    position: relative
}

.container--ruler::before {
    position: absolute;
    width: 246px;
    height: 59px;
    top: -1rem;
    left: calc(50% - 123px);
    content: "";
    background-image: url("../img/ruler-brand.svg");
    background-repeat: no-repeat
}

.box__purple {
    color: #fff;
    background-color: #574d89;
    border-radius: 10px;
    overflow: hidden;
    margin-top: 40px;
    height: 100%;
    box-shadow: 20px -40px 0 0 rgba(87, 77, 137, .2)
}

.box__purple h2 {
    color: #0bc6ea;
    font-size: 30px;
    text-transform: none;
    font-size: 22px
}

@media (min-width: 576px) {
    .box__purple h2 {
        font-size: calc(1.0416666667vw + 16px)
    }
}

@media (min-width: 768px) {
    .box__purple h2 {
        font-size: calc(2.6785714286vw + 3.4285714286px)
    }
}

@media (min-width: 992px) {
    .box__purple h2 {
        font-size: 30px
    }
}

.box__purple h2 a {
    color: #0bc6ea
}

.box__purple h2 a::before, .box__purple h2 a::after {
    color: #0bc6ea
}

.box__purple h2 a:hover {
    color: #fff
}

.box__purple h2 a:hover::before, .box__purple h2 a:hover::after {
    color: #fff
}

.box__purple h2 a:focus {
    color: #fff
}

.box__purple h2 a:focus::before, .box__purple h2 a:focus::after {
    color: #fff
}

.box__purple h2 a:active {
    color: #fff
}

.box__purple h2 a:active::before, .box__purple h2 a:active::after {
    color: #fff
}

.box__purple h3 {
    color: #fff
}

.box__brand {
    color: #fff;
    background-color: #0bc6ea;
    border-radius: 10px;
    overflow: hidden;
    margin-top: 40px;
    height: 100%;
    box-shadow: 20px -40px 0 0 rgba(11, 198, 234, .2)
}

.box__brand.gradient {
    background: #00a6c8;
    background: linear-gradient(45deg, rgb(0, 166, 200) 0%, rgb(11, 198, 234) 100%)
}

.box__brand h1, .box__brand h2, .box__brand h3, .box__brand h4, .box__brand h5, .box__brand h6 {
    color: #fff
}

.box__white, .box__white--quiz, .box__white--active {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    margin-left: .5rem;
    margin-right: .5rem;
    margin-bottom: 1rem;
    border: 1px solid rgba(0, 0, 0, 0);
    background-color: #fcfcfc;
    border-radius: 10px;
    overflow: hidden;
    margin-top: 40px;
    padding: 1rem;
    transition: .15s ease-in-out;
    box-shadow: 20px -40px 0 0 rgba(74, 74, 74, .1)
}

.box__white .option, .box__white--quiz .option, .box__white--active .option {
    width: 100%;
    display: flex;
    text-transform: uppercase;
    color: #0bc6ea;
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    margin-bottom: 3rem;
    position: relative;
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap
}

.box__white .option::after, .box__white--quiz .option::after, .box__white--active .option::after {
    position: absolute;
    content: "";
    background-color: #0bc6ea;
    width: 100%;
    height: 1px;
    bottom: -10px;
    left: 0
}

.box__white .content, .box__white--quiz .content, .box__white--active .content {
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: flex-start
}

.box__white h3, .box__white--quiz h3, .box__white--active h3 {
    margin-bottom: 2rem
}

.box__white p:last-of-type, .box__white--quiz p:last-of-type, .box__white--active p:last-of-type {
    margin-top: 2rem
}

.box__white a.link, .box__white--quiz a.link, .box__white--active a.link {
    color: #4a4a4a
}

.box__white a.link svg .a, .box__white--quiz a.link svg .a, .box__white--active a.link svg .a {
    fill: #4a4a4a
}

.box__white a.link:hover, .box__white--quiz a.link:hover, .box__white--active a.link:hover {
    color: #ff6c6c
}

.box__white a.link:hover svg .a, .box__white--quiz a.link:hover svg .a, .box__white--active a.link:hover svg .a {
    fill: #0bc6ea
}

.box__white a.link:focus, .box__white--quiz a.link:focus, .box__white--active a.link:focus {
    color: #ff6c6c
}

.box__white a.link:focus svg .a, .box__white--quiz a.link:focus svg .a, .box__white--active a.link:focus svg .a {
    fill: #0bc6ea
}

.box__white a.link:active, .box__white--quiz a.link:active, .box__white--active a.link:active {
    color: #ff6c6c
}

.box__white a.link:active svg .a, .box__white--quiz a.link:active svg .a, .box__white--active a.link:active svg .a {
    fill: #0bc6ea
}

.box__white:hover, .box__white--quiz:hover, .box__white--active:hover {
    border: 1px solid rgba(74, 74, 74, .5)
}

.box__white:focus, .box__white--quiz:focus, .box__white--active:focus {
    border: 1px solid rgba(74, 74, 74, .5)
}

.box__white:active, .box__white--quiz:active, .box__white--active:active {
    border: 1px solid rgba(74, 74, 74, .5)
}

.box__white--active {
    background-color: #0bc6ea;
    box-shadow: 20px -40px 0 0 rgba(11, 198, 234, .1)
}

.box__white--active .option {
    color: #fff;
    position: relative
}

.box__white--active .option::after {
    background-color: #fff
}

.box__white--active .option .logo-diap {
    position: absolute;
    z-index: 1;
    right: 0;
    top: 7px;
    background-color: #0bc6ea
}

.box__white--active a.link:hover {
    color: #fff
}

.box__white--active a.link:focus {
    color: #fff
}

.box__white--active a.link:active {
    color: #fff
}

.box__white--quiz {
    box-shadow: 10px -10px 0 0 rgba(87, 77, 137, .2);
    height: auto;
    overflow: visible;
    font-size: 19px;
    padding-top: 3rem;
    margin-bottom: 3rem;
    margin-top: 0;
    margin-bottom: 0
}

.box__white--quiz h3 {
    font-size: 30px;
    color: #574d89;
    margin-bottom: 1rem
}

.box__white--quiz.quiz-sub {
    text-align: left;
    font-size: 1rem
}

.box__white--quiz.quiz-sub h2 {
    color: #574d89;
    font-size: 26px
}

.box__white.no-hover, .no-hover.box__white--active, .no-hover.box__white--quiz {
    border: none
}

.box__white .form-input, .box__white--active .form-input, .box__white--quiz .form-input {
    font-size: 19px;
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    border-radius: 4px;
    padding: 12px 20px 9px 20px;
    margin-bottom: 0;
    background-color: #f4f4f4;
    box-shadow: inset 0px 2px 0px 0 rgba(0, 0, 0, .16)
}

.box__white .form-input::-moz-placeholder, .box__white--active .form-input::-moz-placeholder, .box__white--quiz .form-input::-moz-placeholder {
    color: #bfbfbf;
    opacity: 1
}

.box__white .form-input::placeholder, .box__white--active .form-input::placeholder, .box__white--quiz .form-input::placeholder {
    color: #bfbfbf;
    opacity: 1
}

.box__white .form-input:-ms-input-placeholder, .box__white--active .form-input:-ms-input-placeholder, .box__white--quiz .form-input:-ms-input-placeholder {
    color: #bfbfbf
}

.box__white .form-input::-ms-input-placeholder, .box__white--active .form-input::-ms-input-placeholder, .box__white--quiz .form-input::-ms-input-placeholder {
    color: #bfbfbf
}

.box__white .form-input:hover, .box__white--active .form-input:hover, .box__white--quiz .form-input:hover {
    border-color: #f4f4f4
}

.box__white .form-input:focus, .box__white--active .form-input:focus, .box__white--quiz .form-input:focus {
    border-color: #f4f4f4
}

.box__white .form-input:active, .box__white--active .form-input:active, .box__white--quiz .form-input:active {
    border-color: #f4f4f4
}

.box__white .form-input.transparent, .box__white--active .form-input.transparent, .box__white--quiz .form-input.transparent {
    color: #4a4a4a;
    box-shadow: none;
    background-color: rgba(0, 0, 0, 0);
    border: 0;
    font-size: 19px;
    font-weight: 700;
    padding: 8px 16px 2px 12px;
    margin: 0;
    width: auto;
    min-width: 60px
}

.box__white .form-input.transparent::-moz-placeholder, .box__white--active .form-input.transparent::-moz-placeholder, .box__white--quiz .form-input.transparent::-moz-placeholder {
    color: #4a4a4a;
    opacity: 1
}

.box__white .form-input.transparent::placeholder, .box__white--active .form-input.transparent::placeholder, .box__white--quiz .form-input.transparent::placeholder {
    color: #4a4a4a;
    opacity: 1
}

.box__white .form-input.transparent:-ms-input-placeholder, .box__white--active .form-input.transparent:-ms-input-placeholder, .box__white--quiz .form-input.transparent:-ms-input-placeholder {
    color: #4a4a4a
}

.box__white .form-input.transparent::-ms-input-placeholder, .box__white--active .form-input.transparent::-ms-input-placeholder, .box__white--quiz .form-input.transparent::-ms-input-placeholder {
    color: #4a4a4a
}

.box__white .form-input.transparent.visible, .box__white--active .form-input.transparent.visible, .box__white--quiz .form-input.transparent.visible {
    color: #0bc6ea;
    background-color: #f4f4f4;
    box-shadow: inset 0px 2px 0px 0 rgba(0, 0, 0, .16)
}

.box__lightbrand {
    background-color: #daf6fc;
    border-radius: 10px
}

.box__gray {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    margin-left: .5rem;
    margin-right: .5rem;
    margin-bottom: 1rem;
    border: 1px solid rgba(0, 0, 0, 0);
    background-color: #f4f4f4;
    border-radius: 10px;
    overflow: hidden;
    margin-top: 40px;
    transition: .15s ease-in-out;
    box-shadow: 20px -40px 0 0 rgba(74, 74, 74, .1)
}

.box__gray .option {
    width: 100%;
    display: flex;
    text-transform: uppercase;
    color: #0bc6ea;
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    margin-bottom: 3rem;
    position: relative;
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap
}

.box__gray .option::after {
    position: absolute;
    content: "";
    background-color: #0bc6ea;
    width: 100%;
    height: 1px;
    bottom: -10px;
    left: 0
}

.box__gray .content {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    font-size: 19px
}

.box__gray .content a {
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    color: #4a4a4a
}

.box__gray .content a:hover {
    color: #0bc6ea
}

.box__gray .content a:focus {
    color: #0bc6ea
}

.box__gray .content a:active {
    color: #0bc6ea
}

.box__gray h3 {
    color: #ff6c6c;
    font-size: 28px;
    margin-bottom: 1rem
}

.box__gray p:last-of-type {
    margin-top: 2rem
}

.box__gray figure {
    border-radius: 20px 0 0 20px;
    overflow: hidden;
    width: 100%;
    height: 100%
}

.box__gray figure img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.box__gray a.link {
    color: #4a4a4a
}

.box__gray a.link svg .a {
    fill: #4a4a4a
}

.box__gray a.link:hover {
    color: #ff6c6c
}

.box__gray a.link:hover svg .a {
    fill: #0bc6ea
}

.box__gray a.link:focus {
    color: #ff6c6c
}

.box__gray a.link:focus svg .a {
    fill: #0bc6ea
}

.box__gray a.link:active {
    color: #ff6c6c
}

.box__gray a.link:active svg .a {
    fill: #0bc6ea
}

.box__attention {
    height: 100%;
    margin-bottom: 1rem;
    background-color: #ff6c6c;
    border-radius: 10px;
    overflow: hidden;
    margin-top: 40px;
    padding: 2rem;
    color: #fff;
    transition: .15s ease-in-out;
    box-shadow: 20px -40px 0 0 rgba(255, 108, 108, .1)
}

.box__attention .title a {
    display: flex;
    align-items: flex-start;
    justify-content: space-between
}

.box__attention .title a h3 {
    color: #fff;
    padding-right: 1rem
}

.box__attention .title a h3 span, .box__attention .title a h3 strong, .box__attention .title a h3 em {
    color: rgba(255, 255, 255, .61)
}

.box__attention .title a img.chevron {
    flex-shrink: 0;
    width: 12px;
    right: 0;
    position: relative;
    transition: .15s ease-in-out
}

.box__attention figure {
    display: flex;
    justify-content: center;
    margin: 2rem 0 0 0;
    transform: scale(1);
    transition: .15s ease-in-out
}

.box__attention:hover .title a img.chevron {
    right: -4px
}

.box__attention:hover figure {
    transform: scale(1.2)
}

.box__attention:focus .title a img.chevron {
    right: -4px
}

.box__attention:focus figure {
    transform: scale(1.2)
}

.box__attention:active .title a img.chevron {
    right: -4px
}

.box__attention:active figure {
    transform: scale(1.2)
}

.box__news, .box__news--small {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    margin: 40px .5rem 1rem .5rem;
    border: 1px solid rgba(0, 0, 0, 0);
    background-color: #f4f4f4;
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    transition: .15s ease-in-out;
    box-shadow: 20px -40px 0 0 rgba(74, 74, 74, .1)
}

.box__news .content, .box__news--small .content {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 1rem 1.25rem
}

.box__news .content time, .box__news--small .content time {
    font-size: 14px
}

.box__news .content svg, .box__news--small .content svg {
    flex-shrink: 0;
    width: 12px
}

.box__news .content svg .a, .box__news--small .content svg .a {
    transition: .15s ease-in-out
}

.box__news figure, .box__news--small figure {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 1rem 0 0 0;
    border-radius: 0 0 10px 10px
}

.box__news figure figcaption, .box__news--small figure figcaption {
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    font-size: 18px;
    padding-left: 1.25rem;
    position: relative;
    top: -1.25rem;
    transition: .15s ease-in-out
}

.box__news figure img, .box__news--small figure img {
    width: 100%;
    height: 200px;
    -o-object-fit: cover;
    object-fit: cover;
    transform: scale(1);
    transform-origin: right center;
    transition: .15s ease-in-out
}

.box__news--small {
    height: auto
}

.box__news:hover, .box__news--small:hover {
    background-color: #fff
}

.box__news:hover .content svg .a, .box__news--small:hover .content svg .a {
    fill: #0bc6ea
}

.box__news:hover figure figcaption, .box__news--small:hover figure figcaption {
    top: calc(-1.25rem - 20px)
}

.box__news:hover figure img, .box__news--small:hover figure img {
    transform: scale(1.1)
}

.box__news:focus, .box__news--small:focus {
    background-color: #fff
}

.box__news:focus .content svg .a, .box__news--small:focus .content svg .a {
    fill: #0bc6ea
}

.box__news:focus figure figcaption, .box__news--small:focus figure figcaption {
    top: calc(-1.25rem - 20px)
}

.box__news:focus figure img, .box__news--small:focus figure img {
    transform: scale(1.1)
}

.box__news:active, .box__news--small:active {
    background-color: #fff
}

.box__news:active .content svg .a, .box__news--small:active .content svg .a {
    fill: #0bc6ea
}

.box__news:active figure figcaption, .box__news--small:active figure figcaption {
    top: calc(-1.25rem - 20px)
}

.box__news:active figure img, .box__news--small:active figure img {
    transform: scale(1.1)
}

.box__news.quiz, .quiz.box__news--small {
    background-color: #fff;
    height: calc(100% - 40px)
}

.box__news.quiz .content, .quiz.box__news--small .content {
    align-items: flex-end
}

.box__news.quiz figure figcaption, .quiz.box__news--small figure figcaption {
    text-align: left;
    font-size: 18px;
    padding-left: 1rem;
    padding-right: 1rem;
    transition: .15s ease-in-out
}

.box__change {
    color: #4a4a4a;
    background-color: #f4f4f4;
    border-radius: 10px;
    overflow: hidden;
    margin-top: 40px;
    height: 100%;
    box-shadow: 20px -40px 0 0 rgba(11, 198, 234, .2)
}

.box__change figure {
    border-radius: 20px 0 0 20px;
    overflow: hidden
}

.box__change figure img {
    -o-object-fit: cover;
    object-fit: cover;
    max-height: 600px
}

.box__change .content {
    font-size: 19px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%
}

.box__change .content h2 {
    font-size: 30px;
    font-size: 26px;
    text-transform: uppercase;
    margin-bottom: 2rem
}

@media (min-width: 576px) {
    .box__change .content h2 {
        font-size: calc(2.0833333333vw + 14px)
    }
}

@media (min-width: 768px) {
    .box__change .content h2 {
        font-size: calc(0vw + 30px)
    }
}

@media (min-width: 992px) {
    .box__change .content h2 {
        font-size: 30px
    }
}

.box__change h1, .box__change h2, .box__change h3, .box__change h4, .box__change h5, .box__change h6 {
    color: #4a4a4a
}

.shade__brand, .shade__brand--video {
    display: inline-flex;
    color: #fff;
    border-radius: 10px;
    margin-top: 40px;
    box-shadow: 20px -20px 0 0 rgba(11, 198, 234, .2)
}

.shade__brand h1, .shade__brand--video h1, .shade__brand h2, .shade__brand--video h2, .shade__brand h3, .shade__brand--video h3, .shade__brand h4, .shade__brand--video h4, .shade__brand h5, .shade__brand--video h5, .shade__brand h6, .shade__brand--video h6 {
    color: #fff
}

.shade__brand--video {
    position: relative
}

.shade__brand--video .play-button {
    width: 55px;
    position: absolute;
    top: calc(50% - 27.5px);
    left: calc(50% - 27.5px);
    transition: .15s ease-in-out;
    transform: scale(1)
}

.shade__brand--video a:hover .play-button {
    transform: scale(1.1)
}

.shade__brand--video a:focus .play-button {
    transform: scale(1.1)
}

.shade__brand--video a:active .play-button {
    transform: scale(1.1)
}

.article__img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    position: absolute;
    position: relative;
    z-index: 1
}

.article__img--single {
    border-radius: 10px
}

.calculator__page h1 {
    color: #4a4a4a;
    font-size: 44px;
    text-transform: unset;
    font-weight: bold;
}

.calculator__page h2 {
    color: #0bc6ea;
    font-size: 26px;
    text-transform: none;
}

.calculator__page .total-amount {
    font-family: "Open Sans";
    font-weight: bold;
    font-style: normal;
    font-display: swap;
    font-size: 40px
}

.calculator__page .box__white, .calculator__page .box__white--active, .calculator__page .box__white--quiz, .calculator__page .box__purple, .calculator__page .box__lightbrand {
    height: auto;
    border-radius: 20px
}

.calculator__page .box__white .button__attention, .calculator__page .box__white--active .button__attention, .calculator__page .box__white--quiz .button__attention {
    width: 100%
}

.calculator__page .box__purple {
    box-shadow: none
}

.calculator__page .box__purple h2 {
    color: #fff;
    font-size: 28px;
    font-weight: bold;
    margin-bottom: 0
}

.calculator__page .box__purple a {
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    color: #fff;
    text-decoration: underline
}

.calculator__page .box__purple a:hover {
    text-decoration: none
}

.calculator__page .box__purple a:focus {
    text-decoration: none
}

.calculator__page .box__purple a:active {
    text-decoration: none
}

.calculator__page .box__white, .calculator__page .box__white--active, .calculator__page .box__white--quiz, .calculator__page .box__purple, .calculator__page .box__lightbrand {
    padding: 1rem
}

.calculator__page .box__white label, .calculator__page .box__white--active label, .calculator__page .box__white--quiz label, .calculator__page .box__purple label, .calculator__page .box__lightbrand label {
    cursor: pointer;
    font-family: "Open Sans";
    font-weight: bold;
    font-display: swap;
    font-size: 19px
}

.calculator__page .box__white label.label-checkbox, .calculator__page .box__white label.label-checkbox--small, .calculator__page .box__white--active label.label-checkbox, .calculator__page .box__white--active label.label-checkbox--small, .calculator__page .box__white--quiz label.label-checkbox, .calculator__page .box__white--quiz label.label-checkbox--small, .calculator__page .box__purple label.label-checkbox, .calculator__page .box__purple label.label-checkbox--small, .calculator__page .box__lightbrand label.label-checkbox, .calculator__page .box__lightbrand label.label-checkbox--small {
    font-family: "Open Sans";
    padding-left: 1rem
}

.calculator__page .box__white label.label-checkbox--small, .calculator__page .box__white--active label.label-checkbox--small, .calculator__page .box__white--quiz label.label-checkbox--small, .calculator__page .box__purple label.label-checkbox--small, .calculator__page .box__lightbrand label.label-checkbox--small {
    font-size: 14px
}

.calculator__page input[type=range] {
    -webkit-appearance: none;
    margin: 20px 0;
    width: 100%
}

.calculator__page input[type=range]:focus {
    outline: none
}

.calculator__page input[type=range]::-webkit-slider-runnable-track {
    width: 100%;
    height: 4px;
    cursor: pointer;
    -webkit-transition: .15s ease-in-out;
    transition: .15s ease-in-out;
    background: #0bc6ea;
    border-radius: 25px
}

.calculator__page input[type=range]::-webkit-slider-thumb {
    height: 26px;
    width: 26px;
    border-radius: 50%;
    background: #0bc6ea;
    border: 1px solid rgba(255, 255, 255, .25);
    box-shadow: 0 0 2px 0 rgba(0, 0, 0, .44);
    cursor: pointer;
    -webkit-appearance: none;
    margin-top: -11px
}

.calculator__page input[type=range]:focus::-webkit-slider-runnable-track {
    background: #0bc6ea
}

.calculator__page .range-wrap {
    width: 100%;
    position: relative
}

.calculator__page .range-value {
    position: absolute;
    top: 0
}

.calculator__page .range-value span {
    font-size: 16px;
    background-color: #fff;
    color: #4a4a4a;
    text-align: center;
    display: block;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -10px);
    padding: 8px 1rem 4px 1rem
}

.calculator__page .range-value span:before {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border-top: 10px solid #fff;
    border-left: 5px solid rgba(0, 0, 0, 0);
    border-right: 5px solid rgba(0, 0, 0, 0);
    top: 100%;
    left: 50%;
    margin-left: -5px;
    margin-top: -1px
}

.normal-box-padding {
    padding: 2rem
}

.normal-box-padding h2 {
    margin-bottom: 0;
    position: relative;
    margin-top: 40px
}

.normal-box-padding h2::before {
    position: absolute;
    top: -40px;
    left: 0;
    content: "“";
    font-size: 58px;
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap
}

.affiliated-branches {
    background: #fff;
    border-radius: 10px
}

.slider__wrapper {
    background-color: #fff;
    border-radius: 10px
}

.blue__block {
    padding: 3rem 3rem;
    font-size: 19px;
    line-height: 1.7;
    color: #4a4a4a;
    background-color: rgba(11, 198, 234, .11);
    border-radius: 10px
}

.blue__block a {
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    color: #0bc6ea
}

.absolute-href {
    position: absolute;
    z-index: 1;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.intro-text {
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    font-size: 19px
}

.homepage .intro-text {
    font-size: 16px
}

.font-large {
    font-size: 19px
}

.font-xl-large {
    font-size: 26px
}

.logo-label {
    margin-top: 1rem;
    width: 40px;
    height: 40px
}

.logo-label .b, .logo-label .c, .logo-label .d {
    fill: #4a4a4a
}

.ttu {
    text-transform: uppercase !important
}

.ttn {
    text-transform: none
}

.breadcrumbs {
    font-size: 1rem
}

.breadcrumbs a {
    color: #4a4a4a;
    text-decoration: underline
}

.breadcrumbs a:hover {
    text-decoration: none
}

.breadcrumbs a:focus {
    text-decoration: none
}

.breadcrumbs a:active {
    text-decoration: none
}

.category {
    color: #0bc6ea;
    font-size: 25px;
    text-align: center
}

.toolkit__item .bg-white {
    transition: .15s ease-in-out
}

.toolkit__item:hover .bg-white {
    background-color: #0bc6ea !important
}

.toolkit__item:hover a {
    color: #fff !important
}

.toolkit__item:focus .bg-white {
    background-color: #0bc6ea !important
}

.toolkit__item:focus a {
    color: #fff !important
}

.toolkit__item:active .bg-white {
    background-color: #0bc6ea !important
}

.toolkit__item:active a {
    color: #fff !important
}

.toolkit__img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.video-img {
    width: 100%;
    height: 200px;
    -o-object-fit: cover;
    object-fit: cover
}

.organisation__row-bg {
    margin: 12px 0;
    padding: 1.25rem 1rem;
    border-radius: 10px;
    background-color: rgba(11, 198, 234, .11)
}

.organisation__row-bg a {
    color: #00a6c8
}

.organisation__row-bg a:hover {
    color: #ff6c6c
}

.organisation__row-bg a:focus {
    color: #ff6c6c
}

.organisation__row-bg a:active {
    color: #ff6c6c
}

.rotate-180 {
    top: -1px;
    position: relative;
    transform: rotate(180deg)
}

.affiliated-partners {
    font-size: 25px;
    color: #00a6c8;
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap
}

.bdrs {
    border-radius: 10px
}

.hide-first-p p:first-of-type {
    display: none
}

.quiz__wrapper .gform_previous_button, .quiz__wrapper .gform_next_button {
    width: 90%;
    margin-bottom: 1rem
}

.sticky-post .box__news, .sticky-post .box__news--small {
    flex-direction: row;
    color: #fff;
    background-color: #0bc6ea
}

.sticky-post .box__news .content, .sticky-post .box__news--small .content {
    display: flex;
    flex-direction: column;
    text-align: left;
    justify-content: center
}

.sticky-post .box__news .content p, .sticky-post .box__news--small .content p {
    font-size: 1.1rem;
    font-weight: 600
}

.sticky-post .box__news .content svg, .sticky-post .box__news--small .content svg {
    fill: #fff
}

.sticky-post .box__news:hover, .sticky-post .box__news--small:hover {
    background-color: #00a6c8
}

.sticky-post .box__news:hover .content svg .a, .sticky-post .box__news--small:hover .content svg .a {
    fill: #fff
}

.sticky-post .box__news:hover figure img, .sticky-post .box__news--small:hover figure img {
    transform: scale(1)
}

.sticky-post .box__news:focus, .sticky-post .box__news--small:focus {
    background-color: #00a6c8
}

.sticky-post .box__news:focus .content svg .a, .sticky-post .box__news--small:focus .content svg .a {
    fill: #fff
}

.sticky-post .box__news:focus figure img, .sticky-post .box__news--small:focus figure img {
    transform: scale(1)
}

.sticky-post .box__news:active, .sticky-post .box__news--small:active {
    background-color: #00a6c8
}

.sticky-post .box__news:active .content svg .a, .sticky-post .box__news--small:active .content svg .a {
    fill: #fff
}

.sticky-post .box__news:active figure img, .sticky-post .box__news--small:active figure img {
    transform: scale(1)
}

.sticky-post .box__news figure, .sticky-post .box__news--small figure {
    border-radius: 10px;
    flex-shrink: 0
}

.sticky-post .box__news figure img, .sticky-post .box__news--small figure img {
    border-radius: 10px
}

.sticky-post .box__news .figcaption, .sticky-post .box__news--small .figcaption {
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    font-size: 2rem;
    padding-left: 0;
    position: relative;
    top: 0;
    transition: .15s ease-in-out
}

.float-up {
    transition: .15s ease-in-out;
    transform: translate3d(0, 0, 0)
}

.float-up:hover {
    transform: translate3d(0, -3px, 0)
}

.float-up:focus {
    transform: translate3d(0, -3px, 0)
}

.float-up:active {
    transform: translate3d(0, -3px, 0)
}

.float-down {
    transition: .15s ease-in-out;
    transform: translate3d(0, 0, 0)
}

.float-down:hover {
    transform: translate3d(0, 3px, 0)
}

.float-down:focus {
    transform: translate3d(0, 3px, 0)
}

.float-down:active {
    transform: translate3d(0, 3px, 0)
}

.bg-purple {
    background-color: #574d89
}

.button, .button__outline, .button__block, .button__attention, .button__brand {
    font-size: 1rem;
    display: block;
    text-align: center;
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    border-radius: 4px;
    padding: .75rem 3rem;
    margin: 0;
    white-space: initial;
    transition: .15s ease-in-out
}

.button__brand {
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    font-size: 20px;
    color: #fff;
    background: #0bc6ea;
    border: 1px solid #0bc6ea
}

.button__brand:hover {
    color: #fff;
    background: #574d89;
    border: 1px solid #574d89
}

.button__brand:focus {
    color: #fff;
    background: #574d89;
    border: 1px solid #574d89
}

.button__brand:active {
    color: #fff;
    background: #574d89;
    border: 1px solid #574d89
}

.button__brand .chevron {
    width: 12px;
    position: relative;
    right: -1rem
}

.button__attention {
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    font-size: 20px;
    color: #fff;
    background: #ff6c6c;
    border: 1px solid #ff6c6c;
    text-decoration: none
}

.button__attention:hover {
    color: #fff;
    background: #0bc6ea;
    border: 1px solid #0bc6ea
}

.button__attention .chevron {
    width: 12px;
    position: relative;
    right: -1rem
}

.header__banner .button__attention:hover {
    color: #fff;
    background: #4a4a4a;
    border: 1px solid #4a4a4a
}

.button__block {
    padding: 9px 1rem;
    color: #4a4a4a;
    border-radius: 10px;
    border: 1px solid rgba(74, 74, 74, .2);
    font-family: "Open Sans";
    font-weight: normal;
    font-style: normal;
    font-display: swap
}

.button__block .external {
    margin-left: 1rem
}

.button__block:hover {
    color: #0bc6ea
}

.button__block:focus {
    color: #0bc6ea
}

.button__block:active {
    color: #0bc6ea
}

.button__block.partners {
    padding: 9px 1.5rem;
    display: flex;
    justify-content: space-between
}

.button__outline {
    color: #fff;
    background: rgba(0, 0, 0, 0);
    border: 1px solid #fff
}

.button__outline:hover {
    color: #0bc6ea;
    background: #fff
}

.button__outline:focus {
    color: #0bc6ea;
    background: #fff
}

.button__outline:active {
    color: #0bc6ea;
    background: #fff
}

.button--float-up {
    transform: translate3d(0, 0, 0)
}

.button--float-up:hover {
    transform: translate3d(0, -3px, 0);
    box-shadow: 0 1rem 2.5rem 0 rgba(74, 74, 74, .15)
}

.button--float-up:focus {
    transform: translate3d(0, -3px, 0);
    box-shadow: 0 1rem 2.5rem 0 rgba(74, 74, 74, .15)
}

.button--float-up:active {
    transform: translate3d(0, -3px, 0);
    box-shadow: 0 1rem 2.5rem 0 rgba(74, 74, 74, .15)
}

.form-input {
    color: #0bc6ea;
    display: block;
    font-weight: 400;
    width: 100%;
    background: #fff;
    border-radius: 0px;
    border: 1px solid #fff;
    padding: 10px 20px;
    margin: 0 0 19px 0;
    transition: .15s ease-in-out
}

.form-input:hover {
    color: #0bc6ea;
    background: #fff;
    border: 1px solid #0bc6ea
}

.form-input:focus {
    color: #0bc6ea;
    background: #fff;
    border: 1px solid #0bc6ea
}

.form-input:active {
    color: #0bc6ea;
    background: #fff;
    border: 1px solid #0bc6ea
}

.form-ddl {
    color: #4a4a4a;
    box-shadow: none;
    outline: 0;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    padding: 0px 12px;
    height: 42px;
    line-height: 34px
}

input:hover, button:hover {
    box-shadow: none;
    outline: 0
}

input:focus, button:focus {
    box-shadow: none;
    outline: 0
}

input:active, button:active {
    box-shadow: none;
    outline: 0
}

.form-control:hover {
    outline: 0;
    box-shadow: none
}

.form-control:focus {
    outline: 0;
    box-shadow: none
}

.form-control:active {
    outline: 0;
    box-shadow: none
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    select {
        padding-right: 18px
    }
}

.form-label-group {
    position: relative;
    margin-bottom: 2rem
}

.form-label-group > label {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(1.6em + 1.625rem + 2px);
    padding: .8125rem 1.25rem;
    margin-bottom: 0;
    line-height: 1.6;
    font-size: 1.0625rem;
    color: rgba(74, 74, 74, .5);
    pointer-events: none;
    cursor: text;
    transition: all .2s ease-in-out
}

.form-label-group > .form-control-flush ~ label {
    padding-left: 0;
    padding-right: 0
}

.form-label-group > .form-control::-moz-placeholder {
    color: rgba(0, 0, 0, 0)
}

.form-label-group > .form-control::placeholder {
    color: rgba(0, 0, 0, 0)
}

.form-label-group > .form-control:not(:-moz-placeholder-shown) {
    padding-top: 1.21875rem;
    padding-bottom: .40625rem
}

.form-label-group > .form-control:not(:placeholder-shown) {
    padding-top: 1.21875rem;
    padding-bottom: .40625rem
}

.form-label-group > .form-control:not(:-moz-placeholder-shown) ~ label {
    padding-top: .00937rem;
    padding-bottom: .00937rem;
    font-size: .75rem
}

.form-label-group > .form-control:not(:placeholder-shown) ~ label {
    padding-top: .00937rem;
    padding-bottom: .00937rem;
    font-size: .75rem
}

@supports (-ms-ime-align: auto) {
    .form-label-group > label {
        display: none
    }

    .form-label-group .form-control::-moz-placeholder {
        color: rgba(74, 74, 74, .5)
    }

    .form-label-group .form-control::placeholder {
        color: rgba(74, 74, 74, .5)
    }
}

@media all and (-ms-high-contrast: none),(-ms-high-contrast: active) {
    .form-label-group > label {
        display: none
    }

    .form-label-group .form-control::-moz-placeholder {
        color: rgba(74, 74, 74, .5)
    }

    .form-label-group .form-control::placeholder {
        color: rgba(74, 74, 74, .5)
    }
}

.form-control {
    display: block;
    width: 100%;
    height: calc(1.6em + 1.625rem + 2px);
    padding: .8125rem 1.25rem;
    font-size: 1.0625rem;
    font-weight: 400;
    line-height: 1.6;
    color: #4a4a4a;
    background-color: #fff;
    background-clip: padding-box;
    border: 0px;
    border-bottom: 1px solid rgba(74, 74, 74, .15);
    border-radius: .375rem;
    box-shadow: none;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
    .form-control {
        transition: none
    }
}

.form-control::-ms-expand {
    background-color: rgba(0, 0, 0, 0);
    border: 0
}

.form-control:-moz-focusring {
    outline: none
}

.form-control:focus {
    color: #0bc6ea;
    background-color: #fff;
    border-color: #a7b9f6;
    outline: 0;
    box-shadow: none, none
}

.form-control::-moz-placeholder {
    color: rgba(74, 74, 74, .5);
    opacity: 1
}

.form-control::placeholder {
    color: rgba(74, 74, 74, .5);
    opacity: 1
}

.form-control:disabled, .form-control[readonly] {
    background-color: #f1f4f8;
    opacity: 1
}

select.form-control:focus::-ms-value {
    color: #161c2d;
    background-color: #fff
}

.form-control-file, .form-control-range {
    display: block;
    width: 100%
}

.form-control-flush {
    padding-left: 0;
    padding-right: 0;
    border-top-width: 0;
    border-right-width: 0;
    border-left-width: 0;
    border-radius: 0
}

.form-label-group > .form-control-flush ~ label {
    padding-left: 0;
    padding-right: 0
}

.custom-rb input[type=radio] {
    position: absolute;
    visibility: hidden
}

.custom-rb label {
    color: #4a4a4a;
    display: inline-block;
    position: relative;
    margin-left: -30px;
    padding-left: 24px;
    z-index: 9;
    cursor: pointer;
    -webkit-transition: all .25s linear
}

.custom-rb label#cphMain_lblThree {
    width: 160px;
    margin-right: 0
}

.custom-rb .check {
    display: inline-block;
    display: block;
    position: relative;
    border: 1px solid #4a4a4a;
    background: #fff;
    border-radius: 100%;
    margin-right: 10px;
    height: 20px;
    width: 20px;
    z-index: 5;
    transition: border .25s linear;
    -webkit-transition: border .25s linear
}

.custom-rb .check::before {
    display: block;
    position: absolute;
    content: "";
    border-radius: 100%;
    height: 14px;
    width: 14px;
    top: 2px;
    left: 2px;
    margin: auto;
    transition: background .25s linear;
    -webkit-transition: background .25s linear
}

.custom-rb .answer {
    display: inline-block;
    width: 33.33%
}

.custom-rb input[type=radio]:checked ~ .check {
    border: 1px solid #4a4a4a
}

.custom-rb input[type=radio]:checked ~ .check::before {
    background: #0bc6ea
}

.custom-rb input[type=radio]:checked ~ label {
    color: #4a4a4a
}

.check-me {
    margin-top: 8px
}

input[type=checkbox].custom-check, .custom-check input[type=checkbox] {
    display: inline-block;
    border: 1px solid #8c8c8c;
    background: #fff;
    color: #0bc6ea;
    clear: none;
    cursor: pointer;
    display: inline-block;
    line-height: 0;
    height: 20px;
    margin: 0px 15px 30px 0;
    outline: 0;
    padding: 0 !important;
    text-align: center;
    vertical-align: middle;
    width: 20px;
    min-width: 20px;
    -webkit-appearance: none;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
    transition: .05s border-color ease-in-out;
    transition: .3s ease-in-out
}

input[type=checkbox].custom-check:focus, input[type=checkbox].custom-check:hover, .custom-check input[type=checkbox]:focus, .custom-check input[type=checkbox]:hover {
    outline: none
}

input[type=checkbox].custom-check:checked:before, .custom-check input[type=checkbox]:checked:before {
    font-family: FontAwesome;
    color: #0bc6ea;
    content: "";
    margin: 9px 0 0 -3px;
    display: inline-block;
    display: inline-block;
    vertical-align: middle;
    width: 20px;
    font-size: 28px;
    speak: none;
    -webkit-font-smoothing: antialiased
}

@media (min-width: 768px) {
    .header__banner__risk .thermometer {
        display: flex;
        width: 187px;
        top: -38px;
        left: 1.5rem
    }

    .calculator__page .box__white, .calculator__page .box__white--active, .calculator__page .box__white--quiz {
        padding: 4rem 3rem 3rem 3rem
    }

    .calculator__page .box__purple {
        padding: 1.5rem 3rem
    }

    .calculator__page .box__lightbrand {
        padding: 3rem 3rem
    }

    footer a.nav-link {
        padding-left: .5rem;
        padding-right: .5rem
    }

    footer ul {
        flex-direction: row
    }

    .intro-text {
        font-family: "Open Sans";
        font-weight: normal;
        font-style: normal;
        font-display: swap;
        font-size: 19px
    }

    .homepage .intro-text {
        font-size: 19px
    }

    .button, .button__brand, .button__attention, .button__block, .button__outline {
        display: inline-block
    }

    .quiz__wrapper .gform_previous_button, .quiz__wrapper .gform_next_button {
        width: auto
    }

    .quiz__step-divider {
        margin-bottom: -15px;
        margin-left: 0
    }
}

@media (min-width: 992px) {
    .header__banner__risk .thermometer {
        display: flex;
        width: 192px;
        top: -41px;
        left: 2rem
    }

    .header__banner__risk .content .sub-heading {
        color: #fff
    }

    .article__img {
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover;
        position: absolute;
        z-index: 1
    }

    .article__img--single {
        border-radius: 10px
    }

    .h-lg-100 {
        height: 100%
    }

    .quiz__step-divider {
        margin-bottom: -17px;
        margin-left: 0
    }
}

@media (min-width: 1200px) {
    .header__banner__risk .thermometer {
        display: flex;
        width: 184px;
        top: -38px;
        left: 2rem
    }
}

/*# sourceMappingURL=style.min.css.map */