@font-face {
	font-family: regular;
	src: url(../fontes/regular.ttf)
}

body, html{
	overflow-x: hidden;
}
a{
	text-decoration: none!important;
}
.block{
	display: block;
}
.transition{
	transition: all 0.3s ease-in-out;
}
.center{
	text-align: center;
}

html{
	scroll-behavior: smooth;
}
/**/
.principio{
	padding-top: 5%;
}
.principio img{
	width: 15%;
}
/**/
.principal{
    padding-top: 8%;
}
.principal .item img {
	width: 40%;
}
.principal .item2 img {
	width: 58%;
}

.principal .item img, .principal .item2 img{
	opacity: 1;
	transition: .5s ease;
	backface-visibility: hidden;
}
.principal .item img:hover,		.principal .item2 img:hover{
	opacity: 0.5;
}
.principal p {
	font-family: regular;
	padding: 8% 25% 0% 25%;
	font-size: 18px;
}
@media only screen and (max-width:1680px){

	.principal p {
		font-family: regular;
		padding: 8% 22% 0% 22%;
		font-size: 16px;
	}
}
@media only screen and (max-width:1450px){

}
@media only screen and (max-width:1366px){
	.principal p {
		font-family: regular;
		padding: 8% 20% 0% 20%;
		font-size: 16px;
	}
}
@media only screen and (max-width:1280px){

}
@media only screen and (max-width:1200px){
	.principal p{
		padding: 8% 18% 0% 18%;
	}
}
@media only screen and (max-width:1100px){
	.principal p {
		font-family: regular;
		padding: 8% 16% 0% 16%;
		font-size: 14px;
	}
}
@media only screen and (max-width:1000px){
	.principal p {
		padding: 8% 14% 0% 14%;
	}
}
@media only screen and (max-width:992px){
}
@media only screen and (max-width:991px){
	.principio img {
		width: 25%;
	}
	.principal .item img {
		width: 25%;
	}
	.principal .item2 img {
		width: 36%;
	}
	.principal p {
		padding: 3% 38% 4.5% 38%;
		margin: 0;
	}
}
@media only screen and (max-width:768px){
	.principal p {
		padding: 3% 34% 4.5% 34%;
	}
}
@media only screen and (max-width:700px){
	.principio img {
		width: 28%;
	}

}
@media only screen and (max-width:600px){
.principal p {
    padding: 3% 30% 4.5% 30%;
}
}
@media only screen and (max-width:500px){
.principal p {
    padding: 3% 25% 4.5% 25%;
}
}
@media only screen and (max-width:400px){
.principal p {
    padding: 3% 22% 4.5% 22%;
}
}
@media only screen and (max-width:350px){
.principal p {
    padding: 3% 18% 4.5% 18%;
}
}