.quiz-statistic-section-title {
    font-style: normal;
    font-weight: bold;
    font-size: 44px;
    line-height: 53px;
    color: #494A50;
    margin-top: 75px;
    margin-bottom: 75px;
}

.quiz-statistic-back-button {
    text-decoration: none;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 17px;
    color: #9B9FA9;
    display: block;
    margin-top: 35px;
    cursor: pointer;
}

.quiz-process-back-button a,
.quiz-statistic-back-button a {
    text-decoration: none;
    color: #9B9FA9;
}

.quiz-process-back-button span,
.quiz-statistic-back-button span {
    font-size: 30px;
}

.quiz-statistic-item-list .quiz-statistic-list-item {
    clear: both;
    float: left;
    margin-bottom: 10px;
}

.quiz-statistic-item-list .quiz-statistic-list-item .quiz-statistic-list-item-number {
    float: left;
}

.quiz-statistic-item-list .quiz-statistic-list-item .quiz-statistic-list-item-name {
    float: left;
    margin-left: 20px;
}

.quiz-statistic-item-list .quiz-statistic-list-item .quiz-statistic-list-item-show-statistic-button {
    float: left;
    margin-left: 20px;
    background: #4780D8;
    border-radius: 100px;
    color: #FFFFFF;
    text-decoration: none;
    padding: 5px 10px;
    margin-top: -5px;
}

.quiz-statistic-item-list .pagination {
    clear: both;
    padding-top: 15px;
    list-style-type: none;
}

.quiz-statistic-item-list .pagination .page-item {
    float: left;
    margin-right: 10px;
}

.quiz-statistic-item-list .pagination .page-item a {
    text-decoration: none;
    display: block;
    color: black;
    width: 20px;
    padding: 5px;
    border-radius: 10px;
    height: 20px;
    text-align: center;
}

.quiz-statistic-item-list .pagination .page-item.active a {
    background-color: #4780D8;
    color: #FFFFFF;
}

.quiz-statistic-item-list .pagination .page-item:not(.disabled) a:hover {
    background-color: #4780D8;
    color: #FFFFFF;
}

.quiz-statistic-block {
    background: #FFFFFF;
    box-shadow: 0px 10px 20px rgba(67, 104, 178, 0.0544611);
    border-radius: 2px;
    max-width: 600px;
    margin: 0 auto;
    padding: 35px 60px;
}

.quiz-statistic-score-title {
    font-style: normal;
    font-weight: bold;
    font-size: 24px;
    line-height: 34px;
    color: #494A50;
}

.quiz-statistic-reset-button {
    display: block;
    text-decoration: none;
    width: fit-content;
    margin: 55px auto 0;
    padding: 15px 30px;
    background: #4780D8;
    border-radius: 100px;
    font-style: normal;
    font-weight: bold;
    font-size: 16px;
    line-height: 19px;
    color: #FFFFFF;
    cursor: pointer;
    clear: both;
}

.quiz-statistic-reset-button span {
    float: right;
    margin-top: 3px;
    margin-left: 20px;
    background-image: url("../../images/reset.svg");
    width: 15px;
    height: 15px;
    display: block;
    background-size: cover;
}

.quiz-statistic-correct-answers {
    float: left;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 26px;
    color: #494A50;
}

.quiz-statistic-correct-answers span.quiz-statistic-orb {
    margin-top: 10px;
    float: left;
    display: block;
    background: #24B6A0;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: 10px;
}

.quiz-statistic-incorrect-answers {
    margin-left: 45px;
    float: left;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 26px;
    color: #494A50;
}

.quiz-statistic-incorrect-answers span.quiz-statistic-orb {
    margin-top: 10px;
    float: left;
    display: block;
    background: #F0393B;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: 10px;
}

.quiz-statistic-count {
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 26px;
    color: #494A50;
    margin-left: 10px;
}

.quiz-statistic-answers-count-block {
    margin: 0 auto;
    width: fit-content;
}

.quiz-statistic-date {
    text-align: center;
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 14px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #9AA4BC;
    opacity: 0.9;
    margin-bottom: 20px;
    margin-top: 35px;
}

.quiz-statistic-title {
    text-align: center;
    font-style: normal;
    font-weight: bold;
    font-size: 44px;
    line-height: 53px;
    color: #494A50;
    margin-bottom: 50px;
}

.quiz-statistic-separate-line {
    border: 1px solid #EAEDF2;
    width: calc(100% + 120px);
    margin-left: -60px;
    margin-bottom: 35px;
    margin-top: 40px;
}

