<ion-grid class="zoomIn">
  <ion-row>
    <!-- button with text under-->
    <ion-col text-center *ngFor="let method of methods" [size]="6">
      <ion-grid>
        <ion-row text-center (click)="openPayment(method.method)">
          <ion-col center [size]="12">
            <img class="button-anim rubberBand" [src]=" 'assets/icon/payment/' + method.icon + '.png'">
          </ion-col>
          <ion-col center [size]="12">
            <ion-text color="primary">{{ method.title | translate }}</ion-text>
          </ion-col>
        </ion-row>
        <ion-row>
          <ion-col [size]="12" class="slideInUp">
            <divider></divider>
          </ion-col>
        </ion-row>
      </ion-grid>
    </ion-col>
  </ion-row>
  <ion-row>
    <div style="height: 1cm;"></div>
  </ion-row>
  <ion-row class="ion-justify-content-center">
    <ion-col [size]="10" [sizeLg]="8" [sizeXl]="6" no-padding>
      <ion-button (click)="onCancel()" expand="block">
        {{'general,cancel' | translate}}
      </ion-button>
    </ion-col>
  </ion-row>

</ion-grid>