@font-face { font-family:'Bitter'; src:url('https://fonts.gstatic.com/s/bitter/v36/raxhHiqOu8IVPmnRc6SY1KXhnF_Y8fbfOLjOXQ.woff2') format('woff2'); }
@font-face { font-family:'Maname'; src:url('https://fonts.gstatic.com/s/maname/v1/gNMFW3J8RpCx9myI31MH.woff2') format('woff2'); }
@font-face { font-family:'Crimson Pro'; font-style:italic; src:url('https://fonts.gstatic.com/s/crimsonpro/v24/q5uBsoa5M_tv7IihmnkabARekYNwDQ.woff2') format('woff2'); }
:root { font-family:'Maname', sans-serif; color:#282828; font-size:20px; }
body { background-color:white; max-width:900px; margin:auto; padding:30px; }
header { width:90%; margin:auto; text-align:center; border-bottom:4px solid #fc8d05; margin-bottom:40px; }
img { padding:0; margin:0; }
h1 { color:#0eab96; font-size:430%; margin:0; margin-bottom:40px; }
p { margin-left:12px; }
a { text-decoration:none; font-weight:bold; color:#1e9688; }
a:hover { color:#4fc1b4; text-decoration:underline 2px; }
div.imagerow { text-align:center; width:100%; white-space:nowrap; overflow:auto; margin-bottom:40px; }
div.imagerow img { margin:4px; box-shadow:0 1px 3px #aaa; }
a img:hover { box-shadow:0 1px 3px #555; }
table { margin:10px; }
td, th { vertical-align:top; padding:8px; }
footer { margin-top:52px; border-top:1px solid #ddd; padding:6px; font-variant:small-caps; font-style:italic; color:#999; }
td p, footer p { margin:initial; }

@media only screen and (max-width:900px) {
	header { width:100%; }
	h1 { font-size:340%; overflow:wrap; overflow-wrap:anywhere; }
	/*
	div.imagerow { height:160px; }
	div.imagerow img { width:30%; height:auto; margin:auto; vertical-align:top; }
	*/
	/* bad. just use tables. */
	th, td { display:block; margin-top:20px; }
	td img { display:block; margin:auto; width:50%; height:auto; }
}
