{% extends "app_elecciones/base.html" %}
{% load static %}
{% load widget_tweaks %}

{% block cabecera %}

<nav class="navbar navbar-expand-lg navbar-light bg-light">

    <div class="container">

        <div class="row align-items-center">
            <div class="col-3">
                <a href="/lista_mesas"> <img class="img-fluid" src="{% static 'img/elecciones/logoelecciones.png' %}" alt="logo"> </a>
            </div>
            
            <div class="col-6">
                <p style="text-align: center; color: #333333; font-weight: bold; font-size: .85em;">Elecciones Municipales</p>
                <p style="text-align: center; color: #333333; font-weight: bold;">Yepes</p>

            </div>
            <div class="col-3">
                <img class="img-fluid" src="{% static 'img/elecciones/pptomas.png' %}" alt="logo Tomás">
            </div>
        </div>
    </div>

</nav>
            
{% endblock cabecera %}

{% block contenido %}

<div class="container">

    <div class="row align-items-center" style="margin-top: 3em;">
        <div class="col-6" style="text-align: center;">
            <a href="/mesa/m11a"><img class="img-fluid" src="{% static 'img/elecciones/mesa11a.png' %}" alt="Mesa 11 A" style="width: 40%;"></a>
        </div>
        <div class="col-6" style="text-align: center;">
            <a href="/mesa/m11b"><img class="img-fluid" src="{% static 'img/elecciones/mesa11b.png' %}" alt="Mesa 11 B" style="width: 40%;"></a>
        </div>
    </div>
    <div class="row align-items-center" style="margin-top: 2em;">
        <div class="col-6" style="text-align: center;">
            <a href="/mesa/m12a"><img class="img-fluid" src="{% static 'img/elecciones/mesa12a.png' %}" alt="Mesa 12 A" style="width: 40%;"></a>
        </div>
        <div class="col-6" style="text-align: center;">
            <a href="/mesa/m12b"><img class="img-fluid" src="{% static 'img/elecciones/mesa12b.png' %}" alt="Mesa 12 B" style="width: 40%;"></a>
        </div>
    </div>
    <div class="row align-items-center" style="margin-top: 2em;">
        <div class="col-6" style="text-align: center;">
            <a href="/mesa/m22a"><img class="img-fluid" src="{% static 'img/elecciones/mesa22a.png' %}" alt="Mesa 22 A" style="width: 40%;"></a>
        </div>
        <div class="col-6" style="text-align: center;">
            <a href="/mesa/m22b"><img class="img-fluid" src="{% static 'img/elecciones/mesa22b.png' %}" alt="Mesa 22 B" style="width: 40%;"></a>
        </div>
    </div>
    <div class="row align-items-center" style="margin-top: 2em;">
        <div class="col-6" style="text-align: center;">
            <a href="/mesa/m21u"><img class="img-fluid" src="{% static 'img/elecciones/mesa21u.png' %}" alt="Mesa 21 U" style="width: 40%;"></a>
        </div>
        <div class="col-6" style="text-align: center;">
            <a href="/resultados"><img class="img-fluid" src="{% static 'img/elecciones/resultados.png' %}" alt="Resultados" style="width: 40%;"></a>
        </div>
    </div>
</div>

{% endblock contenido %}