Working N Y C

<article class="c-card ">
  <header class="c-card__header">
    <a class="c-card__header-link" href="https://cityofnewyork.github.io/working-nyc-patterns/demos/programs/red-hook-on-the-road">
      <h3 class="c-card__title">
        <span data-program="plain-language-name">Commercial driver training</span>
      </h3>
    </a>
    <h4 class="c-card__subtitle text-alt">
      <b data-program="title">Red Hook on the Road</b> by <span data-program="provider">Brooklyn Workforce Innovations</span>
    </h4>
  </header>
  <div class="c-card__body">
    <p class="c-card__status flex items-center">
      <mark class="badge mie-2" data-program="recruiting"> Actively recruiting </mark>
      <!-- <span class="flex mie-2" data-program="accessible">
          <svg aria-hidden="true" class="icon text-alt">
            <use href="#icon-wnyc-accessible"></use>
          </svg>

          <span class="sr-only">Accommodates Disabilities</span>
        </span> -->
      <!-- <span class="flex mie-2" data-program="multilingual">
          <svg aria-hidden="true" class="icon-wnyc-ui text-alt">
            <use href="#icon-wnyc-translate"></use>
          </svg>

          <span class="sr-only">Accommodates Multiple Languages</span>
        </span> -->
    </p>
    <div class="c-card__summary">
      <p>
        <span data-program="summary">Through this program students prepare to work as commercial drivers.</span> For <b class="text-em" data-program="taxonomy.population">Unemployed New Yorkers</b> and <b class="text-em" data-program="taxonomy.population"> Adults</b>.
      </p>
    </div>
    <ul class="c-card__features">
      <li class="flex items-center">
        <svg class="icon-wnyc-ui mie-1" role="img">
          <title>Services</title>
          <use href="#feather-award"></use>
        </svg>
        <span>
          <span data-program="taxonomy.services">Training for a new career</span>,&nbsp; <span data-program="taxonomy.services">job certification</span>
        </span>
      </li>
      <li class="flex items-center">
        <svg class="icon-wnyc-ui mie-1" role="img">
          <title>Schedule</title>
          <use href="#feather-calendar"></use>
        </svg>
        <span>
          <span data-program="taxonomy.duration">4 weeks</span>,&nbsp; <span data-program="taxonomy.schedule">evening</span>&nbsp;schedule
        </span>
      </li>
    </ul>
    <a class="c-card__cta" href="https://cityofnewyork.github.io/working-nyc-patterns/demos/programs/red-hook-on-the-road">
      <svg aria-hidden="true" class="icon-wnyc-ui rtl:flip">
        <use href="#feather-arrow-left"></use>
      </svg>
      <span>Learn more&nbsp;<span class="sr-only">about&nbsp;<span data-program="plain-language-name">Commercial driver training</span>
        </span>
      </span>
      <svg aria-hidden="true" class="icon-wnyc-ui rtl:flip">
        <use href="#feather-arrow-right"></use>
      </svg>
    </a>
  </div>
</article>