#notification {
	display: none;
	position: fixed;
	top: 50%;
	left: calc(50% - 120px);
	transform: translate(-50%, -50%);
	padding: 15px;
	border-radius: 5px;
	background-color: #d4af37;
	color: white;
	font-size: 18px;
	text-align: center;
	width: 240px;
	animation: fadeIn 0.5s forwards, bounceIn 0.5s forwards;
	box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.3);
	z-index: 100;
}
@keyframes fadeIn {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}
@keyframes bounceIn {
	from, 20%, 40%, 60%, 80%, to {
		animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
	}
	0% {
		opacity: 0;
		transform: scale3d(0.3, 0.3, 0.3);
	}
	20% {
		transform: scale3d(1.1, 1.1, 1.1);
	}
	40% {
		transform: scale3d(0.9, 0.9, 0.9);
	}
	60% {
		opacity: 1;
		transform: scale3d(1.03, 1.03, 1.03);
	}
	80% {
		transform: scale3d(0.97, 0.97, 0.97);
	}
	to {
		opacity: 1;
		transform: scale3d(1, 1, 1);
	}
}
@keyframes fadeOut {
	from {
		opacity: 1;
	}
	to {
		opacity: 0;
	}
}
@keyframes scaleDown {
	from {
		transform: scale3d(1, 1, 1);
	}
	to {
		transform: scale3d(0, 0, 0);
	}
}