.quiz-statistic-content-title {
    font-style: normal;
    font-weight: normal;
    font-size: 22px;
    line-height: 22px;
    color: #494A50;
    text-align: center;
    margin-bottom: 15px;
}

.quiz-statistic-status-label span {
    display: block;
    width: 9px;
    height: 9px;
    float: left;
    background-size: cover;
    margin-top: 5px;
    margin-right: 10px;
}

.quiz-statistic-status-label {
    float: left;
    margin-right: 35px;
}

.quiz-statistic-status-label-not-ready span {
    background-image: url("../../images/red-cross.svg");
}

.quiz-statistic-status-label-almost-ready span {
    background-image: url("../../images/yellow-oval.svg");
}

.quiz-statistic-status-label-ready span {
    background-image: url("../../images/green-check-without-back.svg");
}

.quiz-statistic-status-block {
    margin: 0 auto;
    width: fit-content;
}

.quiz-statistic-content-graph-title {
    clear: both;
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 22px;
    color: #494A50;
    margin-top: 50px;
}

.quiz-statistic-content-graph-description {
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 26px;
    color: #494A50;
    margin-bottom: 25px;
}

.quiz-statistic-recommendation-block {
    clear: both;
    border-radius: 2px;
    max-width: 600px;
    margin: 0 auto 155px;
    box-shadow: 0px 10px 20px rgba(67, 104, 178, 0.0544611);
    padding: 0 60px 55px;
    height: 350px;
}

.quiz-statistic-recommendation-title {
    margin-top: 45px;
    font-style: normal;
    font-weight: normal;
    font-size: 22px;
    line-height: 22px;
    color: #494A50;
    text-align: center;
    margin-bottom: 30px;
}

.quiz-statistic-recommendation-left-block {
    width: 50%;
    float: left;
}

.quiz-statistic-recommendation-first-description {
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 26px;
    color: #494A50;
    max-width: 180px;
}

.quiz-statistic-recommendation-second-description {
    margin-top: 35px;
    font-style: normal;
    font-weight: normal;
    font-size: 12px;
    line-height: 26px;
    color: #494A50;
}

.quiz-statistic-recommendation-second-description span {
    float: left;
    background-image: url("../../images/home-without-hat.svg");
    background-size: cover;
    width: 20px;
    height: 18px;
    display: block;
    margin-right: 10px;
}

.quiz-statistic-recommendation-third-description {
    font-style: normal;
    font-weight: normal;
    font-size: 12px;
    line-height: 26px;
    color: #494A50;
}

.quiz-statistic-recommendation-third-description span {
    float: left;
    background-image: url("../../images/study-hat-without-back.svg");
    background-size: cover;
    width: 26px;
    height: 18px;
    display: block;
    margin-right: 10px;
    margin-left: -4px;
}


.quiz-statistic-recommendation-right-block {
    width: 50%;
    float: right;
    position: relative;
}

.quiz-statistic-recommendation-image {
    position: absolute;
    width: 270px;
    height: 275px;
    background-repeat: no-repeat;
    background-image: url("../../images/quiz/statistic/statistic-recommendation.svg");
    background-size: cover;
}

.quiz-statistic-recommendation-button {
    background: #4780D8;
    border-radius: 100px;
    font-style: normal;
    font-weight: bold;
    font-size: 16px;
    line-height: 19px;
    color: #FFFFFF;
    margin-top: 25px;
    padding: 15px 35px;
    width: fit-content;
}

.quiz-statistic-recommendation-button span {
    font-size: 23px;
    font-weight: bold;
}

.quiz-statistic-content-graph-item {
    height: 25px;
    margin-bottom: 20px;
    clear: both;
    width: 100%;
}

.quiz-statistic-content-graph-item-line {
    margin-left: 20px;
    width: calc(100% - 30px);
    height: 100%;
    mix-blend-mode: normal;
    border-radius: 2px;
    position: relative;
}

.quiz-statistic-content-graph-item-line .quiz-statistic-content-graph-item-line-progress{
    height: inherit;
    position: absolute;
}
.quiz-statistic-content-graph-item-line.check .quiz-statistic-content-graph-item-line-progress {
    background-color: #2FB577;
}
.quiz-statistic-content-graph-item-line.oval .quiz-statistic-content-graph-item-line-progress {
    background-color: #FAC535;
}
.quiz-statistic-content-graph-item-line.cross .quiz-statistic-content-graph-item-line-progress {
    background-color: #fed8d8;
}

