body {
	font-family: arial;
	padding: 1em 2em;
}
a {
	color: #7800a0;
}
a:hover {
	color: #311a4d;
}
.intro {
	max-width: 1000px;
	margin: 0 auto;
}

.intro ol {
	padding-left: 1em;
}

.intro li {
	font: 400 .9em/1.6 arial;
	margin-bottom: .5em;
}

hr {
	margin: 2em 0;
}
.wrapper {
	display: flex;
    flex-direction: row;
    align-items: stretch;
    flex-wrap: wrap;
    justify-content: center;
    }
.container {
	display: flex;
    flex-direction: column;
    max-width: 600px;
	margin: 0 20px 10px;
	padding: 10px 20px 0;
	border: 2px dashed #e2e2e2;
}
h1 {
	font-size: 1.6em;
	margin-top: 0;
}
h2 {
	font-size: 1.2em;
	margin: 25px auto 20px;
    display: table;
    white-space: nowrap;
}
h2:before, h2:after {
	border-top: 1px solid #555;
	content: '';
	display: table-cell;
	position: relative;
	top: 0.5em;
	width: 50%;
}
h2:before { 
	right: 1%; 
}
h2:after { 
	left: 1%; 
}