/*
 Azul claro: rgb(138, 171, 202) // Anterior: #aaccff
 Azul fuerte: rgb(39, 55, 85) // Anterior: #161aa7
 */

@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,700);

*{margin:0;padding:0;}

body{
  background:rgb(39, 55, 85);
  font-family:'Open Sans',sans-serif; 
  text-align: center;
}

#login{
  width:400px;
  margin:0 auto;
  margin-top:8px;
  margin-bottom:2%;
  transition:opacity 1s;
  -webkit-transition:opacity 1s;
}

#login h1{
  background:#fff;
  padding:20px 0;
  font-size:140%;
  font-weight:300;
  color:#fff;
}

div.form{
  background:rgb(138, 171, 202);
  padding:6% 4%;
}

div.form a{
  color:#fff;
}

input[type="text"],input[type="password"]{
  width:92%;
  background:#fff;
  border:1px solid #ccc;
  padding:4%;
  font-family:'Open Sans',sans-serif;
  font-size:95%;
  color:#555;
}

button{
  width:100%;
  background:rgb(39, 55, 85);
  border:0;
  padding:4%;
  font-family:'Open Sans',sans-serif;
  font-size:100%;
  color:rgb(138, 171, 202);
  cursor:pointer;
  transition:background .3s;
  -webkit-transition:background .3s;
}

button:hover{
  /*background:#F9F9F9;*/
  -moz-box-shadow: inset 0 0 10px rgb(138, 171, 202);
  -webkit-box-shadow: inset 0 0 10px rgb(138, 171, 202);
  box-shadow: inset 0 0 10px rgb(138, 171, 202);
}

#username{
  font-size:small; 
  margin-top:4%;
}               

#txtPassword,#username{
  margin-bottom:4%;
}

#legend{
  margin-top: 10px;
  font-size: small;
  color:#fff;
  width: 100%;
}

#powered{
  margin-top: 10px;
  font-size: x-small;
  width: 100%;
}