:root {
    --font-family: "Gilroy", sans-serif;
    --font-family-italic: "Gilroy", sans-serif;
    --font-accent: "Gilroy", sans-serif;
    --font-accent-bold: "GilroyBold", sans-serif;
    --font-medium: "GilroyMedium", sans-serif;
    --font-accent-semibold: "GilroySemibold", sans-serif;
    --font-light: "GilroyLight", sans-serif;
    --bg: #f2f4f7;
    --card: #fff;
    --text: #111827;
    --muted: rgba(0, 0, 0, 0.55);
    --line: rgba(0, 0, 0, 0.08);
    --accent: #ff3016;
    --accent-weak: rgba(255, 48, 22, 0.07);
    --shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
    --radius: 14px;
    --radius-sm: 10px;
    --desktop-h: 553px;
    --mobile-h: 607px;
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family:
        ui-sans-serif,
        system-ui,
        -apple-system,
        Segoe UI,
        Roboto,
        Arial,
        "Noto Sans",
        "Apple Color Emoji",
        "Segoe UI Emoji";
    color: var(--text);
    background: var(--bg);
}

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

.quiz-shell {
    width: 100%;
    max-width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 350px;
    align-items: start;
    border-radius: 10px;
    border: 1px solid #f5f5f5;
    box-shadow: 0 3px 15px 0 rgba(0, 0, 0, 0.07);
    overflow: hidden;
}

.quiz-card {
    height: var(--desktop-h);
    background: #fff;
    padding: 33px 30px 30px;
}

.sidebar {
    height: var(--desktop-h);
    overflow: hidden;
    display: grid;
    grid-template-rows: auto 1fr auto;
    background: #f5f5f5;
    padding: 11px 20px 20px;
}

.quiz-head {
    padding: 2px 0 14px;
    display: flex;
    align-items: center;
    gap: 7px;
}

.avatar {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: url("../img/spec.webp") no-repeat;
    background-size: cover;
    position: relative;
    flex: 0 0 auto;
}

.status-dot {
    position: absolute;
    right: 1px;
    bottom: 1px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #22c55e;
}

.modal-body p.head-name,
.head-name {
    font-size: 18px;
    font-weight: 600;
    margin: 0;
}

.modal-body p.head-role,
.head-role {
    font-size: 14px;
    color: var(--muted);
    margin: 2px 0 0;
}

.quiz-body {
    padding: 0 0 15px;
    overflow-y: auto;
    height: 312px;
}

.step {
    height: 100%;
}

.question-title {
    font: 700 24px/1.2 var(--font-accent-bold);
    margin: 0 0 8px;
    color: #2d2f33;
}

.modal-body p.question-hint,
.question-hint {
    margin: 0 0 16px;
    color: var(--muted);
    font-size: 13px;
    border-radius: 4px;
    background: #f5f5f5;
    padding: 10px 10px 10px 31px;
    display: flex;
    align-items: center;
    gap: 7px;
    position: relative;
}

.modal-body p.question-hint:before,
.question-hint:before {
    content: "";
    position: absolute;
    left: 10px;
    width: 18px;
    height: 18px;
    display: flex;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18' fill='none'%3E%3Cpath d='M9 12.75C9.2125 12.75 9.39075 12.678 9.53475 12.534C9.67875 12.39 9.7505 12.212 9.75 12V9C9.75 8.7875 9.678 8.6095 9.534 8.466C9.39 8.3225 9.212 8.2505 9 8.25C8.788 8.2495 8.61 8.3215 8.466 8.466C8.322 8.6105 8.25 8.7885 8.25 9V12C8.25 12.2125 8.322 12.3907 8.466 12.5347C8.61 12.6787 8.788 12.7505 9 12.75ZM9 6.75C9.2125 6.75 9.39075 6.678 9.53475 6.534C9.67875 6.39 9.7505 6.212 9.75 6C9.7495 5.788 9.6775 5.61 9.534 5.466C9.3905 5.322 9.2125 5.25 9 5.25C8.7875 5.25 8.6095 5.322 8.466 5.466C8.3225 5.61 8.2505 5.788 8.25 6C8.2495 6.212 8.3215 6.39025 8.466 6.53475C8.6105 6.67925 8.7885 6.751 9 6.75ZM9 16.5C7.9625 16.5 6.9875 16.303 6.075 15.909C5.1625 15.515 4.36875 14.9808 3.69375 14.3063C3.01875 13.6318 2.4845 12.838 2.091 11.925C1.6975 11.012 1.5005 10.037 1.5 9C1.4995 7.963 1.6965 6.988 2.091 6.075C2.4855 5.162 3.01975 4.36825 3.69375 3.69375C4.36775 3.01925 5.1615 2.485 6.075 2.091C6.9885 1.697 7.9635 1.5 9 1.5C10.0365 1.5 11.0115 1.697 11.925 2.091C12.8385 2.485 13.6323 3.01925 14.3063 3.69375C14.9803 4.36825 15.5148 5.162 15.9098 6.075C16.3048 6.988 16.5015 7.963 16.5 9C16.4985 10.037 16.3015 11.012 15.909 11.925C15.5165 12.838 14.9823 13.6318 14.3063 14.3063C13.6303 14.9808 12.8365 15.5152 11.925 15.9097C11.0135 16.3042 10.0385 16.501 9 16.5Z' fill='%23B0B0B0' fill-opacity='0.8'/%3E%3C/svg%3E");
}

