@font-face {
    font-family: 'LinkedIn-Glyphs-2.0.7","LinkedIn-Glyphs';
    src: url('LinkedIn-Glyphs-16px.woff');
    src: url('LinkedIn-Glyphs-16px.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

.jqGridbtn {
    background-color: rgba(255, 255, 255, 0.08) !important;
}

/*claascontrol dl horizantal extra width form dt*/
.extra-width {
    width: 40% !important;
}

/*claascontrol dl horizantal extra margin for dd*/
.extra-margin {
    margin-left: 41% !important;
}


/*extra width for ApplicationSetting pages*/
.morewidth {
    width: 330px !important;
}

/*Password setting in label for introduction for textbox*/
.intro {
    margin-left: -1px !important;
    margin-top: 3px !important;
    font-size: 12px;
}

.extra-paddingleft {
    padding-left: 25px !important;
}

    .extra-paddingleft:hover {
        cursor: pointer;
    }


/*===================================================// custom css by KISHAN  //====================================================================*/
/*==================================================================================================================================================*/

/*---------------------------emp-profile mobile view----------------------------*/
.profileicon {
    float: left;
}
/*-----------------------------------custom owl-carsoul slider navigation btn design-------------------------------------------------*/
.nav-prent {
    position: absolute;
    top: -51px;
    right: 0px;
    float: left;
}

.slider-prev {
    background: transparent;
    color: #006699;
    margin: 0px;
    font-size: 18px;
    position: absolute;
    left: -25px;
    padding: 5px;
    cursor: pointer;
}

.slider-next {
    background: transparent;
    color: #006699;
    padding: 0px -5px;
    margin: 0px;
    right: 4px;
    position: relative;
    padding: 5px;
    font-size: 18px;
    cursor: pointer !important;
}

/*---------------------dashbord----------------------------------*/

.cover-image {
    width: 100%;
    height: 130px;
    background-size: cover;
}

    .cover-image .profile-name {
        top: 98px;
        left: 160px;
        position: absolute;
        color: #fff;
        font-size: 18px;
        display: block;
        z-index: 15;
    }

.about {
    margin-top: -40px;
}

    .about .designation {
        margin-top: 19px;
        padding-top: 15px;
        padding-left: 40px;
        color: #555;
        border-right: 4px double #e6e6e6;
    }

    .about .brief {
        overflow-y: hidden;
        padding: 5px 35px 5px 20px;
        color: #777;
    }

.about-p {
    margin: 0px;
}

.profile-quote {
    border-top: 4px double #e6e6e6;
}

.slogan {
    text-align: center;
    margin-top: 10px;
    font-style: italic;
    font-size: 12px;
    font-weight: 600;
    color: #8c8c8c;
}

    .slogan:before {
        content: "\f10d";
        font: normal normal normal 15px/1 FontAwesome;
        opacity: .3;
        color: red;
        position: relative;
        left: -7px;
        top: -5px;
    }

    .slogan:after {
        content: "\f10e";
        font: normal normal normal 15px/1 FontAwesome;
        opacity: .3;
        color: red;
        position: relative;
        left: 7px;
        top: -5px;
    }

.about-icon {
    color: #4E5E6A;
    font-size: 15px;
}

.dashboard-tr {
    height: 38px;
}

.dashboard-td {
    font-size: 15px;
}

.profile-pic {
    width: 120px;
    height: 120px;
    position: relative;
    z-index: 99;
    background-size: cover;
    border-radius: 50%;
    border: 4px solid rgba(225, 225, 225, 1.5);
    margin-top: -75px;
    margin-left: 25px;
}

.profile-header-bg {
    position: absolute;
    background: rgba(4, 4, 4, 0.3);
    height: 35px;
    top: 95px;
    z-index: 9;
    width: 100%;
    display: block;
}

.dashboard-title {
    font-size: 14px;
    margin: 0;
    padding: 10px 15px 5px 15px;
    font-weight: 600;
    color: #4E5E6A;
}

.dashboard-team {
    float: left;
}

.dashboard-box {
    float: left;
    padding: 0px 12px;
    width: 100%;
    color: #4E5E6A;
}

.dashboard-icon {
    font-size: 15px;
    color: #d32f2f;
}

.shift-caption {
    background: #337ab7;
    color: #fff;
    padding: 10px;
    font-size: 15px;
    letter-spacing: 1px;
    font-weight: 600;
}

.t-icon {
    position: absolute;
    top: 69px;
    right: 43px;
    width: 60px;
    height: 60px;
    line-height: 60px;
    text-align: center;
}

    .t-icon.right span {
        right: -60px;
    }

    .t-icon span {
        position: absolute;
        z-index: 8;
        top: -60px;
        width: 120px;
        height: 120px;
        line-height: 120px;
        border-radius: 50%;
    }

.t-box-icon {
    font-size: 40px;
    color: #fff;
    font-weight: 600;
    right: -70px;
}

.dashboard-info p {
    font-size: 15px;
    margin-bottom: 5px;
    color: #374051;
    font-weight: 400;
    text-align: left;
}

.dashboard-info span.info-box-title {
    display: block;
    font-size: 13px;
    margin-bottom: 10px;
    color: #ff0000;
    text-align: left;
    line-height: 5px;
}

.dashboard-box .left-box {
    float: left;
    width: 50%;
    margin: 0 auto;
}

    .dashboard-box .left-box p,
    .dashboard-box .right-box p {
        font-size: 30px;
        margin-bottom: 14px;
        margin-top: 10px;
        text-align: center;
        color: #374051;
    }

    .dashboard-box .left-box span.info-box-title,
    .dashboard-box .right-box span.info-box-title {
        display: block;
        font-size: 20px;
        text-align: center;
        margin-bottom: 10px;
        color: #44aea1;
        font-weight: 400;
    }

.dashboard-box .right-box {
    float: left;
    width: 50%;
    margin: 0 auto;
}

.clock-section {
    background: #728cd7;
    text-align: center;
    margin: 8px 0 0;
    color: #ddd;
    overflow: auto;
    padding: 5px;
}

.clock-section-icon {
    font-size: 35px;
    padding-left: 9px;
    color: #000;
    text-align: center;
}

.clock-section-caption {
    padding-left: 10px;
    letter-spacing: 1px;
    text-align: center;
    font-size: 13px;
    margin-top: 17px;
    text-align: left;
}

.image-blockquote {
    width: 100%;
    margin-top: 0px;
}

    .image-blockquote .img-blockquote {
        width: 80px;
        height: 80px;
        text-align: center;
        margin: 0 auto;
    }

        .image-blockquote .img-blockquote img {
            width: 80px;
            height: 80px;
            margin-top: 0px;
            border: 3px solid rgba(8,115,128,.2);
        }

    .image-blockquote blockquote {
        padding: 0px;
        border-left: 0px !important;
    }

        .image-blockquote blockquote .wish-caption {
            font-size: 15px;
            font-family: cursive;
            font-weight: 600;
            color: #d32f2f;
            letter-spacing: 1px;
        }

        .image-blockquote blockquote .border-blockquote {
            border-top: 1px solid #ddd;
            margin: 10px 0;
        }

.dashboard-info {
    margin-top: -15px;
}

.dashboard-info-box-icon {
    text-align: center;
    font-size: 35px;
    margin: 9px 0px;
    color: #22baa0;
}

.dashboard-info-box-progress {
    padding: 0px 15px;
    font-size: 11px;
    color: #5a5a5a;
}

.dashboard-info .caption-span {
    line-height: 10px;
    display: block;
    font-size: 12px;
    font-style: italic;
    text-align: left;
}

.workflow-tile {
    margin-bottom: 5px;
    float: left;
    width: 100%;
}

    .workflow-tile:hover {
        cursor: pointer;
    }

.workflow-tile-box {
    border: 1px solid #ddd;
    min-height: 90px;
}

.workflow-list {
    list-style: none;
    padding: 0px;
    margin: 0px;
}

    .workflow-list li {
        display: inline-block;
        width: 50%;
        padding: 0px;
        float: left;
    }

.workflow-heading {
    font-size: 12px;
    color: #b7b7b7;
    text-align: center;
    margin-bottom: 2px;
    font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.workflow-val {
    font-size: 15px;
    font-weight: 600;
    color: #4e5e6a;
    text-align: center;
    font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.workflow-tile-box .counter {
    padding-left: 5px;
    font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 13px;
    margin-bottom: 18px;
}

    .workflow-tile-box .counter .counter-icon {
        float: right;
        padding-right: 5px;
        padding-top: 5px;
        font-size: 35px;
        opacity: 0.6;
    }

    .workflow-tile-box .counter .counter-heading {
        padding-bottom: 4px;
        letter-spacing: 1px;
        font-weight: 600;
        font-style: italic;
        padding-left: 0px;
        -moz-transition: padding .4s ease-in-out;
        -o-transition: padding .4s ease-in-out;
        -webkit-transition: padding .4s ease-in-out;
        transition: padding .4s ease-in-out;
    }

.workflow-tile:hover .workflow-tile-box .counter .counter-heading {
    cursor: pointer;
    padding-left: 10px;
}

.myteamdetails {
    float: right;
    margin-top: 7px;
}

    .myteamdetails a {
        margin-bottom: 0px;
        cursor: pointer;
        text-decoration: none;
    }

.teamcount {
    float: right;
    padding-right: 7px;
    font-size: 13px;
    color: #b7b7b7;
    text-align: center;
    margin-bottom: 2px;
    line-height: 20px;
}

.swiper-container {
    width: 300px;
    height: 200px;
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

.img-gallery {
    background-color: #fff !important;
    width: 300px !important;
    height: 200px !important;
    display: inline-block !important;
    overflow: hidden;
    text-align: center !important;
}

    .img-gallery img {
        height: 100%;
    }

.swiper-container-v {
    background: #eee;
}

.swiper-pagination-v {
    bottom: 30px !important;
}

.dvreminder {
    text-align: center;
    vertical-align: middle;
    width: 167px;
    height: 105px;
    border: 1px solid #ddd;
    background: #f9f9f9;
    padding: 2px;
    margin: 2px 2px 15px 9px;
    overflow: hidden;
}

.count-bg {
    position: absolute;
    width: 50px;
    height: 50px;
    background: rgba(0, 188, 212, 0.65);
    border-radius: 50%;
    top: -20px;
    right: -20px;
}

    .count-bg span {
        position: absolute;
        top: 23px;
        font-size: 15px;
        right: 26px;
        font-weight: 500;
        color: #fff;
    }

.dvicon {
    padding-top: 5px;
}

.dvreminder img {
    height: 60px;
    width: 60px;
}

.dvreminder a {
    cursor: pointer;
    text-decoration: none;
    color: #000;
}

.remiderback {
    position: absolute;
    top: -27px;
    right: 13px;
}

.quick-link ul {
    margin: 0px;
}

    .quick-link ul li {
        border-bottom: 1px solid #eee;
        padding: 5px 0;
    }

        .quick-link ul li a {
            text-decoration: none;
            cursor: pointer;
            font-size: 13px;
            color: #4e5e6a;
            letter-spacing: 0px;
            -webkit-transition: all .4s ease;
            -ms-transition: all .4s ease;
            -moz-transition: all .4s ease;
            -o-transition: all .4s ease;
            transition: all .4s ease;
        }

            .quick-link ul li a:hover {
                padding: 0px 0px 0px 5px;
                letter-spacing: 2px;
                color: #5d7acf;
            }

.quicklink-span {
    font-size: 13px;
    width: 25px;
    float: left;
}

.dashboard-overlay {
    position: fixed;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background: rgba(255,255,255,0.5);
    visibility: hidden;
    opacity: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: opacity 0.4s 0s, visibility 0s 0.4s;
    -moz-transition: opacity 0.4s 0s, visibility 0s 0.4s;
    transition: opacity 0.4s 0s, visibility 0s 0.4s;
    z-index: 10;
}

    .dashboard-overlay.visible {
        visibility: visible;
        opacity: 1;
    }

/*---------------------------------left tab design by kishan-----------------------*/
.hr-suite-left-tab {
    background: #f1f1f1;
    border: 1px solid;
    border-color: #ddd #ddd #ddd #ddd;
    text-align: center;
    height: 75px;
    padding: 5px 8px;
}

    .hr-suite-left-tab p {
        margin-bottom: 0px;
    }

    .hr-suite-left-tab.active,
    .hr-suite-left-tab:hover {
        background: #fff;
        border: 1px solid;
        border-color: #ddd #fff #ddd #ddd;
        cursor: pointer;
    }

    .hr-suite-left-tab::after {
        content: '';
        background: #5a76cc;
        position: absolute;
        display: block;
        width: 4px;
        height: 0px; /*66px*/
        margin-top: 6px;
        margin-left: -8px;
        transition: height .3s;
        top: -7px;
    }

    .hr-suite-left-tab:hover::after,
    .hr-suite-left-tab.active::after {
        height: 75px;
        transition: height .3s;
    }

    .hr-suite-left-tab span {
        position: absolute;
        top: 47px;
        right: auto;
        line-height: 20px;
        left: 7px;
        color: white;
        height: 20px;
        width: 20px;
        border-radius: 10px;
        color: #20a220;
        font-size: 18px;
    }

.hr-suite-left-tab-content {
    display: none;
    height: 480px;
    background: #fff;
}

    .hr-suite-left-tab-content.active {
        background: #fff;
        display: block;
    }

.tab-caption {
    font-size: 12px;
    color: #757575;
}

.tab-dec {
    font-size: 12px;
    color: #757575;
}

.no-margin {
    margin: 0px !important;
}

.padding20 {
    padding: 20px;
}

/*---------------------------carsoul slider by kishan-----------------------------*/
/* jssor slider loading skin oval css */

.jssorl-oval img {
    animation-name: jssorl-oval;
    animation-duration: 1.2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@keyframes jssorl-oval {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}


/* jssor slider bullet navigator skin 05 css */
/*
        .jssorb05 div           (normal)
        .jssorb05 div:hover     (normal mouseover)
        .jssorb05 .av           (active)
        .jssorb05 .av:hover     (active mouseover)
        .jssorb05 .dn           (mousedown)
        */
.jssorb05 {
    position: absolute;
}

    .jssorb05 div, .jssorb05 div:hover, .jssorb05 .av {
        position: absolute;
        /* size of bullet elment */
        width: 16px;
        height: 16px;
        background: url('../plugins/carsoulslider/img/b05.png') no-repeat;
        overflow: hidden;
        cursor: pointer;
    }

    .jssorb05 div {
        background-position: -7px -7px;
    }

        .jssorb05 div:hover, .jssorb05 .av:hover {
            background-position: -37px -7px;
        }

    .jssorb05 .av {
        background-position: -67px -7px;
    }

    .jssorb05 .dn, .jssorb05 .dn:hover {
        background-position: -97px -7px;
    }

/* jssor slider arrow navigator skin 22 css */
/*
        .jssora22l                  (normal)
        .jssora22r                  (normal)
        .jssora22l:hover            (normal mouseover)
        .jssora22r:hover            (normal mouseover)
        .jssora22l.jssora22ldn      (mousedown)
        .jssora22r.jssora22rdn      (mousedown)
        .jssora22l.jssora22lds      (disabled)
        .jssora22r.jssora22rds      (disabled)
        */
.jssora22l, .jssora22r {
    display: block;
    position: absolute;
    /* size of arrow element */
    width: 40px;
    height: 58px;
    cursor: pointer;
    background: url('../plugins/carsoulslider/img/a22.png') center center no-repeat;
    overflow: hidden;
}

.jssora22l {
    background-position: -10px -31px;
}

.jssora22r {
    background-position: -70px -31px;
}

.jssora22l:hover {
    background-position: -130px -31px;
}

.jssora22r:hover {
    background-position: -190px -31px;
}

.jssora22l.jssora22ldn {
    background-position: -250px -31px;
}

.jssora22r.jssora22rdn {
    background-position: -310px -31px;
}

.jssora22l.jssora22lds {
    background-position: -10px -31px;
    opacity: .3;
    pointer-events: none;
}

.jssora22r.jssora22rds {
    background-position: -70px -31px;
    opacity: .3;
    pointer-events: none;
}
/*------------ for fix label in Useraccount.cshtml -------*/
.text-white {
    color: #fff;
}

.fixlabel {
    text-align: left !important;
    padding-right: 0px !important;
}

.userlabel {
    padding-left: 43% !important;
}

.client-link {
    text-decoration: none;
}

    .client-link:hover {
        text-decoration: underline;
        cursor: pointer;
    }

.dashed-link {
    border-bottom: 1px dashed #0088cc;
    text-decoration: none;
}

    .dashed-link:hover {
        text-decoration: none;
    }

.label-click {
    text-decoration: none;
    cursor: pointer;
}

    .label-click:hover {
        text-decoration: underline !important;
        color: #337ab7 !important;
    }

.disabled {
    cursor: default;
    pointer-events: none;
    color: gray;
    text-decoration: none;
}
/*---  For Icon Size in Expression Builder -----*/
.iconesize {
    width: 13px;
    height: 13px;
}

.achievement-caption {
    font-size: 26px;
    height: 40px;
    line-height: 40px;
}

.caption-top-1 {
    top: 45px;
}

.caption-top-2 {
    top: 85px;
}

.caption-top-3 {
    top: 105px;
}

/*----- Button and Page panel Design ------*/
.portlet-title {
    padding: 0;
    min-height: 35px;
    border-bottom: 1px solid #eee !important;
}

.caption {
    float: left;
    display: inline-block;
    font-size: 15px;
    line-height: 15px;
    padding: 3px 17px;
}

    .caption.bold {
        font-weight: 400;
    }

    .caption > i {
        float: left;
        margin-top: 0px !important;
        display: inline-block;
        font-size: 17px;
        margin-right: 5px;
        color: #666;
    }

.caption-helper {
    padding: 0;
    margin: 0;
    line-height: 13px;
    color: #9eacb4;
    font-size: 13px;
    font-weight: 400;
}

caption {
    color: #666;
    padding: 10px 0;
}

.caption-subject {
    font-size: 15px;
    font-family: Rubik,sans-serif !important;
}

.font-common-sharp {
    color: rgba(92, 92, 92, 0.83) !important;
}

.font-common-blue {
    color: rgb(73, 130, 189) !important;
    font-size: 13px;
}

.font-success-sharp {
    color: #4DB3A2 !important;
}

.font-danger-sharp {
    color: #f25656 !important;
}

.font-purple-sharp {
    color: #7a6fbe !important;
}

.bold {
    font-weight: 700 !important;
}

.uppercase {
    text-transform: uppercase !important;
}

.lowercase {
    text-transform: lowercase !important;
}

i.glyphicon {
    margin-top: 2px;
}

i {
    font-size: 12px;
}

.actions {
    float: right;
    display: inline-block;
    padding: 3px 0;
    padding: 3px 0px 3px 0;
}

.actionstest {
    float: left;
    display: inline-block;
    /*padding: 3px 0;*/
    padding: 1px 1px 1px 0px;
}


.actionstest_right {
    float: right;
    display: inline-block;
    /*padding: 3px 0;*/
    padding: 1px 1px 1px 0px;
}


/*------------button style for HR-suite-----*/
/*blue*/

.blue.btn {
    color: #FFFFFF !important;
    background-color: #4982bd !important;
    /*border: 1px solid #4982bd ;*/
}

    .blue.btn:hover,
    .blue.btn:focus,
    .blue.btn:active,
    .blue.btn.active {
        color: #FFFFFF !important;
        background-color: #4982bd !important;
        /*border: 1px solid #68a9ec ;*/
    }
/*Purple*/

.purple.btn {
    color: #FFFFFF !important;
    background-color: #7a6fbe !important;
    border: 1px solid #7a6fbe; /* This line added by daxa*/
}

    .purple.btn:hover,
    .purple.btn:focus,
    .purple.btn:active,
    .purple.btn.active {
        color: #FFFFFF !important;
        background-color: #7a518c !important;
    }

/*Green*/
.Green.btn {
    color: #FFFFFF !important;
    background-color: #1DB198 !important;
}

    .Green.btn:hover,
    .Green.btn:focus,
    .Green.btn:active,
    .Green.btn.active {
        color: #FFFFFF;
        background-color: #1f897f;
    }

/*Yellow*/

.Yellow.btn {
    color: #FFFFFF;
    background-color: #e8bf40;
}

    .Yellow.btn:hover,
    .Yellow.btn:focus,
    .Yellow.btn:active,
    .Yellow.btn.active {
        color: #FFFFFF;
        background-color: #af8c38;
    }

/*Red*/

.Red.btn {
    color: #FFFFFF;
    background-color: #e14444;
}

    .Red.btn:hover,
    .Red.btn:focus,
    .Red.btn:active,
    .Red.btn.active {
        color: #FFFFFF !important;
        background-color: #c23f44 !important;
    }

.btn > i {
    font-size: 14px;
}

.btn-sm {
    padding: 3px 10px 3px 10px !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
    border-radius: 3px;
}

    .btn-sm > i {
        font-size: 13px;
    }

    .btn-sm > [class^="glyphicon-"],
    .btn-sm > [class*=" glyphicon-"],
    .btn-sm > i {
        font-size: 13px !important;
        padding-right: 5px !important;
        /*padding-right: 0px !important;*/
        padding-bottom: 4px !important;
        font-weight: 500 !important;
    }

.btn {
    border-width: 0;
    padding: 7px 14px;
    font-size: 14px;
    outline: none;
    background: #F9F9F9;
    filter: none;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none;
    box-shadow: none !important;
    text-shadow: none !important;
    border: 1px solid #e5e5e5;
}

.btn-circle {
    border-radius: 25px !important;
}
/**btn default**/

.btn-hrsuit {
    color: #333 !important;
    background-color: #fff !important;
    border-color: #ccc !important;
    border-width: 1px !important;
    padding: 6px 13px !important;
}

    .btn-hrsuit:hover,
    .btn-hrsuit:focus,
    .btn-hrsuit:active,
    .btn-hrsuit.active {
        color: #333;
        background-color: #ededed;
        border-color: #b3b3b3;
    }

    .btn-hrsuit:active,
    .btn-hrsuit.active {
        background-image: none;
        background-color: #e0e0e0;
    }

        .btn-hrsuit:active:hover,
        .btn-hrsuit.active:hover {
            background-color: #e6e6e6;
        }

    .btn-hrsuit.disabled,
    .btn-hrsuit.disabled:hover,
    .btn-hrsuit.disabled:focus,
    .btn-hrsuit.disabled:active,
    .btn-hrsuit.disabled.active,
    .btn-hrsuit[disabled],
    .btn-hrsuit[disabled]:hover,
    .btn-hrsuit[disabled]:focus,
    .btn-hrsuit[disabled]:active,
    .btn-hrsuit[disabled].active,
    fieldset[disabled] .btn-hrsuit,
    fieldset[disabled] .btn-hrsuit:hover,
    fieldset[disabled] .btn-hrsuit:focus,
    fieldset[disabled] .btn-hrsuit:active,
    fieldset[disabled] .btn-hrsuit.active {
        background-color: #fff;
        border-color: #ccc;
    }

    .btn-hrsuit .badge {
        color: #fff;
        background-color: #333;
    }

    .btn-hrsuit > i {
        color: #aaa;
    }

        .btn-hrsuit > i[class^="icon-"],
        .btn-hrsuit > i[class*="icon-"] {
            color: #8c8c8c;
        }


/*-------- Button edit and delete for HR-suite ---------*/

.btn-edit {
    padding: 2px 6px 2px 8px;
    border-radius: 5px;
}

/* Button icon by Daxa */
.btn-icon {
    border: 0px;
    font-size: 14px;
    background-color: transparent;
    padding: 0px;
    bottom: 0px;
    position: relative;
    float: left;
}


    .btn-icon:focus {
        outline: none;
    }

.btn-delete {
    padding: 2px 9px 2px 9px;
    border-radius: 5px;
}

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

.i-bold {
    font-weight: bold !important;
}

.hr-font-green {
    color: #1DB198 !important;
}

.hr-font-purple {
    color: #7a6fbe !important;
}

.hr-font-yellow {
    color: #e8bf40 !important;
}

.hr-font-red {
    color: #e14444 !important;
}

.hr-font-orange {
    color: #ff6347 !important;
}

.hr-font-default {
    color: #777777 !important;
}

.hr-font-fiord {
    color: #4E5E6A !important;
}

.hr-font-fiord1 {
    color: #fff !important;
}

.hr-font-fiord2 {
    color: #fff !important;
}

.n-textdecoration {
    text-decoration: none !important;
}

.ls {
    letter-spacing: 1px;
}

.btn-wf-back {
    position: relative;
    right: -22px;
}

.btn-pwf-back {
    position: relative;
    right: -12px;
}

.btn-group {
    /*margin-bottom: 5px !important;*/
    position: relative !important;
    display: inline-block !important;
    vertical-align: middle !important;
}

/*------------- Delete Alert Message Common --------------------*/

.DeleteMsg {
    color: #f25656;
    font-weight: 500;
}

    .DeleteMsg:after {
        content: 'You are about to delete this record. It cannot be restored at a later time! Continue?';
    }

.myAltRowClass {
    background-color: #f9f9f9 !important;
}

    .myAltRowClass:hover {
        background-image: none;
        background-color: #EFF4F7 !important;
        opacity: 1;
    }
/*------------------- page-title design ---------------------------*/
.page-head {
    /*background: transparent;*/
    background: #f9f9f9;
    height: 40px;
    border-bottom: 1px solid #ddd;
}

    .page-head > .container {
        height: 100%;
    }

    .page-head .page-breadcrumb, .page-head .help-icon {
        padding-top: 0 !important;
    }

    .page-head > .container > .row {
        height: 100%;
        display: flex;
        align-items: center;
        margin-right: -8px;
        margin-left: -8px;
    }

    .page-head .page-breadcrumb ol.breadcrumb li.active {
        color: #516377;
        font-size: 14px;
        font-weight: 500;
        letter-spacing: 0.2px;
        font-family: Rubik,sans-serif !important;
    }

    .page-head .breadcrumb > li.active:before {
        padding-left: 5px;
    }

    .page-head .col-sm-8 {
        padding-left: 5px !important;
    }

#hdnApplicationBox {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

#mainnavbar.navbar .page-head.bg-white {
    box-shadow: 0px 10px 30px 0px rgb(82 63 105 / 5%) !important;
}

.page-head .help-icon-mobileview {
    padding-right: 0 !important;
}

@media only screen and (max-width:767px) {
    /*.page-head {
            height: auto;
        }*/
    .page-head .help-icon-mobileview {
        margin-top: 0px;
    }

    .page-head .No-m-display {
        display: none;
    }

    .page-head .col-sm-8 {
        flex: 1 1 80%;
    }

    .page-head .col-sm-4 {
        flex: 1 1 20%;
    }
}

.page-head .container {
    position: relative;
}

.page-head .page-title {
    display: inline-block;
    float: left;
    padding: 8px 0;
    border: none !important;
}

    .page-head .page-title > h1 {
        color: #697882;
        font-size: 22px;
        font-weight: 400;
        margin: 0;
    }

.breadcrumb {
    padding-top: 15px !important;
    border: 0 !important;
    background: none !important;
    background-color: none !important;
    font-size: 12px !important;
}

    .breadcrumb > li + li:before {
        padding: 0 !important;
        color: #3399cc;
        content: "/\00a0";
        font-weight: 800;
    }

/*--------- Page header -----------------*/
.header {
    text-decoration: none !important;
}

.addstar:after {
    content: ' *';
    color: #e02222;
}

/** Checklist Master by kajal**/
.tablepanel {
    background-color: none;
    border-bottom: 1px solid #ccc !important;
    /*border-top:1px solid #ccc !important;*/
    background-color: #f5f5f5 !important;
    /*border-width:1px medium;*/
}

.tableaddhref {
    color: #7a6fbe !important;
    text-decoration: none !important;
}

.tableadd {
    color: #22baa0 !important;
    text-decoration: none !important;
}

.table-purple {
    color: #7a6fbe !important;
}

.table-blue {
    color: #4982bd !important;
    font-size: 10px;
}

.Hrsuite-table {
    border-top: 1px solid #ccc !important;
    border-bottom: 1px solid #ccc !important;
    border-left: 1px solid #ccc !important;
    border-right: 1px solid #ccc !important;
}


.tabledeletehref {
    color: #e14444 !important;
    text-decoration: none !important;
}

.sub-title {
    float: left;
    text-transform: uppercase;
    color: rgba(92, 92, 92, 0.83);
    font-weight: 700;
    letter-spacing: 0.1em;
    padding-bottom: 5px;
}

.gray-border {
    border-bottom: 1px solid #eee !important;
    padding-bottom: 10px !important;
}

.gray-top-border {
    border-top: 1px solid #eee;
}

.Menuheader {
    font-size: 18px;
    color: #697882 !important;
    font-weight: 400;
    letter-spacing: 0.001em;
}

.p-r-0 {
    padding-right: 0px;
}

.p-r-10 {
    padding-right: 10px;
}

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

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

.p30 {
    padding: 30px;
}

.table-title {
    font-size: 13px;
    font-weight: 600;
    padding-bottom: 10px;
}

.table-title-light th {
    font-style: italic;
    font-weight: normal;
    text-align: center;
}

/** Remove Extra-padding and Margin for project by kishan **/
.n-Padd-T {
    padding-top: 0 !important;
}

.n-Padd-B {
    padding-bottom: 0 !important;
}

.n-Padd-TB {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.n-box-Shadow {
    box-shadow: none !important;
}

.n-M {
    margin: 0 !important;
}

.n-M-T {
    margin-top: 0 !important;
}

.n-M-B {
    margin-bottom: 0 !important;
}
/**for JQGrid Header by kishan**/
.jgGridHeader {
    background-image: none !important;
    background-color: #FFFFFF !important;
}
/**for gallery Delete Buttons*/
.hr-delete-gallery {
    padding: 0px 9px 2px 9px !important;
    margin-left: 15px !important;
    width: 100PX !important;
    height: 20px !important;
}

.blur {
    filter: blur(3px);
    -webkit-filter: blur(3px);
    -moz-filter: blur(3px);
    -o-filter: blur(3px);
    -ms-filter: blur(3px);
}

.imagePreview {
    max-height: 150px;
    max-width: 150px;
}

.input-backgrd-icone {
    float: right;
    margin-right: 6px;
    margin-top: -23px;
    position: relative;
    z-index: 2;
    color: rgba(16, 16, 16, 0.78) !important;
}

.img-calender {
    background: url(../../icons/calendar.png) no-repeat;
}

.greentext {
    color: #22BAA0 !important;
}

.purpletext {
    color: #7a518c !important;
}

.yellowtext {
    color: #e8bf40 !important;
}

.lblpointer:hover {
    cursor: pointer;
}

.EmpStickyMenu .tabs-vertical .nav-tabs {
    border-bottom: medium none;
    display: table-cell;
    float: none;
    height: 100%;
    padding: 0;
    vertical-align: top;
}

.EmpStickyMenu .tabs-left .nav-tabs > li a {
    /*border-left: 3px solid #eee;*/
    /*border-right: 1px solid #eee;*/
    margin-left: -3px;
    margin-right: -5px;
}

.EmpStickyMenu html body .tabs.tabs-vertical.tabs-left .nav-tabs li a:hover, html.dark body .tabs.tabs-vertical.tabs-left .nav-tabs li a:hover, html body .tabs.tabs-vertical.tabs-left .nav-tabs li.active a, html.dark body .tabs.tabs-vertical.tabs-left .nav-tabs li.active a, html body .tabs.tabs-vertical.tabs-left .nav-tabs li.active a:hover, html.dark body .tabs.tabs-vertical.tabs-left .nav-tabs li.active a:hover, html body .tabs.tabs-vertical.tabs-left .nav-tabs li.active a:focus, html.dark body .tabs.tabs-vertical.tabs-left .nav-tabs li.active a:focus {
    /*border-left: 3px solid #7a6fbe;*/
    /*border-left-color: #e5342c;*/
    /* border-left: 3px solid red;*/
    border-left: 3px solid #22BAA0;
}

.EmpStickyMenu .tabs .nav-tabs > li.active a {
    /*border-left-color: #7a6fbe;*/
    border-left-color: red;
    /*color: #7a6fbe;*/
    /*color: red;*/
    color: #22BAA0;
    font-weight: 600;
    border-right: 1px solid #ddd;
    background-color: #FFFFFF;
    border-top: 0 none;
}

.EmpStickyMenu .tabs-navigation .nav-tabs > li a::before {
    content: "";
    font-family: FontAwesome;
    margin-top: -7px;
    position: absolute;
    right: 15px;
    top: 50%;
}

.EmpStickyMenu .tabs-left .nav-tabs > li a:hover {
    /*border-left: 3px solid #7a6fbe;*/
    /* border-left: 3px solid red;*/
    border-left: 3px solid #22BAA0;
    border-top: 0 none;
    border-right: 1px solid #fff;
    /*background-color:#FFFFFF;*/
}

.EmpStickyMenu .tabs-navigation .nav-tabs > li a {
    color: #777;
    line-height: 100%;
    padding: 10px 50px 10px 10px;
    /*border-top: 1px solid #eee;*/
    background-color: #f9f9f9;
    width: 117%;
    border-right: 1px solid #fff;
}

.EmpStickyMenu .tab-pane-navigation.active {
    display: block;
}

.EmpStickyMenu .tab-pane-navigation {
    display: none;
}

.EmpStickyMenu .leftO {
    /*border-left: 1px solid #e4e4e4;*/
    /*border-right: 1px solid #e4e4e4;*/
    float: left;
    padding: 0 1px;
    position: relative;
}

.EmpStickyMenu .leftside {
    background: #f9f9f9 none repeat scroll 0 0;
    float: left;
    font-size: 12px;
    /*padding-top: 14px;*/
    width: 190px;
    height: 550px !important;
    padding-left: 20px;
    margin-top: 20px;
}

/*---------- delete trash svg icon animation for shift roshtering design by kishan --------------------*/

.icon {
    /* background: #000; */
    position: relative;
    left: 130px;
    /* width: 78px; */
    height: 48px;
    padding: 8px 0px 0px 5px;
    margin: -22px auto 0;
    /* border-radius: 5px; */
    transition: box-shadow .2s ease;
}
/*........added media qwery for ipad and mobile view by Nirupa.......*/
@media(max-width:768px) {
    .icon {
        /* background: #000; */
        position: relative;
        left: 285px;
        /* width: 78px; */
        height: 48px;
        padding: 8px 0px 0px 5px;
        margin: -22px auto 0;
        /* border-radius: 5px; */
        transition: box-shadow .2s ease;
    }

    .help-float-r {
        float: none !important;
    }
}

@media(max-width:500px) {
    .icon {
        /* background: #000; */
        position: relative;
        left: 107px;
        /* width: 78px; */
        height: 48px;
        padding: 8px 0px 0px 5px;
        margin: -22px auto 0;
        /* border-radius: 5px; */
        transition: box-shadow .2s ease;
    }
}

.icon:hover .lid, .icon:hover .lidcap {
    transform: rotate(-10deg);
    margin-bottom: 5px;
}

.lidcap, .lid, .bin {
    position: absolute;
}

.lidcap, .lid {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    background: #F92828;
    transition: transform .2s linear, margin .2s linear;
}

.lidcap {
    bottom: 36px;
    left: 47px;
    height: 4px;
    width: 9px;
}

.lid {
    bottom: 31.5px;
    left: 38px;
    width: 27px;
    height: 5px;
}

.bin {
    bottom: 0;
    left: 40px;
    width: 23px;
    border-top: 30px solid #F92828;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
}

.none {
    transform: none !important;
    margin-bottom: 0 !important;
}

.trashbackground {
    background: rgba(247, 0, 68, 0.08);
}

.hrsuite-danger {
    background-color: rgba(247, 0, 68, 0.20);
    -webkit-transition: background-color 1000ms linear;
    -moz-transition: background-color 1000ms linear;
    -o-transition: background-color 1000ms linear;
    -ms-transition: background-color 1000ms linear;
    transition: background-color 1000ms linear;
    z-index: 99999999;
}

.hrsuite-danger-reverse {
    background-color: #fff;
    -webkit-transition: background-color 1000ms linear;
    -moz-transition: background-color 1000ms linear;
    -o-transition: background-color 1000ms linear;
    -ms-transition: background-color 1000ms linear;
    transition: background-color 1000ms linear;
}

/*for success fadin and fadout color effects for project by kishan*/
.hrsuite-menubar-success {
    background-color: #87D3C5;
    -webkit-transition: background-color 1000ms linear;
    -moz-transition: background-color 1000ms linear;
    -o-transition: background-color 1000ms linear;
    -ms-transition: background-color 1000ms linear;
    transition: background-color 1000ms linear;
    z-index: 99999999;
}

.hrsuite-menubar-success-reverse {
    background-color: #fff;
    -webkit-transition: background-color 1000ms linear;
    -moz-transition: background-color 1000ms linear;
    -o-transition: background-color 1000ms linear;
    -ms-transition: background-color 1000ms linear;
    transition: background-color 1000ms linear;
}


/**login header background style by kishan*/
.loginheader {
    /*background: rgba(253, 250, 250, 0.6);*/
    /*background: -webkit-linear-gradient(top,#fff 0,#fefefe 60%,#f2f2f2 91%,#e1e1e1 100%);
    background: -o-linear-gradient(top,#fff 0,#fefefe 60%,#f2f2f2 91%,#e1e1e1 100%);
    background: -ms-linear-gradient(top,#fff 0,#fefefe 60%,#f2f2f2 91%,#e1e1e1 100%);
    background: linear-gradient(top,#fff 0,#fefefe 60%,#f2f2f2 91%,#e1e1e1 100%);*/
    -pie-background: linear-gradient(#fff,#e1e1e1);
    behavior: url(/common/assets/css/pie/PIE.htc);
    /*border-bottom: 1px solid #ccc;*/
}

.glyphicon1:before {
    font-family: "LinkedIn-Glyphs-2.0.7","LinkedIn-Glyphs";
    font-weight: normal;
    font-style: normal;
    text-decoration: inherit;
    speak: none;
    font-size: 32px;
    color: inherit;
    content: "\e039";
}

.profile-timeline ul li .timeline-item-header1 img {
    width: 33px;
    float: left;
}

.profile-timeline ul li .timeline-item-header1 p {
    margin: 0;
    padding-top: 8px;
    font-size: 19px;
}

.timeline-comment1 {
    overflow: hidden;
    /* margin-bottom: 10px; */
    width: 100%;
    /* border-bottom: 1px solid #f1f1f1; */
    padding-bottom: 5px;
}

/*----------------- custom scrollbar for menubar made by kishan ------------------------*/
.Hr-scroll::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    background-color: #F5F5F5;
}

.Hr-scroll::-webkit-scrollbar {
    width: 5px;
    background-color: #F5F5F5;
}

.Hr-scroll::-webkit-scrollbar-thumb {
    /*background-color: rgba(92, 92, 92, 0.83);
    border: 1px solid #555555;*/
    background-color: #9a9a9a; /*Changes By Nirupa*/
    border: 1px solid #9a9a9a; /*Changes By Nirupa*/
}

.notvalidrule {
    color: red !important;
}

.validrule {
    color: #22baa0 !important;
}

.table-responsive > .fixed-column {
    position: absolute;
    display: inline-block;
    width: auto;
    border-right: 1px solid #ddd;
}
/* @group Blink */

.blink {
    -webkit-animation: blink .75s linear infinite;
    -moz-animation: blink .75s linear infinite;
    -ms-animation: blink .75s linear infinite;
    -o-animation: blink .75s linear infinite;
    animation: blink .75s linear infinite;
}

@-webkit-keyframes blink {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 1;
    }

    50.01% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

@-moz-keyframes blink {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 1;
    }

    50.01% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

@-ms-keyframes blink {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 1;
    }

    50.01% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

@-o-keyframes blink {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 1;
    }

    50.01% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

@keyframes blink {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 1;
    }

    50.01% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

/* @end */

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

.p-t-xs {
    padding-top: 10px;
}

.p-t-lg {
    padding-top: 25px;
}

.btnbox {
    font-size: 23px;
    text-decoration: none;
    text-transform: none;
    float: right;
    margin-top: -6px;
}

.tabHeader {
    font-size: 15px;
    font-weight: normal;
    padding: 0px 16px 0px 16px;
}


/*Emp Profile*/
.pie-title-center {
    display: inline-block;
    position: absolute;
    text-align: center;
    right: 12px;
}

.pie-value {
    display: block;
    position: absolute;
    font-size: 8px;
    height: 20px;
    top: 68%;
    left: 0;
    right: 0;
    margin-top: -20px;
    line-height: 20px;
}

.panel .headhight {
    height: 22px;
}

.panel-highlight {
    min-height: 95px;
    padding-bottom: 10px;
}

    .panel-highlight:hover {
        /*background-color: rgba(223, 240, 255, 0.6);*/
        /*opacity: 0.7;*/
        box-shadow: 0 4px 12px rgba(0,0,0,0.25);
    }

.inbox-item {
    font-size: 13px;
    padding-bottom: 3px;
}

.grid li figure:hover .formaction {
    opacity: 1;
}

.formaction {
    opacity: 0;
    position: absolute;
    top: 35%;
    left: 41%;
}

.btnhover {
    border-width: 0;
    padding: 7px 11px;
    font-size: 16px;
    outline: none !important;
    background-image: none !important;
    filter: none;
    color: #fff;
    font-weight: 700;
    border-radius: 4px;
    margin-left: 10px;
}

    .btnhover:hover {
        -webkit-transform: scale(1.15, 1.15);
        -moz-transform: scale(1.15, 1.15);
        -ms-transform: scale(1.15, 1.15);
        -o-transform: scale(1.15, 1.15);
        transform: scale(1.15, 1.15);
        -webkit-box-shadow: 4px 4px 5px 0px rgba(179,179,179,1);
        -moz-box-shadow: 4px 4px 5px 0px rgba(179,179,179,1);
        box-shadow: 4px 4px 5px 0px rgba(179,179,179,1);
    }

.btnhover-green {
    background-color: #2baab1;
}

    .btnhover-green:hover {
        border: 2px solid #24868C;
    }

.btnhover-orange {
    background-color: #4982bd;
}

    .btnhover-orange:hover {
        border: 2px solid #4982bd;
    }

.btnhover-green {
    background-color: #2baab1;
}

    .btnhover-green:hover {
        border: 2px solid #24868C;
    }

.btnhover-blue {
    background-color: #0088cc;
}

    .btnhover-blue:hover {
        border: 2px solid #0175AF;
    }

.blurBox {
    cursor: pointer;
    opacity: 1;
    background-color: rgba(223, 240, 255, 0.6);
    -webkit-filter: blur(0.065em);
    -moz-filter: blur(0.065em);
    -o-filter: blur(0.065em);
    -ms-filter: blur(0.065em);
    filter: blur(0.065em);
}
/*------------- end of Emp Profile -----------------*/



/*------------------ custom class for short profile by kishan ------------------*/

.shortprofile-img img {
    display: block;
    margin: 0 auto;
    width: 150px;
    -webkit-box-shadow: 0 0 0 5px #fff;
    -moz-box-shadow: 0 0 0 5px #fff;
    -o-box-shadow: 0 0 0 5px #fff;
    box-shadow: 0 0 0 5px #fff;
    border: 1px solid #CCC;
    padding: 4px;
}

.shortprofile-info {
    float: left;
    text-align: left !important;
}

.shortprofile-goal h3 {
    margin-top: 5px;
    margin-bottom: 5px;
}

.shortprofile-basic h3 {
    margin-top: 5px;
    margin-bottom: 5px;
}


.todocheckbox {
    float: left;
    padding-right: 5px;
}

.nounderline {
    text-decoration: none;
}

/* ---------------------------------------- jssor slider bullet navigator skin 05 css by kishan  for dashbord */

.jssorb05 {
    position: absolute;
}

    .jssorb05 div, .jssorb05 div:hover, .jssorb05 .av {
        position: absolute;
        /* size of bullet elment */
        width: 16px;
        height: 16px;
        background: url('../images/sliderimg/b05.png') no-repeat;
        cursor: pointer;
    }

    .jssorb05 div {
        background-position: -7px -7px;
    }

        .jssorb05 div:hover, .jssorb05 .av:hover {
            background-position: -37px -7px;
        }

    .jssorb05 .av {
        background-position: -67px -7px;
    }

    .jssorb05 .dn, .jssorb05 .dn:hover {
        background-position: -97px -7px;
    }

/* jssor slider arrow navigator skin 12 css */
/*
            .jssora12l                  (normal)
            .jssora12r                  (normal)
            .jssora12l:hover            (normal mouseover)
            .jssora12r:hover            (normal mouseover)
            .jssora12l.jssora12ldn      (mousedown)
            .jssora12r.jssora12rdn      (mousedown)
            */
.jssora12l, .jssora12r {
    display: block;
    position: absolute;
    /* size of arrow element */
    width: 30px;
    height: 46px;
    cursor: pointer;
    background: url('../images/sliderimg/a12.png') no-repeat;
    overflow: hidden;
}

.jssora12l {
    background-position: -16px -37px;
}

.jssora12r {
    background-position: -75px -37px;
}

.jssora12l:hover {
    background-position: -136px -37px;
}

.jssora12r:hover {
    background-position: -195px -37px;
}

.jssora12l.jssora12ldn {
    background-position: -256px -37px;
}

.jssora12r.jssora12rdn {
    background-position: -315px -37px;
}

.Shiftloading {
    position: fixed;
    left: 50%;
    top: 50%;
    width: 100%;
    height: 100%;
}

/**btn-feedback design by kishan*/
.btn-feedback {
    border-radius: 50%;
    font-size: 24px;
    height: 56px;
    margin: auto;
    min-width: 56px;
    width: 56px;
    padding: 0;
    overflow: hidden;
    box-shadow: 0 1px 1.5px 0 rgba(0, 0, 0, 0.12), 0 1px 1px 0 rgba(0, 0, 0, 0.24);
    position: relative;
    line-height: normal;
    position: fixed !important;
    right: 16px;
    bottom: 16px;
    z-index: 999;
}

.demo-feedback {
    z-index: 900;
    position: fixed;
    bottom: 80px;
    width: 365px;
    max-width: 100%;
    border: 0;
    box-shadow: none;
    padding: 0;
    border-bottom-left-radius: 2px;
    right: 15px;
    z-index: 1240;
    background: #fff;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
    transition: -webkit-transform 0.15s ease;
    transition: transform 0.15s ease;
    transition: transform 0.15s ease, -webkit-transform 0.15s ease;
    box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.12), 0 1px 6px 0 rgba(0, 0, 0, 0.12);
}

    .demo-feedback .demo-feedback-body {
        padding: 20px;
        background-color: #fff;
        border-left: 1px solid #eeeeee;
        color: #616161;
    }

    .demo-feedback.active {
        -webkit-transform: scale(1) !important;
        transform: scale(1) !important;
    }

.btn-feedback-danger {
    background-color: #22baa0 !important;
    color: rgba(255,255,255, 0.84) !important;
}

.sub-menu.activemenu {
    display: inline-block !important;
}

.autodescription {
    margin-top: 5px;
    margin-left: 5px;
    float: left;
}

.list_item_container {
    padding: 1px 5px 0px 0px;
    width: 100%;
    float: left;
    cursor: pointer;
}

.list_item_containerM {
    padding: 10px 0px 0px 10px;
    width: 100%;
    float: left;
    cursor: pointer;
}

.Autoimage {
    float: left;
    padding-top: 8px 10px 0px 2px;
}

.AutoimageM {
    /*float: left; padding-top:8px 10px 0px 2px*/
    float: left;
    padding-top: 8px 10px 0px 2px;
}

.autodescriptionM {
    padding: 0px 1px 0px 10px;
    margin-left: 5px;
    float: left;
    margin-top: 1px;
    /*margin-top: 10px;
        margin-left: 5px;
        float: left;*/
}

/*-----------------------------------------workflow box design by kishan*/
.bg-light-green {
    background: rgb(207, 228, 251);
}

.bg-light-blue {
    background: rgba(73, 130, 189, 0.65);
}

.bg-light-info {
    /*background: rgba(8, 167, 195, 0.30);*/
    background: rgba(184, 212, 241, 1);
}

.bg-light-red {
    background: rgba(234, 69, 75, 0.30);
}

.hr-font-darkgreen {
    color: #008000;
}

.hr-font-Blue {
    color: #0825f3;
}

.hr-font-lightgreen {
    color: #58CBB7;
}

.hr-font-lightorange {
    color: #ffa500;
}

.hr-font-darkred {
    color: #ff0000;
}

.hr-font-orangered {
    color: #ff6a32;
}

.hr-font-black {
    color: #000;
}

.hr-font-yelloworange {
    color: #ffc966;
}

.hr-font-darkgray {
    color: #6b6b6b;
}

.selected-tr {
    /*background-color: rgba(148, 191, 43, 0.10);*/
    background-color: rgba(240, 243, 233, 0.1);
}

.hr-box {
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}

.bordered {
    border-right: 1px #F0F0F0 solid;
}

.green-box-active:after {
    content: '';
    /*background: #22baa0;*/
    background: #6b9dd2;
}

.info-box-active:after {
    content: '';
    background: #08A7C3;
}

.red-box-active:after {
    content: '';
    background: #ff0000;
}

.blue-box-active:after {
    content: '';
    background: #5a76cc;
}

.bordered:after {
    display: block;
    width: 0;
    height: 3px;
    margin-top: 3px;
    transition: width .3s;
}

.bordered:hover::after,
.bordered.active::after {
    width: 100%;
    /*transition: width .3s;*/
}

.control {
    position: absolute;
    right: 0px;
    top: -39px;
}

.value {
    line-height: 20px;
    font-size: 16px;
    font-weight: 900;
    color: #424242;
}

.count {
    position: absolute;
    left: 1%;
    font-size: 15px;
    opacity: 0.4;
    padding: 2px 5px;
}

.desciption {
    color: #898989;
    font-size: 13px;
}

/*---------------------------------------- clandar-form css for common by kishan*/


.Calendar-form {
    display: block;
    width: 100%;
    height: 40px;
    z-index: 1;
    position: fixed;
    background-color: #f5f5f5 !important;
    border-bottom: 1px solid #e9e9e9;
    margin-left: 1500px;
    margin-top: -39px;
    transition: all .8s ease;
    -moz-transition: all .8s ease;
    -webkit-transition: all .8s ease;
    -o-transition: all .8s ease;
    -ms-transition: all .8s ease;
}

    .Calendar-form .input-group {
        height: 40px;
    }

    .Calendar-form .form-group input {
        z-index: 0;
        color: #5f5f5f;
        box-shadow: none;
        border-radius: 0;
        background: none;
        height: 40px;
        line-height: 60px;
        font-size: 16px;
        padding: 0 20px !important;
        border-width: 0px 0px 2px;
        border-color: #12AFCB;
    }

.calendar-label {
    padding-top: 2px;
    color: #7a7a7a;
    font-size: 16px;
    padding-right: 0px;
    text-align: right;
    font-weight: 600;
}


/*-----------Kishan for modals-------------*/
.Hr-close {
    color: #fff;
    position: absolute;
    background: transparent;
    border: none;
    right: -18px;
    font-size: 16px;
    top: -7px;
    height: 44px;
    width: 44px;
}

    .Hr-close:before {
        content: '';
        position: absolute;
        height: 2px;
        width: 25px;
        left: 50%;
        top: 50%;
        background-color: #fff;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        -moz-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        -ms-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        -o-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        transform: translateX(-50%) translateY(-50%) rotate(-45deg);
    }

    .Hr-close:after {
        content: '';
        position: absolute;
        height: 2px;
        width: 25px;
        left: 50%;
        top: 50%;
        background-color: #fff;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        -moz-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        -ms-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        -o-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        transform: translateX(-50%) translateY(-50%) rotate(45deg);
    }

.Hr-mobile-close {
    color: #fff;
    position: absolute;
    background: transparent;
    border: none;
    right: -18px;
    font-size: 16px;
    top: -7px;
    height: 44px;
    width: 44px;
}

    .Hr-mobile-close:before {
        content: '';
        position: absolute;
        height: 3px;
        width: 32px;
        left: 50%;
        top: 50%;
        background-color: #fff;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        -moz-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        -ms-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        -o-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        transform: translateX(-50%) translateY(-50%) rotate(-45deg);
    }

    .Hr-mobile-close:after {
        content: '';
        position: absolute;
        height: 3px;
        width: 32px;
        left: 50%;
        top: 50%;
        background-color: #fff;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        -moz-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        -ms-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        -o-transform: translateX(-50%) translateY(-50%) rotate(45deg);
        transform: translateX(-50%) translateY(-50%) rotate(45deg);
    }

.Hr-close:hover {
    color: #D32F2F;
}

/*=====================form page loader backgroud ruby kishan====================*/
.pl-overlay {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    cursor: pointer;
    background: rgba(255, 255, 255, 0.72);
    visibility: visible;
    opacity: 1;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: opacity 0.4s 0s, visibility 0s 0.4s;
    -moz-transition: opacity 0.4s 0s, visibility 0s 0.4s;
    transition: opacity 0.4s 0s, visibility 0s 0.4s;
    z-index: 6000;
    /*z-index:9999;*/
}

.Hr-suite-addbtn,
.Hr-suite-addemp,
.Hr-suite-addnew {
    display: none;
    position: fixed;
    bottom: 3.5em;
    left: 2em;
    cursor: pointer;
    background-color: #1db198;
    border-radius: 50%;
    height: 45px;
    width: 45px;
    z-index: 99;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);
}

.Hr-suite-edithome {
    display: none;
    position: fixed;
    bottom: 1em;
    left: 2em;
    cursor: pointer;
    background-color: #1db198;
    border-radius: 50%;
    height: 45px;
    width: 45px;
    z-index: 99;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);
}

.Hr-suite-cancel {
    display: none;
    position: fixed;
    bottom: 1em;
    left: 2em;
    cursor: pointer;
    background-color: #d32f2f;
    border-radius: 50%;
    height: 45px;
    width: 45px;
    z-index: 99;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);
}

.Hr-suite-Save {
    display: none;
    position: fixed;
    bottom: 9em;
    left: 2em;
    cursor: pointer;
    /*background-color:#22a612;*/
    background-color: #5ead55;
    border-radius: 50%;
    height: 45px;
    width: 45px;
    z-index: 99;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);
}

.Hr-suite-btnpnl {
    position: fixed;
    bottom: 9em;
    left: 2em;
    cursor: pointer;
    background-color: #4982bd;
    border-radius: 50%;
    height: 45px;
    width: 45px;
    z-index: 99;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);
}

