.login-bg { width: 100%; height: 100%; background: url(<%=image_path('rademade_admin/backgrounds/blueish.jpg')%>) no-repeat center center fixed; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='<%=image_path('rademade_admin/backgrounds/blueish.jpg')%>', sizingMethod='scale'); -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='<%=image_path('rademade_admin/backgrounds/blueish.jpg')%>', sizingMethod='scale')"; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .login-wrapper { position: absolute; top: 90px; left: 0; right: 0; text-align: center; .logo { margin-bottom: 45px; position: relative; left: -2px; } .box { margin: 0 auto; padding: 35px 0 30px; float: none; width: 400px; box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.1); border-radius: 5px; background: rgba(255, 255, 255, 0.65); .content-wrap { width: 82%; margin: 0 auto; } h6 { text-transform: uppercase; margin: 0 0 30px 0; font-size: 18px; font-weight: 600; font-family: 'Open Sans', sans-serif; } input[type="text"], input[type="password"]{ font-size: 15px; height: 40px; margin-bottom: 18px; border-color: #b2bfc7; padding-left: 12px; &:focus { border:1px solid #28a0e5;outline:none; -webkit-box-shadow:inset 0 1px 2px #ddd,0px 0 5px #28a0e5; -moz-box-shadow:inset 0 1px 2px #ddd,0px 0 5px #28a0e5; -ms-box-shadow:inset 0 1px 2px #ddd,0px 0 5px #28a0e5; -o-box-shadow:inset 0 1px 2px #ddd,0px 0 5px #28a0e5; box-shadow:inset 0 1px 2px #ddd,0px 0 5px #28a0e5 } } input[type="password"] { margin-bottom: 10px; } input:-moz-placeholder { color: rgb(155, 168, 182); font-size: 15px; letter-spacing: 0px; font-style: italic; } input:-ms-input-placeholder{ color: rgb(155, 168, 182); font-style: italic; letter-spacing: 0px; font-size: 15px; } input::-webkit-input-placeholder{ color: rgb(155, 168, 182); font-style: italic; letter-spacing: 0px; font-size: 15px; } .button_action { margin-top: 20px; } a.forgot{ display: block; text-align: right; font-style: italic; text-decoration: underline; color: #3d88ba; font-size: 13px; margin-bottom: 6px; } .remember { display: block; overflow: hidden; margin-bottom: 20px; input[type="checkbox"] { float: left; margin-right: 8px; } label { float: left; color: #4a576a; font-size: 13px; font-weight: 600; } } .login { text-transform: uppercase; font-size: 13px; padding: 8px 30px; } } } /* responsive */ @media (max-width: 767px) { .login-wrapper .box{ width: 350px; } } @media (max-width: 480px) { .login-wrapper .box { width: 90%; } }