.options {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 31px;
    row-gap: 11px;
    column-gap: 10px;
    max-width: 96%;
}

.modal-body label.option,
.option {
    color: rgba(45, 47, 51, 1);
    border-radius: 4px;
    border: 1px solid #efefef;
    padding: 14px 14px;
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    user-select: none;
    transition:
        border-color 0.15s ease,
        background-color 0.15s ease;
    background: #fff;
    min-height: 55px;
}

.option:hover {
    border-color: var(--accent);
}

.control {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ebebeb;
}

.modal-body label.option.is-radio .control,
.option.is-radio .control {
    position: relative;
}

.modal-body label.option.is-radio .control::before,
.option.is-radio .control::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    margin: auto;
    width: 18px;
    height: 18px;
    border: 1px solid #ecf0f9;
    border-radius: 50%;
    transition: all 0.2s ease;
    background-color: #ecf0f9;
}

.modal-body label.option.is-radio .control::after,
.option.is-radio .control::after {
    content: "";
    position: absolute;
    top: 0;
    left: 2px;
    bottom: 0;
    margin: auto;
    width: 14px;
    height: 14px;
    transform: scale3d(0, 0, 0);
    border-radius: 50%;
    background-color: transparent;
    transition: all 0.2s ease;
}

.modal-body label.option.is-radio.is-selected .control::after,
.option.is-radio.is-selected .control::after {
    transform: scale3d(0.9, 0.9, 0.9);
    /* scale3d(1, 1, 1); */
    background-color: #ff3016;
    /* left: 9px; */
}

.modal-body label.option.is-radio.is-selected .control::before,
.option.is-radio.is-selected .control::before {
    border: 3px solid rgb(255 182 175);
}

.modal-body label.option.option.is-checkbox .control,
.option.is-checkbox .control {
    border-radius: 6px;
}

.modal-body label.option.is-checkbox .control::after,
.option.is-checkbox .control::after {
    border-radius: 3px;
}

.option-text {
    font-size: 16px;
    line-height: 1.2;
    font-weight: 400;
}

.modal-body label.option.is-selected .option-text,
.option.is-selected .option-text {
    font-weight: 500;
    font-family: var(--font-medium);
    width: 88%;
}

.modal-body label.option.is-selected,
.option.is-selected {
    border-color: var(--accent);
    background: var(--accent-weak);
    box-shadow: 0 2px 8px 0 rgba(173, 31, 13, 0.1);
}

/* .options.is-error .option {
    border-color: rgba(255, 59, 48, 0.35);
} */

/* .error-row {
    margin-top: 10px;
    font-size: 12px;
    color: rgba(255, 59, 48, 0.95);
    display: none;
}

.error-row.is-visible {
    display: block;
} */

.quiz-foot {
    width: 100%;
    padding: 10px 0;
    border-top: 1px solid rgba(239, 239, 239, 1);
    display: grid;
    gap: 12px;
    position: relative;
}

.quiz-foot .nav {
    justify-content: flex-end;
    align-items: flex-start;
}

.progress {
    display: flex;
    flex-flow: column;
    gap: 5px;
    height: auto;
    background: transparent;
    overflow: visible;
}

.progress-bar {
    height: 6px;
    background: #efefef;
    border-radius: 999px;
    overflow: hidden;
}

.progress-bar>span {
    display: block;
    height: 100%;
    width: 0%;
    background: #50a6a3;
    border-radius: 999px;
    transition: width 0.2s ease;
}

.progress-text {
    display: flex;
    justify-content: end;
    font-size: 12px;
    color: var(--muted);
    white-space: nowrap;
}

.nav {
    display: flex;
    align-items: center;
    gap: 10px;
}

.btn:active {
    transform: translateY(1px);
}

.btn-next {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    width: 188px;
    justify-content: center;
    height: 55px;
    gap: 10px;
    border-radius: 4px;
    background: #ff3016;
    border: 1px solid #ff3016;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
}

