<div class=“container”>

<div class="row justify-content-center">
  <div class="row">
    <div class="col-lg" data-aos='fade-up'>
      <h2>My Work</h2>
      <br>
    </div>
  </div>
</div>
<div class="row">
  <div class="card-columns">
  {% for card in site.data.cards %}
    <div class="col text-center" data-aos='flip-left'>
      <div class="card">
        <img class="card-img-top" src='{{ card.img | relative_url }}' alt="Card image cap">
        <div class="card-body">
          <h5 class="card-title text-center">{{card.name}}</h5>
          <p class="card-text">{{card.desc}}</p>
          <a href="#" class="btn btn-primary" data-toggle='modal' data-target='.{{card.modal.id}}'>See More</a>
        </div>
      </div>
    </div>
  {% endfor %}
  </div>
</div>

</div>