/* Table of content
-----------------------------------------------
1. Main Style
2. Role Screen
3. Custom Select
4. Time Picker
5. Custom Tooltip 
6. Employee screen

/*--------------------------------------------------------------
1.  Main Style
--------------------------------------------------------------*/

@import url("header.css");
@import url("font.css");
@import url("goalIcons.css");

body {
    margin-bottom: 50px;
    background: #f0f0f0
}

.main-body {
    min-width: 1024px !important;
    width: 100%;
    min-height: 100%;
    position: relative;
    margin-top: -15px;
    padding-top: 15px;
    min-height: calc(100vh - 93px) !important;
}

a:hover, a:focus, select:focus, input:focus {
    text-decoration: none
}

ul {
    margin: 0
}

.btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus {
    outline: transparent;
    outline-offset: 0
}

button:focus, .button:hover {
    outline: transparent;
    outline-offset: 0
}
/*--- Global css changes----*/
.glb-header-outer > .glb-header-inner {
    border-color: #2196f3
}

.overflow-hidden {
    overflow: hidden
}

.overflow-auto {
    overflow: auto
}

.navbar {
    border: none;
    min-width: 1200px
}

.navbar-collapse {
    padding: 0
}

.validClass .form-control {
    border-color: #23a531 !important;
    box-shadow: none !important
}

.help-block {
    font-size: 11px;
    position: absolute;
    line-height: 24px;
    top: 100%;
    left: 0
}

.label {
    padding-left: 0px;
    font-size: 12px;
    color: rgba(112,131,161,.8)
}

.col-sm-6 > .label, .col-sm-7 > .label, .col-sm-12 > .label {
    padding-left: 15px
}

.glb-btn > button.btn.primary-button[disabled] {
    background: #5F1EBE
}

    .glb-btn > button.btn.primary-button[disabled]:hover {
        background: #5F1EBE
    }

.label > em {
    float: inherit;
    font-size: 100%;
    color: #7083a1;
    width: inherit
}

em {
    float: left;
    font-size: 13px;
    color: #375884;
    width: 100%
}

.checkbox {
    margin: 0;
    float: left
}

.cus-btn {
    margin-top: 20px
}
/*.dataTables_info{font-weight:400;color:rgba(55,88,132,.7)}*/
.no_bottomtPadding {
    padding-bottom: 0 !important
}

.glb-fltr-rt-box {
    padding-top: 50px
}

.glb-fltr-rt-header {
    padding: 24px 0px 0px 0;
    font-weight: 400
}

.glb-fltr-thead {
    padding: 15px;
    background: #5F1EBE;
    color: #fff;
    font-size: 16px;
    font-weight: 600
}

.filter-close {
    float: right;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    line-height: 25px;
    cursor: pointer
}

.glb-fltr-rt-outer {
    padding: 0 20px
}

.glb-fltr-btn {
    margin-top: 50px
}

.no_bottomMargin {
    margin-bottom: 0 !important
}

.sweet-alert {
    outline: none;
    -webkit-box-shadow: 0 5px 15px rgba(0,0,0,.5);
    box-shadow: 0 5px 15px rgba(0,0,0,.5)
}

.glb-alert-success {
    background: #6c9e31;
    left: 0;
}

.glb-alert-warning {
    background: #6c9e31;
    left: 0;
}

.glb-alert-failure {
    background: #6c9e31;
    left: 0;
}
/*---------------------------------------------------------------
2. Role Screen
-----------------------------------------------------------------*/

.all-role {
    width: 100%;
    display: inline-flex
}

    .all-role > .role {
        width: 600px;
        text-align: center;
        display: inline-block;
        margin: 0 auto
    }

.role-list {
    width: 100%;
    display: inline-block;
    padding: 10px 15px;
    background: rgba(255,255,255,.8);
    border-radius: 4px;
    box-sizing: border-box;
    text-align: left
}

    .role-list:nth-child(2) {
        margin-top: 15px
    }

.role h2 {
    font-size: 1.2rem;
    color: #444;
    padding-bottom: 10px;
    font-style: italic;
    border-bottom: 1px solid #d9d9d9;
    margin-top: 0;
    margin-bottom: 10px
}

.role-list li {
    list-style: none;
    padding-left: 25px;
    position: relative;
    line-height: 3rem;
    width: 50%;
    float: left;
    background: url(../images/act_list.png) left center no-repeat;
    background-size: 5%
}

    .role-list li a {
        color: #2196f3;
        text-decoration: none;
        font-weight: 400
    }

    .role-list li.pending {
        list-style: none;
        padding-left: 25px;
        position: relative;
        line-height: 3rem;
        width: 50%;
        float: left;
        background: url(../images/dis_list.png) left center no-repeat;
        background-size: 5%
    }

        .role-list li.pending a {
            color: #b2b2b3;
            cursor: not-allowed
        }

/*---------------------------------------------------------------
3. Custom Select
-----------------------------------------------------------------*/

.bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) {
    width: 100%
}

.bootstrap-select > .newBtn {
    background: transparent;
    width: 100%;
    border-bottom: 1px solid #c3ccd6 !important;
    padding: 5px 0;
    display: inline-block;
    margin-bottom: 0;
    font-weight: normal;
    text-align: center;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    white-space: nowrap;
    line-height: 1.42857143;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    overflow: hidden;
    position: relative;
    text-decoration: none;
    text-transform: capitalize;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -ms-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    border: none;
    float: left;
    padding-right: 30px
}

    .bootstrap-select > .newBtn:active {
        outline: none;
        box-shadow: none
    }

.bootstrap-select + .label {
    top: -15px
}

.btn-group.open .dropdown-toggle {
    box-shadow: none;
    background: transparent;
    text-transform: capitalize
}

.btn-default:active:hover, .btn-default.active:hover, .open > .dropdown-toggle.btn-default:hover, .btn-default:active:focus, .btn-default.active:focus, .open > .dropdown-toggle.btn-default:focus, .btn-default:active.focus, .btn-default.active.focus, .open > .dropdown-toggle.btn-default.focus {
    color: #000;
    background-color: transparent;
    border-color: #d9d9d9
}

.bootstrap-select.btn-group .dropdown-menu {
    box-sizing: border-box;
    max-height: 110px !important;
    margin: -1px 0 0 0 !important;
    border-color: #d9d9d9 !important;
    border-radius: 0 0 4px 4px !important
}

.bootstrap-select .dropdown-toggle:focus {
    outline: none !important;
    outline-offset: 0
}

.has-error .bootstrap-select .dropdown-toggle, .error .bootstrap-select .dropdown-toggle {
    border-color: red !important
}

.bootstrap-select > .dropdown-toggle.bs-placeholder, .bootstrap-select > .dropdown-toggle.bs-placeholder:hover, .bootstrap-select > .dropdown-toggle.bs-placeholder:focus, .bootstrap-select > .dropdown-toggle.bs-placeholder:active {
    background: transparent
}
/*.bootstrap-select.btn-group .dropdown-toggle .filter-option{color:#375884}*/

.bootstrap-select > .newBtn {
    border-bottom: 1px solid #e5e5e5 !important;
    border: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 0;
    padding-left: 0;
    font-size: 15px
}

/*---------------------------------------------------------------
4. Time Picker 
-----------------------------------------------------------------*/

.bootstrap-timepicker {
    position: relative
}

    .bootstrap-timepicker.pull-right .bootstrap-timepicker-widget.dropdown-menu {
        left: auto;
        right: 0
    }

        .bootstrap-timepicker.pull-right .bootstrap-timepicker-widget.dropdown-menu:before {
            left: auto;
            right: 12px
        }

        .bootstrap-timepicker.pull-right .bootstrap-timepicker-widget.dropdown-menu:after {
            left: auto;
            right: 13px
        }

    .bootstrap-timepicker .input-group-addon {
        cursor: pointer
    }

        .bootstrap-timepicker .input-group-addon i {
            display: inline-block;
            width: 16px;
            height: 16px
        }

.bootstrap-timepicker-widget.dropdown-menu {
    padding: 4px
}

    .bootstrap-timepicker-widget.dropdown-menu.open {
        display: inline-block
    }

    .bootstrap-timepicker-widget.dropdown-menu:before {
        border-bottom: 7px solid rgba(0, 0, 0, 0.2);
        border-left: 7px solid transparent;
        border-right: 7px solid transparent;
        content: "";
        display: inline-block;
        position: absolute
    }

    .bootstrap-timepicker-widget.dropdown-menu:after {
        border-bottom: 6px solid #FFFFFF;
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        content: "";
        display: inline-block;
        position: absolute
    }

.bootstrap-timepicker-widget.timepicker-orient-left:before {
    left: 6px
}

.bootstrap-timepicker-widget.timepicker-orient-left:after {
    left: 7px
}

.bootstrap-timepicker-widget.timepicker-orient-right:before {
    right: 6px
}

.bootstrap-timepicker-widget.timepicker-orient-right:after {
    right: 7px
}

.bootstrap-timepicker-widget.timepicker-orient-top:before {
    top: -7px
}

.bootstrap-timepicker-widget.timepicker-orient-top:after {
    top: -6px
}

.bootstrap-timepicker-widget.timepicker-orient-bottom:before {
    bottom: -7px;
    border-bottom: 0;
    border-top: 7px solid #999
}

.bootstrap-timepicker-widget.timepicker-orient-bottom:after {
    bottom: -6px;
    border-bottom: 0;
    border-top: 6px solid #ffffff
}

.bootstrap-timepicker-widget a.btn,
.bootstrap-timepicker-widget input {
    border-radius: 4px
}

.bootstrap-timepicker-widget table {
    width: 100%;
    margin: 0
}

    .bootstrap-timepicker-widget table td {
        text-align: center;
        height: 30px;
        margin: 0;
        padding: 2px
    }

        .bootstrap-timepicker-widget table td:not(.separator) {
            min-width: 30px
        }

        .bootstrap-timepicker-widget table td span {
            width: 100%
        }

        .bootstrap-timepicker-widget table td a {
            border: 1px transparent solid;
            width: 100%;
            display: inline-block;
            margin: 0;
            padding: 8px 0;
            outline: 0;
            color: #333
        }

            .bootstrap-timepicker-widget table td a:hover {
                text-decoration: none;
                background-color: #eee;
                -webkit-border-radius: 4px;
                -moz-border-radius: 4px;
                border-radius: 4px;
                border-color: #ddd
            }

            .bootstrap-timepicker-widget table td a i {
                margin-top: 2px;
                font-size: 18px
            }

        .bootstrap-timepicker-widget table td input {
            width: 25px;
            margin: 0;
            text-align: center
        }

.bootstrap-timepicker-widget .modal-content {
    padding: 4px
}

@media (min-width:767px) {
    .bootstrap-timepicker-widget.modal {
        width: 200px;
        margin-left: -100px
    }
}

@media (max-width:767px) {
    .bootstrap-timepicker {
        width: 100%
    }

        .bootstrap-timepicker .dropdown-menu {
            width: 100%
        }
}

/*---------------------------------------------------------------
5. Custom Tooltip 
-----------------------------------------------------------------*/

.elips {
    width: 75%;
    float: right;
    text-overflow: ellipsis
}

.elips-new {
    width: 55%
}

span.elips + .tooltip.in {
    opacity: 1 !important
}

span.elips + .tooltip.top .tooltip-inner {
    color: rgba(94,118,150,.8);
    text-align: left;
    box-shadow: 8px 8px 43px 9px rgba(137, 169, 175, 0.13);
    padding: 10px;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2);
    max-width: 200%;
    border-radius: 5px
}

span.elips + .tooltip.top .tooltip-arrow::before {
    position: absolute;
    top: -6px;
    right: -8px;
    border-right: 11px solid transparent;
    border-top: 11px solid rgba(0,0,0,.2);
    border-left: 11px solid transparent;
    border-bottom-color: rgba(0,0,0,.2);
    content: ''
}

span.elips + .tooltip.top .tooltip-arrow::after {
    position: absolute;
    top: -6px;
    right: -7px;
    display: inline-block;
    border-right: 10px solid transparent;
    border-top: 10px solid #fff;
    border-left: 10px solid transparent;
    content: ''
}

/*---------------------------------------------------------------
6. Employee screen
-----------------------------------------------------------------*/

.top-band {
    background: #fff;
    box-shadow: 0px 1px 5px rgba(0,0,0,.3);
    margin-top: -15px;
    margin-bottom: 20px;
    padding: 10px 15px;
    position: fixed;
    right: 0;
    left: 0;
    z-index: 8
}

.body-content {
    margin-top: 65px
}

.employee-content {
    margin-top: 105px
}

.my-goalView {
    margin-top: 35px
}

.breadcrumb-list {
    margin-bottom: 0;
    display: inline-block
}

    .breadcrumb-list > .breadcrumb-item {
        display: inline-block
    }

        .breadcrumb-list > .breadcrumb-item > a {
            color: #757575;
            transition: all .3s;
            position: relative;
            border-bottom: 1px solid transparent
        }

            .breadcrumb-list > .breadcrumb-item > a:hover {
                color: #2b99f0 !important;
                transition: all .3s;
                border-bottom: 1px solid
            }

            .breadcrumb-list > .breadcrumb-item > a > i {
                color: #2b99f0
            }

    .breadcrumb-list > .active {
        color: #000
    }

    .breadcrumb-list > li + li:before {
        padding: 0 3px;
        color: #565656;
        content: "/\00a0"
    }

.fy-year {
    float: right;
    color: #757575
}

    .fy-year ul {
        float: left;
    }

        .fy-year ul li {
            display: inline-block;
            margin-right: 10px
        }

ul.review-yr li {
    margin-right: 0
}

.fy-year ul li:nth-child(2) {
    border-left: 1px solid #757575;
    padding-right: 0
}

.fy-year ul li span.rev-date {
    position: relative
}

    .fy-year ul li span.rev-date select {
        width: 65%;
        border: none;
        text-overflow: ellipsis;
        white-space: nowrap;
        padding-right: 20px;
        height: inherit;
        font-size: 12px;
        color: #757575;
        font-weight: 600
    }

span.rev-date:after {
    top: 6px;
    right: 0px
}

.action-box {
    position: relative;
    float: left;
    z-index: 1
}

.search-box {
    float: left;
    width: 20px;
    height: 20px;
    cursor: pointer
}

.searchContainer {
    position: relative
}

.mainSearchIcon {
    cursor: pointer;
    font-size: 1rem;
    color: #818184;
    position: absolute;
    right: 6px;
    top: 3px
}

.searchBoxField {
    width: 100%;
    position: absolute;
    right: 0px;
    top: -5px;
    padding: 5px 25px 5px 10px;
    display: none;
    background: #fff;
    border: 1px solid #e7e7e7;
    float: left;
    height: 30px;
    border-radius: 10px;
    font-size: 11px
}

.mainHideIcon {
    cursor: pointer;
    font-size: .9rem;
    color: #818184;
    position: absolute;
    right: 6px;
    top: 3px;
    display: none
}

.rmDashboardTabs {
    margin: 45px 0 30px 0;
    position: relative
}

.emp-details {
    margin-top: 15px;
    float: left
}

.details-list {
    float: left
}

.emp-details li {
    color: #757575;
    line-height: 22px
}

    .emp-details li:nth-child(2) {
        margin-top: 10px
    }

    .emp-details li span.emp-curValue {
        color: #f18230 !important
    }

    .emp-details li:first-child {
        font-size: 1rem;
        color: #313234
    }

        .emp-details li:first-child span {
            color: #757575;
            line-height: 22px
        }

    .emp-details li a {
        color: #2d2d33;
        font-size: 1rem;
        border-bottom: 1px solid;
        position: relative;
        transition: all .3s
    }

.details-list li a:hover {
    color: #2b99f0;
    transition: all .3s;
    border-bottom: 1px solid
}

.emp-details li div.empGoal-weight {
    float: right
}

div.empGoal-weight {
    float: left;
    padding-left: 10px;
    width: 25%;
    position: relative
}

    div.empGoal-weight > .emp-goalWeight {
        font-size: 12px;
        color: #000;
        float: left;
        padding-right: 10px;
        font-weight: 600
    }

    div.empGoal-weight > .emp-goalValue {
        font-size: 24px;
        color: #757575;
        clear: both;
        display: block;
        padding-bottom: 5px
    }

.new-details {
    float: inherit;
    margin: 0
}

    .new-details ul li {
        float: left;
        padding: 0 10px;
        border-left: 1px solid #e7e7e7
    }

        .new-details ul li:first-child {
            padding-left: 0;
            border-left: 0px
        }

        .new-details ul li:nth-child(2) {
            margin-top: 0
        }

    .new-details li div.empGoal-weight {
        margin-top: 0;
        padding-left: 0
    }

        .new-details li div.empGoal-weight > .emp-goalValue {
            font-size: inherit;
            color: #757575;
            float: right
        }

.with-indicator {
    position: relative;
    z-index: 0;
    top: 0;
    right: inherit;
    text-align: center
}

    .with-indicator li {
        float: none;
        display: inline-block;
        padding: 0px 10px;
        transition: .5s
    }

        .with-indicator li a {
            padding: 10px 25px;
            background: #fff;
            border-radius: 5px;
            text-align: center;
            transition: .5s;
            font-size: 18px;
            color: #999999
        }

            .with-indicator li a span.goal-icons {
                font-weight: 900;
                padding-right: 8px
            }

        .with-indicator li.active > a {
            color: #fff !important;
            border-bottom: none !important;
            background: #338eff !important;
            transition: .5s
        }

        .with-indicator li.active:before {
            border: 13px solid transparent;
            border-top-color: #338eff;
            bottom: -25px;
            content: '';
            display: block;
            position: absolute;
            pointer-events: none;
            -webkit-transition: border-top-color .5s;
            transition: border-top-color .5s
        }

        .with-indicator li:nth-child(1).active:before {
            left: 52px
        }

        .with-indicator li:nth-child(2).active:before {
            left: 119px
        }

        .with-indicator li:nth-child(3).active:before {
            left: 75px
        }

    .with-indicator > li > a:hover, .with-indicator > li > a:focus {
        border-color: transparent;
        background-color: #338eff;
        color: #fff;
        transition: .5s
    }

.goal-tbl {
    border: none;
    background: transparent;
    table-layout: fixed
}

    .goal-tbl th {
        background: transparent;
        font-size: 12px;
        color: #787878;
        border-left: none !important
    }

    .goal-tbl thead tr {
        width: 100%;
        display: block;
        float: left
    }

        .goal-tbl thead tr th {
            width: 18%;
            float: left;
            font-weight: 400
        }

    .goal-tbl tbody td {
        width: 18%;
        font-size: 12px;
        color: #2d2d33;
        border: none !important;
        float: left;
        padding: 15px 8px !important;
        position: relative;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis
    }

        .goal-tbl tbody td:first-child {
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: visible;
        }

    .goal-tbl thead tr th:nth-child(3), .goal-tbl td:nth-child(3) {
        width: 34%
    }

    .goal-tbl thead tr th:nth-child(4), .goal-tbl thead tr th:nth-child(5), .goal-tbl thead tr th:nth-child(6), .goal-tbl td:nth-child(4), .goal-tbl td:nth-child(5), .goal-tbl td:nth-child(6) {
        width: 10%
    }

    .goal-tbl tbody tr {
        width: 100%;
        margin-bottom: 10px;
        background: #fff !important;
        border-radius: 4px;
        float: left;
        border: 1px solid #ececec;
        transition: all .3s;
        position: relative
    }

        .goal-tbl tbody tr.active-hover {
            z-index: 2
        }

        .goal-tbl tbody tr:hover {
            box-shadow: 0 2px 10px rgba(0,0,0,.2);
            transition: all .3s
        }

        .goal-tbl tbody tr:last-child {
            margin: 0
        }

.team-details {
    position: relative
}

.goal-tbl div.text-elips {
    height: 19px;
    overflow: hidden;
    transition: transfirm .5s;
    display: block !important;
    text-overflow: ellipsis
}

.goal-tbl div.slide-view {
    position: absolute;
    left: -6px;
    height: 36px;
    background: #0bbc95;
    padding: 13px 2px;
    top: 10px;
    border-radius: 5px;
    font-size: 8px;
    color: #fff;
    cursor: pointer
}

.icon-rotate {
    -moz-transition-duration: 0.6s;
    -o-transition-duration: 0.6s;
    -webkit-transition-duration: 0.6s;
    transition-duration: 0.6s;
    display: inline-block
}

.rotate {
    -moz-transform: rotate(-180deg);
    -ms-transform: rotate(-180deg);
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg)
}

.changeBack {
    background: #17a3cf !important
}

tr.custom-tr {
    border-top: none !important;
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
    width: 96% !important;
    margin: -10px 2% 10px 2% !important;
    display: none;
    transition: transform .5s !important;
    box-shadow: 3px 0 10px rgba(223,230,242,.6) !important;
    z-index: 1 !important
}

    tr.custom-tr:hover {
        box-shadow: 3px 0 10px rgba(223,230,242,.6) !important
    }

.active-hover {
    box-shadow: 0 2px 10px rgba(0,0,0,.2) !important
}

.goal-tbl tr td table.subGoal-table thead th:nth-child(2), .goal-tbl tr td table.subGoal-table tbody td:nth-child(2) {
    width: 46%
}

.goal-tbl tr td table.subGoal-table thead th:nth-child(3), .goal-tbl tr td table.subGoal-table tbody td:nth-child(3) {
    width: 13%
}

.goal-tbl tr td table.subGoal-table thead th, .goal-tbl tr td table.subGoal-table tbody td {
    padding: 0px 8px !important;
    width: 13.6%
}

.table-responsive > .emp-tbl > thead > tr > th, .table-responsive > .emp-tbl > tbody > tr > td {
    width: 7.5%
}

    .table-responsive > .emp-tbl > thead > tr > th:nth-child(3), .table-responsive > .emp-tbl > tbody > tr > td:nth-child(3), .table-responsive > .emp-tbl > thead > tr > th:nth-child(6), .table-responsive > .emp-tbl > tbody > tr > td:nth-child(6), .table-responsive > .emp-tbl > thead > tr > th:nth-child(7), .table-responsive > .emp-tbl > tbody > tr > td:nth-child(7), .table-responsive > .emp-tbl > thead > tr > th:nth-child(8), .table-responsive > .emp-tbl > tbody > tr > td:nth-child(8) {
        width: 13.7%
    }


.management-tbl th, .management-tbl td {
    width: 7% !important;
}

    .management-tbl th:nth-child(1), .management-tbl td:nth-child(1) {
        width: 4% !important
    }

    .management-tbl th:nth-child(2), .management-tbl td:nth-child(2) {
        width: 11% !important
    }

    .management-tbl th:nth-child(9), .management-tbl td:nth-child(9), .management-tbl th:nth-child(10), .management-tbl td:nth-child(10) {
        width: 10% !important
    }

    .management-tbl th:nth-child(4), .management-tbl td:nth-child(4) {
        width: 5% !important
    }

    .management-tbl th:nth-child(3), .management-tbl td:nth-child(3), .management-tbl th:nth-child(6), .management-tbl td:nth-child(6) {
        width: 11% !important
    }

    .management-tbl th:nth-child(7), .management-tbl td:nth-child(7) {
        width: 15% !important
    }

    .management-tbl th:nth-child(8), .management-tbl td:nth-child(8) {
        width: 9% !important
    }

.management-tbl thead tr th:nth-child(1), .management-tbl tbody tr td:nth-child(1), .management-tbl thead tr th:nth-child(2), .management-tbl tbody tr td:nth-child(2) {
    padding-left: 20px !important
}

.table-responsive > .dataTables_wrapper > .row > .col-xs-12 > .dataTables_filter {
    right: 65px;
    top: -66px
}

    .table-responsive > .dataTables_wrapper > .row > .col-xs-12 > .dataTables_filter > label > input.form-control {
        border: 1px solid #c5c5c5;
        width: 200px;
        padding: 10px 25px 10px 10px;
        border-radius: 50px;
        height: 32px;
        font-size: 12px
    }

.searhFilter {
    position: absolute;
    right: 9px;
    top: 4px;
    z-index: 5;
    cursor: pointer;
    color: #818184;
    font-size: 16px;
    border: none !important;
    background: transparent
}

.filter_page {
    float: left;
    margin-left: 5px;
    padding: 3px 0px 0px 0px
}

    .filter_page > span.filter_list {
        font-size: 1.2rem;
        color: #818184;
        padding: 0
    }

.per-card {
    margin-top: 20px
}

#pendingAction {
    margin-top: 15px
}

.card-thumbail {
    margin: 0;
    padding: 0;
    border: none;
    border-radius: 0
}

