@extends('landing page.main')
@section('content')
    <!-- Page Title -->
    <div class="page-title-area">
        <div class="d-table">
            <div class="d-table-cell">
                <div class="container">
                    <div class="title-item">
                        <h2 class="text-wrap w-100">Kontak Kami</h2>
                        <ul>
                            <li>
                                <span>Kami siap membantu Anda. Silakan hubungi kami melalui informasi di bawah ini.</span>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- End Page Title -->

    {{-- Informasi Kontak --}}
    <section class="contact-info py-5">
        <div class="container">
            <div class="row">
                <div class="col-md-4 text-center">
                    <i class="fas fa-map-marker-alt fa-2x mb-3"></i>
                    <h4>Alamat</h4>
                    <p>Malang Creative Center, Jl. Ahmad Yani No.53, Blimbing, Kec. Blimbing, Kota Malang, Jawa Timur 65118
                    </p>
                </div>
                <div class="col-md-4 text-center">
                    <i class="fas fa-envelope fa-2x mb-3"></i>
                    <h4>Email</h4>
                    <p><a href="mailto:kerjasama.mcc@gmail.com">kerjasama.mcc@gmail.com</a></p>
                </div>
                <div class="col-md-4 text-center">
                    <i class="fas fa-phone-alt fa-2x mb-3"></i>
                    <h4>Telepon</h4>
                    <p><a href="tel:+62895423422252">0895423422252</a></p>
                </div>
            </div>
        </div>
    </section>

    {{-- Peta Lokasi Kantor
    <section class="map py-5">
        <div class="container">
            <h2 class="text-center mb-5">Lokasi Kantor Kami</h2>
            <div id="googleMap" style="width:100%;height:380px;"></div>
        </div>
    </section> --}}
@endsection

<!-- Menyisipkan library Google Maps dengan API Key Anda -->
<script src="http://maps.googleapis.com/maps/api/js"></script>

<script>
    // fungsi initialize untuk mempersiapkan peta
    function initialize() {
        var propertiPeta = {
            center: new google.maps.LatLng(-7.9403880933981945, 112.64246324504303),
            zoom: 9,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        var peta = new google.maps.Map(document.getElementById("googleMap"), propertiPeta);
    }

    // event jendela di-load  
    google.maps.event.addDomListener(window, 'load', initialize);
</script>