@media screen and (max-width: 500px){
	h2{
	padding-top: 30px;
	margin: 0 0 20px 0;
	font-family: arial narrow;
	font-size: 28px;
	}
	p{
		margin-bottom: 8px;
		font-size: 21px;
	}
	a:visited{
		color: #06a;
	}
	.cnsf{
		margin: 20px auto;
		background-color: #ffffffe3;
	}
	.cnsf p{
		font-size: 21px;
	}
	.box{
		background-color: #e2e3e3;
		border: solid 1px #eee;
		border-radius: 15px;
		box-shadow: 5px 5px 5px #ccc;
		padding: 30px;
		text-align: justify;
		margin-bottom: 30px;
	}
	.box h2{
		text-align: center;
		padding-top: 0px;
		letter-spacing: 3px;
	}
	table td{
		width: 50%;
		padding: 0 20px 0 20px;
	}
	#txt{
		margin-bottom: 50px;
		text-align: justify;
	}
	#txt p{
		color: #333;
		font-size: 21px;
	}
	.valoresH2{
		text-align: center;
		margin-bottom: 0;
		font-size: 40px;
	}
	.valoresWrap{
		border-top: solid 1px #333;
		width: fit-content;
		margin: 0 auto 30px auto;
		padding-top: 20px;
		font-family: century gothic;
		font-weight: bold;
		text-align: center;
		font-size: 35px;
		color: #444;
		text-transform: uppercase;
	}
	@keyframes swap{
		0%{transform: rotateX(90deg);}
		10%{transform: rotateX(0deg);}
		20%{transform: rotateX(0deg);}
		80%{transform: rotateX(0deg);}
		90%{transform: rotateX(0deg);}
		100%{transform: rotateX(90deg);}
	}
	#valores{
		color: #06a;
	}
}
@media screen and (min-width: 501px){
	h2{
	padding-top: 40px;
	margin: 0 0 20px 10px;
	font-family: arial narrow;
	font-size: 32px;
	}
	p{
		margin-bottom: 8px;
		font-size: 21px;
	}
	a:visited{
		color: #06a;
	}
	.cnsf{
		background-origin: content-box;
		background-position-x: center;
		background-blend-mode: overlay;
		margin: 20px auto;
		padding: 10px;
		border-radius: 5px;
		text-align: center;
		background-color: #ffffffe3;
	}
	.cnsf p{
		font-size: 27px;
	}
	#boxesWrap{
		width: 100%;
	}
	.box{
		width: 40%;
		height: 225px;
		background-color: #e2e3e3;
		border: solid 1px #eee;
		border-radius: 15px;
		box-shadow: 5px 5px 5px #ccc;
		padding: 30px;
		text-align: justify;
		margin-bottom: 30px;
	}
	.box h2{
		text-align: center;
		padding-top: 0px;
		letter-spacing: 3px;
	}
	.float{
		float: right;
	}
	table td{
		width: 50%;
		padding: 0 20px 0 20px;
	}
	#txt{
		background-image: url(../images/hands.png);
		background-size: 100%;
		background-position-y: center;
		padding: 30px 0 40px 60px;
		margin-bottom: 50px;
		border-radius: 10px;
		text-align: justify;
	}
	#txt p{
		color: #333;
		font-size: 26px;
		width: 65%;	
	}
	.valoresH2{
		text-align: center;
		margin-bottom: 0;
		font-size: 40px;
	}
	.valoresWrap{
		border-top: solid 1px #333;
		width: fit-content;
		margin: 0 auto 40px auto;
		padding-top: 20px;
		font-family: century gothic;
		font-weight: bold;
		text-align: center;
		font-size: 35px;
		color: #444;
		text-transform: uppercase;
	}
	@keyframes swap{
		0%{transform: rotateX(90deg);}
		10%{transform: rotateX(0deg);}
		20%{transform: rotateX(0deg);}
		80%{transform: rotateX(0deg);}
		90%{transform: rotateX(0deg);}
		100%{transform: rotateX(90deg);}
	}
	#valores{
		color: #06a;
	}
}