.Hr-suite-addbtn:before {
    content: '\f067';
    color: #FFF;
    position: absolute;
    margin-top: 7px;
    margin-left: 14px;
    opacity: 1;
    font-size: 22px;
    font-weight: 400;
    font-family: 'FontAwesome';
}

.Hr-suite-addemp:before {
    content: '\f234';
    color: #FFF;
    position: absolute;
    margin-top: 7px;
    margin-left: 14px;
    opacity: 1;
    font-size: 22px;
    font-weight: 400;
    font-family: 'FontAwesome';
}

.Hr-suite-addnew:before {
    content: '\f067';
    color: #FFF;
    position: absolute;
    margin-top: 8px;
    margin-left: 14px;
    opacity: 1;
    font-size: 22px;
    font-weight: 400;
    font-family: 'FontAwesome';
}

.Hr-suite-edithome:before {
    content: '\f040';
    color: #FFF;
    position: absolute;
    margin-top: 7px;
    margin-left: 14px;
    opacity: 1;
    font-size: 22px;
    font-weight: 400;
    font-family: 'FontAwesome';
}

.Hr-suite-cancel:before {
    content: '\f00d';
    color: #FFF;
    position: absolute;
    margin-top: 7px;
    margin-left: 14px;
    opacity: 1;
    font-size: 22px;
    font-weight: 400;
    font-family: 'FontAwesome';
}

.Hr-suite-Save:before {
    content: '\f00c';
    color: #FFF;
    position: absolute;
    margin-top: 8px;
    margin-left: 12px;
    opacity: 1;
    font-size: 22px;
    font-weight: 400;
    font-family: 'FontAwesome';
}

