@media only screen and (max-width:1750px) {

	#we, 
	#solutions,
	#sustainable,
	#environement,
	#logros {
		overflow: hidden;
	}

	#team .interview {
		flex-direction: column;
	}

	#work div.title{
		padding-left: 20px;
		padding-right: 20px;
	}
	
	#work div.w-80.grid.grid-cols-2{
		grid-template-columns: repeat(1, 1fr);
		gap: 20px;
	}

	#work div.w-full.flex.items-start > div{
		width: 50%;
	}

}

@media only screen and (max-width:1600px) {
	
	#header form {
		margin-inline: 75px 20px;
		width: 100%;
		display: flex;
		justify-content: flex-end;
	}

	.home #hero,
	.home #banner > div {
		height: 500px;
	}

	.block-4{
		padding-inline: var(--padding-30);
	}

	#our_help .title p {
		width: 70%;
	}

}

@media only screen and (max-width:1500px) {

	#header .menu {
		margin-left: var(--padding-40);
		margin-right: var(--padding-20);
	}

	#header form {
		margin-inline: 20px;
	}

	.home #hero,
	.home #banner > div {
		height: 450px;
	}
	
	.product .hero .block-2{
		padding-inline: var(--padding-30);
	}

	#sustainable .info{
		padding-inline:  var(--padding-40);
	}

	#delegations .map svg{
		width: 100%;
		height: 100%;
	}

	#delegations {
		justify-content: center;
	}
}

@media only screen and (max-width:1400px) {
	.block-5{
		padding-inline: var(--padding-30);
	}

	#clients .my_clients {
		padding-inline: 0;
	}

	#video{
		padding-inline: var(--padding-30);
	}

	.block-5.video {
		padding-inline: 0px;
	}

	#header .menu.mobile{
		display: flex
	}

	#team article,
	#team article.active {
		width: calc(50% - 2px);
	}

	#team article figure,
	#team article.active figure {
		width: 50%;
	}

	#team article .info,
	#team article.active .info{
		opacity: 1;
		pointer-events: all;
		left: 50%;
	}

}

@media only screen and (max-width:1300px) {

	#header nav {
		justify-content: space-between;
	}

	.block-1,
	.block-2,
	.block-3,
	.block-4,
	.block-5{
		max-width: 100%;
		padding-inline: var(--padding-30);
	}

	.home #hero, .home #banner > div{
		padding: 0;
	}

	.home #hero, .home #banner .info{
		padding-left: 40px;
	}

	#clients .my_clients{
		grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
		padding-inline: 0;
	}

	#numbers > div{
		margin-inline: var(--padding-30);
	}

	.home #hero .slide .content{
		width: 55%;
	}

	#header form{
		margin-inline: 75px 20px;
		margin-inline:  0;
	}

	article.slider .block-2 {
		flex-direction: column;
		gap: var(--gap-60);
	}

	#environement {
		gap: var(--gap-60);
	}

	#environement article {
		flex-direction: column;
		gap: var(--gap-60);
	}

	#environement article:first-of-type figure{ 
		order: 1;
	}

	#environement .last {
		padding-bottom: 0;
	}

	#our_solutions .grid {
		grid-template-columns: 100%;
		gap: var(--gap-60);
	}

	#our_solutions .datas {
		padding-left: 0;
		padding-bottom: 0;
	}

	.data:not(:last-child) .number::after {
		height: 100%;
		top: 40px;
	}

	#environement article .w-50 {
		width: 100%;
	}

	article.slider .block-2 {
		align-items: flex-start;
	}

	article.slider .w-66 {
		width: 100%;
		order: 1;
	}

	article.slider .w-33 {
		width: 60%;
	}

	section .big-title{
		margin-bottom: -7%;
	}

	#success .client.small,
	#success .client.big {
		width: calc((100%/2) - 10px);
	}

	#success .logo figcaption{
		width: 50%
	}

	#success .logo img {
		width: 200px;
		height: auto;
		object-fit: cover;
		filter: none;
		opacity: 1;
	}

	#sustainable .info {
		flex-direction: column;
		gap: var(--gap-40);
	}

	#sustainable .w-66 {
		width: 100%;
		justify-content: center;
		order: 1;
	}

	#sustainable .w-33 {
		width: 55%;
	}

	#help > div {
		grid-template-columns: 1fr 1fr;
	}

	#help .contact {
		grid-column: 1 / -1;
		border-top: 1px solid var(--grey-200);
	}

	.product .hero .info h1{
		width: 70%;
	}

	.product .hero figure{
		width: 30%;
	}

	#environement article .w-50 {
		padding-left: 0
	}

	#solutions .box {
		padding-inline: 0;
	}

	#hero.small {
		margin-bottom: 60px;
	}

}
	
