/* Minification failed. Returning unminified contents.
(1003,43): run-time error CSS1046: Expect comma, found '88'
(1003,50): run-time error CSS1046: Expect comma, found '/'
(1404,19): run-time error CSS1030: Expected identifier, found '.'
(1404,37): run-time error CSS1031: Expected selector, found ')'
(1404,37): run-time error CSS1025: Expected comma or open brace, found ')'
(1457,37): run-time error CSS1046: Expect comma, found '0'
(1457,41): run-time error CSS1046: Expect comma, found '/'
(3701,67): run-time error CSS1030: Expected identifier, found '.'
(3701,87): run-time error CSS1031: Expected selector, found ')'
(3701,87): run-time error CSS1025: Expected comma or open brace, found ')'
(4455,29): run-time error CSS1046: Expect comma, found '59'
(4455,35): run-time error CSS1046: Expect comma, found '/'
(4482,28): run-time error CSS1046: Expect comma, found '0'
(4482,32): run-time error CSS1046: Expect comma, found '/'
(4521,28): run-time error CSS1046: Expect comma, found '0'
(4521,32): run-time error CSS1046: Expect comma, found '/'
(4601,42): run-time error CSS1046: Expect comma, found '128'
(4601,49): run-time error CSS1046: Expect comma, found ')'
(4602,50): run-time error CSS1046: Expect comma, found '128'
(4602,57): run-time error CSS1046: Expect comma, found ')'
(4603,47): run-time error CSS1046: Expect comma, found '128'
(4603,54): run-time error CSS1046: Expect comma, found ')'
 */

body,
#page-wrapper {
    background: #F6F7F7;
    font-family: '-apple-system', 'BlinkMacSystemFont', 'avenir next', 'avenir', 'segoe ui', 'helvetica neue', 'helvetica', 'Cantarell', 'Ubuntu', 'roboto', 'noto', 'arial', 'sans-serif';
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 600;
}

.fs-h1 {
    font-size: 36px;
    font-weight: 600;
    line-height: 1.1;
    margin-top: 20px;
    margin-bottom: 10px;
}

.fs-h2 {
    font-size: 30px;
    font-weight: 600;
    line-height: 1.1;
    margin-top: 20px;
    margin-bottom: 10px;
}

.fs-h3 {
    font-size: 24px;
    font-weight: 600;
    line-height: 1.1;
    margin-top: 20px;
    margin-bottom: 10px;
}

.fs-h4 {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.1;
    margin-top: 10px;
    margin-bottom: 10px;
}

.fs-h5 {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.1;
    margin-top: 10px;
    margin-bottom: 10px;
}

.fs-h6 {
    font-size: 12px;
    font-weight: 600;
    line-height: 1.1;
    margin-top: 10px;
    margin-bottom: 10px;
}

.side-menu-style {
    overflow-y: scroll;
    position: relative;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}

    .side-menu-style::-webkit-scrollbar {
        display: none;
    }


.sidebar,
.scollbar-float {
    background: white !important;
    border-right: 1px solid #DEE2E4 !important;
}

    .scollbar-float:has(li)::before {
        border-top-color: transparent !important;
    }

    .nav-header,
    .nav-header .text-muted.light,
    .sidebar ul li a,
    .sidebar ul li a:hover,
    .sidebar ul li a.active,
    .sidebar ul li a:focus {
        color: #0e2653 !important;
    }

    .sidebar ul li a {
        font-weight: 600 !important;
        border-left: 3px solid transparent !important;
    }

        .sidebar ul li a:after {
            width: 105%;
            left: 6px;
            border-radius: 4px;
        }

        .sidebar ul li a:hover:after {
            background: #F5FBFE !important;
            border: 0;
        }

        .sidebar ul li a.active:after,
        .sidebar ul li a:focus:after {
            background: #DFF1FC !important;
            border: 0;
        }

        .sidebar ul li a:hover,
        .sidebar ul li a.active,
        .sidebar ul li a:focus {
            font-weight: 600 !important;
        }

        .sidebar ul li a.orange-highlight:hover::after {
            background: #F5FBFE !important;
            border: 0 !important;
        }

        .sidebar ul li a.orange-highlight.active::after,
        .sidebar ul li a.orange-highlight:focus::after {
            background: #DFF1FC !important;
            border: 0 !important;
        }

    .sidebar .nav-second-level li a {
        padding-left: 50px;
    }

    .sidebar ul li a:hover {
        font-weight: 600;
        border-color: #517DFF;
    }

    .sidebar ul li a.active,
    .sidebar ul li a:focus {
        font-weight: 600;
        border-color: #0E2653;
    }

.btn {
    border-radius: 10px;
    text-transform: uppercase;
    font-weight: 500;
    padding: 8px 12px;
    box-shadow: 0px 2px 4px 0px rgba(50, 88, 139, 0.1);
}

    .btn svg,
    .btn svg path {
        width: auto;
        height: 16px;
        fill: white;
        vertical-align: middle;
        margin-right: 8px;
    }


.btn-primary {
    background: #517DFF;
    border-color: #517DFF;
    box-shadow: 0px 2px 4px 0px rgba(50, 88, 139, 0.1);
    min-width: 100px;
}

    .btn-primary:hover,
    .btn-primary:focus,
    .btn-primary:active,
    .btn-primary:active:focus {
        background: #638AFF;
        border-color: #638AFF;
        box-shadow: 0px 2px 8px 0px rgba(50, 88, 139, 0.15);
    }

.btn-secondary {
    background: #0E2653;
    border-color: #0E2653;
    color: white;
    box-shadow: 0px 2px 4px 0px rgba(50, 88, 139, 0.1);
    min-width: 100px;
}

    .btn-secondary:hover,
    .btn-secondary:focus,
    .btn-secondary:active {
        background: #12326E;
        border-color: #12326E;
        color: white;
        box-shadow: 0px 2px 8px 0px rgba(50, 88, 139, 0.15);
    }

#studentPathwayButton.btn-info,
#reCreateStudyPathWayButton.btn-primary {
    background: #12326E;
    border-color: #12326E;
}

    #studentPathwayButton.btn-info:hover,
    #reCreateStudyPathWayButton.btn-primary:hover {
        background: #32588B;
    }

.btn-default {
    border-color: white;
    color: inherit;
    box-shadow: 0px 2px 4px 0px rgba(50, 88, 139, 0.1);
    min-width: 100px;
}

    .btn-default.btn-default-w-bdr {
        border-color: #DEE2E4;
        min-width: initial;
    }

    .btn-default:hover,
    .btn-default:focus,
    .btn-default:active,
    .btn-default:active:focus {
        background: #F5FBFE;
        border-color: #F5FBFE;
        box-shadow: 0px 2px 8px 0px rgba(50, 88, 139, 0.15);
    }

    .btn-default.btn-default-w-bdr:hover,
    .btn-default.btn-default-w-bdr:focus,
    .btn-default.btn-default-w-bdr:active,
    .btn-default.btn-default-w-bdr:active:focus {
        border-color: #DEE2E4;
    }

    .btn-default svg,
    .btn-default svg path {
        fill: inherit;
    }

.note-btn.btn-default {
    min-width: 30px
}

.btn-danger {
    background: #DA594D;
    border-color: #DA594D;
    box-shadow: 0px 2px 4px 0px rgba(50, 88, 139, 0.1);
    min-width: 100px;
}

    .btn-danger:hover,
    .btn-danger:focus,
    .btn-danger:active,
    .btn-danger:active:focus {
        background: #BA4B40;
        border-color: #BA4B40;
        box-shadow: 0px 2px 8px 0px rgba(50, 88, 139, 0.15);
    }

.nav-pills > li + li {
    margin-left: 8px;
}

.nav-pills > li > a {
    font-weight: 500;
    padding: 8px 15px;
    border: 1.5px solid transparent;
    border-radius: 4px 4px 0px 0px;
}

    .nav-pills > li > a > span {
        position: initial;
    }

.nav-pills > li.active > a,
.nav-pills > li.active > a:hover {
    background-color: #12326E !important;
}

.nav-pills > li.active > a,
.nav-pills > li > a:focus,
.nav-pills > li > a:hover {
    font-weight: 500;
}

.nav-pills > li > a:hover {
    background-color: transparent !important;
    border-color: #0E2653;
    color: inherit;
}

.nav-pills > li > a > span:before {
    height: 3px;
    right: -1px;
    width: auto;
}

.nav-pills li a span img {
    display: none;
}

.nav-filter li {
    float: left;
}

    .nav-filter li + li {
        margin-left: 15px;
    }

    .nav-filter li a {
        border-radius: 4px;
        border: 1px solid #DEE2E4;
        padding: 0.5rem 1rem;
        font-weight: 500;
    }

        .nav-filter li a:hover,
        .nav-filter li a:focus {
            border-color: #12326E;
            background-color: white;
        }

    .nav-filter li.active a {
        background: #0E2653;
        border-color: #0E2653;
        color: white;
    }

.navbar-top-links li a:hover,
.navbar-top-links li a:focus,
.nav .open > a,
.nav .open > a:focus,
.nav .open > a:hover {
    background: #F5FBFE;
    color: #12326E;
}

    .nav .open > a,
    .nav .open > a:focus,
    .navbar-top-links li a:focus,
    .navbar-top-links li a[aria-expanded="true"] {
        background: white;
        border-top-left-radius: 4px;
        border-top-right-radius: 4px;
    }

.navbar-top-links li a .fa-caret-down {
    font-size: 10px;
}

.navbar-top-links .dropdown-menu {
    padding: 10px;
    border-top-right-radius: 0;
    border-color: transparent;
    margin-top: -1px;
    right: -0.5px;
    box-shadow: 2px 5px 8px rgba(50, 88, 139, 0.1);
}

    .navbar-top-links .dropdown-menu.r-neg-1 {
        right: -1px !important;
    }

.navbar-top-links .dropdown-help {
    right: -0.5px;
}

.navbar-top-links .dropdown-menu li#initialList {
    border-top: 1px solid #DEE2E4;
}

.navbar-top-links .dropdown-menu li.notification-banner {
    border-top: 1px solid #DEE2E4;
}

.navbar-top-links .dropdown-menu li a {
    padding: 8px 20px;
}

.navbar-top-links > li:last-child {
    background: #0e2653 !important;
}

.navbar-static-top-mid-blue {
    background: #0E2653 !important;
}

.topbar-picture-container img {
    border-radius: 50%;
}

.alert {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    .alert a {
        color: inherit;
        text-decoration: underline;
    }

    .alert .btn-dismiss-alert {
        background: transparent;
        border-color: transparent;
        padding: 0;
        text-transform: initial;
        text-decoration: underline;
        box-shadow: none;
        margin-left: 15px;
    }

        .alert .btn-dismiss-alert:hover {
            color: inherit;
        }

        .alert .btn-dismiss-alert:focus,
        .alert .btn-dismiss-alert:active:focus {
            outline: none;
        }

.booking-item.alert.alert-success {
    display: block !important;
}

.panel,
.panel-default,
.panel-default > .panel-heading {
    border-color: transparent;
    box-shadow: none;
}

.panel-heading {
    font-size: 24px;
    font-weight: 600;
    padding-right: 0;
}

.panel-body {
    border: 1px solid #DEE2E4;
    box-shadow: 0px 18px 28px 11px rgba(50, 88, 139, 0.05);
    border-radius: 10px;
}

.page-header {
    font-size: 36px;
    font-weight: 600;
    border-bottom: 0;
}

.popup-layout .page-header {
    border-bottom: 2px solid #0E2653;
}

.popup-layout .panelContent .alert {
    display: block;
}

.minimocktest-detail-panel {
    border: 1px solid #DEE2E4;
    box-shadow: 0px 18px 28px 11px rgba(50, 88, 139, 0.05);
    border-radius: 10px;
}

.modal-header {
    font-weight: 600;
    border-bottom: 0;
}

.modal-header,
.modal-body,
.modal-footer {
    padding: 20px;
}

.modal .close {
    background: #dff1fc !important;
    color: #0E2653 !important;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    font-size: 24px;
    font-weight: 500;
    opacity: 1;
    text-shadow: none;
}

.bootgrid-table th > .column-header-anchor {
    text-transform: capitalize;
}

.bootgrid-table.table-striped > tbody > tr:nth-of-type(odd) {
    background: none;
}

    .table-hover > tbody > tr:hover,
    .bootgrid-table.table-striped > tbody > tr:nth-of-type(odd):hover {
        background-color: #F6F7F7;
    }

.bootgrid-table tr td:first-child:focus-within {
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}

#gridAppointment.bootgrid-table tr td:last-child a:focus-within {
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}

.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td {
    border-color: #DEE2E4;
    padding: 15px 20px;
}

.table > thead > tr > th {
    font-size: 12px;
    border-bottom: 0;
}

.pagination > li {
    display: inline-block;
}

    .pagination > li + li {
        margin-left: 5px;
    }

    .pagination > li > a,
    .pagination > li > span,
    .pagination > .disabled > span,
    .pagination > .disabled > a {
        box-shadow: 0px 2px 4px 0px rgba(50, 88, 139, 0.1);
    }

        .pagination > li > a,
        .pagination > li > span,
        .pagination > .disabled > span,
        .pagination > .disabled > span:hover,
        .pagination > .disabled > span:focus,
        .pagination > .disabled > a,
        .pagination > .disabled > a:hover,
        .pagination > .disabled > a:focus {
            padding: 8px 15px;
            border-radius: 10px;
            border-color: #DEE2E4;
            box-shadow: 0px 2px 8px 0px rgba(50, 88, 139, 0.15);
        }

    .pagination > li:first-child > a,
    .pagination > li:first-child > span {
        border-top-left-radius: 10px;
        border-bottom-left-radius: 10px;
    }

    .pagination > li:last-child > a,
    .pagination > li:last-child > span {
        border-top-right-radius: 10px;
        border-bottom-right-radius: 10px;
    }

    .pagination > li > a:hover,
    .pagination > li > a:focus,
    .pagination > li > span:hover,
    .pagination > li > span:focus {
        background-color: #DFF1FC;
        border-color: #DFF1FC;
        box-shadow: 0px 2px 8px 0px rgba(50, 88, 139, 0.15);
    }

