/****** Data bank dashboard UI  ***********/
/*@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap');*/
/*body {
    font-family: 'Roboto Slab' !important;
   
    font-family: 'Roboto', sans-serif;
}*/
.databank_top {
   display:block;
}

    .databank_top .card {
        background-color: white !important;
        box-shadow: 0px 0px 30px 0px rgb(82 63 105 / 5%);
        color: #7C8DA7;
        border-radius: 15px !important;
    }

.approval_tracker {
    color: #7C8DA7;
    font-weight: bold;
    font-size: 16px;
    display: block;
   
}

    .approval_tracker.card.svg-icon.svg-icon-white svg g [fill] {
        color: #3A7CE9 !important;
    }


.approval_count {
    display: block;
    font-size: 24px;
    font-weight: bold;
    color: #302D2D;  position: relative;
  

}


.salary_section {
    background-color: #3A7CE9;
    padding-top: 50px;
}


    .salary_section a {
        color: white;
        font-family: "Poppins";
        font-size: 22px;
        font-weight: 500;
        display: block
    }

    .salary_section a span { font-size:15px; color:white; word-break:break-word;}

.salary_text {
}

.total_salary {
    display: flex;
    font-size: 25px;
    color: white;
    padding: 4px;
    width:100%;
    margin: 0px;
    border: 1px dashed #fff;
    border-radius: 25px;
    padding-left: 20px;
}

.border_right {
    border-right: 1px dashed #76a5f3;
    height: 170px;
}
.border_left {
    border-left: 1px dashed #76a5f3;
    height: 90px;
}
.loan {
    display: block;
    position: relative;
}

.loan_balance {margin-top:10px;}

.loan_balance a {
    font-size: 30px;
    font-weight: normal;
    color: white;
    background-color: #3A7CE9;
    border-radius: 25px; padding:4px 10px;
}

.icon_left {
    float: left;
    margin-right: 10px;
}

.approval_icon {
    
    margin-right: 12px;
}

    .approval_icon img {
        width: 30px;
        height: 39px;
    }



    .card_arrow {
        position: absolute;
        right: 20px;
        top: 75px;
    }

.font-size-h3 {
    font-size: 12px !important;
}

.active_employee {}

    .active_employee a {
       
        color: #3F4254 !important;
     
    }


.pre_env_appr {}
.pre_env_appr img { margin-right:12px;
}

.pre_env_count {
    width: 30px;
    height: 30px;
    border-radius: 25px;
    background-color: #E5E5E5;
    color: #3a7ce9;
    text-align: center;
    padding: 5px;
    font-weight: 800;
    font-size: 14px;
}

    .pre_env_count span {
        color: #3A7CE9
    }



    .active_employee_icon {
        margin-right: 12px;
    }


        .active_employee_icon img {
            margin-right: 12px;
           
        }



.bottom_border {
    border-bottom: 1px dotted #c2c2c2;
    padding-bottom: 10px;
    margin-bottom: 10px;
}


.events_dashboard {}

    .events_dashboard.card {
        border-radius: 15px !important;
        padding: 10px;
    }


.events_databank {
    padding: 2px 5px 0px 5px;
}


.event_1 {
    border-right: 1px solid #dfdfdf;
    width: 50%;
    margin-right: 10px;
}


    .event_1 img {margin-bottom:10px; 

                  max-width:100%;
    }


.event_1 h6 {padding:0px; margin:0px; font-size:14px;}

    .event_1 p {
        padding: 0px;
        margin: 0px;
        font-size: 12px;
        color: #979797;
    }

.event_1 span {
    font-size: 12px;
    color: #979797;
    padding: 0px;
    margin: 0px;
}






    .event_2 {
        text-align: right;
    }




.event_2 h6 {
    padding: 0px;
    margin: 0px;
    font-size: 14px;
}

.event_2 p {
    padding: 0px;
    margin: 0px;
    font-size: 12px;
    color: #979797;
}

        .event_2 span {
            font-size: 12px;
            color: #979797;
            padding: 0px;
            margin: 0px;
        }








        .event_2 img {
            margin-bottom: 10px;
            max-width: 100%;
        }




    .middile_section {
    }





.middile_section .card {
    background-color: white !important;
    box-shadow: 0px 0px 30px 0px rgb(82 63 105 / 5%);
    color: #7C8DA7;
    border-radius: 15px !important;
}



.gutter-b {
    border-radius: 15px !important;
    box-shadow: 0 10px 16px 0 rgb(0 0 0 / 0%), 0 6px 20px 0 rgb(0 0 0 / 8%) !important;
}


