/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * 
 *
 * MoonCake v1.3.1 - Login Stylesheet
 *
 * This file is part of MoonCake, an Admin template build for sale at ThemeForest.
 * For questions, suggestions or support request, please mail me at maimairel@yahoo.com
 *
 * Development Started:
 * July 28, 2012
 * Last Update:
 * December 07, 2012
 *
 */

/* Body
================================================== */

body
{
    /*background: #fff url(images/layout/bg/white_tiles.png);*/
    color: #444;
    padding: 100px 0;
}

/* Login Wrap
================================================== */

#login-wrap
{
    width: 278px;

    background: #f2f2f2 repeat-x left bottom;
    background-image: -ms-linear-gradient(top, #fafafa, #f2f2f2);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fafafa), to(#f2f2f2));
    background-image: -webkit-linear-gradient(top, #fafafa, #f2f2f2);
    background-image: -o-linear-gradient(top, #fafafa, #f2f2f2);
    background-image: -moz-linear-gradient(top, #fafafa, #f2f2f2);
    background-image: linear-gradient(top, #fafafa, #f2f2f2);

    margin: auto;
    position: relative;
    border: 1px solid #ccc;
    padding: 15px;
    padding-top: 60px;

    -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);

    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

/* Login Buttons
================================================== */

#login-buttons
{
    position: absolute;
    top: 9px;
    left: 15px; right: 15px;
    z-index: 5;
    text-align: center;
}

#login-buttons .btn-wrap
{
    border: 1px solid #ddd;
    padding: 3px;
    display: inline-block;
    margin: 0 2px;
    *display: inline;
 /* IE7 inline-block hack */
    *zoom: 1;

    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

#login-buttons .btn-wrap.disabled
{
    opacity: 0.5;
    -moz-opacity: 0.5;
    filter: alpha(opacity=50);
}

#login-buttons .btn-wrap .btn
{
    margin: 0;
    padding: 4px;
    text-shadow: none !important;
}

#login-buttons .btn-wrap .btn [class^="icon-"]
{
    font-size: 21px;
    line-height: 24px;
    width: 24px;
    height: 24px;
    color: #444;
}

#login-buttons .btn-wrap .btn:hover [class^="icon-"]
{
    color: #666;
}

/* Login Inner
================================================== */

.login-inset
{
    overflow: hidden;
    border: 1px solid #ccc;
    background-color: #fff;

    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

/* Login Inner Forms
================================================== */

#login-inner #login-circle .login-inner-form
{
    width: 278px;
    position: relative;
    display: none;
    left: 50%;
    margin-left: -140px;
}

#login-inner #login-circle .login-inner-form.active
{
    display: block;
}

#login-circle .login-inner-form h1
{
    font-size: 18px;
    margin: 0 0 10px 4px;
    padding: 0 15px;
}

#login-circle .login-inner-form .control-group
{
    padding: 0 15px 15px 15px;
    margin: 0;
}

#login-inner #login-circle .login-inner-form .control-group .controls
{
    position: relative;
}

#login-circle .login-inner-form .form-actions
{
    padding: 0 15px;
    margin: 0;
    background-color: transparent;
    border: none;
}

#login-inner #login-circle .login-inner-form .control-group-merged
{
    margin-bottom: 15px;
    position: relative;
}

#login-inner #login-circle .login-inner-form .control-group-merged .control-group
{
    padding: 0;
    margin: 0 15px;
    position: relative;
}

/* Login Errors
================================================== */

#login-inner #login-circle .login-inner-form label.error
{
    position: absolute;
    z-index: 10;
    margin: 0;
    right: 4px; top: -20px;
    font-size: 11px;
    line-height: 16px;
    color: #fff;
    padding: 4px 8px;
    background-color: #cc2828;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

#login-inner #login-circle .login-inner-form label.error:after
{
    content: '';
    display: block;
    position: absolute;
    border: 5px solid transparent;
    border-top-color: #cc2828;
    right: 10px;
    bottom: -10px;
}

/* Login Inputs
================================================== */

#login-circle .login-inner-form input[type="text"], 
#login-circle .login-inner-form input[type="password"], 
#login-circle .login-inner-form textarea, 
#login-circle .login-inner-form select
{
    margin: 0;
    min-height: 28px;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

#login-circle .login-inner-form input:focus, 
#login-circle .login-inner-form textarea:focus
{
    border-color: #ccc;
    outline: none;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

#login-circle .login-inner-form input#input-username, 
#login-circle .login-inner-form input#input-password
{
    background-repeat: no-repeat;
    background-position: 6px center;
    padding-left: 28px;
}

#login-circle .login-inner-form input#input-username
{
    background-image: url(images/icons/led/src/user.png);
}

#login-circle .login-inner-form input#input-password
{
    background-image: url(images/icons/led/src/key.png);
}

/* Login Big Inputs
================================================== */

#login-circle .login-inner-form input.big
{
    min-height: 48px;
    margin: 0;
    outline: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

#login-inner #login-circle .login-inner-form .control-group-merged .control-group + .control-group
{
    margin-top: -1px;
}

#login-inner #login-circle .login-inner-form .control-group-merged .control-group:first-child input.big
{
    -webkit-border-radius: 6px 6px 0 0;
    -moz-border-radius: 6px 6px 0 0;
    border-radius: 6px 6px 0 0;
}

#login-inner #login-circle .login-inner-form .control-group-merged .control-group:last-child input.big
{
    -webkit-border-radius: 0 0 6px 6px;
    -moz-border-radius: 0 0 6px 6px;
    border-radius: 0 0 6px 6px;
}

/* Login Social
================================================== */

#login-social
{
    padding: 15px;
    margin-top: 15px;
}

#login-social .zocial
{
    display: block;
    width: 100%;
    font-size: 12px;
}

#login-social .zocial + .zocial
{
    margin-top: 10px;
}

/* Form Elements
================================================== */

label
{
    cursor: pointer;
}

.select2-container[class*="span"]
{
    float: none;
    margin-left: 0;
    min-height: 0;
}

.radio .ibutton-container, 
.checkbox .ibutton-container
{
    margin-left: -18px;
    vertical-align: middle;
}

.radio .uniform-radio, 
.checkbox .uniform-checker
{
    float: left;
    margin-left: -18px;
}

.radio .uniform-radio input[type="radio"], 
.checkbox .uniform-checker input[type="checkbox"]
{
    float: none;
    margin: 0;
}

/* Button
================================================== */

/* Default Button
================================================== */

.btn
{
    border-color: #bfbfbf;
}

.btn [class^="icon-"]
{
    font-size: 14px;
}

.btn-large .caret
{
    margin-top: 8px;
}

/* Primary Button
================================================== */

.btn-primary
{
    border-color: #2453a3;
    background-image: -ms-linear-gradient(top, #2c74de, #2964c7);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#2c74de), to(#2964c7));
    background-image: -webkit-linear-gradient(top, #2c74de, #2964c7);
    background-image: -o-linear-gradient(top, #2c74de, #2964c7);
    background-image: -moz-linear-gradient(top, #2c74de, #2964c7);
    background-image: linear-gradient(top, #2c74de, #2964c7);
}

.btn-primary:hover,
.btn-primary:active,
.btn-primary.active,
.btn-primary.disabled,
.btn-primary[disabled]
{
    background-color: #2964c7;
}

/* Warning Button
================================================== */

.btn-warning
{
    border-color: #c17512;
    background-image: -moz-linear-gradient(top, #ffb432, #ed9700);
    background-image: -ms-linear-gradient(top, #ffb432, #ed9700);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffb432), to(#ed9700));
    background-image: -webkit-linear-gradient(top, #ffb432, #ed9700);
    background-image: -o-linear-gradient(top, #ffb432, #ed9700);
    background-image: linear-gradient(top, #ffb432, #ed9700);
}

.btn-warning:hover,
.btn-warning:active,
.btn-warning.active,
.btn-warning.disabled,
.btn-warning[disabled]
{
    background-color: #ed9700;
}

/* Danger Button
================================================== */

.btn-danger
{
    border-color: #964721;
    background-image: -moz-linear-gradient(top, #df581d, #ca5219);
    background-image: -ms-linear-gradient(top, #df581d, #ca5219);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#df581d), to(#ca5219));
    background-image: -webkit-linear-gradient(top, #df581d, #ca5219);
    background-image: -o-linear-gradient(top, #df581d, #ca5219);
    background-image: linear-gradient(top, #df581d, #ca5219);
}

.btn-danger:hover,
.btn-danger:active,
.btn-danger.active,
.btn-danger.disabled,
.btn-danger[disabled]
{
    background-color: #ca5219;
}

/* Success Button
================================================== */

.btn-success
{
    border-color: #347f32;
    background-image: -ms-linear-gradient(top, #3fb04a, #3c9b3b);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#3fb04a), to(#3c9b3b));
    background-image: -webkit-linear-gradient(top, #3fb04a, #3c9b3b);
    background-image: -o-linear-gradient(top, #3fb04a, #3c9b3b);
    background-image: -moz-linear-gradient(top, #3fb04a, #3c9b3b);
    background-image: linear-gradient(top, #3fb04a, #3c9b3b);
}

.btn-success:hover,
.btn-success:active,
.btn-success.active,
.btn-success.disabled,
.btn-success[disabled]
{
    background-color: #3c9b3b;
}

/* Info Button
================================================== */

.btn-info
{
    border-color: #28889f;
    background-image: -ms-linear-gradient(top, #32bed8, #2ea6c2);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#32bed8), to(#2ea6c2));
    background-image: -webkit-linear-gradient(top, #32bed8, #2ea6c2);
    background-image: -o-linear-gradient(top, #32bed8, #2ea6c2);
    background-image: -moz-linear-gradient(top, #32bed8, #2ea6c2);
    background-image: linear-gradient(top, #32bed8, #2ea6c2);
}

.btn-info:hover,
.btn-info:active,
.btn-info.active,
.btn-info.disabled,
.btn-info[disabled]
{
    background-color: #2ea6c2;
}

/* Inverse Button
================================================== */

.btn-inverse
{
    background-image: -ms-linear-gradient(top, #555555, #3a3a3a);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#555555), to(#3a3a3a));
    background-image: -webkit-linear-gradient(top, #555555, #3a3a3a);
    background-image: -o-linear-gradient(top, #555555, #3a3a3a);
    background-image: -moz-linear-gradient(top, #555555, #3a3a3a);
    background-image: linear-gradient(top, #555555, #3a3a3a);
    border-color: #000;
}

.btn-inverse:hover,
.btn-inverse:active,
.btn-inverse.active,
.btn-inverse.disabled,
.btn-inverse[disabled]
{
    background-color: #3a3a3a;
}

/* IE < 9 Styles
================================================== */

.lt-ie9 #login-social .zocial
{
    margin-bottom: 10px;
}

.lt-ie9 #login-circle .login-inner-form input[type="text"], 
.lt-ie9 #login-circle .login-inner-form input[type="password"], 
.lt-ie9 #login-circle .login-inner-form textarea, 
.lt-ie9 #login-circle .login-inner-form select
{
    min-height: 18px;
}

.lt-ie9 #login-circle .login-inner-form input.big
{
    min-height: 38px;
}

.lt-ie9 #login-circle .login-inner-form input.big
{
    line-height: 38px;
}

.lt-ie9 #login-circle .login-inner-form, 
.lt-ie9 #login-circle .login-inner-form.active
{
    display: block;
}
