body.bg-login {
    background: url(/Content/images/login-bg-white.jpg) center/cover no-repeat;
}

a {
    text-decoration: none;
}

.form-control[readonly]:focus {
    border-color: #ced4da;
    box-shadow: none;
}

.logo img {
    height: 40px;
}

main {
    /*margin-top: 100px;*/
    margin-top: 5rem;
}

.btn-gsign > div {
    width: 100% !important;
    border-radius: 4px;
}

.form-label .req {
    font-style: normal;
    color: red;
    margin-left: 2px;
}

select:required:invalid, select:not(.selected) {
    color: #8e8c84;
}

.bg-transparent {
    background-color: #fffff85F
}

select option {
    color: initial;
}

    select option:disabled {
        color: fff;
        background-color: #c8c8c8;
    }

.privacy-policy-pdf {
    width: 100%;
    height: 300px;
}

.profiler-milestone-item {
    width: 100%;
    border-bottom: 2px solid #3e3f3a;
    text-align: center;
    font-size: 14px;
    padding: 15px 0;
}

    .profiler-milestone-item.current-step {
        border-width: 4px;
    }

.profiler-form-step:not(.current-step) {
    display: none;
}

.datepicker-icon {
    position: absolute;
    top: 1px;
    right: 1px;
    height: 90%;
    text-align: center;
    padding: 0 10px;
    padding-top: 10px;
    background-color: #fff;
    border-radius: 0 0.25rem 0.25rem 0;
}

.datepicker-year:disabled ~ .datepicker-icon,
.datepicker-month-year:disabled ~ .datepicker-icon {
    color: #8e8c84;
    background-color: transparent;
}

.select-element .select-input {
    caret-color: transparent;
    cursor: default;
}

.select-dropdown-holder {
    position: relative;
}

    .select-dropdown-holder.open .select-dropdown {
        opacity: 1;
        display: block;
    }

.select-dropdown {
    position: absolute;
    top: 6px;
    width: 100%;
    display: block;
    background-color: #fff;
    box-shadow: 0 2px 5px 0 rgb(0 0 0 / 16%), 0 2px 10px 0 rgb(0 0 0 / 12%);
    padding: 7px 0 7px 12px;
    height: 120px;
    overflow-y: scroll;
    overflow-x: hidden;
    opacity: 0;
    display: none;
}

.footer-rmg {
    position: fixed;
    left: 10px;
    bottom: 5px;
    right: 10px;
    width: 95%;
    background-color: gray;
    color: white;
    text-align: center; 
}

#vertical-select .select-dropdown,
#account-select .select-dropdown {
    height: 160px;
}

/*#account-select .select-dropdown {
    width: 200px;
}

#vertical-select .select-dropdown {
    width: 340px;
}*/

.milestone-holder {
    /*position: relative;*/
}

    .milestone-holder .milestone {
        /*position: fixed;*/
        width: max-content;
        width: intrinsic;
        width: -moz-max-content;
        width: -webkit-max-content;
    }

.milestone-item {
    text-align: right;
    margin-bottom: 40px;
}

    .milestone-item span {
        display: inline-block;
        vertical-align: middle;
    }

.milestone-label {
    font-size: 12px;
    color: #3e3f3a;
    padding-right: 2px;
}

.milestone-icon {
    position: relative;
    width: 25px;
}

    .milestone-icon i {
        background-color: #ced4da;
        display: block;
        width: 25px;
        height: 25px;
        border-radius: 100%;
        margin: 0 auto;
        position: relative;
        z-index: 1;
    }

.milestone-item:not(:last-child) .milestone-icon::after {
    content: '';
    display: block;
    width: 3px;
    height: 41px;
    background-color: #ced4da;
    position: absolute;
    bottom: -41px;
    left: 11px;
    right: 0;
}

.completed-milestone .milestone-icon i,
.completed-milestone.milestone-item .milestone-icon::after,
.current-milestone .milestone-icon:not(.sub-milestone-icon) i,
.completed-sub-milestone .milestone-icon i,
.current-sub-milestone .milestone-icon i {
    /*background-color: #9fa1a3;*/
    background-color: #7da740;
    border-color: #769e3c;
}

