/* 
.landing-suministros .hero-wrapper::after{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 42%;
	height: 100%;
	-webkit-backdrop-filter: blur(5px);
	backdrop-filter: blur(5px);
}

.landing-suministros .hero-wrapper::before{
	content: '';
	position: absolute;
	top: 0;
	left: 42%;
	width: 1px;
	height: 100%;
	background: rgb(255, 255, 255);
	background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);
} */

.bg-color-gray {
	background-color: #FBFBFB;
}
html {
	scroll-padding-top: 120px;
}


.landing-suministros section .link-bgtransparent-black:hover,
.landing-suministros section.s-bgcolor .link-bgtransparent:hover,
.link-bgtransparent:hover {
	background-color: var(--color-fuxia);
	color: var(--color-white);
	border: 1px solid var(--color-fuxia);
}

.landing-suministros .hero-wrapper .link-bgtransparent {
	background-color: var(--color-fuxia);
	color: var(--color-white);
	border: 1px solid var(--color-fuxia);
}

.landing-suministros .hero-wrapper .link-bgtransparent:hover {
	color: var(--color-black);
	background-color: var(--color-white);
	border: 1px solid var(--color-white);
}

.landing.landing-suministros .text-back-line span {
	height: 46px;
}





.animate__delay_0_25 {
	animation-delay: .25s;
}

.animate__delay_0_5 {
	animation-delay: .5s;
}

.animate__delay_0_75 {
	animation-delay: .75s;
}

.animate__delay_1s {
	animation-delay: 1s;
}

.landing-suministros {
	background-color: var(--color-white);
}

.landing-suministros .hero-wrapper {
	background-image: url('/images/landing/suministros/hero.jpg');
	display: flex;
	justify-content: center;
	padding: 0;
	margin-top: 0;
	width: 100%;
}

.landing section {
	/* margin-top: 133px; */
	margin-top: 56px;
}

.landing .s-first-block {
	/* margin-top: 133px; */
	margin-top: 100px;
	margin-bottom: 100px;
}

.landing.landing-suministros .s-cerramientos{
	margin-bottom: 130px;
}
.landing.landing-suministros .s-vallas{
	margin-bottom: 100px;
}

.landing.landing-suministros .s-logos {
	margin-top: 133px;
	margin-bottom: 133px;
}

.landing .animate__animated {
	opacity: 0;
}

.landing-suministros section.s-bgcolor {
	background-color: var(--color-bgsection);
	/* padding: 133px 0; */
	padding: 56px 0;
}

.landing-suministros section .link-bgtransparent-black,
.landing-suministros section.s-bgcolor .link-bgtransparent {
	color: var(--color-text);
	border-color: var(--color-text-gray);
	margin-top: 30px;
	display: inline-block;
}

.landing-suministros h3 {
	color: #22232B;
	font-family: var(--font-general);
	font-size: 32px;
	font-style: normal;
	font-weight: 500;
	line-height: 40px;
	/* 125% */
}

.landing-suministros .card .card-body {
	transition: .3s all;
	height: 100px;
	overflow: hidden;
}

.landing-suministros.landing .card:hover .iconHover {
	display: none;
}

.landing-suministros .card:hover .card-body {
	opacity: 1;
	height: max-content;
	overflow: visible;
}

.landing-suministros .card:hover .card-body {
	background-color: #E2E2E2;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 375px;
	margin-top: -275px;
	border-radius: 24px;
}

.landing-suministros .s-rotulacion .card .card-body div {
	opacity: 0;
	transition: .3s all;
}

.landing-suministros .s-rotulacion .card:hover .card-body div {
	opacity: 1;
}


.landing-suministros .s-rotulacion .card:hover .card-body {
	height: 480px;
	margin-top: -380px;
}

.landing-suministros .card .card-body>div {
	text-align: center;
}

.landing-suministros .card .card-body>div ul {
	list-style: none;
}

.landing-suministros .card .card-body>div li {
	color: #22232B;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 24px;
	/* 150% */
	margin-bottom: 1rem;
}

.landing-suministros .card .card-body>div p {
	text-align: center;
	font-size: 18px;
	font-style: normal;
	font-weight: 500;
	line-height: 20px;
	padding: 16px 35px;
	background-color: transparent;
	border-radius: 50px;
	text-decoration: none;
	border: 1px solid var(--color-line-gray);
	display: inline-block;
}

