body { color: #000; background-image: radial-gradient(#fff 75%, #eee); background-attachment: fixed; font: 15px/1.5 Sans-serif; }

a { color: #000; text-decoration: underline; }
p, h1, h2 { margin: 0; margin-bottom: 12px; }
h1 { font-size: 36px; } h2 { font-size: 18px; }

body { margin: auto; width: 800px; display: grid; grid-template-columns: 480px 320px; min-height: 100dvh; }
body div  { align-content: center; }
#content { padding-right: 24px; }
#side { }

@media (prefers-color-scheme: dark) {
	body { color: #fff; background-image: radial-gradient(#111 75%, #000); } a { color: #fff; }
}

@media (max-width: 848px) {
	body { display: inline; } body div { margin: 24px; }
}