html, body {
	background:#eee;
	color: #666;
	font-family: 'Roboto', 'Helvetica', sans-serif;
	margin:0 auto;
	padding:0;
	text-align:center;
	font-size: 16px;
	font-weight: 300;
}
header {
	background: #673AB7;
	border-bottom: 4px solid #51a69a;
	margin: 0 0 48px;
	padding: 32px;
}
h1, h4 {
	font-weight: 300;
	margin:0;
}
h1{
	color: white;
	font-size: 48px;
	text-transform:uppercase;
}
h4 {
	font-size: 32px;
	margin:16px 0 0;
	color: #444;
}
header p {
	font-size: 17px;
	font-weight: 300;
	color: #fff;
	opacity: 0.8;
	margin: 0px 32px 10px 0;
	max-width:1090px;
}
p {
	text-align:justify;
	line-height:1.6;
}
code {
	display: inline-block;
	text-align:left;
	background: #41a69a;
	color: #fff;
	border-radius: 4px;
	border: 1px solid #48726d;
	padding: 12px 24px;
	margin: 16px 12px 32px;
}
p code {
	background: #999;
	border: 1px solid #777;
	margin: 0 0 10px;
	padding: 2px 8px;
}
.align-left {
	text-align:left;
}
div.card, div.credits {
	width:calc(100% - 64px);
	box-sizing: border-box;
	max-width:1100px;
	padding: 12px 48px 48px;
	margin: 16px auto 32px 32px;
}
div.card {
	border-radius: 2px;
	position: relative;
	background: white;
	box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
}
div.credits {
	font-size:18px;
	color: #999;
}