@charset "utf-8";
/* CSS Document */

#cuerpo {
	width: 100%;
	background-color: rgba(255,255,255,1.00);
	
}


#cuerpo #contenedor-slider  {
	width: 100%;
	float: left;
	
}

.slider {
	width: 100%;
	margin: auto;
	overflow: hidden;
	float: left;
}

.slider ul{
	padding: 0;
	display: flex;
	width: 200%;
	
	animation: cambio 18s infinite ;
	animation-direction: alternate;
	animation-timing-function: linear; 

}


.slider li{
	list-style: none;
	width: 100%;
	
}

.slider img{
	width: 100%;
}

@keyframes cambio {
	
	0% {margin-left: 0;}
	50% {margin-left: 0;}
	
	58%{margin-left: -100%;}
	100%{margin-left: -100%;}
	
}


#botones {
	width: 100%;
	background-image: url(../img/franja-marca-de-agua.png);
	float: left;
	background-size: 100% auto;
	
}

.botonesimg {
	width: 100%;
	height: auto;
}

.botonesimg ul {
	list-style: none;
}

#botonalimentos {
	width: 15%;
	float: left;
	margin-bottom: 3%;
	margin-left: 25%;
	margin-right: 20%;
	margin-top: 3%;
}


#botonalimentos img {
	width: 100%;
	height: auto;
}


#botonminerales {
	width: 15%;
	float: left;
	margin-top: 3%;
	margin-bottom: 3%;

	
}
#botonminerales img {
	width: 100%;
	height: auto;
	
}
/*botones responsive*/
@media all and (max-width: 360px){
	
	#botonalimentos {
	width: 20%;
	float: left;
	margin-bottom: 3%;
	margin-left: 20%;
	margin-right: 20%;
	margin-top: 1%;
}
	#botonminerales {
	width: 20%;
	float: left;
	margin-bottom: 3%;
	margin-right: 20%;
	margin-top: 1%;
}
	
}


/*presentación*/
#cuerpo #presentacion {
	width: 100%;
	background-color: rgba(238,238,237,1.00);
	float: left;
}


#cuerpo #presentacion #texto {
	width: 80%;
	float: left;
	margin-left: 10%;
	margin-right: 10%;
	margin-top: 1%;
	text-align: center;
	color: rgba(101,101,101,1.00);
	font-size: 18px;
	
}


#presentacion #texto #caja1 {
	width: 100%;
	
}

#texto #caja1 #titulotm {
	width: 40%;
	margin-left: 30%;
	height: auto;
	float: left;
	font-family: Rubik," sans-serif";
	font-size: 18px;
	font-weight: bold;
}
#texto #caja1 #puntitos {
	width: 40%;
	float: left;
	margin-left: 30%;
}
#caja1 #puntitos img {
	/* [disabled]width: 0%; */
	height: auto;
}


#texto #caja1 #puntitos2 {
	width: 10%;
	float: left;
	height: auto;
}


#presentacion #texto #caja2 {
	width: 100%;
	height: auto;
	float: left;
	color: rgba(101,101,101,1.00);
	text-align: center;
	font-family: Rubik," sans-serif" 
}

@media all and (max-width: 780px) {
    h8 { 
       font-size: 13px;
	}
	#titulotm {
		min-width: 50%;
	}
	
	p {
		font-size: 12px;
	}
	
	
	}

@media all and (max-width: 360px) {
	#botones img {
		/*margin-left: -20px;*/
		margin-bottom: 1px;
		min-width: 40px;
		
	}

}