Progress Bar Style 1
75%
<section class="progress-bars elements-page">
<div class="container">
<div class="progress-bars-block">
<div class="progress1">
<div class="progress">
<div class="progress-bar" role="progressbar" style="width: 75%;" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100">
<p class="rangevalue"><span class="rangevalue1">75</span>%</p>
</div>
</div>
</div>
</div>
</div>
</section>
Progress Bar Style 2
75%
<section class="progress-bars elements-page">
<div class="container">
<div class="progress-bars-block">
<div class="progress2">
<div class="progress">
<div class="progress-bar" role="progressbar" style="width: 75%;" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"></div>
<p class="rangevalue"><span class="rangevalue2">75</span>%</p>
</div>
</div>
</div>
</div>
</section>
Progress Bar Style 3
70%
<section class="progress-bars elements-page">
<div class="container">
<div class="progress-bars-block">
<div class="progress3">
<div class="progress">
<div class="progress-bar progress-bar-striped active" role="progressbar" style="width: 70%;" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100">
<p class="rangevalue"><span class="rangevalue3">70</span>%</p>
</div>
</div>
</div>
</div>
</div>
</section>
Progress Bar Style 4
Lorem Ipsum
72%
<section class="progress-bars elements-page">
<div class="container">
<div class="progress-bars-block">
<div class="progress4">
<p>Lorem Ipsum</p>
<div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="72" style="width: 72%;" aria-valuemin="0" aria-valuemax="100"></div>
<p class="rangevalue"><span class="rangevalue4">72</span>%</p>
</div>
</div>
</div>
</div>
</section>