.snackbar {
	visibility: hidden;
	opacity: 0;

	min-width: 250px;
	background-color: #333;
	color: #fff;
	text-align: center;
	border-radius: 2px;
	padding: 8px;

	position: fixed;
	z-index: 1;

	left: 50%;
	bottom: 30px;
	transform: translate(-50%, 20px);

	transition:
		opacity 0.5s ease,
		transform 0.5s ease,
		visibility 0s linear 0.5s;
}

.snackbar.show {
	visibility: visible;
	opacity: 1;
	transform: translate(-50%, 0);

	transition:
		opacity 0.5s ease,
		transform 0.5s ease,
		visibility 0s;
}

.snackbar.hide {
	visibility: visible;
	opacity: 0;
	transform: translate(-50%, 20px);

	transition:
		opacity 0.5s ease,
		transform 0.5s ease,
		visibility 0s linear 0.5s;
}