.landing-suministros .text-pink {
	font-weight: 500;
}

.landing-suministros .img-borderradius {
	border-radius: 24px;
}

.landing-suministros .img-boxshadow {
	box-shadow: 0px 330px 93px 0px rgba(0, 0, 0, 0.00), 0px 211px 85px 0px rgba(0, 0, 0, 0.01), 0px 119px 71px 0px rgba(0, 0, 0, 0.05), 0px 53px 53px 0px rgba(0, 0, 0, 0.09), 0px 13px 29px 0px rgba(0, 0, 0, 0.10);
}

.landing .card-text small {
	font-size: 18px;
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: 28px;
	/* 155.556% */
	display: block;
}

.landing-suministros .marqueeLogos>div {
	animation: marquee-suministros 35s linear infinite;
}

@keyframes marquee-suministros {
	0% {
		transform: translateX(0);
	}

	100% {
		transform: translateX(-155%);
	}
}

.landing-suministros .marqueeLogos::before {
	background: linear-gradient(90deg, var(--color-white) 32.69%, rgba(255, 255, 255, 0.00) 127.69%);
}

.landing-suministros .marqueeLogos::after {
	background: linear-gradient(270deg, var(--color-white) 0%, rgba(255, 255, 255, 0.00) 100%);
}

@keyframes rolluptext {
	0%, 12.66%, 100% {
		transform: translate3d(0, 0, 0);
	}

	16.66%, 29.32% {
		transform: translate3d(0, -25%, 0);
	}

	33.32%, 45.98% {
		transform: translate3d(0, -50%, 0);
	}

	49.98%, 62.64% {
		transform: translate3d(0, -75%, 0);
	}

	66.64%, 79.3% {
		transform: translate3d(0, -50%, 0);
	}

	83.3%, 95.96% {
		transform: translate3d(0, -25%, 0);
	}
}
@-webkit-keyframes slideInUp {
	0% {
		-webkit-transform: translate3d(0,100%,0);
		transform: translate3d(0,100%,0);
		visibility: visible
	}

	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}

