<div class="container mt-5">

​

​

  <!--Section: Content-->

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

    <!-- Section heading -->

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

    <!-- Section description -->

    <p class="grey-text w-responsive mx-auto mb-5">Lorem ipsum dolor sit amet, consectetur adipisicing elit fugit, error amet numquam iure provident voluptate esse quasi nostrum quisquam eum porro a pariatur veniam.</p>

​

    <!-- Grid row -->

    <div class="row">

​

      <!-- Grid column -->

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

        <!-- Collection card -->

        <div class="card collection-card z-depth-1-half">

          <!-- Card image -->

          <div class="view zoom">

            <img src="https://mdbootstrap.com/img/Photos/Horizontal/E-commerce/Vertical/5.jpg" class="img-fluid"

              alt="">

            <div class="stripe dark">

              <a>

                <p>Trousers

                  <i class="fas fa-angle-right"></i>

                </p>

              </a>

            </div>

          </div>

          <!-- Card image -->

        </div>

        <!-- Collection card -->

      </div>

      <!-- Grid column -->

​

      <!-- Grid column -->

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

        <!-- Collection card -->

        <div class="card collection-card z-depth-1-half">

          <!-- Card image -->

          <div class="view zoom">

            <img src="https://mdbootstrap.com/img/Photos/Horizontal/E-commerce/Vertical/8.jpg" class="img-fluid"

              alt="">

            <div class="stripe light">

              <a>

                <p>Sweatshirt

                  <i class="fas fa-angle-right"></i>

                </p>

              </a>

            </div>

          </div>

          <!-- Card image -->

        </div>

        <!-- Collection card -->

      </div>

      <!-- Grid column -->

​

      <!-- Grid column -->

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

        <!-- Collection card -->

        <div class="card collection-card z-depth-1-half">

          <!-- Card image -->

          <div class="view zoom">

            <img src="https://mdbootstrap.com/img/Photos/Horizontal/E-commerce/Vertical/9.jpg" class="img-fluid"

              alt="">

            <div class="stripe dark">

              <a>

                <p>Black hat

                  <i class="fas fa-angle-right"></i>

                </p>

              </a>

            </div>

          </div>

          <!-- Card image -->

        </div>

        <!-- Collection card -->

      </div>

      <!-- Grid column -->

​

      <!-- Fourth column -->

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

        <!-- Collection card -->

        <div class="card collection-card z-depth-1-half">

          <!-- Card image -->

          <div class="view zoom">

            <img src="https://mdbootstrap.com/img/Photos/Horizontal/E-commerce/Vertical/7.jpg" class="img-fluid"

              alt="">

            <div class="stripe light">

              <a>

                <p>Sweatshirt

                  <i class="fas fa-angle-right"></i>

                </p>

              </a>

            </div>

          </div>

          <!-- Card image -->

        </div>

        <!-- Collection card -->

      </div>

      <!-- Fourth column -->

​

    </div>

    <!-- Grid row -->

​

  </section>

  <!--Section: Content-->

​

​

</div>