.current-milestone:not(.sub-milestone-holder) .milestone-icon:not(.sub-milestone-icon) i,
.current-sub-milestone .milestone-icon i,
.retake-sub-milestone .milestone-icon i {
    box-shadow: 0 0 0 0.25rem rgb(163 206 102 / 50%);
}

.milestone-item.sub-milestone-holder {
    margin-bottom: 25px;
}

ul.sub-milestone {
    margin-top: 20px;
}

.sub-milestone-icon i {
    width: 15px;
    height: 15px;
}


.sub-milestone-item .milestone-icon::before {
    content: '';
    display: block;
    width: 3px;
    height: 49px;
    position: absolute;
    top: -49px;
    left: 11px;
    right: 0;
}

.milestone-item .completed-sub-milestone .milestone-icon::before,
.milestone-item .current-sub-milestone .milestone-icon::before {
    background-color: #7da740;
}

#assessment-form .card-header {
    background-color: #b6b5af;
}

.assessment-header li {
    padding: 10px;
    border-right: 1px solid #a5a5a5;
    min-width: 60px;
    text-align: center;
    font-size: 20px;
}

    .assessment-header li:hover {
        background-color: #ababab;
    }

    .assessment-header li.current-assessment {
        background-color: #fdfcfb;
    }

.assessment-error-message {
    padding: 5px 10px;
    margin-bottom: 10px;
    border: 2px solid #d9534f;
    border-radius: 4px;
    background-color: #d9534f;
    color: #fefefe;
    display: none;
}

.assessment-questions .question:not(.current-question) {
    display: none;
}

.assessment-score-holder .assessment-score:not(.show-score) {
    display: none;
}

/* Assessment Results */
.assessment-results .card-header {
    padding: 1.5rem;
    border: none;
}

.card.assessment-results p {
    margin: 0;
}

.results li {
    padding: 15px;
    display: flex;
    justify-content: space-between;
    border-bottom: 2px solid #e4e7eb;
}

.result .title, .result .score {
    display: block;
}

.result .title {
    font-size: 20px;
}

.result .score i {
    margin-left: 30px;
    font-style: normal;
    color: #b1b7bd;
}

.result .remarks {
    display: inline-block;
    width: 80px;
    padding: 8px 0;
    text-align: center;
    border-radius: 4px;
}

    .result .remarks.passed {
        background-color: #93c54b;
        color: #335207;
    }

    .result .remarks.failed {
        background-color: #d9534f;
        color: #f7d0cf;
    }

    .result .remarks.bad {
        background-color: #FF3400;
        color: #fff;
    }

    .result .remarks.slow {
        background-color: #FF9300;
        color: #fff;
    }

    .result .remarks.average {
        background-color: #FFC100;
        color: #335207;
    }

    .result .remarks.fluent {
        background-color: #E9FF00;
        color: #335207;
    }

    .result .remarks.fast {
        background-color: #9EE900;
        color: #335207;
    }

    .result .remarks.pro {
        background-color: #008903;
        color: #fff;
    }

.assessment-results .footer {
    padding: 0 1rem 1.5rem;
}

    .assessment-results .footer button {
        margin-right: 15px;
        width: 80px;
        border-radius: 4px;
    }

.select2-container--bootstrap-5 .select2-selection {
    height: 32px;
    padding-right: 36px;
}

.select2-container--bootstrap-5.select2-container--open.select2-container--below .select2-selection {
    border-bottom: 1px solid #86b7fe;
    border-bottom-right-radius: .25rem;
    border-bottom-left-radius: .25rem;
}

.select2-container--bootstrap-5 .select2-selection--multiple .select2-selection__rendered {
    flex-wrap: nowrap;
    overflow: hidden;
}

    .select2-container--bootstrap-5 .select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
        font-size: .9rem;
        padding: 0 .40em;
        border-radius: .20rem;
        white-space: nowrap;
        margin-bottom: 0;
    }

        .select2-container--bootstrap-5 .select2-selection--multiple .select2-selection__rendered .select2-selection__choice .select2-selection__choice__remove {
            width: .25rem;
            height: .25rem;
        }

.select2-container--bootstrap-5 .select2-dropdown {
    top: 5px;
}

.select2-container--bootstrap-5.select2-container--disabled .select2-selection, .select2-container--bootstrap-5.select2-container--disabled.select2-container--focus .select2-selection {
    color: #8e8c84;
    background-color: #f8f5f0;
}

