body{min-height:100vh;margin:0;padding:0;background:#fff9e8;color:#151412;font-family:sans-serif}#login{height:100vh;display:grid;grid-template-rows:1fr auto 1fr;grid-template-columns:1fr auto 1fr;grid-template-areas:". .    ." ". form ." ". .    ."}#login form{grid-area:form;text-align:center}#login form *{margin:4px;padding:8px;font-size:x-large}#content{height:100vh;display:grid;grid-template-rows:repeat(2,auto);grid-template-columns:repeat(2,auto);grid-template-areas:"header header" "main   nav"}#content>*{padding:12px}header{grid-area:header;border-bottom:thin solid #000;text-align:center}main{grid-area:main;overflow:scroll}article pre{padding:10px;background:#d3d3d3;line-height:1.75}nav{grid-area:nav;border-left:thin solid #000}