@extends ('layouts.indexfirst')

@section('content')

<style>
    .loader {
        position: fixed;
        top: 45%;
        right: 50%;
        width: 70px;
        height: 70px;
        border-top-color: white;
        border-right-color: white;
        border-left-color: transparent;
        border-bottom-color: transparent;
        border-radius: 50%;
        box-sizing: border-box;
        z-index: 10000 !important;
    }
</style>

<title>Home | Customer Portal</title>

<!-- <div class="loader">
    <img src="{{ asset('assets/img/material-kit/grid.svg') }}">
</div> -->

<div class="col-lg-4 col-md-6">
    <div class="card mt-5">
        <div class="card-header p-0 position-relative mt-n4 mx-3 z-index-2">
            <a class="d-block blur-shadow-image"> 
            <!-- public\argon\login\backg1backup3.jpg -->
                <img src="{{ asset('assets/img/material-kit/internal/bg99.jpg') }}" alt="img-colored-shadow" class="img-fluid border-radius-lg">
                <!-- <img src="{{ asset('argon/login/backg1backup3.jpg') }}" alt="img-colored-shadow" class="img-fluid border-radius-lg"> -->
            </a>
        </div>
        <div class="card-body text-center">
            <h5 class="font-weight-normal">
                <a>Rekod Pembayaran</a>
            </h5>
            <a type="button" href="{{ route('semaksag') }}" class="btn bg-gradient-primary btn-sm mb-0 mt-3">Enter</a>
        </div>
    </div>
</div>
<div class="col-lg-4 col-md-6">
    <div class="card mt-5">
        <div class="card-header p-0 position-relative mt-n4 mx-3 z-index-2">
            <a class="d-block blur-shadow-image">
                <img src="{{ asset('assets/img/material-kit/internal/photo2.jpg') }}" alt="img-colored-shadow" class="img-fluid border-radius-lg">
            </a>
        </div>
        <div class="card-body text-center">
            <h5 class="font-weight-normal">
                <a>Pembayaran</a>
            </h5>
            <a type="button" href="{{ route('pembayaransag') }}" class="btn bg-gradient-primary btn-sm mb-0 mt-3">Enter</a>
        </div>
    </div>
</div>
<div class="col-lg-4 col-md-6">
    <div class="card mt-5">
        <div class="card-header p-0 position-relative mt-n4 mx-3 z-index-2">
            <span class="mask bg-gradient-dark opacity-20"></span>

            <a class="d-block blur-shadow-image">

                <img src="{{ asset('assets/img/material-kit/internal/photo3.jpg') }}" alt="img-colored-shadow" class="img-fluid border-radius-lg">
            </a>
        </div>
        <div class="card-body text-center">
            <h5 class="font-weight-normal">
                <a>Tebus</a>
            </h5>
            <button type="button" class="btn bg-gradient-primary btn-sm mb-0 mt-3" disabled>Enter</button>
        </div>
    </div>
</div>
<div class="col-lg-4 col-md-6">
    <div class="card mt-5">
        <div class="card-header p-0 position-relative mt-n4 mx-3 z-index-2">
            <a class="d-block blur-shadow-image">
                <img src="{{ asset('assets/img/material-kit/internal/photo4.jpg') }}" alt="img-colored-shadow" class="img-fluid border-radius-lg">
            </a>
        </div>
        <div class="card-body text-center">
            <h5 class="font-weight-normal">
                <a>Ringkasan Transaksi Pembiayaan</a>
            </h5>
            <a type="button" href="{{ route('analisa.index') }}" class="btn bg-gradient-primary btn-sm mb-0 mt-3">Enter</a>
        </div>
    </div>
</div>
<div class="col-lg-4 col-md-6">
    <div class="card mt-5">
        <div class="card-header p-0 position-relative mt-n4 mx-3 z-index-2">
            <span class="mask bg-gradient-dark opacity-20"></span>

            <a class="d-block blur-shadow-image">
                <img src="{{ asset('assets/img/material-kit/internal/photo5.jpg') }}" alt="img-colored-shadow" class="img-fluid border-radius-lg">
            </a>
        </div>
        <div class="card-body text-center">
            <h5 class="font-weight-normal">
                <a>Gold</a>
            </h5>
            <button type="button" class="btn bg-gradient-primary btn-sm mb-0 mt-3" disabled>Enter</button>
        </div>
    </div>
</div>

<!-- <script>
    $(function() {
        setTimeout(() => {
            $(".loader").fadeOut(1000);
        }, 500)
    })
</script> -->

@endsection