html, body{ height: 100%;}
form {
margin-left: auto;
margin-right: auto;
}
body {
font: 12px 'Lucida Sans Unicode', 'Trebuchet MS', Arial, Helvetica;
margin: 0;
background-color: #d9dee2;
background-image: -webkit-gradient(linear, left top, left bottom, from(#ebeef2), to(#d9dee2));
background-image: -webkit-linear-gradient(top, #ebeef2, #d9dee2);
background-image: -moz-linear-gradient(top, #ebeef2, #d9dee2);
background-image: -ms-linear-gradient(top, #ebeef2, #d9dee2);
background-image: -o-linear-gradient(top, #ebeef2, #d9dee2);
background-image: linear-gradient(top, #ebeef2, #d9dee2);
}
.alert-box { color:#555; border-radius:10px; font-family:Tahoma,Geneva,Arial,sans-serif;font-size:1em; padding:10px 10px 10px 36px; margin:10px; }
.alert-box span.close-tip:hover { text-shadow: 1px 1px 1px rgba(0, 0, 0, 1); color: white; border-color: rgb(18, 52, 86);}
/*--------------------*/
#login, .cuadro {
height: 50.5em;
width: 25.8em;
padding: 2.5em;
max-width:100% !important;
max-height:90%;
}
#inputs input, #inputs select{
width: 20.85em; /* 353 + 2 + 45 = 400 */
max-width: 100%;
}
#submit, .button {
height: 2.9em;
width: 10em;
}
@media only screen
and (max-width : 480px) {
#doptions {visibility: hidden;}
.alert-box{
padding: 0;margin: 0;
}
#login, .cuadro {
height: 40em;
}
form{height:100%;}
}
#login, .cuadro
{
background-color: #fff;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee));
background-image: -webkit-linear-gradient(top, #fff, #eee);
background-image: -moz-linear-gradient(top, #fff, #eee);
background-image: -ms-linear-gradient(top, #fff, #eee);
background-image: -o-linear-gradient(top, #fff, #eee);
background-image: linear-gradient(top, #fff, #eee);
text-align: center;
z-index: 0;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow:
0 0 2px rgba(0, 0, 0, 0.2),
0 1px 1px rgba(0, 0, 0, .2),
0 3px 0 #fff,
0 4px 0 rgba(0, 0, 0, .2),
0 6px 0 #fff,
0 7px 0 rgba(0, 0, 0, .2);
-moz-box-shadow:
0 0 2px rgba(0, 0, 0, 0.2),
1px 1px 0 rgba(0, 0, 0, .1),
3px 3px 0 rgba(255, 255, 255, 1),
4px 4px 0 rgba(0, 0, 0, .1),
6px 6px 0 rgba(255, 255, 255, 1),
7px 7px 0 rgba(0, 0, 0, .1);
box-shadow:
0 0 2px rgba(0, 0, 0, 0.2),
0 1px 1px rgba(0, 0, 0, .2),
0 3px 0 #fff,
0 4px 0 rgba(0, 0, 0, .2),
0 6px 0 #fff,
0 7px 0 rgba(0, 0, 0, .2);
}
#login:before, .cuadro:before
{
content: '';
position: absolute;
z-index: -1;
border: 1px dashed #ccc;
top: 5px;
bottom: 5px;
left: 5px;
right: 5px;
-moz-box-shadow: 0 0 0 1px #fff;
-webkit-box-shadow: 0 0 0 1px #fff;
box-shadow: 0 0 0 1px #fff;
}
/*--------------------*/
fieldset{ border: 0; padding: 0; margin: 0; }
#inputs input, #inputs select
{
background: #f1f1f1 url("../images/login-sprite.png") no-repeat;
padding: 15px 15px 15px 30px;
margin: 0 0 10px 0;
border: 1px solid #ccc;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
-moz-box-shadow: 0 1px 1px #ccc inset, 0 1px 0 #fff;
-webkit-box-shadow: 0 1px 1px #ccc inset, 0 1px 0 #fff;
box-shadow: 0 1px 1px #ccc inset, 0 1px 0 #fff;
}
input[type='text'] { background-position: 5px -2px !important;}
input[type='password'] { background-position: 5px -52px !important; }
#inputs select { background-position: 5px -2px !important; width: 100%; }
#inputs input:focus { background-color: #fff; border-color: #e8c291; outline: none; -moz-box-shadow: 0 0 0 1px #e8c291 inset; -webkit-box-shadow: 0 0 0 1px #e8c291 inset; box-shadow: 0 0 0 1px #e8c291 inset; }
/*#actions { margin: 25px 0 0 0;}*/
#submit, .button
{
background-color: #ffb94b;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fddb6f), to(#ffb94b));
background-image: -webkit-linear-gradient(top, #fddb6f, #ffb94b);
background-image: -moz-linear-gradient(top, #fddb6f, #ffb94b);
background-image: -ms-linear-gradient(top, #fddb6f, #ffb94b);
background-image: -o-linear-gradient(top, #fddb6f, #ffb94b);
background-image: linear-gradient(top, #fddb6f, #ffb94b);
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
text-shadow: 0 1px 0 rgba(255,255,255,0.5);
-moz-box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;
-webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;
box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;
border-width: 1px;
border-style: solid;
border-color: #d69e31 #e3a037 #d5982d #e3a037;
float: left;
padding: 0;
cursor: pointer;
font: bold 15px Arial, Helvetica;
color: #8f5a0a;
}
#submit:hover,#submit:focus , .button:hover,.button:focus
{
background-color: #fddb6f;
background-image: -webkit-gradient(linear, left top, left bottom, from(#ffb94b), to(#fddb6f));
background-image: -webkit-linear-gradient(top, #ffb94b, #fddb6f);
background-image: -moz-linear-gradient(top, #ffb94b, #fddb6f);
background-image: -ms-linear-gradient(top, #ffb94b, #fddb6f);
background-image: -o-linear-gradient(top, #ffb94b, #fddb6f);
background-image: linear-gradient(top, #ffb94b, #fddb6f);
}
#submit:active, .button:active { outline: none; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5) inset; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5) inset; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5) inset; }
#submit::-moz-focus-inner, .button::-moz-focus-inner{ border: none;}
#actions a { color: #3151A2; float: right; line-height: 35px; text-decoration: none; color: #8f5a0a; }
#back { display: block; text-align: center; position: relative; top: 60px; color: #999; }
.error, .credito-estado-20 { background:#ffecec url('../images/notification/error.png') no-repeat 10px 50%; border:1px solid #f5aca6; }
.success, .credito-estado-10 { background:#e9ffd9 url('../images/notification/success.png') no-repeat 10px 50%; border:1px solid #a6ca8a; }
.warning, .credito-estado-30 { background:#fff8c4 url('../images/notification/warning.png') no-repeat 10px 50%; border:1px solid #f2c779; }
.notice { background:#e3f7fc url('../images/notification/notice.png') no-repeat 10px 50%; border:1px solid #8ed9f6; }
#banner { right: 0; bottom: 0; position:fixed !important; }
th {text-align: right;}
table {width:100%;}
#actions a.button {
font-size: 14px;
}