body{ overflow: hidden; } .page-secure-login{ display: flex; } .bg-picture-secure-login{ width: calc(100vw - 450px); height: 100vh; position: absolute; left: 0px; top: 0px; } .bg-picture-secure-login img{ width: 100%; height: 100vh; object-fit: cover; } .bg-secure-login{ display: flex; width: 100vw; max-width: 450px; height: 100vh; background-color: #fff; position: absolute; right: 0px; top: 0px; align-items: center; padding: 30px; } .bg-secure-login-form > h1{ color: #000 !important; font-size: 32px; } .bg-secure-login-form input[type=password], .bg-secure-login-form input[type=text]{ padding: 5px; width: 100%; max-width: 300px; border-top: none !important; border-left: none !important; border-right: none !important; font-size: 16px; border-bottom: 1px solid #000 !important; border-radius: 0px !important; } .divShowPw:not(#lastDivShowPw) { margin-bottom: 20px; } .bg-secure-login-form input[type=password]:focus, .bg-secure-login-form input[type=text]:focus{ outline: none; border-bottom: 1px solid #000 !important; } .bg-secure-login-form input[type=password]::placeholder, .bg-secure-login-form input[type=text]::placeholder { color: #ccc !important; } .bg-secure-login-form input[type=submit]{ background-color: #fff !important; padding: 10px 20px !important; margin-top: 25px !important; border: 1px solid #000 !important; color: #000 !important; transition: all 0.3s ease-out !important; border-radius: 0px !important; } body { color: #000 !important; } * { box-sizing: border-box; } .bg-secure-login-form input[type=submit]:hover{ background-color: #000 !important; color: #fff !important; } .bg-secure-login-form > p{ margin-bottom: 30px; } .seclog_home_link{ position: fixed; z-index: 1000; top: 30px; right: 30px; } .divShowPw { margin-top: 10px; position: relative; display: inline-block; width: 100%; max-width: 300px; } .togglePassword { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); background: none; border: none; cursor: pointer; transition: all 0.5s ease; } .togglePassword:hover { transform: translateY(-50%) scale(1.15); } input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active { -webkit-box-shadow: 0 0 0 1000px #ffffff inset !important; box-shadow: 0 0 0 1000px #ffffff inset !important; -webkit-text-fill-color: #000000 !important; transition: background-color 5000s ease-in-out 0s; }