/* Classless.css v1.0 (Tiny Inline Version)*/ /* Tiny Reset for block elements */ * {box-sizing: border-box; border-spacing: 0;} header, footer, figure, table, video, details, blockquote, ul, ol, dl, fieldset, pre, pre > code, caption, nav { display: block; margin: 0.5rem 0rem 1rem; width: 100%; overflow: auto hidden; text-align: left; } video, summary, input, select { outline:none; } html { font: 12pt/1.6 'Open Sans', Helvetica, sans-serif; } body { position: relative; margin: auto; max-width: 50rem; color: #433; padding: 3.1rem 0.6rem 0; overflow-x: hidden; } body > footer { margin: 10rem 0rem 0rem; } /* clickable stuff */ a, summary, button, select { color: #07c; cursor: pointer; } a { text-decoration: underline solid #d1d1d1; text-underline-position: under; } a:hover { color: #088; border-color: #088; } /* common */ td, th, pre > code { padding: 0.5rem 0.8rem; } .card, details { padding: 0 .6rem; } code, kbd, samp { padding: 0.2rem; font: .9em/1.4 monospace; } code, kbd, samp, nav, .card { background: #f4f5f6; border-radius: 0.3em; } kbd, .card, details[open] { border: 1px solid #d1d1d1; } td, th, figcaption, caption, .card { font-size: 95%; } td, th, hr { border: 0; border-bottom: 0.1rem solid #d1d1d1; } /* lists */ ul, ol { padding-top: 0.5rem; } li, dd { margin-bottom: 0.5rem; } dt { font-weight: bold; } /* headings */ h1, h2, h3, h4, h5 { margin: 1.5em 0 0em; line-height: 1.2em; } h1+h2, h2+h3, h3+h4, h4+h5 { margin-top: .5em; } h1 { font-size: 2.2em; font-weight: 300; } h2 { font-size: 2.0em; font-weight: 300; font-variant-caps: small-caps; } h3 { font-size: 1.5em; font-weight: 400; } h4 { font-size: 1.1em; font-weight: 700; } h5 { font-size: 1.2em; font-weight: 400; color: #888; } h6 { font-size: 1.0em; font-weight: 600; display: inline; } h6 + p { display: inline; } /* tables */ td, th { text-align: right; white-space: nowrap; } td:first-child, th:first-child { text-align: left; } tr:hover{ background-color: #f4f5f6; } /* figures */ img, svg { max-width: 100%; vertical-align: text-top; } p>img:not(:only-child) { float: right; margin: 0 0 .5em .5em; } figure > img { display: block; margin: 0.5em auto; } figcaption, caption { color: #888; margin-bottom: 1rem; } figure > *:not(:last-child) { margin: 0 0 0.4rem; } /*code*/ pre > code { margin: 0; border-left: 0.4rem solid #088; } /* misc */ blockquote{ border-left: 0.3rem solid #d1d1d1; padding: 1rem 1.5rem; font-style: italic; } input { font-size: 1em; } p>cite:before { content: ' ('; } p>cite:after {content: ') '} /* grid */ .row { display: flex; margin: 0.5rem -0.5rem; align-items: stretch; } .row [class*="col"] { padding: 0 0.5rem; flex: 1 1 100%; } @media (max-width: 40em) { .row { flex-direction: column !important; } }