{% extends 'base.html.twig' %}

{% block preloader %}{% endblock %}

{% block title %}Contactanos!{% endblock %}

{% block body %}


    <div id="contactanos" class="pb-5">
        <div class="container">

            <h2 class="my-4 text-primary">
                <i class="fas fa-phone-square" aria-hidden="true"></i>
                Contactanos
            </h2>

            <div class="row">

                <div class="mb-3 col-md-6">
                    <div id="contactanos-mensaje" class="card wow fadeInUp">
                        <div class="card-body">
                            <p>Estamos aquí para responder cualquier duda que tengas.
                            <br/>
                            Solo tienes contactarte con nosotros a cualquiera de nuestros correos y nos pondremos en contacto contigo tan rapido como nos sea posible.
                            <br/>
                            Tambien puedes llamarnos a los numeros telefonicos y te atenderemos personalmente.
                            </p>
                        </div>
                    </div>
                </div>

                <div class="mb-3 col-md-3">
                    <div class="card wow fadeInUp">
                        <div class="card-header bg-primary text-white text-center">
                            <strong><i class="fas fa-envelope-square" aria-hidden="true"></i> Correos</strong>
                        </div>
                        <ul class="list-group list-group-flush">

                             {% set correos = ['gestion@netnexo.cl', 'soporte@netnexo.cl', 'ventas@netnexo.cl'] %}

                            {% for correo in correos %}
                                <li class="list-group-item" >
                                    <div class="text-center text-primary">
                                        <div>
                                            <a href="mailto:{{ correo }}">{{ correo }}</a>
                                        </div>
                                    </div>
                                </li>
                            {% endfor %}
                        </ul>
                    </div>
                </div>

                <div class="mb-3 col-md-3 wow fadeInUp">
                    <div class="card">
                        <div class="card-header bg-primary text-white text-center">
                            <strong><i class="fas fa-phone-square" aria-hidden="true"></i> Tel&eacute;fonos</strong>
                        </div>
                        <ul class="list-group list-group-flush">

                             {% set tlfnoMostrar = ['+56 2 3253 2448', '+56 9 9583 7717', '+56 2 3253 2448'] %}
                             {% set tlfnoLink = ['+ 56232532448', '+56995837717', '+56232532448'] %}

                            {% for index, tlfnoM in tlfnoMostrar %}
                                <li class="list-group-item" >
                                    <div class="text-center text-primary">
                                        <div>
                                            <a href="tel:{{ tlfnoLink[index] }}">{{ tlfnoM }}</a>
                                        </div>
                                    </div>
                                </li>
                            {% endfor %}
                        </ul>
                    </div>
                </div>


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


{% endblock %}