.instructions pre {
    text-wrap: wrap;
    margin-bottom: 1rem !important;

}
.question-section span{
    white-space: nowrap;
}
.question-section  .general-sections-nav{
    overflow: auto;
    display: flex;
    max-width: initial;
    gap: 20px;
}
.side__panel__section {
    width: 100%;
}

.side_panel_submit_general:disabled {
    background: #23cabe7d;
    cursor: not-allowed;
}

.question-section {
    padding: 22px;
    font-size: 20px;
    display: flex;
    gap: 28px;
    justify-content: center;
    background: #e6e6e6;
    font-weight: 600;
}

.general_disabled_color {
    color: #9d9d9d !important;
}

.general_enabled_color {
    color: #000 !important;
}

.section_index_no {
    display: flex;
    flex-wrap: wrap;
}

.breadcrumb-item+.breadcrumb-item::before {
    content: '>' !important;
}

.navbar-nav {
    font-size: 16px;
    font-weight: 500;
}

.image .profile__rounded__image {
    height: 35px;
    width: 35px;
    border-radius: 50%;
}

.content-wrapper {
    margin-left: 0 !important;
}


.field_required::after {
    content: "*";
    color: red;
    margin-left: 2px;
}

.custom-side-nav {

    background: #f4f6f9;
}

.custom-sidebar {

    background: #345370 !important;
}

.nav-item .active {

    background: #345370 !important;
}

.text-right a {
    border-color: #345370 !important;
    background: #345370 !important;
    color: #fff;
}

.paginate_button.active {

    background: #345370 !important;

}

.card-body {

    overflow-x: auto;
}

.page-item.active .page-link {

    border-color: #345370 !important;
    background: #345370 !important;
}

.breadcrumb li.breadcrumb-item a {

    color: #345370 !important;
}

.accordion-item button.accordion-button {

    background-color: #345370;
    color: #fff;
    font-weight: 500;
}

.accordion-item button.accordion-button:focus {

    background-color: #345370;
}

.custom-side-nav-bar {

    position: fixed !important;
    height: 100% !important;
}

.circular-image-container {
    width: 100px;
    /* Set the desired size for the circular container */
    height: 100px;
    /* Should be the same as width for a perfect circle */
    overflow: hidden;
    border-radius: 50%;
    margin: auto;
}

.circular-image {
    width: 100%;
    /* Make sure the image covers the circular container */
    height: 100%;
    /* Should be the same as width for a perfect circle */
    object-fit: cover;
    border-radius: 50%;
    display: block;
}

.program_banner {
    background: rgb(219, 237, 255);
}

.Pause .test__status::after,
.Pending .test__status::after,
.Progress .test__status::after,
.Partial .test__status::after,
.Completed .test__status::after,
.expired .test__status::after,
.InActive .test__status::after {
    content: attr(data-value);
    padding: 3px;
    font-size: 9px;
    font-weight: 500;
    border-radius: 3px;
    color: #000000;
}

ul.nav-pills li a.active {

    background: #f4f6f9;


}

.Pending .test__status::after {
    background: #fdd200;
}

.Progress .test__status::after {
    background: #ffa827;
}

.Partial .test__status::after {
    background: #0e72ff;
    color: #f4f6f9;
}

.Completed .test__status::after {
    background: #23bb19;
    color: #f4f6f9;
}

.Pause .test__status::after,
.expired .test__status::after,
.InActive .test__status::after {
    background: #ff4949;
    color: #f4f6f9;
}

.student__test .action__buttons .action__button {
    border: 0;
    padding: 5px;
    border-radius: 3px;
    background: #0e72ff;
    color: #f4f6f9;
}

/* .student__test span{
    font-weight: 500;
} */
.student__test .purchase__on {
    font-size: 1.1rem;
    font-weight: 500;
}

.student__test .test__name,
.featured .test__name {
    font-size: 1.2rem !important;
    font-weight: 900 !important;
    text-transform: capitalize;
}

