.demo-container{
  position: relative;
  width: 100%;
  margin:0 auto;
  padding: 20px;
  border: 5px dashed #e2e2e2; 
}
.demo-container input {
  display: block;
  width: 50%;
  height: 2em;
}

.demo-container input[type="number"] {
  width: auto;
}

.demo-container input:valid {
  background-color: lightgreen;
}

.demo-container input:invalid {
  background-color: tomato;
}

.demo-container input:valid:focus {
  outline: 0;
  border: none;
  box-shadow: 0 0 3px 6px rgba(0, 200, 0, 0.3);
}