{% extends 'django_spire/page/full_page.html' %}

{% load static %}

{% block page_content %}

    <div class="row justify-content-center pt-lg-4 pt-3">
        <div class="col-12">
            <div class="row justify-content-center bg-pt-4" style="z-index: -1">
                <div id="particles-js" class="col-12"></div>
            </div>
        </div>

        <div class="row mt-3 mb-3 align-content-center justify-content-center" style="height: 400px;">
            <div class="col-11 col-md-8 col-lg-6 mt-0 mt-lg-3">

                <div class="col-12 position-relative align-content-center text-app-primary"
                     style="height: auto; width: auto">
                    <div class="h1 text-center text-appear pb-5 word"
                         style="font-family: Hero, sans-serif; letter-spacing: 2px">
                        403: Access Denied
                    </div>
                    <div class="h5 text-center text-appear-second text-app-secondary pb-5">
                        You do not have the required permissions to access this page.
                    </div>
                
                    <div class="text-center text-appear-second position-relative">
                        {% url 'example:home' as home_url %}
                        {% include 'django_spire/button/primary_button.html' with button_text='Back to Home' button_href=home_url %}
                    </div>
                </div>
            </div>
        </div>
    </div>

{% endblock %}
