{% extends "django_custom_error_views/base.html" %}
{% load static %}
{% block content %}
    <div class="container mx-auto max-w-7xl grid justify-items-center">
        <img class="mt-5"
             style="max-height: 500px"
             src="{% static image|default:'django_custom_error_views/visual-400.jpg' %}"
             alt="Error image">
        <p class="font-bold text-3xl">{{ title|default:"Error, bad request." }}</p>
        <p class="mt-5 max-w-3xl text-center">
            {{ description|default:"This ia a malformed or illegal request.  You can find loads to explore on the home page." }}
        </p>
        <p class="mt-2 max-w-3xl text-center">{{ extra_content }}</p>
        {% if exception and render_exception %}
            <p class="mt-2 max-w-3xl text-center">The following exception was raised: {{ exception }}</p>
        {% endif %}
        <a class="mt-5 rounded bg-blue-600 px-2 py-1 text-md font-semibold text-white shadow-sm hover:bg-blue-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-600"
           href="/">Return Home</a>
    </div>
{% endblock %}