        .timetemplateGroup{
            border-right:1px solid @dividerColorNo9;
            flex: 0 0 260px;
            .search{
                margin-top:16px;
                margin-bottom:16px;
                height:30px;
            }
            .templist{
                display: flex;
                flex-direction: column;
                max-height: 620px;
                height: 620px;
                overflow-y: auto;
                flex-wrap: nowrap;
            
            }
            .templist-li{
                height:40px;
                cursor: pointer;
                line-height: 40px;
                &:hover{
                    background-color: @secondNavHoverColorNo14;
                }
                &.isactive{
                    background-color: @secondNavHoverColorNo14;    
                }
                .hiddenIcon{
                    visibility: hidden;
                }
                .templist-li-icon{
                    float: right;
                    height: 40px;
                    line-height: 40px;
                    margin-right:16px;
                    margin-top:2px;
                }
                .templistLi-span{
                    width:160px;
                    margin-left:5px;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    display: inline-block;
                    vertical-align: top;
                }
            }
        }
        .timetemplateDetail{
            @labeltimeWidth:140px;
            padding-left:16px;
            max-width: 980px;
            .formitemheader{
                margin-top:20px;
            }
            .formitem{
                margin-bottom:16px !important;
            }
            .ant-form-item-label{
                width:@labeltimeWidth;
            }
            .ant-form-item-control{
                width:600px;
            }
            .timeWrap{
                width: 804px;
                display: inline-block;
                border-radius: 4px;
                border: solid 1px @inputBorderColorNo10;
            }
            .holidayset{
                margin-top:16px;
                margin-left:@labeltimeWidth;
            }
            .ant-tabs {
                overflow: visible;
            }
            .ant-tabs-tab:nth-child(1){
                margin-left: 50px;
            }
            .ant-tabs-tab:nth-child(2){
                margin-left: 100px;
            }
            .ant-table{
                border:1px solid @inputBorderColorNo10
            }
            .icon {
                font-size: 20px;
                cursor: pointer;
            }
        }
    }
    .ant-table-body {
        min-height: 240px;
    }
    ._ScheduleComponent_{
        padding-left: 0;
        padding-right: 0;
    }
}
._UpdatePassword_ {
    // 页面组件特有的CSS，
    // UI组件的样式在UI组件组内内部
    // 不同通用样式存放在 style/common.less中
    padding: 16px;
    .ant-row:first-of-type {
        margin-bottom: 30px;
    }
}


._Upnp_ {
    // 页面组件特有的CSS，
    // UI组件的样式在UI组件组内内部
    // 不同通用样式存放在 style/common.less中
    
    .modify{
        display: flex;
        justify-content:space-around
        // color: #1890ff;
    }
    .ant-table-tbody > tr.ant-table-row-selected > td{
        background: #ffffff
    }
    
    .ant-table-tbody > tr.ant-table-row-selected:hover > td{
        background: #fafafa
    }
    .list-item{
        padding-bottom: 14px;
        border-bottom: @border-normal;
        margin-bottom: 24px;
    }
    .ant-form-item-has-error .ant-form-item-explain,
    .ant-form-item-explain {
        margin-left: 160px;
    }
}

._UPnPConfig_ {
    background: @contentBgColorNo15;
    padding: 16px;
    .content {
        padding-top: 18px;
        .LabelSwitch-label-Col, .LabelInput-label-Col, .labelSelect-label-Col, 
        .labelText-label-Col{
            text-align: left;
            padding-left: 15px;
            label {
                color:@textColorNo5;
            }
        }
        .list-item {
            margin: 15px 0;
        }
        .main {
            // border-bottom: 1px solid @border-color;
        }
    }
    ul, li {
        list-style: none;
        padding: 0
    }
    .operation {
        margin: 10px 0px 0px 15px;
    }
    .fn-marr10 {
        margin-right: 10px;
    }
    .fn-marl15 {
        margin-left: 15px;
    }
    .ant-modal .ant-modal-content {
        .ant-modal-header {
            padding: 14px 10px 14px 16px;
        }
        .ant-modal-close-x {
            width: 50px;
            height: 50px;
            line-height: 50px;
            padding-left: 18px;
        }
        .ant-modal-footer {
            padding: 10px;
        }
        .ant-modal-body {
            padding: 25px 60px 25px 60px;
            .ant-form {
                margin-top: -5px;
                margin-bottom: -5px;
                .ant-form-item-label {
                    text-align: left;
                }
            }
            .ant-form > .ant-col {
                margin-bottom: 4px;
                &:last-child {
                    margin-bottom: 0px;
                }
            }
        }
        .ant-row {
            margin-bottom: 6px;
            &:last-child {
                margin-bottom: 0px;
            }
        }
    }
}