@media only screen and (max-width:1200px) {

	:root {

		--size-2000: 180px;
		--size-1250: 105px;
		--size-900: 70px;
		--size-800: 70px;
		--size-750: 40px;
		--size-700: 35px;
		--size-600: 28px;
		--size-500: 24px;
		--size-400: 20px;
		--size-300: 16px;

		--padding-200: 180px;
		--padding-160: 140px;
		--padding-130: 120px;
		--padding-125: 115px;
		--padding-100: 90px;
		--padding-80: 70px;
		--padding-60: 50px;
		--padding-50: 45px;
		--padding-40: 35px;
		--padding-30: 25px;
		--padding-25: 25px;
		--padding-20: 20px;
		--padding-10: 10px;

		--margin-125: 125px;
		--margin-100: 100px;

		--gap-100: 90px;
		--gap-90: 80px;
		--gap-80: 70px;
		--gap-60: 50px;
		--gap-50: 45px;
		--gap-40: 35px;
		--gap-30: 25px;
		--gap-20: 20px;
		--gap-15: 15px;
		--gap-10: 10px;
	}

	#header {
		height: 70px;
	}

	#header nav {
		padding: 0 20px;
	}

	#header #menu {
		display: flex;
	}

	.admin #header .secondary {
		grid-template-columns: 30px 30px 40px;
	}


	#header .menu .first .second,
	#header .menu .first:hover .second {
		transform: none;
	}

	.topbar .block-2{
		padding: 0;
	}

	.topbar .block-2 .info {
		flex-direction: column;
		gap: 10px;
		align-items: start;
		padding-left: 14px;
	}

	.topbar .block-2 .info > div:first-child{
		display: flex;
	}

	.topbar .block-2 .info > div{
		display: none;
	}

	.topbar .micuenta a {
		transition: var(--transition-400);
		padding: 0 20px;
	}

	#hero.big {
		height: auto;
		margin-bottom: 20px;
	}

	#hero.big > div{
		padding: 20px 0;
	}

	.home #banner > .block-2{
		flex-direction: column;
	}

	.home #banner > .block-2 .inclinado{
		width: 100%;
		height: 80px;
		left: 0;
		bottom: 0;
		top: auto;
	}

	.home #hero, .home #banner > div {
		height: auto;
	}

	.home #hero, .home #banner .swiper {
		aspect-ratio: 16/9;
	}

	.home #banner > .block-2 > div{
		width: 100%;
	}

	.home #banner > .block-2 > div.info {
		order: 2;
		justify-content: space-between;
		padding: 40px;
		padding-top: 0;
	}

	.home #banner > .block-2 > div.info > div.links{
		align-items: end;
	}

	#banners > div {
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}

	.home #banners figure {
		width: 100%;
		height: auto;
		transition: var(--transition-700);
	}

	.block-1, .block-2, .block-3, .block-4, .block-5 {
		padding-inline: 20px;
	}

	#solutions .box {
		flex-direction: column;
		height: auto;
	}

	#solutions article {
		height: 360px;
	}

	#solutions article figure {
		opacity: 1;
	}

	#solutions .box > figure {
		display: none;
	}

	#solutions article {
		position: relative;
	}

	#header .navbar {
		width: 100%;
		height: 100%;
		border-top: 2px solid var(--grey-100);
		background-color: #fff;
		opacity: 0;
		pointer-events: none;
		transition: all 560ms ease;
		position: fixed;
		top: 73px;
		left: 0;
	}

	#intro .w-10,#intro .w-20,#intro .w-30,#intro .w-33,#intro .w-40,#intro .w-45,#intro .w-50,#intro .w-55,#intro .w-60,#intro .w-70,#intro .w-80,#intro .w-90,
	#before-after .w-10,#before-after .w-20,#before-after .w-30,#before-after .w-33,#before-after .w-40,#before-after .w-45,#before-after .w-50,#before-after .w-55,#before-after .w-60,#before-after .w-70,#before-after .w-80,#before-after .w-90,
	#solution .w-10,#solution .w-20,#solution .w-30,#solution .w-33,#solution .w-40,#solution .w-45,#solution .w-50,#solution .w-55,#solution .w-60,#solution .w-70,#solution .w-80,#solution .w-90,
	#posts .w-10,#posts .w-20,#posts .w-30,#posts .w-33,#posts .w-40,#posts .w-45,#posts .w-50,#posts .w-55,#posts .w-60,#posts .w-70,#posts .w-80,#posts .w-90,
	#FAQ .w-10,#FAQ .w-20,#FAQ .w-30,#FAQ .w-33,#FAQ .w-40,#FAQ .w-45,#FAQ .w-50,#FAQ .w-55,#FAQ .w-60,#FAQ .w-70,#FAQ .w-80,#FAQ .w-90,
	.aspect-video.w-50{
		width: 100%;
	}

	.active_menu #header .navbar {
		opacity: 1;
		pointer-events: all;
	}
	
	#header .navbar .search {
		display: none;
	}
	
	#header .navbar form {
		height: 50px;
		padding-left: 25px;
		position: absolute;
		top: 0;
	}
	
	#header .navbar .secondary {
		height: 50px;
		position: absolute;
		top: 0;
		right: 30px;
	}

	#header .menu {
		width: 100%;
		min-height: auto;
		height: calc(100% - 50px);
		border-top: 1px solid var(--grey-100);
		overflow-y: auto;
		overflow-x: hidden;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		gap: 25px;
		position: absolute;
		top: 50px;
		right: -100%;
		background-color: #fff;
		padding: var(--padding-30);
		margin: 0;
		pointer-events: none;
		opacity: 0;
		transform: translateX(15%);
		transition: var(--transition-600);
	}

	.active_menu #header .menu  {
		right: 0;
		opacity: 1;
		pointer-events: all;
		transform: none;
	}

	#header .menu .first,
	#header .menu .second{
		pointer-events: all;
		cursor: default;
	}

	#hero {
		padding: 0;
	}

	#breadcrumbs{
		padding: 0 10px;
	}

	.active_menu #header #menu span {
		width: 0;
	}
	
	.active_menu #header #menu::before {
		transform: rotate(-45deg);
		top: 50%;
	}

	.active_menu #header #menu::after {
		transform: rotate(45deg);
		top: 50%;
	}
	
	#header .menu .first,
	#header .menu .first > a {
		width: fit-content;
		min-height: fit-content;
		height: fit-content;
	}

	#header .menu .first > a {
		padding: 0;
		justify-content: flex-start;
		align-items: flex-start;
	}

	#header .menu .first .second {
		gap: 15px;
		display: flex;
		position: static;
		opacity: 1;
		border: none;
		transition: none;
	}

	#header .menu .first > a span {
		color: black;
	}

	#header .menu .first > a::after {
		display: none;
	}

	#header .menu .second > div a {
		padding: 0 0 0 20px;
		margin: 0;
		font-size: 16px;
	}
	
	#header .menu .first:hover > a::after {
		transform: none;
	}

	#header .menu .second marker {
		display: none
	}

	.pop.items-list {
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		max-width: 100%;
		transform: none;
	}

	.pop.items-list .cart_title {
		padding-top: 20px;
		padding-bottom: 20px;
	}

	#products .loop {
		grid-template-columns: 1fr 1fr;
	}

	#products > .grid {
		grid-template-columns: 100%;
		padding-bottom: 20px;
	}

	#products-nav {
		flex-direction: row;
		gap: 10px;
		overflow-x: scroll;
		border: none;
	}

	#products-nav > div {
		width: fit-content;
		min-width: fit-content;
		position: relative;
		border: none;
	}

	#products-nav .checks{
		flex-direction: row;
		white-space: nowrap;
		gap: 20px;
		padding: 13px;
	}

	#products div.pagination {
		grid-column: 1;
	}

	#products > .grid article .h3 {
		padding: 20px 10px;
	}

	.single article .block-5 {
		flex-direction: column;
	}

	.single article .block-5 > div,
	.single article .block-5 > section {
		width: 100%;
	}

}

