<div class="section">
  <div class="wojo-grid">
    <div class="row horizontal gutters">
      <div class="columns mobile-100 phone-100">
        <div class="wojo basic card" data-weditable="true">
          <div class="content center aligned">
            <figure class="wojo inline image relative bottom margin">
              <span class="wojo primary indicating label"></span>
              <img src="[SITEURL]/uploads/avatars/avatar_0013.jpg" alt="Address" class="wojo small circular image">
            </figure>
            <h6 class="basic">Patrick Garner</h6>
            <a class="wojo small text" href="#">@patrickgarner</a>
            <div class="top margin">
              <div class="wojo horizontal list">
                <div class="item">
                  <a class="wojo small secondary circular icon button" href="#">
                    <i class="icon facebook"></i>
                  </a>
                </div>
                <div class="item">
                  <a class="wojo small secondary circular icon button" href="#">
                    <i class="icon google"></i>
                  </a>
                </div>
                <div class="item">
                  <a class="wojo small secondary circular icon button" href="#">
                    <i class="icon twitter"></i>
                  </a>
                </div>
                <div class="item">
                  <a class="wojo small secondary circular icon button" href="#">
                    <i class="icon github"></i>
                  </a>
                </div>
              </div>
            </div>
          </div>
          <div class="footer divided center aligned">
            <a class="wojo small primary inverted button" href="#"><i class="icon email alt"></i>Send a Message</a>
          </div>
        </div>
      </div>
      <div class="columns mobile-100 phone-100">
        <div class="wojo basic card" data-weditable="true">
          <div class="content center aligned">
            <div class="bottom margin">
              <div class="wojo huge fitted negative initials circular relative label">
                <span class="wojo negative indicating label"></span> AO</div>
            </div>
            <h6 class="basic">Amanta Owens</h6>
            <a class="wojo small text" href="#">@amantaowens</a>
            <div class="top margin">
              <div class="wojo horizontal list">
                <div class="item">
                  <a class="wojo small secondary circular icon button" href="#">
                    <i class="icon facebook"></i>
                  </a>
                </div>
                <div class="item">
                  <a class="wojo small secondary circular icon button" href="#">
                    <i class="icon google"></i>
                  </a>
                </div>
                <div class="item">
                  <a class="wojo small secondary circular icon button" href="#">
                    <i class="icon twitter"></i>
                  </a>
                </div>
                <div class="item">
                  <a class="wojo small secondary circular icon button" href="#">
                    <i class="icon github"></i>
                  </a>
                </div>
              </div>
            </div>
          </div>
          <div class="footer divided center aligned">
            <a class="wojo small inverted primary button" href="#"><i class="icon email alt"></i>Send a Message</a>
          </div>
        </div>
      </div>
      <div class="columns mobile-100 phone-100">
        <div class="wojo basic card" data-weditable="true">
          <div class="content center aligned">
            <figure class="wojo inline image relative bottom margin">
              <span class="wojo primary indicating label"></span>
              <img src="[SITEURL]/uploads/avatars/avatar_0015.jpg" alt="Address" class="wojo small circular image">
            </figure>
            <h6 class="basic">Christina Diaz</h6>
            <a class="wojo small text" href="#">@christinadiaz</a>
            <div class="top margin">
              <div class="wojo horizontal list">
                <div class="item">
                  <a class="wojo small secondary circular icon button" href="#">
                    <i class="icon facebook"></i>
                  </a>
                </div>
                <div class="item">
                  <a class="wojo small secondary circular icon button" href="#">
                    <i class="icon google"></i>
                  </a>
                </div>
                <div class="item">
                  <a class="wojo small secondary circular icon button" href="#">
                    <i class="icon twitter"></i>
                  </a>
                </div>
                <div class="item">
                  <a class="wojo small secondary circular icon button" href="#">
                    <i class="icon github"></i>
                  </a>
                </div>
              </div>
            </div>
          </div>
          <div class="footer divided center aligned">
            <a class="wojo small inverted primary button" href="#"><i class="icon email alt"></i>Send a Message</a>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>