:root{--login-panel-width:100%;--login-panel-max-width:420px;--login-panel-shift:0;--login-logo-offset-right:10%;--login-logo-height:42vh}a,h1{color:var(--color-blauw);text-decoration:none;transition:color .3s}a:hover{color:var(--color-blauw-darker)}.form-wrapper{display:none}.form-wrapper.active{display:block}label.error{color:var(--color-rood);font-size:.875em}.invalid-feedback{padding-left:5px}.form-control.error,.form-control.error:focus{border-color:var(--color-rood)}.form-control.error{box-shadow:inset 0 1px 1px rgba(0,0,0,.075)}.login-layout{min-height:100vh;display:grid;grid-template-columns:1fr 1fr 1fr}.login-spacer-left{background-color:#fff}.login-main{background-color:#fff;display:flex;align-items:center;padding:2rem}.login-panel-wrap{width:100%;display:flex;justify-content:center;transform:translateX(var(--login-panel-xshift)) translateY(var(--login-panel-yshift))}.login-panel{width:var(--login-panel-width);max-width:var(--login-panel-max-width)}.login-side{position:relative;background-color:var(--color-blauw);overflow:hidden}.login-logo{width:calc(var(--login-panel-max-width) - 2rem);max-width:calc(100vw - 3rem);position:fixed;margin-top:-100px}.login-side-logo{position:absolute;right:var(--login-logo-offset-right);bottom:0;height:var(--login-logo-height);width:auto;max-width:80%;object-fit:contain;pointer-events:none;user-select:none;filter:opacity(.15)}@media (min-width:1400px){:root{--login-panel-max-width:375px;--login-panel-xshift:-4%;--login-panel-yshift:-15%}}@media (min-width:1800px){:root{--login-panel-max-width:425px;--login-panel-xshift:-8%}}@media (max-width:1400px){.login-layout{grid-template-columns:1fr 2fr 1fr}:root{--login-panel-max-width:300px;--login-panel-xshift:0}}@media (max-width:992px){.login-layout{grid-template-columns:3fr 4fr 3fr}:root{--login-logo-height:36vh}}@media (max-width:768px){.login-layout{grid-template-columns:1fr}.login-side,.login-spacer-left{display:none}.login-main{min-height:100vh;padding:1.5rem}.login-panel-wrap{justify-content:center;transform:none}:root{--login-panel-max-width:300px}}.login-layout .form-control:not(.form-control-sm):not(.form-control-lg){font-size:1rem;letter-spacing:1px;color:var(--color-blauw)}.password-wrapper .form-control.is-invalid,.password-wrapper .form-control.is-valid,.password-wrapper .was-validated .form-control:invalid,.password-wrapper .was-validated .form-control:valid{background-image:none}.password-wrapper .field-icon{font-size:18px;right:45px;margin-top:-30px;opacity:.6;transition:opacity .3s}.password-wrapper .field-icon:hover{opacity:.85}#forgot-pass-form .form-control{font-size:.95rem}