.quiz-statistic-content-graph-item-study-button {
    width: 15px;
    height: 15px;
    display: block;
    background-image: url("../../images/left_menu/study.png");
    float: left;
    margin-top: 6px;
    margin-left: -30px;
    background-size: cover;
    cursor: pointer;
}

.quiz-statistic-content-graph-item-status-button.quiz-statistic-content-graph-item-status-button-check {
    background-image: url("../../images/green-check-without-back.svg");
}

.quiz-statistic-content-graph-item-status-button.quiz-statistic-content-graph-item-status-button-oval {
    background-image: url("../../images/yellow-oval.svg");
}

.quiz-statistic-content-graph-item-status-button.quiz-statistic-content-graph-item-status-button-cross {
    background-image: url("../../images/red-cross.svg");
}

.quiz-statistic-content-graph-item-status-button {
    display: block;
    width: 9px;
    height: 9px;
    float: left;
    background-size: cover;
    margin-top: 8px;
    margin-right: 10px;
}

.quiz-statistic-content-graph-item-label {
    font-style: normal;
    font-weight: bold;
    font-size: 14px;
    line-height: 17px;
    color: #494A50;
    float: left;
    margin-top: 5px;
    margin-left: 10px;
    position: inherit;
}

.quiz-statistic-content-graph-item-percent {
    float: left;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 17px;
    color: #494A50;
    mix-blend-mode: normal;
    opacity: 0.7;
    margin-left: 10px;
    margin-top: 5px;
    position: inherit;
}

.quiz-statistic-diagram {
    text-align: center;
    position: relative;
}

.quiz-statistic-diagram-value {
    width: 250px;
    position: absolute;
    font-style: normal;
    font-weight: 300;
    font-size: 75px;
    line-height: 93px;
    color: #494A50;
    top: calc(100% - 50% - 45px);
    left: calc(100% - 50% - 125px);
    text-align: center;
}

.quiz-statistic-diagram-value span {
    color: #A3A6B5;
}

.main-content-statistic-example {
    width: 100%;
    background-color: #edeff2;
}

.statistic-example {
    width: 50%;
    float: left;
    text-align: right;
}

.statistic-authorization {
    width: 50%;
    float: right;
    background-color: #fff;
}

.statistic-authorization-block {
    margin: 90px auto 130px;
    width: fit-content;
}

.statistic-authorization-title {
    margin-top: 20px;
    font-style: normal;
    font-weight: 600;
    font-size: 34px;
    line-height: 35px;
    color: #494A50;
    width: 340px;
}

.statistic-authorization-description {
    margin-top: 15px;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 23px;
    color: #494A50;
    opacity: 0.8;
    width: 300px;
}

.statistic-authorization-block form {
    margin-top: 50px;
    background-color: #fff;
    box-shadow: none;
}

.statistic-authorization-block form .form-row {
    margin: 29px 0 0;
    width: 100%;
}

.statistic-authorization-block form .form-row label {
    color: black;
    padding-left: 0px;
}

.statistic-authorization-block .auth-page-sign-up-form-name-block,
.statistic-authorization-block .auth-page-sign-up-form-surname-block {
    max-width: 220px;
}

.statistic-authorization-block form .form-row input[type="text"],
.statistic-authorization-block form .form-row input[type="email"],
.statistic-authorization-block form .form-row input[type="password"] {
    color: black;
    background-color: #F7F8FA;
    width: calc(100% - 40px);
}

.statistic-authorization-block form .form-row input:checked + label:before {
    margin-left: 3px;
}

body .statistic-authorization-block form .form-row.auth-page-form-other-info-block {
    color: black;
    width: 100%;
}

.statistic-authorization-login-link {
    color: #F7B631;
    text-decoration: none;
}

.quiz-statistic-content-graph-item-border {
    width: 30%;
    height: 100%;
    position: absolute;
    top: 0px;
    opacity: 0.2;
}

.quiz-statistic-content-graph-item-almost-border {
    right: calc(30% + 2px);
    background: repeating-linear-gradient(0deg, #F5BA26, #F5BA26 4px, #FFF 4px, #FFF 7px);
}

.quiz-statistic-content-graph-item-ready-border {
    right: 0px;
    height: 100%;
    background: repeating-linear-gradient(0deg, #2FB577, #2FB577 4px, #FFF 4px, #FFF 7px);
}

.quiz-statistic-content-graph-block {
    position: relative;
}