.pagination > .active > a,
.pagination > .active > span {
    background-color: #12326E;
    border-color: #12326E;
    color: #F5FBFE;
}

    .pagination > .active > a:focus,
    .pagination > .active > a:hover,
    .pagination > .active > span:focus,
    .pagination > .active > span:hover {
        background-color: #1e438a;
        border-color: #1e438a;
        color: white;
        box-shadow: 0px 2px 8px 0px rgba(50, 88, 139, 0.15);
    }

.pagination > li > a:focus {
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}

.btn-group .btn + .btn,
.btn-group .btn + .btn-group,
.btn-group .btn-group + .btn,
.btn-group .btn-group + .btn-group {
    margin-left: 10px;
}

.btn-group > .btn-group:not(:first-child):not(:last-child) > .btn {
    border-radius: 10px;
}

    .btn-group > .btn-group:not(:first-child):not(:last-child) > .btn:focus {
        outline: 5px auto -webkit-focus-ring-color;
        outline-offset: -2px;
    }

.btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) {
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

.btn-group > .btn-group:last-child:not(:first-child) > .btn:first-child {
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}

    .btn-group > .btn-group:last-child:not(:first-child) > .btn:first-child:focus {
        outline: 5px auto -webkit-focus-ring-color;
        outline-offset: -2px;
    }

.dropdown.btn-group ul li a:focus {
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}

.bootgrid-header .actionBar .btn {
    padding: 8px 12px;
}

.maintenanceButtonRow.form-group {
    margin-top: 20px;
}

.control-group .btn + .btn {
    margin-left: 10px;
}

.control-label {
    font-weight: normal;
    text-transform: uppercase;
}

.form-control {
    border: 1px solid #E0E0E0;
    border-radius: 10px;
    padding: 10px 15px;
    height: auto;
    box-shadow: none;
}

.top-content-nav .nav.nav-tabs li {
    margin-left: 5px;
}

.top-content-nav .nav-tabs > li > a {
    margin: 0;
    border: 1px solid #DEE2E4;
    text-transform: uppercase;
    font-weight: normal;
    border-radius: 4px;
}

.panel-body > .top-content-nav .nav-tabs > li > a {
    border-color: #DEE2E4;
}

.top-content-nav .nav-tabs > li > a:hover {
    border-color: #0E2653;
}

.top-content-nav .nav-tabs > li.active > a,
.top-content-nav .nav-tabs > li.active > a:focus,
.top-content-nav .nav-tabs > li.active > a:hover {
    top: 0;
    border-width: 1px;
    border-color: #0E2653;
}

    .top-content-nav .nav-tabs > li.active > a img.events {
        content: url("https://e2assetsv2.e2language.com/e2l-image/v3/Events_v3.svg");
    }

#course-tab li a {
    height: auto;
}

.panel-group .panel {
    border-radius: 10px;
    border: 1px solid #DEE2E4;
    box-shadow: 0px 2px 4px 0px rgba(50, 88, 139, 0.1);
}

.panel-body .panel-group {
    margin-bottom: 0;
}

    .panel-body .panel-group + .panel-group {
        border-top: 1px solid #DEE2E4;
    }

.panel-group .panel-accordion {
    border-radius: 0;
    padding: 0;
    border: 0;
    box-shadow: none;
}

    .panel-group .panel-accordion + .panel-accordion {
        border-top: 1px solid #DEE2E4;
    }

.panel-group .panel .panel-heading {
    display: block;
    padding: 10px 0;
}

.panel-group.answer-report-group .panel .panel-heading {
    display: block;
    padding: 10px 15px;
}

.panel-with-progress .progress {
    border-radius: 10px;
    box-shadow: none;
}

    .panel-with-progress .progress .progress-bar {
        background-color: #DFF1FC;
        box-shadow: none;
    }

.panel-with-progress .percentage-text {
    right: 50px;
    color: #828282;
    font-weight: normal;
    text-transform: uppercase;
}

.live-classes-panel .panel-heading .panel-title a {
    background-color: transparent !important;
}

.panel-group .panel .panel-heading .panel-title a {
    color: #0E2653;
    padding-left: 20px;
}

    .panel-group .panel .panel-heading .panel-title a .fa {
        left: initial;
        right: 15px;
        transform: none;
    }

        .panel-group .panel .panel-heading .panel-title a .fa[id^="checkedModuleIcon-"] {
            right: auto;
            margin-top: 2px;
        }

    .panel-group .panel .panel-heading .panel-title a .submodule-label {
        padding: 2px 10px;
        border-radius: 2px;
        font-size: 14px;
        font-weight: 600;
        text-transform: uppercase;
        margin-left: 15px;
    }

        .panel-group .panel .panel-heading .panel-title a .submodule-label.submodule-label-free {
            background: #EDF7F2;
            color: #41BB7A;
        }

        .panel-group .panel .panel-heading .panel-title a .submodule-label.submodule-label-upgrade {
            background: #FAE1CB;
            color: #FFA250;
        }

    .panel-group .panel .panel-heading .panel-title a[aria-expanded="true"] .fa-plus-square::before {
        content: "";
        transition: all 0.3s ease;
    }

.panel-group .panel .panel-body {
    border-radius: 0;
    box-shadow: none;
}

.panel-with-progress .panel-body .row {
    display: flex;
    flex-wrap: wrap;
}

    .panel-with-progress .panel-body .row > div {
        margin-bottom: 20px;
    }

@media (max-width: 992px) {
    .panel-with-progress .panel-body .row > div {
        width: 100%;
    }
}

.panel-group .panel .panel-body .row > div > .panel-activity {
    margin-bottom: 0 !important;
    height: 100%;
}

.panel-group .panel .panel-card {
    background: white !important;
    border: 2px solid #0E2653;
}

.panel-group .panel .sub-accordion {
    background: none !important;
    border: 0;
}

.panel-group .panel .panel-card.panel-success {
    border-color: #41BB7A;
}

.panel-group .panel .panel-card .panel-heading {
    background: #0E2653 !important;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    padding: 5px 0;
}

.panel-group .panel .sub-accordion > .panel-heading {
    background: none !important;
}

.panel-group .panel .panel-card.panel-success .panel-heading {
    background: #41BB7A !important;
}

.panel-group .panel .panel-activity .panel-title a {
    color: white !important;
}

.panel-group .panel .panel-card .panel-title .badge {
    padding: 4px 8px;
    background-color: #264989;
}

    .panel-group .panel .panel-card .panel-title .badge.badge--success {
        background-color: #59cf55;
    }

    .panel-group .panel .panel-card .panel-title .badge::before {
        display: none;
    }

.table .progress {
    border-radius: 10px;
    box-shadow: none;
    margin-bottom: 0;
}

    .table .progress .progress-bar {
        background-color: #517DFF;
        box-shadow: none;
    }


.addons-subscription-row {
    border-radius: 10px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 6px 15px !important;
}

.d-block {
    display: block !important;
}

#info-date-section.alert {
    display: block;
}

.p-t-7 {
    padding-top: 7px !important;
}

.note-toolbar.panel-heading {
    background: white !important;
}

.m-width-30 {
    min-width: 30px !important;
}

.mrg-r-10 {
    margin-right: 10px;
}

.icon-padding-dashboard {
    padding: 7px 12px;
}

.liveclass-title,
.calendar-title {
    font-size: 24px;
    font-weight: 600;
}

#btnEventFilter {
    background: #DFF1FC;
    color: #0E2653;
    border-color: #DFF1FC;
}

.p-t-0 {
    padding-top: 0px !important;
}

.p-b-0 {
    padding-bottom: 0px !important;
}

.p-b-5 {
    padding-bottom: 5px !important;
}

.panel-score.pull-right {
    margin-right: 10px;
}

#course-content .panel.panel-accordion {
    border-radius: 10px;
    border: 1px solid #DEE2E4;
    box-shadow: 0px 2px 4px 0px rgba(50, 88, 139, 0.1);
}

#answerReportPanel .top-content-nav .nav-tabs > li > a > img {
    display: inline;
}

#answerReportPanel .panel.panel-accordion .fa-plus-square {
    display: none;
}

#answerReportPanel .panel-group .panel.panel-primary .panel-subtitle {
    padding-left: 20px;
}

#liveClassPanel .list-group-item .row {
    padding-left: 10px;
    padding-right: 10px;
}

.live-classes-panel .panel-heading a {
    text-align: left;
}

.row.mini-mocktest-single-panel.ra .col-sm-12 > .panel-default {
    background: #fff !important;
    border-color: #fff !important;
    border: 1px solid #fff;
}

.panel-registration .btn {
    padding: 8px 12px;
    border-radius: 10px;
}

.panel-registration .reg-sign-up-tab .nav-pills > li > a:hover {
    border-color: transparent;
}

#tab-home #studentPathwayPanelSection #btnFilter {
    background: #DFF1FC;
    color: #0E2653;
    border-color: #DFF1FC;
}

.app-registration .panel {
    box-shadow: 0px 18px 28px 11px rgba(50, 88, 139, 0.05);
}

    .app-registration .panel .panel-body {
        box-shadow: none;
    }

#student-paused .modal-content {
    border: 1px solid #DEE2E4;
    box-shadow: 0px 18px 28px 11px rgb(50 88 139 / 5%);
}

.exam-selection input[type="radio"]:checked + .box,
.package-selection input[type="radio"]:checked + .box {
    background-color: #DFF1FC;
    border-color: #DFF1FC;
}

    .exam-selection input[type="radio"]:checked + .box span {
        color: #0E2653 !important;
    }

.btn-default,
.btn-default:hover {
    border-color: #ccc;
}

.modal .close:hover {
    color: #555 !important;
}

.modal.type-primary .close:hover {
    color: #fff !important;
}

.modal .bootstrap-dialog-title {
    font-size: 24px !important;
}

#questionStudentPathwaySection .calendar > .row > .col-sm-6 {
    display: inline-table;
}

    #questionStudentPathwaySection .calendar > .row > .col-sm-6 > input {
        border-radius: 10px 0 0 10px;
        background-color: #ffffff;
    }

    #questionStudentPathwaySection .calendar > .row > .col-sm-6 > span > .btn {
        min-width: 50px;
        height: 42px;
    }

#studentPathwayPanelSection .maintenanceButtonRow.form-group {
    margin-top: 0px !important;
}

#paymentForm .custom-payment-body .payment-image > img {
    max-width: 100%;
}

.panel-auto {
    max-height: 492px;
    overflow-x: hidden;
    overflow-y: auto;
    position: relative;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}

    .panel-auto::-webkit-scrollbar {
        display: none;
    }

#liveClassSectionContainer {
    overflow-y: hidden;
}

/* E2 Rewards Enhancement */
.sharetab-container {
    display: flex;
}

    .sharetab-container .img-box {
        width: 380px;
    }

        .sharetab-container .img-box img {
            width: 100%;
            height: auto;
        }

    .sharetab-container .sharetab-content {
        margin-left: 20px;
        margin-right: 20px;
        padding-bottom: 16px;
    }

#e2reward-shareTab .panel-default .refer {
    padding-left: 15px;
    font-weight: 600;
}

#e2reward-shareTab .panel-default .share-email {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-end;
    margin-top: 30px;
    margin-bottom: 16px;
}

    #e2reward-shareTab .panel-default .share-email .share-email-content {
        margin-right: 15px;
    }

#e2reward-shareTab .panel-default .input-group input {
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

#e2reward-shareTab .panel-default .input-group .btn-primary {
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    margin-left: 16px;
}

.e2reward-share-social {
    list-style-type: none;
    padding-left: 0;
    margin-top: 16px;
}

    .e2reward-share-social li {
        display: inline-block;
        margin-right: 5px;
    }

        .e2reward-share-social li a {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 40px;
            height: 40px;
            border-radius: 50%;
            color: white;
            font-size: 20px;
            text-decoration: none;
        }

            .e2reward-share-social li a:hover {
                opacity: 0.85;
            }

            .e2reward-share-social li a.share-fb {
                background: #3b5998;
            }

            .e2reward-share-social li a.share-ig {
                background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, transparent 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);
            }

            .e2reward-share-social li a.share-twitter {
                background: #55acee;
            }

            .e2reward-share-social li a.share-wa {
                background: #4dc247;
            }

#e2reward-rewardsTab .reward-list,
#e2reward-rewardsTab .your-referrals-title {
    margin-left: 20px;
}

.reward-claim {
    display: flex;
    list-style-type: none;
    padding-left: 0;
    margin-left: -8px;
    margin-right: -8px;
    margin-bottom: 20px;
    margin-top: 20px;
}

    .reward-claim li {
        padding-left: 8px;
        padding-right: 8px;
        width: 25%;
    }

    .reward-claim .reward-claim-item {
        border: 1px solid #D5D9E7;
        border-radius: 10px;
        padding: 20px;
        text-transform: uppercase;
        height: 100%;
        display: flex;
        flex-direction: column;
    }

        .reward-claim .reward-claim-item .reward-img img {
            display: block;
            margin: 5px auto;
            height: 100px;
        }

        .reward-claim .reward-claim-item h4:nth-last-child(2) {
            margin-bottom: 16px;
        }

        .reward-claim .reward-claim-item .reward-btn-section {
            display: flex;
            margin-top: auto;
        }

        .reward-claim .reward-claim-item .btn-primary {
            margin-top: auto;
        }

.modal .close {
    background: #dff1fc;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    font-size: 18px;
    font-weight: 500;
    opacity: 1;
    text-shadow: none;
    padding-top: 5px;
}

@media (min-width: 768px) {
    #termsModal .modal-dialog {
        max-width: 500px;
        margin: 0 auto;
    }
}

@media (max-width: 1200px) {
    .reward-claim li {
        width: 33.3333%;
    }
}

@media (min-width: 992px) and (max-width: 1200px) {
    .sharetab-container .img-box {
        flex: 1;
        width: auto;
        overflow: hidden;
    }

        .sharetab-container .img-box img {
            height: 100%;
            object-fit: cover;
        }

    .sharetab-container .sharetab-content {
        width: 41.6667%;
    }

    #e2reward-shareTab .panel-default .share-email {
        margin-top: 20px;
    }
}

@media (max-width: 992px) {
    .sharetab-container {
        flex-wrap: wrap;
    }

        .sharetab-container .img-box {
            width: 100%;
        }

        .sharetab-container .sharetab-content {
            margin-left: 0;
        }

    .reward-claim li {
        width: 50%;
    }
}

