html, body{
	margin: 0;
	padding: 0;
	font-family: sans-serif;
	background: #030;	
		background: -moz-linear-gradient(45deg, #030 0%, #060 100%); 
		background: -webkit-linear-gradient(45deg, #030 0%,#060 100%); 
		background: linear-gradient(45deg, #030 0%,#060 100%);
	background-attachment: fixed;
}
a{
	color: inherit;
	text-decoration: none;
}

	.section{
		height: auto;
		min-height: 100vh;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.marca{
		width: 90%;
		max-width: 300px;
		margin: 0 auto;
		display:flex;
		justify-content: center;
	}
	.marca img{
		width: 100%;
	}
	.container{
		width: 90%;
		max-width: 450px;
		margin: 0 auto;
	}
	.flex{
		display: flex;
		justify-content: space-between;
	}
	
	/*ABA*/
		.aba{
			width: 100%;
			height: 50px;
			display: flex;
		}
		.aba p{
			margin: 0px;
			padding: 0px;
			font-size: 14px;
		}
		.abaBgAtivo{
			display: flex;
			align-items:center;
			padding: 0 30px; 
			height: 50px;
			border-radius: 10px 10px 0 0;
			border: 1px solid;
			border-bottom: 1px solid;
		}
		.abaBg{
			display: flex;
			align-items:center;
			margin: 10px 0 0 0;
			padding: 0 30px; 
			height: 40px;
			border-radius: 10px 10px 0 0;
			border: 1px solid;
		}
		
	/*TITULO*/
		.titulo{
			width: 100%;
			padding: 15px 0;
			height: auto;		
		}
		.titulo h1{
			margin: 0px;
			padding: 0 20px;
			font-size: 24px;
			font-weight: 500;
		}

	/*LOGIN*/	
		.login{
			width: 100%;
			height: auto;
			padding: 10px 0px 20px;
			border: 1px solid;
		}
		.loginBg{
			height: auto;
			padding: 5px 20px;
		}
		.loginBg p{
			font-size: 14px;
			margin: 5px 0;
		}
		.loginSelect,
		.loginInput{
			width: 100%;
			height: 40px;
			padding: 10px;
			border:1px solid;
			outline:none;		  
			margin: 0px;
			font-size: 16px;	
		}
		.loginSubmit{
			display: flex;
			margin: 10px 0;
			padding: 10px 30px;
			font-size: 14px;
			outline: none;
			transition: ease 0.3s;
			border:none;
			border-radius: 30px;
		}
		.loginLinks{
			width: 100%;
			margin: 0 10px 0 0;
			display: flex;
			align-items: center;
			justify-content: center;
			padding: 0 20px;
		}
		.loginLinks p{
			padding: 0px;
			margin: 0px;
		}		
	/*ALERTAS*/
		.alertaS,
		.alertaE{
			padding:20px 10px; 
			margin: 0 20px;
			text-align: center;
		}

	/*ASSINATURA*/
		.assinatura{
			width: 100%;
			margin: 0px;
		}
		.assinatura p{
			margin: 10px 0;
			padding: 0px;
			text-align: center;
			font-size: 12px;
		}

/*MOBILE*/
@media screen and (max-width:800px){
	.section{
		flex-direction: column;
	}
	.marca{
		width: 90%;
		max-width: 450px;
		margin: 10px 0;
	}
	.flex{
		flex-direction:column-reverse;
	}
	/*ABA*/
		.aba{
			width: 100%;
		}		
		.abaBgAtivo,
		.abaBg{
			width: 100%;
			justify-content: center;
			border: none;
			border-bottom: 1px solid;
		}
	/*LOGIN*/	
		.login{
			border:none;
			border-top: 1px solid;
		}		
		.loginSubmit{
			justify-content: center;
		}
		.loginLinks{
			padding: 10px 0;
		}
		.loginLinks p{
			padding: 0px;
			margin: 0px;
		}
}

/*COLOR*/
	.abaBgAtivo{
		border-color:#EEE;
		border-bottom:#FFF; 
		background-color:#FFF;
		color:#999
	}
	.abaBg{
		border-color:#EEE;
		background-color:#EEE;
		color:#999
	}
	.titulo h1{
		color: #AC4;
	}
	.login{
		background:#FFF;
		border-color:#EEE;
	}
	.loginBg p{
		color:#999
	}
	.loginSelect,
	.loginInput{
		background: #FFF;
		border-color:#CCC;
	}
	.loginSubmit{
		background:#848;
		color:#FFF;
	}
	.loginLinks{
		background-color:#EEE;
	}
	.loginLinks a{
		color: #777;
	}
	.loginLinks a:hover{
		color: #333;
	}		
	.alertaS{
		background: #AC4;
		color:#030
	}
	.alertaE{
		background: #848;
		color:#FFF
	}
	.assinatura a,
	.assinatura p{
		color: #AC4;
	}