body {
	margin: 0;
	height: 100vh;
}

/* Make the immediate first div child of the body a flexbox to center. */
body > div {
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
}

/* Select the div inside the centering div to add padding and a border. */
body div div {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	padding: 0.25em 1em;
	border: dotted 1px black;
	background-image: url("../img/paper-bg.png");
}

/* Select the h1 title to remove its bottom margin and set its font properties */
body div h1.title {
	font-family: sans-serif;
	font-variant: small-caps;
	margin-bottom: 0em;
}

/* Selects the programatically populated text to have a border and a monospace font. */
body div h1#picks {
	font-size: 26pt;
	font-family: monospace, sans-serif;
	padding: 0.5em;
	border: double 4px black;
}

/* Styling for the button to generate new numbers so it has larger text and some margin. */
body input#regen {
	font-size: 14pt;
	padding: 0.25em;
	margin-bottom: 1em;
}