.x-form-item-body {
    height: initial;
    border-radius: 5px;
    /* color: green !important; */
}

.red-text {
    color: red;
    font-size: large;
}

.blue-text {
    color: blue;
    font-size: large;
}

.x-grid3-cell-inner {
    white-space: normal;
}

.row-imagecommand:hover {
    background: rgb(192, 192, 192);
}

.pdfIcon {
    background-image: url("/ta/resources/images/timecard/pdf.png");
    background-repeat: no-repeat;
    background-position: 0px 0px;
}

.x-combo-list-group {
    font: bold 12px tahoma, arial, helvetica, sans-serif;
    padding: 2px;
    border: 1px solid rgb(255, 255, 255);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.emptyFilterIcon {
    background-image: url("/ta/resources/images/filter/empty_filter.png");
    background-position: 0px 0px;
    background-size: 14px 14px;
    background-repeat: no-repeat;
}

.filledFilterIcon {
    background-image: url("/ta/resources/images/filter/filled_filter.png");
    background-position: 0px 0px;
    background-size: 14px 14px;
    background-repeat: no-repeat;
}

.emptyStar {
    background-image: url("/ta/resources/images/star-curved-outline.png");
    background-position: 0px 0px;
    background-size: 14px 14px;
    background-repeat: no-repeat;
}

.filledStar {
    background-image: url("/ta/resources/images/star-curved-yellow.png");
    background-position: 0px 0px;
    background-size: 14px 14px;
    background-repeat: no-repeat;
}

.addFilterIcon {
    background-image: url("/ta/resources/images/filter/add_filter.png");
    background-position: 0px 0px;
    background-size: 16px 16px;
    background-repeat: no-repeat;
}

.removeFilterIcon {
    background-image: url("/ta/resources/images/filter/remove_filter.png");
    background-position: 0px 0px;
    background-size: 16px 16px;
    background-repeat: no-repeat;
}

.dcd-punch {
    background-image: url("/ta/resources/images/timecard/handpunch.png");
    background-repeat: no-repeat;
    background-position: right center;
}

.searchMatch {
    font-style: italic;
    font-weight: bold;
}

.voice-bio-failure {
    background: yellow !important;
}

.webclock-punch {
    background: url("/ta/resources/images/timecard/webclock.png") 3px -47px no-repeat transparent;
}

.ivr-punch {
    background: url("/ta/resources/images/timecard/ivr.png") 3px -47px no-repeat transparent;
}

.smart-device-punch {
    background: url("/ta/resources/images/timecard/smartDevice.png") 3px -47px no-repeat transparent;
}

.readonly-punch {
    background-image: url("/ta/resources/images/timecard/readonly.png");
    background-repeat: no-repeat;
    background-position: right center;
}

.controlled-punch {
    padding: 0.5px;
    color: black;
    border-width: 2px !important;
    border-style: solid !important;
    border-color: rgb(255, 0, 0) !important;
}

.hand-cursor {
    text-decoration: underline;
    color: blue;
    cursor: pointer !important;
}

.hand-cursor-no-underline {
    color: blue;
    cursor: pointer !important;
}

.ht-float-right {
    float: right;
}

div.item-wrap {
    float: left;
    border: 1px solid transparent;
    margin: 5px 25px;
    width: 100px;
    cursor: pointer;
    height: 120px;
    text-align: center;
}

.tip-target {
    cursor: pointer;
}

.line-through-target {
    text-decoration: line-through;
}

div.item-wrap img {
    margin: 5px 0px 0px 5px;
    width: 77px;
    height: 77px;
}

div.item-wrap h6 {
    font-size: 14px;
    color: rgb(58, 75, 91);
    font-family: tahoma, arial, san-serif;
}

.items-view .x-view-over {
    border: 1px solid silver;
}

.x-grid-table .x-grid-cell-calendarDate {
    background: rgb(255, 0, 0);
}

#items-ct {
    padding: 20px 30px 24px;
}

