<div class="container mt-5">

​

​

  <!--Section: Content-->

  <section class="text-center dark-grey-text">

​

    <!-- Section heading -->

    <h3 class="font-weight-bold mb-4 pb-2">Testimonials</h3>

    <!-- Section description -->

    <p class="text-center w-responsive mx-auto mb-5">Lorem ipsum dolor sit amet, consectetur adipisicing elit.

      Fugit, error amet numquam iure provident voluptate esse quasi, veritatis totam voluptas nostrum quisquam

      eum porro a pariatur veniam.</p>

​

    <!-- Grid row -->

    <div class="row">

​

      <!--Grid column-->

      <div class="col-lg-4 col-md-12 mb-4">

        <!--Card-->

        <div class="card testimonial-card">

          <!--Background color-->

          <div class="card-up info-color"></div>

          <!--Avatar-->

          <div class="avatar mx-auto white">

            <img src="https://mdbootstrap.com/img/Photos/Avatars/img%20(9).jpg" class="rounded-circle img-fluid">

          </div>

          <div class="card-body">

            <!--Name-->

            <h4 class="font-weight-bold mb-4">John Doe</h4>

            <hr>

            <!--Quotation-->

            <p class="dark-grey-text mt-4"><i class="fas fa-quote-left pr-2"></i>Lorem ipsum dolor sit amet eos

              adipisci, consectetur adipisicing elit.</p>

          </div>

        </div>

        <!--Card-->

      </div>

      <!--Grid column-->

​

      <!--Grid column-->

      <div class="col-lg-4 col-md-6 mb-4">

        <!--Card-->

        <div class="card testimonial-card">

          <!--Background color-->

          <div class="card-up blue-gradient">

          </div>

          <!--Avatar-->

          <div class="avatar mx-auto white">

            <img src="https://mdbootstrap.com/img/Photos/Avatars/img%20(20).jpg" class="rounded-circle img-fluid">

          </div>

          <div class="card-body">

            <!--Name-->

            <h4 class="font-weight-bold mb-4">Anna Aston</h4>

            <hr>

            <!--Quotation-->

            <p class="dark-grey-text mt-4"><i class="fas fa-quote-left pr-2"></i>Neque cupiditate assumenda in

              maiores repudiandae mollitia architecto.</p>

          </div>

        </div>

        <!--Card-->

      </div>

      <!--Grid column-->

​

      <!--Grid column-->

      <div class="col-lg-4 col-md-6 mb-4">

        <!--Card-->

        <div class="card testimonial-card">

          <!--Background color-->

          <div class="card-up indigo"></div>

          <!--Avatar-->

          <div class="avatar mx-auto white">

            <img src="https://mdbootstrap.com/img/Photos/Avatars/img%20(10).jpg" class="rounded-circle img-fluid">

          </div>

          <div class="card-body">

            <!--Name-->

            <h4 class="font-weight-bold mb-4">Maria Kate</h4>

            <hr>

            <!--Quotation-->

            <p class="dark-grey-text mt-4"><i class="fas fa-quote-left pr-2"></i>Delectus impedit saepe officiis

              ab aliquam repellat rem unde ducimus.</p>

          </div>

        </div>

        <!--Card-->

      </div>

      <!--Grid column-->

​

    </div>

    <!-- Grid row -->

​

  </section>

  <!--Section: Content-->

​

​

</div>