/* home alert area */
/* --------------- */
#alert {
	background: url(../images/alert-bg.png) 0 0 repeat #bd3933;
	font-size: 18px;
	line-height: 1.5;
	color: #FFF;
}

#alert > .inner {
	padding-top: 30px;
	padding-bottom: 30px;
}

#alert .wrapper {
	position: relative;
	transition: all 0.3s;
}

#alert .wrapper > div {
	float: left;
}

#alert .wrapper .content {
	width: 65%;
	padding-right: 20px;
}

#alert .wrapper .contact-info {
	width: 35%;;
	padding-left: 20px;
	font-size: 15px;
}

#alert h2,
#alert h3,
#alert a {
	color: #FFF;
  margin: 0;
}

#alert p {
  margin: 0;
}

#alert .wrapper .content a,
#alert .wrapper .contact-info a {
	text-decoration: underline;
}

#alert .wrapper .content a:hover,
#alert .wrapper .content a:focus,
#alert .wrapper .contact-info a:hover,
#alert .wrapper .contact-info a:focus {
	text-decoration: none;
}

#alert h3 {
	font-size: 18px;
	text-transform: uppercase;
}

#alert .wrapper .contact-info {
	padding-top: 8px;
}

#alert .wrapper .contact-info ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	width: 100%;
}

#alert .wrapper .contact-info ul li {
	display: table;
	width: 100%;
	border-collapse: collapse;
	table-layout: fixed;
}

#alert .wrapper .contact-info ul li > * {
	display: table-cell;
	padding: 4px 0;
}

#alert .wrapper .contact-info ul li span:first-child {
	width: 32%;
	padding-right: 10px;
}

/* full width variation of banner */
#alert .wrapper.no-extra-info-column .contact-info {
	display: none;
}

#alert .wrapper.no-extra-info-column .content {
	width: auto;
	padding-right: 0;
}

/* open / close link */
#alert .wrapper .open-close {
	position: absolute;
	top: -12px;
	right: 20px;
	font-size: 14px;
	line-height: 0.8;
	text-decoration: none;
	text-transform: uppercase;
}

#alert .wrapper .open-close .closed {
	display: none;
}

#alert .wrapper .open-close:after {
	content: '\f057';
	display: inline-block;
	margin-left: 3px;
	font-family: 'Font Awesome 5 Free';
  font-weight: 900;
	font-size: 18px;
	line-height: 1;
}

/* open / close state */
#alert.closed > .inner {
	padding-top: 8px;
	padding-bottom: 12px;
}

#alert.closed .content *,
#alert.closed .contact-info {
	display: none;
}

#alert.closed .content h2 {
	display: block;
	font-size: 22px;
	text-transform: uppercase;
}

#alert.closed .wrapper .open-close {
	top: 4px;
}

#alert.closed .wrapper .open-close .closed {
	display: inline;
}

#alert.closed .wrapper .open-close .open {
	display: none;
}

#alert.closed .wrapper .open-close:after {
	content: '\f055';
}