Comments

<div class="container">
  <div class="mb-11">
    <div class="mb-4">
      <h3>3 Comments</h3>
    </div>

    <ul class="list-unstyled">
      <!-- Comment -->
      <li class="mb-5">
        <div class="media align-items-center mb-2">
          <div class="avatar avatar-circle mr-3">
            <img class="avatar-img" src="../assets/img/100x100/img3.jpg" alt="Image Description">
          </div>
          <div class="media-body">
            <div class="d-flex justify-content-between align-items-center">
              <span class="h5 mb-0">Dave Austin</span>
              <small class="text-muted">1 day ago</small>
            </div>
          </div>
        </div>

        <p>As a Special Education teacher this resonates so well with me. Fighting with gen ed teachers to flatten for the students with learning disabilities. It also confirms some things for me in my writing.</p>

        <a class="font-weight-bold" href="#">Reply</a>

        <ul class="list-unstyled mt-5">
          <!-- Comment -->
          <li class="mb-5">
            <div class="border-left border-3 pl-4">
              <div class="media align-items-center mb-2">
                <div class="avatar avatar-circle mr-3">
                  <img class="avatar-img" src="../assets/img/100x100/img11.jpg" alt="Image Description">
                </div>
                <div class="media-body">
                  <div class="d-flex justify-content-between align-items-center">
                    <span class="h5 mb-0">Hanna Wolfe</span>
                    <small class="text-muted">1 day ago</small>
                  </div>
                </div>
              </div>

              <p>Love it Dave! We're all about keeping it up.</p>

              <a class="font-weight-bold" href="#">Reply</a>
            </div>
          </li>
          <!-- End Comment -->
        </ul>
      </li>
      <!-- End Comment -->

      <!-- Comment -->
      <li class="mb-5">
        <div class="media align-items-center mb-2">
          <div class="avatar avatar-circle mr-3">
            <img class="avatar-img" src="../assets/img/100x100/img1.jpg" alt="Image Description">
          </div>
          <div class="media-body">
            <div class="d-flex justify-content-between align-items-center">
              <span class="h5 mb-0">Christina Kray</span>
              <small class="text-muted">2 days ago</small>
            </div>
          </div>
        </div>

        <p>Since our attention spans seem to be shrinking by the day — keeping it simple is more important than ever.</p>

        <a class="font-weight-bold" href="#">Reply</a>
      </li>
      <!-- End Comment -->
    </ul>
  </div>
</div>