body { background: #FFF; color: #111; font-family: Palatino, Times, serif; font-size: 150%; line-height: 1.5em; width: 50ex; margin: 3em 3em 0; }
h1, h2, h3, p, ul, li { margin: 0 0 1em; padding: 0; font-weight: normal; list-style: none; }

a { color: #5BBEE6; text-decoration: none; -webkit-transition: 0.2s color; }
a:hover { color: #057; }

h1, h2, h3 { font-weight: bold; font-family: "Helvetica Neue", Helvetica, sans-serif; }
h1 a, h2 a, h3 a { display: block; }
h2 { margin-top: 2em; }

h1 + p { margin-bottom: 3em; }

ul, li * { margin: 0; }
li { overflow: hidden; padding: 2ex; margin: -2ex; }
li h3 a { display: block; padding: 50ex; margin: -50ex; position: relative; z-index: 4; -webkit-transition-property: color, background-color; }
li h3 a:hover, li h3 a:focus { background: rgba(0, 255, 255, 0.1); color: #058; }
li p { display: inline; }
li p.date { color: #CCC; font-style: italic; white-space: nowrap; }
li p.date:before { content: " \2022 "; padding: 0 1ex; color: #EEE; }

.whaddaya-talk { font-style: italic; margin-top: -1em; }
.amp { font-family: Baskerville; font-style: italic; }

footer p { margin-top: 4em; border-top: 0.1em solid #CCC; padding: 3.9em 0 3em; color: #555; }

@media all and (max-device-width: 480px) {
  body { width: 100%; margin: 12px; font-size: 100%; }
}