._VideoStorage_ {
    min-height: 80vh;
    padding: 14/@px-unit 14/@px-unit 14/@px-unit 29/@px-unit;
    > .ant-row {
        > .ant-col {
            padding-bottom: 14/@px-unit;
        }
    }
}

._VideoEncrypt_ {
    .ant-collapse {
        background: #fff;
    }
    .ant-collapse-content > .ant-collapse-content-box {
        padding: 0/@px-unit;
    }
    .handle {
        margin-left: 20/@px-unit;
        button {
            margin-right: 10/@px-unit;
        }
    }
}



.FireWall-tab{
    .ant-table-header-column{
        font-weight: bold;
    }
    .icons-list {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .padding15{
        padding: 14/@px-unit;
        padding-top: 0;
    }
    .paddingLeft15{
        padding-left:15/@px-unit;
    }
    .divider{
        padding:0 15/@px-unit;    
    }
    .marginRight10{
        margin-right:10/@px-unit;
    }
    a {
        color:@text-color;
        &:hover{
            color:@primary-color;
        }
    }
    padding: 14/@px-unit 14/@px-unit 14/@px-unit 29/@px-unit;
    .ant-popover-buttons .ant-btn:first-child{
        float: right;
    }
    .ant-modal-confirm-btns .ant-btn:first-child{
        float: right;
        margin-left: 10/@px-unit;
    }
    .Firewall-radio-label{
        width:80/@px-unit;
    }
}
.Firewall-modal{
    .LabelIP-label-Col{
        text-align: left;
    }
    .LabelIP-container{
        margin: 0;
    }
    .ant-input.LabelIPinput {
        width:53/@px-unit;
    }
    .ant-row{
        margin-bottom: 6/@px-unit;
    }
    .mac-box .mac-input {
        width: 34.5/@px-unit; 
        min-width: 34.5/@px-unit; 
        padding: 0; 
    }
    .macInput-label {
        padding: 0;
        text-align: left;
    }
    .ant-input-number{
        width:100%;
    }
    
}
._publicAccountLock_{
    .label-title-Text{
        line-height: 32/@px-unit;
        font-weight: bold;
    }
    .padding15{
        padding: 15/@px-unit;
    }
    .marginRight10{
        margin-right:10/@px-unit;
    }
    .divider{
        padding:0 15/@px-unit;    
    }
    padding: 14/@px-unit 14/@px-unit 14/@px-unit 29/@px-unit;
    > .ant-row {
        > .ant-col {
            padding-bottom: 14/@px-unit;
        }
    }
    .ant-input-number{
        width:100%;
    }
}
._DOSAttack_{
    padding: 16/@px-unit;
}

._Whitelist_ {
    .icons-list {
        display: flex;
        align-items: center;
        justify-content: center;
    }
}



._SAFESecurityStatus_{
    p{
        margin-bottom: 0;
    }
    .icon-desc-popover-wrapper {
        .ant-popover-inner-content {
            padding: 12/@px-unit 16/@px-unit;
        }
    }
    ._SAFESecurityStatus_title{
        background-color:#e6f7ff;
        padding:15/@px-unit;
        position: relative;
    }
    ._SAFESecurityStatus_titleText{
        font-size:24/@px-unit;
        margin-bottom:10/@px-unit !important;
    }
    ._SAFESecurityStatus_titleTip{
        margin-left:5%;
    }
    .safeSecurityStatus{
        color: @safeSecurityStatusColor;
    }
    ._SAFESecurityStatus_detect{
        min-width: 100/@px-unit;
        height: 40/@px-unit;
        max-height: 40/@px-unit;
        position:absolute;
        right:20/@px-unit;
        top: 0;
        bottom: 0;
        margin: auto;
    }
    .icon_pr10{
        padding-right: 10/@px-unit;
    }
    .icon_pl16 {
        padding-left: 16/@px-unit;
    }
    ._SAFESecurityStatus_list{
        border-top:1/@px-unit solid #e8e8e8;
    }
    ._SAFESecurityStatus_listTitle{
        border-bottom:1/@px-unit solid #e8e8e8;
        padding:15/@px-unit 5/@px-unit 10/@px-unit 25/@px-unit;
    }
    .status-title-tip {
        display: flex;
        align-items: center;
        height: 28/@px-unit;
        line-height: 28/@px-unit;
        overflow: hidden;
        .warningTips-icon, .successTips-icon {
            font-size: 36/@px-unit;
        }
    }
    ._SAFESecurityStatus_content{
        min-height:180/@px-unit;
        padding:15/@px-unit 60/@px-unit;
    }
    ._SAFESecurityStatus_titleIcon{
        font-size: 45/@px-unit;
    }
    .securityStateBtn{
        width: 64/@px-unit;
        height: 24/@px-unit;
        margin: 6/@px-unit 0 0 11/@px-unit;
        line-height: 24/@px-unit;
    }
    .cuttitle {
        overflow: hidden !important;
        white-space: nowrap;
        word-wrap: normal;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
    }
    .button_black {
        text-align: center;
        cursor: pointer;
        border: 1/@px-unit solid #e8e8e8 !important;
        -webkit-border-radius: 2/@px-unit;
        -moz-border-radius: 2/@px-unit;
        -ms-border-radius: 2/@px-unit;
        -o-border-radius: 2/@px-unit;
        border-radius: 2/@px-unit;
    }
    .detail-modal{
        .title{
            display: flex;
            align-items: center;
            justify-content: space-between;
            .check-prompt {
                display: flex;
                align-items: center;    
                height: 32/@px-unit;
            }
            .warningTips-icon {
                font-size: 36/@px-unit;
            }    
            .detail-opz-btn{
                margin-left: 10/@px-unit;
            }
            button{
                margin-top: -3/@px-unit;
            }
        }
    }
    .detail-title-warning {
        display: inline-block;
        vertical-align: middle;
    }
    .item-icon-wrap {
        position: relative;
    }
    .item-icon-list{
        width: 64/@px-unit;
        height: 64/@px-unit;
        margin: 0 auto;
        display: block;
        font-size:64/@px-unit;
        margin-bottom: 5/@px-unit;
    }
    .icon-desc-wrapper{
        display: flex;
        align-items: center;
        justify-content: center;
        width: 64/@px-unit;
        height: 64/@px-unit;
        margin: 0 auto;
        margin-bottom: 5/@px-unit;
    }
    .item-icon-loading{
        position: relative;

        &::after {
            content: '';
            position: absolute;
            left: -5/@px-unit;
            top: -5/@px-unit;
            width: 74/@px-unit;
            height: 74/@px-unit;
            border-radius: 50%;
            border: 2/@px-unit solid transparent;
            border-bottom-color: rgb(16, 142, 233);
            animation: rotation 1.5s linear infinite;
        }
    }
    .item-list-name{
        text-align: center;
        height:30/@px-unit;
        line-height:30/@px-unit;
        margin-top: 5/@px-unit;
    }
    .item-list-name-users {
        text-align: center;
        line-height:30/@px-unit;
        
    }
    .item-list-btn{
        display: inline-block;
        padding: 2/@px-unit 5/@px-unit;
        border: .5/@px-unit solid #e8e8e8;
        margin: 0 auto;
        cursor: pointer;
        border-radius: 4/@px-unit;
        min-width: 60/@px-unit;
    }
    .detail-title-warning{
        margin-left: 6/@px-unit;
        font-weight: bold;
    }
    .detail-optimize-btn{
        float: right;
        margin: 0 10/@px-unit;
    }
    .detail-optimize-list{
        position: relative;
        padding: 0 20/@px-unit;
        padding-right: 30/@px-unit;
    }
    .detail-optimize-btn{
        position: absolute;
        right: 10/@px-unit;
        top: 10/@px-unit;
        text-align:right;
        color:@current;
        cursor: pointer;
    }
    .icon-desc-popover{
        max-width: 500/@px-unit;
        .icon-desc-title{
            font-weight: bold;
            margin: 10/@px-unit 0;
        }
    }

    .icon-status-success{
        svg .icon-cicrle-part{
            fill:#52c41a;
        }
    }
    .icon-status-fail{
        svg .icon-cicrle-part{
            fill:#fcac15;
        }
    }
    .safeWarningIcon {
        svg .icon-cicrle-part{
            fill:#fcac15;
        }
    }
    .icon-status-ignore{
        svg .icon-cicrle-part{
            fill:#8f8f8f;
        }
    }

    .item-list-name-fail{
        color: #fcac15;
    }
    .ant-progress-bg{
        background-color: #8fc6f8;
        background-image: linear-gradient(to right, rgb(16, 142, 233) 0%, rgb(135, 208, 104) 100%);
        background-size: 40/@px-unit 40/@px-unit;
        background-image: -webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
        background-image: -o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
        background-image: -ms-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
        -webkit-background-size: 40/@px-unit 40/@px-unit;
        background-size: 40/@px-unit 40/@px-unit;
    }
}

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.Cert-form {
    .ant-form-item-label > label.ant-form-item-required:not(.ant-form-item-required-mark-optional)::before,
    .ant-form-item-label > label::after {
        display: none;
    }
    .ant-form-item {
        margin-bottom: 10/@px-unit !important;
    }
}

.Cert{
    word-break: break-all;
    padding: 16/@px-unit;
    .ant-table-tbody .ant-table-row{
        border-left: 1/@px-unit solid #e8e8e8;
        border-right: 1/@px-unit solid #e8e8e8;
    }
    .ant-table-placeholder{
        border-left: 1/@px-unit solid #e8e8e8;
        border-right: 1/@px-unit solid #e8e8e8;
    }
    .ant-table-header-column{
        font-weight: bold;
    }
    .ant-form-explain{
        margin-left:0/@px-unit;
    }
    .cert-popover-wrapper {
        .ant-popover-inner-content {
            padding: 12/@px-unit 16/@px-unit;
        }
    }
    .ant-modal-body{
        .Cert-form{
            .ant-form-item{
                position: relative;
                .ant-form-item-label{
                    text-align: left;
                    margin-left: 6%;
                }
                .ant-form-item-control-wrapper{
                    width: 50%;
                }
            }
        }
    }
    .icon-wrap {
        display: inline-flex;
        background-color: #fff;
        border-radius: 50%;
    }
    .grey-select {
        svg path:first-of-type {
            fill: @iconDisabledColor;
        }
    }
}
.cert-install-modal {
    .install-cert-tips {
        color: @warnColorNo18;
    }
}
.Cert_btn_disabled {
    svg path {
        fill: @iconDisabledColor;
    }
    cursor: not-allowed;
}



.safeopr-configBar {    position: fixed;    right: 0;    bottom: 0;    left: 12.5%;    margin: auto;    padding: 14/@px-unit 20/@px-unit;    .left {        float: left;        & > * {            margin-left: 10/@px-unit;            margin-right: 10/@px-unit;        }    }    .right {        display: flex;        float: right;        & > * {            margin-left: 10/@px-unit;            margin-right: 10/@px-unit;        }                                    }}.ant-table.ant-table-bordered .ant-table-title {    padding: 5/@px-unit 15/@px-unit;}
.ant-form {    color: inherit !important;}.safeopr-alert-wrapper {    padding-top: 8/@px-unit;    padding-bottom: 8/@px-unit;}.label-flex-container {    display: flex;    align-items: center;    height: 48/@px-unit;    padding: 8/@px-unit 0;}.sdd-form-container {    white-space: nowrap;    .sdd-form-list-wrapper {        display: inline-block;        vertical-align: top;        margin-right: 40px;        margin-left: 40px;        &:first-of-type {            margin-left: 0px;        }        &:last-of-type {            margin-right: 0px;        }    }}.operator-icon {    font-size: 30/@px-unit;}    .ant-modal-footer .ant-btn + .ant-btn:not(.ant-dropdown-trigger) {    margin-left: 12/@px-unit;}
.m-m-a {    margin: auto;}.m-m-0 {    margin: 0 !important;}.m-m-20 {    margin: 20/@px-unit !important;}.m-m-10 {    margin: 10/@px-unit !important;}.m-mr-0 {    margin-right: 0 !important;}.m-mr-5 {    margin-right: 5/@px-unit !important;}.m-mr-6 {    margin-right: 6/@px-unit !important;}.m-mr-10 {    margin-right: 10/@px-unit !important;}.m-mr-12 {    margin-right: 12/@px-unit !important;}.m-mr-15 {    margin-right: 15/@px-unit !important;}.m-mr-20 {    margin-right: 20/@px-unit !important;}.m-mr-24 {    margin-right: 24/@px-unit !important;}.m-mr-30 {    margin-right: 30/@px-unit !important;}.m-mr-36 {    margin-right: 36/@px-unit !important;}.m-mr-40 {    margin-right: 40/@px-unit !important;}.m-mr-100 {    margin-right: 100/@px-unit !important;}.m-mr-140 {    margin-right: 140/@px-unit !important;}.m-mr-186 {    margin-right: 186/@px-unit !important;}.m-mr-200 {    margin-right: 200/@px-unit !important;}.m-mr-250 {    margin-right: 250/@px-unit !important;}.m-mr-f2 {    margin-right: -2/@px-unit !important;}.m-mr-f6 {    margin-right: -6/@px-unit !important;}.m-mr-f7 {    margin-right: -7/@px-unit !important;}.m-mr-f10 {    margin-right: -10/@px-unit !important;}.m-mr-f14 {    margin-right: -14/@px-unit !important;}.m-mr-f15 {    margin-right: -15/@px-unit !important;}.m-mr-f16 {    margin-right: -16/@px-unit !important;}.m-mr-f17 {    margin-right: -17/@px-unit !important;}.m-mr-f18 {    margin-right: -18/@px-unit !important;}.m-mr-f23 {    margin-right: -23/@px-unit !important;}.m-mr-f25 {    margin-right: -25/@px-unit !important;}.m-mr-f27 {    margin-right: -27/@px-unit !important;}.m-ml-0 {    margin-left: 0 !important;}.m-ml-3 {    margin-left: 3/@px-unit !important;}.m-ml-5 {    margin-left: 5/@px-unit !important;}.m-ml-6 {    margin-left: 6/@px-unit !important;}.m-ml-7 {    margin-left: 7/@px-unit !important;}.m-ml-8 {    margin-left: 8/@px-unit !important;}.m-ml-9 {    margin-left: 9/@px-unit !important;}.m-ml-10 {    margin-left: 10/@px-unit !important;}.m-ml-12 {    margin-left: 12/@px-unit !important;}.m-ml-15 {    margin-left: 15/@px-unit !important;}.m-ml-16 {    margin-left: 16/@px-unit !important;}.m-ml-17 {    margin-left: 17/@px-unit !important;}.m-ml-18 {    margin-left: 18/@px-unit !important;}.m-ml-20 {    margin-left: 20/@px-unit !important;}.m-ml-23 {    margin-left: 23/@px-unit !important;}.m-ml-24 {    margin-left: 24/@px-unit !important;}.m-ml-25 {    margin-left: 25/@px-unit !important;}.m-ml-29 {    margin-left: 29/@px-unit !important;}.m-ml-30 {    margin-left: 30/@px-unit !important;}.m-ml-33 {    margin-left: 33/@px-unit !important;}.m-ml-35 {    margin-left: 35/@px-unit !important;}.m-ml-36 {    margin-left: 36/@px-unit !important;}.m-ml-37 {    margin-left: 37/@px-unit !important;}.m-ml-40 {    margin-left: 40/@px-unit !important;}.m-ml-42 {    margin-left: 42/@px-unit !important;}.m-ml-47 {    margin-left: 47/@px-unit !important;}.m-ml-48 {    margin-left: 48/@px-unit !important;}.m-ml-49 {    margin-left: 49/@px-unit !important;}.m-ml-50 {    margin-left: 50/@px-unit !important;}.m-ml-50-5 {    margin-left: 50.5/@px-unit !important;}.m-ml-52 {    margin-left: 52/@px-unit !important;}.m-ml-60 {    margin-left: 60/@px-unit !important;}.m-ml-65 {    margin-left: 65/@px-unit !important;}.m-ml-70 {    margin-left: 70/@px-unit !important;}.m-ml-72 {    margin-left: 72/@px-unit !important;}.m-ml-75 {    margin-left: 75/@px-unit !important;}.m-ml-90 {    margin-left: 90/@px-unit !important;}.m-ml-100 {    margin-left: 100/@px-unit !important;}.m-ml-110 {    margin-left: 110/@px-unit !important;}.m-ml-112 {    margin-left: 112/@px-unit !important;}.m-ml-127 {    margin-left: 127/@px-unit !important;}.m-ml-130 {    margin-left: 130/@px-unit !important;}.m-ml-150 {    margin-left: 150/@px-unit !important;}.m-ml-170 {    margin-left: 170/@px-unit !important;}.m-ml-200 {    margin-left: 200/@px-unit !important;}.m-ml-220 {    margin-left: 220/@px-unit !important;}.m-ml-480 {    margin-left: 480/@px-unit !important;}.m-ml-540 {    margin-left: 540/@px-unit !important;}.m-ml-586 {    margin-left: 586/@px-unit !important;}.m-ml-590 {    margin-left: 590/@px-unit !important;}.m-ml-620 {    margin-left: 620/@px-unit !important;}.m-ml-765 {    margin-left: 765/@px-unit !important;}.m-ml-800 {    margin-left: 800/@px-unit !important;}.m-ml-f1 {    margin-left: -1/@px-unit !important;}.m-ml-f3 {    margin-left: -3/@px-unit !important;}.m-ml-f4 {    margin-left: -4p/@px-unit !important;}.m-ml-f5 {    margin-left: -5p/@px-unit !important;}.m-ml-f6 {    margin-left: -6/@px-unit !important;}.m-ml-f8 {    margin-left: -8/@px-unit !important;}.m-ml-f9 {    margin-left: -9/@px-unit !important;}.m-ml-f10 {    margin-left: -10/@px-unit !important;}.m-ml-f13 {    margin-left: -13/@px-unit !important;}.m-ml-f14 {    margin-left: -14/@px-unit !important;}.m-ml-f15 {    margin-left: -15/@px-unit !important;}.m-ml-f16 {    margin-left: -16/@px-unit !important;}.m-ml-f17 {    margin-left: -17/@px-unit !important;}.m-ml-f18 {    margin-left: -18/@px-unit !important;}.m-ml-f20 {    margin-left: -20/@px-unit !important;}.m-ml-f24 {    margin-left: -24/@px-unit !important;}.m-ml-f30 {    margin-left: -30/@px-unit !important;}.m-ml-f31 {    margin-left: -31/@px-unit !important;}.m-ml-f32 {    margin-left: -32/@px-unit !important;}.m-ml-f33 {    margin-left: -33/@px-unit !important;}.m-ml-f60 {    margin-left: -60/@px-unit !important;}.m-mt-0 {    margin-top: 0 !important;}.m-mt-2 {    margin-top: 2/@px-unit !important;}.m-mt-3 {    margin-top: 3/@px-unit !important;}.m-mt-4 {    margin-top: 4/@px-unit !important;}.m-mt-5 {    margin-top: 5/@px-unit !important;}.m-mt-7 {    margin-top: 7/@px-unit !important;}.m-mt-8 {    margin-top: 8/@px-unit!important;}.m-mt-10 {    margin-top: 10/@px-unit !important;}.m-mt-11 {    margin-top: 11/@px-unit !important;}.m-mt-12 {    margin-top: 12/@px-unit !important;}.m-mt-15 {    margin-top: 15/@px-unit !important;}.m-mt-16 {    margin-top: 16/@px-unit !important;}.m-mt-18 {    margin-top: 18/@px-unit !important;}.m-mt-20 {    margin-top: 20/@px-unit !important;}.m-mt-30 {    margin-top: 30/@px-unit !important;}.m-mt-40 {    margin-top: 40/@px-unit !important;}.m-mt-42 {    margin-top: 42/@px-unit !important;}.m-mt-32 {    margin-top: 32/@px-unit !important;}.m-mt-35 {    margin-top: 35/@px-unit !important;}.m-mt-36 {    margin-top: 36/@px-unit !important;}.m-mt-44 {    margin-top: 44/@px-unit !important;}.m-mt-50 {    margin-top: 50/@px-unit !important;}.m-mt-60 {    margin-top: 60/@px-unit !important;}.m-mt-70 {    margin-top: 70/@px-unit !important;}.m-mt-72 {    margin-top: 72/@px-unit !important;}.m-mt-100 {    margin-top: 100/@px-unit !important;}.m-mt-120 {    margin-top: 120/@px-unit !important;}.m-mt-180 {    margin-top: 180/@px-unit !important;}.m-mt-210 {    margin-top: 210/@px-unit !important;}.m-mt-f2 {    margin-top: -2/@px-unit !important;}.m-mt-f3 {    margin-top: -3/@px-unit !important;}.m-mt-f4 {    margin-top: -4/@px-unit !important;}.m-mt-f5 {    margin-top: -5/@px-unit !important;}.m-mt-f6 {    margin-top: -5/@px-unit !important;}.m-mt-f8 {    margin-top: -8/@px-unit !important;}.m-mt-f9 {    margin-top: -9/@px-unit !important;}.m-mt-f10 {    margin-top: -10/@px-unit !important;}.m-mt-f12 {    margin-top: -12/@px-unit !important;}.m-mt-f15 {    margin-top: -15/@px-unit !important;}.m-mt-f20 {    margin-top: -20/@px-unit !important;}.m-mt-f32 {    margin-top: -32/@px-unit !important;}.m-mt-f40 {    margin-top: -40/@px-unit !important;}.m-mb-0 {    margin-bottom: 0 !important;}.m-mb-5 {    margin-bottom: 5/@px-unit !important;}.m-mb-8 {    margin-bottom: 8/@px-unit !important;}.m-mb-10 {    margin-bottom: 10/@px-unit !important;}.m-mb-12 {    margin-bottom: 12/@px-unit !important;}.m-mb-15 {    margin-bottom: 15/@px-unit !important;}.m-mb-16 {    margin-bottom: 16/@px-unit !important;}.m-mb-14 {    margin-bottom: 14/@px-unit !important;}.m-mb-20 {    margin-bottom: 20/@px-unit !important;}.m-mb-30 {    margin-bottom: 30/@px-unit !important;}.m-mb-40 {    margin-bottom: 40/@px-unit !important;}.m-mb-2 {    margin-bottom: 24/@px-unit !important;}.m-mb-30 {    margin-bottom: 30/@px-unit !important;}.m-mb-80 {    margin-bottom: 80/@px-unit !important;}.m-mb-130 {    margin-bottom: 130/@px-unit !important;}
@current: #009cff; @btnNormalColorNo1: #1890ff; @btnHoverColorNo2: #40a9ff; @btnPressedColorNo3: #096dd9; @titleColorNo4: #272727; @textColorNo5: #272727; @formContentColorNo6: #565656; @disableColorNo7: #8f8f8f; @listBorderColorNo8: #e8e8e8; @dividerColorNo9: #e8e8e8; @inputBorderColorNo10: #d9d9d9; @disableInputBgColorNo11: #f5f5f5; @firstNavBgColorNo12: #001529; @secondNavBgColorNo13: #ffffff; @secondNavHoverColorNo14: #e6f7ff; @contentBgColorNo15: #ffffff; @bodyBgColorNo16: #f0f2f5; @homePageNo1: #ffffff; @homePageNo2: #f0f2f5; @errorColorNo17: #f5222d; @warnColorNo18: #fcac15; @successColorNo19: #52c41a; @linkColorNo20: #1890ff; @border-color:#e8e8e8;@export-color:#1890ff;@error-color: #f5222d; @iconDisabledColor: #686c72; @color-border: @listBorderColorNo8; @border-normal: 1px solid @color-border; @font-size-base: 12px;@table-padding-vertical: 5px;@table-padding-horizontal: 5px;@text-color: @textColorNo5;@primary-color: @btnNormalColorNo1;@topMenuTabActiveColor: #ffffff; @topMenuTabColor: #a6adb4; @tabArrowColor: @contentBgColorNo15; @tabArrowHoverColor: @btnNormalColorNo1; @tabCloseColor: @contentBgColorNo15; @tabBackGroundColor: @firstNavBgColorNo12; @tabMenuTabHoverColor: #ffffff; @tabDividerColor: rgba(255, 255, 255, 0.2); @MenuViewPageSwitch: #afc6e1; @MenuViewActivePageSwitch: @linkColorNo20; @MenuViewItemLineColor: #81b6fc; @MenuViewBackGroundColor: @homePageNo1; @MenuViewItemMessageColor: @disableColorNo7; @MenuViewItemHoverColor: #ecf4ff; @MenuViewCarouselColor: #7db1ec; @sideMenuBackGroundColor: @secondNavBgColorNo13; @sideMenuSelectedColor: #ecf4ff; @loginForgetPasswordHoverColor: #ffffff; @loginIconColor: @btnHoverColorNo2; @font-size-normal: 12rem; @skin-black: #001529;@skin-blue: #1890ff;@base-rem-size: 14px;html,body {    font-size: @base-rem-size;}@media screen and (min-device-width: 3000px) {    html,    body {        font-size: 2 * @base-rem-size;    }}@px-unit: 14rem;@tagOnlinebg: rgba(39, 208, 90, 0.1);@tagOnlineborder: rgba(39, 208, 90, 0.35);@tagOnlineColor: #27d05a;@tagOfflinebg: rgba(197, 205, 214, 0.2);@tagOfflineborder: #c5cdd6;@tagOfflineColor: #4e5c6b;@tagSwitchbg: rgba(28, 121, 244, 0.1);@tagSwitchColor: #1c79f4;@tagSwitchborder: rgba(28, 121, 244, 0.35);@tagSwitchAlarmbg: rgba(233, 70, 58, 0.1);@tagSwitchAlarmColor: #e9463a;@tagSwitchAlarmborder: rgba(233, 70, 58, 0.35);@tagSwitchWarnbg: rgba(248, 120, 45, 0.1);@tagSwitchWarnColor: #f8782d;@tagSwitchWarnborder: rgba(248, 120, 45, 0.35);
.m-width-f10 {    width: calc(~"100% - 10rem") !important;}.m-width-auto {    width: auto !important;}.m-width-15 {    width: 15/@px-unit !important;}.m-width-20 {    width: 20/@px-unit !important;}.m-width-24 {    width: 24/@px-unit !important;}.m-width-25 {    width: 25/@px-unit !important;}.m-width-30 {    width: 30/@px-unit !important;}.m-width-40 {    width: 40/@px-unit !important;}.m-width-45 {    width: 45/@px-unit !important;}.m-width-50 {    width: 50/@px-unit !important;}.m-width-54 {    width: 54/@px-unit !important;}.m-width-60 {    width: 60/@px-unit !important;}.m-width-65 {    width: 65/@px-unit !important;}.m-width-84 {    width: 84/@px-unit !important;}.m-width-70 {    width: 70/@px-unit !important;}.m-width-52 {    width: 52/@px-unit !important;}.m-width-80 {    width: 80/@px-unit !important;}.m-width-85 {    width: 85/@px-unit !important;}.m-width-90 {    width: 90/@px-unit !important;}.m-width-95 {    width: 95/@px-unit !important;}.m-width-100 {    width: 100/@px-unit !important;}.m-width-105 {    width: 110/@px-unit !important;}.m-width-110 {    width: 110/@px-unit !important;}.m-width-118 {    width: 118/@px-unit !important;}.m-width-120 {    width: 120/@px-unit !important;}.m-width-124 {    width: 124/@px-unit !important;}.m-width-126 {    width: 126/@px-unit !important;}.m-width-130 {    width: 130/@px-unit !important;}.m-width-132 {    width: 132/@px-unit !important;}.m-width-138 {    width: 138/@px-unit !important;}.m-width-140 {    width: 140/@px-unit !important;}.m-width-144 {    width: 144/@px-unit !important;}.m-width-148 {    width: 148/@px-unit !important;}.m-width-150 {    width: 150/@px-unit !important;}.m-width-156 {    width: 156/@px-unit !important;}.m-width-160 {    width: 160/@px-unit !important;}.m-width-168 {    width: 168/@px-unit !important;}.m-width-170 {    width: 170/@px-unit !important;}.m-width-175 {    width: 175/@px-unit !important;}.m-width-180 {    width: 180/@px-unit !important;}.m-width-184 {    width: 184/@px-unit !important;}.m-width-190 {    width: 190/@px-unit !important;}.m-width-200 {    width: 200/@px-unit !important;}.m-width-213 {    width: 213/@px-unit !important;}.m-width-215 {    width: 215/@px-unit !important}.m-width-220 {    width: 220/@px-unit !important;}.m-width-224 {    width: 224/@px-unit !important;}.m-width-230 {    width: 230/@px-unit !important;}.m-width-240 {    width: 240/@px-unit !important;}.m-width-250 {    width: 250/@px-unit !important;}.m-width-260 {    width: 260/@px-unit !important;}.m-width-276 {    width: 276/@px-unit !important;}.m-width-280 {    width: 280/@px-unit !important;}.m-width-300 {    width: 300/@px-unit !important;}.m-width-310 {    width: 310/@px-unit !important;}.m-width-320 {    width: 320/@px-unit !important;}.m-width-330 {    width: 330/@px-unit !important;}.m-width-360 {    width: 360/@px-unit !important;}.m-width-372 {    width: 372/@px-unit !important;}.m-width-480 {    width: 480/@px-unit !important;}.m-width-510 {    width: 510/@px-unit !important;}.m-width-545 {    width: 545/@px-unit !important;}.m-width-600 {    width: 600/@px-unit !important;}.m-width-648 {    width: 648/@px-unit !important;}.m-width-910 {    width: 910/@px-unit !important;}.m-width-3p {    width: 3% !important;}.m-width-9p {    width: 9% !important;}.m-width-10p {    width: 10% !important;}.m-width-12p {    width: 12% !important;}.m-width-20p {    width: 20% !important;}.m-width-25p {    width: 25% !important;}.m-width-30p {    width: 30% !important;}.m-width-33p {    width: 33% !important;}.m-width-40p {    width: 40% !important;}.m-width-50p {    width: 50% !important;}.m-width-55p {    width: 55% !important;}.m-width-58p {    width: 58% !important;}.m-width-60p {    width: 60% !important;}.m-width-65p {    width: 65% !important;}.m-width-70p {    width: 70% !important;}.m-width-80p {    width: 80% !important;}.m-width-100p {    width: 100% !important;}.m-width-200p {    width: 200% !important;}.m-max-w-480 {    max-width: 480/@px-unit !important;}.m-minw-50 {    min-width: 50/@px-unit !important;}.m-minw-70 {    min-width: 70/@px-unit !important;}.m-minw-90 {    min-width: 90/@px-unit !important;}.m-height-0 {    height: 0 !important;}.m-height-15 {    height: 15/@px-unit !important;}.m-height-24 {    height: 24/@px-unit !important;}.m-height-25 {    height: 25/@px-unit !important;}.m-height-26 {    height: 26/@px-unit !important;}.m-height-28 {    height: 28/@px-unit !important;}.m-height-30 {    height: 30/@px-unit !important;}.m-height-36 {    height: 36/@px-unit !important;}.m-height-40 {    height: 40/@px-unit !important;}.m-height-50 {    height: 50/@px-unit !important;}.m-height-60 {    height: 60/@px-unit !important;}.m-height-90 {    height: 90/@px-unit !important;}.m-height-100 {    height: 100/@px-unit !important;}.m-height-120 {    height: 120/@px-unit !important;}.m-height-150 {    height: 150/@px-unit !important;}.m-height-200 {    height: 200/@px-unit !important;}.m-height-201 {    height: 201/@px-unit !important;}.m-height-238 {    height: 238/@px-unit !important;}.m-height-276 {    height: 276/@px-unit !important;}.m-height-288 {    height: 288/@px-unit !important;}.m-height-300 {    height: 300/@px-unit !important;}.m-height-310 {    height: 310/@px-unit !important;}.m-height-350 {    height: 350/@px-unit !important;}.m-height-360 {    height: 360/@px-unit !important;}.m-height-380 {    height: 380/@px-unit !important;}.m-height-400 {    height: 400/@px-unit !important;}.m-height-432 {    height: 432/@px-unit !important;}.m-height-484 {    height: 484/@px-unit !important;}.m-height-648 {    height: 648/@px-unit !important;}.m-height-100p {    height: 100%;}
.m-p-0 {    padding: 0 !important;}.m-p-5 {    padding: 5/@px-unit !important;}.m-p-12 {    padding: 12/@px-unit !important;}.m-p-15 {    padding: 15/@px-unit !important;}.m-pl-0 {    padding-left: 0 !important;}.m-pl-5 {    padding-left: 5/@px-unit !important;}.m-pl-6 {    padding-left: 6/@px-unit !important;}.m-pl-7 {    padding-left: 7/@px-unit !important;}.m-pl-8 {    padding-left: 8/@px-unit !important;}.m-pl-10 {    padding-left: 10/@px-unit !important;}.m-pl-12 {    padding-left: 12/@px-unit !important;}.m-pl-13 {    padding-left: 13/@px-unit !important;}.m-pl-15 {    padding-left: 15/@px-unit !important;}.m-pl-17 {    padding-left: 17/@px-unit !important;}.m-pl-20 {    padding-left: 20/@px-unit !important;}.m-pl-24 {    padding-left: 24/@px-unit !important;}.m-pl-25 {    padding-left: 25/@px-unit !important;}.m-pl-30 {    padding-left: 30/@px-unit !important;}.m-pl-35 {    padding-left: 35/@px-unit !important;}.m-pl-37 {    padding-left: 37/@px-unit !important;}.m-pl-40 {    padding-left: 40/@px-unit !important;}.m-pl-43 {    padding-left: 43/@px-unit !important;}.m-pl-45 {    padding-left: 45/@px-unit !important;}.m-pl-50 {    padding-left: 50/@px-unit !important;}.m-pl-60 {    padding-left: 60/@px-unit !important;}.m-pl-70 {    padding-left: 70/@px-unit !important;}.m-pr-0 {    padding-right: 0 !important;}.m-pr-5 {    padding-right: 5/@px-unit !important;}.m-pr-6 {    padding-right: 6/@px-unit !important;}.m-pr-8 {    padding-right: 8/@px-unit !important;}.m-pr-10 {    padding-right: 10/@px-unit !important;}.m-pr-12 {    padding-right: 12/@px-unit !important;}.m-pr-15 {    padding-right: 15/@px-unit !important;}.m-pr-20 {    padding-right: 20/@px-unit !important;}.m-pr-30 {    padding-right: 30/@px-unit !important;}.m-pr-40 {    padding-right: 40/@px-unit !important;}.m-pr-84 {    padding-right: 84/@px-unit !important;}.m-pr-114 {    padding-right: 114/@px-unit !important;}.m-pt-0 {    padding-top: 0;}.m-pt-12 {    padding-top: 12/@px-unit !important;}.m-pt-24 {    padding-top: 24/@px-unit !important;}.m-pt-1 {    padding-top: 1/@px-unit !important;}.m-pt-3 {    padding-top: 3/@px-unit !important;}.m-pt-5 {    padding-top: 5/@px-unit !important;}.m-pt-8 {    padding-top: 8/@px-unit !important;}.m-pt-10 {    padding-top: 10/@px-unit !important;}.m-pt-15 {    padding-top: 15/@px-unit !important;}.m-pt-20 {    padding-top: 20/@px-unit !important;}.m-pt-35 {    padding-top: 35/@px-unit !important;}.m-pt-48 {    padding-top: 48/@px-unit !important;}.m-pb-0 {    padding-bottom: 0 !important;}.m-pb-2 {    padding-bottom: 2/@px-unit !important;}.m-pb-8 {    padding-bottom: 8/@px-unit !important;}.m-pb-10 {    padding-bottom: 10/@px-unit !important;}.m-pb-48 {    padding-bottom: 48/@px-unit !important;}.m-pb-108 {    padding-bottom: 108/@px-unit !important;}
.m-pos-abs {    position: absolute !important;}.m-pos-static {    position: static !important;}.m-pos-r {    position: relative !important;}.m-top-0 {    top: 0 !important;}.m-top-10 {    top: 10/@px-unit !important;}.m-top-72 {    top: 72/@px-unit !important;}.m-top-90 {    top: 90/@px-unit !important;}.m-top-130 {    top: 130/@px-unit !important;}.m-bottom-0 {    bottom: 0 !important;}.m-bottom-2-4 {    bottom: 2.4/@px-unit !important;}.m-bottom-3 {    bottom: 3/@px-unit !important;}.m-left-0 {    left: 0 !important;}.m-left-10p {    left: 10% !important;}.m-right-16 {    right: 16/@px-unit !important;}.m-right-84 {    right: 84/@px-unit !important;}.m-right-124 {    right: 124/@px-unit !important;}.m-topmax {    z-index: 10004 !important;}.m-float-none {    float: none !important;}.m-float-left {    float: left;}.m-float-right {    float: right !important;}.m-clear-both {    clear: both;}.m-clearfix:after {    content: '\20';    display: block;    height: 0;    clear: both;}.m-hor-center {    position: absolute;    left: 50%;    transform: translate3d(-50%, 0, 0);    -webkit-transform: translate3d(-50%, 0, 0);}.m-ver-center {    position: absolute;    top: 50%;    transform: translate3d(0, -50%, 0);    -webkit-transform: translate3d(0, -50%, 0);}.m-hor-ver-center {    position: absolute;    left: 50%;    top: 50%;    transform: translate3d(-50%, -50%, 0);    -webkit-transform: translate3d(-50%, -50%, 0);}.m-flex-ver-hor-center {    display: flex;    align-items: center;    justify-content: center;}.m-display-flex {    display: flex;}.m-flex-end {    display: flex;    justify-content: flex-end;}
.m-fw-normal {    font-weight: normal !important;}.m-fw-bold {    font-weight: bold !important;}.m-fs-small {    font-size: small;}.m-fs-15 {    font-size: 15/@px-unit;}.m-fs-18 {    font-size: 18/@px-unit;}.m-fs-24 {    font-size: 24/@px-unit;}.m-fs-43 {    font-size: 43/@px-unit;}.m-lh-24 {    line-height: 24/@px-unit;}.m-lh-28 {    line-height: 28/@px-unit;}.m-lh-30 {    line-height: 30/@px-unit;}.m-lh-32 {    line-height: 32/@px-unit;}.m-lh-35 {    line-height: 35/@px-unit;}.m-lh-40 {    line-height: 40/@px-unit !important;}.m-cursor-default {    cursor: default !important;}.m-cursor-pointer {    cursor: pointer !important;}.m-cursor-crosshair {    cursor: crosshair !important;}.m-cursor-move {    cursor: move !important;}.m-cursor-text {    cursor: text !important;}.m-cursor-wait {    cursor: wait !important;}.m-cursor-help {    cursor: help !important;}.m-cursor-notAllowed {    cursor: not-allowed !important;}.m-vertical-top {    vertical-align: top !important;}.m-vertical-middle {    vertical-align: middle !important;}.m-vertical-bottom {    vertical-align: bottom !important;}.m-vertical-text-bottom {    vertical-align: text-bottom !important;}.m-text-center {    text-align: center;}.m-text-left {    text-align: left;}.m-text-right {    text-align: right;}.m-inline-block {    display: inline-block;}.m-visibility-hidden {    visibility: hidden !important;}.m-display-hidden {    display: none !important;}.m-display-show {    display: '' !important;}.m-overflow-hidden {    overflow: hidden !important;}.m-overflow-initial {    overflow: initial !important;}.m-opacity-0 {    opacity: 0;}.m-ws-nowrap {    white-space: nowrap;}.m-text-ellipsis {    overflow: hidden;    text-overflow: ellipsis;    white-space: nowrap;    vertical-align: middle;}




















@base-rem-size-sm: 12px; @base-rem-size: 14px; @px-unit: 14rem; @current: @--primary-6; @pageTextN: .color_N(@--bg)[]; @SddFontNormalColor:@pageTextN;@SddNumberLimitRangeColor:@pageTextN;@pageTextA: .color_A(@--bg)[]; @pageTextD: .color_D(@--bg)[]; @successColor: @--success-6; @warningColor: @--warning-6; @anchorTextN: @--primary-6; @anchorTextA: @--primary-5; @mainPageSvgN: @pageTextN; @pageBorderN: @--split; @pageBorderD: @pageBorderN;@dropMenuBorder: @--split; @dividerColor: @--split; @red: #ff0000;@pdEyeIconA: @current; @iconColorN: @pageTextN; @iconColorD: .color_D(@--bg)[]; @iconColorA: @--primary-5; @homeTaskIconColorA: @--primary-5; @iconLinearStartColorN: #ffffff; @iconBgColor: #ffffff; @iconLinearStopColorN: @pageTextN; @iconLinearStartColorA: @--primary-6; @iconLinearStopColorA: @current; @iconActiveWifi: #0f0; @iconNolmal: #468429; @iconFail: #cd8b0f; @iconHover: @--warning-5; @hideIconNormalColor: @buttonNormalBgN; @pageBodyBg: @--bg; @theme: 'deep'; @themeMainViewurlproject:'resource';@themeMainImage:'login_bg_@{theme}'; @sliderBgN: @--block; @sliderBgA: @--block; @sliderTrackN: @current; @sliderRailA: @--primary-5; @sliderTrackA: @--primary-5; @formInputBgN: @--component-bg;@formInputBgD: @--component-bg-disable;@formInputBgA: @--primary-5;@formInputBoderN: @pageBorderN;@formInputBoderD: @pageBorderD;@formInputBorderA: @--primary-5;@formInputTextN: .color_A(@--bg)[];@formInputTextD: @pageTextD;@formInputSvgN: .color_N(@formInputBgN)[];@formInputSvgA: @--primary-5;@formInputSvgD: @pageTextD;@numberInPutHandleBgA: @pageBodyBg; @numberInPutHandleBoderA: @formInputBoderN;@formInputDropDownBgN: @formInputBgN; @formInputDropDownTextN: @pageTextN; @formInputDropDownBgA: transparent; @formMuliInputBgA:@formInputDropDownBgA;@formInputDropDownBgSel:@--option-bg-select;@formInputDropDownTextSelectN: .color_A(@formInputDropDownBgSel)[]; @formInputSwitchBgN:@--font-s;@formRadioBorderN: .lumaColorSelect(@pageBodyBg, @--font-r, @--font-r-l)[]; @formCheckboxBorderD: @--placeholder; @formCheckboxBorderN: .lumaColorSelect(@pageBodyBg, @--font-r, @--font-r-l)[]; @formCheckboxBorderA: @formInputBorderA; @formCheckboxInnerA: @formInputBorderA; @formCheckboxBgA:@formInputBgN;@tableHeadTextN: .color_A(@--bg)[]; @tableBgN: @formInputDropDownBgN; @tableTextN: @pageTextN; @tableTextA: @tableHeadTextN; @tableOddBgN: @--bg; @tableEvenBgN: @--component-bg-disable; @tableBgA: @--option-bg-select; @tableBgD: @tableOddBgN; @tableBorderN: @pageBorderN; @paginationTextN: @pageTextN;@paginationTextA: @--primary-5;@paginationInputTextN: @pageTextN;@paginationBg: @pageBodyBg;@paginationBorderA: @--primary-5;@progressBg: @--block;@progressText: @pageTextN;@progressBgA:@--primary-6;@buttonNormalBgN: @--component-bg;@buttonNormalBgD: @buttonNormalBgN;@buttonNormalTextN: .color_N(@buttonNormalBgD)[];@buttonNormalTextA: .color_A(@buttonNormalBgN)[];@buttonNormalTextD: .color_D(@buttonNormalBgN)[];@buttonNormalBorderN: @pageBorderN;@buttonNormalBorderD: @buttonNormalTextD;@buttonActiveBgN: @--primary-6;@buttonActiveBgD: @buttonNormalBgD;@buttonActiveBgA: @--primary-5;@buttonActiveTextN: .color_A(@buttonActiveBgN)[];@buttonActiveTextD: @buttonNormalTextD;@buttonActiveBorderN: @buttonActiveBgN;@buttonActiveBorderD: @buttonActiveTextD;@btnHoverColor: @buttonNormalTextA; @btnHoverBg: @buttonNormalBgN; @btnHoverBoderColor: @buttonNormalBorderN; @btnPrimaryActiveBgD: @buttonActiveBgD; @buttonTestBgN: @buttonNormalBgN;@buttonTestBgH: @buttonTestBgN;@buttonTestBgA: @--success-7;@buttonTestBgD: @buttonNormalBgN;@buttonTestTextN: @--success-6;@buttonTestTextH: @--success-6;@buttonTestTextA: .color_A(@buttonTestBgA)[];@buttonTestTextD: .color_D(@buttonNormalBgN)[];@buttonTestBorderN: @--success-6; @buttonTestBorderH: @--success-5;@buttonTestBorderA: @buttonTestBgA;@buttonTestBorderD: @buttonNormalTextD;@buttonDangerBgN: @buttonNormalBgN;@buttonDangerBgH: @buttonDangerBgN;@buttonDangerBgA: @errorColor;@buttonDangerBgD: @buttonNormalBgN;@buttonDangerTextN: @errorColor;@buttonDangerTextH: @--error-6;@buttonDangerTextA: .color_A(@buttonDangerBgA)[];@buttonDangerTextD: @buttonNormalTextD;@buttonDangerBorderN: @errorColor;@buttonDangerBorderH: @--error-5;@buttonDangerBorderA: @buttonDangerBgA;@buttonDangerBorderD: @buttonNormalBorderD;@tabBgN: @--title;@pagetabBgN: @tabBgN;@tabBgA: @--primary-6;@tabTextN: .color_N(@--title)[];@tabTextA: .color_A(@--primary-6)[];@tabBorder: @--split;@topTabBgN: @--block;@topTabBgA: @--navTitle-bg; @topTabTextA: .color_A(@topTabBgA)[];@topTabTextN: .color_A(@topTabBgN)[];@streamTopTabBgA: @topTabBgA; @modalBg: @--bg;@modalBorder: @--split;@modalContentText: @pageTextN;@modalTitleBg: @--navTitle-bg;@modalTitleText: .color_A(@modalTitleBg)[];;@modalTitleBorder: @modalBorder;@modalFooterBg: @modalBg;@modalFooterBorder: @dividerColor;@QRCodeBg: #fff;@popover_TextN: .color_N(@popover_BgN)[];@popover_BgN: @--bg-card;@popover_BorderN: @dropMenuBorder;@passwordCheckBg: @--block;@errorColor: #f5222d; @warnColor: @--warning-6; @successColor: #52c41a; @subtitleColor: .color_A(@pageBodyBg)[]; @ocxBg: #000000; @ocxHeaderBg: #414141; @ocxBorder: @--split; @ocxDownloadBar:@--block;@loginForgetPwdTextN: .color_S(@pageBodyBg)[]; @loginForgetPwdTextA: @--primary-5; @loginIconSvg: @current; @loginFormInputBg:@formInputBgN;@loginFormInputBorder:@formInputBoderN;@loginFormInputText:@formInputTextN;@loginPrimaryBtnBg: @buttonActiveBgN; @loginPrimaryBtnBorder:@buttonActiveBorderN;@loginActiveBtnBg:@--primary-5; @loginActiveBtnBorder:@--primary-5; @scrollbarHeight: 6 / @px-unit;@navBg: @--title; @navDivider: @--split; @navMenuTextN: .color_N(@navBg)[]; @navMenuTextA: @current; @navMenuIconSvgN: .color_N(@topTabBgN)[]; @navMenuIconSvgA: @--primary-5; @navMenuBorderN: @dividerColor; @navMenuHeight: 38 / @px-unit; @navMenuAddScrollHeight: @navMenuHeight + @scrollbarHeight; @navMenuLineHeight: calc(@navMenuHeight - 1px); @navMenuFontN:14px;@navDropdownMenuBg: @--component-bg; @navDropdownMenuTextN: @pageTextN; @navDropdownMenuTextA: @current; @navDropdownMenuBgA: inherit; @navDropdownMenusvgA:@current;@MenuViewBg: transparent; @MenuViewBgA: transparent; @MenuViewItemTitleTextN: @pageTextN; @MenuViewItemTitleTextA: .color_A(@--bg)[]; @MenuViewItemContentTextN: .color_S(@--bg)[]; @MenuViewItemContentTextA: .color_A(@--bg)[]; @MenuViewItemShadowA: @--primary-5; @MenuViewPageSwiperSvgN: @--primary-6; @MenuViewPageSwiperSvgD: .color_D(@--bg)[]; @MenuViewPageSwitchSvgN: .color_D(@--bg)[]; @MenuViewPageSwitchSvgA: @--primary-6; @MenuViewDivideLine: @dividerColor; @preview_Sider_Bg: @--menu-bg; @preview_Left_Bg: @preview_Sider_Bg; @preview_Right_Bg: @preview_Sider_Bg; @ocx_Border: @--split; @preview_ChnlTextN: .color_N(@preview_Left_Bg)[]; @preview_windowCard_Bg: rgb(28, 32, 36); @mutilPreview_Bg: @popover_BgN; @mutilPreview_border: @popover_BorderN; @talkAndSound_actBorder: @errorColor; @talkAndSound_defBorder: @buttonNormalBorderN; @talkAndSound_actBg: @errorColor; @talkAndSound_defBg: @buttonNormalBgN; @talkAndSound_actText: @pageTextA; @talkAndSound_defText: @pageTextN; @urgentRecord_actBorder: @errorColor; @urgentRecord_defBorder: @buttonNormalBorderN; @urgentRecord_actBg: @errorColor; @urgentRecord_defBg: @buttonNormalBgN; @urgentRecord_actText: @pageTextA; @urgentRecord_defText: @pageTextN; @ptz_btnBorder: @buttonNormalBorderN; @ptz_textColor: @buttonNormalTextA; @ptz_btnBg: @buttonNormalBgN; @fastPreview_btnActBg: @--primary-5; @fastPreview_border: @--component-border; @fastPreview_hoverText: @pageTextA; @fisheye_title: @--navTitle-bg; @fisheye_iconHover: @--primary-5; @fisheye_actColor: @current; @alramOut_actText: @pageTextA; @alramOut_actBorder: @current; @preview_ChnlBgA: @--bg; @preview_center_plugin_Bg: #000000; @preview_center_bottom_Bg: @--toolbar-bg; @preview_center_popover_ColorA: @--primary-5; @preview_center_separator_ColorN: @pageTextD; @preview_right_tabTitle_Bg: @--navTitle-bg; @preview_right_ptzStep_Bg: @--bg; @preview_right_ptzStepMask_ColorN: @pageTextN; @preview_right_ptzZoom_Bg: @--bg; @preview_right_ptzZoom_border_ColorN: @--split; @preview_right_ptz_borderBottom_ColorN: @--split; @preview_right_ptzBg:@--bg;@aiPanel_title_bg_color: @preview_right_tabTitle_Bg; @aiPanel_box_color: @--navTitle-bg; @aiPanel_box_bottom-color: @--navTitle-bg; @aiPanel_box_bordere_color: transparent; @aiPanel_info_bg_color: @--menu-bg; @aiPanel_details_bottom_bg: @--menu-bg; @aiPanel_cardBg:@--bg-card; @aiPanel_bg_color: @preview_Right_Bg; @aiSetPanel_bottom_unSelectBg: @--component-bg-disable;@winpreview_footer_Bg: @preview_center_bottom_Bg; @playback_Right_Bg: @preview_Right_Bg; @playback_Right_iConBtn_bg:@playback_Right_Bg; @setUpBodyBg: @pageBodyBg; @setUpContentBg: @setUpBodyBg; @setUpContentBorder: @dividerColor; @setUpDivider: @dividerColor; @CalibrateSub1: #28DA83; @CalibrateSub2: aqua; @CalibrateSub3: #F2913E; @SideMenuBg: @--menu-bg; @SideMenuItemBg: @--bg; @SideMenuBorder: @dividerColor; @SideMenuTextN: .color_N(@SideMenuBg)[]; @SideMenuTextA: .color_A(@SideMenuBg)[]; @sideMenuItemTextN: .color_N(@SideMenuItemBg)[];@sideMenuItemTextA: .color_A(@SideMenuItemBg)[];@SideMenuArrowSvgA: .color_A(@SideMenuBg)[]; @MenuViewSubItemSvgA: .color_A(@SideMenuBg)[]; @SideMenuItemSelectSvgA: @current; @SideMenuItemSelectTextA:@current; @SideMenuSubItemSelectTextA:@current; @SideMenuSubItemSelectSvgA:.color_A(@SideMenuBg)[]; @BottomBarBg: @formInputDropDownBgN; @BottomBarBorder: @dividerColor; @successIcon: #20d878;@errorIcon: #ff514b;@schedulePlanEvenBg: @--block; @schedulePlanOddBg: @--bg; @SpinBg: @--bg;@SpinTextBg: @--block;@SpinTextA: .color_N(@SpinTextBg)[];@SpinDotColor: @--primary-6; @timePlanBorderN: .color_S(@pageBodyBg)[];@planGeneral:.subColor(@general)[@deep];@planDetect: .subColor(@detect)[@deep];@planAlarm: .subColor(@alarm)[@deep];@planDetectalarm: .subColor(@detectalarm)[@deep];@planIvs: .subColor(@ivs)[@deep]; @planPos: .subColor(@pos)[@deep];@planSmd:.subColor(@smd)[@deep]; @planFaceRecognition: .subColor(@faceRecognition)[@deep]; @textColorNo5: @pageTextN; @font-size-base: 14px;@font-huge: 20px; @PickerHeaderBg: @--navTitle-bg; @PickerHeaderTextN: .color_N(@PickerHeaderBg)[]; @PickerBodyBg: @--component-bg; @PickerBodyTextN: .color_N(@--component-bg)[]; @PickerBodyTextA: .color_A(@--component-bg)[]; @PickerHeaderButtonN: @PickerHeaderTextN; @pickerBorder: @--component-border; @pickerCellInRangeBg: @formInputDropDownBgA; @ai_scene_bg: @--menu-bg; @ai_search_bg: @pageBodyBg; @ai_DataItem_bd: @--split; @ai_DataItem_bg: @aiPanel_cardBg; @ai_progress_default: @progressBg; @ai_progress_red: #c45453; @ai_progress_orange: #d08d42; @ai_progress_blue: #3d88bd; @ai_labelCheck_bg: @aiPanel_box_bottom-color; @ai_rightPanel_bg: @--menu-bg; @vehicle_whiteplate_bgColor: #296331; @vehicle_whiteplate_borderColor: #1f812b; @vehicle_blackplate_bgColor: #940000; @vehicle_blackplate_borderColor: #e20607; @com_facesmallpics_border: @pageBorderN; @com_detectsmallPic_bd: @pageBorderN; @com_detectsmallPic_select_bd: @current; @com_faceRegister_edit_bg: #000000; @files_upload_box_bg: @--menu-bg;; @files_upload_box_border_color: @--split; @achor_infoColor:#ff0000;@achor_infoHoverColor:#00ff00;@aiDisplayNumCheck:#39d67f;@scroll_bar_base:.lumaColorSelect(@pageBodyBg,@scroll-bar,@scroll-bar-l)[];@page_scroll_barH:fadeout(@scroll_bar_base, 50%);@page_scroll_bar:fadeout(@scroll_bar_base, 75%);@page_scroll_track:@pageTextD;@posCheckbox:{            white: #ffffff, #A6A6A6, #737373;     black: #121212, #737373, #A6A6A6;     red: #fb549c;    orange: #f35900;     yellow: #fdfc00;     green: #1ee17f;     dodgerblue: #009cfd;     pos: #5772ff;     purple: #c46cf1; };@general: #39d67f;@alarm: #ff4f4f;@detect: #e9d760;@detectalarm: #f1910a;@ivs: #39adf6;@jpg: #3ae8f8;@pos: #788ae3;@card: #7debf7;@smd:#0ebba9;@faceRecognition:#ff4bdb;@whiteMode: #FFFF00;@recordBox:{    general:@general;    alarm:@alarm;    detect:@detect;    detectalarm:@detectalarm;    ivs:@ivs;    jpg:@jpg;    pos:@pos;    card:@card;}@iconListColorN: #1890FF;  @safeSecurityStatusColor:#40a9ff;
@--primary-6:#009CFF; 
@--primary-5:#33B0FF; 
@--primary-7:#007DCC; 



@--toolbar-bg:#4C5054; 








@--bg:#2A2E33; 






@--component-bg:#2a2e33; 
@--component-border: #606366; 

@--component-bg-disable:#32373C; 




@--option-bg-select: #55585D; 




@--menu-bg:#393c41;






@--navTitle-bg:#4c4f54; 


















@--split: #606366;


@--bg-card: #56585B;



@--block: #17181C;





@--title:#313439; 

@--font-l:#FFFFFF; 
@--font-r: #a6aab2; 
@--placeholder: #5d6263;
@--font-s: #7c8284; 

@--font-l-l:#000000; 
@--font-r-l: #262626; 
@--placeholder-l: #BFBFBF;
@--font-s-l: #8C8C8C; 


@--warning-6:#ffd304;
@--warning-border: #B59914; 
@--warning-bg: #44422D; 
@--warning-5:#ffdc38; 
@--warning-7:#cca903; 


@--success-6:#29d67d;
@--success-border: #299B64;
@--success-bg: #2A423C;
@--success-5:#4bd690; 
@--success-7:#21ab65; 


@--error-6:	#ff4f4f;
@--error-border: #B54345;
@--error-bg: #443136;
@--error-5: #ff7272; 
@--error-7: #cc3f3f; 


@scroll-bar:rgb(255, 255, 255);
@scroll-bar-l:rgb(0,0,0);
.svgFont(@fontSize:30) {    font-size: if((@fontSize = 0), inherit, @fontSize / @px-unit);}.svgOut    (@normalColor:@iconColorN , @lineStart:@iconLinearStartColorN , @lineStop:@iconLinearStopColorN) {    &:not(.disabled_icons) {        svg {            & + {                path:first-child {                    fill: if((@normalColor = 0), @iconColorN, @normalColor);                 }            }                        & + {                linearGradient {                    stop:first-child {                        stop-color: @lineStart;                     }                    stop:last-child {                        stop-color: @lineStop;                     }                }            }        }    }}.svgHover    (@hoverColor:@--primary-5 , @lineHoverStart:@iconLinearStartColorA , @lineHoverStop:@iconLinearStopColorA) {    &:not(.disabled_icons):not(.noHover) {        &.active,        &:hover {            svg {                & + {                    path:first-child {                        fill: if(                            (@hoverColor = 0),                            @--primary-5,                            @hoverColor                        );                     }                }                                linearGradient stop:first-child {                    stop-color: @lineHoverStart;                 }                linearGradient stop:last-child {                    stop-color: @lineHoverStop;                 }            }        }    }}.svgDisabled (@disableColor:@iconColorD) {    svg {        & + {            path:first-child {                fill: @disableColor;            }        }    }    cursor: not-allowed;    }.svgBoder (@borderColor:@buttonNormalBorderN , @bgColor:@buttonNormalBgN) {    .bg (@color) when (isColor(@color)) {        background-color: @color;    }    .border (@color) when (isColor(@color)) {        border: 1 / @px-unit solid @color;    }    .bg(@bgColor);    .border(@borderColor);}.opacity (@opacity) {    @IEOpacity: @opacity * 100;    -moz-opacity: @opacity;    opacity: @opacity;    filter: alpha(opacity= @IEOpacity);}.colorSvg (@svgId, @hoverColor:@--primary-5) {    &:not(.disabled_icons):not(.noHover) {        &:hover {            .@{svgId} {                path {                    fill: @hoverColor !important;                }            }        }    }}.lumaValue(@bg){    @redV:red(@bg);    @greenV:green(@bg);    @blueV:blue(@bg);    @lumaV:(@redV * 0.2126 + @greenV * 0.7152 + @blueV * 0.0722) / 255 * 100%;}.lumaColor(@bg:@--bg, @state){        @deepFont:@--font-l,@--font-r,@--placeholder,@--font-s;        @lightFont:@--font-l-l,@--font-r-l,@--placeholder-l,@--font-s-l;        @inverse:(if((.lumaValue(@bg)[] >= 60%),extract(@deepFont,@state),extract(@lightFont,@state)));    @result:(if((.lumaValue(@bg)[] >= 60%),extract(@lightFont,@state),extract(@deepFont,@state)));}.lumaColorSelect(@bg:@--bg, @deepColor, @lightColor){    @result:(if((.lumaValue(@bg)[] >= 60%),@lightColor,@deepColor));}.subColor(@base6){    @h:hue(@base6);    @s:round(hsvsaturation(@base6));    @v:round(hsvvalue(@base6));                @s-5:round(@s - @s / 5);    @v-5:round(@v + (100%- @v) / 5);        @s-7:round(@s + (100% - @s) / 5);    @v-7:round(@v - @v / 5);        @s-8:round(@s + ((100% - @s) / 5) * 2);    @v-8:round(@v - (@v / 5) * 2);        @hover:hsv(@h,@s-5,@v-5);    @click:hsv(@h,@s-7,@v-7);    @deep:hsv(@h, @s-8 , @v-8);}.color_A(@bg:@--bg){    .lumaColor(@bg, 1);}.color_N(@bg:@--bg){    .lumaColor(@bg, 2);}.color_D(@bg:@--bg){    .lumaColor(@bg, 3);}.color_S(@bg:@--bg){    .lumaColor(@bg, 4);}.colorBox(@colorMap){    each(@colorMap, {            @base: extract(@value , 1);            @base_H: if(length(@value) >= 2 ,extract(@value , 2) ,.subColor(@base)[@hover]);            @base_C: if(length(@value) >= 3 ,extract(@value , 3) ,.subColor(@base)[@deep]);            .sdd-checked-@{key} {                &.ant-checkbox-wrapper:hover .ant-checkbox-inner{                                        border-color: @base_H !important;                }                .ant-checkbox-inner {                    border-color: @base_C !important;                    background-color: @base !important;                    &:after{                                                border-color: @base_C;                    }                }                .ant-checkbox-checked::after{                    border-color: @base_C !important;                }            }    });}



@secondary:{    
    
    selRuleLineColor: #ffff00; 
    unSelRuleLineColor: #0000ff; 
    selFilterLineColor: #06c8f9; 
    unSelFilterLineColor: #06c8f9; 
    pointRuleSelColor: #01ff01; 
    testAA:fadeout(#01ff01,25%);
    
    hddDiskHealth:#FF0000;    
    
    playbackUplineBgN:@--bg; 
    playbackLineBgN: @--toolbar-bg; 
    playbackCoordinateTextColorN: .color_N(@--bg)[]; 
    playbackFramePenColorN: @--bg; 
    playbackNormalTypeColorN: #39D67F; 
    playbackMotionTypeColorN: #D9E612; 
    playbackIntellTypeColorN: #39ADF6; 
    playbackAlarmTypeColorN: #D51112; 
    
    faceTargetColor: rgb(0, 255, 0); 
    bodyTargetColor: rgb(0, 204, 255); 
    vehicleTargetColor: rgb(225, 216, 0); 
    customTargetClolor: rgb(255, 69, 0); 
    
    normalTempColor: #A6AAB2; 
    abnormalTempColor: #ff0000; 
};
body{    background: transparent;}#root, body {    height: 100%;    word-wrap:break-word;     overflow:hidden;    color: @pageTextN;        .rc-virtual-list-scrollbar-thumb {        &:hover {                        background: @page_scroll_barH !important;        }        background: #8f8f8f !important;    }}.cuttitle {    overflow: hidden!important;    white-space: nowrap;    word-wrap: normal;    -o-text-overflow: ellipsis;    text-overflow: ellipsis;}.ant-tabs{    color: @pageTextN;}.ant-table{    .ant-table-thead{        th.ant-table-cell{            word-break: normal;        }    }}i {    cursor: pointer;}.MainPage {    width: 100%;    padding: 20/@px-unit;}::-webkit-scrollbar {    width: @scrollbarHeight;    height: @scrollbarHeight;    cursor: pointer;}::-webkit-scrollbar-track {    -webkit-box-shadow: inset 0 0 6/@px-unit rgba(0,0,0,0);    box-shadow: inset 0 0 6/@px-unit rgba(0,0,0,0);    background: @page_scroll_track;}::-webkit-scrollbar-thumb {    border-radius: 4/@px-unit;    background: @page_scroll_bar;    -webkit-box-shadow: inset 0 0 6/@px-unit rgba(0,0,0,0.1);    box-shadow: inset 0 0 6/@px-unit rgba(0,0,0,0.1);}::-webkit-scrollbar-thumb:hover{    background: @page_scroll_barH;}::-webkit-scrollbar-thumb:active{    background: @page_scroll_bar;}::-webkit-scrollbar-thumb:window-inactive {    background: rgba(0, 0, 0, 0.2);}
.m-width-f10 {    width: calc(~"100% - 10rem") !important;}.m-width-auto {    width: auto !important;}.m-width-15 {    width: 15/@px-unit !important;}.m-width-20 {    width: 20/@px-unit !important;}.m-width-24 {    width: 24/@px-unit !important;}.m-width-25 {    width: 25/@px-unit !important;}.m-width-30 {    width: 30/@px-unit !important;}.m-width-40 {    width: 40/@px-unit !important;}.m-width-45 {    width: 45/@px-unit !important;}.m-width-50 {    width: 50/@px-unit !important;}.m-width-54 {    width: 54/@px-unit !important;}.m-width-60 {    width: 60/@px-unit !important;}.m-width-65 {    width: 65/@px-unit !important;}.m-width-84 {    width: 84/@px-unit !important;}.m-width-70 {    width: 70/@px-unit !important;}.m-width-52 {    width: 52/@px-unit !important;}.m-width-80 {    width: 80/@px-unit !important;}.m-width-85 {    width: 85/@px-unit !important;}.m-width-90 {    width: 90/@px-unit !important;}.m-width-95 {    width: 95/@px-unit !important;}.m-width-100 {    width: 100/@px-unit !important;}.m-width-105 {    width: 110/@px-unit !important;}.m-width-110 {    width: 110/@px-unit !important;}.m-width-118 {    width: 118/@px-unit !important;}.m-width-120 {    width: 120/@px-unit !important;}.m-width-124 {    width: 124/@px-unit !important;}.m-width-126 {    width: 126/@px-unit !important;}.m-width-130 {    width: 130/@px-unit !important;}.m-width-132 {    width: 132/@px-unit !important;}.m-width-138 {    width: 138/@px-unit !important;}.m-width-140 {    width: 140/@px-unit !important;}.m-width-144 {    width: 144/@px-unit !important;}.m-width-148 {    width: 148/@px-unit !important;}.m-width-150 {    width: 150/@px-unit !important;}.m-width-156 {    width: 156/@px-unit !important;}.m-width-160 {    width: 160/@px-unit !important;}.m-width-168 {    width: 168/@px-unit !important;}.m-width-170 {    width: 170/@px-unit !important;}.m-width-175 {    width: 175/@px-unit !important;}.m-width-180 {    width: 180/@px-unit !important;}.m-width-184 {    width: 184/@px-unit !important;}.m-width-190 {    width: 190/@px-unit !important;}.m-width-200 {    width: 200/@px-unit !important;}.m-width-213 {    width: 213/@px-unit !important;}.m-width-215 {    width: 215/@px-unit !important}.m-width-220 {    width: 220/@px-unit !important;}.m-width-224 {    width: 224/@px-unit !important;}.m-width-230 {    width: 230/@px-unit !important;}.m-width-240 {    width: 240/@px-unit !important;}.m-width-250 {    width: 250/@px-unit !important;}.m-width-260 {    width: 260/@px-unit !important;}.m-width-276 {    width: 276/@px-unit !important;}.m-width-280 {    width: 280/@px-unit !important;}.m-width-300 {    width: 300/@px-unit !important;}.m-width-310 {    width: 310/@px-unit !important;}.m-width-320 {    width: 320/@px-unit !important;}.m-width-330 {    width: 330/@px-unit !important;}.m-width-360 {    width: 360/@px-unit !important;}.m-width-372 {    width: 372/@px-unit !important;}.m-width-480 {    width: 480/@px-unit !important;}.m-width-510 {    width: 510/@px-unit !important;}.m-width-545 {    width: 545/@px-unit !important;}.m-width-600 {    width: 600/@px-unit !important;}.m-width-648 {    width: 648/@px-unit !important;}.m-width-910 {    width: 910/@px-unit !important;}.m-width-3p {    width: 3% !important;}.m-width-9p {    width: 9% !important;}.m-width-10p {    width: 10% !important;}.m-width-12p {    width: 12% !important;}.m-width-20p {    width: 20% !important;}.m-width-25p {    width: 25% !important;}.m-width-30p {    width: 30% !important;}.m-width-33p {    width: 33% !important;}.m-width-40p {    width: 40% !important;}.m-width-50p {    width: 50% !important;}.m-width-55p {    width: 55% !important;}.m-width-58p {    width: 58% !important;}.m-width-60p {    width: 60% !important;}.m-width-65p {    width: 65% !important;}.m-width-70p {    width: 70% !important;}.m-width-80p {    width: 80% !important;}.m-width-100p {    width: 100% !important;}.m-width-200p {    width: 200% !important;}.m-max-w-480 {    max-width: 480/@px-unit !important;}.m-minw-50 {    min-width: 50/@px-unit !important;}.m-minw-70 {    min-width: 70/@px-unit !important;}.m-minw-90 {    min-width: 90/@px-unit !important;}.m-height-0 {    height: 0 !important;}.m-height-15 {    height: 15/@px-unit !important;}.m-height-24 {    height: 24/@px-unit !important;}.m-height-25 {    height: 25/@px-unit !important;}.m-height-26 {    height: 26/@px-unit !important;}.m-height-28 {    height: 28/@px-unit !important;}.m-height-30 {    height: 30/@px-unit !important;}.m-height-36 {    height: 36/@px-unit !important;}.m-height-40 {    height: 40/@px-unit !important;}.m-height-50 {    height: 50/@px-unit !important;}.m-height-60 {    height: 60/@px-unit !important;}.m-height-90 {    height: 90/@px-unit !important;}.m-height-100 {    height: 100/@px-unit !important;}.m-height-120 {    height: 120/@px-unit !important;}.m-height-150 {    height: 150/@px-unit !important;}.m-height-200 {    height: 200/@px-unit !important;}.m-height-201 {    height: 201/@px-unit !important;}.m-height-238 {    height: 238/@px-unit !important;}.m-height-276 {    height: 276/@px-unit !important;}.m-height-288 {    height: 288/@px-unit !important;}.m-height-300 {    height: 300/@px-unit !important;}.m-height-310 {    height: 310/@px-unit !important;}.m-height-350 {    height: 350/@px-unit !important;}.m-height-360 {    height: 360/@px-unit !important;}.m-height-380 {    height: 380/@px-unit !important;}.m-height-400 {    height: 400/@px-unit !important;}.m-height-432 {    height: 432/@px-unit !important;}.m-height-484 {    height: 484/@px-unit !important;}.m-height-648 {    height: 648/@px-unit !important;}.m-height-100p {    height: 100%;}
.m-m-a {    margin: auto;}.m-m-0 {    margin: 0 !important;}.m-m-20 {    margin: 20/@px-unit !important;}.m-m-10 {    margin: 10/@px-unit !important;}.m-mr-0 {    margin-right: 0 !important;}.m-mr-5 {    margin-right: 5/@px-unit !important;}.m-mr-6 {    margin-right: 6/@px-unit !important;}.m-mr-10 {    margin-right: 10/@px-unit !important;}.m-mr-12 {    margin-right: 12/@px-unit !important;}.m-mr-15 {    margin-right: 15/@px-unit !important;}.m-mr-20 {    margin-right: 20/@px-unit !important;}.m-mr-24 {    margin-right: 24/@px-unit !important;}.m-mr-30 {    margin-right: 30/@px-unit !important;}.m-mr-36 {    margin-right: 36/@px-unit !important;}.m-mr-40 {    margin-right: 40/@px-unit !important;}.m-mr-100 {    margin-right: 100/@px-unit !important;}.m-mr-140 {    margin-right: 140/@px-unit !important;}.m-mr-186 {    margin-right: 186/@px-unit !important;}.m-mr-200 {    margin-right: 200/@px-unit !important;}.m-mr-250 {    margin-right: 250/@px-unit !important;}.m-mr-f2 {    margin-right: -2/@px-unit !important;}.m-mr-f6 {    margin-right: -6/@px-unit !important;}.m-mr-f7 {    margin-right: -7/@px-unit !important;}.m-mr-f10 {    margin-right: -10/@px-unit !important;}.m-mr-f14 {    margin-right: -14/@px-unit !important;}.m-mr-f15 {    margin-right: -15/@px-unit !important;}.m-mr-f16 {    margin-right: -16/@px-unit !important;}.m-mr-f17 {    margin-right: -17/@px-unit !important;}.m-mr-f18 {    margin-right: -18/@px-unit !important;}.m-mr-f23 {    margin-right: -23/@px-unit !important;}.m-mr-f25 {    margin-right: -25/@px-unit !important;}.m-mr-f27 {    margin-right: -27/@px-unit !important;}.m-ml-0 {    margin-left: 0 !important;}.m-ml-3 {    margin-left: 3/@px-unit !important;}.m-ml-5 {    margin-left: 5/@px-unit !important;}.m-ml-6 {    margin-left: 6/@px-unit !important;}.m-ml-7 {    margin-left: 7/@px-unit !important;}.m-ml-8 {    margin-left: 8/@px-unit !important;}.m-ml-9 {    margin-left: 9/@px-unit !important;}.m-ml-10 {    margin-left: 10/@px-unit !important;}.m-ml-12 {    margin-left: 12/@px-unit !important;}.m-ml-15 {    margin-left: 15/@px-unit !important;}.m-ml-16 {    margin-left: 16/@px-unit !important;}.m-ml-17 {    margin-left: 17/@px-unit !important;}.m-ml-18 {    margin-left: 18/@px-unit !important;}.m-ml-20 {    margin-left: 20/@px-unit !important;}.m-ml-23 {    margin-left: 23/@px-unit !important;}.m-ml-24 {    margin-left: 24/@px-unit !important;}.m-ml-25 {    margin-left: 25/@px-unit !important;}.m-ml-29 {    margin-left: 29/@px-unit !important;}.m-ml-30 {    margin-left: 30/@px-unit !important;}.m-ml-33 {    margin-left: 33/@px-unit !important;}.m-ml-35 {    margin-left: 35/@px-unit !important;}.m-ml-36 {    margin-left: 36/@px-unit !important;}.m-ml-37 {    margin-left: 37/@px-unit !important;}.m-ml-40 {    margin-left: 40/@px-unit !important;}.m-ml-42 {    margin-left: 42/@px-unit !important;}.m-ml-47 {    margin-left: 47/@px-unit !important;}.m-ml-48 {    margin-left: 48/@px-unit !important;}.m-ml-49 {    margin-left: 49/@px-unit !important;}.m-ml-50 {    margin-left: 50/@px-unit !important;}.m-ml-50-5 {    margin-left: 50.5/@px-unit !important;}.m-ml-52 {    margin-left: 52/@px-unit !important;}.m-ml-60 {    margin-left: 60/@px-unit !important;}.m-ml-65 {    margin-left: 65/@px-unit !important;}.m-ml-70 {    margin-left: 70/@px-unit !important;}.m-ml-72 {    margin-left: 72/@px-unit !important;}.m-ml-75 {    margin-left: 75/@px-unit !important;}.m-ml-90 {    margin-left: 90/@px-unit !important;}.m-ml-100 {    margin-left: 100/@px-unit !important;}.m-ml-110 {    margin-left: 110/@px-unit !important;}.m-ml-112 {    margin-left: 112/@px-unit !important;}.m-ml-127 {    margin-left: 127/@px-unit !important;}.m-ml-130 {    margin-left: 130/@px-unit !important;}.m-ml-150 {    margin-left: 150/@px-unit !important;}.m-ml-170 {    margin-left: 170/@px-unit !important;}.m-ml-200 {    margin-left: 200/@px-unit !important;}.m-ml-220 {    margin-left: 220/@px-unit !important;}.m-ml-480 {    margin-left: 480/@px-unit !important;}.m-ml-540 {    margin-left: 540/@px-unit !important;}.m-ml-586 {    margin-left: 586/@px-unit !important;}.m-ml-590 {    margin-left: 590/@px-unit !important;}.m-ml-620 {    margin-left: 620/@px-unit !important;}.m-ml-765 {    margin-left: 765/@px-unit !important;}.m-ml-800 {    margin-left: 800/@px-unit !important;}.m-ml-f1 {    margin-left: -1/@px-unit !important;}.m-ml-f3 {    margin-left: -3/@px-unit !important;}.m-ml-f4 {    margin-left: -4p/@px-unit !important;}.m-ml-f5 {    margin-left: -5p/@px-unit !important;}.m-ml-f6 {    margin-left: -6/@px-unit !important;}.m-ml-f8 {    margin-left: -8/@px-unit !important;}.m-ml-f9 {    margin-left: -9/@px-unit !important;}.m-ml-f10 {    margin-left: -10/@px-unit !important;}.m-ml-f13 {    margin-left: -13/@px-unit !important;}.m-ml-f14 {    margin-left: -14/@px-unit !important;}.m-ml-f15 {    margin-left: -15/@px-unit !important;}.m-ml-f16 {    margin-left: -16/@px-unit !important;}.m-ml-f17 {    margin-left: -17/@px-unit !important;}.m-ml-f18 {    margin-left: -18/@px-unit !important;}.m-ml-f20 {    margin-left: -20/@px-unit !important;}.m-ml-f24 {    margin-left: -24/@px-unit !important;}.m-ml-f30 {    margin-left: -30/@px-unit !important;}.m-ml-f31 {    margin-left: -31/@px-unit !important;}.m-ml-f32 {    margin-left: -32/@px-unit !important;}.m-ml-f33 {    margin-left: -33/@px-unit !important;}.m-ml-f60 {    margin-left: -60/@px-unit !important;}.m-mt-0 {    margin-top: 0 !important;}.m-mt-2 {    margin-top: 2/@px-unit !important;}.m-mt-3 {    margin-top: 3/@px-unit !important;}.m-mt-4 {    margin-top: 4/@px-unit !important;}.m-mt-5 {    margin-top: 5/@px-unit !important;}.m-mt-7 {    margin-top: 7/@px-unit !important;}.m-mt-8 {    margin-top: 8/@px-unit!important;}.m-mt-10 {    margin-top: 10/@px-unit !important;}.m-mt-11 {    margin-top: 11/@px-unit !important;}.m-mt-12 {    margin-top: 12/@px-unit !important;}.m-mt-15 {    margin-top: 15/@px-unit !important;}.m-mt-16 {    margin-top: 16/@px-unit !important;}.m-mt-18 {    margin-top: 18/@px-unit !important;}.m-mt-20 {    margin-top: 20/@px-unit !important;}.m-mt-30 {    margin-top: 30/@px-unit !important;}.m-mt-42 {    margin-top: 42/@px-unit !important;}.m-mt-32 {    margin-top: 32/@px-unit !important;}.m-mt-35 {    margin-top: 35/@px-unit !important;}.m-mt-36 {    margin-top: 36/@px-unit !important;}.m-mt-44 {    margin-top: 44/@px-unit !important;}.m-mt-50 {    margin-top: 50/@px-unit !important;}.m-mt-60 {    margin-top: 60/@px-unit !important;}.m-mt-70 {    margin-top: 70/@px-unit !important;}.m-mt-72 {    margin-top: 72/@px-unit !important;}.m-mt-100 {    margin-top: 100/@px-unit !important;}.m-mt-120 {    margin-top: 120/@px-unit !important;}.m-mt-180 {    margin-top: 180/@px-unit !important;}.m-mt-210 {    margin-top: 210/@px-unit !important;}.m-mt-f2 {    margin-top: -2/@px-unit !important;}.m-mt-f3 {    margin-top: -3/@px-unit !important;}.m-mt-f4 {    margin-top: -4/@px-unit !important;}.m-mt-f5 {    margin-top: -5/@px-unit !important;}.m-mt-f6 {    margin-top: -5/@px-unit !important;}.m-mt-f8 {    margin-top: -8/@px-unit !important;}.m-mt-f9 {    margin-top: -9/@px-unit !important;}.m-mt-f10 {    margin-top: -10/@px-unit !important;}.m-mt-f12 {    margin-top: -12/@px-unit !important;}.m-mt-f15 {    margin-top: -15/@px-unit !important;}.m-mt-f20 {    margin-top: -20/@px-unit !important;}.m-mt-f32 {    margin-top: -32/@px-unit !important;}.m-mt-f40 {    margin-top: -40/@px-unit !important;}.m-mb-0 {    margin-bottom: 0 !important;}.m-mb-5 {    margin-bottom: 5/@px-unit !important;}.m-mb-10 {    margin-bottom: 10/@px-unit !important;}.m-mb-12 {    margin-bottom: 12/@px-unit !important;}.m-mb-15 {    margin-bottom: 15/@px-unit !important;}.m-mb-14 {    margin-bottom: 14/@px-unit !important;}.m-mb-20 {    margin-bottom: 20/@px-unit !important;}.m-mb-30 {    margin-bottom: 30/@px-unit !important;}.m-mb-2 {    margin-bottom: 24/@px-unit !important;}.m-mb-30 {    margin-bottom: 30/@px-unit !important;}.m-mb-80 {    margin-bottom: 80/@px-unit !important;}.m-mb-130 {    margin-bottom: 130/@px-unit !important;}
.m-p-0 {    padding: 0 !important;}.m-p-5 {    padding: 5/@px-unit !important;}.m-p-12 {    padding: 12/@px-unit !important;}.m-p-15 {    padding: 15/@px-unit !important;}.m-pl-0 {    padding-left: 0 !important;}.m-pl-5 {    padding-left: 5/@px-unit !important;}.m-pl-6 {    padding-left: 6/@px-unit !important;}.m-pl-7 {    padding-left: 7/@px-unit !important;}.m-pl-8 {    padding-left: 8/@px-unit !important;}.m-pl-10 {    padding-left: 10/@px-unit !important;}.m-pl-12 {    padding-left: 12/@px-unit !important;}.m-pl-13 {    padding-left: 13/@px-unit !important;}.m-pl-15 {    padding-left: 15/@px-unit !important;}.m-pl-17 {    padding-left: 17/@px-unit !important;}.m-pl-20 {    padding-left: 20/@px-unit !important;}.m-pl-24 {    padding-left: 24/@px-unit !important;}.m-pl-25 {    padding-left: 25/@px-unit !important;}.m-pl-30 {    padding-left: 30/@px-unit !important;}.m-pl-35 {    padding-left: 35/@px-unit !important;}.m-pl-37 {    padding-left: 37/@px-unit !important;}.m-pl-40 {    padding-left: 40/@px-unit !important;}.m-pl-43 {    padding-left: 43/@px-unit !important;}.m-pl-45 {    padding-left: 45/@px-unit !important;}.m-pl-50 {    padding-left: 50/@px-unit !important;}.m-pl-60 {    padding-left: 60/@px-unit !important;}.m-pl-70 {    padding-left: 70/@px-unit !important;}.m-pr-0 {    padding-right: 0 !important;}.m-pr-5 {    padding-right: 5/@px-unit !important;}.m-pr-6 {    padding-right: 6/@px-unit !important;}.m-pr-8 {    padding-right: 8/@px-unit !important;}.m-pr-10 {    padding-right: 10/@px-unit !important;}.m-pr-12 {    padding-right: 12/@px-unit !important;}.m-pr-15 {    padding-right: 15/@px-unit !important;}.m-pr-30 {    padding-right: 30/@px-unit !important;}.m-pr-40 {    padding-right: 40/@px-unit !important;}.m-pr-84 {    padding-right: 84/@px-unit !important;}.m-pr-114 {    padding-right: 114/@px-unit !important;}.m-pt-0 {    padding-top: 0;}.m-pt-12 {    padding-top: 12/@px-unit !important;}.m-pt-24 {    padding-top: 24/@px-unit !important;}.m-pt-1 {    padding-top: 1/@px-unit !important;}.m-pt-3 {    padding-top: 3/@px-unit !important;}.m-pt-5 {    padding-top: 5/@px-unit !important;}.m-pt-8 {    padding-top: 8/@px-unit !important;}.m-pt-10 {    padding-top: 10/@px-unit !important;}.m-pt-15 {    padding-top: 15/@px-unit !important;}.m-pt-20 {    padding-top: 20/@px-unit !important;}.m-pt-35 {    padding-top: 35/@px-unit !important;}.m-pb-0 {    padding-bottom: 0 !important;}.m-pb-2 {    padding-bottom: 2/@px-unit !important;}.m-pb-8 {    padding-bottom: 8/@px-unit !important;}.m-pb-10 {    padding-bottom: 10/@px-unit !important;}.m-pb-108 {    padding-bottom: 108/@px-unit !important;}
.m-pos-abs {    position: absolute !important;}.m-pos-static {    position: static !important;}.m-pos-r {    position: relative !important;}.m-top-0 {    top: 0 !important;}.m-top-10 {    top: 10/@px-unit !important;}.m-top-72 {    top: 72/@px-unit !important;}.m-top-90 {    top: 90/@px-unit !important;}.m-top-130 {    top: 130/@px-unit !important;}.m-bottom-0 {    bottom: 0 !important;}.m-bottom-2-4 {    bottom: 2.4/@px-unit !important;}.m-bottom-3 {    bottom: 3/@px-unit !important;}.m-left-0 {    left: 0 !important;}.m-left-10p {    left: 10% !important;}.m-right-16 {    right: 16/@px-unit !important;}.m-right-84 {    right: 84/@px-unit !important;}.m-right-124 {    right: 124/@px-unit !important;}.m-topmax {    z-index: 10004 !important;}.m-float-none {    float: none !important;}.m-float-left {    float: left;}.m-float-right {    float: right !important;}.m-clear-both {    clear: both;}.m-clearfix:after {    content: '\20';    display: block;    height: 0;    clear: both;}.m-hor-center {    position: absolute;    left: 50%;    transform: translate3d(-50%, 0, 0);    -webkit-transform: translate3d(-50%, 0, 0);}.m-ver-center {    position: absolute;    top: 50%;    transform: translate3d(0, -50%, 0);    -webkit-transform: translate3d(0, -50%, 0);}.m-hor-ver-center {    position: absolute;    left: 50%;    top: 50%;    transform: translate3d(-50%, -50%, 0);    -webkit-transform: translate3d(-50%, -50%, 0);}
.m-fw-normal {    font-weight: normal !important;}.m-fw-bold {    font-weight: bold !important;}.m-fs-small {    font-size: small;}.m-fs-15 {    font-size: 15/@px-unit;}.m-fs-18 {    font-size: 18/@px-unit;}.m-fs-43 {    font-size: 43/@px-unit;}.m-lh-24 {    line-height: 24/@px-unit;}.m-lh-28 {    line-height: 28/@px-unit;}.m-lh-30 {    line-height: 30/@px-unit;}.m-lh-32 {    line-height: 32/@px-unit;}.m-lh-35 {    line-height: 35/@px-unit;}.m-lh-40 {    line-height: 40/@px-unit !important;}.m-cursor-default {    cursor: default !important;}.m-cursor-pointer {    cursor: pointer !important;}.m-cursor-crosshair {    cursor: crosshair !important;}.m-cursor-move {    cursor: move !important;}.m-cursor-text {    cursor: text !important;}.m-cursor-wait {    cursor: wait !important;}.m-cursor-help {    cursor: help !important;}.m-cursor-notAllowed {    cursor: not-allowed !important;}.m-vertical-top {    vertical-align: top !important;}.m-vertical-middle {    vertical-align: middle !important;}.m-vertical-bottom {    vertical-align: bottom !important;}.m-vertical-text-bottom {    vertical-align: text-bottom !important;}.m-text-center {    text-align: center;}.m-text-left {    text-align: left;}.m-text-right {    text-align: right;}.m-inline-block {    display: inline-block;}.m-visibility-hidden {    visibility: hidden !important;}.m-display-hidden {    display: none !important;}.m-display-show {    display: '' !important;}.m-overflow-hidden {    overflow: hidden !important;}.m-overflow-initial {    overflow: initial !important;}.m-opacity-0 {    opacity: 0;}.m-ws-nowrap {    white-space: nowrap;}.m-text-ellipsis {    overflow: hidden;    text-overflow: ellipsis;    white-space: nowrap;    vertical-align: middle;}
html,body {    font-size: @base-rem-size;}#p_ocx {    z-index: 1001;}@media screen and (max-width: 1280px) {    html,    body {        font-size: @base-rem-size-sm;    }}@media screen and (min-device-width: 3000px) {    html,    body {        font-size: 2 * @base-rem-size;    }}::-webkit-scrollbar-corner {    background-color: @pageBodyBg;}* {    font-family: arial, 'Microsoft YaHei' !important;}.iconDropitem_name {    float: left;}.ant-pagination-total-text,.ant-pagination-options-size-changer,.ant-pagination-options {    color: @paginationTextN;    .ant-pagination-options-quick-jumper {        input {            background-color: @paginationBg;            border-color: @mainPageSvgN;            color: @paginationInputTextN;            margin-left: -40px;        }    }}.ant-pagination-next,.ant-pagination-prev {    a {        &:hover {            border-color: @paginationBorderA !important;            color: @paginationTextA !important;        }        background-color: @paginationBg !important;        border-color: @mainPageSvgN !important;        color: @paginationTextN !important;    }    svg {        fill: @iconColorN;    }}.ant-pagination-disabled:hover {    a {        color: @paginationTextN !important;        border-color: @mainPageSvgN !important;    }}.ant-pagination-item {    background-color: @paginationBg;    border-color: @mainPageSvgN;    a {        color: @paginationTextN;    }}.ant-pagination-item-active {    border-color: @paginationBorderA;    a {        color: @paginationTextA;    }}.ant-pagination-item-ellipsis {    color: @paginationTextN !important;}.ant-pagination-prev .ant-pagination-item-link,.ant-pagination-next .ant-pagination-item-link {    background-color: @paginationBg;}.ant-pagination-total-text {    float: right;}.ant-pagination-simple .ant-pagination-simple-pager input:hover{    border-color: @formInputBorderA;}.ant-pagination-simple-pager input {    background-color: @pageBodyBg !important;    border-color: @pageBorderN !important;    &:focus{        border-color: @formInputBorderA !important;        box-shadow: 0 0 0 0 !important;    }    &:hover{        border-color: @formInputBorderA !important;    }}.ant-picker-range .ant-picker-active-bar{    background-color: @formInputBorderA !important;}.ant-tree-checkbox-inner {    background-color: @formInputBgN;}.ant-tree-checkbox-checked .ant-tree-checkbox-inner {    background-color: @formInputBgA;}.ant-form {    color: @formInputTextN;}.ant-form-item-label > label {    color: @formInputTextN;}.ant-form-item {    margin-bottom: 0px;}.ant-progress-inner {    background-color: @progressBg;    .ant-progress-success-bg, .ant-progress-bg{        background-color: @progressBgA;    }}.ant-progress-text {    color: @progressText;}.ant-layout {    background-color: @setUpContentBg;    color: @pageTextN;}.ant-layout-sider {    background-color: @SideMenuBg;    color: @pageTextN;}.has-error {    .ant-input {        &:hover {            border-color: @buttonDangerBorderA;        }        &:focus {            border-color: @buttonDangerBorderA;        }        border-color: @buttonDangerBorderA;        background-color: @formInputBgN;    }    .ant-input-affix-wrapper {        &:hover {            border-color: @buttonDangerBorderA !important;        }        border-color: @buttonDangerBorderA;        background-color: @formInputBgN;    }    .ant-input-affix-wrapper-focused {        border-color: @buttonDangerBorderA !important;    }}.ant-input,.ant-input-number {    &:focus,    &:hover {        box-shadow: 0 0 0 0;        border-color: @formInputBorderA;    }}.ant-input[disabled] {    color: @formInputTextD;    background-color: @formInputBgD;    border-color: @formInputBoderD;    &:hover {        border-color: @formInputBoderD;    }}.ant-input[readonly] {    color: @formInputTextN;    background-color: @formInputBgD;    border-color: @formInputBoderD !important;    &:hover {        border-color: @formInputBoderD;    }}.ant-input,.ant-input-number {    background-color: @formInputBgN;    border-color: @formInputBoderN;    color: @formInputTextN;}.ant-input-number-disabled {    color: @formInputTextD !important;    background-color: @formInputBgD !important;    opacity: 1;}.ant-input-number-handler-up,.ant-input-number-handler-down {    background-color: @numberInPutHandleBgA;}.ant-input-number-handler-up:active,.ant-input-number-handler-down:active {    background-color: @numberInPutHandleBgA;}.ant-input-number-handler-down {    border-top: 1px solid @numberInPutHandleBgA;}.ant-input-number:hover:not(.ant-input-number-borderless),.ant-input-number-focused:not(.ant-input-number-borderless){    .ant-input-number-handler-up {        border-bottom: 0.5px solid @numberInPutHandleBoderA;    }}.ant-input-number:hover:not(.ant-input-number-borderless),.ant-input-number-focused:not(.ant-input-number-borderless){    .ant-input-number-handler-down {        border-top: 0.5px solid @numberInPutHandleBoderA;    }}.ant-input-number-handler-wrap {    border-left: 1px solid @numberInPutHandleBgA;    background-color: @numberInPutHandleBgA;}.ant-input-number-handler {    border-left-color: @numberInPutHandleBoderA;}.ant-input-affix-wrapper {    background-color: @formInputBgN;    border-color: @formInputBoderN;    &.ant-input-affix-wrapper-focused:not(.ant-input-affix-wrapper-disabled),    &:hover:not(.ant-input-affix-wrapper-disabled) {        box-shadow: 0 0 0 0;        border-color: @formInputBorderA;    }}.ant-form-item-has-error {    input {        background-color: transparent !important;    }}.labelInput-check-info {    .ant-col {        margin-top: -10px;        line-height: 16px;    }    span {        color: @errorColor;    }}li.ant-select-dropdown-menu-item.ant-select-dropdown-menu-item-selected,div.ant-select.ant-select-enabled {    color: @formInputTextN;}.ant-select,.ant-input-number {    outline: none;    &:hover {        border-color: @formInputBorderA;        svg {            fill: @formInputSvgA;        }    }    svg {        fill: @formInputSvgN;    }    .ant-input-number-handler-up-disabled,    .ant-input-number-handler-down-disabled {        svg {            fill: @formInputSvgD;        }    }}.ant-input-number-disabled {    &:hover {        border-color: @formInputBoderD;    }}.ant-input-number-focused,.ant-select-open {    svg {        fill: @formInputSvgA;    }}.ant-input-number-focused {    border-color: @formInputBorderA;    box-shadow: 0 0 0 0;}.ant-select-multiple {    .ant-select-selection-item {        background: @formMuliInputBgA;        border: 1px solid @formInputBoderN;    }}.LabelIPV4{    border: 1/@px-unit solid @formInputBoderN;    &.ipv4-active{        border-color: @formInputBorderA;    }    input,.mac-point:hover{        border: 0px !important;    }    .ant-input {        background-color: transparent !important;    }}.has-error{    .LabelIPV4{        border-color: @errorColor !important    }}.ant-select {    color: @formInputTextN;}.ant-select-single.ant-select-open .ant-select-selection-item{    color: @formInputTextN;}.ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector{    border-color: @formInputBorderA;    box-shadow: none;}.ant-select-focused,.ant-select-open,.ant-select {    &:not(.ant-select-disabled):hover{        .ant-select-selector{            border-color: @formInputBorderA;        }    }    .ant-select-selection {        background-color: @formInputBgN;        border-color: @formInputBoderN;        box-shadow: 0 0 0 0;        .ant-select-arrow {            color: @formInputTextN;        }        &:hover {            border-color: @formInputBorderA;        }    }    .ant-select-selector {                .ant-select-selection-overflow {            max-height: 56 / @px-unit;            overflow-y: auto;        }    }}.ant-select-open {    .ant-select-selection {        border-color: @formInputBorderA;        box-shadow: 0 0 0 1px @formInputBorderA;    }}.ant-select-disabled,.ant-select-disabled .ant-select-selection {    color: @formInputTextD !important;    background-color: @formInputBgD !important;    opacity: 1;    svg {        fill: @formInputSvgD;    }    &:focus {        border-color: @formInputBoderD;    }    &:hover {        border-color: @formInputBoderD;        svg {            fill: @formInputSvgD;        }    }}.ant-select-dropdown {    background-color: @formInputDropDownBgN;    border: 1 / @px-unit solid @--component-border;}.ant-select-dropdown-menu-item {    color: @formInputTextN;}.ant-select-dropdown-menu-item:hover:not(.ant-select-dropdown-menu-item-disabled) {    background-color: @formInputDropDownBgA;}.ant-select-dropdown-menu-item-active:not(.ant-select-dropdown-menu-item-disabled) {    background-color: @formInputDropDownBgA;}.ant-select-dropdown-menu-item-selected {    background-color: @formInputDropDownBgA;    font-weight: 400;}.ant-select:not(.ant-select-customize-input) .ant-select-selector {    background-color: @formInputBgN;    border: 1px solid @formInputBoderN;        display: flex;    display: -ms-flexbox;        align-items: center;}.ant-select-item-option-selected:not(.ant-select-item-option-disabled) {    color: @formInputDropDownTextSelectN;    font-weight: normal;    background-color: @formInputDropDownBgSel;    .ant-select-item-option-state{                color:@formInputBorderA !important;    }}.ant-select-item-option-active:not(.ant-select-item-option-disabled):not(.ant-select-item-option-selected){    color: @formInputTextN;    font-weight: normal;    background-color: @formInputDropDownBgA;}.ant-select-item {    color: @formInputDropDownTextN;    font-weight: normal;}.ant-select-disabled {    &.ant-select {        &:not(.ant-select-customize-input) {            .ant-select-selector {                background: @formInputBgD;                color: @formInputTextD;            }        }    }}.ant-checkbox-wrapper {    color: @pageTextN;}.ant-checkbox-wrapper:hover .ant-checkbox-inner,.ant-checkbox:not(.ant-checkbox-disabled):hover .ant-checkbox-inner{    border-color: @formCheckboxBorderA !important;}.ant-checkbox-wrapper:hover{    .ant-checkbox-disabled{        .ant-checkbox-inner{            border-color: @formCheckboxBorderD !important;        }    }}.ant-checkbox-disabled + span {    color: @pageTextD;}.ant-checkbox-inner,.label-div-Container .ant-checkbox-inner {    width: 19 / @px-unit;    height: 19 / @px-unit;    background-color: @formInputBgN !important;    border: 1px solid @formCheckboxBorderN;}.ant-checkbox-checked {    &::after{        border: 1px solid @formCheckboxBorderA;    }    .ant-checkbox-inner {        background-color: @formCheckboxBgA !important;        border-color: @formCheckboxBorderA !important;    }}.ant-checkbox-checked {    .ant-checkbox-inner::after {        border: 2 / @px-unit solid @formCheckboxInnerA;        border-top: 0;        border-left: 0;        left: 25%;        width: 6 / @px-unit;        height: 11 / @px-unit;        top: 44%;    }}.ant-checkbox-indeterminate {    .ant-checkbox-inner {        border-color: @formInputBorderA;        &::after {            background-color: @formInputBorderA;            left: 51%;        }    }}.ant-checkbox-disabled {    .ant-checkbox-inner {        border-color: @formCheckboxBorderD !important;    }    .ant-checkbox-inner::after {        border-color: @formCheckboxBorderD !important;    }}.ant-checkbox-input:focus + .ant-checkbox-inner {    border-color: @formCheckboxBorderN;}.ant-btn-link[disabled] {    color: @pageTextD;}.ant-btn-link[disabled]:hover {    color: @pageTextD;}.ant-btn-link {    &.ant-btn-icon-only {        width: 30 / @px-unit;        height: 30 / @px-unit;        color: @mainPageSvgN;        text-align: center;        &:hover:not(:disabled) {            color: @current;        }        &:disabled,        &:hover:disabled {            opacity: 0.5;            color: inherit;        }    }}.ant-divider-horizontal.ant-divider-with-text-left {    font-weight: normal;    border: none;    font-size: inherit;    color: inherit;    background: none !important;    &::after {        border-top: 1px solid @setUpDivider;    }}.ant-divider-horizontal.ant-divider-with-text-left::before {    width: 0%;}.ant-divider {    background: @setUpDivider !important;}.ant-modal {    .ant-modal-content {        background-color: @modalBg;        border: 1px solid @modalBorder;        color: @modalContentText;        .ant-modal-header {            background-color: @modalTitleBg;            border-bottom: 1px solid @modalTitleBorder;            height: 41 / @px-unit;            padding: 9 / @px-unit 24 / @px-unit;            .ant-modal-title {                color: @modalTitleText;            }        }        .ant-modal-close {            color: @modalTitleText;            opacity: 0.5;            &:hover {                opacity: 0.6;            }        }        .ant-modal-close-x {            height: 41px;            line-height: 41px;        }        .ant-modal-footer {            background-color: @modalFooterBg;            border-top: 1px solid @modalFooterBorder;            height: 60 / @px-unit;            padding: 5/@px-unit 16/@px-unit 50/@px-unit 16/@px-unit;            .ant-space {                height: auto;            }            .label-normal-container {                float: right;                margin-left: 30/@px-unit;            }        }    }}.ant-picker-range {    background-color: @formInputDropDownBgN;    border-color: @pageBorderN;    .ant-picker-input > input {        color: @formInputTextN;    }    .ant-picker-separator {        color: @formInputTextN;    }    .ant-picker-suffix {        color: @formInputTextN;    }    .ant-picker-clear {        color: @formInputTextN;        background-color: @formInputDropDownBgN;    }}.ant-picker-panel-container {    background-color: @formInputDropDownBgN;    .ant-picker-panels {        border-bottom: 1px solid @dividerColor;        .ant-picker-panel {                        .ant-picker-time-panel-column {                & > li.ant-picker-time-panel-cell .ant-picker-time-panel-cell-inner {                    color: @PickerBodyTextN;                    &:hover {                        background-color: @current;                        color: @PickerBodyTextA;                    }                }                & > li.ant-picker-time-panel-cell-selected .ant-picker-time-panel-cell-inner {                    background-color: @current;                    color: .color_A(@current)[] !important;                }            }        }    }}.ant-picker-cell-in-view.ant-picker-cell-selected.ant-picker-cell-disabled {    .ant-picker-cell-inner {        background: transparent !important;        color: @pageTextD;    }}.ant-picker-cell-in-view.ant-picker-cell-selected .ant-picker-cell-inner{    background-color: @current !important;    color: .color_N(@current)[];}.ant-picker-cell-in-view.ant-picker-cell-today .ant-picker-cell-inner::before{    border-color: @current !important;}.ant-picker-cell-selected .ant-picker-cell-inner {    background: @current;}.ant-picker-cell:hover .ant-picker-cell-inner {    background: @current !important;    color: .color_A(@current)[];}.ant-picker-cell .ant-picker-cell-inner {    color: @pageTextD;}.ant-picker-cell-in-view.ant-picker-cell-range-end,.ant-picker-cell-in-view.ant-picker-cell-range-start{    .ant-picker-cell-inner{        background: @current;        color: .color_N(@current)[];    }}.ant-picker-cell-in-view .ant-picker-cell-inner {    color: @PickerBodyTextN;}.ant-picker-cell-disabled .ant-picker-cell-inner {    color: @pageTextD;}.ant-picker-header button {    color: @PickerHeaderButtonN;}.ant-picker-header > button:hover {    color: .color_A(@PickerHeaderBg)[];}.ant-picker-today-btn {    color: @pageTextN;}.ant-picker-today-btn:hover {    color: @current;}.ant-picker-now-btn {    color: @buttonActiveBgN;}.ant-picker-time-panel-column    > li.ant-picker-time-panel-cell-selected    .ant-picker-time-panel-cell-inner {    background: @current;    color: .color_A(@current)[] !important;}.ant-picker-time-panel-column    > li.ant-picker-time-panel-cell    .ant-picker-time-panel-cell-inner:hover {    background: @current;    color: .color_A(@current)[] !important;}.ant-table-body {    tbody {        .ant-table-row {            &.ant-table-row-selected {                td {                    background: transparent;                }            }            .ant-table-cell {                &.ant-table-column-sort {                    background: transparent;                }            }        }    }    .editable-cell-value-wrap:hover {        border-color: @current !important;    }}.ant-badge-count {    box-shadow: 0 0 0 1px #e9463a;}.ant-spin-blur {    opacity: 1;    background-color: @SpinBg;}.ant-spin-text {    position: absolute;    top: 50%;    left: 50%;    width: auto !important;    padding-top: 5px;    background: @SpinTextBg;    color: @SpinTextA;    transform: translate(-50%, 0);    padding: 10px 10px;}.ant-spin-nested-loading {    div {        .ant-spin {            .ant-spin-text {                text-shadow: unset;            }        }    }}._SideView_ {    .ant-tabs-top > .ant-tabs-nav {        margin: 0;    }        .ant-tabs-left{        .ant-tabs-nav {            .ant-tabs-tab-btn {                color: @pageTextN;            }        }    }    .ant-tabs-nav {        .ant-tabs-tab-btn {            background: @pagetabBgN;             color: .color_N(@pagetabBgN)[];             border: 1px solid @tabBorder;                                    min-width: 200 / @px-unit;            padding: 0 5 / @px-unit;            height: 50 / @px-unit;            line-height: 50 / @px-unit;            text-align: center;        }        .ant-tabs-tab-active {            & > .ant-tabs-tab-btn {                background: @current;                color: @tabTextA;            }        }    }    .ant-tabs-tab {        padding: 0px;        & + .ant-tabs-tab {            margin-left: 0px;        }    }    .ant-tabs-ink-bar {        display: none;    }}._MachineConfig_.MainPage {    width: 100%;}.header-tabMenu {    line-height: 50 / @px-unit;    .ant-tabs {        &.ant-tabs {            & > .ant-tabs-nav {                margin-bottom: 0px;                height: @navMenuLineHeight;                &::before {                    border-width: 0px;                }                .ant-tabs-nav-list {                    .ant-tabs-tab {                        background-color: @topTabBgN;                        border: none;                        color: @topTabTextN;                        &.ant-tabs-tab-active {                            background-color: @topTabBgA !important;                            border: none;                            color: @topTabTextA !important;                            .ant-tabs-tab-btn {                                color: @topTabTextA !important;                            }                        }                    }                }            }        }    }}._Table_ {    width: 100%;    margin-top: 8px;    .ant-table,    .ant-table-small .ant-table-thead,    .ant-table-placeholder {        background: none;        border-top-color: @tableBorderN;    }    .ant-empty-description {        color: @tableTextN;    }    .ant-table-column-sorters {        display: flex;        flex: auto;        align-items: center;        justify-content: center;    }    .ant-table-column-title {        position: relative;        z-index: 1;        flex: 0 1 auto;    }    .ant-table-body {        min-height: 400 / @px-unit;    }    .ant-table {        border: 1px solid @tableBorderN;        & > .ant-table-container {            border-left-width: 0px !important;            border-top-width: 0px !important;            & > table {                border-top-width: 0px;            }            .ant-table-header {                table {                    border-top: 0;                }            }            .ant-table-thead > tr > th {                padding: 0 0 !important;                font-weight: 400;            }            .ant-table-tbody {                .selected-row,                .ZD-selected-row {                    td {                        color: .color_A(@tableBgA)[] !important;                    }                    background: @tableBgA !important;                }            }            tr {                td {                    padding: 0 0 !important;                    border-right-width: 0px !important;                    color: @tableTextN;                    height: 48/@px-unit;                    border-bottom-width: 0px;                }            }            th {                color: @tableHeadTextN;                background-color: @tableBgN !important;                border-color: @tableBorderN !important;                height: 48/@px-unit !important;            }            .ant-pagination {                .ant-pagination-disabled {                    .ant-pagination-item-link {                        border-color: @buttonNormalBorderD;                        color: @buttonNormalTextD;                    }                }                .ant-pagination-prev,                .ant-pagination-next {                    .ant-pagination-item-link {                        background-color: @buttonNormalBgN;                    }                }                .ant-pagination-item {                    background-color: @buttonNormalBgN;                    border-color: @buttonNormalBorderN;                }                .ant-pagination-item-active {                    border-color: @buttonActiveBorderN;                }            }        }    }        .ant-table.ant-table-bordered {        & > .ant-table-container {            table {                border-top: 0px;                & > tbody {                    tr {                        &.showZebraPattern,                        &.ZD-showZebraPattern {                            &:nth-of-type(even) {                                background: @tableEvenBgN;                            }                            &:nth-of-type(odd) {                                background: @tableOddBgN;                            }                            &.ZD-highlight-row {                                background: @tableBgA;                            }                        }                        &:hover {                            td {                                color: @tableTextA !important;                                background: transparent !important;                                                                                                                                                            }                        }                    }                }            }        }    }    .ant-table-cell-scrollbar {        visibility: hidden;    }}.ant-btn:not(.btn-link):not(.ant-btn-link) {    background-color: @buttonNormalBgN;    color: @buttonNormalTextN;    border: 1px solid @buttonNormalBorderN;    &:focus {        background-color: @buttonNormalBgN;        color: @buttonNormalTextN;        border-color: @buttonNormalBorderN;        &.active,        &:active {            color: @buttonActiveTextN;            background-color: @buttonActiveBgN;            border-color: @buttonActiveBorderN;        }    }        &:not(.selected):hover,    &:not(.selected):hover:not(:focus) {        color: @btnHoverColor;        background-color: @btnHoverBg;        border-color: @btnHoverBoderColor;    }    &:not(.selected)[disabled],    &:not(.selected)[disabled]:hover,    &:not(.selected)[disabled]:focus,    &:not(.selected)[disabled]:active {        background-color: @buttonNormalBgD;        color: @buttonNormalTextD;        border-color: @buttonNormalBorderD;    }    &.ant-btn-primary {        background-color: @buttonActiveBgN;        color: @buttonActiveTextN;        border-color: @buttonActiveBorderN;        &:focus {            background-color: @buttonActiveBgN;            color: @buttonActiveTextN;            border-color: @buttonActiveBorderN;            &.active,            &:active {                color: @buttonActiveTextN;                border-color: @buttonActiveBgA;                background-color: @buttonActiveBgA;            }        }        &:hover:not(:focus):not([disabled]) {            color: @buttonActiveTextN;            border-color: @buttonActiveBgA;             background-color: @buttonActiveBgA;        }        &[disabled],        &[disabled]:hover,        &[disabled]:focus,        &[disabled]:active {            background-color: @btnPrimaryActiveBgD;            color: @buttonActiveTextD;            border-color: @buttonActiveBorderD;        }    }    &.ant-btn-test {        background-color: @buttonTestBgN;        color: @buttonTestTextN;        border-color: @buttonTestBorderN;        &:hover:not(:focus):not([disabled]) {            color: @buttonTestTextH;            border-color: @buttonTestBorderH;            background-color: @buttonTestBgH;        }        &:active:not([disabled]) {            color: @buttonTestTextA;            border-color: @buttonTestBorderA;            background-color: @buttonTestBgA;        }        &[disabled] {            color: @buttonTestTextD;            border-color: @buttonTestBorderD;            background-color: @buttonTestBgD;        }    }    &.ant-btn-dangerous {        background-color: @buttonDangerBgN;        color: @buttonDangerTextN;        border-color: @buttonDangerBorderN;        &:hover:not(:focus):not([disabled]) {            color: @buttonDangerTextH;            border-color: @buttonDangerBorderH;            background-color: @buttonDangerBgH;        }        &:active:not([disabled]) {            color: @buttonDangerTextA;            border-color: @buttonDangerBorderA;            background-color: @buttonDangerBgA;        }        &[disabled] {            color: @buttonDangerTextD;            border-color: @buttonDangerBorderD;            background-color: @buttonDangerBgD;        }    }}.ant-btn:disabled {        .cus_icons {        .svgDisabled() !important;     }}.ant-switch {    background-color: @formInputSwitchBgN;     &.ant-switch-checked {        background-color: @current;        opacity: unset;    }    &.ant-switch-disabled.ant-switch-checked {        opacity: 0.45;    }}.ant-switch {    &.ant-switch-checked {        &:focus {                        box-shadow: none;        }    }}.LabelSwitch-label-dark {    padding-left: 5px;}.ant-radio-wrapper {    color: @pageTextN;}.ant-radio {    vertical-align: middle; }.ant-radio:not(.ant-radio-disabled){    &:hover{        .ant-radio-inner{            border-color: @formInputBorderA !important;        }    }}.ant-radio-input:focus + .ant-radio-inner{    border-color: @formInputBorderA !important;}.ant-radio-checked {    .ant-radio-inner {        border-color: @formInputBorderA !important;        &::after {            transform: scale(1);        }    }}.ant-radio-inner,.label-div-Container .ant-radio-inner {        width: 19px;    height: 19px;    background-color: transparent;    border-color: @formRadioBorderN;    box-shadow: none !important;    &::after {                width: 9px;        height: 9px;        left: 4px;        top: 4px;        background-color: @formInputBorderA;        margin-top: 0px;        margin-left: 0px;    }}.ant-radio-disabled {    .ant-radio-inner {        &::after{            opacity: 0.45;            background-color: @formCheckboxBorderD;        }        border-color: @formCheckboxBorderD !important;        background-color: transparent;    }}.ant-dropdown-menu {    background-color: @navDropdownMenuBg;    color: @navDropdownMenuTextN;}.ant-dropdown-menu .ant-dropdown-menu-item {    height: 40 / @px-unit;    line-height: 40 / @px-unit;    overflow: hidden;    -o-text-overflow: ellipsis;    text-overflow: ellipsis;    color: @navDropdownMenuTextN;}.ant-dropdown-menu-item:hover {    background-color: @navDropdownMenuBgA;    color: @navDropdownMenuTextA !important;    svg path {        fill: @navDropdownMenusvgA !important;    }}.ant-dropdown-menu-item-selected {    background-color: @navDropdownMenuBg;}.ant-popover {    color: @popover_TextN;    .ant-popover-arrow-content {        background-color: @popover_BgN;    }    .ant-popover-inner {        background-color: @popover_BgN;    }    .ant-popover-inner-content {        color: @popover_TextN;    }    .ant-popover-message {        color: @popover_TextN;    }    .ant-popover-arrow-content::before {        display: none;    }}.ant-picker {    background-color: @formInputBgN;    border-color: @formInputBoderN;    box-shadow: none;    &:hover,    .ant-picker-focused{        border-color: @formInputBorderA;    }    .ant-picker-input {        & > input {            color: @formInputTextN;        }        .ant-picker-suffix {            svg {                fill: @iconColorN;            }        }    }    &.ant-picker-disabled {        background-color: @formInputBgD;        border-color: @formInputBoderD;        .ant-picker-input {            & > input {                color: @formInputTextD;            }        }    }}.ant-picker-year-panel {    .ant-picker-header {        border-bottom: 1px solid @dividerColor;    }    .ant-picker-cell-range-hover::after {        border-color: @current !important;    }    .ant-picker-cell-range-hover-start::after {        border-color: @current !important;    }    .ant-picker-cell-range-hover-end::after {        border-color: @current !important;    }}.ant-picker-month-panel {    .ant-picker-header {        border-bottom: 1px solid @dividerColor;    }    .ant-picker-cell-range-hover::after {        border-color: @current !important;    }    .ant-picker-cell-range-hover-start::after {        border-color: @current !important;    }    .ant-picker-cell-range-hover-end::after {        border-color: @current !important;    }}.ant-picker-panel-container {    .ant-picker-panel {        border-bottom-width: 0px;        .ant-picker-year-panel,        .ant-picker-month-panel,        .ant-picker-date-panel,        .ant-picker-time-panel {            .ant-picker-header {                background-color: @PickerHeaderBg;                color: @PickerHeaderTextN;                border-bottom-width: 0px;            }            .ant-picker-body {                background-color: @PickerBodyBg;                .ant-picker-content {                    th,                    .ant-picker-cell-in-view {                        color: @PickerBodyTextN;                    }                    .ant-picker-cell-inner::after {                        background: none;                    }                    .ant-picker-cell-range-start::before {                        background: none;                    }                    .ant-picker-cell-range-end::before {                        background: none;                    }                    .ant-picker-cell-in-range {                        background: @pickerCellInRangeBg;                    }                    .ant-picker-cell-range-hover {                        background: @pickerCellInRangeBg;                    }                    .ant-picker-cell-range-hover::after {                        border-color: @current;                    }                    .ant-picker-cell-range-hover-start::after {                        border-color: @current;                    }                    .ant-picker-cell-range-hover-end::after {                        border-color: @current;                    }                    .ant-picker-cell-range-hover-end::before {                        border-color: @current;                        background: none !important;                    }                    .ant-picker-cell-in-range::before {                        background: @pickerCellInRangeBg;                    }                }            }        }        .ant-picker-footer {            border-bottom-width: 0px;            border-top-width: 0px;        }    }}.ant-picker-panel-container {    .ant-picker-panel {        .ant-picker-content {            color: @PickerBodyTextN;        }    }}.ant-picker-dropdown {    .ant-picker-range-wrapper{        border: 1px solid @pickerBorder;    }    .ant-picker-time-panel-column:not(:first-child) {        border-left: 1px solid @dividerColor;    }}.ant-picker-time-panel-column {    & > li.ant-picker-time-panel-cell {        .ant-picker-time-panel-cell-inner {            height: 30 / @px-unit;            line-height: 30/@px-unit;            color: @PickerBodyTextN;        }    }}.ant-slider-track {    background-color: @current ;}.ant-slider:hover .ant-slider-track{    background-color: @sliderTrackA;}.labelSlider-center {    margin: 0 30 / @px-unit; }.ant-slider-handle{    border-color: @sliderRailA;    &.ant-tooltip-open {        border-color: @--primary-5;    }}.labelSlider-float-right {    margin-right: 5 / @px-unit;}.labelSlider-float-left, .labelSlider-float-right{    span{        svg{            width: 20 / @px-unit;            path:first-child{                fill: @--component-bg !important;            }            path:nth-child(2){                fill: @pageTextN;                &:hover{                    fill: @sliderRailA;                }            }        }    }}.ant-slider {    &:hover {        .ant-slider-rail {            background-color: @sliderRailA;        }        .ant-slider-handle:not(.ant-tooltip-open) {            border-color: @--primary-5;        }    }    .ant-slider-rail {        background-color: @sliderBgN;    }    &.ant-slider-disabled{        .ant-slider-rail{            background-color: @sliderBgN !important;        }        .ant-slider-track{            background-color:@sliderRailA !important        }    }}.ant-tabs-left {    .ant-tabs-content-holder {        border-left-color: @pageBorderN;    }}.ant-tabs,.ant-tabs .ant-form,.ant-form .ant-form-item,.ant-form-item {    color: @pageTextN;}.ant-form-item-has-error input {    background-color: @pageBodyBg !important;}.ant-tabs-top > .ant-tabs-nav::before,.ant-tabs-bottom > .ant-tabs-nav::before,.ant-tabs-top > div > .ant-tabs-nav::before,.ant-tabs-bottom > div > .ant-tabs-nav::before {    border-bottom: none;}.ant-alert {    background-color: inherit;    border: none;    padding: 0;    .ant-alert-message {        color: @pageTextN;    }}.ant-radio-group {    .ant-radio-button-wrapper {        background-color: @popover_BgN;        border-color: @tabBorder;        color: @pageTextN;    }    .ant-radio-button-wrapper-checked {        background-color: @current;        border-color: @current;        color: @tabTextA;        &:hover {            color: @tabTextA;        }        &:active {            border-color: none;        }    }    .ant-radio-wrapper-disabled * {        color: @formInputTextD !important;    }}.ant-table.ant-table-bordered > .ant-table-title {    border: none;    color: @pageTextN;        border-bottom: 1px solid @pageBorderN;}.ant-table-tbody > tr.ant-table-row-selected > td {    background: transparent;}.ant-table-thead > tr > th {    text-align: center;}.ant-table-tbody > tr > td {    text-align: center;}.ant-table-tbody > tr.ant-table-row:hover > td {    background: unset;}.ant-table-tbody > tr > td.ant-table-cell-row-hover {    background: @tableBgA;}.LabelMac {    .ant-input-group{        border: 1 /@px-unit solid @formInputBoderN;        .mac-point,        .mac-input {                        background-color: transparent;                        background-color: unset;            border: 0px;        }        &.mac-active{            border-color: @formInputBorderA;        }    }    &:not(.mac-disabled){        .ant-input-group:hover{            border-color: @formInputBorderA;        }    }}.has-error{    .LabelMac{        .ant-input:first-of-type,        .ant-input:last-of-type        {            border-left: 0px;            border-right: 0px;        }        .ant-input-group{            border-color: @errorColor !important;        }    }}._VideoTransmission_ {    .box,    .box .title {        border: 1px solid @pageBorderN;    }}.ant-collapse {    border: 1px solid @pageBorderN;}.ant-collapse-content {    border-top: 1px solid @pageBorderN;}.ant-collapse > .ant-collapse-item {    border-bottom: 1px solid @pageBorderN;}.ant-checkbox-group {    color: @pageTextN;}.ant-collapse,.ant-collapse .ant-collapse-content {    background-color: unset;}.ant-collapse > .ant-collapse-item > .ant-collapse-header,.ant-collapse,.ant-collapse-content {    color: unset;}.ant-tabs-dropdown {    .ant-tabs-dropdown-menu-vertical {        background-color: @topTabBgN;        .tab-item {            display: flex;            margin-left: 5 / @px-unit;            align-items: center;            width: 100%;            .ant-image {                width: 25 / @px-unit;                .ant-image-img {                    width: 16 / @px-unit;                }            }            .tabIcon {                font-size: 20 / @px-unit;                color: @navMenuTextN;            }            span {                margin-left: 4 / @px-unit;                text-overflow: ellipsis;                color: @navMenuTextN;                white-space: nowrap;                overflow: hidden;            }        }        .ant-tabs-dropdown-menu-item {            color: @navMenuTextN;            &:hover {                background-color: @topTabBgA;            }        }        .ant-tabs-dropdown-menu-item-remove {            color: @navMenuTextN;        }    }}._pannel_.ant-collapse .ant-collapse-item {    border: 1px solid @pageBorderN;}.label-passwordCheck-tip {    background-color: @passwordCheckBg;}.label-passwordCheck-status-weak-1 {    background-color: @errorColor;}.label-passwordCheck-status-middle-1 {    background-color: @warnColor;}.label-passwordCheck-status-middle-2 {    background-color: @warnColor;}.label-passwordCheck-status-strong-1 {    background-color: @successColor;}.label-passwordCheck-status-strong-2 {    background-color: @successColor;}.label-passwordCheck-status-strong-3 {    background-color: @successColor;}.label-explain {    word-break: keep-all;}.ant-picker-datetime-panel {    .ant-picker-time-panel {        border-left: 0;    }}fieldset {    border: 1 / @px-unit solid @pageBorderN;    padding: 25 / @px-unit;}legend {    width: auto;    font-size: @font-size-base;}.ant-picker-range-arrow {    z-index: -1;}.ant-popover {    .ant-popover-inner-content {        padding-top: 0;        padding-bottom: 0;    }}@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {        .ant-picker-range-arrow {        z-index: -1;        width: 9 / @px-unit !important;        height: 9 / @px-unit !important;            }    .ant-picker-panel-container {        transform: translateX(-3px);    }}.ant-picker-range-arrow {    z-index: -1;    width: 11 / @px-unit !important;    height: 11 / @px-unit !important;        background: @pageTextN !important;}.ant-picker-range-arrow::before {    width: 11 / @px-unit !important;    height: 11 / @px-unit !important;        background: @pageTextN !important;}.ant-message-notice-content {    color: .color_A(@modalTitleBg)[];    background: @modalTitleBg;}.ant-tooltip {    max-width: 200 / @px-unit !important;}.ant-tooltip-inner {    background-color: @popover_BgN;    color: @popover_TextN;}.ant-tooltip-arrow-content {    --antd-arrow-background-color: @popover_BgN;    background-color: @popover_BgN;}.ant-tabs-content-holder,.ant-tabs-content,.ant-tabs-tabpane {    outline: none;}.TabsTop{    margin-top: 10/@px-unit;    &.ant-tabs {        .ant-tabs-nav {            &::before {                content: none;            }            .ant-tabs-tab:not(:first-of-type) {                margin-left: 20/@px-unit;            }            .ant-tabs-tab-btn {                height: 40/@px-unit;                line-height: 40/@px-unit;                padding: 0 8/@px-unit;                text-align: center;                min-width: 118/@px-unit;                width: auto;            }        }    }}.ant-message-notice.ant-move-up-leave.ant-move-up-leave-active {    animation: MessageMoveOut .5s;    -webkit-animation: MessageMoveOut .5s;}@keyframes MessageMoveOut {    0%{        max-height: 150px;        padding: 8px;        opacity: 1;    }    100% {        max-height: 0;        padding: 0;        opacity: 0;    }}.ant-zoom-appear.ant-zoom-appear-active  {    animation: ZoomIn .2s;    -webkit-animation: ZoomIn .2s;}.ant-zoom-leave.ant-zoom-leave-active {    animation: ZoomOut .2s;    -webkit-animation: ZoomOut .2s;}.ant-fade-leave.ant-fade-leave-active {    animation: FadeOut .2s;    -webkit-animation: FadeOut .2s;}.ant-slide-up-leave.ant-slide-up-leave-active {    animation: SlideOut .2s;    -webkit-animation: SlideOut .2s;}.ant-slide-up-enter.ant-slide-up-enter-active {    animation: SlideIn .2s;    -webkit-animation: SlideIn .2s;}@keyframes ZoomIn {    0%{        transform: scale(0);        opacity: 0;    }    100%{        transform: scale(1);        opacity: 1;    }}@keyframes ZoomOut {    0%{        transform: scale(1);        opacity: 1;    }    100%{        transform: scale(0);        opacity: 0;    }}@keyframes FadeOut {    0%{        opacity: 1;    }    100%{        opacity: 0;        display: none;    }}@keyframes SlideIn {    0%{        opacity: 0;    }    100%{        opacity: 1;    }}@keyframes SlideOut {    0%{        opacity: 1;    }    100%{        opacity: 0;    }}.hyperlink{    color: @current;    &:hover{       color:  @--primary-5;    }}.assistanceColor{    each(@secondary,{        &.@{key}{            color:@value        }    });}.colorBox(@recordBox);.colorBox({green:@aiDisplayNumCheck});.report-icon {    width: 100%;    font-size: 200px !important;    margin: auto;}.wifi_sign {    display: inline-block;    width: 20px;    height: 20px;}.label-normal-behind,.label-append-unit{    color:.color_N(@pageBodyBg)[];}.ant-modal-confirm-body {    .ant-modal-confirm-title{        color: @modalContentText;    }    .ant-modal-confirm-content {        color: @modalContentText;    }}.ant-table-column-sorter-up.active, .ant-table-column-sorter-down.active{    color: @--primary-6;}.label-normal-wrapper .labelTimeRangePicker{    &+a{        color: @pageTextN;    }}.ant-spin.ant-spin-spinning{    .ant-spin-dot-item{        background-color: @SpinDotColor;    }}.ant-picker-header-view button:hover{    color: @--primary-5;}._SAFESecurityStatus_{    .status-title-tip{        .m-highlight-text{            color: @pageTextN;        }    }    ._SAFESecurityStatus_titleText.m-highlight-text{        color: @pageTextN;    }}._publicHttps_,._WlanAgree_,._VideoTransmission_{    ._Table_{        a{            color: @anchorTextA;        }    }}

.cmpLabelText{
    &.spaceBreak{
        
        white-space: pre-line;
        
        width: 680/@px-unit;
    }
}
.cus_icons {    .svgFont();    .svgOut();    .svgHover();    &.disabled_icons {        .svgDisabled();    }    &.active {        .svgOut(@current, @iconLinearStartColorA, @iconLinearStopColorA);    }    .colorSvg(action_red, @errorColor);}
.ant-select-auto-complete{
    width: 100%;
}
.DefaultImgClass{    width: 100%;    height: 100%;    object-fit: fill;}
.label-button {    max-width: 150/@px-unit;    min-width: 100/@px-unit;    .ant-btn {        padding: 4/@px-unit 4/@px-unit;    }}.labelText-wrapper{    white-space:nowrap;    overflow:hidden;    text-overflow:ellipsis;}
.subtitle {    margin: 0;    font-weight: bold;    color: @subtitleColor;    width: 100%;}


._TopTitleDivider_{
    height: 22px;
    line-height: 22px;
    margin: 0 0 8px;
    font-weight: bold;
}
._FirstTitleDivider_{
    height: 22px;
    line-height: 22px;
    margin: 0 0 8px;
    font-weight: bold;
    font-size: 18px;
}
._MidTitleDivider_  {
    height: 22px;
    line-height: 22px;
    margin: 36px 0 8px;
    font-weight: bold;
}
._HighDivider_{
    height: 28px;
    margin: 0 0;
}
.popover_list {    display: flex;    &_item {        cursor: pointer;        &:hover {            color: @preview_center_popover_ColorA;        }        &_active {            color: @preview_center_popover_ColorA;        }    }    &_separator {        margin: 0 5 / @px-unit;        color: @preview_center_separator_ColorN;    }}.popover_icon {    cursor: pointer;    &:hover {        .svgHover(@current);    }}
@keyframes arcSlideUpIn {    0% {        opacity: 0;    }    100% {        opacity: 0.8;    }}.iconDropBtn {    background-color:@navBg;    border: none;    outline: none;    cursor: pointer;    display: flex;    align-items: center;    height: @navMenuLineHeight;    text-overflow: ellipsis;    white-space: nowrap;    overflow: hidden;    &:hover{        color:@navMenuTextA;    }    .cus_icons{        margin: 0 5/@px-unit;    }    span{        font-weight: 700;        text-overflow: ellipsis;        white-space: nowrap;        overflow: hidden;    }}.iconDropMenu {        min-width: 200/@px-unit !important;    border: 1px solid @dropMenuBorder;    pointer-events:auto !important;    .cus_icons{        font-size: 30/@px-unit;        vertical-align:middle;        margin-right: 15/@px-unit;    }    .ant-dropdown-menu-item{        padding:5/@px-unit 15/@px-unit;    }    .iconDropitem_name {        text-overflow: ellipsis;        white-space: nowrap;        overflow: hidden;    }}.iconDropitem {    display: flex;    align-items: center;}.centerItem{    justify-content: center;}
.site-calendar-demo-card {        border: 1px solid @pageBorderN;    border-radius: 2px;    .calender-point {        position: absolute;        background-color: @pageTextN;        width: 4px;        height: 4px;        border: 1px solid @pageTextN;        border-radius: 100%;        left: 46%;        bottom: -1px;        transform: translate(0, -50%);    }}.ant-picker-calendar {    background-color: @preview_center_bottom_Bg !important;    .ant-picker-content {        color: @pageTextN !important;    }    .ant-picker-panel {        border-top: 1px solid @pageBorderN;        background-color: @formInputBgN !important;    }    .ant-picker-cell {        color: @pageTextD !important;    }    .ant-picker-cell-in-view {        color: @pageTextN !important;    }    .ant-picker-content th {        color: @pageTextN;    }    .ant-select-selector {        width: 100 / @px-unit !important;    }                    }
._ColorCheckGroup_ {    display: flex;    flex-direction: row;        .color_checkbox_all_box {        height: 28px;        line-height: 28px;    }        &alarm {        .ant-checkbox-inner {            background-color: @alarm !important;        }    }    &general {        .ant-checkbox-inner {            background-color: @general !important;        }    }    &detect {        .ant-checkbox-inner {            background-color: @detect !important;        }    }    &ivs {        .ant-checkbox-inner {            background-color: @ivs !important;        }    }    &pos {        .ant-checkbox-inner {            background-color: @pos !important;        }    }    &card {        .ant-checkbox-inner {            background-color: @card !important;        }    }    .label-switch-content{        margin-right: 10 / @px-unit;                .ant-switch {            .ant-switch-handle::before {                background: url('/static/media/off.png') 0 / auto 100%;            }        }        .ant-switch-checked  .ant-switch-handle::before {            background: url('/static/media/on.png') 0 / auto 100%;        }        display: flex;        .label-normal-wrapper {            width: auto !important;        }        .sdd-swtich-contianer {            margin-right: 8 / @px-unit;        }        .alarm {            .ant-switch-checked {                background-color: @alarm !important;            }        }        .general {            .ant-switch-checked {                background-color: @general !important;            }        }        .detect {            .ant-switch-checked {                background-color: @detect !important;            }        }        .ivs {            .ant-switch-checked {                background-color: @ivs !important;            }        }        .pos {            .ant-switch-checked {                background-color: @pos !important;            }        }        .card {            .ant-switch-checked {                background-color: @card !important;            }        }    }}
.native-tooltip{
    display: inline;
}
.virtual-table {    .ant-table-header {        th{            border-right: 1/@px-unit solid;        }    }    .ant-empty-normal {        height: 180/@px-unit;        margin: 0 0;        display: flex;        flex-direction: column;        justify-content: center;    }    .ant-table-tbody {         height: 180/@px-unit;    }    .ZD-showZebraPattern-even {        background-color: @tableOddBgN;    }    .ZD-showZebraPattern-odd {        background-color: @tableEvenBgN;    }    .ZD-selected-row {        background-color: @tableBgA;    }    .virtual-table-cell {        display: flex;        align-items: center;        justify-content: center;        color: @tableTextN;    }    .center {        text-align: center;    }}
.label-date-picker {
    .ant-picker {
        width: 100%;
    }
}


.autoComplete {
    .ant-select-selector {
        &:hover {
            border-color: @current !important;
        }
    }
}

.autoComplete-error {
    .ant-select-selector {
        border: 1px solid @errorColor;
    }
}

.error-text {
    color: @errorColor;
}

.pageLine {    display: flex;    float: left;    margin-top: 10 / @px-unit;    width: 100%;    min-width: 600 / @px-unit;    justify-content: space-between;    align-items: center;        .pageLineLeft {        .ant-pagination-simple .ant-pagination-prev .ant-pagination-item-link,        .ant-pagination-simple .ant-pagination-next .ant-pagination-item-link{            height: 100%;        }        button,        & span.anticon {            display: flex;            justify-content: center;            align-items: center;        }        .ant-btn-default{            width: 46 / @px-unit;            height: 32 / @px-unit;        }        display: flex;        .ant-pagination {            display: flex;            justify-content: center;            align-items: center;            .ant-pagination-prev,            .ant-pagination-next,            .ant-pagination-disabled {                padding: 4 / @px-unit 4 / @px-unit;                border: 1 / @px-unit solid @buttonNormalBorderD;                width: 32 / @px-unit;                height: 32 / @px-unit;                margin: 0 10 / @px-unit;            }            .ant-pagination-disabled {                border: 1 / @px-unit solid @buttonNormalBorderD;                background-color: @buttonNormalBgD;                svg {                    & + {                        path:first-child {                            fill: @buttonNormalBorderD;                         }                    }                }            }        }        .anticon-left,        .ant-pagination-simple-pager,        .anticon-right {            color: @pageTextA;        }        .ant-pagination-simple-pager input {            background-color: @pageBodyBg;            border-color: @pageBorderN;        }        .ant-pagination-simple-pager {            height: 32 / @px-unit;        }    }    .pageLineRight {        display: flex;        justify-content: center;        align-items: center;    }}
.similarity-progress{    display: flex;    height: 100%;    align-items: center;    .temp-picData-progress{        height: 18/@px-unit;        width: 100%;        padding: 0/@px-unit 15/@px-unit;        display: flex;        .temp-progress-bar-swrap{            width: 67%;            display: flex;            align-items: center;            padding: 0/@px-unit 5/@px-unit 0/@px-unit 0/@px-unit;            .temp-progress-bar{                background-color: @progressBg;                height: 8/@px-unit;                width: 100%;                border-radius: 5/@px-unit;            }        }        .temp-progress-similar{            display: flex;            align-items: center;            width: 33%;        }    }        .picData-progress {                display: flex;        width: 100%;        align-items: center;        background: @ai_progress_default;        height: 14/@px-unit;        position: relative;        color: @pageTextA;        .progress-item {            display: inline-block;            height: 100%;        }        .progress-red {            background: @ai_progress_red;        }        .progress-orange {            background: @ai_progress_orange;        }        .progress-blue {            background: @ai_progress_blue;        }        .progress-label {            position: absolute;            right: 0;            line-height: 14/@px-unit;            top: 0;        }    }}
._ChannelGroup_ {    display: flex;    .ant-space{        gap:0 !important;        .ant-space-item {            .label-normal-wrapper {                                line-height: 0 !important;            }        }    }    .checkbox {        display: inline-block;    }    .label {        display: inline-block;        height: 40/@px-unit;        line-height: 40/@px-unit;    }    .btn-link{        padding-top: 10/@px-unit;    }    .chn_btn {        color: @buttonNormalTextN;        background-color: transparent;        width: 35/@px-unit;        height: 25/@px-unit;        padding: 0;        margin: 5/@px-unit;        text-align: center;        &.selected {            color: @buttonNormalTextA;            border-color: @formInputBgA;            &:focus {                color: @buttonNormalTextA;                border-color: @formInputBgA;            }        }        &.allbtn {            width: 40/@px-unit !important;            font-size: 10/@px-unit;        }        &[disabled] {            opacity: .5;            background-color: @buttonNormalBgN !important;            color: @buttonNormalTextN !important;            border: 1px solid @buttonNormalBorderN !important;            &:hover,            &:active,            &.active{                opacity: .5;            }        }    }}
._ChannelGroupModal_ {}.ChannelGroupModal_textlabel{    user-select: none}


._WinSecAuth_ {
    width: 600/@px-unit !important;
    .ant-modal-footer {
        padding: 5/@px-unit 16/@px-unit 50/@px-unit 16/@px-unit;
        .label-normal-container {
            float: right;
            margin-left: 30/@px-unit;
        }
    }
    .pd-active > svg path:first-child{
        fill:@pdEyeIconA !important; 
    }

    .pd-default > svg path:first-child{
        fill:none !important; 
    }
}
._Eptz_ {    position: relative;    margin-bottom: 0 / @px-unit;    .eptz_switch{        padding: 10/@px-unit;        .label-normal-container {            display: flex;        }    }    &title{        padding: 0 10/@px-unit;        line-height: 40/@px-unit;        color: @pageTextN;        font-size: 14/@px-unit;        background-color: @fisheye_title;        -webkit-touch-callout: none;         -webkit-user-select: none;         -khtml-user-select: none;         -moz-user-select: none;         -ms-user-select: none;         user-select: none;    }    &wrap{        width: 100%;        padding: 10/@px-unit;        display: flex;        justify-content: flex-start;        flex-wrap: wrap;        .label-div-Container{            width: 100%;            .label-normal-container {                width: 100%;                .select{                    width: 100% !important;                }            }        }          }    &item{        height:40/@px-unit;        width:40/@px-unit;        margin:10/@px-unit;        font-size:40/@px-unit!important;    }    .item-disabled{        cursor:not-allowed;    }    &active{        svg path:first-child{            fill:@fisheye_actColor!important;        }    }      .range-content {        display: flex;        align-items: center;        justify-content: space-around;        width: 100%;        .ant-input-number-handler-wrap{            display: none;        }        input {            padding: 0 5px;        }    }}
._Input-Test_ {    margin-left: 0 !important;}
._RebootTimePicker_ {    margin-left: 0 !important;    .time-selector {        margin-left: 5 / @px-unit;    }}
.ai_result_window {    width: 100vw !important;    height: 100% !important;    margin: 0 !important;    max-width: 100% !important;    top: 0;    .ant-spin-nested-loading {        width: 100%;    }    .ant-modal-header {        width: 100vw;        height: 100vh;        overflow-y: auto !important;        overflow-x: auto !important;        min-width: 1280 / @px-unit;    }    .ant-modal-body {        width: 100%;        padding-left: 12 / @px-unit !important;        padding-right: 0px !important;        padding-top: 0px !important;        max-width: 100% !important;    }    .ant-modal-content {        top: 0;        border: none !important;        left: 0;        width: 100vw;        height: 100vh;        overflow-y: auto !important;        overflow-x: auto !important;        min-width: 1280 / @px-unit;        ._AiSearchResultWindow_left {            margin-left: 15 / @px-unit;            .ant-divider {                margin: 1 / @px-unit !important;            }            width: calc(100vw - 400px) !important;                    }        ._AiSearchResultWindow_left_top {            .allCheckWrap {                min-width: 100 / @px-unit;            }            .all1024CheckWrap {                min-width: 100 / @px-unit;                padding-left: 30 / @px-unit;            }            .allCheckBehind {                width: auto !important;                min-width: 70 / @px-unit;            }            display: flex;            flex-direction: row;            .label-div-Container {                margin-right: 12 / @px-unit;            }            .sort_span {                height: 55 / @px-unit;                line-height: 55 / @px-unit;                margin-right: 12 / @px-unit;                margin-left: 12 / @px-unit;            }            .iconSortBtn {                display: inline-block;                margin-top: 7 / @px-unit;                margin-left: 5 / @px-unit;            }            .icosortActiveBtn {                svg {                    & + {                        path:first-child {                            fill: @current;                         }                    }                }            }            .search_progress {                margin-left: 15 / @px-unit;            }            .cus_icons {                .svgFont(20);            }        }        ._PicDataview_ {                        height: 700 / @px-unit;        }        ._AiSearchResultWindow_right {            width: 400 / @px-unit !important;            min-width: 400 / @px-unit !important;            ._AiSearchResultWindow_right_ocx {                padding: 10 / @px-unit;            }        }    }}.tagadd_modal {    .tag_defaultBtn {        float: left;    }}.tag_BtnDiv {    display: flex;    flex-direction: row;    justify-content: space-between;}.tag_RightBtnDiv {    display: flex;    flex-direction: row;}.save_Btn {    margin-right: 10 / @px-unit;}
._IntelliAreaRuleBtn_ivs-color{    svg path:first-child {                    fill: @current !important;                 }      }
.add-content-box {    padding-top: 8/@px-unit;    .box {        display: inline-block;        width: 100%;        border: 1px solid #4b515c;        margin-right: 8px;        font-size: 14rem;        font-weight: 400;        vertical-align: top;        .active {            color: #fff;            background-color: #52555a;            cursor: pointer;            opacity: 1;        }        .item {            margin: 0;            text-indent: 10px;            overflow: hidden;             text-overflow: ellipsis;             white-space: nowrap;             user-select: none;            text-align: left;            cursor: default;        }        table {            border: 0 !important;            .ZD-highlight-row{                background-color: @tableBgA !important;                color: @pageTextA !important;            }        }    }    .sub {        display: inline-flex;        .reducer {            align-self: flex-start;            transform: translateY(0.5rem);            margin-left: 8/@px-unit;        }        .label-normal-container {            padding-top: 0px !important;        }        ._Table_ {            .ant-table {                border-top: 0;                border-left: 0;                border-right: 0;                border-bottom: 1px solid #4b515c;            }        }    }}
._PtzZoom_ {    margin: 10 / @px-unit 0 0 7.5 / @px-unit;    -webkit-touch-callout: none;     -webkit-user-select: none;     -khtml-user-select: none;     -moz-user-select: none;     -ms-user-select: none;     user-select: none;    &wrap{        display: flex;        align-items: center;    }    &part {        width: 60 / @px-unit;        height: 26 / @px-unit;        background-color: @preview_right_ptzZoom_Bg;        display: flex;        align-items: center;        justify-content: center;    }            &wrap:first-child{        ._PtzZoom_part:not(:last-child) {                border-bottom: 1 / @px-unit solid @preview_right_ptzZoom_border_ColorN;            border-right: 1 / @px-unit solid @preview_right_ptzZoom_border_ColorN;        }        ._PtzZoom_part:last-child {                border-bottom: 1 / @px-unit solid @preview_right_ptzZoom_border_ColorN;        }    }      &wrap:last-child{        ._PtzZoom_part:not(:last-child) {                border-right: 1 / @px-unit solid @preview_right_ptzZoom_border_ColorN;        }    }    & &Icon {        .svgFont(25);        cursor: pointer;    }}

.LayoutOcxLeft{    
    .leftOcx{        
        width: 450/@px-unit;
        height: 337/@px-unit;
    }
}
.ocxRight{   
    padding-left: 15/@px-unit;
    flex: 1;
}
.ocxBottom{
    padding-top: 15/@px-unit;
    width: 450/@px-unit;
    height: 120px;
}
@length :46/@px-unit;@close :34/@px-unit;.WinPreviewWarp {    overflow: hidden;        .ant-modal {                width: 472px !important;    }    .ant-modal-close {        width: @length;        height: @length;        .ant-modal-close-x{            width: @length;            height: @length;             line-height: @length;        }    }    .ant-modal-header {        padding: 12/@px-unit;        .ant-modal-title {            width: calc(~"100% - @{close}");            height: 22/@px-unit;            overflow: hidden;            .TransparentTitle {                color: @MenuViewBg;            }            .NormalTitle {                color: .color_N(@modalTitleBg)[];                overflow: hidden;                white-space: nowrap;                text-overflow: ellipsis;            }        }    }    .ant-modal-body {        padding: 0;        .WinPreview {            padding: 0 !important;        }    }    .ant-modal-footer {        display: none;    }}
._SplitScreen_ {    position: relative;    margin-bottom: 0 / @px-unit;    &title{        padding: 0 10/@px-unit;        line-height: 40/@px-unit;        color: @pageTextN;        font-size: 14/@px-unit;        background-color: @fisheye_title;        -webkit-touch-callout: none;         -webkit-user-select: none;         -khtml-user-select: none;         -moz-user-select: none;         -ms-user-select: none;         user-select: none;    }    &wrap{        padding: 10/@px-unit 0/@px-unit;        display: flex;        justify-content: flex-start;        flex-wrap: wrap;    }    &item{        height:40/@px-unit;        width:40/@px-unit;        margin:10/@px-unit;        font-size:40/@px-unit!important;        svg:hover {            path:first-child {                fill:@fisheye_iconHover!important;            }        }    }    &active{        svg path:first-child{            fill:@fisheye_actColor!important;        }        svg:hover {            path:first-child {                fill:@fisheye_actColor!important;            }        }    }  }

._AlarmController_ {
    margin-top: 20 / @px-unit;
    .mode {
        display: flex;
        align-items: center;

        .label {
            width: 150 / @px-unit;
            height: 30 / @px-unit;
            line-height: 30 / @px-unit;
        }

        .textItem {
            width: 30 / @px-unit;
            height: 30 / @px-unit;
            margin: 0 6 / @px-unit;
            line-height: 30 / @px-unit;
        }

        .radioItem {
            width: 30 / @px-unit;
            height: 30 / @px-unit;
            line-height: 16 / @px-unit;
            margin: 0 7 / @px-unit 0 5 / @px-unit;
            padding: 0 !important;
        }
    }

    .status {
        display: flex;
        align-items: center;

        .label {
            width: 150 / @px-unit;
            height: 30 / @px-unit;
            line-height: 30 / @px-unit;
        }

        .checkboxItem {
            width: 30 / @px-unit;
            height: 30 / @px-unit;
            margin: 0 7 / @px-unit 0 5 / @px-unit;
            padding: 0 !important;
        }
    }
}


.flexBetween(){
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.hdd-modal {
  width: 1010 /@px-unit !important;
  height: 600 /@px-unit;
 
  .btn-wrap {
    .flexBetween();
    .right {
      .flexBetween();
      .label-div-Container:last-child{
        margin-left: 10/@px-unit;
      }
    }
  }
  .warning-tip{
    margin-top: 15 /@px-unit;
  }
}

._ApplyTo_ {    max-height: calc(100vh - 50vh);    height: auto;    overflow-y:auto;    .check-box-group-container{        width: 100% !important;    }    .check-box-group-wrapped{        width: 100% !important;    }    .checkBoxRow{        width: 100%;        display: flex;        justify-content: space-between;        .checkBoxItem-all{            display: flex;            align-items: center;        }        .checkBoxItem{            width: 46%;        }        .rightItem{            display: flex;            justify-content: center;        }    }    .label-normal-behind{                line-height: 28 / @px-unit;    }}
._OSDPlugin_ {        width: 460/@px-unit;    padding: 5/@px-unit;    &ocx {        width: 450/@px-unit;        height: 337/@px-unit;    }}
._FishEye_ {    position: relative;    margin-bottom: 0 / @px-unit;                    &title{        padding: 0 10/@px-unit;        line-height: 40/@px-unit;        color: .color_N(@fisheye_title)[];        font-size: 14/@px-unit;        background-color: @fisheye_title;        -webkit-touch-callout: none;         -webkit-user-select: none;         -khtml-user-select: none;         -moz-user-select: none;         -ms-user-select: none;         user-select: none;    }    &wrap{        padding: 10/@px-unit 0/@px-unit;        display: flex;        justify-content: flex-start;        flex-wrap: wrap;    }    &item{        height:40/@px-unit;        width:40/@px-unit;        margin:10/@px-unit;        font-size:40/@px-unit!important;        svg:hover {            path:first-child {            fill:@fisheye_iconHover!important;            }        }    }    &active{        svg path:first-child{            fill:@fisheye_actColor!important;        }        svg:hover {            path:first-child {            fill:@fisheye_actColor!important;            }        }    }    .show{        display: '';    }    .hide{        display: none;    }  }
._BackupWindow_ {        padding-top: inherit; }.backupModal{    width: 650/@px-unit !important;    .label-normal-container {        padding-top: 0 !important;    }}
._WinSecAuth_ {    width: 600/@px-unit !important;    .ant-modal-footer {        padding: 5/@px-unit 16/@px-unit 50/@px-unit 16/@px-unit;        .label-normal-container {            float: right;            margin-left: 30/@px-unit;        }    }    .pd-active > svg path:first-child{        fill:@pdEyeIconA !important;     }    .pd-default > svg path:first-child{        fill:none !important;     }}

._CompliantInfoModal_ {
    .ant-tabs-tab-active {
        .label-normal-container  {
            .label-normal  {
                color: @current;
            }
        }
    }
    &left {
        display: flex;
        align-items: center;
        height: 32/@px-unit;
        .label-div-Container{
            margin-left: 20/@px-unit;
        }
        span {
            color: @pageTextN;
        }
    }
    ._WorkClothes_ {
        .left-tip {
            visibility: hidden;
        }
        .warning-tip {
            color: @errorColor !important;
        }
    } 
    .ant-checkbox-wrapper + .ant-checkbox-wrapper {
        margin-left: 0px !important
    }

}

.WinPreview {       .WinPreview_ocx {        background-color: @iconBgColor;        height: 285/@px-unit;        img {            width: 100%;            height: 100%;            background-repeat: no-repeat;        }        &_ocx {            width: 100%;            height: 100%;        }    }    &_footer{        position: relative;        top: 0;        background-color: @winpreview_footer_Bg;        padding: 0 10/@px-unit;        flex-direction: row-reverse;        align-items: center;        .sub_footer {            height: 40/@px-unit;            display: flex;            align-items: center;        }        .footer_control {            flex:1;            span {                padding: 0 10/@px-unit;                width: 90/@px-unit;            }            .control_slider,.ant-slider-disabled{                flex:1;                position: relative;                margin:0!important;                line-height: 12/@px-unit;                .ant-slider-rail {                    background-color: @sliderBgN !important;                    height: 3/@px-unit;                }                .ant-slider-handle{                    width: 8/@px-unit!important;                    height: 8/@px-unit!important;                    margin-top: -3/@px-unit;                    border-radius: 0;                }            }        }        .footer_button {            justify-content: space-between;            .footer_icon {                display: flex;                padding: 0 10/@px-unit;                justify-content: flex-start;                }                .cus_icons{                    .svgOut(.color_N(@winpreview_footer_Bg)[]);                    &.disabled_icons{                        .svgDisabled(.color_D(@winpreview_footer_Bg)[]);                    }                }                span {                    display: inline-block;                    width:35/@px-unit;                }                .activeButton {                    .svgOut(@current);                }            .timePeriods {                display: flex;                justify-content: center;                align-items: center;                .timeButton {                    display: flex;                    justify-content: center;                    align-items: center;                    cursor:pointer;                    width: 34/@px-unit;                    height: 22/@px-unit;                    box-sizing: content-box;                    border-radius: 5/@px-unit;                    background-color: @buttonNormalBgN;                    padding: 2/@px-unit 2/@px-unit;                    margin: 0 2/@px-unit;                    font-size: 13/@px-unit;                    color: .color_N(@buttonNormalBgN)[];                }                .activeButton {                    background-color: @current;                    border: 0;                    color: .color_N(@current)[];                }            }        }    }}
._AiRuleTable_ {        padding-top: inherit;     width: 590 / @px-unit;     ._Table_ {        .ant-table-body {            min-height: 150 / @px-unit;        }        .ant-table-body {            .editable-cell-value-wrap {                padding: 0 0;            }        }        .add {            .svgOut(.color_N(@tableBgN)[]);        }        .ant-table.ant-table-bordered {            & > .ant-table-container {                table {                    border-top: 0px;                    & > tbody {                        tr {                            &.ZD-selected-row {                                background-color: transparent !important;                            }                            &.ZD-highlight-row {                                background: @tableBgA  !important;                            }                        }                    }                }            }        }    }}
._AiRulePlugin_ {    width: 460/@px-unit;    padding: 5/@px-unit;        padding-top: inherit;     &ocx {        width: 450/@px-unit;        height: 337/@px-unit;    }    &button, &divider {        width: 450/@px-unit;    }       &filter {        div {            display: inline-block;        }    }    button {        width: 100/@px-unit;    }    .left {        float: left;    }    .right {        float: right;    }    .ant-radio-wrapper {        display: block;    }    .ant-radio-wrapper {        margin-right: 0/@px-unit;    }    .ant-radio, span.ant-radio + * {        vertical-align: top;    }}
._ScheduleModal_ {        padding-top: inherit; }.ant-drawer-wrapper-body {    background-color: #2A2E33;    .ant-drawer-header {        background-color: #2A2E33;        .ant-drawer-title {            color: #fff;        }    }}

@ant-modal-height-height: 42/@px-unit;
@arrow-icon-bg: @modalTitleBg;
@content-header-bg: @--menu-bg;
@content-spilt: @--split;

.acupick_window {
    height: 100%;
    width: 100% !important;
    max-width: none;
    .ant-modal-content {
        height: 100%;
        min-width: 1280/@px-unit;
        min-height: 800/@px-unit;
        .ant-modal-body {
            padding: 0;
            height: calc(100% - @ant-modal-height-height);
            .window-main-container {
                position: relative;
                display: flex;
                height: 100%;
            }
            .window-container-left {
                top: 0;
                left: 0;
                position: absolute;
                display: flex;
                width: 428/@px-unit;
                height: 100%;
                flex-shrink: 0;
                transition: left 0.3s linear;
                .hover-hidden-arrow {
                    position: absolute;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    cursor: pointer;
                    background-color: @modalTitleBg;
                    width: 24/@px-unit;
                    height: 64/@px-unit;
                    border-radius: 2/@px-unit;
                    top: 50%;
                    right: 0;
                    transform: translate(0, -50%);
                    .hover-icon {
                        .svgFont(24)
                    }
                }
                .condition-wrapper {
                    height: 100%;
                    width: 100%;
                    display: flex;
                    flex-flow: column;
                    .condition-header {
                        line-height: 60/@px-unit;
                        box-sizing: border-box;
                        height: 61/@px-unit;
                        padding-left: 20/@px-unit;
                        border-bottom: 1/@px-unit solid @--split;
                        border-right: 1/@px-unit solid @--split;
                        background-color: @content-header-bg;
                    }
                    .img-wrapper {
                        display: flex;
                        padding: 20/@px-unit;
                        background-color: @pageBodyBg;
                        align-items: center;
                        justify-content: center;
                        height: 428/@px-unit;
                        .condition-image {
                            max-width: 100%;
                            height: 100%;
                        }
                    }
                    .condition-form-wrapper {
                        flex: 1;
                        padding-left: 20/@px-unit;
                        background-color: @content-header-bg;
                        .compact-picker-wrapper {
                            display: flex;
                            .label-div-Container {
                                width: 50%;
                            }
                        }        
                    }
                }
            }
            .hide-container-left {
                left: -428/@px-unit;
            }
            .window-left-blank, .window-right-blank {
                display: flex;
                align-items: center;
                justify-content: center;
                flex-shrink: 0;
                width: 32/@px-unit;
                box-sizing: border-box;
                background-color: @content-header-bg;
                border-left: 1/@px-unit solid @--split;
                border-right: 1/@px-unit solid @--split;
                .arrow-icon {
                    .svgFont(20)
                }
            }
            .window-container-right {
                height: 100%;
                flex-shrink: 0;
                width: 400/@px-unit;
                min-width: 400/@px-unit;
                padding: 10/@px-unit;
                .record-preview-panel {
                    width: 100%;
                }
                .record-preview-header {
                    height: 41/@px-unit;
                    width: 100%;
                    box-sizing: border-box;
                    background-color: @modalTitleBg;
                    line-height: 40/@px-unit;
                    border-bottom: 1/@px-unit solid @--split;
                    padding-left: 20/@px-unit;
                }
                
                
                
            }
            .window-container-middle {
                position: relative;
                display: flex;
                height: 100%;
                overflow: hidden;
                flex-grow: 1;
                .hover-show-arrow {
                    position: absolute;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    background-color: @modalTitleBg;
                    cursor: pointer;
                    width: 24/@px-unit;
                    height: 64/@px-unit;
                    border-radius: 2/@px-unit;
                    top: 50%;
                    left: 0;
                    transform: translate(0, -50%);
                    .hover-icon {
                        .svgFont(24)
                    }
                }
                .result-wrapper {
                    display: flex;
                    width: 100%;
                    height: 100%;
                    flex-direction: column;
                    .result-header {
                        display: flex;
                        justify-content: space-between;
                        align-items: center;
                        line-height: 60/@px-unit;
                        box-sizing: border-box;
                        padding-right: 20/@px-unit;
                        height: 61/@px-unit;
                        border-bottom: 1/@px-unit solid @--split;
                        background-color: @content-header-bg;
                        .ant-tabs-nav {
                            .ant-tabs-tab-btn {
                                height: 60/@px-unit;
                                line-height: 60/@px-unit;
                            }
                        }
                        .return-button {
                            margin-left: 20/@px-unit;
                        }
                    }
                    ._SideView_ {
                        min-width: 0;
                    }
                    .result-up-bar {
                        display: flex;
                        box-sizing: border-box;
                        justify-content: space-between;
                        align-items: center;
                        padding-right: 20/@px-unit;
                        flex-wrap: wrap;
                        min-height: 61/@px-unit;
                        border-bottom: 1/@px-unit solid @--split;
                        background-color: @content-header-bg;
                        .left-bar-wrapper {
                            display: flex;
                            .label-div-Container {
                                margin-left: 20/@px-unit;
                            }
                        }
                        .right-bar-wrapper {
                            display: flex;
                            .label-div-Container {
                                margin-left: 20/@px-unit;
                            }
                        }
                    }
                    .result-down-bar {
                        line-height: 60/@px-unit;
                        box-sizing: border-box;
                        padding-left: 16/@px-unit;
                        padding-right: 16/@px-unit;
                        display: flex;
                        justify-content: space-between;
                        height: 61/@px-unit;
                        border-top: 1/@px-unit solid @--split;
                        background-color: @content-header-bg;
                        .down-bar-left {
                            display: flex;
                            align-items: center;
                        }
                        .down-bar-right {
                            .pageLine {
                                min-width: 0;
                                margin-top: 0;
                                .pageLineLeft {
                                    order: 2;
                                }
                                .pageLineRight {
                                    order: 1;
                                    margin-right: 20/@px-unit;
                                }
                            }
                        }
                    }
                    .img-card-group {
                        flex: 1;
                        overflow-y: auto;    
                        .card-group-wrapper {
                            display: flex;
                            flex-wrap: wrap;
                            padding: 8/@px-unit;
                            padding-right: 0/@px-unit;
                            padding-left: 0/@px-unit;
                        }
                        .searching-mask, .no-result-mask {
                            height: 100%;
                            width: 100%;
                            display: flex;
                            align-items: center;
                            justify-content: center;
                        }
                        .card-item-wrapper {
                            width: 266/@px-unit;
                            border: 1/@px-unit solid @--split;
                            margin: 6/@px-unit;
                            .card-content {
                                position: relative;
                                padding: 6/@px-unit;
                                cursor: pointer;
                                background-color: @content-header-bg;
                                .operation-button {
                                    display: flex;
                                    position: absolute;
                                    top: 6/@px-unit;
                                    left: 6/@px-unit;
                                    .normal-icon {
                                        cursor: pointer;
                                        visibility: hidden;
                                    }
                                    .collect-icon {
                                        .svgOut(@buttonNormalBgN);
                                        .svgHover(@iconHover)
                                    }
                                    .hide-icon {
                                        svg {
                                            path:first-child {
                                                fill: none
                                            }
                                            g {
                                                path {
                                                    fill: @hideIconNormalColor !important;
                                                }
                                            }
                                        }
                                        &:hover {
                                            svg {
                                                g {
                                                    path {
                                                        fill: @current !important;
                                                    }
                                                }
                                            }
                                        }
                                    }
                                    .hide-active-icon {
                                        visibility: visible;
                                        svg {
                                            path:first-child {
                                                fill: none
                                            }
                                            g {
                                                path {
                                                    fill: @current !important;
                                                }
                                            }
                                        }
                                    }
                                    .collect-active-icon {
                                        visibility: visible;
                                        .svgOut(#cfb400);
                                    }
                                }
                                &:hover {
                                    .operation-button {
                                        .normal-icon {
                                            visibility: visible;
                                        }
                                    }
                                }
                                .small-img-wrapper {
                                    height: 150/@px-unit;
                                    text-align: center;
                                    padding-bottom: 6/@px-unit;
                                    .card-image {
                                        height: 100%;
                                        max-width: 100%;
                                    }
                                }
                                .smallface-img-wrapper {
                                    height: 150/@px-unit;
                                    display: flex;
                                    padding-bottom: 6/@px-unit;
                                    .smallface-img {
                                        width: 50%;
                                    }
                                    .smallface-info {
                                        width: 50%;
                                        padding: 8/@px-unit;
                                    }
                                    .card-image {
                                        height: 100%;
                                        max-width: 100%;
                                    }
                                    .label-normal-container {
                                        padding: 0 !important;
                                    }
                                }
                                .similar-wrapper {
                                    margin: 0 8px 7px 5px;
                                    background: @ai_progress_default;
                                    height: 14/@px-unit;
                                    position: relative;
                                    color: @pageTextA;
                                    line-height: 1;
                                    .progress_item {
                                        display: inline-block;
                                        height: 100%;
                                    }
                        
                                    .progress_red {
                                        background: @ai_progress_red;
                                    }
                        
                                    .progress_orange {
                                        background: @ai_progress_orange;
                                    }
                        
                                    .progress_blue {
                                        background: @ai_progress_blue;
                                    }

                                    .percent-num {
                                        position: absolute;
                                        right: 0;
                                    }
                                }
                            }
                            .card-footer {
                                display: flex;
                                align-items: center;
                                padding-left: 8/@px-unit;
                                .label-div-Container {
                                    flex-grow: 1;
                                }
                                .channel-name {
                                    margin-right: 12/@px-unit;
                                }
                            }
                        }
    
                    }
                    .card-wrapper-selected {
                        border: 1/@px-unit solid @current !important;
                    }
                }
                .labelSlider-float-left, .labelSlider-float-right {
                    line-height: initial;
                }            
            }
        }
    }
}

.label-sort-btn-wrapper {
    height: 32/@px-unit;
}
.icon-sort-btn-wrapper{
    display: inline-block;
    div {
        line-height: 18/@px-unit;
    }
    .icosortActiveBtn{
        svg{
            &+{
                path:first-child{
                    fill: @current !important;
                }
            }
        }
    }
    .sort-icon-up, .sort-icon-down {
        .svgFont(16)
    }
}

.acuPick-search-backup {
    .check-group-wrapper {
        display: flex;
    }
    .fileType_blank {
        display: inline-block;
        width: 8/@px-unit;
        height: 8/@px-unit;
        margin-right: 10/@px-unit;
    }
    .fileType_general {
        background: @general;
    }
    .fileType_detect {
        background: @detect;
    }
    .fileType_alarm {
        background: @alarm;
    }
    .fileType_detectAlarm {
        background: @detectalarm;
    }
    .fileType_ivs {
        background: @ivs;
    }
    .fileType_pos {
        background: @pos;
    }
    .fileType_jpg {
        background: @jpg;
    }
    .fileType_card {
        background: @card;
    }
}
.startAndEndTimePicker {    .time-select-wrapper {        display: flex;        width: 100%;        &>div {            width: 100%;            padding-top: 0rem !important;            &>div {                width: 100%;                }        }        }}
._UploadFiles_ {        padding-top: inherit;     input {        width: 95%;        margin-right: 15/@px-unit;    }}.uploadBtn{    height: 10/@px-unit;}.uploadBtn_div{    display: flex;}
._RemoteAlarmOutput_ {        padding-top: inherit; }
._PtzLink_ {        height: 450px;    overflow-y: auto;    margin: 10px;}
._RemoteAlarmLight_ {        padding-top: inherit; }
._SetMore_ {        padding-top: inherit; }._setMoreView_ .checkboxListByRow .checkboxList {    .label-div-Container {                display: inline-block;        width: 50%;    }}
._AlarmOutChn_ {        padding-top: inherit; }
._RemoteAudio_ {        padding-top: inherit; }
.schedule-wrapper {    ._ScheduleComponent_ {        padding-top: 0px;        .button-container {            .ant-btn {                width: 100 / @px-unit;            }        }        .main-container {            border-color: transparent;            padding-top: 0px;            padding-bottom: 0px;            overflow: visible;            .label {                overflow: hidden;                white-space: nowrap;                text-overflow: ellipsis;            }            .copyBtn {                background-color: @buttonNormalBgN;                color: @buttonNormalTextN;                height: 32 / @px-unit;                line-height: unset;                width: 100 / @px-unit;                margin-left: 16 / @px-unit;                border: 1px solid @buttonNormalBorderN;            }            &:nth-of-type(odd) {                .dayplan {                    background-color: @schedulePlanOddBg;                }            }            .dayplan {                background-image: linear-gradient(90deg, @timePlanBorderN 1px, transparent 0),                    linear-gradient(90deg, @timePlanBorderN 1px, transparent 0);                background-size: 4.17% 99%;                background-color: @schedulePlanEvenBg;                border-color: #4b515c;                margin-bottom: 0px;                height: 0.714rem;                .handle {                    z-index: 1;                }                .track {                    &.timeplan-motion {                        background: @detect;                    }                    &.timeplan-ivs {                        background: @ivs;                    }                    &.timeplan-pos {                        background: @pos;                    }                    &.timeplan-gernal {                        background: @general;                    }                    &.timeplan-orange{                        background: @detectalarm;                    }                    &.timeplan-smd{                        background: @smd;                    }                    &.timeplan-fr{                        background: @faceRecognition;                    }                         &.whiteMode{                        background: @whiteMode                    }                               }            }        }        .circle {            &.timeplan-motion {                background: @detect;            }            &.timeplan-ivs {                background: @ivs;            }            &.timeplan-pos {                background: @pos;            }            &.timeplan-gernal {                background: @general;            }            &.timeplan-orange{                background: @detectalarm;            }            &.timeplan-smd{                background: @smd;            }            &.timeplan-fr{                background: @faceRecognition;            }               &.whiteMode{                background: @whiteMode            }           }        .timeplan-ruler {            border-bottom: 0.07142857rem solid @timePlanBorderN;            div{                border-left-color: @timePlanBorderN;            }            .ruler-text {                white-space: nowrap;            }        }        .slider-container {                        .dayplan{                &.general:hover{                    background: @planGeneral !important;                }                &.alarm:hover{                    background: @planAlarm !important;                }                &.mdtalarm:hover{                    background: @planDetectalarm !important;                 }                &.ivs:hover{                    background: @planIvs !important;                 }                &.pos:hover{                    background: @planPos !important;                 }                &.motion:hover,                &.AIMode:hover{                    background: @planDetect !important;                }                &.InfraredMode:hover{                    background: @planDetectalarm !important;                }                &.WhiteMode:hover{                                        background: @planIvs !important;                }                &.smd:hover{                    background: @planSmd !important;                }                                &.fr:hover{                    background: @planFaceRecognition !important;                }               }        }                                                                                                                                                    }    .ant-tooltip-inner {        background-color: @popover_BgN;    }    .ant-tooltip-arrow-content {        --antd-arrow-background-color: @popover_BgN;        background-color: @popover_BgN;    }    .timer-box {        display: flex;        .ant-input,        p {            background-color: @popover_BgN;            color: @pageTextN;        }    }    .label-normal-behind {        &.pl-0 {            padding-left: 0px !important;        }        .label-normal-container {            padding-top: 0px !important;            button {                margin-left: 1.5rem;            }        }    }    .ant-drawer-content-wrapper {        width: 935 / @px-unit;        top: 258 / @px-unit;        left: 50%;        transform: translateX(-50%);        .ant-drawer-content {            background: @modalBg;            border: 1px solid @modalBorder;            .ant-drawer-header {                background: @modalTitleBg;                border-bottom-color: @modalTitleBorder;                .ant-drawer-title {                    color: @modalTitleText;                }            }            .ant-drawer-body {                &:last-child {                    button {                        float: right;                        margin-left: 20 / @px-unit;                    }                }            }        }    }}
.event-handler {
    
    .ant-space-item {
        margin-right: 0px !important;
    }
    .flex{
        display: flex;
       .set-style{
            display: flex;
            align-items: center;
           .text{
               display: inline-block;
               width:180px;
               text-align: right;
               margin-right:10px;
           }
       }
       .left{
            .text{
                text-align: left;
            }
       }
       
    }
}

.fixed-button {    position: fixed;    bottom: 0;    right: 0;    height: 66 / @px-unit;    padding: 17 / @px-unit 10 / @px-unit;    background-color: @BottomBarBg;    border-top: 1px solid @BottomBarBorder;    &.halfwidth {        width: 87.5%;            }    &.fullwidth {        width: 87.5%;    }        .label-normal-container {        padding: 0 !important;        margin: 0 10px;    }}.absolute-button {    position: absolute;    bottom: 0;    right: 0;    left: 0;    height: 66 / @px-unit;    padding: 17 / @px-unit 10 / @px-unit;    background-color: @BottomBarBg;    border-top: 1px solid @BottomBarBorder;    width: 100% !important;                    .label-normal-container {            padding: 0 !important;            margin: 0 10px;        }}.fixed-button,.absolute-button {    button {        display: inline-block;    }    .left {        float: left;    }    .right {        float: right;    }}
._ChannelSelect_ {        padding-top: inherit;     .check-box-group-wrapped {        .ant-checkbox-group .ant-checkbox-wrapper {            width: 160 / @px-unit !important;            margin-top: 10 / @px-unit;        }        .label-normal-wrapper {            width: 100% !important;        }        .ant-checkbox-wrapper + .ant-checkbox-wrapper {            margin-left: 0;        }    }    width: 400 / @px-unit !important;    ._ChannelSelect_box {        overflow-y:auto;        height: 250 / @px-unit;    }  }
._PicViewList_ {        height: 700/@px-unit;    .ant-row{        max-height: 680/@px-unit;        overflow:auto;    }    .ant-spin-nested-loading {        .ant-spin-container {            .ant-list-empty-text{                display: none;            }        }    }}
._PicDetailsPanel_ {        padding: 0 16/@px-unit 16/@px-unit 16/@px-unit;     .label-normal-container {        padding: 0px !important;        height: 30/@px-unit;        .label-normal{            height: 30/@px-unit;        }        .label-normal-wrapper{            height: 30/@px-unit;        }    }}.ant-divider-horizontal.ant-divider-with-text{    margin: 10/@px-unit}.person_div{    padding-top: 5/@px-unit;}
._PicDetailsNonMotor_ {        padding: 16/@px-unit;;     padding: 0px !important;        height: 30/@px-unit;        .label-normal{            height: 30/@px-unit;        }        .label-normal-wrapper{            height: 30/@px-unit;        }}
._PicDetailsVehicle_ {        padding: 16/@px-unit;;     .label-normal-container {        padding: 0px !important;        height: 30/@px-unit;        .label-normal{            height: 30/@px-unit;        }        .label-normal-wrapper{            height: 30/@px-unit;        }    }}
._PicDetailHuman_ {    .label-normal-container {        height: 30/@px-unit;        .label-normal{            height: 30/@px-unit;        }        .label-normal-wrapper{            height: 30/@px-unit;        }    }    .redClass {        .label-normal  {            color: @errorColor;        }        color: @errorColor;    }}


._PicDetailOperateMonitor_ {
    .label-normal-container {
        height: 30/@px-unit;
        .label-normal{
            height: 30/@px-unit;
        }
        .label-normal-wrapper{
            height: 30/@px-unit;
        }
    }
    .redClass {
        .label-normal  {
            color: @errorColor;
        }
        color: @errorColor;
    }
}
.http-push {
    display: flex;
    .label-normal-behind {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        word-wrap: normal;
    }
}



@IEBrowerColor: @current;
._IPSpeakerModal_{
    .blueIEBrowser {
        .svgOut(@IEBrowerColor);
    }
    .manage-grid-successIcon {
        .svgOut(@successIcon);
        .svgFont(20);
    }
    .manage-grid-errorIcon {
        .svgOut(@errorColor);
        .svgFont(20);
    }
}

.IPSpeaker_wrap {
    display: flex;
    align-items: center;
}

.SoundLight {
    width: 100%;
    display: inline-block;
}
.SoundConfigSpace {
    margin-right: 48/@px-unit !important;
}

.audioFile {
    display: flex;
    .audioCheckBox{
        display: inline-block;
    }
    .audioSelect{
        display: inline-block;
    }
}



.MultipleLinkage_tableModal {
    .playTimes,
    .delayTime {
        text-align: center;
        line-height: 20 / @px-unit;
    }
    ._Table_  {
        .ant-table-body {
            .editable-cell-value-wrap {
                padding:  0px 0px 0px 0px;
            }
            .editable-cell-value-wrap:hover {
                border-width: 0px;
                padding:  0px 0px 0px 0px;
            }
        }
    }
    .MultipleLinkage_buttons {
        div {
            display: inline-block;
        }
    }
    .filename-selector-container {
        .label-normal-container, .label-normal-wrapper, .filename-selector {
            width: 100% !important;
        }
    }
}
.setting-modal {    .video {        width: 580px;        height: 450px;    }    .form {        width: 250px;        height: 450px;        .label {            width: 5.5rem !important;        }        .label-normal {            width: 5.3rem !important;        }        .wrapped {            width: auto !important;            padding-top: 5px;        }        .label-wrapper {                        transform: translateY(-1px);            .labelSlider{                .labelSlider-center{                    margin-left: 0;                }            }        }        .label-behind {            position: absolute;            right: 45px;        }        .label-div-Container {            width: 350px;        }        .area {            width: 22px;            height: 22px;            cursor: pointer;        }        .selected {            border: 3px solid #13161b;        }    }}
.Ocx_download_bottom{    position: fixed;    text-align: center;    bottom: 0;    left: 0;    width: 100%;    padding: 10/@px-unit 0;    border-top: 1/@px-unit solid @ocxBorder;    background: @ocxDownloadBar;    color: .color_N(@ocxDownloadBar)[];    z-index: 10000;    span{        padding-top: 6/@px-unit;        display: inline-block;    }    a {        text-decoration: underline;        color: @anchorTextN;        &:hover {            color: @anchorTextA;        }    }    .closeBtn{        float: right;        margin-right: 20/@px-unit;        border: 1/@px-unit solid @buttonNormalBorderN;        background-color: @buttonNormalBgN;        color: .color_N(@buttonNormalBgN)[];        border-radius: 4/@px-unit;        padding: 4/@px-unit 10/@px-unit;        cursor: pointer;        &:hover{            color: .color_A(@buttonNormalBgN)[];        }    }}.plugin_confirm_mask {    position: fixed;    top: 0;    left: 0;    right: 0;    bottom: 0;    height: 100%;    z-index: 1000;    background-color: rgba(0, 0, 0, 0.45);}
.H5 {    z-Index: 9999;    position: relative;    .h5player {        background-color: @ocxBg;        .h5player_header {            background-color: @ocxHeaderBg;            color:.color_N(@ocxHeaderBg)[];            height: 15/@px-unit;            width: 100%;            display: flex;            justify-content: space-between;        }        .h5player_header_left {            height: 15/@px-unit;            font-size: 12/@px-unit !important;            margin-left: 2/@px-unit;            span {                padding-right: 10/@px-unit;                span {                    padding-left: 10/@px-unit;                }            }        }        .h5player_header_right {            display: flex;            justify-content: flex-end;            height: 15/@px-unit;            font-size: 12/@px-unit !important;                        .cus_icons{                .svgOut(.color_N(@ocxHeaderBg)[]);                font-size: 12/@px-unit !important;                margin-right: 2/@px-unit;                display: flex;                justify-content: flex-end;                &:hover{                    .svgHover(@homeTaskIconColorA);                }            }            .active .cus_icons{                .svgOut(.color_A(@ocxHeaderBg)[]);            }        }        .h5playerProptip {            width: 100%;            height: 96/@px-unit;            position: absolute;            text-align: center;            font-weight: 700/@px-unit !important;            padding-top: 15/@px-unit;            font-size: 30/@px-unit;                        color: .color_A(@ocxBg)[];            top: 50%;            margin-top: -40/@px-unit;        }    }   }
.Ocx_download_center{    z-Index: 9999;    position: relative;    width: 100%;    height: 100%;    background-color: @ocxBg;    .pluginMsg {        left: 50%;        top: 50%;               transform: translateX(-50%);        position: absolute;        width: auto;        max-width: 80%;        border-bottom: 1/@px-unit dashed @pageTextN;        a, svg{            color: @pageTextN;        }        &:hover {            border-bottom: 1/@px-unit dashed @current;            a, svg{                 color: @current;            }        }    }}
.homeside-enter,.homeside-appear {    opacity: 0;}.homeside-enter-active,.homeside-appear-active {    opacity: 1;    transition: opacity 200ms ease-in;}.homeside-enter-done {    opacity: 1;}.homeside-exit {    opacity: 1;}.homeside-exit-active {    opacity: 0;    transition: opacity 200ms ease-in;}.homeside-exit-done {    opacity: 0;}.clearfix {    &::after {        content: '.';        display: block;        height: 0;        visibility: hidden;        clear: both;    }}.header-contain {    height: @navMenuHeight;    background-color: @navBg;    color: @navMenuTextN;    z-index: 1000;        border-bottom: 1px solid @navMenuBorderN;        .svgOut(.color_N(@navBg)[]);     .home_header_right {        display: flex;        justify-content: flex-end;        align-items: center;        padding-right: 0.5rem;        height: @navMenuLineHeight;        > span.header-time:first-child {            font-size: @navMenuFontN;            min-width: 235 / @px-unit;        }        .headerDivider {            height: @navMenuLineHeight;            top: 0;            margin: 0 0.5rem;        }    }    .home_header_left {        display: flex;        justify-content: flex-end;        align-items: center;        height: @navMenuLineHeight;        > div:first-child {            margin-left: 8px;        }    }}.header-time {    overflow: hidden;    text-overflow: ellipsis;    white-space: nowrap;}.homaMain-contain {    height: calc(100vh - @navMenuHeight);    position: absolute;    width: 100%;    overflow-x: auto;}.MainPageTip {    text-align: center;}.PasswordExpired {    .PasswordExpiredTip {        display: flex;        .cus_icons:not(.disabled_icons) svg path:first-child {            fill: @warningColor;        }        .Tip {            margin-left: 5 / @px-unit;            margin-top: 5 / @px-unit;        }    }    .PasswordNoTip {        margin-left: 10 / @px-unit;    }}.HomeQRCode {    display: flex;    justify-content: space-around;    .QRCode {        width: 212 / @px-unit;        height: 212 / @px-unit;        padding: 10 / @px-unit;        background-color: @QRCodeBg;        margin: 10 / @px-unit 20 / @px-unit;    }    .ImageCode {        .ant-image {            width: 212 / @px-unit;            height: 212 / @px-unit;            margin: 10 / @px-unit 20 / @px-unit;        }    }    .DescribeText {        text-align: center;    }}
._LogManage_ {    .Type{        display: flex;                width: 100%;        .TimeRange{            display: flex;            align-items: center;            margin-left: 15 / @px-unit;            height: 48 / @px-unit;        }        .Search{            margin-left: auto;            right: 20 / @px-unit;        }    }    .DateRange{        display: flex;        justify-content: space-between;        align-items:flex-end;    }    .Clear{        display: flex;        float: right;        margin-top: 40 / @px-unit;        .label-div-Container{            margin-left: 10 / @px-unit;        }    }    .pageLine{        display: flex;        float: left;        margin-top: 10 / @px-unit;        .anticon-left, .ant-pagination-simple-pager, .anticon-right{            color: @pageTextA        }               .pageTip{            position: absolute;            right: 16 / @px-unit;        }    }}.LogManage_detailModal{    width: 650/@px-unit !important;    .loginfo_Table{        height: 291/@px-unit;            }    .ant-modal-footer{        height: 53 / @px-unit;        .LogManage_detailButton{            display: flex;            float: right;            .label-div-Container{                margin-left: 10 / @px-unit;            }        }    }    ._Table_ .ant-table {        max-height: 290 / @px-unit;        overflow-y: auto;    }}.FileBackupEncrypt{    width: 100 / @px-unit;}.TimeFormat{    .ant-picker-header-view{        color: @pageTextA;    }}
._PreviewIndexView_ {                padding-top: inherit;     height: 100%;    display: flex;       &left {        width: 240 / @px-unit;        background-color: @preview_Left_Bg;        height: 100%;        display: flex;        flex-direction: column;        justify-content: space-between;        &_fastPreview {            height: auto;            flex: 0 0 auto;        }        &_channelList {            flex: 1 1 auto;            overflow-y: auto;            margin-top: 20 / @px-unit;            border-top: 1px solid @pageBorderN;            border-bottom: 1px solid @pageBorderN;        }        &_bottomBtn {                        flex: 0 0 auto;            margin-bottom: 40 / @px-unit;        }    }    &center {        border-left: 1px solid @ocx_Border;        border-right: 1px solid @ocx_Border;        display: flex;        flex-direction: column;        justify-content: space-between;        flex: 1 1 auto;        &_plugin {            display: flex;            flex: 1 1 auto;            flex-flow:inherit;            background-color: @preview_center_plugin_Bg;            .ocxLocation{                flex-grow:1;            }        }        &_bottom {            height: 60 / @px-unit;            flex: 0 0 auto;            background-color: @preview_center_bottom_Bg;            display: flex;            justify-content: space-between;            padding: 0 10 / @px-unit;                        .cus_icons{                .svgOut(.color_N(@preview_center_bottom_Bg)[]);                &.active_icons {                    .svgOut(@current);                }            }            &_left {                display: flex;                align-items: center;            }            &_right {                display: flex;                align-items: center;            }        }    }    &ai_preview {        width: auto;        height: 100%;    }    &right {        width: 200 / @px-unit;        background-color: @preview_Right_Bg;                overflow-y: auto;                ._preview_right_header_title {            height: 35 / @px-unit;            background-color: @preview_right_tabTitle_Bg;            color: .color_N(@preview_right_tabTitle_Bg)[];            display: flex;            align-items: center;            width: 200 / @px-unit;            padding-left:4 / @px-unit;        }        .ptz_set_pd {            padding-left: 15 / @px-unit;        }        .ant-layout-sider-children {            display: flex;            flex-direction: column;        }        &_alarmout {            min-width: 200/ @px-unit;            ._ChannelGroup_ div:nth-child(2) .chn_btn {                margin-left: 0 !important;            }            .ant-space-item{                padding-left: 10/@px-unit;            }        }    }    ._PreviewIndexView_left{        .ant-divider-horizontal{            margin:10 / @px-unit 0 ;        }    }    ._AIPreviewIcon_.isActive {        .svgOut(@current);    }}
.login-container {    height: 100%;    width: 100%;    .login-backgroundImage {        position: absolute;        height: 100%;        width: 100%;        left: 0;        top: 0;        background-size: cover;                background-image: url('/static/media/login_bg_@{theme}.jpg');    }    .login-box {        background-color: transparent;        position: absolute;        left: 50%;        top: 40%;        margin-left: -190 / @px-unit;        margin-top: -150 / @px-unit;        .login-logo {            height: 60 / @px-unit;            width: 330 / @px-unit;            background-size: contain;            margin-bottom: 30 / @px-unit;            background-repeat:no-repeat;            background-position-x: center;            background-image: url('/custom_logo/web_logo.png');            background-repeat:no-repeat;        }                &.logo-left{            display: flex;            flex-direction: row;            .login-logo{                margin-top: 20%;            }        }        &.logo-right{            display: flex;            flex-direction: row-reverse;            .login-logo{                margin-top: 20%;            }        }    }}.login-container .login-box .Login-Form,.NamePwdInput {    .pd-active>svg path:first-child{        fill:@pdEyeIconA;        opacity: 0.5;    }    .pd-default>svg path:first-child{        fill:none;        opacity: 0.5;    }    .ant-input-affix-wrapper-focused {        .pd-active>svg path:first-child{            fill:@pdEyeIconA;            opacity: 1;        }        .pd-default>svg path:first-child{            fill:none;            opacity: 1;        }    }    .label-normal-wrapper {        width: 100%;    }    background-color: transparent;    text-align: center;    margin-top: 10 / @px-unit;        .ant-input{        &:not(:focus){            &:hover{                border-color: @formInputBoderN;            }        }        &:focus{            opacity: 1;        }    }    .ant-input,    .ant-select{        background-color: transparent;        color: @loginFormInputText;        height: 100%;        font-size: 18 / @px-unit;        &:not(.ant-select-show-arrow){            opacity: 0.5;        }        .ant-select-selection-item{            opacity: 0.5;        }    }    .ant-select{        &.ant-select-open{            opacity: 1;            svg{                fill:@formInputSvgA !important;            }            .ant-select-selection-item{                opacity: 1;            }        }    }    .ant-select:not(.ant-select-customize-input) .ant-select-selector{        background-color: @loginFormInputBg;    }    .ant-select-single.ant-select-open .ant-select-selection-item{        color: @loginFormInputText;    }    .ant-btn:not(.btn-link):not(.ant-btn-link).ant-btn-primary{        background-color: @loginPrimaryBtnBg;        border-color: @loginPrimaryBtnBorder;    }    .ant-btn:not(.btn-link):not(.ant-btn-link).ant-btn-primary:hover:not(:focus):not([disabled]) {        background-color: @loginActiveBtnBg;        border-color: @loginActiveBtnBorder;    }    .ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector{        box-shadow: none;    }    .ant-select-selector{        border-color: @loginFormInputBorder;    }    .ant-select:not(.ant-select-disabled):hover .ant-select-selector{        border-color: @loginFormInputBorder;    }    .ant-select.ant-select-open:not(.ant-select-disabled):hover{        .ant-select-selector{            border-color: @formInputBorderA;        }    }    .ant-select:not(.ant-select-disabled):hover{        border-color: @loginFormInputBorder;        svg{            fill:@formInputSvgN;        }    }    .ant-input-affix-wrapper,    .label-normal-wrapper {        display: flex;        height: 40 / @px-unit;        background-color: @loginFormInputBg;        border-color: @loginFormInputBorder;        color: @formInputTextN;    }    .ant-input-affix-wrapper-focused {        box-shadow: 0 0 0 0;        border-color: @formInputBorderA;        .ant-input-prefix {            .svgOut(@pdEyeIconA);        }        .ant-input {            opacity: 1;        }    }    .ant-input-suffix:hover {        color: rgb(255, 96, 184);    }    .ant-input-suffix:focus {        color: rgb(255, 96, 184);    }    .ant-input-suffix {        color: yellow;    }    input::-webkit-input-placeholder {        color: #616265    }    input::-ms-input-placeholder {        color: #616265    }    .login-icon {        color: @loginIconSvg;    }    .ant-row {                .ant-col {            padding-top: 0 !important;            padding-bottom: 0 !important;                    }    }    .login-button {        font-size: 20 / @px-unit;         width: 100%;        height: 40 / @px-unit;    }    .login-forget {        font-size: 13 / @px-unit;        margin: 5 / @px-unit 0 30 / @px-unit 0;                padding-left: 10 / @px-unit;        float: right;        cursor: pointer;        color: @loginForgetPwdTextN;        &:hover {            color: @loginForgetPwdTextA;        }    }    .ant-select-selector {        height: 40 / @px-unit;    }}.nextTag_current{    path:first-child{        fill: @current !important;    }}.nextTag:hover{    svg path{        fill: @modalContentText !important;    }}.modalContentContainer{    height: 510 / @px-unit;    overflow-y: auto;    .modalHeader{        display: flex;        align-items: center;        justify-content: center;        border-bottom: 1 / @px-unit solid @modalFooterBorder;        padding-bottom: 18px;        .headerText{            text-align: center;            width: 200 / @px-unit;            font-size: 16px;        }        .headerText_current{            text-align: center;            width: 200 / @px-unit;            color: @current;            font-size: 16px;        }    }    .resetTip{        margin: 175 / @px-unit;        width: 475 / @px-unit;    }    .ResetType{        margin-left: 30 / @px-unit;        .resetSelect{            display: flex;            .SerialNo{                margin-left: 80 / @px-unit;                align-items: center;                display: flex;            }        }        .resetContent{            display: flex;            .QR_background{                width: 292 / @px-unit;                height: 292 / @px-unit;                padding: 12 / @px-unit;                background-color: @formInputTextN;            }            .QRCodeTip{                width: 250 / @px-unit;                margin-left: 40 / @px-unit;                margin-top: 124 / @px-unit;                word-break: break-all;            }            .QRCodeTipEmail {                width: 250 / @px-unit;                margin-left: 40 / @px-unit;                word-break: break-word;            }            .ForeignDevice{                width: 250 / @px-unit;                margin-left: 40 / @px-unit;                word-break: break-all;            }        }    }    .CodeSend{        color: @successColor;    }    .Safecode {        width:100%;        .label-normal-container  {            width: 100%;            .label-normal-wrapper {                width:70% !important;            }        }    }    .PasswordPage{        margin-left: 50 / @px-unit;        margin-top: 40 / @px-unit;        .PasswordItem{            margin-bottom: 40 / @px-unit;        }        .PasswordConfirm{            display: flex;            .PasswordTip{                width: 200 / @px-unit;                margin-left: 12 / @px-unit;            }        }        .PasswordInput{            width: 260 / @px-unit;        }        .passwordCheck_Box{            width: 260 / @px-unit;        }    }}.passwordSyncSuccess{    color:@successColor;}.passwordSyncFail{    color:@errorColor;}.DeviceInit{    height: auto;            .FlexLine{        display: flex;        margin-top: 30 / @px-unit;        .PasswordTip{            width: 260 / @px-unit;            margin-left: 12 / @px-unit;        }    }    .modalHeader{        display: flex;        align-items: center;        padding-left: calc(50% - 1.097*@px-unit);        border-bottom: 1 / @px-unit solid @modalFooterBorder;        padding-bottom: 18px;        .headerText{            text-align: center;            width: 200 / @px-unit;        }        .headerText_current{            text-align: center;            width: 200 / @px-unit;            color: @current;        }    }    .quick{        justify-content:center;        padding-left:0;    }    .InitItem{        margin-left: 40 / @px-unit;        margin-top: 40 / @px-unit;        .quickInitLicenceNoted{            white-space: nowrap;            text-decoration: underline;            cursor: pointer;            display: inline-block;        }    }    .IsInherit{        border-bottom: 1 / @px-unit solid @modalFooterBorder;        margin-top: 20 / @px-unit;        margin-bottom: 20 / @px-unit;    }    .InitQuestion{        margin-left: 120 / @px-unit;    }}.InitGuide_box {    overflow-y: auto;    overflow-x: hidden;}.InitGuide{    height: auto;        height: 600px\0;    max-height: 680 / @px-unit;    width: 80%;            margin-left: 90 / @px-unit;    >div {        width: 700 / @px-unit;    }    .startAndEndTimePicker,.label-normal-behind {        padding: 0!important;        .label-normal-container {            padding: 0!important;        }    }    .label-normal-wrapper > .ant-picker {        width: 125 / @px-unit;    }    .label-date-picker > .ant-picker {        width: 135 / @px-unit;    }    .autoCheckNote{        width: 658/@px-unit;    }}.InitGuide_Law{    height: 600 / @px-unit;    .HeaderTab{        display: flex;        cursor: pointer;        .Tab_Current{            display: flex;            width: 240 / @px-unit;            text-align: center;            height: 50 / @px-unit;            background: @current;            justify-content: center;            align-items: center;            border: 1px solid @tabBorder;            color: @pageTextA;        }        .Tab{            display: flex;            width: 240 / @px-unit;            text-align: center;            height: 50 / @px-unit;            background: @tabBgN;            align-items: center;            justify-content: center;            border: 1px solid @tabBorder;        }    }    .LegalText{        height: 540 / @px-unit;        padding: 20 / @px-unit;        margin-top: 20 / @px-unit;        overflow: auto;    }    .LicenceNoted{        margin-top: 20 / @px-unit;        margin-left: 20 / @px-unit;    }}
._PlaybackIndex_ {                height: 100%;    width: 100%;    display: flex;    overflow: hidden;    &layout {        height: 100%;        width: 100%;        display: flex;    }    &center {        background-color: @ocxBg;        border-left: 1px solid @ocx_Border;        border-right: 1px solid @ocx_Border;        display: flex;        flex-direction: column;        justify-content: space-between;        flex: 1 1 auto;        &_plugin {            flex: 1 1 auto;            display: flex;            flex-flow: inherit;             .ocxLocation {                flex-grow: 1;            }        }            }    &right {                width: 308px;        background-color: @playback_Right_Bg;        .ant-layout-sider-children {            display: flex;            flex-direction: column;        }    }}
._LeCheng_ {    .tip {        width: 60rem;    }    .qrcodes {        display: flex;        width: 800px;        height: 350px;        margin-top: 30px;        margin-left: 20px;        .qrbox {            display: flex;            width: 300px;            height: 250px;            flex-direction: column;            justify-content: space-between;            .qrImg {                width: 215px;                height: 215px;                padding: 5px;                background-color: @QRCodeBg;                img {                    width: 100%;                    height: 100%;                }            }            p {                margin: 0;                font-size: 14px;                font-weight: 400;                color: .color_N(@pageBodyBg)[];            }        }    }}.modal-button {    button {        width: 100%;    }}
._SNMP_ {    .subform {        display: flex;        justify-content: space-between;        .box {            width: 50%;        }    }}
._QuotaMain_ {    .mode-changer {        display: flex;        button {            width: 300/@px-unit;            overflow: hidden;            padding: 0 10/@px-unit;            text-overflow: ellipsis;            white-space: nowrap;        }    }    .scalstat-btn {        overflow: hidden;        text-overflow: ellipsis;        white-space: nowrap;    }    .MainPage {        padding: 0 !important;    }}
._NetCloud_ {    .tip {        width: 20rem;        word-wrap:break-word;        word-break:break-all;    }    .qrcodes {        display: flex;        width: 800px;        height: 350px;        margin-top: 30px;        margin-left: 20px;        .qrbox {            display: flex;            width: 300px;            height: 250px;            flex-direction: column;            justify-content: space-between;            .qrImg {                width: 215px;                height: 215px;                padding: 5px;                background-color: @QRCodeBg;                img {                    width: 100%;                    height: 100%;                }            }            p {                margin: 0;                font-size: 14px;                font-weight: 400;                color: .color_N(@pageBodyBg)[];            }        }    }    .step{        height: 212px,    }    .wrap{        display: flex;        flex-direction: row;        justify-content: flex-start;        .left_part{            min-width: 40rem;        }    }}.modal-button {    button {        width: 100%;    }}
._Multicast_ {    padding: 22 / @px-unit;    .behindSpan {        padding: 5 / @px-unit;    }}
._TCPIP_ {    width: 100%;    .table-item {        margin: 0;        text-align: center;        .delete-icon {            cursor: pointer;            &:hover {                svg {                    & + {                        path:first-child {                            fill: #f00 !important;                            opacity: 0.3 !important;                        }                    }                }            }        }    }    .info-container {        padding: 0 10px;        margin-top: 10px;        border: 1px solid #4b515c;        .label-normal-wrapper {            width: 150px !important;        }    }    .input-enabled:hover:not(.ant-input-disabled) {            }    ._Table_ {        .ant-table-content {            min-height: 260 / @px-unit;        }    }}._RouteTable_ {    width: 100%;    .table-header {        user-select: none;    }    .delete-icon {        cursor: pointer;        &:hover {            svg {                & + {                    path:first-child {                        fill: #f00 !important;                    }                }            }        }    }}.netCardMenber_checkbox .ant-checkbox-wrapper{    margin-left: 0;    margin-right: 6 / @px-unit;}.netCardMenber_checkbox .ant-checkbox-wrapper:last-child{    margin-right: 0;}.testSuc{    color: rgb(0, 255, 0);    width: 250 / @px-unit;}
._WIFI_ {    .header-btn-group {        display: flex;        justify-content: space-between;        .btn {            align-self: center;        }    }    .wifi-info-container {        padding: 0 20px;        margin-top: 10px;        border: 1px solid rgb(75, 81, 92);        .boss {            color: #fff;            font-weight: bold;        }        p {            margin-bottom: 5px;        }    }    .table-body {        margin: 0;        text-align: center;    }    .ant-table-body {        min-height: 150px;    }    .wifi {        & + {            path:second-child {                fill: @iconActiveWifi;             }        }        &.s_05 {                        .svgOut(@iconActiveWifi);        }    }}
._Pppoe_ {                padding-top: inherit;     }
._RecordBack_ {    padding-top: inherit;    .editable-cell-value-wrap {        height: auto;    }    ._Table_ .ant-table-body {        min-height: 600 / @px-unit;    }}.recordinfo-footer-btn {    display: inline-block;    .label-div-Container {        display: inline-block;        &:first-child {            margin-right: 10 /@px-unit;        }    }}
._ClusterDevice_ {                padding-top: inherit;     }
._Port_ {                padding-top: inherit;     }


.fix-header-content{
    display        : flex;
    justify-content: center;

    .fix-header-content-item {
        text-align: center;
        cursor    : pointer;

        .fix-header-content-title {
            color   : .color_N(@--primary-6)[];
        }
    }

    .active-item {
        background-color: @--primary-7;
    }
}
._BottomPanel_ {        display: flex;    flex-direction: column;    background-color: @preview_center_bottom_Bg;    ._BottomPanel_bottom_btn {        height: 50px;        display: flex;        align-items: center;        overflow: hidden;    }    ._BottomPanel_bottom_timeline {        height: 92px;    }    ._BottomPanel_bottom_select {        .ant-checkbox-disabled + span {            color: .color_D(@preview_center_bottom_Bg) [];        }    }            }
._PbRightPanel_ {    display: flex;    flex-direction: column;    align-items: center;    position: relative;    height: 100%;    &bottom {        width: 100%;        height: 60 / @px-unit;        padding: 0 10px 4px 10px;        margin-top: auto;        display: flex;        justify-content: space-between;        align-items: center;        background-color: @playback_Right_Bg;    }    &bottom_x {        width: 100%;        height: 60 / @px-unit;        padding: 0 10px 4px 10px;        margin-top: auto;        display: flex;        justify-content: flex-end;        align-items: center;        background-color: @preview_Right_Bg;    }    &bottom_item {        width: 66 / @px-unit;        height: 40 / @px-unit;        text-align: center;                        background-color: @playback_Right_iConBtn_bg;        border: 1 / @px-unit solid @buttonNormalBorderN;        display: flex;        align-items: center;        justify-content: center;    }    &bottom_icon {        font-size: 30 / @px-unit !important;    }    .label-normal-wrapper {        width: 290px !important;    }    ._PbRightPanel_bottom_itemLeft{        width: 100%;        height: 40 / @px-unit;        text-align: center;        display: flex;        align-items: center;        justify-content: center;        .label-normal-wrapper {            width: 50px !important;        }    }    ._PbRightPanel_chl_divider {        margin: 5 / @px-unit 0;    }    ._PbRightPanel_chl_table {        flex: 1;        overflow: hidden;        min-height: 150 / @px-unit;        width: 290px;        margin-top: 14 / @px-unit;        .ant-table-body {            min-height: auto !important;            max-height: none !important;            -ms-max-height:none  !important;            tbody {                .ant-table-row {                    &.ant-table-row-selected {                        td {                            background: transparent;                        }                    }                    .ant-table-cell-ellipsis {                        text-align: left !important;                        &.ant-table-column-sort {                            background: transparent;                        }                    }                }            }        }        .ant-checkbox-indeterminate .ant-checkbox-inner {            border: 1px solid @pageBorderN;        }        ._Table_ {            height: 100%;            .ant-table {                & > .ant-table-container {                    display: flex;                    height: 100%;                    flex-direction: column;                    .ant-table-header{                        overflow: visible !important;                        height:auto;                    }                    tr {                        td {                            height: 40px;                        }                    }                    th {                        height: 40px !important;                    }                }                ::-webkit-scrollbar {                    width: 0px;                }            }            .ant-table-fixed-header{                height: 95%;            }            .m-table-showEmpty {                height: 100%;                .ant-table-wrapper {                    height: 100%;                    .ant-spin-nested-loading {                        height: 100%;                        .ant-spin-container {                            height: 100%;                        }                    }                }            }        }    }    ._Table_ div:first-child{        height: 100%;    }    .ant-table-thead div:first-child{        height: auto ;    }    ._PbRightPanel_fish_eye {        width: 290px !important;    }    ._Eptz_ {        width: 290px !important;        .label-normal-wrapper {            width: unset !important;        }        .range-content .label-normal-wrapper{            width: 90 / @px-unit !important;        }    }    .right_orgin_hide {        display: none;    }    .right_orgin_flex {        display: flex;        flex-direction: column;        height: 100%;    }    .calender_box {        display: flex;        flex-direction: column;        align-items: center;    }    .chl_table {        height: 350 / @px-unit;    }    .playback_channel_show {        display: flex;        justify-content: center;        align-items: center;    }    .playback_channel_none {        display: none;    }    ._PbRightPanel_rightpanel_show {        display: flex;        flex-direction: column;        align-items: center;        padding: 0px 8px;        height: 100%;    }    ._PbRightPanel_rightpanel_hide {        display: none;    }    .mask_datum {        position: relative;        width: 100%;    }    .mask_panel {        position: absolute;        top: 0;        left: 0;        height: 90%;        width: 100%;        z-index: 10;                    }    .mask_panel_show {        display: block;    }    .mask_panel_hide {        display: none;    }}
._P2P_ {        word-break: keep-all;    .tip {        width: 60rem;    }    .qrcodes {        display: flex;        width: 800px;        height: 350px;        margin-top: 30px;        margin-left: 20px;        .qrbox {            display: flex;            width: 300px;            height: 350px;            flex-direction: column;            justify-content: space-between;            .qrImg {                width: 210px;                padding: 5px;                background-color: @QRCodeBg;            }            p {                margin: 0;                font-size: 14px;                font-weight: 400;                color: .color_N(@pageBodyBg)[];            }        }    }}.modal-button {    button {        width: 100%;    }}
._UPnP_ {                padding-top: inherit;     }
.plateNoClass {    padding-left: 0 !important;}
._Quota_ {    .quota-bleaSpace {        display: flex;        .warning-tip {            color: @errorColor !important;        }    }    .unquotad-warning-tip {        width: 1000/@px-unit;        color: @errorColor !important;    }    .hdd-mode {        display: flex;        justify-content: space-between;        align-items: center;    }    #bitrate-container {        .ant-select-disabled.ant-select-multiple .ant-select-selection-item {            color: @pageTextD;        }        .ant-select-multiple.ant-select-disabled.ant-select:not(.ant-select-customize-input) .ant-select-selector {            background: @pageBodyBg;        }        .ant-select-disabled.ant-select-multiple .ant-select-selection-item {            border-color: @pageBorderN;        }    }}
._BottomPanel_bottom_select {    height: 50px;    display: flex;    flex-direction: row;    justify-content: space-between;    .bottom_select_left {        width: 180 / @px-unit;        height: 50px;        line-height: 50px;        padding: 0 / @px-unit 16 / @px-unit;                               color: .color_N(@--toolbar-bg)[];    }    .bottom_select_center {        flex-grow: 1;        height: 50px;        line-height: 50px;        display: flex;        flex-direction: row;        align-items: center;        position: relative;                .label-div-Container{                                    .ant-checkbox-wrapper{                color: .color_N(@--toolbar-bg)[];            }        }    }    .bottom_select_right {        width: 260 / @px-unit;        height: 50px;        line-height: 50px;        padding: 16 / @px-unit;        display: flex;        flex-direction: row;        align-items: center;                .operation-icon{            .svgOut(.color_N(@--toolbar-bg)[]);        }    }    .bottom_select_slider {        width: 168 / @px-unit;    }    .mask_center {        position: absolute;        top: 0;        left: 0;        height: 100%;        width: 100%;        z-index: 2;                    }    .mask_center_show {        display: block;    }    .mask_center_hide {        display: none;    }}
._CrowdDensity_{    .active{        svg path:nth-of-type(1){            fill:@current!important;        }    }}
.record-device-info, .record-device-info {    display: flex;    .label-normal-wrapper {        width: 150/@px-unit !important;    }}.recordBackModal {    ._Table_ .ant-table-body {        min-height: 500 / @px-unit;    }}
._ChannelList_ {                    height: 100%;    padding-bottom: 14/@px-unit;    @channelFontColor:.color_N(@preview_Left_Bg)[];    .chnlist_tooltip {        .ant-tooltip-content {            .ant-tooltip-inner {                word-spacing: normal;                word-break: break-word;            }        }    }    .chItem {        display: flex;        align-items: center;        padding: 3/@px-unit;        height:31/@px-unit;        cursor: pointer;        &_cameraIcon {            .svgOut(@channelFontColor);            margin-left: 20/@px-unit;            width: 30/@px-unit;            height: 30/@px-unit;        }        ._cameraIcon_active {            .svgOut(@iconColorA);        }        &_title {            margin-left: 15/@px-unit;            width: 120/@px-unit;            color: @preview_ChnlTextN;        }        &:hover {            .chItem_title {                color: .color_N(@preview_ChnlBgA)[]            }            background-color: @preview_ChnlBgA;            .chItem_btn {                display: inline-block;            }        }        &_btn {            padding: 0 !important;            border: 0 !important;            background: none !important;            height: 30/@px-unit;            display: none;        }        .chItem_btn{            display: none;        }        .label-div-Container {            .label-normal-container  .label-normal-wrapper  {                width: 50/@px-unit !important;            }        }    }}
._VideoOperationPanel_ {    padding: 4 / @px-unit;    display: flex;    align-items: center;    .operation-icon {        font-size: 32 / @px-unit;        padding: 2 / @px-unit;                .svgOut(.color_N(@preview_center_bottom_Bg)[]);        &.disabled_icons{            .svgDisabled(.color_D(@preview_center_bottom_Bg)[]);        }    }    .operation-divider {        height: 26 / @px-unit;        margin-top: 4 / @px-unit;        background-color: @ocxBg;    }    .audio-box {        display: flex;        align-items: center;    }    .intel_detect {        display: inline-block;        position: relative;    }    .intel_detect_inner {        height: 40 / @px-unit;        background-color: @tableOddBgN;        position: absolute;        top: 0;        left: 40 / @px-unit;        padding: 2 / @px-unit 0 0 10 / @px-unit;        z-index: 10;    }    .intel_detect_show {        display: inline-block;    }    .intel_detect_hide {        display: none;    }    .cut_box {        display: flex;        flex-direction: row;        align-items: center;        padding-left: 10 / @px-unit;        .ant-picker {            width: 122px !important;        }        .label-normal-container a {                        color: @buttonNormalBorderN;        }        .label-normal-wrapper {            height: 32px;            line-height: 32px;        }        .ant-picker {            height: 32px;        }        .ant-picker-input {            height: 22px;        }    }    .cut_line {        .label-div-Container {            width: 170px !important;        }    }    .cut_show {        display: flex;    }    .cut_hide {        display: none;    }    .progress_text {                width: auto;    }    .cut_operation {                        height: 32px;                text-align: center;        width: 30px;        background-color: @buttonNormalBgN;        border: 1px solid @buttonNormalBorderN;        display: flex;        justify-content: center;        align-items: center;    }    .cur-icon {        .svgFont(28);    }    .ivs-color {        svg {            & + {                path:first-child {                    fill: @current !important;                 }            }        }    }    .audio-box-slider {        width: 120 / @px-unit;    }    .select-ivs-btn {        width: 48px;    }    .ivs-button {        border-color: @current !important;        color: @current !important;    }}._operation_smd_ {    .label-normal-container {        padding: 4px 0 !important;    }    .labelText-wrapper {        width: 90px;    }}.cutPanel_rangePicker{    @media screen and (max-width: 1280px) {        min-width: 300 / @px-unit;    }}
._FastPreview_ {                    height: 100%;    padding: 0!important;        @fastPreviewBtnColor:.color_N(@preview_Left_Bg)[];        @fastPreviewBtnColor_A:.color_A(@preview_ChnlBgA)[];        &up {        display: flex;        align-items: center;        justify-content: flex-start;        margin: 7/@px-unit 0!important;        cursor: pointer;        color:@fastPreviewBtnColor;        &:hover {            background-color: @preview_ChnlBgA;            color: @fastPreviewBtnColor_A;            .icon_default{                svg path:nth-of-type(1){                     fill:@fastPreviewBtnColor_A!important;                }                svg path:nth-of-type(2){                    fill: .color_A(@preview_ChnlBgA)[@inverse] !important;                }                svg path:nth-of-type(3){                    fill:@fastPreviewBtnColor_A!important;                }            }        }        &_icon{            margin:0 30/@px-unit 0        }    }    .active{        color:@pageTextA;        background-color: @fastPreview_btnActBg;    }    .icon_active{        svg path:nth-of-type(1){            fill:@successColor!important;        }        svg path:nth-of-type(2){            fill:@iconBgColor!important;        }        svg path:nth-of-type(3){            fill:@successColor!important;        }    }    .icon_default{        svg path:nth-of-type(1){            fill:@fastPreviewBtnColor!important;        }        svg path:nth-of-type(2){            fill:@iconBgColor!important;        }        svg path:nth-of-type(3){            fill:@fastPreviewBtnColor!important;        }    }    &wrap{        height:32/@px-unit;        width:105/@px-unit;        position: relative;        border:1px solid @fastPreview_border;    }    .btnClass{        position: absolute;        background: transparent!important;        right:-15/@px-unit;        .cus_icons{            .svgOut(@fastPreviewBtnColor);        }    }    &down{        height:auto!important;        padding: 0 !important;;        display: flex;        justify-content: center;         &_left{                        max-height: 80vh;            min-width:105 /@px-unit!important;            overflow: auto;            padding: 0!important;            left:15/@px-unit!important;            .ant-dropdown-menu-root{                width:103/@px-unit;            }            .ant-dropdown-menu-item{                padding:0!important;                white-space: nowrap;            }            .ant-dropdown-menu-title-content{               display: flex;               align-items: center;               justify-content: center;            }        }        &_right{            width:110/@px-unit;            max-height: 80vh;            overflow: auto;            padding: 0!important;            left:115/@px-unit!important;            .ant-dropdown-menu-root{                width:103/@px-unit;            }            .ant-dropdown-menu-item{                padding:0!important;                white-space: nowrap;                height:32/@px-unit!important            }            .ant-dropdown-menu-title-content{                display: flex;                align-items: center;                justify-content: center;                .iconDropitem_name{                    display: flex;                    align-items: center;                    justify-content: center;                }            }        }        &_box{            width:80/@px-unit;            height:32 /@px-unit!important;            position: absolute;            border-right:1px solid @fastPreview_border;            z-index:9;            display: flex;            justify-content: flex-start;            align-items: center;            .cus_icons{                .svgOut(@fastPreviewBtnColor);            }        }        &_text{            color: @fastPreviewBtnColor;            margin-left:10/@px-unit;            line-height: 35/@px-unit;        }    }}
._ClusterCommonModule_ {                padding-top: inherit;         .info_table ._Table_ .ant-table-body {        min-height: 600 / @px-unit;    }     .clusterModal ._Table_ .ant-table-body {        min-height: 500 / @px-unit;    } }
.timeLine {
    position: relative;
}

.swiper-container {	overflow:hidden;	direction:ltr;	-webkit-backface-visibility:hidden;	-moz-backface-visibility:hidden;	-ms-backface-visibility:hidden;	-o-backface-visibility:hidden;	backface-visibility:hidden;		z-index:1;}.swiper-wrapper {    position:relative;    margin-top: -10px;	width:100%;	height: 42vh !important;	-webkit-transition-property:-webkit-transform, left, top;	-webkit-transition-duration:0s;	-webkit-transform:translate3d(0px,0,0);	-webkit-transition-timing-function:ease;		-moz-transition-property:-moz-transform, left, top;	-moz-transition-duration:0s;	-moz-transform:translate3d(0px,0,0);	-moz-transition-timing-function:ease;		-o-transition-property:-o-transform, left, top;	-o-transition-duration:0s;	-o-transform:translate3d(0px,0,0);	-o-transition-timing-function:ease;	-o-transform:translate(0px,0px);		-ms-transition-property:-ms-transform, left, top;	-ms-transition-duration:0s;	-ms-transform:translate3d(0px,0,0);	-ms-transition-timing-function:ease;		transition-property:transform, left, top;	transition-duration:0s;	transform:translate3d(0px,0,0);	transition-timing-function:ease;	-webkit-box-sizing: content-box;	-moz-box-sizing: content-box;	box-sizing: content-box;}.swiper-free-mode > .swiper-wrapper {	-webkit-transition-timing-function: ease-out;	-moz-transition-timing-function: ease-out;	-ms-transition-timing-function: ease-out;	-o-transition-timing-function: ease-out;	transition-timing-function: ease-out;	margin: 0 auto;}.swiper-slide {	float: left;	height: 42vh !important;	-webkit-box-sizing: content-box;	-moz-box-sizing: content-box;	box-sizing: content-box;}.swiper-wp8-horizontal {	-ms-touch-action: pan-y;}.swiper-wp8-vertical {	-ms-touch-action: pan-x;}
._IntelligentTrack_ {        display: flex;}
._MenuView_ {    height: 100%;    width: 100%;    background-size: 100% 100%;    &.bgImage {        background-image: url('/static/media/@{themeMainImage}.jpg');    }    .MenuView-Carousel{        color: @MenuViewItemTitleTextN;        width: 95%;        height: 95%;        position: absolute;        top: 4vh;                margin-left: 3%;        background-color: @MenuViewBg;    }    .MenuView-Carousel-Page {        padding: 5vh 1vw;    }    .ant-card {        background-color: inherit;        color: @MenuViewItemTitleTextN;        cursor: pointer;    }    .ant-card-grid {        box-shadow: none;        padding: 1vw;    }    .ant-card-grid-hoverable:hover {        position: relative;        z-index: 1;        color: @MenuViewItemTitleTextA;        box-shadow: 0 0px 8px @MenuViewItemShadowA;        .ViewItem-CardItem-Message {            color: @MenuViewItemContentTextA;        }        background-color:@MenuViewBgA !important;    }    .ant-image-img {      width: 7.5vw;    }    .ViewItem-CardItem {        height: 22vh;        .ViewItem-CardItem-Row{            height: 100%;        }    }    .ViewItem-CardItem-Icon {        font-size: 0;        font-weight: bold;    }    .ViewItem-CardItem-Title {        font-size: 1.3rem;        font-weight: bold;    }    .ViewItem-CardItem-Message {        font-size: 1.1rem;        color: @MenuViewItemContentTextN;    }    .pageContain {        display: flex;        justify-content: center;        align-items: center;        position: absolute;        top: 57vh;        left: 41vw;        .label-normal-wrapper{            height: 44/@px-unit;        }    }    .pagination {        z-index: 20;        width: 100%;        text-align: center;    }    .swiper-pagination-switch {        position: relative;        display: inline-block;        width: 12/@px-unit;        height: 12/@px-unit;        border-radius: 50%;        background: @MenuViewPageSwitchSvgN !important;        margin: -1/@px-unit 10/@px-unit;        border: transparent;        cursor: pointer;    }    .swiper-active-switch {        width: 16/@px-unit;        height: 16/@px-unit;        margin: -2/@px-unit 10/@px-unit;        background: @MenuViewPageSwitchSvgA !important;    }    .swiper-button {        font-weight: bold;        z-index: 20;        &.prev {            &:hover {                color: @MenuViewPageSwitchSvgA;            }        }        &.next {            &:hover {                color: @MenuViewPageSwitchSvgA;            }        }        &[disabled], &[disabled]:hover{            .cus_icons{                .svgDisabled(@MenuViewPageSwiperSvgD);             }                }        &:not([disabled]){            .cus_icons{                .svgOut(@MenuViewPageSwiperSvgN);            }        }    }        [class*="m-h-icon"] {        display: inline-block;        width: 80/@px-unit;        height: 80/@px-unit;    }}


._OpenAll_ {
    
    
    
    
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 20/@px-unit 0;
    ._OpenAll_box{
        width: 210/@px-unit;
        height:32/@px-unit;
        padding: 0!important;
        display: flex;
        align-items: center;
        justify-content: left;
        cursor: pointer;
    }
    ._OpenAll_default{
        border: 1px solid @talkAndSound_defBorder;
        background-color: @talkAndSound_defBg;
        color: @talkAndSound_defText;
    }
    .label-div-Container {
        width: 30/@px-unit;
        height:32/@px-unit;
        .label-normal-container {
            width: 30/@px-unit;
            height:32/@px-unit;
            padding-top: 0 !important;
            .label-normal-wrapper {
                width: 30/@px-unit !important;
                height:32/@px-unit !important;
            }
        }
    }
    ._OpenAll_btn {
        padding: 0 !important;
        border: 0 !important;
        background: none !important;
        height: 30/@px-unit;
    }
    ._OpenAll_down {
        width: 30/@px-unit;
        height: 30/@px-unit;
        border-left: 1px solid @talkAndSound_defBorder;
    }
    ._OpenAll_start {
        width: 210/@px-unit;
        height: 100%;
        display: flex;
        justify-content: left;
        background-color: @talkAndSound_defBg;
        border-right: 1px solid @talkAndSound_defBorder;
    }
    ._OpenAll_stop {
        width: 210/@px-unit;
        height: 100%;
        display: flex;
        justify-content: left;
        background-color: @talkAndSound_actBg;
        border-right: 1px solid @talkAndSound_defBorder;
        color: .color_A(@talkAndSound_actBg)[];
    }
    ._OpenAll_text {
        line-height: 32/@px-unit;
        width: 64/@px-unit;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }
    ._OpenAll_talk {
        display: flex;
        justify-content: center;
        width: 180/@px-unit;
        >span:nth-of-type(1){
            margin: 0 25/@px-unit 0  -33/@px-unit ;
        }
        .cus_icons {
            .svgHover(@iconColorN);
        }
    }
    ._OpenAll_current {
        color: @current !important;
    }
}
._viewAiResult_ {    .label-normal,    .labelText-wrapper {        height: 20/@px-unit;        line-height: 20/@px-unit;    }        height: 212/@px-unit;    .ant-row {        height: 680/@px-unit;        overflow: auto    }    .activeItem {        border: 1px solid @formInputBorderA  !important;    }    ._viewAiResult_similarity {        margin: 0 8px 7px 5px;    }    .picData_content {        margin: 5/@px-unit 5/@px-unit;        width: 268/@px-unit;        height: 212/@px-unit;        float: left;        border: 1px solid @ai_DataItem_bd;        background-color: @ai_DataItem_bg;                .picData_groupName {            height: 35/@px-unit;            line-height: 35/@px-unit;            margin-left: 10/@px-unit;            font-size: @font-huge;            color: @pageTextA;            overflow:hidden !important;        }                .picData_imgContent {            width: 268/@px-unit;            height: 112/@px-unit;            margin-bottom: 8/@px-unit;            img {                display: inline-block;                width: 120/@px-unit;                height: 100%;                margin: 0 5/@px-unit 0 5/@px-unit;            }        }        .picData_imgContentByPic{                        height: 137/@px-unit;                        margin:10/@px-unit 0 8/@px-unit 0;            img {                display: inline-block;                width: 120/@px-unit;                height: 100%;                margin: 0 5/@px-unit 0 5/@px-unit;            }        }                .picData_progress {            margin: 0 8px 7px 5px;            background: @ai_progress_default;            height: 14/@px-unit;            position: relative;            color: @pageTextA;            display: flex;            align-items: center;            .progress_item {                display: inline-block;                height: 100%;            }            .progress_red {                background: @ai_progress_red;            }            .progress_orange {                background: @ai_progress_orange;            }            .progress_blue {                background: @ai_progress_blue;            }                        .progress_label {                position: absolute;                right: 0;                line-height: 14/@px-unit;                top: 0;            }        }        .picData_smallImgContent {            width: 268/@px-unit;            height: 112/@px-unit;            margin-bottom: 8/@px-unit;            img {                display: inline-block;                width: 120/@px-unit;                height: 100%;                margin: 0 5/@px-unit 0 5/@px-unit;            }        }        .picData_imgAndInfo {            overflow: hidden;            margin: 35/@px-unit 0px 22/@px-unit 0px;        }        .picData_smallImgContent {            width: 132/@px-unit;            float: left;        }        .picData_info {            display: inline-block;            .label-normal-container {                height: 18/@px-unit;                padding: 0px !important;            }            color: @buttonNormalTextN;        }        .picData_labelCheck {            background: @ai_labelCheck_bg;            height: 32/@px-unit;            line-height: 32/@px-unit;            padding: 5/@px-unit 10/@px-unit;            display: flex;            flex-direction: row;            justify-content: space-between;            .ch_number {                height: 20/@px-unit;                line-height: 20/@px-unit ;                color: .color_N(@ai_labelCheck_bg)[];            }            .label-normal-container {                height: 20/@px-unit;                padding: 0px !important;                color: .color_N(@ai_labelCheck_bg)[];                .label-normal {                    color: .color_N(@ai_labelCheck_bg)[];                }            }            .ant-checkbox {                top: 0px;            }        }    }        .human_detect {        .compliantIcon{            font-size: 150/@px-unit;            margin-top: -200/@px-unit;            margin-left: 150/@px-unit;            &:hover {                svg {                    & + {                        path:first-child {                            fill: @iconColorN !important;                        }                    }                }            }        }        .compliantIcon_operatemonitor{            font-size: 120/@px-unit;            position: absolute;            bottom: 0;            margin-left: 150/@px-unit;            &:hover {                svg {                    & + {                        path:first-child {                            fill: @iconColorN !important;                        }                    }                }            }        }        .picData_human_detect_imgAndInfo {            margin-top: 20/@px-unit;            height: 156/@px-unit;            display: flex;            flex-direction: row;            justify-content: center;            .human_detect_width140 {                width: 140/@px-unit            }            .human_detect_width268 {                width: 268/@px-unit            }            .picData_imgContentByPic {                height: 137/@px-unit;                margin: 0;                float: left;                img {                    display: inline-block;                    height: 100%;                    margin: 0 5/@px-unit 0 5/@px-unit;                    max-width: 120/@px-unit;                }                .pic_humanImg {                    height: 100%;                    margin: 0;                    width: 120/@px-unit;                    float: left;                    text-align: center;                }                .nonmoperson-face {                    height: 60%;                    width: 80/@px-unit;                    float: right;                }                .face {                    height: 137/@px-unit;                    margin: 0;                    float: right;                    margin-left: 30/@px-unit;                }            }            .pic_humanImg {                height: 100%;                margin: 0;                width: 120/@px-unit;                float: left;                text-align: center;            }            .person {                margin-left: 10/@px-unit;                display: inline-block;                height: 100%;                max-width: 120/@px-unit;                width: auto;            }            .nonmoperson-face {                height: 60%;                width: 80/@px-unit;                float: right;            }            .face {                height: 137/@px-unit;                margin: 0;                float: right;                margin-left: 30/@px-unit;            }        }    }        .vehicle_detact {        .picData_vehicle_detect_imgAndInfo {            margin-top: 10/@px-unit;            height: 166/@px-unit;            display: flex;            flex-direction: row;            justify-content: center;            .picData_imgContentByPic {                position: relative;                width: 140/@px-unit;                height: 155/@px-unit;                margin: 0;                float: left;                img {                    width: 120/@px-unit;                    display: inline-block;                    height: 100%;                    margin: 0 5/@px-unit 0 5/@px-unit;                }                .vehicle {                    width: 120/@px-unit;                    height: 120/@px-unit;                    display: block;                    margin: 0 auto;                    position: absolute;                    top: 0/@px-unit;                    left: 5/@px-unit;                }                .plate {                    width: 120/@px-unit;                    height: 32/@px-unit;                    display: block;                    margin: 0 auto;                    position: absolute;                    top: 121/@px-unit;                    left: 5/@px-unit;                }            }            .picData_info {                height: 166/@px-unit;                .plateWhiteListDB {                    width: 120/@px-unit;                    height: 30/@px-unit;                    line-height: 30/@px-unit;                    text-align: center;                    margin-top: 54/@px-unit;                    float: left;                    border: 1/@px-unit solid @vehicle_whiteplate_borderColor;                    background-color: @vehicle_whiteplate_bgColor;                    color: .color_N(@vehicle_whiteplate_bgColor)[];                }                .plateBlackListDB {                    width: 120/@px-unit;                    height: 30/@px-unit;                    line-height: 30/@px-unit;                    text-align: center;                    margin-top: 54/@px-unit;                    float: left;                    background-color: @vehicle_blackplate_bgColor;                    color: .color_N(@vehicle_blackplate_bgColor)[];                    border: 1px solid @vehicle_blackplate_borderColor;                }                .plateNormalListDB {                    display: none                }            }        }    }}.infotext{    width: 115/@px-unit;    display: flex;}.info_label{    max-width: 70/@px-unit;    white-space: nowrap;    text-overflow: ellipsis;    overflow: hidden;}.info_val{    max-width: 45/@px-unit;    white-space: nowrap;    overflow: hidden;    text-overflow: ellipsis;}


._IntelliRuleBtn_ivs-color {
    svg path:first-child {
        fill: @current !important; 
    }
}

.label-normal-behind {    .label-normal-container {        padding-top: 0px !important;    }}._viewAiResult_ {    .pic_PlateNo {        clear: left;        text-align: center;    }}
._AcuPickIcon_{    &.hide {        display: none;    }    .active{        svg path:nth-of-type(1){            fill:@current!important;        }    }}.acupick {    &-region, &-canvas{        width: 100%;        height: 100%;        position: absolute;        &-hide {            top: -10000 / @px-unit;            z-index: 0;        }        &-show {            z-index: 1001;            top: 0;            left: 0;        }    }}
._AlarmOut_ {                padding-top: inherit;     position: relative;    &up{      display: flex;      justify-content: space-between;      align-items: center;      color: @preview_ChnlTextN;      padding:10/@px-unit 15/@px-unit;      ._AlarmOut_header_bg_icon{        .svgOut(@preview_ChnlTextN);      }    }    .active{        border-color: @alramOut_actBorder;        color:@alramOut_actText;    }    .label-div-Container{        width:35/@px-unit;        height:45/@px-unit;    }       ._AlarmOut_right_header_title {        height: 35 / @px-unit;        background-color: @preview_right_tabTitle_Bg;        color: .color_N(@preview_right_tabTitle_Bg)[];        padding-left: 10 / @px-unit;        display: flex;        align-items: center;        width: 100%;    }    .ant-menu{        background: @preview_right_tabTitle_Bg !important;        color: @pageTextN;        height: 35 / @px-unit;        width: 100%;    }    .ant-menu-horizontal {        border-bottom-color: @preview_right_tabTitle_Bg;    }    .ant-menu-horizontal:not(.ant-menu-dark) {        .ant-menu-item {            height: 30 / @px-unit;            margin-top: 2 / @px-unit;            line-height: 30 / @px-unit;            width: 49%;            padding: 0 10 / @px-unit;            display: flex;            justify-content: center;            span {                overflow: hidden;                text-overflow: ellipsis;                white-space: nowrap;            }        }        .ant-menu-item:hover::after,        .ant-menu-item-selected::after {            border-bottom: 0px solid transparent;        }        .ant-menu-item-selected {            background: @preview_right_ptzZoom_Bg !important;                            border-radius: 5 /@px-unit;                            span {                                   background: @preview_right_ptzZoom_Bg;                color: @pageTextA;            }                        }        .ant-menu-item:hover {            color: @pageTextN;        }    } }
._PicturePlay_{    display: flex;    align-items: center;    justify-content: center;    margin: 20/@px-unit 0;    &box {        display: flex;        align-items: center;        justify-content: left;        cursor: pointer;        border: 1px solid @urgentRecord_defBorder;        background-color: @urgentRecord_defBg;        color:@urgentRecord_defText;        width: 210/@px-unit;        height:32/@px-unit;        padding: 0!important;        >span:nth-of-type(1){            margin: 0 30/@px-unit 0  10/@px-unit ;        }        .cus_icons {            .svgHover(@iconColorN);        }    }    &text {        width: 124/@px-unit;        white-space: nowrap;        text-overflow: ellipsis;        overflow: hidden;    }}
._ViewSplit_ {                padding-top: inherit;     }
._LocalPlay_{    display: flex;    align-items: center;    justify-content: center;    margin: 20/@px-unit 0;    &box {        display: flex;        align-items: center;        justify-content: left;        cursor: pointer;        border: 1px solid @urgentRecord_defBorder;        background-color: @urgentRecord_defBg;        color:@urgentRecord_defText;        width: 210/@px-unit;        height:32/@px-unit;        padding: 0!important;        >span:nth-of-type(1){            margin: 0 30/@px-unit 0  10/@px-unit ;        }        .cus_icons {            .svgHover(@iconColorN);        }    }    &text {        width: 124/@px-unit;        white-space: nowrap;        text-overflow: ellipsis;        overflow: hidden;    }}
._Ptz_ {    position: relative;    margin-bottom: 0 / @px-unit;    -webkit-touch-callout: none;     -webkit-user-select: none;     -khtml-user-select: none;     -moz-user-select: none;     -ms-user-select: none;     user-select: none;    background-color: @preview_Right_Bg;     min-width: 170px;    .ant-btn{        padding:4/ @px-unit 0!important;;    }    .show{        display: '';    }    .hidden{        display: none;    }    &wrap{        .ant-menu-item, .ant-menu-submenu-title{            padding:0!important;        }        display: flex;        justify-content: flex-start;        align-items: center;        flex-direction: column;        margin-top: 10 / @px-unit;          border-bottom: 1 / @px-unit solid @preview_right_ptz_borderBottom_ColorN;              .ant-menu{            background: @preview_right_tabTitle_Bg !important;            color: .color_N(@preview_right_tabTitle_Bg)[];            height: 35 / @px-unit;            width: 100%;        }        .ant-menu-horizontal {            border-bottom-color: @preview_right_tabTitle_Bg;                    }        .ant-menu-horizontal:not(.ant-menu-dark) {            .ant-menu-submenu{                padding:0!important;            }            .ant-menu-item {                height: 30 / @px-unit;                margin-top: 2 / @px-unit;                line-height: 30 / @px-unit;                width: 49%;                display: flex;                justify-content: center;                span {                    overflow: hidden;                    text-overflow: ellipsis;                    white-space: nowrap;                }            }            .ant-menu-item:hover::after,            .ant-menu-item-selected::after {                border-bottom: 0px solid transparent;            }            .ant-menu-item-selected {                background: @preview_right_ptzZoom_Bg !important;                                border-radius: 5 /@px-unit;                                span {                                       background: @preview_right_ptzZoom_Bg;                    color: .color_A(@preview_right_ptzZoom_Bg)[];                }                            }            .ant-menu-item:hover {                color: .color_A(@preview_right_tabTitle_Bg)[];            }        }     }    &content {        margin-top: 15 /@px-unit;        height:200 /@px-unit;        background-color: @preview_Right_Bg;    }       &font{       >svg{        font-size:30/ @px-unit!important;               }    }       &icon{        width:20 / @px-unit    }    &header_bg {        width: 150 / @px-unit;        height: 150 / @px-unit;        margin: 25 / @px-unit 0 15 / @px-unit 25 / @px-unit;        & &_icon {            .svgFont(150);        }    }    &header_el {        width: 150 / @px-unit;        height: 150 / @px-unit;        display: flex;        flex-wrap: wrap;        margin: 25 / @px-unit 0 15 / @px-unit 25 / @px-unit;        position: absolute;        top: -25 / @px-unit;        left: 0;        & &_icon {            .svgFont(40);            width: 40 / @px-unit;            height: 40 / @px-unit;            margin: 5 / @px-unit 5 / @px-unit 5 / @px-unit 5 / @px-unit;            &:hover {                cursor: pointer;            }        }    }}
._TalkAndSound_ {                    display: flex;    align-items: center;    justify-content: center;    margin: 20/@px-unit 0;    &box{        width: 210/@px-unit;        height:32/@px-unit;        padding: 0!important;        display: flex;        align-items: center;        justify-content: center;        cursor: pointer;    }    &default{        border: 1px solid @talkAndSound_defBorder;        background-color: @talkAndSound_defBg;        color: @talkAndSound_defText;    }    .label-div-Container {        width: 30/@px-unit;        height:32/@px-unit;        .label-normal-container {            width: 30/@px-unit;            height:32/@px-unit;            padding-top: 0 !important;            .label-normal-wrapper {                width: 30/@px-unit !important;                height:32/@px-unit !important;            }        }    }    &btn {        padding: 0 !important;        border: 0 !important;        background: none !important;        height: 30/@px-unit;    }    &down {        width: 30/@px-unit;        height: 30/@px-unit;        border-left: 1px solid @talkAndSound_defBorder;    }    &start {        width: 180/@px-unit;        height: 100%;        display: flex;        justify-content: center;        background-color: @talkAndSound_defBg;        border-right: 1px solid @talkAndSound_defBorder;    }    &stop {        width: 180/@px-unit;        height: 100%;        display: flex;        justify-content: center;        background-color: @talkAndSound_actBg;        border-right: 1px solid @talkAndSound_defBorder;        color: .color_A(@talkAndSound_actBg)[];    }    &text {        line-height: 32/@px-unit;        width: 64/@px-unit;        white-space: nowrap;        text-overflow: ellipsis;        overflow: hidden;    }    &talk {        display: flex;        justify-content: center;        width: 140/@px-unit;        >span:nth-of-type(1){            margin: 0 30/@px-unit 0  -10/@px-unit ;        }        .cus_icons {            .svgHover(@iconColorN);        }    }    &current {        color: @current !important;    }}
._UrgentRecord_ {                    display: flex;    align-items: center;    justify-content: center;    -webkit-touch-callout: none;     -webkit-user-select: none;     -khtml-user-select: none;     -moz-user-select: none;     -ms-user-select: none;     user-select: none;      &box{        width: 210/@px-unit;        height:32/@px-unit;        padding: 0!important;        display: flex;        align-items: center;        justify-content: flex-start;                cursor: pointer;        >span:nth-of-type(1){            margin: 0 30/@px-unit 0  10/@px-unit ;        }        .cus_icons {            .svgHover(@iconColorN);        }    }    &checked{        border: 1px solid @urgentRecord_actBorder;        background-color: @urgentRecord_actBg;        color:.color_A(@urgentRecord_actBg)[];    }    &default{        border: 1px solid @urgentRecord_defBorder;        background-color: @urgentRecord_defBg;        color:@urgentRecord_defText;    }    &text {        width: 124/@px-unit;        white-space: nowrap;        text-overflow: ellipsis;        overflow: hidden;    }}
@list-header-height: 35 / @px-unit;._AIPreview_ {        height: 100%;    &swrap{        border-right: 1px solid @--split;        width: 270 / @px-unit;        height: 100%;        padding-right: 1 / @px-unit;        background-color: @aiPanel_bg_color;        &_header{            background-color: @PickerHeaderBg;            height: @list-header-height;            display: flex;            flex-direction: row;            justify-content: space-between;            background-color: @aiPanel_title_bg_color;            &_title{                width: 100%;                color: .color_N(@aiPanel_title_bg_color)[];                display: flex;                align-items: center;                span{                    margin-left: 15 / @px-unit;                }            }            &_set_icon{                display: flex;                align-items: center;                width: 50 / @px-unit;                .cus_icons {                    .svgOut(.color_N(@aiPanel_title_bg_color)[]);                    .svgHover(.color_A(@aiPanel_title_bg_color)[]);                }            }        }        &_list_swrap{            height: calc(100% - @list-header-height);            overflow: auto;        }    }    }._AIPreviewIcon_{    .active{        svg path:nth-of-type(1){            fill:@current!important;        }    }}
._QualityBtns_ {    .popover_contain{        .popover_icon:not(.disabled_icons):not(.noHover) svg path {            fill: .color_N(@preview_center_bottom_Bg)[];        }        .popover_icon:hover:not(.disabled_icons):not(.noHover):hover svg path {            fill: @--primary-5!important;        }    }    }  
._DisplayScale_ {                padding-top: inherit;     }
._FileListPanel_ {    display: flex;    flex-direction: column;    align-items: center;    height: 100%;    &bottom {        width: 100%;        height: 60 / @px-unit;        padding: 0 10px 4px 10px;        display: flex;        align-items: center;        justify-content: space-between;    }    &bottom_mix {        display: flex;        flex-direction: row;        width: 140 / @px-unit;        justify-content: flex-start;    }    &bottom_item {        width: 66 / @px-unit;        height: 40 / @px-unit;        text-align: center;                        background-color: @playback_Right_iConBtn_bg;        border: 1 / @px-unit solid @buttonNormalBorderN;        display: flex;        align-items: center;        justify-content: center;    }    &bottom_item_lock {        line-height: 50 / @px-unit;    }    &bottom_icon {        font-size: 30 / @px-unit !important;    }    &timer_piker {        width: 290px;        margin: 10 / @px-unit 0;    }    ._Table_ {        margin-top: 0;        flex: 1;        overflow: hidden;        .m-table-showEmpty{            height: 100%;            .ant-table-wrapper {                height: 100%;            }        }        .ant-table {            & > .ant-table-container {                tr {                    td {                        height: 40px;                    }                }                th {                    height: 40px !important;                }            }        }    }}
._TagListPanel_ {    display: flex;    flex-direction: column;    align-items: center;                                            &bottom {        position: absolute;        bottom: 0;        right: 0;        width: 100%;        height: 60 / @px-unit;        padding: 0 10px 4px 10px;        display: flex;        justify-content: space-between;    }    &bottom_item {        width: 66 / @px-unit;        height: 40 / @px-unit;        text-align: center;        border: 1 / @px-unit solid @buttonNormalBorderN;        display: flex;        align-items: center;        justify-content: center;    }    &bottom_icon {        font-size: 30 / @px-unit !important;    }    .timePiker-box {        width: 290px;        margin: 10 / @px-unit 0;    }}
._AiPreviewModal_{        width: 50% !important;    min-width: 750px;  }.modal-swrap{    .events-bar{        display: flex;        flex-direction: row;        margin-top: 0 / @px-unit;        .events-bar-btn{            min-width: 180 / @px-unit;            .tab-title-btn{                min-width: 140 / @px-unit;            }        }        .events-bar-btn-selected {            button{                background: @current!important;                border: 1 / @px-unit solid @current!important;                color: .color_A(@current)[] !important            }        }        .events-bar-btn-no-selected{            button{                background: @buttonNormalBgN!important;                border: 1 / @px-unit solid @buttonNormalBorderN!important;                color: .color_N(@buttonNormalBgN)[] !important;            }        }    }    .object-params-swrap{        .template-list{            display: flex;            margin-top:25 / @px-unit;            .template-card-list-item {                margin-right: 41/@px-unit;            }            .card-selected {                border: 1 / @px-unit solid @current;            }            .card-no-selected {                border: 1 / @px-unit solid @pageBorderN;            }            .template-card:last-child{                 margin-right: 0 / @px-unit;            }        }        .attri-list{            display: flex;            margin-top: 20 / @px-unit;            flex-wrap: wrap;            min-height: 100 / @px-unit;            .attri-btn-swrap{                width: 16.5%;                .attri-btn{                    width: 85%;                    .ant-btn>span{                        width: 100%;                        display: block;                        overflow: hidden;                        text-overflow: ellipsis;                        white-space: nowrap;                    }                                        .attri-button-contain{                        width: 100% !important;                    }                    .attri-button-wrap{                        width: 100% !important;                    }                }                .attri-btn-selected {                    button{                        background: @current!important;                        border: 1 / @px-unit solid @current!important;                        color: .color_A(@current)[] !important                    }                }                .attri-btn-no-selected{                    button{                        background: @aiSetPanel_bottom_unSelectBg!important;                        border: 1 / @px-unit solid @buttonNormalBorderN!important;                        color: .color_N(@aiSetPanel_bottom_unSelectBg)[] !important;                    }                }            }        }    }}

._SGCC_ {    .row-flex {        display: flex;        > div {            margin-right: 50px;        }    }}
._MultiPreview_ {                display: flex;    &item {        display: flex;        position: relative;    }    &item_split {        position: absolute;        right: 32/@px-unit;        width: auto;        height: 32/@px-unit;        padding: 0 10/@px-unit;        background-color: @mutilPreview_Bg;        border: 1/@px-unit solid @mutilPreview_border;    }    &split_group {        display: flex;        height: 100%;        align-items: center;        overflow: hidden;    }    &split {        max-width: 782/@px-unit;        overflow: hidden;        display: flex;        height: 100%;        align-items: center;    }    &number {        width: 46/@px-unit;        height: 16/@px-unit;        border-right: 1/@px-unit solid @preview_center_separator_ColorN;        display: flex;        justify-content: center;        flex-shrink: 0;        font-size: 10/@px-unit;        cursor: pointer;        position: relative;    }    &current {        color: @current;    }    &number:last-child {        border-right: none;    }    &number:hover {        color: @current;    }}
.syncinfo_modal {    ._Table_ .ant-table-body {        min-height: 200 / @px-unit;    } }
._AlarmOut_ {    &wrapper{        width:100%;        overflow: hidden;    }    &down{        width:330 /@px-unit;    }}
._ImageConfig_ {    width: 100%;    background-color: @preview_Left_Bg;    height: 100%;    display: flex;    flex-direction: column;    justify-content: space-between;    overflow: hidden;    ._ImageConfig_button{        .label-div-Container{            margin-left:50/@px-unit;            .label-normal-wrapper {                width:92/@px-unit!important;;            }        }    }      .label-normal-container {        width:190/@px-unit!important;;    }    .label-normal-wrapper{        width:160/@px-unit!important;    }    .label-normal {        width:28/@px-unit!important;    }    .label-normal-behind {        display: none;    }}
.ai-preview-list{    height: 100%;    display: flex;    flex-direction: column;    align-items: center;    padding-top: 5 / @px-unit;    .ai-template-card-swrap{                margin: 5 / @px-unit 0 / @px-unit;    }}
.BottomItem{        position: relative;    top: 25vh;    .dividerLine{        height: 1 / @px-unit;        width: 95%;        margin-left: 2vw;        background: @MenuViewDivideLine;    }    .ConfigTitle{        font-size: 1.2rem;        margin-top: 50 / @px-unit;        font-weight: bold;        margin-left: 2vw;    }    .ItemsWrap {        display: flex;        flex-wrap: wrap;    }    .Items{        display: flex;        flex: 1;        margin-top: 2vh;        margin-left: 2vw;        cursor: pointer;        .BottomText{            margin-top: 3 / @px-unit;            margin-left: 10 / @px-unit;        }    }    .Items:hover{        color: @--primary-5;        svg path{            fill: @--primary-5;        }    }    .home_BottomMenu{        .svgOut(@pageTextN);    }}.BottomItemTip {    word-break: break-word;}
.card-selected {    border: 1 / @px-unit solid @current;}.card-no-selected {    border: 1 / @px-unit solid @pageBorderN;}.template-card-swrap {    padding: 3px;    position: relative;}.template-listcard {    width: 250 / @px-unit !important;}.template-card {    display: inline-block;    width: 200 / @px-unit;    min-height: 177 / @px-unit;    background-color: @aiPanel_cardBg;    .template-card-top-face-database {        height: 20 / @px-unit;        padding-top: 2 / @px-unit;        display: flex;        align-items: center;         .face-database-name {            width: 50%;            padding-left: 15 / @px-unit;            overflow: hidden;            white-space: nowrap;            text-overflow: ellipsis;        }        .face-person-name {            width: 50%;            overflow: hidden;            white-space: nowrap;            text-overflow: ellipsis;        }    }    .template-card-top {        height: 145 / @px-unit;        display: flex;        .template-card-top-swrap {            width: 50%;            .image-panle {                display: flex;                flex-direction: row;                justify-content: center;                width: 100%;                height: 100%;            }            .svg-panle {                height: 100%;                width: 100%;                background-color: @aiPanel_box_color;                border: 1 / @px-unit solid @aiPanel_box_bordere_color;                display: flex;                justify-content: center;                align-items: center;                .svg-icon {                    font-size: 7.142857rem;                    svg {                        path {                            fill: @aiPanel_info_bg_color;                        }                    }                    .svgHover(@aiPanel_info_bg_color);                }            }        }        .left {            padding: 10 / @px-unit 5 / @px-unit 10 / @px-unit 10 / @px-unit;        }        .center {            margin-left: 60 / @px-unit;        }        .right {            padding: 10 / @px-unit 10 / @px-unit 10 / @px-unit 5 / @px-unit;        }    }    .template-card-top-no-center {        display: flex;        height: 170 / @px-unit !important;        .template-card-top-swrap {            width: 50%;        }        .right-attri-list {            display: flex;            flex-direction: column;            height: 100%;            justify-content: flex-start;            .attri-item-wrapper {                display: flex;                .attri-left-item {                    text-align: left;                    width: 35 / @px-unit;                    line-height: 35 / @px-unit;                    flex-shrink: 0;                    margin-right: 4 / @px-unit;                }                .attri-right-item {                    width: 100%;                    line-height: 35 / @px-unit;                }                .attri-color-block {                    width: 100%;                    display: flex;                    justify-content: flex-end;                    align-items: center;                }            }            .attri-item-wrapper-high {                .attri-left-item {                    line-height: 28 / @px-unit;                }                .attri-right-item {                    line-height: 28 / @px-unit;                }            }            .thumb-white {                border: 1px solid @vehicle_whiteplate_borderColor;                background-color: @vehicle_whiteplate_bgColor;                color: .color_N(@vehicle_whiteplate_bgColor)[];            }            .thumb-black {                background-color: @vehicle_blackplate_bgColor;                border: 1px solid @vehicle_blackplate_borderColor;                color: .color_N(@vehicle_blackplate_bgColor)[];            }            .white-black-list {                display: flex;                justify-content: center;                border-radius: 2px;                padding-top: 2 / @px-unit;            }            .OverSpeed{                width: 80 / @px-unit;                height: 40 / @px-unit;                position: absolute;                bottom: 14 / @px-unit;                right: 14 / @px-unit;            }        }        .image-panle {            display: flex;            flex-direction: row;            justify-content: center;            width: 100%;            height: 100%;        }        .imageList-panle{            width: 100%;            height: 100%;            .imagesmall-panle{                width: 100%;                height: 80%;            }            .imageplate-panle{                width: 100%;                margin-top: 6/ @px-unit;                height: 15%;            }        }        .svg-panle {            height: 100%;            width: 100%;            background-color: @aiPanel_box_color;            border: 1 / @px-unit solid @aiPanel_box_bordere_color;            display: flex;            justify-content: center;            align-items: center;            .svg-icon {                width: 100%;                font-size: 7.142857rem;                svg {                    width: 100%;                    path {                        fill: @aiPanel_info_bg_color;                    }                }                .svgHover(@aiPanel_info_bg_color);            }        }        .left {            padding: 10 / @px-unit 5 / @px-unit 10 / @px-unit 10 / @px-unit;        }        .center {            margin-left: 60 / @px-unit;        }        .right {            padding: 10 / @px-unit 10 / @px-unit 10 / @px-unit 5 / @px-unit;        }    }    .template-card-center {        height: 25 / @px-unit;        background-color: @preview_Sider_Bg;    }    .template-card-cenBtm {        height: 28 / @px-unit;        line-height: 28 / @px-unit;        .template-card-cenBtm-left {            float: left;            padding-left: 14 / @px-unit;            color: @red;        }        .template-card-cenBtm-right {            float: right;            padding-right: 10 / @px-unit;        }    }    .template-card-bottom {        height: 25 / @px-unit;        background-color: @aiPanel_box_bottom-color;        padding: 0 / @px-unit 12 / @px-unit 0 / @px-unit 12 / @px-unit;        display: flex;        align-items: center;        width: 100%;        color: .color_N(@aiPanel_box_bottom-color)[];        .template-card-bottom-left {            width: 30%;        }        .template-card-bottom-right {            width: 70%;            display: flex;            justify-content: center;        }    }    .template-card-tag {        position: absolute;        bottom: (-35 / @px-unit);        right: (-10 / @px-unit);        .svg-icon {            font-size: (180 / @px-unit);            svg {                path {                                    }            }            .svgHover(@urgentRecord_defText);        }        .match,        .mismatch {            font-size: 100/@px-unit;            margin: 0 15/@px-unit 30/@px-unit 0        }    }    .color-0{        color:#a6aab2;    };    .color-1{        color:green;    };    .color-2{        color:red;    };}.template-list .template-card .template-card-top-no-center .right-attri-list .attri-item-wrapper .attri-left-item{    width: 66/@px-unit;}.template-card:last-child {    margin-right: 0 / @px-unit;}
._TagList_ {    width: 290px;    ._Table_ .ant-table-body {        min-height: 500 / @px-unit;    }     .tag-list-top-wrapper {        padding-bottom: 0 !important;    }    .tag-list-top {        width: 290px;        height: 36 / @px-unit;        line-height: 36 / @px-unit;        text-align: center;        border-top: 1 / @px-unit solid @tableBorderN;        border-left: 1 / @px-unit solid @tableBorderN;        border-right: 1 / @px-unit solid @tableBorderN;        overflow: hidden;        text-overflow: ellipsis;        white-space: nowrap;    }    .anticon-left,    .ant-pagination-simple-pager,    .anticon-right {        color: @pageTextA;    }    .ant-spin-container .ant-table-pagination {        display: flex !important;    }                    ._Table_ {        margin-top: 0;        .ant-table {            & > .ant-table-container {                tr {                    td {                        height: 40px;                    }                }                th {                    height: 40px !important;                }            }        }    }}
.ClusterLog_detailModal{    width: 650/@px-unit !important;    .loginfo_Table{        height: 290/@px-unit;    }    ._Table_ .ant-table-body {        min-height: 290 / @px-unit;    }     .ant-modal-footer{        height: 53 / @px-unit;        .ClusterLog_detailButton{            display: flex;            justify-content: space-between;            .ClusterLog_btnLeft {                display: flex;                float: left;            }            .label-div-Container{                margin-left: 10 / @px-unit;            }        }    }}.ClusterLog_timePicker {    display: flex;    justify-content: space-between;    .ClusterLog_datePicker {        display: flex;        .ClusterLog_right {            margin-left: 20 / @px-unit;        }    }}
._TagListTable_ {    .label-normal-behind {        &.pl-0 {            padding-left: 0 / @px-unit !important;        }        .label-normal-container {            padding-top: 0 / @px-unit !important;            button {                margin-left: 1.5rem;            }        }    }    .date-range-picker {        .validity-picker {            width: 500 / @px-unit !important;        }    }    .modal-footer {        display: flex;        flex-direction: row;        align-items: center;        width: 100%;        justify-content: flex-end;    }    .btn-left {        margin-right: 10 / @px-unit;    }    .taglist-tabel {        margin-top: 8 / @px-unit;    }    ._tag_list_panel_ {        .label-normal-behind {            .label-normal-container {                padding: 0 !important;            }        }    }    ._Table_ .ant-table-body {        min-height: 280 / @px-unit;    } }
._FileLockTable_ {    .label-normal-behind {        &.pl-0 {            padding-left: 0 / @px-unit !important;        }        .label-normal-container {            padding-top: 0 / @px-unit !important;            button {                margin-left: 1.5rem;            }        }    }    .date-range-picker {        .validity-picker {            width: 500 / @px-unit !important;        }    }    .modal-footer {        display: flex;        flex-direction: row;        align-items: center;        width: 100%;        justify-content: flex-end;    }    .btn-left {        margin-right: 10 / @px-unit;    }    .lock_tabel {        margin-top: 8 / @px-unit;    }    ._lock_list_panel_ {        .label-normal-behind {            .label-normal-container {                padding: 0 !important;            }        }    }    ._Table_ .ant-table-body {        min-height: 288 / @px-unit;    } }
._FileList_ {    width: 290px;    overflow: hidden;    .fileList_type_icon {        display: flex;        padding-left: 20 / @px-unit;        align-items: center;        .svgHover(@iconColorN);    }    .fileList_type_cub {        display: flex;        height: 20 / @px-unit;        width: 20 / @px-unit;        justify-content: center;        align-items: center;        margin-right: 6 / @px-unit;    }    .fileList_type_lock {        font-size: 20 / @px-unit;    }    .type_color_fileList_general {        background-color: @general;    }    .type_color_fileList_ivs {        background-color: @ivs;    }    .type_color_fileList_alarm {        background-color: @alarm;    }    .type_color_fileList_detect {        background-color: @detect;    }    .type_color_fileList_pos {        background-color: @pos;    }    .type_color_fileList_card {        background-color: @card;    }    .fileList_type_lock_hide {        display: none;    }    .anticon-left,    .ant-pagination-simple-pager,    .anticon-right {        color: @pageTextA;    }    .ant-spin-container .ant-table-pagination {        display: flex !important;    }    .ant-checkbox-indeterminate .ant-checkbox-inner {        border: 1px solid @pageBorderN;    }    .ant-spin-nested-loading {        height: 100%;    }    .ant-spin-container {        height: 100%;        flex: 1;        display: flex;        flex-direction: column;        .ant-table {            flex: 1;            overflow: hidden;            .ant-table-container {                height: 100%;                min-height: 350 / @px-unit;                overflow-y: auto;            }        }        thead {            position: sticky;            top: 0;            z-index: 1;        }        ::-webkit-scrollbar {            width: 0px;        }    }}._FileList_card {    width: 290px;    border: none;    background-color: @tableOddBgN;    color: @pageTextN;    margin-top: 20 / @px-unit;    .ant-card-body {        padding: 16px !important;    }}.tag-list-top {    width: 290px;    height: 36 / @px-unit;    line-height: 36 / @px-unit;    text-align: center;    border-top: 1 / @px-unit solid @tableBorderN;    border-left: 1 / @px-unit solid @tableBorderN;    border-right: 1 / @px-unit solid @tableBorderN;    overflow: hidden;    text-overflow: ellipsis;    white-space: nowrap;}
@textHighlightColor: #fff;@icon-success-color: @iconNolmal; @icon-warning-color: @iconFail; @icon-fail-color: @iconFail; @icon-ignore-color: @iconColorD; @icon-list-color: @iconListColorN; .m-highlight-text {    color: @textHighlightColor}._SAFESecurityStatus_ {    ._SAFESecurityStatus_title {        background-color: inherit;    }    ._SAFESecurityStatus_detect {        height: 32/@px-unit;        width: 100/@px-unit;    }    .anticon.item-icon-list {        svg .icon-cicrle-part {            fill: @icon-list-color;        }    }    .item-list-btn {        border-color: @buttonNormalBorderN;    }    .item-icon-loading {        &::after {            border-bottom-color: @icon-success-color;        }    }    .anticon.icon-status-success {        svg .icon-cicrle-part {            fill: @icon-success-color;        }    }    .anticon.icon-status-fail {        svg .icon-cicrle-part {            fill: @icon-fail-color;        }    }    .anticon.icon-status-ignore{        svg .icon-cicrle-part{            fill:@icon-ignore-color;        }    }    .anticon._SAFESecurityStatus_titleIcon {        svg .icon-cicrle-part {            fill: @icon-success-color;        }    }    .anticon.warningTips-icon {        svg .icon-cicrle-part {            fill: @icon-fail-color;        }    }    .anticon.successTips-icon {        svg .icon-cicrle-part {            fill: @icon-success-color;        }    }}.safeopr-table-normal {    .ant-table-placeholder{        display: none;    }}.safeopr-configBar {    background-color: @BottomBarBg;    border-top: 1px solid @BottomBarBorder;    position: absolute;    left: 0;}.FireWall-tab {    a {        color: @pageTextN;        &:hover {            color: @current;        }    }}.Loading-wapper {    .ant-spin-text {        position: initial;        transform: initial;        white-space: nowrap;    }}._SAFESafetyWarning_ {    .anticon.detail_icon {        svg .icon-cicrle-part {            fill: none;        }    }}.Cert {    .anticon.detail_icon {        svg .icon-cicrle-part {            fill: none;        }    }    .ant-input-number {        width: 100%;    }    .anticon.default-select {        svg .icon-cicrle-part {            fill: @icon-success-color;        }    }}._VideoTransmission_, ._SAFESafetyWarning_, ._UserLock_, .FireWall-tab, ._publicAccountLock_, ._DOSAttack_, ._WlanAgree_, ._publicHttps_ {    padding-bottom: 78/@px-unit;}._Whitelist_ {    padding-bottom: 78/@px-unit !important;}
._SymServer_ {    .gap-divider {        margin-top: 0;        margin-bottom: 0;    }}
._MachineConfig_ {                padding-top: inherit;         .ant-row .label-normal-container {        min-width:550/@px-unit;    }    .syncRemoteCheckBox .label-normal-container>.label-normal-wrapper{        width: auto !important;    }}
._PtzMenu_ {                padding-top: inherit;     display: flex;    justify-content: center;    align-items: center;    flex-direction: column;    -webkit-touch-callout: none;     -webkit-user-select: none;     -khtml-user-select: none;     -moz-user-select: none;     -ms-user-select: none;     user-select: none;    &header_bg {        position: relative;        width: 120 / @px-unit;        height: 120 / @px-unit;        margin: 10 / @px-unit 0 30 / @px-unit 0;        & &_icon {            .svgFont(120);            svg {                & + {                    path{                        fill: @preview_right_ptzBg;                     }                }            }        }    }    &header_el {        width: 120 / @px-unit;        height: 120 / @px-unit;        display: flex;        flex-wrap: wrap;        position: absolute;        top: 0;        left: 0;        .cus_icons:not(.disabled_icons):not(.noHover):hover svg path:nth-child(2) {            fill:@current;        }        & &_icon {            .svgFont(30);            width: 30 / @px-unit;            height: 30 / @px-unit;            margin: 5 / @px-unit 5 / @px-unit 5 / @px-unit 5 / @px-unit;            &:hover {                cursor: pointer;            }                 }    }    &btngroups{        display: flex;        justify-content: flex-start;        color:@pageTextN;        margin:-17/@px-unit 0 0 0;        .btn3{            width:60/ @px-unit!important;        }    }}
._Onvif_ {    padding-left: 20 / @px-unit;    padding-top: 20 / @px-unit;    padding-right: 10 / @px-unit;    width: 100%;    ._Table_ {        .ant-table {            background-color: @pageBodyBg;            .ant-table-content {                height: 450 / @px-unit;                overflow-y: auto;            }        }        .not-show {            display: none;        }    }    .ant-modal {        .ant-modal-body {            min-height: 498 / @px-unit;            overflow-y: auto;        }    } }
.clusterControl {    display: flex;    .open {        padding-right: 20 / @px-unit !important;    }}
._PasswordReset_ {    padding-left: 20 / @px-unit;    padding-top: 20 / @px-unit;    .ant-divider {        background: inherit;    }    .ant-divider-horizontal.ant-divider-with-text-left:after {        border-top: 1 / @px-unit solid #13161b;    }    .QR_background {        width: 205 / @px-unit;        height: 205 / @px-unit;        padding: 10 / @px-unit;        background-color: @formInputTextN;        margin: 10 / @px-unit;        img{            width: 185 / @px-unit;            height: 185 / @px-unit;        }    }}.password-reset-modal {    width:430 /@px-unit !important;}

._StreamCombine_ {
    @padding:20 / @px-unit;
    padding:@padding;
    box-sizing: content-box;
    width:calc(100% - 2 *  @padding);
    height:900 / @px-unit !important;

    .TitleBar{
        display: flex;
        height: 40 / @px-unit;
        justify-content: space-between;
        align-items: center;
        margin-top: 4 / @px-unit;

        .text{
            font-weight: bold;
            font-size: 16 / @px-unit;
        }
    }

    .ant-table-body{
        min-height: 150 / @px-unit !important;
        .table-input-select-wrapped,.table-input-select-container{
            width: 95% !important;
        }
    }
}
._SnapDisc_ {    padding:20 / @px-unit;    width: 100%;}

._Group_ {    padding-left: 20 / @px-unit;    padding-top: 20 / @px-unit;    padding-right: 10 / @px-unit;    width: 100%;    ._Table_ {        .ant-table {            background-color: @pageBodyBg;            .ant-table-content {                height: 450 / @px-unit;                overflow-y: auto;            }        }    }    .ant-modal {        .ant-modal-body {            min-height: 498 / @px-unit;            overflow-y: auto;            .ant-tabs .ant-tabs-content {                [id*="Auth"] {                    .label-div-Container:not(:first-child) {                        display: inline-block;                        width: 190 / @px-unit                    }                }                [id*="Monitor"] {                    .label-div-Container:not(:first-child) {                        display: inline-block;                        width: 70 / @px-unit                    }                }                [id*="Replay"] {                    .label-div-Container:not(:first-child) {                        display: inline-block;                        width: 70 / @px-unit                    }                }            }        }    }    .ant-tabs-nav .ant-tabs-tab-btn {        width: 170/@px-unit !important;   }}
._AiPreviewDetailModal_SWRAP{    .ant-modal{        @modalHeight:95vh;        @modalWidth:75vw;        height: @modalHeight !important;        width: @modalWidth !important;        .ant-modal-content{            width: 100%;            height: 100%;            .ant-modal-header{                height: 45 / @px-unit;                display: flex;                flex-direction: row;                align-items: center;                padding: 0 / @px-unit 24 / @px-unit;            }            .ant-modal-body{                padding: 0 / @px-unit;                                @headerHeight:47 / @px-unit;                height: calc(@modalHeight - @headerHeight);                ._AiPreviewDetailModal_ {                    width: 100%;                    height: 100%;                    display: flex;                    .win-preview-panel-swrap{                        height:100%;                        width: 78%;                        background-color: #3e3e3e;                        .WinPreview {                            height: 100%;                        }                    }                    .pic-win-details-swrap{                        height:100%;                        width: 22%;                                            }                    .WinPreview_ocx{                        @WinPreviewFooterHeight:40 / @px-unit;                        height: calc(100% - @WinPreviewFooterHeight) !important;                    }                }            }        }    }}
._MainStreamDisc_ {    padding:20 / @px-unit;    width: 100%;}
._Aging_{    .hdd-mode-swrap{        margin-bottom: 10 /@px-unit;        .hdd-mode {            display: flex;            align-items: center;            justify-content: space-between;        }    }}
._PtzStep_ {    width: 180 / @px-unit;    height: 48 / @px-unit;    margin: 0 0 0 7.5 / @px-unit;    background-color: @preview_right_ptzStep_Bg;    -webkit-touch-callout: none;     -webkit-user-select: none;     -khtml-user-select: none;     -moz-user-select: none;     -ms-user-select: none;     user-select: none;    .label-normal-container {        display: flex;        padding: 0 !important;    }    &label {        width: 45 / @px-unit !important;        height: 48 / @px-unit !important;        line-height: 48 / @px-unit !important;        margin-left: 4/ @px-unit;        text-align: center !important;        padding-right: 0;    }    &slider {        width: 120 / @px-unit !important;        line-height: 48 / @px-unit !important;        .labelSlider-float-left,        .labelSlider-float-right {            width: 0 / @px-unit;        }        .labelSlider-center {            margin: 0 / @px-unit;            .ant-slider {                margin-top: 9 / @px-unit !important;                margin-bottom: 9 / @px-unit !important;            }            .ant-slider-mark-text,            .ant-slider-mark-text-active {                color: @preview_right_ptzStepMask_ColorN;                font-size: 12 / @px-unit;            }            .ant-slider-step {                .ant-slider-dot {                    width: 0;                    height: 0;                    border: none;                }            }        }    }}
._RaidManage_ {    .FlexLine{        display: flex;        .WorkMode{            margin-left: 15 / @px-unit;        }    }    .fixed-button {        .label-normal-wrapper {            width: auto !important;        }        button {            text-overflow: ellipsis;            white-space: nowrap;            overflow: hidden;            min-width: 100 / @px-unit;            &#Create, &#Celerity {                width: auto;                padding: 4/@px-unit 5/@px-unit;            }        }    }    ._Table_ .ant-table-body {        min-height: 600 / @px-unit;    } }

._HddHealth_ {
  ._Table_ .ant-table-body {
    min-height: 220 / @px-unit;
  }   
}



._Holiday_ {
    ._Table_ .ant-table-body {
        min-height: 450 / @px-unit;
    } 
}
._RecordControl_ {    .content-wrapper {        display: flex;        width: 100%;        height: 100%;        .pagination-left, .pagination-right {            display: flex;            align-items: center;            width: 50/@px-unit;        }        .header-titles {            width: auto;            max-width: 110/@px-unit;            margin-right: 30 / @px-unit;            .title-wrapper {                display: flex;                flex-direction: column;                padding: 8/@px-unit 0;                .header-title-item {                    overflow: hidden;                    white-space: nowrap;                    text-overflow: ellipsis;                    line-height: 30/@px-unit;                }                .header-title-first {                    overflow: hidden;                    white-space: nowrap;                    text-overflow: ellipsis;                    line-height: 32/@px-unit;                }            }        }        .channel-radios {            width: auto;            .sdd-radioGroup-container{                height: auto;            }            .radio-group-wrapper {                display: flex;                .channel-radio-group {                    display: flex;                    flex-direction: column;                    .channel-one-radio-group {                        overflow: hidden;                        white-space: nowrap;                        text-overflow: ellipsis;                        .ant-radio-group {                            margin-top: 11/@px-unit;                        }                        .ant-radio-wrapper {                            height: 30/@px-unit !important;                            line-height: 16/@px-unit !important;                        }                        .ant-checkbox-group{                            margin-top: 14/@px-unit;                            display: flex;                            flex-direction: column;                            .ant-checkbox-wrapper{                                margin-left: 0;                                margin-bottom: 4 / @px-unit;;                            }                        }                    }                }                }            }        }}
._RecordPlan_ {    .childLableContainer-d-inlineBlock {        &>div {            display: inline-block;        }    }      .labelCheckBox-behind-labelText {        .label-normal-container {            padding-top: 0 !important;            padding-bottom: 0 !important;        }    }  }
._Iscsi_ {    width: 100%;    padding:20 / @px-unit;    .operation-btn {        width: 100%;        display: flex;        .label-div-Container {            margin-right: 10/@px-unit;        }    }    .ant-col {        .label-div-Container {            margin-right: 10/@px-unit;        }    }    ._Table_ .ant-table-body {        min-height: 380 / @px-unit;    } }.storage-modal {    .footer-btn {        display: flex;        align-items: center;        justify-content: flex-end;        .label-div-Container {            margin-right: 15/@px-unit;        }    }}

.flexBetween(){
  display: flex;
  align-items: center;
  justify-content: space-between;
}
._ChanlDiscGroup_ {
  width: 100%;
  padding:20 / @px-unit;
  .hdd-mode {
    .flexBetween();
    margin-bottom: 10 /@px-unit;
  }
  ._Table_ .ant-table-body {
    min-height: 450 / @px-unit;
  }   
}
.hddmng-table .ant-table-body{
  min-height:192 / @px-unit !important;
}
._StreamDisc_ {        .hdd-mode-swrap{        margin-bottom: 10 /@px-unit;        .hdd-mode {            display: flex;            align-items: center;            justify-content: space-between;        }    }    .table-item {        margin: 0;        text-align: center;    }    .table-input{        width: 100% !important;        .table-input-select-container{            width: 100% !important;        }        .table-input-select-wrapped{            width: 100% !important;        }    }                ._Table_ .ant-table-body {        min-height: 450 / @px-unit;    }     .hddmanage-combine-table .ant-table-body {        min-height: 150 / @px-unit;    }}
._StreamDisc_ {        .hdd-mode-swrap{        margin-bottom: 10 /@px-unit;        .hdd-mode {            display: flex;            align-items: center;            justify-content: space-between;        }    }    .table-item {        margin: 0;        text-align: center;    }    .table-input{        width: 100% !important;        .table-input-select-container{            width: 100% !important;        }        .table-input-select-wrapped{            width: 100% !important;        }    }                ._Table_ .ant-table-body {        min-height: 450 / @px-unit;    }     .hddmanage-combine-table .ant-table-body {        min-height: 150 / @px-unit;    }}
._StreamDisc_ {        .hdd-mode-swrap{        margin-bottom: 10 /@px-unit;        .hdd-mode {            display: flex;            align-items: center;            justify-content: space-between;        }    }    .table-item {        margin: 0;        text-align: center;    }    .table-input{        width: 100% !important;        .table-input-select-container{            width: 100% !important;        }        .table-input-select-wrapped{            width: 100% !important;        }    }                ._Table_ .ant-table-body {        min-height: 450 / @px-unit;    }     .hddmanage-combine-table .ant-table-body {        min-height: 150 / @px-unit;    }}
._StreamDisc_ {        .hdd-mode-swrap{        margin-bottom: 10 /@px-unit;        .hdd-mode {            display: flex;            align-items: center;            justify-content: space-between;        }    }    .table-item {        margin: 0;        text-align: center;    }    .table-input{        width: 100% !important;        .table-input-select-container{            width: 100% !important;        }        .table-input-select-wrapped{            width: 100% !important;        }    }                ._Table_ .ant-table-body {        min-height: 450 / @px-unit;    }     .hddmanage-combine-table .ant-table-body {        min-height: 150 / @px-unit;    }}
.pic-details-info{    height: 100%;    position: relative;    .pic-details-info-list{        height: 100%;        .pic-details-info-list-swrap{            overflow: auto;            height: 100%;            .detail-image{                width: 100%;                height: 120px;                display: flex;                justify-content: center;                padding: 10 / @px-unit 0 / @px-unit 10 / @px-unit 0 / @px-unit;                .img-swrap{                    width: 90px;                }            }            .detail-text-swrap{                display: flex;                justify-content: center;            }        }    }    .pic-details-bottom{        position: absolute;        bottom: 0 / @px-unit;        width: 100%;        display: flex;        height: 40 / @px-unit;        border-top: 1 / @px-unit solid @BottomBarBorder;        background: @aiPanel_details_bottom_bg;        .pic-details-bottom-left{            width: 30%;            display: flex;            justify-content: center;            align-items: center;        }        .pic-details-bottom-right{            width: 70%;            display: flex;            justify-content: center;            align-items: center;        }    }    .template-card-tag {        position: absolute;        top:0;        left: 0;        width: 110%;        height: 200px;        display: flex;        justify-content: center;        align-items: center;        .svg-icon {            font-size: (180 / @px-unit);        }        .match,        .mismatch {            font-size: 70/@px-unit;        }    }}

._GAVI_ {
    .same-line {
        display: flex;
        align-items: center;
        .label-div-Container {
            margin-right: 30/@px-unit !important;
        }
    }
    .check-box-group {
        .sdd-checkboxGroup-container {
            .ant-checkbox-group {
                display: flex;
                .ant-checkbox-wrapper {
                    margin-right: 30/@px-unit !important;
                }
            }
        }
    }
    .online {
        color: @successColor;
    }
    .offline {
        color: @errorColor;
    }
}
.holidayRadioGroup{
    label{
        width: 45%;
    }
}
._PtzCtrl_ {                padding-top: inherit;     position: relative;    -webkit-touch-callout: none;     -webkit-user-select: none;     -khtml-user-select: none;     -moz-user-select: none;     -ms-user-select: none;     user-select: none;    &header_bg {        width: 150 / @px-unit;        height: 150 / @px-unit;        margin: 25 / @px-unit 0 15 / @px-unit 25 / @px-unit;        position: relative;        & &_icon {            .svgFont(150);            svg {                & + {                    path{                        fill: @preview_right_ptzBg;                     }                }            }        }    }    &header_el {        width: 151 / @px-unit;        height: 151 / @px-unit;        display: flex;        flex-wrap: wrap;        flex-direction: row;        position: absolute;        justify-content: flex-start;        cursor: pointer;        top: 0;        left: 0;        .anticon{            font-size: 50 / @px-unit!important;        }    }    .active{        svg path:nth-of-type(1){            fill:@current!important;        }     }}
.SyncProgress_LeftTime{    padding-left: 10 / @px-unit;}.raidinfo_modal {    ._Table_ .ant-table-body {        min-height: 240 / @px-unit;    } }._RaidInfo_ {    ._Table_ .ant-table-body {        min-height: 450 / @px-unit;    } }
._PtzSet_ {    height:200/ @px-unit;    padding-left: 15 / @px-unit;    width: 100%;    -webkit-touch-callout: none;     -webkit-user-select: none;     -khtml-user-select: none;     -moz-user-select: none;     -ms-user-select: none;     user-select: none;    .label-normal-container {        padding-top: 0 !important;    }    .btnGroups{      display: flex;      width: 180/ @px-unit;      flex-wrap: wrap;    }    .btn{       width:87/ @px-unit !important;       }    .btn3{        width:60/ @px-unit!important;    }    .inputWrap{        display: flex;        justify-content: flex-start;        align-items: center;        >span{          margin-left:10/ @px-unit;          color:@pageTextN;          font-size:14/ @px-unit        }    }  .vertical{    margin-top:40/ @px-unit;  }  .show{      display: '';  }  .hidden{      display: none;  }}
._DateConfig_.MainPage {
    width: 100%;
    .label-normal-behind {
        height: 0;
        &.pl-0 {
            padding-left: 0rem !important;
        }

        .label-normal-container {
            padding-top: 0rem !important;
            button {
                margin-left: 1.5rem;
            }
        }
    }

    .holidayRadioGroup {
        label {
            width: 45%;
        }
    }
}

._User_ {    padding-left: 20 / @px-unit;    padding-top: 20 / @px-unit;    padding-right: 10 / @px-unit;    width: 100%;    ._Table_ {        .ant-table {            background-color: @pageBodyBg;            .ant-table-content {                height: 450 / @px-unit;                overflow-y: auto;            }        }        .not-show {            display: none;        }    }    .ant-modal {        .ant-modal-body {            min-height: 498 / @px-unit;            height: 580 / @px-unit;            overflow-y: auto;            .ant-tabs .ant-tabs-content {                [id*="Auth"] {                    .label-div-Container:not(:first-child) {                        display: inline-block;                        width: 190 / @px-unit                    }                }                [id*="Monitor"] {                    .label-div-Container:not(:first-child) {                        display: inline-block;                        width: 70 / @px-unit                    }                }                [id*="Replay"] {                    .label-div-Container:not(:first-child) {                        display: inline-block;                        width: 70 / @px-unit                    }                }                .label-normal-container  {                    padding: 5/@px-unit 0 !important;                }            }        }    }   .ant-tabs-nav .ant-tabs-tab-btn {        width: 170/@px-unit !important;   }}
.RaidHotSpare_FlexLine{    display: flex;    .AddTo{        margin-left: 15 / @px-unit;    }}._RaidHotSpare_ {    ._Table_ .ant-table-body {        min-height: 450 / @px-unit;    } }
._RemoteStorage_ {    .ant-divider-horizontal{        background-color: #090c0c !important;        margin-top: 8 / @px-unit;        margin-bottom: 8 / @px-unit;    }    .FTPEnable{        display: flex;        .FTPRadio{            margin-left: 100 / @px-unit;        }    }    .EventPreRecord {        display: flex;        .PerRecord{            margin-left: 308 / @px-unit;        }        .StreamType {            margin-left: 108 / @px-unit;        }    }    .TimePicker{        display: flex;        .Connector{            padding-top: 10 / @px-unit;            margin-left: 5 / @px-unit;            margin-right: 5 / @px-unit;        }        .ant-checkbox-group{            margin-left: 20 / @px-unit;            .ant-checkbox-wrapper{                margin-left: 0;            }        }    }    .Channel{        .label-normal{            margin-top: 8 / @px-unit;        }    }    .uploadChannel{        display: flex;        .label-div-Container:first-child  {            margin-right: 109 / @px-unit;        }    }}
.detailTime {    display: flex;    justify-content: space-between;    align-items: center;}.errStatus {    color: @errorColor;}.warnStatus {    color: @warningColor;}.hdd_health_modal {    ._Table_ .ant-table-body {        min-height: 200 / @px-unit;    } }
._BaseConfig_ {    overflow-y: auto;    padding-left: 2%;    width: 100%;    padding-top: 30 / @px-unit;    .fullTimeSelecion {        margin-left: 20 / @px-unit;            }    .leftmargin {        margin-left: 20 / @px-unit;    }    .label-normal-behind {        margin-left: 20 / @px-unit;    }    .addCustomDays {        margin-left: 20 / @px-unit;        .check-box-group {            .label-normal-wrapper {                                width: 700px !important;                .labelCheckboxGroup {                    display: flex;                    .ant-checkbox-wrapper {                        width: 200px;                    }                }            }        }    }    .DelExpiredFilesByChn {        margin-left: 20 / @px-unit;    }    .AutoDelFaceDataSel {        margin-left: 20 / @px-unit;    }}.addCustomDays-modal {    .ant-modal-content {        .ant-modal-body {            padding: 0 !important;            padding-bottom: 30px !important;            ._Holiday_ {                position: relative !important;                .ant-row {                    .fixed-button {                        position: absolute !important;                        padding-top: 40px;                        border-top: none !important;                    }                }            }        }    }}
._ExtraStreamDisc_ {    padding:20 / @px-unit;    width: 100%;}
.hard-disk-management-table .ant-table-body{    min-height: 230 / @px-unit !important;}
._DateConfig_.MainPage {    .label-normal-behind {        &.pl-0 {            padding-left: 0rem !important;        }        .label-normal-container {            padding-top: 0rem !important;            button {                margin-left: 1.5rem;            }        }    }    .holidayRadioGroup {        label {            width: 45%;        }    }}
._AlarmCenter_ {    .divider {        margin: 5 / @px-unit 0;    }}
._Email_ {    height: 90%;    overflow-x: hidden;    overflow-y: auto;    padding-bottom: 75px !important;    .Receiver {        .svg {            font-size: 20px;            cursor: default;        }        .active {            color: #fff;            background-color: #52555a;            cursor: pointer;        }        .receiver-box {            width: 288px;            .box {                display: inline-block;                width: 260px;                height: 118px;                margin-right: 8px;                border: 1px solid #4b515c;                font-size: 13px;                font-weight: 400;                vertical-align: top;                .cell {                    height: 35px;                    line-height: 35px;                    padding: 0 10px;                    margin: 0;                    font-size: 14px;                    vertical-align: top;                    overflow: hidden;                     text-overflow: ellipsis;                     white-space: nowrap;                     &:hover {                        color: #fff;                    }                }            }            span {                display: inline-block;                vertical-align: top;            }        }    }    .ant-divider-horizontal {        margin: 5px 0;    }}


._BPSLimit_{
    padding: 20 / @px-unit;
}


@IEBrowerColor: @current;
._IPSpeaker_{
    padding: 20 / @px-unit;
    .blueIEBrowser {
        .svgOut(@IEBrowerColor);
    }
    .manage-grid-successIcon {
        .svgOut(@successIcon);
        .svgFont(20);
    }
    .manage-grid-errorIcon {
        .svgOut(@errorColor);
        .svgFont(20);
    }
}
._AutoRegister_ {                padding-top: inherit;         .online_bg {        color: @successColor;    }    .offline_bg {        color: @errorColor;    }}
._VideoStream_ {    width: 100%;    .stream-content {        display: flex;    }    .label-normal-container {        padding-top:5 / @px-unit  !important;        padding-bottom: 5  / @px-unit !important;    }    .form {        height: 100%;        overflow-x: hidden;        overflow-y: auto;    }   }
._FourG_ {    width: 100%;    .Row{        display: flex;        align-items: center;    }    .wifi {         svg path:nth-child(2){             fill: #0293ff;         }        &.s_05 {                        .svgOut(#0293ff);        }    }    .ant-input-affix-wrapper-disabled {        background-color: @--component-bg-disable;    }}
._PhoneSetting_ {    .container {        display: flex;        width: 100%;    }}


._GBCertManage_ {
    .delete-icon {
        cursor: pointer;
        font-size: 2.5rem;
        &:hover {
            svg {
                & + {
                    path:first-child {
                        fill: #f00 !important;
                    }
                }
            }
        }
    }
    .download-icon {
        cursor: pointer;
    }
    ._Table_ .ant-table-body {
        min-height: 350 / @px-unit;
    } 
}
._DDNS_ {    .label-text {        width: 60rem;        cursor: default;        user-select: none;    }    p {        margin: 0;    }        .netState_0{                color: @pageTextN;    }    .netState_1{                color: @successColor;    }    .netState_2{                color: @errorColor;    }}.modal-footer {    display: flex;    flex-direction: row-reverse;    button {        width: 100%;    }}
._PtzConfig_ {    padding-left: 20 / @px-unit;    padding-top: 20 / @px-unit;}
._UpgradeIpc_ {    .DeviceUpgrade{        float: left;        margin-top: 8 / @px-unit;    }    .DeviceType {        float: right;    }    .onlineIcon {        .svgOut(@successColor);        .svgFont(20);    }    .offlineIcon {        .svgOut(@warningColor);        .svgFont(20);    }    .errorIcon {        .svgOut(@errorColor);        .svgFont(20);    }    .LeftButton{        float: left;    }    .RightButton{        float: right;        margin-left: 10 / @px-unit;    }    ._Table_ .ant-table-body {        min-height: 500 / @px-unit;    }         .label-normal-wrapper.label-button{        line-height: 0px;    }}.UpgradeIPC_Attention{    margin-top: 20 / @px-unit;}
._ImageStream_ {    .ImageMain {        height: 740 /@px-unit;    }    .FlexLine{        display: flex;        .Second{            margin-left: 10 / @px-unit;        }        .label-normal-behind {            margin-left: 8 / @px-unit;        }    }}.ChannelGroup{    .ant-checkbox-wrapper{        width: 150 / @px-unit;        margin-left: 5 / @px-unit;    }}.CheckAll{    margin-left: 5 / @px-unit;    .ant-checkbox-indeterminate{        .ant-checkbox-inner{            border-color: @current;        }    }}
._PoeManage_{    .online {        .svgOut(@successIcon);        .svgFont(20);    }    .offline {        .svgOut(@errorIcon);        .svgFont(20);    }    .info-line {        display: flex;        align-items: center;        margin-bottom: 10 / @px-unit;        .linked {          margin-right: 60 /@px-unit;          .title{            margin-right: 60/@px-unit;          }        }      }    .tips-panel {        margin-top: 10 / @px-unit;    }    ._Table_ .ant-table-body {      min-height: 450 / @px-unit;    }  }

._RealDisplay_{
    ._Table_ .ant-table-body{
        min-height: 240/@px-unit;
        .fail{
            color: @errorColor;
        }
        .ant-table-cell{
            word-break:break-all;
        }
    }
}
@IEBrowerColor: @current;._RemoteDevice_ {    width: 100%;    ._AllDevice_ {        .all-device-upper {            display: flex;            justify-content: space-between;            .upper-left {                display: flex;                align-items: center;                line-height: 48/@px-unit;                .IPSegments-wraper {                    margin-left: 52/@px-unit !important;                }            }            .upper-right {                display: flex;                align-items: center;            }        }        .all-device-table {            .table-header-bar {                display: flex;                justify-content: space-between;                align-items: center;                .header-left {                    flex-grow: 1;                }                .header-right {                    flex-shrink: 0;                }                .ant-tabs {                    .ant-tabs-nav {                        &::before {                            content: none;                        }                        .ant-tabs-tab:not(:first-of-type) {                            margin-left: 20/@px-unit;                        }                        .ant-tabs-tab-btn {                            height: 40/@px-unit;                            line-height: 40/@px-unit;                            padding: 0 8/@px-unit;                            text-align: center;                            min-width: 118/@px-unit;                            width: auto;                        }                    }                }            }            .table-bottom-bar1 {                display: flex;                justify-content: space-between;                line-height: 32/@px-unit;                            }            .table-bottom-bar2 {                display: flex;                line-height: 32/@px-unit;                            }        }    }    ._AddedDevice_ {        .table-header-bar {            display: flex;            justify-content: space-between;            align-items: center;            height: 64/@px-unit;            .ant-tabs {                .ant-tabs-nav {                    &::before {                        content: none;                    }                    .ant-tabs-tab:not(:first-of-type) {                        margin-left: 20/@px-unit;                    }                    .ant-tabs-tab-btn {                        height: 40/@px-unit;                        line-height: 40/@px-unit;                        padding: 0 8/@px-unit;                        text-align: center;                        min-width: 118/@px-unit;                        width: auto;                    }                }            }        }        .blueIEBrowser {            .svgOut(@IEBrowerColor);        }        .table-bottom-bar {            display: flex;            line-height: 48/@px-unit;                    }        .manage-table-icon-wrapper {            display: flex;            justify-content: center;            align-items: center;        }        ._Table_ .ant-table-body {            min-height: 180 / @px-unit;        }    }    .remoteDevice-table {        ._Table_ .ant-table-body {            min-height: 180 / @px-unit;        }    }    .grid-successIcon {        .svgOut(@successIcon);    }    .grid-wifiIcon {        .svgOut(@current)    }    .grid-infoIcon {        .svgOut(@warningColor)    }    .grid-errorIcon {        .svgOut(@errorIcon)    }    .grid-unInitIcon {        .svgOut(@warningColor)    }    .manage-grid-unInitIcon {        .svgOut(@warningColor);        .svgFont(20);    }    .manage-grid-errorIcon {        .svgOut(@errorIcon);        .svgFont(20);    }    .manage-grid-successIcon {        .svgOut(@successIcon);        .svgFont(20);    }    .grid-deleteIcon {        .svgHover(@errorColor)    }    .grid-previewIcon {        cursor: pointer;    }    .table-hidden {        height: 0;        overflow: hidden;    }}.deviceTip.ant-tooltip {    max-width: 400 / @px-unit !important;}.__ModifyDeviceForm__ {    .label-radio-wrapper {        .ant-radio-wrapper {            width: 150/@px-unit;        }    }    ._Table_ .ant-table-body {        min-height: 160 / @px-unit;    }}.addDevice-modal {    .ant-form-item-has-error {        .ant-input {            border-color: @errorColor;        }    }    .modify-labelInputNumber {        .ant-input-number {            width: 100%;        }    }}._RemoteDevInit_ {    .ant-modal-body {        height: 600/@px-unit;    }    .step1-footer {        display: flex;        flex-direction: row-reverse;    }    .step2-footer {        display: flex;        justify-content: space-between;        .step2-footer-right {            display: flex;        }    }    .step3-footer {        display: flex;        justify-content: space-between;        .step3-footer-right {            display: flex;        }    }    .step4-footer {        display: flex;        flex-direction: row-reverse;    }    .initSuccess {        color: green;    }    .initFailed {        color: red;    }    .label-radio-wrapper {        .ant-radio-wrapper {            width: 150/@px-unit;        }    }    ._Table_ .ant-table-body {        min-height: 200 / @px-unit;    }}.__useModeErrorModal__ {    .ant-modal-body {        height: 260/@px-unit;    }}.remote-init-failed-table {    ._Table_ .ant-table-body {        min-height: 200 / @px-unit;    }}.IPSegments_modal {    width: 560/@px-unit !important;    .labelRadioGroup  {        display: flex;    }    .IPSegments-ipInput {        display: flex;        align-items: center;        .label-normal-wrapper {            width: 240/@px-unit !important;        }        .IPSegments-middle {            margin-left: 10/@px-unit;            margin-right: 10/@px-unit;        }    }}._RemoteTableInfoModal_ {    .RemoteTable{        .remoteInfo-table{            .ant-table-thead {                display: none;            }        }    }}._MoreSetModal_ {    ._MidTitleDivider_ {        margin-top: 0;    }}.allDevice_PlugAndPlay_behind {    line-height: normal;}


._IPSpeakerCfgModal_{
    
}
._ChannelName_ {                padding-top: inherit;     height: 100%;        .ChannelList {        height: 90%;        overflow-y: auto;        .gutter-row {            padding: 0 10px;        }    }}
._OSD_ {    overflow-y: hidden !important;                &.MainPage .ant-spin-container{        display: flex;            }    &plugin {        .ptz_container {            display: flex;            .step_zoom_container {                display: flex;                flex-direction: column;                justify-content: center;                ._PtzZoom_ {                    width: 80%;                }            }        }    }    &config {        margin: 0 20/@px-unit;        overflow-y:auto;        .channelTitleColor{            .colorBox(@posCheckbox);                        .ant-checkbox + span {                padding: 0;            }         }        .title {            display: flex;            justify-content: space-between;                        &_checkbox {                flex: 2;                &.use_switch .label-normal {                    float: right;                    margin-left: 15/@px-unit;                }            }            .setting_button {                flex: 1;                display: flex;                justify-content: flex-end;            }        }        .show_extend {            display: flex;        }        .cover_zone_container {            display: flex;            .label-normal-wrapper {                width: auto !important;                                min-width: auto;            }        }                .cover_zone {            width: 30/@px-unit;            height: 30/@px-unit;            padding: 0;            margin: 5/@px-unit;                &.selected {                color: @buttonNormalTextA !important;                border-color: @formInputBgA !important;                    &:focus {                    color: @buttonNormalTextA !important;                    border-color: @formInputBgA !important;                }            }                &[disabled] {                opacity: .5;                &:hover,                &:active,                &.active{                    opacity: .5;                }            }        }                                .privacy_mask {            display: flex;            justify-content: space-between;                    }        .color_picker {            &_button {                display: inline-block;                cursor: pointer;                width: 50/@px-unit;                display: flex;                align-items: center;                justify-content: center;                svg {                    width: 10/@px-unit;                    height: 10/@px-unit;                    margin-top: 5/@px-unit;                    margin-left: 6/@px-unit;                }            }            &.disabled {                .color_picker_button {                    cursor: not-allowed;                    pointer-events: none;                }            }        }        .color_picker_container {            position: absolute;            z-index: 2;            .twitter_picker {                position: fixed;                z-index: 10;                top: 0;                left: 0;                right: 0;                bottom: 0;            }        }        &_exceptch {                        max-height: 660/@px-unit;            min-height: 400/@px-unit;            padding-right: 60/@px-unit;            > div:first-child {                display: inline-block;            }        }    }    &table {        .ant-table-container {            width: 550/@px-unit !important;        }        .editable-cell-value-wrap {            overflow: hidden;            text-overflow: ellipsis;            white-space: nowrap;            line-height: normal;        }        .label-normal-wrapper {            width: auto !important;            min-width: auto;        }    }}
._AudioOut_MainPage {                padding: 30 / @px-unit;     .title_class {        display: flex;        flex-direction: row;        .label-div-Container {            margin-right: 15 / @px-unit;                    }    }    .content_class {        display: flex;        flex-direction: row;        .label-div-Container {            margin-right: 15 / @px-unit;                    }    }    .ant-picker .ant-picker-input input {        width: 100 / @px-unit;    }}

._SFSConfig_ {
    
    
    
    padding-top: inherit; 
    .sfs_ocx {
        width: 450 / @px-unit; 
        height: 337 / @px-unit; 
        background-color: @preview_center_plugin_Bg;
    }
    .colorBox(@posCheckbox);

    
    .ant-checkbox + span {
        padding: 0;
    }
}

.ChannelList-modal {
    height: 800/@px-unit;
    .ant-modal-body {
        max-height: 600/@px-unit;
        overflow-y: auto;
        .gutter-row {
            padding: 0 10/@px-unit;
            margin-right: 10/@px-unit;
        }
    }
}

._RegionOfInterest_ {
    .form-head {
        display: flex;
        .form-head-right {
            margin-left: 30/@px-unit;
            margin-bottom: 20/@px-unit;
        }
    }
    .roi_ocx {
        
        transform-origin: left top;
    }
}
._Dsiplay_ {    .page-swrap{        width: 100%;        display: flex;        .ant-divider-horizontal {            margin: 5 / @px-unit;            width:85%;            min-width:85%;        }        .main-screen-swrap{            width: 50%;        }        .extra-screen-swrap{            width: 50%;        }    }}
@groupChBox: 23 / @px-unit;._MainScreen_, ._ExtraScreen_ {    ._ChnSplit_ {        clear: both;        .ant-tag {            margin: 1px;            padding: 0;            text-align: center;            width: @groupChBox;            height: @groupChBox;            line-height: @groupChBox;            color: @buttonNormalTextN;            margin: 5 / @px-unit;            background-color: @buttonNormalBgN;            border-color: @buttonNormalBorderN;        }        .operationBtn {            margin-right: 10px;        }        ._Table_{            .table_td_chGroup{                .tr_chGroup{                                        text-align: left;                    display: inline-block;                }            }        }        .ant-divider-vertical{            top: -8 / @px-unit;        }    }}.operationBtn_Div{    display: inline-block;    align-items: center;}.opraBtn{    padding: 0 !important;}
._DeveloperLog_ {    .FlexLine{        display: flex;        .LogLevel{            margin-left: 100 / @px-unit;        }    }    ._Table_ .ant-table-body {        min-height: 500 / @px-unit;    } }
._RecordInfo_{    .recordTable{        width: 80vw;    }    ._Table_ .ant-table-body {        min-height: 360 / @px-unit;    } }
._ChannelInfo_ {    .FlexLine{        display: flex;        ._Table_{            width: 40%;        }        ._Table_ .ant-table-body {            min-height: 500 / @px-unit;        }         .RightPane{            margin-left: 40 / @px-unit;        }    }    .channelState{        .svgOut(@successIcon);        .svgFont(20);    }}
._DefaultCfg_ {    .DefaultCfgLine {        display: flex;        padding-top: 8 / @px-unit;        padding-bottom: 8 / @px-unit;        width: 800 / @px-unit;        .wrapCol{            flex:inherit;            button {                width: 130 / @px-unit;            }        }        .DefaultTip {            margin-left: 40 / @px-unit;            display: flex;            align-items: center;        }    }}

._VideoFusion_windows {
    display: flex;
    width: 1000 / @px-unit;
    flex-wrap: wrap;
    > .label-div-Container {
        margin-right: 50 / @px-unit;
    }
}

.AudioFileList {                padding: 30 / @px-unit;     .select_box {        display: flex;        flex-direction: row;        .label-div-Container {            margin-right: 40 / @px-unit;        }    }    ._Table_ .ant-table-body {        min-height: 190 / @px-unit;    }}.file-modal {    width: 360 / @px-unit !important;    .file_alarm {        text-align: center;    }}
._OnlineMaintenance_ {    .DateExport{        display: flex;        padding-top: 30 / @px-unit;        padding-left: 20 / @px-unit;        .ExportTip{            margin-left: 20 / @px-unit;            margin-top: 13 / @px-unit;        }    }}
._CfgManage_ {    .ConfirmTip{        padding-top: 8/@px-unit;        padding-bottom: 8/@px-unit;    }    .ExportButton{        padding-top: 8/@px-unit;        padding-bottom: 8/@px-unit;    }}
._Update_ {    .ant-btn::before {        background: none!important;     }    .UpdateLine {        display: flex;        align-items: center;        .update_Label {            width: 110 / @px-unit;        }        .checkUpdateText {            width: 150 / @px-unit;        }        .update_text {            width: 140 / @px-unit;        }    }    .UpdateButton {        width: 119 / @px-unit;    }    .NewestVersion {        padding-top: 8 / @px-unit;        padding-bottom: 8 / @px-unit;        color: @successColor;    }    .newVersion {        padding-top: 8 / @px-unit;        padding-bottom: 8 / @px-unit;        .findNewVersion {            color: @errorColor;            margin-right: 5 / @px-unit;            width: 150 / @px-unit;        }        .updatePanel {            height: 200 / @px-unit;            width: 620 / @px-unit;            padding: 0 10 / @px-unit;            border: 1 / @px-unit solid;            border-color: @pageBorderN;            overflow: auto;        }        .UpdateButton {            width: 119 / @px-unit;            margin-left: 500 / @px-unit;        }    }    .newVersionLink {        color: @current;    }    .SystemUpgrade_wrapped {        min-width: 610/@px-unit;    }}
._NetTest_ {    .FlexLine {        display: flex;        justify-content: center;    }    .ipSpan {        width: 20 / @px-unit;        margin-top: 3 / @px-unit;    }    ._Table_ .ant-table-body {        min-height: 500 / @px-unit;    }                            .label-normal-container {        padding: 0 5 / @px-unit !important;    }    ._MidTitleDivider_ {        margin-top: 0;    }    .addressTest-reulst {        height: 160 / @px-unit;    }    .m-c-r {        color: @errorColor !important;    }    .m-c-1EB149 {        color: @successColor;    }    .addressTest-content {        input {            width: 240 / @px-unit;        }        .addressTest-content {            display: inline-block;            vertical-align: top;        }    }}
._AlgorithmVersion_ {    .TextNormal{        color:@pageTextN    }    .TextRed{        color:@errorColor    }}
._Maintenance_ {    .AutoReboot{        display: flex;        .TimeSelect{            margin-left: 5/@px-unit;        }    }}


._IPSpeakerCfgModal_{
    
}
._VersionInfo_ {    .SystemVersion {        width: auto !important;    }    .achor_info {        .label-normal {            color: @achor_infoColor;            cursor: pointer;            &:hover {                color: @achor_infoHoverColor;            }        }    }    .serialNumber {        width: 216px;        height: 216px;        padding: 8px;        background-color: #FFF;    }}
._NetInfo_ {                padding-top: inherit;         ._Table_ .ant-table-body {        min-height: 180 / @px-unit;    } }
._TimeBackup_{    .line-block{        display: flex;    }    .default-interval{        margin-left: 30 / @px-unit;    }    .search-btn-list{        justify-content:flex-end;    }}


.main-container{
    .label-normal-container{
        padding-top: 5px !important;
        padding-bottom: 5px !important;
    }
}

.flex-container {
    display: flex;
    width: 100%;

    .flex-item {
        flex: 1;
        text-align: center;

        &.left{
            text-align: left;
            &:first-child{
                padding-left: 30px;
            }
        }
    }
}

.flex-checkbox-container {
    display: flex;
    width: 100%;
    justify-content: space-around;

    .flex-checkbox-item {
        flex: 1;
        text-align: center;
        &.left{
            text-align: left;
            &:first-child{
                padding-left: 30px;
            }
        }
    }
}

.paging-container {
    height: 40px;
    margin-top: 20px;
    margin-left: 500px;

    .paging-text {
        display: inline-block;
        width: 200px;
        height: 40px;
        text-align: center;
    }

    .paging-icon {
        display: inline-block;
        text-align: center;