*,
*:before,
*:after {
	box-sizing: inherit;
	font-family: inherit;
}

#content {
	margin: auto;
	max-width: 60rem;
	padding: 5rem 1rem 1rem 1rem;
	/* Make footer anchored to bottom - 4rem is footer height */
	min-height: calc(100vh - 5rem);
}

img:not(.noImgStyle) {
	width: 100%;
	max-width: 100%;
	height: auto;
	background-color: var(--darkest3);
	border: 2px var(--darkest4) solid;
	border-radius: 0.5rem;
	box-shadow: 1px 1px 6px var(--darkest1);
}

body {
	margin: 0;
	min-height: 100vh;
	color: var(--lightest2);
	font-family: var(--primaryFont);
	background: var(--darkest1);
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}

/* Footer */
footer {
	padding: 1rem;
	margin-top: 1rem;
	height: 5rem;
	background-color: var(--darkest2);
}

footer p,
footer a {
	font-size: 0.8rem;
}

footer #date {
	opacity: 0.7;
	text-decoration: none !important;
	display: block;
}

footer #inner {
	margin: auto;
	max-width: 59rem; /* 60rem content width with -1rem content padding */
	display: flex;
	justify-content: space-between;
	align-items: center;
}

footer .showMoreBtn {
	opacity: 0.6;
}

@media (max-width: 750px) {
	/* Make footer anchored to bottom - 7rem is footer height */
	#content { min-height: calc(100vh - 8rem); }

	footer #inner {
		flex-direction: column;
		align-items: flex-start;
	}
	footer { height: 7rem; }
}

.section a {
	width: 100%;
}
.section h2 {
	margin-bottom: 0;
}

/* Styles applied only on larger screens */
@media (min-width: 1200px) {
	.section {
		display: flex;
		flex-direction: revert;
		align-items: center;
		gap: 1rem;
	}
	.section.right {
		flex-direction: row-reverse;
		padding: 1rem 2rem;
	}
	.section a {
		width: 25rem;
	}
	.section.right h2 {
		text-align: right;
	}
}

.section.right {
	border-radius: 0.1rem;
}

.altBackground {
	background: #282d37;
	box-shadow: 0 0 10px 5px #282d37;
	border-radius: 0.4rem;
	padding: 0.5rem;
}

.altBackground h2 {
	margin: 10px;
}
/* Mobile tap highlight */
html {
	-webkit-tap-highlight-color: rgba(128, 128, 128, 0.5);
}