<div class="container my-5">

​

​

  <!--Section: Content-->

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

​

    <!-- Section heading -->

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

    <!-- Section description -->

    <p class="text-muted 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 text-center text-md-left">

​

      <!-- Grid column -->

      <div class="col-lg-6 col-md-12 mb-5 d-md-flex justify-content-between">

        <div class="avatar mb-md-0 mb-4 mx-4">

          <img src="https://mdbootstrap.com/img/Photos/Avatars/img%20(32).jpg" class="rounded z-depth-1" alt="Sample avatar">

        </div>

        <div class="mx-4">

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

          <h6 class="font-weight-bold grey-text mb-3">Web Designer</h6>

          <p class="grey-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quod eos id officiis hic

            tenetur.</p>

          <!-- Facebook-->

          <a class="p-2 fa-lg fb-ic">

            <i class="fab fa-facebook-f"> </i>

          </a>

          <!-- Twitter -->

          <a class="p-2 fa-lg tw-ic">

            <i class="fab fa-twitter"> </i>

          </a>

          <!--Dribbble -->

          <a class="p-2 fa-lg dribbble-ic">

            <i class="fab fa-dribbble"> </i>

          </a>

        </div>

      </div>

      <!-- Grid column -->

​

      <!-- Grid column -->

      <div class="col-lg-6 col-md-12 mb-5 d-md-flex justify-content-between">

        <div class="avatar mb-md-0 mb-4 mx-4">

          <img src="https://mdbootstrap.com/img/Photos/Avatars/img%20(20).jpg" class="rounded z-depth-1" alt="Sample avatar">

        </div>

        <div class="mx-4">

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

          <h6 class="font-weight-bold grey-text mb-3">Photographer</h6>

          <p class="grey-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quod eos id officiis hic

            tenetur.</p>

          <!-- Facebook-->

          <a class="p-2 fa-lg fb-ic">

            <i class="fab fa-facebook-f"> </i>

          </a>

          <!--YouTube -->

          <a class="p-2 fa-lg yt-ic">

            <i class="fab fa-youtube"> </i>

          </a>

          <!--Instagram-->

          <a class="p-2 fa-lg ins-ic">

            <i class="fab fa-instagram"> </i>

          </a>

        </div>

      </div>

      <!-- Grid column -->

​

    </div>

    <!-- Grid row-->

​

    <!-- Grid row-->

    <div class="row text-center text-md-left">

​

      <!-- Grid column -->

      <div class="col-lg-6 col-md-12 mb-5 d-md-flex justify-content-between">

        <div class="avatar mb-md-0 mb-4 mx-4">

          <img src="https://mdbootstrap.com/img/Photos/Avatars/img%20(26).jpg" class="rounded z-depth-1" alt="Sample avatar">

        </div>

        <div class="mx-4">

          <h4 class="font-weight-bold mb-3">Anna Deynah</h4>

          <h6 class="font-weight-bold grey-text mb-3">Web Developer</h6>

          <p class="grey-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quod eos id officiis hic

            tenetur.</p>

          <!-- Facebook-->

          <a class="p-2 fa-lg fb-ic">

            <i class="fab fa-facebook-f"> </i>

          </a>

          <!-- Twitter -->

          <a class="p-2 fa-lg tw-ic">

            <i class="fab fa-twitter"> </i>

          </a>

          <!-- GitHub-->

          <a class="p-2 fa-lg git-ic">

            <i class="fab fa-github"> </i>

          </a>

        </div>

      </div>

      <!-- Grid column -->

​

      <!-- Grid column -->

      <div class="col-lg-6 col-md-12 mb-5 d-md-flex justify-content-between">

        <div class="avatar mb-md-0 mb-4 mx-4">

          <img src="https://mdbootstrap.com/img/Photos/Avatars/img%20(29).jpg" class="rounded z-depth-1 img-fluid"

            alt="Sample avatar">

        </div>

        <div class="mx-4">

          <h4 class="font-weight-bold mb-3">Sarah Melyah</h4>

          <h6 class="font-weight-bold grey-text mb-3">Front-end Developer</h6>

          <p class="grey-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quod eos id officiis hic

            tenetur.</p>

          <!-- Google +-->

          <a class="p-2 fa-lg gplus-ic">

            <i class="fab fa-google-plus-g"> </i>

          </a>

          <!--LinkedIn -->

          <a class="p-2 fa-lg li-ic">

            <i class="fab fa-linkedin-in"> </i>

          </a>

          <!--Email-->

          <a class="p-2 fa-lg email-ic">

            <i class="fas fa-envelope"> </i>

          </a>

        </div>

      </div>

      <!-- Grid column -->

​

    </div>

    <!-- Grid row-->

​

  </section>

  <!--Section: Content-->

​

​

</div>