nav, article, header, section, footer { display: block; } html { -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; font-size: 100%; } body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; line-height: 1.4; margin: 0; color: #000; font-weight: 200; } #articles, .article { list-style-type: none; } .article { width: 100%; padding: 10px; margin: 5px 0; border: 2px solid transparent; } .article:focus { outline: 0; z-index: 1; position: relative; background: #fff; border-radius: 2px; box-shadow: 0 0 2px #ccc; } p { margin: 0; } [hidden], .hidden { display: none; } .separator { color: #ccc; } .wrapper{ width: 90%; margin: 0 auto; padding: 0 10px; } .collection .separator:last-of-type { display: none; } .context { vertical-align: top; text-align: right; } .history-frame { display: none; } @media only screen and (min-width: 1140px) { .wrapper { width: 1026px; } } @media only screen and (max-width: 500px) { body { font-size: 80%; } #articles { display: block; } section { text-align: left; } } @media only screen and (min-width: 500px) { footer { margin-left: 10px; } }