/*body { font-family: 'Roboto Condensed', Arial; font-stretch: condensed; background-color: #141416; color: white } h1 { margin: 16px 0; padding: 9px; background-color: #870328; font-size: 25px; color: white; border-radius: 2px; text-align: centre; } h2, h3, h4, h5, h6 { padding: 8px; background-color: #921131; font-size: 15px; color: white; text-align: centre; position: relative; clip-path: polygon(0 0, 50% 0, calc(50% - 2.5em) 100%, 0 100%); } p { color: #C0C3D0; } a { text-decoration: none; color: #Ff6549; } a:hover { text-decoration: underline; color: white; } img{width:150px;}nav li ul{padding-left:.5em}body{display:flex;flex-wrap:wrap;margin:20 24%}article{flex:1}nav{min-width:12em}nav ul{border-bottom:1px solid;}nav ul{list-style: none}#toc{position:fixed;right:70px;width:222px;max-height:80vh;overflow-y:auto;border-left:1px solid;}*/

body { display: flex; flex-wrap: wrap; font-family: sans; }
header { flex-basis: 100%; flex-shrink: 0; }
article { flex-basis: 60%; padding-left: 1em; }
footer { flex-basis: 100%; flex-shrink: 0; }
header nav { display: flex; justify-content: space-between; }
nav a, header a { text-decoration: none ; color: inherit; }
header h1 span { margin-left: 1em; font-size: 50%; font-style: italic; }
body > nav { flex-basis: content; padding-right: 1vw; min-width: 16em; }
nav ul { display: flex; flex-direction: column; list-style-type: none; list-style-position: outside; padding-left: 0;  }
nav li ul { padding-left: 0.6em }
footer { display: flex; justify-content: space-between; }