Iota Css Example Code - Main HTML for those who are following along with the "Main Content Part 1" iota CSS Tutorial

index.html

<!-- ... -->
<!-- Main Section -->
<main class="u-pv-x7">
  <!-- Title Section -->
  <div class="o-container o-container--size-small">
    <div class="o-grid o-grid--middle u-mb-x7">
      <div class="o-grid__col u-1/2 u-text-left">
        <h1 class="o-type-35">Dashboard</h1>
      </div>
      <div class="o-grid__col u-1/2 u-text-right">
        <a href="#" class="c-button">Add New</a>  
      </div>
    </div>
    <!-- Card Section -->
    <div class="o-grid o-grid--gutter-x4">
      <div class="o-grid__col u-1/3@sm">
        <div class="c-card u-text-center">
          <h2 class="o-type-80 u-color-purple u-weight-normal">10</h2>
          <p class="o-type-20">Published Posts</p>
        </div>
      </div>
      <div class="o-grid__col u-1/3@sm u-mb-x7">
        <div class="c-card u-text-center">
          <h2 class="o-type-80 u-color-red u-weight-normal">10</h2>
          <p class="o-type-20">Deleted Posts</p>
        </div>
      </div>
      <div class="o-grid__col u-1/3@sm">
        <div class="c-card u-text-center">
          <h2 class="o-type-80 u-color-grey u-weight-normal">10</h2>
          <p class="o-type-20">Scheduled Posts</p>
        </div>
      </div>
    </div>
  </div>
</main>
<!-- ... -->