@import url('https://fonts.googleapis.com/css?family=Space%20Grotesk:700|Space%20Grotesk:400');

:root {
/*  change this for scaling  */
  --m: 24px;
  --red: #FE39A0;
  --pink: #FF64F9;
  --purple: #6B5FFF;
  --blue: #4D8AFF;
  --green: #5BFF89;
  --yellow: #FFEE55;
  --orange: #FF6D1B;
  

  /*colores expotransporte*/
  --et-cian: #00ecf9;
  --et-magenta: #FE39A0;
  --et-yelow: #F2A03D;

  --et-azul-1: #011c40;
  --et-azul-2: #020873;
  --et-azul-3: #035aa6;
  --et-azul-4: #00bcff;
}
html{
	overflow-x: hidden;
}
body {
  margin: 0;
  overflow-x: hidden;
  padding: 0;
  font-family: "Montserrat", sans-serif;
  -webkit-font-smoothing: antialiased; 
}
.centrar{
	text-align: center;
}
.derecha{
	text-align: right;
}
.ma-b{
	margin-top: auto;
}
.row{
	display:block;
	width:100%;
	float:left;
}
.h-20{
	height: 20vh;
}
.h-30{
	height: 30vh;
}
.h-70{
	height: 70vh;
}
.h-80{
	height: 80vh;
}
.h-100{
	height: 100vh;
}
.contenedor-1200{
	max-width: 1200px;
	width: 80%;
	display: block;
	margin:0 auto;
}
.contenedor-1600{
	max-width: 1600px;
	width: 90%;
	display: block;
	margin:0 auto;
}
.contenedor-90{
	width: 90%;
	display: block;
	margin:0 auto;
}
.contenedor-800{
	width: 90%;
	max-width: 800px;
	display: block;
	margin:0 auto;
}
.relative{
	position: relative;
}
.sticky{
	position: sticky;
	top:30px;
}
.full-width{
	width:100%;
	display:block;
}
.vertical-center{
    align-items: center;
    justify-content: center;
}
.vertical-center-dos{
    align-items: center;

}
.flex-container{
	display:flex;
	flex-flow: row wrap;
}
.flex-14{
	flex:0 0 12.1428571429%;
	height:100%;
}
.flex-12{
	flex:0 0 12.14%;
}
.flex-10{
	flex:0 0 10%;
}
.flex-15{
	flex:0 0 15%;
}
.flex-16{
	flex:0 0 16.6666%;
}
.flex-20{
	flex:0 0 20%;
}
.flex-25{
	flex:0 0 25%;
}
.flex-30{
	flex:0 0 30%;
}
.flex-33{
	flex:0 0 33.33%;
}
.flex-40{
	flex:0 0 40%;
}
.flex-50{
	flex:0 0 50%;
}
.flex-60{
	flex:0 0 60%;
}
.flex-70{
	flex:0 0 70%;
}
.flex-80{
	flex:0 0 80%;
}
.flex-85{
	flex:0 0 85%;
}
.display-flex{
	display:flex;
	flex:0 0 100%;
}
.p-12{
	font-size:12px;
	line-height: 18px;
}
.p-13{
	font-size:13px;
	line-height: 19px;
}
.p-14{
	font-size:14px;
	line-height:20px;
}
.p-b-20{
	padding-bottom:20px;
}
.p-b-30{
	padding-bottom:30px;
}
.p-b-40{
	padding-bottom:40px;
}
.p-b-50{
	padding-bottom:50px;
}
.p-t-20{
	padding-top:20px;
}
.p-t-10{
	padding-top:10px;
}
.p-t-30{
	padding-top:30px;
}
.p-t-40{
	padding-top:40px;
}
.p-t-50{
	padding-top:50px;
}
.m-r-10{
	margin-right: 10px;
}
.m-t-30{
	margin-top: 30px !important;
}
.col-10{
	display:inline-block;
	width:10%;
	float:left;
}
.col-20{
	display:inline-block;
	width: 20%;
	float:left;
}
.col-25{
	display:inline-block;
	width: 25%;
	float:left;
}
.col-30{
	display:inline-block;
	width: 30%;
	float:left;
}
.col-33{
	display:inline-block;
	width: 33.3333%;
	float:left;
}
.col-40{
	display:inline-block;
	width: 40%;
	float:left;
}
.col-50{
	display:inline-block;
	width:50%;
	float:left;
}
.col-60{
	display:inline-block;
	width:60%;
	float:left;
}
.col-70{
	display:inline-block;
	width:70%;
	float:left;
}
.col-80{
	display:inline-block;
	width:80%;
	float:left;
}
.big-text{
	font-size:24px;
	line-height: 1.5;
}
.col-90{
	display:inline-block;
	width:90%;
	float:left;
}
.cta-rojo{
	background: none;
	color:#fff;
	text-decoration: none;
	font-weight: 900;
	border: 2px solid #FE39A0;
	line-height: 1;
	margin: 0.5em;
	padding: 1em 2em;
	font-size:18px;
	transition: 0.3s;
}
.cta-rojo:hover,
.cta-rojo:focus {
  box-shadow: 0 0.5em 0.5em -0.4em #FE39A0;
  transform: translateY(-0.25em);
}
.cta-rojo i{
	margin-left:8px;
	transition: 0.3s;
}
.cta-rojo:hover i{
	color:#FE39A0;
}







