.content {
text-align: center;
border: 1px solid #e1e1e1;
display:block;max-width:400px;margin:0 auto;padding:25px;background:#f9f9f9;border-radius:15px;
}
label {
font-family:'Roboto', sans-serif;
font-size:16px;
font-weight:lighter;
}
h1 {
font-family:'Roboto', sans-serif;
font-size:30px;
font-weight:lighter;
margin-top: 0px;
}
input {
border:1px solid #e1e1e1;
padding:10px;
width: 250px;
}
input[type="color" i] {
width: 125px;
height: 50px;
background-color: buttonface;
cursor: default;
border-image: initial;
padding: 2px 4px;
border-radius:5px;
}

input[type="submit" i] {
text-transform:uppercase;
font-size:12px;
font-weight:bolder;
letter-spacing:2px;
background:#000000;
color:#ffffff;
padding: 15px 10px 15px 10px;
border-radius: 5px;
}

input:invalid:required:focus {
  border: 2px solid red;
}

input:valid:required {
  border: none;
}