* {
    font-family: 'Microsoft YaHei';
    word-wrap: break-word;
    word-break: break-all;
}

@media (min-width: 1080px) {
    .body-detail {
        margin: 2px calc(50% - 540px) !important;
        margin: 2px -webkit-calc(50% - 540px) !important;
        margin: 2px -moz-calc(50% - 540px) !important;
    }
}

@media (min-width: 1366px) {
    .body-detail2 {
        margin: 2px calc(50% - 650px) !important;
        margin: 2px -webkit-calc(50% - 650px) !important;
        margin: 2px -moz-calc(50% - 650px) !important;
    }
}

@media (min-width: 1920px) {
    .body-detail3 {
        margin: 2px calc(50% - 960px) !important;
        margin: 2px -webkit-calc(50% - 960px) !important;
        margin: 2px -moz-calc(50% - 960px) !important;
    }
}

.icon-row {
    text-align: center;
}

    .icon-row img {
        max-height: 100%;
        max-width: 100%;
        margin: 0 auto;
    }

.flow-auditor-box {
    display: inline-block !important;
}

    .flow-auditor-box li {
        list-style: none;
        display: inline-block;
        text-align: left;
        width: 120px
    }

        .flow-auditor-box li div.bar {
            display: block;
            margin: 7px 0px 7px 0px;
            height: 8px;
        }

        .flow-auditor-box li div.pass {
            background: #4c8dcb;
            border-color: #4c8dcb;
        }

        .flow-auditor-box li div.current {
            background: #a49494;
            border-color: #a49494;
        }

        .flow-auditor-box li div.waiting {
            background: #a49494;
            border-color: #a49494;
        }

        .flow-auditor-box li div.valid {
            background: none;
        }

        .flow-auditor-box li div.canceled {
            background: none;
        }

        .flow-auditor-box li div.none {
            background: none;
        }

        .flow-auditor-box li div.bar span.circle {
            position: relative;
            top: -10px;
            left: -10px;
            display: block;
            width: 28px;
            height: 28px;
            border-style: solid;
            border-width: 1px;
            border-radius: 25px;
            text-align: center;
        }

        .flow-auditor-box li div.pass span.circle {
            background: #4c8dcb;
            border-color: #4c8dcb;
        }

        .flow-auditor-box li div.bar span.circle i {
            margin: 3px;
            color: #000000;
        }

        .flow-auditor-box li div.current span.circle {
            background: #4c8dcb;
            border-color: #4c8dcb;
        }

        .flow-auditor-box li div.waiting span.circle {
            background: #a49494;
            border-color: #a49494;
        }

        .flow-auditor-box li div.none span.circle {
            background: #a49494;
            border-color: #a49494;
        }

        .flow-auditor-box li div.valid span.circle {
            background: #4c8dcb;
            border-color: #4c8dcb;
        }

        .flow-auditor-box li div.canceled span.circle {
            background: #ff0000;
            border-color: #ff0000;
        }

        .flow-auditor-box li div.step {
            position: relative;
            left: -10px;
            margin-top: 12px;
            max-width: 105px;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }

.no-border .f-field-body-cell {
    border: none !important;
}

.flow-log-box .f-field-body-cell {
    border: 0px;
}

.flow-log-box .flow-log-line2 {
    display: box;
    display: -webkit-box;
    display: -moz-box;
    -box-orient: horizontal;
    -webkit-box-orient: horizontal;
    -moz-box-orient: horizontal;
}

    .flow-log-box .flow-log-line2 .icon {
        margin-top: 10px;
        max-width: 80px;
        max-height: 80px;
    }

    .flow-log-box .flow-log-line2 .flow-log-comment {
        -box-flex: 1;
        -webkit-box-flex: 1;
        -moz-box-flex: 1;
    }

        .flow-log-box .flow-log-line2 .flow-log-comment img {
            max-width: 500px;
            max-height: 400px;
        }

.flow-link .f-field-body-cell {
    border: 0px;
}

.margin10 {
    margin: 10px;
}

.margin10vertical {
    margin-top: 10px;
    margin-bottom: 10px;
}

.margin60-horizontal {
    margin-left: 60px;
}

.margin120Horizontal {
    margin-left: 120px;
    margin-bottom: 120px;
}

a {
    text-decoration: none;
    color: black;
}

.font-red {
    color: #ff0000;
}
.font-red * {
    color: #ff0000;
}

