@extends('template')
@section('content')
    <style>
        .sarana {
            text-align: center;
            line-height: 80px;
            width: 80px;
            font-size: 32px;
            margin: 0;
            padding: 0;
        }
    </style>
    <div class="container-fluid">
        <div class="row">
            <div class="col-6">
                <h5><b>Kepramukaan Wilayah Kalimantan Timur</b></h5>
                <div class="card shadow">
                    <div class="card-body p-2">
                        <div class="d-flex">
                            <div class="p-3 items-center">
                                <img src="logo/kwartir.jpg" width="150px" alt="">
                            </div>
                            <div class="p-2">
                                <h6><b>Kwartir Daerah</b></h6>
                                <p style="font-size: 12px">(Kwarda) adalah satuan organisasi yang mengelola Gerakan Pramuka
                                    di tingkat Provinsi.
                                    Berdasarkan tingkatkan/ wilayahnya. Kwarda berkedudukan di masing-masing ibu kota
                                    Provinsi. Pengurus Kwarda diketuai oleh Ketua Kwarda (disingkat Ka Kwarda).</p>
                                <div class="text-end">
                                    <a href="" class="btn btn-primary"><span
                                            class="material-symbols-outlined mt-1">arrow_forward</span></a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="card mt-3 shadow">
                    <div class="card-body p-2">
                        <div class="d-flex">
                            <div class="p-3 items-center">
                                <img src="logo/kwartir.jpg" width="150px" alt="">
                            </div>
                            <div class="p-2">
                                <h6><b>Kwartir Daerah</b></h6>
                                <p style="font-size: 12px">(Kwarda) adalah satuan organisasi yang mengelola Gerakan Pramuka
                                    di tingkat Provinsi.
                                    Berdasarkan tingkatkan/ wilayahnya. Kwarda berkedudukan di masing-masing ibu kota
                                    Provinsi. Pengurus Kwarda diketuai oleh Ketua Kwarda (disingkat Ka Kwarda).</p>
                                <div class="text-end">
                                    <a href="" class="btn btn-primary"><span
                                            class="material-symbols-outlined mt-1">arrow_forward</span></a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="card mt-3 shadow">
                    <div class="card-body p-2">
                        <div class="d-flex">
                            <div class="p-3 items-center">
                                <img src="logo/kwartir.jpg" width="150px" alt="">
                            </div>
                            <div class="p-2">
                                <h6><b>Kwartir Daerah</b></h6>
                                <p style="font-size: 12px">(Kwarda) adalah satuan organisasi yang mengelola Gerakan Pramuka
                                    di tingkat Provinsi.
                                    Berdasarkan tingkatkan/ wilayahnya. Kwarda berkedudukan di masing-masing ibu kota
                                    Provinsi. Pengurus Kwarda diketuai oleh Ketua Kwarda (disingkat Ka Kwarda).</p>
                                <div class="text-end">
                                    <a href="" class="btn btn-primary"><span
                                            class="material-symbols-outlined mt-1">arrow_forward</span></a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-6">
                <h5><b>Menu Pramuka</b></h5>
                <div class="card">
                    <div class="card-body p-2">
                        <div class="d-flex justify-content-around">
                            <div class="p-2">
                                <div class="text-center">
                                    <a href="" class="btn text-light sarana" style="background: #cca152"><i
                                            class="bi bi-list-task"></i></a>
                                </div>
                                <div class="text-center mt-2">
                                    <span>Susunan</span>
                                </div>
                            </div>
                            <div class="p-2">
                                <div class="text-center">
                                    <a href="" class="btn sarana text-light" style="background: #cca152"><i
                                            class="bi bi-person"></i></a>
                                </div>
                                <div class="text-center mt-2">
                                    <span>Pembina</span>
                                </div>
                            </div>
                            <div class="p-2">
                                <div class="text-center">
                                    <a href="" class="btn text-light sarana" style="background: #cca152"><i
                                            class="bi bi-image-fill"></i></a>
                                </div>
                                <div class="text-center mt-2">
                                    <span>Publikasi</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <h5><b>Jumlah Anggota Gerakan Pramuka</b></h5>
                <div class="card">
                    <div class="card-body p-4">
                        <span>Siaga (7 - 10 tahun)</span><br>
                        <span><b>120.000</b></span>
                        <br>
                        <span>Penggalang (11 - 15 tahun)</span><br>
                        <span><b>13.234.000</b></span>
                        <br>
                        <span>Penegak (16 - 20 tahun)</span><br>
                        <span><b>6.000.000</b></span>
                        <br>
                        <span>Pandega (21 - 25 tahun)</span><br>
                        <span><b>4.000.000</b></span>
                        <br>
                        <br>
                        <span style="font-size: 11px;"><i>*Berdasarkan data tahun 2022</i></span>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection