body	{background: black;
}


/* ANIMATIONS */
@keyframes fadeIn1 {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@keyframes fadeOut1 {
	0% {opacity: 1; visibility: visible;}
	100% {opacity: 0; visibility: hidden;}
}
/* ANIMATIONS */


/* HEADER */
.header 		{display: flex; align-items: flex-start; justify-content: space-between; position: fixed; width: 100%; z-index: 10; background: linear-gradient(180deg,rgba(0, 0, 0, 1) 24%, rgba(0, 0, 0, 0.9) 40%, rgba(0, 0, 0, 0.7) 62%, rgba(0, 0, 0, 0.52) 76%, rgba(0, 0, 0, 0) 100%);

	& .grafinca {padding: 30px 0px 0px 40px; width: 250px;
	}
	& .img 		{
	}
	& .right 	{display: flex;
	}
	& .btReg	{background: var(--color-secundario); line-height: 1; display: flex; align-items: center; padding: 0px 14px 2px 14px; height: 60px; transition: .3s;
	&:hover		{background: var(--color-gray1); color: black; transform: scale(1.1); box-shadow: 0px 0px 30px 5px rgba(0,0,0,0.8);}
	}
	& .menu 	{font-size: 40px; background: var(--color-primario); width: 60px; height: 60px; display: flex; justify-content: center; align-items: center; color: white; cursor: pointer; transition: .3s;
	&:hover		{background: var(--color-gray1); color: black; transform: scale(1.1); box-shadow: 0px 0px 30px 5px rgba(0,0,0,0.8);}
	&:active	{transform: scale(.95);}
	}
	& .wtsp 	{background: var(--color-aprobado); width: 60px; height: 60px; display: flex; justify-content: center; align-items: center; color: white; cursor: pointer; transition: .3s;
	&:hover		{background: var(--color-gray1); color: black; transform: scale(1.1); box-shadow: 0px 0px 30px 5px rgba(0,0,0,0.8);}
	&:active	{transform: scale(.95);}
	}
	& .icodr4	{font-size: 34px;
				animation: wtsp 7s infinite; transform: rotate(0deg);
	}
}
.headerHome		{animation: fadeIn1 1s forwards; opacity: 0; animation-delay: 10s; position: relative; z-index: 10;}
.headerInt		{animation: fadeIn1 1s forwards; opacity: 0; animation-delay: 2s; position: relative; z-index: 10;}
@keyframes wtsp {
	0% {transform: rotate(0deg);}
	4% {transform: rotate(50deg);}
	10% {transform: rotate(0deg);}
	13% {transform: rotate(90deg);}
	20% {transform: rotate(0deg);}
	27% {transform: rotate(90deg);}
	32% {transform: rotate(0deg);}
	42% {transform: rotate(90deg);}
	52% {transform: rotate(0deg);}
	100% {transform: rotate(0deg);}
}
/* HEADER */


/* FOOTER */
.footer 		{display: flex; flex-wrap: wrap; justify-content: center; width: 100%; padding: 0px 40px 40px 40px;

	& .logos 	{width: 100%; display: flex; align-items: flex-start; justify-content: center; gap: 50px;
	}
	& .line2	{width: 100%; height: 1px; background: var(--color-gray2); margin: 50px 0px 40px 0px;
	}
	& .item 	{
	}
	& .title 	{color: var(--color-gray2); font-size: 17px;
	}
	& .img 		{display: flex; align-items: flex-start; gap: 20px;
	}
	& .data 	{width: 100%; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap;
	}
	& .left 	{display: flex; align-items: center; color: var(--color-gray2); gap: 10px;
	}
	& .logoGraf {width: 150px;
	}
	& .txt 		{display: flex; align-items: flex-start; color: var(--color-gray2); gap: 2px;
	}
	& .icod215 	{font-size: 16px; margin: 4px 0px 0px;
	}
	& .right 	{display: flex; gap: 17px;
	}
	& .ico4fg 	{width: 46px; height: 46px; background: var(--color-gray1); color: black; font-size: 22px; display: flex; align-items: center; justify-content: center; border-radius: 13px; cursor: pointer; transition: .3s;
	&:hover		{box-shadow: 0px 0px 15px 3px white; background: white; color: var(--color-gray3);}
	}
	& .l1		{width: 170px; margin: 15px 0px 0px 0px;}
	& .l2		{width: 130px;}
	& .l3 		{width: 130px; margin: 10px 0px 0px 0px;}
	& .l4		{width: 130px; margin: 14px 0px 0px 0px;}
}
.power 			{background: var(--color-gray4); display: flex; align-items: center; justify-content: center; border-radius: 30px 30px 0px 0px;

	& .iluxion 	{display: flex; align-items: center; color: white; font-size: 15px; text-transform: uppercase; font-weight: 300; gap: 5px; padding: 10px 0px 9px 0px;
	}
	& .ico-22 	{
	}
}
/* FOOTER */



@keyframes print {
	0% 		{margin: -660px 0px 0px 0px;}
	100% 	{margin: 0px 0px 0px 0px}
}
@keyframes graf {
	0% 		{margin: 0px 0px 0px -30px; opacity: 0;}
	100% 	{margin: 0px 0px 0px 0px; opacity: 1;}
}
@keyframes charg {
	0%		{opacity: 0;}
	50%		{opacity: 1;}
	100%	{opacity: 0;}
}
@keyframes bar2 {
	0%		{width: 3%;}
	20%		{width: 15%;}
	30%		{width: 15%;}
	60%		{width: 45%;}
	70%		{width: 45%;}
	90%		{width: 85%;}
	100%	{width: 100%;}
}
@keyframes txtVisi {
	0%		{opacity: 0; color: var(--color-primario);}
	50%		{opacity: 1; color: var(--color-primario);}
	80%		{opacity: 1;color: var(--color-primario);}
	100%	{opacity: .5; color: white;}
}
.intro 			{background: black; display: flex; flex-wrap: wrap; flex-direction: column; justify-content: space-between; width: 100%; height: 100dvh; padding: 0px 0px 100px 0px; position: fixed; top: 0; left: 0; z-index: 20;
				animation: fadeOut1 .5s forwards; visibility: visible; opacity: 1; animation-delay: 7s;

	& .top 		{width: 100%; display: flex; align-items: center; padding: 0px 40px; gap: 30px;
	}
	& .printWrap{animation: print 1.5s forwards; margin: -660px 0px 0px 0px; animation-delay: 1s;
	}
	& .barras	{display: flex; align-items: flex-start;
	}
	& .a1 		{width: 44px; height: 385px; margin: 0px 0px 0px 2px; background: var(--color-primario);
	}
	& .a2 		{width: 49px; height: 368px; margin: 0px 0px 0px 14px; background: var(--color-complement1);
	}
	& .a3 		{width: 16px; height: 381px; margin: 0px 0px 0px 14px; background: var(--color-secundario);
	}
	& .a4 		{width: 17px; height: 368px; margin: 0px 0px 0px 16px; background: #7DB82D;
	}
	& .a5 		{width: 17px; height: 368px; margin: 0px 0px 0px 19px; background: #7DB82D;
	}
	& .a6 		{width: 54px; height: 382px; margin: 0px 0px 0px 10px; background: var(--color-complement2);
	}
	& .print 	{width: 280px; margin: -25px 0px 0px 0px;
	}
	& .logo 	{width: 250px;
	}
	& .aniGraf	{animation: graf 1.5s forwards; margin: 0px 0px 0px -30px; opacity: 0; animation-delay: 1.5s;
	}
	& .line 	{width: 1px; height: 120px; background: white;
	}
	& .txtWrap 	{
	}
	& .txt 		{color: white; font-size: 30px; width: 410px; line-height: 1.2; font-weight: 300;
	}
	& .carga 	{width: 100%; display: flex; flex-direction: column; color: white; align-items: center; gap: 12px;
				animation: fadeIn1 1s forwards; opacity: 0; animation-delay: 1s;
	}
	& .bar1 	{width: 280px; background: black; border: 1px solid white; height: 14px; padding: 0px 6px; border-radius: 100px; display: flex; align-items: center;
	}
	& .bar2 	{height: 2px; background: white;
				animation: bar2 6s forwards; width: 3%; animation-delay: 1.5s;
	}
	& .title 	{text-transform: uppercase; font-weight: 300; font-size: 20px;
				animation: charg .5s infinite; opacity: 0;
	}
}
.banerHome		{
}
.visitantes 	{width: 100%; height: 100dvh; display: flex; align-items: flex-start; justify-content: center; padding: 160px 0px 0px 0px; position: sticky; top: 0px; z-index: 3;

	& .wrap 	{text-transform: uppercase; line-height: .9; font-size: 120px; font-weight: 900; width: 920px; text-align: center; 
	}
	& .wrap2 	{text-transform: uppercase; line-height: .9; font-size: 90px; font-weight: 900; width: 920px; text-align: center; 
	}
	& .wHm		{animation: txtVisi 2.5s forwards; opacity: 0; color: var(--color-primario); animation-delay: 8s;
	}
	& .wIn		{animation: txtVisi 2.5s forwards; opacity: 0; color: var(--color-primario); animation-delay: 1s;
	}
}
.video			{width: 100%; height: 100dvh; overflow: hidden; display: flex; justify-content: center; align-items: center; margin: -100dvh 0px 0px 0px; position: sticky; top: 0px;

	& .int		{width: 100%; height: 100%; object-fit: cover;
	}
}
.vdHo			{animation: fadeIn1 3s forwards; opacity: 0; animation-delay: 10s;}
.vdIn			{animation: fadeIn1 1s forwards; opacity: 0; animation-delay: 3s;}

.infoData 		{width: 100%; height: 100dvh; margin: -100dvh 0px 0px 0px; display: flex; align-items: flex-end; justify-content: center; padding: 0px 0px 40px 0px; position: sticky; top: 0px; z-index: 4;
				animation: fadeIn1 3s forwards; opacity: 0; animation-delay: 10s;

	& .wrap 	{background: rgba(0,0,0,0.4); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); display: flex; align-items: center; justify-content: center; padding: 0px 30px 20px 30px; border-radius: 38px; border: 2px solid black;
	}
	& .item 	{color: white; display: flex; flex-direction: column; align-items: center; width: 126px; text-align: center; gap: 14px; margin: -32px 0px 0px 0px;
	}
	& .ico 		{background: white; color: var(--color-primario); font-size: 32px; width: 54px; height: 54px; display: flex; justify-content: center; align-items: center; border-radius: 15px;
	}
	& .txt 		{
	}
	& .line 	{width: 2px; height: 40px; background: white; margin: 35px 20px 0px 20px;
	}
	& .itm2		{width: 150px;}
}
.shadow1 		{width: 100%; height: 200dvh; margin: -20dvh 0px 0px 0px; background: linear-gradient(180deg,rgba(0, 0, 0, 0) 1%, rgba(0, 0, 0, 0.48) 15%, rgba(0, 0, 0, 0.84) 40%, rgba(0, 0, 0, 1) 66%, rgba(0, 0, 0, 1) 90%);; position: sticky; top: 0px; z-index: 2; padding: 80dvh 0px 0px;

	& .conso	{position: sticky; top: 430px; display: flex; justify-content: center; margin: 0px 0px 260px 0px;
	}
	& h1		{width: 710px; line-height: 1; text-align: center; font-weight: 300; color: var(--color-primario); font-size: 50px; display: flex; justify-content: center;
	}
}
.img-int		{width: 100%; height: 100%; object-fit: cover;
}
.laFeria 		{max-width: 1600px; width: 100%; margin: 50dvh auto 0px auto; display: flex; padding: 0px 40px; justify-content: space-between;

	& .left 	{width: 35%;
	}
	& .p1 		{color: var(--color-secundario); display: flex; flex-direction: column; margin: 0px 0px 230px 0px; position: sticky; top: 240px;
	}
	& .title1	{width: 100%; text-transform: uppercase; font-weight: 800; font-size: 60px;
	}
	& .txt 		{font-size: 28px; font-weight: 300; line-height: 1.1;
	}
	& .p2 		{margin: 85dvh 0px 0px 0px; position: sticky; top: 460px;
	}
	& .title2	{font-size: 68px; color: white; text-transform: uppercase; font-weight: 800; line-height: 1;
	}
	& .right 	{width: 61%; display: flex; flex-wrap: wrap; justify-content: center;
	}
	& .img1 	{overflow: hidden; border-radius: 55px; width: 100%; height: 80dvh; display: flex; justify-content: center; align-items: center; margin: 75dvh 0px 0px 0px; position: sticky; top: 0px;
	}
	& .img2 	{overflow: hidden; border-radius: 55px; width: 80%; height: 80dvh; display: flex; justify-content: center; align-items: center; margin: 20dvh 0px 0px 0px; position: sticky; top: 210px; box-shadow: 0px -17px 100px -20px rgba(0,0,0,0.9);
	}
	& .img3 	{overflow: hidden; border-radius: 55px; width: 60%; height: 80dvh; display: flex; justify-content: center; align-items: center; margin: 20dvh 0px 0px 0px; position: sticky; 	
	}
}
.pausa			{width: 100%; height: 80dvh;
} 
.sectores 		{margin: 0px 0px 0px 0px;
}
.franjaWrap 	{height: 100dvh; margin: -100dvh 0px 0px 0px; top: 0px; display: flex; align-items: flex-end; width: 100%; overflow: hidden; position: sticky; z-index: 2;

	& .franja 	{background: var(--color-secundario); text-transform: uppercase; font-weight: 900; font-size: 100px; padding: 10px 230px 0px 230px; text-wrap: nowrap; 
				animation: franja 12s infinite linear; margin: 0px 0px 0px -1150px;
	}
}
@keyframes franja {
	0% {margin: 0px 0px 0px -1150px;}
	50% {margin: 0px 0px 0px 0px;}
	100% {margin: 0px 0px 0px -1150px;}
}
.videoSector 	{width: 100%; height: 100dvh; position: sticky; top: 0px; padding: 10px 0px 0px 0px;
}
.shadowSector 	{width: 100%; height: 300dvh; flex-wrap: wrap; z-index: 1; margin: -100dvh 0px 0px 0px; background: linear-gradient(180deg,rgba(0, 0, 0, 1) 32%, rgba(0, 0, 0, 0.91) 65%, rgba(0, 0, 0, 0.75) 81%, rgba(0, 0, 0, 0.35) 94%, rgba(0, 0, 0, 0) 100%); position: relative; display: flex; justify-content: center; align-items: flex-start; text-align: center; text-transform: uppercase; gap: 30px;

	& .item 	{position: sticky; top: 150px;
	}
	& .it1 		{width: 220px;
	}
	& .title 	{font-weight: 900; line-height: 1; font-size: 56px; color: var(--color-secundario); margin: 0px 0px 30px 0px;
	}
	& .txt 		{font-weight: 600; color: white; font-size: 25px;
	}
	& .it2 		{width: 350px;
	}
	& .shSct1	{margin: 110dvh 0px 40dvh 0px;
	}
	& .shSct2	{margin: 150dvh 0px 40dvh 0px;
	}
	& .shSct3	{margin: 200dvh 0px 40dvh 0px;
	}
}
.actividades 	{max-width: 1600px; width: 100%; margin: 40dvh auto 0px auto; display: flex; padding: 0px 40px; justify-content: space-between; align-items: flex-end;

	& .left 	{width: 45%; display: flex; flex-direction: column; align-items: center; position: sticky; bottom: 40px; gap: 20px; 
	}
	& .title 	{font-weight: 900; text-transform: uppercase; font-size: 60px; text-align: center; line-height: 1.1; position: sticky; bottom: 40px; color: var(--color-primario);
	}
	& .imgWrap 	{width: 100%; height: 45dvh; overflow: hidden; border-radius: 50px;
	}
	& .right 	{width: 50%; margin: 30dvh 0px 40px 0px;
	}
	& .item 	{margin: 100px 0px 0px 0px;
	}
	& .title2 	{display: flex; align-items: flex-start; font-size: 60px; text-transform: uppercase; font-weight: 300; gap: 4px; line-height: 1; color: var(--color-secundario);
	}
	& .co3e3 	{font-size: 40px; margin: 6px 0px 0px 0px;
	}
	& .subtitle {font-size: 28px; padding: 0px 0px 0px 50px; color: white;
	}
	& .subti2 	{margin: 10px 0px 0px 0px; color: white; font-size: 30px; font-weight: 300;
	}
	& .stand 	{display: flex; align-items: center; justify-content: space-between; margin: 90px 0px 90px 0px;
	}
	& .standImg {width: 45%; background: gray; height: 300px; overflow: hidden; border-radius: 40px; border: 1px solid white;
	}
	& .medidas 	{width: 45%; color: white; display: flex; flex-direction: column; gap: 10px;
	}
	& .line 	{width: 100%; height: 1px; background: white;
	}
	& .itemMed 	{display: flex; align-items: flex-start; font-size: 36px; gap: 4px;
	}
	& .icodf 	{font-size: 28px; margin: 8px 0px 0px 0px;
	}
	& .perfiWrap{width: 100%; display: flex; flex-direction: column; align-items: flex-start; margin: 0px 0px 10dvh 0px;
	}
	& .title4 	{
	}
	& .itemInc 	{color: white; display: flex; gap: 8px; font-size: 30px; align-items: flex-start; margin: 14px 0px 0px 0px;
	}
	& .icodd31 	{font-size: 24px; margin: 7px 0px 0px 0px;
	}
	& .perfil 	{color: white; text-transform: uppercase; font-size: 50px; line-height: 1.1; font-weight: 900;
	}
	& .item2 	{margin: 30px 0px 0px 0px;
	}
	& .title3 	{display: flex; align-items: flex-start; font-size: 45px; text-transform: uppercase; font-weight: 300; gap: 4px; line-height: 1; color: white;
	}
	& .dde33 	{font-size: 30px; margin: 7px 0px 0px 0px;
	}
	& .line2 	{width: 70px; height: 1px; background: white; margin: 20px 0px 20px -20px; display: block;
	}
	& .sect 	{text-transform: uppercase; color: white; font-weight: 300; font-size: 55px;
	}
	& .sc1 		{opacity: 1;
	}
	& .sc2 		{opacity: .7;
	}
	& .sc3 		{opacity: .5;
	}
	& .sectores {padding: 100px 0px 0px 0px; 
	}
	& .titleSec {background: var(--color-secundario); text-transform: uppercase; font-size: 40px; font-weight: 600; padding: 5px 0px 0px 25px; height: 65px; display: none; align-items: center; border-radius: 10px;
	}
	& .standWr 	{margin: 0px 0px -40px 0px;
	}
	& .standEx 	{
	}
	& .titleMed {background: var(--color-error); width: 370px; margin: -180px auto 0px auto; text-align: center; text-transform: uppercase; color: white; font-size: 50px; padding: 90px 0px 50px 0px; line-height: 1;
	}
	& .medInt 	{display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20px 0px; margin: 30px 0px 0px 0px;
	}
	& .medA 	{color: white; display: flex; font-size: 30px; font-weight: 300; align-items: center; width: 31%; gap: 2px;
	}
	& .nroBld 	{font-weight: 700; font-size: 40px;
	}
	& .presTxt 	{color: white; font-weight: 300; font-size: 30px; display: flex; align-items: flex-start; gap: 6px; margin: 15px 0px 0px 0px;
	}
	& .icod22a 	{font-size: 22px; margin: 7px 0px 0px 0px;
	}
}
.cierre 			{width: 100%; margin: 50dvh 0px 0px;

	& .videoSector 	{padding: 0px;
	}
	& .img-int 		{
	}
	& .shadowEnd 	{background: linear-gradient(180deg,rgba(0, 0, 0, 0) 26%, rgba(0, 0, 0, 0.44) 54%, rgba(0, 0, 0, 0.84) 79%, rgba(0, 0, 0, 0.98) 93%, rgba(0, 0, 0, 1) 100%); position: relative; margin: -100dvh 0px 0px; height: 150dvh; display: flex; flex-direction: column; justify-content: space-between;
	}
	& .infoData 	{align-items: flex-start; margin: 20dvh 0px 50dvh 0px; top: 20dvh; height: auto;
	}
}
.nav 			{position: fixed; z-index: 20; top: 0px; left: 0px; width: 100%; height: 100dvh; background: rgba(0, 0, 0, 0.6); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); color: white; padding: 50px; display: flex; align-items: flex-start; overflow: auto; gap: 40px;
				visibility: hidden; opacity: 0; transition: .3s .3s;

	& .icode1 	{position: fixed; right: 20px; top: 20px; font-size: 50px; cursor: pointer;
	&:hover		{color: var(--color-secundario);}
	}
	& .data 	{display: flex; flex-direction: column; gap: 30px;
				opacity: 0; margin: 0px 0px 0px -30px; transition: .3s .1s;
	}
	& .item 	{display: flex; gap: 10px; margin: 7px 0px 0px 0px;
	}
	& .icodw2 	{width: 40px; font-size: 24px; height: 40px; background: white; color: var(--color-primario); display: flex; justify-content: center; align-items: center; border-radius: 12px; padding: 0px 0px 2px 0px; margin: -10px 0px 0px 0px;
	}
	& .bta 		{width: 240px; background: var(--color-secundario); height: 50px; border-radius: 7px; font-size: 24px; display: flex; align-items: center; justify-content: center; color: black; transition: .3s;
	&:hover		{background: var(--color-gray1); color: black; transform: scale(1.02);}
	}
	& .btb 		{width: 240px; background: var(--color-primario); height: 50px; border-radius: 7px; font-size: 24px; display: flex; align-items: center; justify-content: center; transition: .3s;
	&:hover		{background: var(--color-gray1); color: black; transform: scale(1.02);}
	}
	& .line 	{width: 1px; background: white; height: 460px; margin: 0px 40px;
				opacity: 0; margin: 0px 0px 0px -30px; transition: .3s .1s;
	}
	& .links 	{display: flex; flex-direction: column; gap: 20px;
				opacity: 0; margin: 0px 0px 0px -30px; transition: .3s .1s;
	}
	& .btlink 	{font-weight: 300; text-transform: uppercase; font-size: 35px; line-height: 1.1; transition: .3s; 
	&:hover		{color: var(--color-secundario);}
	}
	& .item1On	{opacity: 1; margin: 0px 0px 0px 0px; transition: .8s .3s;}
	& .item2On	{opacity: 1; margin: 0px 0px 0px 0px; transition: .8s .4s;}
	& .item3On	{opacity: 1; margin: 0px 0px 0px 0px; transition: .8s .5s;}
}
.navOn			{visibility: visible; opacity: 1; transition: .3s .1s;}



