/* TEXTURA */
.texturaAltoAlcance{
	width: 								50%;
	aspect-ratio:						1;
	object-fit: 						contain;
	object-position: 					left center;
	position: 							absolute;
	top: 								0;
	left: 								0;
	z-index: 							-1;
}

/* BANNER */
.banner{
	margin-top: 						125px;
	margin-bottom: 						110px;
	padding: 							45px 0 325px;
	position: 							relative;
}

.banner .imageBanner{
	max-width: 							55%;
	height: 							100%;
	object-fit: 						cover;
	object-position: 					center center;
	position: 							absolute;
	top: 								0;
	left: 								0;
}

.banner .subtitle{
	text-transform: 					uppercase;
	opacity: 							0.6;
	margin-bottom: 						10px;
}

.banner .title{
	text-transform: 					uppercase;
	margin-bottom: 						20px;
}

.banner .subdescription{
	color: 								rgba(20, 19, 62, 0.60);
	font-size: 							14px;
	font-family: 						"Noto Sans", sans-serif;
	opacity: 							0.8;
}

.banner .description{
	font-family: 						"Noto Sans", sans-serif;
	opacity: 							0.8;
}

/* KIOSCOS AUTONOMOS */
.kiosco{
	margin-bottom: 						210px;
	position: 							relative;
}

.kiosco .title{
	text-transform: 					uppercase;
	margin-bottom: 						15px;
}

.kiosco .description{
	font-family: 						"Noto Sans", sans-serif;
	color: 								rgba(20, 19, 62, 0.8);
	margin-bottom: 						40px;
}

.kiosco .slickKioscos{
	padding-right: 						50px;
}

.kiosco .slickKioscos .slick-prev{
	position: 							absolute;
	top: 								0;
	bottom: 							0;
	left: 								-105%;
	right: 								0;
	margin:  							auto;
}

.kiosco .slickKioscos .slick-next{
	position: 							absolute;
	top: 								0;
	bottom: 							0;
	left: 								0;
	right: 								-95%;
	margin:  							auto;
}

.kiosco .slickKioscos .slick-track{
	display: 							flex;
	height: 							auto;
}

.kiosco .infoContainer{
	padding: 							60px 30px;
	border-radius: 						10px;
	background: 						linear-gradient(0deg, rgba(102, 142, 246, 0.10) 0%, rgba(102, 142, 246, 0.10) 100%), #FFF;
	margin: 							0 7.5px;
	text-align: 						center;
	display: 							flex;
	flex-flow: 							column nowrap;
	height: 							auto;
}

.kiosco .infoContainer > img{
	height: 							80px;
	object-fit: 						contain;
	object-position: 					center center;
	margin: 							0 auto 15px;
}

.kiosco .infoContainer > span{
	font-family: 						"Noto Sans", sans-serif;
	color: 								rgba(20, 19, 62, 0.8);
}

.kiosco .imageKiosco{
	height: 							110%;
	object-fit: 						cover;
	object-position: 					center center;
	position: 							absolute;
	right: 								0;
	bottom: 							-40%;
	z-index: 							-1;
}

/* SOFTWARE */
.software .title{
	font-weight: 						700;
	text-transform: 					uppercase;
	margin-bottom:						30px;
	text-align: 						center;
}

.software .tabsContainer{
	display: 							flex;
	flex-flow: 							row nowrap;
}

.software nav{
	flex: 								0 0 25%;
}

.software nav .nav{
	display: 							flex;
	flex-flow:  						column nowrap;
	gap: 								15px;
}

.software nav .nav .btnTabs{
	padding: 							15px 30px;
	border: 							unset;
	border-radius: 						10px;
	background: 						#FFFFFF;
	box-shadow: 						5px 4px 50px 0px rgba(91, 119, 220, 0.10);
	margin-right: 						10px;
	display: 							flex;
	flex-flow: 							row nowrap;
	align-items: 						center;
	color: 								#000000;
	text-transform: 					uppercase;
	transition: 						all 0.3s ease-in-out;
}

.software nav .nav .btnTabs.active{
	border-radius: 						10px 0px 0px 10px;
	background-color: 					#3752A6;
	margin-right: 						0;
	color: 								#FFFFFF;
}

