.contact-form-wrapper {
  
  margin: 0 auto 20px auto;
  border: solid 2px black;
  border-radius: 10px;

}

.contact-form input {
  width: 100%;
  
  display: inline-block;
  margin: 0 0 4px 0;
  border: 1px solid #101010;
}

.contact-form input:focus {
  background-color: lightyellow;
}

.contact-form input:hover {
  background-color: lightyellow;
}

.contact-form {
  width: 100%; 
  padding: 10px;  
  font-size: .9em;    
  box-sizing: border-box;
}

.contact-form::after {
  display: block;
}

.contact-form input, select, textarea {
  font-size: inherit;
  padding: 8px;
  margin: 3px 0;
}


.contact-form textarea {  
  border: 1px solid black;
  width: calc(100%);
  resize: none;
  font-size: inherit;
  
}

.contact-form textarea:focus {
  background-color: lightyellow;
}

.contact-form textarea:hover {
  background-color: lightyellow;
}

.contact-form button {
  display: block;
  float: right;
  height: 30px;
  width: 70px;
  background-color: #999;
  border-radius: 10px;
}

.contact-form button:hover {  
  width: 75px;
  transition: .2s;
}

.contact-form p {
  display: inline-block;
  width: 100%;
  text-align: center;
  padding: 0;
  margin: 10px 0;
  font-weight: bold;
}

.resultMessage {
  border-radius:5px;
  padding: 5px;
  font-size: 1em;
  line-height: 1em;
  background-color: rgb(199, 222, 236);  
}
.success {
  color: rgb(61, 61, 221);  
}

.failure {
  color: rgb(194, 29, 29); 
   
}