.modalidad 		{display: flex; flex-direction: column; align-items: center; justify-content: flex-start; margin: 50px 0px 30px 0px; padding: 0px 40px;

	& .txt1 	{background: var(--color-secundario); width: 650px; padding: 40px 30px; font-size: 46px; line-height: 1.1; text-align: center; font-weight: 300;
	}
	& .title 	{color: var(--color-secundario); text-transform: uppercase; font-size: 50px; font-weight: 500; margin: 20px 0px 60px 0px;
	}
	& .itemWrap {display: flex; gap: 40px;
	}
	& .item 	{color: white; display: flex; flex-direction: column; align-items: center; width: 300px; text-align: center;
	}
	& .icoe9rq 	{font-size: 60px;
	}
	& .title2 	{text-transform: uppercase; font-weight: 500; font-size: 33px; margin: 15px 0px 3px 0px; color: var(--color-gray3);
	}
	& .txt2 	{font-weight: 300; font-size: 22px;
	}
}
.frase 			{width: 100%; height: 100dvh; background: url(../images/dias2.webp); margin: 100px 0px -481px 0px; background-attachment: fixed;

	& .shadow 	{width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; background: rgba(0,0,0,0.85);
	}
	& .wrap 	{color: white; text-align: center; width: 80%; font-size: 57px; font-weight: 300; line-height: 1.2;
	}
}
.llegar 		{width: 100%; height: 70dvh; overflow: hidden;
}
.apps 			{display: flex; flex-wrap: wrap; justify-content: center; width: 550px; margin: -50px auto -200px auto; gap: 40px; position: relative;
	
	& .applink 	{width: 90px;
	}
	& .title 	{color: var(--color-primario); font-size: 47px; text-align: center; font-weight: 300; line-height: 1.1; text-transform: uppercase; padding: 0px 40px;
	}
}