@media only screen and (max-width:1100px) {

	#delegations .location{
		flex-direction: column;
		gap: var(--gap-80);
	}

	#delegations .location .map {
		width: 80%;
		order: 1;
	}

	#delegations .offices {
		width: 100%;
	}

	#footer > .main {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: var(--gap-60) var(--gap-40);
	}

	#footer > .main > div {
		width: 100%;
		padding-right: 0;
	}

	#footer p {
		width: 100%;
	}

	#help .social a {
		font-size: var(--size-400);
		width: 60px;
		height: 60px;
	}

	.product .hero .info {
		flex-direction: column;
	}

	.product .hero figure {
		position: relative;
		right: 0;
		bottom: 0;
	}

	#supplement .grid, 
	.looking .products .grid,
	.looking .tutorials .grid, 
	.looking .news .grid {
		grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
	}

	#related .grid {
		grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
	}

	#buzon {
		padding-left: 20px;
		padding-right: 20px;
	}

}


@media only screen and (max-width:1024px) {
	.home #hero .slide .content{
		width: 75%;
	}

	#sustainable .quantities .kgs {
		min-height: 350px;
	}

	#cta > div {
		flex-direction: column;
	}

	#cta figure{
		display: flex;
		justify-content: center;
		align-items: center;
		order: 1;
	}

	#cta figure img {
		max-width: 450px;
	}

	#numbers .grid {
		grid-template-columns: 100%;
	}

	#numbers article:not(:first-child) {
		border:  none;
		border-top: 2px solid white;
	}

	.blog #posts > div, 
	.post #post > div{
		grid-template-columns: 100%;
	}

	#sidebar .most_read {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
	}

	#sidebar .most_read .h3{
		grid-column: 1/-1;
	}

	#sidebar .categories > div{
		display: grid;
		grid-template-columns: repeat(auto-fit,minmax(220px, 1fr));
	}

	#cta .title, .cta .title, #message .title {
		padding-bottom: 0
	}

	.cta.right > div,
	.cta.left > div{
		flex-direction: column;
		gap: var(--gap-60);
	}

	#our_help .title p {
		width: 100%;
	}

}

