@media only screen and (min-width:320px) and (max-width:425px) {

    .check_out_btn {
        width: 100% !important;
    }

    .probar_btn {
        padding: 4px !important;
    }

    .calender_table {
        overflow-x: auto !important;
        height: 250px;
    }

    .check_align {
        display: none;
    }

    .border_unset {
        margin-top: 0px !important;
    }

    .table_card {
        height: unset !important;
    }

    .tab_align .nav-pills .nav-link {
        margin-left: 0px !important;
    }

    .modal_size {
        margin: 10px !important;
    }

    .m-table {
        table-layout: unset !important;
    }

    .m-content-align {
        display: none;
    }

    .m_date_align {
        position: absolute;
        left: 24% !important;
    }

    .chk_btn {
        position: unset !important;
        left: unset !important;
    }

    .recovercard {
        width: 100% !important;
    }

        .recovercard .card-body {
            padding: 10px !important;
        }

    .request_align .nav-link {
        padding: 12px !important;
    }

    .dt_top_align {
        position: unset;
        margin-top: 10px;
    }

    .nodata {
        width: 100% !important;
        background-size: 263px !important;
    }

    .dataTables_filter {
        margin-top: 10px;
    }

    .tsm-0 {
        top: 4px !important;
    }

    .redirect_rf {
        position: unset !important;
    }

    .nav-item {
        padding-left: 0px !important;
    }

    .reportrange {
        width: 23.5em !important;
    }

    .leave_history {
        height: 110px;
    }
}

@media screen and (max-width: 767px) {
    div.dataTables_wrapper div.dataTables_length, div.dataTables_wrapper div.dataTables_filter, div.dataTables_wrapper div.dataTables_info, div.dataTables_wrapper div.dataTables_paginate {
        text-align: right !important;
    }

    /* div.dataTables_wrapper div.dataTables_info {
        display: ;
    }*/

    .dt_top_align {
        position: unset;
        margin-top: 10px;
    }

    .tmd-0 {
        top: 4px !important;
    }

    .dtfc-fixed-left {
        position: unset !important;
    }

    .redirect_rf {
        position: unset !important;
    }
}

@media only screen and (max-width:768px) {
    .recovercard .card-body {
        padding: 10px !important;
    }

    .m-content-align {
        top: unset !important;
    }

    .import_day .card-body {
        padding: 10px;
    }

    .dtfc-fixed-left {
        position: unset !important;
    }

    .reportrange {
        width: 16em !important;
    }

    /* .week_calender_icon {
        left: 196px !important;
    }

    .week_calender_icon_2 {
        left: 162px !important;
    }*/

    #filter_c {
        left: 70% !important;
    }

    .request_align .nav-link {
        padding: 0.5rem 0.9rem !important;
    }

    .dt_top_align {
        position: unset !important;
        margin-top: 10px;
    }

    .tmd-0 {
        top: 4px !important;
    }

    .redirect_rf {
        position: unset !important;
    }
}

@media only screen and (max-width:1024px) {
    .profile_height {
        width: 16em !important;
    }

    .filter_count {
        left: 76% !important;
    }

    .table_fixed {
        table-layout: unset !important;
    }

    .redirect_rf {
        position: unset !important;
    }
}

@media only screen and (max-width:1280px) {
    .profile_height {
        width: 16em !important
    }
}

@media only screen and (min-width:1300px) and (max-width:1440px) {
    .profile_height {
        width: 13.5% !important;
    }

    .req_dd {
        width: 28% !important;
    }

    #filter_c {
        left: 84% !important;
    }

    .to-do-height {
        max-height: 100vh !important;
        overflow: auto !important;
        height: 100vh !important;
    }

    .to-do-footer {
        position: absolute;
        bottom: 0;
        left: 40%;
    }
}

@media only screen and (min-width:1800px) {
    .profile_height {
        width: 14.5% !important;
    }

    .res_card {
        width: 75%;
    }
}

.page-header, .page-header-space {
    height: 100px;
}

.page-footer, .page-footer-space {
    height: 100px;
}

.page-footer {
    bottom: 0;
    width: 94%;
    background: #fff; /* for demo */
}

.page-header {
    width: 94%;
    /*border-bottom: 1px solid black; */
    background: #fff;
}

.page {
    page-break-before: always;
}

@page {
    margin: 0mm
}

@media print {
    thead {
        display: table-header-group;
    }

    tfoot {
        display: table-footer-group;
    }

    button {
        display: none;
    }

    body {
        margin: 0;
    }
}

:root {
    --head_color: #405189;
    --para_color: #767679;
    --font_weight_600: 500;
    --btn_para_color: #fff;
    --sub_head: #000;
    --green_color: #0AB39C;
    --blue_color: #299CDB;
    --pink_color: #F672A7;
    --red_color: #F06548;
    --heading_size: 16px;
    --sub_heading_size: 14px;
    --black_color: #000;
    --white_color: #fff;
    --div_color: #F3F3F9;
    --yellow_color: #F7B84B;
    --voilet_color: #95A3D4;
    --light_green: #E7F7F5;
    --light_red: #FDF0ED;
    --light_pink: #FEF1F6;
    --light_blue: #EAF5FB;
    --light_yellow: #FEF8ED;
    --light_reg: #F3F3F9;
    --light_bg_r: #F2D7D6;
    --light_bg_g: #C4E6E6;
    --light_bg_b: #CBE2F3;
    --light_bg_p: #F4D9E9;
    --light_bg_v: #CFD3E3;
    --light_bg_y: #F4E7D6;
    --light_bg_th: #ECEEF3;
    --addwd_g: #C2ECE6;
    --addwd_b: #C9E6F6;
    --addwd_p: #FDDCE9;
    --addwd_r: #FBD9D1;
    --th-color: #405189;
}
/*<============= LIGHT BACKGROUND COLORS===============================>*/
.light_bg_r {
    background: var(--light_bg_r);
}

.light_bg_g {
    background: var(--light_bg_g);
}

.light_bg_b {
    background: var(--light_bg_b);
}

.light_bg_p {
    background: var(--light_bg_p);
}

.light_bg_v {
    background: var(--light_bg_v);
}

.light_bg_y {
    background: var(--light_bg_y);
}

.bg_g_color {
    background-color: var(--green_color);
}

.bg_li_g {
    background-color: var(--light_green);
}

.bg_li_p {
    background-color: var(--light_pink);
}

.bg_li_b {
    background-color: var(--light_blue);
}

.bg_li_r {
    background-color: var(--light_red);
}

.bg_li_y {
    background-color: var(--light_yellow);
}

.bg_li_color {
    background-color: var(--light_reg);
}

.bg_li_th {
    background-color: var(--light_bg_th);
}

.addwd_g {
    background: var(--addwd_g);
}

.addwd_b {
    background: var(--addwd_b);
}

.addwd_p {
    background: var(--addwd_p);
}

.addwd_r {
    background: var(--addwd_r);
}

.bor_radi0 {
    border-radius: 0px;
}

.navbar-header-1 {
    padding-left: calc(1rem) !important;
    padding-right: calc(0.8rem) !important;
}

.card-footer {
    border-top: unset;
}

.fw-5 {
    font-weight: var(--font_weight_600);
}

.fw-6 {
    font-weight: 600;
}

.f-20::before {
    font-size: 20px;
}

.fi-18::before {
    font-size: 18px;
}

.th-color {
    color: var(--head_color);
}

.thp-color {
    color: var(--para_color);
}
/*================================================================DATA TABLE FIXED SHADOW ====================================*/

th.sorting.dtfc-fixed-left {
    box-shadow: 4px 0px 12px 0px rgba(64, 81, 137, 0.07);
    background: #f0f0f6;
}

td.dtfc-fixed-left {
    box-shadow: 4px 0px 12px 0px rgba(64, 81, 137, 0.07);
    background: #fff;
}

th.sorting.dtfc-fixed-right {
    box-shadow: -4px 0px 12px 0px rgba(64, 81, 137, 0.07);
    z-index: 999 !important;
    background: #f0f0f6;
}

td.dtfc-fixed-right {
    box-shadow: -4px 0px 12px 0px rgba(64, 81, 137, 0.07);
    z-index: 999 !important;
    background: #fff;
}
/*================================================================DATA TABLE FIXED SHADOW ====================================*/
/*================================================================DROPDOWN ISSUES ====================================*/
.bootstrap-select .dropdown-menu .inner {
    max-height: 150px !important;
}

.dropdown-menu.show {
    /*min-height: 150px !important;*/
    max-height: 250px !important;
}

/*================================================================DROPDOWN ISSUES ====================================*/
/*================================================================RIPPLE EFFECT ====================================*/

.ripple {
    border-radius: 100%;
    background-color: rgba(0,0,0,0.3);
    height: 15px;
    width: 15px;
    content: "";
    position: absolute;
    animation-name: ripple;
    animation-duration: .5s;
    animation-timing-function: ease-out;
    animation-fill-mode: forwards;
}

@keyframes ripple {
    to {
        transform: scale(20);
        opacity: 0;
    }
}
/*================================================================RIPPLE EFFECT ====================================*/
/*<============== BACKGROUND COLORS =================================>*/
.bg_g_color {
    background-color: var(--green_color);
}

.bg_p_color {
    background-color: var(--pink_color);
}

.bg_r_color {
    background-color: var(--red_color);
}

.bg_b_color {
    background-color: var(--blue_color);
}

.bg_y_color {
    background-color: var(--yellow_color);
}

.bg_reg_color {
    background-color: var(--voilet_color);
}
/*<================= PRIMARY COLORS =============================================>*/
.p-color {
    color: var(--pink_color);
}

.r-color {
    color: var(--red_color) !important;
}

.b-color {
    color: var(--blue_color);
}

.y-color {
    color: var(--yellow_color) !important;
}

.reg-color {
    color: var(--voilet_color) !important;
}

.g-color {
    color: var(--green_color) !important;
}