@media (max-width: 480px) {
    .reward-claim {
        flex-wrap: wrap;
    }

        .reward-claim li {
            width: 100%;
            margin-bottom: 16px;
        }
}

.referal-link-page {
    background: #E2F4FF;
}

    .referal-link-page h1 {
        color: #ED6A5E;
        font-size: 36px;
        font-weight: 700;
    }

    .referal-link-page h2 {
        color: #0E2653;
        font-size: 64px;
        font-weight: 700;
    }

    .referal-link-page img {
        width: 100%;
        height: auto;
    }

    .referal-link-page #maintenanceForm #errorPane ul {
        padding-inline-start: initial;
    }

.referal-form-container {
    background: #fff;
    border-radius: 10px;
    padding: 30px;
    box-shadow: 0px 4px 4px rgba(133, 133, 133, 0.12);
    margin: 30px 0;
}

    .referal-form-container h3 {
        color: #0E2653;
        font-size: 24px;
        font-weight: 500;
        margin-bottom: 16px;
    }

    .referal-form-container .form .form-group {
        text-align: left;
        margin-bottom: 16px;
    }

        .referal-form-container .form .form-group label {
            font-weight: normal;
        }

            .referal-form-container .form .form-group label[for="terms"] {
                display: inline;
            }

        .referal-form-container .form .form-group .form-control {
            display: block;
            width: 100%;
            background-color: white;
            border: 1px solid #B1B8D0;
            border-radius: 10px;
            padding: 15px;
        }

    .referal-form-container .button,
    .referal-form-container .btn-primary {
        padding: 14px 28px;
        font-size: 18px;
        width: 100%;
        margin-top: 20px;
        margin-bottom: 20px;
    }

    .referal-form-container .learn-more {
        color: #0E2653;
        font-size: 20px;
        font-weight: 600;
    }

.referal-banner {
    background: #FDD64B;
    left: 0;
    right: 0;
    padding: 10px 15px;
    font-size: 18px;
    font-weight: 500;
    text-align: center;
    z-index: 2;
    top: 86px;
    position: sticky;
    margin-bottom: 20px;
}

    .referal-banner p {
        margin-bottom: 0;
    }

.voucher-banner {
    background: #FDD64B;
    left: 0;
    right: 0;
    padding: 10px 15px;
    font-size: 18px;
    font-weight: 500;
    text-align: center;
    z-index: 2;
    top: 86px;
    margin-bottom: 20px;
    position: sticky;
}

    .voucher-banner p {
        margin-bottom: 0;
    }

#page-wrapper:has(.referal-link-page) {
    background: #E2F4FF;
}

#instagram-sharing-modal .content-section {
    text-align: left;
    margin: 0 20px;
}

.referal-landing-page-modal .modal-body .invalid-message {
    margin: 0 30px 60px 30px;
}

/* E2 Rewards Enhancement */

.has-error .form-control {
    border-width: 2px !important;
    border-color: #FF0000 !important;
}

.has-error .custom-radio-in-card .radio label {
    border-width: 2px !important;
    border-color: #FF0000 !important;
    color: #FF0000 !important;
}

.p-l-15 {
    padding-left: 15px;
}

.m-l-15 {
    margin-left: 15px;
}

.student-pathway-questions .step-btn.juscon-spacebetween {
    justify-content: space-between;
}

.student-pathway-questions .step-btn {
    display: flex;
    margin-bottom: 1rem;
}

    .student-pathway-questions .step-btn .btn-default,
    .student-pathway-questions .step-btn .btn-default:hover {
        background: #fff;
        opacity: 1;
        border-radius: 10px;
        padding: 10px 3rem;
    }

    .student-pathway-questions .step-btn .btn-primary,
    .student-pathway-questions .step-btn .btn-primary:hover {
        box-shadow: 0 0 6px 0 rgb(0 0 0 / 25%);
        opacity: 1;
        border-radius: 10px;
        padding: 10px 3rem;
    }

    .student-pathway-questions .step-btn .btn {
        flex: 0 1 30%;
    }


/* custom-radio */

@media (max-width: 483px) {
    .custom-radio .radio input[type=radio],
    .custom-radio .radio-inline input[type=radio] {
        opacity: 0;
        z-index: 1;
    }

    .custom-radio .radio label {
        position: relative;
        padding-left: 25px;
        border-radius: 10px;
        text-transform: uppercase;
        width: 100%;
    }

        .custom-radio .radio label::before {
            content: '';
            display: inline-block;
            position: absolute;
            left: 0;
            width: 16px;
            height: 16px;
            border-radius: 50%;
            background: #BDBDBD;
            margin-top: 2px;
        }

        .custom-radio .radio label::after {
            content: '';
            display: inline-block;
            position: absolute;
            left: 4.99px;
            width: 7px;
            height: 7px;
            border-radius: 50%;
            margin-top: 6.5px;
        }

    .custom-radio .radio input:checked ~ label::before {
        background: white;
        border-color: #517DFF;
        border: 2px solid #517DFF;
    }

    .custom-radio .radio input:checked ~ label::after {
        background: #517DFF;
    }

    .custom-radio-in-card {
        margin-left: -0.5rem;
        margin-right: -0.5rem;
        display: flex;
        flex-wrap: wrap;
    }

        .custom-radio-in-card .radio {
            padding-left: 0.5rem;
            padding-right: 0.5rem;
            margin-top: 0;
            margin-bottom: 1rem;
            width: 100%;
        }

            .custom-radio-in-card .radio label {
                padding: 15px;
                border: 1px solid #BDBDBD;
                padding: 15px;
                padding-left: 40px;
            }

                .custom-radio-in-card .radio label::before {
                    left: 15px;
                }

            .custom-radio-in-card .radio input:checked ~ label {
                background: #F7F9FF;
                border-color: #517DFF;
                -webkit-box-shadow: inset 0px 0px 0px 2px #517DFF;
                -moz-box-shadow: inset 0px 0px 0px 2px #517DFF;
                box-shadow: inset 0px 0px 0px 2px #517DFF;
            }

                .custom-radio-in-card .radio input:checked ~ label::after {
                    left: 19.7px;
                }

    .student-pathway-questions .step-btn .btn-default, .student-pathway-questions .step-btn .btn-default:hover {
        padding: 0 !important;
    }
}

.bootstrap-dialog.type-primary .modal-header {
    background: #0e2653 !important;
}

/* Region OET Writing Layout */

.toefl .mmt-header {
    background: #0e2653 !important;
}

#toefl-test-wrapper .btn-default.submit-btn,
#toefl-test-wrapper .btn-default.closeButton {
    color: #333;
}

.oet-doctors-mmt-layout .timer-wrapper-mmt,
.oet-nurses-mmt-layout .timer-wrapper-mmt {
    right: 15px;
}

.oet-writing-assessment-layout #reading-panel .panel-body {
    max-height: 1000px;
    overflow-y: auto;
}

@media (max-width: 885px) {
    .oet-doctors-mmt-layout .timer-wrapper-mmt,
    .oet-nurses-mmt-layout .timer-wrapper-mmt {
        top: -100px;
        right: 15px;
    }
}

@media (max-width: 768px) {
    .oet-doctors-mmt-layout .medicineswt2 div,
    .oet-nurses-mmt-layout .nursingswt2 div {
        width: 100%;
    }

    .oet-doctors-mmt-layout h1.page-header,
    .oet-nurses-mmt-layout h1.page-header {
        margin-top: 60px;
    }

    .oet-doctors-mmt-layout .timer-wrapper-mmt,
    .oet-nurses-mmt-layout .timer-wrapper-mmt {
        top: -120px;
        right: 15px;
    }

    .oet-writing-assessment-layout #reading-panel,
    .oet-writing-assessment-layout #answer-panel {
        width: 100%;
    }

        .oet-writing-assessment-layout #reading-panel .panel-body {
            max-height: 650px;
        }
}

@media (max-width: 555px) {
    .oet-doctors-mmt-layout .timer-wrapper-mmt,
    .oet-nurses-mmt-layout .timer-wrapper-mmt {
        right: initial;
        left: 15px;
        top: -160px;
    }
}

/* End Region OET Writing Layout */

/* Region Placement Test */

#placement-test .title {
    color: #0E2653;
}

#placement-test .start-test-button {
    text-align: center;
}

#placement-test .navigate-test-button {
    display: flex;
    justify-content: space-between;
}

#placement-test #main-instruction {
    font-size: 18px;
}

    #placement-test #main-instruction button {
        margin-top: 50px;
    }

#placement-test .progress {
    background: #D9D9D9;
    border-radius: 10px;
    box-shadow: inset 0px 4px 4px rgba(0, 0, 0, 0.25);
}

    #placement-test .progress .progress-bar {
        background: #37807C;
        border-radius: 10px;
    }

#placement-test .completion-wrapper .panel-body {
    padding-left: 30px;
    padding-right: 30px;
    font-size: 18px;
}

    #placement-test .completion-wrapper .panel-body .see-result-button {
        margin-top: 5rem;
    }

/* End Region Placement Test */

/* Region Udemy */

@media (max-width: 1370px) {
    #e2shop .add-on-item .udemy-tax-info {
        font-size: 8pt;
        display: block;
    }
}

/* End Region Udemy */

/* Region PlacementTest */

.plt-modal.modal .close {
    background: #dff1fc !important;
    color: #0e2653 !important;
}

.plt-modal.modal .modal-header {
    background: unset !important;
}

.plt-modal.modal .img-responsive {
    max-width: 100%;
    display: block;
    height: auto;
}

.plt-modal.modal .bootstrap-dialog-title {
    color: #000;
}

.plt-modal .modal-body h4 span {
    display: inline-block;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    transform: translateY(1px);
    margin-right: 8px;
}

.a1-bg-color,
.a2-bg-color {
    background-color: #12326e !important;
}

.c1-bg-color {
    background-color: #ffa250 !important;
}

.b2-bg-color {
    background-color: #9e78fb !important;
}

.b1-bg-color {
    background-color: #fdd648 !important;
}

.c2-bg-color {
    background-color: #517dff !important;
}

#placement-test .completion-wrapper > .page-top {
    margin-bottom: 25px;
}

.score-estimator-wrapper .panel-body {
    padding: 30px;
}

.score-estimator-wrapper .score-estimator-top {
    padding-bottom: 25px;
    margin-bottom: 10px;
    border-bottom: 1px solid #eee;
}

.score-estimator-wrapper .score-estimator-btn {
    margin-top: 30px;
}

.plt-frame {
    width: 100%;
    border: none;
    min-height: 600px
}

#placement-test .question-wrapper audio {
    max-width: 100%
}

/* End Region PlacementTest */

/* Region Live Class Microfrontend */

.lc-frame {
    width: 100%;
    border: none;
    min-height: 520px;
    height: 100%;
}

/* End Region Live Class Microfrontend */

/* Region Mobile Style Mock Test Practice */