@media only screen and (max-width: 920px) {


	:root {

		--padding-200: 80px;
		--padding-160: 100px;
		--padding-130: 80px;
		--padding-125: 80px;
		--padding-100: 70px;
		--padding-80: 60px;
		--padding-60: 40px;
		--padding-50: 35px;
		--padding-40: 30px;
		--padding-30: 25px;
		--padding-25: 15px;
		--padding-20: 15px;
		--padding-10: 10px;

		--margin-125: 80px;
		--margin-100: 80px;

		--gap-100: 80px;
		--gap-90: 70px;
		--gap-80: 60px;
		--gap-60: 40px;
		--gap-50: 35px;
		--gap-40: 30px;
		--gap-30: 25px;
		--gap-20: 20px;
		--gap-15: 15px;
		--gap-10: 10px;
	}

	#hero.small{
		margin-bottom: 10px;
	}

	.block-6 {
		padding-inline: var(--padding-30);
	}

	#work div.title .w-40{
		width: 100%;
	}
	
	#work div.w-full.flex.items-start{
		flex-direction: column;
	}

	#work div.w-full.flex.items-start > div{
		width: 100%;
	}

	#news .news {
		grid-template-columns: 100%;
		gap: var(--gap-40);
	}

	#help .social > div {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: var(--gap-20);
	}

	#we .title, #logros .w-33,
	#sustainable .w-33 {
		width: 100%;
	}

	#goals .grid {
		grid-template-columns: 100%;
	}

	#goals article {
		min-height: 350px;
	}

	#environement {
		gap: var(--gap-60);
	}

	#environement article {
		gap: var(--gap-40);
	}

	#environement article figure {
		order: 1;
	}

	#environement article .title {
		padding-left: var(--padding-30)
	}

	#save .box {
		flex-direction: column;
	}

	#save .box > div {
		width: 100%;
	}

	#save .graphics {
		width: 100%;
	}

	#cat-landing .block-5{
		flex-direction: column;
	}

	#cat-landing .block-5 > div{
		width: 100%;
	}

	#cat-landing .block-5 > div:first-child{
		order: 2;
	}

	#team article,
	#team article.active {
		width: calc(100% - 2px);
	}

	#our_help .row-1,
	#our_help .row-2 {
		gap: 2px;
	}
	
	#our_help .row-2 {
		margin-top: 1px;
	}

	#our_help figure figcaption,
	#air figure figcaption {
		padding: 20px;
	}

	#our_help figure figcaption > div,
	#air figure figcaption > div {
		display: none;
	}

	#our_help figure figcaption > div i,
	#air figure figcaption > div i {
		display: none;
	}

	#success .client.small a {
		display: none;
	}

	#success .client.small .logo {
		flex-direction: column;
	}	
	
	#success .client.small .logo figcaption {
		width: 100%;
		padding-bottom: 0;
		font-size: 16px;
		text-align: center;
		position: static;
	}

	#success .client.small .logo::after {
		display: none;
	}
	
	#solutions .info p {
		max-height: inherit;
	}

	#solutions article:not(.active) .info {
		opacity: 1;
	}

	.product .content {
		flex-wrap: wrap;
	}

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

	.product .content .w-55 {
		height: fit-content;
	}

	.cta.full p, #message p {
		width: 90%;
	}

	#categories .grid {
		grid-template-columns: 100%;
	}

	#supplement .grid, 
	.looking .products .grid,
	.looking .tutorials .grid, 
	.looking .news .grid,
	#related .grid {
		grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	}

	#product article .w-40 .block-5 .quantity > .flex{
		flex-direction: column;
		gap: 20px;
	}

	#product article .w-40 .block-5 .quantity > .flex > div:last-child {
		flex-direction: row;
		gap: 10px;
		align-items: center;
		justify-content: center;
	}

	#product article .w-40 .block-5{
		margin-top: 25px;
	}

	#product article.block-5{
		flex-direction: column;
	}

	#product article.block-5 > div{
		width: 100%;
		padding-left: 0;
		padding-right: 0;
	}

	#product .product-panel > div{
		width: 100%;
		padding-left: 0;
		padding-right: 0;
	}

	.checkout .cart article {
      	grid-template-columns: 1fr 1fr 1fr;
	}

    .checkout .cart article > div:first-child {
      grid-column: 1 / span 3;
    }

    .checkout .shipping form, .checkout .billing form{
    	display: flex;
    	flex-direction: column;
    	gap: 20px;
    }

	.checkout form .select2.select2-container {
		width: 100% !important;
		min-width: 100%;
		max-width: 100%;
	}
	
	.checkout form .shipping-methods > div {
		display: flex;
	}

	#buzon .block-5{
		flex-direction: column;
	}

	#buzon .block-5 .w-70{
		width: 100%;
	}

}


