@extends('layouts.frontend')

@section('styles')
<style type="text/css">
    .mfp-bg.mfp-ready{
        height: 100% !important;
        overflow-y: hidden !important;
    }
    video.center{
        display: block;
        margin-left: auto;
        margin-right: auto;
    }
    form .error {
      color: #eb1e23;
    }
    .custom-file-input, .custom-file-label{
        height: calc(2.5em + .75rem + 2px);
    }
    .custom-file-label, .custom-file-label::after{
        padding: 1.475rem .75rem;
        line-height: 0.3;
    }
    #happy_code_input{
        height: 50px;
    }
    input[type=number]::-webkit-inner-spin-button,
    input[type=number]::-webkit-outer-spin-button { 
        -webkit-appearance: none;
    }
</style>
@endsection
@section('content')
<div class="container">
    <div class="row justify-content-center align-items-center py-5">
        <h2 class="text-center text-black font-weight-bold">Thank you for your registration</h2>
    </div>

    <div class="row">
        <div class="col-md-6">
            <h2 class="text-center text-black font-weight-bold">Step 1 : open QR Scanner</h2>
            <img src="{{ asset('assets/LandingPage/LandingPage/StepIcon/HappyGrains_CNY2023_Step1.png') }}" width="500" height="500" class="img-fluid" alt="Happy Grains CNY 2023 Step 1">
        </div>
        <div class="col-md-6">
            <h2 class="text-center text-black font-weight-bold">Step 2 : Scan Hologram QR</h2>
            <img src="{{ asset('assets/LandingPage/LandingPage/StepIcon/HappyGrains_CNY2023_Step2.png') }}" width="500" height="500" class="img-fluid" alt="Happy Grains CNY 2023 Step 2">
        </div>
    </div>
</div>

@endsection