@media only screen and (max-width: 767px) {
    .page-main.page-main-activity.upsize-font {
        margin-bottom: 0;
    }

        .page-main.page-main-activity.upsize-font .col-lg-12 {
            padding: 0;
        }

            .page-main.page-main-activity.upsize-font .col-lg-12 .wrapper-section.panelContent {
                display: flex;
                flex-direction: column;
                width: 100%;
                margin: 0;
            }

                .page-main.page-main-activity.upsize-font .col-lg-12 .wrapper-section.panelContent .panelContent {
                    position: inherit;
                }

                    .page-main.page-main-activity.upsize-font .col-lg-12 .wrapper-section.panelContent .panelContent .panelSection {
                        position: inherit;
                    }

                        .page-main.page-main-activity.upsize-font .col-lg-12 .wrapper-section.panelContent .panelContent .panelSection .panel.panel-body.content-panel {
                            width: 100%;
                        }

                        .page-main.page-main-activity.upsize-font .col-lg-12 .wrapper-section.panelContent .panelContent .panelSection .section-footer.col-sm-12 {
                            display: flex;
                            flex-direction: row-reverse;
                            bottom: -70px;
                        }

                            .page-main.page-main-activity.upsize-font .col-lg-12 .wrapper-section.panelContent .panelContent .panelSection .section-footer.col-sm-12 .pull-right.section-btn {
                                max-width: unset;
                                bottom: -30px;
                                position: absolute;
                            }

                .page-main.page-main-activity.upsize-font .col-lg-12 .wrapper-section.panelContent .panel.panel-accordion.panelFooter {
                    position: unset;
                    max-height: unset;
                    display: flex;
                    height: auto;
                    flex-flow: column;
                    min-height: 120px;
                }

                    .page-main.page-main-activity.upsize-font .col-lg-12 .wrapper-section.panelContent .panel.panel-accordion.panelFooter > a {
                        display: flex;
                        flex-flow: column;
                    }

                    .page-main.page-main-activity.upsize-font .col-lg-12 .wrapper-section.panelContent .panel.panel-accordion.panelFooter .panel-collapse {
                        display: flex;
                    }

                    .page-main.page-main-activity.upsize-font .col-lg-12 .wrapper-section.panelContent .panel.panel-accordion.panelFooter .panel-heading.titlePalette {
                        display: inline-flex;
                        margin-top: 10px;
                    }

                        .page-main.page-main-activity.upsize-font .col-lg-12 .wrapper-section.panelContent .panel.panel-accordion.panelFooter .panel-heading.titlePalette .question-palette-title {
                            padding: 0 !important;
                        }

                        .page-main.page-main-activity.upsize-font .col-lg-12 .wrapper-section.panelContent .panel.panel-accordion.panelFooter .panel-heading.titlePalette .footer-items:last-child {
                            display: inline-flex;
                            flex-wrap: wrap;
                            gap: 10px;
                            width: 140px;
                        }

                .page-main.page-main-activity.upsize-font .col-lg-12 .wrapper-section.panelContent .panelContent .panelSection .section-footer.col-sm-12 .pull-right.section-btn > button {
                    margin-top: 3px;
                    min-width: 0;
                    font-size: 8pt;
                }

    #page-wrapper.page-fixed {
        position: relative !important;
    }

    .ielts .panel-header-title-container {
        height: auto;
    }

    #ielts-test-container > p.band-score {
        position: absolute;
        left: 100px;
        top: 20px;
        z-index: -1;
    }

    #ielts-test-container .panelContent.ielts .panel-audio-container {
        position: inherit;
        padding-bottom: 0;
    }

    .panelPalette {
        height: auto !important;
    }

    .writing-test-panel-one-column {
        position: relative !important;
    }

    .page-main.page-main-activity.upsize-font#IeltsReTellLectureMockTest .col-lg-12 {
        padding-right: 15px !important;
        padding-left: 15px !important;
    }

    .ielts .reading-test-panel .right-panel {
        margin-left: 0 !important;
    }

    .page-main-activity.oet-22.upsize-font.answer-panel .col-lg-12.center-block,
    .page-main-activity.oet-23.upsize-font.answer-panel .col-lg-12.center-block {
        padding-left: 10px;
        padding-right: 10px;
    }

    .page-main.page-main-activity.upsize-font.vocabulary-builder.oet-22 > .row > .col-lg-12 > .panel.panel-default,
    .page-main.page-main-activity.upsize-font.vocabulary-builder.oet-22 > .row > .col-lg-12 > .panel.panel-default > .panel-body > .form-group > .col-lg-12,
    .page-main.page-main-activity.upsize-font.vocabulary-builder.oet-23 > .row > .col-lg-12 > .panel.panel-default,
    .page-main.page-main-activity.upsize-font.vocabulary-builder.oet-23 > .row > .col-lg-12 > .panel.panel-default > .panel-body > .form-group > .col-lg-12 {
        padding-left: 15px;
        padding-right: 15px;
    }

        .page-main.page-main-activity.upsize-font.vocabulary-builder.oet-22 > .row > .col-lg-12 > .panel.panel-default > .panel-heading > .row > .col-xs-6,
        .page-main.page-main-activity.upsize-font.vocabulary-builder.oet-23 > .row > .col-lg-12 > .panel.panel-default > .panel-heading > .row > .col-xs-6 {
            line-height: normal;
        }

    .page-main-activity.upsize-font.ddl > .row:nth-child(2) > .col-lg-12,
    .page-main-activity.upsize-font.mmt > .row:nth-child(2) > .col-lg-12,
    .page-main-activity.upsize-font.fib-mmt > .row:nth-child(2) > .col-lg-12,
    .page-main-activity.upsize-font.mc-mmt > .row:nth-child(2) > .col-lg-12,
    .page-main-activity.upsize-font.audio-mmt > .row:nth-child(2) > .col-lg-12 {
        padding: 15px;
    }

        .page-main-activity.upsize-font.ddl > .row:nth-child(2) > .col-lg-12 .wrapper-question > .row,
        .page-main-activity.upsize-font.mmt > .row:nth-child(2) > .col-lg-12 .wrapper-question > .row > .col-lg-12,
        .page-main-activity.upsize-font.fib-mmt > .row:nth-child(2) > .col-lg-12 .wrapper-question > .row > .col-lg-12,
        .page-main-activity.upsize-font.audio-mmt > .row:nth-child(2) > .col-lg-12 .wrapper-question > .row > .col-lg-12,
        .page-main-activity.upsize-font.order .row > .col-lg-12,
        .page-main-activity.upsize-font.audio-mmt .listening-instruction-panel > .col-lg-12,
        .page-main-activity.upsize-font.dnd > .row > .col-lg-12,
        .page-main-activity.upsize-font.rwfib > .row > .col-lg-12,
        .page-main-activity.upsize-font.toefl > .row > .col-lg-12,
        .page-main-activity.upsize-font.toefl > .row > .col-lg-12 .panel-body > .form-group > .col-lg-12,
        .page-main-activity.upsize-font.pte > .row > .col-lg-12,
        .page-main-activity.upsize-font.pte > .row > .col-lg-12 .panel-body > .form-group > .col-lg-12,
        .page-main-activity.upsize-font.toefl .wrapper-question > .row > .col-lg-12,
        .page-main-activity.upsize-font.pte .wrapper-question > .row > .col-lg-12,
        .page-main-activity.upsize-font#PteReadAloudPractice .row > .col-lg-12,
        .page-main-activity.upsize-font#describeImagePracticeMockTest .row > .col-lg-12,
        .page-main-activity.upsize-font#ReTellLectureMockTest .row > .col-lg-12,
        .page-main-activity.upsize-font#PteRepeatSentence .row > .col-lg-12,
        .page-main-activity.upsize-font.answer-short .row > .col-lg-12,
        .page-main-activity.upsize-font.summarize-writing .row > .col-lg-12,
        .page-main-activity.upsize-font.summarize-spoken-text .row > .col-lg-12,
        .page-main-activity.upsize-font.write-essay .row > .col-lg-12,
        .page-main-activity.upsize-font.fib .row > .col-lg-12,
        .page-main-activity.upsize-font.answer-short .row > .col-lg-12 .form-group > .col-lg-12 {
            padding-right: 15px;
            padding-left: 15px;
        }

    .page-main-activity.upsize-font.ddl .wrapper-question .row > .col-xs-12 > .form-group,
    .no-padding-left-right {
        margin-left: 15px !important;
        margin-right: 15px !important;
    }

    .page-main-activity.upsize-font.toefl > .col-sm-6 {
        padding-right: 0;
        padding-left: 0;
    }

    .page-main-activity.upsize-font.toefl > .row > .col-lg-12 .row > .col-xs-6,
    .page-main-activity.upsize-font.pte > .row > .col-lg-12 .row > .col-xs-6,
    .page-main-activity.upsize-font.summarize-writing > .row > .col-xs-6,
    .page-main-activity.upsize-font.summarize-spoken-text .row > .col-xs-6,
    .page-main-activity.upsize-font.write-essay > .row > .col-xs-6 {
        width: 100%;
    }

    .page-main-activity.upsize-font.toefl .row.reading-text-paragraph img {
        padding: 15px;
    }

    .page-main.page-main-activity#GrammarExerciseTest .row {
        margin: 0;
    }

    .page-main-activity.upsize-font.summarize-writing > .row > .col-lg-12 .row > .col-xs-6,
    .page-main-activity.upsize-font.write-essay > .row > .col-lg-12 .row > .col-xs-6 {
        line-height: normal;
    }
}

.page-main-activity.upsize-font.toefl .exercise-text {
    overflow: scroll;
}

#page-wrapper.non-selectable .popup-layout .page-top > .page-header {
    display: inline-block;
    width: 100%;
}

    #page-wrapper.non-selectable .popup-layout .page-top > .page-header #caseNoteButton {
        margin-left: 15px;
        width: fit-content;
    }

@media only screen and (max-width: 680px) {
    .page-main.page-main-activity.upsize-font .col-lg-12 .wrapper-section.panelContent .panelContent .panelSection .section-footer.col-sm-12 {
        display: flex;
        flex-direction: row-reverse;
    }
}

/* End Region Mobile Style Mock Test Practice */


.btn-primary.btn-join {
    background-color: #41BB7A;
    border-color: #41BB7A;
}

#live-class-detail .header-title {
    font-weight: 600;
    font-size: 24px !important;
    padding-top: 20px;
    padding-left: 20px;
    padding-right: 20px;
    min-height: 560px;
}

#live-class-detail .live-class-panel-body {
    min-height: 560px;
}

.p-20 {
    padding: 20px;
}

#live-classModal .lc-upgradeBtn,
#live-class-detail .lc-upgradeBtn {
    background-color: #ED6A5E;
    border-color: #ED6A5E;
}

#live-class-detail .lc-footer {
    position: absolute;
    right: 40px;
    bottom: 40px;
}

.lc-row {
    display: flex;
}

    .lc-row .panel.panel-default {
        height: 100%;
        margin-bottom: 0;
    }

    .lc-row .panel-body {
        height: 100%;
    }

    .lc-row .lc-joinsection p {
        width: 100%;
    }

    .lc-row .lc-joinsection .btn-join {
        width: 75px;
    }

.lc-col {
    flex: 1;
    padding: 1em;
}

/* #region New Student Dashboard Menu style */

.navigation-new-style .scollbar-float .upgrade-account {
    background: #FDEDEB 0% 0% no-repeat padding-box;
    border-radius: 4px;
    opacity: 1;
    margin: 5px 10px;
}

.navigation-new-style .scollbar-float .shop {
    background: #EEF2FF 0% 0% no-repeat padding-box;
    border-radius: 4px;
    opacity: 1;
    margin: 5px 10px;
    color: #1F57FF !important;
}

.navigation-new-style .scollbar-float .reward {
    background: #EEF9F3 0% 0% no-repeat padding-box;
    border-radius: 4px;
    opacity: 1;
    margin: 5px 10px;
    color: #2C7D50 !important;
}

.navigation-new-style .scollbar-float .upgrade-account a,
.navigation-new-style .scollbar-float .upgrade-account a:hover,
.navigation-new-style .scollbar-float .upgrade-account a:active,
.navigation-new-style .scollbar-float .upgrade-account a:focus {
    color: #D32717 !important;
}

.navigation-new-style .scollbar-float .shop a,
.navigation-new-style .scollbar-float .shop a:hover,
.navigation-new-style .scollbar-float .shop a:active,
.navigation-new-style .scollbar-float .shop a:focus {
    color: #1F57FF !important;
}

.navigation-new-style .scollbar-float .reward a,
.navigation-new-style .scollbar-float .reward a:hover,
.navigation-new-style .scollbar-float .reward a:active,
.scollbar-float .reward a:focus {
    color: #2C7D50 !important;
}

.navigation-new-style .scollbar-float .upgrade-account a:hover:after,
.navigation-new-style .scollbar-float .upgrade-account a.active:after,
.navigation-new-style .scollbar-float .upgrade-account a:focus:after {
    background: #FDEDEB !important;
    border: 0;
}

.navigation-new-style .scollbar-float .shop a:hover:after,
.navigation-new-style .scollbar-float .shop a.active:after,
.navigation-new-style .scollbar-float .shop a:focus:after {
    background: #EEF2FF !important;
    border: 0;
}

.navigation-new-style .scollbar-float .reward a:hover:after,
.navigation-new-style .scollbar-float .reward a.active:after,
.navigation-new-style .scollbar-float .reward a:focus:after {
    background: #EEF9F3 !important;
    border: 0;
}

.svg-upgrade-icon {
    mask: url("/Themes/v4/additional/css/icons/Power_Package_v3.svg") no-repeat center;
    -webkit-mask: url("/Themes/v4/additional/css/icons/Power_Package_v3.svg") no-repeat center;
    background-color: #D32717;
}

.svg-shop-icon {
    mask: url("/Themes/v4/additional/css/icons/Shop_v3.svg") no-repeat center;
    -webkit-mask: url("/Themes/v4/additional/css/icons/Shop_v3.svg") no-repeat center;
    background-color: #1F57FF;
}

.svg-rewards-icon {
    mask: url("/Themes/v4/additional/css/icons/E2_Rewards_v3.svg") no-repeat center;
    -webkit-mask: url("/Themes/v4/additional/css/icons/E2_Rewards_v3.svg") no-repeat center;
    background-color: #2C7D50;
}

.svg-sidebar {
    display: inline-block;
    vertical-align: middle;
    width: 40px;
    height: 40px;
    transform: scale(0.5);
    margin-left: -5px;
}

.navigation-new-style .dropdown-user .my-account-menu {
    border-bottom: 1px solid #DEE2E4;
}

.navigation-new-style .dropdown-user #logout {
    border-top: 1px solid #DEE2E4;
}

.navigation-new-style .navbar-top-links .upgrade-account-menu {
    background: #E12A19 0% 0% no-repeat padding-box;
    border-radius: 10px;
    opacity: 1;
    padding: 10px 15px 10px 10px;
    min-height: 0px;
}

    .navigation-new-style .navbar-top-links .upgrade-account-menu:hover,
    .navigation-new-style .navbar-top-links .upgrade-account-menu:focus,
    .navigation-new-style .navbar-top-links .upgrade-account-menu:active {
        background: #ca2516 0% 0% no-repeat padding-box;
        border-radius: 10px;
    }

    .navigation-new-style .navbar-top-links .upgrade-account-menu img {
        width: 20px;
        height: 20px;
        vertical-align: bottom;
    }

    .navigation-new-style .navbar-top-links .upgrade-account-menu span {
        text-align: left;
        font: normal normal 600 14px/19px Segoe UI;
        letter-spacing: 0px;
        color: #FFFFFF;
        text-transform: uppercase;
        opacity: 1;
    }

.navigation-new-style .navbar-top-links .count-badge {
    background: #E12323;
}

.navigation-new-style .navbar-top-links .dropdown-user li a img {
    width: 18px;
    height: 14px;
    margin-bottom: 3px;
}

@media only screen and (max-width: 768px) {
    #sidebarNavigation.student-layout {
        z-index: 1;
        margin-top: 53px;
    }

    #page-wrapper.student-layout {
        margin-top: 70px;
    }

    #side-menu.student-layout {
        height: 444px !important;
    }
}

@media only screen and (max-width: 376px) {
    #sidebarNavigation[data-is-allow-upgrade-package="True"].student-layout {
        margin-top: 102px;
    }

    #sidebarNavigation[data-is-allow-upgrade-package="True"] ~ .main-body-border > #page-wrapper.student-layout {
        margin-top: 117px;
    }
}

/* #endregion New Student Dashboard Menu style */

#topBarNavigation {
    width: 100%;
    position: fixed;
}

.p-t-86 {
    padding-top: 86px !important;
}

#sidebarNavigation {
    position: fixed;
}

.hl-pink {
    background-color: #F3CCCB;
}

.hl-orange {
    background-color: #FCE5CD;
}

.hl-blue {
    background-color: #D0E2F4;
}

.hl-purple {
    background-color: #D9D3E9;
}

.hl-green {
    background-color: #D9EAD3;
}

.hl-grey {
    background-color: #EFEFEF;
}

.hl-light-purple {
    background-color: #EAD1DC;
}

.m-b-0 {
    margin-bottom: 0 !important;
}

.line-through {
    text-decoration: line-through;
}

.font-normal {
    font-weight: normal;
}

.discount-text-red {
    color: #e12919;
}

.discount-text-info {
    color: #235d3f;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 16px;
}

    .discount-text-info.addon-text {
        text-transform: none;
        font-size: 14px;
    }

.voucher-applied .package-grid .package-item .price {
    font-size: 24px;
}