#items-ct h2 {
border-bottom: 2px solid rgb(58, 75, 91);
cursor: pointer;
}

#items-ct h2 div {
    background: url("/ta/resources/images/group-expand-sprite.gif") 3px -47px no-repeat transparent;
    padding: 4px 4px 4px 17px;
    font-family: tahoma, arial, san-serif;
    font-size: 12px;
    color: rgb(58, 75, 91);
}

#items-ct .collapsed h2 div {
background-position: 3px 3px;
}

#items-ct dl {
margin-left: 2px;
}

#items-ct .collapsed dl {
display: none;
}

.total-field {
    background: rgb(255, 255, 255);
    color: rgb(0, 0, 0);
    border: 1px solid silver;
    padding: 2px;
    margin-right: 5px;
    font-weight: bold !important;
}

.add32 {
    background-image: url("/ta/resources/images/airplane.png") !important;
}

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

.red-border {
    border: 1px solid red;
}

.grid-separator {
    width: 50%;
    color: rgb(102, 102, 102);
    padding: 0px 10px 5px 0px;
    line-height: 40px;
    font-weight: bold;
    border-bottom: 1px solid rgb(208, 208, 208);
    white-space: nowrap;
    font-size: 11px;
}

.grid-separator-no-line {
    width: 100%;
    color: rgb(102, 102, 102);
    padding: 0px 100% 5px 0px;
    line-height: 1px;
    font-weight: bold;
    border-bottom: 1px solid rgb(208, 208, 208);
    white-space: nowrap;
    font-size: 11px;
}

.form-header {
    width: 100%;
    /* color: rgb(102, 102, 102); */
    padding: 0px 100% 5px 0px;
    line-height: 25px;
    font-weight: bold;
    border-bottom: 1px solid rgb(208, 208, 208);
    white-space: nowrap;
    font-size: 11px;
}

.x-column-padding {
    padding: 10px 10px 20px;
}

.x-column-padding1 {
    padding: 10px;
}

.calendars-popup {
    z-index: 15000;
}

.standardFont {
    font-family: tahoma, arial, Verdana !important;
    font-size: 12px !important;
    color: rgb(79, 79, 79) !important;
}

body {
    font: 12px tahoma, arial, verdana;
}

.white-menu .x-menu {
    background: white !important;
}

.x-window-mc {
    background: rgb(244, 244, 244) !important;
}

.title-label {
    color: black;
}

.x-column-header-inner, .x-column-header-inner span {
    white-space: normal !important;
}

