:root {
	--max-content-width: 1000px;
}
@media (min-width: 1300px) {
	:root {
		--max-content-width: 1280px;
	}
}
@media (min-width: 1600px) {
	:root {
		--max-content-width: 1450px;
	}
}

div.student-card > div.data > span,
div.student-card > div.data > a > span,
li.youtube-card > div.data {
	font-size: 80%;
}
.post-type-archive-student
	div.student-card
	> div.data
	> span:not(:first-of-type),
div.student-card > div.data a:not(:first-of-type) span,
div.student-card > div.data > span {
	display: flex;
	align-items: center;
	justify-content: space-around;
	flex-wrap: wrap;
	margin: 0.1rem 0;
}
div.student-card > div.data > span,
.post-type-archive-student
	div.student-card
	> div.data
	> span:not(:first-of-type) {
	flex-wrap: nowrap;
	justify-content: center;
}

div.student-card > div.data > span a {
	margin: 0 0.5rem;
}
ol.teams div.student-card > div.data > span a {
	margin: 0;
}
ol.parented-squares.teams div.student-card > div.data > span a:nth-of-type(2) {
	margin-left: 0.3rem;
}

div.school-map {
	flex-direction: row;
}
div.school-map > div {
	width: 85%;
	height: 70vh;
}
div.school-map > div img {
	max-height: unset;
	max-width: unset;
}
div.school-map > ul {
	width: 15%;
	margin-left: 0.5rem;
	max-height: 70vh;
	overflow-y: auto;
	overflow-x: hidden;
}
div.school-map > ul li:hover {
	cursor: pointer;
	background-color: var(--hi-background);
}

a:hover,
div.data span a:hover,
div.data a:hover span,
.single-student div.student-card > div.data div.single-student-badges a:hover {
	color: var(--hi-red);
	cursor: pointer;
}

img {
	width: auto;
	height: auto;
	max-height: 30vh;
	max-width: 80%;
}
iframe {
	width: 40vw;
	height: calc(40vw * (9 / 16));
}

header {
	transition: font-size var(--hi-scale-speed);
	z-index: 5;
	height: 10vh;
}

main {
	max-width: var(--max-content-width);
	min-height: 80vh;
}
body.home main#home {
	max-width: unset;
	height: 90vh;
}

header #menu-burger {
	display: none;
}

.primary-menu {
	height: 100%;
	flex-direction: row;
	justify-content: center;
	padding: var(--hi-space) var(--hi-doublespace);
	overflow: visible;
}
.primary-menu img {
	height: 4rem;
	width: auto;
	margin-right: 2rem;
}
.primary-menu #primary-menu {
	padding: 0;
	flex-direction: row;
	justify-content: center;
	font-size: 125%;
	font-weight: 300;
	margin: 0;
}
.primary-menu #primary-menu > li {
	position: relative;
	padding: 1rem 0;
	display: flex;
	align-items: center;
	height: 5vh;
	padding: 0 2rem;
	font-size: 1.25rem;
}
.primary-menu #primary-menu li a:hover {
	color: var(--hi-red);
}
.primary-menu #primary-menu ul.sub-menu {
	display: none;
	flex-direction: column;
	position: absolute;
	top: 5vh;
	left: 0;
	width: 100%;
	background-color: var(--hi-black);
}
.primary-menu #primary-menu li:hover ul.sub-menu {
	display: flex;
}

.main-heading {
	font-size: 3vw;
	margin: var(--hi-doublespace);
}

#homepage {
	flex-direction: row;
	height: 100%;
}

#nav-menu {
	flex-direction: column;
	justify-content: center;
}
#nav-menu .nav-item {
	justify-content: initial;
	align-items: center;
	font-size: 150%;
	margin: 0.5rem 0;
}
#nav-menu .nav-item > div {
	flex-basis: 20%;
	min-width: 2rem;
	max-width: 2.5rem;
}
#nav-menu .nav-item span {
	display: block;
	margin-left: 10px;
	flex-basis: 80%;
}
#slides .slide-title {
	font-size: 300%;
	padding: 0;
}
#slides .slide-content {
	max-height: 82.5%;
}
#slides .slide-content video,
#slides .slide-content #video-cover {
	margin: auto;
	display: block;
	height: 100%;
	max-width: 85vw;
	width: auto;
}
#slides .slide-content .dark-text-background {
	font-size: 200%;
	bottom: 5%;
}
#slides .slide-content .dark-text-background.prelims {
	width: 25%;
	font-size: 160%;
	left: 70%;
	bottom: 2.5%;
	padding: 0.25rem;
	background-color: #000;
}
#slides .slide-content #video-cover {
	cursor: pointer;
	display: flex;
}
#slides .slide-content #video-cover svg {
	width: 7.5%;
}

.crumbs {
	left: calc((var(--max-content-width) - 100vw) / 2);
}
.crumbs ul {
	width: var(--max-content-width);
	flex-direction: row;
	justify-content: center;
}
.crumbs ul li:not(:first-of-type)::before {
	margin: 0 var(--hi-doublespace);
}
.crumbs ul li:not(:first-of-type)::before {
	font-size: 125%;
	content: "\2022";
	font-weight: 600;
	line-height: 125%;
	margin: 0 1rem;
}
.crumbs ul a,
.crumbs ul a:visited {
	font-size: 1rem;
}
.crumbs ul a.selected-link,
.crumbs ul a.selected-link:visited {
	font-size: 1.5rem;
}

form.filter-form {
	flex-direction: row;
}

