Reviews

<div class="dropdown">
                                                            <span class="font-12"><i class="fas fa-star text-warning"></i><i class="fas fa-star text-warning"></i><i class="fas fa-star text-warning"></i><i class="fas fa-star text-warning"></i><i class="far fa-star text-warning"></i></span>
                                                            <a class="text-dark" href="#" id="dropdownMenuLink" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                                                <span class="align-middle"><i class="fe fe-chevron-down"></i></span>
                                                            </a>
                                                            <!-- dropdown menu -->
                                                            <div class="dropdown-menu dropdown-menu-lg p-3" aria-labelledby="dropdownMenuLink">

                                                                <span class="font-14"><i class="fas fa-star text-warning"></i><i class="fas fa-star text-warning"></i><i class="fas fa-star text-warning"></i><i class="fas fa-star text-warning"></i><i class="far fa-star text-warning"></i></span>
                                                                <span class="h5 ms-2">4.6 out of 5</span>
                                                                <p class="font-14">2,693 customer ratings</p>
                                                                <!-- row -->
                                                                <div class="row align-items-center mb-1 ">
                                                                    <div class="col-md-2 col-2 pe-0">
                                                                        <div class="font-12 text-dark">5 Star</div>
                                                                    </div>
                                                                    <div class="col-md-8 col-8 pe-2">
                                                                        <div class="progress" style="height: 8px;">
                                                                            <div class="progress-bar
                                                                                    bg-warning" role="progressbar" style="width: 78%" aria-valuenow="78" aria-valuemin="0" aria-valuemax="100"></div>
                                                                        </div>
                                                                    </div>
                                                                    <div class="col-md-2 col-2">
                                                                        <div class="font-12 text-dark">78%</div>
                                                                    </div>
                                                                </div>
                                                                <div class="row align-items-center mb-1">
                                                                    <div class="col-md-2 col-2 pe-0">
                                                                        <div class="font-12 text-dark">4 Star</div>
                                                                    </div>
                                                                    <div class="col-md-8 col-8 pe-2">
                                                                        <div class="progress" style="height: 8px;">
                                                                            <div class="progress-bar
                                                                                    bg-warning" role="progressbar" style="width:12%" aria-valuenow="12" aria-valuemin="0" aria-valuemax="100"></div>
                                                                        </div>
                                                                    </div>
                                                                    <div class="col-md-2 col-2">
                                                                        <div class="font-12 text-dark">12%</div>
                                                                    </div>
                                                                </div>
                                                                <div class="row align-items-center mb-1">
                                                                    <div class="col-md-2 col-2 pe-0">
                                                                        <div class="font-12 text-dark">3 Star</div>
                                                                    </div>
                                                                    <div class="col-md-8 col-8 pe-2">
                                                                        <div class="progress" style="height: 8px;">
                                                                            <div class="progress-bar
                                                                                    bg-warning" role="progressbar" style="width:5%" aria-valuenow="5" aria-valuemin="0" aria-valuemax="100"></div>
                                                                        </div>
                                                                    </div>
                                                                    <div class="col-md-2 col-2">
                                                                        <div class="font-12 text-dark">5%</div>
                                                                    </div>
                                                                </div>
                                                                <div class="row align-items-center mb-1">
                                                                    <div class="col-md-2 col-2 pe-0">
                                                                        <div class="font-12 text-dark">2 Star</div>
                                                                    </div>
                                                                    <div class="col-md-8 col-8 pe-2">
                                                                        <div class="progress" style="height: 8px;">
                                                                            <div class="progress-bar
                                                                                    bg-warning" role="progressbar" style="width:2%" aria-valuenow="2" aria-valuemin="0" aria-valuemax="100"></div>
                                                                        </div>
                                                                    </div>
                                                                    <div class="col-md-2 col-2">
                                                                        <div class="font-12 text-dark">2%</div>
                                                                    </div>
                                                                </div>
                                                                <div class="row align-items-center mb-2">
                                                                    <div class="col-md-2 col-2 pe-0">
                                                                        <div class="font-12 text-dark">1 Star</div>
                                                                    </div>
                                                                    <div class="col-md-8 col-8 pe-2">
                                                                        <div class="progress" style="height: 8px;">
                                                                            <div class="progress-bar
                                                                                    bg-warning" role="progressbar" style="width:1%" aria-valuenow="1" aria-valuemin="0" aria-valuemax="100"></div>
                                                                        </div>
                                                                    </div>
                                                                    <div class="col-md-2 col-2">
                                                                        <div class="font-12 text-dark">1%</div>
                                                                    </div>
                                                                </div>
                                                                <a href="#">See all customer reviews</a>

                                                            </div>
                                                        </div>

