@media (max-width: 1250px)
{
	.wrapper
	{
		padding-top: 75px;
	}

	section.hero .info
	{
		width: 75%;
	}

	#productos .products ul
	{
		grid-template-columns: repeat(2, 1fr);
	}

	dialog
	{
		width: 90%;
	}

	#empleos .adn ul li.active h5
	{
		font-size: 12px;
	}

	#empleos .testimonials .testimonials_nav
	{
		right: 60px;
		top: 135px;
	}

	#empleos .testimonials .person
	{
		height: calc(var(--size) * 1.5);
		width: calc(var(--size) * 1.5);
	}

	#empleos .testimonials .quote
	{
		padding: 30px 20px 30px 130px;
	}

	#empleos .testimonials .quote p
	{
		font-size: 14px;
	}
}

@media (max-width: 800px)
{
	h1
	{
		font-size: 28px;
	}

	h2
	{
		font-size: 26px;
	}

	h3
	{
		font-size: 22px;
	}

	h4
	{
		font-size: 18px;
	}

	h5
	{
		font-size: 14px;
	}

	h6
	{
		font-size: 10px;
	}

	p,
	#empleos .microsite_vacancy li
	{
		font-size: 13px;
	}

	section > p
	{
		font-size: 14px;
	}

	dialog
	{
		width: 90% !important;
		padding: 20px !important;
	}

	section.hero .info h1
	{
		font-size: 30px;
	}

	section.hero .info p
	{
		font-size: 14px;
	}

	#index .hero .swiper
	{
		width: 100%;
		height: 75vh;
	}

	#index .hero .swiper-button-prev,
	#index .hero .swiper-button-next
	{
		display: none;
	}

	section
	{
		padding: 15px;
	}

	section.hero
	{
		padding: 0;
		height: 100% !important;
		background-size: contain !important;
		background-position: top center !important;
	}

	section.hero .info
	{
		margin: 0 !important;
		margin-top: 150px !important;
		width: 100% !important;
		border-bottom-left-radius: 0;
		border-bottom-right-radius: 0;
		overflow-y: hidden;
		max-height: unset;
		background-color: var(--verdeLSclaro);
	}

	.mosaic > div
	{
		flex-direction: column;
	}

	.mosaic > div > div
	{
		width: 100%;
	}

	.mosaic .image
	{
		order: 1;
	}

	.mosaic .text
	{
		order: 2;
		padding: 20px;
		aspect-ratio: unset;
	}

	.mosaic .image img
	{
		height: 100%;
		width: 100%;
	}

	.mosaic .text p
	{
		width: 100%;
	}

	.mosaic .text a
	{
		width: 100%;
	}

	.outline
	{
		margin: 20px;
		padding: 15px;
	}

	.outline p
	{
		width: 100%;
	}

	a.button_outline_black
	{
		font-size: 14px;
	}

	#index .message
	{
		position: absolute;
		top: 95px;
		z-index: 5;
		left: 15px;
		right: 15px;
		border-radius: var(--radius);
		padding: 15px;
		padding-right: 30px;
		text-align: left;
		font-size: 12px;
	}

	#index .message .close
	{
		right: 15px;
		top: 15px;
	}

	#index .products h1
	{
		text-align: center;
	}

	#index .products .showcase_nav
	{
		position: relative;
		width: 250px;
		height: 50px;
		margin: 0 auto;
		top: 0;
	}

	#index .products .showcase
	{
		height: auto;
		margin-bottom: 50px;
	}

	#index .products .showcase .swiper-wrapper
	{
		justify-content: unset;
	}

	#index .products .showcase .swiper-slide
	{
		padding: 0 50px;
	}

	#index .products .showcase div.normal
	{
		max-width: 265px;
		margin: auto;
	}

	#index .news .news_nav
	{
		top: 48px;
	}

	#index .news .swiper
	{
		height: auto;
		margin-bottom: 50px;
	}

	.content > div
	{
		flex-direction: column;
	}

	.content > div > div
	{
		width: 100%;
	}

	.content .image
	{
		order: 1;
	}

	.content .text
	{
		order: 2;
	}

	#index .content h2
	{
		font-size: 28px;
	}

	#index .content p
	{
		font-size: 18px;
	}

	.info ul
	{
		flex-wrap: wrap;
	}

	.info ul li
	{
		flex-basis: 50%;
	}

	#index .news > div
	{
		flex-wrap: wrap;
		gap: var(--gap);
	}

	#index .news > div .button_outline_black
	{
		margin-left: 0;
	}

	#index .news ul li
	{
		width: 100%;
		max-width: 100%;
	}

	#index .news ul li div.thumbnail
	{
		width: 100%;
	}

	#index .news ul li a
	{
		width: 50%;
	}

	#index .connect ul
	{
		gap: var(--gap);
	}

	#index .connect ul li
	{
		background-color: var(--grisClaro);
		padding: 15px;
		border-radius: var(--radius);
		width: 150px;
		text-align: left;
	}

	#index .connect ul li div
	{
		width: 100%;
	}

	#index .connect ul li img
	{
		margin-left: 0;
	}

	.tienda
	{
		flex-direction: column;
		padding: 50px;
		text-align: center;
		gap: 25px;
	}

	.tienda h3
	{
		margin: auto;
		text-align: center;
		width: 100%;
		font-size: 28px;
	}

	.tienda img
	{
		border-right: none;
		padding-right: 0;
	}

	.tienda .button
	{
		width: 100%;
	}

	.contact
	{
		padding: 15px;
		padding-bottom: 75px;
	}

	.contact h1
	{
		padding-left: 0;
		text-align: center;
		font-size: 30px;
	}

	.contact form
	{
		flex-direction: column;
	}

	.contact form button
	{
		right: 5px;
		bottom: -50px;
	}

	.contact form > div
	{
		padding: 8px;
	}

	.contact form > div > div
	{
		flex-direction: column;
	}

	footer .legal div:first-child
	{
		text-align: center;
	}

	footer .legal div:last-child
	{
		text-align: center;
		margin-top: 50px;
	}

	footer .social ul
	{
		gap: 35px;
		font-size: 32px;
	}

	#productos .goback
	{
		height: 0;
		padding: 0;
		position: relative;
	}

	#productos .goback a
	{
		margin: 0;
		position: absolute;
		z-index: 10;
		top: 15px;
		left: 10px;
		right: 10px;
		background-color: rgba(255, 255, 255, 0.5);
		border: none;
		text-align: left;
	}

	#productos .products h1
	{
		margin: 25px auto;
	}

	#productos .products ul
	{
		display: flex;
		flex-direction: column;
		gap: var(--gap);
	}

	#productos .products ul li
	{
		width: 100%;
	}

	#productos .outline .button
	{
		width: 100%;
	}

	#productos details
	{
		padding: 10px;
		margin: 0 10px 25px 10px;
		border: none;
		border-bottom: 1px solid var(--gris);
		border-radius: 0;
	}

	#productos details:last-of-type
	{
		border: none;
	}

	#productos details summary
	{
		font-size: 16px;
		flex-direction: column;
		justify-content: space-around;
		gap: var(--gap);
	}

	#productos details summary span
	{
		text-align: center;
		font-size: 22px;
	}

	#productos details p
	{
		text-align: center;
	}

	#productos .detail details ul
	{
		gap: 5px;
	}

	#productos ul.menu_product_detail a
	{
		font-size: 12px !important;
		padding: 20px;
		border-radius: 0;
		margin: 0;
		width: 100%;
		height: 45px;
		text-align: left;
		display: block;
	}

	#productos dialog
	{
		padding: 15px;
		width: 90%;
		min-height: 575px;
		max-height: unset;
	}

	#productos dialog h2
	{
		font-size: 20px;
		margin: 10px auto;
	}

	#productos div.product_detail
	{
		height: unset;
	}

	#productos div.product_detail .product_detail_info
	{
		flex-direction: column;
	}

	#productos div.product_detail .swiper-slide img
	{
		max-width: 40%;
		max-height: 300px;
	}

	#productos div.product_detail .swiper-slide td img
	{
		max-width: unset;
	}

	#productos div.product_detail .swiper-slide:not(.product_detail_info) img
	{
		max-width: unset
	}

	#productos div.product_detail .product_detail_info > div:first-child
	{
		width: 100%;
		height: 50%;
	}

	#productos div.product_detail .product_detail_info > div:last-child
	{
		max-height: 300px;
	}

	#productos ul.menu_product_detail span.selection
	{
		display: block;
		width: 100%;
		background-color: var(--verdeLSclaro);
		color: white;
		padding: 22px;
		text-align: left;
		font-size: 12px;
		border-top-left-radius: 25px;
		border-top-right-radius: 25px;
		position: absolute;
		left: 0;
		top: 0;
	}

	#productos ul.menu_product_detail.collapsed span.selection
	{
		border-radius: 25px;
	}

	#productos .detail ul
	{
		justify-content: flex-start;
	}

	#productos details > ul
	{
		display: flex;
		justify-content: flex-start;
	}

	#productos ul.menu_product_detail
	{
		display: block;
		position: relative;
		z-index: 5;
		height: 45px;
		line-height: 0;
		border-radius: 25px;
		margin: 20px auto;
		overflow: visible;
		padding-top: 45px;
	}

	#productos ul.menu_product_detail.collapsed
	{
		overflow: hidden;
	}

	#productos ul.menu_product_detail.collapsed li
	{
		display: none;
	}

	#productos ul.menu_product_detail li
	{
		max-width: unset !important;
		display: block;
	}

	#productos ul.menu_product_detail i
	{
		display: block;
		position: absolute;
		right: 15px;
		top: 12px;
		color: white;
		font-size: 20px;
	}

	#productos ul.subcategories_list
	{
		gap: var(--gap) !important;
	}

	#productos .swiper.subcategories .swiper-slide > ul
	{
		grid-template-columns: repeat(auto-fit, 175px)
	}

	#nutricion .mosaic > div > div
	{
		aspect-ratio: unset;
	}

	#comunidad .educational ul,
	#comunidad .initiatives ul
	{
		display: flex;
		flex-wrap: wrap;
	}

	#comunidad .educational ul li,
	#comunidad .initiatives ul li
	{
		flex-basis: 100%;
	}

	#comunidad .educational ul li
	{
		flex-direction: column;
	}

	#comunidad .educational ul li > div
	{
		max-width: 100%;
	}

	#comunidad .educational ul li > div img
	{
		width: 100%;
	}

	#comunidad .initiatives ul li .button
	{
		width: 100%;
	}

	.wheel .arc .plus
	{
		top: 7%;
		width: 20px;
		height: 20px;
	}

	ul.timeline li
	{
		padding: 0 0 0 25px;
	}

	ul.timeline li:nth-child(2n+1)
	{
		padding: 0 25px 0 0;
	}

	ul.timeline li.active
	{
		width: 100%;
		height: auto;
		padding: 10px;
		text-align: left;
	}

	ul.timeline li.active.v1
	{
		padding-right: 10px;
	}

	ul.timeline li.active.v1 img
	{
		position: relative;

		width: 100vw;
		left: 50%;
		right: 50%;
		margin-left: -50vw;
		margin-right: -50vw;

		transform: translateY(0);
	}

	ul.timeline li.active.v2
	{
		padding: 10px;
		padding-left: 10px;
		padding-right: 10px;
	}

	ul.timeline li.active.v2 *
	{
		order: 2;
	}

	ul.timeline li.active.v2 img
	{
		position: relative;
		top: 0;
		left: 0;
		width: 70%;
		height: auto;
		order: 1;
		margin: -40px auto 25px auto;
	}

	ul.timeline li.active.v3
	{
		width: unset;
	}

	ul.timeline li.active.v3r
	{
		margin-left: unset;
	}


	#quienes-somos .circuit
	{
		background-size: contain;
	}

	#quienes-somos .circuit .circle
	{
		width: 100%;
	}

	#quienes-somos .circuit .circle h4
	{
		font-size: 24px;
	}

	#quienes-somos .circuit p
	{
		font-size: 14px;
	}

	#quienes-somos .circuit .secondary:nth-child(1) > div:last-child
	{
		margin-top: 0;
		margin-left: 0;
	}

	#quienes-somos .numbers > div
	{
		flex-direction: column;
	}

	#quienes-somos .numbers > div h1
	{
		font-size: 26px;
	}

	#quienes-somos .numbers > div h2
	{
		font-size: 26px;
	}

	#quienes-somos .numbers > div h3
	{
		font-size: 16px;
	}

	#quienes-somos .numbers p
	{
		font-size: 12px;
	}

	#quienes-somos .work
	{
		flex-direction: column;
	}

	#quienes-somos .work div
	{
		width: 100%;
		padding: 25px;
	}

	#quienes-somos .work div:first-child
	{
		height: 225px;
	}

	#quienes-somos .work div h1
	{
		font-size: 24px;
	}

	#quienes-somos .work div p
	{
		font-size: 14px;
	}

	#quienes-somos .work a.button
	{
		width: 100%;
	}

	#quienes-somos svg
	{
		left: -200px !important;
	}

	#quienes-somos .numbers > div > div:last-of-type
	{
		margin-top: -150px;
		z-index: 1;
		display: flex;
		width: 100%;
		flex-wrap: wrap;
	}

	#quienes-somos .numbers > div > div > div:first-child
	{
		flex: unset;
		width: 100%;
	}

	#quienes-somos .numbers > div > div > div
	{
		width: 50%;
	}

	#quienes-somos dialog
	{
		margin: auto;
		width: 90%;
		max-width: 90% !important;
	}

	#quienes-somos dialog.map_info ul.locations
	{
		column-count: 1;
	}

	#quienes-somos .circuit
	{
		background-position: top center;
	}

	#quienes-somos .circuit .circle
	{
		position: relative;
		height: 385px;
		margin: 75px 0 0 0;

		background-image: url("../img/logo.svg");
		background-repeat: no-repeat;
		background-position: bottom center;
		background-size: 40%;
	}

	#quienes-somos .circuit .circle p
	{
		font-size: 14px;
	}

	#quienes-somos .circuit .circle_aux
	{
		display: block;
		border-top: 1px solid var(--verdeLSclaro);
		border-radius: 50%;
		height: 110vh;
		width: 200%;
		left: -50%;
		position: absolute;
		top: 200px;
	}

	#quienes-somos .circle .main
	{
		background-image: none;
		width: 100%;
		border: none;
	}

	#quienes-somos .circuit .circle .swiper-button-prev,
	#quienes-somos .circuit .circle .swiper-button-next
	{
		display: flex;
		border: 1px solid var(--verdeLSclaro);
		top: -15px;
		border-radius: 50%;
		width: 40px;
		height: 40px;
		color: var(--verdeLSclaro);
	}

	#quienes-somos .circuit .circle .swiper-button-prev::after,
	#quienes-somos .circuit .circle .swiper-button-next::after
	{
		content: "";
	}

	#quienes-somos .circle .main .secondary
	{
		flex-direction: column;
		align-items: center;
		left: 0;
		width: 100%;
		text-align: center;
		top: -45px;
		position: relative;
	}

	#quienes-somos .circuit .secondary > div:last-child
	{
		width: 85%;
	}

	.secondary:nth-child(1),
	.secondary:nth-child(2),
	.secondary:nth-child(3),
	.secondary:nth-child(4),
	.secondary:nth-child(5)
	{
		left: 0;
		top: 0;
	}

	#sustentabilidad .policy
	{
		padding-left: 0;
		padding-right: 0;
	}

	#sustentabilidad .policy ul
	{
		flex-wrap: nowrap;
		justify-content: initial;
	}

	#sustentabilidad .policy ul li:first-child
	{
		margin-left: 15px;
	}

	#sustentabilidad .policy ul li:last-child
	{
		margin-right: 15px;
	}

	#sustentabilidad .alliances ul
	{
		gap: 15px;
	}

	#sustentabilidad .alliances ul li
	{
		max-width: 170px;
	}

	#sustentabilidad .alliances ul li img
	{
		width: 100%;
	}

	#sustentabilidad .reports .button
	{
		padding: 10px;
		border-radius: 35px;
	}

	#prensa .news ul.list
	{
		display: flex;
		flex-direction: column;
	}

	#prensa .news ul.list li,
	#prensa aside ul.list li
	{
		width: 100%;
		max-width: 100%;
	}

	#prensa .news nav
	{
		flex-direction: column;
	}

	#prensa .news nav.categories
	{
		border-bottom: none;
		margin-bottom: 0;
	}

	#prensa .news nav.categories button:first-child
	{
		margin-right: unset;
		order: 2;
		width: 90%;
	}

	#prensa .news nav.categories ul
	{
		overflow-x: auto;
		width: 100%;
		order: 1;
	}

	#prensa .news nav.categories ul li a
	{
		white-space: nowrap;
		font-size: 18px;
	}

	#prensa .news nav.categories button.filter
	{
		margin: 30px;
		width: 90%;
		order: 3;
	}

	#prensa .news nav.filter
	{
		flex-direction: row;
	}

	#prensa .news nav.filter ul
	{
		order: 2;
		overflow-x: auto;
	}

	#prensa .news nav.filter .go_all
	{
		order: 1;
		border: 1px solid var(--grisOscuro);
		border-radius: var(--radius);
		font-family: "Gotham-Bold";
	}

	#prensa .news nav.filter .go_left,
	#prensa .news nav.filter .go_right
	{
		display: none;
	}

	#prensa .news_single
	{
		padding-top: 0px;
	}

	#prensa .news_single > div
	{
		padding: 25px;
	}

	#prensa .news_single > div:last-child
	{
		flex-direction: column;
	}

	#prensa .news_single > div aside
	{
		width: 100%;
		max-width: 100%;
	}

	#prensa .pagination
	{
		gap: 5px;
	}

	#prensa .pagination li a.button
	{
		width: 25px;
		height: 35px;
		display: flex;
		justify-content: center;
	}

	#empleos .submenu
	{
		display: none;
	}

	#empleos .submenu ul
	{
		overflow-x: auto;
	}

	#empleos .join
	{
		flex-direction: column-reverse;
	}

	#empleos .join div
	{
		width: 100%;
		padding: 25px;
	}

	#empleos .join div p
	{
		margin: 25px 0;
	}

	#empleos .join a
	{
		width: 100%;
		margin: 0;
	}

	#empleos .vacancy
	{
		display: flex;
		flex-direction: column;
		padding: var(--gap);
	}

	#empleos .vacancy > div
	{
		flex-direction: column;
		text-align: center;
	}

	#empleos .vacancy a
	{
		width: 100%;
		margin: 0;
	}

	#empleos .why_work
	{
		flex-direction: column;
		margin: 0;
		border-radius: 0;
	}

	#empleos .why_work div
	{
		width: 100%;
		padding: 25px;
	}

	#empleos .why_work div:first-child
	{
		background-position: center;
		width: 100%;
		height: 225px;
	}

	#empleos .adn
	{
		padding: 25px;
	}

	#empleos .adn ul
	{
		display: flex;
		overflow-x: scroll;
		flex-wrap: nowrap;
	}

	#empleos .adn ul li
	{
		height: 350px;
		width: 230px;
		max-height: 350px;
		max-width: 230px;
	}

	#empleos .benefits
	{
		padding: 25px;
	}

	#empleos .benefits ul
	{
		display: flex;
		overflow-x: scroll;
		flex-wrap: nowrap;
	}

	#empleos .areas object
	{
		width: 100%;
	}

	#empleos .testimonials .testimonials_nav
	{
		right: 15px;
		top: 170px;
	}

	#empleos .testimonials .swiper
	{
		margin-top: 60px;
	}

	#empleos .testimonials .swiper-slide
	{
		display: flex;
		justify-content: space-between;
		height: 550px;
		min-height: 550px;
		max-height: 550px;
	}

	#empleos .testimonials .person
	{
		top: 0;
		left: calc(50% - var(--size));
		height: calc(var(--size) * 2);
		width: calc(var(--size) * 2);
	}

	#empleos .testimonials .quote
	{
		width: 100%;
		margin-left: 0;
		margin-top: 50px;
		padding: 200px 20px 20px 20px;
	}

	#empleos .internships
	{
		flex-direction: column;
	}

	#empleos .internships div
	{
		width: 100%;
		padding: 25px;
	}

	#empleos .internships div:first-child
	{
		padding-bottom: 0;
	}

	#empleos .internships div:first-child h1
	{
		display: block;
		text-align: left;
		margin: 15px 0;
	}

	#empleos .internships div:last-child
	{
		padding-top: 0;
	}

	#empleos .internships div:last-child h1
	{
		display: none;
	}

	#empleos .internships div p
	{
		margin: 25px 0;
	}

	#empleos .internships a
	{
		width: 100%;
	}
}

@media (max-width: 380px)
{
	#nutricion .myths ul li div
	{
		padding: 20px;
	}

	#nutricion .myths ul li div p
	{
		font-size: 12px;
	}
}