@charset "UTF-8";
html {
    line-height: 1.5
}

article,
aside,
footer,
header,
nav,
section {
    display: block
}

h1 {
    font-size: 2em;
    margin: .67em 0
}

figcaption,
figure,
main {
    display: block
}

figure {
    margin: 1em 40px
}

hr {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    height: 0;
    overflow: visible
}

pre {
    font-family: monospace, monospace;
    font-size: 1em
}

abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted
}

b,
strong {
    font-weight: inherit;
    font-weight: bolder
}

code,
kbd,
samp {
    font-family: monospace, monospace;
    font-size: 1em
}

dfn {
    font-style: italic
}

mark {
    background-color: #ff0;
    color: #000
}

small {
    font-size: 80%
}

img {
    border-style: none
}

svg:not(:root) {
    overflow: hidden
}

fieldset {
    padding: .35em .75em .625em
}

legend {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal
}

progress {
    display: inline-block;
    vertical-align: baseline
}

details,
menu {
    display: block
}

summary {
    display: list-item
}

canvas {
    display: inline-block
}

[hidden],
template {
    display: none
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

.icon {
    display: inline-block;
    width: 1.25em;
    height: 1.25em;
    vertical-align: middle;
    fill: inherit
}

.icon.spin {
    -webkit-animation: spin 1s infinite linear;
    animation: spin 1s infinite linear
}

html {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    height: 100%;
    font-size: 16px;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -ms-overflow-style: scrollbar;
    -webkit-tap-highlight-color: transparent
}

html *,
html :after,
html :before {
    -webkit-box-sizing: inherit;
    box-sizing: inherit
}

body {
    height: 100%;
    margin: 0;
    padding: 0;
    font-size: 14px;
    font-size: .875rem;
    font-family: Helvetica Neue, PingFang SC, Microsoft Yahei, 微软雅黑, STXihei, 华文细黑, sans-serif;
    line-height: 1.5;
    color: #4a4a4a;
    fill: #4a4a4a;
    background-color: #fff
}

.small,
small {
    font-size: 12px;
    font-size: .75rem;
    font-weight: 400
}

.x-small {
    font-size: 10px;
    font-size: .625rem;
    font-weight: 400
}

.big,
.large,
big {
    font-size: 16px;
    font-size: 1rem
}

.mark,
mark {
    padding: .2em;
    background-color: #ff0
}

a {
    color: #49e;
    fill: #49e;
    text-decoration: none;
    background-color: transparent;
    -webkit-text-decoration-skip: objects
}

a.warn {
    color: #f75;
    fill: #f75
}

a.disabled {
    color: #ccc;
    fill: #ccc;
    cursor: not-allowed
}

a:not([href]):not([tabindex]) {
    color: inherit;
    fill: inherit
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    margin-top: 1.5em;
    margin-bottom: 1em;
    line-height: 1.5;
    color: #4a4a4a
}

.h1:first-child,
.h2:first-child,
.h3:first-child,
.h4:first-child,
.h5:first-child,
.h6:first-child,
h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child,
h6:first-child {
    margin-top: 0
}

.h1,
h1 {
    font-size: 36px;
    font-size: 2.25rem
}

.h2,
h2 {
    font-size: 24px;
    font-size: 1.5rem
}

.h3,
h3 {
    font-size: 18px;
    font-size: 1.125rem
}

.h4,
h4 {
    font-size: 16px;
    font-size: 1rem
}

.h5,
h5 {
    font-size: 14px;
    font-size: .875rem
}

.h6,
h6 {
    font-size: 12px;
    font-size: .75rem
}

hr {
    margin-top: 1em;
    margin-bottom: 1em;
    border: 0;
    border-top: 1px solid #dfdfdf
}

ol,
p,
ul {
    margin: 0 0 1em
}

ol,
ul {
    padding: 0 0 0 2em
}

ol li,
ul li {
    line-height: 2
}

ol ol,
ol ul,
ul ol,
ul ul {
    margin-bottom: 0
}

blockquote {
    margin: 0 0 1em;
    padding: .5em 1em;
    color: #666;
    border-left: .25em solid #dfdfdf
}

blockquote :last-child {
    margin-bottom: 0
}

a:hover {
    color: #37c;
    fill: #37c
}

a.warn:hover {
    color: #ffa088;
    fill: #ffa088
}

a.disabled:hover {
    color: #ccc;
    fill: #ccc
}

a:not([href]):not([tabindex]):hover {
    color: inherit;
    fill: inherit
}

a:not([href]):not([tabindex]):focus {
    outline: 0
}

code,
kbd,
pre,
samp {
    font-family: Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace
}

code {
    padding: .2em .4em;
    font-size: 85%;
    background-color: #f6f6f6;
    border-radius: .25rem;
    word-wrap: break-word
}

a>code {
    padding: 0;
    color: inherit;
    background-color: inherit
}

kbd {
    padding: .2em .4em;
    font-size: 85%;
    background-color: #f6f6f6;
    border-radius: .25rem
}

kbd kbd {
    padding: 0;
    font-size: 100%
}

pre {
    display: block;
    margin-top: 0;
    margin-bottom: 1em;
    padding: 1.5em;
    font-size: 85%;
    background-color: #f6f6f6;
    overflow: auto;
    border-radius: .25rem
}

pre code {
    padding: 0;
    font-size: inherit;
    color: inherit;
    background-color: transparent;
    border-radius: 0;
    word-wrap: normal;
    white-space: inherit
}

.tao-popover {
    display: none;
    position: absolute;
    left: -9999px;
    top: -9999px;
    z-index: 300;
    opacity: 0;
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

.tao-popover[active] {
    opacity: 1;
    display: block
}

.tao-popover .tao-popover-content {
    padding: .75em 1em;
    background: #fff;
    border: 1px solid #dfdfdf;
    border-radius: .125rem;
    -webkit-box-shadow: 0 3px 15px rgba(0, 0, 0, .1);
    box-shadow: 0 3px 15px rgba(0, 0, 0, .1)
}

.tao-popover.tao-confirm-popover .tao-popover-content {
    font-size: 14px;
    font-size: .875rem;
    text-align: center;
    white-space: nowrap;
    padding: 16px 24px;
    padding: 1rem 1.5rem
}

.tao-popover .tao-popover-buttons {
    margin-top: 16px;
    margin-top: 1rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.tao-popover .tao-popover-buttons .button,
.tao-popover .tao-popover-buttons a {
    margin: 0 8px;
    margin: 0 .5rem
}

.tao-popover .tao-popover-arrow {
    display: none;
    position: absolute;
    width: 16px;
    width: 1rem;
    height: 16px;
    height: 1rem
}

.tao-popover .tao-popover-arrow .arrow {
    font-size: 0;
    height: 0;
    width: 0;
    border-style: solid;
    border-width: 8px;
    border-width: .5rem;
    position: absolute;
    left: 0;
    top: 0
}

.tao-popover[with-arrow] .tao-popover-arrow {
    display: block
}

.tao-popover[direction=right-bottom] .tao-popover-arrow,
.tao-popover[direction=right-middle] .tao-popover-arrow,
.tao-popover[direction=right-top] .tao-popover-arrow {
    left: -16px;
    left: -1rem;
    width: 8px;
    width: .5rem
}

.tao-popover[direction=right-bottom] .arrow-basic,
.tao-popover[direction=right-middle] .arrow-basic,
.tao-popover[direction=right-top] .arrow-basic {
    border-color: transparent #fff transparent transparent;
    left: 1px
}

.tao-popover[direction=right-bottom] .arrow-border,
.tao-popover[direction=right-middle] .arrow-border,
.tao-popover[direction=right-top] .arrow-border {
    border-color: transparent #ddd transparent transparent;
    left: 0
}

.tao-popover[direction=right-bottom] .arrow-shadow,
.tao-popover[direction=right-middle] .arrow-shadow,
.tao-popover[direction=right-top] .arrow-shadow {
    border-color: transparent rgba(0, 0, 0, .08) transparent transparent;
    left: -1px
}

.tao-popover[direction=left-bottom] .tao-popover-arrow,
.tao-popover[direction=left-middle] .tao-popover-arrow,
.tao-popover[direction=left-top] .tao-popover-arrow {
    right: -8px;
    right: -.5rem;
    width: 8px;
    width: .5rem
}

.tao-popover[direction=left-bottom] .arrow-basic,
.tao-popover[direction=left-middle] .arrow-basic,
.tao-popover[direction=left-top] .arrow-basic {
    border-color: transparent transparent transparent #fff;
    left: -1px
}

.tao-popover[direction=left-bottom] .arrow-border,
.tao-popover[direction=left-middle] .arrow-border,
.tao-popover[direction=left-top] .arrow-border {
    border-color: transparent transparent transparent #ddd;
    left: 0
}

.tao-popover[direction=left-bottom] .arrow-shadow,
.tao-popover[direction=left-middle] .arrow-shadow,
.tao-popover[direction=left-top] .arrow-shadow {
    border-color: transparent transparent transparent rgba(0, 0, 0, .08);
    left: 1px
}

.tao-popover[direction=left-top] .tao-popover-arrow,
.tao-popover[direction=right-top] .tao-popover-arrow {
    bottom: 16px;
    bottom: 1rem
}

.tao-popover[direction=left-bottom] .tao-popover-arrow,
.tao-popover[direction=right-bottom] .tao-popover-arrow {
    top: 16px;
    top: 1rem
}

.tao-popover[direction=left-middle] .tao-popover-arrow,
.tao-popover[direction=right-middle] .tao-popover-arrow {
    top: 50%;
    margin-top: -8px;
    margin-top: -.5rem
}

.tao-popover[direction=top-center] .tao-popover-arrow,
.tao-popover[direction=top-left] .tao-popover-arrow,
.tao-popover[direction=top-right] .tao-popover-arrow {
    bottom: -8px;
    bottom: -.5rem;
    height: 8px;
    height: .5rem
}

.tao-popover[direction=top-center] .arrow-basic,
.tao-popover[direction=top-left] .arrow-basic,
.tao-popover[direction=top-right] .arrow-basic {
    border-color: #fff transparent transparent;
    top: -1px
}

.tao-popover[direction=top-center] .arrow-border,
.tao-popover[direction=top-left] .arrow-border,
.tao-popover[direction=top-right] .arrow-border {
    border-color: #ddd transparent transparent;
    top: 0
}

.tao-popover[direction=top-center] .arrow-shadow,
.tao-popover[direction=top-left] .arrow-shadow,
.tao-popover[direction=top-right] .arrow-shadow {
    border-color: rgba(0, 0, 0, .08) transparent transparent;
    top: 1px
}

.tao-popover[direction=bottom-center] .tao-popover-arrow,
.tao-popover[direction=bottom-left] .tao-popover-arrow,
.tao-popover[direction=bottom-right] .tao-popover-arrow {
    top: -16px;
    top: -1rem;
    height: 8px;
    height: .5rem
}

.tao-popover[direction=bottom-center] .arrow-basic,
.tao-popover[direction=bottom-left] .arrow-basic,
.tao-popover[direction=bottom-right] .arrow-basic {
    border-color: transparent transparent #fff;
    top: 1px
}

.tao-popover[direction=bottom-center] .arrow-border,
.tao-popover[direction=bottom-left] .arrow-border,
.tao-popover[direction=bottom-right] .arrow-border {
    border-color: transparent transparent #ddd;
    top: 0
}

.tao-popover[direction=bottom-center] .arrow-shadow,
.tao-popover[direction=bottom-left] .arrow-shadow,
.tao-popover[direction=bottom-right] .arrow-shadow {
    border-color: transparent transparent rgba(0, 0, 0, .08);
    top: -1px
}

.tao-popover[direction=bottom-left] .tao-popover-arrow,
.tao-popover[direction=top-left] .tao-popover-arrow {
    right: 16px;
    right: 1rem
}

.tao-popover[direction=bottom-right] .tao-popover-arrow,
.tao-popover[direction=top-right] .tao-popover-arrow {
    left: 16px;
    left: 1rem
}

.tao-popover[direction=bottom-center] .tao-popover-arrow,
.tao-popover[direction=top-center] .tao-popover-arrow {
    left: 50%;
    margin-left: -8px;
    margin-left: -.5rem
}

.tao-tooltip {
    display: none;
    position: absolute;
    left: -9999px;
    top: -9999px;
    z-index: 300;
    opacity: 0;
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

.tao-tooltip[active] {
    opacity: 1;
    display: block
}

.tao-tooltip .tao-popover-content {
    padding: 8px 12px;
    padding: .5rem .75rem;
    background: #4a4a4a;
    color: #fff;
    border-radius: .25rem;
    white-space: nowrap;
    font-size: 14px;
    font-size: .875rem
}

.tao-tooltip .tao-popover-arrow {
    display: none;
    position: absolute;
    width: 12px;
    width: .75rem;
    height: 12px;
    height: .75rem
}

.tao-tooltip .tao-popover-arrow .arrow {
    font-size: 0;
    height: 0;
    width: 0;
    border-width: 6px;
    border: .375rem solid #4a4a4a;
    position: absolute;
    left: 0;
    top: 0
}

.tao-tooltip .tao-popover-arrow .arrow-border,
.tao-tooltip .tao-popover-arrow .arrow-shadow {
    display: none
}

.tao-tooltip[with-arrow] .tao-popover-arrow {
    display: block
}

.tao-tooltip[direction=right-bottom] .tao-popover-arrow,
.tao-tooltip[direction=right-middle] .tao-popover-arrow,
.tao-tooltip[direction=right-top] .tao-popover-arrow {
    left: -12px;
    left: -.75rem
}

.tao-tooltip[direction=right-bottom] .arrow-basic,
.tao-tooltip[direction=right-middle] .arrow-basic,
.tao-tooltip[direction=right-top] .arrow-basic {
    border-color: transparent #4a4a4a transparent transparent
}

.tao-tooltip[direction=left-bottom] .tao-popover-arrow,
.tao-tooltip[direction=left-middle] .tao-popover-arrow,
.tao-tooltip[direction=left-top] .tao-popover-arrow {
    right: -12px;
    right: -.75rem
}

.tao-tooltip[direction=left-bottom] .arrow-basic,
.tao-tooltip[direction=left-middle] .arrow-basic,
.tao-tooltip[direction=left-top] .arrow-basic {
    border-color: transparent transparent transparent #4a4a4a
}

.tao-tooltip[direction=left-top] .tao-popover-arrow,
.tao-tooltip[direction=right-top] .tao-popover-arrow {
    bottom: 12px;
    bottom: .75rem
}

.tao-tooltip[direction=left-bottom] .tao-popover-arrow,
.tao-tooltip[direction=right-bottom] .tao-popover-arrow {
    top: 12px;
    top: .75rem
}

.tao-tooltip[direction=left-middle] .tao-popover-arrow,
.tao-tooltip[direction=right-middle] .tao-popover-arrow {
    top: 50%;
    margin-top: -6px;
    margin-top: -.375rem
}

.tao-tooltip[direction=top-center] .tao-popover-arrow,
.tao-tooltip[direction=top-left] .tao-popover-arrow,
.tao-tooltip[direction=top-right] .tao-popover-arrow {
    bottom: -12px;
    bottom: -.75rem
}

.tao-tooltip[direction=top-center] .arrow-basic,
.tao-tooltip[direction=top-left] .arrow-basic,
.tao-tooltip[direction=top-right] .arrow-basic {
    border-color: #4a4a4a transparent transparent
}

.tao-tooltip[direction=bottom-center] .tao-popover-arrow,
.tao-tooltip[direction=bottom-left] .tao-popover-arrow,
.tao-tooltip[direction=bottom-right] .tao-popover-arrow {
    top: -12px;
    top: -.75rem
}

.tao-tooltip[direction=bottom-center] .arrow-basic,
.tao-tooltip[direction=bottom-left] .arrow-basic,
.tao-tooltip[direction=bottom-right] .arrow-basic {
    border-color: transparent transparent #4a4a4a
}

.tao-tooltip[direction=bottom-left] .tao-popover-arrow,
.tao-tooltip[direction=top-left] .tao-popover-arrow {
    right: 12px;
    right: .75rem
}

.tao-tooltip[direction=bottom-right] .tao-popover-arrow,
.tao-tooltip[direction=top-right] .tao-popover-arrow {
    left: 12px;
    left: .75rem
}

.tao-tooltip[direction=bottom-center] .tao-popover-arrow,
.tao-tooltip[direction=top-center] .tao-popover-arrow {
    left: 50%;
    margin-left: -6px;
    margin-left: -.375rem
}

.tao-dialog,
.tao-dialog-active {
    overflow: hidden
}

.tao-dialog {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 200;
    display: none
}

.tao-dialog[modal] {
    background-color: transparent;
    -webkit-transition: background-color .3s;
    transition: background-color .3s
}

.tao-dialog[modal][active] {
    background-color: rgba(0, 0, 0, .55)
}

.tao-dialog[active] .tao-dialog-wrapper {
    -webkit-transform: translate(0);
    transform: translate(0);
    opacity: 1
}

.tao-dialog[scrollable] .tao-dialog-content {
    overflow-y: auto;
    overscroll-behavior: contain
}

.tao-dialog .tao-dialog-wrapper {
    position: relative;
    width: 600px;
    width: 37.5rem;
    min-height: 1em;
    margin: 0 auto;
    border-radius: 0 0 .125rem .125rem;
    background-color: #fff;
    -webkit-box-shadow: 0 0 4px 4px rgba(0, 0, 0, .1);
    box-shadow: 0 0 4px 4px rgba(0, 0, 0, .1);
    -webkit-transform: translateY(-30%);
    transform: translateY(-30%);
    -webkit-transition: opacity .3s, -webkit-transform .3s;
    transition: opacity .3s, -webkit-transform .3s;
    transition: transform .3s, opacity .3s;
    transition: transform .3s, opacity .3s, -webkit-transform .3s;
    opacity: 0
}

.tao-dialog .tao-dialog-content {
    padding: 16px 32px;
    padding: 1rem 2rem
}

.tao-dialog .tao-dialog-content .title:first-child,
.tao-dialog .tao-dialog-content h3:first-child {
    margin-bottom: 32px;
    margin-bottom: 2rem
}

.tao-dialog .tao-dialog-buttons,
.tao-dialog .tao-dialog-content .buttons,
.tao-dialog .tao-dialog-content .form-buttons {
    margin-left: 0;
    margin-bottom: 16px;
    margin-bottom: 1rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.tao-dialog .tao-dialog-buttons .button,
.tao-dialog .tao-dialog-buttons a,
.tao-dialog .tao-dialog-content .buttons .button,
.tao-dialog .tao-dialog-content .buttons a,
.tao-dialog .tao-dialog-content .form-buttons .button,
.tao-dialog .tao-dialog-content .form-buttons a {
    margin: 0 12px;
    margin: 0 .75rem
}

.tao-dialog .tao-dialog-buttons {
    margin: 24px 0 0;
    margin: 1.5rem 0 0
}

.tao-dialog.tao-confirm-dialog .tao-dialog-wrapper,
.tao-dialog.tao-message-dialog .tao-dialog-wrapper {
    width: 520px;
    width: 32.5rem;
    padding: 24px 32px;
    padding: 1.5rem 2rem
}

.tao-dialog.tao-confirm-dialog .tao-dialog-content,
.tao-dialog.tao-message-dialog .tao-dialog-content {
    padding: 0
}

.tao-dialog[size=l] .tao-dialog-wrapper {
    width: 860px;
    width: 53.75rem
}

.tao-dialog[size=xl] .tao-dialog-wrapper {
    width: 1140px;
    width: 71.25rem
}

.tao-dialog .tao-dialog-wrapper>.link-close {
    display: none;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 32px;
    width: 2rem;
    height: 32px;
    height: 2rem;
    position: absolute;
    top: 10px;
    top: .625rem;
    right: 10px;
    right: .625rem;
    text-decoration: none;
    fill: #9b9b9b
}

.tao-dialog .tao-dialog-wrapper>.link-close:hover {
    fill: #4a4a4a
}

.tao-dialog .tao-dialog-wrapper>.link-close .icon {
    width: 20px;
    width: 1.25rem;
    height: 20px;
    height: 1.25rem
}

.tao-dialog[with-close-button] .tao-dialog-wrapper>.link-close {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.tao-sortable [draggable=true] {
    cursor: move;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -khtml-user-drag: element;
    -webkit-user-drag: element
}

.tao-sortable .tao-sortable-sorting {
    visibility: hidden!important
}

.tao-tree,
.tao-tree .tao-tree-item {
    display: block
}

.tao-tree .tao-tree-item .tao-tree-item-padding {
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.tao-tree .tao-tree-item .tao-tree-item-padding .padding-item {
    position: relative;
    height: 100%;
    width: 32px;
    width: 2rem
}

.tao-tree .tao-tree-item .tao-tree-item-padding .padding-item:before {
    content: "";
    display: block;
    border-left: 1px solid #eee;
    position: absolute;
    left: 10px;
    left: .625rem;
    top: 0;
    right: 0;
    bottom: 0
}

.tao-tree .tao-tree-item .tao-tree-item-padding .padding-item:last-child:after {
    content: "";
    display: block;
    border-bottom: 1px solid #eee;
    position: absolute;
    left: 10px;
    left: .625rem;
    top: 0;
    right: 9.6px;
    right: .6rem;
    bottom: 50%
}

.tao-tree .tao-tree-item:first-child[depth="0"]>.tao-tree-item-content .tao-tree-item-padding .padding-item:last-child:before {
    top: 50%
}

.tao-tree .tao-tree-item:last-child>.tao-tree-item-content .tao-tree-item-padding .padding-item:last-child:before {
    bottom: 50%
}

.tao-tree .tao-tree-item:last-child[depth="0"]>.tao-tree-list .tao-tree-item-padding .padding-item:first-child:before,
.tao-tree .tao-tree-item:last-child[depth="1"]>.tao-tree-list .tao-tree-item-padding .padding-item:nth-child(2):before,
.tao-tree .tao-tree-item:last-child[depth="2"]>.tao-tree-list .tao-tree-item-padding .padding-item:nth-child(3):before,
.tao-tree .tao-tree-item:last-child[depth="3"]>.tao-tree-list .tao-tree-item-padding .padding-item:nth-child(4):before,
.tao-tree .tao-tree-item:last-child[depth="4"]>.tao-tree-list .tao-tree-item-padding .padding-item:nth-child(5):before,
.tao-tree .tao-tree-item:last-child[depth="5"]>.tao-tree-list .tao-tree-item-padding .padding-item:nth-child(6):before,
.tao-tree .tao-tree-item:last-child[depth="6"]>.tao-tree-list .tao-tree-item-padding .padding-item:nth-child(7):before,
.tao-tree .tao-tree-item:last-child[depth="7"]>.tao-tree-list .tao-tree-item-padding .padding-item:nth-child(8):before,
.tao-tree .tao-tree-item:last-child[depth="8"]>.tao-tree-list .tao-tree-item-padding .padding-item:nth-child(9):before,
.tao-tree .tao-tree-item:last-child[depth="9"]>.tao-tree-list .tao-tree-item-padding .padding-item:nth-child(10):before {
    display: none
}

.tao-tree .tao-tree-item>.tao-tree-item-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 40px;
    height: 2.5rem;
    font-size: 14px;
    font-size: .875rem
}

.tao-tree .tao-tree-item>.tao-tree-item-content .link-toggle-item {
    display: block;
    background: #fff;
    width: 14px;
    width: .875rem;
    height: 14px;
    height: .875rem;
    -webkit-transition: -webkit-transform .2s;
    transition: -webkit-transform .2s;
    transition: transform .2s;
    transition: transform .2s, -webkit-transform .2s;
    border: 1px solid #ccc;
    border-radius: 50%;
    margin: 0 16px 0 -28px;
    margin: 0 1rem 0 -1.75rem;
    cursor: pointer;
    visibility: hidden;
    position: relative
}

.tao-tree .tao-tree-item>.tao-tree-item-content .link-toggle-item .icon {
    display: block;
    width: 12px;
    width: .75rem;
    height: 12px;
    height: .75rem;
    fill: #9b9b9b
}

.tao-tree .tao-tree-item>.tao-tree-item-content .link-toggle-item:hover {
    background: #f6f6f6
}

.tao-tree .tao-tree-item>.tao-tree-item-content .link-toggle-item:hover .icon {
    fill: #4a4a4a
}

.tao-tree .tao-tree-item>.tao-tree-item-content tao-check-box {
    margin: 0 12px 0 0;
    margin: 0 .75rem 0 0
}

.tao-tree .tao-tree-item>.tao-tree-list {
    display: none;
    -webkit-transition: height .2s;
    transition: height .2s;
    overflow: hidden
}

.tao-tree .tao-tree-item>.tao-tree-list>.tao-tree-loading {
    color: #9b9b9b
}

.tao-tree .tao-tree-item>.tao-tree-list>.tao-tree-loading .icon {
    margin: 0 12px 0 0;
    margin: 0 .75rem 0 0
}

.tao-tree .tao-tree-item[expandable]>.tao-tree-item-content .link-toggle-item {
    visibility: visible
}

.tao-tree .tao-tree-item[expandable][expanded]>.tao-tree-item-content .link-toggle-item {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}

.tao-tree .tao-tree-item[expandable][expanded]>.tao-tree-list {
    display: block;
    height: auto
}

.tabs {
    height: 60px
}

.tabs,
.tabs .tab {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.tabs .tab {
    height: 100%;
    border-bottom: 3px solid #fff;
    padding: 3px .25em 0;
    color: #4a4a4a;
    margin: 0 20px
}

.tabs .tab:hover {
    color: #5b3
}

.tabs .tab.active {
    color: #5b3;
    border-color: #5b3
}

.vertical-tabs {
    width: 200px
}

.vertical-tabs .tab {
    height: 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid #eee;
    color: #4a4a4a
}

.vertical-tabs .tab:before {
    content: "";
    display: block;
    height: 20px;
    width: 3px;
    background-color: #fff;
    margin-right: 1.25em
}

.vertical-tabs .tab:last-child {
    border-bottom: none
}

.vertical-tabs .tab.active,
.vertical-tabs .tab:hover {
    color: #5b3
}

.vertical-tabs .tab.active:before {
    background-color: #5b3
}

.tao-tabs {
    display: block
}

.tao-tabs .tab-panels>.tab-panel {
    display: none
}

.tao-tabs .tab-panels>.tab-panel.active {
    display: block
}

::-webkit-input-placeholder {
    color: #ccc
}

:-ms-input-placeholder,
::-ms-input-placeholder {
    color: #ccc
}

::placeholder {
    color: #ccc
}

input[type=date],
input[type=datetime-local],
input[type=email],
input[type=month],
input[type=number],
input[type=password],
input[type=search],
input[type=tel],
input[type=text],
input[type=time],
textarea {
    width: 320px;
    width: 20rem;
    padding: 8px 10px;
    padding: .5rem .625rem;
    background: #fff;
    border: 1px solid #dfdfdf;
    border-radius: .125rem;
    font-size: 14px;
    font-size: .875rem;
    color: #4a4a4a;
    line-height: 18px;
    line-height: 1.125rem;
    -webkit-transition: border-color .3s;
    transition: border-color .3s;
    outline: none
}

input[type=date]:hover,
input[type=datetime-local]:hover,
input[type=email]:hover,
input[type=month]:hover,
input[type=number]:hover,
input[type=password]:hover,
input[type=search]:hover,
input[type=tel]:hover,
input[type=text]:hover,
input[type=time]:hover,
textarea:hover {
    border-color: #49e
}

input[type=date]:focus,
input[type=datetime-local]:focus,
input[type=email]:focus,
input[type=month]:focus,
input[type=number]:focus,
input[type=password]:focus,
input[type=search]:focus,
input[type=tel]:focus,
input[type=text]:focus,
input[type=time]:focus,
textarea:focus {
    border-color: #37c
}

input[type=date][readonly],
input[type=datetime-local][readonly],
input[type=email][readonly],
input[type=month][readonly],
input[type=number][readonly],
input[type=password][readonly],
input[type=search][readonly],
input[type=tel][readonly],
input[type=text][readonly],
input[type=time][readonly],
textarea[readonly] {
    color: #666
}

input[type=date][disabled],
input[type=datetime-local][disabled],
input[type=email][disabled],
input[type=month][disabled],
input[type=number][disabled],
input[type=password][disabled],
input[type=search][disabled],
input[type=tel][disabled],
input[type=text][disabled],
input[type=time][disabled],
textarea[disabled] {
    cursor: not-allowed;
    background: #f6f6f6;
    border-color: #eee;
    color: #ccc
}

textarea {
    display: block;
    height: auto;
    line-height: 1.6;
    resize: none
}

select {
    width: 320px;
    width: 20rem;
    padding: 8px 10px;
    padding: .5rem .625rem;
    background: #fff;
    border: 1px solid #dfdfdf;
    border-radius: .125rem;
    font-size: 14px;
    font-size: .875rem;
    color: #4a4a4a;
    line-height: 18px;
    line-height: 1.125rem;
    -webkit-transition: border-color .3s;
    transition: border-color .3s;
    outline: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

select:hover {
    border-color: #49e
}

select:focus {
    border-color: #37c
}

select[readonly] {
    color: #666
}

select[disabled] {
    cursor: not-allowed;
    background: #f6f6f6;
    border-color: #eee;
    color: #ccc
}

.tao-form {
    display: block;
    margin: 2em 0 0
}

.tao-form form fieldset {
    border: none;
    padding: 0;
    margin: 0 0 2em
}

.tao-form form fieldset legend {
    font-size: 16px;
    font-size: 1rem;
    margin: 0 0 1.5em
}

.tao-form form>.error {
    display: block;
    margin-bottom: 2em;
    font-size: 12px;
    font-size: .75rem;
    padding: 1em;
    color: #f75;
    border: 1px solid #f75;
    border-radius: .125rem;
    text-align: center
}

.tao-form form .form-input {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-line-pack: start;
    align-content: flex-start;
    margin: 0 0 12px;
    margin: 0 0 .75rem
}

.tao-form form .form-input:last-child {
    margin-bottom: 0
}

.tao-form form .form-input .input-label {
    display: block;
    width: 160px;
    width: 10rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    padding: 8px 0;
    padding: .5rem 0;
    text-align: right;
    margin: 0 30px 0 0;
    margin: 0 1.875rem 0 0;
    line-height: 20px;
    line-height: 1.25rem;
    font-size: 14px;
    font-size: .875rem;
    color: #9b9b9b
}

.tao-form form .form-input .input-label.required abbr {
    text-decoration: none;
    color: #f75;
    border: none
}

.tao-form form .form-input .input-content {
    min-height: 36px;
    min-height: 2.25rem
}

.tao-form form .form-input .input-content .input-field-wrapper {
    margin-bottom: 12px;
    margin-bottom: .75rem
}

.tao-form form .form-input .input-content .input-field-wrapper:last-child {
    margin-bottom: 0
}

.tao-form form .form-input .input-content .input-field-placeholder {
    display: inline-block;
    width: 320px;
    width: 20rem;
    padding: 8px 10px;
    padding: .5rem .625rem;
    line-height: 18px;
    line-height: 1.125rem;
    font-size: 14px;
    font-size: .875rem;
    color: #4a4a4a
}

.tao-form form .form-input .input-content .input-field {
    font-size: 14px;
    font-size: .875rem
}

.tao-form form .form-input .input-content>.bottom-hint {
    display: block;
    color: #9b9b9b;
    margin: 6px 0;
    margin: .375rem 0;
    font-size: 12px;
    font-size: .75rem
}

.tao-form form .form-input .input-content>.error {
    color: #f75;
    margin: 6px 0;
    margin: .375rem 0;
    font-size: 12px;
    font-size: .75rem
}

.tao-form form .form-input>.hint {
    opacity: 0;
    color: #9b9b9b;
    margin: 0 0 0 30px;
    margin: 0 0 0 1.875rem;
    padding: 8px 0;
    padding: .5rem 0;
    font-size: 12px;
    font-size: .75rem;
    line-height: 18px;
    line-height: 1.125rem;
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

.tao-form form .form-input.input-with-errors .input-content .input-field {
    border-color: #f75
}

.tao-form form .form-input.focus .hint,
.tao-form form .form-input:hover .hint {
    opacity: 1
}

.tao-form form .form-buttons {
    margin: 40px 0 0 190px;
    margin: 40px 0 0 11.875rem
}

.tao-form form .form-buttons .success-message {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: .3125em 1.5em;
    font-size: 16px;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .125rem;
    text-align: center;
    vertical-align: middle;
    background: #fff;
    border: 1px solid #5b3;
    color: #5b3;
    fill: #5b3
}

.tao-form form .form-buttons .success-message .icon {
    margin: 0 .4em 0 0
}

.tao-form.form-without-label form .form-buttons {
    margin-left: 0
}

.tao-dialog .tao-form form .form-input .input-label {
    width: 128px;
    width: 8rem
}

.tao-form.narrow {
    width: 320px;
    width: 20rem;
    margin: 0 auto
}

.tao-form.narrow form .form-input {
    display: block;
    margin: 0 0 20px;
    margin: 0 0 1.25rem
}

.tao-form.narrow form .form-input .input-label {
    text-align: left;
    font-size: 12px;
    font-size: .75rem;
    padding: 0;
    margin: 0 0 6px;
    margin: 0 0 .375rem
}

.tao-form.narrow form .form-input>.hint {
    opacity: 1;
    margin: 6px 0 0;
    margin: .375rem 0 0;
    padding: 0;
    line-height: inherit
}

.tao-form.narrow form .form-buttons {
    margin: 40px 0 0;
    margin: 2.5rem 0 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.tao-form.narrow form .form-buttons .button {
    margin: 0 16px;
    margin: 0 1rem
}

.tao-form .boolean-field {
    height: 36px;
    height: 2.25rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.tao-form .boolean-field,
.tao-form .group-field {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.tao-form .group-field {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-line-pack: start;
    align-content: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.tao-form .group-field .checkbox,
.tao-form .group-field .radio {
    display: inline-block;
    margin: 0 1.5em 0 0
}

.tao-form .group-field .checkbox label,
.tao-form .group-field .radio label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    height: 36px;
    height: 2.25rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.tao-form .group-field .checkbox label tao-check-box,
.tao-form .group-field .checkbox label tao-radio-button,
.tao-form .group-field .radio label tao-check-box,
.tao-form .group-field .radio label tao-radio-button {
    margin: 0 .5em 0 0
}

.tao-form .text-field {
    position: relative
}

.tao-form .text-field .prefix,
.tao-form .text-field .suffix {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    width: 36px;
    width: 2.25rem;
    height: 36px;
    height: 2.25rem;
    font-size: 14px;
    font-size: .875rem;
    color: #9b9b9b;
    fill: #9b9b9b
}

.tao-form .text-field .prefix {
    top: 0;
    left: 0
}

.tao-form .text-field .suffix {
    top: 0;
    right: 0
}

.tao-form .text-field.text-field-with-prefix .input-field {
    padding-left: 34px;
    padding-left: 2.125rem
}

.tao-form .text-field.text-field-with-suffix .input-field {
    padding-right: 34px;
    padding-right: 2.125rem
}

.tao-check-box {
    display: inline-block;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    outline: none
}

.tao-check-box .checkbox-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: #fff;
    border: 1px solid #9b9b9b;
    border-radius: 2px;
    height: 16px;
    height: 1rem;
    width: 16px;
    width: 1rem;
    -webkit-transition: border-color .2s, background .2s;
    transition: border-color .2s, background .2s;
    outline: none
}

.tao-check-box .checkbox-wrapper .icon {
    display: none;
    height: 12px;
    height: .75rem;
    width: 12px;
    width: .75rem;
    fill: #fff
}

.tao-check-box .checkbox-wrapper .icon.icon-indeterminate {
    width: 10px;
    height: 2px;
    border-radius: 1px;
    background: #fff
}

.tao-check-box input[type=checkbox] {
    display: none
}

.tao-check-box input[type=checkbox]:checked+.checkbox-wrapper,
.tao-check-box input[type=checkbox]:indeterminate+.checkbox-wrapper {
    background-color: #5b3;
    border-color: #5b3
}

.tao-check-box input[type=checkbox]:checked+.checkbox-wrapper .icon-check,
.tao-check-box input[type=checkbox]:indeterminate+.checkbox-wrapper .icon-indeterminate {
    display: block
}

.tao-check-box input[type=checkbox]:disabled+.checkbox-wrapper {
    border: 1px solid #ddd;
    background-color: #f6f6f6
}

.tao-check-box input[type=checkbox]:disabled+.checkbox-wrapper .icon {
    fill: #ddd
}

.tao-check-box input[type=checkbox]:disabled+.checkbox-wrapper .icon-indeterminate {
    background: #ddd
}

.tao-check-box .checkbox-wrapper:hover {
    border-color: #63d65c
}

.tao-check-box .checkbox-wrapper:focus {
    border-color: #63d65c;
    -webkit-box-shadow: 0 0 4px 0 rgba(74, 144, 226, .5);
    box-shadow: 0 0 4px 0 rgba(74, 144, 226, .5)
}

.tao-check-box input[type=checkbox]:checked+.checkbox-wrapper:hover,
.tao-check-box input[type=checkbox]:indeterminate+.checkbox-wrapper:hover {
    background-color: #63d65c;
    border-color: #63d65c
}

.tao-check-box input[type=checkbox]:disabled+.checkbox-wrapper:hover {
    border: 1px solid #ddd;
    background-color: #f6f6f6
}

.tao-check-box input[type=checkbox]:disabled+.checkbox-wrapper:focus {
    -webkit-box-shadow: none;
    box-shadow: none
}

.tao-radio-button {
    display: inline-block;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.tao-radio-button .radio-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 16px;
    height: 1rem;
    width: 16px;
    width: 1rem;
    border: 1px solid #9b9b9b;
    border-radius: 50%;
    background-color: #fff
}

.tao-radio-button .radio-wrapper,
.tao-radio-button .radio-wrapper .icon-radio {
    -webkit-transition: border-color .2s, background-color .2s;
    transition: border-color .2s, background-color .2s
}

.tao-radio-button .radio-wrapper .icon-radio {
    height: 8px;
    height: .5rem;
    width: 8px;
    width: .5rem;
    border-radius: 50%;
    background-color: #5b3;
    display: none
}

.tao-radio-button input[type=radio] {
    display: none
}

.tao-radio-button input[type=radio]:disabled+.radio-wrapper {
    cursor: not-allowed;
    border-color: #ddd;
    background-color: #f6f6f6
}

.tao-radio-button input[type=radio]:checked+.radio-wrapper {
    border-color: #5b3
}

.tao-radio-button input[type=radio]:checked+.radio-wrapper .icon-radio {
    display: block
}

.tao-radio-button input[type=radio]:checked:disabled+.radio-wrapper {
    border-color: #ddd;
    background-color: #f6f6f6
}

.tao-radio-button input[type=radio]:checked:disabled+.radio-wrapper .icon-radio {
    background-color: #ddd
}

.tao-radio-button .radio-wrapper:hover {
    border-color: #69d061
}

.tao-radio-button .radio-wrapper:hover .icon-radio {
    background-color: #69d061
}

.tao-radio-button .radio-wrapper:focus {
    border-color: #63d65c;
    -webkit-box-shadow: 0 0 4px 0 rgba(74, 144, 226, .5);
    box-shadow: 0 0 4px 0 rgba(74, 144, 226, .5);
    outline: none
}

.tao-radio-button input[type=radio]:checked+.radio-wrapper:hover {
    border-color: #63d65c
}

.tao-radio-button input[type=radio]:checked+.radio-wrapper:hover .icon-radio {
    background-color: #69d061
}

.tao-switch {
    display: inline-block
}

.tao-switch .switch-wrapper {
    width: 54px;
    width: 3.375rem;
    height: 26px;
    height: 1.625rem;
    position: relative
}

.tao-switch .switch-wrapper .switch-toggle {
    width: 26px;
    width: 1.625rem;
    height: 26px;
    height: 1.625rem;
    background-color: #fff;
    margin-left: 0;
    border: 1px solid #dfdfdf;
    border-radius: 50%;
    -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, .1);
    box-shadow: 0 0 2px rgba(0, 0, 0, .1);
    -webkit-transition: margin-left .2s;
    transition: margin-left .2s;
    position: relative;
    z-index: 1
}

.tao-switch .switch-wrapper .switch-slot {
    width: 54px;
    width: 3.375rem;
    height: 20px;
    height: 1.25rem;
    background-color: #eee;
    border-radius: .625rem;
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-.625rem);
    transform: translateY(-.625rem);
    -webkit-transition: background-color .2s;
    transition: background-color .2s
}

.tao-switch input[type=checkbox] {
    display: none
}

.tao-switch input[type=checkbox]:checked+.switch-wrapper .switch-toggle {
    margin-left: 28px;
    margin-left: 1.75rem
}

.tao-switch input[type=checkbox]:checked+.switch-wrapper .switch-slot {
    background-color: #5b3
}

.tao-switch input[type=checkbox]:disabled+.switch-wrapper {
    opacity: .5
}

.tao-switch .switch-wrapper {
    outline: none
}

.tao-switch .switch-wrapper:focus .switch-toggle {
    -webkit-box-shadow: 0 0 4px 0 rgba(74, 144, 226, .5);
    box-shadow: 0 0 4px 0 rgba(74, 144, 226, .5)
}

.tao-select-list {
    background: #fff
}

.tao-select-list .search-input {
    display: none;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    border-bottom: 1px solid #dfdfdf;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.tao-select-list .search-input,
.tao-select-list .search-input .icon-wrapper {
    -webkit-box-flex: 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.tao-select-list .search-input .icon-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: 34px;
    width: 2.125rem;
    height: 34px;
    height: 2.125rem;
    fill: #ccc
}

.tao-select-list .search-input .icon-wrapper .icon {
    width: 24px;
    width: 1.5rem;
    height: 24px;
    height: 1.5rem
}

.tao-select-list .search-input .search-field {
    display: block;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: auto;
    padding: 8px 10px;
    padding: .5rem .625rem;
    padding-left: 0;
    font-size: 14px;
    font-size: .875rem;
    line-height: 18px;
    line-height: 1.125rem;
    border: none;
    outline: none
}

.tao-select-list[searchable] .search-input {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.tao-select-list .list-wrapper {
    overflow-y: auto
}

.tao-select-list .options-list .option {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    padding: 8px 10px;
    padding: .5rem .625rem;
    font-size: 14px;
    font-size: .875rem;
    line-height: 18px;
    line-height: 1.125rem;
    border-bottom: 1px solid #eee;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer
}

.tao-select-list .options-list .option.highlighted {
    background: #f6f6f6
}

.tao-select-list .options-list .option:last-child {
    border-bottom: none
}

.tao-select-list .options-list .option .name {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.tao-select-list .options-list .option .name .prefix {
    margin-right: .5em
}

.tao-select-list .options-list .option.selected .name {
    color: #5b3
}

.tao-select-list .options-list .option .hint {
    font-size: 10px;
    font-size: .625rem;
    color: #ccc
}

.tao-select-list .options-list .optgroup {
    background: #efefef;
    padding: 0 16px;
    padding: 0 1rem;
    line-height: 30px;
    line-height: 1.875rem;
    color: #9b9b9b;
    font-size: 10px;
    font-size: .625rem;
    font-weight: 700
}

.tao-select-list .loading-message,
.tao-select-list .no-option,
.tao-select-list .remote-no-option,
.tao-select-list .search-not-found,
.tao-select-list .tips {
    display: none;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    min-height: 34px;
    min-height: 2.125rem;
    padding: 8px 10px;
    padding: .5rem .625rem;
    font-size: 12px;
    font-size: .75rem;
    line-height: 18px;
    line-height: 1.125rem;
    color: #ccc;
    text-align: center
}

.tao-select-list .tips {
    border-top: 1px solid #dfdfdf
}

.tao-select-list[empty]:not([hidden-size="0"]) .remote-no-option,
.tao-select-list[empty][hidden-size="0"] .no-option {
    display: block
}

.tao-select-list[empty][searching] .no-option,
.tao-select-list[empty][searching] .remote-no-option {
    display: none
}

.tao-select-list:not([empty]):not([hidden-size="0"]) .tips,
.tao-select-list[empty][searching] .search-not-found,
.tao-select-list[loading] .loading-message {
    display: block
}

.tao-select-list[loading] .no-option,
.tao-select-list[loading] .remote-no-option,
.tao-select-list[loading] .search-not-found,
.tao-select-list[loading] .tips {
    display: none!important
}

.tao-select-list {
    display: none;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 100%;
    border: 1px solid #dfdfdf;
    -webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, .2);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .2);
    z-index: 300;
    margin-top: 6px;
    margin-top: .375rem
}

.tao-select-list[active] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.tao-select-list[direction=up] {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    top: auto;
    bottom: 100%;
    margin-top: 0;
    margin-bottom: 6px;
    margin-bottom: .375rem
}

.tao-select-list[direction=up] .search-input {
    border-top: 1px solid #dfdfdf;
    border-bottom: none
}

.tao-select-list[direction=up] .options-list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse
}

.tao-select-list[direction=up] .options-list .option {
    border-bottom: none;
    border-top: 1px solid #dfdfdf
}

.tao-select-list[direction=up] .options-list .option:last-child {
    border-top: none
}

.tao-select-list .list-wrapper {
    max-height: 272px;
    max-height: 17rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto
}

.tao-select-list .options-list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.tao-select-list .options-list,
.tao-select-result {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.tao-select-result {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    background: #fff;
    border: 1px solid #dfdfdf;
    border-radius: .125rem;
    -webkit-transition: border-color .3s;
    transition: border-color .3s;
    cursor: pointer
}

.tao-select-result:hover {
    border-color: #49e
}

.tao-select-result:focus,
.tao-select-result[active] {
    border-color: #37c;
    outline: none
}

.tao-select-result[disabled] {
    cursor: not-allowed;
    background: #f6f6f6;
    border-color: #eee
}

.tao-select-result[disabled][selected][clearable] .link-clear {
    display: none
}

.tao-select-result[disabled] .selected-text {
    color: #ccc
}

.tao-select-result select {
    display: none
}

.tao-select-result .placeholder,
.tao-select-result .selected-text {
    padding: 8px 0 8px 10px;
    padding: .5rem 0 .5rem .625rem;
    font-size: 14px;
    font-size: .875rem;
    line-height: 18px;
    line-height: 1.125rem;
    min-height: 34px;
    min-height: 2.125rem
}

.tao-select-result .placeholder {
    color: #ccc
}

.tao-select-result .selected-text {
    color: #4a4a4a;
    display: none
}

.tao-select-result .icon-wrapper,
.tao-select-result .link-clear {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: 34px;
    width: 2.125rem;
    height: 34px;
    height: 2.125rem;
    fill: #9b9b9b
}

.tao-select-result .icon-wrapper .icon,
.tao-select-result .link-clear .icon {
    width: 24px;
    width: 1.5rem;
    height: 24px;
    height: 1.5rem
}

.tao-select-result .link-clear {
    display: none;
    text-decoration: none;
    outline: none
}

.tao-select-result .link-clear:hover {
    fill: #4a4a4a
}

.tao-select-result[selected] .placeholder {
    display: none
}

.tao-select-result[selected] .selected-text {
    display: block
}

.tao-select-result[selected][clearable]:hover .link-clear,
.tao-select-result[selected][clearable][active] .link-clear {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.tao-select-result[selected][clearable]:hover .arrow-icon-wrapper,
.tao-select-result[selected][clearable][active] .arrow-icon-wrapper {
    display: none
}

.tao-multiple-select-result {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-line-pack: start;
    align-content: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.tao-multiple-select-result select {
    display: none
}

.tao-multiple-select-result .selected-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    padding: 0 8px 0 12px;
    padding: 0 .5rem 0 .75rem;
    margin: 0 8px 8px 0;
    margin: 0 .5rem .5rem 0;
    height: 36px;
    height: 2.25rem;
    border: 1px solid #f6f6f6;
    background: #f6f6f6;
    border-radius: .125rem;
    color: #4a4a4a;
    font-size: 14px;
    font-size: .875rem;
    text-decoration: none;
    outline: none
}

.tao-multiple-select-result .selected-item .icon-close-bold {
    width: 1.5em;
    height: 1.5em;
    margin: 0 0 0 8px;
    margin: 0 0 0 .5rem;
    fill: #9b9b9b
}

.tao-multiple-select-result .selected-item .name {
    line-height: 24px;
    line-height: 1.5rem
}

.tao-multiple-select-result.disabled .selected-item {
    cursor: not-allowed;
    color: #ccc
}

.tao-multiple-select-result.disabled .selected-item .icon-close-bold {
    cursor: not-allowed;
    fill: #ccc
}

.tao-multiple-select-result {
    min-width: 320px;
    min-width: 20rem;
    padding-top: 2px;
    padding-top: .125rem
}

.tao-multiple-select-result .sortable-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-line-pack: start;
    align-content: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.tao-multiple-select-result .selected-item:hover {
    background: #fff;
    border-color: #f75
}

.tao-multiple-select-result .selected-item:hover .icon-close-bold {
    fill: #f75
}

.tao-multiple-select-result .selected-item:focus {
    -webkit-box-shadow: 0 0 2px 0 hsla(0, 0%, 87%, .5);
    box-shadow: 0 0 2px 0 hsla(0, 0%, 87%, .5)
}

.tao-multiple-select-result .selected-item.tao-sortable-sorting {
    background: #fffcf7;
    border: 1px dashed #fa0;
    visibility: visible!important
}

.tao-multiple-select-result .selected-item.tao-sortable-sorting>* {
    visibility: hidden
}

.tao-multiple-select-result .link-add {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    padding: 0 10px 0 8px;
    padding: 0 .625rem 0 .5rem;
    margin: 0 8px 8px 0;
    margin: 0 .5rem .5rem 0;
    height: 36px;
    height: 2.25rem;
    border: 1px dashed #dfdfdf;
    background: #fff;
    border-radius: .125rem;
    color: #4a4a4a;
    font-size: 14px;
    font-size: .875rem;
    text-decoration: none;
    outline: none
}

.tao-multiple-select-result .link-add .icon-plus {
    width: 16px;
    width: 1rem;
    height: 16px;
    height: 1rem;
    fill: #9b9b9b;
    margin: 0 4px 0 0;
    margin: 0 .25rem 0 0
}

.tao-multiple-select-result .link-add .text {
    line-height: 24px;
    line-height: 1.5rem
}

.tao-multiple-select-result .link-add:focus {
    -webkit-box-shadow: 0 0 2px 0 hsla(0, 0%, 87%, .5);
    box-shadow: 0 0 2px 0 hsla(0, 0%, 87%, .5)
}

.tao-multiple-select-result .link-add:hover,
.tao-multiple-select-result[active] .link-add {
    color: #49e;
    border-color: #49e
}

.tao-multiple-select-result .link-add:hover .icon-plus,
.tao-multiple-select-result[active] .link-add .icon-plus {
    fill: #49e
}

.tao-multiple-select-result.disabled .selected-item:hover {
    background-color: #f6f6f6;
    border-color: #f6f6f6
}

.tao-multiple-select-result.disabled .link-add {
    display: none
}

.tao-select {
    display: inline-block;
    width: 320px;
    width: 20rem;
    position: relative
}

.tao-select[multiple] {
    width: auto
}

.tao-moment-picker-date-segment .calendar .weekdays {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    border-bottom: 1px dotted #dfdfdf
}

.tao-moment-picker-date-segment .calendar .weekdays .weekday {
    display: block;
    width: 14.28571%;
    line-height: 34px;
    line-height: 2.125rem;
    text-align: center;
    font-size: 14px;
    font-size: .875rem
}

.tao-moment-picker-date-segment .calendar .days {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.tao-moment-picker-date-segment .calendar .days .day {
    display: block;
    width: 14.28571%;
    line-height: 34px;
    line-height: 2.125rem;
    text-align: center;
    font-size: 14px;
    font-size: .875rem;
    border-radius: .125rem;
    color: #4a4a4a;
    outline: none
}

.tao-moment-picker-date-segment .calendar .days .day.outside {
    color: #9b9b9b
}

.tao-moment-picker-date-segment .calendar .days .day.today {
    color: #fa0
}

.tao-moment-picker-date-segment .calendar .days .day.selected {
    background: #f5fdf3!important;
    color: #5b3!important
}

.tao-moment-picker-date-segment .calendar .days .day.disabled {
    color: #ccc;
    background: none!important;
    cursor: default
}

.tao-moment-picker-date-segment .calendar {
    width: 240px;
    width: 15rem;
    margin-top: -8px;
    margin-top: -.5rem
}

.tao-moment-picker-date-segment .calendar .days {
    margin: 8px 0 0;
    margin: .5rem 0 0
}

.tao-moment-picker-date-segment .calendar .days .day:hover {
    background: #f6f6f6
}

.tao-moment-picker-hour-segment .hours .afternoon-hours,
.tao-moment-picker-hour-segment .hours .morning-hours {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.tao-moment-picker-hour-segment .hours .morning-hours {
    padding-bottom: 11.333px;
    padding-bottom: .70833rem;
    border-bottom: 1px dotted #dfdfdf
}

.tao-moment-picker-hour-segment .hours .afternoon-hours {
    padding-top: 11.333px;
    padding-top: .70833rem
}

.tao-moment-picker-hour-segment .hours .hour {
    display: block;
    width: 16.66667%;
    line-height: 34px;
    line-height: 2.125rem;
    text-align: center;
    font-size: 14px;
    font-size: .875rem;
    color: #4a4a4a;
    outline: none
}

.tao-moment-picker-hour-segment .hours .hour.selected {
    background: #f5fdf3;
    color: #5b3
}

.tao-moment-picker-hour-segment .hours {
    width: 192px;
    width: 12rem
}

.tao-moment-picker-hour-segment .hours .hour:focus,
.tao-moment-picker-hour-segment .hours .hour:hover {
    background: #f6f6f6
}

.tao-moment-picker-minute-segment .minutes {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.tao-moment-picker-minute-segment .minutes .minute {
    display: block;
    width: 16.66667%;
    line-height: 34px;
    line-height: 2.125rem;
    text-align: center;
    font-size: 14px;
    font-size: .875rem;
    color: #4a4a4a;
    outline: none
}

.tao-moment-picker-minute-segment .minutes .minute.selected {
    background: #f5fdf3;
    color: #5b3
}

.tao-moment-picker-minute-segment .minutes {
    width: 192px;
    width: 12rem;
    max-height: 192px;
    max-height: 12rem;
    overflow: auto
}

.tao-moment-picker-minute-segment .minutes .minute:focus,
.tao-moment-picker-minute-segment .minutes .minute:hover {
    background: #f6f6f6
}

.tao-moment-picker-month-segment .month-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.tao-moment-picker-month-segment .month-list .month {
    display: block;
    width: 25%;
    line-height: 34px;
    line-height: 2.125rem;
    text-align: center;
    font-size: 14px;
    font-size: .875rem;
    color: #4a4a4a;
    outline: none
}

.tao-moment-picker-month-segment .month-list .month.current {
    color: #fa0
}

.tao-moment-picker-month-segment .month-list .month.selected {
    background: #f5fdf3!important;
    color: #5b3!important
}

.tao-moment-picker-month-segment .month-list {
    width: 240px;
    width: 15rem
}

.tao-moment-picker-month-segment .month-list .month:focus,
.tao-moment-picker-month-segment .month-list .month:hover {
    background: #f6f6f6
}

.tao-moment-picker-year-segment .year-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.tao-moment-picker-year-segment .year-list .year {
    display: block;
    width: 33.33333%;
    line-height: 34px;
    line-height: 2.125rem;
    text-align: center;
    font-size: 14px;
    font-size: .875rem;
    color: #4a4a4a;
    outline: none
}

.tao-moment-picker-year-segment .year-list .year.current {
    color: #fa0
}

.tao-moment-picker-year-segment .year-list .year.selected {
    background: #f5fdf3!important;
    color: #5b3!important
}

.tao-moment-picker-year-segment .year-list {
    width: 240px;
    width: 15rem
}

.tao-moment-picker-year-segment .year-list .year:focus,
.tao-moment-picker-year-segment .year-list .year:hover {
    background: #f6f6f6
}

.tao-moment-picker-result {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.tao-moment-picker-result[disabled] .result-text {
    color: #ccc
}

.tao-moment-picker-result input[type=date],
.tao-moment-picker-result input[type=datetime-local],
.tao-moment-picker-result input[type=month],
.tao-moment-picker-result input[type=text],
.tao-moment-picker-result input[type=time] {
    display: none
}

.tao-moment-picker-result .placeholder,
.tao-moment-picker-result .result-text {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 8px 0;
    padding: .5rem 0;
    font-size: 14px;
    font-size: .875rem;
    line-height: 18px;
    line-height: 1.125rem;
    min-height: 34px;
    min-height: 2.125rem
}

.tao-moment-picker-result .placeholder {
    color: #ccc
}

.tao-moment-picker-result .result-text {
    color: #4a4a4a;
    display: none
}

.tao-moment-picker-result[selected] .placeholder {
    display: none
}

.tao-moment-picker-result[selected] .result-text {
    display: block
}

.tao-moment-picker-result {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    background: #fff;
    border: 1px solid #dfdfdf;
    border-radius: .125rem;
    -webkit-transition: border-color .3s;
    transition: border-color .3s;
    cursor: pointer
}

.tao-moment-picker-result:hover {
    border-color: #49e
}

.tao-moment-picker-result:focus,
.tao-moment-picker-result[active] {
    border-color: #37c;
    outline: none
}

.tao-moment-picker-result[disabled] {
    cursor: not-allowed;
    background: #f6f6f6;
    border-color: #eee
}

.tao-moment-picker-result[disabled][selected]:hover .link-clear {
    display: none
}

.tao-moment-picker-result .icon-wrapper,
.tao-moment-picker-result .link-clear {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: 34px;
    width: 2.125rem;
    height: 34px;
    height: 2.125rem;
    fill: #9b9b9b
}

.tao-moment-picker-result .icon-wrapper .icon,
.tao-moment-picker-result .link-clear .icon {
    width: 24px;
    width: 1.5rem;
    height: 24px;
    height: 1.5rem
}

.tao-moment-picker-result .link-clear {
    display: none;
    text-decoration: none;
    outline: none
}

.tao-moment-picker-result .link-clear:hover {
    fill: #4a4a4a
}

.tao-moment-picker-result[selected]:hover .link-clear,
.tao-moment-picker-result[selected][active] .link-clear,
.tao-moment-picker-segment-list .segment-labels {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.tao-moment-picker-segment-list .segment-labels {
    padding: 8px 40px;
    padding: .5rem 2.5rem;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.tao-moment-picker-segment-list .segment-labels .segment-label {
    display: inline-block;
    border: 1px solid #f6f6f6;
    background: #f6f6f6;
    color: #4a4a4a;
    font-size: 12px;
    font-size: .75rem;
    padding: 2px 8px;
    padding: .125rem .5rem;
    margin: 0 4px;
    margin: 0 .25rem;
    border-radius: .125rem;
    white-space: nowrap;
    outline: none
}

.tao-moment-picker-segment-list .segment-labels .segment-label .value {
    display: none
}

.tao-moment-picker-segment-list .segment-labels .segment-label.active {
    border-color: #5b3;
    background: #fff;
    color: #5b3;
    cursor: default
}

.tao-moment-picker-segment-list .segment-labels .segment-label.selected .placeholder {
    display: none
}

.tao-moment-picker-segment-list .segment-labels .segment-label.selected .value {
    display: inline
}

.tao-moment-picker-segment-list .segment-labels .separator {
    font-size: 12px;
    font-size: .75rem;
    color: #9b9b9b;
    margin: 0 2px;
    margin: 0 .125rem
}

.tao-moment-picker-segment-list .segments .tao-moment-picker-segment {
    display: none;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    border-top: 1px solid #dfdfdf
}

.tao-moment-picker-segment-list .segments .tao-moment-picker-segment[active] {
    display: block
}

.tao-moment-picker-segment-list .segments .tao-moment-picker-segment .link-next,
.tao-moment-picker-segment-list .segments .tao-moment-picker-segment .link-prev {
    display: block;
    width: 40px;
    width: 2.5rem;
    height: 40px;
    height: 2.5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    fill: #9b9b9b;
    position: absolute;
    top: -40px;
    top: -2.5rem;
    outline: none
}

.tao-moment-picker-segment-list .segments .tao-moment-picker-segment .link-next .icon,
.tao-moment-picker-segment-list .segments .tao-moment-picker-segment .link-prev .icon {
    width: 24px;
    width: 1.5rem;
    height: 24px;
    height: 1.5rem
}

.tao-moment-picker-segment-list .segments .tao-moment-picker-segment .link-next {
    right: -8px;
    right: -.5rem
}

.tao-moment-picker-segment-list .segments .tao-moment-picker-segment .link-prev {
    left: -8px;
    left: -.5rem
}

.tao-moment-picker-segment-list {
    display: none;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: absolute;
    top: 100%;
    left: 0;
    background: #fff;
    border: 1px solid #dfdfdf;
    -webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, .2);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .2);
    z-index: 300;
    margin-top: 6px;
    margin-top: .375rem
}

.tao-moment-picker-segment-list[active] {
    display: block
}

.tao-moment-picker-segment-list[direction=up] {
    top: auto;
    bottom: 100%;
    margin-top: 0;
    margin-bottom: 6px;
    margin-bottom: .375rem
}

.tao-moment-picker-segment-list .segment-labels .segment-label:focus,
.tao-moment-picker-segment-list .segment-labels .segment-label:hover {
    background: #fff;
    border-color: #dfdfdf
}

.tao-moment-picker-segment-list .segments .tao-moment-picker-segment {
    margin: 0 8px;
    margin: 0 .5rem;
    padding: 8px 0;
    padding: .5rem 0
}

.tao-moment-picker-segment-list .segments .tao-moment-picker-segment .link-next:focus,
.tao-moment-picker-segment-list .segments .tao-moment-picker-segment .link-next:hover,
.tao-moment-picker-segment-list .segments .tao-moment-picker-segment .link-prev:focus,
.tao-moment-picker-segment-list .segments .tao-moment-picker-segment .link-prev:hover {
    fill: #4a4a4a
}

.tao-moment-picker {
    display: inline-block;
    width: 320px;
    width: 20rem;
    position: relative
}

.tao-datetime-picker {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 320px;
    width: 20rem
}

.tao-datetime-picker>input[type=datetime-local] {
    display: none
}

.tao-datetime-picker .tao-date-picker.tao-moment-picker {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: 176px;
    width: 11rem;
    margin-right: 8px;
    margin-right: .5rem
}

.tao-datetime-picker .tao-time-picker.tao-moment-picker {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: auto
}

.tao-date-range-picker {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 320px;
    width: 20rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.tao-date-range-picker .end-date-picker.tao-moment-picker,
.tao-date-range-picker .start-date-picker.tao-moment-picker {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: 50%
}

.tao-date-range-picker .to {
    font-size: 14px;
    font-size: .875rem;
    color: #ccc;
    margin: 0 8px;
    margin: 0 .5rem
}

.badge {
    display: inline-block;
    line-height: normal;
    text-align: center;
    padding: .05em .5em;
    vertical-align: middle;
    color: #fff;
    background: #9b9b9b;
    font-size: 12px;
    font-size: .75rem;
    font-weight: 300;
    border-radius: .25em
}

.badge.green {
    background: #5b3
}

.badge.red {
    background: #f75
}

.badge.orange {
    background: #fa0
}

.badge.blue {
    background: #2bf
}

.badge.pill {
    border-radius: 10rem;
    padding: .05em .6em
}

.badge.inverse {
    background: none;
    border: 1px solid #9b9b9b;
    color: #9b9b9b
}

.avatar {
    display: inline-block;
    border-radius: 100%;
    background: #ccc;
    color: #fff;
    overflow: hidden;
    text-align: center
}

.positive-amount {
    color: #5b3
}

.negative-amount {
    color: #f75
}

.approval-status-waiting {
    color: #f90
}

.approval-status-passed {
    color: #5b3
}

.approval-status-denied {
    color: #f75
}

.approval-status-revoked {
    color: #9b9b9b
}

.identity-employment-status-regular {
    color: #5b3
}

.identity-employment-status-probation {
    color: #fa0
}

.identity-employment-status-departing {
    color: #f75
}

.identity-state-onboarding {
    color: #2bf
}

.identity-state-in-service {
    color: #5b3
}

.identity-state-dimission {
    color: #9b9b9b
}

.identity-state-badge-onboarding {
    background: #2bf
}

.identity-state-badge-in_service {
    background: #5b3
}

.identity-state-badge-dimission {
    background: #9b9b9b
}

.attendance-status-waiting {
    color: #f90
}

.attendance-status-passed {
    color: #5b3
}

.attendance-status-denied {
    color: #f75
}

.attendance-status-canceled,
.attendance-status-revoked {
    color: #9b9b9b
}

@-webkit-keyframes highlight {
    0% {
        background-color: #ffffbf
    }
    to {
        background-color: transparent
    }
}

@keyframes highlight {
    0% {
        background-color: #ffffbf
    }
    to {
        background-color: transparent
    }
}

.form-field-value {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 0 12px;
    margin: 0 0 .75rem;
    font-size: 14px;
    font-size: .875rem
}

.form-field-value .label {
    display: block;
    width: 160px;
    width: 10rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    padding: 8px 0;
    padding: .5rem 0;
    text-align: right;
    margin: 0 30px 0 0;
    margin: 0 1.875rem 0 0;
    line-height: 20px;
    line-height: 1.25rem;
    color: #9b9b9b
}

.form-field-value.with-label>.value {
    display: inline-block;
    width: 320px;
    width: 20rem;
    padding: 8px 10px;
    padding: .5rem .625rem;
    line-height: 20px;
    line-height: 1.25rem;
    color: #4a4a4a;
    word-break: break-all
}

.form-field-value:last-child {
    margin-bottom: 0
}

.form-field-value.text>.label {
    -ms-flex-item-align: start;
    align-self: flex-start
}

.form-field-value.text>.value {
    white-space: pre-line
}

.pagination-wrapper {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 30px;
    margin-top: 30px;
    padding: 0 10px;
    color: #9b9b9b;
    font-size: 14px;
    font-size: .875rem
}

.pagination-wrapper,
.pagination-wrapper .pagination {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.pagination-wrapper .pagination {
    text-align: center
}

.pagination-wrapper .pagination span {
    margin: 0 3px;
    line-height: 30px
}

.pagination-wrapper .pagination span.current,
.pagination-wrapper .pagination span a {
    display: block;
    width: 30px;
    height: 30px
}

.pagination-wrapper .pagination span.next a,
.pagination-wrapper .pagination span.prev a {
    width: 80px
}

.pagination-wrapper .pagination span a {
    color: #9b9b9b;
    background-color: #f6f6f6
}

.pagination-wrapper .pagination span a:hover {
    background-color: #e7f7e2
}

.pagination-wrapper .pagination span.current {
    background-color: #5b3;
    color: #fff
}

.pagination-wrapper .pagination span.first,
.pagination-wrapper .pagination span.last {
    display: none
}

.nav-cards {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.nav-cards .nav-card {
    border: 1px solid #eee;
    border-radius: .25rem;
    width: 270px;
    min-height: 150px;
    padding: 16px 20px
}

.nav-cards .nav-card .title {
    font-size: 16px;
    font-size: 1rem;
    font-weight: 700
}

.nav-cards .nav-card .description {
    font-size: 12px;
    font-size: .75rem;
    color: #9b9b9b
}

.nav-cards .nav-card .links {
    margin-top: 20px
}

.nav-cards .nav-card .links a {
    margin-right: 10px
}

.turbolinks-progress-bar {
    background-color: #5b3
}

.tao-form form .form-buttons .button {
    margin: 0 12px 0 0;
    margin: 0 .75rem 0 0
}

.tao-form .form-input .input-content .zr-datatable {
    margin: 0 0 16px
}

.tao-form .form-input .input-content .zr-datatable thead {
    background-color: #f6f6f6
}

.tao-form.narrow form .form-input label.checkbox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 14px;
    font-size: .875rem;
    color: #9b9b9b;
    cursor: pointer
}

.tao-form.narrow form .form-input label.checkbox .boolean-field {
    margin-right: 10px;
    margin-right: .625rem
}

zr-menu-popover.tao-popover>.tao-popover-content {
    padding: 0
}

zr-menu-popover.tao-popover ul {
    list-style: none;
    padding: 0;
    margin: 0;
    min-width: 150px
}

zr-menu-popover.tao-popover ul li {
    margin: 0;
    border-bottom: .5px solid #eee
}

zr-menu-popover.tao-popover ul li:last-child {
    border-bottom: none
}

zr-menu-popover.tao-popover ul li>a {
    display: block;
    padding: 10px 18px;
    color: #4a4a4a
}

zr-menu-popover.tao-popover ul li>a:hover {
    background: #f6f6f6
}

zr-menu-popover.tao-popover ul li>a.warn {
    color: #f75
}

zr-menu-popover.tao-popover .tao-tooltip .tao-popover-content {
    border: 0;
    line-height: 1.5
}

.zr-global-loading .loading-image {
    display: block;
    width: 160px;
    height: 160px;
    margin: 0 auto
}

.zr-global-loading .loading-progress {
    display: none
}

.zr-global-loading .loading-progress .percentage {
    font-size: 32px;
    font-weight: 100;
    color: #9b9b9b;
    text-align: center;
    font-family: PingFangSC
}

.zr-global-loading .loading-progress .progress-bar {
    width: 300px;
    height: 10px;
    background-color: #f6f6f6;
    border-radius: 5px;
    margin: 10px auto 30px
}

.zr-global-loading .loading-progress .progress-bar .progress {
    width: 0;
    height: 100%;
    background-color: #5b3;
    border-radius: 5px;
    -webkit-transition: width .1s;
    transition: width .1s
}

.zr-global-loading .loading-text {
    text-align: center;
    color: #9b9b9b;
    margin: 20px 0 30px;
    font-size: 16px;
    font-size: 1rem
}

.tao-dialog.tao-message-dialog {
    text-align: center
}

.tao-dialog.tao-message-dialog .tao-dialog-wrapper {
    padding: 0
}

.tao-dialog.tao-message-dialog .tao-dialog-wrapper .tao-dialog-content {
    padding: 30px 30px 0
}

.tao-dialog.tao-message-dialog .tao-dialog-wrapper .message-icon .icon {
    height: 155px;
    width: 155px
}

.tao-dialog.tao-message-dialog .tao-dialog-wrapper .message-image img {
    display: block;
    width: 155px;
    margin: 0 auto
}

.tao-dialog.tao-message-dialog .tao-dialog-wrapper .message-title {
    margin-bottom: 10px
}

.tao-dialog.tao-message-dialog .tao-dialog-wrapper .message-content {
    color: #9b9b9b
}

.tao-dialog.tao-message-dialog .tao-dialog-wrapper .tao-dialog-buttons {
    margin: 0;
    padding: 30px 0
}

.zr-wizard {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.zr-wizard .step {
    border-top: 3px solid #eee;
    margin-right: 8px;
    margin-right: .5rem
}

.zr-wizard .step .title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 12px;
    font-size: .75rem;
    color: #ccc;
    margin: 8px 0 0;
    margin: .5rem 0 0
}

.zr-wizard .step .title .number {
    margin: 0 4px 0 0;
    margin: 0 .25rem 0 0
}

.zr-wizard .step .title .number:after {
    content: "."
}

.zr-wizard .step.active {
    border-color: #5b3
}

.zr-wizard .step.active .title {
    color: #5b3
}

.zr-wizard.unordered {
    margin-top: 8px
}

.zr-wizard.unordered .step {
    margin-right: 0;
    border-top-width: 4px;
    border-color: transparent;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative
}

.zr-wizard.unordered .step:before {
    content: "";
    display: block;
    position: absolute;
    top: -4px;
    left: 0;
    width: 100%;
    height: 4px;
    background-color: #eee
}

.zr-wizard.unordered .step .title {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 12px
}

.zr-wizard.unordered .step .title .number {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 16px;
    height: 16px;
    border: 3px solid transparent;
    border-radius: 8px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    top: -10px;
    left: 50%;
    margin: 0 0 0 -8px;
    text-indent: -9999px;
    overflow: hidden
}

.zr-wizard.unordered .step .title .number:after {
    display: block;
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 6px;
    background-color: #eee
}

.zr-wizard.unordered .step:first-child:before {
    width: 50%;
    left: 50%
}

.zr-wizard.unordered .step:last-child:before {
    width: 50%
}

.zr-wizard.unordered .step.active:before {
    background-color: #5b3
}

.zr-wizard.unordered .step.active .title .number {
    border-color: #5b3;
    background-color: #fff
}

.zr-wizard.unordered .step.active .title .number:after {
    border-radius: 3px;
    width: 6px;
    height: 6px;
    background-color: #5b3
}

.zr-wizard.ordered .step {
    border-top: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 40px
}

.zr-wizard.ordered .step:hover .number {
    background: #666
}

.zr-wizard.ordered .step:hover .name {
    color: #4a4a4a
}

.zr-wizard.ordered .step.active .number {
    background: #5b3
}

.zr-wizard.ordered .step.active .name {
    color: #5b3
}

.zr-wizard.ordered .step .number {
    background: #9b9b9b;
    border-radius: 50%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    height: 20px;
    width: 20px;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0 8px 0 0
}

.zr-wizard.ordered .step .number:after {
    content: " "
}

.zr-wizard.ordered .step .name {
    font-size: 14px;
    font-size: .875rem;
    color: #9b9b9b
}

.zr-wizard.ordered .step:after {
    display: block;
    content: " ";
    width: 30px;
    height: 2px;
    margin: 0 10px;
    background: #f6f6f6
}

.zr-wizard.ordered .step:last-child:after {
    display: none
}


/*!
 * Copyright (c) Handsoncode sp. z o.o.
 * 
 * This Handsontable Pro is a commercial software distributed by Handsoncode sp. z o. o., a limited liability
 * company registered under the laws of Poland, with its registered office in Gdynia, Poland, at 96/98 Aleja Zwycięstwa,
 * postal code 81-451, entered into the Entrepreneurs Register of the National Court Register under number 0000538651,
 * share capital: PLN 62,800.00., hereinafter referred to as "HANDSONCODE".
 * 
 * By installing, copying, or otherwise using this software, you agree to be bound by the terms
 * of its General Software License Terms ("Terms") outlined in a file "handsontable-pro-general-terms.pdf"
 * available in the main directory of the software repository.
 * This software is copyrighted and protected by copyright laws and international treaties.
 * 
 * You shall obtain a commercial license for this software at handsontable.com.
 * 
 * YOU EXPRESSLY ACKNOWLEDGE AND AGREE THAT USE OF THE SOFTWARE IS AT YOUR OWN RISK AND THAT THE SOFTWARE
 * IS PROVIDED "AS IS" WITHOUT ANY WARRANTIES OR CONDITIONS WHATSOEVER. HANDSONCODE EXPRESSLY DISCLAIMS ANY WARRANTY,
 * EXPRESS OR IMPLIED, INCLUDING, WITHOUT LIMITATION, THE IMPLIED WARRANTIES OF MERCHANTABILITY,
 * FITNESS FOR A PARTICULAR PURPOSE, OR NON-INFRINGMENT. HANDSONCODE DOES NOT WARRANT THAT THE SOFTWARE AND ITS FUNCTIONALITY,
 * RELIABILITY AND PERFORMANCE WILL MEET YOUR REQUIREMENTS OR THAT THE OPERATION OF THE SOFTWARE WILL BE
 * UNINTERRUPTED OR ERROR FREE.
 * 
 * Version: 1.17.0
 * Release date: 01/03/2018 (built at 01/03/2018 13:53:40)
 */

.handsontable .table td,
.handsontable .table th {
    border-top: none
}

.handsontable tr {
    background: #fff
}

.handsontable td {
    background-color: inherit
}

.handsontable .table caption+thead tr:first-child td,
.handsontable .table caption+thead tr:first-child th,
.handsontable .table colgroup+thead tr:first-child td,
.handsontable .table colgroup+thead tr:first-child th,
.handsontable .table thead:first-child tr:first-child td,
.handsontable .table thead:first-child tr:first-child th {
    border-top: 1px solid #ccc
}

.handsontable .table-bordered {
    border: 0;
    border-collapse: separate
}

.handsontable .table-bordered td,
.handsontable .table-bordered th {
    border-left: none
}

.handsontable .table-bordered td:first-child,
.handsontable .table-bordered th:first-child {
    border-left: 1px solid #ccc
}

.handsontable .table>tbody>tr>td,
.handsontable .table>tbody>tr>th,
.handsontable .table>tfoot>tr>td,
.handsontable .table>tfoot>tr>th,
.handsontable .table>thead>tr>td,
.handsontable .table>thead>tr>th {
    line-height: 21px;
    padding: 0 4px
}

.col-lg-1.handsontable,
.col-lg-2.handsontable,
.col-lg-3.handsontable,
.col-lg-4.handsontable,
.col-lg-5.handsontable,
.col-lg-6.handsontable,
.col-lg-7.handsontable,
.col-lg-8.handsontable,
.col-lg-9.handsontable,
.col-lg-10.handsontable,
.col-lg-11.handsontable,
.col-lg-12.handsontable,
.col-md-1.handsontable,
.col-md-2.handsontable,
.col-md-3.handsontable,
.col-md-4.handsontable,
.col-md-5.handsontable,
.col-md-6.handsontable,
.col-md-7.handsontable,
.col-md-8.handsontable,
.col-md-9.handsontable .col-sm-1.handsontable,
.col-md-10.handsontable,
.col-md-11.handsontable,
.col-md-12.handsontable,
.col-sm-2.handsontable,
.col-sm-3.handsontable,
.col-sm-4.handsontable,
.col-sm-5.handsontable,
.col-sm-6.handsontable,
.col-sm-7.handsontable,
.col-sm-8.handsontable,
.col-sm-9.handsontable .col-xs-1.handsontable,
.col-sm-10.handsontable,
.col-sm-11.handsontable,
.col-sm-12.handsontable,
.col-xs-2.handsontable,
.col-xs-3.handsontable,
.col-xs-4.handsontable,
.col-xs-5.handsontable,
.col-xs-6.handsontable,
.col-xs-7.handsontable,
.col-xs-8.handsontable,
.col-xs-9.handsontable,
.col-xs-10.handsontable,
.col-xs-11.handsontable,
.col-xs-12.handsontable {
    padding-left: 0;
    padding-right: 0
}

.handsontable .table-striped>tbody>tr:nth-of-type(2n) {
    background-color: #fff
}

.handsontable {
    position: relative
}

.handsontable .hide {
    display: none
}

.handsontable .relative {
    position: relative
}

.handsontable.htAutoSize {
    visibility: hidden;
    left: -99000px;
    position: absolute;
    top: -99000px
}

.handsontable .wtHider {
    width: 0
}

.handsontable .wtSpreader {
    position: relative;
    width: 0;
    height: auto
}

.handsontable div,
.handsontable input,
.handsontable table,
.handsontable tbody,
.handsontable td,
.handsontable textarea,
.handsontable th,
.handsontable thead {
    box-sizing: content-box;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box
}

.handsontable input,
.handsontable textarea {
    min-height: 0
}

.handsontable table.htCore {
    border-collapse: separate;
    border-spacing: 0;
    margin: 0;
    border-width: 0;
    table-layout: fixed;
    width: 0;
    outline-width: 0;
    max-width: none;
    max-height: none
}

.handsontable col,
.handsontable col.rowHeader {
    width: 50px
}

.handsontable td,
.handsontable th {
    border-top-width: 0;
    border-left-width: 0;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    height: 22px;
    empty-cells: show;
    line-height: 21px;
    padding: 0 4px;
    background-color: #fff;
    vertical-align: top;
    overflow: hidden;
    outline-width: 0;
    white-space: pre-line;
    background-clip: padding-box
}

.handsontable td.htInvalid {
    background-color: #ff4c42!important
}

.handsontable td.htNoWrap {
    white-space: nowrap
}

.handsontable th:last-child {
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc
}

.handsontable th.htNoFrame,
.handsontable th:first-child.htNoFrame,
.handsontable tr:first-child th.htNoFrame {
    border-left-width: 0;
    background-color: #fff;
    border-color: #fff
}

.handsontable .htNoFrame+td,
.handsontable .htNoFrame+th,
.handsontable.htRowHeaders thead tr th:nth-child(2),
.handsontable td:first-of-type,
.handsontable th:first-child,
.handsontable th:nth-child(2) {
    border-left: 1px solid #ccc
}

.handsontable tr:first-child td,
.handsontable tr:first-child th {
    border-top: 1px solid #ccc
}

.ht_master:not(.innerBorderLeft):not(.emptyColumns)~.handsontable:not(.ht_clone_top) thead tr th:first-child,
.ht_master:not(.innerBorderLeft):not(.emptyColumns)~.handsontable tbody tr th {
    border-right-width: 0
}

.ht_master:not(.innerBorderTop) thead tr.lastChild th,
.ht_master:not(.innerBorderTop) thead tr:last-child th,
.ht_master:not(.innerBorderTop)~.handsontable thead tr.lastChild th,
.ht_master:not(.innerBorderTop)~.handsontable thead tr:last-child th {
    border-bottom-width: 0
}

.handsontable th {
    background-color: #f3f3f3;
    color: #222;
    text-align: center;
    font-weight: 400;
    white-space: nowrap
}

.handsontable thead th {
    padding: 0
}

.handsontable th.active {
    background-color: #ccc
}

.handsontable thead th .relative {
    padding: 2px 4px
}

.handsontable tbody th.ht__highlight,
.handsontable thead th.ht__highlight {
    background-color: #dcdcdc
}

.handsontable.ht__selection--columns thead th.ht__highlight,
.handsontable.ht__selection--rows tbody th.ht__highlight {
    background-color: #8eb0e7;
    color: #000
}

#hot-display-license-info {
    font-size: 9px;
    color: #323232;
    padding: 5px 0 3px;
    font-family: Helvetica, Arial, sans-serif;
    text-align: left
}

.handsontable .manualColumnResizer {
    position: fixed;
    top: 0;
    cursor: col-resize;
    z-index: 110;
    width: 5px;
    height: 25px
}

.handsontable .manualRowResizer {
    position: fixed;
    left: 0;
    cursor: row-resize;
    z-index: 110;
    height: 5px;
    width: 50px
}

.handsontable .manualColumnResizer.active,
.handsontable .manualColumnResizer:hover,
.handsontable .manualRowResizer.active,
.handsontable .manualRowResizer:hover {
    background-color: #aab
}

.handsontable .manualColumnResizerGuide {
    position: fixed;
    right: 0;
    top: 0;
    background-color: #aab;
    display: none;
    width: 0;
    border-right: 1px dashed #777;
    margin-left: 5px
}

.handsontable .manualRowResizerGuide {
    position: fixed;
    left: 0;
    bottom: 0;
    background-color: #aab;
    display: none;
    height: 0;
    border-bottom: 1px dashed #777;
    margin-top: 5px
}

.handsontable .manualColumnResizerGuide.active,
.handsontable .manualRowResizerGuide.active {
    display: block;
    z-index: 199
}

.handsontable .columnSorting {
    position: relative
}

.handsontable .columnSorting:hover {
    text-decoration: underline;
    cursor: pointer
}

.handsontable .columnSorting.ascending:after {
    content: "\25B2";
    color: #5f5f5f;
    position: absolute;
    right: -15px
}

.handsontable .columnSorting.descending:after {
    content: "\25BC";
    color: #5f5f5f;
    position: absolute;
    right: -15px
}

.handsontable .wtBorder {
    position: absolute;
    font-size: 0
}

.handsontable .wtBorder.hidden {
    display: none!important
}

.handsontable td.area,
.handsontable td.area-1,
.handsontable td.area-2,
.handsontable td.area-3,
.handsontable td.area-4,
.handsontable td.area-5,
.handsontable td.area-6,
.handsontable td.area-7 {
    position: relative
}

.handsontable td.area-1:before,
.handsontable td.area-2:before,
.handsontable td.area-3:before,
.handsontable td.area-4:before,
.handsontable td.area-5:before,
.handsontable td.area-6:before,
.handsontable td.area-7:before,
.handsontable td.area:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    bottom: -100%\9;
    background: #005eff
}

@media (-ms-high-contrast:none),
screen and (-ms-high-contrast:active) {
    .handsontable td.area-1:before,
    .handsontable td.area-2:before,
    .handsontable td.area-3:before,
    .handsontable td.area-4:before,
    .handsontable td.area-5:before,
    .handsontable td.area-6:before,
    .handsontable td.area-7:before,
    .handsontable td.area:before {
        bottom: -100%
    }
}

.handsontable td.area:before {
    opacity: .1
}

.handsontable td.area-1:before {
    opacity: .2
}

.handsontable td.area-2:before {
    opacity: .27
}

.handsontable td.area-3:before {
    opacity: .35
}

.handsontable td.area-4:before {
    opacity: .41
}

.handsontable td.area-5:before {
    opacity: .47
}

.handsontable td.area-6:before {
    opacity: .54
}

.handsontable td.area-7:before {
    opacity: .58
}

.handsontable .wtBorder.corner {
    font-size: 0;
    cursor: crosshair
}

.handsontable .htBorder.htFillBorder {
    background: red;
    width: 1px;
    height: 1px
}

.handsontableInput {
    border: none;
    outline-width: 0;
    margin: 0;
    padding: 1px 5px 0;
    font-family: inherit;
    line-height: 21px;
    font-size: inherit;
    -webkit-box-shadow: 0 0 0 2px #5292f7 inset;
    box-shadow: inset 0 0 0 2px #5292f7;
    resize: none;
    display: block;
    color: #000;
    border-radius: 0;
    background-color: #fff
}

.handsontableInputHolder {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100
}

.htSelectEditor {
    -webkit-appearance: menulist-button!important;
    position: absolute;
    width: auto
}

.handsontable .htDimmed {
    color: #777
}

.handsontable .htSubmenu {
    position: relative
}

.handsontable .htSubmenu :after {
    content: "\25B6";
    color: #777;
    position: absolute;
    right: 5px
}

.handsontable .htLeft {
    text-align: left
}

.handsontable .htCenter {
    text-align: center
}

.handsontable .htRight {
    text-align: right
}

.handsontable .htJustify {
    text-align: justify
}

.handsontable .htTop {
    vertical-align: top
}

.handsontable .htMiddle {
    vertical-align: middle
}

.handsontable .htBottom {
    vertical-align: bottom
}

.handsontable .htPlaceholder {
    color: #999
}

.handsontable .htAutocompleteArrow {
    float: right;
    font-size: 10px;
    color: #eee;
    cursor: default;
    width: 16px;
    text-align: center
}

.handsontable td .htAutocompleteArrow:hover {
    color: #777
}

.handsontable td.area .htAutocompleteArrow {
    color: #d3d3d3
}

.handsontable .htCheckboxRendererInput {
    display: inline-block
}

.handsontable .htCheckboxRendererInput.noValue {
    opacity: .5
}

.handsontable .htCheckboxRendererLabel {
    cursor: pointer;
    display: inline-block;
    width: 100%
}

@-webkit-keyframes opacity-hide {
    0% {
        opacity: 1
    }
    to {
        opacity: 0
    }
}

@keyframes opacity-hide {
    0% {
        opacity: 1
    }
    to {
        opacity: 0
    }
}

@-webkit-keyframes opacity-show {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@keyframes opacity-show {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

.handsontable .handsontable.ht_clone_top .wtHider {
    padding: 0 0 5px
}

.handsontable .autocompleteEditor.handsontable {
    padding-right: 17px
}

.handsontable .autocompleteEditor.handsontable.htMacScroll {
    padding-right: 15px
}

.handsontable.listbox {
    margin: 0
}

.handsontable.listbox .ht_master table {
    border: 1px solid #ccc;
    border-collapse: separate;
    background: #fff
}

.handsontable.listbox td,
.handsontable.listbox th,
.handsontable.listbox tr:first-child td,
.handsontable.listbox tr:first-child th,
.handsontable.listbox tr:last-child th {
    border-color: transparent
}

.handsontable.listbox td,
.handsontable.listbox th {
    white-space: nowrap;
    text-overflow: ellipsis
}

.handsontable.listbox td.htDimmed {
    cursor: default;
    color: inherit;
    font-style: inherit
}

.handsontable.listbox .wtBorder {
    visibility: hidden
}

.handsontable.listbox tr:hover td,
.handsontable.listbox tr td.current {
    background: #eee
}

.ht_clone_top {
    z-index: 101
}

.ht_clone_left {
    z-index: 102
}

.ht_clone_bottom_left_corner,
.ht_clone_debug,
.ht_clone_top_left_corner {
    z-index: 103
}

.handsontable td.htSearchResult {
    background: #fcedd9;
    color: #583707
}

.htBordered {
    border-width: 1px
}

.htBordered.htTopBorderSolid {
    border-top-style: solid;
    border-top-color: #000
}

.htBordered.htRightBorderSolid {
    border-right-style: solid;
    border-right-color: #000
}

.htBordered.htBottomBorderSolid {
    border-bottom-style: solid;
    border-bottom-color: #000
}

.htBordered.htLeftBorderSolid {
    border-left-style: solid;
    border-left-color: #000
}

.handsontable tbody tr th:nth-last-child(2) {
    border-right: 1px solid #ccc
}

.handsontable thead tr:nth-last-child(2) th.htGroupIndicatorContainer {
    border-bottom: 1px solid #ccc;
    padding-bottom: 5px
}

.ht_clone_top_left_corner thead tr th:nth-last-child(2) {
    border-right: 1px solid #ccc
}

.htCollapseButton {
    width: 10px;
    height: 10px;
    line-height: 10px;
    text-align: center;
    border-radius: 5px;
    border: 1px solid #f3f3f3;
    -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, .4);
    box-shadow: 1px 1px 3px rgba(0, 0, 0, .4);
    cursor: pointer;
    margin-bottom: 3px;
    position: relative
}

.htCollapseButton:after {
    content: "";
    height: 300%;
    width: 1px;
    display: block;
    background: #ccc;
    margin-left: 4px;
    position: absolute;
    bottom: 10px
}

thead .htCollapseButton {
    right: 5px;
    position: absolute;
    top: 5px;
    background: #fff
}

thead .htCollapseButton:after {
    height: 1px;
    width: 700%;
    right: 10px;
    top: 4px
}

.handsontable tr th .htExpandButton {
    position: absolute;
    width: 10px;
    height: 10px;
    line-height: 10px;
    text-align: center;
    border-radius: 5px;
    border: 1px solid #f3f3f3;
    -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, .4);
    box-shadow: 1px 1px 3px rgba(0, 0, 0, .4);
    cursor: pointer;
    top: 0;
    display: none
}

.handsontable thead tr th .htExpandButton {
    top: 5px
}

.handsontable tr th .htExpandButton.clickable {
    display: block
}

.collapsibleIndicator {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 5px;
    border: 1px solid #a6a6a6;
    line-height: 10px;
    color: #222;
    border-radius: 10px;
    font-size: 10px;
    width: 10px;
    height: 10px;
    cursor: pointer;
    -webkit-box-shadow: 0 0 0 6px #eee;
    box-shadow: 0 0 0 6px #eee;
    background: #eee
}

.handsontable col.hidden {
    width: 0!important
}

.handsontable table tr th.lightRightBorder {
    border-right: 1px solid #e6e6e6
}

.handsontable tr.hidden,
.handsontable tr.hidden td,
.handsontable tr.hidden th {
    display: none
}

.ht_clone_bottom,
.ht_clone_left,
.ht_clone_top,
.ht_master {
    overflow: hidden
}

.ht_master .wtHolder {
    overflow: auto
}

.ht_clone_left .wtHolder {
    overflow-x: hidden;
    overflow-y: auto
}

.ht_clone_bottom .wtHolder,
.ht_clone_top .wtHolder {
    overflow-x: auto;
    overflow-y: hidden
}

.wtDebugHidden {
    display: none
}

.wtDebugVisible {
    display: block;
    -webkit-animation-duration: .5s;
    -webkit-animation-name: wtFadeInFromNone;
    animation-duration: .5s;
    animation-name: wtFadeInFromNone
}

@keyframes wtFadeInFromNone {
    0% {
        display: none;
        opacity: 0
    }
    1% {
        display: block;
        opacity: 0
    }
    to {
        display: block;
        opacity: 1
    }
}

@-webkit-keyframes wtFadeInFromNone {
    0% {
        display: none;
        opacity: 0
    }
    1% {
        display: block;
        opacity: 0
    }
    to {
        display: block;
        opacity: 1
    }
}

.handsontable.mobile,
.handsontable.mobile .wtHolder {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-overflow-scrolling: touch
}

.htMobileEditorContainer {
    display: none;
    position: absolute;
    top: 0;
    width: 70%;
    height: 54pt;
    background: #f8f8f8;
    border-radius: 20px;
    border: 1px solid #ebebeb;
    z-index: 999;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -webkit-text-size-adjust: none
}

.topLeftSelectionHandle-HitArea:not(.ht_master .topLeftSelectionHandle-HitArea),
.topLeftSelectionHandle:not(.ht_master .topLeftSelectionHandle) {
    z-index: 9999
}

.bottomRightSelectionHandle,
.bottomRightSelectionHandle-HitArea,
.topLeftSelectionHandle,
.topLeftSelectionHandle-HitArea {
    left: -10000px;
    top: -10000px
}

.htMobileEditorContainer.active {
    display: block
}

.htMobileEditorContainer .inputs {
    position: absolute;
    right: 210pt;
    bottom: 10pt;
    top: 10pt;
    left: 14px;
    height: 34pt
}

.htMobileEditorContainer .inputs textarea {
    font-size: 13pt;
    border: 1px solid #a1a1a1;
    -webkit-appearance: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    position: absolute;
    left: 14px;
    right: 14px;
    top: 0;
    bottom: 0;
    padding: 7pt
}

.htMobileEditorContainer .cellPointer {
    position: absolute;
    top: -13pt;
    height: 0;
    width: 0;
    left: 30px;
    border-left: 13pt solid transparent;
    border-right: 13pt solid transparent;
    border-bottom: 13pt solid #ebebeb
}

.htMobileEditorContainer .cellPointer.hidden {
    display: none
}

.htMobileEditorContainer .cellPointer:before {
    content: "";
    display: block;
    position: absolute;
    top: 2px;
    height: 0;
    width: 0;
    left: -13pt;
    border-left: 13pt solid transparent;
    border-right: 13pt solid transparent;
    border-bottom: 13pt solid #f8f8f8
}

.htMobileEditorContainer .moveHandle {
    position: absolute;
    top: 10pt;
    left: 5px;
    width: 30px;
    bottom: 0;
    cursor: move;
    z-index: 9999
}

.htMobileEditorContainer .moveHandle:after {
    content: "..\A..\A..\A..";
    white-space: pre;
    line-height: 10px;
    font-size: 20pt;
    display: inline-block;
    margin-top: -8px;
    color: #ebebeb
}

.htMobileEditorContainer .positionControls {
    width: 205pt;
    position: absolute;
    right: 5pt;
    top: 0;
    bottom: 0
}

.htMobileEditorContainer .positionControls>div {
    width: 50pt;
    height: 100%;
    float: left
}

.htMobileEditorContainer .positionControls>div:after {
    content: " ";
    display: block;
    width: 15pt;
    height: 15pt;
    text-align: center;
    line-height: 50pt
}

.htMobileEditorContainer .downButton:after,
.htMobileEditorContainer .leftButton:after,
.htMobileEditorContainer .rightButton:after,
.htMobileEditorContainer .upButton:after {
    transform-origin: 5pt 5pt;
    -webkit-transform-origin: 5pt 5pt;
    margin: 21pt 0 0 21pt
}

.htMobileEditorContainer .leftButton:after {
    border-top: 2px solid #288ffe;
    border-left: 2px solid #288ffe;
    -webkit-transform: rotate(-45deg)
}

.htMobileEditorContainer .leftButton:active:after {
    border-color: #cfcfcf
}

.htMobileEditorContainer .rightButton:after {
    border-top: 2px solid #288ffe;
    border-left: 2px solid #288ffe;
    -webkit-transform: rotate(135deg)
}

.htMobileEditorContainer .rightButton:active:after {
    border-color: #cfcfcf
}

.htMobileEditorContainer .upButton:after {
    border-top: 2px solid #288ffe;
    border-left: 2px solid #288ffe;
    -webkit-transform: rotate(45deg)
}

.htMobileEditorContainer .upButton:active:after {
    border-color: #cfcfcf
}

.htMobileEditorContainer .downButton:after {
    border-top: 2px solid #288ffe;
    border-left: 2px solid #288ffe;
    -webkit-transform: rotate(225deg)
}

.htMobileEditorContainer .downButton:active:after {
    border-color: #cfcfcf
}

.handsontable.hide-tween {
    -webkit-animation: opacity-hide .3s;
    animation: opacity-hide .3s;
    animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards
}

.handsontable.show-tween {
    -webkit-animation: opacity-show .3s;
    animation: opacity-show .3s;
    animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards
}


/*!
 * Pikaday
 * Copyright © 2014 David Bushell | BSD & MIT license | http://dbushell.com/
 */

.pika-single {
    z-index: 9999;
    display: block;
    position: relative;
    color: #333;
    background: #fff;
    border: 1px solid #ccc;
    border-bottom-color: #bbb;
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif
}

.pika-single:after,
.pika-single:before {
    content: " ";
    display: table
}

.pika-single:after {
    clear: both
}

.pika-single {
    *zoom: 1
}

.pika-single.is-hidden {
    display: none
}

.pika-single.is-bound {
    position: absolute;
    -webkit-box-shadow: 0 5px 15px -5px rgba(0, 0, 0, .5);
    box-shadow: 0 5px 15px -5px rgba(0, 0, 0, .5)
}

.pika-lendar {
    float: left;
    width: 240px;
    margin: 8px
}

.pika-title {
    position: relative;
    text-align: center
}

.pika-label {
    display: inline-block;
    *display: inline;
    position: relative;
    z-index: 9999;
    overflow: hidden;
    margin: 0;
    padding: 5px 3px;
    font-size: 14px;
    line-height: 20px;
    font-weight: 700;
    background-color: #fff
}

.pika-title select {
    cursor: pointer;
    position: absolute;
    z-index: 9998;
    margin: 0;
    left: 0;
    top: 5px;
    filter: alpha(opacity=0);
    opacity: 0
}

.pika-next,
.pika-prev {
    display: block;
    cursor: pointer;
    position: relative;
    outline: none;
    border: 0;
    padding: 0;
    width: 20px;
    height: 30px;
    text-indent: 20px;
    white-space: nowrap;
    overflow: hidden;
    background-color: transparent;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 75% 75%;
    opacity: .5;
    *position: absolute;
    *top: 0
}

.pika-next:hover,
.pika-prev:hover {
    opacity: 1
}

.is-rtl .pika-next,
.pika-prev {
    float: left;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAUklEQVR42u3VMQoAIBADQf8Pgj+OD9hG2CtONJB2ymQkKe0HbwAP0xucDiQWARITIDEBEnMgMQ8S8+AqBIl6kKgHiXqQqAeJepBo/z38J/U0uAHlaBkBl9I4GwAAAABJRU5ErkJggg==");
    *left: 0
}

.is-rtl .pika-prev,
.pika-next {
    float: right;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAU0lEQVR42u3VOwoAMAgE0dwfAnNjU26bYkBCFGwfiL9VVWoO+BJ4Gf3gtsEKKoFBNTCoCAYVwaAiGNQGMUHMkjGbgjk2mIONuXo0nC8XnCf1JXgArVIZAQh5TKYAAAAASUVORK5CYII=");
    *right: 0
}

.pika-next.is-disabled,
.pika-prev.is-disabled {
    cursor: default;
    opacity: .2
}

.pika-select {
    display: inline-block;
    *display: inline
}

.pika-table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    border: 0
}

.pika-table td,
.pika-table th {
    width: 14.285714285714286%;
    padding: 0
}

.pika-table th {
    color: #999;
    font-size: 12px;
    line-height: 25px;
    font-weight: 700;
    text-align: center
}

.pika-button {
    cursor: pointer;
    display: block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    outline: none;
    border: 0;
    margin: 0;
    width: 100%;
    padding: 5px;
    color: #666;
    font-size: 12px;
    line-height: 15px;
    text-align: right;
    background: #f5f5f5
}

.pika-week {
    font-size: 11px;
    color: #999
}

.is-today .pika-button {
    color: #3af;
    font-weight: 700
}

.is-selected .pika-button {
    color: #fff;
    font-weight: 700;
    background: #3af;
    -webkit-box-shadow: inset 0 1px 3px #178fe5;
    box-shadow: inset 0 1px 3px #178fe5;
    border-radius: 3px
}

.is-inrange .pika-button {
    background: #d5e9f7
}

.is-startrange .pika-button {
    background: #6cb31d
}

.is-endrange .pika-button,
.is-startrange .pika-button {
    color: #fff;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 3px
}

.is-endrange .pika-button {
    background: #3af
}

.is-disabled .pika-button,
.is-outside-current-month .pika-button {
    pointer-events: none;
    cursor: default;
    color: #999;
    opacity: .3
}

.pika-button:hover {
    color: #fff;
    background: #ff8000;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 3px
}

.pika-table abbr {
    border-bottom: none;
    cursor: help
}

.htCommentCell {
    position: relative
}

.htCommentCell:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    border-left: 6px solid transparent;
    border-top: 6px solid #000
}

.htComments {
    display: none;
    z-index: 1059;
    position: absolute
}

.htCommentTextArea {
    -webkit-box-shadow: rgba(0, 0, 0, .117647) 0 1px 3px, rgba(0, 0, 0, .239216) 0 1px 2px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .117647), 0 1px 2px rgba(0, 0, 0, .239216);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: none;
    border-left: 3px solid #ccc;
    background-color: #fff;
    width: 215px;
    height: 90px;
    font-size: 12px;
    padding: 5px;
    outline: 0!important;
    -webkit-appearance: none
}

.htCommentTextArea:focus {
    -webkit-box-shadow: rgba(0, 0, 0, .117647) 0 1px 3px, rgba(0, 0, 0, .239216) 0 1px 2px, inset 0 0 0 1px #5292f7;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .117647), 0 1px 2px rgba(0, 0, 0, .239216), inset 0 0 0 1px #5292f7;
    border-left: 3px solid #5292f7
}


/*!
 * Handsontable ContextMenu
 */

.htContextMenu {
    display: none;
    position: absolute;
    z-index: 1060
}

.htContextMenu .ht_clone_corner,
.htContextMenu .ht_clone_debug,
.htContextMenu .ht_clone_left,
.htContextMenu .ht_clone_top {
    display: none
}

.htContextMenu table.htCore {
    border: 1px solid #ccc;
    border-bottom-width: 2px;
    border-right-width: 2px
}

.htContextMenu .wtBorder {
    visibility: hidden
}

.htContextMenu table tbody tr td {
    background: #fff;
    border-width: 0;
    padding: 4px 6px 0;
    cursor: pointer;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.htContextMenu table tbody tr td:first-child {
    border: 0
}

.htContextMenu table tbody tr td.htDimmed {
    font-style: normal;
    color: #323232
}

.htContextMenu table tbody tr td.current,
.htContextMenu table tbody tr td.zeroclipboard-is-hover {
    background: #f3f3f3
}

.htContextMenu table tbody tr td.htSeparator {
    border-top: 1px solid #bbb;
    height: 0;
    padding: 0;
    cursor: default
}

.htContextMenu table tbody tr td.htDisabled {
    color: #999;
    cursor: default
}

.htContextMenu table tbody tr td.htDisabled:hover {
    background: #fff;
    color: #999;
    cursor: default
}

.htContextMenu table tbody tr.htHidden {
    display: none
}

.htContextMenu table tbody tr td .htItemWrapper {
    margin-left: 10px;
    margin-right: 6px
}

.htContextMenu table tbody tr td div span.selected {
    margin-top: -2px;
    position: absolute;
    left: 4px
}

.htContextMenu .ht_master .wtHolder {
    overflow: hidden
}

textarea#HandsontableCopyPaste {
    position: fixed!important;
    top: 0!important;
    right: 100%!important;
    overflow: hidden;
    opacity: 0;
    outline: 0 none!important
}

.htRowHeaders .ht_master.innerBorderLeft~.ht_clone_left td:first-of-type,
.htRowHeaders .ht_master.innerBorderLeft~.ht_clone_top_left_corner th:nth-child(2) {
    border-left: 0 none
}

.handsontable.ht__manualColumnMove.after-selection--columns thead th.ht__highlight {
    cursor: move;
    cursor: -webkit-grab;
    cursor: grab
}

.handsontable.ht__manualColumnMove.on-moving--columns,
.handsontable.ht__manualColumnMove.on-moving--columns thead th.ht__highlight {
    cursor: move;
    cursor: -webkit-grabbing;
    cursor: grabbing
}

.handsontable.ht__manualColumnMove.on-moving--columns .manualColumnResizer {
    display: none
}

.handsontable .ht__manualColumnMove--backlight,
.handsontable .ht__manualColumnMove--guideline {
    position: absolute;
    height: 100%;
    display: none
}

.handsontable .ht__manualColumnMove--guideline {
    background: #757575;
    width: 2px;
    top: 0;
    margin-left: -1px;
    z-index: 105
}

.handsontable .ht__manualColumnMove--backlight {
    background: #343434;
    background: rgba(52, 52, 52, .25);
    display: none;
    z-index: 105;
    pointer-events: none
}

.handsontable.on-moving--columns .ht__manualColumnMove--backlight,
.handsontable.on-moving--columns.show-ui .ht__manualColumnMove--guideline {
    display: block
}

.handsontable .wtHider {
    position: relative
}

.handsontable.ht__manualRowMove.after-selection--rows tbody th.ht__highlight {
    cursor: move;
    cursor: -webkit-grab;
    cursor: grab
}

.handsontable.ht__manualRowMove.on-moving--rows,
.handsontable.ht__manualRowMove.on-moving--rows tbody th.ht__highlight {
    cursor: move;
    cursor: -webkit-grabbing;
    cursor: grabbing
}

.handsontable.ht__manualRowMove.on-moving--rows .manualRowResizer {
    display: none
}

.handsontable .ht__manualRowMove--backlight,
.handsontable .ht__manualRowMove--guideline {
    position: absolute;
    width: 100%;
    display: none
}

.handsontable .ht__manualRowMove--guideline {
    background: #757575;
    height: 2px;
    left: 0;
    margin-top: -1px;
    z-index: 105
}

.handsontable .ht__manualRowMove--backlight {
    background: #343434;
    background: rgba(52, 52, 52, .25);
    display: none;
    z-index: 105;
    pointer-events: none
}

.handsontable.on-moving--rows .ht__manualRowMove--backlight,
.handsontable.on-moving--rows.show-ui .ht__manualRowMove--guideline {
    display: block
}

.handsontable.ht__selection--columns tbody td[colspan][class*=area][class*=highlight]:before,
.handsontable.ht__selection--rows tbody td[rowspan][class*=area][class*=highlight]:before {
    background: inherit
}


/*!
 * Handsontable DropdownMenu
 */

.handsontable .changeType {
    background: #eee;
    border-radius: 2px;
    border: 1px solid #bbb;
    color: #bbb;
    font-size: 9px;
    line-height: 9px;
    padding: 2px;
    margin: 3px 1px 0 5px;
    float: right
}

.handsontable .changeType:before {
    content: "\25BC     "
}

.handsontable .changeType:hover {
    border: 1px solid #777;
    color: #777;
    cursor: pointer
}

.htDropdownMenu {
    display: none;
    position: absolute;
    z-index: 1060
}

.htDropdownMenu .ht_clone_corner,
.htDropdownMenu .ht_clone_debug,
.htDropdownMenu .ht_clone_left,
.htDropdownMenu .ht_clone_top {
    display: none
}

.htDropdownMenu table.htCore {
    border: 1px solid #bbb;
    border-bottom-width: 2px;
    border-right-width: 2px
}

.htDropdownMenu .wtBorder {
    visibility: hidden
}

.htDropdownMenu table tbody tr td {
    background: #fff;
    border-width: 0;
    padding: 4px 6px 0;
    cursor: pointer;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.htDropdownMenu table tbody tr td:first-child {
    border: 0
}

.htDropdownMenu table tbody tr td.htDimmed {
    font-style: normal;
    color: #323232
}

.htDropdownMenu table tbody tr td.current,
.htDropdownMenu table tbody tr td.zeroclipboard-is-hover {
    background: #e9e9e9
}

.htDropdownMenu table tbody tr td.htSeparator {
    border-top: 1px solid #bbb;
    height: 0;
    padding: 0;
    cursor: default
}

.htDropdownMenu table tbody tr td.htDisabled {
    color: #999
}

.htDropdownMenu table tbody tr td.htDisabled:hover {
    background: #fff;
    color: #999;
    cursor: default
}

.htDropdownMenu table tbody tr.htHidden {
    display: none
}

.htDropdownMenu table tbody tr td .htItemWrapper {
    margin-left: 10px;
    margin-right: 6px
}

.htDropdownMenu table tbody tr td div span.selected {
    margin-top: -2px;
    position: absolute;
    left: 4px
}

.htDropdownMenu .ht_master .wtHolder {
    overflow: hidden
}


/*!
 * Handsontable Filters
 */

.htFiltersConditionsMenu {
    display: none;
    position: absolute;
    z-index: 1070
}

.htFiltersConditionsMenu .ht_clone_corner,
.htFiltersConditionsMenu .ht_clone_debug,
.htFiltersConditionsMenu .ht_clone_left,
.htFiltersConditionsMenu .ht_clone_top {
    display: none
}

.htFiltersConditionsMenu table.htCore {
    border: 1px solid #bbb;
    border-bottom-width: 2px;
    border-right-width: 2px
}

.htFiltersConditionsMenu .wtBorder {
    visibility: hidden
}

.htFiltersConditionsMenu table tbody tr td {
    background: #fff;
    border-width: 0;
    padding: 4px 6px 0;
    cursor: pointer;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.htFiltersConditionsMenu table tbody tr td:first-child {
    border: 0
}

.htFiltersConditionsMenu table tbody tr td.htDimmed {
    font-style: normal;
    color: #323232
}

.htFiltersConditionsMenu table tbody tr td.current,
.htFiltersConditionsMenu table tbody tr td.zeroclipboard-is-hover {
    background: #e9e9e9
}

.htFiltersConditionsMenu table tbody tr td.htSeparator {
    border-top: 1px solid #bbb;
    height: 0;
    padding: 0
}

.htFiltersConditionsMenu table tbody tr td.htDisabled {
    color: #999
}

.htFiltersConditionsMenu table tbody tr td.htDisabled:hover {
    background: #fff;
    color: #999;
    cursor: default
}

.htFiltersConditionsMenu table tbody tr td .htItemWrapper {
    margin-left: 10px;
    margin-right: 6px
}

.htFiltersConditionsMenu table tbody tr td div span.selected {
    margin-top: -2px;
    position: absolute;
    left: 4px
}

.htFiltersConditionsMenu .ht_master .wtHolder {
    overflow: hidden
}

.handsontable .htMenuFiltering {
    border-bottom: 1px dotted #ccc;
    height: 135px;
    overflow: hidden
}

.handsontable .ht_master table td.htCustomMenuRenderer {
    background-color: #fff;
    cursor: auto
}

.handsontable .htFiltersMenuLabel {
    font-size: 12px
}

.handsontable .htFiltersMenuActionBar {
    text-align: center
}

.handsontable .htFiltersMenuCondition.border {
    border-bottom: 1px dotted #ccc!important
}

.handsontable .htFiltersMenuCondition .htUIInput {
    padding: 0 0 5px
}

.handsontable .htFiltersMenuCondition .htUIInput input {
    width: 159px;
    padding: 4px;
    margin-left: -4px
}

.handsontable .htFiltersMenuValue {
    border-bottom: 1px dotted #ccc!important
}

.handsontable .htFiltersMenuValue .htUIMultipleSelectSearch {
    padding: 0
}

.handsontable .htFiltersMenuValue .htUIMultipleSelectSearch input {
    width: 159px;
    padding: 4px;
    margin-left: -4px
}

.htUIMultipleSelect .ht_master .wtHolder {
    overflow-y: scroll
}

.handsontable .htFiltersActive .changeType {
    border: 1px solid #509272;
    color: #18804e;
    background-color: #d2e0d9
}

.handsontable .htUIClearAll,
.handsontable .htUISelectAll {
    display: inline-block;
    margin: 0 5px
}

.handsontable .htUIClearAll a,
.handsontable .htUISelectAll a {
    color: #3283d8;
    font-size: 12px
}

.handsontable .htUISelectionControls {
    text-align: right
}

.handsontable .htCheckboxRendererInput {
    margin: 0 5px 0 0;
    vertical-align: middle;
    height: 1em
}

.handsontable .htUIInput {
    padding: 3px 0 7px;
    position: relative;
    text-align: center
}

.handsontable .htUIInput input {
    border-radius: 2px;
    border: 1px solid #d2d1d1
}

.handsontable .htUIInput input:focus {
    outline: 0
}

.handsontable .htUIInputIcon {
    position: absolute
}

.handsontable .htUIInput.htUIButton {
    cursor: pointer;
    display: inline-block;
    padding: 3px 4px 7px;
    width: 60px
}

.handsontable .htUIInput.htUIButton input {
    background-color: #eee;
    color: #000;
    cursor: pointer;
    font-family: arial, sans-serif;
    font-size: 11px;
    font-weight: 700;
    height: 19px;
    width: 42px
}

.handsontable .htUIInput.htUIButton input:hover {
    border-color: #b9b9b9
}

.handsontable .htUIInput.htUIButtonOK input {
    background-color: #0f9d58;
    border-color: #18804e;
    color: #fff
}

.handsontable .htUIInput.htUIButtonOK input:hover {
    border-color: #1a6f46
}

.handsontable .htUISelect {
    cursor: pointer;
    margin-bottom: 7px;
    padding: 0 2px 0 0;
    position: relative;
    width: 169px
}

.handsontable .htUISelectCaption {
    background-color: #e8e8e8;
    border-radius: 2px;
    border: 1px solid #d2d1d1;
    font-family: arial, sans-serif;
    font-size: 11px;
    font-weight: 700;
    padding: 3px 0 3px 10px
}

.handsontable .htUISelectCaption:hover {
    background-color: #e8e8e8;
    border: 1px solid #b9b9b9
}

.handsontable .htUISelectDropdown:after {
    content: "\25B2";
    font-size: 7px;
    position: absolute;
    right: 10px;
    top: 0
}

.handsontable .htUISelectDropdown:before {
    content: "\25BC";
    font-size: 7px;
    position: absolute;
    right: 10px;
    top: 8px
}

.handsontable .htUIMultipleSelect .handsontable .htCore {
    border: none
}

.handsontable .htUIMultipleSelect .handsontable .htCore td:hover {
    background-color: #f5f5f5
}

.handsontable .htUIMultipleSelectSearch input {
    border-radius: 2px;
    border: 1px solid #d2d1d1;
    padding: 3px;
    width: 161px
}

.handsontable .htUIRadio {
    display: inline-block;
    margin: 0 5px 0 0;
    height: 100%
}

.handsontable .htUIRadio>input[type=radio] {
    margin-right: .5ex
}

.handsontable .htFiltersMenuOperators {
    padding-bottom: 5px
}

.handsontable.ganttChart tr:first-child th div.relative {
    padding-right: 21px
}

.handsontable.ganttChart .colHeader {
    display: block
}

.handsontable.ganttChart td.rangeBar {
    background: #48b703;
    border-right-width: 0;
    position: relative;
    -webkit-box-shadow: inset 0 3px 0 #fff;
    box-shadow: inset 0 3px 0 #fff
}

.handsontable.ganttChart td.rangeBar.last {
    border-right-width: 1px
}

.handsontable.ganttChart td.rangeBar.area {
    background: #7ec481
}

.handsontable.ganttChart td.rangeBar.partial {
    background: #8edf5a
}

.handsontable.ganttChart td.rangeBar.area.partial {
    background: #a1d8ad
}

.handsontable thead th.hiddenHeader:not(:first-of-type) {
    display: none
}

.handsontable th.ht_nestingLevels {
    text-align: left;
    padding-left: 7px
}

.handsontable th div.ht_nestingLevels {
    display: inline-block;
    position: absolute;
    left: 11px
}

.handsontable.innerBorderLeft th div.ht_nestingLevels,
.handsontable.innerBorderLeft~.handsontable th div.ht_nestingLevels {
    right: 10px
}

.handsontable th span.ht_nestingLevel {
    display: inline-block
}

.handsontable th span.ht_nestingLevel_empty {
    display: inline-block;
    width: 10px;
    height: 1px;
    float: left
}

.handsontable th span.ht_nestingLevel:after {
    content: "\2510";
    font-size: 9px;
    display: inline-block;
    position: relative;
    bottom: 3px
}

.handsontable th div.ht_nestingButton {
    display: inline-block;
    position: absolute;
    right: -2px;
    cursor: pointer
}

.handsontable th div.ht_nestingButton.ht_nestingExpand:after {
    content: "+"
}

.handsontable th div.ht_nestingButton.ht_nestingCollapse:after {
    content: "-"
}

.handsontable.innerBorderLeft th div.ht_nestingButton,
.handsontable.innerBorderLeft~.handsontable th div.ht_nestingButton {
    right: 0
}

.handsontable th.beforeHiddenColumn {
    position: relative
}

.handsontable th.afterHiddenColumn:before,
.handsontable th.beforeHiddenColumn:after {
    color: #bbb;
    position: absolute;
    top: 50%;
    font-size: 5pt;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.handsontable th.afterHiddenColumn {
    position: relative
}

.handsontable th.beforeHiddenColumn:after {
    right: 1px;
    content: "\25C0"
}

.handsontable th.afterHiddenColumn:before {
    left: 1px;
    content: "\25B6"
}

.handsontable td.firstVisibleColumn,
.handsontable th.firstVisibleColumn {
    border-left: 1px solid #ccc
}


/*!
 * Handsontable HiddenRows
 */

.handsontable th.afterHiddenRow:after,
.handsontable th.beforeHiddenRow:before {
    color: #bbb;
    font-size: 6pt;
    line-height: 6pt;
    position: absolute;
    left: 2px
}

.handsontable th.afterHiddenRow,
.handsontable th.beforeHiddenRow {
    position: relative
}

.handsontable th.beforeHiddenRow:before {
    content: "\25B2";
    bottom: 2px
}

.handsontable th.afterHiddenRow:after {
    content: "\25BC";
    top: 2px
}

.handsontable.ht__selection--rows tbody th.afterHiddenRow.ht__highlight:after,
.handsontable.ht__selection--rows tbody th.beforeHiddenRow.ht__highlight:before {
    color: #eee
}

.handsontable td.afterHiddenRow.firstVisibleRow,
.handsontable th.afterHiddenRow.firstVisibleRow {
    border-top: 1px solid #ccc
}

.zr-spreadsheet {
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden
}

.handsontable .handsontableInput,
.handsontable td,
.handsontable th {
    line-height: 25px
}

.handsontable .htPlaceholder {
    color: #ccc
}

.handsontable td.htInvalid {
    background-color: #fec!important;
    color: #f75
}

.handsontable td.htInvalid .htAutocompleteArrow {
    color: #ccc
}

.handsontable td.htInvalid .htAutocompleteArrow:hover {
    color: #f75
}

.handsontable.ht_master table.htCore thead {
    visibility: hidden
}

.zr-spreadsheet-error-message {
    position: absolute;
    background-color: #fffcf7;
    border: 1px solid #f75;
    color: #f75;
    padding: 1em;
    margin: 2px 0 0;
    z-index: 100
}

zr-spreadsheet-error-counter {
    display: none;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #f75;
    margin-right: 30px
}

zr-spreadsheet-error-counter .icon {
    fill: #f75;
    margin-right: 5px
}

zr-spreadsheet-error-counter .count {
    margin: 0 5px
}

zr-spreadsheet-error-counter[active] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.zr-datatable,
zr-datatable {
    display: block;
    margin: 30px 0
}

.zr-datatable .title,
zr-datatable .title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.zr-datatable .title .icon,
zr-datatable .title .icon {
    margin-left: 4px
}

.zr-datatable th.align-right .title span,
zr-datatable th.align-right .title span {
    -webkit-box-flex: 1;
    -ms-flex: 1 auto;
    flex: 1 auto
}

.zr-datatable th .icon,
zr-datatable th .icon {
    fill: #9b9b9b
}

.zr-datatable th.links,
zr-datatable th.links {
    padding-right: 20px
}

.zr-datatable th.links>.title,
zr-datatable th.links>.title {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.zr-datatable td.links,
zr-datatable td.links {
    text-align: right;
    vertical-align: center;
    padding-right: 20px
}

.zr-datatable td.links>a,
.zr-datatable td.links a.link-more,
zr-datatable td.links>a,
zr-datatable td.links a.link-more {
    margin-left: 1em;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.zr-datatable td.links>a .icon,
.zr-datatable td.links a.link-more .icon,
zr-datatable td.links>a .icon,
zr-datatable td.links a.link-more .icon {
    fill: #9b9b9b
}

.zr-datatable td.links>a:hover .icon,
.zr-datatable td.links a.link-more:hover .icon,
zr-datatable td.links>a:hover .icon,
zr-datatable td.links a.link-more:hover .icon {
    fill: #666
}

.zr-datatable td.links .zr-menu-popover,
zr-datatable td.links .zr-menu-popover {
    text-align: left
}

.zr-datatable td.links .zr-menu-popover ul,
zr-datatable td.links .zr-menu-popover ul {
    min-width: 100px;
    text-align: center
}

.zr-datatable tr.expandable-panel .loading,
zr-datatable tr.expandable-panel .loading {
    text-align: center;
    height: 100px;
    line-height: 100px
}

.zr-datatable .no-data,
zr-datatable .no-data {
    display: none;
    text-align: center;
    color: #ccc;
    padding: 80px 0
}

.zr-datatable[empty] .pagination-wrapper,
zr-datatable[empty] .pagination-wrapper {
    display: none
}

.zr-datatable[empty] .no-data,
zr-datatable[empty] .no-data {
    display: block
}

.zr-district-select-result {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    background: #fff;
    border: 1px solid #dfdfdf;
    border-radius: .125rem;
    -webkit-transition: border-color .3s;
    transition: border-color .3s;
    cursor: pointer
}

.zr-district-select-result:hover {
    border-color: #49e
}

.zr-district-select-result:focus,
.zr-district-select-result[active] {
    border-color: #37c;
    outline: none
}

.zr-district-select-result input {
    display: none
}

.zr-district-select-result .placeholder,
.zr-district-select-result .result {
    padding: 8px 0 8px 10px;
    padding: .5rem 0 .5rem .625rem;
    font-size: 14px;
    font-size: .875rem;
    line-height: 18px;
    line-height: 1.125rem;
    min-height: 34px;
    min-height: 2.125rem
}

.zr-district-select-result .placeholder {
    color: #ccc
}

.zr-district-select-result .result {
    padding: 0 0 0 4px;
    padding: 0 0 0 .25rem;
    color: #4a4a4a;
    display: none
}

.zr-district-select-result .result .segment {
    display: none;
    padding: 4px 6.4px;
    padding: .25rem .4rem;
    margin: 0 1px;
    color: #4a4a4a;
    font-size: 14px;
    font-size: .875rem;
    border-radius: 2px;
    text-decoration: none
}

.zr-district-select-result .result .segment.active,
.zr-district-select-result .result .segment:focus,
.zr-district-select-result .result .segment:hover {
    background: #f6f6f6
}

.zr-district-select-result .icon-wrapper,
.zr-district-select-result .link-clear {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: 34px;
    width: 2.125rem;
    height: 34px;
    height: 2.125rem;
    fill: #9b9b9b
}

.zr-district-select-result .icon-wrapper .icon,
.zr-district-select-result .link-clear .icon {
    width: 24px;
    width: 1.5rem;
    height: 24px;
    height: 1.5rem
}

.zr-district-select-result .link-clear {
    display: none;
    text-decoration: none;
    outline: none
}

.zr-district-select-result .link-clear:hover {
    fill: #4a4a4a
}

.zr-district-select-result[selected] .placeholder {
    display: none
}

.zr-district-select-result[selected] .result {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.zr-district-select-result[selected][clearable]:hover .link-clear,
.zr-district-select-result[selected][clearable][active] .link-clear {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.zr-district-select-result[selected][clearable]:hover .arrow-icon-wrapper,
.zr-district-select-result[selected][clearable][active] .arrow-icon-wrapper {
    display: none
}

.zr-district-select-list {
    display: none;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 100%;
    background: #fff;
    border: 1px solid #dfdfdf;
    -webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, .2);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, .2);
    z-index: 300;
    margin-top: 6px;
    margin-top: .375rem
}

.zr-district-select-list[active] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.zr-district-select-list[direction=up] {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    top: auto;
    bottom: 100%;
    margin-top: 0;
    margin-bottom: 6px;
    margin-bottom: .375rem
}

.zr-district-select-list .segment {
    display: none;
    padding: 16px;
    padding: 1rem
}

.zr-district-select-list .segment.active {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.zr-district-select-list .segment .item {
    display: inline-block;
    padding: 8px;
    padding: .5rem;
    color: #4a4a4a;
    font-size: 14px;
    font-size: .875rem;
    border-radius: 2px;
    text-decoration: none
}

.zr-district-select-list .segment .item:focus,
.zr-district-select-list .segment .item:hover {
    background: #f6f6f6
}

.zr-district-select {
    display: inline-block;
    width: 320px;
    width: 20rem;
    position: relative
}

.zr-department-select-result.tao-select-result .placeholder,
.zr-department-select-result.tao-select-result .selected-text {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding-right: 0
}

.zr-human-range-select {
    display: block
}

.zr-human-range-select select {
    display: none
}

.zr-human-range-select .selected-items {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.zr-human-range-select .selected-items .select-result-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 .5em .5em 0;
    padding: 0 .5em 0 .75em;
    height: 36px;
    height: 2.25rem;
    border: 1px solid transparent;
    border-radius: .125rem;
    background-color: #f6f6f6;
    cursor: pointer
}

.zr-human-range-select .selected-items .select-result-item:hover {
    border-color: #f75;
    background: #fff
}

.zr-human-range-select .selected-items .select-result-item:hover .link-remove {
    fill: #f75
}

.zr-human-range-select .selected-items .select-result-item .prefix {
    margin: 0 .5em 0 0;
    fill: #9b9b9b
}

.zr-human-range-select .selected-items .select-result-item .link-remove {
    display: block;
    fill: #ccc;
    margin: 0 0 0 .25em
}

.zr-human-range-select .selected-items .select-result-item .link-remove .icon {
    width: 24px;
    height: 24px
}

.zr-human-range-select .link-add {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    line-height: 36px;
    line-height: 2.25rem
}

.zr-human-range-select .link-add .icon {
    margin-right: .25em
}

.zr-human-range-select-dialog .human-range-columns {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 200px
}

.zr-human-range-select-dialog .human-range-columns .zr-human-range-select-list {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: static;
    -webkit-box-shadow: none;
    box-shadow: none;
    margin: 0;
    min-width: 0;
    border: none
}

.zr-human-range-select-dialog .human-range-columns .select-result {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 40%;
    flex: 0 0 40%;
    margin-left: 40px
}

.zr-human-range-select-dialog .human-range-columns .select-result h3 {
    color: #9b9b9b;
    font-weight: 400;
    font-size: 16px;
    font-size: 1rem;
    line-height: 34px;
    padding: 0 .5em;
    margin: 0 0 10px;
    border-bottom: 1px solid #eee
}

.zr-human-range-select-dialog .human-range-columns .select-result .select-result-items {
    overflow-y: auto;
    overscroll-behavior: contain
}

.zr-human-range-select-dialog .human-range-columns .select-result .select-result-items .select-result-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-height: 38px;
    padding: 0 .5em
}

.zr-human-range-select-dialog .human-range-columns .select-result .select-result-items .select-result-item:hover {
    background-color: #f6f6f6;
    cursor: pointer
}

.zr-human-range-select-dialog .human-range-columns .select-result .select-result-items .select-result-item:hover .link-remove {
    fill: #f75
}

.zr-human-range-select-dialog .human-range-columns .select-result .select-result-items .select-result-item .prefix {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    margin: 0 .5em 0 0;
    fill: #ccc
}

.zr-human-range-select-dialog .human-range-columns .select-result .select-result-items .select-result-item .name {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto
}

.zr-human-range-select-dialog .human-range-columns .select-result .select-result-items .select-result-item .link-remove {
    display: block;
    margin: 0 0 0 .5em;
    fill: #ccc
}

.zr-human-range-select-dialog .human-range-columns .select-result .select-result-items .select-result-item .link-remove .icon {
    width: 24px;
    height: 24px
}

.zr-human-range-select-dialog .buttons {
    margin-top: 16px;
    margin-top: 1rem
}

.zr-human-range-select-list .search-result,
.zr-human-range-select-list[searching] .organization-structure-tree {
    display: none
}

.zr-human-range-select-list[searching] .search-result {
    display: block
}

.zr-human-range-select-list .search-input {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto
}

.zr-human-range-select-list .organization-structure-tree {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    overflow: auto;
    overscroll-behavior: contain;
    padding: 8px 0;
    padding: .5rem 0
}

.zr-human-range-select-list .organization-structure-tree .tao-tree-item>.tao-tree-item-content {
    height: 38px;
    height: 2.375rem;
    padding-left: 8px;
    padding-left: .5rem;
    padding-right: 8px;
    padding-right: .5rem
}

.zr-human-range-select-list .organization-structure-tree .tao-tree-item>.tao-tree-item-content.selectable {
    background: #f6f6f6;
    cursor: pointer
}

.zr-human-range-select-list .organization-structure-tree .tao-tree-item>.tao-tree-item-content .human-range-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    white-space: nowrap
}

.zr-human-range-select-list .organization-structure-tree .tao-tree-item>.tao-tree-item-content .human-range-item .avatar {
    margin-right: .5em
}

.zr-human-range-select-list .organization-structure-tree .tao-tree-item>.tao-tree-item-content .human-range-item.selected {
    color: #5b3
}

.tao-select-list .option .prefix.icon-department {
    width: 24px;
    height: 24px;
    fill: #ccc
}

.settings-list {
    width: 1020px;
    margin: 40px auto
}

.settings-list>.box {
    padding: 0
}

.settings-list>h4 {
    margin: 30px 0 20px;
    font-weight: 300;
    color: #9b9b9b;
    padding-left: 10px;
    font-size: 14px;
    font-size: .875rem
}

.settings-list .settings-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-height: 100px;
    padding: 30px 40px;
    border-bottom: 1px solid #f3f3f3
}

.settings-list .settings-item:last-child {
    border-bottom: none
}

.settings-list .settings-item .item-label {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 180px;
    flex: 0 0 180px
}

.settings-list .settings-item .item-content {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    margin: 0 20px
}

.settings-list .settings-item .item-content .hint {
    margin: 10px 0 0;
    color: #9b9b9b;
    font-size: 12px;
    font-size: .75rem
}

.settings-list .settings-item .item-operator {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 180px;
    flex: 1 1 180px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.settings-list .settings-item .item-operator .button {
    margin-left: 1em
}

.settings-list .settings-item .value {
    font-weight: 700
}

.settings-list .settings-item .desc {
    font-size: 12px;
    font-size: .75rem;
    color: #9b9b9b
}

.settings-list .settings-item .warn {
    color: #f75
}

.zr-condition-fields .conditions .condition {
    margin-bottom: 12px
}

.zr-condition-fields .conditions .condition,
.zr-condition-fields .conditions .condition .key-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.zr-condition-fields .conditions .condition .form-input {
    margin: 0 10px 0 0
}

.zr-condition-fields .conditions .condition .form-input .input-field,
.zr-condition-fields .conditions .condition .form-input .input-field-placeholder {
    width: 200px
}

.zr-condition-fields .conditions .condition .form-input tao-time-picker {
    width: 120px
}

.zr-condition-fields .conditions .condition .form-input tao-multiple-select-result {
    padding-top: 0;
    margin-bottom: -12px
}

.zr-condition-fields .conditions .condition .form-input.condition-value .input-field {
    width: auto;
    max-width: 520px;
    min-width: 200px
}

.zr-condition-fields .conditions .condition .form-input.condition-value .input-field[multiple] {
    min-width: 0
}

.zr-condition-fields .conditions .condition .form-input.condition-value .tao-date-range-picker {
    width: 410px
}

.zr-condition-fields .conditions .condition .form-input.condition-value .tao-multiple-select-result {
    min-width: 0
}

.zr-condition-fields .conditions .condition .form-input .input-field-placeholder {
    border: 1px solid #dfdfdf;
    border-radius: 2px;
    color: #9b9b9b
}

.zr-condition-fields .conditions .condition .form-input:last-child {
    margin-bottom: 12px
}

.zr-condition-fields .conditions .condition .remove-field {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 36px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    fill: #f75;
    outline: none
}

.zr-condition-fields .conditions .condition .remove-field .icon {
    height: 24px;
    width: 24px
}

.zr-condition-fields .conditions .condition .remove-field:hover .icon {
    fill: #cc5437
}

.zr-condition-fields .conditions>.links .link-add {
    line-height: 38px
}

.zr-resource-filter .tao-form>form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.zr-resource-filter .tao-form>form .basic-condition {
    margin: 0 12px 0 0
}

.zr-resource-filter .tao-form>form .basic-condition .input-field {
    width: auto;
    min-width: 120px
}

.zr-resource-filter .tao-form>form .basic-condition .text-field .prefix {
    cursor: pointer
}

.zr-resource-filter .tao-form>form .basic-condition .text-field .prefix .icon {
    width: 24px;
    height: 24px
}

.zr-resource-filter .tao-form>form .basic-condition .text-field .input-field {
    width: 36px;
    width: 2.25rem;
    min-width: 0;
    -webkit-transition: width .2s, padding-right .2s;
    transition: width .2s, padding-right .2s;
    padding-right: 0
}

.zr-resource-filter .tao-form>form .basic-condition .text-field .link-clear {
    display: none;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    top: 0;
    right: 0;
    width: 36px;
    width: 2.25rem;
    height: 36px;
    height: 2.25rem;
    font-size: 14px;
    font-size: .875rem;
    fill: #9b9b9b
}

.zr-resource-filter .tao-form>form .basic-condition .text-field .link-clear .icon {
    width: 24px;
    height: 24px
}

.zr-resource-filter .tao-form>form .basic-condition .text-field .link-clear:hover {
    fill: #4a4a4a
}

.zr-resource-filter .tao-form>form .basic-condition .text-field.not-empty .link-clear {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.zr-resource-filter .tao-form>form .basic-condition .text-field.focus .prefix,
.zr-resource-filter .tao-form>form .basic-condition .text-field.not-empty .prefix {
    cursor: default
}

.zr-resource-filter .tao-form>form .basic-condition .text-field.focus .input-field,
.zr-resource-filter .tao-form>form .basic-condition .text-field.not-empty .input-field {
    padding-right: 36px;
    padding-right: 2.25rem;
    width: 300px
}

.zr-resource-filter .tao-form>form .basic-condition.filter-condition-search {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2
}

.zr-resource-filter .advanced-condition-result {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0 10px 0 20px;
    padding: 0 .625rem 0 1.25rem;
    border-bottom: 1px solid #eee;
    cursor: pointer
}

.zr-resource-filter .advanced-condition-result .result-body {
    padding: 16px 0;
    padding: 1rem 0;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto
}

.zr-resource-filter .advanced-condition-result .result-body .title {
    font-size: 14px;
    font-size: .875rem
}

.zr-resource-filter .advanced-condition-result .result-body .list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.zr-resource-filter .advanced-condition-result .result-body .list .selected-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: auto;
    min-height: 24px;
    min-height: 1.5rem;
    padding: 2px 8px 2px 12px;
    padding: .125rem .5rem .125rem .75rem;
    margin: 8px 8px 0 0;
    margin: .5rem .5rem 0 0;
    font-size: 12px;
    font-size: .75rem;
    color: #666;
    background: #fff;
    border: 1px solid #dfdfdf;
    border-radius: .625rem;
    outline: none
}

.zr-resource-filter .advanced-condition-result .result-body .list .selected-item .name {
    display: block;
    max-width: 210px;
    line-height: 18px;
    line-height: 1.125rem
}

.zr-resource-filter .advanced-condition-result .result-body .list .selected-item .icon {
    width: 16px;
    width: 1rem;
    height: 16px;
    height: 1rem;
    margin: 0 0 0 4px;
    margin: 0 0 0 .25rem;
    fill: #9b9b9b
}

.zr-resource-filter .advanced-condition-result .result-body .list .selected-item:hover {
    border-color: #f75
}

.zr-resource-filter .advanced-condition-result .result-body .list .selected-item:hover .icon {
    fill: #f75
}

.zr-resource-filter .advanced-condition-result .icon-arrow-right {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    fill: #9b9b9b;
    width: 24px;
    height: 24px
}

.zr-resource-filter .advanced-condition-result:hover {
    background: #f6f6f6
}

.zr-resource-filter .advanced-condition-list {
    display: block;
    width: 0
}

.zr-resource-filter .advanced-condition-list .tao-slide-box {
    min-width: 320px;
    min-width: 20rem;
    position: absolute;
    top: 0;
    left: 320px;
    left: 20rem;
    bottom: 0
}

.zr-resource-filter .advanced-condition-values {
    display: block;
    position: static
}

.zr-resource-filter .advanced-condition-values[active] {
    background: #f6f6f6
}

.zr-resource-filter .zr-advanced-condition-department-list,
.zr-resource-filter .zr-advanced-condition-select-list {
    display: block;
    position: static;
    width: 0;
    margin: 0;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none
}

.zr-resource-filter .zr-advanced-condition-department-list[active],
.zr-resource-filter .zr-advanced-condition-select-list[active] {
    display: block
}

.zr-resource-filter .zr-advanced-condition-department-list .search-input,
.zr-resource-filter .zr-advanced-condition-select-list .search-input {
    border-bottom-color: #eee
}

.zr-resource-filter .zr-advanced-condition-department-list .search-input .icon-wrapper,
.zr-resource-filter .zr-advanced-condition-select-list .search-input .icon-wrapper {
    width: 48px;
    width: 3rem;
    height: 48px;
    height: 3rem
}

.zr-resource-filter .zr-advanced-condition-department-list .search-input .search-field,
.zr-resource-filter .zr-advanced-condition-select-list .search-input .search-field {
    height: 48px;
    height: 3rem
}

.zr-resource-filter .zr-advanced-condition-department-list .list-wrapper,
.zr-resource-filter .zr-advanced-condition-select-list .list-wrapper {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    max-height: none
}

.zr-resource-filter .zr-advanced-condition-department-list .options-list .option,
.zr-resource-filter .zr-advanced-condition-select-list .options-list .option {
    border-bottom: 1px solid #eee;
    padding: 14px 16px;
    padding: .875rem 1rem
}

.zr-resource-filter .zr-advanced-condition-department-list .options-list .option:last-child,
.zr-resource-filter .zr-advanced-condition-select-list .options-list .option:last-child {
    border-bottom: 1px solid #eee
}

.zr-resource-filter .zr-advanced-condition-department-list .options-list .option:hover,
.zr-resource-filter .zr-advanced-condition-select-list .options-list .option:hover {
    background: #f6f6f6
}

.zr-resource-filter .zr-advanced-condition-department-list .loading-message,
.zr-resource-filter .zr-advanced-condition-department-list .no-option,
.zr-resource-filter .zr-advanced-condition-department-list .remote-no-option,
.zr-resource-filter .zr-advanced-condition-department-list .search-not-found,
.zr-resource-filter .zr-advanced-condition-department-list .tips,
.zr-resource-filter .zr-advanced-condition-select-list .loading-message,
.zr-resource-filter .zr-advanced-condition-select-list .no-option,
.zr-resource-filter .zr-advanced-condition-select-list .remote-no-option,
.zr-resource-filter .zr-advanced-condition-select-list .search-not-found,
.zr-resource-filter .zr-advanced-condition-select-list .tips {
    padding: 14px 16px;
    padding: .875rem 1rem;
    height: auto
}

.zr-advanced-condition-date-range-list .tao-date-range-picker {
    display: block;
    width: auto;
    padding: 24px 20px;
    padding: 1.5rem 1.25rem
}

.zr-advanced-condition-date-range-list .tao-date-range-picker .tao-date-picker {
    display: block;
    margin: 0 auto;
    width: auto
}

.zr-advanced-condition-date-range-list .tao-date-range-picker .to {
    display: block;
    text-align: center;
    margin: 12px 0;
    margin: .75rem 0
}

.zr-resource-filter .tao-form form .button-advanced-filters {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    margin: 0 12px 0 0
}

.zr-resource-filter .tao-form form .button-advanced-filters.tao-slide-box-active,
.zr-resource-filter .tao-form form .button-advanced-filters:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
    border-color: #2a1
}

.zr-resource-filter .tao-form form .tao-slide-box .slide-box-wrapper {
    z-index: 101
}

.zr-resource-filter .tao-form form .tao-slide-box .slide-box-wrapper .slide-box-content {
    width: 320px;
    width: 20rem;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.zr-resource-filter .tao-form form .tao-slide-box .slide-box-wrapper .slide-box-content header {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto
}

.zr-resource-filter .tao-form form .tao-slide-box .slide-box-wrapper .slide-box-content .advanced-conditions {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto
}

.zr-resource-filter .tao-form form .tao-slide-box .slide-box-wrapper .slide-box-content .buttons {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    text-align: center;
    margin: 20px 0;
    margin: 1.25rem 0
}

.zr-resource-filter .tao-form form .tao-slide-box .tao-slide-box .slide-box-wrapper .slide-box-content {
    width: auto;
    min-width: 320px;
    min-width: 20rem
}

.zr-resource-filter-result {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    line-height: 32px;
    line-height: 2rem;
    margin: 12px 0 -12px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    color: #9b9b9b
}

.zr-resource-filter-result .count {
    margin: 0 8px;
    margin: 0 .5rem;
    color: #4a4a4a
}

.zr-resource-filter-result .filter-condition {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 24px;
    height: 1.5rem;
    line-height: 1;
    padding: 0 8px 0 12px;
    padding: 0 .5rem 0 .75rem;
    margin: 4px 8px 0 0;
    margin: .25rem .5rem 0 0;
    font-size: 12px;
    font-size: .75rem;
    background: #f6f6f6;
    border: 1px solid #dfdfdf;
    border-radius: .625rem
}

.zr-resource-filter-result .filter-condition:first-of-type {
    margin-left: 8px;
    margin-left: .5rem
}

.zr-resource-filter-result .filter-condition .icon {
    margin: 0 0 0 4px;
    margin: 0 0 0 .25rem;
    fill: #ccc
}

.zr-resource-filter-result .filter-condition .name,
.zr-resource-filter-result .filter-condition .value {
    color: #666
}

.zr-resource-filter-result .filter-condition .or,
.zr-resource-filter-result .filter-condition .predicate {
    color: #ccc;
    margin: 0 4px
}

.zr-resource-filter-result .filter-condition:hover {
    border-color: #f75;
    background: #fff
}

.zr-resource-filter-result .filter-condition:hover .icon {
    fill: #f75
}

.zr-resource-filter-result .filter-condition.loading {
    border-color: #f3f3f3;
    color: #ccc;
    background: #f6f6f6
}

.zr-resource-filter-result .filter-condition.loading .icon {
    fill: #ccc
}

.zr-resource-filter {
    display: block
}

.zr-resource-filter .tao-form {
    margin: 0
}

.zr-blob-field {
    position: relative;
    overflow: auto;
    display: inline-block
}

.zr-blob-field input[type=file] {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 300%;
    opacity: 0;
    cursor: pointer
}

.zr-blob-field input[type=file]:focus {
    outline: none
}

.zr-blob-field[uploading]:not([multiple]) input[type=file] {
    display: none
}

.zr-attachment-field {
    display: block
}

.zr-attachment-field .zr-blob-field {
    padding: 8px 0 0;
    padding: .5rem 0 0
}

.zr-attachment-field .zr-blob-field .link-select-file {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.zr-attachment-field .zr-blob-field .link-select-file .icon {
    margin: 0 4px 0 0;
    margin: 0 .25rem 0 0
}

.zr-attachment-field>.attachments .attachment {
    width: 320px;
    width: 20rem;
    height: 36px;
    height: 2.25rem;
    margin: 12px 0 0;
    margin: .75rem 0 0;
    background: #f6f6f6;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.zr-attachment-field>.attachments .attachment .thumb {
    display: block;
    width: 36px;
    width: 2.25rem;
    height: 36px;
    height: 2.25rem;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: #ccc
}

.zr-attachment-field>.attachments .attachment .thumb img {
    display: block;
    max-width: 36px;
    max-width: 2.25rem;
    max-height: 36px;
    max-height: 2.25rem
}

.zr-attachment-field>.attachments .attachment .info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    position: relative;
    height: 100%;
    width: 284px;
    width: 17.75rem
}

.zr-attachment-field>.attachments .attachment .info .name {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    font-size: 12px;
    font-size: .75rem;
    margin: 0 0 0 10px;
    margin: 0 0 0 .625rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.zr-attachment-field>.attachments .attachment .info .progress {
    display: none;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    font-size: 12px;
    font-size: .75rem;
    color: #9b9b9b;
    margin: 0 0 0 10px;
    margin: 0 0 0 .625rem
}

.zr-attachment-field>.attachments .attachment .info .link-remove {
    display: block;
    margin: 0 8px 0 10px;
    margin: 0 .5rem 0 .625rem
}

.zr-attachment-field>.attachments .attachment .info .link-remove .icon {
    display: block;
    width: 16px;
    width: 1rem;
    height: 16px;
    height: 1rem
}

.zr-attachment-field>.attachments .attachment .info .progress-bar {
    display: none;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    height: .125rem;
    background: #5b3
}

.zr-attachment-field>.attachments .attachment.uploading .info .progress,
.zr-attachment-field>.attachments .attachment.uploading .info .progress-bar {
    display: block
}

.zr-attachment-field>.attachments .attachment.error .info .progress {
    color: #f75;
    display: block
}

.zr-image-field {
    display: block;
    position: relative;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    overflow: hidden;
    border: 1px dashed #dfdfdf
}

.zr-image-field .zr-blob-field {
    display: none;
    position: absolute;
    z-index: 2;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, .25)
}

.zr-image-field .placeholder {
    display: none;
    height: 100%;
    width: 100%;
    color: #9b9b9b
}

.zr-image-field>img {
    width: 100%;
    height: 100%
}

.zr-image-field .progress {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .25);
    -webkit-transition: -webkit-transform .1s;
    transition: -webkit-transform .1s;
    transition: transform .1s;
    transition: transform .1s, -webkit-transform .1s;
    display: none
}

.zr-image-field.circle {
    border-radius: 50%
}

.zr-image-field.circle:not(.empty) {
    border: none
}

.zr-image-field.circle .placeholder,
.zr-image-field.circle>img {
    border-radius: 50%
}

.zr-image-field.empty .zr-blob-field {
    background: none
}

.zr-image-field.empty .placeholder {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.zr-image-field.empty>img {
    display: none
}

.zr-image-field.uploading .progress {
    display: block
}

.zr-image-field:hover:not(.uploading) {
    border-color: #49e
}

.zr-image-field:hover:not(.uploading) .zr-blob-field {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #fff
}

.zr-image-field:hover:not(.uploading).empty .zr-blob-field {
    display: block
}

.blocklyText.blocklyDateText {
    fill: #fff
}

.blockly-field-editor .tao-date-picker {
    width: auto;
    height: 100%;
    display: block
}

.blockly-field-editor .tao-date-picker .tao-moment-picker-result {
    height: 100%;
    border: none;
    opacity: 0
}

.blockly-field-editor.blockly-field-date-without-year a.segment-label[data-segment=year],
.blockly-field-editor .tao-date-picker .tao-moment-picker-result>* {
    display: none
}

.blockly-field-editor .tao-select {
    width: auto;
    height: 100%;
    display: block
}

.blockly-field-editor .tao-select .tao-select-result {
    height: 100%;
    border: none;
    opacity: 0
}

.blockly-field-editor .tao-select .tao-select-result>* {
    display: none
}

.blockly-field-editor .tao-select .tao-select-list {
    min-width: 320px;
    min-width: 20rem
}

.blockly-field-editor {
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0
}

.zr-month-range-picker {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 368px;
    width: 23rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.zr-month-range-picker .end-month-picker.tao-moment-picker,
.zr-month-range-picker .start-month-picker.tao-moment-picker {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: 50%
}

.zr-month-range-picker .to {
    font-size: 14px;
    font-size: .875rem;
    color: #ccc;
    margin: 0 8px;
    margin: 0 .5rem
}

.zr-signature-field {
    display: block;
    position: relative;
    width: 320px;
    width: 20rem;
    height: 108px;
    height: 6.75rem
}

.zr-signature-field .link-to-signings {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    height: 100%;
    width: 100%;
    border-radius: 2px;
    border: 1px solid #dfdfdf;
    background: #f6f6f6
}

.zr-signature-field .link-to-signings .placeholder {
    display: none;
    color: #5b3
}

.zr-signature-field .link-to-signings img {
    height: 100%
}

.zr-signature-field .link-to-signings:hover {
    text-decoration: none
}

.zr-signature-field .weapp-qrcode .title {
    margin: 0 0 8px;
    margin: 0 0 .5rem;
    text-align: center
}

.zr-signature-field.empty .link-to-signings .placeholder {
    display: block
}

.zr-signature-field.empty .link-to-signings img {
    display: none
}

zr-upload-form-dialog.tao-dialog {
    text-align: center
}

zr-upload-form-dialog.tao-dialog .tao-dialog-wrapper {
    padding: 0
}

zr-upload-form-dialog.tao-dialog .tao-dialog-wrapper .tao-dialog-content {
    padding: 30px
}

zr-upload-form-dialog.tao-dialog .tao-dialog-wrapper .tao-dialog-content h3 {
    font-size: 20px;
    margin: 0 0 20px
}

.zr-upload-form,
.zr-upload-form .tao-form {
    margin: 0
}

.zr-upload-form .desc {
    line-height: 2;
    color: #9b9b9b
}

.zr-upload-form .help-image {
    display: block;
    margin: 30px auto;
    width: 760px
}

.zr-upload-form .upload-button {
    margin: 40px 0 10px
}

.zr-upload-form .upload-button .button {
    margin: 0
}

.zr-upload-form .error-message {
    display: none;
    margin-top: 10px;
    color: #f75
}

.zr-upload-form[error-message] .error-message {
    display: block
}

.zr-upload-form .template-tips {
    margin: 10px 0;
    color: #9b9b9b
}

.zr-chart,
.zr-chart .canvas-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.zr-chart .canvas-container {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative
}

.zr-chart .center-text {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.zr-chart .center-text,
.zr-chart .legend,
.zr-chart .legend .label-cell {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.zr-chart .legend .label-cell {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.zr-chart .legend .color-badge {
    width: 16px;
    height: 16px;
    margin-right: 10px
}

.zr-chart .legend .color-badge.point-style {
    border-radius: 100%
}

.zr-chart .legend .legend-table .table {
    width: auto
}

.zr-chart .legend .legend-table td,
.zr-chart .legend .legend-table th {
    border: none;
    height: 50px
}

.zr-chart .legend .legend-table.compact td,
.zr-chart .legend .legend-table.compact th {
    height: auto;
    padding: 0
}

.zr-chart .legend ul {
    margin: 0;
    padding: 0
}

.zr-chart .legend ul,
.zr-chart .legend ul li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.zr-chart .legend ul li {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-right: 40px
}

.zr-chart .legend ul.columns {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.zr-chart .legend ul.columns li {
    margin: 0
}

.zr-chart .legend.align-center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.zr-chart .legend.align-right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.zr-chart .legend.align-left {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.zr-chart .legend.align-bottom {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end
}

.zr-chart .legend.align-top {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.zr-chart.legend-right {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse
}

.zr-chart.legend-top {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.zr-chart.legend-bottom {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse
}

.zr-chart.legend-left ul,
.zr-chart.legend-right ul {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.tao-tooltip .tao-popover-content a {
    color: #fff;
    text-decoration: underline
}

.zr-video {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.zr-video,
.zr-video .video-poster {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative
}

.zr-video .video-poster {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    cursor: pointer;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, .15);
    box-shadow: 0 0 10px rgba(0, 0, 0, .15)
}

.zr-video .poster-image {
    display: block;
    width: 100%;
    height: auto;
    margin: 0
}

.zr-video .display-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.zr-video .display-link .icon {
    width: 20px;
    height: 21px;
    margin-right: 4px
}

.zr-video[icon-size=s] .button-play {
    width: 28px;
    height: 28px
}

.zr-video[icon-size=s] .button-play:before {
    border-width: 6px 0 6px 10px;
    margin-left: 4px
}

.zr-video .button-play {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 50%;
    width: 68px;
    height: 68px;
    background-color: rgba(0, 0, 0, .6);
    -webkit-transition: all .2s;
    transition: all .2s;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.zr-video .button-play:before {
    display: block;
    border-color: transparent transparent transparent #fff;
    border-style: solid;
    border-width: 10px 0 10px 18px;
    content: "";
    margin-left: 5px
}

.zr-video:hover .button-play {
    background-color: rgba(0, 0, 0, .4);
    -webkit-transform: translate(-50%, -50%) scale(1.1);
    transform: translate(-50%, -50%) scale(1.1)
}

.zr-video .video-wrapper {
    display: none
}

.zr-video .tag {
    position: absolute;
    left: 0;
    bottom: 0;
    color: #fff;
    padding: 0 5px;
    background-color: rgba(0, 0, 0, .5);
    font-size: 10px
}

.video-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: rgba(0, 0, 0, .8);
    z-index: 210;
    cursor: pointer;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0
}

.video-wrapper video {
    max-width: 80vw;
    max-height: 80vh;
    cursor: default
}

.zr-chart-loader .loading {
    min-height: 150px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.tao-form .mobile-verification-code-field,
.zr-chart-loader .loading {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.tao-form .mobile-verification-code-field {
    width: 320px;
    width: 20rem
}

.tao-form .mobile-verification-code-field .text-field {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto
}

.tao-form .mobile-verification-code-field .text-field .input-field {
    width: 100%
}

.tao-form .mobile-verification-code-field .zr-fetch-mobile-verification-code {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 130px;
    flex: 1 1 130px;
    margin: 0 0 0 .5em
}

.tao-form .form-input.hidden {
    display: none
}

.tao-form .phone-number-field {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 320px;
    width: 20rem
}

.tao-form .phone-number-field tao-select {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 120px;
    flex: 1 1 120px;
    margin-right: .5em
}

.tao-form .phone-number-field .text-field {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto
}

.tao-form .phone-number-field .text-field .input-field {
    width: 100%
}

.tao-form .zr-department-select zr-department-select-result.tao-select-result .placeholder,
.tao-form .zr-department-select zr-department-select-result.tao-select-result .selected-text {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto
}

.tao-form .address-field .text-field {
    margin: 10px 0 0;
    margin: .625rem 0 0
}

ul.bills-list {
    list-style: none;
    padding: 0;
    display: block;
    margin: 30px 0;
    border-top: 1px solid #eee
}

ul.bills-list .bill-item {
    display: block
}

ul.bills-list .bill-item>li {
    margin: 0;
    border-bottom: .5px solid #f3f3f3;
    min-height: 120px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    color: #000
}

ul.bills-list .bill-item>li:hover {
    background: #f5f9ff
}

ul.bills-list .bill-item>li .bill-name {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    margin: 0 20px;
    font-size: 16px;
    font-size: 1rem
}

ul.bills-list .bill-item>li .bill-summary-item {
    width: 120px;
    margin: 0 10px;
    text-align: right
}

ul.bills-list .bill-item>li .bill-summary-item .title {
    font-size: 12px;
    font-size: .75rem;
    color: #ccc
}

ul.bills-list .bill-item>li .bill-summary-item .value {
    font-size: 16px;
    font-size: 1rem;
    color: #4a4a4a
}

ul.bills-list .bill-item>li .bill-arrow {
    margin: 0 10px
}

ul.bills-list .bill-item>li .bill-arrow .icon {
    fill: #ccc;
    width: 24px;
    height: 24px
}

ul.bills-list .link-more {
    padding: 20px;
    color: #9b9b9b
}

ul.bills-list .link-more .icon {
    fill: #9b9b9b
}

ul.bills-list .link-more:hover {
    color: #49e
}

ul.bills-list .link-more:hover .icon {
    fill: #49e
}

ul.bills-list .no-data {
    text-align: center;
    margin: 0;
    color: #ccc;
    padding: 40px 0
}

.global-search-form {
    height: 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 10px 0 0;
    position: relative
}

.global-search-form .form-input.search {
    margin: 0
}

.global-search-form .form-input.search .text-field .prefix {
    cursor: pointer
}

.global-search-form .form-input.search .text-field .prefix .icon {
    width: 24px;
    height: 24px
}

.global-search-form .form-input.search .text-field .input-field {
    width: 36px;
    width: 2.25rem;
    min-width: 0;
    -webkit-transition: width .2s, padding-right .2s, border-color .2s;
    transition: width .2s, padding-right .2s, border-color .2s;
    padding-right: 0;
    padding-left: 34px;
    color: #fff;
    background: none;
    border-color: transparent;
    border-radius: 0
}

.global-search-form .form-input.search .text-field .input-field::-webkit-input-placeholder {
    color: hsla(0, 0%, 100%, .2)
}

.global-search-form .form-input.search .text-field .input-field:-ms-input-placeholder,
.global-search-form .form-input.search .text-field .input-field::-ms-input-placeholder {
    color: hsla(0, 0%, 100%, .2)
}

.global-search-form .form-input.search .text-field .input-field::placeholder {
    color: hsla(0, 0%, 100%, .2)
}

.global-search-form .form-input.search .text-field .link-clear {
    display: none;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    top: 0;
    right: 0;
    width: 36px;
    width: 2.25rem;
    height: 36px;
    height: 2.25rem;
    fill: #9b9b9b
}

.global-search-form .form-input.search .text-field .link-clear .icon {
    width: 24px;
    height: 24px
}

.global-search-form .form-input.search .text-field .link-clear:hover {
    fill: #ccc
}

.global-search-form .form-input.search .text-field.not-empty .link-clear {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.global-search-form .form-input.search .text-field.focus .prefix,
.global-search-form .form-input.search .text-field:hover .prefix {
    fill: #ccc
}

.global-search-form .form-input.search .text-field.focus .prefix,
.global-search-form .form-input.search .text-field.not-empty .prefix {
    cursor: default
}

.global-search-form .form-input.search .text-field.focus .input-field,
.global-search-form .form-input.search .text-field.not-empty .input-field {
    width: 240px;
    padding-right: 36px;
    padding-right: 2.25rem;
    border-bottom-color: hsla(0, 0%, 100%, .1)
}

.global-search-form .icon-loading {
    display: none;
    width: 18px;
    height: 18px;
    position: absolute;
    top: 16px;
    right: 9px;
    fill: #ccc
}

.global-search-form .search-result {
    display: none;
    min-width: 240px;
    background: #fff;
    border: 1px solid #dfdfdf;
    border-top: none;
    border-radius: 0 0 .125rem .125rem;
    -webkit-box-shadow: 0 3px 15px rgba(0, 0, 0, .1);
    box-shadow: 0 3px 15px rgba(0, 0, 0, .1);
    position: absolute;
    left: 0;
    top: 50px;
    z-index: 300
}

.global-search-form .search-result .no-data {
    padding: 20px;
    text-align: center;
    color: #ccc
}

.global-search-form .search-result .result-item {
    border-bottom: 1px solid #eee;
    padding: 15px
}

.global-search-form .search-result .result-item.selected {
    background-color: #f6f6f6
}

.global-search-form .search-result .result-item:last-child {
    border-bottom: none
}

.global-search-form .search-result .human-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 70px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.global-search-form .search-result .human-item .avatar {
    display: block;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto
}

.global-search-form .search-result .human-item .info {
    margin-left: 10px
}

.global-search-form .search-result .human-item .info .title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #4a4a4a
}

.global-search-form .search-result .human-item .info .name {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto
}

.global-search-form .search-result .human-item .info .staff-number {
    font-size: 12px;
    font-size: .75rem;
    color: #ccc;
    margin-left: 10px
}

.global-search-form .search-result .human-item .info .description {
    font-size: 12px;
    font-size: .75rem;
    color: #9b9b9b
}

.global-search-form[active] .search-result {
    display: block
}

.global-search-form[searching] .link-clear,
.global-search-form[searching] .search-result {
    display: none!important
}

.global-search-form[searching] .icon-loading {
    display: block
}

.page[layout=main]>header {
    height: 50px;
    background-color: #343f4b;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.page[layout=main]>header,
.page[layout=main]>header .left,
.page[layout=main]>header .right {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.page[layout=main]>header .right {
    padding-right: 20px
}

.page[layout=main]>header .organization-info {
    height: 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 20px;
    border-right: 1px solid hsla(0, 0%, 100%, .1)
}

.page[layout=main]>header .organization-info .organization-name {
    font-size: 16px;
    font-size: 1rem;
    color: #fff;
    font-weight: 400;
    margin: 0;
    cursor: default
}

.page[layout=main]>header .organization-info .organization-name .name {
    display: block;
    max-width: 140px;
    line-height: 50px;
    padding: 0 6px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.page[layout=main]>header .organization-info .organization-name .logo {
    display: block;
    width: 120px;
    max-height: 40px;
    margin: 0 5px;
    vertical-align: bottom
}

.page[layout=main]>header .organization-info .link-organization-settings {
    display: block
}

.page[layout=main]>header .organization-info .link-organization-settings .icon {
    width: 18px;
    height: 18px;
    fill: #90a0b1
}

.page[layout=main]>header .organization-info .link-organization-settings:hover .icon {
    fill: #9ab6d6
}

.page[layout=main]>header nav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    height: 50px
}

.page[layout=main]>header nav .nav-item {
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 1.5em;
    font-size: 14px;
    font-size: .875rem;
    color: #748392
}

.page[layout=main]>header nav .nav-item .icon {
    display: block;
    width: 18px;
    height: 18px;
    margin-right: .5em;
    fill: #90a0b1
}

.page[layout=main]>header nav .nav-item .icon.active {
    display: none
}

.page[layout=main]>header nav .nav-item:hover {
    color: #8faac7
}

.page[layout=main]>header nav .nav-item:hover .icon {
    fill: #9ab6d6
}

.page[layout=main]>header nav .nav-item.zr-menu-popover-active {
    background-color: #293440;
    color: #8faac7
}

.page[layout=main]>header nav .nav-item.zr-menu-popover-active .icon {
    fill: #9ab6d6
}

.page[layout=main]>header nav .nav-item.active {
    background-color: #293440;
    color: #fff
}

.page[layout=main]>header nav .nav-item.active .icon {
    display: none
}

.page[layout=main]>header nav .nav-item.active .icon.active {
    fill: #fff;
    display: block
}

.page[layout=main]>header .more-nav-items ul {
    min-width: 93px
}

.page[layout=main]>header .more-nav-items ul li a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.page[layout=main]>header .more-nav-items ul li a .icon {
    display: block;
    width: 18px;
    height: 18px;
    margin-right: .5em;
    fill: #90a0b1
}

.page[layout=main]>header .user-info {
    height: 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    padding: 0 10px
}

.page[layout=main]>header .user-info .avatar {
    display: block;
    width: 26px;
    height: 26px;
    background-color: #fff;
    margin-right: 10px;
    border-radius: 50%
}

.page[layout=main]>header .user-info .user-name {
    color: #fff
}

.page[layout=main]>header .user-info .icon {
    width: 24px;
    height: 24px;
    fill: #9b9b9b;
    margin-left: 4px
}

.page[layout=main]>header .user-info.zr-menu-popover-active .icon,
.page[layout=main]>header .user-info:hover .icon {
    fill: #ccc
}

.page[layout=main]>header .zr-menu-popover .tao-popover-content {
    border-radius: 0 0 .125rem .125rem;
    border-top: none
}

.page[layout=main]>main>.banner {
    background: #fff
}

.page[layout=main]>main>.banner nav {
    width: 1260px;
    margin: 0 auto;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.page[layout=main] {
    min-width: 1280px;
    min-height: 100%;
    background: #f6f6f6
}

.page[layout=main]>main {
    padding-bottom: 80px
}

.page[layout=main]>main>.box,
.page[layout=main]>main>.columns {
    width: 1260px;
    margin: 30px auto 0
}

.page[layout=center] {
    min-height: 100%;
    background: #f6f6f6
}

.page[layout=center]>header {
    height: 180px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.page[layout=center]>header .um-logo {
    display: block;
    width: 80px;
    height: 80px
}

.page[layout=center]>main {
    width: 960px;
    min-height: 200px;
    background: #fff;
    -webkit-box-shadow: 0 0 20px 0 rgba(0, 0, 0, .05);
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, .05);
    margin: 0 auto;
    padding: 60px 0
}

.page[layout=center]>main>h1 {
    margin: 0 auto 30px;
    font-weight: 100;
    font-size: 32px;
    font-size: 2rem;
    text-align: center
}

.page[layout=center]>main>h1+.sub-title {
    font-size: 18px;
    font-size: 1.125rem;
    font-weight: 100;
    color: #9b9b9b;
    text-align: center;
    margin: -20px auto 30px
}

.page[layout=center]>footer {
    padding: 50px 0;
    text-align: center;
    color: #ccc
}

.page[layout=fullscreen] {
    background: #f6f6f6
}

.page[layout=fullscreen] header.page-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 80px;
    padding: 0 30px;
    background-color: #fff;
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, .15);
    box-shadow: 0 0 4px rgba(0, 0, 0, .15);
    position: relative;
    z-index: 100
}

.page[layout=fullscreen] header.page-header .left,
.page[layout=fullscreen] header.page-header .right {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto
}

.page[layout=fullscreen] header.page-header .middle {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto
}

.page[layout=fullscreen] header.page-header .right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.page[layout=fullscreen] header.page-header .left .button-return {
    margin-right: 12px
}

.page[layout=fullscreen] header.page-header .right .button {
    margin: 0 0 0 1em
}

.page[layout=fullscreen] header.page-header .right .form-buttons {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0
}

.page[layout=fullscreen] header.page-header .right .form-buttons .button {
    margin: 0 0 0 1em
}

.page[layout=fullscreen] header.page-header h1 {
    font-size: 24px;
    font-size: 1.5rem;
    margin: 0
}

.page[layout=fullscreen] header.page-header>.right>.button {
    margin-left: 10px
}

.page[layout=fullscreen] zr-fullscreen-container {
    display: block;
    overflow: auto
}

.page[layout=fullscreen] zr-fullscreen-container .columns,
.page[layout=fullscreen] zr-fullscreen-container .columns>.left-column,
.page[layout=fullscreen] zr-fullscreen-container .columns>.main-column,
.page[layout=fullscreen] zr-fullscreen-container .columns>.right-column {
    height: 100%
}

.page[layout=empty] {
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center
}

.page[layout=empty],
.page[layout=empty] .error-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: center;
    align-items: center
}

.page[layout=empty] .error-box {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-width: 600px;
    min-height: 380px
}

.page[layout=empty] .error-box .error-title {
    font-size: 36px;
    line-height: 1.5;
    text-align: center;
    color: #569
}

.page[layout=empty] .error-box .error-image {
    display: block;
    margin: 30px auto;
    max-width: 600px
}

.page[layout=empty] .error-box .error-desc {
    color: #9b9b9b;
    margin: 18px 0 0;
    font-size: 14px;
    line-height: 1.71;
    text-align: center
}

.page[layout=empty]>footer {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    bottom: 30px;
    font-size: 12px;
    margin: 6px 0 0
}

.page[layout=empty] {
    min-height: 100%
}

.page[layout=empty]>footer {
    padding: 50px 0;
    text-align: center;
    color: #ccc
}

.critical-notice {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 50px;
    background-color: #f90;
    color: #fff
}

.critical-notice .icon {
    fill: #fff;
    margin: 0 .5em
}

.critical-notice .button {
    border: 1px solid #fff;
    color: #fff;
    background: transparent;
    margin: 0 1em
}

.critical-notice .button:hover {
    background: #fff;
    color: #fa0
}

.columns {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.columns>.left-column {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: 200px;
    margin-right: 20px
}

.columns>.left-column nav {
    background-color: #fff
}

.columns>.main-column {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto
}

.columns>.right-column {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: 360px;
    margin-left: 20px
}

.box {
    position: relative;
    background-color: #fff;
    padding: 30px 40px
}

.box.without-padding {
    padding: 0
}

.box .sticker {
    position: absolute;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0 40px;
    height: 40px;
    text-align: center;
    border-radius: 0 0 4px 4px;
    -webkit-box-shadow: 0 2px 10px 0 rgba(0, 0, 0, .1);
    box-shadow: 0 2px 10px 0 rgba(0, 0, 0, .1);
    color: #fff;
    fill: #fff
}

.box .sticker.warning {
    background-color: #fa0
}

.box .sticker.success {
    background-color: #5b3
}

.box .sticker.failure {
    background-color: #f75
}

.box>.title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.box>.title .button-return {
    margin-right: 12px
}

.box>.title h2 {
    margin: 0
}

.box>.title>.left,
.box>.title>.right,
.box>.title h2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.box>.title>.right>.button {
    margin-left: 10px
}

.box>.title>.right>.hint {
    color: #9b9b9b
}

.box>nav {
    border-bottom: 1px solid #eee
}

.box>nav .tab {
    font-size: 18px;
    padding: 0 .25em;
    margin: 0 30px 0 0
}

.box>nav .tab:last-child {
    margin-right: 0
}

.box>.filter-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.box>.filter-wrapper,
.box>.zr-resource-filter {
    margin: 26px 0 0;
    margin: 1.625rem 0 0
}

.panel {
    background: #fff;
    margin-bottom: 20px
}

.panel:last-child {
    margin: 0
}

.panel>.title {
    height: 50px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0 20px;
    border-bottom: 1px solid #eee
}

.panel>.title,
.panel>.title>.left,
.panel>.title>.right {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.panel>.title>.right>.button {
    margin-left: 10px
}

.panel>.body {
    padding: 0 20px;
    min-height: 50px
}

.dashboards-show-page.page .employee-counts {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 30px 0;
    -ms-flex-pack: distribute;
    justify-content: space-around
}

.dashboards-show-page.page .employee-counts .count {
    width: 150px;
    text-align: center
}

.dashboards-show-page.page .employee-counts .count .value {
    display: block;
    font-size: 36px;
    color: #4a4a4a
}

.dashboards-show-page.page .employee-counts .count:hover .value {
    color: #37c
}

.dashboards-show-page.page .employee-counts .count .title {
    display: block;
    font-size: 12px;
    font-size: .75rem;
    color: #9b9b9b
}

.dashboards-show-page.page .employee-counts .count:hover .title {
    color: #37c
}

.dashboards-show-page.page .shortcuts {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 30px 0;
    -ms-flex-pack: distribute;
    justify-content: space-around
}

.dashboards-show-page.page .shortcuts .shortcut {
    width: 80px;
    text-align: center
}

.dashboards-show-page.page .shortcuts .shortcut .icon {
    width: 56px;
    height: 56px
}

.dashboards-show-page.page .shortcuts .shortcut .name {
    font-size: 12px;
    font-size: .75rem;
    color: #4a4a4a;
    margin-top: 10px
}

.dashboards-show-page.page .shortcuts .shortcut:hover {
    opacity: .8
}

.dashboards-show-page.page .shortcuts .shortcut:hover .name {
    color: #37c
}

.dashboards-show-page.page .zr-datatable {
    margin: 0
}

.dashboards-show-page.page .zr-datatable thead {
    display: none
}

.dashboards-show-page.page .zr-datatable tbody tr:hover {
    background: none
}

.dashboards-show-page.page .zr-datatable tbody tr:last-child td {
    border-bottom: none
}

.dashboards-show-page.page .anniversary-employees .item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 26px 0;
    border-bottom: 1px solid #eee
}

.dashboards-show-page.page .anniversary-employees .item .info {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    margin: 0 10px
}

.dashboards-show-page.page .anniversary-employees .item .info span {
    display: block
}

.dashboards-show-page.page .anniversary-employees .item .info .detail {
    font-size: 12px;
    font-size: .75rem;
    color: #9b9b9b
}

.dashboards-show-page.page .anniversary-employees .item .icon {
    width: 22px;
    height: 22px;
    margin: 0 10px;
    fill: #dfe3e5
}

.dashboards-show-page.page .anniversary-employees .item:last-child {
    border-bottom: none
}

.dashboards-show-page.page .anniversary-employees .no-data {
    text-align: center;
    margin: 0;
    color: #ccc;
    padding: 40px 0
}

.dashboards-show-page.page .mini-calendar-body {
    padding: 0
}

.dashboards-show-page.page .weeks-switcher {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0 10px;
    height: 110px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.dashboards-show-page.page .weeks-switcher .week-switch-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    height: 100%;
    width: 30px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    fill: #9b9b9b
}

.dashboards-show-page.page .weeks-switcher .week-switch-link:hover {
    fill: #37c
}

.dashboards-show-page.page .weeks-switcher .week-switch-link .icon {
    width: 24px;
    height: 24px
}

.dashboards-show-page.page .weeks-switcher .weekdays {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto
}

.dashboards-show-page.page .weeks-switcher .weekdays .weekday {
    text-align: center
}

.dashboards-show-page.page .weeks-switcher .weekdays .weekday .date {
    font-size: 24px;
    color: #4a4a4a
}

.dashboards-show-page.page .weeks-switcher .weekdays .weekday .name {
    font-size: 10px;
    color: #9b9b9b;
    font-weight: 100
}

.dashboards-show-page.page .weeks-switcher .weekdays .weekday:hover .date,
.dashboards-show-page.page .weeks-switcher .weekdays .weekday:hover .name {
    color: #37c
}

.dashboards-show-page.page .weeks-switcher .weekdays .has-events:after {
    display: inline-block;
    margin: 5px auto;
    width: 4px;
    height: 4px;
    background-color: #ccc;
    border-radius: 50%;
    content: ""
}

.dashboards-show-page.page .weeks-switcher .weekdays .weekday.selected {
    cursor: default
}

.dashboards-show-page.page .weeks-switcher .weekdays .weekday.selected .date,
.dashboards-show-page.page .weeks-switcher .weekdays .weekday.selected .name {
    color: #5b3
}

.dashboards-show-page.page .weeks-switcher .weekdays .weekday.selected .circle {
    background-color: #5b3
}

.dashboards-show-page.page .day-events {
    border-top: 1px solid #f3f3f3;
    margin: 0 20px;
    padding: 20px 0
}

.dashboards-show-page.page .day-events .no-data {
    text-align: center;
    margin-top: 20px;
    color: #ccc
}

.dashboards-show-page.page .day-events .date-title {
    font-size: 12px;
    font-size: .75rem;
    font-weight: 400;
    color: #9b9b9b
}

.dashboards-show-page.page .day-events .events-container {
    list-style: none;
    padding: 0
}

.dashboards-show-page.page .day-events .events-container .event-group {
    margin: 10px 5px
}

.dashboards-show-page.page .day-events .events-container .event-group:before {
    display: inline-block;
    width: 8px;
    height: 8px;
    background-color: #eee;
    border-radius: 50%;
    margin-right: 7px;
    content: ""
}


.dashboards-show-page.page .image-banner {
    height: 230px;
    background: url(/packs/images/main/home-banner-414f4a0b6088fd7d4edda53f415a4792.png) 50% no-repeat #f0f8ff;
    background-size: contain
}

.dashboards-show-page.page .image-banner+.columns {
    width: 1260px;
    margin: -30px auto 40px
}

.dashboards-show-page.page .icon-question {
    width: 15px;
    height: 15px;
    fill: #9b9b9b;
    margin-top: 2px;
    margin-left: 5px
}

.attachment-preview-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.attachment-preview-list .attachment-preview-item {
    width: 100px;
    height: 100px;
    position: relative;
    margin: 0 20px 20px 0
}

.attachment-preview-list .attachment-preview-item img {
    width: 100%;
    height: 100%;
    -o-object-fit: scale-down;
    object-fit: scale-down
}

.attachment-preview-list .attachment-preview-item a {
    bottom: 0;
    position: absolute;
    display: block;
    width: 100px;
    height: 40px;
    background-image: -webkit-gradient(linear, left top, left bottom, from(hsla(0, 0%, 51%, 0)), to(rgba(74, 74, 74, .85)));
    background-image: linear-gradient(180deg, hsla(0, 0%, 51%, 0), rgba(74, 74, 74, .85));
    color: #fff;
    text-align: center;
    line-height: 40px;
    font-size: 12px
}

.settings-index-page .portals {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 1060px;
    margin: 60px auto;
    padding: 0;
    list-style-type: none
}

.settings-index-page .portals li {
    margin: 0 60px 0 0
}

.settings-index-page .portals li:nth-child(2n) {
    margin-right: 0
}

.settings-index-page .portals li>a {
    border-radius: .125rem;
    width: 500px;
    height: 140px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 50px
}

.settings-index-page .portals li>a:hover {
    background-color: #f6f6f6
}

.settings-index-page .portals .icon {
    width: 64px;
    height: 64px
}

.settings-index-page .portals .title {
    margin-left: 16px;
    max-width: 250px
}

.settings-index-page .portals .title h3 {
    margin: 0;
    font-weight: 400;
    color: #666
}

.settings-index-page .portals .desc {
    font-size: 12px;
    font-size: .75rem;
    color: #ccc;
    margin: 6px 0 0;
    line-height: normal
}

.log-change-content-dialog .item {
    margin: 16px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.log-change-content-dialog .item .attribute-name {
    width: 130px;
    color: #9b9b9b
}

.log-change-content-dialog .item .change-value {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.new-online-import-dialog .select-file-info {
    color: #9b9b9b;
    line-height: 2
}

.new-online-import-dialog .select-file-info .required-columns {
    margin-top: 1em;
    color: #4a4a4a
}

.new-online-import-dialog .select-file-info .required-columns .required-column {
    margin: 0 .5em
}

.online-import-header-matches {
    display: block
}

.online-import-header-matches .header-match-form {
    margin: 0
}

.online-import-header-matches .header-match-box {
    width: 1260px;
    margin: 30px auto
}

.online-import-header-matches .header-match-desc {
    text-align: center;
    line-height: 2;
    color: #666
}

.online-import-header-matches .match-errors {
    color: #f75;
    text-align: center;
    margin: 30px 0
}

.online-import-header-matches .matched-data {
    margin-top: 30px
}

.online-import-header-matches .matched-data .toggle-matched-table {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #9b9b9b;
    fill: #9b9b9b;
    margin: 40px 0 0
}

.online-import-header-matches .matched-data .toggle-matched-table:hover {
    color: #666;
    fill: #666
}

.online-import-header-matches .matched-data .toggle-matched-table .icon {
    width: 20px;
    height: 20px;
    -webkit-transition: -webkit-transform .2s;
    transition: -webkit-transform .2s;
    transition: transform .2s;
    transition: transform .2s, -webkit-transform .2s;
    margin-right: 5px
}

.online-import-header-matches .matched-data .toggle-matched-table .hide-text {
    display: none
}

.online-import-header-matches .matched-data .header-match-table {
    display: none;
    margin-top: -5px
}

.online-import-header-matches .matched-data .header-match-table thead {
    visibility: hidden
}

.online-import-header-matches .matched-data.active .toggle-matched-table .icon {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}

.online-import-header-matches .matched-data.active .toggle-matched-table .show-text {
    display: none
}

.online-import-header-matches .matched-data.active .header-match-table,
.online-import-header-matches .matched-data.active .toggle-matched-table .hide-text {
    display: block
}

.online-import-header-matches .header-match-table {
    margin-top: 30px
}

.online-import-header-matches .header-match-table td {
    padding: 15px 10px
}

.online-import-header-matches .header-match-table .th-arrow {
    width: 200px
}

.online-import-header-matches .header-match-table .th-operation {
    width: 400px
}

.online-import-header-matches .header-match-table .header-match .td-header-name .values {
    color: #ccc;
    font-size: 12px;
    font-size: .75rem;
    margin-top: .5em
}

.online-import-header-matches .header-match-table .header-match .td-matched-column .no-match {
    color: #9b9b9b
}

.online-import-header-matches .header-match-table .header-match .td-matched-column .column-name-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.online-import-header-matches .header-match-table .header-match .td-matched-column .custom-field-badge {
    display: none;
    margin-left: 10px
}

.online-import-header-matches .header-match-table .header-match .td-matched-column .column-name {
    color: #5b3;
    display: none
}

.online-import-header-matches .header-match-table .header-match .td-matched-column .typical-values {
    color: #ccc;
    font-size: 12px;
    font-size: .75rem;
    margin-top: .5em
}

.online-import-header-matches .header-match-table .header-match .td-matched-column .typical-values.hidden {
    display: none
}

.online-import-header-matches .header-match-table .header-match .td-operation .or {
    color: #9b9b9b;
    margin: 0 .5em
}

.online-import-header-matches .header-match-table .header-match.matched .td-matched-column .no-match,
.online-import-header-matches .header-match-table .header-match .td-operation .not-import-wrapper {
    display: none
}

.online-import-header-matches .header-match-table .header-match.matched .td-matched-column .column-name {
    display: block
}

.online-import-header-matches .header-match-table .header-match.matched .td-operation .not-import-wrapper {
    display: inline
}

.online-import-header-matches .header-match-table .header-match.custom-field .td-matched-column .custom-field-badge {
    display: block
}

.online-import-data-form {
    margin: 0
}

.zr-online-import-select-system-field .slide-box-wrapper {
    padding: 0
}

.zr-online-import-select-system-field .slide-box-wrapper .slide-box-content {
    width: 320px;
    width: 20rem
}

.zr-online-import-select-system-field .tao-select-list {
    display: block;
    position: static;
    margin: 0;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none
}

.zr-online-import-select-system-field .tao-select-list[active] {
    display: block
}

.zr-online-import-select-system-field .tao-select-list .search-input {
    border-bottom-color: #eee
}

.zr-online-import-select-system-field .tao-select-list .search-input .icon-wrapper {
    width: 48px;
    width: 3rem;
    height: 48px;
    height: 3rem
}

.zr-online-import-select-system-field .tao-select-list .search-input .search-field {
    height: 48px;
    height: 3rem
}

.zr-online-import-select-system-field .tao-select-list .list-wrapper {
    max-height: none
}

.zr-online-import-select-system-field .tao-select-list .options-list .option {
    border-bottom: 1px solid #eee;
    padding: 14px 16px;
    padding: .875rem 1rem
}

.zr-online-import-select-system-field .tao-select-list .options-list .option:last-child {
    border-bottom: 1px solid #eee
}

.zr-online-import-select-system-field .tao-select-list .options-list .option:hover {
    background: #f6f6f6
}

.zr-online-import-select-system-field .tao-select-list .loading-message,
.zr-online-import-select-system-field .tao-select-list .no-option,
.zr-online-import-select-system-field .tao-select-list .remote-no-option,
.zr-online-import-select-system-field .tao-select-list .search-not-found,
.zr-online-import-select-system-field .tao-select-list .tips {
    padding: 14px 16px;
    padding: .875rem 1rem;
    height: auto
}

.zr-online-import-create-custom-field .slide-box-wrapper {
    padding: 0
}

.zr-online-import-create-custom-field .slide-box-wrapper .slide-box-content .online-import-custom-field-form {
    width: 100%
}

.zr-online-import-create-custom-field .slide-box-wrapper .slide-box-content .online-import-custom-field-form .meta-form-wrapper {
    height: calc(100vh - 7.25rem - 2px);
    overflow-y: auto;
    padding: 24px 24px 0;
    padding: 1.5rem 1.5rem 0
}

.zr-online-import-create-custom-field .slide-box-wrapper .slide-box-content .online-import-custom-field-form .form-buttons {
    background: #fff;
    border-top: 1px solid #eee;
    margin: 0;
    padding: 16px;
    padding: 1rem;
    position: fixed;
    bottom: 0;
    width: 100%
}

.online-import-select-sheet-dialog {
    text-align: center
}

.online-import-select-sheet-dialog .desc {
    color: #9b9b9b
}

.online-import-select-sheet-dialog .sheet-list {
    margin: 30px 0
}

.online-import-select-sheet-dialog .sheet-list .link-select-sheet {
    display: block;
    margin: 0 0 15px;
    color: #666;
    padding: 10px 24px
}

.online-import-select-sheet-dialog .sheet-list .link-select-sheet:last-child {
    margin-bottom: 0
}

.human-import-form {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 20px
}

.human-import-form,
.human-import-form .section {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.human-import-form .section-upload {
    margin-bottom: 50px
}

.human-import-form .droppable-area {
    width: 460px;
    height: 180px;
    background-color: #f6f6f6;
    border: 2px dashed #ccc;
    padding: 40px;
    position: relative
}

.human-import-form .droppable-area.file-dragging {
    border-color: #fa0
}

.human-import-form .droppable-area .icon {
    display: inline-block;
    fill: #9b9b9b;
    margin-bottom: 35px;
    -webkit-transform: scale(3);
    transform: scale(3)
}

.human-import-form .droppable-area .form-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 10px
}

.human-import-form .droppable-area .form-wrapper .tao-form {
    margin: 0 10px
}

.human-import-form .droppable-area .form-wrapper .tao-form .error-message {
    position: absolute;
    top: 175px;
    left: 0
}

.human-import-form .droppable-area .form-wrapper .upload-button {
    margin: 0
}

.human-import-form .droppable-area .description {
    color: #9b9b9b;
    font-size: 12px;
    font-size: .75rem
}

.human-import-form .video {
    margin-left: 60px
}

.human-import-form .video .video-title {
    font-weight: 400
}

.human-import-form .video .zr-video {
    width: 240px;
    height: 120px
}

.human-import-form .section-info {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.human-import-form .section-info h3.info-title {
    width: 100%;
    font-weight: 400;
    margin: 0 auto 30px
}

.human-import-form .section-info .columns {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    width: 100%
}

.human-import-form .section-info .columns .column {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 200px
}

.human-import-form .section-info .columns .column.archives .icon-wrapper {
    background: #ffa005
}

.human-import-form .section-info .columns .column.structure .icon-wrapper {
    background: #69be38
}

.human-import-form .section-info .columns .column.report .icon-wrapper {
    background: #629ce6
}

.human-import-form .section-info .columns .column .icon-wrapper {
    height: 28px;
    width: 28px;
    border-radius: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-right: 10px;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.human-import-form .section-info .columns .column .icon-wrapper .icon {
    fill: #fff
}

.human-import-form .section-info .columns .column .title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 20px;
    text-align: left
}

.human-import-form .section-info .columns .column .title .title-desc {
    font-size: 12px;
    font-size: .75rem
}

.human-import-form .section-info .columns .column .image {
    border: 1px solid #eee
}

.human-import-form .section-info .columns .column .image img {
    width: 180px;
    height: 110px
}

.file-import-show-dialog .overview {
    font-weight: 700;
    font-size: 16px;
    font-size: 1rem
}

.file-import-show-dialog .overview a {
    text-decoration: underline
}

.file-import-show-dialog .overview .icon-success-bg {
    fill: #5b3
}

.file-import-show-dialog .overview .imported-info {
    color: #5b3
}

.file-import-show-dialog .overview .fail-info {
    color: #f75
}

.file-import-show-dialog .errors {
    margin: 16px 0;
    margin: 1rem 0;
    max-height: 500px;
    max-height: 31.25rem;
    overflow-y: scroll
}

.file-import-new-dialog .instructions .attendance-machine-import-instructions .desc {
    color: #9b9b9b;
    text-align: center
}

.file-import-new-dialog .instructions .attendance-machine-import-instructions .steps {
    margin: 25px auto;
    text-align: center
}

.file-import-new-dialog .instructions .attendance-machine-import-instructions .steps .step-img {
    width: 180px;
    display: inline-block;
    margin: auto 10px
}

.page.authentication-signins-new-page>main {
    width: 400px;
    padding: 20px 30px 0
}

.page.authentication-signins-new-page>main .signin-form {
    width: 280px;
    margin: 40px auto
}

.page.authentication-signins-new-page>main .signin-form .mobile-verification-code-field,
.page.authentication-signins-new-page>main .signin-form .phone-number-field {
    width: 100%
}

.page.authentication-signins-new-page>main .signin-form .form-buttons {
    margin-top: 30px
}

.page.authentication-signins-new-page>main .signin-form .button-signin {
    width: 100%;
    margin: 0;
    letter-spacing: 10px
}

.page.authentication-signins-new-page>main .signin-form .success-message {
    width: 100%;
    margin: 0
}

.page.authentication-signins-new-page>main .button-wework-login img {
    display: block;
    width: 280px
}

.page.authentication-signins-new-page>main .button-wework-login:hover {
    opacity: .8
}

.page.authentication-signins-new-page>main .no-account {
    height: 80px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-top: 1px solid #f3f3f3
}

.signup-form .agreement {
    text-align: center;
    margin: 40px 0 -20px
}

zr-select-organization-industry {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

zr-select-organization-industry .field-industry,
zr-select-organization-industry .field-industry-category {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 155px;
    flex: 0 0 155px;
    max-width: 155px
}

zr-select-organization-industry .field-industry-category .tao-select-list .options-list .option .name,
zr-select-organization-industry .field-industry .tao-select-list .options-list .option .name {
    white-space: nowrap
}

zr-select-organization-industry .field-industry-category .tao-select-result .selected-text,
zr-select-organization-industry .field-industry .tao-select-result .selected-text {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

zr-select-organization-industry .field-industry {
    margin-left: .5em
}

.page.services-index-page .service {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 500px;
    height: 120px;
    border-radius: .125rem
}

.page.services-index-page .service:hover {
    background: #f6f6f6
}

.page.services-index-page .service .left {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 110px
}

.page.services-index-page .service .left .icon {
    -webkit-transform: scale(3.4);
    transform: scale(3.4)
}

.page.services-index-page .service .right {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.page.services-index-page .service .right .title {
    font-weight: 400;
    margin-bottom: 6px
}

.page.services-index-page .service .right .description,
.privileges-roles-index-page .change-forbidden {
    font-size: 12px;
    font-size: .75rem;
    color: #9b9b9b
}

.permission-select-container .section {
    margin-top: 20px
}

.permission-select-container .section .section-head {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 10px
}

.permission-select-container .section .section-head a {
    margin-left: 20px
}

.permission-select-container .section .section-body .checkbox {
    display: inline-block;
    width: 140px;
    line-height: 36px;
    margin-right: 20px
}

.permission-select-container .section .section-body .checkbox tao-check-box {
    margin-right: 6px
}

.zr-field-wizard-form-previewer .form-previewer-section {
    display: block;
    margin-bottom: 20px;
    margin-bottom: 1.25rem
}

.zr-field-wizard-form-previewer .form-previewer-section .box {
    padding: 0
}

.zr-field-wizard-form-previewer .form-previewer-section .box .empty-sort-placeholder {
    padding: 0;
    display: none
}

.zr-field-wizard-form-previewer .form-previewer-section .box>header {
    padding: 20px;
    padding: 1.25rem
}

.zr-field-wizard-form-previewer .form-previewer-section .box>header>.title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.zr-field-wizard-form-previewer .form-previewer-section .box>header>.title .left {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 16px;
    font-size: 1rem
}

.zr-field-wizard-form-previewer .form-previewer-section .box>header>.title .left .icon.drag-icon {
    margin-right: 4px;
    margin-right: .25rem;
    cursor: move;
    display: none
}

.zr-field-wizard-form-previewer .form-previewer-section .box>header>.title .right {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.zr-field-wizard-form-previewer .form-previewer-section .box>header>.title .right .actions {
    visibility: hidden
}

.zr-field-wizard-form-previewer .form-previewer-section .box>header>.title .right .actions .icon {
    width: 24px;
    height: 24px
}

.zr-field-wizard-form-previewer .form-previewer-section .box>header>.description {
    font-size: 12px;
    font-size: .75rem;
    color: #9b9b9b;
    margin-top: 10px;
    margin-top: .625rem
}

.zr-field-wizard-form-previewer .form-previewer-section .box>.body .fields-wrapper {
    padding: 0 0 20px;
    padding: 0 0 1.25rem;
    margin: 0
}

.zr-field-wizard-form-previewer .form-previewer-section .box>.body .empty-placeholder {
    display: none;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #9b9b9b;
    padding: 30px 0;
    padding: 1.875rem 0
}

.zr-field-wizard-form-previewer .form-previewer-section.empty>.box>.body .empty-placeholder {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.zr-field-wizard-form-previewer .form-previewer-section.empty>.box>.body .empty-sort-placeholder {
    display: block
}

.zr-field-wizard-form-previewer .form-previewer-section[expandable] .expand-indicator {
    cursor: pointer;
    width: 24px;
    width: 1.5rem;
    height: 24px;
    height: 1.5rem;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 16px;
    font-size: 1rem
}

.zr-field-wizard-form-previewer .form-previewer-section[expandable] .expand-indicator .icon {
    -webkit-transition: -webkit-transform .2s;
    transition: -webkit-transform .2s;
    transition: transform .2s;
    transition: transform .2s, -webkit-transform .2s;
    fill: #9b9b9b;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.zr-field-wizard-form-previewer .form-previewer-section[expandable] .expand-indicator:hover .icon {
    fill: #666
}

.zr-field-wizard-form-previewer .form-previewer-section[expandable] .box>.body {
    -webkit-transition: height .2s linear;
    transition: height .2s linear;
    overflow: hidden;
    height: 0;
    display: none
}

.zr-field-wizard-form-previewer .form-previewer-section[expandable][expanded] .box>.body {
    height: auto;
    display: block
}

.zr-field-wizard-form-previewer .form-previewer-section[expandable][expanded] .box .expand-indicator .icon {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
}

.zr-field-wizard-form-previewer .form-previewer-section[expandable].expanding .box .body {
    display: block
}

.zr-field-wizard-form-previewer .form-previewer-section[remote] .box {
    border: 1px dashed transparent;
    border-radius: 2px
}

.zr-field-wizard-form-previewer .form-previewer-section[remote] .box>header {
    cursor: pointer
}

.zr-field-wizard-form-previewer .form-previewer-section[remote].active .box {
    border-color: #2bf;
    background: #f5f9ff
}

.zr-field-wizard-form-previewer .form-previewer-section[remote].active .box .title .right .actions {
    visibility: visible
}

.zr-field-wizard-form-previewer .form-previewer-section[sort] .box {
    border: 1px dashed transparent;
    border-radius: 2px
}

.zr-field-wizard-form-previewer .form-previewer-section[sort] .box>header>.title .left .icon.drag-icon {
    display: block
}

.zr-field-wizard-form-previewer .form-previewer-section[sort] .box>header>.description {
    padding-left: 24px;
    padding-left: 1.5rem
}

.zr-field-wizard-form-previewer .form-previewer-section[sort].tao-sortable-sorting .box {
    border-color: #2bf;
    background: #f5f9ff;
    visibility: visible!important
}

.zr-field-wizard-form-previewer .form-previewer-field {
    padding: 10px 20px;
    padding: .625rem 1.25rem;
    position: relative
}

.zr-field-wizard-form-previewer .form-previewer-field .form-input {
    margin-bottom: 0
}

.zr-field-wizard-form-previewer .form-previewer-field.easy-sort-placeholder {
    display: none
}

.zr-field-wizard-form-previewer .form-previewer-field .mask {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.zr-field-wizard-form-previewer .form-previewer-field .drag-icon {
    left: 20px;
    left: 1.25rem;
    cursor: move
}

.zr-field-wizard-form-previewer .form-previewer-field .actions,
.zr-field-wizard-form-previewer .form-previewer-field .drag-icon {
    position: absolute;
    top: 0;
    bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    visibility: hidden
}

.zr-field-wizard-form-previewer .form-previewer-field .actions {
    right: 20px;
    right: 1.25rem
}

.zr-field-wizard-form-previewer .form-previewer-field .actions .badge {
    border: 1px solid #dfdfdf;
    border-radius: .125rem;
    color: #ccc;
    background-color: transparent;
    padding: .1em .4em
}

.zr-field-wizard-form-previewer .form-previewer-field.active {
    background: #f5f9ff
}

.zr-field-wizard-form-previewer .form-previewer-field.active .mask {
    border: 1px dashed #2bf;
    border-radius: 2px
}

.zr-field-wizard-form-previewer .form-previewer-field.active .actions,
.zr-field-wizard-form-previewer .form-previewer-field.active .drag-icon {
    visibility: visible
}

.zr-field-wizard-form-previewer .form-previewer-field.tao-sortable-sorting {
    border: 1px dashed #2bf;
    background: #f5f9ff;
    visibility: visible!important
}

.zr-field-wizard-form-previewer .form-previewer-field .input-content .form-input {
    margin-bottom: 20px
}

.zr-field-wizard-form-previewer:not(.sorting) .form-previewer-field:hover {
    background: #f5f9ff
}

.zr-field-wizard-form-previewer:not(.sorting) .form-previewer-field:hover .actions,
.zr-field-wizard-form-previewer:not(.sorting) .form-previewer-field:hover .drag-icon {
    visibility: visible
}

.zr-field-wizard-form-previewer:not(.sorting) .form-previewer-section.active .form-previewer-field:hover {
    background: #fff
}

.zr-field-wizard-form-previewer,
.zr-field-wizard-form-previewer .tao-sortable {
    display: block
}

.zr-field-wizard-form-editor .meta-fields {
    position: -webkit-sticky;
    position: sticky;
    top: 30px;
    z-index: 100
}

.zr-field-wizard-form-editor .meta-fields .group {
    margin-bottom: 26px;
    margin-bottom: 1.625rem
}

.zr-field-wizard-form-editor .meta-fields .group .title {
    color: #9b9b9b;
    margin: 0 0 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.zr-field-wizard-form-editor .meta-fields .group .title .icon {
    fill: #9b9b9b;
    margin-left: 6px
}

.zr-field-wizard-form-editor .meta-fields .group .items {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.zr-field-wizard-form-editor .meta-fields .group .items .meta-field {
    display: inline-block;
    width: 128px;
    height: 40px;
    border: 1px solid #f3f3f3;
    padding: 0 10px;
    color: #4a4a4a;
    background: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 10px;
    -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);
    cursor: move
}

.zr-field-wizard-form-editor .meta-fields .group .items .meta-field .icon {
    fill: #9b9b9b;
    margin-right: 5px;
    width: 1.15em;
    height: 1.15em
}

.zr-field-wizard-form-editor .meta-fields .group .items .meta-field .icon-loading {
    display: none
}

.zr-field-wizard-form-editor .meta-fields .group .items .meta-field:not(.disabled):hover {
    border-color: #49e;
    -webkit-box-shadow: 0 1px 10px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 1px 10px 0 rgba(0, 0, 0, .15)
}

.zr-field-wizard-form-editor .meta-fields .group .items .meta-field.disabled {
    border-color: #f3f3f3;
    color: #ccc;
    cursor: not-allowed
}

.zr-field-wizard-form-editor .meta-fields .group .items .meta-field.disabled .icon {
    fill: #ccc
}

.zr-field-wizard-form-editor {
    margin: 30px auto;
    margin: 1.875rem auto;
    display: block;
    width: 1360px
}

.zr-field-wizard-form-editor .tao-sortable {
    display: block
}

.zr-field-wizard-form-editor main>.columns .left-column {
    width: 265px;
    margin-right: 30px
}

.zr-field-wizard-form-editor main>.columns .main-column {
    background: #fff
}

.zr-field-wizard-form-editor main>.columns .right-column {
    margin-left: 30px
}

.zr-field-wizard-form-editor .zr-field-wizard-form-previewer .form-previewer-field {
    padding-left: 10px;
    padding-right: 10px
}

.zr-field-wizard-form-editor .zr-field-wizard-form-previewer .form-previewer-field .form-input .input-label {
    width: 140px;
    width: 8.75rem
}

.zr-field-wizard-form-editor .zr-field-wizard-form-previewer .form-previewer-field .form-input .department-role-agent-handover+.bottom-hint,
.zr-field-wizard-form-editor .zr-field-wizard-form-previewer .form-previewer-field .form-input .zr-approval-time-length-field+.bottom-hint {
    margin-left: 170px!important;
    margin-left: 10.625rem!important
}

.zr-field-wizard-form-editor .zr-field-wizard-form-previewer .form-previewer-field .actions {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 120px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.zr-field-wizard-form-editor .zr-field-wizard-form-previewer .form-previewer-field .actions .badge {
    visibility: visible
}

.zr-field-wizard-form-editor .zr-field-wizard-form-previewer .form-previewer-field .actions .badge.with-tooltip {
    cursor: help
}

.zr-field-wizard-form-editor .zr-field-wizard-form-previewer .form-previewer-field .actions .icon {
    width: 24px;
    height: 24px
}

.zr-field-wizard-form-editor .zr-field-wizard-form-previewer .fields-wrapper form {
    min-height: 20px
}

.zr-field-wizard-form-editor .zr-field-wizard-form-previewer .meta-field {
    height: 56px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border: 1px dashed #2bf;
    border-radius: 2px;
    background: #f5f9ff
}

.zr-field-wizard-form-editor .zr-field-wizard-form-previewer .meta-field.tao-sortable-sorting {
    visibility: visible!important
}

.zr-field-wizard-form-editor .zr-field-wizard-form-previewer .meta-field .icon,
.zr-field-wizard-form-editor .zr-field-wizard-form-previewer .meta-field span {
    display: none
}

.zr-field-wizard-form-editor .zr-field-wizard-form-previewer .meta-field.creating .icon-loading {
    display: inline-block;
    fill: #9b9b9b
}

.zr-field-wizard-form-editor .meta-form-panel {
    position: -webkit-sticky;
    position: sticky;
    top: 30px
}

.zr-field-wizard-form-editor .meta-form-panel .body {
    padding-top: 20px;
    padding-top: 1.25rem;
    padding-bottom: 20px;
    padding-bottom: 1.25rem
}

.zr-field-wizard-form-editor .meta-form-panel .body .no-data {
    color: #9b9b9b;
    display: none
}

.zr-field-wizard-form-editor .meta-form-panel.empty .no-data {
    display: block
}

.zr-meta-field-collection-option .form-input .item {
    margin-bottom: 20px;
    margin-bottom: 1.25rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.zr-meta-field-collection-option .form-input .item>.form-input {
    margin: 0;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.zr-meta-field-collection-option .form-input .item>.form-input input {
    width: 100%
}

.zr-meta-field-collection-option .form-input .item .link-remove {
    margin-left: 10px
}

.zr-meta-field-collection-option .form-input .item .link-remove .icon {
    fill: #f75
}

.zr-meta-field-collection-option .form-input .item:first-child .link-remove {
    visibility: hidden
}

.zr-organization-structure>.root {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 12px 16px 12px 32px;
    padding: .75rem 1rem .75rem 2rem;
    cursor: pointer
}

.zr-organization-structure>.root .name {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0
}

.zr-organization-structure>.root .name .icon {
    fill: #666;
    margin-right: 8px;
    margin-right: .5rem
}

.zr-organization-structure>.root .actions {
    visibility: hidden
}

.zr-organization-structure>.root .actions a {
    margin: 0 4px;
    margin: 0 .25rem
}

.zr-organization-structure>.root:hover {
    background: #f5f9ff
}

.zr-organization-structure>.root:hover .actions {
    visibility: visible
}

.zr-organization-structure>.root.active {
    background: #f5f9ff;
    border: 1px dashed #2bf
}

.zr-organization-structure>.root.active .name {
    color: #5b3
}

.zr-organization-structure>.root.active .actions {
    visibility: visible
}

.zr-organization-structure .department-tree {
    margin: 10px 0 0 24px
}

.zr-organization-structure .department-tree>.tao-tree-list>.tao-tree-item[depth="0"]:first-child {
    position: relative
}

.zr-organization-structure .department-tree>.tao-tree-list>.tao-tree-item[depth="0"]:first-child:before {
    content: " ";
    position: absolute;
    height: 32px;
    height: 2rem;
    border-left: 1px solid #eee;
    left: 18px;
    left: 1.125rem;
    top: -8px;
    top: -.5rem;
    z-index: 1
}

.zr-organization-structure .tao-tree-item>.tao-tree-item-content {
    height: 48px;
    height: 3rem;
    padding: 0 16px 0 8px;
    padding: 0 1rem 0 .5rem
}

.zr-organization-structure .tao-tree-item>.tao-tree-item-content .link-toggle-item {
    z-index: 2
}

.zr-organization-structure .tao-tree-item.tao-sortable-sorting {
    border: 1px dashed #2bf;
    background: transparent;
    visibility: visible!important
}

.zr-organization-structure .tao-tree-item.tao-sortable-sorting>.tao-tree-item-content>.tao-tree-item-padding>.padding-item:before {
    left: 9px
}

.zr-organization-structure .tao-tree-item.active>.tao-tree-item-content {
    background: #f5f9ff;
    border: 1px dashed #2bf
}

.zr-organization-structure .tao-tree-item.active>.tao-tree-item-content>.tao-tree-item-padding>.padding-item:before {
    left: 9px
}

.zr-organization-structure .tao-tree-item.active>.tao-tree-item-content .name {
    color: #5b3;
    font-weight: 600
}

.zr-organization-structure .tao-tree-item.active>.tao-tree-item-content .actions {
    visibility: visible
}

.zr-organization-structure .tree-node {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 100%;
    position: relative;
    cursor: pointer
}

.zr-organization-structure .tree-node .name {
    color: #4a4a4a
}

.zr-organization-structure .tree-node .actions {
    visibility: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.zr-organization-structure .tree-node .actions a {
    margin: 0 4px;
    margin: 0 .25rem;
    font-size: 13px
}

.zr-organization-structure .tree-node .actions .link-delete-node,
.zr-organization-structure .tree-node .actions .link-edit-node {
    display: none
}

.zr-organization-structure .tree-node .actions .link-disable-node {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.zr-organization-structure .tree-node .actions .drag-icon {
    fill: #9b9b9b;
    cursor: move
}

.zr-organization-structure .tree-node>.department-node-form.tao-form {
    margin: 0;
    width: 100%
}

.zr-organization-structure .tree-node>.department-node-form.tao-form .form-input {
    margin-bottom: 0
}

.zr-organization-structure .tree-node>.department-node-form.tao-form .input-content {
    width: 100%;
    position: relative;
    min-height: 0
}

.zr-organization-structure .tree-node>.department-node-form.tao-form .input-content>.error {
    position: absolute;
    right: 112px;
    right: 7rem;
    top: 0;
    margin: 0;
    bottom: 0;
    line-height: 36px;
    line-height: 2.25rem
}

.zr-organization-structure .tree-node>.department-node-form.tao-form .form-field-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.zr-organization-structure .tree-node>.department-node-form.tao-form .form-field-wrapper .text-field {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.zr-organization-structure .tree-node>.department-node-form.tao-form .form-field-wrapper .text-field .input-field {
    border: 0;
    background: transparent;
    padding-left: 0;
    width: 100%
}

.zr-organization-structure .tree-node>.department-node-form.tao-form .form-field-wrapper .buttons {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.zr-organization-structure .tree-node>.department-node-form.tao-form .form-field-wrapper .buttons .button,
.zr-organization-structure .tree-node>.department-node-form.tao-form .form-field-wrapper .buttons .link-cancel {
    margin: 0 8px;
    margin: 0 .5rem
}

.zr-organization-structure .tree-node>.department-node-form.tao-form .form-field-wrapper .buttons .link-cancel {
    font-size: 12px;
    font-size: .75rem;
    color: #9b9b9b
}

.zr-organization-structure .tree-node>.department-node-form.tao-form .form-field-wrapper .buttons .link-cancel:hover {
    color: #ccc
}

.zr-organization-structure .tree-node.department-node-editing {
    display: none
}

.zr-organization-structure[allow-edit] .tree-node {
    cursor: default
}

.zr-organization-structure[allow-edit] .tree-node .actions .link-edit-node {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.zr-organization-structure[allow-delete] .tree-node {
    cursor: default
}

.zr-organization-structure[allow-delete] .tree-node .actions .link-disable-node {
    display: none
}

.zr-organization-structure[allow-delete] .tree-node .actions .link-delete-node {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.zr-organization-structure .tao-tree-item-content.editing .tree-node.department-node-editing {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.zr-organization-structure .tao-tree-item-content.editing .tree-node.department-node {
    display: none
}

.zr-organization-structure:not(.sorting) .tao-tree-item>.tao-tree-item-content:hover {
    background: #f5f9ff
}

.zr-organization-structure:not(.sorting) .tao-tree-item>.tao-tree-item-content:hover .actions {
    visibility: visible
}

.page.zr-core-initialization-start-stages-show-page>main {
    width: 1020px;
    padding: 50px;
    text-align: center
}

.page.zr-core-initialization-start-stages-show-page>main>h2 {
    font-weight: 400;
    line-height: 2;
    margin-bottom: 0
}

.page.zr-core-initialization-start-stages-show-page>main .desc {
    font-size: 16px;
    font-size: 1rem;
    color: #9b9b9b
}

.page.zr-core-initialization-start-stages-show-page>main .videos {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 40px auto;
    width: 660px
}

.page.zr-core-initialization-start-stages-show-page>main .videos .zr-video {
    width: 200px;
    margin-bottom: 16px
}

.page.zr-core-initialization-start-stages-show-page>main .more {
    margin-bottom: 40px
}

.page.zr-core-initialization-start-stages-show-page .feedback-content {
    width: 540px;
    height: 180px
}

.page.zr-core-initialization-human-import-stages-show-page>main {
    width: 960px;
    text-align: center;
    padding: 60px
}

.page.zr-core-initialization-human-import-stages-show-page>main .links {
    margin: 40px 0 0
}

.page.zr-core-initialization-human-import-stages-show-page>main .links .link {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #ccc;
    fill: #ccc
}

.page.zr-core-initialization-human-import-stages-show-page>main .links .link:hover {
    color: #9b9b9b;
    fill: #9b9b9b
}

.page.zr-core-initialization-attendance-rule-stages-new-page .attendance-rule-stage-form .break-time-range {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 320px;
    width: 20rem
}

.page.zr-core-initialization-attendance-rule-stages-new-page .attendance-rule-stage-form .break-time-range .tao-time-picker {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: 50%
}

.page.zr-core-initialization-attendance-rule-stages-new-page .attendance-rule-stage-form .break-time-range .to {
    font-size: 14px;
    font-size: .875rem;
    color: #ccc;
    margin: 0 8px;
    margin: 0 .5rem
}

.page.zr-core-initialization-attendance-rule-stages-new-page .attendance-rule-stage-form.tao-form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 48px;
    margin-top: 3rem
}

.page.zr-core-initialization-attendance-rule-stages-new-page .attendance-rule-stage-form.tao-form form {
    -ms-flex-preferred-size: 76%;
    flex-basis: 76%
}

.page.zr-core-initialization-attendance-rule-stages-new-page .attendance-rule-stage-form.tao-form form .form-buttons {
    margin-top: 48px;
    margin-top: 3rem;
    margin-left: 0;
    text-align: center
}

.page.zr-core-initialization-structure-stages-show-page .structure-container {
    margin: 48px 0;
    margin: 3rem 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-height: 240px;
    min-height: 15rem
}

.page.zr-core-initialization-structure-stages-show-page .structure-container .zr-organization-structure {
    -ms-flex-preferred-size: 70%;
    flex-basis: 70%
}

.page.zr-core-initialization-structure-stages-show-page main>.buttons {
    margin: 32px 0 0;
    margin: 2rem 0 0;
    text-align: center
}

.page.zr-core-initialization-structure-stages-show-page main>.buttons .button {
    margin: 0 12px;
    margin: 0 .75rem
}

.page.zr-core-initialization-job-title-stages-new-page .job-title-stage-form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 48px;
    margin-top: 3rem
}

.page.zr-core-initialization-job-title-stages-new-page .job-title-stage-form form .job-title-field-container {
    position: relative
}

.page.zr-core-initialization-job-title-stages-new-page .job-title-stage-form form .job-title-field-container .link-remove-job-title {
    position: absolute;
    top: 0;
    right: -26.4px;
    right: -1.65rem;
    bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 18px;
    font-size: 1.125rem;
    outline: none
}

.page.zr-core-initialization-job-title-stages-new-page .job-title-stage-form form .link-new-job-title {
    margin: 12px 0 0;
    margin: .75rem 0 0;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.page.zr-core-initialization-job-title-stages-new-page .job-title-stage-form form .link-new-job-title .icon {
    margin: 0 4px 0 0;
    margin: 0 .25rem 0 0;
    width: 1.35em;
    height: 1.35em
}

.page.zr-core-initialization-job-title-stages-new-page .job-title-stage-form form .form-buttons {
    margin-top: 48px;
    margin-top: 3rem;
    margin-left: 0;
    text-align: center
}

.page.zr-core-initialization-human-stages-new-page .human-stage-form.tao-form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 48px;
    margin-top: 3rem
}

.page.zr-core-initialization-human-stages-new-page .human-stage-form.tao-form form {
    -ms-flex-preferred-size: 76%;
    flex-basis: 76%
}

.page.zr-core-initialization-human-stages-new-page .human-stage-form.tao-form form .form-buttons {
    margin-top: 48px;
    margin-top: 3rem;
    margin-left: 0;
    text-align: center
}

.zr-datatable .human-avatar-column {
    width: 76px;
    padding-left: 20px
}

.zr-datatable .human-avatar-column .avatar {
    vertical-align: middle
}

.zr-datatable th.human-info-column {
    width: 260px;
    width: 16.25rem
}

.zr-datatable td.human-info-column {
    height: 100px
}

.zr-datatable .human-info-cell .name {
    font-size: 18px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.zr-datatable .human-info-cell .name .badge {
    margin-left: 10px;
    margin-left: .625rem
}

.zr-datatable .human-info-cell .description {
    margin-top: 4px
}

.zr-datatable.roster-table .human-phone-number-column {
    width: 146px;
    width: 9.125rem
}

.zr-datatable.roster-table .enrollment-column .status {
    margin-right: 10px;
    margin-right: .625rem
}

.zr-core-rosters-show-page .summary {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 120px;
    height: 7.5rem;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    margin-top: 26px;
    margin-top: 1.625rem
}

.zr-core-rosters-show-page .summary ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
    height: 100%
}

.zr-core-rosters-show-page .summary ul:after,
.zr-core-rosters-show-page .summary ul:before {
    content: "";
    display: block
}

.zr-core-rosters-show-page .summary ul li {
    text-align: center
}

.zr-core-rosters-show-page .summary ul li.separator {
    border-left: 1px solid #dfdfdf;
    height: 40px;
    height: 2.5rem
}

.zr-core-rosters-show-page .summary ul li a:hover .label,
.zr-core-rosters-show-page .summary ul li a:hover .value {
    color: #49e
}

.zr-core-rosters-show-page .summary ul li .label {
    font-size: 12px;
    font-size: .75rem;
    color: #9b9b9b;
    line-height: 1.33
}

.zr-core-rosters-show-page .summary ul li .value {
    font-size: 24px;
    font-size: 1.5rem;
    color: #4a4a4a;
    line-height: 1.17;
    margin-top: 6px;
    margin-top: .375rem
}

.zr-core-rosters-show-page .summary ul li.dimission-count>a,
.zr-core-rosters-show-page .summary ul li.total-count>a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.zr-core-rosters-show-page .summary ul li.dimission-count>a .value,
.zr-core-rosters-show-page .summary ul li.total-count>a .value {
    font-size: 36px;
    font-size: 2.25rem;
    margin-top: 0;
    margin-left: 14px;
    margin-left: .875rem;
    line-height: .78
}

.human-profile-left-nav {
    position: -webkit-sticky;
    position: sticky;
    top: 30px;
    top: 1.875rem
}

.human-profile-panel .panel {
    margin-bottom: 20px;
    margin-bottom: 1.25rem
}

.human-profile-panel .panel .body {
    padding-top: 2em;
    padding-bottom: 2em
}

.human-profile-panel .panel .body .edit-form-wrapper {
    display: none
}

.human-profile-panel .panel .body .tao-form {
    margin-top: 0
}

.human-profile-panel:last-child .panel {
    margin-bottom: 0
}

.human-profile-panel.editing .panel .title .link-edit {
    display: none
}

.human-profile-panel.editing .panel .body {
    background: #fffcf7
}

.human-profile-panel.editing .panel .body .field-value-wrapper {
    display: none
}

.human-profile-panel.editing .panel .body .edit-form-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.human-profile-panel .human-profile-form .form-buttons {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.human-profile-panel .human-profile-form .form-buttons .link-cancel {
    color: #666;
    margin: 0 0 0 32px;
    margin: 0 0 0 2rem
}

.human-profile-panel .human-profile-form .form-buttons .link-cancel:hover {
    color: #9b9b9b
}

.zr-core-human-profiles-show-page .panel.human-profile-field-hint .body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #9b9b9b;
    font-size: 12px;
    font-size: .75rem
}

.page[layout=main]>main>.human-profile-header.box {
    padding: 0;
    margin: 0;
    width: 100%;
    background: #fff
}

.page[layout=main]>main>.human-profile-header.box>header {
    padding: 48px 0;
    width: 1260px;
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative
}

.page[layout=main]>main>.human-profile-header.box>header .actions {
    position: absolute;
    top: 30px;
    top: 1.875rem;
    right: 0
}

.page[layout=main]>main>.human-profile-header.box>header .actions .button {
    margin-left: 10px;
    margin-left: .625rem
}

.page[layout=main]>main>.human-profile-header.box>header .actions .button-more {
    padding-right: 12px;
    padding-right: .75rem
}

.page[layout=main]>main>.human-profile-header.box>header .actions .button-more .icon {
    margin-right: 0;
    margin-left: .5em
}

.page[layout=main]>main>.human-profile-header.box>header .content {
    margin: 0 0 0 30px;
    margin: 0 0 0 1.875rem
}

.page[layout=main]>main>.human-profile-header.box>header .content .name {
    font-size: 30px;
    font-size: 1.875rem;
    line-height: 1.07;
    margin: 12px 0 14px;
    margin: .75rem 0 .875rem
}

.page[layout=main]>main>.human-profile-header.box>header .content .name .staff-number {
    font-size: 14px;
    font-size: .875rem;
    font-weight: 400;
    color: #ccc;
    margin-left: 8px;
    margin-left: .5rem
}

.page[layout=main]>main>.human-profile-header.box>header .content .identity-information {
    list-style: none;
    margin: 14px 0 0;
    margin: .875rem 0 0;
    padding: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #9b9b9b
}

.page[layout=main]>main>.human-profile-header.box>header .content .identity-information li {
    margin-right: 16px;
    margin-right: 1rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    line-height: 1.07
}

.page[layout=main]>main>.human-profile-header.box>header .content .identity-information li .icon {
    margin-right: 4px;
    margin-right: .25rem
}

.page[layout=main]>main>.human-profile-header.box>.banner {
    border-top: 1px solid #eee;
    background: #fff
}

.page[layout=main]>main>.human-profile-header.box>.banner nav {
    width: 1260px;
    margin: 0 auto;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.human-profile-header .employment-status .badge {
    margin-right: 6px;
    border: 1px solid transparent;
    border-radius: 2px;
    font-weight: 400;
    line-height: 1.58;
    padding: 0 4px
}

.human-profile-header .employment-status .date-badge {
    background-color: transparent;
    border: 1px solid transparent
}

.human-profile-header .employment-status.identity-state-onboarding .status-badge {
    background-color: #2bf
}

.human-profile-header .employment-status.identity-state-onboarding .date-badge {
    color: #2bf;
    border-color: #2bf
}

.human-profile-header .employment-status.identity-state-in-service.employment-status-regular .status-badge {
    background-color: #5b3
}

.human-profile-header .employment-status.identity-state-in-service.employment-status-regular .date-badge {
    color: #5b3;
    border-color: #5b3
}

.human-profile-header .employment-status.identity-state-in-service.employment-status-probation .status-badge {
    background-color: #fa0
}

.human-profile-header .employment-status.identity-state-in-service.employment-status-probation .date-badge {
    color: #fa0;
    border-color: #fa0
}

.human-profile-header .employment-status.identity-state-in-service.employment-status-departing .status-badge {
    background-color: #f75
}

.human-profile-header .employment-status.identity-state-in-service.employment-status-departing .date-badge {
    color: #f75;
    border-color: #f75
}

.human-profile-header .employment-status.identity-state-dimission .status-badge {
    background-color: #9b9b9b
}

.human-profile-header .employment-status.identity-state-dimission .date-badge {
    color: #9b9b9b;
    border-color: #9b9b9b
}

.zr-core-profile-attachments-index-page .panel .body {
    padding-bottom: 20px;
    padding-bottom: 1.25rem
}

.zr-core-profile-datebooks-index-page .datebooks {
    padding: 32px 20px;
    padding: 2rem 1.25rem
}

.zr-core-profile-datebooks-index-page .datebooks .datebook {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    position: relative;
    margin-left: 12px;
    margin-left: .75rem;
    padding: 0 0 24px 32px;
    padding: 0 0 1.5rem 2rem;
    border-left: 1px solid #f3f3f3;
    color: #9b9b9b;
    font-size: 12px;
    font-size: .75rem;
    line-height: 24px;
    line-height: 1.5rem
}

.zr-core-profile-datebooks-index-page .datebooks .datebook:last-child {
    border-left-color: transparent;
    padding-bottom: 0
}

.zr-core-profile-datebooks-index-page .datebooks .datebook .icon-wrapper {
    border-radius: 50%;
    background: #f6f6f6;
    width: 24px;
    width: 1.5rem;
    height: 24px;
    height: 1.5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    top: 0;
    left: -12px;
    left: -.75rem
}

.zr-core-profile-datebooks-index-page .datebooks .datebook .icon-wrapper .icon {
    width: 1.15em;
    height: 1.15em
}

.zr-core-profile-datebooks-index-page .datebooks .datebook .timestamp {
    margin-right: 48px;
    margin-right: 3rem
}

.zr-core-profile-datebooks-index-page .datebooks .datebook .content span {
    color: #4a4a4a;
    margin-right: 2px
}

.zr-core-profile-datebooks-index-page .datebooks .datebook .content span.highlight {
    color: #5b3;
    margin-right: 0;
    margin-left: 2px
}

.zr-core-profile-datebooks-index-page .datebooks .datebook .content ul {
    margin: 0;
    padding: 0;
    list-style: none
}

.human-employment-information-form.tao-form .form-input-employment-status-for-dimission,
.human-employment-information-form.tao-form .form-input-planned-join-date {
    display: none
}

.human-employment-information-form.tao-form[state=onboarding] .form-input-planned-join-date {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.human-employment-information-form.tao-form[state=dimission] .form-input-employment-status,
.human-employment-information-form.tao-form[state=onboarding] .form-input-join-date {
    display: none
}

.human-employment-information-form.tao-form[state=dimission] .form-input-employment-status-for-dimission {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.zr-core-human-list>.description {
    display: block
}

.zr-core-human-list>.actions {
    display: none
}

.zr-core-human-list>.actions,
.zr-core-human-list>.description {
    height: 40px;
    margin: 0;
    line-height: 40px
}

.zr-core-human-list>.actions {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.zr-core-human-list>.actions>.left,
.zr-core-human-list>.actions>.right {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.zr-core-human-list>.actions>.right>.button {
    margin-left: 10px
}

.zr-core-human-list ul {
    margin: 0;
    padding: 0
}

.zr-core-human-list ul li {
    height: 50px;
    list-style: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    border-bottom: 1px solid #eee
}

.zr-core-human-list ul li:first-child {
    border-top: 1px solid #eee
}

.zr-core-human-list ul li>.select-human-check-box {
    margin-right: 10px;
    display: none
}

.zr-core-human-list ul li>.human-name {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    margin: 0 10px
}

.zr-core-human-list ul li>.job-title {
    color: #ccc
}

.zr-core-human-list[editing] .description {
    display: none
}

.zr-core-human-list[editing] .actions,
.zr-core-human-list[editing] ul li .select-human-check-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.zr-core-structures-index-page .zr-core-structures-editor>.box,
.zr-core-structures-index-page .zr-core-structures-editor>.columns {
    width: 100%;
    margin: 30px auto 0
}

.zr-core-structures-index-page .zr-core-structures-editor>.columns {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.zr-core-structures-index-page .zr-core-structures-editor>.columns>.main-column {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto
}

.zr-core-structures-index-page .zr-core-structures-editor>.columns>.right-column {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: 400px;
    border-left: thin solid #eee
}

.zr-core-structures-index-page .zr-core-structures-editor .department-details .box {
    padding-top: 0
}

.zr-core-structures-index-page .zr-core-structures-editor .department-details .current-structure-department.title {
    border: none;
    padding: 12px 0;
    padding: .75rem 0
}

.zr-core-structures-index-page .zr-core-structures-editor .department-details .description {
    color: #ccc;
    text-align: center
}

.zr-core-structures-index-page .zr-core-structures-editor .department-details .tabs {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 20px 0
}

.zr-core-structures-index-page .zr-core-structures-editor .department-details thead {
    display: none
}

.zr-core-structures-index-page .zr-core-structures-editor .department-details .human-avatar-column {
    width: 32px;
    width: 2rem
}

.zr-core-structures-index-page .zr-core-structures-editor .department-details .cell-job-title {
    color: #ccc
}

.zr-core-structures-index-page .zr-core-structures-editor .department-details .form-buttons.left {
    -webkit-box-pack: left;
    -ms-flex-pack: left;
    justify-content: left
}

.zr-core-structures-index-page .zr-core-structures-editor .department-details .form-buttons.left button {
    margin-left: 0
}

.zr-core-structures-index-page .help-link {
    color: #ccc;
    font-size: 12px;
    font-size: .75rem;
    padding-left: 160px
}

.zr-core-structures-index-page .tao-form.narrow .help-link {
    padding-left: 0
}

.zr-core-human-field-settings-index-page {
    width: 100%;
    height: 100%;
    overflow: scroll
}

.zr-core-human-field-settings-index-page .editor-wrapper {
    width: 100%;
    height: calc(100% - 80px);
    overflow: scroll
}

.zr-core-human-field-settings-index-page .form-editor-section-form form .form-input.zr_field_wizard_form_editor_meta_form_bottom_hint {
    display: none
}

.zr-core-human-field-settings-index-page .tao-form.human-field-setting-edit-form {
    margin: 18px auto;
    margin: 1.125rem auto
}

.zr-core-human-field-settings-index-page .tao-form.human-field-setting-edit-form form .form-input.input-options-collection .label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 6px;
    margin-bottom: .375rem
}

.zr-core-human-field-settings-index-page .tao-form.human-field-setting-edit-form form .form-input.input-options-collection .label .input-label {
    width: auto
}

.zr-core-human-field-settings-index-page .tao-form.human-field-setting-edit-form form .form-input.input-options-collection .label .hint {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #ccc;
    font-size: 12px;
    font-size: .75rem
}

.zr-core-human-field-settings-index-page .tao-form.human-field-setting-edit-form form .form-input.input-options-collection .label .hint .icon {
    margin-right: 5px;
    fill: #ccc
}

.zr-core-human-field-settings-index-page .tao-form.human-field-setting-edit-form form .form-input.input-options-collection .content .text-field:not(:last-child) {
    margin-bottom: 10px
}

.zr-core-human-field-settings-index-page .tao-form.human-field-setting-edit-form form .form-buttons {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin-top: 26px;
    margin-top: 1.625rem
}

.zr-core-human-field-settings-index-page .tao-form.human-field-setting-edit-form form .form-buttons .button {
    margin-left: 0
}

.zr-core-structure-disabled-departments-index-page .zr-datatable .disabled-at,
.zr-core-structure-disabled-departments-index-page .zr-datatable .disabled-parent {
    color: #9b9b9b
}

zr-core-staff-number-rule[disable-auto-generate] .form-input.zr_core_staff_number_rule_left_padded,
zr-core-staff-number-rule[disable-auto-generate] .form-input.zr_core_staff_number_rule_max_length,
zr-core-staff-number-rule[disable-auto-generate] .form-input.zr_core_staff_number_rule_prefix,
zr-core-staff-number-rule[disable-auto-generate] .form-input.zr_core_staff_number_rule_start_at {
    display: none
}

.zr-core-reporting-relationships-index-page .leader-field-disabled {
    text-align: center;
    padding: 80px 0
}

.zr-core-reporting-relationships-index-page .leader-field-disabled .description {
    color: #9b9b9b
}

.zr-core-reporting-relationships-index-page .reporting-relationship {
    margin-top: 30px;
    margin-top: 1.875rem;
    display: block
}

.zr-core-reporting-relationships-index-page .reporting-relationship>.root {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 12px 16px 12px 32px;
    padding: .75rem 1rem .75rem 2rem
}

.zr-core-reporting-relationships-index-page .reporting-relationship>.root .name {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0
}

.zr-core-reporting-relationships-index-page .reporting-relationship>.root .name .icon {
    fill: #666;
    margin-right: 8px;
    margin-right: .5rem
}

.zr-core-reporting-relationships-index-page .reporting-relationship>.reporting-relationship-tree {
    margin: 10px 0 0 24px
}

.zr-core-reporting-relationships-index-page .reporting-relationship>.reporting-relationship-tree>.tao-tree-list>.tao-tree-item[depth="0"]:first-child {
    position: relative
}

.zr-core-reporting-relationships-index-page .reporting-relationship>.reporting-relationship-tree>.tao-tree-list>.tao-tree-item[depth="0"]:first-child:before {
    content: " ";
    position: absolute;
    height: 32px;
    height: 2rem;
    border-left: 1px solid #eee;
    left: 18px;
    left: 1.125rem;
    top: -8px;
    top: -.5rem;
    z-index: 1
}

.zr-core-reporting-relationships-index-page .reporting-relationship>.reporting-relationship-tree .tao-tree-item>.tao-tree-item-content {
    height: 48px;
    height: 3rem;
    padding: 0 16px 0 8px;
    padding: 0 1rem 0 .5rem
}

.zr-core-reporting-relationships-index-page .reporting-relationship>.reporting-relationship-tree .tao-tree-item>.tao-tree-item-content:hover {
    background: #f6f6f6
}

.zr-core-reporting-relationships-index-page .reporting-relationship>.reporting-relationship-tree .tao-tree-item>.tao-tree-item-content:hover .actions {
    visibility: visible
}

.zr-core-reporting-relationships-index-page .reporting-relationship>.reporting-relationship-tree .tao-tree-item>.tao-tree-item-content .link-toggle-item {
    z-index: 2
}

.zr-core-reporting-relationships-index-page .reporting-relationship>.reporting-relationship-tree .tao-tree-item .tree-node {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 100%
}

.zr-core-reporting-relationships-index-page .reporting-relationship>.reporting-relationship-tree .tao-tree-item .tree-node .human-information {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.zr-core-reporting-relationships-index-page .reporting-relationship>.reporting-relationship-tree .tao-tree-item .tree-node .human-information .name {
    margin: 0 26px 0 10px;
    margin: 0 1.625rem 0 .625rem
}

.zr-core-reporting-relationships-index-page .reporting-relationship>.reporting-relationship-tree .tao-tree-item .tree-node .human-information .department-name {
    color: #ccc;
    font-size: 13px
}

.zr-core-reporting-relationships-index-page .reporting-relationship>.reporting-relationship-tree .tao-tree-item .tree-node .actions {
    visibility: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.zr-core-reporting-relationships-index-page .reporting-relationship>.reporting-relationship-tree .tao-tree-item .tree-node .actions a {
    margin: 0 4px;
    margin: 0 .25rem;
    font-size: 13px
}

.employment-nav-tabs+.link-employment-approval-setting {
    position: absolute;
    right: 40px;
    top: 30px;
    line-height: 60px
}

.employment-summary {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 26px 0;
    margin: 1.625rem 0;
    color: #9b9b9b;
    height: 36px;
    height: 2.25rem
}

.employment-summary .right>.button {
    margin-left: 10px
}

.zr-datatable.employment-roster-table th.links {
    width: 180px
}

.zr-datatable.employment-roster-table tbody td.links .actions-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.zr-datatable.employment-roster-table tbody td.links .actions-wrapper .current-status {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #9b9b9b
}

.zr-datatable.employment-roster-table tbody td.links .actions-wrapper .current-status .icon {
    fill: #9b9b9b;
    width: 1.15em;
    height: 1.15em;
    margin-right: 4px;
    margin-right: .25rem
}

.employment-no-data-wizard.zr-wizard.unordered {
    padding: 160px 0;
    padding: 10rem 0
}

.employment-no-data-wizard.zr-wizard.unordered .step {
    width: 25%
}

.employment-no-data-wizard.zr-wizard.unordered .step:before {
    height: 0;
    border-bottom: 2px dashed #dfdfdf;
    top: 10px;
    background: transparent
}

.employment-no-data-wizard.zr-wizard.unordered .step .title {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: -40px;
    margin-top: -2.5rem;
    font-size: 14px;
    font-size: .875rem
}

.employment-no-data-wizard.zr-wizard.unordered .step .title .number {
    background: #f6f6f6;
    width: 100px;
    width: 6.25rem;
    height: 100px;
    height: 6.25rem;
    margin: 0;
    position: relative;
    top: 0;
    left: 0;
    border-radius: 50%;
    border-color: #fff;
    border-width: 6px
}

.employment-no-data-wizard.zr-wizard.unordered .step .title .number:after {
    content: none
}

.employment-no-data-wizard.zr-wizard.unordered .step .title .number .icon {
    width: 2em;
    height: 2em;
    fill: #9b9b9b
}

.employment-no-data-wizard.zr-wizard.unordered .step .title .name {
    margin-top: 14px;
    margin-top: .875rem;
    color: #666
}

.employment-onboarding-form form .form-input-planned-probation-end-date.form-input {
    display: none
}

.employment-onboarding-form form .form-input-planned-probation-end-date.form-input.show {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.zr-core-employment-onboardings-new-page .enrollment-hint {
    margin: 20px 0 0 190px;
    margin: 1.25rem 0 0 11.875rem;
    color: #9b9b9b;
    font-size: 12px;
    font-size: .75rem
}

.enrollment-invitation-dialog .weapp-qrcode,
.enrollment-invitation-dialog .weapp-qrcode .label {
    margin: 20px 0;
    margin: 1.25rem 0;
    text-align: center
}

.enrollment-invitation-dialog .weapp-qrcode .qrcode {
    width: 180px;
    width: 11.25rem;
    height: 200px;
    height: 12.5rem;
    margin: 0 auto;
    border: 1px solid #dfdfdf;
    overflow: hidden
}

.enrollment-invitation-dialog .weapp-qrcode .qrcode img {
    width: 100%
}

.zr-core-employment-enrollment-confirmations-show-page {
    padding-bottom: 30px;
    padding-bottom: 1.875rem
}

.zr-core-employment-enrollment-confirmations-show-page>main {
    max-width: 1260px;
    margin: 30px auto 0;
    margin: 1.875rem auto 0;
    min-height: calc(100% - 1.875rem);
    background-color: #fff
}

.zr-core-employment-enrollment-confirmations-show-page>main .form-values .section {
    margin-bottom: 60px;
    margin-bottom: 3.75rem;
    padding: 0 160px;
    padding: 0 10rem
}

.zr-core-employment-enrollment-confirmations-show-page>main .form-values .section:first-child {
    margin-top: 60px;
    margin-top: 3.75rem
}

.zr-core-employment-enrollment-confirmations-show-page>main .form-values .section>h4 {
    font-size: 18px;
    font-size: 1.125rem;
    font-weight: 400;
    line-height: 1.44
}

.zr-core-employment-enrollment-confirmations-show-page>main .form-values .section .form-field-value .value img {
    width: 100%
}

.zr-core-employment-enrollments-index-page .weapp-qrcode img {
    width: 180px
}

.zr-core-enrollment-authentications-new-page {
    min-height: 100%
}

.zr-core-enrollment-authentications-new-page main {
    max-width: 1000px;
    margin: 30px auto;
    margin: 1.875rem auto
}

.zr-core-enrollment-authentications-new-page main .authentication-form-wrapper {
    background-color: #fff;
    padding: 60px 0 32px;
    padding: 3.75rem 0 2rem;
    min-height: 200px;
    text-align: center
}

.zr-core-enrollment-authentications-new-page main .authentication-form-wrapper .human-name {
    font-weight: 400;
    font-size: 24px;
    font-size: 1.5rem;
    line-height: normal;
    margin-bottom: 10.16px;
    margin-bottom: .635rem
}

.zr-core-enrollment-authentications-new-page main .authentication-form-wrapper .organization-name {
    font-weight: 600;
    line-height: 1.78;
    margin: 0
}

.zr-core-enrollment-authentications-new-page main .authentication-form-wrapper .description {
    color: #9b9b9b;
    line-height: normal;
    margin: 30px 0 40px;
    margin: 1.875rem 0 2.5rem
}

.zr-core-enrollment-authentications-new-page main .authentication-form-wrapper .tao-form {
    width: 620px;
    margin: 2em auto 0;
    text-align: left
}

.zr-core-enrollment-authentications-new-page main .authentication-form-wrapper .tao-form .form-buttons {
    margin-left: 0;
    text-align: center
}

.zr-core-enrollments-new-page {
    min-height: 100%
}

.zr-core-enrollments-new-page main {
    max-width: 1260px;
    margin: 30px auto auto;
    min-height: 200px;
    background-color: #fff
}

.zr-core-enrollments-new-page main .enrollment-form {
    padding: 40px 40px 40px 160px;
    padding: 2.5rem 2.5rem 2.5rem 10rem
}

.zr-core-enrollments-new-page main .message {
    text-align: center;
    padding: 130px 0;
    padding: 8.125rem 0
}

.zr-core-enrollments-new-page main .message img {
    width: 160px;
    width: 10rem;
    margin-bottom: 32px;
    margin-bottom: 2rem
}

.zr-core-enrollments-new-page main .message p {
    line-height: normal;
    font-size: 18px;
    font-size: 1.125rem
}