@media only screen and (max-width:767px) {

	:root {

		--padding-200: 80px;
		--padding-160: 80px;
		--padding-130: 80px;
		--padding-125: 80px;
		--padding-100: 70px;
		--padding-80: 40px;
		--padding-60: 40px;
		--padding-50: 35px;
		--padding-40: 30px;
		--padding-30: 25px;
		--padding-25: 15px;
		--padding-20: 15px;
		--padding-10: 10px;

		--margin-125: 60px;
		--margin-100: 50px;

		--padding-120: 60px;
		--space-120: 60px;
		--space-40: 20px;
		--gap-100: 80px;
		--gap-90: 70px;
		--gap-80: 40px;
		--space-80: 40px;
		--space-60: 30px;
		--gap-60: 40px;
		--gap-50: 35px;
		--gap-40: 30px;
		--gap-30: 25px;
		--gap-20: 20px;
		--gap-15: 15px;
		--gap-10: 10px;

		--size-2000: 150px;
		--size-1250: 90px;
		--size-900: 60px;
		--size-800: 40px;
		--size-750: 30px;
		--size-700: 25px;
		--size-600: 22px;
		--size-500: 20px;
		--size-400: 18px;
		--size-300: 14px;
	}

	section .title > span::before,
	section .title.mid span::after {
		width: 15px;
	}

	.stability #intro .block-5 {
		flex-direction: column-reverse;
		padding: 0;
	}

	.stability #before-after .examples {
		gap: 60px;
	}

	.stability #before-after .examples > div {
		flex-direction: column;
	}
	
	.stability #before-after .examples > div .w-30 {
		display: flex;
		flex-direction: column;
		gap: 0;
	}

	.stability #before-after .examples > div .text-right {
		text-align: left;
	}
	
	#reviews .voices {
		padding: 0;
		gap: 60px;
	}

	#reviews .voices > div {
		flex-direction: column;
	}
	
	#reviews .voices > div:nth-child(even) {
		flex-direction: column-reverse;
	}
	
	#reviews .voices > div span {
		text-align: center;
	}
	
	#reviews .voices > div p {
		padding-left: 0;
	}

	#itemsList {
		flex-direction: column;
		gap: var(--gap-60);
		align-items: center;
	}

	#itemsList > div {
		width: 100%;
	}

	.stability #optimized .grid {
		padding: 0;
		display: flex;
		flex-direction: column;
	}
	
	.stability #optimized .grid .datas {
		padding-left: 0;
	}
	
	.stability .methods {
		display: flex;
		flex-direction: column;
	}

	.compressed #solution .block-5 {
		padding: 0;
		flex-direction: column-reverse;
	}
	
	.compressed #solution .block-5 .w-55 figure {
		position: static;
	}
	
	.compressed #service .grid > div {
		gap: 10px;
	}
	
	.compressed #production .grid {
		padding: 0;
		display: flex;
		flex-direction: column-reverse;
	}

	.dfl #intro .text {
		padding: 0;
	}

	.dfl #intro .text {
		flex-direction: column;
	}

	.dfl #automate .methods {
		display: flex;
		flex-direction: column;
	}

	.dfl #optimize .block-5 {
		padding: 0;
		display: flex;
		flex-direction: column-reverse;
	}

	.dfl #roboptipall .block-5,
	.company #president .block-5.grid {
		padding: 0;
		display: flex;
		flex-direction: column;
	}
	
	.company #president .block-5 {
		padding: 0;
	}

	.company #intro .block-5.grid {
		padding: 0;
		display: flex;
		flex-direction: column-reverse;
	}

	.company #president blockquote {
		margin-top: 30px;
	}

	.company .member,
	.company .member figure,
	#team article figure,
	#team article.active figure {
		width: 100%;
	}
		
	.member.active .info::before {
		display: none;
	}

	.company .members .flex-wrap{
		gap: 25px;
	}

	.company .member {
		align-items: start;
		height: fit-content;
		background-color: transparent;
	}

	#team .members{
		padding: 0 20px;
	}

	.company .member .info, .company .member.active .info {
		width: 100%;
		opacity: 1;
		position: static;
		overflow: hidden;
		padding-left: 20px;
	}

	.company .member figure,
	.company #team .members article.member figure{
		width: 50%;
	}

	.company #gallery .block-5 {
		padding: 0;
	}
	
	.company #mission .block-5 {
		padding: 0;
		display: flex;
		flex-direction: column-reverse;
	}

	.company #mission .block-5 figure {
		position: static;
	}

	.company #goals .grid article {
		padding: 0;
	}

	#environement .data:not(:last-child) .number::after, .data:not(:last-child) .number::after {
		display: none;
	}

	#success .grid {
		display: flex;
		flex-direction: column;
	}

	#success .examples article figure {
		min-height: auto;
	}
	
	.sustainability #create .block-4 {
		display: flex;
		flex-direction: column;
	}

	.sustainability #reduction .block-5 {
		display: flex;
		flex-direction: column;
		gap: 0;
	}
	
	.sustainability #reduction > div:last-of-type {
		flex-direction: column-reverse;
	}

	.sustainability #goals .grid {
		gap: 40px;
	}
	
	.sustainability #goals .grid article {
		padding: 0;
	}
	
	.sustainability #reviews .voices {
		gap: 60px;
	}

	.sustainability #reviews .voices > div {
		display: flex;
		flex-direction: column;
	}

	.sustainability #reviews .voices > div:nth-child(even) {
		flex-direction: column-reverse;
	}

	#quality_policy .block-5 {
		flex-direction: column;
	}

	#quality_policy nav {
		border-bottom: 0;
		border-right: 2px solid var(--grey-100);
		display: block;
		white-space: nowrap;
		overflow: auto;
		scroll-snap-type: x mandatory;
		background-color: #fff;
		position: static;
	}
	
	#quality_policy nav span {
		border-bottom: 0;
		display: inline-block;
		scroll-snap-align: start;
	}

	#quality_policy nav span.active::after {
		display: none;
	}

	.work #solution .block-3 .block-5 {
		padding: 0;
		display: flex;
		flex-direction: column-reverse;
	}
	
	.work #jobs .block-3 .block-5 {
		padding: 0;
		display: flex;
		flex-direction: column;
	}
	
	.work #work .block-3 > div:nth-child(2),
	.work #work .grid {
		display: flex;
		flex-direction: column;
		position: static;
	}

	#popup .block-6 {
		padding: 0;
	}

	#popup > div::after {
		padding: 10px 0;
	}

	#posts .block-5 {
		flex-direction: column;
	}

	#products-nav > div {
		padding: 10px 5px;
	}

	.pagination {
		margin-top: 30px;
		margin-bottom: 60px;
	}

	.pagination .dots,
	.pagination a:not(:nth-child(1)):not(:nth-child(2)):not(:nth-last-child(1)):not(:nth-last-child(2)) {
		display: none;
	}

	#source_filter .block-2,
	#sources .grid {
		display: flex;
		flex-direction: column;
	}
	
	#source_filter select {
		width: 100%;
	}

	#header nav {
		justify-content: space-between;
		align-items: center;
	}

	#header #logo {
		min-width: 140px;
    	max-width: 140px;
	}

	#menu {
		min-width: 40px;
	}

	.home #banners p {
		width: 100%;
	}
		
	#header .sales_list {
		top: 117px;
	}

	#side-menu article {
		width: 100%;	
		flex-direction: column;
		gap: var(--gap-20);
	}

	#side-menu .news .featured,
	#side-menu article figure {
		width: 100%;
	}

	#side-menu article img {
		width: 100%;
	}

	.open #side-menu {
		width: 500px;
	}

	#breadcrumbs {
		margin-top: 5px;
	}

	#category {
		font-size: 12px;
		white-space: nowrap;
		overflow-x: auto;
		width: 100%;
		justify-content: start;
		padding-left: 10px;
		flex-wrap: nowrap;
	}

	#sustainable .info {
		gap: var(--gap-60);
	}

	.home #banners figcaption {
		opacity: 1;
		pointer-events: all;
	}

	#sustainable .w-66 {
		flex-direction: column;
		gap: var(--gap-40);
	}	
	
	#success .client.small, #success .client.big {
		width: 100%;
	}

	#success .client.small.active,
	#success .client.big.active {
		width: 100%;
	}

	#success .logo figcaption {
		font-size: var(--size-300);
	}

	#help > div {
		grid-template-columns: 100%;
	}

	#help .social > div {
		grid-template-columns: repeat(4,1fr);
	}

	#gallery .box_1 {
		grid-column: 1 / -1;
		grid-row: 1;
	}

	#gallery .box_2 {
		grid-column: 1 / -1;
		grid-row: 2;
	}

	#gallery .box_3 {
		grid-column: 1 / -1;
		grid-row: 3;
	}

	#gallery .box_4 {
		grid-column: 1 / -1;
		grid-row: 4;
	}

	#gallery .box_5  {
		grid-column: 1 / -1;
		grid-row: 5;
	}

	#awards .block-5 {
		display: grid;
		grid-template-columns: 100%;
	}

	#awards .items {
		flex-wrap: wrap;
	}

	#awards .items figure{
		width: 50%;
	}

	#solution .grid,
	#service .grid {
		padding: 0;
		grid-template-columns: 100%;
	}
	
	#solution .grid .service {
		gap: 20px;
	}

	#footer > .main {
		grid-template-columns: 100%;
		gap: var(--gap-60);
	}

	#footer > .main {
		grid-template-columns: 100%;
	}

	#newsletter > div {
		flex-direction: column;
	}

	#newsletter .title {
		width: 100%;
		align-items: flex-start;
	}

	#message .h3, .cta.full .title .h3 {
		text-align: center;
	}

	#our_solutions .title .h3,
	#success .title {
		width: 100%;
	}

	#our_help .row-1,
	#our_help .row-2 {
		flex-direction: column;
	}

	#our_help figure.w-25{
		width: 100%;
		height: 150px;
		display: flex;
		align-items: center;
		text-align: center;
	}

	#our_help figure.w-25 img{
		transition: all 560ms ease;
	}

	#our_help figure:hover.w-25 img{
		transform: scale(1.2);
	}

	.cta.full p, 
	#message p {
		width: 100%;
	}

	.home .cta.full p {
		display: none;
	}

	#our_solutions .block-5,
	#our_film .block-5,
	#we .title,
	#sustainable .title{
		padding-inline: 0;
	}

	#save #looking nav,
	.looking #looking nav {
		gap: var(--gap-60);
	}

	.regular .wp-block-table {
		margin-bottom: 20px;
	}

	.grid .description {
		max-height: 200px;
		overflow: hidden;
	}

	.grid .description::before {
		content: '';
		position: absolute;
		inset: 0;
		background: linear-gradient(transparent 0px,#ffffffde);
	}

	.grid .description.active::before {
		background: linear-gradient(transparent 0px,#ffffff00);	
	}

	.grid .description a.absolute {
		bottom: 0;
		right: 50%;
		transform: translateX(-50%);
		color: var(--main);
		font-weight: 700;
	}

	.grid .description.active {
		max-height: 100%;
	}

	.grid .description.active a.absolute {
		opacity: 0;
		pointer-events: none;
	}

	#checkout-steps > div{
		gap: 100px;
	}

	._form_1 ._form-content {
		flex-direction: column;
	}

	._form_3 ._form-content{
		width: 100%;
	}

	#ods .block-3 .w-70{
		width: 100%;
	}

	#ods .block-3.ods {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 1px;
	}

	.block-5.voices .w-70{
		width: 100%;
		text-align: center;
	}

}

