@charset "utf-8";
/* CSS Document */
form {
  margin-left: auto;
  margin-right: auto;
  width: 30em;
  padding-top: 3em;
  position: relative;
}
input {
  margin: 0 0 1em 31%;
  padding: 0.2em 0.5em;
  width: 60%;
  background-color: #fffbf0;
  border: 2px solid blue;
}
select {
  margin: 0 0 1em 31%;
  padding: 0.2em 0.5em;
  width: 60%;
  background-color: #fffbf0;
  border: 2px solid blue;
}

label {
  text-align: right;
  line-height: 1.5;
  width: 30%;
  position: absolute;
  left: 0;
  font-size: 1.266em;
}
textarea {
  margin: 0 0 1em 31%;
  padding: 0.2em 0.5em;
  width: 60%;
  background-color: #fffbf0;
  border: 2px solid blue;
}
label::after {
  content: ": ";
}
button {
  margin-left: 37%;
  cursor: pointer;
  margin-top: 10px;
  margin-bottom: 20px;
  background-color: #7fff55;
  transform: scale(1.5);
}
button:hover {
  background-color: #f00;
}
input:required + label::before {
  position: absolute;
  left: 300%;
  content: "★";
  color: red;
}
textarea:required + label::before {
  position: absolute;
  left: 300%;
  content: "★";
  color: red;
}
input:required:valid + label::before {
  content: "✔";
  color: green;
}
textarea:required:valid + label::before {
  content: "✔";
  color: green;
}