.Hr-suite-btnpnl:before {
    content: '\f067';
    color: #FFF;
    position: absolute;
    margin-top: 8px;
    margin-left: 13px;
    opacity: 1;
    font-size: 22px;
    font-weight: 400;
    font-family: 'FontAwesome';
}

.Hr-suite-Ruleaddbtn {
    display: none;
    position: fixed;
    bottom: 2em;
    left: 2em;
    cursor: pointer;
    background-color: #1db198;
    border-radius: 50%;
    height: 35px;
    width: 35px;
    z-index: 99;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);
}

    .Hr-suite-Ruleaddbtn:before {
        content: '\f067';
        color: #FFF;
        position: absolute;
        margin-top: 7px;
        margin-left: -25px;
        opacity: 1;
        font-size: 18px;
        font-weight: 400;
        font-family: 'FontAwesome';
    }

.pie-success {
    display: block;
    position: absolute;
    font-size: 10px;
    height: 20px;
    top: 32px;
    right: 15px;
    margin-top: -20px;
    line-height: 20px;
    color: #5cb85c;
}

.Hr-suite-iconset {
    position: relative;
    top: 2px;
}

    .Hr-suite-iconset i {
        font-size: 17px;
    }

.rostoring-tab {
    text-align: center;
    background: #879ee5 !IMPORTANT;
    COLOR: #FFF;
}

/*=====================================================// end custom css by KISHAN //================================================================*/
/*========================================================================================================================================================*/








/*==========================================================// Add by Anand // ====================================================================*/
/*===================================================================================================================================================*/
.req-header-view, .TechCalendar_curve_cnt {
    background: #CBCBCB url("../images/allCommon-Icons.png") repeat-x scroll 0px -2605px;
    border-width: 1px 1px 0px;
    border-style: solid;
    border-color: #D1D1D1;
    -moz-border-top-colors: none;
    -moz-border-right-colors: none;
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    border-image: none;
    padding: 2px 2px 2px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    height: 35px;
}

.formstylebutton:focus, .tableSearchGoButton:focus {
    border-color: rgba(82, 168, 236, 0.8);
    outline: 0px none;
    box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset, 0px 0px 8px rgba(82, 168, 236, 0.6);
}

button.formstylebutton {
    display: inline-block;
    line-height: normal;
}

.formstylebutton, .tableSearchGoButton {
    background-color: #F4F4F4;
    /*background-color: #1DB198 !important;*/
    border-radius: 3px;
    box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.5);
    color: #000;
    /*color: #1DB198;*/
    font-size: 12px;
    margin: 0px;
    padding: 5px 10px;
    /*text-shadow: 0px 1px 0px #222;*/
    cursor: pointer;
    border: 1px solid #DADADA;
    text-align: center;
}

.formstylebutton, .tableSearchGoButton {
    box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset;
    transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
}




/*=========================================================== //added by kajal //===================================================================*/
/*================================================== style for Shift Calendar added by kajal =======================================================*/

#calendar > div.fc-view-container > div > table > tbody > tr > td > div > div > div.fc-content-skeleton > table > tbody > tr > td > div > a {
    left: 0 !important;
    margin-right: 20px !important;
}
/* add common styles for all workflow by kajal */
.close > span {
    font-size: 34px;
    position: relative;
    top: -30px;
    right: -7px;
}

.p-0 {
    padding: 0 !important;
}

.p-t-10 {
    padding-top: 10px;
}

.p-l-5 {
    padding-left: 5px !important;
}

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

.fs-10 {
    font-size: 10px;
}

.fs-11 {
    font-size: 11px;
}

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

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

.fs13 {
    font-size: 13px !important;
}

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

.fs-16 {
    font-size: 16px;
}

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

.Appl-Head .fs-17 {
    font-size: 17px;
}

.Appl-Head .fs-13 {
    font-size: 13px;
}

.Appl-Head .fs-11 {
    font-size: 11px;
}

.fs-20 {
    font-size: 20px;
}

.fs-22 {
    font-size: 22px;
}

.fs-24 {
    font-size: 24px;
}

.Appl-List .fs-11 {
    font-size: 11px;
}

.Appl-List .fs-13 {
    font-size: 13px;
}

.Appl-List .fs-14 {
    font-size: 14px;
}

.t-d-n {
    text-decoration: none !important;
}

.m-t-10 {
    margin-top: 10px;
}

.t-a-c {
    text-align: center;
}

.input-border {
    border: 0;
    border-bottom: 1px solid #ddd;
    outline: 0;
    /*width: 100%;*/
}

.icon-f {
    font-size: 1.4em !important;
    cursor: pointer !important;
}

.v-a-m {
    vertical-align: middle !important;
}

.v-a-t {
    vertical-align: top !important;
}

.c-pointer {
    cursor: pointer !important;
}

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

.search-box {
    background-color: #fff !important;
    border: none !important;
}

.search-border {
    border: 0 !important;
    outline: 0 !important;
    width: 100% !important;
}

.gray-background {
    background-color: #f9f9f9;
}

.date-box {
    border: 1px solid #dce1e4;
    line-height: 1.68;
    padding: 6px 10px;
    float: left;
}

.to-box {
    font-size: 13px;
    background-color: #F5F5F5;
    padding: 6px;
    border: 1px solid #ccc;
    border-width: 1px 0px 1px 0px;
    float: left;
}

.text-curious {
    color: #337AB7;
}

.delete-btn {
    position: relative;
    top: 3px;
}

.h-28 {
    height: 28px;
}

.h-38 {
    height: 38px;
}

.h-42 {
    height: 42px;
}

.h-44 {
    height: 44px;
}

.w-85 {
    width: 90%;
}
/*================================================================== end kajal =======================================================================*/




/*======================================================= Added by Daxa Satanee,============================================================ */
.WithoutSlider li {
    width: 33.33333333% !important;
}

.WithoutSlider figure {
    padding-right: 5px !important;
    padding-top: 5px !important;
}

/** custom class for promotion increment by daxa  **/
.change-row {
    /*font-weight: bold;*/
    letter-spacing: 1px;
}

.hr-font-darkgreen {
    color: #009078 !important;
}

/* Used in Leave Application, Manual page added by Daxa */
.leave-box {
    /*box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.12), 1px 1px 1px 0 rgba(0, 0, 0, 0.12);*/
    position: relative;
    overflow: hidden;
    border-radius: 2px;
    display: table !important;
    border: 0;
    width: 100%;
    cursor: pointer;
    background: #9fde8b;
    padding: 2px 10px 2px 10px;
    border: 1px solid #9fde8b;
}

    .leave-box .tile-heading {
        font-size: 14px;
        display: block;
    }

    .leave-box .tile-body {
        font-size: 22px;
        font-weight: 300;
        position: relative;
        z-index: 1;
    }
/* ...............Added ny Nirupa...................*/
.leave-box2 {
    /*box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.12), 1px 1px 1px 0 rgba(0, 0, 0, 0.12);*/
    position: relative;
    overflow: hidden;
    border-radius: 2px;
    display: table !important;
    border: 0;
    width: 100%;
    cursor: pointer;
    background: #85aad1;
    padding: 2px 10px 2px 10px;
    border: 1px solid #85aad1;
}

    .leave-box2 .tile-heading {
        font-size: 14px;
        display: block;
    }

    .leave-box2 .tile-body {
        font-size: 22px;
        font-weight: 300;
        position: relative;
        z-index: 1;
    }

.pager-prev-btn {
    /*background-image: linear-gradient(to bottom, #fff, #e6e6e6);
    background-color: #f5f5f5;
    border: 1px solid;
    border-color: rgba(0, 0, 0, .1) rgba(0, 0, 0, .1) rgba(0, 0, 0, .25);
    color: #333;
    border-radius: 4px 0 0 4px;
    position: static !important;*/
    /*.......Changes by Nirupa.......*/
    /*background-image: linear-gradient(to bottom, #4982bd, #4982bd);*/
    background-color: #4982bd;
    border: 1px solid;
    /*border-color: rgba(0, 0, 0, .1) rgba(0, 0, 0, .1) rgb(73, 130, 189);*/
    border-color: rgb(250, 251, 253) rgb(251, 251, 253) rgb(251, 251, 253);
    color: #fff;
    border-radius: 4px 0 0 4px;
    position: static !important;
}

.pager-next-btn {
    /*background-image: linear-gradient(to bottom, #fff, #e6e6e6);
    background-color: #f5f5f5;
    border: 1px solid;
    border-color: rgba(0, 0, 0, .1) rgba(0, 0, 0, .1) rgba(0, 0, 0, .25);
    color: #333;
    border-radius: 0 4px 4px 0;
    position: static !important;*/
    /*.......Changes by Nirupa.......*/
    background-color: #86aed8;
    border: 1px solid;
    /*border-color: rgba(0, 0, 0, .1) rgba(0, 0, 0, .1) rgb(73, 130, 189);*/
    border-color: rgb(250, 251, 253) rgb(251, 251, 253) rgb(251, 251, 253);
    color: #fff;
    border-radius: 0 4px 4px 0;
    position: static !important;
}

/* End of Used in Leave Application, Manual page */



/* info box selection*/
.active-border-b {
    border-bottom: 4px solid rgb(236, 236, 236);
}

.active-info-box {
    border-bottom: 3px solid #22baa0;
    padding: 0 0 14px 0px;
    margin: 0px 0 -14px 15px;
}

.active-label {
    color: rgb(34, 186, 160) !important;
    font-weight: 500 !important;
}



/* Added by daxa on 24 june 2016*/
.italic {
    font-style: italic;
}

/* Added by kajal on 28 june 2016*/
.imgbox {
    border: 1px solid #eee;
    background: #fff;
    padding: 2px;
}
/* Added by daxa, Used in Leave History page  */
.no-border {
    border: none !important;
}


@media(max-width:992px) {
    .horizontal-bar .accordion-menu > li > ul {
        position: absolute;
        padding-top: 2%;
        padding-bottom: 2%;
        width: 680px;
        overflow-x: auto;
        overflow-y: hidden;
        margin-left: 7% !important;
    }
}

@media (max-width: 765px) {
    .horizontal-bar .accordion-menu > li > ul {
        position: absolute;
        padding-top: 2%;
        padding-bottom: 2%;
        width: auto !important;
        max-height: 270px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
    }
}


@media(max-width:667px) {
    .btn-wf-back {
        position: absolute;
        top: -140px;
        right: -2px;
    }

    .btn-pwf-back {
        position: absolute;
        top: -190px;
        right: 5px;
    }

    .top-xl {
        top: -217px !important;
    }

    .caption-helper {
        display: none;
    }
}

@media screen and (max-width: 60em) {
    .WithoutSlider li {
        width: 50% !important;
    }
}

@media screen and (max-width: 35em) {
    .WithoutSlider li {
        width: 100% !important;
    }
}
/* Responsive */
@media (max-width: 479px) {
    .owl-carousel-spaced {
        margin-left: 0;
    }
}

@media (max-width: 991px) {
    .carousel-areas .owl-carousel .owl-nav {
        display: none;
    }
}


/*================================================================ media query by KISHAN ===========================================================*/
/*=================================================================================================================================================*/
.m-v-0 {
    margin-right: 0px !important;
    margin-left: 0px !important;
}

.sub_title {
    font-size: 16px;
    text-align: center;
    min-height: 43px;
}

    .sub_title.sub_title-1 {
        padding: 0;
        overflow: hidden;
        height: 60px;
        /*line-height: 60px;*/
        -webkit-overflow-scrolling: touch;
    }

        .sub_title.sub_title-1.sticky {
            position: fixed;
            top: 70px;
            z-index: 2;
            width: 100%;
        }

.categorynav {
    max-width: 1200px;
    overflow-x: scroll;
    margin: 0 auto;
    overflow-y: hidden;
    height: 78px;
}

.lg-rem {
    width: 20px !important;
    margin-right: 7px !important;
}

.modal-w50 {
    width: 50%;
}

.Hr-close-85 {
    right: 38px;
}

@media (max-width: 767px) {

    .cover-image .profile-name {
        top: 175px;
        left: 10px;
        color: #000;
    }

    .about .designation {
        text-align: left;
        margin-left: 0px;
        padding-left: 26px;
        padding-top: 35px;
    }

    .profile-header-bg {
        display: none;
    }

    .profile-pic {
        margin-left: 30%;
    }

    .about .brief {
        padding-top: 0px;
        margin-left: 5px;
    }

    .dvreminder {
        width: 100%;
        margin: 5px 0px;
    }

    .sub_title {
        font-size: 16px;
        text-align: center;
        min-height: 43px;
    }

        .sub_title.sub_title-1 {
            padding: 0;
            overflow: hidden;
            height: 60px;
            -webkit-overflow-scrolling: touch;
        }

            .sub_title.sub_title-1.sticky {
                position: fixed;
                top: 70px;
                z-index: 2;
                width: 100%;
            }

    .categorynav {
        max-width: 1140px;
        overflow-x: scroll;
        overflow-y: hidden;
        height: 80px;
    }

        .categorynav div {
            width: 650px;
            white-space: nowrap;
            height: 65px;
        }

    .Hr-dateragepicker {
        width: 42%;
    }

    .no-p-l {
        padding-left: 10px !important;
    }

    .no-p-r {
        padding-right: 10px !important;
    }

    .No-m-display {
        /*display: none !important;*/
    }

    .No-m-visible {
        visibility: hidden !important;
    }

    .breadcrumb > li + li:before {
        padding: 0 !important;
        color: #ccc;
        content: "";
    }

    #main-wrapper {
        margin-top: 35px;
    }

    .tab_title.tab_title-1 {
        padding: 0;
        overflow: hidden;
        height: 47px;
        -webkit-overflow-scrolling: touch;
    }

        .tab_title.tab_title-1.sticky {
            position: fixed;
            top: 70px;
            z-index: 2;
            width: 100%;
        }

    .tabslider {
        max-width: 1140px;
        overflow-x: scroll;
        overflow-y: hidden;
        height: 80px;
    }

        .tabslider ul {
            /*width: 650px;*/ /*--------changes by Nirupa for mobile view problem solution-----------*/
            width: 1170px;
            white-space: nowrap;
            height: 65px;
        }

    .Hr-close {
        right: 15px !important;
        top: 5px !important;
    }

        .Hr-close:before,
        .Hr-close:after {
            background-color: #676767;
            z-index: 1 !important;
        }

    .Hr-mobile-close:before,
    .Hr-mobile-close:after {
        background-color: #fdfdfd;
        z-index: 1 !important;
    }

    /*.navbar .logo-box {
        margin-left: 30%;
    }*/
    .navbar .logo-box {
        margin-left: 15%;
        width: auto;
    }

    .mob-drops {
        border: 1px solid #d8dee4 !important;
    }

    .navbar-nav .open .dropdown-menu {
        background-color: #fff !important;
    }

    .navbar-right .dropdown-menu:before {
        right: 12px !important;
        top: 52px !important;
    }

    .profile-cover1 {
        margin-top: 30px !important;
    }

    .ui-autocomplete {
        margin-left: 0px !important;
        left: 0px !important;
        min-width: 350px !important;
    }

    .Hr-suite-addbtn,
    .Hr-suite-Ruleaddbtn {
        display: block;
    }

    .Hr-suite-addemp {
        bottom: 1em !important;
    }

    .Hr-suite-loginbox {
        float: none !important;
        margin: 0px 15px !important;
    }

    .achievement-caption {
        font-size: 12px;
        height: 20px;
        line-height: 20px;
    }

    .caption-top-1 {
        top: 45px;
    }

    .caption-top-2 {
        top: 70px;
    }

    .caption-top-3 {
        top: 75px;
    }

    @media(max-width:500px) {
        .Hr-suite-addemp {
            bottom: 3.5em !important;
        }
    }

    /*---------------------------emp-profile mobile view----------------------------*/
    .profileicon {
        float: none;
    }

    .panel .panel-heading .panel-title {
        font-size: 12px;
    }

    .tabHeader {
        padding: 0px 16px 0px 0px;
    }
    /*-------------------------------------------------------*/
    .modal-w50 {
        width: 100%;
    }
}
/*--------Added tabpanel Media for ipad View by Nirupa-----------*/
@media(max-width:768px) {
    .tab_title.tab_title-1 {
        padding: 0;
        overflow: hidden;
        height: 47px;
        -webkit-overflow-scrolling: touch;
    }

    .tabslider {
        max-width: 1170px;
        overflow-x: scroll;
        overflow-y: hidden;
        height: 80px;
    }

        .tabslider ul {
            width: 1170px;
            white-space: nowrap;
            height: 65px;
        }
}

@media(max-width:500px) {
    .cover-image .profile-name {
        top: 175px;
        left: 25%;
        color: #000;
        padding-top: 10px;
    }
}

.cat_core_icons-block .cat_core {
    text-align: center;
    display: inline-block;
    font-size: 2.57rem;
    padding: .71rem 2.14rem;
    box-sizing: content-box;
    border-radius: 3px;
    background: #eef0f4;
    margin: .71rem;
}

    .cat_core_icons-block .cat_core:hover {
        background: #222034;
        color: #fff;
    }

.event-pic {
    width: 90px;
    height: 90px;
    position: relative;
    z-index: 99;
    background-size: cover;
    border-radius: 50%;
    border: 4px solid rgba(225, 225, 225, 1.5);
    margin-top: -5px;
    margin-left: 0px;
}

/* Added by Daxa Satanee, Used in MyAttnTimeSheet, EmpAttnTimeSheet*/
.div-circle {
    width: 40px;
    height: 40px;
    border-radius: 50px;
    padding: 12px 0;
    text-align: center;
    font-weight: 500;
    font-size: 12px;
    cursor: pointer;
}

.time-sheet-tooltip {
    padding: 10px;
    right: 0;
    left: inherit;
    min-width: 145px;
    top: 32px;
}

    .time-sheet-tooltip li a {
        padding: 5px 0px;
    }

    .time-sheet-tooltip::before {
        top: -8px !important;
        left: auto !important;
        right: 6px !important;
    }

    .time-sheet-tooltip::after {
        top: -7px !important;
        left: auto !important;
        right: 7px !important;
    }

/*--for red border by chandni-----------------*/
.Red-Border {
    border-color: red !important;
}
/*--------------------------------------------*/


/*----for file uploading btn style added by hardik-------*/

.btn-fileuploading {
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    border-color: black;
}

.btn1-fileuploading {
    border-width: 0;
    padding: 3px 3px;
    font-size: 14px;
    outline: none;
    background: #F9F9F9;
    filter: none;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none;
    box-shadow: none !important;
    border: 1px solid black;
    cursor: pointer;
}

/*--------------------------------------------------*/

/*---add by chandni for report designer-----------------------------------------------*/
.btn-UpDown {
    border-width: 0;
    background: #F9F9F9;
    filter: none;
    box-shadow: none !important;
    text-shadow: none !important;
    font-size: 19px;
    line-height: 1.5;
    border-radius: 3px;
}

.btn-RedColor {
    border: 1px solid #e5e5e5;
    background-color: #fff;
    color: #333;
}

    .btn-RedColor:hover {
        border: 1px solid #ff0000;
        background-color: #fff;
        color: #ff0000;
    }

.btn-GreenColor {
    border: 1px solid #e5e5e5;
    background-color: #fff;
    color: #333;
}

    .btn-GreenColor:hover {
        border: 1px solid #3d8218;
        background-color: #fff;
        color: #3d8218;
    }

.btn-Triangle {
    margin: 92px 0px 11px 10px;
    width: 0;
    height: 0;
    border-top: 30px solid transparent;
    border-bottom: 30px solid transparent;
    border-left: 34px solid #7a6fbe;
    cursor: pointer;
}
/*.btn-Triangle:hover {
        margin: 92px 0px 11px 10px;
        width: 0;
        height: 0;
        border-top: 30px solid transparent;
        border-bottom: 30px solid transparent;
        border-left: 34px solid #7a6fbe;
        padding:1px !important;
    }*/
.P-33-10 {
    padding: 33px 10px 33px 10px !important;
}

.P-33-15 {
    padding: 32px 15px 32px 15px !important;
}

.m-l-25 {
    margin-left: 25px !important;
}
/*--------------------------------------------------*/

/*----for help icon added by hardik-------*/

.help-master-icon {
    float: right;
    font-size: 18px;
    /*color: #fff;*/
    color: #4982bd;
    padding-right: 11px;
    margin-right: 59px;
}

.help-icon {
    padding-left: 15px;
}

.myapp {
    margin-left: 0px;
}

.repview {
    margin-top: 80px;
    margin-bottom: 60px;
    border: 1px solid #23212152;
}

@media(max-width:768px) {
    .help-icon-mobileview {
        float: right;
        font-size: 18px;
        margin-right: 134px;
    }

    .repview {
        margin-top: 5px;
        margin-bottom: 5px;
        border: 1px solid #c5c5c5;
        margin-left: 159px;
    }

    .desciption {
        color: #898989;
        font-size: 12px;
    }

    .myapp {
        margin-left: -54px !important;
    }

    .i-nopad {
        padding: 0px !important;
    }

    .ipad-mt6 {
        margin-top: 6px !important;
    }

    .ipad-mr46 {
        margin-right: 46px;
    }

    .ipad-pl65 {
        padding-left: 56px !important;
    }

    .ipad_width416 {
        width: 416px !important;
    }

    .lcm-m4 {
        margin-left: 4px !important;
    }
}

.l-height {
    height: 70px;
    width: 70px;
}

.fbt {
    bottom: 4em;
}

@media(max-width:500px) {
    .lcm-m4 {
        margin-left: 0px !important;
    }

    .fbt {
        bottom: 3.5em;
    }

    .mob-tleft {
        text-align: left;
    }

    .l-height {
        height: 90px;
        width: 90px;
    }

    .repview {
        margin-top: 5px;
        margin-bottom: 5px;
        border: 1px solid #c5c5c5;
        margin-left: 9px;
    }

    .myapp {
        margin-left: 1px !important;
    }

    .profile-quote {
        margin-top: 10px;
        border-top: 4px double #e6e6e6;
    }

    .mob_width500 {
        width: 500px !important;
    }

    .mob_width20 {
        width: 20px !important;
    }

    .mob-mr-21 {
        margin-right: -11px !important;
        float: right;
    }

    .mob-mt60 {
        margin-top: -60px !important;
    }

    .mob-mtm100 {
        margin-top: -100px !important;
    }

    .help-icon-mobileview {
        float: right;
        font-size: 18px;
        margin-top: -28px;
        margin-right: 9px;
    }

    .mob-nopad {
        padding: 0px !important;
    }

    .mob-plr30 {
        padding: 0px 13px 0px 13px !important;
    }

    .ipad-pl65 {
        padding-left: 0px !important;
    }

    .mob-pt15 {
        padding-top: 15px;
    }

    .mob-radius {
        border-radius: 50px !important;
    }
}


/*--------------------------------------------------*/

/*----for FAQ view added by hardik-------*/


.faq_que {
    margin: 0px;
    padding: 0px 0px 3px 0px;
    display: inline-block;
    cursor: pointer;
    font-weight: bold;
}

.faq_question {
    margin: 0px;
    padding: 0px 0px 5px 0px;
    display: inline-block;
    cursor: pointer;
    font-weight: bold;
}

.faq_answer_container {
    height: 0px;
    overflow: hidden;
    padding: 0px;
}

/*--------------------------------------------------*/

/*---- for salary process page by daxa -------*/

.tabSmallText {
    padding: 0px !important;
    color: #757575;
    line-height: 9px;
    text-align: center;
    font-size: 11px;
    font-style: italic;
    margin: 10px 0 0;
}
/*--------------------------------------------------*/

/*Word wrap to confirmation box by chandni------------------------------------------------*/
#confirmBox p {
    word-wrap: break-word;
    max-height: 200px;
    overflow-y: auto;
}
/*-----------------------------------------------*/

.Font-Size-13 {
    font-size: 13px !important;
}


/*----for wizard designing tab added by hardik 06-Dec-2017-------*/
.process-step .btn:focus {
    outline: none;
}

.process-stepOBP .btn:focus {
    outline: none;
}

.process {
    display: table;
    width: 100%;
    position: relative;
}

.process-row {
    display: table-row;
}

.process-step button[disabled] {
    opacity: 1 !important;
    filter: alpha(opacity=100) !important;
}

.process-stepOBP button[disabled] {
    opacity: 1 !important;
    filter: alpha(opacity=100) !important;
}

.process-row:before {
    top: 40px;
    bottom: 0;
    position: absolute;
    content: " ";
    width: 100%;
    height: 1px;
    background-color: #3399cc;
    z-order: 0;
}

.process-step {
    display: table-cell;
    text-align: center;
    position: relative;
}

    .process-step p {
        margin-top: 4px;
    }

.process .process-stepOBP {
    display: table-cell;
    text-align: center;
    position: relative;
}

.process-stepOBP p {
    margin-top: 4px;
}

.btn-circle {
    width: 80px;
    height: 80px;
    text-align: center;
    font-size: 12px;
    border-radius: 50%;
}

.tabcolor {
    background-color: #3399cc;
}

/*-----------------------------------------------*/

/*=========================================================== //added by Daxa //===================================================================*/
/*================================================== style for Dashboard -> My Attendance =========================================================*/
.daybox {
    padding: 5px;
    color: #545454;
    float: left;
    text-align: center;
    margin-right: 3px;
    margin-bottom: 10px;
    width: 13.2%;
    border: 1px solid #b1b4b7;
    font-weight: bold;
    font-size: 10px;
    cursor: pointer;
}

    .daybox:hover {
        transform: scale(1.1);
    }

.selected {
    transform: scale(1.1);
}

.legendbox {
    padding: 5px;
    float: left;
    margin-right: 6px;
    margin-top: 1px;
    border: 1px solid #337ab7;
}

.progress-bar-text {
    top: 20px;
    position: absolute;
    color: black;
}

.btn-selected {
    color: #fff !important;
    background-color: #337ab7 !important;
}

/*================================================== style for Dashboard -> Team Attendance =========================================================*/

.team-daybox {
    vertical-align: middle !important;
    white-space: nowrap;
    text-align: center;
    font-weight: bold;
    font-size: 11px;
}

.btn-disabled {
    color: #afafaf;
}

/*================================================== style for Dashboard -> Alert =========================================================*/
.draw-circle {
    width: 40px;
    height: 40px;
    border-radius: 22px;
    padding: 11px 0;
    text-align: center;
    font-weight: bold;
    background-color: rgba(29, 177, 152, 0.75);
    color: white;
    font-size: 14px;
}

.Alert-Name {
    display: block;
    padding-top: 12px !important;
    padding-bottom: 10px !important;
    /*text-align: center;*/
    font-size: 13px !important;
    color: #4e5e6a !important;
    margin: 0;
    float: left;
}
/*  ==================================================================================================
    ================================== Custom Css Class Added By Nirupa =============================
    ==================================================================================================
*/

/* Start Login Header*/
.logo-mtb {
    margin: 10px 0px;
}

.lgn-wlcm {
    font-size: 22px;
    /*margin-top: 24px;*/
    font-size: 22px;
    vertical-align: middle;
    margin-bottom: 20px;
}

@media(max-width:768px) {

    /* Start Login Header*/
    .lgn-wlcm {
        font-size: 16px;
        margin-top: 26px;
    }

    .f-left {
        float: left !important;
    }

    .logo-mtb {
        margin: 10px 0px;
        width: 225px;
    }

    .pr {
        float: none !important;
    }
    /* End Login Header*/
}

@media(max-width:720px) {
    .mob-logo-ml {
        margin-left: 34%;
    }

    .tab-center {
        text-align: center;
    }
}

@media(max-width:500px) {
    .mob-m5 {
        margin: 5px;
    }

    .mob-mt7 {
        margin-top: 7px;
    }

    .mob-pad {
        margin-top: 8px;
        margin-bottom: 2px;
    }

    .mob-logo-ml {
        margin-left: 68px;
    }

    .pr {
        float: none !important;
    }
}

.pr {
    float: right;
}

.p-lr20 {
    padding: 0px 20px;
}

.pl43pt6 {
    padding-left: 43px;
    padding-top: 6px;
}

.fp-box {
    border: 6px double#eee;
    padding: 40px 20px;
}

.mtb10 {
    margin: 10px 0px;
}

