body {
	padding-bottom: 5rem;
	overflow-y: scroll;
}

.landing-page {
	background-color: black;
	display: grid;
	grid-template-rows: auto 1fr;
	min-height: 100vh;
	padding-bottom: 0;
}

img {
	height: auto;
}

video {
	width: 100%;
	height: auto;
}

.intro {
	min-height: 25rem;
	background-image: url('intro.jpg');
	background-size: cover;
}

.stars {
	display: flex;
	color: rgb(255, 174, 0);
}

.button-star,
.play,
.pause {
	font-size: 0;
	border: none;
	padding: 0;
	background-color: transparent;
	color: inherit;
}

.button-star::before,
.play::before,
.pause::before {
	font-size: 1rem;
}

.button-star:not(:last-child) {
	padding-right: 0.1rem;
}

.button-star:not(:first-child) {
	padding-left: 0.1rem;
}

.player {
	position: relative;
	display: flex;
	overflow: hidden;
}

.player-controls {
	position: absolute;
	inset: auto 0 0;
	color: #ffffff;
	background-image: linear-gradient(to bottom, transparent, #00000055 90%);
	padding: 0.5em 1em;
	display: flex;
	justify-content: space-between;
	transition-property: transform, visibility;
	transition-duration: 0.3s;
}

video[controls] + .player-controls {
	display: none;
}

.player-controls > * {
	filter: drop-shadow(0 0 0.3em #000000);
}

.player-controls.hidden {
	transform: translateY(100%);
	visibility: hidden;
}

.player .pause {
	display: none;
}

.player.playing .play {
	display: none;
}

.player.playing .pause {
	display: block;
}

.form-check-label {
	line-height: 1.3;
}

.form-check-input {
	flex-shrink: 0;
}

.img-fluid {
	width: 100%;
	max-width: none;
}

.form-check-input.is-invalid ~ .form-check-label,
.form-control.is-invalid {
	margin-bottom: 0;
}
