*{
 margin:0;
 padding:0;
 box-sizing: border-box;
 font-family: "Lato";
}


html,body{
  height:100%;
}

.center{
	max-width: 1100px;
	padding: 0 2%;
	margin: 0 auto;
}

.clear{clear: both;}

.error{color: red;}

.sucess{
	position: absolute; 
	top: 70px;
	display: none;
	color: green;
	font-weight: bold;
}

header{
	background: #3665af;
	padding: 8px 0;
}

div.logo{
	float: left;
	color: white;
}

.logo a{
	text-decoration: none;
	color: white;
}

.logo h2{
	font-size:29px;
	font-weight: bold; 
}

form.form-login{
	float: right;
}

.form-login .form-element{
	display: inline-block;
	margin-right: 15px;
}

.form-element p{
	 color: white;
	 font-size: 14px;
}

.form-element input[type=email],
.form-element input[type=password]{
	margin-top: 4px;
	border: 0;
	height: 22px;
	padding-left: 3px;
}

.form-element input[type=submit]{
	cursor: pointer;
	border: 2px solid #215ab2;
	background: #0866ff;
	padding: 3px 5px;
	color: white;
}

.form-element input[type=submit]:hover{
	 background: #215ab2;
}

section.main{
	background: white;
	padding: 40px 0;
}

.img-pessoas{
	float: left;
	width: 60%;
	padding-left: 15%;
}

.img-pessoas img{
	max-width: 100%; 
}

.abrir-conta{
	float: left;
	width: 40%;
	background: linear-gradient(white, #D3D8E8);
	text-align: center; 
}

.abrir-conta h2{

	color: black;
	font-size: 35px;
}

.abrir-conta h3{
	font-size: 19px;
	color: rgb(30,30,30);
	margin-top: 8px;
	font-weight: normal; 
}

form.criar-conta{
	margin-top: 10px;
}

.w25{
	width: 45%;
	padding: 0 5px;
	float: left;
}

.w50{
	padding: 0 5px;
	width: 90%;
	float: left;
}

form.criar-conta input{
	width: 100%;
	margin-top: 8px;
}

form.criar-conta input[type=email],
form.criar-conta input[type=text],
form.criar-conta input[type=password]{
	height: 30px;
	padding-left: 10px; 
	border: 1px solid#a5dcff;
	border-radius: 4px;
	margin-left: 10px;
}

.w75{
	display: inline-block;
	margin-top: 10px;
}

.w100{
	text-align: center;
	margin-top: 10px;
	width: 70%;
	position: relative;
}

.w100 select{
	height: 30px;
	width: 65px;
}

.ajuda{
	margin-left: 10px;
}

.ajuda h1{
	font-weight: normal;
	font-size: 11px;
	color: blue;
	width: 130px;
	display: inline-block;
	cursor: pointer;
	position: absolute;

}

.input-radio{
	display: inline-block;
	margin:15px 10px 0 10px;
}

.input-radio h1{
	display: inline-block;
	text-align: center;
	padding-left: 5px;
	font-weight: normal;
	font-size: 20px;
 }

 .input-radio input[type=radio]{
 	width: auto;
 }

.w200 [type=submit]{
	height: 40px;
	width: 150px;
	background: linear-gradient(#67ae55, #578843);
	color: white;
	cursor: pointer;
	border: 0;
	max-width: 200px;
	font-size: 19px;
	margin-top: 15px;
	padding: 10px;
}

.atenção{
	width: 80%;
	font-size: 11px;
	font-weight: normal;
	margin-left: 40px;
	margin-top: 20px;
}

.atenção h1{
	font-size: 12px;
	color: #BBBBBB;
}

.atenção a.contrato {
	font-weight: normal;
	font-size: 12px;
	text-decoration: none; 
}
	
.w250{
	margin-top: 15px;
	margin-bottom: 15px;
}

.w250 a{
	font-size: 14px;
	color: gray;
	text-decoration: none;
	font-weight: bold;
}

.section.linguas{
	padding: 30px 0;
}

section.linguas a{
	padding-right: 15px;
	font-size: 12px;
	color: #365899;
	text-decoration: none;
}

section.linguas a.selected-lingua{
	color: #737373;
}

section.linguas .center{
	padding-left: 8px; 
	padding-right: 8px;
	padding-bottom: 10px;
	border-bottom: 1px solid #ccc;
}	

 button.opções{
	cursor: pointer;
 	width: 33px;
 }

.opções img{
	margin-top: 2px;
	margin-right: 1px;
}

h1.meta{
	font-size: 12px;
	color: #737373;
	margin-top: 25px;
	font-weight: normal;
}


@media screen and (max-width: 768px){
	.logo{
		width: 100%;
		text-align: center;
		float: none;
	}

	form.form-login{
		width: 100%;
		display: inline-block;
		margin-top: 10px;
		text-align: center; 
		float: none;
	}

	.img-pessoas{ 
		width: 100%;
		text-align: center;
	}

	.abrir-conta{
		margin-top: 25px;
		width: 100%;
	}
}

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

		.logo{
		width: 100%;
		text-align: center;
		float: none;
	}

	form.form-login{
		width: 100%;
		display: inline-block;
		margin-top: 10px;
		text-align: center; 
		float: none;
	}

	.img-pessoas{ 
		width: 80%;
		text-align: center;
	}

	.abrir-conta{
		text-align: center;
		margin-top: 70px;
		width: 100%;
	}

	.sucess{
		left: 50%;
		transform: translateX(-50%);
		top: 85%;
	}
}