body {
	margin:0;
	padding:0;
	background-color:#EEE;
	font-family: Arial, sans-serif;
}
h2 {
	font-size:1.3em;
}
li {
	padding-bottom:3px;
}
ol ul, ul ul {
	padding-left:18px;
}
#wrapper {
}
#header, #resources, #instructions, #google-sheets {
	margin-top:0px;
	padding-top:0px;
	max-width:800px;
	margin:0 auto;
	padding: 15px 30px;
	border-left:1px solid #666;
	border-right:1px solid #666;
}
#instructions {
	border-bottom:1px solid #666;
}
#header {
	background-color:#8f001a;
}
#header__title {
	font-size:1.6em;
	font-weight:bold;
	line-height:1.4em;
	color:white;
	padding-top:40px;
}
#header__subtitle {
	font-size:1.3em;
	padding-top:5px;
	color:#DDD;
	padding-bottom:20px;
	line-height:1.4em;
}
#resources {
	background-color:#2d2d2c;
	padding-bottom:20px;
}
#resources__list {
	display:flex;
	flex-wrap:wrap;
}
#resource__title {
	color:white;
	text-transform:uppercase;
	font-weight:bold;
	padding-top:20px;
	padding-bottom:20px;
	letter-spacing:0.1em;
}
.resource {
	margin-right:20px;
	margin-bottom:20px;
	width:275px;
	border:3px solid #666;
	border-radius:5px;
	padding:10px 0px 10px 0px;
	text-align:center;
	text-decoration:none;
	color:#EEE;
	transition:150ms;
}
.resource:hover {
	border:3px solid #AAA;
	color:white;
}
#google-sheets {
	background-color:#F2F2F2;
}
#instructions {
	background-color:#DCDCDC;
	line-height:1.5em;
}
ion-icon {
	font-weight:bold;
	display:inline-block;
	font-size:1.3em;
	margin-bottom:-2px;
}

@media only screen and (max-width: 767px) {
	body {
		font-size:0.9em;
	}
	ol, ul {
		padding-left:20px;
	}
	.resource {
		margin-bottom:10px;
		margin-right:0px;
		width:100%;
	}
	#header__title {
		padding-top:25px;
	}
	#header, #resources, #instructions, #google-sheets {
		padding:15px 15px;
	}
}