.inputeo {
  display: flex;
  flex-direction: column;
  background-color: transparent;
  border-radius: 4px 4px 0px 0px;
  transition: 0.1s ease;
  box-sizing: border-box;
  position: relative;
  margin-bottom: 20px;
}

.inputeo::after {
  content: '';
  width: 100%;
  height: 1px;
  bottom: 0px;
  left: 0px;
  background-color: #c8d2dc;
  position: absolute;
  transition: 0.1s ease;
}

.inputeo label {
  font-size: 13px;
  margin: 7px 15px 0px 15px;
  transition: 0.1s ease;
  color: rgb(100, 110, 120);
}

.inputeo input, .inputeo select, .inputeo textarea {
  border: none;
  background-color: transparent;
  outline: none;
  padding: 5px 15px 8px 15px;
  font-size: 16px;
  font-family: century-gothic;
  color: rgb(0, 10, 20);
  width: 100%;
  box-sizing: border-box;
}

.inputeo textarea {
  padding: 10px 15px;
  resize: none;
  min-height: 150px;
}

.inputeo input::placeholder, .inputeo textarea::placeholder {
  font-family: centhury-gothic;
  color: rgb(80, 90, 100);
}

.inputeo select {
  padding-left: 10px;
}

.inputeo select optgroup {
  font-size: 14px;
}

.inputeo select option {
  font-size: 14px;
}

.inputeo input:-webkit-autofill,
.inputeo input:-webkit-autofill:hover,
.inputeo input:-webkit-autofill:focus,
.inputeo input:-webkit-autofill:active {
  transition: background-color 5000s ease-in-out 0s;
}

.inputeo:focus-within::after {
  height: 2px;
  background-color: #3199CC;
}

.inputeo:focus-within label {
  color: #3199CC;
}