<ngx-spinner type="ball-pulse-sync" color="#e74c3c">
    <p style="font-size: 20px; color: #e74c3c">{{'Log in...' | translate}}</p>
</ngx-spinner>
<section class="login p-fixed d-flex text-center bg-light ">
    <div class="auth-fluid">
        <div class="row">
            <div class="col-sm-12">
                <div class="login-card card-body auth-body">
                    <form class="md-float-material">
                        <div class="text-center">
                            <img src="assets/images/auth/big.png" style="width:150px;height:50px" alt="logo.png">
                        </div>
                        <div class="auth-box">
                            <div class="row m-b-20">
                                <div class="col-md-12">
                                    <h3 class="text-left txt-primary">{{'Welcome to Setup Wizard' | translate}}</h3>
                                    <p class="text-left txt-primary">{{'Create Admin Profile' | translate}}</p>
                                </div>
                            </div>
                            <hr />
                            <div class="input-group">
                                <input type="email" class="form-control"
                                    [placeholder]="('Your Email Address' | translate) || '&nbsp;'" [(ngModel)]="email"
                                    [ngModelOptions]="{standalone: true}">
                                <span class="md-line"></span>
                            </div>
                            <div class="input-group">
                                <input type="password" class="form-control"
                                    [placeholder]="('Password' | translate) || '&nbsp;'" [(ngModel)]="password"
                                    [ngModelOptions]="{standalone: true}">
                                <span class="md-line"></span>
                            </div>
                            <div class="row m-t-30">
                                <div class="col-md-12">
                                    <button type="button" (click)="login()"
                                        class="btn btn-danger btn-md btn-block waves-effect text-center m-b-20">{{'Create Admin Profile' | translate}}</button>
                                </div>
                                <div class="btns">
                                    <img src="assets/en.png" (click)="changeLng('en')"
                                        [ngClass]="getClassName() == 'en' ? 'flagActive':'flagDeactive'" alt="">
                                    <img src="assets/spanish.png" (click)="changeLng('spanish')"
                                        [ngClass]="getClassName() == 'spanish' ? 'flagActive':'flagDeactive'" alt="">
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</section>
<ng2-toasty></ng2-toasty>