html, body { padding:0; margin:0; }

body {
	text-align:center;
}
header {
	font-family:sans-serif;
}
footer {
	color:gray;
	text-align:right;
	font-size:small;
}

body > footer {
	padding:1em 1em;
}

body {
	background-color:#f6f6e6;
}
header {
	color:#fe5;
	background-color:#333;
	padding:1ex;
	margin-bottom:3em;
}
.fact {
	color:#555;
	background:rgba(255,255,255,.5);
}

.fact:first-child { color:#000; }
a { color:inherit; }

header h1 {
	letter-spacing:1ex;
	margin-bottom:0ex;
}
header h2 {
	font-style:italic;
	margin-top:0ex;
}

.fact:first-child p {
	font-style:italic;
	font-size:150%;
}

.fact {
	margin-left:auto;
	margin-right:auto;
	max-width:50em;

	padding:1.5ex 2ex;
	margin-bottom:2em;

	text-align:justify;
	text-align-last:center;
}
.fact a, header a {
	text-decoration:none;
}
.fact footer {
	margin:auto;
}
.fact p {
	margin:0 0 1ex;
}

@media screen and (max-width:420px) {
	header h1 { font-size:120%; }
	header h2 { font-size:100%; }
	header h1 { letter-spacing:0; }
}

/*@media screen and (scroll-top:0) {
	header h1 {
		letter-spacing:1px;
	}
	header h1:after {
		content:':';
	}
	header h1, header h2 {
		font-size:100%;
		display:inline;
	}
}*/