.pie-chart {
    background: radial-gradient( circle closest-side, white 0, white 41.58%, transparent 41.58%, transparent 66%, white 0 ), conic-gradient( #4e79a7 0, #4e79a7 38%, #f28e2c 0, #f28e2c 61%, #e15759 0, #e15759 77%, #76b7b2 0, #76b7b2 87%, #59a14f 0, #59a14f 93%, #edc949 0, #edc949 100% );
    position: relative;
    width: 160px;
    min-height: 158px;
    margin: 0;
}

    .pie-chart h2 {
        position: absolute;
        margin: 1rem;
    }

    .pie-chart cite {
        position: absolute;
        bottom: 0;
        font-size: 80%;
        padding: 1rem;
        color: gray;
    }

    .pie-chart figcaption {
        position: absolute;
        bottom: 2em;
        right: -15em;
        font-size: smaller;
        text-align: right;
        font-size: 12px;
        font-family: 'Poppins';
    }

    .pie-chart span:after {
        display: inline-block;
        content: "";
        width: 0.8em;
        height: 0.8em;
        margin-left: 0.4em;
        height: 0.8em;
        border-radius: 0.2em;
        background: currentColor;
    }




.pf_applicablity {margin:0px; padding:0px;}

.pf_count {display:flex;}

.pf_no {
    display: flex;
    font-size: 20px;
    color: #04040c;
    font-weight: 600;
}
    .pf_no span {
        margin-left: 20px;
        color: #3a7ce9;
        font-weight: bold;
    }

.pf_yes {
    font-size: 16px;
    color: #3a7ce9;
    font-weight: 600;
}
/********  ESSP Dashboard CSS  *********************/
.events_essp {
    margin-bottom: 40px;
}


.events_essp a img { width:100%;
}


.events_content {
    background-color: white;
    padding: 10px; width:100%;
}



.top_search_container {margin:0px 0px 10px 0px;}

.search_essp {
    width: 55%;
    margin: 10px 10px 0px 10px;
}

.search {
    border: none;
    border-radius: 20px;
    height: 50px;
    padding: 10px;
    width: 100%;
    background-color: #fff !important;
    box-shadow: 0 10px 16px 0 rgb(0 0 0 / 0%), 0 6px 20px 0 rgb(0 0 0 / 8%) !important;
}

.photos {
    padding: 17px 10px 0px 10px;
}
.photos span {margin:5px;}


    .photos a {
        font-family: 'Poppins';
        font-weight: 600;
        color: #0E1014;
        font-size: 15px;
    }

.photos a:hover {color:#3A7CE9;}


.feelings {
    padding: 17px 10px 0px 10px;
}

    .feelings span {
        margin: 5px;
    }


    .feelings a {
        font-family: 'Poppins';
        font-weight: 600;
        color: #0E1014;
        font-size: 15px;
    }

        .feelings a:hover {
            color: #3A7CE9;
        }


.post_announcement_container {
    margin: 10px 0px 10px 0px;
    box-shadow: 0 10px 16px 0 rgb(0 0 0 / 0%), 0 6px 20px 0 rgb(0 0 0 / 8%) !important;
}

.post_announcement_container .card-header,.card-body {padding:10px;}

    .post_announcement_container .card-header .card-title {
        margin: 0px !important;
    }

    .post_announcement_container .card-stretch {
        border-radius: 10px;
    }



.social_adds{}



.alert_container {
    padding: 12px;
    display: flex;
}

.alert_date {
    width: 40px;
    background: #E83333;
    height: 40px;
    border-radius: 7px;
    color: white;
    text-align: center;
    margin-right: 10px;
    display:block;
    padding: 4px;
}



.alert_text {

    padding:0px;
}


.alert_status {
    position: relative;
    top: 13px;
}


.done {
    background-color: #47C5AF;
}
.pending {
    background-color: #E89433;
}



/********  ESSP Dashboard CSS  *********************/




/******** login CSS  *********************/

.company_logo {
    height: 50px;
    background: url(../images/logo.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 150px;
    /* background-color: black; */
    /* z-index: 1000; */
    background-size: cover;
    max-width: 90%;
    float: right;
    position: absolute;
    right: 0;
}



/*.login-outer {background-color:inherit !important;}
*/

.login-signin {
    text-align: left;
/*    width:495px;*/
}

    .login-signin p {
        text-transform: uppercase;
        font-size: 15px;
        opacity: 1 !important;
        padding-bottom:10px;
    }


.mb-5 h3 {
    font-size: 58px;
   /* font-weight: 600;*/
    color: black;
    position:relative;
    margin-bottom:0px;
}

.hr_portal {
    font-size: 23px !important;
    font-weight: normal !important;
    text-transform: uppercase; font-weight:bold;
    color: #1a84d9;
}



.checkbox.checkbox-outline > span {border-radius:10px;}


/*.login_right_img {
    background-image: url(../images/login_bg.png);

    background-repeat: no-repeat;
    background-position: center;
  background-size:contain;
   
}*/



/******** login CSS end  *********************/



/******** Life Events CSS start  *********************/



.profile_container  {display:flex;}

.profile_details {
    padding: 0px 0px 0px 0px;
}

.profile_img {
    margin-right: 10px;
}

.profile_details p {margin:0px !important; padding:0px !important; font-size:11px;}




.events_container {
}

    .events_container a {
        margin-bottom: 13px;
        display: block;
    }



.bg_light {
    background-color: #F3F7FD;
    padding: 20px;
}
.event_img {
    background: url(../images/icons/event.jpg);
    background-repeat: no-repeat;
    min-height: 128px;
    background-size: cover;
}



.events_footer_bg {
    background: url(../images/events_footerbg.png);
    background-repeat: no-repeat;
    height: 127px;
    position: absolute;

    background-size: cover;
    right: 0;
    width: 190px;
    bottom: -18px;
}



/*
.calender_bg {


    width: 821px;
    height: 300px;
    background-image: url(../images/calender_bg.png);
    position: absolute;
    background-repeat: no-repeat;
    right: 0;
    top: 0px;
}
*/


.timeline.timeline-6:before {
    left: 97px !important;
}

.timeline.timeline-6 .timeline-item .timeline-label {
    width: 110px !important;
}



/******** Life Events CSS End  *********************/


/******** growth history  *********************/

.timeline.timeline-3 .timeline-items .timeline-item .timeline-content {background-color:white !important;}

    .timeline.timeline-3 .timeline-items .timeline-item .timeline-content:before {display:none !important;}


.timeline.timeline-3 .timeline-items .timeline-item .timeline-media {width:70px;height:70px;}

.Transfer {
    font-weight: bold;
    color: #ffa800 !important;
    font-size: 18px;
}

.promotion {
    font-weight: bold;
    color: #24A73A !important;
    font-size: 18px;
}


.Joined {
    font-weight: bold;
    color: #006781 !important;
    font-size: 18px;
}


.timeline.timeline-3 .timeline-items .timeline-item .timeline-media img {
    border-radius: 0 !important;
}



/******** growth history  *********************/


.fummel-img {
    width: 315px;
    /*height: 250px;*/
    display:flex;
    justify-content:center;
    object-fit:cover;
    margin:auto;
}

    .fummel-img img {
        width: 100%;
        height: 100%;
    }

.gutter-set{
    margin-bottom:15px ;
}
.recruitment-grow{
    padding:20px;
}
.graph-grow{
    border-radius:15px !important;
}
.graph-new {
    width: 100%;
    height: 220px;
    display: flex;
    justify-content: center;
    object-fit: cover;
    margin: auto;
}
.graph-new img {
    width: 100%;
    height: 100%;
}
.graph-pie {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    object-fit: cover;
    margin: auto;
}
.graph-pie img {
    width: 100%;
    height: 100%;
}
.newlist {
    background-color: transparent;
  
    background-clip:none !important;
    border: none !important;
    border-radius: 0px !important;
    box-shadow:none !important;
    background:none !important;
}
.new-offer {
    height: 100%;
    /*padding: 18px 4px;*/
    text-align: center;
}
.percent h3{
    font-size:30px;
    color:red;
}
.offer-accpt {
   /* padding-bottom: 15px;
    font-size: 15px;*/
    font-weight: 700;
}
.eight{
    font-size:15px;
    font-weight:700;
    padding-bottom:6px;
}

.remove-gutter{
    margin-bottom:0px !important;
}
.recruitment-label {
    padding: 3px 15px;
}


.active_employee_icon img {
    width: 24px;
}

/***********************************************************************************************************************************/
/***********************************************************************************************************************************/
/***********************************************************************************************************************************/
/***********************************************************************************************************************************/
/***********************************************************************************************************************************/
/********************************************   Responsive section start here ***************************************************************************************/
/***********************************************************************************************************************************/
/***********************************************************************************************************************************/
/***********************************************************************************************************************************/
/***********************************************************************************************************************************/


.paginate_button img {width:inherit !important;}




@media only screen and (max-width: 991px) {
    .header-menu-wrapper {top:0 !important;}
    .burger-icon span, .burger-icon span::before, .burger-icon span::after {
        background-color: #000 !important;
    }

    .header.header-fixed {display:none !important;}


    .card.card-custom.height-100per {
        padding-left: 0px !important;
    }


    .card.card-custom > .card-body {padding:15px !important;}

    .content {top:0px !important;}

    .main-outer-div-inner {border-radius:0px !important;}
    .active_employee_icon img { width:24px;}

    .main-outer-div {padding:0px !important;}

    .img-dashboard img {height:auto;}

}






/*************** databank dashboard manpower tab style**************************/

.manpower_tabs {
    max-width: 100%;
}

  .m_tabs-nav li {
        float: left;
        width: 50%;
        list-style: none;
    }

    .m_tabs-nav li:first-child a {
        border-right: 0;
        border-top-left-radius: 6px;
    }

    .m_tabs-nav li:last-child a {
        border-top-right-radius: 6px;
    }


.m_tabs-nav {margin:0px; padding:0px;}

.m_tabs-nav a {
    background: #f5f5f5;
    /* border: 1px solid #cecfd5; */
    color: #3a7ce9;
    display: block;
    font-weight: 600;
    padding: 10px 0;
    text-align: center;
    text-decoration: none;
}

.m_tabs-nav a:hover {
    color: #ff7b29;
}

.tab-active a {
    background: #fff;
    border-bottom-color: transparent;
    color: #c1c1c1;
    cursor: default;
}

.tabs-stage {
   
    border-radius: 0 0 6px 6px;
    border-top: 0;
    clear: both;
    padding: 24px 30px;
    position: relative;
    top: -1px;
}



/*************** databank dashboard manpower tab style**************************/



/*************** databank dashboard Slider Age style**************************/





#slider {
    position: relative;
    overflow: hidden;
    margin: 20px auto 0 auto;
    border-radius: 4px; width:100%;
    height:230px;
    display:block;
}

    #slider ul {
        position: relative;
        margin: 0;
        padding: 0;
        height: 200px;
        list-style: none;
        width:100%;
    }

        #slider ul li {
            position: relative;
            display: block;
            float: left;
            margin: 0;
            padding: 0;
            width: 100%;
          
           background-color:white !important;
            text-align: center;
            line-height: 300px;
        }

