Progress Bars
Style 1
Business Strategy
                                            18%
                                        Finance Consultancy
                                            30%
                                        Investment Plan 
                                            50%
                                        Investment Banking
                                            80%
                                        Business Strategy
                                            18%
                                        Finance Consultancy
                                            30%
                                        Investment Plan 
                                            50%
                                        Investment Banking
                                            80%
                                        
<div class="row">
    <div class="col-md-6 mb-1-9 mb-md-0">
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Business Strategy</div>
                <div class="col-6 text-end">18%</div>
            </div>
        </div>
        <div class="custom-progress progress">
            <div class="animated custom-bar progress-bar slideInLeft" style="width:18%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="10" role="progressbar"></div>
        </div>
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Finance Consultancy</div>
                <div class="col-6 text-end">30%</div>
            </div>
        </div>
        <div class="custom-progress progress">
            <div class="animated custom-bar progress-bar slideInLeft" style="width:30%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="70" role="progressbar"></div>
        </div>
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Investment Plan </div>
                <div class="col-6 text-end">50%</div>
            </div>
        </div>
        <div class="custom-progress progress">
            <div class="animated custom-bar progress-bar slideInLeft" style="width:50%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="70" role="progressbar"></div>
        </div>
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Investment Banking</div>
                <div class="col-6 text-end">80%</div>
            </div>
        </div>
        <div class="custom-progress progress">
            <div class="animated custom-bar progress-bar slideInLeft" style="width:80%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="70" role="progressbar"></div>
        </div>
    </div>
    <div class="col-md-6">
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Business Strategy</div>
                <div class="col-6 text-end">18%</div>
            </div>
        </div>
        <div class="custom-progress progress">
            <div class="animated custom-bar progress-bar custom-bar-dark" style="width:18%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="10" role="progressbar"></div>
        </div>
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Finance Consultancy</div>
                <div class="col-6 text-end">30%</div>
            </div>
        </div>
        <div class="custom-progress progress">
            <div class="animated custom-bar progress-bar custom-bar-dark" style="width:30%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="70" role="progressbar"></div>
        </div>
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Investment Plan </div>
                <div class="col-6 text-end">50%</div>
            </div>
        </div>
        <div class="custom-progress progress">
            <div class="animated custom-bar progress-bar custom-bar-dark" style="width:50%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="70" role="progressbar"></div>
        </div>
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Investment Banking</div>
                <div class="col-6 text-end">80%</div>
            </div>
        </div>
        <div class="custom-progress progress">
            <div class="animated custom-bar progress-bar custom-bar-dark" style="width:80%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="70" role="progressbar"></div>
        </div>
    </div>
</div>
                    
                            Style 2
Business Strategy
                                            18%
                                        Finance Consultancy
                                            30%
                                        Investment Plan 
                                            50%
                                        Investment Banking
                                            80%
                                        Business Strategy
                                            18%
                                        Finance Consultancy
                                            30%
                                        Investment Plan 
                                            50%
                                        Investment Banking
                                            80%
                                        
