:root { font-size: 1.05rem; --doc-aside-bar-width: 300px; } main { max-width: 1200px; margin: 3rem auto; margin-bottom: 100vh; text-align: justify; display: grid; position: relative; grid-template-columns: [left] 1fr [right] var(--doc-aside-bar-width); } main>.wrapper { padding: 0 1rem; } h1 { font-size: 2.25rem; } .aside { width: var(--doc-aside-bar-width); position: absolute; right: 0px; border-top: 1px solid var(--color-panel-border); padding: 0 1rem; box-sizing: border-box; opacity: 80%; font-size: 0.9rem; } @media (max-width: 1200px) { main { display: block; } .aside { position: relative; width: 100%; border-bottom: 1px solid var(--color-panel-border) } }