@import "../../common";

#site-message-unit {
	background: $color-message-background;
	color: $color-message-text;
	padding: $menu-padding;
	font-size: 0.875rem;
	padding-top: $menu-padding*3;
	margin-bottom: -2rem;
	padding-bottom: $menu-padding*3;

	&.takeover {
		.message-wrapper {
			background: $color-message-background;
			position:fixed;
			top: 3em;
			left: 50%;
			margin-left: -300px;
			width: 600px;
			z-index: 99999999999;
			font-size: 1.5em;
			border: 4px solid rgba(255,255,255,5.5);
			border-radius: 6px;
			color: #FFF;
			padding: 2em 1em;
		}
	}

	&.hidden {
		padding-top: 0;
		margin-bottom: -1.5rem;
		.message-wrapper {
			display: none;
		}
	}

	a {
		color: $color-message-text-link;
	}

	p:first-child {
		margin-top: 0;
	}
	p:last-child {
		margin-bottom: 0;
	}
	ul {
		padding-left: 1.2rem;
	}

	button.hide {
		float: right;
		font-size: 1.8rem;
		line-height: 1rem;
		margin: 0 $menu-padding/2 $menu-padding $menu-padding;
		background: none;
		border: none;
		color: #FFF;
		padding: 0;
		opacity: 0.4;

		&:hover {
			opacity: 0.8;
		}
	}
}