Contact form with bottom border only

Hi, Guys, hope this find you well.

I wanted to make the contact form to have the bottom border only. I think it’s nicer.

So I set up a contact form and selected Light Transparent color scheme.

I used this css:

#top div .av-light-form .input-text, #top div .av-light-form input[type=’text’], #top div .av-light-form input[type=’input’], #top div .av-light-form input[type=’password’], #top div .av-light-form input[type=’email’], #top div .av-light-form input[type=’number’], #top div .av-light-form input[type=’url’], #top div .av-light-form input[type=’tel’], #top div .av-light-form input[type=’search’], #top div .av-light-form textarea, #top div .av-light-form select {
border-top: none !important;
border-right: none !important;
border-left: none !important;
border-bottom: 1px solid #969696!important;
color: #969696!important;
font-size: 18px !important;
padding-bottom: 2px !important;
}

but if someone doesn’t fill one of the form fields (and they’re all required), he / she doesn’t get the colored border “warning” indicating that the field is required anymore.

How can I get the contact form to have only the bottom border and still show the “colored border warning indication” when someone doesn’t fill one of the required fields?

Thank You :D