Перевірка заповнення форм на html5 + стилі

lt;h1gt; Вхід / Реєстраціяlt;/h1gt;lt;pgt; Дані форми можна використовувати для реєстрації або входу на сайт.lt;/pgt;lt;h2gt; Логінlt;/h2gt;lt;form action="" autocomplete="Off"gt;lt;label for="Username"gt; Ім`я користувачаlt;/labelgt;lt;input id="Username" name="Username" pattern="[A-zA-Z0-9] {5,}" title="Мінімум 5 букв або цифр" required=""gt;lt;label for="Password"gt; Парольlt;/labelgt;lt;input id="Password" name="Password" pattern=". {5,}" title="Мінімум 5 букв або цифр" required="" type="Password"gt;lt;pgt; lt;input class="Btn" value="Вхід" type="Submit"gt; lt;/pgt;lt;/formgt;lt;h2gt; Реєстраціяlt;/h2gt;lt;form action="" autocomplete="Off"gt;lt;label for="Username2"gt; Ім`я користувачаlt;/labelgt;lt;input id="Username2" name="Username" pattern="[A-zA-Z0-9] {5,}" title="Мінімум 5 букв або цифр" required=""gt;lt;label for="Password2"gt; Парольlt;/labelgt;lt;input id="Password2" name="Password" pattern=". {5,}" title="Мінімум 5 букв або цифр" required="" type="Password"gt;lt;label for="Email"gt; E-maillt;/labelgt;lt;input id="Email" name="Email" required="" type="Email"gt;lt;label for="Url"gt; Ваш сайтlt;/labelgt;lt;input id="Url" name="Url" type="Url"gt;lt;pgt; lt;input class="Btn" value="Реєстрація" type="Submit"gt; lt;/pgt;lt;/formgt;

gt;input: required {border-style:solid-border-width:thick-}input: valid {background-color: # adff2f-}input: invalid {background-color: # f08080-}gt;