a.control_prev, a.control_next {
    position: absolute;
    top: 40%;
    z-index: 999;
    display: block;
    padding: 1% 3%;
    width: auto;
    height: auto;
    background: #3a7ce9;
    color: #fff !important;
    text-decoration: none;
    font-weight: 600;
    font-size: 18px;
    opacity: 0.8;
    cursor: pointer;
    border-radius: 25px !important;
}

    a.control_prev:hover, a.control_next:hover {
        opacity: 1;
        -webkit-transition: all 0.2s ease;
    }

a.control_prev {
    border-radius: 0 2px 2px 0;
}

a.control_next {
    right: 0;
    border-radius: 2px 0 0 2px;
}

.slider_option {
    position: relative;
    margin: 10px auto;
    width: 160px;
    font-size: 18px;
}


/*************** databank new  dashboard **************************/

.databank_line h3 {
    font-family: 'Roboto Slab', serif !important;
    font-size: 24px;
    font-weight: 400;
    border-bottom: 1px dotted #ACBBD2;
    padding-bottom: 10px;
}
.common_space {
    padding: 40px;
}
.left-onboarding {
    padding: 13px 30px;
    width: 100%;
    background-color: #fff;
    border-radius: 17px;
   
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}
.databank_board {
    height: 135px;
}
    
