@import url('variables.css');

html {
  scroll-behavior: smooth;
}

body {
	margin: 0px;
	padding: 0px;
	font-family: var(--poppins-regular);
	font-size: 1rem;
}

a,
a:hover,
a:focus,
button:hover,
button:active,
button:focus {
	text-decoration: none;
	outline: none;
}

.bloqueado {
	overflow: hidden;
}

.bloqueado .linea-right {
	height: 105px;
}

.sin-margin {
	margin-left: 0 !important;
	margin-right: 0 !important;
}

.sin-padding {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.menu-over-all {
	position: fixed;
	z-index: 10;
	width: 100vw;
	height: 100vh;
	top: -100vh;
	left: 0px;
	background: var(--blanco2);
	transition: all 0.5s ease;
}

.menu-visible {
	top: 0px;
	transition: all 0.5s ease;
}

.fondo-gris {
	background: var(--gris1);
}

.tabla-menu-over-all {
	display: table;
	width: 100%;
	height: 100vh;
}

.celda-menu-over-all {
	position: relative;
	display: table-cell;
	width: 100%;
	height: 100%;
	vertical-align: middle;
	overflow: hidden;
}

.btn-reubicacion {
	position: absolute;
	top: 0;
	right: 50px;
}

.menu-desktop-movil {
	list-style: none;
	margin: 0;
	padding: 0;
}

.menu-desktop-movil li {
	text-align: right;
}

.enlace-menu-desktop-movil {
	display: inline-block;
    position: relative;
    font-family: var(--poppins-regular);
    font-size: 3rem;
    color: var(--blanco);
    padding: 0 230px 0 0;
    margin: 0;
    text-align: right;
}

.linea {
	position: absolute;
	display: block;
	right: 0px;
	bottom: 12px;
	width: 0;
	height: 2px;
	background: var(--blanco);
	transition: all 0.5s ease;
}

.enlace-menu-desktop-movil:hover {
	color: var(--blanco);
}

.enlace-menu-desktop-movil:hover .linea {
	width: 100%;
	transition: all 0.5s ease;
}

.logo-menu {
	display: block;
	left: 0;
	right: 0;
	margin: 0 auto;
}

.barratop {
	width: 100%;
	height: 100px;
	padding: 0 50px;
	background: var(--blanco);
	transition: all 0.5s ease;
}

.barra-fija {
	-webkit-backdrop-filter: saturate(50%) blur(5px);
    backdrop-filter: saturate(50%) blur(5px);
    background-color: rgba(255, 255, 255, 0.6);
	position: fixed;
	z-index: 5;
	top: 0px;
	left: 0px;
	width: 100vw;
	height: 80px;
}

.redes-tabla {
	display: table;
	height: 100px;
	transition: all 0.5s ease;
}

.redes-celda {
	display: table-cell;
	height: 100%;
	vertical-align: middle;
}

.red {
	display: inline-block;
	font-size: 1.6rem;
	color: var(--lila);
	transition: all 0.5s ease;
}

.red:hover {
	color: var(--verde2);
	transition: all 0.5s ease;
}

.barra-fija .redes-tabla {
	height: 80px;
	transition: all 0.5s ease;
}

.logo {
	display: block;
	width: 236px;
	height: auto;
	left: 0;
	right: 0;
	margin: 0 auto;
	transition: all 0.5s ease;
}

.barra-fija .logo {
	width: 190px;
	transition: all 0.5s ease;
}

.btn-tabla {
	display: table;
	width: 100%;
	height: 100px;
}

.btn-celda {
	display: table-cell;
	width: 100%;
	height: 100%;
	text-align: right;
	vertical-align: middle;
}

.boton {
	display: inline-block;
	width: 35px;
	height: 35px;
	border: none;
	background: none;
	color: var(--verde2);
	padding: 0;
	margin: 0;
}

.idioma span {
	display: table-cell;
	width: 35px;
	height: 35px;
	vertical-align: middle;
	text-align: center;
	font-size: 0.9rem;
}

.menu i {
	display: table-cell;
	width: 35px;
	height: 35px;
	vertical-align: middle;
	text-align: center;
	font-size: 1.6rem;
	line-height: 1rem;
}

.banner {
	position: relative;
	padding: 0 50px;
	height: calc(100vh - 100px);
}

.video-wrapper {
	position: relative;
	z-index: 1;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.video-wrapper iframe {
	position: absolute;
	z-index: 1;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 100%;
	transform: translate(-50%, -50%);
}

.banner-letrero-tabla {
	position: absolute;
	z-index: 2;
	display: table;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.6);
}

.banner-letrero-celda {
	display: table-cell;
	width: 100%;
	height: 100%;
	text-align: center;
	vertical-align: bottom;
	padding: 0 0 150px 0;
}

.letrero-verde {
	font-family: var(--poppins-light);
	font-weight: normal;
	font-size: 2.5rem;
	color: var(--verde2);
	margin: 0;
	padding: 0;
}

.letrero-lila {
	position: relative;
	display: inline-block;
	font-family: var(--poppins-semibold);
	font-weight: normal;
	font-size: 3rem;
	color: var(--lila);
	margin: 0;
	padding: 0;
}

@media (min-aspect-ratio: 16/9) {
  .video-wrapper iframe {
    height: 56.25vw;
  }
}
    
@media (max-aspect-ratio: 16/9) {
  .video-wrapper iframe {
    width: 177.78vh;
  }
}

.flecha {
	position: absolute;
	right: 20px;
	bottom: -30px;
	width: 19px;
	display: inline-block;
}

.uno {
	position: relative;
	display: block;
	width: 19px;
	height: 19px;
}

.uno img {
	vertical-align: top;
	padding: 6px 0 0 0;
}

.dos {
	position: relative;
	display: block;
	width: 19px;
	height: 19px;
}

.dos img {
	vertical-align: top;
}

@keyframes bounceAlpha {
	0%  {opacity: 1; transform: translateY(0px) scale(1);}
	25% {opacity: 0; transform:translateY(10px) scale(0.9);}
	26% {opacity: 0; transform:translateY(-10px) scale(0.9);}
	55% {opacity: 1; transform: translateY(0px) scale(1);}
}

.bounceAlpha {
    animation-name: bounceAlpha;
    animation-duration:1.4s;
    animation-iteration-count:infinite;
    animation-timing-function:linear;
}

.flecha {
    animation-name: bounceAlpha;
    animation-duration:1.4s;
    animation-iteration-count:infinite;
    animation-timing-function:linear;
}

.uno {
    animation-name: bounceAlpha;
    animation-duration:1.4s;
    animation-delay:0.2s;
    animation-iteration-count:infinite;
    animation-timing-function:linear;
}

.enlace-flecha {
	display: table;
	width: 24px;
	height: 24px;
	background: var(--blanco);
} 

.enlace-flecha i {
	display: table-cell;
	width: 100%;
	height: 100%;
	text-align: center;
	vertical-align: middle;
	font-size: 1.1rem;
	color: var(--gris1);
}

.apunta-abajo-derecha {
	transform: rotate(0.88turn);
}

.apunta-arriba-derecha {
	transform: rotate(0.13turn);
}

.apunta-arriba-izquierda {
	transform: rotate(0.88turn);
}

.overvideo {
	position: absolute;
	z-index: 3;
	bottom: 0;
	left: 0;
}

.over-abajo-izquierda {
	position: absolute;
	z-index: 3;
	bottom: 0;
	left: 0;
}

.over-abajo-derecha {
	position: absolute;
	z-index: 3;
	bottom: 0;
	right: 0;
}

@keyframes Arriba {
	0%  {opacity: 1; transform: translateX(0px) translateY(0px) scale(1);}
	25% {opacity: 0; transform: translateX(0px) translateY(-10px) scale(0.9);}
	26% {opacity: 0; transform: translateX(0px) translateY(10px) scale(0.9);}
	55% {opacity: 1; transform: translateX(0px) translateY(0px) scale(1);}
}

.Arriba {
    animation-name: Arriba;
    animation-duration:1.4s;
    animation-iteration-count:infinite;
    animation-timing-function:linear;
}

.mover-arriba:hover i {
	animation-name: Arriba;
    animation-duration:1.4s;
    animation-delay:0.2s;
    animation-iteration-count:infinite;
    animation-timing-function:linear;
}

@keyframes AbajoDerecha {
	0%  {opacity: 1; transform: translateY(0px) translateX(0px) rotate(0.88turn) scale(1);}
	25% {opacity: 0; transform: translateY(10px) translateX(10px) rotate(0.88turn) scale(0.9);}
	26% {opacity: 0; transform: translateY(-10px) translateX(-10px) rotate(0.88turn) scale(0.9);}
	55% {opacity: 1; transform: translateY(0px) translateX(0px) rotate(0.88turn) scale(1);}
}

.AbajoDerecha {
    animation-name: AbajoDerecha;
    animation-duration:1.4s;
    animation-iteration-count:infinite;
    animation-timing-function:linear;
}

.mover-abajo-derecha:hover i {
	animation-name: AbajoDerecha;
    animation-duration:1.4s;
    animation-delay:0.2s;
    animation-iteration-count:infinite;
    animation-timing-function:linear;
}

@keyframes ArribaDerecha {
	0%  {opacity: 1; transform: translateX(0px) translateY(0px) rotate(0.13turn) scale(1);}
	25% {opacity: 0; transform: translateX(10px) translateY(-10px) rotate(0.13turn) scale(0.9);}
	26% {opacity: 0; transform: translateX(-10px) translateY(10px) rotate(0.13turn) scale(0.9);}
	55% {opacity: 1; transform: translateX(0px) translateY(0px) rotate(0.13turn) scale(1);}
}

.ArribaDerecha {
    animation-name: ArribaDerecha;
    animation-duration:1.4s;
    animation-iteration-count:infinite;
    animation-timing-function:linear;
}

.mover-arriba-derecha:hover i {
	animation-name: ArribaDerecha;
    animation-duration:1.4s;
    animation-delay:0.2s;
    animation-iteration-count:infinite;
    animation-timing-function:linear;
}

@keyframes ArribaIzquierda {
	0%  {opacity: 1; transform: translateX(0px) translateY(0px) rotate(0.88turn) scale(1);}
	25% {opacity: 0; transform: translateX(-10px) translateY(-10px) rotate(0.88turn) scale(0.9);}
	26% {opacity: 0; transform: translateX(10px) translateY(10px) rotate(0.88turn) scale(0.9);}
	55% {opacity: 1; transform: translateX(0px) translateY(0px) rotate(0.88turn) scale(1);}
}

.ArribaIzquierda {
    animation-name: ArribaIzquierda;
    animation-duration:1.4s;
    animation-iteration-count:infinite;
    animation-timing-function:linear;
}

.mover-arriba-izquierda:hover i {
	animation-name: ArribaIzquierda;
    animation-duration:1.4s;
    animation-delay:0.2s;
    animation-iteration-count:infinite;
    animation-timing-function:linear;
}

.margin-top-50 {
	margin-top: 50px;
}

.margin-top-100 {
	margin-top: 100px;
}

.margin-top-130 {
	margin-top: 130px;
}

.margin-top-150 {
	margin-top: 150px;
}

.titulo {
	margin: 0 0 0 120px;
	padding: 0;
	font-family: var(--poppins-medium);
	font-size: 2.8rem;
	color: var(--gris1);
}

.txt-margin-left {
	position: relative;
	margin: 15px 0 0 12%;
	padding: 40px 0 0 30px;
}

.txt-margin-left2 {
	position: relative;
	margin: 15px 0 0 0;
	padding: 40px 0 0 30px;
}

.linea-left {
	position: absolute;
	z-index: 2;
	top: 0;
	left: 0;
	width: 5px;
	height: 225px;
	background: var(--gris1);
}

.txt-margin-right {
	position: relative;
	margin: 15px 12% 0 0;
	padding: 40px 30px 0 0;
}

.linea-right {
	position: absolute;
	z-index: 2;
	top: 0;
	right: 0;
	width: 5px;
	height: 225px;
	background: var(--gris1);
}

.subtitulo {
	font-family: var(--poppins-light);
	font-size: 3rem;
	color: var(--gris1);
	margin: 0px;
	padding: 0px;
}

.txt {
	font-family: var(--poppins-light);
	font-size: 1rem;
	color: var(--gris2);
}

.bloque-right {
	display: inline-block;
	width: 100%;
}

.tarjeta {
	display: block;
	width: 95%;
	max-width: 650px;
	left: 0;
	right: 0;
	margin-left: auto;
	margin-right: auto;
}

.tarjeta-contenido {
	position: relative;
	width: 100%;
	min-height: 220px;
	padding: 15px;
}

.tarjeta-contenido h2 {
	font-size: var(--poppins-regular);
	font-size: 1.5rem;
	color: var(--blanco);
	margin: 0;
	padding: 0;
}

.tarjeta-contenido div {
	font-family: var(--poppins-light);
	font-size: 0.9rem;
	color: var(--blanco);
}

.fondo-lila {
	background: var(--lila);
}

.fondo-verde2 {
	background: var(--verde2);
}

.carrusel-industrias {
	margin-top: 60px;
}

.cajon {
	display: block;
	background: var(--beige);
	padding: 50px 25px;
}

.caja-img {
	position: relative;
}

.caja-img h3 {
	position: absolute;
	z-index: 2;
	top: 30px;
	left: 18px;
	margin: 0;
	padding: 0;
	font-size: var(--poppins-regular);
	font-weight: normal;
	font-size: 1.3rem;
	color: var(--gris1);
}

.caja-prensa {
	display: inline-block;
	position: relative;
	width: 90%;
}

.caja-prensa img {
	width: 55%;
	position: absolute;
	z-index: 2;
	top: 0px;
	margin: -45px 0 0 45px;
}

.prensa-contenido {
	display: table;
	background: var(--azul);
	width: 100%;
	padding: 0 0 0 0;
}

.prensa-contenido-celda {
	display: table-cell;
	width: 100%;
	height: 100%;
	vertical-align: middle;
	font-family: var(--poppins-light);
	font-size: 1.8rem;
	line-height: 2.5rem;
	color: var(--blanco);
	padding: 80px 0;
}

.renglon {
	display: block;
	padding: 0 0 0 70%;
	margin: 0;
}

.renglon-content {
	position: relative;
	display: inline-block;
}

.txt-linea {
	position: absolute;
	z-index: 0;
	display: block;
	bottom: 0px;
	right: 0px;
	font-family: var(--poppins-medium);
	border-bottom: solid 4px var(--blanco);
	padding: 0;
	margin: 0;
	width: 0%;
	transition: all 0.5s ease;
}

.renglon:hover .txt-linea {
	width: 200%;
	transition: all 0.5s ease;
}

.caja-soluciones {
	margin-top: 80px;
}

.video-secundario {
	position: relative;
	width: 100%;
	height: 100%;
	min-height: 400px;
	overflow: hidden;
}
    
.video-secundario iframe {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.video-soluciones {
	position: relative;
	width: 100%;
	height: 100%;
	min-height: 400px;
	overflow: hidden;
}
    
.video-soluciones iframe {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.video-nosotros {
	position: relative;
	width: 100%;
	height: 100%;
	min-height: 400px;
	overflow: hidden;
}
    
.video-nosotros iframe {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

@media (min-aspect-ratio: 16/9) {
  .video-secundario iframe {
    height: 56.25vw;
  }

  .video-soluciones iframe {
    height: 56.25vw;
  }

  .video-nosotros iframe {
    height: 56.25vw;
  }
}
    
@media (max-aspect-ratio: 16/9) {
  .video-secundario iframe {
    width: 177.78vh;
  }

  .video-soluciones iframe {
    width: 177.78vh;
  }

  .video-nosotros iframe {
    width: 177.78vh;
  }
}

.caja-lila {
	position: relative;
	z-index: 3;
	display: block;
	width: 50%;
	left: 0;
	right: 0;
	margin: -50px auto 0 auto;
	background: var(--lila);
}

.celda-lila {
	position: relative;
	display: table-cell;
	vertical-align: middle;
	padding: 30px;
	font-family: var(--poppins-light);
	font-size: 1rem;
	color: var(--blanco);
}

.titulo-blog {
	display: inline-block;
    min-width: 250px;
    margin: 0 0 0 120px;
    padding: 0;
    font-family: var(--poppins-medium);
    font-size: 2.8rem;
    color: var(--gris1);
    text-align: center;
}

.txt-margin-left-blog {
    position: relative;
    margin: 15px 0 0 12%;
    padding: 0 0 40px 30px;
}

.enlace-blog {
	display: inline-block;
}

.txt-tabla-blog {
	display: table;
	width: 80%;
	height: 100%;
	padding: 20px 40px;
}

.txt-celda-blog {
	display: table-cell;
	width: 100%;
	height: 100%;
	vertical-align: top;
	padding: 0;
	position: relative;
}

.fondo-enlace-lila {
	background: var(--lila) !important;
}

.fondo-enlace-lila i {
	color: var(--blanco) !important;
}

.blog-fecha {
	font-family: var(--poppins-regular);
	font-style: italic;
	font-size: 1.3rem;
	color: var(--gris2);
}

.blog-titulo {
	font-family: var(--poppins-medium);
	font-weight: normal;
	font-size: 3rem;
	color: var(--gris1);
	margin: 0;
	padding: 0;
}

.blog-txt {
	font-family: var(--poppins-light);
	font-size: 1rem;
	color: var(--gris1);
}

footer {
	padding: 0 50px 40px 50px;
}

.caja-footer {
	background: var(--gris1);
	position: relative;
}

.btntop {
	position: absolute;
	z-index: 4;
	bottom: 0px;
	right: 0px;
	display: table;
	width: 25px;
	height: 25px;
	background-color: var(--blanco);
	cursor: pointer;
}

.btntop i {
	display: table-cell;
	width: 25px;
	height: 25px;
	text-align: center;
	vertical-align: middle;
	color: var(--gris2);
}

.footer-barra-izq {
	position: absolute;
	left: 0px;
	top: 0px;
	display: block;
	width: 1px;
	height: 80%;
	border-right: solid 2px var(--blanco);
}

.footer-barra-der {
	position: absolute;
	right: 0px;
	top: 0px;
	display: block;
	width: 1px;
	height: 80%;
	border-left: solid 2px var(--blanco);
}

.link-phone,
.link-phone:hover {
	color: var(--blanco);
	text-decoration: none;
}

.derechos {
	display: block;
	width: 80%;
	left: 0;
	right: 0;
	margin: 0 auto;
	border-top: solid 1px var(--blanco);
	font-family: var(--poppins-regular);
	font-size: 0.8rem;
	color: var(--gris2);
}

.caja-derechos {
	display: table;
	width: 80%;
	height: 40px;
	left: 0;
	right: 0;
	margin: 15px auto 15px auto;
}

.caja-derechos div {
	display: table-cell;
	width: 100%;
	height: 40px;
	vertical-align: middle;
	position: relative;
}

.brandlink {
	position: absolute;
	top: 0px;
	right: 0px;
}

.footerlink {
	color: var(--gris2);
}

.footerlink:hover {
	color: var(--blanco);
}

.enlace-mapa,
.enlace-mapa:hover,
.enlace-mapa:active,
.enlace-mapa:focus {
	color: var(--blanco);
	text-decoration: none;
}

.footer-tabla {
	display: table;
	width: 100%;
	height: 100%;
}

.footer-celda {
	display: table-cell;
	width: 100%;
	height: 100%;
	vertical-align: middle;
	padding: 2rem 0;
}

.footer-txt {
	position: relative;
	display: block;
	width: 80%;
	left: 0;
	right: 0;
	margin: 0 auto;
	padding: 0 0 0 30px;
	color: var(--blanco);
}

.footer-txt i {
	position: absolute;
	top: 15px;
	left: 6px;
}

.footer-menu {
	list-style: none;
	display: inline-block;
	width: 100%;
	margin: 0;
	padding: 0;
}

.footer-menu li {
	float: left;
}

.footer-menu-enlace {
	display: block;
	padding: 0 1rem;
	color: var(--blanco);
	transition: all 0.5s ease;
}

.footer-menu-enlace:hover {
	color: var(--blanco);
	text-decoration: underline;
	transition: all 0.5s ease;
}

.soluciones-top {
	margin: 0 50px 0 0;
}

.txt-margin-equal {
	position: relative;
	margin: 100px 44px 60px 34px;
	padding: 0 0 0 25px;
}

.linea-blanca {
	background: var(--blanco) !important;
}

.subtitulo-blanco {
	font-size: 4rem;
	color: var(--blanco) !important;
}

.subtitulo-lila {
	font-size: 4rem;
	color: var(--lila) !important;
}

.txt-blanco {
	color: var(--blanco2) !important;
}

.banner2 {
	position: relative;
	margin: 0 10px;
	padding: 0;
	width: calc(100% - 20px);
	height: 750px;
	overflow: hidden;
}

.video-wrapper2 {
	position: relative;
	z-index: 1;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.video-wrapper2 iframe {
	position: absolute;
	z-index: 1;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 100%;
	transform: translate(-50%, -50%);
}

.cubierta {
	position: absolute;
	z-index: 2;
	display: block;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.6);
}

.letrero-azul {
	position: absolute;
	right: 60px;
	bottom: 150px;
	font-size: 3rem;
	color: var(--azul);
}

@media (min-aspect-ratio: 16/9) {
  .video-wrapper2 iframe {
    height: 56.25vw;
  }
}
    
@media (max-aspect-ratio: 16/9) {
  .video-wrapper2 iframe {
    width: 177.78vh;
  }
}

.caja-contenido-lila {
	position: relative;
	margin: 0 10px;
	padding: 0;
	width: calc(100% - 20px);
	background: var(--lila);
}

.txt-margin-left-volado {
	position: relative;
	z-index: 10;
	margin: -120px 0 0 0;
	padding: 20px 0 0 30px;
}

.linea-left {
	position: absolute;
	z-index: 2;
	top: 0;
	left: 0;
	width: 5px;
	height: 225px;
	background: var(--gris1);
}

.txt-margin-left-carrusel {
	position: relative;
    margin: 0 0 0 10px;
    padding: 30px 0 0 30px;
}

.slick-dots li {
    width: 10px !important; 
    height: 10px !important; 
    margin: 0 4px !important; 
}

.slick-dots li button {
	background: #E1E3E3 !important;
	width: 10px !important;
	height: 10px !important;
}

.slick-dots li button:before {
    content: '' !important;
}

.slick-dots li.slick-active button {
	background: var(--gris2) !important;
}

.titulo-verde {
	font-family: var(--poppins-semibold);
	font-size: 3.5rem;
	color: var(--verde2);
	margin: 0;
	padding: 0 60px 20px 60px;
}

.titulo-verde span {
	font-family: var(--poppins-light);
}

.caja-fondo-verde {
	background: var(--verde2);
	color: var(--blanco);
	font-family: var(--poppins-light);
	padding: 30px 60px;
}

.caja-fondo-beige {
	padding: 20px 0 20px 0;
	margin: 0 0 0 15px;
	background: var(--beige);
}

.caja-sin-fondo {
	padding: 20px 0 20px 0;
	margin: 0 0 0 0;}

.caja-centrada {
	width: 75%;
	left: 0;
	right: 0;
	margin: 0 auto;
}

.blog-link {
	display: block;
}

.tarjeta-blog {
	width: 90%;
	left: 0;
	right: 0;
	margin: 0 auto;
}

.tarjeta-flecha {
	font-family: var(--poppins-light);
	font-size: 1rem;
	font-style: italic;
	color: var(--gris2);
}

.tarjeta-enlace {
	position: relative;
	height: 24px;
}

.tarjeta-titulo {
	font-family: var(--poppins-medium);
	font-size: 2.5rem;
	color: var(--gris1);
	margin: 0;
	padding: 0;
}

.tarjeta-descripcion {
	font-family: var(--poppins-light);
	font-size: 1rem;
	color: var(--gris1);
}

.nosotros-top {
    margin: 0 0 0 50px;
}

.titulo-interno {
	font-family: var(--poppins-medium);
	color: var(--blanco);
	font-size: 3rem;
}

.carrusel-nosotros .slick-slide {
	padding: 0 0 30px 0;
}

.tarjeta-valores {
	position: absolute;
    z-index: 1;
    background: var(--lila);
    top: 20px;
    left: 20px;
    width: 100%;
    height: 100%;
}

.titulo-valores {
	font-family: var(--poppins-light);
	color: var(--blanco);
	margin: 0;
	padding: 50px 0 2px 40px;
	width: 50%;
	border-bottom: solid 2px var(--blanco);
}

.descripcion-valores {
	font-family: var(--poppins-light);
	color: var(--blanco);
	text-align: justify;
	padding: 40px;
}

.sustentabilidad-xl {
	background: url('../img/sustentabilidad-xl.jpg') no-repeat center center;
	background-size: cover;
	height: 700px;
}

.caja-verde-volada {
	position: relative;
	background: var(--verde2);
	color: var(--blanco);
	font-family: var(--poppins-light);
	padding: 20px 60px 40px 60px;
	margin: -20px 0 50px 0;
}

.subtitulo-nosotros {
	font-family: var(--poppins-light);
	color: var(--blanco);
	margin: 0;
}

.titulo-interior-caja-verde {
	position: absolute;
	font-family: var(--poppins-semibold);
	color: var(--blanco);
	font-weight: normal;
	font-size: 3.5rem;
	margin: 0;
	padding: 0;
	top: -80px;
}

.titulo-interior-caja-verde span {
	font-family: var(--poppins-light);
}

.contenedor-contacto {
	position: relative;
	background: var(--gris1);
	margin: 0 50px 10px 50px;
	padding: 70px 70px 60px 180px;
}

.disclaimer-contacto {
	position: relative;
	margin: 0 0 0 0;
	padding: 10px 0 0 30px;
}

.subtitulo-contacto {
	font-family: var(--poppins-light);
	font-size: 3rem;
	color: var(--blanco);
	margin: 0px;
	padding: 0px;
}

.linea-contacto {
	position: absolute;
	z-index: 2;
	top: 0;
	left: 0;
	width: 5px;
	height: 180px;
	background: var(--blanco);
}

.txt-contacto {
	font-family: var(--poppins-light);
	font-size: 1rem;
	color: var(--blanco);
}

.linktel,
.linktel:hover,
.linktel:active,
.linktel:focus,
.mapacontacto,
.mapacontacto:hover,
.mapacontacto:active,
.mapacontacto:focus {
	display: block;
	color: var(--blanco);
	text-decoration: none;
}

 {
	color: var();
}

.campo-tabla {
	display: table;
	width: 100%;
}

.campo-celda {
	display: table-cell;
	vertical-align: middle;
	padding: 20px 0;
	border-top: solid 1px var(--gris2);
}

.campo-celda2 {
	position: relative;
	display: table-cell;
	height: 200px;
	vertical-align: top;
	border-top: solid 1px var(--gris2);
	border-bottom: solid 1px var(--gris2);
}

.campo-numero {
	display: inline-block;
	font-family: var(--poppins-semibold);
	color: var(--gris2);
	padding: 0 15px;
}

.campo-input {
	display: inline-block;
	width: 90%;
	height: 40px;
	background: none;
	border: none;
	font-family: var(--poppins-light);
	font-size: 1.3rem;
	color: var(--blanco);
}

.txtsm {
	font-size: 0.9rem !important;
}

.campo-input::placeholder,
.campo-textarea::placeholder {
	color: var(--blanco);
	opacity: 1;
}

.campo-input:focus,
.campo-input:active,
.campo-textarea:focus,
.campo-textarea:active {
	outline: none;
}

.inputerror::placeholder {
	color: var(--warning);
}

.w50 {
	width: 45% !important;
}

.separador-input {
	display: none;
	border-top: solid 1px var(--gris2);
	margin: 20px 0;
}

.campo-textarea {
	display: inline-block;
	width: 90%;
	height: 90%;
	background: none;
	border: none;
	font-family: var(--poppins-light);
	color: var(--blanco);
	padding: 25px 0;
	margin: 0 0 0 60px;
	resize: none;
}

.numero-top {
	position: absolute;
	top: 25px;
	left: 0;
}

.obligatorio {
	display: table;
	height: 80px;
}

.obligatorio span {
	display: table-cell;
	height: 80px;
	vertical-align: middle;
	font-family: var(--poppins-light);
	font-size: 0.9rem;
	color: var(--gris2);
}

.btnenviar {
	float: right;
	display: table;
	height: 80px;
}

.btnenviar:hover i {
	animation-name: ArribaDerecha;
    animation-duration:1.4s;
    animation-delay:0.2s;
    animation-iteration-count:infinite;
    animation-timing-function:linear;
}

.btnenviar span {
	display: table-cell;
	height: 80px;
	vertical-align: middle;
}

.btnletrero {
	padding: 0 2rem;
	font-family: var(--poppins-light);
	font-size: 3rem;
	color: var(--gris2);
}

.btncuadro {
	background: var(--blanco);
	color: var(--gris2);
	width: 80px;
	height: 80px;
}

.btncuadro i {
	display: table-cell;
	width: 80px;
	height: 80px;
	text-align: center;
	vertical-align: middle;
	font-size: 3rem;
}

.lateral-tabla {
	display: table;
	width: 100%;
	height: 100%;
}

.lateral-celda {
	display: table-cell;
	vertical-align: top;
	width: 100%;
	height: 100%;
	font-family: var(--poppins-light);
	font-size: 1.5rem;
	color: var(--blanco);
	padding: 100px 20px 0 20px;
}

.lateral-titulo {
	font-family: var(--poppins-light);
	font-size: 1rem;
	color: var(--gris2);
}

.marca {
	display: table;
	background: var(--gris2);
	width: 45px;
	height: 45px;
}

.marca i {
	display: table-cell;
	width: 45px;
	height: 45px;
	color: var(--blanco);
	text-align: center;
	vertical-align: middle;
}

.linkred {
	display: block;
	color: var(--blanco);
}

.linkred:hover {
	color: var(--blanco);
}

.etiqueta {
	position: absolute;
	left: 0px;
	bottom: 100px;
	background: var(--blanco);
	color: var(--gris1);
	font-family: var(--poppins-light);
	font-size: 2.5rem;
	line-height: 3.5rem;
	padding: 25px 25px 25px 200px;
}

.etiqueta span {
	display: block;
	font-size: 1rem;
	line-height: 1.5rem;
}

.boton2 {
	position: relative;
	float: right;
	display: table;
	background: var(--gris1);
	font-size: 0.9rem;
	color: var(--verde2);
	width: 90px;
	height: 100px;
	transition: all 0.5s ease;
}

.boton2-celda {
	display: table-cell;
	width: 100%;
	height: 100%;
	vertical-align: middle;
	text-align: center;
}

.boton2:hover,
.boton2:active,
.boton2:focus {
	transition: all 0.5s ease;
	background: var(--verde2);
	color: var(--gris2);
}

.caja-contenido-imagen {
	float: right;
	padding: 0 0 2rem 2rem;
	max-width: 700px;
	margin: -50px 0 0 0;
}

.caja-compartir {
	display: table;
	height: 100px;
}

.caja-compartir span {
	display: table-cell;
	width: 100%;
	height: 100%;
	vertical-align: middle;
	background: var(--gris1);
	font-size: 0.8rem;
	color: var(--verde2);
	padding: 0 2.5rem;
}

.botones-compartir {
}

.boton-compartir {
	display: inline-block;
	width: 40px;
	height: 40px;
	color: var(--verde2);
}

.boton-compartir i {
	display: table-cell;
	width: 40px;
	height: 40px;
	text-align: center;
	vertical-align: middle;
	font-size: 1.5rem;
}

.boton-compartir:hover,
.boton-compartir:active,
.boton-compartir:focus {
	color: var(--verde2);
}