<div class="row">
  <div class="col-12">
    <app-heading></app-heading>
    <app-breadcrumb></app-breadcrumb>
    <div class="separator mb-5"></div>
  </div>
</div>
<div class="row equal-height-container">
  <div class="col-md-12 col-xl-6 mb-4 col-item" *ngFor="let item of data">
    <div class="card">
      <div class="card-body">
        <div class="text-center">
          <i [class]="item.icon+ ' large-icon'"></i>
          <h5 class="mb-0 font-weight-semibold color-theme-1 mb-4">{{item.title}}</h5>
        </div>
        <div class="pl-3 pr-3 pt-3 pb-0 d-flex flex-column flex-grow-1">
          <p class="text-muted mb-4">{{item.detail}}</p>
          <ul class="list-unstyled mb-0">
            <li *ngFor="let subitem of item.subtitles">
              <a [routerLink]="subitem.link" class="btn-link">{{subitem.title}}</a>
            </li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>