.join_dot {
    border-left: 1px dotted;
    padding: inherit;
}
.left_icon {
    width: 35px;
    height: 35px;
    object-fit: cover;
}
.left_icon  img{
    width: 100%;
    height: 100%;
 
}
.left_tils h3 {
    font-size: 36px;
    font-weight: 400;
   /* font-family: 'Roboto', sans-serif;*/
    color: var( --main-color-one);
    margin-bottom: 0;
    padding-left: 15px;
  /*  padding-top: 10px;*/
}
.head_on  {
    font-size: 14px;
    color: #272727;
}
.head_on_boarding{
    font-size:18px;
}
.left_common {
    padding: 30px 0 12px
}
.right_on{
    width:100% !important;
}
.gender_cls {
    display: flex;
    padding-top: 9px;
    padding-left: 22px;
}
.gender_cls h4{
    padding-left:15px;
}
.iocn_male {
    height: 13px;
    padding-right: 3px;
}
.left_full {
    width: 100% !important;
    background-image: url(../images/icons/birthday.png);
    background-position: center;
    background-repeat: no-repeat;
  /*  background-size: cover;*/
    /*border-radius: 21px;*/
    padding: 20px;
    height: 95px;
    background-color: transparent !important;
    box-shadow: none !important;
    display:flex;
    align-items:center;
}
.nav-tabs{
    border:none;
}
/*<tab>*/
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
    background-color: transparent;
    border: none;
    font-size: 16px;
    color: #000000;
}

.nav .show > .nav-link, .nav .nav-link:hover:not(.disabled), .nav .nav-link.active {
    border-bottom: 2px solid #0068FF;
    color: #000000;
    padding: 2px 0px;
    margin: 0 12px;
}

.nav .nav-link {
    padding: 2px 0px;
    margin: 0 12px;
    font-size: 14px;
}
.exititem{
    padding-bottom:7px;
}
.nav-tabs .nav-link {
    border: 1px solid transparent;
}
.tab-content {
    background-color: transparent;
    padding: 0;
    top: 0 !important;
}
.joining_cls {
    width: 50px;
    height: 50px;
    object-fit: cover;
    border-radius: 50px;
}
.joining_cls img {
    width: 100%;
    height: 100%;
   
    border-radius: 50px;
}
.name_kuri{
    font-size:10px;
    color:#fff;
}
.upcoming_img {
    width: 35px;
    height: 35px;
    object-fit: cover;
    margin-left: -10px;
}
    .upcoming_img img {
        width: 100%;
        height: 100%;
        border-radius:50px;
       
    }
/*<end tab>*/
.progress_bar {
    font-size: 13px;
    padding-top: 10px;
}

.low {
    background-color: #518EF8 ;
}

.consent_icon {
    margin-left: auto;
    width: 50px;
    height: 53px;
}
.arrow_up {
    color: #0068FF;
    font-size: 17px !important;
}
.arrow_count {
    font-size: 16px;
    color: #0068FF;
    font-size: 20px;
    font-weight: 700;
}
.tile_join {
    font-size: 16px;
    color: #000;
}
.percent_count {
    font-size: 30px;
    font-weight:700;
    color: #0068FF;
}


.birthday_cls {
    width: 60px;
    height: 60px;
    object-fit: cover;
    margin-top: 10px;
    border-radius: 50%;
}

    .birthday_cls img {
        width: 100%;
        height: 100%;
        border-radius: 50%;
    }
