@extends('layouts.main')

@section('content')
    <section class="bg-half-170 border-bottom agency-wrapper d-table w-100" id="home">
        <div class="container">
            <div class="row align-items-center">
                <div class="col-lg-7 col-md-7 order-1 order-md-2">
                    <div class="title-heading mt-4 ms-lg-5">
                        <h1 class="heading mb-3">Selamat Datang di Website <span class="text-primary">SIPERMATA</span></h1>
                        <p class="para-desc text-muted">Memudahkan dalam reservasi kunjungan kerja, studi banding, maupun
                            audiensi.</p>
                        <div class="mt-4 pt-2">
                            <a href="{{ route('login') }}" class="btn btn-primary m-1">Buat Reservasi <i
                                    class="uil
                                uil-angle-right-b"></i></a>
                            <!-- <a href="#!" data-type="youtube" data-id="yba7hPeTSjk" class="btn btn-icon btn-pills btn-primary m-1 lightbox"><i data-feather="video" class="icons"></i></a><span class="fw-bold text-uppercase small align-middle ms-1">Watch Now</span> -->
                        </div>
                    </div>
                </div>

                <div class="col-lg-5 col-md-5 order-2 order-md-1 mt-4 pt-2 mt-sm-0 pt-sm-0">
                    <img src="{{ asset('assets') }}/images/illustrator/working_with_computer.svg" class="img-fluid"
                        alt="">
                </div>
            </div>
        </div>
    </section>

    <section class="section">
        <div class="container">
            <div class="row">
                <div class="col-md-4 col-12">
                    <div class="features text-center">
                        <div class="image position-relative d-inline-block">
                            <i class="uil uil-edit-alt h1 text-primary"></i>
                        </div>

                        <div class="content mt-4">
                            <h5>Design & Development</h5>
                            <p class="text-muted mb-0">Nisi aenean vulputate eleifend tellus vitae eleifend enim a eleifend
                                Aliquam aenean elementum semper.</p>
                        </div>
                    </div>
                </div>

                <div class="col-md-4 col-12 mt-5 mt-sm-0">
                    <div class="features text-center">
                        <div class="image position-relative d-inline-block">
                            <i class="uil uil-vector-square h1 text-primary"></i>
                        </div>

                        <div class="content mt-4">
                            <h5>Management & Marketing</h5>
                            <p class="text-muted mb-0">Allegedly, a Latin scholar established the origin of the text
                                established by compiling unusual word.</p>
                        </div>
                    </div>
                </div>

                <div class="col-md-4 col-12 mt-5 mt-sm-0">
                    <div class="features text-center">
                        <div class="image position-relative d-inline-block">
                            <i class="uil uil-file-search-alt h1 text-primary"></i>
                        </div>

                        <div class="content mt-4">
                            <h5>Stratagy & Research</h5>
                            <p class="text-muted mb-0">It seems that only fragments of the original text remain in the Lorem
                                the original Ipsum texts used today.</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="container mt-100 mt-60">
            <div class="row align-items-center">
                <div class="col-lg-6 col-md-6">
                    <img src="{{ asset('assets') }}/images/saas/2.png" class="img-fluid" alt="">
                </div>

                <div class="col-lg-6 col-md-6 mt-4 mt-sm-0 pt-2 pt-sm-0">
                    <div class="section-title ms-lg-3">
                        <h4 class="title mb-4">Great Product Analytics With Real Problem</h4>
                        <p class="text-muted">Due to its widespread use as filler text for layouts, non-readability is of
                            great importance: human perception is tuned to recognize certain patterns and repetitions in
                            texts. If the distribution of letters visual impact.</p>
                        <a href="javascript:void(0)" class="mt-3 h6 text-primary">Find Out More <i
                                class="uil uil-angle-right-b align-middle"></i></a>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section class="section bg-cta" style="background: url('{{ asset('assets') }}/images/1.jpg') center center;">
        <div class="bg-overlay"></div>
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-12 text-center">
                    <div class="section-title">
                        <h4 class="title title-dark text-white mb-4">Stop leaving money on the table.</h4>
                        <p class="text-light para-dark para-desc mx-auto">Start working with Landrick that can provide
                            everything you need to generate awareness, drive traffic, connect.</p>
                        <a href="#!" data-type="youtube" data-id="yba7hPeTSjk"
                            class="play-btn border border-light mt-4 lightbox">
                            <i data-feather="play" class="fea icon-ex-md text-white title-dark"></i>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- Shape Start -->
    <div class="position-relative">
        <div class="shape overflow-hidden text-light">
            <svg viewBox="0 0 2880 48" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path d="M0 48H1437.5H2880V0H2160C1442.5 52 720 0 720 0H0V48Z" fill="currentColor"></path>
            </svg>
        </div>
    </div>
    <!--Shape End-->

    
    <!-- Team Start -->
    <section class="section bg-light">
        <div class="container">
            <div class="row">
                <div class="col-12 text-center">
                    <div class="section-title mb-4 pb-2">
                        <h4 class="title mb-4">Pimpinan DPRD</h4>
                        <!-- <p class="text-muted para-desc mx-auto mb-0">Start working with <span class="text-primary fw-bold">Landrick</span> that can provide everything you need to generate awareness, drive traffic, connect.</p> -->
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-lg-3 col-md-6 mt-4 pt-2">
                    <div class="card team text-center bg-transparent border-0">
                        <div class="card-body p-0">
                            <!-- <div class="position-relative"> -->
                            <img src="{{ asset('assets') }}/images/teams/aslim.png"
                                class="img-fluid avatar avatar-ex-large rounded-circle" alt="">
                            <!-- </div> -->
                            <div class="content pt-3 pb-3">
                                <h5 class="mb-0"><a href="javascript:void(0)" class="name text-dark">Aslim</a></h5>
                                <small class="designation text-muted">Ketua</small>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-lg-3 col-md-6 mt-4 pt-2">
                    <div class="card team text-center bg-transparent border-0">
                        <div class="card-body p-0">
                            <!-- <div class="position-relative"> -->
                            <img src="{{ asset('assets') }}/images/teams/agus-wahyudin.png"
                                class="img-fluid avatar avatar-ex-large rounded-circle" alt="">

                            <!-- </div> -->
                            <div class="content pt-3 pb-3">
                                <h5 class="mb-0"><a href="javascript:void(0)" class="name text-dark">Agus Wahyudin</a>
                                </h5>
                                <small class="designation text-muted">Wakil Ketua</small>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-lg-3 col-md-6 mt-4 pt-2">
                    <div class="card team text-center bg-transparent border-0">
                        <div class="card-body p-0">
                            <!-- <div class="position-relative"> -->
                            <img src="{{ asset('assets') }}/images/teams/muslim.png"
                                class="img-fluid avatar avatar-ex-large rounded-circle" alt="">
                            <!-- </div> -->
                            <div class="content pt-3 pb-3">
                                <h5 class="mb-0"><a href="javascript:void(0)" class="name text-dark">Muslim</a></h5>
                                <small class="designation text-muted">Wakil Ketua</small>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-lg-3 col-md-6 mt-4 pt-2">
                    <div class="card team text-center bg-transparent border-0">
                        <div class="card-body p-0">
                            <!-- <div class="position-relative"> -->
                            <img src="{{ asset('assets') }}/images/teams/mamat-rahmat.png"
                                class="img-fluid avatar avatar-ex-large rounded-circle" alt="">
                            <!-- </div> -->
                            <div class="content pt-3 pb-3">
                                <h5 class="mb-0"><a href="javascript:void(0)" class="name text-dark">Mamat Rahmat</a>
                                </h5>
                                <small class="designation text-muted">Wakil Ketua</small>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </section>

    <div class="position-relative">
        <div class="shape overflow-hidden text-footer">
            <svg viewBox="0 0 2880 48" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path d="M0 48H1437.5H2880V0H2160C1442.5 52 720 0 720 0H0V48Z" fill="currentColor"></path>
            </svg>
        </div>
    </div>

    <footer class="footer">
        <div class="container">
            <div class="row">
                <div class="col-lg-4 col-12 mb-0 mb-md-4 pb-0 pb-md-2">
                    <a href="#" class="logo-footer">
                        <img src="{{ asset('assets') }}/images/logo-dprd.png" height="60" alt="">
                    </a>
                    <p class="mt-4 mb-0">Jl. RE. Martadinata No.334 Kota Tasikmalaya, Provinsi Jawa Barat.</p>
                    <p class="mt-0">Telp. (0265) 313094</p>
                    <p class="mt-0"><a href="mailto:dprdkotatasikmalaya@gmail.com"
                            style="color: #adb5bd;">dprdkotatasikmalaya@gmail.com</a></p>
                    <ul class="list-unstyled social-icon foot-social-icon mb-0 mt-4">
                        <li class="list-inline-item"><a href="https://www.instagram.com/info.dprdkotatasikmalaya/"
                                class="rounded"><i data-feather="instagram" class="fea icon-sm fea-social"></i></a></li>
                        <li class="list-inline-item"><a href="https://twitter.com/DPRDKotaTasik" class="rounded"><i
                                    data-feather="twitter" class="fea icon-sm fea-social"></i></a></li>
                        <li class="list-inline-item"><a href="https://www.youtube.com/DPRDKotaTasikmalaya"
                                class="rounded"><i data-feather="youtube" class="fea icon-sm fea-social"></i></a></li>
                    </ul>
                </div>

                <div class="col-lg-2 col-md-4 col-12 mt-4 mt-sm-0 pt-2 pt-sm-0">
                    <h5 class="text-light footer-head">Company</h5>
                    <ul class="list-unstyled footer-list mt-4">
                        <li><a href="page-aboutus.html" class="text-foot"><i class="uil uil-angle-right-b me-1"></i>
                                About us</a></li>
                        <li><a href="page-services.html" class="text-foot"><i class="uil uil-angle-right-b me-1"></i>
                                Services</a></li>
                        <li><a href="page-team.html" class="text-foot"><i class="uil uil-angle-right-b me-1"></i>
                                Team</a></li>
                    </ul>
                </div>

                <div class="col-lg-3 col-md-4 col-12 mt-4 mt-sm-0 pt-2 pt-sm-0">
                    <h5 class="text-light footer-head">Link Terkait</h5>
                    <ul class="list-unstyled footer-list mt-4">
                        <li><a href="https://dprd-tasikmalayakota.go.id/" class="text-foot"><i
                                    class="uil uil-angle-right-b me-1"></i> DPRD Kota Tasikmalaya</a></li>
                        <li><a href="https://jdih.tasikmalayakota.go.id/" class="text-foot"><i
                                    class="uil uil-angle-right-b me-1"></i> JDIH</a></li>
                    </ul>
                </div>

                <div class="col-lg-3 col-md-4 col-12 mt-4 mt-sm-0 pt-2 pt-sm-0">
                    <h5 class="text-light footer-head">Newsletter</h5>
                    <p class="mt-4">Sign up and receive the latest tips via email.</p>
                    <!-- <form>
                                <div class="row">
                                    <div class="col-lg-12">
                                        <div class="foot-subscribe mb-3">
                                            <label class="form-label">Write your email <span class="text-danger">*</span></label>
                                            <div class="form-icon position-relative">
                                                <i data-feather="mail" class="fea icon-sm icons"></i>
                                                <input type="email" name="email" id="emailsubscribe" class="form-control ps-5 rounded" placeholder="Your email : " required>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-lg-12">
                                        <div class="d-grid">
                                            <input type="submit" id="submitsubscribe" name="send" class="btn btn-soft-primary" value="Subscribe">
                                        </div>
                                    </div>
                                </div>
                            </form> -->
                </div>
            </div>
        </div>
    </footer>
    <footer class="footer footer-bar">
        <div class="container text-center">
            <div class="row align-items-center">
                <div class="col-sm-6">
                    <div class="text-sm-start">
                        <p class="mb-0">©
                            <script>
                                document.write(new Date().getFullYear())
                            </script> Sipermata. <a href="https://dprd-tasikmalayakota.go.id/"
                                target="_blank" class="text-reset">DPRD Kota Tasikmalaya</a>.
                        </p>
                    </div>
                </div>

            </div>
        </div>
    </footer>

    <a href="#" onclick="topFunction()" id="back-to-top" class="btn btn-icon btn-primary back-to-top"><i
            data-feather="arrow-up" class="icons"></i></a>
@endsection