@charset "UTF-8";

@font-face {
    font-family: 'Nunito';
    src: url("../fonts/nunito/NunitoSans-Bold.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
    unicode-range: U+0000-00FF, U+0100-024F, U+1E00-1EFF;
}

@font-face {
    font-family: 'Nunito';
    src: url("../fonts/nunito/NunitoSans-ExtraBold.ttf") format("truetype");
    font-weight: 800;
    font-style: normal;
    unicode-range: U+0000-00FF, U+0100-024F, U+1E00-1EFF;
}

@font-face {
    font-family: 'Nunito';
    src: url("../fonts/nunito/NunitoSans-Light.ttf") format("truetype");
    font-weight: 300;
    font-style: normal;
    unicode-range: U+0000-00FF, U+0100-024F, U+1E00-1EFF;
}

@font-face {
    font-family: 'Nunito';
    src: url("../fonts/nunito/NunitoSans-Regular.ttf") format("truetype");
    font-weight: 500;
    font-style: normal;
    unicode-range: U+0000-00FF, U+0100-024F, U+1E00-1EFF;
}

nav ul a {
    font-size: 1.0667em;
}

.slogan h1 {
    color: #fff;
    font-weight: 800;
}

@media screen and (max-width: 991px) {
    .slogan h1 {
        font-size: 2.5em;
        margin: 2.1rem 0 0 0;
    }
}

@media screen and (min-width: 992px) and (max-width: 1600px) {
    .slogan h1 {
        font-size: 3.3em;
    }
}

@media screen and (min-width: 1601px) and (max-width: 9999px) {
    .slogan h1 {
        font-size: 4vw;
    }
}

.slogan h1 .prepre {
    display: block;
    font-size: 0.6em;
    line-height: 1.2em;
    margin-bottom: 10px;
}

@media screen and (max-width: 767px) {
    .slogan h1 .prepre {
        font-size: 0.6em;
        font-weight: 600;
    }
}

.slogan h1 .pre {
    display: block;
    font-size: .5667em;
    font-weight: 300;
    line-height: 1.3em;
    margin-top: 0.5em;
    margin-bottom: 15px;
}

@media screen and (max-width: 767px) {
    .slogan h1 .pre {
        margin-top: 0;
        margin-bottom: 10px;
        line-height: 1em;
        font-size: .5667em;
        font-weight: 100;
    }
}

h3, h4 {
    font-weight: 800;
    line-height: 1.3334em;
}

h3 {
    font-size: 2.6667em;
}

h4 {
    font-size: 2em;
}

p, ul {
    color: #8994a3;
}

.font--md {
    font-size: 1.25em;
}

.font--lg {
    font-size: 1.3334em;
}

@media screen and (max-width: 767px) {
    .font--lg {
        font-size: 1.5em;
    }
}

.font--light {
    font-weight: 300;
}

.font--exbold {
    font-weight: 800;
}

.font--color-theme {
    color: #ff9e80;
}

.color-font--theme {
    color: #ff9e80;
}

.color-font--theme-semilight {
    color: #ffb7a0;
}

.color-font--theme-light {
    color: #ffc6af;
}

.color-font--footer-bg {
    color: #f9d5cb;
}

.color-font--font {
    color: #8994a3;
}

.color-font--gradient {
    color: #cccacc;
}

.color-font--ordered-list {
    color: #c5cdd7;
}

.color-font--monochrome-shapes {
    color: #F8F8FA;
}

.color-font--light {
    color: #fff;
}

.color-font--dark {
    color: #000;
}

.color-font--faq-bg {
    color: #ebeff5;
}

.color-font--light-rgba {
    color: #708090;
}

.display--desktop {
    display: none;
}

@media screen and (max-width: 992px) {
    .display--desktop {
        display: block;
    }
}

.display--mobile {
    display: block;
}

@media screen and (max-width: 992px) {
    .display--mobile {
        display: none;
    }
}

html, body {
    font-family: 'Nunito';
    transition: opacity .1s ease;
    background-color: #fff;
    position: relative;
    font-size: 0.9em;
    z-index: -10;
}

body.body-cyrylic {
    font-family: 'Roboto';
}




.btn {
    border-bottom-left-radius: 1.5rem;
    border-bottom-right-radius: 1.5rem;
    border-top-left-radius: 1.5rem;
    border-top-right-radius: 1.5rem;
    box-shadow: none;
    height: 3rem;
    line-height: 3rem;
    padding-left: 1.3334rem;
    padding-right: 1.3334rem;
    text-transform: none;
}

    .btn:hover {
        box-shadow: none;
    }

.btn--light {
    color: #ff9e80;
    background-color: #fff;
    font-weight: 700;
}

@media screen and (max-width: 992px) {
    .front-page .btn--light {
        visibility: visible;
    }
}

@media screen and (max-width: 992px) {
    .side-nav .btn--light {
        border-radius: 3rem;
        height: 4rem;
        font-size: 1.6em;
        line-height: 4rem;
        padding: 0 2.5rem;
        margin: 0 2rem 0 0;
    }
}

.btn--light:hover, .btn--light:focus {
    color: #fff;
    background-color: #ff9e80;
}

.btn--bordered {
    border: 0.3rem solid rgba(255, 255, 255, 0.9);
    border-radius: 2rem;
    box-sizing: content-box;
    padding-left: 2rem;
    padding-right: 2rem;
}

@media screen and (max-width: 992px) {
    .btn--bordered {
        border: 0.25rem solid rgba(255, 255, 255, 0.9);
        height: 100%;
    }

    .front-page .btn--bordered,
    .footer-page .btn--bordered {
        height: 3em;
    }
}

.btn--theme {
    background-color: #ff9e80;
    background: linear-gradient(to right, #ffb7a0, #ffc6af);
}

    .btn--theme span {
        line-height: 3rem;
        float: left;
    }

    .btn--theme:hover, .btn--theme:focus {
        color: #ff9e80;
        background-color: #fff;
    }

.btn--monochrome {
    background-color: #8994a3;
    border-color: #dfe2e6;
}

    .btn--monochrome:hover, .btn--monochrome:focus {
        background-color: #fff;
        color: #8994a3;
    }

.front-page .btn {
    margin-top: 1.2rem;
    margin-right: 1rem;
}

.btn__next {
    background-color: transparent;
    color: #ff9e80;
    font-size: 2em;
    font-weight: 800;
    line-height: 1.5em;
    padding-left: 2rem;
    margin-left: 1.3334rem;
}

    .btn__next:hover, .btn__next:focus {
        background-color: transparent;
    }

    .btn__next i {
        display: block;
        float: right;
        font-size: 1em;
        font-weight: 800;
        margin: .1rem;
    }

.btn__join {
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

.btn__lang.btn {
    line-height: 64px;
    margin: 0;
    padding-left: 10px;
    padding-right: 10px;
}

@media screen and (max-width: 992px) {
    .btn__lang.btn {
        line-height: 56px;
    }
}

.btn__lang, .btn__lang:hover, .btn__lang:focus {
    background-color: transparent;
}

.lang-picker {
    background-color: #fff;
    height: 64px;
    position: absolute;
    right: -11rem;
    transition: right .5s ease-in-out;
    z-index: 10;
}

@media screen and (max-width: 992px) {
    .lang-picker {
        right: -8rem;
        height: 56px;
    }
}

.lang-picker, .lang-picker__container {
    border-top-left-radius: 2rem;
    border-bottom-left-radius: 2rem;
}

.lang-picker__container {
    height: 64px;
    overflow: hidden;
    position: absolute;
    right: 0;
    top: 2rem;
    transition: width .5s ease-in-out;
    width: 5.1rem;
}

@media screen and (max-width: 992px) {
    .lang-picker__container {
        top: 5rem;
    }
}

.lang-picker__container:hover, .lang-picker__container:focus, .lang-picker__container.hover {
    width: 16rem;
}

.lang-picker:hover, .lang-picker:focus, .lang-picker.hover {
    right: 0;
}

.lang-picker .material-icons {
    float: left;
}

.lang-picker a {
    color: #ff9e80;
    height: 64px;
}

    .lang-picker a:hover {
        color: #ff9e80;
        text-decoration: none;
    }

@media screen and (max-width: 992px) {
    .lang-picker a {
        font-size: 14px;
        line-height: 56px;
        height: 56px;
        padding-left: 10px;
        padding-right: 10px;
    }
}

.lang-picker li {
    height: 64px;
    line-height: 64px;
}

@media screen and (max-width: 992px) {
    .lang-picker li {
        line-height: 56px;
    }
}

.background {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: -1;
}

.background__shapes {
    height: 100%;
    overflow: hidden;
    position: absolute;
    width: 100%;
}

nav .background__shapes svg {
    margin-top: -1rem;
}

.background__shapes svg {
    position: absolute;
    min-width: 70rem;
    min-height: 50%;
    width: 100%;
}

.background__shapes .bottom {
    bottom: 0;
    left: 0;
}

.background__shapes .top {
    top: 0;
    right: 0;
}

.background__bg-woman {
    position: absolute;
    height: 100%;
    width: 100%;
    background-size: auto 100vh;
    background-position: right top;
    background-repeat: no-repeat;
}

@media screen and (max-width: 480px) {
    .background__bg-woman {
        background-image: url(../images/woman-sm.png);
    }
}

@media screen and (min-width: 481px) and (max-width: 767px) {
    .background__bg-woman {
        background-image: url(../images/woman-md.png);
    }
}

@media screen and (min-width: 768px) and (max-width: 9999px) {
    .background__bg-woman {
        background-image: url(../images/woman-lg.png);
    }
}

@media (orientation: portrait) {
    .background__bg-woman {
        background-position: 10% top;
    }
}

.recipient {
    background-image: url("../images/tlo/macierzynstwo.png");
    background-position: bottom right;
    background-size: auto 100%;
    background-repeat: no-repeat;
}

@media screen and (max-width: 480px) {
    .recipient {
        background-image: url("../images/tlo/macierzynstwo.png");
        background-position: bottom;
        background-size: cover;
        z-index: 1;
    }
}

@media screen and (min-width: 481px) and (max-width: 767px) {
    .recipient {
        background-size: auto 100%;
    }
}

@media screen and (min-width: 768px) and (max-width: 1100px) {
    .recipient {
        background-size: auto 70%;
    }
}

.donor {
    background-image: url("../images/tlo/macierzynstwo_heart.png");
    background-position: top right;
    background-repeat: no-repeat;
    background-size: 100% auto;
    margin-top: -110px;
    padding-top: 150px !important;
}

@media screen and (max-width: 480px) {
    .donor {
        background-image: url("../images/mobile/background3.png");
        margin-top: -60px;
        margin-bottom: 2rem;
        padding-top: 70px !important;
    }
}

@media screen and (min-width: 481px) and (max-width: 767px) {
    .donor {
        background-image: none;
        margin-top: 0px;
        margin-bottom: 2rem;
        padding-top: 10px !important;
    }
}

@media screen and (min-width: 768px) and (max-width: 991px) {
    .donor {
        margin-top: -50px;
        padding-top: 20px !important;
    }
}

@media screen and (min-width: 992px) and (max-width: 1100px) {
    .donor {
        margin-top: -90px;
        padding-top: 80px !important;
    }
}

.collapsible {
    box-shadow: 0px 0px 18px 3px rgba(0, 0, 0, 0.05);
    border: white;
}

.collapsible-header {
    border-bottom: 1px solid transparent;
}

nav ul a {
    border-radius: .5rem;
}

    nav ul a:hover {
        background-color: transparent;
    }

.side-nav li > a:hover {
    background-color: transparent;
}

html {
    font-size: 15px;
    color: #fff;
}

@media screen and (max-width: 767px) {
    html {
        font-size: 12px;
    }
}

@media screen and (min-width: 2000px) and (max-width: 9999px) {
    html {
        font-size: 18px;
    }
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #dfe2e6;
    margin: 1em 0;
    padding: 0;
}

.dot-list li {
    margin-left: 2rem;
    text-indent: -1.4em;
}

    .dot-list li::before {
        content: '•';
        color: #ff9e80;
        margin-right: 1rem;
    }

.z-depth-5 {
    box-shadow: 0 24px 50px 16px rgba(0, 0, 0, 0.3);
}

input:not([type]):focus:not([readonly]) + label, input[type=date]:not(.browser-default):focus:not([readonly]) + label, input[type=datetime-local]:not(.browser-default):focus:not([readonly]) + label, input[type=datetime]:not(.browser-default):focus:not([readonly]) + label, input[type=email]:not(.browser-default):focus:not([readonly]) + label, input[type=number]:not(.browser-default):focus:not([readonly]) + label, input[type=password]:not(.browser-default):focus:not([readonly]) + label, input[type=search]:not(.browser-default):focus:not([readonly]) + label, input[type=tel]:not(.browser-default):focus:not([readonly]) + label, input[type=text]:not(.browser-default):focus:not([readonly]) + label, input[type=time]:not(.browser-default):focus:not([readonly]) + label, input[type=url]:not(.browser-default):focus:not([readonly]) + label, textarea.materialize-textarea:focus:not([readonly]) + label {
    color: #8994a3;
}

.caret {
    display: none;
}

.select-wrapper {
    position: relative;
}

    .select-wrapper::after {
        position: absolute;
        top: .7778rem;
        right: -.2rem;
        content: url(../images/icon_keyboard_arrow_down.svg);
    }

.mobile-close {
    display: block;
}

@media screen and (max-width: 767px) {
    .mobile-close {
        display: none;
    }
}

.desktop-close {
    display: block;
}

@media screen and (min-width: 768px) and (max-width: 9999px) {
    .desktop-close {
        display: none;
    }
}

nav {
    background-color: transparent;
    position: absolute;
    z-index: 998;
}

.desktop-nav {
    box-shadow: none;
    height: 6rem;
    padding-top: 2rem;
}

    .desktop-nav .navbtn-close .dot-up {
        top: calc(50% - 2.5px);
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }

    .desktop-nav .navbtn-close .dot-middle {
        display: none;
    }

    .desktop-nav .navbtn-close .dot-down {
        top: calc(50% - 2.5px);
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }

@media screen and (max-width: 992px) {
    .desktop-nav {
        height: 4rem;
        padding-top: .6667rem;
    }
}

@media screen and (min-width: 993px) and (max-width: 1100px) {
    .desktop-nav ul a {
        padding: 0 5px !important;
    }
}

.brand-logo {
    height: 100%;
    z-index: 1001;
}

    .brand-logo img {
        height: 3.5rem;
    }

@media screen and (min-width: 992px) and (max-width: 1200px) {
    .brand-logo img {
        height: 3rem;
        line-height: 36px;
    }
}

@media screen and (max-width: 991px) {
    nav .brand-logo {
        left: 5rem;
        top: .5rem;
    }

    .brand-logo img {
        height: 2.4rem;
    }
}

.side-nav {
    background-color: #ffb7a0;
    background: linear-gradient(to bottom, #ffb7a0, #ffc6af);
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
    padding-bottom: 4rem;
    height: 100vh;
    top: 0;
}

    .side-nav li:nth-child(2) {
        margin-top: 1.5em;
    }

    .side-nav li:nth-child(3), .side-nav li:nth-child(4), .side-nav li:nth-child(5) {
        width: 75vw;
        text-align: right;
        border-bottom: 1px solid white;
    }

        .side-nav li:nth-child(3) > a, .side-nav li:nth-child(4) > a, .side-nav li:nth-child(5) > a {
            height: 100%;
            line-height: 30px;
            padding: 0 15vw 0 0;
        }

    .side-nav li:nth-child(6), .side-nav li:nth-child(7) {
        width: 75vw;
    }

        .side-nav li:nth-child(6) > a, .side-nav li:nth-child(7) > a {
            height: 26px;
            line-height: 26px;
            font-size: 14px;
            padding: 0 15vw 0 0;
            text-align: right;
        }

    .side-nav li:nth-child(8) .btn {
        color: #ff9e80;
        background-color: #fff;
        font-weight: 700;
    }

    .side-nav li:nth-child(8) .btn--light {
        padding: 0 2rem;
        font-size: 1.6rem;
        position: relative;
        bottom: -10vh;
    }

    .side-nav li > a > i.material-icons {
        margin: 0 15vw 0 0;
    }

    .side-nav li > a {
        padding: 0;
    }

    .side-nav li > a,
    .side-nav.side-nav li > a i {
        color: #fff;
        font-size: 1.5em;
    }

    .side-nav .btn {
        margin: 0 15vw 0 0;
    }

    .side-nav .btn__join {
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-align-self: center;
        -ms-flex-item-align: center;
        -ms-grid-row-align: center;
        align-self: center;
        text-align: center;
    }

    .side-nav .mobile-button-container {
        width: 100%;
    }

/* Dropdown menu*/
.desktop-nav #dropdown1 {
    width: 20em !important;
    top: 50px !important;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    box-shadow: none;
}

    .desktop-nav #dropdown1 li:nth-child(1) a {
        color: #ffb7a0;
    }

    .desktop-nav #dropdown1 li:nth-child(2) a {
        color: #8994a3;
        border-top: 1px solid #cccacc;
        border-radius: 0;
    }

.dropdown-content li {
    min-height: 20px !important;
    line-height: 0.8rem !important;
}

    .dropdown-content li:hover {
        background-color: transparent;
        font-weight: 600;
    }

.hide-on-med-and-down li {
    border: 1px solid transparent;
}

.front-page {
    background-color: #ffc6af;
    height: 100vh;
    position: relative;
    z-index: 0;
}

    .front-page .background__shapes svg {
        left: 0;
    }

.front-page__container {
    height: 100%;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-flex-basis: 0;
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    padding-top: 6.6667vh;
}

.slogan {
    margin-top: 6vh;
    -webkit-flex: 6;
    -ms-flex: 6;
    flex: 6;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: normal;
    -ms-flex-pack: normal;
    justify-content: normal;
}

@media screen and (max-width: 992px) {
    .slogan {
        margin-top: 0;
        -webkit-justify-content: normal;
        -ms-flex-pack: normal;
        justify-content: normal;
    }
}

.cta-container {
    -webkit-flex: 3;
    -ms-flex: 3;
    flex: 3;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
    padding-bottom: 2rem;
}

.mouse {
    -webkit-animation: bounce 2s linear infinite alternate;
    animation: bounce 2s linear infinite alternate;
    width: 1.5rem;
}

@-webkit-keyframes bounce {
    50% {
        -webkit-transform: translateY(-1rem);
        transform: translateY(-1rem);
    }
}

@keyframes bounce {
    50% {
        -webkit-transform: translateY(-1rem);
        transform: translateY(-1rem);
    }
}

.info-page {
    min-height: 100vh;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    position: relative;
}

    .info-page .background__shapes {
        right: 0;
    }

.info-article {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 2rem 0 0rem;
}

@media screen and (max-width: 992px) {
    .info-article {
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        padding: 1.5rem 0 0;
    }
}

.info-article__article {
    width: 100%;
}

@media screen and (max-width: 767px) {
    .info-article__article {
        width: 100%;
        margin-bottom: 30px;
    }

        .info-article__article .wrapper {
            clear: both;
        }
}

.info-article__article p:nth-child(2) .font--exbold {
    font-size: 1.2em;
    line-height: 1.2em;
    font-weight: 800;
}

.info-article__article__etaps {
    clear: both;
    height: 60px;
    line-height: 20px;
}

    .info-article__article__etaps p:nth-child(odd) {
        float: left;
        width: 20%;
        text-align: center;
        margin: 2px 0;
    }

        .info-article__article__etaps p:nth-child(odd):nth-child(5) {
            margin-bottom: 1em;
        }

    .info-article__article__etaps p:nth-child(even) {
        margin: 2px 0;
        padding-left: 15px;
        float: right;
        text-align: left;
        width: calc(100% - 20%);
    }

.info-article header {
    -webkit-flex: 9;
    -ms-flex: 9;
    flex: 9;
}

@media screen and (max-width: 767px) {
    .info-article header {
        margin-left: 0;
    }
}

.info-article__section {
    color: #8994a3;
    height: 1.3334rem;
    line-height: 1.3334rem;
    margin-top: 0;
}

.info-article__header {
    color: #ff9e80;
    font-size: 2.3334em;
    line-height: 1.2em;
    margin-top: 3.6334rem;
}

@media screen and (max-width: 767px) {
    .info-article__header {
        line-height: 1.2em;
        margin-top: 1.3334rem;
        font-size: 1.9em;
    }
}

.collapsible .info-article__header {
    font-size: 1.5em;
    margin: 0;
}

@media screen and (max-width: 767px) {
    .collapsible .info-article__header {
        font-size: 1.1em;
        padding: 0;
        line-height: 20px;
        color: #8994a3;
    }
}

.info-article__content {
    padding-top: 0;
}

@media screen and (max-width: 767px) {
    .info-article__content {
        padding-top: 0.3rem;
    }
}

.recipient .info-article__article {
    width: 70%;
}

@media screen and (max-width: 767px) {
    .recipient .info-article__article {
        width: 100%;
        margin-bottom: 7vh;
    }
}

.collapsible-header {
    background: transparent;
    padding: 1.5rem 2.5rem 0;
}

@media screen and (max-width: 767px) {
    .collapsible-header {
        padding: 1rem 1.5rem;
    }
}

.collapsible-header h3 {
    margin: 0;
    font-size: 1.2em;
    line-height: 30px;
    width: 80%;
}

.collapsible {
    width: 48%;
    float: left;
    background-color: #fff;
    border-radius: 30px;
}

@media screen and (max-width: 650px) {
    .collapsible {
        width: 95%;
    }
}

.collapsible .collapsible-body {
    display: block;
    height: 23em;
    padding: 1em 1.5rem;
    font-size: 1.2em;
    border-bottom: 1px solid transparent;
}

@media screen and (max-width: 767px) {
    .collapsible .collapsible-body {
        height: 100%;
        font-size: 1.15em;
    }
}

.collapsible .collapsible-body ul li {
    list-style-type: none;
    position: relative;
    padding-left: 20px;
}

    .collapsible .collapsible-body ul li:before {
        content: '\2022';
        color: #ff9e80;
        padding-right: 0.5em;
        position: absolute;
        left: -1px;
    }

.collapsible .collapsible-body {
    display: none;
}

.collapsible h2 {
    background-color: #cccacc;
    font-size: 2em;
    margin: 0 10px 0 0;
    color: #fff;
    width: 30px;
    height: 30px;
    line-height: 30px;
    left: -6rem;
    top: 2.5rem;
    text-align: center;
    border-radius: 30px;
}

@media screen and (max-width: 767px) {
    .collapsible h2 {
        font-size: 1.2em;
    }
}

@media screen and (max-width: 767px) {
    .donor .font--md {
        width: 100%;
    }
}

.donor img {
    width: 1px;
    height: 10px;
    visibility: hidden;
}

@media screen and (max-width: 767px) {
    .donor img {
        visibility: visible;
        width: 32px;
        height: 38px;
        margin-right: 10px;
    }
}

.donor ul {
    margin-left: .6667rem;
}

.donor li + li {
    margin-top: .6667rem;
}

.donor .collapsible {
    margin-top: 1em;
}

@media screen and (min-width: 768px) and (max-width: 9999px) {
    .donor .collapsible {
        box-shadow: 0px 0px 10px 1px rgba(197, 205, 215, 0.3);
        padding: 0 1.5em 1.5em;
        color: transparent;
    }
}

@media screen and (min-width: 768px) and (max-width: 9999px) {
    .donor .collapsible {
        background-image: url("../images/tlo/dawstwo.png");
        background-size: cover;
    }
}

@media screen and (min-width: 768px) and (max-width: 991px) {
    .donor .collapsible:last-child {
        background-position-x: -310px;
    }
}

@media screen and (min-width: 992px) and (max-width: 1024px) {
    .donor .collapsible:last-child {
        background-position-x: -360px;
    }
}

@media screen and (min-width: 1025px) and (max-width: 9999px) {
    .donor .collapsible:last-child {
        background-position-x: -470px;
    }
}

@media screen and (min-width: 768px) and (max-width: 9999px) {
    .donor .collapsible-header {
        padding: 1.5rem 0 0;
    }
}

.donor .collapsible-body {
    display: block;
    padding: 1em 0;
}

@media screen and (max-width: 767px) {
    .donor .collapsible-body {
        display: none;
        padding: 1em 1.5rem;
    }
}

.donor .article_desktop {
    margin-left: 40%;
    padding: 0 15px;
    width: 60%;
    text-align: right;
    margin-bottom: 150px;
}

@media screen and (min-width: 768px) and (max-width: 991px) {
    .donor .article_desktop {
        margin-bottom: 10px;
    }
}

@media screen and (min-width: 992px) and (max-width: 1100px) {
    .donor .article_desktop {
        margin-bottom: 0px;
    }
}

.arrow_down {
    visibility: hidden;
    background-image: url(../images/icon/arrow_down.png);
    width: 1.5em;
    height: 12px;
    background-repeat: no-repeat;
    background-size: contain;
    transition-duration: 1s;
    -webkit-transition-duration: 1s;
}

@media screen and (max-width: 991px) {
    .arrow_down {
        position: relative;
        top: 1em;
    }
}

@media screen and (max-width: 991px) {
    .faq-page .arrow_down {
        position: relative;
        top: 0;
    }
}

.active .arrow_down {
    -webkit-transform: rotateX(180deg);
    transform: rotateX(180deg);
    transition-duration: 1s;
    -webkit-transition-duration: 1s;
}

@media screen and (max-width: 767px) {
    .arrow_down {
        visibility: visible;
    }
}

.info-page-form-1 {
    padding: 30px 0 30px 0;
    background-image: url(../images/tlo/info-page-form-1-desktop.png);
    background-size: 100% 100%;
}

@media screen and (max-width: 480px) {
    .info-page-form-1 {
        background-image: url(../images/tlo/info-page-form-1.png);
        background-size: 100% 100%;
        padding: 60px 0 50px 0;
        margin-top: -90px !important;
    }
}

@media screen and (min-width: 481px) and (max-width: 991px) {
    .info-page-form-1 {
        background-size: 140% 100%;
    }
}

@media screen and (min-width: 768px) and (max-width: 991px) {
    .info-page-form-1 .info-article__content {
        width: 70%;
        padding-top: 10px;
    }
}

@media screen and (min-width: 992px) and (max-width: 9999px) {
    .info-page-form-1 .info-article__content {
        width: 60%;
        padding-top: 60px;
    }
}

.info-page-form-2 {
    color: #fff;
    background-image: url(../images/tlo/info-page-form-1-desktop.png);
    background-size: 100% 100%;
}

@media screen and (max-width: 767px) {
    .info-page-form-2 {
        background-image: url(../images/tlo/info-page-form-2.png);
        margin-top: -60px !important;
        padding: 60px 0 0px 0;
    }
}

@media screen and (min-width: 768px) and (max-width: 991px) {
    .info-page-form-2 {
        padding: 50px 20% 40px 0;
        position: relative;
        top: -10px;
        margin-top: -10px;
        width: 100%;
    }
}

@media screen and (min-width: 992px) and (max-width: 9999px) {
    .info-page-form-2 {
        margin-top: -120px !important;
        padding: 80px 0 30px 0;
        top: -100px;
        width: 100%;
    }
}

.info-page-form-2 p {
    color: #fff;
    opacity: 1;
}

.info-page-form .info-article__article {
    margin-bottom: 0;
    font-size: 1.1em;
}

@media screen and (max-width: 767px) {
    .info-page-form .info-article__article {
        font-size: 1.1em;
    }
}

.info-page-form p {
    color: #fff;
    opacity: 1;
}

    .info-page-form p a {
        color: #fff;
    }

@media screen and (max-width: 767px) {
    .info-page-form {
        margin-top: -25px;
    }
}

.info-page-form h2 {
    font-size: 2em;
    text-align: left;
}

.info-page-program {
    display: none;
    background: #fff;
    padding: 5px 0 5px 0;
}

@media screen and (max-width: 767px) {
    .info-page-program {
        display: block;
    }
}

.info-page-program .btn {
    line-height: 1.2em;
    padding: 1em 2em;
}

@media screen and (max-width: 767px) {
    .info-page-program .btn {
        width: 80%;
        font-size: 1.1rem;
    }
}

.program {
    display: inline-block;
}

@media screen and (max-width: 768px) {
    .program {
        display: none;
    }
}

.program .column {
    width: 33%;
    padding: 1em;
    float: left;
    margin-top: 4em;
}

.program .column__article {
    padding: 2em 0;
    position: relative;
    text-align: center;
    height: 28em;
}

@media screen and (max-width: 1199px) {
    .program .column__article {
        height: 30em;
    }
}

.program .column__article__img {
    width: 6em;
    height: 6em;
    position: absolute;
    top: -3.5em;
    left: calc(50% - 3em);
}

    .program .column__article__img img {
        position: relative;
        width: 100%;
        height: 100%;
    }

.program .column__article h4 {
    border-radius: 20px;
    margin-top: 1.2em;
    background: #f9d5cb;
    height: 90px;
}

    .program .column__article h4 span {
        color: #fff;
        width: 100%;
    }

.program .column__article p {
    border-radius: 20px;
    font-size: 1.25em;
    height: 300px;
    background-color: #8994a3;
    color: #fff;
    padding: 1em;
}

.quiz-page {
    min-height: 100vh;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    position: relative;
}

    .quiz-page .background {
        height: 100vh;
    }

    .quiz-page .background__shapes {
        -webkit-transform: translateY(-25vh);
        transform: translateY(-25vh);
        overflow: hidden;
    }

@media screen and (max-width: 767px) {
    .quiz-page .background__shapes {
        -webkit-transform: translateY(-8vh);
        transform: translateY(-8vh);
    }
}

.quiz-page .background__shapes svg {
    top: 0;
}

@media (min-width: 414px) and (orientation: portrait) {
    .quiz-page .background__shapes {
        -webkit-transform: translateY(-15vh);
        transform: translateY(-15vh);
    }
}

.quiz__header {
    position: relative;
}

    .quiz__header h3, .quiz__header p {
        color: #fff;
        text-shadow: 0 0 1rem #FFD0C1;
    }

    .quiz__header p {
        background-color: #FFD0C1;
        box-shadow: 0 0 1rem 1rem #FFD0C1;
    }

.quiz__container .question-container {
    display: none;
}

    .quiz__container .question-container.active {
        display: block;
    }

.quiz__card {
    background: linear-gradient(to bottom, #fff 33%, #cccacc 100%);
    border-radius: .6667rem;
}

.quiz__questions {
    color: #8994a3;
}

.quiz__message a {
    display: block;
    box-sizing: content-box;
    border: 0.6667rem solid #ffc6af;
    border-radius: 2rem;
    margin: 1rem auto;
    width: 15rem;
}

    .quiz__message a:hover {
        border-color: #ffc6af !important;
    }

.quiz__message--positive, .quiz__message--negative {
    display: none;
}

.quiz__message--warn {
    display: none;
}

    .quiz__message--warn.active {
        display: block;
    }

.quiz__pagination li {
    display: inline-block;
    width: 2rem;
    height: 2rem;
    line-height: 2rem;
    font-weight: 800;
    border-radius: 1rem;
    transition: all 1s ease;
}

    .quiz__pagination li + li {
        margin-left: 1rem;
    }

    .quiz__pagination li.active {
        background-color: #ff9e80;
        color: #fff;
    }

.rules-page {
    position: relative;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

@media screen and (min-width: 768px) and (max-width: 9999px) {
    .rules-page {
        background-image: url("../images/tlo/dawstwo.png");
        background-position: top;
        background-repeat: no-repeat;
        background-size: contain;
    }

        .rules-page .info-article__header {
            color: #8994a3;
        }

        .rules-page h2 {
            padding-top: 4rem;
            margin-top: 0;
        }
}

.rules-page__container {
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

@media screen and (max-width: 767px) {
    .rules-page__container {
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        padding: 5rem 0 2rem;
    }
}

.rules-page__container aside {
    -webkit-flex-grow: 2;
    -ms-flex-positive: 2;
    flex-grow: 2;
}

.rules-page .background__shapes svg {
    bottom: 0;
}

@media (orientation: portrait) {
    min-height: auto;
}

.call-banner {
    background-color: #ff9e80;
    background: linear-gradient(to bottom, #fff, #f9d5cb);
    border-radius: 9rem;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 30rem;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    margin-left: 2rem;
    padding: 3rem 1rem;
    text-align: center;
    width: 18rem;
}

    .call-banner a {
        color: #fff;
    }

    .call-banner p {
        color: #8994a3;
    }

    .call-banner .material-icons {
        font-size: 5em;
    }

.call-banner__phone {
    font-size: 2em;
    font-weight: 800;
}

.call-banner__icon {
    position: relative;
    width: 8em;
    height: 8em;
    padding: 1em;
    left: calc(50% - 4em);
    background-size: 70%;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(../images/icon/phone.svg);
}

.rules {
    -webkit-flex-grow: 8;
    -ms-flex-positive: 8;
    flex-grow: 8;
    counter-reset: item;
}

    .rules header {
        color: #8994a3;
    }

.rules__list h4 {
    color: #ffb7a0;
}

.rules__list p {
    font-size: 1.25em;
}

@media screen and (max-width: 767px) {
    .rules__list p {
        font-size: 1.5em;
    }
}

.rules__list li {
    margin-top: 2rem;
    padding-top: 1rem;
}

.rules ol {
    list-style: none;
}

.rules li {
    counter-increment: item;
    position: relative;
    margin-left: 3rem;
}

    .rules li:before {
        content: counter(item);
        background-image: url(../images/mobile/circle.svg);
        background-size: 120%;
        background-repeat: no-repeat;
        font-size: 2em;
        border-radius: 100%;
        color: white;
        width: 2em;
        height: 2em;
        line-height: 2em;
        font-weight: 800;
        left: -6rem;
        top: 1.5rem;
        text-align: center;
        position: absolute;
    }

        .rules li:before :after {
            width: 10px;
            height: 10px;
            background-color: yellow;
        }

.info-page-program-desktop {
    display: block;
    margin-bottom: 7em;
}

@media screen and (max-width: 767px) {
    .info-page-program-desktop {
        display: none;
    }
}

@media screen and (min-width: 768px) and (max-width: 991px) {
    .info-page-program-desktop {
        margin-bottom: 2em;
    }
}

.form-page {
    position: relative;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    color: #8994a3;
    background-image: url("../images/tlo/form.png");
    background-size: 100% 100%;
    padding-top: 30px;
    top: -20px;
    margin-bottom: -30px;
}

@media screen and (min-width: 768px) and (max-width: 9999px) {
    .form-page {
        background-image: url("../images/tlo/form-desktop.png");
    }
}

.form-page header {
    text-align: center;
}

.form-page .font--light {
    font-size: 0.8em;
}

.form-page .background {
    background-color: #F8F8FA;
    top: 0;
}

.form-page .background__shapes svg {
    bottom: 0;
}

.form-page__conatainer {
    min-height: 100vh;
}

.form-page .input-field button {
    box-shadow: 0 6px 15px rgba(137, 148, 163, 0.3);
    border-radius: .2rem;
    background-color: #fff;
    border: none;
    padding: 0 1.1rem;
    width: 49%;
    outline: none;
    height: 3rem;
    font-size: 1rem;
    margin: 0 0 0 0;
    transition: all 0.3s;
}

    .form-page .input-field button:nth-child(odd) {
        float: right;
    }

    .form-page .input-field button:nth-child(even) {
        float: left;
    }

    .form-page .input-field button:visited, .form-page .input-field button:link, .form-page .input-field button:hover {
        background-color: #F8F8FA;
    }

@media screen and (min-width: 768px) and (max-width: 9999PX) {
    .form-page .m6 {
        padding: 0 2.5em;
    }
}

.form-page h2 {
    color: #8994a3;
}

@media screen and (max-width: 767px) {
    .form-page .column {
        width: 100%;
    }
}

.form-page .input-field {
    margin-top: 0.2rem;
}

.stform1 {
    -webkit-transform: rotateY(180deg) scaleY(0.8);
    transform: rotateY(180deg) scaleY(0.8);
    -webkit-transform-origin: bottom;
    transform-origin: bottom;
    top: auto;
}

.form-application {
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
    align-self: center;
    vertical-align: middle;
    max-width: 56rem;
    margin: 4rem auto;
    position: relative;
}

@media screen and (max-width: 767px) {
    .form-application {
        max-width: 40rem;
        margin: 2rem auto;
        box-shadow: 0px 0px 18px 3px rgba(0, 0, 0, 0.05);
    }
}

@media screen and (min-width: 768px) and (max-width: 991px) {
    .form-application {
        margin: 0 auto;
    }
}

.form-application .input-field {
    margin-right: 1rem;
    padding-right: 0;
    padding-left: 0;
    clear: both;
}

@media screen and (max-width: 767px) {
    .form-application .input-field {
        padding-right: 1rem;
        padding-left: 1rem;
    }
}

.form-application .input-field.input-field input,
.form-application .input-field.input-field input:focus,
.form-application .input-field.input-field button,
.form-application .input-field.input-field button:focus {
    -webkit-appearance: none;
    margin-bottom: 1.2rem;
    box-shadow: 0 6px 15px rgba(137, 148, 163, 0.3);
    border-radius: .2rem;
}

    .form-application .input-field.input-field input:focus,
    .form-application .input-field.input-field input:focus:focus,
    .form-application .input-field.input-field button:focus,
    .form-application .input-field.input-field button:focus:focus {
        box-shadow: 0 6px 20px rgba(137, 148, 163, 0.7), 0 0 15px rgba(137, 148, 163, 0.6);
    }

.form-application .input-field.input-field-btn, .form-application .input-field.input-field-btn-lg {
    padding-right: 0;
}

@media screen and (min-width: 768px) and (max-width: 9999px) {
    .form-application .input-field.input-field-btn, .form-application .input-field.input-field-btn-lg {
        margin-right: 0;
    }
}

/*.form-application .input-field.input-field input.error,
.form-application .input-field.input-field input.error:focus {
    box-shadow: 0 6px 15px rgba(230, 0, 0, 0.3);
}*/

.form-application .checkbox-container {
    margin-top: 1.6em;
}

    .form-application .checkbox-container [type="checkbox"] + label {
        line-height: 1.2em;
        font-size: 1em;
    }

@media screen and (max-width: 767px) {
    .form-application .checkbox-container [type="checkbox"] + label {
        line-height: 1em;
        font-size: .8em;
    }
}

.form-application__label.label-top.label-top.label-top {
    font-size: 16px;
    -webkit-transform: scale(1);
    transform: scale(1);
    position: relative;
    height: 100%;
    display: block;
}

@media screen and (max-width: 413px) {
    .form-application__label.label-top.label-top.label-top {
        font-size: 1em;
    }
}

.form-application__disclaimer.force.force {
    font-size: 1em;
    margin: 1rem 0;
    padding-left: 35px;
}

.form-application .checkbox-red[type="checkbox"].filled-in + label:after {
    border: 1px solid #8994a3;
    background-color: transparent;
    height: 28px;
    width: 28px;
}

.form-application [type=checkbox].filled-in:checked + label:before {
    border-bottom-color: #ff9e80;
    border-right-color: #ff9e80;
    top: 4px;
    left: 5px;
}

.form-application fieldset {
    border: none;
}

.form-application .btn__next {
    margin-bottom: 3rem;
    margin-top: 3rem;
}

.form-application .btn--bordered {
    padding-left: 4rem;
    padding-right: 4rem;
}

.input-field.input-field span {
    color: #8994a3;
}

.input-field.input-field input {
    background-color: #fff;
    border: none;
    border-radius: .6667rem;
    padding-left: 1.1rem;
}

    .input-field.input-field input:focus:focus {
        border: none;
        box-shadow: none;
    }

.input-field.input-field .caret {
    z-index: 1;
}

.input-field.input-field .select-dropdown {
    background-color: #fff;
    border: none;
    border-radius: .6667rem;
}

.select-wrapper {
    margin-bottom: 1.2rem;
}

@media screen and (min-width: 768px) and (max-width: 9999px) {
    .card {
        background-color: #cccacc;
        background: linear-gradient(to bottom, #fff, #cccacc);
    }
}

.about-page {
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    color: #8994a3;
    background-image: url("../images/tlo/program-dawstwa2.png");
    background-size: 100% 100%;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    position: relative;
}

@media screen and (min-width: 768px) and (max-width: 9999px) {
    .about-page {
        background-image: url("../images/tlo/program-desktop.png");
        background-size: 100% 80%;
        background-position: bottom;
        background-repeat: no-repeat;
    }
}

.about-page__header {
    margin-bottom: 2rem;
}

@media screen and (max-width: 480px) {
    .about-page__header h3 {
        font-size: 2.4em;
    }
}

.about-page .info-article__header {
    color: #8994a3;
}

.about-page .tab {
    display: none;
    width: 100%;
}

@media screen and (max-width: 992px) {
    .about-page .tab {
        display: inline-block;
        margin-top: 1em;
    }
}

.about-page .tab button {
    background-color: #ffb7a0;
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
    border: 0;
    width: 24.2%;
    height: 75px;
    position: relative;
}

@media screen and (min-width: 767px) and (max-width: 991px) {
    .about-page .tab button {
        width: 24.5%;
    }
}

.about-page .tab button img {
    height: 3em;
    position: absolute;
    top: calc(50% - 2em);
    left: calc(50% - 1.5em);
}

.about-page .tab .active-btn {
    display: none;
}

.about-page .tab .inactive-btn {
    display: inline-block;
}

.about-page .tab .active {
    background: #fff;
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
}

    .about-page .tab .active .active-btn {
        display: inline-block;
    }

    .about-page .tab .active .inactive-btn {
        display: none;
    }

.tabcontent {
    background-color: transparent;
    margin-top: 100px;
    margin-bottom: 5rem;
    padding: 0 2rem;
}

    .tabcontent:not(#Program_1) {
        display: none;
    }

@media screen and (max-width: 992px) {
    .tabcontent {
        background-color: #fff;
        border: #fff;
        position: relative;
        border-radius: 30px;
        margin-top: -25px;
    }
}

.promo-box {
    color: #fff;
    max-width: 25rem;
    margin: 2rem auto;
}

.promo-box__icon {
    margin-bottom: 2rem;
}

.promo-box h4 {
    background-color: rgba(255, 158, 128, 0.4);
    border-radius: 1.6rem;
    font-size: 1.6em;
    margin-top: 1rem;
    margin-bottom: 1.6rem;
    padding: 1.6667rem 0;
}

@media screen and (max-width: 1400px) {
    .promo-box h4 {
        font-size: 1.4667em;
    }
}

.promo-box__description {
    background-color: #8994a3;
    border-radius: 1.6rem;
    padding: 0 3rem;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    height: 24rem;
}

    .promo-box__description p {
        color: #fff;
        font-size: 1.2em;
        font-weight: 600;
    }

.patron-page {
    position: relative;
    min-height: 100vh;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background: linear-gradient(to bottom, #F8F8FA, #fff);
    padding: 3rem 0;
}

.patron__info {
    text-align: center;
    padding-bottom: 1.8em !important;
}

    .patron__info h3 {
        color: #ff9e80;
        font-size: 1.6em;
        margin: 0;
    }

@media screen and (max-width: 767px) {
    .patron__info h3 {
        font-size: 1.3em;
        margin: 1em 0 1.2em;
    }
}

.patron__info h4 {
    margin: 2.5em 0 0.5em;
}

@media screen and (max-width: 991px) {
    .patron__info h4 {
        margin-top: 2em !important;
    }
}

.patron__info p {
    font-size: 1.25em;
    padding-bottom: 1em;
    border-bottom: 1px solid #e0e0e0;
}

@media screen and (max-width: 767px) {
    .patron__info p {
        font-size: 1em;
        padding-bottom: 0;
        border-bottom: 0;
    }
}

@media screen and (min-width: 768px) and (max-width: 991px) {
    .patron__info p {
        padding-bottom: 0;
        border-bottom: none;
    }
}

.patron__img-box {
    margin-right: 0;
    position: relative;
}

.patron__picture {
    max-height: 500px;
    margin-left: 2.5em;
    float: left;
}

@media screen and (max-width: 992px) {
    .patron__picture {
        max-height: 200px;
        margin-left: calc(50% - 100px);
    }
}

.patron__signature {
    position: absolute;
}

@media screen and (max-width: 992px) {
    .patron__signature {
        left: calc(50% + 25px);
        bottom: 6em;
        width: 10rem;
    }
}

@media screen and (min-width: 993px) and (max-width: 1050px) {
    .patron__signature {
        bottom: -11rem;
        left: -7rem;
    }
}

@media screen and (min-width: 1051px) and (max-width: 1120px) {
    .patron__signature {
        bottom: -8.5rem;
        left: -7rem;
    }
}

@media screen and (min-width: 1121px) and (max-width: 1200px) {
    .patron__signature {
        bottom: -5.5rem;
        left: -7rem;
    }
}

@media screen and (min-width: 1201px) and (max-width: 1600px) {
    .patron__signature {
        bottom: -2.5rem;
        left: -10rem;
    }
}

@media screen and (min-width: 1601px) and (max-width: 9999px) {
    .patron__signature {
        bottom: -5rem;
        left: -8rem;
    }
}

.faq-page {
    position: relative;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0;
    background-image: url("../images/tlo/faq_desktop.png");
    background-size: 110% 100%;
    margin-top: -4px;
}

@media screen and (max-width: 767px) {
    .faq-page {
        background-image: url("../images/tlo/faq.png");
    }
}

.faq-page .btn {
    margin-bottom: 5rem;
    margin-top: 5rem;
}

.faq-page .arrow_down {
    visibility: visible !important;
}

.faq__header {
    margin-bottom: 3rem;
}

@media screen and (max-width: 992px) {
    .faq__header {
        margin-bottom: 1.5rem;
    }
}

.faq__header h3 {
    color: #8994a3;
}

.faq .collapsible {
    box-shadow: none;
    border: none;
    width: 100%;
    background-color: transparent;
}

    .faq .collapsible .material-icons {
        color: #c5cdd7;
        font-size: 1.6667em;
        position: absolute;
        right: 1rem;
        top: 1rem;
        transition: -webkit-transform .75s ease;
        transition: transform .75s ease;
        transition: transform .75s ease, -webkit-transform .75s ease;
    }

    .faq .collapsible li + li {
        margin-top: 1.2rem;
    }

.faq .collapsible-header,
.faq .collapsible-body {
    background-color: #fff;
    border-radius: 1.6667rem;
    border: none;
    padding-left: 2rem;
    transition: border-radius .2s ease;
    transition-delay: .2s;
    width: 100%;
}

.faq .collapsible-header {
    font-size: 1.25em;
    line-height: 1.25em;
    font-weight: 600;
    position: relative;
    height: 100%;
    padding-bottom: 1.5em;
}

@media screen and (max-width: 767px) {
    .faq .collapsible-header {
        padding-bottom: 1em;
        height: 100%;
    }
}

.faq .collapsible-header.active {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    transition: border-radius .01s;
    transition-delay: 0s;
}

    .faq .collapsible-header.active .material-icons {
        -webkit-transform: rotateX(180deg);
        transform: rotateX(180deg);
    }

.faq .collapsible-body {
    font-size: 1em;
    font-weight: 400;
    padding-right: 2rem;
    height: 100%;
}

.faq li.active .collapsible-body {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.faq .faq__question {
    width: 92%;
    margin-right: 3%;
}

#iframe {
    display: none;
}

.footer-page {
    background-color: #f9d5cb;
}

    .footer-page a:not(.btn) {
        color: #fff;
    }

        .footer-page a:not(.btn):hover {
            color: #8994a3;
        }

    .footer-page > .container > .row {
        margin-bottom: 0;
    }

.footer__contact {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
}

@media screen and (max-width: 992px) {
    .footer__contact {
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        padding-top: 3rem;
    }
}

.footer__contact h3 {
    margin: 2rem 0 1rem;
}

@media screen and (max-width: 767px) {
    .footer__contact h3 {
        margin: 0 0 0.7em;
        font-size: 1.6em;
    }
}

.footer__contact a:not(.btn), .footer__contact p {
    color: #fff;
    display: block;
    margin: 0.7em 0;
    transition: color .3s ease;
}

@media screen and (max-width: 767px) {
    .footer__contact a:not(.btn), .footer__contact p {
        font-size: 1em;
    }
}

.footer__cities {
    margin: 0;
    line-height: 1;
    text-align: right;
    color: #fff;
}

    .footer__cities span {
        font-size: 0.8em;
    }

@media screen and (max-width: 992px) {
    .footer__cities {
        font-size: 1.4em;
        text-align: left;
        padding: 1rem 0 0;
    }
}

@media screen and (max-width: 767px) {
    .footer__cities span {
        width: 22%;
        display: inline-block;
        margin: 0;
    }
}

@media screen and (min-width: 767px) and (max-width: 992px) {
    .footer__cities span {
        width: 15%;
        display: inline-block;
        margin: 0;
    }
}

.footer__nav {
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 0.5rem 1.5rem 0.5rem;
    width: 100%;
    display: block;
}

@media screen and (max-width: 767px) {
    .footer__nav {
        display: inline-block;
    }
}

.footer__nav li {
    font-size: 16px;
    margin: 1rem 0;
}

@media screen and (min-width: 767px) and (max-width: 9999px) {
    .footer__nav li {
        display: inline-block;
        margin: 0;
    }

        .footer__nav li + li {
            margin-left: 2rem;
        }
}

.footer__nav .footer__cities a {
    line-height: 44px;
}

@media screen and (max-width: 992px) {
    .footer__logo {
        width: 12rem;
        max-width: 60%;
    }
}

.footer__logo img {
    text-align: right;
    width: 12em;
}

@media screen and (max-width: 767px) {
    .footer__logo img {
        text-align: left;
        width: auto;
    }
}

.footer__copyright {
    border-top: 1px solid #fff;
    margin-top: 1rem;
}

    .footer__copyright p {
        color: #fff;
        font-size: 1em;
        line-height: 1;
        margin: 0.8em;
    }

@media screen and (max-width: 767px) {
    .footer__copyright p {
        font-size: .8em;
        line-height: 0.8;
    }
}

.footer__copyright p a {
    color: #fff !important;
}

.modal {
    color: #8994a3;
}

    .modal .modal-content {
        padding-top: 0;
    }

        .modal .modal-content h5 {
            text-align: center;
        }

        .modal .modal-content .modal-text {
            text-align: justify;
        }

label.error {
    display: block;
    width: 100%;
    text-align: left;
    position: relative;
    font-size: 1rem;
    -webkit-transform: translateY(-14px) scale(0.8);
    transform: translateY(-14px) scale(0.8);
}

@font-face {
    font-family: "Roboto";
    src: url("../fonts/roboto/Roboto-Light.ttf") format("truetype");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Roboto";
    src: url("../fonts/roboto/Roboto-Regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Roboto";
    src: url("../fonts/roboto/Roboto-Medium.ttf") format("truetype");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Roboto";
    src: url("../fonts/roboto/Roboto-Bold.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}


body.body-cyrylic {
    font-family: 'Roboto', Arial, sans-serif !important;
}

    body.body-cyrylic *:not(i.material-icons) {
        font-family: inherit !important;
    }