.btn-next.btn-next[disabled] {
    opacity: 0.7;
    cursor: not-allowed;
    background: #ff3016;
    border: 1px solid #ff3016;
    color: #fff;
}

.btn-text {
    color: rgba(176, 176, 176, 0.8);
    text-align: center;
    font-size: 14px;
    font-weight: 500;
}

.btn-ghost.btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 54px;
    height: 54px;
    border-radius: 6px;
    background-color: #efefef;
    border: 1px solid #efefef;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cmask id='mask0_1_2135' style='mask-type:luminance' maskUnits='userSpaceOnUse' x='0' y='0' width='24' height='24'%3E%3Cpath d='M24 0H0V24H24V0Z' fill='white'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_1_2135)'%3E%3Cpath d='M2.89014 12H20.8901' stroke='%23808080' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M8.89014 18L2.89014 12L8.89014 6' stroke='%23808080' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3C/svg%3E");
    background-position: center;
    padding: 10px;
    background-repeat: no-repeat;
}

.btn-ghost:disabled {
    opacity: 0.7;
}

.btn-ghost.btn:active {
    background-color: #efefef;
    border: 1px solid #efefef;
}

.tooltip {
    position: absolute;
    right: 18px;
    bottom: 62px;
    background: #9f9290;
    color: #fff;
    font-size: 12px;
    line-height: 1.2;
    padding: 8px 10px;
    border-radius: 10px;
    opacity: 0;
    transform: translateY(6px);
    pointer-events: none;
    transition:
        opacity 0.12s ease,
        transform 0.12s ease;
    max-width: 220px;
}

.tooltip.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.sidebar-head {
    padding: 16px 18px;
    border-bottom: 1px solid var(--line);
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 800;
}

.sidebar-list {
    position: relative;
    height: 426px;
    padding: 0 0 15px 4px;
    overflow: auto;
    margin-left: -4px;

}

.sidebar-list:before {
    content: '';
    top: 15px;
    height: 100%;
    position: absolute;
    left: 23px;
    border-left: 1px solid #D7D7D7;
}

.step-item {
    display: flex;
    align-items: center;
    padding: 10px 0 6px;
    font-size: 16px;
    color: #2d2f33;
    font-weight: 400;
    gap: 10px;
}

.step-item.is-active {
    /* text-shadow: #2D2F33 0 -2px; */
    font-weight: 600;
    color: #2d2f33;
}

.step-ico {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 39px;
    height: 39px;
    border-radius: 50%;
    background: #f5f5f5;
    flex: 0 0 auto;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1));
}

.step-item.is-active .step-ico {
    border: 2px solid rgba(80, 166, 163, 0.3);
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1));
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='33' height='33' viewBox='0 0 33 33' fill='none'%3E%3Ccircle cx='16.5' cy='16.5' r='16' fill='white' stroke='%2350A6A3'/%3E%3C/svg%3E");
}

.step-item .step-ico svg path {
    /* stroke:#B0B0B0; */
}

.step-item.is-active .step-ico svg path {
    fill: #50a6a3;
    stroke-opacity: 1;
}

.step-item.is-done .step-ico {
    background: #50a6a3;
}

.step-item.is-done .step-ico svg path {
    stroke-opacity: 0.8;
}

.step-item.is-done .step-ico svg path {
    fill: #ffffff;
    stroke-opacity: 1;
}

.sidebar-foot {
    padding: 12px 0 0;
    border-top: 1px solid var(--line);
    color: var(--muted);
    font-size: 12px;
    margin: 0 -2px;
}

.sidebar-foot-title {
    color: rgba(45, 47, 51, 0.8);
    font: 500 14px/1.2 var(--font-medium);
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    margin: 0 0 7px 0;
}

.list_bonus {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin: 0 -3px;
}

.list_bonus .item {
    position: relative;
    height: 64px;
    display: flex;
    align-items: center;
}

.list_bonus .item img {
    position: absolute;
    width: 100%;
    height: 100%;
    right: 0;
    bottom: 0;
    z-index: 1;
    object-fit: cover;
}

.list_bonus .item span {
    position: relative;
    padding: 10px;
    z-index: 2;
    color: #2d2f33;
    font-size: 12px;
    font-weight: 500;
}

.step-item.is-active .step-ico.step-ico-4 svg path,
.step-item.is-active .step-ico.step-ico-7 svg path,
.step-item.is-active .step-ico.step-ico-8 svg path {
    fill: transparent;
    stroke-opacity: 1;
    stroke: #50a6a3;
}

