/* Global CSS variables */
:root {
	--spacing-company: 6rem;
	--font-weight: 400;
	--border-radius: 0;
	--transition: 0.2s ease-in-out;
	--scrollbar-width: 0px;
}

/* Typography */
h2,
h3,
hgroup > :last-child {
	font-weight: 200;
	margin-bottom: 10px;
}

small {
	color: var(--muted-color);
}

/* Header */

header {
	padding: var(--spacing-company) 0;
}

header hgroup > :last-child {
	color: var(--h3-color);
}

header hgroup {
	margin-bottom: var(--spacing-company);
}

/* Nav */
summary[role="link"].contrast:is([aria-current],:hover,:active,:focus) {
	background-color: transparent;
	color: var(--contrast-hover);
}

/* Main */
@media (min-width: 992px) {
	main .grid {
		grid-column-gap: var(--spacing-company);
		grid-template-columns: auto 25%;
	}
}

.container {
	padding-bottom: 0px;
}

form.grid {
	grid-row-gap: 0;
}

/* Aside nav */
aside img {
	margin-bottom: 0.25rem;
}

aside p {
	margin-bottom: var(--spacing-company);
	line-height: 1.25;
}

hgroup {
	margin-bottom: 50px;
}

img, logo {
	min-width: 200px;
}

.privacy {
	display: block;
	text-align: center;
	padding-bottom: 100px;
}

iframe {
	width: 100%;
	height: 100%;
	position: absolute;
}

.embed-container {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
	max-width: 80%; /* change this for size */
}

/* vid full width if screen small */
@media screen and (max-width: 1025px) {
	.embed-container {
		max-width: 100%;
	}
}

.video-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; }

.video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 80%; height: 80%; }