/*=== Custom CSS ===*/

:root {
    --val-red-n: #f04141;
    --P100: #275df5;
    --P200: #b0c8ff;
    --P300: #3f3bd0;
    --P400: #423ec9;
    --PH100: #4777fe;
    --S100: #f05537;
    --S200: #ffbfad;
    --SH100: #fc7358;
    --M900: #9dd0ff;
    --N100: #fff;
    --N200: #fff;
    --N300: #f7f7f9;
    --N400: #e7e7f1;
    --N500: #979ec2;
    --N600: #717b9e;
    --N700: #474d6a;
    --N800: #121224;
    --I100: #f04141;
    --I200: #47b749;
    --I300: #fdaa29;
    --I400: #8951ff;
    --A100: #ffedf2;
    --A200: #efedff;
    --A300: #ecf5ff;
    --A400: #fff3dd;
    --A500: #ffedf2;
    --A600: #f8f8fb;
    --D100: #0d1734;
    --D200: #35063e;
    --G100_T: #fff;
    --G100_B: #ffedf2;
    --G200_T: #fff;
    --G200_B: #efedff;
    --G300_T: #fff;
    --G300_B: #edf4ff;
    --G400_T: #fff;
    --G400_B: #fff3dd;
    --V100: #ecf5ff80;
    --box-shadow1: 0px 6px 12px rgba(30, 10, 58, .04);
    --box-shadow2: 0px 6px 25px rgba(30, 10, 58, .08);
    --border: 1px solid #e7e7f1;
    --val-black: #1e223c;
    --br10: 10px;
    --background: #f5f5f5;
    --missingDetailsBg: #fff5f5;
    --profilePerfBg: #ecf5ff;
}

/* ===== Create Account CSS ===== */

.header-link {
    margin-left: auto;
    color: var(--N800);
    font-weight: 500;
    font-size: 1.2rem;
    line-height: 20px;
}

.text-link {
    color: var(--P100);
    font-weight: 700;
    cursor: pointer;
}

.static-list img {
    margin: 0 auto;
    width: 144px;
    height: 144px;
}

.static-list p {
    color: var(--N700);
    font-weight: 500;
    font-size: 1.1rem;
    line-height: 18px;
}

.static-list li {
    list-style: none;
    position: relative;
    padding-left: 20px;
}

.static-list ul {
    padding: 0;
}

.static-list li i {
    color: var(--I200);
    position: absolute;
    left: 0;
    top: 2.5px;
    font-size: 1.1rem;
    width: 14px;
    height: 14px;
}

.googleSignUpWrapper {
    display: flex;
    margin-left: 30px;
    z-index: 2;
    border-left: 1px solid var(--N400);
    height: 224px;
    padding-top: 88px;
}

.orText {
    color: var(--N500);
    height: 33px;
    padding: 6px 8px;
    border-radius: 50%;
    background: #fff;
    margin-left: -16px;
}

.googleSignUpWrapper .continuewith {
    margin-left: 16px;
    color: var(--N800);
    font-size: 1.1rem;
    line-height: 18px;
    font-weight: 700;
}

.googleSignUpWrapper .continuewithbtn {
    margin: 6px 5px 5px 8px;
    position: relative;
    text-align: center;
    border-radius: 60px;
    padding: 9px 14px 11px;
    color: var(--P100);
    border: 1px solid var(--P100);
    height: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    line-height: 20px;
    font-weight: 700;
    font-size: 1.2rem;
}

.g-icon {
    float: left;
    width: 14px;
    height: 14px;
    margin-right: 10px;
}

.mandatory .col-form-label:after {
    content: "*";
    color: #f04141;
}

.at-text {
    margin-top: 5px;
    color: var(--N600);
}

.status-radio p {
    color: var(--N600);
    font-size: 1rem;
    margin: 0;
    font-weight: 400;
}

.short-footer {
    margin: 42px auto 110px;
    width: 100%;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 1rem;
    flex-direction: column;
}

    .short-footer ul {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin: 0;
        justify-content: center;
    }

        .short-footer ul li {
            list-style: none;
            padding-right: 14px;
            border-right: 1px solid var(--N400);
            margin-right: 14px;
        }

            .short-footer ul li:last-child {
                padding: 0;
                margin: 0;
                border: none;
            }

    .short-footer p {
        text-align: center;
        margin-top: 6px;
        color: var(--N600);
    }

.btn.btn-outline.active,
.btn.btn-outline:hover:not(.btn-active) {
    border-color: var(--N800);
}

.btn.btn-bg-red-n {
    border-color: var(--val-red-n);
    background-color: var(--val-red-n);
    color: var(--N100);
}

    .btn.btn-bg-red-n:hover {
        opacity: 0.8;
    }


/*==== Login Page CSS ====*/

.login-wrapper {
    width: 1100px;
    margin: 0 auto;
    padding: 4rem .5rem;
}

    .login-wrapper .card {
        padding: 3rem;
        min-height: 32rem;
        box-shadow: 0 9px 16px 0 rgba(0, 106, 194, .2);
        display: flex;
        width: 100%;
        margin: .5rem 0 1rem;
        background-color: #fff;
        transition: box-shadow .25s;
    }

        .login-wrapper .card ul {
            padding: 0;
            list-style: none;
            margin: 0;
        }

            .login-wrapper .card ul li {
                color: var(--bs-gray-900);
                font-size: 1.1rem;
                font-weight: 500;
                line-height: 24px;
                margin-bottom: 12px;
            }

                .login-wrapper .card ul li i {
                    color: var(--P100);
                    margin-right: 8px;
                    font-size: 16px;
                }

.register-img {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 227px;
    height: 151px;
}

.login-form-box {
    min-height: 35rem !important;
    margin-top: -2rem !important;
    width: 100%;
    padding-left: 60px;
    padding-right: 60px;
    position: relative;
    margin-left: -8px !important;
}

a.forgot-password-link {
    /*float: right;*/
    font-size: 1rem;
    display: flex;
    justify-content: end;
}

.or-sec {
    width: 95%;
    margin: 25px 0 12px .75rem;
    border-top: 1px solid #cecece;
    position: relative;
}

.or-text {
    color: #8993a4;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    padding: 4px;
    top: -13px;
    left: 50%;
    background: #fff;
    margin: 0 0 0 -16px;
    position: absolute;
}


.progress-circle.profile-img-view {
    position: relative;
    width: 138px;
    height: 138px;
    border-radius: 50%;
    background: conic-gradient(green 0deg, green calc(var(--progress) * 1deg), lightgrey calc(var(--progress) * 1deg));
    display: flex;
    justify-content: center;
    align-items: center;
    transform: rotate(180deg);
    padding: 5px;
}

.profile-img-view .inner-circle {
    width: 126px;
    height: 126px;
    border-radius: 50%;
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    transform: rotate(-180deg);
}

    .profile-img-view .inner-circle img {
        width: 130px;
        height: 130px;
        border-radius: 50%;
        border: #fff 5px solid;
    }

.profile-img-view .percentage {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 11px;
    color: black;
    background: #fff;
    padding: 2px 6px;
    border-radius: 12px;
}

.profile-d {
    color: var(--N700);
}

    .profile-d em {
        color: var(--N700);
        font-style: normal;
    }

.edit-icon {
    margin: 0 5px;
    cursor: pointer;
}

    .edit-icon i {
        font-size: 1rem;
    }

    .edit-icon:hover i {
        font-size: 1.15rem;
    }

.p-details {
    margin-bottom: 0px;
    width: 50%;
}

    .p-details p:last-child {
        margin-bottom: 0px;
    }

    .p-details p {
        color: var(--N700);
        font-weight: 500;
        font-size: 1.1rem;
        display: flex;
        align-items: center;
    }

        .p-details p span {
            overflow: hidden;
            white-space: nowrap;
            vertical-align: middle;
            display: inline-block;
            text-overflow: ellipsis;
        }


        .p-details p i {
            margin-right: 12px;
            width: 14px;
            color: var(--N600);
            font-size: 1.5rem;
        }


.pending-actions-div {
    width: 100%;
    padding: 20px;
    margin: 0;
    box-shadow: none;
    min-height: 225px;
    background-color: #FFF2E3;
    border-radius: 10px;
    position: relative;
    cursor: pointer;
}

.pending-actions {
    display: flex;
    margin-bottom: 10px;
    width: 100%;
    justify-content: space-between;
}

    .pending-actions .pend-item-txt {
        margin: auto 20px 0 0;
        color: var(--N700);
        font-size: 1.1rem;
        font-weight: 700;
        line-height: 18px;
        display: flex;
        align-items: center;
    }

        .pending-actions .pend-item-txt i {
            background: var(--N100);
            font-size: 1.5rem;
            padding: 8px;
            margin-right: 10px;
            border-radius: 50%;
        }

.pend-item-per {
    color: var(--I200);
    background: var(--N100);
    padding: 3px;
    width: 47px;
    text-align: center;
    border-radius: 50px;
    margin: auto 0;
    border: 1px solid var(--N300);
}

.quick-links {
    width: 100%;
    padding: 0;
    margin: 0;
    display: block;
}

    .quick-links li {
        list-style: none;
        display: flex;
        padding: 7px 12px;
        margin-bottom: 10px;
        justify-content: space-between;
    }

        .quick-links li span {
            cursor: pointer;
            font-size: 1.13rem;
            font-weight: 500;
            color: var(--N800);
        }

        .quick-links li a {
            font-size: 1.13rem;
        }

        .quick-links li:hover {
            background: var(--N300);
            border-radius: 20px;
        }

            .quick-links li:hover span {
                font-weight: 700
            }

.icon-btn {
    width: 36px;
    height: 36px;
    background: var(--N300);
    border-radius: 50px;
    display: flex;
    cursor: pointer;
}

    .icon-btn i {
        color: var(--P100);
        margin: auto;
        font-size: 14px;
        text-align: center;
    }