.form 				{padding: 290px 0px 0px 0px; width: 520px; margin: 0px auto 200px auto; min-height: 100dvh;

	& .botones 		{display: flex; align-items: flex-start; flex-wrap: wrap; justify-content: space-between; 
	}
	& .btn1 		{border: 1px solid white; color: white; display: flex; flex-direction: column; width: 48%; font-size: 28px; text-transform: uppercase; text-wrap: balance; text-align: center; line-height: 1.3; font-weight: 300; border-radius: 20px; padding: 20px 0px; gap: 22px; transition: .3s; cursor: pointer;;
	&:hover 		{background: white; color: var(--color-primario); transform: scale(1.02);}
	}
	& .ico-22w 		{font-size: 50px;
	}
	& .step 		{display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; margin: 50px 0px 0px 0px; gap: 20px 0px; 
	}
	& .title 		{width: 100%; text-transform: uppercase; color: white; text-align: center; font-size: 27px;
	}
	& .btnMed 		{border: 1px solid white; color: white; width: 31%; height: 54px; display: flex; align-items: center; padding: 0px 16px; border-radius: 15px; gap: 3px; font-size: 20px; transition: .3s; cursor: pointer;;
	&:hover 		{background: white; color: var(--color-primario); transform: scale(1.02);}
	}
	& .bld 			{font-weight: 800; font-size: 27px;
	}
	& .campoForm 	{width: 48%;
	}
	& .campoForm1 	{border: 1px solid white; font-weight: 300; color: white; font-size: 20px;
	&:focus		{color: black;}
	&:focus::placeholder {color: black;}
	}
	& .bt1 			{justify-content: space-between; box-sizing: border-box; margin: 50px 0px 0px 0px; font-size: 22px; text-transform: uppercase;
	}
	& .active		{background: red;
	}
	& .hov 			{background: white; color: var(--color-primario); transform: scale(1.02);
	}
	& .saleForm		{display: none;}
}


