@font-face {
	font-family: GothamHTF-Bold;
	src: url("/fonts/GothamHTF-Bold.otf") format("opentype");
}

@font-face {
	font-family: GothamHTF-Book;
	src: url("/fonts/GothamHTF-Book.otf") format("opentype");
}

a {
	color: #00C697;
}

a:focus, a:hover {
	color: #00C697;
	text-decoration: none;
}

body {
	background-image: url("/images/gradient-background.png");
	background-repeat: repeat-x;
	color: #808080;
	font-family: GothamHTF-Book, Helvetica, Arial, sans-serif;
}

h1 {
	color: white;
	font-family: GothamHTF-Book, Helvetica, Arial, sans-serif;
	font-size: 36px;
	font-weight: normal;
	margin: 0;
}

h1 b {
	font-family: GothamHTF-Bold, Helvetica, Arial, sans-serif;
}

h2 {
	color: #424c5c;
	font-family: GothamHTF-Bold, Helvetica, Arial, sans-serif;
	font-size: 14px;
	margin: 20px 0px;
}

.background-image {
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 670px;
}

.background-gradient {
	background-image: linear-gradient(to right, black, transparent);
	height: 670px;
	opacity: .6;
	position: absolute;
	top: 0;
	width: 100%;
}

.heading {
	align-items: center;
	display: flex;
	height: 670px;
	justify-content: center;
	padding: 20px;
	position: absolute;
	top: 0;
}

.heading > a {
	flex: 1;
	margin-left: 20px;
}

.content {
	padding: 20px;
}

/* Small devices and up */
@media (min-width: 768px) {
	
	.content {
		padding: 10px 150px 20px 150px;
	}
	
	.heading {
		padding: 0 150px;
	}
	
	.heading > a {
		margin-left: 40px;
	}
	
	h1 {
		font-size: 36px;
	}
	
}