@CHARSET "UTF-8"; 
.progress-bar {color:#333;} 
message1{}
@media screen and (max-width: 340px) {

}

@media screen and (min-width: 341px) and (max-width: 640px) {
html {min-width:341px; max-width:640px;}
body {background:url(../images/fondo_360.png) no-repeat center center fixed; width:100%; height:640px; background-color:#1b2a41;}
.centrado-porcentual {
    position: absolute;
    left: 50%;
    top: 10%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
}
*{ -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; outline:none; } 
.form-control{ position:relative; font-size:14px; width:198px; height:auto; padding:10px; @include box-sizing(border-box); &:focus { z-index:2; }
} 
form[role=login] { color: #5d5d5d; background: #f2f2f2; padding: 26px; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; } 
form[role=login] img { display: block; margin: 0 auto; margin-bottom: 35px; } 
form[role=login] input, form[role=login] button { font-size: 18px; margin:10px 0; } 
form[role=login] > div { text-align: center; } 
.form-links { text-align: center; margin-top: 1em; margin-bottom: 50px; } 
.form-links a {color: #CCCCCC; } 

.login-form {
	position:absolute; 
/*	top:30%; 
	left:50%; 
	width:250px; */ 
	height:330px; 
	margin-left:-125px; 
	text-decoration:none; 
	border:none;
	text-align:center;
} 
}

@media screen and (max-width: 640px) {
html { min-width:320px; max-width:640px;}
body { background: url(../images/fondo_360.png) no-repeat center center fixed; width:100%; height:640px; background-color:#1b2a41;}
.centrado-porcentual {
    position: absolute;
    left: 50%;
    top: 10%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
}
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; outline: none; } 
.form-control{ position:relative; font-size:14px; width:198px; height:auto; padding:10px; @include box-sizing(border-box); &:focus { z-index: 2; }
}
form[role=login] { color: #5d5d5d; background: #f2f2f2; padding: 26px; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; } 
form[role=login] img { display: block; margin: 0 auto; margin-bottom: 35px; } 
form[role=login] input, form[role=login] button { font-size: 18px; margin: 10px 0; } 
form[role=login] > div { text-align: center; } 
.form-links { text-align: center; margin-top: 1em; margin-bottom: 50px; } 
.form-links a {color: #CCCCCC; } 

.login-form {
	position:absolute; 
/*	top:30%; 
	left:50%; */
	width:250px; 
	height:330px; 
	margin-left:-125px; 
	text-decoration:none; 
	border:none;
	text-align:center;
} 
}

@media screen and (min-width: 641px) and (max-width: 1000px) {
html { min-width:641px; max-width:1000px;}
body { background: url(../images/fondo.png) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;  background-color:transparent;}
.centrado-porcentual {
    position: absolute;
    left: 50%;
    top: 40%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
}
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; outline: none; } 
.form-control{ position:relative; font-size:14px; width:250px; height:auto; padding:10px; @include box-sizing(border-box); &:focus { z-index: 2; }
}
form[role=login] { color: #5d5d5d; background: #f2f2f2; padding: 26px; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; } 
form[role=login] img { display: block; margin: 0 auto; margin-bottom: 35px; } 
form[role=login] input, form[role=login] button { font-size: 18px; margin: 16px 0; } 
form[role=login] > div { text-align: center; } 
.form-links { text-align: center; margin-top: 1em; margin-bottom: 50px; } 
.form-links a {color: #CCCCCC; } 

.login-form {
	position:absolute; 
/*	top:30%; 
	left:50%; */
	width:300px; 
	height:150px; 
	margin-left:-100px; 
	text-decoration:none; 
	border:none;
	text-align:center;
} 
}

@media screen and (max-width:1000px) {
}

@media screen and (min-width: 1001px){
html { min-width:1001px; max-width:1920px;}
body { background: url(../images/fondo.png) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
.centrado-porcentual {
    position: absolute;
    left: 50%;
    top: 40%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
}
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; outline: none; } 
.form-control{ position:relative; font-size:16px; width:250px; height:auto; padding:10px; @include box-sizing(border-box); &:focus { z-index: 2; }
}
form[role=login] { color: #5d5d5d; background: #f2f2f2; padding: 26px; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; } 
form[role=login] img { display: block; margin: 0 auto; margin-bottom: 35px; } 
form[role=login] input, form[role=login] button { font-size: 18px; margin: 16px 0; } 
form[role=login] > div { text-align: center; } 
.form-links { text-align: center; margin-top: 1em; margin-bottom: 50px; } 
.form-links a {color:#CCCCCC; } 

.login-form {
	position:absolute; 
/*	top:30%; 
	left:50%; */
	width:300px; 
	height:150px; 
	margin-left:-100px; 
	text-decoration:none; 
	border:none;
	text-align:center;
} 
}