.chaina 			{width: calc(100% - 80px); margin: 10px auto 60px auto; color: white; flex-wrap: wrap; gap: 20px; border: 1px solid white; border-radius: 10px; padding: 30px; display: flex; align-items: flex-end; justify-content: space-between;

	& .chn			{font-size: 15px; display: block; text-transform: uppercase; background: var(--color-primario); width: fit-content; padding: 7px 10px; border-radius: 5px; margin: 0px 0px 10px 0px;
	}
	& .title 		{width: 300px; font-size: 33px; font-weight: 700;
	}
	& .right 		{display: flex; gap: 20px; align-items: flex-start;
	}
	& .p1 			{width: fit-content; gap: 5px;
	}
	& .ico-p1 		{margin: 1px 0px 0px 0px; font-size: 19px;
	}
}














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

.header			{
	& .grafinca	{width: 200px;}
}
.laFeria 		{
	& .title2 	{font-size: 58px;}
}
.shadow1		{
	& h1		{width: 100%; font-size: 40px;}
}
.franjaWrap		{
	& .franja	{font-size: 70px; margin: 0px 0px 0px -710px;}
}
.shadowSector	{
	& .title	{font-size: 45px;}
	& .txt		{font-weight: 400; font-size: 24px;}
}
.actividades	{
	& .title	{font-size: 45px;}
}
.modalidad		{justify-content: center; flex-wrap: wrap;
	& .item		{width: 33%; padding: 0px 0px;}
	& .itemWrap	{gap: 60px 110px; flex-wrap: wrap; justify-content: center;}
}

