ul.progress {
  list-style: none;

background-color:rgba(50,255,0,0.5) ;
 
}

ul.progress li {
  display:inline-block;
 padding:3px;
  line-height: 1.1em;
 
  width: 20px;
  position: relative;  
  transition: width  0.5s;
 
}
ul.progress img{margin:-8px;width:30px}
ul.progress img.scan{width:auto}



ul.progress li.active:hover {
    
    width:30px;
    background-color:rgba(0,100,0,0.3) ;
}

ul.progress li.active:before {
 
  content:'\2714';
 position: absolute;
  top: -15px;

}
ul.progress li:before {
 
  content:'\2716';
 position: absolute;
  top: -15px;

}
ul.progress li:after{
  content:'\27A4';
   
}
ul.progress li:last-child:after {content:'\2729'}

ul.progress li.active:after{
  content:'\27A4';
  color: #33ff00;
 
  bottom: 5px;
  left:0;
}