/* Lawtoons generated pages */
body { margin: 0; font-family: Verdana, Geneva, sans-serif; color: #222; background: #fff; }
header { text-align: center; padding: 1.25rem 1rem 0.5rem; }
header .logo { max-width: 100%; height: auto; }
nav { margin-top: 0.5rem; }
nav a { margin: 0 0.75rem; color: #003399; text-decoration: none; font-size: 0.9rem; }
nav a:hover, nav a:focus { text-decoration: underline; }
main { max-width: 960px; margin: 0 auto; padding: 1rem; }
h1 { font-size: 1.4rem; text-align: center; }
footer { text-align: center; font-size: 0.75rem; color: #555; padding: 1.5rem 1rem; }
footer a { color: #003399; }

/* gallery */
.gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
           gap: 1.25rem; list-style: none; padding: 0; }
.gallery a { display: block; text-align: center; color: #003399; text-decoration: none; }
.gallery img { width: 100%; height: auto; border: 1px solid #ccc; background: #fff; }
.gallery .caption { display: block; margin-top: 0.35rem; font-size: 0.8rem; }
.gallery a:hover .caption, .gallery a:focus .caption { text-decoration: underline; }

/* detail page */
.cartoon { text-align: center; }
.cartoon img { max-width: 100%; height: auto; border: 1px solid #ccc; }
.meta { font-size: 0.8rem; color: #555; margin-top: 0.75rem; }
.pager { display: flex; justify-content: space-between; margin: 1.25rem 0; font-size: 0.85rem; }
.pager a { color: #003399; text-decoration: none; }
.pager a:hover, .pager a:focus { text-decoration: underline; }