.tx-color {
    color: var(--para_color)
}
/*<====================== svg Filters ====================================================>*/
table.dataTable.hover > tbody > tr:hover > * {
    background-color: #f3f3f9;
}

.svg_blue {
    filter: brightness(0) saturate(100%) invert(35%) sepia(4%) saturate(7409%) hue-rotate(189deg) brightness(85%) contrast(93%);
}

.svg_light_blue {
    filter: invert(60%) sepia(37%) saturate(4027%) hue-rotate(171deg) brightness(92%) contrast(85%);
}

.svg_green {
    filter: brightness(0) saturate(100%) invert(45%) sepia(77%) saturate(933%) hue-rotate(134deg) brightness(97%) contrast(92%);
}

.svg_theme {
    filter: brightness(0) saturate(100%) invert(27%) sepia(10%) saturate(3081%) hue-rotate(189deg) brightness(101%) contrast(83%) !important;
}


.svg_white {
    filter: brightness(0) saturate(100%) invert(99%) sepia(4%) saturate(517%) hue-rotate(275deg) brightness(118%) contrast(100%);
}

.svg_blk {
    filter: brightness(0) saturate(100%) invert(0%) sepia(100%) saturate(7500%) hue-rotate(308deg) brightness(118%) contrast(95%);
}

.icon_stroke::before {
    -webkit-text-stroke: 1px;
}
/*<====================== OTHERS ====================================================>*/
.thp-color {
    color: var(--para_color);
}

.th-color {
    color: var(--head_color);
}

.blk-color {
    color: var(--black_color);
}

.w-color {
    color: var(--white_color) !important;
}

p, label {
    color: var(--para_color);
}

tbody.preemp td {
    color: #767679 !important;
    vertical-align: middle !important;
}

.grey-color {
    color: #767679 !important;
}

.app-search h4 {
    font-size: 20px !important;
}

.form-control:disabled, .form-control[readonly] {
    background-color: #CFD3E1;
}
/*<=============================================== FONTS SIZES & WEIGHTS =====================================>*/
.f-12 {
    font-size: 12px;
}

.f-13 {
    font-size: 13px;
}

.f-14 {
    font-size: 14px;
}

.fi-18::before {
    font-size: 18px;
}

.fs-18 {
    font-size: 18px !important;
}

.f-20::before {
    font-size: 20px;
}

.fw-5 {
    font-weight: var(--font_weight_600);
}

.r-0 {
    right: 0 !important;
}

.t-0 {
    top: 0 !important;
}

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

.z-9 {
    z-index: 99999;
}

h4 {
    color: var(--head_color);
    font-size: var(--heading_size)
}

h5 {
    color: var(--sub_head);
    font-size: var(--sub_heading_size);
}
/*<=============================================== BORDERS =====================================>*/

.bg_purple {
    border: 1px solid #95A3D4;
    background: #F0F0F6;
    border-radius: 5px;
}

.br-0 {
    border-radius: 0px;
}

.br-5 {
    border-radius: 5px;
}

.bor_r_color {
    border: 1px solid var(--red_color);
}

.bor_g_color {
    border: 1px solid var(--green_color);
}

.bor_b_color {
    border: 1px solid var(--blue_color);
}

.bor_th_color {
    border: 1px solid var(--head_color);
    border-radius: 5px;
}

.bor_y_color {
    border: 1px solid var(--yellow_color);
}

.bor_grey_color {
    border: 1px solid #DFDFDF;
    border-radius: 5px;
}

.bor_p_color {
    border: 1px solid var(--pink_color);
}

.bor_reg_color {
    border: 1px solid var(--voilet_color);
}

.card-footer {
    border-top: unset;
}

.table_td td {
    border: unset;
}

.navbar-header-1 {
    padding-left: calc(1rem) !important;
}

.page-content {
    padding: calc(30px + 0.5rem) calc(1.5rem / 2) 60px calc(0.5rem / 2) !important;
}

.sub_head {
    color: var(--sub_head);
}

.verified_s {
    position: absolute;
    right: 18px;
}

.wave_hand {
    width: 34px;
    margin-left: 5px;
}

.rd_w th {
    width: 100px;
}

.pn_box {
    width: 180px;
    height: 40px;
    background-color: #DFF0FA;
    border-left: 3px solid var(--blue_color);
}

.divider {
    border-width: thin;
    border-style: solid;
    border-color: var(--div_color);
}

.divider_flex {
    width: 100%;
    border-bottom: 1px solid var(--div_color);
}

.paddy_align {
    padding: 20px 26px 20px 26px;
}

.seprator_2 {
    border: 1px solid #95a3d429;
    border-width: thin;
}

.page_navigator {
    z-index: 1002 !important;
    position: sticky !important;
    top: 57px !important;
    background-color: #f3f3f9 !important;
    padding-bottom: 14px !important;
}

section.pageheader {
    position: sticky;
    top: 54px;
    z-index: 1002 !important;
    background: #f3f3f9;
}
/*=========================================== GREEN PROGRESS BAR =====================================*/
.circle-wrap {
    width: 130px;
    height: 130px;
    background: #DAF4F0;
    border-radius: 50%;
}

    .circle-wrap .circle .mask, .circle-wrap .circle .fill {
        width: 130px;
        height: 130px;
        position: absolute;
        border-radius: 50%;
    }

.mask .fill {
    clip: rect(0px, 65px, 130px, 0px);
    background-color: #0AB39C;
}

.circle-wrap .circle .mask {
    clip: rect(0px, 130px, 130px, 65px);
}

.mask.full, .circle .fill {
    animation: fill ease-in-out 3s;
    transform: rotate(135deg);
}

.circle-wrap .inside-circle {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background: #fff;
    line-height: 90px;
    text-align: center;
    margin-top: 20px;
    margin-left: 20px;
    color: #000;
    position: absolute;
    z-index: 100;
    font-weight: 600;
    font-size: 16px;
}
/*===================================== CIRCLE BAR BLUE =============================================*/
.circle-wrap-blue {
    width: 130px;
    height: 130px;
    background: #c0dff0;
    border-radius: 50%;
}

    .circle-wrap-blue .circle-blue .mask-blue, .circle-wrap-blue .circle-blue .fill-blue {
        width: 130px;
        height: 130px;
        position: absolute;
        border-radius: 50%;
    }

.mask-blue .fill-blue {
    clip: rect(0px, 65px, 130px, 0px);
    background-color: #299CDB;
}

.circle-wrap-blue .circle-blue .mask-blue {
    clip: rect(0px, 130px, 130px, 65px);
}

.mask-blue.full-blue, .circle-blue .fill-blue {
    animation: fill-blue ease-in-out 3s;
    transform: rotate(180deg);
}

.circle-wrap-blue .inside-circle-blue {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background: #fff;
    line-height: 90px;
    text-align: center;
    margin-top: 20px;
    margin-left: 20px;
    color: #000;
    position: absolute;
    z-index: 100;
    font-weight: 600;
    font-size: 16px;
}
/*================================ CIRCLE PROGRESS BAR PINK ============================================*/
.circle-wrap-pink {
    width: 130px;
    height: 130px;
    background: #FEEAF2;
    border-radius: 50%;
}

    .circle-wrap-pink .circle-pink .mask-pink, .circle-wrap-pink .circle-pink .fill-pink {
        width: 130px;
        height: 130px;
        position: absolute;
        border-radius: 50%;
    }

.mask-pink .fill-pink {
    clip: rect(0px, 65px, 130px, 0px);
    background-color: #F672A7;
}

.circle-wrap-pink .circle-pink .mask-pink {
    clip: rect(0px, 150px, 150px, 65px);
}

.mask-pink.full-pink, .circle-pink .fill-pink {
    animation: fill-pink ease-in-out 3s;
    transform: rotate(45deg);
}

.circle-wrap-pink .inside-circle-pink {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background: #fff;
    line-height: 90px;
    text-align: center;
    margin-top: 20px;
    margin-left: 20px;
    color: #000;
    position: absolute;
    z-index: 100;
    font-weight: 600;
    font-size: 16px;
}
/*========================================================= RED ==========================================*/
.circle-wrap-red {
    width: 130px;
    height: 130px;
    background: #FDE8E4;
    border-radius: 50%;
}

    .circle-wrap-red .circle-red .mask-red, .circle-wrap-red .circle-red .fill-red {
        width: 130px;
        height: 130px;
        position: absolute;
        border-radius: 50%;
    }

.mask-red .fill-red {
    clip: rect(0px, 60px, 150px, 0px);
    background-color: #F06548;
}

.circle-wrap-red .circle-red .mask-red {
    clip: rect(0px, 150px, 150px, 60px);
}

.mask-red.full-red, .circle-red .fill-red {
    animation: fill-red ease-in-out 3s;
    transform: rotate(92deg);
}

.circle-wrap-red .inside-circle-red {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background: #fff;
    line-height: 90px;
    text-align: center;
    margin-top: 20px;
    margin-left: 20px;
    color: #000;
    position: absolute;
    z-index: 100;
    font-weight: 600;
    font-size: 16px;
}

.gprobar_text, .bprobar_text, .pprobar_text {
    font-weight: var(--font_weight_600);
    text-align: center;
    margin: 10px 0px 10px 0px;
}

.gprobar_text {
    color: var(--green_color);
}

.bprobar_text {
    color: var(--blue_color);
}

.pprobar_text {
    color: var(--pink_color);
}

.view_btn {
    border-color: #95A3D4;
}

.probar_btn {
    padding: 8px 14px 8px 14px;
    border-color: var(--blue_color);
    color: var(--blue_color);
}

    .probar_btn:hover {
        background-color: #299CDB;
        color: #fff;
    }

.badge {
    padding: 0.5em 0.8em;
}

.asc_list li:hover {
    background: #F3F3F9;
}

.card_height {
    max-height: 100%;
    height: 330px;
}

.max_height {
    max-height: 100%;
    height: 200px;
}

    .max_height::-webkit-scrollbar {
        display: none;
    }

