@charset "utf-8";
/* CSS Document */

@font-face{
    font-family: "Dosis-Regular";
	font-style: normal;
    src: url("../../fonts/Dosis-Regular.ttf");
}

@font-face{
	font-family: "Dosis-SemiBold";
	font-style: normal;
	src: url("../../fonts/Dosis-SemiBold.ttf");
}

html{scroll-behavior: smooth;}
body{font-family: Dosis-Regular;}
.semi-bold{font-family: "Dosis-SemiBold";}

#equipo{scroll-margin-top: 40px;}
#carouselExampleIndicators{scroll-margin-top: 100px;}
#manuales{scroll-margin-top: 70px;}
#contacto{scroll-margin-top: 40px;}

.verde{color: #22B573;}
.gris{color: #808080;}

.fondo-verde-30{background-color: rgba(34, 181, 115, 0.3);}
.fondo-gris{background-color: #F2F2F2;}
.oblicuo{transform: skewY(-5deg);}
.oblicuo .container{transform: skewY(5deg);}

/*Comienzan estilos Navbar*/
.nav-vzcomm{
	--bs-bg-opacity:0.9;
	-webkit-box-shadow: 0px 2px 7px 0px rgba(0,0,0,0.48);
	-moz-box-shadow: 0px 2px 7px 0px rgba(0,0,0,0.48);
	box-shadow: 0px 2px 7px 0px rgba(0,0,0,0.48);
}
.logo-nav{width: 120px; height: auto;}
.nav-vzcomm .nav-link.active{
	font-weight: 700;
	border-bottom: 3px solid #22B573;
}
.nav-vzcomm .nav-link{position: relative;}
.nav-vzcomm .nav-link::before{
	content: "";
	position: absolute;
	width: 90%;
	height: 1px;
	border-radius: 4px;
	background-color: #22B573;
	bottom: -3px;
	left: 5%;
	transform-origin: center;
	transform: scaleX(0);
	transition: transform .3s ease-in-out;
}
.nav-vzcomm .nav-link:hover::before{
	transform-origin: center;
	transform: scaleX(1);
}
.nav-vzcomm .nav-link:hover{color: #22B573!important;}
.dropdown-toggle.drop-vzcomm::after{color: #22B573;}
.btn.btn-lock{
	border: none;
	padding: 3px 6px;
	color: #808080;
	background:linear-gradient(to right, transparent 50%, rgb(34, 181, 115) 50%) no-repeat left / 200%;
    /*transition: background-position 0.3s ease;*/
	transform: scale(1);
	transition: all .3s;
	
}
.btn.btn-lock:hover{
	color: #FFFFFF;
	background-position: right;
	transform: scale(1.2);
	transition: all .3s;
}
.dropdown-item.drop-item-vzcomm:hover{background-color: rgba(34, 181, 115, 0.1);}
/*Terminan estilos Navbar*/

/*Comienza Video Portada*/
.full-screen-video-container{
	position: relative;
	width: 100%;
	/*width: 100vw;*/
	height: 100vh;
	overflow: hidden;
}
.full-screen-video-container video{
	position: absolute;
	width: auto;
	height: auto;
	min-width: 100%;
	min-height: 100%;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: -1;
}
.ima-iso{
	width: 80px;
	height: auto;
	position: absolute;
	top: 100px;
	left: 30px;
}
@media (min-width: 768px) {.ima-iso{width: 144px;}}
/*Termina Video Portada*/

/*Comienza botón Lenguaje*/
.btn-lenguaje{
	position: absolute;
	top: 100px;
	right: 30px;
	color: #000000;
	text-decoration: none;
	border: none;
	-moz-border-radius: 5px 5px 5px 0px;
	-webkit-border-radius: 5px 5px 5px 0px;
	border-radius: 5px 5px 5px 0px;
	background-color: #FFFFFF;
	padding: 0px 5px;
	line-height: auto;
	font-weight: 700;
}
.btn-lenguaje::before{
    content: "";
	position: absolute;
	bottom: -8px;
	left: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 8px 8px 0 0;
    border-color: #FFFFFF transparent transparent transparent;
}
.btn-lenguaje:hover{
	color: #FFFFFF;
	background-color: #22B573;
	transition: all .3s;
}
.btn-lenguaje:hover::before{
	border-color: #22B573 transparent transparent transparent;
	transition: all .3s;
}
/*Termina botón Lenguaje*/

/*Comienza botón Catálogo de Productos*/
.btn-catalogo{
	position: fixed;
	bottom: 40px;
	right: 30px;
	padding: 10px;
	border: none;
	color: #FFFFFF;
	background-color: #22B573;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 25px 25px;
	width: 52px;
	height: 52px;
	transition: all 0.3s;
	-webkit-box-shadow: 0px 0px 0px 5px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 0px 0px 5px rgba(0,0,0,0.5);
	box-shadow: 0px 0px 0px 5px rgba(0,0,0,0.5);
	z-index: 999;
}
.btn-catalogo i{
	font-size: 2rem;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 10px;
	color: #FFFFFF;
}
.btn-catalogo:hover{
	width: 235px;
	transition: all 0.3s;
	color: #FFFFFF;
}

.btn-catalogo::before{
	content: "Catálogo de Productos";
	position: absolute;
	left: 20px;
	top: 50%;
	transform: translateY(-50%);
	letter-spacing: -8px;
	opacity: 0;
	transition: all 0.3s;
}
.btn-catalogo:hover::before{
	content: "Catálogo de Productos";
	letter-spacing: normal;
	opacity: 1;
	transition: all 0.3s;
}
.btn-catalogo:hover i{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 10px;
}

.btn-catalogo.english::before{
	content: "Product Catalog";
	position: absolute;
	left: 20px;
	top: 50%;
	transform: translateY(-50%);
	letter-spacing: -8px;
	opacity: 0;
	transition: all 0.3s;
}
.btn-catalogo.english:hover::before{
	content: "Product Catalog";
	letter-spacing: normal;
	opacity: 1;
	transition: all 0.3s;
}
/*Termina botón Catálogo de Productos*/

.btn.btn-vzcomm{border-radius: 25px; border: none; padding: 5px 30px 5px 30px;}
.btn.btn-vzcomm.btn-verde{
	background: rgb(34,181,115);
	background: linear-gradient(90deg, rgba(34,181,115,1) 0%, rgba(13,119,68,1) 100%);
}

/*Comienza Pleca Noticias*/

/*Termina Pleca Noticias*/

.valores{
	background-image: url("../../imas/fondo-valores.jpg");
	background-size: cover;
}
.icono-valores{width: 110px; height: auto;}
.lista-valores{list-style: none;}

.tapa-transp-azul{position: relative;}
.tapa-transp-azul::after{
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background-color: #323447;
	z-index: -1;
	opacity: 0.9;
}
.fondo-cv-izq, .fondo-cv-der{width: 100%; height: 320px;}
@media (min-width: 768px){.fondo-cv-izq, .fondo-cv-der{width: 100%; height: 255px;}}
.fondo-cv-izq{
	background-image: url("../../imas/fondo-cv-izq.png");
	background-size: cover;
	background-position: top left;
	position: relative;
}
.fondo-cv-der{
	background-image: url("../../imas/fondo-cv-der.png");
	background-size: cover;
	background-position: top right;
	position: relative;
}
.ima-equipo{
	width: 100%;
	height: auto;
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
}
.pt-equipo-der{padding-top: 4rem;}
@media (min-width: 992px){.pt-equipo-der{padding-top: 13rem;}}
.btn-equipo{
	width: auto;
	color: #22B573;
	background-color: transparent;
	border: none;
}
.btn-equipo[aria-expanded="false"]::before{
	content: "Ver más";
	display: inline-block;
}
.btn-equipo[aria-expanded="false"]::after{
	display: inline-block;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
	font: var(--fa-font-solid);
    content: "\2b";
	padding-left: 8px;
}
.btn-equipo[aria-expanded="true"]::before{
	content: "Ver menos";
	display: inline-block;
}
.btn-equipo[aria-expanded="true"]::after{
	display: inline-block;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
	font: var(--fa-font-solid);
    content: "\f068";
	padding-left: 8px;
}

/*Comienzan estilos carrusel Valores Agregados*/
.carousel.carrusel-vzcomm .carousel-inner{position: relative;}
@media (min-width: 768px){.carousel.carrusel-vzcomm .carousel-inner{height: 250px;}}
.carousel.carrusel-vzcomm .carousel-inner img{
	width: 100%;
	height: 250px;
	object-fit: cover;
	object-position: center center;
}
.carousel.carrusel-vzcomm .carousel-inner::after{
	content: "";
	width: 100%;
	height: 100%;
	background-color: rgba(50, 52, 71, 0.9);
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}
.carousel.carrusel-vzcomm .carousel-caption{
	z-index: 10;
	bottom: 50%;
	transform: translateY(50%);
}
/*Terminan estilos carrusel Valores Agregados*/

.modelo-negocio{
	background-image: url("../../imas/fondo-modelo-negocio.jpg");
	background-repeat: no-repeat;
	background-position: bottom right;
	background-size: auto 90%;
	position: relative;
}
.modelo-negocio .contenedor-info{z-index: 10;}
.lista-modelo{list-style: none; margin-left: 50px;}
.lista-modelo li{margin-bottom: 1rem; position: relative;}
@media (min-width: 1200px){.lista-modelo li{margin-bottom: 2rem;}}
.lista-modelo img{
	width: 50px;
	height: auto;
	position: absolute;
	left: -50px;
	top: -12px;
}
.semi-transp{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(255,255,255,0.8);
	z-index: 1;
}

/*Comienzan estilos sección Maximizando la inversión*/
.contenedor-circulo{width: 100%; height: 620px; position: relative;}
.circulo-central-externo{
	border: 3px solid #22B573;
	border-radius: 50%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.circulo-central-interno{
	border: 3px solid #22B573;
	border-radius: 50%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	align-items: center;
	text-align: center;
	padding: 20px;
	-webkit-box-shadow: 0px 0px 0px 20px rgba(0,0,0,0.03);
	-moz-box-shadow: 0px 0px 0px 20px rgba(0,0,0,0.03);
	box-shadow: 0px 0px 0px 20px rgba(0,0,0,0.03);
}
.circulo-central-interno::before{
	content: url("../../imas/sombra-circulo.png");
	position: absolute;
	top: 33px;
	left: 33px;
	opacity: 0.5;
}
.circulo-peque{
	background-color: #d3f0e3;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
@media (max-width: 767px){
	.contenedor-circulo{height: 390px; margin-bottom: 60px;}
	.circulo-central-externo{width: 270px; height: 270px;}
	.circulo-central-interno{width: 160px; height: 160px; padding: 6px;}
	.circulo-central-interno::before{transform: scale(0.53); top: -58px; left: -58px;}
	.circulo-central-interno h3{font-size: 0.8rem;}
	.circulo-central-interno p{font-size: 0.8rem;}
	.circulo-peque{width: 50px; height: 50px;}
	.circulo-peque img{width: 30px; height: auto;}
	.circulo-peque.almacenes{margin: -110px 0px 0px -80px;}
	.circulo-peque.servicio{margin: -110px 0px 0px 80px;}
	.circulo-peque.fidelidad{margin: 45px 0px 0px -120px;}
	.circulo-peque.planeacion{margin: 45px 0px 0px 120px;}
	.circulo-peque.skus{margin: 132px 0px 0px 0px;}
	.circulo-peque span{
		position: absolute;
		width: 80px;
		top: 55px;
		text-align: center;
		background-color: #f2f2f2;
	}
	.circulo-peque span.abajo{width: 250px;}
	.circulo-peque span.izquierdo.interno-resp{left: 5px;}
	.circulo-peque span.derecho.interno-resp{right: 5px;}
	.circulo-peque h4{font-size: 0.7rem;}
}
@media (min-width: 768px){
	.contenedor-circulo{margin-bottom: 100px;}
	.circulo-central-externo{width: 464px; height: 464px;}
	.circulo-central-interno{width: 300px; height: 300px;}
	.circulo-peque{width: 80px; height: 80px;}
	.circulo-peque img{width: 45px; height: auto;}
	.circulo-peque.almacenes{margin: -190px 0px 0px -130px;}
	.circulo-peque.servicio{margin: -190px 0px 0px 130px;}
	.circulo-peque.fidelidad{margin: 70px 0px 0px -215px;}
	.circulo-peque.planeacion{margin: 70px 0px 0px 215px;}
	.circulo-peque.skus{margin: 225px 0px 0px 0px;}
	
	.circulo-peque span{position: absolute; width: 120px;}
	.circulo-peque span.izquierdo{text-align: right; left: -130px;}
	.circulo-peque span.derecho{text-align: left; right: -130px;}
	.circulo-peque span.abajo{text-align: center; top: 85px; width: 500px;}
}
@media (min-width: 768px) and (max-width: 1199px) {
	.circulo-peque span.abajo{width: 380px;}
	.circulo-peque h4{font-size: 1rem;}
}
@media (min-width: 1200px){
	.circulo-peque span{width: 230px;}
	.circulo-peque span.izquierdo{left: -240px;}
	.circulo-peque span.derecho{right: -240px;}
}
/*Terminan estilos sección Maximizando la inversión*/

.btn-manuales{font-size: 1.2rem; border: none; background-color: white; position: relative;}
.btn-manuales:hover{background-color: #f8f9fa;}
.btn-manuales::after{
	display: inline-block;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
	font: var(--fa-font-solid);
    content: "\e094";
	position: absolute;
	right: 2%;
	top: 50%;
	transform: translateY(-50%);
	color: #22b573;
}
.sombra-verde{
	-webkit-box-shadow: 10px 20px 0px 0px rgba(34,181,115,0.3);
	-moz-box-shadow: 10px 20px 0px 0px rgba(34,181,115,0.3);
	box-shadow: 10px 20px 0px 0px rgba(34,181,115,0.3);
}
.flecha-footer{
	position: relative;
	animation-name: UpDown;
	animation-duration: 2s;
	animation-iteration-count: infinite;
	opacity: 0.6;
}
@keyframes UpDown {
  0%   {bottom:0px;}
  50%  {bottom:5px;}
  100% {bottom:0px;}
}
.flecha-footer:hover{opacity: 1;}

/*Comienzan estilos carrusel Modelo de Negocio*/
.fondo-degradado-carrusel{
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 400px;
	background: rgba(0,0,0,0);
	background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 31%, rgba(0,0,0,0.5) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0,0,0,0)), color-stop(31%, rgba(0,0,0,0)), color-stop(100%, rgba(0,0,0,0.5)));
	background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 31%, rgba(0,0,0,0.5) 100%);
	background: -o-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 31%, rgba(0,0,0,0.5) 100%);
	background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 31%, rgba(0,0,0,0.5) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 31%, rgba(0,0,0,0.5) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0 );
}
@media (max-width: 767px){
	.carousel.carrusel-modelo-negocio .carousel-item img{
		height: 200px;
		object-fit: cover;
	}
}
/*Terminan estilos carrusel Modelo de Negocio*/

.voltear-horizontal{
    -moz-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
}