/* ______________________
  |                      |
  |     ESTILO LOGIN     | 
  |______________________|*/

#login{
  font-family: tahoma,verdana,sans-serif;
  overflow: hidden;
  color: #404040;
  position: relative;
  margin: 0px auto;
  padding: 10px 10px 10px;
  width: 99%;
}


#logincuadro{
  font-family: tahoma,verdana,sans-serif;
  font-size: 22px;
  color: #404040;
  background: white;
  position: relative;
  margin: 100px auto;
  padding: 10px 10px 10px;
  width: 50%;
  height: 350px;
  background: white; 
  border-radius: 10px;
  -webkit-box-shadow: 0 0 200px rgba(255, 255, 255, 0.5), 0 1px 2px rgba(0, 0, 0, 0.3);
  box-shadow: 0 0 200px rgba(255, 255, 255, 0.5), 0 1px 2px rgba(0, 0, 0, 0.3);
}

#logincuadro h1 {
  margin: -10px -10px 21px;
  line-height: 40px;
  padding-top: 10px;
  font-size: 25px;
  font-weight: bold;
  color: #CCCCCC;
  text-align: center;
  text-shadow: 0 1px white;
  background: #021B66;
  border-bottom: 1px solid #cfcfcf;
  border-radius: 10px 10px 0 0;
  background-image: -webkit-linear-gradient(top, whiteffd, #eef2f5);
  background-image: -moz-linear-gradient(top, whiteffd, #eef2f5);
  background-image: -o-linear-gradient(top, whiteffd, #eef2f5);
  background-image: linear-gradient(to bottom, whiteffd, #eef2f5);
  -webkit-box-shadow: 0 1px whitesmoke;
  box-shadow: 0 1px whitesmoke;
}

#logincuadro input[type=text],
#logincuadro input[type=password]{
  font-size: 25px;
  font-family: tahoma,verdana,sans-serif;
  color: gray;
  height: 60px;
  width: 60%;
  padding: 5px;
  margin: 15px;
  margin-right: 20%;
  margin-left: 20%;
  outline: none;
  text-align: center;
  background-color: whitesmoke;
  border-radius: 6px;
  border: 1px solid rgba(0,0,0, 0.2);
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  transition: all 0.30s ease-in-out;
  -webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all 0.30s ease-in-out;
}

#logincuadro input[type=text]:focus,
#logincuadro input[type=password]:focus{
  color: #000;
  border: 1px solid #999;
  background-color: white;
  box-shadow: 0 0 25px #aaa;
  -webkit-box-shadow: 0 0 25px #aaa;
  -moz-box-shadow: 0 0 25px #aaa;
}

#logincuadro span{
  font-size: 20px;
  padding: 10px 10px 10px;
  font-weight: bold;
  color: red;
}

#logincuadro .boton {
  -moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
  -webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
  box-shadow:inset 0px 1px 0px 0px #ffffff;
  background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf) );
  background:-moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf');
  background-color:#ededed;
  -webkit-border-top-left-radius:30px;
  -moz-border-radius-topleft:30px;
  border-top-left-radius:30px;
  -webkit-border-top-right-radius:30px;
  -moz-border-radius-topright:30px;
  border-top-right-radius:30px;
  -webkit-border-bottom-right-radius:30px;
  -moz-border-radius-bottomright:30px;
  border-bottom-right-radius:30px;
  -webkit-border-bottom-left-radius:30px;
  -moz-border-radius-bottomleft:30px;
  border-bottom-left-radius:30px;
  margin: 5px auto;
  text-indent:0px;
  border:1px solid #dcdcdc;
  display:inline-block;
  color:#777777;
  font-family:Verdana;
  font-size:15px;
  font-weight:bold;
  font-style:normal;
  line-height: 300%;
  width:30%;
  margin-right: 35%;
  margin-left: 35%;
  text-decoration:none;
  text-align:center;
  text-shadow:1px 1px 0px #ffffff;
}

#logincuadro .boton:hover {
  background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed) );
  background:-moz-linear-gradient( center top, #dfdfdf 5%, #ededed 100% );
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed');
  background-color:#dfdfdf;
  cursor: pointer;
}

#logincuadro .boton:active {
  position:relative;
  top:1px;
}