<div class="row py-8">
                                                            <!-- customer reviews -->
                                                            <div class="col-lg-4 col-md-12 col-12 mb-4 mb-lg-0 pe-lg-6">
                                                               <div class="mb-8">
                                                                  <h4 class="mb-3">Customer reviews</h4>
                                                                  <span class="font-14"><i class="fas fa-star text-warning"></i><i class="fas fa-star text-warning"></i><i class="fas fa-star text-warning"></i><i class="fas fa-star text-warning"></i><i class="far fa-star text-warning"></i></span>
                                                                  <span class="h5 ms-2">4.6 out of 5</span>
                                                                  <p class="font-14">2,693 customer ratings</p>
                                                                  <div class="row align-items-center mb-1 ">
                                                                     <div class="col-md-2 col-2 pe-0">
                                                                        <div class="font-12 text-dark">5 Star</div>
                                                                     </div>
                                                                     <div class="col-md-8 col-8 pe-2">
                                                                        <div class="progress" style="height: 8px;">
                                                                           <div class="progress-bar
                                                                              bg-warning" role="progressbar" style="width: 78%" aria-valuenow="78" aria-valuemin="0" aria-valuemax="100"></div>
                                                                        </div>
                                                                     </div>
                                                                     <div class="col-md-2 col-2">
                                                                        <div class="font-12 text-primary">78%</div>
                                                                     </div>
                                                                  </div>
                                                                  <div class="row align-items-center mb-1">
                                                                     <div class="col-md-2 col-2 pe-0">
                                                                        <div class="font-12 text-dark">4 Star</div>
                                                                     </div>
                                                                     <div class="col-md-8 col-8 pe-2">
                                                                        <div class="progress" style="height: 8px;">
                                                                           <div class="progress-bar
                                                                              bg-warning" role="progressbar" style="width:12%" aria-valuenow="12" aria-valuemin="0" aria-valuemax="100"></div>
                                                                        </div>
                                                                     </div>
                                                                     <div class="col-md-2 col-2">
                                                                        <div class="font-12 text-primary">12%</div>
                                                                     </div>
                                                                  </div>
                                                                  <div class="row align-items-center mb-1">
                                                                     <div class="col-md-2 col-2 pe-0">
                                                                        <div class="font-12 text-dark">3 Star</div>
                                                                     </div>
                                                                     <div class="col-md-8 col-8 pe-2">
                                                                        <div class="progress" style="height: 8px;">
                                                                           <div class="progress-bar
                                                                              bg-warning" role="progressbar" style="width:5%" aria-valuenow="5" aria-valuemin="0" aria-valuemax="100"></div>
                                                                        </div>
                                                                     </div>
                                                                     <div class="col-md-2 col-2">
                                                                        <div class="font-12 text-primary">5%</div>
                                                                     </div>
                                                                  </div>
                                                                  <div class="row align-items-center mb-1">
                                                                     <div class="col-md-2 col-2 pe-0">
                                                                        <div class="font-12 text-dark">2 Star</div>
                                                                     </div>
                                                                     <div class="col-md-8 col-8 pe-2">
                                                                        <div class="progress" style="height: 8px;">
                                                                           <div class="progress-bar
                                                                              bg-warning" role="progressbar" style="width:2%" aria-valuenow="2" aria-valuemin="0" aria-valuemax="100"></div>
                                                                        </div>
                                                                     </div>
                                                                     <div class="col-md-2 col-2">
                                                                        <div class="font-12 text-primary">2%</div>
                                                                     </div>
                                                                  </div>
                                                                  <div class="row align-items-center mb-2">
                                                                     <div class="col-md-2 col-2 pe-0">
                                                                        <div class="font-12 text-dark">1 Star</div>
                                                                     </div>
                                                                     <div class="col-md-8 col-8 pe-2">
                                                                        <div class="progress" style="height: 8px;">
                                                                           <div class="progress-bar
                                                                              bg-warning" role="progressbar" style="width:1%" aria-valuenow="1" aria-valuemin="0" aria-valuemax="100"></div>
                                                                        </div>
                                                                     </div>
                                                                     <div class="col-md-2 col-2">
                                                                        <div class="font-12 text-primary">1%</div>
                                                                     </div>
                                                                  </div>
                                                               </div>
                                                               <div>
                                                                  <h4 class="mb-1 mt-5">Review this book</h4>
                                                                  <p class="font-12 ">Share your thoughts with other customers</p>
                                                                  <div class="d-grid"><a href="#" class="btn btn-primary">Write A Review</a></div>
                                                               </div>
                                                            </div>
                                                            <!-- customer reviews list -->
                                                            <div class="col-lg-8 col-md-12 col-12">
                                                               <div class="d-flex align-items-center justify-content-between mb-4">
                                                                  <div>
                                                                     <h4 class="mb-0">Ratings &amp; Reviews</h4>
                                                                  </div>
                                                                  <div>
                                                                     <select class="form-select">
                                                                        <option selected="">Sort on</option>
                                                                        <option value="Most Recent">Most Recent</option>
                                                                        <option value="Relevant">Relevant</option>
                                                                        <option value="Newest">Newest</option>
                                                                     </select>
                                                                  </div>
                                                               </div>
                                                               <!-- reviews -->
                                                               <div class="mb-4 pb-4 border-bottom">
                                                                  <div class="d-flex mb-3 align-items-center">
                                                                     <img src="../assets/images/avatar-1.png" alt="" class="rounded-circle avatar-lg">
                                                                     <div class="ms-3 lh-1">
                                                                        <h5 class="mb-1">
                                                                           Sohail Rahman
                                                                           <img src="../assets/images/verified.svg" alt="">
                                                                        </h5>
                                                                        <p class="font-12 mb-0">
                                                                           <span>Kolkata</span> <span>October 03,2020</span>
                                                                        </p>
                                                                     </div>
                                                                  </div>
                                                                  <div class="mb-2">
                                                                     <span class="font-14"><i class="fas fa-star text-warning"></i><i class="fas fa-star text-warning"></i><i class="fas fa-star text-warning"></i><i class="fas fa-star text-warning"></i><i class="far fa-star text-warning"></i></span>
                                                                     <span class="h5 ms-2">Highly recommended</span>
                                                                  </div>
                                                                  <p>
                                                                     Nice book explained in simplified method surely it will bring meaningful changes in your lifestyle which you always dream off Beat of luck coach you are great continue bringing great stuffs
                                                                  </p>
                                                                  <a href="#" class="btn btn-light btn-sm me-2">Helpful</a>
                                                                  <a href="#" class="text-inherit font-14">Report abuse</a>
                                                               </div>
                                                               <!-- reviews -->
                                                               <div class="mb-4 pb-4 border-bottom">
                                                                  <div class="d-flex mb-3 align-items-center">
                                                                     <img src="../assets/images/avatar-4.png" alt="" class="rounded-circle avatar-lg">
                                                                     <div class="ms-3 lh-1">
                                                                        <h5 class="mb-1">
                                                                           Riya Poojary
                                                                           <img src="../assets/images/verified.svg" alt="">
                                                                        </h5>
                                                                        <p class="font-14 mb-0">
                                                                           <span>Ahmedabad</span> <span>4 Month ago</span>
                                                                        </p>
                                                                     </div>
                                                                  </div>
                                                                  <div class="mb-2">
                                                                     <span class="font-14"><i class="fas fa-star text-warning"></i><i class="fas fa-star text-warning"></i><i class="fas fa-star text-warning"></i><i class="fas fa-star text-warning"></i><i class="far fa-star text-warning"></i></span>
                                                                     <span class="h5 ms-2">Beware!! This Book can change your Life :)</span>
                                                                  </div>
                                                                  <p>
                                                                     And I absolutely mean it what I said in Headline of my comment. I have been following coach.com from very long. His one article has absolutely changed my life, imagine what this book can offer to you. If you are looking to form a new habit you have to
                                                                     read this Book.
                                                                  </p>
                                                                  <a href="#" class="btn btn-light btn-sm me-2">Helpful</a>
                                                                  <a href="#" class="text-inherit font-14">Report abuse</a>
                                                               </div>
                                                               <!-- reviews -->
                                                               <div class="mb-4 pb-4 border-bottom">
                                                                  <div class="d-flex mb-3 align-items-center">
                                                                     <img src="../assets/images/avatar-7.png" alt="" class="rounded-circle avatar-lg">
                                                                     <div class="ms-3 lh-1">
                                                                        <h5 class="mb-1">
                                                                           Francoise <img src="../assets/images/verified.svg" alt="">
                                                                        </h5>
                                                                        <p class="font-12 mb-0">
                                                                           <span>United Kingdom</span> <span>4 Month ago</span>
                                                                        </p>
                                                                     </div>
                                                                  </div>
                                                                  <div class="mb-2">
                                                                     <span class="font-14"><i class="fas fa-star text-warning"></i><i class="fas fa-star text-warning"></i><i class="fas fa-star text-warning"></i><i class="fas fa-star text-warning"></i><i class="far fa-star text-warning"></i></span>
                                                                     <span class="h5 ms-2">Absolutely superb!</span>
                                                                  </div>
                                                                  <p>
                                                                     I have read so many books as part of my personal development but I always find that authors end up glorifying themselves throughout continuously going on and on about their own achievements. I urge anyone who loves the book to read his blog which has
                                                                     loads of truly awesome resources.
                                                                  </p>
                                                                  <a href="#" class="btn btn-light btn-sm me-2">Helpful</a>
                                                                  <a href="#" class="text-inherit font-14">Report abuse</a>
                                                               </div>
                                                               <a href="#" class="btn btn-primary">Read More Reviews</a>
                                                            </div>
                                                         </div>