/**
 * Clients Carousel Styles
 * 
 * @package Rei_do_Muro
 */

@keyframes rdm-scroll {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(calc(-50% - 1rem));
	}
}

.clients-carousel {
	mask-image: linear-gradient(
		to right,
		transparent,
		black 80px,
		black calc(100% - 80px),
		transparent
	);
	-webkit-mask-image: linear-gradient(
		to right,
		transparent,
		black 80px,
		black calc(100% - 80px),
		transparent
	);
}

.clients-track {
	animation: rdm-scroll 30s linear infinite;
	width: fit-content;
}

.clients-track:hover {
	animation-play-state: paused;
}

@media (max-width: 768px) {
	.clients-carousel {
		mask-image: linear-gradient(
			to right,
			transparent,
			black 40px,
			black calc(100% - 40px),
			transparent
		);
		-webkit-mask-image: linear-gradient(
			to right,
			transparent,
			black 40px,
			black calc(100% - 40px),
			transparent
		);
	}
}