.birthday_new{
    width:60px;
  /*  height:50px;*/
    object-fit:cover;
}
.birthday_new img {
    width: 100%;
/*    height:100%*/
}
.birthday_name {
    font-size: 10px;
    color: #E33DEF;
    border-radius:50%;
}
.birthday_des {
    font-size: 12px;
    color: #000000;
}
.dotted_cls {
    border-right: 1px dotted #CCCCCC;
}
.note_cls {
    background-color: #fff;
   
    margin-left: 100px;
    
}

.owl-next {
    top: -7px;
}

.owl-prev {
    top: -9px;
    left: -20px;
}
.footer_img{
    width:160px;
    height:160px;
    object-fit:cover;
}
.footer_img img{
    width: 100%;
    height: 100%;

}
.dashboard_footer {
    position: fixed;
    left: 42px;
    right: 13px;
    bottom: -30px;
    z-index:0;
}
.right_notification {
    width: 25px;
    height: 25px;
    object-fit: cover;
}
.right_notification img {
    width: 100%;
    height: 100%;
   
}
.note_right {
    font-size: 16px;
    color: #535353;
    padding-left:15px;
}
.notificatiobn_new {
    padding: 20px;
}
.dots {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #0068ff;
    margin-right: 16px;
}
.reg_pending {
    font-size: 14px;
/*    color: #7A7A7A;*/
}
.right_code {
    background-color: #8D9FB8;
    width: 25px;
    height: 25px;
    display: flex;
    margin: 4px;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
}
    .right_code div {
        font-size: 10px;
        color: #FFFFFF;
    }
.common-rightcls {
    padding: 0px 13px 0px 35px;
  /*  border-left: 5px solid transparent;*/
    margin: 15px 5px;
    margin-bottom: 2px;
}
/*.right_blue {
    border-left: 5px solid #0165F7 !important;*/
/*}*/


.right_blue {
    border-left: none!important;
}


.back_color {
    background-color: #0068FF !important;
    border-radius: 30px !important;
}
.back_white{
    color:#fff !important;
}
.back_new{
    background-color:#fff !important;
}
.white_count {
    color: #7D7D7D !important;
}
.common_scroll {
    height: 350px;
    display: block;
    overflow-y: scroll;
}
.tab_joining{
    display:flex;
    justify-content:center;
}

.onboarding_margin{
    margin-right:20px;
}
.card_new{
    overflow-x:hidden !important;
}
.common_left {
    padding: 49px 0 0 50px;
}

.databank-dashboard-scroll {
    height: 366px !important;
    display: block;
    overflow-y: scroll;
    overflow-x:hidden;
}

/*
<timeoffice>*/
.tile-1 {
    width: 100%;
    background-color: #FFFFFF;
    box-shadow: rgba(99, 94, 102, 0.2) 0px -1px 15px 0px;
    padding: 20px;
    border-radius: 10px;
}

.tile-counts {
    color: #0068FF;
    font-size: 30px;
    margin-bottom: 0;
}


.tile-head {
    color: #2D2D2D;
    font-size: 15px;
}

.sevenday th, td {
    padding: 11px 12px !important;
    /*padding: 12px 14px !important;*/
    font-size: 12px;
}

.table-radius-new {
    border-top-left-radius: 10px;
}

.table-radius-right {
    border-top-right-radius: 10px;
}

.table-color-new {
    background-color: #0068FF;
    color: white;
}

.new-dash-table table thead tr th {
    padding: 16px 13px !important;
}

.table-heading {
    font-size: 22px;
    padding: 0px 0px 11px;
}


.table-padding {
    padding-top: 48px;
}

.notification-box {
    background-color: #fff;
    padding: 50px;
    height: 100%;
    position: fixed;
    width: 100%;
}

.icon-head {
    width: 40px;
    height: 40px;
    object-fit: cover;
    padding: 5px;
}

    .icon-head img {
        width: 100%;
        height: 100%;
    }

.border-btm-linetop {
    border-bottom: 1px dotted #ACBBD2;
}

.Time-office-head {
    font-size: 22px;
    color: #000000;
}


.payroll-tble-left {
    margin-left: 50px;
}

.payroll-tile-left {
    margin-left: 15px;
}

.company-mrk-name {
    font-size: 12px;
    color: #D8D8D8;
}

.note_cls {
    background-color: #fff;
    margin: 0px 34px 34px 34px;
    position: relative;
    z-index: 5;
  
    border-radius: 17px;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px
}
.table-color-new-2ndtable {
    background-color: #0068ff;
    color: white;
}





/*<payroll>*/

.payroll-tble-left .ihits-table table tbody tr {
    border-bottom: none;
    border-bottom: 1px dotted #b7b7b7;
    /*  box-shadow: rgba(99, 94, 102, 0.2) 0px -1px 15px 0px;*/
}


