#myProgress-1 {
  width: 30px;
  background-color: #ddd;
}

#myBar-1 {
  width: 20%;
  height: 20px;
  background-color: #fa00ed;
  text-align: left;
  line-height: 20px;
  color: white;
}
#myProgress-2 {
  width: 30px;
  background-color: #ddd;
}
#myBar-2 {
  width: 20%;
  height: 20px;
  background-color: #4CAF50;
  text-align: left;
  line-height: 20px;
  color: white;
}
#myProgress-3 {
  width: 30px;
  background-color: #ddd;
}
#myBar-3 {
  width: 20%;
  height: 20px;
  background-color: #0330fa;
  text-align: left;
  line-height: 20px;
  color: white;
}
#myProgress-4 {
  width: 30px;
  background-color: #ddd;
}
#myBar-4 {
  width: 20%;
  height: 20px;
  background-color: #02b0f5;
  text-align: left;
  line-height: 20px;
  color: white;
}
#myProgress-5 {
  width: 30px;
  background-color: #ddd;
}
#myBar-5 {
  width: 20%;
  height: 20px;
  background-color: #f14b09;
  text-align: left;
  line-height: 20px;
  color: white;
}
#myProgress-6 {
  width: 30px;
  background-color: #ddd;
}
#myBar-6 {
  width: 20%;
  height: 20px;
  background-color: #6514b1;
  text-align: left;
  line-height: 20px;
  color: white;
}
#myProgress-7 {
  width: 30px;
  background-color: #ddd;
}
#myBar-7 {
  width: 20%;
  height: 20px;
  background-color: #f1067b;
  text-align: left;
  line-height: 20px;
  color: white;
}