@keyframes autoRun3d {
	from {
		transform: perspective(800px) rotateY(-360deg);
	}

	to {
		transform: perspective(800px) rotateY(0deg);
	}
}

@keyframes animateBrightness {
	10% {
		filter: brightness(1);
	}

	50% {
		filter: brightness(0.1);
	}

	90% {
		filter: brightness(1);
	}
}

.card-3d>div>img {
	border-radius: 0.5rem;
	width: 100%;
	height: 100%;
}

.card-3d {
	position: relative;
	width: 800px;
	height: 400px;
	transform-style: preserve-3d;
	transform: perspective(800px);
	animation: autoRun3d 20s linear infinite;
	will-change: transform;
	transition: 0.8s ease;
}

.buttonDiscover {
	display: flex;
	text-decoration: none;
	margin-top: auto;
}

.innerdiv {
	display: flex;
	height: 90%;
	flex-direction: column;
	justify-content: space-between;
}
.discoverCategorie {
	padding: 5px;
	color: black;
	padding-inline: 10px;
	background: linear-gradient(70deg, white, rgba(255, 255, 255, 0.405));
	border: solid 1px white;
	border-radius: 10px;
	transition: 0.2s;
}

.discoverCategorie:hover {
	transform: scale(1.1);
}

.blackCache {
	background-color: rgba(0, 0, 0, 0.37);
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

.parpitie {
	font-family: Arial, Helvetica, sans-serif;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 10;
	color: white;
	padding: 10px;
}

.card-3d>div {
	overflow: hidden;
	position: absolute;
	object-fit: cover;
	width: 300px;
	height: 200px;
	border-radius: 0.5rem;
	top: 50%;
	left: 50%;
	transform-origin: center center;
	animation: animateBrightness 20s linear infinite;
	transition-duration: 200ms;
	will-change: transform, filter;
}

.card-3d:hover {
	animation-play-state: paused !important;
}

.card-3d:hover>div {
	animation-play-state: paused !important;
}

.card-3d>div:nth-child(1) {
	transform: translate(-50%, -50%) rotateY(0deg) translateZ(300px);
	animation-delay: -0s;
}

.card-3d>div:nth-child(2) {
	transform: translate(-50%, -50%) rotateY(60deg) translateZ(300px);
	animation-delay: -3.333s;
}

.card-3d>div:nth-child(3) {
	transform: translate(-50%, -50%) rotateY(120deg) translateZ(300px);
	animation-delay: -6.666s;
}

.card-3d>div:nth-child(4) {
	transform: translate(-50%, -50%) rotateY(180deg) translateZ(300px);
	animation-delay: -10s;
}

.card-3d>div:nth-child(5) {
	transform: translate(-50%, -50%) rotateY(240deg) translateZ(300px);
	animation-delay: -13.333s;
}

.card-3d>div:nth-child(6) {
	transform: translate(-50%, -50%) rotateY(300deg) translateZ(300px);
	animation-delay: -16.666s;
}

.card-3d>div:nth-child(7) {
	transform: translate(-50%, -50%) rotateY(360deg) translateZ(300px);
	animation-delay: -20s;
}

.centrerCarousel {
    display: flex;
    justify-content: center;
}

.centrerCarousel>.card-3d>div>.parpitie>.innerdiv>h2 {
    color: white !important;
}