@media(max-width:800px){#form{width:80%!important}}#form{background-color:#ccc;color:#111;display:flex;flex-direction:column;margin:0 auto;max-width:500px;padding:2vh;transition:.2s;width:50%}#form .form-field{margin-bottom:2vh;position:relative;width:100%}#form .form-field label{font-family:Roboto,Arial,Helvetica,sans-serif;pointer-events:none;position:absolute;transition:.2s}#form .form-field .required-message{color:red;font-size:2vh;font-weight:500;margin-left:1vh;transition:.2s}#form .form-field:last-of-type{margin-bottom:0}#form .form-field:focus-within label{font-size:1.8vh;font-weight:300;left:1vh;letter-spacing:.1vh;opacity:1;top:1vh}#form .form-field:focus-within .required-message{font-size:1.5vh;font-weight:300;letter-spacing:.2vh}#form input{background-color:#f7f7f7;border:1px solid #0000;box-sizing:border-box;font-family:Roboto Cn,Arial,Helvetica,sans-serif;font-size:2.5vh;margin:0;outline:0;padding:3.8vh 2vh 2vh;transition:.2s;width:100%}#form input:focus{background-color:#fff;box-shadow:0 0 50px #0001}#form input::-webkit-input-placeholder{opacity:0}#form input:-ms-input-placeholder{opacity:0}#form input::placeholder{opacity:0}#form input:-ms-input-placeholder~label{font-size:2.9vh;font-weight:500;left:3vh;opacity:.5;top:35%}#form input:placeholder-shown~label{font-size:2.9vh;font-weight:500;left:3vh;opacity:.5;top:35%}#form input:not(:-ms-input-placeholder)~label{font-size:1.8vh;font-weight:300;left:1vh;letter-spacing:.1vh;opacity:1;top:1vh}#form input:not(:placeholder-shown)~label{font-size:1.8vh;font-weight:300;left:1vh;letter-spacing:.1vh;opacity:1;top:1vh}#form input:not(:-ms-input-placeholder)~label .required-message{font-size:1.5vh;font-weight:300;letter-spacing:.2vh}#form input:not(:placeholder-shown)~label .required-message{font-size:1.5vh;font-weight:300;letter-spacing:.2vh}#form input[type=submit]{background-color:#111;color:#eee;cursor:pointer;font-family:Roboto,Arial,Helvetica,sans-serif;margin:2vh auto;padding:2vh;transition:.2s}#form input[type=submit]:hover{background-color:#222}@media(prefers-reduced-motion:reduce){*{transition-duration:0s!important}}#root,body,html{border:0;font-family:Roboto,Arial,Helvetica,sans-serif;font-size:16px;height:100%;margin:0;outline:0;padding:0;width:100%}body{background-color:#111;background-image:url(/hello-react-hook-form/static/media/circle.b2b89b17e1503494f5fc.svg);background-position:50%;background-repeat:no-repeat;background-size:cover}#root{align-items:center;display:flex;justify-content:center}h1{color:#eee;font-size:5vh;font-weight:900}a{color:#000;font-size:2vh;margin:0 auto;text-align:center;text-decoration:none;transition:.2s}a:hover{color:#111}.link{background-color:#333;color:#eee;display:flex;justify-content:center;margin:2vh 0;padding:1vh;text-decoration:none;transition:.2s;width:-moz-available}.link:hover{background-color:#222;color:#fff}
/*# sourceMappingURL=main.6b8763e6.css.map*/