@media only screen and (max-width:650px) {

	.size-700 {
		font-size: var(--size-500);
	}

	.home section {
		padding-bottom: 20px;
		padding-top: 20px;
	}

	section .title .h3,
	#news .info .h3 a,
	.looking .news .info .h3 a {
		font-size: var(--size-400);
	}

	#our_solutions .block-5,
	#environement .data,
	.data,
	#our_solutions .datas,
	#our_solutions > div,
	#news .news {
		gap: 15px;
	}

	#environement .data .h3,
	.data .h3 {
		font-size: var(--size-400);
	}

	#goals .data .number span {
		font-size: 42px;
	}

	#goals article {
		min-height: auto;
		padding: 20px 0 !important;
		margin-bottom: 12px;
	}

	p,
	#environement .data .content,
	.data .content,
	#delegations .office .content p {
		font-size: var(--size-200);
	}

	#our_help .title p,
	.member .info .h3 {
		font-size: var(--size-300);
	}

	.home #banner > .block-2 > div.info {
		padding: 20px;
	}

	.home #banner > .block-2 > div.info > div.links{
		margin: 0;
		justify-content: space-between;
		padding-bottom: 20px;
		gap: 2px;
	}

	.home #banner > .block-2 > div.info > div.links a {
		padding: 13px 15px;
	}

	.home #banner .botones,
	#buzon .title p,
	#footer .newsletter p {
		display: none;
	}

	#buzon h3{
		text-align: center;
	}

	#buzon #anonimo {
		justify-content: center;
	}

	.company #intro #intro-gallery {
		height: 250px;
	}

	.company #president .block-5.relative{
		background-color: #f3f3f3;
	}

	.company #president .block-5 figure{
		width: 50%;
	}

	.company #president blockquote {
		margin-top: 10px;
	}

	#president blockquote p {
		font-size: 14px;
	}

	#president blockquote::after {
		bottom: -30px;
	}

	#our_help figure.w-25 {
		height: 90px;
	}

	#our_help figure.w-25 h3{
		font-size: 14px;
		margin: 0;
	}

	#gallery .galleries {
		grid-auto-rows: auto;
		gap: 5px;
	}

	#gallery .galleries article {
		height: 200px;
	}

	.topbar .info .mobile {
		display: flex;
		opacity: .65;
		transition: var(--transsition-300);
	}

	.topbar .info .mobile:hover {
		opacity: 1;
	}

	.topbar .info .mobile img {
		width: 16px;
		height: auto;
	}
	
	#header nav {
		position: relative;
	}
	
	#header form input {
		padding-left: 10px;
		font-size: 16px;
		display: block;
	}	
	
	#header nav .search {
		width: 20px;
		height: 100%;
    	margin-left: auto;
		padding: 0;
		border: 0;
		background-color: #fff;
		display: flex;
		justify-content: center;
		align-items: center;
		color: var(--grey);
		cursor: pointer;
		transition: var(--transition-400);
	}
	
	#header nav .search i{
		position: relative;
		display: block;
		width: 16px;
		height: 16px;
		border: 2px solid;
		border-radius: 100%;
		margin-left: -4px;
		margin-top: -4px;
		transition: var(--transition-400)
	}

	.search #header nav .search i{
		border: none;
	}
	
	#header nav .search i::after{
		content: '';
		display: block;
		box-sizing: border-box;
		position: absolute;
		border-radius: 3px;
		width: 2px;
		height: 8px;
		background: var(--grey);
		transform: rotate(-45deg);
		top: 10px;
		left: 12px;
		transition: var(--transition-400)
	}
	
	.search #header nav .search i::after {
		height: 22px;
		top: -2px;
    left: 5px;
	}
	
	#header nav .search i::before{
		content: '';
		display: block;
		box-sizing: border-box;
		position: absolute;
		border-radius: 3px;
		width: 0px;
		height: 0px;
		background: var(--grey);
		transform: rotate(45deg);
		top: 10px;
		left: 12px;
		transition: var(--transition-400)
	}
	
	.search #header nav .search i::before {
		height: 22px;
		width: 2px;
		top: -2px;
    left: 5px;
	}

	#header .secondary {
		grid-template-columns: 1fr 1fr;
	}

	#header .secondary {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 100%;
		padding-left: var(--padding-20)
	}
	
	#header .sales_list div.marker {
		transform: translateX(22%) rotate(-45deg);
	}

	#header .secondary a {
		font-size: 20px;
	}

	#success .client.small {
		height: 150px;
	}

	#success .client.small figure figcaption{
		display: none;
	}

	#clients .my_client img {
		width: 100%;
		height: auto;
	}

	section .big-title {
		font-size: 32px;
		margin-bottom: 25px;
	}

	#sustainable .w-66 {
		gap: 5px;
	}

	#sustainable .quantities .invoice {
		padding: 25px 20px;
	}

	#sustainable .quantities span {
		font-size: 60px;
	}

	#sustainable .quantities p {
		font-size: 18px;
		line-height: inherit;
		margin-top: 10px;
	}

	#sustainable .quantities .kgs {
		min-height: 200px;
	}

	#news .news article {
		height: fit-content;
	}

	#news .news figure, .examples article figure, .looking .news article figure, .looking .tutorials article figure {
		min-height: 200px;
		height: 200px;
	}

	#we .slider .grid {
		gap: 20px;
	}

	#we .slider .swiper-pagination {
		gap: 10px;
	}

	#delegations .office .content p {
		flex-direction: column;
		align-items: flex-start;
		gap: 10px;
	}

	#newsletter {
		padding-block: 30px;
	}

	#checkout-steps > div{
		gap: 70px;
	}

	.checkout .footer{
		flex-direction: column;
		text-align: center;
		gap: 20px;
	}

	.payment .payment-methods .grid{
		grid-template-columns: 1fr;
	}

	#footer .newsletter .links {
		gap: 10px;
	}

	#footer .legal,
	#footer .legal div {
		display: flex;
		flex-direction: column;
		gap: 10px;
		position: relative;
	}
	
	#footer .legal {
		padding-bottom: 70px;
	}

	#footer .legal span {
		text-align: center;
	}

	#footer .legal span:not(:first-child)::before {
		display: none;
	}

	#footer #neobrand {
		transform: translateX(-50%);
		position: absolute;
		bottom: 20px;
		left: 50%;
	}

	#feder > div {
		padding: 0;
		flex-direction: column;
	}
	
	#feder > div figure {
		width: 100%;
		display: flex;	
		justify-content: center;
	}
	
	#feder > div figure img {
		max-width: 80%;
	}

	#feder > div p {
		padding-left: 0;
		border-left: 0;
		border-top: 1px solid var(--grey);
	}

}

@media only screen and (max-width:500px) {

	.open #side-menu {
		width: 100%;
	}

	#delegations .certification img {
		width: 100%;
	}

	.home #hero {
		height: auto;
		min-height: auto;
		padding-left: 10px;
		padding-right: 10px;
		margin-bottom: 0;
	}
	
	#header .sales_list{
		width: 100%;
	}

	#categories .grid article {
		flex-direction: column;
	}

	#categories .grid article header {
		width: 100%;
		max-height: 300px;
		position: relative;
	}
	
	#categories .grid article .children {
		width: 100%;
	}
	
	#categories .grid article h2 a {
		font-size: 18px;
	}

	#categories article header h2 {
		font-size: 18px;
		padding: 20px;
		bottom: 0;
		left: 0;
	}

	#products .loop {
		grid-template-columns: 1fr;
	}

	#checkout-steps > div{
		gap: 20px;
	}

	#whatsapp {
		width: 50px;
		height: 50px;
		font-size: 24px;
		right: 10px;
		bottom: 10px;
	}

}

@media only screen and (max-width:400px) {
	.admin #header .secondary {
		grid-template-columns: 27px 27px 27px 35px;
	}
/*	#hero{
		display: none;
	}*/
}