@keyframes slideInUp {
	0% {
		-webkit-transform: translate3d(0,100%,0);
		transform: translate3d(0,100%,0);
		visibility: visible
	}

	to {
		-webkit-transform: translateZ(0);
		transform: translateZ(0)
	}
}
.animate__slideInUp {
	-webkit-animation-name: slideInUp;
	animation-name: slideInUp
}
.landing-suministros {
	font-family: Poppins;
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: 20px;
	width: 100vw;
	overflow-x: hidden;
	header {
		width: 100vw;
		position: fixed;
		top:0;
		left:0;
    	padding-top: 2rem;
    	padding-bottom: 2rem;
		height: auto;
		transition: all 300ms linear;
		.header-left {
			position: relative;
			.header-logo {
				position: absolute;
				left: 12px;
				top:50%;
				transform: translateY(-50%);
				&.white {
					opacity: 1;
				}
				&.blue {
					opacity: 0;
				}
			}
		}
		.header-right {
			display: flex;
			gap:16px;
			a {
				height: 43px;
				display: inline-flex;
				align-items: center;
                justify-content: center;
                gap: 8px;
				border-radius: 5px;
				padding: 8px 32px;
				background-color: var(--color-fuxia);
				color: white;
				text-decoration: none;
				font-family: Poppins;
				font-size: 16px;
				font-style: normal;
				font-weight: 500;
				line-height: 20px;
				transition: all 300ms linear;
				&:hover {
					transition: all 300ms linear;
					background-color: var(--color-white);
					color: var(--color-black);
					box-shadow: 0px 4px 9.3px 0px rgba(0, 0, 0, 0.25);
					img {
						filter: invert();
					}
				}
				&.contact-us {
					border-radius: 5px;
					border: 1px solid #FFF;
					background: rgba(255, 255, 255, 0.58);
					color: var(--color-text);
					&:hover {
						border: 1px solid transparent;
						box-shadow: 0px 4px 9.3px 0px rgba(0, 0, 0, 0.25);
						color: var(--color-black);
					}
				}
			}
		}
		&.scrolled {
			transition: all 300ms linear;
			background: rgba(255, 255, 255, 0.58);
			box-shadow: 0 -8px 21.6px 17px rgba(0, 0, 0, 0.04);
			.header-left {
				.header-logo {
					&.white {
						opacity: 0;
					}
					&.blue {
						opacity: 1;
					}
				}
			}
			.header-right {
				a {
					&.contact-us {
						border-radius: 5px;
						border: 1px solid #0748EF;
						/* background: rgba(255, 255, 255, 0.58); */
						background: rgba(255, 255, 255, 1);
						color: #0748EF;
						&:hover {
							border: 1px solid transparent;
							box-shadow: 0px 4px 9.3px 0px rgba(0, 0, 0, 0.25);
							color: var(--color-black);
						}
					}
				}
			}
		}
	}
	.hero-wrapper {
		background-image: url(/images/landing-suministros/hero_image.jpg);
		&::before,
		&::after {
			content: none;
		}
		.text-hero-wrapper {
			animation-delay: 0s;
			max-width: 650px;
			margin-left: auto;
			margin-right: auto;
			text-align: center;
			.title {
				font-size: 58px;
				font-style: normal;
				font-weight: 600;
				line-height: 70px;
				margin-bottom: 16px;
			}
			p {
				font-size: 24px;
				font-style: normal;
				font-weight: 400;
				line-height: 35px;
				margin-bottom: 32px;
			}
			a {
				font-size: 18px;
				font-style: normal;
				font-weight: 500;
				line-height: 20px;
				display: inline-block;
			}
		}
	}
	.s-oohadvisor {
		margin-top: 0;
		padding-top: 88px;
		padding-bottom: 120px;
		.container {
			max-width: 700px;
		}
		h2 {
			font-size: 32px;
			font-style: normal;
			font-weight: 500;
			line-height: 38px;
			margin-bottom: 56px;
		}
		p {
			color: #63636B;
		}
	}
	.s-experiencia {
		padding-top: 120px;
		padding-bottom: 120px;
		background: #FBFBFB;
		h2 {
			text-align: center;
			max-width: 725px;
			margin-left: auto;
			margin-right: auto;
			font-size: 42px;
			font-style: normal;
			font-weight: 500;
			line-height: 58px;
			margin-bottom: 60px;
			span {
				display: block;
				overflow: hidden;
				height: 58px;
				ul {
					display: block;
					background: transparent;
					margin: 0;
					padding: 0;
					list-style: none;
					-webkit-animation-name: rolluptext;
					-webkit-animation-duration: 10s;
					-webkit-animation-iteration-count: infinite;
					animation-name: rolluptext;
					animation-duration: 10s;
					animation-iteration-count: infinite;
					li {
						font-style: italic;
						height: 58px;
						margin: 0;
					}
				}
			}
			em {
				font-style: italic;
				display: block;
			}
		}
		ul {
			list-style: none;
			padding: 55px;
			background-color: white;
			border-radius: 20px;
			margin: 0;
			display: flex;
			gap: 36px;
			flex-wrap: wrap;
			justify-content: center;
			align-content: center;
			align-items: center;
			li {
				padding: 0;
				margin: 0;
				img {
					height: 64px;
					width: auto;
				}
			}
		}
	}
	.s-manosalaobra {
		margin-top: 0;
		padding-top: 64px;
		padding-bottom: 64px;
		.container {
			max-width: 1080px;
			h2 {
				font-size: 42px;
				font-style: normal;
				font-weight: 500;
				line-height: 40px;
				margin-bottom: 64px;
				text-align: center;
			}
			.carousel {
				.carousel-inner {
					.carousel-item {
						.text {
							padding-bottom: 42px;
							background-color: white;
							position: relative;
							/* padding-right: 140px; */
							display: flex;
							flex-direction: column;
                            justify-content: space-between;
							.top {
								max-width: 390px;
								.mobile-image {
									display: none;
								}
							}
							p {
								margin-bottom: 0px;
							}
							button {
								border: none;
								background-color: transparent;
							}
							.paso {
								display: flex;
								align-items: center;
								gap:12px;
								font-size: 16px;
								font-style: normal;
								font-weight: 300;
								line-height: 0;
								strong {
									font-size: 48px;
									font-style: normal;
									font-weight: 300;
									line-height: 40px;
									border-left:  solid 1px black;
									padding-left: 12px;
								}
							}
							.intro {
								color: var(--color-fuxia);
								font-size: 18px;
								font-style: normal;
								font-weight: 500;
								line-height: 28px;
								text-transform: uppercase;
							}
							.title {
								font-size: 32px;
								font-style: normal;
								font-weight: 500;
								line-height: 40px;
							}
							.desc {
								font-size: 16px;
								font-style: normal;
								font-weight: 400;
								line-height: 24px;
							}
							.contactbutton {
								font-size: 18px;
								font-style: normal;
								font-weight: 500;
								line-height: 20px;
								display: inline-flex;
								border: 1px solid #1B1B1F;
								height: 56px;
								padding: 8px 16px;
								border-radius: 200px;
								align-items: center;
                                text-decoration: none;
								&:hover {
									color: white;
									background-color: var(--color-fuxia);
									border-color: var(--color-fuxia);
								}
							}
						}
						.image {
							padding-bottom: 42px;
							img {
								border-radius: 30px;
								max-height: 664px;
								object-fit: cover;
								box-shadow: 0px 38px 11.8px -5px rgba(0, 0, 0, 0.07);
							}
						}
					}
				}
			}
			.contactbutton-mobile {
				display: none;
			}
		}
	}
	.s-exitos {
		margin-top: 0;
		padding-top: 88px;
		padding-bottom: 168px;
		.container {
			max-width: 1080px;
			.carousel-exitos {
				position: relative;
				.slick-list {
					overflow: visible;
					.item {
						.row {
							margin:0;
						}
						/* transform: scale(1.1);
						position: relative;
						z-index: 1; */
						&:not(.slick-active) {
							opacity: 0.3;
							transform: scale(0.9);
						}
					}
				}
				.slick-arrow {
					left: unset;
					top: unset;
					bottom: -110px;
					transform: none;
				}
				.slick-prev {
					right: 80px;
					background-image: url(/images/landing-suministros/arrow-left.svg);
				}
				.slick-next {
					right: 0px;
					background-image: url(/images/landing-suministros/arrow-right.svg);
				}
			}
		}
		h2 {
			text-align: center;
			font-family: Poppins;
			font-size: 42px;
			font-style: normal;
			font-weight: 500;
			line-height: 48px;
			margin-bottom: 64px;
		}
		.image {
			img {
				border-radius: 30px;
				overflow: hidden;
				box-shadow: 0px 38px 11.8px 1px rgba(0, 0, 0, 0.07);
				aspect-ratio: 74 / 48;
				object-fit: cover;
			}
		}
		.text {
			border-radius: 30px;
			overflow: hidden;
			background-color: white;
			padding-left: 30px;
			box-shadow: 0px 38px 11.8px 1px rgba(0, 0, 0, 0.07);
			display: flex;
            flex-direction: column;
            justify-content: center;
			.intro {
				font-size: 18px;
				font-style: normal;
				font-weight: 500;
				line-height: 28px;
				margin-bottom: 8px;
				color: var(--color-fuxia);
			}
			.title {
				font-size: 32px;
				font-style: normal;
				font-weight: 500;
				line-height: 40px;
				margin-bottom: 50px;
			}
			ul {
				margin:0;
				li {
					font-size: 16px;
					font-style: normal;
					font-weight: 400;
					line-height: 24px;
				}
			}
		}
	}
}


