.video-container {
	position: absolute;
	top: 72.5%;
	left: 5%;
	width: 90%;
	height: 40%;
	height: 25vw;
	overflow: hidden;
}
.video-container #intro-video {
	width: 100%;
}
.video-container-spacer {
	display: block;
	/* fallback for older browsers */
	height: 25%;
	/* this must be the same as (video-container - overlap between video-container and hero */
	height: calc(25vw - 12.5vh);
}

/* smaller layout */

@media all and (max-width: 675px) {
	body,
	html {
		font-size: 13px !important;
	}
	.column,
	.section.half-width {
		min-width: 100%;
	}
	.section img.column {
		display: none;
	}
	.hero .centered {
		width: 90%;
	}
	.dialog {
		width: 100%;
	}
}