.link-more {
    float: right;
    cursor: pointer;
    opacity: 0.99;
}

.home-box {
    background: #ffffff;
    margin-bottom: 20px;
    box-shadow: 0 1px 1px rgba(0,0,0,0.1);
}

.hide {
    display: none;
}

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

.text-right {
    text-align: right;
}

.pull-bottom {
    text-align: right;
}

.content {
    min-height: 360px;
}

hr {
    margin: 0px 5px;
}

[data-link] {
    cursor: pointer;
}

.photo {
    height: 150px;
    line-height: 150px;
    overflow: hidden;
}

    .photo > div:nth-child(2n) {
        text-align: center;
    }

    .photo img {
        height: 150px;
        vertical-align: middle;
        cursor: pointer;
    }

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

.menu_icon {
    text-align: center;
}

    .menu_icon img {
        width: 16px;
        height: 16px;
    }

    .menu_icon i {
        width: 16px;
        height: 16px;
    }

div.f-grid-cell-inner a {
    text-decoration: underline;
}

.tree-node {
    cursor: default !important;
    opacity: unset !important;
}

    .tree-node * {
        cursor: pointer !important;
    }

    .tree-node.f-state-disabled * {
        cursor: default !important;
        color: #000000;
    }

    .tree-node.f-state-disabled .f-icon {
        cursor: default !important;
    }

    .tree-node i {
        cursor: default !important;
    }

    .tree-node .f-tree-cell-icon.f-tree-expander {
        cursor: default !important;
    }

    .tree-node .f-tree-cell-icon.f-tree-folder {
        cursor: default !important;
    }

.padding-right10 {
    padding-right: 20px;
}

div > span.tip-raduis {
    background: #ff0000;
    color: #ffffff;
    border-radius: 15px;
    font-size: 10px;
    width: 20px;
    text-align: center;
    vertical-align: bottom;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-left: 20px;
    padding: 0px;
    height: 20px;
}

div > span.dot-raduis {
    background: #ff0000;
    color: #ffffff;
    border-radius: 5px;
    width: 10px;
    height: 10px;
    text-align: center;
    vertical-align: bottom;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 0px;
    margin: 0px 0px 4px 1px;
}

div .f-tree-cell-inner > span.tip-raduis {
    position: absolute;
    right: 10px;
}

a > span.tip-raduis {
    background: #ff0000;
    color: #ffffff;
    border-radius: 15px;
    font-size: 10px;
    width: 20px;
    text-align: center;
    vertical-align: bottom;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-left: 20px;
    padding: 3px 0px 0px 0px;
    height: 20px;
    position: absolute;
    right: 2px;
    top: 2px;
}

#header table {
    width: 100%;
    border-spacing: 0;
    border-collapse: separate;
}

span.label-helper {
    display: inline-block;
    width: 18px;
}

.blockpanel {
    min-height: 30px;
}

.mycard {
    margin: 20px;
}

    .mycard .title {
        position: relative;
        font-size: 0.9em;
        opacity: 0.8;
        filter: alpha(opacity=80);
        margin-bottom: 10px;
    }

        .mycard .title .infoicon {
            position: absolute;
            right: 0;
            cursor: pointer;
        }

    .mycard .desc {
        height: 145px;
        font-size: 0.95em;
        line-height: 1.5em;
    }

    .mycard .number {
        font-size: 26px;
        line-height: 40px;
        height: 40px;
    }

    .mycard .number-subtext {
        font-size: 16px;
    }

    .mycard .chart {
        height: 60px;
        position: relative;
    }

        .mycard .chart .f-progressbar {
            position: absolute;
            top: 50%;
            height: 8px;
            margin-top: -4px;
            width: 100%;
        }

    .mycard .footer {
        border-top-width: 1px;
        border-top-style: solid;
        margin-top: 10px;
        padding-top: 10px;
        height: 35px;
        line-height: 24px;
    }

    .mycard .f-icon.f-iconfont-triangle-up {
        vertical-align: middle;
        color: red;
    }

    .mycard .f-icon.f-iconfont-triangle-down {
        vertical-align: middle;
        color: green;
    }

    .mycard.rank {
        background: url(../res/images/up.png) no-repeat;
        padding-left: 80px;
    }

