progress1[value] {color:red} /* IE10 */
progress1::-webkit-progress1-bar-value {background:red}
progress1::-webkit-progress1-value {background:red}
progress1::-moz-progress1-bar {background:red;}
progress1 {
   -webkit-appearance: none;
}
progress1[value]::-webkit-progress1-bar {
  background-color: #eee;
  border-radius: 5px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25) inset;
}
progress1[value]::-webkit-progress1-value {
  border-radius: 5px;
} 

.progress1-bar {
  background-color:black;
  text-align: center;
  border: 0;
  height: 22px;
  width: 100px;
  border-radius: 9px;
  position: relative;
  display: block;
}
  
.progress1-bar > span {
background: #27b700; /* Old browsers */
background: -ms-linear-gradient(left,  #ccd800 0%, #ffff28 50%, #27b700 100%); 
background:  -webkit-gradient(left,  #ccd800 0%, #ffff28 50%, #27b700 100%);
background:  -o-linear-gradient(left,  #ccd800 0%, #ffff28 50%, #27b700 100%);
background: -moz-linear-gradient(left,  #ccd800 0%, #ffff28 50%, #27b700 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  #ccd800 0%,#ffff28 50%,#27b700 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(right,  #ccd800 0%,#ffff28 50%,#27b700 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff3232', endColorstr='#27b700',GradientType=1 ); /* IE6-9 */
  border-width: 1px;
  border-style: solid;
  border-color: gray;
  margin-top:5px;
  height: 47%;
  border-radius: 9px;
  float:left;
  max-width:98px;
}