.form-box{position:relative;width:400px;height:450px;background:transparent;border:2px solid rgba(255,255,255,.5);border-radius:20px;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);display:flex;justify-content:center;align-items:center;}.inputbox{position:relative;margin:30px 0;width:310px;border-bottom:2px solid #fff;}input:focus ~ label,input:valid ~ label{top:-5px;}.inputbox input{width:100%;height:50px;background:transparent;border:none;outline:none;font-size:1em;padding:0 35px 0 5px;color:#fff;}.form-value label{color:#fff;font-size:1em;pointer-events:none;transition:.5s;padding-top:3px;padding-left:1px;}.form-value2 label{color:#fff;font-size:1em;pointer-events:none;transition:.5s;padding-top:2px;padding-left:15px;}*{margin:0;padding:0;font-family:'poppins',sans-serif;}.section-bg-overlay{width:100%;height:100vh;background-position:center;background-size:cover;background-color:rgba(55,178,217,.5);display:flex;justify-content:center;align-items:center;align-content:center;color:white;}#loginform{display:flex;justify-content:center;align-items:center;min-height:60vh;width:100%;background:url('../img/plein-coup-personnes-nettoyant-bureau.webp')no-repeat;background-position:center;background-size:cover;}button{width:100%;height:40px;border-radius:40px;background:#424a8e;border:none;outline:none;cursor:pointer;font-size:1em;font-weight:600;color:#ffffff;}.forget{margin:-15px 0 15px;font-size:.9em;color:#fff;display:flex;justify-content:space-between;}.forget label input{margin-right:3px;}.forget label a{color:#fff;text-decoration:none;}.forget label a:hover{text-decoration:underline;}.register{font-size:.9em;color:#fff;text-align:center;margin:25px 0 10px;}.register p a{text-decoration:none;color:#fff;font-weight:600;}.register p a:hover{text-decoration:underline;}