.cfooter_align {
    border-top: unset;
    text-align: center;
    font-weight: var(--font_weight_600);
}

    .cfooter_align a {
        color: var(--green_color);
    }

.anniver_align, .birth_align, .dash_request, .dash_holidays {
    position: relative;
    top: 16%;
}

    .anniver_align img, .birth_align img, .dash_request img, .dash_holidays img {
        width: 100px;
        opacity: 0.5;
    }

    .anniver_align p {
        margin-top: 20px;
        color: #F672A7;
        font-weight: 500;
    }

    .birth_align p {
        margin-top: 20px;
        color: #F06548;
        font-weight: 500;
    }

    .dash_request p {
        margin-top: 20px;
        color: #0AB39C;
        font-weight: 500;
    }

    .dash_holidays p {
        margin-top: 20px;
        color: #299CDB;
        font-weight: 500;
    }

.tab_align .nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    border: 1px solid #405189 !important;
    background-color: #E2E5ED !important;
    color: #000 !important;
    padding: 0.3rem 1.5rem !important;
    z-index: 1;
    border-radius: 5px !important;
}

.tab_align .nav-pills .nav-link {
    border: 1px solid #DFDFDF !important;
    padding: 0.3rem 1.5rem !important;
    margin-left: -5px !important;
    background-color: #fff !important;
}

.expand_align {
    border: 1px solid #DFDFDF !important;
    padding: 5px;
}

.monthly_align { /*background-color: rgb(226, 229, 237)*/
    color: rgb(0, 0, 0);
    border: 1px solid #95A3D4 !important;
    font-weight: 500;
}

    .monthly_align .calender_left {
        right: 8px;
    }

    .monthly_align .calender_right {
        left: 8px;
    }

.calender_left, .calender_right {
    position: relative;
    border: unset; /*background-color: rgb(226, 229, 237);*/
}

    .calender_left:hover, .calender_right:hover {
        background-color: #f0f0f6;
    }

tbody, td, tfoot, tr {
    border-color: #e9ebec !important;
    border-style: solid;
    border-width: 1px;
}

.monthly_tbody td {
    position: relative;
}

    .monthly_tbody td:focus, .monthly_tbody td:hover {
        background-color: #F0F0F6;
    }

.date_align {
    position: absolute;
    top: 6px;
    right: 6px;
}

.table_head {
    background-color: #F0F0F6;
}

.check-in {
    color: #0AB39C;
    font-size: 12px;
}

.check-out {
    color: #F06548;
    font-size: 12px;
}

.border_unset {
    margin-top: -20px;
}

.table_card {
    padding: 12px 8px 12px 8px;
}

    .table_card::-webkit-scrollbar {
        display: none;
    }

.calender_table {
    overflow-x: unset;
}

.check_align {
    margin-bottom: 0.5rem;
    font-weight: 500;
    color: #767679;
}

.calender_dd {
    width: 200px;
}

.shift_drop {
    background-image: unset !important;
}

.wekkly_table {
    height: 290px;
}

.badge_align {
    font-size: 12px !important;
    font-weight: 400;
}

.wekkly_table::-webkit-scrollbar {
    display: none;
}

.table thead th {
    text-transform: unset;
}

.nav_tab_align .nav {
    display: unset;
}

.chk_btn {
    position: absolute;
    left: 200px;
}

.blue_poly, .absent_poly, .leave_poly, .week_of_poly, .reg_poly {
    width: 50px;
    height: 50px;
    clip-path: polygon(0 0, 0 26%, 29% 0);
    position: relative;
    top: 14px;
}

.blue_poly_1, .absent_poly_1, .week_off_1, .leave_poly_1, .reg_poly_1 {
    width: 38px;
    height: 24px;
    clip-path: polygon(0 0, 0 64%, 40% 0);
    position: absolute;
    top: 0;
    left: 0;
}

.blue_color, .absent_color, .leave_color, .week_of_color, .reg_of_color {
    font-weight: 600;
    position: relative;
    right: 34px;
}

.badge {
    padding: 0.5em 0.8em;
}