.goal-appraiser { /* Permalink - use to edit and share this gradient:http://colorzilla.com/gradient-editor/#44b3af+0,3f77c5+100 */
    background: #44b3af; /* Old browsers */
    background: -moz-linear-gradient(left, #44b3af 0%, #3f77c5 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #44b3af 0%,#3f77c5 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #44b3af 0%,#3f77c5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#44b3af', endColorstr='#3f77c5',GradientType=1 ); /* IE6-9 */
}

.reviewer-appraiser { /* Permalink - use to edit and share this gradient:http://colorzilla.com/gradient-editor/#3d88c5+0,8f7ab9+100 */
    background: #3d88c5; /* Old browsers */
    background: -moz-linear-gradient(left, #3d88c5 0%, #8f7ab9 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #3d88c5 0%,#8f7ab9 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #3d88c5 0%,#8f7ab9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3d88c5', endColorstr='#8f7ab9',GradientType=1 ); /* IE6-9 */
}

.l4head { /* Permalink - use to edit and share this gradient:http://colorzilla.com/gradient-editor/#f8a28d+0,ee808f+100 */
    background: #f8a28d; /* Old browsers */
    background: -moz-linear-gradient(left, #f8a28d 0%, #ee808f 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #f8a28d 0%,#ee808f 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #f8a28d 0%,#ee808f 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8a28d', endColorstr='#ee808f',GradientType=1 ); /* IE6-9 */
}

.team-header > .pending-icons {
    font-size: 35px;
    color: #f0f0f0
}

.team-header {
    width: 160px;
    float: left;
    position: relative;
    top: -15px;
    border-radius: 4px;
    padding: 30px 0;
    text-align: center
}
    /*.team-header .team-name{font-size:20px;color:#fff;margin-top:15px}*/
    .team-header .team-name {
        font-size: 15px;
        color: #fff;
        margin-top: 15px
    }

.team-caption {
    padding: 0 !important;
    float: left;
    width: calc(100% - 160px);
    background: #fff;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    box-shadow: 0 2px 10px rgba(0,0,0,.2)
}
    /*.team-caption ul{transition:all .5s;display:flex}
.team-caption li{width:132px;display:inline-grid;padding:6px 10px;border-left:1px solid #f1f1f1;border-bottom:none !important;cursor:pointer;float:left;transition:all .5s;text-align:center}*/
    .team-caption ul {
        transition: all .5s;
        display: table;
        width: 100%
    }

    .team-caption li {
        width: 1%;
        padding: 15px 10px;
        border-left: 1px solid #f1f1f1;
        border-bottom: none !important;
        cursor: pointer;
        transition: all .5s;
        text-align: center;
        display: table-cell;
        position: relative
    }

.reviewer li {
    width: 100%;
    padding: 37px 10px
}

/*.team-details .list-value{font-size:30px;clear:both;color:#222222}*/
.team-details .list-value {
    font-size: 22px;
    clear: both;
    color: #222222
}

.team-details .list-name {
    color: #222222;
    display: block
}

.team-caption li:hover .list-name, .team-caption li:hover .list-value {
    color: #3f77c5;
    transition: all .5s
}

.team-caption li:hover {
    transition: all .5s;
    box-shadow: 3px 0px 16px rgba(137,137,137,0.3)
}

.per-cap li .team-devide .team-icon {
    color: #fe6e9d
}

.team-value .rev-date {
    position: relative;
    line-height: 24px;
    display: inline-block;
    width: 50%
}

    .team-value .rev-date select {
        border: none;
        text-overflow: ellipsis;
        white-space: nowrap;
        padding-right: 20px;
        height: inherit;
        font-size: 30px;
        color: #fff;
        font-weight: 900
    }

    .team-value .rev-date:after {
        top: 12px;
        right: 0px;
        border-left: .15em solid transparent;
        border-right: .15em solid transparent;
        border-top: .25em solid rgba(255,255,255,.8)
    }

    .team-value .rev-date .newBtn {
        font-size: 30px;
        font-weight: 900;
        background: transparent;
        border-bottom: 0px !important;
        padding: 0;
        line-height: 24px
    }

        .team-value .rev-date .newBtn > .filter-option {
            color: #fff
        }

        .team-value .rev-date .newBtn .bs-caret > .caret {
            color: #fff;
            border-right: 8px solid transparent;
            border-left: 8px solid transparent;
            border-top: 10px dashed;
            border-bottom: 0px solid transparent
        }
/*.filter-search{width:100%;float:left;position:relative;z-index:6;border-bottom:1px solid #e7e7e7;padding-bottom:10px}*/
.filter-search {
    width: 100%;
    float: left;
    position: relative;
    z-index: 6;
    padding-bottom: 5px;
    text-align: right;
    display: none
}
/*.search-result{z-index:8;position:relative;margin-left:30px;display:inline-block}*/
.search-result {
    z-index: 8;
    position: relative;
    margin-left: 10px;
    display: inline-block;
    float: right;
}

    .search-result:first-child {
        margin-left: 0
    }

    .search-result ul {
        float: left;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden
    }

    .search-result li {
        display: inline-block;
        float: left;
        padding-left: 4px
    }

    .search-result span.search-item {
        float: left;
        padding-right: 5px;
        line-height: 25px;
        color: #787878;
        font-size: 11px;
        font-weight: 400
    }

.chip {
    padding: 5px 5px 5px 15px;
    border-radius: 16px;
    border: 1px solid #dedede;
    color: #777;
    font-size: 12px;
    float: left;
    background: #e0e0e0;
}
/*.chip{padding:2px 10px;border-radius:4px;border:1px solid #adadae;color:#818184;font-size:11px;line-height:21px;float:left}*/
.closebtn, .popClose{padding-left:10px;color:#818184;font-weight:bolder;font-size:8px;cursor:pointer;float:right;line-height:17px}
@-moz-document url-prefix(){.closebtn{float:none;line-height:100%}}
.closebtn:hover, .popClose:hover{color:#000}
.count-other{float:left;margin:4px 0 0 10px;color:#818184;font-size:11px;line-height:20px;cursor:pointer;transition:all .3s;position:relative;border-bottom:1px solid transparent}
.count-other:hover{color:#2b99f0 !important;transition:all .3s;border-bottom:1px solid}
.popover{font-family:'Open Sans',sans-serif;border:1px solid rgba(0,0,0,.1);padding:0}
.popover.top>.arrow{border-top-color:rgba(0,0,0,.1)}
.popover.bottom>.arrow{border-bottom-color:rgba(0,0,0,.1)}
.custom-popover{display:none}
.chip-popover{max-width:100%;min-width:200px}
.chip-popover>.popover-content li{padding:5px 0}
.chip-popover>.popover-content li:first-child{padding-top:0}
.chip-popover>.popover-content li:last-child{padding-bottom:0}
.chip-popover>.popover-content li .chip{border-radius:4px;float:inherit;overflow:hidden;}
.table-searchfield{top:-97px !important}
.action-icon{font-size:16px;color:#818184;cursor:pointer;font-weight:600}
.action-icon:hover{color:#3ea2f1}
.count-project{padding:0px 5px;text-align:center;color:#2d2d33;background:#d5d5d5;border-radius:3px;display:inline-block;margin-left:5px;cursor:pointer}
.management-tbl td.dataTables_empty{width:100% !important}
.table-search{position:absolute;right:43px;top:12px}
.table-search > label > input.form-control{border:1px solid #c5c5c5;width:250px;padding:5px 30px 5px 10px;border-radius:5px;height:100%;font-size:12px;box-shadow:none;font-weight:400}
.panel-group {
    clear: both;
    margin-top: 45px !important;
}
.panel-group>.panel{background:transparent;border:none}
.panel-group>.panel>.panel-collapse>.panel-body{padding:5px 0 0 0}
.panel-group>.panel>.panel-heading{background-color:transparent}
.panel-group>.panel>.panel-heading> h4.panel-title>a{background:transparent;border-bottom:1px solid #a8a7a7;font-size:12px;color:#787878;margin-top:10px;position:relative;transition:all .3s;font-weight:400;display:inline-block;width:100%}
.panel-body>.table-responsive>.dataTables_wrapper>.slide_tab{margin-bottom:0px}
.goal-periad{float:left}
.panel-group>.panel-default>.panel-heading a::before{position:absolute;left:50%;content:'';height:1px;background:#2b99f0;transition:all .3s;width:0;bottom:-1px}
.panel-group>.panel-default>.panel-heading a.collapsed{background:#e5e5e5 !important;border-top-right-radius:4px;border-top-left-radius:4px;color:#2d2d33 !important}
.panel-group>.panel-default>.panel-heading a:hover{background:#e5e5e5 !important;border-top-right-radius:4px;border-top-left-radius:4px;color:#2d2d33 !important}
.panel-group>.panel-default>.panel-heading a:hover::before{width:100%;margin-left:-50%}
.panel-group>.panel-default>.panel-heading a:after{content:"";position:relative;top:1px;display:inline-block;font-family:'goal';font-style:normal;font-weight:400;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;float:right;transition:transform .25s linear;-webkit-transition:-webkit-transform .25s linear;font-size:1rem;color:#b9b9b9}
.panel-group>.panel-default>.panel-heading a[aria-expanded="true"]:after{content:"\e915";-webkit-transform:rotate(180deg);transform:rotate(180deg)}
.panel-group>.panel-default>.panel-heading a[aria-expanded="false"]:after{content:"\e915";-webkit-transform:rotate(0deg);transform:rotate(0deg)}
.emplyee-det{max-width:500px;min-width:200px;top:60px !important}
.emplyee-det>.arrow{border-right-color:#c8c9cb !important;top:13% !important}
.emplyee-det>.popover-content{padding:5px 0 0}
.emplyee-det>.popover-content li{padding:7px 15px;border-bottom:1px solid #f0f0f0;float:left;width:100%}
.emplyee-det>.popover-content li:last-child{border-bottom:none}
.emplyee-det>.popover-content li div.emdetails{float:left;width:50%}
.emplyee-det>.popover-content li span.det-caption{font-size:12px;color:#787878;display:block;line-height:22px}
.emplyee-det>.popover-content li span.det-value{font-size:13px;color:#2d2d33;display:block;line-height:22px}
button.action-gs{ font-family: 'goalFileUpload' ;font-size:14px;color:#777;cursor:pointer;display:inline-block;margin:0 10px;font-weight:600;position:relative;border:none;background:transparent}
button.Details-gs{ font-size:14px;color:#777;cursor:pointer;display:inline-block;margin:0 10px;font-weight:600;position:relative;border:none;background:transparent}
button.action-Reject {   
    font-size: 14px;
    color: #777;
    cursor: pointer;
    display: inline-block;
    margin: 0 10px;
    font-weight: 600;
    position: relative;
    border: none;
    background: transparent
}

button.action-gs:hover {
    color: #3ea2f1
}

.active-button {
    color: #3ea2f1 !important
}

button.action-gs:disabled {
    cursor: not-allowed;
    opacity: .5
}

    button.action-gs:disabled:hover {
        color: #98989b;
        opacity: .5
    }

.view-add:after {
    content: '';
    position: absolute;
    width: 15px;
    height: 15px;
    background: #f18230;
    border-radius: 50%;
    top: -8px;
    right: -6px
}

.view-add > i {
    position: absolute;
    font-size: 8px;
    top: -5px;
    right: 0px;
    z-index: 1;
    color: #fff;
    font-family: 'Open Sans',sans-serif
}

.viewtd {
    width: 96% !important;
    margin: 0 2% -15px 2%
}

.group {
    margin: 0
}

.no_leftPadding > .label {
    color: #787878 !important
}

.input {
    border-bottom: 1px solid #b9b9b9;
    z-index: 7;
    position: relative;
    height: 30px;
    color: #2d2d33
}

    .input.date-picker {
        cursor: pointer
    }

        .input.date-picker[readonly] {
            background-color: transparent;
            opacity: 1
        }

.calender-icon {
    position: absolute;
    right: 25px;
    top: 30px;
    font-size: 1.3rem;
    color: #505050;
    cursor: pointer;
    z-index: 1
}

.custom-button {
    color: #555;
    padding: 5px;
    min-width: 60px;
    border: none;
    font-size: 14px;
    background: transparent
}

.glb-btn > .primary {
    color: #49a7f2;
    font-weight: 600
}

button.multiselect {
    border: none;
    border-bottom: 1px solid #ccc;
    padding-left: 0
}

.group > .form-group {
    margin: 5px 0;
    height: 30px
}

.keyPerformance > span.twitter-typeahead {
    display: inherit !important;
    width: 100%
}

.typheadIcon {
    position: absolute;
    right: 25px;
    top: 30px;
    font-size: 1rem;
    color: #c0c0c0;
    cursor: pointer;
    z-index: 7
}

.keyPerformance ~ .label {
    top: -10px;
    font-size: 12px;
    color: #999
}

.tt-menu {
    width: 100%;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    color: #797979;
    min-width: 160px;
    list-style: none;
    font-size: 13px;
    margin: 0;
    text-align: left;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0,0,0,0.15);
    border-radius: 0 0 4px 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0,0,0,0.175);
    box-shadow: 0 6px 12px rgba(0,0,0,0.175);
    max-height: 140px;
    overflow-y: auto
}

.tt-dataset {
    padding: 10px
}

.tt-suggestion {
    padding: 7px 0px;
    border-bottom: 1px solid #d9d9d9;
    cursor: pointer
}

    .tt-suggestion:first-child {
        padding-top: 0
    }

    .tt-suggestion:last-child {
        border-bottom: 0;
        padding-bottom: 0
    }

.removeval {
    display: none
}

.add-newGoal {
    float: right;
    padding-top: 17px;
    position: relative
}

    .add-newGoal a {
        color: #2b99f0;
        font-weight: 400;
        border-bottom: 2px solid #2b99f0
    }

.addnewgoalForm {
    display: none
}

    .addnewgoalForm > .addgoalinner {
        background: #fff;
        padding: 15px;
        border-radius: 4px 0 4px 4px;
        width: 100%;
        float: left;
        box-shadow: 0px 1px 5px rgba(0,0,0,.3);
        transition: transform .3s !important;
        position: relative;
        margin-top: 20px
    }

.right-corner {
    position: absolute;
    top: -18px;
    right: 11px;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-bottom: 20px solid #fff
}

.close_pop {
    display: inline-block;
    padding: 15px;
    color: #fff;
    font-size: 1.5rem;
    font-weight: 900;
    clear: both;
    float: left;
    width: 100%;
    cursor: pointer
}

#editsubGoal > .group > .form-group, #addNewGoal > .group > .form-group {
    margin: 20px 0
}

.accordion-option {
    float: left;
    width: 100%;
    display: none
}

.col-c2 {
    width: 16.666666%;
    padding-right: 20px;
    float: left;
    position: relative
}

    .col-c2:last-child {
        padding-right: 0
    }

        .col-c2:last-child .calender-icon {
            right: 5px
        }

    .col-c2 > .label {
        color: #787878 !important
    }

.col-c3 {
    width: 20%;
    padding-right: 20px;
    float: left;
    position: relative
}

    .col-c3:nth-child(5) {
        padding-right: 0
    }

    .col-c3 > .label, .textbox > .label {
        color: #787878 !important
    }

.col-c4 {
    width: 25%;
    padding-right: 20px;
    float: left;
    position: relative
}

    .col-c4:nth-child(4) {
        padding-right: 0
    }

    .col-c4 > .label, .textbox > .label {
        color: #787878 !important
    }

.col-c5 {
    width: 33.33%;
    padding-right: 20px;
    float: left;
    position: relative
}

.lastc5 {
    padding-right: 0
}

.multiline {
    display: inline-table !important;
    margin-top: 15px
}

.col-c6 {
    width: 50%;
    padding-right: 20px;
    float: left;
    position: relative
}

    .col-c6:nth-child(2) {
        padding-right: 0
    }

        .col-c6:nth-child(2) > .typheadIcon {
            right: 5px
        }

.bs-searchbox {
    display: none
}

.tab-content {
    position: relative
}

.col-c3:nth-child(5) .calender-icon {
    right: 5px
}

.mCSB_scrollTools {
    width: 8px !important
}

.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 8px !important
}

.mCSB_scrollTools .mCSB_draggerRail {
    width: 8px !important
}

input[type=text]::-ms-clear {
    display: none
}

input::-ms-clear {
    display: none
}

input::-ms-clear {
    visibility: hidden
}

.custom-progress {
    height: 4px;
    background-color: #cccccc;
    margin: 10px 0 0 10px
}

.pro-count {
    position: absolute;
    top: -3px;
    right: 0;
    font-size: 11px
}

.custom-progress > .progress-bar-success {
    background-color: #58a321
}

.remark-field {
    max-width: 250px;
    min-width: 270px;
    margin-top: 0 !important
}

    .remark-field > .arrow {
        display: none
    }

    .remark-field > .popover-content > textarea {
        border: 0;
        box-shadow: none;
        min-height: 150px;
        padding: 0
    }

.per-select-yr {
    float: left;
    padding-right: 5px
}

.select-button a {
    color: rgba(255,255,255,.8)
}

    .select-button a:hover {
        color: rgba(255,255,255,.8)
    }

.select-button > .dropdown-menu {
    top: -162px;
    background: rgba(255,135,95,1);
    background: -moz-linear-gradient(left, rgba(255,135,95,1) 0%, rgba(254,109,159,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(255,135,95,1)), color-stop(100%, rgba(254,109,159,1)));
    background: -webkit-linear-gradient(left, rgba(255,135,95,1) 0%, rgba(254,109,159,1) 100%);
    background: -o-linear-gradient(left, rgba(255,135,95,1) 0%, rgba(254,109,159,1) 100%);
    background: -ms-linear-gradient(left, rgba(255,135,95,1) 0%, rgba(254,109,159,1) 100%);
    background: linear-gradient(to right, rgba(255,135,95,1) 0%, rgba(254,109,159,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff875f', endColorstr='#fe6d9f', GradientType=1 );
    border: 0;
    overflow: hidden;
    max-height: 206px;
    overflow-y: scroll
}

    .select-button > .dropdown-menu li {
        border-bottom: 1px solid #f1f1f1
    }

        .select-button > .dropdown-menu li a {
            color: #fff;
            padding: 7px 20px
        }

        .select-button > .dropdown-menu li:last-child {
            border-bottom: 0
        }

    .select-button > .dropdown-menu > li > a:focus, .select-button > .dropdown-menu > li > a:hover {
        opacity: .6;
        background: transparent
    }

.textarea-block {
    position: relative
}

.textarea-field {
    position: absolute;
    z-index: 5;
    top: 27px;
    width: 100%;
    resize: none;
    left: 0
}

.textbox > .form-control[readonly] {
    background-color: transparent;
    opacity: 1
}

.textarea-field > textarea.form-control {
    width: 93%;
    height: 125px;
    border-radius: 2px;
    box-shadow: 0 0 7px 2px rgba(0,0,0,.2) !important;
    padding: 10px;
    background: #fff
}

    .textarea-field > textarea.form-control:focus {
        box-shadow: 0 0 7px 2px rgba(0,0,0,.2) !important;
        border-color: transparent !important
    }

.twitter-typeahead input.tt-hint {
    display: none
}

.add-row {
    box-shadow: 2px 4px 5px rgba(132,191,238,.6);
    transition: all .3s
}

.text-elips a {
    color: #2b99f0;
    float: right;
    display: none
}
/* -- Floating Labels -------------------------------- */
.form-group .form-control {
    border-bottom: 1px solid #e5e5e5 !important;
    border: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 0;
    padding-left: 0;
    font-size: 13px;
    color: #2d2d33;
    background-color: transparent;
    z-index: 3;
    position: relative
}

.floating-label .form-control {
    align-self: flex-end
}

.floating-label .form-group {
    display: flex;
    height: 53px;
    position: relative
}

    .floating-label .form-group.form-cusCR {
        display: inherit !important;
        height: auto !important
    }

    .floating-label .form-group.form-group-small {
        height: 30px
    }

.floating-label .control-label {
    pointer-events: none;
    position: absolute;
    transform: translate3d(0, 27px, 0) scale(1);
    transform-origin: left top;
    transition: 240ms;
    color: #787878;
    font-size: 12px;
    font-weight: 400
}

.floating-label .form-group.focused .control-label {
    opacity: 1;
    transform: translate3d(0, 10px, 0) scale(0.90)
}

.floating-label .form-group.multiline.focused .control-label {
    opacity: 1;
    transform: translate3d(0, -15px, 0) scale(1)
}

.floating-label .form-control {
    align-self: flex-end
}

    .floating-label .form-control::-webkit-input-placeholder {
        color: transparent;
        transition: 240ms
    }

    .floating-label .form-control:focus::-webkit-input-placeholder {
        transition: none
    }

.floating-label .form-group.focused .form-control::-webkit-input-placeholder {
    color: #bbb
}
/*.form-group.focused .form-control{border-bottom:1px solid #4285f4 !important}*/
.form-group.focused .form-control.fpreV {
    border-bottom: 1px solid #e5e5e5 !important;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none
}

.bootstrap-select .btn.disabled, .bootstrap-select .btn[disabled], .bootstrap-select fieldset[disabled] .btn {
    opacity: 1
}

.form-group.focused.has-error .form-control {
    border-bottom: 1px solid #ff0c0c !important
}

.form-group.focused.validClass .form-control {
    border-bottom: 1px solid #3c763d !important
}

.has-error .form-control {
    border-color: #ff0c0c !important;
    box-shadow: none !important
}

.validClass .form-control {
    border-color: #3c763d !important;
    box-shadow: none !important
}

.form-group .bootstrap-select.open .btn {
    border-bottom: 1px solid #4285f4 !important
}

.bootstrap-select .btn:focus {
    border-bottom: 1px solid #4285f4 !important
}

.form-group.has-error .bootstrap-select.open .btn {
    border-bottom: 1px solid #cc0000 !important
}

.form-group.has-success .btn {
    border-bottom: 1px solid #3c763d !important
}

[type="checkbox"]:checked:focus + label:before, [type="checkbox"]:not(:checked):focus + label:before {
    border: 1px solid #4285f4 !important
}

[type="radio"]:checked:focus + label:before, [type="radio"]:not(:checked):focus + label:before {
    border: 1px solid #4285f4 !important
}

.control-label.staticLable {
    opacity: 1;
    transform: translate3d(0, 10px, 0) scale(0.90)
}

.flex-end {
    align-items: flex-end;
    border-bottom: 1px solid #e5e5e5
}

    .flex-end .checkbox {
        padding-bottom: 7px
    }
/* Bootstrap-select v1.12.4 (http://silviomoreto.github.io/bootstrap-select) */
.bootstrap-select.btn-group .dropdown-menu li.disabled a, .bootstrap-select.btn-group.disabled, .bootstrap-select.btn-group > .disabled {
    cursor: not-allowed
}

select.bs-select-hidden, select.selectpicker {
    display: none !important
}

.bootstrap-select {
    width: 220px\9
}

    .bootstrap-select > .dropdown-toggle {
        width: 100%;
        padding-right: 25px;
        z-index: 1
    }

        .bootstrap-select > .dropdown-toggle.bs-placeholder, .bootstrap-select > .dropdown-toggle.bs-placeholder:active, .bootstrap-select > .dropdown-toggle.bs-placeholder:focus, .bootstrap-select > .dropdown-toggle.bs-placeholder:hover {
            color: #777
        }

    .bootstrap-select > select {
        position: absolute !important;
        bottom: 0;
        left: 50%;
        display: block !important;
        width: .5px !important;
        height: 100% !important;
        padding: 0 !important;
        opacity: 0 !important;
        border: none
    }

        .bootstrap-select > select.mobile-device {
            top: 0;
            left: 0;
            display: block !important;
            width: 100% !important;
            z-index: 2
        }

.error .bootstrap-select .dropdown-toggle, .has-error .bootstrap-select .dropdown-toggle {
    border-color: #b94a48
}

.bootstrap-select.fit-width {
    width: auto !important
}

.bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
    width: 220px
}

.bootstrap-select.btn-group[class*=col-] .dropdown-toggle, .bootstrap-select.form-control:not([class*=col-]), .form-inline .bootstrap-select.btn-group .form-control {
    width: 100%
}

.bootstrap-select .dropdown-toggle:focus {
    outline: none
}

.bootstrap-select.form-control {
    margin-bottom: 0;
    padding: 0;
    border: none
}

    .bootstrap-select.form-control.input-group-btn {
        z-index: auto
    }

        .bootstrap-select.form-control.input-group-btn:not(:first-child):not(:last-child) > .btn {
            border-radius: 0
        }

.bootstrap-select.btn-group:not(.input-group-btn), .bootstrap-select.btn-group[class*=col-] {
    float: none;
    display: inline-block;
    margin-left: 0
}

    .bootstrap-select.btn-group.dropdown-menu-right, .bootstrap-select.btn-group[class*=col-].dropdown-menu-right, .row .bootstrap-select.btn-group[class*=col-].dropdown-menu-right {
        float: right
    }

.form-group .bootstrap-select.btn-group, .form-horizontal .bootstrap-select.btn-group, .form-inline .bootstrap-select.btn-group {
    margin-bottom: 0;
    margin-top: 20px
}

.form-group-lg .bootstrap-select.btn-group.form-control, .form-group-sm .bootstrap-select.btn-group.form-control {
    padding: 0
}

    .form-group-lg .bootstrap-select.btn-group.form-control .dropdown-toggle, .form-group-sm .bootstrap-select.btn-group.form-control .dropdown-toggle {
        height: 100%;
        font-size: inherit;
        line-height: inherit;
        border-radius: inherit
    }

.bootstrap-select.btn-group.disabled:focus, .bootstrap-select.btn-group > .disabled:focus {
    outline: 0 !important
}

.bootstrap-select.btn-group.bs-container {
    position: absolute;
    height: 0 !important;
    padding: 0 !important
}

    .bootstrap-select.btn-group.bs-container .dropdown-menu {
        z-index: 1060
    }

.bootstrap-select.btn-group .dropdown-toggle .filter-option {
    display: inline-block;
    overflow: hidden;
    width: 100%;
    text-align: left;
    text-overflow: ellipsis;
    font-size: 13px;
    color: #2d2d33
}

.bootstrap-select.btn-group .dropdown-toggle .caret {
    position: absolute;
    top: 50%;
    right: 12px;
    margin-top: -2px;
    vertical-align: middle
}

.bootstrap-select.btn-group .dropdown-menu {
    margin-top: -1px;
    min-width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

    .bootstrap-select.btn-group .dropdown-menu.inner {
        position: static;
        float: none;
        border: 0;
        padding: 0;
        margin: 0;
        border-radius: 0;
        -webkit-box-shadow: none;
        box-shadow: none
    }

    .bootstrap-select.btn-group .dropdown-menu li {
        position: relative
    }

        .bootstrap-select.btn-group .dropdown-menu li.active small {
            color: #fff
        }

        .bootstrap-select.btn-group .dropdown-menu li a {
            cursor: pointer;
            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none
        }

            .bootstrap-select.btn-group .dropdown-menu li a.opt {
                position: relative;
                padding-left: 2.25em
            }

            .bootstrap-select.btn-group .dropdown-menu li a span.check-mark {
                display: none
            }

            .bootstrap-select.btn-group .dropdown-menu li a span.text {
                display: inline-block
            }

        .bootstrap-select.btn-group .dropdown-menu li small {
            padding-left: .5em
        }

    .bootstrap-select.btn-group .dropdown-menu .notify {
        position: absolute;
        bottom: 5px;
        width: 96%;
        margin: 0 2%;
        min-height: 26px;
        padding: 3px 5px;
        background: #f5f5f5;
        border: 1px solid #e3e3e3;
        -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
        box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
        pointer-events: none;
        opacity: .9;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box
    }

.bootstrap-select.btn-group .no-results {
    padding: 3px;
    background: #f5f5f5;
    margin: 0 5px;
    white-space: nowrap
}

.bootstrap-select.btn-group.fit-width .dropdown-toggle .filter-option {
    position: static
}

.bootstrap-select.btn-group.fit-width .dropdown-toggle .caret {
    position: static;
    top: auto;
    margin-top: -1px
}

.bootstrap-select.btn-group.show-tick .dropdown-menu li.selected a span.check-mark {
    position: absolute;
    display: inline-block;
    right: 15px;
    margin-top: 5px
}

.bootstrap-select.btn-group.show-tick .dropdown-menu li a span.text {
    margin-right: 34px
}

.bootstrap-select.show-menu-arrow.open > .dropdown-toggle {
    z-index: 1061
}

.bootstrap-select.show-menu-arrow .dropdown-toggle:before {
    content: '';
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid rgba(204,204,204,.2);
    position: absolute;
    bottom: -4px;
    left: 9px;
    display: none
}

.bootstrap-select.show-menu-arrow .dropdown-toggle:after {
    content: '';
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid #fff;
    position: absolute;
    bottom: -4px;
    left: 10px;
    display: none
}

.bootstrap-select.show-menu-arrow.dropup .dropdown-toggle:before {
    bottom: auto;
    top: -3px;
    border-top: 7px solid rgba(204,204,204,.2);
    border-bottom: 0
}

.bootstrap-select.show-menu-arrow.dropup .dropdown-toggle:after {
    bottom: auto;
    top: -3px;
    border-top: 6px solid #fff;
    border-bottom: 0
}

.bootstrap-select.show-menu-arrow.pull-right .dropdown-toggle:before {
    right: 12px;
    left: auto
}

.bootstrap-select.show-menu-arrow.pull-right .dropdown-toggle:after {
    right: 13px;
    left: auto
}

.bootstrap-select.show-menu-arrow.open > .dropdown-toggle:after, .bootstrap-select.show-menu-arrow.open > .dropdown-toggle:before {
    display: block
}

.bs-actionsbox, .bs-donebutton, .bs-searchbox {
    padding: 4px 8px
}

.bs-actionsbox {
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

    .bs-actionsbox .btn-group button {
        width: 50%
    }

.bs-donebutton {
    float: left;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

    .bs-donebutton .btn-group button {
        width: 100%
    }

.bs-searchbox + .bs-actionsbox {
    padding: 0 8px 4px
}

.bs-searchbox .form-control {
    margin-bottom: 0;
    width: 100%;
    float: none
}

.bootstrap-select .dropdown-menu {
    border-radius: 0;
    border-top: 0;
    padding: 0
}

    .bootstrap-select .dropdown-menu > li > a {
        padding-left: 10px;
        padding-right: 10px
    }

/*----- New Design changes -------*/

.employee-view {
    display: block
}

    .employee-view > h2 {
        font-size: 18px;
        color: #999999;
        margin-bottom: 15px;
        margin-top: 0
    }

.card-box {
    background: #fff;
    padding: 15px;
    border-radius: 4px;
    box-shadow: 0 2px 10px rgba(0,0,0,.2);
    transition: all .3s;
    position: relative
}

    .card-box > .goals-per {
        position: relative;
        display: inline-block
    }

        .card-box > .goals-per ul {
            width: 100%;
            display: table;
            margin-top: 20px;
            table-layout: fixed;
            padding-left: 0
        }

            .card-box > .goals-per ul li {
                display: table-cell;
                text-align: center;
                position: relative;
                padding: 8px;
                font-size: 12px;
                color: #777
            }
                /*.card-box>.goals-per ul li{display:table-cell;text-align:center;position:relative;padding:3px;font-size:12px;color:#777;font-weight:600}*/
                .card-box > .goals-per ul li span.ap-pen {
                    font-size: 10px;
                    font-weight: 400;
                    margin-top: 7px;
                    display: block
                }

                .card-box > .goals-per ul li a {
                    font-size: 13px;
                    color: #222;
                    display: block
                }

                .card-box > .goals-per ul li:after {
                    position: absolute;
                    content: '';
                    border-bottom: 1px dotted #777;
                    width: 100%;
                    top: 32px;
                    right: -31%
                }

                .card-box > .goals-per ul li:before {
                    position: absolute;
                    font-family: 'goal' !important;
                    content: "\e915";
                    color: #777;
                    transform: rotate(30deg);
                    right: 0;
                    top: 28px;
                    z-index: 2;
                    font-size: 9px
                }

.goals-per:last-child ul li:last-child:after {
    border-bottom: 0
}

.goals-per:last-child ul li:last-child:before {
    content: ''
}
/*.card-box>.goals-per ul li div.dash-icons{border:1px solid #e7e7e7;display:inline-block;border-radius:50%;padding:17px 20px;margin-bottom:20px;position:relative;background:#fff;z-index:1;transition:all .2s}*/
.card-box > .goals-per ul li div.dash-icons {
    border: 1px solid #e7e7e7;
    display: inline-block;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    padding: 14px 15px;
    margin-bottom: 20px;
    position: relative;
    background: #fff;
    z-index: 1;
    transition: all .2s
}

    .card-box > .goals-per ul li div.dash-icons:hover {
        box-shadow: 0 2px 10px rgba(0,0,0,.2);
        transition: all .2s
    }

.card-box > .goals-per ul li.active:before {
    color: #6c9e31
}

.card-box > .goals-per ul li.active:after {
    border-bottom: 1px solid #6c9d31
}

.card-box > .goals-per ul li.active a {
    color: #6c9e31
}

    .card-box > .goals-per ul li.active a div.dash-icons {
        border: 1px solid #6c9e31
    }

.card-box > .goals-per ul li.active div.dash-icons:before {
    background: #6c9e31
}

.card-box > .goals-per ul li.active div.dash-icons:after {
    color: #fff;
    font-family: 'goal' !important;
    content: "\e91b"
}

.card-box > .goals-per ul li.pending a {
    color: #f18230
}

    .card-box > .goals-per ul li.pending a div.dash-icons {
        border: 1px solid #f18230;
        background: #f18230
    }

        .card-box > .goals-per ul li.pending a div.dash-icons span {
            color: #fff
        }

.card-box > .goals-per ul li.pending div.dash-icons:after {
    font-family: 'goal' !important;
    content: "\e907"
}

.card-box > .goals-per ul li div.dash-icons span {
    font-size: 22px;
    color: #999999
}

.card-box > .goals-per ul li div.dash-icons:after {
    position: absolute;
    font-family: 'goal' !important;
    content: "\e917";
    color: #777;
    right: -1px;
    top: 0;
    z-index: 2;
    font-size: 9px
}

.card-box > .goals-per ul li div.dash-icons:before {
    position: absolute;
    content: " ";
    right: -7px;
    top: -6px;
    z-index: 2;
    font-size: 9px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #f3f3f3
}

.al-msg {
    width: 50%;
    float: left;
    text-align: center;
    border-right: 1px solid #e7e7e7;
    padding: 50px 40px 20px;
    position: relative
}

    .al-msg:last-child {
        border-right: 0px
    }

        .al-msg:last-child .glb-btn {
            margin-top: 30px
        }

    .al-msg p {
        margin: 30px 0px 20px;
        color: #777
    }

.custom-modal {
    border-radius: 4px
}

.team-view .card-box > .goals-per ul li div.dash-icons:before, .team-view .card-box > .goals-per ul li div.dash-icons:after {
    display: none
}

.team-card {
    padding: 0;
    margin-left: 100px;
    margin-top: 25px;
    display: inline-block
}

    .team-card .goals-per {
        background: #f9f9f9;
        border-radius: 4px 4px 0 0
    }

        .team-card .goals-per ul {
            margin-top: -32px
        }

            .team-card .goals-per ul li div.dash-icons {
                border: none;
                box-shadow: 0 2px 10px rgba(0,0,0,.2)
            }

.performance-role {
    display: block
}

.list-view {
    width: 100%;
    float: left;
    position: relative;
    border-top: 1px solid #e7e7e7
}

    .list-view ul li {
        float: left;
        width: 11%;
        text-align: center
    }

        .list-view ul li.tbl {
            display: table-cell;
            width: 20%;
            text-align: center;
        }

            .list-view ul li.tbl:nth-child(5), .list-view ul li.tbl:nth-child(6) {
                margin: 0 0 0 0px
            }

        .list-view ul li:nth-child(5), .list-view ul li:nth-child(6), .list-view ul li:nth-child(7), .list-view ul li:nth-child(8), .list-view ul li:nth-child(9) {
            margin: 0 0 0 2px
        }

        .list-view ul li a {
            padding: 11px;
            margin: 15px 0 15px 3px;
            width: 40px;
            height: 40px;
            display: inline-block;
            color: rgba(119,119,119,.7)
        }

            .list-view ul li a.custom-edit {
                color: #222
            }
            /*.list-view ul li a.custom-edit:after{position:absolute;font-family:'goal' !important;content:"\e907";color:#777;right:-2px;bottom:0;z-index:2;font-size:9px}
.list-view ul li a.custom-edit:before{position:absolute;content:" ";right:-6px;bottom:-2px;z-index:2;font-size:9px;width:18px;height:18px;border-radius:50%;background:#fff}*/
            /*.list-view ul li a.custom-edit:hover:before{background:#a51c1c}
.list-view ul li a.custom-edit:hover:after{color:#fff}*/
            .list-view ul li a.appraiser-edit {
                background: #39cfc0;
                background: -moz-linear-gradient(-45deg, #39cfc0 0%, #129cd2 100%);
                background: -webkit-linear-gradient(-45deg, #39cfc0 0%,#129cd2 100%);
                background: linear-gradient(135deg, #39cfc0 0%,#129cd2 100%);
                filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#39cfc0', endColorstr='#129cd2',GradientType=1 );
                transition: all .2s
            }

                .list-view ul li a.appraiser-edit:hover {
                    box-shadow: 0 2px 10px rgb(57, 212, 247);
                    transition: all .2s
                }

            .list-view ul li a.reviewer-edit {
                background: #3789c7;
                background: -moz-linear-gradient(-45deg, #3789c7 0%, #9778b7 100%);
                background: -webkit-linear-gradient(-45deg, #3789c7 0%,#9778b7 100%);
                background: linear-gradient(135deg, #3789c7 0%,#9778b7 100%);
                filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3789c7', endColorstr='#9778b7',GradientType=1);
                transition: all .2s
            }

                .list-view ul li a.reviewer-edit:hover {
                    box-shadow: 0 2px 10px rgb(118, 126, 190);
                    transition: all .2s
                }

            .list-view ul li a.head-edit {
                background: #fbad8c;
                background: -moz-linear-gradient(-45deg, #fbad8c 0%, #e97090 100%);
                background: -webkit-linear-gradient(-45deg, #fbad8c 0%,#e97090 100%);
                background: linear-gradient(135deg, #fbad8c 0%,#e97090 100%);
                filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fbad8c', endColorstr='#e97090',GradientType=1);
                transition: all .2s
            }

                .list-view ul li a.head-edit:hover {
                    box-shadow: 0 2px 10px rgb(239, 128, 142);
                    transition: all .2s
                }

            .goals-per ul li a.not-active, .list-view ul li a.not-active {
                cursor: default
            }

        .list-view ul li:first-child {
            position: absolute;
            left: -12%;
            text-align: left;
            padding: 15px 0;
            background: #ccc;
            border-radius: 50px 0 0 50px;
            top: 10px;
            color: #fff;
            width: 12%
        }

.gol-icon {
    margin: -2px 10px 0 20px;
    font-size: 1.6rem;
    float: left;
    color: #fff
}

.list-view ul li.appraiser-list {
    background: #39cfc0;
    background: -moz-linear-gradient(-45deg, #39cfc0 0%, #129cd2 100%);
    background: -webkit-linear-gradient(-45deg, #39cfc0 0%,#129cd2 100%);
    background: linear-gradient(135deg, #39cfc0 0%,#129cd2 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#39cfc0', endColorstr='#129cd2',GradientType=1 )
}

.list-view ul li.reviewer-list {
    background: #3789c7;
    background: -moz-linear-gradient(-45deg, #3789c7 0%, #9778b7 100%);
    background: -webkit-linear-gradient(-45deg, #3789c7 0%,#9778b7 100%);
    background: linear-gradient(135deg, #3789c7 0%,#9778b7 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3789c7', endColorstr='#9778b7',GradientType=1 )
}

.list-view ul li.head-list {
    background: #fbad8c;
    background: -moz-linear-gradient(-45deg, #fbad8c 0%, #e97090 100%);
    background: -webkit-linear-gradient(-45deg, #fbad8c 0%,#e97090 100%);
    background: linear-gradient(135deg, #fbad8c 0%,#e97090 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fbad8c', endColorstr='#e97090',GradientType=1 )
}

.team-card .goals-per {
    float: left
}

.team-card > .goals-per ul li:last-child:after {
    border-bottom: 0
}

.team-card > .goals-per ul li:last-child:before {
    content: ''
}

.my-goalBreadcrumb {
    padding-bottom: 10px;
    float: left;
    width: 100%
}
/*.my-goalBreadcrumb ul{float:left;line-height:30px}*/
.goal-breadcrumb {
    border-bottom: 1px solid #e7e7e7
}

.modal-btn button {
    min-width: 180px
}

.or-list {
    position: absolute;
    left: -19px;
    border: 1px solid #e7e7e7;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    padding: 9px;
    top: 48%;
    background: #fff;
    text-transform: capitalize;
    color: #777;
    font-size: 11px
}

.bulk-screen {
    display: inline-block
}

    .bulk-screen p {
        color: #2d2d33
    }

.check-upload {
    background: #fff;
    padding: 15px 15px 0;
    border-radius: 4px;
    box-shadow: 0 2px 10px rgba(0,0,0,.2);
    transition: all .3s
}

    .check-upload ul {
        margin: 0 -15px
    }

ul.kppUpdate {
    max-height: 350px
}

.check-upload ul li {
    color: #222;
    font-size: 1rem;
    border-bottom: 1px solid #e7e7e7;
    padding: 5px 15px
}

    .check-upload ul li:last-child {
        border-bottom: 0px
    }

    .check-upload ul li label {
        width: 95%
    }

        .check-upload ul li label input {
            margin-right: 20px
        }

.kpp-description {
    background: #f9f9f9;
    display: inline-block;
    margin: -15px -15px 0 -15px;
    border-radius: 4px 4px 0 0;
    padding: 10px 15px 10px;
    width: 105.5%;
    border-bottom: 1px solid #e7e7e7
}

    .kpp-description h2 {
        float: left;
        margin: 7px 0 0;
        font-size: 16px;
        font-weight: 400;
        color: #222222
    }

.kppSearch {
    float: right;
    margin: 0
}

    .kppSearch > .search-box > .searchContainer {
        top: 3px;
        right: 0px
    }

        .kppSearch > .search-box > .searchContainer > .searchBoxField {
            border: 0;
            background: transparent;
            border-bottom: 1px solid #e7e7e7;
            border-radius: 0;
            right: -7px;
            height: 37px
        }

        .kppSearch > .search-box > .searchContainer > .mainHideIcon {
            right: 3px
        }

.kpp-check {
    opacity: .5;
    cursor: not-allowed
}

.kppView {
    float: right
}

.kpp-details {
    background: #f0f0f0
}

.kpp-tbl > thead > tr > th, .kpp-tbl > tbody > tr > td {
    width: 20%
}

    .kpp-tbl > thead > tr > th:nth-child(3), .kpp-tbl > tbody > tr > td:nth-child(3) {
        width: 40%
    }

    .kpp-tbl > thead > tr > th:nth-child(4), .kpp-tbl > tbody > tr > td:nth-child(4), .kpp-tbl > thead > tr > th:nth-child(5), .kpp-tbl > tbody > tr > td:nth-child(5) {
        width: 10%
    }

.review-period {
    float: right
}

    .review-period span.review-label {
        float: left;
        color: #222222
    }

    .review-period .custop-period {
        float: right;
        width: 75px;
        margin: 0
    }

    .review-period .bootstrap-select.btn-group {
        margin-bottom: 0;
        margin-top: 0;
        padding-left: 8px
    }

        .review-period .bootstrap-select.btn-group button {
            border-bottom: none !important;
            padding-top: 0;
            padding-bottom: 0
        }

    .review-period .bootstrap-select > .dropdown-toggle {
        padding-right: 12px
    }

    .review-period .bootstrap-select.btn-group .dropdown-toggle .caret {
        right: 0;
        margin-top: -3px
    }

.modal.in {
    -webkit-perspective: 2000px;
    -moz-perspective: 2000px;
    -ms-perspective: 2000px;
    -o-perspective: 2000px;
    perspective: 2000px
}

    .modal.in .modal-dialog.aside {
        -webkit-transform: -340px;
        -moz-transform: -340px;
        -ms-transform: -340px;
        -o-transform: -340px;
        transform: -340px;
        -webkit-transform: scale(0.8) rotateY(45deg) translateZ(-340px);
        -ms-transform: scale(0.8) rotateY(45deg) translateZ(-340px);
        -o-transform: scale(0.8) rotateY(45deg) translateZ(-340px);
        transform: scale(0.8) rotateY(45deg) translateZ(-340px);
        -webkit-transform-style: preserve-3d;
        -ms-transform-style: preserve-3d;
        -o-transform-style: preserve-3d;
        transform-style: preserve-3d
    }

        .modal.in .modal-dialog.aside.aside-1 {
            -webkit-transform: calc(-300px);
            -moz-transform: calc(-300px);
            -ms-transform: calc(-300px);
            -o-transform: calc(-300px);
            transform: calc(-300px);
            -webkit-transform: scale(0.8) rotateY(45deg) translateZ(calc(-300px));
            -ms-transform: scale(0.8) rotateY(45deg) translateZ(calc(-300px));
            -o-transform: scale(0.8) rotateY(45deg) translateZ(calc(-300px));
            transform: scale(0.8) rotateY(45deg) translateZ(calc(-300px))
        }

        .modal.in .modal-dialog.aside.aside-2 {
            -webkit-transform: calc(-260px);
            -moz-transform: calc(-260px);
            -ms-transform: calc(-260px);
            -o-transform: calc(-260px);
            transform: calc(-260px);
            -webkit-transform: scale(0.8) rotateY(45deg) translateZ(calc(-260px));
            -ms-transform: scale(0.8) rotateY(45deg) translateZ(calc(-260px));
            -o-transform: scale(0.8) rotateY(45deg) translateZ(calc(-260px));
            transform: scale(0.8) rotateY(45deg) translateZ(calc(-260px))
        }

        .modal.in .modal-dialog.aside.aside-3 {
            -webkit-transform: calc(-220px);
            -moz-transform: calc(-220px);
            -ms-transform: calc(-220px);
            -o-transform: calc(-220px);
            transform: calc(-220px);
            -webkit-transform: scale(0.8) rotateY(45deg) translateZ(calc(-220px));
            -ms-transform: scale(0.8) rotateY(45deg) translateZ(calc(-220px));
            -o-transform: scale(0.8) rotateY(45deg) translateZ(calc(-220px));
            transform: scale(0.8) rotateY(45deg) translateZ(calc(-220px))
        }

        .modal.in .modal-dialog.aside.aside-4 {
            -webkit-transform: calc(-180px);
            -moz-transform: calc(-180px);
            -ms-transform: calc(-180px);
            -o-transform: calc(-180px);
            transform: calc(-180px);
            -webkit-transform: scale(0.8) rotateY(45deg) translateZ(calc(-180px));
            -ms-transform: scale(0.8) rotateY(45deg) translateZ(calc(-180px));
            -o-transform: scale(0.8) rotateY(45deg) translateZ(calc(-180px));
            transform: scale(0.8) rotateY(45deg) translateZ(calc(-180px))
        }

        .modal.in .modal-dialog.aside.aside-5 {
            -webkit-transform: calc(-140px);
            -moz-transform: calc(-140px);
            -ms-transform: calc(-140px);
            -o-transform: calc(-140px);
            transform: calc(-140px);
            -webkit-transform: scale(0.8) rotateY(45deg) translateZ(calc(-140px));
            -ms-transform: scale(0.8) rotateY(45deg) translateZ(calc(-140px));
            -o-transform: scale(0.8) rotateY(45deg) translateZ(calc(-140px));
            transform: scale(0.8) rotateY(45deg) translateZ(calc(-140px))
        }

.self-view { /*margin-top:80px*/
}

a.bulk-action {
    float: left;
    padding: 0px 10px;
    color: #2196f3;
    text-align: center;
    margin: 0px 10px 0 0;
    border-left: 1px solid #e7e7e7;
    border-right: 1px solid #e7e7e7;
    text-decoration: underline
}

.add-newGoal > a.bulk-action {
    width: 130px;
    position: absolute;
    top: 10px;
    right: 0;
    margin-top: 0
}

.ass-tbl thead tr th, .ass-tbl tbody td {
    width: 7%
}

    .ass-tbl thead tr th:nth-child(7), .ass-tbl td:nth-child(7) {
        width: 10%
    }

    /*.ass-tbl thead tr th:nth-child(3), .ass-tbl td:nth-child(3), .ass-tbl thead tr th:nth-child(6), .ass-tbl td:nth-child(6), .ass-tbl thead tr th:nth-child(8), .ass-tbl td:nth-child(8), .ass-tbl thead tr th:nth-child(9), .ass-tbl td:nth-child(9){width:14%}*/

    .ass-tbl thead tr th:nth-child(3), .ass-tbl td:nth-child(3), .ass-tbl thead tr th:nth-child(6), .ass-tbl td:nth-child(6), .ass-tbl thead tr th:nth-child(8), .ass-tbl td:nth-child(8) {
        width: 14%
    }


.custom-model {
    width: 980px
}

.modal-body > .kpp-details {
    background: transparent
}

.kpp-category {
    display: inline-block;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    padding: 15px;
    width: 100%;
    margin-top: 8px;
    position: relative
}

    .kpp-category.edit-kpp {
        box-shadow: 0 2px 10px rgba(0,0,0,.2);
        transition: all .3s
    }

    .kpp-category:first-child {
        margin-top: 0
    }

    .kpp-category ul {
        width: 100%;
        display: table;
        table-layout: fixed
    }

        .kpp-category ul li {
            border-left: 1px solid #e0e0e0;
            padding: 0 10px;
            display: table-cell;
            text-align: left
        }

            .kpp-category ul li:first-child {
                border-left: 0px;
                padding-left: 0
            }

            .kpp-category ul li:last-child {
                padding-right: 0
            }

            .kpp-category ul li span.kpp-label {
                display: block;
                clear: both;
                font-size: 12px;
                color: #777777
            }

            .kpp-category ul li span.kpp-value {
                display: block;
                clear: both;
                font-size: 14px;
                color: #222222;
                padding-top: 6px;
                white-space: normal
            }

.kpp-achivment ul li:first-child {
    width: 20%;
    vertical-align: top
}

button.action-gseditremark {
    font-family: 'goal' !important;
    font-size: 14px;
    color: #777;
    cursor: pointer;
    display: inline-block;
    margin: 0 10px;
    font-weight: 600;
    position: relative;
    border: none;
    background: transparent;
    position: absolute !important;
    top: 10px;
    right: 10px;
    cursor: auto !important
}

.apprasee-remark > .form-group {
    margin-bottom: 0;
    display: inline-table
}

ul.bjqs {
    position: relative;
    list-style: none;
    padding: 0;
    margin: 0;
    overflow: hidden;
    display: none
}

li.bjqs-slide {
    position: absolute;
    display: none
}

ul.bjqs-controls {
    list-style: none;
    margin: 0;
    padding: 0;
    z-index: 9999
}

    ul.bjqs-controls.v-centered li {
        position: absolute;
        top: 45%;
        border-radius: 50px;
        width: 30px;
        height: 30px;
        padding: 6px 0px 0 10px
    }

        ul.bjqs-controls.v-centered li a {
            display: block;
            color: rgba(119,119,119,1);
            font-size: 15px
        }

.custom-action {
}

ul.bjqs-controls.v-centered li a:hover {
    color: #222
}

ul.bjqs-controls.v-centered li.bjqs-next {
    right: -30px;
    background: #f1f2f2
}

ul.bjqs-controls.v-centered li.bjqs-prev {
    left: -3%;
    background: #f1f2f2;
    transform: rotate(180deg)
}

ol.bjqs-markers {
    list-style: none;
    padding: 0;
    margin: 0;
    width: 100%;
    display: none
}

    ol.bjqs-markers.h-centered {
        text-align: center
    }

    ol.bjqs-markers li {
        display: inline
    }

        ol.bjqs-markers li a {
            display: inline-block
        }

p.bjqs-caption {
    display: block;
    width: 96%;
    margin: 0;
    padding: 2%;
    position: absolute;
    bottom: 0
}

.update-goal {
    background: #fff;
    display: inline-block;
    padding: 15px;
    border-radius: 4px;
    width: 100%
}

#editsubGoal > .target-unit > .btn-group > .dropdown-menu.open, #editsubGoal1 > .target-unit > .btn-group > .dropdown-menu.open {
    top: auto;
    bottom: 100%;
    min-height: 183px !important;
    border-top: 1px solid #d9d9d9
}

#editsubGoal > .target-unit > .btn-group > .dropdown-menu > .dropdown-menu.inner, #editsubGoal1 > .target-unit > .btn-group > .dropdown-menu > .dropdown-menu.inner {
    min-height: 182px !important
}

.select-review {
    float: right
}

    .select-review a {
        color: #222
    }

.review-select {
    top: 17px;
    border-radius: 4px;
    min-width: 125px;
    left: -36px
}

tr.tss-view:before {
    content: '';
    position: absolute;
    right: 0;
    border: 3px solid orange;
    height: 100%;
    border-radius: 0 4px 4px 0px;
}
/*.detail-view>tbody>tr{cursor:pointer}*/
.admin-dashboard {
    margin-top: 60px;
}

    .admin-dashboard > .team-card > .performance-role > .list-view ul li:first-child {
        padding-left: 16px;
        left: -13%;
        width: 13%;
    }

.admin-action {
    margin-left: 99px;
    margin-top: 30px
}

    .admin-action ul li {
        width: 32%;
        float: left;
        text-align: left;
        margin-right: 2%;
    }

        .admin-action ul li a {
            color: #777777;
            display: block;
            padding: 40px 0 40px 24px;
            border: 1px solid #fff;
            transition: .5s;
            border-radius: 5px;
            background: #fff;
            font-size: 20px;
        }

            .admin-action ul li a:hover, .admin-action ul li a.active {
                color: #2b99f0;
                border-color: #2b99f0;
                transition: .5s;
            }

        .admin-action ul li:last-child {
            margin-right: 0;
        }

        .admin-action ul li.excelUpload a {
            background: #fff url(../images/excelUpload-incative.png) 91% 21px no-repeat;
            background-size: 70px 70px;
        }

            .admin-action ul li.excelUpload a:hover {
                background: #fff url(../images/excelUpload-active.png) 91% 21px no-repeat;
                background-size: 70px 70px;
            }

        .admin-action ul li.bulkUpload a {
            background: #fff url(../images/bulkupload-inactive.png) 91% 21px no-repeat;
            background-size: 70px 70px;
        }

            .admin-action ul li.bulkUpload a:hover {
                background: #fff url(../images/bulkupload-active.png) 91% 21px no-repeat;
                background-size: 70px 70px;
            }

        .admin-action ul li.searchEmployee a {
            background: #fff url(../images/employee-inactive.png) 91% 21px no-repeat;
            background-size: 70px 70px;
        }

            .admin-action ul li.searchEmployee a:hover {
                background: #fff url(../images/employee-active.png) 91% 21px no-repeat;
                background-size: 70px 70px;
            }

.newCard {
    border: 1px solid #e8e8e8;
}

.templteUpload {
    border: 1px dashed #d3d3d3;
    padding: 20px;
    float: left;
    width: 100%;
    border-radius: 4px;
    position: relative;
}

    .templteUpload h2 {
        margin: 0;
        font-size: 14px;
        position: absolute;
        top: -10px;
        background: #f0f0f0;
        padding: 0 10px;
        color: #f58220;
    }

.middle-or {
    width: 100%;
    text-align: center;
    padding: 15px;
    display: inline-block;
    color: #f58220;
}

.upload {
    color: #375884;
    font-size: 20px;
    font-family: 'OpenSans-Light',sans-serif;
    display: inline-block;
    width: 100%;
    text-align: center;
    float: left;
}

.dropzone {
    cursor: pointer;
    width: 100%;
    float: left;
    z-index: 1;
    position: relative;
}

.uploadList {
    position: relative;
    z-index: 8;
    margin: 0 auto;
    width: 430px;
}

.upload-icon {
    font-family: 'goalFileUpload' !important;
    font-size: 20px;
    font-weight: 600;
    border: 1px dashed #b1b1b1;
    border-radius: 50%;
    padding: 16px;
    float: left;
    color: #f4772b;
    width: 55px;
    height: 55px;
    z-index: 1;
    position: relative;
}

.upload-icon-admin {
    font-size: 20px;
    font-weight: 600;
    border: 1px dashed #b1b1b1;
    border-radius: 50%;
    padding: 16px;
    float: left;
    color: #f4772b;
    width: 55px;
    height: 55px;
    z-index: 1;
    position: relative;
}

#dz-preview-template {
    float: left;
    width: calc(100% - 400px);
    max-height: 55px;
    overflow: hidden;
    overflow-y: auto;
    position: absolute;
    left: 400px;
}

.dz-preview {
    width: 33%;
    float: left;
    border-bottom: 1px solid #edf0f3;
    padding: 8px 20px 8px 15px;
    margin-bottom: 0;
    border-left: 1px solid #8BC43F;
    position: relative;
    z-index: 8;
}
/*.dz-preview {
    width: 26%;
    max-width: 178px;
    float: left;
    padding: 8px 12px;
    margin-bottom: 0;
    border: 1px solid #8BC43F;
    border-radius: 4px;
    position: relative;
    z-index: 8;
    background-color: #fff;
}*/

.dz-filename > span {
    width: 100%;
    font-size: 12px;
    color: rgba(85,88,132,.9);
    float: left;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    cursor: pointer;
    margin-right: 15px !important;
    text-align: left;
}

.dz-size span {
    font-size: 14px;
    color: rgba(85,88,132,.9);
    float: right;
    padding-right: 20px;
}

.closeP {
    float: right;
    padding-top: 0px;
    padding-right: 10px;
    font-size: 16px;
    position: absolute;
    right: 0;
    top: 9px;
    color: rgba(85,88,132,.9);
}

.dz-preview .dz-progress {
    display: block;
    height: 4px !important;
    border-radius: 2px !important;
    width: 88.5% !important;
    overflow: hidden !important;
    left: 5% !important;
}


/*.closeP:before {
    font-family: 'hdrFont' !important;
    content: "\e93e" !important;
}*/

.upload small {
    font-size: 12px;
    padding-left: 25px;
    color: rgba(55,88,132,.6);
}

.dz-default {
    position: relative;
    z-index: 8;
    margin: 0 auto;
    width: 430px;
}

.dz-started > .uploadList {
    float: left;
    width: 57px;
    position: absolute;
}

.dz-started > .dz-message {
    float: left;
    width: 385px;
    font-size: 18px;
    padding-top: 5px;
    padding-left: 60px;
}

.customGroup textarea.form-control {
    border-bottom: 0 !important;
}

.customGroup.focused .form-control {
    border: 0px !important;
}

.mtop20 {
    margin-top: 20px;
}

.selectBox {
    width: 20%;
    padding: 0 10px;
    margin: 0px 0 20px;
    border: 1px solid #e8e8e8;
    float: left;
}

.customButton {
    border: 1px dashed #777;
    text-transform: capitalize;
    color: #777777;
    background: transparent;
    margin: 13px 0 0 25px;
    padding: 10px;
}

.exDownload {
    float: left;
    padding: 5px 10px 0 0;
}


/*----owlCarousel custon Css-*/
.owl-dots {
    display: none;
}

.owl-nav .disabled {
    opacity: 0;
    cursor: default !important;
}

.owl-nav > button {
    position: absolute;
    top: 45%;
    width: 30px;
    height: 30px;
    background: #f1f2f2 !important;
    border-radius: 0px 30px 30px 0px;
}

button.owl-prev {
    left: -4.1%;
    transform: rotate(180deg);
}

button.owl-next {
    right: -4.1%;
}


/*----owlCarousel custon Css-*/
.owl-dots {
    display: none;
}

.owl-nav .disabled {
    opacity: 0;
    cursor: default !important;
}

.owl-nav > button {
    position: absolute;
    top: 45%;
    width: 30px;
    height: 30px;
    background: #f1f2f2 !important;
    border-radius: 0px 30px 30px 0px;
}

button.owl-prev {
    left: -4.1%;
    transform: rotate(180deg);
}

button.owl-next {
    right: -4.1%;
}

.file-upload {
    position: absolute;
    overflow: hidden;
    width: 100%;
    height: 100%;
    color: #212121;
    font-size: 16px;
    cursor: pointer;
    text-align: center;
    padding-top: 14px;
    z-index: 9;
    font-weight: 600;
}

    .file-upload input[type=file] {
        position: absolute;
        top: 0;
        right: 0;
        width: 100%;
        height: 100%;
        text-align: center;
        filter: alpha(opacity=0);
        opacity: 0;
        outline: 0;
        background: #fff;
        cursor: inherit;
        display: block;
    }











/*  30th Apr 2018 changes start*/



.cus-breadcrumb {
    float: left;
    border-right: 1px solid #e7e7e7;
    padding-right: 10px;
    margin-right: 10px;
}


.empInfAction {
    float: left;
}




    /*.empInfAction .batchNum:first-child {
    border-right: 0;
    margin-right: 4px;
}*/




    .empInfAction .batchNum {
        color: #777;
        float: left;
        margin-right: 16px;
        /*border-right: 1px solid #e0e0e0;*/
        padding-right: 14px;
        font-size: 11px;
        margin-top: 3px;
        position: relative;
    }


    .empInfAction .batchCount {
        position: relative;
        top: -1px;
        left: -2px;
        display: inline-block;
        cursor: inherit;
    }


.blueBg {
    background: #4696d2 !important;
}

.batchCount {
    width: 8px;
    height: 6px;
    background: #fcbf2f;
    border-radius: 2px;
    position: absolute;
    left: 1px;
    top: 19px;
    cursor: pointer;
}

.cus-batchCount {
    width: 8px;
    height: 6px;
    background: #fcbf2f;
    border-radius: 2px;
    position: absolute;
    left: 9px;
    top: 20px;
    cursor: pointer;
}

.kpp-description h2 input {
    margin-right: 10px;
}


.form-group.multiline > .control-label.staticLable {
    transform: translate3d(0, -15px, 0) scale(1);
}

.form-group.multiline > .control-label.staticLable {
    transform: translate3d(0, -15px, 0) scale(1);
}

.apprasee-remark > .appr-achivment {
    float: left;
    width: 30%;
    margin-top: 8px;
}

.apprasee-remark > .kpp-category {
    float: left;
    width: 70%;
}

.apprasee-remark > .appr-achivment > .form-group:first-child {
    margin-top: 0;
    height: 65px !important;
}

.apprasee-remark > .appr-achivment > .form-group {
    background: #fff;
    margin-bottom: 0;
    width: 93%;
    margin-right: 20px;
    float: left;
    padding: 0 11px 11px;
    height: auto !important;
    border-radius: 4px;
    margin-top: 20px;
    border: 1px solid #e0e0e0;
}

.input-unit {
    position: absolute;
    right: 15px;
    top: 30px;
}

.editremark:hover {
    color: #777 !important;
}

.edit-kpp > button.action-gs {
    position: absolute !important;
    top: 10px;
    right: 5px;
    z-index: 9;
    background: #fff !important;
}

.history-field {
    right: 40px !important;
}

.active-button {
    color: #3ea2f1 !important;
}

.kpp-history {
    float: left;
    width: 100%;
    display: block;
    max-height: 101px;
    overflow: hidden;
    overflow-y: auto;
    min-height: auto;
}

.kpp-historyDetails h2 {
    color: #787878;
    font-size: 12px;
    font-weight: 400;
    margin: 0 0 10px 0;
}

.kpp-history ul {
    display: block !important;
    border-left: 1px solid #777;
    padding-left: 15px;
    float: left;
    margin-left: 5px;
}





.kpp-history li:first-child {
    margin-top: 0;
}

.kpp-history li {
    display: inline-block !important;
    float: left;
    padding: 0 !important;
    border: 0 !important;
    margin-top: 20px;
    position: relative;
}

    .kpp-history li:before {
        content: '';
        position: absolute;
        width: 10px;
        height: 10px;
        border: 1px solid #777;
        border-radius: 50px;
        background: #777;
        left: -20px;
        top: 3px;
    }

.kpp-category ul li span.kpp-userlabel:first-child {
    margin-top: 0;
}


.kpp-category ul li span.kpp-userlabel {
    display: block;
    clear: both;
    font-size: 12px;
    color: #222;
    font-weight: 600;
    margin-top: 20px;
}

.kpp-category ul li span.kpp-value {
    display: block;
    clear: both;
    font-size: 14px;
    color: #222222;
    padding-top: 6px;
    white-space: normal;
}

.kpp-category ul li span.kpp-userlabel {
    display: block;
    clear: both;
    font-size: 12px;
    color: #222;
    font-weight: 600;
    margin-top: 20px;
}

.kpp-category ul li span.kpp-value {
    display: block;
    clear: both;
    font-size: 14px;
    color: #222222;
    padding-top: 6px;
    white-space: normal;
}

.emp-information {
    cursor: pointer;
    color: #777;
    padding-left: 3px;
}






.textarea-field > textarea.form-control, .textbox .remark-option {
    text-shadow: 0 0 0 black !important;
}

.remark-option:focus {
    text-indent: -560px;
}


@media all and (min-width:0\0) and (min-resolution:.001dpcm) {
    .textarea-field > textarea.form-control {
        color: rgba(0, 0, 0, 0.9) !important;
    }
}

/*  30th Apr 2018 changes ends*/
.dropdown-menu > .active > a {
    color: #fff !important;
    background: #2196f3 !important;
}

.multiselect-container > .active > a {
    color: #000 !important;
    background: #2196f3 !important;
}

.appraisee-role {
    margin-top: -25px;
}
/*..Visible to employee css start here..*/

.management-tbl tbody td {
    position: relative;
}

.vis-employee {
    position: absolute;
    width: 15px;
    height: 15px;
    background: #71c05f;
    border-radius: 50px;
    content: '';
    left: -12%;
    top: 33%;
}

    .vis-employee:before {
        content: '\e91b';
        font-family: 'goal' !important;
        position: absolute;
        font-size: 8px;
        color: #fff;
        padding: 2px 4px;
    }

.batchNum > .vis-employee {
    width: 12px;
    height: 12px;
    position: relative;
    float: left;
    top: 3px;
    left: -3px;
}

    .batchNum > .vis-employee:before {
        padding: 2px 3px;
        font-size: 6px;
    }

.editremarkhistory {
    position: absolute !important;
    top: 10px;
    right: 34px;
    cursor: auto !important
}

.kpp-historyDetails {
    float: left;
    width: 100%;
    display: block
}

.kpp-category ul li span.kpp-label {
    display: block;
    clear: both;
    font-size: 12px;
    color: #777777
}

.kpp-category ul li span.kpp-value {
    display: block;
    clear: both;
    font-size: 14px;
    color: #222222;
    padding-top: 6px;
    white-space: normal
}

/*..Visible to employee css ends here..*/


.review-period a.prev-year {
    float: left;
    margin-right: 10px;
    border-right: 1px solid #777;
    padding-right: 10px;
    color: #222;
    text-decoration: underline;
}
/*--------------------------------------------------------------

3 July'18 Sprint II CSS Start Here

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


.upload-list {
    float: left;
    cursor: pointer;
    position: relative;
    width: 30px;
}

    .upload-list > span.docList {
        font-family: 'goalFileUpload' !important;
        font-size: 1.2rem;
        color: #818184;
        padding-top: 3px;
        float: left;
    }

    .upload-list > span.counter {
        top: -4px;
        right: 5px;
        background: #ff8a00;
        font-size: 11px;
        border-radius: 50%;
        line-height: 14px;
        position: absolute;
        color: #fff !important;
        width: 15px;
        height: 15px;
        text-align: center;
        font-family: 'Open Sans',sans-serif;
    }


.upload-box {
    border: 1px dashed #a7d4f7;
    border-radius: 4px;
    margin: 0px 0 15px 0;
    padding: 8px 0;
}



    .upload-box > .sup-doc > .dz-started > .uploadList {
        float: none;
        width: 430px;
        position: relative;
    }

    .upload-box > .sup-doc > .dz-started > .dz-message {
        float: none;
        width: 430px;
        font-size: 100%;
        padding-top: 0;
        padding-left: 0;
    }

.upload-view > #dz-preview-template {
    max-height: 200px !important;
    width: 100% !important;
    left: 0 !important;
    position: relative !important;
    padding: 0;
    float: left;
    overflow: hidden;
    overflow-y: auto;
}


.upload-table {
    margin-bottom: 0;
}

    .upload-table thead th {
        border-bottom: none !important;
        background: #f4f4f4;
        color: #9b9b9b;
        font-size: 12px;
    }

        .upload-table thead th:nth-child(1) {
            width: 40%;
        }

        .upload-table thead th:nth-child(2) {
            width: 10%;
            padding-left: 0;
        }

        .upload-table thead th:nth-child(3) {
            width: 40%;
            /*text-align: right;*/
            padding-right: 30px;
        }

        .upload-table thead th:nth-child(4) {
            width: 10%;
            text-align: right;
        }

.upload-view > #dz-preview-template > .dz-preview {
    width: 100%;
    z-index: 8;
    padding: 5px 8px;
    border-right: 1px solid #edf0f3;
}

    .upload-view > #dz-preview-template > .dz-preview > .dz-details > .dz-filename > span, .upload-view > #dz-preview-template > .dz-preview > .dz-details > .dz-size > span {
        width: 40%;
        float: left;
        padding: 5px 0;
        font-size: 12px;
        color: #222222;
    }

    .upload-view > #dz-preview-template > .dz-preview > a.dz-remove > span {
        padding-right: 36px;
    }



    .upload-view > #dz-preview-template > .dz-preview:nth-of-type(odd) {
        background: #f9f9f9;
    }

.ondemand-feedback {
    width: 100%;
    float: left;
}


    .ondemand-feedback > .ondemant-topHead {
        width: 100%;
        float: left;
        border-bottom: 1px solid #d5d5d5;
        padding-bottom: 15px;
        padding-left: 30%;
        padding-top: 15px;
        transition: all .3s;
    }

        .ondemand-feedback > .ondemant-topHead:hover {
            box-shadow: 0 2px 10px rgba(0,0,0,.2);
            transition: all .3s;
            border-radius: 4px;
        }

        .ondemand-feedback > .ondemant-topHead h2 {
            font-size: 17px;
            color: #2d2d33;
            margin: 0;
            float: left;
        }

        .ondemand-feedback > .ondemant-topHead ul {
            float: left;
        }

            .ondemand-feedback > .ondemant-topHead ul li {
                list-style: none;
                float: left;
                margin-left: 12px;
            }

                .ondemand-feedback > .ondemant-topHead ul li a {
                    padding: 3px 15px;
                    border: 1px solid #52aaf0;
                    border-radius: 50px;
                    color: #2b99f0;
                    font-size: 16px;
                    transition: .3s;
                }

                    .ondemand-feedback > .ondemant-topHead ul li a:hover {
                        background: #52aaf0;
                        color: #fff;
                        transition: .3s;
                    }

.ondemant-topHead ul li a.current {
    background: #52aaf0;
    color: #fff;
    transition: .3s;
}


.feedback-contant {
    float: left;
    width: 100%;
    margin-top: 20px;
}


.detailed-feedback {
    border: 0px;
    margin-bottom: 20px;
    margin-top: 20px;
    display: inline-block;
}

    .detailed-feedback li {
        display: inline-block;
        margin-left: 20px;
    }

        .detailed-feedback li:first-child {
            margin-left: 0px;
        }

        .detailed-feedback li a {
            border: 0;
            border-radius: 0;
            color: #2b99f0;
            width: auto;
            padding: 0;
            font-size: 14px;
        }

        .detailed-feedback li.active a, .detailed-feedback li.active a:hover {
            background: transparent;
            color: #2b99f0;
            border: 0px;
            font-weight: 900;
        }




        .detailed-feedback li:last-child:before, .detailed-feedback li:last-child:after {
            content: '';
            display: block;
            position: absolute;
            pointer-events: none;
            -webkit-transition: left .5s ease;
            transition: left .5s ease;
        }




        .detailed-feedback li:nth-child(1).active ~ li:last-child:after {
            left: -128px;
            width: 76%;
        }

.addApproval li:nth-child(1).active ~ li:last-child:after {
    left: -178px;
    width: 98%;
}



.detailed-feedback li:last-child:after {
    border-bottom: 2px solid #2196f3;
    bottom: -2px;
    left: 0;
    width: 100%;
    z-index: -1;
}

.table-responsive > .feedback-tbl thead tr th, .table-responsive > .feedback-tbl tbody tr td {
    width: 18.8%;
}

    .table-responsive > .feedback-tbl thead tr th:nth-child(6), .table-responsive > .feedback-tbl tbody tr td:nth-child(6) {
        width: 6%;
    }



.table-responsive > .feedback-tbl td.rating-range > .br-wrapper > .br-widget {
    width: 100%;
    padding: 0;
}


    .table-responsive > .feedback-tbl td.rating-range > .br-wrapper > .br-widget a {
        font-size: 15px;
    }

        .table-responsive > .feedback-tbl td.rating-range > .br-wrapper > .br-widget a.br-selected:after {
            color: #efb029;
        }




/*[data-notify="progressbar"] {
	margin-bottom: 0px;
	position: absolute;
	bottom: 0px;
	left: 0px;
	width: 100%;
	height: 5px;
}
[data-notify="container"] {
	display:none;
}*/


.customAlert {
    max-width: 450px;
    margin: 0 auto;
    right: 0;
    left: 0;
    padding: 10px;
    font-size: 14px;
    -webkit-box-shadow: 3px 4px 3px -1px rgba(38,41,42,0.10);
    -moz-box-shadow: 3px 4px 3px -1px rgba(38,41,42,0.10);
    box-shadow: 3px 4px 3px -1px rgba(38,41,42,0.10);
    border-radius: 4px;
    top: 10px;
    border: 1px solid #fff;
    background: #fff;
}

    .customAlert > .tick {
        float: left;
        background: #7cd96a;
        margin: -11px 0 -16px -11px;
        padding: 11px;
        border-radius: 4px 0 0 4px;
    }

        .customAlert > .tick span {
            background: #fff;
            color: #87e775;
            padding: 7px;
            border-radius: 50px;
            font-size: 12px;
            font-weight: 900;
        }

    .customAlert > span.pop {
        width: 85%;
        float: left;
        font-size: inherit;
        color: #222;
        padding: 0;
        text-align: left;
        padding-left: 20px;
    }

    .customAlert > span.close_pop {
        color: #222;
        padding: 6px 0 0;
        font-size: 10px;
        float: right;
        clear: right;
        width: 4%;
    }

.history-listing {
    padding-left: 30px;
    width: 100%;
    float: left;
    position: relative;
}

    .history-listing:before {
        content: '';
        position: absolute;
        border: 1px dashed #d3d3d3;
        height: 100%;
        left: 7px;
        top: 10px;
    }

    .history-listing li {
        width: 100%;
        display: block;
        position: relative;
    }

        .history-listing li.appraisee-listing:after {
            content: '';
            position: absolute;
            border: 1px solid #d3d3d3;
            height: 15px;
            left: -30px;
            background: #f1f2f2;
            width: 15px;
            border-radius: 50px;
            top: 20px;
        }

        .history-listing li:first-child:after {
            top: 0;
        }

    .history-listing ul li .appraise-history {
        display: inline-block;
        width: 100%;
    }

        .history-listing ul li .appraise-history h2 {
            font-size: 13px;
            color: #222;
        }

            .history-listing ul li .appraise-history h2 > span {
                font-size: 12px;
                color: #777777;
            }

        .history-listing ul li .appraise-history .his-containt {
            display: inline-block;
            width: 100%;
            background: #fff;
        }

            .history-listing ul li .appraise-history .his-containt ul li {
                display: inline-block;
                width: auto;
                border-right: 1px solid #ccc;
                padding: 0 10px;
                font-size: 12px;
                color: #787878
            }

                .history-listing ul li .appraise-history .his-containt ul li:nth-child(odd):after {
                    display: none;
                }

                .history-listing ul li .appraise-history .his-containt ul li span {
                    color: #222222
                }

                .history-listing ul li .appraise-history .his-containt ul li:first-child {
                    padding-left: 0;
                }

                .history-listing ul li .appraise-history .his-containt ul li:last-child {
                    border-right: 0px;
                    padding-right: 0;
                }

            .history-listing ul li .appraise-history .his-containt h3 {
                font-size: 12px;
                color: #777777;
                display: block;
                margin-top: 10px;
            }

        .history-listing ul li .appraise-history .appraisee-remarks h3 {
            margin-top: 0 !important;
        }

        .history-listing ul li .appraise-history .his-containt p {
            font-size: 12px;
            color: #222222;
            margin-bottom: 0;
        }

#kppHistorySlider > .owl-height {
    overflow: hidden;
    overflow-y: auto;
    height: 450px !important;
    width: 100% !important;
}

.apprOndend-tbl thead tr th, .apprOndend-tbl tbody tr td {
    width: 18% !important;
}

    .apprOndend-tbl thead tr th:nth-child(6), .apprOndend-tbl tbody tr td:nth-child(6) {
        width: 10% !important;
    }

.closeStage-tbl thead tr th, .closeStage-tbl tbody tr td {
    width: 20% !important;
}






.apprOndend-tbl td.rating-range > .br-wrapper > .br-widget {
    width: 100%;
    padding: 0;
}


    .apprOndend-tbl td.rating-range > .br-wrapper > .br-widget a {
        font-size: 15px;
    }

        .apprOndend-tbl td.rating-range > .br-wrapper > .br-widget a.br-selected:after {
            color: #efb029;
        }

        .apprOndend-tbl td.rating-range > .br-wrapper > .br-widget a.br-active:after {
            color: #efb029;
        }

        .apprOndend-tbl td.rating-range > .br-wrapper > .br-widget a.br-selected:after {
            color: #efb029;
        }

.addiReq-tbl thead tr th, .addiReq-tbl tbody tr td {
    width: 14% !important
}

.addiReq-tbl th:nth-child(3), .addiReq-tbl td:nth-child(3) {
    width: 20% !important
}

.addiReq-tbl th:nth-child(7), .addiReq-tbl td:nth-child(7) {
    width: 10% !important
}

.addiReq-tbl th:first-child, .addiReq-tbl td:first-child {
    padding-left: 25px !important
}

.iniNew-goal {
    float: right;
    padding-top: 10px;
    position: relative;
}

    .iniNew-goal li {
        float: left;
        padding: 0 10px;
        border-left: 1px solid #bbb;
    }

        .iniNew-goal li:first-child {
            padding-left: 0;
            border-left: none;
        }

        .iniNew-goal li:last-child {
            padding-right: 0;
        }

        .iniNew-goal li a {
            font-size: 12px;
            color: #319aed;
            font-weight: 600;
            border-bottom: 1px solid #2b99f0;
        }

        .iniNew-goal li:nth-child(2) a {
            border-bottom: 0px;
            font-weight: normal;
        }

            .iniNew-goal li:nth-child(2) a span {
                font-size: 18px;
                color: #828282;
                float: left;
                padding-top: 2px;
            }

.createGperiod {
    float: left;
    width: 100%;
    padding: 10px 15px;
    position: relative;
}


.dpCustom::after {
    font-family: 'goalFileUpload' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\e90a" !important;
    font-size: 14px;
    right: 1px;
    top: 33px;
    position: absolute;
    pointer-events: none;
}

.textarea-controll {
    margin-top: 10px;
}

    .textarea-controll > textarea {
        padding-top: 0;
    }

    .textarea-controll > label.staticLable {
        transform: translate(0, -10px) scale(0.90);
    }

    .textarea-controll.focused .control-label.staticLable {
        transform: translate(0, -10px) scale(0.90);
    }

.errorL4 {
    position: absolute;
    border: 1px solid #ff0c0c;
    border-radius: 4px;
    background: #fff;
    top: 63px;
    left: 0px;
    z-index: 4;
    padding: 5px 10px;
    display: none;
}

    .errorL4 p {
        font-size: 13px;
        color: #ff0c0c;
        text-align: center;
        margin: 0;
    }

    .errorL4 ul {
        text-align: center;
        padding-top: 5px;
    }

        .errorL4 ul li {
            display: inline-block;
            padding: 0 10px;
        }

            .errorL4 ul li a {
                color: #777777;
            }

    /*.errorL4:before {
	position:absolute;
	content:'';
width: 0;
height: 0;
border-style: solid;
border-width: 0 100px 100px 100px;
border-color: transparent transparent #007bff transparent;
}*/








    .errorL4:before {
        content: "";
        position: absolute;
        top: -12px;
        left: 45px;
        border-style: solid;
        border-width: 0px 11px 11px;
        border-color: #ff0c0c transparent;
        display: block;
        width: 0;
        z-index: 0;
    }

    .errorL4:after {
        content: "";
        position: absolute;
        top: -11px;
        left: 45px;
        border-style: solid;
        border-width: 0px 11px 11px;
        border-color: #fff transparent;
        display: block;
        width: 0;
        z-index: 1;
    }

/*--------------------------------------------------------------
Bootstrap Notify 3.1.3 Css Start here
---------------------- ----------------------------------------*/

[data-notify="container"] {
    padding: 16px 15px 15px 0;
    border-left: 0px;
    box-shadow: 0 2px 10px rgba(0,0,0,.2);
}

    [data-notify="container"].alert-success {
        color: #3c763d;
        background-color: #fff;
        border-color: #d6e9c6;
    }

    [data-notify="container"].alert-warning {
        color: #3c763d;
        background-color: #fff;
        border-color: #E9CFCF;
    }

[data-notify="icon"] {
    padding: 19px 10px 17px;
    border-radius: 4px 0 0 4px;
    background: #8aeb78;
    background: -moz-linear-gradient(-45deg, #8aeb78 0%, #6ac259 100%);
    background: -webkit-linear-gradient(-45deg, #8aeb78 0%,#6ac259 100%);
    background: linear-gradient(135deg, #8aeb78 0%,#6ac259 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8aeb78', endColorstr='#6ac259',GradientType=1 );
}

    [data-notify="icon"] > span.susIcon {
        background: #fff;
        border-radius: 50px;
        color: #7bd869;
        padding: 10px;
        font-size: 15px;
        font-weight: bolder;
    }
/*.alert-success>[data-notify="icon"] {
	background:#6cc55b;
}
.alert-warning>[data-notify="icon"] {
	background:#f00;
}*/


[data-notify="message"] {
    font-size: 16px;
    color: #222222;
    padding-left: 10px;
}

.notfyplash {
    background: rgba(0,0,0,.5);
    bottom: 0;
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 99;
    display: none;
}


/*--------------------------------------------------------------
Bootstrap Notify 3.1.3 Css Ends here
---------------------- ----------------------------------------*/

/*--------------------------------------------------------------
	Custom Checkbox and Radio
---------------------- ----------------------------------------*/

.check-box {
    position: relative
}

    .check-box label {
        margin: 0;
        padding-left: 20px;
        cursor: pointer;
        font-weight: 400
    }

    .check-box.radio-inline label {
        padding-left: 4px
    }

        .check-box.radio-inline label[for="red"] {
            color: #e70b15;
            font-size: 13px;
            font-weight: 400
        }

        .check-box.radio-inline label[for="amber"] {
            color: #e88300;
            font-size: 13px;
            font-weight: 400
        }

        .check-box.radio-inline label[for="green"] {
            color: #519d07;
            font-size: 13px;
            font-weight: 400
        }

    .check-box input[type=radio],
    .check-box input[type=checkbox] {
        visibility: hidden;
        position: absolute;
        margin: 0
    }

        .check-box input[type=radio]:checked + label:before,
        .check-box input[type=checkbox]:checked + label:before {
            content: "\e9c8";
            background: #2196f3;
            color: #fff;
            border-color: #2196f3
        }

        .check-box input[type=radio] + label:before, .check-box input[type=checkbox] + label:before {
            height: 16px;
            width: 16px;
            line-height: 8px;
            content: "";
            font-size: 70%;
            padding: 3px;
            font-family: 'icomoon15616' !important;
            display: inline-block;
            border: 1px solid #777;
            position: absolute;
            left: 0;
            top: 0px;
            border-radius: 2px;
            background: #fff
        }

.fillCheckbox input[type=radio] + label:before, .fillCheckbox input[type=checkbox] + label:before {
    top: 1px
}

.check-box li {
    position: relative;
    display: inline-block;
    margin: 0 10px 0 0
}

    .check-box li:first-child {
        font-size: 12px
    }

.check-box input[type=radio] + label:before {
    border-radius: 50%
}

.check-box input[type=radio]:checked + label:before {
    border-color: #2196f3;
    content: "";
    box-shadow: inset 0px 0px 0px 2px rgba(255,255,255,0.9)
}

.check-box input[type=radio] + label:before {
    top: 3px
}

/*--------------------------------------------------------------
	Custom Checkbox and Radio
---------------------- ----------------------------------------*/

.backDate-tbl thead tr th, .backDate-tbl tbody tr td {
    width: 15% !important;
}

    .backDate-tbl thead tr th:nth-child(1), .backDate-tbl tbody tr td:nth-child(1) {
        width: 3% !important;
    }

/*.backDate-tbl thead tr th:nth-child(3), .backDate-tbl tbody tr td:nth-child(3) {
        width: 15% !important;
    }

    .backDate-tbl thead tr th:nth-child(4), .backDate-tbl tbody tr td:nth-child(4) {
        width: 8% !important;
    }

    .backDate-tbl thead tr th:nth-child(7), .backDate-tbl tbody tr td:nth-child(7) {
        width: 29% !important;
    }*/





.containt-elips {
    float: left;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    width: 100%;
    display: inline-block;
}



.detailedFeedback > .owl-dots {
    display: block;
}

#datepicker-error {
    top: 90%;
}



:root .form-group input[type="text"] {
    height: 56px \9;
    padding-top: 30px \9
}

:root .filterSearchField.form-group input[type="text"] {
    height: 30px \9;
    padding-top: 0px \9
}
/*:root .form-group input[type="text"]{height:56px \0/IE9;padding-top:30px \0/IE9}

.ie10 .form-group input[type="text"] {
  height:auto;padding-top:5px;
 }*/


.remarkLarge .popover-content p {
    margin: 0
}

/*  -- IE 9 Browser upload file css --*/
.dz-browser-not-supported > .uploadList {
    display: none;
}

.dz-browser-not-supported > .dz-fallback input[type="file"] {
    float: left;
}
/*  -- IE 9 Browser upload file css --*/


.addapp-tbl tbody tr {
    cursor: pointer;
}

    .addapp-tbl thead tr th, .addapp-tbl tbody tr td {
        width: 23% !important
    }

.addapp-tbl th:first-child, .addapp-tbl td:first-child {
    width: 20% !important;
    padding-left: 25px !important
}

.addapp-tbl th:last-child, .addapp-tbl td:last-child {
    width: 11% !important;
    padding-right: 25px !important
}

.all-covered {
    width: 100%;
    float: left;
    position: relative
}

    .all-covered > .panel-group {
        margin-bottom: 0px
    }

        .all-covered > .panel-group > .panel-default + .panel-default {
            margin-top: 20px
        }


.addRequest-tbl thead tr th:nth-child(1), .addRequest-tbl tbody tr td:nth-child(1) {
    width: 10% !important
}

.addRequest-tbl thead tr th:nth-child(2), .addRequest-tbl tbody tr td:nth-child(2) {
    width: 15% !important
}

.addRequest-tbl thead tr th:nth-child(3), .addRequest-tbl tbody tr td:nth-child(3) {
    width: 35% !important
}

.addRequest-tbl thead tr th:nth-child(4), .addRequest-tbl tbody tr td:nth-child(4) {
    width: 40% !important;
    padding-bottom: 0 !important;
}

.addRequest-tbl tbody td:last-child .custom-textarea > textarea {
    height: 30px;
    border: 0;
    box-shadow: none;
    resize: none;
    border-radius: 0;
    padding: 0;
    font-size: 12px;
}


.form-group.addrequ {
    position: relative;
    width: 100%;
    float: left;
    margin-top: 15px;
    margin-bottom: 0;
    background: #fff;
    padding: 25px 15px 15px;
    border-radius: 4px;
}

    .form-group.addrequ label.staticLable {
        font-weight: 400;
        transform: none;
        position: absolute;
        top: 8px;
        left: 15px;
        z-index: 5;
        font-size: 11.5px;
        color: #787878;
    }

    .form-group.addrequ textarea {
        resize: none;
        border: 0 !important;
        padding: 0;
        margin: 10px 0 0;
        height: auto;
    }

.history-listed h2.his-list {
    width: 100%;
    float: left;
    padding-bottom: 10px;
    font-size: 14px;
    color: #777777;
    margin-bottom: 0;
}

#kppHistorypage {
    position: relative
}

    #kppHistorypage > .owl-nav > button {
        display: none
    }

    #kppHistorypage > .owl-dots > button > span {
        display: none;
    }


    #kppHistorypage > .owl-dots {
        counter-reset: dots;
        display: block
    }

        #kppHistorypage > .owl-dots > button.owl-dot:before {
            counter-increment: dots;
            content: counter(dots)
        }


        #kppHistorypage > .owl-dots > button.owl-dot {
            margin: 0 4px;
            border-radius: 50px;
            padding: 3px 7px !important;
            font-size: 10px
        }

            #kppHistorypage > .owl-dots > button.owl-dot.active {
                color: #2196f3;
                border: 1px solid #2196f3
            }

    #kppHistorypage > .owl-dots {
        position: absolute;
        top: -10px;
        right: 10px
    }

.detailed-history > .history-listing ul li .appraise-history .his-containt {
    width: 99%
}

.history-listed > .kpp-category {
    width: 99%;
}

.viewDescription {
    font-size: 16px;
    cursor: pointer;
}

.full-description p {
    margin-bottom: 0
}

a.bulk-action span {
    font-size: 18px;
    color: #828282;
    float: left;
    padding-top: 2px;
}

.filter-count {
    top: -3px;
    right: -5px;
    background: #ff8a00;
    font-size: 8px;
    border-radius: 50%;
    line-height: 11px;
    position: absolute;
    color: #fff !important;
    width: 12px;
    height: 12px;
    text-align: center;
    z-index: 1;
}

#showFilter {
    display: none;
}

.gs-close.action-gs.reject-list {
    font-size: 12px;
}

div.datepicker.datepicker-dropdown.dropdown-menu.datepicker-orient-right.datepicker-orient-top {
    z-index: 9999 !important;
}

.rejectionRemarks {
    float: left;
    width: 100%;
    padding: 0 15px 15px;
    position: relative;
}

    .rejectionRemarks label.control-label {
        color: #787878 !important;
        font-size: 12px;
    }

    .rejectionRemarks .help-block {
        line-height: 0;
    }

.close-stage {
    float: right;
}

    .close-stage > .stage-switch {
        color: #2196f3;
        text-decoration: underline;
        cursor: pointer;
    }




.closedBackdate-tbl thead tr th, .closedBackdate-tbl tbody tr td {
    width: 15% !important;
}

    .closedBackdate-tbl thead tr th:nth-child(3), .closedBackdate-tbl tbody tr td:nth-child(3) {
        width: 8% !important;
    }

    .closedBackdate-tbl thead tr th:nth-child(6), .closedBackdate-tbl tbody tr td:nth-child(6) {
        width: 32% !important;
    }


.showFeedback li:nth-child(1).active ~ li:last-child:after {
    left: -170px;
    width: 127%;
}


.allcloaseFeedback > .table-responsive > .dataTables_wrapper > .row > .col-xs-12 > .dataTables_filter {
    right: 16px;
    top: -50px;
}

    .allcloaseFeedback > .table-responsive > .dataTables_wrapper > .row > .col-xs-12 > .dataTables_filter > label > input.form-control {
        width: 250px;
        padding: 10px 30px 10px 10px;
        border-radius: 4px;
        height: 35px;
    }

    .allcloaseFeedback > .table-responsive > .dataTables_wrapper > .row > .col-xs-12 > .dataTables_filter > button.searhFilter {
        top: 8px;
    }

.detailedFeed-tbl {
}

    .detailedFeed-tbl thead tr th, .detailedFeed-tbl tbody tr td {
        width: 23% !important;
    }

        .detailedFeed-tbl thead tr th:nth-child(5), .detailedFeed-tbl tbody tr td:nth-child(5) {
            width: 8% !important;
        }


.backRem-tbl thead tr th, .backRem-tbl tbody tr td {
    width: 10% !important
}

.backRem-tbl th:nth-child(2), .backRem-tbl td:nth-child(2), .backRem-tbl th:nth-child(3), .backRem-tbl td:nth-child(3) {
    width: 15% !important
}

.backRem-tbl th:nth-child(5), .backRem-tbl td:nth-child(5), .backRem-tbl th:nth-child(6), .backRem-tbl td:nth-child(6) {
    width: 25% !important
}

.remarksElips {
    float: left;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    width: 100%;
    cursor: pointer;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #999 !important;
}

::-ms-input-placeholder { /* Microsoft Edge */
    color: #999 !important;
}

.goal-tbl tbody tr.withBack {
    background: url(../images/pattern.png) center center repeat-x !important;
}


/*Add new css for dropzone*/


.receive-fed h2 {
    margin: 15px 0 5px 0;
    color: #2b99f0;
    font-size: 1rem;
    font-weight: 600;
    display: inline-block;
    width: 100%
}

.sup-doc > .dropzone > .uploadList {
    width: 530px
}

.sup-doc > .dropzone > .dz-default {
    width: 530px
}

.sup-doc > .dz-started > .uploadList {
    float: none;
    width: 530px;
    position: relative
}

.sup-doc > .dz-started > .dz-message {
    float: none;
    width: 530px;
    font-size: 100%;
    padding-top: 0;
    padding-left: 0
}

.receive-fed + .upload-section {
    margin-bottom: 10px;
    margin-top: 0
}

.upload-section > h2 {
    margin-bottom: 15px
}

.receive-fed > #dz-preview-template {
    max-height: 200px !important;
    width: 100% !important;
    left: 0 !important;
    position: relative !important;
    padding: 0
}

.receive-fed > .card-box > .dz-preview {
    width: 100%;
    border-left: 0px;
    z-index: 8;
    padding: 5px 8px
}

    .receive-fed > .card-box > .dz-preview:nth-of-type(odd) {
        background: #f9f9f9
    }

    .receive-fed > .card-box > .dz-preview:hover {
        background: #fffbe1
    }

    .receive-fed > .card-box > .dz-preview > .dz-details > .dz-filename > span {
        width: 40%;
        padding-top: 5px
    }

    .receive-fed > .card-box > .dz-preview > .dz-details > .dz-size > span {
        float: left;
        width: 10%;
        padding: 0;
        padding-top: 5px
    }

    .receive-fed > .card-box > .dz-preview > .dz-details > .dz-description > input {
        width: 40%;
        float: left;
        border: 1px solid #e5e5e5;
        padding: 2px 10px;
        border-radius: 4px
    }

    .receive-fed > .card-box > .dz-preview > a.dz-remove span {
        font-size: 14px;
        color: #737373;
        padding-right: 18px
    }

.table-responsive > .upDoc-tbl thead th, .table-responsive > .upDoc-tbl tbody td {
    width: 40%;
    overflow: hidden;
}

.table-responsive > .upDoc-tbl thead tr th:nth-child(2), .table-responsive > .upDoc-tbl td:nth-child(2) {
    width: 60%;
    white-space: normal
}



/* Start New CSS for Dashboard */
/*.appraise-head>.team-header{width:115px;padding:25px 0;top:-10px}
.appraise-head>.team-caption{width:calc(100% - 115px)}
.appraise-head>.team-caption li{padding:8px 10px}*/
.appraise-head > .team-header {
    width: 100px;
    padding: 25px 0;
    top: -10px
}

.appraise-head > .team-caption {
    width: calc(100% - 100px)
}

    .appraise-head > .team-caption li {
        padding: 8px 10px
    }

/*.appraise-head>.team-caption.reviewer li{padding:38px 0px}*/
.lob {
    background: #844de9;
    background: -moz-linear-gradient(-45deg, #844de9 0%, #f4c1d4 100%);
    background: -webkit-linear-gradient(-45deg, #844de9 0%,#f4c1d4 100%);
    background: linear-gradient(135deg, #844de9 0%,#f4c1d4 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#844de9', endColorstr='#f4c1d4',GradientType=1 )
}

.no_leftPadding > .label {
    color: #787878 !important
}

.appraise-head > .team-caption.calibration li {
    padding: 17px 5px;
}

.appraise-head > .team-caption.LOBHRHead li {
    padding: 38px 0px
}
/* End New CSS for Dashboard */


/** Css By Pradeep **/
.afterSuccess {
    background: #6c9e31;
}

.receive-fed > .card-box > .afterSuccess.dz-preview:nth-of-type(odd) {
    background: #6c9e31;
}

.receive-fed > .card-box > .afterSuccess.dz-preview:hover {
    background: #6c9e31;
    color: #fff;
}

.receive-fed > .card-box > .afterSuccess.dz-preview > a.dz-remove span {
    padding-top: 2px;
    color: #fff;
}

.receive-fed > .card-box > .afterSuccess.dz-preview > .dz-details > .dz-description > input {
    padding: 0 10px 3px;
    border: none;
    background: transparent;
    color: #fff;
}

.receive-fed > .card-box > .afterSuccess.dz-preview > .dz-details > .dz-size > span {
    padding-top: 0;
    color: #fff;
}

.receive-fed > .card-box > .afterSuccess.dz-preview > .dz-details > .dz-filename > span {
    padding-top: 0;
    color: #fff;
}


/*New 10/1/2019*/
.goal-reviewList ul li {
    border-right: 1px solid #e7e7e7 !important;
    padding: 0 5px !important;
    font-size: 12px !important;
    border-left: 0 !important;
    margin: 0 !important;
}

    .goal-reviewList ul li:first-child {
        padding-left: 0 !important
    }

    .goal-reviewList ul li:last-child {
        border-right: 0 !important;
    }

    .goal-reviewList ul li a {
        color: #2b99f0;
    }

        .goal-reviewList ul li a.onDe {
            text-decoration: underline;
        }



.upload-file {
    position: relative;
    float: left;
}

    .upload-file > span.docList {
        font-family: 'goalFileUpload' !important;
        color: #2b99f0;
        float: left;
        cursor: pointer;
    }

    .upload-file > span.counter {
        top: -6px;
        right: -3px;
        background: #ff8a00;
        font-size: 7px;
        border-radius: 50%;
        line-height: 10px;
        position: absolute;
        color: #fff !important;
        width: 10px;
        height: 10px;
        text-align: center;
        font-family: 'Open Sans',sans-serif;
    }
/*end*/
/*Created by karthik 11/1/19*/

.addapp-tbl1 tbody tr {
    /*cursor: pointer;*/
}

    .addapp-tbl1 thead tr th, .addapp-tbl1 tbody tr td {
        width: 23% !important;
    }

.addapp-tbl1 th:first-child, .addapp-tbl1 td:first-child {
    width: 20% !important;
    padding-left: 25px !important;
}

.addapp-tbl1 th:last-child, .addapp-tbl1 td:last-child {
    width: 11% !important;
    padding-right: 25px !important;
}


/*End*/
/* % point raitng abhi-----------------*/
.pointFeedback li:nth-child(1).active ~ li:last-child:after {
    left: -133px;
    width: 95%;
}
/*End*/
/*******************
14 June
********************/


#kppDetails .form-group.multiline textarea + .countCharacter {
    margin-top: 0;
    color: #656565;
    opacity: 1;
}

/* START New CSS for PIP 11 SEPT 2019  */

/* =====================================================================================  
                                          PIP
  ===================================================================================== */
.mtb20 {
    margin: 20px 0 10px !important
}

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

.mt48 {
    margin-top: 48px !important
}

.pl0 {
    padding-left: 0 !important
}

.pr0 {
    padding-right: 0 !important
}

.pt7 {
    padding-top: 7px !important
}

.mTop20 {
    margin-top: 20px
}

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

.mt30 {
    margin-top: 30px !important
}

.htNne {
    height: inherit !important
}

.no_margin {
    margin: 0 !important
}

.noPadding {
    padding: 0 !important
}

.mTop20 {
    margin-top: 30px;
}

.PIPTable input[type=checkbox] {
    display: none
}

.checkbox label:before {
    border-radius: 3px
}

.control input {
    position: absolute;
    z-index: -1;
    opacity: 0
}

.controlLabel {
    height: 16px;
    width: 16px;
    margin: auto;
    border: 1px solid #ccc;
    border-radius: 2px
}

.control {
    display: inline-block;
    position: relative;
    cursor: pointer;
    top: 2px;
    margin: 0;
}

    .control input:checked ~ .controlLabel:after {
        display: block
    }

.controlLabel:after {
    left: 6px;
    top: 2px;
    width: 5px;
    height: 10px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

.controlLabel:after {
    content: '';
    position: absolute;
    display: none,
}

.control input:checked ~ .controlLabel {
    background: #2196f3;
    border: transparent
}

.pipSec .empInfAction {
    top: 1px;
    margin: 0;
    right: 39px
}

.pipSec .mainSearchIcon {
    padding: 8px;
    background: #fff;
    border-radius: 4px;
    top: 0px
}

.pipSec .searchBoxField {
    top: 0;
    right: 9px;
    height: 34px;
}

.pipSec .mainHideIcon {
    top: 13px;
    right: 20px
}

.PipTab {
    position: relative;
    margin-top: 40px;
}

    .PipTab .nav-tabs {
        border: 0
    }

    .PipTab .tab-content {
        background: #fff;
        padding: 10px
    }

    .PipTab .nav-tabs > li > a {
        border: 0px !important;
    }

    .PipTab .nav-tabs > li.active > a {
        color: #000
    }

    .PipTab .nav > li > a {
        color: #777;
        font-size: 14px;
        font-weight: 500
    }

.PIPTable th {
    border-bottom: 0px !important
}

/*.PIPTable th, .PIPTable td {
    padding: 10px !important
}*/

.PIPTable th {
    color: #777;
    font-weight: normal;
    font-size: 12px
}

* {
    margin: 0;
    padding: 0
}

.PIPTable tbody tr {
    transition: all 0.5s ease-in-out
}

    .PIPTable tbody tr:hover {
        box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.2);
        background: #fff !important;
        transform: translate(0px, 0px)
    }

.PIPTable th {
    padding-top: 0 !important
}

.PIPTable td {
    vertical-align: middle !important;
    font-size: 13px;
}
.PIPTablereview td {
    vertical-align: middle !important;
    font-size: 13px;
    white-space: normal !important;
}

.action {
    background: none;
    border: none
}

    .action i {
        font-size: 16px;
        color: #777
    }

    .action:hover i {
        color: #2B99F0
    }

.alertPip {
    font-size: 18px;
    color: #222;
    border-radius: 3px
}

.alertI {
    font-size: 63px;
    margin-bottom: 30px;
    display: inline-block
}

#initiate .modal-body {
    padding: 30px
}

#initiate .close {
    position: absolute;
    right: 20px;
    top: 15px;
    opacity: 1;
    color: #777
}

.btnDiv {
    margin-right: 20px
}

/** INtiated Form (Vinay 21-Aug-19) */
.cment {
    color: #777;
    text-decoration: none !important;
    font-size: 16px
}

.vk-table {
    display: table;
    width: 100%
}

.vk-tc {
    display: table-cell;
    width: 20%;
    padding: 0 15px 0 0
}

    .vk-tc:first-child {
        padding-left: 0
    }

    .vk-tc:last-child {
        padding-right: 0
    }

.vkTblScnd {
    padding-top: 10px
}

.brderSelect.datepicketList.dpCustom::after {
    bottom: 10px;
    right: 10px;
    font-size: 16px
}

.brderSelect.dpCustom .form-control {
    padding-right: 30px
}

/*Due to this css. it affected  dropdown in whole application. */
/*.form-group .bootstrap-select.btn-group {
    margin-top: 0
}*/

.nogoal {
    padding: 45px 0;
    text-align: center
}

    .nogoal p {
        font-size: 18px;
        color: #777;
        margin: 15px 0
    }

    .nogoal img {
        width: 75px
    }

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

.cstmMdl .history-list {
    margin-left: 6px;
}

.cstmMdl .modal-header .close {
    color: #777 !important
}

.modal-title {
    color: #2196f3;
    font-size: 16px
}

.cstmMdl .modal-header {
    padding-bottom: 0;
    border: 0
}

.eFour .mdlUpld {
    border: 1px dashed #E8E8E8
}

.mdlUpld {
    text-align: center
}

    .mdlUpld > span {
        margin-right: 5px;
        font-size: 18px;
        vertical-align: text-bottom
    }

.eFour .mdlUpld label small {
    color: #2196f3;
    opacity: 1
}

.goalCrousel .owl-nav > button {
    width: 26px;
    height: 34px
}

    .goalCrousel .owl-nav > button > span {
        font-size: 12px
    }

.goalCrousel .owl-nav {
    position: absolute;
    right: 0;
    bottom: -48px
}

    .goalCrousel .owl-nav.disabled {
        display: block;
        opacity: 1
    }

        .goalCrousel .owl-nav .disabled > span {
            opacity: 1
        }

    .goalCrousel .owl-nav > button {
        top: inherit;
        border-radius: 3px;
        background: none !important;
        border: 1px solid #777 !important;
        position: static
    }

    .goalCrousel .owl-nav button.owl-prev {
        margin-right: 5px
    }

.glHead {
    font-size: 16px;
    color: #2196F3;
    margin: 0
}

    .glHead i {
        color: #777
    }



/*********** Expand All & Collapse All Css ****************/


/* .accordionCstm .panel-group{margin:0}
.accordionCstm .panel-default a:after{
    content:"";
    position:relative;
    top:-6px;
    display:inline-block;
    font-family:'pmsFonts';
    font-style:normal;
    font-weight:400;
    line-height:2;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    transition:transform .25s linear;
    -webkit-transition:-webkit-transform .25s linear;font-size:9px;
    width:18px;
    height:18px;
    border:1px solid #777;
    border-radius:50%}
.accordionCstm .panel-default a[aria-expanded="true"]{border-top:1px solid #e0e0e0}
.accordionCstm .panel-default a[aria-expanded="true"]:after{content:"\e902";-webkit-transform:rotate(180deg);transform:rotate(180deg);background:#2196f3;color:#fff;border-color:#fff}

  
.accordionCstm .panel-default a[aria-expanded="false"]:after{content:"\e902"} */


/* .glRight > .accrdionTbl tr td{padding-bottom:0}
.fulltext .accrdionTbl tr td{padding-top:0;border-top:0 !important} */

.accordionCstm .panel {
    margin: 0;
    border: 0;
    box-shadow: none;
    border-radius: 0;
    transition: all 0.5s ease-in-out
}

    .accordionCstm .panel:hover {
        box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.2);
        transform: translate(0px, 0px)
    }

.accordionCstm .accordion-option {
    float: none;
    border: 0;
    display: initial /*inline-block*/;
    margin-right: 10px;
}

    .accordionCstm .accordion-option a {
        font-size: 12px;
        color: #777
    }
/* .accordionCstm .accordion-option .toggle-accordion:before{content:"Collapse All"}
.accordionCstm .accordion-option .toggle-accordion.active:before{content:"Expand All"} */
.accordionCstm .panel-title {
    width: 4%;
    float: left;
    text-align: center
}

.accordionCstm .read-more {
    border-top: 1px solid #e0e0e0
}

    /*RS Code*/
    .accordionCstm .read-more i {
        line-height: 14px;
        font-size: 12px;
        width: 16px;
        height: 16px;
        border: 1px solid #2196f3;
        border-radius: 50%;
        margin-top: 10px;
        cursor: pointer;
        background: #2196f3;
        color: #fff;
        -webkit-transition: background-color 0.4s ease, border-color 0.4s ease;
        -moz-transition: background-color 0.4s ease, border-color 0.4s ease;
        transition: background-color 0.4s ease, border-color 0.4s ease
    }

    .accordionCstm .read-more.active i, .accordionCstm .read-more .fa-angle-up {
        border-color: #777;
        color: #777;
        background: none
    }

.glRight {
    width: 96%;
    float: left;
    overflow: hidden;
    max-height: 300px;
    transition: max-height 0.7s ease
}

.fullHeight .glRight {
    max-height: 35px;
    overflow: hidden;
    transition: max-height 0.4s ease-out
}

.fullHeight .read-more {
    max-height: 34px
}

@-webkit-keyframes antiClockwiseSpin {
    0% {
        transform: rotate(360deg)
    }

    100% {
        transform: rotate(0deg)
    }
}

@keyframes antiClockwiseSpin {
    0% {
        transform: rotate(360deg)
    }

    100% {
        transform: rotate(0deg)
    }
}

@-webkit-keyframes clockwiseSpin {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

@keyframes clockwiseSpin {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

.antiClockwiseSpin {
    -webkit-animation: antiClockwiseSpin 0.3s infinite linear;
    animation: antiClockwiseSpin 0.3s linear
}

.clockwiseSpin {
    -webkit-animation: clockwiseSpin 0.2s infinite linear;
    animation: clockwiseSpin 0.2s linear
}
/*RS Code*/

/*********** Expand All & Collapse All Css End ****************/

.accrdionTbl {
    margin: 0
}

    .accrdionTbl tr th {
        color: #777;
        font-size: 12px;
        border: 0 !important;
        padding-top: 0 !important
    }

    .accrdionTbl tr td {
        color: #222;
        font-size: 13px;
        line-height: 21px !important;
        border-top: 1px solid #e0e0e0 !important
    }

    .accrdionTbl tr th:first-child {
        border-left: 1px solid transparent !important
    }

    .accrdionTbl tr th:first-child, .accrdionTbl tr td:first-child {
        width: 3%;
        border-left: 1px solid #e0e0e0
    }

    .accrdionTbl tr th:nth-child(2), .accrdionTbl tr td:nth-child(2) {
        width: 25%
    }

    .accrdionTbl tr th:nth-child(3), .accrdionTbl tr td:nth-child(3) {
        width: 25%
    }

    .accrdionTbl tr th:nth-child(4), .accrdionTbl tr td:nth-child(4) {
        width: 25%
    }

    .accrdionTbl tr th:nth-child(5), .accrdionTbl tr td:nth-child(5) {
        width: 15%;
        text-align: center
    }

    .accrdionTbl tr th:nth-child(6), .accrdionTbl tr td:nth-child(6) {
        width: 7%;
        text-align: center
    }

.eFour .accordionCstm .panel-group > .panel > .panel-collapse > .panel-body, .panel-body {
    padding: 0
}

.accrdionTbl tbody tr:nth-child(even):hover, .accrdionTbl tbody tr:nth-child(odd):hover {
    background: none
}

.accordionCstm .panel-title > a, .eFour .accordionCstm .panel-group > .panel > .panel-collapse > .panel-body {
    background: none
}

.accordionCstm .panel:nth-child(even) {
    background: #F7F7F7;
    margin: 0
}

.accordionCstm .panel-group .panel + .panel {
    margin: 0
}

.attachCnt {
    position: relative
}

.btchCnt {
    width: 16px;
    height: 16px;
    background: #2196f3;
    line-height: 15px;
    color: #fff;
    font-size: 10px;
    display: inline-block;
    border-radius: 50%;
    position: absolute;
    top: -5px;
    right: -7px
}

.action + .action {
    margin-left: 10px
}

.docUl li a {
    color: #777;
    font-size: 13px
}

.docUl li {
    border-bottom: 1px solid #e0e0e0;
    padding: 5px
}

    .docUl li:last-child {
        border: 0
    }

.revisedIcn {
    color: #2196f3 !important;
    margin-left: 5px;
    text-decoration: none !important;
}


.intiatedDiv .accrdionTbl tr th:first-child, .intiatedDiv .accrdionTbl tr td:first-child {
    width: 15%
}

.intiatedDiv .accrdionTbl tr th:nth-child(2), .intiatedDiv .accrdionTbl tr td:nth-child(2) {
    width: 20%
}

.intiatedDiv .accrdionTbl tr th:nth-child(3), .intiatedDiv .accrdionTbl tr td:nth-child(3) {
    width: 19%
}

.intiatedDiv .accrdionTbl tr th:nth-child(4), .intiatedDiv .accrdionTbl tr td:nth-child(4) {
    width: 14%
}

.intiatedDiv .accrdionTbl tr th:nth-child(5), .intiatedDiv .accrdionTbl tr td:nth-child(5) {
    width: 11%;
    text-align: left
}

.intiatedDiv .accrdionTbl tr th:nth-child(6), .intiatedDiv .accrdionTbl tr td:nth-child(6) {
    width: 7%;
    text-align: center
}

.intiatedDiv .accrdionTbl tr th:nth-child(7), .intiatedDiv .accrdionTbl tr td:nth-child(7) {
    width: 7%;
    text-align: center
}

.intiatedDiv .accrdionTbl tr th:nth-child(8), .intiatedDiv .accrdionTbl tr td:nth-child(8) {
    width: 6%;
    text-align: center
}
/* .intiatedDiv .accrdionTbl tr th:nth-child(9), .intiatedDiv .accrdionTbl tr td:nth-child(9){width:5%;text-align:center} */


.revisedTbl {
    background: #fafafa;
    padding-bottom: 8px;
    position: relative;
    border-radius: 2px;
    margin-top: 10px
}

    .revisedTbl table {
        margin: 0
    }

    .revisedTbl tr td {
        width: 20%;
        vertical-align: middle !important;
        border: 0 !important
    }

        .revisedTbl tr td:first-child {
            width: 19%;
        }

.extenCmnt {
    padding: 0 8px
}

.triangle {
    background: #fafafa;
    width: 20px;
    height: 20px;
    transform: rotate(45deg);
    display: inline-block;
    position: absolute;
    top: -8px;
    left: 12px
}

.reviseClose {
    cursor: pointer;
    position: absolute;
    right: 0px;
    top: -20px;
    background: #f5f5f5;
    padding: 6px;
    border-radius: 4px;
    font-size: 10px;
    color: #777
}

.revisedTbl table tr:hover {
    background: none !important
}

.revisedTbl .brderSelect textarea.form-control, .revisedTbl .brderSelect .bootstrap-select.btn-group {
    background: #fff
}

.meetTab .tab-content {
    background: #fff;
    padding: 15px
}

.meetUL li {
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid #e0e0e0
}

.meetUL > li:last-child {
    margin: 0;
    padding: 0;
    border: 0
}

.meetUL li label {
    font-size: 12px;
    color: #777
}

.meetUL li p {
    font-size: 13px;
    margin: 0
}

.meetTab .nav-tabs {
    border: 0
}

    .meetTab .nav-tabs > li > a {
        color: #777;
        border: 0
    }

    .meetTab .nav-tabs > li.active > a, .meetTab .nav-tabs > li.active > a:focus, .meetTab .nav-tabs > li.active > a:hover {
        color: #222;
        border: 0
    }

.clndLi input {
    width: 108px;
    border: 0;
    pointer-events: none;
    background: none
}

.clndLi i {
    position: absolute;
    right: 13px;
    top: 10px;
    font-size: 18px;
    pointer-events: none
}

.clndLi.active input {
    pointer-events: inherit;
    cursor: pointer
}

.ulBrderNone li {
    border: 0
}

    .ulBrderNone li:first-child {
        border-bottom: 1px solid #e0e0e0
    }

.totalBrderNone li {
    border: 0
}
/* .noActnUl{border-top:1px solid #e0e0e0;border-bottom:1px solid #e0e0e0} */
.noActnUl.radioSeect li {
    width: 33.3%;
    margin: 0
}

.noActnUl > li > a {
    margin: 0;
    border-radius: 0;
    text-align: center;
    border-left: 1px solid #ddd;
    font-size: 13px;
    color: #777
}

.noActnUl > li:last-child > a {
    border-right: 1px solid #ddd
}

.noActnUl > li > a:hover {
    border-left: 1px solid #e0e0e0
}

.noActnUl > li.active > a, .noActnUl > li.active > a:focus, .noActnUl > li.active > a:hover {
    border: 1px solid #2196f3;
    border-bottom-color: #2196f3;
    color: #2196f3
}

.strikeText .labelDiv {
    text-decoration: line-through;
    color: #777
}

.strikeText .revisedIcn {
    display: none !important
}

.strikeText .noStrike {
    text-decoration: inherit
}

/* History Css */
.modal-title + p {
    font-size: 12px;
    color: #777;
    margin: 4px 0 10px
}

.history-details {
    line-height: 22px;
    position: relative
}

.history-list li:first-child div.history-details {
    padding-top: 0
}

.history-list li:last-child div.history-details {
    border-left: 0
}

.history-details:before {
    content: "\e90e";
    font-family: 'pmsFonts' !important;
    position: absolute;
    background: #8BBA67;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    color: #fff;
    font-size: 8px;
    font-weight: bold;
    left: -10px;
    line-height: 19px;
    padding-left: 5px
}
/* .error-history:before{content:"\e920";background:#fc3232;line-height:18px} */
.history-details h2 {
    margin-bottom: 9px;
    font-size: 13px
}

.history-details p {
    margin: 0;
    color: #777;
    font-size: 13px
}
/* History Css End */

.radioSeect li {
    width: 170px;
    padding: 10px 15px;
    text-align: center;
    border: 1px solid #e0e0e0;
    float: left;
    cursor: pointer
}

    .radioSeect li.active {
        color: #2196f3;
        border: 1px solid #2196f3;
    }

.form-field > label {
    font-weight: 500
}

.apprHead {
    margin: 0 0 20px;
    font-weight: bold
}

.brderSelect .countCharacter {
    margin-top: 8px
}

.with-indicator li:nth-child(4).active:before {
    left: 151px
}

#performance .appraise-head > .team-caption li {
    padding: 28px 5px;
    font-size: 16px
}

.bulkSec .check-upload ul li label input {
    margin-right: 20px;
    height: 33px;
    float: left
}

.bulkSec .check-upload ul li label {
    vertical-align: middle;
    font-weight: 500
}

.bulkSec .bulk-screen {
    display: block
}

.kpp-check {
    outline: 0
}

    .kpp-check .controlLabel {
        margin-right: 20px;
        float: left;
        margin-top: 10px
    }

        .kpp-check .controlLabel:after {
            top: 12px
        }

.glb-btn > button.btnsback.secondry-button {
    background: #828282
}

.glb-btn > .btnsback {
    color: #fff;
    border: 0;
    text-transform: uppercase;
    padding: .5rem 1.5rem;
    margin: 0 5px;
    margin: 0px\0/IE9;
    min-width: 100px;
    border-radius: 4px
}

.noneBrdrLeft tr th, .noneBrdrLeft tr td {
    border-left: 0 !important
}

.pms-view {
    cursor: pointer
}
/* .tabCraousel .owl-stage-outer{width:94%;margin:auto}
.tabCraousel .owl-nav{width:100%;bottom:inherit}
.tabCraousel .owl-nav>button{position:absolute;top:-36px;background:#777 !important;color:#fff !important;width:31px;height:35px;font-size:10px !important}
.tabCraousel .owl-nav>button i{display:block}
.tabCraousel .owl-nav button.owl-prev{left:0;transform:inherit}
.tabCraousel .owl-nav button.owl-prev i{transform:rotate(-90deg)}
.tabCraousel .owl-nav button.owl-next{right:0}
.tabCraousel .owl-nav button.owl-next i{transform:rotate(90deg)} */
.card-box > .goals-per ul li:after {
    right: inherit
}

.pipPerfrormDiv .review-period a {
    color: #222;
    text-decoration: underline
}

.pipPerfrormDiv .employee-view {
    margin-bottom: 20px
}

    .pipPerfrormDiv .employee-view:last-child {
        margin-bottom: 0
    }

.pipPerfrormDiv .card-box > p {
    font-size: 16px
}

.searchBoxField {
    border-radius: 4px
}

.tableLength .dataTables_wrapper > .row .col-sm-7 {
    position: inherit
}

.tableLength .glb-table_lenth {
    position: absolute;
    top: -49px;
    right: -29px
}

.dataTables_length > label select.input-sm {
    border: 0
}

.btnDiv {
    position: absolute;
    top: -38px;
    right: 70px
}

.tableLength .dataTables_wrapper .dataTables_info {
    padding-top: 10px
}

.modal:before {
    display: none
}

.ToastMSG {
    left: 50%;
    transform: translate(-50%, 0)
}

.tableLength .action i {
    font-size: 16px;
    color: #777;
    padding-top: 2px;
    display: inline-block
}

.card-box {
    box-shadow: 0 1px 4px rgba(0,0,0,.01)
}

.popover-content {
    padding: 6px 8px
}

.fileOl li {
    display: inline-block;
    border: 0;
    margin: 0;
    padding: 0
}

    .fileOl li a {
        color: #222;
        text-decoration: underline;
        font-size: 13px;
        margin-right: 6px
    }

.extnSec .tableLength .action i {
    font-size: 18px
}

.extnSec .action + .action {
    margin-left: 0
}

.extnSec .PIPTable th:nth-child(10), .extnSec .PIPTable td:nth-child(10) {
    text-align: center
}

.pms-ExtentionComment:hover, .action i:hover {
    color: #2196f3
}

.apprHead ~ .apprHead {
    margin: 10px 0;
    border-top: 1px solid #e0e0e0;
    padding-top: 20px
}

.printDiv .glRight {
    width: 100%
}

.printDiv .panel {
    float: left;
    width: 100%
}

.printDiv .accrdionTbl tr th:first-child, .printDiv .accrdionTbl tr td:first-child {
    width: 15%;
    border-left: 0
}

.printDiv .accrdionTbl tr th:nth-child(2), .printDiv .accrdionTbl tr td:nth-child(2) {
    width: 23%
}

.printDiv .accrdionTbl tr th:nth-child(3), .printDiv .accrdionTbl tr td:nth-child(3) {
    width: 22%
}

.printDiv .accrdionTbl tr th:nth-child(4), .printDiv .accrdionTbl tr td:nth-child(4) {
    width: 20%
}

.printDiv .accrdionTbl tr th:nth-child(5), .printDiv .accrdionTbl tr td:nth-child(5) {
    width: 10%
}

.details-list.popover {
    max-width: 500px;
    top: -5px !important
}

.popover {
    max-width: 496px;
    top: 5px;
}

.intiateDet > .arrow {
    border-right-color: #c8c9cb !important;
    top: 4% !important;
    margin-top: 45px !important;
}

.empDetailsP {
    padding: 5px 0 0
}

    .empDetailsP li {
        padding: 7px 15px;
        border-bottom: 1px solid #f0f0f0;
        float: left;
        width: 100%
    }

        .empDetailsP li:last-child {
            border-bottom: none
        }

        .empDetailsP li div.emdetails {
            float: left;
            width: 50%
        }

        .empDetailsP li span.det-caption {
            font-size: 12px;
            color: #787878;
            display: block;
            line-height: 22px
        }

        .empDetailsP li span.det-value {
            font-size: 13px;
            color: #2d2d33;
            display: block;
            line-height: 22px
        }

/* Scrolling Tab With Slider */
.scrtabs-tab-container {
    height: 35px
}

.scrtabs-tabs-fixed-container {
    height: inherit
}

.scrtabs-tab-scroll-arrow {
    padding: 0;
    height: 35px;
    width: 31px;
    background: #777;
    border-radius: 3px;
    color: #fff;
    text-align: center;
    line-height: 32px;
    position: relative
}

    .scrtabs-tab-scroll-arrow:hover {
        background-color: #777;
        opacity: 0.7
    }

    .scrtabs-tab-scroll-arrow .pms-accordion::before {
        position: relative;
        top: -4px;
        display: inline-block
    }

    .scrtabs-tab-scroll-arrow .pms-accordion::after {
        position: absolute;
        top: 19px;
        left: 9px;
        font-family: 'Open Sans',sans-serif
    }

.scrtabs-tab-scroll-arrow-left .pms-accordion::before {
    transform: rotate(-90deg)
}

.scrtabs-tab-scroll-arrow-right .pms-accordion::before {
    transform: rotate(90deg);
    left: 2px
}

.scrtabs-tab-scroll-arrow-left .pms-accordion::after {
    content: '01'
}

/*.scrtabs-tab-scroll-arrow-right .pms-accordion::after {
    content: '08'
}*/
/* Scrolling Tab With Slider  End*/


.borderNOne li {
    border: 0 !important
}

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


@supports (-ms-ime-align:auto) {
    .pipSec .empInfAction {
        right: 59px
    }

    .btnDiv {
        right: 89px
    }

    .ctmizeRprtTbl tbody tr:hover {
        box-shadow: none;
    }
}

.card-box > .goals-per ul li a {
    cursor: pointer
}

#rejection .countCharacter {
    position: absolute;
    right: 13px;
    top: -10px
}

.uploadCls .inputfile + label .closeFile {
    display: none
}

.uploadCls .inputfile.has-focus + label .closeFile {
    display: inline-block;
    font-size: 12px;
    color: #777;
    cursor: pointer;
    margin-left: 5px;
    vertical-align: middle
}

.uploadCls .mdlUpld {
    padding: 0;
    line-height: 33px;
}

.uploadCls.form-field input[type=file] {
    width: 110px;
    cursor: pointer;
    margin: auto;
    right: 0;
}

.inputfile-6.has-focus + label .updText, .inputfile-7.has-focus + label .updText {
    display: none;
}

.uploadCls .inputfile.has-focus + label .text {
    width: 150px;
    overflow: hidden;
    display: inline-block;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: bottom
}

.uploadCls label {
    font-weight: 100
}

.plnextnMdl .modal-dialog {
    width: 870px
}

.extnTable {
    margin: 0
}

    .extnTable tbody tr:nth-child(even):hover, .extnTable tbody tr:nth-child(odd):hover {
        background: none
    }

    .extnTable tr th {
        font-size: 13px;
        color: #777;
    }

    .extnTable tbody tr td {
        vertical-align: middle;
        font-size: 13px;
        width: 20%
    }

    .extnTable tbody tr:nth-child(odd) {
        background: #F7F7F7
    }
/* Tab Indicator Css */
.nav-indicator li {
    position: relative;
    z-index: 0
}

.nav-indicator .Nav-item:last-child:after {
    content: '';
    display: block;
    position: absolute;
    pointer-events: none;
    -webkit-transition: left .5s ease;
    transition: left .5s ease
}

.nav-indicator .Nav-item:last-child:after {
    border: 1px solid #2196f3;
    bottom: 0px;
    left: 0;
    width: 101%;
    z-index: -1;
    height: 40px
}

.nav-indicator .Nav-item:nth-child(1).active ~ .Nav-item:last-child:after {
    left: -101%;
    width: 101%;
}

.nav-indicator .Nav-item:last-child.active:after {
    left: -1% !important
}
/* Tab Indicator Css End */
.threeClmNav .Nav-item:nth-child(1).active ~ .Nav-item:last-child:after {
    left: -202%;
    width: 101%;
}

.threeClmNav .Nav-item:nth-child(2).active ~ .Nav-item:last-child:after {
    left: -102%;
    width: 102%
}

.scrtabs-tabs-fixed-container {
    position: relative;
    left: 4px
}

.tabNav {
    float: none
}

    .tabNav li a {
        color: #777;
        padding: 10px;
        border-radius: 4px 4px 0 0;
    }

    .tabNav li.active a {
        background: #fff;
        color: #222
    }

.datepicker table tr td, .datepicker table tr th {
    font-size: 13px
}

.glyphicon-chevron-left:before {
    content: '<<';
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
}

.glyphicon-chevron-right:before {
    /*content: '»';*/
    content: '>>';
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
}

.bootstrap-datetimepicker-widget table td.today:before {
    display: none
}

.ackDiv {
    font-size: 12px
}

    .ackDiv .control {
        padding-right: 5px
    }



/*******************************************************
Reports
********************************************************/
.viewUl {
    border-bottom: 1px solid rgba(119, 119, 119, 0.22);
    margin-bottom: 30px;
}

    .viewUl li {
        display: inline-block;
    }

        .viewUl li a {
            color: #777;
            border-bottom: 3px solid transparent;
            padding: 0 10px 10px;
            display: block
        }

        .viewUl li.active a {
            color: #222;
            border-color: #2196f3
        }

.tree {
    text-align: center;
    max-width: 990px;
    margin: 0 auto
}

    .tree li {
        display: inline-block;
        text-align: center;
        list-style-type: none;
        position: relative;
        padding: 20px 5px 0 5px;
        width: 100%;
        transition: all 0.5s;
        -webkit-transition: all 0.5s;
        -moz-transition: all 0.5s;
    }

.hr1 .owl-item.active li::before, .hr1 .owl-item.active li::after {
    content: '';
    position: absolute;
    top: 0;
    border-top: 1px dashed #2196f3;
    height: 20px;
    right: 50%;
    width: 50%
}

.hr1 .owl-item.active li::after {
    right: auto;
    left: 50%;
    border-left: 1px dashed #2196f3;
}

.hr1 .owl-item:first-child li::before, .hr1 .owl-item:last-child li::after {
    border: 0 none;
}


.headM {
    min-width: 196px;
    height: 196px;
    border: 1px dashed #2196f3;
    margin-bottom: 40px;
    border-radius: 50%;
    display: inline-block;
    padding-top: 70px;
    text-align: center;
    font-weight: 600;
    font-size: 18px;
    position: relative;
}

    .headM::after, .headM::before {
        content: '';
        position: absolute;
        height: 20px;
        bottom: -20px;
        border-left: 1px dashed #2196f3;
    }

    .headM::before {
        content: "\e93b";
        font-family: 'pmsFonts';
        border: 0;
        left: 47%;
        bottom: -40px;
        font-size: 14px;
        color: #2196f3;
    }

    .headM span {
        display: block;
        font-size: 13px;
        margin-top: 5px;
    }

.subTree li a {
    border: 1px solid #ccc;
    font-size: 16px;
    border-radius: 32px;
    display: inline-block;
    padding: 10px;
    width: 190px;
    padding: 20px 10px;
    text-align: left;
    color: #777;
    transition: all 0.5s ease-in-out
}

    .subTree li a span {
        display: block;
        font-size: 12px;
        color: #777;
        margin-top: 5px;
    }

    .subTree li a:hover, .subTree li.active a, .subTree li:hover a {
        border-color: #2196f3;
        color: #222;
        box-shadow: 0px 3px 6px #00000029;
    }

.subTree li:hover .tgglPlus, .subTree li.active .tgglPlus {
    color: #2196f3
}

    .subTree li:hover .tgglPlus .plus, .subTree li.active .tgglPlus .plus {
        background: #2196f3
    }

.tree .owl-carousel .owl-item {
    text-align: center;
}

.tree .owl-nav > button {
    width: 25px;
    height: 25px;
    background: none !important;
    border-radius: 50%;
    border: 1px solid #2196f3 !important;
    transition: all 0.5s ease-in-out
}

    .tree .owl-nav > button:hover {
        background: #2196f3 !important;
    }

        .tree .owl-nav > button:hover > span {
            color: #fff !important
        }

    .tree .owl-nav > button > span {
        font-size: 12px;
        color: #2196f3;
        top: 0;
        transition: all 0.5s ease-in-out
    }

.hr1.subTree li a {
    width: 242px
}

.hr1 .owl-nav > button {
    top: 31%
}

.hr1 button.owl-prev {
    left: -3%;
}

.hr1 button.owl-next {
    right: -3%;
}

.hr2 button.owl-prev {
    left: -2.7%
}

.hr2 button.owl-next {
    right: -2.7%
}

.tgglPlus {
    color: #ccc;
    transition: all 0.5s ease-in-out
}

    .tgglPlus > i {
        transform: rotate(-180deg);
        display: inline-block;
        font-size: 20px;
        margin-top: 7px;
    }

.plus {
    width: 34px;
    height: 34px;
    background: #ccc;
    display: block;
    border-radius: 4px;
    color: #fff;
    font-size: 23px;
    margin: auto;
    transition: all 0.5s ease-in-out;
    cursor: pointer;
}

.firstActiveItem.active li::before {
    border-top: 0 !important
}

.lastActiveItem.active li::after {
    border-top: 0 !important
}

.plus i {
    font-style: inherit;
    display: block;
}

.faPlus::before {
    content: '+'
}

.faMinus::before {
    content: '-'
}

.ctmizeRprtTbl th {
    border-bottom: 0px !important
}

.ctmizeRprtTbl th, .ctmizeRprtTbl td {
    padding: 10px !important
}

.ctmizeRprtTbl th {
    color: #777;
    font-weight: normal;
    font-size: 12px
}

.ctmizeRprtTbl tbody tr {
    transition: all 0.5s ease-in-out
}

    .ctmizeRprtTbl tbody tr:hover {
        box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.2);
        background: #fff !important;
        transform: translate(0px, 0px)
    }

.ctmizeRprtTbl th {
    padding-top: 0 !important
}

.ctmizeRprtTbl td {
    vertical-align: middle !important;
    font-size: 13px
}

.typeHdInput {
    position: relative;
    padding: 15px
}

    .typeHdInput i {
        position: absolute;
        top: 25px;
        right: 25px;
        font-size: 16px;
        pointer-events: none
    }

.twitter-typeahead {
    display: block !important
}

.typehead {
    box-shadow: none;
    border-radius: 2px;
    height: 37px;
}

.tt-suggestion:hover {
    background: #2196f3
}

.cstmReprt {
    padding-top: 7px !important;
    font-weight: bold;
}

.switch {
    position: relative;
    width: 43px;
}

    .switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    bottom: 0;
    width: 42px;
    height: 5px;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

    .slider:before {
        position: absolute;
        content: "";
        height: 16px;
        width: 16px;
        left: 0;
        bottom: -5px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
        border: 1px solid #ccc
    }

input:checked + .slider {
    background-color: #2196F3;
}

input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
    border: 1px solid #2196f3
}
/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

    .slider.round:before {
        border-radius: 50%;
    }

.ctmizeRprtTbl tbody tr:nth-child(odd) {
    background: #f7f7f7
}

.ctmizeRprtTbl tr th:last-child, .ctmizeRprtTbl tr td:last-child {
    text-align: center
}

.ctmizeRprtTbl tr th:nth-last-child(2), .ctmizeRprtTbl tr td:nth-last-child(2) {
    text-align: center
}

.cstmAction {
    cursor: pointer;
    font-size: 16px;
}

    .cstmAction:hover {
        color: #2196f3
    }

.mailUl li a {
    color: #777;
    border-bottom: 1px solid #e0e0e0;
    padding: 5px;
    font-size: 13px;
}

.mailUl li:last-child a {
    border: 0
}

.printScrll {
    max-height: 120px
}
/* .print_list{background: #F7F7F7} */
.print_list li {
    padding: 0 15px;
    border-bottom: 1px solid #e0e0e0
}

    .print_list li:last-child {
        border: 0
    }

    .print_list li i {
        float: right;
        cursor: pointer;
    }

.empMsg > h5 {
    margin: 25px 0 15px;
    color: #2196f3;
    font-weight: bold;
}

.newReprtDiv .card-box {
    padding: 15px 15px 5px
}

.reprtUl li {
    display: inline-block;
    background: #e0e0e0;
    font-size: 12px;
    padding: 5px 15px;
    border-radius: 20px;
    margin-right: 10px;
    margin-bottom: 10px;
    cursor: pointer;
}

    .reprtUl li span {
        display: inline-block
    }

    .reprtUl li:last-child {
        margin-right: 0
    }

    .reprtUl li i {
        font-size: 6px;
        margin-left: 10px;
        font-weight: 600;
        opacity: 0;
        transition: all 0.4s ease-in-out;
    }

    .reprtUl li.active {
        background: #2196f3;
        color: #fff
    }

        .reprtUl li.active i {
            opacity: 1;
        }

/* .newReprtDiv .mCustomScrollBox{outline: 0 !important;}
.newReprtDiv .mCSB_container_wrapper{position:static;margin-bottom:20px}
.newReprtDiv .mCSB_container_wrapper > .mCSB_container{padding:0}
.newReprtDiv .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{background:#2196f3}
.newReprtDiv .mCSB_scrollTools, .mCSB_scrollTools .mCSB_draggerRail {width: 100% !important} */

.newReprtDiv .categryListView {
    border: 2px solid #2196f3;
    text-align: center;
    padding: 20px 10px;
    white-space: nowrap;
    overflow: auto;
}

.categryListView p {
    color: #2196f3;
    font-weight: bold;
    margin: 0;
}

.categryListView i {
    display: none
}

.categryListView span {
    padding: 8px 35px;
    border: 2px dashed #2196f3;
    position: relative;
    box-sizing: border-box;
    margin: 0 2px;
    cursor: move;
}

    .categryListView span:hover, .categryListView span:active, .categryListView span:focus {
        background: #2196f3;
        color: #fff;
        font-weight: bold
    }

        .categryListView span:hover::after {
            content: "\e92d";
            font-family: 'pmsFonts';
            font-size: 20px;
            vertical-align: middle;
            color: #fff;
            margin-left: 8px;
            position: absolute;
            top: 4px;
            right: 8px
        }


.ap_pop {
    width: 100%
}

.no-border {
    border: 0 !important
}

.print_list {
    max-height: 130px;
    overflow: auto;
    overflow-x: hidden
}

.ap_pop ul {
    display: block;
    background: #F7F7F7;
    float: left;
    width: 100%;
}

    .ap_pop ul li {
        list-style: none;
        border-bottom: 2px solid #ebebeb;
        line-height: 2rem;
        margin-top: 9px;
        width: 100%;
        float: left;
        clear: both
    }

        .ap_pop ul li:first-child {
            margin-top: 0
        }

        .ap_pop ul li:last-child {
            border-bottom: none
        }

.ap_licon {
    width: 89%;
    float: left
}

.ap_check {
    width: 8%;
    float: left;
    margin: 10px 0 0 15px;
    text-align: center;
    height: 57px;
    line-height: 4rem;
    border-left: 2px solid #fbfafa;
    padding-left: 5px
}

.mainlist {
    width: 7%;
    float: left;
    margin: 0 10px;
    text-align: center;
    border-left: 2px solid #fbfafa;
    padding: 15px 0 15px 10px;
    cursor: pointer
}

.ap_check_list {
    height: 25px;
    overflow: hidden
}

.active_list {
    display: none
}

.ap_pop ul li h2 {
    font-size: 1.08rem;
    color: #333;
    margin: 0;
    padding: 0;
    text-transform: uppercase
}

.ap_pop ul li p {
    font-size: .9rem;
    color: #666;
    margin: 0
}

.ap_pop ul li h3 {
    font-size: .9rem;
    color: #666;
    margin: 0 0 9px
}

.popup_footer {
    width: 100%;
    background: #fff;
    float: left
}

.pop_but {
    margin: 0
}

.add_cc {
    padding: 0;
    width: 100%;
    float: left
}

.list_header {
    width: 100%;
    color: #2196f3;
    float: left;
    padding: 10px 15px
}

.add_cc li {
    border-bottom: 2px solid #eee;
    line-height: 3rem !important;
    margin-top: 0 !important
}

.item_delete {
    float: right;
    cursor: pointer
}

.cc-delete {
    font-size: 1.3rem;
    color: #959595;
    float: left;
    padding: 10px
}

.glb-emp-list ul li:hover {
    background-color: #fffbe1
}


.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #fff
}

.table-striped > tbody > tr:nth-of-type(even) {
    background-color: #f9f9f9
}

.brderSelect label {
    color: #777;
    font-weight: 500;
    font-size: 12px;
}

.brderSelect textarea.form-control {
    padding-top: 8px;
}

.brderSelect .form-control {
    box-shadow: none;
    border: 1px solid #e0e0e0 !important;
    border-radius: 2px;
    font-size: 13px;
    padding: 5px 10px;
    color: #222;
    min-height: 36px;
}

.datepicketList {
    position: relative;
}

    .datepicketList.dpCustom::after {
        bottom: 10px;
        top: inherit;
    }

.brderSelect .bootstrap-select > .newBtn {
    border: 1px solid #e0e0e0;
    padding: 7px 10px;
    border-radius: 2px;
}

.brdrBtn {
    background: none !important;
    border: 1px solid #2196f3 !important;
    color: #2196f3 !important;
}

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

.file_Upload label small {
    color: #777;
    opacity: .5;
    font-size: 13px;
    font-weight: 400;
}

.form-field input[type=file] {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
}

.mdlUpld {
    border: 1px dashed #E8E8E8
}

.mdlUpld {
    text-align: center
}

    .mdlUpld > span {
        margin-right: 5px;
        font-size: 18px;
        vertical-align: text-bottom
    }

    .mdlUpld label small {
        color: #2196f3;
        opacity: 1
    }



/* Success Msg */
.successMsg .primary-button, .draftBtn {
    color: #fff !important;
    font-size: 13px;
    padding: 6px 25px !important;
    font-weight: 300;
    margin: 0 2px
}

.successMsg .modal-dialog {
    width: 475px
}

.successMsg .modal-content {
    border-radius: 3px !important
}

.successMsg .modal-body {
    text-align: center;
    padding: 30px;
    border-radius: 3px
}

.successMsg .pms-alert {
    font-size: 50px;
    color: #9a9a9a
}

.suces {
    font-size: 15px;
    color: #222;
    margin: 20px 0
}

.ToastMSG {
    position: fixed;
    top: 20px;
    background: #fff;
    border-radius: 4px;
    box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.2);
    z-index: 9999;
    display: none
}

.success_Icon {
    display: inline-block;
    width: 50px;
    float: left;
    text-align: center;
    background: #32e053;
    border-radius: 4px 0px 0px 4px;
    height: 42px;
    padding-top: 8px
}

    .success_Icon .pms-tick {
        width: 25px;
        height: 25px;
        background: #fff;
        display: inline-block;
        border-radius: 50%;
        line-height: 24px;
        font-weight: bold;
        color: #32e053
    }

.success_TXT {
    display: inline-block;
    width: calc(100% - 50px);
    line-height: 42px;
    padding-left: 10px;
    padding-right: 30px
}

    .success_TXT .pms-close {
        position: absolute;
        right: 10px;
        top: 15px;
        font-size: 11px;
        cursor: pointer
    }
/* Success Msg End */

/* END New CSS for PIP  11 SEPT 2019*/

.errorSpan {
    font-weight: 500;
    font-size: 12px;
    position: relative;
    line-height: 24px;
    top: 100%;
    left: 0;
    color: red;
}

.errorTextArea {
    color: red;
    font-weight: 500;
    font-size: 12px;
}

.brdrBtnGray {
    background: none !important;
    border: 1px solid #828282 !important;
    color: #828282 !important;
}

.radioSeects li.active {
    color: #2196f3;
    border: 1px solid #2196f3;
}


/*gaurav css*/
.scrtabs-tabs-fixed-container {
    overflow: hidden
}

.dpCustom {
    position: relative
}

    .dpCustom::after {
        right: 10px;
        top: 10px;
    }


.history-details {
    line-height: 22px;
    position: relative;
    padding: 0 0 20px 20px;
    border-left: 1px dashed #e0e0e0;
}

/*****************************************
Bonus E4+
*******************************************/
.card-box > .goals-per ul li div.dash-icons {
    padding: 14px 10px;
    margin: auto 20px;
}

.bonusList .card-box > .goals-per ul li.text:first-child {
    width: 260px;
}

    .bonusList .card-box > .goals-per ul li.text:first-child span {
        background: #fff;
        width: 183px;
        border: 1px dotted #777;
        display: inline-block;
        padding: 5px 10px;
        border-radius: 20px;
        white-space: nowrap;
        color: #222;
        position: relative;
        top: -6px;
        z-index: 1;
    }

.bonusList .card-box > .goals-per ul.bonusTp li.text:first-child span {
    top: -8px
}

.bonusList > .card-box > .row > div {
    padding: 0;
}

.bonusList .row .card-box {
    padding: 0
}

.activeDiv {
    margin-top: 120px !important;
    position: relative;
}

.bonusTp {
    margin-top: 115px !important;
}

.activeDiv::before, .activeDiv::after {
    content: '';
    position: absolute;
    height: 59%;
    border: 0.5px dotted #777;
    right: 37px;
    top: -67px;
}

.activeDiv::after {
    bottom: -41px;
    height: 34%;
    top: inherit
}

.activeDiv.card-box > .goals-per ul li:last-child::before, .activeDiv.card-box > .goals-per ul li:last-child::after {
    display: none
}

.text span {
    position: relative;
}

    .text span::before {
        content: '';
        position: absolute;
        border-bottom: 1px dotted #777;
        width: 75px;
        left: -76px;
        top: 12px;
    }

.bonusList .card-box > .goals-per ul li:after {
    right: -33% !important;
    left: inherit;
}
/* .bonusTp .text span::before{width: 92px;left: -92px;} */
.activeDiv.card-box > .goals-per ul li {
    width: 105px
}

.card-box > .goals-per ul.bonusTp li div.dash-icons span {
    font-size: 25px
}

.calSec .new-details, .calSec .finanaceSec {
    margin-top: 0
}
/* .infoDivSec{margin: 0;padding: 10px 0;} */
.calTable > tbody > tr, .calTable > tfoot > tr {
    background: #fff;
    border-radius: 4px;
    margin-top: 10px;
    float: left;
    width: 100%;
}

    .calTable > tbody > tr:hover, .calTable > tfoot > tr:hover {
        box-shadow: 0 2px 10px rgba(0,0,0,.2);
        transition: all 0.3s ease-in-out
    }

    .calTable > tbody > tr:first-child {
        margin-top: 0
    }

    .calTable > tbody > tr > td, .bonusTbl > tfoot > tr > td {
        float: left;
        position: relative;
        border: 0 !important;
    }

        .calTable > tbody > tr > td::before, .bonusTbl > tfoot > tr > td::before {
            content: '';
            position: absolute;
            top: 7px;
            height: 55px;
            left: 0;
            border-left: 1px dotted #e0e0e0;
        }

        .bonusTbl > tfoot > tr > td::before {
            top: 0
        }

        .calTable > tbody > tr > td:first-child::before {
            display: none
        }

    .calTable > tbody > tr span.cLabel {
        display: block;
        margin-bottom: 4px;
    }

    .calTable > tbody > tr > td:first-child {
        width: 35%
    }

    .calTable > tbody > tr > td:nth-child(2) {
        width: 20%;
        text-align: center
    }

    .calTable > tbody > tr > td:nth-child(3) {
        width: 35%
    }

    .calTable > tbody > tr > td:last-child {
        width: 10%;
        text-align: center
    }

.cLabel {
    font-size: 12px;
    color: #777;
    font-weight: bold
}

.cCntnt {
    font-size: 13px;
    color: #777
}

    .cCntnt span {
        color: #222;
        font-weight: bold;
    }

.cCount {
    font-size: 20px;
    color: #222;
}

.calTable .custom-progress {
    margin-left: 0
}

.prgCnt {
    margin: 6px 0 0;
    text-align: right;
    font-size: 13px;
}

.calTable .infoIcn {
    font-size: 16px;
    color: #777;
    margin: 10px 0 0;
    cursor: pointer;
    display: inline-block;
}

    .calTable .infoIcn.pms-ActionCancel {
        font-size: 18px;
        margin: 9px 0 0;
    }

    .calTable .infoIcn:hover {
        color: #2196f3
    }

.hiddenRow {
    display: none;
    margin: 0 !important;
    border-radius: 0 0 4px 4px !important;
    border-top: 1px solid #2196f3;
    background: #f7fbff !important;
    box-shadow: 0px 2px 7px 0px rgba(0,0,0,.16);
}

.calTable tr.hiddenRow > td:first-child {
    width: 100%
}

.infoDiv label {
    font-size: 12px;
    color: #787878;
    font-weight: 600
}

.cardBox {
    padding: 0 10px;
    border: 1px solid #e0e0e0;
    border-radius: 2px;
    background: #fff
}

.descTable {
    font-size: 12px;
    width: 100%;
}

    .descTable tbody tr {
        border-top: 1px solid #e0e0e0
    }

    .descTable tr th, .descTable tr td {
        border-left: 1px solid #e0e0e0;
        padding: 8px
    }

    .descTable tr th {
        color: #000;
    }

    .descTable tr td {
        color: #222
    }

        .descTable tr td:first-child, .descTable tr th:first-child {
            border: 0
        }

        .descTable tr th:nth-child(4), .descTable tr td:nth-child(4),
        .descTable tr th:nth-child(5), .descTable tr td:nth-child(5) {
            text-align: right
        }

.pdDesc tbody tr:first-child {
    border-top: 0
}

.pdDesc tbody tr td {
    padding: 8px
}

.pdTable tbody tr:first-child {
    border-top: 0
}

.pdTable tr td:first-child {
    color: #777
}

.triArrow {
    position: absolute;
    top: -22px;
    right: 46px;
    display: block;
    width: 0;
    height: 0;
    border: 11px solid transparent;
    border-bottom-color: #2196f3;
}

    .triArrow:after {
        position: absolute;
        display: block;
        width: 0;
        height: 0;
        border: 10px solid transparent;
        top: 1px;
        margin-left: -10px;
        content: " ";
        border-top-width: 0;
        border-bottom-color: #f7fbff
    }

.pbTble > tbody > tr > td:first-child {
    width: 20%
}

.pbTble > tbody > tr > td:nth-child(2) {
    width: 10%
}

.pbTble > tbody > tr > td:nth-child(3) {
    width: 25%
}

.pbTble > tbody > tr > td:nth-child(4) {
    width: 10%;
    text-align: center
}

.pbTble > tbody > tr > td:nth-child(5) {
    width: 10%;
    text-align: center
}

.pbTble > tbody > tr > td:nth-child(6) {
    width: 15%;
    text-align: center
}

.pbTble > tbody > tr > td:last-child {
    width: 10%
}

.calTable > tbody > tr.hiddenRow > td:last-child {
    text-align: left
}

.redBgprg > .progress-bar-success {
    background-color: #DD6A6A
}

.redBgprg + .prgCnt span {
    color: #DD6A6A;
}

.greenBgprg > .progress-bar-success {
    background-color: #4CAF50
}

.amberBgprg > .progress-bar-success {
    background-color: #e88300
}

.greenBgprg + .prgCnt span {
    color: #4CAF50;
}

.amberBgprg + .prgCnt span {
    color: #e88300;
}

.greenBgprg + .prgCnt .cLabel {
    color: #777;
}

.totlAmt {
    text-align: right;
    font-size: 15px
}

    .totlAmt:last-child {
        margin: 0
    }

    .totlAmt span {
        font-size: 20px;
        font-weight: bold;
    }

.pbTble > tfoot > tr td {
    padding-right: 175px;
    display: block;
}

.calSec .top-band .movement {
    margin-top: 15px
}

.calSec .movement li:nth-child(1).active ~ li:last-child:after {
    left: -96%;
    width: 82%
}

.bonusTbl > tbody > tr {
    border: 1px solid #e0e0e0;
}

    .bonusTbl > tbody > tr > td:first-child {
        width: 100% !important;
        background: #f7fbff;
        border-radius: 4px 4px 0 0;
        border-bottom: 1px solid #e0e0e0 !important;
    }

    .bonusTbl > tbody > tr > td {
        width: 11% !important
    }

        .bonusTbl > tbody > tr > td:nth-child(9) {
            width: 12% !important
        }

        .bonusTbl > tbody > tr > td:nth-child(2) {
            text-align: left
        }

        .bonusTbl > tbody > tr > td::before {
            display: none
        }

        .bonusTbl > tbody > tr > td:nth-child(8)::before, .bonusTbl > tbody > tr > td:nth-child(9)::before,
        .bonusTbl > tbody > tr > td:last-child::before {
            display: block
        }

        .bonusTbl > tbody > tr > td:nth-child(8), .bonusTbl > tbody > tr > td:nth-child(9),
        .bonusTbl > tbody > tr > td:last-child {
            text-align: center
        }

.bonusTbl .cCntnt {
    color: #222; /*vertical-align: middle;*/
}

.bonusTbl > tfoot {
    display: table-header-group;
}

    .bonusTbl > tfoot > tr {
        margin-bottom: 10px
    }

        .bonusTbl > tfoot > tr > td {
            width: 22%;
            border: 0;
            float: left;
            padding-top: 15px
        }

            .bonusTbl > tfoot > tr > td:nth-child(2) {
                width: 16%
            }

            .bonusTbl > tfoot > tr > td:last-child {
                width: 40%;
                padding-top: 8px
            }

.durtionUl li {
    display: inline-block;
    margin-right: 40px
}

    .durtionUl li span {
        margin: 0 !important;
        display: inline-block !important;
    }

.colorGreen {
    color: #4CAF50 !important
}

.colorOrange {
    color: #EB722C !important
}

span.currencyType {
    font-size: 12px;
    vertical-align: middle;
}

.bonusTbl > tfoot .cLabel {
    vertical-align: sub;
}

.bonusTbl > tfoot > tr > td:last-child .cLabel {
    vertical-align: middle
}

.bonusTbl > tfoot > tr {
    box-shadow: 0 2px 10px rgba(0,0,0,.2);
}


/*****************************************
Bonus E4+ (Appraiser)
*******************************************/
/*.bnsCard .goals-per li{cursor: pointer;}*/
.team-view > h4 {
    margin: 20px 0;
    color: #777;
    font-weight: 700;
    margin-bottom: 52px;
}

.card-box > .goals-per ul li:after {
    left: 60%;
}

.bnsRvwPrd {
    float: left;
    border-right: 1px solid #e0e0e0;
    padding-right: 10px;
    margin-right: 10px;
}

.bonusbrdcrmb > .breadcrumb-item.active > a {
    color: #222;
    text-decoration: underline
}

    .bonusbrdcrmb > .breadcrumb-item.active > a:hover {
        text-decoration: none
    }

.bonusTable th:first-child, .bonusTable td:first-child {
    width: 10% !important
}

.bonusTable th:nth-child(2), .bonusTable td:nth-child(2) {
    width: 20% !important
}

.bonusTable th:nth-child(3), .bonusTable td:nth-child(3) {
    width: 10% !important
}

.bonusTable th:nth-child(4), .bonusTable td:nth-child(4) {
    width: 15% !important
}

.bonusTable th:nth-child(5), .bonusTable td:nth-child(5) {
    width: 20% !important
}

.bonusTable th:nth-child(6), .bonusTable td:nth-child(6) {
    width: 15% !important
}

.bonusTable th:last-child, .bonusTable td:last-child {
    width: 10% !important
}


.count {
    position: absolute;
    top: -6px;
    right: -5px;
    width: 14px;
    height: 14px;
    background: #2196f3;
    color: #fff;
    text-align: center;
    font-size: 10px;
    border-radius: 50%;
    z-index: 1;
    display: none
}
/* .bnusViewDD{ width:21%} */
.bnusViewDD .brderSelect .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
    width: auto;
    border-right: 1px solid #e0e0e0;
    padding-right: 10px;
    margin-right: 10px;
}

.bnusViewDD .brderSelect .bootstrap-select > .newBtn {
    padding: 0;
    border: 0 !important;
}

.bnusViewDD .brderSelect .bootstrap-select.btn-group .dropdown-menu {
    border: 0 !important;
}

.bnusViewDD .brderSelect label {
    margin: 0;
}

.calSec .glb-btn {
    margin-top: 0
}

.bnusViewDD .brderSelect .bootstrap-select.btn-group .dropdown-toggle .filter-option {
    padding-right: 10px;
}

.bnusViewDD .brderSelect .bootstrap-select.btn-group .dropdown-toggle .caret {
    right: 0
}

.mulplNo {
    margin: 0
}

    .mulplNo tr:nth-child(odd) {
        background: #f9f9f9;
    }

    .mulplNo tr td:nth-child(2) {
        width: 22%
    }

    .mulplNo tr .form-control {
        box-shadow: none
    }

    .mulplNo > tbody > tr > td {
        vertical-align: middle
    }


.paYes {
    border-top: 1px solid #e0e0e0;
    padding-top: 10px;
}

.payYesUl {
    margin-top: 10px;
}

    .payYesUl li {
        display: table-cell;
        padding-right: 10px
    }

        .payYesUl li:last-child {
            margin-right: 0
        }

.paramScrll .modal-body {
    max-height: 525px;
}

.paramScrll .glb-btn {
    padding-bottom: 15px
}

.bonusTbl .custom-progress {
    background-color: #EB722C;
}

.hr1.owl-carousel .owl-stage, .hr2.owl-carousel .owl-stage {
    margin: auto;
}

.subTree li a {
    height: 120px;
}

.hr1 .owl-item.lastActiveItem li::after {
    right: auto;
    left: 50%;
    border-left: 1px dashed #2196f3;
}

.hr2.subTree li a {
    width: 242px
}

/* 14-May-2020 */

.hr2 .owl-item.active li::before, .hr2 .owl-item.active li::after {
    content: '';
    position: absolute;
    top: 0;
    border-top: 1px dashed #2196f3;
    height: 20px;
    right: 50%;
    width: 50%;
}
/* .hr2{border-top: 1px dashed #2196f3;margin-top:5px} */
.hr2 .owl-item.active li::after {
    right: auto;
    left: 50%;
    border-left: 1px dashed #2196f3;
}

.subTree li.active .tgglPlus::after {
    content: "";
    border-left: 1px dashed #2196f3;
    display: inline-block;
    font-size: 20px;
    height: 20px;
    position: relative;
    bottom: -3px;
}

.notClickable {
    pointer-events: none;
}

    .notClickable .tgglPlus {
        display: none;
    }

.hr1 .lastActiveItem li.active .tgglPlus::before, .hr1 .firstActiveItem li.active .tgglPlus::before,
.hr1 .firstActiveItem + .owl-item li.active .tgglPlus::before,
.hr1 li.active .tgglPlus::before {
    content: '';
    position: absolute;
    bottom: -19px;
    border-top: 1px dashed #2196f3;
    height: 20px;
    right: 50%;
    width: 150%;
}

.hr1 .firstActiveItem li.active .tgglPlus::before {
    left: 50%;
    width: 150%;
}

.hr1 .firstActiveItem + .owl-item li.active .tgglPlus::before {
    left: 50%;
    width: 50%
}

.hr1 li.active .tgglPlus::before {
    right: 50%;
    width: 50%
}

.hr2 {
    margin-top: -1px
}

    .hr2 .owl-item li.singleitem::after {
        border-top: 0;
    }


/****** 15 - MAy -2020 ********/
.hr1 li.firstItem.active .tgglPlus::before {
    border-top: 0
}

.hr1 .firstActiveItem li.secondtItem.active .tgglPlus::before {
    width: 50%;
}

.hr1 .lastActiveItem li.secondtItem.active .tgglPlus::before {
    left: auto;
    width: 50%;
    right: 50%;
}

.hr1 .firstActiveItem li.thirdItem.active .tgglPlus::before {
    left: 50%;
    width: 100%;
}

.hr1 .lastActiveItem li.thirdItem.active .tgglPlus::before {
    width: 100%;
}

.hr1 .firstActiveItem + .owl-item li.thirdItem.active .tgglPlus::before {
    width: 0;
}
/*----------------------------------------------------------------------Calibration------------------------------*/

/* prashant's css starts here */
.head-btn {
    text-align: left;
    font-size: 18px;
    color: #0066CC;
    font-weight: 500;
}

.all-goals-pms {
    margin-top: 32px;
}

.timeline-Div {
    position: relative;
    padding-bottom: 20px;
}

.white-bg {
    background-color: #fff;
    border-radius: 10px;
    padding: 24px;
    box-shadow: 0px 2px 3px rgb(82 103 204 / 40%);
}

.timeline-Div.top-card::after {
    z-index: -1;
    border-left: 2px solid #4DAF51;
    left: 40px;
}

.timeline-Div::after, .timeline-Div.top-card::after {
    height: 100%;
    content: '';
    position: absolute;
    top: 22px;
    border-left: 1px dashed #777;
    left: -40px;
}

.timeline-Div {
    position: relative;
    padding-bottom: 20px;
}

.user-icon {
    width: 38px;
    height: 38px;
    line-height: 38px;
    text-align: center;
    border-radius: 50%;
    margin-right: 12px;
    display: inline-block;
    background-color: #e0e0e0;
}

.new-pms .accArw, .new-pms .btn-link.collapsed .accArw {
    font-size: 12px;
    width: 24px;
    height: 24px;
    border: 1px solid #0066CC;
    text-align: center;
    padding: inherit;
    color: #0066CC;
    line-height: 24px;
    font-weight: 600;
}

.btn-link.collapsed .accArw {
    float: right;
    margin-top: 0;
    font-size: 10px;
    width: 17px;
    height: 17px;
    border: 1px solid #777;
    border-radius: 100%;
    text-align: center;
    padding-top: 3px;
    transform: rotate(0deg);
    transition: .3s;
    background-color: #fff;
}

.btn-link .accArw {
    transform: rotate(180deg);
    transition: .3s;
    margin-top: 0;
    background-color: #fff;
}

.accArw {
    float: right;
    margin-top: 0;
    font-size: 10px;
    width: 17px;
    height: 17px;
    border: 1px solid #777;
    border-radius: 100%;
    text-align: center;
    padding-top: 3px;
}

.head-btn.collapsed {
    color: #222;
}

.p-topband {
    margin-top: -9px;
}

.p-cstm-breadcrumb {
    padding-bottom: 0;
}

.p-cohortheading {
    margin-top: 52px;
    margin-bottom: 24px;
    font-family: 'hcltech_roobertbold';
    font-size: 18px;
    color: #0F5FDC;
}

.p-employeeinfo-heading {
    font-size: 18px;
    font-family: 'hcltech_roobertbold';
    margin-bottom: 0;
    margin-top: 0;
    color: #0F5FDC;
    display: flex;
    align-items: center;
}

.p-mar-top-0 {
    margin-top: 0 !important;
}

.p-cohort-main .panel-default > .panel-heading a.master {
    background: #B7D3FF !important;
    cursor: auto;
    border-bottom: none !important;
}

    .p-cohort-main .panel-default > .panel-heading a.master:hover {
        background: #B7D3FF !important;
    }


.p-cohort-main .panel-default > .panel-heading a.collapsed {
    box-shadow: 0px 6px 8px #5267CC66 !important;
    border-radius: 4px;
    background-color: #fff !important;
    width: 100%;
    padding: 24px 24px 24px 48px;
}

.p-cohort-main .panel-title a {
    border-radius: 4px;
    background-color: #fff !important;
    width: 100%;
    padding: 24px 24px 24px 48px;
    box-shadow: none !important;
}

    .p-cohort-main .panel-title a::before {
        display: none;
    }

.p-cohort-main .panel-default > .panel-heading a:hover {
    background-color: #fff !important;
}

.p-cohort-main .panel-group > .panel {
    margin-bottom: 16px;
}

    .p-cohort-main .panel-group > .panel:last-child {
        margin-bottom: 0;
    }

.p-inbuttonmain {
    display: block;
    margin-top: 26px;
    width: 100%;
}

    .p-inbuttonmain ul {
        list-style: none;
        margin: 0px;
        padding: 0px;
        display: flex;
        justify-content: space-between;
    }

        .p-inbuttonmain ul li {
            margin-right: 8px;
        }

            .p-inbuttonmain ul li:last-child {
                margin-right: 0;
            }

            .p-inbuttonmain ul li p {
                margin-bottom: 12px;
                font-size: 14px;
                color: #222222;
                font-family: 'hcltech_roobertmedium';
            }

    .p-inbuttonmain .p-commonbox {
        padding: 8px 12px;
        background-color: #DEF5D9;
        border: #3C8560 solid 1px;
        display: flex;
        justify-content: space-between;
        width: 170px;
    }

        .p-inbuttonmain .p-commonbox p {
            margin-bottom: 0;
            font-size: 14px;
            color: #222222;
            font-family: 'hcltech_roobertmedium';
        }

            .p-inbuttonmain .p-commonbox p span.p-black {
                font-family: 'hcltech_roobertbold';
                color: #222222;
            }

            .p-inbuttonmain .p-commonbox p span.p-green {
                color: #327053 !important;
                font-family: 'hcltech_roobertbold';
            }

        .p-inbuttonmain .p-commonbox.p-redbox {
            background-color: #FFDEEB;
            border-color: #B43F60;
        }

        .p-inbuttonmain .p-commonbox p span.p-red {
            color: #AA1F51;
            font-family: 'hcltech_roobertbold';
        }

span.p-headingofcard {
    font-family: 'hcltech_roobertbold';
    font-size: 18px;
    color: #222;
    display: block;
    position: relative;
}

    span.p-headingofcard::before {
        content: "";
        width: 12px;
        height: 12px;
        background-color: #0F5FDC;
        border-radius: 50%;
        position: absolute;
        left: -24px;
        top: 4px;
    }

.timeline-Div.top-card::after {
    z-index: -1;
    border-left: 2px solid #0F5FDC;
    left: 40px;
}

.timeline-Div::after, .timeline-Div.top-card::after {
    height: 100%;
    content: '';
    position: absolute;
    top: 22px;
    border-left: 2px solid #0F5FDC;
    left: 29px;
}

.p-cohort-main .panel-group > .panel > .panel-collapse > .panel-body {
    background-color: #fff !important;
    padding: 24px 24px 24px 48px;
}

.p-cohort-main .panel-group > .panel-default > .panel-heading a:after {
    position: absolute;
    top: 22px;
    right: 25px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #0F5FDC;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 12px;
}

.action-box.empInfAction.p-cstm-panelbody-h {
    top: 0 !important;
    margin-bottom: 0 !important;
    display: flex;
    align-items: center;
    margin-left: auto;
}

.empInfAction .batchNum:last-child {
    margin-right: 0 !important;
    padding-right: 0;
    border: none;
}

.batchCount.red {
    background: #AA1F51 !important;
}

.p-cohort-main .panel > .panel-heading > h4.panel-title > a {
    border-bottom: none !important;
}

.p-accordion-innertbl {
    margin-bottom: 0;
    margin-top: 16px;
}

.datashow.p-accordion-innertbl {
    padding: 0 !important;
}

.p-accordion-innertbl table th {
    background-color: #d7ecfe !important;
    color: #222 !important;
    font-size: 12px;
    font-family: 'hcltech_roobertregular';
}

.p-accordion-innertbl .glb-tbl {
    border: #C8D2DD solid 0px !important;
}

.p-accordion-innertbl table tbody td {
    font-size: 12px;
    font-family: 'hcltech_roobertregular';
    color: #222;
}

.p-accordion-innertbl table td input.form-control {
    line-height: 20px;
    box-shadow: none;
}

.p-accordion-innertbl table.glb-tbl > tbody > tr:hover,
.p-accordion-innertbl table.glb-tbl > thead > tr:hover,
.p-accordion-innertbl table.glb-tbl > tbody > tr.odd.hover,
.p-accordion-innertbl table.glb-tbl > tbody > tr.even.hover {
    background: #e7ebf4 !important;
}

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

.p-accordion-innertbl table th span.pms-info {
    color: #2096F3 !important;
    margin-left: 5px;
    font-size: 14px;
    vertical-align: middle;
}

input.cstmChekBox.cstmChekBoxBig[type="checkbox"]:after {
    width: 18px;
    height: 18px;
    line-height: 16px;
    font-size: 12px;
}

input.cstmChekBox[type="checkbox"]:after, input.cstmChekBox[type="radio"]:after, .multiselect-container input[type="checkbox"]:after {
    line-height: 14px;
    font-size: 10px;
    vertical-align: middle;
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-top: -8px;
    border: 1px solid #ccc;
    border-radius: 2px;
    background: #fff;
    text-align: center;
    cursor: pointer;
}

input.cstmChekBox[type="checkbox"]:checked:after, input.cstmChekBox[type="radio"]:checked:after, .multiselect-container input[type="checkbox"]:checked:after {
    font-family: 'pmsFonts' !important;
    content: "\e90e";
    border-color: #2196f3;
    background: #2196f3;
    color: #fff !important;
}

.p-accordion-innertbl table .mdl-selectfield > .form-control.selectReview {
    height: 28px !important;
}

.batchNum .pms-Excel {
    font-size: 16px;
    line-height: 12px;
}

.p-cohort-main .panel-default > .panel-heading a[aria-expanded="false"]:after {
    content: "\e902" !important;
    font-family: 'pmsFonts' !important;
}

.p-cohort-main .panel-default > .panel-heading a[aria-expanded="true"]:after {
    content: "\e902" !important;
    font-family: 'pmsFonts' !important;
    transform: rotate(180deg);
}

.p-cohort-main .panel-title a.master::after,
.p-cohort-main .panel-title a.master span.p-headingofcard::after {
    display: none !important;
}

.p-cohort-main .panel-default > .panel-heading a[aria-expanded="false"] span.p-headingofcard::after {
    content: "Expand" !important;
    position: absolute;
    right: 32px;
    font-size: 14px;
    line-height: 18px;
}

.p-cohort-main .panel-default > .panel-heading a[aria-expanded="true"] span.p-headingofcard::after {
    content: "Collapse" !important;
    position: absolute;
    right: 32px;
    font-size: 14px;
    line-height: 18px;
}

#collapseall {
    display: none;
}

.p-common-expandall, .p-common-collapseall {
    font-size: 14px;
    line-height: 18px;
    position: relative;
    float: right;
    cursor: pointer;
    padding-right: 32px;
    transition: all .3s;
}

    .p-common-expandall::after {
        content: "\e902" !important;
        font-family: 'pmsFonts' !important;
        position: absolute;
        top: -2px;
        right: 0px;
        width: 24px;
        height: 24px;
        border-radius: 50%;
        background: #0F5FDC;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #fff;
        font-size: 12px;
    }

    .p-common-collapseall::after {
        content: "\e902" !important;
        font-family: 'pmsFonts' !important;
        transform: rotate(180deg);
        position: absolute;
        top: -2px;
        right: 0px;
        width: 24px;
        height: 24px;
        border-radius: 50%;
        background: #0F5FDC;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #fff;
        font-size: 12px;
    }

.action-box.empInfAction.p-cstm-panelbody-h .batchNum {
    margin-top: 0;
    font-family: 'hcltech_roobertregular';
}

.p-cstm-panelbody-h .batchNum input {
    font-size: 14px;
    font-family: 'hcltech_roobertregular';
    border: 1px solid #ccc !important;
    box-shadow: none;
    position: relative;
    padding-left: 20px;
}

.pos-rel {
    position: relative;
}

.batchNum.pos-rel .pms-search {
    position: absolute;
    top: 12px;
    left: 6px;
}

.p-redstatus {
    width: 8px;
    height: 8px;
    background: #AA1F51;
    display: inline-block;
    padding-left: 5px;
}

.p-yellowstatus {
    width: 8px;
    height: 8px;
    background: #D8991D;
    display: inline-block;
    padding-left: 5px;
}

.p-filter-main .glb-fltr-thead {
    background-color: #fff;
    color: #222;
    font-family: 'hcltech_roobertregular';
}

    .p-filter-main .glb-fltr-thead .filter-close {
        color: #222;
        font-size: 12px;
    }

.p-filter-main .glb-fltr-rt-grid {
    margin-bottom: 16px;
}

    .p-filter-main .glb-fltr-rt-grid.last-one {
        margin-bottom: 0;
    }

.p-filter-main .glb-fltr-rt-header {
    font-size: 14px;
    font-family: 'hcltech_roobertmedium';
    margin-bottom: 8px;
    padding: 0 !important;
}

.p-filter-main .form-group input[type="text"] {
    border-bottom: none !important;
    border: #ccc solid 1px !important;
    border-radius: 4px;
    height: 34px;
    box-shadow: none !important;
    padding: 8px 10px;
    font-family: 'hcltech_roobertregular';
    font-size: 14px;
}

    .p-filter-main .form-group input[type="text"]::placeholder {
        font-size: 14px;
    }

.p-filter-main button.multiselect {
    border: 1px solid #ccc;
    border-radius: 4px !important;
    padding-left: 10px !important;
    height: 34px;
    font-family: 'hcltech_roobertregular';
    font-size: 14px;
}

.p-filter-main .multiselect-item.filter {
    display: none;
}

.p-filter-main .multiselect-container > li {
    padding: 0 0 10px 0 !important;
    display: flex;
}

    .p-filter-main .multiselect-container > li:last-child {
        padding: 0 !important;
    }

    .p-filter-main .multiselect-container > li > a > label.checkbox {
        line-height: 18px !important;
    }

    .p-filter-main .multiselect-container > li a {
        display: flex !important;
        flex-grow: 1;
    }

.p-filter-main .dropdown-menu > .active > a {
    background-color: #fff !important;
}

.p-filter-main .multiselect-container > li a:focus {
    outline-offset: 3px;
}

.p-filter-main .multiselect-container li a:hover {
    display: flex !important;
    background-color: #fff !important;
    flex-grow: 1;
}

.p-filter-main .glb-btn .secondary-button {
    background-color: transparent;
    border: #6C7882 solid 1px;
    font-size: 16px;
    color: #000000;
    border-radius: 4px;
    text-transform: capitalize;
}

    .p-filter-main .glb-btn .secondary-button:hover {
        background: #475156;
        color: #fff;
    }

.p-filter-main .glb-btn .primary-button {
    background-color: #5F1EBE !important;
    border: #5F1EBE solid 1px !important;
    font-size: 16px;
    color: #fff;
    border-radius: 4px;
    margin-right: 16px;
    text-transform: capitalize;
}

    .p-filter-main .glb-btn .primary-button:hover {
        background-color: #4c189e !important;
        border: #4c189e solid 1px !important;
    }

div.dataTables_filter label {
    font-weight: normal;
    float: right;
    position: absolute;
    right: -46px;
    top: 25px;
    min-width: 174px;
}

    div.dataTables_filter label input {
        width: 174px !important;
        padding-left: 10px !important;
        position: relative;
        border-radius: 4px !important;
    }

        div.dataTables_filter label input::before {
            content: "\e90c";
            font-family: 'pmsFonts' !important;
            position: absolute;
        }

.action-box.empInfAction.p-cstm-panelbody-h {
    padding-right: 200px;
    z-index: 0;
}

.p-accordion-innertbl .dataTables_filter span.icon-app-close {
    position: absolute;
    right: 15px;
    top: -34px;
    font-size: 10px;
}

.p-accordion-innertbl .dataTables_filter span.icon-searching {
    position: absolute;
    left: auto;
    top: -34px;
    right: 11px;
    font-size: 14px;
}

.p-accordion-innertbl .dataTables_filter .searhFilter {
    right: -57px !important;
    top: 70px !important;
}

.p-accordion-innertbl .dataTables_scrollBody thead tr:first-child,
.p-accordion-innertbl .DTFC_LeftBodyLiner thead tr:first-child {
    visibility: collapse !important;
}

.p-accordion-innertbl .DTFC_LeftBodyLiner .p-innrtbl-datacsmt tbody td {
    height: 34px !important;
}

.p-accordion-innertbl table th,
.p-accordion-innertbl table td {
    padding: 10px 16px !important;
}

table.table.p-innrtbl-datacsmt.dataTable {
    width: 100% !important;
}
/* prashant's css ends here */

@font-face {
    font-family: 'hdrFont';
    src: url('../fonts/hdrFont.eot?p53ruf');
    src: url('../fonts/hdrFont.eot?p53ruf#iefix') format('embedded-opentype'), url('../fonts/hdrFont.ttf?p53ruf') format('truetype'), url('../fonts/hdrFont.woff?p53ruf') format('woff'), url('../fonts/hdrFont.svg?p53ruf#hdrFont') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

[class^="hdr-"], [class*=" hdr-"] {
    font-family: 'hdrFont' !important;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.hdr-andriod:before {
    content: "\e913";
}

.hdr-apple:before {
    content: "\e929";
}

.hdr-arrow-window:before {
    content: "\e92a";
}

.hdr-arrow:before {
    content: "\e92b";
}

.hdr-Star:before {
    content: "\e928";
}

.hdr-doc:before {
    content: "\e920";
}

.hdr-eps:before {
    content: "\e921";
}

.hdr-gif:before {
    content: "\e922";
}

.hdr-jpg:before {
    content: "\e923";
}

.hdr-pdf:before {
    content: "\e924";
}

.hdr-png:before {
    content: "\e931";
}

.hdr-ppt:before {
    content: "\e932";
}

.hdr-psd:before {
    content: "\e933";
}

.hdr-rar:before {
    content: "\e934";
}

.hdr-txt:before {
    content: "\e935";
}

.hdr-xls:before {
    content: "\e936";
}

.hdr-zip:before {
    content: "\e937";
}

.hdr-relaseNote:before {
    content: "\e925";
}

.hdr-rmDashboard:before {
    content: "\e926";
}

.hdr-telecommuting:before {
    content: "\e927";
}

.hdr-vendorStaff:before {
    content: "\e930";
}

.hdr-hcl:before {
    content: "\e91e";
}

.hdr-hclTech:before {
    content: "\e91f";
}

.hdr-accordionClose:before {
    content: "\e900";
}

.hdr-accordionOpen:before {
    content: "\e901";
}

.hdr-average:before {
    content: "\e902";
}

.hdr-belowAverage:before {
    content: "\e903";
}

.hdr-changeRole:before {
    content: "\e904";
}

.hdr-demo:before {
    content: "\e905";
}

.hdr-edit:before {
    content: "\e906";
}

.hdr-excellent:before {
    content: "\e907";
}

.hdr-faq:before {
    content: "\e908";
}

.hdr-feedback:before {
    content: "\e909";
}

.hdr-gcs:before {
    content: "\e90a";
}

.hdr-good:before {
    content: "\e90b";
}

.hdr-hclToday:before {
    content: "\e90c";
}

.hdr-help:before {
    content: "\e90d";
}

.hdr-iBridge:before {
    content: "\e90e";
}

.hdr-internal-nav:before {
    content: "\e90f";
}

.hdr-iTime:before {
    content: "\e910";
}

.hdr-lms:before {
    content: "\e911";
}

.hdr-logOut:before {
    content: "\e912";
}

.hdr-logoutHover:before {
    content: "\e913";
}

.hdr-myApproval:before {
    content: "\e914";
}

.hdr-myFav:before {
    content: "\e915";
}

.hdr-notification:before {
    content: "\e916";
}

.hdr-poor:before {
    content: "\e917";
}

.hdr-smartSurvey:before {
    content: "\e918";
}

.hdr-ssd:before {
    content: "\e919";
}

.hdr-tas:before {
    content: "\e91a";
}

.hdr-transportal:before {
    content: "\e91b";
}

.hdr-userManual:before {
    content: "\e91c";
}

.hdr-video:before {
    content: "\e91d";
}

@font-face {
    font-family: 'hcltech_roobertbold';
    src: url('../fonts/hcltechroobert-bold-webfont.woff2') format('woff2'), url('../fonts/hcltechroobert-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'hcltech_roobertbold_italic';
    src: url('../fonts/hcltechroobert-bolditalic-webfont.woff2') format('woff2'), url('../fonts/hcltechroobert-bolditalic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'hcltech_roobertheavy';
    src: url('../fonts/hcltechroobert-heavy-webfont.woff2') format('woff2'), url('../fonts/hcltechroobert-heavy-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'hcltech_roobertheavy_italic';
    src: url('../fonts/hcltechroobert-heavyitalic-webfont.woff2') format('woff2'), url('../fonts/hcltechroobert-heavyitalic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'hcltech_roobertlight';
    src: url('../fonts/hcltechroobert-light-webfont.woff2') format('woff2'), url('../fonts/hcltechroobert-light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'hcltech_roobertlight_italic';
    src: url('../fonts/hcltechroobert-lightitalic-webfont.woff2') format('woff2'), url('../fonts/hcltechroobert-lightitalic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'hcltech_roobertmedium';
    src: url('../fonts/hcltechroobert-medium-webfont.woff2') format('woff2'), url('../fonts/hcltechroobert-medium-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'hcltech_roobertmedium_italic';
    src: url('../fonts/hcltechroobert-mediumitalic-webfont.woff2') format('woff2'), url('../fonts/hcltechroobert-mediumitalic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'hcltech_roobertregular';
    src: url('../fonts/hcltechroobert-regular-webfont.woff2') format('woff2'), url('../fonts/hcltechroobert-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'hcltech_roobertregular_italic';
    src: url('../fonts/hcltechroobert-regularitalic-webfont.woff2') format('woff2'), url('../fonts/hcltechroobert-regularitalic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'hcltech_roobertsemibold';
    src: url('../fonts/hcltechroobert-semibold-webfont.woff2') format('woff2'), url('../fonts/hcltechroobert-semibold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'hcltech_roobertSBdIt';
    src: url('../fonts/hcltechroobert-semibolditalic-webfont.woff2') format('woff2'), url('../fonts/hcltechroobert-semibolditalic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}








/* Performance Journal CSS Start Chang 20 July 2023 by Sumit*/
.text-black {
    color: #000000 !important
}

.text-white {
    color: #000000 !important
}

.justify-content-between {
    justify-content: space-between;
}

.align-items-center {
    align-items: center;
}

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

.mb-8 {
    margin-bottom: 8px;
}

.mb-16 {
    margin-bottom: 16px;
}

.mt-32 {
    margin-top: 32px;
}

.mb-32 {
    margin-bottom: 32px;
}

.mt-30 {
    margin-top: 30px;
}

.pd-t-32 {
    padding-top: 32px;
}

.pd-b-32 {
    padding-bottom: 32px;
}

.pd-32 {
    padding: 32px;
}






.performanceJournal .goal-breadcrumb {
    border-bottom: 0px solid #e7e7e7;
}

.performanceJournal .top-band {
    box-shadow: none;
    border-bottom: 1px solid #D6DCE4;
}

.performanceJournal .my-goalBreadcrumb {
    display: flex;
    padding-bottom: 0px;
}

.performanceJournal .fy-year {
    float: right;
    color: #757575;
    border-left: 1px solid #5B666D81;
    margin-left: 10px;
    padding-left: 10px;
}

.performanceJournal .rev-date.active {
    font-family: 'hcltech_roobertsemibold';
    color: #000000;
}

.performanceJournal .rev-period.active {
    font-family: 'hcltech_roobertsemibold';
    color: #000000;
}

.performanceJournal .fy-year ul li {
    display: inline-block;
    color: #5B666D;
    font-family: 'hcltech_roobertmedium';
}

.performanceJournal .switch {
    position: relative;
    width: 60px;
}

.performanceJournal label {
    margin-bottom: 0px;
}

.performanceJournal .slider {
    width: 33px;
}

.performanceJournal input:checked + .slider {
    background-color: #dbf5d7;
}

    .performanceJournal input:checked + .slider:before {
        -webkit-transform: translateX(17px);
        -ms-transform: translateX(17px);
        transform: translateX(17px);
        border: 1px solid #49c272;
        background-color: #49c272;
    }

.performanceJournal .breadcrumb-list > .breadcrumb-item {
    display: inline-block;
    font-family: 'hcltech_roobertregular';
}

.cont-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* margin-top: 28px;
    margin-bottom: 32px; */
}

    .cont-header h1 {
        color: #000000;
        font-size: 32px;
        font-family: 'hcltech_roobertbold';
        margin-bottom: 0px;
    }

    .cont-header img {
        margin-right: 15px;
    }

.custom-btn img {
    margin-right: 5px;
}

.blueCard h3 {
    margin-top: 0px;
    color: #ffffff;
    font-size: 20px;
    font-family: 'hcltech_roobertsemibold';
}

.whiteCard h3 {
    margin-top: 0px;
    color: #000000;
    font-size: 20px;
    font-family: 'hcltech_roobertsemibold';
}

.custom-row {
    display: flex;
    padding-top: 25px;
}

.custom-col-8 {
    /* width: 66.66666667%; */
    background-color: #fff;
    padding-left: 43px;
    padding-right: 16px;
}

.custom-col-4 {
    /* width: 33.33333333%; */
    padding-left: 16px;
    padding-right: 43px;
}

.right-content {
    padding: 16px;
    background-color: #F7F7FC;
    border-radius: 8px;
    margin-top: 16px;
}

.custom-btn {
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: transparent;
    background-image: none;
    border-radius: 4px;
    color: #5F1EBE;
    font-family: 'hcltech_roobertmedium';
    border: 1px solid #5F1EBE;
    font-family: 'hcltech_roobertsemibold';
}

.text-btn {
    display: inline-block;
    padding: 0px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: transparent;
    background-image: none;
    border-radius: 0px;
    border: 0px solid;
    color: #5F1EBE;
    font-family: 'hcltech_roobertmedium';
    transition: .5s;
}

a:focus, a:hover {
    color: #511dc2;
    text-decoration: underline;
}

.text-btn:hover {
    text-decoration: underline;
}

.custom-btn .hdr-arrow {
    font-size: 12px;
}

.custom-btn:hover {
    background-color: #7647DD;
    color: #fff;
    border-color: #7647DD;
    transition: .5s;
}

.owl-nav button:hover {
    background-color: #5877E7 !important;
    color: #fff !important;
}

    .owl-nav button:hover span {
        color: #fff !important;
    }

.blueCard {
    padding: 24px 16px;
    border-radius: 5px;
}

.whiteCard {
    padding: 24px;
    border-radius: 5px;
}

.white-bg h3 {
    margin-top: 0px;
    color: #000000;
    font-size: 20px;
    font-family: 'hcltech_roobertsemibold';
}

.blueCard-2 {
    padding-bottom: 33px;
}

.blue-card-title {
    margin-bottom: 24px;
}

.card-title {
    margin-bottom: 16px;
}

.blue-gradient {
    background: rgb(88,120,232);
    background: -moz-linear-gradient(0deg, rgba(88,120,232,1) 0%, rgba(70,86,183,1) 100%);
    background: -webkit-linear-gradient(0deg, rgba(88,120,232,1) 0%, rgba(70,86,183,1) 100%);
    background: linear-gradient(0deg, rgba(88,120,232,1) 0%, rgba(70,86,183,1) 100%);
}

.blue-bg {
    background-color: #0F5FDC;
}

.white-bg {
    background-color: #ffffff;
}

.gray-bg {
    background-color: #E2E7F7;
    box-shadow: 0px 2px 4px #5069D343;
}

.white-card-warp {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.white-card {
    background-color: #F1F2F8;
    border-radius: 5px;
    padding: 12px 8px;
    width: 23%;
    transition: .5s;
}

    .white-card p {
        color: #475156;
        margin-bottom: 0px;
        font-size: 12px;
        font-family: 'hcltech_roobertmedium';
    }

.hrs {
    color: #4E4B66;
    font-size: 18px;
    font-family: 'hcltech_roobertbold';
    margin-top: 12px;
}

    .hrs span {
        color: #475156;
        font-size: 16px;
        font-family: 'hcltech_roobertmedium';
    }

.cont-header h2 {
    margin-top: 0px;
    color: #000;
    font-size: 20px;
    font-family: 'hcltech_roobertsemibold';
    margin-bottom: 0px;
}

.skil-data-warp {
    display: flex;
}

.data-warp {
    padding: 24px 16px;
    border: 1px solid #EFF0F7;
    border-radius: 5px;
    background-color: #EFF0F7;
    margin-top: 32px;
}

.skil-chip {
    display: inline-block;
    background-color: #F6F8FA;
    border-radius: 17px;
    padding: 8px 12px;
    color: #000;
    font-size: 13px;
    font-family: 'hcltech_roobertregular';
    margin-right: 8px;
    border: 1px dashed #D9DBE9;
}

.uploadIcon {
    width: 18px;
    height: 18px;
    background-color: #F4F0FF;
    border-radius: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 8px;
}

.contributionWarp .custom-btn {
    padding: 6px 20px;
}

.uploadIcon {
    font-size: 10px;
}

.quality-data {
    overflow: hidden;
    max-height: 239px;
}

    .quality-data:hover {
        overflow: hidden;
        overflow-y: scroll;
    }

.contributionWarp .custom-btn:hover .uploadIcon {
    border: solid 0.9px;
    background-color: transparent;
}

.data-table thead {
    position: sticky;
    width: 100%;
    top: 0px;
}

/*.data-table thead th {
        background-color: #D9DBE9;
    }
*/
.data-table {
    border: 1px solid #A0A3BD;
    border-radius: 4px;
}

.quality-data th {
    font-size: 14px;
    font-family: 'hcltech_roobertsemibold';
    color: #000000
}

.quality-data td {
    font-size: 14px;
    font-family: 'hcltech_roobertregular';
    color: #000000
}

.quality-data .table {
    margin-bottom: 0px;
}

    .quality-data .table > tbody > tr:nth-child(odd) {
        background-color: #f7f7fc;
    }

    .quality-data .table > tbody > tr > td,
    .quality-data .table > thead > tr > th {
        padding: 12px 32px;
        border-top: 0px;
    }

        .quality-data .table > tbody > tr > td > a {
            color: #5F1EBE;
            padding-bottom: 2px;
            display: inline-block;
            border-bottom: solid 0px;
        }

            .quality-data .table > tbody > tr > td > a:hover {
                text-decoration: underline;
            }

.quality-data .table-hover > tbody > tr:hover {
    background-color: #D7ECFD;
}
/* PROGRESS BAR START   */
.learning-graph {
    border: 0.5px solid #D9DBE9;
    border-radius: 8px;
    background-color: #fff;
    padding: 16px 16px 8px 16px;
    margin-bottom: 24px;
    transition: 0.5s;
    position: relative;
}

.hidden-link {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 1;
}

.learning-graph:hover {
    box-shadow: 0px 2px 8px #084E9333;
    transition: 0.5s;
}

.learning-graph p {
    font-size: 14px;
    font-family: 'hcltech_roobertmedium';
    color: #14142B;
    margin-bottom: 26px;
    display: flex;
    align-items: center;
    transition: 0.5s;
    justify-content: space-between;
}

    .learning-graph p span {
        opacity: 0;
        transition: 0.5s;
        margin-right: 50px;
    }

.learning-graph:hover p span {
    opacity: 1;
    transition: 0.5s;
    margin-right: 0px;
}

.graphArea {
    display: flex;
    justify-content: space-around;
    align-items: center;
    border-bottom: 0.5px solid #D9DBE9;
}

.left-side,
.right-side {
    margin-top: 30px;
}

.progress {
    position: relative;
    margin: 0px;
    float: left;
    text-align: center;
    height: auto;
    background-color: transparent;
    box-shadow: none;
    margin-bottom: -15px;
}

.barOverflow { /* Wraps the rotating .bar */
    position: relative;
    overflow: hidden; /* Comment this line to understand the trick */
    width: 180px;
    height: 90px; /* Half circle (overflow) */
    margin-bottom: -14px; /* bring the numbers up */
}

.bar {
    position: absolute;
    top: 0;
    left: 0;
    width: 180px;
    height: 180px; /* full circle! */
    border-radius: 50%;
    box-sizing: border-box;
    border: 15px solid #FFD970; /* half gray, */
    border-bottom-color: #6FCFBF; /* half azure */
    border-right-color: #6FCFBF;
}

.bar-text {
    font-weight: 600;
    font-size: 20px;
    visibility: hidden;
}

.totalHoursWarp {
    position: absolute;
    top: 40px;
    left: 58px;
}

.totalHours {
    font-size: 20px;
    color: #000000;
    font-family: 'hcltech_roobertbold';
}

.totalHoursText {
    font-size: 12px;
    color: #5B666D;
    font-family: 'hcltech_roobertregular';
}

.percentage {
    font-size: 14px;
    color: #14142B;
    font-family: 'hcltech_roobertsemibold';
}

.hours {
    font-size: 12px;
    color: #8291A0;
    font-family: 'hcltech_roobertregular';
}
/* PROGRESS BAR START END  */

.quality-data .table > thead > tr > th:last-of-type,
.quality-data .table > tbody > tr > td:last-of-type {
    text-align: center;
}

.files-e {
    border: solid 0px;
    color: #5e1ebe;
    padding: 0px 4px;
    display: inline-block;
    background-color: transparent;
    text-align: center;
}

.quality-data .gs-delete {
    font-size: 18px;
}

.quality-data .table-hover > tbody > tr:hover .gs-delete {
    color: #7647DD;
}

.attention-icon {
    margin-bottom: 24px;
}

    .attention-icon span {
        font-size: 56px;
        color: #C8870A;
    }

.value-icon {
    width: 8px;
    height: 8px;
    display: flex;
    border-radius: 4px;
    font-size: 10px;
    background-color: #8291A0;
    align-items: center;
    justify-content: center;
    margin-right: 13px;
}

.value-text {
    display: flex;
    align-items: center;
    font-size: 16px;
    font-family: 'hcltech_roobertmedium';
}

.value-list {
    display: flex;
    align-items: center;
    color: #fff;
    justify-content: space-between;
    margin-top: 26px;
}

.value-num {
    font-size: 18px;
    font-family: 'hcltech_roobertmedium';
}

.value-icon .hdr-arrow:before {
    font-weight: bold;
}

.mr-b-40 {
    margin-bottom: 40px;
}

.mr-b-30 {
    margin-bottom: 30px;
}

.mr-t-25 {
    margin-top: 25px;
}

.mr-b-15 {
    margin-bottom: 15px;
}

.mr-b-10 {
    margin-bottom: 10px;
}

.pad-b-30 {
    padding-bottom: 30px;
}

.d-none {
    display: none;
}

.mTop24 {
    margin-top: 24px;
}

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

.whiteCard .value-list {
    color: #000;
}

.whiteCard p {
    font-size: 16px;
    font-family: 'hcltech_roobertmedium';
    margin-bottom: 25px;
}

.whiteCard .value-icon {
    background-color: #8291A0;
}

.gray-bg p {
    margin-bottom: 0px;
}

.border-card {
    border: 0.5px solid #D9DBE9;
    border-radius: 8px;
    padding: 10px 16px;
    margin-top: 16px;
}

    .border-card p {
        font-size: 14px;
        font-family: 'hcltech_roobertmedium';
        line-height: 24px;
        margin-bottom: 0px;
    }
/* CUSTOM DROP MODAL START  */
.modal-dialog {
    margin-top: 56px;
}

.modalSm {
    max-width: 480px !important;
}

#deleteSuccessModal .modal-header .close {
    color: #000000 !important;
    margin-top: -5px !important;
}

.alertBody h2 {
    font-size: 16px;
    font-weight: 500;
    margin-top: 20px;
    line-height: 24px;
    color: #000000;
    font-family: 'hcltech_roobertregular';
}

.alertBody {
    padding: 27px 16px 45px;
    min-height: 200px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}

#uplodedModal .modal-lg {
    max-width: 775px;
}

.alertBody img {
    width: 80px;
}

.Upload-warp {
    position: relative;
}

.Upload-dropdown {
    position: absolute;
    max-width: 900px;
    height: auto;
    box-shadow: 0px 3px 6px #00000029;
    background-color: #fff;
    border: 0.5px solid #8291A0;
    border-radius: 5px;
    right: 0px;
    padding: 16px;
    top: 55px;
    transition: 1s;
}

    .Upload-dropdown::before {
        content: '';
        display: block;
        height: 100%;
        width: 100%;
        z-index: 9999;
        background-color: #000000;
    }

.dropdown-aerrow {
    position: absolute;
    display: block;
    width: 1rem;
    height: 0.5rem;
    margin: 0 0.3rem;
    top: -11px;
    right: 50px;
}

.backdrop-screen {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1050;
    width: 100vw;
    height: 100vh;
    background-color: #000;
}

    .backdrop-screen.fade {
        opacity: 0;
    }

.overflow-hidden {
    overflow: hidden;
    padding: 0px;
}

.backdrop-screen.show {
    opacity: .5;
    display: block;
}

.dropdown-aerrow::before,
.dropdown-aerrow::after {
    position: absolute;
    display: block;
    content: "";
    border-color: transparent;
    border-style: solid;
}

.dropdown-aerrow::before {
    border-width: 0 0.8rem 0.8rem 0.8rem;
    top: 0;
    border-bottom-color: rgba(0,0,0,.25);
}

.dropdown-aerrow::after {
    border-width: 0 0.8rem 0.8rem 0.8rem;
    top: 1px;
    border-bottom-color: #fff;
}

.drop-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.drop-title {
    color: #0F5FDC;
    font-size: 24px;
    font-family: 'hcltech_roobertsemibold';
    padding: 0px;
    margin: 0px;
}

.drop-select {
    margin-top: 7px;
    margin-bottom: 24px;
}

.Upload-warp .brderSelect label {
    color: #222222;
    font-weight: 500;
    font-size: 14px;
    font-family: 'hcltech_roobertmedium';
    margin-bottom: 8px;
}

.Upload-warp .brderSelect .bootstrap-select > .newBtn {
    border: 1px solid #B9C3D0 !important;
    padding: 9px 10px;
    border-radius: 4px;
}

.Upload-warp .brderSelect .bootstrap-select.btn-group .dropdown-toggle .filter-option {
    color: #6C7882;
    font-family: 'hcltech_roobertmedium';
    font-size: 14px;
}

.Upload-warp .bootstrap-select .dropdown-menu > li > a {
    padding: 10px 12px;
    color: #475156;
    font-size: 14px;
    font-family: 'hcltech_roobertmedium';
    transition: .5s;
}

    .Upload-warp .bootstrap-select .dropdown-menu > li > a:hover {
        background-color: #D7ECFD;
        transition: .5s;
    }

.Upload-warp .bootstrap-select.btn-group .dropdown-toggle .filter-option {
    color: #000 !important
}

.Upload-warp .bootstrap-select.btn-group .dropdown-menu li:nth-of-type(odd) {
    background-color: #F8F8F8;
}

.Upload-warp .upload small {
    display: none;
}

.Upload-warp .dz-default.dz-message {
    position: relative;
    cursor: pointer;
    text-align: left;
    padding-left: 67px;
    top: 10px;
}

.Upload-warp .dz-message span {
    display: block;
    height: 34px;
    padding: 6px 12px;
    border: 0px solid #ccc;
    font-size: 20px;
    color: #5B666D;
    font-family: 'hcltech_roobertregular';
}

    .Upload-warp .dz-message span p {
        display: inline-block;
        color: #5F1EBE;
    }

.Upload-warp .receive-fed {
    border: 1px dashed #B9C3D0;
    border-radius: 4px;
}

.Upload-warp .sup-doc > .dropzone > .dz-default {
    width: 725px;
}

.Upload-warp .sup-doc > .dropzone > .uploadList {
    width: 700px;
}

.Upload-warp .card-box {
    padding: 17px;
    margin-bottom: 10px;
}

#skilData .quality-data {
    overflow: hidden;
    overflow-y: scroll;
    width: 100%;
    min-height: calc(100vh - 163px);
}

.Upload-warp .glb-btn > button.close-btn {
    background: transparent;
    border: solid 1px #6C7882;
    color: #000000;
    border-radius: 4px;
    font-size: 14px;
    font-family: 'hcltech_roobertmedium';
    text-transform: none;
    min-width: auto;
}

.Upload-warp .glb-btn > button.save-btn {
    background: #5F1EBE;
    border: solid 1px #5F1EBE;
    color: #fff;
    border-radius: 4px;
    font-size: 14px;
    font-family: 'hcltech_roobertmedium';
    text-transform: none;
    min-width: auto;
}

.Upload-warp .glb-btn > button.btn.btn[disabled] {
    cursor: not-allowed;
    opacity: .5;
    -webkit-box-shadow: none;
    box-shadow: none;
    background: #A98EF4;
    border-color: #A98EF4;
}

.gs-delete {
    cursor: pointer;
}

.learn-icon {
    width: 73px;
    height: 73px;
    border: 1px solid #D6DCE4;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}

.learn-data p {
    color: #000;
    font-size: 18px;
    font-family: 'hcltech_roobertmedium';
    margin-top: 15px;
    text-align: center;
    line-height: 20px;
}

.status-info {
    position: absolute;
    top: 0px;
    right: -5px;
}

.skill-warp {
    display: flex;
}

    .skill-warp:nth-last-child(1) {
        margin-top: 8px;
    }

.skill-title {
    font-size: 14px;
    color: #333A3D;
    font-family: 'hcltech_roobertmedium';
}

.skill-type {
    font-size: 14px;
    color: #000000;
    font-family: 'hcltech_roobertsemibold';
    margin-left: 16px;
}
/* CUSTOM DROP MODAL END  */

.breadcrumb-list > .breadcrumb-item > a {
    color: #2096F3;
    transition: all .3s;
    position: relative;
    border-bottom: 1px solid transparent;
}

.breadcrumb-list > .breadcrumb-item.active > a {
    font-family: 'hcltech_roobertsemibold';
}

.breadcrumb-list > li + li:before {
    padding: 0 3px;
    color: #2096F3;
    content: "/\00a0";
}

.skill-data th {
    font-size: 14px;
    font-family: 'hcltech_roobertsemibold';
    color: #5B666D;
}

.skill-data tr {
    box-shadow: 0px 1px 4px #00000029;
    border: 0px solid #00000000;
    border-radius: 5px;
    margin-bottom: 8px;
}

.skill-data .table {
    margin-bottom: 0px;
    border-collapse: separate;
    border-spacing: 0 12px;
}

    .skill-data .table > tbody > tr > td,
    .skill-data .table > thead > tr > th {
        padding: 16px;
        border-top: 0px solid #C8D2DD;
    }

.skill-data .table-hover > tbody > tr:hover {
    background-color: #D7ECFD;
    border-radius: 5px;
    overflow: hidden;
}

/*.dz-description {
    display: none;
}*/

.idicater-warp {
    display: flex;
}

.idicater {
    position: relative;
    font-size: 10px;
    font-family: 'hcltech_roobertmedium';
    margin-left: 16px;
}

    .idicater::before {
        content: '';
        width: 8px;
        height: 8px;
        border: 0.5px solid #FFFFFF;
        border-radius: 0.5px;
        background-color: #ccc;
        display: inline-block;
        margin-right: 4px;
    }

    .idicater.completed::before {
        background-color: #6FCFBF;
    }

    .idicater.pending::before {
        background-color: #FFD970;
    }



/* prashant's css starts here */
.head-btn {
    text-align: left;
    font-size: 18px;
    color: #0066CC;
    font-weight: 500;
}

.all-goals-pms {
    margin-top: 32px;
}

.timeline-Div {
    position: relative;
    padding-bottom: 20px;
}

.white-bg {
    background-color: #fff;
    border-radius: 5px;
    padding: 24px;
}

.light-gray-bg {
    background-color: #EFF0F7;
    border-radius: 5px;
    padding: 24px;
    display: inline-block;
    width: 100%;
}

.light-bg {
    background-color: #F6F8FA;
    border-radius: 5px;
    padding: 24px 16px;
    border: 1px solid #EFF0F7;
}

.timeline-Div.top-card::after {
    z-index: -1;
    border-left: 2px solid #4DAF51;
    left: 40px;
}

.timeline-Div::after, .timeline-Div.top-card::after {
    height: 100%;
    content: '';
    position: absolute;
    top: 22px;
    border-left: 1px dashed #777;
    left: -40px;
}

.timeline-Div {
    position: relative;
    padding-bottom: 20px;
}

.user-icon {
    width: 38px;
    height: 38px;
    line-height: 38px;
    text-align: center;
    border-radius: 50%;
    margin-right: 12px;
    display: inline-block;
    background-color: #e0e0e0;
}

.new-pms .accArw, .new-pms .btn-link.collapsed .accArw {
    font-size: 12px;
    width: 24px;
    height: 24px;
    border: 1px solid #0066CC;
    text-align: center;
    padding: inherit;
    color: #0066CC;
    line-height: 24px;
    font-weight: 600;
}

.btn-link.collapsed .accArw {
    float: right;
    margin-top: 0;
    font-size: 10px;
    width: 17px;
    height: 17px;
    border: 1px solid #777;
    border-radius: 100%;
    text-align: center;
    padding-top: 3px;
    transform: rotate(0deg);
    transition: .3s;
    background-color: #fff;
}

.btn-link .accArw {
    transform: rotate(180deg);
    transition: .3s;
    margin-top: 0;
    background-color: #fff;
}

.accArw {
    float: right;
    margin-top: 0;
    font-size: 10px;
    width: 17px;
    height: 17px;
    border: 1px solid #777;
    border-radius: 100%;
    text-align: center;
    padding-top: 3px;
}

.head-btn.collapsed {
    color: #222;
}

.p-topband {
    margin-top: -9px;
}

.p-cstm-breadcrumb {
    padding-bottom: 0;
}

.p-cohortheading {
    margin-top: 52px;
    margin-bottom: 24px;
    font-family: 'hcltech_roobertbold';
    font-size: 18px;
    color: #0F5FDC;
}

.p-employeeinfo-heading {
    font-size: 18px;
    font-family: 'hcltech_roobertbold';
    margin-bottom: 0;
    margin-top: 0;
    color: #0F5FDC;
    display: flex;
    align-items: center;
}

.p-mar-top-0 {
    margin-top: 0 !important;
}

.p-cohort-main .panel-default > .panel-heading a.master {
    background: #B7D3FF !important;
    cursor: auto;
    border-bottom: none !important;
}

    .p-cohort-main .panel-default > .panel-heading a.master:hover {
        background: #B7D3FF !important;
    }


.p-cohort-main .panel-default > .panel-heading a.collapsed {
    box-shadow: 0px 6px 8px #5267CC66 !important;
    border-radius: 4px;
    background-color: #fff !important;
    width: 100%;
    padding: 24px 24px 24px 48px;
}

.p-cohort-main .panel-title a {
    border-radius: 4px;
    background-color: #fff !important;
    width: 100%;
    padding: 24px 24px 24px 48px;
    box-shadow: none !important;
}

    .p-cohort-main .panel-title a::before {
        display: none;
    }

.p-cohort-main .panel-default > .panel-heading a:hover {
    background-color: #fff !important;
}

.p-cohort-main .panel-group > .panel {
    margin-bottom: 16px;
}

    .p-cohort-main .panel-group > .panel:last-child {
        margin-bottom: 0;
    }

.p-inbuttonmain {
    display: block;
    margin-top: 26px;
    width: 100%;
}

    .p-inbuttonmain ul {
        list-style: none;
        margin: 0px;
        padding: 0px;
        display: flex;
        justify-content: space-between;
    }

        .p-inbuttonmain ul li {
            margin-right: 8px;
        }

            .p-inbuttonmain ul li:last-child {
                margin-right: 0;
            }

            .p-inbuttonmain ul li p {
                margin-bottom: 12px;
                font-size: 14px;
                color: #222222;
                font-family: 'hcltech_roobertmedium';
            }

    .p-inbuttonmain .p-commonbox {
        padding: 8px 12px;
        background-color: #DEF5D9;
        border: #3C8560 solid 1px;
        display: flex;
        justify-content: space-between;
        width: 200px;
    }

        .p-inbuttonmain .p-commonbox p {
            margin-bottom: 0;
            font-size: 14px;
            color: #222222;
            font-family: 'hcltech_roobertmedium';
        }

            .p-inbuttonmain .p-commonbox p span.p-black {
                font-family: 'hcltech_roobertbold';
                color: #222222;
            }

            .p-inbuttonmain .p-commonbox p span.p-green {
                color: #327053 !important;
                font-family: 'hcltech_roobertbold';
            }

        .p-inbuttonmain .p-commonbox.p-redbox {
            background-color: #FFDEEB;
            border-color: #B43F60;
        }

        .p-inbuttonmain .p-commonbox p span.p-red {
            color: #AA1F51;
            font-family: 'hcltech_roobertbold';
        }

span.p-headingofcard {
    font-family: 'hcltech_roobertbold';
    font-size: 18px;
    color: #222;
    display: block;
    position: relative;
}

    span.p-headingofcard::before {
        content: "";
        width: 12px;
        height: 12px;
        background-color: #0F5FDC;
        border-radius: 50%;
        position: absolute;
        left: -24px;
        top: 4px;
    }

.timeline-Div.top-card::after {
    z-index: -1;
    border-left: 2px solid #0F5FDC;
    left: 40px;
}

.timeline-Div::after, .timeline-Div.top-card::after {
    height: 100%;
    content: '';
    position: absolute;
    top: 22px;
    border-left: 2px solid #0F5FDC;
    left: 29px;
}

.p-cohort-main .panel-group > .panel > .panel-collapse > .panel-body {
    background-color: #fff !important;
    padding: 24px 24px 24px 48px;
}

.p-cohort-main .panel-group > .panel-default > .panel-heading a:after {
    position: absolute;
    top: 22px;
    right: 25px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #0F5FDC;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 12px;
}

.action-box.empInfAction.p-cstm-panelbody-h {
    top: 0 !important;
    margin-bottom: 0 !important;
    display: flex;
    align-items: center;
    margin-left: auto;
}

.empInfAction .batchNum:last-child {
    margin-right: 0 !important;
    padding-right: 0;
    border: none;
}

.batchCount.red {
    background: #AA1F51 !important;
}

.p-cohort-main .panel > .panel-heading > h4.panel-title > a {
    border-bottom: none !important;
}

.p-accordion-innertbl {
    margin-bottom: 0;
    margin-top: 16px;
}

.datashow.p-accordion-innertbl {
    padding: 0 !important;
}

.p-accordion-innertbl table th {
    background-color: #d7ecfe !important;
    color: #222 !important;
    font-size: 12px;
    font-family: 'hcltech_roobertregular';
}

.p-accordion-innertbl .glb-tbl {
    border: #C8D2DD solid 0px !important;
}

.p-accordion-innertbl table tbody td {
    font-size: 12px;
    font-family: 'hcltech_roobertregular';
    color: #222;
}

.p-accordion-innertbl table td input.form-control {
    line-height: 20px;
    box-shadow: none;
}

.p-accordion-innertbl table.glb-tbl > tbody > tr:hover,
.p-accordion-innertbl table.glb-tbl > thead > tr:hover,
.p-accordion-innertbl table.glb-tbl > tbody > tr.odd.hover,
.p-accordion-innertbl table.glb-tbl > tbody > tr.even.hover {
    background: #e7ebf4 !important;
}

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

.p-accordion-innertbl table th span.pms-info {
    color: #2096F3 !important;
    margin-left: 5px;
    font-size: 14px;
    vertical-align: middle;
}

input.cstmChekBox.cstmChekBoxBig[type="checkbox"]:after {
    width: 18px;
    height: 18px;
    line-height: 16px;
    font-size: 12px;
}

input.cstmChekBox[type="checkbox"]:after, input.cstmChekBox[type="radio"]:after, .multiselect-container input[type="checkbox"]:after {
    line-height: 14px;
    font-size: 10px;
    vertical-align: middle;
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-top: -8px;
    border: 1px solid #ccc;
    border-radius: 2px;
    background: #fff;
    text-align: center;
    cursor: pointer;
}

input.cstmChekBox[type="checkbox"]:checked:after, input.cstmChekBox[type="radio"]:checked:after, .multiselect-container input[type="checkbox"]:checked:after {
    font-family: 'pmsFonts' !important;
    content: "\e90e";
    border-color: #2196f3;
    background: #2196f3;
    color: #fff !important;
}

.p-accordion-innertbl table .mdl-selectfield > .form-control.selectReview {
    height: 28px !important;
}

.batchNum .pms-Excel {
    font-size: 16px;
    line-height: 12px;
}

.p-cohort-main .panel-default > .panel-heading a[aria-expanded="false"]:after {
    content: "\e902" !important;
    font-family: 'pmsFonts' !important;
}

.p-cohort-main .panel-default > .panel-heading a[aria-expanded="true"]:after {
    content: "\e902" !important;
    font-family: 'pmsFonts' !important;
    transform: rotate(180deg);
}

.p-cohort-main .panel-title a.master::after,
.p-cohort-main .panel-title a.master span.p-headingofcard::after {
    display: none !important;
}

.p-cohort-main .panel-default > .panel-heading a[aria-expanded="false"] span.p-headingofcard::after {
    content: "Expand" !important;
    position: absolute;
    right: 32px;
    font-size: 14px;
    line-height: 18px;
}

.p-cohort-main .panel-default > .panel-heading a[aria-expanded="true"] span.p-headingofcard::after {
    content: "Collapse" !important;
    position: absolute;
    right: 32px;
    font-size: 14px;
    line-height: 18px;
}

#collapseall {
    display: none;
}

.p-common-expandall, .p-common-collapseall {
    font-size: 14px;
    line-height: 18px;
    position: relative;
    float: right;
    cursor: pointer;
    padding-right: 32px;
    transition: all .3s;
}

    .p-common-expandall::after {
        content: "\e902" !important;
        font-family: 'pmsFonts' !important;
        position: absolute;
        top: -2px;
        right: 0px;
        width: 24px;
        height: 24px;
        border-radius: 50%;
        background: #0F5FDC;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #fff;
        font-size: 12px;
    }

    .p-common-collapseall::after {
        content: "\e902" !important;
        font-family: 'pmsFonts' !important;
        transform: rotate(180deg);
        position: absolute;
        top: -2px;
        right: 0px;
        width: 24px;
        height: 24px;
        border-radius: 50%;
        background: #0F5FDC;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #fff;
        font-size: 12px;
    }

.action-box.empInfAction.p-cstm-panelbody-h .batchNum {
    margin-top: 0;
    font-family: 'hcltech_roobertregular';
}

.p-cstm-panelbody-h .batchNum input {
    font-size: 14px;
    font-family: 'hcltech_roobertregular';
    border: 1px solid #ccc !important;
    box-shadow: none;
    position: relative;
    padding-left: 20px;
}

.pos-rel {
    position: relative;
}

.batchNum.pos-rel .pms-search {
    position: absolute;
    top: 12px;
    left: 6px;
}

.p-redstatus {
    width: 8px;
    height: 8px;
    background: #AA1F51;
    display: inline-block;
    padding-left: 5px;
}

.p-yellowstatus {
    width: 8px;
    height: 8px;
    background: #D8991D;
    display: inline-block;
    padding-left: 5px;
}

.p-filter-main .glb-fltr-thead {
    background-color: #fff;
    color: #222;
    font-family: 'hcltech_roobertregular';
}

    .p-filter-main .glb-fltr-thead .filter-close {
        color: #222;
        font-size: 12px;
    }

.p-filter-main .glb-fltr-rt-grid {
    margin-bottom: 16px;
}

    .p-filter-main .glb-fltr-rt-grid.last-one {
        margin-bottom: 0;
    }

.p-filter-main .glb-fltr-rt-header {
    font-size: 14px;
    font-family: 'hcltech_roobertmedium';
    margin-bottom: 8px;
    padding: 0 !important;
}

.p-filter-main .form-group input[type="text"] {
    border-bottom: none !important;
    border: #ccc solid 1px !important;
    border-radius: 4px;
    height: 34px;
    box-shadow: none !important;
    padding: 8px 10px;
    font-family: 'hcltech_roobertregular';
    font-size: 14px;
}

    .p-filter-main .form-group input[type="text"]::placeholder {
        font-size: 14px;
    }

.p-filter-main button.multiselect {
    border: 1px solid #ccc;
    border-radius: 4px !important;
    padding-left: 10px !important;
    height: 34px;
    font-family: 'hcltech_roobertregular';
    font-size: 14px;
}

.p-filter-main .multiselect-item.filter {
    display: none;
}

.p-filter-main .multiselect-container > li {
    padding: 0 0 10px 0 !important;
    display: flex;
}

    .p-filter-main .multiselect-container > li:last-child {
        padding: 0 !important;
    }

    .p-filter-main .multiselect-container > li > a > label.checkbox {
        line-height: 18px !important;
    }

    .p-filter-main .multiselect-container > li a {
        display: flex !important;
        flex-grow: 1;
    }

.p-filter-main .dropdown-menu > .active > a {
    background-color: #fff !important;
}

.p-filter-main .multiselect-container > li a:focus {
    outline-offset: 3px;
}

.p-filter-main .multiselect-container li a:hover {
    display: flex !important;
    background-color: #fff !important;
    flex-grow: 1;
}

.p-filter-main .glb-btn .secondary-button {
    background-color: transparent;
    border: #6C7882 solid 1px;
    font-size: 16px;
    color: #000000;
    border-radius: 4px;
    text-transform: capitalize;
}

    .p-filter-main .glb-btn .secondary-button:hover {
        background: #475156;
        color: #fff;
    }

.p-filter-main .glb-btn .primary-button {
    background-color: #5F1EBE !important;
    border: #5F1EBE solid 1px !important;
    font-size: 16px;
    color: #fff;
    border-radius: 4px;
    margin-right: 16px;
    text-transform: capitalize;
}

    .p-filter-main .glb-btn .primary-button:hover {
        background-color: #4c189e !important;
        border: #4c189e solid 1px !important;
    }

div.dataTables_filter label {
    font-weight: normal;
    float: right;
    position: absolute;
    right: -46px;
    top: 25px;
    min-width: 174px;
}

    div.dataTables_filter label input {
        width: 174px !important;
        padding-left: 10px !important;
        position: relative;
        border-radius: 4px !important;
    }

        div.dataTables_filter label input::before {
            content: "\e90c";
            font-family: 'pmsFonts' !important;
            position: absolute;
        }

.action-box.empInfAction.p-cstm-panelbody-h {
    padding-right: 200px !important;
    z-index: 0;
}

.p-accordion-innertbl .dataTables_filter span.icon-app-close {
    position: absolute;
    right: 15px;
    top: -34px;
    font-size: 10px;
}

.p-accordion-innertbl .dataTables_filter span.icon-searching {
    position: absolute;
    left: auto;
    top: -34px;
    right: 11px;
    font-size: 14px;
}

.p-accordion-innertbl .dataTables_filter .searhFilter {
    right: -57px !important;
    top: 70px !important;
}

.p-accordion-innertbl .dataTables_scrollBody thead tr:first-child,
.p-accordion-innertbl .DTFC_LeftBodyLiner thead tr:first-child {
    visibility: collapse !important;
}

.p-accordion-innertbl .DTFC_LeftBodyLiner .p-innrtbl-datacsmt tbody td {
    height: 34px !important;
}

.p-accordion-innertbl table th,
.p-accordion-innertbl table td {
    padding: 10px 16px !important;
}

table.table.p-innrtbl-datacsmt.dataTable {
    width: 100% !important;
}

.leadGenData table tr td {
    white-space: nowrap;
}

.leadGenData .table > thead > tr > th,
.leadGenData .table > tbody > tr > td {
    padding: 8px 15px !important;
}

.leadGenData td {
    font-size: 14px;
    font-family: 'hcltech_roobertmedium';
    color: #000000;
}

    .leadGenData td .hdr-view {
        font-size: 22px;
        cursor: pointer;
    }

.sx-pera {
    font-size: 14px;
    font-family: 'hcltech_roobertregular';
    color: #000;
    line-height: 18px;
}

.sm-pera {
    font-size: 14px;
    font-family: 'hcltech_roobertmedium';
    color: #000;
    line-height: 20px;
}

.mr-b {
    margin-bottom: 4px !important;
}

#leadGenModal .modal-body {
    padding: 24px;
}

#leadGenModal .modal-header {
    padding: 24px;
    padding-bottom: 8px;
}

.close {
    opacity: 1;
    margin-top: -3px;
    font-size: 20px;
    color: #000000 !important;
}

.mb-24 {
    margin-bottom: 24px !important;
}

.mb-16 {
    margin-bottom: 16px !important;
}

.popover {
    padding: 5px 10px !important;
}

.popover-content a {
    display: inline-block;
    margin: 0px 2px;
    color: #5e1ebe;
}

.leadGenData .popover {
    min-width: 350px !important;
    padding: 15px !important;
}

.approval_status {
    display: none;
}

.bg-white {
    background-color: #fff;
}

.highcharts-exporting-group {
    display: none !important;
}

.highcharts-background {
    background-color: transparent !important;
    height: auto !important;
}

.approval_status {
    display: none;
}

#chart-box {
    height: 350px;
}

.chart-legend {
    display: flex;
    justify-content: center;
    height: 350px;
    flex-direction: column;
}

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

    .quality-data .table > tbody > tr > td, .quality-data .table > thead > tr > th {
        padding: 12px 16px;
        border-top: 0px;
    }
}

@media screen and (max-width: 1280px) {
    .custom-col-8 {
        padding-left: 0px;
    }

    .custom-col-4 {
        padding-right: 0px;
    }
}

.leadgenHeader p {
    width: 50%;
}

.leadGenData {
    border: 1px solid #C8D2DD !important;
    position: relative;
}

.leadGenWarp {
    position: relative;
}

    .leadGenWarp.top::before {
        content: '';
        border-bottom: 10px solid #c8d2dd;
        border-left: 8px solid transparent;
        border-right: 8px solid transparent;
        position: absolute;
        z-index: 1;
        right: 20px;
        top: -10px;
    }

    .leadGenWarp.top::after {
        content: '';
        border-bottom: 10px solid #D9DBE9;
        border-left: 8px solid transparent;
        border-right: 8px solid transparent;
        position: absolute;
        z-index: 1;
        right: 20px;
        top: -8px;
    }

    .leadGenWarp .quality-data:hover {
        overflow: hidden;
        overflow-y: scroll;
        overflow-x: scroll;
    }

.highcharts-point {
    height: 14px;
    width: 14px;
}

/*.leadGenData {
    height: 224px !important;
*/}

.highcharts-legend-item {
    font-family: 'hcltech_roobertregular';
    font-size: 14px !important;
}

#uplodedModal #dz-preview-template {
    float: left;
    width: 100%;
    max-height: 120px;
    overflow: hidden;
    overflow-y: auto;
    position: static;
    padding-left: 15px;
}

.dz-preview {
    margin-right: 6px;
    margin-bottom: 6px;
}

#uplodedModal .dz-default {
    width: 483px;
    padding-left: 0px !important;
    margin: 0px;
    margin-left: 122px;
    margin-top: -4px;
}

#uplodedModal .Upload-warp .sup-doc > .dropzone > .uploadList {
    width: 545px !important;
}

#uplodedModal .upload-icon {
    font-size: 18px;
    font-weight: 600;
    border: 0px;
    border-radius: 50%;
    padding: 12px;
    float: left;
    color: #5F1EBE;
    z-index: 1;
    position: relative;
    width: 42px;
    height: 42px;
    background: #F4F0FF;
}

#uplodedModal .gs-upload:before {
    content: "\e93a";
    font-family: 'hdrFont' !important;
}

#uplodedModal .Upload-warp .dz-message span {
    display: block;
    height: 19px;
    padding: 0px 12px;
    border: 0px solid #ccc;
    font-size: 20px;
    color: #6C7882;
    font-family: 'hcltech_roobertsemibold';
}

.Upload-warp .dz-message span p a {
    color: #5F1EBE;
    text-decoration: none;
}

    .Upload-warp .dz-message span p a:hover {
        text-decoration: underline;
    }

#skilData .quality-data .table > thead > tr > th:last-of-type,
#skilData .quality-data .table > tbody > tr > td:last-of-type {
    text-align: left;
}

.chartTime h2 {
    font-size: 24px;
    color: #000;
    font-family: 'hcltech_roobertbold';
    margin-bottom: 8px;
}

.highcharts-figure {
    position: relative;
}

.chartTime p {
    font-size: 18px;
    color: #000;
    font-family: 'hcltech_roobertregular';
    margin-bottom: 8px;
}

.chartTime {
    position: absolute;
    border-bottom: 1px solid #000000;
    width: 400px;
    display: block;
    text-align: center;
    top: 83px;
    /* left: 33px; */
}

.custom-pop .popover {
    min-width: none !important;
}

.chart-legend-item {
    display: flex;
    align-items: center;
    margin-bottom: 18px;
}

.indicator {
    width: 14px;
    height: 14px;
    border-radius: 0.5px;
    display: inline-block;
    margin-right: 8px;
}

.chart-legend-item li {
    color: #000000;
    font-family: 'hcltech_roobertregular';
    font-size: 14px;
    text-decoration: none;
}

.indicator.digital {
    background-color: #32AEA0;
}

.indicator.managerial {
    background-color: #F1BB32;
}

.indicator.compliances {
    background-color:#496ec2;
}

.indicator.quality {
    background-color: #F7668F;
}

.indicator.project {
    background-color: #B79D9A;
}
.indicator.Cloud {
    background-color: #97c908;
}
@media (min-width: 992px) {
    .modal-xl {
        width: 1110px;
    }
}

.trainingModal .table {
    width: 100%;
    max-width: 100%;
    margin-bottom: 0px;
    overflow: hidden;
}

    .trainingModal .table > tbody > tr:nth-child(odd) {
        background-color: #F7F7FC;
    }

    .trainingModal .table > tbody > tr > td,
    .trainingModal .table > thead > tr > th {
        padding: 12px 24px;
        border-top: 0px;
    }

.trainingModal .table-hover > tbody > tr:hover {
    background-color: #D7ECFD;
    transition: 0.5s;
}

.trainingModal .table-hover > tbody > tr {
    transition: 0.5s;
}

.trainingModal .drop-title {
    margin-top: 9px;
    margin-bottom: 9px;
}

.quality-data .table > tbody > tr:nth-child(even) {
    background-color: #fff;
}
/* prashant's css ends here */

.popover {
    max-width: 400px !important;
}

.leadgenHeader {
    padding: 10px 8px;
    background-color: #EFF0F7;
    border-radius: 5px;
    font-size: 14px;
    font-family: 'hcltech_roobertmedium';
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    padding-right: 24px;
}

    .leadgenHeader .number {
        font-size: 16px !important;
        font-family: 'hcltech_roobertsemibold' !important;
        display: inline-block;
        margin-left: 8px;
        line-height: 0px
    }

    .leadgenHeader p {
        margin: 0px;
        padding: 0px;
        position: relative;
    }

        .leadgenHeader p:first-child {
            border-right: solid 1px #A5AFBE;
        }

        .leadgenHeader p:last-child {
            text-align: right;
        }

.pb-0 {
    padding-bottom: 0px;
}

.highcharts-container {
    height: 200px !important
}

#chart-box {
    height: 200px;
}

.chart-legend {
    height: 200px;
}

.highcharts-root {
    height: 200px !important;
}

.highcharts-title {
    font-size: 18px !important;
    font-family: 'hcltech_roobertsemibold';
}

.performanceJournal .card-icon, .performanceJournal .card-icon p {
    margin-top: 0
}

.performanceJournal .blue-card-title, .performanceJournal .blue-card-title h5 {
    margin-bottom: 0
}

.performanceJournal .cont-header {
    margin-top: 0
}

.performanceJournal .skil-data-warp {
    padding: 0
}
/* Performance Journal CSS End  */


/************************************************** LTI ********************************************/
table tbody tr:nth-child(even):hover, table tbody tr:nth-child(odd):hover {
    background-color: #D7ECFD
}

.ltitopband .new-details, .ltitopband .details-list {
    float: none
}

.pt182 {
    padding-top: 120px
}

.glb-margin0 {
    margin: 0 !important
}

.pr0 {
    padding-right: 0
}

.mt42 {
    margin-top: 42px !important
}

.ltitopband {
    padding-bottom: 0;
    padding-top: 10px
}

.data-tabs {
    border: 0;
    border-top: 1px solid rgba(112, 112, 112, 0.25);
    margin-top: 10px;
    padding-top: 10px
}

    .data-tabs > li {
        margin: 0
    }

        .data-tabs > li > a, .data-tabs > li.active > a, .data-tabs > li.active > a:focus, .data-tabs > li.active > a:hover {
            border: 0
        }

        .data-tabs > li > a {
            font-size: 16px;
            color: #2963C4;
            padding: 8px 20px
        }

        .data-tabs > li.active > a, .data-tabs > li.active > a:focus, .data-tabs > li.active > a:hover {
            font-size: 16px;
            font-weight: 700;
            color: #fff;
            background-color: #5192DC;
            border-radius: 5px 5px 0px 0px
        }

.data-img {
    margin-left: -43px
}

    .data-img > img {
        width: 137px
    }

.total-amount {
    position: relative;
    padding: 20px;
    border-radius: 5px;
    background: transparent linear-gradient(180deg, rgba(122, 169, 229, 1) 0%, rgba(41, 123, 204, 1) 100%) 0% 0% no-repeat padding-box;
}

    .total-amount::before {
        border: 13px solid transparent;
        border-left-color: #73a5e3;
        top: 25px;
        right: -22px;
        content: '';
        position: absolute
    }

.grant {
    font-size: 18px;
    font-weight: 700;
    color: #fff
}

    .grant ~ .glb-margin0 {
        border-top: 0.5px solid #fff;
        padding-top: 8px;
        margin-top: 8px !important;
    }

    .grant > span {
        font-size: 20px;
        font-weight: 900;
        display: block
    }

.perHead {
    font-size: 18px;
    color: #fff;
    font-weight: 700;
    margin: 0
}

.period {
    font-size: 16px;
    font-weight: 400;
    color: #fff;
    margin: 8px 0 0
}

    .period > span {
        font-size: 18px;
        font-weight: 700;
        display: block
    }

.data-table > thead > tr {
    background: #fff;
    border-radius: 4px;
    margin-bottom: 10px;
    float: left;
    width: 100%
}

    .data-table > thead > tr > th {
        float: left;
        padding: 8px;
        font-weight: 400;
        position: relative;
        font-size: 16px;
        color: #777;
        border: 0 !important;
        text-align: center;
    }

        .data-table > thead > tr > th a {
            color: #000
        }

.data-table > tbody > tr > td, .data-table > tfoot > tr > td {
    padding: 25px 8px;
    font-size: 14px;
    color: #222;
    font-weight: 400;
    text-align: center;
}

    .data-table > tbody > tr > td:first-child, .data-table > thead > tr > th:first-child {
        width: 15%
    }

    .data-table > tbody > tr > td:nth-child(2), .data-table > thead > tr > th:nth-child(2) {
        width: 22%;
        text-align: right
    }

    .data-table > tbody > tr > td:nth-child(3), .data-table > thead > tr > th:nth-child(3) {
        width: 20%;
        text-align: right
    }

    .data-table > tbody > tr > td:nth-child(4), .data-table > thead > tr > th:nth-child(4) {
        width: 15%;
        text-align: center
    }

    .data-table > tbody > tr > td:nth-child(5), .data-table > thead > tr > th:nth-child(5) {
        width: 15%;
        text-align: center
    }

    .data-table > tbody > tr > td:last-child, .data-table > thead > tr > th:last-child {
        width: 13%;
        text-align: center
    }

    .data-table > tbody > tr > td::before, .data-table > thead > tr > th::before, .data-table > tfoot > tr > td::before {
        display: none
    }

.strong {
    font-weight: 900
}

.view-icon, .arrowSlide {
    color: #222;
    margin-right: 15px;
    font-size: 16px;
}

    .view-icon:hover, .arrowSlide:hover {
        color: #2963C4
    }

    .view-icon:last-child {
        margin-right: 0;
    }

    .view-icon.icon-back {
        transform: rotate(180deg);
        display: inline-block;
    }

.arrowSlide {
    display: inline-block;
    transition: all 0.4s ease-in-out;
    vertical-align: middle;
    position: relative;
}

.arrowSlideRotate {
    transform: rotate(180deg);
}

.lti-sec .finanaceSec {
    float: none
}

    .lti-sec .finanaceSec .review-label {
        color: #222
    }

.emp-details li:nth-child(2) {
    padding-right: 5px
}

.select-review {
    float: none;
    display: inline-block
}

.lti-head {
    font-size: 20px;
    color: #222;
    margin-bottom: 25px
}

    .lti-head > span {
        color: #2963C4;
        font-weight: 700
    }

.lti-table > tbody > tr > td {
    padding: 8px;
}

    .lti-table > tbody > tr > td:first-child, .lti-table > thead > tr > th:first-child {
        width: 18%
    }

    .lti-table > tbody > tr > td:nth-child(2), .lti-table > thead > tr > th:nth-child(2) {
        width: 12%;
        text-align: center
    }

    .lti-table > tbody > tr > td:nth-child(3), .lti-table > thead > tr > th:nth-child(3) {
        width: 27%;
        text-align: left
    }

    .lti-table > tbody > tr > td:nth-child(4), .lti-table > thead > tr > th:nth-child(4) {
        width: 12%;
        text-align: center
    }

    .lti-table > tbody > tr > td:nth-child(5), .lti-table > thead > tr > th:nth-child(5) {
        width: 8%;
        text-align: center
    }

    .lti-table > tbody > tr > td:nth-child(6), .lti-table > thead > tr > th:nth-child(6) {
        width: 16%;
        text-align: center
    }

    .lti-table > tbody > tr > td:last-child, .lti-table > thead > tr > th:last-child {
        width: 7%;
        text-align: center
    }

.data-table > tfoot > tr > td {
    border: 0;
    position: relative
}

.lti-table > tfoot > tr > td:first-child {
    width: 18%
}

.lti-table > tfoot > tr > td:nth-child(2) {
    width: 12%
}

.lti-table > tfoot > tr > td:last-child {
    width: 7%;
    text-align: center
}

.parameter {
    font-size: 14px !important;
    width: 63% !important
}

.info-pop {
    font-size: 18px;
    color: #777;
    cursor: pointer
}

.lti-table .hiddenRow {
    border-top: 0;
    background: #3385D6 !important
}

.lti-table .triArrow {
    border: 0;
    background: #fff;
    border-radius: 4px 4px 0 0;
    width: 40px;
    height: 45px;
    top: -45px;
}

    .lti-table .triArrow:after {
        border: 0
    }

.lti-table > tbody > tr.tractive {
    background: #3385D6;
    border-radius: 4px 4px 0 0
}

.data-table > tbody > tr.tractive > td {
    color: #fff
}

.tractive .info-pop, .lti-table .tractive .infoIcn {
    color: #fff;
    font-size: 20px;
    position: relative;
}

.lti-table .tractive .infoIcn {
    color: #222
}

.lti-table > thead > tr > th::before {
    content: '';
    position: absolute;
    top: 0;
    height: 100%;
    left: 0;
    border-left: 1px dotted #e0e0e0
}

.lti-table > tbody > tr > td::before {
    top: 0;
    height: 100%
}

.lti-table > thead > tr > th:first-child::before,
.lti-table > tbody > tr > td:first-child::before {
    display: inline-block;
    right: 0;
    left: inherit
}

.lti-table > thead > tr > th:last-child::before,
.lti-table > tbody > tr > td:last-child::before {
    display: inline-block
}

.lti-table .descTable tr th, .lti-table .descTable tr td {
    padding: 16px;
}

.lti-table > tbody > tr.hiddenRow > td {
    padding: 0 8px 8px
}

.lti-table .descTable tr td {
    width: 50%;
}

.lti-table .pdTable {
    font-size: 14px;
}

.lti-table .infoDivSec .cardBox {
    border: 0
}

.brblue {
    border-right: 1px solid #5892B7
}

.overall-remarks {
    border-top: 1px solid #5892B7
}

    .overall-remarks .pdTable tr td:first-child {
        width: 24%
    }

    .overall-remarks .pdTable tr td:last-child {
        width: 76%;
        border: 0
    }

.lti-assessment-table > tbody > tr > td:first-child, .lti-assessment-table > thead > tr > th:first-child {
    width: 20%;
    text-align: left;
}

.lti-assessment-table > tbody > tr > td:nth-child(2), .lti-assessment-table > thead > tr > th:nth-child(2) {
    width: 15%;
    text-align: center
}

.lti-assessment-table > tbody > tr > td:nth-child(3), .lti-assessment-table > thead > tr > th:nth-child(3) {
    width: 15%;
    text-align: right
}

.lti-assessment-table > tbody > tr > td:nth-child(4), .lti-assessment-table > thead > tr > th:nth-child(4) {
    width: 15%;
    text-align: right
}

.lti-assessment-table > tbody > tr > td:nth-child(5), .lti-assessment-table > thead > tr > th:nth-child(5) {
    width: 15%;
    text-align: center
}

.lti-assessment-table > tbody > tr > td:nth-child(6), .lti-assessment-table > thead > tr > th:nth-child(6) {
    width: 15%;
    text-align: center
}
/* .lti-assessment-table > tbody > tr > td:nth-child(7), .lti-assessment-table > thead > tr > th:nth-child(7){width:10%;text-align:center}
.lti-assessment-table > tbody > tr > td:nth-child(8), .lti-assessment-table > thead > tr > th:nth-child(8){width:12%;text-align:center} */
.lti-assessment-table > tbody > tr > td:last-child, .lti-assessment-table > thead > tr > th:last-child {
    width: 5%;
    text-align: center
}
.aaa{
    font-family: 'hcltech_roobertlight';

    font-family: 'hcltech_roobertregular';

    font-family: 'hcltech_roobertmedium';

    font-family: 'hcltech_roobertsemibold';

    font-family: 'hcltech_roobertbold';
    
}

/* 20-Nov-23 */
body{font-family: 'hcltech_roobertregular';}
.mt0{margin-top:0 !important;}
.mt-24{margin-top:24px !important;}
#feedbackModal textarea.form-control{height: inherit;}
.right-content, .data-table{border-radius:5px;}
.custom-btn{padding:8px 24px;border-radius:5px;}
.contributionWarp .custom-btn{padding:8px 24px;}
.vk-performanceJournal .value-list{margin-top: 24px;}
.leadgenHeader, .leadgenHeader .number{font-family: 'hcltech_roobertregular' !important;}
.vk-performanceJournal .whiteCard p{font-size:14px;}
.vk-performanceJournal .white-bg h3{color:#0F5FDC;font-size:18px;font-family: 'hcltech_roobertbold';}
.vk-performanceJournal .value-text{font-size:14px;}
.vk-performanceJournal .value-num{font-size:14px;font-family: 'hcltech_roobertbold';flex-basis: 30%;text-align: right;}
.vk-light-gray-bg{background-color:#FCFCFC;border:1px solid #EFF0F7;}
.vk-dark-gray-bg{background-color: #F7F7FC;border-color:#D9DBE9;}
.vk-performanceJournal .highcharts-title{font-family: 'hcltech_roobertregular';}
.vk-performanceJournal .credithours{font-family: 'hcltech_roobertsemibold';}
.vk-performanceJournal .chart-legend-item{margin-bottom:24px;}
.vk-performanceJournal .chart-legend{height: inherit;}
.vk-performanceJournal .chart-legend-item:last-child{margin-bottom:0;}
#chart-box{position: relative;}
#chart-box::after{content:'';position: absolute;bottom:36px;height:1px;background-color: #000;width:100%;}
.vk-performanceJournal .cont-header h1{margin:0;}
.contributionWarp{margin-top:26px;}
.other-sec .many-dsk{flex-basis:50%;}
.quality-data{max-height:204px;min-height:204px;}
.quality-data.leadGenData{max-height:172px;min-height:172px;}
.font-bold, .font-bold .number{font-family: 'hcltech_roobertbold' !important;}
.data-table thead th {background-color: #EFF0F7}
.table>thead>tr>th, .data-table{border-color:#C8D2DD;}
.quality-data .table>tbody>tr>td{border-bottom:1px solid #C8D2DD;}
.quality-data .table>tbody>tr:nth-child(odd) {background-color: #FAFBFC}
.quality-data .table-hover>tbody>tr:hover {background-color: #EFF0F7 !important}
.drop-title{color: #14142B;font-size: 28px;font-family: 'hcltech_roobertmedium';}
/*.modal-header{padding:32px;}
.modal-body {padding: 15px 32px 32px}*/
.Upload-warp .brderSelect label{font-family: 'hcltech_roobertregular';}
#uplodedModal .Upload-warp .dz-message span{font-family: 'hcltech_roobertmedium';}
.Upload-warp .dz-message span p a{text-decoration: underline;}
.Upload-warp .glb-btn > button.close-btn {border: solid 1px #5F1EBE;color: #5F1EBE;}
.Upload-warp .glb-btn > button.close-btn:hover {background-color: #5F1EBE;color: #fff;}
.leadGenData td .hdr-view:hover{color: #4C189E}
.trainingModal .drop-title{margin-top:0;}
#skilData .quality-data, #trainingData .quality-data{overflow: hidden;overflow-y: auto;width: 100%;max-height: calc(100vh - 183px);min-height: inherit}

.lti-assessment-table > tbody > tr > td:nth-child(8) {
    font-weight: bold
}

.lti-assessment-table .overall-remarks .pdTable tr td:first-child {
    width: 14%
}

.lti-assessment-table .parameter {
    width: 60% !important;
    text-align: left !important
}

.total-payout {
    padding: 9px 19px;
    text-align: right;
    font-size: 16px;
    color: #fff;
    background-color: #3385D6;
    border-radius: 5px
}

    .total-payout > span {
        font-size: 24px;
        font-weight: bold
    }

.disclaimer {
    margin-top: 15px
}

    .disclaimer > strong {
        font-weight: bold;
        margin-top: 15px;
        color: #000
    }

.stars {
    color: #DD6A6A
}

.brderTop {
    border-top: 1px solid rgba(204, 204, 204, 0.4)
}

.credit-amount {
    padding-top: 8px;
    margin-top: 8px
}

    .credit-amount strong {
        color: #000;
        font-size: 14px;
    }

    .credit-amount .caret {
        margin-left: 0;
        margin-right: 2px;
        vertical-align: middle;
        border-left: 7px dashed #2B99F0;
        border-top: 4px solid transparent;
        border-bottom: 4px solid transparent
    }

.details-list.breadcrumb-list li:first-child a:hover {
    border: 0
}

.card-box > .goals-per ul li.notAllowed div.dash-icons:after {
    content: "\e902"
}

.card-box > .goals-per ul li.terminated div.dash-icons:after {
    content: "\e91b"
}

.completedfyi {
    font-size: 14px;
    color: #000;
    margin-top: -30px;
    display: flex;
    justify-content: end;
    align-items: center;
}

.dotslti {
    width: 8px;
    height: 8px;
    background: #0A875D;
    border-radius: 50%;
    display: inline-flex;
    vertical-align: middle;
    margin-right: 8px;
}

.childTable.hiddenRow {
    border-top: 0.5px solid rgba(0, 0, 0, 0.17);
}

.childTable > td {
    padding: 0 !important;
}

.childTable .data-table {
    margin: 0;
}

    .childTable .data-table > thead > tr, .childTable .data-table > tbody > tr {
        background-color: #D7ECFD !important;
        border-radius: 0;
    }

    .childTable .data-table > thead > tr {
        margin: 0;
    }

        .childTable .data-table > thead > tr > th {
            font-size: 16px;
        }

    .childTable .data-table > tbody > tr > td {
        padding: 8px;
        font-size: 14px;
    }

.childTable .calTable > tbody > tr {
    border-top: 0.5px solid rgba(0, 0, 0, 0.17)
}

    .childTable .calTable > tbody > tr:hover {
        box-shadow: none;
    }

.calTable > tbody > tr.payoutSummary, .calTable > tbody > tr.payoutSummary:hover {
    background-color: #2BA096
}

    .calTable > tbody > tr.payoutSummary + .hiddenRow {
        background-color: #2BA096 !important
    }

.lti-table tr.payoutSummary + .hiddenRow .triArrow:after {
    border-bottom-color: #2BA096
}

.calTable > tbody > tr.payoutSummary td {
    color: #fff
}

.calTable > tbody > tr.payoutSummary .infoIcn {
    color: #fff
}

.lti-assessment-table .triArrow {
    right: 66px
}

.lti-table .pms-close:before {
    content: "\e904";
    position: relative;
    z-index: 2;
    color: #222;
    font-size: 16px;
}

.lti-table tbody tr.tractive:nth-child(odd):hover {
    background-color: #3385D6;
}

.lti-table .cardBox {
    background-color: #F7FBFF;
}

.payoutSummeryDiv .pdTable {
    background: #F7FBFF;
    border-radius: 4px;
    table-layout: fixed;
}

.lti-table tbody tr.tractive.payoutSummary:nth-child(odd):hover {
    background-color: #2BA096
}

.payoutSummeryDiv .pdTable thead tr th {
    color: #777
}

.payoutSummeryDiv .pdTable tbody tr:last-child {
    border-top-color: #2BA096
}

.payoutSummeryDiv .pdTable thead tr th:nth-child(2), .payoutSummeryDiv .pdTable tbody tr td:nth-child(2) {
    text-align: center;
}

.payoutSummeryDiv .pdTable thead tr th:nth-child(3), .payoutSummeryDiv .pdTable tbody tr td:nth-child(3) {
    text-align: right;
}

.payoutSummeryDiv .pdTable thead tr th:nth-child(4), .payoutSummeryDiv .pdTable tbody tr td:nth-child(4) {
    text-align: center;
}

.mt24 {
    margin-top: 24px !important;
}

.lti-table > tbody > tr > td:first-child, .lti-table > thead > tr > th:first-child {
    text-align: left;
}

.payoutSummeryDiv .descTable thead tr {
    border-bottom: 1px solid #e0e0e0
}

.payoutSummeryDiv table tbody tr:nth-child(even):hover, .payoutSummeryDiv table tbody tr:nth-child(odd):hover {
    background-color: #dff6f3
}

.payoutSummeryDiv table thead tr:hover {
    background-color: #dff6f3
}

.nonPsus .data-table > tbody > tr > td:nth-child(3), .nonPsus .data-table > thead > tr > th:nth-child(3) {
    width: 25%;
    text-align: right
}

.nonPsus .data-table > tbody > tr > td:nth-child(4), .nonPsus .data-table > thead > tr > th:nth-child(4) {
    width: 25%;
    text-align: center
}
/* .data-table > tbody > tr > td:nth-child(5), .data-table > thead > tr > th:nth-child(5){width: 20%;text-align: center} */

.data-table tbody tr {
    cursor: pointer;
}

.lti-table tbody tr {
    cursor: inherit;
}

.data-table .dotslti {
    position: absolute;
    left: 22px;
    top: 3px;
}

.lti-table .pms-close:after {
    content: "";
    border: 0;
    background: #fff;
    border-radius: 4px 4px 0 0;
    width: 40px;
    height: 45px;
    top: -8px;
    position: absolute;
    left: -13px;
    z-index: 1
}

.lti-table.calTable .infoIcn {
    margin: 0;
}

.childTable .calTable > tbody > tr {
    margin-top: 0;
    border-top: 0;
}

.childTable .data-table > tbody > tr > td {
    padding: 8px 20px;
    font-size: 14px;
    text-align: left;
    color: #777;
    position: relative;
}

    .childTable .data-table > tbody > tr > td::after {
        content: '';
        position: absolute;
        top: 13px;
        right: 0;
        width: 1px;
        height: 70%;
        background-color: #777;
    }

    .childTable .data-table > tbody > tr > td:last-child::after {
        display: none;
    }

    .childTable .data-table > tbody > tr > td span {
        color: #000;
    }

    .childTable .data-table > tbody > tr > td p:last-child {
        margin-bottom: 0;
    }

    .childTable .data-table > tbody > tr > td a {
        color: #000;
        vertical-align: middle;
        margin-left: 5px
    }



/* 7-Jun-23 */
.lti-table .payoutSummeryDiv .descTable tr td, .lti-table .payoutSummeryDiv .descTable tr th {
    width: 20%;
    float: left;
}

    .lti-table .payoutSummeryDiv .descTable tr td:first-child, .lti-table .payoutSummeryDiv .descTable tr th:first-child {
        width: 25%;
    }

    .lti-table .payoutSummeryDiv .descTable tr td:nth-child(2), .lti-table .payoutSummeryDiv .descTable tr th:nth-child(2) {
        width: 15%;
    }


/* 25-sep-2023 new css addition */
body {
    margin-bottom: 0 !important;
}

main {
    min-height: calc(100vh - 84px) !important;
    padding-bottom: 24px;
}
/* table.table.calTable.data-table td .dotslti{
    left: 40px;
    top: 40px;
} */
td span.pos-rel span.dotslti {
    position: absolute;
    left: -12px;
    top: 6px;
}

.pos-rel {
    position: relative;
}

.childTable .data-table > tbody > tr > td::after {
    display: none;
}

.childTable .data-table > thead > tr > th:first-child {
    width: 15% !important;
    text-align: center !important;
    padding-left: 28px;
}

.childTable .data-table > tbody > tr > td:first-child {
    padding-left: 28px;
}

.childTable .data-table > thead > tr > th:nth-child(2),
.childTable .data-table > tbody > tr > td:nth-child(2) {
    width: 26% !important;
}

    .childTable .data-table > tbody > tr > td:nth-child(2) p {
        text-align: center !important;
    }

.childTable .data-table > thead > tr > th:nth-child(3) {
    width: 20% !important;
    text-align: center !important;
}

.childTable .data-table > tbody > tr > td:nth-child(3) p {
    text-align: center !important;
}

.childTable .data-table > thead > tr > th:nth-child(4) {
    width: 15% !important;
    text-align: center !important;
}

.childTable .data-table > thead > tr > th:nth-child(5) {
    width: 15% !important;
    text-align: center !important;
}

.childTable .data-table > thead > tr > th:nth-child(6),
.childTable .data-table > tbody > tr > td:nth-child(6) {
    width: 9% !important;
    text-align: center !important;
}

.lti-table .pms-close:before {
    color: #fff;
}

.lti-table .pms-close:after {
    background: transparent;
    height: 42px;
}

.arrow-up {
    width: 0;
    height: 0;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid white;
    position: absolute;
    right: 26px;
    top: -7px;
}

.glb-margin0.terms-hiddentbl .arrow-up {
    right: 44px
}

.ds-hd-right > li.open .btn {
    background-color: rgba(255, 255, 255, 0.15) !important;
}

.ds-hd-right button.dropdown-toggle {
    color: #fff !important;
}

table.table.calTable.data-table tbody td a.pms-arrow.arrowSlide {
    left: -22px;
}

.w-actioncsmt {
    width: 9% !important;
    text-align: center;
}

.data-table tbody td.w-cashelegiblecsmt,
.data-table th.w-cashelegiblecsmt {
    width: 26% !important;
}

.data-table > thead > tr > th,
.data-table > tbody > tr > td {
    font-size: 18px;
    text-align: center !important;
}

.w-actioncsmt .pms-view.view-icon {
    font-size: 20px;
}

.childTable .data-table > tbody > tr > td,
.childTable .data-table > thead > tr > th {
    font-size: 16px;
    text-align: center !important;
}

.childTable .data-table > tbody > tr > td {
    font-size: 16px;
}

    .childTable .data-table > tbody > tr > td p {
        text-align: center;
    }

table.descTable.pdTable td {
    text-align: left !important;
}
/* .data-table > tbody > tr > td:nth-child(2), .data-table > thead > tr > th:nth-child(2) {
    width: 26%;
    text-align: right;
}
.data-table > tbody > tr > td:last-child, .data-table > thead > tr > th:last-child {
    width: 9%;
    text-align: center;
} */

table.table.calTable.data-table.lti-table.lti-assessment-table tr {
    margin-bottom: 0.5px;
}

table.table.calTable.data-table.lti-table.lti-assessment-table > tbody > tr, table.table.calTable.data-table.lti-table.lti-assessment-table > tfoot > tr {
    margin-top: 0.5px !important;
}

.lti-table .descTable tr th, .lti-table .descTable tr td {
    font-size: 16px;
}

@media (max-width:1366px) {
    /* .psu .data-table > tbody > tr > td:first-child, .psu .data-table > thead > tr > th:first-child {width: 20%;}
    .psu .data-table > tbody > tr > td:nth-child(2), .psu .data-table > thead > tr > th:nth-child(2){width: 20%;}
    .psu .data-table > tbody > tr > td:last-child, .psu .data-table > thead > tr > th:last-child{width:10%;} */
    .parameter {
        font-size: 14px !important;
    }

    table.table.calTable.data-table tbody td a.pms-arrow.arrowSlide {
        left: -10px;
    }

    .psu .data-table > tbody > tr.childTable > td {
        width: 100% !important;
    }

    .arrow-up {
        right: 13px !important;
    }

    .glb-margin0.terms-hiddentbl .arrow-up {
        right: 25px !important;
    }
    /* .childTable .data-table > tbody > tr > td{width:33% !important;} */
}
/* ends css 25-sep-2023 */