@keyframes franja 	{
	0% 				{margin: 0px 0px 0px -710px;}
	50% 			{margin: 0px 0px 0px 0px;}
	100% 			{margin: 0px 0px 0px -710px;}
}

}






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

.visitantes		{
	& .wrap		{font-size: 80px; width: 100%; padding: 0px 30px;} 
}
.shadow1		{height: 160dvh; padding: 50dvh 0px 0px; margin: -50dvh 0px 0px 0px;
}
.laFeria		{
	& .title1	{font-size: 45px;}
	& .txt		{font-size: 26px;}
	& .p2		{top: 430px;}
	& .title2	{font-size: 50px;}
	& .left		{width: 39%;}
	& .right	{width: 60%;}
}
.actividades	{
	& .subti2	{font-size: 23px;}
	& .itemMed	{font-size: 28px;}
	& .icodf	{font-size: 20px; margin: 6px 0px 0px 0px;}
	& .subtitle	{font-size: 24px;}
	& .titleMed	{margin: -150px auto 0px auto;}
	& .medA		{width: 50%;}
	& .sect		{font-size: 46px;}
}
.intro			{
	& .bar1		{width: 200px;}
	& .print	{width: 200px;}
	& .a1		{width: 32px; margin: 0px 0px 0px 1px;}
	& .a2		{width: 34px; margin: 0px 0px 0px 10px;}
	& .a3		{width: 11px; margin: 0px 0px 0px 11px;}
	& .a4		{width: 12px; margin: 0px 0px 0px 11px;}
	& .a5		{width: 12px; margin: 0px 0px 0px 15px;}
	& .a6		{width: 39px; margin: 0px 0px 0px 6px;}
	& .logo		{width: 200px;}
	& .txt		{font-size: 24px; width: 250px;}
}
}





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

