.homepage {
	background: black url("../background.jpg") no-repeat fixed top / cover;
	width: 100%;
	padding: 0;
	color: white;
	-webkit-font-smoothing: subpixel-antialiased;
}

.site-header {
	background-color: black;
	padding: 0 1.5em;
}

.site-subnav {
	background-color: rgba(0,0,0,.8);
	font-weight: 400;
	box-shadow: 0 .5em 1em -.25em rgba(0,0,0,.5);
/* 	box-shadow: 0 0 0 1px #000; */
}

.nav-link,
.nav-link:visited {
	color: white;
}

.nav-link:hover,
.nav-link:focus {
	color: #1857ff;
}

.nav-link:active {
	color: #ffd700;
}

.info {
	position: fixed;
	right: 0;
	bottom: 0;
}

.info input {
	display: none;
}

.info-text,
.info-label {
	background-color: black;
}

.info-label {
	display: block;
	box-sizing: border-box;
	border: 1px solid white;
	border-radius: .75em;
	cursor: pointer;
	height: 1.5em;
	width: 1.5em;
	z-index: 1;
	position: absolute;
	right: 1em;
	bottom: 1em;
	text-align: center;
	transition: color 300ms ease-out, background-color 300ms ease-out;
}

.info-label:hover {
	background-color: white;
	color: #1f1f1f;
}

.info-text {
	position: relative;
	bottom: -4em;
	opacity: 0;
	margin: 0;
	padding: 1em 4em 1em 1.5em;
	transition: opacity 300ms ease-out, bottom 0 300ms;
}

.info-label::before {
	content: "?";
	position: relative;
	top: -1px;
}

.info-checkbox:checked + .info-label::before {
	content: "×";
}

.info-checkbox:checked ~ .info-text {
	bottom: 0;
	opacity: 1;
	transition: opacity 300ms ease-out, bottom 0 0;
}

.info a {
	color: white;
	border-bottom: 1px dotted;
}

.info a:hover {
	border-bottom-style: solid;
}