body { background: url(../img/sfondo.png); background-size: 100vw 100vh; padding: 0; margin: 0; width: 100vw; height: 100vh; overflow: hidden; }
body, input, button { font-family: Arial; font-size: 20pt; box-sizing: border-box; }
.error { background-color: #f00; color: #fff; padding: 4px; font-size: 12pt; }
.error:empty { display: none; }
form { width: 400px; height: fit-content; margin: auto; margin-top: 20vh; border-radius: 20px; background-color: rgba(255, 255, 255, 0.2); text-align: center; }
form div { margin: 5px; padding: 8px; }
label { display: inline-block; width: 100px; text-align: right; }
span { font-size: 12pt; color: #fff; }
input[type=text] { border: none; border-radius: 30px; background-color: #fff; font-size: 15pt; padding: 8px; width: 80%; }
input[type=password] { border: none; border-radius: 30px; background-color: #fff; font-size: 15pt; padding: 8px; width: 80%; }
input[type=number] { border: none; border-radius: 30px; background-color: #fff; font-size: 15pt; padding: 8px; width: 80%; }
input[type=checkbox] { accent-color: #fff; }
h4.hdr { margin: 0; padding-top: 50px; padding-bottom: 20px; text-align: center; font-weight: 900; }
#btn_accedi { width: 200px; height: 50px; background-color: #fdc423; color: #fff; margin-top: 20px; margin-bottom: 30px; border: none; border-radius: 30px; font-size: 16pt; }
#username { background-image: url(../img/utente.png); background-size: 34px; background-repeat: no-repeat; background-position: 7px 6px; padding-left: 50px; line-height: 30px; }
#password { background-image: url(../img/password.png); background-size: 34px; background-repeat: no-repeat; background-position: 7px 6px; padding-left: 50px; line-height: 30px; }
#otp { background-image: url(../img/otp.png); background-size: 34px; background-repeat: no-repeat; background-position: 7px 6px; padding-left: 50px; line-height: 30px; }
input::placeholder { font-size: 12pt; } 
textarea:focus, input:focus { outline: none; }
