img.lazyloaded {
    height: 36px
}
.posts-banner-top {
    background-image: url(/app/themes/tigera2021/dist/img/hero_mobile.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    display: grid;
    min-height: 350px;
    padding: 100px 0;
    position: relative;
    width: 100%
}
.posts-banner-top .posts-banner__container {
    text-align: center
}
.posts-banner-top .posts-banner__container .posts-banner__content {
    align-items: center;
    color: var(--color-white);
    display: flex;
    flex-direction: column;
    margin-bottom: 50px;
    padding: 0;
    position: relative;
    width: 100%
}

@media (min-width:48em) {
    .posts-banner-top .posts-banner__container .posts-banner__content,
    .posts-banner__wrapper .posts-banner__container .posts-banner__content {
        padding-right: 0
    }
}

.posts-banner-top .posts-banner__container .posts-banner__content h1 {
    color: var(--color-white);
    font-size: var(--font-size-2xl);
    font-style: normal;
    font-weight: 700;
    line-height: 37px;
    margin-bottom: 30px;
    padding-inline: 53px
}
.posts-banner-top .posts-banner__container .posts-banner__content p {
    color: var(--color-white);
    font-size: var(--font-size-sm);
    font-style: normal;
    line-height: 21px;
    margin-bottom: 21px
}
.posts-banner-top .posts-banner__container a {
    border: 2px solid var(--color-white);
    border-radius: 5px;
    color: var(--color-white);
    font-weight: 700;
    padding: 12px 24px;
    text-decoration: none
}

.posts-banner-top .posts-banner__container a:hover {
    background-color: var(--color-white);
    color: var(--color-brand-secondary)
}

.content-survey {
    display: block;
    margin-block-end: 200px;
    margin-left: auto;
    margin-right: auto;
    width: 60%
}

.content-survey .questions-content {
    margin-block: 100px
}

.content-survey .questions-content .questions {
    border-left: 5px solid var(--color-brand-accent);
    padding-left: 20px
}

.content-survey .questions-content .questions .single-question-with-optional-answers {
    display: flex;
    flex-direction: column;
    margin-block-end: 30px
}

.content-survey .questions-content .questions .single-question-with-optional-answers .number-title {
    color: var(--color-brand-accent);
    font-weight: 700;
    margin-block-end: 18px
}

.content-survey .questions-content .questions .single-question-with-optional-answers .content-question h4 {
    font-size: var(--font-size-md);
    font-weight: 700;
    line-height: 1.5
}

.content-survey .questions-content .questions .single-question-with-optional-answers .content-question p {
    color: var(--color-gray-900)
}

.content-survey .questions-content .questions .single-question-with-optional-answers label {
    align-items: baseline;
    border: var(--border-default);
    border-radius: 5px;
    color: var(--color-gray-900);
    cursor: pointer;
    display: flex;
    font-size: var(--font-size-base);
    font-weight: 500;
    line-height: 24px;
    margin-block-end: 10px;
    min-height: 50px;
    padding-block: 12px;
    padding-inline-end: 12px
}

.content-survey .questions-content .questions .single-question-with-optional-answers label.checked {
    background-color: #e5e5e5;
    border: 1px solid #e5e5e5
}

.content-survey .questions-content .questions .single-question-with-optional-answers label [type=checkbox],
.content-survey .questions-content .questions .single-question-with-optional-answers label [type=radio] {
    margin-inline: 20px;
    pointer-events: none
}

.content-survey .questions-content .questions .single-question-with-optional-answers label input[type=radio]:before {
    background: var(--color-white);
    border: 1px solid #ddd;
    border-radius: 50px;
    content: "";
    display: inline-block;
    height: 23px;
    line-height: 23px;
    margin-block: -4.2px;
    margin-inline: -4.75px;
    width: 23px
}

.content-survey .questions-content .questions .single-question-with-optional-answers label input[type=checkbox]:checked:before,
.content-survey .questions-content .questions .single-question-with-optional-answers label input[type=radio]:checked:before {
    background: var(--color-brand-accent);
    color: var(--color-white);
    content: "\f00c";
    font-family: 'Font Awesome 5 Free';
    font-size: 15px;
    font-weight: 900;
    text-align: center
}

.content-survey .questions-content .questions .single-question-with-optional-answers label input[type=checkbox]:before {
    background: var(--color-white);
    border: 1px solid #ddd;
    border-radius: 5px;
    content: "";
    display: inline-block;
    height: 23px;
    line-height: 23px;
    margin-block: -4.2px;
    margin-inline: -4.75px;
    width: 23px
}

.content-survey .bottom-total-info {
    background-color: var(--color-bg-blockquote);
    border-radius: 5px;
    padding: 21px 30px 50px
}

.content-survey .bottom-total-info .totals {
    align-items: center;
    display: flex;
    flex-direction: column;
    text-align: center
}

.content-survey .bottom-total-info .totals .title-score {
    font-size: var(--font-size-2xl);
    line-height: 38px;
    margin-block-end: 20px;
    text-align: left;
    width: 100%
}

.content-survey .bottom-total-info .totals p {
    font-size: var(--font-size-base);
    font-weight: 700;
    line-height: 28px
}

.content-survey .bottom-total-info .totals .grade-to-info {
    display: flex;
    gap: 20px;
    margin-block-end: 40px;
    width: 100%
}

.content-survey .bottom-total-info .totals .grade-to-info .total_descrption,
.content-survey .bottom-total-info .totals .grade-to-info .total_grade {
    background-color: var(--color-white);
    border-radius: 5px;
    padding: 30px 17px 34px;
    width: 50%
}

.content-survey .bottom-total-info .totals .grade-to-info .total_descrption p,
.content-survey .bottom-total-info .totals .grade-to-info .total_grade p {
    font-size: var(--font-size-md);
    font-weight: 700;
    line-height: 28px
}

.content-survey .bottom-total-info .totals .grade-to-info .total_descrption span,
.content-survey .bottom-total-info .totals .grade-to-info .total_grade span {
    font-size: var(--font-size-4xl);
    font-weight: 700
}

@media (max-width:36em) {
    .page-template-single-survey .content-survey{width:90%}
    .content-survey .bottom-total-info .totals .grade-to-info .total_descrption,
    .content-survey .bottom-total-info .totals .grade-to-info .total_grade {
        width: unset
    }
    .content-survey .bottom-total-info .totals .grade-to-info .total_descrption span,
    .content-survey .bottom-total-info .totals .grade-to-info .total_grade span {
        font-size: var(--font-size-3xl)
    }
    .content-survey .bottom-total-info .totals .grade-to-info,.tigera-custom-footer .menu-footer__list{flex-direction:column}
}

.content-survey .bottom-total-info .totals .bottom-text {
    color: var(--color-gray-900);
    margin-block-end: 22px
}
.content-survey .bottom-total-info .totals a {
    border: 2px solid transparent;
    background: var(--btn-primary-bg) padding-box, var(--btn-primary-border) border-box;
    background-clip: padding-box, border-box;
    background-origin: border-box;
    border-radius: 5px;
    color: var(--btn-primary-text);
    font-weight: 700;
    padding: 12px 24px
}

.content-survey .bottom-total-info .totals a:hover {
    border: 2px solid transparent;
    background: var(--btn-primary-bg-hover) padding-box, var(--btn-primary-border) border-box;
    background-clip: padding-box, border-box;
    background-origin: border-box;
    color: var(--btn-primary-text-hover);
    text-decoration: none
}

@media (min-width:62em) {
    .posts-banner-top {
        background: var(--banner-bg);
        padding: 100px 0 119px
    }
    .posts-banner-top .posts-banner__container .posts-banner__content {
        margin: auto;
        margin-block-end: 40px;
        width: 75%
    }
    .posts-banner-top .posts-banner__container .posts-banner__content h1 {
        font-size: var(--font-size-4xl);
        line-height: 48px;
        margin-bottom: 20px;
        padding-inline: 27px
    }
}
@media (min-width: 64em) {
    .posts-banner-top .posts-banner__container{margin:70px auto 0}
}