.Payroll-head {
    font-size: 22px;
    color: #000000;
}
@media screen and (max-width:1300px) {
    .dashboard_footer {
        display: none;
    }
}
    /*<responsive>*/
    @media screen and (max-width:1400px) {

        

        .left_common {
            padding: 15px 0 12px;
        }

        .footer_img {
            width: 120px;
            height: 120px;
            object-fit: cover;
        }

        .databank_line h3 {
            font-size: 20px;
        }

        .left_icon {
            width: 30px;
            height: 30px;
        }

        .left_tils h3 {
            font-size: 30px;
        }
        /* .head_on {
        font-size: 17px;
    }*/
        .joining_cls {
            width: 35px;
            height: 35px;
        }

        .name_kuri {
            font-size: 11px;
        }

        .nav .nav-link {
            font-size: 12px;
        }

        .nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
            font-size: 14px;
        }

        .birthday_cls {
            width: 55px;
            height: 55px;
        }

        .birthday_new {
            width: 50px;
        }

        .birthday_name {
            font-size: 12px;
        }

        .birthday_des {
            font-size: 11px;
        }

        .upcoming_birth {
            font-size: 10px;
        }

        .upcoming_img {
            width: 30px;
            height: 30px;
            margin-left: -8px;
        }

        .arrow_count {
            font-size: 18px;
        }

        .arrow_up {
            font-size: 16px !important;
        }

        .tile_join {
            font-size: 14px;
        }

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

        .reg_pending {
            font-size: 12px;
        }
        /*   .note_cls {
      
        margin-left: 15px !important;
    }*/

        .notificatiobn_new {
            padding: 15px 30px;
        }

        .common_left {
            padding: 49px 0 0 20px;
        }

        .ihits-table.table-border table thead tr th {
            padding: 8px !important;
        }

        .table-padding {
            padding-top: 25px;
        }

        .login_new_padding {
            padding: 20px 30px 20px 20px;
            width: 100%;
        }

        .mb-5 h3 {
            font-size: 45px;
            /* font-weight: 600; */
            color: black;
            position: relative;
            margin-bottom: 0px;
        }

        .login-signin p {
            text-transform: uppercase;
            font-size: 13px;
            opacity: 1 !important;
            padding-bottom: 0px;
        }

        #kt_login_forgot {
            font-size: 12px;
            color: #778AA1;
            font-family: 'Poppins', sans-serif !important;
        }

        .new_offer_paddig {
            padding-left: 15px !important;
        }

        .Acceptance-ratio-count {
            font-size: 11px !important;
        }

        .offter-count {
            font-size: 30px;
            color: #0068FF;
        }

        .Offer-Accepted {
            font-size: 12px !important;
            color: #0E0E0E;
        }

        .Acceptance-ratio-count {
            font-size: 13px;
            color: #FFFFFF;
            margin-bottom: 0px;
        }

        .tile-head {
            color: #2D2D2D;
            font-size: 12px;
        }

        .left_full {
            height: 105px;
        }
    }

    @media screen and (max-width:1200px) {
        .left_full {
            background-size: cover;
        }

        .left_icon {
            width: 28px;
            height: 28px;
        }

        .left_tils h3 {
            font-size: 28px;
        }

        .nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
            margin: 0 5px;
        }

        .upcoming_birth {
            font-size: 12px;
        }

        .top_margin {
            margin-top: 15px;
        }

        .left_common {
            padding: 5px 0 12px;
        }

        .notificatiobn_new {
            padding: 15px 30px 7px;
        }

        .payroll-tble-left {
            margin-left: 0px !important;
            padding-top: 20px;
        }

        .dashboard_footer {
            display: none;
        }

        .table-padding {
            padding-top: 15px !important;
        }

        .common_left {
            padding: 20px 0 0 25px;
        }

        .common-rightcls {
            padding: 11px 15px 20px 35px;
        }

        .table-heading {
            font-size: 17px;
            padding: 0px 0px 5px;
        }

        .size_bottom {
            padding-bottom: 10px;
        }

        .tile-1 {
            padding: 10px 20px;
        }

        .common_scroll {
            height: 690px;
        }

        .ihits-table {
            margin-bottom: 0px !important;
        }

        .padding_newcls {
            padding-top: 10px !important;
        }

        .paddig_offer {
            padding-top: 10px !important;
        }

        .Offer-Acceptance {
            margin-left: 25px;
        }

        .Offer-Processing-tble {
            margin-left: 25px;
        }

        .new_offer_paddig {
            padding-top: 17px !important;
        }

        .Vacancies-hed {
            font-size: 20px;
            padding: 0px 0px 6px;
        }

        .Vacancies-tile {
            justify-content: space-around !important;
        }

        .login_new_padding {
            padding: 20px 42px 20px 20px;
            width: 100%;
        }

        .tile_join {
            font-size: 9px;
        }

        .percent_count {
            font-size: 20px;
            font-weight: 700;
            color: #0068FF;
        }

        .progress_bar {
            font-size: 10px;
            padding-top: 10px;
        }

        .head_on {
            font-size: 14px;
        }
    }
