{% load staticfiles %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>IsOnzeInternAlDronken.nl ~ {{ city }}</title>
    {% if not debug %}
    <!-- Piwik -->
    <script type="text/javascript">
        var _paq = _paq || [];
        _paq.push(["setDocumentTitle", document.domain + "/" + document.title]);
        _paq.push(["setCookieDomain", "*.isonzeinterndronken.nl"]);
        _paq.push(['trackPageView']);
        _paq.push(['enableLinkTracking']);
        (function () {
            var u = "//piwik.kuro.network/";
            _paq.push(['setTrackerUrl', u + 'piwik.php']);
            _paq.push(['setSiteId', '5']);
            var d = document, g = d.createElement('script'), s = d.getElementsByTagName('script')[0];
            g.type = 'text/javascript';
            g.async = true;
            g.defer = true;
            g.src = u + 'piwik.js';
            s.parentNode.insertBefore(g, s);
        })();
    </script>
    <!-- End Piwik Code -->
    {% endif %}
    <style type="text/css">
        html {
            background: url("{% static "background2.jpg" %}");

        }

        html, body {
            height: 90%;
            font-family: OpenSans, Verdana, sans-serif;
        }

        div {
            text-align: center;
            top: 50%;
            position: relative;
            transform: translateY(-50%);
        }

        h1 {
            font-size: 60px;
            padding-top: 30px;
        }

        h2 {
            font-size: 40px;
            padding: 0px;
            margin: 0px;
        }

        h3 {
            font-size: 30px;
            padding: 0px;
            margin: 0px;
        }

        table {
            width: 100%;
        }

        .line {
            margin-top: 2em;
            margin-bottom: 2em;

        }
    </style>
</head>
<body>
<div>
    <a href="{% url 'dronken:city_list' %}">
        <button>Back</button>
    </a>
    <h2>Welke vereniging bedoel je?</h2>
    <hr class="line"/>
    <table align="center">
        <tbody>
        {% for association in object_list %}
            <tr>
                <td><b><a href="{% url 'dronken:association' association.city.slug association.slug %}">{{ association|safe }}</a></b></td>
                <td><b>{% if association.has_intern %}{{ association.state|upper }}{% else %}{{ association.short_name|safe|upper }} HEEFT GEEN INTERN!{% endif %}</b></td>
            </tr>
        {% empty %}
            <tr><td><h4>{{ city.name }} heeft helemaal geen verenigingen!</h4></td></tr>
        {% endfor %}
        </tbody>
    </table>
    <hr class="line"/>
    <p>Wil jij ook jouw vereniging/stad hier? Stuur een mailtje naar commissie[at]isonzeinterndronken.nl</p>
</div>
</body>
</html>