body {
	background-color: #222;
	line-height: normal;
	position: relative;
	color: #fff561;
}

h1, h2, h3, h4, h5, h6, p {
	color: #fff561;
}

.content {
	position: absolute;
	width: 100%;
	top: 0;
	left: 0;
	padding: 1rem 1rem;
}

.content.for-printing {
	color: #222;
	background-color: #eee;
}


.content.for-printing h4 {
	color: #222;
	background-color: #eee;
}

.content.for-printing p {
	color: #222;
	background-color: #eee;
}

.hero-image {
	width: 100%;
}

.hero-header {
	color: #fd7119;
	font-size: 2.5rem;
	white-space: nowrap;
	opacity: 0.75;
}

.hero-sub {
	color: #fd7119;
	margin-left: 1rem;
	margin-bottom: 0.5rem;
	font-style: italic;
	opacity: 0.75;
	font-size: 0.75rem;
}

.hero-text {
	font-size: 1.25rem;
	margin-left: 0rem;
	color: #ffcb2a;
	opacity: 0.75;
}

.front-nav {
	width: 100%;
	text-align: right;
}

@media screen and (max-width: 30rem) {
	.hero-header {
		font-size: 1.25rem;
	}
	.hero-text {
		font-size: 0.75rem;
	}
	.hero-sub {
		font-size: 0.5rem;
	}
	.front-nav {
		font-size: 80%;
	}
	.responsive-spacer::after {
		display: block;
		content: ' ';
		height: 2rem;
		background-color: #111;
	}

}

@media screen and (max-width: 15rem) {
	.responsive-spacer::after {
		display: block;
		content: ' ';
		height: 4rem;
	}
}

.nav-bar {
	width: 100%;
}

.nav-bar-right {
	position: absolute;
	padding: 0.75rem 1rem;
	top: 0;
	right: 0;
}

.gallery {
	margin: 0.25rem 1.5rem;
}

.gallery .slick-slide {
	margin: 0 0.5rem;
	border: 5px red;
	border-color: red
}

.gallery img {
	height: 200px;
}

.slick-dots li button:before {
	color: #fd7119;
}

.video-container {
	width: 100%;
	position: relative;
}

.video {
	position: absolute;
	top: 0;
	left: calc((100% - 640px)/2);
}

.photo-credit {
	font-size: 75%;
	margin-right: 1.5rem;
	text-align: right;
}