nav{
	position: absolute;
	top:0;
	left:0;
	padding:32px 0;
	width: 100%;
	transition: 0.3s;
	color:#fff;
	background:rgba(2, 8, 115, 0.5);
}
nav:hover{
	background:rgba(2, 8, 115, 1);
}
.logo{
	display: block;
	max-width: 200px;
	width: 80%;
}
.logo img{
	display: block;
	width: 100%;
}
header{
  height: 95vh;
  width: 100%;
  background:url(../img/header-web.jpg?v=1) center center no-repeat, var(--et-azul-1);
  background-size: cover;
}
header .text{
	letter-spacing: 2px;
}
header .text span{
	font-size:50px;
	font-weight: normal;
}
header#expositores{
  width: 100%;
  height: auto;
  background:var(--et-azul-1);
  padding:150px 0 0 0;
}
header#expositores h1{
	color:#fff;
	font-size:80px;
	margin:0;
	position: absolute;
	z-index: 1;
	border-bottom: 5px solid #FE39A0;
}
header#expositores h1 span{
	
}
h1{
	margin:0 0 24px 0;
}
.text{
  display: inline-block;
  font-size:65px;
  color:#fff;
  margin:0;
}

.text__first, .text__second{
  position: relative;
}

.text__word{
  opacity: 0;
}

.text__first-bg, .text__second-bg{
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 9;
  transform-origin: left;
  transform: scaleX(0);
}

.text__first-bg{
  background-color: var(--et-cian);
}

.text__second-bg{
  background-color: var(--et-magenta);
}

.text__second{
}


.a-header {
  border: calc(0.1 * var(--m)) solid transparent;
  position: relative;
  color: #F3F3F3;
  font-family: 'Space Grotesk';
  font-size: 24px;
  border-radius: calc(0.7 * var(--m));
  padding: calc(0.5 * var(--m)) calc(1 * var(--m));
  display: inline-block;
  width: auto;
  text-align: center;
  width: 250px;
  cursor: pointer;
  background:linear-gradient(#fe39a0, #fe39a0), linear-gradient(#121213 50%, rgba(18, 18, 19, 0.6) 80%, rgba(18, 18, 19, 0)),  linear-gradient(90deg, var(--orange), var(--yellow), var(--green), var(--blue), var(--purple), var(--pink), var(--red));
  background-origin: border-box;
  background-clip: padding-box, border-box, border-box;
  background-size: 200%;
  animation: animate 2s infinite linear;
}

.a-header::before {
  content: '';
  background: linear-gradient(90deg, var(--orange), var(--yellow), var(--green), var(--blue), var(--purple), var(--pink), var(--red));
  height: 30%;
  width: 60%;
  position: absolute;
  bottom: -20%;
  z-index: -5;
  background-size: 200%;
  animation: animate 2s infinite linear;
  filter: blur(calc(0.8 * var(--m)));
}

.a-header:hover, .a-header:hover::before {
  animation: animate 0.5s infinite linear;
}

@keyframes animate {
  0% {background-position: 0}
  100% {background-position: 200%}
}

@media screen and (max-width: 1000px) {
  :root {
    --m: 2rem;
  }
}


/* 
	HAMBURGUESA
*/

.hamburger-menu {
  padding: 0;
  width: 50px;
  position: absolute;
  z-index: 20;
  right: calc(5% - 25px);
  height: 50px;
  top:54px;
  display: block;
  transform: translate(-50%, -50%);
  transition: .6s;
  cursor: pointer;
  margin-left: auto
}
.change{
	background:rgba(0,0,0,0.5);
	border-radius: 60px;
}
.hamburger-menu div {
  width: 40px;
  padding: 0px;
  background: var(--et-magenta);
  height: 2px;
  margin: 10px 5px;
  border-radius: 30px;
  transition: .6s;
}

.change div:nth-child(1) {
  transform: translateY(12px) rotate(45deg);
  background-size: 400% 400%;
  background-image: linear-gradient(-45deg, #2626ff, #0d9eff, #ff0d6e, #cf0d6e);
  animation: mymove 10s linear infinite;
}

.change div:nth-child(3) {
  transform: translateY(-12px) rotate(-45deg);
  background-size: 400% 400%;
  background-image: linear-gradient(-45deg, #2626ff, #0d9eff, #ff0d6e, #cf0d6e);
  animation: myMove 10s linear infinite;
}

@keyframes mymove {
  0% {
    background-position: 0% 50%;
  }
  
  50% {
    background-position: 100% 50%;
  }
  
  100% {
    background-position: 0% 50%;
  }
}

@keyframes myMove {
  0% {
    background-position: 0% 50%;
  }
  
  50% {
    background-position: 100% 50%;
  }
  
  100% {
    background-position: 0% 50%;
  }
}

.change div:nth-child(2) {
  opacity: 0;
  background: lightblue;
}

@media(max-width: 767px) {
  .hamburger-menu {
    position: absolute;
    top: 50%;
    left: 45%;
    transform: translateX(-50%) translateY(-50%);
  }
}

#contador{
	padding: 60px 0;
	text-align: center;
	background: url(../img/back-time.jpg) center center no-repeat fixed;
	background-size:cover;
}
#contador h2{
	font-size:45px;
	margin:0 0 16px 0;
	color:#ffffff;
}
#days, #hours, #minutes, #seconds{
    font-size:50px;
    display: block;
    width: 100%;
    text-align: center;
    font-weight: bold;
}
#demo .flex-25{
  flex: 0 0 20%;
  background: #ffffff;
  padding: 16px 0;
  color: #000;
  margin: 0 2.5%;
  border-radius: 16px;
}