.student__profile .profile__image {
    width: 100px;
    height: 100px;
    overflow: hidden;
}

.student__profile .profile__image img {
    width: 100%;
}

.student__profile .upload__img {
    width: fit-content;
}


.radio-group {
    display: flex;

    gap: 20px;
}


.radio-label {
    display: flex;
    align-items: center;
    margin-bottom: 0.5rem;
}

.radio-label input[type="radio"] {
    margin-right: 0.5rem;
}

.radio-text {
    font-size: 1rem;
}

.student__test .test_validity {
    font-size: 13px;
    font-weight: 500;
}

.form-button {

    background: #1987e5 !important;
    /* box-shadow: 0 3px 1px -2px #0003, 0 2px 2px #00000024, 0 1px 5px #0000001f; */
    text-align: center;
    justify-content: center;
    height: 40px;
    width: 100%;

}

.forget-password-remember {

    display: flex !important;
    justify-content: space-between;
}

.register-signup a {

    text-decoration: none;
    text-align: center;
    justify-content: center;
    width: 100%;
    border: 1px solid #ccc;
    height: 40px;
    line-height: 40px;
    background: #f3f3f3;
    font-weight: bold;

}

.forget-password-remember a {

    text-decoration: none;
    font-size: 13px;
    color: #1d488f;
}

.register-or {

    display: flex;
    justify-content: center;
    margin: 8px 0;
}

.register_form {

    width: 700px;
    background: #ffff;
    border-radius: 10px;
    padding: 20px;
    margin: 30px 0 0 0;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.resetpassword_form {
    width: 400px;
    background: #ffff;
    border-radius: 10px;
    padding: 20px;
    margin: 30px 0 0 0;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;

}

form.login__form,
.forgot__form {
    width: 350px;
    background: #ffff;
    border-radius: 10px;
    padding: 20px;
    margin: 30px 0 0 0;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.form-register {
    background: #1987e5 !important;
    /* box-shadow: 0 3px 1px -2px #0003, 0 2px 2px #00000024, 0 1px 5px #0000001f; */
    text-align: center;
    justify-content: center;
    height: 40px;

}

.student-nav-custom {

    display: flex !important;
    justify-content: space-between !important;
    background: #00183c;
    color: #ccc;
}

.student-profile-picture a,
.student-profile-picture a:hover {
    text-decoration: none;
    color: #ccc;
}

.nav-item a p {

    color: white;
}

.button-groups .buy-button {

    background: #f85e00 !important;
    border: none;
}

.buy-button-page .buy-button {

    background: #f85e00 !important;
    border: none;
}

.game-view-header .mini__nav {
    background: rgb(219, 237, 255);
}

.game-view-header .mini__nav .back {
    align-items: center;
}

.game-view-header .mini__nav .back h3 {
    font-weight: 600;
}

.game-view-header .mini__nav .back a {
    text-decoration: none;
    color: #8e8e8e;

}

.game-view-header .mini__nav .breadcrumb-item,
.game-view-header .mini__nav .breadcrumb-item a {
    font-size: 15px;
    font-weight: 500;
    color: #0e72ff !important;
    text-decoration: none;
}

.game-view-header .mini__nav .breadcrumb-item,
.game-view-header .mini__nav .breadcrumb-item a:active {

    color: #000 !important;

}

.test_details .instructions {
    font-size: 16px;
    font-weight: 500;
}

.test_details .start-button button {
    width: 121px;
    height: 45px;
    font-size: 15px;
    font-weight: 500;
    border-radius: 8px;
}

.logo img {

    width: 130px;
}

.que-question {

    font-weight: bold;
}

.new-question {
    border-bottom: 1px solid #c3c3c3;

}

.group_radio_button .question-yes {

    background: #b3b3b3;
    color: #ffffff;
}

.group_radio_button .question-no {

    background: #b3b3b3;

    color: #ffffff;
}

.group_radio_button .question-cant-say {

    background: #b3b3b3;

    color: #ffffff;
}

.profile-reset-password {
    display: flex;
    justify-content: end;

}

.new-question span {

    font-size: 13px;
}

.test-align {

    display: flex;
    justify-content: space-between;
    flex-direction: row-reverse
}

.test-align h6 {

    text-align: left;
}



.modal-footer button {

    width: 100%;
}

.modal-content .new-modal-body p {

    color: #000 !important;
    text-align: center !important;
}

.custom-modal {

    /* margin: 0 auto; */
    justify-content: center;
}

.custom-modal-content {

    width: 320px !important;
    display: flex;
    justify-content: center;
    align-items: center;
}

.new-header h5 {
    color: #000 !important;
    /* text-align: center !important; */

}

.modal-footer .Pause-now {

    background: #0e86de;
    border: none;
}

.modal-footer .let-me-continue {

    background: #1d488f;
    border: none;
}

.modal-footer .exit {

    background: #f86000;
    border: none;
}

.game_analytic .popup_modal_game_analytic {
    min-width: 100% !important;
    margin: 0;
}

.featured .owl-nav {
    display: flex;
    justify-content: center;
    font-size: 17px;
    gap: 20px;
}

#single_que_view .group-label label {
    background: #e4e4e4;
    padding: 8px;
    border-radius: 5px;
}

#single_que_view .correct_option {
    padding: 8px;
    border-radius: 5px;
    background: #86ffa04a;
    border: 1px solid #28C397;
}

