.toast {
	position: fixed;
	bottom: -200px;
	left: 50%;
	margin-left: -160px;
	width: 320px;
	background: #3498db;
	opacity: 0;
	padding: 1rem;
	color: #FFF;
	z-index: 99999;

	cursor: pointer;

	-webkit-border-radius: 5px;
	        border-radius: 5px;

	-webkit-transition: all 250ms ease-in-out;
	   -moz-transition: all 250ms ease-in-out;
	    -ms-transition: all 250ms ease-in-out;
	     -o-transition: all 250ms ease-in-out;
	        transition: all 250ms ease-in-out;

	-webkit-box-shadow: 0 0 50px 5px rgba(0,0,0,0.3);
	        box-shadow: 0 0 50px 5px rgba(0,0,0,0.3);

	-webkit-filter: blur(3px);
	        filter: grayscale(3px);
}

.toast.show {
	opacity: 1;
	bottom: 2rem;
	-webkit-filter: blur(0);
	        filter: grayscale(0);
}

.toast.hide {
	opacity: 0;
	bottom: 4rem;
}

.toast.success {
	background: #1abc9c;
}

.toast.error {
	background: #e74c3c;
}

.toast.warning {
	background: #f39c12;
}

.toast .fa {
	position: absolute;
	top: 0.5rem;
	right: 0.5rem;
	cursor: pointer;
}

.toast a {
	color: #FFF;
	font-weight: bold;
}