<div class="container my-5 py-5 z-depth-1">

​

​

    <!--Section: Content-->

    <section class="px-md-5 mx-md-5 text-center text-lg-left dark-grey-text">

​

      <!--Grid row-->

      <div class="row mb-4">

​

        <!--Grid column-->

        <div class="col-md-8 mb-4 mb-md-0">

​

          <h3 class="h3">Why is it so great?</h3>

​

          <p class="text-muted">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Id quam sapiente molestiae

            numquam quas, voluptates omnis nulla ea odio quia similique corrupti magnam.</p>

​

        </div>

        <!--Grid column-->

​

        <!--Grid column-->

        <div class="col-md-4 mb-4 mb-md-0">

​

          <a class="btn btn-green btn-md mt-md-5" href="#" role="button">Download<i class="fa fa-download ml-1"></i></a>

​

        </div>

        <!--Grid column-->

​

      </div>

      <!--Grid row-->

​

      <!--Image-->

      <div class="view overlay z-depth-1-half">

        <img src="https://mdbootstrap.com/img/Photos/Slides/img%20(6).jpg" class="img-fluid" alt="">

        <a href="#">

          <div class="mask rgba-white-light"></div>

        </a>

      </div>

​

    </section>

    <!--Section: Content-->

​

​

  </div>