body{background:url(../images/login/login-new.jpg);background-position:50%;background-repeat:no-repeat;background-size:cover;height:100vh;width:100vw}body main{height:100%}body main .wrapper{align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;height:100%}body main .wrapper .login>img{display:block;height:105px;margin-bottom:15px}body main .wrapper .login>.container{background:#fff;border-radius:8px;box-shadow:0 4px 205.4px 0 hsla(215,8%,55%,.58);padding:25px;width:500px}body main .wrapper .login>.container>strong{color:var(--button-primary-color);display:block;font-family:Inter SemiBold,sans-serif;font-size:24px;font-weight:600;margin-bottom:20px}body main .wrapper .login>.container>p{font-size:16px;margin-bottom:20px}body main .wrapper .login>.container form{display:-webkit-box;display:-ms-flexbox;display:flex;flex-direction:column}body main .wrapper .login>.container form .input-container{margin-bottom:10px;position:relative;width:100%}body main .wrapper .login>.container form .input-container.mac>img.password{right:45px}body main .wrapper .login>.container form .input-container>img{height:20px;left:10px;position:absolute;top:50%;transform:translateY(-50%);width:20px}body main .wrapper .login>.container form .input-container>img.password{cursor:pointer;display:none;height:25px;left:unset;right:15px;width:25px}body main .wrapper .login>.container form .input-container>img.password.show{display:block}body main .wrapper .login>.container form .input-container>label{left:40px;position:absolute;top:50%;transform:translateY(-50%)}body main .wrapper .login>.container form .input-container input{background:#fff;border:1px solid #abb6c5;border-radius:8px;font-size:16px;padding:16px 15px 16px 40px;width:100%}body main .wrapper .login>.container form .input-container input:not(:-moz-placeholder)~span.placeholder{color:#828282;font-size:11px;top:10px}body main .wrapper .login>.container form .input-container input:focus~span.placeholder,body main .wrapper .login>.container form .input-container input:not(:placeholder-shown)~span.placeholder{color:#828282;font-size:11px;top:10px}body main .wrapper .login>.container form .input-container input::-moz-placeholder{color:transparent;pointer-events:none}body main .wrapper .login>.container form .input-container input::placeholder{color:transparent;pointer-events:none}body main .wrapper .login>.container form .input-container span.placeholder{color:#abb6c5;font-family:Segoe Regular,sans-serif;font-size:16px;left:40px;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);transition:.25s}body main .wrapper .login>.container form .bot{justify-content:space-between;margin-top:20px}body main .wrapper .login>.container form .bot,body main .wrapper .login>.container form .bot .remember{align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex}body main .wrapper .login>.container form .bot .remember input{accent-color:var(--button-primary-color);border-radius:4px;box-sizing:border-box;display:inline-block;height:16px;margin-right:5px;transform:translateZ(0);vertical-align:middle;width:16px}body main .wrapper .login>.container form .bot .remember label{font-size:15px}body main .wrapper .login>.container form .bot>a{color:var(--secondary-color)}body main .wrapper .login>.container form button.btn-login{background:var(--button-primary-color);border:0;border-radius:8px;color:#fff;cursor:pointer;font-size:16px;height:50px;margin-top:40px;padding:10px;transition:.25s;width:100%}body main .wrapper .login>.container form button.btn-login:hover{background:#a52a2b}body main .wrapper .login .copyright{font-size:14px;margin-top:20px}