.m-20 {
    margin: 20px;
}

/*#region outer mobile page*/

#page-wrapper.mobile {
    border: none;
    margin: 0;
}

.audio-wrapper iframe {
    width: 100%;
}

.mobile #VideoChecker .video-wrapper {
    width: 100%;
}

.mobile .invalid p a {
    overflow-wrap: anywhere;
}

/*#endregion*/

.expiry-row {
    color: #555;
    background-color: #eee;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    margin: 0 0 10px 0;
    padding: 10px 15px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 0;
}

    .expiry-row > div {
        padding: 0
    }

#studentAssessment .badge-red {
    color: #fff;
    background-color: #ED6A5E;
    padding: 5px 10px;
}

#studentAssessment .badge-yellow {
    color: #333333;
    background-color: #FFD64B;
    padding: 5px 10px;
}

#e2shop .tooltip-inner {
    max-width: 100%;
}

/*#region upgrade modal whiteV2*/

#upgrade-packageModal .modal-dialog,
#upgrade-mockTestModal .modal-dialog {
    margin: 0 auto;
    margin-top: 10px;
}

#upgrade-packageModal .modal-content,
#upgrade-packageModal .modal-body,
#upgrade-packageModal .modal-footer,
#upgrade-mockTestModal .modal-content,
#upgrade-mockTestModal .modal-body,
#upgrade-mockTestModal .modal-footer {
    background-color: #0E2653 !important;
    color: white;
}

#upgrade-packageModal .close,
#upgrade-mockTestModal .close {
    top: 20px;
    right: 20px;
}

#upgrade-packageModal .modal-header,
#upgrade-mockTestModal .modal-header, {
    padding: 0;
}

#upgrade-packageModal .modal-body img,
#upgrade-mockTestModal .modal-body img {
    max-width: 100%;
}

#upgrade-packageModal .modal-body p,
#upgrade-mockTestModal .modal-body p {
    font-size: 18px;
}

#upgrade-packageModal .modal-body .btn-primary,
#upgrade-mockTestModal .modal-body .btn-primary {
    margin-top: 20px;
    margin-bottom: 10px;
}

/*#endregion*/

/* #region tutorial */

.tutorial-list {
    padding-left: 0;
    list-style-type: none;
    display: flex;
    margin-left: -8px;
    margin-right: -8px;
    margin-bottom: 0;
}

    .tutorial-list li {
        width: 33.33%;
        padding-left: 8px;
        padding-right: 8px;
    }

    .tutorial-list .tutorial-item {
        display: flex;
        flex-direction: column;
        background-color: white;
        border-radius: 10px;
        border: 1px solid #e0e0e0;
        height: 100%;
    }

        .tutorial-list .tutorial-item .tutorial-img {
            border-top-left-radius: 10px;
            border-top-right-radius: 10px;
            overflow: hidden;
        }

            .tutorial-list .tutorial-item .tutorial-img img {
                width: 100%;
            }

        .tutorial-list .tutorial-item .tutorial-body {
            flex: 1;
            display: flex;
            flex-direction: column;
            padding: 15px;
        }

            .tutorial-list .tutorial-item .tutorial-body h4 {
                display: flex;
                align-items: center;
                color: #0E2653;
                margin-top: 0;
                margin-bottom: 15px;
            }

                .tutorial-list .tutorial-item .tutorial-body h4 span:first-child {
                    display: inline-block;
                    font-size: 24px;
                    margin-right: 10px;
                    background: #dff1fc;
                    line-height: normal;
                    padding: 2px 8px;
                    padding-top: 1px;
                    border-radius: 10px;
                }

        .tutorial-list .tutorial-item .tutorial-btn-section {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-top: auto;
        }

@media (max-width: 1024px) {
    .tutorial-list {
        margin-left: -5px;
        margin-right: -5px;
    }

        .tutorial-list li {
            padding-left: 5px;
            padding-right: 5px;
        }

        .tutorial-list .tutorial-item .tutorial-body {
            padding: 10px;
            padding-bottom: 0;
        }

            .tutorial-list .tutorial-item .tutorial-body h4 {
                font-size: 16px;
            }

                .tutorial-list .tutorial-item .tutorial-body h4 span:first-child {
                    font-size: 20px;
                    margin-right: 5px;
                }

        .tutorial-list .tutorial-item .tutorial-btn-section {
            flex-wrap: wrap;
        }

            .tutorial-list .tutorial-item .tutorial-btn-section .time,
            .tutorial-list .tutorial-item .tutorial-btn-section .btn {
                margin-bottom: 10px;
            }
}

/* #endregion tutorial */


.float-left {
    float: left;
}

/* #region group class */

.group-class {
    margin-top: 20px;
    margin-bottom: 5px;
}

.list-scroll {
    position: relative;
    padding: 0 10px;
}

    .list-scroll .list-scroll-container {
        position: relative;
        padding: 0 5px;
        overflow: hidden;
    }

    .list-scroll .list-row {
        display: flex;
        flex-wrap: nowrap;
        position: relative;
        padding: 0;
        margin-left: -8px;
        margin-right: -8px;
    }

        .list-scroll .list-row li {
            width: 33.3333%;
            flex: 0 0 33.3333%;
            padding-left: 8px;
            padding-right: 8px;
        }

    .list-scroll .btn-prev,
    .list-scroll .btn-next {
        position: absolute;
        top: calc(50% - 20px);
        background: white;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        padding: 2px;
        box-shadow: 0px 2px 4px 0px rgba(50, 88, 139, 0.1);
        color: #0E2653;
    }

    .list-scroll .btn-prev {
        left: -5px;
        display: none;
    }

    .list-scroll .btn-next {
        right: -5px;
    }

        .list-scroll .btn-prev .fa,
        .list-scroll .btn-next .fa {
            font-size: 14px;
            margin-right: 0;
        }

.group-class-list {
    padding-left: 0;
    list-style-type: none;
    display: flex;
    margin-left: -8px;
    margin-right: -8px;
    margin-bottom: 0;
}

    .group-class-list li {
        width: 33.33%;
        padding-left: 8px;
        padding-right: 8px;
    }

    .group-class-list .group-class-item {
        display: flex;
        flex-direction: column;
        background-color: white;
        border-radius: 10px;
        border: 1px solid #e0e0e0;
        height: 100%;
    }

        .group-class-list .group-class-item .group-class-img {
            border-top-left-radius: 10px;
            border-top-right-radius: 10px;
            overflow: hidden;
        }

            .group-class-list .group-class-item .group-class-img img {
                width: 100%;
            }

        .group-class-list .group-class-item .group-class-body {
            flex: 1;
            display: flex;
            flex-direction: column;
            padding: 15px 20px 15px 20px;
        }

            .group-class-list .group-class-item .group-class-body h4 {
                display: flex;
                align-items: center;
                color: #0E2653;
                margin-top: 0;
                margin-bottom: 15px;
            }

                .group-class-list .group-class-item .group-class-body h4 span:first-child {
                    display: inline-block;
                    font-size: 24px;
                    margin-right: 10px;
                    background: #dff1fc;
                    line-height: normal;
                    padding: 2px 8px;
                    padding-top: 1px;
                    border-radius: 10px;
                }

        .group-class-list .group-class-item .group-class-btn-section {
            display: flex;
            justify-content: space-between;
            align-items: end;
            margin-top: auto;
        }

            .group-class-list .group-class-item .group-class-btn-section ul {
                padding-left: 0;
                list-style-type: none;
                margin-bottom: 0;
            }

                .group-class-list .group-class-item .group-class-btn-section ul li {
                    width: 100%;
                    padding: 0;
                    margin-bottom: 10px;
                }

                    .group-class-list .group-class-item .group-class-btn-section ul li:last-child {
                        margin-bottom: 0;
                    }

                    .group-class-list .group-class-item .group-class-btn-section ul li .fa {
                        width: 14px;
                        text-align: center;
                    }

#group-class-detail-Modal .modal-header,
#group-class-cancel-Modal .modal-header {
    padding-bottom: 0;
}

#group-class-detail-Modal .img-box img,
#group-class-cancel-Modal .img-box img {
    max-width: 100%;
    border-radius: 10px;
    margin-bottom: 15px;
    width: 100%;
}

.group-class-detail {
    padding-left: 10px;
    list-style-type: none;
    margin-bottom: 20px
}

    .group-class-detail li {
        display: flex
    }

        .group-class-detail li + li {
            margin-top: 10px
        }

        .group-class-detail li .fa {
            width: 14px;
            text-align: center;
            margin-right: 15px;
            transform: translateY(4px)
        }

        .group-class-detail li p {
            margin-bottom: 0
        }

        .group-class-detail li .teacher-avatar {
            display: flex;
            align-items: center
        }

            .group-class-detail li .teacher-avatar span {
                display: inline-block;
                width: 24px;
                height: 24px;
                display: inline-flex;
                justify-content: center;
                align-items: center;
                border-radius: 50%;
                overflow: hidden;
                margin-right: 5px
            }

                .group-class-detail li .teacher-avatar span img {
                    object-fit: cover;
                    max-width: 100%
                }

@media (min-width: 1600px) {
    .list-scroll .list-row li {
        width: 25%;
        flex: 0 0 25%;
    }
}

@media (max-width: 1024px) {
    .list-scroll .list-row li {
        width: 50%;
        flex: 0 0 50%;
    }
}

#GroupClassIndexV2 h3 {
    margin-top: 0;
}

.group-class-detail .group-class-description {
    overflow-x: auto;
    max-height: 150px;
}

/* #endregion group class */

/* #region E2 Rewards prompt in Purchase*/

.btn-inter {
    font-family: 'Inter', sans-serif;
    font-weight: 600;
}

.confirmation-prompt,
.confirmation-prompt + .panel-footer {
    border: none;
}

.confirmation-prompt {
    font-family: 'Inter', sans-serif;
}

    .confirmation-prompt .d-flex {
        margin-top: 2rem;
        justify-content: center;
    }

    .confirmation-prompt .panel-title {
        font-size: 32px !important;
        font-weight: 700;
        color: #0E2653;
        margin-top: auto;
        margin-bottom: auto;
        font-family: 'Poppins', sans-serif;
    }

    .confirmation-prompt #confirmationMessage {
        font-size: 18px;
        line-height: 26px;
        font-family: 'Roboto', sans-serif;
    }

        .confirmation-prompt #confirmationMessage b {
            font-weight: 700;
        }

    .confirmation-prompt .panel-discription {
        margin-top: 3rem;
        margin-bottom: 4rem;
    }

    .confirmation-prompt .e2-rewards-prompt {
        background-image: url('https://e2assetsv2.e2language.com/e2l-image/v3/BGE2Reward_Main image.png');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        margin-left: 1rem;
        margin-right: 1rem;
        margin-top: 2rem;
        padding-bottom: 1rem;
        border-radius: 15px;
    }

        .confirmation-prompt .e2-rewards-prompt h2 {
            font-size: 31px;
            font-weight: 600;
            color: #0E2653;
        }

        .confirmation-prompt .e2-rewards-prompt h4 {
            font-size: 20px;
            font-weight: 600;
            color: #0E2653;
        }

        .confirmation-prompt .e2-rewards-prompt > img {
            height: 109px;
        }

        .confirmation-prompt .e2-rewards-prompt .referral-ulr-panel {
            width: 80%;
            margin: auto;
        }

            .confirmation-prompt .e2-rewards-prompt .referral-ulr-panel .form-control {
                border-radius: 10px;
                padding: 10px 15px;
                height: auto;
                box-shadow: none;
                background-color: white;
            }

            .confirmation-prompt .e2-rewards-prompt .referral-ulr-panel #copy-url-btn {
                border-top-left-radius: 10px;
                border-bottom-left-radius: 10px;
                margin-left: 16px;
                font-weight: 600;
            }

        .confirmation-prompt .e2-rewards-prompt .share-link,
        .confirmation-prompt .e2-rewards-prompt .learn-more {
            font-size: 14px;
            font-weight: 500;
            color: #0E2653;
        }

        .confirmation-prompt .e2-rewards-prompt .e2reward-share-social li a {
            width: 32px;
            height: 32px;
        }

/* #endregion E2 Rewards prompt in Purchase*/

/* NIB Style */

#nibSlideOut.add-on-detail-pane ul {
    list-style-type: disc;
    padding: revert;
}

    #nibSlideOut.add-on-detail-pane ul li {
        display: list-item;
    }

.add-on-footer.nib {
    width: 50%;
    align-self: flex-end;
}

/* End of NIB Style */

/* #region E2 Rewards prompt in Purchase Mobile*/

@media only screen and (max-width: 767px) {
    #wrapper.mobile .navbar-static-top .navbar-header > .navbar-toggle {
        display: none;
    }

    #wrapper.mobile {
        height: 100%;
    }

        #wrapper.mobile #page-wrapper {
            height: 100%;
            background: #0E2653 !important;
        }

        #wrapper.mobile #mainUserContent,
        #wrapper.mobile #mainUserContent .container {
            padding: 0 !important;
        }

            #wrapper.mobile #mainUserContent .container > .row {
                background: #0E2653 !important;
            }

                #wrapper.mobile #mainUserContent .container > .row > .col-md-8 {
                    margin: 0;
                }

                    #wrapper.mobile #mainUserContent .container > .row > .col-md-8 .panel-registration .confirmation-prompt {
                        background: #0E2653 !important;
                        color: #fff;
                        padding: 0 10px;
                    }

                        #wrapper.mobile #mainUserContent .container > .row > .col-md-8 .panel-registration .confirmation-prompt .e2-rewards-prompt h2 {
                            margin-top: 10px !important;
                        }

                        #wrapper.mobile #mainUserContent .container > .row > .col-md-8 .panel-registration .confirmation-prompt .e2-rewards-prompt h4 {
                            font-size: 16px;
                        }

                        #wrapper.mobile #mainUserContent .container > .row > .col-md-8 .panel-registration .confirmation-prompt .d-flex {
                            flex-direction: column;
                        }

                        #wrapper.mobile #mainUserContent .container > .row > .col-md-8 .panel-registration .confirmation-prompt .e2-rewards-prompt .e2reward-share-social li a {
                            width: 44px;
                            height: 44px;
                        }

                        #wrapper.mobile #mainUserContent .container > .row > .col-md-8 .panel-registration .confirmation-prompt .d-flex .panel-title {
                            color: white;
                            margin-top: 10px;
                        }

            #wrapper.mobile #mainUserContent .container .e2-rewards-prompt {
                margin: 0;
                padding-top: 30px;
                padding-bottom: 30px;
                background-position: left;
            }

                #wrapper.mobile #mainUserContent .container .e2-rewards-prompt .input-group > input {
                    border: 1px solid #DADBDE;
                }

                #wrapper.mobile #mainUserContent .container .e2-rewards-prompt .input-group > .input-group-btn > .btn.btn-primary {
                    color: #000;
                    background: transparent;
                    border: none;
                    box-shadow: unset;
                    text-transform: math-auto;
                    margin: 0;
                }

            #wrapper.mobile #mainUserContent .container > .row > .col-md-8 .panel-registration .panel-footer > .btn.btn-primary {
                background: transparent;
                border: none;
                text-decoration: underline;
                text-transform: math-auto;
                font-size: 18px;
                font-family: 'Roboto', sans-serif;
                font-weight: 400;
            }

            #wrapper.mobile #mainUserContent .e2reward-share-social {
                margin-bottom: 50px;
            }

                #wrapper.mobile #mainUserContent .e2reward-share-social > li > a {
                    width: 44px;
                    height: 44px;
                }

            #wrapper.mobile #mainUserContent .container .e2-rewards-prompt > a.learn-more {
                font-family: 'Roboto', sans-serif;
                font-size: 18px;
                font-weight: 400;
            }
}
/* #endregion E2 Rewards prompt in Purchase Mobile*/