.software nav .nav .btnTabs .imageTab{
	height: 							40px;
	object-fit: 						contain;
	object-position: 					center center;
	transition: 						all 0.3s ease-in-out;
	margin-right: 						15px;
}

.software nav .nav .btnTabs .imageTabActive{
	height: 							0;
	object-fit: 						contain;
	object-position: 					center center;
	opacity: 							0;
	visibility: 						hidden;
	transition: 						all 0.3s ease-in-out;
}

.software nav .nav .btnTabs.active .imageTab{
	height: 							0px;
	opacity: 							0;
	visibility: 						hidden;
	margin-right: 						0;
}

.software nav .nav .btnTabs.active .imageTabActive{
	height: 							40px;
	opacity: 							1;
	visibility: 						visible;
	margin-right: 						15px;
}

.software .tab-content{
	flex: 								0 0 75%;
	border-radius: 						10px;
	background: 						#FFFFFF;
	box-shadow: 						5px 4px 50px 0px rgba(91, 119, 220, 0.10);
	padding: 							70px 45px 95px 90px;
}

.software .tab-content .titleTab{
	color:								rgba(20, 19, 62, 0.50);
	font-family: 						"Noto Sans", sans-serif;
	margin-bottom: 						10px;
}

.software .tab-content .descriptionTab{
	color: 								rgba(20, 19, 62, 0.80);
	font-family: 						"Noto Sans", sans-serif;
	font-weight:						700;
	margin-bottom: 						30px;
}

.software .tab-content .softwareOptions{
	display: 							flex;
	flex-flow: 							row wrap;
	gap: 								20px;
}

.software .tab-content .softwareOptions .optionInformation{
	flex: 								0 0 calc(100% / 3 - (20px * 2 / 3 ));
	border-radius: 						10px;
	background: 						rgba(102, 142, 246, 0.10);
	padding: 							35px 20px;
	text-align: 						center;
}

.software .tab-content .softwareOptions .optionInformation > img{
	height: 							50px;
	object-fit: 						contain;
	object-position: 					center center;
	margin-bottom: 						10px;
}
.software .tab-content .softwareOptions .optionInformation > span{
	color: 								rgba(20, 19, 62, 0.80);
	font-family: 						"Noto Sans", sans-serif;
	font-size: 							14px;
}

/* BANNER 2 */
.banner2{
	padding: 							335px 0 200px;
	position: 							relative;
}

.banner2 .texturaBanner2{
	height: 							100%;
	object-fit: 						contain;
	object-position: 					left center;
	position: 							absolute;
	left: 								0;
	bottom: 							0;
	opacity: 							0.1;
}

.banner2 .subtitle{
	text-transform: 					uppercase;
	opacity: 							0.6;
	margin-bottom: 						10px;
}

.banner2 .title{
	text-transform: 					uppercase;
	margin-bottom: 						20px;
}

.banner2 .description{
	font-family: 						"Noto Sans", sans-serif;
	opacity: 							0.8;
}

.banner2 .imageBanner2{
	width: 								50%;
	object-fit: 						contain;
	object-position: 					right center;
	position: 							absolute;
	bottom: 							200px;
	right: 								0;
	z-index: 							-1;
}

/* CONVERSIONES */
.conversiones{
	padding-bottom: 					45px;
	margin-bottom: 						100px;
}

.conversiones .informationContainer{
	padding-left: 						15%;
	display: 							flex;
	gap: 								70px;
	align-items: 						center;
	margin: 							0;
}

.conversiones .titles{
	flex: 								0 0 25%;
}

.conversiones .titles .title{
	text-transform: 					uppercase;
	margin-bottom: 						10px;
}

.conversiones .titles .description{
	font-family: 						"Noto Sans", sans-serif;
	opacity: 							0.8;
}

.conversiones .information{
	width: 								calc(75% - 70px);
}

.conversiones .information .slick-list{
	padding: 							30px 0 30px 30px;
}

.conversiones .information .slick-prev, .conversiones .information .slick-next{
	position: 							absolute;
	bottom: 							-30px;
	left: 								0;
	right: 								-50%;
	margin: 							0 auto;
}

.conversiones .information .slick-next{
	right: 								-60%;
}

