<section class="contact_section layout_padding">
    <div class="container">
        <div class="heading_container">
            <h2>
                Get In Touch
            </h2>
        </div>
        <div class="row">
            <div class="col-md-6">
                <div class="form_container contact-form">
                    <form asp-controller="Home" asp-action="SendEmail" method="post">
                        <div class="form-row">
                            <div class="col-lg-6">
                                <div>
                                    <input name="name"  type="text" placeholder="Your Name" />
                                </div>
                            </div>
                            <div class="col-lg-6">
                                <div>
                                    <input name="phone" type="text" placeholder="Phone Number" />
                                </div>
                            </div>
                        </div>
                        <div>
                            <input name="email" type="email" placeholder="Email" />
                        </div>
                        <div>
                            <input name="message" type="text" class="message-box" placeholder="Message" />
                        </div>
                        <div class="btn_box">
                            <button>
                                SEND
                            </button>
                        </div>
                    </form>
                </div>
            </div>
            <div class="col-md-6">
                <div class="map_container">
                    <div class="map">
                        <div id="googleMap"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

@section Scripts
{
    <script>
        function myMap() {
            var mapProp = {
                center: new google.maps.LatLng(43.57473430240195, 27.829789255761067),
                zoom: 10,
            };
            var map = new google.maps.Map(document.getElementById("googleMap"), mapProp);
            var marker = new google.maps.Marker({
                position: map.getCenter(),
                animation: google.maps.Animation.BOUNCE,
                map: map,
                title: 'My Marker'
            });
        }
    </script>
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBgObTkj9zah1AobESvOmapwUT3USJNOaM&callback=myMap">
    </script>
}


