/* card_styles.css */

/* Styles for card container */
.cards {
	display: flex;
	flex-wrap: wrap; /* Added flex wrap */
	gap: 16px;
	justify-content: center;
}

/* Styles for each card */
.card {
	position: relative;
	outline: 2px solid white;
	width: 200px;
	height: 125px;
	transition: transform 0.3s cubic-bezier(0.68, -0.55, 0.27, 1.55); /* Adjust cubic-bezier values for the spring effect */
}

.card img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.card:hover {
	transform: scale(1.1); /* Scale the card on hover */
}

/* Styles for card titles */
.card h2 {
	font-size: 12px;
	top: -10px;
	position: absolute;
	background-color: rgba(0, 0, 0, 0.3);
	color: white;
}