title: Progress bar with custom background multiple color css/jquery
body: <p>my target is realize a progress bar with custom background.
  the final result should be look at this: </p>
  
  <p><a href="https://i.stack.imgur.com/uge5w.png" rel="noreferrer"><img src="https://i.stack.imgur.com/uge5w.png" alt="enter image description here"></a></p>
  
  <p>the background it's (in order) green, yellow and red.
  The lightblue color it's over the background...the progress line.</p>
  
  <p>There are some tutorial for make this?
  I've already realize some progress bar, but nothing with custom background that i would.
  Thanks.</p>