

/* Start:/local/components/newsite/vue.html/templates/seo.text/style.css?178583656612202*/
:root {
    /* sizes */
    --screen-xl-min: 1440px;
    --screen-lg-max: 1439px;
    --screen-lg-min: 1280px;
    --screen-md-max: 1279px;
    --screen-md-min: 1024px;
    --screen-sm-max: 1023px;
    --screen-sm-min: 768px;
    --screen-xs-max: 767px;
    --screen-xs-min: 640px;
    --screen-2xs-max: 639px;
    --screen-2xs-min: 480px;
    --screen-3xs-max: 479px;
    --screen-3xs-min: 380px;
    --screen-4xs-max: 379px;
    --screen-4xs-min: 0px;

    /* container */
    --container-width: 1440px;
    --container-padding: 54px;
    --container-padding-md: 8px;
    --container-padding-sm: 8px;

    /* colors*/
    --color-blue-light-7: rgba(18, 50, 204, .07);
    --color-blue-interactive-hover: #4C6BFF;
    --color-black-100: #000;
    --color-white-bg: #F5F5F7;
    /* grid */
    --grid-gutter-base: 24px;
    --grid-gutter-base-sm: 20px;

    --separator-color: var(--color-white-50);

    /* shadows */
    --box-shadow-base: 0 4px 12px 0 rgba(0, 0, 0, .15);

    /* border radius */
    --border-radius-base: 4px;

    /* text */
    --ff-base: Inter, Arial, Helvetica, sans-serif;
    --fw-400: 400;
    --fw-500: 500;
    --fw-600: 600;
    --fw-700: 700;
    --fw-regular: 400;
    --fw-bold: 700;
    --fw-base: var(--fw-regular);
    --fw-small:  var(--fw-regular);
    --fw-smaller:  var(--fw-regular);
    --fw-strong:  var(--fw-regular);
    --fz-base: 16px;
    --lh-base: normal;
    --fz-small: 14px;
    --lh-small: normal;
    --fz-smaller: 12px;
    --lh-smaller: normal;
    --fz-large: 20px;
    --lh-large: normal;
    --fz-larger: 24px;
    --lh-larger: normal;

    --ff-h1:  var(--ff-base);
    --fz-h1: 60px;
    --fw-h1:  var(--fw-500);
    --lh-h1: normal;
    --tt-h1: none;
    --ls-h1: normal;

    --ff-h2:  var(--ff-base);
    --fz-h2: 50px;
    --fw-h2:  var(--fw-500);
    --lh-h2: normal;
    --tt-h2: none;
    --ls-h2: normal;

    --ff-h3:  var(--ff-base);
    --fz-h3: 30px;
    --fw-h3:  var(--fw-400);
    --lh-h3: normal;
    --tt-h3: none;
    --ls-h3: normal;

    --ff-h4:  var(--ff-base);
    --fz-h4: 26px;
    --fw-h4:  var(--fw-500);
    --lh-h4: normal;
    --tt-h4: none;
    --ls-h4: normal;

    --ff-h5:  var(--ff-base);
    --fz-h5: 18px;
    --fw-h5:  var(--fw-600);
    --lh-h5: normal;
    --tt-h5: none;
    --ls-h5: normal;

    /* text xs */
    --fz-base-xs: 16px;
    --lh-base-xs: normal;
    --fz-small-xs: 14px;
    --lh-small-xs: normal;
    --fz-smaller-xs: 12px;
    --lh-smaller-xs: normal;
    --fz-large-xs: 18px;
    --lh-large-xs: normal;

    --ff-h1-xs:  var(--ff-base);
    --fz-h1-xs: 29px;
    --fw-h1-xs:  var(--fw-500);
    --lh-h1-xs: normal;
    --tt-h1-xs: none;
    --ls-h1-xs: normal;

    --ff-h2-xs:  var(--ff-base);
    --fz-h2-xs: 27px;
    --fw-h2-xs:  var(--fw-500);
    --lh-h2-xs: normal;
    --tt-h2-xs: none;
    --ls-h2-xs: normal;

    --ff-h3-xs:  var(--ff-base);
    --fz-h3-xs: 24px;
    --fw-h3-xs:  var(--fw-500);
    --lh-h3-xs: normal;
    --tt-h3-xs: none;
    --ls-h3-xs: normal;

    --ff-h4-xs:  var(--ff-base);
    --fz-h4-xs: 22px;
    --fw-h4-xs:  var(--fw-500);
    --lh-h4-xs: normal;
    --tt-h4-xs: none;
    --ls-h4-xs: normal;

    --ff-h5-xs:  var(--ff-base);
    --fz-h5-xs: 16px;
    --fw-h5-xs:  var(--fw-500);
    --lh-h5-xs: normal;
    --tt-h5-xs: none;
    --ls-h5-xs: normal;

    /* transitions */
    --trs-base: .2s;
    --trs-dropdown: .25s;
    --trs-overlay: .25s;
    /* --- text --- */
}