/*DATOOOOOS*/
#datos{
	background: url(../img/back-datos.jpg) center center no-repeat;
	padding: 80px 0;
	background-size: cover;
}
#datos h2{
	font-size:45px;
	color:#fff;
	margin:0 0 32px 0;
}
.datos-evento-caja{
	border:1px solid rgba(0,236,249, 0.2);
	padding: 18px 0;
	aspect-ratio: 9/10;
	background: rgba(1,28,64,0.3);
	width: 85%;
	margin:0 auto;
	transition: 0.3s;
	color:#fff;
	font-size:30px;
	font-weight: 900;
}
.datos-evento-caja:hover{	
	transform: scale(1.08);
	-webkit-box-shadow:0px 0px 30px 0px rgba(0,237,249,0.2);
	-moz-box-shadow: 0px 0px 30px 0px rgba(0,237,249,0.2);
	box-shadow: 0px 0px 30px 0px rgba(0,237,249,0.2);
}
.datos-evento-caja h4{
	font-size:14px;
	color:#fff;
	margin:0 0 8px 0;
}
.datos-abajo{
	position: absolute;
	z-index: 1;
	bottom: 5%;
	width: 100%;
}
#donde{
	background: url(../img/back-donde.png?v=1) center center no-repeat;
	opacity: 0.8;
	background-size:cover;
}
#donde .cta-absoluto, #fecha .cta-absoluto, #hora .cta-absoluto{
	position: absolute;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
	z-index: 4;
}
.caja-logos{
	background: #ffffff;
	padding: 40px 0;
	border-radius: 32px;
	margin-top:32px;
	height: auto;
	position: relative;
	overflow: hidden;
}
.caja-logos_exp{
	width: 100%;
	height: auto;
}
#toggle{
	position: absolute;
	z-index: 8;
	bottom: 0px;
	width: 100%;
	text-align: center;
	padding: 30px 0;
	text-align: center;
	background: linear-gradient(0deg,rgba(254, 57, 160, 1) 20%, rgba(255, 255, 255, 0) 90%);
	cursor: pointer;
}
#donde:hover{
	opacity: 1;
}
#fecha{
	background: url(../img/back-fecha.png?v=1) center center no-repeat;
	opacity: 0.8;
	background-size:cover;
}
#fecha:hover{
	opacity: 1;
}
#hora{
	background: url(../img/bback-impulsar.png?v=1) center center no-repeat;
	opacity: 0.8;
	background-size:cover;
}
#hora:hover{
	opacity: 1;
}
.datos-icon{
	display: block;
	width: 50px;
	height: 50px;
	background:#FE39A0;
	text-align: center;
	line-height: 50px;
}


