.layui-table-view {
    margin: 0
}

.layui-form-switch {
    margin-top: unset
}

.layui-form-switch em {
    margin-right: 5px
}

.layui-form-onswitch em {
    margin-right: 21px
}

.layui-table-tips-main {
    overflow-y: auto
}

.layui-form-select dl {
    z-index: 1000
}

.multi dl dd.layui-this {
    background-color: #fff !important
}

.layui-layer-open-page .layui-layer-content {
    overflow: visible !important
}

.layui-table-page .layui-laypage button {
    background-color: #009688 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    line-height: 24px
}

.layui-table-header, .layui-table-total, .layui-table-total tr, .layui-table-patch, .layui-table-mend, .layui-table[lay-even] tr:nth-child(even), .layui-table tbody tr:hover, .layui-table-hover, .layui-table-click {
    background-color: rgba(48,166,255,0.15)
}

.layui-table-tool {
    background-color: #fff;
    min-height: 35px;
    padding: 0;
    z-index: 4
}

.layui-table-tool-self {
    top: 0
}

.layui-table-tool .layui-inline[lay-event] {
    padding: 3px;
    border: 0;
    line-height: 18px
}

.layui-table-tool .layui-inline[lay-event] > .layui-icon {
    font-size: 18px
}

.layui-table-body {
    margin-bottom: 0
}

.layout-tree-table table.layui-table {
    background-color: transparent
}

.layout-note textarea {
    display: block;
    width: 280px;
    height: 130px;
    min-width: 280px;
    min-height: 130px;
    line-height: 20px;
    margin: 0;
    padding: 10px;
    border: 0;
    color: #666;
    word-wrap: break-word;
    resize: both
}

.layout-note textarea:focus {
    border: 0
}

.layui-select-disabled .layui-disabled {
    background-color: #eee !important;
    color: #000 !important;
    border: #c9c9c9 solid 1px !important
}

.text-red.layui-form-radio > i:hover, .text-red.layui-form-radioed > i {
    color: #ed5565
}

.text-green.layui-form-radio > i:hover, .text-green.layui-form-radioed > i {
    color: #5fb878
}

.text-yellow.layui-form-radio > i:hover, .text-yellow.layui-form-radioed > i {
    color: #f8ac59
}

.text-black.layui-form-radio > i:hover, .text-black.layui-form-radioed > i {
    color: #333
}

.layui-laypage a, .layui-laypage span {
    margin-bottom: 0 !important
}

.layui-table-page {
    min-height: 41px;
    height: auto !important;
    white-space: normal !important;
    margin-bottom: 0 !important
}

.layui-table-page > div {
    min-height: 26px;
    height: auto !important
}

.layui-table-fixed.layui-table-fixed-scroll .layui-table-body:hover {
    overflow-y: auto
}

.layui-table-fixed-r.layui-table-fixed-scroll:hover {
    right: 0 !important
}

.layui-table-fixed-l.layui-table-fixed-scroll:hover {
    overflow: hidden
}

.layui-colorpicker-main {
    width: 296px
}

.layui-layedit-tool .layui-colorpicker-xs {
    border: 0;
    width: 32px;
    height: 32px
}

.layui-layedit-tool .layui-colorpicker-trigger-span i {
    display: none
}

.layui-table-fixed {
    z-index: 3
}

.layui-table td .layui-form-select .layui-input {
    height: 28px
}

.layui-table td .layui-form-select dl {
    top: 0
}

::-webkit-scrollbar {
    width: 6px;
    height: 8px;
    background-color: #ddd
}

::-webkit-scrollbar-thumb {
    background-color: #aaa
}

input[type=number] {
    -moz-appearance: textfield
}

input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

* {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

html {
    height: 100%;
    margin: 0;
    padding: 0;
    border: 0
}

body {
    margin: 0;
    padding: 0;
    border: 0;
    overflow: auto;
    font-size: 14px;
    font-family: "Microsoft YaHei", Helvetica Neue, Helvetica, PingFang SC, Tahoma, Arial, sans-serif;
    min-width: 768px
}

iframe {
    height: 100%;
    width: 100%;
    border: 0
}

article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
    display: block;
    margin: 0;
    padding: 0
}

ol, ul, h1, h2, h3, h4, h5, h6, p, th, td, dl, dd, form, fieldset, legend, input, textarea, select {
    margin: 0;
    padding: 0
}

a {
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: baseline;
    background: transparent;
    text-decoration: none
}

a:hover {
    text-decoration: none
}

nav ul ol {
    list-style: none
}

button {
    display: inline-block;
    height: 30px;
    line-height: 28px;
    padding: 0 15px;
    background-color: #009688;
    color: #fff;
    white-space: nowrap;
    text-align: center;
    border: 1px solid #009688;
    border-radius: 0;
    cursor: pointer;
    margin: 2px 0;
    user-select: none
}

input {
    height: 30px;
    line-height: 30px;
    padding: 0 5px;
    white-space: nowrap;
    border: #c9c9c9 solid 1px;
    border-radius: 0;
    margin: 2px 0;
    background-color: #fff !important
}

input:-webkit-autofill {
    transition: background-color 5000s ease-in-out 0s
}

textarea {
    border: #c9c9c9 solid 1px;
    line-height: 28px;
    padding: 0 5px;
    border-radius: 0;
    margin: 2px 0;
    resize: vertical
}

:focus {
    outline: 0
}

.danger {
    border-color: red !important
}

.svg-icon {
    width: 1em;
    height: 1em;
    vertical-align: -0.15em;
    fill: currentColor;
    overflow: hidden
}

.upload-image-container {
    display: inline-block
}

.upload-image-container img {
    width: 160px;
    height: 160px;
    margin: 10px;
    cursor: pointer
}

.upload-image-container .image-delete, .upload-image-container .image-icon {
    height: 0
}

.upload-image-container .image-delete button {
    position: relative;
    left: 140px;
    top: 8px;
    height: 24px;
    line-height: 24px;
    padding: 0 5px;
    margin-right: 5px;
    font-size: 12px
}

.upload-image-container svg {
    width: 1.5em;
    height: 1.5em
}

.upload-image-container .image-icon i {
    position: relative;
    left: 140px;
    top: 36px
}

.upload-image-container .image-icon svg {
    position: relative;
    left: 140px;
    top: 10px
}

.upload-image-container .image-icon .layout-icon-preview {
    color: white
}

.upload-image-container .image-title {
    text-align: center
}

.upload-image-container .image-title span {
    margin: 0 auto;
    max-width: 140px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block
}

.pdf-container {
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 201500;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0
}

.pdf-container iframe {
    top: 5%;
    left: 15%;
    width: 70%;
    height: 90%;
    position: absolute
}

.pdf-container .viewer-button {
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 50%;
    cursor: pointer;
    height: 100px;
    width: 100px;
    overflow: hidden;
    position: absolute;
    right: -50px;
    top: -50px;
    -webkit-transition: background-color .15s;
    transition: background-color .15s
}

.pdf-container .viewer-button span {
    color: white;
    width: 20px;
    height: 20px;
    bottom: 16px;
    left: 21px;
    position: absolute;
    font-size: 18px
}

div.layout-extension-select > input {
    width: 100%
}

div.layout-extension-select .extension-select {
    display: none;
    position: absolute;
    z-index: 899;
    width: 100%;
    border: 1px solid #d2d2d2;
    height: 300px;
    max-height: 300px;
    background-color: #fff;
    border-radius: 2px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .12);
    box-sizing: border-box
}

div.layout-extension-select .extension-select > div:last-child {
    height: calc(100% - 45px)
}

.layout-progress {
    position: relative;
    height: 10px;
    border-radius: 20px;
    background-color: #eee;
    color: #fff
}

.layout-progress .layout-progress-bar {
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    max-width: 100%;
    height: 10px;
    border-radius: 20px;
    text-align: right;
    background-color: #5fb878;
    transition: all .3s;
    -webkit-transition: all .3s
}

.layout-progress .layout-progress-bar .layout-progress-text {
    position: relative;
    top: -20px;
    line-height: 18px;
    font-size: 12px
}

.inner-progress-over {
    position: relative;
    transition: all .3s;
    transition-timing-function: ease-in
}

.inner-progress-over:before {
    content: " ";
    display: block;
    opacity: 0;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: all .3s;
    transition-timing-function: ease-in;
    background: rgba(240, 240, 240, 0.8)
}

.inner-progress-over.running:before {
    z-index: 4000;
    display: block;
    background: #000;
    opacity: .6
}

.shade-inner-progress {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    padding: 0 20px;
    z-index: 4000;
    text-align: center;
    color: #fff;
    width: 100%;
    left: 0
}

.shade-inner-progress .layout-progress {
    margin: 10px 0
}

.shade-inner-progress .tips {
    font-size: 16px
}

.shade-inner-progress .layout-progress-text {
    font-size: 20px
}
body .layui-layer{
    position: absolute;
}
body .layout-layer-alert .layui-layer-content, body .layout-layer-confirm .layui-layer-content, body .layout-layer-error .layui-layer-content{
    background-color: #fff;
}
body .layout-layer-error .layui-layer-title{
    padding: 0 10px;
}
body .layout-layer-error .layui-layer-btn{
    text-align: center;
}
body .layout-layer-error .layui-layer-btn .layui-layer-btn0{
    color: #fff;
}
.layui-layer-message {
    min-width: 100px;
    background-color: #000 !important;
    filter: alpha(opacity=60) !important;
    background-color: rgba(0, 0, 0, 0.6) !important;
    color: #fff;
    border: none !important;
    box-shadow: 0 0 15px #999
}

.layui-layer-message .layui-layer-content {
    padding: 12px 25px;
    text-align: left;
    white-space: normal;
    word-break: break-all;
    word-wrap: break-word
}

body .layui-layer-alert {
    box-shadow: 0 0 15px #999;
    min-width: 350px
}

body .layui-layer-alert .layui-layer-title {
    background-color: #5b94ce;
    color: #fff;
    height: 45px;
    line-height: 45px
}

body .layui-layer-alert .layui-layer-content {
    min-height: 80px;
    padding: 20px 30px;
    white-space: normal;
    word-break: break-all;
    word-wrap: break-word
}


body .layui-layer-alert .layui-layer-content table {
    width: 100%
}

body .layui-layer-alert .layui-layer-content th {
    text-align: center;
    padding: 10px
}

body .layui-layer-alert .layui-layer-content td {
    border-top: #5b94ce 1px dashed;
    padding: 10px
}

body .layui-layer-alert .layui-layer-content td:first-child {
    white-space: nowrap;
    min-width: 100px
}

body .layui-layer-alert .layui-layer-content td:last-child {
    width: 100%
}

body .layui-layer-alert .layui-layer-btn {
    background-color: #f1f1f1;
    padding: 10px 20px
}

body .layui-layer-alert .layui-layer-btn0 {
    background-color: #5b94ce;
    padding: 0 20px
}

body .layui-layer-confirm {
    box-shadow: 0 0 15px #999;
    min-width: 350px
}

body .layui-layer-confirm .layui-layer-title {
    background-color: #e94d4d;
    color: #fff;
    height: 45px;
    line-height: 45px
}

body .layui-layer-confirm .layui-layer-content {
    min-height: 80px;
    max-height: 400px;
    padding: 20px 30px;
    white-space: normal;
    word-break: break-all;
    word-wrap: break-word
}

body .layui-layer-confirm .layui-layer-btn {
    background-color: #f1f1f1;
    padding: 10px 20px
}

body .layui-layer-confirm .layui-layer-btn0 {
    background-color: #e94d4d;
    padding: 0 20px;
    border-color: #e94d4d
}

body .layui-layer-confirm .layui-layer-btn1 {
    padding: 0 20px
}

body .layui-layer-error {
    box-shadow: 0 0 15px #999;
    min-width: 450px
}

body .layui-layer-error .layui-layer-title {
    background-color: #e94d4d;
    color: #fff;
    height: 45px;
    line-height: 45px
}

body .layui-layer-error .layui-layer-content {
    min-height: 80px;
    padding: 20px 30px;
    white-space: normal;
    word-break: break-all;
    word-wrap: break-word
}

body .layui-layer-error .layui-layer-content table {
    width: 100%
}

body .layui-layer-error .layui-layer-content th {
    text-align: center;
    padding: 10px
}

body .layui-layer-error .layui-layer-content td {
    border-top: #e94d4d 1px dashed;
    padding: 10px
}

body .layui-layer-error .layui-layer-content td:first-child {
    white-space: nowrap;
    min-width: 100px
}

body .layui-layer-error .layui-layer-content td:last-child {
    width: 100%
}

body .layui-layer-error .layui-layer-btn {
    background-color: #f1f1f1;
    padding: 10px 20px
}

body .layui-layer-error .layui-layer-btn0 {
    background-color: #e94d4d;
    padding: 0 20px;
    border-color: #e94d4d
}

body .layout-layer-alert, body .layout-layer-confirm, body .layout-layer-error, body .layout-layer-prompt {
    box-shadow: 0 0 50px rgba(0, 0, 0, 0.3);
    min-width: 360px
}

body .layout-layer-alert .layui-layer-title, body .layout-layer-confirm .layui-layer-title, body .layout-layer-error .layui-layer-title, body .layout-layer-prompt .layui-layer-title {
    background-color: #fafafa;
    color: #333;
    height: 46px;
    line-height: 46px;
    font-weight: bold
}

body .layout-layer-error .layui-layer-title {
    color: #ff6464
}

body .layout-layer-alert .layui-layer-title .font_family, body .layout-layer-confirm .layui-layer-title .font_family, body .layout-layer-error .layui-layer-title .font_family, body .layout-layer-prompt .layui-layer-title .font_family {
    padding-right: 4px;
    position: relative;
    top: 2px;
    font-weight: 300;
    font-size: 17px
}

body .layout-layer-alert .layui-layer-content, body .layout-layer-confirm .layui-layer-content, body .layout-layer-error .layui-layer-content {
    min-height: 128px;
    max-height: 300px;
    padding: 20px;
    white-space: normal;
    word-break: break-all;
    word-wrap: break-word;
    color: #333;
    line-height: 24px
}

body .layout-layer-alert .layui-layer-content table, body .layout-layer-confirm .layui-layer-content table, body .layout-layer-error .layui-layer-content table {
    width: 100%
}

body .layout-layer-alert .layui-layer-content th, body .layout-layer-confirm .layui-layer-content th, body .layout-layer-error .layui-layer-content th {
    text-align: center;
    padding: 10px
}

body .layout-layer-alert .layui-layer-content td, body .layout-layer-confirm .layui-layer-content td {
    border-top: #5b94ce 1px dashed;
    padding: 10px
}

body .layout-layer-error .layui-layer-content td {
    border-top: #e94d4d 1px dashed;
    padding: 10px
}

body .layout-layer-alert .layui-layer-content td:first-child, body .layout-layer-confirm .layui-layer-content td:first-child, body .layout-layer-error .layui-layer-content td:first-child {
    white-space: nowrap;
    min-width: 100px
}

body .layout-layer-alert .layui-layer-content td:last-child, body .layout-layer-confirm .layui-layer-content td:last-child, body .layout-layer-error .layui-layer-content td:last-child {
    width: 100%
}

body .layout-layer-prompt .layui-layer-content {
    min-height: 128px;
    max-height: 300px;
    padding: 20px;
    position: relative;
    overflow: auto
}

body .layout-layer-prompt textarea.layui-layer-input {
    width: 320px;
    height: 100px;
    line-height: 20px
}

body .layout-layer-prompt .layui-layer-input {
    display: block;
    width: 260px;
    height: 36px;
    margin: 0 auto;
    line-height: 30px;
    padding-left: 10px;
    border: 1px solid #e6e6e6;
    color: #333
}

body .layout-layer-alert .layui-layer-btn, body .layout-layer-confirm .layui-layer-btn, body .layout-layer-error .layui-layer-btn, body .layout-layer-prompt .layui-layer-btn {
    background-color: #fafafa;
    padding: 9px 20px
}

body .layout-layer-alert .layui-layer-btn a, body .layout-layer-confirm .layui-layer-btn a, body .layout-layer-error .layui-layer-btn a, body .layout-layer-prompt .layui-layer-btn a {
    margin: 0 5px;
    line-height: 26px;
    padding: 0 20px
}

body .layout-layer-alert .layui-layer-btn a:last-child, body .layout-layer-confirm .layui-layer-btn a:last-child, body .layout-layer-error .layui-layer-btn a:last-child, body .layout-layer-prompt .layui-layer-btn a:last-child {
    margin-right: 0
}

body .layout-layer-error .layui-layer-btn0 {
    background-color: #e94d4d;
    padding: 0 20px;
    border-color: #e94d4d
}

body .layout-layer-prompt textarea.layui-layer-input {
    width: 320px;
    height: 100px;
    line-height: 20px
}

body .layout-layer-prompt .layui-layer-input {
    display: block;
    width: 320px;
    height: 36px;
    margin: 0 auto;
    line-height: 30px;
    padding-left: 10px;
    border: 1px solid #e6e6e6;
    color: #333
}

html {
    height: 100%;
    margin: 0
}

body {
    height: 100%
}

.layout-vertical {
    display: flex;
    flex-direction: column;
    height: 100%
}

.layout-horizontal {
    display: flex;
    flex-direction: row;
    height: 100%
}

.home-tab-content .layout-vertical > *:not(.layout-A4), .home-tab-content .layout-horizontal > *:not(.layout-A4) {
    padding: 5px
}

.home-tab-content .layout-vertical > *:not(.layout-A4), .home-tab-content .layout-horizontal > .layui-layer {
    padding: 0
}

.layout-full {
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: auto;
    -webkit-flex: 1 1 0
}

.layout-fixed {
    flex-grow: 0;
    flex-shrink: 0
}

.layout-width-P-100 {
    width: 100%
}

.layout-width-100 {
    width: 100px
}

.layout-width-200 {
    width: 200px
}

.layout-width-250 {
    width: 250px
}

.layout-width-300 {
    width: 300px
}

.layout-width-350 {
    width: 350px
}

.layout-width-400 {
    width: 400px
}

.layout-width-450 {
    width: 450px
}

.layout-width-500 {
    width: 500px
}

.layout-width-600 {
    width: 600px
}

.layout-width-700 {
    width: 700px
}

.layout-width-800 {
    width: 800px
}

.layout-height-100 {
    height: 100px
}

.layout-height-200 {
    height: 200px
}

.layout-height-250 {
    height: 250px
}

.layout-height-300 {
    height: 300px
}

.layout-height-350 {
    height: 350px
}

.layout-height-400 {
    height: 400px
}

.layout-height-450 {
    height: 450px
}

.layout-height-500 {
    height: 500px
}

.layout-height-600 {
    height: 600px
}

.layout-height-700 {
    height: 700px
}

.layout-height-800 {
    height: 800px
}

/*!* 用于溢出 *!*/
.layout-scroll {
    overflow: auto !important
}

.layout-hide {
    display: none !important
}

.layout-show {
    display: block !important
}

.layout-vertical > .layout-horizontal {
    height: auto
}

.layout-vertical > .layout-vertical {
    height: auto
}

.bg-color-1 {
    background-color: #eee
}

.bg-color-2 {
    background-color: #f6f6f6
}

.bg-color-3 {
    background-color: #f5f7f9
}

.bg-color-4 {
    background-color: #f5f7fa
}

.select-dropdown {
    width: inherit;
    max-height: 200px;
    overflow: auto;
    margin: 5px 0;
    padding: 5px 0;
    background-color: #fff;
    box-sizing: border-box;
    border-radius: 4px;
    box-shadow: 0 1px 6px rgb(0 0 0 / 20%);
    position: absolute;
    z-index: 900
}

.dropdown-transfer {
    width: auto
}

.dropdown-menu {
    min-width: 100px
}

.dropdown-item {
    margin: 0;
    line-height: normal;
    padding: 7px 16px;
    clear: both;
    color: #515a6e;
    font-size: 14px !important;
    white-space: nowrap;
    list-style: none;
    cursor: pointer;
    transition: background .2s ease-in-out
}

.dropdown-item-selected, .dropdown-item.dropdown-item-selected:hover {
    background: #f0faff
}

.dropdown-item-focus, .dropdown-item:hover {
    background: #f3f3f3
}

.dropdown-item-disabled {
    color: #c5c8ce;
    cursor: not-allowed
}

.dropdown-item-disabled:hover {
    color: #c5c8ce;
    background-color: #fff;
    cursor: not-allowed
}

.dropdown-item-selected, .dropdown-item-selected:hover {
    color: #2d8cf0
}

.layout-panel-query {
    width: 300px;
    overflow: auto
}

.layout-panel-query > div {
    text-align: center;
    background-color: #f9f9f9;
    line-height: 39px;
    border-bottom: 1px solid #e6e6e6
}

.layout-panel-query > ul {
    width: 95%;
    margin: 0 auto;
    height: auto;
    box-sizing: border-box;
    font-size: 12px
}

.layout-panel-query > ul > li {
    padding-top: 5px;
    line-height: 2.5em;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap
}

.layout-panel-query > ul > li:last-child {
    margin-bottom: 20px
}

.layout-panel-query .layui-form-switch {
    margin-top: 0
}

.layout-panel-query > ul > li > input {
    width: 100%;
    padding: 0;
    margin: 0;
    text-indent: 10px;
    border-color: #e6e6e6
}

.layout-panel-query > ul > li:first-child {
    border-top-width: 0
}

.layout-panel-query > ul > li > label {
    display: inline-block;
    color: #333;
    font-weight: bold
}

.layout-panel-query .layui-form-select {
    width: 50px;
    display: inline-block;
    float: right
}

.layout-panel-query .select-reset .layui-form-select {
    width: 100%;
    display: block;
    float: none
}

.layout-panel-query .layui-form-select dl {
    top: 30px
}

.layout-panel-query .layui-form-selectup dl {
    bottom: 30px;
    top: auto
}

.layout-panel-query .layui-form-select dd {
    line-height: 20px
}

.layout-panel-query .layui-input {
    height: 30px;
    line-height: 30px;
    padding-left: 10px;
    padding-right: 20px
}

.layui-form-select .layui-edge {
    right: 5px
}

.layout-panel-query .multi .layui-input {
    z-index: -1;
    border: none !important;
    opacity: 0;
    height: 0 !important;
    display: none
}

.layout-panel-query .multi .layui-select-title {
    min-height: 30px;
    height: auto !important
}

.layout-panel-query .multi .multi-select {
    line-height: normal !important;
    min-height: 28px;
    height: auto;
    padding: 0 20px 0 5px;
    overflow: hidden;
    left: 0;
    z-index: 99;
    cursor: pointer;
    border: 1px solid #c9c9c9 !important;
    border-radius: 2px;
    background-color: #fff
}

.layout-panel-query .multi .multi-select.focused {
    border: 1px solid #1e9fff !important
}

.layout-panel-query .multi .select-label {
    display: inline-block;
    vertical-align: middle
}

.layout-panel-query .multi .select-label > span {
    border: 1px solid #009688;
    position: relative;
    padding: 1px 20px 1px 5px;
    background-color: #009688;
    border-radius: 2px;
    color: #FFF;
    display: inline-block;
    line-height: 18px;
    height: 18px;
    margin: 2px 5px 2px 0;
    cursor: initial;
    user-select: none;
    font-size: 14px;
    -webkit-user-select: none
}

.layout-panel-query .multi .select-label > span i {
    position: absolute;
    margin-left: 4px;
    font-size: 12px;
    cursor: pointer;
    line-height: 18px
}

.layout-panel-query .layui-btn {
    height: 30px;
    line-height: 30px
}

.layout-panel-query.panel-query-style2 {
    width: calc(100% - 20px);
    margin: 10px;
    border: 1px solid #f0f2f5;
    overflow: visible
}

.layout-panel-query.panel-query-style2 > div {
    border: 0;
    background-color: #f0f2f5
}

.layout-panel-query.panel-query-style2 > ul {
    width: 100%;
    margin: 0 auto;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    padding: 5px 50px 10px 20px;
    box-sizing: border-box;
    background-color: #f9f9f9;
    position: relative
}

.layout-panel-query.panel-query-style2 > ul > li {
    margin-right: 20px;
    width: 180px
}

.layout-panel-query.panel-query-style2 > ul > li:last-child {
    margin-bottom: 0
}

