I can’t figure out what CSS i need to add to change the color of the fields when they are selected, have characters entered in them

You’re looking for the ‘focus’ selector.
For instance to change the background to red & the border to blue, try:

div.wpforms-container-full .wpforms-form input:focus {
    background: red;
    border-color: blue;
}

And try this to change the styles on error:

div.wpforms-container-full .wpforms-form .wpforms-field input:focus.wpforms-error {
    background: pink;
    border-color: yellow;
}

Also any ideas about the hover color for the test and background of the button?

Also any ideas about the hover color for the test and background of the button?

Which button?

 div.wpforms-container-full .wpforms-form button[type=submit]:hover {
     background: pink;
     border-color: yellow;
 }

Right i now have it set to a black background. For some reason when i type the first character in the e-mail field it goes red and blue then if i click out of the field and then back into the field this is when it goes black?

Any ideas?

.form-group.has-error.is-focused .form-control {
    background-image: -webkit-gradient(linear, left top, left bottom, from(#f44336), to(#f44336)), -webkit-gradient(linear, left top, left bottom, from(#d2d2d2), to(#d2d2d2));
    background-image: -webkit-linear-gradient(#f44336, #f44336), -webkit-linear-gradient(#d2d2d2, #d2d2d2);
    background-image: linear-gradient(#f44336, #f44336), linear-gradient(#d2d2d2, #d2d2d2);
}

So it looks like you need to change the background there, e.g.:

.form-group.has-error.is-focused .form-control {
    background: blue;
}

That must have been why i was getting to confused about this one as i was trying to change this with the above selectors yesterday… just not the over parts you mentioned earlier today.

Also… was there any CSS that changes the color of a filed entered correctly?

Thanks so much for the help!!!

Also… was there any CSS that changes the color of a filed entered correctly?

Try:

body div.wpforms-container-full .wpforms-form .wpforms-valid {
    background: green;
}

I found this one awkward as when inspecting it was tricky to get the code to stay appeared while clicking around the page etc. You got any tips for this to make it easier in the future?

Thanks,

Harvey