Cardsv5.x

---- A basic card --------
<div class="card">
   <div class="card-body">
      A basic card.
   </div>
</div>
---- A more complex card --------
<div class="card w-50">
   <div class="card-body">
      <h5 class="card-title">A More Complex Card</h5>
      <h6 class="card-subtitle mb-2 text-body-secondary">With Links and List Items!</h6>
      <p class="card-text">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Deserunt itaque
         cum modi adipisci consequatur blanditiis.</p>
      <a href="#" class="card-link">Link One</a>
      <a href="#" class="card-link">Link Two</a>
   </div>
   <ul class="list-group list-group-flush">
      <li class="list-group-item">An item</li>
      <li class="list-group-item">A second item</li>
      <li class="list-group-item">A third item</li>
   </ul>
</div>
---- A Card w/ an image top --------
<div class="card w-50">
   <img src="https://unsplash.it/300/300" class="card-img-top" alt="image top of card">
   <div class="card-body">
      <h4 class="card-text">Card with an image top</h4>
      <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolore iure in accusamus beatae,
         sequi error omnis ratione architecto quia tempore!</p>
   </div>
</div>
---- A Card with header and footer --------
<div class="card">
<div class="card-header">
   Card Header
</div>
<div class="card-body">
   <h5 class="card-title">Card Title</h5>
   <p class="card-text">Card text goes here, innit!?</p>
   <a href="#" class="btn btn-primary">Button</a>
</div>
<div class="card-footer text-body-secondary">
   Card Footer
</div></div>