Organism

Container Listing

  • inprogress
Usage Example Modifier

Usage

When to use

tbd

When to use

tbd

Example

Show code
class

Classroom Courses

Learn in a classroom environment with a trainer who can answer your questions directly.

time

Evening Courses

Our courses are designed for you to do them on the side, in the evenings or on weekends.

chat

Individual Support

We support you wherever we can, and help you take that next big step in your career.

certificate

Course certificate

Learn in a classroom environment with a trainer who can answer your questions directly. 

            
              <div class="container-listing">
  <div class="container-listing__body">
    <div class="block-icon block-icon--is-loud">
      <div class="block-icon__header">
        <div class="block-icon__icon">
          <img class="icon block-icon__icon-image" src="/assets/images/hcs-icon-class.svg" alt="class">
        </div>
        <h4 class="block-icon__title">
          Classroom Courses
        </h4>
      </div>
      <div class="block-icon__body">
        <p class="block-icon__description">
          Learn in a classroom environment with a trainer who can answer your questions directly.
      </div>
    </div>
    <div class="block-icon block-icon--is-loud">
      <div class="block-icon__header">
        <div class="block-icon__icon">
          <img class="icon block-icon__icon-image" src="/assets/images/hcs-icon-time.svg" alt="time">
        </div>
        <h4 class="block-icon__title">
          Evening Courses
        </h4>
      </div>
      <div class="block-icon__body">
        <p class="block-icon__description">
          Our courses are designed for you to do them on the side, in the evenings or on weekends.
      </div>
    </div>
    <div class="block-icon block-icon--is-loud">
      <div class="block-icon__header">
        <div class="block-icon__icon">
          <img class="icon block-icon__icon-image" src="/assets/images/hcs-icon-chat.svg" alt="chat">
        </div>
        <h4 class="block-icon__title">
          Individual Support
        </h4>
      </div>
      <div class="block-icon__body">
        <p class="block-icon__description">
          We support you wherever we can, and help you take that next big step in your career.
      </div>
    </div>
    <div class="block-icon block-icon--is-loud">
      <div class="block-icon__header">
        <div class="block-icon__icon">
          <img class="icon block-icon__icon-image" src="/assets/images/hcs-icon-certificate.svg" alt="certificate">
        </div>
        <h4 class="block-icon__title">
          Course certificate
        </h4>
      </div>
      <div class="block-icon__body">
        <p class="block-icon__description">
          Learn in a classroom environment with a trainer who can answer your questions directly.
      </div>
    </div>
  </div>
</div>

Modifier

Name Description
When to use tbd