{% extends 'layout.html' %}
{% load static %}
{% block EnTeteHtml %}
<style>
    body {
        background: url({% static 'assets/media/error/bg5.jpg' %});
        background-size:cover;
        background-repeat:no-repeat;
		text-align: center;
    }

</style>
{% endblock %}

{% block contenu %}
<div class=""row>
    <div class="col-xl-4">
            <!--begin::Engage Widget 7-->
            <div class="card card-custom card-stretch gutter-b">
                <div class="card-body d-flex p-0">
                    <div class="flex-grow-1 p-12 card-rounded bgi-no-repeat d-flex flex-column justify-content-center align-items-center" style="background-color: #4AB58E; background-position: right bottom; background-size: auto 100%; background-image: url()">
                        <h3 class="text-white font-weight-bolder m-0">Accès interdit.</h3>
                        <p class="text-white my-5 font-size-xl font-weight-bold">Vous ne pouvez pas accéder à cette page.
                            <br>Veuillez d'abord vous connecter ou créér un compte.</p>
                        <div class="row justify-content-between">
                            <a href="{% url 'login' %}" class="btn btn-fixed-height btn-white btn-hover-primary font-weight-bold px-2 px-lg-5 mr-2">Connexion</a>
                            <a href="{% url 'register' %}" class="btn btn-fixed-height btn-white btn-hover-primary font-weight-bold px-2 px-lg-5 mr-2">Inscription</a>
                        </div>

                    </div>
                </div>
            </div>
            <!--end::Engage Widget 7-->
        </div>
</div>

{% endblock %}