.text-strong {
    font-weight:  var(--fw-bold);
}

.text-small {
    font-size:  var(--fz-small);
    line-height:  var(--lh-small);
    font-weight:  var(--fw-small);
}

.text-smaller {
    font-size:  var(--fz-smaller);
    line-height:  var(--lh-smaller);
    font-weight:  var(--fw-smaller);
}

b {
    font-weight:  var(--fw-bold);
}

.link,
.text-guide a {
@include link;
}

.dark .link,
.dark .text-guide a{
    color: var(--color-blue-interactive-hover);
}

@include no-touch {
    .dark .link:hover,
    .dark .text-guide a:hover {
        color: var(--color-blue-interactive-hover);
    }
}


.blockquote,
blockquote {
    padding: 30px;
    background: var(--color-blue-light-7);
    color: var(--color-black-100);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 22px;
    margin: 20px 0;
    border-radius: 15px;
}

.blockquote:last-child,
blockquote:last-child {
    margin-bottom: 0;
}

.video-block {
    position: relative;
    background: var(--color-white-bg);
}

.video-block::after {
    content: "";
    display: block;
    padding-top: 56.25%;
}

.video-block iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.blockquote:first-child,
blockquote:first-child,
.table-scroller:first-child {
    margin-top: 0;
}

.blockquote:last-child,
blockquote:last-child,
.table-scroller:last-child {
    margin-bottom: 0;
}

.hr--lg {
    margin: 60px 0;
}

.text-guide {
    font-size: 16px;
    line-height: 28px;
    hyphens: auto;
    -ms-hyphens: auto;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    color: var(--color-black-100);
}

a.text-guide__link {
    display: block;
    width: fit-content;
    margin-top: 10px;
    color: var(--color-black-100);
    transition: color var(--trs-base);
    text-decoration: underline;
    font-weight:  var(--fw-600);
}

.text-guide__link:first-child {
    margin-top: 0;
}

a.text-guide__link:hover {
    color: var(--color-blue-primary-100);
    text-decoration: underline;
}

.text-guide h1,
.text-guide .h1 {
    margin: 20px 0;
    clear: both;
    color: var(--color-black-100);
}

.text-guide h2,
.text-guide .h2,
.text-guide h3,
.text-guide .h3,
.text-guide h4,
.text-guide .h4,
.text-guide h5,
.text-guide .h5 {
    margin: 30px 0 20px;
    clear: both;
    color: var(--color-black-100);
}

.text-guide ul {
    margin: 20px 0;
}
ul,
ol,
li {
    list-style: none;
    padding: 0;
    margin: 0;
}
.text-guide ul > li {
    margin: 0 0 8px;
    vertical-align: top;
    padding-left: 25px;
    position: relative;
}

.text-guide li > ul:first-child {
    margin-top: 8px;
}

.text-guide ul > li::before {
    content: "";
    position: absolute;
    top: 12px;
    left: 0;
    width: 12px;
    border-top: 2px solid;
}

.text-guide ul > li {
    position: relative;
    padding-left: 24px;
    margin: 0 0 11px;
    text-align: left;
}

.text-guide ul > li:last-child {
    margin-bottom: 0;
}

.text-guide ul > li::before {
    position: absolute;
    top: 10px;
    left: 0;
    content: "";
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background-color: var(--color-primary);
    background-size: contain;
    background-repeat: no-repeat;
    max-width: 20px;
    border-top: 0;
}

.text-guide ol {
    list-style-type: unset;
    counter-reset: ol;
    margin: 20px 0;
}

.text-guide ol > li {
    position: relative;
    padding: 0 0 0 38px;
    margin: 0 0 11px;
}

.text-guide ol > li::before {
    content: counter(ol);
    counter-increment: ol;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 2px;
    left: 0;
    color: var(--color-primary);
    text-align: center;
    font-size: 15px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    background-color: var(--color-blue-light-7);
    padding: 0;
    height: 24px;
    border-radius: 6px;
    min-width: 24px;
}

.dark .text-guide ol > li::before {
    color: var(--color-black-100);
}

.text-guide img {
    display: block;
    max-width: 100%;
    margin: 20px 0;
}

.text-guide img:first-child {
    margin-top: 0;
}

.text-guide img[align="left"],
.text-guide img[align="right"] {
    max-width: 50%;
}

.text-guide img[align="left"] {
    margin: 0 20px 20px 0;
    float: left;
}

.text-guide img[align="right"] {
    margin: 0 0 20px 20px;
    float: right;
}

.text-guide table {
    border-collapse: collapse;
    border-spacing: 0;
    margin: 20px 0;
    font-size:  var(--fz-small);
    line-height:  var(--lh-small);
    width: 100%;
}

