body { background: #fff url(images/bg.jpg) 0 0 no-repeat; }
#login-wrapper {
    margin: -148px auto 20px -200px;
    position: absolute;
    top: 45%;
    left: 50%;
    text-align: center;
    filter: alpha(opacity=0);
}
#login {
    width: 400px;
    height: 268px;
    border: 5px #f4f4f4 solid;
    -webkit-border-radius: 15px;
    border-radius: 15px;
}
#login .shadow {
    position: absolute;
    width: 434px;
    z-index: -1;
    margin-top: 5px;
    background-image: url(images/login_shadow.png);
    background-size: contain;
    background-repeat: no-repeat;
    height: 33px;
    margin-left: -20px;
}
#login .inner {
    background: #fff;
    border: 1px #ccc solid;
    min-height: 258px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    position: relative;
}
#login .logo {
    width: 191px;
    height: 63px;
    margin: 18px auto 0 -95px;
    text-align: center;
    position: absolute;
    left: 50%;
    z-index: 11;
    background: transparent url(../images/logos/logo.svg) no-repeat;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader( src='../images/logos/logo.png', sizingMethod='scale');
}
.retina #login .logo { background-image: url(images/logo_login@2x.png); background-size: 191px 62px; }
#login .formLogin { padding: 100px 0 0 0; }
#login .formLogout { padding-top: 110px; }
#login hr { margin: 28px 0 33px; }
#login #ew_user,
#login #ew_pass {
    font-size: 15px;
    background: #fff 2px 3px no-repeat;
    text-align: center;
    margin: auto auto 10px auto;
    color: #999;
    width: 80%;
    font-family: "Myriad Pro", Arial, Helvetica, sans-serif;
    padding: 0 7px;
}
#login #ew_user:focus,
#login #ew_pass:focus { color: #000; }
#login #ew_user { background-image: url(images/input-user-bg.png); }
#login #ew_pass { background-image: url(images/input-pass-bg.png); }
#login .loginButton { width: 80%; padding: 0 5px; margin: 5px auto 20px auto; }
.btn-group { text-align: right; }
footer {
    background-color: #212121;
    position: fixed;
    width: 100%;
    bottom: 0;
    line-height: 35px;
    z-index: 11;
    -webkit-box-shadow: black 0 10px 10px -10px inset;
    -moz-box-shadow: black 0 10px 10px -10px inset;
    box-shadow: black 0 10px 10px -10px inset;
    padding: 10px;
}
footer p { text-align: center; font-size: 12px; margin-bottom: 0; line-height: 16px; }
.alert { width: 400px; padding: 8px; margin-bottom: 15px; }

/* Tablets */
@media (max-width: 768px) {
    #login-wrapper { margin-left: -150px; margin-top: -117px; }
    #login { height: 215px; }
    #login .inner { min-height: 205px; }
    #login,
    #login .shadow { width: 300px; }
    #login .shadow { margin-left: -6px; }
    #login .logo {
        width: 125px;
        height: 41px;
        background-image: url(../images/logos/logo.svg);
        filter: progid:DXImageTransform.Microsoft.AlphaImageLoader( src='../images/logos/logo.png', sizingMethod='scale');
        margin-left: -63px;
    }
    .retina #login .logo {
        background-image: url(../images/logos/logo.svg);
        filter: progid:DXImageTransform.Microsoft.AlphaImageLoader( src='../images/logos/logo.png', sizingMethod='scale');
        background-size: 125px 40px
    }
    #login .formLogin { padding-top: 75px; }
    #login .formLogout { padding-top: 86px; }
    #login button {
        padding: 5px 10px;
        font-size: 12px;
        line-height: 1.5;
        border-radius: 3px;
    }
    #login input {
        height: 30px;
        padding: 5px 10px;
        font-size: 12px;
        line-height: 1.5;
        border-radius: 3px;
    }
    #login #ew_pass,
    #login #ew_user { background-position: 0 1px; }
    footer p { font-size: 11px; }
    #login hr { margin: 26px 0 20px; }

}

@media (max-width: 400px) {
    footer { background-color: transparent; box-shadow: none; }
}
@media (max-height: 400px) {
    footer { background-color: transparent; box-shadow: none; }
}