/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */
.site-aes-announcements {
	--background: mistyrose;
	--colorText: #333;
	--colorLink: blue;
	--colorLinkHover: purple;
	margin: 0;
	padding: 0;
	background: var(--background);
	color: var(--colorText);
	font-size: 0.9125em;
	/*position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 100;*/
}
.site-announcement {
	margin: 0;
	padding: 0;
	display: none;
	align-items: center;
}

@media screen and (min-width: 800px) {
	.site-announcement {
		max-width: 1080px;
		margin-left: auto;
		margin-right: auto;
	}
}
.site-announcement.is-visible {
	display: flex;
}
.site-announcement.is-hidden {
	display: none;
}
.site-announcement a {
	color: var(--colorLink);
	text-decoration: underline;
}
.site-announcement a:hover,
.site-announcement a:focus-visible {
	color: var(--colorLinkHover);
}
.site-announcement-inner {
	flex: 0 0 auto;
	width: calc(100% - 3em);
	padding: 0.75em 1em;
}
@media screen and (min-width: 800px) {
	.site-announcement-inner {
		text-align: center;
		padding-left: 4em;
	}
}
.site-announcement-close {
	flex: 0 0 auto;
	width: 3em;
	padding: 1em;
	margin: 0;
	border: 0;
	font-size: 1em;
	font-weight: 400;
	color: var(--colorText);
	background: transparent;
}
.site-announcement-close:hover,
.site-announcement-close:focus-visible {
	background: transparent;
	color: var(--colorLinkHover);
}
.site-announcement-close svg {
	display: block;
	pointer-events: none;
}
.site-announcement-close-icon {
	stroke: currentColor;
	fill: transparent;
	stroke-width: 3;
}
