

.emergency-bar-container {
	background: $grey-light;
	padding: 10px 10px 7px 10px;
	color: $grey-dark;
	@include clearfix;
	display: none;
	position: relative;
	z-index: 200;
	border-bottom: 1px solid $grey;
	text-align: center;

	a {
		color: $grey;

		&:hover {
			text-decoration: none;
		}
	}

	&.show {
		display: block;
	}

	.fa-close {
		float: right;
		margin: 0 0 3px 20px;
		cursor: pointer;
	}

	&.red {
		background: $red;
		color: white;
		border-bottom: 1px solid darken( $red, 10% );

		a {
			color: white;
		}
	}

	&.orange {
		background: $orange;
		color: white;
		border-bottom: 1px solid darken( $orange, 10% );

		a {
			color: white;
		}
	}

	&.yellow {
		background: $yellow;
		color: darken( $yellow, 50% );
		border-bottom: 1px solid darken( $yellow, 10% );

		a {
			color: darken( $yellow, 50% );
		}
	}

	&.lime {
		background: $lime;
		color: darken( $lime, 40% );
		border-bottom: 1px solid darken( $lime, 10% );

		a {
			color: darken( $lime, 40% );
		}
	}

	&.navy {
		background: $navy;
		color: white;
		border-bottom: 1px solid darken( $navy, 10% );

		a {
			color: white;
		}
	}

	&.blue {
		background: $blue;
		color: white;
		border-bottom: 1px solid darken( $blue, 10% );

		a {
			color: white;
		}
	}

	&.teal {
		background: $teal;
		color: $navy;
		border-bottom: 1px solid darken( $teal, 10% );

		a {
			color: $navy;
		}
	}
}

