:root { --bg-page: #DDEEFF; --bg-main: #FFFFF7; --color: #000000; --toggle-color: #FFFFFF; }
:root.dark { --bg-page: #002030; --bg-main: #111111; --color: #FFFFFF; --link: #FFFF00; }

body { background: var(--bg-page); color: var(--color); }
h1 { font: 2rem Cardo,serif; margin: 0; border-bottom: 1px solid #AAAAAA; }
main { box-sizing: border-box; width: 1000px; border: 3px outset #EEEEEE; background: var(--bg-main); font: 1.1rem/1.5 Cardo,serif; text-align: justify; padding: 100px; margin: 50px auto; }
main p + p { text-indent: 1.5em; }
p { margin: 0; }
aside { font: 1rem Cardo,serif; margin: 0 0 50px 0; text-align: right; }
aside.theme { position: absolute; top: 0.5em; right: 0.5em; background: #000000; border: 2px solid #FFFFFF; border-radius: 10px; color: var(--toggle-color); padding: 0.5em; user-select: none; }

@font-face { font-family: "Cardo"; font-style: normal; font-weight: 400; src: url(Cardo-Regular.ttf) format("truetype"); } /* https://fonts.google.com/specimen/Cardo/license */

@media (width <= 1080px) {
  main { width: 96vw; padding: 20px; margin: 75px auto 20px auto; }
}

@media print {
  aside.theme { display: none; }
}