@extends('layouts.new.template')

@section('content')
    <!--Start breadcrumb area paroller-->
    <section class="breadcrumb-area">
        <div class="breadcrumb-area-bg" style="background-image: url(assets/images/breadcrumb/breadcrumb-1.jpg);">
        </div>
        <div class="container">
            <div class="row">
                <div class="col-xl-12">
                    <div class="inner-content">
                        <div class="title" data-aos="fade-down" data-aos-easing="linear" data-aos-duration="1500">
                            <h2>Contactanos</h2>
                        </div>
                        <div class="breadcrumb-menu" data-aos="fade-up" data-aos-easing="linear" data-aos-duration="1500">
                            <ul>
                                <li><a href="index.html">Inicio</a></li>
                                <li><i class="fa fa-angle-right" aria-hidden="true"></i></li>
                                <li class="active">Contacto</li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!--End breadcrumb area-->

    <!--Start Contact Info Area-->
    <section class="contact-info-area">
        <div class="container">
            <div class="row">
                <!--Start Single Contact Info Box-->
                <div class="col-xl-4 col-lg-12">
                    <div class="single-contact-info-box">
                        <div class="icon">
                            <span class="flaticon-pin-1"></span>
                        </div>
                        <div class="text-holder">
                            <div class="pattern-bg" style="background-image: url(assets/images/pattern/thm-pattern-3.png);">
                            </div>
                            <div class="top">
                                <h3>Visita nuestra oficina</h3>
                                <span>Estás cordialmente invitado a visitar nuestra oficina.</span>
                            </div>
                            <p> Calle Flor de Hortensia #12 Col. El Zapote del Valle 45672 Tlajomulco de Zúñiga, Jal.</p>
                        </div>
                    </div>
                </div>
                <!--End Single Contact Info Box-->

                <!--Start Single Contact Info Box-->
                <div class="col-xl-4 col-lg-12">
                    <div class="single-contact-info-box">
                        <div class="icon">
                            <span class="flaticon-phone-call-3"></span>
                        </div>
                        <div class="text-holder">
                            <div class="pattern-bg" style="background-image: url(assets/images/pattern/thm-pattern-3.png);">
                            </div>
                            <div class="top">
                                <h3>Llámanos</h3>
                                <span>Siempre mejor conectado.</span>
                            </div>
                            <p class="text1">
                                Teléfono: <a href="tel:3336961049" >33-3696 1049</a>

                            </p>
                        </div>
                    </div>
                </div>
                <!--End Single Contact Info Box-->

                <!--Start Single Contact Info Box-->
                <div class="col-xl-4 col-lg-12">
                    <div class="single-contact-info-box">
                        <div class="icon">
                            <span class="flaticon-email-1"></span>
                        </div>
                        <div class="text-holder">
                            <div class="pattern-bg" style="background-image: url(assets/images/pattern/thm-pattern-3.png);">
                            </div>
                            <div class="top">
                                <h3>Envianos un correo</h3>
                                <span>envianos un correo y te responderemos lo antes posible.</span>
                            </div>
                            <p class="text1">
                              
                                Correo: <a href="mailto:info@ecores.com.mx">info@ecores.com.mx</a>
                            </p>
                        </div>
                    </div>
                </div>
                <!--End Single Contact Info Box-->

            </div>
        </div>
    </section>
    <!--End Contact Info Area-->


    <!--Start Main Contact Form Area-->
    <section class="main-contact-form-area">
        <div class="container">
            <div class="row">

                <div class="col-xl-6">
                    <div class="contact-page-map-outer">
                        <!--Map Canvas-->
                        <div class="map-canvas" data-zoom="16" data-lat="20.5105015" data-lng="-103.3009874"
                            data-type="roadmap" data-hue="#ffc400" data-title="ECORES"
                            data-icon-path="{{asset('new/images/icon/map-marker.png')}}"
                            data-content="Calle Flor de Hortensia #12<br><a href='mailto:info@ecores.com.mx'>info@ecores.com.mx</a>">
                        </div>
                    </div>
                </div>

                <div class="col-xl-6">
                    <div class="contact-style1_form">
                        <div class="top-title">
                            <h2>Deja tu Mensaje</h2>
                            <p>No dudes en ponerte en contacto utilizando el formulario a continuación. Nos encantaría saber
                                de ti.</p>
                        </div>
                        <div class="contact-form">
                            <form id="contact-form" name="contact_form" class="default-form2"
                                action={{route('contact.post')}} method="post">
                                @csrf
                                <div class="row">
                                    <div class="col-xl-6 col-lg-6">
                                        <div class="input-box">
                                            <input type="text" name="form_name" value=""
                                                placeholder="Nombre Completo :" required="">
                                        </div>
                                    </div>
                                    <div class="col-xl-6 col-lg-6">
                                        <div class="input-box">
                                            <input type="email" name="form_email" value=""
                                                placeholder="Correo eléctronico :" required="">
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-xl-6 col-lg-6">
                                        <div class="input-box">
                                            <input type="text" name="form_phone" value="" placeholder="Teléfono :">
                                        </div>
                                    </div>
                                    <div class="col-xl-6 col-lg-6">
                                        <div class="input-box">
                                            <input type="text" name="form_subject" value=""
                                                placeholder="Asunto :">
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-xl-12 text-center">
                                        <div class="input-box">
                                            <div class="select-box">
                                                <select class="wide" name="form_product">
                                                    <option data-display="Producto">Productos</option>
                                                    <option value="1">ECORES Imper</option>
                                                    <option value="2">ECORES Decor</option>
                                                    <option value="3">ECORES Malt</option>
                                                    <option value="4">ECORES Plast</option>
                                                    <option value="5">ECORES Color</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-xl-12 text-center">
                                        <div class="input-box two">
                                            <textarea name="form_message" placeholder="Escribe tu mensaje" required></textarea>
                                        </div>
                                        <div class="button-box">

                                            <button class="btn-one" type="submit">
                                                <span class="txt">Enviar Mensaje</span>
                                            </button>
                                        </div>
                                    </div>
                                </div>

                            </form>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </section>
    <!--End Main Contact Form Area-->
@endsection