<!-- More details in this article:
https://dev.to/5t3ph/guide-to-css-units-for-relational-spacing-1mj5 -->

<header>
	<h1>A Super Rad Website</h1>
</header>
<main>
	<h2>More Uber Awesome Content</h2>
	<p>Brownie macaroon dessert gummi bears. Bonbon chocolate cake soufflé chocolate macaroon. Chocolate cake muffin cheesecake bonbon chupa chups sweet roll marzipan.</p>
    <p>Lemon drops sweet roll soufflé. Macaroon tiramisu marzipan dragée cake pudding gummies topping. Chocolate bar lemon drops cookie. Oat cake cupcake topping bonbon cheesecake danish powder.</p>
    <p>Donut topping bear claw. Marshmallow gummi bears croissant chocolate bar powder dessert cotton candy candy. Cookie carrot cake lemon drops chocolate cake.</p>
</main>

header {
	min-height: calc(100vh - (3rem + 10vmin));
	display: grid;
	place-items: center;
	background-color: rebeccapurple;
	color: #fff;
}

main {
	max-width: 80ch;
	margin: 10vmin auto;
	padding: 0 1rem;
}