.smallcontainer{
    max-width: 914px;
}

.survey_question_wrapper:not([data-attrib-queid="Q1"]) {
    display: none;
}


.answer-stack-actions>.component-content{
    display: flex;
    flex-flow: column wrap;
    gap: 10px;
    width: 100%;
    padding: 0 20px 20px;
    background-color: var(--question-wizard-bg);
    margin-bottom: 40px;
}

@media (min-width: 768px) {
    .answer-stack-actions>.component-content{
         padding: 0 50px 50px;
        flex-flow: row nowrap;
        justify-content: space-between;
    
       
    }
    .answer-stack-actions .quantum-button {
        width: 175px;
    }

}

.survey_question_wrapper .answer-stack{
    margin-bottom: 0;
}

.page-survey-quiz-results .survey_wrapper.question-section {
    background-color: white !important;
    padding:0px 20px !important;
}

.page-survey-quiz-results .answer-btn span {
    --answer-btn-bg: var(--question-wizard-bg);
}

.page-survey-quiz-results .survey_question_wrapper:not([data-attrib-queid="Q1"]) {
    display: block !important;
}
.page-survey-quiz-results .answer-stack {
    margin-top: 25px;
}
.page-survey-quiz-results .survey_question_wrapper {
    margin-bottom: 30px;
}
@media (max-width: 767px){
   .page-survey-quiz-results .survey_question_wrapper h2 {
        font-size: 20px;
    }
}

.page-survey-quiz-results .correctans span{
    --answer-btn-bg: #dbf5e6;
	--answer-btn-color: #237f4a;
}

.page-survey-quiz-results .answer-btn{
	pointer-events: none;
}

.page-survey-quiz-results .survey_wrapper.question-section h2 {
    font-size: 16px;
    line-height: 18px;
}

.page-survey-quiz-results .survey_wrapper.question-section .answer-btn > input + span {
    display: flex;
    background-color: var(--answer-btn-bg);
    color: var(--answer-btn-color);
    padding: 10px 18px;
    font-weight: 600;
}

.page-survey-quiz-results .answer-stack {
    margin-top: 10px;
}

.page-survey-quiz-results .container.question-section {
    margin-bottom: 40px;
}

.page-survey-quiz .survey-question-count > span {
    width: 44px;
    height: 44px;
    background-color: #0063c3;
    color: #fff;
    font-size: 16px;
}
.page-survey-quiz .progress-slider {
    background-color: transparent;
}
.page-survey-quiz .survey-progress-bar {
    position: relative;
    background-color: var(--survey-progress-bar-bg);
    padding: 15px 30px 10px;
}
.page-survey-quiz .survey-question-count {
    justify-content: space-between;
}

@media (max-width: 767px){
    .page-survey-quiz .survey-question-count > span {
        width: 22px !important;
        height: 22px !important;
        font-size: 10px !important;
    }
    .page-survey-quiz .survey-progress-bar {
        padding: 10px;
    }
}
.page-survey-quiz-category .category [data-attrib-queid="C1Q1"]{
    display: block;
}

.page-survey-quiz .survey-question-count > span {
    width: 35px;
    height: 35px;
    font-size: 15px;
    font-weight: 500;
    background-color: #d8e7f6;
    color: #0063c3;
    border: 1px solid #accceb;
}
.page-survey-quiz .progress-slider {
    height: 1px;
    margin: auto;
    bottom: 0;
    background-color: var(--primary-color);
}


.page-survey-quiz .survey-question-count::after {
    border-top: 1px solid #accceb;
}

.page-survey-quiz span.survey-ques-completed-stage {
    background-color: #0063c3;
    color: #fff;
    border: 1px solid #0063c3;
}

.page-survey-quiz span.survey-ques-current-stage {
    background-color: #fff;
    color: #0063c3;
    border: 1px solid #0063c3;
}

.page-survey-quiz-results .question-section .question-section  {
    background-color: white !important;
    padding:0px 20px !important;
}
.surcatrefcount:empty{
    display: none;
}

.page-survey-quiz-results .category h2 {
    font-size: 16px;
    line-height: 18px;
}

.page-survey-quiz-results .category .answer-btn > input + span {
    display: flex;
    background-color: var(--answer-btn-bg);
    color: var(--answer-btn-color);
    padding: 10px 18px;
    font-weight: 600;
}
.survey-progress{
    transform: translateY(0);
}
.progress-slider{
    transition: all ease .2s;
}
.page-survey-quiz .survey-question-count::after {
    border-top: 0;
    height: 1px;
    background-color: #accceb;
    margin-top: auto;
    margin-bottom: auto;
    top: 0;
    bottom: 0;
}
.survey-question-count > span{
    transition: all ease .2s;
}

.page-survey-quiz-results .toggle-content > .component.content:nth-child(3){
    display: none;
 }
 
 
 /* Survey Quiz Component */

.quiz-component-sec .quest-category {
    width: 8px;
    z-index: 1;
    height: 8px;
    border-radius: 50%;
    background-color: #accceb;
    transition: all ease .2s;
}

.quiz-component-sec .quest-category-circle {
    width: 35px;
    height: 35px;
    font-size: 15px;
    font-weight: 500;
    background-color: #d8e7f6;
    color: #0063c3;
    border: 1px solid #accceb;
    position: absolute;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border-radius: 100%;
    left: 0px;
    z-index: 1;
    transition: all ease .2s;
}

.quiz-component-sec .category_segment {
    position: relative;
    display: flex;
    justify-content: space-around;
    padding-left: 35px;
    width: 100%;
    height: 35px;
    align-items: center;
}

.quiz-component-sec .quest-category-text {
    position: absolute;
    bottom: 0;
    width: 65px;
    white-space: nowrap;
    transform: translate(-17px, 124%);
    left: 0px;
    font-size: 15px;
    text-align: center;
}

.quiz-component-sec .category_segment:last-child {
    width: auto;
}

.quiz-component-sec {
    padding: 1rem 5rem 3rem !important;
}

.quiz-component-sec .active .quest-category-circle {
    background-color: #fff;
    color: #0063c3;
    border: 1px solid #0063c3;
}

.quiz-component-sec .completed .quest-category-circle {
    background-color: #0063c3;
    color: #fff;
    border: 1px solid #0063c3;
}

.quiz-component-sec .active-que {
    background-color: #fff;
    border: 1px solid #0063c3;
}

.quiz-component-sec .completed-que,
.quiz-component-sec .completed .quest-category {
    background-color: #0063c3;
    border: 1px solid #0063c3;
}

.quiz-component-sec .active .quest-category-text {
    font-weight: 600;
}

@media (max-width: 767px) {
    .quiz-component-sec {
        padding: 10px 2rem 3rem !important;
    }

    .quiz-component-sec .quest-category-text {
        font-size: 12px;
    }

    .quiz-component-sec .quest-category-circle {
        width: 25px;
        height: 25px;
        font-size: 12px;
    }

    .quiz-component-sec .category_segment {
        padding-left: 25px;
        height: 25px;
    }
}

.progress-slider {
    height: 1px;
    margin: auto;
    bottom: 0;
    background-color: var(--primary-color);
}

.survey-question-count::after {
    border-top: 0;
    height: 1px;
    background-color: #accceb;
    margin-top: auto;
    margin-bottom: auto;
    top: 0;
    bottom: 0;
}
.page-survey-quiz-results .question-section + .margin-tb-40 h2{
    margin-bottom: 20px;
}