.mb10 {
    margin-bottom: 10px;
}

/*........Dashbourd Box............*/

.box-inner-img {
    position: absolute;
    top: 59px;
    right: 10px;
}

.box-inner-int {
    color: #fff;
    font-size: 50px;
    text-align: left;
    padding-left: 10px;
}

.mt18 {
    margin-top: 18px;
}

.pl40 {
    padding-left: 40px;
}

@media(min-width:767px) {
    .dashbourd-top {
        top: -20px;
    }
}

.h60 {
    height: 60px;
}

/* ==============Core Module Responsive=================*/
.export-box {
    width: 200px;
    height: 80px;
    cursor: pointer;
    float: left;
    margin: 0 auto;
    margin: 0px 5px;
    padding: 15px;
    border: 1px solid #c5c3c3;
    border-left: 3px solid #39c;
}

.export-box-detail {
    font-size: 28px;
    margin-bottom: 14px;
    color: #374051;
    font-weight: 400;
    margin-bottom: 0px;
    margin-top: 11px;
}

.ind-104 {
    height: 111px !important;
}

@media(max-width:1024px) {
    .ind-104 {
        height: 130px !important;
    }
}

@media(max-width:768px) {
    .mbl-pt-10 {
        padding-top:10px;
    }
    .mbl-pt-15 {
        padding-top: 15px;
    }
    .mbl-pt-20 {
        padding-top: 20px;
    }
    .mbl-pt-25 {
        padding-top: 25px;
    }
    .mbl-pt-30 {
        padding-top: 30px;
    }
    .mbl-pt-35 {
        padding-top: 35px;
    }
    .mbl-pt-40 {
        padding-top: 40px;
    }

    .mbl-pt-10 {
        padding-top: 10px;
    }
    .ind-104 {
        height: 130px !important;
    }

    .ipad-mt15 {
        margin-top: 15px;
    }

    .ipad-ml15 {
        margin-left: 15px;
    }

    .ipad-mt10 {
        margin-top: 10px !important;
    }

    .ipad-mt5 {
        margin-top: 5px;
    }

    .pl40 {
        padding-left: 31px !important;
    }

    .pl43pt6 {
        padding-left: 26px;
        padding-top: 6px;
    }
}

@media(max-width:500px) {
    .ind-104 {
        height: 130px !important;
    }

    .mob_widht1100 {
        width: 1100px !important;
    }

    .mob_widht800 {
        width: 800px !important;
    }

    .mob-p15 {
        padding: 15px !important;
    }

    .mob_widht700 {
        width: 700px !important;
    }

    .mob_widht330 {
        width: 330px !important;
    }

    .mob-scroll {
        overflow-x: scroll;
    }

    .mob-mt15 {
        margin-top: 15px !important;
    }

    .mob-mt10 {
        margin-top: 10px !important;
    }

    .mob-pl0 {
        padding-left: 0px !important;
    }

    .mob-mt18 {
        margin-top: 18px !important;
    }

    .mob-mb-12 {
        margin-bottom: 12px;
    }

    .export-box {
        width: 276px;
        height: 80px;
    }

    .mt7 {
        margin-top: 7px;
    }

    .prr {
        float: none !important;
    }

    .mob-pr {
        float: right;
    }

    .mob-mt8 {
        margin-top: 8px !important;
    }

    .mob-mt80 {
        margin-top: 80px !important;
    }
}

.pt4 {
    padding-top: 4px;
}

.btn-pad {
    margin-top: 15px;
    padding-left: 0px;
}

.mb4 {
    margin-bottom: 4px;
}

.bg-eee {
    background-color: #eee;
}

.drop-bg {
    background-color: #e2dff3;
    margin-bottom: 10px;
}

.usergrp-brdr {
    border-bottom: 4px double #cdc9e6;
    margin-bottom: 12px;
}

.f14 {
    font-size: 14px;
    text-transform: uppercase;
}

.pb10 {
    padding-bottom: 10px;
}

.pb12 {
    padding-bottom: 12px;
}

.mr7 {
    margin-right: 7px;
}

.mt7 {
    margin-top: 7px;
}

.mr14 {
    margin-right: 14px;
}

.mt8 {
    margin-top: 8px;
}

.mt3 {
    margin-top: 3px;
}

.gio-tag {
    width: 70px;
    margin: 8px auto;
}

    .gio-tag img {
        width: 100%;
    }

.module-fsize {
    vertical-align: middle;
    line-height: 2;
    font-weight: 600;
    margin-top: 3px;
    color: #777;
}

.module-label {
    vertical-align: middle;
    line-height: 2;
    margin-top: 3px;
    color: #777;
}

.w200 {
    width: 200px;
}

.panel-brdr {
    border-bottom: 1px solid #eee;
}

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

.help-bkbtn {
    margin-top: 8px;
}

.prr {
    float: right;
}

.help-float-r {
    float: right;
}

.m-tb10 {
    margin-top: 10px;
    margin-bottom: 10px;
}

.mt-m1 {
    margin-top: -1px !important;
}

.color-39c {
    color: #39c;
}

.pl20 {
    padding-left: 20px;
}

.panel-btn {
    margin: 5px 9px 5px 0px !important;
}

.btn_travel {
    padding: 8px 12px 8px 12px !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
    border-radius: 3px;
}
/*===============Dashbourd responsive team media added by Nirupa ====================*/
@media(max-width:500px) {
    .team-width {
        width: 312px !important;
    }
}

@media(min-width:992px) {
    .team-width {
        width: 354px;
    }
}

@media(max-width:768px) {
    .team-width {
        width: 692px;
    }
}

.holidaytm {
    margin-top: 0px;
}

/*.noty-bg {
    background-color:#f3f3f3;
}*/

/*===============Login media added by Nirupa ====================*/
.login-bg {
    margin: 0px 0px 0px 0px !important;
    /*background: url(/../Content/assets/images/loginimg/Loginbgwoman1920X1080.jpg) no-repeat;*/
}

.loginbox {
    /*background: rgba(255, 255, 255, 0.65);
    height: 394px;*/
    /*margin-top: 17%;
    padding: 14% 0% 10% 0%;
    margin-bottom: 80%;
    margin-left: 20px;
    margin-right: 15px;*/
}

.trans-bg {
    /*background: rgba(255, 255, 255, 0.65);*/
    /*padding: 35px 35px;*/
    padding: 18px 35px 35px 35px;
    margin-top: 21%;
    margin-bottom: 25%;
    height: 405px;
    max-height: 405px;
}

.footer-login {
    position: fixed !important;
    bottom: 0;
    width: 100%;
    overflow: visible;
    z-index: 0;
    clear: both;
    vertical-align: baseline;
}

@media(max-width:768px) {
    .trans-bg {
        /*background: rgba(255, 255, 255, 0.65);*/
        padding: 25px;
        margin-top: 70%;
        margin-bottom: 310px;
    }
}

@media(max-width:720px) {
    .trans-bg {
        /*background: rgba(255, 255, 255, 0.65);*/
        padding: 25px;
        margin-top: 2% !important;
        margin-bottom: 310px;
    }

    .lleft {
        margin-left: 24%;
    }
}

@media(max-width:500px) {
    .lleft {
        margin-left: 2%;
    }

    .trans-bg {
        /*background: rgba(255, 255, 255, 0.65);*/
        padding: 25px;
        margin-top: 10% !important;
        margin-bottom: 25% !important;
    }
    /*.mob-navbg {
    background: #fff !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.25) !important;
    }*/
}

.footer-login {
    position: fixed !important;
    bottom: 0;
    width: 100%;
    overflow: visible;
    z-index: 99;
    clear: both;
    /*background: rgba(2, 2, 2, 0.65);*/
}

    .footer-login p {
        /*color:#fff;*/
        padding-top: 8px;
        text-align: center;
        font-size: 10px;
    }

.login-profile {
    height: 100px;
    width: 100px;
    border: 1px solid #eee;
    padding: 2px;
    border-radius: 51%
}

.f-username {
    font-size: 16px;
    color: #000;
}

.dashboard-brdr {
    border-bottom: 4px solid #fff !important;
}

.alertbg {
    width: 357px;
    height: 245px;
    z-index: 2;
    background: url(../images/dashboard/notification_simple.jpg);
}

.achieve-bg {
    width: 357px;
    height: 245px;
    z-index: 2;
    background: url(../images/dashboard/Achievementbg.jpg);
}

@media(max-width:768px) {
    .alertbg {
        width: 687px;
        height: 243px;
        z-index: 2;
        background: url('../images/dashboard/notification _ipad_simple.jpg');
    }

    .achieve-bg {
        width: 687px;
        height: 243px;
        z-index: 2;
        background: url(../images/dashboard/Achievement_ipadbg.jpg);
    }

    .ipad_pt43 {
        padding-top: 43px;
    }
}

@media(max-width:500px) {
    .alertbg {
        width: 357px !important;
        height: 245px !important;
        z-index: 2;
        background: url(../images/dashboard/notification_simple.jpg) !important;
    }

    .achieve-bg {
        width: 322px !important;
        height: 241px !important;
        z-index: 2 !important;
        background: url(../images/dashboard/Achievementbg.jpg) !important;
    }

    .ipad_pt43 {
        padding-top: 22px;
    }
}

.no-pad {
    padding: 0px !important;
}

.m-t-2 {
    margin-top: 2px;
}

.leave-policy-brdr {
    border-bottom: 1px solid #eee !important;
    margin-bottom: 12px !important;
}

.font-common-blue {
    color: rgb(73, 130, 189) !important;
}

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

.mt1 {
    margin-top: 1px !important;
}

.process-detail {
    margin-top: 10px;
    margin-left: 0px;
}

.onb-p {
    margin-top: -10px !important;
}

@media(max-width:768px) {
    .process-detail {
        margin-top: 10px;
        margin-left: 20px;
    }

    .profiledesi {
        float: left;
        margin-left: 15px;
    }

    .onb-p {
        margin-top: -10px !important;
    }
}

@media(max-width:500px) {
    .process-detail {
        margin-top: 10px;
        margin-left: -10px;
    }

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

    .onb-p {
        margin-top: 9px !important;
    }
}

.note-mb20 {
    margin: 0px 0px 20px 0px;
}

/* added by daxa on 29/Mar/2018, used in On Call woekflow */


.newDivRow {
    width: 100%;
    float: left;
}

.mb3 {
    margin-bottom: 3px !important;
}

.mtb5 {
    margin: 5px 0px 6px 0px;
}

.imagebg {
    position: fixed !important;
}

.w2 {
    width: 2%;
}

.shift-width {
    width: 100%;
}

.holiday-mt {
    margin-top: -35px;
}

.ipad-ml-6 {
    margin-left: -23px !important;
}

.ptconfig {
    padding-top: 25px;
}

.mtb25 {
    margin: 25px 0px;
}

.year-swidth {
    width: 10%
}

.swidth {
    width: 10%
}

.acw {
    width: 10%;
}

.bwdth {
    width: 31%;
}

@media(max-width:768px) {
    .swidth {
        width: 33%
    }

    .acw {
        width: 33.3%;
    }

    .bwdth {
        width: 43%;
    }

    .year-swidth {
        width: 33%
    }

    .ipad-ml12 {
        margin-left: 12px;
        margin-right: 0px !important;
    }

    .ipad-radius {
        border-radius: 80px !important;
    }

    .ipad-center {
        text-align: center;
    }

    .ipad-ml35 {
        margin-left: 45px;
    }

    .ipad-mb5 {
        margin-bottom: 5px !important;
    }

    .ipad-mb3 {
        margin-bottom: 3px !important;
    }

    .ipad-mb8 {
        margin-bottom: 8px !important;
    }

    .ipad-mb10 {
        margin-bottom: 10px;
    }

    .ipad-mt20 {
        margin-top: 20px !important;
    }

    .ipad_width895 {
        width: 895px;
    }

    .ipad_width715 {
        width: 715px !important;
        overflow-x: scroll !important;
    }

    .ipad_width714 {
        width: 714px !important;
        overflow-x: scroll !important;
    }

    .ipad_width990 {
        width: 990px;
    }

    .ipad_width1100 {
        width: 1100px !important;
        overflow-x: scroll !important;
    }

    .ipad_width1330 {
        width: 1330px !important;
        overflow-x: scroll !important;
    }

    .ipad_width1160 {
        width: 1160px;
        overflow-x: scroll !important;
    }

    .ipad_width1075 {
        width: 1075px;
        overflow-x: scroll !important;
    }

    .ipad_width700 {
        width: 700px !important;
        overflow-x: scroll !important;
    }

    .w2 {
        width: 2%;
    }

    .iscroll {
        overflow-x: scroll !important;
    }

    .shift-m {
        margin-top: 20px;
        margin-left: 146px;
    }

    .shift-width {
        width: 600px !important;
    }

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

    .ipad-ml-6 {
        margin-left: -6px !important;
    }

    .ipad-ml-33 {
        margin-left: 33px;
    }

    .ipad-scroll {
        overflow-x: scroll !important;
    }

    .acap {
        margin-top: 20px !important;
        margin-bottom: 20px !important;
    }

    .iw {
        width: auto !important;
    }

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

.mt40 {
    margin-top: 40px;
}

.pt7mb20 {
    padding-top: 7px;
    margin-bottom: 20px;
}

@media(max-width:500px) {
    .imagebg {
        position: unset !important;
    }

    .acw {
        width: 33.3%;
    }

    .bwdth {
        width: 95%;
    }

    .swidth {
        width: 34%;
    }

    .year-swidth {
        width: 32%
    }

    .mob-center {
        text-align: center !important;
    }

    .mob-mtb15 {
        margin-top: 15px;
        margin-bottom: 15px;
    }

    .mob-ml8 {
        margin-left: 8px !important;
    }

    .mobp15 {
        padding: 15px !important;
    }

    .ptconfig {
        padding-top: 27px;
    }

    .w2 {
        width: 7%;
    }

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

    .mob-mt40 {
        margin-top: 40px;
    }

    .mob-mb125 {
        margin-bottom: 125px;
    }

    .mob-ml113 {
        margin-left: 113px !important;
    }

    .lbackmob {
        margin-top: 1px !important;
        margin-right: -19px !important;
    }

    .mob-mt5 {
        margin-top: 5px !important;
    }

    .mob-mt12 {
        margin-top: 12px !important;
    }

    .mob-mt-21 {
        margin-top: -21px;
    }

    .mob-mt-186 {
        margin-top: -186px;
    }

    .mob-mt-18 {
        margin-top: -18px;
    }

    .mob-mt100 {
        margin-top: 100px;
    }

    .mob-mt-m222 {
        margin-top: -222px;
    }

    .plr0 {
        padding-left: 0px !important;
        padding-right: 0px !important;
    }

    .colwi {
        width: 600px;
    }

    .tac {
        text-align: center;
    }

    .mob-mtb3 {
        margin-top: 3px;
        margin-bottom: 3px;
    }

    .mpb-mtb10 {
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .ipad_w11 {
        width: 800px;
        overflow-x: scroll;
    }

    .iscroll {
        overflow-x: scroll !important;
    }

    .shift-m {
        margin-top: 15px;
        margin-left: 0px;
    }

    .shift-width {
        width: 500px !important;
    }

    .holiday-mt {
        margin-top: 12px !important;
        margin-left: 6px !important;
    }

    .mob-mt6r8 {
        margin-top: 6px !important;
        margin-left: 8px !important;
    }

    .mob-mr5 {
        margin-right: 5px;
    }

    .pt7mb20 {
        padding-top: 0px !important;
        margin-bottom: 0px !important;
    }

    .mob-w230 {
        width: 230px !important;
    }

    .acap {
        margin-top: 0px !important;
        margin-bottom: 20px !important;
    }

    .mob-mt50 {
        margin-top: 50px;
    }

    .mob-mr16 {
        margin-right: 16px !important;
    }

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


.leave-panel-head {
    font-size: 12px;
    background-color: #dee8f3;
    font-weight: 600;
}

.ptb12 {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
}

.lcreditradius {
    border-radius: 50px !important;
}
/*.user-font {   
     color: #006dba;
}*/

.m-t-20 {
    margin-top: 20px;
}

.l-app-manue {
    background: #dee8f3;
    font-weight: 600;
}

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

.mb8 {
    margin-bottom: 8px;
}

.mt15 {
    margin-top: 15px;
}

.mb15 {
    margin-bottom: 15px;
}

.ml16 {
    margin-left: 16px;
}

.mtmin-5 {
    margin-top: -5px;
}

.pl0 {
    padding-left: 0 !important;
}

.ml10 {
    margin-left: 10px !important;
}

.mt5 {
    margin-top: 5px;
}

.mt25 {
    margin-top: 25px;
}

.shift-dpanel {
    margin-top: 8px;
    margin-bottom: 11px;
}

.mtb12 {
    margin-top: 12px !important;
    margin-bottom: 12px !important;
}

.mt6 {
    margin-top: 6px;
}

.bgthead {
    background: #dee8f3 !important;
}

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

.w135 {
    width: 135px !important;
}

.fs-12 {
    font-size: 12px;
}

.mt11 {
    margin-top: 11px;
}

.attn-brdr {
    border-bottom: 1px solid #eee;
    padding-bottom: 6px;
    margin-bottom: 9px;
    border-top: 1px solid #eee;
    padding-top: 7px;
    margin-top: 6px;
}

.blue-brdr {
    border: 1px solid #4982bd !important;
}

.pb8 {
    padding-bottom: 8px;
}

.pb80 {
    padding-bottom: 80px !important;
}

.note {
    color: #d32f2f;
}

.ded-rule {
    padding: 4px 4px !important;
    width: 113px !important;
}

.mt7-b8 {
    margin-top: 7px;
    margin-bottom: 8px;
}

.mt30 {
    margin-top: 30px;
}

.label.label-gray {
    background: #a7abab;
}

.pt2 {
    padding-top: 2px !important;
}

.mt-m14 {
    margin-top: -15px !important;
}

.pt12 {
    padding-top: 12px !important;
}

.pt8 {
    padding-top: 8px !important;
}

.icon-blue {
    color: #4982bd !important;
}

.pt20 {
    padding-top: 20px;
}

.mb5 {
    margin-bottom: 5px !important;
}

.pt6 {
    padding-top: 6px;
}

.color-success {
    color: #22BAA0 !important;
}

.blue {
    color: #4982bd !important;
}

.p-l-54_address {
    padding-left: 54px !important;
}

.mt-m8 {
    margin-top: -8px !important;
}

@media(max-width:768px) {
    .p-l-54_address {
        padding-left: 3px !important;
    }
}

.img-brdr {
    border: 1px solid #eee !important;
    padding: 3px;
}

/*==================== for Employee Profile css Added by Nirupa ===================*/

.emp-img-size {
    width: 70px !important;
    height: 70px !important;
    margin-top: 0px;
    border-radius: 50%;
}

.img-radius {
    border: 1px solid #e8dcdc;
    border-radius: 50px;
    padding: 3px;
}

.emp-tm {
    margin-top: -3px !important;
}

.view-answer {
    margin-top: -70px !important;
}

@media(max-width:768px) {
    .view-answer {
        margin-top: -70px !important;
    }

    .emp-img-size {
        width: 80px !important;
        height: 80px !important;
        margin-top: 0px;
        border-radius: 50%;
    }

    .emp-tm {
        margin-top: 2px !important;
    }
}

@media(max-width:500px) {
    .view-answer {
        margin-top: -0px !important;
    }

    .emp-img-size {
        width: 75px !important;
        height: 75px !important;
        margin-top: 0px;
        border-radius: 50%;
    }

    .emp-tm {
        margin-top: 5px !important;
    }
}

.exit47 {
    margin-left: -47px;
}

.questionupbox {
    padding: 5px;
    color: #545454;
    float: left;
    text-align: center;
    margin-right: 7px;
    margin-bottom: 9px;
    width: 3.4%;
    border: 1px solid #b1b4b7;
    font-size: 1px;
    cursor: pointer;
    font-weight: 300 !important;
}

.pager-top {
    margin-top: 10px;
}

.pswd-width {
    width: 91px;
}

.lock-screen-m {
    margin-top: 37%;
}

.analys {
    width: 102px !important;
}

.analys-rate {
    color: #4982bd;
    white-space: pre-wrap;
    font-family: Courier New;
    float: right;
    margin-right: 129px;
    margin-top: 25px;
    font-size: 25px;
}

@media(max-width:768px) {
    .analys-rate {
        color: #4982bd;
        white-space: pre-wrap;
        font-family: Courier New;
        float: right;
        margin-right: 79px;
        margin-top: 25px;
        font-size: 25px;
    }

    .analys {
        width: 184px !important;
    }

    .lock-screen-m {
        margin-top: 60%;
    }

    .exit47 {
        margin-left: 0px;
    }

    .pswd-width {
        width: 114px;
    }

    .questionupbox {
        padding: 5px;
        color: #545454;
        float: left;
        text-align: center;
        margin-right: 7px;
        margin-bottom: 9px;
        width: 5.4%;
        border: 1px solid #b1b4b7;
        font-size: 1px;
        cursor: pointer;
        font-weight: 300 !important;
    }

    .pager-top {
        margin-top: 0px;
    }
}

@media(max-width:500px) {
    .mob-mb35 {
        margin-bottom: 35px !important;
    }

    .mob-left {
        float: left !important;
    }

    .analys {
        width: 250px !important;
    }

    .analys-rate {
        color: #4982bd;
        white-space: pre-wrap;
        font-family: Courier New;
        float: right;
        margin-right: 168px;
        margin-top: 25px;
        font-size: 25px;
    }

    .mob-plr25 {
        padding: 0px 25px;
    }

    .lock-screen-m {
        margin-top: 37%;
    }

    .exit47 {
        margin-left: 0px;
        ;
    }

    .questionupbox {
        padding: 5px;
        color: #545454;
        float: left;
        text-align: center;
        margin-right: 7px;
        margin-bottom: 9px;
        width: 10.4%;
        border: 1px solid #b1b4b7;
        font-size: 1px;
        cursor: pointer;
        font-weight: 300 !important;
    }

    .pager-top {
        margin-top: 0px;
    }
}

.off-on-box {
    box-shadow: none;
}

    .off-on-box:hover {
        box-shadow: 0 4px 12px rgba(0,0,0,0.25);
    }

.cpswd-heading {
    font-size: 18px !important;
    color: #4982bd !important;
}

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

.left-4 {
    left: -4px;
}

.ptb20 {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}

/*================== Salary Process Css added By Nirupa ===================*/

.salary-box {
    border: 2px solid #eee;
    border-top: 4PX SOLID #4982bd;
    padding: 9px 10px 0px 10px;
    min-height: 85px;
    background: #fff;
}

.summary-width {
    width: 146px;
    border-right: 2px solid #eee;
}

.summary-width-nth {
    width: 146px;
}

.month1 {
    color: rgb(73, 130, 189);
    font-size: 19px;
    font-weight: 500;
    text-align: center;
}

.summary-menu {
    color: rgb(73, 130, 189);
    text-align: center;
    line-height: 16px;
}

.summary-count {
    text-align: center;
    color: #696969;
    font-weight: 600;
}

.icon-completed {
    font-size: 25px;
    color: #f91414;
}

.icon-pending {
    font-size: 25px;
    color: #35840b;
}

.sum-location {
    color: #da712a;
}

.sum-emp {
    color: #4982bd;
    font-size: 17px;
    font-weight: 600;
}

.pro-comp {
    color: #4982bd;
    font-size: 13px;
    text-align: center;
}

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

.lh-12 {
    line-height: 12px !important;
}

.join-emp {
    color: #35840b;
    font-weight: 600;
}

.resign-emp {
    color: #f91414;
    font-weight: 600;
}

.salary-box2 {
    border: 0px solid #eee;
    border-top: 4PX SOLID #9ac2ec;
    padding: 9px 10px 3px 10px;
    min-height: 112px;
    background: #fff;
}

    .salary-box2 p {
        line-height: 18px;
    }

@media(max-width:768px) {
    .count-liheight {
        padding: 0px;
        color: #757575;
        line-height: 0px;
        text-align: center;
        font-size: 11px;
        position: inherit;
    }

    .ipad_width700-o {
        width: 700px !important;
    }

    .ipad-p0 {
        padding: 0px !important;
    }
}

.select-month {
    font-size: 15px !important;
    text-align: center !important;
    margin-bottom: 10px !important;
    color: #838684;
}

.cat-icon {
    /*font-size: 41px;*/
    /*color: #f91414;*/
    width: 23px;
    margin-top: 0px;
}

.cat-box {
    background: #f5f5f5;
    border: 2px solid #eee;
    border-left: 4PX SOLID #9ac2ec;
    padding: 9px 10px 0px 10px;
    min-height: 117px;
    cursor: pointer;
}

.cat-icon-check {
    font-size: 27px;
    color: #35840b;
    margin-top: 21px;
}

.count-cat {
    color: #da7e23;
    font-size: 16px;
    font-weight: 600;
}

.calc1 {
    border-top: 4px solid #eee;
}

.finance {
    min-width: 146px;
}

.Fin-calc {
    color: rgb(146, 147, 148);
    font-size: 18px;
    font-weight: 600;
    text-align: center;
}

.col-333 {
    color: #4C4B4C !important;
}

.home-delete {
    color: #f90606;
    font-size: 18px;
}

.mb2 {
    margin-bottom: 2px !important;
}

.pb115 {
    padding-bottom: 115px !important;
}

.p15 {
    padding: 15px;
}

.pnear-wd {
    width: 20% !important;
}

.pn-wd {
    width: 22% !important;
}

@media(max-width:500px) {
    .pnear-wd {
        width: 35% !important;
    }

    .pn-wd {
        width: 35% !important;
    }

    .mob-lr10 {
        margin-left: 10px;
        margin-right: 10px;
    }

    .dash-mob {
        left: 50%;
    }
}

.pr15l0 {
    padding-right: 15px;
    padding-left: 0px;
}

.pr15 {
    padding-right: 15px;
}

.invest-head {
    border-bottom: 1px solid #e9e9e9 !important;
    margin-top: 2px;
    color: #646567;
}

.mtb15 {
    margin: 15px 0px !important;
}

/*Add button Media*/
.newad {
    margin-right: 5%;
    float: right;
}

.leave-158 {
    margin-left: -158px !important;
}

.pub-prof-bx1 {
    padding: 0px 10px;
    border-top: 0px solid #eee;
    border-bottom: 0px solid #eee;
    border-right: 0px solid #eee;
    border-left: 0px solid #eee;
}

.pub-prof-bx2 {
    border-top: 0px solid #eee;
    border-bottom: 0px solid #eee;
    border-right: 0px solid #eee;
    border-left: 0px solid #eee;
    padding: 0px;
}

.pub-brdr {
    border-bottom: 1px solid #eee;
}

@media only screen and (max-width: 1024px) {
    .wiz-wdth {
        width: 1160px;
    }

    .wiz-wdth11 {
        width: 1160px;
    }

    .wiz-scroll {
        overflow-x: scroll;
    }
}

@media(max-width:768px) {
    .pub-brdr {
        border-bottom: 0px solid #eee;
    }

    .pub-prof-bx1 {
        padding: 30px 10px;
        padding: 30px 10px;
        border-top: 4px double #eee;
        border-bottom: 4px double #eee;
        border-right: 4px double #eee;
        border-left: 0px double #eee;
    }

    .pub-prof-bx2 {
        border-top: 4px double #eee;
        border-bottom: 4px double #eee;
        border-right: 0px double #eee;
        border-left: 0px double #eee;
        padding: 14px;
    }

    .prof-top {
        margin-top: 10px !important;
    }

    .newad {
        margin-right: 2%;
        float: right;
    }

    .leave-158 {
        margin-left: 0px;
    }

    .wiz-wdth {
        width: 1160px;
    }

    .wiz-wdth11 {
        width: 1160px;
    }

    .wiz-scroll {
        overflow-x: scroll;
    }
}

@media(max-width:500px) {
    .pub-brdr {
        border-bottom: 0px solid #eee;
    }

    .pub-prof-bx1 {
        padding: 0px 10px;
        border-top: 0px double #eee;
        border-bottom: 0px double #eee;
        border-right: 0px double #eee;
        border-left: 0px double #eee;
    }

    .pub-prof-bx2 {
        border-top: 0px double #eee;
        border-bottom: 0px double #eee;
        border-right: 0px double #eee;
        border-left: 0px double #eee;
        padding: 0px;
    }

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

/*...........login checkbox css added ruby Nirupa.........*/
.round {
    position: relative;
}

    .round label {
        background-color: #fff;
        border: 1px solid #ccc;
        border-radius: 50%;
        cursor: pointer;
        height: 15px;
        left: 0;
        position: absolute;
        top: 0;
        width: 15px;
    }

        .round label:after {
            border: 2px solid #fff;
            border-top: none;
            border-right: none;
            content: "";
            height: 3px;
            left: 4px;
            opacity: 0;
            position: absolute;
            top: 3px;
            transform: rotate(-45deg);
            width: 12px;
        }

    .round input[type="checkbox"] {
        visibility: hidden;
    }

        .round input[type="checkbox"]:checked + label {
            background-color: #66bb6a;
            border-color: #66bb6a;
        }

            .round input[type="checkbox"]:checked + label:after {
                opacity: 1;
            }

.pub-prohgt {
    margin-top: -62px;
}

@media(max-width:768px) {
    .pub-prohgt {
        margin-top: 90px;
    }
}

@media(max-width:500px) {
    .pub-prohgt {
        margin-top: 19px;
    }

    .cov-height {
        height: 64%;
    }

    .mob-ml50 {
        margin-left: 50px !important;
    }
}

.rmps {
    margin-left: 23px;
    margin-top: -21px;
    font-size: 11px;
}

.ui-jqgrid-htable .ui-search-toolbar .ui-search-table .ui-search-clear {
    display: none;
}

/*------------------------------CSS for scroll in Audit Log Detail table by DvS----------------------------*/
#tbl_AuditDetails tr td {
    overflow-wrap: break-word;
}

#tbl_AuditDetails tbody {
    display: block;
    height: 310px;
    overflow: auto;
}

    #tbl_AuditDetails thead, #tbl_AuditDetails tbody tr {
        display: table;
        width: 100%;
        table-layout: fixed; /* even columns width , fix width of table too*/
    }

#tbl_AuditDetails thead {
    width: calc( 100% - 1em ) /* scrollbar is average 1em/16px width, remove it from thead width */
}

