Layout

  • Page width: .wrap is centred and at most 1084px.
  • Two columns: .wrap.layout holds a .side menu (260px) and the main column. The side menu stacks above the content on phones.
  • Full width: the Education overview and Exhibition use the full wrap width with no side menu.
  • Spacing: sections are separated by 40 to 56px; related items by 16 to 24px.

Two-column layout

The class pattern behind Education, Glossary and Information pages.

Main content.

<div class="wrap layout"><aside class="side"><nav aria-label="Example"><h2>Section</h2><ul><li><a class="is-current" href="#">Current page</a></li><li><a href="#">Another page</a></li></ul></nav></aside><div><p>Main content.</p></div></div>