.pupil-login-wrapper form input,.pupil-login-wrapper form label{position:relative;display:inline-block;width:100%}.pupil-login-wrapper form input[type=password],.pupil-login-wrapper form input[type=text]{font-size:1.25em;padding:10px;margin-bottom:.5em;border:2px solid #000;border-radius:10px;background-color:#fff}.pupil-login-wrapper form label{margin:0 auto;padding:5px;transition:all .5s ease-in-out;z-index:1;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-left:5px}.pupil-login-wrapper form label svg{height:1rem;position:relative;top:2px}.pupil-login-wrapper form input[type=submit]{cursor:pointer;margin:1.33em auto;width:100%;padding:10px 0;border:1px solid #000}.pupil-login-wrapper form #password-eye-learnerSignIn{width:20px;height:20px;position:absolute;right:12px;bottom:calc(.5em + 10px);background-size:20px;background-color:transparent;border:none;padding:0;cursor:pointer;z-index:2}.pupil-login-wrapper form #password-eye-learnerSignIn.eye-open{opacity:.7;background-image:url(https://images.twinkl.co.uk/tr/raw/upload/t/images/eye-icons/eye.png)}.pupil-login-wrapper form #password-eye-learnerSignIn.eye-close{background-image:url(https://images.twinkl.co.uk/tr/raw/upload/t/images/eye-icons/eye-slash.png)}.pupil-login-wrapper form .login-extra-manage a{color:#fff!important}.pupil-login-wrapper .field{margin-top:-20px;position:relative}.pupil-login-wrapper .filled label{top:0;font-size:.8em;color:#fff}.pupil-login-wrapper .filled label img{display:none}.pupil-login-wrapper .placeholder-input:focus~.placeholder-label,.pupil-login-wrapper .placeholder-input:valid~.placeholder-label{top:-1.5em;left:0;font-size:.8em;color:inherit;cursor:pointer;opacity:0}.pupil-login-wrapper #pupil-full-login-form{width:360px;border:3px solid #fff;background-color:#005b94}@media (max-width:375px){.pupil-login-wrapper #pupil-full-login-form{width:100%}}.pupil-login-page #learner-header{background-color:#005b94}@media (max-width:470px){.pupil-login-page #learner-header .twinkl-logo{height:70px}}@media (max-width:320px){.pupil-login-page #learner-header .twinkl-logo{height:60px}}.pupil-login-page .pupil-login-wrapper{background-color:#d8edff}.pupil-login-page .pupil-login-wrapper .login-submit-btn{border:3px solid #fff}.pupil-login-page #user-signed-in-modal{position:fixed;inset:0;background-color:rgba(0,0,0,.5);z-index:1000}.pupil-login-page #user-signed-in-modal .modal-container{background-color:#fff;width:768px;margin:24px}.pupil-login-page #user-signed-in-modal .content-section{display:-ms-flexbox;display:flex;padding:32px 40px 0 40px;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:flex-start;gap:24px;-ms-flex-item-align:stretch;align-self:stretch}.pupil-login-page #user-signed-in-modal #modal-description,.pupil-login-page #user-signed-in-modal #modal-title,.pupil-login-page #user-signed-in-modal .modal-actions .button{font-family:robotoregular,Arial,Helvetica,sans-serif}.pupil-login-page #user-signed-in-modal .modal-close-btn{top:0;right:0;width:2rem;height:2rem;padding:0;line-height:1;border-radius:8px;border:1px solid #c5cad3;background:#fff}.pupil-login-page #user-signed-in-modal .modal-close-btn:focus,.pupil-login-page #user-signed-in-modal .modal-close-btn:hover{color:#000;border-radius:8px;border:1px solid #0a2e4b;background:#fff}.pupil-login-page #user-signed-in-modal .modal-actions{display:-ms-flexbox;display:flex;padding:24px 40px 40px 40px;-ms-flex-pack:end;justify-content:flex-end;-ms-flex-align:start;align-items:flex-start;gap:12px;-ms-flex-item-align:stretch;align-self:stretch}.pupil-login-page #user-signed-in-modal .modal-actions .button{opacity:1;border-radius:.75rem;padding-top:.75rem;padding-right:1rem;padding-bottom:.75rem;padding-left:1rem;gap:.375rem;font-size:1rem}.pupil-login-page #user-signed-in-modal .modal-actions .modal-outline-btn{color:#0a2e4b;text-align:center;border-radius:12px;border:1px solid #c5cad3;background:#fff}.pupil-login-page #user-signed-in-modal .modal-actions .modal-outline-btn:focus,.pupil-login-page #user-signed-in-modal .modal-actions .modal-outline-btn:hover{border:1px solid #0a2e4b}