figure, pre {

margin: 0 0 $leading-height 0;

}

$main-width: columns-width(4);

html, body {

max-width: 100%;
overflow-x: hidden;

}

div#grid {

margin: 0 auto;
padding: ($leading-height * 2) 0;
width: $main-width;

}

@media screen and (max-width: $main-width + $gutter-width * 2) {

body {
  padding-left: $gutter-width;
  padding-right: $gutter-width;
}

div#grid {
  width: 100%;
}

}

header {

text-align: center;
margin-bottom: $leading-height * 2;

}

header h1 a {

text-decoration: inherit;
color: inherit;

}

header nav {

width: 100%;

}

header nav ul {

display: flex;
flex-direction: row;
margin: 0;

}

header nav ul li {

list-style: none;
flex-grow: 1;
text-align: center;

}

header nav ul li a {

display: block;

}

section#posts article {

margin-bottom: $leading-height * 3;

}

section#post header h1 {

margin-bottom: 0;

}

section#post header {

margin-bottom: $leading-height;

}

section#archive > ul {

margin-left: 0;
list-style: outside none none;
margin-bottom: $leading-height * 3;

}

article header time, h2.post-date {

line-height: $line-height;
margin-bottom: $leading-height;
display: block;

}

blockquote, pre {

margin-left: $indent-width;

}

hr {

border-top: 1px double #aaa;
border-bottom: none;
border-left: none;
border-right: none;
margin-bottom: $leading-height - 1;

}

sup {

vertical-align: super;
line-height: 0;

}

section hr {

display: none;

}

article hr {

display: block;

}

article img {

vertical-align: middle;

}

article img, article video {

max-width: 100%;

}