PROGRESS BAR STYLE

75%
                            
<section class="shortcodes g-sec">
    <div class="container">
        <div class="row">
            <div class="col-12">
                <div class="shortcode-block">
                    <div class="progress-1">
                        <div class="progress">
                            <div  class="progress-bar" role="progressbar"  aria-valuenow="75" aria-valuemin="0" aria-valuemax="100" style="width: 75%;">
                                <div  class="popOver">75%</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
45%
                            
<section class="shortcodes g-sec">
    <div class="container">
        <div class="row">
            <div class="col-12">
                <div class="shortcode-block">
                    <div class="progress-2">
                        <div class="progress">
                            <div class="progress-bar" role="progressbar" aria-valuenow="45" aria-valuemin="0" aria-valuemax="100" style="width: 45%;">
                            </div>
                            <div class="popOver">45%</div>
                        </div>
                    </div>                         
                </div>
            </div>
        </div>
    </div>
</section>
89%
                            
<section class="shortcodes g-sec">
    <div class="container">
        <div class="row">
            <div class="col-12">
                <div class="shortcode-block">
                    <div class="progress-3">
                        <div class="progress">
                            <div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" style="width: 89%" aria-valuenow="89" aria-valuemin="0" aria-valuemax="100">
                                <div class="popOver">89%</div>
                            </div>
                        </div>
                    </div>               
                </div>
            </div>
        </div>
    </div>
</section>
50%
                        
<section class="shortcodes g-sec">
    <div class="container">
        <div class="row">
            <div class="col-12">
                <div class="shortcode-block">
                    <div class="progress-3">
                        <div class="progress">
                            <div class="progress-bar progress-bar-striped" role="progressbar" style="width: 50%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100">
                                <div class="popOver">50%</div>
                            </div>
                        </div>
                    </div>               
                </div>
            </div>
        </div>
    </div>
</section>