/* #region Assessmend Bundle Flexible Purchase */

.addondetail-bundle-radio .radio label {
    padding: 10px;
    text-transform: initial;
}

.addondetail-bundle-radio .radio label {
    display: flex;
    justify-content: space-between;
}

    .addondetail-bundle-radio .radio label span {
        color: #D32717;
        font-weight: 600;
    }

    .addondetail-bundle-radio .radio label::before,
    .addondetail-bundle-radio .radio label::after {
        display: none;
    }

/* #endregion Assessmend Bundle Flexible Purchase */

/* #region My Progress History */

.title-myProgressHistory {
    font-size: 20px;
    font-weight: 600;
    color: #0E2653;
}

#myProgressHistoryDialog .modal-header {
    padding-bottom: 0px;
}

    #myProgressHistoryDialog .modal-header > span {
        color: #0E2653;
    }

    #myProgressHistoryDialog .modal-header .desc-myProgressHistoryChart {
        font-size: 20px;
    }

/* #endregion My Progress History */

/* #region E2English Expiry */

#e2EnglishExpiredModal .modal-dialog,
#e2EnglishLogoutModal .modal-dialog {
    margin: 0 auto;
    margin-top: 10px;
}

#e2EnglishExpiredModal .modal-content,
#e2EnglishExpiredModal .modal-body,
#e2EnglishExpiredModal .modal-footer,
#e2EnglishLogoutModal .modal-content,
#e2EnglishLogoutModal .modal-body,
#e2EnglishLogoutModal .modal-footer {
    background-color: #0E2653 !important;
    color: white;
}

#e2EnglishExpiredModal .close,
#e2EnglishLogoutModal .close {
    top: 20px;
    right: 20px;
}

#e2EnglishExpiredModal .modal-header,
#e2EnglishLogoutModal .modal-header {
    padding: 0;
}

#e2EnglishExpiredModal .modal-body img {
    max-width: 350px;
    width: 100%;
}

#e2EnglishExpiredModal .modal-body p,
#e2EnglishLogoutModal .modal-body p {
    font-size: 18px;
}

#e2EnglishExpiredModal .modal-body .btn-primary,
#e2EnglishLogoutModal .modal-body .btn-primary {
    margin-top: 20px;
    margin-bottom: 10px;
}

/* #endregion E2English Expiry */

.generate-chart-spinner {
    position: absolute;
    top: 40px;
}

.student-dashboard-metrics-iframe {
    width: 100%;
    overflow: hidden;
    border: 0;
    max-height: 110px;
}

@media (max-width: 1244px) {
    .student-dashboard-metrics-iframe {
        max-height: 122px;
    }
}
/* #region Student Progress No Score */

#noScoreStudentProgressModal .modal-dialog {
    margin: 0 auto;
    margin-top: 10px;
}

#noScoreStudentProgressModal .close {
    top: 20px;
    right: 20px;
}

#noScoreStudentProgressModal .modal-header {
    padding: 0;
}

#noScoreStudentProgressModal .modal-body img {
    max-width: 400px;
    width: 100%;
}

#noScoreStudentProgressModal .modal-body p {
    font-size: 18px;
}

#noScoreStudentProgressModal .modal-body .btn-primary {
    margin-top: 20px;
    margin-bottom: 10px;
}

/* #endregion Student Progress No Score */

@media (min-width: 992px) {
    #gridAppointmentDialog .modal-lg {
        width: 1000px !important;
    }
}

@media (min-width: 992px) {
    .modal-xl {
        width: 1100px !important;
    }
}

/* Region OET Role Play Card*/

.page-main-activity.retell-lecture.oet-23,
.page-main-activity.retell-lecture.oet-22 {
    background-color: #fff;
}

    .page-main-activity.answer-panel.oet-23 .panel-body,
    .page-main-activity.retell-lecture.oet-23 .panel-body,
    .page-main-activity.answer-panel.oet-22 .panel-body,
    .page-main-activity.retell-lecture.oet-22 .panel-body {
        background-color: #fff;
        border: none;
        box-shadow: none;
        margin-left: 20%;
        margin-right: 20%;
        padding: 15px 0 0 0;
    }

        .page-main-activity.answer-panel.oet-23 .panel-body .max-height-panel,
        .page-main-activity.answer-panel.oet-22 .panel-body .max-height-panel {
            max-height: none;
        }

        .page-main-activity.answer-panel.oet-23 .panel-body #transcriptSection,
        .page-main-activity.answer-panel.oet-22 .panel-body #transcriptSection {
            border-color: #ddd;
        }

.page-main-activity .panel-body #menu-action-link,
.page-main-activity .panel-body #document-link,
.page-main-activity .panel-body #sample-answer-link {
    color: #517DFF;
    font-weight: 600;
}

.page-main-activity .panel-body .role-play-card {
    border-bottom: 1px solid #000;
}

    .page-main-activity .panel-body .role-play-card tr {
        border-left: 1px solid #000;
        border-right: 1px solid #000;
    }

    .page-main-activity .panel-body .role-play-card td {
        padding: 8px 15px;
    }

        .page-main-activity .panel-body .role-play-card td p {
            margin: 0;
        }

.page-main-activity .panel-body .role-play-card-h1 {
    background-color: lightgrey;
    border: none !important;
}

.page-main-activity .panel-body .role-play-card-h2 {
    background-color: #000;
    color: #fff;
}

.page-main-activity.retell-lecture.oet-22 .panel-body .panel-subtitle,
.page-main-activity.retell-lecture.oet-22 .panel-body #record-instruction {
    display: none;
}

.page-main-activity.retell-lecture.oet-23 .panel-body #audioPlayerControl,
.page-main-activity.answer-panel.oet-23 .panel-body #audioPlayerControl,
.page-main-activity.retell-lecture.oet-22 .panel-body #audioPlayerControl,
.page-main-activity.answer-panel.oet-22 .panel-body #audioPlayerControl {
    width: 100%;
    text-align: center;
}

@media (max-width: 992px) {
    .page-main-activity.answer-panel.oet-23 .panel-body,
    .page-main-activity.retell-lecture.oet-23 .panel-body,
    .page-main-activity.answer-panel.oet-22 .panel-body,
    .page-main-activity.retell-lecture.oet-22 .panel-body {
        margin-left: 15%;
        margin-right: 15%;
    }
}

@media (max-width: 480px) {
    .page-main-activity.retell-lecture.oet-23,
    .page-main-activity.retell-lecture.oet-22 {
        margin-bottom: 15px;
    }

        .page-main-activity.answer-panel.oet-23 .panel-body,
        .page-main-activity.retell-lecture.oet-23 .panel-body,
        .page-main-activity.answer-panel.oet-22 .panel-body,
        .page-main-activity.retell-lecture.oet-22 .panel-body {
            margin: 0 15px;
        }

            .page-main-activity.retell-lecture.oet-23 .panel-body .recorderControlSection,
            .page-main-activity.retell-lecture.oet-23 .panel-body .uploadControlSection,
            .page-main-activity.retell-lecture.oet-23 .panel-body #record-result,
            .page-main-activity.retell-lecture.oet-22 .panel-body .recorderControlSection,
            .page-main-activity.retell-lecture.oet-22 .panel-body .uploadControlSection,
            .page-main-activity.retell-lecture.oet-22 .panel-body #record-result {
                padding: 0 15px;
            }
}

/* Endregion OET Role Play Card*/

@media (max-width: 765px) {
    .toefl .dragdrop-droppable-box {
        margin-top: 10px;
        margin-bottom: 10px;
        min-height: 50px;
    }
}

.add-on-detail-pane .e2s-new-addon li {
    display: block;
}

/* Region Automated Speaking Result */

.automated-speaking .badge-red {
    background-color: red;
    margin-left: 10px;
}

.activity-result-item {
    padding-top: 10px;
    padding-bottom: 20px;
}

    .activity-result-item + .activity-result-item {
        border-top: 1px solid #e0e0e0;
    }

    .activity-result-item h2 {
        color: #0E2653;
        margin-bottom: 20px;
    }

        .activity-result-item h2 .score {
            background-color: #DFF1FC;
            padding: 2px 15px;
            border-radius: 10px;
            margin-left: 15px;
        }

    .activity-result-item h3 {
        margin-bottom: 20px;
    }

    .activity-result-item .skill-level {
        display: inline-block;
        padding: 10px 25px;
        border-radius: 20px;
        font-weight: 600;
    }

        .activity-result-item .skill-level.level-red {
            background-color: #FDEDEB;
            color: #D32717;
        }

        .activity-result-item .skill-level.level-yellow {
            background-color: #fff9d8;
            color: #766300;
        }

        .activity-result-item .skill-level.level-orange {
            background-color: #fff0da;
            color: #8A5300;
        }

        .activity-result-item .skill-level.level-green {
            background-color: #EEF9F3;
            color: #2C7D50;
        }

    .activity-result-item .api-result-chart {
        margin-top: 30px;
        margin-bottom: 40px;
        height: 100px;
    }

    .activity-result-item ul {
        text-align: left;
        padding-left: 24px;
    }

        .activity-result-item ul li {
            font-size: 14px;
        }

@media (min-width: 1200px) {
    .activity-result-item ul {
        width: 85%;
        margin-left: auto;
        margin-right: auto;
    }
}

@media (max-width: 480px) {
    .activity-result-item h2 {
        font-size: 24px;
    }

    .activity-result-item h3 {
        font-size: 22px;
    }
}

.speaking-bg-color {
    background-color: #517DFF;
}

@keyframes animateBar {
    0% {
        transform: translateX(-100%);
    }

    100% {
        transform: translateX(0);
    }
}

.automated-speaking-result .progress,
.automated-writing-result .progress {
    height: 30px;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.automated-speaking-result .progress,
.automated-writing-result .progress {
    border-radius: 0;
    background-color: #fff;
    box-shadow: none;
    margin-bottom: 15px;
}

.automated-speaking-result .progress-bar,
.automated-writing-result .progress-bar {
    line-height: 30px;
    animation-name: animateBar;
    animation-iteration-count: 1;
    animation-timing-function: ease-in;
    animation-duration: .7s;
    position: relative;
    z-index: 1;
    left: -2px
}

.automated-writing-result .overall-score-ielts .target-score::before {
    display: none;
}

.overall-score-ielts {
    max-width: 600px;
    width: 100%;
    padding-top: 10px;
    margin: 24px auto;
    margin-bottom: 10px;
    overflow: hidden;
}

@media (max-width: 480px) {
    .overall-score-ielts {
        max-width: 300px;
    }

    .automated-speaking-result .progress,
    .automated-writing-result .progress {
        max-width: 300px;
    }
}

.overall-score-ielts .target-score::before {
    content: '';
    display: block;
    position: absolute;
    right: 0;
    top: 50%;
    width: 160px;
    height: 1.5px;
    background: repeating-linear-gradient(90deg, #12326E, #12326E 6px, transparent 6px, transparent 10px);
    background-repeat: no-repeat;
    z-index: -1;
}

.overall-score-ielts .score-body {
    display: flex;
    height: 40px;
    position: relative;
    z-index: 1;
    animation-name: animateBar;
    animation-iteration-count: 1;
    animation-timing-function: ease-in;
    animation-duration: .7s;
}

.overall-score-ielts .score-estimation {
    display: flex;
    background: #62D296;
    border-radius: 4px;
}

.overall-score-ielts .low-variance,
.overall-score-ielts .high-variance {
    display: inline-block;
    height: 100%;
}

.overall-score-ielts .low-variance {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

.overall-score-ielts .estimate-score {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #41BB7A;
    border-radius: 4px;
    height: 100%;
    color: white;
    font-size: 12px;
    line-height: 1;
    text-align: center;
}

.overall-score-ielts .high-variance {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.overall-score-ielts .target-score {
    display: inline-block;
    background: #12326E;
    position: absolute;
    width: 4px;
    top: -5px;
    bottom: -5px;
}

.score-value {
    padding-left: 0;
    list-style-type: none;
    display: flex;
    justify-content: space-between;
    padding: 5px 10px;
    margin-top: 10px;
    border-top: 1px solid #e0e0e0;
}

    .score-value li {
        position: relative;
    }

        .score-value li:before {
            content: '';
            display: block;
            border-left: 1px solid #e0e0e0;
            position: absolute;
            top: -63px;
            left: 9.07px;
            height: 65px;
        }

.score-legend {
    margin-top: 8px;
    text-align: center;
}

    .score-legend span {
        display: inline-block;
        font-size: 12px;
    }

        .score-legend span:before {
            content: '';
            display: inline-block;
            width: 30px;
            border-bottom: 4px solid #12326E;
            position: relative;
            top: -2px;
            margin-right: 8px;
        }

.score-detail-graph {
    padding: 0 !important;
    list-style-type: none;
    display: flex;
    justify-content: space-between;
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
    max-width: 620px;
}

    .score-detail-graph li {
        position: relative;
    }

        .score-detail-graph li:first-child {
            padding-left: 5px;
        }

        .score-detail-graph li:before {
            content: '';
            display: block;
            border-left: 1px solid #e0e0e0;
            position: absolute;
            top: -63px;
            left: 9.07px;
            height: 65px;
        }

        .score-detail-graph li:first-child:before {
            border-left: 1px solid #000;
        }

@media (max-width: 480px) {
    .score-detail-graph {
        max-width: 320px;
    }
}

/* End Region Automated Speaking Result */

/* Region IELTS Guided Short Course*/

#ielts-guided-mock-test-panel .panel-accordion.panel-submodule {
    border-radius: 10px;
    box-shadow: 0px 0px 6px #00000029;
    padding: 0;
    margin-bottom: 10px;
}

#ielts-guided-mock-test-panel .panel-accordion > .panel-heading .fa {
    top: 15px;
}

#ielts-guided-mock-test-panel .panel-accordion .panel-heading .panel-title a[aria-expanded="true"] .fa-plus-square::before {
    content: "";
    transition: all 0.3s ease;
}

#ielts-guided-mock-test-panel .panel-group {
    margin-bottom: 15px;
}

