
* {
	margin:0;	
	border:0;
	}
	
.erro {
	color:#EE0000;
}

.sucesso {
	color:#00AA00;
}
	
/*Regra para desktop e tablet*/
@media screen and (min-width:751px) {
	
body {
	background-image:url(../img/login/background.jpg);
	background-repeat:no-repeat;
	background-position:center;
	background-attachment:fixed;
	width:100%;
	height:auto;	
	}	

#campo-mensagem {
	width:60%;
	height:35px;	
	margin:50px auto auto auto;
	background:#FFF;
	filter:alpha(opacity=50);
    opacity: 0.5;
    -moz-opacity:0.5;
    -webkit-opacity:0.5;		
	}
	
#campo-mensagem h3 {
	font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size:15px;
	float:left;
	position:relative;
	top:9px;
	bottom:auto;
	left:20px;
	}	
	
#container-formulario {
	width:600px;
	height:447px;
	background-image:url(../img/login/background-form2.png);
	background-size:600px 447px;
	margin:30px auto auto auto;	
	}
	
#container-formulario h1 {
	font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size:21px;
	color:#666;
	text-align:center;
	margin-top:110px;
	}
	
#botao-in {
	width:160px;
	height:27px;
	background-image:url(../img/login/button_in.png);
	background-size:160px 27px;
	margin:15px auto auto auto;
	/*box-shadow:0 0 1px 1px #666666;*/	
	}

#botao-in:active {
	width:160px;
	height:27px;
	box-shadow:inset 0 1px 1px 1px #666666;
	}	

#formulario {
	width:320px;
	height:70px;
	margin:15px auto auto auto;		
	}
	
#formulario label {
	font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size:18px;
	color:#666;
	} 	

.campo {
	width:240px;
	height:23px;
	text-indent:5px;
	font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	color:#666;
	font-size:15px;
	margin-right:0px;
	}
	
#formulario input {
	width:240px;
	float:right;
	}	
	
#container-formulario h2 {
	font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size:16px;
	color:#FFF;
	float:left;
	margin:80px auto auto 40px;
	}
	
#container-formulario h2:hover {
	color:#F9DB23;
	}
	
#container-formulario h2:active {
	color:#CCC;
	}	
	
.botao-logar {
	width:130px;
	height:35px;
	font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size:20px;
	color:#0170BF;
	/*background-image:url(../img/login/button_sign_in.png);
	background-size:136px 39px;*/
	float:right;
	margin:72px 45px auto auto;
	box-shadow:0 0 1px 1px #666666;
	}
	
.botao-logar:active {
	box-shadow:inset 0 1px 1px 1px #666666;
	}									
}

/*Regra para smartphones*/

@media screen and (max-width:750px) {

body {
	background-image:url(../img/login/background-mobile.jpg);
	background-repeat:no-repeat;
	background-position:center;
	background-attachment:fixed;
	width:100%;
	height:auto;	
	}	

#campo-mensagem {
	width:80%;
	height:30px;	
	margin:50px auto auto auto;
	background:#FFF;
	filter:alpha(opacity=50);
    opacity: 0.5;
    -moz-opacity:0.5;
    -webkit-opacity:0.5;		
	}
	
#campo-mensagem h3 {
	font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size:12px;
	float:left;
	position:relative;
	top:9px;
	bottom:auto;
	left:10px;
	}

#container-formulario {
	width:290px;
	height:290px;
	background-image:url(../img/login/background-form-mobile2.png);
	background-size:290px 290px;
	margin:50px auto auto auto;	
	}
	
#container-formulario h1 {
	font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size:18px;
	color:#666;
	text-align:center;
	margin-top:40px;
	}
	
#botao-in {
	width:140px;
	height:23px;
	background-image:url(../img/login/button_in.png);
	background-size:140px 23px;
	margin:0 auto auto auto;
	/*box-shadow:0 0 1px 1px #666666;*/	
	}

#botao-in:active {
	width:140px;
	height:23px;
	box-shadow:inset 0 1px 1px 1px #666666;
	}	

#formulario {
	width:260px;
	height:50px;
	margin:5px auto auto auto;		
	}
	
#formulario label {
	font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size:15px;
	color:#666;
	} 	

.campo {
	width:200px;
	height:20px;
	text-indent:5px;
	font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	color:#666;
	font-size:12px;
	margin-right:0px;
	}
	
#formulario input {
	width:200px;
	float:right;
	}	
	
#container-formulario h2 {
	font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size:12px;
	color:#FFF;
	float:left;
	margin:45px auto auto 15px;
	}
	
#container-formulario h2:hover {
	color:#F9DB23;
	}
	
#container-formulario h2:active {
	color:#CCC;
	}	
	
.botao-logar {
	width:90px;
	height:26px;
	font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size:15px;
	color:#0170BF;
	/*background-image:url(../img/login/button_sign_in.png);
	background-size:136px 39px;*/
	float:right;
	margin:38px 20px auto auto;
	box-shadow:0 0 1px 1px #666666;
	}
	
.botao-logar:active {
	box-shadow:inset 0 1px 1px 1px #666666;
	}										
}