How to display error message with Django forms?

I would like to customize the Django login authentication form. The original form looks like this and it works perfectly:

{% extends "blog/base.html" %}
{% load crispy_forms_tags %}
{% block content %}
<div class="content-section">
    <form method="POST">
        {% csrf_token %}
        <fieldset class="form-group">
            <legend class="border-bottom mb-4 ">Log In</legend>   
            {{ form|crispy }}
        </fieldset>
        <div class="form-group">
            <button class="btn btn-outline-info" type="submit">Login</button>
        </div>
    </form>
    <div class="border-top pt-3">
        <small class="text-muted">
            Need An Account? <a class="ml-2" href="{% url 'register' %}">Sign Up Now</a>
        </small>
    </div>
</div>
{% endblock content %}

My goal is to modify the form style so that I can place the objects wherever I want. I was able to achieve this for the username and password fields, however I cannot display the error message just like in the original format.

This is what I tried:

{% extends "blog/base.html" %}
{% load crispy_forms_tags %}
{% block content %}
<div class="content-section">
    <form method="POST">
        {% csrf_token %}
        <fieldset class="form-group">
            <legend class="border-bottom mb-4 ">Log In</legend>
            {% if formset.non_form_errors %}
            <div class="alert alert-block alert-danger">
                {% if formset_error_title %}<h4 class="alert-heading">{{ formset_error_title }}</h4>{% endif %}
                <ul class="m-0">
                    {{ formset.non_form_errors|unordered_list }}
                </ul>
            </div>
            {% endif %}
            <div class="row">
                <div class="col-md-4 col-sm-12 register-field">
                    {{ form.username|as_crispy_field }}
                </div>
                <div class="col-sm-12 register-field">
                    {{ form.password|as_crispy_field }}
                </div>
            </div>
        </fieldset>
        <div class="form-group">
            <button class="btn btn-outline-info" type="submit">Login</button>
        </div>
    </form>
    <div class="border-top pt-3">
        <small class="text-muted">
            Need An Account? <a class="ml-2" href="{% url 'register' %}">Sign Up Now</a>
        </small>
    </div>
</div>
{% endblock content %}

Basically I saw that crispy uses a object called formset.non_form_errorshowever it looks like it is not working when I insert an invalid username/password.

Would you be able to suggest a smart and elegant way to achieve my goal please? This is what it should look like:

{% extends "blog/base.html" %}
{% load crispy_forms_tags %}
{% block content %}
<div class="content-section">
    <form method="POST">
        {% csrf_token %}
        <fieldset class="form-group">
            <legend class="border-bottom mb-4 ">Log In</legend>
            <div class="row">
                <!-- Added this new rows -->
                {% if form.errors %}
                <div class="col-12 register-field">
                    <div class="alert alert-block alert-danger">
                        <ul>
                            <li>Please enter a correct username and password. Note that both fields may be
                                case-sensitive.
                            </li>
                        </ul>
                    </div>
                </div>
                {% endif %}
                <!-- ------------------- -->
                <div class="col-md-4 col-sm-12 register-field">
                    {{ form.username|as_crispy_field }}
                </div>
                <div class="col-sm-12 register-field">
                    {{ form.password|as_crispy_field }}
                </div>
            </div>
        </fieldset>
        <div class="form-group">
            <button class="btn btn-outline-info" type="submit">Login</button>
        </div>
    </form>
    <div class="border-top pt-3">
        <small class="text-muted">
            Need An Account? <a class="ml-2" href="{% url 'register' %}">Sign Up Now</a>
        </small>
    </div>
</div>
{% endblock content %}