#single_que_view .group-label .selected_correct_option,
#single_que_view .group-label .correct_option {
    background: #86ffa04a;
    border: 1px solid #28C397;
}

#single_que_view .group-label .selected_correct_option::after {
    content: '✓';
    margin-left: auto;
    padding: 1px 8px 0 7px;
    font-size: 11px;
    color: green;
}

#single_que_view .group-label .correct_option::after {

    margin-left: auto;
    padding: 1px 8px 0 7px;
    font-size: 11px;
    color: green;
}

#single_que_view .group-label .select_incorrect_option {
    background: #ffb9b963 !important;
    border: 1px solid #ff5c5c;
}

#single_que_view .group-label .select_incorrect_option::after {
    content: '✗';
    margin-left: auto;
    color: red;
    padding: 1px 8px 0 7px;
    font-size: 11px;
}

#single_que_view .correct_option_label {
    color: #16a928;
    font-weight: 400;
    font-size: 15px;
}

.parent-div-button-single-que {
    display: flex;
    justify-content: center;
    gap: 20px;
    width: 15%;
    margin: auto;
    border: 1px dotted gray;
    padding: 8px;
}

.parent-div-button-single-que button,
.parent-div-button button {
    height: 35px;
    width: 100px;
    font-size: 16px;
    border: none;
}

.parent-div-button-single-que #next-question,
.parent-div-button #next_section,
.parent-div-button #next-question {
    background: #19AA9F;
}

.left-side .parent-div-button {
    justify-content: center;
}

.parent-div-button-single-que #prev-question,
.parent-div-button #prev_section,
.parent-div-button #prev-question {
    background: #27a3f6;
}

.question_notes_heading .solution {
    font-size: 14px;
    color: #000;
    font-weight: 400;
}

.question_notes_heading .explanation {
    font-size: 14px;
    color: #000;
    font-weight: 600;
}


@media only screen and (max-width: 767px) {

    .hide-question-count {
        display: none !important;
    }

    .card-set {

        padding: 0 !important;
    }

    .test_details .start-button {

        margin-top: 0 !important;
    }

    .check-gender label {

        margin: 0;
    }

    .register_form {

        width: 350px;
    }

    .student-nav-custom {

        padding: 10px;
    }

    .nav-item a p {

        font-size: 15px;
    }

    .logo img {

        width: 95px;
    }

    .nav-item.dropdown .dropdown-toggle {

        font-size: 15px;
    }

    .question-timer p {
        font-size: 13px;
    }

    #hide-panel {

        right: 308px;
        top: 130px;
        width: max-content;
    }

}