@media screen and (min-width: 1980px) {
    .layout-panel-query.panel-query-style2 {
        font-size: 14px
    }
}

.layout-panel-query.panel-query-style2 > ul > li.col1 {
    width: 100%
}

.layout-panel-query.panel-query-style2 > ul > li.col2 {
    width: calc(50% - 20px)
}

.layout-panel-query.panel-query-style2 > ul > li.col3 {
    width: calc(33% - 20px)
}

.layout-panel-query.panel-query-style2 > ul > li.item-line {
    width: 100%;
    height: 0
}

.layout-panel-query.panel-query-style2 > ul > li.widthAuto {
    width: auto
}

.layout-panel-query.panel-query-style2 .layui-form-radio {
    margin: 0
}

.layout-panel-query.panel-query-style2 .layui-form-checkbox[lay-skin="primary"] span {
    padding-right: 10px;
    font-size: 12px
}

.layout-panel-query.panel-query-style2 .layui-form-radio > i {
    font-size: 18px
}

.layout-panel-query.panel-query-style2 .layui-form-radio > div {
    color: #666;
    font-size: 12px
}

.layout-panel-query.panel-query-style3 {
    width: calc(100% - 20px);
    margin: 10px;
    border: 1px solid #f0f2f5;
    overflow: visible
}

.layout-panel-query.panel-query-style3 > div {
    border: 0;
    background-color: #f0f2f5
}

.layout-panel-query.panel-query-style3 > ul {
    width: 100%;
    margin: 0 auto;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    padding: 5px 50px 10px 20px;
    box-sizing: border-box;
    background-color: #f9f9f9;
    position: relative
}

.layout-panel-query.panel-query-style3 > ul > li {
    margin-right: 20px;
    min-width: 150px;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between
}

.layout-panel-query.panel-query-style3 > ul > li:last-child {
    margin-bottom: 0
}

@media screen and (min-width: 1980px) {
    .layout-panel-query.panel-query-style3 {
        font-size: 14px
    }
}

.layout-panel-query.panel-query-style3 > ul > li.col1 {
    width: 100%
}

.layout-panel-query.panel-query-style3 > ul > li.col2 {
    width: calc(50% - 20px)
}

.layout-panel-query.panel-query-style3 > ul > li.col3 {
    width: calc(33% - 20px)
}

.layout-panel-query.panel-query-style3 > ul > li.item-line {
    width: 100%;
    height: 0
}

.layout-panel-query.panel-query-style3 > ul > li.widthAuto {
    width: auto
}

.layout-panel-query.panel-query-style3 .layui-form-radio {
    margin: 0
}

.layout-panel-query.panel-query-style3 .layui-form-checkbox[lay-skin="primary"] span {
    padding-right: 10px;
    font-size: 12px
}

.layout-panel-query.panel-query-style3 .layui-form-radio > i {
    font-size: 18px
}

.layout-panel-query.panel-query-style3 .layui-form-radio > div {
    color: #666;
    font-size: 12px
}

.layout-panel-query.panel-query-style3 > ul > li > label {
    min-width: 80px;
    margin-right: 10px
}

.layout-panel-query.panel-query-style3 > ul > li > input {
    min-width: 80px;
    padding: 0;
    margin: 0;
    text-indent: 10px;
    border-color: #e6e6e6
}

.layout-panel-query.panel-query-style3 .layui-form-select {
    width: 50px
}

.layout-panel-query.panel-query-style3 > ul > li > .layui-form-select {
    display: none
}

.layout-panel-query.panel-query-style3 > ul > li.select-reset > .layui-form-select {
    display: block;
    width: 100%
}

.layout-panel-query.panel-query-style4 {
    position: absolute;
    z-index: 999;
    background: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    opacity: 1;
    right: 10px
}

.layout-panel-query.panel-query-style4 .layout-toolbar {
    line-height: 28px
}

.layout-panel-query > ul > li.layout-showMore {
    justify-content: flex-end;
    position: absolute;
    bottom: 20px;
    right: 5px;
    width: auto
}

.layout-panel-query > ul > li.layout-showMore > button {
    background-color: rgba(0, 150, 136, 0.1);
    border: 0;
    border-radius: 2px;
    color: #00968c;
    padding: 0 5px;
    transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1)
}