.resume-box-cont {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 152px;
    border: 1px solid var(--N300, #F7F7F9);
    background: linear-gradient(rgb(255, 255, 255) 0%, rgb(255, 237, 242) 100%);
    border-radius: 20px;
    font-style: normal;
    overflow: hidden;
}

.img-cont {
    width: 145px;
    height: 150px;
    border-radius: 0 38% 28% 0;
    overflow: hidden;
    background: rgb(255, 237, 242);
    margin-left: 0;
    margin-top: 0;
}

    .img-cont img {
        margin-top: 15px;
        margin-left: 15px;
        -webkit-box-shadow: 0px 6px 25px 0px rgba(30, 10, 58, 0.08);
        box-shadow: 0px 6px 25px 0px rgba(30, 10, 58, 0.08);
        width: 102px;
    }

.resume-box-cont ul {
    padding: 0;
    margin: 0;
}

    .resume-box-cont ul li {
        list-style: none;
        color: var(--N700);
        font-size: 14px;
        font-weight: 500;
        line-height: 18px;
        margin-top: 8px;
    }

.profile-card-score {
    margin: 0 0 0 10px;
    display: inline-block;
    color: var(--I200);
    font-size: 1.1rem;
    font-weight: 500;
    line-height: 18px;
}

.add-text {
    color: var(--P100);
    font-weight: 700;
    cursor: pointer;
    font-size: 1.2rem;
}

.after-add-text {
    white-space: normal;
    word-break: break-word;
    color: var(--N700);
    font-size: 1.1rem;
    font-weight: 500;
    line-height: 18px;
}

.one-line {
    white-space: nowrap;
    vertical-align: middle;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
}

.text-pill {
    white-space: nowrap;
    vertical-align: middle;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 1.1rem;
    font-weight: 500;
    line-height: 18px;
    background: var(--N100);
    padding: 4.5px 12px;
    border: 1px solid var(--N400);
    border-radius: 50px;
    margin: 10px 10px 0 0;
    color: var(--N700);
    max-width: 515px;
}

.default-certification-icon {
    width: 50px;
    height: 50px;
    margin-right: 10px;
    border: 1px solid var(--N400);
}

.add-z-index {
    z-index: 3 !important;
}

/* all */
::-webkit-input-placeholder {
    color: var(--N800);
}

::-moz-placeholder {
    color: var(--N800);
}

/* firefox 19+ */
:-ms-input-placeholder {
    color: var(--N800);
}

/* ie */
input:-moz-placeholder {
    color: var(--N800);
}

.form-check-input:checked[type=radio] + label {
    color: var(--N800);
}

.skills-option {
    border: 1px solid var(--N800);
    background: var(--N400);
    color: var(--N800);
    padding: 7px 12px;
    border-radius: 50px;
    margin: 0 10px 10px 0 !important;
    font-size: 1.1rem;
    font-weight: 700;
    line-height: 18px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-flex;
    max-width: 450px;
    cursor: pointer;
}

.skills-suggested-option {
    color: var(--N700);
    border: 1px solid var(--N500);
    padding: 7px 12px;
    margin: 2px 0 0 5px;
    cursor: pointer;
    font-size: 1.1rem;
    font-weight: 500;
    line-height: 18px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: middle;
    display: inline-flex;
    max-width: 450px;
    background: var(--N100);
    border-radius: 50px;
    margin: 0 10px 10px 0 !important;
}

.jobs-list-header {
    display: flex;
    margin-bottom: 20px;
    justify-content: space-between;
}

.job-list-box {
    position: relative;
    background: var(--N100);
    border-radius: 20px;
    width: 100%;
    padding: 24px 24px 20px;
    box-shadow: 0 6px 12px rgba(30, 10, 58, .04);
    transition: box-shadow .2s linear;
    border: none;
    z-index: 0;
}

    .job-list-box:hover {
        box-shadow: 0 14px 40px rgba(30, 10, 58, .1);
        cursor: pointer;
    }

.job-list-logo {
    height: 50px;
    width: 50px;
    border-radius: 14px;
    position: absolute;
    right: 25px;
    top: 25px;
    border: 1px solid var(--N400);
}

.job-list-box h3 {
    line-height: 22px;
    color: var(--N800);
    max-width: 100%;
    display: block;
    overflow: hidden;
    /* display: inline-block; */
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 100%;
}

.job-list-box a {
    color: var(--N800);
}

.job-list-box i.fa-star {
    color: #ffab00;
}

.w-100-80 {
    width: calc(100% - 80px) !important;
}

.job-list-tags {
    display: flex;
    margin-top: 10px;
}

    .job-list-tags span {
        font-weight: 500;
        font-size: 12px;
        color: var(--N600);
        line-height: 15px;
        padding-left: 16px;
        position: relative;
    }

        .job-list-tags span:before {
            height: 2px;
            width: 2px;
            background: var(--N600);
            top: 7px;
            right: auto;
            left: 8px;
            content: "";
            border: none;
            display: block;
            position: absolute;
        }

        .job-list-tags span:first-child:before {
            display: none;
        }

        .job-list-tags span:first-child {
            padding-left: 0px;
        }

.belly-filter-box {
    background: #ecf5ff;
    border-radius: 10px;
    padding: 26px 24px 20px;
    margin-bottom: 16px;
    display: inline-block;
    width: 100%;
}

.rupee-pill-icon {
    width: 24px;
    height: 24px;
    display: inline-block;
    background: #fff;
    text-align: center;
    border-radius: 50%;
    font-weight: 400;
    line-height: 24px;
}

.belly-filter-box-option {
    padding: 10px 8px;
    cursor: pointer;
    width: 100%;
    display: block;
    margin-right: 12px;
    font-size: 14px;
    margin-top: 16px;
    text-align: center;
    font-weight: 500;
    background: var(--N100);
    border-radius: 10px;
}

    .belly-filter-box-option span,
    .belly-filter-box-option small {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .belly-filter-box-option small {
        color: var(--P100);
        font-weight: 500;
    }

.fl-com {
    background: #ffede5;
}


    .fl-com .belly-filter-box-option span {
        text-overflow: ellipsis;
        white-space: normal;
        height: 40px;
        font-weight: 700;
        word-break: break-word;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        line-height: 18px;
    }

    .fl-com img {
        border-radius: 10px;
        width: 38px;
        height: 38px;
        margin-bottom: 5px;
        margin-top: 5px;
        border: 1px solid var(--N400);
    }

.job-list-feedback {
    background: #fff;
    -webkit-box-shadow: 0px 6px 12px rgba(30, 10, 58, 0.04);
    box-shadow: 0px 6px 12px rgba(30, 10, 58, 0.04);
    border-radius: 20px;
}

    .job-list-feedback .belly-filter-box-option span {
        display: block;
        margin-top: 5px;
        width: 100%;
    }

.left-filter-box {
    width: 100%;
    padding-top: 5px;
    position: relative;
    padding-bottom: 5px;
    border-top: 1px solid var(--N400);
}

.form-check-label em {
    font-style: normal;
    color: var(--N600);
    font-weight: 500;
    margin-left: 5px;
    vertical-align: top;
}

.form-check-input:checked + span {
    color: var(--N800) !important;
    font-weight: 700 !important;
}

.form-check-label span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: calc(100% - 40px);
    display: inline-block;
}

/* Rangebar Slider CSS */

.range-slider {
    position: relative;
    width: 100%;
    height: 15px;
    margin-top: 40px;
}

.range-slider_input {
    width: 100%;
    position: absolute;
    top: 50%;
    z-index: 3;
    transform: translateY(-50%);
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 4px;
    opacity: 0;
    margin: 0;
}

    .range-slider_input::-webkit-slider-thumb {
        -webkit-appearance: none;
        appearance: none;
        width: 30px;
        height: 30px;
        cursor: pointer;
        border-radius: 50%;
        opacity: 0;
    }

    .range-slider_input::-moz-range-thumb {
        width: 30px;
        height: 30px;
        cursor: pointer;
        border-radius: 50%;
        opacity: 0;
    }

.range-slider_thumb {
    position: relative;
    width: 30px;
    height: 30px;
    background: var(--N800);
    border-radius: 50%;
    cursor: pointer;
    bottom: 42px;
    text-align: center;
    color: #fff;
    line-height: 30px;
    font-weight: 600;
    font-size: 12px;
    z-index: 2;
}

    .range-slider_thumb:before {
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background: var(--N800);
        position: absolute;
        bottom: -23px;
        left: 50%;
        content: "";
        display: block;
        transform: translateX(-50%);
    }

    .range-slider_thumb:after {
        content: "";
        position: absolute;
        bottom: -8px;
        left: 50%;
        transform: translateX(-50%);
        width: 0;
        height: 0;
        border-left: 12px solid transparent;
        border-right: 12px solid transparent;
        border-top: 15px solid var(--N800);
    }

.range-slider_line {
    height: 4px;
    width: 100%;
    background-color: var(--N400);
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    position: absolute;
    z-index: 1;
    border-radius: 10px;
}

.range-slider_line-fill {
    position: absolute;
    height: 4px;
    width: 0;
    background-color: var(--N800);
    border-radius: 10px;
}

/* Text Tooltip CSS */

.tooltip-popup-btn {
    color: var(--P100);
    font-weight: 700;
    cursor: pointer;
    position: relative;
}

.tooltip-popup-body {
    width: auto;
    display: none;
    position: absolute;
    z-index: 999;
    bottom: 110%;
    left: 0;
    padding: 20px;
    border: 1px solid var(--N400);
    border-radius: 10px;
    background-color: var(--N100);
    box-shadow: 0 3px 8px 0 rgba(0, 106, 194, .2);
}

    .tooltip-popup-body:after {
        content: '';
        display: block;
        height: 0;
        width: 0;
        position: absolute;
        top: 100%;
        left: 10%;
        border-top: 12px solid #f3f3f3;
        border-left: 12px solid transparent;
        border-right: 12px solid transparent;
        border-bottom: none;
    }

.tooltip-popup-close {
    position: absolute;
    top: 20px;
    right: 20px;
    opacity: 0.5;
    cursor: pointer;
}

    .tooltip-popup-close:hover {
        opacity: 1.0;
    }

.tooltip-search {
    display: block;
    position: relative;
}

    .tooltip-search input {
        display: flex;
        align-items: center;
        width: 210px;
        height: 36px;
        border: 1px solid var(--N400);
        border-radius: 100px;
        padding: 8px 12px 8px 34px;
        margin-top: 4px;
        margin-bottom: 8px;
        font-weight: 500;
        color: var(--N800);
        caret-color: var(--N500);
    }

    .tooltip-search i {
        position: absolute;
        left: 10px;
        top: 9px;
    }

    .tooltip-search input:focus {
        color: var(--bs-gray-700);
        background-color: var(--bs-body-bg);
        border-color: var(--P100);
        outline: 0;
        box-shadow: false, 0 0 0 .25rem rgba(27, 132, 255, .25);
    }

.freshness-select .form-select {
    background-position: right;
}

.bg1 {
    background: linear-gradient(180deg, #e7e7f1 .62%, rgba(231, 231, 241, 0) 95.76%);
}

.cursor-hover-default:hover {
    cursor: default
}

.job-match-score {
    width: 100%;
    border-radius: 10px;
    background-color: #f7f7f9;
    padding: 20px;
    margin-bottom: 20px;
}

.listing-view {
    padding: 0 0 0 15px;
    margin: 0;
    display: block;
    font-weight: 500;
    font-size: 1.1rem;
}

    .listing-view li {
        margin-top: 6px;
    }

.skills-list {
    display: inline-block;
}

    .skills-list a {
        margin-top: 10px;
        display: inline-block;
        margin-right: 10px;
        border: 1px solid var(--N400);
        border-radius: 50px;
        padding: 4px 8px;
        color: var(--N700);
        font-weight: 500;
        font-size: 14px;
        line-height: 18px;
    }

        .skills-list a:hover {
            border: 1px solid var(--P100);
            color: var(--P100);
        }

.share-with {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 1.25rem !important;
    margin-top: 1.25rem !important;
    width: 100%;
    border-top: var(--bs-border-width) var(--bs-border-style) var(--N400) !important;
}

    .share-with a i {
        font-size: 26px;
        margin-right: 10px;
    }

.fa-facebook-square {
    color: #3975ea !important;
}

.fa-twitter-square {
    color: #2d64bc !important;
}

.fa-linkedin {
    color: #4a99e9 !important;
}

.breadcrumb-style a {
    color: var(--N700);
    transition: max-width .1s ease;
}

    .breadcrumb-style a:hover {
        color: var(--P100);
        font-weight: 700;
    }

.bc-hide {
    display: none;
}

.breadcrumb-hide:hover .bc-hide {
    display: inline-block;
}

.apply-status-header {
    background-color: var(--N100);
    border-left: 4px solid var(--I200);
    -webkit-box-shadow: 0 6px 12px rgba(30, 10, 58, .04);
    box-shadow: 0 6px 12px rgba(30, 10, 58, .04);
    border-radius: 10px;
    color: var(--N800) !important;
    width: auto;
    font-size: 1.1rem;
    padding: 26px 20px 20px 20px;
    font-weight: 500 !important;
}

.add-percentage {
    color: var(--I200);
    padding-left: 6px;
    font-size: 12px;
    line-height: 15px;
}

.default-link {
    color: inherit;
}

.sub-header {
    width: 100%;
    background: var(--N100);
    -webkit-box-shadow: 0 6px 12px rgba(30, 10, 58, .04);
    box-shadow: 0 6px 12px rgba(30, 10, 58, .04);
    border: none;
    position: relative;
    z-index: 0;
    padding-bottom: 12px;
    margin-top: -20px;
}

.sticky-sub-header {
    top: 0;
    z-index: 1000;
    position: fixed;
    margin-top: 0;
    padding-top: 12px;
}

.fs-42px {
    font-size: 3.23rem !important;
}

.apply-filters-box {
    min-height: 60px;
    padding: 32px 20px 12px 20px;
    border-right: 1px solid var(--N400);
}

    .apply-filters-box span {
        cursor: pointer;
        display: inline-block;
        margin: 0 8px 8px 0;
        color: var(--N700);
        background: var(--N100);
        border: 1px solid var(--N500);
        border-radius: 50px;
        padding: 5px 12px;
        font-weight: 500;
        font-size: 1.1rem;
        line-height: 18px;
        white-space: nowrap;
    }

        .apply-filters-box span[data-count="0"] {
            pointer-events: none;
            color: var(--N500);
            background: var(--N100);
            border: 1px solid var(--N400);
        }

        .apply-filters-box span.selected {
            background-color: var(--N400);
            color: var(--N800);
            font-weight: 500;
            border: 1px solid var(--N800);
        }

.apply-status {
    color: var(--N700);
    padding: 5px 12px 5px 8px;
    position: relative;
    border-radius: 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--N100);
    border: 1px solid var(--N400);
    font-weight: 500;
    font-size: 0.9rem;
    line-height: 15px;
}

.ja-select {
    background: var(--A300);
}

.statebar {
    position: relative;
    display: inline;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    height: auto;
    width: auto;
    padding-left: 0;
    list-style-type: none;
    margin-top: 16px;
    display: block;
}

    .statebar li,
    .statebar li em {
        display: inline-block;
        position: relative;
    }

    .statebar li {
        width: 162px;
        vertical-align: top;
    }

        .statebar li em.status-icon {
            font-size: 14px;
            color: var(--I200);
            background: var(--N100);
            line-height: 15px;
            border-radius: 50%;
            position: relative;
            top: -1px;
            z-index: 1;
        }

        .statebar li div {
            margin-top: 16px;
            margin-bottom: 10px;
        }

        .statebar li .statusLabel {
            display: inline-block;
            max-width: 162px;
            color: var(--N800);
            font-weight: 700;
            font-size: 14px;
            line-height: 18px;
        }

        .statebar li .statusLabelDate {
            display: inline-block;
            max-width: 162px;
            color: var(--N600);
            margin-top: 4px;
            white-space: normal;
            font-weight: 500;
            font-size: 12px;
            line-height: 15px;
        }

        .statebar li:before {
            content: "";
            position: absolute;
            top: 7px;
            left: -162px;
            width: 162px;
            height: 1px;
            border-top: 3px solid var(--I200);
            z-index: 0;
            margin-left: 5px;
        }

        .statebar li:first-child:before {
            display: none;
        }

        .statebar li.active-circle .icon {
            background: var(--N100);
        }



        .statebar li.status_awaiting:before {
            left: -155px;
            width: 155px;
            border-color: var(--N400);
        }

        .statebar li.status_awaiting em {
            width: 12px;
            height: 12px;
            border-radius: 50%;
            background: var(--N400);
            position: relative;
            top: 0px;
        }

.recruiter-activity h3 {
    line-height: 22px;
    color: var(--N800);
    max-width: 100%;
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 100%;
}

.recruiter-activity-count {
    border: 1px solid var(--N400);
    background: var(--N100);
    padding: 20px;
    margin-top: 5px;
    display: inline-flex;
    border-radius: 10px;
}


.company-list-slider {
    background-color: var(--N400, #E7E7F1);
    display: inline-block;
    position: relative;
    width: 100%;
    border-radius: 16px;
    background-size: 100%;
    padding: 25px 0;
    box-sizing: border-box;
}



.slider-box {
    border: 1px solid rgba(223, 226, 255, 0.5);
    border-radius: 16px;
    background: white;
    padding: 20px 24px;
    box-sizing: border-box;
    cursor: pointer;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
    height: 100%;
}

.company-list-slider .tns-item:hover {
    box-shadow: 0px 14px 40px rgba(30, 10, 58, 0.1);
}

.slider-box h3 {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 100%;
    line-height: 20px;
    word-break: break-word;
    font-weight: 700;
    font-size: 18px;
    height: 22px;
    color: var(--N800, #121224);
}

.slider-box-company {
    max-width: calc(100% - 18px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}


.slider-btn.btn-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    line-height: 1;
    border-radius: 100%;
    border: 1px solid #E7E7F1 !important;
    width: 32px;
    height: 32px;
    background-size: 6px 12px;
    background-color: #ffffff;
}

    .slider-btn.btn-icon i {
        padding-right: 0;
        line-height: 22px;
        font-size: 1.5rem !important;
    }

.list-scroll {
    max-height: 140px;
    overflow: auto;
}

::-webkit-scrollbar {
    width: 4px !important;
}

::-webkit-scrollbar-thumb {
    background-color: #eee;
    border-radius: 25px;
}

.company-list-box {
    padding: 20px 16px 20px 90px;
    width: 100%;
    display: flex;
    border-radius: 16px;
    box-shadow: 0 2px 20px var(--Ev100, rgba(30, 10, 58, .04));
    background-color: var(--N200);
    cursor: pointer;
    position: relative;
}

    .company-list-box a {
        color: var(--N800);
    }

    .company-list-box i.fa-star {
        color: #ffab00;
    }

.company-list-logo {
    height: 60px;
    width: 60px;
    border-radius: 14px;
    position: absolute;
    left: 15px;
    top: 15px;
    border: 1px solid var(--N400);
}

.seperator-ver {
    margin: 0 6px;
    width: 1px;
    height: 10px;
    border: 1px solid var(--N400);
    border-radius: 1px;
    display: inline-block;
    background: var(--N400);
}

.company-list-tags {
    margin-top: 8px;
    max-height: 20px;
    overflow: hidden;
}

    .company-list-tags span {
        padding: 2px 6px;
        border: 1px solid var(--N400);
        border-radius: 50px;
        font-weight: 500;
        font-size: 11px;
        line-height: 14px;
        color: var(--N600);
        margin-bottom: 5px;
        display: inline-block;
    }

.right-arrow-list {
    position: absolute;
    right: 16px;
    top: 40%;
    bottom: 45px;
    margin: auto;
}


    .right-arrow-list i {
        color: var(--N700);
    }

.section-footer-tabs {
    margin-top: 48px !important;
    margin-bottom: unset !important;
    border: 1px solid var(--N400);
    border-radius: 10px;
    padding: 24px;
    background-color: var(--N200);
    width: 100%;
}

    .section-footer-tabs .nav.nav-pills.nav-pills-custom .nav-link.active .nav-text {
        font-weight: 700 !important;
    }

.listing-in-three {
    padding: 0;
    margin: 0;
}

    .listing-in-three li {
        width: 33%;
        display: inline-block;
        padding: 0;
        margin: 0;
    }

        .listing-in-three li a {
            font-weight: 500 !important;
            font-size: 12px !important;
            line-height: 16px !important;
            color: var(--N700) !important;
            padding-bottom: unset;
            margin-bottom: 5px;
            padding-left: unset;
            align-items: center;
            display: flex;
        }

            .listing-in-three li a i {
                font-size: 5px;
                color: var(--N700);
                margin-right: 10px;
            }

.company-details-page-header {
    position: relative;
    z-index: 1;
    width: 100%;
    min-height: 104px;
    background: rgba(239, 237, 255, .8);
}

.claim-btn {
    color: var(--N600);
    font-size: 1rem;
    position: absolute;
    top: -30px;
    right: 0;
    z-index: 6;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    letter-spacing: -.2px;
    line-height: 22px;
}

    .claim-btn a {
        margin-left: 5px;
        color: var(--P100);
        font-size: 1.1rem;
        line-height: 18px;
        font-weight: 700;
        cursor: pointer;
    }

.company-photo-wrapper {
    position: absolute;
    height: 160px;
    width: 160px;
    display: block;
    overflow: hidden;
    border: 2px solid var(--N400);
    border-radius: 26px;
    z-index: 1;
    top: -50px;
    left: 0px;
}

.company-details-top {
    position: relative;
    width: 100%;
    display: block;
    min-height: 120px;
    padding-left: 180px;
    padding-top: 5px;
}

    .company-details-top h1 {
        font-weight: 900;
        font-size: 2rem;
        display: flex;
        align-items: center;
    }

        .company-details-top h1 a {
            display: flex;
            font-size: 1.1rem;
            color: var(--N600);
            margin-left: 12px;
            margin-top: 5px;
            align-items: center;
        }

            .company-details-top h1 a i.fa-star {
                color: var(--I300);
                margin-right: 5px;
            }

.company-tags {
    padding-top: 5px;
    max-height: 77px;
    overflow: hidden;
}

    .company-tags span {
        display: inline-block;
        color: var(--N800);
        padding: 5px 8px;
        border: 1px solid var(--N400);
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        border-radius: 50px;
        margin-bottom: 8px;
        margin-right: 5px;
        font-weight: 500;
    }

.follow-button-dpage {
    position: absolute;
    right: 0;
    top: 21px;
}

.jobs-hiring {
    border: 1px solid #fff3dd;
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), color-stop(96.87%, #fff3dd));
    background: linear-gradient(180deg, #fff, #fff3dd 96.87%);
    border-radius: 20px;
    display: inline-block;
    position: relative;
    width: 100%;
    background-size: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 24px 0;
}

.resume-photo {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 5px;
}

.photo-size {
    width: 60px;
    height: 60px;
    min-width: 60px;
    min-height: 60px;
}

    .photo-size img {
        width: 100%;
        height: 100%;
        max-width: 100%;
        max-height: 100%;
    }

.ai-heading-label {
    border-radius: 12px;
    border: 1px solid #efedff;
    padding: 4px 10px;
    color: #8951ff;
    font-size: 11px;
    font-weight: 700;
    line-height: 13px;
    margin-left: 4px;
    display: inline-flex;
    align-items: center;
}

.generate-with-ai {
    color: #275df5;
    cursor: pointer;
    font-size: 14px;
    font-weight: 700;
    line-height: 18px;
}

.resume-action-btns {
    display: flex;
    justify-content: space-between;
    margin-bottom: 1.5rem;
}


.add-preview-z {
    z-index: 3 !important;
    opacity: 1 !important;
    background-color: #fff !important;
}

.add-z-9999 {
    z-index: 9999 !important;
}

.resume-preview {
    height: calc(100vh - 180px);
    max-height: 568px;
    position: relative;
}

.resume1-box {
    box-shadow: rgba(30, 10, 58, 0.08) 0px 6px 25px 0px;
    width: 100%;
    background: var(--N100);
    border-radius: 20px;
    padding: 56px 26px;
}

.short {
    transform: scale(.5);
    width: 200.1%;
    overflow-y: auto;
    height: 200.1%;
    transform-origin: 0 0;
}

.vertical-top-line {
    width: 2px;
    display: block;
    height: 120px;
    background: #000;
    margin-left: 11px;
}

.vertical-bottom-line {
    width: 2px;
    display: block;
    height: 54px;
    background: #000;
    margin-left: 11px;
    margin-bottom: 50px;
}

.r-personal-d {
    width: 100%;
}

    .r-personal-d td {
        padding: 5px;
        font-weight: 600;
        font-size: 1.2rem;
    }

.horizontal-separator {
    width: 100%;
    display: block;
    height: 14px;
    background: var(--bs-primary);
}

.left-border-5px {
    border-left: 5px solid var(--bs-primary);
    padding-left: 10px;
}

.resume-preview:hover .expand-show {
    display: flex;
}

.expand-show {
    width: 40px;
    height: 40px;
    display: none;
    background: #0000008a;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 9;
    margin: auto;
}

    .expand-show i {
        color: #fff;
        font-size: 1.3rem;
    }

.hs-color-block {
    width: 106px;
    display: block;
    height: 159px;
    background: #5c7593;
}

.r-2-color {
    color: #5c7593
}


.resume2-box {
    box-shadow: rgba(30, 10, 58, 0.08) 0px 6px 25px 0px;
    width: 100%;
    background: var(--N100);
    border-radius: 20px;
    padding: 56px 26px;
}

.work-exp-in-resume {
    background-color: #eaf4ff;
    padding: 50px 40px 20px 44%;
    float: left;
    width: 100%;
}

.edu-in-resume {
    background-color: #fff;
    padding: 30px 40px 20px 44%;
    float: left;
    width: 100%;
}

.resume-left {
    background: #5c7593;
    color: #fff;
    position: absolute;
    left: 50px;
    top: 50px;
}

.float-right {
    float: right;
}

.search-appe-select .select2-selection__rendered {
    color: var(--P100) !important;
    font-weight: 700;
}

.recruiter-actions {
    width: 100%;
    display: block;
}

    .recruiter-actions span {
        margin-right: 10px;
        margin-bottom: 10px;
        border: 1px solid var(--N500);
        display: inline-block;
        padding: 7px 12px;
        cursor: pointer;
        border-radius: 50px;
        height: 30px;
        font-size: 1.1rem;
        display: inline-block;
        font-weight: 500;
        line-height: 14px;
        color: var(--N700);
    }

        .recruiter-actions span.active {
            background-color: var(--N400);
            border: 1px solid var(--N800);
            color: var(--N800);
            font-weight: 700;
        }

.recruiters-list-box {
    border: 1px solid var(--N400);
    border-radius: 16px;
    width: 100%;
    padding: 20px 20px 21px;
}

.recruiter-info-img {
    display: inline-block;
    height: 36px;
    width: 36px;
    border-radius: 50%;
    position: relative;
    border: 1px solid #e2e2e2;
}

.recruiter-rcomp-img {
    display: inline-block;
    height: 36px;
    width: 36px;
    border-radius: 6px !important;
    border: 1px solid #e2e2e2;
    margin-left: -10px;
}

.recruiters-des {
    font-size: 1.1rem;
    line-height: 18px;
    font-weight: 500;
    color: var(--N700);
    white-space: nowrap;
    overflow: hidden;
    display: block;
    text-overflow: ellipsis;
}

.recruiters-location {
    min-height: 17px;
    font-size: 1.1rem;
    line-height: 18px;
    font-weight: 500;
    color: var(--N600);
}

.recruiter-domain {
    margin-top: 34px;
    min-height: 17px;
    font-size: .9rem;
    line-height: 15px;
    font-weight: 500;
    color: var(--N600);
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ld-icons {
    height: 50px;
    width: 50px;
    border-radius: 50%;
    padding: 13px;
    background: var(--N300);
    cursor: pointer;
}

    .ld-icons i {
        font-size: 2rem;
    }


.improve-list p {
    color: var(--N700);
    font-weight: 500;
    font-size: 1.1rem;
    line-height: 18px;
    margin-bottom: 4px;
}

.improve-list li {
    list-style: none;
    position: relative;
    padding-left: 30px;
    margin-top: 20px;
}

.improve-list {
    padding: 0;
}

    .improve-list li i {
        color: var(--I200);
        position: absolute;
        left: 0;
        top: 3.5px;
        font-size: 1.1rem;
        width: 14px;
        height: 14px;
    }

.improve-box {
    background: var(--N300);
    border-radius: 10px;
    margin-top: 20px;
    min-height: 68px;
    padding: 16px;
    color: var(--N800);
    font-weight: 500 !important;
    font-size: 1.05rem;
}

.right-0 {
    right: 0;
}


.performance-bar {
    height: 4px;
    --bs-progress-bg: var(--bs-gray-200);
}

    .performance-bar .progress-bar {
        background-color: var(--N800);
        border-radius: 4px;
    }

.bg2 {
    background: linear-gradient(0deg, hsla(0, 0%, 100%, 0), #efedff);
    background-size: 100% 217px;
    background-repeat: no-repeat;
}


.ip-box {
    background: linear-gradient(180deg, #fff, #efedff) !important;
    border: 1px solid var(--A200);
    border-radius: 20px;
    color: var(--N800);
    position: relative;
    padding: 20px 55px 20px 20px;
    width: 100%;
}

    .ip-box ul {
        margin: 0;
    }

        .ip-box ul li {
            margin-bottom: 5px;
        }

            .ip-box ul li:;

            :last-child {
                margin-bottom: 0px;
            }

    .ip-box p {
        margin-bottom: 0;
    }

    .ip-box img {
        width: 42px;
        height: auto;
        position: absolute;
        top: 12px;
        right: 8px;
    }

.topics-data-question-slider {
    font-family: var(--font-family);
    padding: 24px 0 10px;
    background: var(--A200);
    border-radius: 20px;
    border: 1px solid #e3e3ff;
    margin: 30px auto;
}

.purple-lock {
    width: 28px;
    height: 28px;
    position: absolute;
    top: -8px;
    right: 12px;
}

.question-filters-box {
    margin-bottom: 20px;
}

    .question-filters-box span {
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        margin: 0 8px 8px 0;
        border-radius: 50px;
        padding: 5px 12px;
        font-weight: 500;
        font-size: 1.1rem;
        line-height: 18px;
        white-space: nowrap;
        color: var(--N700);
        height: 32px;
        background: var(--N100);
        border: 1px solid var(--N500);
    }

        .question-filters-box span.selected {
            background-color: var(--N400);
            color: var(--N800);
            font-weight: 700;
            border: 1px solid var(--N800);
        }


.qa {
    width: 100%;
    position: relative;
    display: block;
    margin-bottom: 15px;
    padding-left: 25px;
}

    .qa em {
        font-style: normal;
        font-weight: 700;
        font-size: 1rem;
        line-height: 15px;
        color: var(--N500);
        position: absolute;
        left: 0;
        top: 2px;
    }

    .qa span {
        font-weight: 700;
        font-size: 1.1rem;
        line-height: 18px;
        color: var(--N800);
    }

.test-pre {
    border-radius: 50px;
    color: var(--N700);
    border: 1px solid var(--N400);
    background: var(--N300);
    padding: 6px 8px;
    font-weight: 500;
    margin-bottom: 20px;
    display: inline-block;
}

.verify {
    color: var(--I200) !important;
    width: 18px !important;
    margin-left: 5px;
}

.home-header {
    padding: 70px 0 39px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.home-title {
    font-weight: 900;
    font-size: 40px;
    line-height: 54px;
    color: var(--N800);
    margin-bottom: 10px;
}

.home-title-line {
    font-weight: 500;
    font-size: 20px;
    line-height: 23px;
    color: var(--N800);
}

.home-search {
    display: flex;
    align-items: center;
    padding: 16px 20px;
    background: #fff;
    box-sizing: border-box;
    box-shadow: 0 25px 60px rgba(113, 106, 147, .2);
    border-radius: 40px;
    max-width: 990px;
    margin: auto;
    margin-bottom: 65px;
}

    .home-search .form-control,
    .home-search .form-select {
        font-size: 18px !important;
        padding: 0;
        margin: 0;
    }

    .home-search button {
        padding: 10px 35px;
        font-size: 16px;
    }

.trending-types {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 16px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 28px;
}

    .trending-types a {
        width: auto;
        height: 70px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        background: #FFFFFF;
        border: 1px solid #E7E7F1;
        -webkit-box-shadow: 0px 6px 12px var(--Ev100, rgba(30, 10, 58, 0.04));
        box-shadow: 0px 6px 12px var(--Ev100, rgba(30, 10, 58, 0.04));
        border-radius: 10px;
        padding: 16px 26px 16px 16px;
        margin-right: 16px;
    }

        .trending-types a img {
            min-width: 38px;
            max-width: 38px;
            height: 38px;
            border-radius: 50%;
            margin-right: 12px;
            overflow: hidden;
        }

        .trending-types a span {
            font-weight: 700;
            font-size: 16px;
            line-height: 20px;
            color: var(--N800);
            margin-right: 6px;
            text-overflow: ellipsis;
            white-space: nowrap;
            overflow: hidden;
            max-width: 95px;
        }

        .trending-types a i {
        }
































































/* ===== Candidate Profile CSS ===== */

.right-shadow {
    box-shadow: 1px 0 0 #e7e7f1;
}

.sup-count {
    right: 0px;
    top: 5px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -ms-flex-item-align: center;
    align-items: center;
    align-self: center;
    background-color: var(--val-red-n);
    border: 1px solid #fff;
    border-radius: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 11px;
    font-style: normal;
    font-weight: 700;
    height: 16px;
    justify-content: center;
    line-height: 14px;
    margin-top: -4px;
    position: absolute;
    width: 16px;
}

.badge-red-c {
    background: #fff;
    border: 1px solid #ffedf2;
    border-radius: 12px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: var(--val-red-n);
    font-size: 11px;
    font-weight: 700;
    height: 24px;
    line-height: 12px;
    margin-left: 10px;
    max-width: 100px;
    overflow: hidden;
    padding: 5px 10px;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.job-search-h {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #fff;
    background-color: var(--N100, #fff);
    border: 1px solid #e7e7f1;
    border: 1px solid var(--N400, #e7e7f1);
    border-radius: 40px;
    -webkit-box-shadow: 0 6px 12px rgba(30, 10, 58, .04);
    box-shadow: 0 6px 12px rgba(30, 10, 58, .04);
    -webkit-box-shadow: var(--box-shadow1, 0 6px 12px rgba(30, 10, 58, .04));
    box-shadow: var(--box-shadow1, 0 6px 12px rgba(30, 10, 58, .04));
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    cursor: pointer;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: 40px;
    overflow: hidden;
    -webkit-transition-delay: .1s;
    transition-delay: .1s;
    -webkit-transition-duration: .25s;
    transition-duration: .25s;
    -webkit-transition-property: right, top, width, height, -webkit-transform;
    transition-property: right, top, width, height, -webkit-transform;
    transition-property: transform, right, top, width, height;
    transition-property: transform, right, top, width, height, -webkit-transform;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 228px;
}

.h-search-placeholder {
    color: #717b9e;
    color: var(--N600, #717b9e);
    font-size: 14px;
    font-weight: 500;
    line-height: 18px;
    max-width: 162px;
    opacity: 1;
    overflow: hidden;
    padding: 11px 8px 11px 16px;
    position: absolute;
    text-overflow: ellipsis;
    -webkit-transition-delay: .1s;
    transition-delay: .1s;
    -webkit-transition-duration: .1s;
    transition-duration: .1s;
    -webkit-transition-property: opacity;
    transition-property: opacity;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    white-space: nowrap;
}

.job-search-h-icon {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: #275df5;
    background: var(--P100, #275df5);
    border: none;
    border-radius: 50%;
    color: #fff;
    color: var(--N100, #fff);
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 16px;
    height: 28px;
    margin-left: auto;
    margin-right: 6px;
    min-width: 28px;
    overflow: hidden;
    padding: 0;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transition-duration: .15s;
    transition-duration: .15s;
    -webkit-transition-property: min-width, width, height, margin, border-radius;
    transition-property: min-width, width, height, margin, border-radius;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    width: 28px;
    justify-content: center;
}

    .job-search-h-icon i {
        color: var(--N100);
    }

.hover-bg:hover {
    background-color: var(--N300);
}

.user-drawer-icon {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: #fff;
    background: var(--N100, #fff);
    border: 1px solid #e7e7f1;
    border: 1px solid var(--N400, #e7e7f1);
    border-radius: 30px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 42px;
    width: 86px;
    justify-content: center;
}

#kt_drawer_user {
    border-radius: 20px 0 0 20px;
}

#kt_drawer_user_close {
    position: absolute;
    right: 30px;
    top: 10px;
}

.symbol.symbol-70px > img {
    width: 70px;
    height: 70px;
}

.hr-line {
    background: #e7e7f1;
    background: var(--N400, #e7e7f1);
    border: none;
    height: 1px;
    margin-bottom: 20px;
    margin-top: 20px;
    opacity: 1;
}

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

    .performance-wrapper div {
        color: var(--N800, #121224);
        font-size: 1.1rem;
        font-style: normal;
        font-weight: 700;
        line-height: 20px;
    }

    .performance-wrapper span {
        color: var(--N500, #979ec2);
        font-size: 12px;
        font-style: normal;
        font-weight: 500;
        line-height: 15px;
    }

.performance {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: rgba(236, 245, 255, .502);
    background: var(--v100, rgba(236, 245, 255, .502));
    border-radius: 10px;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    -webkit-box-sizing: initial;
    box-sizing: initial;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 111px;
    justify-content: space-between;
    margin-top: 16px;
    padding-left: 10px;
    padding-right: 10px;
    width: 100%;
}

.perf-card-sa {
    border-right: 1px solid #e7e7f1;
    border-right: 1px solid var(--N400, #e7e7f1);
    padding-right: 0px;
}

.perf-card {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 50%;
}

.perf-card-count {
    color: #121224;
    color: var(--N800, #121224);
    font-size: 24px;
    font-weight: 700;
    line-height: 32px;
}

.perf-card-label {
    color: #121224;
    color: var(--N800, #121224);
    font-size: 14px;
    font-weight: 500;
    line-height: 18px;
    margin-top: 6px;
}

.perf-card-view {
    color: #275df5;
    color: var(--P100, #275df5);
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
    line-height: 15px;
    margin-top: 8px;
}

.user-menu-link {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #121224;
    color: var(--N800, #121224);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 18px;
    text-decoration: none;
    width: 100%;
    margin-bottom: 0px;
    margin-top: 0px;
    min-height: 36px;
}

    .user-menu-link .menu-icon {
        display: flex;
        align-items: center;
    }

        .user-menu-link .menu-icon i {
            color: var(--N600, #717b9e);
        }

#kt_app_footer {
    padding: 60px 0;
    background-color: var(--bs-app-header-minimize-bg-color);
}

.get-social {
    display: block;
    color: var(--N800);
    padding: 38px 0 12px;
}

.footer-link li {
    line-height: 18px;
    list-style: none;
    padding-top: 16px;
}

    .footer-link li a {
        color: var(--N800, #121224);
        font-size: 1.1rem;
        font-weight: 500;
        line-height: 18px;
        text-decoration: none;
        -webkit-transition: color .25s ease;
        transition: color .25s ease;
    }

        .footer-link li a:hover {
            color: var(--P100);
            cursor: pointer;
        }

.app-store {
    background: var(--N100);
    border: 1px solid var(--N400);
    border-radius: 20px;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    height: 102px;
    margin-left: 20px;
    padding: 24px;
    position: relative;
    z-index: 0;
    max-width: 315px;
}

.app-store-title {
    font-size: 16px;
    font-weight: 700;
    line-height: 20px;
}

.app-store-description {
    color: var(--N700);
    font-size: 13px;
    font-size: 12px;
    font-weight: 500;
    line-height: 15px;
    margin-top: 5px;
}

.app-store-cont {
    display: flex;
    padding-top: 20px;
}

.footer-separator {
    background: var(--N400);
    height: 1px;
    margin: 40px auto;
    opacity: .8;
    width: 100%;
}

.footer-carousel-label {
    color: var(--N600);
    font-size: 1.1rem;
    font-weight: 500;
    line-height: 18px;
    padding-top: 0px;
    margin: 0;
}

.copy-text {
    color: var(--N600);
}

.footer-slider .tns-outer {
    margin: 0 0rem !important;
}

.progress-circle {
    position: relative;
    width: 66px;
    height: 66px;
    border-radius: 50%;
    background: conic-gradient(green 0deg, green calc(var(--progress) * 1deg), lightgrey calc(var(--progress) * 1deg));
    display: flex;
    justify-content: center;
    align-items: center;
    transform: rotate(180deg);
    padding: 5px;
}

.inner-circle {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    transform: rotate(-180deg);
}

    .inner-circle img {
        width: 62px;
        height: 62px;
        border-radius: 50%;
        border: #fff 5px solid;
    }

.percentage {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 11px;
    color: black;
    background: #fff;
    padding: 2px 6px;
    border-radius: 12px;
}

.profile-perf-wrapper {
    margin-top: 0px;
    padding: 12px 14px 12px;
    border-radius: 8px;
    background: #ecf5ff;
}

    .profile-perf-wrapper .title {
        line-height: 22px;
        font-weight: 700;
        font-size: 1.24rem;
        margin-bottom: 10px;
        position: relative;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .profile-perf-wrapper .profile-perf-content {
        display: flex;
        padding: 0;
    }

        .profile-perf-wrapper .profile-perf-content div {
            font-size: 1rem;
            line-height: 12px;
            font-weight: 500;
            margin-bottom: 6px;
            padding-right: 10px;
        }

        .profile-perf-wrapper .profile-perf-content > div.searchAppWrapper {
            border-right: 1px solid var(--N400);
            width: 50%;
            margin-bottom: 0;
        }

        .profile-perf-wrapper .profile-perf-content > div.recActionsWrapper {
            padding-left: 15px;
            margin-bottom: 0;
        }

        .profile-perf-wrapper .profile-perf-content > div .count {
            font-size: 1.2rem;
            line-height: 22px;
            margin-right: 10px;
            color: var(--bs-primary);
        }

        .profile-perf-wrapper .profile-perf-content > div .countWrapper {
            cursor: pointer;
            display: flex;
            align-items: center;
        }

.side-ul {
    margin-top: 15px;
    padding-top: 10px;
    border-top: 1px solid var(--N300);
}

    .side-ul li {
        margin-top: 8px;
        padding: 6px 0 6px 22px;
        display: flex;
        align-items: center;
        cursor: pointer;
    }

        .side-ul li img {
            height: 20px;
            width: 20px;
        }

        .side-ul li span {
            margin-left: 16px;
            font-size: 1.1rem;
            color: var(--bs-body-color);
            line-height: 22px;
            font-weight: 500;
        }

        .side-ul li.highlighted {
            background: var(--N300);
            border-radius: 70px;
        }

.header-logo {
    z-index: 9990;
}

.model-search {
    max-width: 100%;
    margin-top: 0;
}

    .model-search .modal-body {
        max-width: 1000px;
        margin: auto;
        width: 100%;
        margin-top: 70px;
    }

.search-box-pop {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--N100);
    border: 1px solid var(--N400);
    border-radius: 40px;
    box-shadow: var(--box-shadow1, 0 6px 12px rgba(30, 10, 58, .04));
    box-sizing: border-box;
    display: -ms-inline-flexbox;
    display: flex;
    -moz-user-select: none;
    -ms-user-select: none;
}

.sticky-div {
    position: -webkit-sticky;
    /* For Safari */
    position: sticky;
    top: 94px;
    z-index: 1;
}

.offering-wdgt-1 {
    background: linear-gradient(180deg, #fff 0%, #D4FFF2 96.87%);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 20px;
    height: 152px;
    position: relative;
    overflow: hidden;
}

    .offering-wdgt-1 p {
        margin-bottom: 0;
        font-weight: 500;
        color: var(--N800);
        font-size: 1.1rem;
    }

.poll-wdgt .poll-header .poll-title {
    font-weight: 700;
    font-size: 0.9rem;
    line-height: 14px;
    letter-spacing: 1px;
    color: var(--I400);
}

.poll-wdgt .poll-header .poll-ques {
    padding-right: 40px;
    margin-top: 4px;
    font-weight: 700;
    font-size: 1.1rem;
    line-height: 18px;
    color: var(--N800);
}

/* Radio btns */
.radio-btn {
    display: inline-flex;
}

    /* Hide the browser's default radio button */
    .radio-btn input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
    }

    /* Create a custom radio button */
    .radio-btn .checkmark {
        border-radius: 50px;
        position: relative;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        display: inline-flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        min-height: 32px;
        padding: 7.5px 10px 7.5px 12px;
        margin-right: 8px;
        margin-bottom: 8px;
        cursor: pointer;
        background: #fff;
        border: 1px solid #979ec2;
        border-radius: 50px;
        font-weight: 500;
        font-size: 1rem;
        line-height: 15px;
        color: var(--N800);
    }

    /* On mouse-over, add a grey background color */
    .radio-btn:hover input ~ .checkmark {
        background-color: #ddd;
        color: var(--N800);
    }

    /* When the radio button is checked, add a blue background */
    .radio-btn input:checked ~ .checkmark {
        background-color: #e7e7f1;
        border: 1px solid var(--val-black);
        font-weight: 700;
    }

    /* Create the indicator (the dot/circle - hidden when not checked) */
    .radio-btn .checkmark:after {
        content: "";
        position: absolute;
        display: none;
    }

    /* Show the indicator (dot/circle) when checked */
    .radio-btn input:checked ~ .checkmark:after {
        display: block;
    }

    /* Style the indicator (dot/circle) */
    .radio-btn .checkmark:after {
        top: 9px;
        left: 9px;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        opacity: 0;
        background: white;
    }

.qr-scaner .qr-code-cont {
    width: 84px;
    background: #fff;
    border: 1px solid #e7e7f1;
    border-radius: 8px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.qr-scaner .qr-content-container {
    margin-top: 12px;
    padding-bottom: 20px;
}

    .qr-scaner .qr-content-container .qr-headline {
        font-weight: 700;
        font-size: 1.1rem;
        line-height: 18px;
        color: var(--N800);
    }

        .qr-scaner .qr-content-container .qr-headline .red-dot {
            height: 7px;
            width: 7px;
            background: var(--val-red-n);
            border: 2px solid #fff;
            content: " ";
            border-radius: 50%;
            position: relative;
            display: inline-block;
            top: -9px;
            margin-left: -3px;
        }

    .qr-scaner .qr-content-container .app-logo-container .qr-sub-title {
        font-weight: 400;
        font-size: 0.9rem;
        line-height: 18px;
        color: var(--N600);
    }

    .qr-scaner .qr-content-container .app-logo-container {
        gap: 15px;
        display: flex;
    }

.blogs-widget .blog-widg-img {
    border-radius: 10px 10px 0 0;
    height: 150px;
    width: 100%;
}

.blogs-widget a {
    padding-left: 20px;
    margin-top: 8px;
    padding-bottom: 20px;
    display: flex;
    font-style: normal;
    font-weight: 700;
    font-size: 1.2rem;
    line-height: 22px;
    text-align: right;
    color: var(--P100);
}

.view-link {
    float: right;
    font-size: 1.2rem;
    font-weight: 600;
    line-height: 26px;
    color: var(--P100);
}

.job-wrapper-box {
    border: 1px solid #E7E7F1;
    border-radius: 16px;
    padding: 18px;
    margin: 25px 0;
    cursor: pointer;
}

    .job-wrapper-box:hover {
        box-shadow: 0 14px 30px rgba(30, 10, 58, .1);
    }

    .job-wrapper-box .image-b img {
        width: 40px;
        height: 40px;
        border: 1px solid #EDEFF4;
        border-radius: 7px;
    }

    .job-wrapper-box .post-day {
        font-size: 0.9rem;
        font-weight: 500;
        line-height: 14px;
        color: var(--N600);
    }

    .job-wrapper-box .title {
        font-size: 16px;
        font-weight: 700;
        overflow: hidden;
        display: inline-block;
        white-space: nowrap;
        text-overflow: ellipsis;
        width: 100%;
        color: var(--N700);
        line-height: 20px;
        margin-top: 4px;
        text-align: left;
    }

    .job-wrapper-box .comp-name {
        font-size: 14px;
        font-weight: 500;
        line-height: 16px;
        width: unset;
        max-width: calc(100% - 60px);
        overflow: hidden;
        display: inline-block;
        white-space: nowrap;
        text-overflow: ellipsis;
        padding-right: 13px;
    }

    .job-wrapper-box .rating {
        font-size: 1rem;
        font-weight: 600;
        padding-right: 13px;
    }

    .job-wrapper-box .job-loc {
        font-size: 14px;
        font-weight: 400;
        line-height: 18px;
        color: var(--N600);
        margin-top: 8px;
        width: 100%;
        text-align: left;
        overflow: hidden;
        display: inline-block;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

        .job-wrapper-box .job-loc img {
            margin-right: 3px;
            vertical-align: bottom;
        }

    .job-wrapper-box .comp-name-rating {
        color: #474D6A;
        overflow: hidden;
        white-space: nowrap;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: baseline;
        -ms-flex-align: baseline;
        align-items: baseline;
        margin-top: 0;
        font-size: 14px;
        font-weight: 500;
        line-height: 12px;
    }

.home-job-slider .tns-outer {
    margin: 0 !important;
}

.home-job-slider .btn.btn-icon {
    background-color: rgba(30, 10, 58, .5);
}

.tns.tns-default.home-job-slider [data-controls=next] {
    right: 0px !important;
}

.tns.tns-default.home-job-slider [data-controls=prev] {
    left: 0px !important;
}

.company-initials-logo {
    font-weight: 700;
    font-size: 20px;
    line-height: 26px;
    border-radius: 50%;
    border: 1px solid #e7e7f1;
    width: 40px;
    height: 40px;
    min-width: 40px;
    align-items: center;
    display: flex;
    justify-content: center;
}

.company-initials-name {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    font-weight: 700;
    font-size: 1.2rem;
    line-height: 20px;
    color: #121224;
    width: 290px;
    margin-bottom: 2px;
}

.bg3 {
    background: linear-gradient(rgb(255, 255, 255) 0%, rgb(239, 237, 255) 100%);
}

.bg4 {
    background: rgb(223, 223, 253);
}

.blog-list-box {
    display: flex;
    flex-direction: column;
    cursor: pointer;
    background: #fff;
    border: 1px solid #e7e7f1;
    border-radius: 16px;
    padding-bottom: 14px;
    height: 204px;
}

    .blog-list-box img {
        border-radius: 16px 16px 0 0;
        margin-left: -1px;
        margin-top: -1px;
        height: 98px;
        width: 100%;
    }

    .blog-list-box h3 {
        padding-top: 18px;
        padding-right: 10px;
        padding-left: 10px;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
        font-style: normal;
        font-weight: 700;
        font-size: 1.1rem;
        line-height: 16px;
        color: #474d6a;
        text-align: left;
    }

.blog-list-box-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-left: 10px;
    padding-right: 10px;
    margin-top: auto;
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 16px;
    color: #717b9e;
}

.blog-sept {
    margin-top: -15px;
    font-size: 26px;
}

.faq-type {
    width: 100%;
    padding: 20px;
    margin: 0;
    display: flex;
    justify-content: center;
}

    .faq-type li {
        list-style: none;
        display: inline-block;
    }

        .faq-type li a {
            display: flex;
            color: var(--bs-heading-color);
            flex-direction: column;
            font-size: 1.1rem;
            font-weight: 500;
            text-align: center;
        }

    .faq-type li {
        padding: 1rem;
        box-shadow: 0 9px 16px 0 rgba(0, 106, 194, .2);
        display: flex;
        width: 100%;
        margin: .5rem 0 1rem;
        transition: box-shadow .25s;
        background: linear-gradient(180deg, #fff, #efedff) !important;
        border-radius: 20px;
        justify-content: center;
        padding: 30px 10px;
    }

        .faq-type li img {
            width: 80px;
            margin: auto;
            margin-bottom: 10px;
        }

        .faq-type li:hover {
            background: var(--bs-primary) !important;
        }

            .faq-type li:hover a {
                color: #fff;
            }

            .faq-type li:hover img {
                filter: brightness(0) invert(1);
            }

        .faq-type li.active {
            background: var(--bs-primary) !important;
        }

            .faq-type li.active a {
                color: #fff;
            }

            .faq-type li.active img {
                filter: brightness(0) invert(1);
            }

.no_notifications {
    padding: 70px 20px;
    text-align: center;
}

.set_remindes {
    padding: 20px;
    position: relative;
    text-align: center;
}

    .set_remindes img {
        position: absolute;
        left: 20px;
        top: 15px;
        cursor: pointer;
    }

.no-re {
    padding: 50px 20px;
    text-align: center;
}

.recent {
    display: flex;
    align-items: center;
    font-weight: 500;
    font-size: 1.1rem;
    gap: 5px;
    cursor: pointer;
    color: var(--bs-gray-700);
}

.left-search {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #fff;
    background-color: var(--N100, #fff);
    border: 1px solid #e7e7f1;
    border: 1px solid var(--N400, #e7e7f1);
    border-radius: 40px;
    -webkit-box-shadow: 0 6px 12px rgba(30, 10, 58, .04);
    box-shadow: 0 6px 12px rgba(30, 10, 58, .04);
    -webkit-box-shadow: var(--box-shadow1, 0 6px 12px rgba(30, 10, 58, .04));
    box-shadow: var(--box-shadow1, 0 6px 12px rgba(30, 10, 58, .04));
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: 40px;
    overflow: hidden;
    -webkit-transition-delay: .1s;
    transition-delay: .1s;
    -webkit-transition-duration: .25s;
    transition-duration: .25s;
    -webkit-transition-property: right, top, width, height, -webkit-transform;
    transition-property: right, top, width, height, -webkit-transform;
    transition-property: transform, right, top, width, height;
    transition-property: transform, right, top, width, height, -webkit-transform;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 100%;
    padding: 0 40px 0 15px;
}

    .left-search:focus-visible {
        outline: none;
    }

.left-search-icon {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: transparent;
    border: none;
    border-radius: 50%;
    color: #fff;
    color: var(--N100, #fff);
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 16px;
    height: 28px;
    margin-left: auto;
    margin-right: 6px;
    min-width: 28px;
    overflow: hidden;
    padding: 0;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transition-duration: .15s;
    transition-duration: .15s;
    -webkit-transition-property: min-width, width, height, margin, border-radius;
    transition-property: min-width, width, height, margin, border-radius;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    width: 28px;
    justify-content: center;
    position: absolute;
    top: 5px;
    right: 0;
}

    .left-search-icon i {
        color: var(--bs-text-gray-800) !important;
    }

.jl-f span {
    align-items: center;
    display: flex;
    cursor: pointer;
    line-height: 22px;
}

    .jl-f span .form-check-input {
        margin-top: 1px;
    }

.select-l {
    position: absolute;
    left: 20px;
    top: 32px;
}

.job-list-e a {
    color: var(--bs-card-color);
}

.notify-me-s .select2-container {
    width: auto !important;
}

.radio-search .form-check-input {
    margin-top: 1px;
}

.cv-prev-header {
    box-shadow: 0 1px 0 var(--N400);
}

.breadcrum-t a {
    color: var(--bs-body-color);
}

    .breadcrum-t a:hover {
        color: var(--P100);
    }

.user-d-img {
    position: absolute;
    left: 20px;
    top: 10px;
    width: 100px;
    height: 100px;
    border-radius: 50%;
}

.search-d {
    position: relative;
    padding-left: 150px;
}



.tooltip p {
    margin: 3px 0 0px 0;
    text-align: left;
}

.about-candidates {
    background-color: var(--N300);
    border-left: 4px solid var(--P100);
    border-radius: 6px;
    color: var(--N700);
    font-weight: 500;
    margin-bottom: 30px;
    padding: 16px 24px;
    width: 100%;
    display: block;
}

.skills-list span {
    background: var(--background);
    border-radius: 6px;
    padding: 5px 10px;
    display: inline-flex;
    margin-bottom: 5px;
}

.exp-d {
    display: flex;
    flex-direction: column;
    position: relative;
    padding-left: 55px;
    margin-bottom: 20px;
}

.exp-d-icon {
    background: var(--N400);
    width: 40px;
    height: 40px;
    text-align: center;
    align-items: center;
    display: flex;
    justify-content: center;
    position: absolute;
    left: 0;
    border-radius: 6px;
    top: 0px;
}

.pd td {
    padding: 0 30px 5px 0;
}

.s-profiles {
    position: relative;
    width: 100%;
    padding-top: 30px;
    padding-bottom: 20px;
    padding-right: 1.25rem !important;
    padding-left: 1.25rem !important;
}

.s-profile-d {
    width: 100%;
    padding-left: 44px;
}

.s-profile-img {
    border-radius: 50%;
    position: absolute;
    left: 16px;
    top: 28px;
    width: 36px;
    height: 36px;
}

.s-skills {
    display: inline-block;
    width: 100%;
}

    .s-skills span {
        display: inline-flex;
        padding-right: 5px;
    }

        .s-skills span:after {
            content: "|";
            display: block;
            margin-left: 7px;
        }

        .s-skills span:last-child:after {
            display: none;
        }

.horizontal-divider {
    border: 0;
    border-top: 1px solid var(--N400);
    margin: 0 20px;
    width: 100%;
    opacity: 1;
}


.left-side-acc {
    width: 100%;
    padding-top: 5px;
    position: relative;
    padding-bottom: 5px;
}

.sub-links-left {
    width: 100%;
    padding: 0;
    margin: 0;
}

    .sub-links-left li {
        list-style: none;
        display: block;
        margin-bottom: .55rem !important;
    }

        .sub-links-left li a {
            color: var(--bs-text-gray-800);
            font-weight: 500;
            display: block;
            font-size: 1.1rem !important;
        }

            .sub-links-left li a:hover {
                color: var(--P100);
            }

.stitle {
    background-color: var(--N300);
    border-left: 4px solid var(--P100) !important;
    border-radius: 6px;
    color: var(--N700);
    font-weight: 500;
    margin-bottom: 10px !important;
    padding: 10px 10px 10px 15px;
    width: 100%;
}

    .stitle .btn.btn-icon {
        background: transparent !important;
    }

.improve-your {
    border: 1px solid #FFE2B1;
    padding: 16px 12px;
    background: #FEF5E6;
    border-radius: 8px;
}

.header-top {
    background: url(../media/svg/top-offer-banner.jpg) no-repeat center center #063467;
    height: 62px;
    cursor: pointer;
    background-size: 100% 100%;
    position: fixed;
    width: 100%;
    z-index: 99;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

    .header-top p {
        margin-bottom: 0;
        color: #fff;
        font-weight: 600;
        font-size: 1.15rem;
    }

    .header-top + .app-header {
        margin-top: 60px;
        padding-top: 12px;
    }

.dont-have {
    width: 95%;
    margin: 25px 0 12px .75rem;
    border-top: 1px solid #cecece;
    position: relative;
}

.dont-have-text {
    color: #8993a4;
    font-size: 14px;
    font-weight: 400;
    line-height: 16px;
    padding: 4px;
    top: -13px;
    left: 0;
    background: #fff;
    margin: 0 auto -16px;
    position: absolute;
    right: 0;
    display: inline-table;
    width: auto;
}

.form-check-label span.mw-auto {
    max-width: calc(100% - 0px) !important;
}

.re-footer {
    background: var(--P100);
    padding: 20px;
    color: #ffffffb3;
    text-align: center;
}

    .re-footer span {
        width: 100%;
        display: block;
    }

        .re-footer span a {
            color: #ffffffb3;
        }

.user-d-img-list {
    width: 60px;
    height: 60px;
    border-radius: 50%;
}

.ftype {
    position: absolute;
    width: 30px;
    right: 0;
    top: 0;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.scheck {
    position: relative;
    padding-left: 30px;
}

    .scheck label {
        position: absolute;
        left: 0;
        top: 8px;
    }

.res-type {
    width: 100%;
    display: flex;
    gap: 10px;
    margin-bottom: 15px;
}

    .res-type span {
        border: 1px solid var(--bs-gray-500);
        font-size: 13px;
        cursor: pointer;
        border-radius: 30px;
        padding: 0px 10px;
    }

.badge-light {
    background: var(--P200);
}

.interview-objectives .form-check.form-check-inline {
    align-items: start;
    color: var(--N700);
}

#visualizer {
    display: flex;
    align-items: flex-end;
    width: 100%;
    height: 44px;
    background-color: #e9ecef;
    border-radius: 0.475rem;
    margin-left: 20px;
    overflow: hidden;
}

.bar {
    width: 2px;
    display: block;
    margin-right: 1px;
    background-color: #007bff;
    transform-origin: bottom;
}

.vid-rec {
    width: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 10px;
    background-color: #0d1734;
}

.vid-play {
    width: 100%;
    border-radius: 10px;
}

.time-state {
    background: rgba(77, 85, 107, .25);
    border-radius: 20px;
    color: #fff;
    padding: 3px 10px;
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 2;
}

.play-button,
.pause-button {
    border: none;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.08);
    color: black;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color 0.3s;
    width: 30px;
    height: 30px;
}

    .play-button:hover,
    .pause-button:hover {
        background-color: rgba(0, 0, 0, 0.15);
    }

    .play-button:focus,
    .pause-button:focus {
        outline: none;
    }

.pause-button {
    display: none;
}

.record-state {
    background: rgba(77, 85, 107, .25);
    border-radius: 20px;
    color: #fff;
    padding: 3px 10px;
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 2;
}

.recording-spot {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin-right: 5px;
    border-radius: 50%;
}

    .recording-spot.green {
        background: #59cc4c;
    }
    .recording-spot.red {
        background: #f04141;
    }

.record-start {
    background: rgba(77, 85, 107, .25);
    border-radius: 0;
    color: #fff;
    padding: 0px 10px;
    position: absolute;
    top: 0px;
    right: 0;
    z-index: 2;
    bottom: 0;
    left: 0;
    margin: auto;
    height: 40px;
    line-height: 40px;
}

.icon {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 3px solid;
    background-color: white;
    margin: 0 auto;
    position: relative;
    z-index: 2;
}

.icon-check {
    color: #28a745;
    border-color: #28a745;
}

    .icon-check i {
        color: #28a745;
    }

.icon-clock {
    color: #ffc107;
    border-color: #ffc107;
}

    .icon-clock i {
        color: #ffc107;
    }

.icon-award {
    color: var(--P100);
    border-color: var(--P100);
}

    .icon-award i {
        color: var(--P100);
    }

.step-line {
    position: absolute;
    top: 30px;
    left: 15%;
    right: 15%;
    height: 2px;
    background-color: #dee2e6;
    z-index: 1;
    width: 70%;
}

.rating-color {
    color: #fbc634 !important;
}

.home-banner-01 {
    width: 100%;
    display: block;
    max-width: 1000px;
    margin: auto;
    margin-bottom: 35px;
}

    .home-banner-01 img {
        max-width: 100%;
        width: 100%;
    }

.dropzone-panel {
    border: 1px solid var(--N400);
    border-radius: 16px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    width: auto;
}

    .dropzone-panel p {
        color: var(--N500);
        margin-top: 0;
        font-size: 14px;
        line-height: 20px;
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
        padding-right: 12px;
        font-weight: 500;
        margin-bottom: 0;
    }

#kt_verify_email_button {
    border-radius: 16px;
    height: 46.45px;
}

.validation-summary-errors ul {
    list-style: none;
    margin-left: -25px;
    margin-top: 10px;
}

    .validation-summary-errors ul li {
        color: var(--bs-text-danger) !important;
    }

.message-success {
    border-bottom: var(--I200) thin solid;
}

    .message-success i {
        color: var(--I200);
    }

.message-danger {
    border-bottom: var(--I100) thin solid;
}

    .message-danger i {
        color: var(--I100);
    }

.ui-autocomplete {
    z-index: 1100 !important;
}

.profile-img-view:hover .photoBadge {
    display: flex;
}

.photoBadge {
    width: 120px;
    height: 120px;
    position: absolute;
    background-color: rgba(0, 0, 0, .6);
    color: var(--N300);
    border-radius: 50%;
    font-size: 11px;
    display: none;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    cursor: pointer;
}

    .photoBadge span {
        font-size: 18px;
        font-weight: 700;
        line-height: 23px;
        margin-top: 3px;
        text-align: center;
    }

    .photoBadge i {
        color: #fff;
        font-size: 36px;
    }

#kt_drawer_add-question_close {
    position: absolute;
    right: 30px;
    top: 10px;
}

.form-check-input:checked {
    background-color: var(--P100);
    border: none;
}

.qtype {
    display: flex;
    align-items: center;
    gap: 5px;
}

    .qtype span {
        background: #fff;
        border: 1px dashed #8993a4;
        border-radius: 36px;
        display: flex;
        padding: 2px 12px 4px 12px;
        cursor: pointer;
        align-items: center;
    }

        .qtype span.active {
            background: #e9f5fe;
            border: 1px solid #add9fb;
        }

.add-questions {
    width: 100%;
    padding: 0;
    margin: 0;
}

    .add-questions li {
        list-style: none;
        display: flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 15px;
    }

        .add-questions li span {
            background-color: #fff;
            border: 2px solid #dadada;
            height: 16px;
            border-radius: 50%;
            min-width: 16px;
        }

/*.add-questions li:hover .preferred-answer {
            display: flex !important;
        }*/

.cfooter {
    padding: 20px 0;
    box-shadow: 0 -3px 8px 0 #1f5ca333;
    background: #fff;
}

.btnFilter {
    display: flex;
    gap: 5px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-right: 8px;
    padding: 7px 12px;
    background: var(--N100);
    border: 1px solid var(--N500);
    border-radius: 50px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-weight: 500;
    font-size: 14px;
    line-height: 18px;
    color: var(--N700);
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number] {
    -moz-appearance: textfield;
}

.skeleton-line {
    min-height: 16px;
    color: transparent !important;
    background-color: #f0f0f0 !important;
    background-image: linear-gradient( to right, #f0f0f0 0%, #e0e0e0 50%, #f0f0f0 100% );
    background-size: 400% 400%;
    animation: loading-line 1s ease infinite;
    border: 0 !important;
    margin-bottom: 4px;
    pointer-events: none;
}

    .skeleton-line img, .skeleton-line i, .skeleton-line input, .skeleton-line span, .skeleton-line textarea, .skeleton-line select, .skeleton-line button, .skeleton-line a {
        opacity: 0;
        pointer-events: none;
    }

label.skeleton-line:after {
    content: "" !important;
}

@keyframes loading-line {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}


.error-msg {
    background: #f9e5e6;
    border-radius: 4px;
    padding: 6px 15px;
    color: #ba000b;
    font-size: 14px;
    margin-top: 20px;
    display: inline-block;
}

#toastr-container > div{
    opacity: 1;
}

#message-popup {
    display: none;
    position: absolute;
    top: 45%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 10px 20px;
    background-color: #fff;
    color: #333;
    font-size: 16px;
    z-index: 1;
    text-align: center;
}

.f-container {
    display: none;
}

.social-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 120px;
    height: 30px;
    border-radius: 5px;
    color: white;
    font-size: 14px;
    text-decoration: none;
    transition: background-color 0.3s ease;
}

    .social-button i {
        margin-right: 8px;
        font-size: 18px;
        color: #fff;
    }

    .social-button.facebook {
        background-color: #3b5998;
    }

    .social-button.whatsapp {
        background-color: #25d366;
    }

    .social-button.linkedin {
        background-color: #0077b5;
    }

    .social-button.twitter {
        background-color: #000000;
    }

.blockui .blockui-message {
    color: #0D6EFD;
}