#tbl_AuditDetails {
    width: 100%;
}
/*------------------------------CSS for scroll in Audit Log Detail table by DvS----------------------------*/

#reLoginModal {
    z-index: 9999999 !important;
}

.pace {
    z-index: 9999999 !important;
}



/*------------------------------b4v letest CSS for PMS by JB090521----------------------------*/
.f-12 {
    font-size: 12px !important
}

.f-14 {
    font-size: 14px !important
}

.f-16 {
    font-size: 16px !important
}

.f-18 {
    font-size: 18px !important
}

.f-20 {
    font-size: 20px !important
}

.f-22 {
    font-size: 22px !important
}

.f-24 {
    font-size: 24px !important
}

.f-26 {
    font-size: 26px !important
}

.f-28 {
    font-size: 28px !important
}

.f-30 {
    font-size: 30px !important
}

.f-32 {
    font-size: 32px !important
}

.position-relative {
    position: relative !important;
}

.appr-ico {
    position: relative;
    color: #e91e63;
}

    .appr-ico:after {
        content: "\f058";
        position: absolute;
        /*font-family: "Font Awesome 5 Free";*/
        left: -8px;
        top: 5px;
        font-size: 14px;
        color: rgb(0, 150, 136);
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgb(244, 243, 255);
        border-radius: 50px;
        padding: 1px 2px 0 0;
        transition: 0.2s linear;
    }

.ev-badge {
    display: inline-block;
    line-height: 1;
    color: rgb(255, 255, 255);
    text-align: center;
    font-size: 12px;
    white-space: nowrap;
    vertical-align: baseline;
    padding: 0.35em 0.65em;
    background: rgb(96, 125, 139);
    border-radius: 0.27rem;
}

.media-2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.appr-ico:hover:after {
    content: "\f05d";
}

.media-body-2 {
    /*margin-top: 5px;*/
}

    .media-body-2 h4 {
        margin-bottom: 2px;
        color: #242934;
        margin-top: 3px;
    }

    .media-body-2 p {
        color: rgba(43,43,43,0.7);
        font-size: 12px;
    }

.user-divider {
    display: flex;
    align-items: center;
    justify-content: center;
}

    .user-divider i {
        text-shadow: 0 0 1px rgb(0 0 0 / 20%);
        cursor: pointer;
    }

    .user-divider:after {
        content: "";
        position: relative;
        height: 28px;
        width: 1px;
        right: 0;
        top: 0;
        z-index: 2;
        background: #ccc;
        float: right;
        padding: 0;
        margin: 0 20px;
    }

.lft-dvd.user-divider:after {
    display: none;
}

.lft-dvd.user-divider:before {
    content: "";
    position: relative;
    height: 28px;
    width: 1px;
    right: 0;
    top: 0;
    z-index: 2;
    background: #ccc;
    float: left;
    padding: 0;
    margin: 0 20px;
}

.progress {
    border-radius: 50px;
}

.hrS-ApplicationBox-card {
    padding: 0 !important;
    border: 1px solid #ecf3fa;
    border-radius: 5px;
}

    .hrS-ApplicationBox-card .GSetApp-inner-card {
        padding: 15px 10px;
        border-right: 1px solid #ecf3fa;
        display: flex;
        /*overflow: hidden;*/
        position: relative;
        transition: 1s all ease;
    }

        .hrS-ApplicationBox-card .GSetApp-inner-card:hover, .hrS-ApplicationBox-card .green-box-active.active .GSetApp-inner-card {
            box-shadow: rgb(99 99 99 / 20%) 0px 2px 8px 0px;
            background: ghostwhite;
            z-index: 2;
        }



        .hrS-ApplicationBox-card .GSetApp-inner-card:before {
            height: 0px;
            transition: 1s all ease;
            content: "";
            position: absolute;
            width: 100%;
            left: 0;
            bottom: 0;
            transition: 0.5s all ease;
            background: -webkit-linear-gradient(45deg, #009688, #00bcd4,#2196f3);
            border-radius: 10px;
        }

        .hrS-ApplicationBox-card .GSetApp-inner-card:hover:before, .hrS-ApplicationBox-card .green-box-active.active .GSetApp-inner-card:before {
            height: 3px;
        }

        .hrS-ApplicationBox-card .GSetApp-inner-card .small-bar-icon {
            height: auto;
            width: 70px;
            position: relative;
        }

        .hrS-ApplicationBox-card .GSetApp-inner-card .small-bar-body {
            margin-left: 10px;
            text-align: left;
        }

        .hrS-ApplicationBox-card .GSetApp-inner-card .desciption {
            font-weight: 600;
            color: rgba(43,43,43,0.7);
            font-size: 13px;
        }

        .hrS-ApplicationBox-card .GSetApp-inner-card .value {
            line-height: 1.3;
            font-size: 18px;
            font-weight: 900;
            color: #424242;
        }

        .hrS-ApplicationBox-card .GSetApp-inner-card .small-bar-icon > i {
            transition: 0.5s all ease;
            /*left: -100px;
        content: "\f5fd";
        position: absolute;*/
        }

.col-lg-6 .hrS-ApplicationBox-card .GSetApp-inner-card .small-bar-icon > i {
    font-size: 20px;
}

.hrS-ApplicationBox-card .GSetApp-inner-card:hover .small-bar-icon > i {
    /*content: "\f5fd";
        font-family: "Font Awesome 5 Free";
        opacity: 0.2;*/
    transform: scale(1.2);
    /*position: absolute;
        left: 0px;*/
}

/*#ApplBox .card {
    position: relative;
    overflow: hidden;
}

    #ApplBox .card:after {
        content: "";
        background-color: #673ab7;
        width: 300px;
        height: 300px;
        border-radius: 50%;
        position: absolute;
        right: -145px;
        top: 0;
        z-index: 0;
        opacity: 0.1;
    }*/

/*.txt-control-2 {
    border: none;
    border-bottom: 2px solid #ccc;
    border-radius: 0 !important;
}*/

.hrS-empImg {
    border: 2px solid #fff;
    -webkit-box-shadow: -2px 2px 4px 0px rgb(0 0 0 / 20%);
    box-shadow: -2px 2px 4px 0px rgb(0 0 0 / 20%);
    -webkit-transition: 0.5s;
    transition: 0.5s;
    border-radius: 50% !important;
    overflow: hidden;
}

.flex-wrap {
    flex-wrap: wrap;
}

.no-bg {
    background: transparent !important;
}

.no-shadow {
    box-shadow: none !important;
}

.no-border {
    border: none !important;
}

.cursor-pointer {
    cursor: pointer;
}

.WizardPlanAndReviewConfiguration .note-popover .popover .popover-content > .btn-group, .note-toolbar > .btn-group {
    margin-top: 0px !important;
}

.WizardPlanAndReviewConfiguration .sf-controls {
    border-top: 1px solid #ddd;
    padding-top: 15px;
}

.hr-suite-pms .panel .panel-heading {
    height: auto;
    padding: 12px 14px;
}

.hr-suite-pms .panel {
    border-radius: 4px;
}

.hr-suite-pms .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary, .hr-suite-pms .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary {
    color: #fff;
    background: #1266f1;
}

.hr-suite-pms .bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-handle-on,
.hr-suite-pms .bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-handle-off,
.hr-suite-pms .bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-label {
    line-height: 1.6;
    /*width: 34px !important;*/
}

.form-control {
    border-radius: 4px !important;
}

.bootstrap-switch {
    border-radius: 50px;
    border: none;
    box-shadow: 0 0 2px rgb(0 0 0 / 30%);
}

.hr-suite-pms .form-group {
    margin-top: 15px;
}

.form-group:before, .form-group:after {
    display: table;
    content: " ";
    clear: both;
}

.hrS-mini-hr:before {
    content: "";
    height: 3px;
    width: 25px;
    background: #1266f1;
    position: absolute;
    transform: translate(0px, -2.5px);
}

.hrS-mini-hr:after {
    content: "";
    height: 3px;
    width: 25px;
    background: #ccc;
    position: absolute;
    transform: translate(25px, -2.5px);
}

.hrS-mini-hr {
    margin-top: 15px;
}

.hrS-row {
    margin-right: -8px;
    margin-left: -8px;
    clear: both;
}

.fa-lg-2 {
    font-size: 1.2em;
    line-height: 0.75em;
    vertical-align: -15%;
}

/* HRS TABLE STYLE 2 - CUSTOME */
.hrS-table-style2 .ui-jqgrid .ui-jqgrid-btable {
    width: 100% !important;
    table-layout: inherit;
}

.hrS-table-style2 .ui-jqgrid .ui-jqgrid-hbox {
    float: initial;
}



.hrS-table-style2 .ui-jqgrid-hdiv .ui-jqgrid-htable {
    border-bottom: none;
    width: 100% !important;
    /*table-layout: inherit;*/
    table-layout: auto;
    font-family: Rubik,sans-serif !important;
}

.hrS-table-style2 {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

    .hrS-table-style2 table > tbody > tr > td select {
        height: auto;
        line-height: initial;
        max-width: initial;
    }

    .hrS-table-style2 .ui-jqgrid {
        border: none;
        width: 100% !important;
    }

        .hrS-table-style2 .ui-jqgrid .ui-jqgrid-view {
            width: 100% !important;
        }

        .hrS-table-style2 .ui-jqgrid .ui-jqgrid-hdiv {
            border-radius: 00px;
        }



        .hrS-table-style2 .ui-jqgrid .ui-jqgrid-htable th span.ui-jqgrid-resize {
            height: 44px !important;
        }

        .hrS-table-style2 .ui-jqgrid .ui-jqgrid-htable th div {
            padding-top: 12px;
            padding-bottom: 12px;
            padding-left: 0;
            display: grid;
            align-items: center;
        }

        .hrS-table-style2 .ui-jqgrid .ui-jqgrid-htable th {
            height: 22px;
            padding: 0px 4px 0px 10px !important;
            white-space: normal;
            word-break: break-word;
            line-height: normal;
        }

            .hrS-table-style2 .ui-jqgrid .ui-jqgrid-htable th div {
                height: auto;
                /*padding: 0;
                display: flex;
                align-items: center;
                height: 100%;*/
            }

        .hrS-table-style2 .ui-jqgrid .ui-jqgrid-hdiv {
            line-height: 20px;
            margin-bottom: 0px;
            width: 100% !important;
        }

        .hrS-table-style2 .ui-jqgrid .ui-jqgrid-bdiv {
            width: 100% !important;
        }

        .hrS-table-style2 .ui-jqgrid tr.ui-row-ltr td {
            border-bottom: 1px solid #E1E1E1;
            /*padding: 8px 15px;*/
            padding: 10px 4px 10px 10px;
            border-color: #eee;
            word-break: break-word;
        }

    .hrS-table-style2 .ui-widget .ui-widget-content {
        background-color: #fff !important;
    }

        .hrS-table-style2 .ui-widget .ui-widget-content:hover {
            background-color: #ebeff4 !important;
        }

        .hrS-table-style2 .ui-widget .ui-widget-content.ui-state-highlight {
            background-color: #ebeff4 !important;
        }

    .hrS-table-style2 .ui-jqgrid .ui-jqgrid-pager {
        line-height: 10px;
        height: 44px;
        padding: 6px 15px 6px 15px !important;
        background-color: #eff3f8 !important;
        border-radius: 0px;
        border: none !important;
        width: 100% !important;
        display: table-cell;
    }

    .hrS-table-style2 .ui-jqgrid .ui-jqgrid-hbox {
        padding-right: 0;
    }

    .hrS-table-style2 .ui-jqgrid .ui-pager-control {
        height: 34px;
        position: relative;
    }

    .hrS-table-style2 .ui-widget tr.ui-widget-content:last-child td {
        border-bottom: none !important;
    }

    .hrS-table-style2 .ui-jqgrid .ui-jqgrid-view, .hrS-table-style2 .ui-jqgrid .ui-paging-info, .hrS-table-style2 .ui-jqgrid .ui-pg-selbox, .hrS-table-style2 .ui-jqgrid .ui-pg-table {
        font-size: 12px;
    }

    .hrS-table-style2 .ui-jqgrid .ui-paging-info {
        height: 16px;
    }


    .hrS-table-style2 .ui-pager-control table .ui-pg-button[title="Find records"] > .btn.btn-sm.btn-default {
        color: #fff;
        background-color: #1266f1 !important;
        border: .125rem solid transparent;
    }

        .hrS-table-style2 .ui-pager-control table .ui-pg-button[title="Find records"] > .btn.btn-sm.btn-default:hover {
            color: #fff;
            background-color: #0c56d0 !important;
            -webkit-box-shadow: 0 4px 10px 0 rgb(0 0 0 / 20%), 0 4px 20px 0 rgb(0 0 0 / 10%) !important;
            box-shadow: 0 4px 10px 0 rgb(0 0 0 / 20%), 0 4px 20px 0 rgb(0 0 0 / 10%) !important;
        }

        .hrS-table-style2 .ui-pager-control table .ui-pg-button[title="Find records"] > .btn.btn-sm.btn-default > span {
            color: #fff !important;
        }

    .hrS-table-style2 .ui-pager-control table .ui-pg-button[title="Reload Grid"] > .btn.btn-sm.btn-default {
        color: #fff;
        background-color: #00b74a !important;
        border: .125rem solid transparent;
    }

        .hrS-table-style2 .ui-pager-control table .ui-pg-button[title="Reload Grid"] > .btn.btn-sm.btn-default:hover {
            color: #fff;
            background-color: #00913b !important;
            -webkit-box-shadow: 0 4px 10px 0 rgb(0 0 0 / 20%), 0 4px 20px 0 rgb(0 0 0 / 10%) !important;
            box-shadow: 0 4px 10px 0 rgb(0 0 0 / 20%), 0 4px 20px 0 rgb(0 0 0 / 10%) !important;
        }

        .hrS-table-style2 .ui-pager-control table .ui-pg-button[title="Reload Grid"] > .btn.btn-sm.btn-default > span {
            color: #fff !important;
        }

@media screen and (max-width:767px) {
    .hrS-table-style2 .ui-jqgrid-hdiv .ui-jqgrid-htable,
    .hrS-table-style2 .ui-jqgrid .ui-jqgrid-btable {
        table-layout: fixed;
    }

    .hrS-table-style2 .ui-jqgrid .ui-pg-table tbody > tr {
        display: flex;
        gap: 5px;
        width: 100%;
    }
}


/*.hrS-table-style2 .ui-state-default,
    .hrS-table-style2 .ui-widget-content .ui-state-default,
    .hrS-table-style2 .ui-widget-header .ui-state-default,
    .hrS-table-style2 .ui-button,
    .hrS-table-style2 .ui-button.ui-state-disabled:hover,
    .hrS-table-style2 .ui-button.ui-state-disabled:active {
        border: none;
        background: inherit;
        font-weight: normal;
        color: #454545;
    }

        .hrS-table-style2 .ui-state-hover,
        .hrS-table-style2 .ui-widget-content .ui-state-hover,
        .hrS-table-style2 .ui-widget-header .ui-state-hover,
        .hrS-table-style2 .ui-state-focus,
        .hrS-table-style2 .ui-widget-content .ui-state-focus,
        .hrS-table-style2 .ui-widget-header .ui-state-focus,
        .hrS-table-style2 .ui-button:hover, .ui-button:focus {
            border: none;
            background: inherit;
        }

.hrS-table-style2 {
    color: #fff !important;
}*/

.hr-suite-custom-select:focus {
    border-radius: 0;
}

.hr-suite-custom-select {
    display: block;
    width: 100%;
    padding: 0.8rem 3.2rem 0.8rem 1.2rem;
    /*box-shadow: rgb(50 50 93 / 10%) 0px 2px 5px -1px, rgb(0 0 0 / 30%) 0px 1px 3px -1px;*/
    font-size: 1.2rem;
    font-weight: 600;
    line-height: 1.5;
    color: #212529;
    background-color: #eee;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right .75rem center;
    background-size: 20px 12px;
    border: 1px solid #e6e5e5;
    border-radius: 5rem;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    transition: 0.1s linear;
}

    .hr-suite-custom-select option {
        padding: 10px !important;
    }

    .hr-suite-custom-select:focus {
        /*border-color: #80bdff;*/
        outline: 0;
        /*box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075), 0 0 5px rgba(128, 189, 255, 0.5);*/
    }

        .hr-suite-custom-select:focus::-ms-value {
            color: #495057;
            background-color: #fff;
        }

    .hr-suite-custom-select[multiple], .hr-suite-custom-select[size]:not([size="1"]) {
        height: auto;
        padding-right: 0.75rem;
        background-image: none;
    }

    .hr-suite-custom-select:disabled {
        color: #6c757d;
        background-color: #e9ecef;
    }

    .hr-suite-custom-select::-ms-expand {
        opacity: 0;
    }

.card {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0;
    /*word-wrap: break-word;*/
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0,0,0,.05);
    /*overflow: hidden;*/
    border-radius: 1rem;
    box-shadow: rgba(99, 99, 99, 0.1) 0px 0px 2px 0px;
    margin-bottom: 15px;
}

.card-body > .card-header-inset-body {
    padding: 0px 0px 15px;
    margin-bottom: 15px;
    background-color: #fff;
    border-bottom: 2px solid #ebeef0;
}

.card-inside__search {
    padding: 8px 10px;
    border: 1px solid #ddd;
    border-radius: 50px;
}


@media (max-width: 768px) {
    .card-body > .card-header-inset-body h3 i {
        display: none;
    }

    .card-body > .card-header-inset-body {
        flex-wrap: wrap;
        gap: 10px;
    }
}

.card-body .card-footer-inset-body {
    padding: 15px 0px 0px;
    margin-top: 15px;
    background-color: #fff;
    border-top: 2px solid #ebeef0;
}

.card-header {
    padding: .75rem 1.50rem;
    margin-bottom: 0;
    /*background-color: rgba(0,0,0,.03);*/
    border-bottom: 1px solid rgba(0,0,0,.125);
}

    .card-header:after, .card-header:before, .card-body:after, .card-body:before, .card-footer:after, .card-footer:before {
        content: "";
        clear: both;
        display: table;
    }

.card-body {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 2rem;
    display: block;
}

.is-desktop {
    display: block !important;
}

.is-phone {
    display: none !important;
}

.ev-search__input-btn {
    display: flex;
}

@media only screen and (max-width:767px) {
    .is-desktop {
        display: none !important;
    }

    .is-phone {
        display: block !important;
    }

    .mbl-p-0 {
        padding: 0 !important;
    }

    .card-body {
        padding: 1.2rem;
    }

    .grid-stack #myprofile .user-profile-info ul {
        justify-content: center !important;
        flex-direction: row;
    }

    .profiledesi {
        margin-left: 0;
    }
    .emp-timesheet {
        margin-inline:12px;
    }
    .timesheet__form-wrapper {
        flex-direction: column;
        align-items: flex-start !important;
        gap: 15px;
    }

    .timesheet__form-wrapper .col-md-7, 
    .timesheet__form-wrapper .col-md-7 .col-md-6 {
        padding: 0;
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .timesheet__form-wrapper .col-md-7 .col-md-6 .control-label {
        flex-shrink: 0;
        padding: 0;
        width: 80px;
        margin: 0;
    }

    .mbl-mt-10 {
        margin-block-start:10px;
    }

    .mbl-mt-15 {
        margin-block-start: 15px;
    }

    .mbl-mt-20 {
        margin-block-start: 20px;
    }
    .emp-timesheet .emp-timesheet__legends-wrapper {
        grid-gap:10px;
    }
    .emp-timesheet .emp-timesheet__legends-label, 
    .emp-timesheet .emp-timesheet__legends-title {
        font-size: 12px !important;
    }
    .emp-timesheet__legends-box {
        height: 15px;
        width: 15px;
    }
    .ev-static-table > tbody > tr > td {
        padding: 10px 10px !important;
    }
}

.card-footer {
    padding: .75rem 1.25rem;
    background-color: rgba(0,0,0,.03);
    border-top: 1px solid rgba(0,0,0,.125);
}

.card-title {
    margin-bottom: 0;
    margin-top: 0;
}


/*------Candidate Card Ui dashboard------*/
.can-dash-card {
    font-family: Rubik,sans-serif !important;
    transition: all 0.5s ease;
}

    .can-dash-card:hover {
        box-shadow: none !important;
    }

.card.can-dash-card > .card-header:after {
    content: "";
    position: absolute;
    left: 0;
    top: 45%;
    transform: translateY(-45%);
    height: 15px;
    width: 3px;
    background: #3f51b5;
}

.can-dash-card i {
    color: #3f51b5;
}

.can-dash-card .card-header {
    background-color: #fff;
    padding: 20px;
    border-bottom: 1px solid #ecf3fa;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    position: relative;
}

.can-dash-card .card-body {
    padding: 20px;
    background-color: rgba(0,0,0,0);
}

.can-dash-card .card-header h5 {
    font-size: 18px;
    color: #2b2b2b;
    font-family: Rubik,sans-serif;
    font-weight: 500;
}

.can-dash-card .card-profile img {
    height: 85px;
    width: 85px;
    padding: 5px;
    background-color: rgba(115,102,255,0.1);
    z-index: 1;
    position: relative;
    border-radius: 50%;
    box-shadow: 0 1px 4px rgb(0 0 0 / 20%);
}

.can-dash-card .main-menu > li {
    width: 100%;
    text-align: left;
    line-height: 26px;
    /*text-transform: uppercase;*/
    border-radius: 3px;
}

.can-dash-card .main-menu.li-adj > li {
    line-height: normal;
    color: #2b2b2b;
}

.can-dash-card .main-menu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
}

    .can-dash-card .main-menu li div {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        padding-left: 10px;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        font-size: 14px;
    }

    .can-dash-card .main-menu li > div {
        width: 100%;
        color: #2c323f;
    }

    .can-dash-card .main-menu > li div i {
        margin-right: 10px;
    }

.can-dash-card .activity-timeline {
    position: relative;
}

    .can-dash-card .activity-timeline .media {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        margin-top: 0;
    }

        .can-dash-card .activity-timeline .media .activity-line {
            top: 25px;
            height: calc(100% - 10%);
            position: absolute;
            width: 4px;
            background-color: #eee;
            margin: 0 auto;
            left: 11px;
            z-index: 1;
        }

        .can-dash-card .activity-timeline .media .circle-dot-primary {
            background-color: rgba(var(--theme-deafult), 0.25);
            border-radius: 100%;
            padding: 6px;
            font-size: 5px;
            color: var(--theme-deafult);
            -webkit-animation: round 1.3s ease-in-out infinite;
            animation: round 1.3s ease-in-out infinite
        }



        .can-dash-card .activity-timeline .media .circle-dot-success {
            background-color: rgba(81,187,37,0.25);
            border-radius: 100%;
            padding: 6px;
            font-size: 5px;
            color: #51bb25;
            -webkit-animation: round 1.3s ease-in-out infinite;
            animation: round 1.3s ease-in-out infinite
        }

        .can-dash-card .activity-timeline .media .circle-dot-danger {
            background-color: rgba(220,53,69,0.25);
            border-radius: 100%;
            padding: 6px;
            font-size: 5px;
            color: #dc3545;
            -webkit-animation: round 1.3s ease-in-out infinite;
            animation: round 1.3s ease-in-out infinite
        }

        .can-dash-card .activity-timeline .media .circle-dot-secondary {
            background-color: rgba(247,49,100,0.25);
            border-radius: 100%;
            padding: 6px;
            font-size: 5px;
            color: #f73164;
            -webkit-animation: round 1.3s ease-in-out infinite;
            animation: round 1.3s ease-in-out infinite
        }

        .can-dash-card .activity-timeline .media .circle-dot-info {
            background-color: rgba(169,39,249,0.25);
            border-radius: 100%;
            padding: 6px;
            font-size: 5px;
            color: #a927f9;
            -webkit-animation: round 1.3s ease-in-out infinite;
            animation: round 1.3s ease-in-out infinite
        }


        .can-dash-card .activity-timeline .media .circle-dot-warning {
            background-color: rgba(248,214,43,0.25);
            border-radius: 100%;
            padding: 6px;
            font-size: 5px;
            color: #f8d62b;
            -webkit-animation: round 1.3s ease-in-out infinite;
            animation: round 1.3s ease-in-out infinite
        }

.label-xs {
    padding: 3.5px 4px 3px;
    font-size: 9px !important;
}

.can-dash-card .activity-timeline .media .media-body {
    margin-left: 35px;
    display: block;
    width: auto;
    overflow: initial;
}

    .can-dash-card .activity-timeline .media .media-body span {
        font-weight: 500;
        font-size: 14px;
        color: #3f51b5;
    }

        .can-dash-card .activity-timeline .media .media-body span.ellipes {
            width: calc(100% - 75px);
            text-overflow: ellipsis;
            white-space: nowrap;
            overflow: hidden;
            display: inline-block;
        }

            .can-dash-card .activity-timeline .media .media-body span.ellipes > span {
                position: absolute;
                right: 0;
            }

        .can-dash-card .activity-timeline .media .media-body span p {
            font-weight: 500;
            font-size: 14px;
            color: #3f51b5;
        }

    .can-dash-card .activity-timeline .media .media-body p {
        color: rgba(43,43,43,0.6);
        font-size: 12px;
        margin-top: 2px;
        line-height: initial;
    }

.font-roboto {
    font-family: Roboto,sans-serif;
}

.can-dash-card .activity-dot-primary {
    width: 16px;
    height: 16px;
    background-color: #fff;
    border-radius: 100%;
    border: 3px solid var(--theme-deafult);
    -webkit-box-shadow: 0.5px 4.33px 15px 0px rgba(var(--theme-deafult), 0.25);
    box-shadow: 0.5px 4.33px 15px 0px rgba(var(--theme-deafult), 0.25);
    position: relative;
    z-index: 2;
    left: 5px;
    top: 19px;
}


.can-dash-card .activity-dot-success {
    width: 16px;
    height: 16px;
    background-color: #fff;
    border-radius: 100%;
    border: 3px solid #51bb25;
    -webkit-box-shadow: 0.5px 4.33px 15px 0px rgba(81,187,37,0.25);
    box-shadow: 0.5px 4.33px 15px 0px rgba(81,187,37,0.25);
    position: relative;
    z-index: 2;
    left: 5px;
    top: 19px;
}