.layout-panel-query > p.openSearch {
    width: calc(100% - 20px);
    box-sizing: border-box;
    text-align: left;
    margin: 0 10px;
    padding: 10px 20px;
    font-weight: bold;
    color: #333;
    background: linear-gradient(top, #fff 0, #fff 48%, #ddd 49%, #ddd 51%, #fff 52%, #fff 100%);
    background: -ms-linear-gradient(top, #fff 0, #fff 48%, #ddd 49%, #ddd 51%, #fff 52%, #fff 100%);
    background: -webkit-linear-gradient(top, #fff 0, #fff 48%, #ddd 49%, #ddd 51%, #fff 52%, #fff 100%);
    background: -moz-linear-gradient(top, #fff 0, #fff 48%, #ddd 49%, #ddd 51%, #fff 52%, #fff 100%);
    cursor: pointer
}

.layout-panel-query > p.openSearch > span {
    background-color: #fff;
    padding: 0 5px
}

.layout-panel-query > p.openSearch > span > i.font_family {
    font-size: 14px;
    color: #333
}

.layout-panel-query > p.openSearch > button {
    background-color: rgba(0, 150, 136, 0.1);
    border: 0;
    border-radius: 2px;
    color: #00968c;
    padding: 0 5px;
    transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1)
}

.layout-float-panel {
    width: 80%;
    position: relative;
    margin: 0 auto
}

.layout-float-panel .layout-float-query {
    z-index: 999;
    position: absolute;
    border: 1px solid #d2d2d2;
    max-height: 300px;
    background-color: #fff;
    border-radius: 2px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .12);
    box-sizing: border-box
}

.layout-float-query > div {
    text-align: center;
    background-color: #f9f9f9;
    line-height: 39px;
    border-bottom: 1px solid #e6e6e6
}

.layout-float-query > ul {
    padding-left: 10px;
    padding-bottom: 10px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    align-content: flex-start
}

.layout-float-query > ul > li {
    padding-top: 5px;
    line-height: 2.5em;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap
}

.layout-float-query > ul > li > label {
    padding-left: 10px;
    min-width: 80px;
    height: 30px;
    line-height: 30px;
    text-align: left;
    border-right-width: 0;
    text-wrap: revert;
    overflow: hidden;
    text-overflow: ellipsis;
    flex-grow: 0;
    flex-shrink: 0
}

.layout-float-query > ul > li > input {
    width: 100%;
    padding: 0;
    margin-right: 10px;
    text-indent: 10px;
    border-color: #e6e6e6
}

.layout-float-query .layui-input {
    height: 30px;
    line-height: 30px;
    padding-left: 10px;
    padding-right: 20px
}

.layout-float-query > ul > li > select {
    padding: 0 10px;
    height: 32px;
    width: 100%
}

.layout-float-query .layui-form-select {
    width: 50px;
    margin-right: 10px;
    display: inline-block;
    float: right
}

.layout-float-query .select-reset .layui-form-select {
    width: 100%
}

.layout-float-query > ul > li > textarea {
    padding: 0 10px;
    line-height: 30px;
    min-height: 80px;
    width: 100%
}

.layout-float-query > ul > li > pre {
    padding: 0 10px;
    line-height: 30px;
    min-height: 80px;
    width: 100%
}

.layout-float-query > ul > li .input-block {
    width: 100%;
    margin-left: 0;
    min-height: 30px;
    border: 1px solid #c9c9c9;
    text-align: left
}

.layout-float-query > ul > li .input-block > .layui-form-switch {
    margin-top: 3px;
    margin-left: 10px
}

.layout-float-query > ul > li .input-block > .layui-form-radio {
    margin-top: 2px;
    margin-left: 10px
}

.layout-float-query > ul > li .input-block > .layui-form-checkbox {
    margin-top: 5px;
    margin-left: 10px
}

.layout-float-query > ul.col1 > li {
    width: 100%
}

.layout-float-query > ul.col2 > li {
    width: 50%
}

.layout-float-query > ul.col3 > li {
    width: 33.333%
}

.layout-float-query > ul.col4 > li {
    width: 25%
}

.layout-float-query > ul.col5 > li {
    width: 20%
}

.layout-float-query > ul > li.col1 {
    width: 100%
}

.layout-float-query > ul > li.col2 {
    width: 50%
}

.layout-float-query > ul > li.col3 {
    width: 33.333%
}

.layout-float-query > ul > li.col4 {
    width: 25%
}

.layout-float-query > ul > li.col5 {
    width: 20%
}

.layout-page-loading {
    padding: 20px
}

.layout-page-error {
    line-height: 50px;
    margin: 20px;
    border-left: 5px solid #009688;
    border-right: 5px solid #009688;
    border-radius: 3px;
    background-color: #f2f2f2
}

.layout-page-error:before {
    content: "错误：";
    padding-left: 20px
}

.layout-404 {
    background: url("../../resources/imgs/home/404-2.svg") no-repeat;
    background-position: 50% 50%;
    height: 500px
}

.layout-dev {
    background: url("../../resources/imgs/home/deving-2.svg") no-repeat;
    background-position: 50% 50%;
    height: 500px
}

.layout-poorNet {
    background: url("../../resources/imgs/home/poorNet-2.svg") no-repeat;
    background-position: 50% 50%;
    height: 500px
}

.layout-empty {
    position: relative;
    background: url("../../resources/imgs/home/empty-2.svg") no-repeat;
    background-position: 50% 50%;
    height: 500px
}

.layout-page-bottom {
    position: absolute;
    line-height: 50px;
    bottom: 70px;
    text-align: center;
    width: 100%;
    color: #9f9f9f;
    letter-spacing: 2px
}

.layout-page div.layout-line {
    margin-top: 3px;
    margin-left: 10px;
    margin-right: 10px;
    justify-content: flex-start !important;
    padding-left: 20px;
    background: linear-gradient(top, #fff 0, #fff 48%, #ddd 49%, #ddd 51%, #fff 52%, #fff 100%);
    background: -ms-linear-gradient(top, #fff 0, #fff 48%, #ddd 49%, #ddd 51%, #fff 52%, #fff 100%);
    background: -webkit-linear-gradient(top, #fff 0, #fff 48%, #ddd 49%, #ddd 51%, #fff 52%, #fff 100%);
    background: -moz-linear-gradient(top, #fff 0, #fff 48%, #ddd 49%, #ddd 51%, #fff 52%, #fff 100%)
}

.layout-page div.layout-line > label {
    font-size: 16px;
    width: auto !important;
    padding: 0 10px;
    border: 0;
    margin: 0;
    min-width: 50px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    background-color: #fff;
    color: #009688
}

.borderLeft {
    border-left: 1px solid #eee
}

.borderRight {
    border-right: 1px solid #eee
}

.borderTop {
    border-top: 1px solid #eee
}

.borderBottom {
    border-bottom: 1px solid #eee
}

.layout-page .layout-notice {
    vertical-align: middle;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.layout-page .layout-notice-tip {
    position: fixed;
    display: none;
    z-index: 9999999;
    transition: left .4s cubic-bezier(0.23, 1, 0.32, 1) 0s, top .4s cubic-bezier(0.23, 1, 0.32, 1) 0s;
    background-color: rgba(50, 50, 50, 0.7);
    border-width: 0;
    border-style: solid;
    border-color: #333;
    border-radius: 4px;
    color: #fff;
    padding: 4px;
    pointer-events: none
}

.layout-toolbar {
    display: flex;
    flex-direction: row;
    padding: 0 5px
}

.layout-vertical > .layout-toolbar {
    flex-grow: 0;
    flex-shrink: 0
}

.layout-toolbar > div:nth-child(n) {
    flex-grow: 1;
    flex-shrink: 1;
    text-align: center;
    padding: 5px
}

.layout-toolbar.bpm-toolbar > div:first-child {
    overflow-x: hidden
}

.layout-toolbar > div:first-child {
    text-align: left
}

.layout-toolbar > div:last-child {
    text-align: right
}

.layout-toolbar > div:first-child:nth-last-child(1) {
    text-align: center
}

.layout-banner {
    background: linear-gradient(to bottom, #fff 30%, #eee 100%);
    border-bottom: solid 1px #d8d8d8
}

.layout-footer {
    background: linear-gradient(to top, #fff 70%, #f2f2f2 100%);
    border-top: solid 1px #d8d8d8
}

.layout-toolbar .layui-form-select {
    width: auto;
    display: inline-block;
    text-align: left !important
}

.layout-toolbar .layui-form-select .layui-input {
    height: 30px;
    line-height: 30px;
    padding: 0 5px;
    white-space: nowrap;
    border: #c9c9c9 solid 1px;
    border-radius: 0;
    margin: 1px 0;
    background-color: #fff !important
}

.layout-toolbar .layui-form-select dl {
    top: 30px
}

.layout-toolbar .layui-form-selectup dl {
    top: auto;
    bottom: 31px
}

.layout-toolbar .multi {
    vertical-align: middle
}

.layout-toolbar .multi .layui-input {
    z-index: -1;
    border: none !important;
    opacity: 0;
    height: 0 !important;
    display: none
}

.layout-toolbar .multi .layui-select-title {
    min-height: 30px;
    height: auto !important
}

.layout-toolbar .multi .multi-select {
    line-height: normal !important;
    margin: 1px 0;
    min-height: 28px;
    min-width: 137px;
    height: auto;
    padding: 0 25px 0 5px;
    overflow: hidden;
    left: 0;
    z-index: 99;
    cursor: pointer;
    border: 1px solid #c9c9c9 !important;
    background-color: #fff
}

.layout-toolbar .multi .multi-select.focused {
    border: 1px solid #1e9fff !important
}

.layout-toolbar .multi .select-label {
    display: inline-block;
    vertical-align: middle;
    margin-top: 1px
}

.layout-toolbar .multi .select-label > span {
    border: 1px solid #009688;
    position: relative;
    padding: 1px 25px 1px 5px;
    background-color: #009688;
    border-radius: 2px;
    color: #FFF;
    display: inline-block;
    line-height: 20px;
    height: 22px;
    margin: 2px 5px 2px 0;
    cursor: initial;
    user-select: none;
    font-size: 14px;
    -webkit-user-select: none
}

.layout-toolbar .multi .select-label > span i {
    position: absolute;
    margin-left: 8px;
    font-size: 12px;
    cursor: pointer;
    line-height: 20px
}

.layout-toolbar > div.layout-input-search {
    padding: 0
}

.layout-input-search {
    border: #c9c9c9 solid 1px;
    height: 36px;
    border-radius: 2px
}

.layout-input-search > input {
    width: calc(100% - 50px);
    border: 0;
    float: left
}

.layout-input-search > input:focus {
    border: 0
}

.layout-tab {
    padding: 0;
    margin: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    width: 100%
}

.layout-tab > ul {
    flex-grow: 0;
    flex-shrink: 0;
    height: 45px
}

.layout-tab > .layui-tab-content {
    padding: 0;
    margin: 0;
    flex-grow: 1;
    flex-shrink: 1;
    height: 0;
    overflow: auto
}

.layout-tab > .layui-tab-content > .layui-tab-item {
    height: calc(100%)
}

.layout-tab > .layui-tab-title .layui-this {
    color: #009688
}

.layout-tab > .layui-tab-title .layui-this:after, .layout-tab > .layui-tab-more li.layui-this:after {
    border: 0;
    border-radius: 0;
    border-bottom: 2px solid #009688
}

.layout-tab[overflow] > .layui-tab-title .layui-this:after {
    top: -1px
}

.layout-tab.layui-tab > ul.layui-tab-title {
    width: 100%;
    overflow: unset;
    box-sizing: border-box
}

.layout-tab > ul.layui-tab-title > li {
    position: relative;
    padding: 0 15px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 120px;
    text-align: center;
    line-height: 45px
}

.layui-tab-title .layui-this:after {
    height: 45px
}

.layout-tab[lay-allowclose] > ul.layui-tab-title > li {
    padding: 0 35px 0 15px
}

.layout-tab > ul.layui-tab-title > li.layui-this {
    max-width: 200px;
    font-weight: bold;
    overflow: hidden
}

.layout-tab > ul.layui-tab-title li > i {
    position: absolute;
    right: 10px;
    top: 10px
}

.layout-tab > ul.layui-tab-title > .layui-tab-bar {
    display: none !important
}

.layout-tab span.layout-tab-bar {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
    width: 30px;
    height: 44px;
    line-height: 45px;
    text-align: center;
    cursor: pointer;
    background-color: #fff;
    user-select: none
}

.layout-tab span.layout-tab-bar > dl {
    display: none;
    max-height: 250px;
    overflow: auto;
    position: absolute;
    top: 45px;
    right: 0;
    max-width: 200px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .12);
    border: 1px solid #d2d2d2;
    background-color: #fff;
    transition: all .5s
}

.layout-tab span.layout-tab-bar.layout-hover > dl {
    display: block
}

.layout-tab span.layout-tab-bar > dl > dd {
    height: 30px;
    line-height: 30px;
    color: #333;
    font-size: 12px;
    padding: 0 8px
}

.layout-tab span.layout-tab-bar > dl > dd:hover {
    background: #eee
}

.layout-tab span.layout-tab-bar.layout-hover > i.font_family, .layout-tab span.layout-tab-bar > dl > dd:active, .layout-tab span.layout-tab-bar > dl > dd.layout-click {
    color: #00968c
}

.layout-tab.layui-tab.tab-style-2 > ul.layui-tab-title {
    background: #f0f2f5
}

.layout-tab.tab-style-2 > ul {
    padding-left: 10px
}

.layout-tab.tab-style-2 > ul.layui-tab-title li {
    height: 38px;
    line-height: 34px;
    top: 10px;
    box-sizing: border-box;
    border-top-style: solid;
    border-top-width: 4px;
    border-top-color: #f0f2f5
}

.layout-tab.tab-style-2 > ul.layui-tab-title li.layui-this {
    background-color: #fff;
    border-top-color: #00968c
}

.layout-tab.layui-tab.tab-style-3 > ul.layui-tab-title {
    background: #f0f2f5
}

.layout-tab.tab-style-3 > ul {
    padding-left: 10px
}

.layout-tab.tab-style-3 > ul.layui-tab-title li.layui-this {
    background-color: #00968c;
    color: #fff
}

.layout-tab.layui-tab.tab-style-4 > ul.layui-tab-title {
    background: #f0f2f5
}

.layout-tab.tab-style-4 > ul {
    padding-left: 10px
}

.layout-tab.tab-style-4 > ul.layui-tab-title li.layui-this {
    background-color: #fff;
    height: 45px
}

.layout-tab.tab-style-4 > ul.layui-tab-title li.layui-this:after {
    border-style: dashed;
    border-color: rgba(0, 150, 140, 0);
    border-width: 8px 15px;
    border-bottom-color: rgba(0, 150, 140, 1);
    border-bottom-style: solid;
    width: 15px;
    content: "";
    position: absolute;
    bottom: 0;
    left: calc(50% - 15px)
}

.layout-tab.layui-tab.tab-style-5 {
    width: 98%;
    margin: 0 auto;
    border: 1px solid #f0f2f5
}

.layout-tab.layui-tab.tab-style-5 > ul.layui-tab-title {
    background: #f0f2f5;
    border: none !important
}

.layout-tab.tab-style-5 > ul.layui-tab-title li.layui-this {
    background-color: #fff;
    height: 45px
}

.layout-tab.tab-style-5 > ul.layui-tab-title li.layui-this:after {
    display: none
}

.layout-split {
    position: relative;
    padding: 0 !important
}

.layout-split > .right, .layout-split > .left {
    position: absolute;
    width: 5px;
    height: 100%;
    z-index: 999
}

.layout-split > .right:hover, .layout-split > .left:hover {
    background: #009688;
    cursor: col-resize
}

.layout-split > .top, .layout-split > .bottom {
    position: absolute;
    width: 100%;
    height: 5px;
    z-index: 999
}

.layout-split > .top:hover, .layout-split > .bottom:hover {
    background: #009688;
    cursor: row-resize
}

.layout-split-shadow {
    z-index: 99999;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #eee;
    opacity: .1;
    padding: 0 !important
}

.layout-split-line {
    z-index: 99999;
    position: absolute;
    width: 5px;
    height: 5px;
    background: #009688;
    padding: 0 !important
}

.tree-icon {
    width: 1.5em;
    height: 1.5em;
    vertical-align: -0.33em;
    fill: currentColor;
    overflow: hidden;
    padding: 0 .2em 0 .2em
}

.tree-font_family {
    font-family: "font_family";
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    padding: 0 .2em;
    vertical-align: .12em;
    color: #606c88
}

.layout-tree {
    height: 100%;
    padding: 0 !important
}

.layout-tree .layui-table-view .layui-table {
    width: 100% !important
}

.layout-tree .layui-table-cell {
    height: 26px;
    line-height: 26px;
    padding: 0
}

.layout-tree .layui-form-checkbox[lay-skin="primary"] i {
    width: 17px;
    height: 17px
}

.layout-tree .layui-table-cell div.line:before {
    content: "";
    height: 98%;
    border-left: 1px dotted #999;
    position: absolute
}

.layout-tree .layui-table-cell div.first-node-line:before {
    content: "";
    position: absolute;
    border-left: 1px dotted #999;
    height: 50%;
    top: 12px
}

.layout-tree .layui-table-cell div.first-node-line:after {
    content: "";
    height: 100%;
    border-top: 1px dotted #999;
    position: absolute;
    left: 14px;
    top: 12px;
    width: 8px
}

.layout-tree .layui-table-cell div.node-line:before {
    content: "";
    position: absolute;
    border-left: 1px dotted #999;
    height: 100%
}

.layout-tree .layui-table-cell div.node-line:after {
    content: "";
    height: 100%;
    border-top: 1px dotted #999;
    position: absolute;
    left: 14px;
    top: 12px;
    width: 8px
}

.layout-tree .layui-table-cell div.last-node-line:before {
    content: "";
    position: absolute;
    border-left: 1px dotted #999;
    height: 50%
}

.layout-tree .layui-table-cell div.last-node-line:after {
    content: "";
    height: 100%;
    border-top: 1px dotted #999;
    position: absolute;
    left: 14px;
    top: 12px;
    width: 8px
}

.layout-tree .layui-table-cell i.line:after {
    content: "";
    position: absolute;
    border-left: 1px dotted #999;
    display: inline-block;
    height: 98%
}

.layout-tree .layui-table-cell i.node-line:before {
    content: "";
    height: 100%;
    border-top: 1px dotted #999;
    position: absolute;
    margin-left: 18px;
    top: 12px;
    width: 8px
}

.layout-tree .layui-table-cell i.node-line:after {
    content: "";
    position: absolute;
    border-left: 1px dotted #999;
    height: 98%
}

.layout-tree .layui-table-cell i.last-node-line:before {
    content: "";
    height: 100%;
    border-top: 1px dotted #999;
    position: absolute;
    margin-left: 18px;
    top: 12px;
    width: 8px
}

.layout-tree .layui-table-cell i.last-node-line:after {
    content: "";
    position: absolute;
    border-left: 1px dotted #999;
    height: 50%
}

.layout-tree .layui-table-view .layui-table-box .layui-table-body .layui-table .layui-table-cell {
    overflow: visible !important
}

button.small {
    height: 24px;
    line-height: 22px;
    padding: 0 5px;
    margin-right: 5px;
    font-size: 12px
}

button.small .small_icon {
    font-size: 14px
}

button.small .large_icon {
    font-size: 18px
}

button.large {
    height: 36px;
    line-height: 36px;
    padding: 0 20px;
    margin-right: 5px;
    font-size: 16px
}

button.row {
    display: block;
    width: 100%;
    line-height: 30px
}

button.plain {
    border-color: #00968c;
    background-color: #fff;
    color: #00968c
}

button.primary, button.primary:active {
    border-color: #c9c9c9;
    background-color: #fff;
    color: #555
}

button.edit {
    border-color: #6d8acc;
    background-color: #6d8acc
}

button.save {
    border-color: #1eb272;
    background-color: #1eb272
}

button.delete {
    border-color: #e94d4d;
    background-color: #e94d4d
}

button.yellow-full, button.yellow-full:active {
    border-color: #e67926;
    background-color: #e67926
}

button.yellow, button.yellow:active {
    border-color: #e67926;
    background-color: #fff;
    color: #e67926
}

button.green, button.green:active {
    border-color: #1eb272;
    background-color: #fff;
    color: #1eb272
}

button.red, button.red:active {
    border-color: #e94d4d;
    background-color: #fff;
    color: #e94d4d
}

button.blue, button.blue:active {
    border-color: #606c88;
    background-color: #fff;
    color: #606c88
}

button.edit-empty, button.edit-empty:active {
    border-color: #6d8acc;
    background-color: #fff;
    color: #6d8acc
}

button:hover {
    opacity: .8
}

button:active {
    opacity: 1
}

button.primary:active, button.yellow:active, button.green:active, button.red:active, button.blue:active {
    background: #eee
}

button.disabled, button.disabled:hover, button.disabled:active {
    border-color: #e6e6e6;
    background-color: #fbfbfb;
    color: #c9c9c9;
    cursor: not-allowed;
    pointer-events: none;
    opacity: 1
}

button.borderless {
    border: none !important;
    background-color: transparent !important
}

.text-red {
    color: #ed5565
}

.text-green {
    color: #5fb878
}

.text-yellow {
    color: #f8ac59
}

.text-black {
    color: #333
}

.layout-collapse .layui-colla-content {
    padding: 0 !important
}

.layout-collapse .layui-colla-title {
    background: #fafafa;
    color: #666
}

.layout-collapse .layui-colla-item.layout-this > .layui-colla-title {
    color: #00968c;
    font-weight: bold
}

.layout-collapse.colla-style-2 .layui-colla-icon {
    display: none
}

.layout-collapse.colla-style-2 .layui-colla-title {
    padding-left: 15px
}

.layout-collapse.colla-style-2 .layui-colla-title:after {
    content: "\e623";
    font-family: "font_family" !important;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: absolute;
    right: 15px;
    top: 0;
    font-size: 14px
}

.layout-collapse.colla-style-2 .layui-colla-item.layout-this > .layui-colla-title:after {
    content: "\e624";
    font-family: "font_family" !important;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: absolute;
    right: 15px;
    top: 0;
    font-size: 14px
}

.layout-form {
    padding-top: 5px
}

.layout-form ul {
    margin: 0 10px 0 0;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    align-content: flex-start
}

.layout-form ul > li {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    min-height: 40px;
    padding: 2px 0;
    position: relative
}

.layout-form ul > li > label {
    padding-left: 10px;
    min-width: 80px;
    height: 30px;
    line-height: 30px;
    text-align: left;
    border-right-width: 0;
    text-wrap: revert;
    overflow: hidden;
    text-overflow: ellipsis;
    flex-grow: 0;
    flex-shrink: 0
}

.layout-form ul > li > label.required:before {
    content: "*";
    color: #e94d4d
}

.layout-form ul > li > input {
    padding: 0 10px;
    height: 30px;
    width: 100%
}

.layout-form ul > li > select {
    padding: 0 10px;
    height: 32px;
    width: 100%
}

.layout-form ul > li > textarea {
    padding: 0 10px;
    line-height: 30px;
    min-height: 80px;
    width: 100%
}

.layout-form ul > li > pre {
    padding: 0 10px;
    line-height: 30px;
    min-height: 80px;
    width: 100%
}

.layout-form ul > li .input-block {
    width: 100%;
    margin-left: 0;
    min-height: 30px;
    border: 1px solid #c9c9c9;
    text-align: left
}

.layout-form ul > li .input-block > .layui-form-switch {
    margin-top: 3px;
    margin-left: 10px
}

.layout-form ul > li .input-block > .layui-form-radio {
    margin-top: 2px;
    margin-left: 10px
}

.layout-form ul > li .input-block > .layui-form-checkbox {
    margin-top: 5px;
    margin-left: 10px
}

.layout-form ul.col1 > li {
    width: 100%
}

.layout-form ul.col2 > li {
    width: 50%
}

.layout-form ul.col3 > li {
    width: 33.333%
}

.layout-form ul.col4 > li {
    width: 25%
}

.layout-form ul.col5 > li {
    width: 20%
}

.layout-form ul > li.col1 {
    width: 100%
}

.layout-form ul > li.col2 {
    width: 50%
}

.layout-form ul > li.col3 {
    width: 33.333%
}

.layout-form ul > li.col4 {
    width: 25%
}

.layout-form ul > li.col5 {
    width: 20%
}

.layout-form ul > li.item-line {
    margin-left: 10px;
    justify-content: flex-start !important;
    padding: 0 0 0 20px;
    min-height: 20px;
    width: 100% !important;
    background: linear-gradient(top, #fff 0, #fff 48%, #ddd 49%, #ddd 51%, #fff 52%, #fff 100%);
    background: -ms-linear-gradient(top, #fff 0, #fff 48%, #ddd 49%, #ddd 51%, #fff 52%, #fff 100%);
    background: -webkit-linear-gradient(top, #fff 0, #fff 48%, #ddd 49%, #ddd 51%, #fff 52%, #fff 100%);
    background: -moz-linear-gradient(top, #fff 0, #fff 48%, #ddd 49%, #ddd 51%, #fff 52%, #fff 100%)
}

.layout-form ul > li.item-line > label {
    font-size: 16px;
    width: auto !important;
    padding: 0 10px;
    border: 0;
    margin: 0;
    min-width: 50px;
    height: 30px;
    text-align: center;
    background-color: #fff;
    color: #009688
}

.layout-form div.errTip {
    position: absolute;
    bottom: -8px;
    left: 110px;
    color: #e94d4d;
    font-size: 9px;
    line-height: 18px;
    z-index: 2
}

.layout-form .layui-form-select div.errTip {
    bottom: -15px
}

.layout-form div.errTip > span {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    color: #fff;
    background-color: #e94d4d;
    text-align: center;
    line-height: 10px;
    font-weight: bold;
    margin-right: 5px
}

input:focus, textarea:focus {
    border: 1px solid #1e9fff
}

.layout-form ul > li > textarea.widthLimit {
    resize: vertical
}

.layout-form ul > li > textarea.heightLimit {
    resize: horizontal
}

.layout-form ul > li > textarea.areaLimit {
    resize: none
}

.readonly {
    background: #eee !important;
    pointer-events: none
}

.layout-input-disabled {
    background: #eee !important;
    color: #000
}

button.readonly {
    background: #eee !important;
    pointer-events: none;
    color: #c9c9c9 !important;
    border-color: #c9c9c9 !important
}

.layout-form ul > li > div.layui-form-select > div.layui-select-title > input.layui-input:focus {
    border: 1px solid #1e9fff !important
}

.layout-form ul > li > div.layui-form-select > div.layui-select-title > input.layui-input.danger {
    border-color: red !important
}

.layout-form ul > li > .layui-form-select > dl > dd > .font_family {
    padding-right: 10px
}

.layout-form ul > li > div.layui-form-select:not(.multi), .layout-form ul > li > div.layout-extension-select {
    height: 32px
}

.layout-form ul > li > div.layui-form-select, .layout-form ul > li > div.layout-extension-select {
    width: 100%
}

.layout-form ul > li > div.layui-form-select > div.layui-select-title {
    height: 32px;
    width: 100%
}

.layout-form ul > li > div.layui-form-select > dl, .layout-form ul > li > div.layout-extension-select > div {
    border-radius: 0;
    top: 33px;
    width: 100%
}

.layout-form ul > li > div.layui-form-selectup dl {
    top: auto;
    bottom: 33px
}

.layout-form ul > li > div.layui-form-select > div.layui-select-title > input.layui-input {
    height: 32px;
    width: 100%;
    border: #c9c9c9 solid 1px;
    border-radius: 0
}

.layout-form ul > li > div.layui-form-select > div.layui-select-title > i.layui-edge {
    margin-top: -2px
}

.layout-form ul > li > div.layui-form-selected > div.layui-select-title > i.layui-edge {
    margin-top: -7px
}

.layout-form .multi .layui-input, .layout-edit-table .multi .layui-input {
    z-index: -1;
    border: none !important;
    opacity: 0;
    height: 0 !important;
    display: none
}

.layout-form .multi .layui-select-title, .layout-edit-table .multi .layui-select-title {
    min-height: 32px;
    height: auto !important
}

.layout-form .multi .multi-select, .layout-edit-table .multi .multi-select {
    line-height: normal !important;
    min-height: 32px;
    height: auto;
    padding: 0 25px 0 5px;
    overflow: hidden;
    left: 0;
    z-index: 99;
    cursor: pointer;
    border: 1px solid #c9c9c9 !important
}

.layout-form .multi .multi-select.focused, .layout-edit-table .multi .multi-select.focused {
    border: 1px solid #1e9fff !important
}

.layout-form .multi .multi-select.danger, .layout-edit-table .multi .multi-select.danger {
    border-color: red !important
}

.layout-form .multi .select-label, .layout-edit-table .multi .select-label {
    display: inline-block;
    vertical-align: middle;
    margin-top: 2px
}

.layout-form .multi .select-label > span, .layout-edit-table .multi .select-label > span {
    border: 1px solid #009688;
    position: relative;
    padding: 1px 25px 1px 5px;
    background-color: #009688;
    border-radius: 2px;
    color: #FFF;
    display: inline-block;
    line-height: 20px;
    height: 22px;
    margin: 2px 5px 2px 0;
    cursor: initial;
    user-select: none;
    font-size: 14px;
    -webkit-user-select: none
}

.layout-form .multi .select-label > span i, .layout-edit-table .multi .select-label > span i {
    position: absolute;
    margin-left: 8px;
    font-size: 12px;
    cursor: pointer;
    line-height: 20px
}

.layout-form.form-style2 {
    padding: 10px;
    border: 1px solid #ccc;
    width: 540px;
    margin: 10px 20px
}

.layout-form.form-style2 ul > li > label {
    width: 120px
}

.layout-form.form-style2 ul > li > label.long {
    line-height: 15px;
    word-break: break-all
}

.layout-form.form-style2 ul > li > label.longer {
    font-size: 12px;
    line-height: 15px;
    word-break: break-all
}

.layout-form .layui-colla-content {
    color: black
}

.special-select-element {
    width: 100%;
    position: relative
}

.special-select-element input {
    width: 100%
}

.special-select-element .select-tags {
    position: absolute;
    padding: 5px;
    display: flex;
    flex-wrap: wrap;
    white-space: normal;
    align-content: flex-start
}

.special-select-element .input-tags {
    position: absolute;
    height: 28px;
    top: 50%;
    transform: translateY(-50%);
    padding: 0
}

.special-select-element .select-tags .tag-info {
    position: relative;
    background-color: #f4f4f5;
    border-color: #e9e9eb;
    color: #909399;
    margin: 2px 0 2px 6px;
    display: flex;
    max-width: 100%;
    align-items: center;
    height: 24px;
    padding: 0 8px;
    line-height: 22px;
    border-radius: 4px;
    white-space: nowrap
}

.special-select-element .select-tags .tag-info .tag-text {
    overflow: hidden;
    text-overflow: ellipsis
}

.special-select-element .select-tags .tag-info .tag-close {
    transform: scale(.8)
}

.special-select-element .select-tags .tag-info .tag-close {
    color: #909399;
    background-color: #c0c4cc;
    border-radius: 50%;
    text-align: center;
    position: relative;
    cursor: pointer;
    font-size: 12px;
    height: 16px;
    width: 16px;
    line-height: 16px;
    vertical-align: middle;
    top: 0;
    right: -5px
}

.layui-table td {
    color: #333
}

.layout-grid-table .layui-table th {
    color: var(--table-th-color,#000);
    font-weight: bold;
    background: #eee;
    white-space: nowrap
}

.layout-grid-table .layui-table-header th > .layui-table-cell > * {
    white-space: nowrap
}

.layout-grid-table .layui-table tr {
    background-color: var( --table-tr-bg, #fff);
}

.layout-grid-table .layui-table tr.layui-table-hover {
    background-color: rgba(48,166,255, 0.15)
}

.layout-grid-table .layui-table tr.layui-table-click {
    background-color: rgba(48,166,255, 0.15)
}

.layout-grid-table .layui-table tr.layui-table-hover td, .layout-grid-table .layui-table tr.layui-table-click td {
    background-color: transparent !important
}

.layout-grid-table .layui-table-view .layui-table th, .layout-grid-table .layui-table-view .layui-table td {
    padding: 10px 0
}

@media screen and (max-width: 1601px) {
    .layout-grid-table .layui-table-view .layui-table td, .layout-grid-table .layui-table-view .layui-table td {
        padding: 5px 0
    }
}

.layout-grid-table .layui-table th, .layout-grid-table .layui-table td, .layout-grid-table .layui-table[lay-skin="line"], .layout-grid-table .layui-table[lay-skin="row"], .layout-grid-table .layui-table-view, .layout-grid-table .layui-table-tool, .layout-grid-table .layui-table-header, .layout-grid-table .layui-table-col-set, .layout-grid-table .layui-table-total, .layout-grid-table .layui-table-page, .layout-grid-table .layui-table-fixed-r, .layout-grid-table .layui-table-tips-main, .layout-grid-table .layui-table-grid-down {
    border-color: #ddd
}

.layout-grid-table .layui-table-cell {
    padding: 0 5px
}

.layui-table-sort[lay-sort="asc"] .layui-table-sort-asc {
    border-bottom-color: #606c88
}

.layui-table-sort[lay-sort="desc"] .layui-table-sort-desc {
    border-top-color: #606c88
}

.table-background-white .layout-grid-table .layui-table tr {
    background-color: #fff
}
.layui-table th{
    color: var(--table-th-color,#000);
}
.table-background-white .layout-grid-table .layui-table th, .table-background-white .layout-grid-table .layui-table td, .table-background-white .layout-grid-table .layui-table[lay-skin="line"], .table-background-white .layout-grid-table .layui-table[lay-skin="row"], .table-background-white .layout-grid-table .layui-table-view, .table-background-white .layout-grid-table .layui-table-tool, .table-background-white .layout-grid-table .layui-table-header, .table-background-white .layout-grid-table .layui-table-col-set, .table-background-white .layout-grid-table .layui-table-total, .table-background-white .layout-grid-table .layui-table-page, .table-background-white .layout-grid-table .layui-table-fixed-r, .table-background-white.layout-grid-table .layui-table-tips-main, .table-background-white .layout-grid-table .layui-table-grid-down {
    border-color: #eee;
    color: var( --table-th-color, #000);
}

.table-background-white .layout-grid-table .layui-table td {
    border-style: dashed
}

.table-background-white .layui-table[lay-skin="line"] th, .table-background-white .layui-table[lay-skin="line"] td {
    border-width: 0;
    border-bottom-width: 1px
}

.layout-A4 {
    margin: 20px auto;
    width: 60%;
    min-width: 700px;
    font-size: 12px;
    border: 1px solid #ddd;
    box-shadow: 0 0 5px 1px #ccc;
    padding: 16px
}

.layout-edit-table {
    font-size: 14px
}

.layout-edit-table > .table-title {
    margin: 0 auto;
    width: 90%;
    text-align: center
}

.layout-edit-table > .table-title > p {
    font-size: 18px;
    line-height: 20px;
    font-weight: bold
}

.layout-edit-table > .table-title > div {
    text-align: right
}

.layout-edit-table > table {
    margin: 0 auto;
    width: 100%;
    border: 1.5px solid #ddd;
    table-layout: fixed;
    font-family: "宋体", "华文细黑", arial, sans-serif
}

.onlyRead .layout-edit-table td {
    background-color: #efefef
}

.layout-edit-table .layout-form.form-style2 {
    margin: 0 auto;
    width: 100%;
    border: 0;
    padding: 0
}

.layout-edit-table th, .layout-edit-table td, .layout-edit-table .in-cos-edit {
    line-height: 30px;
    border: 1.5px solid #ddd;
    border-bottom: 0;
    box-sizing: border-box;
    min-height: 30px
}

.layout-edit-table > table:last-child th, .layout-edit-table > table:last-child td {
    border-bottom: 1.5px solid #ddd
}

.layout-edit-table th {
    text-align: center;
    background: #fafafa;
    color: #333;
    padding: 0 5px
}

.layout-edit-table .in-cos-edit {
    text-align: center;
    background: #fafafa;
    color: #333;
    padding: 0 5px;
    font-weight: bold
}

.layout-edit-table td {
    color: #555;
    min-width: 50px;
    box-sizing: border-box;
    cursor: text
}

.layout-edit-table td input, .layout-edit-table td textarea {
    border: 0;
    width: 100%;
    margin: 0;
    min-height: 32px;
    height: 100%;
    text-align: center;
    box-sizing: border-box;
    padding: 0 5px
}

.layout-edit-table td textarea {
    resize: none
}

.layout-edit-table .input-block {
    padding: 0 5px
}

.layout-edit-table .layout-edit-list th {
    position: relative
}

.layout-edit-table .layout-edit-list th .layui-form-select {
    opacity: 0;
    position: absolute
}

.layout-edit-table .layout-edit-list td {
    user-select: none;
    cursor: pointer;
    text-align: center;
    height: 32px;
    word-break: break-all
}

.layout-edit-table .layout-edit-list button {
    height: 24px;
    line-height: 22px;
    padding: 0 10px;
    border-radius: 2px;
    vertical-align: bottom
}

.layout-edit-table .layout-edit-list button.edit {
    border: 0;
    background-color: transparent;
    color: #6d8acc;
    font-size: 18px
}

.layout-edit-table .layout-edit-list button.delete {
    border: 0;
    background-color: transparent;
    color: #e94d4d;
    font-size: 18px
}

.layout-edit-table .layout-edit-list .empty-tr th, .layout-edit-table .layout-edit-list .empty-tr td {
    height: 20px;
    background: #fff
}

.layout-edit-table .layout-edit-list .inner-table-title th {
    font-weight: bold;
    font-size: 14px;
    color: #333
}

.layout-edit-table .layout-edit-list .default-tips td {
    color: #999
}

.layout-edit-table .layout-edit-list .appendRow td {
    text-align: center;
    height: 40px
}

.layout-edit-table .layout-edit-list .appendRow td > [data-action=addTr] {
    height: 24px;
    line-height: 24px;
    padding: 0 20px;
    border-radius: 2px
}

.layout-edit-table td.comb {
    position: relative
}

.layout-edit-table td.comb input {
    width: auto
}

.layout-edit-table td.comb button {
    height: 24px;
    line-height: 22px;
    padding: 0 5px;
    margin-right: 5px;
    position: absolute;
    right: 5px;
    top: 2px
}

.layout-edit-table .danger {
    border: red solid 1px
}

.layout-print-A4 {
    margin: 0 auto;
    width: 90%;
    min-width: 700px;
    font-size: 14px;
    padding-top: 10px;
    word-wrap: break-word
}

.layout-print-A4 .layui-form-radio * {
    font-size: 14px
}

.layout-print-A4.layout-edit-table > .table-title > p {
    padding: 5px 0;
    font-size: 24px
}

.layout-print-A4 > table {
    border: 0
}

.layout-print-A4 td {
    color: black
}

.onlyRead .layout-print-A4 td {
    background-color: #fff
}

.layout-print-A4 .text-center {
    color: black;
    width: 100%;
    text-align: center;
    float: left
}

.layout-print-A4 th, .layout-print-A4 td, .layout-print-A4 .in-cos-edit {
    border: 1px solid black;
    height: 32px;
    line-height: 32px
}

.layout-print-A4 > table:last-child th, .layout-print-A4 > table:last-child td {
    border-bottom: 1px solid black
}

.layout-print-A4 .layui-select-disabled .layui-disabled {
    border: none !important;
    background-color: #fff !important
}

.layui-table-view.layout-nest-table {
    border-top: 0;
    border-color: transparent
}

.layui-table-view.layout-nest-table .layui-table[lay-skin="line"] {
    border-top: 0;
    border-color: transparent
}

.layout-nest-table .layui-table-view .layui-table {
    width: 100%
}

.layout-nest-table .layui-table th {
    color: var(--table-th-color,#000);
    font-weight: bold;
    background: #eee
}

.layout-nest-table .layui-table tr {
    background-color: #fff
}

.layout-nest-table .layui-table th, .layout-nest-table .layui-table td {
    border-color: #eee
}

.layout-nest-table .layui-table tbody tr:hover {
    background-color: rgba(48, 166, 255, 0.15)
}

.layout-nest-table .layui-table tr.layui-table-click {
    background-color: rgba(48, 166, 255, 0.15)
}

.layui-table-cell .layout-spread {
    position: absolute;
    left: 0;
    top: 0;
    color: #5fb878
}

.layout-nest-table .layui-table-cell {
    padding: 0 5px
}

.layout-nest-table .layout-parent-table-tr {
    background-color: #ecf4ff !important
}

.layout-nest-table .layout-parent-table-tr td {
    border-top: 2px solid #c2cede
}

.layout-nest-table .layout-parent-table-tr td:first-child {
    border-left: 1px solid #c2cede
}

.layout-nest-table .layout-parent-table-tr td:last-child {
    border-right: 2px solid #c2cede
}

.layout-subTable .layui-table-view.layout-nest-table {
    border: 0
}

.layout-nest-table .layout-subTable .layui-table-box {
    border: 1px solid #c2cede;
    border-top: 0
}

.layout-nest-table .layui-table .layout-subTable.layui-table-hover, .layout-nest-table .layui-table .layout-subTable:hover {
    background-color: transparent
}

table.layout-nest-table th {
    margin: 0;
    padding: 0 !important
}

.layout-nest-table .marginBottom {
    margin-bottom: 10px
}

#Canvas_Design div.layout-banner {
    padding: 0;
    border: 0
}

#Canvas_Design div.layout-banner > div {
    padding: 0 !important
}

#Canvas_Design div.layout-banner div > ul {
    display: flex;
    height: 46px;
    padding: 5px;
    box-sizing: border-box;
    background: #f9f9f9;
    border-bottom: solid 1px #d8d8d8;
    position: relative
}

#Canvas_Design div.layout-banner div > ul > li {
    height: 100%;
    padding: 0 5px;
    white-space: nowrap;
    line-height: 36px;
    box-sizing: border-box
}

#Canvas_Design div.layout-banner div > ul:first-child > li ~ li {
    padding-top: 6px
}

#Canvas_Design div.layout-banner div > ul > li:first-child {
    line-height: 46px;
    height: 36px;
    margin-bottom: 5px
}

#Canvas_Design div.layout-banner div > ul > li:first-child > img {
    width: 20px;
    height: 45px;
    position: absolute;
    top: -5px;
    left: -5px
}

#Canvas_Design div.layout-banner div > ul > li {
    position: relative
}

#Canvas_Design div.layout-banner div > ul > li ~ li {
    border-right: 1.5px dashed #999;
    padding: 2px 10px
}

#Canvas_Design div.layout-banner div > ul > li > svg {
    width: 24px;
    height: 24px
}

#Canvas_Design div.layout-banner div > ul > li p {
    position: absolute;
    width: 100%;
    left: 5px;
    top: -14px;
    text-align: center;
    font-size: 10px;
    color: #999
}

#Canvas_Design div.layout-banner div > ul > li button {
    background: 0;
    margin: 0;
    padding: 0;
    color: #3f3f3f;
    position: relative;
    width: auto;
    height: auto;
    font-size: 20px;
    border: 0
}

#Canvas_Design div.layout-banner div > ul > li button svg {
    height: 36px;
    width: 36px
}

#Canvas_Design div.layout-banner div > ul ~ ul > li button svg {
    height: 18px;
    width: 18px
}

#Canvas_Design div.layout-banner div > ul ~ ul > li button ~ button {
    margin-left: 5px
}

#Canvas_Design div.layout-banner div > ul ~ ul > li button.layout {
    cursor: not-allowed;
    opacity: .3
}

.layout-card {
    padding: 5px 5px
}

.layout-card-header {
    padding: 5px;
    font-weight: bold;
    background-color: #f6f6f6
}

.layout-badge {
    text-align: center;
    display: inline-block;
    padding: 0 5px;
    font-size: 12px;
    color: #fff;
    border-radius: 10px;
    float: right;
    line-height: 24px;
    min-width: 60px
}

.layout-badge-center {
    text-align: center;
    display: inline-block;
    padding: 0 5px;
    font-size: 12px;
    color: #fff;
    border-radius: 10px;
    line-height: 24px;
    min-width: 60px
}

.layout-list-icon-center {
    text-align: center;
    display: inline-block;
    padding: 0 5px;
    font-size: 11px;
    color: #fff;
    border-radius: 5px;
    line-height: 20px;
    min-width: 45px
}

.layout-card-body {
    padding: 5px 5px;
    line-height: 30px;
    background-color: #f6f6f6
}

.layout-badge-grey {
    background-color: #a9a9a9;
    color: #fff
}

.layout-badge-blue {
    background-color: #4269e9
}

.layout-badge-cyan {
    background-color: #8eb7d9
}

.layout-badge-green {
    background-color: #1eb272
}

.layout-badge-mediumturquoise {
    background-color: #1eadd2
}

.layout-badge-orange {
    background-color: #e67926
}

.layout-badge-red {
    background-color: #e94d4d
}

.layout-background-blue {
    background-color: rgba(66, 105, 223, 0.15)
}

.layout-background-green {
    background-color: rgba(30, 178, 114, 0.15)
}

.layout-background-mediumturquoise {
    background-color: rgba(30, 173, 210, 0.15)
}

.layout-background-orange {
    background-color: rgba(230, 121, 38, 0.15)
}

.layout-background-red {
    background-color: rgba(233, 77, 77, 0.15)
}

.font-green {
    color: #1eb272
}

.font-mediumturquoise {
    color: #1eadd2
}

.font-orange {
    color: #e67926
}

.font-red {
    color: #e94d4d
}

.font-blue {
    color: #4269e9
}

.tags {
    padding: 0;
    height: 28px;
    width: 100%;
    line-height: 28px
}

.tags > i {
    font-size: 10px;
    display: inline-block;
    padding: 0 5px;
    font-style: normal;
    color: #fff;
    box-sizing: border-box
}

.tags > i[name="Normal"] {
    background: dodgerblue
}

.tags > i[name="ProLong"] {
    background: indigo
}

.tags > i[name="LogOut"] {
    color: #eee;
    background-color: grey
}

.tags > i[name="Complete"] {
    background: Green
}

.tags > i[name="Urgent"] {
    background: red
}

.tags > i[name="Assigned"] {
    background: burlywood
}

.tags > i[name="GreenChannel"] {
    color: #009688;
    border: 1px solid #009688
}

.tags > i[name="HangingUp"] {
    background: gold
}

.tags > i[name="Locked"] {
    background: goldenrod
}

.tags > i[name="Supervised"] {
    background: darkmagenta
}

.tags > i[name="OverDue"] {
    background: orange
}

.layout-tab > ul.layui-tab-title > li > i.bpm-refresh {
    font-family: "font_family";
    font-style: normal;
    font-weight: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #ccc;
    display: none
}

.layout-tab > ul.layui-tab-title li.layui-this > i.bpm-refresh {
    display: inline-block;
    width: 30px;
    height: 100%;
    position: static
}

.layout-tab > ul.layui-tab-title li.layui-this > i.bpm-refresh:before {
    position: absolute;
    right: 10px;
    top: 0
}

.layout-tab > ul.layui-tab-title li > i.bpm-refresh:hover {
    color: #009688
}

.bpm-form > ul > li {
    min-height: 36px;
    padding: 0;
    box-sizing: border-box
}

.bpm-form > ul > li > input, .bpm-form > ul > li .input-block, .bpm-form > ul > li > textarea, .bpm-form > ul > li > select {
    height: 28px
}

.bpm-form > ul > li > textarea {
    line-height: 28px
}

.bpm-toolbar > div:last-child {
    display: flex;
    justify-content: flex-end;
    overflow: unset
}

.bpm-toolbar .item_name {
    line-height: 34px;
    font-weight: bold;
    overflow: hidden;
    display: inline-block;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 100%
}

.bpm-toolbar .connect {
    display: flex;
    margin-right: 10px
}

.bpm-toolbar .connect > button {
    margin: 2px .5px
}

.bpm-toolbar .drop {
    position: relative
}

.bpm-toolbar .drop > a {
    display: inline-block;
    height: 30px;
    line-height: 28px;
    padding: 0 15px;
    background-color: #fff;
    color: #009688;
    border: 1px solid #009688;
    white-space: nowrap;
    text-align: center;
    border-radius: 0;
    cursor: pointer;
    margin: 2px 0;
    user-select: none
}

.bpm-toolbar .drop > a:active {
    border-color: #009688;
    background-color: #fff;
    color: #009688
}

.bpm-toolbar .drop > a:hover {
    opacity: .8
}

.bpm-toolbar .drop > dl {
    position: absolute;
    top: 32px;
    width: 100%;
    text-align: center;
    border: 1px solid #009688;
    border-top: 0;
    background: #fff;
    z-index: 2;
    line-height: 30px;
    box-sizing: border-box
}

.bpm-toolbar .drop > dl > dd {
    color: #009688
}

.bpm-toolbar .drop > dl > dd ~ dd {
    padding: 0
}

.bpm-toolbar .drop > dl > dd > button {
    color: #009688;
    display: inline-block;
    width: 100%;
    height: 100%;
    cursor: pointer;
    border: 0;
    background-color: transparent;
    border-top: 1px solid #009688;
    margin: 0
}

.bpm-toolbar .drop > dl > dd:hover, .layout-toolbar .drop > dl > dd:active {
    background-color: #009688
}

.bpm-toolbar .drop > dl > dd > button:hover, .layout-toolbar .drop > dl > dd > button:active {
    color: #fff
}

.bpm-save-check {
    padding-top: 15px;
    padding-left: 30px;
    font-weight: bold;
    color: #303133
}

.bpm-save-check li {
    position: relative;
    padding-bottom: 20px
}

.bpm-save-check .check-steps-item {
    position: absolute;
    left: 4px;
    height: 50%;
    width: 1px;
    padding: 22px 0 0
}

.bpm-save-check .check-steps-item > i {
    display: inline-block;
    width: 1px;
    height: 100%;
    vertical-align: top;
    background: #e8eaec;
    border-radius: 1px;
    position: relative
}

.bpm-save-check .check-steps-item > i:after {
    content: "";
    width: 0;
    height: 100%;
    background: #e8eaec;
    opacity: 0;
    position: absolute;
    top: 0
}

.bpm-save-check .check-steps-item.steps-status-finish > i:after {
    width: 100%;
    background: #2d8cf0;
    transition: all .2s ease-in-out;
    opacity: 1
}

.bpm-save-check li:last-child .check-steps-item {
    display: none
}

.bpm-save-check .error {
    color: #f44336
}

.bpm-save-check .pass {
    color: #4caf50
}

.bpm-save-check .component_name {
    position: relative;
    padding-left: 32px;
    color: #303133;
    top: 1px;
    padding-bottom: 10px
}

.bpm-save-check .progress-node {
    left: -5px;
    width: 20px;
    height: 20px;
    position: absolute;
    background-color: #e4e7ed;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center
}

.bpm-save-check .progress-node i {
    font-size: 20px
}

.bpm-save-check .c-ring {
    animation: layout-rotate 1.5s .3s cubic-bezier(.17, .37, .43, .67) infinite;
    color: #409eff
}

.bpm-save-check .c-ring-1 {
    width: 5px;
    height: 5px;
    margin: 0 auto;
    padding: 10px;
    border: 2px dashed #409eff;
    border-radius: 100%
}

.bpm-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #f5f6fa;
    color: #333;
    text-align: center;
    z-index: 10000
}

