html,
body {
    font: 12px/1.5 "Helvetica Neue", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", SimSun, sans-serif;
   
    
   
    overflow-x: hidden !important;
    min-height: 635px;
    margin: 0px !important;
    -moz-background-size: cover;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    color: #f8f8f8;

    
   
}

.hz_default_theme {
    background-image: url(/static/img/bg01.png);
    -moz-background-size: cover;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    color: #00ffff;
}

.hz_noraml_theme {
   
    -moz-background-size: cover;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    color: #f9f4f4;
    background-color: #3e4141;
}

.layui-layout-admin {
    height: 100%;
}

.p_panel {
    min-height: 12rem;
    border-bottom: 1px dashed #CCCCCC;
    margin-bottom: 5px;
    padding-left: 5px;
    background-color: #f4f3fd;
    border: 1px solid transparent;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
    box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
}

.panel {
    margin-bottom: 20px;
    background-color: #f4f3fd;
    border: 1px solid transparent;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
    box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
}

.p_panel .p_corp_logo {
    /*padding-left: 10px;*/
    padding-top: 10px;
}

.p_title {
    padding-top: 10px;
    /*color: #c2c2c2;*/
}

.devider-vertical {
    border-right: 1px dashed #CCCCCC;
    height: 100%;
    left: 0;
    width: 3px;
}

.devider-horizen {
    border-bottom: 1px dashed #CCCCCC;
    height: 3px;
    left: 0;
    position: absolute;
    /*top: -35px;*/
    width: 100%;
}

.mapArea {
    min-height: 260px;
    width: 100%;
    /* background-color: #CCCCCC; */
    padding-top: 15px;
}

.dataArea {
    min-height: 340px;
    width: 100%;
    background-color: #1E9FFF;
    padding-top: 15px;
}

.run {
    color:#00CC00;
    padding-right: 5px;
}

.stop {
    color:#ff1c57;
    padding-right: 5px;
}

.status
{
    color: #FFFF00;
    padding-right: 5px;
}

.fault {
    color: #ffce3d;
    padding-right: 5px;
}

.notused {
    color: #666666;
    padding-right: 5px;
}

.media-body {
    padding: 7px 7px 6px 5px;
    min-height: 49px;
    height: 49px;
    overflow: hidden;
}

.main-search {
    height: 36px;
    border: 0;
    width: 95%;
    font-size: 16px;
    background-color: #1E9FFF;
    background-image: url(../img/icon/search.png);
    background-repeat: no-repeat;
    background-position: 0 4px;
    padding-left: 32px;
}

.pull-right {
    float: right !important;
}

.layui-form-label {
    float: left;
    display: block;
    padding: 5px 15px;
    max-width: 100px;
    font-weight: 400;
    text-align: right;
}

.hz_pannel {
    min-height: 220px;
}



.hz_pannel_120 {
    min-height: 100px;
}

.hz_pannel_filter {
    min-height: 64px;
}

@-webkit-keyframes bounceIn {
    0% {
        opacity: 0;
        -webkit-transform: scale(.3)
    }
    50% {
        opacity: 1;
        -webkit-transform: scale(1.05)
    }
    70% {
        -webkit-transform: scale(.9)
    }
    100% {
        -webkit-transform: scale(1)
    }
}

.animation1 {
    -webkit-animation: bounceIn 1s .2s ease both;
    -moz-animation: bounceIn 1s .2s ease both;
}

.hz_title {
    display: inline-block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    /* padding: 10px; */
    border: none;
    font-size: 16px;
    /* font: normal 13px/normal "Warnes", Helvetica, sans-serif; */
    color: rgba(255, 255, 255, 1);
    text-decoration: normal;
    text-align: center;
    -o-text-overflow: clip;
    text-overflow: clip;
    white-space: pre;
    text-shadow: 0 0 10px rgba(255, 255, 255, 1), 0 0 20px rgba(255, 255, 255, 1), 0 0 30px rgba(255, 255, 255, 1), 0 0 40px #00ffff, 0 0 70px #ff00de, 0 0 80px #ff00de, 0 0 100px #ff00de;
    -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
    -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
    -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
    transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
}

