<h3><span class="dataList__headerbdr"></span>{{obj.heading}}</h3>
<div class="row feature-details">
  <div class="col-6 feature-details__block" *ngFor="let obj of obj.data">
    <div class="row">
      <div class="col-2 feature-details__block--image">
        <img *ngIf="obj.image; else defaultExtImg" 
        appDescriptiveCard [descriptiveCardProperties]="descriptiveCardItem" src={{obj?.image}}  class="" alt="First sample image">
        <ng-template #defaultExtImg>
          <img src='' 
          appDescriptiveCard [descriptiveCardProperties]="descriptiveCardItem" class="img-fluid" alt="First sample image">
        </ng-template>
      </div>
      <div class="col-10 feature-details__block--content">
          <div class="row" >
              <div class="col-9">
                <b>{{obj.title}}</b>
                <br/>
                {{obj.text}}</div>
              <div class="col-3 text-right feature-details__block--value">{{obj.value}}</div>
            </div>
      </div>
    </div>
  </div>

</div>

<!-- <div mdbModal #modalContainer [style.top.px]="top" [style.left.px]="left" #basicModal="mdbModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myBasicModalLabel" aria-hidden="true">
    <div  class="modal-dialog modal-position" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close pull-right" aria-label="Close" (click)="basicModal.hide()">
            <span aria-hidden="true">×</span>
          </button>
          <img src='' class="img-fluid" alt="First sample image">
        </div>
      </div>
    </div>
  </div> -->

  <div #modalContainer [style.top.px]="top" [style.left.px]="left" id="myModal" class="modal">
      <div class="modal-content">
        <span (click)="closeDialog()" class="close">&times;</span>
        <p>Some text in the Modal..</p>
      </div>
    </div>

    