#login{padding:0;}
#login>.row{background-image: url(/css/images/login_bg.jpg); background-size: cover; min-height:100vh; height:100%;}
#login .login-card{background:transparent !important;}

#login .logo-inside-container {display:block; text-align: center; margin:-10px 0 0 0; padding-bottom:20px;}
#login .logo-inside-container img{height:60px;}
#login .logo-outside-container{display:none;}
#login .bg-size {background: transparent url(/css/images/pulse-login-bg.jpg) left center / cover no-repeat;}
#login .show-hide {position: absolute; right: 20px; top: 9px; transform:none;}
#login button i {margin-right: 10px; display: none;}
#login button.disabled i{display:inline-block;}

@media (min-width: 1200px){
    .logo-outside-container {display:block; text-align: center; padding-bottom:20px;}
    .logo-outside-container img{height:80px;}
    .logo-inside-container{display:none;}
    #login .bg-size {clip-path: polygon(0 0, 95% 0, 100% 100%, 0 100%);}
}

.login-card {
    align-items: center;
    background: url(/css/images/login_bg.jpg);
    background-position: 50%;
    display: flex;
    justify-content: center;
    margin: 0 auto;
    min-height: 100vh;
    padding: 30px 12px;
}
.login-card .login-main {
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 0 37px rgba(8, 21, 66, .05);
    margin: 0 auto;
    padding: 40px;
    width: 450px;
}