.summary {
  color: #fff;
  width: 100%;
  margin-top: 15px;
  height: 180px;
  padding-top: 20px;
}

.status-chart {
  width: 40%;
  float: left;
  height: 180px;
  margin-left: 25px;
}

.status-detail {
  float: left;
  margin-left: 80px;
  width: 40%;
}

.status-panel {
  width: 100px;
  height: 100px;
  text-align: center;
  float: left;
}
.status-badge {
  width: 8px;
  height: 8px;
  /* border-radius: 50%; */
  background-color: green;
  display: inline-block;
}

.marginTop{
    margin-top: 40%;
}

.status-title {
  text-align: center;
  float: left;
  margin-left: 15px;
  margin-top: 16%;
}

.mac-count {
  font-size: 19px;
  font-weight: bold;
}

.status-name {
  font-size: 14px;
  color: rgba(255, 255, 255, .8);
  margin-top: -4px;
}

.fac-content{
    padding-left: 5px;
    margin-top: 40px;
}

.factory-item{
    float: left;
    width: 31%;
    margin-left: 10px;
    background-color:rgba(14, 37, 171, 0.5);
    /* height: 300px; */
    color: #fff;
}

.fac-title{
    width: 100%;
    text-align: center;
    
}

.fac-title h5{
    font-weight: bold;
}

.fac-content .count-table{
    padding: 10px 15px;
    
}
.fac-content .count-table table{
    width: 100%;
}

.count-table tr{
    height: 30px;
    line-height: 30px;
}

.count-table tr td{
    text-align: center;
}

.count-table .status{
    width: 15%;
    color: rgba(255, 255, 255, 0.8);
}

.count-table .rate{
    width: 50%;
    text-align: left;
    color: rgba(255, 255, 255, 0.6);
}

.count-table .count{
    width: 30%;
}

.pie-chart-container{
  float: left;
  width: 24%;
  margin-left: 5px;
  height: 25px;
}

.chartHeader{
  text-align: center;
  padding-top: 5px;
  font-size: 14px;
  font-weight: 700;
}