crayons-css-utils.html

<article class="fw-mx-16">
  <div class="fw-card-1 fw-p-20 fw-flex fw-flex-column" style="width: 200px">
    <section>
      <div class="fw-flex fw-flex-row">
        <p class="fw-flex-grow fw-type-h7 fw-mb-0">Booking ID</p>
        <span class="fw-type-xs"><fw-icon name="arrow-right"></fw-icon></span>
      </div>
      <a href="#">
        <span class="fw-type-h6 fw-color-azure-800">#1237483</span>
      </a>
    </section>
    <section class="fw-mt-20">
      <p class="fw-type-h7 fw-mb-0">Hotel</p>
      <a href="#">
        <span class="fw-type-h6 fw-mt-4 fw-color-azure-800">Leela Palace</span>
      </a>
    </section>
    <section class="fw-mt-20">
      <p class="fw-type-h7 fw-mb-0">Customer Name</p>
      <a href="#">
        <span class="fw-type-h6 fw-mt-4 fw-color-azure-800">David</span>
      </a>
    </section>
  </div>
</article>