.messenger{
	position: fixed;
	z-index: 99;
	right: 20px;
	bottom: 20px;
	width:64px;
	height: 64px;
}
.messenger img{
	display: block;
	width: 100%;
	border:0
}
.menu-mostrar{
	position: fixed;
	z-index: 10	;
	top:0;
	display: none;	
	z-index: 10;
	left:0;
	width: 100%;
	height: 100vh;
	background:rgba(1,28,64,0.95);
	backdrop-filter:blur(8px);
}
.menu-mostrar .flex-50{
	flex:0 0 calc(50% - 2px);
	border-left:1px solid rgba(0,236,249, 0.2);
	border-right:1px solid rgba(0,236,249, 0.2);
	color:#FE39A0;
	height: 100vh;
}
.menu-mostrar .flex-20, .menu-mostrar .flex-30{
	height: 100vh;
}
.menu-caja-logo{
	padding: 50px 0;
	height: 30%;
}
.menu-caja-logo a{
	width: 100%;
	display: block;
}
.menu-caja-logo a img{
	display: block;
}
.divider-menu{
	border-bottom:1px solid rgba(0,236,249, 0.2);
}
.caja-social-media{
	color:#fff;
}
.caja-social-media h3{
	color:#fff;
	font-size:32px;
	letter-spacing: -2px;
	margin:0;
}
.caja-social-media ul{
	margin:0;
	padding: 0;
}
.caja-social-media ul li{
	margin:12px 0;
	list-style: none;
	display: block;
	width: auto;
}
.caja-social-media ul li a{
	color:#fff;
	text-decoration: none;
}
.caja-social-media ul li img{
	margin:0 8px 0 0;
	display: inline-block;
	width: 16px;
	text-align: center;
	transition: 0.3s;
	line-height: 24px;
}
.caja-social-media ul li:hover img{
	background:#FE39A0;
}
.items-menu a{
	display: block;
	width: 100%;
	font-size:52px;
	font-weight: 400;
	padding: 16px 0;
	color:#ffffff;
	text-decoration: none;
	text-transform: uppercase;
	transition: 0.3s;
	border-bottom:1px solid transparent;
}
.items-menu a:hover{
	letter-spacing: 4px;
	color:#FE39A0;
	font-weight: 900;
}
.mapa iframe{
	width: 100%;
	height: 100vh;
}
.overlay-mapa{
	position: absolute;
	background:rgba(1,28,64,0.8);
	left:0;
	top:0;
	z-index: 2;
	width: 100%;
	height: 100%;
}
.caja-datos{
	position: absolute;
	bottom:10%;
	width: calc(90% - 32px);
	left:5%;
	background:rgba(1,28,64,1);
	padding: 16px;
	border:1px solid rgba(0,236,249, 0.2);
	color:#fff;
}
.menu-idiomas{
	width:calc(100% - 140px);
	float: left;
	text-align: right;
}
.divider{
	color:#FE39A0;margin:0 6px;
	display: inline-block;
}
.caja-datos h3{
	margin:0 0 16px 0;
	font-size:24px;
}
.caja-datos a{
	color:#fff;
}
.caja-datos ul{
	margin:0 0 42px 0;
	padding: 0;
}
.caja-datos ul li{
	margin:8px 0;
	list-style: none;
	display: block;
	width: auto;
}


.pleca-menu{
	color:#fff;
	font-weight: bold;
	text-decoration: none;
}
#anpact{
	background: #000;
	color:#f0f0f0;
	padding:40px 0;
	line-height: 1.5;
}
#anpact h2{
	color:#fff;
	font-size:36px;
	line-height: 1.2;
}
.vectores-anpact{
	background: url(../img/exposure-orange-american-truck-black-background-ai-generative.jpg) center center no-repeat;
	background-size: cover;
	width:100%;
	aspect-ratio: 1;
}
.vectores-anpact img{
	opacity: 0.6;
	animation-name: light;
	animation-duration: 4s;
	animation-iteration-count: infinite;
}
@keyframes light{
	0%{
		opacity: 0.2;
	}
	20%{
		opacity: 1;
	}
	30%{
		opacity: 0.4;
	}
	40%{
		opacity: 0.9;
	}
	50%{
		opacity: 0.2;
	}
	80%{
		opacity: 1;
	}
	100%{
		opacity: 0.8;
	}
}




