
@media (max-width: 670px) {
	.cookie_banner {
		width: calc(100% - 2rem * 2 - 1rem * 2) !important;
	}
}

.cookie_banner {
	position: fixed;
	bottom: 0;
	left: 0;

	display: flex;
	flex-direction: column;
	gap: 1rem;
	width: calc(35% - 2rem * 2 - 1rem * 2); /* removing the padding and the margin */

	padding: 2rem;
	border-radius: 1rem;
	margin: 1rem;
	background-color: var(--racing-red);
	color: var(--lavendar-mist);
	z-index: 1;
	box-shadow: 5px 5px 2rem #00000022;

	transition: 1s;
}

.cookie_banner[closed] {
	transform: translateY(150%);
}

.cookie_banner h1 {
	font-size: 2rem;
}

.cookie_banner .buttons {
	display: flex;
	padding: 1rem;
	gap: 1rem;
}

.cookie_banner .buttons button {
	padding: 1rem 2rem;
	border-radius: 1rem;
	border: 0;
	background-color: var(--ink-black);
	color: var(--lavendar-mist);
	cursor: pointer;
	transition: .3s;
}

.cookie_banner .buttons .accept {
	background-color: var(--lavendar-mist);
	color: var(--ink-black);
}

.cookie_banner .buttons button:hover {
	filter: brightness(.8);
}