body { background: #222D32; } html{ height: 100vh; } body{ background: url('https://static.toiimg.com/photo/msid-77035949/77035949.jpg?999700'); background-size: cover; background-repeat: no-repeat; font-family: sans-serif; font-family: 'Roboto', sans-serif; } .login-box { margin-top: 75px; height: auto; background: rgba(10,13,15,0.8); text-align: center; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23); } .login-key { height: 100px; font-size: 80px; line-height: 100px; background: -webkit-linear-gradient(#27EF9F, #0DB8DE); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .login-title { margin-top: 15px; text-align: center; font-size: 30px; letter-spacing: 2px; margin-top: 15px; font-weight: bold; color: #ECF0F5; } .login-form { margin-top: 25px; text-align: left; } input[type=text] { background-color: #1A2226; border: none; border-bottom: 2px solid #0DB8DE; border-top: 0px; border-radius: 0px; font-weight: bold; outline: 0; margin-bottom: 20px; padding-left: 0px; color: #ECF0F5; } input[type=password] { background-color: #1A2226; border: none; border-bottom: 2px solid #0DB8DE; border-top: 0px; border-radius: 0px; font-weight: bold; outline: 0; padding-left: 0px; margin-bottom: 20px; color: #ECF0F5; } .form-group { margin-bottom: 40px; outline: 0px; } .form-control:focus { border-color: inherit; -webkit-box-shadow: none; box-shadow: none; border-bottom: 2px solid #0DB8DE; outline: 0; background-color: #1A2226; color: #ECF0F5; } input:focus { outline: none; box-shadow: 0 0 0; } label { margin-bottom: 0px; } .form-control-label { font-size: 10px; color: #6C6C6C; font-weight: bold; letter-spacing: 1px; } .btn-outline-primary { border-color: #0DB8DE; color: #0DB8DE; border-radius: 0px; font-weight: bold; letter-spacing: 1px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); } .btn-outline-primary:hover { background-color: #0DB8DE; right: 0px; } .login-btm { float: left; } .login-button { padding-right: 0px; text-align: right; margin-bottom: 25px; } .login-text { text-align: left; padding-left: 0px; color: #A2A4A4; } .loginbttm { padding: 0px; }