.schedule-interview .card-body {
    position: relative;
}

.interview-calendar .datepicker-inline {
    width: auto;
}

.interview-calendar .datepicker table tr td {
    padding: 10px;
    border: 2px solid #fff;
}

    .interview-calendar .datepicker table tr td.available:not(.disabled),
    .interview-calendar .datepicker table tr td.not-available,
    .interview-calendar .datepicker table tr td.active {
        border-radius: 5px;
        font-weight: bold;
    }

        .interview-calendar .datepicker table tr td.available:not(.disabled):not(.active) {
            background-color: #e5f2e5;
            color: green;
        }

        .interview-calendar .datepicker table tr td.not-available:not(.active) {
            background-color: #fef1f4;
            color: red;
        }

.interview-calendar-holder .label {
    display: inline-block;
    width: 150px;
    padding: .2em .6em;
    font-weight: bold;
    white-space: nowrap;
    border-radius: .25em;
}

    .interview-calendar-holder .label.available {
        background-color: #e5f2e5;
        color: green;
    }

    .interview-calendar-holder .label.not-available {
        background-color: #fef1f4;
        color: red;
    }

#interviewModal {
    position: absolute;
    max-width: 100%;
    max-height: 100%;
}

    #interviewModal .modal-dialog {
        margin-top: 8rem;
    }

    #interviewModal .modal-backdrop {
        z-index: 0;
        background-color: unset;
        -webkit-filter: blur(2px);
        backdrop-filter: blur(2px);
        position: absolute;
        max-width: 100%;
        max-height: 100%;
    }
.modal-header-height {
    height: 45px !important;
}

.text-area-height{
    height: 100px !important;
    resize: none;
}

.btn-modal-width{
    width: 125px !important;
}

.btn-pagination-width {
    width: 40px !important;
}

.btn-rate-width {
    width: 80px !important;
}

.searchbar-width {
    width: 300px !important;
}

.select-type-reports-w {
    width: 250px !important;
}

.td-w-5 {
    width: 5% !important;
}

.td-w-6 {
    width: 6% !important;
}

.td-w-7 {
    width: 7% !important;
}

.td-w-8 {
    width: 8% !important;
}

.td-w-9 {
    width: 9% !important;
}

.td-w-10 {
    width: 10% !important;
}

.td-w-11 {
    width: 11% !important;
}

.td-w-12 {
    width: 12% !important;
}

.td-w-13 {
    width: 13% !important;
}

.td-w-14 {
    width: 14% !important;
}

.td-w-15 {
    width: 15% !important;
}

.td-w-20 {
    width: 20% !important;
}

.td-w-25 {
    width: 25% !important;
}

.td-w-30 {
    width: 30% !important;
}

.td-w-35 {
    width: 35% !important;
}

.td-w-40 {
    width: 40% !important;
}

.td-w-45 {
    width: 45% !important;
}

.td-w-50 {
    width: 50% !important;
}

.td-w-55 {
    width: 55% !important;
}

.td-w-60 {
    width: 60% !important;
}

.td-w-65 {
    width: 65% !important;
}

.td-w-70 {
    width: 70% !important;
}

.td-w-75 {
    width: 75% !important;
}

.td-w-80 {
    width: 80% !important;
}

.td-w-85 {
    width: 85% !important;
}

.td-w-90 {
    width: 90% !important;
}

.td-w-95 {
    width: 95% !important;
}

.td-w-100 {
    width: 100% !important;
}

.border-right-only {
    border-right: 1px solid #dee2e6; /* Adjust the color as needed */
    border-left: none;
}

.border-left-only {
    border-right: none;
    border-left: 1px solid #dee2e6; /* Adjust the color as needed */
}

.w-1 {
    width: 1% !important;
}

.w-2 {
    width: 2% !important;
}

.w-3 {
    width: 3% !important;
}

.w-4 {
    width: 4% !important;
}

.w-5 {
    width: 5% !important;
}

.w-6 {
    width: 6% !important;
}

.w-7 {
    width: 7% !important;
}

.w-8 {
    width: 8% !important;
}

.w-9 {
    width: 9% !important;
}

.w-10 {
    width: 10% !important;
}

.w-11 {
    width: 11% !important;
}

.w-12 {
    width: 12% !important;
}

.w-13 {
    width: 13% !important;
}

.w-14 {
    width: 14% !important;
}

