/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/*
    Created on : 23/03/2017, 14:45:37
    Author     : RBP
*/

body
{
    z-index:-1;
    width:100%;
    background: #f1f1f1 ;
    position: absolute;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;

    color: rgba(0,0,0,.87);
    direction: ltr;
    font-family: 'Roboto Light',sans-serif;
    font-size: 14px;
    line-height: 20px;
}

@media (min-width: 450px){
    .login-box{
        position: relative;
        background-color: #fff;
        margin: 0 auto;
        width: 70%;
        height: 80%;
        margin-top: 5%;
        /*box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2)*/
    }
}

@media (max-width:767px){
    .login-box{
    position: absolute;
        text-align: left;
        background-color: #fff;
        width: 100%;
        height: 100%;
        margin-top: 0;
        margin-bottom: 0;
    }
}

.login-box{
    display: block;
    text-align: left;
    /*padding: 48px 40px 36px;*/
}

.login-box span{
    color: #0097A7;
    cursor: pointer;
    float: right;
    line-height: 36px;
    margin-top: -6px;
    padding: 6px 0;
    position: relative;
    margin-top: 25px;
}

.login-box span:before{
    background: rgba(66,133,244,.26);
    -webkit-border-radius: 2px;
    border-radius: 2px;
    bottom: 6px;
    content: '';
    left: -16px;
    opacity: 0;
    position: absolute;
    right: -16px;
    top: 6px;
    -webkit-transition: opacity .2s;
    transition: opacity .2s;
    z-index: -1;
}

.login-box-msg{
    text-align: center;
    padding: 0;
    font-family: 'Roboto',sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 32px;
    direction: ltr;
    color: #aaa;
}

.btn-login{
    margin-top: 25px;
    display: inline-block;
    float: left;
    background: #343a40!important;
    color: #fff;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
    min-width: 88px;
    height: 36px;
    border: 0;
    border-radius: 3px;
    text-align: center;
    font-weight: 500;
    text-transform: uppercase;
}




       .input_login   {
           width: 100%;
           border: 2px solid #aaa;
           border-radius: 4px;
           margin: 8px 0;
           outline: none;
           padding: 8px;
           box-sizing: border-box;
           transition: 0.3s;
       }

       .input_login:focus {
           border-color: #000;
           box-shadow: 0 0 8px 0 dodgerBlue;
       }

       .inputWithIcon .input_login {
         padding-left: 40px;
       }

       .inputWithIcon {
         position: relative;
       }

       .inputWithIcon i {
         position: absolute;
         left: 0;
         top: 8px;
         padding: 9px 8px;
         color: #aaa;
         transition: 0.3s;
       }

       .inputWithIcon .input_login:focus + i {
         color: #000;
       }

       .inputWithIcon.inputIconBg i {
         background-color: #635f5f;
         color: #fff;
         padding: 9px 4px;
         border-radius: 4px 0 0 4px;
       }

       .inputWithIcon.inputIconBg .input_login:focus + i {
         color: #fff;
         background-color: #000;
       }

       .transparencia {
            filter:alpha(opacity=90);
            opacity: 0.9;
            -moz-opacity:0.9;
            -webkit-opacity:0.9;
       }   

       /* CSS */
       .content:before {
         content: "";
         position: fixed;
         left: 0;
         right: 0;
         z-index: -1;

         display: block;
         width: 100%;
         height: 100%;
       }           
       
       
       
       
       
       

.login_content {
    margin: 0 auto;
    padding: 50% 0 0;
    position: relative;
    text-align: center;
    text-shadow: 0 1px 0 #fff;
    min-width: 280px
}

.login_content a,
.login_content .btn-default:hover {
    text-decoration: none
}

.login_content a:hover {
    text-decoration: underline
}

.login_content h1 {
    font: normal 25px Helvetica, Arial, sans-serif;
    letter-spacing: -0.05em;
    line-height: 20px;
    margin: 10px 0 30px
}

.login_content h1:before,
.login_content h1:after {
    content: "";
    height: 1px;
    position: absolute;
    top: 10px;
    width: 27%
}

.login_content h1:after {
    background: #7e7e7e;
    background: -webkit-gradient(linear, left top, right top, from(#7e7e7e), to(#fff));
    background: linear-gradient(to right, #7e7e7e 0%, #fff 100%);
    right: 0
}

.login_content h1:before {
    background: #7e7e7e;
    background: -webkit-gradient(linear, right top, left top, from(#7e7e7e), to(#fff));
    background: linear-gradient(to left, #7e7e7e 0%, #fff 100%);
    left: 0
}

.login_content h1:before,
.login_content h1:after {
    content: "";
    height: 1px;
    position: absolute;
    top: 10px;
    width: 20%
}

.login_content h1:after {
    background: #7e7e7e;
    background: -webkit-gradient(linear, left top, right top, from(#7e7e7e), to(#fff));
    background: linear-gradient(to right, #7e7e7e 0%, #fff 100%);
    right: 0
}

.login_content h1:before {
    background: #7e7e7e;
    background: -webkit-gradient(linear, right top, left top, from(#7e7e7e), to(#fff));
    background: linear-gradient(to left, #7e7e7e 0%, #fff 100%);
    left: 0
}

.login_content form {
    margin: 20px 0;
    position: relative
}

.login_content form input[type="text"],
.login_content form input[type="email"],
.login_content form input[type="password"] {
    border-radius: 3px;
    -webkit-box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0, 0, 0, 0.08) inset;
    -ms-box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0, 0, 0, 0.08) inset;
    -o-box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0, 0, 0, 0.08) inset;
    box-shadow: 0 1px 0 #fff, 0 -2px 5px rgba(0, 0, 0, 0.08) inset;
    border: 1px solid #c8c8c8;
    color: #777;
    margin: 0 0 20px;
    width: 100%
}

.login_content form input[type="text"]:focus,
.login_content form input[type="email"]:focus,
.login_content form input[type="password"]:focus {
    -webkit-box-shadow: 0 0 2px #AA77B4 inset;
    -ms-box-shadow: 0 0 2px #ed1c24 inset;
    -o-box-shadow: 0 0 2px #ed1c24 inset;
    box-shadow: 0 0 2px #A97AAD inset;
    background-color: #fff;
    border: 1px solid #A878AF;
    outline: none
}

#username {
    background-position: 10px 10px !important
}

#password {
    background-position: 10px -53px !important
}

.login_content form div a {
    font-size: 12px;
    margin: 10px 15px 0 0
}

.reset_pass {
    margin-top: 10px !important
}

.login_content div .reset_pass {
    margin-top: 13px !important;
    margin-right: 39px;
    float: right
}
       

.login_wrapper {
    right: 0px;
    margin: 0px auto;
    margin-top: 5%;
    max-width: 350px;
    position: relative
}