<div class="row">
    <div class="col-md-6 mb-1-9 mb-md-0">
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Business Strategy</div>
                <div class="col-6 text-end">18%</div>
            </div>
        </div>
        <div class="custom-progress progress progress-medium">
            <div class="animated custom-bar progress-bar slideInLeft" style="width:18%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="10" role="progressbar"></div>
        </div>
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Finance Consultancy</div>
                <div class="col-6 text-end">30%</div>
            </div>
        </div>
        <div class="custom-progress progress progress-medium">
            <div class="animated custom-bar progress-bar slideInLeft" style="width:30%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="70" role="progressbar"></div>
        </div>
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Investment Plan </div>
                <div class="col-6 text-end">50%</div>
            </div>
        </div>
        <div class="custom-progress progress progress-medium">
            <div class="animated custom-bar progress-bar slideInLeft" style="width:50%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="70" role="progressbar"></div>
        </div>
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Investment Banking</div>
                <div class="col-6 text-end">80%</div>
            </div>
        </div>
        <div class="custom-progress progress progress-medium">
            <div class="animated custom-bar progress-bar slideInLeft" style="width:80%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="70" role="progressbar"></div>
        </div>
    </div>
    <div class="col-md-6">
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Business Strategy</div>
                <div class="col-6 text-end">18%</div>
            </div>
        </div>
        <div class="custom-progress progress progress-medium">
            <div class="animated custom-bar progress-bar custom-bar-dark" style="width:18%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="10" role="progressbar"></div>
        </div>
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Finance Consultancy</div>
                <div class="col-6 text-end">30%</div>
            </div>
        </div>
        <div class="custom-progress progress progress-medium">
            <div class="animated custom-bar progress-bar custom-bar-dark" style="width:30%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="70" role="progressbar"></div>
        </div>
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Investment Plan </div>
                <div class="col-6 text-end">50%</div>
            </div>
        </div>
        <div class="custom-progress progress progress-medium">
            <div class="animated custom-bar progress-bar custom-bar-dark" style="width:50%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="70" role="progressbar"></div>
        </div>
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Investment Banking</div>
                <div class="col-6 text-end">80%</div>
            </div>
        </div>
        <div class="custom-progress progress progress-medium">
            <div class="animated custom-bar progress-bar custom-bar-dark" style="width:80%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="70" role="progressbar"></div>
        </div>
    </div>
</div>
                    
                            Style 3
Business Strategy
                                            18%
                                        Finance Consultancy
                                            30%
                                        Investment Plan 
                                            50%
                                        Investment Banking
                                            80%
                                        Market Research
                                            10%
                                        Finance Consultancy
                                            30%
                                        Investment Plan 
                                            50%
                                        Investment Banking
                                            80%
                                        
<div class="row">
    <div class="col-md-6 mb-1-9 mb-md-0">
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Business Strategy</div>
                <div class="col-6 text-end">18%</div>
            </div>
        </div>
        <div class="custom-progress progress progress-bold">
            <div class="animated custom-bar progress-bar slideInLeft" style="width:18%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="10" role="progressbar"></div>
        </div>
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Finance Consultancy</div>
                <div class="col-6 text-end">30%</div>
            </div>
        </div>
        <div class="custom-progress progress progress-bold">
            <div class="animated custom-bar progress-bar slideInLeft" style="width:30%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="70" role="progressbar"></div>
        </div>
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Investment Plan </div>
                <div class="col-6 text-end">50%</div>
            </div>
        </div>
        <div class="custom-progress progress progress-bold">
            <div class="animated custom-bar progress-bar slideInLeft" style="width:50%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="70" role="progressbar"></div>
        </div>
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Investment Banking</div>
                <div class="col-6 text-end">80%</div>
            </div>
        </div>
        <div class="custom-progress progress progress-bold">
            <div class="animated custom-bar progress-bar slideInLeft" style="width:80%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="70" role="progressbar"></div>
        </div>
    </div>
    <div class="col-md-6">
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Market Research</div>
                <div class="col-6 text-end">10%</div>
            </div>
        </div>
        <div class="custom-progress progress progress-bold">
            <div class="animated custom-bar progress-bar custom-bar-dark" style="width:10%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="10" role="progressbar"></div>
        </div>
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Finance Consultancy</div>
                <div class="col-6 text-end">30%</div>
            </div>
        </div>
        <div class="custom-progress progress progress-bold">
            <div class="animated custom-bar progress-bar custom-bar-dark" style="width:30%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="70" role="progressbar"></div>
        </div>
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Investment Plan </div>
                <div class="col-6 text-end">50%</div>
            </div>
        </div>
        <div class="custom-progress progress progress-bold">
            <div class="animated custom-bar progress-bar custom-bar-dark" style="width:50%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="70" role="progressbar"></div>
        </div>
        <div class="progress-text">
            <div class="row">
                <div class="col-6">Investment Banking</div>
                <div class="col-6 text-end">80%</div>
            </div>
        </div>
        <div class="custom-progress progress progress-bold">
            <div class="animated custom-bar progress-bar custom-bar-dark" style="width:80%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="70" role="progressbar"></div>
        </div>
    </div>
</div>