@media screen and (max-width:1700px) {
    .active-Applicable-hd {
        font-size: 17px !important;
    }

    .act-emp-count {
        font-size: 16px !important;
    }
}

    @media screen and (min-width:1700px) {


        .active-Applicable-hd {
            font-size: 18px !important;
        }

        .act-emp-count {
            font-size: 21px !important;
        }





        .left_icon {
            width: 53px;
            height: 53px;
        }

        .left_tils h3 {
            font-size: 50px;
        }

        .left_tils {
            padding-bottom: 8px;
        }

        .head_on {
            font-size: 20px;
            /* padding-bottom: 15px;*/
        }

        .left-onboarding {
            padding: 20px 30px;
        }

        .left_full {
            height: 112px;
        }

        .arrow_up {
            padding-right: 10px;
        }

        .percent_count {
            font-size: 36px;
        }

        .owl-stage-outer owl-height {
            height: auto !important;
        }

        .joining_cls {
            width: 60px;
            height: 60px;
        }

        .owl-prev {
            left: -14px;
        }

        .footer_img {
            width: 190px;
            height: 190px;
        }

        .right_notification {
            width: 26px;
            height: 26px;
        }

        .note_right {
            font-size: 18px;
        }

        .left_common {
            padding: 35px 0 12px;
        }

        .exititem {
            padding-bottom: 25px;
        }

        /* .note_cls {
            margin-left: 80px;
        }*/

        .tile-head {
            color: #2D2D2D;
            font-size: 20px;
        }

        .Time-office-head {
            font-size: 24px;
            color: #000000;
        }

        .tile-counts {
            color: #0068FF;
            font-size: 40px;
            margin-bottom: 0;
            padding-left: 15px;
        }

        .icon-head {
            width: 40px;
            height: 40px;
            object-fit: cover;
            padding: 5px;
        }

        .table-heading {
            font-size: 24px;
            padding: 0px 0px 11px;
        }


        .sevenday th, td {
            padding: 15px 12px !important;
            /*padding: 12px 14px !important;*/
            font-size: 15px !important;
        }

        .new-dash-table table thead tr th {
            font-size: 17px;
        }

        .tile-1 {
            width: 100%;
            background-color: #FFFFFF;
            box-shadow: rgba(99, 94, 102, 0.2) 0px -1px 15px 0px;
            padding: 24px;
            border-radius: 10px;
        }

        .payroll-tble-left {
            margin-left: 85px;
        }

        .payroll-tble-left {
            margin-left: 80px !important;
        }

        .common_left {
            padding: 49px 0 0 60px;
        }

        .common_scroll {
            height: 575px;
            display: block;
            overflow-y: scroll;
            overflow-x:hidden;
        }

        .Vacancies-tile {
            border-radius: 30px;
        }

        .Vacancies-tile-counts {
            font-size: 40px !important;
        }

        .tile-counts-2 {
            font-size: 40px !important;
        }

        .Vacancies-tile {
            justify-content: space-between !important;
        }

        .tile-head-2 {
            font-size: 18px !important;
        }

        .Offer-Acceptance-Ratio-head {
            font-size: 23px !important;
            color: #000000;
        }

        .offter-count {
            font-size: 35px !important;
        }

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

        .Offer-Processing-hed {
            font-size: 17px !important;
        }

        .Offer-Processing-hed-2 {
            font-size: 15px !important;
        }

        .Offer-Processing-tble {
            margin-top: 30px !important;
        }

        .offer-process-border {
            padding: 10px 15px !important;
        }

        .requere_tile {
            border-radius: 21px !important;
        }

        .head_on {
            font-size: 15px;
            color: #272727;
        }

        .birthday_cls {
            width: 75px;
            height: 75px;
            object-fit: cover;
            margin-top: 10px;
        }

            .birthday_cls img {
                width: 100%;
                height: 100%;
            }

        .upcoming_img {
            margin-left: -15px;
        }
    }

    @media screen and (max-width:1500px) {
        .notificatiobn_new {
            padding: 15px 30px;
        }
    }

    .profile_text {
        width: 50px !important;
        height: 50px !important;
        margin: auto;
    }

    .owl-slider {
        padding: 0px 10px;
    }


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

        .common_left {
            padding: 20px 15px 0px 15px;
        }

        .payroll-tile-left {
            margin-left: 0px;
        }

        .note_cls {
            margin-left: 0 !important;
            margin: 15px !important;
        }

        .ihits-table {
            margin-bottom: 15px !important;
        }

        .leaves_upcoming {
            margin-top: 15px;
        }

        .common_left {
            padding: 20px 0 0 20px;
        }

        .common_left {
            padding: 16px 30px 20px 25px;
        }
    }

    .Vacancies-tile {
        width: 100%;
        display: flex;
        background-color: #FFFFFF;
        box-shadow: rgba(99, 94, 102, 0.2) 0px -1px 15px 0px;
        padding: 20px;
        border-radius: 10px;
        /* padding-bottom: 10px; */
        justify-content: center;
    }

    .Vacancies-tile-counts {
        color: #0068FF;
        font-size: 34px;
        margin-bottom: 0;
    }

    .dot-tile-new {
        border-right: 1px dotted;
        padding: 10px;
        padding: 1px 26px;
        color: #707070;
    }

    .tile-head-2 {
        color: #000000;
        font-size: 16px;
    }

    .tile-counts-2 {
        color: #0068FF;
        font-size: 34px;
        margin-bottom: 0;
        padding-top: 11PX;
        padding-left: 10PX;
    }

    .Offer-Acceptance-Ratio-head {
        font-size: 18px;
        color: #000000;
    }

    .offter-count {
        font-size: 32px;
        color: #0068FF;
    }

    .Offer-Accepted {
        font-size: 14px;
        color: #0E0E0E;
    }

    .Acceptance-count-1 {
        border-radius: 50%;
        width: 25px;
        height: 25px;
        background-color: #1BB845;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .Acceptance-ratio-count {
        font-size: 14px;
        color: #FFFFFF;
        margin-bottom: 0px;
    }

    .Acceptance-count-2 {
        border-radius: 50%;
        width: 25px;
        height: 25px;
        background-color: #FF4E00;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .Offer-Acceptance-left-pad {
        padding-left: 30px;
    }

    .Offer-Processing-hed {
        font-size: 16px;
        color: #000000;
    }

    .Offer-Processing-count {
        color: #0068FF;
        font-size: 26px;
    }

    .offer-process-border {
        border-bottom: 1px solid #E0E0E0;
        padding: 6px 15px;
        background-color: #fff;
    }

    .Offer-Processing-count-2 {
        width: 30px;
        height: 30px;
        border-radius: 25px;
        background-color: #F1F1F1;
        color: #0068FF;
        text-align: center;
        padding: 5px;
        font-size: 14px;
    }

    .Offer-Processing-hed-2 {
        color: #525252;
        font-size: 12px;
    }

    .Offer-Processing-tble {
        box-shadow: rgba(99, 94, 102, 0.2) 0px -1px 15px 0px;
    }



    .Vacancies-hed {
        font-size: 24px;
        padding: 0px 0px 11px;
    }

    .item_form {
        height: 40px;
        border-radius: 10px;
    }

    .new_offer_paddig {
        padding-left: 70px;
    }



    /*   <anjaly>*/

    .partnership {
        background-color: var(--blue-color-theme);
        mask: url('../images/icons/partnership.svg');
        -webkit-mask-image: url('../images/icons/partnership.svg');
        width: 50px;
        height: 50px;
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: 90%;
        -webkit-mask-position: center;
    }

    .dashboar_notice {
        background-color: var(--blue-color-theme);
        mask: url('../images/icons/notice.svg');
        -webkit-mask-image: url('../images/icons/notice.svg');
        width: 50px;
        height: 50px;
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: 80%;
        -webkit-mask-position: center;
    }

    .active_emp {
        background-color: var(--blue-color-theme);
        mask: url('../images/icons/reputation.svg');
        -webkit-mask-image: url('../images/icons/reputation.svg');
        width: 30px;
        height: 40px;
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: 80%;
        -webkit-mask-position: center;
    }

    .notification_img {
        background-color: var(--blue-color-theme);
        mask: url('../images/icons/Icon material-notifications-active.svg');
        -webkit-mask-image: url('../images/icons/Icon material-notifications-active.svg');
        width: 50px;
        height: 50px;
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: 80%;
        -webkit-mask-position: center;
    }

    .common-dot {
        height: 100%;
        display: flex;
        z-index: 1;
        position: absolute;
        align-items: center;
    }

    .active-dot-new {
        border-right: 1px dotted #272727;
    }