#ielts-guided-mock-test-panel .panel-body {
    box-shadow: none;
    padding: 0 10px;
}

#ielts-guided-mock-test-panel .panel-accordion .panel-body > .panel-card {
    margin-bottom: 0 !important;
}

#ielts-guided-mock-test-panel .panel-task.panel.panel-card.panel-activity {
    margin-bottom: 0 !important;
}

    #ielts-guided-mock-test-panel .panel-task.panel.panel-card.panel-activity.sample-answer {
        padding-left: 30px;
    }

#ielts-guided-mock-test-panel .panel-group .panel-card.panel-activity,
#ielts-guided-mock-test-panel .panel-group .panel-accordion + .panel-accordion {
    border: none;
    margin-top: 0;
}

#ielts-guided-mock-test-panel .panel-accordion .panel-heading {
    padding: 0;
    background: white !important;
}

    #ielts-guided-mock-test-panel .panel-accordion .panel-heading .panel-title > a {
        font-size: 16px;
        font-weight: 600;
        color: #0E2653 !important;
        padding: 10px;
    }

    #ielts-guided-mock-test-panel .panel-accordion .panel-heading .panel-title.group-title > a {
        text-transform: none;
        font-size: 14px;
        color: #333333 !important;
        border-bottom: none;
        padding-left: 10px !important;
        font-weight: 600;
    }

#ielts-guided-mock-test-panel .panel-accordion .panel-group-activity .panel-activity .panel-title {
    display: flex;
    background: #FFFFFF;
}

    #ielts-guided-mock-test-panel .panel-accordion .panel-group-activity .panel-activity .panel-title:hover {
        background: #F5FBFE;
        border-radius: 10px;
    }
    
    #ielts-guided-mock-test-panel .panel-accordion .panel-group-activity .panel-activity .panel-title.active {
        background: #DFF1FC;
        border-radius: 10px;
    }

    #ielts-guided-mock-test-panel .panel-accordion .panel-group-activity .panel-activity .panel-title > a {
        text-transform: none;
        font-size: 14px;
        font-weight: normal;
        color: #333333 !important;
        border-bottom: none;
        padding: 8px 10px;
        max-width: 90%;
    }

#ielts-guided-mock-test-panel .panel-accordion .panel-group-activity .panel-activity .panel-title .fa.fa-check-circle {
    color: #41BB7A;
    position: absolute;
    right: 15px;
    top: 10px;
    font-size: 17px;
    cursor: pointer;
}

#ielts-guided-mock-test-detail .panel-body {
    min-height: 310px;
}

    #ielts-guided-mock-test-detail .panel-body #activity-video-title {
        font-size: 20px;
        font-weight: 600;
        color: #0E2653 !important;
        padding: 0 0 15px 0;
        margin: 0;
    }

/* End Region IELTS Guided Short Course*/

/* Region New Mock Report */

.mocktest-tab-content .minimocktest-detail-panel.completed:has(div.new-mocktest-report) {
    background-color: #fff !important;
}

.new-mocktest-report .mocktest-overall-report {
    text-align: center;
    border-bottom: 1px solid #e0e0e0;
    margin-bottom: 15px;
}

.new-mocktest-report .mocktest-score-list {
    padding-left: 0;
    list-style-type: none;
    display: flex;
    margin-left: -8px;
    margin-right: -8px;
    margin-bottom: 32px;
}

    .new-mocktest-report .mocktest-score-list li {
        width: 20%;
        padding-left: 8px;
        padding-right: 8px;
    }

.new-mocktest-report .mocktest-score-item {
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    text-align: center;
}

    .new-mocktest-report .mocktest-score-item .title {
        background-color: #DFF1FC;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 50px;
        padding: 8px 15px;
        font-size: 16px;
        font-weight: 600;
    }

    .new-mocktest-report .mocktest-score-item .score {
        padding: 10px;
        font-size: 48px;
        font-weight: bold;
        line-height: 1.5;
    }

@media (max-width: 1024px) {
    .new-mocktest-report .mocktest-score-list {
        margin-left: -5px;
        margin-right: -5px;
    }

        .new-mocktest-report .mocktest-score-list li {
            padding-left: 5px;
            padding-right: 5px;
        }

    .new-mocktest-report .mocktest-score-item .title {
        padding-left: 10px;
        padding-right: 10px;
    }

    .new-mocktest-report .mocktest-score-item .score {
        font-size: 36px;
    }
}

.new-mocktest-report .skill-level {
    display: inline-block;
    padding: 10px 25px;
    border-radius: 20px;
    font-weight: 600;
}

    .new-mocktest-report .skill-level.level-red {
        background-color: #FDEDEB;
        color: #D32717;
    }

    .new-mocktest-report .skill-level.level-yellow {
        background-color: #fff9d8;
        color: #766300;
    }

    .new-mocktest-report .skill-level.level-orange {
        background-color: #fff0da;
        color: #8A5300;
    }

    .new-mocktest-report .skill-level.level-green {
        background-color: #EEF9F3;
        color: #2C7D50;
    }

.new-mocktest-report .chart-box {
    max-width: 600px;
    margin: 24px auto;
}

.new-mocktest-report .mocktest-skill-report {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 15px;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    margin-bottom: 15px;
}

    .new-mocktest-report .mocktest-skill-report .score-detail {
        display: flex;
        align-items: flex-start;
        padding-bottom: 15px;
        border-bottom: 1px solid #e0e0e0;
        margin-bottom: 24px;
        width: 100%;
    }

        .new-mocktest-report .mocktest-skill-report .score-detail .mocktest-score-item {
            width: 19%;
            margin-right: 15px;
        }

    .new-mocktest-report .mocktest-skill-report .score-info {
        flex: 1;
        text-align: left;
    }

        .new-mocktest-report .mocktest-skill-report .score-info .title {
            font-size: 16px;
            font-weight: 600;
            margin-bottom: 10px;
        }

        .new-mocktest-report .mocktest-skill-report .score-info p {
            margin-bottom: 15px;
        }

    .new-mocktest-report .mocktest-skill-report .btn-primary {
        align-self: flex-start;
    }

.new-mocktest-report .api-result-chart {
    margin-top: 30px;
    margin-bottom: 40px;
    height: 100px;
}

.new-mocktest-report .panel.panel-accordion .fa-plus-square {
    display: none;
}

/* End Region New Mock Report */


/* START FINANCIAL MODAL STYLE */
#financialupgradeModal .modal-body {
    padding-top: 0;
    padding-bottom: 0;
}

#financialupgradeModal h2 {
    color: #517DFF;
    font-size: 44px;
    font-weight: bold;
    margin-top: 0;
}

#financialupgradeModal h3 {
    color: #0E2653;
    font-size: 28px;
    margin-top: 10px;
}

#financialupgradeModal img {
    width: 70%;
}

.reduced-price-discount {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #0E2653;
    margin-top: 2.5rem;
    margin-bottom: 3.5rem;
}

    .reduced-price-discount .discount-before {
        padding-right: 24px;
    }

        .reduced-price-discount .discount-before .before {
            color: #707070;
            font-size: 16px;
            font-weight: 600;
            text-decoration: line-through;
            margin-bottom: 5px;
        }

        .reduced-price-discount .discount-before .discount {
            background-color: #FFD64B;
            border-radius: 10px;
            padding: 5px 15px;
            font-size: 24px;
            font-weight: bold;
        }

    .reduced-price-discount .price-reduced {
        padding-left: 24px;
        border-left: 1px solid #e0e0e0;
    }

        .reduced-price-discount .price-reduced .after {
            font-size: 44px;
            font-weight: bold;
        }

        .reduced-price-discount .price-reduced .save {
            color: #41BB7A;
            font-size: 16px;
            font-weight: 600;
        }

#financialupgradeModal .upgrade-package-title {
    color: #0E2653;
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 12px;
}

#financialupgradeModal .footer-section {
    margin-top: 2rem;
    margin-bottom: 1rem;
    padding: 0 15px;
    flex-direction: column;
    display: inline-flex;
}

#financialupgradeModal #btnUpgradeWithVoucherCode {
    width: 300px;
    margin-bottom: 10px;
}

.upgrade-package-include {
    padding-left: 0;
    list-style-type: none;
    width: 50%;
    color: #0E2653;
    margin: auto;
}

    .upgrade-package-include li {
        display: flex;
        margin-bottom: 10px;
        text-align: left;
    }

        .upgrade-package-include li span {
            background-color: #41BB7A;
            display: inline-flex;
            justify-content: center;
            align-items: center;
            min-width: 16px;
            width: 16px;
            height: 16px;
            border-radius: 50%;
            color: white;
            font-size: 9px;
            margin-top: 2px;
            margin-right: 10px;
        }

#financialupgradeModal .modal-footer {
    text-align: center;
}

    #financialupgradeModal .modal-footer .btn-primary {
        margin-right: 10px;
    }

@media (max-width: 575.98px) {
    .upgrade-package-include {
        width: 90%;
    }
}

@media (max-width: 479.98px) {
    #financialupgradeModal h2 {
        font-size: 40px;
    }

    #financialupgradeModal h3 {
        font-size: 26px;
    }

    .reduced-price-discount .discount-before {
        padding-right: 15px;
    }

    .reduced-price-discount .price-reduced {
        padding-left: 15px;
    }
}
/* END FINANCIAL MODAL STYLE */


/* FIB Additional Style */

.fib-input.question-container > .form-control {
    border: 1px solid #A8ACAC !important;
}

.fib-input.question-container > .answerBox {
    cursor: not-allowed;
    display: inline;
    border: 1px solid #A8ACAC !important;
    border-radius: 10px;
    padding: 5px 15px;
    height: auto;
    box-shadow: none;
    margin: 5px;
    background-color: #F7C9C5 !important;
    color: #333 !important;
}

/* END FIB Additional Style */

/* TC Additional Style */

.ielts .reading-test-panel .right-panel .table,
.ielts .reading-test-panel .right-panel .table > thead > tr > th,
.ielts .reading-test-panel .right-panel .table > tbody > tr > td {
    border-color: #3c4141 !important;
}

    .ielts .reading-test-panel .right-panel .table > tbody > tr > td,
    .ielts .reading-test-panel .right-panel .table > thead > tr > th {
        padding: 5px !important;
    }

.ielts .reading-test-panel .right-panel .table {
    width: 100% !important;
}

    .ielts .reading-test-panel .right-panel .table .circle-question-palette.question {
        margin-top: 10px;
    }

.align-middle {
    vertical-align: middle!important;
}

.ielts .panel-content-audio.row .panelSectionGroup {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
}

    .ielts .panel-content-audio.row .panelSectionGroup .tickable-table {
        margin-left: 15px;
    }

/* END TC Additional Style */

/* BEGIN FCDD Additional Style */

.ielts .panel-content-audio .ielts-listening .row-panel {
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
}

    .ielts .panel-content-audio .ielts-listening .row-panel .dragdrop-question {
        width: 30%;
        display: flex;
        flex-direction: column;
    }

        .ielts .panel-content-audio .ielts-listening .row-panel .dragdrop-question > .dragdrop-section {
            margin: 5px;
            padding: 5px 10px 5px 10px;
        }

.ielts .panel-content-audio .ielts-listening .bordered-panel {
    border: 1px solid;
}

    .ielts .panel-content-audio .ielts-listening .bordered-panel .dragdrop-question {
        border-left: 1px solid;
    }

/* END FCDD Additional Style */

/* BEGIN MCMA Additional Style */

#ielts-test-container .ielts .panel-content-audio .ielts-listening .question-container .circle-question-palette.mcma {
    margin-top: 0!important;
}

/* END MCMA Additional Style */

/* BEGIN SKill Selection Additional Style */

#skillSelectionModal .modal-body {
    padding-top: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

#skillSelectionModal .header-title {
    color:#fff;
}

#skillSelectionModal .modal-body span {
    font-weight: bold;
    margin-top: 15px;
}

#skillSelectionModal .modal-body ul {
    margin-top: 15px;
    display: flex;
    justify-content: space-around;
    align-items: center;
}

    #skillSelectionModal .modal-body ul li {
        list-style: none;
    }

    #skillSelectionModal .modal-body ul li a {
        text-decoration:none;
    }

/* END SKill Selection Additional Style */

/* BEGIN FCFIB Additional Style */

.answerBox.fcfib {
    position: absolute;
    padding: 5px;
    text-align: center;
}

/* END FCFIB Additional Style */