.f-theme-mint_choc .mycard.rank,
.f-theme-dark_hive .mycard.rank,
.f-theme-dot_luv .mycard.rank,
.f-theme-eggplant .mycard.rank,
.f-theme-le_frog .mycard.rank,
.f-theme-overcast .mycard.rank,
.f-theme-swanky_purse .mycard.rank,
.f-theme-trontastic .mycard.rank,
.f-theme-ui_darkness .mycard.rank,
.f-theme-vader .mycard.rank,
.f-theme-excite_bike .mycard.rank,
.f-theme-black_tie .mycard.rank,
.f-theme-cupertino .mycard.rank,
.f-theme-humanity .mycard.rank,
.f-theme-pepper_grinder .mycard.rank,
.f-theme-south_street .mycard.rank,
.f-theme-sunny .mycard.rank,
.f-theme-ui_lightness .mycard.rank {
    background-image: none;
    padding: 0;
}

.mytabstrip > .f-tabstrip-header > .f-panel-title {
    margin-left: 20px;
}

    .mytabstrip > .f-tabstrip-header > .f-panel-title .f-tab-header {
        margin-right: 10px;
    }

        .mytabstrip > .f-tabstrip-header > .f-panel-title .f-tab-header.f-state-active {
            background-color: transparent;
            background-image: none;
        }

.mytabstrip .tabstrip-chart {
    height: 350px;
}

.mytable {
    width: 100%;
    border-collapse: collapse;
}

    .mytable th {
        font-weight: normal;
        border-bottom: solid 1px #ddd;
    }

    .mytable td,
    .mytable th {
        padding: 10px;
        text-align: left;
    }

.myform .f-panel-body .f-field {
    margin: 0;
}

.mychart-pie {
    min-height: 300px;
}

.mysitestats {
    padding: 0;
    margin: 0;
    list-style-type: none;
    font-size: 14px;
    margin-left: -10px;
}

    .mysitestats li {
        display: inline-block;
        padding: 10px;
        border-width: 1px;
        border-style: solid;
        margin: 0 10px 20px 10px;
        min-width: 85px;
    }

        .mysitestats li .title {
            font-size: 0.9em;
            opacity: 0.8;
            filter: alpha(opacity=80);
            margin-bottom: 10px;
        }

        .mysitestats li .content {
            font-size: 1.1em;
            font-weight: normal;
        }

.mynumber {
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    display: inline-block;
}

    .mynumber.round {
        border-radius: 20px;
    }

.has-qit label span.f-fieldlabel-text, [data-window] {
    cursor: pointer;
    text-decoration: underline;
}

    .has-qit label span.f-fieldlabel-text span.real-qit {
        display: none;
    }

div.tip-box {
    position: fixed;
    z-index: 999999;
    background: #ffffff;
    border: 1px solid rgba(0,0,0,0.1);
    border-radius: 5px;
    width: 420px;
    height: 300px;
    left: calc(50% - 210px);
    left: webkit-calc(50% - 210px);
    left: moz-calc(50% - 210px);
    top: 200px;
    padding: 0px;
    margin: 0px;
}

    div.tip-box div.title {
        text-align: center;
        background: #a49494;
        font-size: 18px;
        height: 30px;
        margin: -1px;
        border: 0px;
        border-radius: 5px;
    }

        div.tip-box div.title i {
            float: right;
            margin: 5px;
            color: #f89406;
        }

            div.tip-box div.title i :after {
                clear: both;
            }

    div.tip-box section.content {
        text-align: left;
        overflow: auto;
    }

div.op-row {
    display: inline;
    padding: 10px 0px;
    line-height: 28px;
}

    div.op-row:last-child {
        display: inline;
        padding: 10px 0px;
        border-bottom: none;
    }

div.op-col-title {
    margin: 0px;
    padding: 0px 40px 0px 0px;
    display: inline;
}

div.op-col-original {
    margin: 0px;
    padding: 0px 40px 0px 0px;
    display: inline-block;
}

    div.op-col-original > p {
        color: #67747e;
        margin: 0px;
        padding: 0px;
    }

div.op-col-now {
    margin: 0px;
    padding: 0px 40px 0px 40px;
    display: inline;
    width: 45%;
}


    div.op-col-now > p {
        color: #0094ff;
        margin: 0px;
        padding: 0px;
    }

div.op-col-new {
    margin: 0px;
    padding: 0px;
    display: inline-block;
}

    div.op-col-new > p {
        display: inline-block;
        color: #0094ff;
        margin: 0px;
        padding: 0px;
    }

