progress[value]  {
  /* Reset the default appearance */
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;

  /* Get rid of default border in Firefox. */
  border: none;
  /* Dimensions */
  width: 100px;
  height: 22px;
  /* For IE10 */
  color: blue; 
}
.levelup::-webkit-progress-bar {
  background-color:orange;
  border: 0;
  margin-top:5px;
  height: 55%;
  border-radius: 9px;
}
.levelup::-webkit-progress-value {
background-image:
	   -webkit-linear-gradient(-45deg, transparent 20%, rgba(0, 0, 0, .1) 20%, rgba(0,0, 0, .1) 20%, transparent 20%),
	   -webkit-linear-gradient(top, rgba(255, 255, 255, .25), rgba(0, 0, 0, .25)),
	   -webkit-linear-gradient(left,  #fafa6e 0%, #00ae9c 50%, #1e4c6d 100%); /* Chrome10-25,Safari5.1-6 */
  border-width: 1px;
  border-style: solid;
  border-color: gray;
  margin-top:5px;
  height: 100%;
  border-radius: 9px;
  position: relative;
  background-size: 100px;  
}
.levelup::-moz-progress-bar {
  background-image:
    -moz-linear-gradient(135deg, transparent 20%, rgba(0, 0, 0, 0.1) 20%, rgba(0, 0, 0, 0.1) 20%, transparent 20% ),
    -moz-linear-gradient( top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.25)),
    -moz-linear-gradient(left,  #fafa6e 0%, #008d8c 50%, #1e4c6d 100%);
  border-width: 1px;
  border-style: solid;
  border-color: gray;
  margin-top:5px;
  height: 55%;
  border-radius: 9px;
  position: relative;
  background-size: 100px;  
  
}
.energy::-webkit-progress-bar {
   background-color: orange;
  border: 0;
  margin-top:5px;
  height: 55%;
  border-radius: 9px;
}
.energy::-webkit-progress-value {
    background-image:
    -webkit-linear-gradient( -45deg, transparent, transparent 20%, rgba(0,0,0,.1) 20%, rgba(0,0,0,.1) 20%, transparent 20%),
    -webkit-linear-gradient( top, rgba(255, 255, 255, .25), rgba(0,0,0,.25)),
    -webkit-linear-gradient(left,  #FF0000 0%, #FFFF00 50%, #008000 100%);/* Chrome10-25,Safari5.1-6 */
  border-width: 1px;
  border-style: solid;
  border-color: gray;
  margin-top:5px;
  height: 100%;
  border-radius: 9px;
  position: relative;
  background-size: 100px;
}
.energy::-moz-progress-bar {
  background-image:
    -moz-linear-gradient(135deg, transparent 20%, rgba(0, 0, 0, 0.1) 20%, rgba(0, 0, 0, 0.1) 20%, transparent 20% ),
    -moz-linear-gradient( top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.25)),
    -moz-linear-gradient(left,  #FF0000 0%, #FFFF00 50%, #008000 100%);
  border-width: 1px;
  border-style: solid;
  border-color: gray;
  margin-top:5px;
  height: 55%;
  border-radius: 9px;
  position: relative;
  background-size: 100px;  
  
}
.health::-webkit-progress-bar {
   background-color: orange;
  border: 0;
  margin-top:5px;
  height: 55%;
  border-radius: 9px;
}
.health::-webkit-progress-value {
    background-image:
    -webkit-linear-gradient( -45deg, transparent, transparent 20%, rgba(0,0,0,.1) 20%, rgba(0,0,0,.1) 20%, transparent 20%),
    -webkit-linear-gradient( top, rgba(255, 255, 255, .25), rgba(0,0,0,.25)),
    -webkit-linear-gradient(left,  #FF0000 0%, #FFFF00 50%, #008000 100%);/* Chrome10-25,Safari5.1-6 */
  border-width: 1px;
  border-style: solid;
  border-color: gray;
  margin-top:5px;
  height: 100%;
  border-radius: 9px;
  position: relative;
  background-size: 100px;
}
.health::-moz-progress-bar {
  background-image:
    -moz-linear-gradient(135deg, transparent 20%, rgba(0, 0, 0, 0.1) 20%, rgba(0, 0, 0, 0.1) 20%, transparent 20% ),
    -moz-linear-gradient( top, rgba(255, 255, 255, 0.25), rgba(0, 0, 0, 0.25)),
    -moz-linear-gradient(left,  #FF0000 0%, #FFFF00 50%, #008000 100%);
  border-width: 1px;
  border-style: solid;
  border-color: gray;
  margin-top:5px;
  height: 55%;
  border-radius: 9px;
  position: relative;
  background-size: 100px;  
  
}
progress {
  background-image:url(/backgrounds/progressbar2.png);
  text-align: center;
  border: 0;
  height: 22px;
  width: 100px;
  border-radius: 9px;
    -webkit-appearance: none;
    -moz-appearance:none;
}
progress[value]::-webkit-progress-bar {
  background-color: #96b8f1;
  border-radius: 25px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25) inset;
}
progress[value]::-webkit-progress-value {
  border-radius: 25px;
}