.bpm-animation {
    -webkit-animation-duration: 1.2s;
    animation-duration: 1.2s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

.layout-chart {
    padding: 10px;
    background-color: #fff;
    width: calc(100% - 20px)
}

.layout-chart > .chart-panel {
    margin: 0;
    -webkit-box-shadow: none;
    box-shadow: none
}

.layout-chart > .chart-panel > .panel-heading {
    padding: 5px 5px 10px
}

.layout-chart > .chart-panel > .panel-heading > .panel-title {
    font-weight: 700;
    line-height: 25px
}

.layout-chart > .chart-panel > .panel-body {
    padding: 5px
}

.layout-chart > .chart-panel > .panel-body > .panel-title {
    line-height: 25px
}

.layout-chart > .chart-panel > .panel-table > table {
    width: 100%;
    font-size: inherit;
    background-color: transparent;
    border-collapse: collapse
}

.layout-chart > .chart-panel > .panel-table > table th {
    padding: 5px;
    font-weight: bold;
    color: #000;
    border: 1px solid #cbd0db
}

.layout-chart > .chart-panel > .panel-table > table td {
    padding: 10px;
    border: 1px solid #cbd0db
}

.layout-chart > .chart-panel > .panel-table > .land-grid-input > td input {
    border: 0
}

.layout-chart > .chart-panel > .panel-table > table td a, table th a {
    color: #1e9fff;
    cursor: pointer
}

.layout-chart > .chart-panel .text-left {
    text-align: left
}

.layout-chart > .chart-panel .text-right {
    text-align: right
}

.layout-chart > .chart-panel .text-center {
    text-align: center
}

.layout-title {
    margin: 20px 0 10px;
    padding: 0 5px;
    border-left: 5px solid #009688;
    height: 24px;
    font-size: 16px;
    font-weight: bold;
    color: #009688;
    line-height: 24px;
    position: relative
}

.layout-title > button.font_family {
    position: absolute;
    right: 0;
    bottom: 0;
    font-size: 14px;
    padding: 0 10px;
    border: 0;
    background-color: rgba(0, 150, 136, 0.1);
    font-weight: normal
}

ul.data {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    padding: 20px 10px
}

ul.data > li {
    text-align: center
}

ul.data ul {
    display: flex;
    justify-content: center;
    padding: 5px
}

ul.data ul > li {
    margin: 10px 20px
}

ul.data ul > li ~ li {
    margin-left: 0;
    padding-left: 20px
}

ul.data > li ~ li {
    margin-left: 10px
}

ul.data ul > li > div {
    font-size: 20px;
    margin-bottom: 5px
}

ul.data ul > li > p {
    font-size: 12px;
    color: #999
}

li.blue {
    color: #597ef7
}

li.blue > ul {
    background: rgba(89, 126, 247, 1);
    color: #fff
}

li.lightblue {
    color: #597ef7
}

li.lightblue > ul {
    background: rgba(89, 126, 247, 0.1)
}

li.orange {
    color: #ff812d
}

li.orange > ul {
    background: rgba(255, 129, 45, 1);
    color: #fff
}

li.lightorange {
    color: #ff812d
}

li.lightorange > ul {
    background: rgba(255, 129, 45, 0.1);
    color: #ff812d
}

li.green1 {
    color: #05d991
}

li.green1 > ul {
    background: rgba(5, 217, 145, 1);
    color: #fff
}

li.lightgreen1 {
    color: #05d991
}

li.lightgreen1 > ul {
    background: rgba(5, 217, 145, 0.1);
    color: #05d991
}

li.green2 {
    color: #2abe39
}

li.green2 > ul {
    background: rgba(42, 190, 57, 1);
    color: #fff
}

li.lightgreen2 {
    color: #2abe39
}

li.lightgreen2 > ul {
    background: rgba(42, 190, 57, 0.1);
    color: #2abe39
}

li.purple {
    color: #bf50ee
}

li.purple > ul {
    background: rgba(191, 80, 238, 1);
    color: #fff
}

li.lightpurple {
    color: #bf50ee
}

li.lightpurple > ul {
    background: rgba(191, 80, 238, 0.1);
    color: #bf50ee
}

ul.data ul > li ~ li {
    border-left: 1px;
    border-left-style: solid;
    border-left-color: #fff
}

ul.data li.lightpurple ul > li ~ li {
    border-left: 1px;
    border-left-style: solid;
    border-left-color: #bf50ee
}

ul.data li.lightblue ul > li ~ li {
    border-left: 1px;
    border-left-style: solid;
    border-left-color: #597ef7
}

ul.data li.lightorange ul > li ~ li {
    border-left: 1px;
    border-left-style: solid;
    border-left-color: #ff812d
}

ul.data li.lightgreen1 ul > li ~ li {
    border-left: 1px;
    border-left-style: solid;
    border-left-color: #05d991
}

ul.data li.lightgreen2 ul > li ~ li {
    border-left: 1px;
    border-left-style: solid;
    border-left-color: #2abe39
}

@media screen and (max-width: 1280px) {
    body {
        font-size: 12px
    }

    .layout-home > nav .layui-nav .layui-nav-item i.font_family {
        font-size: 18px
    }

    .layui-nav *, .layout-home > nav .layui-nav .layui-nav-item .layui-nav-child dd a, .layui-tab-title li {
        font-size: 12px
    }

    section.layout-home > aside.layout-home-aside > .layout-home-system {
        font-size: 14px
    }

    .layout-home-navigate .system-all .system-all-name, .layout-home-navigate .sidebar-moduleList .module-recent-visit h3, .layout-home-navigate .sidebar-moduleList .module-recent-visit dd a, .layout-home-navigate .module-category-list .sidebar-module-category .sidebar-module-category-item li.module, .layout-home-navigate .module-category-list .sidebar-module-category .sidebar-module-category-item h5 {
        font-size: 12px
    }

    .layout-home-navigate .sidebar-moduleList .module-search .module-search-input {
        font-size: 14px
    }

    button {
        font-size: 12px
    }

    button.small {
        font-size: 10px
    }

    button.large {
        font-size: 14px
    }

    .layui-table th, .layui-table td {
        font-size: 12px
    }

    .layout-tree .layui-table-cell i.node-line:before {
        margin-left: 16px
    }

    .layout-tree .layui-table-cell i.last-node-line:before {
        margin-left: 16px
    }

    .layout-form ul > li.item-line > label {
        font-size: 14px
    }

    .layui-layer-title {
        font-size: 12px
    }

    .layout-page div.layout-line > label {
        font-size: 14px
    }
}

@-webkit-keyframes fadeout {
    0% {
        opacity: 1
    }
    33% {
        opacity: .66
    }
    66% {
        opacity: .33
    }
    100% {
        opacity: 0
    }
}

@keyframes fadeout {
    0% {
        opacity: 1
    }
    33% {
        opacity: .66
    }
    66% {
        opacity: .33
    }
    100% {
        opacity: 0
    }
}

.layout-fadeout {
    -webkit-animation-name: fadeout;
    animation-name: fadeout
}

@-webkit-keyframes layout-rotate {
    0% {
        transform: rotate(0deg)
    }
    50% {
        transform: rotate(180deg)
    }
    100% {
        transform: rotate(360deg)
    }
}

@keyframes layout-rotate {
    0% {
        transform: rotate(0deg)
    }
    50% {
        transform: rotate(180deg)
    }
    100% {
        transform: rotate(360deg)
    }
}

@keyframes layout-loadingS {
    40% {
        transform: translateX(0);
        opacity: .8
    }
    100% {
        transform: translateX(300px);
        opacity: 0
    }
}

@-webkit-keyframes slideOutRight {
    0% {
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1
    }
    70% {
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        height: auto;
        padding: 16px;
        margin-bottom: 10px;
        opacity: 0
    }
    to {
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        height: 0;
        padding: 0;
        margin-bottom: 0;
        opacity: 0
    }
}

@keyframes slideOutRight {
    0% {
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1
    }
    70% {
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        height: auto;
        padding: 16px;
        margin-bottom: 10px;
        opacity: 0
    }
    to {
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        height: 0;
        padding: 0;
        margin-bottom: 0;
        opacity: 0
    }
}

.layout-slideOutRight {
    -webkit-animation-name: slideOutRight;
    animation-name: slideOutRight
}

@-webkit-keyframes slideInRight {
    0% {
        opacity: 0;
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }
    to {
        opacity: 1;
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes slideInRight {
    0% {
        opacity: 0;
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }
    to {
        opacity: 1;
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

.layout-slideInRight {
    -webkit-animation-name: slideInRight;
    animation-name: slideInRight
}

@-webkit-keyframes layout-twinkle {
    0% {
        opacity: 1
    }
    50% {
        opacity: .5
    }
    100% {
        opacity: 1
    }
}

@keyframes layout-twinkle {
    0% {
        opacity: 1
    }
    50% {
        opacity: .5
    }
    100% {
        opacity: 1
    }
}

.layout-map {
    cursor: pointer;
    height: 100%
}

.layout-map button:focus {
    outline: 0
}

.layout-map * {
    box-sizing: border-box
}

.layout-map .upload-add::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    height: 20px;
    margin-left: -1px;
    margin-top: -10px;
    border-left: 2px solid
}

.layout-map .upload-add::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 20px;
    margin-left: -10px;
    margin-top: -1px;
    border-top: 2px solid
}

.layout-map .mainMap-container {
    flex: 1;
    height: 100%;
    overflow: hidden;
    position: relative;
    transition: all .2s ease
}

.layout-map .compareMap-container {
    flex: 1;
    overflow: hidden;
    height: 100%;
    position: relative;
    transition: all .2s ease
}

.layout-map .threeDMap-container {
    flex: 1;
    width: 0;
    height: 100%;
    overflow: hidden;
    position: relative;
    transition: all .2s ease
}

.layout-map .container-hide {
    flex: 0
}

.layout-map .dimension-container {
    position: absolute;
    right: 8px;
    bottom: 26px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100px;
    transition: all .4s;
    overflow: hidden
}

.layout-map .dimension-container:hover {
    width: 216px
}

.layout-map .secondMode, .layout-map .thirdMode {
    width: 100px;
    position: relative;
    height: 100px;
    background-size: cover;
    display: flex;
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    border: solid 1px #1890ff;
    border-radius: 4px;
    cursor: pointer
}

.layout-map .secondMode .mode-label, .layout-map .thirdMode .mode-label {
    transition: all .4s;
    padding: 4px;
    background-color: #1890ff;
    opacity: 1;
    border-radius: 4px;
    color: #fff;
    position: relative;
    z-index: 2
}

.layout-map .unSelectedMode::after {
    content: '';
    position: absolute;
    width: 100px;
    height: 100px;
    top: 0;
    left: 0;
    z-index: 1;
    background: rgba(0, 0, 0, 0.4)
}

.layout-map .unSelectedMode .mode-label {
    opacity: .7
}

.layout-map .treeData-container {
    position: absolute;
    top: 24px;
    left: 8px
}

.layout-map .common-btn {
    position: relative;
    display: inline-block;
    font-weight: 400;
    white-space: nowrap;
    text-align: center;
    background-image: none;
    border: 1px solid transparent;
    box-shadow: 0 2px 0 rgba(0, 0, 0, 0.015);
    cursor: pointer;
    transition: all .3s cubic-bezier(0.645, 0.045, 0.355, 1);
    user-select: none;
    height: 32px;
    padding: 4px 15px;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.65);
    background-color: #fff;
    border-color: #d9d9d9
}

.layout-map .common-btn-primary {
    color: #fff;
    background-color: #1890ff;
    border-color: #1890ff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.12);
    -webkit-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.045);
    box-shadow: 0 2px 0 rgba(0, 0, 0, 0.045)
}

.layout-map .common-btn.common-btn-primary:hover, .layout-map .common-btn.common-btn-primary:focus {
    color: #fff;
    background-color: #1890ff;
    border-color: #1890ff
}

.layout-map .common-btn[disabled] {
    color: rgba(0, 0, 0, 0.25);
    background-color: #f5f5f5;
    cursor: not-allowed;
    border-color: #d9d9d9;
    text-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none
}

.layout-map .common-btn[disabled]:hover {
    color: rgba(0, 0, 0, 0.25);
    background-color: #f5f5f5;
    border-color: #d9d9d9;
    text-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none
}

.layout-map .common-btn-input {
    opacity: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    z-index: 2
}

.layout-map .common-btn:hover {
    color: #1890ff;
    background-color: #fff;
    border-color: #1890ff;
    opacity: 1
}

.layout-map .common-btn-dropdown {
    padding-right: 24px
}

.layout-map .common-btn-dropdown::after {
    content: '';
    width: 6px;
    height: 6px;
    position: absolute;
    top: 10px;
    right: 10px;
    display: block;
    border: solid 1px #000;
    border-left: transparent;
    border-top: transparent;
    transform: rotate(45deg);
    transition: all .3s cubic-bezier(0.645, 0.045, 0.355, 1)
}

.layout-map .common-btn-dropdown:hover::after {
    border-color: #1890ff
}

.layout-map ul, .layout-map ol {
    list-style: none
}

.layout-map .common-dropdown-container {
    position: relative;
    margin: 0;
    z-index: 20201000;
    padding: 4px 0;
    text-align: left;
    list-style-type: none;
    background-color: #fff;
    background-clip: padding-box;
    border-radius: 2px;
    outline: 0;
    transition: all .2s ease-in-out;
    box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05)
}

.layout-map .common-dropdown-item {
    clear: both;
    margin: 0;
    padding: 5px 12px;
    color: rgba(0, 0, 0, 0.65);
    font-weight: normal;
    font-size: 14px;
    line-height: 22px;
    white-space: nowrap;
    cursor: pointer;
    -webkit-transition: all .3s;
    transition: all .3s
}

.layout-map .common-dropdown-item:hover {
    background-color: #f5f5f5
}

.layout-map .common-drawer-container {
    position: absolute;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.15);
    transition: transform .4s ease-in-out;
    right: 3000px;
    padding: 16px;
    background-color: #fff
}

.layout-map .common-drawer-header {
    height: 24px;
    font-weight: bold;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.layout-map .drawer-bottom {
    display: block;
    z-index: 20201020;
    width: 100%;
    height: 400px;
    bottom: 0;
    right: 0;
    transform: translateY(100%);
    background-color: rgba(255, 255, 255, 0.4)
}

.layout-map .drawer-bottom .common-drawer-content {
    background-color: initial
}

.layout-map .drawer-left {
    display: block;
    z-index: 20201000;
    width: 350px;
    height: 100%;
    left: 0;
    top: 0;
    transform: translateX(-100%)
}

.layout-map .drawer-right {
    display: block;
    z-index: 20201000;
    width: 350px;
    height: 100%;
    right: 0;
    top: 0;
    transform: translateX(100%)
}

.layout-map .common-drawer-slide-top {
    transform: translateY(0)
}

.layout-map .common-drawer-slide-left {
    transform: translateX(0)
}

.layout-map .common-drawer-slide-right {
    transform: translateX(0)
}

.layout-map .common-drawer-close {
    width: 16px;
    height: 16px;
    position: relative;
    cursor: pointer
}

.layout-map .common-drawer-close::before, .layout-map .common-drawer-close::after {
    content: "";
    position: absolute;
    height: 20px;
    width: 1.5px;
    top: 0;
    right: 9px;
    background: #000
}

.layout-map .common-drawer-close::before {
    transform: rotate(45deg)
}

.layout-map .common-drawer-close::after {
    transform: rotate(-45deg)
}

.layout-map .common-drawer-content {
    position: relative;
    z-index: 1;
    height: calc(100% - 24px);
    background-color: #fff;
    background-clip: padding-box;
    border: 0;
    overflow: hidden
}

.layout-map .common-table {
    width: 100%;
    background-color: #fff;
    color: #666;
    border-collapse: collapse;
    border-spacing: 0
}

.layout-map .common-table td, .layout-map .common-table th {
    position: relative;
    padding: 9px 15px;
    min-height: 20px;
    line-height: 20px;
    font-size: 14px;
    border-width: 1px;
    border-style: solid;
    border-color: #e6e6e6
}

.layout-map .common-table thead tr {
    background-color: #f2f2f2
}

.layout-map .common-list-container {
    margin: 0;
    padding: 0;
    list-style: none
}

.layout-map .common-list-item {
    display: flex;
    justify-content: space-between;
    padding-right: 24px;
    padding-left: 24px;
    padding-top: 16px;
    padding-bottom: 16px;
    border-bottom: 1px solid #f0f0f0
}

.layout-map .common-tab-container {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    color: rgba(0, 0, 0, 0.65);
    font-size: 14px;
    font-variant: tabular-nums;
    line-height: 1.5715;
    list-style: none;
    font-feature-settings: 'tnum';
    position: relative;
    overflow: hidden;
    height: 100%
}

.layout-map .common-tab-controller {
    position: relative;
    display: inline-block;
    box-sizing: border-box;
    margin: 0;
    padding-left: 0;
    list-style: none;
    width: 100%;
    border-bottom: solid 1px #f0f0f0
}

.layout-map .common-tab-controller-item {
    position: relative;
    display: inline-block;
    box-sizing: border-box;
    height: 100%;
    margin: 0 32px 0 0;
    padding: 12px 0;
    text-decoration: none;
    cursor: pointer;
    transition: color .3s cubic-bezier(0.645, 0.045, 0.355, 1)
}

.layout-map .common-tab-controller-item:active {
    color: #1890ff;
    font-weight: 500
}

.layout-map .common-tab-item-active {
    border-bottom: solid 1px #1890ff
}

.layout-map .common-tab-content {
    margin-left: 0;
    transition: all .2s ease-in-out;
    display: flex;
    height: calc(100% - 50px)
}

.layout-map .common-tab-content-item {
    display: inline-block;
    width: 100%;
    flex-shrink: 0;
    opacity: 1;
    transition: all .2s ease-in-out;
    height: 100%;
    overflow-y: auto
}

.layout-map .common-tab-content-item-inactive {
    height: 0;
    overflow: hidden;
    opacity: 0
}

.layout-map .common-dialog-container {
    position: fixed;
    display: none;
    opacity: 0;
    width: 500px;
    height: 400px;
    background: #fff;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    transition: opacity .4s ease;
    box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05)
}

