<div class="col-lg-4 col-md-6 col-sm-8">
  <div id="blog-card-item" class="card">
    <img
      class="img-card-top"
      src="<%= blog.imageUrl %>"
      alt="<%= blog.imageText %>"
      width="100%"
    />
    <div class="card-body">
      <h4 class="card-title">
        <a class="card-link" href="/<%= blog.urlTitle %>">
          <strong><%= blog.title %></strong>
        </a>
      </h4>

      <p class="card-subtitle">
        <em>by <%= blog.author %> on <%= blog.shortDate %></em>
      </p>

      <div class="blog-card-text-div">
        <p class="card-text"><%= blog.excerpt %></p>
      </div>

      <div class="card-read-more">
        <a class="card-link" href="/<%= blog.urlTitle %>">
          Read More <i class="fa-solid fa-arrow-right"></i>
        </a>
      </div>
    </div>
  </div>
</div>