.step-item.is-done .step-ico.step-ico-4 svg path,
.step-item.is-done .step-ico.step-ico-7 svg path,
.step-item.is-done .step-ico.step-ico-8 svg path {
    fill: transparent;
    stroke-opacity: 1;
    stroke: #ffffff;
    stroke-opacity: 1;
}

/* final step  */
.final-step {
    max-width: 550px;
    margin: 0 auto;
}

.final-title {
    font: 700 24px/1.2 var(--font-accent-bold);
    color: #2D2F33;
    margin: 30px 0 5px;
    text-align: center;
}

.final-title span {
    color: #50A6A3;
}

.final-desc {
    font: 400 14px/1.2 var(--font-family);
    text-align: center;
}

.form-qwiz {
    max-width: 355px;
    margin: 20px auto 0;
}

.form-qwiz label.final-label {
    color: #808080;
    text-transform: uppercase;
    font: 500 14px/1.2 var(--font-medium);
    margin: 0 0 8px 0;
}

.form-qwiz .final-input {
    display: flex;
    align-items: center;
    padding: 0 12px;
    border-radius: 5px;
    border: 1px solid #C4C4C4;
    height: 50px;
    width: 100%;

}

.btn-sbm {
    height: 54px;
    width: 100%;
}

.agree-wrp {
    display: flex;
    gap: 2px;
    text-decoration: none;
    text-decoration-skip-ink: none;
    color: #2168de;
    font-weight: 400;
    font-size: 12px;
    margin: 8px 0 0;
    color: #808080;
}