.w-15 {
    width: 15% !important;
}

.w-16 {
    width: 16% !important;
}

.w-17 {
    width: 17% !important;
}

.w-18 {
    width: 18% !important;
}

.w-19 {
    width: 19% !important;
}

.w-20 {
    width: 20% !important;
}

.w-21 {
    width: 21% !important;
}

.w-22 {
    width: 22% !important;
}

.w-23 {
    width: 23% !important;
}

.w-24 {
    width: 24% !important;
}

.w-25 {
    width: 25% !important;
}

.w-26 {
    width: 26% !important;
}

.w-27 {
    width: 27% !important;
}

.w-28 {
    width: 28% !important;
}

.w-29 {
    width: 29% !important;
}

.w-30 {
    width: 30% !important;
}

.w-31 {
    width: 31% !important;
}

.w-32 {
    width: 32% !important;
}

.w-33 {
    width: 33% !important;
}

.w-34 {
    width: 34% !important;
}

.w-35 {
    width: 35% !important;
}

.w-36 {
    width: 36% !important;
}

.w-37 {
    width: 37% !important;
}

.w-38 {
    width: 38% !important;
}

.w-39 {
    width: 39% !important;
}

.w-40 {
    width: 40% !important;
}

.w-41 {
    width: 41% !important;
}

.w-42 {
    width: 42% !important;
}

.w-43 {
    width: 43% !important;
}

.w-44 {
    width: 44% !important;
}

.w-45 {
    width: 45% !important;
}

.w-46 {
    width: 46% !important;
}

.w-47 {
    width: 47% !important;
}

.w-48 {
    width: 48% !important;
}

.w-49 {
    width: 49% !important;
}

.w-50 {
    width: 50% !important;
}

.w-51 {
    width: 51% !important;
}

.w-52 {
    width: 52% !important;
}

.w-53 {
    width: 53% !important;
}

.w-54 {
    width: 54% !important;
}

.w-55 {
    width: 55% !important;
}

.w-56 {
    width: 56% !important;
}

.w-57 {
    width: 57% !important;
}

.w-58 {
    width: 58% !important;
}

.w-59 {
    width: 59% !important;
}

.w-60 {
    width: 60% !important;
}

.w-61 {
    width: 61% !important;
}

.w-62 {
    width: 62% !important;
}

.w-63 {
    width: 63% !important;
}

.w-64 {
    width: 64% !important;
}

.w-65 {
    width: 65% !important;
}

.w-66 {
    width: 66% !important;
}

.w-67 {
    width: 67% !important;
}

.w-68 {
    width: 68% !important;
}

.w-69 {
    width: 69% !important;
}

.w-70 {
    width: 70% !important;
}

.w-71 {
    width: 71% !important;
}

.w-72 {
    width: 72% !important;
}

.w-73 {
    width: 73% !important;
}

.w-74 {
    width: 74% !important;
}

.w-75 {
    width: 75% !important;
}

.w-76 {
    width: 76% !important;
}

.w-77 {
    width: 77% !important;
}

.w-78 {
    width: 78% !important;
}

.w-79 {
    width: 79% !important;
}

.w-80 {
    width: 80% !important;
}

.w-81 {
    width: 81% !important;
}

.w-82 {
    width: 82% !important;
}

.w-83 {
    width: 83% !important;
}

.w-84 {
    width: 84% !important;
}

.w-85 {
    width: 85% !important;
}

.w-86 {
    width: 86% !important;
}

.w-87 {
    width: 87% !important;
}

.w-88 {
    width: 88% !important;
}

.w-89 {
    width: 89% !important;
}

.w-90 {
    width: 90% !important;
}

.w-91 {
    width: 91% !important;
}

.w-92 {
    width: 92% !important;
}

.w-93 {
    width: 93% !important;
}

.w-94 {
    width: 94% !important;
}

.w-95 {
    width: 95% !important;
}

.w-96 {
    width: 96% !important;
}

.w-97 {
    width: 97% !important;
}

.w-98 {
    width: 98% !important;
}

.w-99 {
    width: 99% !important;
}

.w-100 {
    width: 100% !important;
}


@keyframes slideUp {
    from {
        transform: translateY(100%);
        opacity: 0;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.show-banner {
    animation: slideUp 0.5s ease-out;
    display: block !important;
}