.parented-squares > li {
	display: grid;
	grid-template-columns: 1fr 4fr;
	height: fit-content;
}
.parented-squares > li > div {
	height: 100%;
	min-height: 150px;
}
.parented-squares > li > div.grid-container {
	margin: 0 0 0 1rem;
}
.parented-squares > li > a:first-of-type {
	width: 90%;
}
.parented-squares > li > div > div {
	min-height: 12.5rem;
	height: 100%;
}
.parented-squares > li > div h2 {
	max-width: 100%;
	padding: 2rem;
	white-space: normal;
}
.parented-squares > li > div > ul {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	grid-gap: 1rem;
}
.teams.parented-squares > li > div > ul,
.rounds.parented-squares > li > div > ul {
	grid-template-columns: 1fr 1fr;
}
.schools.parented-squares {
	grid-template-columns: 1fr 1fr 1fr;
}
.parented-squares > li > div > ul > li {
	margin: 0;
}

.schools.parented-squares > li > a:first-of-type {
	height: 20rem;
}
.schools.coaches.parented-squares {
	grid-template-columns: 1fr 1fr 1fr 1fr;
}

.rounds li.youtube-card {
	font-size: 150%;
}

div.student-page {
	flex-direction: row;
	margin-top: 5vh;
}
div.student-page > div.student-column {
	flex-basis: 25%;
	width: 25%;
	margin-right: 1rem;
}
div.student-page > ul.team-column {
	flex-basis: 75%;
	width: 75%;
}
div.student-page > ul.team-column li.student-team a h1 {
	font-size: 210%;
	text-align: left;
}
div.student-page > ul.team-column > li.student-team {
	margin-top: 2.5rem;
}
div.student-page > ul.team-column > li.student-team:first-of-type,
div.student-page > ul.team-column > li.student-team h1 {
	margin-top: 0;
}
div.student-page > ul.team-column > li.student-team > div {
	display: flex;
	justify-content: space-between;
	flex-direction: column-reverse;
}
div.student-page > ul.team-column > li.student-team > div > iframe {
	flex-basis: 60%;
	margin: 0;
}
div.student-page > ul.team-column > li.student-team > div > ol,
div.team-page ol {
	flex-basis: 40%;
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-gap: 1rem;
	margin-bottom: 1rem;
}
div.student-page > ul.team-column > li.student-team > div > ol.single-round,
div.team-page ol.single-round {
	grid-template-columns: 1fr;
}
div.student-page li.youtube-card {
	width: 100%;
}

div.team-page > img {
	width: 50%;
	max-height: unset;
}
div.team-page > div {
	font-size: 120%;
}
div.team-page > div.team-badges {
	width: 50%;
	margin: 1.5rem auto;
}
div.team-page > div.team-badges i {
	height: 12.5rem;
}
div.team-page > div.team-media {
	flex-direction: column-reverse;
}
div.team-page > div.team-media {
	display: flex;
	width: 80%;
	margin: 1rem auto;
}
div.team-page iframe {
	height: 60vh;
	width: auto;
	margin: 0;
}
div.team-page ol {
	flex-basis: auto;
}
div.team-page ol > li {
	margin: 0.5rem 0;
	height: auto;
	flex-basis: 45%;
}

a.brief-download {
	width: fit-content;
	margin-bottom: 1rem;
}
a.brief-download svg {
	margin-left: 1rem;
}
iframe.brief-iframe {
	display: block;
}

div.school-page {
	flex-direction: row;
}
div.school-page div.student-column {
	flex-basis: 30%;
	height: fit-content;
}
div.school-page ul.students-grid {
	flex-basis: 70%;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	margin: 0 0 0 3rem;
	height: fit-content;
}

.letter-links {
	max-width: 1000px;
	margin: auto;
}
.letter-links > div {
	flex-basis: calc(100% / 13);
	display: flex;
	justify-content: space-around;
}
.letter-links > div:nth-of-type(13n),
.letter-links > div:last-of-type {
	flex-basis: calc(100% / 26);
}
.letter-links > div:nth-of-type(13n)::after {
	display: none;
}

@media (max-width: 1400px) {
	#nav-menu .nav-item {
		font-size: 100%;
	}

	.post-type-archive-student div.student-card > div.data span.team-span {
		font-size: 75%;
	}
	.post-type-archive-student div.student-card > div.data i {
		margin-left: 0.25rem;
		height: 1.5rem;
	}

	div.school-page ul.students-grid {
		grid-template-columns: 1fr 1fr 1fr;
	}

	div.student-card div.data {
		padding: 0.75rem 0.25rem;
	}
	div.student-card > div.data > span a {
		margin: 0 0.25rem;
	}

	ol.rounds div.data strong,
	ol.rounds div.data span {
		font-size: 80%;
	}

	#slides .slide-title {
		font-size: 225%;
	}
	#slides .slide-content .dark-text-background {
		font-size: 150%;
		bottom: 2.5%;
	}
	#slides .slide-content.slideshow .dark-text-background.slideshow {
		font-size: 110%;
	}
}
@media (min-width: 1600px) {
	.parented-squares > li {
		grid-template-columns: 1fr 5fr;
	}
	.parented-squares > li > div > ul {
		grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
	}
	.teams.parented-squares > li,
	.rounds.parented-squares > li {
		grid-template-columns: 1fr 6fr;
	}
	.rounds.parented-squares > li > div > ul,
	.teams.parented-squares > li > div > ul {
		grid-template-columns: 1fr 1fr 1fr;
	}
}