.vr-info-wrap {
    width: 1081px;
    height: 951px;
    background: #1F262D;
    background-size: 100% 100%;
    position: fixed;            
    font-size: 14px;
    color: #D5E8FF;
    left: -200vw;
    top: -200vh;
    /*zoom: 0.8; left: 100px;*/
}
.vr-info-wrap .bg {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}
.vr-info-wrap .pop-wrap-out {
    display: flex;
}
.vr-info-wrap .pop-wrap {
    width: 505px;
    height: 303px;
    background: linear-gradient(269deg, rgba(16,49,90,0.3) 0%, #18293C 100%);
    box-shadow: inset 0px 0px 40px 1px rgba(86,141,227,0.5);
    padding: 83px 0 0 24px;
    box-sizing: border-box;
}
.vr-info-wrap .pop-info {
    position: relative;
    z-index: 1;
}
.vr-info-wrap .pw1 {
    margin: 29px 0 20px 26px;
}
.vr-info-wrap .pw2 {
    margin: 29px 0 20px 20px;
}
.vr-info-wrap .pop-title {
    height: 22px;
    font-size: 16px;
    color: #D5E8FF;
    line-height: 23px;
    padding-bottom: 21px;
}
.vr-info-wrap .pop-num .highlight {
    font-size: 32px;
    color: #D5E8FF;
    padding-right: 16px;
}
.vr-info-wrap .pop-gline {
    width: 220px;
    display: flex;
    margin: 8px 0 24px;
}
.vr-info-wrap .pop-gl {
    height: 8px;
    display: flex;
}
.vr-info-wrap .color1 {
    background: #D5E8FF;
}
.vr-info-wrap .color2 {
    background: #445DDE;
}
.vr-info-wrap .color3 {
    background: #F88838;
}
.vr-info-wrap .color4 {
    background: #57C999;
}
.vr-info-wrap .pop-list {
    display: flex;
    flex-wrap: wrap;
}
.vr-info-wrap .popl-line {
    width: 50%;
    display: flex;
    align-items: center;
}
.vr-info-wrap .popl-color {
    width: 13px;
    height: 13px;
    margin-right: 9px;
}
.vr-info-wrap .popl-label {
    width: 80px;
}
.vr-info-wrap .popl-value {
    width: 50px;
}
.vr-info-wrap .pw2 .popl-value {
    margin-right: 8px;
}
.vr-info-wrap .pw2 .pop-num {
    margin-bottom: 30px;
}
.vr-info-wrap .popl-color-line {
    height: 2px;
    border-radius: 1px 1px 1px 1px;
}
.vr-info-wrap .popl-color-line.c1 {
    background: linear-gradient(90deg, #00479D 0%, #00FFF5 100%);
}
.vr-info-wrap .popl-color-line.c2 {
    background: linear-gradient(90deg, #F54B70 0%, #FFF5B6 100%);
}
.vr-info-wrap .popl-color-line.c3 {
    background: linear-gradient(90deg, #5ED0F4 0%, #F0FF00 100%);
}
.vr-info-wrap .pw3, .vr-info-wrap .pw4 {
    width: 1030px;
    background: linear-gradient(269deg, rgba(16,49,90,0.3) 0%, #18293C 100%);
    box-shadow: inset 0px 0px 40px 1px rgba(86,141,227,0.5);
    margin: 0 0 20px 26px;
}
.vr-info-wrap .pw3 {
    height: 270px;
}
.vr-info-wrap .pw3 .pop-info {
    display: flex;
    flex-wrap: wrap;
    padding-top: 10px;
    padding-left: 2px;
}
.vr-info-wrap .pw3 .device {
    display: flex;
    justify-content: space-around;
    width: 195px;
    height: 36px;
    background: #243346;
    border-radius: 5px 5px 5px 5px;
    border: 1px solid #AFC2DA;
    line-height: 36px;
    margin: 0 30px 15px 0;
    font-size: 14px;
    color: #D5E8FF;
}
.vr-info-wrap .device-status {
    display: flex;
    align-items: center;
}
.vr-info-wrap .device-status .icon {
    width: 14px;
    height: 14px;
    display: inline-block;
    border-radius: 50%;
    background: #D5E8FF;
    margin-right: 4px;
}
.vr-info-wrap .device-status-2 {
    color: #40FFAE;;
}
.vr-info-wrap .device-status-2 .icon {
    background: #40FFAE;;
}
.vr-info-wrap .device-status-3 {
    color: #FF4040;;
}
.vr-info-wrap .device-status-3 .icon {
    background: #FF4040;;
}
.vr-info-wrap .pw4 {
    height: 289px;
}
.vr-info-wrap .pw4 .pop-info {
    padding-top: 15px;
    padding-left: 10px;
}
.vr-info-wrap .alarm-table {
    width: 100%;
    border-collapse: separate;
    font-size: 14px;
    color: #D5E8FF;
    border-spacing: 0;
}
.vr-info-wrap .alarm-table td {
    padding: 1px 0;
    height: 32px;
    box-sizing: border-box;
}
.vr-info-wrap .stat-canvas {
    position: fixed;
    z-index: 1;
    left: 100px;
    width: 800px;
}