.can-dash-card .activity-dot-danger {
    width: 16px;
    height: 16px;
    background-color: #fff;
    border-radius: 100%;
    border: 3px solid #dc3545;
    -webkit-box-shadow: 0.5px 4.33px 15px 0px rgba(220,53,69,0.25);
    box-shadow: 0.5px 4.33px 15px 0px rgba(220,53,69,0.25);
    position: relative;
    z-index: 2;
    left: 5px;
    top: 19px;
}

.can-dash-card .activity-dot-info {
    width: 16px;
    height: 16px;
    background-color: #fff;
    border-radius: 100%;
    border: 3px solid #a927f9;
    -webkit-box-shadow: 0.5px 4.33px 15px 0px rgba(169,39,249,0.25);
    box-shadow: 0.5px 4.33px 15px 0px rgba(169,39,249,0.25);
    position: relative;
    z-index: 2;
    left: 5px;
    top: 19px;
}

.can-dash-card .activity-dot-secondary {
    width: 16px;
    height: 16px;
    background-color: #fff;
    border-radius: 100%;
    border: 3px solid #f73164;
    -webkit-box-shadow: 0.5px 4.33px 15px 0px rgba(247,49,100,0.25);
    box-shadow: 0.5px 4.33px 15px 0px rgba(247,49,100,0.25);
    position: relative;
    z-index: 2;
    left: 5px;
    top: 19px;
}

.can-dash-card .activity-dot-light {
    width: 16px;
    height: 16px;
    background-color: #fff;
    border-radius: 100%;
    border: 3px solid #f4f4f4;
    -webkit-box-shadow: 0.5px 4.33px 15px 0px rgba(244,244,244,0.25);
    box-shadow: 0.5px 4.33px 15px 0px rgba(244,244,244,0.25);
    position: relative;
    z-index: 2;
    left: 5px;
    top: 19px;
}


.can-dash-card .activity-dot-warning {
    width: 16px;
    height: 16px;
    background-color: #fff;
    border-radius: 100%;
    border: 3px solid #f8d62b;
    -webkit-box-shadow: 0.5px 4.33px 15px 0px rgba(248,214,43,0.25);
    box-shadow: 0.5px 4.33px 15px 0px rgba(248,214,43,0.25);
    position: relative;
    z-index: 2;
    left: 5px;
    top: 19px;
}