.onboarding-steps .step-item .custom-form-style {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.scollbar-float .bouncing-arrow {
    display: block;
    line-height: 1;
    text-align: center;
}

    .scollbar-float .bouncing-arrow.scrollend {
        display: none;
        transition: all 0.3s ease-in-out;
    }

    .scollbar-float .bouncing-arrow .fa-angle-down {
        transform: translateY(-5px);
        animation: bouncy .5s infinite ease-in-out alternate;
    }

@keyframes bouncy {
    100% {
        transform: translateY(0);
    }
}

.mmt-instruction .video-container-wrapper.spotlightr {
    margin-bottom: 15px;
}

.sidebar .nav > li > a > i.fa {
    width: 20px;
    margin-right: 10px;
}

.sidebar .nav > li > a > i.fa-1x {
    font-size: 1.3em
}

@media (min-width: 768px) {
    .placement-test.sticky-bottom {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        padding: 20px;
    }
}

.plt-tickable {
    overflow: auto;
}

.placement-test.sticky-bottom .button-handler {
    margin-bottom: 15px;
}

.opacity-0 {
    opacity:0;
}

#placement-test .button-margin {
    margin-top: 10px!important;
    margin-bottom: 0px!important;
}

#IELTS-Academic-IMT .question-palette-section {
    display: inline-flex;
    width: -webkit-fill-available;
    text-align: center;
    align-items: center;
    justify-content: space-between;
    border-radius: 5px;
    margin-left: 5px;
    margin-right: 5px;
    flex-direction: column;
    flex: 1;
}

    #IELTS-Academic-IMT .question-palette-section.inactive {
        cursor:pointer;
    }

    #IELTS-Academic-IMT .question-palette-section.answered {
        background-color: #0e203970;
    }

    #IELTS-Academic-IMT .question-palette-section:hover {
        background-color: #375a89;
    }

    #IELTS-Academic-IMT .question-palette-section > .section-palette-text {
        width: -webkit-fill-available;
        text-align: center;
        font-size: 15pt;
        color: white;
        font-weight: 500;
        cursor: pointer;
        height: -webkit-fill-available;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    #IELTS-Academic-IMT .section-btn .btn {
        min-width: 50px;
    }

        #IELTS-Academic-IMT .question-palette-section > .section-palette-text:hover {
            text-decoration: none;
        }

        #IELTS-Academic-IMT .question-palette-section.inactive > .question-circle-pane {
            display: none;
        }

        #IELTS-Academic-IMT .question-palette-section.inactive > .section-question-info {
            display: inherit;
            margin-bottom: 0;
            font-size: 15pt;
            font-weight: 300;
            color: #ffffff94;
            margin-left: 15px;
            align-items: center;
        }

        #IELTS-Academic-IMT .question-palette-section.inactive {
            display: flex;
            flex-direction: row;
            justify-content: center;
            align-items: center;
        }

        #IELTS-Academic-IMT .question-palette-section.inactive .section-palette-text {
            width: auto;
        }

        #IELTS-Academic-IMT .question-palette-section.active > .section-palette-text,
        #IELTS-Academic-IMT .question-palette-section.active > .section-question-info {
            display: none;
        }

    #IELTS-Academic-IMT .question-palette-pane {
        display: inline-flex;
        width: 87%;
        flex-direction: row;
    justify-content: space-around;
    }

@media (max-width: 1500px) {
    #IELTS-Academic-IMT .question-palette-pane {
        width: 79%;
    }
}

#IELTS-Academic-IMT .panelFooter .panelPalette {
    width: 100%;
}

#IELTS-Academic-IMT .question-palette-pane .circle-question-palette {
    margin-left: 5px;
    margin-right: 5px;
}

#IELTS-Academic-IMT .panelContent .section-btn {
    height: 25px;
    transition: height 0.2s ease-in-out;
}

#IELTS-Academic-IMT .panelContent.collapsibleActive .section-btn {
    height:15px;
}

#IELTS-Academic-IMT .question-palette-section .circle-question-palette.active-question {
    border: none !important;
    box-shadow: 0px 1px 5px 2px rgba(7, 31, 85, 0.76);
    -webkit-box-shadow: 0px 1px 7px 3px rgba(7, 31, 85, 0.76);
    -moz-box-shadow: 0px 1px 5px 2px rgba(7, 31, 85, 0.76);
    background-color: #a3ebe7;
}

#IELTS-Academic-IMT .sentence-text.active-question,
#IELTS-Academic-IMT .selectable-text .form-control.active-question,
#IELTS-Academic-IMT input.active-question {
    border: 2px dashed #565f5f !important;
    box-shadow: 0px 1px 5px 2px rgba(0,0,0,0.76);
    -webkit-box-shadow: 0px 1px 5px 2px rgba(0,0,0,0.76);
    -moz-box-shadow: 0px 1px 5px 2px rgba(0,0,0,0.76);
}

#IELTS-Academic-IMT .circle-question-palette.active-question {
    border: 2px solid #565f5f !important;
    box-shadow: 0px 1px 5px 2px rgba(0,0,0,0.76);
    -webkit-box-shadow: 0px 1px 5px 2px rgba(0,0,0,0.76);
    -moz-box-shadow: 0px 1px 5px 2px rgba(0,0,0,0.76);
}

#IELTS-Academic-IMT .content-panel {
    scroll-behavior: smooth;
}

#IELTS-Academic-IMT .flowchart-container {
    max-height: unset;
}

#IELTS-Academic-IMT .instant-mt .sub-title,
.panelContentReport .sub-title.imt {
    border: 1px solid #c9c3b0;
    box-shadow: 0px 18px 28px 11px rgba(50, 88, 139, 0.05);
    border-radius: 5px;
    padding: 10px;
    background-color: #f7f3e7;
}

#IELTS-Academic-IMT .instant-mt > .sub-title {
    margin-bottom: 5px;
    margin-left: 10px;
    margin-right: 10px;
}

.panelContentReport .sub-title.imt {
    margin-bottom: 5px;
}

#IELTS-Academic-IMT .instant-mt .sub-title p,
.panelContentReport .sub-title.imt p {
    line-height: 1em !important;
}

#IELTS-Academic-IMT .instant-mt .reading-panel.col-sm-6,
#IELTS-Academic-IMT .instant-mt .question-panel.col-sm-6 {
    height: 90%;
}

#IELTS-Academic-IMT .imt-task-card {
    display: flex;
    width: 90%;
    margin: auto;
    justify-content: center;
}

#IELTS-Academic-IMT .section-question-info {
    color: #ffffff;
    font-weight: bold;
    margin-bottom: 3px;
}

#IELTS-Academic-IMT .question-circle-pane {
    margin-top: 4px;
}

#IELTS-Academic-IMT .ielts .panel-audio {
    height: 70px;
}

#IELTS-Academic-IMT .panelContent.panel-content-audio {
    top: 176px !important;
}

#IELTS-Academic-IMT #content-reading .content-panel > :nth-child(2) {
    padding-top: 0 !important;
}

#IELTS-Academic-IMT #content-speaking .content-panel > :nth-child(3) {
    padding-top: 0 !important;
}

#IELTS-Academic-IMT #content-speaking {
    bottom: 50px;
}

#IELTS-Academic-IMT .instant-mt .content-panel .table > thead > tr > th {
    border-bottom: 1px solid #ddd !important;
}

#IELTS-Academic-IMT .test-panel.instant-mt > div {
    transition: height 0.1s linear;
}

#IELTS-Academic-IMT .panelContent {
    bottom: 119px;
}

#IELTS-Academic-IMT .panelContent.collapsibleActive {
    bottom: 43px!important;
}

#IELTS-Academic-IMT .panel.panel-accordion.panelFooter .panel-collapse.collapse.in {
    height: 70px;
}

#IELTS-Academic-IMT .question-palette-pane .question-palette-section {
    height: max-content;
    padding: 5px;
    min-height: 40px;
}

#IELTS-Academic-IMT .question-circle-pane {
    max-height: 52px;
    overflow: auto;
    scrollbar-width: thin;
    scrollbar-color: rgb(34 59 93 / 63%) transparent;
}

    #IELTS-Academic-IMT .question-circle-pane::-webkit-scrollbar,
    #IELTS-Academic-IMT .ielts .flowchart.dragdrop-droppable-word::-webkit-scrollbar,
    new-mocktest-report .flowchart-container .fcd-incorrect > p::-webkit-scrollbar {
        width: 8px;
        height: 8px;
    }

    #IELTS-Academic-IMT .question-circle-pane::-webkit-scrollbar-track,
    #IELTS-Academic-IMT .ielts .flowchart.dragdrop-droppable-word::-webkit-scrollbar-track,
    new-mocktest-report .flowchart-container .fcd-incorrect > p::-webkit-scrollbar-track {
        background: transparent;
    }

    #IELTS-Academic-IMT .question-circle-pane::-webkit-scrollbar-thumb,
    #IELTS-Academic-IMT .ielts .flowchart.dragdrop-droppable-word::-webkit-scrollbar-thumb,
    new-mocktest-report .flowchart-container .fcd-incorrect > p::-webkit-scrollbar-thumb {
        background-color: rgba(0, 0, 0, 0.2);
        border-radius: 4px;
    }

#IELTS-Academic-IMT .ielts .flowchart.dragdrop-droppable-word {
    max-height: 55px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgb(0 0 0 / 21%) transparent;
}

.new-mocktest-report .fcd-correct-answer-tooltip {
    position: relative;
    cursor: pointer;
}

    .new-mocktest-report .fcd-correct-answer-tooltip::after {
        content: "Correct answer: " attr(data-correct-answer);
        position: absolute;
        bottom: -250%; /* Position above the icon */
        left: 50%;
        transform: translateX(-50%);
        background-color: #222;
        color: #fff;
        padding: 5px 10px;
        border-radius: 5px;
        white-space: nowrap;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.2s ease;
        z-index: 1000;
    }

    .new-mocktest-report .fcd-correct-answer-tooltip:hover::after {
        opacity: 1;
    }

.new-mocktest-report .hide-on-review {
    display: none;
}

.new-mocktest-report .flowchart-container .fcd-incorrect > p {
    max-height: 68px;
    overflow-y: scroll;
    overflow-x: hidden;
    margin: 0;
    scrollbar-width: thin;
    scrollbar-color: rgb(0 0 0 / 21%) transparent;
}


#placement-test .question-container {
    margin-bottom: 15px;
}

#placement-test .question-wrapper .section-header .page-header.has-audio {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

    #placement-test .question-wrapper .section-header .page-header.has-audio .e2l-audio-player {
        padding: 3px;
        border-radius: 30px;
        background-color: #ffffff;
    }

#placement-test .wrapper-question .question-list .question-container {
    margin-bottom: 20px;
}

#placement-test .fib-line-h {
    line-height: 2;
}

#placement-test .plt-tickable .tc-table > tbody > tr > td {
    padding: 10px 10px;
}

#placement-test .checkmark {
    background-color: #666;
}

#placement-test .radio.tickable-column label input:checked ~ .checkmark {
    background-color: #31C5CE;
}

/* BEGIN Inline Activity Style */

.inline-activity-iframe {
    width: 100%;
    min-height: calc(100vh - 86px);
    border: none;
}

/* END Inline Activity Style */

#IELTS-Academic-IMT .dragdrop.draggable:hover,
#placement-test .dragdrop.draggable:hover,
.page-main-activity.toefl #dragdrop-question-section .dragdrop.draggable:hover,
.page-main-activity #dragdrop-question-section .dragdrop.draggable:hover {
    background: #aca8a8;
    color: #fff;
}

#IELTS-Academic-IMT .dragdrop.drop-active:not(.dropped) .dragdrop-droppable,
#placement-test .dragdrop.drop-active:not(.dropped) .dragdrop-droppable,
.page-main-activity.toefl #dragdrop-question-section .dragdrop.drop-active:not(.dropped) {
    background-color: #cde1f3;
    box-shadow: 0px 1px 5px 2px rgba(0,0,0,0.76);
    -webkit-box-shadow: 0px 1px 5px 2px rgba(0,0,0,0.76);
    -moz-box-shadow: 0px 1px 5px 2px rgba(0,0,0,0.76);
}

    .page-main-activity #dragdrop-question-section .dragdrop.drop-active:not(.dropped):not(.correct-answer) {
        background-color: #cde1f3;
        box-shadow: 0px 2px 12px 5px rgba(0, 0, 0, 0.76);
        -webkit-box-shadow: 0px 2px 12px 5px rgba(0, 0, 0, 0.76);
        -moz-box-shadow: 0px 2px 12px 5px rgba(0, 0, 0, 0.76);
        padding-top: 0px;
    }

#IELTS-Academic-IMT .dragdrop.drag-over:not(.dropped) .dragdrop-droppable,
#placement-test .dragdrop.drag-over:not(.dropped) .dragdrop-droppable,
.page-main-activity.toefl #dragdrop-question-section .dragdrop.drag-over:not(.dropped),
.page-main-activity #dragdrop-question-section .dragdrop.drop-active.drag-over:not(.correct-answer) .dragdrop-droppable {
    background-color: #ACA8A8 !important;
    box-shadow: -2px 3px 5px 3px rgb(132 128 128) !important;
    -webkit-box-shadow: -2px 3px 5px 3px rgb(132 128 128) !important;
    -moz-box-shadow: -2px 3px 5px 3px rgb(132 128 128) !important;
}

.page-main-activity.toefl #dragdrop-question-section .button-pane {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
}

    .page-main-activity.toefl #dragdrop-question-section .button-pane > button {
        margin-left: 5px;
    }

    @media (max-width: 550px) {
        #placement-test .dragdrop-section > strong {
        display: flex;
        flex-direction: row;
    }

        #placement-test .dragdrop-section > strong .remove-word > i {
            margin-top: 15px;
        }
}

.pagination-wrapper {
    margin-top: 4px;
    padding: 0;
}

.pagination-container {
    display: flex;
    justify-content: space-between;
}

.pagination-wrapper.hide-nav #btn-previous-activity, .pagination-wrapper.hide-nav #btn-next-activity {
    display: none;
}

.arrow-left,
.arrow-right {
    font-size: 14px;
    text-decoration: none !important;
}

.inline-activity-iframe {
    margin-bottom: 6px;
}

.footer-button {
    margin-bottom: 1rem;
}

.iframeOverlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: transparent;
}

.sc-recorder-container {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    text-wrap-mode: nowrap;
}

    .sc-recorder-container .recording-log {
        margin-top: 10px;
    }

    .sc-audio-panel {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        margin-top: 20px;
    }

@media (max-width: 1314px) {
    #dragdrop-question-section .correct-order,
    #dragdrop-question-section .incorrect-order {
        margin-top: 9px;
    }

        #dragdrop-question-section .correct-order:after,
        #dragdrop-question-section .incorrect-order:after {
            margin-left: -6px;
        }
}