/**
 * Alert messages
==============================================================================*/
.alert {
	position: relative;
	margin: 1em 0 0 0;
	padding: .5em;
	font-weight: bold;
	text-align: center;
	border: 1px solid;
}
.alert h4 {
	margin: 0;
	font-size: 1.5em;
	line-height: 1em;
	text-transform: uppercase;
}
.alert p {
	margin: 0;
	text-align: center;
	letter-spacing: 1px;
	font-size: 1em;
	line-height: 1.2em;
	font-variant: small-caps;
	padding: 0 1em;
}

.alert__close-x {
	position: absolute;
	top: -5px;
	right: -5px;
	color: inherit;
	padding: 0 .25em;
}

.alert--inline {
	display: inline-block;
}

.alert--error {
	color:#7f181d;
	background: #ea929e;
	border-color: #e26771;
}
.alert--warning {
	color:#c36017;
	background: #d18e5c;
	border-color: #d17734;
}
.alert--success {
	color: #20431e;
	background: #8ac680;
	border-color: #65b65d;
}
.alert--info {
	color: #1e556b;
	background: #8fcfe0;
	border-color: #67b9d4;
}

.alert--small {
	padding: .25em;
}
.alert--small h4 {
	font-size: 1em;
}
.alert--small p {
	font-size: 0.75em;
}

.alert--large {
	padding: 1em;
}
.alert--large h4 {
	font-size: 2.25em;
}
.alert--large p {
	font-size: 1em;
}


.alert-container {
	position: fixed;
	top: 0;
	right: 10px;
	max-width: 300px;
	min-width: 250px;
}

.alert-container .alert {
	margin: .5em;
	z-index: 101; /* overlay is 100, make sure these show over overlays */
}