Customize non form errors with django crispy form -

i customize way django crispy shows non form error. know how change text, don't know change css.

this image: my login area

forms.py

class loginform(forms.form):     alphanumeric = regexvalidator(r'^[0-9a-za-z]*$', 'only alphanumeric characters allowed.')     username = forms.charfield(label='', required=true, widget=forms.textinput(attrs={'placeholder': 'username'}))     password = forms.charfield(label='', required=true, widget=forms.passwordinput(attrs={'placeholder': 'password'}))     name = forms.charfield(label='',                          required=true ,                           validators=[alphanumeric],                          widget=forms.textinput(attrs={'placeholder': 'name'}))       def clean(self):         username = self.cleaned_data.get('username')         password = self.cleaned_data.get('password')         user = authenticate(username=username, password=password)         if not user or not user.is_active:             raise forms.validationerror('invalid login : want change css')         return self.cleaned_data      def login(self, request):         username = self.cleaned_data.get('username')         password = self.cleaned_data.get('password')         user = authenticate(username=username, password=password)         return user 

template - html

<form method="post" action="">{% csrf_token %}     <!--{% if  form.non_field_errors %}         testing     {% endif %}-->     {{form|crispy}}     <div class="form-info">         <label class="hvr-sweep-to-right">             <input class="create btn"  type="submit" value="submit">         </label>     </div> </form> 

i assume use crispy forms bootstrap (depending on style image).

so can overwrite original bootstrap classes

.alert {   padding: 0.75rem 1.25rem;   margin-bottom: 1rem;   border: 1px solid transparent;   border-radius: 0.25rem; }  .alert-danger {   background-color: #f2dede;   border-color: #ebcccc;   color: #a94442; }  .alert-danger hr {   border-top-color: #e4b9b9; }  .alert-danger .alert-link {   color: #843534; } 

or other alert classes e.g. alert-success.

if don't want overwrite these classes whole project set div around crispy forms

<div class"crispyform">   {{form|crispy}} </div> 

and write in custom css s.th. like

.crispyform .alert {   # new style }