body, html { cursor: default; } body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td { margin: 0; padding: 0; } * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } :before, :after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } img, object, embed { max-width: 100%; height: auto; } object, embed { height: 100%; } img { margin: 1.25% 0; -ms-interpolation-mode: bicubic; } html { background-color: #F0F1F3; padding: 2%; } body { font-size: 16px; line-height: 1.6; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; color: #242424; max-width: 800px; margin: 5% auto; } body::after { clear: both; content: ""; display: table; } header { margin-bottom: 8%; } footer { text-align: center; } h1, h2, h3, h4, h5, h2 a { color: #263A48; font-weight: 500; text-decoration: none; } h1, h2 { font-size: 36px; padding-bottom: 0.3em; margin-bottom: 0.4em; border-bottom: 1px solid #eee } h2 { font-size: 22px; padding-bottom: 0.6em; margin-bottom: 0.6em; margin-top: 2.5em; } h3 { font-size: 18px; margin-bottom: 0.3em; } h2 small a { color: #98999C; font-size: 15px; font-weight: normal; float: right; position: absolute; top: 15px; right: 20px; } section { background: #fff; margin-bottom: 1%; position: relative; padding: 6% 8%; } blockquote { border-left: 3px solid #d54e21; font-size: 16px; padding: 0 0 0 20px; color: #d54e21; } blockquote a { color: #d54e21; font-weight: 500; } blockquote code { color: #d54e21; } .highlight pre { padding: 10px; } .highlight { margin-bottom: 4%; } a { color: #1e8cbe; text-decoration: underline; } a:hover { color: #d54e21; } ul { list-style: none; } ol { list-style: number; } ol li { color: #98999C; margin-bottom: 5px; } ol li:last-child { margin-bottom: 0; } p, ul, ol, blockquote { margin-bottom: 4%; } ul ul { padding-top: 0; margin-bottom: 0; margin-left: 4%; } ul ul li:before { content: '-'; display: inline-block; padding-right: 2%; } ul.col-2 { color: #98999C; -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; -webkit-column-gap: 20px; -moz-column-gap: 20px; column-gap: 20px; } dl dt { font-weight: bold; } dl dd { padding-left: 10px; } @media screen and (min-width: 500px) { ul.col-2 { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; -webkit-column-gap: 20px; -moz-column-gap: 20px; column-gap: 20px; } } nav { background: #F0F1F3; min-width: 215px; margin-bottom: 5px; margin-top: 15px; } nav:first-of-type a { color: #d54e21; border-radius: 0; } nav:first-of-type a:hover { color: #d54e21; } nav:first-of-type a:before { background-color: #d54e21; } nav.affix { position: fixed; top: 20px; } nav.affix-bottom { position: absolute; } nav a { border-radius: 3px; font-size: 15px; display: block; cursor: pointer; font-weight: 500; position: relative; text-decoration: none; padding: 10px 12px; width: 100%; padding-right: 3px; border-bottom: 2px solid #fff; } nav a:before { content: ''; width: 4px; display: block; left: 0; position: absolute; height: 100%; display: none; background: #1e8cbe; top: 0; } nav a:hover { background-color: #E6E8EA; color: #1e8cbe; text-decoration: underline; } nav a:hover:before { display: block; } nav a:last-of-type { border-bottom: none; } .gist { margin-top: 5.1%; margin-bottom: 5%; } @media screen and (max-width: 1050px) { body { margin: 0 auto; } } @media screen and (max-width: 767px) { header span { display: none; } h1 { font-size: 26px; } h2 { font-size: 20px; } } @media screen and (max-width: 514px) { p, ul, ol, blockquote { margin-bottom: 8%; } }