.layout-map .common-dialog-open {
    z-index: 20201031;
    opacity: 1
}

.layout-map .common-dialog-header {
    padding: 8px 16px;
    height: 40px;
    display: flex;
    font-size: 18px;
    font-weight: bold;
    justify-content: space-between;
    border-bottom: #f0f0f0 solid 1px;
    align-items: center
}

.layout-map .common-dialog-footer {
    border-top: #f0f0f0 solid 1px;
    height: 40px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 8px 16px
}

.layout-map .common-dialog-footer button {
    margin-right: 8px
}

.layout-map .common-dialog-content {
    flex-grow: 1;
    padding: 8px 16px;
    display: flex;
    flex-direction: column;
    overflow-y: auto
}

.layout-map .common-dialog-mask {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    height: 100%;
    width: 100%;
    display: none;
    background-color: #000;
    opacity: 0;
    transition: opacity .6s ease
}

.layout-map .common-dialog-mask-open {
    z-index: 20201030;
    opacity: .45
}

.layout-map .common-radio-container {
    margin-right: 8px
}

.layout-map .projection-btn-container {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 16px
}

.layout-map .import-data-dialog {
    height: 100%;
    display: flex;
    flex-direction: column
}

.layout-map .coord-show {
    flex-grow: 1
}

.layout-map .common-margin-bottom {
    margin-bottom: 16px
}

.layout-map .analyze-container {
    height: 100%;
    display: flex;
    flex-direction: column
}

.layout-map .analyze-radio {
    margin: 16px 8px
}

.layout-map .analyze-container-data-content {
    padding-top: 16px;
    flex: 1;
    overflow-y: auto;
    width: 100%;
    margin-bottom: 16px;
    border-bottom: solid 1px #f0f0f0
}

.layout-map .common-popover {
    transform: scale(0);
    position: absolute;
    padding: 16px;
    z-index: 20201020;
    min-height: 200px;
    max-height: 400px;
    overflow: auto;
    min-width: 300px;
    max-width: 350px;
    background-color: #fff;
    background-clip: padding-box;
    border-radius: 2px;
    box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.15) \9;
    transition: transform .2s ease
}

.layout-map .common-popover-open {
    transform: scale(1)
}

.layout-map .common-tree-describe {
    padding: 4px;
    display: flex;
    align-items: center;
    min-width: 200px
}

.layout-map .common-tree-expand-icon {
    font-size: 12px !important;
    margin-right: 4px;
    cursor: pointer;
    transition: transform .2s ease-in-out
}

.layout-map .common-tree-open {
    transform: rotate(90deg);
    transform-origin: 50% 50% 0
}

.layout-map .common-checkbox-wrapper {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    color: rgba(0, 0, 0, 0.65);
    font-size: 14px;
    font-variant: tabular-nums;
    line-height: 1.5715;
    list-style: none;
    -webkit-font-feature-settings: 'tnum';
    font-feature-settings: 'tnum';
    display: inline-block;
    cursor: pointer
}

.layout-map .common-checkbox {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    color: rgba(0, 0, 0, 0.65);
    font-size: 14px;
    font-variant: tabular-nums;
    line-height: 1.5715;
    list-style: none;
    -webkit-font-feature-settings: 'tnum';
    font-feature-settings: 'tnum';
    position: relative;
    top: -0.09em;
    display: inline-block;
    line-height: 1;
    white-space: nowrap;
    vertical-align: middle;
    outline: 0;
    cursor: pointer
}

.layout-map .common-checkbox-input {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    cursor: pointer;
    opacity: 0
}

.layout-map .common-checkbox-inner {
    position: relative;
    top: 0;
    left: 0;
    display: block;
    width: 16px;
    height: 16px;
    background-color: #fff;
    border: 1px solid #d9d9d9;
    border-radius: 2px;
    border-collapse: separate;
    -webkit-transition: all .3s;
    transition: all .3s;
    box-sizing: border-box
}

.layout-map .common-checkbox-checked .common-checkbox-inner {
    background-color: #1890ff;
    border-color: #1890ff
}

.layout-map .common-checkbox + span {
    padding-right: 2px;
    padding-left: 2px
}

.layout-map .common-checkbox-checked .common-checkbox-inner::after {
    position: absolute;
    display: table;
    border: 2px solid #fff;
    border-top: 0;
    border-left: 0;
    -webkit-transform: rotate(45deg) scale(1) translate(-50%, -50%);
    transform: rotate(45deg) scale(1) translate(-50%, -50%);
    opacity: 1;
    -webkit-transition: all .2s cubic-bezier(0.12, 0.4, 0.29, 1.46) .1s;
    transition: all .2s cubic-bezier(0.12, 0.4, 0.29, 1.46) .1s;
    content: ' '
}

.layout-map .common-checkbox-inner::after {
    position: absolute;
    top: 50%;
    left: 22%;
    display: table;
    width: 5.71428571px;
    height: 9.14285714px;
    border: 2px solid #fff;
    border-top: 0;
    border-left: 0;
    -webkit-transform: rotate(45deg) scale(0) translate(-50%, -50%);
    transform: rotate(45deg) scale(0) translate(-50%, -50%);
    opacity: 0;
    -webkit-transition: all .1s cubic-bezier(0.71, -0.46, 0.88, 0.6), opacity .1s;
    transition: all .1s cubic-bezier(0.71, -0.46, 0.88, 0.6), opacity .1s;
    content: ' '
}

.layout-map .common-checkbox-checked::after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 1px solid #1890ff;
    border-radius: 2px;
    visibility: hidden;
    -webkit-animation: antCheckboxEffect .36s ease-in-out;
    animation: antCheckboxEffect .36s ease-in-out;
    -webkit-animation-fill-mode: backwards;
    animation-fill-mode: backwards;
    content: ''
}

.layout-map .common-radio-wrapper {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    color: rgba(0, 0, 0, 0.65);
    font-size: 14px;
    font-variant: tabular-nums;
    line-height: 1.5715;
    list-style: none;
    -webkit-font-feature-settings: 'tnum';
    font-feature-settings: 'tnum';
    position: relative;
    display: inline-block;
    margin-right: 8px;
    white-space: nowrap;
    cursor: pointer
}

.layout-map .common-radio {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    color: rgba(0, 0, 0, 0.65);
    font-size: 14px;
    font-variant: tabular-nums;
    line-height: 1.5715;
    list-style: none;
    -webkit-font-feature-settings: 'tnum';
    font-feature-settings: 'tnum';
    position: relative;
    display: inline-block;
    line-height: 1;
    white-space: nowrap;
    vertical-align: sub;
    outline: 0;
    cursor: pointer
}

.layout-map input[type='radio'], .layout-map input[type='checkbox'] {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0
}

.layout-map .common-radio-input {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    cursor: pointer;
    opacity: 0
}

.layout-map .common-radio-checked .common-radio-inner {
    border-color: #1890ff
}

.layout-map .common-radio-inner {
    box-sizing: border-box;
    position: relative;
    top: 0;
    left: 0;
    display: block;
    width: 16px;
    height: 16px;
    background-color: #fff;
    border-color: #d9d9d9;
    border-style: solid;
    border-width: 1px;
    border-radius: 100px;
    -webkit-transition: all .3s;
    transition: all .3s
}

.layout-map .common-radio-checked::after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 1px solid #1890ff;
    border-radius: 50%;
    visibility: hidden;
    -webkit-animation: antRadioEffect .36s ease-in-out;
    animation: antRadioEffect .36s ease-in-out;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    content: ''
}

.layout-map .common-radio-checked .common-radio-inner::after {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    -webkit-transition: all .3s cubic-bezier(0.78, 0.14, 0.15, 0.86);
    transition: all .3s cubic-bezier(0.78, 0.14, 0.15, 0.86)
}

.layout-map .common-radio-inner::after {
    position: absolute;
    top: 3px;
    left: 3px;
    display: table;
    width: 8px;
    height: 8px;
    background-color: #1890ff;
    border-top: 0;
    border-left: 0;
    border-radius: 8px;
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 0;
    -webkit-transition: all .3s cubic-bezier(0.78, 0.14, 0.15, 0.86);
    transition: all .3s cubic-bezier(0.78, 0.14, 0.15, 0.86);
    content: ' '
}

.layout-map .common-radio-block > label {
    display: block;
    margin-bottom: 8px
}

.layout-map .projection-select {
    display: flex;
    justify-content: space-between;
    border-bottom: solid 1px #f0f0f0;
    padding-bottom: 8px
}

.layout-map .common-input:hover {
    border-color: #1890ff;
    border-right-width: 1px !important
}

.layout-map .common-input:placeholder-shown {
    text-overflow: ellipsis
}

.layout-map .common-input {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-variant: tabular-nums;
    list-style: none;
    -webkit-font-feature-settings: 'tnum';
    font-feature-settings: 'tnum';
    position: relative;
    display: inline-block;
    width: 100%;
    min-width: 0;
    padding: 4px 11px;
    color: rgba(0, 0, 0, 0.65);
    font-size: 14px;
    line-height: 1.5715;
    background-color: #fff;
    background-image: none;
    border: 1px solid #d9d9d9;
    border-radius: 2px;
    -webkit-transition: all .3s;
    transition: all .3s
}

.layout-map .common-spin-container {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    background: #fff;
    opacity: 0;
    transition: opacity .3s;
    pointer-events: none
}

.layout-map .common-spin-open {
    z-index: 20201009;
    opacity: .4
}

.layout-map .common-spin-container .common-spin {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    color: rgba(0, 0, 0, 0.65);
    font-size: 14px;
    font-variant: tabular-nums;
    line-height: 1.5715;
    list-style: none;
    -webkit-font-feature-settings: 'tnum';
    font-feature-settings: 'tnum';
    position: absolute;
    display: none;
    color: #1890ff;
    text-align: center;
    vertical-align: middle;
    opacity: 0;
    -webkit-transition: -webkit-transform .3s cubic-bezier(0.78, 0.14, 0.15, 0.86);
    transition: -webkit-transform .3s cubic-bezier(0.78, 0.14, 0.15, 0.86);
    transition: transform .3s cubic-bezier(0.78, 0.14, 0.15, 0.86)
}

.layout-map .common-spin-dot-spin {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-animation: antRotate 1.2s infinite linear;
    animation: antRotate 1.2s infinite linear
}

.layout-map .common-spin-dot {
    position: relative;
    display: inline-block;
    font-size: 20px;
    width: 1em;
    height: 1em
}

.layout-map .common-spin-dot-item:nth-child(1) {
    top: 0;
    left: 0
}

.layout-map .common-spin-dot-item {
    position: absolute;
    display: block;
    width: 9px;
    height: 9px;
    background-color: #1890ff;
    border-radius: 100%;
    -webkit-transform: scale(0.75);
    transform: scale(0.75);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    opacity: .3;
    -webkit-animation: antSpinMove 1s infinite linear alternate;
    animation: antSpinMove 1s infinite linear alternate
}

.layout-map .ol-mouse-position {
    right: 8px;
    bottom: 8px;
    top: auto
}

.layout-map .ol-zoom {
    bottom: 4.5em;
    top: auto
}

.layout-map .common-notification {
    right: -300px;
    box-sizing: border-box;
    margin: 0;
    color: rgba(0, 0, 0, 0.65);
    font-size: 14px;
    font-variant: tabular-nums;
    line-height: 1.5715;
    list-style: none;
    -webkit-font-feature-settings: 'tnum';
    font-feature-settings: 'tnum';
    position: absolute;
    z-index: 20201010;
    width: 300px;
    max-width: calc(100vw - 32px);
    transition: right .2s ease-in-out;
    background: #fff;
    box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05)
}

.layout-map .common-notification-show {
    right: 8px
}

.layout-map .common-notification-notice-content {
    padding: 16px 24px;
    line-height: 1.5715
}

.layout-map .common-notification-notice-message {
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px
}

.layout-map #treeIdcompareMap .layui-tree-txt {
    color: #555 !important
}

.layout-map #treeIdmainMap .layui-tree-txt {
    color: #555 !important
}

.layout-map .tree-menu-panel-show {
    z-index: 20201032 !important
}

.layout-map .source-layer {
    position: absolute;
    top: 64px;
    right: 8px;
    z-index: 100
}

.layout-map .ol-overviewmap {
    bottom: 2.5em
}

.layout-map .source-layer-middle {
    right: 52%
}

.layout-map .extraBtn-container {
    position: absolute
}

.layout-map .node-container-children-container {
    padding-left: 32px
}

.layout-map .node-expand {
    min-width: 16px;
    min-height: 1px;
    display: inline-block;
    font-size: 12px;
    cursor: pointer;
    transition: transform .2s ease-in-out
}

.layout-map .node-expand-animation {
    transform: rotate(90deg);
    transform-origin: 50% 50%
}

.layout-map .node-container-nodeInfo {
    position: relative;
    cursor: pointer;
    transition: all .2s ease-in-out;
    display: flex;
    align-items: center
}

.layout-map .node-label {
    padding: 0 4px;
    transition: all .2s ease;
    display: inline-block;
    word-break: break-all;
    width: 140px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.layout-map .node-operate {
    position: absolute;
    right: 0;
    top: 2px
}

.layout-map .node-operate .iconfont {
    margin-left: 4px;
    font-size: 10px;
    transition: all .2s
}

.layout-map .node-operate .iconfont:hover {
    color: #1890ff
}

.layout-map .opacity-change {
    width: 50px
}

.layout-map .opacity-change input[type=range] {
    -webkit-appearance: none;
    width: 50px;
    border-radius: 10px
}

.layout-map .opacity-change input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none
}

.layout-map .opacity-change input[type=range]::-webkit-slider-runnable-track {
    height: 4px;
    border-radius: 10px;
    background-color: #e1e1e1;
    margin-bottom: 4px
}

.layout-map .opacity-change input[type=range]:focus {
    outline: 0
}

.layout-map .opacity-change input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    height: 12px;
    width: 12px;
    margin-top: -4px;
    background: #fff;
    border-radius: 50%;
    border: solid .125em #1890ff
}

.layout-map .node-label:hover {
    background-color: #bae7ff
}

.layout-map .node-label-select {
    background-color: #bae7ff
}

.layout-map .node-drag {
    background-color: #1890ff
}

.layout-map .node-container-nodeInfo:hover {
    background-color: #f5f5f5
}

.layout-map .condee-tree {
    color: rgba(0, 0, 0, 0.65);
    font-size: 14px
}

.layout-map .condee-tree * {
    box-sizing: border-box
}

.layout-map .tree-menu-item {
    cursor: pointer;
    transition: all .2s ease;
    padding: 6px 8px 6px 8px
}

.layout-map .tree-menu-item:hover {
    background-color: #f5f5f5
}

.layout-map .tree-menu-panel {
    background: #fff;
    transition: opacity .2s ease;
    position: fixed;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.65);
    box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
    box-sizing: border-box;
    opacity: 0;
    z-index: -1
}

.layout-map .tree-menu-panel-show {
    z-index: 1000;
    opacity: 1
}

.layout-map .tree-menu-panel * {
    box-sizing: border-box
}

.layout-map .message-container .common-message-box {
    text-align: center;
    margin: 16px 0;
    transition: all .4s;
    opacity: 0
}

.layout-map .message-container .common-message {
    display: inline-block;
    padding: 10px 16px;
    background: #fff;
    border-radius: 2px;
    -webkit-box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
    box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
    pointer-events: all
}

.layout-map .message-container .common-message-content {
    line-height: 1.5;
    vertical-align: bottom
}

.layout-map .message-container .success {
    color: #52c41a;
    font-size: 20px !important;
    margin-right: 8px
}

.layout-map .message-container .error {
    color: #ff4d4f;
    font-size: 20px !important;
    margin-right: 8px
}

.layout-map .message-container .warn {
    color: #faad14;
    font-size: 20px !important;
    margin-right: 8px
}

.layout-map .message-container .info {
    color: #1890ff;
    font-size: 20px !important;
    margin-right: 8px
}

.layout-map .message-container {
    position: fixed;
    z-index: 999;
    top: 20px;
    width: 100%;
    transition: all .5s;
    left: 0
}

.layout-map .message-container .hide {
    opacity: 0
}

.layout-map .message-container .show {
    opacity: 1
}

.layout-map .select, .layout-map select {
    position: relative;
    background-color: #fff;
    border: 1px solid #d9d9d9;
    border-radius: 2px;
    -webkit-transition: all .3s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: all .3s cubic-bezier(0.645, 0.045, 0.355, 1);
    max-width: 200px;
    height: 32px;
    padding: 0 11px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    line-height: 32px
}

.layout-map .select .title, .layout-map select .title {
    max-width: 200px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.layout-map .select_error {
    border: 1px solid #f00
}

.layout-map .select:hover {
    border-color: #1890ff;
    border-right-width: 1px !important
}

.layout-map .select:action {
    border-color: #1890ff;
    border-right-width: 1px !important
}

.layout-map .option {
    position: absolute;
    background: #fff;
    top: 35px;
    left: 0;
    width: 100%;
    padding: 2px 0;
    box-shadow: 0 1px 5px #ccc;
    z-index: 100
}

.layout-map .option > div {
    padding: 0 11px
}

.layout-map .option > div:hover {
    background: #f1f1f1
}

.layout-map .icon {
    position: absolute;
    line-height: 32px;
    right: 11px;
    transition: all .5s
}

.layout-map .icon-back {
    transform: rotate(180deg)
}

.layout-map .err_select_msg {
    font-size: 12px;
    color: #f00;
    display: none
}

.layout-map .map-popup {
    position: absolute;
    background-color: white;
    -webkit-filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
    filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
    padding: 15px;
    border-radius: 10px;
    border: 1px solid #ccc;
    bottom: 12px;
    left: -50px;
    min-width: 120px
}

.layout-map .map-popup:after, .layout-map .map-popup:before {
    top: 100%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none
}

.layout-map .map-popup:after {
    border-top-color: white;
    border-width: 10px;
    left: 48px;
    margin-left: -10px
}

.layout-map .map-popup:before {
    border-top-color: #ccc;
    border-width: 11px;
    left: 48px;
    margin-left: -11px
}

.layout-map-popup {
    position: absolute;
    background-color: white;
    -webkit-filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
    filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
    padding: 15px;
    border-radius: 10px;
    border: 1px solid #ccc;
    bottom: 12px;
    left: -50px;
    min-width: 280px
}

.layout-map-popup:after, .layout-map-popup:before {
    top: 100%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none
}

.layout-map-popup:after {
    border-top-color: white;
    border-width: 10px;
    left: 48px;
    margin-left: -10px
}

.layout-map-popup:before {
    border-top-color: #ccc;
    border-width: 11px;
    left: 48px;
    margin-left: -11px
}

.layout-homepage {
    font-family: 'Helvetica Neue', Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    color: #333;
    height: 100%
}

.layout-homepage .template-list ul {
    display: flex;
    flex-wrap: wrap
}

.layout-homepage .template-container {
    width: 192px;
    height: 108px;
    margin: 10px;
    text-align: center
}

.layout-homepage .container-shadow {
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.1)
}

.layout-homepage .template-container .add {
    line-height: 108px;
    border: 1px solid #009688;
    font-size: 20px;
    color: #009688
}

.layout-homepage .template-container .add span.layout-icon-add {
    font-size: 20px
}

.layout-homepage .template-container .edit {
    border: 1px solid #ccc;
    font-size: 14px
}

.layout-homepage .template-container .edit .template-name {
    line-height: 108px;
    font-size: 14px;
    color: #333;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    padding: 0 8px;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.layout-homepage .template-container .edit .check-container {
    float: left;
    position: relative;
    top: -108px
}

.layout-homepage .template-container .edit .layui-form-checkbox {
    margin: 8px
}

.layout-homepage .template-container .edit .layui-icon-ok {
    width: 24px;
    height: 24px;
    font-size: 20px;
    line-height: 24px
}

.layout-homepage .template-container .edit span.layout-icon-operate {
    top: -110px;
    float: right;
    position: relative;
    margin: 8px;
    font-size: 24px
}

.layout-homepage .template-container .edit .operate-container {
    width: 80px;
    float: right;
    position: relative;
    top: -84px;
    right: -60px
}

.layout-homepage .template-container .edit span.layout-icon-up {
    color: #d1dee8
}

.layout-homepage .template-container .edit .operate-panel {
    position: relative;
    top: 10px;
    line-height: 28px;
    text-align: left;
    color: #606c88;
    background-color: #fff;
    border-radius: 2px;
    border: 1px solid #ddd;
    box-shadow: 0 1px 6px #ccc;
    box-sizing: border-box;
    z-index: 10
}

.layout-homepage .template-container .edit .operate-panel:before {
    position: absolute;
    left: 50%;
    margin-left: -8px;
    top: -16px;
    border: 8px solid transparent;
    border-bottom: 8px solid #ccc;
    content: "";
    width: 0;
    height: 0
}

.layout-homepage .template-container .edit .operate-panel:after {
    position: absolute;
    left: 50%;
    margin-left: -8px;
    top: -15px;
    border: 8px solid transparent;
    border-bottom: 8px solid #fff;
    content: "";
    width: 0;
    height: 0
}

.layout-homepage .template-container .edit .operate-panel dd:hover {
    background: #f5f5f5;
    color: #000
}

.layout-homepage .template-container .edit .operate-panel dd {
    padding-left: 20px
}

.layout-homepage .custom-toolbar {
    position: relative;
    height: 0
}

.layout-homepage .custom-toolbar button.custom {
    position: absolute;
    top: 0;
    right: 0;
    padding: 4px 6px;
    -webkit-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .25);
    -moz-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .25);
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .25);
    background-color: rgba(51, 51, 51, .8);
    line-height: 1;
    color: #fff;
    border: 0
}

.layout-homepage .gridster {
    width: 100%;
    margin-top: 20px;
    padding: 0 0 0 15px !important;
    opacity: 0
}

.layout-homepage .gridster > ul {
    position: relative;
    min-width: 100%;
    max-width: 100%;
    padding: 0
}

.layout-homepage .gridster > ul > li {
    background-color: #fff;
    margin-top: auto;
    margin-bottom: auto;
    min-height: auto;
    position: absolute;
    z-index: inherit;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1)
}

.layout-homepage .gridster > ul > li > * {
    width: 100%;
    height: 100%
}

.layout-homepage .gridster > ul > li .title {
    width: calc(100% - 20px);
    margin: 0 10px;
    height: 48px;
    line-height: 48px;
    color: #606c88;
    border-bottom: 1px solid #f0f2f5;
    font-weight: bold;
    display: flex;
    justify-content: space-between
}

.layout-homepage .gridster > ul > li .title > span {
    color: #307cff;
    font-weight: normal;
    cursor: pointer;
    user-select: none
}

.layout-homepage .gridster > ul > li .content {
    width: calc(100% - 20px);
    margin: 0 10px;
    height: calc(100% - 48px);
    overflow: auto;
    box-sizing: border-box
}

