.screen-saver-view {
  // padding: 12% 15%;
  // margin: 10% 15%;
  align-items: center;
  height: 100%;
  padding-top: 12%;
  padding-right: 15%;
  padding-left: calc((100% - 1360px) / 2);
  background: transparent;//#747879;

  .amos-cardpane-head {
    padding-top: 10px;
    padding-left: 25px;

    .amos-cardpane-head-title {
      .fasicon {
        font-size: 25px;
        color: white !important;
      }
    }
  }

  .amos-cardpane-body {
    padding: 6px;
    font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
    font-size: 28px;
    font-style: normal;
    font-weight: 700;
    line-height: 40px;
    color: white;
    text-align: center;
    border: 0;
  }


  .amos-cardpane-footer {
    padding-left: 25px;
    font-family: '微软雅黑';
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    color: white;
    border: 0;
  }

  .amos-cardpane-bordered {
    border: 0;
  }

  .amos-cardpane {
    border-radius: 0;
  }

  .amos-row {
    display: flex;
    margin-left: 0 !important;

    .col {
      flex: 1;
      height: 457px;
      max-width: 340px;
      min-width: 340px;
      min-height: 457px;
      padding-right: 20px !important;
      padding-left: 20px !important;

      .row-1 {
        display: inherit;
        height: 300px;
      }

      .row-2 {
        top: 17px;
        display: inherit;

        .col-2-2 {
          padding-left: 10px;
        }
      }

      .screen-saver-view-rpn {
        height: 100%;
        max-width: 300px;
        min-width: 300px;
        font-size: 15px;
        color: white;
        background: #1c43f2;

        .guard-days {
          padding-top: 20px;
          font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
          font-size: 40px;
          font-style: normal;
          font-weight: 700;
          line-height: 40px;
          color: #0c0;
        }

        .guard-text {
          width: 75px;
          margin-top: 30px;
          margin-left: 40px;
          font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
          font-size: 15px;
          font-style: normal;
          font-weight: 700;
          line-height: 13px;
          color: #0c0;
          text-align: center;
        }

        .amos-cardpane-body {
          height: 200px;
          text-align: center;

          .screen-saver-guard {
            width: 160px;
            height: 156px;
            margin-top: 15%;
            margin-left: 22%;
            background: url('../../assets/fas/img/screensaver-guard.png') no-repeat;
            background-position: center center;
            border-radius: 5px;
          }

          .screen-saver-rpn {
            width: 160px;
            height: 156px;
            margin-top: 15%;
            margin-left: 22%;
            background: url('../../assets/fas/img/screensaver-guard.png') no-repeat;
            background-position: center center;
            border-radius: 5px;

            .guard-text {
              margin-top: 50px;
              line-height: 25px;

              .nochange {
                font-family: monospace;
                color: #1e1efc;

                .hr-bar {
                  width: 8px;
                  background: #1e1efc;
                  border-color: #1e1efc;
                  float: right;
                  height: 1px;
                  text-align: center;
                  vertical-align: middle;
                  margin-top: 10px;
                }
              }

              .up {
                font-family: monospace;
                color: red;
              }

              .down {
                font-family: monospace;
                color: #0c0;
              }
            }
          }
        }
      }

      .screen-saver-view-equipment {
        height: 100%;
        max-width: 300px;
        min-width: 300px;
        color: white;
        background: #a726fd;

        .amos-cardpane-body {
          height: 200px;
          font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
          font-size: 72px;
          font-style: normal;
          font-weight: 700;
          line-height: 200px;
          color: white;
          text-align: center;
        }
      }

      .screen-saver-view-detector {
        height: 100%;
        max-width: 140px;
        max-height: 140px;
        min-width: 140px;
        min-height: 140px;
        color: white;
        background: #0abdd4;
      }

      .screen-saver-view-monitor {
        height: 100%;
        max-width: 140px;
        max-height: 140px;
        min-width: 140px;
        min-height: 140px;
        color: white;
        background: #ffb518;
      }

      .screen-saver-view-riskpoint {
        height: 100%;
        max-width: 300px;
        min-width: 300px;
        color: white;
        background: #4ab60b;

        .amos-cardpane-body {
          height: 80.5%;

          .amos-echarts-container {
            top: -40px;
            min-height: 240px;
          }
        }
      }

      .screen-saver-view-patrolpoint {
        height: 100%;
        max-width: 300px;
        min-width: 300px;
        color: white;
        background: #534bff;

        .amos-cardpane-body {
          height: 80.5%;

          .amos-echarts-container {
            top: -40px;
            min-height: 240px;
          }
        }
      }

      .risk-point-pie1 {
        // position: absolute;
      }

      .pie-legend {
        margin-top: -40px;

        .pie-legend-item {
          width: 100%;
          padding: 2% 25%;

          .pie-legend-item-icon {
            display: table-cell;
          }

          .pie-legend-item-text {
            display: table-cell;
            padding-left: 10px;
            font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
            font-size: 16px;
            font-style: normal;
            font-weight: 700;
            line-height: 16px;
          }
        }
      }
    }
  }
}

.screen-saver-view-modal {
  z-index: 10000;

  .amos-modal-container {
    top: 0 !important;
    height: 100%;
    background: #000000b8;

    .amos-modal-content {
      overflow: unset;
    }
  }
}