.conversiones .information .slick-track{
	display: 							flex;
	height: 							auto;
}

.conversiones .information .conversionesInfo{
	margin: 							0 7.5px;
	border-radius: 						10px;
	background: 						#FFFFFF;
	box-shadow: 						5px 4px 50px 0px rgba(91, 119, 220, 0.10);
	padding: 							65px 25px;
	text-align: 						center;
	display: 							flex;
	flex-flow: 							column nowrap;
	height: 							auto;
}

.conversiones .information .conversionesInfo > img{
	height: 							70px;
	object-fit: 						contain;
	object-position:  					center center;
	margin: 							0 auto 15px;
}

.conversiones .information .conversionesInfo > span{
	font-family: 						"Noto Sans", sans-serif;
	font-size: 							14px;
}

/* VAGON */
.vagon{
	padding-bottom: 					45px;
	margin-bottom: 						100px;
}


.vagon .title{
	text-transform: 					uppercase;
	margin-bottom: 						15px;
	text-align: 						center;
}

.vagon .description{
	font-family: 						"Noto Sans", sans-serif;
	opacity: 							0.8;
	margin-bottom: 						40px;
	text-align: 						center;
}

.vagon .slick-prev, .vagon .slick-next{
	position: 							absolute;
	top: 								0;
	bottom: 							0;
	left: 								0;
	right: 								0;
	margin: 							auto;
}

.vagon .slick-prev{
	left: 								-105%;
}

.vagon .slick-next{
	right: 								-105%;
}

.vagon .slick-track{
	display: 							flex;
	height: 							auto;
}

.vagon .vagonInfo{
	margin: 							0 7.5px;
	border-radius: 						10px;
	background: 						linear-gradient(0deg, rgba(102, 142, 246, 0.10) 0%, rgba(102, 142, 246, 0.10) 100%), #FFF;
	padding: 							80px 35px;
	text-align: 						center;
	display: 							flex;
	flex-flow: 							column nowrap;
	height: 							auto;
}

.vagon .vagonInfo > img{
	height: 							80px;
	object-fit: 						contain;
	object-position:  					center center;
	margin: 							0 auto 15px;
}

.vagon .vagonInfo > span{
	font-family: 						"Noto Sans", sans-serif;
	font-size: 							14px;
}

