.flash-message {
	font: normal 16px/24px Arial, sans-serif;
	background: #fc796b;
	color: #fff;
	width: 100%;
	padding: 15px 50px 15px 20px;
	margin: 0 0 20px 0;
	display: inline-block;
	*display: inline;
	*zoom: 1;
	vertical-align: top;
	position: relative;
	border-radius: 0 0 4px 4px;
	transition: opacity 0.3s ease-in;

	&__close {
		font: normal 36px/24px Arial, sans-serif;
		width: 20px;
		height: 20px;
		padding: 0;
		line-height: 18px;
		text-align: center;
		color: #c96055;
		border: none;
		display: block;
		position: absolute;
		right: 17px;
		top: 16px;
		background: none;

		&:hover {
			color: #fff !important;
		}
	}

	&--hidden {
		opacity: 0;
		pointer-events: none;
	}

	&--danger {
		background: #d14233;
		color: #fff;

		.flash-message__close {
			color: #912519;
		}
	}

	&--success {
		background: #19b698;
		color: #fff;

		.flash-message__close {
			color: #13927a;
		}
	}
}

#flash-messages {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 9999;

	.flash-message {
		margin: 0 auto;
		width: 1180px;
		display: block;
	}
}