.visitantes		{
	& .wrap		{padding: 0px 70px;}
	& .wrap2	{font-size: 60px; width: 100%;}
}
.shadow1		{
	& .conso	{top: 340px;}
	& h1		{width: 520px;}
}
.laFeria		{margin: 20dvh auto 0px auto; flex-wrap: wrap;
	& .left		{width: 100%;}
	& .p1		{margin: 0px 0px 40px 0px; position: relative; top: 0px;} 
	& .p2		{top: 0px; position: relative; margin: 0px 0px 0px 0px;}
	& br		{display: none;}
	& .right	{width: 100%;}
	& .img1		{margin: 40px 0px 0px 0px;}
}
.shadowSector	{height: 150dvh;
	& .shSct1	{margin: 100px 0px 0px 0px;}
	& .shSct2	{margin: 100px 0px 0px 0px;}
	& .shSct3	{margin: 100px 0px 0px 0px;}
	& .item		{position: relative; top: 0px;}
}
.actividades	{margin: 0px auto 0px auto; flex-wrap: wrap;
	& .left		{width: 100%; position: relative; bottom: 0px;}
	& .imgWrap	{height: 85dvh;}
	& .right	{width: 100%; margin: 0px 0px 40px 0px;}
	& .item		{margin: 60px 0px 0px 0px;}
	& .sect		{display: none;}
	& .titleSec	{display: flex;}
	& .standWr	{margin: 0px 0px 40px 0px;}
	& .perfiWrap{margin: 0px 0px 0px 0px;}
	& .line2	{display: none;}
	& .sectores	{padding: 70px 0px 0px 0px;}
	& .titleMed	{margin: -170px auto 0px auto; font-size: 40px; padding: 90px 0px 30px 0px; width: 270px;}
	& .medA		{width: 30%;}
	& .item2	{margin: 17px 0px 0px 0px;}
	& .title3	{font-size: 32px;}
	& .dde33	{font-size: 22px; margin: 4px 0px 0px 0px;}
}
.cierre			{margin: 100px 0px 0px;
}
.footer			{
	& .data		{align-items: flex-start;}
	& .left		{flex-direction: column; align-items: flex-start;}
}
.frase			{margin: 100px 0px -100px 0px;
	& .wrap		{font-size: 44px;}
}
.modalidad		{
	& .txt1		{width: 100%; padding: 40px 40px; font-size: 45px;}
	& .title2	{font-size: 30px;}
	& .itemWrap	{gap: 60px 40px;}
}
.apps 			{margin: -50px auto 00px auto;
}

