/*
	ACT theme overrides for the HTML5 UP Forty template.
*/

:root {
	--act-ink: #1d2430;
	--act-blue: #1f5f9f;
	--act-blue-bright: #2d7fca;
	--act-steel: #516070;
	--act-light: #f5f8fb;
	--act-line: rgba(255, 255, 255, 0.18);
}

body {
	background: var(--act-ink);
}

body, input, select, textarea {
	font-family: "Source Sans Pro", Helvetica, sans-serif;
}

#header {
	background-color: rgba(29, 36, 48, 0.96);
}

#header.alt {
	background-color: transparent;
}

#header .logo {
	align-items: center;
	border: 0;
	display: inline-flex;
	height: 3.25em;
	letter-spacing: 0;
	line-height: 1;
	padding-left: 1.1em;
}

#header .logo img {
	display: block;
	height: 2.35em;
	margin-right: 0.65em;
	width: auto;
}

#header .logo span {
	font-size: 0.78em;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

#banner.major {
	background-image: linear-gradient(rgba(29, 36, 48, 0.62), rgba(29, 36, 48, 0.72)), url("../images/hero/act-hero.jpg");
	background-position: center;
	background-size: cover;
}

#banner.major:after {
	background-color: transparent;
}

.act-kicker {
	color: #9bd4ff;
	font-weight: 600;
	letter-spacing: 0.14em;
	margin-bottom: 1em;
	text-transform: uppercase;
}

.tiles article:before {
	background-color: rgba(31, 95, 159, 0.78);
}

.tiles article:nth-child(2):before,
.tiles article:nth-child(5):before {
	background-color: rgba(81, 96, 112, 0.78);
}

.tiles article:nth-child(3):before,
.tiles article:nth-child(6):before {
	background-color: rgba(45, 127, 202, 0.78);
}

.button.primary,
input[type="submit"].primary {
	background-color: var(--act-blue);
}

.button.primary:hover,
input[type="submit"].primary:hover {
	background-color: var(--act-blue-bright);
}

#main > * {
	border-top-color: var(--act-line);
}

.spotlights > section {
	background-color: #263040;
}

.spotlights > section:nth-child(2n) {
	background-color: #202938;
}

.footer-logo {
	border: 0;
	display: inline-block;
	margin-bottom: 1.5em;
}

.footer-logo img {
	display: block;
	height: auto;
	max-width: 11em;
}

@media screen and (max-width: 736px) {
	#header .logo {
		padding-left: 0.85em;
	}

	#header .logo img {
		height: 1.95em;
		margin-right: 0.45em;
	}

	#header .logo span {
		font-size: 0.68em;
	}
}