.seperator-wrapper {
  width: 100%;
  overflow: hidden;
}
.seperator-wrapper .seperator {
  width: 3000px;
  height: 5px;
  animation: rotate 3s infinite linear;
  -webkit-animation: rotate 3s infinite linear;
}

@-webkit-keyframes rotate {
  from {
    background-position: -3000px;
  }
  to {
    background-position: 0px;
  }
}
@keyframes rotate {
  from {
    background-position: -3000px;
  }
  to {
    background-position: 0px;
  }
}
.gradient {
  background: #30ff90;
  /* Old browsers */
  background: -moz-linear-gradient(left, #30ff90 0%, #ed2ded 25%, #c99826 50%, #30ffe6 75%, #30ff90 100%);
  /* FF3.6+ */
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #30ff90), color-stop(25%, #ed2ded), color-stop(50%, #c99826), color-stop(75%, #30ffe6), color-stop(100%, #30ff90));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(left, #30ff90 0%, #ed2ded 25%, #c99826 50%, #30ffe6 75%, #30ff90 100%);
  /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(left, #30ff90 0%, #ed2ded 25%, #c99826 50%, #30ffe6 75%, #30ff90 100%);
  /* Opera 11.10+ */
  background: -ms-linear-gradient(left, #30ff90 0%, #ed2ded 25%, #c99826 50%, #30ffe6 75%, #30ff90 100%);
  /* IE10+ */
  background: linear-gradient(to right, #30ff90 0%, #ed2ded 25%, #c99826 50%, #30ffe6 75%, #30ff90 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#30ff90', endColorstr='#30ff90',GradientType=1 );
  /* IE6-9 */
}



#expositores{
	padding: 80px 0;
	background: #000b1a;
}
#expositores h3{
	display: inline-block;
	margin:0 auto;
	background: #FE39A0;
	border-radius:100px;
	padding: 8px 24px;
	font-size:12px;
	color:#fff;
	font-weight: 500;
}
#expositores h2{
	font-size:60px;
	color:#fff;
	margin:0;
}
.expositor-item-logo{
	position: relative;
	padding: 16px 0;
	transition: 0.3s;
}
.expositor-item-logo img{
	display: block;
	width:80%;
	background: #fff;
	border-radius: 6px;
	margin:0 auto;
	transition: 0.3s;
}
.expositor-item-logo:before{
	content : "";
	position: absolute;
	left:20%;
	top:0;
	width: 60%;
	height: 100%;
	transition: 0.3s;
	border-bottom:1px solid rgba(144,144,144, 0);
	border-top:1px solid rgba(144,144,144, 0);
}
.expositor-item-logo:after{
	content : "";
	position: absolute;
	left:0;
	top:25%;
	width: 100%;
	height: 50%;
	transition: 0.3s;	
	border-left:1px solid rgba(144,144,144, 0);
	border-right:1px solid rgba(144,144,144, 0);
}
.expositor-item-logo:hover:before{
	border-bottom:1px solid rgba(144,144,144, 0.9);
	border-top:1px solid rgba(144,144,144, 0.9);
}
.expositor-item-logo:hover:after{
	border-left:1px solid rgba(144,144,144, 0.9);
	border-right:1px solid rgba(144,144,144, 0.9);
}


/*

	Galería

*/
#galeria{
	padding: 80px 0;
	background: var(--et-azul-1);
}
#galeria h2{
	text-align: center;
	color:#fff;
	font-size: 45px;
	margin: 0 0 32px 0;
}
.item .color-overlay{
	background: rgba(0,2,29,0.7);
	position: absolute;
	z-index: 2;
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
	transition: 0.3s;
}
.item:hover  .color-overlay{
	background: rgba(0,2,29,0.1);
}
.item.big .color-overlay{
	background: rgba(0,2,29,0.1) !important;
}