.new-top-notification {
    mask: url(../images/icons/Icon material-notifications-active.svg);
    -webkit-mask-image: url(../images/icons/Icon material-notifications-active.svg);
    width: 50px;
    height: 50px;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 80%;
    -webkit-mask-position: center;
}



@media (max-width: 75em) {

    .responsivee-tilee-new {
        margin-left: -18px !important;
        padding-right: 0px;
    }

    .left_tils h3 {
        padding-left: 5px !important;
    }

    .birthday_name {
        font-size: 10px !important;
    }

    .name_kuri {
        font-size: 9px !important;
    }

    .common-rightcls {
        padding: 0px 6px 0px 9px !important;
    }

    .profile_text {
        width: 35px !important;
        height: 35px !important;
    }
}

.common-rightcls {
  width:100%;

    display: inline-block;
    transition-duration: 0.3s;
    transition-property: transform;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    transform: translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

    .common-rightcls:hover {
        transform: scale(1.0);
        background-color: var(--blue-color-theme);
        color: #fff;
       
        border-radius: 30px !important;
    }
    .common-rightcls  a:hover {
        color: #fff !important;
    }
    .common-rightcls:hover .dots {
        background-color: #fff !important;
    }


@keyframes spinner-d3wgkg {
    to {
        transform: rotate(1turn);
    }
}
.spinner-outer {
    position: absolute;
    width: 100%;
    height: 100vh;
    background: black;
    opacity: 0.7;
    /*    z-index: 123;*/
    z-index: 999999999;
}



.spinner-outer-small {
    position: absolute;
    width: 100%;
    height: 50vh;
    /*background: black;*/
    /* opacity: 0.7;*/
    /*    z-index: 123;*/
    z-index: 999999999;
}

.spinner-small {
    background-image: url('../images/Loader_img1 (7).gif');
    height: 100%;
    width: 100%;
    background-repeat: no-repeat;
    position: absolute;
    left: 40%;
    top: 17%;
}