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

​

  <!-- Section -->

  <section>

    <h3 class="font-weight-bold text-center dark-grey-text pb-2">A Few Easy Steps</h3>

    <hr class="w-header my-4">

    <p class="lead text-center text-muted pt-2 pb-3 mb-5">We are so proud of our product. It's really easy to create a landing page for your product.</p>

​

    <div class="row dark-grey-text">

​

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

        <div class="media">

          <div class="mr-4">

            <span class="text-primary"><i class="icon-fa fas fa-file-alt fa-2x"></i></span>

          </div>

          <div class="media-body">

            <h6 class="font-weight-bold">Step One</h6>

            <p class="text-muted">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium eaque ipsa doloremque laudantium.</p>

          </div>

        </div>

      </div>

​

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

        <div class="media">

          <div class="mr-4">

            <span class="text-danger"><i class="icon-fa fas fa-bullhorn fa-2x"></i></span>

          </div>

          <div class="media-body">

            <h6 class="font-weight-bold">Step Two</h6>

            <p class="text-muted">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium eaque ipsa doloremque laudantium.</p>

          </div>

        </div>

      </div>

​

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

        <div class="media">

          <div class="mr-4">

            <span class="text-info"><i class="icon-fa fas fa-code fa-2x"></i></span>

          </div>

          <div class="media-body">

            <h6 class="font-weight-bold">Step Three</h6>

            <p class="text-muted">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium eaque ipsa doloremque laudantium.</p>

          </div>

        </div>

      </div>

​

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

        <div class="media">

          <div class="mr-4">

            <span class="text-warning"><i class="icon-fa fas fa-comments fa-2x"></i></span>

          </div>

          <div class="media-body">

            <h6 class="font-weight-bold">Step Four</h6>

            <p class="text-muted">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium eaque ipsa doloremque laudantium.</p>

          </div>

        </div>

      </div>

​

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

        <div class="media">

          <div class="mr-4">

            <span class="text-muted"><i class="icon-fa fas fa-cogs fa-2x"></i></span>

          </div>

          <div class="media-body">

            <h6 class="font-weight-bold">Step Five</h6>

            <p class="text-muted">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium eaque ipsa doloremque laudantium.</p>

          </div>

        </div>

      </div>

​

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

        <div class="media">

          <div class="mr-4">

            <span class="text-success"><i class="icon-fa far fa-handshake fa-2x"></i></span>

          </div>

          <div class="media-body">

            <h6 class="font-weight-bold">Step Six</h6>

            <p class="text-muted">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium eaque ipsa doloremque laudantium.</p>

          </div>

        </div>

      </div>

​

    </div>

​

  </section>

  <!-- Section -->

</div>