.layout-homepage ul.home-list {
    display: flex;
    flex-direction: column;
    justify-content: space-around
}

.layout-homepage ul.home-list > li {
    width: 100%;
    height: 38px
}

.layout-homepage ul.home-list > li > a {
    display: flex;
    justify-content: space-between;
    width: 100%;
    height: 38px;
    line-height: 38px;
    position: relative;
    padding-left: 20px
}

.layout-homepage ul.home-list > li > a > span {
    display: inline-block;
    width: calc(100% - 80px);
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.layout-homepage .template-toolbar {
    background: #393d49;
    height: 80px;
    line-height: 80px
}

.layout-homepage .template-toolbar button {
    margin-right: 10px
}

.layout-homepage .template-toolbar button.recover {
    padding: 0
}

.layout-homepage .template-toolbar .cancel {
    color: #fff;
    border-color: #fff;
    background-color: #393d49
}

.layout-homepage .template-toolbar .operate-tip {
    padding-left: 20px;
    color: #fff;
    font-size: 12px
}

.layout-homepage .template-toolbar .saveAsTemplate {
    color: #6d8acc;
    border-color: #6d8acc;
    background-color: #393d49;
    margin-left: 10px;
    margin-right: 20px
}

.layout-homepage .plate-list {
    background-color: #1e1e1e;
    height: 100%
}

.layout-homepage .plate-list .settings li {
    padding: 16px;
    height: 50px
}

.layout-homepage .plate-list .settings li, .layout-homepage .plate-list .plates li {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 16px;
    height: 40px;
    line-height: 40px;
    color: hsla(0, 0%, 100%, .85)
}

.layout-homepage .plate-list .settings li .layui-form-switch em {
    top: -1px
}

.layout-homepage .plate-list .settings li .layui-form-switch i {
    top: 2px
}

.layout-homepage .plate-list .plates li {
    color: hsla(0, 0%, 100%, .65);
    cursor: pointer
}

.layout-homepage .plate-list .plates li.selectable .font_family {
    color: #009688
}

.layout-homepage .template-toolbar .layui-form-select {
    height: 36px;
    width: 100%
}

.layout-homepage .template-toolbar .layui-form-select .layui-input {
    height: 36px;
    line-height: 36px;
    width: 180px
}

.layout-homepage .template-toolbar .layui-form-select dl {
    top: 36px;
    width: 180px
}

.ld-ball, .ld-ring, .ld-hourglass, .ld-loader, .ld-cross, .ld-square, .ld-pie, .ld-spinner {
    width: 1em;
    height: 1em;
    position: relative;
    color: inherit;
    display: inline-block;
    box-sizing: content-box
}

.ld-ball:after, .ld-ring:after, .ld-hourglass:after, .ld-loader:after, .ld-cross:after, .ld-square:after, .ld-pie:after, .ld-spinner:after {
    content: " ";
    display: block;
    width: 2em;
    height: 2em;
    box-sizing: border-box;
    transform-origin: 0 0;
    transform: translateZ(0) scale(0.5);
    backface-visibility: hidden
}

.ld-ring:after {
    border-radius: 50%;
    border: .3em solid currentColor;
    border-left-color: transparent
}

.ld-ball:after {
    border-radius: 50%;
    background: currentColor
}

.ld-hourglass:after {
    border-radius: 50%;
    border: 1em solid currentColor;
    border-left-color: transparent;
    border-right-color: transparent
}

.ld-cross:after {
    position: absolute;
    height: .5em;
    transform: translateZ(0) scale(0.5) translate(0, 0.75em);
    background: currentColor
}

.ld-cross:before {
    content: " ";
    display: block;
    width: .5em;
    height: 2em;
    box-sizing: border-box;
    transform-origin: 0 0;
    backface-visibility: hidden;
    position: absolute;
    width: .5em;
    transform: translateZ(0) scale(0.5) translate(0.75em, 0);
    background: currentColor
}

.ld-square:after {
    background: currentColor
}

.ld-pie:after {
    border-radius: 50%;
    border: 1em solid currentColor;
    border-left-color: transparent
}

.ld-spinner:after {
    position: absolute;
    width: .4em;
    height: .4em;
    transform: translateZ(0) scale(0.5) translate(0.8em, 0.8em);
    border-radius: 50%;
    background: 0;
    box-shadow: 0 1em 0 currentColor, 0 -1em 0 currentColor, 1em 0 0 currentColor, -1em 0 0 currentColor, .70710678em .70710678em 0 currentColor, -.70710678em .70710678em 0 currentColor, .70710678em -.70710678em 0 currentColor, -.70710678em -.70710678em 0 currentColor
}

.ld-loader {
    background-size: cover
}

.ld {
    transform-origin: 50% 50%;
    transform-box: fill-box
}

@keyframes ld-blink {
    0% {
        opacity: 1
    }
    49.75% {
        opacity: 1
    }
    50.25% {
        opacity: 0
    }
    99.5% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

.ld.ld-blink {
    animation: ld-blink 1s infinite linear
}

@keyframes ld-blur {
    0% {
        filter: blur(0)
    }
    50% {
        filter: blur(10%)
    }
    100% {
        filter: blur(0)
    }
}

.ld.ld-blur {
    animation: ld-blur 1s infinite linear
}

@keyframes ld-beat {
    0% {
        animation-timing-function: cubic-bezier(0.1028, 0.2484, 0.1372, 0.849);
        transform: scale(1)
    }
    34% {
        animation-timing-function: cubic-bezier(0.7116, 0.2095, 0.8159, 0.6876);
        transform: scale(1.2)
    }
    68% {
        animation-timing-function: cubic-bezier(0.1475, 0.2888, 0.294, 0.883);
        transform: scale(1.0268)
    }
    84% {
        animation-timing-function: cubic-bezier(0.8176, 0.2193, 0.867, 0.6889);
        transform: scale(1.0932)
    }
    100% {
        transform: scale(1)
    }
}

.ld.ld-beat {
    animation: ld-beat 1s infinite linear
}

@keyframes ld-bounceAlt {
    0% {
        animation-timing-function: cubic-bezier(0.1348, 0.3256, 0.2495, 0.8687);
        transform: translate(0, 0%)
    }
    51% {
        animation-timing-function: cubic-bezier(0.7426, 0.1782, 0.8523, 0.6514);
        transform: translate(0, -14%)
    }
    100% {
        transform: translate(0, 0%)
    }
}

.ld.ld-bounceAlt {
    animation: ld-bounceAlt 1s infinite linear
}

@keyframes ld-tick-alt {
    0% {
        animation-timing-function: cubic-bezier(0.0637, 0.1569, -0.0154, 0.8727);
        transform: rotate(0deg)
    }
    22% {
        animation-timing-function: cubic-bezier(0.7634, 0.2713, 0.7818, 0.6832);
        transform: rotate(-44.865deg)
    }
    43% {
        animation-timing-function: cubic-bezier(0.0599, 0.1266, 0.2372, 1.029);
        transform: rotate(-7.515000000000001deg)
    }
    56% {
        animation-timing-function: cubic-bezier(0.6353, 0.3049, 0.6792, 0.6671);
        transform: rotate(-25.290000000000003deg)
    }
    68% {
        animation-timing-function: cubic-bezier(0.0513, 0.1148, 0.3085, 1.1548);
        transform: rotate(-5.13deg)
    }
    76% {
        animation-timing-function: cubic-bezier(0.467, 0.2881, 0.3593, 0.7819);
        transform: rotate(-14.175deg)
    }
    83% {
        animation-timing-function: cubic-bezier(0.0632, 0.1615, 0.3539, 1.4565);
        transform: rotate(-3.6deg)
    }
    88% {
        animation-timing-function: cubic-bezier(0.3563, 0.3125, 0.5387, 1.6475);
        transform: rotate(-7.74deg)
    }
    92% {
        animation-timing-function: cubic-bezier(0.1265, 0.4155, 0.3821, 1.8827);
        transform: rotate(-2.6100000000000003deg)
    }
    95% {
        animation-timing-function: cubic-bezier(0.5727, 1.3521, 0.0229, 3.0356);
        transform: rotate(-4.185deg)
    }
    98% {
        animation-timing-function: cubic-bezier(0.4531, -1.3593, 0.757, 0.0281);
        transform: rotate(-2.565deg)
    }
    100% {
        transform: rotate(0deg)
    }
}

.ld.ld-tick-alt {
    animation: ld-tick-alt 1s infinite linear
}

@keyframes ld-jump {
    0% {
        animation-timing-function: cubic-bezier(0.0637, 0.1569, -0.0154, 0.8727);
        transform: translate(0, 0%)
    }
    22% {
        animation-timing-function: cubic-bezier(0.7634, 0.2713, 0.7818, 0.6832);
        transform: translate(0, -13.958%)
    }
    43% {
        animation-timing-function: cubic-bezier(0.0599, 0.1266, 0.2372, 1.029);
        transform: translate(0, -2.338%)
    }
    56% {
        animation-timing-function: cubic-bezier(0.6353, 0.3049, 0.6792, 0.6671);
        transform: translate(0, -7.868%)
    }
    68% {
        animation-timing-function: cubic-bezier(0.0513, 0.1148, 0.3085, 1.1548);
        transform: translate(0, -1.596%)
    }
    76% {
        animation-timing-function: cubic-bezier(0.467, 0.2881, 0.3593, 0.7819);
        transform: translate(0, -4.41%)
    }
    83% {
        animation-timing-function: cubic-bezier(0.0632, 0.1615, 0.3539, 1.4565);
        transform: translate(0, -1.12%)
    }
    88% {
        animation-timing-function: cubic-bezier(0.3563, 0.3125, 0.5387, 1.6475);
        transform: translate(0, -2.4080000000000004%)
    }
    92% {
        animation-timing-function: cubic-bezier(0.1265, 0.4155, 0.3821, 1.8827);
        transform: translate(0, -0.812%)
    }
    95% {
        animation-timing-function: cubic-bezier(0.5727, 1.3521, 0.0229, 3.0356);
        transform: translate(0, -1.302%)
    }
    98% {
        animation-timing-function: cubic-bezier(0.4531, -1.3593, 0.757, 0.0281);
        transform: translate(0, -0.798%)
    }
    100% {
        transform: translate(0, 0%)
    }
}

.ld.ld-jump {
    animation: ld-jump 1s infinite linear
}

@keyframes ld-bounce {
    0% {
        animation-timing-function: cubic-bezier(0.138, 0.2541, 0.2177, 0.8747);
        transform: translate(0, 0%) scaleY(1)
    }
    37% {
        animation-timing-function: cubic-bezier(0.7679, 0.1817, 0.8401, 0.7167);
        transform: translate(0, -39.96%) scaleY(1)
    }
    72.2% {
        animation-timing-function: cubic-bezier(0.1045, 0.2026, 0.2224, 0.9608);
        transform: translate(0, 0%) scaleY(1)
    }
    87.2% {
        animation-timing-function: cubic-bezier(0.7463, 0.2314, 0.8159, 0.6941);
        transform: translate(0, 19.85%) scaleY(0.603)
    }
    100% {
        transform: translate(0, 0%) scaleY(1)
    }
}

.ld.ld-bounce {
    animation: ld-bounce 1s infinite linear
}

@keyframes ld-clock {
    0% {
        animation-timing-function: cubic-bezier(0, 0.7, 0.30000000000000004, 1);
        transform: rotate(0deg)
    }
    8.33333% {
        animation-timing-function: cubic-bezier(0, 0.7, 0.30000000000000004, 1);
        transform: rotate(30deg)
    }
    16.66667% {
        animation-timing-function: cubic-bezier(0, 0.7, 0.30000000000000004, 1);
        transform: rotate(60deg)
    }
    25% {
        animation-timing-function: cubic-bezier(0, 0.7, 0.30000000000000004, 1);
        transform: rotate(90deg)
    }
    33.33333% {
        animation-timing-function: cubic-bezier(0, 0.7, 0.30000000000000004, 1);
        transform: rotate(120deg)
    }
    41.66667% {
        animation-timing-function: cubic-bezier(0, 0.7, 0.30000000000000004, 1);
        transform: rotate(150deg)
    }
    50% {
        animation-timing-function: cubic-bezier(0, 0.7, 0.30000000000000004, 1);
        transform: rotate(180deg)
    }
    58.33333% {
        animation-timing-function: cubic-bezier(0, 0.7, 0.30000000000000004, 1);
        transform: rotate(210deg)
    }
    66.66667% {
        animation-timing-function: cubic-bezier(0, 0.7, 0.30000000000000004, 1);
        transform: rotate(240deg)
    }
    75% {
        animation-timing-function: cubic-bezier(0, 0.7, 0.30000000000000004, 1);
        transform: rotate(270deg)
    }
    83.33333% {
        animation-timing-function: cubic-bezier(0, 0.7, 0.30000000000000004, 1);
        transform: rotate(300deg)
    }
    91.66667% {
        animation-timing-function: cubic-bezier(0, 0.7, 0.30000000000000004, 1);
        transform: rotate(330deg)
    }
    100% {
        animation-timing-function: cubic-bezier(0, 0.7, 0.30000000000000004, 1);
        transform: rotate(360deg)
    }
}

.ld.ld-clock {
    animation: ld-clock 12s infinite linear
}

@keyframes ld-fade {
    0% {
        animation-timing-function: cubic-bezier(0.2057, 0.573, 0.3723, 0.9184);
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

.ld.ld-fade {
    animation: ld-fade 1s infinite linear
}

@keyframes ld-flip {
    0%, 25%, 50%, 75%, 100% {
        animation-timing-function: cubic-bezier(0, 0.4, 0.6, 1)
    }
    0% {
        transform: scale(1, 1)
    }
    25% {
        transform: scale(-1, 1)
    }
    50% {
        transform: scale(-1, -1)
    }
    75% {
        transform: scale(1, -1)
    }
    100% {
        transform: scale(1, 1)
    }
}

.ld.ld-flip {
    animation: ld-flip 1s infinite linear
}

@keyframes ld-float {
    0% {
        animation-timing-function: cubic-bezier(0, 0.4, 0.6, 1);
        transform: translate(0, 0) scale(0.7);
        box-shadow: 0 0 0 rgba(0, 0, 0, .3)
    }
    50% {
        animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
        transform: translate(0, -15%) scale(1);
        box-shadow: 0 23% 5% -15% rgba(0, 0, 0, .2)
    }
    100% {
        transform: translate(0, 0) scale(0.7);
        box-shadow: 0 0 0 rgba(0, 0, 0, .3)
    }
}

.ld.ld-float {
    animation: ld-float 1s infinite linear
}

@keyframes ld-heartbeat {
    0% {
        animation-timing-function: cubic-bezier(0.1678, 0.6042, 0.5465, 3.0859);
        transform: scale(1.3)
    }
    30% {
        animation-timing-function: cubic-bezier(0.3206, 0.3435, 0.6825, 0.6598);
        transform: scale(1.15)
    }
    31% {
        animation-timing-function: cubic-bezier(0.2811, 0.5061, 0.5347, 0.909);
        transform: scale(1.1458)
    }
    100% {
        transform: scale(1)
    }
}

.ld.ld-heartbeat {
    animation: ld-heartbeat 1s infinite linear
}

@keyframes ld-hit {
    0% {
        animation-timing-function: cubic-bezier(0.5, 0, 1, 0.5);
        transform: scale(0) translate(0, 0) skewX(0);
        opacity: 1
    }
    20% {
        transform: scale(1) translate(0, 0) skewX(20deg)
    }
    50% {
        animation-timing-function: cubic-bezier(0.6, 0, 1, 0.4);
        transform: scale(1) translate(0, 0) skewX(20deg)
    }
    50% {
        opacity: 1
    }
    100% {
        transform: scale(1) translate(0, 200%) skewX(20deg);
        opacity: 0
    }
}

.ld.ld-hit {
    animation: ld-hit 2s infinite linear
}

@keyframes ld-move-ltr {
    0% {
        transform: translate(0%, 0%)
    }
    40% {
        transform: translate(80%, 0%)
    }
    49.99999% {
        transform: translate(99.99998%, 0%)
    }
    50% {
        transform: translate(-100%, 0%)
    }
    50.00001% {
        transform: translate(-99.99998%, 0%)
    }
    60% {
        transform: translate(-80%, 0%)
    }
    100% {
        transform: translate(0%, 0%)
    }
}

.ld.ld-move-ltr {
    animation: ld-move-ltr 1s infinite linear
}

@keyframes ld-move-rtl {
    0% {
        transform: translate(0%, 0%)
    }
    40% {
        transform: translate(-80%, 0%)
    }
    49.99999% {
        transform: translate(-99.99998%, 0%)
    }
    50% {
        transform: translate(100%, 0%)
    }
    50.00001% {
        transform: translate(99.99998%, 0%)
    }
    60% {
        transform: translate(80%, 0%)
    }
    100% {
        transform: translate(0%, 0%)
    }
}

.ld.ld-move-rtl {
    animation: ld-move-rtl 1s infinite linear
}

@keyframes ld-move-ttb {
    0% {
        transform: translate(0%, 0%)
    }
    40% {
        transform: translate(0%, 80%)
    }
    49.99999% {
        transform: translate(0%, 99.99998%)
    }
    50% {
        transform: translate(0%, -100%)
    }
    50.00001% {
        transform: translate(0%, -99.99998%)
    }
    60% {
        transform: translate(0%, -80%)
    }
    100% {
        transform: translate(0%, 0%)
    }
}

.ld.ld-move-ttb {
    animation: ld-move-ttb 1s infinite linear
}

@keyframes ld-move-btt {
    0% {
        transform: translate(0%, 0%)
    }
    40% {
        transform: translate(0%, -80%)
    }
    49.99999% {
        transform: translate(0%, -99.99998%)
    }
    50% {
        transform: translate(0%, 100%)
    }
    50.00001% {
        transform: translate(0%, 99.99998%)
    }
    60% {
        transform: translate(0%, 80%)
    }
    100% {
        transform: translate(0%, 0%)
    }
}

.ld.ld-move-btt {
    animation: ld-move-btt 1s infinite linear
}

@keyframes ld-move-fade-ltr {
    0% {
        transform: translate(0%, 0%);
        opacity: 1
    }
    40% {
        transform: translate(80%, 0%);
        opacity: 1
    }
    49.99999% {
        transform: translate(99.99998%, 0%);
        opacity: 0
    }
    50% {
        transform: translate(-100%, 0%);
        opacity: 0
    }
    50.00001% {
        transform: translate(-99.99998%, 0%);
        opacity: 0
    }
    60% {
        transform: translate(-80%, 0%);
        opacity: 1
    }
    100% {
        transform: translate(0%, 0%);
        opacity: 1
    }
}

.ld.ld-move-fade-ltr {
    animation: ld-move-fade-ltr 1s infinite linear
}

@keyframes ld-move-fade-rtl {
    0% {
        transform: translate(0%, 0%);
        opacity: 1
    }
    40% {
        transform: translate(-80%, 0%);
        opacity: 1
    }
    49.99999% {
        transform: translate(-99.99998%, 0%);
        opacity: 0
    }
    50% {
        transform: translate(100%, 0%);
        opacity: 0
    }
    50.00001% {
        transform: translate(99.99998%, 0%);
        opacity: 0
    }
    60% {
        transform: translate(80%, 0%);
        opacity: 1
    }
    100% {
        transform: translate(0%, 0%);
        opacity: 1
    }
}

.ld.ld-move-fade-rtl {
    animation: ld-move-fade-rtl 1s infinite linear
}

@keyframes ld-move-fade-ttb {
    0% {
        transform: translate(0%, 0%);
        opacity: 1
    }
    40% {
        transform: translate(0%, 80%);
        opacity: 1
    }
    49.99999% {
        transform: translate(0%, 99.99998%);
        opacity: 0
    }
    50% {
        transform: translate(0%, -100%);
        opacity: 0
    }
    50.00001% {
        transform: translate(0%, -99.99998%);
        opacity: 0
    }
    60% {
        transform: translate(0%, -80%);
        opacity: 1
    }
    100% {
        transform: translate(0%, 0%);
        opacity: 1
    }
}

.ld.ld-move-fade-ttb {
    animation: ld-move-fade-ttb 1s infinite linear
}

@keyframes ld-move-fade-btt {
    0% {
        transform: translate(0%, 0%);
        opacity: 1
    }
    40% {
        transform: translate(0%, -80%);
        opacity: 1
    }
    49.99999% {
        transform: translate(0%, -99.99998%);
        opacity: 0
    }
    50% {
        transform: translate(0%, 100%);
        opacity: 0
    }
    50.00001% {
        transform: translate(0%, 99.99998%);
        opacity: 0
    }
    60% {
        transform: translate(0%, 80%);
        opacity: 1
    }
    100% {
        transform: translate(0%, 0%);
        opacity: 1
    }
}

.ld.ld-move-fade-btt {
    animation: ld-move-fade-btt 1s infinite linear
}

@keyframes ld-orbit {
    0% {
        animation-timing-function: linear;
        transform: translate(0%, -60%) rotate(0deg)
    }
    8.33333% {
        animation-timing-function: linear;
        transform: translate(30%, -51.96152%) rotate(30deg)
    }
    16.66667% {
        animation-timing-function: linear;
        transform: translate(51.96152%, -30%) rotate(60deg)
    }
    25% {
        animation-timing-function: linear;
        transform: translate(60%, 0%) rotate(90deg)
    }
    33.33333% {
        animation-timing-function: linear;
        transform: translate(51.96152%, 30%) rotate(120deg)
    }
    41.66667% {
        animation-timing-function: linear;
        transform: translate(30%, 51.96152%) rotate(150deg)
    }
    50% {
        animation-timing-function: linear;
        transform: translate(0%, 60%) rotate(180deg)
    }
    58.33333% {
        animation-timing-function: linear;
        transform: translate(-30%, 51.96152%) rotate(210deg)
    }
    66.66667% {
        animation-timing-function: linear;
        transform: translate(-51.96152%, 30%) rotate(240deg)
    }
    75% {
        animation-timing-function: linear;
        transform: translate(-60%, 0%) rotate(270deg)
    }
    83.33333% {
        animation-timing-function: linear;
        transform: translate(-51.96152%, -30%) rotate(300deg)
    }
    91.66667% {
        animation-timing-function: linear;
        transform: translate(-30%, -51.96152%) rotate(330deg)
    }
    100% {
        animation-timing-function: linear;
        transform: translate(0%, -60%) rotate(360deg)
    }
}

.ld.ld-orbit {
    animation: ld-orbit 1s infinite linear
}

@keyframes ld-breath {
    0% {
        animation-timing-function: cubic-bezier(0.9647, 0.2413, -0.0705, 0.7911);
        transform: scale(0.9099999999999999)
    }
    51% {
        animation-timing-function: cubic-bezier(0.9226, 0.2631, -0.0308, 0.7628);
        transform: scale(1.02994)
    }
    100% {
        transform: scale(0.9099999999999999)
    }
}

.ld.ld-breath {
    animation: ld-breath 1s infinite linear
}

@keyframes ld-dim {
    0% {
        animation-timing-function: cubic-bezier(0.9647, 0.2413, -0.0705, 0.7911);
        opacity: 0
    }
    51% {
        animation-timing-function: cubic-bezier(0.9226, 0.2631, -0.0308, 0.7628);
        opacity: .9995
    }
    100% {
        opacity: 0
    }
}

.ld.ld-dim {
    animation: ld-dim 1s infinite linear
}

@keyframes ld-metronome {
    0% {
        animation-timing-function: cubic-bezier(0.7806, 0.0715, 0.8998, 0.731);
        transform: translate(-10%) rotate(-20deg)
    }
    17.5% {
        animation-timing-function: cubic-bezier(0.484, 0.3308, 0.6853, 0.6667);
        transform: translate(-6.18%) rotate(-12.36deg)
    }
    27.6% {
        animation-timing-function: cubic-bezier(0.0676, 0.1836, 0.0518, 0.9433);
        transform: translate(2.48%) rotate(4.96deg)
    }
    50.1% {
        animation-timing-function: cubic-bezier(0.7773, 0.0708, 0.9008, 0.735);
        transform: translate(10%) rotate(20deg)
    }
    67.6% {
        animation-timing-function: cubic-bezier(0.4888, 0.331, 0.6153, 0.6674);
        transform: translate(6.16%) rotate(12.32deg)
    }
    80% {
        animation-timing-function: cubic-bezier(0.0801, 0.2206, 0.1357, 0.9363);
        transform: translate(-4.57%) rotate(-9.14deg)
    }
    100% {
        transform: translate(-10%) rotate(-20deg)
    }
}

.ld.ld-metronome {
    animation: ld-metronome 1s infinite linear
}

@keyframes ld-swing {
    0% {
        animation-timing-function: cubic-bezier(0.9647, 0.2413, -0.0705, 0.7911);
        transform: rotate(-30deg)
    }
    51% {
        animation-timing-function: cubic-bezier(0.9226, 0.2631, -0.0308, 0.7628);
        transform: rotate(29.97deg)
    }
    100% {
        transform: rotate(-30deg)
    }
}

.ld.ld-swing {
    animation: ld-swing 1s infinite linear
}

@keyframes ld-wander-v {
    0% {
        animation-timing-function: cubic-bezier(0.9647, 0.2413, -0.0705, 0.7911);
        transform: translate(0, -10%)
    }
    51% {
        animation-timing-function: cubic-bezier(0.9226, 0.2631, -0.0308, 0.7628);
        transform: translate(0, 9.99%)
    }
    100% {
        transform: translate(0, -10%)
    }
}

.ld.ld-wander-v {
    animation: ld-wander-v 1s infinite linear
}

@keyframes ld-wander-h {
    0% {
        animation-timing-function: cubic-bezier(0.9647, 0.2413, -0.0705, 0.7911);
        transform: translate(-10%, 0)
    }
    51% {
        animation-timing-function: cubic-bezier(0.9226, 0.2631, -0.0308, 0.7628);
        transform: translate(9.99%, 0)
    }
    100% {
        transform: translate(-10%, 0)
    }
}

.ld.ld-wander-h, .ld.ld-wander {
    animation: ld-wander-h 1s infinite linear
}

@keyframes ld-pulse {
    0% {
        animation-timing-function: cubic-bezier(0.3333, 0.3333, 0.3124, 0.6668);
        transform: scale(0.85)
    }
    0.5% {
        animation-timing-function: cubic-bezier(0.0233, -0.3865, 0.6667, 0.6667);
        transform: scale(1.141)
    }
    1.5% {
        animation-timing-function: cubic-bezier(0.2893, 0.354, 0.6158, 0.6958);
        transform: scale(1.124)
    }
    11% {
        animation-timing-function: cubic-bezier(0.2861, 0.4196, 0.6215, 0.7476);
        transform: scale(0.992)
    }
    25% {
        animation-timing-function: cubic-bezier(0.0793, 0.2627, 0.9972, 1.5511);
        transform: scale(0.887)
    }
    49.5% {
        animation-timing-function: cubic-bezier(0.6664, 0.3332, 0.6667, 0.6667);
        transform: scale(0.85)
    }
    50% {
        animation-timing-function: cubic-bezier(0, 0.3522, 1, 0.6686);
        transform: scale(1.1500000000000001)
    }
    51% {
        animation-timing-function: cubic-bezier(0.2668, 0.4036, 0.554, 0.7657);
        transform: scale(1.1320000000000001)
    }
    73.5% {
        animation-timing-function: cubic-bezier(0.2997, 1.0028, 0.6671, 1);
        transform: scale(0.894)
    }
    100% {
        transform: scale(0.85)
    }
}

.ld.ld-pulse {
    animation: ld-pulse 1s infinite linear
}

@keyframes ld-jingle {
    0% {
        animation-timing-function: cubic-bezier(0.146, 0.2111, 0.5902, 1.3204);
        transform: rotate(0deg)
    }
    11% {
        animation-timing-function: cubic-bezier(0.1079, 0.1992, -0.6462, 0.828);
        transform: rotate(7.61deg)
    }
    23% {
        animation-timing-function: cubic-bezier(0.0504, 0.0951, 0.0163, 0.9677);
        transform: rotate(-5.789999999999999deg)
    }
    36% {
        animation-timing-function: cubic-bezier(0.0475, 0.0921, 0.3134, 1.0455);
        transform: rotate(3.35deg)
    }
    49% {
        animation-timing-function: cubic-bezier(0.0789, 0.1565, 0.3413, 1.0972);
        transform: rotate(-1.9300000000000002deg)
    }
    62% {
        animation-timing-function: cubic-bezier(0.141, 0.2885, 0.406, 1.1519);
        transform: rotate(1.12deg)
    }
    75% {
        animation-timing-function: cubic-bezier(0.226, 0.4698, 0.5031, 1.1722);
        transform: rotate(-0.64deg)
    }
    88% {
        animation-timing-function: cubic-bezier(0.3121, 0.5521, 0.5655, 0.8997);
        transform: rotate(0.37deg)
    }
    100% {
        transform: rotate(-0.28deg)
    }
}

.ld.ld-jingle {
    animation: ld-jingle 1s infinite linear;
    transform-origin: 50% 0
}

@keyframes ld-rubber-v {
    0% {
        animation-timing-function: cubic-bezier(0.1858, 0.2841, 0.5834, 1.4615);
        transform: scaleY(1)
    }
    31% {
        animation-timing-function: cubic-bezier(0.0467, 0.1102, 0.4803, 1.4719);
        transform: scaleY(1.1354)
    }
    41% {
        animation-timing-function: cubic-bezier(0.0469, 0.1108, 0.4775, 1.4732);
        transform: scaleY(0.9052)
    }
    51% {
        animation-timing-function: cubic-bezier(0.0478, 0.1131, 0.4723, 1.4819);
        transform: scaleY(1.0664)
    }
    61% {
        animation-timing-function: cubic-bezier(0.0506, 0.1192, 0.4639, 1.4818);
        transform: scaleY(0.9536)
    }
    71% {
        animation-timing-function: cubic-bezier(0.0581, 0.1374, 0.457, 1.4901);
        transform: scaleY(1.0326)
    }
    81% {
        animation-timing-function: cubic-bezier(0.0765, 0.1813, 0.4542, 1.4923);
        transform: scaleY(0.9772)
    }
    91% {
        animation-timing-function: cubic-bezier(0.1747, 0.3181, 0.341, 0.878);
        transform: scaleY(1.016)
    }
    100% {
        transform: scaleY(0.9836)
    }
}

.ld.ld-rubber-v {
    animation: ld-rubber-v 1s infinite linear
}

@keyframes ld-rubber-h {
    0% {
        animation-timing-function: cubic-bezier(0.1858, 0.2841, 0.5834, 1.4615);
        transform: scaleX(1)
    }
    31% {
        animation-timing-function: cubic-bezier(0.0467, 0.1102, 0.4803, 1.4719);
        transform: scaleX(1.1354)
    }
    41% {
        animation-timing-function: cubic-bezier(0.0469, 0.1108, 0.4775, 1.4732);
        transform: scaleX(0.9052)
    }
    51% {
        animation-timing-function: cubic-bezier(0.0478, 0.1131, 0.4723, 1.4819);
        transform: scaleX(1.0664)
    }
    61% {
        animation-timing-function: cubic-bezier(0.0506, 0.1192, 0.4639, 1.4818);
        transform: scaleX(0.9536)
    }
    71% {
        animation-timing-function: cubic-bezier(0.0581, 0.1374, 0.457, 1.4901);
        transform: scaleX(1.0326)
    }
    81% {
        animation-timing-function: cubic-bezier(0.0765, 0.1813, 0.4542, 1.4923);
        transform: scaleX(0.9772)
    }
    91% {
        animation-timing-function: cubic-bezier(0.1747, 0.3181, 0.341, 0.878);
        transform: scaleX(1.016)
    }
    100% {
        transform: scaleX(0.9836)
    }
}

.ld.ld-rubber-h, .ld.ld-rubber {
    animation: ld-rubber-h 1s infinite linear
}

@keyframes ld-shake-v {
    0% {
        animation-timing-function: cubic-bezier(0.1441, 0.1912, 0.6583, 1.1029);
        transform: translate(0, 0%)
    }
    31% {
        animation-timing-function: cubic-bezier(0.0667, 0.1419, 0.6667, 1.1415);
        transform: translate(0, 7.800000000000001%)
    }
    45% {
        animation-timing-function: cubic-bezier(0.0542, 0.1151, 0.5697, 1.181);
        transform: translate(0, -4.680000000000001%)
    }
    59% {
        animation-timing-function: cubic-bezier(0.0497, 0.1058, 0.4541, 1.231);
        transform: translate(0, 2.8100000000000005%)
    }
    73% {
        animation-timing-function: cubic-bezier(0.0808, 0.1711, 0.4109, 1.2519);
        transform: translate(0, -1.6800000000000002%)
    }
    87% {
        animation-timing-function: cubic-bezier(0.2073, 0.3705, 0.4064, 0.8839);
        transform: translate(0, 1.01%)
    }
    100% {
        transform: translate(0, -0.78%)
    }
}

.ld.ld-shake-v {
    animation: ld-shake-v 1s infinite linear
}

@keyframes ld-shake-h {
    0% {
        animation-timing-function: cubic-bezier(0.1515, 0.2047, 0.6562, 1.1369);
        transform: translate(0%, 0)
    }
    31% {
        animation-timing-function: cubic-bezier(0.0628, 0.1361, 0.6012, 1.2083);
        transform: translate(7.66%, 0)
    }
    45% {
        animation-timing-function: cubic-bezier(0.0579, 0.1251, 0.5661, 1.2263);
        transform: translate(-5.36%, 0)
    }
    59% {
        animation-timing-function: cubic-bezier(0.0523, 0.113, 0.5181, 1.2493);
        transform: translate(3.75%, 0)
    }
    73% {
        animation-timing-function: cubic-bezier(0.0513, 0.1113, 0.4632, 1.2762);
        transform: translate(-2.63%, 0)
    }
    87% {
        animation-timing-function: cubic-bezier(0.1502, 0.2709, 0.2303, 0.8469);
        transform: translate(1.8399999999999999%, 0)
    }
    100% {
        transform: translate(-1.6800000000000002%, 0)
    }
}

.ld.ld-shake-h, .ld.ld-shake {
    animation: ld-shake-h 1s infinite linear
}

@keyframes ld-tick {
    0% {
        animation-timing-function: cubic-bezier(0.1858, 0.2841, 0.5834, 1.4615);
        transform: rotate(0deg)
    }
    31% {
        animation-timing-function: cubic-bezier(0.0467, 0.1102, 0.4803, 1.4719);
        transform: rotate(13.540000000000001deg)
    }
    41% {
        animation-timing-function: cubic-bezier(0.0469, 0.1108, 0.4775, 1.4732);
        transform: rotate(-9.48deg)
    }
    51% {
        animation-timing-function: cubic-bezier(0.0478, 0.1131, 0.4723, 1.4819);
        transform: rotate(6.640000000000001deg)
    }
    61% {
        animation-timing-function: cubic-bezier(0.0506, 0.1192, 0.4639, 1.4818);
        transform: rotate(-4.640000000000001deg)
    }
    71% {
        animation-timing-function: cubic-bezier(0.0581, 0.1374, 0.457, 1.4901);
        transform: rotate(3.2600000000000002deg)
    }
    81% {
        animation-timing-function: cubic-bezier(0.0765, 0.1813, 0.4542, 1.4923);
        transform: rotate(-2.2800000000000002deg)
    }
    91% {
        animation-timing-function: cubic-bezier(0.1747, 0.3181, 0.341, 0.878);
        transform: rotate(1.6deg)
    }
    100% {
        transform: rotate(-1.6400000000000001deg)
    }
}

.ld.ld-tick {
    animation: ld-tick 1s infinite linear
}

@keyframes ld-smash {
    0% {
        animation-timing-function: cubic-bezier(0.3385, 0.332, 0.6667, 0.6667);
        transform: rotate(0deg)
    }
    40.8% {
        animation-timing-function: cubic-bezier(0.3316, 0.3338, 0.5714, 1.3045);
        transform: rotate(24.48deg)
    }
    48.5% {
        animation-timing-function: cubic-bezier(0.9673, 0.2776, 0.6667, 0.6667);
        transform: rotate(29.07deg)
    }
    51% {
        animation-timing-function: cubic-bezier(0.1933, 0.2947, -0.0572, 0.7191);
        transform: rotate(25.38deg)
    }
    60.8% {
        animation-timing-function: cubic-bezier(0.0583, 2.8507, 0.8558, 1);
        transform: rotate(0.54deg)
    }
    100% {
        transform: rotate(0deg)
    }
}

.ld.ld-smash {
    animation: ld-smash 1s infinite linear
}

@keyframes ld-jelly-alt {
    0% {
        animation-timing-function: cubic-bezier(0.1858, 0.2841, 0.5834, 1.4615);
        transform: skewX(0deg)
    }
    31% {
        animation-timing-function: cubic-bezier(0.0467, 0.1102, 0.4803, 1.4719);
        transform: skewX(6.7700000000000005deg)
    }
    41% {
        animation-timing-function: cubic-bezier(0.0469, 0.1108, 0.4775, 1.4732);
        transform: skewX(-4.74deg)
    }
    51% {
        animation-timing-function: cubic-bezier(0.0478, 0.1131, 0.4723, 1.4819);
        transform: skewX(3.3200000000000003deg)
    }
    61% {
        animation-timing-function: cubic-bezier(0.0506, 0.1192, 0.4639, 1.4818);
        transform: skewX(-2.3200000000000003deg)
    }
    71% {
        animation-timing-function: cubic-bezier(0.0581, 0.1374, 0.457, 1.4901);
        transform: skewX(1.6300000000000001deg)
    }
    81% {
        animation-timing-function: cubic-bezier(0.0765, 0.1813, 0.4542, 1.4923);
        transform: skewX(-1.1400000000000001deg)
    }
    91% {
        animation-timing-function: cubic-bezier(0.1747, 0.3181, 0.341, 0.878);
        transform: skewX(0.8deg)
    }
    100% {
        transform: skewX(-0.8200000000000001deg)
    }
}

.ld.ld-jelly-alt {
    animation: ld-jelly-alt 1s infinite linear
}

@keyframes ld-jelly {
    0% {
        animation-timing-function: cubic-bezier(0.1441, 0.1912, 0.6583, 1.1029);
        transform: translate(0%, 0) skewX(0deg)
    }
    31% {
        animation-timing-function: cubic-bezier(0.0667, 0.1419, 0.6667, 1.1415);
        transform: translate(-7.800000000000001%, 0) skewX(7.800000000000001deg)
    }
    45% {
        animation-timing-function: cubic-bezier(0.0542, 0.1151, 0.5697, 1.181);
        transform: translate(4.680000000000001%, 0) skewX(-4.680000000000001deg)
    }
    59% {
        animation-timing-function: cubic-bezier(0.0497, 0.1058, 0.4541, 1.231);
        transform: translate(-2.8100000000000005%, 0) skewX(2.8100000000000005deg)
    }
    73% {
        animation-timing-function: cubic-bezier(0.0808, 0.1711, 0.4109, 1.2519);
        transform: translate(1.6800000000000002%, 0) skewX(-1.6800000000000002deg)
    }
    87% {
        animation-timing-function: cubic-bezier(0.2073, 0.3705, 0.4064, 0.8839);
        transform: translate(-1.01%, 0) skewX(1.01deg)
    }
    100% {
        transform: translate(0.78%, 0) skewX(-0.78deg)
    }
}

.ld.ld-jelly {
    animation: ld-jelly 1s infinite linear
}

@keyframes ld-damage {
    0% {
        animation-timing-function: cubic-bezier(0.1916, 0.3481, 0.5313, 2.0622);
        opacity: 1
    }
    21% {
        animation-timing-function: cubic-bezier(0.0461, 0.1237, 0.4559, 1.8579);
        opacity: .42200000000000004
    }
    29% {
        animation-timing-function: cubic-bezier(0.0468, 0.1254, 0.4564, 1.8559);
        opacity: 1.462
    }
    37% {
        animation-timing-function: cubic-bezier(0.0479, 0.1283, 0.457, 1.856);
        opacity: .63
    }
    45% {
        animation-timing-function: cubic-bezier(0.0487, 0.1306, 0.457, 1.8506);
        opacity: 1.296
    }
    53% {
        animation-timing-function: cubic-bezier(0.0515, 0.1383, 0.4591, 1.8571);
        opacity: .763
    }
    61% {
        animation-timing-function: cubic-bezier(0.0556, 0.1484, 0.4608, 1.846);
        opacity: 1.189
    }
    69% {
        animation-timing-function: cubic-bezier(0.0595, 0.1602, 0.4632, 1.8456);
        opacity: .848
    }
    77% {
        animation-timing-function: cubic-bezier(0.0689, 0.1849, 0.4698, 1.8391);
        opacity: 1.121
    }
    85% {
        animation-timing-function: cubic-bezier(0.0794, 0.2133, 0.4765, 1.8226);
        opacity: .903
    }
    93% {
        animation-timing-function: cubic-bezier(0.1486, 0.2692, 0.2335, 0.855);
        opacity: 1.078
    }
    100% {
        opacity: .893
    }
}

.ld.ld-damage {
    animation: ld-damage 1s infinite linear
}

@keyframes ld-rush-ltr {
    0% {
        animation-timing-function: cubic-bezier(0, 0.5, 0.5, 1);
        opacity: 0
    }
    5% {
        opacity: 1
    }
    0% {
        transform: translateX(-318.47520861406804%) skewX(30deg)
    }
    25% {
        transform: translateX(-21.425625842204074%) skewX(-15deg)
    }
    33% {
        transform: translateX(8.574374157795926%) skewX(-15deg)
    }
    44% {
        transform: translateX(-4.212879922796667%) skewX(7.5deg)
    }
    55.00000000000001% {
        transform: translateX(2.097390810087623%) skewX(-3.75deg)
    }
    66% {
        transform: translateX(0%) skewX(0deg)
    }
    80% {
        transform: translateX(0%) skewX(0deg)
    }
    100% {
        transform: translateX(300%) skewX(30deg)
    }
    100% {
        opacity: 1
    }
}

.ld.ld-rush-ltr {
    animation: ld-rush-ltr 1s infinite linear
}

@keyframes ld-rush-rtl {
    0% {
        animation-timing-function: cubic-bezier(0, 0.5, 0.5, 1);
        opacity: 0
    }
    5% {
        opacity: 1
    }
    0% {
        transform: translateX(318.47520861406804%) skewX(-30deg)
    }
    25% {
        transform: translateX(21.425625842204074%) skewX(15deg)
    }
    33% {
        transform: translateX(-8.574374157795926%) skewX(15deg)
    }
    44% {
        transform: translateX(4.212879922796667%) skewX(-7.5deg)
    }
    55.00000000000001% {
        transform: translateX(-2.097390810087623%) skewX(3.75deg)
    }
    66% {
        transform: translateX(0%) skewX(0deg)
    }
    80% {
        transform: translateX(0%) skewX(0deg)
    }
    100% {
        transform: translateX(-300%) skewX(-30deg)
    }
    100% {
        opacity: 1
    }
}

.ld.ld-rush-rtl {
    animation: ld-rush-rtl 1s infinite linear
}

@keyframes ld-rush-ttb {
    0% {
        animation-timing-function: cubic-bezier(0, 0.5, 0.5, 1);
        opacity: 0
    }
    5% {
        opacity: 1
    }
    0% {
        transform: translateY(-78.47520861406802%) skewY(30deg)
    }
    25% {
        transform: translateY(2.5743741577959263%) skewY(-15deg)
    }
    33% {
        transform: translateY(8.574374157795926%) skewY(-15deg)
    }
    44% {
        transform: translateY(-4.212879922796667%) skewY(7.5deg)
    }
    55.00000000000001% {
        transform: translateY(2.097390810087623%) skewY(-3.75deg)
    }
    66% {
        transform: translateY(0%) skewY(0deg)
    }
    80% {
        transform: translateY(0%) skewY(0deg)
    }
    100% {
        transform: translateY(60%) skewY(30deg)
    }
    100% {
        opacity: 1
    }
}

.ld.ld-rush-ttb {
    animation: ld-rush-ttb 1s infinite linear
}

@keyframes ld-rush-btt {
    0% {
        animation-timing-function: cubic-bezier(0, 0.5, 0.5, 1);
        opacity: 0
    }
    5% {
        opacity: 1
    }
    0% {
        transform: translateY(318.47520861406804%) skewY(-30deg)
    }
    25% {
        transform: translateY(21.425625842204074%) skewY(15deg)
    }
    33% {
        transform: translateY(-8.574374157795926%) skewY(15deg)
    }
    44% {
        transform: translateY(4.212879922796667%) skewY(-7.5deg)
    }
    55.00000000000001% {
        transform: translateY(-2.097390810087623%) skewY(3.75deg)
    }
    66% {
        transform: translateY(0%) skewY(0deg)
    }
    80% {
        transform: translateY(0%) skewY(0deg)
    }
    100% {
        transform: translateY(-300%) skewY(-30deg)
    }
    100% {
        opacity: 1
    }
}

.ld.ld-rush-btt {
    animation: ld-rush-btt 1s infinite linear
}

@keyframes ld-skew {
    0%, 50%, 100% {
        animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6)
    }
    25%, 75% {
        animation-timing-function: cubic-bezier(0, 0.4, 0.6, 1)
    }
    0% {
        transform: skewX(20deg) scale(1)
    }
    25% {
        transform: skewX(0deg) scale(0.9)
    }
    50% {
        transform: skewX(-20deg) scale(1)
    }
    75% {
        transform: skewX(0deg) scale(0.9)
    }
    100% {
        transform: skewX(20deg) scale(1)
    }
}

.ld.ld-skew {
    animation: ld-skew 1s infinite linear
}

@keyframes ld-skew-alt {
    0%, 50%, 100% {
        animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6)
    }
    25%, 75% {
        animation-timing-function: cubic-bezier(0, 0.4, 0.6, 1)
    }
    0% {
        transform: skewY(20deg) scale(1)
    }
    25% {
        transform: skewY(0deg) scale(0.9)
    }
    50% {
        transform: skewY(-20deg) scale(1)
    }
    75% {
        transform: skewY(0deg) scale(0.9)
    }
    100% {
        transform: skewY(20deg) scale(1)
    }
}

.ld.ld-skew-alt {
    animation: ld-skew-alt 1s infinite linear
}

@keyframes ld-slide-ltr {
    0% {
        animation-timing-function: cubic-bezier(0.4652, 0.1051, 0.774, 0.6426);
        transform: translate(0%, 0%);
        opacity: 1
    }
    22.5% {
        animation-timing-function: cubic-bezier(0.4142, 0.3131, 0.7623, 0.6513);
        transform: translate(47.8%, 0%);
        opacity: 1
    }
    45% {
        animation-timing-function: cubic-bezier(0.3615, 0.331, 0.9646, 1.3461);
        transform: translate(147.8%, 0%);
        opacity: 1
    }
    47.5% {
        animation-timing-function: cubic-bezier(0.7006, 0.3332, 0.6667, 0.6667);
        transform: translate(165.6%, 0%);
        opacity: 0
    }
    50% {
        animation-timing-function: cubic-bezier(0.1604, 0.3176, -0.0218, 0.6965);
        transform: translate(-200%, 0%);
        opacity: 0
    }
    51% {
        animation-timing-function: cubic-bezier(0.1983, 0.3529, 0.5263, 0.6945);
        transform: translate(-179.8%, 0%);
        opacity: 0
    }
    80.4% {
        animation-timing-function: cubic-bezier(0.2342, 0.3708, 0.5422, 0.9065);
        transform: translate(-38.4%, 0%);
        opacity: 1
    }
    100% {
        transform: translate(0%, 0%);
        opacity: 1
    }
}

.ld.ld-slide-ltr {
    animation: ld-slide-ltr 1s infinite linear
}

@keyframes ld-slide-rtl {
    0% {
        animation-timing-function: cubic-bezier(0.4652, 0.1051, 0.774, 0.6426);
        transform: translate(0%, 0%);
        opacity: 1
    }
    22.5% {
        animation-timing-function: cubic-bezier(0.4142, 0.3131, 0.7623, 0.6513);
        transform: translate(-47.8%, 0%);
        opacity: 1
    }
    45% {
        animation-timing-function: cubic-bezier(0.3615, 0.331, 0.9646, 1.3461);
        transform: translate(-147.8%, 0%);
        opacity: 1
    }
    47.5% {
        animation-timing-function: cubic-bezier(0.7006, 0.3332, 0.6667, 0.6667);
        transform: translate(-165.6%, 0%);
        opacity: 0
    }
    50% {
        animation-timing-function: cubic-bezier(0.1604, 0.3176, -0.0218, 0.6965);
        transform: translate(200%, 0%);
        opacity: 0
    }
    51% {
        animation-timing-function: cubic-bezier(0.1983, 0.3529, 0.5263, 0.6945);
        transform: translate(179.8%, 0%);
        opacity: 0
    }
    80.4% {
        animation-timing-function: cubic-bezier(0.2342, 0.3708, 0.5422, 0.9065);
        transform: translate(38.4%, 0%);
        opacity: 1
    }
    100% {
        transform: translate(0%, 0%);
        opacity: 1
    }
}

.ld.ld-slide-rtl {
    animation: ld-slide-rtl 1s infinite linear
}

@keyframes ld-slide-btt {
    0% {
        animation-timing-function: cubic-bezier(0.4652, 0.1051, 0.774, 0.6426);
        transform: translate(0%, 0%);
        opacity: 1
    }
    22.5% {
        animation-timing-function: cubic-bezier(0.4142, 0.3131, 0.7623, 0.6513);
        transform: translate(0%, -47.8%);
        opacity: 1
    }
    45% {
        animation-timing-function: cubic-bezier(0.3615, 0.331, 0.9646, 1.3461);
        transform: translate(0%, -147.8%);
        opacity: 1
    }
    47.5% {
        animation-timing-function: cubic-bezier(0.7006, 0.3332, 0.6667, 0.6667);
        transform: translate(0%, -165.6%);
        opacity: 0
    }
    50% {
        animation-timing-function: cubic-bezier(0.1604, 0.3176, -0.0218, 0.6965);
        transform: translate(0%, 200%);
        opacity: 0
    }
    51% {
        animation-timing-function: cubic-bezier(0.1983, 0.3529, 0.5263, 0.6945);
        transform: translate(0%, 179.8%);
        opacity: 0
    }
    80.4% {
        animation-timing-function: cubic-bezier(0.2342, 0.3708, 0.5422, 0.9065);
        transform: translate(0%, 38.4%);
        opacity: 1
    }
    100% {
        transform: translate(0%, 0%);
        opacity: 1
    }
}

.ld.ld-slide-btt {
    animation: ld-slide-btt 1s infinite linear
}

@keyframes ld-slide-ttb {
    0% {
        animation-timing-function: cubic-bezier(0.4652, 0.1051, 0.774, 0.6426);
        transform: translate(0%, 0%);
        opacity: 1
    }
    22.5% {
        animation-timing-function: cubic-bezier(0.4142, 0.3131, 0.7623, 0.6513);
        transform: translate(0%, 47.8%);
        opacity: 1
    }
    45% {
        animation-timing-function: cubic-bezier(0.3615, 0.331, 0.9646, 1.3461);
        transform: translate(0%, 147.8%);
        opacity: 1
    }
    47.5% {
        animation-timing-function: cubic-bezier(0.7006, 0.3332, 0.6667, 0.6667);
        transform: translate(0%, 165.6%);
        opacity: 0
    }
    50% {
        animation-timing-function: cubic-bezier(0.1604, 0.3176, -0.0218, 0.6965);
        transform: translate(0%, -200%);
        opacity: 0
    }
    51% {
        animation-timing-function: cubic-bezier(0.1983, 0.3529, 0.5263, 0.6945);
        transform: translate(0%, -179.8%);
        opacity: 0
    }
    80.4% {
        animation-timing-function: cubic-bezier(0.2342, 0.3708, 0.5422, 0.9065);
        transform: translate(0%, -38.4%);
        opacity: 1
    }
    100% {
        transform: translate(0%, 0%);
        opacity: 1
    }
}

.ld.ld-slide-ttb {
    animation: ld-slide-ttb 1s infinite linear
}

@keyframes ld-coin-h {
    0% {
        animation-timing-function: cubic-bezier(0.5856, 0.0703, 0.4143, 0.9297);
        transform: rotateY(0deg)
    }
    100% {
        transform: rotateY(3600deg)
    }
}

.ld.ld-coin-h, .ld.ld-coin {
    animation: ld-coin-h 2s infinite linear
}

@keyframes ld-coin-v {
    0% {
        animation-timing-function: cubic-bezier(0.5856, 0.0703, 0.4143, 0.9297);
        transform: rotateX(0deg)
    }
    100% {
        transform: rotateX(3600deg)
    }
}

.ld.ld-coin-v {
    animation: ld-coin-v 2s infinite linear
}

@keyframes ld-cycle {
    0% {
        animation-timing-function: cubic-bezier(0.3333, 0.3333, 0.6667, 0.6667);
        transform: rotate(0deg)
    }
    100% {
        transform: rotate(360deg)
    }
}

.ld.ld-cycle {
    animation: ld-cycle 1s infinite linear
}

@keyframes ld-cycle-alt {
    0% {
        animation-timing-function: cubic-bezier(0.3333, 0.3333, 0.6667, 0.6667);
        transform: rotate(0deg)
    }
    100% {
        transform: rotate(-360deg)
    }
}

.ld.ld-cycle-alt {
    animation: ld-cycle-alt 1s infinite linear
}

@keyframes ld-flip-h {
    0% {
        animation-timing-function: cubic-bezier(0.1909, 0.4373, 0.4509, 0.7454);
        transform: rotateY(0deg)
    }
    30% {
        animation-timing-function: cubic-bezier(0.128, 0.2315, 0.9704, 0.8632);
        transform: rotateY(153.72deg)
    }
    50% {
        animation-timing-function: cubic-bezier(0.5788, 0.3001, 0.5613, 0.6784);
        transform: rotateY(180deg)
    }
    55% {
        animation-timing-function: cubic-bezier(0.1545, 0.4929, 0.6089, 0.9373);
        transform: rotateY(238.68deg)
    }
    100% {
        transform: rotateY(360deg)
    }
}

.ld.ld-flip-h {
    animation: ld-flip-h 1s infinite linear
}

@keyframes ld-flip-v {
    0% {
        animation-timing-function: cubic-bezier(0.1909, 0.4373, 0.4509, 0.7454);
        transform: rotateX(0deg)
    }
    30% {
        animation-timing-function: cubic-bezier(0.128, 0.2315, 0.9704, 0.8632);
        transform: rotateX(153.72deg)
    }
    50% {
        animation-timing-function: cubic-bezier(0.5788, 0.3001, 0.5613, 0.6784);
        transform: rotateX(180deg)
    }
    55% {
        animation-timing-function: cubic-bezier(0.1545, 0.4929, 0.6089, 0.9373);
        transform: rotateX(238.68deg)
    }
    100% {
        transform: rotateX(360deg)
    }
}

.ld.ld-flip-v {
    animation: ld-flip-v 1s infinite linear
}

@keyframes ld-spin-fast {
    0% {
        animation-timing-function: cubic-bezier(0.5856, 0.0703, 0.4143, 0.9297);
        transform: rotate(0deg)
    }
    100% {
        transform: rotate(1800deg)
    }
}

.ld.ld-spin-fast {
    animation: ld-spin-fast 1s infinite linear
}

@keyframes ld-spin {
    0% {
        animation-timing-function: cubic-bezier(0.5856, 0.0703, 0.4143, 0.9297);
        transform: rotate(0deg)
    }
    100% {
        transform: rotate(360deg)
    }
}

.ld.ld-spin {
    animation: ld-spin 1s infinite linear
}

@keyframes ld-squeeze {
    0% {
        animation-timing-function: cubic-bezier(0.1685, 0.4459, 0.3641, 0.7833);
        transform: scale(0.5, 1)
    }
    30% {
        animation-timing-function: cubic-bezier(0.0995, 0.199, 0.9948, 0.959);
        transform: scale(0.9490000000000001, 0.5509999999999999)
    }
    50% {
        animation-timing-function: cubic-bezier(0.6064, 0.3078, 0.5406, 0.6764);
        transform: scale(1, 0.5)
    }
    55% {
        animation-timing-function: cubic-bezier(0.1401, 0.5826, 0.6091, 0.9651);
        transform: scale(0.8019999999999999, 0.6980000000000001)
    }
    100% {
        transform: scale(0.5, 1)
    }
}

.ld.ld-squeeze {
    animation: ld-squeeze 1s infinite linear
}

@keyframes ld-static {
}

.ld.ld-static {
    animation: ld-static 1s infinite linear
}

@keyframes ld-surprise {
    0% {
        transform: skewX(0deg) scale(1)
    }
    10% {
        transform: skewX(-25deg) scale(0.5)
    }
    20% {
        transform: skewX(-25deg) scale(0.5)
    }
    30% {
        transform: skewX(25deg) scale(1)
    }
    40% {
        transform: skewX(-25deg) scale(1)
    }
    50% {
        transform: skewX(25deg) scale(1)
    }
    60% {
        transform: skewX(-25deg) scale(1)
    }
    70% {
        transform: skewX(25deg) scale(1)
    }
    80% {
        transform: skewX(-25deg) scale(1)
    }
    90% {
        transform: skewX(25deg) scale(1)
    }
    100% {
        transform: skewX(-25deg) scale(1)
    }
}

.ld.ld-surprise {
    animation: ld-surprise 1s infinite linear
}

@keyframes ld-measure {
    0% {
        transform: translate(0%, 0%) rotate(0deg)
    }
    3.33333% {
        transform: translate(0%, 0%) rotate(-14.99241deg)
    }
    6.66667% {
        transform: translate(0%, 0%) rotate(10.93733deg)
    }
    10% {
        transform: translate(0%, 0%) rotate(10.60793deg)
    }
    13.33333% {
        transform: translate(0%, 0%) rotate(-10.26249deg)
    }
    16.66667% {
        transform: translate(0%, 0%) rotate(0.47337deg)
    }
    20% {
        transform: translate(0%, 0%) rotate(15deg)
    }
    23.33333% {
        transform: translate(0%, 0%) rotate(0.48087deg)
    }
    26.66667% {
        transform: translate(0%, 0%) rotate(-10.26796deg)
    }
    30% {
        transform: translate(0%, 0%) rotate(10.60262deg)
    }
    33.33333% {
        transform: translate(0%, 0%) rotate(10.94246deg)
    }
    36.66667% {
        transform: translate(0%, 0%) rotate(-14.99265deg)
    }
    40% {
        transform: translate(0%, 0%) rotate(-0.0075deg)
    }
    43.33333% {
        transform: translate(0%, 0%) rotate(14.99217deg)
    }
    46.66667% {
        transform: translate(0%, 0%) rotate(-10.93219deg)
    }
    50% {
        transform: translate(0%, 0%) rotate(-10.61323deg)
    }
    53.33333% {
        transform: translate(0%, 0%) rotate(10.25702deg)
    }
    56.66667% {
        transform: translate(0%, 0%) rotate(-0.46588deg)
    }
    60% {
        transform: translate(0%, 0%) rotate(-15deg)
    }
    63.33333% {
        transform: translate(0%, 0%) rotate(-0.48836deg)
    }
    66.66667% {
        transform: translate(0%, 0%) rotate(10.27343deg)
    }
    70% {
        transform: translate(0%, 0%) rotate(-10.59732deg)
    }
    73.33333% {
        transform: translate(0%, 0%) rotate(-10.94759deg)
    }
    76.66667% {
        transform: translate(0%, 0%) rotate(14.99288deg)
    }
    80% {
        transform: translate(0%, 0%) rotate(0.015deg)
    }
    83.33333% {
        transform: translate(0%, 0%) rotate(-14.99193deg)
    }
    86.66667% {
        transform: translate(0%, 0%) rotate(10.92706deg)
    }
    90% {
        transform: translate(0%, 0%) rotate(10.61853deg)
    }
    93.33333% {
        transform: translate(0%, 0%) rotate(-10.25155deg)
    }
    96.66667% {
        transform: translate(0%, 0%) rotate(0.45838deg)
    }
    100% {
        transform: translate(0, 0) rotate(0)
    }
}

.ld.ld-measure {
    animation: ld-measure 5s infinite linear
}

@keyframes ld-shiver {
    0% {
        transform: translate(0%, 0%) scale(1)
    }
    3.33333% {
        transform: translate(0%, 0%) scale(1.04279)
    }
    6.66667% {
        transform: translate(0%, 0%) scale(1.00524)
    }
    10% {
        transform: translate(0%, 0%) scale(0.96369)
    }
    13.33333% {
        transform: translate(0%, 0%) scale(0.95064)
    }
    16.66667% {
        transform: translate(0%, 0%) scale(0.97651)
    }
    20% {
        transform: translate(0%, 0%) scale(1.02078)
    }
    23.33333% {
        transform: translate(0%, 0%) scale(1.04875)
    }
    26.66667% {
        transform: translate(0%, 0%) scale(1.03832)
    }
    30% {
        transform: translate(0%, 0%) scale(0.99777)
    }
    33.33333% {
        transform: translate(0%, 0%) scale(0.95897)
    }
    36.66667% {
        transform: translate(0%, 0%) scale(0.95244)
    }
    40% {
        transform: translate(0%, 0%) scale(0.98335)
    }
    43.33333% {
        transform: translate(0%, 0%) scale(1.02733)
    }
    46.66667% {
        transform: translate(0%, 0%) scale(1.04988)
    }
    50% {
        transform: translate(0%, 0%) scale(1.0331)
    }
    53.33333% {
        transform: translate(0%, 0%) scale(0.99035)
    }
    56.66667% {
        transform: translate(0%, 0%) scale(0.95507)
    }
    60% {
        transform: translate(0%, 0%) scale(0.95527)
    }
    63.33333% {
        transform: translate(0%, 0%) scale(0.99057)
    }
    66.66667% {
        transform: translate(0%, 0%) scale(1.03343)
    }
    70% {
        transform: translate(0%, 0%) scale(1.04984)
    }
    73.33333% {
        transform: translate(0%, 0%) scale(1.02714)
    }
    76.66667% {
        transform: translate(0%, 0%) scale(0.98293)
    }
    80% {
        transform: translate(0%, 0%) scale(0.9523)
    }
    83.33333% {
        transform: translate(0%, 0%) scale(0.9591)
    }
    86.66667% {
        transform: translate(0%, 0%) scale(0.99821)
    }
    90% {
        transform: translate(0%, 0%) scale(1.0386)
    }
    93.33333% {
        transform: translate(0%, 0%) scale(1.0487)
    }
    96.66667% {
        transform: translate(0%, 0%) scale(1.02038)
    }
    100% {
        transform: translate(0, 0) scale(1)
    }
}

.ld.ld-shiver {
    animation: ld-shiver .5s infinite linear
}

@keyframes ld-swim {
    0% {
        transform: translate(0px, 0px) rotate(0deg)
    }
    8.33333% {
        transform: translate(-5.96462px, 4.90845px) rotate(-13.66821deg)
    }
    16.66667% {
        transform: translate(5.25471px, -2.05606px) rotate(0.47337deg)
    }
    25% {
        transform: translate(2.30929px, 5.79372px) rotate(13.8564deg)
    }
    33.33333% {
        transform: translate(-5.75556px, -4.60802px) rotate(10.94246deg)
    }
    41.66667% {
        transform: translate(3.73522px, 5.97742px) rotate(-14.03079deg)
    }
    50% {
        transform: translate(4.2628px, -3.01222px) rotate(-10.61323deg)
    }
    58.33333% {
        transform: translate(-4.65975px, -2.51269px) rotate(5.2869deg)
    }
    66.66667% {
        transform: translate(1.64024px, -1.05167px) rotate(10.27343deg)
    }
    75% {
        transform: translate(5.55954px, -4.22763px) rotate(-5.72726deg)
    }
    83.33333% {
        transform: translate(-2.84602px, 5.91439px) rotate(-14.99193deg)
    }
    91.66667% {
        transform: translate(-0.70744px, -5.43064px) rotate(6.16192deg)
    }
    100% {
        transform: translate(0, 0) rotate(0)
    }
}

.ld.ld-swim {
    animation: ld-swim 10s infinite linear
}

@keyframes ld-tremble {
    0% {
        transform: translate(0px, 0px)
    }
    3.33333% {
        transform: translate(-0.18923px, 1.45485px)
    }
    6.66667% {
        transform: translate(-0.84296px, -1.32524px)
    }
    10% {
        transform: translate(0.67971px, 1.00422px)
    }
    13.33333% {
        transform: translate(-0.5056px, 0.83616px)
    }
    16.66667% {
        transform: translate(1.31368px, -0.51401px)
    }
    20% {
        transform: translate(-1.21184px, 1.49193px)
    }
    23.33333% {
        transform: translate(1.09065px, -0.21259px)
    }
    26.66667% {
        transform: translate(-1.49916px, 0.56159px)
    }
    30% {
        transform: translate(1.48086px, 1.21228px)
    }
    33.33333% {
        transform: translate(-1.43889px, -1.152px)
    }
    36.66667% {
        transform: translate(1.35914px, 1.34835px)
    }
    40% {
        transform: translate(-1.42834px, 0.3091px)
    }
    43.33333% {
        transform: translate(1.47472px, -1.49889px)
    }
    46.66667% {
        transform: translate(-0.92402px, 1.4416px)
    }
    50% {
        transform: translate(1.0657px, -0.75306px)
    }
    53.33333% {
        transform: translate(-1.19035px, -1.07484px)
    }
    56.66667% {
        transform: translate(0.28828px, 0.79337px)
    }
    60% {
        transform: translate(-0.47167px, -1.42789px)
    }
    63.33333% {
        transform: translate(0.64753px, -0.09795px)
    }
    66.66667% {
        transform: translate(0.41006px, -0.26292px)
    }
    70% {
        transform: translate(-0.22477px, -1.3683px)
    }
    73.33333% {
        transform: translate(0.03588px, 0.92931px)
    }
    76.66667% {
        transform: translate(-1.01937px, -1.18398px)
    }
    80% {
        transform: translate(0.8724px, -0.60494px)
    }
    83.33333% {
        transform: translate(-0.71151px, 1.4786px)
    }
    86.66667% {
        transform: translate(1.40734px, -1.49607px)
    }
    90% {
        transform: translate(-1.33062px, 0.46957px)
    }
    93.33333% {
        transform: translate(1.23264px, 1.26738px)
    }
    96.66667% {
        transform: translate(-1.48975px, -1.03867px)
    }
    100% {
        transform: translate(0, 0)
    }
}

.ld.ld-tremble {
    animation: ld-tremble .5s infinite linear
}

@keyframes ld-vortex {
    0%, 60% {
        animation-timing-function: cubic-bezier(0.3, 0, 1, 0.7)
    }
    0% {
        opacity: 0;
        transform: rotate(-1800deg) scale(0.3)
    }
    60% {
        opacity: 1;
        transform: rotate(0deg) scale(1)
    }
    100% {
        opacity: 0;
        transform: rotate(0deg) scale(1)
    }
}

.ld.ld-vortex {
    animation: ld-vortex 1s infinite linear
}

@keyframes ld-vortex-alt {
    0%, 60% {
        animation-timing-function: cubic-bezier(0.3, 0, 1, 0.7)
    }
    0% {
        opacity: 0;
        transform: rotate(-1800deg) scale(3)
    }
    60% {
        opacity: 1;
        transform: rotate(0deg) scale(1)
    }
    100% {
        opacity: 0;
        transform: rotate(0deg) scale(1)
    }
}

.ld.ld-vortex-alt {
    animation: ld-vortex-alt 1s infinite linear
}

@keyframes ld-wrench {
    20%, 36%, 70%, 86% {
        transform: rotate(0deg)
    }
    0%, 50%, 100% {
        transform: rotate(45deg)
    }
}

.ld.ld-wrench {
    animation: ld-wrench 1s infinite linear
}

.ld-ext-right, .ld-ext-left, .ld-ext-bottom, .ld-ext-top, .ld-over, .ld-over-inverse, .ld-over-full, .ld-over-full-inverse {
    position: relative;
    transition: all .3s;
    transition-timing-function: ease-in
}

.ld-ext-right > .ld, .ld-ext-left > .ld, .ld-ext-bottom > .ld, .ld-ext-top > .ld, .ld-over > .ld, .ld-over-inverse > .ld, .ld-over-full > .ld, .ld-over-full-inverse > .ld {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1em;
    height: 1em;
    margin: -0.5em;
    opacity: 0;
    z-index: -1;
    transition: all .3s;
    transition-timing-function: ease-in
}

.ld-ext-right > .ld > *, .ld-ext-left > .ld > *, .ld-ext-bottom > .ld > *, .ld-ext-top > .ld > *, .ld-over > .ld > *, .ld-over-inverse > .ld > *, .ld-over-full > .ld > *, .ld-over-full-inverse > .ld > * {
    width: 1em;
    height: 1em;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-0.5em, -0.5em)
}

.ld-ext-right.running > .ld, .ld-ext-left.running > .ld, .ld-ext-bottom.running > .ld, .ld-ext-top.running > .ld, .ld-over.running > .ld, .ld-over-inverse.running > .ld, .ld-over-full.running > .ld, .ld-over-full-inverse.running > .ld {
    opacity: 1;
    z-index: auto;
    visibility: visible
}

.ld-ext-right.running {
    padding-right: 2.5em !important
}

.ld-ext-right > .ld {
    top: 50%;
    left: auto;
    right: 1.25em
}

.ld-ext-left.running {
    padding-left: 2.5em !important
}

.ld-ext-left > .ld {
    top: 50%;
    right: auto;
    left: 1.25em
}

.ld-ext-bottom.running {
    padding-bottom: 2.5em !important
}

.ld-ext-bottom > .ld {
    top: auto;
    left: 50%;
    bottom: 1.25em
}

.ld-ext-top.running {
    padding-top: 2.5em !important
}

.ld-ext-top > .ld {
    bottom: auto;
    left: 50%;
    top: 1.25em
}

.ld-over:before, .ld-over-inverse:before, .ld-over-full:before, .ld-over-full-inverse:before {
    content: " ";
    display: block;
    opacity: 0;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: all .3s;
    transition-timing-function: ease-in;
    background: rgba(240, 240, 240, 0.8)
}

.ld-over.running > .ld, .ld-over-inverse.running > .ld, .ld-over-full.running > .ld, .ld-over-full-inverse.running > .ld {
    z-index: 4001
}

.ld-over.running:before, .ld-over-inverse.running:before, .ld-over-full.running:before, .ld-over-full-inverse.running:before {
    opacity: 1;
    z-index: 4000;
    display: block
}

.ld-unover.ld-over.running:before, .ld-unover.ld-over-inverse.running:before, .ld-unover.ld-over-full.running:before, .ld-unover.ld-over-full-inverse.running:before {
    opacity: 0
}

.ld-over-full.running > .ld, .ld-over-full-inverse.running > .ld, .ld-over-full.running:before, .ld-over-full-inverse.running:before {
    position: fixed
}

.ld-over-full > .ld {
    color: rgba(0, 0, 0, 0.8)
}

.ld-over-full:before, .ld-over-full-inverse:before {
    background: rgba(255, 255, 255, 0.8)
}

.ld-over-inverse > .ld {
    color: rgba(255, 255, 255, 0.8)
}

.ld-over-inverse:before {
    background: rgba(0, 0, 0, 0.6)
}

.ld-over-full-inverse > .ld {
    color: rgba(255, 255, 255, 0.8)
}

.ld-over-full-inverse:before {
    background: rgba(0, 0, 0, 0.6)
}

.layout-loading.layui-layer-loading .layui-layer-content {
    background-image: url(/resources/imgs/loading.gif);
    background-repeat: no-repeat;
    min-width: 150px;
    width: auto;
    height: 80px;
    background-position: calc(50% - 5px) 10px;
    background-color: rgba(0, 0, 0, 0.5);
    background-size: 42px 42px;
    color: #f6f6f6;
    display: flex;
    align-items: flex-end;
    padding: 10px;
    justify-content: center;
    border-radius: 4px;
    font-size: 14px
}