:root {
  --form-txt-size: 18px;
  --form-fg: rgb(203, 203, 203);
  --form-ph-fg: rgb(178, 178, 178);
  --form-bg: rgb(45, 45, 45);
  --form-input-bg:rgb(71, 71, 71);
  --form-width:500px;
}

.form-wrapper {
  max-width: var(--form-width);
  border-radius: 5px;
  background-color: var(--form-bg);
  padding: 15px;
  margin-left: auto;
  margin-right: auto;
}

.form-body {
  display: grid;
  grid-template-columns: max-content minmax(0px,1fr);
  row-gap: 15px;
  column-gap: 10px;
  align-items: center;
}

form input,
form label,
form textarea {
  font-size: var(--form-txt-size);
  color: var(--form-fg);
}

form label {
  display: inline-block;
}

form label[for=message]{
  margin-top: 5px;
  align-self: flex-start;
}

form input,
form textarea {
  padding: 8px;
  border-radius: 3px;
  border: 1px solid gray;
  background-color: var(--form-input-bg);
  border: none;
  outline: none;
}

form input::placeholder,
form textarea::placeholder{
  color: var(--form-ph-fg);
}

form textarea {
  min-height: 100px;
  resize: none;
}

.form-foot{
  margin-top: 10px;
  text-align: end;
}

.form-foot button{
  padding: 5px;
  border-radius: 5px;
  font-size: var(--form-txt-size);
  background-color: rgb(122, 122, 122);
  color: white;
  border: 1px solid gray;
  width: 80px;
}


.form-body > input:-webkit-autofill,
.form-body > input:-webkit-autofill:hover, 
.form-body > input:-webkit-autofill:focus{
	-webkit-text-fill-color: var(--form-fg);
	transition: background-color 5000s ease-in-out 0s;
}