@extends('frontend.m9')

@section('styles')
    <link rel="stylesheet" type="text/css" href="{{ asset('css/contact-us.css') }}">
@endsection

@section('content')
<style>
    #wave-pay{
        margin-top: 100px;
    }
    #wave_query{
            background: #FFE61D;
            color: #000;
            padding: 8px 50px;
            border: 1px solid #ccc;
            border-radius: 10px;
            cursor: pointer;
            text-decoration: none;
        }
</style>
<div id="content_contact_us" role="main">
    <div class="support-container">
        <div class="header-support">
            <div class="header-content">
                <h2 class="header-title">Wave Pay with QR Code</h2>
            </div>
        </div>

        <div class="contact-information">
            <div class="product-assistance contact-information-module about-us" id="wave-pay">
                <h2 class="main-title">Wave Pay with QR Code</h2>
                <div class="">
                <div class="card card-signin my-5">
                    <div class="card-body">
                        <center>
                            <img src="images/wave.png" class="img-fluid" style="width: 105px; height: 105px;">
                        </center>
                        <br>
                        <center>
                        <h2 class="text-center">WELCOME TO Wave PAY!</h2>
                        </center>
                        <center>
                            <div class="mb-4 lead">
                                <p>Are you sure to make payment with Wave PAY?</p>
                                
                                    <img src= "images/wave-qr-code.jpg" class="qr-code img-thumbnail img-responsive" style="width: 400px; margin-top: 50px"/> 
                                    <br><br>
                                    <div class="form-signin">
                                       
                                        <a href="{{ url('/') }} " id="wave_query">Continue</a>
                                    </div>
                            
                            </div>
                        </center>
                    </div>
                </div>
            </div>
            </div>
        </div>
    </div>

</div>

@endsection