.table-scroller {
    max-width: 100%;
    overflow: auto;
    margin: 20px 0;
}

.table-scroller table {
    margin: 0;
}

.text-guide td,
.text-guide th {
    border: 1px solid var(--color-white-50);
    transition: background-color var(--trs-base) ease;
    padding: 10px 20px;
    border-collapse: collapse;
    vertical-align: top;
    text-align: left;
}

.text-guide th {
    background: var(--color-white-bg);
}

.text-guide thead {
    font-weight:  var(--fw-bold);
}

.text-guide tbody tr:hover td {
    background-color: var(--color-white-bg);
}

.text-guide iframe {
    max-width: 100%;
}

.text-guide .video-block {
    margin: 30px 0;
}

.text-guide p {
    margin: 10px 0;
}

.text-guide h1:first-child,
.text-guide .h1:first-child,
.text-guide h2:first-child,
.text-guide .h2:first-child,
.text-guide h3:first-child,
.text-guide .h3:first-child,
.text-guide h4:first-child,
.text-guide .h4:first-child,
.text-guide h5:first-child,
.text-guide .h5:first-child,
.text-guide p:first-child,
.text-guide ul:first-child,
.text-guide ol:first-child,
.text-guide table:first-child,
.text-guide blockquote:first-child,
.text-guide .video-block:first-child {
    margin-top: 0;
}

.text-guide h1:last-child,
.text-guide .h1:last-child,
.text-guide h2:last-child,
.text-guide .h2:last-child,
.text-guide h3:last-child,
.text-guide .h3:last-child,
.text-guide h4:last-child,
.text-guide .h4:last-child,
.text-guide h5:last-child,
.text-guide .h5:last-child,
.text-guide p:last-child,
.text-guide ul:last-child,
.text-guide ol:last-child,
.text-guide table:last-child,
.text-guide blockquote:last-child,
.text-guide .video-block:last-child {
    margin-bottom: 0;
}



/* --- blackout --- */
.blackout {
    color: var(--color-white-100);
}



@media (max-width: var(--screen-md-max)) {
    .hr--lg {
        margin: 40px 0;
    }
}



@media (max-width:  var(--screen-sm-max)) {
    .text-strong {
        font-size:  var(--fz-large-xs);
        line-height:  var(--lh-large-xs);
    }

    .text-small {
        font-size:  var(--fz-small-xs);
        line-height:  var(--lh-small-xs);
    }

    .text-guide {
        font-size: 16px;
        line-height: 25px;
    }

    .text-guide .h1,
    .text-guide h1 {
        margin-top: 40px;
        margin-bottom: 20px;
    }

    .text-guide img[align="left"],
    .text-guide img[align="right"] {
        float: none;
    }

    .text-guide h2,
    .text-guide .h2,
    .text-guide h3,
    .text-guide .h3,
    .text-guide h4,
    .text-guide .h4,
    .text-guide h5,
    .text-guide .h5 {
        text-align: center;
    }
}

@media (max-width:  var(--screen-xs-max)) {
    .text-guide p {
        margin: 10px 0;
    }

    .text-guide ul,
    .text-guide ol {
        margin: 20px 0;
    }

    .blockquote,
    blockquote {
        margin: 20px 0;
    }

    .text-guide img {
        margin: 20px 0;
    }
}

.seo-text {
    margin: 100px 0;
}

.seo-text__text {
    display: -webkit-box;
    overflow: hidden;
    height: 150px;
    text-overflow: ellipsis;
    white-space: normal;
    -webkit-box-orient: vertical;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.seo-text__text--opened {
    display: block;
    height: auto !important;
}

.seo-text__action {
    margin-top: 10px;
}

.seo-text__btn {
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    cursor: pointer;
}

.text-guide h2.seo-text-title,
.text-guide .h2.seo-text-title,
.text-guide h3.seo-text-title,
.text-guide .h3.seo-text-title,
.text-guide h4.seo-text-title,
.text-guide .h4.seo-text-title,
.text-guide h5.seo-text-title,
.text-guide .h5.seo-text-title,
.text-guide h6.seo-text-title,
.text-guide .h6.seo-text-title
{
    margin-bottom: 10px;
}


@media (max-width: 767px) {
    .seo-text__text {
        font-size: 17px;
        font-style: normal;
        font-weight: 400;
        line-height: 20px;
        overflow: hidden;
        height: 100px;
    }

    .seo-text__text--opened {
        height: auto !important;
    }

    .seo-text__btn {
        font-size: 18px;
        font-style: normal;
        font-weight: 400;
        line-height: 22px;
    }
}






/* End */
/* /local/components/newsite/vue.html/templates/seo.text/style.css?178583656612202 */
