@import url("https://fonts.googleapis.com/css?family=PT+Serif&display=swap&subset=latin-ext");
@import url("https://fonts.googleapis.com/css?family=PT+Sans:wght@400;700&display=swap&subset=latin-ext");

body { font-family: 'PT Serif', serif; padding: 1rem; margin: 0; background: #fff; color: #000 }

h1, h2, #header { font-family: 'PT Sans', sans }

img { width: 100% }

@media (min-width: 500px) {
    #main { display: grid; grid-template-columns: repeat(auto-fill, minmax(400px, 1fr)); grid-gap: 1rem }
    #main p { padding: 0; margin: 0 }
}

#header { padding: 0; margin: 0 0 1rem 0; font-weight: bold }

h1 { padding: 0; margin: 0 0 1rem 0; font-size: 250%; font-weight: 700 }

#footer { color: #666; padding: 2rem 0 0 0 }

a { text-decoration: none }
a:link { color: #000; border-bottom: solid #00f 2px }
a:visited { color: #000; border-bottom: solid #90c 2px }
a:hover { color: #f00; border-bottom: none }