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

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

#cuerpo #slider  {
	width: 100%;
	float: left;
	list-style: none;
	margin-top: 0.5%;
}

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

/*BOTONES SELECCIONADORES*/

#verduras {
	width: 100%;
	float: left;
	margin-top: -2%;
	margin-bottom: -4%;
}

h6 {
	font-size: 40px;
	font-family: rubik black;
	color: rgba(0,76,147,1.00);
	padding-left: 2%;
}

@media all and (max-width:1024px) {
	h6 {
		font-size: 30px;
	}
}

@media all and (max-width:736px) {
	h6 {
		font-size: 25px;
	}
}

@media all and (max-width:480px) {
	h6 {
		font-size: 20px;
	}
}

@media all and (max-width:360px) {
	h6 {
		font-size: 15px;
	}
}

#botones {
	width: 100%;
	float: left;
	background-size: 100% auto;
}

.botones img {
	width: 100%;
	height: auto;
}

.botones img ul {
	list-style: none;
}

#botonesin {
	width: 80%;
	float: left;
	margin-left: 10%;
}

#botonf {
	width:20%;
	float:left;
	/*padding: 4%;*/
}

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



@media all and (max-width:736px) {
	
	#botonesin {
	width: 90%;
	margin-left: 5%;
   }
	
}

@media all and (max-width:480px) {
	
	#botonesin {
	width: 100%;
	margin-left:0%;
   }
}

/*empieza textoproductos2*/

#productos {
	width: 100%;
	float: left;
	background-color:rgba(245,245,245,1.00);
}

#imagen {
	width: 40%;
	float: left;
	padding: 1% 0% 1% 1%;
}

#imagen img{
	width: 92%;
	height: auto;
}

#texto {
	width: 60%;
	float: left;
	padding: 1% ;
}

#text {
	width: 100%;
	float: left:
}
#calen {
	width: 100%;
	float: left:
}
#calen img {
	width: 15%;
}

#calenda {
	width: 100%;
	float: left:
}
#calenda img {
	width: 60%;
	height: auto;
}

h3 {
	color: rgba(0,76,147,1.00);
	line-height: 1px;
	font-weight: bolder;
	font-size: 22px;
}

h4 {
	color: rgba(101,101,101,1);
	font-weight: bold;
	/*line-height: 1px;*/
	font-size: 18px;
}

h5 {
	font-size: 16px;
	color: rgba(101,101,101,1);
	text-align: center;
}

#text p {
	color: rgba(101,101,101,1.00);
	text-align: justify;
	
}

#linea{
	float: left;
	width: 100%;
	
}

hr {
	float: left;
	width:60%;
	margin-left: 20%;
	
}

#variedad {
	width: 100%;
	float: left;
	background-color:rgba(245,245,245,1.00);
}

#variedadin {
	width: 50%;
	margin-left: 25%;
	float: left;
}
#variedadines {
	width: 20%;
	float: left;
	margin-left:40%;
}

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

#item-variedad {
	width: 50%;
	float: left;
	padding: 5% 5% 2% 5%;
}

#item-variedad img {
	width: 100%;
	height: auto;
}

@media all and (max-width:1280px){
	#imagen {
	width: 50%;
	float: left;
}
	#texto {
	width: 50%;
	float: left;
}
}

@media all and (max-width:1024px){
	#imagen {
	width: 60%;
	float: left;
	padding: 1% 0% 1% 1%;
}
	#texto {
	width: 40%;
	float: left;
	padding: 1% 1% 1% 0%; 
}
	h3 {
		font-size: 20px;
	}
	
	h4 {
		font-size: 16px;
	}
	
	#text p{
		font-size: 14px;
	}
	
	#calen img {
	width: 30%;
  }
	#calenda img {
	width: 90%;
	height: auto;
}
	
	#imagen img {
	width: 98%;
	height: auto;
  }

}

@media all and (max-width:768px) {
	#imagen {
		flex-direction: column;
		   -webkit-flex-direction: column;
		width: 100%;
	}
	
	#texto {
		flex-direction: column;
		   -webkit-flex-direction: column;
		width: 100%;
	}
	#imagen {
	width: 100%;
	float: left;
	padding: 1% 10% 1% 10%;
   }
	#texto {
	width: 100%;
	float: left;
	padding: 2%; 
   }
	#imagen img{
	width: 100%;
	height: auto;
   }
	
	#calen img {
	width: 20%;
   }
	
	h3 {
		font-size: 22px;
	}
	h4 {
		font-size: 18px;
	}
	#text p{
		font-size: 16px;
	}
	
	#variedadin {
		width: 70%;
		margin-left: 15%;		
	}
	
	#variedadines {
	width: 40%;
	float: left;
	margin-left: 30%;
}

}

@media all and (max-width:480px) {
	#imagen {
		flex-direction: column;
		   -webkit-flex-direction: column;
		width: 100%;
	}
	
	#texto {
		flex-direction: column;
		   -webkit-flex-direction: column;
		width: 100%;
	}
	
	#imagen {
	width: 100%;
	float: left;
	padding: 1%;
   }
	h3 {
		font-size: 22px;
	}
	h4 {
		font-size: 18px;
	}
	
	h5 {
		font-size: 15px;
	}
	#text p{
		font-size: 16px;
	}
	#calen img {
	width: 25%;
   }

}

@media all and (max-width:360px) {
	h3 {
		font-size: 22px;
	}
	h4 {
		font-size: 18px;
	}
	
	h5 {
		font-size: 15px;
	}
	#text p{
		font-size: 15px;
	}
	#calen img {
	width: 30%;
   }
	#calenda img {
		width: 100%;
	}
}