.hz_title:hover {
    text-shadow: 0 0 10px rgba(255, 255, 255, 1), 0 0 20px rgba(255, 255, 255, 1), 0 0 30px rgba(255, 255, 255, 1), 0 0 40px #00ffff, 0 0 70px #00ffff, 0 0 80px #00ffff, 0 0 100px #00ffff;
}

.layui-tab-title li:first-child .layui-tab-close {
    display: none;
}

.hz_bg_color {
    background-color: #1f4e79;
}

.layui-layout-admin .layui-header {
    background-color:transparent!important;
    /* background-color: #344050; */
}

.bevel.tlbr {
    background: #f5f5f5;
    background: -moz-linear-gradient(45deg, #f5f5f5 30px, #f5f5f5 30px), -moz-linear-gradient(135deg, transparent 30px, #f5f5f5 30px), -moz-linear-gradient(225deg, #f5f5f5 30px, #f5f5f5 30px), -moz-linear-gradient(315deg, transparent 30px, #f5f5f5 30px);
    background: -o-linear-gradient(45deg, #f5f5f5 30px, #f5f5f5 30px), -o-linear-gradient(135deg, transparent 30px, #f5f5f5 30px), -o-linear-gradient(225deg, #f5f5f5 30px, #f5f5f5 30px), -o-linear-gradient(315deg, transparent 30px, #f5f5f5 30px);
    background: -webkit-linear-gradient(45deg, #f5f5f5 30px, #f5f5f5 30px), -webkit-linear-gradient(135deg, transparent 30px, #f5f5f5 30px), -webkit-linear-gradient(225deg, #f5f5f5 30px, #f5f5f5 30px), -webkit-linear-gradient(315deg, transparent 30px, #f5f5f5 30px);
}

.layui-nav-tree .layui-nav-item a:hover {
    background-color: #35943c8a
}

.layui-nav-tree .layui-nav-child dd.layui-this,
.layui-nav-tree .layui-nav-child dd.layui-this a,
.layui-nav-tree .layui-this,
.layui-nav-tree .layui-this>a,
.layui-nav-tree .layui-this>a:hover {
    background-color: #1e9fff;
    color: #fff;
}

.site-demo-nav .layui-nav-item a:hover,
.site-demo-nav .layui-this a {
    color: #f1dc17
}

.layui-nav-tree .layui-nav-item a:hover {
    background-color: #1F4E79
}

.hz_li {
    line-height: 20px;
    min-height: 25px;
}

.layui-nav * {
    font-size: 13px;
}

.layui-table td,
.layui-table th {
    position: relative;
    padding: 9px 15px;
    min-height: 20px;
    line-height: 20px;
    font-size: 12px;
}

h3 {
    font-size: 12px;
}

.layui-tab-title li {
    display: inline-block;
    vertical-align: middle;
    font-size: 12px;
    transition: all .2s;
    -webkit-transition: all .2s;
    position: relative;
    line-height: 40px;
    min-width: 65px;
    padding: 0 15px;
    text-align: center;
    cursor: pointer;
}

.layui-layout-admin .layui-body {
    top: 60px;
    bottom: 0px;
    -ms-overflow-style: none;
    overflow-y: auto;
    scrollbar-base-color: #3e4242;
}

.layui-body::-webkit-scrollbar { display: none; }
	
.layui-nav {
    position: relative;
    padding: 0 1px;
    background-color: transparent !important;
    color: #fff;
    border-radius: 2px;
    font-size: 0;
    box-sizing: border-box;
}

.layui-nav-tree .layui-nav-bar {
    width: 5px;
    height: 0;
    background-color: #1e9fff;
}

.layui-elem-quote {
    margin-bottom: 10px;
    padding: 15px;
    line-height: 22px;
    border-left: 5px solid #1e9fff;
    border-radius: 0 2px 2px 0;
    background-color: #f2f2f2;
}

.layui-nav .layui-this::after,
.layui-nav-bar,
.layui-nav-tree .layui-nav-itemed::after {
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 5px;
    background-color: #1E9FFF;
    transition: all .2s;
    -webkit-transition: all .2s;
}

.layui-elem-field legend {
    font-size: 12px;
    font-weight: 300;
}

/* .layui-btn {
            display: inline-block;
            height: 32px;
            line-height: 32px;
            padding: 0 16px;
            background-color: #009688;
            color: #fff;
            white-space: nowrap;
            text-align: center;
            font-size: 12px;
            border: none;
            border-radius: 2px;
            cursor: pointer;
            -moz-user-select: none;
            -webkit-user-select: none;
            -ms-user-select: none;
        } */

.layui-input,
.layui-select,
.layui-textarea {
    height: 32px;
    line-height: 1.3;
    line-height: 32px\9;
    border-width: 1px;
    border-style: solid;
    background-color: #D7D9D8;
    border-radius: 2px;
}

.fa {
    padding-right: 5px;
}

.layui-layout-admin .layui-side {
    top: 60px;
    width: 200px;
    overflow-x: hidden;
    /* background-color: #39485d; */
    background-color: transparent!important;
}

.layui-elem-field {
    margin-bottom: 10px;
    padding: 0;
    border-width: 0px;
    border-style: solid;
    border-top-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 0px;
    border-right-width: 0px;
    border-left-color: #1e9fff;
    /* border:2px solid greenyellow; */
    /* box-shadow: -1px 0 2px #1e9fff,0 -1px 2px #1e9fff,0 1px 2px #1e9fff,1px 0 2px #1e9fff; */
    /* border-image: url(/static/img/b2.png) 30 ; */
    border: 8px solid transparent;
    /* padding: 2px; */
    /* -webkit-border-image: url(/static/img/b2.png) 30 round;  */
    /* -o-border-image: url(/static/img/b2.png) 30 round;  */
    /* border-image: url(/static/img/b2.png) 30 round; */

    border-image: url(/static/img/border.png) 5%;
    /* box-shadow: 0 0 5px #006e96; */

}



.layui-elem-quote {
    margin-bottom: 10px;
    padding: 15px;
    line-height: 22px;
    border-left: 5px solid #1e9fff;
    border-radius: 0 2px 2px 0;
    background-color:transparent!important;
}

.gradient-border {
    --borderWidth: 1px;
    background: #1D1F20;
    position: relative;
    border-radius: var(--borderWidth);
}

.layui-elem-field:after {
    content: '';
    position: absolute;
    top: calc(-1 * var(--borderWidth));
    left: calc(-1 * var(--borderWidth));
    height: calc(100% + var(--borderWidth) * 2);
    width: calc(100% + var(--borderWidth) * 2);
    /* background: linear-gradient(60deg, #f79533, #f37055, #ef4e7b, #a166ab, #5073b8, #1098ad, #07b39b, #6fba82); */
    border-radius: calc(2 * var(--borderWidth));
    z-index: -1;
    animation: animatedgradient 3s ease alternate infinite;
    background-size: 300% 300%;
}

@keyframes animatedgradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

.layui-table {
    width: 100%;
    background-color:transparent!important;
    color: #f9f4f4;
}



.layui-tab-title {
    position: relative;
    left: 0;
    height: 40px;
    white-space: nowrap;
    font-size: 0;
    border-bottom-width: 0px;
    border-bottom-style: solid;
    transition: all .2s;
    -webkit-transition: all .2s;
}

.layui-tab-title .layui-this:after {
    position: absolute;
    left: 0;
    top: 0;
    content: '';
    width: 100%;
    height: 41px;
    border-width: 0px;
    border-style: solid;
    border-bottom-color: #fff;
    border-radius: 2px 2px 0 0;
    box-sizing: border-box;
    pointer-events: none;
}

.layui-table tbody tr:hover, .layui-table thead tr, .layui-table-click, .layui-table-header, .layui-table-hover, .layui-table-mend, .layui-table-patch, .layui-table-tool, .layui-table[lay-even] tr:nth-child(even) {
    background-color: rgba(0,191,255,0.46);
    color: #10e6de;
}
a {
    color: #00ffff;
    text-decoration: none;
}


.layui-laypage a, .layui-laypage span {
    display: inline-block;
    vertical-align: middle;
    padding: 0 15px;
    height: 28px;
    line-height: 28px;
    margin: 0 -1px 5px 0;
    background-color: transparent!important;
    color: #00ffff;
    font-size: 12px;
}


.ztree li a {
    padding: 1px 3px 0 0;
    margin: 0;
    cursor: pointer;
    height: 17px;
    color: #0eece4;
    background-color: transparent;
    text-decoration: none;
    vertical-align: top;
    display: inline-block;
}


.layui-tab-title .layui-this {
    color: rgb(243, 229, 32);
}


.hz_menu {
    background-color: #389AF3;
    opacity: 0.88;
    color: #fff;
    user-select: none;
    cursor: pointer;
    /* border: 3px solid #389AF3; */
    padding: 1px 1px;
    /* border-image: url('/static/img/bb.png'); */
    border-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="-1 -1 281 64" width="281" height="64"><path fill="#389AF3" d="M260.393981,3.471 C243.101803,2.001 207.178636,0 139.740583,0 C71.8213638,0 35.8981966,2.001 18.6050582,3.471 C9.65115783,4.232 2.37989542,11.246 0.900864369,20.472 C0.367836944,23.797 1.13686838e-13,27.399 1.13686838e-13,31 C1.13686838e-13,34.601 0.367836944,38.203 0.900864369,41.528 C2.37989542,50.754 9.65115783,57.767 18.6050582,58.529 C35.8981966,59.999 71.8213638,62 139.259417,62 C207.178636,62 243.101803,59.999 260.393981,58.529 C269.347882,57.767 276.620105,50.754 278.099136,41.528 C278.632163,38.203 279,34.601 279,31 C279,27.398 278.632163,23.797 278.099136,20.472 C276.620105,11.246 269.347882,4.232 260.393981,3.471 Z"/></svg>');
    border-image-slice: 6;
    border-image-width: 2px;
    border-image-repeat: stretch;
    border-image-outset: 5px;
    
    box-shadow: 1px 5px 60px 2px rgba(56,154,243,.7);
    transition: box-shadow .3s;
    
   
  }

  .hz-selected{
      background-color: #ffce3d;
  }

  .layui-nav .layui-nav-item a {
    display: block;
    padding: 3px 30px;
    color: #fff;
    color: rgba(255, 255, 255, .7);
    transition: all .3s;
    -webkit-transition: all .3s;
}

.layui-layer {
    -webkit-overflow-scrolling: touch;
    top: 150px;
    left: 0;
    margin: 0;
    padding: 0;
    background-color: #3e4141;
    -webkit-background-clip: content;
    border-radius: 2px;
    box-shadow: 1px 1px 50px rgba(0,0,0,.3);
    /* color: #1D1F20; */
}

.layui-nav-child {
    display: none;
    position: absolute;
    left: 0;
    top: 65px;
    min-width: 100%;
    line-height: 36px;
    padding: 5px 0;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .12);
    border: 1px solid #d2d2d2;
    background-color: transparent!important;
    z-index: 100;
    border-radius: 2px;
    white-space: nowrap;
}

.layui-table td, .layui-table th, .layui-table-fixed-r, .layui-table-header, .layui-table-page, .layui-table-tips-main, .layui-table-tool, .layui-table-view, .layui-table[lay-skin=line], .layui-table[lay-skin=row] {
    border-width: 0px;
    border-style: solid;
    border-color: #f9f4f4;
}


.layui-table-tool .layui-inline[lay-event] {
    position: relative;
    width: 26px;
    height: 26px;
    padding: 5px;
    line-height: 16px;
    margin-right: 10px;
    text-align: center;
    color: #a6fd02;
    border: 0px solid #ccc;
    cursor: pointer;
    -webkit-transition: .5s all;
    transition: .5s all;
}

.layui-disabled, .layui-disabled:hover {
    color: #8c9696!important;
    cursor: not-allowed!important;
}

.layui-form-select dl dd, .layui-form-select dl dt {
    padding: 0 10px;
    line-height: 36px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #1F4E79;
}

.hz_warn_msg{
    
    font-size: 13px;
    font: 600;
    color: #FFFF00;
    padding: 10px;
}
.hz_warn_msg div{
   padding: 5px;
}

.layui-layer {
    -webkit-overflow-scrolling: touch;
    top: 150px;
    left: 0;
    margin: 0;
    padding: 0;
    background-color: #3e4141;
    -webkit-background-clip: content;
    border-radius: 2px;
    box-shadow: 1px 1px 50px rgba(0,0,0,.3);
}

.layui-nav-itemed>.layui-nav-child {
    display: block;
    padding: 0;
    background-color: rgba(0, 0, 0, .05)
}

.layadmin-iframe{
    position: absolute;
    left: 2px;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 998;
    width: 100%;
    overflow: hidden;
    overflow-y: auto;
    box-sizing: border-box;
}
  


.layui-carousel {
    position: relative;
    left: 0;
    top: 0;
    background-color: transparent!important;
}
.layui-carousel>[carousel-item]>* {
    display: none;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: transparent!important;
    transition-duration: .3s;
    -webkit-transition-duration: .3s;
}
.layui-carousel>[carousel-item]:before {
    position: absolute;
    content: '';
    left: 50%;
    top: 50%;
    width: 100px;
    line-height: 20px;
    margin: -10px 0 0 -50px;
    text-align: center;
    color: #c2c2c2;
    font-family: layui-icon!important;
    font-size: 30px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


.hz-green{
    color: #5CE68D;
}

.hz-blue{
    
    color: #48D1EE;
}
.hz-yellow{
    color:  rgb(243, 229, 32)
}
/* .waterRun {
    margin-left: 15px;
} */
  
/*  -- flex弹性布局 -- */
.flex {
    width: 100%;
    display: -webkit-box !important;
    /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */
    display: -moz-box !important;
    /* Firefox 17- */
    display: -webkit-flex !important;
    /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */
    display: -moz-flex !important;
    /* Firefox 18+ */
    display: -ms-flexbox !important;
    /* IE 10 */
    display: flex !important;
    /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */
}

.basis-xs {
    flex-basis: 20%;
}

.basis-sm {
    flex-basis: 40%;
}

.basis-df {
    flex-basis: 50%;
}

.basis-lg {
    flex-basis: 60%;
}

.basis-xl {
    flex-basis: 80%;
}

.flex-1 {
    flex: 1;
}

.flex-2 {
    flex: 2;
}

.flex-3 {
    flex: 3;
}

.flex-direction {
    flex-direction: column;
}

.flex-wrap {
    flex-wrap: wrap;
}


.align-start {
    align-items: flex-start;
}

.align-end {
    align-items: flex-end;
}

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

.align-stretch {
    align-items: stretch;
}

.self-start {
    align-self: flex-start;
}

.self-center {
    align-self: flex-center;
}

.self-end {
    align-self: flex-end;
}

.self-stretch {
    align-self: stretch;
}

.align-stretch {
    align-items: stretch;
}

.justify-start {
    justify-content: flex-start;
}

.justify-end {
    justify-content: flex-end;
}

.justify-center {
    justify-content: center;
}

.justify-between {
    justify-content: space-between;
}

.justify-around {
    justify-content: space-around;
}
/* 滚动列表 */
.scrollList::-webkit-scrollbar {
    display: none;
}
.scrollList .-o-scrollbar{
    display: none;
}
.scrollList {
    scrollbar-width: none;
    box-sizing: border-box;
    padding: 0px 0 10px 0;

    overflow-y: scroll;
    border-bottom: 1px solid #bfbfbf;
}