#products-container {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 3rem 1rem 12rem 1rem;
	gap: 8rem;
	background: var(--gradient-two);
	/* 	border: red 2px solid; */
}

#products-container .image {
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;

	width: 700px;
	height: 550px;

	transition: 0.2s ease;
	/* 	border: 2px solid gr2een; */
	margin: 0 auto;
}

#products-container .image:hover {
	scale: 1.025;
}

#products-container .content {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-top: 1rem;
}

#products-container .content a {
	padding-top: 1rem;

	text-decoration: underline;
	text-decoration-color: var(--accent-main);
	text-underline-offset: 10px;
	text-decoration-thickness: var(--button-underline-size);

	font-weight: 900;
	color: var(--color-main);
	transition: 0.15s ease-in-out;
	font-size: 1.2rem;
}

#products-container .content a:hover {
	color: var(--color-hover);
	text-decoration-color: var(--accent-hover);
	scale: var(--button-scale-factor);
	cursor: pointer;
}

footer {
	background: var(--background-dark-one);
}

@media (max-width: 905px) {
	#products-container .image {
		width: 650px;
		height: 380px;
	}
}

@media (max-height: 820px) {
	#products-container .image {
		width: 650px;
		height: 380px;
	}
}

@media (max-width: 655px) {
	#products-container .image {
		width: 500px;
		height: 280px;
	}
}

@media (max-height: 620px) {
	#products-container .image {
		width: 400px;
		height: 220px;
	}
}

@media (max-width: 505px) {
	#products-container .image {
		width: 400px;
		height: 220px;
	}
}

@media (max-height: 450px) {
	#products-container .image {
		width: 300px;
		height: 200px;
	}
}

@media (max-width: 405px) {
	#products-container .image {
		width: 300px;
		height: 200px;
	}
}