div.op-col-missing {
    margin: 0px;
    padding: 0px;
    display: inline-block;
    width: 90%;
}

    div.op-col-missing > p {
        display: inline-block;
        color: #ff0000;
        margin: 0px;
        padding: 0px;
    }

div.op-col-missing {
    margin: 0px;
    padding: 0px;
    display: inline;
}

    div.op-col-missing > p {
        display: inline-block;
        color: #a49494;
        margin: 0px;
        padding: 0px;
    }

.f-grid-row.lime-green,
.f-grid-row.lime-green .f-icon,
.lime-green .f-grid-cell-inner a,
.f-grid-cell.lime-green {
    background-color: #32cd32;
    color: #fff;
}

.f-grid-row.royal-blue,
.f-grid-row.royal-blue .f-icon,
.royal-blue .f-grid-cell-inner a,
.f-grid-cell.royal-blue {
    background-color: #67747e;
    color: #fff;
}

.f-grid-row.blue,
.f-grid-row.blue .f-icon,
.blue .f-grid-cell-inner a,
.f-grid-cell.blue {
    background-color: #0094ff;
    color: #fff;
}

.f-grid-row.red,
.f-grid-row.red .f-icon,
.red .f-grid-cell-inner a,
.f-grid-cell.red {
    background-color: #FF0000;
    color: #fff;
}

.f-grid-row.bg-grey,
.f-grid-row.bg-grey .f-icon,
.bg-grey .f-grid-cell-inner a,
.f-grid-cell.bg-grey {
    background-color: #9d9d9d;
    color: #000;
}

.f-grid-row.orange,
.f-grid-row.orange .f-icon,
.orange .f-grid-cell-inner a,
.f-grid-cell.orange {
    background-color: #ffa500;
    color: #fff;
}

.f-grid-row.wheat1,
.f-grid-row.wheat1 .f-icon,
.wheat1 .f-grid-cell-inner a,
.f-grid-cell.wheat1 {
    background-color: #F4A460;
    color: #fff;
}


.f-grid-row.sky-blue,
.f-grid-row.sky-blue .f-icon,
.sky-blue .f-grid-cell-inner a,
.f-grid-cell.sky-blue {
    background-color: #0026ff;
    color: #fff;
}

.f-grid-row.blue2,
.f-grid-row.blue2 .f-icon,
.blue2 .f-grid-cell-inner a,
.f-grid-cell.blue2 {
    background-color: #619cff;
    color: #fff;
}

.f-grid-row.yellow,
.f-grid-row.yellow .f-icon,
.yellow .f-grid-cell-inner a,
.f-grid-cell.yellow {
    background-color: #ffff00;
    color: #fff;
}

.f-grid-cell[data-color=blue] {
    background-color: #0094ff;
    color: #fff;
}

.f-grid-cell[data-color=sky-blue] {
    background-color: #0026ff;
    color: #fff;
}

.f-grid-cell[data-color=red] {
    background-color: #b200ff;
    color: #fff;
}

.html-editor {
    z-index: 1 !important;
}

    .html-editor .edui-editor {
        z-index: 1 !important;
    }

    .html-editor img {
        max-width: 90%; /*图片自适应宽度*/
        margin: 0 auto;
        cursor: pointer;
    }

    .html-editor body {
        overflow-y: scroll !important;
    }

    .html-editor .view {
        word-break: break-all;
    }

    .html-editor .vote_area {
        display: block;
    }

    .html-editor .vote_iframe {
        background-color: transparent;
        border: 0 none;
        height: 100%;
    }

.f-grid-row-summary .f-grid-cell-inner {
    font-weight: bold;
    color: red;
}

[data-tag="flow-review"] a {
    color: #0094ff;
}

[data-tag="flow-valid"] {
    color: #32cd32;
}

[data-tag="flow-canceled"] {
    color: #b2b2b2;
}

div.link-template {
    cursor: pointer;
    text-decoration: underline;
}

    div.link-template a {
        color: #ff0000;
    }

.toolbar-info-red .f-field-body-cell {
    border: none;
    color: #ff0000;
    font-weight: 600;
    font-size: large;
}

/* 模板列 - 省略号 */
td > div.f-grid-cell-inner > div.f-grid-tpl > span[title] {
    overflow: hidden;
    text-overflow: ellipsis;
    width: auto;
    display: block;
}

img.cursive-canvas {
    max-width: 140px;
    max-height: 140px;
}

[data-hidden="true"] {
    display: none;
}