@charset "utf-8";

body {
    background: #efeff1 url(../img/fondoLogin.jpg) repeat-x;
    font-family:Arial, Helvetica, sans-serif; 
    font-size: 62.5%;
}

#login {
width: 50%;
min-height: 450px;
padding: 10px;
margin: 7% auto 0 auto;
background: #fff;
	}
        
#logo {
width: 35%;
display: inline-block;
vertical-align: top;
padding: 100px 15px 0 15px;
box-sizing: border-box;
text-align: center;
}

    #logo img {
     max-width: 90%;
     display: inline-block;
    }

    #logo img.icoAcceso {
        margin-top: 20px;
        
       }

#logeo   {
width: 60%;
display: inline-block;

}
#logeo h1{font-size:5em; color:#000000;}
#txtLogeo{
    font-size: 0.6em;
    color:#000; 
    width: 100%;
    font-size: 1.5em!important;
    margin-top:25px;
    font-weight: bold;
    padding-top:5px;
    border-top:1px dotted #000000; 
}
#txtLogeo span{
    color:#999; 
    width: 100%;
    border:none;
}

    p.incorrecto {
    width: 80%;
    background-color: red;
    border-radius: 10px;
    color: #fff;
    font-size: 1.4em;
    font-weight: bold;
    padding: 5px;
    margin-top:15px;
    text-align: center;
    }


/*FORM*/

form{
width: 100%;
margin-top:10px;
}
div.usuario{
        width:100%;
        display:inline-block;
        margin:5px 0;
        }

    div.usuario label{
    width: 100%;
    font-size: 1.4em;
    float:left;
    padding: 5px 0;
    padding-right: 15px;
    color:#000;
}

    div.usuario input{
            width:70%;
            font-size: 1.2em;
            font-family: Arial, Helvetica, sans-serif;
            color: #000;
            padding: 5px 5px;
            border: 1px solid #000000;
            border-radius: 10px;
            background: #fff;
            }

    div.usuario select{
            width:70%;
            font-size: 1.2em;
            font-family: Arial, Helvetica, sans-serif;
            color: #000000;
            padding: 5px 5px;
            border: 1px solid #000000;
            border-radius: 10px;
            background: #fff;
            }

    div.usuario a{
        text-decoration: none;
                        }
    

    div.usuario .button{
            width: 100px;
            min-height: 25px;
            padding: 5px;
            font-size: 14px;
            color: #fff;
            background: #000000;
            margin-top: 10px;
            margin-right: 10px;
            border: 1px solid #000000;
            text-align: center;
            text-decoration: none;
                            }

    div.usuario .button:hover{
            min-height: 25px;
            font-size: 14px;
            color: #FFF;
            background: #999999;
            border: 1px solid #FFF;
            cursor: pointer;
    }

/****************************************** 1500 *******************************************/
@media only screen and (max-width: 1500px){
    #login {width: 70%;}
}

/****************************************** 1100 *******************************************/
@media only screen and (max-width: 1100px){
    #login {width: 90%;}
}
     
/****************************************** 800 *******************************************/
@media only screen and (max-width: 800px){
    #login {min-height: 520px;}
    #logo {width: 72%;display: block; margin: 0 auto;text-align: center;padding: 0;}
    #logeo{margin:0 auto;display: block;}
    p.incorrecto {    width: 100%;}
    
}

/****************************************** 600 *******************************************/
@media only screen and (max-width: 600px){
#logeo {    width: 70%;margin-top: 50px;}
#logeo h1 {    font-size: 3em;}

}
   
/****************************************** 400 *******************************************/
@media only screen and (max-width: 400px){
#logeo {    width: 90%;}
}