.x-column-header-text {
    display: block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.company-title-label {
    font-size: 40px;
    font-weight: bold;
    margin-right: 5px;
    top: 0px !important;
}

.x-hidden-node {
    display: none !important;
}

.x-theme-slate .title-label {
    color: white;
    font-weight: bold !important;
}

.topMenu {
    height: 55px;
}

.globalSearchContainer {
    text-align: center;
    border-radius: 5px;
    background: rgba(127, 17, 17, 0.067);
    padding: 5px;
    align-content: center;
}

.globalSearchTextField {
    border-radius: 5px;
}

.globalSearchBtn {
    margin-left: -2px;
    border-radius: 0px 8px 8px 0px;
}

.sideMenuPanel {
    width: 60px;
    height: 100% !important;
    background: rgb(88, 91, 112) !important;
}

.nav-tree-badge::after {
    position: absolute;
    height: 18px;
    width: 3.3em;
    display: inline-block;
    text-align: center;
    top: 50%;
    margin-top: -9px;
    right: 12px;
    color: rgb(255, 255, 255);
    font-weight: 600;
    font-size: 10px;
    line-height: 18px;
}

.nav-tree-badge-hot::after {
    content: "HOT";
    background: rgb(227, 73, 90);
}

.nav-tree-badge-new::after {
    content: "NEW";
    background: rgb(0, 148, 255);
}

.circular {
    border-radius: 50%;
}

.x-fa {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    font-stretch: normal;
    line-height: 1;
    font-family: FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}

.globalEmployeeMainPanel, .employeeDetailsTab {
    padding: 0px 5px 0px 0px;
    background: rgb(88, 91, 112) !important;
}

.globalEmployeeMainPanel_border, .globalEmployeeMainPanel_header, .employeeDetailsTabHeader {
    background: rgb(88, 91, 112) !important;
}

.leftMainPanel_header fa-navicon {
    padding: 0px 10px 0px 5px !important;
}

.globalEmployeeMainPanel_inner {
    background: rgb(204, 204, 204) !important;
}

.x-grid-group-hd {
    font-weight: bold;
    background: linear-gradient(45deg, lightsteelblue, aliceblue);
    border-top: 1px solid darkgray;
    /* border-radius: 3px; */
    border-bottom: 1px solid darkgray;
}

.x-grid-group-title {
    color: rgb(34, 34, 34);
    font-weight: bold;
}

div [class~="tree_wrap"] div[class~="x-grid-cell-inner"] {
    height: auto !important;
    white-space: normal !important;
    text-indent: -3.3em !important;
    padding-left: 3.3em !important;
    padding-right: 1em !important;
}

.globalMiniProfileImage {
    object-fit: cover;
    border-radius: 50% !important;
    height: 50px !important;
    width: 50px !important;
    background: lightblue !important;
}

.treelist-background {
    background: rgb(50, 64, 78);
}

#userInfoName b {
    font-size: 18px;
}

.globalUserProfileUiImage {
    object-fit: cover;
    border-radius: 50% !important;
    background: lightblue !important;
    cursor: pointer !important;
}

#globalEmployeeUserToolbar_imageProfile img {
    border-radius: 4px;
    object-fit: cover;
    background: lightblue;
    cursor: pointer !important;
    border: 1px solid silver !important;
}

.globalMiniProfile_button {
    padding: 3px 4px;
    border-radius: 0px 13px 13px 0px !important;
    left: 44px !important;
}

.treepan {
    border-right: 1px solid silver !important;
}

.treepan .x-grid-row {
    width: 100%;
}

.wordWrapDisplayField {
    word-break: break-word;
    overflow-wrap: break-word;
}

.globalCompanyFacilityLogo {
    background-size: contain;
}


.ContainermainHeader {
    top: 5px;
}

.pageTitleLabelCls {
    line-height: 28px;
    top: 0 !important;
    color: #444444;
    text-align: right;
}

.globalTopBar {
    background: linear-gradient(45deg, white, lavender) !important;
    border-bottom: 2px solid rgb(102, 102, 102) !important;
    padding-top: 3px !important;
}

.globalTopBar_ghostMode {
    background-image: url("\
                        data:image/svg+xml;utf8, \
                          <svg xmlns='http://www.w3.org/2000/svg' version='1.1' width='170px' height='50px'> \
                            <rect x='0' y='0' width='170' height='50'\
                              style='stroke:white; stroke-width: 3px; stroke-opacity: 0.3; stroke-dasharray: 10 5; stroke-linecap=round; fill: black;  fill-opacity: 0.7; '/> \
                            <text x='85' y='30' style='fill:lightBlue; text-anchor: middle' font-size='20'  transform='rotate(10,85,25)'>  GHOST MODE  </text> \
                          </svg>\
                        ") !important;
    border-bottom: 2px solid rgb(102, 102, 102) !important;
    padding-top: 3px !important;
    cursor: url("");
}

#globalCursor {
    position: absolute;
    border: 1px solid;
    border-radius: 5px;
    font-weight: bold;
    z-index: 9999;
    background-size: contain;
    background-repeat: no-repeat;
    background-size: contain;
}