.chaina			{
	& .title	{width: 100%; font-size: 28px;}
	& .right	{flex-direction: column;}
}
}




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

.shadowSector	{height: 260dvh;
	& .it1		{width: 100%;}	
	& .shSct2	{margin: 0px 0px 0px 0px;}
	& .it2		{width: 100%;}
	& .shSct3	{margin: 0px 0px 0px 0px;}
}
.franjaWrap		{
	& .franja	{font-size: 50px;}
}
.intro			{padding: 0px 0px 40px 0px;
	& .top		{gap: 20px; flex-direction: column;}
	& .printWrap{margin: -660px 0px 0px 0px;}
	& .line		{width: 200px; height: 1px;}
	& .txt		{font-size: 20px; width: 240px; text-align: center;}
}
.modalidad 		{
	& .item		{width: 100%; padding: 0px 90px;}
	& br		{display: none;}
}
.frase			{
	& .wrap		{font-size: 36px;}
}
.visitantes		{
	& .wrap2 	{font-size: 48px; width: 100%; padding: 0px 12px;}
}

@keyframes print {
	0% 		{margin: -660px 0px 0px 0px;}
	100% 	{margin: -250px 0px 0px 0px}
}
}





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

.header			{
	& .grafinca	{width: 150px; padding: 20px 0px 0px 20px;}
	& .wtsp		{width: 48px; height: 48px;}
	& .icodr4	{font-size: 28px;}
	& .menu		{font-size: 30px; width: 48px; height: 48px;}
	& .btReg	{height: 48px; padding: 0px 10px 2px 10px; font-size: 17px;}
}
.banerHome		{
	& .wrap		{padding: 0px 0px; font-size: 46px;}
}
.infoData		{
	& .wrap		{padding: 10px 14px 12px 14px; border-radius: 24px; border: 1px solid black; width: 96%; justify-content: space-between; max-width: 460px;}
	& .item		{width: 75px;}
	& .line		{height: 20px; margin: 30px 8px 0px 8px; width: 1px;}
	& .itm2		{width: 102px;}
	& .ico		{font-size: 24px; width: 38px; height: 38px; border-radius: 13px;}
	& .txt		{font-size: 13px;}
}
.shadow1		{
	& .conso	{top: 300px;}
	& h1		{width: 100%; font-size: 27px; font-weight: 400;}
}
.laFeria		{
	& .title1	{font-size: 35px;}
	& .txt		{font-size: 22px;}
	& .title2	{font-size: 33px;}
	& br		{display: block;}
	& .img1		{border-radius: 35px; height: 50dvh;}
	& .img2		{border-radius: 35px; width: 100%; height: 50dvh;}
	& .img3		{border-radius: 35px; width: 100%; height: 60dvh;}
}
.shadowSector	{align-content: flex-start; gap: 90px;
	& .title	{font-size: 38px;}
}
.actividades	{
	& .title	{font-size: 30px;}
	& .imgWrap	{height: 65dvh; border-radius: 30px;}
	& .title2	{font-size: 36px;}
	& .co3e3	{font-size: 20px; margin: 5px 0px 0px 0px;}
	& .subtitle	{font-size: 20px; padding: 4px 0px 0px 26px;}
	& .stand	{flex-wrap: wrap; gap: 30px;}
	& .standImg	{width: 100%;}
	& .medidas	{width: 100%;} 
	& .itemInc	{font-size: 22px;}
	& .icodd31	{font-size: 14px; margin: 7px 0px 0px 0px;}
	& .medA		{width: 100%;}
	& .icod22a	{font-size: 16px; margin: 7px 0px 0px 0px;}
	& .presTxt	{font-size: 24px;}
	& .titleSec	{font-size: 26px; padding: 11px 0px 7px 12px; line-height: 1; height: auto;}
	& .perfil	{font-size: 35px;}
	& .sectores	{padding: 50px 0px 0px 0px;}
	& .title3	{font-size: 22px;}
	& .standEx	{width: 100%;}
	& .titleMed	{margin: -160px auto 0px auto; font-size: 35px; padding: 130px 0px 24px 0px; width: 100%;}
	& .dde33	{font-size: 15px; margin: 3px 0px 0px 0px;}
}
.footer			{
	& .title	{font-size: 14px;}
	& .data		{gap: 30px;}
	& .left		{width: 100%;}
	& .right	{width: 100%; justify-content: space-between;}
	& .ico4fg	{width: 47%; height: 38px;}
	& .l1		{width: 110px; margin: 15px 0px 0px 0px;}
	& .l2		{width: 82px;}
	& .l3 		{width: 70px; margin: 10px 0px 0px 0px;}
	& .l4		{width: 70px; margin: 14px 0px 0px 0px;}
	& .line2	{margin: 30px 0px 40px 0px; display: none;}
	& .data		{gap: 20px;}
	& .left		{gap: 3px;}
	& .logoGraf	{margin: 0px 0px 6px 0px;}
	& .txt		{font-size: 17px;}
	& .logos	{flex-wrap: wrap; display: none}
}
.nav			{padding: 40px 20px 20px 40px; flex-direction: column;
	& .data		{gap: 15px; order: 3; width: 100%;}
	& .item		{order: 3;}
	& .icodw2	{width: auto; height: auto; background: none; color: white; margin: -2px 0px 0px 0px;}
	& .sale		{display: none;}
	& .bta		{width: 100%; height: 40px; font-size: 20px;}
	& .btb		{width: 100%; height: 40px; font-size: 20px;}
	& .line		{display: none;}
	& .links	{order: 1;}
	& .btlink	{font-size: 28px;}

	& .item1On	{opacity: 1; margin: 0px 0px 0px 0px; transition: .5s .5s;}
	& .item2On	{opacity: 1; margin: 0px 0px 0px 0px; transition: .5s .4s;}
	& .item3On	{opacity: 1; margin: 0px 0px 0px 0px; transition: .5s .3s;}
}
.visitantes		{
	& .wrap2	{font-size: 43px; padding: 0px 40px;}
}
.modalidad		{ 
	& .txt1		{padding: 30px 40px; font-size: 38px;}
	& .title	{font-size: 35px; text-align: center; line-height: 1.1;}
	& .item		{padding: 0px 0px;}
	& .title2	{font-size: 27px; font-weight: 800;}
}
.frase			{
	& .wrap		{font-size: 34px;}
}
.apps 			{width: 100%; padding: 0px 40px;
	& .title	{font-size: 32px;
	}
}

@keyframes franja 	{
	0% 				{margin: 0px 0px 0px -1250px;}
	50% 			{margin: 0px 0px 0px 0px;}
	100% 			{margin: 0px 0px 0px -1250px;}
}



}




@media screen and (max-width: 420px) {
.header 		{
	& .btReg	{display: none;}
}
.visitantes		{
	& .wrap2	{font-size: 34px; padding: 0px 40px;}
}
.shadow1		{
	& .conso	{top: 300px;}
}
.actividades	{
	& .titleMed	{margin: -120px auto 0px auto; padding: 100px 0px 24px 0px;}
}
.modalidad		{
	& .txt1		{padding: 30px 20px; font-size: 32px;}
}
}