.agree-wrp label {
    position: relative;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.agree-wrp label span {
    padding-left: 22px;
    font-size: 12px;
}

.agree-wrp input[type="checkbox"] {
    position: absolute;
    left: 0;
    top: 1px;
    display: none;
}

.agree-wrp input[type="checkbox"]+span {
    position: relative;
    padding-left: 22px;
}

.agree-wrp input[type="checkbox"]+span:before {
    content: "";
    position: absolute;
    left: 0;
    width: 15px;
    height: 15px;
    background-color: rgba(128, 128, 128, 1);
    border: 1px solid #ffffff;
    background-size: contain;
    border-radius: 4px;
    background-position: center center;
}

.agree-wrp input[type="checkbox"]:checked+span:before {
    background-color: transparent;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18' fill='none'%3E%3Cpath d='M7.95 12.15L13.2375 6.8625L12.1875 5.8125L7.95 10.05L5.8125 7.9125L4.7625 8.9625L7.95 12.15ZM3.75 15.75C3.3375 15.75 2.9845 15.6033 2.691 15.3097C2.3975 15.0162 2.2505 14.663 2.25 14.25V3.75C2.25 3.3375 2.397 2.9845 2.691 2.691C2.985 2.3975 3.338 2.2505 3.75 2.25H14.25C14.6625 2.25 15.0157 2.397 15.3097 2.691C15.6038 2.985 15.7505 3.338 15.75 3.75V14.25C15.75 14.6625 15.6033 15.0157 15.3097 15.3097C15.0162 15.6038 14.663 15.7505 14.25 15.75H3.75Z' fill='%23808080'/%3E%3C/svg%3E");

}

/* end final step  */
.quiz-head,
.quiz-foot {
    transition: opacity .2s ease, transform .2s ease;
}

.quiz-shell.is-final .quiz-head,
.quiz-shell.is-final .quiz-foot {
    opacity: 0;
    transform: translateY(-8px);
    pointer-events: none;
    height: 0;
    padding: 0;
}

.quiz-shell.is-final .quiz-body {
    height: 458px;
}

.quiz-shell.is-final .step {
    height: auto;
}

.wrp_type_svyaz {
    margin: 15px 0 10px;

}

.columns_type_svyaz {
    display: flex;
    flex-wrap: wrap;
    row-gap: 0px;
    column-gap: 40px;
    margin: 0 -5px;
}

.type_svyaz_ttl {
    margin: 0;
    color: #808080;
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
}

.columns_type_svyaz input {
    display: none;
}

.columns_type_svyaz input~span {
    position: relative;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    padding-left: 22px;
}

.columns_type_svyaz input~span svg,
.columns_type_svyaz input~span.logo_mess {
    margin-left: 4px;
}

.columns_type_svyaz label {
    display: flex;
    cursor: pointer;
    padding: 8px 5px;
}

.columns_type_svyaz input~span:before {
    content: '';
    position: absolute;
    left: 0;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    display: flex;
    background: #EBEBEB;
}

.columns_type_svyaz input:checked~span:before {
    content: '';
    position: absolute;
    left: 0;
    width: 18px;
    height: 18px;
    display: flex;
    box-shadow: 0 0 4px rgba(173, 31, 13, 0.35);
    border: 3px solid #ffc1ba;
    background-color: #ff3016;
    border-radius: 50%;
    /* filter: drop-shadow(0 0 10px rgba(173, 31, 13, 0.35)); */
}

.logo_mess {
    width: 14px;
    height: 14px;
    display: block;
    background-size: cover;
    margin-left: 4px;
}

.logo_mess1 {
    background: url("../img/logo-msg.svg");
}


@media(max-width:992px) {
    .quiz-shell {
        grid-template-columns: minmax(0, 1fr) 217px;
    }

    .step-item {
        font-size: 12px;
    }

    .list_bonus .item {
        height: 44px;
    }

    .list_bonus .item span {
        font-size: 8px;
        padding: 5px;
    }

    .option-text {
        font-size: 14px;
    }
}

@media(max-width:992px) {
    .quiz-card {
        padding: 35px 10px 30px;

    }

    .sidebar {
        padding: 11px 10px 20px;
    }
}

@media (max-width: 767px) {
    .quiz-shell {
        grid-template-columns: 1fr;
    }

    .sidebar {
        order: -1;
        height: auto;
        display: flex;
        background: #ffffff;
        padding: 26px 20px 10px;
    }

    .sidebar-list:before {
        content: '';
        top: auto;
        height: 1px;
        position: absolute;
        left: 23px;
        border-bottom: 1px solid #D7D7D7;
        bottom: 34px;
        width: 100%;
    }

    .step-item {
        font-size: 12px;
        width: 39px;
        color: transparent;
    }

    .step-ico {
        width: 30px;
        height: 30px;
    }

    .quiz-shell .sidebar-foot {
        display: none;
        padding: 0;
        border: none
    }

    .sidebar-list {
        height: 53px;
        display: flex;
        margin-left: -4px;
        gap:15px;
    }

    .quiz-card {
        padding: 0 18px 15px;
        height: var(--mobile-h);
        display: flex;
        flex-flow: column;
    }

    .options {
        grid-template-columns: 1fr;
        max-width: 100%;
    }

    .tooltip {
        right: 12px;
        bottom: 74px;
    }

    .step-item.is-active {
        color: transparent;
    }

    .step-item svg {
        width: 20px;
        height: 20px;
    }

    .step-item .step-ico-9 {
        width: 17px;
        height: 17px;
    }

    .quiz-top {
        order: 4;
    }

    .quiz-body {
        height: 469px;
    }

    .quiz-head {
        display: none;
    }

    .question-title {
        font-size: 20px;
        margin: 0 0 13px;
    }

    .question-hint {
        margin: 0 0 16px;
        font-size: 14px;
        padding: 7px 7px 7px 30px;
        align-items: flex-start;
        gap: 7px;
    }

    .question-hint:before {
        left: 6px;
    }

    .option {
        min-height: 50px;

    }

    .options {
        max-width: 100%;
        row-gap: 10px;
    }

    .quiz-foot .nav {
        justify-content: flex-start;
        align-items: flex-start;
        width: 100%;
        display: grid;
        grid-template-columns: 54px 80%;
        gap: 10px;
    }

    .btn-next {
        width: 100%;
    }

    .final-title {
        font-size: 20px;
        text-align: left;
        margin: 21px 0 25px;
    }

    .final-desc {
        display: none;
    }

    .form-qwiz label.final-label {
        font-size: 12px;
    }

    .quiz-shell.is-final .sidebar-list {
        display: none;
    }

    .quiz-shell.is-final .sidebar-foot {
        display: block;
        width: 100%;
    }

    .list_bonus .item span {
        font-size: 12px;
    }

    .list_bonus .item {
        height: 60px;
        padding-right: 15px;
        padding: 0 15px 0 7px;
    }

    .sidebar-foot-title {
        font-size: 14px;
        text-transform: none;
    }

    .wrp_type_svyaz {
        margin: 20px 0 20px;
    }

    .columns_type_svyaz {
        display: flex;
        flex-wrap: wrap;
        row-gap: 4px;
        column-gap: 7px;
        margin: 7px -2px;
    }

    .quiz-shell.is-final .quiz-body {
        height: 517px;
        overflow-x: hidden;
    }
}


@media(max-width:767px) {
    .columns_type_svyaz label {
        width: 44%;
    }
}

input.error,
.input.error {
    border: 1px solid red;
}

label.error {
    display: none !important;
}

#quiz-modal .modal-content,
.quiz-modal .modal-body {
    background-color: transparent;
}

.quiz-modal .btn-close {
    position: absolute;
}