@include('header')
<style>
    .col-lg-offset-1{margin-left: 5.333%;}
    .col-lg-6 {margin-left: 24px;}
</style>
<script type="text/javascript">

       $('document').ready(function()
    { 
            $("#register-form").validate({
                rules: {
                    name: "required",
                    Phone: "required",
                    email: {
                        required: true,
                        email: true
                    },
                    message: "required",
                },
                messages: {
                    firstname: "Please enter your name",
                    Phone: "Please enter your mobile number",
                    email: "Please enter a valid email address",
                    message: "please enter a message"
                },
                submitHandler: function(form) {
                    form.submit();
                }
            });  

});
</script>

            
<!-- content area -->
	<div class="container">
    	<h3>Contact Us</h3>
    	<div class="bordered-panel contact-us">
            	<section class="row">
           			
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                        <h3 class="text-black">Get In Touch</h3>
                        <form method="post" class="contact-form" action="contactusdata" role="form" id="register-form">
                                    <div class="form-group">
                                        <label class="sr-only">Name</label>
                                        <input type="text" class="form-control" placeholder="Your Name" name="name" required="">
                                    </div>
                                    <div class="form-group">
                                        <label class="sr-only">Phone</label>
                                        <input type="text" class="form-control" placeholder="Your Mobile" name="phone" required="">
                                    </div>
                                    <div class="form-group">
                                        <label class="sr-only">Email</label>
                                        <input type="email" class="form-control" placeholder="Your Email" name="email" required="">
                                    </div>
                                   
                                    <div class="form-group">
                                        <textarea class="form-control" placeholder="Your Message" rows="5" name="message" required=""></textarea>
                                    </div>
                                    @if(Session::has('message'))
                 <div class="form-group alert-box success">
                   {{ Session::get('message') }}
                 </div>
               @endif 
                                    <div class="form-group text-center">
                                        <input type="submit" class="btn btn-green" value="Submit" style="border-radius: 0px;">
                                    </div>
                                <div style="clear:both"></div>
                            </form>
                    </div>  
                    <div class="col-lg-5 col-lg-offset-1 col-md-6 col-sm-6 col-xs-12">
                        <div class="col-xs-12 nopadding">
                            <h3 class="text-black">Our Address</h3>
                            <div class="row">
                                <div class="col-md-1 col-sm-2 col-xs-2 large-font"><i class="fa fa-map-marker text-green"></i></div>
                                <div class="col-md-11 col-xs-10"><p>N 14/36, First Floor, DLF Phase 2,<br/> Gurgaon, Haryana, India, 122002</p></div>
                            </div>
                            <div class="row">
                                <div class="col-md-1 col-sm-2 col-xs-2 large-font"><i class="fa fa-phone text-green"></i></div>
                                <div class="col-md-11 col-xs-10"><p class="mtopbot6">+91-124-2561436</p></div>
                            </div>
                            <div class="row">
                                <div class="col-md-1 col-sm-2 col-xs-2 large-font"><i class="fa fa-envelope text-green"></i></div>
                                <div class="col-md-11 col-xs-10"><p class="mtopbot6">care@volaads.com</p></div>
                            </div>
                        </div>
                    </div>
                   	<div class="col-xs-12 nopadding">
                            <div class="embed-responsive embed-responsive-16by9">
                                
								<div style="overflow:hidden;width:100px;height:500px;resize:none;max-width:100%;"><div id="my-map-display" style="height:100%; width:100%;max-width:100%;"><iframe style="height:100%;width:100%;border:0;" frameborder="0" src="https://www.google.com/maps/embed/v1/place?q=Collectcent+Digital+Media+Private+Limited+N+14+/+36,+DLF+Phase+2,+Sector+25,+Shahpur++Haryana,+India,+122002&key=AIzaSyAN0om9mFmy1QN6Wf54tXAowK4eT0ZUPrU"></iframe></div><a class="google-map-html" href="https://www.bootstrapskins.com" id="get-data-for-map">bootstrap and css3</a><style>#my-map-display img{max-width:none!important;background:none!important;}</style></div><script src="https://www.bootstrapskins.com/google-maps-authorization.js?id=dffda3ef-08e9-6c08-134a-903570621db6&c=google-map-html&u=1448458699" defer="defer" async="async"></script>
                            </div>
                    </div>
                </section>
            </div>
    </div>
<!-- content area end -->  
   @include('footer')
            <!--footer end-->
<!--=========================================================code end================================================-->

    <!-- jQuery -->
    <script src="