.chart.red.scaleColor { color:gold !important;background:gold !important; }

.chart {
  position: relative;
  display: inline-block;
  width: 100px;
  height: 100px;
  margin-top: 20px;
  margin-bottom: 20px;
  text-align: center;
}
.chart canvas {
  position: absolute;
  top: 0;
  left: 0;
}
.percent {
  display: inline-block;
  line-height: 105px;
  z-index: 2;
  font-size:36px;
  color:#3498db;
  font-weight:400;
}

.chart.red .percent { color:#E64D5F !important; }
.chart.green .percent { color:#2ABC68 !important; }

.chart p { height:20px;width:101px;position:Absolute;bottom:-25px;font-size:12px;color:#798189;font-weight:500; }

}
.angular {
  margin-top: 100px;
}
.angular .chart {
  margin-top: 0;
}


.chart1 {
  position: relative;
  display: inline-block;
  width: 150px;
  height: 150px;
  margin-top: 20px;
  margin-bottom: 20px;
  text-align: center;
}
.chart1 canvas {
  position: absolute;
  top: 0;
  left: 0;
}
.percent1 {
  display: inline-block;
  line-height: 105px;
  z-index: 2;
  font-size:36px;
  color:#3498db;
  font-weight:400;
}

.chart1.red1 .percent1 { color:#E64D5F !important; }
.chart1.green1 .percent1 { color:#2ABC68 !important; }

.chart1 p { height:20px;width:101px;position:Absolute;bottom:-25px;font-size:12px;color:#798189;font-weight:500; }

}