body.f-body {
    padding: 24px;
    background-color: #f5f5f5;
}

.f-fieldlabel-text {
    color: #000;
}

.f-widget-content {
    border-color: #bbb;
}

.marginr {
    margin-right: 5px;
}

.clear {
    clear: both;
}

ul.result, ol.result {
    margin: 10px 0;
    padding: 0;
    border-top: solid 1px #ddd;
}

    ul.result li, ol.result li {
        list-style-type: none;
        margin: 0;
        padding: 5px;
        border-bottom: solid 1px #ddd;
    }

table.result {
    margin: 10px 0;
    width: 500px;
    border-collapse: collapse;
}

    table.result th {
        font-weight: bold;
    }

    table.result td, table.result th {
        border-bottom: solid 1px #ddd;
        padding: 5px;
        text-align: left;
    }


.highlight {
    font-weight: bold;
    color: red;
}


.text-monospace {
    font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

.text-justify {
    text-align: justify !important;
}

.text-nowrap {
    white-space: nowrap !important;
}

.text-truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.text-left, .text-align-left {
    text-align: left !important;
}

.text-right, .text-align-right {
    text-align: right !important;
}

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

@media (min-width: 576px) {
    .text-sm-left {
        text-align: left !important;
    }

    .text-sm-right {
        text-align: right !important;
    }

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

@media (min-width: 768px) {
    .text-md-left {
        text-align: left !important;
    }

    .text-md-right {
        text-align: right !important;
    }

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

@media (min-width: 992px) {
    .text-lg-left {
        text-align: left !important;
    }

    .text-lg-right {
        text-align: right !important;
    }

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

@media (min-width: 1200px) {
    .text-xl-left {
        text-align: left !important;
    }

    .text-xl-right {
        text-align: right !important;
    }

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

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

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

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

.font-weight-light {
    font-weight: 300 !important;
}

.font-weight-normal {
    font-weight: 400 !important;
}

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

.font-italic {
    font-style: italic !important;
}

.text-white {
    color: #fff !important;
}

.text-primary {
    color: #007bff !important;
}

a.text-primary:hover, a.text-primary:focus {
    color: #0062cc !important;
}

.text-secondary {
    color: #6c757d !important;
}

a.text-secondary:hover, a.text-secondary:focus {
    color: #545b62 !important;
}

.text-success {
    color: #28a745 !important;
}

a.text-success:hover, a.text-success:focus {
    color: #1e7e34 !important;
}

.text-info {
    color: #17a2b8 !important;
}

a.text-info:hover, a.text-info:focus {
    color: #117a8b !important;
}

.text-warning {
    color: #ffc107 !important;
}

a.text-warning:hover, a.text-warning:focus {
    color: #d39e00 !important;
}

.text-danger {
    color: #dc3545 !important;
}

a.text-danger:hover, a.text-danger:focus {
    color: #bd2130 !important;
}

.text-light {
    color: #f8f9fa !important;
}

a.text-light:hover, a.text-light:focus {
    color: #dae0e5 !important;
}

.text-dark {
    color: #343a40 !important;
}

a.text-dark:hover, a.text-dark:focus {
    color: #1d2124 !important;
}

.text-body {
    color: #212529 !important;
}

.text-muted {
    color: #6c757d !important;
}

.text-black-50 {
    color: rgba(0, 0, 0, 0.5) !important;
}

.text-white-50 {
    color: rgba(255, 255, 255, 0.5) !important;
}

.text-hide {
    font: 0/0 a;
    color: transparent;
    text-shadow: none;
    background-color: transparent;
    border: 0;
}

a.text-color-green,
.text-color-green,
.text-color-green .f-icon {
    color: green;
}

a.text-color-red,
.text-color-red,
.text-color-red .f-icon {
    color: red;
}

a.text-color-yellow,
.text-color-yellow,
.text-color-yellow .f-icon {
    color: yellow;
}

a.text-color-blue,
.text-color-blue,
.text-color-blue .f-icon {
    color: blue;
}


.gridRender-readonlyInput {
    width: 98%;
    border-color: #ccc;
    background-color: #fff;
    color: #444;
    padding: 5px 6px;
}

.btn-action-split {
    margin: 0 5px;
}
a.btn-action {
    display: inline-block;
    padding: 2px 8px;
    text-decoration: none;
    color: #fff;
    background-color: #1890ff;
    border-radius: 4px;
}
.f-state-hover a.btn-action,
.f-state-active a.btn-action {
    color: #fff;
}
a.btn-action:hover {
    background-color: RGBA(24, 114, 255, .7);
}

a.btn-action-del {
    display: inline-block;
    padding: 2px 8px;
    text-decoration: none;
    color: #fff;
    background-color: #c50909;
    border-radius: 4px;
}
.f-state-hover a.btn-action-del,
.f-state-active a.btn-action-del {
    color: #fff;
}
a.btn-action-del:hover {
    background-color: RGBA(197, 9, 9, .7);
}


i.data-input-suffix {
    position: absolute;
    right: 8px;
    top: 6px;
    font-style: normal;
}

.f-field-dropdownlist-pop > li.button {
    background-color: #ffffff;
    border-color: #aaa;
    color: #2196F3;
    text-align: center;
    border-top: 1px solid #aaa;
}

.imeidiv {
    width: 98%;
    word-break: break-all;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: #888;
}

.f-grid-cell-editor .f-field-body {
    border-radius: 3px;
    margin: 0 auto;
}

.qrcodeWindow, .barcodeWindow {
    cursor: pointer;
    color: #01AAED;
}

.data-input-label-tip {
    font-style: normal;
    color: blue !important;
    font-weight: bold;
}

.data-dropdownlist-tree li.f-state-disabled,
.data-dropdownlist-tree li.f-state-disabled .f-icon {
    cursor: pointer !important;
}

    .data-dropdownlist-tree li.f-state-disabled i.f-smtree-icon.expander.f-icon:before {
        content: ""
    }

.f-grid-colheader-text {
    font-weight: bold;
    /*color: #006ab6;*/
}

.f-grid-colheader.f-state-default {
    background-image: linear-gradient(#ffffff, #eeeeee);
    border-color: #e3e3e3;
}

.f-mask {
    opacity: 1;
    background-color: rgba(0, 0, 0, .4)
}

.grid-cell-errortip {
    background-image: url(../img/errortip.gif);
    background-repeat: repeat-x;
    background-position: bottom;
}

.f-grid-cell-editable.f-grid-cell-MonthFinishAmount,
.f-grid-cell-editable.f-grid-cell-YearFinishAmount,
.f-grid-cell-editable.f-grid-cell-NextMonthTargetAmount,
.f-grid-cell-editable.f-grid-cell-LastYearOnYearRate {
    position: relative;
    padding-left: 20px;
}

    .f-grid-cell-editable.f-grid-cell-MonthFinishAmount:after,
    .f-grid-cell-editable.f-grid-cell-YearFinishAmount:after,
    .f-grid-cell-editable.f-grid-cell-NextMonthTargetAmount:after,
    .f-grid-cell-editable.f-grid-cell-LastYearOnYearRate:after {
        position: absolute;
        left: 6px;
        top: 6px;
        content: "";
        background: url(/res/icon/application_edit.png) no-repeat center;
        height: 20px;
        width: 20px;
        opacity: .5;
    }

.f-btn.f-state-default {
    background-color: #1890ff;
    border-color: #1890ff;
    color: #fff;
}

    .f-btn.f-state-default .f-btn-icon {
        color: #fff;
    }

    .f-btn.f-state-default.f-state-hover {
        background-color: RGBA(24, 114, 255, .8);
        border-color: RGBA(24, 114, 255, .8);
    }

#imageWindow .f-panel-bodyct .f-widget-content {
    text-align: center;
}

.text-show {
    height: 125px;
    line-height: 25px;
    margin-left: 150px;
}

.image-show {
}

.image-show-item {
    overflow: hidden;
    position: relative;
    height: 180px;
    min-width: 150px;
    background-color: #eee;
    margin: 0 auto;
}
    .image-show-item img {
        height: 180px;
    }

    .image-show-item span {
        position: absolute;
        top: 0;
        right: 0;
        background-color: #f00;
        color: #fff;
        display: inline-block;
        text-align: center;
        vertical-align: middle;
        cursor: pointer;
        padding: 5px 10px;
    }

    .image-show-item b {
        position: absolute;
        top: 30px;
        left: 10px;
        width: 80px;
        height: 40px;
        color: #000;
        display: inline-block;
        font-size: 20px;
        line-height: 40px;
        text-align: center;
    }

#SupervisionImagesFileUpload .f-field-body-cell,
#CredentialImagesFileUpload .f-field-body-cell {
    vertical-align: top;
}

a.custom-tools,
a.custom-tools .f-tool-icon {
    color: #1890ff;
    font-weight: bold;
}



.f-btn.f-state-default.x-btn-primary {
    background-color: #1890ff;
    border-color: #1890ff;
}

.f-btn.f-state-default.x-btn-success {
    background-color: #4cd964;
    border-color: #4cd964;
}

.f-btn.f-state-default.x-btn-warning {
    background-color: #f0ad4e;
    border-color: #f0ad4e;
}

.f-btn.f-state-default.x-btn-error {
    background-color: #dd524d;
    border-color: #dd524d;
}
.x-btn-info .f-btn.f-state-default,
.f-btn.f-state-default.x-btn-info {
    background-color: #ffffff;
    border-color: #dddddd;
    color: #333333;
}
    .x-btn-info .f-btn.f-state-default .f-btn-icon,
    .f-btn.f-state-default.x-btn-info .f-btn-icon {
        color: #333333;
    }

.f-btn.f-state-default.x-btn-primary-plain {
    color: #409eff;
    background: #ecf5ff;
    border-color: #b3d8ff;
}

    .f-btn.f-state-default.x-btn-primary-plain .f-btn-icon {
        color: #409eff;
    }

.f-btn.f-state-default.x-btn-success-plain {
    color: #67c23a;
    background: #f0f9eb;
    border-color: #c2e7b0;
}

    .f-btn.f-state-default.x-btn-success-plain .f-btn-icon {
        color: #67c23a;
    }

.f-btn.f-state-default.x-btn-warning-plain {
    color: #e6a23c;
    background: #fdf6ec;
    border-color: #f5dab1;
}

    .f-btn.f-state-default.x-btn-warning-plain .f-btn-icon {
        color: #e6a23c;
    }

.f-btn.f-state-default.x-btn-error-plain {
    color: #f56c6c;
    background: #fef0f0;
    border-color: #fbc4c4;
}

    .f-btn.f-state-default.x-btn-error-plain .f-btn-icon {
        color: #f56c6c;
    }

.ui-autocomplete {
    background-color: #f2f7fa;
    min-width: 800px;
    max-height: 400px;
    overflow-y: auto;
    overflow-x: hidden;
}

@media screen and (max-height: 768px) {
    .ui-autocomplete {
        max-height: 300px;
    }
}

.ui-autocomplete li {
    border-bottom: 1px solid #cccccc;
}

.ui-autocomplete-table {
    width: 100%;
}

.autoGoodsItem {
    border-bottom: 1px solid #ddd;
    padding-bottom: 5px;
}

.x-cell-edit {
    color: #333333 !important;
    font-size: 20px;
    font-weight: bold;
}

.x-cell-edit-required {
    color: #dc3545 !important;
    font-size: 20px;
    font-weight: bold;
}

.x-header-title {
    font-weight: bold;
    margin-left: 5px;
}

.expanderTable {
    border-width: 1px;
    border-style: solid;
    border-collapse: separate;
    border-spacing: 0;
    border-bottom-width: 0;
    border-right-width: 0;
    width: 100%;
    margin-bottom: 10px;
}

    .expanderTable th,
    .expanderTable td {
        padding: 5px;
        text-align: left;
        border-bottom-width: 1px;
        border-bottom-style: solid;
        border-right-width: 1px;
        border-right-style: solid;
    }

/* 快过期 30 天，标记颜色 */
.warning1,
.f-grid-row.warning1,
.f-grid-row.warning1 .f-icon {
    color: #e8b006;
    font-weight: bold;
}
/* 已过期，标记颜色 */
.warning2,
.f-grid-row.warning2,
.f-grid-row.warning2 .f-icon {
    color: #FF000C;
    font-weight: bold;
}

.GoodsNameXColor input.f-widget-content,
.GoodsNameXColor input.f-state-focus {
    border-color: Fuchsia;
    color: Blue;
}

.ime-mode-disabled {
    ime-mode: disabled;
}

@keyframes fpasswordshowmove {
    0% {
        opacity: 0;
    }

    25% {
        opacity: 0;
    }

    75% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.fx-password-show {
    position: absolute;
    top: 0;
    border: none;
    pointer-events: none;
}

.fx-password-show-text {
    background: #fff;
    font-size: 14px;
    display: inline-block;
}

.fx-password-show:after {
    content: "";
    display: inline-block;
    position: relative;
    border-right: solid 1px #666;
    top: 4px;
    left: 0px;
    opacity: 0;
}

.fx-password-show-text,
.fx-password-show:after {
    height: 20px;
    line-height: 20px;
}

.fx-password-input:focus + .fx-password-show:after {
    animation: fpasswordshowmove 1s infinite;
}

.fx-password-input:focus + .fx-password-show div {
    background: #1890ff;
    color: #fff;
}

.f-smallmode .fx-password-show {
    height: 28px;
    padding-top: 0;
    padding-bottom: 0;
}

.f-smallmode .fx-password-show-text {
    height: 20px;
    line-height: 20px;
    margin-top: 4px;
}

.f-smallmode .fx-password-show:after {
    height: 20px;
    line-height: 20px;
}