/*

	FOOTER


*/
footer{
	background:#000b1a;
	padding: 60px 0;
	position: relative;
	color:#fff;
}
.end-gradient{
	background: -moz-linear-gradient(0deg, rgba(0,11,26,1) 25%, rgba(0,11,26,0) 100%);
	background: -webkit-linear-gradient(0deg, rgba(0,11,26,1) 25%, rgba(0,11,26,0) 100%);
	background: linear-gradient(0deg, rgba(0,11,26,1) 25%, rgba(0,11,26,0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000b1a",endColorstr="#000b1a",GradientType=1);
	width: 100%;
	height: 100px;
	top:-100px;
	position: absolute;
	z-index: 5;
}
.logo-footer{
	display: block;
	max-width: 300px;
	width: 80%;
}
.links-paginas{
	margin:0;
	padding: 0;
}
.links-paginas li{
	list-style: none;
	margin: 8px 0;
}
.links-paginas li a{
	color:#fff;
	text-decoration: none;
	position: relative;
}
.links-paginas li a:after {
  background: none repeat scroll 0 0 transparent;
  bottom: 0;
  content: "";
  display: block;
  height: 2px;
  left: 0%;
  position: absolute;
  background: #f00;
  transition: width 0.3s ease 0s, left 0.3s ease 0s;
  width: 0;
}
.links-paginas li a:hover:after {
  width: 100%; 
  left: 0; 
}
@media screen and (max-height: 300px) {
	ul {
		margin-top: 40px;
	}
}
.social-media a{
	display: inline-block;
	width:40px;
	height:40px;
	text-align: center;
	line-height: 40px;
	background:#FE39A0;
	color:#fff;
	margin:0 6px 0 0;
	font-size:18px;
}
.social-media a img{
	display: block;
	width: 65%;
	margin:15% auto 0 auto;
}
.linea-footer{
	display: block;
	width: 100%;
	border-top:1px solid rgba(0,236,249, 0.2);
	margin-top:64px;
	padding: 16px 0;
	font-size:14px;
}
footer .simple-link{
	color:#fff;
}



#impulsando{
	background: url(../img/back-impulsar.jpg) center center no-repeat fixed;
	background-size:cover;
	padding: 80px 0;
	color:#fff;
}
#impulsando h2{
	color:#fff;
	font-size:40px;
	margin:0;
}
#impulsando h3{
	font-size:30px;
	margin:0;
}
.video {
	height: 0;
	overflow: hidden;
	padding-bottom: 56.25%;
	padding-top: 30px;
	position: relative;
}
.video iframe, .video object, .video embed {
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}


#mast-int{
  overflow:hidden;
  min-height:55vh;
  position: relative;
}
#mast-int h2{
	margin:0;
	font-size: 25px;
}
#mast-int .overlay{
	position: absolute;
	z-index: 1;
	top:0;
	left:0;
	width: 100%;
	color:#fff;
	height: 100%;
	background: rgba(1,28,64, 0.8);;
}
#mast-int video {
    position: absolute;
    top: -60px;
    left: 0;
    height: auto;
    width: auto;
    min-width: 100%;
    min-height: calc(100% + 110px);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}


.parallax-background-container { 
    height: 500px;
    position: relative;
    overflow: hidden;
    margin-top: 60px;
}

.section-bg {
    position: absolute;
    width: 100%;
    height: 650px;
    top: 0;
    left: 0;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}
