html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}body{margin:auto;background:radial-gradient(circle,rgba(238,174,202,1) 0%,rgba(148,187,233,1) 100%);display:flex;justify-content:center;align-items:center;height:100vh}form{background-color:#fff;padding:10px 40px;border-radius:10px;-webkit-border-radius:10px;-moz-border-radius:10px;-ms-border-radius:10px;-o-border-radius:10px}h1{color:#4c00ff;text-align:center;margin:0}button{width:100%;height:40px;padding:10px;background-color:#4c00ff;color:#fff;font-size:18px;border:none;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;cursor:pointer;margin:10px 0}input,select{padding:10px;margin:10px 0;border-radius:5px;border:1px solid gray;background-color:#fff;-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px}label{color:#202020;padding-top:10px;font-size:1rem;font-weight:500}.formInput{display:flex;flex-direction:column;font-size:.6rem;width:230px}span{font-size:12px;padding:3px;color:red;display:none}input:invalid[focused=true]~span{display:block}input:invalid[focused=true]{border:1px solid red}.successful{background-color:#fff;padding:10px 50px;border-radius:10px;-webkit-border-radius:10px;-moz-border-radius:10px;-ms-border-radius:10px;-o-border-radius:10px}.success{font-size:2.5rem}p{font-size:18px}