<div fxLayout="row" fxFlex="100%" fxLayoutAlign="center" class="knok-common">
    <div fxLayout="column" fxFlex="38%" fxLayoutAlign="start start" style="margin-left:20px;">
        <div>Currency Pair</div>
        <div class="step-value">{{pair}}</div>
    </div>    
    <div fxLayout="column" fxFlex="1%" class="divider"></div>
    <div fxLayout="column" fxFlex="38%" fxLayoutAlign="start start" style="margin-left:20px;">
        <div>Exchange</div>
        <div class="step-value">{{exchange}}</div>
    </div>
    <div fxLayout="column" fxFlex="23%" fxLayoutAlign="center center">
        <button class="next-button" mat-raised-button (click)="discardAndCancel()">
            <strong>Discard &amp; Cancel</strong>
        </button>
    </div>
</div>