﻿:root {
	/* Colores */
	--color-verde: #DFFF3C;
	--color-negro: #1F222A;
	--color-gris: #F2F2F2;
	--color-perry: #357584;
	--color-blanco: #FFFFFF;
	/* Fuentes */
	--fuente-principal: 'Poppins', sans-serif;
	--fuente-secundaria: 'Roboto', sans-serif;
}

html, body {
	font-family: var(--fuente-principal) !important;
	background-color: var(--color-blanco) !important;
}

/*NAV*/
.navLanding {
	background-color: var(--color-verde) !important;
	height: 8vh !important;
	display: flex;
	align-items: center;
	z-index: 10;
}

.navContenedor {
	display: flex;
	flex-wrap: inherit;
	-webkit-box-align: center;
	align-items: center;
	-webkit-box-pack: justify;
	justify-content: space-between;
	width: 100%;
	margin: 30px;
}

.navLogo {
	padding-left: 1% !important;
}

.navTitulo {
	padding-top: 13px !important;
	font-weight: 500 !important;
	color: var(--color-negro) !important;
	font-size: larger;
}

.navBoton {
	background-color: var(--color-negro) !important;
	color: var(--color-blanco) !important;
	font-family: var(--fuente-secundaria) !important;
}

@media (min-width: 992px) {
	.navbar-expand-lg .navbar-collapse {
		/*display: -webkit-box !important;
		display: -ms-flexbox !important;
		display: flex !important;*/
		/*-ms-flex-preferred-size: unset important;*/
		flex-basis: unset !important;
		display: flex !important;
		justify-content: flex-end !important;
		padding-right: 2% !important;
		height: 10vh !important;
	}
}

@media (max-width: 991px) {
	.navContenedor {
		justify-content: flex-start !important;
	}

	.navTitulo {
		margin-left: 10px; /* separa un poco del logo */
	}

	.navbar-toggler {
		margin-left: auto; /* mueve el botón hamburguesa al extremo derecho */
	}
	.navbar-landing {
		height: 10vh !important;
	}
}

/**/

.carousel-item img {
    transition: opacity 2s ease-in-out;
}

.section-hero {
	height: calc(100vh - 8vh); /* ocupa el resto de la pantalla menos el navbar */
	margin-top: 8vh; /* evita que quede tapado por el navbar */
	overflow: hidden;
}

/*.section-hero img {
		height: 100%;
		width: 100%;
		object-fit: cover;*/ /* mantiene proporción y llena el área */
	/*}*/

#heroCarousel,
#heroCarousel .carousel-inner,
#heroCarousel .carousel-item,
#heroCarousel .carousel-item img {
	height: 100%;
	width: 100%;
	object-fit: cover; /* mantiene proporción y llena el área */
}

/*
	enfrente del carrusel
*/

.info {
	z-index: 7;
	top: 0vh;
	height: calc(100vh - 8vh);
	background-color: #00000094;
}
.imgLanding {
	width: 100%;
}
	.info h1 {
		font-size: 2.7rem;
		color: var(--color-blanco) !important;
	}

	.info p {
		width: 60%;
		font-size: 1.07rem;
		color: var(--color-blanco) !important;
	}

	.rowInfo{
		height: 92vh !important;
	}
.infoImgDiv
{
	text-align:center;
}
@media (max-width: 767px) {
	.info h1 {
		font-size: 2rem;
		color: var(--color-blanco) !important;
		margin-left: 20px;
	}

	.info p {
		width: 80%;
		font-size: 1rem;
		color: var(--color-blanco) !important;
		margin-left: 20px;
	}
	.imgLanding {
		width: 50%;
	}

	.store img {
		width: 40% !important;
		height: 50px !important;
	}

	.store {
		text-align: center !important;
	}
	.textoColor {
		font-size: medium !important;
	}
}

/*
	fin enfrente del carrusel
*/

/*SECTION-OPCIONES*/

.section-opciones {
	background-color: var(--color-blanco) !important;
	padding-top: 3% !important;
	padding-left: 3% !important;
	padding-right: 3% !important;
}

.opcDiv {
	background-color: var(--color-gris) !important;
	/*height: 100vh !important;*/
	border-radius: 60px 60px 0% 0% !important;
	padding-top: 3% !important;
	padding-left: 3% !important;
	padding-right: 3% !important;
}

.cuadroOpcion {
	background-color: var(--color-negro) !important;
	padding: 20px;
	box-shadow: 2px 6px 3px 1px #000000fa;
	border-radius: .2em
}

.cuadroImg img{
	width: 100% !important;
	height: 70% !important;
}

.spanUnete{
	font-weight: 600 !important;
}

.textoColor {
	color: var(--color-negro) !important;
}

.textBlanco {
	color: var(--color-blanco) !important;
}

.botonCustom {
	background-color: var(--color-verde) !important;
	font-family: var(--fuente-secundaria) !important;
}
 
.cuadroOpcion img {
	/*width: 80px;*/
	height: 80px;
}

.padtop{
	padding-top: 5% !important;
}

.btnTop {
	background-color: var(--color-verde) !important;
	border-color: var(--color-negro) !important;
}

.lineaVerde {
	background-color: var(--color-verde) !important;
	height: 5px !important;
	border-top: transparent !important;
	opacity: 1 !important;
	margin-top: 5% !important;
	width: 113.6%;
	left: -7%;
	position: relative;
}

.footerVerde {
	background-color: var(--color-verde) !important;
}

.divinfoFooter {
	justify-items: flex-end;
	margin-right: 5%;
	color: var(--color-negro);
}
.store
{
	padding-left: 4%;
}
.store img {
	height: 50px;
}
.infofooter a {
	color: var(--color-negro) !important;
}

.ultimoTexto {
	padding-bottom: 4%;
	margin-top: -3%;
}

/*REGISTRO NEGOCIO*/

/*.imgRegistro {
	width: 50%;
}*/

.imgRegistro {
	width: 10%;
	height: auto;
}

.tituloAfiliar {
	font-weight: 700;
	font-size: 2.5rem;
}

.padlef {
	padding-left: 3%;
}

.textoNegro {
	color: var(--color-negro) !important;
}

.botonCustom {
	background-color: var(--color-verde) !important;
	font-family: var(--fuente-secundaria) !important;
}


/*SweetAlert2*/

.swal2-confirm {
	background-color: var(--color-verde) !important;
	color: var(--color-negro) !important;
	border-radius: 8px;
}

.swal2-icon.swal2-warning {
	border-color: var(--color-verde) !important;
	color: var(--color-verde) !important;
}

.swal2-icon.swal2-success {
	border-color: var(--color-verde) !important;
	color: var(--color-verde) !important;
}

	.swal2-icon.swal2-success .swal2-success-ring {
		border-color: var(--color-verde) !important;
	}

	.swal2-icon.swal2-success [class^=swal2-success-line] {
		background-color: var(--color-verde) !important;
	}

.swal2-icon.swal2-error {
	border-color: var(--color-verde) !important;
	color: var(--color-verde) !important;
}

.swal2-icon.swal2-question {
	border-color: var(--color-verde) !important;
	color: var(--color-verde) !important;
}

div:where(.swal2-container) button:where(.swal2-styled).swal2-confirm:focus {
	box-shadow: var(--color-verde) !important;
}