/* ==========================================================
   Flipbox
   ========================================================== */

.tmc-flipbox {
	position: relative !important;
	perspective: 1200px;
	overflow: visible !important;
	transform-style: preserve-3d;
	cursor: pointer;
	outline: none;
}

.tmc-flipbox:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 4px;
}

.tmc-flipbox-front,
.tmc-flipbox-back {
	width: 100%;
	margin: 0 !important;

	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;

	transform-style: preserve-3d;
	transform-origin: center center;
}

.tmc-flipbox-front {
	position: relative !important;
	inset: auto !important;
	z-index: 1;
}

.tmc-flipbox-back {
	position: absolute !important;
	inset: 0 !important;
	z-index: 2;
	height: 100% !important;
}

.tmc-flipbox-front,
.tmc-flipbox-back {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

@media (prefers-reduced-motion: reduce) {
	.tmc-flipbox {
		scroll-behavior: auto;
	}
}