@-webkit-keyframes round {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    50% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2)
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes round {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    50% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2)
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.offer-box {
    background: rgba(0,0,0,0);
    -webkit-box-shadow: none;
    box-shadow: none
}

    .offer-box .offer-slider {
        /*background: linear-gradient(26deg, var(--theme-deafult) 0%, #a26cf8 100%);*/
        background: linear-gradient(26deg, #3f51b5 0%, #673ab7 100%);
        border-radius: 10px;
        height: 170px;
        width: 100%
    }

.offer-slider .selling-slide {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.offer-box .offer-slider .carousel-control-prev {
    right: 0;
    left: unset
}

.offer-box .offer-slider .carousel-control-prev-icon {
    top: 116px;
    position: absolute
}

.offer-box .offer-slider .carousel-control-next-icon {
    top: 75px;
    position: absolute
}

.offer-box .offer-slider .carousel-control-prev-icon, .offer-box .offer-slider .carousel-control-next-icon {
    width: 12px;
    height: 12px;
    background-color: rgba(255,255,255,0.1);
    border-radius: 10px
}

.offer-box .offer-slider .carousel-control-prev, .offer-box .offer-slider .carousel-control-next {
    width: 10%
}

.offer-box .offer-slider .selling-slide .d-flex {
    height: 73%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.offer-box .offer-slider .selling-slide p {
    color: rgba(255,255,255,0.8);
    font-weight: 500;
    font-family: Roboto,sans-serif;
    margin-bottom: 5px;
    font-size: 25px;
}

.offer-box .offer-slider .selling-slide .badge-white {
    background-color: rgba(255,255,255,0.1)
}

.offer-box .offer-slider .selling-slide .badge-dotted {
    border: 1px dashed rgba(255,255,255,0.4)
}

.offer-box .offer-slider .selling-slide .badge {
    font-size: 13px !important;
    color: #fff;
    font-weight: 500;
    padding: 8px 15px !important;
    height: auto;
    margin-right: 5px;
    margin-bottom: 5px;
}

.offer-box .offer-slider .selling-slide h4 {
    color: #fff;
    margin-bottom: 14px;
    font-size: 18px;
}

.offer-box .offer-slider .selling-slide .center-img {
    margin-top: -6px;
    text-align: right;
}

.reg-frs-exp-card {
    text-align: center;
}

    .reg-frs-exp-card h5 {
        color: rgba(43,43,43,0.7);
        text-transform: uppercase;
        text-align: center;
        padding: 20px 0 0;
        font-weight: 500;
        margin-bottom: 0;
        font-size: 18px;
    }

    .reg-frs-exp-card span {
        color: rgba(43,43,43,0.7);
        text-transform: uppercase;
        margin-bottom: 4px;
        display: inline-block;
        font-size: 18px;
    }

    .reg-frs-exp-card h4 {
        font-size: 16px;
    }

.reg-frs-exp-card {
    text-align: center;
}

    .reg-frs-exp-card h5 {
        transition: all ease-in 0.1s;
    }

    .reg-frs-exp-card:hover h5 {
        letter-spacing: 1.5px;
    }

    .reg-frs-exp-card img {
        filter: hue-rotate(45%);
        /*background-color: aquamarine;*/
    }

#test:hover ~ img {
    filter: hue-rotate(45%);
    background-color: aquamarine;
}

.redial-icons {
    position: relative;
}

    .redial-icons > img {
        position: relative;
        z-index: 2;
    }

    .redial-icons:after {
        content: "";
        height: 40px;
        width: 41px;
        background: orange;
        left: 50%;
        position: absolute;
        transform: translateX(-50%);
        bottom: 0;
        z-index: 1;
        border-radius: 50%;
        transition: all 0.3s ease;
    }

.reg-frs-exp-card:hover .redial-icons > img {
    filter: drop-shadow(2px 2px 7px rgba(0,0,0,0.2));
}

.reg-frs-exp-card:hover .redial-icons:after {
    transform: scale(2) translateX(-23%);
    transform-origin: center;
    bottom: 23px;
    opacity: 0.3;
}

.ff-Rubik-bold {
    font-family: Rubik,sans-serif !important;
    font-weight: 600;
}

.ff-Rubik-semibold {
    font-family: Rubik,sans-serif !important;
    font-weight: 500;
}

.ff-Rubik {
    font-family: Rubik,sans-serif !important;
}

.ff-roboto {
    font-family: Roboto,sans-serif !important;
}

.ff-roboto-semibold {
    font-family: Roboto,sans-serif !important;
    font-weight: 500;
}

.ff-roboto-bold {
    font-family: Roboto,sans-serif !important;
    font-weight: 600;
}

.img-fit {
    object-fit: cover;
    object-position: center;
}

.gap-5p {
    gap: 5px !important;
}

/*.noDataFound:after {
    content: "\f15b";
    font-family: 'FontAwesome';
    color: #183153;
    font-size: 35px;
    position: absolute;
    top: -25px;
    left: 50%;
    transform: translate(-50%,-50%);
    opacity: 0.4;
}
.noDataFound:before {
    content: "\f057";
    font-family: 'FontAwesome';
    color: #183153;
    font-size: 19px;
    position: absolute;
    top: -20px;
    left: 50%;
    transform: translate(-50%,-50%);
    background: #fff;
    border-radius: 50%;
    overflow: hidden;
}*/
.noDataFound {
    font-family: Rubik,sans-serif !important;
    font-weight: 400;
    font-size: 14px;
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    word-break: break-word;
    color: #183153;
    display: none;
    flex-direction: column;
    width: 100%;
    align-items: center;
    font-style: italic;
    padding-left: 15px;
    padding-right: 15px;
    text-align: center;
}

    .noDataFound > img {
        max-width: 30%;
        object-fit: cover;
        object-position: center;
        margin-bottom: 15px;
        margin-left: auto;
        margin-right: auto;
    }
/*  #maindata .card-body {
        position: relative;
    }*/

/*---------------------------------------------------------------------------*/
.hrS-btn-outline-primary-2:hover {
    color: #fff !important;
    background-color: #007bff !important;
    border-color: #007bff !important;
}

.hrS-btn-outline-primary-2 {
    color: #007bff !important;
    background-color: transparent !important;
    background-image: none !important;
    border-color: #007bff !important;
    border: 1px solid transparent;
}

.hrS-btn-outline-success:hover {
    background-color: rgba(0,0,0,.03);
}

.hrS-btn-outline-success {
    color: #1a8e54 !important;
    background-color: transparent !important;
    background-image: none !important;
    border-color: #1a8e54 !important;
}

.hrS-btn-lg {
    padding: .5rem 1rem !important;
    font-size: 14px !important;
    line-height: 1.5;
    border-radius: .3rem;
}

.txt-secondary {
    color: #3f51b5 !important;
}

.text-primary {
    color: #1266f1 !important
}

.text-secondary {
    color: #b23cfd !important
}

.text-success {
    color: #00b74a !important
}

.text-info {
    color: #39c0ed !important
}

.text-warning {
    color: #ffa900 !important
}

.text-danger {
    color: #f93154 !important
}


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

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

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

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

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

.d-table-row {
    display: table-row !important;
}

.d-table-cell {
    display: table-cell !important;
}

.d-flex {
    display: -ms-flexbox !important;
    display: flex !important;
}

.d-inline-flex {
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
}

.justify-content-start {
    -ms-flex-pack: start !important;
    justify-content: flex-start !important;
}

.justify-content-end {
    -ms-flex-pack: end !important;
    justify-content: flex-end !important;
}

.justify-content-center {
    -ms-flex-pack: center !important;
    justify-content: center !important;
}

.justify-content-between {
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
}

.justify-content-around {
    -ms-flex-pack: distribute !important;
    justify-content: space-around !important;
}

.align-items-start {
    -ms-flex-align: start !important;
    align-items: flex-start !important;
}

.align-items-end {
    -ms-flex-align: end !important;
    align-items: flex-end !important;
}

.align-items-center {
    -ms-flex-align: center !important;
    align-items: center !important;
}

.align-items-baseline {
    -ms-flex-align: baseline !important;
    align-items: baseline !important;
}

.align-items-stretch {
    -ms-flex-align: stretch !important;
    align-items: stretch !important;
}

.align-content-start {
    -ms-flex-line-pack: start !important;
    align-content: flex-start !important;
}

.align-content-end {
    -ms-flex-line-pack: end !important;
    align-content: flex-end !important;
}

.align-content-center {
    -ms-flex-line-pack: center !important;
    align-content: center !important;
}

.align-content-between {
    -ms-flex-line-pack: justify !important;
    align-content: space-between !important;
}

.align-content-around {
    -ms-flex-line-pack: distribute !important;
    align-content: space-around !important;
}

.align-content-stretch {
    -ms-flex-line-pack: stretch !important;
    align-content: stretch !important;
}

.align-self-auto {
    -ms-flex-item-align: auto !important;
    align-self: auto !important;
}

.align-self-start {
    -ms-flex-item-align: start !important;
    align-self: flex-start !important;
}

.align-self-end {
    -ms-flex-item-align: end !important;
    align-self: flex-end !important;
}

.align-self-center {
    -ms-flex-item-align: center !important;
    align-self: center !important;
}

.align-self-baseline {
    -ms-flex-item-align: baseline !important;
    align-self: baseline !important;
}

.align-self-stretch {
    -ms-flex-item-align: stretch !important;
    align-self: stretch !important;
}

.flex-grow-1 {
    flex-grow: 1;
}

.shadow-none {
    box-shadow: none !important;
}

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

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

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

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

.w-auto {
    width: auto !important;
}

.h-25 {
    height: 25% !important;
}

.h-50 {
    height: 50% !important;
}

.h-75 {
    height: 75% !important;
}

.h-100 {
    height: 100% !important;
}

.h-auto {
    height: auto !important;
}

.mw-100 {
    max-width: 100% !important;
}

.mh-100 {
    max-height: 100% !important;
}

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

.mt-0,
.my-0 {
    margin-top: 0 !important;
}

.mr-0,
.mx-0 {
    margin-right: 0 !important;
}

.mb-0,
.my-0 {
    margin-bottom: 0 !important;
}

.ml-0,
.mx-0 {
    margin-left: 0 !important;
}

.m-1 {
    margin: 0.25rem !important;
}

.mt-1,
.my-1 {
    margin-top: 0.25rem !important;
}

.mr-1,
.mx-1 {
    margin-right: 0.25rem !important;
}

.mb-1,
.my-1 {
    margin-bottom: 0.25rem !important;
}

.ml-1,
.mx-1 {
    margin-left: 0.25rem !important;
}

.m-2 {
    margin: 0.5rem !important;
}

.mt-2,
.my-2 {
    margin-top: 0.5rem !important;
}

.mr-2,
.mx-2 {
    margin-right: 0.5rem !important;
}

.mb-2,
.my-2 {
    margin-bottom: 0.5rem !important;
}

.ml-2,
.mx-2 {
    margin-left: 0.5rem !important;
}

.m-3 {
    margin: 1rem !important;
}

.mt-3,
.my-3 {
    margin-top: 1rem !important;
}

.mr-3,
.mx-3 {
    margin-right: 1rem !important;
}

.mb-3,
.my-3 {
    margin-bottom: 1rem !important;
}

.ml-3,
.mx-3 {
    margin-left: 1rem !important;
}

.m-4 {
    margin: 1.5rem !important;
}

.mt-4,
.my-4 {
    margin-top: 1.5rem !important;
}

.mr-4,
.mx-4 {
    margin-right: 1.5rem !important;
}

.mb-4,
.my-4 {
    margin-bottom: 1.5rem !important;
}

.ml-4,
.mx-4 {
    margin-left: 1.5rem !important;
}

.m-5 {
    margin: 3rem !important;
}

.mt-5,
.my-5 {
    margin-top: 3rem !important;
}

.mr-5,
.mx-5 {
    margin-right: 3rem !important;
}

.mb-5,
.my-5 {
    margin-bottom: 3rem !important;
}

.ml-5,
.mx-5 {
    margin-left: 3rem !important;
}

.p-0 {
    padding: 0 !important;
}

.pt-0,
.py-0 {
    padding-top: 0 !important;
}

.pr-0,
.px-0 {
    padding-right: 0 !important;
}

.pb-0,
.py-0 {
    padding-bottom: 0 !important;
}

.pl-0,
.px-0 {
    padding-left: 0 !important;
}

.p-1 {
    padding: 0.25rem !important;
}

.pt-1,
.py-1 {
    padding-top: 0.25rem !important;
}

.pr-1,
.px-1 {
    padding-right: 0.25rem !important;
}

.pb-1,
.py-1 {
    padding-bottom: 0.25rem !important;
}

.pl-1,
.px-1 {
    padding-left: 0.25rem !important;
}

.p-2 {
    padding: 0.5rem !important;
}

.pt-2,
.py-2 {
    padding-top: 0.5rem !important;
}

.pr-2,
.px-2 {
    padding-right: 0.5rem !important;
}

.pb-2,
.py-2 {
    padding-bottom: 0.5rem !important;
}

.pl-2,
.px-2 {
    padding-left: 0.5rem !important;
}

.p-3 {
    padding: 1rem !important;
}

.pt-3,
.py-3 {
    padding-top: 1rem !important;
}

.pr-3,
.px-3 {
    padding-right: 1rem !important;
}

.pb-3,
.py-3 {
    padding-bottom: 1rem !important;
}

.pl-3,
.px-3 {
    padding-left: 1rem !important;
}

.p-4 {
    padding: 1.5rem !important;
}

.pt-4,
.py-4 {
    padding-top: 1.5rem !important;
}

.pr-4,
.px-4 {
    padding-right: 1.5rem !important;
}

.pb-4,
.py-4 {
    padding-bottom: 1.5rem !important;
}

.pl-4,
.px-4 {
    padding-left: 1.5rem !important;
}

.p-5 {
    padding: 3rem !important;
}

.pt-5,
.py-5 {
    padding-top: 3rem !important;
}

.pr-5,
.px-5 {
    padding-right: 3rem !important;
}

.pb-5,
.py-5 {
    padding-bottom: 3rem !important;
}

.pl-5,
.px-5 {
    padding-left: 3rem !important;
}

.m-auto {
    margin: auto !important;
}

.mt-auto,
.my-auto {
    margin-top: auto !important;
}

.mr-auto,
.mx-auto {
    margin-right: auto !important;
}

.mb-auto,
.my-auto {
    margin-bottom: auto !important;
}

.ml-auto,
.mx-auto {
    margin-left: auto !important;
}


/*----------------------------------------MDB Button---------------------------------------*/

.hrS-btn {
    /*display: inline-block;*/
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: normal;
    color: #4f4f4f;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: transparent;
    border: .125rem solid transparent;
    /*padding: .375rem .75rem;*/
    padding: .600rem .95rem;
    border-radius: .25rem;
    -webkit-transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    font-size: 1.3rem;
    /*-webkit-box-shadow: 0 2px 5px 0 rgba(0,0,0,.1),0 2px 10px 0 rgba(0,0,0,.1);
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.1),0 2px 10px 0 rgba(0,0,0,.1);*/
}

    .hrS-btn i {
        line-height: normal;
    }

@media(prefers-reduced-motion:reduce) {
    .hrS-btn {
        -webkit-transition: none;
        transition: none
    }
}

.hrS-btn-sm {
    padding: 4px 6px !important;
    font-size: 10px !important;
    line-height: 1.5;
}

.hrS-btn-primary {
    color: #fff;
    background-color: #1266f1
}

    .hrS-btn-primary.focus, .hrS-btn-primary:focus, .hrS-btn-primary:hover {
        color: #fff;
        background-color: #0c56d0;
        -webkit-box-shadow: 0 4px 10px 0 rgb(0 0 0 / 20%), 0 4px 20px 0 rgb(0 0 0 / 10%);
        box-shadow: 0 4px 10px 0 rgb(0 0 0 / 20%), 0 4px 20px 0 rgb(0 0 0 / 10%);
    }

    .btn-check:active + .hrS-btn-primary, .btn-check:checked + .hrS-btn-primary, .hrS-btn-primary.active, .hrS-btn-primary:active, .show > .hrS-btn-primary.dropdown-toggle {
        color: #fff;
        background-color: #093d94
    }

        .btn-check:active + .hrS-btn-primary:focus, .btn-check:checked + .hrS-btn-primary:focus, .hrS-btn-primary.active:focus, .hrS-btn-primary:active:focus, .show > .hrS-btn-primary.dropdown-toggle:focus {
            -webkit-box-shadow: 0 4px 10px 0 rgb(0 0 0 / 20%), 0 4px 20px 0 rgb(0 0 0 / 10%);
            box-shadow: 0 4px 10px 0 rgb(0 0 0 / 20%), 0 4px 20px 0 rgb(0 0 0 / 10%);
        }

    .hrS-btn-primary.disabled, .hrS-btn-primary:disabled {
        color: #fff;
        background-color: #1266f1;
        pointer-events: none;
        box-shadow: none;
        opacity: 0.8;
    }

.hrS-btn-outline-primary {
    color: #1266f1;
    border-color: #1266f1
}

    .hrS-btn-outline-primary:hover {
        color: #1266f1;
        background-color: rgba(0,0,0,.03)
    }

    .hrS-btn-outline-primary.active, .hrS-btn-outline-primary.dropdown-toggle.show, .hrS-btn-outline-primary.focus, .hrS-btn-outline-primary:active, .hrS-btn-outline-primary:focus {
        color: #1266f1;
        background-color: transparent
    }

        .hrS-btn-outline-primary.active:focus, .hrS-btn-outline-primary.dropdown-toggle.show:focus, .hrS-btn-outline-primary:active:focus {
            -webkit-box-shadow: none;
            box-shadow: none
        }

    .hrS-btn-outline-primary.disabled, .hrS-btn-outline-primary:disabled {
        color: #1266f1;
        pointer-events: none;
        box-shadow: none;
        opacity: 0.8;
    }



.hrS-btn-outline-danger {
    color: #f93154;
    border-color: #f93154;
}

    .hrS-btn-outline-danger:hover {
        color: #f93154;
        background-color: rgba(0,0,0,.03)
    }

    .hrS-btn-outline-danger.active, .hrS-btn-outline-danger.dropdown-toggle.show, .hrS-btn-outline-danger.focus, .hrS-btn-outline-danger:active, .hrS-btn-outline-danger:focus {
        color: #f93154;
        background-color: transparent
    }

        .hrS-btn-outline-danger.active:focus, .hrS-btn-outline-danger.dropdown-toggle.show:focus, .hrS-btn-outline-danger:active:focus {
            -webkit-box-shadow: none;
            box-shadow: none
        }

    .hrS-btn-outline-danger.disabled, .hrS-btn-outline-danger:disabled {
        color: #f93154;
        pointer-events: none;
        box-shadow: none;
        opacity: 0.8;
    }


.hrS-btn-secondary {
    color: #fff;
    background-color: #b23cfd
}

    .hrS-btn-secondary.focus, .hrS-btn-secondary:focus, .hrS-btn-secondary:hover {
        color: #fff;
        background-color: #a316fd
    }

    .btn-check:active + .hrS-btn-secondary, .btn-check:checked + .hrS-btn-secondary, .btn-secondary.active, .hrS-btn-secondary:active, .show > .hrS-btn-secondary.dropdown-toggle {
        color: #fff;
        background-color: #8102d1
    }

        .btn-check:active + .hrS-btn-secondary:focus, .btn-check:checked + .hrS-btn-secondary:focus, .hrS-btn-secondary.active:focus, .hrS-btn-secondary:active:focus, .show > .hrS-btn-secondary.dropdown-toggle:focus {
            -webkit-box-shadow: 0 4px 10px 0 rgba(0,0,0,.2),0 4px 20px 0 rgba(0,0,0,.1);
            box-shadow: 0 4px 10px 0 rgba(0,0,0,.2),0 4px 20px 0 rgba(0,0,0,.1)
        }

    .hrS-btn-secondary.disabled, .hrS-btn-secondary:disabled {
        color: #fff;
        background-color: #b23cfd;
        pointer-events: none;
        box-shadow: none;
        opacity: 0.8;
    }

.hrS-btn-success {
    color: #fff;
    background-color: #00b74a
}

    .hrS-btn-success.focus, .hrS-btn-success:focus, .hrS-btn-success:hover {
        color: #fff;
        background-color: #00913b;
        -webkit-box-shadow: 0 4px 10px 0 rgb(0 0 0 / 20%), 0 4px 20px 0 rgb(0 0 0 / 10%);
        box-shadow: 0 4px 10px 0 rgb(0 0 0 / 20%), 0 4px 20px 0 rgb(0 0 0 / 10%);
    }

    .btn-check:active + .hrS-btn-success, .btn-check:checked + .hrS-btn-success, .hrS-btn-success.active, .hrS-btn-success:active, .show > .hrS-btn-success.dropdown-toggle {
        color: #fff;
        background-color: #005121
    }

        .btn-check:active + .hrS-btn-success:focus, .btn-check:checked + .hrS-btn-success:focus, .hrS-btn-success.active:focus, .hrS-btn-success:active:focus, .show > .hrS-btn-success.dropdown-toggle:focus {
            -webkit-box-shadow: 0 4px 10px 0 rgba(0,0,0,.2),0 4px 20px 0 rgba(0,0,0,.1);
            box-shadow: 0 4px 10px 0 rgba(0,0,0,.2),0 4px 20px 0 rgba(0,0,0,.1)
        }

    .hrS-btn-success.disabled, .hrS-btn-success:disabled {
        color: #fff;
        background-color: #00b74a;
        pointer-events: none;
        box-shadow: none;
        opacity: 0.6;
    }
/* .hrS-btn-success.disabled:hover, .hrS-btn-success:disabled:hover {
        pointer-events:none;
        box-shadow:none;
        opacity:0.8;
    }*/

.hrS-btn-danger > .fa-plus-circle {
    font-size: 12px;
}

.hrS-btn-danger {
    color: #fff;
    background-color: #f93154
}

    .hrS-btn-danger.focus, .hrS-btn-danger:focus, .hrS-btn-danger:hover {
        color: #fff;
        background-color: #f80c35;
        -webkit-box-shadow: 0 4px 10px 0 rgb(0 0 0 / 20%), 0 4px 20px 0 rgb(0 0 0 / 10%);
        box-shadow: 0 4px 10px 0 rgb(0 0 0 / 20%), 0 4px 20px 0 rgb(0 0 0 / 10%);
    }

    .btn-check:active + .hrS-btn-danger, .btn-check:checked + .hrS-btn-danger, .hrS-btn-danger.active, .hrS-btn-danger:active, .show > .hrS-btn-danger.dropdown-toggle {
        color: #fff;
        background-color: #be0626
    }

        .btn-check:active + .hrS-btn-danger:focus, .btn-check:checked + .hrS-btn-danger:focus, .hrS-btn-danger.active:focus, .hrS-btn-danger:active:focus, .show > .hrS-btn-danger.dropdown-toggle:focus {
            -webkit-box-shadow: 0 4px 10px 0 rgba(0,0,0,.2),0 4px 20px 0 rgba(0,0,0,.1);
            box-shadow: 0 4px 10px 0 rgba(0,0,0,.2),0 4px 20px 0 rgba(0,0,0,.1)
        }

    .hrS-btn-danger.disabled, .hrS-btn-danger:disabled {
        color: #fff;
        background-color: #f93154;
        pointer-events: none;
        box-shadow: none;
        opacity: 0.6;
    }

.ev-btn-link {
    font-size: 13px;
    color: #1266f1;
    display: inline-block;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

    .ev-btn-link:hover {
        color: #1266f1;
    }

    .ev-btn-link::before {
        content: '';
        position: absolute;
        width: 100%;
        height: 1px;
        border-radius: 4px;
        background-color: #1266f1;
        bottom: 0;
        left: 0;
        transform-origin: right;
        transform: scaleX(0);
        transition: transform .3s ease-in-out;
    }

    .ev-btn-link:hover::before {
        transform-origin: left;
        transform: scaleX(1);
    }

.border {
    border: 1px solid #dee2e6 !important;
}

.border-top {
    border-top: 1px solid #dee2e6 !important;
}

.border-right {
    border-right: 1px solid #dee2e6 !important;
}

.border-bottom {
    border-bottom: 1px solid #dee2e6 !important;
}

.border-left {
    border-left: 1px solid #dee2e6 !important;
}

.border-0 {
    border: 0 !important;
}

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

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

.border-bottom-0 {
    border-bottom: 0 !important;
}

.border-left-0 {
    border-left: 0 !important;
}

.btn-group-2 > .btn-group-2:not(:last-child) > .hrS-btn, .btn-group-2 > .hrS-btn:not(:last-child):not(.dropdown-toggle) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.btn-group-2 > .btn-group-2:not(:first-child) > .hrS-btn, .btn-group-2 > .btn:nth-child(n+3), .btn-group-2 > :not(.btn-check) + .hrS-btn {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.btn-group-2 > .btn-group-2:not(:first-child), .btn-group-2 > .hrS-btn:not(:first-child) {
    margin-left: -.125rem;
}

.btn-group-2 {
    margin-left: -0.1rem;
}

.btn-group-2, .btn-group-vertical-2 {
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    vertical-align: middle;
}

    .btn-group-2.open .dropdown-menu {
        top: 115%;
        z-index: 950;
        min-width: auto;
        box-shadow: 0px 1px 6px rgb(0 0 0 / 20%);
    }

        .btn-group-2.open .dropdown-menu li:hover {
            background: #eee;
            cursor: pointer;
        }

        .btn-group-2.open .dropdown-menu li {
            padding: 5px 15px !important;
        }

        .btn-group-2.open .dropdown-menu.chkg li {
            padding: 5px 10px !important;
        }

.btn-group-2, .btn-group-vertical-2 {
    /*-webkit-box-shadow: 0 2px 5px 0 rgb(0 0 0 / 20%), 0 2px 10px 0 rgb(0 0 0 / 10%);
    box-shadow: 0 2px 5px 0 rgb(0 0 0 / 20%), 0 2px 10px 0 rgb(0 0 0 / 10%);*/
    border-radius: 3px;
    -webkit-transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
}

    .btn-group-2 > .btn-group-2:hover {
        -webkit-box-shadow: 0 2px 5px 0 rgb(0 0 0 / 20%), 0 2px 10px 0 rgb(0 0 0 / 10%);
        box-shadow: 0 2px 5px 0 rgb(0 0 0 / 20%), 0 2px 10px 0 rgb(0 0 0 / 10%);
    }

    .btn-group-2 > .hrS-btn:hover {
        -webkit-box-shadow: 0 2px 5px 0 rgb(0 0 0 / 20%), 0 2px 10px 0 rgb(0 0 0 / 10%);
        box-shadow: 0 2px 5px 0 rgb(0 0 0 / 20%), 0 2px 10px 0 rgb(0 0 0 / 10%);
        background: #1266f1;
        color: #fff;
    }

        .btn-group-2 > .hrS-btn:hover i {
            color: #fff !important;
        }

.dl-horizontal dt, .dl-horizontal dd {
    margin-bottom: 8px;
    font-size: 12px;
}
/*-------------------------Alert------------------------------*/
.alert {
    position: relative;
    padding: 0.8rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: .25rem;
    font-size: 12px;
}

.alert-danger:after, .alert-info:after, .alert-primary:after {
    content: "";
    position: absolute;
    width: 3px;
    height: 65%;
    vertical-align: middle;
    left: -1px;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 10px;
}

.alert-primary {
    background: linear-gradient(45deg, #c6dbfe, #e4eeff);
    background: -webkit-linear-gradient(45deg, #c6dbfe, #e4eeff);
}

    .alert-primary:after {
        background: #0b3d91;
    }

.alert-danger:after {
    background: #d77a8b;
}

.alert-info:after {
    background: #3185a2;
}

.alert-heading {
    color: inherit
}

.alert-link {
    font-weight: 700
}

.alert-dismissible {
    padding-right: 3rem
}

    .alert-dismissible .btn-close {
        position: absolute;
        top: 0;
        right: 0;
        z-index: 2;
        padding: 1.25rem 1rem
    }

.alert-primary {
    color: #0b3d91;
    background-color: #d0e0fc;
    border-color: #b8d1fb
}

    .alert-primary .alert-link {
        color: #093174
    }

.alert-secondary {
    color: #6b2498;
    background-color: #f0d8ff;
    border-color: #e8c5fe
}

    .alert-secondary .alert-link {
        color: #561d7a
    }

.alert-success {
    color: #006e2c;
    background-color: #ccf1db;
    border-color: #b3e9c9
}

    .alert-success .alert-link {
        color: #005823
    }

.alert-info {
    color: #22738e;
    background: linear-gradient(45deg, #d7f2fb, #f1fbff);
    border-color: #c4ecfa;
}

    .alert-info .alert-link {
        color: #1b5c72
    }

.alert-warning {
    color: #640;
    background-color: #fec;
    border-color: #ffe5b3
}

    .alert-warning .alert-link {
        color: #523600
    }

.alert-danger {
    color: #951d32;
    background: linear-gradient(45deg, #fed6dd, transparent);
    background: -webkit-linear-gradient(45deg, #fed6dd, transparent);
    border-color: #fdc1cc;
    box-shadow: inset 0 0 3px rgb(254 218 224);
}

    .alert-danger .alert-link {
        color: #771728
    }

.alert-light {
    color: #646464;
    background-color: #fefefe;
    border-color: #fefefe
}

    .alert-light .alert-link {
        color: #505050
    }

.alert-dark {
    color: #171717;
    background-color: #d4d4d4;
    border-color: #bebebe
}

    .alert-dark .alert-link {
        color: #121212
    }

.alert-white {
    color: #666;
    background-color: #fff;
    border-color: #fff
}

    .alert-white .alert-link {
        color: #525252
    }

.alert-black {
    color: #000;
    background-color: #ccc;
    border-color: #b3b3b3
}

    .alert-black .alert-link {
        color: #000
    }

.font-weight-normal {
    font-weight: 400 !important
}

.font-weight-bold {
    font-weight: 700 !important
}

.font-weight-bolder {
    font-weight: bolder !important
}

.hr-suite-pms .nav-tabs > li:after {
    margin-top: 0px;
}

/*.hr-suite-pms .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    color: #5a76cc;
    background-color: #f9f9f9 !important;
    border-bottom-color: #fff;
    box-shadow: 0px -3px 8px rgb(73 130 189 / 10%), 5px 0px 8px rgb(73 130 189 / 10%), 0px 0px 8px rgb(73 130 189 / 10%);
}*/


.hr-suite-pms .custom-tabs .nav-tabs > li:hover:after {
    height: 4px !important;
    opacity: 0.5;
}

.hr-suite-pms .custom-tabs .nav-tabs > li {
    position: relative;
    margin-right: 2px;
}

    .hr-suite-pms .custom-tabs .nav-tabs > li.active:after {
        height: 4px;
        opacity: 1;
    }

    .hr-suite-pms .custom-tabs .nav-tabs > li:after {
        content: '';
        background: #5a76cc;
        display: block;
        height: 3px;
        margin-top: 3px;
        transition: height 0.2s;
        width: 100%;
        opacity: 0.4;
        position: absolute;
        bottom: 0;
    }

.nav-tabs > li.active > a {
    color: #6880c9 !important;
}

.hr-suite-pms .sf-wizard > .sf-nav-wrap > .sf-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

#WizardPlanAndReviewConfiguration-box .sf-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 15px;
}

.hr-suite-pms .sf-wizard > .sf-nav-wrap > .sf-nav > .sf-nav-step > .sf-nav-subtext img {
    border: 1px solid #fff;
    border-radius: 50%;
    padding: 1px 0px 0px 0px;
}

.hr-suite-pms .sf-nav li.sf-active .sf-nav-number {
    background: #ff5722;
    box-shadow: 0 2px 4px rgb(0 0 0 / 20%);
}

.hr-suite-pms .sf-li-number .sf-nav-subtext {
    padding-left: 0;
    font-size: 13px;
    letter-spacing: 0.5px;
    position: relative;
    top: -2px;
}

.hr-suite-pms .sf-nav-top, .sf-sky .sf-nav-bottom {
    height: 90px !important;
    overflow: auto;
}

.hr-suite-pms .sf-wizard > .sf-nav-wrap > .sf-nav li {
    width: 100%;
    flex: 1;
    line-height: normal;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .hr-suite-pms .sf-wizard > .sf-nav-wrap > .sf-nav li:last-child {
        margin-right: 0;
    }

.hr-suite-pms .sf-nav-top li.sf-active {
    margin-top: 0;
    box-shadow: 0 2px 4px rgb(0 0 0 / 20%);
}

.WizardPlanAndReviewConfiguration .sf-viewport .sf-fieldwrap .sf-step {
    width: 100% !important;
    float: initial;
    margin-right: 0 !important;
}

.WizardPlanAndReviewConfiguration .sf-step > fieldset {
    border: 0;
    margin: 0;
    padding: 0px;
    /* height: auto !important; */
    overflow: hidden !important;
    /* display: block; */
    /* outline: 0 !important; */
}

.br-8p {
    border-radius: 8px !important;
}

.br-6p {
    border-radius: 6px !important;
}

.br-4p {
    border-radius: 4px !important;
}

.br-2p {
    border-radius: 2px !important;
}


/*.hr-suite-pms .nav-tabs > li.active:after {
    transform: scaleX(1);
}

.hr-suite-pms .nav-tabs > li:after {
    content: '';
    position: absolute;
    width: 100%;
    transform: scaleX(0);
    bottom: -1px;
    left: -1px;
    height: 4px;
    transform-origin: bottom right;
    transition: transform 0.25s ease-out;
}

.hr-suite-pms .nav-tabs > li:hover:after {
    transform: scaleX(1);
    transform-origin: bottom left;
}*/
.hrS-matrix tbody tr > td {
    border-collapse: separate;
    vertical-align: middle;
    font-family: Rubik,sans-serif !important;
    font-size: 14px;
    /*font-weight: 500;*/
    letter-spacing: 0.5px;
    box-shadow: inset 0 0 15px rgb(0 0 0 / 10%);
    height: 90px;
}

    .hrS-matrix tbody tr > td span {
        text-shadow: 0 0px 0.5px rgb(0 0 0 / 30%);
    }

/*--------Bootstrap CSS update--------*/
.form-control {
    height:34px;
}
.select2-container .select2-selection--multiple {
    min-height: 34px;
    border-radius:4px;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    height: calc(34px - 10px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 6px;
    gap: 2px;
    line-height: 1.8;
    margin-bottom: 5px;
    border: 1px solid #ddd !important;
    border-radius: 2px !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered {
    padding: 0 6px;
}
.select2-selection--multiple .select2-selection__choice {
    font-family: Rubik, sans-serif !important;
}
.select2-selection__choice__remove {
    font-size: 14px;
    font-weight: 400 !important;
    line-height: 1;
}
.msg-list__item .img-circle {
    border: 2px solid #eee !important;
    box-shadow:none !important;
}
/*-----------Normal Basic table UIdesign Start-------------*/
.col-md-12 + .hrm-basic-table, .col-md-12 + .hrS-basic-table {
    overflow: auto;
}

.hrm-basic-table, .hrS-basic-table {
    /*display: flex;
    justify-content: center;*/
    overflow: auto;
}

.ev-custom-scrollbar::-webkit-scrollbar {
    width: 14px
}

.ev-custom-scrollbar::-webkit-scrollbar-thumb {
    background-clip: content-box;
    background-color: #ddd;
    border: 4px solid transparent;
    border-radius: 100px
}

    .ev-custom-scrollbar::-webkit-scrollbar-thumb:hover {
        background-color: #ccc
    }

.hrm-basic-table, .hrS-basic-table {
    width: 100%;
    max-width: 100%;
    border: 1px solid #eee;
}

    .hrm-basic-table table, .hrS-basic-table table {
        max-width: 100%;
    }

    .hrm-basic-table tr:nth-child(odd), .hrS-basic-table tr:nth-child(odd) {
        background-color: #f9f9f9;
    }

    .hrm-basic-table.tbl-style-2 tr:nth-child(odd), .hrS-basic-table.tbl-style-2 tr:nth-child(odd) {
        background-color: #ffffff;
    }

    .hrm-basic-table.tbl-style-2 tr, .hrS-basic-table.tbl-style-2 tr {
        border-top: 1px solid #eae8e8;
    }

    .hrm-basic-table.tbl-style-2 tbody tr:hover, .hrS-basic-table.tbl-style-2 tbody tr:hover {
        background-color: #f2f2f2 !important;
    }

    .hrm-basic-table.tbl-style-2 tr:first-child, .hrS-basic-table.tbl-style-2 tr:first-child {
        border-top: 0;
    }

    .hrm-basic-table tr:hover, .hrS-basic-table tr:hover {
        background-color: #eee;
    }

    .hrm-basic-table.tbl-style-2.no-hover tbody tr:hover, .hrS-basic-table.tbl-style-2.no-hover tbody tr:hover {
        background-color: transparent !important;
    }

.align-items-stretch {
    align-items: stretch !important;
}

/*.hrm-basic-table th, .hrS-basic-table th {
    background-color: #4276ac;
    color: #fff;
}*/

.hrm-basic-table thead tr th, .hrS-basic-table thead tr th {
    position: sticky !important;
    top: 0;
    background-color: #4276ac;
    color: #fff;
}

.hrm-basic-table th,
.hrm-basic-table td, .hrS-basic-table th,
.hrS-basic-table td {
    text-align: left;
    padding: 0.6em 1em;
}

.hrm-basic-table table > tbody > tr > td:first-child, .hrS-basic-table table > tbody > tr > td:first-child {
    font-weight: normal;
}

.hrm-basic-table table, .hrS-basic-table table {
    margin-bottom: 0;
    border: 1px solid #ddd;
    border-top: none;
}
/*----Style 2-----*/
.hrS-basic-table.-style2 tbody tr:nth-child(odd) {
    background-color: transparent;
}

.hrS-basic-table.-style2 tbody tr {
    border-bottom: 1px solid #eae8e8;
}

    .hrS-basic-table.-style2 tbody tr:hover {
        background-color: ghostwhite !important;
    }

.hrS-matrix-view table tbody tr td {
}

.hrS-matrix-view .mtx-inner {
    padding: 20px;
    padding-top: 0px;
    background-color: rgba(0,0,0,0);
    margin: 10px;
    border: 1px solid #eee;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    letter-spacing: 0.5px;
    border-radius: 10px;
    -webkit-box-shadow: 0 0 10px rgb(8 21 66 / 10%);
    box-shadow: 0 0 10px rgb(8 21 66 / 10%);
    border-top: 2px solid #7366ff;
    padding-left: 50px;
    position: relative;
}

    .hrS-matrix-view .mtx-inner:hover {
        box-shadow: none;
    }

    .hrS-matrix-view .mtx-inner .mtx-inner-header {
        padding: 12px 0px;
        border-bottom: 1px solid #ccc;
        margin-bottom: 15px;
        text-align: left;
    }

        .hrS-matrix-view .mtx-inner .mtx-inner-header > h4 {
            font-size: 12px;
        }

    .hrS-matrix-view .mtx-inner > input, .hrS-matrix-view .mtx-inner .input-group {
        margin-bottom: 14px;
    }

        .hrS-matrix-view .mtx-inner .input-group:last-child {
            margin-bottom: 0px;
        }

        .hrS-matrix-view .mtx-inner .input-group > input {
            margin-bottom: 0px;
        }

    .hrS-matrix-view .mtx-inner .colorpicker-element .input-group-addon i, .hrS-matrix-view .mtx-inner .colorpicker-element .add-on i {
        display: inline-block;
        width: auto;
        height: auto;
        padding: 6px;
        border-radius: 2px;
        font-size: 10px;
        color: #fff;
        text-shadow: 0 0 2px rgb(0 0 0 / 50%);
    }
    .gap-10p {
        grid-gap:10px;
    }
    .fc-head thead tr th {
        padding: 8px;
    }

.ev-static-table {
    font-family: Rubik, sans-serif !important;
    width: 100%;
    font-size:12px;
}
.ev-static-table .ev-btn-link:before {
    background-color: #ddd;
}

.ev-static-table.ev-static-table--full-border {
    border: 1px solid #eee;
}

.ev-static-table.ev-static-table__thead-nowrap thead th {
    white-space: nowrap;
}

.ev-static-table > thead > tr > th, .ev-static-table > tfoot > tr > th {
    font-family: Rubik, sans-serif !important;
    font-weight: 500;
    font-size: 12px;
    border-bottom: 0;
    padding: 12px 10px !important;
    font-style: normal;
    background-color: #f2f2f2;
    position: sticky;
    top: 0;
    z-index: 100;
    vertical-align: middle;
}

.ev-static-table > tfoot > tr > th {
    bottom: 0;
}

.ev-static-table tr:hover {
    background-color: rgba(0, 0, 0, 0.03);
}

.ev-static-table > tbody > tr > td {
    border-bottom: 1px solid #eee !important;
    padding: 12px 10px !important;
    border-top: none;
}

.ev-static-table > tfoot > tr > th {
    border-top: 0;
}

.ev-static-table .btn-sm {
        border-radius: 100px;
        height: 30px;
        width: 30px;
    }

.badge-2.ev-btn-link:before {
    background-color: #aaa;
}

.badge-2.ev-btn-link {
    min-width: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 500;
}

.ribbon-bookmark {
    clear: none;
    padding: 0 5px;
    height: 60px;
    width: 30px;
    line-height: 60px;
    text-align: center;
    left: 10px;
    top: -2px;
    position: absolute;
    color: #fff;
    z-index: 5;
    background: #7366ff;
    /*display: none;*/
}

    .ribbon-bookmark:before {
        content: '';
        border: 15px solid #7366ff;
        top: 100%;
        left: 0;
        margin-top: -14px;
        position: absolute;
        border-right: 15px solid #2c323f;
        border-bottom: 10px solid transparent;
        border-right-color: #7366ff;
        border-bottom-color: transparent;
        border-left-color: #7366ff;
    }

.input-search-group {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 14px;
    border: 1px solid #eee;
    border-radius: 100px;
    width: 100%;
}

    .input-search-group:focus {
        -webkit-box-shadow: none;
        box-shadow: none;
        border-color: #1266f1;
        -webkit-box-shadow: inset 0 0 0 1px #1266f1;
        box-shadow: inset 0 0 0 1px #1266f1;
    }



.input-group .form-control:first-child, .input-group-addon:first-child, .input-group-btn:first-child > .btn, .input-group-btn:first-child > .btn-group > .btn, .input-group-btn:first-child > .dropdown-toggle, .input-group-btn:last-child > .btn-group:not(:last-child) > .btn, .input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle) {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.hrS-modal-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 1rem;
    border-bottom: 1px solid #e0e0e0;
    border-top-left-radius: calc(.5rem - 1px);
    border-top-right-radius: calc(.5rem - 1px);
}

.hrS-modal-body {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 1rem;
}

.hrS-modal-footer {
    padding: .75rem;
    border-top: 1px solid #e0e0e0;
    border-bottom-right-radius: calc(.5rem - 1px);
    border-bottom-left-radius: calc(.5rem - 1px);
}

.hrS-modal-title {
    margin: 0;
    line-height: 1.6;
    font-size: 14px;
    display: flex;
    align-items: center;
    grid-gap: 5px;
    font-weight: 500;
}

.hrS-btn-close {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    width: 1em;
    height: 1em;
    padding: .25em;
    color: #000;
    border: 0;
    border-radius: .25rem;
    opacity: .8;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .hrS-btn-close:hover {
        box-shadow: 0 0 5px rgb(238 17 17 / 50%);
    }

    .hrS-btn-close > span {
        position: relative;
        top: -2px;
    }

@media only screen and (max-width:767px) {
    .hrS-modal-title {
        flex-wrap: wrap;
        justify-content: flex-start !important;
    }
}

.text-center {
    text-align: center !important;
}

.modal-content {
    border-top: 6px solid #5976cc;
    border-bottom: 0;
}
/*.user-input-wrp  input:focus ~ .floating-lbl{
    top: -7px;
    left: 10px;
    font-size: 10px;
    opacity: 1;
}*/
/*.user-input-wrp input:not(:focus) ~ .floating-lbl {
    top: 8px;
    left: 10px;
    font-size: 10px;
    opacity: 1;
}*/
.user-input-wrp .floating-lbl {
    position: absolute;
    pointer-events: none;
    top: -7px;
    left: 10px;
    font-size: 10px;
    transition: 0.2s ease all;
    background: #fff;
    z-index: 15;
    color: #777;
}

/*.inputText {
    font-size: 14px;
    width: 200px;
    height: 35px;
}*/
.user-input-wrp {
    position: relative;
    margin-bottom: 14px;
}

.hrS-file-upload-2 {
    border: 1.6px dashed #3f51b5;
    padding: 8px 15px;
    width: 100%;
    text-align: center;
    border-radius: 4px;
    background: ghostwhite;
    color: #fff;
    text-shadow: 0 0 black;
}

    .hrS-file-upload-2 .fa-upload {
        color: #8093fc;
    }

    .hrS-file-upload-2:hover .fa-upload {
        color: #5369e0;
    }

.hrS-file-upload {
    border: 1px solid #f44336;
    padding: 8px 15px;
    width: 100%;
    text-align: center;
    border-radius: 2px;
    background: #f44336;
    color: #fff;
    text-shadow: 0 0 black;
}

    .hrS-file-upload:hover {
        color: #f8beba;
        background: #ea3b2e;
    }

.panelCandidateRegistration .sf-viewport {
    margin-bottom: 0px;
}

.panelCandidateRegistration .panel-body {
    padding-bottom: 0px;
}

.hrS-imgprofilepic {
    border-radius: 4%;
    box-shadow: 0 0 3px rgb(0 0 0 / 20%);
    padding: 4px;
}

.hrS-imagedelete {
    position: absolute;
    bottom: -4px;
    left: 45%;
    background: #fff;
    padding: 4px;
    border-radius: 50%;
    box-shadow: 0 0 3px rgb(0 0 0 / 20%);
    font-size: 18px;
    height: 33px;
    width: 33px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .hrS-imagedelete:hover {
        background: beige;
    }

#DvAcedemicDetail form, #DvExperienceDetail form {
    /* background: ghostwhite; */
    margin-bottom: 15px;
    padding: 15px;
    /* border-radius: 10px; */
    border-bottom: 2px dashed #4982bd;
}

    #DvAcedemicDetail form:last-of-type, #DvExperienceDetail form:last-of-type {
        border-bottom: none;
    }

#CanRegisterWizard-box .sf-step-active {
    width: 100%;
    float: left;
    margin-right: 0;
}

:root {
    --theme-deafult: #7366ff;
    --theme-secondary: #f73164;
}

.hrS-noRecord {
    padding: 5px;
    border-radius: 10px;
    text-align: center;
    background: ghostwhite;
    /*box-shadow: 0 0 3px rgb(0 0 0 / 20%);*/
    margin-bottom: 10px;
}

    .hrS-noRecord img {
        filter: hue-rotate(88deg) contrast(1);
        max-width: 10%;
    }

    .hrS-noRecord h3 {
        color: #806983;
    }

.hrS-goalPerformance {
    border: 1px solid #d7e2e9;
    overflow: hidden;
    /*border-top: 3px solid rgba(0,0,0,.03);*/
}

    .hrS-goalPerformance > .card-body {
        padding: 1rem;
    }

        .hrS-goalPerformance > .card-body .caption label {
            font-family: Rubik,sans-serif !important;
            font-weight: 500;
            letter-spacing: 0.5px;
        }

        .hrS-goalPerformance > .card-body .caption {
            padding: 0;
            float: right;
            top: 5px;
            position: relative;
        }

        .hrS-goalPerformance > .card-body .rating-container .filled-stars {
            -webkit-text-stroke: 1px transparent;
        }

        .hrS-goalPerformance > .card-body .theme-krajee-fa .star {
            font-size: 1.2em;
        }

    .hrS-goalPerformance .card-header, .hrS-goalPerformance .card-footer {
        border-width: 1px;
        border-color: #eee;
    }

        .hrS-goalPerformance .card-header h3 {
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
            text-overflow: ellipsis;
            width: calc(100% - 8%);
            /*white-space: nowrap;*/
            text-overflow: ellipsis;
            font-size: 14px;
            font-family: Rubik,sans-serif;
            font-weight: 500;
        }

    .hrS-goalPerformance .card-header, .hrS-goalPerformance .card-footer {
        /*background: rgba(0,0,0,.03);*/
        background: #efeffe;
    }

        .hrS-goalPerformance .card-header > span {
            position: absolute;
            right: 8px;
            top: 0;
            background: rgba(0,0,0,.03);
            padding: 4px 6px 18px 6px;
            font-size: 18px;
        }

            .hrS-goalPerformance .card-header > span > i {
                text-shadow: 2px 1px 1px rgb(0 0 0 / 20%);
            }

            .hrS-goalPerformance .card-header > span::after {
                content: "";
                position: absolute;
                right: 0;
                border-top: 15px solid transparent;
                border-bottom: 15px solid #fff;
                border-right: 15px solid transparent;
                bottom: 0px;
                border-left: 15px solid transparent;
            }

#DivGoalReviewCycleList .caption .label:after, #DivCompReviewCycleList .caption .label:after {
    content: "";
    position: absolute;
    right: 0;
    border-top: 9px solid transparent;
    border-bottom: 9px solid transparent;
    border-right: 9px solid #fff;
    bottom: 0px;
    border-left: 9px solid transparent;
}

#DivGoalReviewCycleList .caption .label:before, #DivCompReviewCycleList .caption .label:before {
    content: "";
    position: absolute;
    left: 0;
    border-top: 9px solid transparent;
    border-bottom: 9px solid transparent;
    border-right: 9px solid transparent;
    bottom: 0px;
    border-left: 9px solid #fff;
}

#DivGoalReviewCycleList .caption .label, #DivCompReviewCycleList .caption .label {
    font-style: italic;
    padding: .25em 1.4em;
    text-shadow: 0 0 2px rgb(0 0 0 / 30%);
    font-family: 'Rubik';
    font-weight: 500;
    letter-spacing: 0.5px;
}

.ellipes-line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    /*white-space: nowrap;*/
    text-overflow: ellipsis;
}

.ellipes-line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    /*white-space: nowrap;*/
    text-overflow: ellipsis;
}

.ellipes-line-clamp-1 {
    display: -webkit-box;
    -webkit-line-clamp: 1 !important;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    /*white-space: nowrap;*/
    text-overflow: ellipsis;
}

/*-----------Travel Track-----------*/

.Travel-track {
    margin-top: 2rem;
    padding: 0 1rem;
    padding-top: 2.5rem;
    display: flex;
    flex-direction: column;
}

.Travel-track-step {
    display: flex;
    height: 100%;
    width: 100%;
}

.Travel-track-text {
    width: 100%;
}

.Travel-track-step:last-child {
    overflow: hidden;
    /* height: 4rem; */
}

    .Travel-track-step:last-child .Travel-track-status span:last-of-type {
        display: none;
    }

.Travel-track-status {
    margin-right: 6rem;
    position: relative;
}

.Travel-track-status-dot {
    display: block;
    border-radius: 4px;
    padding: 3px 10px;
    color: #fff;
    font-size: 14px;
    background: #f05a00;
    width: 130px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    text-align: center;
}

.Travel-track-status-line {
    display: block;
    margin: 0 auto;
    width: 2px;
    height: 100%;
    background: #f05a00;
}

.Travel-track-text-stat {
    font-size: 1.3rem;
    font-weight: 500;
    margin-bottom: 3px;
}

.Travel-track-text-sub {
    font-size: 1rem;
    font-weight: 300;
}

.Travel-track {
    transition: all 0.3s height 0.3s;
    transform-origin: top center;
}

    .Travel-track .card .card-header h3 > span {
        min-height: 28px;
        min-width: 28px;
        border: 1px solid #ddd;
        background: #ffffff;
        display: inline-flex;
        border-radius: 50%;
        align-items: center;
        justify-content: center;
    }

    .Travel-track .card .card-header > span {
        padding: 4px 6px 10px 6px !important;
    }

    .Travel-track .card-header, .Travel-track .card-footer {
        /* background: rgba(0,0,0,.03); */
        background: #e0e0f8;
    }

    .Travel-track .card .card-header > span > i {
        text-shadow: none;
        font-weight: 600;
        position: relative;
        top: 0px;
    }

    .Travel-track .card .card-header > span::after {
        border-top: 15px solid transparent;
        border-bottom: 8px solid #fff;
        border-right: 14px solid transparent;
        border-left: 15px solid transparent;
    }

.dl-horizontal dd {
    margin-left: 174px !important;
}

.hrS-btn-group-2 .btn:hover {
    color: #fff;
    background-color: #0c56d0 !important;
    -webkit-box-shadow: 0 4px 10px 0 rgb(0 0 0 / 20%), 0 4px 20px 0 rgb(0 0 0 / 10%) !important;
    box-shadow: 0 4px 10px 0 rgb(0 0 0 / 20%), 0 4px 20px 0 rgb(0 0 0 / 10%) !important;
    border: 1px solid transparent;
}

.hrS-btn-group-2 > .btn:first-child:not(:last-child):not(.dropdown-toggle) {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

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

.ov-h {
    overflow: hidden;
}

.hrS-vertical-rl {
    font-size: 16px;
    font-family: 'Rubik';
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: #3f51b5;
    font-weight: 500;
    padding: 15px;
}

.hrS-trg-top {
    /*position:relative;*/
}

    .hrS-trg-top:after {
        content: "";
        background: #e0e4ff;
        height: calc(100% - 15px);
        width: 8px;
        position: absolute;
        left: -8px;
        bottom: 10px;
        z-index: 1;
    }

    .hrS-trg-top:before {
        content: "";
        width: 0px;
        height: 0px;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-bottom: 10px solid #e0e4ff;
        position: absolute;
        left: -14.5px;
        top: 0px;
        z-index: 1;
    }

.hrS-trg-bottom:after {
    content: "";
    background: #e0e4ff;
    width: calc(100% - 3%);
    height: 8px;
    position: absolute;
    right: 13px;
    bottom: -6px;
}

.hrS-trg-bottom:before {
    content: "";
    width: 0px;
    height: 0px;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 10px solid #e0e4ff;
    position: absolute;
    right: 3px;
    bottom: -12px;
    z-index: 1;
}

.hrS-CandSumMenu {
    display: flex;
    flex-wrap: wrap;
}

    .hrS-CandSumMenu div {
        flex: 1;
    }

        .hrS-CandSumMenu div:last-child {
            border: none !important;
        }

#tblPositionMappingList .select-checkbox {
    width: auto !important;
    text-align: -webkit-center;
    text-align: center;
}

#tblPositionMappingList tr.selected td.select-checkbox:after,
#tblPositionMappingList tr.selected th.select-checkbox:after {
    margin-top: -13px;
    margin-left: -5px;
}

#tblPositionMappingList tbody td.select-checkbox:before,
#tblPositionMappingList tbody th.select-checkbox:before {
    top: 1.9em !important;
}

#tblPositionMappingList #tbodyPositionMapping tr.selected, #tblPositionMappingList thead tr th.selected {
    transform: initial !important;
}

/*-------ev-candidate-dashboard---------*/
.ev-candidate__profile {
    border: 1px solid rgba(0,0,0,.08);
    box-shadow: rgb(99 99 99 / 30%) 2px 2px 6px 0px;
    margin-bottom: 15px;
    position: relative;
    padding: 1.5rem;
    display: block;
    border-radius: 0.5rem;
    background: #fff;
}

.ev-candidate-dashboard .card {
    box-shadow: rgb(99 99 99 / 30%) 2px 2px 6px 0px;
    border-radius: 0.5rem;
}

.ev-candidate__profile .ev-candidate__profile--grid {
    display: grid !important;
    grid-template-columns: 12% 70% 22%;
    position: relative;
}

.ev-candidate__profile .ev-candidate__profile-btn {
    position: absolute;
    top: 0px;
    right: 0px;
}

.ev-candidate__profile--img {
    height: 120px;
    width: 120px;
    border-radius: 50%;
    border: 3px solid #ededed;
    position: relative;
    background: #eee;
}

.ev-candidate__onBoardMsg--circle {
    height: 120px;
    width: 120px;
    border-radius: 50%;
    border: 3px solid #e3e4f8;
    position: relative;
    background: #e3e4f8;
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-box-shadow: 3px 3px 8px #d2d5de, -3px -3px 8px #fff;
    box-shadow: 3px 3px 8px #d2d5de, -3px -3px 8px #fff;
}

.ev-candidate-dashboard__myGrid--circle {
    height: 100px;
    width: 100px;
    border-radius: 50%;
    border: 5px solid #e3e4f8;
    position: relative;
    background: #4e54c8;
    background: -webkit-linear-gradient(to left, #6269f0, #4e54c8);
    background: linear-gradient(to left, #6269f0, #4e54c8);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.2s linear;
}

.ev-candidate-dashboard .card-title {
    font-size: 18px;
    font-family: Rubik,sans-serif !important;
    font-weight: 500;
    color: #777;
}

.ev-candidate-dashboard__myGrid .card:hover .ev-candidate-dashboard__myGrid--circle {
    border: 8px solid #e3e4f8;
}

.ev-candidate__profile--img:before {
    content: "";
    height: 30px;
    width: 30px;
    border-radius: 50%;
    border: 3px solid #fff;
    background: green;
    position: absolute;
    bottom: 0;
    left: 0;
}

.ev-candidate__profile--socMedia {
    display: flex;
    align-items: center;
}

    .ev-candidate__profile--socMedia a {
        height: 20px;
        width: 20px;
        border-radius: 50%;
        box-shadow: 0 1px 3px rgb(0 0 0 / 30%);
        background: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-right: 15px;
        font-size: 12px;
        color: var(--theme-secondary);
    }

.ev-candidate__profile--details-mainList, .ev-candidate__profile--details-commList {
    margin-bottom: 10px;
    font-size: 14px;
}

.ev-candidate__profile--details-commList {
    font-size: 13px;
    color: #777;
}

    .ev-candidate__profile--details-commList span > b {
        color: #000;
        margin-right: 5px;
        font-size: 16px;
    }

.ev-candidate__profile--details-mainList span i {
    margin-right: 5px;
    color: var(--theme-secondary);
}

.ev-candidate__profile--details-mainList span, .ev-candidate__profile--details-commList span {
    margin-right: 40px;
}

.ev-candidate-dashboard .progress {
    position: relative;
    margin: 4px;
    float: left;
    text-align: center;
    box-shadow: none;
    height: auto;
    border-radius: 0;
    background: none;
}

.ev-candidate-dashboard .barOverflow { /* Wraps the rotating .bar */
    position: relative;
    overflow: hidden; /* Comment this line to understand the trick */
    width: 130px;
    height: 65px; /* Half circle (overflow) */
    margin-bottom: -20px; /* bring the numbers up */
}

.ev-candidate-dashboard .bar {
    position: absolute;
    top: 0;
    left: 0;
    width: 130px;
    height: 130px;
    border-radius: 50%;
    box-sizing: border-box;
    border: 10px solid #eee;
    border-bottom-color: var(--theme-secondary);
    border-right-color: var(--theme-secondary);
    transition: 0.5s linear;
    transition-delay: 2s;
}

.ev-candidate__onBoardMsg--tab .nav-tabs > li:after {
    margin: 0;
    height: 1px;
    background: #7d73d8;
    transform-origin: left;
}

.ev-candidate__onBoardMsg--tab .tab-content {
    /*background: #4e54c8; 
    background: -webkit-linear-gradient(to left, #6269f0, #4e54c8);
    background: linear-gradient(to left, #6269f0, #4e54c8);*/
    /*background:url(/Images/artwork-bg.png);
    background-size:cover;*/
}

.ev-candidate__onBoardMsg--tab .nav-tabs > li.active > a {
    color: #fff !important;
    background: #4e54c8; /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #8f94fb, #4e54c8); /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #8f94fb, #4e54c8); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    margin-right: 0;
}

    .ev-candidate__onBoardMsg--tab .nav-tabs > li.active > a:hover {
        background: -webkit-linear-gradient(to left, #8f94fb, #4e54c8) !important; /* Chrome 10-25, Safari 5.1-6 */
        background: linear-gradient(to left, #8f94fb, #4e54c8) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    }

.ev-candidate__onBoardMsg--tab .nav.nav-tabs {
    background: url(/Images/artwork-bg.png);
    background-size: cover;
    background-position: 0 96%;
}

.ev-candidate__onBoardMsg--tab .nav-tabs > li > a {
    color: #5b61d2;
    transition: 0.2s linear;
    margin-right: 0;
}

.ev-candidate__onBoardMsg--tab .tab-content .hrS-btn-outline-primary {
    color: #4e54c8;
    border-color: #4e54c8;
}

.ev-candidate__onBoardMsg--task .card-body {
    flex-direction: column;
    background: url(/Images/artwork-bg.png);
    background-size: cover;
    background-position: right;
}

.ev-candidate__onBoardMsg--myColleagues .card-body {
    background: url(/Images/artwork-bg.png);
    background-size: cover;
    background-position: right;
    padding-top: 60px;
    padding-bottom: 60px;
    padding-left: 100px;
    padding-right: 100px;
}

.ev-candidate__onBoardMsg--myColleagues {
}

.ev-candidate__myColleagues {
    box-shadow: 0 7px 20px 0 rgb(191 200 228 / 44%);
    background: #fff;
    position: relative;
    border-radius: 50%;
    text-align: center;
    border: 1px solid #c8c5ed;
    margin: 5px;
    padding: 2px;
}

    .ev-candidate__myColleagues > img {
        width: 50px;
        height: 50px;
        border-radius: 50%;
    }

.ev-candidate-dashboard__myTeam--card {
    box-shadow: 0 7px 20px 0 rgba(191,200,228,0.44);
    padding: 1rem;
    position: relative;
    border-radius: 12px;
    text-align: center;
    /*flex: 1;*/
    min-width: 150px;
    margin-left: 15px;
    margin-right: 15px;
}

.ev-candidate-dashboard__myTeam .ev-candidate-dashboard__myTeam--card:first-child {
    margin-left: 0;
}

.ev-candidate-dashboard__myTeam .ev-candidate-dashboard__myTeam--card:last-child {
    margin-right: 0;
}

.ev-candidate-dashboard__myTeam--card-img i {
    font-size: 50px;
    color: #5157d6;
}

.ev-candidate-dashboard__myTeam--card h3 {
    font-size: 14px;
    color: #333;
    font-family: Rubik,sans-serif !important;
    font-weight: 500;
    margin-bottom: 0;
}

.ev-candidate-dashboard__myTeam {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    overflow: auto;
    padding-bottom: 15px;
    padding-top: 5px;
    padding-left: 5px;
    padding-right: 5px;
}
    /* width */
    .ev-candidate-dashboard__myTeam::-webkit-scrollbar {
        width: 5px;
        height: 5px;
    }

    /* Track */
    .ev-candidate-dashboard__myTeam::-webkit-scrollbar-track {
        box-shadow: inset 0 0 5px grey;
        border-radius: 10px;
    }

    /* Handle */
    .ev-candidate-dashboard__myTeam::-webkit-scrollbar-thumb {
        background: #765cc6;
        border-radius: 10px;
    }

        /* Handle on hover */
        .ev-candidate-dashboard__myTeam::-webkit-scrollbar-thumb:hover {
            background: #5f44b1;
        }

.mx-auto {
    margin-left: auto;
    margin-right: auto;
}

.ev-candidate-dashboard__myGrid {
    display: grid !important;
    grid-template-columns: 48.5% 48.5%;
    grid-gap: 15px;
    height: 100%;
}

/*
*
* ==========================================
* CUSTOM UTIL CLASSES
* ==========================================
*
*/

.ev-candidate-dashboard .card {
    height: 100%;
}

canvas.confetti {
    position: absolute;
    z-index: 1;
    pointer-events: none;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.joiningDetails__progress {
    width: 130px;
    height: 130px;
    background: none;
    position: relative;
    margin: auto;
}

    .joiningDetails__progress::after {
        content: "";
        width: 100%;
        height: 100%;
        border-radius: 50%;
        border: 8px solid #eee;
        position: absolute;
        top: 0;
        left: 0;
    }

    .joiningDetails__progress > span {
        width: 50%;
        height: 100%;
        overflow: hidden;
        position: absolute;
        top: 0;
        z-index: 1;
    }

    .joiningDetails__progress .progress-left {
        left: 0;
    }

    .joiningDetails__progress .progress-bar2 {
        width: 100%;
        height: 100%;
        background: none;
        border-width: 8px;
        border-style: solid;
        position: absolute;
        top: 0;
    }

    .joiningDetails__progress .progress-left .progress-bar2 {
        left: 100%;
        border-top-right-radius: 80px;
        border-bottom-right-radius: 80px;
        border-left: 0;
        -webkit-transform-origin: center left;
        transform-origin: center left;
        border-color: var(--theme-secondary);
        border-width: 8px;
    }

    .joiningDetails__progress .progress-right {
        right: 0;
    }

        .joiningDetails__progress .progress-right .progress-bar2 {
            left: -101%;
            border-top-left-radius: 80px;
            border-bottom-left-radius: 80px;
            border-right: 0;
            -webkit-transform-origin: center right;
            transform-origin: center right;
            border-color: var(--theme-secondary);
            border-width: 8px;
        }

    .joiningDetails__progress .progress-value {
        position: absolute;
        top: 0;
        left: 0;
    }

.ev-candidate__detailsList {
    padding-left: 15px;
}

    .ev-candidate__detailsList .ev-candidate__detailsList-items {
        box-shadow: 0 2px 6px 0 rgb(191 200 228 / 60%);
        padding: 1rem;
        position: relative;
        border-radius: 4px;
        margin-bottom: 20px;
        border: 1px solid #eee;
        font-size: 16px;
        font-family: 'Rubik';
        transition: 0.2s linear;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        display: block;
        color: #333;
    }

        .ev-candidate__detailsList .ev-candidate__detailsList-items:hover:nth-child(1) {
            background: #edeaff;
        }

        .ev-candidate__detailsList .ev-candidate__detailsList-items:hover:nth-child(2) {
            background: #ffeaf1;
        }

        .ev-candidate__detailsList .ev-candidate__detailsList-items:hover:nth-child(3) {
            background: #d5fffb;
        }

        .ev-candidate__detailsList .ev-candidate__detailsList-items:hover:nth-child(4) {
            background: #fef0db;
        }

        .ev-candidate__detailsList .ev-candidate__detailsList-items:last-child {
            margin-bottom: 0px;
        }

        .ev-candidate__detailsList .ev-candidate__detailsList-items > i {
            margin-right: 5px;
        }

.badge-2 {
    padding: 3px 8px;
    border-radius: 4px;
    background: #e7ebef;
    line-height: 1.3;
}
/*Colors bg & text*/
.bg-label-success {
    background-color: #dff9ec !important;
    color: #1a8e54 !important;
}

.bg-label-danger {
    background-color: #ffe5e5 !important;
    color: #ea4748 !important;
}

.bg-label-primary {
    background-color: #e5edfc !important;
    color: #4276d7 !important;
}

.bg-label-instagram {
    background-color: #fadee7 !important;
    color: #e1306c !important;
}

.bg-label-dark {
    background-color: #e2e4e6 !important;
    color: #495563 !important;
}


@import url("https://fonts.googleapis.com/css?family=Rubik:400,400i,500,500i,700,700i&display=swap");
@import url("https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,500,500i,700,700i,900&display=swap");

#mainnavbar.navbar .page-head {
    box-shadow: none !important;
    background: transparent !important;
    padding-top: 5px;
}

.page-breadcrumb ol.breadcrumb li a {
    color: #516377;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.2px;
    font-family: Rubik,sans-serif !important;
}

.breadcrumb > li + li:before, .page-breadcrumb ol.breadcrumb li.active {
    color: #516377;
}

.gap-10 {
    grid-gap: 10px;
}

.ev-fieldset {
    padding: 20px;
    border-radius: 4px;
    border: 1px solid #eee;
}

    .ev-fieldset legend {
        display: flex;
        width: auto;
        padding: 8px 20px;
        border: 1px dashed #eee;
        border-radius: 4px;
        margin-bottom: 0;
    }

select {
    appearance: none;
    background: white;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16px' height='16px' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6.1018 8C5.02785 8 4.45387 9.2649 5.16108 10.0731L10.6829 16.3838C11.3801 17.1806 12.6197 17.1806 13.3169 16.3838L18.8388 10.0731C19.5459 9.2649 18.972 8 17.898 8H6.1018Z' fill='%23212121'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 0.5rem center !important;
}

/* Attandance timesheet */
.hrS-btn-outline-primary.btn-selected {
    background: #1266f1 !important;
}

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

.timesheet__input-group {
    display: flex;
    align-items: center;
    grid-gap: 15px;
}

    .timesheet__input-group .control-label {
        flex-shrink: 0;
        padding: 0;
    }

    .timesheet__input-group .input-group {
        width: 100%;
    }

.timesheet__input-group-wrapper {
    display: flex;
    align-items: center;
    gap: 20px;
}

.emp-timesheet .shortprofilebtn {
    padding-inline: 15px;
    cursor: pointer;
}

.emp-timesheet .btn-group-2:has(.hrS-btn-outline-primary:last-child[style*="display: none"])
.hrS-btn-outline-primary:nth-last-child(2) {
    border-right: 1px solid #1266f1 !important;
}


.emp-timesheet .time-sheet-tooltip {
    padding: 0;
}

.emp-timesheet .dropdown-menu li a {
    font-size: 12px;
}

    .emp-timesheet .dropdown-menu li a i {
        font-size: 12px;
        margin-right: 10px;
        padding-right: 10px;
        border-right: 1px solid #eee;
    }

.emp-timesheet .emp-timesheet__legends-wrapper {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 12px;
    background: ghostwhite;
}

    .emp-timesheet .emp-timesheet__legends-wrapper * {
        margin: 0;
    }

.emp-timesheet .emp-timesheet__legends-title {
    font-size: 14px;
}

.emp-timesheet__legends-content {
    display: flex;
    grid-gap: 6px;
    align-items: center;
}

.emp-timesheet__legends-label {
    font-size: 14px;
}

.emp-timesheet__legends-box {
    height: 18px;
    width: 18px;
    display: inline-block;
    border-radius:100px;
}

@media (min-width:767px) {
    .modal-dialog {
        margin-top:50px;
    }
}
/*-----------Normal Basic table UIdesign  End Jwala-------------*/
.reminder-widget ul {
    display: flex;
    flex-direction: column;
    grid-gap: 10px;
    font-family: Rubik, sans-serif !important;
}

    .reminder-widget ul li {
    }

.reminder-widget .reminder-content {
    display: flex;
    grid-gap: 15px;
    align-items: center;
}

.reminder-widget .reminder-content__text {
    font-size: 14px;
    color: #333;
}

.reminder-widget .reminder-content__count {
    font-size: 16px;
    font-weight: 500;
    width: 65px;
    border-radius: 22px;
    display: grid;
    place-content: center;
    background-color: #3F51B5;
    color: white;
    flex-shrink: 0;
}

.reminder-widget .reminder-content__img > img {
    height: 45px !important;
    width: 45px !important;
    border-radius: 2px;
    object-fit: cover;
    margin-right: 0 !important;
}

.reminder-widget ul li > a {
    padding: 4px;
    display: flex;
    grid-gap: 10px;
    justify-content: space-between;
    border: 2px solid #e2e5f3 !important;
    background: #e5e8f8 !important;
    border-top-right-radius: 50px !important;
    border-bottom-right-radius: 50px !important;
    /*box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.15);*/
}

    .reminder-widget ul li > a:hover {
        background: #eceefb !important;
        cursor: pointer;
        border-color: #e7e8f3 !important;
    }

.boarding-details-card {
    width: 70%;
    margin: 50px auto;
    font-family: Roboto,sans-serif !important;
    padding: 20px;
    background: #fff;
    /*flex-direction: column;*/
    border: 0 !important;
    border-radius: 10px;
    box-shadow: 0px 1px 50px rgba(0, 0, 0, 0.05) !important;
}

    .boarding-details-card legend {
        width: auto;
        background: #fff;
        padding: 5px 20px;
        border-radius: 50px;
        font-size: 20px;
        box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.1);
    }

    .boarding-details-card label {
        font-size: 14px;
        margin-bottom: 8px;
    }

        .boarding-details-card label.bold {
            font-weight: 500 !important;
        }

.boarding-details-row {
    display: flex;
}

.boarding-details-lfs {
    flex-basis: 15%;
    text-align: center;
    border-right: 1px dashed #ddd;
    padding-right: 20px;
    /*margin-right:20px;*/
    display: flex;
    align-items: center;
    grid-gap: 20px;
}

.boarding-details-detail-list {
    font-size: 14px;
}

.boarding-details-rfs {
    flex-basis: 85%;
    display: flex;
}

.boarding-details-img {
    background: #fff;
    border: 1px solid #eee;
    padding: 8px;
    border-radius: 4px;
    height: 100%;
    width: 140px;
    object-fit: contain;
    object-position: center;
}

.boarding-details-detail-list ul {
    list-style: none;
    text-align: left;
    display: flex;
    gap: 10px;
    padding: 0;
}

    .boarding-details-detail-list ul li:first-child {
        font-weight: 500;
        background: #eee;
        padding: 2px 10px;
        border-radius: 2px;
    }

.page-horizontal-bar .navbar .logo-box {
    display: flex;
    align-items: center;
}

    .page-horizontal-bar .navbar .logo-box img {
        margin-bottom: 0;
    }

@media (min-width:320px) and (max-width:767px) {
    .boarding-details-row {
        flex-direction: column;
    }

    .boarding-details-card legend {
        margin-bottom: 5px;
    }

    .boarding-details-card {
        width: 100%;
        margin: 0px auto;
    }

    .boarding-details-rfs {
        flex-basis: 100%;
        flex-direction: column;
    }

    .boarding-details-lfs {
        flex-direction: column;
        border-right: 0;
        padding-right: 0;
        padding-bottom: 20px;
        margin-bottom: 20px;
        border-bottom: 1px dashed #ddd;
    }

    .boarding-details-detail-list ul {
        gap: 6px;
        padding: 0;
        flex-direction: column;
    }

    .ev-candidate-dashboard .card {
        height: 100% !important;
    }

    .ev-candidate__onBoardMsg--tab .card-body .text-right {
        position: relative !important;
    }

    .ev-candidate__detailsList {
        margin-top: 20px;
    }

    .ev-candidate__onBoardMsg--myColleagues .card-body {
        padding-top: 40px;
        padding-bottom: 40px;
        padding-left: 20px;
        padding-right: 20px;
    }

    .mbl-flex-d-column {
        flex-direction: column;
    }

    .ev-candidate__onBoardMsg--joiningDetails > .row {
        flex-direction: column;
    }

        .ev-candidate__onBoardMsg--joiningDetails > .row > .col-md-7.border-right {
            border: none;
            margin-bottom: 20px;
        }

    .ev-candidate__detailsList {
        padding-left: 0px;
    }

    .ev-candidate__profile > .d-flex {
        flex-direction: column;
        text-align: center;
    }

    .ev-candidate__profile .ev-candidate__profile--grid {
        grid-template-columns: 100%;
        position: relative;
        text-align: center;
    }

    .ev-candidate__profile--details h2 {
        margin-top: 10px !important;
    }

    .ev-candidate__profile--details-mainList {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }

        .ev-candidate__profile--details-mainList span {
            margin-bottom: 10px;
        }

        .ev-candidate__profile--details-mainList span, .ev-candidate__profile--details-commList span {
            margin-right: 0px;
        }

    .ev-candidate__profile--socMedia {
        justify-content: center;
        margin-bottom: 15px;
    }

    .hrS-CandSumMenu div {
        flex: 0 0 50%;
    }

    /*.hrS-table-style2 .ui-jqgrid .ui-jqgrid-htable th {
        white-space: nowrap;
    }*/

    .Travel-track-status {
        margin-right: 1rem;
        position: relative;
    }

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

    .can-dash-card .card-body {
        padding: 15px;
    }

    .can-dash-card {
        height: auto !important;
    }

    .hrS-matrix-view .mtx-inner {
        padding: 15px;
        margin: 0;
        margin-bottom: 15px;
    }

    .hrS-matrix-view table tbody tr td {
        width: 100%;
        display: table;
    }

    .hrS-table-style2 .ui-jqgrid, .hrS-table-style2 .ui-jqgrid .ui-jqgrid-view, .hrS-table-style2 .ui-jqgrid-hdiv .ui-jqgrid-htable, .hrS-table-style2 .ui-jqgrid .ui-jqgrid-hdiv, .hrS-table-style2 .ui-jqgrid .ui-jqgrid-bdiv, .hrS-table-style2 .ui-jqgrid .ui-jqgrid-pager {
        /*width: min-content !important;*/
        overflow: auto !important;
    }

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

    .hrS-table-style2 .ui-jqgrid .ui-jqgrid-pager > .ui-pager-control {
        padding-top: 4px;
    }

    .hrS-table-style2 .ui-jqgrid .ui-paging-info {
        height: 16px;
        margin-top: 8px;
        margin-right: 8px;
    }

    .mt-xs-4 {
        margin-top: 15px !important;
    }
    /*.hrS-table-style2 .ui-jqgrid .ui-jqgrid-view {
            width: 100% !important;
        }

    .hrS-table-style2 .ui-jqgrid-hdiv .ui-jqgrid-htable {
        width: 100% !important;
    }

    .hrS-table-style2 .ui-jqgrid .ui-jqgrid-hdiv {
        width: 100% !important;
    }

    .hrS-table-style2 .ui-jqgrid .ui-jqgrid-bdiv {
        width: 100% !important;
    }

    .hrS-table-style2 .ui-jqgrid .ui-jqgrid-pager {
        width: 100% !important;
    }*/
}

@media (min-width: 1024px) and (max-width:1440px) {
    .modal-xl {
        max-width: 1140px;
        width:100%;
    }

    .ev-candidate-dashboard__myGrid--circle {
        height: 80px;
        width: 80px;
    }

        .ev-candidate-dashboard__myGrid--circle > img, .ev-candidate-dashboard__myGrid--circle > i {
            height: 40px;
            width: 40px;
            font-size: 30px !important;
            display: flex;
            align-items: center;
            justify-content: center;
        }

    .ev-candidate-dashboard .card-title {
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }

    .ev-candidate__onBoardMsg--circle {
        height: 100px;
        width: 100px;
    }

        .ev-candidate__onBoardMsg--circle > h3 {
            font-size: 3.5em;
        }

    .ev-candidate__onBoardMsg--task .hrS-btn {
        font-size: 10px;
    }

    .ev-candidate__profile .ev-candidate__profile-btn {
        top: -5px;
        right: -5px;
    }

    .ev-candidate__profile--details-mainList, .ev-candidate__profile--details-commList {
        margin-bottom: 10px;
        font-size: 13px;
    }

    .ev-candidate__profile--details > h2 {
        font-size: 18px;
    }

    .ev-candidate__profile--img {
        height: 90px;
        width: 90px;
    }

    .ev-candidate__profile .ev-candidate__profile--grid {
        grid-template-columns: 14% 70% 16%;
    }

    .ev-candidate-dashboard .barOverflow {
        width: 100px;
        margin-bottom: -40px;
    }

    .ev-candidate-dashboard .bar {
        width: 100px;
        height: 100px;
    }
}

@media (min-width: 1200px) {
    .modal-xl {
        max-width: 1140px;
        width:100%;
    }
}

@media only screen and (max-width:768px) {
    .mbl-pLR8 {
        padding-left: 8px;
        padding-right: 8px;
    }

    .ev-fieldset {
        padding: 10px;
        margin-inline: 0;
    }

        .ev-fieldset legend {
            padding: 8px 10px;
        }

    .page-footer .no-s {
        font-size: 12px !important;
    }
}

.fw-400 {
    font-weight: 400 !important;
}

.fw-500 {
    font-weight: 500 !important;
}

.fw-600 {
    font-weight: 600 !important;
}

.-listDropdown {
    left: auto;
    right: -6px;
    padding: 10px;
    padding-bottom: 5px;
    margin-top: 10px;
    border-radius: 6px;
}

    .-listDropdown:before {
        left: auto;
        right: 8px;
    }

    .-listDropdown:after {
        left: auto;
        right: 10px;
    }

    .-listDropdown .extra-paddingleft {
        padding-left: 26px !important;
    }

    .-listDropdown label {
        margin-bottom: 8px;
    }

    .-listDropdown.-noP {
        padding-bottom: 10px;
    }

        .-listDropdown.-noP li {
            padding-left: 6px !important;
            font-weight: 500;
            line-height: 1.7;
        }

            .-listDropdown.-noP li:hover {
                opacity: 0.8;
            }

.ev-salaryTable tr:hover {
    background: #f0f8ff91;
}

.noWrap {
    white-space: nowrap;
}

.lh-normal {
    line-height: normal;
}

/* Custom css */
@media (min-width: 992px) {
    html .container {
        max-width: 970px;
        width: 100%;
    }
}

@media (min-width: 1200px) {
    html .container {
        max-width: 1150px;
        width: 100%;
    }
}

@media (min-width: 1280px) {
    html .container {
        max-width: 1250px;
        width: 100%;
    }
}

@media (min-width: 1366px) {
    html .container {
        max-width: 1300px;
        width: 100%;
    }
}

@media (min-width: 1400px) {
    html .container {
        max-width: 1350px;
        width: 100%;
    }
}

@media (min-width: 1500px) {
    html .container {
        max-width: 1450px;
        width: 100%;
    }
}

@media (min-width: 1600px) {
    html .container {
        max-width: 1550px;
        width: 100%;
    }
}

@media (min-width: 1900px) {
    html .container {
        max-width: 1850px;
        width: 100%;
    }
}