@media (max-width: 992px){
	/* TEXTURA */
	.texturaAltoAlcance{
		width: 								100%;
		height: 							auto;
		top: 								90px;
		object-fit: 						cover;
		object-position: left top;
	}

	/* BANNER */
	.banner{
		margin-top: 						0;
		margin-bottom: 						100px;
		padding: 							0;
	}

	.banner .imageBanner{
		max-width: 							100%;
		height: 							auto;
		position: 							static;
		margin-bottom: 						50px;
	}

	.banner .subtitle{
		font-size: 							12px;
	}

	.banner .title{
		font-size: 							32px;
	}

	.banner .subdescription{
		font-size: 							12px;
	}

	.banner .description{
		font-size: 							14px;
	}

	/* KIOSCOS AUTONOMOS */
	.kiosco{
		margin-bottom: 						130px;
	}

	.kiosco .title{
		font-size: 							23px;
		margin-bottom: 						10px;
	}

	.kiosco .description{
		font-size: 							14px;
		margin-bottom: 						30px;
	}

	.kiosco .slickKioscos{
		padding-right: 						0;
	}

	.kiosco .slick-list{
		padding: 							0 5%;
	}

	.kiosco .infoContainer{
		padding: 							55px 40px;
		margin: 							0 5px;
	}

	.kiosco .infoContainer > img{
		height: 							60px;
	}

	.kiosco .infoContainer > span{
		font-size: 							14px;
	}

	.kiosco .imageKiosco{
		width: 								100%;
		height: 							auto;
		position: 							static;
		margin-top: 30px;
	}

	/* SOFTWARE */
	.software .title{
		font-size: 							23px;
		margin-bottom: 						0;
	}

	.software .tabsContainer{
		flex-flow: 							column nowrap;
	}

	.software nav{
		width: 								100%;
	}

	.software nav .nav{
		flex-flow:  						row nowrap;
		gap: 								10px;
		overflow-x: 						auto;
		padding: 							30px 0;
	}

	.software nav .nav .btnTabs{
		flex: 								0 0 190px;
		padding: 							15px;
		border-radius: 						10px;
		margin-right: 						0;
		font-size: 							14px;
		text-align: 						start;
	}

	.software nav .nav .btnTabs.active{
		border-radius: 						10px;
	}

	.software nav .nav .btnTabs .imageTab{
		height: 							25px;
	}

	.software nav .nav .btnTabs.active .imageTabActive{
		height: 							25px;
	}

	.software .tab-content{
		width: 								100%;
		border-radius: 						0;
		box-shadow: 						unset;
		padding: 							0;
	}

	.software .tab-content .titleTab{
		width: 								83.33%;
		margin: 							0 auto 10px;
		font-size: 							16px;
	}

	.software .tab-content .descriptionTab{
		width: 								83.33%;
		margin: 							0 auto 20px;
		font-size: 							14px;
	}

	.software .tab-content .softwareOptions{
		gap: 								5px;
	}

	.software .tab-content .softwareOptions .optionInformation{
		flex: 								0 0 calc(100% / 2 - (5px * 1 / 2 ));
		padding: 							28px 15px;
	}

	/* BANNER 2 */
	.banner2{
		padding: 							0 0 35px;
		margin-bottom: 						65px;
	}

	.banner2 .texturaBanner2{
		width: 								100%;
		height: 							100%;
		object-fit: 						cover;
		object-position: 					center bottom;
		position: 							absolute;
		left: 								unset;
		right: 								0;
		bottom: 							0;
		opacity: 							0.1;
	}

	.banner2 .subtitle{
		font-size: 							12px;
	}

	.banner2 .title{
		font-size: 							32px;
	}

	.banner2 .description{
		font-size: 							14px;
	}

	.banner2 .imageBanner2{
		width: 								100%;
		height: 							auto;
		object-fit: 						cover;
		object-position: 					center center;
		position: 							static;
		z-index: 							-1;
	}

	/* CONVERSIONES */
	.conversiones{
		padding-bottom: 					0;
	}

	.conversiones .informationContainer{
		padding: 							0 8.33%;
		flex-flow: 							column nowrap;
		gap: 								30px;
	}

	.conversiones .titles{
		width: 								100%;
	}

	.conversiones .titles .title{
		font-size: 							23px;
	}

	.conversiones .titles .description{
		font-size: 							14px;
	}

	.conversiones .information{
		width: 								100%;
	}

	.conversiones .information .conversionesInfo{
		margin: 							0 0 10px;
		padding: 							45px 25px;
		display: 							flex;
		flex-flow: 							row nowrap;
		align-items: 						center;
		gap: 								30px;
	}

	.conversiones .information .conversionesInfo > img{
		margin: 							0;
	}

	/* VAGON */
	.vagon{
		padding-bottom: 					45px;
		margin-bottom: 						100px;
	}


	.vagon .title{
		text-transform: 					uppercase;
		margin-bottom: 						15px;
		text-align: 						center;
	}

	.vagon .description{
		font-family: 						"Noto Sans", sans-serif;
		opacity: 							0.8;
		margin-bottom: 						40px;
		text-align: 						center;
	}

	.vagon .slick-prev, .vagon .slick-next{
		position: 							absolute;
		top: 								0;
		bottom: 							0;
		left: 								0;
		right: 								0;
		margin: 							auto;
	}

	.vagon .slick-prev{
		left: 								-105%;
	}

	.vagon .slick-next{
		right: 								-105%;
	}

	.vagon .vagonInfo{
		margin: 							0 7.5px;
		border-radius: 						10px;
		background: 						linear-gradient(0deg, rgba(102, 142, 246, 0.10) 0%, rgba(102, 142, 246, 0.10) 100%), #FFF;
		padding: 							80px 35px;
		text-align: 						center;
	}

	.vagon .vagonInfo > img{
		height: 							80px;
		object-fit: 						contain;
		object-position:  					center center;
		margin: 							0 auto 15px;
	}

	.vagon .vagonInfo > span{
		font-family: 						"Noto Sans", sans-serif;
		font-size: 							14px;
	}
}