.hide_anim_effect {
	overflow: hidden;
	margin-bottom:24px;
}




/* // `xxl` applies to x-large devices (large desktops, less than 1400px) */
@media (max-width: 1399.98px) {}

/* // `xl` applies to large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {}

/* // `lg` applies to medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {
	.hide_anim_effect {
		overflow: hidden;
		margin-bottom:12px;
	}
	.slick-arrow.slick-prev, 
	.slick-arrow.slick-next {
        display: inline-block !important;
    }
	.landing-suministros {
		header {
			padding-top: 24px;
			padding-bottom: 24px;
			.header-right {
				a {
					font-size: 0;
					padding:5px;
					aspect-ratio: 1;
					span {
						display: none;
					}
					&.contact-us {
						display: none;
					}
				}
			}
		}
		.hero-wrapper {
			background-image: url(/images/landing-suministros/hero_image_mobile.jpg);
			&::before,
			&::after {
				content: none;
			}
			.text-hero-wrapper {
				padding-left: 12px;
				padding-right: 12px;
				.title {
					text-align: center;
					font-size: 38px;
					font-style: normal;
					font-weight: 600;
					line-height: 40px;
					padding: 0 12px;
				}
				p {
					font-size: 16px;
					font-style: normal;
					font-weight: 400;
					line-height: 20px;
					margin-bottom: 40px;
				}
				a {
					padding:15px 24px;
				}
			}
			
		}
		.s-oohadvisor {
			padding-top: 32px;
			padding-bottom: 32px;
			h2 {
				font-size: 24px;
				font-style: normal;
				font-weight: 500;
				line-height: 28px;
				margin-bottom: 24px;
			}
		}
		.s-experiencia {
			margin-top: 0;
			padding-top: 32px;
			padding-bottom: 32px;
			h2 {
				font-size: 28px;
				font-style: normal;
				font-weight: 500;
				line-height: 40px;
				margin-bottom: 24px;
				span {
					height: 40px;
					ul {
						li {
							height: 40px;
							white-space: nowrap;
						}
					}
				}
			}
			ul {
				padding: 48px 24px;
				gap:24px;
			}
		}
		.s-manosalaobra {
			margin-top: 0;
			padding-top: 32px;
			padding-bottom: 32px;
			.container {
				h2 {
					font-size: 30px;
					font-style: normal;
					font-weight: 500;
					line-height: 40px;
					margin-bottom: 32px;
				}
				.carousel {
					.carousel-inner {
						.carousel-item {
							.text {
								.top {
									max-width: 100%;
									.mobile-image {
										margin-top: 48px;
										display: block;
										width: 100%;
										aspect-ratio: 35 / 26;
										box-shadow: 0px 23px 11.8px 1px rgba(0, 0, 0, 0.07);
										margin-bottom: 32px;
										border-radius: 30px;
										overflow: hidden;
										img {
											object-fit: cover;
											height: 100%;
										}
									}
								}
								.intro {
									font-size: 16px;
								}
								.title {
									font-size: 24px;
									font-style: normal;
									font-weight: 500;
									line-height: 28px;
								}
								.bottom {
									position: absolute;
									top: 0;
									right: 12px;
									a {
										display: none;
									}
								}
							}
							.image {
								display: none;
							}
						}
					}
				}
				.contactbutton-mobile {
					font-size: 18px;
                    font-style: normal;
                    font-weight: 500;
                    line-height: 20px;
                    display: flex;
                    border: 1px solid #1B1B1F;
                    height: 56px;
                    padding: 8px 16px;
                    border-radius: 200px;
                    align-items: center;
                    text-decoration: none;
                    margin-left: auto;
                    margin-right: auto;
                    width: fit-content;
				}
			}
		}
		.s-exitos {
			overflow: hidden;
			margin-top: 0;
			padding-top: 32px;
			padding-bottom: 132px;
			h2 {
				font-size: 30px;
				font-style: normal;
				font-weight: 500;
				line-height: 40px;
				margin-bottom: 32px;
			}
			.container {
				.carousel-exitos {
					.slick-list {
						overflow: hidden;
						.item {
							padding-left: 12px;
							padding-right: 12px;
							padding-bottom: 48px;
							.image {
								padding:0;
								img {
									box-shadow: none;
									border-bottom-right-radius: 0;
									border-bottom-left-radius: 0;
								}
							}
							.text {
								border-top-right-radius: 0;
								border-top-left-radius: 0;
								padding-top: 40px;
								padding-bottom: 40px;
								padding-left: 24px;
								padding-right: 24px;
								.title {
									font-size: 24px;
									font-style: normal;
									font-weight: 500;
									line-height: 28px;
									margin-bottom: 32px;
								}
							}
							&:not(.slick-active) {
								opacity: 1;
								transform: none;
							}
						}
					}
				}
			}
		}
	}
}

/* // `md` applies to small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {

}

/* // `sm` applies to x-small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {}


@media (max-width : 768px) {
	.landing-suministros {
		.s-manosalaobra {
			.animate__animated {
				/*CSS transitions*/
				-o-transition-property: none !important;
				-moz-transition-property: none !important;
				-ms-transition-property: none !important;
				-webkit-transition-property: none !important;
				transition-property: none !important;
				opacity: 1 !important;
				/*CSS transforms*/
				-o-transform: none !important;
				-moz-transform: none !important;
				-ms-transform: none !important;
				-webkit-transform: none !important;
				transform: none !important;
				/*CSS animations*/
				-webkit-animation: none !important;
				-moz-animation: none !important;
				-o-animation: none !important;
				-ms-animation: none !important;
				animation: none !important;
			}
		}
	}

}