​

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

​

​

    <!--Section: Content-->

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

​

      <!--Grid row-->

      <div class="row">

​

        <!--Grid column-->

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

​

          <h3 class="font-weight-bold">Material Design Blocks</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, doloremque laborum.</p>

​

          <a class="btn btn-purple btn-md ml-0" href="#" role="button">Start now<i class="fa fa-gem ml-2"></i></a>

​

          <hr class="my-5">

​

          <p class="font-weight-bold">Follow us on:</p>

​

          <!--Facebook-->

          <a href="#" class="mx-1" role="button"><i class="fab fa-facebook-f"></i></a>

          <a href="#" class="mx-1" role="button"><i class="fab fa-twitter"></i></a>

          <a href="#" class="mx-1" role="button"><i class="fab fa-linkedin-in"></i></a>

          <a href="#" class="mx-1" role="button"><i class="fab fa-instagram"></i></a>

          <a href="#" class="mx-1" role="button"><i class="fab fa-pinterest"></i></a>

          <a href="#" class="mx-1" role="button"><i class="fab fa-youtube"></i></a>

          <a href="#" class="mx-1" role="button"><i class="fab fa-github"></i></a>

          <a href="#" class="mx-1" role="button"><i class="fab fa-stack-overflow"></i></a>

​

        </div>

        <!--Grid column-->

​

        <!--Grid column-->

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

​

          <img src="https://mdbootstrap.com/img/Others/screens1.png" class="img-fluid" alt="">

​

        </div>

        <!--Grid column-->

​

      </div>

      <!--Grid row-->

​

​

    </section>

    <!--Section: Content-->

​

​

  </div>

​

​