.solid {
    border-radius: 0px;
    box-shadow: none;
    border-bottom: 1px solid rgb(193, 193, 193);
}

    .solid .x-infopanel-body {
        padding: 0px;
    }

.activitiesPanelIcon {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 52px;
    width: 41px;
    margin-left: -20px;
    margin-top: -26px;
}

.closeActivitiesPanelInfoContainer {
    position: absolute;
    top: 13%;
    right: 3px;
    margin-top: -13px;
    border-radius: 20px !important;
    background: darkslategray !important;
}

.x-infopanel-info .activitiesPanelIcon {
    background: url("/ta/Resources/images/activitiesPanel/info.png") 0px 0px no-repeat;
}

.x-infopanel-success .activitiesPanelIcon {
    background: url("/ta/Resources/images/activitiesPanel/success.png") 0px 0px no-repeat;
}

.x-infopanel-danger .activitiesPanelIcon {
    background: url("/ta/Resources/images/activitiesPanel/error.png") 0px 0px no-repeat;
}

.x-infopanel-warning .activitiesPanelIcon {
    background: url("/ta/Resources/images/activitiesPanel/warning.png") 0px 0px no-repeat;
}

.infoIcon {
    background: url("/ta/Resources/images/notificationMessages/information.png") 0px 0px no-repeat;
}

.successIcon {
    background: url("/ta/Resources/images/notificationMessages/information.png") 0px 0px no-repeat;
}

.errorIcon {
    background: url("/ta/Resources/images/notificationMessages/error.png") 0px 0px no-repeat;
}

.warningIcon {
    background: url("/ta/Resources/images/notificationMessages/warning.png") 0px 0px no-repeat;
}

.blackFont .x-btn-inner {
    color: black;
}

.title {
    margin-top: 5px;
    margin-bottom: -10px !important;
}

    .title .x-form-display-field {
        font-size: 16px;
    }

.x-infopanel-info .title .x-form-display-field {
    color: rgb(40, 80, 193);
}

.x-infopanel-success .title .x-form-display-field {
    color: rgb(74, 157, 60);
}

.x-infopanel-danger .title .x-form-display-field {
    color: rgb(135, 20, 20);
}

.x-infopanel-warning .title .x-form-display-field {
    color: rgb(158, 154, 61);
}

.activitiesPanelInfoDate {
    margin-top: 5px;
    float: left;
    font-size: small;
}

.activitiesPanelInfoContainer {
    width: 100%;
    padding: 0px 5px 5px 0px;
}

.messageNotificationItem {
    border-radius: 10px;
    margin: 5px 0px;
}

.x-btn {
    border-radius: 5px;
    /* border-color: silver !important; */
    /* background-color: aliceblue !important; */
}

.x-btn-danger-small {
    background-color: rgb(217, 83, 79);
}

.globalCompanyLogo {
    display: block;
    max-width: 230px;
    max-height: inherit;
    width: auto;
    height: auto;
}

.LeftMenuLayoutItemTitle {
    background: rgb(30, 42, 51) !important;
}

.globalEmployee_Inactive {
    color: blue !important;
}

.globalEmployee_Terminated {
    color: red !important;
}

.globalEmployee_StatusInactive {
    color: purple !important;
}

#planProviderDetailPanel {
    padding: 5px;
    background: cornflowerblue;
}

.classicButtonStyle {
    border-radius: 5px;
    background: none rgb(245, 245, 245) !important;
}

.x-toolbar-default {
    background: lavender;
    border-bottom: 1px solid silver !important;
    border-top: 1px solid silver !important;
}

.x-grid-item-selected {
    font-weight: bold;
}

#globalEmployeeGrid .x-grid-item-selected {
    font-weight: bold;
    background: linear-gradient(45deg, rgb(249, 249, 111), transparent);
}

.globalEmployeeSelectionLoaded {
    font-weight: bold;
    background: linear-gradient(45deg, rgb(249, 249, 111), transparent);
}

