<div class="card h-100">
  <div class="card-header pb-0">
    <h6>Exam/Result overview</h6>
    <p class="text-sm">
      <!-- <i class="fa fa-arrow-up text-success" aria-hidden="true"></i> -->
      <!-- <span class="font-weight-bold">24%</span> this month -->
    </p>
  </div>
  <div
    class="card-body p-3"
    style="display: none;"
  >
    <div class="timeline timeline-one-side">
      <div class="timeline-block mb-3">
        <span class="timeline-step">
          <i class="material-icons text-success text-gradient">notifications</i>
        </span>
        <div class="timeline-content">
          <h6 class="text-dark font-weight-bold mb-0 text-sm">$2400,
            Design changes
          </h6>
          <p class="text-secondary font-weight-bold mb-0 mt-1 text-xs">
            22 DEC 7:20 PM
          </p>
        </div>
      </div>
      <div class="timeline-block mb-3">
        <span class="timeline-step">
          <i class="material-icons text-danger text-gradient">code</i>
        </span>
        <div class="timeline-content">
          <h6 class="text-dark font-weight-bold mb-0 text-sm">New
            order #1832412</h6>
          <p class="text-secondary font-weight-bold mb-0 mt-1 text-xs">
            21 DEC 11 PM
          </p>
        </div>
      </div>
      <div class="timeline-block mb-3">
        <span class="timeline-step">
          <i class="material-icons text-info text-gradient">shopping_cart</i>
        </span>
        <div class="timeline-content">
          <h6 class="text-dark font-weight-bold mb-0 text-sm">Server
            payments for
            April</h6>
          <p class="text-secondary font-weight-bold mb-0 mt-1 text-xs">
            21 DEC 9:34 PM
          </p>
        </div>
      </div>
      <div class="timeline-block mb-3">
        <span class="timeline-step">
          <i class="material-icons text-warning text-gradient">credit_card</i>
        </span>
        <div class="timeline-content">
          <h6 class="text-dark font-weight-bold mb-0 text-sm">New
            card added for order
            #4395133</h6>
          <p class="text-secondary font-weight-bold mb-0 mt-1 text-xs">
            20 DEC 2:20 AM
          </p>
        </div>
      </div>
      <div class="timeline-block mb-3">
        <span class="timeline-step">
          <i class="material-icons text-primary text-gradient">key</i>
        </span>
        <div class="timeline-content">
          <h6 class="text-dark font-weight-bold mb-0 text-sm">Unlock
            packages for
            development</h6>
          <p class="text-secondary font-weight-bold mb-0 mt-1 text-xs">
            18 DEC 4:54 AM
          </p>
        </div>
      </div>
      <div class="timeline-block">
        <span class="timeline-step">
          <i class="material-icons text-dark text-gradient">payments</i>
        </span>
        <div class="timeline-content">
          <h6 class="text-dark font-weight-bold mb-0 text-sm">New
            order #9583120</h6>
          <p class="text-secondary font-weight-bold mb-0 mt-1 text-xs">
            17 DEC</p>
        </div>
      </div>
    </div>
  </div>
</div>
