
.box {
	border: 1px solid #e2e4e4;
	margin: 24px 0;
	padding: 1em 0;
}

.box h2 {
	margin-left: .5em;
	margin-right: .5em;
}
.box > h2 {
	margin-bottom: 0;
	margin-top: 0;
}

.box > ul { padding-right: .5em; }

#searchDirectives {
	background: #c8e0f8;
	padding: .5em 0;
}

#searchDirectives label { width: auto; }

.observationStations label { width: 170px; }
.layout .caption { margin-left: 177px; }

.noaaResources { max-width: 310px; }


/* ASOS aviation weather */
.avWeather > h3 { margin: 0 .625em; }
.avWeather > form {
	font-size: .929em;
	margin-left: 10px;
	margin-right: 10px;
}

.avWeather > form select { width: calc(100% - 2.9em); }
.avWeather > form input { width: calc(100% - 3.4em); }

.noaaResources {
	list-style-type: none;
	margin: 1em auto 0;
	padding: 0 .67em;
}


/* airport status and delays */
.airportDelaysContainer {
	display: flex;
	flex-direction: column;
	min-height: 198px;
}
.airportDelaysContainer.loading { background: url("/templates/4/assets/img/loadingBar.gif") 50% 50% no-repeat; }

.statusDelays { padding-bottom: 0; }

.statusDelays form { margin-left: 10px; }

.statusDelaysAutocomplete.ui-autocomplete { width: 218px; }
.delayData > p,
.weatherData > p { margin-top: .214em; }

.delayTypes {
	list-style: none;
	margin-bottom: 0;
	padding: 0;
}
.delayTypes > li {
	border-top: 1px solid #e2e4e4;
	overflow: hidden;
	padding: 8px 10px;
}
.delayTypes > li:last-child { border-bottom: 1px solid #e2e4e4; }

.delayTypes > li > a { font-weight: 700; }
.delayTypes > li > a:first-child,
.delayTypes > li > span:first-child {
	display: inline-block;
	margin-top: 4px;
}

.delayTypes var {
	background: #333;
	border-radius: 3px;
	color: #fff;
	float: right;
	font-size: 1.2857em;
	font-style: normal;
	font-weight: 700;
	height: 27px;
	min-width: 27px;
	text-align: center;
}
.delayTypes .bad { background: #a60512; }
.delayTypes .good { background: #335401; }

.js .delayDetails { display: none; }

.delayDetails > ul {
	font-size: .929em;
	list-style: none;
	margin-bottom: 0;
	margin-top: 9px;
	overflow: hidden;
	padding: 0;
}
.delayDetails li {
	border-top: 1px solid #e2e4e4;
	overflow: hidden;
	padding: 8px 5px;
}
.delayDetails li:last-child { border-bottom: 1px solid #e2e4e4; }

.delayDetails li > img,
.delayDetails li > a {
	display: inline-block;
	vertical-align: top;
}
.delayDetails li > a { width: 151px; }

.airportStatus { margin-top: 1.5em; }

.airportInfo {
	color: #fff;
	display: flex;
}

.airportInfo > p {
	margin: 0;
	padding: 5px;
}

.airportDelayCode {
	font-weight: 700;
	padding: 5px;
}

.bad .airportInfo { background: #790000; }
.bad .airportDelayCode { background: #ab0000; }

.good .airportInfo { background: #335401; }
.good .airportDelayCode { background: #467301; }

.delayed {
	font-size: .929em;
	list-style: none;
	margin: 0;
	overflow: hidden;
	padding: 0;
}

.delayed li > img,
.delayData {
	display: inline-block;
	vertical-align: top;
}

.delayData { width: 151px; }

.delayData h3,
.delayData h4 { margin-top: 0; }
.statusDelays .viewAll {
	background: url("/templates/4/assets/img/chalkwork/clock_16x16.png") 0 50% no-repeat;
	display: block;
	margin: 0 10px;
	padding: .5em 0 .5em 20px;
}