#encontraras{
	background: var(--et-azul-1);
	padding: 60px 0;
}
#encontraras h2{
	font-size:45px;
	color:#fff;
	margin:0 0 16px 0;
}
#encontraras h4{
	color:#fff;
	margin:0;
	font-size: 25px;
}
.encontraras-caja{
	position: relative;
	width:calc(100% - 2px);
	margin:0 auto;
	border:1px solid var(--et-azul-3);
	aspect-ratio: 1/1;
	transition: 0.3s;
	font-size: 17px;
	line-height: 1.5;
	background-size:cover;
}
.linea-roja{
	position: absolute;
	top:24px;
	left:5%;
	width: 10px;
	height: 2px;
	background: #FE39A0;
	transition: 0.3s;
}
.encontraras-caja-textos{
	position: absolute;
	z-index: 2;
	bottom: 16px;
	left:5%;
	width: 90%;
	color:#fff;
	transition: 0.3s;
}
.gradiente-overlay{
	width: 100%;
	height: 50%;
	position: absolute;
	z-index: 1;	
	bottom:0;
	transition: 0.3s;
	background: -moz-linear-gradient(0deg, rgba(0,11,26,1) 15%, rgba(0,11,26,0) 90%);
	background: -webkit-linear-gradient(0deg, rgba(0,11,26,1) 15%, rgba(0,11,26,0) 90%);
	background: linear-gradient(0deg, rgba(0,11,26,1) 15%, rgba(0,11,26,0) 90%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000b1a",endColorstr="#000b1a",GradientType=1); 
}
.encontraras-caja:hover{
	border:1px solid var(--et-cian);
}
.encontraras-caja:hover .linea-roja{
	width: 90%;
}
.encontraras-caja:hover .encontraras-caja-textos{
	bottom: 24px;
}
.encontraras-caja:hover .gradiente-overlay{
	height: 100%;
}



#razones{
	padding: 60px 0;
	background: var(--et-azul-2);
}
#razones h2{
	font-size:35px;
	color:#fff;
	margin:0;
}
.row-razones{
	border-top:1px solid rgba(255,255,255,0.2);
	border-bottom:1px solid rgba(255,255,255,0.2);
	padding: 24px 0;
	color:#fff;
	display: block;
	margin:0;
	transition: 0.3s;
}
.row-razones h4{
	font-size:24px;
	margin:0 0 12px 0;
	line-height: 1.2;
}
.row-razones .numero{
	text-align: left;
	font-size:100px;
	font-weight: 700;
	opacity: 0.4;
	transition: 0.3s;
	color:var(--et-azul-2);
	-webkit-text-stroke-width: 2px;
	-webkit-text-stroke-color: #fff;
}
.razones-textos{
	opacity: 0.8;
	line-height: 1.5;
	opacity: 0.3s;
	transition: 0.3;
}
.icono-razon{
	font-size:40px;
	text-align: right;
}
.row-razones:hover{
	border-top:1px solid #FE39A0;
	border-bottom:1px solid #FE39A0;
}
.row-razones:hover .numero{
	opacity: 0.8;
	-webkit-text-stroke-color: #FE39A0;
}
.row-razones:hover .razones-textos{
	opacity: 1;
}



	
#numeros{
	padding: 80px 0;
	background: url(../img/back-numeros.jpg?v=1) center center no-repeat fixed;
	background-size: cover;
}
#numeros h2{
	text-align: center;
	margin:0 0 24px 0;
	color:#fff;
	font-size:50px;
}
#numeros .caja-resultados{
	background: rgba(0,0,0,0.3);
	width: 80%;
	padding: 24px 0;
	font-size:18px;
	line-height: 1.6;
	backdrop-filter:blur(6px);
	color:#fff;
	position: relative;
	overflow: hidden;
	margin:0 auto;
	transition: 0.3s;
}
#numeros .caja-resultados h4{
	font-size: 65px;
	margin:0 0 24px 0;
}
.absoluto-numero{
	position: absolute;
	bottom: -40%;
	right: -8%;
	-webkit-text-stroke-width: 1px;
	-webkit-text-stroke-color: rgba(255,255,255,0.2);
	font-size:200px;
	font-weight: 900;
	color:transparent;
	transition: 0.3s;
}
#numeros .caja-resultados:hover{
	background: rgba(0,0,0,0.6);
}
#numeros .caja-resultados:hover .absoluto-numero{
	-webkit-text-stroke-color: rgba(255,255,255,0.5);
}
#numeros .caja-resultados.borde-rojo{
	border:1px solid var(--et-cian);
}
#numeros .caja-resultados.borde-magenta{
	border:1px solid var(--et-magenta);
}
#numeros .caja-resultados.borde-amarillo{
	border:1px solid var(--et-yelow);
}
#numeros .caja-resultados.borde-azul{
	border:1px solid var(--et-azul-4);
}	
#recursos{
	padding: 	0;
	background: #FE39A0;
}
#recursos h2{
	font-size:30px;
	margin:0;
	color:#fff;
}
#recursos a{
	display: block;
	padding: 24px 8px;
	width: calc(100% - 18px);
	color:#fff;
	text-decoration: none;
	font-size:14px;
	border-left:1px solid rgba(255,255,255,0.2);
	border-right:1px solid rgba(255,255,255,0.2);
	font-weight: 600;
	align-self: flex-end;
	transition: 0.3s;
}
#recursos a i{
	display: block;
	font-size:24px;
	margin:0 0 8px 0;
}
#recursos a:hover{
	background: #fff;
	color:#FE39A0;
	transform:scale(1.3);
	box-shadow: rgb(38, 57, 77) 0px 20px 30px -10px;
}


#contacto-prensa{
    padding:80px 0;
    background:var(--et-azul-1);
    background-size:cover;
}
#contacto-prensa h2{
    color:#fff;
    font-size:40px;
}
.datos-contacto{
    margin:0;
    padding:0;
}
.datos-contacto li{
    list-style:none;
    margin:8px 0;
    font-size:24px;
    color:#fff;
    padding:0;
}
.datos-contacto li i{
    display:inline-block;
    width:50px;
    height:50px;
    background:#FE39A0;
    color:#fff;
    font-size:24px;
    text-align:center;
    line-height:50px;
}



