input, textarea {
  border: 2px solid;
  border-radius: 4px;
  font-size: 1rem;
  margin: 0.25rem;
  min-width: 125px;
  padding: 0.5rem;
  transition: border-color 0.5s ease-out;
}
input:optional, textarea:optional {
  border-color: gray;
}
input:required:valid, textarea:required:valid {
  border-color: green;
}
input:invalid, textarea:invalid {
  border-color: red;
}
input:required:focus:valid, textarea:required:focus:valid {
  background: url("../images/thumbs-up.svg") no-repeat 95% 50% lightgreen;
  background-size: 25px;
}
input:focus:invalid, textarea:focus:invalid {
  background: url("../images/exclamation-triangle.svg") no-repeat 95% 50% lightsalmon;
  background-size: 25px;
}

.error-message {
  display: block;
  color: red;
  padding-left: 20px;
  font-size: 16px;
  font-weight: 400;
}