._UPnPTable_{
    position: relative;
    .ant-table-thead {
        border-top:none
    }
    .bottom-pagination{
        border-top: 1px solid  @border-color;
    }
    border: 1px solid @border-color;
    .anticon {
        color: inherit;
    }
    .anticon-disabled {
        color: grey;
        cursor: not-allowed;
    }
    .selectedRow {
        background-color: #E6F7FF;
    }
    //调整图标颜色
    i {
        cursor: pointer;
        &:hover {
            color: @export-color;
        }
    }
}
.usb-import-export-progress {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
._UserManagement_ {
    // 页面组件特有的CSS，
    // UI组件的样式在UI组件组内内部
    // 不同通用样式存放在 style/common.less中
}

._Version_ {
    // 页面组件特有的CSS，
    // UI组件的样式在UI组件组内内部
    // 不同通用样式存放在 style/common.less中
    .m-content {
        // border-top: 1px solid #e8e8ee;
        // border-left: 1px solid #e8e8ee;
        // border-right: 1px solid #e8e8ee;

        .list_row {
            height: 40px;
            line-height: 40px;
            // border-bottom:  1px solid #e8e8ee;
            // &:nth-child(2n) {
            //     background-color: #f0f2f5;
            // }
        }
        .list_col {
            margin-left: 20px;
        }
        .list_col > div {
            overflow:hidden;
            text-overflow:ellipsis;
            white-space:nowrap
        }
    }
}

._VersionInfo_ {
    // 页面组件特有的CSS，
    // UI组件的样式在UI组件组内内部
    // 不同通用样式存放在 style/common.less中
    .m-content {
        border-top: 1px solid #e8e8ee;
        border-left: 1px solid #e8e8ee;
        border-right: 1px solid #e8e8ee;

        .list_row {
            height: 40px;
            line-height: 40px;
            border-bottom:  1px solid #e8e8ee;
            &:nth-child(2n) {
                background-color: #f0f2f5;
            }
        }
        .list_col {
            margin-left: 20px;
        }
        .list_col > div {
            overflow:hidden;
            text-overflow:ellipsis;
            white-space:nowrap
        }
    }
    .m-title {
        font-weight: bold;
        margin: 24px 0 12px;
    }
}



._Video_ {
    // 页面组件特有的CSS，
    // UI组件的样式在UI组件组内内部
    // 不同通用样式存放在 style/common.less中
    
    .ant-tooltip-inner {
        color: #fff;
        padding: 4px 8px;
    }
    .lableInput-behind-row {
        .ant-row{
            .ant-col-14{
                height: 10px;
            }
        }
    }
    .lableInput-behind-div {
        margin-top: -32px;
        margin-left: 16px;
    }
    .video-wrap-div {
        border: '1px solid red';
        height: '500px';
        width: 433px;
    }
    .video-wrap {
        width: 430px;
        height: 338px;
        display: inline-block;
        background-color: black;
        border: 1px solid black;
        line-height: 338px;
        font-size: 40px;
        text-align: center;
    }
    .video-param-row {
        // min-width: 1050px;
        display: flex;

        .video-param-row-label {
            flex: 0 0 453px
        }
        .video-param-row-info {
            flex: 1;
            display: flex;
            .param-title-div {
                flex: 0 0 130px;
                overflow: hidden;
                li:hover {
                    color: #1890ff;
                    background-color: #ECF4FF;
                }
                li {
                    text-align: center;
                }
            }
        }
    }
    .video-span {
        line-height: 35px;
    }
    // .labelSlider-center{
    //     margin-left:0
    // }
    .topOption{
        padding-bottom: 24px;
        border-bottom: @border-normal;
        margin-bottom: 24px;
    }
    .stream-span{
        margin:10px 0 8px 40px;
        line-height: 32px
    }
}


._VideoVts_ {
    // 页面组件特有的CSS，
    // UI组件的样式在UI组件组内内部
    // 不同通用样式存放在 style/common.less中
    

    // .param-title-div {
    //     li:hover {
    //         color: #1890ff;
    //         background-color: #ECF4FF;
    //     }
    //     li {
    //         text-align: center;
    //     }
    // }
    .ant-tooltip-inner {
        color: #fff;
        padding: 4px 8px;
    }
    // .lableInput-behind-row {
    //     .ant-row{
    //         .ant-col-14{
    //             height: 10px;
    //         }
    //     }
    // }
    // .lableInput-behind-div {
    //     margin-top: -32px;
    //     margin-left: 16px;
    // }
    .video-wrap-div {
        border: '1px solid red';
        height: '500px';
        width: 433px;
    }
    .video-wrap {
        width: 430px;
        height: 338px;
        display: inline-block;
        background-color: black;
        border: 1px solid black;
    }
    .video-param-row {
        min-width: 1050px;
    }
    .video-span {
        line-height: 35px;
    }
}

._Voice_ {
    // 页面组件特有的CSS，
    // UI组件的样式在UI组件组内内部
    // 不同通用样式存放在 style/common.less中
    .m-content {
        // height: calc(100% - 53px);
        // border: 1px solid #e8e8ee;
        .list_row {
            height: 40px;
            line-height: 40px;
            margin: 10px 0px 0px 10px;
        }
        .eventTable{
            margin: 10px 10px 10px 10px;
        }
        > .ant-tabs {
            height: 100%;
            .ant-tabs-content {
                height: 100%;
            }
            .ant-tabs-tabpane {
                height: calc(100% - 60px);
                border: @border-normal;;
            }
        }
        .btn-box {
            display: inline-block;
        }
    }
}



._VTH_ {
    // 页面组件特有的CSS，
    // UI组件的样式在UI组件组内内部
    // 不同通用样式存放在 style/common.less中
    .search-input {
        float: right;
        width: 180px;
    }  
    .has-error .ant-form-explain, .ant-form-explain {
        margin-left: 10px;
    }
    .ant-form-item-label{
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}


._VTOInfo_ {
    // 页面组件特有的CSS，
    // UI组件的样式在UI组件组内内部
    // 不同通用样式存放在 style/common.less中
    
    .ant-form-item{
        margin-bottom: 5px;
    }
    .LabelIP-container{
        margin: 0px;
        .LabelIP-ip-input  {
            height: 36px;
            line-height: 34px;
        }
    }
}

._VTORoom_ {
    // 页面组件特有的CSS，
    // UI组件的样式在UI组件组内内部
    // 不同通用样式存放在 style/common.less中
    .LabelIP-container {
        margin: 0;
    }
    .LabelIP-ip-input {
        line-height: 0;
    }
    .has-error .ant-form-explain, .ant-form-explain {
        margin-left: 10px;
    }
    .ant-form-item-label{
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}


._VTOSet_ {
    // 页面组件特有的CSS，
    // UI组件的样式在UI组件组内内部
    // 不同通用样式存放在 style/common.less中
}

._VTS_ {
    // 页面组件特有的CSS，
    // UI组件的样式在UI组件组内内部
    // 不同通用样式存放在 style/common.less中
    .LabelIP-container {
        margin: 0;
    }
    .LabelIP-ip-input {
        line-height: 0;
    }
    .has-error .ant-form-explain, .ant-form-explain {
        margin-left: 10px;
    }
    .ant-form-item-label{
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

._SystemLog_ {
    // 页面组件特有的CSS，
    // UI组件的样式在UI组件组内内部
    // 不同通用样式存放在 style/common.less中
    &header {
        display: flex;
        justify-content: space-between;
        margin-top: 10px;

        &-label {
            display: inline-block;
            width: 120px;
            text-align: right;
            margin-right: 10px;
        }
        &-select {
            display: inline-block;
            width: 220px;
            margin-right: 10px;
        }

        &-btn {
            margin-left: 10px;
        }

    }
    &logTotal {
        display: flex;
        justify-content: space-between;
        margin-top: 10px;
    }

    &container {
        margin-top: 10px;

        &-pagination {
            margin-top: 10px;
            text-align: right;
        }
    }

    .m-content {
        height: calc(100% - 53px);
        border-top: 1px solid #e8e8ee;
        border-right: 1px solid #e8e8ee;
        border-left: 1px solid #e8e8ee;
    }
    min-width: 1090px;
    .ant-drawer-header {
        padding: 20px 24px;
    }
    .ant-drawer-close {
        width: 62px;
        height: 62px;
    }
    ._SystemLog_header {
        .LabelInput-label-dark {
            margin-bottom: 0px;
            top: 4px;
            line-height: 0px;
        }
    }
    .encryptcol .LabelInput-label-dark {
        top: 5px;
    }
}
.WeekPlan-Modal {
    .ant-form-item {
        margin-bottom: 16px !important;
    }
    ._ScheduleComponent_ {
        padding: 0;
    }
}

._WiegandSet_ {
    // 页面组件特有的CSS，
    // UI组件的样式在UI组件组内内部
    // 不同通用样式存放在 style/common.less中
    
}

._Wifi_ {
    // 页面组件特有的CSS，
    // UI组件的样式在UI组件组内内部
    // 不同通用样式存放在 style/common.less中
    .icon {
        font-size: 20px;
        vertical-align: middle;
        &:hover {
            cursor: pointer;
            color: @btnNormalColorNo1;
        }
    }
}

._Wizard_ {
    height: calc(100vh - 64px);
    .wizard-header {
        height: 64px;
    }
    .wizard-wrap {
        min-width: 1280px;
        height: 100%;
        padding: 16px;
    }
    .wizard-content {
        height: 100%;
        background-color: #ffffff;
    }
    .wizard-header-wrap {
        height: 64px;
        min-Width: 1280px;
        line-height: 64px;
        color: @listBorderColorNo8;
        background-color: @titleColorNo4;
        position: fixed;
        width: 100%;
        z-index: 100;
    }
    .header-logo {
        margin-left: 20px;
        cursor: pointer;
    }
    .header-logo-icon {
        margin-right: 10px;
        display: inline-block;
        vertical-align: -5px;
        width: 28px;
        height: 25px;
        background-image: url('/static/media/logo.0cc00c04.png');
    }
    .header-divider{
        height: 1.2rem;
        margin-left: 10px;
        background: rgba(255, 255, 255, 0.2);
    }
    .wizard-step-wrap {
        padding: 50px 20%;
    }
    .wizard-step-content {
        display: flex !important;
        flex-direction: column;
        align-items: center;
        .vtoset-wrap, .sip-wrap {
            padding: 20px 30px;
        }
        ._DevManager_ {
            width: 100%;
            min-height: auto;
            padding: 16px;
            margin: 0;
        }
    }
    .ant-carousel .slick-slider {
        margin-top: 0;
    }
    .wizard-step-footer {
        justify-content: center;
        // padding-bottom: 30px;
        // margin-top: 16px;
    }
    .devicetype-wrap {
        width: 600px;
        border: @border-normal;
        align-items: center;
        cursor: pointer;
    }
    .devicetype-wrap-focus {
        width: 600px;
        border: 1px solid #1e93fe;
        background-color: #e6f7ff;
        align-items: center;
        cursor: pointer;
    }
    .devicetype-img {
        padding: 40px 0;
    }
    .devicetype-text {
        font-size: 21px;
    }
    .icon {
        font-size: 60px;
    }
}
.DevManager_modal_content {
    .ant-form-item,
    .form-extra {
        margin-bottom: 16px !important;
    }
    .type-select {
        padding-bottom: 30px;
        margin-bottom: 28px;
        border-bottom: 1px solid #e9ebee;
    }
    .label-normal-container {
        padding: 0 !important;

        .label-normal-wrapper {
            width: unset !important;
        }
    }
    .ant-form {
        .ant-form-item:last-child {
            margin-bottom: 0 !important;
        }
    }
    .ant-form-item-label {
        text-overflow: ellipsis;
        padding-top: 5px;
    
        & > label {
            display: inline;
        }
    }
    .label-password-container {
        .ant-form-item-has-error .ant-form-item-explain,
        .ant-form-item-explain {
            margin-left: 196px;
        }
        .ant-input-affix-wrapper {
            width: 236px;
        }
    }
}


._DevManager_ {
    min-height: calc(100vh - 96px);
    height: auto;
    // padding: 16px;
    padding: 24px 32px;
    margin: 16px;
    background: #fff;
    overflow: hidden;

    .ant-btn-link {
        padding: 0;
    }

    .round {
        display: inline-block;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        margin-right: 5px;

        &.online {
            background-color: @successColorNo19;
        }
        &.offline {
            background-color: @errorColorNo17;
        }
    }
}

.filter-dropdown-radio {
    width: 140px;
    display: flex;
    flex-direction: column;
    padding: 8px;

    .ant-radio-wrapper {
        width: 100%;
        line-height: 32px;

        &.selected {
            background-color: @secondNavHoverColorNo14;
            color: @btnHoverColorNo2;
        }
        .ant-radio {
            display: none;
        }
    } 
}
.DiskFullWarning {
    .ant-modal-confirm-title {
        display: inline;
        padding-left: 10px;
    }
    .ant-modal-confirm-content {
        word-wrap: break-word;
        word-break: break-all;
    }
}

.h5Bar {
    position: absolute;
    right: 0px;
    top: 0px;
    .active{
        color: @export-color;
    }
    i {
        margin-right: 10px;
        &:hover, &.active{
            color: @export-color;
        }
    }

}
/* border css */
.m-b-none {
    border: none !important;
}

.m-bb-0 {
    border-bottom: 0 !important;
}
/*
* 使用函数生成margin、padding等的类名的方式
*/


/* margin
* 类明分别为 fn-mar、fn-marl10、fn-mart10、fn-marb10、fn-marr10....
*/
@margin: 0, 10, 16, 20, 30;
@marginLeft: 0, 5, 10, 15, 16, 20, 40;
@marginRight: 0, 5, 10, 15, 20, 50;
@marginTop: 0, 5, 6, 10, 15, 16, 20, 22, 30, 40, 50;
@marginBottom:  0, 5, 10, 12, 14, 15, 16, 18, 20, 30, 40, 50;


/* padding
* 类明分别为 fn-pad、fn-padl10、fn-padt10、fn-padb10、fn-padr10....
*/
@padding: 0, 10, 16, 20, 30;
@paddingLeft: 5, 10, 15, 16, 20;
@paddingTop:  5, 10, 15, 20;
@paddingRight: 5, 10, 15, 16, 20;
@paddingBottom: 0, 5, 10, 15, 16;


.fn-mar(@name, @value) when(@name = margin){
    .fn-mar@{value}{
        @{name}: @value + 0px;
    }
}
.fn-mar(@name, @value) when(@name = margin-left){
    .fn-marl@{value}{
        @{name}: @value + 0px;
    }
}
.fn-mar(@name, @value) when(@name = margin-right){
    .fn-marr@{value}{
        @{name}: @value + 0px;
    }
}
.fn-mar(@name, @value) when(@name = margin-top){
    .fn-mart@{value}{
        @{name}: @value + 0px;
    }
}
.fn-mar(@name, @value) when(@name = margin-bottom){
    .fn-marb@{value}{
        @{name}: @value + 0px;
    }
}


.loopEdge(@list, @name, @i:1) when (@i <= length(@list)) {
    .fn-mar(@name, extract(@list, @i));
    .loopEdge(@list, @name, @i+1);
}



.loopEdge(@margin, margin);
.loopEdge(@marginLeft, margin-left);
.loopEdge(@marginTop, margin-top);
.loopEdge(@marginRight, margin-right);
.loopEdge(@marginBottom, margin-bottom);



.fn-mar(@name, @value) when(@name = padding){
    .fn-pad@{value}{
        @{name}: @value + 0px;
    }
}
.fn-mar(@name, @value) when(@name = padding-left){
    .fn-padl@{value}{
        @{name}: @value + 0px;
    }
}
.fn-mar(@name, @value) when(@name = padding-right){
    .fn-padr@{value}{
        @{name}: @value + 0px;
    }
}
.fn-mar(@name, @value) when(@name = padding-top){
    .fn-padt@{value}{
        @{name}: @value + 0px;
    }
}
.fn-mar(@name, @value) when(@name = padding-bottom){
    .fn-padb@{value}{
        @{name}: @value + 0px;
    }
}

.loopEdge(@padding, padding);
.loopEdge(@paddingLeft, padding-left);
.loopEdge(@paddingTop, padding-top);
.loopEdge(@paddingRight, padding-right);
.loopEdge(@paddingBottom, padding-bottom);


/* length
* @width 类明分别为 fn-wid10、fn-wid20、fn-wid30、fn-wid40....
* @widthp 生成百分比宽度 fn-widp10、fn-widp20、fn-widp30、fn-widp40
* @height 类明分别为 fn-hei10、fn-hei20、fn-hei30、fn-hei40....
* @heightp 生成百分比宽度 fn-heip10、fn-heip20、fn-heip30、fn-heip40
* @minWidth 生成最小宽度 fn-minwid10、fn-minwid20、fn-minwid30、fn-minwid40
* @maxWidth 生成最大宽度 fn-maxwid10、fn-maxwid20、fn-maxwid30、fn-maxwid40
* @minHeight 生成最小宽度 fn-minhei10、fn-minhei20、fn-minhei30、fn-minhei40
*/
@width: 0, 10, 16, 20, 30, 50, 80, 100, 120, 200, 220, 250, 280, 300, 320;
@widthP: 0, 10, 16, 20, 30, 100;
@height: 0, 10, 16, 20, 30;
@heightP: 0, 10, 16, 20, 30, 100;
@minWidth: 0, 10, 16, 20, 30, 100, 120, 140, 200, 250;
@maxWidth: 0, 10, 16, 20, 30, 100, 120, 140, 200, 250;
@minHeight: 0, 10, 16, 20, 30, 100;

.fn-wid(@name, @value) when(@name = width){
    .fn-wid@{value}{
        width: @value + 0px;
    }
}

.fn-wid(@name, @value) when(@name = widthp){
    .fn-widp@{value}{
        width: @value + 0%;
    }
}

.fn-wid(@name, @value) when(@name = height){
    .fn-hei@{value}{
        height: @value + 0px;
    }
}

.fn-wid(@name, @value) when(@name = heightp){
    .fn-heip@{value}{
        height: @value + 0%;
    }
}

.fn-wid(@name, @value) when(@name = minWidth){
    .fn-minwid@{value}{
        min-width: @value + 0px;
    }
}
.fn-wid(@name, @value) when(@name = maxWidth){
    .fn-maxwid@{value}{
        max-width: @value + 0px;
    }
}
.fn-wid(@name, @value) when(@name = minHeight){
    .fn-minhei@{value}{
        min-height: @value + 0px;
    }
}

.loopLen(@list, @name, @i:1) when (@i <= length(@list)) {
    .fn-wid(@name, extract(@list, @i));
    .loopLen(@list, @name, @i+1);
}



.loopLen(@width, width);
.loopLen(@widthP, widthp);
.loopLen(@height, height);
.loopLen(@heightP, heightp);
.loopLen(@minWidth, minWidth);
.loopLen(@maxWidth, maxWidth);
.loopLen(@minHeight, minHeight);

.rtl {
    .ant-form-item-explain {
        text-align: left;
        direction: rtl;
    }
    .label-normal-container .label-normal {
        text-align: left;
        direction: rtl;
    }
    .sideView-menu .ant-menu-item a{
        text-align: left;
        direction: rtl;
    }
    .z-sections .z-sections-title .title-left {
        text-align: left;
        direction: rtl;
    }
    ._SystemUpgrade_ .find-version, ._SystemUpgrade_ .wrap-title {
        text-align: left;
        direction: rtl;
    }
    
    .ant-alert {
        // text-align: left;
        direction: rtl;
        .ant-alert-message {
            margin-right: 10px;
        }
    }
    .ant-form-item-label {
        text-align: left;
        direction: rtl;
    }
    .ant-table-thead > tr > th, .ant-table-tbody > tr > td {
        text-align: left;
        direction: rtl;
    }
    ._SAFESecurityStatus_titleTip, .icon-desc-popover div:not(.icon-desc-title), .icon-desc-popover .ant-col {
        text-align: left;
        direction: rtl;
    }
    ._SAFESecurityStatus_ ._SAFESecurityStatus_listTitle {
        direction: rtl;
        .anticon {
            margin-left: 5px;
        }
    }
    .selectGetCert-radio-group .info {
        text-align: left;
        direction: rtl;
    }
   
}
/**字体相关*/
.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: 1.25rem;
}

.m-fs-18 {
    font-size: 1.5rem;
}

.m-fs-43 {
    font-size: 43/12rem;
}

/* line-height */
.m-lh-24 {
    line-height: 2rem;
}

.m-lh-28 {
    line-height: 2.3333333333333335rem;
}

.m-lh-30 {
    line-height: 2.5rem;
}

.m-lh-32 {
    line-height: 32/12rem;
}

.m-lh-32-4 {
    line-height: 2.7rem;
}

.m-lh-35 {
    line-height: 35/12rem;
}

.m-lh-40 {
    line-height: 40/12rem !important;
}

/* 鼠标的css */
/* 默认 箭头 */
.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-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;
}





/*各组件less引入主题然后赋值给自己的实际变量值*/
@btnNormalColorNo1: #1890ff; // primary 按钮正常状态颜色、图标/文字 Hover状态颜色
@btnHoverColorNo2: #40a9ff; // primary 按钮 hover颜色
@btnPressedColorNo3: #096dd9; //  primary 按钮 鼠标按下颜色
@titleColorNo4: #272727; // 二级导航文字颜色、表单/正文标题颜色、图标颜色
@textColorNo5: #272727; // 正文文字颜色
@formContentColorNo6: #565656; // 表单内容颜色（比如input输入内容的颜色）
@disableColorNo7: #8f8f8f; // 次要文字/提示性文字颜色、disabled的文字/图标颜色
@listBorderColorNo8: #e8e8e8; // 列表/表格 边框颜色、滑块等控件底色
@dividerColorNo9: #e8e8e8; // 分割线颜色
@inputBorderColorNo10: #d9d9d9; // 次按钮边框、输入框边框
@disableInputBgColorNo11:#f5f5f5; // 次按钮 disabled、input 的disabled 的背景色
@firstNavBgColorNo12: #001529; // 一级导航背景色
@secondNavBgColorNo13: #ffffff; // 二级导航背景色
@secondNavHoverColorNo14: #e6f7ff; // 表格的td的Hover、二级导航的hover
@contentBgColorNo15: #ffffff; // 内容背景色
@bodyBgColorNo16: #f0f2f5; // 最底层背景色
@homePageNo1:#ffffff;// 首页卡片颜色
@homePageNo2:#f0f2f5;// 首页背景颜色
@errorColorNo17: #f5222d; // 失败色
@warnColorNo18: #fcac15; // 警告色
@successColorNo19: #52c41a; // 成功色
@linkColorNo20: #1890ff; // 链接、其他提示颜色

/*该颜色和之后的项目一致，采用20基础色*/
@font-size-improtant: 14px; //重要标准字大小，用于标题、重要提示
@font-size-normal: 12px; //常规标准字大小，用于大多数常规文字，如正文等
@color-border: @listBorderColorNo8; //用于普通的边框颜色，灰
@border-color: @listBorderColorNo8; //用于普通的边框颜色，灰
@border-normal: 1px solid @color-border; //常规边框, 灰色
@sideMenuBackColor:#ebecf0;
@sideSubMenuTitleColor:linear-gradient(#f7f7f7,#dadde1);

/**三方库的变量需要如下用标签包裹起来**/
/**antd**/
@text-color:@textColorNo5;
@primary-color:@btnNormalColorNo1;
/**antd**/


/*TabMenu一级导航*/
@topMenuTabActiveColor:#ffffff; //头部导航栏激活颜色
@topMenuTabColor:#a6adb4; // 头部导航栏未激活颜色
@tabArrowColor:@contentBgColorNo15; //头部箭头导航图标颜色
@tabArrowHoverColor:@btnNormalColorNo1;//头部箭头导航图标hover颜色
@tabCloseColor:@contentBgColorNo15;//头部导航关闭按钮颜色
@tabBackGroundColor:@firstNavBgColorNo12;//头部导航背景色
@tabMenuTabHoverColor:#ffffff;//头部导航栏hover颜色
@tabDividerColor: rgba(255, 255, 255, 0.2);//头部竖直分割线颜色

/*MenuView主页菜单*/
@MenuViewPageSwitch:#AFC6E1;//主页菜单下的分页圆圈背景色
@MenuViewActivePageSwitch:@linkColorNo20;//主页菜单下的分页圆圈激活色
@MenuViewItemLineColor:#81B6FC;//主页菜单选项下划线颜色
@MenuViewBackGroundColor:@homePageNo1;//主页菜单背景色
@MenuViewItemMessageColor:@disableColorNo7;//主页菜单描述文字颜色
@MenuViewItemHoverColor:#ECF4FF;//主页菜单hover背景色
@MenuViewCarouselColor:#7DB1EC;//主页菜单左右箭头背景色

/*sideMenu二级导航*/
@sideMenuBackGroundColor:@secondNavBgColorNo13; // 二级导航背景色
@sideMenuSelectedColor:#ECF4FF; //二级导航选中色

/*login 登录*/
@loginForgetPasswordHoverColor:#ffffff; // 登录忘记密码按钮hover色
@loginIconColor:@btnHoverColorNo2; // 登录图标颜色

/*页面相关*/
@font-size-normal: 12rem; //字体大小（px）+单位,用于后面计算rem
/*换肤相关颜色*/
@skin-black: #001529;
@skin-blue: #1890ff;

@export-color:#1890ff;

/*一键诊断颜色*/
@body-background: #F0F2F5;
@indexBgColor:#fff;
@normalColor:#52c41a;   // 辅助色  成功、密码强度强
@warnColor:#fcac15;   // 辅助色  警告、密码强度中
@errorColor:#f5222d;  // 辅助色  错误、密码强度低
._PasswordCheck_ {
    // UI组件特有的CSS，
    
}



._SysSet_ {
    // 页面组件特有的CSS，
    // UI组件的样式在UI组件组内内部
    // 不同通用样式存放在 style/common.less中
    
}
.icon_General{
    background: url('/static/media/General.e5fd6b90.png');
}
.icon_DeviceSetting{
    background: url('/static/media/DeviceSetting.2842a262.png');
}
.icon_PersonManagement{
    background: url('/static/media/PersonManagement.0c04ebb7.png');
}
.icon_NetworkSetting{
    background: url('/static/media/NetworkSetting.0115da2e.png');
}
.icon_Log{
    background: url('/static/media/Log.20de3e1d.png');
}
.icon_SystemSettings{
    background: url('/static/media/SystemSettings.17ec4b3b.png');
}
.icon_maintenance_center {
    background: url('/static/media/MaintenanceCenter.5f569417.png');
}

/**三方库的变量需要如下用标签包裹起来**/
/**antd**/
@text-color:@textColorNo5;
@primary-color: @btnNormalColorNo1;
/**antd**/

/*TabMenu一级导航*/
@tabBackGroundColor:@firstNavBgColorNo12;//头部导航背景色

html, body {
    height: 100%;
    display: block!important;
}
body {
    background-color: @bodyBgColorNo16;
}
.ant-table-cell {
    .myicon {
        font-size: 20px;
    }
}
.label-explain {
    font-size: 12px;
}
.ant-table-pagination.ant-pagination {
    margin: 16px 0 0;
}
.m-h-100-p{
    height: 100%;
    background-color: @bodyBgColorNo16;
}
  
.clearfix {
    &::after {
        content: ".";            
        display: block;        
        height: 0;
        visibility: hidden;  
        clear: both;   
    }
}
.fn-left {
    float: left;
}
.fn-right {
    float: right;
}
._SideView_::after {
    display: none;
}
ul, li {
    list-style: none;
    margin: 0;
    padding: 0;
}
.has-error .ant-form-explain {
    margin-left: 21%;
}
.LabelInput-label-Col {
    text-align: left;
}
.myicon[disabled] {
    color: @disableColorNo7;
    cursor: default;
}
#main {
    min-width: 1100px;
}
// 重写antd样式文件
.ant-table-thead > tr > th, .ant-table-tbody > tr > td {
    padding: 9px 11px;
}
.ant-table-thead > tr {
    background: transparent;
}
.ant-table-tbody > tr > td .myicon-edit {
    margin-right: 10px;
}
.ant-table-thead .ant-table-header-column .ant-table-column-title {
    font-weight: bold;
}
.ant-form-item-label > label::after {
    content: '';
}
.ant-popover {
    min-width: 150px;
    .ant-popover-inner-content{
        overflow: hidden;
        .ant-popover-buttons{
            .ant-btn{
                float: right;
                margin-left: 8px;
            }    
        }
    }
}

// .ant-table-thead > tr > th {
//     background: #ffffff
// }
.ant-pagination .ant-pagination-total-text {
    position: absolute;
    left: 0;
}

.ant-modal-confirm-btns .ant-btn:first-child{
    float: right;
    margin-left: 10px;
}

.ant-table {
    border: 1px solid #e8e8ee;
    margin-top: 16px;
    .ant-table-tbody > tr:last-child > td {
        border: none;
    }
}
.reverse-btn{
    .ant-modal-footer{
        overflow: hidden;
        .ant-btn{
            float: right;
            margin-left: 8px;
        }
        
    }
}
.ant-alert-content {
    flex: 1 1 auto;
}

// antd form超长显示省略号
.ant-form-item-label {
    text-overflow: ellipsis;
    padding-top: 5px;

    & > label {
        display: inline;
    }
}