.globalEmployeeSelectionChange {
    font-weight: bold;
    background: linear-gradient(45deg, lightskyblue, transparent);
}

.globalEmployeeSelectionLoading {
    font-weight: bold;
    background: linear-gradient(45deg, rgb(119, 119, 119), transparent);
}

#dashboard_toolbar {
    height: 200px;
}

#globalEmployeeGrid {
    border-right: 1px solid silver;
}

.x-mask {
    background-color: rgba(150, 150, 150, 0.6);
}

.x-item-disabled * {
    border-radius: 3px;
    /*background-color: rgba(255, 255, 255, 0.6) !important; */
}

.seperator {
    margin: 2px 5px 0px;
}

.seperator span {
    color: rgb(170, 170, 170) !important;
}

.globalEmployeeUserInfo {
    background-color: lemonchiffon;
}

.formPanelGlobalEmployeeUserInfo {
    background-color: lemonchiffon;
    padding: 3px;
    border-radius: 5px;
}

.formPanelGlobalEmployeeUserInfo div {
}

.formPanelGlobalEmployeeUserInfo span {
}

.transparent-frame, .transparent-frame .x-panel-body-default-framed {
    background-color: transparent;
}

#userInfoContactContainer div {
    font-size: 12px;
}

#globalEmployeeGrid .x-grid-group-hd {
    padding: 5px;
}

.FormPanelUserImage {
    background-color: slategray !important;
}

#userImagePreview {
    width: auto;
    height: auto;
    padding: 5px;
}

.capitalizeFirstLetter {
    text-transform: capitalize;
}

#userImagePreview img {
    width: auto;
    height: auto;
    background-size: cover;
    object-fit: contain;
    max-height: 500px;
    max-width: 500px;
}

.x-callout {
    max-height: 1000px !important;
    max-width: 1000px !important;
    padding: 5px !important;
    /*z-index: 19000 !important; */
}

.expiredRow {
    color: red;
}

.futureEffectiveRow {
    color: darkviolet !important;
}

.effectiveRow, .activeRow {
    color: black !important;
}

.currentEffectiveRow {
    color: green !important;
}

/* Removes (those ugly) border from selected cell in grid */
.x-grid-item-focused .x-grid-cell-inner:before {
    display: none;
}

.displayFieldLabel_Bold {
    font-weight: bold;
}

/* Styles used by Ext.ux.form.ItemSelector */

.x-form-multiselect-body .x-boundlist .x-mask {
    background: none;
}

.x-form-itemselector-body .x-form-item {
    margin: 0;
}

.x-form-itemselector-top {
    background-image: url(/ta/Resources/images/itemselector/top.gif) !important;
}

.x-form-itemselector-up {
    background-image: url(/ta/Resources/images/itemselector/up.gif) !important;
}

.x-form-itemselector-add {
    background-image: url(/ta/Resources/images/itemselector/right.gif) !important;
}

.x-form-itemselector-remove {
    background-image: url(/ta/Resources/images/itemselector/left.gif) !important;
}

.x-form-itemselector-down {
    background-image: url(/ta/Resources/images/itemselector/down.gif) !important;
}

.x-form-itemselector-bottom {
    background-image: url(/ta/Resources/images/itemselector/bottom.gif) !important;
}

.x-progress-default .x-progress-bar-default {
    background-image: none;
    background: linear-gradient(0.25turn, greenyellow, green);
}

.x-progress-default .x-progress-text {
    color: black;
    outline: auto #aaa;
}

.untaggedDocument {
    color: darkgray;
}

.globalDocument {
    color: brown;
}

.swappedDocument {
    color: darkseagreen;
}


.readOnlyCls .x-form-item-label-default, .readOnlyCls .x-form-cb-label-default {
    color: #777 !important;
}

.readOnlyCls .x-form-text-default, .readOnlyCls .x-form-cb-default {
    color: #666 !important;
}