Several times I've seen this attribute or property (I do not know exactly how to rate it), but I still do not realize:
h4, .texto{
color:white !important;
text-align: center;
font-size: 40px;
}It serves to override the css already assigned to the element, Example:
.corAzul{
background-color: blue !important;
}
.corVerde{
background-color: green;
}<input type="text" style="background-color:red;" class="corAzul"/>
<input type="text" style="background-color:red;" class="corVerde"/>As you can see in the example I have the classes corAzul and corVerde being blue as important and green not and inline I put to be red, In input1 it brings blue and in green it considers inline, So since you have both styles equal to the same element with ! Important you tell the browser which one to consider.