.c_box1 {
    border: 1px solid #405189;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

    .c_box1 p {
        font-size: 14px;
        text-align: center;
        padding: 2px 0px 2px 0px;
        color: var(--head_color);
    }

.c_box2 p {
    color: #fff;
    font-size: 14px;
    text-align: center;
    padding: 4px 0px 5px 0px;
}

.c_box2 {
    background-color: var(--head_color);
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}
/*.tab_align .nav-pills .nav-link.active, .nav-pills .show > .nav-link {border: 1px solid #405189 !important;background-color: #E2E5ED !important;color: #000 !important;padding: 0.3rem 1.5rem !important;z-index: 1}*/
/*.tab_align .nav-pills .nav-link {border: 1px solid #DFDFDF !important;padding: 0.3rem 1.5rem !important;margin-left: -5px;background-color: #fff;}*/
.expand_align {
    border: 1px solid #DFDFDF !important;
    padding: 5px;
}

.no_data_img {
    width: 33%;
}

.monthly_tbody td {
    position: relative;
}

    .monthly_tbody td:focus, .monthly_tbody td:hover {
        background-color: #F0F0F6;
    }

.date_align {
    position: absolute;
    top: 6px;
    right: 6px;
}

.table_head {
    background-color: #F0F0F6;
}

.check-in {
    color: #0AB39C;
    font-size: 12px;
}

.check-out {
    color: #F06548;
    font-size: 12px;
}

.border_unset {
    margin-top: -20px;
}

.table_card {
    padding: 12px 8px 12px 8px;
}

    .table_card::-webkit-scrollbar {
        display: none;
    }

.calender_table {
    overflow-x: unset;
}

.check_align {
    margin-bottom: 0.5rem;
    font-weight: 500;
    color: #767679;
}

.calender_dd {
    width: 200px;
}
/* ================================================ MODAL ALIGN ===============================================================*/
.m_date_align {
    position: absolute;
    top: 34%;
    left: 35%;
}

.m-table td {
    padding: 2.3rem 0.4375rem;
    color: var(--para_color);
}

.m-content-align {
    position: absolute;
    top: 6px;
    font-weight: var(--font_weight_600);
}

.m_list_group .list-group-item {
    padding: 1.5rem 1rem;
}

    .m_list_group .list-group-item:nth-child(odd) {
        background: #F0F0F6;
    }

    .m_list_group .list-group-item:nth-child(1) {
        background: unset;
        color: #405189;
        font-weight: 500;
        font-size: 16px;
    }

.m_wekkly_table {
    height: 510px;
}

    .m_wekkly_table::-webkit-scrollbar {
        display: none;
    }

    .m_wekkly_table td {
        padding: 1.475rem 0.4375rem;
    }
/*================================================ SIGNUP PAGE CSS ===========================================================*/
.aligncenter {
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.re_correct {
    color: #0AB39C;
    background-color: #F3FBFA;
    border: 1px solid #0AB39C !important;
    padding: 5px 8px;
    float: right;
    font-size: 12px;
}

.un_vali {
    border: unset;
    border-bottom: 1px solid #0AB39C;
    border-radius: 0;
}

.incorrect {
    color: #F06548;
    background-color: #f0654814;
    border: 1px solid #F06548 !important;
    padding: 5px 8px;
    float: right;
    display: none;
}

.innercircle {
    width: 400px;
    height: 400px;
    border-radius: 50%;
    border: 1.5px dashed #40518920;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    position: absolute;
}

.main {
    width: 550px;
    height: 550px;
    border-radius: 50%;
    border: 1.5px dashed #40518950;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    position: absolute;
}

.form_focus {
    border: 1px solid #DFDFDF;
    background-color: #fff !important;
}

    .form_focus:focus {
        border: transparent;
        border-bottom: 1px solid #405189;
        border-radius: 0px;
    }

.support, .loginimg, .expen, .gps, .pay, .easy, .leave {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.support {
    width: 23%;
    z-index: 1;
    animation: support 50s linear infinite;
}

.loginimg {
    width: 70%;
    animation: loginimg 3s ease-in-out infinite;
}

.expen {
    width: 23%;
    z-index: 1;
    animation: expen 50s linear infinite;
}

.gps {
    width: 23%;
    z-index: 1;
    animation: gps 50s linear infinite;
}

.pay {
    width: 30%;
    height: 16%;
    text-align: center;
    z-index: 1;
    animation: pay 50s linear infinite;
}

.easy {
    width: 42%;
    height: 20%;
    text-align: center;
    z-index: 1;
    animation: easy 50s linear infinite;
}

.leave {
    width: 48%;
    height: 20%;
    text-align: center;
    z-index: 1;
    animation: leave 50s linear infinite;
}

    .leave .card-body {
        position: relative;
        padding: 8px;
    }

    .leave p {
        font-weight: 500;
        color: #0AB39C;
        text-align: left;
    }

    .leave img {
        width: 50%;
    }

.pay p {
    font-weight: 500;
    color: #F672A7;
    margin-bottom: 0px;
}

.easy p {
    font-weight: 500;
    color: #F7B84B;
    margin-left: 6px;
    text-align: left;
}

.pay .card-body {
    padding: 8px;
}

.pay img {
    width: 50%;
}

.box {
    height: 85vh;
    background-color: #F3F3F9;
    width: 90%;
    border-radius: 20px;
}

.calender_height {
    height: 267px;
}
/* ======================================= RECOVER PAGE CSS ============================================================*/
.lock_circle {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: rgba(64, 81, 137, 0.15);
}

.blue_circle {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(64, 81, 137, 0.15);
}

.reicon {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
}

.gray_circle {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: rgba(118, 118, 121, 0.1);
}

.gray_border {
    border: 1px solid #767679;
    border-radius: 10px;
}

    .gray_border h4 {
        color: #767679;
    }

    .gray_border .form-check-input {
        border: 1px solid #767679;
    }

.blue_border_recover {
    border: 1px solid #405189;
    border-radius: 10px;
}

.lock {
    width: 50%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
}

.radio_text {
    color: var(--para_color);
    font-weight: 400;
    font-size: 14px;
    padding-left: 6px;
}

.radio_check {
    width: 18px;
    height: 18px;
    border-color: #767679;
}

.form-floating > .form-control, .form-floating > .form-select {
    height: calc(2.5rem + 2px);
    line-height: 1.25;
}

.form-floating > label {
    padding: 10px 0.9rem;
    color: var(--para_color);
    font-weight: 400;
}

.radio_check:checked[type=radio] {
    background-image: url("../../assets/images/newimg/check1.svg");
    background-size: 10px;
    outline: 1px solid #405189;
    outline-offset: 2px;
}

.update_status {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background-color: #0AB39C;
}

.checkmark__circle {
    stroke-dasharray: 166;
    stroke-dashoffset: 166;
    stroke-width: 2;
    stroke-miterlimit: 10;
    stroke: #0AB39C;
    fill: #0AB39C;
    animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}

.checkmark {
    width: 65px;
    height: 65px;
    border-radius: 50%;
    display: block;
    stroke-width: 2;
    stroke: #fff;
    stroke-miterlimit: 10;
    margin: 10% auto;
    box-shadow: inset 0px 0px 0px #0AB39C;
    animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
}

.checkmark__check {
    transform-origin: 50% 50%;
    stroke-dasharray: 48;
    stroke-dashoffset: 48;
    animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
}
/*======================================== MASTER PAGE IN CITY ================================================*/
.filter_align {
    background-color: #FDF0ED;
    border: 1px solid #F06548;
}



.dro_menu.dropdown-menu.show {
    width: 118%;
}

.dro_item:hover {
    background-color: unset !important;
    color: unset !important;
}

.form_input {
    border: 1px solid #DFDFDF;
    margin-top: 0.4em;
}

    .form_input:checked[type=checkbox] {
        background-color: #0AB39C;
        border-color: #0AB39C;
    }

.c_alert_align {
    background-color: #DFF0FA;
    border-left: 3px solid #299CDB;
    border-radius: 0px;
    font-weight: 500;
}

.c_thead_color {
    background-color: #F0F0F6;
}

.c_border_align td, tfoot, tr {
    border: unset;
    border-bottom: 1px solid;
    padding: 20px 10px;
}

.delete {
    color: #F06548;
    font-weight: 500;
    cursor: pointer;
}

.edit {
    color: #405189;
    font-weight: 500;
    cursor: pointer;
}

.btn_confirm {
    border: 1px solid #0AB39C;
    color: #0AB39C;
    font-weight: 500;
}

    .btn_confirm:hover {
        background: #0AB39C;
        color: #fff;
    }

.btn_cancel {
    border: 1px solid #F06548;
    color: #F06548;
    font-weight: 500
}

    .btn_cancel:hover {
        background: #F06548;
        color: #fff;
    }

.file_align {
    opacity: 0;
    position: absolute;
}

.upload_file {
    border: 1px dashed #0AB39C;
    background-color: #E7F7F5;
    border-radius: 5px;
    padding: 5px;
}

.medical_file {
    border: 1px dashed #0AB39C;
    background-color: #E7F7F5;
    border-radius: 5px;
    padding: 5px;
    height: 98px;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .medical_file .form-control {
        width: 100%;
        height: 95px;
    }

.radio_align {
    width: 86px;
    height: 40px;
}

.radio_align_2 {
    width: 130px;
    height: 40px;
}

.o_radio_align {
    border: 1px solid #405189;
    background-color: #F0F0F6;
    border-radius: 5px;
}

.upload_bar {
    background-color: #E7F7F5;
    border: 1px solid #0AB39C;
    color: #000;
    font-weight: 600;
    font-size: 12px;
    text-align: left;
    padding-left: 9px;
}

.org_tick {
    float: right;
    position: relative;
    top: -29px;
    right: 8px;
    font-size: 17px;
    color: #0AB39C;
}

.back_btn {
    background-color: #E2E5ED;
    color: #767679;
    font-weight: 600;
}

.not_allowed {
    cursor: no-drop;
}

.select_box {
    border: 1px solid #405189;
    width: 80%;
    padding: 16px 10px 16px 35px;
    border-radius: 11px;
    background-color: #F0F0F6;
}

.select_box_gray {
    width: 80%;
}

.label_para {
    font-size: 12px;
    color: #767679;
}

.v-height {
    height: 95%;
}
/*========================================= EMPLOYEE PROFILE HEIGHT ==================================================*/
.profile_height {
    height: 100vh;
    width: 14.5%;
    border-radius: 0px !important;
    z-index: 2;
    position: fixed;
    top: 0;
    overflow-y: auto;
    overflow-x: hidden;
}

    .profile_height::-webkit-scrollbar {
        display: none;
        width: 6px;
        background: #f2f2f2;
    }

    .profile_height:hover::-webkit-scrollbar {
        display: block;
    }

    .profile_height:hover::-webkit-scrollbar-thumb {
        background: #ddd;
        border-radius: 10px;
    }

.profile_circle {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background-color: #405189;
}

.profile_icon {
    font-size: 76px;
    display: flex;
    justify-content: center;
}

.head_line {
    border: 1px solid #F3F3F3;
    width: 124px;
    position: relative;
    top: -15px;
    left: 95px;
}

.pro_head {
    color: var(--head_color);
}

.profile_navtab .nav-tabs {
    border-bottom: 1px solid #95A3D4;
}

    .profile_navtab .nav-tabs .nav-link.active {
        border-bottom: 2px solid #405189;
        color: #405189;
    }

    .profile_navtab .nav-tabs .nav-link:hover {
        border-color: unset;
    }

.profile_edit {
    font-size: 14px;
    color: #405189;
}

.profile_edit_font {
    color: #405189;
    font-size: 14px;
    font-weight: 500;
}

.profile_navtab .nav-link {
    color: #767679;
    font-weight: 500;
}

.profile_card_height {
    max-height: 230px;
    overflow: auto;
    height: 260px;
}

    .profile_card_height::-webkit-scrollbar {
        display: none;
    }

.pointer {
    cursor: pointer;
}

.cancel_btn {
    border-color: #a7a7a7;
    color: unset;
}

.cancel-button {
    background-color: #fef1f6;
    color: #F672A7;
    border: 1px solid #F672A7;
    padding: 8px;
}

.profile_tab_align .nav-pills .nav-link {
    width: 150px;
}

.pro_pay_select {
    border: 1px solid #F06548;
    padding: 0.5rem 1.7rem 0.5rem 0.9rem;
    color: #F06548 !important;
    height: 36px;
}

    .pro_pay_select:focus {
        border: 1px solid #F06548;
    }

    .pro_pay_select option {
        color: #F06548;
        font-weight: 500;
    }

.pay_view_color {
    color: #299CDB;
}

.download_view_color {
    color: #0AB39C;
}

.pay_view {
    font-size: 18px;
    font-weight: 600;
    position: relative;
    top: -1px;
}

.table_fixed {
    table-layout: fixed;
}

.total_align td {
    font-size: 18px;
}

.seprator {
    border: 1px solid #95a3d429;
    border-width: thin;
    position: relative;
    top: -17px;
    left: 136px;
    width: 88%;
}

.profile_circle_2 {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background-color: #405189;
}

.profile_icon_2 {
    font-size: 30px;
    display: flex;
    justify-content: center;
}

    .profile_icon_2::before {
        margin-top: 7px;
        color: #B2BDE1;
    }

.team_profile_header {
    position: relative;
    top: 6px;
    left: 10px;
}

.mb_5 {
    margin-bottom: 5px;
}

.team_icon {
    font-size: 16px;
    color: #405189;
}

.team_icon_text {
    margin-left: 20px;
    color: #405189;
    font-weight: 500;
}

.box_align {
    background-color: #E2E5ED;
    padding: 10px;
}

.team_profile_header h4 {
    max-width: 130px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document .list-group-item {
    padding: 14px 8px 14px 16px;
    z-index: 0;
    text-align: left;
    font-weight: 500;
    font-size: 14px;
    border-radius: 5px;
}

    .document .list-group-item.active {
        background-color: #E4E5F0 !important;
        border-color: #405189 !important;
        color: #405189 !important;
        font-weight: 500 !important;
    }

        .document .list-group-item.active::after {
            color: #405189;
            content: ">";
            float: right;
        }

    .document .list-group-item:hover {
        background-color: #E4E5F0;
        color: #405189;
        border: 1px solid #405189;
    }

.document_upload {
    border: 1px dashed #0AB39C;
    background-color: #E7F7F5;
    border-radius: 5px;
    padding: 5px;
    height: 120px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.medical_upload {
    border: 1px dashed #0AB39C;
    background-color: #E7F7F5;
    border-radius: 5px;
    padding: 5px;
    height: 95px;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .medical_upload .form-control {
        height: 95px;
        width: 93%;
    }

.document_upload .form-control {
    height: 163px;
    width: 100%;
}

.doc_upload_img { /*margin-left: 68px;*/
    margin-bottom: 20px;
}

.doc_icon::before {
    position: relative;
    top: 0px;
    font-size: 16px;
}

.icon_box {
    background-color: #DFF0FA;
    padding: 8px;
    border: 1px solid #299CDB;
    border-radius: 5px;
}

.doc_view_icon {
    font-size: 20px;
    color: #299CDB;
}

.team_bg {
    background-color: #E2E5ED;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px
}

#pills_submit_declaration, #pills_proof {
    padding: 1rem 1.8rem;
    border-radius: 0px;
    font-weight: 500
}

    #pills_submit_declaration.active, #pills_proof.active {
        background-color: #E2E5ED;
        color: #405189;
        font-weight: 600;
    }

.profile_invest_icon {
    font-size: 18px;
    position: relative;
    top: -17px;
    right: 10px;
}

.submit_declaration .ish {
    position: relative;
    top: -13px;
    color: #000;
}

.submit_declaration .accordion-item {
    border: unset;
}

.submit_declaration .accordion-button {
    border-left: 1px solid #0AB39C;
}

    .submit_declaration .accordion-button:not(.collapsed) {
        border-left: 1px solid #F06548;
        background-color: unset;
        z-index: 0;
        color: #F06548;
    }

    .submit_declaration .accordion-button:focus {
        z-index: unset;
    }

    .submit_declaration .accordion-button:hover {
        z-index: unset;
    }

.submit_declaration .accordion-body {
    border-left: 1px solid #F06548;
}

.pro_info_icon {
    font-size: 20px;
    color: #299CDB;
    padding-right: 10px;
    position: relative;
    top: -4px;
}

.info_alert {
    top: 0 !important;
    font-weight: 500;
}

.info {
    display: flex;
    align-items: center;
    border-radius: 3px;
    border-left: 3px solid #299CDB;
    background-color: #DFF0FA;
    height: 40px;
}

.info_red {
    display: flex;
    align-items: center;
    border-radius: 3px;
    border-left: 3px solid #F06548;
    background-color: #FDF0ED;
}

/*.curd_action i {
    font-size: 20px;
    padding: 0px 10px;
}*/

.add_icon {
    color: #0AB39C;
}

.trash_icon {
    color: #F06548;
}

.not_allowed {
    cursor: not-allowed;
}

.align_center {
    display: flex;
    align-items: center;
}

.top_align {
    position: relative;
    top: -2px;
}


.timepicker_icon {
    position: absolute;
    top: 2px;
    right: 10px;
    bottom: 0;
    font-size: 20px;
    color: #fff;
    font-weight: 700;
}

.time_picker_modal {
    transform: translate(0px, -8px);
    width: 302px;
}

.time_picker_modal_2 {
    transform: translate(0px, 2px);
    width: 306px;
}

.invest_para {
    font-weight: 500;
    color: #000;
}

.invest_ellipsis {
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ctc {
    color: #0AB39C;
    font-weight: 500;
    display: none;
}

.ampm_deactive {
    border: 1px solid #DFDFDF;
    background-color: #fff;
    font-weight: 600;
    margin-left: -7px;
    z-index: 0;
    color: #767679;
}

.ampm_active {
    border: 1px solid #405189;
    background-color: #E2E5ED;
    font-weight: 600;
    margin-left: -7px;
    z-index: 1
}

.caret_down, .caret_up {
    color: #D9D9D9;
    font-size: 20px;
    position: relative;
    left: 2px;
}

.caret_down {
    top: -6px;
}

.timepicker_modal {
    max-width: 700px !important;
}

.m-table td:first-child {
    font-weight: 400;
}

.degree_table th {
    color: #797979;
}

.degree_table thead th {
    color: #000;
}

.salary_circle {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.netpay_color {
    background-color: #EAF5FB;
}

.monthly_color {
    background-color: #FEF1F6;
}

.payment_color {
    background-color: #E7F7F5;
}

.dedcuction_color {
    background-color: #FDF0ED;
}

.netpaytext_color {
    color: #299CDB;
}

.monthlytext_color {
    color: #F672A7;
}

.paymenttext_color {
    color: #0AB39C;
}

.dedcuctiontext_color {
    color: #F06548;
}
/*======================================= REQUEST PAGE CSS =============================================================*/
.review_btn {
    padding: 10px 40px;
    top: 28px;
}

.request_align {
    border-bottom: 1px solid #95A3D4;
}

    .request_align .nav-link {
        padding: 0.5rem 1.8rem;
        line-height: unset;
        font-size: 14px;
    }

        .request_align .nav-link.active, .nav-pills .show > .nav-link {
            background-color: unset;
            color: #405189;
            border-bottom: 2px solid #405189;
            border-radius: 0px;
        }

.back_link a {
    font-size: 14px;
}

.req_btn {
    padding: 0.5em 0.8em;
    font-weight: 400;
    font-size: 16px;
}

.req_card .card-body {
    border: 1px solid #B8C1E2;
    border-radius: 5px;
}

.req_head {
    color: #212529;
    font-weight: 500;
    font-size: 15px;
    margin-left: 10px;
}

.req_card .btn {
    padding: 0.5rem 1.5rem;
}

.req_link {
    position: relative;
    top: 18px;
    right: 20px;
    font-weight: 500;
}

.req_status td {
    border: unset;
    border-bottom: 1px solid #DFDFDF;
    color: #767679;
}

    .req_status td:first-child {
        color: #000;
    }

.req_status .dropdown {
    cursor: pointer;
}

.req_status p {
    max-width: 174px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-bottom: 0px;
}

.req_dd {
    width: 23%;
    height: 44px;
    position: absolute;
    z-index: 1;
    border: 1px solid #405189;
    border-radius: 5px;
}

.req_dropdown .dropdown-item:focus, .dropdown-item:hover {
    background-color: #F6F8FF !important;
    color: #405189 !important;
}

.req_scroll {
    width: 312px;
    max-height: 260px;
    height: auto;
    overflow: auto;
}

    .req_scroll::-webkit-scrollbar {
        width: 3px !important;
        background: #DFDFDF !important;
        border-radius: 8px;
    }

    .req_scroll::-webkit-scrollbar-thumb {
        background-color: #405189;
        border-radius: 6px;
    }

.req_icon {
    position: absolute;
    top: 9px;
    right: 0;
    left: 282px;
    bottom: 0;
    z-index: 1;
    font-size: 14px;
    color: #405189;
}

.req_check.form-check-input:checked {
    background-color: #0AB39C;
    border-color: #0AB39C;
}
/*===================================== IMPORTANT DAY CSS 14-10-2022 ==========================================================*/
.birth_aviver_align span {
    font-size: 14px;
    color: #405189;
    font-weight: 500;
    margin-left: 10px;
}

.imporday_head p {
    color: #95A3D4;
}

.import_container img {
    width: 22px !important;
}

.import_container {
    border: 1px solid #B8C1E2;
    border-radius: 8px;
    background-color: #F3F3F9;
    padding: 10px 12px;
    margin-bottom: 12px;
}

.import_day {
    height: 65vh;
    overflow: auto;
}

    .import_day::-webkit-scrollbar {
        width: 3px !important;
        background: #DFDFDF !important;
        border-radius: 8px;
    }

    .import_day::-webkit-scrollbar-thumb {
        background-color: #405189;
        border-radius: 6px;
    }

.close-button {
    background-color: #FDF0ED;
    border-radius: 50%;
    padding: 0;
    color: #F06548;
    font-size: 24px;
    width: 26px;
    height: 26px;
    line-height: 0;
}

.import_date p {
    padding: 3px;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
}

.import_month p {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    padding: 4px;
    color: #fff;
}

.op_outline p {
    border: 1px solid #405189;
    color: #405189;
}

.op_label p {
    border: 1px solid #405189;
    background-color: #405189;
}

.disable_outline p {
    border: 1px solid #95A3D4;
    color: #95A3D4;
}

.disable_label p {
    border: 1px solid #95A3D4;
    background-color: #95A3D4;
}

.holidays_card {
    border: 1px solid #B8C1E2 !important;
}
/*============================================== DASHBOARD 18-10 ========================================================*/
.imageAnchor:focus img {
    outline: 2px solid #95A3D4;
    outline-offset: 2px;
}

.imageAnchor:focus span {
    outline: 2px solid #95A3D4;
    outline-offset: 2px;
}

.alert_success {
    background-color: #E7F7F5;
    border-radius: 0;
    border-left: 2px solid #0AB39C;
    border-bottom-left-radius: 2px;
    border-top-left-radius: 2px;
}

.dash_comp_name {
    font-weight: 500;
    cursor: pointer;
}

    .dash_comp_name.show {
        color: var(--head_color);
    }

.show .comp_icon {
    color: var(--head_color);
}

.comp_icon {
    font-size: 14px;
}

.dash_comp_dd .dropdown-menu {
    width: 400px;
    height: 86vh;
}

.triangle_mark, .admin_triangle_mark {
    width: 0;
    height: 0;
    border-left: 14px solid transparent;
    border-right: 13px solid transparent;
    border-bottom: 18px solid #fff;
    position: absolute;
    top: -18px;
    bottom: 0px;
}

.triangle_mark {
    left: 206px;
}

.triangle_2 {
    left: 246px;
}

.triangle_3 {
    left: 300px;
}

.triangle_4 {
    left: 352px;
}

.admin_triangle_4 {
    right: 8px;
}

.comp_profile {
    width: 130px;
    height: 130px;
    background-color: #EFF1F9;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .comp_profile img {
        width: 100%;
        height: 100%;
        border-radius: 50%; /*border: 1px solid #405189;*/
    }

.dash_support_dd .dropdown-menu {
    transform: translate(120px, 62px) !important;
}

.dash_notify_dd .dropdown-menu {
    transform: translate(64px, 64px) !important;
}

.user_profile_dd .dropdown-menu {
    transform: translate(0px, 70px) !important;
}

.notify_dd {
    width: 12px;
    height: 12px;
    background: #0AB39C;
    border-radius: 50%;
    position: absolute;
    left: 28px;
    z-index: 1;
    top: -3px;
}

.help_desk .green_btn {
    background-color: #E7F7F5 !important;
    border: transparent;
}

.help_desk .yellow_btn {
    background-color: #FEF8ED !important;
    border: transparent;
}

.help_desk .red_btn {
    background-color: #FDF0ED !important;
    border: transparent;
}

.help_desk .blue_btn {
    background-color: #EAF5FB !important;
    border: transparent;
}

.help_desk .accordion-button:not(.collapsed) {
    color: #000;
}

.year_select {
    width: 60%;
    padding: 0.5rem 1.7rem 0.5rem 1.7rem;
}

.download_icon::before, .cursor_icon::before {
    font-size: 18px;
}

.dash_download_btn {
    background-color: #E7F7F5;
}

.feeds_hover:hover {
    background-color: #FEF8ED;
    border-radius: 12px;
}

.feeds_hover:focus {
    background-color: #FEF8ED;
    border-radius: 12px;
}

.envlop_icon {
    color: #F06548;
    font-size: 18px;
}

.live_circle_1 {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #FDF0ED;
    display: flex;
    align-items: center;
    justify-content: center;
}

.live_circle_2 {
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background-color: #F06548;
}

.live_chat_head {
    padding-left: 14px;
    padding-top: 6px;
}

.live_chat_dd .dropdown-menu {
    transform: translate(-344px, 174px) !important;
    height: 70vh;
}

.live_chat_card .card-body {
    height: 52vh;
    overflow: auto;
}

    .live_chat_card .card-body::-webkit-scrollbar, .dash_notify_dd .card-body::-webkit-scrollbar {
        display: none;
        width: 3px !important;
        background: #DFDFDF !important;
        border-radius: 8px;
    }

    .live_chat_card .card-body:hover::-webkit-scrollbar, .dash_notify_dd .card-body:hover::-webkit-scrollbar {
        display: block;
    }

    .live_chat_card .card-body::-webkit-scrollbar-thumb, .dash_notify_dd .card-body::-webkit-scrollbar-thumb {
        background-color: #405189;
        border-radius: 6px;
    }

.dash_notify_dd .card-body {
    height: 78vh;
    overflow: auto;
}

.chat_bot_circle {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid #405189;
    display: flex;
    align-items: center;
    justify-content: center;
}

.chat_bot_text {
    background-color: #EFF1F9;
    border-radius: 8px;
}

.user_bot_text {
    background-color: #FEF7F6;
    border-radius: 8px;
}

.user_profile_chat {
    width: 20px;
    height: 20px;
    border-radius: 50%;
}

.chat_input {
    border: transparent;
}

.new_notify {
    background-color: #E7F7F5;
}

.dot_icon::before {
    font-size: 30px;
    color: #0AB39C;
}

.dash_user_profile img {
    width: 150px;
    height: 150px;
    border-radius: 50%
}

.cha_pass {
    font-size: 20px;
    position: absolute;
    right: 50px;
    color: #DFDFDF;
}

.old_pass {
    top: 53px;
}

.new_pass {
    bottom: 135px;
}

.change_pass_form .form-control {
    border-color: #DFDFDF;
}

.btn_outline_hover:hover {
    background-color: unset;
    color: #405189;
}

.v-center {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.plus_icon::before {
    font-size: 20px;
}

.x_icon::before {
    font-size: 20px;
    color: #ff0000;
}

.upload_pro {
    background: #DFDFDF;
}

.view_upload_btn {
    background-color: #DFF0FA;
    border: 1px solid var(--blue_color);
}

    .view_upload_btn i::before {
        color: var(--blue_color);
        font-size: 20px;
    }

.downdown_upload_btn {
    background-color: #E7F7F5;
    border: 1px solid var(--green_color);
}

    .downdown_upload_btn i::before {
        color: var(--green_color);
        font-size: 20px;
    }
/*=============================================== Select Picker  ==========================================================*/
.bootstrap-select .dropdown-menu {
    /* z-index: 9999 !important;*/
    width: 80%;
}

.bs-actionsbox .btn-group button {
    font-weight: 500;
    font-size: 13px;
}

.dropdown-item {
    font-weight: 500
}

.bootstrap-select .bs-ok-default:after {
    border-color: #0AB39C;
}

.form-label {
    font-weight: 500;
}

.dropdown-item:focus, .dropdown-item:hover {
    background-color: #f3f6f9 !important;
}

/*=============================================== DATA TABLE CSS ==========================================================*/
/*data table css */
.tablehead_sticky {
    position: sticky;
    top: 0;
    z-index: 1;
}

table.dataTable > tbody > tr > td {
    max-width: 144px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dataTables_length .form-select {
    height: 40px !important;
    padding: 0.5rem 1.5rem 0.5rem 0.5rem !important;
    background-position: right 0.5rem center !important;
}

.table-sm {
    max-height: 400px;
    min-height: fit-content;
    overflow: auto;
}

.dtfc-has-left {
    z-index: 0;
}

.view_table.dataTable thead > tr > th.sorting, table.dataTable thead > tr > th.sorting_asc, table.dataTable thead > tr > th.sorting_desc, table.dataTable thead > tr > th.sorting_asc_disabled, table.dataTable thead > tr > th.sorting_desc_disabled, table.dataTable thead > tr > td.sorting, table.dataTable thead > tr > td.sorting_asc, table.dataTable thead > tr > td.sorting_desc, table.dataTable thead > tr > td.sorting_asc_disabled, table.dataTable thead > tr > td.sorting_desc_disabled {
    padding-right: 80px;
}

div.dataTables_wrapper div.dataTables_filter input {
    border: 1px solid #95A3D4;
    border-radius: 5px;
    height: 40px;
}

.bootstrap-select > .dropdown-toggle {
    height: 40px !important;
}

.dataTables_scrollHeadInner, .dataTable {
    width: 100% !important;
}

.bd_table.dataTable thead > tr > th.sorting, table.dataTable thead > tr > th.sorting_asc, table.dataTable thead > tr > th.sorting_desc, table.dataTable thead > tr > th.sorting_asc_disabled, table.dataTable thead > tr > th.sorting_desc_disabled, table.dataTable thead > tr > td.sorting, table.dataTable thead > tr > td.sorting_asc, table.dataTable thead > tr > td.sorting_desc, table.dataTable thead > tr > td.sorting_asc_disabled, table.dataTable thead > tr > td.sorting_desc_disabled {
    padding-right: 120px;
}

.pd_table.dataTable thead > tr > th.sorting, table.dataTable thead > tr > th.sorting_asc, table.dataTable thead > tr > th.sorting_desc, table.dataTable thead > tr > th.sorting_asc_disabled, table.dataTable thead > tr > th.sorting_desc_disabled, table.dataTable thead > tr > td.sorting, table.dataTable thead > tr > td.sorting_asc, table.dataTable thead > tr > td.sorting_desc, table.dataTable thead > tr > td.sorting_asc_disabled, table.dataTable thead > tr > td.sorting_desc_disabled {
    padding-right: 130px;
}

div.dataTables_wrapper div.dataTables_paginate ul.pagination {
    margin-top: 10px !important;
}
/*div.dataTables_wrapper div.dataTables_paginate {
    margin-top: 10px !important;
}*/
.col_datafix.dataTable > tbody > tr > td {
    background-color: #fff;
    border: unset;
    border-bottom: 1px solid #DFDFDF;
}

.col_datafix.dataTable > thead > tr > th {
    background-color: #F0F0F6;
}

.col_datafix .dtfc-fixed-left {
    z-index: 2;
}

.col_datafix .dtfc-fixed-right {
    border-left: 1px solid #95A3D4;
}

.org_logo {
    border-radius: unset !important;
}

.dataTables_scrollBody::-webkit-scrollbar-thumb {
    background-color: #DFDFDF;
    border-radius: 12px;
}

.dataTables_scrollBody::-webkit-scrollbar {
    background-color: #fff;
    width: 5px;
    height: 5px;
}

.filter_btn {
    background-color: #EFF1F9;
    color: #405189;
    font-weight: 500;
}

    .filter_btn:focus {
        border: 1px solid #95A3D4;
    }

.dataTables_length {
    /*display: none;*/
}

table.dataTable thead > tr > th.sorting:before, table.dataTable thead > tr > th.sorting_asc:before {
    bottom: 50%;
    content: ">" !important;
    transform: rotate(270deg) !important;
    color: #95A3D4;
    font-size: 14px !important;
}

table.dataTable thead > tr > th.sorting_asc:before {
    opacity: 1;
}

table.dataTable thead > tr > th.sorting:after, table.dataTable thead > tr > th.sorting_asc:after {
    bottom: 39%;
    content: ">" !important;
    transform: rotate(90deg);
    color: #95A3D4;
    font-size: 14px !important;
}

table.dataTable thead > tr > th.sorting_desc:after {
    opacity: 1;
}

/*============================================ ATTENDANCE CSS ==============================================================*/
.reportrange {
    background: #EFF1F9;
    cursor: pointer;
    padding: 10px 0px 10px 10px;
    width: 20em;
    border-radius: 5px;
    color: #405189;
    font-weight: 500;
    height: 40px;
}

.week_calender_icon {
    padding: 12px 12px;
    background: #405189;
    position: absolute;
    right: 12px;
    top: 27px;
    border-radius: 5px;
    color: #fff;
}

.week_calender_icon_2 {
    padding: 12px 12px;
    background: #405189;
    position: absolute;
    left: 220px;
    top: 0px;
    border-radius: 5px;
    color: #fff;
}

.week_calender_icon::before {
    font-size: 16px;
    position: relative;
    top: -1px;
}

.approve_btn {
    border: 1px solid #0AB39C;
    background-color: #E7F7F5;
    color: #0AB39C;
    padding: 8px;
    font-weight: 400;
}

.reject_btn {
    border: 1px solid #F06548;
    background-color: #FDF0ED;
    color: #F06548;
    padding: 8px;
    font-weight: 400;
}

.pending_btn {
    border: 1px solid #95A3D4;
    background-color: #F4F6FB;
    color: #95A3D4;
    padding: 8px;
    font-weight: 400;
}

.close_btn_offcan {
    background-color: #F3F3F9;
    border-radius: 50%;
    padding: 0;
    color: #95A3D4;
    width: 14px;
    height: 14px;
    line-height: 0;
}

.attendance_history_offcamp {
    width: 700px;
}

.table_borderless.table td {
    border: unset;
    border-bottom: 1px solid #DFDFDF;
}
/*.semi_circle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 100px;
    width: 100px;
    border-radius: 50%;
    background: rgba(0,0,0,0.7);
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 1;
}*/
.semi_circle {
    position: absolute;
    top: 75%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 50px;
    width: 100px;
    background: rgba(0,0,0,0.25);
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 1;
    border-radius: 0px 0px 150px 150px;
}

    .semi_circle:hover {
        opacity: 1;
    }

.request_align .nav-link:hover {
    background-color: unset;
    color: #405189;
    /*  border-bottom: 2px solid #405189;*/
    border-radius: 0px;
}

.request_align .unnav_link:hover {
    border-bottom: unset;
    color: #405189 !important;
}

.form_check_as {
    width: 20px;
    height: 20px;
}

.sc_tble.dataTable thead > tr > th.sorting {
    padding-right: 90px;
}

.m_46 {
    margin-top: -46px;
}

.m_40 {
    margin-top: -35px !important;
}

/*====================================================== LEAVE PAGE CSS ===================================================*/
.leave_balance_table tbody {
    border: unset;
}

.leave_balance_table td {
    border: unset;
    border-bottom: 1px solid #DFDFDF;
    color: #767679;
    font-size: 13px !important;
}

.leave_balance_table td {
    padding: 1.2em;
}

.date_pciker {
    position: relative;
}

.leave_cal_icon {
    background: #405189;
    position: absolute;
    top: 27px;
    right: 0px;
    border-radius: 5px;
}

.leave_cal_iconn {
    background: #405189;
    position: absolute;
    top: 27px;
    border-radius: 5px;
    right: 12px;
}

.leave_clock_icon {
    background: #405189;
    position: absolute;
    top: 8px;
    border-radius: 5px;
    right: 12px;
}

.leave_counts {
    color: #212529;
}

.clock_icon {
    padding: 10px;
}

.cal_icon {
    padding: 1em;
}

.leave_date_details {
    max-height: 300px;
    overflow-y: scroll;
    background: #F0F0F6;
    border: 1px solid #95A3D4;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

body::-webkit-scrollbar {
    width: 6px;
}

body::-webkit-scrollbar-thumb {
    background: #95A3D4;
    border-radius: 5px;
}

.leave_date_details::-webkit-scrollbar {
    width: 3px;
}

.leave_date_details::-webkit-scrollbar-thumb {
    background: #95A3D4;
    border-radius: 5px;
}

.select_day_type {
    border: 1px solid #95A3D4;
}

.upfile_center_align {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.total_leave_days {
    height: 50px;
    background: #405189;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.btn_submit {
    width: 80px;
}

.medi_doc {
    border: 1px dashed #0AB39C;
    background-color: #E7F7F5;
    border-radius: 5px;
    padding: 0.8em;
}

.Leave_medi_doc {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.gs_position_align {
    position: relative;
    top: 28px;
    z-index: 1
}
/*=========================================== ATTENDANCE SUMMARY CSS ==================================================*/
.drag_card {
    background-color: #F3F3F9;
    border: 1px solid #B8C1E2;
}

.p-12 {
    padding: 12px;
}

.red_alert {
    border-radius: 0px;
    border-left: 2px solid #F06548;
}

.filter_count {
    width: 20px;
    height: 20px;
    /*left: 89% ;*/
    left: 86%;
}

.select_more {
    width: 100%;
    height: 40px;
    background-color: #fff;
    border-radius: 5px;
    border: 1px solid #DFDFDF;
}

.select_multi_dd {
    max-height: 20rem;
    height: auto;
    overflow: auto;
}

.blue_border {
    border: 1px solid #95A3D4;
    padding: 10px 20px;
    border-radius: 5px;
}

.pay_count {
    padding: 1px 1px;
    position: relative;
    left: -4px;
    top: -10px;
    color: #F672A7;
}
/*======================================================= FINANACE CSS ==========================================================*/
.submenu_header {
    background-color: #E1E3EE;
    border-radius: 5px;
}

    .submenu_header .navbar-nav .nav-link {
        color: var(--para_color) !important;
    }

    .submenu_header .navbar-nav > .nav-item .nav-link.active {
        color: var(--head_color) !important;
        border-bottom: 2px solid #405189;
    }

    .submenu_header .navbar-nav .nav-link:hover {
        color: var(--head_color) !important;
    }

#week_btn {
    display: none !important;
}

.cursor_drag {
    cursor: move;
}

.form-switch-lg .form_check_radio:checked {
    background-color: #95A3D4;
    border-color: #95A3D4;
    opacity: 0.6;
}

.form-switch .form_check_radio:checked {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
}

.form-switch-lg .form_check_radio {
    width: 46px;
    height: 24px;
}

.table_switch .form_check_radio {
    width: 42px;
    height: 20px;
}

.ellipsis {
    max-width: 144px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ellipsis_2 {
    max-width: 360px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.divOptionsesySelect {
    display: block !important;
}
/*================================================= ACTIVITY CSS ======================================================*/
.timealert {
    border-radius: 5px;
    position: absolute; /*width: 60rem;*/
    left: 46px;
    top: 4px;
}

.pro_cir {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 10px;
    margin-left: -4px;
}

.activi_line {
    width: 5px;
    height: 50px;
    border-radius: 7px;
}

.sh_none {
    box-shadow: unset;
}

.g_border {
    border-left: 3px solid #0AB39C !important;
}

.notify_active.active {
    background-color: #ECEEF3;
    border: unset;
}

.bs-actionsbox .btn-group {
    display: flex !important;
}

.notify_cb {
    height: 60vh;
    overflow: auto;
}

.appsetup {
    border: 1px solid #95A3D4;
    box-shadow: unset;
    border-radius: 5px !important;
}

.appsetup_header {
    border-bottom: 1px solid #95A3D4 !important;
}

.deacti a {
    color: var(--red_color);
    font-weight: 500;
}

.edit_i a {
    color: var(--th-color);
    font-weight: 500;
}

.activ_g a {
    color: var(--green_color);
    font-weight: 500;
}

.filter_of {
    overflow-X: overlay;
}

    .filter_of::-webkit-scrollbar {
        display: none;
    }
/*============================================= scroll bar align ==================================================*/
.com_scroll::-webkit-scrollbar {
    width: 3px;
    background: #f2f2f2;
}

.com_scroll::-webkit-scrollbar-thumb {
    background-color: #405189;
    border-radius: 3px;
}

.com_scroll_2::-webkit-scrollbar {
    width: 6px;
    background: #f2f2f2;
}

.com_scroll_2::-webkit-scrollbar-thumb {
    background-color: #DFDFDF;
    border-radius: 3px;
}

/*============================================= DATE RANGE CSS ==================================================*/
/*form check toggle*/
.form-switch .form-check-input {
    background-position: left center;
}

.form-switch-lg .form-check-input {
    background-color: #95A3D4;
    border-color: #95A3D4;
    opacity: 0.6;
}

.form-switch-lg .form_check_radio:checked {
    background-color: #405189;
    border-color: #405189;
    opacity: unset;
}

.form-switch .form-check-input:checked {
    background-position: right center;
}
/*date range*/

.daterangepicker .calendar-table thead tr:nth-child(2) th {
    background-color: #E2E5ED !important;
    border-radius: 0px;
}

.daterangepicker .calendar-table td {
    padding: 5px 10px !important;
    border-radius: 0px !important;
    border: unset !important;
}

.daterangepicker .calendar-table tr {
    border-bottom: unset !important;
}

.daterangepicker td.active {
    background-color: #405189 !important;
    border-radius: 5px !important;
}

.daterangepicker td.in-range {
    background-color: #F0F0F6 !important;
}

.daterangepicker td.off, .daterangepicker td.off.in-range, .daterangepicker td.off.start-date, .daterangepicker td.off.end-date {
    background-color: #fff !important;
}

.daterangepicker td.active, .daterangepicker td.active:hover {
    background-color: #405189 !important;
}

.opensleft {
    left: 8.3rem !important;
}

.pos_center {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.ndicons {
    width: 120px;
    opacity: 0.3;
}

.img_text_center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, 380%);
}
/*.daterangepicker.opensleft:after {
left: 10px !important;
}
.daterangepicker.opensleft:before {
left: 10px !important;
}*/
/*month year calender*/
.month-year-input {
    width: 100% !important;
}

/*.month-picker, .month-picker-month-table {
background: #fff;
width: 19.2rem;
}
*/
.month-picker table {
    border-collapse: collapse !important;
    height: 30px;
}

.month-picker-header {
    margin: unset !important;
}

.month-picker-year-table {
    background: #E2E5ED !important;
}

    .month-picker-year-table tr td {
        border: unset;
    }

    .month-picker-year-table .month-picker-title .ui-button {
        font-weight: 500 !important;
    }

.ui-state-highlight {
    color: unset !important;
}

.month-picker-month-table .ui-button {
    color: #000;
}

.form-control {
    height: 40px;
}

.month-picker-month-table td:hover {
    background: #eee;
}

.month-picker-month-table td :active {
    background: #405189;
    color: #fff;
}

.cancelBtn {
    border: 1px solid #405189 !important;
    color: #405189 !important;
}

.drp-selected {
    display: none !important;
}

.daterangepicker .drp-buttons .btn {
    padding: 8px 26px;
}

.daterangepicker .ranges li.active {
    background-color: #F0F0F6 !important;
    border: 1px solid #405189 !important;
    color: #000 !important;
}

.datepicker table tr td span.active.active {
    background-color: #405189 !important;
}

.monthselect, .yearselect {
    border: 1px solid #ced4da;
    border-radius: 3px;
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: '';
    line-height: 1.2;
    text-align: center;
}

/*=========================================== EDITOR PLUGIN CSS ======================================================*/
.tox .tox-tinymce, .tox .tox-editor-container {
    z-index: 0;
}

.tox .tox-tbtn svg {
    fill: #000 !important;
}

.tox .tox-mbtn__select-label {
    font-weight: 500 !important;
    font-family: 'Poppins' !important;
}

.tox .tox-tbtn--enabled, .tox .tox-tbtn--enabled:hover {
    background: #F3F3F9 !important;
}

.tox .tox-tbtn:hover {
    background: #F3F3F9 !important;
}

.tox .tox-insert-table-picker .tox-insert-table-picker__selected {
    background: #F3F3F9 !important;
    border-color: #95A3D4 !important;
}

.tox .tox-button {
    background-color: #405189 !important;
    border-color: #405189 !important;
}

.tox .tox-button--secondary {
    background-color: unset !important;
    border-color: #405189 !important;
    color: #405189 !important;
}

.tox .tox-selectfield select:focus {
    border-color: #95A3D4 !important;
}

.tox .tox-listboxfield .tox-listbox--select:focus, .tox .tox-textarea:focus, .tox .tox-textfield:focus {
    border-color: #95A3D4 !important;
}

.tox-icon {
    color: #fff !important;
}

.tox .tox-mbtn--active {
    background: #F3F3F9 !important;
}

.tox .tox-mbtn:hover:not(:disabled):not(.tox-mbtn--active) {
    background: #F3F3F9 !important;
}

.tox .tox-collection--list .tox-collection__item--active {
    background: #F3F3F9 !important;
    color: #000 !important;
}

.tox.tox-tinymce.tox-fullscreen {
    /* z-index: 99999 !important;*/
}

.month-year-input {
    width: 100% !important;
}

.month-picker, .month-picker-month-table {
    background: #fff;
    width: 19.2rem;
}

    .month-picker table {
        border-collapse: collapse;
        height: 30px;
    }

.month-picker-header {
    margin: unset;
}

.month-picker-year-table {
    background: #E2E5ED !important;
}

    .month-picker-year-table tr td {
        border: unset;
    }

    .month-picker-year-table .month-picker-title .ui-button {
        font-weight: 500;
    }

.ui-state-highlight {
    color: unset !important;
}

.month-picker-month-table .ui-button {
    color: #000;
}

.form-control {
    height: 40px;
}

.month-picker-month-table td:hover {
    background: #eee;
}

.month-picker-month-table td :active {
    background: #405189;
    color: #fff;
}
/*=========================================== PAGE LOADER CSS ======================================================*/
.overlay {
    background: /*#e6e6e6c7*/ #ffffff8f url('/Assests/NewDesign/assets/images/newimg/loader.gif') center no-repeat;
    position: fixed;
    height: 100%;
    width: 100%;
    z-index: 99999;
    top: 0;
    left: 0;
    float: left;
    text-align: center;
    padding-top: 25%;
    cursor: not-allowed;
    display: none;
}

/*=========================================== TABLE LOADER CSS ======================================================*/
.dp {
    top: 8px;
    right: 8px;
}

.appemp_align {
    max-height: 67vh;
    height: fit-content;
}

.week_g_color {
    background-color: #FEF8ED;
    border: 1px solid #F7B84B;
}

.week_p_color {
    background-color: #FEF1F6;
    border: 1px solid #F672A7;
}

.week_r_color {
    background-color: #FDF0ED;
    border: 1px solid #F06548;
}

.week_b_color {
    background-color: #EAF5FB;
    border: 1px solid #299CDB;
}

.picktime {
    position: relative;
}

    .picktime::-webkit-calendar-picker-indicator {
        width: 42px;
        height: 42px;
        border-radius: 5px !important;
        right: 0;
        position: absolute;
        background: url('/Assests/NewDesign/assets/images/newimg/new-clock.svg');
        background-repeat: no-repeat;
    }

#bs .dropdown-toggle:focus, #bs > select.mobile-device:focus + .dropdown-toggle {
    outline: unset !important;
    outline-offset: unset !important;
    border-color: var(--vz-input-focus-border) !important;
}

.dash_user_profile span {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    background-color: #405189;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.visible {
    animation: movein 0.5s ease forwards, moveout 0.5s 3s ease forwards;
}

.badge {
    font-weight: unset;
}
/*=========================================== ADMIN CSS ======================================================*/
.vertical_border {
    border-right: 1px solid #DFDFDF;
}

.admin_icons {
    width: 20px;
}

.ws_nowrap {
    white-space: nowrap;
}

.c_alert_bg_r {
    background-color: #FDF0ED;
    border-left: 3px solid #F06548;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    font-weight: 500;
}

.box_disabled:disabled {
    background: #C6CBDD;
}

.onboard_table td {
    padding: 0.875rem 0.4375rem;
}

.dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}
/*=========================================== ADMIN PAYRUN PROCESS ======================================================*/
.additional_wd {
    background-color: #F3F3F9 !important;
}

.lop_table td, tfoot, tr {
    border: unset !important;
}

.radio_align_pay {
    width: 110px;
    padding-left: 0.8rem;
    margin-right: 0px;
}

.days_modal {
    max-height: 450px;
    overflow: auto;
    min-height: fit-content;
}

.select_chevron {
    position: absolute;
    right: 20px;
    top: 10px;
    -webkit-text-stroke: 1px;
    font-size: 11px;
}

.select_chevron_2 {
    position: absolute;
    right: 24px;
    top: 36px;
    -webkit-text-stroke: 1px;
    font-size: 11px;
}

.addloan_h {
    height: 60vh;
}

.addloan_align {
    max-height: 65vh;
    min-height: fit-content;
    overflow: auto;
}

.fixTableHead thead {
    position: sticky;
    top: 0;
    z-index: 1;
}

.fixTableHead table {
    border-collapse: collapse;
    width: 100%;
}

.import_mark {
    filter: brightness(0) saturate(100%) invert(72%) sepia(72%) saturate(462%) hue-rotate(339deg) brightness(101%) contrast(94%);
}

.bootstrap-select > .dropdown-toggle.bs-placeholder:focus {
    border: 1px solid #95A3D4 !important;
}

.cnt_tr {
    border: 1px solid #95A3D4 !important;
    background: #F3F3F9;
}

.tx_align {
    position: absolute;
    top: 18px;
    right: 20px;
}

.tx_align_2 {
    position: absolute;
    bottom: 10px;
    right: 48px;
}

.cmth {
    max-height: 62vh;
    min-height: fit-content;
}

.acc_height {
    max-height: 50vh;
    min-height: fit-content;
    overflow: auto;
}

.to-do-footer {
    position: absolute;
    bottom: 0;
    left: 40%;
}

.to-do-height {
    max-height: 86vh;
    overflow: auto;
    height: 86vh;
}

.nodata {
    background: url(/Assests/NewDesign/assets/images/newimg/nodata.svg) no-repeat center;
    height: 50vh;
    background-size: 320px;
    margin: auto;
}

.bo_line .list-group-item {
    border: unset;
}

.invest_file {
    opacity: 0;
    position: absolute;
    width: 7% !important;
}

.da_h4 {
    font-size: 36px;
    font-weight: 600;
}

.da_img {
    width: 44%;
    position: absolute;
    right: 30px;
    bottom: 90px;
}

.admin_nav .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: #405189;
    border-color: #95A3D4;
    border-bottom: 0;
}

.admin_nav .nav-link {
    color: var(--para_color);
}

.admin_nav .nav-tabs {
    border-bottom: 1px solid #95A3D4;
}

.asmin_su_card {
    min-height: 45vh;
    max-height: fit-content;
}

.floating {
    animation-name: floating;
    animation-duration: 4s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

.floating_2 {
    animation-name: floating;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

/*=============================================== LOGIN PAGE ANIMATION CSS ======================================================*/
@keyframes gps {
    0% {
        transform: rotate(0deg) translate(130px, -250px) rotate(0deg);
    }

    100% {
        transform: rotate(360deg) translate(130px, -250px) rotate(-360deg);
    }
}

@keyframes leave {
    0% {
        transform: rotate(0deg) translate(-120px, -220px) rotate(0deg);
    }

    100% {
        transform: rotate(360deg) translate(-120px, -220px) rotate(-360deg);
    }
}

@keyframes expen {
    0% {
        transform: rotate(0deg) translate(120px, 250px) rotate(0deg);
    }

    100% {
        transform: rotate(360deg) translate(120px, 250px) rotate(-360deg);
    }
}

@keyframes easy {
    0% {
        transform: rotate(0deg) translate(-130px, 200px) rotate(0deg);
    }

    100% {
        transform: rotate(360deg) translate(-130px, 200px) rotate(-360deg);
    }
}

@keyframes support {
    0% {
        transform: rotate(0deg) translate(-200px) rotate(0deg);
    }

    100% {
        transform: rotate(360deg) translate(-200px) rotate(-360deg);
    }
}

@keyframes pay {
    0% {
        transform: rotate(0deg) translate(250px) rotate(0deg);
    }

    100% {
        transform: rotate(360deg) translate(250px) rotate(-360deg);
    }
}
/*========================================= HOME PAGE CIRCLE PROGRESS CSS ANIMATION ==================================================*/
@keyframes loginimg {
    0% {
        transform: translate(0, 0px);
    }

    50% {
        transform: translate(0, 15px);
    }

    100% {
        transform: translate(0, -0px);
    }
}
/*=========================================== DASHBOARD PROGRESS BAR CSS ============================================================*/
@keyframes fill {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(135deg);
    }
}

@keyframes fill-blue {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(180deg);
    }
}

@keyframes fill-pink {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(45deg);
    }
}

@keyframes fill-red {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(92deg);
    }
}
/*====================================== PASSWORD UPDATE ANIMATION ============================================================*/
@keyframes stroke {
    100% {
        stroke-dashoffset: 0;
    }
}

@keyframes scale {
    0%, 100% {
        transform: none
    }

    50% {
        transform: scale3d(1.1, 1.1, 1);
    }
}

@keyframes movein {
    0% {
        transform: translateX( 110% );
    }

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

@keyframes moveout {
    0% {
        transform: translateX( 0 );
        opacity: 1;
    }

    100% {
        transform: translateX( 110% );
        opacity: 0;
    }
}
/*dashboard empty*/
@keyframes floating {
    0% {
        transform: translate(0, 0px);
    }

    50% {
        transform: translate(0, 15px);
    }

    100% {
        transform: translate(0, -0px);
    }
}

@keyframes floating_2 {
    0% {
        transform: translate(0, 0px);
    }

    50% {
        transform: translate(0, 15px);
    }

    100% {
        transform: translate(0, -0px);
    }
}