.login-container {
    width: 375px;
    margin: 0 auto
}

.login-layout label,
.ui-jqdialog-content .searchFilter .queryresult {
    margin-bottom: 11px
}

.login-layout {
    background-color: #1D2024
}

.login-layout .main-container:before {
    display: none
}

.login-layout .main-content {
    margin-left: 0 !important;
    margin-right: 0 !important;
    min-height: 100%;
    padding-left: 15px;
    padding-right: 15px
}

.login-layout .widget-box {
    visibility: hidden;
    position: fixed;
    z-index: -5;
    border-bottom: none;
    box-shadow: none;
    padding: 6px;
    background-color: #394557;
    -moz-transform: scale(0, 1) translate(-150px);
    -webkit-transform: scale(0, 1) translate(-150px);
    -o-transform: scale(0, 1) translate(-150px);
    -ms-transform: scale(0, 1) translate(-150px);
    transform: scale(0, 1) translate(-150px)
}

.login-layout .widget-box.visible {
    visibility: visible;
    position: relative;
    z-index: auto;
    -moz-transform: scale(1, 1) translate(0);
    -webkit-transform: scale(1, 1) translate(0);
    -o-transform: scale(1, 1) translate(0);
    -ms-transform: scale(1, 1) translate(0);
    transform: scale(1, 1) translate(0);
    transition: transform .3s ease;
    -moz-transition: -moz-transform .3s ease;
    -webkit-transition: -webkit-transform .3s ease;
    -o-transition: -o-transform .2s ease
}

.login-layout .widget-box .widget-main {
    padding: 16px 36px 36px;
    background: #F7F7F7
}

.login-layout .widget-box .widget-main form {
    margin: 0
}

.login-layout .widget-box .widget-body .toolbar > div > a {
    font-size: 15px;
    font-weight: 400;
    text-shadow: 1px 0 1px rgba(0, 0, 0, .25)
}

.login-box .forgot-password-link {
    color: #337ab7;
    text-decoration: none;
}

.login-box .user-signup-link {
    color: #CF7
}

.login-box .toolbar {
    background: #5090C1;
    border-top: 2px solid #597597
}

.login-box .toolbar > div {
    width: 50%;
    display: inline-block;
    padding: 9px 0 11px
}

.login-box .toolbar > div:first-child {
    float: left;
    text-align: left
}

.login-box .toolbar > div:first-child > a {
    margin-left: 11px
}

.login-box .toolbar > div:first-child + div {
    float: right;
    text-align: right
}

.login-box .toolbar > div:first-child + div > a {
    margin-right: 11px
}

.forgot-box .toolbar {
    background: #C16050;
    border-top: 2px solid #976559;
    padding: 9px 18px
}

.signup-box .toolbar {
    background: #76B774;
    border-top: 2px solid #759759;
    padding: 9px 18px
}

.forgot-box .back-to-login-link,
.signup-box .back-to-login-link {
    color: #FE9;
    font-size: 14px;
    font-weight: 700;
    text-shadow: 1px 0 1px rgba(0, 0, 0, .25)
}

.login-layout .login-box .widget-main {
    padding-bottom: 16px
}

.social-or-login {
    margin-top: 4px;
    text-align: center;
    position: relative;
    z-index: 1
}

.social-or-login :first-child {
    display: inline-block;
    background: #F7F7F7;
    padding: 0 8px;
    color: #5090C1;
    font-size: 13px
}

.social-or-login:before {
    display: block;
    position: absolute;
    z-index: -1;
    top: 50%;
    left: 0;
    right: 0;
    border-top: 1px dotted #A6C4DB
}

.social-login a {
    border-radius: 100%;
    width: 42px;
    height: 42px;
    line-height: 46px;
    padding: 0;
    margin: 0 1px;
    border-width: 0
}

.social-login a > .ace-icon {
    font-size: 24px;
    margin: 0
}

@media only screen and (max-width:540px) {
    .login-layout .widget-box .widget-main {
        padding: 16px
    }

    .login-container {
        width: 98%
    }

    .login-layout .widget-box {
        padding: 0
    }

    .login-layout .main-content {
        padding-left: 6px;
        padding-right: 6px
    }

    .login-box .toolbar > div {
        width: auto
    }
}

.light-login {
    background: url(/images/pattern.jpg) #DFE0E2
}

.light-login .widget-box {
    padding: 1px 1px 0;
    -webkit-box-shadow: 0 0 2px 1px rgba(0, 0, 0, .12);
    box-shadow: 0 0 2px 1px rgba(0, 0, 0, .12);
    border-bottom: 1px solid rgba(50, 50, 50, .33)
}

.light-login .widget-box .toolbar {
    border-top-width: 1px
}

.light-login .widget-box.login-box {
    background-color: #BCC6CF;
    background-color: rgba(100, 110, 120, .4)
}

.light-login .widget-box.signup-box {
    background-color: #C1CEC4;
    background-color: rgba(110, 120, 100, .4)
}

.light-login .widget-box.forgot-box {
    background-color: #D2C5C5;
    background-color: rgba(120, 110, 100, .4)
}

.blur-login {
    background: url(images/meteorshower2.jpg) #394557
}