@media screen and (max-width:1250px){
	.text{
		font-size: 45px;
	}
	#datos h2{
		font-size: 35px;
	}
	#datos .flex-20{
		flex:0 0 100%;
	}
	#datos .flex-80{
		flex:0 0 100%	;
	}
	#impulsando .flex-10{
		flex:0 0 8%;
	}
	#impulsando h2{
		font-size:35px;
	}
	footer .flex-40{
		flex:0 0 100%;
	}
	footer .flex-20{
		flex:0 0 50%;
		margin-bottom: 40px;
	}
	#mast-int{
		padding: 50px 0;
		height: auto;
	}
	.menu-mostrar{
	}
	#recursos{
		padding: 16px 0;
	}
	#recursos .flex-15{
		flex:0 0 100%;
	}
	.flex-14{
		flex:0 0 14.2857142857%;
	}
	.row-razones .numero{
		font-size: 80px;
	}
}


@media screen and (max-width:1000px){
	.flex-33, .flex-50, .flex-20, .flex-10, .flex-30, .flex-10, .flex-40{
		flex:0 0 100%;
	}
	.caja-logos .flex-10{
		flex:0 0 33.33%;
	}
	#impulsando .flex-50{
		margin-bottom: 32px;
	}
	#donde, #fecha, #hora{
		background-size: cover;
	}
	#datos .flex-33{
		margin-bottom: 42px;
	}
	#expositores .derecha{
		text-align: left;
	}
	#expositores .flex-50{
		margin-bottom: 42px;
	}
	.flex-12{
		flex:0 0 20%;
	}
	nav .flex-30, nav .flex-70{
		flex:0 0 50%;
	}
	.col-30, .col-60, .col-10{
		width:100%;
	}
	.text{
		font-size:35px;
	}
	.pleca-menu, .divider{
		display: none;
	}
	.menu-caja-logo{
		display: block;
		width:200px;
	}
	#menu_redes_sociales{
		display: none;
	}
	.menu-mostrar .flex-50{
		flex:0 0 100%;
		border-left:0;
		border-right: 0;
		border-bottom: 1px solid rgba(0,236,249, 0.2);
	}
	.items-menu a{
		font-size: 42px;
	}
	.menu-caja-logo{
		padding: 32px 0;
	}
	.h-20{
		height: auto;
	}
	.menu-mostrar .flex-30{
		height: auto;
	}
	.menu-mostrar .flex-20, .menu-mostrar .flex-20{
			height: auto;
	}
	.mapa iframe{
		height: 500px;
	}
	.menu-mostrar .h-20, .menu-mostrar .h-100, .menu-mostrar .h-80{
		height: auto;
	}
	.menu-mostrar .flex-50{
		height: auto;
	}
	.flex-60{
		flex:0 0 100%;
	}
	#razones h2{
		margin-bottom: 24px;
	}
	.icono-razon{
		display: none;
	}
	#recursos .flex-14{
		flex:0 0 25%;
	}
}


@media screen and (max-width:750px){
	footer .flex-20{
		flex:0 0 100%;
		margin-bottom: 40px;
	}
	footer .derecha{
		text-align: left;
	}
	.menu-idiomas{
		width: 100%;
		margin-right: 60px;
	}
	#mast-int{
		padding: 30px 0 100px 0;
		min-height: 65vh;
	}
	header#expositores h1{
		font-size: 45px;
	}
	#demo .flex-25{
		flex:0 0 45%;
		margin-bottom:12px;
	}
	.datos-contacto li{
	    font-size:16px;
	}
	.datos-contacto li i{
	    display:block;
	    margin-top:32px;
	}
	#recursos .flex-14{
		flex:0 0 50%;
	}
	#recursos a{
		border: 1px solid rgba(255,255,255,0.2);
	}
	#recursos .vertical-center{
		align-items:left;
		justify-content:left;
	}
	#contacto-prensa h2{
		font-size: 32px;
	}
	#numeros h2{
		font-size:40px;
	}
	#recursos{
		padding: 16px 0;
	}
	#encontraras h2{
		font-size: 35px;
	}
	#encontraras .flex-50{
		margin-bottom: 32px;
	}
	#encontraras .derecha{
		text-align: left;
	}
	.encontraras-caja{
		font-size: 14px;
		aspect-ratio: 4/5;
	}
	#expositores h2{
		font-size: 35px;
	}
	#expositores .flex-12{
		flex:0 0 33.33%;
	}
	#numeros .caja-resultados h4{
		font-size: 35px;
	}
	.absoluto-numero{
		font-size: 120px;
		bottom: -25%;
	}
}
@media screen and (max-width:420px){
	.encontraras-caja{
		aspect-ratio:9/16;
	}
}