diff --git a/docs/build/modules.js b/docs/build/modules.js index 1f7addf..4f6407d 100644 --- a/docs/build/modules.js +++ b/docs/build/modules.js @@ -9,12 +9,8 @@ const px = Object.keys(dependencies) .filter(m => !/^tachyons-(colors|generator|styles|component-loader)/.test(m)) .map(async m => { const pkg = require(`${m}/package.json`) - const readme = readFileSync( - path.resolve('node_modules', m, 'readme.md'), - 'utf8' - ) const src = readFileSync( - path.resolve('node_modules', m, 'src', `${m}.css`), + path.resolve('..', 'src', `_${m.replace(/^tachyons-/, '')}.css`), 'utf8' ) const css = readFileSync( @@ -22,6 +18,9 @@ const px = Object.keys(dependencies) 'utf8' ) + const docsComment = src.match(/\/\*!!!([\S\s]*?)\*\//m) + const readme = docsComment && docsComment[0].replace(/^\/\*!!!/, '').replace(/\*\/$/, '') + const tableOfStyles = await cssTable(css, { from: m }) return { diff --git a/docs/package-lock.json b/docs/package-lock.json index 009fe62..fa9b041 100644 --- a/docs/package-lock.json +++ b/docs/package-lock.json @@ -2033,11 +2033,33 @@ "resolved": "https://registry.npmjs.org/del/-/del-3.0.0.tgz", "integrity": "sha1-U+z2mf/LyzljdpGrE7rxYIGXZuU=", "requires": { + "globby": "6.1.0", "is-path-cwd": "1.0.0", "is-path-in-cwd": "1.0.0", "p-map": "1.2.0", "pify": "3.0.0", "rimraf": "2.6.2" + }, + "dependencies": { + "globby": { + "version": "6.1.0", + "resolved": "https://registry.npmjs.org/globby/-/globby-6.1.0.tgz", + "integrity": "sha1-9abXDoOV4hyFj7BInWTfAkJNUGw=", + "requires": { + "array-union": "1.0.2", + "glob": "7.1.2", + "object-assign": "4.1.1", + "pify": "2.3.0", + "pinkie-promise": "2.0.1" + }, + "dependencies": { + "pify": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz", + "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=" + } + } + } } }, "delayed-stream": { @@ -7844,11 +7866,6 @@ "resolved": "https://registry.npmjs.org/tachyons-widths/-/tachyons-widths-5.2.1.tgz", "integrity": "sha512-LrqK5D8pH1K5JPrv1ld2o+oybDzvhq4dIEW43u3RpyPYg2PizUnxdKWm+QREsOWDDGgwwOMi094P6y5yoBSDNw==" }, - "tachyons-word-break": { - "version": "3.0.4", - "resolved": "https://registry.npmjs.org/tachyons-word-break/-/tachyons-word-break-3.0.4.tgz", - "integrity": "sha1-JC/vWMFlC5mINMpfZ/If/1b/oRg=" - }, "tachyons-z-index": { "version": "1.0.9", "resolved": "https://registry.npmjs.org/tachyons-z-index/-/tachyons-z-index-1.0.9.tgz", diff --git a/docs/package.json b/docs/package.json index eb42844..c6e0d01 100644 --- a/docs/package.json +++ b/docs/package.json @@ -86,7 +86,6 @@ "tachyons-visibility": "^2.0.5", "tachyons-white-space": "^4.0.6", "tachyons-widths": "^5.2.1", - "tachyons-word-break": "^3.0.4", "tachyons-z-index": "^1.0.9" }, "contributors": [ diff --git a/docs/pages/reference.js b/docs/pages/reference.js index 6dedb3d..81bfcde 100644 --- a/docs/pages/reference.js +++ b/docs/pages/reference.js @@ -2,7 +2,6 @@ import React, { Component } from 'react' import Highlight from 'react-highlight' import Layout from '../ui/Layout' -import Doc from '../tmp.md' import SrcReference from '../ui/SrcReference' import { Flex, md } from '../ui' import { modules } from '../ui/data.json' @@ -35,7 +34,7 @@ class Reference extends Component {
- + {module.readme}
diff --git a/docs/ui/Layout.js b/docs/ui/Layout.js index c22eb7b..a53caf9 100644 --- a/docs/ui/Layout.js +++ b/docs/ui/Layout.js @@ -32,7 +32,6 @@ export default ({ {skipHeader ? null :
}
-
{skipFooter ? null :
}
) diff --git a/docs/ui/data.json b/docs/ui/data.json index 6bd6fad..210f3a6 100644 --- a/docs/ui/data.json +++ b/docs/ui/data.json @@ -402,8 +402,8 @@ ] } ], - "readme": "# tachyons-aspect-ratios 1.0.0\n\nCss for setting the aspect ratio of an element.\n\n#### Stats\n\n723 | 52 | 84\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-aspect-ratios\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-aspect-ratios\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-aspect-ratios.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-aspect-ratios\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n ASPECT RATIOS\n\n*/\n/* This is for fluid media that is embedded from third party sites like youtube, vimeo etc.\n * Wrap the outer element in aspect-ratio and then extend it with the desired ratio i.e\n * Make sure there are no height and width attributes on the embedded media.\n * Adapted from: https://github.com/suitcss/components-flex-embed\n *\n * Example:\n *\n *
\n * \n *
\n *\n * */\n.aspect-ratio { height: 0; position: relative; }\n.aspect-ratio--16x9 { padding-bottom: 56.25%; }\n.aspect-ratio--9x16 { padding-bottom: 177.77%; }\n.aspect-ratio--4x3 { padding-bottom: 75%; }\n.aspect-ratio--3x4 { padding-bottom: 133.33%; }\n.aspect-ratio--6x4 { padding-bottom: 66.6%; }\n.aspect-ratio--4x6 { padding-bottom: 150%; }\n.aspect-ratio--8x5 { padding-bottom: 62.5%; }\n.aspect-ratio--5x8 { padding-bottom: 160%; }\n.aspect-ratio--7x5 { padding-bottom: 71.42%; }\n.aspect-ratio--5x7 { padding-bottom: 140%; }\n.aspect-ratio--1x1 { padding-bottom: 100%; }\n.aspect-ratio--object { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 100; }\n@media screen and (min-width: 30em) {\n .aspect-ratio-ns { height: 0; position: relative; }\n .aspect-ratio--16x9-ns { padding-bottom: 56.25%; }\n .aspect-ratio--9x16-ns { padding-bottom: 177.77%; }\n .aspect-ratio--4x3-ns { padding-bottom: 75%; }\n .aspect-ratio--3x4-ns { padding-bottom: 133.33%; }\n .aspect-ratio--6x4-ns { padding-bottom: 66.6%; }\n .aspect-ratio--4x6-ns { padding-bottom: 150%; }\n .aspect-ratio--8x5-ns { padding-bottom: 62.5%; }\n .aspect-ratio--5x8-ns { padding-bottom: 160%; }\n .aspect-ratio--7x5-ns { padding-bottom: 71.42%; }\n .aspect-ratio--5x7-ns { padding-bottom: 140%; }\n .aspect-ratio--1x1-ns { padding-bottom: 100%; }\n .aspect-ratio--object-ns { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 100; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .aspect-ratio-m { height: 0; position: relative; }\n .aspect-ratio--16x9-m { padding-bottom: 56.25%; }\n .aspect-ratio--9x16-m { padding-bottom: 177.77%; }\n .aspect-ratio--4x3-m { padding-bottom: 75%; }\n .aspect-ratio--3x4-m { padding-bottom: 133.33%; }\n .aspect-ratio--6x4-m { padding-bottom: 66.6%; }\n .aspect-ratio--4x6-m { padding-bottom: 150%; }\n .aspect-ratio--8x5-m { padding-bottom: 62.5%; }\n .aspect-ratio--5x8-m { padding-bottom: 160%; }\n .aspect-ratio--7x5-m { padding-bottom: 71.42%; }\n .aspect-ratio--5x7-m { padding-bottom: 140%; }\n .aspect-ratio--1x1-m { padding-bottom: 100%; }\n .aspect-ratio--object-m { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 100; }\n}\n@media screen and (min-width: 60em) {\n .aspect-ratio-l { height: 0; position: relative; }\n .aspect-ratio--16x9-l { padding-bottom: 56.25%; }\n .aspect-ratio--9x16-l { padding-bottom: 177.77%; }\n .aspect-ratio--4x3-l { padding-bottom: 75%; }\n .aspect-ratio--3x4-l { padding-bottom: 133.33%; }\n .aspect-ratio--6x4-l { padding-bottom: 66.6%; }\n .aspect-ratio--4x6-l { padding-bottom: 150%; }\n .aspect-ratio--8x5-l { padding-bottom: 62.5%; }\n .aspect-ratio--5x8-l { padding-bottom: 160%; }\n .aspect-ratio--7x5-l { padding-bottom: 71.42%; }\n .aspect-ratio--5x7-l { padding-bottom: 140%; }\n .aspect-ratio--1x1-l { padding-bottom: 100%; }\n .aspect-ratio--object-l { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 100; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n ASPECT RATIOS\n\n*/\n\n/* This is for fluid media that is embedded from third party sites like youtube, vimeo etc.\n * Wrap the outer element in aspect-ratio and then extend it with the desired ratio i.e\n * Make sure there are no height and width attributes on the embedded media.\n * Adapted from: https://github.com/suitcss/components-flex-embed\n *\n * Example:\n *\n *
\n * \n *
\n *\n * */\n\n.aspect-ratio {\n height: 0;\n position: relative;\n}\n\n.aspect-ratio--16x9 { padding-bottom: 56.25%; }\n.aspect-ratio--9x16 { padding-bottom: 177.77%; }\n\n.aspect-ratio--4x3 { padding-bottom: 75%; }\n.aspect-ratio--3x4 { padding-bottom: 133.33%; }\n\n.aspect-ratio--6x4 { padding-bottom: 66.6%; }\n.aspect-ratio--4x6 { padding-bottom: 150%; }\n\n.aspect-ratio--8x5 { padding-bottom: 62.5%; }\n.aspect-ratio--5x8 { padding-bottom: 160%; }\n\n.aspect-ratio--7x5 { padding-bottom: 71.42%; }\n.aspect-ratio--5x7 { padding-bottom: 140%; }\n\n.aspect-ratio--1x1 { padding-bottom: 100%; }\n\n.aspect-ratio--object {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 100;\n}\n\n@media (--breakpoint-not-small){\n .aspect-ratio-ns {\n height: 0;\n position: relative;\n }\n .aspect-ratio--16x9-ns { padding-bottom: 56.25%; }\n .aspect-ratio--9x16-ns { padding-bottom: 177.77%; }\n .aspect-ratio--4x3-ns { padding-bottom: 75%; }\n .aspect-ratio--3x4-ns { padding-bottom: 133.33%; }\n .aspect-ratio--6x4-ns { padding-bottom: 66.6%; }\n .aspect-ratio--4x6-ns { padding-bottom: 150%; }\n .aspect-ratio--8x5-ns { padding-bottom: 62.5%; }\n .aspect-ratio--5x8-ns { padding-bottom: 160%; }\n .aspect-ratio--7x5-ns { padding-bottom: 71.42%; }\n .aspect-ratio--5x7-ns { padding-bottom: 140%; }\n .aspect-ratio--1x1-ns { padding-bottom: 100%; }\n .aspect-ratio--object-ns {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 100;\n }\n}\n\n@media (--breakpoint-medium){\n .aspect-ratio-m {\n height: 0;\n position: relative;\n }\n .aspect-ratio--16x9-m { padding-bottom: 56.25%; }\n .aspect-ratio--9x16-m { padding-bottom: 177.77%; }\n .aspect-ratio--4x3-m { padding-bottom: 75%; }\n .aspect-ratio--3x4-m { padding-bottom: 133.33%; }\n .aspect-ratio--6x4-m { padding-bottom: 66.6%; }\n .aspect-ratio--4x6-m { padding-bottom: 150%; }\n .aspect-ratio--8x5-m { padding-bottom: 62.5%; }\n .aspect-ratio--5x8-m { padding-bottom: 160%; }\n .aspect-ratio--7x5-m { padding-bottom: 71.42%; }\n .aspect-ratio--5x7-m { padding-bottom: 140%; }\n .aspect-ratio--1x1-m { padding-bottom: 100%; }\n .aspect-ratio--object-m {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 100;\n }\n}\n\n@media (--breakpoint-large){\n .aspect-ratio-l {\n height: 0;\n position: relative;\n }\n .aspect-ratio--16x9-l { padding-bottom: 56.25%; }\n .aspect-ratio--9x16-l { padding-bottom: 177.77%; }\n .aspect-ratio--4x3-l { padding-bottom: 75%; }\n .aspect-ratio--3x4-l { padding-bottom: 133.33%; }\n .aspect-ratio--6x4-l { padding-bottom: 66.6%; }\n .aspect-ratio--4x6-l { padding-bottom: 150%; }\n .aspect-ratio--8x5-l { padding-bottom: 62.5%; }\n .aspect-ratio--5x8-l { padding-bottom: 160%; }\n .aspect-ratio--7x5-l { padding-bottom: 71.42%; }\n .aspect-ratio--5x7-l { padding-bottom: 140%; }\n .aspect-ratio--1x1-l { padding-bottom: 100%; }\n .aspect-ratio--object-l {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 100;\n }\n}\n", + "readme": "\n\n# ASPECT RATIOS\n\nThis is for fluid media that is embedded from third party sites like youtube, vimeo etc.\nWrap the outer element in aspect-ratio and then extend it with the desired ratio.\nMake sure there are no height and width attributes on the embedded media.\n\nAdapted from: https://github.com/suitcss/components-flex-embed\n\n### Docs\n\nhttps://tachyons.io/docs/layout/aspect-ratios\n\n### Base\n\n- `aspect-ratio` = aspect ratio\n\n### Modifiers\n\n- `--16x9` = 16x9\n- `--9x16` = 9x16\n- `--4x3` = 4x3\n- `--3x4` = 3x4\n- `--6x4` = 6x4\n- `--4x6` = 4x6\n- `--8x5` = 8x5\n- `--5x8` = 5x8\n- `--7x5` = 7x5\n- `--5x7` = 5x7\n- `--1x1` = 1x1\n- `--object` = object\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n\n### Example\n\n```html\n
\n\n
\n```\n", + "src": "/*!!!\n\n# ASPECT RATIOS\n\nThis is for fluid media that is embedded from third party sites like youtube, vimeo etc.\nWrap the outer element in aspect-ratio and then extend it with the desired ratio.\nMake sure there are no height and width attributes on the embedded media.\n\nAdapted from: https://github.com/suitcss/components-flex-embed\n\n### Docs\n\nhttps://tachyons.io/docs/layout/aspect-ratios\n\n### Base\n\n- `aspect-ratio` = aspect ratio\n\n### Modifiers\n\n- `--16x9` = 16x9\n- `--9x16` = 9x16\n- `--4x3` = 4x3\n- `--3x4` = 3x4\n- `--6x4` = 6x4\n- `--4x6` = 4x6\n- `--8x5` = 8x5\n- `--5x8` = 5x8\n- `--7x5` = 7x5\n- `--5x7` = 5x7\n- `--1x1` = 1x1\n- `--object` = object\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n\n### Example\n\n```html\n
\n\n
\n```\n*/\n\n.aspect-ratio {\n height: 0;\n position: relative;\n}\n\n.aspect-ratio--16x9 { padding-bottom: 56.25%; }\n.aspect-ratio--9x16 { padding-bottom: 177.77%; }\n\n.aspect-ratio--4x3 { padding-bottom: 75%; }\n.aspect-ratio--3x4 { padding-bottom: 133.33%; }\n\n.aspect-ratio--6x4 { padding-bottom: 66.6%; }\n.aspect-ratio--4x6 { padding-bottom: 150%; }\n\n.aspect-ratio--8x5 { padding-bottom: 62.5%; }\n.aspect-ratio--5x8 { padding-bottom: 160%; }\n\n.aspect-ratio--7x5 { padding-bottom: 71.42%; }\n.aspect-ratio--5x7 { padding-bottom: 140%; }\n\n.aspect-ratio--1x1 { padding-bottom: 100%; }\n\n.aspect-ratio--object {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 100;\n}\n\n@media (--breakpoint-small) {\n .aspect-ratio-s {\n height: 0;\n position: relative;\n }\n .aspect-ratio--16x9-s { padding-bottom: 56.25%; }\n .aspect-ratio--9x16-s { padding-bottom: 177.77%; }\n .aspect-ratio--4x3-s { padding-bottom: 75%; }\n .aspect-ratio--3x4-s { padding-bottom: 133.33%; }\n .aspect-ratio--6x4-s { padding-bottom: 66.6%; }\n .aspect-ratio--4x6-s { padding-bottom: 150%; }\n .aspect-ratio--8x5-s { padding-bottom: 62.5%; }\n .aspect-ratio--5x8-s { padding-bottom: 160%; }\n .aspect-ratio--7x5-s { padding-bottom: 71.42%; }\n .aspect-ratio--5x7-s { padding-bottom: 140%; }\n .aspect-ratio--1x1-s { padding-bottom: 100%; }\n .aspect-ratio--object-s {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 100;\n }\n}\n\n@media (--breakpoint-medium) {\n .aspect-ratio-m {\n height: 0;\n position: relative;\n }\n .aspect-ratio--16x9-m { padding-bottom: 56.25%; }\n .aspect-ratio--9x16-m { padding-bottom: 177.77%; }\n .aspect-ratio--4x3-m { padding-bottom: 75%; }\n .aspect-ratio--3x4-m { padding-bottom: 133.33%; }\n .aspect-ratio--6x4-m { padding-bottom: 66.6%; }\n .aspect-ratio--4x6-m { padding-bottom: 150%; }\n .aspect-ratio--8x5-m { padding-bottom: 62.5%; }\n .aspect-ratio--5x8-m { padding-bottom: 160%; }\n .aspect-ratio--7x5-m { padding-bottom: 71.42%; }\n .aspect-ratio--5x7-m { padding-bottom: 140%; }\n .aspect-ratio--1x1-m { padding-bottom: 100%; }\n .aspect-ratio--object-m {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 100;\n }\n}\n\n@media (--breakpoint-large) {\n .aspect-ratio-l {\n height: 0;\n position: relative;\n }\n .aspect-ratio--16x9-l { padding-bottom: 56.25%; }\n .aspect-ratio--9x16-l { padding-bottom: 177.77%; }\n .aspect-ratio--4x3-l { padding-bottom: 75%; }\n .aspect-ratio--3x4-l { padding-bottom: 133.33%; }\n .aspect-ratio--6x4-l { padding-bottom: 66.6%; }\n .aspect-ratio--4x6-l { padding-bottom: 150%; }\n .aspect-ratio--8x5-l { padding-bottom: 62.5%; }\n .aspect-ratio--5x8-l { padding-bottom: 160%; }\n .aspect-ratio--7x5-l { padding-bottom: 71.42%; }\n .aspect-ratio--5x7-l { padding-bottom: 140%; }\n .aspect-ratio--1x1-l { padding-bottom: 100%; }\n .aspect-ratio--object-l {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 100;\n }\n}\n", "css": "/*\n\n ASPECT RATIOS\n\n*/\n/* This is for fluid media that is embedded from third party sites like youtube, vimeo etc.\n * Wrap the outer element in aspect-ratio and then extend it with the desired ratio i.e\n * Make sure there are no height and width attributes on the embedded media.\n * Adapted from: https://github.com/suitcss/components-flex-embed\n *\n * Example:\n *\n *
\n * \n *
\n *\n * */\n.aspect-ratio { height: 0; position: relative; }\n.aspect-ratio--16x9 { padding-bottom: 56.25%; }\n.aspect-ratio--9x16 { padding-bottom: 177.77%; }\n.aspect-ratio--4x3 { padding-bottom: 75%; }\n.aspect-ratio--3x4 { padding-bottom: 133.33%; }\n.aspect-ratio--6x4 { padding-bottom: 66.6%; }\n.aspect-ratio--4x6 { padding-bottom: 150%; }\n.aspect-ratio--8x5 { padding-bottom: 62.5%; }\n.aspect-ratio--5x8 { padding-bottom: 160%; }\n.aspect-ratio--7x5 { padding-bottom: 71.42%; }\n.aspect-ratio--5x7 { padding-bottom: 140%; }\n.aspect-ratio--1x1 { padding-bottom: 100%; }\n.aspect-ratio--object { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 100; }\n@media screen and (min-width: 30em) {\n .aspect-ratio-ns { height: 0; position: relative; }\n .aspect-ratio--16x9-ns { padding-bottom: 56.25%; }\n .aspect-ratio--9x16-ns { padding-bottom: 177.77%; }\n .aspect-ratio--4x3-ns { padding-bottom: 75%; }\n .aspect-ratio--3x4-ns { padding-bottom: 133.33%; }\n .aspect-ratio--6x4-ns { padding-bottom: 66.6%; }\n .aspect-ratio--4x6-ns { padding-bottom: 150%; }\n .aspect-ratio--8x5-ns { padding-bottom: 62.5%; }\n .aspect-ratio--5x8-ns { padding-bottom: 160%; }\n .aspect-ratio--7x5-ns { padding-bottom: 71.42%; }\n .aspect-ratio--5x7-ns { padding-bottom: 140%; }\n .aspect-ratio--1x1-ns { padding-bottom: 100%; }\n .aspect-ratio--object-ns { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 100; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .aspect-ratio-m { height: 0; position: relative; }\n .aspect-ratio--16x9-m { padding-bottom: 56.25%; }\n .aspect-ratio--9x16-m { padding-bottom: 177.77%; }\n .aspect-ratio--4x3-m { padding-bottom: 75%; }\n .aspect-ratio--3x4-m { padding-bottom: 133.33%; }\n .aspect-ratio--6x4-m { padding-bottom: 66.6%; }\n .aspect-ratio--4x6-m { padding-bottom: 150%; }\n .aspect-ratio--8x5-m { padding-bottom: 62.5%; }\n .aspect-ratio--5x8-m { padding-bottom: 160%; }\n .aspect-ratio--7x5-m { padding-bottom: 71.42%; }\n .aspect-ratio--5x7-m { padding-bottom: 140%; }\n .aspect-ratio--1x1-m { padding-bottom: 100%; }\n .aspect-ratio--object-m { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 100; }\n}\n@media screen and (min-width: 60em) {\n .aspect-ratio-l { height: 0; position: relative; }\n .aspect-ratio--16x9-l { padding-bottom: 56.25%; }\n .aspect-ratio--9x16-l { padding-bottom: 177.77%; }\n .aspect-ratio--4x3-l { padding-bottom: 75%; }\n .aspect-ratio--3x4-l { padding-bottom: 133.33%; }\n .aspect-ratio--6x4-l { padding-bottom: 66.6%; }\n .aspect-ratio--4x6-l { padding-bottom: 150%; }\n .aspect-ratio--8x5-l { padding-bottom: 62.5%; }\n .aspect-ratio--5x8-l { padding-bottom: 160%; }\n .aspect-ratio--7x5-l { padding-bottom: 71.42%; }\n .aspect-ratio--5x7-l { padding-bottom: 140%; }\n .aspect-ratio--1x1-l { padding-bottom: 100%; }\n .aspect-ratio--object-l { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 100; }\n}\n\n" }, "tachyons-background-position": { @@ -572,8 +572,8 @@ ] } ], - "readme": "# tachyons-background-position 1.0.0\n\nTachyons module for setting background position of images.\n\n#### Stats\n\n371 | 20 | 40\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-background-position\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-background-position\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-background-position.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-background-position\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n BACKGROUND POSITION\n\n Base:\n bg = background\n\n Modifiers:\n -center = center center\n -top = top center\n -right = center right\n -bottom = bottom center\n -left = center left\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n */\n.bg-center { background-repeat: no-repeat; background-position: center center; }\n.bg-top { background-repeat: no-repeat; background-position: top center; }\n.bg-right { background-repeat: no-repeat; background-position: center right; }\n.bg-bottom { background-repeat: no-repeat; background-position: bottom center; }\n.bg-left { background-repeat: no-repeat; background-position: center left; }\n@media screen and (min-width: 30em) {\n .bg-center-ns { background-repeat: no-repeat; background-position: center center; }\n .bg-top-ns { background-repeat: no-repeat; background-position: top center; }\n .bg-right-ns { background-repeat: no-repeat; background-position: center right; }\n .bg-bottom-ns { background-repeat: no-repeat; background-position: bottom center; }\n .bg-left-ns { background-repeat: no-repeat; background-position: center left; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .bg-center-m { background-repeat: no-repeat; background-position: center center; }\n .bg-top-m { background-repeat: no-repeat; background-position: top center; }\n .bg-right-m { background-repeat: no-repeat; background-position: center right; }\n .bg-bottom-m { background-repeat: no-repeat; background-position: bottom center; }\n .bg-left-m { background-repeat: no-repeat; background-position: center left; }\n}\n@media screen and (min-width: 60em) {\n .bg-center-l { background-repeat: no-repeat; background-position: center center; }\n .bg-top-l { background-repeat: no-repeat; background-position: top center; }\n .bg-right-l { background-repeat: no-repeat; background-position: center right; }\n .bg-bottom-l { background-repeat: no-repeat; background-position: bottom center; }\n .bg-left-l { background-repeat: no-repeat; background-position: center left; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n BACKGROUND POSITION\n\n Base:\n bg = background\n\n Modifiers:\n -center = center center\n -top = top center\n -right = center right\n -bottom = bottom center\n -left = center left\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n */\n\n.bg-center { \n background-repeat: no-repeat;\n background-position: center center; \n}\n\n.bg-top { \n background-repeat: no-repeat; \n background-position: top center; \n}\n\n.bg-right { \n background-repeat: no-repeat; \n background-position: center right; \n}\n\n.bg-bottom { \n background-repeat: no-repeat; \n background-position: bottom center; \n}\n\n.bg-left { \n background-repeat: no-repeat; \n background-position: center left; \n}\n\n@media (--breakpoint-not-small) {\n .bg-center-ns { \n background-repeat: no-repeat;\n background-position: center center; \n }\n\n .bg-top-ns { \n background-repeat: no-repeat; \n background-position: top center; \n }\n\n .bg-right-ns { \n background-repeat: no-repeat; \n background-position: center right; \n }\n\n .bg-bottom-ns { \n background-repeat: no-repeat; \n background-position: bottom center; \n }\n\n .bg-left-ns { \n background-repeat: no-repeat; \n background-position: center left; \n }\n}\n\n@media (--breakpoint-medium) {\n .bg-center-m { \n background-repeat: no-repeat;\n background-position: center center; \n }\n\n .bg-top-m { \n background-repeat: no-repeat; \n background-position: top center; \n }\n\n .bg-right-m { \n background-repeat: no-repeat; \n background-position: center right; \n }\n\n .bg-bottom-m { \n background-repeat: no-repeat; \n background-position: bottom center; \n }\n\n .bg-left-m { \n background-repeat: no-repeat; \n background-position: center left; \n }\n}\n\n@media (--breakpoint-large) {\n .bg-center-l { \n background-repeat: no-repeat;\n background-position: center center; \n }\n\n .bg-top-l { \n background-repeat: no-repeat; \n background-position: top center; \n }\n\n .bg-right-l { \n background-repeat: no-repeat; \n background-position: center right; \n }\n\n .bg-bottom-l { \n background-repeat: no-repeat; \n background-position: bottom center; \n }\n\n .bg-left-l { \n background-repeat: no-repeat; \n background-position: center left; \n }\n}\n", + "readme": "\n\n# BACKGROUND POSITION\n\n### Base\n\n- bg = background\n\n### Modifiers\n\n- `-center` = center center\n- `-top` = top center\n- `-right` = center right\n- `-bottom` = bottom center\n- `-left` = center left\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l`= large\n", + "src": "/*!!!\n\n# BACKGROUND POSITION\n\n### Base\n\n- bg = background\n\n### Modifiers\n\n- `-center` = center center\n- `-top` = top center\n- `-right` = center right\n- `-bottom` = bottom center\n- `-left` = center left\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l`= large\n*/\n\n.bg-center {\n background-repeat: no-repeat;\n background-position: center center;\n}\n\n.bg-top {\n background-repeat: no-repeat;\n background-position: top center;\n}\n\n.bg-right {\n background-repeat: no-repeat;\n background-position: center right;\n}\n\n.bg-bottom {\n background-repeat: no-repeat;\n background-position: bottom center;\n}\n\n.bg-left {\n background-repeat: no-repeat;\n background-position: center left;\n}\n\n@media (--breakpoint-small) {\n .bg-center-s {\n background-repeat: no-repeat;\n background-position: center center;\n }\n\n .bg-top-s {\n background-repeat: no-repeat;\n background-position: top center;\n }\n\n .bg-right-s {\n background-repeat: no-repeat;\n background-position: center right;\n }\n\n .bg-bottom-s {\n background-repeat: no-repeat;\n background-position: bottom center;\n }\n\n .bg-left-s {\n background-repeat: no-repeat;\n background-position: center left;\n }\n}\n\n@media (--breakpoint-medium) {\n .bg-center-m {\n background-repeat: no-repeat;\n background-position: center center;\n }\n\n .bg-top-m {\n background-repeat: no-repeat;\n background-position: top center;\n }\n\n .bg-right-m {\n background-repeat: no-repeat;\n background-position: center right;\n }\n\n .bg-bottom-m {\n background-repeat: no-repeat;\n background-position: bottom center;\n }\n\n .bg-left-m {\n background-repeat: no-repeat;\n background-position: center left;\n }\n}\n\n@media (--breakpoint-large) {\n .bg-center-l {\n background-repeat: no-repeat;\n background-position: center center;\n }\n\n .bg-top-l {\n background-repeat: no-repeat;\n background-position: top center;\n }\n\n .bg-right-l {\n background-repeat: no-repeat;\n background-position: center right;\n }\n\n .bg-bottom-l {\n background-repeat: no-repeat;\n background-position: bottom center;\n }\n\n .bg-left-l {\n background-repeat: no-repeat;\n background-position: center left;\n }\n}\n", "css": "/*\n\n BACKGROUND POSITION\n\n Base:\n bg = background\n\n Modifiers:\n -center = center center\n -top = top center\n -right = center right\n -bottom = bottom center\n -left = center left\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n */\n.bg-center { background-repeat: no-repeat; background-position: center center; }\n.bg-top { background-repeat: no-repeat; background-position: top center; }\n.bg-right { background-repeat: no-repeat; background-position: center right; }\n.bg-bottom { background-repeat: no-repeat; background-position: bottom center; }\n.bg-left { background-repeat: no-repeat; background-position: center left; }\n@media screen and (min-width: 30em) {\n .bg-center-ns { background-repeat: no-repeat; background-position: center center; }\n .bg-top-ns { background-repeat: no-repeat; background-position: top center; }\n .bg-right-ns { background-repeat: no-repeat; background-position: center right; }\n .bg-bottom-ns { background-repeat: no-repeat; background-position: bottom center; }\n .bg-left-ns { background-repeat: no-repeat; background-position: center left; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .bg-center-m { background-repeat: no-repeat; background-position: center center; }\n .bg-top-m { background-repeat: no-repeat; background-position: top center; }\n .bg-right-m { background-repeat: no-repeat; background-position: center right; }\n .bg-bottom-m { background-repeat: no-repeat; background-position: bottom center; }\n .bg-left-m { background-repeat: no-repeat; background-position: center left; }\n}\n@media screen and (min-width: 60em) {\n .bg-center-l { background-repeat: no-repeat; background-position: center center; }\n .bg-top-l { background-repeat: no-repeat; background-position: top center; }\n .bg-right-l { background-repeat: no-repeat; background-position: center right; }\n .bg-bottom-l { background-repeat: no-repeat; background-position: bottom center; }\n .bg-left-l { background-repeat: no-repeat; background-position: center left; }\n}\n\n" }, "tachyons-background-size": { @@ -638,8 +638,8 @@ ] } ], - "readme": "# tachyons-background-size 5.0.0\n\nBackground size CSS module for Tachyons\n\n#### Stats\n\n279 | 8 | 8\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-background-size\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-background-size\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-background-size.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-background-size\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\n/*\n\n BACKGROUND SIZE\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n/*\n Often used in combination with background image set as an inline style\n on an html element.\n*/\n.cover { background-size: cover; }\n.contain { background-size: contain; }\n@media screen and (min-width: 30em) {\n .cover-ns { background-size: cover; }\n .contain-ns { background-size: contain; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .cover-m { background-size: cover; }\n .contain-m { background-size: contain; }\n}\n@media screen and (min-width: 60em) {\n .cover-l { background-size: cover; }\n .contain-l { background-size: contain; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n BACKGROUND SIZE\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n\n/*\n Often used in combination with background image set as an inline style\n on an html element.\n*/\n\n .cover { background-size: cover; }\n .contain { background-size: contain; }\n\n@media (--breakpoint-not-small) {\n .cover-ns { background-size: cover; }\n .contain-ns { background-size: contain; }\n}\n\n@media (--breakpoint-medium) {\n .cover-m { background-size: cover; }\n .contain-m { background-size: contain; }\n}\n\n@media (--breakpoint-large) {\n .cover-l { background-size: cover; }\n .contain-l { background-size: contain; }\n}\n", + "readme": "\n\n# BACKGROUND SIZE\n\nOften used in combination with background image set as an inline style\non an html element.\n\n### Docs\n\nhttp://tachyons.io/docs/themes/background-size/\n\n### Base\n\n- cover = cover\n- contain = contain\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l`= large\n", + "src": "/*!!!\n\n# BACKGROUND SIZE\n\nOften used in combination with background image set as an inline style\non an html element.\n\n### Docs\n\nhttp://tachyons.io/docs/themes/background-size/\n\n### Base\n\n- cover = cover\n- contain = contain\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l`= large\n*/\n\n.cover { background-size: cover!important; }\n.contain { background-size: contain!important; }\n\n@media (--breakpoint-small) {\n .cover-s { background-size: cover!important; }\n .contain-s { background-size: contain!important; }\n}\n\n@media (--breakpoint-medium) {\n .cover-m { background-size: cover!important; }\n .contain-m { background-size: contain!important; }\n}\n\n@media (--breakpoint-large) {\n .cover-l { background-size: cover!important; }\n .contain-l { background-size: contain!important; }\n}\n", "css": "/*\n\n BACKGROUND SIZE\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n/*\n Often used in combination with background image set as an inline style\n on an html element.\n*/\n.cover { background-size: cover; }\n.contain { background-size: contain; }\n@media screen and (min-width: 30em) {\n .cover-ns { background-size: cover; }\n .contain-ns { background-size: contain; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .cover-m { background-size: cover; }\n .contain-m { background-size: contain; }\n}\n@media screen and (min-width: 60em) {\n .cover-l { background-size: cover; }\n .contain-l { background-size: contain; }\n}\n\n" }, "tachyons-border-colors": { @@ -1068,8 +1068,8 @@ ] } ], - "readme": "# tachyons-border-colors 4.2.0\n\nPerformance based css module.\n\n#### Stats\n\n868 | 60 | 60\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-border-colors\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-border-colors\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-border-colors.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-border-colors\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\n/*\n\n Tachyons\n COLOR VARIABLES\n\n Grayscale\n - Solids\n - Transparencies\n Colors\n\n*/\n/*\n\n BORDER COLORS\n Docs: http://tachyons.io/docs/themes/borders/\n\n Border colors can be used to extend the base\n border classes ba,bt,bb,br,bl found in the _borders.css file.\n\n The base border class by default will set the color of the border\n to that of the current text color. These classes are for the cases\n where you desire for the text and border colors to be different.\n\n Base:\n b = border\n\n Modifiers:\n --color-name = each color variable name is also a border color name\n\n*/\n.b--black { border-color: #000; }\n.b--near-black { border-color: #111; }\n.b--dark-gray { border-color: #333; }\n.b--mid-gray { border-color: #555; }\n.b--gray { border-color: #777; }\n.b--silver { border-color: #999; }\n.b--light-silver { border-color: #aaa; }\n.b--light-gray { border-color: #eee; }\n.b--near-white { border-color: #f4f4f4; }\n.b--white { border-color: #fff; }\n.b--white-90 { border-color: rgba( 255, 255, 255, .9 ); }\n.b--white-80 { border-color: rgba( 255, 255, 255, .8 ); }\n.b--white-70 { border-color: rgba( 255, 255, 255, .7 ); }\n.b--white-60 { border-color: rgba( 255, 255, 255, .6 ); }\n.b--white-50 { border-color: rgba( 255, 255, 255, .5 ); }\n.b--white-40 { border-color: rgba( 255, 255, 255, .4 ); }\n.b--white-30 { border-color: rgba( 255, 255, 255, .3 ); }\n.b--white-20 { border-color: rgba( 255, 255, 255, .2 ); }\n.b--white-10 { border-color: rgba( 255, 255, 255, .1 ); }\n.b--white-05 { border-color: rgba( 255, 255, 255, .05 ); }\n.b--white-025 { border-color: rgba( 255, 255, 255, .025 ); }\n.b--white-0125 { border-color: rgba( 255, 255, 255, .0125 ); }\n.b--black-90 { border-color: rgba( 0, 0, 0, .9 ); }\n.b--black-80 { border-color: rgba( 0, 0, 0, .8 ); }\n.b--black-70 { border-color: rgba( 0, 0, 0, .7 ); }\n.b--black-60 { border-color: rgba( 0, 0, 0, .6 ); }\n.b--black-50 { border-color: rgba( 0, 0, 0, .5 ); }\n.b--black-40 { border-color: rgba( 0, 0, 0, .4 ); }\n.b--black-30 { border-color: rgba( 0, 0, 0, .3 ); }\n.b--black-20 { border-color: rgba( 0, 0, 0, .2 ); }\n.b--black-10 { border-color: rgba( 0, 0, 0, .1 ); }\n.b--black-05 { border-color: rgba( 0, 0, 0, .05 ); }\n.b--black-025 { border-color: rgba( 0, 0, 0, .025 ); }\n.b--black-0125 { border-color: rgba( 0, 0, 0, .0125 ); }\n.b--dark-red { border-color: #e7040f; }\n.b--red { border-color: #ff4136; }\n.b--light-red { border-color: #ff725c; }\n.b--orange { border-color: #ff6300; }\n.b--gold { border-color: #ffb700; }\n.b--yellow { border-color: #ffd700; }\n.b--light-yellow { border-color: #fbf1a9; }\n.b--purple { border-color: #5e2ca5; }\n.b--light-purple { border-color: #a463f2; }\n.b--dark-pink { border-color: #d5008f; }\n.b--hot-pink { border-color: #ff41b4; }\n.b--pink { border-color: #ff80cc; }\n.b--light-pink { border-color: #ffa3d7; }\n.b--dark-green { border-color: #137752; }\n.b--green { border-color: #19a974; }\n.b--light-green { border-color: #9eebcf; }\n.b--navy { border-color: #001b44; }\n.b--dark-blue { border-color: #00449e; }\n.b--blue { border-color: #357edd; }\n.b--light-blue { border-color: #96ccff; }\n.b--lightest-blue { border-color: #cdecff; }\n.b--washed-blue { border-color: #f6fffe; }\n.b--washed-green { border-color: #e8fdf5; }\n.b--washed-yellow { border-color: #fffceb; }\n.b--washed-red { border-color: #ffdfdf; }\n.b--transparent { border-color: transparent; }\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "/*\n\n Tachyons\n COLOR VARIABLES\n\n Grayscale\n - Solids\n - Transparencies\n Colors\n\n*/\n\n:root {\n --black: #000;\n --near-black: #111;\n --dark-gray:#333;\n --mid-gray:#555;\n --gray: #777;\n --silver: #999;\n --light-silver: #aaa;\n --moon-gray: #ccc;\n --light-gray: #eee;\n --near-white: #f4f4f4;\n --white: #fff;\n\n --transparent:transparent;\n\n --black-90: rgba(0,0,0,.9);\n --black-80: rgba(0,0,0,.8);\n --black-70: rgba(0,0,0,.7);\n --black-60: rgba(0,0,0,.6);\n --black-50: rgba(0,0,0,.5);\n --black-40: rgba(0,0,0,.4);\n --black-30: rgba(0,0,0,.3);\n --black-20: rgba(0,0,0,.2);\n --black-10: rgba(0,0,0,.1);\n --black-05: rgba(0,0,0,.05);\n --black-025: rgba(0,0,0,.025);\n --black-0125: rgba(0,0,0,.0125);\n\n --white-90: rgba(255,255,255,.9);\n --white-80: rgba(255,255,255,.8);\n --white-70: rgba(255,255,255,.7);\n --white-60: rgba(255,255,255,.6);\n --white-50: rgba(255,255,255,.5);\n --white-40: rgba(255,255,255,.4);\n --white-30: rgba(255,255,255,.3);\n --white-20: rgba(255,255,255,.2);\n --white-10: rgba(255,255,255,.1);\n --white-05: rgba(255,255,255,.05);\n --white-025: rgba(255,255,255,.025);\n --white-0125: rgba(255,255,255,.0125);\n\n --dark-red: #e7040f;\n --red: #ff4136;\n --light-red: #ff725c;\n --orange: #ff6300;\n --gold: #ffb700;\n --yellow: #ffd700;\n --light-yellow: #fbf1a9;\n --purple: #5e2ca5;\n --light-purple: #a463f2;\n --dark-pink: #d5008f;\n --hot-pink: #ff41b4;\n --pink: #ff80cc;\n --light-pink: #ffa3d7;\n --dark-green: #137752;\n --green: #19a974;\n --light-green: #9eebcf;\n --navy: #001b44;\n --dark-blue: #00449e;\n --blue: #357edd;\n --light-blue: #96ccff;\n --lightest-blue: #cdecff;\n --washed-blue: #f6fffe;\n --washed-green: #e8fdf5;\n --washed-yellow: #fffceb;\n --washed-red: #ffdfdf;\n}\n\n\n/*\n\n BORDER COLORS\n Docs: http://tachyons.io/docs/themes/borders/\n\n Border colors can be used to extend the base\n border classes ba,bt,bb,br,bl found in the _borders.css file.\n\n The base border class by default will set the color of the border\n to that of the current text color. These classes are for the cases\n where you desire for the text and border colors to be different.\n\n Base:\n b = border\n\n Modifiers:\n --color-name = each color variable name is also a border color name\n\n*/\n\n.b--black { border-color: var(--black); }\n.b--near-black { border-color: var(--near-black); }\n.b--dark-gray { border-color: var(--dark-gray); }\n.b--mid-gray { border-color: var(--mid-gray); }\n.b--gray { border-color: var(--gray); }\n.b--silver { border-color: var(--silver); }\n.b--light-silver { border-color: var(--light-silver); }\n.b--light-gray { border-color: var(--light-gray); }\n.b--near-white { border-color: var(--near-white); }\n.b--white { border-color: var(--white); }\n\n.b--white-90 { border-color: var(--white-90); }\n.b--white-80 { border-color: var(--white-80); }\n.b--white-70 { border-color: var(--white-70); }\n.b--white-60 { border-color: var(--white-60); }\n.b--white-50 { border-color: var(--white-50); }\n.b--white-40 { border-color: var(--white-40); }\n.b--white-30 { border-color: var(--white-30); }\n.b--white-20 { border-color: var(--white-20); }\n.b--white-10 { border-color: var(--white-10); }\n.b--white-05 { border-color: var(--white-05); }\n.b--white-025 { border-color: var(--white-025); }\n.b--white-0125 { border-color: var(--white-0125); }\n\n.b--black-90 { border-color: var(--black-90); }\n.b--black-80 { border-color: var(--black-80); }\n.b--black-70 { border-color: var(--black-70); }\n.b--black-60 { border-color: var(--black-60); }\n.b--black-50 { border-color: var(--black-50); }\n.b--black-40 { border-color: var(--black-40); }\n.b--black-30 { border-color: var(--black-30); }\n.b--black-20 { border-color: var(--black-20); }\n.b--black-10 { border-color: var(--black-10); }\n.b--black-05 { border-color: var(--black-05); }\n.b--black-025 { border-color: var(--black-025); }\n.b--black-0125 { border-color: var(--black-0125); }\n\n.b--dark-red { border-color: var(--dark-red); }\n.b--red { border-color: var(--red); }\n.b--light-red { border-color: var(--light-red); }\n.b--orange { border-color: var(--orange); }\n.b--gold { border-color: var(--gold); }\n.b--yellow { border-color: var(--yellow); }\n.b--light-yellow { border-color: var(--light-yellow); }\n.b--purple { border-color: var(--purple); }\n.b--light-purple { border-color: var(--light-purple); }\n.b--dark-pink { border-color: var(--dark-pink); }\n.b--hot-pink { border-color: var(--hot-pink); }\n.b--pink { border-color: var(--pink); }\n.b--light-pink { border-color: var(--light-pink); }\n.b--dark-green { border-color: var(--dark-green); }\n.b--green { border-color: var(--green); }\n.b--light-green { border-color: var(--light-green); }\n.b--navy { border-color: var(--navy); }\n.b--dark-blue { border-color: var(--dark-blue); }\n.b--blue { border-color: var(--blue); }\n.b--light-blue { border-color: var(--light-blue); }\n.b--lightest-blue { border-color: var(--lightest-blue); }\n.b--washed-blue { border-color: var(--washed-blue); }\n.b--washed-green { border-color: var(--washed-green); }\n.b--washed-yellow { border-color: var(--washed-yellow); }\n.b--washed-red { border-color: var(--washed-red); }\n\n.b--transparent { border-color: var(--transparent); }\n", + "readme": "\n\n# BORDER COLORS\n\nBorder colors can be used to extend the base border classes ba,bt,bb,br,bl found in the _borders.css file.\n\nThe base border class by default will set the color of the border\nto that of the current text color. These classes are for the cases\nwhere you desire for the text and border colors to be different.\n\n### Docs\n\nhttp://tachyons.io/docs/themes/borders/\n\n### Base\n\n- b = border\n\n### Modifiers\n\n- `--color-name` = black, white and their alpha colors are available\n", + "src": "/*!!!\n\n# BORDER COLORS\n\nBorder colors can be used to extend the base border classes ba,bt,bb,br,bl found in the _borders.css file.\n\nThe base border class by default will set the color of the border\nto that of the current text color. These classes are for the cases\nwhere you desire for the text and border colors to be different.\n\n### Docs\n\nhttp://tachyons.io/docs/themes/borders/\n\n### Base\n\n- b = border\n\n### Modifiers\n\n- `--color-name` = black, white and their alpha colors are available\n*/\n\n.b--black { border-color: var(--black); }\n.b--white { border-color: var(--white); }\n\n.b--white-90 { border-color: var(--white-90); }\n.b--white-80 { border-color: var(--white-80); }\n.b--white-70 { border-color: var(--white-70); }\n.b--white-60 { border-color: var(--white-60); }\n.b--white-50 { border-color: var(--white-50); }\n.b--white-40 { border-color: var(--white-40); }\n.b--white-30 { border-color: var(--white-30); }\n.b--white-20 { border-color: var(--white-20); }\n.b--white-10 { border-color: var(--white-10); }\n.b--white-05 { border-color: var(--white-05); }\n.b--white-025 { border-color: var(--white-025); }\n.b--white-0125 { border-color: var(--white-0125); }\n\n.b--black-90 { border-color: var(--black-90); }\n.b--black-80 { border-color: var(--black-80); }\n.b--black-70 { border-color: var(--black-70); }\n.b--black-60 { border-color: var(--black-60); }\n.b--black-50 { border-color: var(--black-50); }\n.b--black-40 { border-color: var(--black-40); }\n.b--black-30 { border-color: var(--black-30); }\n.b--black-20 { border-color: var(--black-20); }\n.b--black-10 { border-color: var(--black-10); }\n.b--black-05 { border-color: var(--black-05); }\n.b--black-025 { border-color: var(--black-025); }\n.b--black-0125 { border-color: var(--black-0125); }\n\n.b--transparent { border-color: var(--transparent); }\n.b--inherit { border-color: inherit; }\n", "css": "/*\n\n Tachyons\n COLOR VARIABLES\n\n Grayscale\n - Solids\n - Transparencies\n Colors\n\n*/\n/*\n\n BORDER COLORS\n Docs: http://tachyons.io/docs/themes/borders/\n\n Border colors can be used to extend the base\n border classes ba,bt,bb,br,bl found in the _borders.css file.\n\n The base border class by default will set the color of the border\n to that of the current text color. These classes are for the cases\n where you desire for the text and border colors to be different.\n\n Base:\n b = border\n\n Modifiers:\n --color-name = each color variable name is also a border color name\n\n*/\n.b--black { border-color: #000; }\n.b--near-black { border-color: #111; }\n.b--dark-gray { border-color: #333; }\n.b--mid-gray { border-color: #555; }\n.b--gray { border-color: #777; }\n.b--silver { border-color: #999; }\n.b--light-silver { border-color: #aaa; }\n.b--light-gray { border-color: #eee; }\n.b--near-white { border-color: #f4f4f4; }\n.b--white { border-color: #fff; }\n.b--white-90 { border-color: rgba( 255, 255, 255, .9 ); }\n.b--white-80 { border-color: rgba( 255, 255, 255, .8 ); }\n.b--white-70 { border-color: rgba( 255, 255, 255, .7 ); }\n.b--white-60 { border-color: rgba( 255, 255, 255, .6 ); }\n.b--white-50 { border-color: rgba( 255, 255, 255, .5 ); }\n.b--white-40 { border-color: rgba( 255, 255, 255, .4 ); }\n.b--white-30 { border-color: rgba( 255, 255, 255, .3 ); }\n.b--white-20 { border-color: rgba( 255, 255, 255, .2 ); }\n.b--white-10 { border-color: rgba( 255, 255, 255, .1 ); }\n.b--white-05 { border-color: rgba( 255, 255, 255, .05 ); }\n.b--white-025 { border-color: rgba( 255, 255, 255, .025 ); }\n.b--white-0125 { border-color: rgba( 255, 255, 255, .0125 ); }\n.b--black-90 { border-color: rgba( 0, 0, 0, .9 ); }\n.b--black-80 { border-color: rgba( 0, 0, 0, .8 ); }\n.b--black-70 { border-color: rgba( 0, 0, 0, .7 ); }\n.b--black-60 { border-color: rgba( 0, 0, 0, .6 ); }\n.b--black-50 { border-color: rgba( 0, 0, 0, .5 ); }\n.b--black-40 { border-color: rgba( 0, 0, 0, .4 ); }\n.b--black-30 { border-color: rgba( 0, 0, 0, .3 ); }\n.b--black-20 { border-color: rgba( 0, 0, 0, .2 ); }\n.b--black-10 { border-color: rgba( 0, 0, 0, .1 ); }\n.b--black-05 { border-color: rgba( 0, 0, 0, .05 ); }\n.b--black-025 { border-color: rgba( 0, 0, 0, .025 ); }\n.b--black-0125 { border-color: rgba( 0, 0, 0, .0125 ); }\n.b--dark-red { border-color: #e7040f; }\n.b--red { border-color: #ff4136; }\n.b--light-red { border-color: #ff725c; }\n.b--orange { border-color: #ff6300; }\n.b--gold { border-color: #ffb700; }\n.b--yellow { border-color: #ffd700; }\n.b--light-yellow { border-color: #fbf1a9; }\n.b--purple { border-color: #5e2ca5; }\n.b--light-purple { border-color: #a463f2; }\n.b--dark-pink { border-color: #d5008f; }\n.b--hot-pink { border-color: #ff41b4; }\n.b--pink { border-color: #ff80cc; }\n.b--light-pink { border-color: #ffa3d7; }\n.b--dark-green { border-color: #137752; }\n.b--green { border-color: #19a974; }\n.b--light-green { border-color: #9eebcf; }\n.b--navy { border-color: #001b44; }\n.b--dark-blue { border-color: #00449e; }\n.b--blue { border-color: #357edd; }\n.b--light-blue { border-color: #96ccff; }\n.b--lightest-blue { border-color: #cdecff; }\n.b--washed-blue { border-color: #f6fffe; }\n.b--washed-green { border-color: #e8fdf5; }\n.b--washed-yellow { border-color: #fffceb; }\n.b--washed-red { border-color: #ffdfdf; }\n.b--transparent { border-color: transparent; }\n\n" }, "tachyons-border-radius": { @@ -1402,8 +1402,8 @@ ] } ], - "readme": "# tachyons-border-radius 5.0.1\n\nBorder radius CSS module for Tachyons\n\n#### Stats\n\n498 | 44 | 60\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-border-radius\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-border-radius\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-border-radius.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-border-radius\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\n/*\n\n BORDER RADIUS\n\n Base:\n br = border-radius\n\n Modifiers:\n 0 = 0/none\n 1 = 1st step in scale\n 2 = 2nd step in scale\n 3 = 3rd step in scale\n 4 = 4th step in scale\n -100 = 100%\n -pill = 9999px\n\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n.br0 { border-radius: 0; }\n.br1 { border-radius: .125rem; }\n.br2 { border-radius: .25rem; }\n.br3 { border-radius: .5rem; }\n.br4 { border-radius: 1rem; }\n.br-100 { border-radius: 100%; }\n.br-pill { border-radius: 9999px; }\n.br--bottom { border-top-left-radius: 0; border-top-right-radius: 0; }\n.br--top { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }\n.br--right { border-top-left-radius: 0; border-bottom-left-radius: 0; }\n.br--left { border-top-right-radius: 0; border-bottom-right-radius: 0; }\n@media screen and (min-width: 30em) {\n .br0-ns { border-radius: 0; }\n .br1-ns { border-radius: .125rem; }\n .br2-ns { border-radius: .25rem; }\n .br3-ns { border-radius: .5rem; }\n .br4-ns { border-radius: 1rem; }\n .br-100-ns { border-radius: 100%; }\n .br-pill-ns { border-radius: 9999px; }\n .br--bottom-ns { border-top-left-radius: 0; border-top-right-radius: 0; }\n .br--top-ns { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }\n .br--right-ns { border-top-left-radius: 0; border-bottom-left-radius: 0; }\n .br--left-ns { border-top-right-radius: 0; border-bottom-right-radius: 0; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .br0-m { border-radius: 0; }\n .br1-m { border-radius: .125rem; }\n .br2-m { border-radius: .25rem; }\n .br3-m { border-radius: .5rem; }\n .br4-m { border-radius: 1rem; }\n .br-100-m { border-radius: 100%; }\n .br-pill-m { border-radius: 9999px; }\n .br--bottom-m { border-top-left-radius: 0; border-top-right-radius: 0; }\n .br--top-m { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }\n .br--right-m { border-top-left-radius: 0; border-bottom-left-radius: 0; }\n .br--left-m { border-top-right-radius: 0; border-bottom-right-radius: 0; }\n}\n@media screen and (min-width: 60em) {\n .br0-l { border-radius: 0; }\n .br1-l { border-radius: .125rem; }\n .br2-l { border-radius: .25rem; }\n .br3-l { border-radius: .5rem; }\n .br4-l { border-radius: 1rem; }\n .br-100-l { border-radius: 100%; }\n .br-pill-l { border-radius: 9999px; }\n .br--bottom-l { border-top-left-radius: 0; border-top-right-radius: 0; }\n .br--top-l { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }\n .br--right-l { border-top-left-radius: 0; border-bottom-left-radius: 0; }\n .br--left-l { border-top-right-radius: 0; border-bottom-right-radius: 0; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n BORDER RADIUS\n\n Base:\n br = border-radius\n\n Modifiers:\n 0 = 0/none\n 1 = 1st step in scale\n 2 = 2nd step in scale\n 3 = 3rd step in scale\n 4 = 4th step in scale\n -100 = 100%\n -pill = 9999px\n\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n\n .br0 { border-radius: 0; }\n .br1 { border-radius: .125rem; }\n .br2 { border-radius: .25rem; }\n .br3 { border-radius: .5rem; }\n .br4 { border-radius: 1rem; }\n .br-100 { border-radius: 100%; }\n .br-pill { border-radius: 9999px; }\n .br--bottom {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n .br--top {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n .br--right {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n .br--left {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n@media (--breakpoint-not-small) {\n .br0-ns { border-radius: 0; }\n .br1-ns { border-radius: .125rem; }\n .br2-ns { border-radius: .25rem; }\n .br3-ns { border-radius: .5rem; }\n .br4-ns { border-radius: 1rem; }\n .br-100-ns { border-radius: 100%; }\n .br-pill-ns { border-radius: 9999px; }\n .br--bottom-ns {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n .br--top-ns {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n .br--right-ns {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n .br--left-ns {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n}\n\n@media (--breakpoint-medium) {\n .br0-m { border-radius: 0; }\n .br1-m { border-radius: .125rem; }\n .br2-m { border-radius: .25rem; }\n .br3-m { border-radius: .5rem; }\n .br4-m { border-radius: 1rem; }\n .br-100-m { border-radius: 100%; }\n .br-pill-m { border-radius: 9999px; }\n .br--bottom-m {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n .br--top-m {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n .br--right-m {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n .br--left-m {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n}\n\n@media (--breakpoint-large) {\n .br0-l { border-radius: 0; }\n .br1-l { border-radius: .125rem; }\n .br2-l { border-radius: .25rem; }\n .br3-l { border-radius: .5rem; }\n .br4-l { border-radius: 1rem; }\n .br-100-l { border-radius: 100%; }\n .br-pill-l { border-radius: 9999px; }\n\n .br--bottom-l {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n .br--top-l {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n .br--right-l {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n .br--left-l {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n}\n", + "readme": "\n\n# BORDER RADIUS\n\n### Docs\n\nhttp://tachyons.io/docs/themes/border-radius/\n\n### Base\n\n- br = border-radius\n\n### Modifiers\n\n- 0 = 0/none\n- 1 = 1st step in scale\n- 2 = 2nd step in scale\n- 3 = 3rd step in scale\n- 4 = 4th step in scale\n\n### Literal values\n\n- `-100` = 100%\n- `-pill` = 9999px\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# BORDER RADIUS\n\n### Docs\n\nhttp://tachyons.io/docs/themes/border-radius/\n\n### Base\n\n- br = border-radius\n\n### Modifiers\n\n- 0 = 0/none\n- 1 = 1st step in scale\n- 2 = 2nd step in scale\n- 3 = 3rd step in scale\n- 4 = 4th step in scale\n\n### Literal values\n\n- `-100` = 100%\n- `-pill` = 9999px\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n.br0 { border-radius: 0; }\n.br1 { border-radius: 3px; }\n.br2 { border-radius: 5px; }\n.br3 { border-radius: 9px; }\n.br4 { border-radius: 17px; }\n.br-100 { border-radius: 100%; }\n.br-pill { border-radius: 9999px; }\n.br--bottom {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n}\n.br--top {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n}\n.br--right {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}\n.br--left {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n\n@media (--breakpoint-small) {\n .br0-s { border-radius: 0; }\n .br1-s { border-radius: 3px; }\n .br2-s { border-radius: 5px; }\n .br3-s { border-radius: 9px; }\n .br4-s { border-radius: 17px; }\n .br-100-s { border-radius: 100%; }\n .br-pill-s { border-radius: 9999px; }\n .br--bottom-s {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n .br--top-s {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n .br--right-s {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n .br--left-s {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n}\n\n@media (--breakpoint-medium) {\n .br0-m { border-radius: 0; }\n .br1-m { border-radius: 3px; }\n .br2-m { border-radius: 5px; }\n .br3-m { border-radius: 9px; }\n .br4-m { border-radius: 17px; }\n .br-100-m { border-radius: 100%; }\n .br-pill-m { border-radius: 9999px; }\n .br--bottom-m {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n .br--top-m {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n .br--right-m {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n .br--left-m {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n}\n\n@media (--breakpoint-large) {\n .br0-l { border-radius: 0; }\n .br1-l { border-radius: 3px; }\n .br2-l { border-radius: 5px; }\n .br3-l { border-radius: 9px; }\n .br4-l { border-radius: 17px; }\n .br-100-l { border-radius: 100%; }\n .br-pill-l { border-radius: 9999px; }\n .br--bottom-l {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n .br--top-l {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n }\n .br--right-l {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n .br--left-l {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n}\n", "css": "/*\n\n BORDER RADIUS\n\n Base:\n br = border-radius\n\n Modifiers:\n 0 = 0/none\n 1 = 1st step in scale\n 2 = 2nd step in scale\n 3 = 3rd step in scale\n 4 = 4th step in scale\n -100 = 100%\n -pill = 9999px\n\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n.br0 { border-radius: 0; }\n.br1 { border-radius: .125rem; }\n.br2 { border-radius: .25rem; }\n.br3 { border-radius: .5rem; }\n.br4 { border-radius: 1rem; }\n.br-100 { border-radius: 100%; }\n.br-pill { border-radius: 9999px; }\n.br--bottom { border-top-left-radius: 0; border-top-right-radius: 0; }\n.br--top { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }\n.br--right { border-top-left-radius: 0; border-bottom-left-radius: 0; }\n.br--left { border-top-right-radius: 0; border-bottom-right-radius: 0; }\n@media screen and (min-width: 30em) {\n .br0-ns { border-radius: 0; }\n .br1-ns { border-radius: .125rem; }\n .br2-ns { border-radius: .25rem; }\n .br3-ns { border-radius: .5rem; }\n .br4-ns { border-radius: 1rem; }\n .br-100-ns { border-radius: 100%; }\n .br-pill-ns { border-radius: 9999px; }\n .br--bottom-ns { border-top-left-radius: 0; border-top-right-radius: 0; }\n .br--top-ns { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }\n .br--right-ns { border-top-left-radius: 0; border-bottom-left-radius: 0; }\n .br--left-ns { border-top-right-radius: 0; border-bottom-right-radius: 0; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .br0-m { border-radius: 0; }\n .br1-m { border-radius: .125rem; }\n .br2-m { border-radius: .25rem; }\n .br3-m { border-radius: .5rem; }\n .br4-m { border-radius: 1rem; }\n .br-100-m { border-radius: 100%; }\n .br-pill-m { border-radius: 9999px; }\n .br--bottom-m { border-top-left-radius: 0; border-top-right-radius: 0; }\n .br--top-m { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }\n .br--right-m { border-top-left-radius: 0; border-bottom-left-radius: 0; }\n .br--left-m { border-top-right-radius: 0; border-bottom-right-radius: 0; }\n}\n@media screen and (min-width: 60em) {\n .br0-l { border-radius: 0; }\n .br1-l { border-radius: .125rem; }\n .br2-l { border-radius: .25rem; }\n .br3-l { border-radius: .5rem; }\n .br4-l { border-radius: 1rem; }\n .br-100-l { border-radius: 100%; }\n .br-pill-l { border-radius: 9999px; }\n .br--bottom-l { border-top-left-radius: 0; border-top-right-radius: 0; }\n .br--top-l { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }\n .br--right-l { border-top-left-radius: 0; border-bottom-left-radius: 0; }\n .br--left-l { border-top-right-radius: 0; border-bottom-right-radius: 0; }\n}\n\n" }, "tachyons-border-style": { @@ -1524,8 +1524,8 @@ ] } ], - "readme": "# tachyons-border-style 4.0.0\n\nBorder style CSS module for Tachyons\n\n#### Stats\n\n297 | 16 | 16\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-border-style\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-border-style\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-border-style.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-border-style\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\n/*\n\n BORDER STYLES\n\n Base:\n bs = border-style\n\n Modifiers:\n none = none\n dotted = dotted\n dashed = dashed\n solid = solid\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n */\n.b--dotted { border-style: dotted; }\n.b--dashed { border-style: dashed; }\n.b--solid { border-style: solid; }\n.b--none { border-style: none; }\n@media screen and (min-width: 30em) {\n .b--dotted-ns { border-style: dotted; }\n .b--dashed-ns { border-style: dashed; }\n .b--solid-ns { border-style: solid; }\n .b--none-ns { border-style: none; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .b--dotted-m { border-style: dotted; }\n .b--dashed-m { border-style: dashed; }\n .b--solid-m { border-style: solid; }\n .b--none-m { border-style: none; }\n}\n@media screen and (min-width: 60em) {\n .b--dotted-l { border-style: dotted; }\n .b--dashed-l { border-style: dashed; }\n .b--solid-l { border-style: solid; }\n .b--none-l { border-style: none; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n BORDER STYLES\n\n Base:\n bs = border-style\n\n Modifiers:\n none = none\n dotted = dotted\n dashed = dashed\n solid = solid\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n */\n\n.b--dotted { border-style: dotted; }\n.b--dashed { border-style: dashed; }\n.b--solid { border-style: solid; }\n.b--none { border-style: none; }\n\n@media (--breakpoint-not-small) {\n .b--dotted-ns { border-style: dotted; }\n .b--dashed-ns { border-style: dashed; }\n .b--solid-ns { border-style: solid; }\n .b--none-ns { border-style: none; }\n}\n\n@media (--breakpoint-medium) {\n .b--dotted-m { border-style: dotted; }\n .b--dashed-m { border-style: dashed; }\n .b--solid-m { border-style: solid; }\n .b--none-m { border-style: none; }\n}\n\n@media (--breakpoint-large) {\n .b--dotted-l { border-style: dotted; }\n .b--dashed-l { border-style: dashed; }\n .b--solid-l { border-style: solid; }\n .b--none-l { border-style: none; }\n}\n", + "readme": "\n\n# BORDER STYLES\n\nDepends on base border module in `_borders.css`\n\n### Docs\n\nhttp://tachyons.io/docs/themes/borders/\n\n### Base\n\n- b = border-style\n\n### Modifiers\n\n- `--none` = none\n- `--dotted` = dotted\n- `--dashed` = dashed\n- `--solid` = solid\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n ", + "src": "/*!!!\n\n# BORDER STYLES\n\nDepends on base border module in `_borders.css`\n\n### Docs\n\nhttp://tachyons.io/docs/themes/borders/\n\n### Base\n\n- b = border-style\n\n### Modifiers\n\n- `--none` = none\n- `--dotted` = dotted\n- `--dashed` = dashed\n- `--solid` = solid\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n */\n\n.b--dotted { border-style: dotted; }\n.b--dashed { border-style: dashed; }\n.b--solid { border-style: solid; }\n.b--none { border-style: none; }\n\n@media (--breakpoint-small) {\n .b--dotted-s { border-style: dotted; }\n .b--dashed-s { border-style: dashed; }\n .b--solid-s { border-style: solid; }\n .b--none-s { border-style: none; }\n}\n\n@media (--breakpoint-medium) {\n .b--dotted-m { border-style: dotted; }\n .b--dashed-m { border-style: dashed; }\n .b--solid-m { border-style: solid; }\n .b--none-m { border-style: none; }\n}\n\n@media (--breakpoint-large) {\n .b--dotted-l { border-style: dotted; }\n .b--dashed-l { border-style: dashed; }\n .b--solid-l { border-style: solid; }\n .b--none-l { border-style: none; }\n}\n", "css": "/*\n\n BORDER STYLES\n\n Base:\n bs = border-style\n\n Modifiers:\n none = none\n dotted = dotted\n dashed = dashed\n solid = solid\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n */\n.b--dotted { border-style: dotted; }\n.b--dashed { border-style: dashed; }\n.b--solid { border-style: solid; }\n.b--none { border-style: none; }\n@media screen and (min-width: 30em) {\n .b--dotted-ns { border-style: dotted; }\n .b--dashed-ns { border-style: dashed; }\n .b--solid-ns { border-style: solid; }\n .b--none-ns { border-style: none; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .b--dotted-m { border-style: dotted; }\n .b--dashed-m { border-style: dashed; }\n .b--solid-m { border-style: solid; }\n .b--none-m { border-style: none; }\n}\n@media screen and (min-width: 60em) {\n .b--dotted-l { border-style: dotted; }\n .b--dashed-l { border-style: dashed; }\n .b--solid-l { border-style: solid; }\n .b--none-l { border-style: none; }\n}\n\n" }, "tachyons-border-widths": { @@ -1814,8 +1814,8 @@ ] } ], - "readme": "# tachyons-border-widths 3.0.0\n\nBorder width CSS module for Tachyons\n\n#### Stats\n\n424 | 40 | 40\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-border-widths\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-border-widths\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-border-widths.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-border-widths\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\n/*\n\n BORDER WIDTHS\n\n Base:\n bw = border-width\n\n Modifiers:\n 0 = 0 width border\n 1 = 1st step in border-width scale\n 2 = 2nd step in border-width scale\n 3 = 3rd step in border-width scale\n 4 = 4th step in border-width scale\n 5 = 5th step in border-width scale\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n.bw0 { border-width: 0; }\n.bw1 { border-width: .125rem; }\n.bw2 { border-width: .25rem; }\n.bw3 { border-width: .5rem; }\n.bw4 { border-width: 1rem; }\n.bw5 { border-width: 2rem; }\n.bt-0 { border-top-width: 0; }\n.br-0 { border-right-width: 0; }\n.bb-0 { border-bottom-width: 0; }\n.bl-0 { border-left-width: 0; }\n@media screen and (min-width: 30em) {\n .bw0-ns { border-width: 0; }\n .bw1-ns { border-width: .125rem; }\n .bw2-ns { border-width: .25rem; }\n .bw3-ns { border-width: .5rem; }\n .bw4-ns { border-width: 1rem; }\n .bw5-ns { border-width: 2rem; }\n .bt-0-ns { border-top-width: 0; }\n .br-0-ns { border-right-width: 0; }\n .bb-0-ns { border-bottom-width: 0; }\n .bl-0-ns { border-left-width: 0; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .bw0-m { border-width: 0; }\n .bw1-m { border-width: .125rem; }\n .bw2-m { border-width: .25rem; }\n .bw3-m { border-width: .5rem; }\n .bw4-m { border-width: 1rem; }\n .bw5-m { border-width: 2rem; }\n .bt-0-m { border-top-width: 0; }\n .br-0-m { border-right-width: 0; }\n .bb-0-m { border-bottom-width: 0; }\n .bl-0-m { border-left-width: 0; }\n}\n@media screen and (min-width: 60em) {\n .bw0-l { border-width: 0; }\n .bw1-l { border-width: .125rem; }\n .bw2-l { border-width: .25rem; }\n .bw3-l { border-width: .5rem; }\n .bw4-l { border-width: 1rem; }\n .bw5-l { border-width: 2rem; }\n .bt-0-l { border-top-width: 0; }\n .br-0-l { border-right-width: 0; }\n .bb-0-l { border-bottom-width: 0; }\n .bl-0-l { border-left-width: 0; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n BORDER WIDTHS\n\n Base:\n bw = border-width\n\n Modifiers:\n 0 = 0 width border\n 1 = 1st step in border-width scale\n 2 = 2nd step in border-width scale\n 3 = 3rd step in border-width scale\n 4 = 4th step in border-width scale\n 5 = 5th step in border-width scale\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n\n.bw0 { border-width: 0; }\n.bw1 { border-width: .125rem; }\n.bw2 { border-width: .25rem; }\n.bw3 { border-width: .5rem; }\n.bw4 { border-width: 1rem; }\n.bw5 { border-width: 2rem; }\n\n.bt-0 { border-top-width: 0; }\n.br-0 { border-right-width: 0; }\n.bb-0 { border-bottom-width: 0; }\n.bl-0 { border-left-width: 0; }\n\n@media (--breakpoint-not-small) {\n .bw0-ns { border-width: 0; }\n .bw1-ns { border-width: .125rem; }\n .bw2-ns { border-width: .25rem; }\n .bw3-ns { border-width: .5rem; }\n .bw4-ns { border-width: 1rem; }\n .bw5-ns { border-width: 2rem; }\n .bt-0-ns { border-top-width: 0; }\n .br-0-ns { border-right-width: 0; }\n .bb-0-ns { border-bottom-width: 0; }\n .bl-0-ns { border-left-width: 0; }\n}\n\n@media (--breakpoint-medium) {\n .bw0-m { border-width: 0; }\n .bw1-m { border-width: .125rem; }\n .bw2-m { border-width: .25rem; }\n .bw3-m { border-width: .5rem; }\n .bw4-m { border-width: 1rem; }\n .bw5-m { border-width: 2rem; }\n .bt-0-m { border-top-width: 0; }\n .br-0-m { border-right-width: 0; }\n .bb-0-m { border-bottom-width: 0; }\n .bl-0-m { border-left-width: 0; }\n}\n\n@media (--breakpoint-large) {\n .bw0-l { border-width: 0; }\n .bw1-l { border-width: .125rem; }\n .bw2-l { border-width: .25rem; }\n .bw3-l { border-width: .5rem; }\n .bw4-l { border-width: 1rem; }\n .bw5-l { border-width: 2rem; }\n .bt-0-l { border-top-width: 0; }\n .br-0-l { border-right-width: 0; }\n .bb-0-l { border-bottom-width: 0; }\n .bl-0-l { border-left-width: 0; }\n}\n", + "readme": "\n\n# BORDER WIDTHS\n\n### Docs\n\nhttp://tachyons.io/docs/themes/borders/\n\n### Base\n\n- bw = border-width\n\n### Modifiers\n\n- 0 = 0 width border\n- 1 = 1st step in border-width scale\n- 2 = 2nd step in border-width scale\n- 3 = 3rd step in border-width scale\n- 4 = 4th step in border-width scale\n- 5 = 5th step in border-width scale\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# BORDER WIDTHS\n\n### Docs\n\nhttp://tachyons.io/docs/themes/borders/\n\n### Base\n\n- bw = border-width\n\n### Modifiers\n\n- 0 = 0 width border\n- 1 = 1st step in border-width scale\n- 2 = 2nd step in border-width scale\n- 3 = 3rd step in border-width scale\n- 4 = 4th step in border-width scale\n- 5 = 5th step in border-width scale\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n.bw0 { border-width: 0; }\n.bw1 { border-width: .125rem; }\n.bw2 { border-width: .25rem; }\n.bw3 { border-width: .5rem; }\n.bw4 { border-width: 1rem; }\n.bw5 { border-width: 2rem; }\n\n/* Resets */\n.bt-0 { border-top-width: 0; }\n.br-0 { border-right-width: 0; }\n.bb-0 { border-bottom-width: 0; }\n.bl-0 { border-left-width: 0; }\n\n@media (--breakpoint-small) {\n .bw0-s { border-width: 0; }\n .bw1-s { border-width: .125rem; }\n .bw2-s { border-width: .25rem; }\n .bw3-s { border-width: .5rem; }\n .bw4-s { border-width: 1rem; }\n .bw5-s { border-width: 2rem; }\n .bt-0-s { border-top-width: 0; }\n .br-0-s { border-right-width: 0; }\n .bb-0-s { border-bottom-width: 0; }\n .bl-0-s { border-left-width: 0; }\n}\n\n@media (--breakpoint-medium) {\n .bw0-m { border-width: 0; }\n .bw1-m { border-width: .125rem; }\n .bw2-m { border-width: .25rem; }\n .bw3-m { border-width: .5rem; }\n .bw4-m { border-width: 1rem; }\n .bw5-m { border-width: 2rem; }\n .bt-0-m { border-top-width: 0; }\n .br-0-m { border-right-width: 0; }\n .bb-0-m { border-bottom-width: 0; }\n .bl-0-m { border-left-width: 0; }\n}\n\n@media (--breakpoint-large) {\n .bw0-l { border-width: 0; }\n .bw1-l { border-width: .125rem; }\n .bw2-l { border-width: .25rem; }\n .bw3-l { border-width: .5rem; }\n .bw4-l { border-width: 1rem; }\n .bw5-l { border-width: 2rem; }\n .bt-0-l { border-top-width: 0; }\n .br-0-l { border-right-width: 0; }\n .bb-0-l { border-bottom-width: 0; }\n .bl-0-l { border-left-width: 0; }\n}\n", "css": "/*\n\n BORDER WIDTHS\n\n Base:\n bw = border-width\n\n Modifiers:\n 0 = 0 width border\n 1 = 1st step in border-width scale\n 2 = 2nd step in border-width scale\n 3 = 3rd step in border-width scale\n 4 = 4th step in border-width scale\n 5 = 5th step in border-width scale\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n.bw0 { border-width: 0; }\n.bw1 { border-width: .125rem; }\n.bw2 { border-width: .25rem; }\n.bw3 { border-width: .5rem; }\n.bw4 { border-width: 1rem; }\n.bw5 { border-width: 2rem; }\n.bt-0 { border-top-width: 0; }\n.br-0 { border-right-width: 0; }\n.bb-0 { border-bottom-width: 0; }\n.bl-0 { border-left-width: 0; }\n@media screen and (min-width: 30em) {\n .bw0-ns { border-width: 0; }\n .bw1-ns { border-width: .125rem; }\n .bw2-ns { border-width: .25rem; }\n .bw3-ns { border-width: .5rem; }\n .bw4-ns { border-width: 1rem; }\n .bw5-ns { border-width: 2rem; }\n .bt-0-ns { border-top-width: 0; }\n .br-0-ns { border-right-width: 0; }\n .bb-0-ns { border-bottom-width: 0; }\n .bl-0-ns { border-left-width: 0; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .bw0-m { border-width: 0; }\n .bw1-m { border-width: .125rem; }\n .bw2-m { border-width: .25rem; }\n .bw3-m { border-width: .5rem; }\n .bw4-m { border-width: 1rem; }\n .bw5-m { border-width: 2rem; }\n .bt-0-m { border-top-width: 0; }\n .br-0-m { border-right-width: 0; }\n .bb-0-m { border-bottom-width: 0; }\n .bl-0-m { border-left-width: 0; }\n}\n@media screen and (min-width: 60em) {\n .bw0-l { border-width: 0; }\n .bw1-l { border-width: .125rem; }\n .bw2-l { border-width: .25rem; }\n .bw3-l { border-width: .5rem; }\n .bw4-l { border-width: 1rem; }\n .bw5-l { border-width: 2rem; }\n .bt-0-l { border-top-width: 0; }\n .br-0-l { border-right-width: 0; }\n .bb-0-l { border-bottom-width: 0; }\n .bl-0-l { border-left-width: 0; }\n}\n\n" }, "tachyons-borders": { @@ -2016,8 +2016,8 @@ ] } ], - "readme": "# tachyons-borders 3.0.0\n\nPerformance-first css module for styling borders.\n\n#### Stats\n\n308 | 24 | 48\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-borders\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-borders\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-borders.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-borders\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\n/*\n\n BORDER BASE\n\n Legend\n\n a = all\n t = top\n r = right\n b = bottom\n l = left\n\n*/\n.ba { border-style: solid; border-width: 1px; }\n.bt { border-top-style: solid; border-top-width: 1px; }\n.br { border-right-style: solid; border-right-width: 1px; }\n.bb { border-bottom-style: solid; border-bottom-width: 1px; }\n.bl { border-left-style: solid; border-left-width: 1px; }\n.bn { border-style: none; border-width: 0; }\n@media screen and (min-width: 30em) {\n .ba-ns { border-style: solid; border-width: 1px; }\n .bt-ns { border-top-style: solid; border-top-width: 1px; }\n .br-ns { border-right-style: solid; border-right-width: 1px; }\n .bb-ns { border-bottom-style: solid; border-bottom-width: 1px; }\n .bl-ns { border-left-style: solid; border-left-width: 1px; }\n .bn-ns { border-style: none; border-width: 0; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .ba-m { border-style: solid; border-width: 1px; }\n .bt-m { border-top-style: solid; border-top-width: 1px; }\n .br-m { border-right-style: solid; border-right-width: 1px; }\n .bb-m { border-bottom-style: solid; border-bottom-width: 1px; }\n .bl-m { border-left-style: solid; border-left-width: 1px; }\n .bn-m { border-style: none; border-width: 0; }\n}\n@media screen and (min-width: 60em) {\n .ba-l { border-style: solid; border-width: 1px; }\n .bt-l { border-top-style: solid; border-top-width: 1px; }\n .br-l { border-right-style: solid; border-right-width: 1px; }\n .bb-l { border-bottom-style: solid; border-bottom-width: 1px; }\n .bl-l { border-left-style: solid; border-left-width: 1px; }\n .bn-l { border-style: none; border-width: 0; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n BORDER BASE\n\n Legend\n\n a = all\n t = top\n r = right\n b = bottom\n l = left\n\n*/\n\n .ba { border-style: solid; border-width: 1px; }\n .bt { border-top-style: solid; border-top-width: 1px; }\n .br { border-right-style: solid; border-right-width: 1px; }\n .bb { border-bottom-style: solid; border-bottom-width: 1px; }\n .bl { border-left-style: solid; border-left-width: 1px; }\n .bn { border-style: none; border-width: 0; }\n\n\n@media (--breakpoint-not-small) {\n .ba-ns { border-style: solid; border-width: 1px; }\n .bt-ns { border-top-style: solid; border-top-width: 1px; }\n .br-ns { border-right-style: solid; border-right-width: 1px; }\n .bb-ns { border-bottom-style: solid; border-bottom-width: 1px; }\n .bl-ns { border-left-style: solid; border-left-width: 1px; }\n .bn-ns { border-style: none; border-width: 0; }\n}\n\n@media (--breakpoint-medium) {\n .ba-m { border-style: solid; border-width: 1px; }\n .bt-m { border-top-style: solid; border-top-width: 1px; }\n .br-m { border-right-style: solid; border-right-width: 1px; }\n .bb-m { border-bottom-style: solid; border-bottom-width: 1px; }\n .bl-m { border-left-style: solid; border-left-width: 1px; }\n .bn-m { border-style: none; border-width: 0; }\n}\n\n@media (--breakpoint-large) {\n .ba-l { border-style: solid; border-width: 1px; }\n .bt-l { border-top-style: solid; border-top-width: 1px; }\n .br-l { border-right-style: solid; border-right-width: 1px; }\n .bb-l { border-bottom-style: solid; border-bottom-width: 1px; }\n .bl-l { border-left-style: solid; border-left-width: 1px; }\n .bn-l { border-style: none; border-width: 0; }\n}\n\n", + "readme": "\n\n# BORDERS\n\n### Docs\n\nhttp://tachyons.io/docs/themes/borders/\n\n### Base\n\n- b = border\n\n### Modifiers\n\n- a = all\n- t = top\n- r = right\n- b = bottom\n- l = left\n- n = none\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# BORDERS\n\n### Docs\n\nhttp://tachyons.io/docs/themes/borders/\n\n### Base\n\n- b = border\n\n### Modifiers\n\n- a = all\n- t = top\n- r = right\n- b = bottom\n- l = left\n- n = none\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n.ba { border-style: solid; border-width: 1px; }\n.bt { border-top-style: solid; border-top-width: 1px; }\n.br { border-right-style: solid; border-right-width: 1px; }\n.bb { border-bottom-style: solid; border-bottom-width: 1px; }\n.bl { border-left-style: solid; border-left-width: 1px; }\n.bn { border-style: none; border-width: 0; }\n\n@media (--breakpoint-small) {\n .ba-s { border-style: solid; border-width: 1px; }\n .bt-s { border-top-style: solid; border-top-width: 1px; }\n .br-s { border-right-style: solid; border-right-width: 1px; }\n .bb-s { border-bottom-style: solid; border-bottom-width: 1px; }\n .bl-s { border-left-style: solid; border-left-width: 1px; }\n .bn-s { border-style: none; border-width: 0; }\n}\n\n@media (--breakpoint-medium) {\n .ba-m { border-style: solid; border-width: 1px; }\n .bt-m { border-top-style: solid; border-top-width: 1px; }\n .br-m { border-right-style: solid; border-right-width: 1px; }\n .bb-m { border-bottom-style: solid; border-bottom-width: 1px; }\n .bl-m { border-left-style: solid; border-left-width: 1px; }\n .bn-m { border-style: none; border-width: 0; }\n}\n\n@media (--breakpoint-large) {\n .ba-l { border-style: solid; border-width: 1px; }\n .bt-l { border-top-style: solid; border-top-width: 1px; }\n .br-l { border-right-style: solid; border-right-width: 1px; }\n .bb-l { border-bottom-style: solid; border-bottom-width: 1px; }\n .bl-l { border-left-style: solid; border-left-width: 1px; }\n .bn-l { border-style: none; border-width: 0; }\n}\n\n", "css": "/*\n\n BORDER BASE\n\n Legend\n\n a = all\n t = top\n r = right\n b = bottom\n l = left\n\n*/\n.ba { border-style: solid; border-width: 1px; }\n.bt { border-top-style: solid; border-top-width: 1px; }\n.br { border-right-style: solid; border-right-width: 1px; }\n.bb { border-bottom-style: solid; border-bottom-width: 1px; }\n.bl { border-left-style: solid; border-left-width: 1px; }\n.bn { border-style: none; border-width: 0; }\n@media screen and (min-width: 30em) {\n .ba-ns { border-style: solid; border-width: 1px; }\n .bt-ns { border-top-style: solid; border-top-width: 1px; }\n .br-ns { border-right-style: solid; border-right-width: 1px; }\n .bb-ns { border-bottom-style: solid; border-bottom-width: 1px; }\n .bl-ns { border-left-style: solid; border-left-width: 1px; }\n .bn-ns { border-style: none; border-width: 0; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .ba-m { border-style: solid; border-width: 1px; }\n .bt-m { border-top-style: solid; border-top-width: 1px; }\n .br-m { border-right-style: solid; border-right-width: 1px; }\n .bb-m { border-bottom-style: solid; border-bottom-width: 1px; }\n .bl-m { border-left-style: solid; border-left-width: 1px; }\n .bn-m { border-style: none; border-width: 0; }\n}\n@media screen and (min-width: 60em) {\n .ba-l { border-style: solid; border-width: 1px; }\n .bt-l { border-top-style: solid; border-top-width: 1px; }\n .br-l { border-right-style: solid; border-right-width: 1px; }\n .bb-l { border-bottom-style: solid; border-bottom-width: 1px; }\n .bl-l { border-left-style: solid; border-left-width: 1px; }\n .bn-l { border-style: none; border-width: 0; }\n}\n\n" }, "tachyons-box-shadow": { @@ -2166,8 +2166,8 @@ ] } ], - "readme": "# tachyons-box-shadow 2.0.0\n\nbox-shadow CSS module for Tachyons\n\n#### Stats\n\n296 | 20 | 20\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-box-shadow\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-box-shadow\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-box-shadow.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-box-shadow\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\n/*\n\n BOX-SHADOW\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n */\n.shadow-1 { box-shadow: 0px 0px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n.shadow-2 { box-shadow: 0px 0px 8px 2px rgba( 0, 0, 0, 0.2 ); }\n.shadow-3 { box-shadow: 2px 2px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n.shadow-4 { box-shadow: 2px 2px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n.shadow-5 { box-shadow: 4px 4px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n@media screen and (min-width: 30em) {\n .shadow-1-ns { box-shadow: 0px 0px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-2-ns { box-shadow: 0px 0px 8px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-3-ns { box-shadow: 2px 2px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-4-ns { box-shadow: 2px 2px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n .shadow-5-ns { box-shadow: 4px 4px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .shadow-1-m { box-shadow: 0px 0px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-2-m { box-shadow: 0px 0px 8px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-3-m { box-shadow: 2px 2px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-4-m { box-shadow: 2px 2px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n .shadow-5-m { box-shadow: 4px 4px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n}\n@media screen and (min-width: 60em) {\n .shadow-1-l { box-shadow: 0px 0px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-2-l { box-shadow: 0px 0px 8px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-3-l { box-shadow: 2px 2px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-4-l { box-shadow: 2px 2px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n .shadow-5-l { box-shadow: 4px 4px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n BOX-SHADOW\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n */\n\n.shadow-1 { box-shadow: 0px 0px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n.shadow-2 { box-shadow: 0px 0px 8px 2px rgba( 0, 0, 0, 0.2 ); }\n.shadow-3 { box-shadow: 2px 2px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n.shadow-4 { box-shadow: 2px 2px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n.shadow-5 { box-shadow: 4px 4px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n\n@media (--breakpoint-not-small) {\n .shadow-1-ns { box-shadow: 0px 0px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-2-ns { box-shadow: 0px 0px 8px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-3-ns { box-shadow: 2px 2px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-4-ns { box-shadow: 2px 2px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n .shadow-5-ns { box-shadow: 4px 4px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n}\n\n@media (--breakpoint-medium) {\n .shadow-1-m { box-shadow: 0px 0px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-2-m { box-shadow: 0px 0px 8px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-3-m { box-shadow: 2px 2px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-4-m { box-shadow: 2px 2px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n .shadow-5-m { box-shadow: 4px 4px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n}\n\n@media (--breakpoint-large) {\n .shadow-1-l { box-shadow: 0px 0px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-2-l { box-shadow: 0px 0px 8px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-3-l { box-shadow: 2px 2px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-4-l { box-shadow: 2px 2px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n .shadow-5-l { box-shadow: 4px 4px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n}\n", + "readme": "\n\n# BOX SHADOW\n\n### Docs\n\nhttp://tachyons.io/docs/themes/box-shadow/\n\n### Base\n\n- shadow\n\n### Modifiers\n\n- `-1` = offset 0px 0px 4px 2px\n- `-2` = offset 0px 0px 8px 2px\n- `-3` = offset 2px 2px 4px 2px\n- `-4` = offset 2px 2px 8px 0px\n- `-5` = offset 4px 4px 8px 0px\n\n### Literal Values\n\n- `-none` = none\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# BOX SHADOW\n\n### Docs\n\nhttp://tachyons.io/docs/themes/box-shadow/\n\n### Base\n\n- shadow\n\n### Modifiers\n\n- `-1` = offset 0px 0px 4px 2px\n- `-2` = offset 0px 0px 8px 2px\n- `-3` = offset 2px 2px 4px 2px\n- `-4` = offset 2px 2px 8px 0px\n- `-5` = offset 4px 4px 8px 0px\n\n### Literal Values\n\n- `-none` = none\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n.shadow-1 { box-shadow: 0px 0px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n.shadow-2 { box-shadow: 0px 0px 8px 2px rgba( 0, 0, 0, 0.2 ); }\n.shadow-3 { box-shadow: 2px 2px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n.shadow-4 { box-shadow: 2px 2px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n.shadow-5 { box-shadow: 4px 4px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n.shadow-none { box-shadow: none; }\n\n@media (--breakpoint-small) {\n .shadow-1-s { box-shadow: 0px 0px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-2-s { box-shadow: 0px 0px 8px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-3-s { box-shadow: 2px 2px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-4-s { box-shadow: 2px 2px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n .shadow-5-s { box-shadow: 4px 4px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n .shadow-none-s { box-shadow: none; }\n}\n\n@media (--breakpoint-medium) {\n .shadow-1-m { box-shadow: 0px 0px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-2-m { box-shadow: 0px 0px 8px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-3-m { box-shadow: 2px 2px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-4-m { box-shadow: 2px 2px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n .shadow-5-m { box-shadow: 4px 4px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n .shadow-none-m { box-shadow: none; }\n}\n\n@media (--breakpoint-large) {\n .shadow-1-l { box-shadow: 0px 0px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-2-l { box-shadow: 0px 0px 8px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-3-l { box-shadow: 2px 2px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-4-l { box-shadow: 2px 2px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n .shadow-5-l { box-shadow: 4px 4px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n .shadow-none-l { box-shadow: none; }\n}\n", "css": "/*\n\n BOX-SHADOW\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n */\n.shadow-1 { box-shadow: 0px 0px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n.shadow-2 { box-shadow: 0px 0px 8px 2px rgba( 0, 0, 0, 0.2 ); }\n.shadow-3 { box-shadow: 2px 2px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n.shadow-4 { box-shadow: 2px 2px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n.shadow-5 { box-shadow: 4px 4px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n@media screen and (min-width: 30em) {\n .shadow-1-ns { box-shadow: 0px 0px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-2-ns { box-shadow: 0px 0px 8px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-3-ns { box-shadow: 2px 2px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-4-ns { box-shadow: 2px 2px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n .shadow-5-ns { box-shadow: 4px 4px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .shadow-1-m { box-shadow: 0px 0px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-2-m { box-shadow: 0px 0px 8px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-3-m { box-shadow: 2px 2px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-4-m { box-shadow: 2px 2px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n .shadow-5-m { box-shadow: 4px 4px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n}\n@media screen and (min-width: 60em) {\n .shadow-1-l { box-shadow: 0px 0px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-2-l { box-shadow: 0px 0px 8px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-3-l { box-shadow: 2px 2px 4px 2px rgba( 0, 0, 0, 0.2 ); }\n .shadow-4-l { box-shadow: 2px 2px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n .shadow-5-l { box-shadow: 4px 4px 8px 0px rgba( 0, 0, 0, 0.2 ); }\n}\n\n" }, "tachyons-box-sizing": { @@ -2183,8 +2183,8 @@ ] } ], - "readme": "# tachyons-box-sizing 3.2.2\n\nCss module for a smarter default box-model.\n\n### Stats\n\n249 | 40 | 1\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-box-sizing\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-box-sizing\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-box-sizing.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-box-sizing\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n Box Sizing\n*/\nhtml, body, div, article, aside, section, main, nav, footer, header, form,\nfieldset, legend, pre, code, p, a, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt,\ndd, blockquote, figcaption, figure, textarea, input[type=\"email\"],\ninput[type=\"number\"], input[type=\"password\"], input[type=\"tel\"],\ninput[type=\"text\"], input[type=\"url\"], .border-box { box-sizing: border-box; }\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "/*\n Box Sizing\n*/\n\nhtml,\nbody,\ndiv,\narticle,\naside,\nsection,\nmain,\nnav,\nfooter,\nheader,\nform,\nfieldset,\nlegend,\npre,\ncode,\np,\na,\nh1,h2,h3,h4,h5,h6,\nul,ol,li,\ndl,dt,dd,\nblockquote,\nfigcaption,\nfigure,\ntextarea,\ninput[type=\"email\"],\ninput[type=\"number\"],\ninput[type=\"password\"],\ninput[type=\"tel\"],\ninput[type=\"text\"],\ninput[type=\"url\"],\n.border-box {\n box-sizing: border-box;\n}\n", + "readme": "\n\n# BOX SIZING\n\nBox sizing doesn't use the `*` selector in order\nto improve performance.\n", + "src": "/*!!!\n\n# BOX SIZING\n\nBox sizing doesn't use the `*` selector in order\nto improve performance.\n*/\n\nhtml,\nbody,\ndiv,\narticle,\naside,\nsection,\nmain,\nnav,\nfooter,\nheader,\nform,\nfieldset,\nlegend,\npre,\ncode,\na,\nh1,h2,h3,h4,h5,h6,\np,\nul,\nol,\nli,\ndl,\ndt,\ndd,\nblockquote,\nfigcaption,\nfigure,\ntextarea,\ntable,\ntd,\nth,\ntr,\ninput[type=\"email\"],\ninput[type=\"number\"],\ninput[type=\"password\"],\ninput[type=\"tel\"],\ninput[type=\"text\"],\ninput[type=\"url\"],\n.border-box {\n box-sizing: border-box;\n}\n", "css": "/*\n Box Sizing\n*/\nhtml, body, div, article, aside, section, main, nav, footer, header, form,\nfieldset, legend, pre, code, p, a, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt,\ndd, blockquote, figcaption, figure, textarea, input[type=\"email\"],\ninput[type=\"number\"], input[type=\"password\"], input[type=\"tel\"],\ninput[type=\"text\"], input[type=\"url\"], .border-box { box-sizing: border-box; }\n\n" }, "tachyons-clears": { @@ -2327,8 +2327,8 @@ ] } ], - "readme": "# tachyons-clears 3.0.0\n\nPerformance based css module.\n\n#### Stats\n\n298 | 20 | 20\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-clears\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-clears\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-clears.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-clears\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\n/*\n\n CLEARFIX\n\n*/\n/* Nicolas Gallaghers Clearfix solution\n Ref: http://nicolasgallagher.com/micro-clearfix-hack/ */\n.cf:before, .cf:after { content: \" \"; display: table; }\n.cf:after { clear: both; }\n.cf { *zoom: 1; }\n.cl { clear: left; }\n.cr { clear: right; }\n.cb { clear: both; }\n.cn { clear: none; }\n@media screen and (min-width: 30em) {\n .cl-ns { clear: left; }\n .cr-ns { clear: right; }\n .cb-ns { clear: both; }\n .cn-ns { clear: none; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .cl-m { clear: left; }\n .cr-m { clear: right; }\n .cb-m { clear: both; }\n .cn-m { clear: none; }\n}\n@media screen and (min-width: 60em) {\n .cl-l { clear: left; }\n .cr-l { clear: right; }\n .cb-l { clear: both; }\n .cn-l { clear: none; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n CLEARFIX\n\n*/\n\n/* Nicolas Gallaghers Clearfix solution\n Ref: http://nicolasgallagher.com/micro-clearfix-hack/ */\n\n.cf:before,\n.cf:after { content: \" \"; display: table; }\n.cf:after { clear: both; }\n.cf { *zoom: 1; }\n\n.cl { clear: left; }\n.cr { clear: right; }\n.cb { clear: both; }\n.cn { clear: none; }\n\n@media (--breakpoint-not-small) {\n .cl-ns { clear: left; }\n .cr-ns { clear: right; }\n .cb-ns { clear: both; }\n .cn-ns { clear: none; }\n}\n\n@media (--breakpoint-medium) {\n .cl-m { clear: left; }\n .cr-m { clear: right; }\n .cb-m { clear: both; }\n .cn-m { clear: none; }\n}\n\n@media (--breakpoint-large) {\n .cl-l { clear: left; }\n .cr-l { clear: right; }\n .cb-l { clear: both; }\n .cn-l { clear: none; }\n}\n", + "readme": "\n\n# CLEARFIX\n\n### Docs\n\nhttp://tachyons.io/docs/layout/clearfix/\n\n### Based on\n\nNicolas Gallagher's clerfix solution\nhttp://nicolasgallagher.com/micro-clearfix-hack/\n\n### Base\n\n- c = clear\n\n### Modifiers\n\n- f = clearfix\n- l = left\n- r = right\n- b = both\n- n = none\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# CLEARFIX\n\n### Docs\n\nhttp://tachyons.io/docs/layout/clearfix/\n\n### Based on\n\nNicolas Gallagher's clerfix solution\nhttp://nicolasgallagher.com/micro-clearfix-hack/\n\n### Base\n\n- c = clear\n\n### Modifiers\n\n- f = clearfix\n- l = left\n- r = right\n- b = both\n- n = none\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n.cf:before,\n.cf:after { content: \" \"; display: table; }\n.cf:after { clear: both; }\n.cf { *zoom: 1; }\n\n.cl { clear: left; }\n.cr { clear: right; }\n.cb { clear: both; }\n.cn { clear: none; }\n\n@media (--breakpoint-small) {\n .cl-s { clear: left; }\n .cr-s { clear: right; }\n .cb-s { clear: both; }\n .cn-s { clear: none; }\n}\n\n@media (--breakpoint-medium) {\n .cl-m { clear: left; }\n .cr-m { clear: right; }\n .cb-m { clear: both; }\n .cn-m { clear: none; }\n}\n\n@media (--breakpoint-large) {\n .cl-l { clear: left; }\n .cr-l { clear: right; }\n .cb-l { clear: both; }\n .cn-l { clear: none; }\n}\n", "css": "/*\n\n CLEARFIX\n\n*/\n/* Nicolas Gallaghers Clearfix solution\n Ref: http://nicolasgallagher.com/micro-clearfix-hack/ */\n.cf:before, .cf:after { content: \" \"; display: table; }\n.cf:after { clear: both; }\n.cf { *zoom: 1; }\n.cl { clear: left; }\n.cr { clear: right; }\n.cb { clear: both; }\n.cn { clear: none; }\n@media screen and (min-width: 30em) {\n .cl-ns { clear: left; }\n .cr-ns { clear: right; }\n .cb-ns { clear: both; }\n .cn-ns { clear: none; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .cl-m { clear: left; }\n .cr-m { clear: right; }\n .cb-m { clear: both; }\n .cn-m { clear: none; }\n}\n@media screen and (min-width: 60em) {\n .cl-l { clear: left; }\n .cr-l { clear: right; }\n .cb-l { clear: both; }\n .cn-l { clear: none; }\n}\n\n" }, "tachyons-coordinates": { @@ -2937,8 +2937,8 @@ ] } ], - "readme": "# tachyons-coordinates 4.0.0\n\nPerformance based css module.\n\n#### Stats\n\n519 | 84 | 96\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-coordinates\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-coordinates\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-coordinates.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-coordinates\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\n/*\n\n COORDINATES\n\n Use in combination with the position module.\n\n*/\n.top-0 { top: 0; }\n.right-0 { right: 0; }\n.bottom-0 { bottom: 0; }\n.left-0 { left: 0; }\n.top-1 { top: 1rem; }\n.right-1 { right: 1rem; }\n.bottom-1 { bottom: 1rem; }\n.left-1 { left: 1rem; }\n.top-2 { top: 2rem; }\n.right-2 { right: 2rem; }\n.bottom-2 { bottom: 2rem; }\n.left-2 { left: 2rem; }\n.top--1 { top: -1rem; }\n.right--1 { right: -1rem; }\n.bottom--1 { bottom: -1rem; }\n.left--1 { left: -1rem; }\n.top--2 { top: -2rem; }\n.right--2 { right: -2rem; }\n.bottom--2 { bottom: -2rem; }\n.left--2 { left: -2rem; }\n.absolute--fill { top: 0; right: 0; bottom: 0; left: 0; }\n@media screen and (min-width: 30em) {\n .top-0-ns { top: 0; }\n .left-0-ns { left: 0; }\n .right-0-ns { right: 0; }\n .bottom-0-ns { bottom: 0; }\n .top-1-ns { top: 1rem; }\n .left-1-ns { left: 1rem; }\n .right-1-ns { right: 1rem; }\n .bottom-1-ns { bottom: 1rem; }\n .top-2-ns { top: 2rem; }\n .left-2-ns { left: 2rem; }\n .right-2-ns { right: 2rem; }\n .bottom-2-ns { bottom: 2rem; }\n .top--1-ns { top: -1rem; }\n .right--1-ns { right: -1rem; }\n .bottom--1-ns { bottom: -1rem; }\n .left--1-ns { left: -1rem; }\n .top--2-ns { top: -2rem; }\n .right--2-ns { right: -2rem; }\n .bottom--2-ns { bottom: -2rem; }\n .left--2-ns { left: -2rem; }\n .absolute--fill-ns { top: 0; right: 0; bottom: 0; left: 0; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .top-0-m { top: 0; }\n .left-0-m { left: 0; }\n .right-0-m { right: 0; }\n .bottom-0-m { bottom: 0; }\n .top-1-m { top: 1rem; }\n .left-1-m { left: 1rem; }\n .right-1-m { right: 1rem; }\n .bottom-1-m { bottom: 1rem; }\n .top-2-m { top: 2rem; }\n .left-2-m { left: 2rem; }\n .right-2-m { right: 2rem; }\n .bottom-2-m { bottom: 2rem; }\n .top--1-m { top: -1rem; }\n .right--1-m { right: -1rem; }\n .bottom--1-m { bottom: -1rem; }\n .left--1-m { left: -1rem; }\n .top--2-m { top: -2rem; }\n .right--2-m { right: -2rem; }\n .bottom--2-m { bottom: -2rem; }\n .left--2-m { left: -2rem; }\n .absolute--fill-m { top: 0; right: 0; bottom: 0; left: 0; }\n}\n@media screen and (min-width: 60em) {\n .top-0-l { top: 0; }\n .left-0-l { left: 0; }\n .right-0-l { right: 0; }\n .bottom-0-l { bottom: 0; }\n .top-1-l { top: 1rem; }\n .left-1-l { left: 1rem; }\n .right-1-l { right: 1rem; }\n .bottom-1-l { bottom: 1rem; }\n .top-2-l { top: 2rem; }\n .left-2-l { left: 2rem; }\n .right-2-l { right: 2rem; }\n .bottom-2-l { bottom: 2rem; }\n .top--1-l { top: -1rem; }\n .right--1-l { right: -1rem; }\n .bottom--1-l { bottom: -1rem; }\n .left--1-l { left: -1rem; }\n .top--2-l { top: -2rem; }\n .right--2-l { right: -2rem; }\n .bottom--2-l { bottom: -2rem; }\n .left--2-l { left: -2rem; }\n .absolute--fill-l { top: 0; right: 0; bottom: 0; left: 0; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n COORDINATES\n\n Use in combination with the position module.\n\n*/\n\n.top-0 { top: 0; }\n.right-0 { right: 0; }\n.bottom-0 { bottom: 0; }\n.left-0 { left: 0; }\n\n.top-1 { top: 1rem; }\n.right-1 { right: 1rem; }\n.bottom-1 { bottom: 1rem; }\n.left-1 { left: 1rem; }\n\n.top-2 { top: 2rem; }\n.right-2 { right: 2rem; }\n.bottom-2 { bottom: 2rem; }\n.left-2 { left: 2rem; }\n\n.top--1 { top: -1rem; }\n.right--1 { right: -1rem; }\n.bottom--1 { bottom: -1rem; }\n.left--1 { left: -1rem; }\n\n.top--2 { top: -2rem; }\n.right--2 { right: -2rem; }\n.bottom--2 { bottom: -2rem; }\n.left--2 { left: -2rem; }\n\n\n.absolute--fill {\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n}\n\n@media (--breakpoint-not-small) {\n .top-0-ns { top: 0; }\n .left-0-ns { left: 0; }\n .right-0-ns { right: 0; }\n .bottom-0-ns { bottom: 0; }\n .top-1-ns { top: 1rem; }\n .left-1-ns { left: 1rem; }\n .right-1-ns { right: 1rem; }\n .bottom-1-ns { bottom: 1rem; }\n .top-2-ns { top: 2rem; }\n .left-2-ns { left: 2rem; }\n .right-2-ns { right: 2rem; }\n .bottom-2-ns { bottom: 2rem; }\n .top--1-ns { top: -1rem; }\n .right--1-ns { right: -1rem; }\n .bottom--1-ns { bottom: -1rem; }\n .left--1-ns { left: -1rem; }\n .top--2-ns { top: -2rem; }\n .right--2-ns { right: -2rem; }\n .bottom--2-ns { bottom: -2rem; }\n .left--2-ns { left: -2rem; }\n .absolute--fill-ns {\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n }\n}\n\n@media (--breakpoint-medium) {\n .top-0-m { top: 0; }\n .left-0-m { left: 0; }\n .right-0-m { right: 0; }\n .bottom-0-m { bottom: 0; }\n .top-1-m { top: 1rem; }\n .left-1-m { left: 1rem; }\n .right-1-m { right: 1rem; }\n .bottom-1-m { bottom: 1rem; }\n .top-2-m { top: 2rem; }\n .left-2-m { left: 2rem; }\n .right-2-m { right: 2rem; }\n .bottom-2-m { bottom: 2rem; }\n .top--1-m { top: -1rem; }\n .right--1-m { right: -1rem; }\n .bottom--1-m { bottom: -1rem; }\n .left--1-m { left: -1rem; }\n .top--2-m { top: -2rem; }\n .right--2-m { right: -2rem; }\n .bottom--2-m { bottom: -2rem; }\n .left--2-m { left: -2rem; }\n .absolute--fill-m {\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n }\n}\n\n@media (--breakpoint-large) {\n .top-0-l { top: 0; }\n .left-0-l { left: 0; }\n .right-0-l { right: 0; }\n .bottom-0-l { bottom: 0; }\n .top-1-l { top: 1rem; }\n .left-1-l { left: 1rem; }\n .right-1-l { right: 1rem; }\n .bottom-1-l { bottom: 1rem; }\n .top-2-l { top: 2rem; }\n .left-2-l { left: 2rem; }\n .right-2-l { right: 2rem; }\n .bottom-2-l { bottom: 2rem; }\n .top--1-l { top: -1rem; }\n .right--1-l { right: -1rem; }\n .bottom--1-l { bottom: -1rem; }\n .left--1-l { left: -1rem; }\n .top--2-l { top: -2rem; }\n .right--2-l { right: -2rem; }\n .bottom--2-l { bottom: -2rem; }\n .left--2-l { left: -2rem; }\n .absolute--fill-l {\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n }\n}\n", + "readme": "\n\n# COORDINATES\n\nUse in combination with the position module.\n\n### Docs\n\nhttp://tachyons.io/docs/layout/position/\n\n### Base\n\n- top\n- bottom\n- right\n- left\n\n### Modifiers\n\n- `-0` = literal value 0\n- `-1` = literal value 1\n- `-2` = literal value 2\n- `--1` = literal value -1\n- `--2` = literal value -2\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# COORDINATES\n\nUse in combination with the position module.\n\n### Docs\n\nhttp://tachyons.io/docs/layout/position/\n\n### Base\n\n- top\n- bottom\n- right\n- left\n\n### Modifiers\n\n- `-0` = literal value 0\n- `-1` = literal value 1\n- `-2` = literal value 2\n- `--1` = literal value -1\n- `--2` = literal value -2\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n.top-0 { top: 0; }\n.right-0 { right: 0; }\n.bottom-0 { bottom: 0; }\n.left-0 { left: 0; }\n\n.top-1 { top: 1rem; }\n.right-1 { right: 1rem; }\n.bottom-1 { bottom: 1rem; }\n.left-1 { left: 1rem; }\n\n.top-2 { top: 2rem; }\n.right-2 { right: 2rem; }\n.bottom-2 { bottom: 2rem; }\n.left-2 { left: 2rem; }\n\n.top--1 { top: -1rem; }\n.right--1 { right: -1rem; }\n.bottom--1 { bottom: -1rem; }\n.left--1 { left: -1rem; }\n\n.top--2 { top: -2rem; }\n.right--2 { right: -2rem; }\n.bottom--2 { bottom: -2rem; }\n.left--2 { left: -2rem; }\n\n.absolute--fill {\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n}\n\n@media (--breakpoint-small) {\n .top-0-s { top: 0; }\n .left-0-s { left: 0; }\n .right-0-s { right: 0; }\n .bottom-0-s { bottom: 0; }\n .top-1-s { top: 1rem; }\n .left-1-s { left: 1rem; }\n .right-1-s { right: 1rem; }\n .bottom-1-s { bottom: 1rem; }\n .top-2-s { top: 2rem; }\n .left-2-s { left: 2rem; }\n .right-2-s { right: 2rem; }\n .bottom-2-s { bottom: 2rem; }\n .top--1-s { top: -1rem; }\n .right--1-s { right: -1rem; }\n .bottom--1-s { bottom: -1rem; }\n .left--1-s { left: -1rem; }\n .top--2-s { top: -2rem; }\n .right--2-s { right: -2rem; }\n .bottom--2-s { bottom: -2rem; }\n .left--2-s { left: -2rem; }\n .absolute--fill-s {\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n }\n}\n\n@media (--breakpoint-medium) {\n .top-0-m { top: 0; }\n .left-0-m { left: 0; }\n .right-0-m { right: 0; }\n .bottom-0-m { bottom: 0; }\n .top-1-m { top: 1rem; }\n .left-1-m { left: 1rem; }\n .right-1-m { right: 1rem; }\n .bottom-1-m { bottom: 1rem; }\n .top-2-m { top: 2rem; }\n .left-2-m { left: 2rem; }\n .right-2-m { right: 2rem; }\n .bottom-2-m { bottom: 2rem; }\n .top--1-m { top: -1rem; }\n .right--1-m { right: -1rem; }\n .bottom--1-m { bottom: -1rem; }\n .left--1-m { left: -1rem; }\n .top--2-m { top: -2rem; }\n .right--2-m { right: -2rem; }\n .bottom--2-m { bottom: -2rem; }\n .left--2-m { left: -2rem; }\n .absolute--fill-m {\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n }\n}\n\n@media (--breakpoint-large) {\n .top-0-l { top: 0; }\n .left-0-l { left: 0; }\n .right-0-l { right: 0; }\n .bottom-0-l { bottom: 0; }\n .top-1-l { top: 1rem; }\n .left-1-l { left: 1rem; }\n .right-1-l { right: 1rem; }\n .bottom-1-l { bottom: 1rem; }\n .top-2-l { top: 2rem; }\n .left-2-l { left: 2rem; }\n .right-2-l { right: 2rem; }\n .bottom-2-l { bottom: 2rem; }\n .top--1-l { top: -1rem; }\n .right--1-l { right: -1rem; }\n .bottom--1-l { bottom: -1rem; }\n .left--1-l { left: -1rem; }\n .top--2-l { top: -2rem; }\n .right--2-l { right: -2rem; }\n .bottom--2-l { bottom: -2rem; }\n .left--2-l { left: -2rem; }\n .absolute--fill-l {\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n }\n}\n", "css": "/*\n\n COORDINATES\n\n Use in combination with the position module.\n\n*/\n.top-0 { top: 0; }\n.right-0 { right: 0; }\n.bottom-0 { bottom: 0; }\n.left-0 { left: 0; }\n.top-1 { top: 1rem; }\n.right-1 { right: 1rem; }\n.bottom-1 { bottom: 1rem; }\n.left-1 { left: 1rem; }\n.top-2 { top: 2rem; }\n.right-2 { right: 2rem; }\n.bottom-2 { bottom: 2rem; }\n.left-2 { left: 2rem; }\n.top--1 { top: -1rem; }\n.right--1 { right: -1rem; }\n.bottom--1 { bottom: -1rem; }\n.left--1 { left: -1rem; }\n.top--2 { top: -2rem; }\n.right--2 { right: -2rem; }\n.bottom--2 { bottom: -2rem; }\n.left--2 { left: -2rem; }\n.absolute--fill { top: 0; right: 0; bottom: 0; left: 0; }\n@media screen and (min-width: 30em) {\n .top-0-ns { top: 0; }\n .left-0-ns { left: 0; }\n .right-0-ns { right: 0; }\n .bottom-0-ns { bottom: 0; }\n .top-1-ns { top: 1rem; }\n .left-1-ns { left: 1rem; }\n .right-1-ns { right: 1rem; }\n .bottom-1-ns { bottom: 1rem; }\n .top-2-ns { top: 2rem; }\n .left-2-ns { left: 2rem; }\n .right-2-ns { right: 2rem; }\n .bottom-2-ns { bottom: 2rem; }\n .top--1-ns { top: -1rem; }\n .right--1-ns { right: -1rem; }\n .bottom--1-ns { bottom: -1rem; }\n .left--1-ns { left: -1rem; }\n .top--2-ns { top: -2rem; }\n .right--2-ns { right: -2rem; }\n .bottom--2-ns { bottom: -2rem; }\n .left--2-ns { left: -2rem; }\n .absolute--fill-ns { top: 0; right: 0; bottom: 0; left: 0; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .top-0-m { top: 0; }\n .left-0-m { left: 0; }\n .right-0-m { right: 0; }\n .bottom-0-m { bottom: 0; }\n .top-1-m { top: 1rem; }\n .left-1-m { left: 1rem; }\n .right-1-m { right: 1rem; }\n .bottom-1-m { bottom: 1rem; }\n .top-2-m { top: 2rem; }\n .left-2-m { left: 2rem; }\n .right-2-m { right: 2rem; }\n .bottom-2-m { bottom: 2rem; }\n .top--1-m { top: -1rem; }\n .right--1-m { right: -1rem; }\n .bottom--1-m { bottom: -1rem; }\n .left--1-m { left: -1rem; }\n .top--2-m { top: -2rem; }\n .right--2-m { right: -2rem; }\n .bottom--2-m { bottom: -2rem; }\n .left--2-m { left: -2rem; }\n .absolute--fill-m { top: 0; right: 0; bottom: 0; left: 0; }\n}\n@media screen and (min-width: 60em) {\n .top-0-l { top: 0; }\n .left-0-l { left: 0; }\n .right-0-l { right: 0; }\n .bottom-0-l { bottom: 0; }\n .top-1-l { top: 1rem; }\n .left-1-l { left: 1rem; }\n .right-1-l { right: 1rem; }\n .bottom-1-l { bottom: 1rem; }\n .top-2-l { top: 2rem; }\n .left-2-l { left: 2rem; }\n .right-2-l { right: 2rem; }\n .bottom-2-l { bottom: 2rem; }\n .top--1-l { top: -1rem; }\n .right--1-l { right: -1rem; }\n .bottom--1-l { bottom: -1rem; }\n .left--1-l { left: -1rem; }\n .top--2-l { top: -2rem; }\n .right--2-l { right: -2rem; }\n .bottom--2-l { bottom: -2rem; }\n .left--2-l { left: -2rem; }\n .absolute--fill-l { top: 0; right: 0; bottom: 0; left: 0; }\n}\n\n" }, "tachyons-debug": { @@ -3640,8 +3640,8 @@ ] } ], - "readme": "# tachyons-debug 1.1.6\n\nPerformance based css module.\n\n#### Stats\n\n964 | 99 | 99\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-debug\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-debug\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-debug.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-debug\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\nbody { outline: 1px solid #2980B9 !important; }\narticle { outline: 1px solid #3498DB !important; }\nnav { outline: 1px solid #0088C3 !important; }\naside { outline: 1px solid #33A0CE !important; }\nsection { outline: 1px solid #66B8DA !important; }\nheader { outline: 1px solid #99CFE7 !important; }\nfooter { outline: 1px solid #CCE7F3 !important; }\nh1 { outline: 1px solid #162544 !important; }\nh2 { outline: 1px solid #314E6E !important; }\nh3 { outline: 1px solid #3E5E85 !important; }\nh4 { outline: 1px solid #449BAF !important; }\nh5 { outline: 1px solid #C7D1CB !important; }\nh6 { outline: 1px solid #4371D0 !important; }\nmain { outline: 1px solid #2F4F90 !important; }\naddress { outline: 1px solid #1A2C51 !important; }\ndiv { outline: 1px solid #036CDB !important; }\np { outline: 1px solid #AC050B !important; }\nhr { outline: 1px solid #FF063F !important; }\npre { outline: 1px solid #850440 !important; }\nblockquote { outline: 1px solid #F1B8E7 !important; }\nol { outline: 1px solid #FF050C !important; }\nul { outline: 1px solid #D90416 !important; }\nli { outline: 1px solid #D90416 !important; }\ndl { outline: 1px solid #FD3427 !important; }\ndt { outline: 1px solid #FF0043 !important; }\ndd { outline: 1px solid #E80174 !important; }\nfigure { outline: 1px solid #FF00BB !important; }\nfigcaption { outline: 1px solid #BF0032 !important; }\ntable { outline: 1px solid #00CC99 !important; }\ncaption { outline: 1px solid #37FFC4 !important; }\nthead { outline: 1px solid #98DACA !important; }\ntbody { outline: 1px solid #64A7A0 !important; }\ntfoot { outline: 1px solid #22746B !important; }\ntr { outline: 1px solid #86C0B2 !important; }\nth { outline: 1px solid #A1E7D6 !important; }\ntd { outline: 1px solid #3F5A54 !important; }\ncol { outline: 1px solid #6C9A8F !important; }\ncolgroup { outline: 1px solid #6C9A9D !important; }\nbutton { outline: 1px solid #DA8301 !important; }\ndatalist { outline: 1px solid #C06000 !important; }\nfieldset { outline: 1px solid #D95100 !important; }\nform { outline: 1px solid #D23600 !important; }\ninput { outline: 1px solid #FCA600 !important; }\nkeygen { outline: 1px solid #B31E00 !important; }\nlabel { outline: 1px solid #EE8900 !important; }\nlegend { outline: 1px solid #DE6D00 !important; }\nmeter { outline: 1px solid #E8630C !important; }\noptgroup { outline: 1px solid #B33600 !important; }\noption { outline: 1px solid #FF8A00 !important; }\noutput { outline: 1px solid #FF9619 !important; }\nprogress { outline: 1px solid #E57C00 !important; }\nselect { outline: 1px solid #E26E0F !important; }\ntextarea { outline: 1px solid #CC5400 !important; }\ndetails { outline: 1px solid #33848F !important; }\nsummary { outline: 1px solid #60A1A6 !important; }\ncommand { outline: 1px solid #438DA1 !important; }\nmenu { outline: 1px solid #449DA6 !important; }\ndel { outline: 1px solid #BF0000 !important; }\nins { outline: 1px solid #400000 !important; }\nimg { outline: 1px solid #22746B !important; }\niframe { outline: 1px solid #64A7A0 !important; }\nembed { outline: 1px solid #98DACA !important; }\nobject { outline: 1px solid #00CC99 !important; }\nparam { outline: 1px solid #37FFC4 !important; }\nvideo { outline: 1px solid #6EE866 !important; }\naudio { outline: 1px solid #027353 !important; }\nsource { outline: 1px solid #012426 !important; }\ncanvas { outline: 1px solid #A2F570 !important; }\ntrack { outline: 1px solid #59A600 !important; }\nmap { outline: 1px solid #7BE500 !important; }\narea { outline: 1px solid #305900 !important; }\na { outline: 1px solid #FF62AB !important; }\nem { outline: 1px solid #800B41 !important; }\nstrong { outline: 1px solid #FF1583 !important; }\ni { outline: 1px solid #803156 !important; }\nb { outline: 1px solid #CC1169 !important; }\nu { outline: 1px solid #FF0430 !important; }\ns { outline: 1px solid #F805E3 !important; }\nsmall { outline: 1px solid #D107B2 !important; }\nabbr { outline: 1px solid #4A0263 !important; }\nq { outline: 1px solid #240018 !important; }\ncite { outline: 1px solid #64003C !important; }\ndfn { outline: 1px solid #B4005A !important; }\nsub { outline: 1px solid #DBA0C8 !important; }\nsup { outline: 1px solid #CC0256 !important; }\ntime { outline: 1px solid #D6606D !important; }\ncode { outline: 1px solid #E04251 !important; }\nkbd { outline: 1px solid #5E001F !important; }\nsamp { outline: 1px solid #9C0033 !important; }\nvar { outline: 1px solid #D90047 !important; }\nmark { outline: 1px solid #FF0053 !important; }\nbdi { outline: 1px solid #BF3668 !important; }\nbdo { outline: 1px solid #6F1400 !important; }\nruby { outline: 1px solid #FF7B93 !important; }\nrt { outline: 1px solid #FF2F54 !important; }\nrp { outline: 1px solid #803E49 !important; }\nspan { outline: 1px solid #CC2643 !important; }\nbr { outline: 1px solid #DB687D !important; }\nwbr { outline: 1px solid #DB175B !important; }\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "\nbody { outline: 1px solid #2980B9!important; }\narticle { outline: 1px solid #3498DB!important; }\nnav { outline: 1px solid #0088C3!important; }\naside { outline: 1px solid #33A0CE!important; }\nsection { outline: 1px solid #66B8DA!important; }\nheader { outline: 1px solid #99CFE7!important; }\nfooter { outline: 1px solid #CCE7F3!important; }\nh1 { outline: 1px solid #162544!important; }\nh2 { outline: 1px solid #314E6E!important; }\nh3 { outline: 1px solid #3E5E85!important; }\nh4 { outline: 1px solid #449BAF!important; }\nh5 { outline: 1px solid #C7D1CB!important; }\nh6 { outline: 1px solid #4371D0!important; }\nmain { outline: 1px solid #2F4F90!important; }\naddress { outline: 1px solid #1A2C51!important; }\ndiv { outline: 1px solid #036CDB!important; }\n\n\np { outline: 1px solid #AC050B!important; }\nhr { outline: 1px solid #FF063F!important; }\npre { outline: 1px solid #850440!important; }\nblockquote { outline: 1px solid #F1B8E7!important; }\nol { outline: 1px solid #FF050C!important; }\nul { outline: 1px solid #D90416!important; }\nli { outline: 1px solid #D90416!important; }\ndl { outline: 1px solid #FD3427!important; }\ndt { outline: 1px solid #FF0043!important; }\ndd { outline: 1px solid #E80174!important; }\nfigure { outline: 1px solid #FF00BB!important; }\nfigcaption { outline: 1px solid #BF0032!important; }\n\n\n\ntable { outline: 1px solid #00CC99!important; }\ncaption { outline: 1px solid #37FFC4!important; }\nthead { outline: 1px solid #98DACA!important; }\ntbody { outline: 1px solid #64A7A0!important; }\ntfoot { outline: 1px solid #22746B!important; }\ntr { outline: 1px solid #86C0B2!important; }\nth { outline: 1px solid #A1E7D6!important; }\ntd { outline: 1px solid #3F5A54!important; }\ncol { outline: 1px solid #6C9A8F!important; }\ncolgroup { outline: 1px solid #6C9A9D!important; }\n\n\nbutton { outline: 1px solid #DA8301!important; }\ndatalist { outline: 1px solid #C06000!important; }\nfieldset { outline: 1px solid #D95100!important; }\nform { outline: 1px solid #D23600!important; }\ninput { outline: 1px solid #FCA600!important; }\nkeygen { outline: 1px solid #B31E00!important; }\nlabel { outline: 1px solid #EE8900!important; }\nlegend { outline: 1px solid #DE6D00!important; }\nmeter { outline: 1px solid #E8630C!important; }\noptgroup { outline: 1px solid #B33600!important; }\noption { outline: 1px solid #FF8A00!important; }\noutput { outline: 1px solid #FF9619!important; }\nprogress { outline: 1px solid #E57C00!important; }\nselect { outline: 1px solid #E26E0F!important; }\ntextarea { outline: 1px solid #CC5400!important; }\n\n\n\ndetails { outline: 1px solid #33848F!important; }\nsummary { outline: 1px solid #60A1A6!important; }\ncommand { outline: 1px solid #438DA1!important; }\nmenu { outline: 1px solid #449DA6!important; }\n\n\n\ndel { outline: 1px solid #BF0000!important; }\nins { outline: 1px solid #400000!important; }\n\n\n\nimg { outline: 1px solid #22746B!important; }\niframe { outline: 1px solid #64A7A0!important; }\nembed { outline: 1px solid #98DACA!important; }\nobject { outline: 1px solid #00CC99!important; }\nparam { outline: 1px solid #37FFC4!important; }\nvideo { outline: 1px solid #6EE866!important; }\naudio { outline: 1px solid #027353!important; }\nsource { outline: 1px solid #012426!important; }\ncanvas { outline: 1px solid #A2F570!important; }\ntrack { outline: 1px solid #59A600!important; }\nmap { outline: 1px solid #7BE500!important; }\narea { outline: 1px solid #305900!important; }\n\n\n\na { outline: 1px solid #FF62AB!important; }\nem { outline: 1px solid #800B41!important; }\nstrong { outline: 1px solid #FF1583!important; }\ni { outline: 1px solid #803156!important; }\nb { outline: 1px solid #CC1169!important; }\nu { outline: 1px solid #FF0430!important; }\ns { outline: 1px solid #F805E3!important; }\nsmall { outline: 1px solid #D107B2!important; }\nabbr { outline: 1px solid #4A0263!important; }\nq { outline: 1px solid #240018!important; }\ncite { outline: 1px solid #64003C!important; }\ndfn { outline: 1px solid #B4005A!important; }\nsub { outline: 1px solid #DBA0C8!important; }\nsup { outline: 1px solid #CC0256!important; }\ntime { outline: 1px solid #D6606D!important; }\ncode { outline: 1px solid #E04251!important; }\nkbd { outline: 1px solid #5E001F!important; }\nsamp { outline: 1px solid #9C0033!important; }\nvar { outline: 1px solid #D90047!important; }\nmark { outline: 1px solid #FF0053!important; }\nbdi { outline: 1px solid #BF3668!important; }\nbdo { outline: 1px solid #6F1400!important; }\nruby { outline: 1px solid #FF7B93!important; }\nrt { outline: 1px solid #FF2F54!important; }\nrp { outline: 1px solid #803E49!important; }\nspan { outline: 1px solid #CC2643!important; }\nbr { outline: 1px solid #DB687D!important; }\nwbr { outline: 1px solid #DB175B!important; }\n\n", + "readme": "\n\n# DEBUG (PESTICIDE)\n\nThis is a partial you have to manually include in your\nbuild file. It places a different colored outline on\neach element which can help you debug layout issues.\nThere is also a handy chrome extension that can\nbe found at http://pesticide.io\n\n### Docs\n\nhttp://tachyons.io/docs/debug/\n", + "src": "/*!!!\n\n# DEBUG (PESTICIDE)\n\nThis is a partial you have to manually include in your\nbuild file. It places a different colored outline on\neach element which can help you debug layout issues.\nThere is also a handy chrome extension that can\nbe found at http://pesticide.io\n\n### Docs\n\nhttp://tachyons.io/docs/debug/\n*/\n\nbody { outline: 1px solid #2980B9!important; }\narticle { outline: 1px solid #3498DB!important; }\nnav { outline: 1px solid #0088C3!important; }\naside { outline: 1px solid #33A0CE!important; }\nsection { outline: 1px solid #66B8DA!important; }\nheader { outline: 1px solid #99CFE7!important; }\nfooter { outline: 1px solid #CCE7F3!important; }\nh1 { outline: 1px solid #162544!important; }\nh2 { outline: 1px solid #314E6E!important; }\nh3 { outline: 1px solid #3E5E85!important; }\nh4 { outline: 1px solid #449BAF!important; }\nh5 { outline: 1px solid #C7D1CB!important; }\nh6 { outline: 1px solid #4371D0!important; }\nmain { outline: 1px solid #2F4F90!important; }\naddress { outline: 1px solid #1A2C51!important; }\ndiv { outline: 1px solid #036CDB!important; }\n\n\np { outline: 1px solid #AC050B!important; }\nhr { outline: 1px solid #FF063F!important; }\npre { outline: 1px solid #850440!important; }\nblockquote { outline: 1px solid #F1B8E7!important; }\nol { outline: 1px solid #FF050C!important; }\nul { outline: 1px solid #D90416!important; }\nli { outline: 1px solid #D90416!important; }\ndl { outline: 1px solid #FD3427!important; }\ndt { outline: 1px solid #FF0043!important; }\ndd { outline: 1px solid #E80174!important; }\nfigure { outline: 1px solid #FF00BB!important; }\nfigcaption { outline: 1px solid #BF0032!important; }\n\n\n\ntable { outline: 1px solid #00CC99!important; }\ncaption { outline: 1px solid #37FFC4!important; }\nthead { outline: 1px solid #98DACA!important; }\ntbody { outline: 1px solid #64A7A0!important; }\ntfoot { outline: 1px solid #22746B!important; }\ntr { outline: 1px solid #86C0B2!important; }\nth { outline: 1px solid #A1E7D6!important; }\ntd { outline: 1px solid #3F5A54!important; }\ncol { outline: 1px solid #6C9A8F!important; }\ncolgroup { outline: 1px solid #6C9A9D!important; }\n\n\nbutton { outline: 1px solid #DA8301!important; }\ndatalist { outline: 1px solid #C06000!important; }\nfieldset { outline: 1px solid #D95100!important; }\nform { outline: 1px solid #D23600!important; }\ninput { outline: 1px solid #FCA600!important; }\nkeygen { outline: 1px solid #B31E00!important; }\nlabel { outline: 1px solid #EE8900!important; }\nlegend { outline: 1px solid #DE6D00!important; }\nmeter { outline: 1px solid #E8630C!important; }\noptgroup { outline: 1px solid #B33600!important; }\noption { outline: 1px solid #FF8A00!important; }\noutput { outline: 1px solid #FF9619!important; }\nprogress { outline: 1px solid #E57C00!important; }\nselect { outline: 1px solid #E26E0F!important; }\ntextarea { outline: 1px solid #CC5400!important; }\n\n\n\ndetails { outline: 1px solid #33848F!important; }\nsummary { outline: 1px solid #60A1A6!important; }\ncommand { outline: 1px solid #438DA1!important; }\nmenu { outline: 1px solid #449DA6!important; }\n\n\n\ndel { outline: 1px solid #BF0000!important; }\nins { outline: 1px solid #400000!important; }\n\n\n\nimg { outline: 1px solid #22746B!important; }\niframe { outline: 1px solid #64A7A0!important; }\nembed { outline: 1px solid #98DACA!important; }\nobject { outline: 1px solid #00CC99!important; }\nparam { outline: 1px solid #37FFC4!important; }\nvideo { outline: 1px solid #6EE866!important; }\naudio { outline: 1px solid #027353!important; }\nsource { outline: 1px solid #012426!important; }\ncanvas { outline: 1px solid #A2F570!important; }\ntrack { outline: 1px solid #59A600!important; }\nmap { outline: 1px solid #7BE500!important; }\narea { outline: 1px solid #305900!important; }\n\n\n\na { outline: 1px solid #FF62AB!important; }\nem { outline: 1px solid #800B41!important; }\nstrong { outline: 1px solid #FF1583!important; }\ni { outline: 1px solid #803156!important; }\nb { outline: 1px solid #CC1169!important; }\nu { outline: 1px solid #FF0430!important; }\ns { outline: 1px solid #F805E3!important; }\nsmall { outline: 1px solid #D107B2!important; }\nabbr { outline: 1px solid #4A0263!important; }\nq { outline: 1px solid #240018!important; }\ncite { outline: 1px solid #64003C!important; }\ndfn { outline: 1px solid #B4005A!important; }\nsub { outline: 1px solid #DBA0C8!important; }\nsup { outline: 1px solid #CC0256!important; }\ntime { outline: 1px solid #D6606D!important; }\ncode { outline: 1px solid #E04251!important; }\nkbd { outline: 1px solid #5E001F!important; }\nsamp { outline: 1px solid #9C0033!important; }\nvar { outline: 1px solid #D90047!important; }\nmark { outline: 1px solid #FF0053!important; }\nbdi { outline: 1px solid #BF3668!important; }\nbdo { outline: 1px solid #6F1400!important; }\nruby { outline: 1px solid #FF7B93!important; }\nrt { outline: 1px solid #FF2F54!important; }\nrp { outline: 1px solid #803E49!important; }\nspan { outline: 1px solid #CC2643!important; }\nbr { outline: 1px solid #DB687D!important; }\nwbr { outline: 1px solid #DB175B!important; }\n", "css": "body { outline: 1px solid #2980B9 !important; }\narticle { outline: 1px solid #3498DB !important; }\nnav { outline: 1px solid #0088C3 !important; }\naside { outline: 1px solid #33A0CE !important; }\nsection { outline: 1px solid #66B8DA !important; }\nheader { outline: 1px solid #99CFE7 !important; }\nfooter { outline: 1px solid #CCE7F3 !important; }\nh1 { outline: 1px solid #162544 !important; }\nh2 { outline: 1px solid #314E6E !important; }\nh3 { outline: 1px solid #3E5E85 !important; }\nh4 { outline: 1px solid #449BAF !important; }\nh5 { outline: 1px solid #C7D1CB !important; }\nh6 { outline: 1px solid #4371D0 !important; }\nmain { outline: 1px solid #2F4F90 !important; }\naddress { outline: 1px solid #1A2C51 !important; }\ndiv { outline: 1px solid #036CDB !important; }\np { outline: 1px solid #AC050B !important; }\nhr { outline: 1px solid #FF063F !important; }\npre { outline: 1px solid #850440 !important; }\nblockquote { outline: 1px solid #F1B8E7 !important; }\nol { outline: 1px solid #FF050C !important; }\nul { outline: 1px solid #D90416 !important; }\nli { outline: 1px solid #D90416 !important; }\ndl { outline: 1px solid #FD3427 !important; }\ndt { outline: 1px solid #FF0043 !important; }\ndd { outline: 1px solid #E80174 !important; }\nfigure { outline: 1px solid #FF00BB !important; }\nfigcaption { outline: 1px solid #BF0032 !important; }\ntable { outline: 1px solid #00CC99 !important; }\ncaption { outline: 1px solid #37FFC4 !important; }\nthead { outline: 1px solid #98DACA !important; }\ntbody { outline: 1px solid #64A7A0 !important; }\ntfoot { outline: 1px solid #22746B !important; }\ntr { outline: 1px solid #86C0B2 !important; }\nth { outline: 1px solid #A1E7D6 !important; }\ntd { outline: 1px solid #3F5A54 !important; }\ncol { outline: 1px solid #6C9A8F !important; }\ncolgroup { outline: 1px solid #6C9A9D !important; }\nbutton { outline: 1px solid #DA8301 !important; }\ndatalist { outline: 1px solid #C06000 !important; }\nfieldset { outline: 1px solid #D95100 !important; }\nform { outline: 1px solid #D23600 !important; }\ninput { outline: 1px solid #FCA600 !important; }\nkeygen { outline: 1px solid #B31E00 !important; }\nlabel { outline: 1px solid #EE8900 !important; }\nlegend { outline: 1px solid #DE6D00 !important; }\nmeter { outline: 1px solid #E8630C !important; }\noptgroup { outline: 1px solid #B33600 !important; }\noption { outline: 1px solid #FF8A00 !important; }\noutput { outline: 1px solid #FF9619 !important; }\nprogress { outline: 1px solid #E57C00 !important; }\nselect { outline: 1px solid #E26E0F !important; }\ntextarea { outline: 1px solid #CC5400 !important; }\ndetails { outline: 1px solid #33848F !important; }\nsummary { outline: 1px solid #60A1A6 !important; }\ncommand { outline: 1px solid #438DA1 !important; }\nmenu { outline: 1px solid #449DA6 !important; }\ndel { outline: 1px solid #BF0000 !important; }\nins { outline: 1px solid #400000 !important; }\nimg { outline: 1px solid #22746B !important; }\niframe { outline: 1px solid #64A7A0 !important; }\nembed { outline: 1px solid #98DACA !important; }\nobject { outline: 1px solid #00CC99 !important; }\nparam { outline: 1px solid #37FFC4 !important; }\nvideo { outline: 1px solid #6EE866 !important; }\naudio { outline: 1px solid #027353 !important; }\nsource { outline: 1px solid #012426 !important; }\ncanvas { outline: 1px solid #A2F570 !important; }\ntrack { outline: 1px solid #59A600 !important; }\nmap { outline: 1px solid #7BE500 !important; }\narea { outline: 1px solid #305900 !important; }\na { outline: 1px solid #FF62AB !important; }\nem { outline: 1px solid #800B41 !important; }\nstrong { outline: 1px solid #FF1583 !important; }\ni { outline: 1px solid #803156 !important; }\nb { outline: 1px solid #CC1169 !important; }\nu { outline: 1px solid #FF0430 !important; }\ns { outline: 1px solid #F805E3 !important; }\nsmall { outline: 1px solid #D107B2 !important; }\nabbr { outline: 1px solid #4A0263 !important; }\nq { outline: 1px solid #240018 !important; }\ncite { outline: 1px solid #64003C !important; }\ndfn { outline: 1px solid #B4005A !important; }\nsub { outline: 1px solid #DBA0C8 !important; }\nsup { outline: 1px solid #CC0256 !important; }\ntime { outline: 1px solid #D6606D !important; }\ncode { outline: 1px solid #E04251 !important; }\nkbd { outline: 1px solid #5E001F !important; }\nsamp { outline: 1px solid #9C0033 !important; }\nvar { outline: 1px solid #D90047 !important; }\nmark { outline: 1px solid #FF0053 !important; }\nbdi { outline: 1px solid #BF3668 !important; }\nbdo { outline: 1px solid #6F1400 !important; }\nruby { outline: 1px solid #FF7B93 !important; }\nrt { outline: 1px solid #FF2F54 !important; }\nrp { outline: 1px solid #803E49 !important; }\nspan { outline: 1px solid #CC2643 !important; }\nbr { outline: 1px solid #DB687D !important; }\nwbr { outline: 1px solid #DB175B !important; }\n\n" }, "tachyons-debug-children": { @@ -3671,8 +3671,8 @@ ] } ], - "readme": "# tachyons-debug-children 1.0.0\n\nTachyons module for debugging layout for all of an elements children\n\n#### Stats\n\n183 | 3 | 3\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-debug-children\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-debug-children\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-debug-children.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-debug-children\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n DEBUG CHILDREN\n Docs: http://tachyons.io/docs/debug/\n\n Just add the debug class to any element to see outlines on its\n children.\n\n*/\n.debug * { outline: 1px solid gold; }\n.debug-white * { outline: 1px solid white; }\n.debug-black * { outline: 1px solid black; }\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "/*\n\n DEBUG CHILDREN\n Docs: http://tachyons.io/docs/debug/\n\n Just add the debug class to any element to see outlines on its\n children.\n\n*/\n\n.debug * { outline: 1px solid gold; }\n.debug-white * { outline: 1px solid white; }\n.debug-black * { outline: 1px solid black; }\n\n", + "readme": "\n\n# DEBUG CHILDREN\n\nAdd the debug class to any element to see outlines on its\nchildren.\n\n### Docs\n\nhttp://tachyons.io/docs/debug/\n\n### Base\n\n- debug\n\n### Modifiers\n\n- `-white` = white outline\n- `-black` = black outline\n", + "src": "/*!!!\n\n# DEBUG CHILDREN\n\nAdd the debug class to any element to see outlines on its\nchildren.\n\n### Docs\n\nhttp://tachyons.io/docs/debug/\n\n### Base\n\n- debug\n\n### Modifiers\n\n- `-white` = white outline\n- `-black` = black outline\n*/\n\n.debug * { outline: 1px solid gold; }\n.debug-white * { outline: 1px solid white; }\n.debug-black * { outline: 1px solid black; }\n", "css": "/*\n\n DEBUG CHILDREN\n Docs: http://tachyons.io/docs/debug/\n\n Just add the debug class to any element to see outlines on its\n children.\n\n*/\n.debug * { outline: 1px solid gold; }\n.debug-white * { outline: 1px solid white; }\n.debug-black * { outline: 1px solid black; }\n\n" }, "tachyons-debug-grid": { @@ -3709,8 +3709,8 @@ ] } ], - "readme": "# tachyons-debug-grid 1.1.0\n\nBase CSS module for Tachyons\n\n#### Stats\n\n2070 | 4 | 4\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-debug-grid\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-debug-grid\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-debug-grid.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-debug-grid\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n DEBUG GRID\n http://tachyons.io/docs/debug-grid/\n\n Can be useful for debugging layout issues\n or helping to make sure things line up perfectly.\n Just tack one of these classes onto a parent element.\n\n*/\n.debug-grid { background: transparent url( data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MTRDOTY4N0U2N0VFMTFFNjg2MzZDQjkwNkQ4MjgwMEIiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MTRDOTY4N0Q2N0VFMTFFNjg2MzZDQjkwNkQ4MjgwMEIiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo3NjcyQkQ3NjY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo3NjcyQkQ3NzY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PsBS+GMAAAAjSURBVHjaYvz//z8DLsD4gcGXiYEAGBIKGBne//fFpwAgwAB98AaF2pjlUQAAAABJRU5ErkJggg== ) repeat top left; }\n.debug-grid-16 { background: transparent url( data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6ODYyRjhERDU2N0YyMTFFNjg2MzZDQjkwNkQ4MjgwMEIiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6ODYyRjhERDQ2N0YyMTFFNjg2MzZDQjkwNkQ4MjgwMEIiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo3NjcyQkQ3QTY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo3NjcyQkQ3QjY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PvCS01IAAABMSURBVHjaYmR4/5+BFPBfAMFm/MBgx8RAGWCn1AAmSg34Q6kBDKMGMDCwICeMIemF/5QawEipAWwUhwEjMDvbAWlWkvVBwu8vQIABAEwBCph8U6c0AAAAAElFTkSuQmCC ) repeat top left; }\n.debug-grid-8-solid { background: white url( data:image/jpeg;base64,/9j/4QAYRXhpZgAASUkqAAgAAAAAAAAAAAAAAP/sABFEdWNreQABAAQAAAAAAAD/4QMxaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLwA8P3hwYWNrZXQgYmVnaW49Iu+7vyIgaWQ9Ilc1TTBNcENlaGlIenJlU3pOVGN6a2M5ZCI/PiA8eDp4bXBtZXRhIHhtbG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJBZG9iZSBYTVAgQ29yZSA1LjYtYzExMSA3OS4xNTgzMjUsIDIwMTUvMDkvMTAtMDE6MTA6MjAgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDQyAyMDE1IChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkIxMjI0OTczNjdCMzExRTZCMkJDRTI0MDgxMDAyMTcxIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkIxMjI0OTc0NjdCMzExRTZCMkJDRTI0MDgxMDAyMTcxIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QjEyMjQ5NzE2N0IzMTFFNkIyQkNFMjQwODEwMDIxNzEiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QjEyMjQ5NzI2N0IzMTFFNkIyQkNFMjQwODEwMDIxNzEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7/7gAOQWRvYmUAZMAAAAAB/9sAhAAbGhopHSlBJiZBQi8vL0JHPz4+P0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHAR0pKTQmND8oKD9HPzU/R0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0f/wAARCAAIAAgDASIAAhEBAxEB/8QAWQABAQAAAAAAAAAAAAAAAAAAAAYBAQEAAAAAAAAAAAAAAAAAAAIEEAEBAAMBAAAAAAAAAAAAAAABADECA0ERAAEDBQAAAAAAAAAAAAAAAAARITFBUWESIv/aAAwDAQACEQMRAD8AoOnTV1QTD7JJshP3vSM3P//Z ) repeat top left; }\n.debug-grid-16-solid { background: white url( data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAACQkWg2AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NzY3MkJEN0U2N0M1MTFFNkIyQkNFMjQwODEwMDIxNzEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NzY3MkJEN0Y2N0M1MTFFNkIyQkNFMjQwODEwMDIxNzEiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo3NjcyQkQ3QzY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo3NjcyQkQ3RDY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pve6J3kAAAAzSURBVHjaYvz//z8D0UDsMwMjSRoYP5Gq4SPNbRjVMEQ1fCRDg+in/6+J1AJUxsgAEGAA31BAJMS0GYEAAAAASUVORK5CYII= ) repeat top left; }\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "/*\n\n DEBUG GRID\n http://tachyons.io/docs/debug-grid/\n\n Can be useful for debugging layout issues\n or helping to make sure things line up perfectly.\n Just tack one of these classes onto a parent element.\n\n*/\n\n.debug-grid {\n background:transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MTRDOTY4N0U2N0VFMTFFNjg2MzZDQjkwNkQ4MjgwMEIiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MTRDOTY4N0Q2N0VFMTFFNjg2MzZDQjkwNkQ4MjgwMEIiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo3NjcyQkQ3NjY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo3NjcyQkQ3NzY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PsBS+GMAAAAjSURBVHjaYvz//z8DLsD4gcGXiYEAGBIKGBne//fFpwAgwAB98AaF2pjlUQAAAABJRU5ErkJggg==) repeat top left;\n}\n\n.debug-grid-16 {\n background:transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6ODYyRjhERDU2N0YyMTFFNjg2MzZDQjkwNkQ4MjgwMEIiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6ODYyRjhERDQ2N0YyMTFFNjg2MzZDQjkwNkQ4MjgwMEIiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo3NjcyQkQ3QTY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo3NjcyQkQ3QjY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PvCS01IAAABMSURBVHjaYmR4/5+BFPBfAMFm/MBgx8RAGWCn1AAmSg34Q6kBDKMGMDCwICeMIemF/5QawEipAWwUhwEjMDvbAWlWkvVBwu8vQIABAEwBCph8U6c0AAAAAElFTkSuQmCC) repeat top left;\n}\n\n.debug-grid-8-solid {\n background:white url(data:image/jpeg;base64,/9j/4QAYRXhpZgAASUkqAAgAAAAAAAAAAAAAAP/sABFEdWNreQABAAQAAAAAAAD/4QMxaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLwA8P3hwYWNrZXQgYmVnaW49Iu+7vyIgaWQ9Ilc1TTBNcENlaGlIenJlU3pOVGN6a2M5ZCI/PiA8eDp4bXBtZXRhIHhtbG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJBZG9iZSBYTVAgQ29yZSA1LjYtYzExMSA3OS4xNTgzMjUsIDIwMTUvMDkvMTAtMDE6MTA6MjAgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDQyAyMDE1IChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkIxMjI0OTczNjdCMzExRTZCMkJDRTI0MDgxMDAyMTcxIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkIxMjI0OTc0NjdCMzExRTZCMkJDRTI0MDgxMDAyMTcxIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QjEyMjQ5NzE2N0IzMTFFNkIyQkNFMjQwODEwMDIxNzEiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QjEyMjQ5NzI2N0IzMTFFNkIyQkNFMjQwODEwMDIxNzEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7/7gAOQWRvYmUAZMAAAAAB/9sAhAAbGhopHSlBJiZBQi8vL0JHPz4+P0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHAR0pKTQmND8oKD9HPzU/R0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0f/wAARCAAIAAgDASIAAhEBAxEB/8QAWQABAQAAAAAAAAAAAAAAAAAAAAYBAQEAAAAAAAAAAAAAAAAAAAIEEAEBAAMBAAAAAAAAAAAAAAABADECA0ERAAEDBQAAAAAAAAAAAAAAAAARITFBUWESIv/aAAwDAQACEQMRAD8AoOnTV1QTD7JJshP3vSM3P//Z) repeat top left;\n}\n\n.debug-grid-16-solid {\n background:white url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAACQkWg2AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NzY3MkJEN0U2N0M1MTFFNkIyQkNFMjQwODEwMDIxNzEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NzY3MkJEN0Y2N0M1MTFFNkIyQkNFMjQwODEwMDIxNzEiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo3NjcyQkQ3QzY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo3NjcyQkQ3RDY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pve6J3kAAAAzSURBVHjaYvz//z8D0UDsMwMjSRoYP5Gq4SPNbRjVMEQ1fCRDg+in/6+J1AJUxsgAEGAA31BAJMS0GYEAAAAASUVORK5CYII=) repeat top left;\n}\n", + "readme": "\n\n# DEBUG GRID\n\nCan be useful for debugging layout issues\nor helping to make sure things line up perfectly.\nJust tack one of these classes onto a parent element.\n\n### Docs\n\nhttp://tachyons.io/docs/debug-grid/\n\n### Base\n\n- debug-grid\n\n### Modifiers\n\n- `-16` = 16px grid\n- `-8-solid` = solid 8px grid\n- `-16-solid` = solid 16px grid\n", + "src": "/*!!!\n\n# DEBUG GRID\n\nCan be useful for debugging layout issues\nor helping to make sure things line up perfectly.\nJust tack one of these classes onto a parent element.\n\n### Docs\n\nhttp://tachyons.io/docs/debug-grid/\n\n### Base\n\n- debug-grid\n\n### Modifiers\n\n- `-16` = 16px grid\n- `-8-solid` = solid 8px grid\n- `-16-solid` = solid 16px grid\n*/\n\n.debug-grid {\n background:transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAAFElEQVR4AWPAC97/9x0eCsAEPgwAVLshdpENIxcAAAAASUVORK5CYII=) repeat top left;\n}\n\n.debug-grid-16 {\n background:transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAMklEQVR4AWOgCLz/b0epAa6UGuBOqQHOQHLUgFEDnAbcBZ4UGwDOkiCnkIhdgNgNxAYAiYlD+8sEuo8AAAAASUVORK5CYII=) repeat top left;\n}\n\n.debug-grid-8-solid {\n background:white url(data:image/gif;base64,R0lGODdhCAAIAPEAAADw/wDx/////wAAACwAAAAACAAIAAACDZQvgaeb/lxbAIKA8y0AOw==) repeat top left;\n}\n\n.debug-grid-16-solid {\n background:white url(data:image/gif;base64,R0lGODdhEAAQAPEAAADw/wDx/xXy/////ywAAAAAEAAQAAACIZyPKckYDQFsb6ZqD85jZ2+BkwiRFKehhqQCQgDHcgwEBQA7) repeat top left;\n}\n", "css": "/*\n\n DEBUG GRID\n http://tachyons.io/docs/debug-grid/\n\n Can be useful for debugging layout issues\n or helping to make sure things line up perfectly.\n Just tack one of these classes onto a parent element.\n\n*/\n.debug-grid { background: transparent url( data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MTRDOTY4N0U2N0VFMTFFNjg2MzZDQjkwNkQ4MjgwMEIiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MTRDOTY4N0Q2N0VFMTFFNjg2MzZDQjkwNkQ4MjgwMEIiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo3NjcyQkQ3NjY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo3NjcyQkQ3NzY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PsBS+GMAAAAjSURBVHjaYvz//z8DLsD4gcGXiYEAGBIKGBne//fFpwAgwAB98AaF2pjlUQAAAABJRU5ErkJggg== ) repeat top left; }\n.debug-grid-16 { background: transparent url( data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6ODYyRjhERDU2N0YyMTFFNjg2MzZDQjkwNkQ4MjgwMEIiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6ODYyRjhERDQ2N0YyMTFFNjg2MzZDQjkwNkQ4MjgwMEIiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo3NjcyQkQ3QTY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo3NjcyQkQ3QjY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PvCS01IAAABMSURBVHjaYmR4/5+BFPBfAMFm/MBgx8RAGWCn1AAmSg34Q6kBDKMGMDCwICeMIemF/5QawEipAWwUhwEjMDvbAWlWkvVBwu8vQIABAEwBCph8U6c0AAAAAElFTkSuQmCC ) repeat top left; }\n.debug-grid-8-solid { background: white url( data:image/jpeg;base64,/9j/4QAYRXhpZgAASUkqAAgAAAAAAAAAAAAAAP/sABFEdWNreQABAAQAAAAAAAD/4QMxaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLwA8P3hwYWNrZXQgYmVnaW49Iu+7vyIgaWQ9Ilc1TTBNcENlaGlIenJlU3pOVGN6a2M5ZCI/PiA8eDp4bXBtZXRhIHhtbG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJBZG9iZSBYTVAgQ29yZSA1LjYtYzExMSA3OS4xNTgzMjUsIDIwMTUvMDkvMTAtMDE6MTA6MjAgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDQyAyMDE1IChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkIxMjI0OTczNjdCMzExRTZCMkJDRTI0MDgxMDAyMTcxIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkIxMjI0OTc0NjdCMzExRTZCMkJDRTI0MDgxMDAyMTcxIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QjEyMjQ5NzE2N0IzMTFFNkIyQkNFMjQwODEwMDIxNzEiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QjEyMjQ5NzI2N0IzMTFFNkIyQkNFMjQwODEwMDIxNzEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7/7gAOQWRvYmUAZMAAAAAB/9sAhAAbGhopHSlBJiZBQi8vL0JHPz4+P0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHAR0pKTQmND8oKD9HPzU/R0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0f/wAARCAAIAAgDASIAAhEBAxEB/8QAWQABAQAAAAAAAAAAAAAAAAAAAAYBAQEAAAAAAAAAAAAAAAAAAAIEEAEBAAMBAAAAAAAAAAAAAAABADECA0ERAAEDBQAAAAAAAAAAAAAAAAARITFBUWESIv/aAAwDAQACEQMRAD8AoOnTV1QTD7JJshP3vSM3P//Z ) repeat top left; }\n.debug-grid-16-solid { background: white url( data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAACQkWg2AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NzY3MkJEN0U2N0M1MTFFNkIyQkNFMjQwODEwMDIxNzEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NzY3MkJEN0Y2N0M1MTFFNkIyQkNFMjQwODEwMDIxNzEiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo3NjcyQkQ3QzY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo3NjcyQkQ3RDY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pve6J3kAAAAzSURBVHjaYvz//z8D0UDsMwMjSRoYP5Gq4SPNbRjVMEQ1fCRDg+in/6+J1AJUxsgAEGAA31BAJMS0GYEAAAAASUVORK5CYII= ) repeat top left; }\n\n" }, "tachyons-display": { @@ -4059,8 +4059,8 @@ ] } ], - "readme": "# tachyons-display 5.0.0\n\nPerformance based css module.\n\n#### Stats\n\n534 | 48 | 52\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-display\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-display\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-display.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-display\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\n/*\n\n DISPLAY\n\n Base:\n d = display\n\n Modifiers:\n n = none\n b = block\n ib = inline-block\n it = inline-table\n t = table\n tc = table-cell\n tr = table-row\n tcol = table-column\n tcolg = table-column-group\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n.dn { display: none; }\n.di { display: inline; }\n.db { display: block; }\n.dib { display: inline-block; }\n.dit { display: inline-table; }\n.dt { display: table; }\n.dtc { display: table-cell; }\n.dt-row { display: table-row; }\n.dt-row-group { display: table-row-group; }\n.dt-column { display: table-column; }\n.dt-column-group { display: table-column-group; }\n/*\n This will set table to full width and then\n all cells will be equal width\n*/\n.dt--fixed { table-layout: fixed; width: 100%; }\n@media screen and (min-width: 30em) {\n .dn-ns { display: none; }\n .di-ns { display: inline; }\n .db-ns { display: block; }\n .dib-ns { display: inline-block; }\n .dit-ns { display: inline-table; }\n .dt-ns { display: table; }\n .dtc-ns { display: table-cell; }\n .dt-row-ns { display: table-row; }\n .dt-row-group-ns { display: table-row-group; }\n .dt-column-ns { display: table-column; }\n .dt-column-group-ns { display: table-column-group; }\n .dt--fixed-ns { table-layout: fixed; width: 100%; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .dn-m { display: none; }\n .di-m { display: inline; }\n .db-m { display: block; }\n .dib-m { display: inline-block; }\n .dit-m { display: inline-table; }\n .dt-m { display: table; }\n .dtc-m { display: table-cell; }\n .dt-row-m { display: table-row; }\n .dt-row-group-m { display: table-row-group; }\n .dt-column-m { display: table-column; }\n .dt-column-group-m { display: table-column-group; }\n .dt--fixed-m { table-layout: fixed; width: 100%; }\n}\n@media screen and (min-width: 60em) {\n .dn-l { display: none; }\n .di-l { display: inline; }\n .db-l { display: block; }\n .dib-l { display: inline-block; }\n .dit-l { display: inline-table; }\n .dt-l { display: table; }\n .dtc-l { display: table-cell; }\n .dt-row-l { display: table-row; }\n .dt-row-group-l { display: table-row-group; }\n .dt-column-l { display: table-column; }\n .dt-column-group-l { display: table-column-group; }\n .dt--fixed-l { table-layout: fixed; width: 100%; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n DISPLAY\n\n Base:\n d = display\n\n Modifiers:\n n = none\n b = block\n ib = inline-block\n it = inline-table\n t = table\n tc = table-cell\n tr = table-row\n tcol = table-column\n tcolg = table-column-group\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n\n.dn { display: none; }\n.di { display: inline; }\n.db { display: block; }\n.dib { display: inline-block; }\n.dit { display: inline-table; }\n.dt { display: table; }\n.dtc { display: table-cell; }\n.dt-row { display: table-row; }\n.dt-row-group { display: table-row-group; }\n.dt-column { display: table-column; }\n.dt-column-group { display: table-column-group; }\n\n/*\n This will set table to full width and then\n all cells will be equal width\n*/\n.dt--fixed {\n table-layout: fixed;\n width: 100%;\n}\n\n@media (--breakpoint-not-small) {\n .dn-ns { display: none; }\n .di-ns { display: inline; }\n .db-ns { display: block; }\n .dib-ns { display: inline-block; }\n .dit-ns { display: inline-table; }\n .dt-ns { display: table; }\n .dtc-ns { display: table-cell; }\n .dt-row-ns { display: table-row; }\n .dt-row-group-ns { display: table-row-group; }\n .dt-column-ns { display: table-column; }\n .dt-column-group-ns { display: table-column-group; }\n\n .dt--fixed-ns {\n table-layout: fixed;\n width: 100%;\n }\n}\n\n@media (--breakpoint-medium) {\n .dn-m { display: none; }\n .di-m { display: inline; }\n .db-m { display: block; }\n .dib-m { display: inline-block; }\n .dit-m { display: inline-table; }\n .dt-m { display: table; }\n .dtc-m { display: table-cell; }\n .dt-row-m { display: table-row; }\n .dt-row-group-m { display: table-row-group; }\n .dt-column-m { display: table-column; }\n .dt-column-group-m { display: table-column-group; }\n\n .dt--fixed-m {\n table-layout: fixed;\n width: 100%;\n }\n}\n\n@media (--breakpoint-large) {\n .dn-l { display: none; }\n .di-l { display: inline; }\n .db-l { display: block; }\n .dib-l { display: inline-block; }\n .dit-l { display: inline-table; }\n .dt-l { display: table; }\n .dtc-l { display: table-cell; }\n .dt-row-l { display: table-row; }\n .dt-row-group-l { display: table-row-group; }\n .dt-column-l { display: table-column; }\n .dt-column-group-l { display: table-column-group; }\n\n .dt--fixed-l {\n table-layout: fixed;\n width: 100%;\n }\n}\n\n", + "readme": "\n\n# DISPLAY\n\n### Docs\n\nhttp://tachyons.io/docs/layout/display\n\n### Base\n\n- d = display\n\n### Modifiers\n\n- n = none\n- b = block\n- ib = inline-block\n- it = inline-table\n- t = table\n- tc = table-cell\n- t-row = table-row\n- t-columm = table-column\n- t-column-group = table-column-group\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# DISPLAY\n\n### Docs\n\nhttp://tachyons.io/docs/layout/display\n\n### Base\n\n- d = display\n\n### Modifiers\n\n- n = none\n- b = block\n- ib = inline-block\n- it = inline-table\n- t = table\n- tc = table-cell\n- t-row = table-row\n- t-columm = table-column\n- t-column-group = table-column-group\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n.dn { display: none; }\n.di { display: inline; }\n.db { display: block; }\n.dib { display: inline-block; }\n.dit { display: inline-table; }\n.dt { display: table; }\n.dtc { display: table-cell; }\n.dt-row { display: table-row; }\n\n/*\n This will set table to full width and then\n all cells will be equal width\n*/\n.dt--fixed {\n table-layout: fixed;\n width: 100%;\n}\n\n@media (--breakpoint-small) {\n .dn-s { display: none; }\n .di-s { display: inline; }\n .db-s { display: block; }\n .dib-s { display: inline-block; }\n .dit-s { display: inline-table; }\n .dt-s { display: table; }\n .dtc-s { display: table-cell; }\n .dt-row-s { display: table-row; }\n\n .dt--fixed-s {\n table-layout: fixed;\n width: 100%;\n }\n}\n\n@media (--breakpoint-medium) {\n .dn-m { display: none; }\n .di-m { display: inline; }\n .db-m { display: block; }\n .dib-m { display: inline-block; }\n .dit-m { display: inline-table; }\n .dt-m { display: table; }\n .dtc-m { display: table-cell; }\n .dt-row-m { display: table-row; }\n .dt-row-group-m { display: table-row-group; }\n .dt-column-m { display: table-column; }\n .dt-column-group-m { display: table-column-group; }\n\n .dt--fixed-m {\n table-layout: fixed;\n width: 100%;\n }\n}\n\n@media (--breakpoint-large) {\n .dn-l { display: none; }\n .di-l { display: inline; }\n .db-l { display: block; }\n .dib-l { display: inline-block; }\n .dit-l { display: inline-table; }\n .dt-l { display: table; }\n .dtc-l { display: table-cell; }\n .dt-row-l { display: table-row; }\n\n .dt--fixed-l {\n table-layout: fixed;\n width: 100%;\n }\n}\n", "css": "/*\n\n DISPLAY\n\n Base:\n d = display\n\n Modifiers:\n n = none\n b = block\n ib = inline-block\n it = inline-table\n t = table\n tc = table-cell\n tr = table-row\n tcol = table-column\n tcolg = table-column-group\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n.dn { display: none; }\n.di { display: inline; }\n.db { display: block; }\n.dib { display: inline-block; }\n.dit { display: inline-table; }\n.dt { display: table; }\n.dtc { display: table-cell; }\n.dt-row { display: table-row; }\n.dt-row-group { display: table-row-group; }\n.dt-column { display: table-column; }\n.dt-column-group { display: table-column-group; }\n/*\n This will set table to full width and then\n all cells will be equal width\n*/\n.dt--fixed { table-layout: fixed; width: 100%; }\n@media screen and (min-width: 30em) {\n .dn-ns { display: none; }\n .di-ns { display: inline; }\n .db-ns { display: block; }\n .dib-ns { display: inline-block; }\n .dit-ns { display: inline-table; }\n .dt-ns { display: table; }\n .dtc-ns { display: table-cell; }\n .dt-row-ns { display: table-row; }\n .dt-row-group-ns { display: table-row-group; }\n .dt-column-ns { display: table-column; }\n .dt-column-group-ns { display: table-column-group; }\n .dt--fixed-ns { table-layout: fixed; width: 100%; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .dn-m { display: none; }\n .di-m { display: inline; }\n .db-m { display: block; }\n .dib-m { display: inline-block; }\n .dit-m { display: inline-table; }\n .dt-m { display: table; }\n .dtc-m { display: table-cell; }\n .dt-row-m { display: table-row; }\n .dt-row-group-m { display: table-row-group; }\n .dt-column-m { display: table-column; }\n .dt-column-group-m { display: table-column-group; }\n .dt--fixed-m { table-layout: fixed; width: 100%; }\n}\n@media screen and (min-width: 60em) {\n .dn-l { display: none; }\n .di-l { display: inline; }\n .db-l { display: block; }\n .dib-l { display: inline-block; }\n .dit-l { display: inline-table; }\n .dt-l { display: table; }\n .dtc-l { display: table-cell; }\n .dt-row-l { display: table-row; }\n .dt-row-group-l { display: table-row-group; }\n .dt-column-l { display: table-column; }\n .dt-column-group-l { display: table-column-group; }\n .dt--fixed-l { table-layout: fixed; width: 100%; }\n}\n\n" }, "tachyons-flexbox": { @@ -5689,8 +5689,8 @@ ] } ], - "readme": "# tachyons-flexbox 2.1.0\n\nFlexbox CSS module for Tachyons\n\n#### Stats\n\n1662 | 184 | 516\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-flexbox\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-flexbox\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-flexbox.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-flexbox\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n FLEXBOX\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n.flex { display: -webkit-box; display: -ms-flexbox; display: flex; }\n.inline-flex { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; }\n/* 1. Fix for Chrome 44 bug.\n * https://code.google.com/p/chromium/issues/detail?id=506893 */\n.flex-auto { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; /* 1 */ min-height: 0; /* 1 */ }\n.flex-none { -webkit-box-flex: 0; -ms-flex: none; flex: none; }\n.flex-column { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }\n.flex-row { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }\n.flex-wrap { -ms-flex-wrap: wrap; flex-wrap: wrap; }\n.flex-nowrap { -ms-flex-wrap: nowrap; flex-wrap: nowrap; }\n.flex-wrap-reverse { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; }\n.flex-column-reverse { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; }\n.flex-row-reverse { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; }\n.items-start { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }\n.items-end { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; }\n.items-center { -webkit-box-align: center; -ms-flex-align: center; align-items: center; }\n.items-baseline { -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; }\n.items-stretch { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }\n.self-start { -ms-flex-item-align: start; align-self: flex-start; }\n.self-end { -ms-flex-item-align: end; align-self: flex-end; }\n.self-center { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; }\n.self-baseline { -ms-flex-item-align: baseline; align-self: baseline; }\n.self-stretch { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; }\n.justify-start { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }\n.justify-end { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }\n.justify-center { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }\n.justify-between { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }\n.justify-around { -ms-flex-pack: distribute; justify-content: space-around; }\n.content-start { -ms-flex-line-pack: start; align-content: flex-start; }\n.content-end { -ms-flex-line-pack: end; align-content: flex-end; }\n.content-center { -ms-flex-line-pack: center; align-content: center; }\n.content-between { -ms-flex-line-pack: justify; align-content: space-between; }\n.content-around { -ms-flex-line-pack: distribute; align-content: space-around; }\n.content-stretch { -ms-flex-line-pack: stretch; align-content: stretch; }\n.order-0 { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; }\n.order-1 { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; }\n.order-2 { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; }\n.order-3 { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; }\n.order-4 { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; }\n.order-5 { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; }\n.order-6 { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; }\n.order-7 { -webkit-box-ordinal-group: 8; -ms-flex-order: 7; order: 7; }\n.order-8 { -webkit-box-ordinal-group: 9; -ms-flex-order: 8; order: 8; }\n.order-last { -webkit-box-ordinal-group: 100000; -ms-flex-order: 99999; order: 99999; }\n.flex-grow-0 { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; }\n.flex-grow-1 { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }\n.flex-shrink-0 { -ms-flex-negative: 0; flex-shrink: 0; }\n.flex-shrink-1 { -ms-flex-negative: 1; flex-shrink: 1; }\n@media screen and (min-width: 30em) {\n .flex-ns { display: -webkit-box; display: -ms-flexbox; display: flex; }\n .inline-flex-ns { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; }\n .flex-auto-ns { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; /* 1 */ min-height: 0; /* 1 */ }\n .flex-none-ns { -webkit-box-flex: 0; -ms-flex: none; flex: none; }\n .flex-column-ns { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }\n .flex-row-ns { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }\n .flex-wrap-ns { -ms-flex-wrap: wrap; flex-wrap: wrap; }\n .flex-nowrap-ns { -ms-flex-wrap: nowrap; flex-wrap: nowrap; }\n .flex-wrap-reverse-ns { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; }\n .flex-column-reverse-ns { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; }\n .flex-row-reverse-ns { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; }\n .items-start-ns { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }\n .items-end-ns { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; }\n .items-center-ns { -webkit-box-align: center; -ms-flex-align: center; align-items: center; }\n .items-baseline-ns { -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; }\n .items-stretch-ns { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }\n .self-start-ns { -ms-flex-item-align: start; align-self: flex-start; }\n .self-end-ns { -ms-flex-item-align: end; align-self: flex-end; }\n .self-center-ns { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; }\n .self-baseline-ns { -ms-flex-item-align: baseline; align-self: baseline; }\n .self-stretch-ns { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; }\n .justify-start-ns { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }\n .justify-end-ns { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }\n .justify-center-ns { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }\n .justify-between-ns { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }\n .justify-around-ns { -ms-flex-pack: distribute; justify-content: space-around; }\n .content-start-ns { -ms-flex-line-pack: start; align-content: flex-start; }\n .content-end-ns { -ms-flex-line-pack: end; align-content: flex-end; }\n .content-center-ns { -ms-flex-line-pack: center; align-content: center; }\n .content-between-ns { -ms-flex-line-pack: justify; align-content: space-between; }\n .content-around-ns { -ms-flex-line-pack: distribute; align-content: space-around; }\n .content-stretch-ns { -ms-flex-line-pack: stretch; align-content: stretch; }\n .order-0-ns { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; }\n .order-1-ns { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; }\n .order-2-ns { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; }\n .order-3-ns { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; }\n .order-4-ns { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; }\n .order-5-ns { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; }\n .order-6-ns { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; }\n .order-7-ns { -webkit-box-ordinal-group: 8; -ms-flex-order: 7; order: 7; }\n .order-8-ns { -webkit-box-ordinal-group: 9; -ms-flex-order: 8; order: 8; }\n .order-last-ns { -webkit-box-ordinal-group: 100000; -ms-flex-order: 99999; order: 99999; }\n .flex-grow-0-ns { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; }\n .flex-grow-1-ns { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }\n .flex-shrink-0-ns { -ms-flex-negative: 0; flex-shrink: 0; }\n .flex-shrink-1-ns { -ms-flex-negative: 1; flex-shrink: 1; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .flex-m { display: -webkit-box; display: -ms-flexbox; display: flex; }\n .inline-flex-m { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; }\n .flex-auto-m { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; /* 1 */ min-height: 0; /* 1 */ }\n .flex-none-m { -webkit-box-flex: 0; -ms-flex: none; flex: none; }\n .flex-column-m { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }\n .flex-row-m { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }\n .flex-wrap-m { -ms-flex-wrap: wrap; flex-wrap: wrap; }\n .flex-nowrap-m { -ms-flex-wrap: nowrap; flex-wrap: nowrap; }\n .flex-wrap-reverse-m { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; }\n .flex-column-reverse-m { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; }\n .flex-row-reverse-m { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; }\n .items-start-m { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }\n .items-end-m { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; }\n .items-center-m { -webkit-box-align: center; -ms-flex-align: center; align-items: center; }\n .items-baseline-m { -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; }\n .items-stretch-m { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }\n .self-start-m { -ms-flex-item-align: start; align-self: flex-start; }\n .self-end-m { -ms-flex-item-align: end; align-self: flex-end; }\n .self-center-m { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; }\n .self-baseline-m { -ms-flex-item-align: baseline; align-self: baseline; }\n .self-stretch-m { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; }\n .justify-start-m { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }\n .justify-end-m { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }\n .justify-center-m { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }\n .justify-between-m { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }\n .justify-around-m { -ms-flex-pack: distribute; justify-content: space-around; }\n .content-start-m { -ms-flex-line-pack: start; align-content: flex-start; }\n .content-end-m { -ms-flex-line-pack: end; align-content: flex-end; }\n .content-center-m { -ms-flex-line-pack: center; align-content: center; }\n .content-between-m { -ms-flex-line-pack: justify; align-content: space-between; }\n .content-around-m { -ms-flex-line-pack: distribute; align-content: space-around; }\n .content-stretch-m { -ms-flex-line-pack: stretch; align-content: stretch; }\n .order-0-m { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; }\n .order-1-m { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; }\n .order-2-m { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; }\n .order-3-m { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; }\n .order-4-m { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; }\n .order-5-m { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; }\n .order-6-m { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; }\n .order-7-m { -webkit-box-ordinal-group: 8; -ms-flex-order: 7; order: 7; }\n .order-8-m { -webkit-box-ordinal-group: 9; -ms-flex-order: 8; order: 8; }\n .order-last-m { -webkit-box-ordinal-group: 100000; -ms-flex-order: 99999; order: 99999; }\n .flex-grow-0-m { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; }\n .flex-grow-1-m { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }\n .flex-shrink-0-m { -ms-flex-negative: 0; flex-shrink: 0; }\n .flex-shrink-1-m { -ms-flex-negative: 1; flex-shrink: 1; }\n}\n@media screen and (min-width: 60em) {\n .flex-l { display: -webkit-box; display: -ms-flexbox; display: flex; }\n .inline-flex-l { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; }\n .flex-auto-l { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; /* 1 */ min-height: 0; /* 1 */ }\n .flex-none-l { -webkit-box-flex: 0; -ms-flex: none; flex: none; }\n .flex-column-l { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }\n .flex-row-l { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }\n .flex-wrap-l { -ms-flex-wrap: wrap; flex-wrap: wrap; }\n .flex-nowrap-l { -ms-flex-wrap: nowrap; flex-wrap: nowrap; }\n .flex-wrap-reverse-l { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; }\n .flex-column-reverse-l { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; }\n .flex-row-reverse-l { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; }\n .items-start-l { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }\n .items-end-l { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; }\n .items-center-l { -webkit-box-align: center; -ms-flex-align: center; align-items: center; }\n .items-baseline-l { -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; }\n .items-stretch-l { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }\n .self-start-l { -ms-flex-item-align: start; align-self: flex-start; }\n .self-end-l { -ms-flex-item-align: end; align-self: flex-end; }\n .self-center-l { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; }\n .self-baseline-l { -ms-flex-item-align: baseline; align-self: baseline; }\n .self-stretch-l { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; }\n .justify-start-l { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }\n .justify-end-l { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }\n .justify-center-l { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }\n .justify-between-l { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }\n .justify-around-l { -ms-flex-pack: distribute; justify-content: space-around; }\n .content-start-l { -ms-flex-line-pack: start; align-content: flex-start; }\n .content-end-l { -ms-flex-line-pack: end; align-content: flex-end; }\n .content-center-l { -ms-flex-line-pack: center; align-content: center; }\n .content-between-l { -ms-flex-line-pack: justify; align-content: space-between; }\n .content-around-l { -ms-flex-line-pack: distribute; align-content: space-around; }\n .content-stretch-l { -ms-flex-line-pack: stretch; align-content: stretch; }\n .order-0-l { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; }\n .order-1-l { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; }\n .order-2-l { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; }\n .order-3-l { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; }\n .order-4-l { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; }\n .order-5-l { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; }\n .order-6-l { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; }\n .order-7-l { -webkit-box-ordinal-group: 8; -ms-flex-order: 7; order: 7; }\n .order-8-l { -webkit-box-ordinal-group: 9; -ms-flex-order: 8; order: 8; }\n .order-last-l { -webkit-box-ordinal-group: 100000; -ms-flex-order: 99999; order: 99999; }\n .flex-grow-0-l { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; }\n .flex-grow-1-l { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }\n .flex-shrink-0-l { -ms-flex-negative: 0; flex-shrink: 0; }\n .flex-shrink-1-l { -ms-flex-negative: 1; flex-shrink: 1; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n FLEXBOX\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n\n.flex { display: flex; }\n.inline-flex { display: inline-flex; }\n\n/* 1. Fix for Chrome 44 bug.\n * https://code.google.com/p/chromium/issues/detail?id=506893 */\n.flex-auto {\n flex: 1 1 auto;\n min-width: 0; /* 1 */\n min-height: 0; /* 1 */\n}\n\n.flex-none { flex: none; }\n\n.flex-column { flex-direction: column; }\n.flex-row { flex-direction: row; }\n.flex-wrap { flex-wrap: wrap; }\n.flex-nowrap { flex-wrap: nowrap; }\n.flex-wrap-reverse { flex-wrap: wrap-reverse; }\n.flex-column-reverse { flex-direction: column-reverse; }\n.flex-row-reverse { flex-direction: row-reverse; }\n\n.items-start { align-items: flex-start; }\n.items-end { align-items: flex-end; }\n.items-center { align-items: center; }\n.items-baseline { align-items: baseline; }\n.items-stretch { align-items: stretch; }\n\n.self-start { align-self: flex-start; }\n.self-end { align-self: flex-end; }\n.self-center { align-self: center; }\n.self-baseline { align-self: baseline; }\n.self-stretch { align-self: stretch; }\n\n.justify-start { justify-content: flex-start; }\n.justify-end { justify-content: flex-end; }\n.justify-center { justify-content: center; }\n.justify-between { justify-content: space-between; }\n.justify-around { justify-content: space-around; }\n\n.content-start { align-content: flex-start; }\n.content-end { align-content: flex-end; }\n.content-center { align-content: center; }\n.content-between { align-content: space-between; }\n.content-around { align-content: space-around; }\n.content-stretch { align-content: stretch; }\n\n.order-0 { order: 0; }\n.order-1 { order: 1; }\n.order-2 { order: 2; }\n.order-3 { order: 3; }\n.order-4 { order: 4; }\n.order-5 { order: 5; }\n.order-6 { order: 6; }\n.order-7 { order: 7; }\n.order-8 { order: 8; }\n.order-last { order: 99999; }\n\n.flex-grow-0 { flex-grow: 0; }\n.flex-grow-1 { flex-grow: 1; }\n\n.flex-shrink-0 { flex-shrink: 0; }\n.flex-shrink-1 { flex-shrink: 1; }\n\n@media (--breakpoint-not-small) {\n .flex-ns { display: flex; }\n .inline-flex-ns { display: inline-flex; }\n .flex-auto-ns {\n flex: 1 1 auto;\n min-width: 0; /* 1 */\n min-height: 0; /* 1 */\n }\n .flex-none-ns { flex: none; }\n .flex-column-ns { flex-direction: column; }\n .flex-row-ns { flex-direction: row; }\n .flex-wrap-ns { flex-wrap: wrap; }\n .flex-nowrap-ns { flex-wrap: nowrap; }\n .flex-wrap-reverse-ns { flex-wrap: wrap-reverse; }\n .flex-column-reverse-ns { flex-direction: column-reverse; }\n .flex-row-reverse-ns { flex-direction: row-reverse; }\n .items-start-ns { align-items: flex-start; }\n .items-end-ns { align-items: flex-end; }\n .items-center-ns { align-items: center; }\n .items-baseline-ns { align-items: baseline; }\n .items-stretch-ns { align-items: stretch; }\n\n .self-start-ns { align-self: flex-start; }\n .self-end-ns { align-self: flex-end; }\n .self-center-ns { align-self: center; }\n .self-baseline-ns { align-self: baseline; }\n .self-stretch-ns { align-self: stretch; }\n\n .justify-start-ns { justify-content: flex-start; }\n .justify-end-ns { justify-content: flex-end; }\n .justify-center-ns { justify-content: center; }\n .justify-between-ns { justify-content: space-between; }\n .justify-around-ns { justify-content: space-around; }\n\n .content-start-ns { align-content: flex-start; }\n .content-end-ns { align-content: flex-end; }\n .content-center-ns { align-content: center; }\n .content-between-ns { align-content: space-between; }\n .content-around-ns { align-content: space-around; }\n .content-stretch-ns { align-content: stretch; }\n\n .order-0-ns { order: 0; }\n .order-1-ns { order: 1; }\n .order-2-ns { order: 2; }\n .order-3-ns { order: 3; }\n .order-4-ns { order: 4; }\n .order-5-ns { order: 5; }\n .order-6-ns { order: 6; }\n .order-7-ns { order: 7; }\n .order-8-ns { order: 8; }\n .order-last-ns { order: 99999; }\n\n .flex-grow-0-ns { flex-grow: 0; }\n .flex-grow-1-ns { flex-grow: 1; }\n\n .flex-shrink-0-ns { flex-shrink: 0; }\n .flex-shrink-1-ns { flex-shrink: 1; }\n}\n@media (--breakpoint-medium) {\n .flex-m { display: flex; }\n .inline-flex-m { display: inline-flex; }\n .flex-auto-m {\n flex: 1 1 auto;\n min-width: 0; /* 1 */\n min-height: 0; /* 1 */\n }\n .flex-none-m { flex: none; }\n .flex-column-m { flex-direction: column; }\n .flex-row-m { flex-direction: row; }\n .flex-wrap-m { flex-wrap: wrap; }\n .flex-nowrap-m { flex-wrap: nowrap; }\n .flex-wrap-reverse-m { flex-wrap: wrap-reverse; }\n .flex-column-reverse-m { flex-direction: column-reverse; }\n .flex-row-reverse-m { flex-direction: row-reverse; }\n .items-start-m { align-items: flex-start; }\n .items-end-m { align-items: flex-end; }\n .items-center-m { align-items: center; }\n .items-baseline-m { align-items: baseline; }\n .items-stretch-m { align-items: stretch; }\n\n .self-start-m { align-self: flex-start; }\n .self-end-m { align-self: flex-end; }\n .self-center-m { align-self: center; }\n .self-baseline-m { align-self: baseline; }\n .self-stretch-m { align-self: stretch; }\n\n .justify-start-m { justify-content: flex-start; }\n .justify-end-m { justify-content: flex-end; }\n .justify-center-m { justify-content: center; }\n .justify-between-m { justify-content: space-between; }\n .justify-around-m { justify-content: space-around; }\n\n .content-start-m { align-content: flex-start; }\n .content-end-m { align-content: flex-end; }\n .content-center-m { align-content: center; }\n .content-between-m { align-content: space-between; }\n .content-around-m { align-content: space-around; }\n .content-stretch-m { align-content: stretch; }\n\n .order-0-m { order: 0; }\n .order-1-m { order: 1; }\n .order-2-m { order: 2; }\n .order-3-m { order: 3; }\n .order-4-m { order: 4; }\n .order-5-m { order: 5; }\n .order-6-m { order: 6; }\n .order-7-m { order: 7; }\n .order-8-m { order: 8; }\n .order-last-m { order: 99999; }\n\n .flex-grow-0-m { flex-grow: 0; }\n .flex-grow-1-m { flex-grow: 1; }\n\n .flex-shrink-0-m { flex-shrink: 0; }\n .flex-shrink-1-m { flex-shrink: 1; }\n}\n\n@media (--breakpoint-large) {\n .flex-l { display: flex; }\n .inline-flex-l { display: inline-flex; }\n .flex-auto-l {\n flex: 1 1 auto;\n min-width: 0; /* 1 */\n min-height: 0; /* 1 */\n }\n .flex-none-l { flex: none; }\n .flex-column-l { flex-direction: column; }\n .flex-row-l { flex-direction: row; }\n .flex-wrap-l { flex-wrap: wrap; }\n .flex-nowrap-l { flex-wrap: nowrap; }\n .flex-wrap-reverse-l { flex-wrap: wrap-reverse; }\n .flex-column-reverse-l { flex-direction: column-reverse; }\n .flex-row-reverse-l { flex-direction: row-reverse; }\n\n .items-start-l { align-items: flex-start; }\n .items-end-l { align-items: flex-end; }\n .items-center-l { align-items: center; }\n .items-baseline-l { align-items: baseline; }\n .items-stretch-l { align-items: stretch; }\n\n .self-start-l { align-self: flex-start; }\n .self-end-l { align-self: flex-end; }\n .self-center-l { align-self: center; }\n .self-baseline-l { align-self: baseline; }\n .self-stretch-l { align-self: stretch; }\n\n .justify-start-l { justify-content: flex-start; }\n .justify-end-l { justify-content: flex-end; }\n .justify-center-l { justify-content: center; }\n .justify-between-l { justify-content: space-between; }\n .justify-around-l { justify-content: space-around; }\n\n .content-start-l { align-content: flex-start; }\n .content-end-l { align-content: flex-end; }\n .content-center-l { align-content: center; }\n .content-between-l { align-content: space-between; }\n .content-around-l { align-content: space-around; }\n .content-stretch-l { align-content: stretch; }\n\n .order-0-l { order: 0; }\n .order-1-l { order: 1; }\n .order-2-l { order: 2; }\n .order-3-l { order: 3; }\n .order-4-l { order: 4; }\n .order-5-l { order: 5; }\n .order-6-l { order: 6; }\n .order-7-l { order: 7; }\n .order-8-l { order: 8; }\n .order-last-l { order: 99999; }\n\n .flex-grow-0-l { flex-grow: 0; }\n .flex-grow-1-l { flex-grow: 1; }\n\n .flex-shrink-0-l { flex-shrink: 0; }\n .flex-shrink-1-l { flex-shrink: 1; }\n}\n", + "readme": "\n\n# FLEXBOX\n\n### Docs\n\nhttp://tachyons.io/docs/layout/flexbox/\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# FLEXBOX\n\n### Docs\n\nhttp://tachyons.io/docs/layout/flexbox/\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n.flex { display: flex; }\n.inline-flex { display: inline-flex; }\n\n.flex-1 { flex: 1; }\n.flex-auto { flex: 1 1 auto; }\n.flex-initial { flex: initial; }\n.flex-none { flex: none; }\n\n.flex-column { flex-direction: column; }\n.flex-row { flex-direction: row; }\n.flex-wrap { flex-wrap: wrap; }\n.flex-nowrap { flex-wrap: nowrap; }\n.flex-wrap-reverse { flex-wrap: wrap-reverse; }\n.flex-column-reverse { flex-direction: column-reverse; }\n.flex-row-reverse { flex-direction: row-reverse; }\n\n.items-start { align-items: flex-start; }\n.items-end { align-items: flex-end; }\n.items-center { align-items: center; }\n.items-baseline { align-items: baseline; }\n.items-stretch { align-items: stretch; }\n\n.self-start { align-self: flex-start; }\n.self-end { align-self: flex-end; }\n.self-center { align-self: center; }\n.self-baseline { align-self: baseline; }\n.self-stretch { align-self: stretch; }\n\n.justify-start { justify-content: flex-start; }\n.justify-end { justify-content: flex-end; }\n.justify-center { justify-content: center; }\n.justify-between { justify-content: space-between; }\n.justify-around { justify-content: space-around; }\n\n.content-start { align-content: flex-start; }\n.content-end { align-content: flex-end; }\n.content-center { align-content: center; }\n.content-between { align-content: space-between; }\n.content-around { align-content: space-around; }\n.content-stretch { align-content: stretch; }\n\n.order-0 { order: 0; }\n.order-1 { order: 1; }\n.order-2 { order: 2; }\n.order-3 { order: 3; }\n.order-4 { order: 4; }\n.order-5 { order: 5; }\n.order-6 { order: 6; }\n.order-7 { order: 7; }\n.order-8 { order: 8; }\n.order-last { order: 99999; }\n\n.flex-grow-0 { flex-grow: 0; }\n.flex-grow-1 { flex-grow: 1; }\n\n.flex-shrink-0 { flex-shrink: 0; }\n.flex-shrink-1 { flex-shrink: 1; }\n\n@media (--breakpoint-small) {\n .flex-s { display: flex; }\n .inline-flex-s { display: inline-flex; }\n .flex-1-s { flex: 1; }\n .flex-auto-s { flex: 1 1 auto; }\n .flex-initial-s { flex: initial; }\n .flex-none-s { flex: none; }\n .flex-column-s { flex-direction: column; }\n .flex-row-s { flex-direction: row; }\n .flex-wrap-s { flex-wrap: wrap; }\n .flex-nowrap-s { flex-wrap: nowrap; }\n .flex-wrap-reverse-s { flex-wrap: wrap-reverse; }\n .flex-column-reverse-s { flex-direction: column-reverse; }\n .flex-row-reverse-s { flex-direction: row-reverse; }\n .items-start-s { align-items: flex-start; }\n .items-end-s { align-items: flex-end; }\n .items-center-s { align-items: center; }\n .items-baseline-s { align-items: baseline; }\n .items-stretch-s { align-items: stretch; }\n\n .self-start-s { align-self: flex-start; }\n .self-end-s { align-self: flex-end; }\n .self-center-s { align-self: center; }\n .self-baseline-s { align-self: baseline; }\n .self-stretch-s { align-self: stretch; }\n\n .justify-start-s { justify-content: flex-start; }\n .justify-end-s { justify-content: flex-end; }\n .justify-center-s { justify-content: center; }\n .justify-between-s { justify-content: space-between; }\n .justify-around-s { justify-content: space-around; }\n\n .content-start-s { align-content: flex-start; }\n .content-end-s { align-content: flex-end; }\n .content-center-s { align-content: center; }\n .content-between-s { align-content: space-between; }\n .content-around-s { align-content: space-around; }\n .content-stretch-s { align-content: stretch; }\n\n .order-0-s { order: 0; }\n .order-1-s { order: 1; }\n .order-2-s { order: 2; }\n .order-3-s { order: 3; }\n .order-4-s { order: 4; }\n .order-5-s { order: 5; }\n .order-6-s { order: 6; }\n .order-7-s { order: 7; }\n .order-8-s { order: 8; }\n .order-last-s { order: 99999; }\n\n .flex-grow-0-s { flex-grow: 0; }\n .flex-grow-1-s { flex-grow: 1; }\n\n .flex-shrink-0-s { flex-shrink: 0; }\n .flex-shrink-1-s { flex-shrink: 1; }\n}\n\n@media (--breakpoint-medium) {\n .flex-m { display: flex; }\n .inline-flex-m { display: inline-flex; }\n .flex-1-m { flex: 1; }\n .flex-auto-m { flex: 1 1 auto; }\n .flex-initial-m { flex: initial; }\n .flex-none-m { flex: none; }\n .flex-column-m { flex-direction: column; }\n .flex-row-m { flex-direction: row; }\n .flex-wrap-m { flex-wrap: wrap; }\n .flex-nowrap-m { flex-wrap: nowrap; }\n .flex-wrap-reverse-m { flex-wrap: wrap-reverse; }\n .flex-column-reverse-m { flex-direction: column-reverse; }\n .flex-row-reverse-m { flex-direction: row-reverse; }\n .items-start-m { align-items: flex-start; }\n .items-end-m { align-items: flex-end; }\n .items-center-m { align-items: center; }\n .items-baseline-m { align-items: baseline; }\n .items-stretch-m { align-items: stretch; }\n\n .self-start-m { align-self: flex-start; }\n .self-end-m { align-self: flex-end; }\n .self-center-m { align-self: center; }\n .self-baseline-m { align-self: baseline; }\n .self-stretch-m { align-self: stretch; }\n\n .justify-start-m { justify-content: flex-start; }\n .justify-end-m { justify-content: flex-end; }\n .justify-center-m { justify-content: center; }\n .justify-between-m { justify-content: space-between; }\n .justify-around-m { justify-content: space-around; }\n\n .content-start-m { align-content: flex-start; }\n .content-end-m { align-content: flex-end; }\n .content-center-m { align-content: center; }\n .content-between-m { align-content: space-between; }\n .content-around-m { align-content: space-around; }\n .content-stretch-m { align-content: stretch; }\n\n .order-0-m { order: 0; }\n .order-1-m { order: 1; }\n .order-2-m { order: 2; }\n .order-3-m { order: 3; }\n .order-4-m { order: 4; }\n .order-5-m { order: 5; }\n .order-6-m { order: 6; }\n .order-7-m { order: 7; }\n .order-8-m { order: 8; }\n .order-last-m { order: 99999; }\n\n .flex-grow-0-m { flex-grow: 0; }\n .flex-grow-1-m { flex-grow: 1; }\n\n .flex-shrink-0-m { flex-shrink: 0; }\n .flex-shrink-1-m { flex-shrink: 1; }\n}\n\n@media (--breakpoint-large) {\n .flex-l { display: flex; }\n .inline-flex-l { display: inline-flex; }\n .flex-1-l { flex: 1; }\n .flex-auto-l { flex: 1 1 auto; }\n .flex-initial-l { flex: initial; }\n .flex-none-l { flex: none; }\n .flex-column-l { flex-direction: column; }\n .flex-row-l { flex-direction: row; }\n .flex-wrap-l { flex-wrap: wrap; }\n .flex-nowrap-l { flex-wrap: nowrap; }\n .flex-wrap-reverse-l { flex-wrap: wrap-reverse; }\n .flex-column-reverse-l { flex-direction: column-reverse; }\n .flex-row-reverse-l { flex-direction: row-reverse; }\n\n .items-start-l { align-items: flex-start; }\n .items-end-l { align-items: flex-end; }\n .items-center-l { align-items: center; }\n .items-baseline-l { align-items: baseline; }\n .items-stretch-l { align-items: stretch; }\n\n .self-start-l { align-self: flex-start; }\n .self-end-l { align-self: flex-end; }\n .self-center-l { align-self: center; }\n .self-baseline-l { align-self: baseline; }\n .self-stretch-l { align-self: stretch; }\n\n .justify-start-l { justify-content: flex-start; }\n .justify-end-l { justify-content: flex-end; }\n .justify-center-l { justify-content: center; }\n .justify-between-l { justify-content: space-between; }\n .justify-around-l { justify-content: space-around; }\n\n .content-start-l { align-content: flex-start; }\n .content-end-l { align-content: flex-end; }\n .content-center-l { align-content: center; }\n .content-between-l { align-content: space-between; }\n .content-around-l { align-content: space-around; }\n .content-stretch-l { align-content: stretch; }\n\n .order-0-l { order: 0; }\n .order-1-l { order: 1; }\n .order-2-l { order: 2; }\n .order-3-l { order: 3; }\n .order-4-l { order: 4; }\n .order-5-l { order: 5; }\n .order-6-l { order: 6; }\n .order-7-l { order: 7; }\n .order-8-l { order: 8; }\n .order-last-l { order: 99999; }\n\n .flex-grow-0-l { flex-grow: 0; }\n .flex-grow-1-l { flex-grow: 1; }\n\n .flex-shrink-0-l { flex-shrink: 0; }\n .flex-shrink-1-l { flex-shrink: 1; }\n}\n", "css": "/*\n\n FLEXBOX\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n.flex { display: -webkit-box; display: -ms-flexbox; display: flex; }\n.inline-flex { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; }\n/* 1. Fix for Chrome 44 bug.\n * https://code.google.com/p/chromium/issues/detail?id=506893 */\n.flex-auto { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; /* 1 */ min-height: 0; /* 1 */ }\n.flex-none { -webkit-box-flex: 0; -ms-flex: none; flex: none; }\n.flex-column { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }\n.flex-row { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }\n.flex-wrap { -ms-flex-wrap: wrap; flex-wrap: wrap; }\n.flex-nowrap { -ms-flex-wrap: nowrap; flex-wrap: nowrap; }\n.flex-wrap-reverse { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; }\n.flex-column-reverse { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; }\n.flex-row-reverse { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; }\n.items-start { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }\n.items-end { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; }\n.items-center { -webkit-box-align: center; -ms-flex-align: center; align-items: center; }\n.items-baseline { -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; }\n.items-stretch { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }\n.self-start { -ms-flex-item-align: start; align-self: flex-start; }\n.self-end { -ms-flex-item-align: end; align-self: flex-end; }\n.self-center { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; }\n.self-baseline { -ms-flex-item-align: baseline; align-self: baseline; }\n.self-stretch { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; }\n.justify-start { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }\n.justify-end { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }\n.justify-center { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }\n.justify-between { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }\n.justify-around { -ms-flex-pack: distribute; justify-content: space-around; }\n.content-start { -ms-flex-line-pack: start; align-content: flex-start; }\n.content-end { -ms-flex-line-pack: end; align-content: flex-end; }\n.content-center { -ms-flex-line-pack: center; align-content: center; }\n.content-between { -ms-flex-line-pack: justify; align-content: space-between; }\n.content-around { -ms-flex-line-pack: distribute; align-content: space-around; }\n.content-stretch { -ms-flex-line-pack: stretch; align-content: stretch; }\n.order-0 { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; }\n.order-1 { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; }\n.order-2 { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; }\n.order-3 { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; }\n.order-4 { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; }\n.order-5 { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; }\n.order-6 { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; }\n.order-7 { -webkit-box-ordinal-group: 8; -ms-flex-order: 7; order: 7; }\n.order-8 { -webkit-box-ordinal-group: 9; -ms-flex-order: 8; order: 8; }\n.order-last { -webkit-box-ordinal-group: 100000; -ms-flex-order: 99999; order: 99999; }\n.flex-grow-0 { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; }\n.flex-grow-1 { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }\n.flex-shrink-0 { -ms-flex-negative: 0; flex-shrink: 0; }\n.flex-shrink-1 { -ms-flex-negative: 1; flex-shrink: 1; }\n@media screen and (min-width: 30em) {\n .flex-ns { display: -webkit-box; display: -ms-flexbox; display: flex; }\n .inline-flex-ns { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; }\n .flex-auto-ns { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; /* 1 */ min-height: 0; /* 1 */ }\n .flex-none-ns { -webkit-box-flex: 0; -ms-flex: none; flex: none; }\n .flex-column-ns { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }\n .flex-row-ns { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }\n .flex-wrap-ns { -ms-flex-wrap: wrap; flex-wrap: wrap; }\n .flex-nowrap-ns { -ms-flex-wrap: nowrap; flex-wrap: nowrap; }\n .flex-wrap-reverse-ns { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; }\n .flex-column-reverse-ns { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; }\n .flex-row-reverse-ns { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; }\n .items-start-ns { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }\n .items-end-ns { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; }\n .items-center-ns { -webkit-box-align: center; -ms-flex-align: center; align-items: center; }\n .items-baseline-ns { -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; }\n .items-stretch-ns { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }\n .self-start-ns { -ms-flex-item-align: start; align-self: flex-start; }\n .self-end-ns { -ms-flex-item-align: end; align-self: flex-end; }\n .self-center-ns { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; }\n .self-baseline-ns { -ms-flex-item-align: baseline; align-self: baseline; }\n .self-stretch-ns { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; }\n .justify-start-ns { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }\n .justify-end-ns { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }\n .justify-center-ns { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }\n .justify-between-ns { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }\n .justify-around-ns { -ms-flex-pack: distribute; justify-content: space-around; }\n .content-start-ns { -ms-flex-line-pack: start; align-content: flex-start; }\n .content-end-ns { -ms-flex-line-pack: end; align-content: flex-end; }\n .content-center-ns { -ms-flex-line-pack: center; align-content: center; }\n .content-between-ns { -ms-flex-line-pack: justify; align-content: space-between; }\n .content-around-ns { -ms-flex-line-pack: distribute; align-content: space-around; }\n .content-stretch-ns { -ms-flex-line-pack: stretch; align-content: stretch; }\n .order-0-ns { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; }\n .order-1-ns { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; }\n .order-2-ns { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; }\n .order-3-ns { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; }\n .order-4-ns { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; }\n .order-5-ns { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; }\n .order-6-ns { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; }\n .order-7-ns { -webkit-box-ordinal-group: 8; -ms-flex-order: 7; order: 7; }\n .order-8-ns { -webkit-box-ordinal-group: 9; -ms-flex-order: 8; order: 8; }\n .order-last-ns { -webkit-box-ordinal-group: 100000; -ms-flex-order: 99999; order: 99999; }\n .flex-grow-0-ns { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; }\n .flex-grow-1-ns { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }\n .flex-shrink-0-ns { -ms-flex-negative: 0; flex-shrink: 0; }\n .flex-shrink-1-ns { -ms-flex-negative: 1; flex-shrink: 1; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .flex-m { display: -webkit-box; display: -ms-flexbox; display: flex; }\n .inline-flex-m { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; }\n .flex-auto-m { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; /* 1 */ min-height: 0; /* 1 */ }\n .flex-none-m { -webkit-box-flex: 0; -ms-flex: none; flex: none; }\n .flex-column-m { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }\n .flex-row-m { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }\n .flex-wrap-m { -ms-flex-wrap: wrap; flex-wrap: wrap; }\n .flex-nowrap-m { -ms-flex-wrap: nowrap; flex-wrap: nowrap; }\n .flex-wrap-reverse-m { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; }\n .flex-column-reverse-m { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; }\n .flex-row-reverse-m { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; }\n .items-start-m { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }\n .items-end-m { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; }\n .items-center-m { -webkit-box-align: center; -ms-flex-align: center; align-items: center; }\n .items-baseline-m { -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; }\n .items-stretch-m { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }\n .self-start-m { -ms-flex-item-align: start; align-self: flex-start; }\n .self-end-m { -ms-flex-item-align: end; align-self: flex-end; }\n .self-center-m { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; }\n .self-baseline-m { -ms-flex-item-align: baseline; align-self: baseline; }\n .self-stretch-m { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; }\n .justify-start-m { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }\n .justify-end-m { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }\n .justify-center-m { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }\n .justify-between-m { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }\n .justify-around-m { -ms-flex-pack: distribute; justify-content: space-around; }\n .content-start-m { -ms-flex-line-pack: start; align-content: flex-start; }\n .content-end-m { -ms-flex-line-pack: end; align-content: flex-end; }\n .content-center-m { -ms-flex-line-pack: center; align-content: center; }\n .content-between-m { -ms-flex-line-pack: justify; align-content: space-between; }\n .content-around-m { -ms-flex-line-pack: distribute; align-content: space-around; }\n .content-stretch-m { -ms-flex-line-pack: stretch; align-content: stretch; }\n .order-0-m { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; }\n .order-1-m { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; }\n .order-2-m { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; }\n .order-3-m { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; }\n .order-4-m { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; }\n .order-5-m { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; }\n .order-6-m { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; }\n .order-7-m { -webkit-box-ordinal-group: 8; -ms-flex-order: 7; order: 7; }\n .order-8-m { -webkit-box-ordinal-group: 9; -ms-flex-order: 8; order: 8; }\n .order-last-m { -webkit-box-ordinal-group: 100000; -ms-flex-order: 99999; order: 99999; }\n .flex-grow-0-m { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; }\n .flex-grow-1-m { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }\n .flex-shrink-0-m { -ms-flex-negative: 0; flex-shrink: 0; }\n .flex-shrink-1-m { -ms-flex-negative: 1; flex-shrink: 1; }\n}\n@media screen and (min-width: 60em) {\n .flex-l { display: -webkit-box; display: -ms-flexbox; display: flex; }\n .inline-flex-l { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; }\n .flex-auto-l { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; /* 1 */ min-height: 0; /* 1 */ }\n .flex-none-l { -webkit-box-flex: 0; -ms-flex: none; flex: none; }\n .flex-column-l { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }\n .flex-row-l { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }\n .flex-wrap-l { -ms-flex-wrap: wrap; flex-wrap: wrap; }\n .flex-nowrap-l { -ms-flex-wrap: nowrap; flex-wrap: nowrap; }\n .flex-wrap-reverse-l { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; }\n .flex-column-reverse-l { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; }\n .flex-row-reverse-l { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; }\n .items-start-l { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }\n .items-end-l { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; }\n .items-center-l { -webkit-box-align: center; -ms-flex-align: center; align-items: center; }\n .items-baseline-l { -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; }\n .items-stretch-l { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }\n .self-start-l { -ms-flex-item-align: start; align-self: flex-start; }\n .self-end-l { -ms-flex-item-align: end; align-self: flex-end; }\n .self-center-l { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; }\n .self-baseline-l { -ms-flex-item-align: baseline; align-self: baseline; }\n .self-stretch-l { -ms-flex-item-align: stretch; -ms-grid-row-align: stretch; align-self: stretch; }\n .justify-start-l { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }\n .justify-end-l { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }\n .justify-center-l { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }\n .justify-between-l { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }\n .justify-around-l { -ms-flex-pack: distribute; justify-content: space-around; }\n .content-start-l { -ms-flex-line-pack: start; align-content: flex-start; }\n .content-end-l { -ms-flex-line-pack: end; align-content: flex-end; }\n .content-center-l { -ms-flex-line-pack: center; align-content: center; }\n .content-between-l { -ms-flex-line-pack: justify; align-content: space-between; }\n .content-around-l { -ms-flex-line-pack: distribute; align-content: space-around; }\n .content-stretch-l { -ms-flex-line-pack: stretch; align-content: stretch; }\n .order-0-l { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; }\n .order-1-l { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; }\n .order-2-l { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; }\n .order-3-l { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; }\n .order-4-l { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; }\n .order-5-l { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; }\n .order-6-l { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; }\n .order-7-l { -webkit-box-ordinal-group: 8; -ms-flex-order: 7; order: 7; }\n .order-8-l { -webkit-box-ordinal-group: 9; -ms-flex-order: 8; order: 8; }\n .order-last-l { -webkit-box-ordinal-group: 100000; -ms-flex-order: 99999; order: 99999; }\n .flex-grow-0-l { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; }\n .flex-grow-1-l { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }\n .flex-shrink-0-l { -ms-flex-negative: 0; flex-shrink: 0; }\n .flex-shrink-1-l { -ms-flex-negative: 1; flex-shrink: 1; }\n}\n\n" }, "tachyons-floats": { @@ -5791,8 +5791,8 @@ ] } ], - "readme": "# tachyons-floats 3.0.0\n\nPerformance based css module.\n\n#### Stats\n\n417 | 12 | 20\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-floats\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-floats\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-floats.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-floats\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\n/* Media Query Variables */\n/*\n\n FLOATS\n\n 1. Floated elements are automatically rendered as block level elements.\n Setting floats to display inline will fix the double margin bug in\n ie6. You know... just in case.\n\n 2. Don't forget to clearfix your floats with .cf\n\n Base:\n f = float\n\n Modifiers:\n l = left\n r = right\n n = none\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n.fl { float: left; _display: inline; }\n.fr { float: right; _display: inline; }\n.fn { float: none; }\n@media screen and (min-width: 30em) {\n .fl-ns { float: left; display: inline; }\n .fr-ns { float: right; display: inline; }\n .fn-ns { float: none; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .fl-m { float: left; display: inline; }\n .fr-m { float: right; display: inline; }\n .fn-m { float: none; }\n}\n@media screen and (min-width: 60em) {\n .fl-l { float: left; display: inline; }\n .fr-l { float: right; display: inline; }\n .fn-l { float: none; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "\n/* Media Query Variables */\n\n@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n FLOATS\n\n 1. Floated elements are automatically rendered as block level elements.\n Setting floats to display inline will fix the double margin bug in\n ie6. You know... just in case.\n\n 2. Don't forget to clearfix your floats with .cf\n\n Base:\n f = float\n\n Modifiers:\n l = left\n r = right\n n = none\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n\n\n\n.fl { float: left; _display: inline; }\n.fr { float: right; _display: inline; }\n.fn { float: none; }\n\n@media (--breakpoint-not-small) {\n .fl-ns { float: left; _display: inline; }\n .fr-ns { float: right; _display: inline; }\n .fn-ns { float: none; }\n}\n\n@media (--breakpoint-medium) {\n .fl-m { float: left; _display: inline; }\n .fr-m { float: right; _display: inline; }\n .fn-m { float: none; }\n}\n\n@media (--breakpoint-large) {\n .fl-l { float: left; _display: inline; }\n .fr-l { float: right; _display: inline; }\n .fn-l { float: none; }\n}\n", + "readme": "\n\n# FLOATS\n\nFloated elements are automatically rendered as block level elements.\nSetting floats to display inline will fix the double margin bug in\nie6. You know... just in case.\n\nDon't forget to clearfix your floats with `.cf`\n\n### Docs\n\nhttp://tachyons.io/docs/layout/floats/\n\n### Base\n\n- f = float\n\n### Modifiers\n\n- l = left\n- r = right\n- n = none\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# FLOATS\n\nFloated elements are automatically rendered as block level elements.\nSetting floats to display inline will fix the double margin bug in\nie6. You know... just in case.\n\nDon't forget to clearfix your floats with `.cf`\n\n### Docs\n\nhttp://tachyons.io/docs/layout/floats/\n\n### Base\n\n- f = float\n\n### Modifiers\n\n- l = left\n- r = right\n- n = none\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n\n\n.fl { float: left; _display: inline; }\n.fr { float: right; _display: inline; }\n.fn { float: none; }\n\n@media (--breakpoint-small) {\n .fl-s { float: left; _display: inline; }\n .fr-s { float: right; _display: inline; }\n .fn-s { float: none; }\n}\n\n@media (--breakpoint-medium) {\n .fl-m { float: left; _display: inline; }\n .fr-m { float: right; _display: inline; }\n .fn-m { float: none; }\n}\n\n@media (--breakpoint-large) {\n .fl-l { float: left; _display: inline; }\n .fr-l { float: right; _display: inline; }\n .fn-l { float: none; }\n}\n", "css": "/* Media Query Variables */\n/*\n\n FLOATS\n\n 1. Floated elements are automatically rendered as block level elements.\n Setting floats to display inline will fix the double margin bug in\n ie6. You know... just in case.\n\n 2. Don't forget to clearfix your floats with .cf\n\n Base:\n f = float\n\n Modifiers:\n l = left\n r = right\n n = none\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n.fl { float: left; _display: inline; }\n.fr { float: right; _display: inline; }\n.fn { float: none; }\n@media screen and (min-width: 30em) {\n .fl-ns { float: left; display: inline; }\n .fr-ns { float: right; display: inline; }\n .fn-ns { float: none; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .fl-m { float: left; display: inline; }\n .fr-m { float: right; display: inline; }\n .fn-m { float: none; }\n}\n@media screen and (min-width: 60em) {\n .fl-l { float: left; display: inline; }\n .fr-l { float: right; display: inline; }\n .fn-l { float: none; }\n}\n\n" }, "tachyons-font-family": { @@ -5906,8 +5906,8 @@ ] } ], - "readme": "# tachyons-font-family 4.2.5\n\nPerformance based css module.\n\n#### Stats\n\n439 | 16 | 15\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-font-family\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-font-family\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-font-family.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-font-family\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\n/*\n\n FONT FAMILY GROUPS\n Docs: http://tachyons.io/docs/typography/font-family/\n\n*/\n.sans-serif { font-family: -apple-system, BlinkMacSystemFont, 'avenir next', avenir, helvetica, 'helvetica neue', ubuntu, roboto, noto, 'segoe ui', arial, sans-serif; }\n.serif { font-family: georgia, times, serif; }\n.system-sans-serif { font-family: sans-serif; }\n.system-serif { font-family: serif; }\n/* Monospaced Typefaces (for code) */\n/* From http://cssfontstack.com */\ncode, .code { font-family: Consolas, monaco, monospace; }\n.courier { font-family: 'Courier Next', courier, monospace; }\n/* Sans-Serif Typefaces */\n.helvetica { font-family: 'helvetica neue', helvetica, sans-serif; }\n.avenir { font-family: 'avenir next', avenir, sans-serif; }\n/* Serif Typefaces */\n.athelas { font-family: athelas, georgia, serif; }\n.georgia { font-family: georgia, serif; }\n.times { font-family: times, serif; }\n.bodoni { font-family: \"Bodoni MT\", serif; }\n.calisto { font-family: \"Calisto MT\", serif; }\n.garamond { font-family: garamond, serif; }\n.baskerville { font-family: baskerville, serif; }\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "/*\n\n FONT FAMILY GROUPS\n Docs: http://tachyons.io/docs/typography/font-family/\n\n*/\n\n\n.sans-serif {\n font-family: -apple-system, BlinkMacSystemFont,\n 'avenir next', avenir,\n helvetica, 'helvetica neue',\n ubuntu,\n roboto, noto,\n 'segoe ui', arial,\n sans-serif;\n}\n\n.serif {\n font-family: georgia,\n times,\n serif;\n}\n\n.system-sans-serif {\n font-family: sans-serif;\n}\n\n.system-serif {\n font-family: serif;\n}\n\n\n/* Monospaced Typefaces (for code) */\n\n/* From http://cssfontstack.com */\ncode, .code {\n font-family: Consolas,\n monaco,\n monospace;\n}\n\n.courier {\n font-family: 'Courier Next',\n courier,\n monospace;\n}\n\n\n/* Sans-Serif Typefaces */\n\n.helvetica {\n font-family: 'helvetica neue', helvetica,\n sans-serif;\n}\n\n.avenir {\n font-family: 'avenir next', avenir,\n sans-serif;\n}\n\n\n/* Serif Typefaces */\n\n.athelas {\n font-family: athelas,\n georgia,\n serif;\n}\n\n.georgia {\n font-family: georgia,\n serif;\n}\n\n.times {\n font-family: times,\n serif;\n}\n\n.bodoni {\n font-family: \"Bodoni MT\",\n serif;\n}\n\n.calisto {\n font-family: \"Calisto MT\",\n serif;\n}\n\n.garamond {\n font-family: garamond,\n serif;\n}\n\n.baskerville {\n font-family: baskerville,\n serif;\n}\n\n", + "readme": "\n\n# FONT FAMILY GROUPS\n\n### Docs\n\nhttp://tachyons.io/docs/typography/font-family/\n\n### Base\n\n- sans-serif\n- system-sans-serif\n- avenir\n- helvetica\n\n- serif\n- system-serif\n- athelas\n- baskerville\n- bodoni\n- calisto\n- garamond\n- georgia\n- times\n\n- code\n- courier\n", + "src": "/*!!!\n\n# FONT FAMILY GROUPS\n\n### Docs\n\nhttp://tachyons.io/docs/typography/font-family/\n\n### Base\n\n- sans-serif\n- system-sans-serif\n- avenir\n- helvetica\n\n- serif\n- system-serif\n- athelas\n- baskerville\n- bodoni\n- calisto\n- garamond\n- georgia\n- times\n\n- code\n- courier\n*/\n\n\n.sans-serif {\n font-family: -apple-system, BlinkMacSystemFont,\n 'avenir next', avenir,\n 'helvetica neue', helvetica,\n ubuntu,\n roboto, noto,\n 'segoe ui', arial,\n sans-serif;\n}\n\n.serif {\n font-family: georgia,\n times,\n serif;\n}\n\n.system-sans-serif {\n font-family: sans-serif;\n}\n\n.system-serif {\n font-family: serif;\n}\n\n\n/* Monospaced Typefaces (for code) */\n\n/* From http://cssfontstack.com */\ncode, .code {\n font-family: Consolas,\n monaco,\n monospace;\n}\n\n.courier {\n font-family: 'Courier Next',\n courier,\n monospace;\n}\n\n\n/* Sans-Serif Typefaces */\n\n.helvetica {\n font-family: 'helvetica neue', helvetica,\n sans-serif;\n}\n\n.avenir {\n font-family: 'avenir next', avenir,\n sans-serif;\n}\n\n\n/* Serif Typefaces */\n\n.athelas {\n font-family: athelas,\n georgia,\n serif;\n}\n\n.georgia {\n font-family: georgia,\n serif;\n}\n\n.times {\n font-family: times,\n serif;\n}\n\n.bodoni {\n font-family: \"Bodoni MT\",\n serif;\n}\n\n.calisto {\n font-family: \"Calisto MT\",\n serif;\n}\n\n.garamond {\n font-family: garamond,\n serif;\n}\n\n.baskerville {\n font-family: baskerville,\n serif;\n}\n", "css": "/*\n\n FONT FAMILY GROUPS\n Docs: http://tachyons.io/docs/typography/font-family/\n\n*/\n.sans-serif { font-family: -apple-system, BlinkMacSystemFont, 'avenir next', avenir, helvetica, 'helvetica neue', ubuntu, roboto, noto, 'segoe ui', arial, sans-serif; }\n.serif { font-family: georgia, times, serif; }\n.system-sans-serif { font-family: sans-serif; }\n.system-serif { font-family: serif; }\n/* Monospaced Typefaces (for code) */\n/* From http://cssfontstack.com */\ncode, .code { font-family: Consolas, monaco, monospace; }\n.courier { font-family: 'Courier Next', courier, monospace; }\n/* Sans-Serif Typefaces */\n.helvetica { font-family: 'helvetica neue', helvetica, sans-serif; }\n.avenir { font-family: 'avenir next', avenir, sans-serif; }\n/* Serif Typefaces */\n.athelas { font-family: athelas, georgia, serif; }\n.georgia { font-family: georgia, serif; }\n.times { font-family: times, serif; }\n.bodoni { font-family: \"Bodoni MT\", serif; }\n.calisto { font-family: \"Calisto MT\", serif; }\n.garamond { font-family: garamond, serif; }\n.baskerville { font-family: baskerville, serif; }\n\n" }, "tachyons-font-style": { @@ -5972,8 +5972,8 @@ ] } ], - "readme": "# tachyons-font-style 4.0.0\n\nPerformance based css module.\n\n#### Stats\n\n165 | 8 | 8\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-font-style\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-font-style\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-font-style.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-font-style\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\n/*\n\n FONT STYLE\n\n*/\n.i { font-style: italic; }\n.fs-normal { font-style: normal; }\n@media screen and (min-width: 30em) {\n .i-ns { font-style: italic; }\n .fs-normal-ns { font-style: normal; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .i-m { font-style: italic; }\n .fs-normal-m { font-style: normal; }\n}\n@media screen and (min-width: 60em) {\n .i-l { font-style: italic; }\n .fs-normal-l { font-style: normal; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n FONT STYLE\n\n*/\n\n.i { font-style: italic; }\n.fs-normal { font-style: normal; }\n\n@media (--breakpoint-not-small) {\n .i-ns { font-style: italic; }\n .fs-normal-ns { font-style: normal; }\n}\n\n@media (--breakpoint-medium) {\n .i-m { font-style: italic; }\n .fs-normal-m { font-style: normal; }\n}\n\n@media (--breakpoint-large) {\n .i-l { font-style: italic; }\n .fs-normal-l { font-style: normal; }\n}\n", + "readme": "\n\n# FONT STYLE\n\n### Docs\n\nhttp://tachyons.io/docs/typography/font-style/\n\n### Base\n\n- i = italic\n- fs-normal = normal\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# FONT STYLE\n\n### Docs\n\nhttp://tachyons.io/docs/typography/font-style/\n\n### Base\n\n- i = italic\n- fs-normal = normal\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n.i { font-style: italic; }\n.fs-normal { font-style: normal; }\n\n@media (--breakpoint-small) {\n .i-s { font-style: italic; }\n .fs-normal-s { font-style: normal; }\n}\n\n@media (--breakpoint-medium) {\n .i-m { font-style: italic; }\n .fs-normal-m { font-style: normal; }\n}\n\n@media (--breakpoint-large) {\n .i-l { font-style: italic; }\n .fs-normal-l { font-style: normal; }\n}\n", "css": "/*\n\n FONT STYLE\n\n*/\n.i { font-style: italic; }\n.fs-normal { font-style: normal; }\n@media screen and (min-width: 30em) {\n .i-ns { font-style: italic; }\n .fs-normal-ns { font-style: normal; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .i-m { font-style: italic; }\n .fs-normal-m { font-style: normal; }\n}\n@media screen and (min-width: 60em) {\n .i-l { font-style: italic; }\n .fs-normal-l { font-style: normal; }\n}\n\n" }, "tachyons-font-weight": { @@ -6290,8 +6290,8 @@ ] } ], - "readme": "# tachyons-font-weight 5.0.0\n\nPerformance based css module.\n\n#### Stats\n\n299 | 44 | 44\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-font-weight\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-font-weight\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-font-weight.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-font-weight\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\n/*\n\n FONT WEIGHT\n\n*/\n.normal { font-weight: normal; }\n.b { font-weight: bold; }\n.fw1 { font-weight: 100; }\n.fw2 { font-weight: 200; }\n.fw3 { font-weight: 300; }\n.fw4 { font-weight: 400; }\n.fw5 { font-weight: 500; }\n.fw6 { font-weight: 600; }\n.fw7 { font-weight: 700; }\n.fw8 { font-weight: 800; }\n.fw9 { font-weight: 900; }\n@media screen and (min-width: 30em) {\n .normal-ns { font-weight: normal; }\n .b-ns { font-weight: bold; }\n .fw1-ns { font-weight: 100; }\n .fw2-ns { font-weight: 200; }\n .fw3-ns { font-weight: 300; }\n .fw4-ns { font-weight: 400; }\n .fw5-ns { font-weight: 500; }\n .fw6-ns { font-weight: 600; }\n .fw7-ns { font-weight: 700; }\n .fw8-ns { font-weight: 800; }\n .fw9-ns { font-weight: 900; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .normal-m { font-weight: normal; }\n .b-m { font-weight: bold; }\n .fw1-m { font-weight: 100; }\n .fw2-m { font-weight: 200; }\n .fw3-m { font-weight: 300; }\n .fw4-m { font-weight: 400; }\n .fw5-m { font-weight: 500; }\n .fw6-m { font-weight: 600; }\n .fw7-m { font-weight: 700; }\n .fw8-m { font-weight: 800; }\n .fw9-m { font-weight: 900; }\n}\n@media screen and (min-width: 60em) {\n .normal-l { font-weight: normal; }\n .b-l { font-weight: bold; }\n .fw1-l { font-weight: 100; }\n .fw2-l { font-weight: 200; }\n .fw3-l { font-weight: 300; }\n .fw4-l { font-weight: 400; }\n .fw5-l { font-weight: 500; }\n .fw6-l { font-weight: 600; }\n .fw7-l { font-weight: 700; }\n .fw8-l { font-weight: 800; }\n .fw9-l { font-weight: 900; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n FONT WEIGHT\n\n*/\n\n.normal { font-weight: normal; }\n.b { font-weight: bold; }\n.fw1 { font-weight: 100; }\n.fw2 { font-weight: 200; }\n.fw3 { font-weight: 300; }\n.fw4 { font-weight: 400; }\n.fw5 { font-weight: 500; }\n.fw6 { font-weight: 600; }\n.fw7 { font-weight: 700; }\n.fw8 { font-weight: 800; }\n.fw9 { font-weight: 900; }\n\n\n@media (--breakpoint-not-small) {\n .normal-ns { font-weight: normal; }\n .b-ns { font-weight: bold; }\n .fw1-ns { font-weight: 100; }\n .fw2-ns { font-weight: 200; }\n .fw3-ns { font-weight: 300; }\n .fw4-ns { font-weight: 400; }\n .fw5-ns { font-weight: 500; }\n .fw6-ns { font-weight: 600; }\n .fw7-ns { font-weight: 700; }\n .fw8-ns { font-weight: 800; }\n .fw9-ns { font-weight: 900; }\n}\n\n@media (--breakpoint-medium) {\n .normal-m { font-weight: normal; }\n .b-m { font-weight: bold; }\n .fw1-m { font-weight: 100; }\n .fw2-m { font-weight: 200; }\n .fw3-m { font-weight: 300; }\n .fw4-m { font-weight: 400; }\n .fw5-m { font-weight: 500; }\n .fw6-m { font-weight: 600; }\n .fw7-m { font-weight: 700; }\n .fw8-m { font-weight: 800; }\n .fw9-m { font-weight: 900; }\n}\n\n@media (--breakpoint-large) {\n .normal-l { font-weight: normal; }\n .b-l { font-weight: bold; }\n .fw1-l { font-weight: 100; }\n .fw2-l { font-weight: 200; }\n .fw3-l { font-weight: 300; }\n .fw4-l { font-weight: 400; }\n .fw5-l { font-weight: 500; }\n .fw6-l { font-weight: 600; }\n .fw7-l { font-weight: 700; }\n .fw8-l { font-weight: 800; }\n .fw9-l { font-weight: 900; }\n}\n", + "readme": "\n\n# FONT WEIGHT\n\n### Docs\n\nhttp://tachyons.io/docs/typography/font-weight/\n\n### Base\n\n- fw = font-weight\n\n### Modifiers\n\n- 1 = literal value 100\n- 2 = literal value 200\n- 3 = literal value 300\n- 4 = literal value 400\n- 5 = literal value 500\n- 6 = literal value 600\n- 7 = literal value 700\n- 8 = literal value 800\n- 9 = literal value 900\n\n### Literal Values\n\n- b = bold\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# FONT WEIGHT\n\n### Docs\n\nhttp://tachyons.io/docs/typography/font-weight/\n\n### Base\n\n- fw = font-weight\n\n### Modifiers\n\n- 1 = literal value 100\n- 2 = literal value 200\n- 3 = literal value 300\n- 4 = literal value 400\n- 5 = literal value 500\n- 6 = literal value 600\n- 7 = literal value 700\n- 8 = literal value 800\n- 9 = literal value 900\n\n### Literal Values\n\n- b = bold\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n.b { font-weight: bold; }\n.fw1 { font-weight: 100; }\n.fw2 { font-weight: 200; }\n.fw3 { font-weight: 300; }\n.fw4 { font-weight: 400; }\n.fw5 { font-weight: 500; }\n.fw6 { font-weight: 600; }\n.fw7 { font-weight: 700; }\n.fw8 { font-weight: 800; }\n.fw9 { font-weight: 900; }\n\n@media (--breakpoint-small) {\n .b-s { font-weight: bold; }\n .fw1-s { font-weight: 100; }\n .fw2-s { font-weight: 200; }\n .fw3-s { font-weight: 300; }\n .fw4-s { font-weight: 400; }\n .fw5-s { font-weight: 500; }\n .fw6-s { font-weight: 600; }\n .fw7-s { font-weight: 700; }\n .fw8-s { font-weight: 800; }\n .fw9-s { font-weight: 900; }\n}\n\n@media (--breakpoint-medium) {\n .b-m { font-weight: bold; }\n .fw1-m { font-weight: 100; }\n .fw2-m { font-weight: 200; }\n .fw3-m { font-weight: 300; }\n .fw4-m { font-weight: 400; }\n .fw5-m { font-weight: 500; }\n .fw6-m { font-weight: 600; }\n .fw7-m { font-weight: 700; }\n .fw8-m { font-weight: 800; }\n .fw9-m { font-weight: 900; }\n}\n\n@media (--breakpoint-large) {\n .b-l { font-weight: bold; }\n .fw1-l { font-weight: 100; }\n .fw2-l { font-weight: 200; }\n .fw3-l { font-weight: 300; }\n .fw4-l { font-weight: 400; }\n .fw5-l { font-weight: 500; }\n .fw6-l { font-weight: 600; }\n .fw7-l { font-weight: 700; }\n .fw8-l { font-weight: 800; }\n .fw9-l { font-weight: 900; }\n}\n", "css": "/*\n\n FONT WEIGHT\n\n*/\n.normal { font-weight: normal; }\n.b { font-weight: bold; }\n.fw1 { font-weight: 100; }\n.fw2 { font-weight: 200; }\n.fw3 { font-weight: 300; }\n.fw4 { font-weight: 400; }\n.fw5 { font-weight: 500; }\n.fw6 { font-weight: 600; }\n.fw7 { font-weight: 700; }\n.fw8 { font-weight: 800; }\n.fw9 { font-weight: 900; }\n@media screen and (min-width: 30em) {\n .normal-ns { font-weight: normal; }\n .b-ns { font-weight: bold; }\n .fw1-ns { font-weight: 100; }\n .fw2-ns { font-weight: 200; }\n .fw3-ns { font-weight: 300; }\n .fw4-ns { font-weight: 400; }\n .fw5-ns { font-weight: 500; }\n .fw6-ns { font-weight: 600; }\n .fw7-ns { font-weight: 700; }\n .fw8-ns { font-weight: 800; }\n .fw9-ns { font-weight: 900; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .normal-m { font-weight: normal; }\n .b-m { font-weight: bold; }\n .fw1-m { font-weight: 100; }\n .fw2-m { font-weight: 200; }\n .fw3-m { font-weight: 300; }\n .fw4-m { font-weight: 400; }\n .fw5-m { font-weight: 500; }\n .fw6-m { font-weight: 600; }\n .fw7-m { font-weight: 700; }\n .fw8-m { font-weight: 800; }\n .fw9-m { font-weight: 900; }\n}\n@media screen and (min-width: 60em) {\n .normal-l { font-weight: normal; }\n .b-l { font-weight: bold; }\n .fw1-l { font-weight: 100; }\n .fw2-l { font-weight: 200; }\n .fw3-l { font-weight: 300; }\n .fw4-l { font-weight: 400; }\n .fw5-l { font-weight: 500; }\n .fw6-l { font-weight: 600; }\n .fw7-l { font-weight: 700; }\n .fw8-l { font-weight: 800; }\n .fw9-l { font-weight: 900; }\n}\n\n" }, "tachyons-forms": { @@ -6316,8 +6316,8 @@ ] } ], - "readme": "# tachyons-forms 3.0.5\n\nPerformance based css module.\n\n#### Stats\n\n138 | 3 | 4\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-forms\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-forms\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-forms.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-forms\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\n/*\n\n FORMS\n \n*/\n.input-reset { -webkit-appearance: none; -moz-appearance: none; }\n.button-reset::-moz-focus-inner, .input-reset::-moz-focus-inner { border: 0; padding: 0; }\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "/*\n\n FORMS\n \n*/\n\n.input-reset {\n -webkit-appearance: none;\n -moz-appearance: none;\n}\n\n.button-reset::-moz-focus-inner,\n.input-reset::-moz-focus-inner {\n border: 0;\n padding: 0;\n}\n", + "readme": "\n\n# FORMS\n\n### Docs\n\nhttp://tachyons.io/docs/elements/forms/\n", + "src": "/*!!!\n\n# FORMS\n\n### Docs\n\nhttp://tachyons.io/docs/elements/forms/\n*/\n\n.input-reset {\n -webkit-appearance: none;\n -moz-appearance: none;\n}\n\n.button-reset::-moz-focus-inner,\n.input-reset::-moz-focus-inner {\n border: 0;\n padding: 0;\n}\n", "css": "/*\n\n FORMS\n \n*/\n.input-reset { -webkit-appearance: none; -moz-appearance: none; }\n.button-reset::-moz-focus-inner, .input-reset::-moz-focus-inner { border: 0; padding: 0; }\n\n" }, "tachyons-gradients": { @@ -6375,8 +6375,8 @@ ] } ], - "readme": "\n\n# Gradients\n\nAll gradients cut and pasted from cssgradient.io ;)\n\n### Docs\n\nhttp://tachyons.io/docs/themes/gradients/\n\n### Base\n\n`gradient` = background-color\n\n### Modifiers\n\n- `-gradient-name` = dark-blue, lily, aqua, etc\n\n\n### Stats\n\n374 | 7 | 7\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*!!!\n\n # Gradients\n\n All gradients cut and pasted from cssgradient.io ;)\n\n ### Docs\n\n http://tachyons.io/docs/themes/gradients/\n\n ### Base\n\n `gradient` = background-color\n\n ### Modifiers\n\n - `-gradient-name` = dark-blue, lily, aqua, etc\n*/\n.gradient-dark-blue { background: linear-gradient( 90deg, #4b6cb7 0%, #182848 100% ); }\n.gradient-charcoal { background: linear-gradient( 90deg, rgba( 44, 56, 68, 1 ) 0%, rgba( 23, 32, 42, 1 ) 100% ); }\n.gradient-moon-gray { background: linear-gradient( 211deg, rgba( 234, 236, 238, 1 ) 0%, rgba( 234, 236, 238, 1 ) 100% ); }\n.gradient-lily { background: linear-gradient( 90deg, #efd5ff 0%, #515ada 100% ); }\n.gradient-aqua { background: linear-gradient( 90deg, #00d2ff 0%, #3a47d5 100% ); }\n.gradient-purple { background: linear-gradient( 90deg, #3f2b96 0%, #a8c0ff 100% ); }\n.gradient-green { background: linear-gradient( 90deg, #9ebd13 0%, #008552 100% ); }\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "/*!!!\n\n # Gradients\n\n All gradients cut and pasted from cssgradient.io ;)\n\n ### Docs\n\n http://tachyons.io/docs/themes/gradients/\n\n ### Base\n\n `gradient` = background-color\n\n ### Modifiers\n\n - `-gradient-name` = dark-blue, lily, aqua, etc\n*/\n\n.gradient-dark-blue {\n background: linear-gradient(90deg, #4b6cb7 0%, #182848 100%);\n}\n\n.gradient-charcoal {\n background: linear-gradient(90deg, rgba(44,56,68,1) 0%, rgba(23,32,42,1) 100%);\n}\n\n.gradient-moon-gray {\n background: linear-gradient(211deg, rgba(234,236,238,1) 0%, rgba(234,236,238,1) 100%);\n}\n\n.gradient-lily {\n background: linear-gradient(90deg, #efd5ff 0%, #515ada 100%);\n}\n\n.gradient-aqua {\n background: linear-gradient(90deg, #00d2ff 0%, #3a47d5 100%);\n}\n\n.gradient-purple {\n background: linear-gradient(90deg, #3F2B96 0%, #A8C0FF 100%);\n}\n\n.gradient-green {\n background: linear-gradient(90deg, #9ebd13 0%, #008552 100%);\n}\n", + "readme": "\n\n# [ADDON] GRADIENTS\n\nAll gradients cut and pasted from cssgradient.io ;)\n\n### Docs\n\nhttp://tachyons.io/docs/themes/gradients/\n\n### Base\n\n`gradient` = background-color\n\n### Modifiers\n\n- `-gradient-name` = dark-blue, lily, aqua, etc\n", + "src": "/*!!!\n\n# [ADDON] GRADIENTS\n\nAll gradients cut and pasted from cssgradient.io ;)\n\n### Docs\n\nhttp://tachyons.io/docs/themes/gradients/\n\n### Base\n\n`gradient` = background-color\n\n### Modifiers\n\n- `-gradient-name` = dark-blue, lily, aqua, etc\n*/\n\n.gradient-dark-blue {\n background: linear-gradient(90deg, #4b6cb7 0%, #182848 100%);\n}\n\n.gradient-charcoal {\n background: linear-gradient(90deg, rgba(44,56,68,1) 0%, rgba(23,32,42,1) 100%);\n}\n\n.gradient-moon-gray {\n background: linear-gradient(211deg, rgba(234,236,238,1) 0%, rgba(234,236,238,1) 100%);\n}\n\n.gradient-lily {\n background: linear-gradient(90deg, #efd5ff 0%, #515ada 100%);\n}\n\n.gradient-aqua {\n background: linear-gradient(90deg, #00d2ff 0%, #3a47d5 100%);\n}\n\n.gradient-purple {\n background: linear-gradient(90deg, #3F2B96 0%, #A8C0FF 100%);\n}\n\n.gradient-green {\n background: linear-gradient(90deg, #9ebd13 0%, #008552 100%);\n}\n", "css": "/*!!!\n\n # Gradients\n\n All gradients cut and pasted from cssgradient.io ;)\n\n ### Docs\n\n http://tachyons.io/docs/themes/gradients/\n\n ### Base\n\n `gradient` = background-color\n\n ### Modifiers\n\n - `-gradient-name` = dark-blue, lily, aqua, etc\n*/\n.gradient-dark-blue { background: linear-gradient( 90deg, #4b6cb7 0%, #182848 100% ); }\n.gradient-charcoal { background: linear-gradient( 90deg, rgba( 44, 56, 68, 1 ) 0%, rgba( 23, 32, 42, 1 ) 100% ); }\n.gradient-moon-gray { background: linear-gradient( 211deg, rgba( 234, 236, 238, 1 ) 0%, rgba( 234, 236, 238, 1 ) 100% ); }\n.gradient-lily { background: linear-gradient( 90deg, #efd5ff 0%, #515ada 100% ); }\n.gradient-aqua { background: linear-gradient( 90deg, #00d2ff 0%, #3a47d5 100% ); }\n.gradient-purple { background: linear-gradient( 90deg, #3f2b96 0%, #a8c0ff 100% ); }\n.gradient-green { background: linear-gradient( 90deg, #9ebd13 0%, #008552 100% ); }\n\n" }, "tachyons-heights": { @@ -6861,8 +6861,8 @@ ] } ], - "readme": "# tachyons-heights 6.1.0\n\nPerformance based css module.\n\n#### Stats\n\n712 | 68 | 68\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-heights\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-heights\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-heights.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-heights\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n HEIGHTS\n Docs: http://tachyons.io/docs/layout/heights/\n\n Base:\n h = height\n min-h = min-height\n min-vh = min-height vertical screen height\n vh = vertical screen height\n\n Modifiers\n 1 = 1st step in height scale\n 2 = 2nd step in height scale\n 3 = 3rd step in height scale\n 4 = 4th step in height scale\n 5 = 5th step in height scale\n\n -25 = literal value 25%\n -50 = literal value 50%\n -75 = literal value 75%\n -100 = literal value 100%\n\n -auto = string value of auto\n -inherit = string value of inherit\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n/* Height Scale */\n.h1 { height: 1rem; }\n.h2 { height: 2rem; }\n.h3 { height: 4rem; }\n.h4 { height: 8rem; }\n.h5 { height: 16rem; }\n/* Height Percentages - Based off of height of parent */\n.h-25 { height: 25%; }\n.h-50 { height: 50%; }\n.h-75 { height: 75%; }\n.h-100 { height: 100%; }\n.min-h-100 { min-height: 100%; }\n/* Screen Height Percentage */\n.vh-25 { height: 25vh; }\n.vh-50 { height: 50vh; }\n.vh-75 { height: 75vh; }\n.vh-100 { height: 100vh; }\n.min-vh-100 { min-height: 100vh; }\n/* String Properties */\n.h-auto { height: auto; }\n.h-inherit { height: inherit; }\n@media screen and (min-width: 30em) {\n .h1-ns { height: 1rem; }\n .h2-ns { height: 2rem; }\n .h3-ns { height: 4rem; }\n .h4-ns { height: 8rem; }\n .h5-ns { height: 16rem; }\n .h-25-ns { height: 25%; }\n .h-50-ns { height: 50%; }\n .h-75-ns { height: 75%; }\n .h-100-ns { height: 100%; }\n .min-h-100-ns { min-height: 100%; }\n .vh-25-ns { height: 25vh; }\n .vh-50-ns { height: 50vh; }\n .vh-75-ns { height: 75vh; }\n .vh-100-ns { height: 100vh; }\n .min-vh-100-ns { min-height: 100vh; }\n .h-auto-ns { height: auto; }\n .h-inherit-ns { height: inherit; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .h1-m { height: 1rem; }\n .h2-m { height: 2rem; }\n .h3-m { height: 4rem; }\n .h4-m { height: 8rem; }\n .h5-m { height: 16rem; }\n .h-25-m { height: 25%; }\n .h-50-m { height: 50%; }\n .h-75-m { height: 75%; }\n .h-100-m { height: 100%; }\n .min-h-100-ns { min-height: 100%; }\n .vh-25-m { height: 25vh; }\n .vh-50-m { height: 50vh; }\n .vh-75-m { height: 75vh; }\n .vh-100-m { height: 100vh; }\n .min-vh-100-m { min-height: 100vh; }\n .h-auto-m { height: auto; }\n .h-inherit-m { height: inherit; }\n}\n@media screen and (min-width: 60em) {\n .h1-l { height: 1rem; }\n .h2-l { height: 2rem; }\n .h3-l { height: 4rem; }\n .h4-l { height: 8rem; }\n .h5-l { height: 16rem; }\n .h-25-l { height: 25%; }\n .h-50-l { height: 50%; }\n .h-75-l { height: 75%; }\n .h-100-l { height: 100%; }\n .min-h-100-l { min-height: 100%; }\n .vh-25-l { height: 25vh; }\n .vh-50-l { height: 50vh; }\n .vh-75-l { height: 75vh; }\n .vh-100-l { height: 100vh; }\n .min-vh-100-m { min-height: 100vh; }\n .h-auto-l { height: auto; }\n .h-inherit-l { height: inherit; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n HEIGHTS\n Docs: http://tachyons.io/docs/layout/heights/\n\n Base:\n h = height\n min-h = min-height\n min-vh = min-height vertical screen height\n vh = vertical screen height\n\n Modifiers\n 1 = 1st step in height scale\n 2 = 2nd step in height scale\n 3 = 3rd step in height scale\n 4 = 4th step in height scale\n 5 = 5th step in height scale\n\n -25 = literal value 25%\n -50 = literal value 50%\n -75 = literal value 75%\n -100 = literal value 100%\n\n -auto = string value of auto\n -inherit = string value of inherit\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n\n/* Height Scale */\n\n.h1 { height: 1rem; }\n.h2 { height: 2rem; }\n.h3 { height: 4rem; }\n.h4 { height: 8rem; }\n.h5 { height: 16rem; }\n\n/* Height Percentages - Based off of height of parent */\n\n.h-25 { height: 25%; }\n.h-50 { height: 50%; }\n.h-75 { height: 75%; }\n.h-100 { height: 100%; }\n\n.min-h-100 { min-height: 100%; }\n\n/* Screen Height Percentage */\n\n.vh-25 { height: 25vh; }\n.vh-50 { height: 50vh; }\n.vh-75 { height: 75vh; }\n.vh-100 { height: 100vh; }\n\n.min-vh-100 { min-height: 100vh; }\n\n\n/* String Properties */\n\n.h-auto { height: auto; }\n.h-inherit { height: inherit; }\n\n@media (--breakpoint-not-small) {\n .h1-ns { height: 1rem; }\n .h2-ns { height: 2rem; }\n .h3-ns { height: 4rem; }\n .h4-ns { height: 8rem; }\n .h5-ns { height: 16rem; }\n .h-25-ns { height: 25%; }\n .h-50-ns { height: 50%; }\n .h-75-ns { height: 75%; }\n .h-100-ns { height: 100%; }\n .min-h-100-ns { min-height: 100%; }\n .vh-25-ns { height: 25vh; }\n .vh-50-ns { height: 50vh; }\n .vh-75-ns { height: 75vh; }\n .vh-100-ns { height: 100vh; }\n .min-vh-100-ns { min-height: 100vh; }\n .h-auto-ns { height: auto; }\n .h-inherit-ns { height: inherit; }\n}\n\n@media (--breakpoint-medium) {\n .h1-m { height: 1rem; }\n .h2-m { height: 2rem; }\n .h3-m { height: 4rem; }\n .h4-m { height: 8rem; }\n .h5-m { height: 16rem; }\n .h-25-m { height: 25%; }\n .h-50-m { height: 50%; }\n .h-75-m { height: 75%; }\n .h-100-m { height: 100%; }\n .min-h-100-ns { min-height: 100%; }\n .vh-25-m { height: 25vh; }\n .vh-50-m { height: 50vh; }\n .vh-75-m { height: 75vh; }\n .vh-100-m { height: 100vh; }\n .min-vh-100-m { min-height: 100vh; }\n .h-auto-m { height: auto; }\n .h-inherit-m { height: inherit; }\n}\n\n@media (--breakpoint-large) {\n .h1-l { height: 1rem; }\n .h2-l { height: 2rem; }\n .h3-l { height: 4rem; }\n .h4-l { height: 8rem; }\n .h5-l { height: 16rem; }\n .h-25-l { height: 25%; }\n .h-50-l { height: 50%; }\n .h-75-l { height: 75%; }\n .h-100-l { height: 100%; }\n .min-h-100-l { min-height: 100%; }\n .vh-25-l { height: 25vh; }\n .vh-50-l { height: 50vh; }\n .vh-75-l { height: 75vh; }\n .vh-100-l { height: 100vh; }\n .min-vh-100-m { min-height: 100vh; }\n .h-auto-l { height: auto; }\n .h-inherit-l { height: inherit; }\n}\n", + "readme": "\n\n# HEIGHTS\n\n### Docs\n\nhttp://tachyons.io/docs/layout/heights/\n\n### Base\n\n- h = height\n- min-h = min-height\n- min-vh = min-height vertical screen height\n- vh = vertical screen height\n\n### Modifiers\n\n- 1 = 1st step in height scale\n- 2 = 2nd step in height scale\n- 3 = 3rd step in height scale\n- 4 = 4th step in height scale\n- 5 = 5th step in height scale\n\n- `-25` = literal value 25%\n- `-50` = literal value 50%\n- `-75` = literal value 75%\n- `-100` = literal value 100%\n\n- `-auto` = string value of auto\n- `-inherit` = string value of inherit\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# HEIGHTS\n\n### Docs\n\nhttp://tachyons.io/docs/layout/heights/\n\n### Base\n\n- h = height\n- min-h = min-height\n- min-vh = min-height vertical screen height\n- vh = vertical screen height\n\n### Modifiers\n\n- 1 = 1st step in height scale\n- 2 = 2nd step in height scale\n- 3 = 3rd step in height scale\n- 4 = 4th step in height scale\n- 5 = 5th step in height scale\n\n- `-25` = literal value 25%\n- `-50` = literal value 50%\n- `-75` = literal value 75%\n- `-100` = literal value 100%\n\n- `-auto` = string value of auto\n- `-inherit` = string value of inherit\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n/* Height Scale */\n\n.h1 { height: 1rem; }\n.h2 { height: 2rem; }\n.h3 { height: 4rem; }\n.h4 { height: 8rem; }\n.h5 { height: 16rem; }\n\n/* Height Percentages - Based off of height of parent */\n\n.h-25 { height: 25%; }\n.h-50 { height: 50%; }\n.h-75 { height: 75%; }\n.h-100 { height: 100%; }\n\n.min-h-100 { min-height: 100%; }\n\n/* Screen Height Percentage */\n\n.vh-25 { height: 25vh; }\n.vh-50 { height: 50vh; }\n.vh-75 { height: 75vh; }\n.vh-100 { height: 100vh; }\n\n.min-vh-100 { min-height: 100vh; }\n\n\n/* String Properties */\n\n.h-auto { height: auto; }\n.h-inherit { height: inherit; }\n\n@media (--breakpoint-small) {\n .h1-s { height: 1rem; }\n .h2-s { height: 2rem; }\n .h3-s { height: 4rem; }\n .h4-s { height: 8rem; }\n .h5-s { height: 16rem; }\n .h-25-s { height: 25%; }\n .h-50-s { height: 50%; }\n .h-75-s { height: 75%; }\n .h-100-s { height: 100%; }\n .min-h-100-s { min-height: 100%; }\n .vh-25-s { height: 25vh; }\n .vh-50-s { height: 50vh; }\n .vh-75-s { height: 75vh; }\n .vh-100-s { height: 100vh; }\n .min-vh-100-s { min-height: 100vh; }\n .h-auto-s { height: auto; }\n .h-inherit-s { height: inherit; }\n}\n\n@media (--breakpoint-medium) {\n .h1-m { height: 1rem; }\n .h2-m { height: 2rem; }\n .h3-m { height: 4rem; }\n .h4-m { height: 8rem; }\n .h5-m { height: 16rem; }\n .h-25-m { height: 25%; }\n .h-50-m { height: 50%; }\n .h-75-m { height: 75%; }\n .h-100-m { height: 100%; }\n .min-h-100-m { min-height: 100%; }\n .vh-25-m { height: 25vh; }\n .vh-50-m { height: 50vh; }\n .vh-75-m { height: 75vh; }\n .vh-100-m { height: 100vh; }\n .min-vh-100-m { min-height: 100vh; }\n .h-auto-m { height: auto; }\n .h-inherit-m { height: inherit; }\n}\n\n@media (--breakpoint-large) {\n .h1-l { height: 1rem; }\n .h2-l { height: 2rem; }\n .h3-l { height: 4rem; }\n .h4-l { height: 8rem; }\n .h5-l { height: 16rem; }\n .h-25-l { height: 25%; }\n .h-50-l { height: 50%; }\n .h-75-l { height: 75%; }\n .h-100-l { height: 100%; }\n .min-h-100-l { min-height: 100%; }\n .vh-25-l { height: 25vh; }\n .vh-50-l { height: 50vh; }\n .vh-75-l { height: 75vh; }\n .vh-100-l { height: 100vh; }\n .min-vh-100-l { min-height: 100vh; }\n .h-auto-l { height: auto; }\n .h-inherit-l { height: inherit; }\n}\n", "css": "/*\n\n HEIGHTS\n Docs: http://tachyons.io/docs/layout/heights/\n\n Base:\n h = height\n min-h = min-height\n min-vh = min-height vertical screen height\n vh = vertical screen height\n\n Modifiers\n 1 = 1st step in height scale\n 2 = 2nd step in height scale\n 3 = 3rd step in height scale\n 4 = 4th step in height scale\n 5 = 5th step in height scale\n\n -25 = literal value 25%\n -50 = literal value 50%\n -75 = literal value 75%\n -100 = literal value 100%\n\n -auto = string value of auto\n -inherit = string value of inherit\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n/* Height Scale */\n.h1 { height: 1rem; }\n.h2 { height: 2rem; }\n.h3 { height: 4rem; }\n.h4 { height: 8rem; }\n.h5 { height: 16rem; }\n/* Height Percentages - Based off of height of parent */\n.h-25 { height: 25%; }\n.h-50 { height: 50%; }\n.h-75 { height: 75%; }\n.h-100 { height: 100%; }\n.min-h-100 { min-height: 100%; }\n/* Screen Height Percentage */\n.vh-25 { height: 25vh; }\n.vh-50 { height: 50vh; }\n.vh-75 { height: 75vh; }\n.vh-100 { height: 100vh; }\n.min-vh-100 { min-height: 100vh; }\n/* String Properties */\n.h-auto { height: auto; }\n.h-inherit { height: inherit; }\n@media screen and (min-width: 30em) {\n .h1-ns { height: 1rem; }\n .h2-ns { height: 2rem; }\n .h3-ns { height: 4rem; }\n .h4-ns { height: 8rem; }\n .h5-ns { height: 16rem; }\n .h-25-ns { height: 25%; }\n .h-50-ns { height: 50%; }\n .h-75-ns { height: 75%; }\n .h-100-ns { height: 100%; }\n .min-h-100-ns { min-height: 100%; }\n .vh-25-ns { height: 25vh; }\n .vh-50-ns { height: 50vh; }\n .vh-75-ns { height: 75vh; }\n .vh-100-ns { height: 100vh; }\n .min-vh-100-ns { min-height: 100vh; }\n .h-auto-ns { height: auto; }\n .h-inherit-ns { height: inherit; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .h1-m { height: 1rem; }\n .h2-m { height: 2rem; }\n .h3-m { height: 4rem; }\n .h4-m { height: 8rem; }\n .h5-m { height: 16rem; }\n .h-25-m { height: 25%; }\n .h-50-m { height: 50%; }\n .h-75-m { height: 75%; }\n .h-100-m { height: 100%; }\n .min-h-100-ns { min-height: 100%; }\n .vh-25-m { height: 25vh; }\n .vh-50-m { height: 50vh; }\n .vh-75-m { height: 75vh; }\n .vh-100-m { height: 100vh; }\n .min-vh-100-m { min-height: 100vh; }\n .h-auto-m { height: auto; }\n .h-inherit-m { height: inherit; }\n}\n@media screen and (min-width: 60em) {\n .h1-l { height: 1rem; }\n .h2-l { height: 2rem; }\n .h3-l { height: 4rem; }\n .h4-l { height: 8rem; }\n .h5-l { height: 16rem; }\n .h-25-l { height: 25%; }\n .h-50-l { height: 50%; }\n .h-75-l { height: 75%; }\n .h-100-l { height: 100%; }\n .min-h-100-l { min-height: 100%; }\n .vh-25-l { height: 25vh; }\n .vh-50-l { height: 50vh; }\n .vh-75-l { height: 75vh; }\n .vh-100-l { height: 100vh; }\n .min-vh-100-m { min-height: 100vh; }\n .h-auto-l { height: auto; }\n .h-inherit-l { height: inherit; }\n}\n\n" }, "tachyons-hovers": { @@ -7017,8 +7017,8 @@ ] } ], - "readme": "# tachyons-hovers 2.4.4\n\nPerformance based css module.\n\n#### Stats\n\n925 | 25 | 50\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-hovers\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-hovers\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-hovers.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-hovers\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n HOVER EFFECTS\n Docs: http://tachyons.io/docs/themes/hovers/\n\n - Dim\n - Hide Child\n - Underline text\n - Grow\n - Pointer\n - Shadow\n\n*/\n/*\n\n Dim element on hover by adding the dim class.\n\n*/\n.dim { opacity: 1; -webkit-transition: opacity .15s ease-in; transition: opacity .15s ease-in; }\n.dim:hover, .dim:focus { opacity: .5; -webkit-transition: opacity .15s ease-in; transition: opacity .15s ease-in; }\n.dim:active { opacity: .8; -webkit-transition: opacity .15s ease-out; transition: opacity .15s ease-out; }\n/*\n\n Hide child & reveal on hover:\n\n Put the hide-child class on a parent element and any nested element with the\n child class will be hidden and displayed on hover or focus.\n\n
\n
Hidden until hover or focus
\n
Hidden until hover or focus
\n
Hidden until hover or focus
\n
Hidden until hover or focus
\n
\n*/\n.hide-child .child { opacity: 0; -webkit-transition: opacity .15s ease-in; transition: opacity .15s ease-in; }\n.hide-child:hover .child, .hide-child:focus .child, .hide-child:active .child { opacity: 1; -webkit-transition: opacity .15s ease-in; transition: opacity .15s ease-in; }\n.underline-hover:hover, .underline-hover:focus { text-decoration: underline; }\n/* Can combine this with overflow-hidden to make background images grow on hover\n * even if you are using background-size: cover */\n.grow { -moz-osx-font-smoothing: grayscale; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translateZ( 0 ); transform: translateZ( 0 ); -webkit-transition: -webkit-transform .25s ease-out; transition: -webkit-transform .25s ease-out; transition: transform .25s ease-out; transition: transform .25s ease-out, -webkit-transform .25s ease-out; }\n.grow:hover, .grow:focus { -webkit-transform: scale( 1.05 ); transform: scale( 1.05 ); }\n.grow:active { -webkit-transform: scale( .90 ); transform: scale( .90 ); }\n.grow-large { -moz-osx-font-smoothing: grayscale; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translateZ( 0 ); transform: translateZ( 0 ); -webkit-transition: -webkit-transform .25s ease-in-out; transition: -webkit-transform .25s ease-in-out; transition: transform .25s ease-in-out; transition: transform .25s ease-in-out, -webkit-transform .25s ease-in-out; }\n.grow-large:hover, .grow-large:focus { -webkit-transform: scale( 1.2 ); transform: scale( 1.2 ); }\n.grow-large:active { -webkit-transform: scale( .95 ); transform: scale( .95 ); }\n/* Add pointer on hover */\n.pointer:hover { cursor: pointer; }\n/* \n Add shadow on hover.\n\n Performant box-shadow animation pattern from \n http://tobiasahlin.com/blog/how-to-animate-box-shadow/ \n*/\n.shadow-hover::after { box-shadow: 0 0 8px 2px rgba( 0, 0, 0, .2 ); opacity: 0; -webkit-transition: opacity .25s ease-in-out; transition: opacity .25s ease-in-out; }\n.shadow-hover:hover::after, .shadow-hover:focus::after { opacity: 1; }\n/* Combine with classes in skins and skins-pseudo for \n * thousands of different transition possibilities. */\n.bg-animate, .bg-animate:hover, .bg-animate:focus { -webkit-transition: background-color .15s ease-in-out; transition: background-color .15s ease-in-out; }\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "/*\n\n HOVER EFFECTS\n Docs: http://tachyons.io/docs/themes/hovers/\n\n - Dim\n - Hide Child\n - Underline text\n - Grow\n - Pointer\n - Shadow\n\n*/\n\n/*\n\n Dim element on hover by adding the dim class.\n\n*/\n.dim {\n opacity: 1;\n transition: opacity .15s ease-in;\n}\n.dim:hover,\n.dim:focus {\n opacity: .5;\n transition: opacity .15s ease-in;\n}\n.dim:active {\n opacity: .8; transition: opacity .15s ease-out;\n}\n\n/*\n\n Hide child & reveal on hover:\n\n Put the hide-child class on a parent element and any nested element with the\n child class will be hidden and displayed on hover or focus.\n\n
\n
Hidden until hover or focus
\n
Hidden until hover or focus
\n
Hidden until hover or focus
\n
Hidden until hover or focus
\n
\n*/\n\n.hide-child .child {\n opacity: 0;\n transition: opacity .15s ease-in;\n}\n.hide-child:hover .child,\n.hide-child:focus .child,\n.hide-child:active .child {\n opacity: 1;\n transition: opacity .15s ease-in;\n}\n\n.underline-hover:hover,\n.underline-hover:focus {\n text-decoration: underline;\n}\n\n/* Can combine this with overflow-hidden to make background images grow on hover\n * even if you are using background-size: cover */\n\n.grow {\n -moz-osx-font-smoothing: grayscale;\n backface-visibility: hidden;\n transform: translateZ(0);\n transition: transform 0.25s ease-out;\n}\n\n.grow:hover,\n.grow:focus {\n transform: scale(1.05);\n}\n\n.grow:active {\n transform: scale(.90);\n}\n\n.grow-large {\n -moz-osx-font-smoothing: grayscale;\n backface-visibility: hidden;\n transform: translateZ(0);\n transition: transform .25s ease-in-out;\n}\n\n.grow-large:hover,\n.grow-large:focus {\n transform: scale(1.2);\n}\n\n.grow-large:active {\n transform: scale(.95);\n}\n\n/* Add pointer on hover */\n\n.pointer:hover {\n cursor: pointer;\n}\n\n/* \n Add shadow on hover.\n\n Performant box-shadow animation pattern from \n http://tobiasahlin.com/blog/how-to-animate-box-shadow/ \n*/\n\n.shadow-hover::after {\n box-shadow: 0px 0px 8px 2px rgba( 0, 0, 0, .2 );\n opacity: 0;\n transition: opacity .25s ease-in-out;\n}\n\n.shadow-hover:hover::after,\n.shadow-hover:focus::after {\n opacity: 1;\n}\n\n/* Combine with classes in skins and skins-pseudo for \n * thousands of different transition possibilities. */\n\n.bg-animate,\n.bg-animate:hover,\n.bg-animate:focus {\n transition: background-color .15s ease-in-out; \n}\n\n", + "readme": "\n\n# HOVER EFFECTS\n\n### Docs\n\nhttp://tachyons.io/docs/themes/hovers/\n\n### Base\n\n- dim - Dim element on hover\n- glow - Animate opacity to 100% on hover\n- hide-child - Hide child & reveal on hover\n- underline-hover - Underline text on hover\n- grow - Grow element on hover\n- pointer - Show cursor: pointer on hover\n- shadow - Show shadow on hover\n- bg-animate - Animate background color on hover\n\n### Examples\n\n##### Hide child & reveal on hover\n\nPut the hide-child class on a parent element and any nested element with the\nchild class will be hidden and displayed on hover or focus.\n\n```html\n
\n
Hidden until hover or focus
\n
Hidden until hover or focus
\n
Hidden until hover or focus
\n
Hidden until hover or focus
\n
\n```\n", + "src": "/*!!!\n\n# HOVER EFFECTS\n\n### Docs\n\nhttp://tachyons.io/docs/themes/hovers/\n\n### Base\n\n- dim - Dim element on hover\n- glow - Animate opacity to 100% on hover\n- hide-child - Hide child & reveal on hover\n- underline-hover - Underline text on hover\n- grow - Grow element on hover\n- pointer - Show cursor: pointer on hover\n- shadow - Show shadow on hover\n- bg-animate - Animate background color on hover\n\n### Examples\n\n##### Hide child & reveal on hover\n\nPut the hide-child class on a parent element and any nested element with the\nchild class will be hidden and displayed on hover or focus.\n\n```html\n
\n
Hidden until hover or focus
\n
Hidden until hover or focus
\n
Hidden until hover or focus
\n
Hidden until hover or focus
\n
\n```\n*/\n\n/*\n\n Dim element on hover by adding the dim class.\n\n*/\n.dim {\n opacity: 1;\n transition: opacity .15s ease-in;\n}\n.dim:hover,\n.dim:focus {\n opacity: .5;\n transition: opacity .15s ease-in;\n}\n.dim:active {\n opacity: .8; transition: opacity .15s ease-out;\n}\n\n/*\n\n Animate opacity to 100% on hover by adding the glow class.\n\n*/\n.glow {\n transition: opacity .15s ease-in;\n}\n.glow:hover,\n.glow:focus {\n opacity: 1;\n transition: opacity .15s ease-in;\n}\n\n/*\n\n Hide child & reveal on hover:\n\n Put the hide-child class on a parent element and any nested element with the\n child class will be hidden and displayed on hover or focus.\n\n
\n
Hidden until hover or focus
\n
Hidden until hover or focus
\n
Hidden until hover or focus
\n
Hidden until hover or focus
\n
\n*/\n\n.hide-child .child {\n opacity: 0;\n transition: opacity .15s ease-in;\n}\n.hide-child:hover .child,\n.hide-child:focus .child,\n.hide-child:active .child {\n opacity: 1;\n transition: opacity .15s ease-in;\n}\n\n.underline-hover:hover,\n.underline-hover:focus {\n text-decoration: underline;\n}\n\n/* Can combine this with overflow-hidden to make background images grow on hover\n * even if you are using background-size: cover */\n\n.grow {\n -moz-osx-font-smoothing: grayscale;\n backface-visibility: hidden;\n transform: translateZ(0);\n transition: transform 0.25s ease-out;\n}\n\n.grow:hover,\n.grow:focus {\n transform: scale(1.05);\n}\n\n.grow:active {\n transform: scale(.90);\n}\n\n.grow-large {\n -moz-osx-font-smoothing: grayscale;\n backface-visibility: hidden;\n transform: translateZ(0);\n transition: transform .25s ease-in-out;\n}\n\n.grow-large:hover,\n.grow-large:focus {\n transform: scale(1.2);\n}\n\n.grow-large:active {\n transform: scale(.95);\n}\n\n/* Add pointer on hover */\n\n.pointer:hover {\n cursor: pointer;\n}\n\n/*\n Add shadow on hover.\n\n Performant box-shadow animation pattern from\n http://tobiasahlin.com/blog/how-to-animate-box-shadow/\n*/\n\n.shadow-hover {\n cursor: pointer;\n position: relative;\n transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);\n}\n\n.shadow-hover::after {\n content: '';\n box-shadow: 0px 0px 16px 2px rgba( 0, 0, 0, .2 );\n border-radius: inherit;\n opacity: 0;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: -1;\n transition: opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);\n}\n\n.shadow-hover:hover::after,\n.shadow-hover:focus::after {\n opacity: 1;\n}\n\n/* Combine with classes in skins and skins-pseudo for\n * many different transition possibilities. */\n\n.bg-animate,\n.bg-animate:hover,\n.bg-animate:focus {\n transition: background-color .15s ease-in-out;\n}\n", "css": "/*\n\n HOVER EFFECTS\n Docs: http://tachyons.io/docs/themes/hovers/\n\n - Dim\n - Hide Child\n - Underline text\n - Grow\n - Pointer\n - Shadow\n\n*/\n/*\n\n Dim element on hover by adding the dim class.\n\n*/\n.dim { opacity: 1; -webkit-transition: opacity .15s ease-in; transition: opacity .15s ease-in; }\n.dim:hover, .dim:focus { opacity: .5; -webkit-transition: opacity .15s ease-in; transition: opacity .15s ease-in; }\n.dim:active { opacity: .8; -webkit-transition: opacity .15s ease-out; transition: opacity .15s ease-out; }\n/*\n\n Hide child & reveal on hover:\n\n Put the hide-child class on a parent element and any nested element with the\n child class will be hidden and displayed on hover or focus.\n\n
\n
Hidden until hover or focus
\n
Hidden until hover or focus
\n
Hidden until hover or focus
\n
Hidden until hover or focus
\n
\n*/\n.hide-child .child { opacity: 0; -webkit-transition: opacity .15s ease-in; transition: opacity .15s ease-in; }\n.hide-child:hover .child, .hide-child:focus .child, .hide-child:active .child { opacity: 1; -webkit-transition: opacity .15s ease-in; transition: opacity .15s ease-in; }\n.underline-hover:hover, .underline-hover:focus { text-decoration: underline; }\n/* Can combine this with overflow-hidden to make background images grow on hover\n * even if you are using background-size: cover */\n.grow { -moz-osx-font-smoothing: grayscale; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translateZ( 0 ); transform: translateZ( 0 ); -webkit-transition: -webkit-transform .25s ease-out; transition: -webkit-transform .25s ease-out; transition: transform .25s ease-out; transition: transform .25s ease-out, -webkit-transform .25s ease-out; }\n.grow:hover, .grow:focus { -webkit-transform: scale( 1.05 ); transform: scale( 1.05 ); }\n.grow:active { -webkit-transform: scale( .90 ); transform: scale( .90 ); }\n.grow-large { -moz-osx-font-smoothing: grayscale; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translateZ( 0 ); transform: translateZ( 0 ); -webkit-transition: -webkit-transform .25s ease-in-out; transition: -webkit-transform .25s ease-in-out; transition: transform .25s ease-in-out; transition: transform .25s ease-in-out, -webkit-transform .25s ease-in-out; }\n.grow-large:hover, .grow-large:focus { -webkit-transform: scale( 1.2 ); transform: scale( 1.2 ); }\n.grow-large:active { -webkit-transform: scale( .95 ); transform: scale( .95 ); }\n/* Add pointer on hover */\n.pointer:hover { cursor: pointer; }\n/* \n Add shadow on hover.\n\n Performant box-shadow animation pattern from \n http://tobiasahlin.com/blog/how-to-animate-box-shadow/ \n*/\n.shadow-hover::after { box-shadow: 0 0 8px 2px rgba( 0, 0, 0, .2 ); opacity: 0; -webkit-transition: opacity .25s ease-in-out; transition: opacity .25s ease-in-out; }\n.shadow-hover:hover::after, .shadow-hover:focus::after { opacity: 1; }\n/* Combine with classes in skins and skins-pseudo for \n * thousands of different transition possibilities. */\n.bg-animate, .bg-animate:hover, .bg-animate:focus { -webkit-transition: background-color .15s ease-in-out; transition: background-color .15s ease-in-out; }\n\n" }, "tachyons-images": { @@ -7034,8 +7034,8 @@ ] } ], - "readme": "# tachyons-images 1.0.7\n\nPerformance based css module.\n\n#### Stats\n\n87 | 1 | 1\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-images\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-images\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-images.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-images\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\n/*\n\n IMAGES\n\n*/\n/* Responsive images! */\nimg { max-width: 100%; }\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "/*\n\n IMAGES\n\n*/\n\n/* Responsive images! */\n\nimg { max-width: 100%; }\n\n", + "readme": "\n\n# IMAGES\n\n### Docs\n\nhttp://tachyons.io/docs/elements/images/\n", + "src": "/*!!!\n\n# IMAGES\n\n### Docs\n\nhttp://tachyons.io/docs/elements/images/\n*/\n\n/* Responsive images! */\n\nimg { max-width: 100%; }\n", "css": "/*\n\n IMAGES\n\n*/\n/* Responsive images! */\nimg { max-width: 100%; }\n\n" }, "tachyons-letter-spacing": { @@ -7128,8 +7128,8 @@ ] } ], - "readme": "# tachyons-letter-spacing 3.0.0\n\nPerformance based css module.\n\n#### Stats\n\n196 | 12 | 12\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-letter-spacing\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-letter-spacing\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-letter-spacing.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-letter-spacing\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\n/*\n\n LETTER SPACING\n\n*/\n.tracked { letter-spacing: .1em; }\n.tracked-tight { letter-spacing: -.05em; }\n.tracked-mega { letter-spacing: .25em; }\n@media screen and (min-width: 30em) {\n .tracked-ns { letter-spacing: .1em; }\n .tracked-tight-ns { letter-spacing: -.05em; }\n .tracked-mega-ns { letter-spacing: .25em; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .tracked-m { letter-spacing: .1em; }\n .tracked-tight-m { letter-spacing: -.05em; }\n .tracked-mega-m { letter-spacing: .25em; }\n}\n@media screen and (min-width: 60em) {\n .tracked-l { letter-spacing: .1em; }\n .tracked-tight-l { letter-spacing: -.05em; }\n .tracked-mega-l { letter-spacing: .25em; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n LETTER SPACING\n\n*/\n\n.tracked { letter-spacing: .1em; }\n.tracked-tight { letter-spacing: -.05em; }\n.tracked-mega { letter-spacing: .25em; }\n\n@media (--breakpoint-not-small) {\n .tracked-ns { letter-spacing: .1em; }\n .tracked-tight-ns { letter-spacing: -.05em; }\n .tracked-mega-ns { letter-spacing: .25em; }\n}\n\n@media (--breakpoint-medium) {\n .tracked-m { letter-spacing: .1em; }\n .tracked-tight-m { letter-spacing: -.05em; }\n .tracked-mega-m { letter-spacing: .25em; }\n}\n\n@media (--breakpoint-large) {\n .tracked-l { letter-spacing: .1em; }\n .tracked-tight-l { letter-spacing: -.05em; }\n .tracked-mega-l { letter-spacing: .25em; }\n}\n", + "readme": "\n\n# LETTER SPACING\n\n### Docs\n\nhttp://tachyons.io/docs/typography/tracking/\n\n### Base\n\n- tracked\n\n### Literal Values\n\n- `-tight`\n- `-mega`\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# LETTER SPACING\n\n### Docs\n\nhttp://tachyons.io/docs/typography/tracking/\n\n### Base\n\n- tracked\n\n### Literal Values\n\n- `-tight`\n- `-mega`\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n.tracked { letter-spacing: .1em; }\n.tracked-tight { letter-spacing: -.05em; }\n.tracked-mega { letter-spacing: .25em; }\n\n@media (--breakpoint-small) {\n .tracked-s { letter-spacing: .1em; }\n .tracked-tight-s { letter-spacing: -.05em; }\n .tracked-mega-s { letter-spacing: .25em; }\n}\n\n@media (--breakpoint-medium) {\n .tracked-m { letter-spacing: .1em; }\n .tracked-tight-m { letter-spacing: -.05em; }\n .tracked-mega-m { letter-spacing: .25em; }\n}\n\n@media (--breakpoint-large) {\n .tracked-l { letter-spacing: .1em; }\n .tracked-tight-l { letter-spacing: -.05em; }\n .tracked-mega-l { letter-spacing: .25em; }\n}\n", "css": "/*\n\n LETTER SPACING\n\n*/\n.tracked { letter-spacing: .1em; }\n.tracked-tight { letter-spacing: -.05em; }\n.tracked-mega { letter-spacing: .25em; }\n@media screen and (min-width: 30em) {\n .tracked-ns { letter-spacing: .1em; }\n .tracked-tight-ns { letter-spacing: -.05em; }\n .tracked-mega-ns { letter-spacing: .25em; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .tracked-m { letter-spacing: .1em; }\n .tracked-tight-m { letter-spacing: -.05em; }\n .tracked-mega-m { letter-spacing: .25em; }\n}\n@media screen and (min-width: 60em) {\n .tracked-l { letter-spacing: .1em; }\n .tracked-tight-l { letter-spacing: -.05em; }\n .tracked-mega-l { letter-spacing: .25em; }\n}\n\n" }, "tachyons-line-height": { @@ -7222,8 +7222,8 @@ ] } ], - "readme": "# tachyons-line-height 3.0.1\n\nPerformance based css module.\n\n#### Stats\n\n273 | 12 | 12\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-line-height\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-line-height\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-line-height.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-line-height\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n LINE HEIGHT / LEADING\n Docs: http://tachyons.io/docs/typography/line-height\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n.lh-solid { line-height: 1; }\n.lh-title { line-height: 1.25; }\n.lh-copy { line-height: 1.5; }\n@media screen and (min-width: 30em) {\n .lh-solid-ns { line-height: 1; }\n .lh-title-ns { line-height: 1.25; }\n .lh-copy-ns { line-height: 1.5; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .lh-solid-m { line-height: 1; }\n .lh-title-m { line-height: 1.25; }\n .lh-copy-m { line-height: 1.5; }\n}\n@media screen and (min-width: 60em) {\n .lh-solid-l { line-height: 1; }\n .lh-title-l { line-height: 1.25; }\n .lh-copy-l { line-height: 1.5; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n LINE HEIGHT / LEADING\n Docs: http://tachyons.io/docs/typography/line-height\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n\n .lh-solid { line-height: 1; }\n .lh-title { line-height: 1.25; }\n .lh-copy { line-height: 1.5; }\n\n@media (--breakpoint-not-small) {\n .lh-solid-ns { line-height: 1; }\n .lh-title-ns { line-height: 1.25; }\n .lh-copy-ns { line-height: 1.5; }\n}\n\n@media (--breakpoint-medium) {\n .lh-solid-m { line-height: 1; }\n .lh-title-m { line-height: 1.25; }\n .lh-copy-m { line-height: 1.5; }\n}\n\n@media (--breakpoint-large) {\n .lh-solid-l { line-height: 1; }\n .lh-title-l { line-height: 1.25; }\n .lh-copy-l { line-height: 1.5; }\n}\n\n", + "readme": "\n\n# LINE HEIGHT / LEADING\n\n### Docs\n\nhttp://tachyons.io/docs/typography/line-height\n\n### Base\n\n- lh = line height\n\n### Literal Values\n\n- `-solid` = literal value 1\n- `-title` = literal value 1.25\n- `-copy` = literal value 1.5\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# LINE HEIGHT / LEADING\n\n### Docs\n\nhttp://tachyons.io/docs/typography/line-height\n\n### Base\n\n- lh = line height\n\n### Literal Values\n\n- `-solid` = literal value 1\n- `-title` = literal value 1.25\n- `-copy` = literal value 1.5\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n.lh-solid { line-height: 1; }\n.lh-title { line-height: 1.25; }\n.lh-copy { line-height: 1.5; }\n\n@media (--breakpoint-small) {\n .lh-solid-s { line-height: 1; }\n .lh-title-s { line-height: 1.25; }\n .lh-copy-s { line-height: 1.5; }\n}\n\n@media (--breakpoint-medium) {\n .lh-solid-m { line-height: 1; }\n .lh-title-m { line-height: 1.25; }\n .lh-copy-m { line-height: 1.5; }\n}\n\n@media (--breakpoint-large) {\n .lh-solid-l { line-height: 1; }\n .lh-title-l { line-height: 1.25; }\n .lh-copy-l { line-height: 1.5; }\n}\n", "css": "/*\n\n LINE HEIGHT / LEADING\n Docs: http://tachyons.io/docs/typography/line-height\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n.lh-solid { line-height: 1; }\n.lh-title { line-height: 1.25; }\n.lh-copy { line-height: 1.5; }\n@media screen and (min-width: 30em) {\n .lh-solid-ns { line-height: 1; }\n .lh-title-ns { line-height: 1.25; }\n .lh-copy-ns { line-height: 1.5; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .lh-solid-m { line-height: 1; }\n .lh-title-m { line-height: 1.25; }\n .lh-copy-m { line-height: 1.5; }\n}\n@media screen and (min-width: 60em) {\n .lh-solid-l { line-height: 1; }\n .lh-title-l { line-height: 1.25; }\n .lh-copy-l { line-height: 1.5; }\n}\n\n" }, "tachyons-links": { @@ -7273,8 +7273,8 @@ ] } ], - "readme": "# tachyons-links 3.0.5\n\nPerformance based css module.\n\n#### Stats\n\n138 | 6 | 6\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-links\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-links\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-links.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-links\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\n/*\n\n LINKS\n\n*/\n.link { text-decoration: none; transition: color .15s ease-in; }\n.link:link, .link:visited { transition: color .15s ease-in; }\n.link:hover { transition: color .15s ease-in; }\n.link:active { transition: color .15s ease-in; }\n.link:focus { transition: color .15s ease-in; }\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "/*\n\n LINKS\n\n*/\n\n.link {\n text-decoration: none;\n transition: color .15s ease-in;\n}\n\n.link:link,\n.link:visited {\n transition: color .15s ease-in;\n}\n.link:hover {\n transition: color .15s ease-in;\n}\n.link:active {\n transition: color .15s ease-in;\n}\n.link:focus {\n transition: color .15s ease-in;\n}\n\n", + "readme": "\n\n# LINKS\n\n### Docs\n\nhttp://tachyons.io/docs/elements/links/\n\n### Base\n- link\n", + "src": "/*!!!\n\n# LINKS\n\n### Docs\n\nhttp://tachyons.io/docs/elements/links/\n\n### Base\n- link\n*/\n\n.link {\n text-decoration: none;\n transition: color .15s ease-in;\n}\n\n.link:link,\n.link:visited {\n transition: color .15s ease-in;\n}\n.link:hover {\n transition: color .15s ease-in;\n}\n.link:active {\n transition: color .15s ease-in;\n}\n.link:focus {\n transition: color .15s ease-in;\n outline: 1px dotted currentColor;\n}\n", "css": "/*\n\n LINKS\n\n*/\n.link { text-decoration: none; -webkit-transition: color .15s ease-in; transition: color .15s ease-in; }\n.link:link, .link:visited { -webkit-transition: color .15s ease-in; transition: color .15s ease-in; }\n.link:hover { -webkit-transition: color .15s ease-in; transition: color .15s ease-in; }\n.link:active { -webkit-transition: color .15s ease-in; transition: color .15s ease-in; }\n.link:focus { -webkit-transition: color .15s ease-in; transition: color .15s ease-in; }\n\n" }, "tachyons-lists": { @@ -7290,8 +7290,8 @@ ] } ], - "readme": "# tachyons-lists 2.0.8\n\nPerformance based css module.\n\n#### Stats\n\n67 | 1 | 1\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-lists\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-lists\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-lists.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-lists\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\n/*\n\n LISTS\n\n*/\n.list { list-style-type: none; }\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "/*\n\n LISTS\n\n*/\n\n.list { list-style-type: none; }\n", + "readme": "\n\n# LISTS\n\n### Docs\n\nhttp://tachyons.io/docs/elements/lists/\n\n### Base\n\n- list\n", + "src": "/*!!!\n\n# LISTS\n\n### Docs\n\nhttp://tachyons.io/docs/elements/lists/\n\n### Base\n\n- list\n*/\n\n.list { list-style-type: none; }\n", "css": "/*\n\n LISTS\n\n*/\n.list { list-style-type: none; }\n\n" }, "tachyons-max-widths": { @@ -7608,8 +7608,8 @@ ] } ], - "readme": "# tachyons-max-widths 4.0.5\n\nPerformance based css module.\n\n#### Stats\n\n346 | 44 | 44\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-max-widths\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-max-widths\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-max-widths.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-max-widths\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n MAX WIDTHS\n\n*/\n/* Max Width Percentages */\n.mw-100 { max-width: 100%; }\n/* Max Width Scale */\n.mw1 { max-width: 1rem; }\n.mw2 { max-width: 2rem; }\n.mw3 { max-width: 4rem; }\n.mw4 { max-width: 8rem; }\n.mw5 { max-width: 16rem; }\n.mw6 { max-width: 32rem; }\n.mw7 { max-width: 48rem; }\n.mw8 { max-width: 64rem; }\n.mw9 { max-width: 96rem; }\n/* Max Width String Properties */\n.mw-none { max-width: none; }\n@media screen and (min-width: 30em) {\n .mw-100-ns { max-width: 100%; }\n .mw1-ns { max-width: 1rem; }\n .mw2-ns { max-width: 2rem; }\n .mw3-ns { max-width: 4rem; }\n .mw4-ns { max-width: 8rem; }\n .mw5-ns { max-width: 16rem; }\n .mw6-ns { max-width: 32rem; }\n .mw7-ns { max-width: 48rem; }\n .mw8-ns { max-width: 64rem; }\n .mw9-ns { max-width: 96rem; }\n .mw-none-ns { max-width: none; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .mw-100-m { max-width: 100%; }\n .mw1-m { max-width: 1rem; }\n .mw2-m { max-width: 2rem; }\n .mw3-m { max-width: 4rem; }\n .mw4-m { max-width: 8rem; }\n .mw5-m { max-width: 16rem; }\n .mw6-m { max-width: 32rem; }\n .mw7-m { max-width: 48rem; }\n .mw8-m { max-width: 64rem; }\n .mw9-m { max-width: 96rem; }\n .mw-none-m { max-width: none; }\n}\n@media screen and (min-width: 60em) {\n .mw-100-l { max-width: 100%; }\n .mw1-l { max-width: 1rem; }\n .mw2-l { max-width: 2rem; }\n .mw3-l { max-width: 4rem; }\n .mw4-l { max-width: 8rem; }\n .mw5-l { max-width: 16rem; }\n .mw6-l { max-width: 32rem; }\n .mw7-l { max-width: 48rem; }\n .mw8-l { max-width: 64rem; }\n .mw9-l { max-width: 96rem; }\n .mw-none-l { max-width: none; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n MAX WIDTHS\n\n*/\n\n/* Max Width Percentages */\n\n.mw-100 { max-width: 100%; }\n\n/* Max Width Scale */\n\n.mw1 { max-width: 1rem; }\n.mw2 { max-width: 2rem; }\n.mw3 { max-width: 4rem; }\n.mw4 { max-width: 8rem; }\n.mw5 { max-width: 16rem; }\n.mw6 { max-width: 32rem; }\n.mw7 { max-width: 48rem; }\n.mw8 { max-width: 64rem; }\n.mw9 { max-width: 96rem; }\n\n/* Max Width String Properties */\n\n.mw-none { max-width: none; }\n\n@media (--breakpoint-not-small) {\n .mw-100-ns { max-width: 100%; }\n\n .mw1-ns { max-width: 1rem; }\n .mw2-ns { max-width: 2rem; }\n .mw3-ns { max-width: 4rem; }\n .mw4-ns { max-width: 8rem; }\n .mw5-ns { max-width: 16rem; }\n .mw6-ns { max-width: 32rem; }\n .mw7-ns { max-width: 48rem; }\n .mw8-ns { max-width: 64rem; }\n .mw9-ns { max-width: 96rem; }\n\n .mw-none-ns { max-width: none; }\n}\n\n@media (--breakpoint-medium) {\n .mw-100-m { max-width: 100%; }\n\n .mw1-m { max-width: 1rem; }\n .mw2-m { max-width: 2rem; }\n .mw3-m { max-width: 4rem; }\n .mw4-m { max-width: 8rem; }\n .mw5-m { max-width: 16rem; }\n .mw6-m { max-width: 32rem; }\n .mw7-m { max-width: 48rem; }\n .mw8-m { max-width: 64rem; }\n .mw9-m { max-width: 96rem; }\n\n .mw-none-m { max-width: none; }\n}\n\n@media (--breakpoint-large) {\n .mw-100-l { max-width: 100%; }\n\n .mw1-l { max-width: 1rem; }\n .mw2-l { max-width: 2rem; }\n .mw3-l { max-width: 4rem; }\n .mw4-l { max-width: 8rem; }\n .mw5-l { max-width: 16rem; }\n .mw6-l { max-width: 32rem; }\n .mw7-l { max-width: 48rem; }\n .mw8-l { max-width: 64rem; }\n .mw9-l { max-width: 96rem; }\n\n .mw-none-l { max-width: none; }\n}\n", + "readme": "\n\n# MAX WIDTHS\n\n### Docs\n\nhttp://tachyons.io/docs/layout/max-widths/\n\n### Base\n\n- mw = max-width\n\n### Modifiers\n\n- 1 = 1st step in width scale\n- 2 = 2nd step in width scale\n- 3 = 3rd step in width scale\n- 4 = 4th step in width scale\n- 5 = 5th step in width scale\n- 6 = 6st step in width scale\n- 7 = 7nd step in width scale\n- 8 = 8rd step in width scale\n- 9 = 9th step in width scale\n\n- `-100` = literal value 100%\n\n- `-none` = string value none\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# MAX WIDTHS\n\n### Docs\n\nhttp://tachyons.io/docs/layout/max-widths/\n\n### Base\n\n- mw = max-width\n\n### Modifiers\n\n- 1 = 1st step in width scale\n- 2 = 2nd step in width scale\n- 3 = 3rd step in width scale\n- 4 = 4th step in width scale\n- 5 = 5th step in width scale\n- 6 = 6st step in width scale\n- 7 = 7nd step in width scale\n- 8 = 8rd step in width scale\n- 9 = 9th step in width scale\n\n- `-100` = literal value 100%\n\n- `-none` = string value none\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n/* Max Width Percentages */\n\n.mw-100 { max-width: 100%; }\n\n/* Max Width Scale */\n\n.mw1 { max-width: 1rem; }\n.mw2 { max-width: 2rem; }\n.mw3 { max-width: 4rem; }\n.mw4 { max-width: 8rem; }\n.mw5 { max-width: 16rem; }\n.mw6 { max-width: 32rem; }\n.mw7 { max-width: 48rem; }\n.mw8 { max-width: 56rem; }\n.mw9 { max-width: 64rem; }\n.mw10 { max-width: 80rem; }\n\n/* Max Width String Properties */\n\n.mw-none { max-width: none; }\n\n\n@media (--breakpoint-small) {\n .mw-100-s { max-width: 100%; }\n\n .mw1-s { max-width: 1rem; }\n .mw2-s { max-width: 2rem; }\n .mw3-s { max-width: 4rem; }\n .mw4-s { max-width: 8rem; }\n .mw5-s { max-width: 16rem; }\n .mw6-s { max-width: 32rem; }\n .mw7-s { max-width: 48rem; }\n .mw8-s { max-width: 56rem; }\n .mw9-s { max-width: 64rem; }\n .mw10-s { max-width: 80rem; }\n\n .mw-none-s { max-width: none; }\n}\n\n@media (--breakpoint-medium) {\n .mw-100-m { max-width: 100%; }\n\n .mw1-m { max-width: 1rem; }\n .mw2-m { max-width: 2rem; }\n .mw3-m { max-width: 4rem; }\n .mw4-m { max-width: 8rem; }\n .mw5-m { max-width: 16rem; }\n .mw6-m { max-width: 32rem; }\n .mw7-m { max-width: 48rem; }\n .mw8-m { max-width: 56rem; }\n .mw9-m { max-width: 64rem; }\n .mw10-m { max-width: 80rem; }\n\n .mw-none-m { max-width: none; }\n}\n\n@media (--breakpoint-large) {\n .mw-100-l { max-width: 100%; }\n\n .mw1-l { max-width: 1rem; }\n .mw2-l { max-width: 2rem; }\n .mw3-l { max-width: 4rem; }\n .mw4-l { max-width: 8rem; }\n .mw5-l { max-width: 16rem; }\n .mw6-l { max-width: 32rem; }\n .mw7-l { max-width: 48rem; }\n .mw8-l { max-width: 56rem; }\n .mw9-l { max-width: 64rem; }\n .mw9-l { max-width: 80rem; }\n\n .mw-none-l { max-width: none; }\n}\n", "css": "/*\n\n MAX WIDTHS\n\n*/\n/* Max Width Percentages */\n.mw-100 { max-width: 100%; }\n/* Max Width Scale */\n.mw1 { max-width: 1rem; }\n.mw2 { max-width: 2rem; }\n.mw3 { max-width: 4rem; }\n.mw4 { max-width: 8rem; }\n.mw5 { max-width: 16rem; }\n.mw6 { max-width: 32rem; }\n.mw7 { max-width: 48rem; }\n.mw8 { max-width: 64rem; }\n.mw9 { max-width: 96rem; }\n/* Max Width String Properties */\n.mw-none { max-width: none; }\n@media screen and (min-width: 30em) {\n .mw-100-ns { max-width: 100%; }\n .mw1-ns { max-width: 1rem; }\n .mw2-ns { max-width: 2rem; }\n .mw3-ns { max-width: 4rem; }\n .mw4-ns { max-width: 8rem; }\n .mw5-ns { max-width: 16rem; }\n .mw6-ns { max-width: 32rem; }\n .mw7-ns { max-width: 48rem; }\n .mw8-ns { max-width: 64rem; }\n .mw9-ns { max-width: 96rem; }\n .mw-none-ns { max-width: none; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .mw-100-m { max-width: 100%; }\n .mw1-m { max-width: 1rem; }\n .mw2-m { max-width: 2rem; }\n .mw3-m { max-width: 4rem; }\n .mw4-m { max-width: 8rem; }\n .mw5-m { max-width: 16rem; }\n .mw6-m { max-width: 32rem; }\n .mw7-m { max-width: 48rem; }\n .mw8-m { max-width: 64rem; }\n .mw9-m { max-width: 96rem; }\n .mw-none-m { max-width: none; }\n}\n@media screen and (min-width: 60em) {\n .mw-100-l { max-width: 100%; }\n .mw1-l { max-width: 1rem; }\n .mw2-l { max-width: 2rem; }\n .mw3-l { max-width: 4rem; }\n .mw4-l { max-width: 8rem; }\n .mw5-l { max-width: 16rem; }\n .mw6-l { max-width: 32rem; }\n .mw7-l { max-width: 48rem; }\n .mw8-l { max-width: 64rem; }\n .mw9-l { max-width: 96rem; }\n .mw-none-l { max-width: none; }\n}\n\n" }, "tachyons-negative-margins": { @@ -8598,8 +8598,8 @@ ] } ], - "readme": "# tachyons-negative-margins 1.0.0\n\nnegative-margins CSS module for Tachyons\n\n#### Stats\n\n716 | 140 | 140\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-negative-margins\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-negative-margins\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-negative-margins.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-negative-margins\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n TACHYONS - NEGATIVE MARGINS\n\n Base:\n n = negative\n\n Modifiers:\n a = all\n t = top\n r = right\n b = bottom\n l = left\n\n 1 = 1st step in spacing scale\n 2 = 2nd step in spacing scale\n 3 = 3rd step in spacing scale\n 4 = 4th step in spacing scale\n 5 = 5th step in spacing scale\n 6 = 6th step in spacing scale\n 7 = 7th step in spacing scale\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n.na1 { margin: undefined; }\n.na2 { margin: undefined; }\n.na3 { margin: undefined; }\n.na4 { margin: undefined; }\n.na5 { margin: undefined; }\n.na6 { margin: undefined; }\n.na7 { margin: undefined; }\n.nl1 { margin-left: undefined; }\n.nl2 { margin-left: undefined; }\n.nl3 { margin-left: undefined; }\n.nl4 { margin-left: undefined; }\n.nl5 { margin-left: undefined; }\n.nl6 { margin-left: undefined; }\n.nl7 { margin-left: undefined; }\n.nr1 { margin-right: undefined; }\n.nr2 { margin-right: undefined; }\n.nr3 { margin-right: undefined; }\n.nr4 { margin-right: undefined; }\n.nr5 { margin-right: undefined; }\n.nr6 { margin-right: undefined; }\n.nr7 { margin-right: undefined; }\n.nb1 { margin-bottom: undefined; }\n.nb2 { margin-bottom: undefined; }\n.nb3 { margin-bottom: undefined; }\n.nb4 { margin-bottom: undefined; }\n.nb5 { margin-bottom: undefined; }\n.nb6 { margin-bottom: undefined; }\n.nb7 { margin-bottom: undefined; }\n.nt1 { margin-top: undefined; }\n.nt2 { margin-top: undefined; }\n.nt3 { margin-top: undefined; }\n.nt4 { margin-top: undefined; }\n.nt5 { margin-top: undefined; }\n.nt6 { margin-top: undefined; }\n.nt7 { margin-top: undefined; }\n@media screen and (min-width: 30em) {\n .na1-ns { margin: undefined; }\n .na2-ns { margin: undefined; }\n .na3-ns { margin: undefined; }\n .na4-ns { margin: undefined; }\n .na5-ns { margin: undefined; }\n .na6-ns { margin: undefined; }\n .na7-ns { margin: undefined; }\n .nl1-ns { margin-left: undefined; }\n .nl2-ns { margin-left: undefined; }\n .nl3-ns { margin-left: undefined; }\n .nl4-ns { margin-left: undefined; }\n .nl5-ns { margin-left: undefined; }\n .nl6-ns { margin-left: undefined; }\n .nl7-ns { margin-left: undefined; }\n .nr1-ns { margin-right: undefined; }\n .nr2-ns { margin-right: undefined; }\n .nr3-ns { margin-right: undefined; }\n .nr4-ns { margin-right: undefined; }\n .nr5-ns { margin-right: undefined; }\n .nr6-ns { margin-right: undefined; }\n .nr7-ns { margin-right: undefined; }\n .nb1-ns { margin-bottom: undefined; }\n .nb2-ns { margin-bottom: undefined; }\n .nb3-ns { margin-bottom: undefined; }\n .nb4-ns { margin-bottom: undefined; }\n .nb5-ns { margin-bottom: undefined; }\n .nb6-ns { margin-bottom: undefined; }\n .nb7-ns { margin-bottom: undefined; }\n .nt1-ns { margin-top: undefined; }\n .nt2-ns { margin-top: undefined; }\n .nt3-ns { margin-top: undefined; }\n .nt4-ns { margin-top: undefined; }\n .nt5-ns { margin-top: undefined; }\n .nt6-ns { margin-top: undefined; }\n .nt7-ns { margin-top: undefined; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .na1-m { margin: undefined; }\n .na2-m { margin: undefined; }\n .na3-m { margin: undefined; }\n .na4-m { margin: undefined; }\n .na5-m { margin: undefined; }\n .na6-m { margin: undefined; }\n .na7-m { margin: undefined; }\n .nl1-m { margin-left: undefined; }\n .nl2-m { margin-left: undefined; }\n .nl3-m { margin-left: undefined; }\n .nl4-m { margin-left: undefined; }\n .nl5-m { margin-left: undefined; }\n .nl6-m { margin-left: undefined; }\n .nl7-m { margin-left: undefined; }\n .nr1-m { margin-right: undefined; }\n .nr2-m { margin-right: undefined; }\n .nr3-m { margin-right: undefined; }\n .nr4-m { margin-right: undefined; }\n .nr5-m { margin-right: undefined; }\n .nr6-m { margin-right: undefined; }\n .nr7-m { margin-right: undefined; }\n .nb1-m { margin-bottom: undefined; }\n .nb2-m { margin-bottom: undefined; }\n .nb3-m { margin-bottom: undefined; }\n .nb4-m { margin-bottom: undefined; }\n .nb5-m { margin-bottom: undefined; }\n .nb6-m { margin-bottom: undefined; }\n .nb7-m { margin-bottom: undefined; }\n .nt1-m { margin-top: undefined; }\n .nt2-m { margin-top: undefined; }\n .nt3-m { margin-top: undefined; }\n .nt4-m { margin-top: undefined; }\n .nt5-m { margin-top: undefined; }\n .nt6-m { margin-top: undefined; }\n .nt7-m { margin-top: undefined; }\n}\n@media screen and (min-width: 60em) {\n .na1-l { margin: undefined; }\n .na2-l { margin: undefined; }\n .na3-l { margin: undefined; }\n .na4-l { margin: undefined; }\n .na5-l { margin: undefined; }\n .na6-l { margin: undefined; }\n .na7-l { margin: undefined; }\n .nl1-l { margin-left: undefined; }\n .nl2-l { margin-left: undefined; }\n .nl3-l { margin-left: undefined; }\n .nl4-l { margin-left: undefined; }\n .nl5-l { margin-left: undefined; }\n .nl6-l { margin-left: undefined; }\n .nl7-l { margin-left: undefined; }\n .nr1-l { margin-right: undefined; }\n .nr2-l { margin-right: undefined; }\n .nr3-l { margin-right: undefined; }\n .nr4-l { margin-right: undefined; }\n .nr5-l { margin-right: undefined; }\n .nr6-l { margin-right: undefined; }\n .nr7-l { margin-right: undefined; }\n .nb1-l { margin-bottom: undefined; }\n .nb2-l { margin-bottom: undefined; }\n .nb3-l { margin-bottom: undefined; }\n .nb4-l { margin-bottom: undefined; }\n .nb5-l { margin-bottom: undefined; }\n .nb6-l { margin-bottom: undefined; }\n .nb7-l { margin-bottom: undefined; }\n .nt1-l { margin-top: undefined; }\n .nt2-l { margin-top: undefined; }\n .nt3-l { margin-top: undefined; }\n .nt4-l { margin-top: undefined; }\n .nt5-l { margin-top: undefined; }\n .nt6-l { margin-top: undefined; }\n .nt7-l { margin-top: undefined; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n TACHYONS - NEGATIVE MARGINS\n\n Base:\n n = negative\n\n Modifiers:\n a = all\n t = top\n r = right\n b = bottom\n l = left\n\n 1 = 1st step in spacing scale\n 2 = 2nd step in spacing scale\n 3 = 3rd step in spacing scale\n 4 = 4th step in spacing scale\n 5 = 5th step in spacing scale\n 6 = 6th step in spacing scale\n 7 = 7th step in spacing scale\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n\n\n\n.na1 { margin: -var(--spacing-extra-small); }\n.na2 { margin: -var(--spacing-small); }\n.na3 { margin: -var(--spacing-medium); }\n.na4 { margin: -var(--spacing-large); }\n.na5 { margin: -var(--spacing-extra-large); }\n.na6 { margin: -var(--spacing-extra-extra-large); }\n.na7 { margin: -var(--spacing-extra-extra-extra-large); }\n\n.nl1 { margin-left: -var(--spacing-extra-small); }\n.nl2 { margin-left: -var(--spacing-small); }\n.nl3 { margin-left: -var(--spacing-medium); }\n.nl4 { margin-left: -var(--spacing-large); }\n.nl5 { margin-left: -var(--spacing-extra-large); }\n.nl6 { margin-left: -var(--spacing-extra-extra-large); }\n.nl7 { margin-left: -var(--spacing-extra-extra-extra-large); }\n\n.nr1 { margin-right: -var(--spacing-extra-small); }\n.nr2 { margin-right: -var(--spacing-small); }\n.nr3 { margin-right: -var(--spacing-medium); }\n.nr4 { margin-right: -var(--spacing-large); }\n.nr5 { margin-right: -var(--spacing-extra-large); }\n.nr6 { margin-right: -var(--spacing-extra-extra-large); }\n.nr7 { margin-right: -var(--spacing-extra-extra-extra-large); }\n\n.nb1 { margin-bottom: -var(--spacing-extra-small); }\n.nb2 { margin-bottom: -var(--spacing-small); }\n.nb3 { margin-bottom: -var(--spacing-medium); }\n.nb4 { margin-bottom: -var(--spacing-large); }\n.nb5 { margin-bottom: -var(--spacing-extra-large); }\n.nb6 { margin-bottom: -var(--spacing-extra-extra-large); }\n.nb7 { margin-bottom: -var(--spacing-extra-extra-extra-large); }\n\n.nt1 { margin-top: -var(--spacing-extra-small); }\n.nt2 { margin-top: -var(--spacing-small); }\n.nt3 { margin-top: -var(--spacing-medium); }\n.nt4 { margin-top: -var(--spacing-large); }\n.nt5 { margin-top: -var(--spacing-extra-large); }\n.nt6 { margin-top: -var(--spacing-extra-extra-large); }\n.nt7 { margin-top: -var(--spacing-extra-extra-extra-large); }\n\n@media (--breakpoint-not-small) {\n\n .na1-ns { margin: -var(--spacing-extra-small); }\n .na2-ns { margin: -var(--spacing-small); }\n .na3-ns { margin: -var(--spacing-medium); }\n .na4-ns { margin: -var(--spacing-large); }\n .na5-ns { margin: -var(--spacing-extra-large); }\n .na6-ns { margin: -var(--spacing-extra-extra-large); }\n .na7-ns { margin: -var(--spacing-extra-extra-extra-large); }\n\n .nl1-ns { margin-left: -var(--spacing-extra-small); }\n .nl2-ns { margin-left: -var(--spacing-small); }\n .nl3-ns { margin-left: -var(--spacing-medium); }\n .nl4-ns { margin-left: -var(--spacing-large); }\n .nl5-ns { margin-left: -var(--spacing-extra-large); }\n .nl6-ns { margin-left: -var(--spacing-extra-extra-large); }\n .nl7-ns { margin-left: -var(--spacing-extra-extra-extra-large); }\n\n .nr1-ns { margin-right: -var(--spacing-extra-small); }\n .nr2-ns { margin-right: -var(--spacing-small); }\n .nr3-ns { margin-right: -var(--spacing-medium); }\n .nr4-ns { margin-right: -var(--spacing-large); }\n .nr5-ns { margin-right: -var(--spacing-extra-large); }\n .nr6-ns { margin-right: -var(--spacing-extra-extra-large); }\n .nr7-ns { margin-right: -var(--spacing-extra-extra-extra-large); }\n\n .nb1-ns { margin-bottom: -var(--spacing-extra-small); }\n .nb2-ns { margin-bottom: -var(--spacing-small); }\n .nb3-ns { margin-bottom: -var(--spacing-medium); }\n .nb4-ns { margin-bottom: -var(--spacing-large); }\n .nb5-ns { margin-bottom: -var(--spacing-extra-large); }\n .nb6-ns { margin-bottom: -var(--spacing-extra-extra-large); }\n .nb7-ns { margin-bottom: -var(--spacing-extra-extra-extra-large); }\n\n .nt1-ns { margin-top: -var(--spacing-extra-small); }\n .nt2-ns { margin-top: -var(--spacing-small); }\n .nt3-ns { margin-top: -var(--spacing-medium); }\n .nt4-ns { margin-top: -var(--spacing-large); }\n .nt5-ns { margin-top: -var(--spacing-extra-large); }\n .nt6-ns { margin-top: -var(--spacing-extra-extra-large); }\n .nt7-ns { margin-top: -var(--spacing-extra-extra-extra-large); }\n\n}\n\n@media (--breakpoint-medium) {\n .na1-m { margin: -var(--spacing-extra-small); }\n .na2-m { margin: -var(--spacing-small); }\n .na3-m { margin: -var(--spacing-medium); }\n .na4-m { margin: -var(--spacing-large); }\n .na5-m { margin: -var(--spacing-extra-large); }\n .na6-m { margin: -var(--spacing-extra-extra-large); }\n .na7-m { margin: -var(--spacing-extra-extra-extra-large); }\n\n .nl1-m { margin-left: -var(--spacing-extra-small); }\n .nl2-m { margin-left: -var(--spacing-small); }\n .nl3-m { margin-left: -var(--spacing-medium); }\n .nl4-m { margin-left: -var(--spacing-large); }\n .nl5-m { margin-left: -var(--spacing-extra-large); }\n .nl6-m { margin-left: -var(--spacing-extra-extra-large); }\n .nl7-m { margin-left: -var(--spacing-extra-extra-extra-large); }\n\n .nr1-m { margin-right: -var(--spacing-extra-small); }\n .nr2-m { margin-right: -var(--spacing-small); }\n .nr3-m { margin-right: -var(--spacing-medium); }\n .nr4-m { margin-right: -var(--spacing-large); }\n .nr5-m { margin-right: -var(--spacing-extra-large); }\n .nr6-m { margin-right: -var(--spacing-extra-extra-large); }\n .nr7-m { margin-right: -var(--spacing-extra-extra-extra-large); }\n\n .nb1-m { margin-bottom: -var(--spacing-extra-small); }\n .nb2-m { margin-bottom: -var(--spacing-small); }\n .nb3-m { margin-bottom: -var(--spacing-medium); }\n .nb4-m { margin-bottom: -var(--spacing-large); }\n .nb5-m { margin-bottom: -var(--spacing-extra-large); }\n .nb6-m { margin-bottom: -var(--spacing-extra-extra-large); }\n .nb7-m { margin-bottom: -var(--spacing-extra-extra-extra-large); }\n\n .nt1-m { margin-top: -var(--spacing-extra-small); }\n .nt2-m { margin-top: -var(--spacing-small); }\n .nt3-m { margin-top: -var(--spacing-medium); }\n .nt4-m { margin-top: -var(--spacing-large); }\n .nt5-m { margin-top: -var(--spacing-extra-large); }\n .nt6-m { margin-top: -var(--spacing-extra-extra-large); }\n .nt7-m { margin-top: -var(--spacing-extra-extra-extra-large); }\n\n}\n\n@media (--breakpoint-large) {\n .na1-l { margin: -var(--spacing-extra-small); }\n .na2-l { margin: -var(--spacing-small); }\n .na3-l { margin: -var(--spacing-medium); }\n .na4-l { margin: -var(--spacing-large); }\n .na5-l { margin: -var(--spacing-extra-large); }\n .na6-l { margin: -var(--spacing-extra-extra-large); }\n .na7-l { margin: -var(--spacing-extra-extra-extra-large); }\n\n .nl1-l { margin-left: -var(--spacing-extra-small); }\n .nl2-l { margin-left: -var(--spacing-small); }\n .nl3-l { margin-left: -var(--spacing-medium); }\n .nl4-l { margin-left: -var(--spacing-large); }\n .nl5-l { margin-left: -var(--spacing-extra-large); }\n .nl6-l { margin-left: -var(--spacing-extra-extra-large); }\n .nl7-l { margin-left: -var(--spacing-extra-extra-extra-large); }\n\n .nr1-l { margin-right: -var(--spacing-extra-small); }\n .nr2-l { margin-right: -var(--spacing-small); }\n .nr3-l { margin-right: -var(--spacing-medium); }\n .nr4-l { margin-right: -var(--spacing-large); }\n .nr5-l { margin-right: -var(--spacing-extra-large); }\n .nr6-l { margin-right: -var(--spacing-extra-extra-large); }\n .nr7-l { margin-right: -var(--spacing-extra-extra-extra-large); }\n\n .nb1-l { margin-bottom: -var(--spacing-extra-small); }\n .nb2-l { margin-bottom: -var(--spacing-small); }\n .nb3-l { margin-bottom: -var(--spacing-medium); }\n .nb4-l { margin-bottom: -var(--spacing-large); }\n .nb5-l { margin-bottom: -var(--spacing-extra-large); }\n .nb6-l { margin-bottom: -var(--spacing-extra-extra-large); }\n .nb7-l { margin-bottom: -var(--spacing-extra-extra-extra-large); }\n\n .nt1-l { margin-top: -var(--spacing-extra-small); }\n .nt2-l { margin-top: -var(--spacing-small); }\n .nt3-l { margin-top: -var(--spacing-medium); }\n .nt4-l { margin-top: -var(--spacing-large); }\n .nt5-l { margin-top: -var(--spacing-extra-large); }\n .nt6-l { margin-top: -var(--spacing-extra-extra-large); }\n .nt7-l { margin-top: -var(--spacing-extra-extra-extra-large); }\n}\n\n", + "readme": "\n\n# NEGATIVE MARGINS\n\n### Base\n\n- n = negative\n\n### Modifiers\n\n- a = all\n- t = top\n- r = right\n- b = bottom\n- l = left\n\n- 1 = 1st step in spacing scale\n- 2 = 2nd step in spacing scale\n- 3 = 3rd step in spacing scale\n- 4 = 4th step in spacing scale\n- 5 = 5th step in spacing scale\n- 6 = 6th step in spacing scale\n- 7 = 7th step in spacing scale\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# NEGATIVE MARGINS\n\n### Base\n\n- n = negative\n\n### Modifiers\n\n- a = all\n- t = top\n- r = right\n- b = bottom\n- l = left\n\n- 1 = 1st step in spacing scale\n- 2 = 2nd step in spacing scale\n- 3 = 3rd step in spacing scale\n- 4 = 4th step in spacing scale\n- 5 = 5th step in spacing scale\n- 6 = 6th step in spacing scale\n- 7 = 7th step in spacing scale\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n.na1 { margin: -var(--spacing-1); }\n.na2 { margin: -var(--spacing-2); }\n.na3 { margin: -var(--spacing-3); }\n.na4 { margin: -var(--spacing-4); }\n.na5 { margin: -var(--spacing-5); }\n.na6 { margin: -var(--spacing-6); }\n.na7 { margin: -var(--spacing-7); }\n\n.nl1 { margin-left: -var(--spacing-1); }\n.nl2 { margin-left: -var(--spacing-2); }\n.nl3 { margin-left: -var(--spacing-3); }\n.nl4 { margin-left: -var(--spacing-4); }\n.nl5 { margin-left: -var(--spacing-5); }\n.nl6 { margin-left: -var(--spacing-6); }\n.nl7 { margin-left: -var(--spacing-7); }\n\n.nr1 { margin-right: -var(--spacing-1); }\n.nr2 { margin-right: -var(--spacing-2); }\n.nr3 { margin-right: -var(--spacing-3); }\n.nr4 { margin-right: -var(--spacing-4); }\n.nr5 { margin-right: -var(--spacing-5); }\n.nr6 { margin-right: -var(--spacing-6); }\n.nr7 { margin-right: -var(--spacing-7); }\n\n.nb1 { margin-bottom: -var(--spacing-1); }\n.nb2 { margin-bottom: -var(--spacing-2); }\n.nb3 { margin-bottom: -var(--spacing-3); }\n.nb4 { margin-bottom: -var(--spacing-4); }\n.nb5 { margin-bottom: -var(--spacing-5); }\n.nb6 { margin-bottom: -var(--spacing-6); }\n.nb7 { margin-bottom: -var(--spacing-7); }\n\n.nt1 { margin-top: -var(--spacing-1); }\n.nt2 { margin-top: -var(--spacing-2); }\n.nt3 { margin-top: -var(--spacing-3); }\n.nt4 { margin-top: -var(--spacing-4); }\n.nt5 { margin-top: -var(--spacing-5); }\n.nt6 { margin-top: -var(--spacing-6); }\n.nt7 { margin-top: -var(--spacing-7); }\n\n\n@media (--breakpoint-small) {\n .na1-s { margin: -var(--spacing-1); }\n .na2-s { margin: -var(--spacing-2); }\n .na3-s { margin: -var(--spacing-3); }\n .na4-s { margin: -var(--spacing-4); }\n .na5-s { margin: -var(--spacing-5); }\n .na6-s { margin: -var(--spacing-6); }\n .na7-s { margin: -var(--spacing-7); }\n\n .nl1-s { margin-left: -var(--spacing-1); }\n .nl2-s { margin-left: -var(--spacing-2); }\n .nl3-s { margin-left: -var(--spacing-3); }\n .nl4-s { margin-left: -var(--spacing-4); }\n .nl5-s { margin-left: -var(--spacing-5); }\n .nl6-s { margin-left: -var(--spacing-6); }\n .nl7-s { margin-left: -var(--spacing-7); }\n\n .nr1-s { margin-right: -var(--spacing-1); }\n .nr2-s { margin-right: -var(--spacing-2); }\n .nr3-s { margin-right: -var(--spacing-3); }\n .nr4-s { margin-right: -var(--spacing-4); }\n .nr5-s { margin-right: -var(--spacing-5); }\n .nr6-s { margin-right: -var(--spacing-6); }\n .nr7-s { margin-right: -var(--spacing-7); }\n\n .nb1-s { margin-bottom: -var(--spacing-1); }\n .nb2-s { margin-bottom: -var(--spacing-2); }\n .nb3-s { margin-bottom: -var(--spacing-3); }\n .nb4-s { margin-bottom: -var(--spacing-4); }\n .nb5-s { margin-bottom: -var(--spacing-5); }\n .nb6-s { margin-bottom: -var(--spacing-6); }\n .nb7-s { margin-bottom: -var(--spacing-7); }\n\n .nt1-s { margin-top: -var(--spacing-1); }\n .nt2-s { margin-top: -var(--spacing-2); }\n .nt3-s { margin-top: -var(--spacing-3); }\n .nt4-s { margin-top: -var(--spacing-4); }\n .nt5-s { margin-top: -var(--spacing-5); }\n .nt6-s { margin-top: -var(--spacing-6); }\n .nt7-s { margin-top: -var(--spacing-7); }\n}\n\n@media (--breakpoint-medium) {\n .na1-m { margin: -var(--spacing-1); }\n .na2-m { margin: -var(--spacing-2); }\n .na3-m { margin: -var(--spacing-3); }\n .na4-m { margin: -var(--spacing-4); }\n .na5-m { margin: -var(--spacing-5); }\n .na6-m { margin: -var(--spacing-6); }\n .na7-m { margin: -var(--spacing-7); }\n\n .nl1-m { margin-left: -var(--spacing-1); }\n .nl2-m { margin-left: -var(--spacing-2); }\n .nl3-m { margin-left: -var(--spacing-3); }\n .nl4-m { margin-left: -var(--spacing-4); }\n .nl5-m { margin-left: -var(--spacing-5); }\n .nl6-m { margin-left: -var(--spacing-6); }\n .nl7-m { margin-left: -var(--spacing-7); }\n\n .nr1-m { margin-right: -var(--spacing-1); }\n .nr2-m { margin-right: -var(--spacing-2); }\n .nr3-m { margin-right: -var(--spacing-3); }\n .nr4-m { margin-right: -var(--spacing-4); }\n .nr5-m { margin-right: -var(--spacing-5); }\n .nr6-m { margin-right: -var(--spacing-6); }\n .nr7-m { margin-right: -var(--spacing-7); }\n\n .nb1-m { margin-bottom: -var(--spacing-1); }\n .nb2-m { margin-bottom: -var(--spacing-2); }\n .nb3-m { margin-bottom: -var(--spacing-3); }\n .nb4-m { margin-bottom: -var(--spacing-4); }\n .nb5-m { margin-bottom: -var(--spacing-5); }\n .nb6-m { margin-bottom: -var(--spacing-6); }\n .nb7-m { margin-bottom: -var(--spacing-7); }\n\n .nt1-m { margin-top: -var(--spacing-1); }\n .nt2-m { margin-top: -var(--spacing-2); }\n .nt3-m { margin-top: -var(--spacing-3); }\n .nt4-m { margin-top: -var(--spacing-4); }\n .nt5-m { margin-top: -var(--spacing-5); }\n .nt6-m { margin-top: -var(--spacing-6); }\n .nt7-m { margin-top: -var(--spacing-7); }\n}\n\n@media (--breakpoint-large) {\n .na1-l { margin: -var(--spacing-1); }\n .na2-l { margin: -var(--spacing-2); }\n .na3-l { margin: -var(--spacing-3); }\n .na4-l { margin: -var(--spacing-4); }\n .na5-l { margin: -var(--spacing-5); }\n .na6-l { margin: -var(--spacing-6); }\n .na7-l { margin: -var(--spacing-7); }\n\n .nl1-l { margin-left: -var(--spacing-1); }\n .nl2-l { margin-left: -var(--spacing-2); }\n .nl3-l { margin-left: -var(--spacing-3); }\n .nl4-l { margin-left: -var(--spacing-4); }\n .nl5-l { margin-left: -var(--spacing-5); }\n .nl6-l { margin-left: -var(--spacing-6); }\n .nl7-l { margin-left: -var(--spacing-7); }\n\n .nr1-l { margin-right: -var(--spacing-1); }\n .nr2-l { margin-right: -var(--spacing-2); }\n .nr3-l { margin-right: -var(--spacing-3); }\n .nr4-l { margin-right: -var(--spacing-4); }\n .nr5-l { margin-right: -var(--spacing-5); }\n .nr6-l { margin-right: -var(--spacing-6); }\n .nr7-l { margin-right: -var(--spacing-7); }\n\n .nb1-l { margin-bottom: -var(--spacing-1); }\n .nb2-l { margin-bottom: -var(--spacing-2); }\n .nb3-l { margin-bottom: -var(--spacing-3); }\n .nb4-l { margin-bottom: -var(--spacing-4); }\n .nb5-l { margin-bottom: -var(--spacing-5); }\n .nb6-l { margin-bottom: -var(--spacing-6); }\n .nb7-l { margin-bottom: -var(--spacing-7); }\n\n .nt1-l { margin-top: -var(--spacing-1); }\n .nt2-l { margin-top: -var(--spacing-2); }\n .nt3-l { margin-top: -var(--spacing-3); }\n .nt4-l { margin-top: -var(--spacing-4); }\n .nt5-l { margin-top: -var(--spacing-5); }\n .nt6-l { margin-top: -var(--spacing-6); }\n .nt7-l { margin-top: -var(--spacing-7); }\n}\n", "css": "/*\n TACHYONS - NEGATIVE MARGINS\n\n Base:\n n = negative\n\n Modifiers:\n a = all\n t = top\n r = right\n b = bottom\n l = left\n\n 1 = 1st step in spacing scale\n 2 = 2nd step in spacing scale\n 3 = 3rd step in spacing scale\n 4 = 4th step in spacing scale\n 5 = 5th step in spacing scale\n 6 = 6th step in spacing scale\n 7 = 7th step in spacing scale\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n.na1 { margin: undefined; }\n.na2 { margin: undefined; }\n.na3 { margin: undefined; }\n.na4 { margin: undefined; }\n.na5 { margin: undefined; }\n.na6 { margin: undefined; }\n.na7 { margin: undefined; }\n.nl1 { margin-left: undefined; }\n.nl2 { margin-left: undefined; }\n.nl3 { margin-left: undefined; }\n.nl4 { margin-left: undefined; }\n.nl5 { margin-left: undefined; }\n.nl6 { margin-left: undefined; }\n.nl7 { margin-left: undefined; }\n.nr1 { margin-right: undefined; }\n.nr2 { margin-right: undefined; }\n.nr3 { margin-right: undefined; }\n.nr4 { margin-right: undefined; }\n.nr5 { margin-right: undefined; }\n.nr6 { margin-right: undefined; }\n.nr7 { margin-right: undefined; }\n.nb1 { margin-bottom: undefined; }\n.nb2 { margin-bottom: undefined; }\n.nb3 { margin-bottom: undefined; }\n.nb4 { margin-bottom: undefined; }\n.nb5 { margin-bottom: undefined; }\n.nb6 { margin-bottom: undefined; }\n.nb7 { margin-bottom: undefined; }\n.nt1 { margin-top: undefined; }\n.nt2 { margin-top: undefined; }\n.nt3 { margin-top: undefined; }\n.nt4 { margin-top: undefined; }\n.nt5 { margin-top: undefined; }\n.nt6 { margin-top: undefined; }\n.nt7 { margin-top: undefined; }\n@media screen and (min-width: 30em) {\n .na1-ns { margin: undefined; }\n .na2-ns { margin: undefined; }\n .na3-ns { margin: undefined; }\n .na4-ns { margin: undefined; }\n .na5-ns { margin: undefined; }\n .na6-ns { margin: undefined; }\n .na7-ns { margin: undefined; }\n .nl1-ns { margin-left: undefined; }\n .nl2-ns { margin-left: undefined; }\n .nl3-ns { margin-left: undefined; }\n .nl4-ns { margin-left: undefined; }\n .nl5-ns { margin-left: undefined; }\n .nl6-ns { margin-left: undefined; }\n .nl7-ns { margin-left: undefined; }\n .nr1-ns { margin-right: undefined; }\n .nr2-ns { margin-right: undefined; }\n .nr3-ns { margin-right: undefined; }\n .nr4-ns { margin-right: undefined; }\n .nr5-ns { margin-right: undefined; }\n .nr6-ns { margin-right: undefined; }\n .nr7-ns { margin-right: undefined; }\n .nb1-ns { margin-bottom: undefined; }\n .nb2-ns { margin-bottom: undefined; }\n .nb3-ns { margin-bottom: undefined; }\n .nb4-ns { margin-bottom: undefined; }\n .nb5-ns { margin-bottom: undefined; }\n .nb6-ns { margin-bottom: undefined; }\n .nb7-ns { margin-bottom: undefined; }\n .nt1-ns { margin-top: undefined; }\n .nt2-ns { margin-top: undefined; }\n .nt3-ns { margin-top: undefined; }\n .nt4-ns { margin-top: undefined; }\n .nt5-ns { margin-top: undefined; }\n .nt6-ns { margin-top: undefined; }\n .nt7-ns { margin-top: undefined; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .na1-m { margin: undefined; }\n .na2-m { margin: undefined; }\n .na3-m { margin: undefined; }\n .na4-m { margin: undefined; }\n .na5-m { margin: undefined; }\n .na6-m { margin: undefined; }\n .na7-m { margin: undefined; }\n .nl1-m { margin-left: undefined; }\n .nl2-m { margin-left: undefined; }\n .nl3-m { margin-left: undefined; }\n .nl4-m { margin-left: undefined; }\n .nl5-m { margin-left: undefined; }\n .nl6-m { margin-left: undefined; }\n .nl7-m { margin-left: undefined; }\n .nr1-m { margin-right: undefined; }\n .nr2-m { margin-right: undefined; }\n .nr3-m { margin-right: undefined; }\n .nr4-m { margin-right: undefined; }\n .nr5-m { margin-right: undefined; }\n .nr6-m { margin-right: undefined; }\n .nr7-m { margin-right: undefined; }\n .nb1-m { margin-bottom: undefined; }\n .nb2-m { margin-bottom: undefined; }\n .nb3-m { margin-bottom: undefined; }\n .nb4-m { margin-bottom: undefined; }\n .nb5-m { margin-bottom: undefined; }\n .nb6-m { margin-bottom: undefined; }\n .nb7-m { margin-bottom: undefined; }\n .nt1-m { margin-top: undefined; }\n .nt2-m { margin-top: undefined; }\n .nt3-m { margin-top: undefined; }\n .nt4-m { margin-top: undefined; }\n .nt5-m { margin-top: undefined; }\n .nt6-m { margin-top: undefined; }\n .nt7-m { margin-top: undefined; }\n}\n@media screen and (min-width: 60em) {\n .na1-l { margin: undefined; }\n .na2-l { margin: undefined; }\n .na3-l { margin: undefined; }\n .na4-l { margin: undefined; }\n .na5-l { margin: undefined; }\n .na6-l { margin: undefined; }\n .na7-l { margin: undefined; }\n .nl1-l { margin-left: undefined; }\n .nl2-l { margin-left: undefined; }\n .nl3-l { margin-left: undefined; }\n .nl4-l { margin-left: undefined; }\n .nl5-l { margin-left: undefined; }\n .nl6-l { margin-left: undefined; }\n .nl7-l { margin-left: undefined; }\n .nr1-l { margin-right: undefined; }\n .nr2-l { margin-right: undefined; }\n .nr3-l { margin-right: undefined; }\n .nr4-l { margin-right: undefined; }\n .nr5-l { margin-right: undefined; }\n .nr6-l { margin-right: undefined; }\n .nr7-l { margin-right: undefined; }\n .nb1-l { margin-bottom: undefined; }\n .nb2-l { margin-bottom: undefined; }\n .nb3-l { margin-bottom: undefined; }\n .nb4-l { margin-bottom: undefined; }\n .nb5-l { margin-bottom: undefined; }\n .nb6-l { margin-bottom: undefined; }\n .nb7-l { margin-bottom: undefined; }\n .nt1-l { margin-top: undefined; }\n .nt2-l { margin-top: undefined; }\n .nt3-l { margin-top: undefined; }\n .nt4-l { margin-top: undefined; }\n .nt5-l { margin-top: undefined; }\n .nt6-l { margin-top: undefined; }\n .nt7-l { margin-top: undefined; }\n}\n\n" }, "tachyons-nudge": { @@ -9028,8 +9028,8 @@ ] } ], - "readme": "# tachyons 5.0.0-1\n\nFunctional CSS for humans\n\n### Stats\n\n572 | 60 | 60\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*!!!\n\n # Nudge\n\n Nudge the position of an element by a pixel or two\n\n ### Docs\n\n http://tachyons.io/docs/layout/nudge/\n\n ### Base\n\n - nudge\n\n ### Modifiers\n\n - t = top\n - r = right\n - b = bottom\n - l = left\n\n - `1` = literal value 1px\n - `2` = literal value 2px\n - `3` = literal value 3px\n - `4` = literal value 4px\n - `5` = literal value 5px\n\n ### Media Query Extensions\n\n - `-m` = medium\n - `-l` = large\n*/\n.nudge-top-1 { top: 1px; }\n.nudge-top-2 { top: 2px; }\n.nudge-top-3 { top: 3px; }\n.nudge-top-4 { top: 4px; }\n.nudge-top-5 { top: 5px; }\n.nudge-right-1 { right: 1px; }\n.nudge-right-2 { right: 2px; }\n.nudge-right-3 { right: 3px; }\n.nudge-right-4 { right: 4px; }\n.nudge-right-5 { right: 5px; }\n.nudge-bottom-1 { bottom: 1px; }\n.nudge-bottom-2 { bottom: 2px; }\n.nudge-bottom-3 { bottom: 3px; }\n.nudge-bottom-4 { bottom: 4px; }\n.nudge-bottom-5 { bottom: 5px; }\n.nudge-left-1 { left: 1px; }\n.nudge-left-2 { left: 2px; }\n.nudge-left-3 { left: 3px; }\n.nudge-left-4 { left: 4px; }\n.nudge-left-5 { left: 5px; }\n@media screen and (min-width: 30em) {\n .nudge-top-1-m { top: 1px; }\n .nudge-top-2-m { top: 2px; }\n .nudge-top-3-m { top: 3px; }\n .nudge-top-4-m { top: 4px; }\n .nudge-top-5-m { top: 5px; }\n .nudge-right-1-m { right: 1px; }\n .nudge-right-2-m { right: 2px; }\n .nudge-right-3-m { right: 3px; }\n .nudge-right-4-m { right: 4px; }\n .nudge-right-5-m { right: 5px; }\n .nudge-bottom-1-m { bottom: 1px; }\n .nudge-bottom-2-m { bottom: 2px; }\n .nudge-bottom-3-m { bottom: 3px; }\n .nudge-bottom-4-m { bottom: 4px; }\n .nudge-bottom-5-m { bottom: 5px; }\n .nudge-left-1-m { left: 1px; }\n .nudge-left-2-m { left: 2px; }\n .nudge-left-3-m { left: 3px; }\n .nudge-left-4-m { left: 4px; }\n .nudge-left-5-m { left: 5px; }\n}\n@media screen and (min-width: 60em) {\n .nudge-top-1-l { top: 1px; }\n .nudge-top-2-l { top: 2px; }\n .nudge-top-3-l { top: 3px; }\n .nudge-top-4-l { top: 4px; }\n .nudge-top-5-l { top: 5px; }\n .nudge-right-1-l { right: 1px; }\n .nudge-right-2-l { right: 2px; }\n .nudge-right-3-l { right: 3px; }\n .nudge-right-4-l { right: 4px; }\n .nudge-right-5-l { right: 5px; }\n .nudge-bottom-1-l { bottom: 1px; }\n .nudge-bottom-2-l { bottom: 2px; }\n .nudge-bottom-3-l { bottom: 3px; }\n .nudge-bottom-4-l { bottom: 4px; }\n .nudge-bottom-5-l { bottom: 5px; }\n .nudge-left-1-l { left: 1px; }\n .nudge-left-2-l { left: 2px; }\n .nudge-left-3-l { left: 3px; }\n .nudge-left-4-l { left: 4px; }\n .nudge-left-5-l { left: 5px; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "\n\n\n@custom-media --breakpoint-medium screen and (min-width: 30em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n/*!!!\n\n # Nudge\n\n Nudge the position of an element by a pixel or two\n\n ### Docs\n\n http://tachyons.io/docs/layout/nudge/\n\n ### Base\n\n - nudge\n\n ### Modifiers\n\n - t = top\n - r = right\n - b = bottom\n - l = left\n\n - `1` = literal value 1px\n - `2` = literal value 2px\n - `3` = literal value 3px\n - `4` = literal value 4px\n - `5` = literal value 5px\n\n ### Media Query Extensions\n\n - `-m` = medium\n - `-l` = large\n*/\n\n.nudge-top-1 { top: 1px; }\n.nudge-top-2 { top: 2px; }\n.nudge-top-3 { top: 3px; }\n.nudge-top-4 { top: 4px; }\n.nudge-top-5 { top: 5px; }\n\n.nudge-right-1 { right: 1px; }\n.nudge-right-2 { right: 2px; }\n.nudge-right-3 { right: 3px; }\n.nudge-right-4 { right: 4px; }\n.nudge-right-5 { right: 5px; }\n\n.nudge-bottom-1 { bottom: 1px; }\n.nudge-bottom-2 { bottom: 2px; }\n.nudge-bottom-3 { bottom: 3px; }\n.nudge-bottom-4 { bottom: 4px; }\n.nudge-bottom-5 { bottom: 5px; }\n\n.nudge-left-1 { left: 1px; }\n.nudge-left-2 { left: 2px; }\n.nudge-left-3 { left: 3px; }\n.nudge-left-4 { left: 4px; }\n.nudge-left-5 { left: 5px; }\n\n@media (--breakpoint-medium) {\n .nudge-top-1-m { top: 1px; }\n .nudge-top-2-m { top: 2px; }\n .nudge-top-3-m { top: 3px; }\n .nudge-top-4-m { top: 4px; }\n .nudge-top-5-m { top: 5px; }\n\n .nudge-right-1-m { right: 1px; }\n .nudge-right-2-m { right: 2px; }\n .nudge-right-3-m { right: 3px; }\n .nudge-right-4-m { right: 4px; }\n .nudge-right-5-m { right: 5px; }\n\n .nudge-bottom-1-m { bottom: 1px; }\n .nudge-bottom-2-m { bottom: 2px; }\n .nudge-bottom-3-m { bottom: 3px; }\n .nudge-bottom-4-m { bottom: 4px; }\n .nudge-bottom-5-m { bottom: 5px; }\n\n .nudge-left-1-m { left: 1px; }\n .nudge-left-2-m { left: 2px; }\n .nudge-left-3-m { left: 3px; }\n .nudge-left-4-m { left: 4px; }\n .nudge-left-5-m { left: 5px; }\n}\n\n@media (--breakpoint-large) {\n .nudge-top-1-l { top: 1px; }\n .nudge-top-2-l { top: 2px; }\n .nudge-top-3-l { top: 3px; }\n .nudge-top-4-l { top: 4px; }\n .nudge-top-5-l { top: 5px; }\n\n .nudge-right-1-l { right: 1px; }\n .nudge-right-2-l { right: 2px; }\n .nudge-right-3-l { right: 3px; }\n .nudge-right-4-l { right: 4px; }\n .nudge-right-5-l { right: 5px; }\n\n .nudge-bottom-1-l { bottom: 1px; }\n .nudge-bottom-2-l { bottom: 2px; }\n .nudge-bottom-3-l { bottom: 3px; }\n .nudge-bottom-4-l { bottom: 4px; }\n .nudge-bottom-5-l { bottom: 5px; }\n\n .nudge-left-1-l { left: 1px; }\n .nudge-left-2-l { left: 2px; }\n .nudge-left-3-l { left: 3px; }\n .nudge-left-4-l { left: 4px; }\n .nudge-left-5-l { left: 5px; }\n}\n", + "readme": "\n\n# [ADDON] NUDGE\n\nNudge the position of an element by a pixel or two\n\n### Docs\n\nhttp://tachyons.io/docs/layout/nudge/\n\n### Base\n\n- nudge\n\n### Modifiers\n\n- t = top\n- r = right\n- b = bottom\n- l = left\n\n- `1` = literal value 1px\n- `2` = literal value 2px\n- `3` = literal value 3px\n- `4` = literal value 4px\n- `5` = literal value 5px\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# [ADDON] NUDGE\n\nNudge the position of an element by a pixel or two\n\n### Docs\n\nhttp://tachyons.io/docs/layout/nudge/\n\n### Base\n\n- nudge\n\n### Modifiers\n\n- t = top\n- r = right\n- b = bottom\n- l = left\n\n- `1` = literal value 1px\n- `2` = literal value 2px\n- `3` = literal value 3px\n- `4` = literal value 4px\n- `5` = literal value 5px\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n.nudge-top-1 { top: 1px; }\n.nudge-top-2 { top: 2px; }\n.nudge-top-3 { top: 3px; }\n.nudge-top-4 { top: 4px; }\n.nudge-top-5 { top: 5px; }\n\n.nudge-right-1 { right: 1px; }\n.nudge-right-2 { right: 2px; }\n.nudge-right-3 { right: 3px; }\n.nudge-right-4 { right: 4px; }\n.nudge-right-5 { right: 5px; }\n\n.nudge-bottom-1 { bottom: 1px; }\n.nudge-bottom-2 { bottom: 2px; }\n.nudge-bottom-3 { bottom: 3px; }\n.nudge-bottom-4 { bottom: 4px; }\n.nudge-bottom-5 { bottom: 5px; }\n\n.nudge-left-1 { left: 1px; }\n.nudge-left-2 { left: 2px; }\n.nudge-left-3 { left: 3px; }\n.nudge-left-4 { left: 4px; }\n.nudge-left-5 { left: 5px; }\n\n@media (--breakpoint-small) {\n .nudge-top-1-s { top: 1px; }\n .nudge-top-2-s { top: 2px; }\n .nudge-top-3-s { top: 3px; }\n .nudge-top-4-s { top: 4px; }\n .nudge-top-5-s { top: 5px; }\n\n .nudge-right-1-s { right: 1px; }\n .nudge-right-2-s { right: 2px; }\n .nudge-right-3-s { right: 3px; }\n .nudge-right-4-s { right: 4px; }\n .nudge-right-5-s { right: 5px; }\n\n .nudge-bottom-1-s { bottom: 1px; }\n .nudge-bottom-2-s { bottom: 2px; }\n .nudge-bottom-3-s { bottom: 3px; }\n .nudge-bottom-4-s { bottom: 4px; }\n .nudge-bottom-5-s { bottom: 5px; }\n\n .nudge-left-1-s { left: 1px; }\n .nudge-left-2-s { left: 2px; }\n .nudge-left-3-s { left: 3px; }\n .nudge-left-4-s { left: 4px; }\n .nudge-left-5-s { left: 5px; }\n}\n\n@media (--breakpoint-medium) {\n .nudge-top-1-m { top: 1px; }\n .nudge-top-2-m { top: 2px; }\n .nudge-top-3-m { top: 3px; }\n .nudge-top-4-m { top: 4px; }\n .nudge-top-5-m { top: 5px; }\n\n .nudge-right-1-m { right: 1px; }\n .nudge-right-2-m { right: 2px; }\n .nudge-right-3-m { right: 3px; }\n .nudge-right-4-m { right: 4px; }\n .nudge-right-5-m { right: 5px; }\n\n .nudge-bottom-1-m { bottom: 1px; }\n .nudge-bottom-2-m { bottom: 2px; }\n .nudge-bottom-3-m { bottom: 3px; }\n .nudge-bottom-4-m { bottom: 4px; }\n .nudge-bottom-5-m { bottom: 5px; }\n\n .nudge-left-1-m { left: 1px; }\n .nudge-left-2-m { left: 2px; }\n .nudge-left-3-m { left: 3px; }\n .nudge-left-4-m { left: 4px; }\n .nudge-left-5-m { left: 5px; }\n}\n\n@media (--breakpoint-large) {\n .nudge-top-1-l { top: 1px; }\n .nudge-top-2-l { top: 2px; }\n .nudge-top-3-l { top: 3px; }\n .nudge-top-4-l { top: 4px; }\n .nudge-top-5-l { top: 5px; }\n\n .nudge-right-1-l { right: 1px; }\n .nudge-right-2-l { right: 2px; }\n .nudge-right-3-l { right: 3px; }\n .nudge-right-4-l { right: 4px; }\n .nudge-right-5-l { right: 5px; }\n\n .nudge-bottom-1-l { bottom: 1px; }\n .nudge-bottom-2-l { bottom: 2px; }\n .nudge-bottom-3-l { bottom: 3px; }\n .nudge-bottom-4-l { bottom: 4px; }\n .nudge-bottom-5-l { bottom: 5px; }\n\n .nudge-left-1-l { left: 1px; }\n .nudge-left-2-l { left: 2px; }\n .nudge-left-3-l { left: 3px; }\n .nudge-left-4-l { left: 4px; }\n .nudge-left-5-l { left: 5px; }\n}\n", "css": "/*!!!\n\n # Nudge\n\n Nudge the position of an element by a pixel or two\n\n ### Docs\n\n http://tachyons.io/docs/layout/nudge/\n\n ### Base\n\n - nudge\n\n ### Modifiers\n\n - t = top\n - r = right\n - b = bottom\n - l = left\n\n - `1` = literal value 1px\n - `2` = literal value 2px\n - `3` = literal value 3px\n - `4` = literal value 4px\n - `5` = literal value 5px\n\n ### Media Query Extensions\n\n - `-m` = medium\n - `-l` = large\n*/\n.nudge-top-1 { top: 1px; }\n.nudge-top-2 { top: 2px; }\n.nudge-top-3 { top: 3px; }\n.nudge-top-4 { top: 4px; }\n.nudge-top-5 { top: 5px; }\n.nudge-right-1 { right: 1px; }\n.nudge-right-2 { right: 2px; }\n.nudge-right-3 { right: 3px; }\n.nudge-right-4 { right: 4px; }\n.nudge-right-5 { right: 5px; }\n.nudge-bottom-1 { bottom: 1px; }\n.nudge-bottom-2 { bottom: 2px; }\n.nudge-bottom-3 { bottom: 3px; }\n.nudge-bottom-4 { bottom: 4px; }\n.nudge-bottom-5 { bottom: 5px; }\n.nudge-left-1 { left: 1px; }\n.nudge-left-2 { left: 2px; }\n.nudge-left-3 { left: 3px; }\n.nudge-left-4 { left: 4px; }\n.nudge-left-5 { left: 5px; }\n@media screen and (min-width: 30em) {\n .nudge-top-1-m { top: 1px; }\n .nudge-top-2-m { top: 2px; }\n .nudge-top-3-m { top: 3px; }\n .nudge-top-4-m { top: 4px; }\n .nudge-top-5-m { top: 5px; }\n .nudge-right-1-m { right: 1px; }\n .nudge-right-2-m { right: 2px; }\n .nudge-right-3-m { right: 3px; }\n .nudge-right-4-m { right: 4px; }\n .nudge-right-5-m { right: 5px; }\n .nudge-bottom-1-m { bottom: 1px; }\n .nudge-bottom-2-m { bottom: 2px; }\n .nudge-bottom-3-m { bottom: 3px; }\n .nudge-bottom-4-m { bottom: 4px; }\n .nudge-bottom-5-m { bottom: 5px; }\n .nudge-left-1-m { left: 1px; }\n .nudge-left-2-m { left: 2px; }\n .nudge-left-3-m { left: 3px; }\n .nudge-left-4-m { left: 4px; }\n .nudge-left-5-m { left: 5px; }\n}\n@media screen and (min-width: 60em) {\n .nudge-top-1-l { top: 1px; }\n .nudge-top-2-l { top: 2px; }\n .nudge-top-3-l { top: 3px; }\n .nudge-top-4-l { top: 4px; }\n .nudge-top-5-l { top: 5px; }\n .nudge-right-1-l { right: 1px; }\n .nudge-right-2-l { right: 2px; }\n .nudge-right-3-l { right: 3px; }\n .nudge-right-4-l { right: 4px; }\n .nudge-right-5-l { right: 5px; }\n .nudge-bottom-1-l { bottom: 1px; }\n .nudge-bottom-2-l { bottom: 2px; }\n .nudge-bottom-3-l { bottom: 3px; }\n .nudge-bottom-4-l { bottom: 4px; }\n .nudge-bottom-5-l { bottom: 5px; }\n .nudge-left-1-l { left: 1px; }\n .nudge-left-2-l { left: 2px; }\n .nudge-left-3-l { left: 3px; }\n .nudge-left-4-l { left: 4px; }\n .nudge-left-5-l { left: 5px; }\n}\n\n" }, "tachyons-opacity": { @@ -9129,8 +9129,8 @@ ] } ], - "readme": "# tachyons-opacity 1.1.10\n\nTachyons CSS module for setting opacity\n\n#### Stats\n\n167 | 13 | 13\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-opacity\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-opacity\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-opacity.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-opacity\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n OPACITY\n Docs: http://tachyons.io/docs/themes/opacity/\n\n*/\n.o-100 { opacity: 1; }\n.o-90 { opacity: .9; }\n.o-80 { opacity: .8; }\n.o-70 { opacity: .7; }\n.o-60 { opacity: .6; }\n.o-50 { opacity: .5; }\n.o-40 { opacity: .4; }\n.o-30 { opacity: .3; }\n.o-20 { opacity: .2; }\n.o-10 { opacity: .1; }\n.o-05 { opacity: .05; }\n.o-025 { opacity: .025; }\n.o-0 { opacity: 0; }\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "/*\n\n OPACITY\n Docs: http://tachyons.io/docs/themes/opacity/\n\n*/\n\n.o-100 { opacity: 1; }\n.o-90 { opacity: .9; }\n.o-80 { opacity: .8; }\n.o-70 { opacity: .7; }\n.o-60 { opacity: .6; }\n.o-50 { opacity: .5; }\n.o-40 { opacity: .4; }\n.o-30 { opacity: .3; }\n.o-20 { opacity: .2; }\n.o-10 { opacity: .1; }\n.o-05 { opacity: .05; }\n.o-025 { opacity: .025; }\n.o-0 { opacity: 0; }\n", + "readme": "\n\n# OPACITY\n\n### Docs\n\nhttp://tachyons.io/docs/themes/opacity/\n\n### Base\n\n- o = opacity\n\n### Modifiers\n\n- `-100` = literal value 1\n- `-90` = literal value .9\n- `-80` = literal value .8\n- `-70` = literal value .7\n- `-60` = literal value .6\n- `-50` = literal value .5\n- `-40` = literal value .4\n- `-30` = literal value .3\n- `-20` = literal value .2\n- `-10` = literal value .1\n- `-05` = literal value .05\n- `-025` = literal value .025\n- `-0` = literal value 0\n", + "src": "/*!!!\n\n# OPACITY\n\n### Docs\n\nhttp://tachyons.io/docs/themes/opacity/\n\n### Base\n\n- o = opacity\n\n### Modifiers\n\n- `-100` = literal value 1\n- `-90` = literal value .9\n- `-80` = literal value .8\n- `-70` = literal value .7\n- `-60` = literal value .6\n- `-50` = literal value .5\n- `-40` = literal value .4\n- `-30` = literal value .3\n- `-20` = literal value .2\n- `-10` = literal value .1\n- `-05` = literal value .05\n- `-025` = literal value .025\n- `-0` = literal value 0\n*/\n\n.o-100 { opacity: 1; }\n.o-90 { opacity: .9; }\n.o-80 { opacity: .8; }\n.o-70 { opacity: .7; }\n.o-60 { opacity: .6; }\n.o-50 { opacity: .5; }\n.o-40 { opacity: .4; }\n.o-30 { opacity: .3; }\n.o-20 { opacity: .2; }\n.o-10 { opacity: .1; }\n.o-05 { opacity: .05; }\n.o-025 { opacity: .025; }\n.o-0 { opacity: 0; }\n", "css": "/*\n\n OPACITY\n Docs: http://tachyons.io/docs/themes/opacity/\n\n*/\n.o-100 { opacity: 1; }\n.o-90 { opacity: .9; }\n.o-80 { opacity: .8; }\n.o-70 { opacity: .7; }\n.o-60 { opacity: .6; }\n.o-50 { opacity: .5; }\n.o-40 { opacity: .4; }\n.o-30 { opacity: .3; }\n.o-20 { opacity: .2; }\n.o-10 { opacity: .1; }\n.o-05 { opacity: .05; }\n.o-025 { opacity: .025; }\n.o-0 { opacity: 0; }\n\n" }, "tachyons-opacity-responsive": { @@ -9412,8 +9412,8 @@ ] } ], - "readme": "# tachyons 5.0.0-1\n\nFunctional CSS for humans\n\n### Stats\n\n522 | 39 | 39\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*!!!\n\n# OPACITY\n\nPlease note that this module should be used\nwith the core opacity module. This only provides\nresponsive classes for opacity.\n\n### Docs\n\nhttp://tachyons.io/docs/addons/opacity-responsive/\nhttp://tachyons.io/docs/themes/opacity/\n\n### Base\n\n- o = opacity\n\n### Modifiers\n\n- `-100` = literal value 1\n- `-90` = literal value .9\n- `-80` = literal value .8\n- `-70` = literal value .7\n- `-60` = literal value .6\n- `-50` = literal value .5\n- `-40` = literal value .4\n- `-30` = literal value .3\n- `-20` = literal value .2\n- `-10` = literal value .1\n- `-05` = literal value .05\n- `-025` = literal value .025\n- `-0` = literal value 0\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n@media screen and (min-width: 30em) {\n .o-100-s { opacity: 1; }\n .o-90-s { opacity: .9; }\n .o-80-s { opacity: .8; }\n .o-70-s { opacity: .7; }\n .o-60-s { opacity: .6; }\n .o-50-s { opacity: .5; }\n .o-40-s { opacity: .4; }\n .o-30-s { opacity: .3; }\n .o-20-s { opacity: .2; }\n .o-10-s { opacity: .1; }\n .o-05-s { opacity: .05; }\n .o-025-s { opacity: .025; }\n .o-0-s { opacity: 0; }\n}\n@media screen and (min-width: 48em) {\n .o-100-m { opacity: 1; }\n .o-90-m { opacity: .9; }\n .o-80-m { opacity: .8; }\n .o-70-m { opacity: .7; }\n .o-60-m { opacity: .6; }\n .o-50-m { opacity: .5; }\n .o-40-m { opacity: .4; }\n .o-30-m { opacity: .3; }\n .o-20-m { opacity: .2; }\n .o-10-m { opacity: .1; }\n .o-05-m { opacity: .05; }\n .o-025-m { opacity: .025; }\n .o-0-m { opacity: 0; }\n}\n@media screen and (min-width: 60em) {\n .o-100-l { opacity: 1; }\n .o-90-l { opacity: .9; }\n .o-80-l { opacity: .8; }\n .o-70-l { opacity: .7; }\n .o-60-l { opacity: .6; }\n .o-50-l { opacity: .5; }\n .o-40-l { opacity: .4; }\n .o-30-l { opacity: .3; }\n .o-20-l { opacity: .2; }\n .o-10-l { opacity: .1; }\n .o-05-l { opacity: .05; }\n .o-025-l { opacity: .025; }\n .o-0-l { opacity: 0; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "\n\n\n@custom-media --breakpoint-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 48em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n/*!!!\n\n# OPACITY\n\nPlease note that this module should be used\nwith the core opacity module. This only provides\nresponsive classes for opacity.\n\n### Docs\n\nhttp://tachyons.io/docs/addons/opacity-responsive/\nhttp://tachyons.io/docs/themes/opacity/\n\n### Base\n\n- o = opacity\n\n### Modifiers\n\n- `-100` = literal value 1\n- `-90` = literal value .9\n- `-80` = literal value .8\n- `-70` = literal value .7\n- `-60` = literal value .6\n- `-50` = literal value .5\n- `-40` = literal value .4\n- `-30` = literal value .3\n- `-20` = literal value .2\n- `-10` = literal value .1\n- `-05` = literal value .05\n- `-025` = literal value .025\n- `-0` = literal value 0\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n@media (--breakpoint-small) {\n .o-100-s { opacity: 1; }\n .o-90-s { opacity: .9; }\n .o-80-s { opacity: .8; }\n .o-70-s { opacity: .7; }\n .o-60-s { opacity: .6; }\n .o-50-s { opacity: .5; }\n .o-40-s { opacity: .4; }\n .o-30-s { opacity: .3; }\n .o-20-s { opacity: .2; }\n .o-10-s { opacity: .1; }\n .o-05-s { opacity: .05; }\n .o-025-s { opacity: .025; }\n .o-0-s { opacity: 0; }\n}\n\n@media (--breakpoint-medium) {\n .o-100-m { opacity: 1; }\n .o-90-m { opacity: .9; }\n .o-80-m { opacity: .8; }\n .o-70-m { opacity: .7; }\n .o-60-m { opacity: .6; }\n .o-50-m { opacity: .5; }\n .o-40-m { opacity: .4; }\n .o-30-m { opacity: .3; }\n .o-20-m { opacity: .2; }\n .o-10-m { opacity: .1; }\n .o-05-m { opacity: .05; }\n .o-025-m { opacity: .025; }\n .o-0-m { opacity: 0; }\n}\n\n@media (--breakpoint-large) {\n .o-100-l { opacity: 1; }\n .o-90-l { opacity: .9; }\n .o-80-l { opacity: .8; }\n .o-70-l { opacity: .7; }\n .o-60-l { opacity: .6; }\n .o-50-l { opacity: .5; }\n .o-40-l { opacity: .4; }\n .o-30-l { opacity: .3; }\n .o-20-l { opacity: .2; }\n .o-10-l { opacity: .1; }\n .o-05-l { opacity: .05; }\n .o-025-l { opacity: .025; }\n .o-0-l { opacity: 0; }\n}\n", + "readme": "\n\n# OPACITY\n\nPlease note that this module should be used\nwith the core opacity module. This only provides\nresponsive classes for opacity.\n\n### Docs\n\nhttp://tachyons.io/docs/addons/opacity-responsive/\nhttp://tachyons.io/docs/themes/opacity/\n\n### Base\n\n- o = opacity\n\n### Modifiers\n\n- `-100` = literal value 1\n- `-90` = literal value .9\n- `-80` = literal value .8\n- `-70` = literal value .7\n- `-60` = literal value .6\n- `-50` = literal value .5\n- `-40` = literal value .4\n- `-30` = literal value .3\n- `-20` = literal value .2\n- `-10` = literal value .1\n- `-05` = literal value .05\n- `-025` = literal value .025\n- `-0` = literal value 0\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# OPACITY\n\nPlease note that this module should be used\nwith the core opacity module. This only provides\nresponsive classes for opacity.\n\n### Docs\n\nhttp://tachyons.io/docs/addons/opacity-responsive/\nhttp://tachyons.io/docs/themes/opacity/\n\n### Base\n\n- o = opacity\n\n### Modifiers\n\n- `-100` = literal value 1\n- `-90` = literal value .9\n- `-80` = literal value .8\n- `-70` = literal value .7\n- `-60` = literal value .6\n- `-50` = literal value .5\n- `-40` = literal value .4\n- `-30` = literal value .3\n- `-20` = literal value .2\n- `-10` = literal value .1\n- `-05` = literal value .05\n- `-025` = literal value .025\n- `-0` = literal value 0\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n@media (--breakpoint-small) {\n .o-100-s { opacity: 1; }\n .o-90-s { opacity: .9; }\n .o-80-s { opacity: .8; }\n .o-70-s { opacity: .7; }\n .o-60-s { opacity: .6; }\n .o-50-s { opacity: .5; }\n .o-40-s { opacity: .4; }\n .o-30-s { opacity: .3; }\n .o-20-s { opacity: .2; }\n .o-10-s { opacity: .1; }\n .o-05-s { opacity: .05; }\n .o-025-s { opacity: .025; }\n .o-0-s { opacity: 0; }\n}\n\n@media (--breakpoint-medium) {\n .o-100-m { opacity: 1; }\n .o-90-m { opacity: .9; }\n .o-80-m { opacity: .8; }\n .o-70-m { opacity: .7; }\n .o-60-m { opacity: .6; }\n .o-50-m { opacity: .5; }\n .o-40-m { opacity: .4; }\n .o-30-m { opacity: .3; }\n .o-20-m { opacity: .2; }\n .o-10-m { opacity: .1; }\n .o-05-m { opacity: .05; }\n .o-025-m { opacity: .025; }\n .o-0-m { opacity: 0; }\n}\n\n@media (--breakpoint-large) {\n .o-100-l { opacity: 1; }\n .o-90-l { opacity: .9; }\n .o-80-l { opacity: .8; }\n .o-70-l { opacity: .7; }\n .o-60-l { opacity: .6; }\n .o-50-l { opacity: .5; }\n .o-40-l { opacity: .4; }\n .o-30-l { opacity: .3; }\n .o-20-l { opacity: .2; }\n .o-10-l { opacity: .1; }\n .o-05-l { opacity: .05; }\n .o-025-l { opacity: .025; }\n .o-0-l { opacity: 0; }\n}\n", "css": "/*!!!\n\n# OPACITY\n\nPlease note that this module should be used\nwith the core opacity module. This only provides\nresponsive classes for opacity.\n\n### Docs\n\nhttp://tachyons.io/docs/addons/opacity-responsive/\nhttp://tachyons.io/docs/themes/opacity/\n\n### Base\n\n- o = opacity\n\n### Modifiers\n\n- `-100` = literal value 1\n- `-90` = literal value .9\n- `-80` = literal value .8\n- `-70` = literal value .7\n- `-60` = literal value .6\n- `-50` = literal value .5\n- `-40` = literal value .4\n- `-30` = literal value .3\n- `-20` = literal value .2\n- `-10` = literal value .1\n- `-05` = literal value .05\n- `-025` = literal value .025\n- `-0` = literal value 0\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n@media screen and (min-width: 30em) {\n .o-100-s { opacity: 1; }\n .o-90-s { opacity: .9; }\n .o-80-s { opacity: .8; }\n .o-70-s { opacity: .7; }\n .o-60-s { opacity: .6; }\n .o-50-s { opacity: .5; }\n .o-40-s { opacity: .4; }\n .o-30-s { opacity: .3; }\n .o-20-s { opacity: .2; }\n .o-10-s { opacity: .1; }\n .o-05-s { opacity: .05; }\n .o-025-s { opacity: .025; }\n .o-0-s { opacity: 0; }\n}\n@media screen and (min-width: 48em) {\n .o-100-m { opacity: 1; }\n .o-90-m { opacity: .9; }\n .o-80-m { opacity: .8; }\n .o-70-m { opacity: .7; }\n .o-60-m { opacity: .6; }\n .o-50-m { opacity: .5; }\n .o-40-m { opacity: .4; }\n .o-30-m { opacity: .3; }\n .o-20-m { opacity: .2; }\n .o-10-m { opacity: .1; }\n .o-05-m { opacity: .05; }\n .o-025-m { opacity: .025; }\n .o-0-m { opacity: 0; }\n}\n@media screen and (min-width: 60em) {\n .o-100-l { opacity: 1; }\n .o-90-l { opacity: .9; }\n .o-80-l { opacity: .8; }\n .o-70-l { opacity: .7; }\n .o-60-l { opacity: .6; }\n .o-50-l { opacity: .5; }\n .o-40-l { opacity: .4; }\n .o-30-l { opacity: .3; }\n .o-20-l { opacity: .2; }\n .o-10-l { opacity: .1; }\n .o-05-l { opacity: .05; }\n .o-025-l { opacity: .025; }\n .o-0-l { opacity: 0; }\n}\n\n" }, "tachyons-outlines": { @@ -9506,8 +9506,8 @@ ] } ], - "readme": "# tachyons-outlines 1.0.3\n\nTachyons module for setting outlines\n\n#### Stats\n\n189 | 12 | 12\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-outlines\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-outlines\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-outlines.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-outlines\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n OUTLINES\n\n*/\n.outline { outline: 1px solid; }\n.outline-transparent { outline: 1px solid transparent; }\n.outline-0 { outline: 0; }\n@media screen and (min-width: 48em) {\n .outline-ns { outline: 1px solid; }\n .outline-transparent-ns { outline: 1px solid transparent; }\n .outline-0-ns { outline: 0; }\n}\n@media screen and (min-width: 48em) and (max-width: 64em) {\n .outline-m { outline: 1px solid; }\n .outline-transparent-m { outline: 1px solid transparent; }\n .outline-0-m { outline: 0; }\n .outline-l { outline: 1px solid; }\n .outline-transparent-l { outline: 1px solid transparent; }\n .outline-0-l { outline: 0; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 48em);\n@custom-media --breakpoint-medium screen and (min-width: 48em) and (max-width: 64em);\n@custom-media --breakpoint-large screen and (min-width: 64em);\n\n/*\n\n OUTLINES\n\n*/\n\n.outline { outline: 1px solid; }\n.outline-transparent { outline: 1px solid transparent; }\n.outline-0 { outline: 0; }\n\n@media (--breakpoint-not-small) {\n .outline-ns { outline: 1px solid; }\n .outline-transparent-ns { outline: 1px solid transparent; }\n .outline-0-ns { outline: 0; }\n}\n\n@media (--breakpoint-medium) {\n .outline-m { outline: 1px solid; }\n .outline-transparent-m { outline: 1px solid transparent; }\n .outline-0-m { outline: 0; }\n}\n\n@media (--breakpoint-medium) {\n .outline-l { outline: 1px solid; }\n .outline-transparent-l { outline: 1px solid transparent; }\n .outline-0-l { outline: 0; }\n}\n", + "readme": "\n\n# OUTLINES\n\nSet transparent outline on elements.\n\n### Base\n\n- outline = outline\n\n### Modifiers\n\n- `-0` = literal value 0\n- `-transparent` = transparent outline\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# OUTLINES\n\nSet transparent outline on elements.\n\n### Base\n\n- outline = outline\n\n### Modifiers\n\n- `-0` = literal value 0\n- `-transparent` = transparent outline\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n.outline { outline: 1px solid; }\n.outline-transparent { outline: 1px solid transparent; }\n.outline-0 { outline: 0; }\n\n@media (--breakpoint-small) {\n .outline-s { outline: 1px solid; }\n .outline-transparent-s { outline: 1px solid transparent; }\n .outline-0-s { outline: 0; }\n}\n\n@media (--breakpoint-medium) {\n .outline-m { outline: 1px solid; }\n .outline-transparent-m { outline: 1px solid transparent; }\n .outline-0-m { outline: 0; }\n}\n\n@media (--breakpoint-large) {\n .outline-l { outline: 1px solid; }\n .outline-transparent-l { outline: 1px solid transparent; }\n .outline-0-l { outline: 0; }\n}\n", "css": "/*\n\n OUTLINES\n\n*/\n.outline { outline: 1px solid; }\n.outline-transparent { outline: 1px solid transparent; }\n.outline-0 { outline: 0; }\n@media screen and (min-width: 48em) {\n .outline-ns { outline: 1px solid; }\n .outline-transparent-ns { outline: 1px solid transparent; }\n .outline-0-ns { outline: 0; }\n}\n@media screen and (min-width: 48em) and (max-width: 64em) {\n .outline-m { outline: 1px solid; }\n .outline-transparent-m { outline: 1px solid transparent; }\n .outline-0-m { outline: 0; }\n .outline-l { outline: 1px solid; }\n .outline-transparent-l { outline: 1px solid transparent; }\n .outline-0-l { outline: 0; }\n}\n\n" }, "tachyons-overflow": { @@ -9852,8 +9852,8 @@ ] } ], - "readme": "# tachyons-overflow 4.0.5\n\nPerformance based css module.\n\n#### Stats\n\n347 | 48 | 48\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-overflow\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-overflow\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-overflow.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-overflow\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n OVERFLOW\n\n */\n.overflow-visible { overflow: visible; }\n.overflow-hidden { overflow: hidden; }\n.overflow-scroll { overflow: scroll; }\n.overflow-auto { overflow: auto; }\n.overflow-x-visible { overflow-x: visible; }\n.overflow-x-hidden { overflow-x: hidden; }\n.overflow-x-scroll { overflow-x: scroll; }\n.overflow-x-auto { overflow-x: auto; }\n.overflow-y-visible { overflow-y: visible; }\n.overflow-y-hidden { overflow-y: hidden; }\n.overflow-y-scroll { overflow-y: scroll; }\n.overflow-y-auto { overflow-y: auto; }\n@media screen and (min-width: 30em) {\n .overflow-visible-ns { overflow: visible; }\n .overflow-hidden-ns { overflow: hidden; }\n .overflow-scroll-ns { overflow: scroll; }\n .overflow-auto-ns { overflow: auto; }\n .overflow-x-visible-ns { overflow-x: visible; }\n .overflow-x-hidden-ns { overflow-x: hidden; }\n .overflow-x-scroll-ns { overflow-x: scroll; }\n .overflow-x-auto-ns { overflow-x: auto; }\n .overflow-y-visible-ns { overflow-y: visible; }\n .overflow-y-hidden-ns { overflow-y: hidden; }\n .overflow-y-scroll-ns { overflow-y: scroll; }\n .overflow-y-auto-ns { overflow-y: auto; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .overflow-visible-m { overflow: visible; }\n .overflow-hidden-m { overflow: hidden; }\n .overflow-scroll-m { overflow: scroll; }\n .overflow-auto-m { overflow: auto; }\n .overflow-x-visible-m { overflow-x: visible; }\n .overflow-x-hidden-m { overflow-x: hidden; }\n .overflow-x-scroll-m { overflow-x: scroll; }\n .overflow-x-auto-m { overflow-x: auto; }\n .overflow-y-visible-m { overflow-y: visible; }\n .overflow-y-hidden-m { overflow-y: hidden; }\n .overflow-y-scroll-m { overflow-y: scroll; }\n .overflow-y-auto-m { overflow-y: auto; }\n}\n@media screen and (min-width: 60em) {\n .overflow-visible-l { overflow: visible; }\n .overflow-hidden-l { overflow: hidden; }\n .overflow-scroll-l { overflow: scroll; }\n .overflow-auto-l { overflow: auto; }\n .overflow-x-visible-l { overflow-x: visible; }\n .overflow-x-hidden-l { overflow-x: hidden; }\n .overflow-x-scroll-l { overflow-x: scroll; }\n .overflow-x-auto-l { overflow-x: auto; }\n .overflow-y-visible-l { overflow-y: visible; }\n .overflow-y-hidden-l { overflow-y: hidden; }\n .overflow-y-scroll-l { overflow-y: scroll; }\n .overflow-y-auto-l { overflow-y: auto; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n OVERFLOW\n\n */\n\n.overflow-visible { overflow: visible; }\n.overflow-hidden { overflow: hidden; }\n.overflow-scroll { overflow: scroll; }\n.overflow-auto { overflow: auto; }\n\n.overflow-x-visible { overflow-x: visible; }\n.overflow-x-hidden { overflow-x: hidden; }\n.overflow-x-scroll { overflow-x: scroll; }\n.overflow-x-auto { overflow-x: auto; }\n\n.overflow-y-visible { overflow-y: visible; }\n.overflow-y-hidden { overflow-y: hidden; }\n.overflow-y-scroll { overflow-y: scroll; }\n.overflow-y-auto { overflow-y: auto; }\n\n@media (--breakpoint-not-small) {\n .overflow-visible-ns { overflow: visible; }\n .overflow-hidden-ns { overflow: hidden; }\n .overflow-scroll-ns { overflow: scroll; }\n .overflow-auto-ns { overflow: auto; }\n .overflow-x-visible-ns { overflow-x: visible; }\n .overflow-x-hidden-ns { overflow-x: hidden; }\n .overflow-x-scroll-ns { overflow-x: scroll; }\n .overflow-x-auto-ns { overflow-x: auto; }\n\n .overflow-y-visible-ns { overflow-y: visible; }\n .overflow-y-hidden-ns { overflow-y: hidden; }\n .overflow-y-scroll-ns { overflow-y: scroll; }\n .overflow-y-auto-ns { overflow-y: auto; }\n}\n\n@media (--breakpoint-medium) {\n .overflow-visible-m { overflow: visible; }\n .overflow-hidden-m { overflow: hidden; }\n .overflow-scroll-m { overflow: scroll; }\n .overflow-auto-m { overflow: auto; }\n\n .overflow-x-visible-m { overflow-x: visible; }\n .overflow-x-hidden-m { overflow-x: hidden; }\n .overflow-x-scroll-m { overflow-x: scroll; }\n .overflow-x-auto-m { overflow-x: auto; }\n\n .overflow-y-visible-m { overflow-y: visible; }\n .overflow-y-hidden-m { overflow-y: hidden; }\n .overflow-y-scroll-m { overflow-y: scroll; }\n .overflow-y-auto-m { overflow-y: auto; }\n}\n\n@media (--breakpoint-large) {\n .overflow-visible-l { overflow: visible; }\n .overflow-hidden-l { overflow: hidden; }\n .overflow-scroll-l { overflow: scroll; }\n .overflow-auto-l { overflow: auto; }\n\n .overflow-x-visible-l { overflow-x: visible; }\n .overflow-x-hidden-l { overflow-x: hidden; }\n .overflow-x-scroll-l { overflow-x: scroll; }\n .overflow-x-auto-l { overflow-x: auto; }\n\n .overflow-y-visible-l { overflow-y: visible; }\n .overflow-y-hidden-l { overflow-y: hidden; }\n .overflow-y-scroll-l { overflow-y: scroll; }\n .overflow-y-auto-l { overflow-y: auto; }\n}\n", + "readme": "\n\n# OVERFLOW\n\n### Base\n\n- overflow\n- overflow-x\n- overflow-y\n\n### Modifiers\n\n- `-visible`\n- `-hidden`\n- `-scroll`\n- `-auto`\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n ", + "src": "/*!!!\n\n# OVERFLOW\n\n### Base\n\n- overflow\n- overflow-x\n- overflow-y\n\n### Modifiers\n\n- `-visible`\n- `-hidden`\n- `-scroll`\n- `-auto`\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n */\n\n.overflow-visible { overflow: visible; }\n.overflow-hidden { overflow: hidden; }\n.overflow-scroll { overflow: scroll; }\n.overflow-auto { overflow: auto; }\n\n.overflow-x-visible { overflow-x: visible; }\n.overflow-x-hidden { overflow-x: hidden; }\n.overflow-x-scroll { overflow-x: scroll; }\n.overflow-x-auto { overflow-x: auto; }\n\n.overflow-y-visible { overflow-y: visible; }\n.overflow-y-hidden { overflow-y: hidden; }\n.overflow-y-scroll { overflow-y: scroll; }\n.overflow-y-auto { overflow-y: auto; }\n\n@media (--breakpoint-small) {\n .overflow-visible-s { overflow: visible; }\n .overflow-hidden-s { overflow: hidden; }\n .overflow-scroll-s { overflow: scroll; }\n .overflow-auto-s { overflow: auto; }\n\n .overflow-x-visible-s { overflow-x: visible; }\n .overflow-x-hidden-s { overflow-x: hidden; }\n .overflow-x-scroll-s { overflow-x: scroll; }\n .overflow-x-auto-s { overflow-x: auto; }\n\n .overflow-y-visible-s { overflow-y: visible; }\n .overflow-y-hidden-s { overflow-y: hidden; }\n .overflow-y-scroll-s { overflow-y: scroll; }\n .overflow-y-auto-s { overflow-y: auto; }\n}\n\n@media (--breakpoint-medium) {\n .overflow-visible-m { overflow: visible; }\n .overflow-hidden-m { overflow: hidden; }\n .overflow-scroll-m { overflow: scroll; }\n .overflow-auto-m { overflow: auto; }\n\n .overflow-x-visible-m { overflow-x: visible; }\n .overflow-x-hidden-m { overflow-x: hidden; }\n .overflow-x-scroll-m { overflow-x: scroll; }\n .overflow-x-auto-m { overflow-x: auto; }\n\n .overflow-y-visible-m { overflow-y: visible; }\n .overflow-y-hidden-m { overflow-y: hidden; }\n .overflow-y-scroll-m { overflow-y: scroll; }\n .overflow-y-auto-m { overflow-y: auto; }\n}\n\n@media (--breakpoint-large) {\n .overflow-visible-l { overflow: visible; }\n .overflow-hidden-l { overflow: hidden; }\n .overflow-scroll-l { overflow: scroll; }\n .overflow-auto-l { overflow: auto; }\n\n .overflow-x-visible-l { overflow-x: visible; }\n .overflow-x-hidden-l { overflow-x: hidden; }\n .overflow-x-scroll-l { overflow-x: scroll; }\n .overflow-x-auto-l { overflow-x: auto; }\n\n .overflow-y-visible-l { overflow-y: visible; }\n .overflow-y-hidden-l { overflow-y: hidden; }\n .overflow-y-scroll-l { overflow-y: scroll; }\n .overflow-y-auto-l { overflow-y: auto; }\n}\n", "css": "/*\n\n OVERFLOW\n\n */\n.overflow-visible { overflow: visible; }\n.overflow-hidden { overflow: hidden; }\n.overflow-scroll { overflow: scroll; }\n.overflow-auto { overflow: auto; }\n.overflow-x-visible { overflow-x: visible; }\n.overflow-x-hidden { overflow-x: hidden; }\n.overflow-x-scroll { overflow-x: scroll; }\n.overflow-x-auto { overflow-x: auto; }\n.overflow-y-visible { overflow-y: visible; }\n.overflow-y-hidden { overflow-y: hidden; }\n.overflow-y-scroll { overflow-y: scroll; }\n.overflow-y-auto { overflow-y: auto; }\n@media screen and (min-width: 30em) {\n .overflow-visible-ns { overflow: visible; }\n .overflow-hidden-ns { overflow: hidden; }\n .overflow-scroll-ns { overflow: scroll; }\n .overflow-auto-ns { overflow: auto; }\n .overflow-x-visible-ns { overflow-x: visible; }\n .overflow-x-hidden-ns { overflow-x: hidden; }\n .overflow-x-scroll-ns { overflow-x: scroll; }\n .overflow-x-auto-ns { overflow-x: auto; }\n .overflow-y-visible-ns { overflow-y: visible; }\n .overflow-y-hidden-ns { overflow-y: hidden; }\n .overflow-y-scroll-ns { overflow-y: scroll; }\n .overflow-y-auto-ns { overflow-y: auto; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .overflow-visible-m { overflow: visible; }\n .overflow-hidden-m { overflow: hidden; }\n .overflow-scroll-m { overflow: scroll; }\n .overflow-auto-m { overflow: auto; }\n .overflow-x-visible-m { overflow-x: visible; }\n .overflow-x-hidden-m { overflow-x: hidden; }\n .overflow-x-scroll-m { overflow-x: scroll; }\n .overflow-x-auto-m { overflow-x: auto; }\n .overflow-y-visible-m { overflow-y: visible; }\n .overflow-y-hidden-m { overflow-y: hidden; }\n .overflow-y-scroll-m { overflow-y: scroll; }\n .overflow-y-auto-m { overflow-y: auto; }\n}\n@media screen and (min-width: 60em) {\n .overflow-visible-l { overflow: visible; }\n .overflow-hidden-l { overflow: hidden; }\n .overflow-scroll-l { overflow: scroll; }\n .overflow-auto-l { overflow: auto; }\n .overflow-x-visible-l { overflow-x: visible; }\n .overflow-x-hidden-l { overflow-x: hidden; }\n .overflow-x-scroll-l { overflow-x: scroll; }\n .overflow-x-auto-l { overflow-x: auto; }\n .overflow-y-visible-l { overflow-y: visible; }\n .overflow-y-hidden-l { overflow-y: hidden; }\n .overflow-y-scroll-l { overflow-y: scroll; }\n .overflow-y-auto-l { overflow-y: auto; }\n}\n\n" }, "tachyons-position": { @@ -9974,8 +9974,8 @@ ] } ], - "readme": "# tachyons-position 6.0.6\n\nPerformance based css module.\n\n#### Stats\n\n210 | 16 | 16\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-position\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-position\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-position.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-position\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n POSITIONING\n\n */\n.static { position: static; }\n.relative { position: relative; }\n.absolute { position: absolute; }\n.fixed { position: fixed; }\n@media screen and (min-width: 30em) {\n .static-ns { position: static; }\n .relative-ns { position: relative; }\n .absolute-ns { position: absolute; }\n .fixed-ns { position: fixed; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .static-m { position: static; }\n .relative-m { position: relative; }\n .absolute-m { position: absolute; }\n .fixed-m { position: fixed; }\n}\n@media screen and (min-width: 60em) {\n .static-l { position: static; }\n .relative-l { position: relative; }\n .absolute-l { position: absolute; }\n .fixed-l { position: fixed; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n POSITIONING\n\n */\n\n.static { position: static; }\n.relative { position: relative; }\n.absolute { position: absolute; }\n.fixed { position: fixed; }\n\n@media (--breakpoint-not-small) {\n .static-ns { position: static; }\n .relative-ns { position: relative; }\n .absolute-ns { position: absolute; }\n .fixed-ns { position: fixed; }\n}\n\n@media (--breakpoint-medium) {\n .static-m { position: static; }\n .relative-m { position: relative; }\n .absolute-m { position: absolute; }\n .fixed-m { position: fixed; }\n}\n\n@media (--breakpoint-large) {\n .static-l { position: static; }\n .relative-l { position: relative; }\n .absolute-l { position: absolute; }\n .fixed-l { position: fixed; }\n}\n", + "readme": "\n\n# POSITIONING\n\n### Docs\n\nhttp://tachyons.io/docs/layout/position/\n\n### Base\n\n- static\n- relative\n- absolute\n- fixed\n- sticky\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# POSITIONING\n\n### Docs\n\nhttp://tachyons.io/docs/layout/position/\n\n### Base\n\n- static\n- relative\n- absolute\n- fixed\n- sticky\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n.static { position: static; }\n.relative { position: relative; }\n.absolute { position: absolute; }\n.fixed { position: fixed; }\n.sticky { position: sticky; }\n\n@media (--breakpoint-small) {\n .static-s { position: static; }\n .relative-s { position: relative; }\n .absolute-s { position: absolute; }\n .fixed-s { position: fixed; }\n .sticky-s { position: sticky; }\n}\n\n@media (--breakpoint-medium) {\n .static-m { position: static; }\n .relative-m { position: relative; }\n .absolute-m { position: absolute; }\n .fixed-m { position: fixed; }\n .sticky-m { position: sticky; }\n}\n\n@media (--breakpoint-large) {\n .static-l { position: static; }\n .relative-l { position: relative; }\n .absolute-l { position: absolute; }\n .fixed-l { position: fixed; }\n .sticky-l { position: sticky; }\n}\n", "css": "/*\n\n POSITIONING\n\n */\n.static { position: static; }\n.relative { position: relative; }\n.absolute { position: absolute; }\n.fixed { position: fixed; }\n@media screen and (min-width: 30em) {\n .static-ns { position: static; }\n .relative-ns { position: relative; }\n .absolute-ns { position: absolute; }\n .fixed-ns { position: fixed; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .static-m { position: static; }\n .relative-m { position: relative; }\n .absolute-m { position: absolute; }\n .fixed-m { position: fixed; }\n}\n@media screen and (min-width: 60em) {\n .static-l { position: static; }\n .relative-l { position: relative; }\n .absolute-l { position: absolute; }\n .fixed-l { position: fixed; }\n}\n\n" }, "tachyons-rotations": { @@ -10208,8 +10208,8 @@ ] } ], - "readme": "# tachyons-rotations 1.0.4\n\nCss for setting the rotation of an element.\n\n#### Stats\n\n363 | 28 | 56\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-rotations\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-rotations\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-rotations.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-rotations\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n ROTATIONS\n\n Ref: https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/rotate\n\n*/\n.rotate-45 { -webkit-transform: rotate( 45deg ); transform: rotate( 45deg ); }\n.rotate-90 { -webkit-transform: rotate( 90deg ); transform: rotate( 90deg ); }\n.rotate-135 { -webkit-transform: rotate( 135deg ); transform: rotate( 135deg ); }\n.rotate-180 { -webkit-transform: rotate( 180deg ); transform: rotate( 180deg ); }\n.rotate-225 { -webkit-transform: rotate( 225deg ); transform: rotate( 225deg ); }\n.rotate-270 { -webkit-transform: rotate( 270deg ); transform: rotate( 270deg ); }\n.rotate-315 { -webkit-transform: rotate( 315deg ); transform: rotate( 315deg ); }\n@media screen and (min-width: 30em) {\n .rotate-45-ns { -webkit-transform: rotate( 45deg ); transform: rotate( 45deg ); }\n .rotate-90-ns { -webkit-transform: rotate( 90deg ); transform: rotate( 90deg ); }\n .rotate-135-ns { -webkit-transform: rotate( 135deg ); transform: rotate( 135deg ); }\n .rotate-180-ns { -webkit-transform: rotate( 180deg ); transform: rotate( 180deg ); }\n .rotate-225-ns { -webkit-transform: rotate( 225deg ); transform: rotate( 225deg ); }\n .rotate-270-ns { -webkit-transform: rotate( 270deg ); transform: rotate( 270deg ); }\n .rotate-315-ns { -webkit-transform: rotate( 315deg ); transform: rotate( 315deg ); }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .rotate-45-m { -webkit-transform: rotate( 45deg ); transform: rotate( 45deg ); }\n .rotate-90-m { -webkit-transform: rotate( 90deg ); transform: rotate( 90deg ); }\n .rotate-135-m { -webkit-transform: rotate( 135deg ); transform: rotate( 135deg ); }\n .rotate-180-m { -webkit-transform: rotate( 180deg ); transform: rotate( 180deg ); }\n .rotate-225-m { -webkit-transform: rotate( 225deg ); transform: rotate( 225deg ); }\n .rotate-270-m { -webkit-transform: rotate( 270deg ); transform: rotate( 270deg ); }\n .rotate-315-m { -webkit-transform: rotate( 315deg ); transform: rotate( 315deg ); }\n}\n@media screen and (min-width: 60em) {\n .rotate-45-l { -webkit-transform: rotate( 45deg ); transform: rotate( 45deg ); }\n .rotate-90-l { -webkit-transform: rotate( 90deg ); transform: rotate( 90deg ); }\n .rotate-135-l { -webkit-transform: rotate( 135deg ); transform: rotate( 135deg ); }\n .rotate-180-l { -webkit-transform: rotate( 180deg ); transform: rotate( 180deg ); }\n .rotate-225-l { -webkit-transform: rotate( 225deg ); transform: rotate( 225deg ); }\n .rotate-270-l { -webkit-transform: rotate( 270deg ); transform: rotate( 270deg ); }\n .rotate-315-l { -webkit-transform: rotate( 315deg ); transform: rotate( 315deg ); }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n ROTATIONS\n\n Ref: https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/rotate\n\n*/\n\n.rotate-45 { transform: rotate(45deg); }\n.rotate-90 { transform: rotate(90deg); }\n.rotate-135 { transform: rotate(135deg); }\n.rotate-180 { transform: rotate(180deg); }\n.rotate-225 { transform: rotate(225deg); }\n.rotate-270 { transform: rotate(270deg); }\n.rotate-315 { transform: rotate(315deg); }\n\n@media (--breakpoint-not-small) {\n .rotate-45-ns { transform: rotate(45deg); }\n .rotate-90-ns { transform: rotate(90deg); }\n .rotate-135-ns { transform: rotate(135deg); }\n .rotate-180-ns { transform: rotate(180deg); }\n .rotate-225-ns { transform: rotate(225deg); }\n .rotate-270-ns { transform: rotate(270deg); }\n .rotate-315-ns { transform: rotate(315deg); }\n}\n\n@media (--breakpoint-medium) {\n .rotate-45-m { transform: rotate(45deg); }\n .rotate-90-m { transform: rotate(90deg); }\n .rotate-135-m { transform: rotate(135deg); }\n .rotate-180-m { transform: rotate(180deg); }\n .rotate-225-m { transform: rotate(225deg); }\n .rotate-270-m { transform: rotate(270deg); }\n .rotate-315-m { transform: rotate(315deg); }\n}\n\n@media (--breakpoint-large) {\n .rotate-45-l { transform: rotate(45deg); }\n .rotate-90-l { transform: rotate(90deg); }\n .rotate-135-l { transform: rotate(135deg); }\n .rotate-180-l { transform: rotate(180deg); }\n .rotate-225-l { transform: rotate(225deg); }\n .rotate-270-l { transform: rotate(270deg); }\n .rotate-315-l { transform: rotate(315deg); }\n}\n", + "readme": "\n\n# ROTATIONS\n\nRotate elements.\n\n### Base\n\n- rotate\n\n### Modifiers\n\n- `-45` = literal value 45deg\n- `-90` = literal value 90deg\n- `-135` = literal value 135deg\n- `-180` = literal value 180deg\n- `-225` = literal value 225deg\n- `-270` = literal value 270deg\n- `-315` = literal value 315deg\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# ROTATIONS\n\nRotate elements.\n\n### Base\n\n- rotate\n\n### Modifiers\n\n- `-45` = literal value 45deg\n- `-90` = literal value 90deg\n- `-135` = literal value 135deg\n- `-180` = literal value 180deg\n- `-225` = literal value 225deg\n- `-270` = literal value 270deg\n- `-315` = literal value 315deg\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n.rotate-45 { transform: rotate(45deg); }\n.rotate-90 { transform: rotate(90deg); }\n.rotate-135 { transform: rotate(135deg); }\n.rotate-180 { transform: rotate(180deg); }\n.rotate-225 { transform: rotate(225deg); }\n.rotate-270 { transform: rotate(270deg); }\n.rotate-315 { transform: rotate(315deg); }\n\n@media (--breakpoint-small) {\n .rotate-45-s { transform: rotate(45deg); }\n .rotate-90-s { transform: rotate(90deg); }\n .rotate-135-s { transform: rotate(135deg); }\n .rotate-180-s { transform: rotate(180deg); }\n .rotate-225-s { transform: rotate(225deg); }\n .rotate-270-s { transform: rotate(270deg); }\n .rotate-315-s { transform: rotate(315deg); }\n}\n\n@media (--breakpoint-medium) {\n .rotate-45-m { transform: rotate(45deg); }\n .rotate-90-m { transform: rotate(90deg); }\n .rotate-135-m { transform: rotate(135deg); }\n .rotate-180-m { transform: rotate(180deg); }\n .rotate-225-m { transform: rotate(225deg); }\n .rotate-270-m { transform: rotate(270deg); }\n .rotate-315-m { transform: rotate(315deg); }\n}\n\n@media (--breakpoint-large) {\n .rotate-45-l { transform: rotate(45deg); }\n .rotate-90-l { transform: rotate(90deg); }\n .rotate-135-l { transform: rotate(135deg); }\n .rotate-180-l { transform: rotate(180deg); }\n .rotate-225-l { transform: rotate(225deg); }\n .rotate-270-l { transform: rotate(270deg); }\n .rotate-315-l { transform: rotate(315deg); }\n}\n", "css": "/*\n\n ROTATIONS\n\n Ref: https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/rotate\n\n*/\n.rotate-45 { -webkit-transform: rotate( 45deg ); transform: rotate( 45deg ); }\n.rotate-90 { -webkit-transform: rotate( 90deg ); transform: rotate( 90deg ); }\n.rotate-135 { -webkit-transform: rotate( 135deg ); transform: rotate( 135deg ); }\n.rotate-180 { -webkit-transform: rotate( 180deg ); transform: rotate( 180deg ); }\n.rotate-225 { -webkit-transform: rotate( 225deg ); transform: rotate( 225deg ); }\n.rotate-270 { -webkit-transform: rotate( 270deg ); transform: rotate( 270deg ); }\n.rotate-315 { -webkit-transform: rotate( 315deg ); transform: rotate( 315deg ); }\n@media screen and (min-width: 30em) {\n .rotate-45-ns { -webkit-transform: rotate( 45deg ); transform: rotate( 45deg ); }\n .rotate-90-ns { -webkit-transform: rotate( 90deg ); transform: rotate( 90deg ); }\n .rotate-135-ns { -webkit-transform: rotate( 135deg ); transform: rotate( 135deg ); }\n .rotate-180-ns { -webkit-transform: rotate( 180deg ); transform: rotate( 180deg ); }\n .rotate-225-ns { -webkit-transform: rotate( 225deg ); transform: rotate( 225deg ); }\n .rotate-270-ns { -webkit-transform: rotate( 270deg ); transform: rotate( 270deg ); }\n .rotate-315-ns { -webkit-transform: rotate( 315deg ); transform: rotate( 315deg ); }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .rotate-45-m { -webkit-transform: rotate( 45deg ); transform: rotate( 45deg ); }\n .rotate-90-m { -webkit-transform: rotate( 90deg ); transform: rotate( 90deg ); }\n .rotate-135-m { -webkit-transform: rotate( 135deg ); transform: rotate( 135deg ); }\n .rotate-180-m { -webkit-transform: rotate( 180deg ); transform: rotate( 180deg ); }\n .rotate-225-m { -webkit-transform: rotate( 225deg ); transform: rotate( 225deg ); }\n .rotate-270-m { -webkit-transform: rotate( 270deg ); transform: rotate( 270deg ); }\n .rotate-315-m { -webkit-transform: rotate( 315deg ); transform: rotate( 315deg ); }\n}\n@media screen and (min-width: 60em) {\n .rotate-45-l { -webkit-transform: rotate( 45deg ); transform: rotate( 45deg ); }\n .rotate-90-l { -webkit-transform: rotate( 90deg ); transform: rotate( 90deg ); }\n .rotate-135-l { -webkit-transform: rotate( 135deg ); transform: rotate( 135deg ); }\n .rotate-180-l { -webkit-transform: rotate( 180deg ); transform: rotate( 180deg ); }\n .rotate-225-l { -webkit-transform: rotate( 225deg ); transform: rotate( 225deg ); }\n .rotate-270-l { -webkit-transform: rotate( 270deg ); transform: rotate( 270deg ); }\n .rotate-315-l { -webkit-transform: rotate( 315deg ); transform: rotate( 315deg ); }\n}\n\n" }, "tachyons-skins": { @@ -10217,8 +10217,8 @@ "version": "4.1.0", "metadata": {}, "tableOfStyles": [], - "readme": "# tachyons-skins 4.0.0\n\nPerformance based css module.\n\n#### Stats\n\n1115 | 111 | 111\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-skins\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-skins\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-skins.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-skins\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\n/*\n\n Tachyons\n COLOR VARIABLES\n\n Grayscale\n - Solids\n - Transparencies\n Colors\n\n*/\n/*\n\n SKINS\n Docs: http://tachyons.io/docs/themes/skins/\n\n Classes for setting foreground and background colors on elements.\n If you haven't declared a border color, but set border on an element, it will \n be set to the current text color. \n\n*/\n/* Text colors */\n.black-90 { color: rgba( 0, 0, 0, .9 ); }\n.black-80 { color: rgba( 0, 0, 0, .8 ); }\n.black-70 { color: rgba( 0, 0, 0, .7 ); }\n.black-60 { color: rgba( 0, 0, 0, .6 ); }\n.black-50 { color: rgba( 0, 0, 0, .5 ); }\n.black-40 { color: rgba( 0, 0, 0, .4 ); }\n.black-30 { color: rgba( 0, 0, 0, .3 ); }\n.black-20 { color: rgba( 0, 0, 0, .2 ); }\n.black-10 { color: rgba( 0, 0, 0, .1 ); }\n.black-05 { color: rgba( 0, 0, 0, .05 ); }\n.white-90 { color: rgba( 255, 255, 255, .9 ); }\n.white-80 { color: rgba( 255, 255, 255, .8 ); }\n.white-70 { color: rgba( 255, 255, 255, .7 ); }\n.white-60 { color: rgba( 255, 255, 255, .6 ); }\n.white-50 { color: rgba( 255, 255, 255, .5 ); }\n.white-40 { color: rgba( 255, 255, 255, .4 ); }\n.white-30 { color: rgba( 255, 255, 255, .3 ); }\n.white-20 { color: rgba( 255, 255, 255, .2 ); }\n.white-10 { color: rgba( 255, 255, 255, .1 ); }\n.black { color: #000; }\n.near-black { color: #111; }\n.dark-gray { color: #333; }\n.mid-gray { color: #555; }\n.gray { color: #777; }\n.silver { color: #999; }\n.light-silver { color: #aaa; }\n.moon-gray { color: #ccc; }\n.light-gray { color: #eee; }\n.near-white { color: #f4f4f4; }\n.white { color: #fff; }\n.dark-red { color: #e7040f; }\n.red { color: #ff4136; }\n.light-red { color: #ff725c; }\n.orange { color: #ff6300; }\n.gold { color: #ffb700; }\n.yellow { color: #ffd700; }\n.light-yellow { color: #fbf1a9; }\n.purple { color: #5e2ca5; }\n.light-purple { color: #a463f2; }\n.dark-pink { color: #d5008f; }\n.hot-pink { color: #ff41b4; }\n.pink { color: #ff80cc; }\n.light-pink { color: #ffa3d7; }\n.dark-green { color: #137752; }\n.green { color: #19a974; }\n.light-green { color: #9eebcf; }\n.navy { color: #001b44; }\n.dark-blue { color: #00449e; }\n.blue { color: #357edd; }\n.light-blue { color: #96ccff; }\n.lightest-blue { color: #cdecff; }\n.washed-blue { color: #f6fffe; }\n.washed-green { color: #e8fdf5; }\n.washed-yellow { color: #fffceb; }\n.washed-red { color: #ffdfdf; }\n.bg-black-90 { background-color: rgba( 0, 0, 0, .9 ); }\n.bg-black-80 { background-color: rgba( 0, 0, 0, .8 ); }\n.bg-black-70 { background-color: rgba( 0, 0, 0, .7 ); }\n.bg-black-60 { background-color: rgba( 0, 0, 0, .6 ); }\n.bg-black-50 { background-color: rgba( 0, 0, 0, .5 ); }\n.bg-black-40 { background-color: rgba( 0, 0, 0, .4 ); }\n.bg-black-30 { background-color: rgba( 0, 0, 0, .3 ); }\n.bg-black-20 { background-color: rgba( 0, 0, 0, .2 ); }\n.bg-black-10 { background-color: rgba( 0, 0, 0, .1 ); }\n.bg-black-05 { background-color: rgba( 0, 0, 0, .05 ); }\n.bg-white-90 { background-color: rgba( 255, 255, 255, .9 ); }\n.bg-white-80 { background-color: rgba( 255, 255, 255, .8 ); }\n.bg-white-70 { background-color: rgba( 255, 255, 255, .7 ); }\n.bg-white-60 { background-color: rgba( 255, 255, 255, .6 ); }\n.bg-white-50 { background-color: rgba( 255, 255, 255, .5 ); }\n.bg-white-40 { background-color: rgba( 255, 255, 255, .4 ); }\n.bg-white-30 { background-color: rgba( 255, 255, 255, .3 ); }\n.bg-white-20 { background-color: rgba( 255, 255, 255, .2 ); }\n.bg-white-10 { background-color: rgba( 255, 255, 255, .1 ); }\n/* Background colors */\n.bg-black { background-color: #000; }\n.bg-near-black { background-color: #111; }\n.bg-dark-gray { background-color: #333; }\n.bg-mid-gray { background-color: #555; }\n.bg-gray { background-color: #777; }\n.bg-silver { background-color: #999; }\n.bg-light-silver { background-color: #aaa; }\n.bg-moon-gray { background-color: #ccc; }\n.bg-light-gray { background-color: #eee; }\n.bg-near-white { background-color: #f4f4f4; }\n.bg-white { background-color: #fff; }\n.bg-transparent { background-color: transparent; }\n.bg-dark-red { background-color: #e7040f; }\n.bg-red { background-color: #ff4136; }\n.bg-light-red { background-color: #ff725c; }\n.bg-orange { background-color: #ff6300; }\n.bg-gold { background-color: #ffb700; }\n.bg-yellow { background-color: #ffd700; }\n.bg-light-yellow { background-color: #fbf1a9; }\n.bg-purple { background-color: #5e2ca5; }\n.bg-light-purple { background-color: #a463f2; }\n.bg-dark-pink { background-color: #d5008f; }\n.bg-hot-pink { background-color: #ff41b4; }\n.bg-pink { background-color: #ff80cc; }\n.bg-light-pink { background-color: #ffa3d7; }\n.bg-dark-green { background-color: #137752; }\n.bg-green { background-color: #19a974; }\n.bg-light-green { background-color: #9eebcf; }\n.bg-navy { background-color: #001b44; }\n.bg-dark-blue { background-color: #00449e; }\n.bg-blue { background-color: #357edd; }\n.bg-light-blue { background-color: #96ccff; }\n.bg-lightest-blue { background-color: #cdecff; }\n.bg-washed-blue { background-color: #f6fffe; }\n.bg-washed-green { background-color: #e8fdf5; }\n.bg-washed-yellow { background-color: #fffceb; }\n.bg-washed-red { background-color: #ffdfdf; }\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "/*\n\n Tachyons\n COLOR VARIABLES\n\n Grayscale\n - Solids\n - Transparencies\n Colors\n\n*/\n\n:root {\n --black: #000;\n --near-black: #111;\n --dark-gray:#333;\n --mid-gray:#555;\n --gray: #777;\n --silver: #999;\n --light-silver: #aaa;\n --moon-gray: #ccc;\n --light-gray: #eee;\n --near-white: #f4f4f4;\n --white: #fff;\n\n --transparent: transparent;\n\n --black-90: rgba(0,0,0,.9);\n --black-80: rgba(0,0,0,.8);\n --black-70: rgba(0,0,0,.7);\n --black-60: rgba(0,0,0,.6);\n --black-50: rgba(0,0,0,.5);\n --black-40: rgba(0,0,0,.4);\n --black-30: rgba(0,0,0,.3);\n --black-20: rgba(0,0,0,.2);\n --black-10: rgba(0,0,0,.1);\n --black-05: rgba(0,0,0,.05);\n --black-025: rgba(0,0,0,.025);\n --black-0125: rgba(0,0,0,.0125);\n\n --white-90: rgba(255,255,255,.9);\n --white-80: rgba(255,255,255,.8);\n --white-70: rgba(255,255,255,.7);\n --white-60: rgba(255,255,255,.6);\n --white-50: rgba(255,255,255,.5);\n --white-40: rgba(255,255,255,.4);\n --white-30: rgba(255,255,255,.3);\n --white-20: rgba(255,255,255,.2);\n --white-10: rgba(255,255,255,.1);\n --white-05: rgba(255,255,255,.05);\n --white-025: rgba(255,255,255,.025);\n --white-0125: rgba(255,255,255,.0125);\n\n --dark-red: #e7040f;\n --red: #ff4136;\n --light-red: #ff725c;\n --orange: #ff6300;\n --gold: #ffb700;\n --yellow: #ffd700;\n --light-yellow: #fbf1a9;\n --purple: #5e2ca5;\n --light-purple: #a463f2;\n --dark-pink: #d5008f;\n --hot-pink: #ff41b4;\n --pink: #ff80cc;\n --light-pink: #ffa3d7;\n --dark-green: #137752;\n --green: #19a974;\n --light-green: #9eebcf;\n --navy: #001b44;\n --dark-blue: #00449e;\n --blue: #357edd;\n --light-blue: #96ccff;\n --lightest-blue: #cdecff;\n --washed-blue: #f6fffe;\n --washed-green: #e8fdf5;\n --washed-yellow: #fffceb;\n --washed-red: #ffdfdf;\n\n}\n\n/*\n\n SKINS\n Docs: http://tachyons.io/docs/themes/skins/\n\n Classes for setting foreground and background colors on elements.\n If you haven't declared a border color, but set border on an element, it will \n be set to the current text color. \n\n*/\n\n/* Text colors */\n\n.black-90 { color: var(--black-90); }\n.black-80 { color: var(--black-80); }\n.black-70 { color: var(--black-70); }\n.black-60 { color: var(--black-60); }\n.black-50 { color: var(--black-50); }\n.black-40 { color: var(--black-40); }\n.black-30 { color: var(--black-30); }\n.black-20 { color: var(--black-20); }\n.black-10 { color: var(--black-10); }\n.black-05 { color: var(--black-05); }\n\n.white-90 { color: var(--white-90); }\n.white-80 { color: var(--white-80); }\n.white-70 { color: var(--white-70); }\n.white-60 { color: var(--white-60); }\n.white-50 { color: var(--white-50); }\n.white-40 { color: var(--white-40); }\n.white-30 { color: var(--white-30); }\n.white-20 { color: var(--white-20); }\n.white-10 { color: var(--white-10); }\n\n.black { color: var(--black); }\n.near-black { color: var(--near-black); }\n.dark-gray { color: var(--dark-gray); }\n.mid-gray { color: var(--mid-gray); }\n.gray { color: var(--gray); }\n.silver { color: var(--silver); }\n.light-silver { color: var(--light-silver); }\n.moon-gray { color: var(--moon-gray); }\n.light-gray { color: var(--light-gray); }\n.near-white { color: var(--near-white); }\n.white { color: var(--white); }\n\n.dark-red { color: var(--dark-red); }\n.red { color: var(--red); }\n.light-red { color: var(--light-red); }\n.orange { color: var(--orange); }\n.gold { color: var(--gold); }\n.yellow { color: var(--yellow); }\n.light-yellow { color: var(--light-yellow); }\n.purple { color: var(--purple); }\n.light-purple { color: var(--light-purple); }\n.dark-pink { color: var(--dark-pink); }\n.hot-pink { color: var(--hot-pink); }\n.pink { color: var(--pink); }\n.light-pink { color: var(--light-pink); }\n.dark-green { color: var(--dark-green); }\n.green { color: var(--green); }\n.light-green { color: var(--light-green); }\n.navy { color: var(--navy); }\n.dark-blue { color: var(--dark-blue); }\n.blue { color: var(--blue); }\n.light-blue { color: var(--light-blue); }\n.lightest-blue { color: var(--lightest-blue); }\n.washed-blue { color: var(--washed-blue); }\n.washed-green { color: var(--washed-green); }\n.washed-yellow { color: var(--washed-yellow); }\n.washed-red { color: var(--washed-red); }\n.color-inherit { color: inherit; }\n\n.bg-black-90 { background-color: var(--black-90); }\n.bg-black-80 { background-color: var(--black-80); }\n.bg-black-70 { background-color: var(--black-70); }\n.bg-black-60 { background-color: var(--black-60); }\n.bg-black-50 { background-color: var(--black-50); }\n.bg-black-40 { background-color: var(--black-40); }\n.bg-black-30 { background-color: var(--black-30); }\n.bg-black-20 { background-color: var(--black-20); }\n.bg-black-10 { background-color: var(--black-10); }\n.bg-black-05 { background-color: var(--black-05); }\n.bg-white-90 { background-color: var(--white-90); }\n.bg-white-80 { background-color: var(--white-80); }\n.bg-white-70 { background-color: var(--white-70); }\n.bg-white-60 { background-color: var(--white-60); }\n.bg-white-50 { background-color: var(--white-50); }\n.bg-white-40 { background-color: var(--white-40); }\n.bg-white-30 { background-color: var(--white-30); }\n.bg-white-20 { background-color: var(--white-20); }\n.bg-white-10 { background-color: var(--white-10); }\n\n\n\n/* Background colors */\n\n.bg-black { background-color: var(--black); }\n.bg-near-black { background-color: var(--near-black); }\n.bg-dark-gray { background-color: var(--dark-gray); }\n.bg-mid-gray { background-color: var(--mid-gray); }\n.bg-gray { background-color: var(--gray); }\n.bg-silver { background-color: var(--silver); }\n.bg-light-silver { background-color: var(--light-silver); }\n.bg-moon-gray { background-color: var(--moon-gray); }\n.bg-light-gray { background-color: var(--light-gray); }\n.bg-near-white { background-color: var(--near-white); }\n.bg-white { background-color: var(--white); }\n.bg-transparent { background-color: var(--transparent); }\n\n.bg-dark-red { background-color: var(--dark-red); }\n.bg-red { background-color: var(--red); }\n.bg-light-red { background-color: var(--light-red); }\n.bg-orange { background-color: var(--orange); }\n.bg-gold { background-color: var(--gold); }\n.bg-yellow { background-color: var(--yellow); }\n.bg-light-yellow { background-color: var(--light-yellow); }\n.bg-purple { background-color: var(--purple); }\n.bg-light-purple { background-color: var(--light-purple); }\n.bg-dark-pink { background-color: var(--dark-pink); }\n.bg-hot-pink { background-color: var(--hot-pink); }\n.bg-pink { background-color: var(--pink); }\n.bg-light-pink { background-color: var(--light-pink); }\n.bg-dark-green { background-color: var(--dark-green); }\n.bg-green { background-color: var(--green); }\n.bg-light-green { background-color: var(--light-green); }\n.bg-navy { background-color: var(--navy); }\n.bg-dark-blue { background-color: var(--dark-blue); }\n.bg-blue { background-color: var(--blue); }\n.bg-light-blue { background-color: var(--light-blue); }\n.bg-lightest-blue { background-color: var(--lightest-blue); }\n.bg-washed-blue { background-color: var(--washed-blue); }\n.bg-washed-green { background-color: var(--washed-green); }\n.bg-washed-yellow { background-color: var(--washed-yellow); }\n.bg-washed-red { background-color: var(--washed-red); }\n.bg-inherit { background-color: inherit; }\n", + "readme": "\n\n# SKINS\n\n### Docs\n\nhttp://tachyons.io/docs/themes/skins/\n\nClasses for setting foreground and background colors on elements.\nIf you haven't declared a border color, but set border on an element, it will\nbe set to the current text color.\n", + "src": "/*!!!\n\n# SKINS\n\n### Docs\n\nhttp://tachyons.io/docs/themes/skins/\n\nClasses for setting foreground and background colors on elements.\nIf you haven't declared a border color, but set border on an element, it will\nbe set to the current text color.\n*/\n\n/* Text colors */\n\n.black-90 { color: var(--black-90); }\n.black-80 { color: var(--black-80); }\n.black-70 { color: var(--black-70); }\n.black-60 { color: var(--black-60); }\n.black-50 { color: var(--black-50); }\n.black-40 { color: var(--black-40); }\n.black-30 { color: var(--black-30); }\n.black-20 { color: var(--black-20); }\n.black-10 { color: var(--black-10); }\n.black-05 { color: var(--black-05); }\n\n.white-90 { color: var(--white-90); }\n.white-80 { color: var(--white-80); }\n.white-70 { color: var(--white-70); }\n.white-60 { color: var(--white-60); }\n.white-50 { color: var(--white-50); }\n.white-40 { color: var(--white-40); }\n.white-30 { color: var(--white-30); }\n.white-20 { color: var(--white-20); }\n.white-10 { color: var(--white-10); }\n\n.black { color: var(--black); }\n.gray0 { color: var(--gray-0); }\n.gray1 { color: var(--gray-1); }\n.gray2 { color: var(--gray-2); }\n.gray3 { color: var(--gray-3); }\n.gray4 { color: var(--gray-4); }\n.gray5 { color: var(--gray-5); }\n.gray6 { color: var(--gray-6); }\n.gray7 { color: var(--gray-7); }\n.gray8 { color: var(--gray-8); }\n.white { color: var(--white); }\n\n.green-0 { color: #044324; }\n.green-1 { color: #05532d; }\n.green-2 { color: #087640; }\n.green-3 { color: #098849; }\n.green-4 { color: #0b9b53; }\n.green-5 { color: #0cad5d; }\n.green-6 { color: #0ec167; }\n.green-7 { color: #0fd472; }\n.green-8 { color: #10e87c; }\n.green-9 { color: #78f5a6; }\n.green-10 { color: #c3fbdf; }\n\n.teal-0 { color: #003d37; }\n.teal-1 { color: #004e46; }\n.teal-2 { color: #007166; }\n.teal-3 { color: #008477; }\n.teal-4 { color: #009788; }\n.teal-5 { color: #00ab9a; }\n.teal-6 { color: #00bfac; }\n.teal-7 { color: #00d3be; }\n.teal-8 { color: #00e8d1; }\n.teal-9 { color: #00fde4; }\n.teal-10 { color: #ccfffa; }\n\n.cyan-0 { color: #015151; }\n.cyan-1 { color: #046064; }\n.cyan-2 { color: #0f7f8a; }\n.cyan-3 { color: #148f9f; }\n.cyan-4 { color: #19a0b3; }\n.cyan-5 { color: #1eb1c9; }\n.cyan-6 { color: #24c2de; }\n.cyan-7 { color: #29d3f4; }\n.cyan-8 { color: #64e2fd; }\n.cyan-9 { color: #9cf0fe; }\n.cyan-10 { color: #c7fefe; }\n\n.blue-0 { color: #002c52; }\n.blue-1 { color: #003a6c; }\n.blue-2 { color: #0057a2; }\n.blue-3 { color: #0066bf; }\n.blue-4 { color: #0076dc; }\n.blue-5 { color: #0086fb; }\n.blue-6 { color: #4d97ff; }\n.blue-7 { color: #72a9ff; }\n.blue-8 { color: #8fbbff; }\n.blue-9 { color: #a8ceff; }\n.blue-10 { color: #bfe1ff; }\n\n.indigo-0 { color: #2c0599; }\n.indigo-1 { color: #3706be; }\n.indigo-2 { color: #5c26ef; }\n.indigo-3 { color: #733ff1; }\n.indigo-4 { color: #8655f3; }\n.indigo-5 { color: #9769f5; }\n.indigo-6 { color: #a67df7; }\n.indigo-7 { color: #b491f9; }\n.indigo-8 { color: #c2a6fb; }\n.indigo-9 { color: #cebafc; }\n.indigo-10 { color: #dacefd; }\n\n.purple-0 { color: #500576; }\n.purple-0 { color: #630691; }\n.purple-0 { color: #8a09cb; }\n.purple-0 { color: #9f0ae9; }\n.purple-0 { color: #af2ef6; }\n.purple-0 { color: #bb4ef7; }\n.purple-0 { color: #c568f9; }\n.purple-0 { color: #d080fa; }\n.purple-0 { color: #d996fb; }\n.purple-0 { color: #e1acfb; }\n.purple-0 { color: #e9c2fc; }\n\n.pink { color: #640233; }\n.pink { color: #7c033f; }\n.pink { color: #ae0459; }\n.pink { color: #c80467; }\n.pink { color: #e30574; }\n.pink { color: #fb1d83; }\n.pink { color: #fe5195; }\n.pink { color: #ff73a7; }\n.pink { color: #ff8fba; }\n.pink { color: #ffa9cc; }\n.pink { color: #fec1df; }\n\n.red-0 { color: #390408; }\n.red-1 { color: #520814; }\n.red-2 { color: #8a1223; }\n.red-3 { color: #a7172b; }\n.red-4 { color: #c61d33; }\n.red-5 { color: #e02e40; }\n.red-6 { color: #e95459; }\n.red-7 { color: #f17373; }\n.red-8 { color: #f68e8f; }\n.red-9 { color: #faa9ab; }\n.red-10 { color: #fbc3c8; }\n\n.orange-0 { color: #6f2601; }\n.orange-1 { color: #862e03; }\n.orange-2 { color: #b73f04; }\n.orange-3 { color: #d04704; }\n.orange-4 { color: #ea5003; }\n.orange-5 { color: #fe6018; }\n.orange-6 { color: #ff7e45; }\n.orange-7 { color: #ff9969; }\n.orange-8 { color: #ffb18b; }\n.orange-9 { color: #ffc7ac; }\n.orange-10 { color: #feddcd; }\n\n.yellow-0 { color: #806800; }\n.yellow-1 { color: #8e7300; }\n.yellow-2 { color: #aa8a00; }\n.yellow-3 { color: #b89600; }\n.yellow-4 { color: #c7a200; }\n.yellow-5 { color: #d6ae00; }\n.yellow-6 { color: #e5ba00; }\n.yellow-7 { color: #f4c700; }\n.yellow-8 { color: #ffd434; }\n.yellow-9 { color: #ffe483; }\n.yellow-10 { color: #fff3bf; }\n\n.bg-black-90 { background-color: var(--black-90); }\n.bg-black-80 { background-color: var(--black-80); }\n.bg-black-70 { background-color: var(--black-70); }\n.bg-black-60 { background-color: var(--black-60); }\n.bg-black-50 { background-color: var(--black-50); }\n.bg-black-40 { background-color: var(--black-40); }\n.bg-black-30 { background-color: var(--black-30); }\n.bg-black-20 { background-color: var(--black-20); }\n.bg-black-10 { background-color: var(--black-10); }\n.bg-black-05 { background-color: var(--black-05); }\n\n.bg-white-90 { background-color: var(--white-90); }\n.bg-white-80 { background-color: var(--white-80); }\n.bg-white-70 { background-color: var(--white-70); }\n.bg-white-60 { background-color: var(--white-60); }\n.bg-white-50 { background-color: var(--white-50); }\n.bg-white-40 { background-color: var(--white-40); }\n.bg-white-30 { background-color: var(--white-30); }\n.bg-white-20 { background-color: var(--white-20); }\n.bg-white-10 { background-color: var(--white-10); }\n\n.bg-black { background-color: var(--black); }\n.bg-gray0 { background-color: var(--gray-0); }\n.bg-gray1 { background-color: var(--gray-1); }\n.bg-gray2 { background-color: var(--gray-2); }\n.bg-gray3 { background-color: var(--gray-3); }\n.bg-gray4 { background-color: var(--gray-4); }\n.bg-gray5 { background-color: var(--gray-5); }\n.bg-gray6 { background-color: var(--gray-6); }\n.bg-gray7 { background-color: var(--gray-7); }\n.bg-gray8 { background-color: var(--gray-8); }\n.bg-white { background-color: var(--white); }\n\n.bg-green-0 { background-color: #044324; }\n.bg-green-1 { background-color: #05532d; }\n.bg-green-2 { background-color: #087640; }\n.bg-green-3 { background-color: #098849; }\n.bg-green-4 { background-color: #0b9b53; }\n.bg-green-5 { background-color: #0cad5d; }\n.bg-green-6 { background-color: #0ec167; }\n.bg-green-7 { background-color: #0fd472; }\n.bg-green-8 { background-color: #10e87c; }\n.bg-green-9 { background-color: #78f5a6; }\n.bg-green-10 { background-color: #c3fbdf; }\n\n.bg-teal-0 { background-color: #003d37; }\n.bg-teal-1 { background-color: #004e46; }\n.bg-teal-2 { background-color: #007166; }\n.bg-teal-3 { background-color: #008477; }\n.bg-teal-4 { background-color: #009788; }\n.bg-teal-5 { background-color: #00ab9a; }\n.bg-teal-6 { background-color: #00bfac; }\n.bg-teal-7 { background-color: #00d3be; }\n.bg-teal-8 { background-color: #00e8d1; }\n.bg-teal-9 { background-color: #00fde4; }\n.bg-teal-10 { background-color: #ccfffa; }\n\n.bg-cyan-0 { background-color: #015151; }\n.bg-cyan-1 { background-color: #046064; }\n.bg-cyan-2 { background-color: #0f7f8a; }\n.bg-cyan-3 { background-color: #148f9f; }\n.bg-cyan-4 { background-color: #19a0b3; }\n.bg-cyan-5 { background-color: #1eb1c9; }\n.bg-cyan-6 { background-color: #24c2de; }\n.bg-cyan-7 { background-color: #29d3f4; }\n.bg-cyan-8 { background-color: #64e2fd; }\n.bg-cyan-9 { background-color: #9cf0fe; }\n.bg-cyan-10 { background-color: #c7fefe; }\n\n.bg-blue-0 { background-color: #002c52; }\n.bg-blue-1 { background-color: #003a6c; }\n.bg-blue-2 { background-color: #0057a2; }\n.bg-blue-3 { background-color: #0066bf; }\n.bg-blue-4 { background-color: #0076dc; }\n.bg-blue-5 { background-color: #0086fb; }\n.bg-blue-6 { background-color: #4d97ff; }\n.bg-blue-7 { background-color: #72a9ff; }\n.bg-blue-8 { background-color: #8fbbff; }\n.bg-blue-9 { background-color: #a8ceff; }\n.bg-blue-10 { background-color: #bfe1ff; }\n\n.bg-indigo-0 { background-color: #2c0599; }\n.bg-indigo-1 { background-color: #3706be; }\n.bg-indigo-2 { background-color: #5c26ef; }\n.bg-indigo-3 { background-color: #733ff1; }\n.bg-indigo-4 { background-color: #8655f3; }\n.bg-indigo-5 { background-color: #9769f5; }\n.bg-indigo-6 { background-color: #a67df7; }\n.bg-indigo-7 { background-color: #b491f9; }\n.bg-indigo-8 { background-color: #c2a6fb; }\n.bg-indigo-9 { background-color: #cebafc; }\n.bg-indigo-10 { background-color: #dacefd; }\n\n.bg-purple-0 { background-color: #500576; }\n.bg-purple-0 { background-color: #630691; }\n.bg-purple-0 { background-color: #8a09cb; }\n.bg-purple-0 { background-color: #9f0ae9; }\n.bg-purple-0 { background-color: #af2ef6; }\n.bg-purple-0 { background-color: #bb4ef7; }\n.bg-purple-0 { background-color: #c568f9; }\n.bg-purple-0 { background-color: #d080fa; }\n.bg-purple-0 { background-color: #d996fb; }\n.bg-purple-0 { background-color: #e1acfb; }\n.bg-purple-0 { background-color: #e9c2fc; }\n\n.bg-pink { background-color: #640233; }\n.bg-pink { background-color: #7c033f; }\n.bg-pink { background-color: #ae0459; }\n.bg-pink { background-color: #c80467; }\n.bg-pink { background-color: #e30574; }\n.bg-pink { background-color: #fb1d83; }\n.bg-pink { background-color: #fe5195; }\n.bg-pink { background-color: #ff73a7; }\n.bg-pink { background-color: #ff8fba; }\n.bg-pink { background-color: #ffa9cc; }\n.bg-pink { background-color: #fec1df; }\n\n.bg-red-0 { background-color: #390408; }\n.bg-red-1 { background-color: #520814; }\n.bg-red-2 { background-color: #8a1223; }\n.bg-red-3 { background-color: #a7172b; }\n.bg-red-4 { background-color: #c61d33; }\n.bg-red-5 { background-color: #e02e40; }\n.bg-red-6 { background-color: #e95459; }\n.bg-red-7 { background-color: #f17373; }\n.bg-red-8 { background-color: #f68e8f; }\n.bg-red-9 { background-color: #faa9ab; }\n.bg-red-10 { background-color: #fbc3c8; }\n\n.bg-orange-0 { background-color: #6f2601; }\n.bg-orange-1 { background-color: #862e03; }\n.bg-orange-2 { background-color: #b73f04; }\n.bg-orange-3 { background-color: #d04704; }\n.bg-orange-4 { background-color: #ea5003; }\n.bg-orange-5 { background-color: #fe6018; }\n.bg-orange-6 { background-color: #ff7e45; }\n.bg-orange-7 { background-color: #ff9969; }\n.bg-orange-8 { background-color: #ffb18b; }\n.bg-orange-9 { background-color: #ffc7ac; }\n.bg-orange-10 { background-color: #feddcd; }\n\n.bg-yellow-0 { background-color: #806800; }\n.bg-yellow-1 { background-color: #8e7300; }\n.bg-yellow-2 { background-color: #aa8a00; }\n.bg-yellow-3 { background-color: #b89600; }\n.bg-yellow-4 { background-color: #c7a200; }\n.bg-yellow-5 { background-color: #d6ae00; }\n.bg-yellow-6 { background-color: #e5ba00; }\n.bg-yellow-7 { background-color: #f4c700; }\n.bg-yellow-8 { background-color: #ffd434; }\n.bg-yellow-9 { background-color: #ffe483; }\n.bg-yellow-10 { background-color: #fff3bf; }\n", "css": "" }, "tachyons-skins-pseudo": { @@ -11249,8 +11249,8 @@ ] } ], - "readme": "# tachyons-skins-pseudo 1.0.4\n\nClasses for setting color and background color for focus and hover states.\n\n#### Stats\n\n1108 | 146 | 146\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-skins-pseudo\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-skins-pseudo\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-skins-pseudo.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-skins-pseudo\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n Tachyons\n COLOR VARIABLES\n\n Grayscale\n - Solids\n - Transparencies\n Colors\n\n*/\n/* \n \n SKINS:PSEUDO\n\n Customize the color of an element when\n it is focused or hovered over.\n \n */\n.hover-black:hover { color: #000; }\n.hover-black:focus { color: #000; }\n.hover-near-black:hover { color: #111; }\n.hover-near-black:focus { color: #111; }\n.hover-dark-gray:hover { color: #333; }\n.hover-dark-gray:focus { color: #333; }\n.hover-mid-gray:hover { color: #555; }\n.hover-mid-gray:focus { color: #555; }\n.hover-gray:hover { color: #777; }\n.hover-gray:focus { color: #777; }\n.hover-silver:hover { color: #999; }\n.hover-silver:focus { color: #999; }\n.hover-light-silver:hover { color: #aaa; }\n.hover-light-silver:focus { color: #aaa; }\n.hover-moon-gray:hover { color: #ccc; }\n.hover-moon-gray:focus { color: #ccc; }\n.hover-light-gray:hover { color: #eee; }\n.hover-light-gray:focus { color: #eee; }\n.hover-near-white:hover { color: #f4f4f4; }\n.hover-near-white:focus { color: #f4f4f4; }\n.hover-white:hover { color: #fff; }\n.hover-white:focus { color: #fff; }\n.hover-bg-black:hover { background-color: #000; }\n.hover-bg-black:focus { background-color: #000; }\n.hover-bg-near-black:hover { background-color: #111; }\n.hover-bg-near-black:focus { background-color: #111; }\n.hover-bg-dark-gray:hover { background-color: #333; }\n.hover-bg-dark-gray:focus { background-color: #333; }\n.hover-bg-dark-gray:focus { background-color: #555; }\n.hover-bg-mid-gray:hover { background-color: #555; }\n.hover-bg-gray:hover { background-color: #777; }\n.hover-bg-gray:focus { background-color: #777; }\n.hover-bg-silver:hover { background-color: #999; }\n.hover-bg-silver:focus { background-color: #999; }\n.hover-bg-light-silver:hover { background-color: #aaa; }\n.hover-bg-light-silver:focus { background-color: #aaa; }\n.hover-bg-moon-gray:hover { background-color: #ccc; }\n.hover-bg-moon-gray:focus { background-color: #ccc; }\n.hover-bg-light-gray:hover { background-color: #eee; }\n.hover-bg-light-gray:focus { background-color: #eee; }\n.hover-bg-near-white:hover { background-color: #f4f4f4; }\n.hover-bg-near-white:focus { background-color: #f4f4f4; }\n.hover-bg-white:hover { background-color: #fff; }\n.hover-bg-white:focus { background-color: #fff; }\n.hover-bg-transparent:hover { background-color: transparent; }\n.hover-bg-transparent:focus { background-color: transparent; }\n.hover-dark-red:hover { color: #e7040f; }\n.hover-dark-red:focus { color: #e7040f; }\n.hover-red:hover { color: #ff4136; }\n.hover-red:focus { color: #ff4136; }\n.hover-light-red:hover { color: #ff725c; }\n.hover-light-red:focus { color: #ff725c; }\n.hover-orange:hover { color: #ff6300; }\n.hover-orange:focus { color: #ff6300; }\n.hover-gold:hover { color: #ffb700; }\n.hover-gold:focus { color: #ffb700; }\n.hover-yellow:hover { color: #ffd700; }\n.hover-yellow:focus { color: #ffd700; }\n.hover-light-yellow:hover { color: #fbf1a9; }\n.hover-light-yellow:focus { color: #fbf1a9; }\n.hover-purple:hover { color: #5e2ca5; }\n.hover-purple:focus { color: #5e2ca5; }\n.hover-light-purple:hover { color: #a463f2; }\n.hover-light-purple:focus { color: #a463f2; }\n.hover-dark-pink:hover { color: #d5008f; }\n.hover-dark-pink:focus { color: #d5008f; }\n.hover-hot-pink:hover { color: #ff41b4; }\n.hover-hot-pink:focus { color: #ff41b4; }\n.hover-pink:hover { color: #ff80cc; }\n.hover-pink:focus { color: #ff80cc; }\n.hover-light-pink:hover { color: #ffa3d7; }\n.hover-light-pink:focus { color: #ffa3d7; }\n.hover-dark-green:hover { color: #137752; }\n.hover-dark-green:focus { color: #137752; }\n.hover-green:hover { color: #19a974; }\n.hover-green:focus { color: #19a974; }\n.hover-light-green:hover { color: #9eebcf; }\n.hover-light-green:focus { color: #9eebcf; }\n.hover-navy:hover { color: #001b44; }\n.hover-navy:focus { color: #001b44; }\n.hover-dark-blue:hover { color: #00449e; }\n.hover-dark-blue:focus { color: #00449e; }\n.hover-blue:hover { color: #357edd; }\n.hover-blue:focus { color: #357edd; }\n.hover-light-blue:hover { color: #96ccff; }\n.hover-light-blue:focus { color: #96ccff; }\n.hover-lightest-blue:hover { color: #cdecff; }\n.hover-lightest-blue:focus { color: #cdecff; }\n.hover-washed-blue:hover { color: #f6fffe; }\n.hover-washed-blue:focus { color: #f6fffe; }\n.hover-washed-green:hover { color: #e8fdf5; }\n.hover-washed-green:focus { color: #e8fdf5; }\n.hover-washed-yellow:hover { color: #fffceb; }\n.hover-washed-yellow:focus { color: #fffceb; }\n.hover-washed-red:hover { color: #ffdfdf; }\n.hover-washed-red:focus { color: #ffdfdf; }\n.hover-bg-dark-red:hover { background-color: #e7040f; }\n.hover-bg-dark-red:focus { background-color: #e7040f; }\n.hover-bg-red:hover { background-color: #ff4136; }\n.hover-bg-red:focus { background-color: #ff4136; }\n.hover-bg-light-red:hover { background-color: #ff725c; }\n.hover-bg-light-red:focus { background-color: #ff725c; }\n.hover-bg-orange:hover { background-color: #ff6300; }\n.hover-bg-orange:focus { background-color: #ff6300; }\n.hover-bg-gold:hover { background-color: #ffb700; }\n.hover-bg-gold:focus { background-color: #ffb700; }\n.hover-bg-yellow:hover { background-color: #ffd700; }\n.hover-bg-yellow:focus { background-color: #ffd700; }\n.hover-bg-light-yellow:hover { background-color: #fbf1a9; }\n.hover-bg-light-yellow:focus { background-color: #fbf1a9; }\n.hover-bg-purple:hover { background-color: #5e2ca5; }\n.hover-bg-purple:focus { background-color: #5e2ca5; }\n.hover-bg-light-purple:hover { background-color: #a463f2; }\n.hover-bg-light-purple:focus { background-color: #a463f2; }\n.hover-bg-dark-pink:hover { background-color: #d5008f; }\n.hover-bg-dark-pink:focus { background-color: #d5008f; }\n.hover-bg-hot-pink:hover { background-color: #ff41b4; }\n.hover-bg-hot-pink:focus { background-color: #ff41b4; }\n.hover-bg-pink:hover { background-color: #ff80cc; }\n.hover-bg-pink:focus { background-color: #ff80cc; }\n.hover-bg-light-pink:hover { background-color: #ffa3d7; }\n.hover-bg-light-pink:focus { background-color: #ffa3d7; }\n.hover-bg-dark-green:hover { background-color: #137752; }\n.hover-bg-dark-green:focus { background-color: #137752; }\n.hover-bg-green:hover { background-color: #19a974; }\n.hover-bg-green:focus { background-color: #19a974; }\n.hover-bg-light-green:hover { background-color: #9eebcf; }\n.hover-bg-light-green:focus { background-color: #9eebcf; }\n.hover-bg-navy:hover { background-color: #001b44; }\n.hover-bg-navy:focus { background-color: #001b44; }\n.hover-bg-dark-blue:hover { background-color: #00449e; }\n.hover-bg-dark-blue:focus { background-color: #00449e; }\n.hover-bg-blue:hover { background-color: #357edd; }\n.hover-bg-blue:focus { background-color: #357edd; }\n.hover-bg-light-blue:hover { background-color: #96ccff; }\n.hover-bg-light-blue:focus { background-color: #96ccff; }\n.hover-bg-lightest-blue:hover { background-color: #cdecff; }\n.hover-bg-lightest-blue:focus { background-color: #cdecff; }\n.hover-bg-washed-blue:hover { background-color: #f6fffe; }\n.hover-bg-washed-blue:focus { background-color: #f6fffe; }\n.hover-bg-washed-green:hover { background-color: #e8fdf5; }\n.hover-bg-washed-green:focus { background-color: #e8fdf5; }\n.hover-bg-washed-yellow:hover { background-color: #fffceb; }\n.hover-bg-washed-yellow:focus { background-color: #fffceb; }\n.hover-bg-washed-red:hover { background-color: #ffdfdf; }\n.hover-bg-washed-red:focus { background-color: #ffdfdf; }\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "/*\n\n Tachyons\n COLOR VARIABLES\n\n Grayscale\n - Solids\n - Transparencies\n Colors\n\n*/\n\n:root {\n --black: #000;\n --near-black: #111;\n --dark-gray:#333;\n --mid-gray:#555;\n --gray: #777;\n --silver: #999;\n --light-silver: #aaa;\n --moon-gray: #ccc;\n --light-gray: #eee;\n --near-white: #f4f4f4;\n --white: #fff;\n\n --transparent:transparent;\n\n --black-90: rgba(0,0,0,.9);\n --black-80: rgba(0,0,0,.8);\n --black-70: rgba(0,0,0,.7);\n --black-60: rgba(0,0,0,.6);\n --black-50: rgba(0,0,0,.5);\n --black-40: rgba(0,0,0,.4);\n --black-30: rgba(0,0,0,.3);\n --black-20: rgba(0,0,0,.2);\n --black-10: rgba(0,0,0,.1);\n --black-05: rgba(0,0,0,.05);\n --black-025: rgba(0,0,0,.025);\n --black-0125: rgba(0,0,0,.0125);\n\n --white-90: rgba(255,255,255,.9);\n --white-80: rgba(255,255,255,.8);\n --white-70: rgba(255,255,255,.7);\n --white-60: rgba(255,255,255,.6);\n --white-50: rgba(255,255,255,.5);\n --white-40: rgba(255,255,255,.4);\n --white-30: rgba(255,255,255,.3);\n --white-20: rgba(255,255,255,.2);\n --white-10: rgba(255,255,255,.1);\n --white-05: rgba(255,255,255,.05);\n --white-025: rgba(255,255,255,.025);\n --white-0125: rgba(255,255,255,.0125);\n\n --dark-red: #e7040f;\n --red: #ff4136;\n --light-red: #ff725c;\n --orange: #ff6300;\n --gold: #ffb700;\n --yellow: #ffd700;\n --light-yellow: #fbf1a9;\n --purple: #5e2ca5;\n --light-purple: #a463f2;\n --dark-pink: #d5008f;\n --hot-pink: #ff41b4;\n --pink: #ff80cc;\n --light-pink: #ffa3d7;\n --dark-green: #137752;\n --green: #19a974;\n --light-green: #9eebcf;\n --navy: #001b44;\n --dark-blue: #00449e;\n --blue: #357edd;\n --light-blue: #96ccff;\n --lightest-blue: #cdecff;\n --washed-blue: #f6fffe;\n --washed-green: #e8fdf5;\n --washed-yellow: #fffceb;\n --washed-red: #ffdfdf;\n\n}\n/* \n \n SKINS:PSEUDO\n\n Customize the color of an element when\n it is focused or hovered over.\n \n */\n\n.hover-black:hover, \n.hover-black:focus { color: var(--black); }\n.hover-near-black:hover, \n.hover-near-black:focus { color: var(--near-black); }\n.hover-dark-gray:hover, \n.hover-dark-gray:focus { color: var(--dark-gray); }\n.hover-mid-gray:hover, \n.hover-mid-gray:focus { color: var(--mid-gray); }\n.hover-gray:hover, \n.hover-gray:focus { color: var(--gray); }\n.hover-silver:hover, \n.hover-silver:focus { color: var(--silver); }\n.hover-light-silver:hover, \n.hover-light-silver:focus { color: var(--light-silver); }\n.hover-moon-gray:hover, \n.hover-moon-gray:focus { color: var(--moon-gray); }\n.hover-light-gray:hover, \n.hover-light-gray:focus { color: var(--light-gray); }\n.hover-near-white:hover, \n.hover-near-white:focus { color: var(--near-white); }\n.hover-white:hover, \n.hover-white:focus { color: var(--white); }\n\n.hover-bg-black:hover, \n.hover-bg-black:focus { background-color: var(--black); }\n.hover-bg-near-black:hover, \n.hover-bg-near-black:focus { background-color: var(--near-black); }\n.hover-bg-dark-gray:hover, \n.hover-bg-dark-gray:focus { background-color: var(--dark-gray); }\n.hover-bg-dark-gray:focus, \n.hover-bg-mid-gray:hover { background-color: var(--mid-gray); }\n.hover-bg-gray:hover, \n.hover-bg-gray:focus { background-color: var(--gray); }\n.hover-bg-silver:hover, \n.hover-bg-silver:focus { background-color: var(--silver); }\n.hover-bg-light-silver:hover, \n.hover-bg-light-silver:focus { background-color: var(--light-silver); }\n.hover-bg-moon-gray:hover, \n.hover-bg-moon-gray:focus { background-color: var(--moon-gray); }\n.hover-bg-light-gray:hover, \n.hover-bg-light-gray:focus { background-color: var(--light-gray); }\n.hover-bg-near-white:hover, \n.hover-bg-near-white:focus { background-color: var(--near-white); }\n.hover-bg-white:hover, \n.hover-bg-white:focus { background-color: var(--white); }\n.hover-bg-transparent:hover, \n.hover-bg-transparent:focus { background-color: var(--transparent); }\n\n.hover-dark-red:hover,\n.hover-dark-red:focus { color: var(--dark-red); }\n.hover-red:hover,\n.hover-red:focus { color: var(--red); }\n.hover-light-red:hover,\n.hover-light-red:focus { color: var(--light-red); }\n.hover-orange:hover,\n.hover-orange:focus { color: var(--orange); }\n.hover-gold:hover,\n.hover-gold:focus { color: var(--gold); }\n.hover-yellow:hover,\n.hover-yellow:focus { color: var(--yellow); }\n.hover-light-yellow:hover,\n.hover-light-yellow:focus { color: var(--light-yellow); }\n.hover-purple:hover,\n.hover-purple:focus { color: var(--purple); }\n.hover-light-purple:hover,\n.hover-light-purple:focus { color: var(--light-purple); }\n.hover-dark-pink:hover,\n.hover-dark-pink:focus { color: var(--dark-pink); }\n.hover-hot-pink:hover,\n.hover-hot-pink:focus { color: var(--hot-pink); }\n.hover-pink:hover,\n.hover-pink:focus { color: var(--pink); }\n.hover-light-pink:hover,\n.hover-light-pink:focus { color: var(--light-pink); }\n.hover-dark-green:hover,\n.hover-dark-green:focus { color: var(--dark-green); }\n.hover-green:hover,\n.hover-green:focus { color: var(--green); }\n.hover-light-green:hover,\n.hover-light-green:focus { color: var(--light-green); }\n.hover-navy:hover,\n.hover-navy:focus { color: var(--navy); }\n.hover-dark-blue:hover,\n.hover-dark-blue:focus { color: var(--dark-blue); }\n.hover-blue:hover,\n.hover-blue:focus { color: var(--blue); }\n.hover-light-blue:hover,\n.hover-light-blue:focus { color: var(--light-blue); }\n.hover-lightest-blue:hover,\n.hover-lightest-blue:focus { color: var(--lightest-blue); }\n.hover-washed-blue:hover,\n.hover-washed-blue:focus { color: var(--washed-blue); }\n.hover-washed-green:hover,\n.hover-washed-green:focus { color: var(--washed-green); }\n.hover-washed-yellow:hover,\n.hover-washed-yellow:focus { color: var(--washed-yellow); }\n.hover-washed-red:hover,\n.hover-washed-red:focus { color: var(--washed-red); }\n\n.hover-bg-dark-red:hover,\n.hover-bg-dark-red:focus { background-color: var(--dark-red); }\n.hover-bg-red:hover,\n.hover-bg-red:focus { background-color: var(--red); }\n.hover-bg-light-red:hover,\n.hover-bg-light-red:focus { background-color: var(--light-red); }\n.hover-bg-orange:hover,\n.hover-bg-orange:focus { background-color: var(--orange); }\n.hover-bg-gold:hover,\n.hover-bg-gold:focus { background-color: var(--gold); }\n.hover-bg-yellow:hover,\n.hover-bg-yellow:focus { background-color: var(--yellow); }\n.hover-bg-light-yellow:hover,\n.hover-bg-light-yellow:focus { background-color: var(--light-yellow); }\n.hover-bg-purple:hover,\n.hover-bg-purple:focus { background-color: var(--purple); }\n.hover-bg-light-purple:hover,\n.hover-bg-light-purple:focus { background-color: var(--light-purple); }\n.hover-bg-dark-pink:hover,\n.hover-bg-dark-pink:focus { background-color: var(--dark-pink); }\n.hover-bg-hot-pink:hover,\n.hover-bg-hot-pink:focus { background-color: var(--hot-pink); }\n.hover-bg-pink:hover,\n.hover-bg-pink:focus { background-color: var(--pink); }\n.hover-bg-light-pink:hover,\n.hover-bg-light-pink:focus { background-color: var(--light-pink); }\n.hover-bg-dark-green:hover,\n.hover-bg-dark-green:focus { background-color: var(--dark-green); }\n.hover-bg-green:hover,\n.hover-bg-green:focus { background-color: var(--green); }\n.hover-bg-light-green:hover,\n.hover-bg-light-green:focus { background-color: var(--light-green); }\n.hover-bg-navy:hover,\n.hover-bg-navy:focus { background-color: var(--navy); }\n.hover-bg-dark-blue:hover,\n.hover-bg-dark-blue:focus { background-color: var(--dark-blue); }\n.hover-bg-blue:hover,\n.hover-bg-blue:focus { background-color: var(--blue); }\n.hover-bg-light-blue:hover,\n.hover-bg-light-blue:focus { background-color: var(--light-blue); }\n.hover-bg-lightest-blue:hover,\n.hover-bg-lightest-blue:focus { background-color: var(--lightest-blue); }\n.hover-bg-washed-blue:hover,\n.hover-bg-washed-blue:focus { background-color: var(--washed-blue); }\n.hover-bg-washed-green:hover,\n.hover-bg-washed-green:focus { background-color: var(--washed-green); }\n.hover-bg-washed-yellow:hover,\n.hover-bg-washed-yellow:focus { background-color: var(--washed-yellow); }\n.hover-bg-washed-red:hover,\n.hover-bg-washed-red:focus { background-color: var(--washed-red); }\n\n", + "readme": "\n\n# SKINS:PSEUDO\n\nCustomize the color of an element when\nit is focused or hovered over.\n\n### Docs\n\nhttp://tachyons.io/docs/themes/skins-pseudo/\n ", + "src": "/*!!!\n\n# SKINS:PSEUDO\n\nCustomize the color of an element when\nit is focused or hovered over.\n\n### Docs\n\nhttp://tachyons.io/docs/themes/skins-pseudo/\n */\n\n.hover-black:hover,\n.hover-black:focus { color: var(--black); }\n.hover-white:hover,\n.hover-white:focus { color: var(--white); }\n\n.hover-black-90:hover,\n.hover-black-90:focus { color: var(--black-90); }\n.hover-black-80:hover,\n.hover-black-80:focus { color: var(--black-80); }\n.hover-black-70:hover,\n.hover-black-70:focus { color: var(--black-70); }\n.hover-black-60:hover,\n.hover-black-60:focus { color: var(--black-60); }\n.hover-black-50:hover,\n.hover-black-50:focus { color: var(--black-50); }\n.hover-black-40:hover,\n.hover-black-40:focus { color: var(--black-40); }\n.hover-black-30:hover,\n.hover-black-30:focus { color: var(--black-30); }\n.hover-black-20:hover,\n.hover-black-20:focus { color: var(--black-20); }\n.hover-black-10:hover,\n.hover-black-10:focus { color: var(--black-10); }\n.hover-white-90:hover,\n.hover-white-90:focus { color: var(--white-90); }\n.hover-white-80:hover,\n.hover-white-80:focus { color: var(--white-80); }\n.hover-white-70:hover,\n.hover-white-70:focus { color: var(--white-70); }\n.hover-white-60:hover,\n.hover-white-60:focus { color: var(--white-60); }\n.hover-white-50:hover,\n.hover-white-50:focus { color: var(--white-50); }\n.hover-white-40:hover,\n.hover-white-40:focus { color: var(--white-40); }\n.hover-white-30:hover,\n.hover-white-30:focus { color: var(--white-30); }\n.hover-white-20:hover,\n.hover-white-20:focus { color: var(--white-20); }\n.hover-white-10:hover,\n.hover-white-10:focus { color: var(--white-10); }\n.hover-inherit:hover,\n.hover-inherit:focus { color: inherit; }\n\n.hover-bg-black:hover,\n.hover-bg-black:focus { background-color: var(--black); }\n.hover-bg-white:hover,\n.hover-bg-white:focus { background-color: var(--white); }\n.hover-bg-transparent:hover,\n.hover-bg-transparent:focus { background-color: var(--transparent); }\n\n.hover-bg-black-90:hover,\n.hover-bg-black-90:focus { background-color: var(--black-90); }\n.hover-bg-black-80:hover,\n.hover-bg-black-80:focus { background-color: var(--black-80); }\n.hover-bg-black-70:hover,\n.hover-bg-black-70:focus { background-color: var(--black-70); }\n.hover-bg-black-60:hover,\n.hover-bg-black-60:focus { background-color: var(--black-60); }\n.hover-bg-black-50:hover,\n.hover-bg-black-50:focus { background-color: var(--black-50); }\n.hover-bg-black-40:hover,\n.hover-bg-black-40:focus { background-color: var(--black-40); }\n.hover-bg-black-30:hover,\n.hover-bg-black-30:focus { background-color: var(--black-30); }\n.hover-bg-black-20:hover,\n.hover-bg-black-20:focus { background-color: var(--black-20); }\n.hover-bg-black-10:hover,\n.hover-bg-black-10:focus { background-color: var(--black-10); }\n.hover-bg-white-90:hover,\n.hover-bg-white-90:focus { background-color: var(--white-90); }\n.hover-bg-white-80:hover,\n.hover-bg-white-80:focus { background-color: var(--white-80); }\n.hover-bg-white-70:hover,\n.hover-bg-white-70:focus { background-color: var(--white-70); }\n.hover-bg-white-60:hover,\n.hover-bg-white-60:focus { background-color: var(--white-60); }\n.hover-bg-white-50:hover,\n.hover-bg-white-50:focus { background-color: var(--white-50); }\n.hover-bg-white-40:hover,\n.hover-bg-white-40:focus { background-color: var(--white-40); }\n.hover-bg-white-30:hover,\n.hover-bg-white-30:focus { background-color: var(--white-30); }\n.hover-bg-white-20:hover,\n.hover-bg-white-20:focus { background-color: var(--white-20); }\n.hover-bg-white-10:hover,\n.hover-bg-white-10:focus { background-color: var(--white-10); }\n\n", "css": "/*\n\n Tachyons\n COLOR VARIABLES\n\n Grayscale\n - Solids\n - Transparencies\n Colors\n\n*/\n/* \n \n SKINS:PSEUDO\n\n Customize the color of an element when\n it is focused or hovered over.\n \n */\n.hover-black:hover { color: #000; }\n.hover-black:focus { color: #000; }\n.hover-near-black:hover { color: #111; }\n.hover-near-black:focus { color: #111; }\n.hover-dark-gray:hover { color: #333; }\n.hover-dark-gray:focus { color: #333; }\n.hover-mid-gray:hover { color: #555; }\n.hover-mid-gray:focus { color: #555; }\n.hover-gray:hover { color: #777; }\n.hover-gray:focus { color: #777; }\n.hover-silver:hover { color: #999; }\n.hover-silver:focus { color: #999; }\n.hover-light-silver:hover { color: #aaa; }\n.hover-light-silver:focus { color: #aaa; }\n.hover-moon-gray:hover { color: #ccc; }\n.hover-moon-gray:focus { color: #ccc; }\n.hover-light-gray:hover { color: #eee; }\n.hover-light-gray:focus { color: #eee; }\n.hover-near-white:hover { color: #f4f4f4; }\n.hover-near-white:focus { color: #f4f4f4; }\n.hover-white:hover { color: #fff; }\n.hover-white:focus { color: #fff; }\n.hover-bg-black:hover { background-color: #000; }\n.hover-bg-black:focus { background-color: #000; }\n.hover-bg-near-black:hover { background-color: #111; }\n.hover-bg-near-black:focus { background-color: #111; }\n.hover-bg-dark-gray:hover { background-color: #333; }\n.hover-bg-dark-gray:focus { background-color: #333; }\n.hover-bg-dark-gray:focus { background-color: #555; }\n.hover-bg-mid-gray:hover { background-color: #555; }\n.hover-bg-gray:hover { background-color: #777; }\n.hover-bg-gray:focus { background-color: #777; }\n.hover-bg-silver:hover { background-color: #999; }\n.hover-bg-silver:focus { background-color: #999; }\n.hover-bg-light-silver:hover { background-color: #aaa; }\n.hover-bg-light-silver:focus { background-color: #aaa; }\n.hover-bg-moon-gray:hover { background-color: #ccc; }\n.hover-bg-moon-gray:focus { background-color: #ccc; }\n.hover-bg-light-gray:hover { background-color: #eee; }\n.hover-bg-light-gray:focus { background-color: #eee; }\n.hover-bg-near-white:hover { background-color: #f4f4f4; }\n.hover-bg-near-white:focus { background-color: #f4f4f4; }\n.hover-bg-white:hover { background-color: #fff; }\n.hover-bg-white:focus { background-color: #fff; }\n.hover-bg-transparent:hover { background-color: transparent; }\n.hover-bg-transparent:focus { background-color: transparent; }\n.hover-dark-red:hover { color: #e7040f; }\n.hover-dark-red:focus { color: #e7040f; }\n.hover-red:hover { color: #ff4136; }\n.hover-red:focus { color: #ff4136; }\n.hover-light-red:hover { color: #ff725c; }\n.hover-light-red:focus { color: #ff725c; }\n.hover-orange:hover { color: #ff6300; }\n.hover-orange:focus { color: #ff6300; }\n.hover-gold:hover { color: #ffb700; }\n.hover-gold:focus { color: #ffb700; }\n.hover-yellow:hover { color: #ffd700; }\n.hover-yellow:focus { color: #ffd700; }\n.hover-light-yellow:hover { color: #fbf1a9; }\n.hover-light-yellow:focus { color: #fbf1a9; }\n.hover-purple:hover { color: #5e2ca5; }\n.hover-purple:focus { color: #5e2ca5; }\n.hover-light-purple:hover { color: #a463f2; }\n.hover-light-purple:focus { color: #a463f2; }\n.hover-dark-pink:hover { color: #d5008f; }\n.hover-dark-pink:focus { color: #d5008f; }\n.hover-hot-pink:hover { color: #ff41b4; }\n.hover-hot-pink:focus { color: #ff41b4; }\n.hover-pink:hover { color: #ff80cc; }\n.hover-pink:focus { color: #ff80cc; }\n.hover-light-pink:hover { color: #ffa3d7; }\n.hover-light-pink:focus { color: #ffa3d7; }\n.hover-dark-green:hover { color: #137752; }\n.hover-dark-green:focus { color: #137752; }\n.hover-green:hover { color: #19a974; }\n.hover-green:focus { color: #19a974; }\n.hover-light-green:hover { color: #9eebcf; }\n.hover-light-green:focus { color: #9eebcf; }\n.hover-navy:hover { color: #001b44; }\n.hover-navy:focus { color: #001b44; }\n.hover-dark-blue:hover { color: #00449e; }\n.hover-dark-blue:focus { color: #00449e; }\n.hover-blue:hover { color: #357edd; }\n.hover-blue:focus { color: #357edd; }\n.hover-light-blue:hover { color: #96ccff; }\n.hover-light-blue:focus { color: #96ccff; }\n.hover-lightest-blue:hover { color: #cdecff; }\n.hover-lightest-blue:focus { color: #cdecff; }\n.hover-washed-blue:hover { color: #f6fffe; }\n.hover-washed-blue:focus { color: #f6fffe; }\n.hover-washed-green:hover { color: #e8fdf5; }\n.hover-washed-green:focus { color: #e8fdf5; }\n.hover-washed-yellow:hover { color: #fffceb; }\n.hover-washed-yellow:focus { color: #fffceb; }\n.hover-washed-red:hover { color: #ffdfdf; }\n.hover-washed-red:focus { color: #ffdfdf; }\n.hover-bg-dark-red:hover { background-color: #e7040f; }\n.hover-bg-dark-red:focus { background-color: #e7040f; }\n.hover-bg-red:hover { background-color: #ff4136; }\n.hover-bg-red:focus { background-color: #ff4136; }\n.hover-bg-light-red:hover { background-color: #ff725c; }\n.hover-bg-light-red:focus { background-color: #ff725c; }\n.hover-bg-orange:hover { background-color: #ff6300; }\n.hover-bg-orange:focus { background-color: #ff6300; }\n.hover-bg-gold:hover { background-color: #ffb700; }\n.hover-bg-gold:focus { background-color: #ffb700; }\n.hover-bg-yellow:hover { background-color: #ffd700; }\n.hover-bg-yellow:focus { background-color: #ffd700; }\n.hover-bg-light-yellow:hover { background-color: #fbf1a9; }\n.hover-bg-light-yellow:focus { background-color: #fbf1a9; }\n.hover-bg-purple:hover { background-color: #5e2ca5; }\n.hover-bg-purple:focus { background-color: #5e2ca5; }\n.hover-bg-light-purple:hover { background-color: #a463f2; }\n.hover-bg-light-purple:focus { background-color: #a463f2; }\n.hover-bg-dark-pink:hover { background-color: #d5008f; }\n.hover-bg-dark-pink:focus { background-color: #d5008f; }\n.hover-bg-hot-pink:hover { background-color: #ff41b4; }\n.hover-bg-hot-pink:focus { background-color: #ff41b4; }\n.hover-bg-pink:hover { background-color: #ff80cc; }\n.hover-bg-pink:focus { background-color: #ff80cc; }\n.hover-bg-light-pink:hover { background-color: #ffa3d7; }\n.hover-bg-light-pink:focus { background-color: #ffa3d7; }\n.hover-bg-dark-green:hover { background-color: #137752; }\n.hover-bg-dark-green:focus { background-color: #137752; }\n.hover-bg-green:hover { background-color: #19a974; }\n.hover-bg-green:focus { background-color: #19a974; }\n.hover-bg-light-green:hover { background-color: #9eebcf; }\n.hover-bg-light-green:focus { background-color: #9eebcf; }\n.hover-bg-navy:hover { background-color: #001b44; }\n.hover-bg-navy:focus { background-color: #001b44; }\n.hover-bg-dark-blue:hover { background-color: #00449e; }\n.hover-bg-dark-blue:focus { background-color: #00449e; }\n.hover-bg-blue:hover { background-color: #357edd; }\n.hover-bg-blue:focus { background-color: #357edd; }\n.hover-bg-light-blue:hover { background-color: #96ccff; }\n.hover-bg-light-blue:focus { background-color: #96ccff; }\n.hover-bg-lightest-blue:hover { background-color: #cdecff; }\n.hover-bg-lightest-blue:focus { background-color: #cdecff; }\n.hover-bg-washed-blue:hover { background-color: #f6fffe; }\n.hover-bg-washed-blue:focus { background-color: #f6fffe; }\n.hover-bg-washed-green:hover { background-color: #e8fdf5; }\n.hover-bg-washed-green:focus { background-color: #e8fdf5; }\n.hover-bg-washed-yellow:hover { background-color: #fffceb; }\n.hover-bg-washed-yellow:focus { background-color: #fffceb; }\n.hover-bg-washed-red:hover { background-color: #ffdfdf; }\n.hover-bg-washed-red:focus { background-color: #ffdfdf; }\n\n" }, "tachyons-spacing": { @@ -14523,8 +14523,8 @@ ] } ], - "readme": "# tachyons-spacing 6.0.0\n\nPerformance based css module.\n\n#### Stats\n\n2273 | 448 | 576\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-spacing\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-spacing\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-spacing.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-spacing\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\n/* Variables */\n/* Spacing Scale - based on a ratio of 1:2 */\n/* Media Queries */\n/*\n SPACING\n\n An eight step powers of two scale ranging from 0 to 16rem.\n Namespaces are composable and thus highly grockable - check the legend below\n\n Legend:\n\n p = padding\n m = margin\n\n a = all\n h = horizontal\n v = vertical\n t = top\n r = right\n b = bottom\n l = left\n\n 0 = none\n 1 = 1st step in spacing scale\n 2 = 2nd step in spacing scale\n 3 = 3rd step in spacing scale\n 4 = 4th step in spacing scale\n 5 = 5th step in spacing scale\n 6 = 6th step in spacing scale\n 7 = 7th step in spacing scale\n\n*/\n.pa0 { padding: 0; }\n.pa1 { padding: .25rem; }\n.pa2 { padding: .5rem; }\n.pa3 { padding: 1rem; }\n.pa4 { padding: 2rem; }\n.pa5 { padding: 4rem; }\n.pa6 { padding: 8rem; }\n.pa7 { padding: 16rem; }\n.pl0 { padding-left: 0; }\n.pl1 { padding-left: .25rem; }\n.pl2 { padding-left: .5rem; }\n.pl3 { padding-left: 1rem; }\n.pl4 { padding-left: 2rem; }\n.pl5 { padding-left: 4rem; }\n.pl6 { padding-left: 8rem; }\n.pl7 { padding-left: 16rem; }\n.pr0 { padding-right: 0; }\n.pr1 { padding-right: .25rem; }\n.pr2 { padding-right: .5rem; }\n.pr3 { padding-right: 1rem; }\n.pr4 { padding-right: 2rem; }\n.pr5 { padding-right: 4rem; }\n.pr6 { padding-right: 8rem; }\n.pr7 { padding-right: 16rem; }\n.pb0 { padding-bottom: 0; }\n.pb1 { padding-bottom: .25rem; }\n.pb2 { padding-bottom: .5rem; }\n.pb3 { padding-bottom: 1rem; }\n.pb4 { padding-bottom: 2rem; }\n.pb5 { padding-bottom: 4rem; }\n.pb6 { padding-bottom: 8rem; }\n.pb7 { padding-bottom: 16rem; }\n.pt0 { padding-top: 0; }\n.pt1 { padding-top: .25rem; }\n.pt2 { padding-top: .5rem; }\n.pt3 { padding-top: 1rem; }\n.pt4 { padding-top: 2rem; }\n.pt5 { padding-top: 4rem; }\n.pt6 { padding-top: 8rem; }\n.pt7 { padding-top: 16rem; }\n.pv0 { padding-top: 0; padding-bottom: 0; }\n.pv1 { padding-top: .25rem; padding-bottom: .25rem; }\n.pv2 { padding-top: .5rem; padding-bottom: .5rem; }\n.pv3 { padding-top: 1rem; padding-bottom: 1rem; }\n.pv4 { padding-top: 2rem; padding-bottom: 2rem; }\n.pv5 { padding-top: 4rem; padding-bottom: 4rem; }\n.pv6 { padding-top: 8rem; padding-bottom: 8rem; }\n.pv7 { padding-top: 16rem; padding-bottom: 16rem; }\n.ph0 { padding-left: 0; padding-right: 0; }\n.ph1 { padding-left: .25rem; padding-right: .25rem; }\n.ph2 { padding-left: .5rem; padding-right: .5rem; }\n.ph3 { padding-left: 1rem; padding-right: 1rem; }\n.ph4 { padding-left: 2rem; padding-right: 2rem; }\n.ph5 { padding-left: 4rem; padding-right: 4rem; }\n.ph6 { padding-left: 8rem; padding-right: 8rem; }\n.ph7 { padding-left: 16rem; padding-right: 16rem; }\n.ma0 { margin: 0; }\n.ma1 { margin: .25rem; }\n.ma2 { margin: .5rem; }\n.ma3 { margin: 1rem; }\n.ma4 { margin: 2rem; }\n.ma5 { margin: 4rem; }\n.ma6 { margin: 8rem; }\n.ma7 { margin: 16rem; }\n.ml0 { margin-left: 0; }\n.ml1 { margin-left: .25rem; }\n.ml2 { margin-left: .5rem; }\n.ml3 { margin-left: 1rem; }\n.ml4 { margin-left: 2rem; }\n.ml5 { margin-left: 4rem; }\n.ml6 { margin-left: 8rem; }\n.ml7 { margin-left: 16rem; }\n.mr0 { margin-right: 0; }\n.mr1 { margin-right: .25rem; }\n.mr2 { margin-right: .5rem; }\n.mr3 { margin-right: 1rem; }\n.mr4 { margin-right: 2rem; }\n.mr5 { margin-right: 4rem; }\n.mr6 { margin-right: 8rem; }\n.mr7 { margin-right: 16rem; }\n.mb0 { margin-bottom: 0; }\n.mb1 { margin-bottom: .25rem; }\n.mb2 { margin-bottom: .5rem; }\n.mb3 { margin-bottom: 1rem; }\n.mb4 { margin-bottom: 2rem; }\n.mb5 { margin-bottom: 4rem; }\n.mb6 { margin-bottom: 8rem; }\n.mb7 { margin-bottom: 16rem; }\n.mt0 { margin-top: 0; }\n.mt1 { margin-top: .25rem; }\n.mt2 { margin-top: .5rem; }\n.mt3 { margin-top: 1rem; }\n.mt4 { margin-top: 2rem; }\n.mt5 { margin-top: 4rem; }\n.mt6 { margin-top: 8rem; }\n.mt7 { margin-top: 16rem; }\n.mv0 { margin-top: 0; margin-bottom: 0; }\n.mv1 { margin-top: .25rem; margin-bottom: .25rem; }\n.mv2 { margin-top: .5rem; margin-bottom: .5rem; }\n.mv3 { margin-top: 1rem; margin-bottom: 1rem; }\n.mv4 { margin-top: 2rem; margin-bottom: 2rem; }\n.mv5 { margin-top: 4rem; margin-bottom: 4rem; }\n.mv6 { margin-top: 8rem; margin-bottom: 8rem; }\n.mv7 { margin-top: 16rem; margin-bottom: 16rem; }\n.mh0 { margin-left: 0; margin-right: 0; }\n.mh1 { margin-left: .25rem; margin-right: .25rem; }\n.mh2 { margin-left: .5rem; margin-right: .5rem; }\n.mh3 { margin-left: 1rem; margin-right: 1rem; }\n.mh4 { margin-left: 2rem; margin-right: 2rem; }\n.mh5 { margin-left: 4rem; margin-right: 4rem; }\n.mh6 { margin-left: 8rem; margin-right: 8rem; }\n.mh7 { margin-left: 16rem; margin-right: 16rem; }\n@media screen and (min-width: 30em) {\n .pa0-ns { padding: 0; }\n .pa1-ns { padding: .25rem; }\n .pa2-ns { padding: .5rem; }\n .pa3-ns { padding: 1rem; }\n .pa4-ns { padding: 2rem; }\n .pa5-ns { padding: 4rem; }\n .pa6-ns { padding: 8rem; }\n .pa7-ns { padding: 16rem; }\n .pl0-ns { padding-left: 0; }\n .pl1-ns { padding-left: .25rem; }\n .pl2-ns { padding-left: .5rem; }\n .pl3-ns { padding-left: 1rem; }\n .pl4-ns { padding-left: 2rem; }\n .pl5-ns { padding-left: 4rem; }\n .pl6-ns { padding-left: 8rem; }\n .pl7-ns { padding-left: 16rem; }\n .pr0-ns { padding-right: 0; }\n .pr1-ns { padding-right: .25rem; }\n .pr2-ns { padding-right: .5rem; }\n .pr3-ns { padding-right: 1rem; }\n .pr4-ns { padding-right: 2rem; }\n .pr5-ns { padding-right: 4rem; }\n .pr6-ns { padding-right: 8rem; }\n .pr7-ns { padding-right: 16rem; }\n .pb0-ns { padding-bottom: 0; }\n .pb1-ns { padding-bottom: .25rem; }\n .pb2-ns { padding-bottom: .5rem; }\n .pb3-ns { padding-bottom: 1rem; }\n .pb4-ns { padding-bottom: 2rem; }\n .pb5-ns { padding-bottom: 4rem; }\n .pb6-ns { padding-bottom: 8rem; }\n .pb7-ns { padding-bottom: 16rem; }\n .pt0-ns { padding-top: 0; }\n .pt1-ns { padding-top: .25rem; }\n .pt2-ns { padding-top: .5rem; }\n .pt3-ns { padding-top: 1rem; }\n .pt4-ns { padding-top: 2rem; }\n .pt5-ns { padding-top: 4rem; }\n .pt6-ns { padding-top: 8rem; }\n .pt7-ns { padding-top: 16rem; }\n .pv0-ns { padding-top: 0; padding-bottom: 0; }\n .pv1-ns { padding-top: .25rem; padding-bottom: .25rem; }\n .pv2-ns { padding-top: .5rem; padding-bottom: .5rem; }\n .pv3-ns { padding-top: 1rem; padding-bottom: 1rem; }\n .pv4-ns { padding-top: 2rem; padding-bottom: 2rem; }\n .pv5-ns { padding-top: 4rem; padding-bottom: 4rem; }\n .pv6-ns { padding-top: 8rem; padding-bottom: 8rem; }\n .pv7-ns { padding-top: 16rem; padding-bottom: 16rem; }\n .ph0-ns { padding-left: 0; padding-right: 0; }\n .ph1-ns { padding-left: .25rem; padding-right: .25rem; }\n .ph2-ns { padding-left: .5rem; padding-right: .5rem; }\n .ph3-ns { padding-left: 1rem; padding-right: 1rem; }\n .ph4-ns { padding-left: 2rem; padding-right: 2rem; }\n .ph5-ns { padding-left: 4rem; padding-right: 4rem; }\n .ph6-ns { padding-left: 8rem; padding-right: 8rem; }\n .ph7-ns { padding-left: 16rem; padding-right: 16rem; }\n .ma0-ns { margin: 0; }\n .ma1-ns { margin: .25rem; }\n .ma2-ns { margin: .5rem; }\n .ma3-ns { margin: 1rem; }\n .ma4-ns { margin: 2rem; }\n .ma5-ns { margin: 4rem; }\n .ma6-ns { margin: 8rem; }\n .ma7-ns { margin: 16rem; }\n .ml0-ns { margin-left: 0; }\n .ml1-ns { margin-left: .25rem; }\n .ml2-ns { margin-left: .5rem; }\n .ml3-ns { margin-left: 1rem; }\n .ml4-ns { margin-left: 2rem; }\n .ml5-ns { margin-left: 4rem; }\n .ml6-ns { margin-left: 8rem; }\n .ml7-ns { margin-left: 16rem; }\n .mr0-ns { margin-right: 0; }\n .mr1-ns { margin-right: .25rem; }\n .mr2-ns { margin-right: .5rem; }\n .mr3-ns { margin-right: 1rem; }\n .mr4-ns { margin-right: 2rem; }\n .mr5-ns { margin-right: 4rem; }\n .mr6-ns { margin-right: 8rem; }\n .mr7-ns { margin-right: 16rem; }\n .mb0-ns { margin-bottom: 0; }\n .mb1-ns { margin-bottom: .25rem; }\n .mb2-ns { margin-bottom: .5rem; }\n .mb3-ns { margin-bottom: 1rem; }\n .mb4-ns { margin-bottom: 2rem; }\n .mb5-ns { margin-bottom: 4rem; }\n .mb6-ns { margin-bottom: 8rem; }\n .mb7-ns { margin-bottom: 16rem; }\n .mt0-ns { margin-top: 0; }\n .mt1-ns { margin-top: .25rem; }\n .mt2-ns { margin-top: .5rem; }\n .mt3-ns { margin-top: 1rem; }\n .mt4-ns { margin-top: 2rem; }\n .mt5-ns { margin-top: 4rem; }\n .mt6-ns { margin-top: 8rem; }\n .mt7-ns { margin-top: 16rem; }\n .mv0-ns { margin-top: 0; margin-bottom: 0; }\n .mv1-ns { margin-top: .25rem; margin-bottom: .25rem; }\n .mv2-ns { margin-top: .5rem; margin-bottom: .5rem; }\n .mv3-ns { margin-top: 1rem; margin-bottom: 1rem; }\n .mv4-ns { margin-top: 2rem; margin-bottom: 2rem; }\n .mv5-ns { margin-top: 4rem; margin-bottom: 4rem; }\n .mv6-ns { margin-top: 8rem; margin-bottom: 8rem; }\n .mv7-ns { margin-top: 16rem; margin-bottom: 16rem; }\n .mh0-ns { margin-left: 0; margin-right: 0; }\n .mh1-ns { margin-left: .25rem; margin-right: .25rem; }\n .mh2-ns { margin-left: .5rem; margin-right: .5rem; }\n .mh3-ns { margin-left: 1rem; margin-right: 1rem; }\n .mh4-ns { margin-left: 2rem; margin-right: 2rem; }\n .mh5-ns { margin-left: 4rem; margin-right: 4rem; }\n .mh6-ns { margin-left: 8rem; margin-right: 8rem; }\n .mh7-ns { margin-left: 16rem; margin-right: 16rem; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .pa0-m { padding: 0; }\n .pa1-m { padding: .25rem; }\n .pa2-m { padding: .5rem; }\n .pa3-m { padding: 1rem; }\n .pa4-m { padding: 2rem; }\n .pa5-m { padding: 4rem; }\n .pa6-m { padding: 8rem; }\n .pa7-m { padding: 16rem; }\n .pl0-m { padding-left: 0; }\n .pl1-m { padding-left: .25rem; }\n .pl2-m { padding-left: .5rem; }\n .pl3-m { padding-left: 1rem; }\n .pl4-m { padding-left: 2rem; }\n .pl5-m { padding-left: 4rem; }\n .pl6-m { padding-left: 8rem; }\n .pl7-m { padding-left: 16rem; }\n .pr0-m { padding-right: 0; }\n .pr1-m { padding-right: .25rem; }\n .pr2-m { padding-right: .5rem; }\n .pr3-m { padding-right: 1rem; }\n .pr4-m { padding-right: 2rem; }\n .pr5-m { padding-right: 4rem; }\n .pr6-m { padding-right: 8rem; }\n .pr7-m { padding-right: 16rem; }\n .pb0-m { padding-bottom: 0; }\n .pb1-m { padding-bottom: .25rem; }\n .pb2-m { padding-bottom: .5rem; }\n .pb3-m { padding-bottom: 1rem; }\n .pb4-m { padding-bottom: 2rem; }\n .pb5-m { padding-bottom: 4rem; }\n .pb6-m { padding-bottom: 8rem; }\n .pb7-m { padding-bottom: 16rem; }\n .pt0-m { padding-top: 0; }\n .pt1-m { padding-top: .25rem; }\n .pt2-m { padding-top: .5rem; }\n .pt3-m { padding-top: 1rem; }\n .pt4-m { padding-top: 2rem; }\n .pt5-m { padding-top: 4rem; }\n .pt6-m { padding-top: 8rem; }\n .pt7-m { padding-top: 16rem; }\n .pv0-m { padding-top: 0; padding-bottom: 0; }\n .pv1-m { padding-top: .25rem; padding-bottom: .25rem; }\n .pv2-m { padding-top: .5rem; padding-bottom: .5rem; }\n .pv3-m { padding-top: 1rem; padding-bottom: 1rem; }\n .pv4-m { padding-top: 2rem; padding-bottom: 2rem; }\n .pv5-m { padding-top: 4rem; padding-bottom: 4rem; }\n .pv6-m { padding-top: 8rem; padding-bottom: 8rem; }\n .pv7-m { padding-top: 16rem; padding-bottom: 16rem; }\n .ph0-m { padding-left: 0; padding-right: 0; }\n .ph1-m { padding-left: .25rem; padding-right: .25rem; }\n .ph2-m { padding-left: .5rem; padding-right: .5rem; }\n .ph3-m { padding-left: 1rem; padding-right: 1rem; }\n .ph4-m { padding-left: 2rem; padding-right: 2rem; }\n .ph5-m { padding-left: 4rem; padding-right: 4rem; }\n .ph6-m { padding-left: 8rem; padding-right: 8rem; }\n .ph7-m { padding-left: 16rem; padding-right: 16rem; }\n .ma0-m { margin: 0; }\n .ma1-m { margin: .25rem; }\n .ma2-m { margin: .5rem; }\n .ma3-m { margin: 1rem; }\n .ma4-m { margin: 2rem; }\n .ma5-m { margin: 4rem; }\n .ma6-m { margin: 8rem; }\n .ma7-m { margin: 16rem; }\n .ml0-m { margin-left: 0; }\n .ml1-m { margin-left: .25rem; }\n .ml2-m { margin-left: .5rem; }\n .ml3-m { margin-left: 1rem; }\n .ml4-m { margin-left: 2rem; }\n .ml5-m { margin-left: 4rem; }\n .ml6-m { margin-left: 8rem; }\n .ml7-m { margin-left: 16rem; }\n .mr0-m { margin-right: 0; }\n .mr1-m { margin-right: .25rem; }\n .mr2-m { margin-right: .5rem; }\n .mr3-m { margin-right: 1rem; }\n .mr4-m { margin-right: 2rem; }\n .mr5-m { margin-right: 4rem; }\n .mr6-m { margin-right: 8rem; }\n .mr7-m { margin-right: 16rem; }\n .mb0-m { margin-bottom: 0; }\n .mb1-m { margin-bottom: .25rem; }\n .mb2-m { margin-bottom: .5rem; }\n .mb3-m { margin-bottom: 1rem; }\n .mb4-m { margin-bottom: 2rem; }\n .mb5-m { margin-bottom: 4rem; }\n .mb6-m { margin-bottom: 8rem; }\n .mb7-m { margin-bottom: 16rem; }\n .mt0-m { margin-top: 0; }\n .mt1-m { margin-top: .25rem; }\n .mt2-m { margin-top: .5rem; }\n .mt3-m { margin-top: 1rem; }\n .mt4-m { margin-top: 2rem; }\n .mt5-m { margin-top: 4rem; }\n .mt6-m { margin-top: 8rem; }\n .mt7-m { margin-top: 16rem; }\n .mv0-m { margin-top: 0; margin-bottom: 0; }\n .mv1-m { margin-top: .25rem; margin-bottom: .25rem; }\n .mv2-m { margin-top: .5rem; margin-bottom: .5rem; }\n .mv3-m { margin-top: 1rem; margin-bottom: 1rem; }\n .mv4-m { margin-top: 2rem; margin-bottom: 2rem; }\n .mv5-m { margin-top: 4rem; margin-bottom: 4rem; }\n .mv6-m { margin-top: 8rem; margin-bottom: 8rem; }\n .mv7-m { margin-top: 16rem; margin-bottom: 16rem; }\n .mh0-m { margin-left: 0; margin-right: 0; }\n .mh1-m { margin-left: .25rem; margin-right: .25rem; }\n .mh2-m { margin-left: .5rem; margin-right: .5rem; }\n .mh3-m { margin-left: 1rem; margin-right: 1rem; }\n .mh4-m { margin-left: 2rem; margin-right: 2rem; }\n .mh5-m { margin-left: 4rem; margin-right: 4rem; }\n .mh6-m { margin-left: 8rem; margin-right: 8rem; }\n .mh7-m { margin-left: 16rem; margin-right: 16rem; }\n}\n@media screen and (min-width: 60em) {\n .pa0-l { padding: 0; }\n .pa1-l { padding: .25rem; }\n .pa2-l { padding: .5rem; }\n .pa3-l { padding: 1rem; }\n .pa4-l { padding: 2rem; }\n .pa5-l { padding: 4rem; }\n .pa6-l { padding: 8rem; }\n .pa7-l { padding: 16rem; }\n .pl0-l { padding-left: 0; }\n .pl1-l { padding-left: .25rem; }\n .pl2-l { padding-left: .5rem; }\n .pl3-l { padding-left: 1rem; }\n .pl4-l { padding-left: 2rem; }\n .pl5-l { padding-left: 4rem; }\n .pl6-l { padding-left: 8rem; }\n .pl7-l { padding-left: 16rem; }\n .pr0-l { padding-right: 0; }\n .pr1-l { padding-right: .25rem; }\n .pr2-l { padding-right: .5rem; }\n .pr3-l { padding-right: 1rem; }\n .pr4-l { padding-right: 2rem; }\n .pr5-l { padding-right: 4rem; }\n .pr6-l { padding-right: 8rem; }\n .pr7-l { padding-right: 16rem; }\n .pb0-l { padding-bottom: 0; }\n .pb1-l { padding-bottom: .25rem; }\n .pb2-l { padding-bottom: .5rem; }\n .pb3-l { padding-bottom: 1rem; }\n .pb4-l { padding-bottom: 2rem; }\n .pb5-l { padding-bottom: 4rem; }\n .pb6-l { padding-bottom: 8rem; }\n .pb7-l { padding-bottom: 16rem; }\n .pt0-l { padding-top: 0; }\n .pt1-l { padding-top: .25rem; }\n .pt2-l { padding-top: .5rem; }\n .pt3-l { padding-top: 1rem; }\n .pt4-l { padding-top: 2rem; }\n .pt5-l { padding-top: 4rem; }\n .pt6-l { padding-top: 8rem; }\n .pt7-l { padding-top: 16rem; }\n .pv0-l { padding-top: 0; padding-bottom: 0; }\n .pv1-l { padding-top: .25rem; padding-bottom: .25rem; }\n .pv2-l { padding-top: .5rem; padding-bottom: .5rem; }\n .pv3-l { padding-top: 1rem; padding-bottom: 1rem; }\n .pv4-l { padding-top: 2rem; padding-bottom: 2rem; }\n .pv5-l { padding-top: 4rem; padding-bottom: 4rem; }\n .pv6-l { padding-top: 8rem; padding-bottom: 8rem; }\n .pv7-l { padding-top: 16rem; padding-bottom: 16rem; }\n .ph0-l { padding-left: 0; padding-right: 0; }\n .ph1-l { padding-left: .25rem; padding-right: .25rem; }\n .ph2-l { padding-left: .5rem; padding-right: .5rem; }\n .ph3-l { padding-left: 1rem; padding-right: 1rem; }\n .ph4-l { padding-left: 2rem; padding-right: 2rem; }\n .ph5-l { padding-left: 4rem; padding-right: 4rem; }\n .ph6-l { padding-left: 8rem; padding-right: 8rem; }\n .ph7-l { padding-left: 16rem; padding-right: 16rem; }\n .ma0-l { margin: 0; }\n .ma1-l { margin: .25rem; }\n .ma2-l { margin: .5rem; }\n .ma3-l { margin: 1rem; }\n .ma4-l { margin: 2rem; }\n .ma5-l { margin: 4rem; }\n .ma6-l { margin: 8rem; }\n .ma7-l { margin: 16rem; }\n .ml0-l { margin-left: 0; }\n .ml1-l { margin-left: .25rem; }\n .ml2-l { margin-left: .5rem; }\n .ml3-l { margin-left: 1rem; }\n .ml4-l { margin-left: 2rem; }\n .ml5-l { margin-left: 4rem; }\n .ml6-l { margin-left: 8rem; }\n .ml7-l { margin-left: 16rem; }\n .mr0-l { margin-right: 0; }\n .mr1-l { margin-right: .25rem; }\n .mr2-l { margin-right: .5rem; }\n .mr3-l { margin-right: 1rem; }\n .mr4-l { margin-right: 2rem; }\n .mr5-l { margin-right: 4rem; }\n .mr6-l { margin-right: 8rem; }\n .mr7-l { margin-right: 16rem; }\n .mb0-l { margin-bottom: 0; }\n .mb1-l { margin-bottom: .25rem; }\n .mb2-l { margin-bottom: .5rem; }\n .mb3-l { margin-bottom: 1rem; }\n .mb4-l { margin-bottom: 2rem; }\n .mb5-l { margin-bottom: 4rem; }\n .mb6-l { margin-bottom: 8rem; }\n .mb7-l { margin-bottom: 16rem; }\n .mt0-l { margin-top: 0; }\n .mt1-l { margin-top: .25rem; }\n .mt2-l { margin-top: .5rem; }\n .mt3-l { margin-top: 1rem; }\n .mt4-l { margin-top: 2rem; }\n .mt5-l { margin-top: 4rem; }\n .mt6-l { margin-top: 8rem; }\n .mt7-l { margin-top: 16rem; }\n .mv0-l { margin-top: 0; margin-bottom: 0; }\n .mv1-l { margin-top: .25rem; margin-bottom: .25rem; }\n .mv2-l { margin-top: .5rem; margin-bottom: .5rem; }\n .mv3-l { margin-top: 1rem; margin-bottom: 1rem; }\n .mv4-l { margin-top: 2rem; margin-bottom: 2rem; }\n .mv5-l { margin-top: 4rem; margin-bottom: 4rem; }\n .mv6-l { margin-top: 8rem; margin-bottom: 8rem; }\n .mv7-l { margin-top: 16rem; margin-bottom: 16rem; }\n .mh0-l { margin-left: 0; margin-right: 0; }\n .mh1-l { margin-left: .25rem; margin-right: .25rem; }\n .mh2-l { margin-left: .5rem; margin-right: .5rem; }\n .mh3-l { margin-left: 1rem; margin-right: 1rem; }\n .mh4-l { margin-left: 2rem; margin-right: 2rem; }\n .mh5-l { margin-left: 4rem; margin-right: 4rem; }\n .mh6-l { margin-left: 8rem; margin-right: 8rem; }\n .mh7-l { margin-left: 16rem; margin-right: 16rem; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "/* Variables */\n\n/* Spacing Scale - based on a ratio of 1:2 */\n:root {\n --spacing-none: 0;\n --spacing-extra-small: .25rem;\n --spacing-small: .5rem;\n --spacing-medium: 1rem;\n --spacing-large: 2rem;\n --spacing-extra-large: 4rem;\n --spacing-extra-extra-large: 8rem;\n --spacing-extra-extra-extra-large: 16rem;\n}\n\n/* Media Queries */\n\n@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n SPACING\n\n An eight step powers of two scale ranging from 0 to 16rem.\n Namespaces are composable and thus highly grockable - check the legend below\n\n Legend:\n\n p = padding\n m = margin\n\n a = all\n h = horizontal\n v = vertical\n t = top\n r = right\n b = bottom\n l = left\n\n 0 = none\n 1 = 1st step in spacing scale\n 2 = 2nd step in spacing scale\n 3 = 3rd step in spacing scale\n 4 = 4th step in spacing scale\n 5 = 5th step in spacing scale\n 6 = 6th step in spacing scale\n 7 = 7th step in spacing scale\n\n*/\n\n\n.pa0 { padding: var(--spacing-none); }\n.pa1 { padding: var(--spacing-extra-small); }\n.pa2 { padding: var(--spacing-small); }\n.pa3 { padding: var(--spacing-medium); }\n.pa4 { padding: var(--spacing-large); }\n.pa5 { padding: var(--spacing-extra-large); }\n.pa6 { padding: var(--spacing-extra-extra-large); }\n.pa7 { padding: var(--spacing-extra-extra-extra-large); }\n\n.pl0 { padding-left: var(--spacing-none); }\n.pl1 { padding-left: var(--spacing-extra-small); }\n.pl2 { padding-left: var(--spacing-small); }\n.pl3 { padding-left: var(--spacing-medium); }\n.pl4 { padding-left: var(--spacing-large); }\n.pl5 { padding-left: var(--spacing-extra-large); }\n.pl6 { padding-left: var(--spacing-extra-extra-large); }\n.pl7 { padding-left: var(--spacing-extra-extra-extra-large); }\n\n.pr0 { padding-right: var(--spacing-none); }\n.pr1 { padding-right: var(--spacing-extra-small); }\n.pr2 { padding-right: var(--spacing-small); }\n.pr3 { padding-right: var(--spacing-medium); }\n.pr4 { padding-right: var(--spacing-large); }\n.pr5 { padding-right: var(--spacing-extra-large); }\n.pr6 { padding-right: var(--spacing-extra-extra-large); }\n.pr7 { padding-right: var(--spacing-extra-extra-extra-large); }\n\n.pb0 { padding-bottom: var(--spacing-none); }\n.pb1 { padding-bottom: var(--spacing-extra-small); }\n.pb2 { padding-bottom: var(--spacing-small); }\n.pb3 { padding-bottom: var(--spacing-medium); }\n.pb4 { padding-bottom: var(--spacing-large); }\n.pb5 { padding-bottom: var(--spacing-extra-large); }\n.pb6 { padding-bottom: var(--spacing-extra-extra-large); }\n.pb7 { padding-bottom: var(--spacing-extra-extra-extra-large); }\n\n.pt0 { padding-top: var(--spacing-none); }\n.pt1 { padding-top: var(--spacing-extra-small); }\n.pt2 { padding-top: var(--spacing-small); }\n.pt3 { padding-top: var(--spacing-medium); }\n.pt4 { padding-top: var(--spacing-large); }\n.pt5 { padding-top: var(--spacing-extra-large); }\n.pt6 { padding-top: var(--spacing-extra-extra-large); }\n.pt7 { padding-top: var(--spacing-extra-extra-extra-large); }\n\n.pv0 {\n padding-top: var(--spacing-none);\n padding-bottom: var(--spacing-none);\n}\n.pv1 {\n padding-top: var(--spacing-extra-small);\n padding-bottom: var(--spacing-extra-small);\n}\n.pv2 {\n padding-top: var(--spacing-small);\n padding-bottom: var(--spacing-small);\n}\n.pv3 {\n padding-top: var(--spacing-medium);\n padding-bottom: var(--spacing-medium);\n}\n.pv4 {\n padding-top: var(--spacing-large);\n padding-bottom: var(--spacing-large);\n}\n.pv5 {\n padding-top: var(--spacing-extra-large);\n padding-bottom: var(--spacing-extra-large);\n}\n.pv6 {\n padding-top: var(--spacing-extra-extra-large);\n padding-bottom: var(--spacing-extra-extra-large);\n}\n\n.pv7 {\n padding-top: var(--spacing-extra-extra-extra-large);\n padding-bottom: var(--spacing-extra-extra-extra-large);\n}\n\n.ph0 {\n padding-left: var(--spacing-none);\n padding-right: var(--spacing-none);\n}\n\n.ph1 {\n padding-left: var(--spacing-extra-small);\n padding-right: var(--spacing-extra-small);\n}\n\n.ph2 {\n padding-left: var(--spacing-small);\n padding-right: var(--spacing-small);\n}\n\n.ph3 {\n padding-left: var(--spacing-medium);\n padding-right: var(--spacing-medium);\n}\n\n.ph4 {\n padding-left: var(--spacing-large);\n padding-right: var(--spacing-large);\n}\n\n.ph5 {\n padding-left: var(--spacing-extra-large);\n padding-right: var(--spacing-extra-large);\n}\n\n.ph6 {\n padding-left: var(--spacing-extra-extra-large);\n padding-right: var(--spacing-extra-extra-large);\n}\n\n.ph7 {\n padding-left: var(--spacing-extra-extra-extra-large);\n padding-right: var(--spacing-extra-extra-extra-large);\n}\n\n.ma0 { margin: var(--spacing-none); }\n.ma1 { margin: var(--spacing-extra-small); }\n.ma2 { margin: var(--spacing-small); }\n.ma3 { margin: var(--spacing-medium); }\n.ma4 { margin: var(--spacing-large); }\n.ma5 { margin: var(--spacing-extra-large); }\n.ma6 { margin: var(--spacing-extra-extra-large); }\n.ma7 { margin: var(--spacing-extra-extra-extra-large); }\n\n.ml0 { margin-left: var(--spacing-none); }\n.ml1 { margin-left: var(--spacing-extra-small); }\n.ml2 { margin-left: var(--spacing-small); }\n.ml3 { margin-left: var(--spacing-medium); }\n.ml4 { margin-left: var(--spacing-large); }\n.ml5 { margin-left: var(--spacing-extra-large); }\n.ml6 { margin-left: var(--spacing-extra-extra-large); }\n.ml7 { margin-left: var(--spacing-extra-extra-extra-large); }\n\n.mr0 { margin-right: var(--spacing-none); }\n.mr1 { margin-right: var(--spacing-extra-small); }\n.mr2 { margin-right: var(--spacing-small); }\n.mr3 { margin-right: var(--spacing-medium); }\n.mr4 { margin-right: var(--spacing-large); }\n.mr5 { margin-right: var(--spacing-extra-large); }\n.mr6 { margin-right: var(--spacing-extra-extra-large); }\n.mr7 { margin-right: var(--spacing-extra-extra-extra-large); }\n\n.mb0 { margin-bottom: var(--spacing-none); }\n.mb1 { margin-bottom: var(--spacing-extra-small); }\n.mb2 { margin-bottom: var(--spacing-small); }\n.mb3 { margin-bottom: var(--spacing-medium); }\n.mb4 { margin-bottom: var(--spacing-large); }\n.mb5 { margin-bottom: var(--spacing-extra-large); }\n.mb6 { margin-bottom: var(--spacing-extra-extra-large); }\n.mb7 { margin-bottom: var(--spacing-extra-extra-extra-large); }\n\n.mt0 { margin-top: var(--spacing-none); }\n.mt1 { margin-top: var(--spacing-extra-small); }\n.mt2 { margin-top: var(--spacing-small); }\n.mt3 { margin-top: var(--spacing-medium); }\n.mt4 { margin-top: var(--spacing-large); }\n.mt5 { margin-top: var(--spacing-extra-large); }\n.mt6 { margin-top: var(--spacing-extra-extra-large); }\n.mt7 { margin-top: var(--spacing-extra-extra-extra-large); }\n\n.mv0 {\n margin-top: var(--spacing-none);\n margin-bottom: var(--spacing-none);\n}\n.mv1 {\n margin-top: var(--spacing-extra-small);\n margin-bottom: var(--spacing-extra-small);\n}\n.mv2 {\n margin-top: var(--spacing-small);\n margin-bottom: var(--spacing-small);\n}\n.mv3 {\n margin-top: var(--spacing-medium);\n margin-bottom: var(--spacing-medium);\n}\n.mv4 {\n margin-top: var(--spacing-large);\n margin-bottom: var(--spacing-large);\n}\n.mv5 {\n margin-top: var(--spacing-extra-large);\n margin-bottom: var(--spacing-extra-large);\n}\n.mv6 {\n margin-top: var(--spacing-extra-extra-large);\n margin-bottom: var(--spacing-extra-extra-large);\n}\n.mv7 {\n margin-top: var(--spacing-extra-extra-extra-large);\n margin-bottom: var(--spacing-extra-extra-extra-large);\n}\n\n.mh0 {\n margin-left: var(--spacing-none);\n margin-right: var(--spacing-none);\n}\n.mh1 {\n margin-left: var(--spacing-extra-small);\n margin-right: var(--spacing-extra-small);\n}\n.mh2 {\n margin-left: var(--spacing-small);\n margin-right: var(--spacing-small);\n}\n.mh3 {\n margin-left: var(--spacing-medium);\n margin-right: var(--spacing-medium);\n}\n.mh4 {\n margin-left: var(--spacing-large);\n margin-right: var(--spacing-large);\n}\n.mh5 {\n margin-left: var(--spacing-extra-large);\n margin-right: var(--spacing-extra-large);\n}\n.mh6 {\n margin-left: var(--spacing-extra-extra-large);\n margin-right: var(--spacing-extra-extra-large);\n}\n.mh7 {\n margin-left: var(--spacing-extra-extra-extra-large);\n margin-right: var(--spacing-extra-extra-extra-large);\n}\n\n@media (--breakpoint-not-small) {\n .pa0-ns { padding: var(--spacing-none); }\n .pa1-ns { padding: var(--spacing-extra-small); }\n .pa2-ns { padding: var(--spacing-small); }\n .pa3-ns { padding: var(--spacing-medium); }\n .pa4-ns { padding: var(--spacing-large); }\n .pa5-ns { padding: var(--spacing-extra-large); }\n .pa6-ns { padding: var(--spacing-extra-extra-large); }\n .pa7-ns { padding: var(--spacing-extra-extra-extra-large); }\n\n .pl0-ns { padding-left: var(--spacing-none); }\n .pl1-ns { padding-left: var(--spacing-extra-small); }\n .pl2-ns { padding-left: var(--spacing-small); }\n .pl3-ns { padding-left: var(--spacing-medium); }\n .pl4-ns { padding-left: var(--spacing-large); }\n .pl5-ns { padding-left: var(--spacing-extra-large); }\n .pl6-ns { padding-left: var(--spacing-extra-extra-large); }\n .pl7-ns { padding-left: var(--spacing-extra-extra-extra-large); }\n\n .pr0-ns { padding-right: var(--spacing-none); }\n .pr1-ns { padding-right: var(--spacing-extra-small); }\n .pr2-ns { padding-right: var(--spacing-small); }\n .pr3-ns { padding-right: var(--spacing-medium); }\n .pr4-ns { padding-right: var(--spacing-large); }\n .pr5-ns { padding-right: var(--spacing-extra-large); }\n .pr6-ns { padding-right: var(--spacing-extra-extra-large); }\n .pr7-ns { padding-right: var(--spacing-extra-extra-extra-large); }\n\n .pb0-ns { padding-bottom: var(--spacing-none); }\n .pb1-ns { padding-bottom: var(--spacing-extra-small); }\n .pb2-ns { padding-bottom: var(--spacing-small); }\n .pb3-ns { padding-bottom: var(--spacing-medium); }\n .pb4-ns { padding-bottom: var(--spacing-large); }\n .pb5-ns { padding-bottom: var(--spacing-extra-large); }\n .pb6-ns { padding-bottom: var(--spacing-extra-extra-large); }\n .pb7-ns { padding-bottom: var(--spacing-extra-extra-extra-large); }\n\n .pt0-ns { padding-top: var(--spacing-none); }\n .pt1-ns { padding-top: var(--spacing-extra-small); }\n .pt2-ns { padding-top: var(--spacing-small); }\n .pt3-ns { padding-top: var(--spacing-medium); }\n .pt4-ns { padding-top: var(--spacing-large); }\n .pt5-ns { padding-top: var(--spacing-extra-large); }\n .pt6-ns { padding-top: var(--spacing-extra-extra-large); }\n .pt7-ns { padding-top: var(--spacing-extra-extra-extra-large); }\n\n .pv0-ns {\n padding-top: var(--spacing-none);\n padding-bottom: var(--spacing-none);\n }\n .pv1-ns {\n padding-top: var(--spacing-extra-small);\n padding-bottom: var(--spacing-extra-small);\n }\n .pv2-ns {\n padding-top: var(--spacing-small);\n padding-bottom: var(--spacing-small);\n }\n .pv3-ns {\n padding-top: var(--spacing-medium);\n padding-bottom: var(--spacing-medium);\n }\n .pv4-ns {\n padding-top: var(--spacing-large);\n padding-bottom: var(--spacing-large);\n }\n .pv5-ns {\n padding-top: var(--spacing-extra-large);\n padding-bottom: var(--spacing-extra-large);\n }\n .pv6-ns {\n padding-top: var(--spacing-extra-extra-large);\n padding-bottom: var(--spacing-extra-extra-large);\n }\n .pv7-ns {\n padding-top: var(--spacing-extra-extra-extra-large);\n padding-bottom: var(--spacing-extra-extra-extra-large);\n }\n .ph0-ns {\n padding-left: var(--spacing-none);\n padding-right: var(--spacing-none);\n }\n .ph1-ns {\n padding-left: var(--spacing-extra-small);\n padding-right: var(--spacing-extra-small);\n }\n .ph2-ns {\n padding-left: var(--spacing-small);\n padding-right: var(--spacing-small);\n }\n .ph3-ns {\n padding-left: var(--spacing-medium);\n padding-right: var(--spacing-medium);\n }\n .ph4-ns {\n padding-left: var(--spacing-large);\n padding-right: var(--spacing-large);\n }\n .ph5-ns {\n padding-left: var(--spacing-extra-large);\n padding-right: var(--spacing-extra-large);\n }\n .ph6-ns {\n padding-left: var(--spacing-extra-extra-large);\n padding-right: var(--spacing-extra-extra-large);\n }\n .ph7-ns {\n padding-left: var(--spacing-extra-extra-extra-large);\n padding-right: var(--spacing-extra-extra-extra-large);\n }\n\n .ma0-ns { margin: var(--spacing-none); }\n .ma1-ns { margin: var(--spacing-extra-small); }\n .ma2-ns { margin: var(--spacing-small); }\n .ma3-ns { margin: var(--spacing-medium); }\n .ma4-ns { margin: var(--spacing-large); }\n .ma5-ns { margin: var(--spacing-extra-large); }\n .ma6-ns { margin: var(--spacing-extra-extra-large); }\n .ma7-ns { margin: var(--spacing-extra-extra-extra-large); }\n\n .ml0-ns { margin-left: var(--spacing-none); }\n .ml1-ns { margin-left: var(--spacing-extra-small); }\n .ml2-ns { margin-left: var(--spacing-small); }\n .ml3-ns { margin-left: var(--spacing-medium); }\n .ml4-ns { margin-left: var(--spacing-large); }\n .ml5-ns { margin-left: var(--spacing-extra-large); }\n .ml6-ns { margin-left: var(--spacing-extra-extra-large); }\n .ml7-ns { margin-left: var(--spacing-extra-extra-extra-large); }\n\n .mr0-ns { margin-right: var(--spacing-none); }\n .mr1-ns { margin-right: var(--spacing-extra-small); }\n .mr2-ns { margin-right: var(--spacing-small); }\n .mr3-ns { margin-right: var(--spacing-medium); }\n .mr4-ns { margin-right: var(--spacing-large); }\n .mr5-ns { margin-right: var(--spacing-extra-large); }\n .mr6-ns { margin-right: var(--spacing-extra-extra-large); }\n .mr7-ns { margin-right: var(--spacing-extra-extra-extra-large); }\n\n .mb0-ns { margin-bottom: var(--spacing-none); }\n .mb1-ns { margin-bottom: var(--spacing-extra-small); }\n .mb2-ns { margin-bottom: var(--spacing-small); }\n .mb3-ns { margin-bottom: var(--spacing-medium); }\n .mb4-ns { margin-bottom: var(--spacing-large); }\n .mb5-ns { margin-bottom: var(--spacing-extra-large); }\n .mb6-ns { margin-bottom: var(--spacing-extra-extra-large); }\n .mb7-ns { margin-bottom: var(--spacing-extra-extra-extra-large); }\n\n .mt0-ns { margin-top: var(--spacing-none); }\n .mt1-ns { margin-top: var(--spacing-extra-small); }\n .mt2-ns { margin-top: var(--spacing-small); }\n .mt3-ns { margin-top: var(--spacing-medium); }\n .mt4-ns { margin-top: var(--spacing-large); }\n .mt5-ns { margin-top: var(--spacing-extra-large); }\n .mt6-ns { margin-top: var(--spacing-extra-extra-large); }\n .mt7-ns { margin-top: var(--spacing-extra-extra-extra-large); }\n\n .mv0-ns {\n margin-top: var(--spacing-none);\n margin-bottom: var(--spacing-none);\n }\n .mv1-ns {\n margin-top: var(--spacing-extra-small);\n margin-bottom: var(--spacing-extra-small);\n }\n .mv2-ns {\n margin-top: var(--spacing-small);\n margin-bottom: var(--spacing-small);\n }\n .mv3-ns {\n margin-top: var(--spacing-medium);\n margin-bottom: var(--spacing-medium);\n }\n .mv4-ns {\n margin-top: var(--spacing-large);\n margin-bottom: var(--spacing-large);\n }\n .mv5-ns {\n margin-top: var(--spacing-extra-large);\n margin-bottom: var(--spacing-extra-large);\n }\n .mv6-ns {\n margin-top: var(--spacing-extra-extra-large);\n margin-bottom: var(--spacing-extra-extra-large);\n }\n .mv7-ns {\n margin-top: var(--spacing-extra-extra-extra-large);\n margin-bottom: var(--spacing-extra-extra-extra-large);\n }\n\n .mh0-ns {\n margin-left: var(--spacing-none);\n margin-right: var(--spacing-none);\n }\n .mh1-ns {\n margin-left: var(--spacing-extra-small);\n margin-right: var(--spacing-extra-small);\n }\n .mh2-ns {\n margin-left: var(--spacing-small);\n margin-right: var(--spacing-small);\n }\n .mh3-ns {\n margin-left: var(--spacing-medium);\n margin-right: var(--spacing-medium);\n }\n .mh4-ns {\n margin-left: var(--spacing-large);\n margin-right: var(--spacing-large);\n }\n .mh5-ns {\n margin-left: var(--spacing-extra-large);\n margin-right: var(--spacing-extra-large);\n }\n .mh6-ns {\n margin-left: var(--spacing-extra-extra-large);\n margin-right: var(--spacing-extra-extra-large);\n }\n .mh7-ns {\n margin-left: var(--spacing-extra-extra-extra-large);\n margin-right: var(--spacing-extra-extra-extra-large);\n }\n\n}\n\n@media (--breakpoint-medium) {\n .pa0-m { padding: var(--spacing-none); }\n .pa1-m { padding: var(--spacing-extra-small); }\n .pa2-m { padding: var(--spacing-small); }\n .pa3-m { padding: var(--spacing-medium); }\n .pa4-m { padding: var(--spacing-large); }\n .pa5-m { padding: var(--spacing-extra-large); }\n .pa6-m { padding: var(--spacing-extra-extra-large); }\n .pa7-m { padding: var(--spacing-extra-extra-extra-large); }\n\n .pl0-m { padding-left: var(--spacing-none); }\n .pl1-m { padding-left: var(--spacing-extra-small); }\n .pl2-m { padding-left: var(--spacing-small); }\n .pl3-m { padding-left: var(--spacing-medium); }\n .pl4-m { padding-left: var(--spacing-large); }\n .pl5-m { padding-left: var(--spacing-extra-large); }\n .pl6-m { padding-left: var(--spacing-extra-extra-large); }\n .pl7-m { padding-left: var(--spacing-extra-extra-extra-large); }\n\n .pr0-m { padding-right: var(--spacing-none); }\n .pr1-m { padding-right: var(--spacing-extra-small); }\n .pr2-m { padding-right: var(--spacing-small); }\n .pr3-m { padding-right: var(--spacing-medium); }\n .pr4-m { padding-right: var(--spacing-large); }\n .pr5-m { padding-right: var(--spacing-extra-large); }\n .pr6-m { padding-right: var(--spacing-extra-extra-large); }\n .pr7-m { padding-right: var(--spacing-extra-extra-extra-large); }\n\n .pb0-m { padding-bottom: var(--spacing-none); }\n .pb1-m { padding-bottom: var(--spacing-extra-small); }\n .pb2-m { padding-bottom: var(--spacing-small); }\n .pb3-m { padding-bottom: var(--spacing-medium); }\n .pb4-m { padding-bottom: var(--spacing-large); }\n .pb5-m { padding-bottom: var(--spacing-extra-large); }\n .pb6-m { padding-bottom: var(--spacing-extra-extra-large); }\n .pb7-m { padding-bottom: var(--spacing-extra-extra-extra-large); }\n\n .pt0-m { padding-top: var(--spacing-none); }\n .pt1-m { padding-top: var(--spacing-extra-small); }\n .pt2-m { padding-top: var(--spacing-small); }\n .pt3-m { padding-top: var(--spacing-medium); }\n .pt4-m { padding-top: var(--spacing-large); }\n .pt5-m { padding-top: var(--spacing-extra-large); }\n .pt6-m { padding-top: var(--spacing-extra-extra-large); }\n .pt7-m { padding-top: var(--spacing-extra-extra-extra-large); }\n\n .pv0-m {\n padding-top: var(--spacing-none);\n padding-bottom: var(--spacing-none);\n }\n .pv1-m {\n padding-top: var(--spacing-extra-small);\n padding-bottom: var(--spacing-extra-small);\n }\n .pv2-m {\n padding-top: var(--spacing-small);\n padding-bottom: var(--spacing-small);\n }\n .pv3-m {\n padding-top: var(--spacing-medium);\n padding-bottom: var(--spacing-medium);\n }\n .pv4-m {\n padding-top: var(--spacing-large);\n padding-bottom: var(--spacing-large);\n }\n .pv5-m {\n padding-top: var(--spacing-extra-large);\n padding-bottom: var(--spacing-extra-large);\n }\n .pv6-m {\n padding-top: var(--spacing-extra-extra-large);\n padding-bottom: var(--spacing-extra-extra-large);\n }\n .pv7-m {\n padding-top: var(--spacing-extra-extra-extra-large);\n padding-bottom: var(--spacing-extra-extra-extra-large);\n }\n\n .ph0-m {\n padding-left: var(--spacing-none);\n padding-right: var(--spacing-none);\n }\n .ph1-m {\n padding-left: var(--spacing-extra-small);\n padding-right: var(--spacing-extra-small);\n }\n .ph2-m {\n padding-left: var(--spacing-small);\n padding-right: var(--spacing-small);\n }\n .ph3-m {\n padding-left: var(--spacing-medium);\n padding-right: var(--spacing-medium);\n }\n .ph4-m {\n padding-left: var(--spacing-large);\n padding-right: var(--spacing-large);\n }\n .ph5-m {\n padding-left: var(--spacing-extra-large);\n padding-right: var(--spacing-extra-large);\n }\n .ph6-m {\n padding-left: var(--spacing-extra-extra-large);\n padding-right: var(--spacing-extra-extra-large);\n }\n .ph7-m {\n padding-left: var(--spacing-extra-extra-extra-large);\n padding-right: var(--spacing-extra-extra-extra-large);\n }\n\n .ma0-m { margin: var(--spacing-none); }\n .ma1-m { margin: var(--spacing-extra-small); }\n .ma2-m { margin: var(--spacing-small); }\n .ma3-m { margin: var(--spacing-medium); }\n .ma4-m { margin: var(--spacing-large); }\n .ma5-m { margin: var(--spacing-extra-large); }\n .ma6-m { margin: var(--spacing-extra-extra-large); }\n .ma7-m { margin: var(--spacing-extra-extra-extra-large); }\n\n .ml0-m { margin-left: var(--spacing-none); }\n .ml1-m { margin-left: var(--spacing-extra-small); }\n .ml2-m { margin-left: var(--spacing-small); }\n .ml3-m { margin-left: var(--spacing-medium); }\n .ml4-m { margin-left: var(--spacing-large); }\n .ml5-m { margin-left: var(--spacing-extra-large); }\n .ml6-m { margin-left: var(--spacing-extra-extra-large); }\n .ml7-m { margin-left: var(--spacing-extra-extra-extra-large); }\n\n .mr0-m { margin-right: var(--spacing-none); }\n .mr1-m { margin-right: var(--spacing-extra-small); }\n .mr2-m { margin-right: var(--spacing-small); }\n .mr3-m { margin-right: var(--spacing-medium); }\n .mr4-m { margin-right: var(--spacing-large); }\n .mr5-m { margin-right: var(--spacing-extra-large); }\n .mr6-m { margin-right: var(--spacing-extra-extra-large); }\n .mr7-m { margin-right: var(--spacing-extra-extra-extra-large); }\n\n .mb0-m { margin-bottom: var(--spacing-none); }\n .mb1-m { margin-bottom: var(--spacing-extra-small); }\n .mb2-m { margin-bottom: var(--spacing-small); }\n .mb3-m { margin-bottom: var(--spacing-medium); }\n .mb4-m { margin-bottom: var(--spacing-large); }\n .mb5-m { margin-bottom: var(--spacing-extra-large); }\n .mb6-m { margin-bottom: var(--spacing-extra-extra-large); }\n .mb7-m { margin-bottom: var(--spacing-extra-extra-extra-large); }\n\n .mt0-m { margin-top: var(--spacing-none); }\n .mt1-m { margin-top: var(--spacing-extra-small); }\n .mt2-m { margin-top: var(--spacing-small); }\n .mt3-m { margin-top: var(--spacing-medium); }\n .mt4-m { margin-top: var(--spacing-large); }\n .mt5-m { margin-top: var(--spacing-extra-large); }\n .mt6-m { margin-top: var(--spacing-extra-extra-large); }\n .mt7-m { margin-top: var(--spacing-extra-extra-extra-large); }\n\n .mv0-m {\n margin-top: var(--spacing-none);\n margin-bottom: var(--spacing-none);\n }\n .mv1-m {\n margin-top: var(--spacing-extra-small);\n margin-bottom: var(--spacing-extra-small);\n }\n .mv2-m {\n margin-top: var(--spacing-small);\n margin-bottom: var(--spacing-small);\n }\n .mv3-m {\n margin-top: var(--spacing-medium);\n margin-bottom: var(--spacing-medium);\n }\n .mv4-m {\n margin-top: var(--spacing-large);\n margin-bottom: var(--spacing-large);\n }\n .mv5-m {\n margin-top: var(--spacing-extra-large);\n margin-bottom: var(--spacing-extra-large);\n }\n .mv6-m {\n margin-top: var(--spacing-extra-extra-large);\n margin-bottom: var(--spacing-extra-extra-large);\n }\n .mv7-m {\n margin-top: var(--spacing-extra-extra-extra-large);\n margin-bottom: var(--spacing-extra-extra-extra-large);\n }\n\n .mh0-m {\n margin-left: var(--spacing-none);\n margin-right: var(--spacing-none);\n }\n .mh1-m {\n margin-left: var(--spacing-extra-small);\n margin-right: var(--spacing-extra-small);\n }\n .mh2-m {\n margin-left: var(--spacing-small);\n margin-right: var(--spacing-small);\n }\n .mh3-m {\n margin-left: var(--spacing-medium);\n margin-right: var(--spacing-medium);\n }\n .mh4-m {\n margin-left: var(--spacing-large);\n margin-right: var(--spacing-large);\n }\n .mh5-m {\n margin-left: var(--spacing-extra-large);\n margin-right: var(--spacing-extra-large);\n }\n .mh6-m {\n margin-left: var(--spacing-extra-extra-large);\n margin-right: var(--spacing-extra-extra-large);\n }\n .mh7-m {\n margin-left: var(--spacing-extra-extra-extra-large);\n margin-right: var(--spacing-extra-extra-extra-large);\n }\n\n}\n\n@media (--breakpoint-large) {\n .pa0-l { padding: var(--spacing-none); }\n .pa1-l { padding: var(--spacing-extra-small); }\n .pa2-l { padding: var(--spacing-small); }\n .pa3-l { padding: var(--spacing-medium); }\n .pa4-l { padding: var(--spacing-large); }\n .pa5-l { padding: var(--spacing-extra-large); }\n .pa6-l { padding: var(--spacing-extra-extra-large); }\n .pa7-l { padding: var(--spacing-extra-extra-extra-large); }\n\n .pl0-l { padding-left: var(--spacing-none); }\n .pl1-l { padding-left: var(--spacing-extra-small); }\n .pl2-l { padding-left: var(--spacing-small); }\n .pl3-l { padding-left: var(--spacing-medium); }\n .pl4-l { padding-left: var(--spacing-large); }\n .pl5-l { padding-left: var(--spacing-extra-large); }\n .pl6-l { padding-left: var(--spacing-extra-extra-large); }\n .pl7-l { padding-left: var(--spacing-extra-extra-extra-large); }\n\n .pr0-l { padding-right: var(--spacing-none); }\n .pr1-l { padding-right: var(--spacing-extra-small); }\n .pr2-l { padding-right: var(--spacing-small); }\n .pr3-l { padding-right: var(--spacing-medium); }\n .pr4-l { padding-right: var(--spacing-large); }\n .pr5-l { padding-right: var(--spacing-extra-large); }\n .pr6-l { padding-right: var(--spacing-extra-extra-large); }\n .pr7-l { padding-right: var(--spacing-extra-extra-extra-large); }\n\n .pb0-l { padding-bottom: var(--spacing-none); }\n .pb1-l { padding-bottom: var(--spacing-extra-small); }\n .pb2-l { padding-bottom: var(--spacing-small); }\n .pb3-l { padding-bottom: var(--spacing-medium); }\n .pb4-l { padding-bottom: var(--spacing-large); }\n .pb5-l { padding-bottom: var(--spacing-extra-large); }\n .pb6-l { padding-bottom: var(--spacing-extra-extra-large); }\n .pb7-l { padding-bottom: var(--spacing-extra-extra-extra-large); }\n\n .pt0-l { padding-top: var(--spacing-none); }\n .pt1-l { padding-top: var(--spacing-extra-small); }\n .pt2-l { padding-top: var(--spacing-small); }\n .pt3-l { padding-top: var(--spacing-medium); }\n .pt4-l { padding-top: var(--spacing-large); }\n .pt5-l { padding-top: var(--spacing-extra-large); }\n .pt6-l { padding-top: var(--spacing-extra-extra-large); }\n .pt7-l { padding-top: var(--spacing-extra-extra-extra-large); }\n\n .pv0-l {\n padding-top: var(--spacing-none);\n padding-bottom: var(--spacing-none);\n }\n .pv1-l {\n padding-top: var(--spacing-extra-small);\n padding-bottom: var(--spacing-extra-small);\n }\n .pv2-l {\n padding-top: var(--spacing-small);\n padding-bottom: var(--spacing-small);\n }\n .pv3-l {\n padding-top: var(--spacing-medium);\n padding-bottom: var(--spacing-medium);\n }\n .pv4-l {\n padding-top: var(--spacing-large);\n padding-bottom: var(--spacing-large);\n }\n .pv5-l {\n padding-top: var(--spacing-extra-large);\n padding-bottom: var(--spacing-extra-large);\n }\n .pv6-l {\n padding-top: var(--spacing-extra-extra-large);\n padding-bottom: var(--spacing-extra-extra-large);\n }\n .pv7-l {\n padding-top: var(--spacing-extra-extra-extra-large);\n padding-bottom: var(--spacing-extra-extra-extra-large);\n }\n\n .ph0-l {\n padding-left: var(--spacing-none);\n padding-right: var(--spacing-none);\n }\n .ph1-l {\n padding-left: var(--spacing-extra-small);\n padding-right: var(--spacing-extra-small);\n }\n .ph2-l {\n padding-left: var(--spacing-small);\n padding-right: var(--spacing-small);\n }\n .ph3-l {\n padding-left: var(--spacing-medium);\n padding-right: var(--spacing-medium);\n }\n .ph4-l {\n padding-left: var(--spacing-large);\n padding-right: var(--spacing-large);\n }\n .ph5-l {\n padding-left: var(--spacing-extra-large);\n padding-right: var(--spacing-extra-large);\n }\n .ph6-l {\n padding-left: var(--spacing-extra-extra-large);\n padding-right: var(--spacing-extra-extra-large);\n }\n .ph7-l {\n padding-left: var(--spacing-extra-extra-extra-large);\n padding-right: var(--spacing-extra-extra-extra-large);\n }\n\n .ma0-l { margin: var(--spacing-none); }\n .ma1-l { margin: var(--spacing-extra-small); }\n .ma2-l { margin: var(--spacing-small); }\n .ma3-l { margin: var(--spacing-medium); }\n .ma4-l { margin: var(--spacing-large); }\n .ma5-l { margin: var(--spacing-extra-large); }\n .ma6-l { margin: var(--spacing-extra-extra-large); }\n .ma7-l { margin: var(--spacing-extra-extra-extra-large); }\n\n .ml0-l { margin-left: var(--spacing-none); }\n .ml1-l { margin-left: var(--spacing-extra-small); }\n .ml2-l { margin-left: var(--spacing-small); }\n .ml3-l { margin-left: var(--spacing-medium); }\n .ml4-l { margin-left: var(--spacing-large); }\n .ml5-l { margin-left: var(--spacing-extra-large); }\n .ml6-l { margin-left: var(--spacing-extra-extra-large); }\n .ml7-l { margin-left: var(--spacing-extra-extra-extra-large); }\n\n .mr0-l { margin-right: var(--spacing-none); }\n .mr1-l { margin-right: var(--spacing-extra-small); }\n .mr2-l { margin-right: var(--spacing-small); }\n .mr3-l { margin-right: var(--spacing-medium); }\n .mr4-l { margin-right: var(--spacing-large); }\n .mr5-l { margin-right: var(--spacing-extra-large); }\n .mr6-l { margin-right: var(--spacing-extra-extra-large); }\n .mr7-l { margin-right: var(--spacing-extra-extra-extra-large); }\n\n .mb0-l { margin-bottom: var(--spacing-none); }\n .mb1-l { margin-bottom: var(--spacing-extra-small); }\n .mb2-l { margin-bottom: var(--spacing-small); }\n .mb3-l { margin-bottom: var(--spacing-medium); }\n .mb4-l { margin-bottom: var(--spacing-large); }\n .mb5-l { margin-bottom: var(--spacing-extra-large); }\n .mb6-l { margin-bottom: var(--spacing-extra-extra-large); }\n .mb7-l { margin-bottom: var(--spacing-extra-extra-extra-large); }\n\n .mt0-l { margin-top: var(--spacing-none); }\n .mt1-l { margin-top: var(--spacing-extra-small); }\n .mt2-l { margin-top: var(--spacing-small); }\n .mt3-l { margin-top: var(--spacing-medium); }\n .mt4-l { margin-top: var(--spacing-large); }\n .mt5-l { margin-top: var(--spacing-extra-large); }\n .mt6-l { margin-top: var(--spacing-extra-extra-large); }\n .mt7-l { margin-top: var(--spacing-extra-extra-extra-large); }\n\n .mv0-l {\n margin-top: var(--spacing-none);\n margin-bottom: var(--spacing-none);\n }\n .mv1-l {\n margin-top: var(--spacing-extra-small);\n margin-bottom: var(--spacing-extra-small);\n }\n .mv2-l {\n margin-top: var(--spacing-small);\n margin-bottom: var(--spacing-small);\n }\n .mv3-l {\n margin-top: var(--spacing-medium);\n margin-bottom: var(--spacing-medium);\n }\n .mv4-l {\n margin-top: var(--spacing-large);\n margin-bottom: var(--spacing-large);\n }\n .mv5-l {\n margin-top: var(--spacing-extra-large);\n margin-bottom: var(--spacing-extra-large);\n }\n .mv6-l {\n margin-top: var(--spacing-extra-extra-large);\n margin-bottom: var(--spacing-extra-extra-large);\n }\n .mv7-l {\n margin-top: var(--spacing-extra-extra-extra-large);\n margin-bottom: var(--spacing-extra-extra-extra-large);\n }\n\n .mh0-l {\n margin-left: var(--spacing-none);\n margin-right: var(--spacing-none);\n }\n .mh1-l {\n margin-left: var(--spacing-extra-small);\n margin-right: var(--spacing-extra-small);\n }\n .mh2-l {\n margin-left: var(--spacing-small);\n margin-right: var(--spacing-small);\n }\n .mh3-l {\n margin-left: var(--spacing-medium);\n margin-right: var(--spacing-medium);\n }\n .mh4-l {\n margin-left: var(--spacing-large);\n margin-right: var(--spacing-large);\n }\n .mh5-l {\n margin-left: var(--spacing-extra-large);\n margin-right: var(--spacing-extra-large);\n }\n .mh6-l {\n margin-left: var(--spacing-extra-extra-large);\n margin-right: var(--spacing-extra-extra-large);\n }\n .mh7-l {\n margin-left: var(--spacing-extra-extra-extra-large);\n margin-right: var(--spacing-extra-extra-extra-large);\n }\n}\n\n", + "readme": "\n\n# SPACING\n\nAn eight step powers of two scale ranging from 0 to 16rem.\n\n### Docs\n\nhttp://tachyons.io/docs/layout/spacing/\n\n### Base\n\n- p = padding\n- m = margin\n\n### Modifiers\n\n- h = horizontal\n- v = vertical\n- t = top\n- r = right\n- b = bottom\n- l = left\n\n- 0 = none\n- 1 = 1st step in spacing scale\n- 2 = 2nd step in spacing scale\n- 3 = 3rd step in spacing scale\n- 4 = 4th step in spacing scale\n- 5 = 5th step in spacing scale\n- 6 = 6th step in spacing scale\n- 7 = 7th step in spacing scale\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# SPACING\n\nAn eight step powers of two scale ranging from 0 to 16rem.\n\n### Docs\n\nhttp://tachyons.io/docs/layout/spacing/\n\n### Base\n\n- p = padding\n- m = margin\n\n### Modifiers\n\n- h = horizontal\n- v = vertical\n- t = top\n- r = right\n- b = bottom\n- l = left\n\n- 0 = none\n- 1 = 1st step in spacing scale\n- 2 = 2nd step in spacing scale\n- 3 = 3rd step in spacing scale\n- 4 = 4th step in spacing scale\n- 5 = 5th step in spacing scale\n- 6 = 6th step in spacing scale\n- 7 = 7th step in spacing scale\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n/* Variables */\n\n:root {\n --spacing-0: 0;\n --spacing-1: .25rem;\n --spacing-2: .5rem;\n --spacing-3: 1rem;\n --spacing-4: 2rem;\n --spacing-5: 4rem;\n --spacing-6: 8rem;\n --spacing-7: 16rem;\n}\n\n.p0 { padding: var(--spacing-0); }\n.p1 { padding: var(--spacing-1); }\n.p2 { padding: var(--spacing-2); }\n.p3 { padding: var(--spacing-3); }\n.p4 { padding: var(--spacing-4); }\n.p5 { padding: var(--spacing-5); }\n.p6 { padding: var(--spacing-6); }\n.p7 { padding: var(--spacing-7); }\n\n.pl0 { padding-left: var(--spacing-0); }\n.pl1 { padding-left: var(--spacing-1); }\n.pl2 { padding-left: var(--spacing-2); }\n.pl3 { padding-left: var(--spacing-3); }\n.pl4 { padding-left: var(--spacing-4); }\n.pl5 { padding-left: var(--spacing-5); }\n.pl6 { padding-left: var(--spacing-6); }\n.pl7 { padding-left: var(--spacing-7); }\n\n.pr0 { padding-right: var(--spacing-0); }\n.pr1 { padding-right: var(--spacing-1); }\n.pr2 { padding-right: var(--spacing-2); }\n.pr3 { padding-right: var(--spacing-3); }\n.pr4 { padding-right: var(--spacing-4); }\n.pr5 { padding-right: var(--spacing-5); }\n.pr6 { padding-right: var(--spacing-6); }\n.pr7 { padding-right: var(--spacing-7); }\n\n.pb0 { padding-bottom: var(--spacing-0); }\n.pb1 { padding-bottom: var(--spacing-1); }\n.pb2 { padding-bottom: var(--spacing-2); }\n.pb3 { padding-bottom: var(--spacing-3); }\n.pb4 { padding-bottom: var(--spacing-4); }\n.pb5 { padding-bottom: var(--spacing-5); }\n.pb6 { padding-bottom: var(--spacing-6); }\n.pb7 { padding-bottom: var(--spacing-7); }\n\n.pt0 { padding-top: var(--spacing-0); }\n.pt1 { padding-top: var(--spacing-1); }\n.pt2 { padding-top: var(--spacing-2); }\n.pt3 { padding-top: var(--spacing-3); }\n.pt4 { padding-top: var(--spacing-4); }\n.pt5 { padding-top: var(--spacing-5); }\n.pt6 { padding-top: var(--spacing-6); }\n.pt7 { padding-top: var(--spacing-7); }\n\n.pv0 {\n padding-top: var(--spacing-0);\n padding-bottom: var(--spacing-0);\n}\n.pv1 {\n padding-top: var(--spacing-1);\n padding-bottom: var(--spacing-1);\n}\n.pv2 {\n padding-top: var(--spacing-2);\n padding-bottom: var(--spacing-2);\n}\n.pv3 {\n padding-top: var(--spacing-3);\n padding-bottom: var(--spacing-3);\n}\n.pv4 {\n padding-top: var(--spacing-4);\n padding-bottom: var(--spacing-4);\n}\n.pv5 {\n padding-top: var(--spacing-5);\n padding-bottom: var(--spacing-5);\n}\n.pv6 {\n padding-top: var(--spacing-6);\n padding-bottom: var(--spacing-6);\n}\n\n.pv7 {\n padding-top: var(--spacing-7);\n padding-bottom: var(--spacing-7);\n}\n\n.ph0 {\n padding-left: var(--spacing-0);\n padding-right: var(--spacing-0);\n}\n\n.ph1 {\n padding-left: var(--spacing-1);\n padding-right: var(--spacing-1);\n}\n\n.ph2 {\n padding-left: var(--spacing-2);\n padding-right: var(--spacing-2);\n}\n\n.ph3 {\n padding-left: var(--spacing-3);\n padding-right: var(--spacing-3);\n}\n\n.ph4 {\n padding-left: var(--spacing-4);\n padding-right: var(--spacing-4);\n}\n\n.ph5 {\n padding-left: var(--spacing-5);\n padding-right: var(--spacing-5);\n}\n\n.ph6 {\n padding-left: var(--spacing-6);\n padding-right: var(--spacing-6);\n}\n\n.ph7 {\n padding-left: var(--spacing-7);\n padding-right: var(--spacing-7);\n}\n\n.m0 { margin: var(--spacing-0); }\n.m1 { margin: var(--spacing-1); }\n.m2 { margin: var(--spacing-2); }\n.m3 { margin: var(--spacing-3); }\n.m4 { margin: var(--spacing-4); }\n.m5 { margin: var(--spacing-5); }\n.m6 { margin: var(--spacing-6); }\n.m7 { margin: var(--spacing-7); }\n\n.ml0 { margin-left: var(--spacing-0); }\n.ml1 { margin-left: var(--spacing-1); }\n.ml2 { margin-left: var(--spacing-2); }\n.ml3 { margin-left: var(--spacing-3); }\n.ml4 { margin-left: var(--spacing-4); }\n.ml5 { margin-left: var(--spacing-5); }\n.ml6 { margin-left: var(--spacing-6); }\n.ml7 { margin-left: var(--spacing-7); }\n\n.mr0 { margin-right: var(--spacing-0); }\n.mr1 { margin-right: var(--spacing-1); }\n.mr2 { margin-right: var(--spacing-2); }\n.mr3 { margin-right: var(--spacing-3); }\n.mr4 { margin-right: var(--spacing-4); }\n.mr5 { margin-right: var(--spacing-5); }\n.mr6 { margin-right: var(--spacing-6); }\n.mr7 { margin-right: var(--spacing-7); }\n\n.mb0 { margin-bottom: var(--spacing-0); }\n.mb1 { margin-bottom: var(--spacing-1); }\n.mb2 { margin-bottom: var(--spacing-2); }\n.mb3 { margin-bottom: var(--spacing-3); }\n.mb4 { margin-bottom: var(--spacing-4); }\n.mb5 { margin-bottom: var(--spacing-5); }\n.mb6 { margin-bottom: var(--spacing-6); }\n.mb7 { margin-bottom: var(--spacing-7); }\n\n.mt0 { margin-top: var(--spacing-0); }\n.mt1 { margin-top: var(--spacing-1); }\n.mt2 { margin-top: var(--spacing-2); }\n.mt3 { margin-top: var(--spacing-3); }\n.mt4 { margin-top: var(--spacing-4); }\n.mt5 { margin-top: var(--spacing-5); }\n.mt6 { margin-top: var(--spacing-6); }\n.mt7 { margin-top: var(--spacing-7); }\n\n.mv0 {\n margin-top: var(--spacing-0);\n margin-bottom: var(--spacing-0);\n}\n.mv1 {\n margin-top: var(--spacing-1);\n margin-bottom: var(--spacing-1);\n}\n.mv2 {\n margin-top: var(--spacing-2);\n margin-bottom: var(--spacing-2);\n}\n.mv3 {\n margin-top: var(--spacing-3);\n margin-bottom: var(--spacing-3);\n}\n.mv4 {\n margin-top: var(--spacing-4);\n margin-bottom: var(--spacing-4);\n}\n.mv5 {\n margin-top: var(--spacing-5);\n margin-bottom: var(--spacing-5);\n}\n.mv6 {\n margin-top: var(--spacing-6);\n margin-bottom: var(--spacing-6);\n}\n.mv7 {\n margin-top: var(--spacing-7);\n margin-bottom: var(--spacing-7);\n}\n\n.mh0 {\n margin-left: var(--spacing-0);\n margin-right: var(--spacing-0);\n}\n.mh1 {\n margin-left: var(--spacing-1);\n margin-right: var(--spacing-1);\n}\n.mh2 {\n margin-left: var(--spacing-2);\n margin-right: var(--spacing-2);\n}\n.mh3 {\n margin-left: var(--spacing-3);\n margin-right: var(--spacing-3);\n}\n.mh4 {\n margin-left: var(--spacing-4);\n margin-right: var(--spacing-4);\n}\n.mh5 {\n margin-left: var(--spacing-5);\n margin-right: var(--spacing-5);\n}\n.mh6 {\n margin-left: var(--spacing-6);\n margin-right: var(--spacing-6);\n}\n.mh7 {\n margin-left: var(--spacing-7);\n margin-right: var(--spacing-7);\n}\n\n\n@media (--breakpoint-small) {\n .p0-s { padding: var(--spacing-0); }\n .p1-s { padding: var(--spacing-1); }\n .p2-s { padding: var(--spacing-2); }\n .p3-s { padding: var(--spacing-sedium); }\n .p4-s { padding: var(--spacing-4); }\n .p5-s { padding: var(--spacing-5); }\n .p6-s { padding: var(--spacing-6); }\n .p7-s { padding: var(--spacing-7); }\n\n .pl0-s { padding-left: var(--spacing-0); }\n .pl1-s { padding-left: var(--spacing-1); }\n .pl2-s { padding-left: var(--spacing-2); }\n .pl3-s { padding-left: var(--spacing-sedium); }\n .pl4-s { padding-left: var(--spacing-4); }\n .pl5-s { padding-left: var(--spacing-5); }\n .pl6-s { padding-left: var(--spacing-6); }\n .pl7-s { padding-left: var(--spacing-7); }\n\n .pr0-s { padding-right: var(--spacing-0); }\n .pr1-s { padding-right: var(--spacing-1); }\n .pr2-s { padding-right: var(--spacing-2); }\n .pr3-s { padding-right: var(--spacing-sedium); }\n .pr4-s { padding-right: var(--spacing-4); }\n .pr5-s { padding-right: var(--spacing-5); }\n .pr6-s { padding-right: var(--spacing-6); }\n .pr7-s { padding-right: var(--spacing-7); }\n\n .pb0-s { padding-bottom: var(--spacing-0); }\n .pb1-s { padding-bottom: var(--spacing-1); }\n .pb2-s { padding-bottom: var(--spacing-2); }\n .pb3-s { padding-bottom: var(--spacing-sedium); }\n .pb4-s { padding-bottom: var(--spacing-4); }\n .pb5-s { padding-bottom: var(--spacing-5); }\n .pb6-s { padding-bottom: var(--spacing-6); }\n .pb7-s { padding-bottom: var(--spacing-7); }\n\n .pt0-s { padding-top: var(--spacing-0); }\n .pt1-s { padding-top: var(--spacing-1); }\n .pt2-s { padding-top: var(--spacing-2); }\n .pt3-s { padding-top: var(--spacing-sedium); }\n .pt4-s { padding-top: var(--spacing-4); }\n .pt5-s { padding-top: var(--spacing-5); }\n .pt6-s { padding-top: var(--spacing-6); }\n .pt7-s { padding-top: var(--spacing-7); }\n\n .pv0-s {\n padding-top: var(--spacing-0);\n padding-bottom: var(--spacing-0);\n }\n .pv1-s {\n padding-top: var(--spacing-1);\n padding-bottom: var(--spacing-1);\n }\n .pv2-s {\n padding-top: var(--spacing-2);\n padding-bottom: var(--spacing-2);\n }\n .pv3-s {\n padding-top: var(--spacing-sedium);\n padding-bottom: var(--spacing-sedium);\n }\n .pv4-s {\n padding-top: var(--spacing-4);\n padding-bottom: var(--spacing-4);\n }\n .pv5-s {\n padding-top: var(--spacing-5);\n padding-bottom: var(--spacing-5);\n }\n .pv6-s {\n padding-top: var(--spacing-6);\n padding-bottom: var(--spacing-6);\n }\n .pv7-s {\n padding-top: var(--spacing-7);\n padding-bottom: var(--spacing-7);\n }\n\n .ph0-s {\n padding-left: var(--spacing-0);\n padding-right: var(--spacing-0);\n }\n .ph1-s {\n padding-left: var(--spacing-1);\n padding-right: var(--spacing-1);\n }\n .ph2-s {\n padding-left: var(--spacing-2);\n padding-right: var(--spacing-2);\n }\n .ph3-s {\n padding-left: var(--spacing-sedium);\n padding-right: var(--spacing-sedium);\n }\n .ph4-s {\n padding-left: var(--spacing-4);\n padding-right: var(--spacing-4);\n }\n .ph5-s {\n padding-left: var(--spacing-5);\n padding-right: var(--spacing-5);\n }\n .ph6-s {\n padding-left: var(--spacing-6);\n padding-right: var(--spacing-6);\n }\n .ph7-s {\n padding-left: var(--spacing-7);\n padding-right: var(--spacing-7);\n }\n\n .m0-s { margin: var(--spacing-0); }\n .m1-s { margin: var(--spacing-1); }\n .m2-s { margin: var(--spacing-2); }\n .m3-s { margin: var(--spacing-sedium); }\n .m4-s { margin: var(--spacing-4); }\n .m5-s { margin: var(--spacing-5); }\n .m6-s { margin: var(--spacing-6); }\n .m7-s { margin: var(--spacing-7); }\n\n .ml0-s { margin-left: var(--spacing-0); }\n .ml1-s { margin-left: var(--spacing-1); }\n .ml2-s { margin-left: var(--spacing-2); }\n .ml3-s { margin-left: var(--spacing-sedium); }\n .ml4-s { margin-left: var(--spacing-4); }\n .ml5-s { margin-left: var(--spacing-5); }\n .ml6-s { margin-left: var(--spacing-6); }\n .ml7-s { margin-left: var(--spacing-7); }\n\n .mr0-s { margin-right: var(--spacing-0); }\n .mr1-s { margin-right: var(--spacing-1); }\n .mr2-s { margin-right: var(--spacing-2); }\n .mr3-s { margin-right: var(--spacing-sedium); }\n .mr4-s { margin-right: var(--spacing-4); }\n .mr5-s { margin-right: var(--spacing-5); }\n .mr6-s { margin-right: var(--spacing-6); }\n .mr7-s { margin-right: var(--spacing-7); }\n\n .mb0-s { margin-bottom: var(--spacing-0); }\n .mb1-s { margin-bottom: var(--spacing-1); }\n .mb2-s { margin-bottom: var(--spacing-2); }\n .mb3-s { margin-bottom: var(--spacing-sedium); }\n .mb4-s { margin-bottom: var(--spacing-4); }\n .mb5-s { margin-bottom: var(--spacing-5); }\n .mb6-s { margin-bottom: var(--spacing-6); }\n .mb7-s { margin-bottom: var(--spacing-7); }\n\n .mt0-s { margin-top: var(--spacing-0); }\n .mt1-s { margin-top: var(--spacing-1); }\n .mt2-s { margin-top: var(--spacing-2); }\n .mt3-s { margin-top: var(--spacing-sedium); }\n .mt4-s { margin-top: var(--spacing-4); }\n .mt5-s { margin-top: var(--spacing-5); }\n .mt6-s { margin-top: var(--spacing-6); }\n .mt7-s { margin-top: var(--spacing-7); }\n\n .mv0-s {\n margin-top: var(--spacing-0);\n margin-bottom: var(--spacing-0);\n }\n .mv1-s {\n margin-top: var(--spacing-1);\n margin-bottom: var(--spacing-1);\n }\n .mv2-s {\n margin-top: var(--spacing-2);\n margin-bottom: var(--spacing-2);\n }\n .mv3-s {\n margin-top: var(--spacing-sedium);\n margin-bottom: var(--spacing-sedium);\n }\n .mv4-s {\n margin-top: var(--spacing-4);\n margin-bottom: var(--spacing-4);\n }\n .mv5-s {\n margin-top: var(--spacing-5);\n margin-bottom: var(--spacing-5);\n }\n .mv6-s {\n margin-top: var(--spacing-6);\n margin-bottom: var(--spacing-6);\n }\n .mv7-s {\n margin-top: var(--spacing-7);\n margin-bottom: var(--spacing-7);\n }\n\n .mh0-s {\n margin-left: var(--spacing-0);\n margin-right: var(--spacing-0);\n }\n .mh1-s {\n margin-left: var(--spacing-1);\n margin-right: var(--spacing-1);\n }\n .mh2-s {\n margin-left: var(--spacing-2);\n margin-right: var(--spacing-2);\n }\n .mh3-s {\n margin-left: var(--spacing-sedium);\n margin-right: var(--spacing-sedium);\n }\n .mh4-s {\n margin-left: var(--spacing-4);\n margin-right: var(--spacing-4);\n }\n .mh5-s {\n margin-left: var(--spacing-5);\n margin-right: var(--spacing-5);\n }\n .mh6-s {\n margin-left: var(--spacing-6);\n margin-right: var(--spacing-6);\n }\n .mh7-s {\n margin-left: var(--spacing-7);\n margin-right: var(--spacing-7);\n }\n}\n\n@media (--breakpoint-medium) {\n .p0-m { padding: var(--spacing-0); }\n .p1-m { padding: var(--spacing-1); }\n .p2-m { padding: var(--spacing-2); }\n .p3-m { padding: var(--spacing-3); }\n .p4-m { padding: var(--spacing-4); }\n .p5-m { padding: var(--spacing-5); }\n .p6-m { padding: var(--spacing-6); }\n .p7-m { padding: var(--spacing-7); }\n\n .pl0-m { padding-left: var(--spacing-0); }\n .pl1-m { padding-left: var(--spacing-1); }\n .pl2-m { padding-left: var(--spacing-2); }\n .pl3-m { padding-left: var(--spacing-3); }\n .pl4-m { padding-left: var(--spacing-4); }\n .pl5-m { padding-left: var(--spacing-5); }\n .pl6-m { padding-left: var(--spacing-6); }\n .pl7-m { padding-left: var(--spacing-7); }\n\n .pr0-m { padding-right: var(--spacing-0); }\n .pr1-m { padding-right: var(--spacing-1); }\n .pr2-m { padding-right: var(--spacing-2); }\n .pr3-m { padding-right: var(--spacing-3); }\n .pr4-m { padding-right: var(--spacing-4); }\n .pr5-m { padding-right: var(--spacing-5); }\n .pr6-m { padding-right: var(--spacing-6); }\n .pr7-m { padding-right: var(--spacing-7); }\n\n .pb0-m { padding-bottom: var(--spacing-0); }\n .pb1-m { padding-bottom: var(--spacing-1); }\n .pb2-m { padding-bottom: var(--spacing-2); }\n .pb3-m { padding-bottom: var(--spacing-3); }\n .pb4-m { padding-bottom: var(--spacing-4); }\n .pb5-m { padding-bottom: var(--spacing-5); }\n .pb6-m { padding-bottom: var(--spacing-6); }\n .pb7-m { padding-bottom: var(--spacing-7); }\n\n .pt0-m { padding-top: var(--spacing-0); }\n .pt1-m { padding-top: var(--spacing-1); }\n .pt2-m { padding-top: var(--spacing-2); }\n .pt3-m { padding-top: var(--spacing-3); }\n .pt4-m { padding-top: var(--spacing-4); }\n .pt5-m { padding-top: var(--spacing-5); }\n .pt6-m { padding-top: var(--spacing-6); }\n .pt7-m { padding-top: var(--spacing-7); }\n\n .pv0-m {\n padding-top: var(--spacing-0);\n padding-bottom: var(--spacing-0);\n }\n .pv1-m {\n padding-top: var(--spacing-1);\n padding-bottom: var(--spacing-1);\n }\n .pv2-m {\n padding-top: var(--spacing-2);\n padding-bottom: var(--spacing-2);\n }\n .pv3-m {\n padding-top: var(--spacing-3);\n padding-bottom: var(--spacing-3);\n }\n .pv4-m {\n padding-top: var(--spacing-4);\n padding-bottom: var(--spacing-4);\n }\n .pv5-m {\n padding-top: var(--spacing-5);\n padding-bottom: var(--spacing-5);\n }\n .pv6-m {\n padding-top: var(--spacing-6);\n padding-bottom: var(--spacing-6);\n }\n .pv7-m {\n padding-top: var(--spacing-7);\n padding-bottom: var(--spacing-7);\n }\n\n .ph0-m {\n padding-left: var(--spacing-0);\n padding-right: var(--spacing-0);\n }\n .ph1-m {\n padding-left: var(--spacing-1);\n padding-right: var(--spacing-1);\n }\n .ph2-m {\n padding-left: var(--spacing-2);\n padding-right: var(--spacing-2);\n }\n .ph3-m {\n padding-left: var(--spacing-3);\n padding-right: var(--spacing-3);\n }\n .ph4-m {\n padding-left: var(--spacing-4);\n padding-right: var(--spacing-4);\n }\n .ph5-m {\n padding-left: var(--spacing-5);\n padding-right: var(--spacing-5);\n }\n .ph6-m {\n padding-left: var(--spacing-6);\n padding-right: var(--spacing-6);\n }\n .ph7-m {\n padding-left: var(--spacing-7);\n padding-right: var(--spacing-7);\n }\n\n .m0-m { margin: var(--spacing-0); }\n .m1-m { margin: var(--spacing-1); }\n .m2-m { margin: var(--spacing-2); }\n .m3-m { margin: var(--spacing-3); }\n .m4-m { margin: var(--spacing-4); }\n .m5-m { margin: var(--spacing-5); }\n .m6-m { margin: var(--spacing-6); }\n .m7-m { margin: var(--spacing-7); }\n\n .ml0-m { margin-left: var(--spacing-0); }\n .ml1-m { margin-left: var(--spacing-1); }\n .ml2-m { margin-left: var(--spacing-2); }\n .ml3-m { margin-left: var(--spacing-3); }\n .ml4-m { margin-left: var(--spacing-4); }\n .ml5-m { margin-left: var(--spacing-5); }\n .ml6-m { margin-left: var(--spacing-6); }\n .ml7-m { margin-left: var(--spacing-7); }\n\n .mr0-m { margin-right: var(--spacing-0); }\n .mr1-m { margin-right: var(--spacing-1); }\n .mr2-m { margin-right: var(--spacing-2); }\n .mr3-m { margin-right: var(--spacing-3); }\n .mr4-m { margin-right: var(--spacing-4); }\n .mr5-m { margin-right: var(--spacing-5); }\n .mr6-m { margin-right: var(--spacing-6); }\n .mr7-m { margin-right: var(--spacing-7); }\n\n .mb0-m { margin-bottom: var(--spacing-0); }\n .mb1-m { margin-bottom: var(--spacing-1); }\n .mb2-m { margin-bottom: var(--spacing-2); }\n .mb3-m { margin-bottom: var(--spacing-3); }\n .mb4-m { margin-bottom: var(--spacing-4); }\n .mb5-m { margin-bottom: var(--spacing-5); }\n .mb6-m { margin-bottom: var(--spacing-6); }\n .mb7-m { margin-bottom: var(--spacing-7); }\n\n .mt0-m { margin-top: var(--spacing-0); }\n .mt1-m { margin-top: var(--spacing-1); }\n .mt2-m { margin-top: var(--spacing-2); }\n .mt3-m { margin-top: var(--spacing-3); }\n .mt4-m { margin-top: var(--spacing-4); }\n .mt5-m { margin-top: var(--spacing-5); }\n .mt6-m { margin-top: var(--spacing-6); }\n .mt7-m { margin-top: var(--spacing-7); }\n\n .mv0-m {\n margin-top: var(--spacing-0);\n margin-bottom: var(--spacing-0);\n }\n .mv1-m {\n margin-top: var(--spacing-1);\n margin-bottom: var(--spacing-1);\n }\n .mv2-m {\n margin-top: var(--spacing-2);\n margin-bottom: var(--spacing-2);\n }\n .mv3-m {\n margin-top: var(--spacing-3);\n margin-bottom: var(--spacing-3);\n }\n .mv4-m {\n margin-top: var(--spacing-4);\n margin-bottom: var(--spacing-4);\n }\n .mv5-m {\n margin-top: var(--spacing-5);\n margin-bottom: var(--spacing-5);\n }\n .mv6-m {\n margin-top: var(--spacing-6);\n margin-bottom: var(--spacing-6);\n }\n .mv7-m {\n margin-top: var(--spacing-7);\n margin-bottom: var(--spacing-7);\n }\n\n .mh0-m {\n margin-left: var(--spacing-0);\n margin-right: var(--spacing-0);\n }\n .mh1-m {\n margin-left: var(--spacing-1);\n margin-right: var(--spacing-1);\n }\n .mh2-m {\n margin-left: var(--spacing-2);\n margin-right: var(--spacing-2);\n }\n .mh3-m {\n margin-left: var(--spacing-3);\n margin-right: var(--spacing-3);\n }\n .mh4-m {\n margin-left: var(--spacing-4);\n margin-right: var(--spacing-4);\n }\n .mh5-m {\n margin-left: var(--spacing-5);\n margin-right: var(--spacing-5);\n }\n .mh6-m {\n margin-left: var(--spacing-6);\n margin-right: var(--spacing-6);\n }\n .mh7-m {\n margin-left: var(--spacing-7);\n margin-right: var(--spacing-7);\n }\n}\n\n@media (--breakpoint-large) {\n .p0-l { padding: var(--spacing-0); }\n .p1-l { padding: var(--spacing-1); }\n .p2-l { padding: var(--spacing-2); }\n .p3-l { padding: var(--spacing-3); }\n .p4-l { padding: var(--spacing-4); }\n .p5-l { padding: var(--spacing-5); }\n .p6-l { padding: var(--spacing-6); }\n .p7-l { padding: var(--spacing-7); }\n\n .pl0-l { padding-left: var(--spacing-0); }\n .pl1-l { padding-left: var(--spacing-1); }\n .pl2-l { padding-left: var(--spacing-2); }\n .pl3-l { padding-left: var(--spacing-3); }\n .pl4-l { padding-left: var(--spacing-4); }\n .pl5-l { padding-left: var(--spacing-5); }\n .pl6-l { padding-left: var(--spacing-6); }\n .pl7-l { padding-left: var(--spacing-7); }\n\n .pr0-l { padding-right: var(--spacing-0); }\n .pr1-l { padding-right: var(--spacing-1); }\n .pr2-l { padding-right: var(--spacing-2); }\n .pr3-l { padding-right: var(--spacing-3); }\n .pr4-l { padding-right: var(--spacing-4); }\n .pr5-l { padding-right: var(--spacing-5); }\n .pr6-l { padding-right: var(--spacing-6); }\n .pr7-l { padding-right: var(--spacing-7); }\n\n .pb0-l { padding-bottom: var(--spacing-0); }\n .pb1-l { padding-bottom: var(--spacing-1); }\n .pb2-l { padding-bottom: var(--spacing-2); }\n .pb3-l { padding-bottom: var(--spacing-3); }\n .pb4-l { padding-bottom: var(--spacing-4); }\n .pb5-l { padding-bottom: var(--spacing-5); }\n .pb6-l { padding-bottom: var(--spacing-6); }\n .pb7-l { padding-bottom: var(--spacing-7); }\n\n .pt0-l { padding-top: var(--spacing-0); }\n .pt1-l { padding-top: var(--spacing-1); }\n .pt2-l { padding-top: var(--spacing-2); }\n .pt3-l { padding-top: var(--spacing-3); }\n .pt4-l { padding-top: var(--spacing-4); }\n .pt5-l { padding-top: var(--spacing-5); }\n .pt6-l { padding-top: var(--spacing-6); }\n .pt7-l { padding-top: var(--spacing-7); }\n\n .pv0-l {\n padding-top: var(--spacing-0);\n padding-bottom: var(--spacing-0);\n }\n .pv1-l {\n padding-top: var(--spacing-1);\n padding-bottom: var(--spacing-1);\n }\n .pv2-l {\n padding-top: var(--spacing-2);\n padding-bottom: var(--spacing-2);\n }\n .pv3-l {\n padding-top: var(--spacing-3);\n padding-bottom: var(--spacing-3);\n }\n .pv4-l {\n padding-top: var(--spacing-4);\n padding-bottom: var(--spacing-4);\n }\n .pv5-l {\n padding-top: var(--spacing-5);\n padding-bottom: var(--spacing-5);\n }\n .pv6-l {\n padding-top: var(--spacing-6);\n padding-bottom: var(--spacing-6);\n }\n .pv7-l {\n padding-top: var(--spacing-7);\n padding-bottom: var(--spacing-7);\n }\n\n .ph0-l {\n padding-left: var(--spacing-0);\n padding-right: var(--spacing-0);\n }\n .ph1-l {\n padding-left: var(--spacing-1);\n padding-right: var(--spacing-1);\n }\n .ph2-l {\n padding-left: var(--spacing-2);\n padding-right: var(--spacing-2);\n }\n .ph3-l {\n padding-left: var(--spacing-3);\n padding-right: var(--spacing-3);\n }\n .ph4-l {\n padding-left: var(--spacing-4);\n padding-right: var(--spacing-4);\n }\n .ph5-l {\n padding-left: var(--spacing-5);\n padding-right: var(--spacing-5);\n }\n .ph6-l {\n padding-left: var(--spacing-6);\n padding-right: var(--spacing-6);\n }\n .ph7-l {\n padding-left: var(--spacing-7);\n padding-right: var(--spacing-7);\n }\n\n .m0-l { margin: var(--spacing-0); }\n .m1-l { margin: var(--spacing-1); }\n .m2-l { margin: var(--spacing-2); }\n .m3-l { margin: var(--spacing-3); }\n .m4-l { margin: var(--spacing-4); }\n .m5-l { margin: var(--spacing-5); }\n .m6-l { margin: var(--spacing-6); }\n .m7-l { margin: var(--spacing-7); }\n\n .ml0-l { margin-left: var(--spacing-0); }\n .ml1-l { margin-left: var(--spacing-1); }\n .ml2-l { margin-left: var(--spacing-2); }\n .ml3-l { margin-left: var(--spacing-3); }\n .ml4-l { margin-left: var(--spacing-4); }\n .ml5-l { margin-left: var(--spacing-5); }\n .ml6-l { margin-left: var(--spacing-6); }\n .ml7-l { margin-left: var(--spacing-7); }\n\n .mr0-l { margin-right: var(--spacing-0); }\n .mr1-l { margin-right: var(--spacing-1); }\n .mr2-l { margin-right: var(--spacing-2); }\n .mr3-l { margin-right: var(--spacing-3); }\n .mr4-l { margin-right: var(--spacing-4); }\n .mr5-l { margin-right: var(--spacing-5); }\n .mr6-l { margin-right: var(--spacing-6); }\n .mr7-l { margin-right: var(--spacing-7); }\n\n .mb0-l { margin-bottom: var(--spacing-0); }\n .mb1-l { margin-bottom: var(--spacing-1); }\n .mb2-l { margin-bottom: var(--spacing-2); }\n .mb3-l { margin-bottom: var(--spacing-3); }\n .mb4-l { margin-bottom: var(--spacing-4); }\n .mb5-l { margin-bottom: var(--spacing-5); }\n .mb6-l { margin-bottom: var(--spacing-6); }\n .mb7-l { margin-bottom: var(--spacing-7); }\n\n .mt0-l { margin-top: var(--spacing-0); }\n .mt1-l { margin-top: var(--spacing-1); }\n .mt2-l { margin-top: var(--spacing-2); }\n .mt3-l { margin-top: var(--spacing-3); }\n .mt4-l { margin-top: var(--spacing-4); }\n .mt5-l { margin-top: var(--spacing-5); }\n .mt6-l { margin-top: var(--spacing-6); }\n .mt7-l { margin-top: var(--spacing-7); }\n\n .mv0-l {\n margin-top: var(--spacing-0);\n margin-bottom: var(--spacing-0);\n }\n .mv1-l {\n margin-top: var(--spacing-1);\n margin-bottom: var(--spacing-1);\n }\n .mv2-l {\n margin-top: var(--spacing-2);\n margin-bottom: var(--spacing-2);\n }\n .mv3-l {\n margin-top: var(--spacing-3);\n margin-bottom: var(--spacing-3);\n }\n .mv4-l {\n margin-top: var(--spacing-4);\n margin-bottom: var(--spacing-4);\n }\n .mv5-l {\n margin-top: var(--spacing-5);\n margin-bottom: var(--spacing-5);\n }\n .mv6-l {\n margin-top: var(--spacing-6);\n margin-bottom: var(--spacing-6);\n }\n .mv7-l {\n margin-top: var(--spacing-7);\n margin-bottom: var(--spacing-7);\n }\n\n .mh0-l {\n margin-left: var(--spacing-0);\n margin-right: var(--spacing-0);\n }\n .mh1-l {\n margin-left: var(--spacing-1);\n margin-right: var(--spacing-1);\n }\n .mh2-l {\n margin-left: var(--spacing-2);\n margin-right: var(--spacing-2);\n }\n .mh3-l {\n margin-left: var(--spacing-3);\n margin-right: var(--spacing-3);\n }\n .mh4-l {\n margin-left: var(--spacing-4);\n margin-right: var(--spacing-4);\n }\n .mh5-l {\n margin-left: var(--spacing-5);\n margin-right: var(--spacing-5);\n }\n .mh6-l {\n margin-left: var(--spacing-6);\n margin-right: var(--spacing-6);\n }\n .mh7-l {\n margin-left: var(--spacing-7);\n margin-right: var(--spacing-7);\n }\n}\n", "css": "/* Variables */\n/* Spacing Scale - based on a ratio of 1:2 */\n/* Media Queries */\n/*\n SPACING\n\n An eight step powers of two scale ranging from 0 to 16rem.\n Namespaces are composable and thus highly grockable - check the legend below\n\n Legend:\n\n p = padding\n m = margin\n\n a = all\n h = horizontal\n v = vertical\n t = top\n r = right\n b = bottom\n l = left\n\n 0 = none\n 1 = 1st step in spacing scale\n 2 = 2nd step in spacing scale\n 3 = 3rd step in spacing scale\n 4 = 4th step in spacing scale\n 5 = 5th step in spacing scale\n 6 = 6th step in spacing scale\n 7 = 7th step in spacing scale\n\n*/\n.pa0 { padding: 0; }\n.pa1 { padding: .25rem; }\n.pa2 { padding: .5rem; }\n.pa3 { padding: 1rem; }\n.pa4 { padding: 2rem; }\n.pa5 { padding: 4rem; }\n.pa6 { padding: 8rem; }\n.pa7 { padding: 16rem; }\n.pl0 { padding-left: 0; }\n.pl1 { padding-left: .25rem; }\n.pl2 { padding-left: .5rem; }\n.pl3 { padding-left: 1rem; }\n.pl4 { padding-left: 2rem; }\n.pl5 { padding-left: 4rem; }\n.pl6 { padding-left: 8rem; }\n.pl7 { padding-left: 16rem; }\n.pr0 { padding-right: 0; }\n.pr1 { padding-right: .25rem; }\n.pr2 { padding-right: .5rem; }\n.pr3 { padding-right: 1rem; }\n.pr4 { padding-right: 2rem; }\n.pr5 { padding-right: 4rem; }\n.pr6 { padding-right: 8rem; }\n.pr7 { padding-right: 16rem; }\n.pb0 { padding-bottom: 0; }\n.pb1 { padding-bottom: .25rem; }\n.pb2 { padding-bottom: .5rem; }\n.pb3 { padding-bottom: 1rem; }\n.pb4 { padding-bottom: 2rem; }\n.pb5 { padding-bottom: 4rem; }\n.pb6 { padding-bottom: 8rem; }\n.pb7 { padding-bottom: 16rem; }\n.pt0 { padding-top: 0; }\n.pt1 { padding-top: .25rem; }\n.pt2 { padding-top: .5rem; }\n.pt3 { padding-top: 1rem; }\n.pt4 { padding-top: 2rem; }\n.pt5 { padding-top: 4rem; }\n.pt6 { padding-top: 8rem; }\n.pt7 { padding-top: 16rem; }\n.pv0 { padding-top: 0; padding-bottom: 0; }\n.pv1 { padding-top: .25rem; padding-bottom: .25rem; }\n.pv2 { padding-top: .5rem; padding-bottom: .5rem; }\n.pv3 { padding-top: 1rem; padding-bottom: 1rem; }\n.pv4 { padding-top: 2rem; padding-bottom: 2rem; }\n.pv5 { padding-top: 4rem; padding-bottom: 4rem; }\n.pv6 { padding-top: 8rem; padding-bottom: 8rem; }\n.pv7 { padding-top: 16rem; padding-bottom: 16rem; }\n.ph0 { padding-left: 0; padding-right: 0; }\n.ph1 { padding-left: .25rem; padding-right: .25rem; }\n.ph2 { padding-left: .5rem; padding-right: .5rem; }\n.ph3 { padding-left: 1rem; padding-right: 1rem; }\n.ph4 { padding-left: 2rem; padding-right: 2rem; }\n.ph5 { padding-left: 4rem; padding-right: 4rem; }\n.ph6 { padding-left: 8rem; padding-right: 8rem; }\n.ph7 { padding-left: 16rem; padding-right: 16rem; }\n.ma0 { margin: 0; }\n.ma1 { margin: .25rem; }\n.ma2 { margin: .5rem; }\n.ma3 { margin: 1rem; }\n.ma4 { margin: 2rem; }\n.ma5 { margin: 4rem; }\n.ma6 { margin: 8rem; }\n.ma7 { margin: 16rem; }\n.ml0 { margin-left: 0; }\n.ml1 { margin-left: .25rem; }\n.ml2 { margin-left: .5rem; }\n.ml3 { margin-left: 1rem; }\n.ml4 { margin-left: 2rem; }\n.ml5 { margin-left: 4rem; }\n.ml6 { margin-left: 8rem; }\n.ml7 { margin-left: 16rem; }\n.mr0 { margin-right: 0; }\n.mr1 { margin-right: .25rem; }\n.mr2 { margin-right: .5rem; }\n.mr3 { margin-right: 1rem; }\n.mr4 { margin-right: 2rem; }\n.mr5 { margin-right: 4rem; }\n.mr6 { margin-right: 8rem; }\n.mr7 { margin-right: 16rem; }\n.mb0 { margin-bottom: 0; }\n.mb1 { margin-bottom: .25rem; }\n.mb2 { margin-bottom: .5rem; }\n.mb3 { margin-bottom: 1rem; }\n.mb4 { margin-bottom: 2rem; }\n.mb5 { margin-bottom: 4rem; }\n.mb6 { margin-bottom: 8rem; }\n.mb7 { margin-bottom: 16rem; }\n.mt0 { margin-top: 0; }\n.mt1 { margin-top: .25rem; }\n.mt2 { margin-top: .5rem; }\n.mt3 { margin-top: 1rem; }\n.mt4 { margin-top: 2rem; }\n.mt5 { margin-top: 4rem; }\n.mt6 { margin-top: 8rem; }\n.mt7 { margin-top: 16rem; }\n.mv0 { margin-top: 0; margin-bottom: 0; }\n.mv1 { margin-top: .25rem; margin-bottom: .25rem; }\n.mv2 { margin-top: .5rem; margin-bottom: .5rem; }\n.mv3 { margin-top: 1rem; margin-bottom: 1rem; }\n.mv4 { margin-top: 2rem; margin-bottom: 2rem; }\n.mv5 { margin-top: 4rem; margin-bottom: 4rem; }\n.mv6 { margin-top: 8rem; margin-bottom: 8rem; }\n.mv7 { margin-top: 16rem; margin-bottom: 16rem; }\n.mh0 { margin-left: 0; margin-right: 0; }\n.mh1 { margin-left: .25rem; margin-right: .25rem; }\n.mh2 { margin-left: .5rem; margin-right: .5rem; }\n.mh3 { margin-left: 1rem; margin-right: 1rem; }\n.mh4 { margin-left: 2rem; margin-right: 2rem; }\n.mh5 { margin-left: 4rem; margin-right: 4rem; }\n.mh6 { margin-left: 8rem; margin-right: 8rem; }\n.mh7 { margin-left: 16rem; margin-right: 16rem; }\n@media screen and (min-width: 30em) {\n .pa0-ns { padding: 0; }\n .pa1-ns { padding: .25rem; }\n .pa2-ns { padding: .5rem; }\n .pa3-ns { padding: 1rem; }\n .pa4-ns { padding: 2rem; }\n .pa5-ns { padding: 4rem; }\n .pa6-ns { padding: 8rem; }\n .pa7-ns { padding: 16rem; }\n .pl0-ns { padding-left: 0; }\n .pl1-ns { padding-left: .25rem; }\n .pl2-ns { padding-left: .5rem; }\n .pl3-ns { padding-left: 1rem; }\n .pl4-ns { padding-left: 2rem; }\n .pl5-ns { padding-left: 4rem; }\n .pl6-ns { padding-left: 8rem; }\n .pl7-ns { padding-left: 16rem; }\n .pr0-ns { padding-right: 0; }\n .pr1-ns { padding-right: .25rem; }\n .pr2-ns { padding-right: .5rem; }\n .pr3-ns { padding-right: 1rem; }\n .pr4-ns { padding-right: 2rem; }\n .pr5-ns { padding-right: 4rem; }\n .pr6-ns { padding-right: 8rem; }\n .pr7-ns { padding-right: 16rem; }\n .pb0-ns { padding-bottom: 0; }\n .pb1-ns { padding-bottom: .25rem; }\n .pb2-ns { padding-bottom: .5rem; }\n .pb3-ns { padding-bottom: 1rem; }\n .pb4-ns { padding-bottom: 2rem; }\n .pb5-ns { padding-bottom: 4rem; }\n .pb6-ns { padding-bottom: 8rem; }\n .pb7-ns { padding-bottom: 16rem; }\n .pt0-ns { padding-top: 0; }\n .pt1-ns { padding-top: .25rem; }\n .pt2-ns { padding-top: .5rem; }\n .pt3-ns { padding-top: 1rem; }\n .pt4-ns { padding-top: 2rem; }\n .pt5-ns { padding-top: 4rem; }\n .pt6-ns { padding-top: 8rem; }\n .pt7-ns { padding-top: 16rem; }\n .pv0-ns { padding-top: 0; padding-bottom: 0; }\n .pv1-ns { padding-top: .25rem; padding-bottom: .25rem; }\n .pv2-ns { padding-top: .5rem; padding-bottom: .5rem; }\n .pv3-ns { padding-top: 1rem; padding-bottom: 1rem; }\n .pv4-ns { padding-top: 2rem; padding-bottom: 2rem; }\n .pv5-ns { padding-top: 4rem; padding-bottom: 4rem; }\n .pv6-ns { padding-top: 8rem; padding-bottom: 8rem; }\n .pv7-ns { padding-top: 16rem; padding-bottom: 16rem; }\n .ph0-ns { padding-left: 0; padding-right: 0; }\n .ph1-ns { padding-left: .25rem; padding-right: .25rem; }\n .ph2-ns { padding-left: .5rem; padding-right: .5rem; }\n .ph3-ns { padding-left: 1rem; padding-right: 1rem; }\n .ph4-ns { padding-left: 2rem; padding-right: 2rem; }\n .ph5-ns { padding-left: 4rem; padding-right: 4rem; }\n .ph6-ns { padding-left: 8rem; padding-right: 8rem; }\n .ph7-ns { padding-left: 16rem; padding-right: 16rem; }\n .ma0-ns { margin: 0; }\n .ma1-ns { margin: .25rem; }\n .ma2-ns { margin: .5rem; }\n .ma3-ns { margin: 1rem; }\n .ma4-ns { margin: 2rem; }\n .ma5-ns { margin: 4rem; }\n .ma6-ns { margin: 8rem; }\n .ma7-ns { margin: 16rem; }\n .ml0-ns { margin-left: 0; }\n .ml1-ns { margin-left: .25rem; }\n .ml2-ns { margin-left: .5rem; }\n .ml3-ns { margin-left: 1rem; }\n .ml4-ns { margin-left: 2rem; }\n .ml5-ns { margin-left: 4rem; }\n .ml6-ns { margin-left: 8rem; }\n .ml7-ns { margin-left: 16rem; }\n .mr0-ns { margin-right: 0; }\n .mr1-ns { margin-right: .25rem; }\n .mr2-ns { margin-right: .5rem; }\n .mr3-ns { margin-right: 1rem; }\n .mr4-ns { margin-right: 2rem; }\n .mr5-ns { margin-right: 4rem; }\n .mr6-ns { margin-right: 8rem; }\n .mr7-ns { margin-right: 16rem; }\n .mb0-ns { margin-bottom: 0; }\n .mb1-ns { margin-bottom: .25rem; }\n .mb2-ns { margin-bottom: .5rem; }\n .mb3-ns { margin-bottom: 1rem; }\n .mb4-ns { margin-bottom: 2rem; }\n .mb5-ns { margin-bottom: 4rem; }\n .mb6-ns { margin-bottom: 8rem; }\n .mb7-ns { margin-bottom: 16rem; }\n .mt0-ns { margin-top: 0; }\n .mt1-ns { margin-top: .25rem; }\n .mt2-ns { margin-top: .5rem; }\n .mt3-ns { margin-top: 1rem; }\n .mt4-ns { margin-top: 2rem; }\n .mt5-ns { margin-top: 4rem; }\n .mt6-ns { margin-top: 8rem; }\n .mt7-ns { margin-top: 16rem; }\n .mv0-ns { margin-top: 0; margin-bottom: 0; }\n .mv1-ns { margin-top: .25rem; margin-bottom: .25rem; }\n .mv2-ns { margin-top: .5rem; margin-bottom: .5rem; }\n .mv3-ns { margin-top: 1rem; margin-bottom: 1rem; }\n .mv4-ns { margin-top: 2rem; margin-bottom: 2rem; }\n .mv5-ns { margin-top: 4rem; margin-bottom: 4rem; }\n .mv6-ns { margin-top: 8rem; margin-bottom: 8rem; }\n .mv7-ns { margin-top: 16rem; margin-bottom: 16rem; }\n .mh0-ns { margin-left: 0; margin-right: 0; }\n .mh1-ns { margin-left: .25rem; margin-right: .25rem; }\n .mh2-ns { margin-left: .5rem; margin-right: .5rem; }\n .mh3-ns { margin-left: 1rem; margin-right: 1rem; }\n .mh4-ns { margin-left: 2rem; margin-right: 2rem; }\n .mh5-ns { margin-left: 4rem; margin-right: 4rem; }\n .mh6-ns { margin-left: 8rem; margin-right: 8rem; }\n .mh7-ns { margin-left: 16rem; margin-right: 16rem; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .pa0-m { padding: 0; }\n .pa1-m { padding: .25rem; }\n .pa2-m { padding: .5rem; }\n .pa3-m { padding: 1rem; }\n .pa4-m { padding: 2rem; }\n .pa5-m { padding: 4rem; }\n .pa6-m { padding: 8rem; }\n .pa7-m { padding: 16rem; }\n .pl0-m { padding-left: 0; }\n .pl1-m { padding-left: .25rem; }\n .pl2-m { padding-left: .5rem; }\n .pl3-m { padding-left: 1rem; }\n .pl4-m { padding-left: 2rem; }\n .pl5-m { padding-left: 4rem; }\n .pl6-m { padding-left: 8rem; }\n .pl7-m { padding-left: 16rem; }\n .pr0-m { padding-right: 0; }\n .pr1-m { padding-right: .25rem; }\n .pr2-m { padding-right: .5rem; }\n .pr3-m { padding-right: 1rem; }\n .pr4-m { padding-right: 2rem; }\n .pr5-m { padding-right: 4rem; }\n .pr6-m { padding-right: 8rem; }\n .pr7-m { padding-right: 16rem; }\n .pb0-m { padding-bottom: 0; }\n .pb1-m { padding-bottom: .25rem; }\n .pb2-m { padding-bottom: .5rem; }\n .pb3-m { padding-bottom: 1rem; }\n .pb4-m { padding-bottom: 2rem; }\n .pb5-m { padding-bottom: 4rem; }\n .pb6-m { padding-bottom: 8rem; }\n .pb7-m { padding-bottom: 16rem; }\n .pt0-m { padding-top: 0; }\n .pt1-m { padding-top: .25rem; }\n .pt2-m { padding-top: .5rem; }\n .pt3-m { padding-top: 1rem; }\n .pt4-m { padding-top: 2rem; }\n .pt5-m { padding-top: 4rem; }\n .pt6-m { padding-top: 8rem; }\n .pt7-m { padding-top: 16rem; }\n .pv0-m { padding-top: 0; padding-bottom: 0; }\n .pv1-m { padding-top: .25rem; padding-bottom: .25rem; }\n .pv2-m { padding-top: .5rem; padding-bottom: .5rem; }\n .pv3-m { padding-top: 1rem; padding-bottom: 1rem; }\n .pv4-m { padding-top: 2rem; padding-bottom: 2rem; }\n .pv5-m { padding-top: 4rem; padding-bottom: 4rem; }\n .pv6-m { padding-top: 8rem; padding-bottom: 8rem; }\n .pv7-m { padding-top: 16rem; padding-bottom: 16rem; }\n .ph0-m { padding-left: 0; padding-right: 0; }\n .ph1-m { padding-left: .25rem; padding-right: .25rem; }\n .ph2-m { padding-left: .5rem; padding-right: .5rem; }\n .ph3-m { padding-left: 1rem; padding-right: 1rem; }\n .ph4-m { padding-left: 2rem; padding-right: 2rem; }\n .ph5-m { padding-left: 4rem; padding-right: 4rem; }\n .ph6-m { padding-left: 8rem; padding-right: 8rem; }\n .ph7-m { padding-left: 16rem; padding-right: 16rem; }\n .ma0-m { margin: 0; }\n .ma1-m { margin: .25rem; }\n .ma2-m { margin: .5rem; }\n .ma3-m { margin: 1rem; }\n .ma4-m { margin: 2rem; }\n .ma5-m { margin: 4rem; }\n .ma6-m { margin: 8rem; }\n .ma7-m { margin: 16rem; }\n .ml0-m { margin-left: 0; }\n .ml1-m { margin-left: .25rem; }\n .ml2-m { margin-left: .5rem; }\n .ml3-m { margin-left: 1rem; }\n .ml4-m { margin-left: 2rem; }\n .ml5-m { margin-left: 4rem; }\n .ml6-m { margin-left: 8rem; }\n .ml7-m { margin-left: 16rem; }\n .mr0-m { margin-right: 0; }\n .mr1-m { margin-right: .25rem; }\n .mr2-m { margin-right: .5rem; }\n .mr3-m { margin-right: 1rem; }\n .mr4-m { margin-right: 2rem; }\n .mr5-m { margin-right: 4rem; }\n .mr6-m { margin-right: 8rem; }\n .mr7-m { margin-right: 16rem; }\n .mb0-m { margin-bottom: 0; }\n .mb1-m { margin-bottom: .25rem; }\n .mb2-m { margin-bottom: .5rem; }\n .mb3-m { margin-bottom: 1rem; }\n .mb4-m { margin-bottom: 2rem; }\n .mb5-m { margin-bottom: 4rem; }\n .mb6-m { margin-bottom: 8rem; }\n .mb7-m { margin-bottom: 16rem; }\n .mt0-m { margin-top: 0; }\n .mt1-m { margin-top: .25rem; }\n .mt2-m { margin-top: .5rem; }\n .mt3-m { margin-top: 1rem; }\n .mt4-m { margin-top: 2rem; }\n .mt5-m { margin-top: 4rem; }\n .mt6-m { margin-top: 8rem; }\n .mt7-m { margin-top: 16rem; }\n .mv0-m { margin-top: 0; margin-bottom: 0; }\n .mv1-m { margin-top: .25rem; margin-bottom: .25rem; }\n .mv2-m { margin-top: .5rem; margin-bottom: .5rem; }\n .mv3-m { margin-top: 1rem; margin-bottom: 1rem; }\n .mv4-m { margin-top: 2rem; margin-bottom: 2rem; }\n .mv5-m { margin-top: 4rem; margin-bottom: 4rem; }\n .mv6-m { margin-top: 8rem; margin-bottom: 8rem; }\n .mv7-m { margin-top: 16rem; margin-bottom: 16rem; }\n .mh0-m { margin-left: 0; margin-right: 0; }\n .mh1-m { margin-left: .25rem; margin-right: .25rem; }\n .mh2-m { margin-left: .5rem; margin-right: .5rem; }\n .mh3-m { margin-left: 1rem; margin-right: 1rem; }\n .mh4-m { margin-left: 2rem; margin-right: 2rem; }\n .mh5-m { margin-left: 4rem; margin-right: 4rem; }\n .mh6-m { margin-left: 8rem; margin-right: 8rem; }\n .mh7-m { margin-left: 16rem; margin-right: 16rem; }\n}\n@media screen and (min-width: 60em) {\n .pa0-l { padding: 0; }\n .pa1-l { padding: .25rem; }\n .pa2-l { padding: .5rem; }\n .pa3-l { padding: 1rem; }\n .pa4-l { padding: 2rem; }\n .pa5-l { padding: 4rem; }\n .pa6-l { padding: 8rem; }\n .pa7-l { padding: 16rem; }\n .pl0-l { padding-left: 0; }\n .pl1-l { padding-left: .25rem; }\n .pl2-l { padding-left: .5rem; }\n .pl3-l { padding-left: 1rem; }\n .pl4-l { padding-left: 2rem; }\n .pl5-l { padding-left: 4rem; }\n .pl6-l { padding-left: 8rem; }\n .pl7-l { padding-left: 16rem; }\n .pr0-l { padding-right: 0; }\n .pr1-l { padding-right: .25rem; }\n .pr2-l { padding-right: .5rem; }\n .pr3-l { padding-right: 1rem; }\n .pr4-l { padding-right: 2rem; }\n .pr5-l { padding-right: 4rem; }\n .pr6-l { padding-right: 8rem; }\n .pr7-l { padding-right: 16rem; }\n .pb0-l { padding-bottom: 0; }\n .pb1-l { padding-bottom: .25rem; }\n .pb2-l { padding-bottom: .5rem; }\n .pb3-l { padding-bottom: 1rem; }\n .pb4-l { padding-bottom: 2rem; }\n .pb5-l { padding-bottom: 4rem; }\n .pb6-l { padding-bottom: 8rem; }\n .pb7-l { padding-bottom: 16rem; }\n .pt0-l { padding-top: 0; }\n .pt1-l { padding-top: .25rem; }\n .pt2-l { padding-top: .5rem; }\n .pt3-l { padding-top: 1rem; }\n .pt4-l { padding-top: 2rem; }\n .pt5-l { padding-top: 4rem; }\n .pt6-l { padding-top: 8rem; }\n .pt7-l { padding-top: 16rem; }\n .pv0-l { padding-top: 0; padding-bottom: 0; }\n .pv1-l { padding-top: .25rem; padding-bottom: .25rem; }\n .pv2-l { padding-top: .5rem; padding-bottom: .5rem; }\n .pv3-l { padding-top: 1rem; padding-bottom: 1rem; }\n .pv4-l { padding-top: 2rem; padding-bottom: 2rem; }\n .pv5-l { padding-top: 4rem; padding-bottom: 4rem; }\n .pv6-l { padding-top: 8rem; padding-bottom: 8rem; }\n .pv7-l { padding-top: 16rem; padding-bottom: 16rem; }\n .ph0-l { padding-left: 0; padding-right: 0; }\n .ph1-l { padding-left: .25rem; padding-right: .25rem; }\n .ph2-l { padding-left: .5rem; padding-right: .5rem; }\n .ph3-l { padding-left: 1rem; padding-right: 1rem; }\n .ph4-l { padding-left: 2rem; padding-right: 2rem; }\n .ph5-l { padding-left: 4rem; padding-right: 4rem; }\n .ph6-l { padding-left: 8rem; padding-right: 8rem; }\n .ph7-l { padding-left: 16rem; padding-right: 16rem; }\n .ma0-l { margin: 0; }\n .ma1-l { margin: .25rem; }\n .ma2-l { margin: .5rem; }\n .ma3-l { margin: 1rem; }\n .ma4-l { margin: 2rem; }\n .ma5-l { margin: 4rem; }\n .ma6-l { margin: 8rem; }\n .ma7-l { margin: 16rem; }\n .ml0-l { margin-left: 0; }\n .ml1-l { margin-left: .25rem; }\n .ml2-l { margin-left: .5rem; }\n .ml3-l { margin-left: 1rem; }\n .ml4-l { margin-left: 2rem; }\n .ml5-l { margin-left: 4rem; }\n .ml6-l { margin-left: 8rem; }\n .ml7-l { margin-left: 16rem; }\n .mr0-l { margin-right: 0; }\n .mr1-l { margin-right: .25rem; }\n .mr2-l { margin-right: .5rem; }\n .mr3-l { margin-right: 1rem; }\n .mr4-l { margin-right: 2rem; }\n .mr5-l { margin-right: 4rem; }\n .mr6-l { margin-right: 8rem; }\n .mr7-l { margin-right: 16rem; }\n .mb0-l { margin-bottom: 0; }\n .mb1-l { margin-bottom: .25rem; }\n .mb2-l { margin-bottom: .5rem; }\n .mb3-l { margin-bottom: 1rem; }\n .mb4-l { margin-bottom: 2rem; }\n .mb5-l { margin-bottom: 4rem; }\n .mb6-l { margin-bottom: 8rem; }\n .mb7-l { margin-bottom: 16rem; }\n .mt0-l { margin-top: 0; }\n .mt1-l { margin-top: .25rem; }\n .mt2-l { margin-top: .5rem; }\n .mt3-l { margin-top: 1rem; }\n .mt4-l { margin-top: 2rem; }\n .mt5-l { margin-top: 4rem; }\n .mt6-l { margin-top: 8rem; }\n .mt7-l { margin-top: 16rem; }\n .mv0-l { margin-top: 0; margin-bottom: 0; }\n .mv1-l { margin-top: .25rem; margin-bottom: .25rem; }\n .mv2-l { margin-top: .5rem; margin-bottom: .5rem; }\n .mv3-l { margin-top: 1rem; margin-bottom: 1rem; }\n .mv4-l { margin-top: 2rem; margin-bottom: 2rem; }\n .mv5-l { margin-top: 4rem; margin-bottom: 4rem; }\n .mv6-l { margin-top: 8rem; margin-bottom: 8rem; }\n .mv7-l { margin-top: 16rem; margin-bottom: 16rem; }\n .mh0-l { margin-left: 0; margin-right: 0; }\n .mh1-l { margin-left: .25rem; margin-right: .25rem; }\n .mh2-l { margin-left: .5rem; margin-right: .5rem; }\n .mh3-l { margin-left: 1rem; margin-right: 1rem; }\n .mh4-l { margin-left: 2rem; margin-right: 2rem; }\n .mh5-l { margin-left: 4rem; margin-right: 4rem; }\n .mh6-l { margin-left: 8rem; margin-right: 8rem; }\n .mh7-l { margin-left: 16rem; margin-right: 16rem; }\n}\n\n" }, "tachyons-tables": { @@ -14569,8 +14569,8 @@ ] } ], - "readme": "# tachyons-tables 1.0.3\n\nTables CSS module for Tachyons\n\n#### Stats\n\n165 | 5 | 6\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-tables\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-tables\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-tables.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-tables\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\n/*\n\n TABLES\n\n*/\n.collapse { border-collapse: collapse; border-spacing: 0; }\n.striped--moon-gray:nth-child(odd) { background-color: #aaa; }\n.striped--moon-gray:nth-child(odd) { background-color: #ccc; }\n.striped--light-gray:nth-child(odd) { background-color: #eee; }\n.striped--near-white:nth-child(odd) { background-color: #f4f4f4; }\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "/*\n\n TABLES\n\n*/\n\n:root {\n --light-silver: #aaa;\n --moon-gray: #ccc;\n --light-gray: #eee;\n --near-white: #f4f4f4;\n}\n\n.collapse {\n border-collapse: collapse;\n border-spacing: 0;\n}\n\n.striped--moon-gray:nth-child(odd) {\n background-color: var(--light-silver);\n}\n\n.striped--moon-gray:nth-child(odd) {\n background-color: var(--moon-gray);\n}\n\n.striped--light-gray:nth-child(odd) {\n background-color: var(--light-gray);\n}\n\n.striped--near-white:nth-child(odd) {\n background-color: var(--near-white);\n}\n", + "readme": "\n\n# TABLES\n\n### Docs\n\nhttp://tachyons.io/docs/elements/tables/\n\n### Base\n\n- collapse = border collapse\n- striped = striped table\n\n### Modifiers\n- `-light` = light stripes\n- `-dark` = dark stripes\n- `--light-silver` = light-silver stripes\n- `--moon-gray` = moon-gray stripes\n- `--light-gray` = light-gray stripes\n- `--near-white` = near-white stripes\n", + "src": "/*!!!\n\n# TABLES\n\n### Docs\n\nhttp://tachyons.io/docs/elements/tables/\n\n### Base\n\n- collapse = border collapse\n- striped = striped table\n\n### Modifiers\n- `-light` = light stripes\n- `-dark` = dark stripes\n- `--light-silver` = light-silver stripes\n- `--moon-gray` = moon-gray stripes\n- `--light-gray` = light-gray stripes\n- `--near-white` = near-white stripes\n*/\n\n.collapse {\n border-collapse: collapse;\n border-spacing: 0;\n}\n\n.striped--light-silver:nth-child(odd) {\n background-color: var(--light-silver);\n}\n\n.striped--moon-gray:nth-child(odd) {\n background-color: var(--moon-gray);\n}\n\n.striped--light-gray:nth-child(odd) {\n background-color: var(--light-gray);\n}\n\n.striped--near-white:nth-child(odd) {\n background-color: var(--near-white);\n}\n\n.stripe-light:nth-child(odd) {\n background-color: var(--white-10);\n}\n\n.stripe-dark:nth-child(odd) {\n background-color: var(--black-10);\n}\n", "css": "/*\n\n TABLES\n\n*/\n.collapse { border-collapse: collapse; border-spacing: 0; }\n.striped--moon-gray:nth-child(odd) { background-color: #aaa; }\n.striped--moon-gray:nth-child(odd) { background-color: #ccc; }\n.striped--light-gray:nth-child(odd) { background-color: #eee; }\n.striped--near-white:nth-child(odd) { background-color: #f4f4f4; }\n\n" }, "tachyons-text-align": { @@ -14691,8 +14691,8 @@ ] } ], - "readme": "# tachyons-text-align 3.1.0\n\nPerformance based css module.\n\n#### Stats\n\n354 | 16 | 16\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-text-align\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-text-align\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-text-align.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-text-align\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n TEXT ALIGN\n\n Docs: http://tachyons.io/docs/typography/text-align/\n Ref: https://developer.mozilla.org/en-US/docs/Web/CSS/text-align\n\n Base\n t = text-align\n\n Modifiers\n l = left\n r = right\n c = center\n j = justify\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n.tl { text-align: left; }\n.tr { text-align: right; }\n.tc { text-align: center; }\n.tj { text-align: justify; }\n@media screen and (min-width: 30em) {\n .tl-ns { text-align: left; }\n .tr-ns { text-align: right; }\n .tc-ns { text-align: center; }\n .tj-ns { text-align: justify; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .tl-m { text-align: left; }\n .tr-m { text-align: right; }\n .tc-m { text-align: center; }\n .tj-m { text-align: justify; }\n}\n@media screen and (min-width: 60em) {\n .tl-l { text-align: left; }\n .tr-l { text-align: right; }\n .tc-l { text-align: center; }\n .tj-l { text-align: justify; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n TEXT ALIGN\n\n Docs: http://tachyons.io/docs/typography/text-align/\n Ref: https://developer.mozilla.org/en-US/docs/Web/CSS/text-align\n\n Base\n t = text-align\n\n Modifiers\n l = left\n r = right\n c = center\n j = justify\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n\n.tl { text-align: left; }\n.tr { text-align: right; }\n.tc { text-align: center; }\n.tj { text-align: justify; }\n\n@media (--breakpoint-not-small) {\n .tl-ns { text-align: left; }\n .tr-ns { text-align: right; }\n .tc-ns { text-align: center; }\n .tj-ns { text-align: justify; }\n}\n\n@media (--breakpoint-medium) {\n .tl-m { text-align: left; }\n .tr-m { text-align: right; }\n .tc-m { text-align: center; }\n .tj-m { text-align: justify; }\n}\n\n@media (--breakpoint-large) {\n .tl-l { text-align: left; }\n .tr-l { text-align: right; }\n .tc-l { text-align: center; }\n .tj-l { text-align: justify; }\n}\n\n", + "readme": "\n\n# TEXT ALIGN\n\n### Docs\n\nhttp://tachyons.io/docs/typography/text-align/\n\n### Base\n\nt = text-align\n\n### Modifiers\n\n- l = left\n- r = right\n- c = center\n- j = justify\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# TEXT ALIGN\n\n### Docs\n\nhttp://tachyons.io/docs/typography/text-align/\n\n### Base\n\nt = text-align\n\n### Modifiers\n\n- l = left\n- r = right\n- c = center\n- j = justify\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n.tl { text-align: left; }\n.tr { text-align: right; }\n.tc { text-align: center; }\n.tj { text-align: justify; }\n\n@media (--breakpoint-small) {\n .tl-s { text-align: left; }\n .tr-s { text-align: right; }\n .tc-s { text-align: center; }\n .tj-s { text-align: justify; }\n}\n\n@media (--breakpoint-medium) {\n .tl-m { text-align: left; }\n .tr-m { text-align: right; }\n .tc-m { text-align: center; }\n .tj-m { text-align: justify; }\n}\n\n@media (--breakpoint-large) {\n .tl-l { text-align: left; }\n .tr-l { text-align: right; }\n .tc-l { text-align: center; }\n .tj-l { text-align: justify; }\n}\n", "css": "/*\n\n TEXT ALIGN\n\n Docs: http://tachyons.io/docs/typography/text-align/\n Ref: https://developer.mozilla.org/en-US/docs/Web/CSS/text-align\n\n Base\n t = text-align\n\n Modifiers\n l = left\n r = right\n c = center\n j = justify\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n.tl { text-align: left; }\n.tr { text-align: right; }\n.tc { text-align: center; }\n.tj { text-align: justify; }\n@media screen and (min-width: 30em) {\n .tl-ns { text-align: left; }\n .tr-ns { text-align: right; }\n .tc-ns { text-align: center; }\n .tj-ns { text-align: justify; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .tl-m { text-align: left; }\n .tr-m { text-align: right; }\n .tc-m { text-align: center; }\n .tj-m { text-align: justify; }\n}\n@media screen and (min-width: 60em) {\n .tl-l { text-align: left; }\n .tr-l { text-align: right; }\n .tc-l { text-align: center; }\n .tj-l { text-align: justify; }\n}\n\n" }, "tachyons-text-decoration": { @@ -14785,8 +14785,8 @@ ] } ], - "readme": "# tachyons-text-decoration 4.0.5\n\nPerformance based css module.\n\n#### Stats\n\n203 | 12 | 12\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-text-decoration\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-text-decoration\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-text-decoration.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-text-decoration\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n TEXT DECORATION\n\n*/\n.strike { text-decoration: line-through; }\n.underline { text-decoration: underline; }\n.no-underline { text-decoration: none; }\n@media screen and (min-width: 30em) {\n .strike-ns { text-decoration: line-through; }\n .underline-ns { text-decoration: underline; }\n .no-underline-ns { text-decoration: none; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .strike-m { text-decoration: line-through; }\n .underline-m { text-decoration: underline; }\n .no-underline-m { text-decoration: none; }\n}\n@media screen and (min-width: 60em) {\n .strike-l { text-decoration: line-through; }\n .underline-l { text-decoration: underline; }\n .no-underline-l { text-decoration: none; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n TEXT DECORATION\n\n*/\n\n.strike { text-decoration: line-through; }\n.underline { text-decoration: underline; }\n.no-underline { text-decoration: none; }\n\n\n@media (--breakpoint-not-small) {\n .strike-ns { text-decoration: line-through; }\n .underline-ns { text-decoration: underline; }\n .no-underline-ns { text-decoration: none; }\n}\n\n@media (--breakpoint-medium) {\n .strike-m { text-decoration: line-through; }\n .underline-m { text-decoration: underline; }\n .no-underline-m { text-decoration: none; }\n}\n\n@media (--breakpoint-large) {\n .strike-l { text-decoration: line-through; }\n .underline-l { text-decoration: underline; }\n .no-underline-l { text-decoration: none; }\n}\n", + "readme": "\n\n# TEXT DECORATION\n\n### Docs\n\nhttp://tachyons.io/docs/typography/text-decoration/\n\n### Base\n\n- strike = line-through\n- underline = underline\n- no-underline = string value 'none'\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# TEXT DECORATION\n\n### Docs\n\nhttp://tachyons.io/docs/typography/text-decoration/\n\n### Base\n\n- strike = line-through\n- underline = underline\n- no-underline = string value 'none'\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n.strike { text-decoration: line-through; }\n.underline { text-decoration: underline; }\n.no-underline { text-decoration: none; }\n\n@media (--breakpoint-small) {\n .strike-s { text-decoration: line-through; }\n .underline-s { text-decoration: underline; }\n .no-underline-s { text-decoration: none; }\n}\n\n@media (--breakpoint-medium) {\n .strike-m { text-decoration: line-through; }\n .underline-m { text-decoration: underline; }\n .no-underline-m { text-decoration: none; }\n}\n\n@media (--breakpoint-large) {\n .strike-l { text-decoration: line-through; }\n .underline-l { text-decoration: underline; }\n .no-underline-l { text-decoration: none; }\n}\n", "css": "/*\n\n TEXT DECORATION\n\n*/\n.strike { text-decoration: line-through; }\n.underline { text-decoration: underline; }\n.no-underline { text-decoration: none; }\n@media screen and (min-width: 30em) {\n .strike-ns { text-decoration: line-through; }\n .underline-ns { text-decoration: underline; }\n .no-underline-ns { text-decoration: none; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .strike-m { text-decoration: line-through; }\n .underline-m { text-decoration: underline; }\n .no-underline-m { text-decoration: none; }\n}\n@media screen and (min-width: 60em) {\n .strike-l { text-decoration: line-through; }\n .underline-l { text-decoration: underline; }\n .no-underline-l { text-decoration: none; }\n}\n\n" }, "tachyons-text-transform": { @@ -14907,8 +14907,8 @@ ] } ], - "readme": "# tachyons-text-transform 4.0.5\n\nPerformance based css module.\n\n#### Stats\n\n210 | 16 | 16\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-text-transform\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-text-transform\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-text-transform.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-text-transform\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n TEXT TRANSFORM\n\n*/\n.ttc { text-transform: capitalize; }\n.ttl { text-transform: lowercase; }\n.ttu { text-transform: uppercase; }\n.ttn { text-transform: none; }\n@media screen and (min-width: 30em) {\n .ttc-ns { text-transform: capitalize; }\n .ttl-ns { text-transform: lowercase; }\n .ttu-ns { text-transform: uppercase; }\n .ttn-ns { text-transform: none; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .ttc-m { text-transform: capitalize; }\n .ttl-m { text-transform: lowercase; }\n .ttu-m { text-transform: uppercase; }\n .ttn-m { text-transform: none; }\n}\n@media screen and (min-width: 60em) {\n .ttc-l { text-transform: capitalize; }\n .ttl-l { text-transform: lowercase; }\n .ttu-l { text-transform: uppercase; }\n .ttn-l { text-transform: none; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n TEXT TRANSFORM\n\n*/\n\n.ttc { text-transform: capitalize; }\n.ttl { text-transform: lowercase; }\n.ttu { text-transform: uppercase; }\n.ttn { text-transform: none; }\n\n@media (--breakpoint-not-small) {\n .ttc-ns { text-transform: capitalize; }\n .ttl-ns { text-transform: lowercase; }\n .ttu-ns { text-transform: uppercase; }\n .ttn-ns { text-transform: none; }\n}\n\n@media (--breakpoint-medium) {\n .ttc-m { text-transform: capitalize; }\n .ttl-m { text-transform: lowercase; }\n .ttu-m { text-transform: uppercase; }\n .ttn-m { text-transform: none; }\n}\n\n@media (--breakpoint-large) {\n .ttc-l { text-transform: capitalize; }\n .ttl-l { text-transform: lowercase; }\n .ttu-l { text-transform: uppercase; }\n .ttn-l { text-transform: none; }\n}\n", + "readme": "\n\n# TEXT TRANSFORM\n\n### Docs\n\nhttp://tachyons.io/docs/typography/text-transform/\n\n### Base\n\n- tt = text-transform\n\n### Modifiers\n\n- c = capitalize\n- l = lowercase\n- u = uppercase\n- n = none\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# TEXT TRANSFORM\n\n### Docs\n\nhttp://tachyons.io/docs/typography/text-transform/\n\n### Base\n\n- tt = text-transform\n\n### Modifiers\n\n- c = capitalize\n- l = lowercase\n- u = uppercase\n- n = none\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n.ttc { text-transform: capitalize; }\n.ttl { text-transform: lowercase; }\n.ttu { text-transform: uppercase; }\n.ttn { text-transform: none; }\n\n@media (--breakpoint-small) {\n .ttc-s { text-transform: capitalize; }\n .ttl-s { text-transform: lowercase; }\n .ttu-s { text-transform: uppercase; }\n .ttn-s { text-transform: none; }\n}\n\n@media (--breakpoint-medium) {\n .ttc-m { text-transform: capitalize; }\n .ttl-m { text-transform: lowercase; }\n .ttu-m { text-transform: uppercase; }\n .ttn-m { text-transform: none; }\n}\n\n@media (--breakpoint-large) {\n .ttc-l { text-transform: capitalize; }\n .ttl-l { text-transform: lowercase; }\n .ttu-l { text-transform: uppercase; }\n .ttn-l { text-transform: none; }\n}\n", "css": "/*\n\n TEXT TRANSFORM\n\n*/\n.ttc { text-transform: capitalize; }\n.ttl { text-transform: lowercase; }\n.ttu { text-transform: uppercase; }\n.ttn { text-transform: none; }\n@media screen and (min-width: 30em) {\n .ttc-ns { text-transform: capitalize; }\n .ttl-ns { text-transform: lowercase; }\n .ttu-ns { text-transform: uppercase; }\n .ttn-ns { text-transform: none; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .ttc-m { text-transform: capitalize; }\n .ttl-m { text-transform: lowercase; }\n .ttu-m { text-transform: uppercase; }\n .ttn-m { text-transform: none; }\n}\n@media screen and (min-width: 60em) {\n .ttc-l { text-transform: capitalize; }\n .ttl-l { text-transform: lowercase; }\n .ttu-l { text-transform: uppercase; }\n .ttn-l { text-transform: none; }\n}\n\n" }, "tachyons-type-scale": { @@ -15169,8 +15169,8 @@ ] } ], - "readme": "# tachyons-type-scale 6.1.0\n\nPerformance based css module.\n\n#### Stats\n\n531 | 44 | 36\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-type-scale\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-type-scale\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-type-scale.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-type-scale\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n TYPE SCALE\n Docs: http://tachyons.io/docs/typography/scale/\n\n Base:\n f = font-size\n\n Modifiers\n 1 = 1st step in size scale\n 2 = 2nd step in size scale\n 3 = 3rd step in size scale\n 4 = 4th step in size scale\n 5 = 5th step in size scale\n 6 = 6th step in size scale\n 7 = 7th step in size scale\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n/* For Hero Titles */\n.f-6, .f-headline { font-size: 6rem; }\n.f-5, .f-subheadline { font-size: 5rem; }\n/* Type Scale */\n.f1 { font-size: 3rem; }\n.f2 { font-size: 2.25rem; }\n.f3 { font-size: 1.5rem; }\n.f4 { font-size: 1.25rem; }\n.f5 { font-size: 1rem; }\n.f6 { font-size: .875rem; }\n.f7 { font-size: .75rem; }\n/* Small and hard to read for many people so use with extreme caution */\n@media screen and (min-width: 30em) {\n .f-6-ns, .f-headline-ns { font-size: 6rem; }\n .f-5-ns, .f-subheadline-ns { font-size: 5rem; }\n .f1-ns { font-size: 3rem; }\n .f2-ns { font-size: 2.25rem; }\n .f3-ns { font-size: 1.5rem; }\n .f4-ns { font-size: 1.25rem; }\n .f5-ns { font-size: 1rem; }\n .f6-ns { font-size: .875rem; }\n .f7-ns { font-size: .75rem; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .f-6-m, .f-headline-m { font-size: 6rem; }\n .f-5-m, .f-subheadline-m { font-size: 5rem; }\n .f1-m { font-size: 3rem; }\n .f2-m { font-size: 2.25rem; }\n .f3-m { font-size: 1.5rem; }\n .f4-m { font-size: 1.25rem; }\n .f5-m { font-size: 1rem; }\n .f6-m { font-size: .875rem; }\n .f7-m { font-size: .75rem; }\n}\n@media screen and (min-width: 60em) {\n .f-6-l, .f-headline-l { font-size: 6rem; }\n .f-5-l, .f-subheadline-l { font-size: 5rem; }\n .f1-l { font-size: 3rem; }\n .f2-l { font-size: 2.25rem; }\n .f3-l { font-size: 1.5rem; }\n .f4-l { font-size: 1.25rem; }\n .f5-l { font-size: 1rem; }\n .f6-l { font-size: .875rem; }\n .f7-l { font-size: .75rem; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n TYPE SCALE\n Docs: http://tachyons.io/docs/typography/scale/\n\n Base:\n f = font-size\n\n Modifiers\n 1 = 1st step in size scale\n 2 = 2nd step in size scale\n 3 = 3rd step in size scale\n 4 = 4th step in size scale\n 5 = 5th step in size scale\n 6 = 6th step in size scale\n 7 = 7th step in size scale\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n\n/* For Hero Titles */\n.f-6,\n.f-headline {\n font-size: 6rem;\n}\n.f-5,\n.f-subheadline {\n font-size: 5rem;\n}\n\n/* Type Scale */\n.f1 { font-size: 3rem; }\n.f2 { font-size: 2.25rem; }\n.f3 { font-size: 1.5rem; }\n.f4 { font-size: 1.25rem; }\n.f5 { font-size: 1rem; }\n.f6 { font-size: .875rem; }\n.f7 { font-size: .75rem; } /* Small and hard to read for many people so use with extreme caution */\n\n@media (--breakpoint-not-small){\n .f-6-ns,\n .f-headline-ns { font-size: 6rem; }\n .f-5-ns,\n .f-subheadline-ns { font-size: 5rem; }\n .f1-ns { font-size: 3rem; }\n .f2-ns { font-size: 2.25rem; }\n .f3-ns { font-size: 1.5rem; }\n .f4-ns { font-size: 1.25rem; }\n .f5-ns { font-size: 1rem; }\n .f6-ns { font-size: .875rem; }\n .f7-ns { font-size: .75rem; }\n}\n\n@media (--breakpoint-medium) {\n .f-6-m,\n .f-headline-m { font-size: 6rem; }\n .f-5-m,\n .f-subheadline-m { font-size: 5rem; }\n .f1-m { font-size: 3rem; }\n .f2-m { font-size: 2.25rem; }\n .f3-m { font-size: 1.5rem; }\n .f4-m { font-size: 1.25rem; }\n .f5-m { font-size: 1rem; }\n .f6-m { font-size: .875rem; }\n .f7-m { font-size: .75rem; }\n}\n\n@media (--breakpoint-large) {\n .f-6-l,\n .f-headline-l {\n font-size: 6rem;\n }\n .f-5-l,\n .f-subheadline-l {\n font-size: 5rem;\n }\n .f1-l { font-size: 3rem; }\n .f2-l { font-size: 2.25rem; }\n .f3-l { font-size: 1.5rem; }\n .f4-l { font-size: 1.25rem; }\n .f5-l { font-size: 1rem; }\n .f6-l { font-size: .875rem; }\n .f7-l { font-size: .75rem; }\n}\n", + "readme": "\n\n# TYPE SCALE\n\n### Docs\n\nhttp://tachyons.io/docs/typography/scale/\n\n### Base\n\n- f = font-size\n\n### Modifiers\n\n- 1 = 1st step in size scale\n- 2 = 2nd step in size scale\n- 3 = 3rd step in size scale\n- 4 = 4th step in size scale\n- 5 = 5th step in size scale\n- 6 = 6th step in size scale\n- 7 = 7th step in size scale\n- 8 = 8th step in size scale\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# TYPE SCALE\n\n### Docs\n\nhttp://tachyons.io/docs/typography/scale/\n\n### Base\n\n- f = font-size\n\n### Modifiers\n\n- 1 = 1st step in size scale\n- 2 = 2nd step in size scale\n- 3 = 3rd step in size scale\n- 4 = 4th step in size scale\n- 5 = 5th step in size scale\n- 6 = 6th step in size scale\n- 7 = 7th step in size scale\n- 8 = 8th step in size scale\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n/*\n * For Hero/Marketing Titles\n *\n * These generally are too large for mobile\n * so be careful using them on smaller screens.\n * */\n\n\n/* Type Scale */\n\n.f8 { font-size: 6rem; }\n.f7 { font-size: 4rem; }\n.f6 { font-size: 3rem; }\n.f5 { font-size: 2rem; }\n.f4 { font-size: 1.5rem; }\n.f3 { font-size: 1rem; }\n.f2 { font-size: .875rem; }\n.f1 { font-size: .75rem; } /* Small and hard to read for many people so use with extreme caution */\n\n@media (--breakpoint-small) {\n .f8-s { font-size: 6rem; }\n .f7-s { font-size: 4rem; }\n .f6-s { font-size: 3rem; }\n .f5-s { font-size: 2rem; }\n .f4-s { font-size: 1.5rem; }\n .f3-s { font-size: 1rem; }\n .f2-s { font-size: .875rem; }\n .f1-s { font-size: .75rem; }\n}\n\n@media (--breakpoint-medium) {\n .f8-m { font-size: 6rem; }\n .f7-m { font-size: 4rem; }\n .f6-m { font-size: 3rem; }\n .f5-m { font-size: 2rem; }\n .f4-m { font-size: 1.5rem; }\n .f3-m { font-size: 1rem; }\n .f2-m { font-size: .875rem; }\n .f1-m { font-size: .75rem; }\n}\n\n@media (--breakpoint-large) {\n .f8-l { font-size: 6rem; }\n .f7-l { font-size: 4rem; }\n .f6-l { font-size: 3rem; }\n .f5-l { font-size: 2rem; }\n .f4-l { font-size: 1.5rem; }\n .f3-l { font-size: 1rem; }\n .f2-l { font-size: .875rem; }\n .f1-l { font-size: .75rem; }\n}\n", "css": "/*\n\n TYPE SCALE\n Docs: http://tachyons.io/docs/typography/scale/\n\n Base:\n f = font-size\n\n Modifiers\n 1 = 1st step in size scale\n 2 = 2nd step in size scale\n 3 = 3rd step in size scale\n 4 = 4th step in size scale\n 5 = 5th step in size scale\n 6 = 6th step in size scale\n 7 = 7th step in size scale\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n/* For Hero Titles */\n.f-6, .f-headline { font-size: 6rem; }\n.f-5, .f-subheadline { font-size: 5rem; }\n/* Type Scale */\n.f1 { font-size: 3rem; }\n.f2 { font-size: 2.25rem; }\n.f3 { font-size: 1.5rem; }\n.f4 { font-size: 1.25rem; }\n.f5 { font-size: 1rem; }\n.f6 { font-size: .875rem; }\n.f7 { font-size: .75rem; }\n/* Small and hard to read for many people so use with extreme caution */\n@media screen and (min-width: 30em) {\n .f-6-ns, .f-headline-ns { font-size: 6rem; }\n .f-5-ns, .f-subheadline-ns { font-size: 5rem; }\n .f1-ns { font-size: 3rem; }\n .f2-ns { font-size: 2.25rem; }\n .f3-ns { font-size: 1.5rem; }\n .f4-ns { font-size: 1.25rem; }\n .f5-ns { font-size: 1rem; }\n .f6-ns { font-size: .875rem; }\n .f7-ns { font-size: .75rem; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .f-6-m, .f-headline-m { font-size: 6rem; }\n .f-5-m, .f-subheadline-m { font-size: 5rem; }\n .f1-m { font-size: 3rem; }\n .f2-m { font-size: 2.25rem; }\n .f3-m { font-size: 1.5rem; }\n .f4-m { font-size: 1.25rem; }\n .f5-m { font-size: 1rem; }\n .f6-m { font-size: .875rem; }\n .f7-m { font-size: .75rem; }\n}\n@media screen and (min-width: 60em) {\n .f-6-l, .f-headline-l { font-size: 6rem; }\n .f-5-l, .f-subheadline-l { font-size: 5rem; }\n .f1-l { font-size: 3rem; }\n .f2-l { font-size: 2.25rem; }\n .f3-l { font-size: 1.5rem; }\n .f4-l { font-size: 1.25rem; }\n .f5-l { font-size: 1rem; }\n .f6-l { font-size: .875rem; }\n .f7-l { font-size: .75rem; }\n}\n\n" }, "tachyons-typography": { @@ -15363,8 +15363,8 @@ ] } ], - "readme": "# tachyons-typography 3.0.5\n\nPerformance based css module.\n\n#### Stats\n\n460 | 24 | 40\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-typography\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-typography\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-typography.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-typography\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n TYPOGRAPHY\n\n*/\n/* Measure is limited to ~66 characters */\n.measure { max-width: 30em; }\n/* Measure is limited to ~80 characters */\n.measure-wide { max-width: 34em; }\n/* Measure is limited to ~45 characters */\n.measure-narrow { max-width: 20em; }\n/* Book paragraph style - paragraphs are indented with no vertical spacing. */\n.indent { text-indent: 1em; margin-top: 0; margin-bottom: 0; }\n.small-caps { font-variant: small-caps; }\n/* Combine this class with a width to truncate text (or just leave as is to truncate at width of containing element. */\n.truncate { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n@media screen and (min-width: 30em) {\n .measure-ns { max-width: 30em; }\n .measure-wide-ns { max-width: 34em; }\n .measure-narrow-ns { max-width: 20em; }\n .indent-ns { text-indent: 1em; margin-top: 0; margin-bottom: 0; }\n .small-caps-ns { font-variant: small-caps; }\n .truncate-ns { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .measure-m { max-width: 30em; }\n .measure-wide-m { max-width: 34em; }\n .measure-narrow-m { max-width: 20em; }\n .indent-m { text-indent: 1em; margin-top: 0; margin-bottom: 0; }\n .small-caps-m { font-variant: small-caps; }\n .truncate-m { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n}\n@media screen and (min-width: 60em) {\n .measure-l { max-width: 30em; }\n .measure-wide-l { max-width: 34em; }\n .measure-narrow-l { max-width: 20em; }\n .indent-l { text-indent: 1em; margin-top: 0; margin-bottom: 0; }\n .small-caps-l { font-variant: small-caps; }\n .truncate-l { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n TYPOGRAPHY\n\n*/\n\n\n\n/* Measure is limited to ~66 characters */\n.measure {\n max-width: 30em;\n}\n\n/* Measure is limited to ~80 characters */\n.measure-wide {\n max-width: 34em;\n}\n\n/* Measure is limited to ~45 characters */\n.measure-narrow {\n max-width: 20em;\n}\n\n/* Book paragraph style - paragraphs are indented with no vertical spacing. */\n.indent {\n text-indent: 1em;\n margin-top: 0;\n margin-bottom: 0;\n}\n\n.small-caps {\n font-variant: small-caps;\n}\n\n/* Combine this class with a width to truncate text (or just leave as is to truncate at width of containing element. */\n\n.truncate {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n@media (--breakpoint-not-small) {\n .measure-ns {\n max-width: 30em;\n }\n .measure-wide-ns {\n max-width: 34em;\n }\n .measure-narrow-ns {\n max-width: 20em;\n }\n .indent-ns {\n text-indent: 1em;\n margin-top: 0;\n margin-bottom: 0;\n }\n .small-caps-ns {\n font-variant: small-caps;\n }\n .truncate-ns {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n}\n\n@media (--breakpoint-medium) {\n .measure-m {\n max-width: 30em;\n }\n .measure-wide-m {\n max-width: 34em;\n }\n .measure-narrow-m {\n max-width: 20em;\n }\n .indent-m {\n text-indent: 1em;\n margin-top: 0;\n margin-bottom: 0;\n }\n .small-caps-m {\n font-variant: small-caps;\n }\n .truncate-m {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n}\n\n@media (--breakpoint-large) {\n .measure-l {\n max-width: 30em;\n }\n .measure-wide-l {\n max-width: 34em;\n }\n .measure-narrow-l {\n max-width: 20em;\n }\n .indent-l {\n text-indent: 1em;\n margin-top: 0;\n margin-bottom: 0;\n }\n .small-caps-l {\n font-variant: small-caps;\n }\n .truncate-l {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n}\n", + "readme": "\n\n# TYPOGRAPHY\n\n### Docs\n\nhttp://tachyons.io/docs/typography/measure/\n\n### Base \n- measure = max-width 30em\n- measure-wide = max-width 34em\n- measure-narrow = max-width 20em\n- indent = indent\n- small-caps = small caps\n- truncate = truncate\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# TYPOGRAPHY\n\n### Docs\n\nhttp://tachyons.io/docs/typography/measure/\n\n### Base \n- measure = max-width 30em\n- measure-wide = max-width 34em\n- measure-narrow = max-width 20em\n- indent = indent\n- small-caps = small caps\n- truncate = truncate\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n\n\n/* Measure is limited to ~66 characters */\n.measure {\n max-width: 30em;\n}\n\n/* Measure is limited to ~80 characters */\n.measure-wide {\n max-width: 34em;\n}\n\n/* Measure is limited to ~45 characters */\n.measure-narrow {\n max-width: 20em;\n}\n\n/* Book paragraph style - paragraphs are indented with no vertical spacing. */\n.indent {\n text-indent: 1em;\n margin-top: 0;\n margin-bottom: 0;\n}\n\n.small-caps {\n font-variant: small-caps;\n}\n\n/* Combine this class with a width to truncate text (or just leave as is to truncate at width of containing element. */\n\n.truncate {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n@media (--breakpoint-small) {\n .measure-s {\n max-width: 30em;\n }\n .measure-wide-s {\n max-width: 34em;\n }\n .measure-narrow-s {\n max-width: 20em;\n }\n .indent-s {\n text-indent: 1em;\n margin-top: 0;\n margin-bottom: 0;\n }\n .small-caps-s {\n font-variant: small-caps;\n }\n .truncate-s {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n}\n\n@media (--breakpoint-medium) {\n .measure-m {\n max-width: 30em;\n }\n .measure-wide-m {\n max-width: 34em;\n }\n .measure-narrow-m {\n max-width: 20em;\n }\n .indent-m {\n text-indent: 1em;\n margin-top: 0;\n margin-bottom: 0;\n }\n .small-caps-m {\n font-variant: small-caps;\n }\n .truncate-m {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n}\n\n@media (--breakpoint-large) {\n .measure-l {\n max-width: 30em;\n }\n .measure-wide-l {\n max-width: 34em;\n }\n .measure-narrow-l {\n max-width: 20em;\n }\n .indent-l {\n text-indent: 1em;\n margin-top: 0;\n margin-bottom: 0;\n }\n .small-caps-l {\n font-variant: small-caps;\n }\n .truncate-l {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n}\n", "css": "/*\n\n TYPOGRAPHY\n\n*/\n/* Measure is limited to ~66 characters */\n.measure { max-width: 30em; }\n/* Measure is limited to ~80 characters */\n.measure-wide { max-width: 34em; }\n/* Measure is limited to ~45 characters */\n.measure-narrow { max-width: 20em; }\n/* Book paragraph style - paragraphs are indented with no vertical spacing. */\n.indent { text-indent: 1em; margin-top: 0; margin-bottom: 0; }\n.small-caps { font-variant: small-caps; }\n/* Combine this class with a width to truncate text (or just leave as is to truncate at width of containing element. */\n.truncate { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n@media screen and (min-width: 30em) {\n .measure-ns { max-width: 30em; }\n .measure-wide-ns { max-width: 34em; }\n .measure-narrow-ns { max-width: 20em; }\n .indent-ns { text-indent: 1em; margin-top: 0; margin-bottom: 0; }\n .small-caps-ns { font-variant: small-caps; }\n .truncate-ns { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .measure-m { max-width: 30em; }\n .measure-wide-m { max-width: 34em; }\n .measure-narrow-m { max-width: 20em; }\n .indent-m { text-indent: 1em; margin-top: 0; margin-bottom: 0; }\n .small-caps-m { font-variant: small-caps; }\n .truncate-m { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n}\n@media screen and (min-width: 60em) {\n .measure-l { max-width: 30em; }\n .measure-wide-l { max-width: 34em; }\n .measure-narrow-l { max-width: 20em; }\n .indent-l { text-indent: 1em; margin-top: 0; margin-bottom: 0; }\n .small-caps-l { font-variant: small-caps; }\n .truncate-l { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n}\n\n" }, "tachyons-utilities": { @@ -15468,8 +15468,8 @@ ] } ], - "readme": "# tachyons 5.0.0-1\n\nFunctional CSS for humans\n\n### Stats\n\n317 | 13 | 17\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*!!!\n\n# UTILITIES\n\n### Base\n\n- overflow-container = horizontal scroll\n- center = margin auto\n- mr-auto = margin-right auto\n- ml-auto = margin-left auto\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n/* Equivalent to .overflow-y-scroll */\n.overflow-container { overflow-y: scroll; }\n.center { margin-right: auto; margin-left: auto; }\n.mr-auto { margin-right: auto; }\n.ml-auto { margin-left: auto; }\n@media screen and (min-width: 30em) {\n .center-s { margin-right: auto; margin-left: auto; }\n .mr-auto-s { margin-right: auto; }\n .ml-auto-s { margin-left: auto; }\n}\n@media screen and (min-width: 48em) {\n .center-m { margin-right: auto; margin-left: auto; }\n .mr-auto-m { margin-right: auto; }\n .ml-auto-m { margin-left: auto; }\n}\n@media screen and (min-width: 60em) {\n .center-l { margin-right: auto; margin-left: auto; }\n .mr-auto-l { margin-right: auto; }\n .ml-auto-l { margin-left: auto; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "\n\n\n@custom-media --breakpoint-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 48em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n/*!!!\n\n# UTILITIES\n\n### Base\n\n- overflow-container = horizontal scroll\n- center = margin auto\n- mr-auto = margin-right auto\n- ml-auto = margin-left auto\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n/* Equivalent to .overflow-y-scroll */\n.overflow-container {\n overflow-y: scroll;\n}\n\n.center {\n margin-right: auto;\n margin-left: auto;\n}\n\n.mr-auto { margin-right: auto; }\n.ml-auto { margin-left: auto; }\n\n@media (--breakpoint-small){\n .center-s {\n margin-right: auto;\n margin-left: auto;\n }\n .mr-auto-s { margin-right: auto; }\n .ml-auto-s { margin-left: auto; }\n}\n\n@media (--breakpoint-medium){\n .center-m {\n margin-right: auto;\n margin-left: auto;\n }\n .mr-auto-m { margin-right: auto; }\n .ml-auto-m { margin-left: auto; }\n}\n\n@media (--breakpoint-large){\n .center-l {\n margin-right: auto;\n margin-left: auto;\n }\n .mr-auto-l { margin-right: auto; }\n .ml-auto-l { margin-left: auto; }\n}\n", + "readme": "\n\n# UTILITIES\n\n### Base\n\n- `overflow-container` = horizontal scroll\n- `center` = margin auto\n- `mr-auto` = margin-right auto\n- `ml-auto` = margin-left auto\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# UTILITIES\n\n### Base\n\n- `overflow-container` = horizontal scroll\n- `center` = margin auto\n- `mr-auto` = margin-right auto\n- `ml-auto` = margin-left auto\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n/* Equivalent to .overflow-y-scroll */\n.overflow-container {\n overflow-y: scroll;\n}\n\n.center {\n margin-right: auto;\n margin-left: auto;\n}\n\n.mr-auto { margin-right: auto; }\n.ml-auto { margin-left: auto; }\n\n@media (--breakpoint-small) {\n .center-s {\n margin-right: auto;\n margin-left: auto;\n }\n .mr-auto-s { margin-right: auto; }\n .ml-auto-s { margin-left: auto; }\n}\n\n@media (--breakpoint-medium) {\n .center-m {\n margin-right: auto;\n margin-left: auto;\n }\n .mr-auto-m { margin-right: auto; }\n .ml-auto-m { margin-left: auto; }\n}\n\n@media (--breakpoint-large) {\n .center-l {\n margin-right: auto;\n margin-left: auto;\n }\n .mr-auto-l { margin-right: auto; }\n .ml-auto-l { margin-left: auto; }\n}\n", "css": "/*!!!\n\n# UTILITIES\n\n### Base\n\n- overflow-container = horizontal scroll\n- center = margin auto\n- mr-auto = margin-right auto\n- ml-auto = margin-left auto\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n/* Equivalent to .overflow-y-scroll */\n.overflow-container { overflow-y: scroll; }\n.center { margin-right: auto; margin-left: auto; }\n.mr-auto { margin-right: auto; }\n.ml-auto { margin-left: auto; }\n@media screen and (min-width: 30em) {\n .center-s { margin-right: auto; margin-left: auto; }\n .mr-auto-s { margin-right: auto; }\n .ml-auto-s { margin-left: auto; }\n}\n@media screen and (min-width: 48em) {\n .center-m { margin-right: auto; margin-left: auto; }\n .mr-auto-m { margin-right: auto; }\n .ml-auto-m { margin-left: auto; }\n}\n@media screen and (min-width: 60em) {\n .center-l { margin-right: auto; margin-left: auto; }\n .mr-auto-l { margin-right: auto; }\n .ml-auto-l { margin-left: auto; }\n}\n\n" }, "tachyons-vertical-align": { @@ -15590,8 +15590,8 @@ ] } ], - "readme": "# tachyons-vertical-align 4.0.5\n\nPerformance based css module.\n\n#### Stats\n\n213 | 16 | 16\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-vertical-align\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-vertical-align\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-vertical-align.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-vertical-align\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n VERTICAL ALIGN\n\n*/\n.v-base { vertical-align: baseline; }\n.v-mid { vertical-align: middle; }\n.v-top { vertical-align: top; }\n.v-btm { vertical-align: bottom; }\n@media screen and (min-width: 30em) {\n .v-base-ns { vertical-align: baseline; }\n .v-mid-ns { vertical-align: middle; }\n .v-top-ns { vertical-align: top; }\n .v-btm-ns { vertical-align: bottom; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .v-base-m { vertical-align: baseline; }\n .v-mid-m { vertical-align: middle; }\n .v-top-m { vertical-align: top; }\n .v-btm-m { vertical-align: bottom; }\n}\n@media screen and (min-width: 60em) {\n .v-base-l { vertical-align: baseline; }\n .v-mid-l { vertical-align: middle; }\n .v-top-l { vertical-align: top; }\n .v-btm-l { vertical-align: bottom; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n VERTICAL ALIGN\n\n*/\n\n.v-base { vertical-align: baseline; }\n.v-mid { vertical-align: middle; }\n.v-top { vertical-align: top; }\n.v-btm { vertical-align: bottom; }\n\n@media (--breakpoint-not-small) {\n .v-base-ns { vertical-align: baseline; }\n .v-mid-ns { vertical-align: middle; }\n .v-top-ns { vertical-align: top; }\n .v-btm-ns { vertical-align: bottom; }\n}\n\n@media (--breakpoint-medium) {\n .v-base-m { vertical-align: baseline; }\n .v-mid-m { vertical-align: middle; }\n .v-top-m { vertical-align: top; }\n .v-btm-m { vertical-align: bottom; }\n}\n\n@media (--breakpoint-large) {\n .v-base-l { vertical-align: baseline; }\n .v-mid-l { vertical-align: middle; }\n .v-top-l { vertical-align: top; }\n .v-btm-l { vertical-align: bottom; }\n}\n", + "readme": "\n\n# VERTICAL ALIGN\n\n### Base\n\n- v = vertical-align\n\n### Modifiers\n\n- `-base` = baseline\n- `-mid` = middle\n- `-top` = top\n- `-btm` = bottom\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# VERTICAL ALIGN\n\n### Base\n\n- v = vertical-align\n\n### Modifiers\n\n- `-base` = baseline\n- `-mid` = middle\n- `-top` = top\n- `-btm` = bottom\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n.v-base { vertical-align: baseline; }\n.v-mid { vertical-align: middle; }\n.v-top { vertical-align: top; }\n.v-btm { vertical-align: bottom; }\n\n@media (--breakpoint-small) {\n .v-base-s { vertical-align: baseline; }\n .v-mid-s { vertical-align: middle; }\n .v-top-s { vertical-align: top; }\n .v-btm-s { vertical-align: bottom; }\n}\n\n@media (--breakpoint-medium) {\n .v-base-m { vertical-align: baseline; }\n .v-mid-m { vertical-align: middle; }\n .v-top-m { vertical-align: top; }\n .v-btm-m { vertical-align: bottom; }\n}\n\n@media (--breakpoint-large) {\n .v-base-l { vertical-align: baseline; }\n .v-mid-l { vertical-align: middle; }\n .v-top-l { vertical-align: top; }\n .v-btm-l { vertical-align: bottom; }\n}\n", "css": "/*\n\n VERTICAL ALIGN\n\n*/\n.v-base { vertical-align: baseline; }\n.v-mid { vertical-align: middle; }\n.v-top { vertical-align: top; }\n.v-btm { vertical-align: bottom; }\n@media screen and (min-width: 30em) {\n .v-base-ns { vertical-align: baseline; }\n .v-mid-ns { vertical-align: middle; }\n .v-top-ns { vertical-align: top; }\n .v-btm-ns { vertical-align: bottom; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .v-base-m { vertical-align: baseline; }\n .v-mid-m { vertical-align: middle; }\n .v-top-m { vertical-align: top; }\n .v-btm-m { vertical-align: bottom; }\n}\n@media screen and (min-width: 60em) {\n .v-base-l { vertical-align: baseline; }\n .v-mid-l { vertical-align: middle; }\n .v-top-l { vertical-align: top; }\n .v-btm-l { vertical-align: bottom; }\n}\n\n" }, "tachyons-visibility": { @@ -15640,8 +15640,8 @@ ] } ], - "readme": "# tachyons-visibility 2.0.5\n\nPerformance based css module.\n\n#### Stats\n\n279 | 4 | 16\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-visibility\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-visibility\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-visibility.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-visibility\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n VISIBILITY\n\n*/\n/*\n Text that is hidden but accessible\n Ref: http://snook.ca/archives/html_and_css/hiding-content-for-accessibility\n*/\n.clip { position: fixed !important; _position: absolute !important; clip: rect( 1px 1px 1px 1px ); /* IE6, IE7 */ clip: rect( 1px, 1px, 1px, 1px ); }\n@media screen and (min-width: 30em) {\n .clip-ns { position: fixed !important; position: absolute !important; clip: rect( 1px 1px 1px 1px ); /* IE6, IE7 */ clip: rect( 1px, 1px, 1px, 1px ); }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .clip-m { position: fixed !important; position: absolute !important; clip: rect( 1px 1px 1px 1px ); /* IE6, IE7 */ clip: rect( 1px, 1px, 1px, 1px ); }\n}\n@media screen and (min-width: 60em) {\n .clip-l { position: fixed !important; position: absolute !important; clip: rect( 1px 1px 1px 1px ); /* IE6, IE7 */ clip: rect( 1px, 1px, 1px, 1px ); }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n VISIBILITY\n\n*/\n\n\n/*\n Text that is hidden but accessible\n Ref: http://snook.ca/archives/html_and_css/hiding-content-for-accessibility\n*/\n\n.clip {\n position: fixed !important;\n _position: absolute !important;\n clip: rect(1px 1px 1px 1px); /* IE6, IE7 */\n clip: rect(1px, 1px, 1px, 1px);\n}\n\n@media (--breakpoint-not-small) {\n .clip-ns {\n position: fixed !important;\n _position: absolute !important;\n clip: rect(1px 1px 1px 1px); /* IE6, IE7 */\n clip: rect(1px, 1px, 1px, 1px);\n }\n}\n\n@media (--breakpoint-medium) {\n .clip-m {\n position: fixed !important;\n _position: absolute !important;\n clip: rect(1px 1px 1px 1px); /* IE6, IE7 */\n clip: rect(1px, 1px, 1px, 1px);\n }\n}\n\n@media (--breakpoint-large) {\n .clip-l {\n position: fixed !important;\n _position: absolute !important;\n clip: rect(1px 1px 1px 1px); /* IE6, IE7 */\n clip: rect(1px, 1px, 1px, 1px);\n }\n}\n\n", + "readme": "\n\n# VISIBILITY\n\n### Base \n\n- clip\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# VISIBILITY\n\n### Base \n\n- clip\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n\n/*\n Text that is hidden but accessible\n Ref: http://snook.ca/archives/html_and_css/hiding-content-for-accessibility\n*/\n\n.clip {\n position: fixed !important;\n _position: absolute !important;\n clip: rect(1px 1px 1px 1px); /* IE6, IE7 */\n clip: rect(1px, 1px, 1px, 1px);\n}\n\n@media (--breakpoint-small) {\n .clip-s {\n position: fixed !important;\n _position: absolute !important;\n clip: rect(1px 1px 1px 1px); /* IE6, IE7 */\n clip: rect(1px, 1px, 1px, 1px);\n }\n}\n\n@media (--breakpoint-medium) {\n .clip-m {\n position: fixed !important;\n _position: absolute !important;\n clip: rect(1px 1px 1px 1px); /* IE6, IE7 */\n clip: rect(1px, 1px, 1px, 1px);\n }\n}\n\n@media (--breakpoint-large) {\n .clip-l {\n position: fixed !important;\n _position: absolute !important;\n clip: rect(1px 1px 1px 1px); /* IE6, IE7 */\n clip: rect(1px, 1px, 1px, 1px);\n }\n}\n", "css": "/*\n\n VISIBILITY\n\n*/\n/*\n Text that is hidden but accessible\n Ref: http://snook.ca/archives/html_and_css/hiding-content-for-accessibility\n*/\n.clip { position: fixed !important; _position: absolute !important; clip: rect( 1px 1px 1px 1px ); /* IE6, IE7 */ clip: rect( 1px, 1px, 1px, 1px ); }\n@media screen and (min-width: 30em) {\n .clip-ns { position: fixed !important; position: absolute !important; clip: rect( 1px 1px 1px 1px ); /* IE6, IE7 */ clip: rect( 1px, 1px, 1px, 1px ); }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .clip-m { position: fixed !important; position: absolute !important; clip: rect( 1px 1px 1px 1px ); /* IE6, IE7 */ clip: rect( 1px, 1px, 1px, 1px ); }\n}\n@media screen and (min-width: 60em) {\n .clip-l { position: fixed !important; position: absolute !important; clip: rect( 1px 1px 1px 1px ); /* IE6, IE7 */ clip: rect( 1px, 1px, 1px, 1px ); }\n}\n\n" }, "tachyons-white-space": { @@ -15734,8 +15734,8 @@ ] } ], - "readme": "# tachyons-white-space 4.0.6\n\nTachyons css module for setting white space across breakpoints.\n\n#### Stats\n\n185 | 12 | 12\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-white-space\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-white-space\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-white-space.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-white-space\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n WHITE SPACE\n\n*/\n.ws-normal { white-space: normal; }\n.nowrap { white-space: nowrap; }\n.pre { white-space: pre; }\n@media screen and (min-width: 30em) {\n .ws-normal-ns { white-space: normal; }\n .nowrap-ns { white-space: nowrap; }\n .pre-ns { white-space: pre; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .ws-normal-m { white-space: normal; }\n .nowrap-m { white-space: nowrap; }\n .pre-m { white-space: pre; }\n}\n@media screen and (min-width: 60em) {\n .ws-normal-l { white-space: normal; }\n .nowrap-l { white-space: nowrap; }\n .pre-l { white-space: pre; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n WHITE SPACE\n\n*/\n\n\n.ws-normal { white-space: normal; }\n.nowrap { white-space: nowrap; }\n.pre { white-space: pre; }\n\n@media (--breakpoint-not-small) {\n .ws-normal-ns { white-space: normal; }\n .nowrap-ns { white-space: nowrap; }\n .pre-ns { white-space: pre; }\n}\n\n@media (--breakpoint-medium) {\n .ws-normal-m { white-space: normal; }\n .nowrap-m { white-space: nowrap; }\n .pre-m { white-space: pre; }\n}\n\n@media (--breakpoint-large) {\n .ws-normal-l { white-space: normal; }\n .nowrap-l { white-space: nowrap; }\n .pre-l { white-space: pre; }\n}\n\n", + "readme": "\n\n# WHITE SPACE\n\n### Base\n\n- ws-normal = white-space normal\n- nowrap = white-space nowrap\n- pre = white-space pre\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# WHITE SPACE\n\n### Base\n\n- ws-normal = white-space normal\n- nowrap = white-space nowrap\n- pre = white-space pre\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n\n.ws-normal { white-space: normal; }\n.nowrap { white-space: nowrap; }\n.pre { white-space: pre; }\n\n@media (--breakpoint-small) {\n .ws-normal-s { white-space: normal; }\n .nowrap-s { white-space: nowrap; }\n .pre-s { white-space: pre; }\n}\n\n@media (--breakpoint-medium) {\n .ws-normal-m { white-space: normal; }\n .nowrap-m { white-space: nowrap; }\n .pre-m { white-space: pre; }\n}\n\n@media (--breakpoint-large) {\n .ws-normal-l { white-space: normal; }\n .nowrap-l { white-space: nowrap; }\n .pre-l { white-space: pre; }\n}\n", "css": "/*\n\n WHITE SPACE\n\n*/\n.ws-normal { white-space: normal; }\n.nowrap { white-space: nowrap; }\n.pre { white-space: pre; }\n@media screen and (min-width: 30em) {\n .ws-normal-ns { white-space: normal; }\n .nowrap-ns { white-space: nowrap; }\n .pre-ns { white-space: pre; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .ws-normal-m { white-space: normal; }\n .nowrap-m { white-space: nowrap; }\n .pre-m { white-space: pre; }\n}\n@media screen and (min-width: 60em) {\n .ws-normal-l { white-space: normal; }\n .nowrap-l { white-space: nowrap; }\n .pre-l { white-space: pre; }\n}\n\n" }, "tachyons-widths": { @@ -16360,104 +16360,10 @@ ] } ], - "readme": "# tachyons-widths 5.2.1\n\nPerformance based css module.\n\n#### Stats\n\n770 | 88 | 88\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-widths\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-widths\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-widths.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-widths\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n WIDTHS\n Docs: http://tachyons.io/docs/layout/widths/\n\n Base:\n w = width\n\n Modifiers\n 1 = 1st step in width scale\n 2 = 2nd step in width scale\n 3 = 3rd step in width scale\n 4 = 4th step in width scale\n 5 = 5th step in width scale\n\n -10 = literal value 10%\n -20 = literal value 20%\n -25 = literal value 25%\n -33 = literal value 33%\n -34 = literal value 34%\n -40 = literal value 40%\n -50 = literal value 50%\n -60 = literal value 60%\n -75 = literal value 75%\n -80 = literal value 80%\n -100 = literal value 100%\n\n -third = 100% / 3 (Not supported in opera mini or IE8)\n -two-thirds = 100% / 1.5 (Not supported in opera mini or IE8)\n -auto = string value auto\n\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n/* Width Scale */\n.w1 { width: 1rem; }\n.w2 { width: 2rem; }\n.w3 { width: 4rem; }\n.w4 { width: 8rem; }\n.w5 { width: 16rem; }\n.w-10 { width: 10%; }\n.w-20 { width: 20%; }\n.w-25 { width: 25%; }\n.w-30 { width: 30%; }\n.w-33 { width: 33%; }\n.w-34 { width: 34%; }\n.w-40 { width: 40%; }\n.w-50 { width: 50%; }\n.w-60 { width: 60%; }\n.w-70 { width: 70%; }\n.w-75 { width: 75%; }\n.w-80 { width: 80%; }\n.w-90 { width: 90%; }\n.w-100 { width: 100%; }\n.w-third { width: calc( 100% / 3 ); }\n.w-two-thirds { width: calc( 100% / 1.5 ); }\n.w-auto { width: auto; }\n@media screen and (min-width: 30em) {\n .w1-ns { width: 1rem; }\n .w2-ns { width: 2rem; }\n .w3-ns { width: 4rem; }\n .w4-ns { width: 8rem; }\n .w5-ns { width: 16rem; }\n .w-10-ns { width: 10%; }\n .w-20-ns { width: 20%; }\n .w-25-ns { width: 25%; }\n .w-30-ns { width: 30%; }\n .w-33-ns { width: 33%; }\n .w-34-ns { width: 34%; }\n .w-40-ns { width: 40%; }\n .w-50-ns { width: 50%; }\n .w-60-ns { width: 60%; }\n .w-70-ns { width: 70%; }\n .w-75-ns { width: 75%; }\n .w-80-ns { width: 80%; }\n .w-90-ns { width: 90%; }\n .w-100-ns { width: 100%; }\n .w-third-ns { width: calc( 100% / 3 ); }\n .w-two-thirds-ns { width: calc( 100% / 1.5 ); }\n .w-auto-ns { width: auto; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .w1-m { width: 1rem; }\n .w2-m { width: 2rem; }\n .w3-m { width: 4rem; }\n .w4-m { width: 8rem; }\n .w5-m { width: 16rem; }\n .w-10-m { width: 10%; }\n .w-20-m { width: 20%; }\n .w-25-m { width: 25%; }\n .w-30-m { width: 30%; }\n .w-33-m { width: 33%; }\n .w-34-m { width: 34%; }\n .w-40-m { width: 40%; }\n .w-50-m { width: 50%; }\n .w-60-m { width: 60%; }\n .w-70-m { width: 70%; }\n .w-75-m { width: 75%; }\n .w-80-m { width: 80%; }\n .w-90-m { width: 90%; }\n .w-100-m { width: 100%; }\n .w-third-m { width: calc( 100% / 3 ); }\n .w-two-thirds-m { width: calc( 100% / 1.5 ); }\n .w-auto-m { width: auto; }\n}\n@media screen and (min-width: 60em) {\n .w1-l { width: 1rem; }\n .w2-l { width: 2rem; }\n .w3-l { width: 4rem; }\n .w4-l { width: 8rem; }\n .w5-l { width: 16rem; }\n .w-10-l { width: 10%; }\n .w-20-l { width: 20%; }\n .w-25-l { width: 25%; }\n .w-30-l { width: 30%; }\n .w-33-l { width: 33%; }\n .w-34-l { width: 34%; }\n .w-40-l { width: 40%; }\n .w-50-l { width: 50%; }\n .w-60-l { width: 60%; }\n .w-70-l { width: 70%; }\n .w-75-l { width: 75%; }\n .w-80-l { width: 80%; }\n .w-90-l { width: 90%; }\n .w-100-l { width: 100%; }\n .w-third-l { width: calc( 100% / 3 ); }\n .w-two-thirds-l { width: calc( 100% / 1.5 ); }\n .w-auto-l { width: auto; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n WIDTHS\n Docs: http://tachyons.io/docs/layout/widths/\n\n Base:\n w = width\n\n Modifiers\n 1 = 1st step in width scale\n 2 = 2nd step in width scale\n 3 = 3rd step in width scale\n 4 = 4th step in width scale\n 5 = 5th step in width scale\n\n -10 = literal value 10%\n -20 = literal value 20%\n -25 = literal value 25%\n -33 = literal value 33%\n -34 = literal value 34%\n -40 = literal value 40%\n -50 = literal value 50%\n -60 = literal value 60%\n -75 = literal value 75%\n -80 = literal value 80%\n -100 = literal value 100%\n\n -third = 100% / 3 (Not supported in opera mini or IE8)\n -two-thirds = 100% / 1.5 (Not supported in opera mini or IE8)\n -auto = string value auto\n\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n\n\n/* Width Scale */\n\n.w1 { width: 1rem; }\n.w2 { width: 2rem; }\n.w3 { width: 4rem; }\n.w4 { width: 8rem; }\n.w5 { width: 16rem; }\n\n.w-10 { width: 10%; }\n.w-20 { width: 20%; }\n.w-25 { width: 25%; }\n.w-30 { width: 30%; }\n.w-33 { width: 33%; }\n.w-34 { width: 34%; }\n.w-40 { width: 40%; }\n.w-50 { width: 50%; }\n.w-60 { width: 60%; }\n.w-70 { width: 70%; }\n.w-75 { width: 75%; }\n.w-80 { width: 80%; }\n.w-90 { width: 90%; }\n.w-100 { width: 100%; }\n\n.w-third { width: calc(100% / 3); }\n.w-two-thirds { width: calc(100% / 1.5); }\n.w-auto { width: auto; }\n\n@media (--breakpoint-not-small) {\n .w1-ns { width: 1rem; }\n .w2-ns { width: 2rem; }\n .w3-ns { width: 4rem; }\n .w4-ns { width: 8rem; }\n .w5-ns { width: 16rem; }\n .w-10-ns { width: 10%; }\n .w-20-ns { width: 20%; }\n .w-25-ns { width: 25%; }\n .w-30-ns { width: 30%; }\n .w-33-ns { width: 33%; }\n .w-34-ns { width: 34%; }\n .w-40-ns { width: 40%; }\n .w-50-ns { width: 50%; }\n .w-60-ns { width: 60%; }\n .w-70-ns { width: 70%; }\n .w-75-ns { width: 75%; }\n .w-80-ns { width: 80%; }\n .w-90-ns { width: 90%; }\n .w-100-ns { width: 100%; }\n .w-third-ns { width: calc(100% / 3); }\n .w-two-thirds-ns { width: calc(100% / 1.5); }\n .w-auto-ns { width: auto; }\n}\n\n@media (--breakpoint-medium) {\n .w1-m { width: 1rem; }\n .w2-m { width: 2rem; }\n .w3-m { width: 4rem; }\n .w4-m { width: 8rem; }\n .w5-m { width: 16rem; }\n .w-10-m { width: 10%; }\n .w-20-m { width: 20%; }\n .w-25-m { width: 25%; }\n .w-30-m { width: 30%; }\n .w-33-m { width: 33%; }\n .w-34-m { width: 34%; }\n .w-40-m { width: 40%; }\n .w-50-m { width: 50%; }\n .w-60-m { width: 60%; }\n .w-70-m { width: 70%; }\n .w-75-m { width: 75%; }\n .w-80-m { width: 80%; }\n .w-90-m { width: 90%; }\n .w-100-m { width: 100%; }\n .w-third-m { width: calc(100% / 3); }\n .w-two-thirds-m { width: calc(100% / 1.5); }\n .w-auto-m { width: auto; }\n}\n\n@media (--breakpoint-large) {\n .w1-l { width: 1rem; }\n .w2-l { width: 2rem; }\n .w3-l { width: 4rem; }\n .w4-l { width: 8rem; }\n .w5-l { width: 16rem; }\n .w-10-l { width: 10%; }\n .w-20-l { width: 20%; }\n .w-25-l { width: 25%; }\n .w-30-l { width: 30%; }\n .w-33-l { width: 33%; }\n .w-34-l { width: 34%; }\n .w-40-l { width: 40%; }\n .w-50-l { width: 50%; }\n .w-60-l { width: 60%; }\n .w-70-l { width: 70%; }\n .w-75-l { width: 75%; }\n .w-80-l { width: 80%; }\n .w-90-l { width: 90%; }\n .w-100-l { width: 100%; }\n .w-third-l { width: calc(100% / 3); }\n .w-two-thirds-l { width: calc(100% / 1.5); }\n .w-auto-l { width: auto; }\n}\n", + "readme": "\n\n# WIDTHS\n\n### Docs\n\nhttp://tachyons.io/docs/layout/widths/\n\n### Base\n\n- w = width\n\n### Modifiers\n\n- 1 = 1st step in width scale\n- 2 = 2nd step in width scale\n- 3 = 3rd step in width scale\n- 4 = 4th step in width scale\n- 5 = 5th step in width scale\n\n- -10 = literal value 10%\n- -20 = literal value 20%\n- -25 = literal value 25%\n- -30 = literal value 30%\n- -40 = literal value 40%\n- -50 = literal value 50%\n- -60 = literal value 60%\n- -70 = literal value 70%\n- -75 = literal value 75%\n- -80 = literal value 80%\n- -90 = literal value 90%\n- -100 = literal value 100%\n\n- `-third` = 100% / 3 (Not supported in opera mini or IE8)\n- `-two-thirds` = 100% / 1.5 (Not supported in opera mini or IE8)\n- `-auto` = string value auto\n\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n", + "src": "/*!!!\n\n# WIDTHS\n\n### Docs\n\nhttp://tachyons.io/docs/layout/widths/\n\n### Base\n\n- w = width\n\n### Modifiers\n\n- 1 = 1st step in width scale\n- 2 = 2nd step in width scale\n- 3 = 3rd step in width scale\n- 4 = 4th step in width scale\n- 5 = 5th step in width scale\n\n- -10 = literal value 10%\n- -20 = literal value 20%\n- -25 = literal value 25%\n- -30 = literal value 30%\n- -40 = literal value 40%\n- -50 = literal value 50%\n- -60 = literal value 60%\n- -70 = literal value 70%\n- -75 = literal value 75%\n- -80 = literal value 80%\n- -90 = literal value 90%\n- -100 = literal value 100%\n\n- `-third` = 100% / 3 (Not supported in opera mini or IE8)\n- `-two-thirds` = 100% / 1.5 (Not supported in opera mini or IE8)\n- `-auto` = string value auto\n\n\n### Media Query Extensions\n\n- `-s` = small\n- `-m` = medium\n- `-l` = large\n*/\n\n/* Width Scale */\n\n.w1 { width: 1rem; }\n.w2 { width: 2rem; }\n.w3 { width: 4rem; }\n.w4 { width: 8rem; }\n.w5 { width: 16rem; }\n\n.w-10 { width: 10%; }\n.w-20 { width: 20%; }\n.w-25 { width: 25%; }\n.w-30 { width: 30%; }\n.w-40 { width: 40%; }\n.w-50 { width: 50%; }\n.w-60 { width: 60%; }\n.w-70 { width: 70%; }\n.w-75 { width: 75%; }\n.w-80 { width: 80%; }\n.w-90 { width: 90%; }\n.w-100 { width: 100%; }\n\n.w-third { width: calc(100% / 3); }\n.w-two-thirds { width: calc(100% / 1.5); }\n.w-auto { width: auto; }\n\n@media (--breakpoint-small) {\n .w1-s { width: 1rem; }\n .w2-s { width: 2rem; }\n .w3-s { width: 4rem; }\n .w4-s { width: 8rem; }\n .w5-s { width: 16rem; }\n .w-10-s { width: 10%; }\n .w-20-s { width: 20%; }\n .w-25-s { width: 25%; }\n .w-30-s { width: 30%; }\n .w-40-s { width: 40%; }\n .w-50-s { width: 50%; }\n .w-60-s { width: 60%; }\n .w-70-s { width: 70%; }\n .w-75-s { width: 75%; }\n .w-80-s { width: 80%; }\n .w-90-s { width: 90%; }\n .w-100-s { width: 100%; }\n .w-third-s { width: calc(100% / 3); }\n .w-two-thirds-s { width: calc(100% / 1.5); }\n .w-auto-s { width: auto; }\n}\n\n@media (--breakpoint-medium) {\n .w1-m { width: 1rem; }\n .w2-m { width: 2rem; }\n .w3-m { width: 4rem; }\n .w4-m { width: 8rem; }\n .w5-m { width: 16rem; }\n .w-10-m { width: 10%; }\n .w-20-m { width: 20%; }\n .w-25-m { width: 25%; }\n .w-30-m { width: 30%; }\n .w-40-m { width: 40%; }\n .w-50-m { width: 50%; }\n .w-60-m { width: 60%; }\n .w-70-m { width: 70%; }\n .w-75-m { width: 75%; }\n .w-80-m { width: 80%; }\n .w-90-m { width: 90%; }\n .w-100-m { width: 100%; }\n .w-third-m { width: calc(100% / 3); }\n .w-two-thirds-m { width: calc(100% / 1.5); }\n .w-auto-m { width: auto; }\n}\n\n@media (--breakpoint-large) {\n .w1-l { width: 1rem; }\n .w2-l { width: 2rem; }\n .w3-l { width: 4rem; }\n .w4-l { width: 8rem; }\n .w5-l { width: 16rem; }\n .w-10-l { width: 10%; }\n .w-20-l { width: 20%; }\n .w-25-l { width: 25%; }\n .w-30-l { width: 30%; }\n .w-40-l { width: 40%; }\n .w-50-l { width: 50%; }\n .w-60-l { width: 60%; }\n .w-70-l { width: 70%; }\n .w-75-l { width: 75%; }\n .w-80-l { width: 80%; }\n .w-90-l { width: 90%; }\n .w-100-l { width: 100%; }\n .w-third-l { width: calc(100% / 3); }\n .w-two-thirds-l { width: calc(100% / 1.5); }\n .w-auto-l { width: auto; }\n}\n", "css": "/*\n\n WIDTHS\n Docs: http://tachyons.io/docs/layout/widths/\n\n Base:\n w = width\n\n Modifiers\n 1 = 1st step in width scale\n 2 = 2nd step in width scale\n 3 = 3rd step in width scale\n 4 = 4th step in width scale\n 5 = 5th step in width scale\n\n -10 = literal value 10%\n -20 = literal value 20%\n -25 = literal value 25%\n -33 = literal value 33%\n -34 = literal value 34%\n -40 = literal value 40%\n -50 = literal value 50%\n -60 = literal value 60%\n -75 = literal value 75%\n -80 = literal value 80%\n -100 = literal value 100%\n\n -third = 100% / 3 (Not supported in opera mini or IE8)\n -two-thirds = 100% / 1.5 (Not supported in opera mini or IE8)\n -auto = string value auto\n\n\n Media Query Extensions:\n -ns = not-small\n -m = medium\n -l = large\n\n*/\n/* Width Scale */\n.w1 { width: 1rem; }\n.w2 { width: 2rem; }\n.w3 { width: 4rem; }\n.w4 { width: 8rem; }\n.w5 { width: 16rem; }\n.w-10 { width: 10%; }\n.w-20 { width: 20%; }\n.w-25 { width: 25%; }\n.w-30 { width: 30%; }\n.w-33 { width: 33%; }\n.w-34 { width: 34%; }\n.w-40 { width: 40%; }\n.w-50 { width: 50%; }\n.w-60 { width: 60%; }\n.w-70 { width: 70%; }\n.w-75 { width: 75%; }\n.w-80 { width: 80%; }\n.w-90 { width: 90%; }\n.w-100 { width: 100%; }\n.w-third { width: calc( 100% / 3 ); }\n.w-two-thirds { width: calc( 100% / 1.5 ); }\n.w-auto { width: auto; }\n@media screen and (min-width: 30em) {\n .w1-ns { width: 1rem; }\n .w2-ns { width: 2rem; }\n .w3-ns { width: 4rem; }\n .w4-ns { width: 8rem; }\n .w5-ns { width: 16rem; }\n .w-10-ns { width: 10%; }\n .w-20-ns { width: 20%; }\n .w-25-ns { width: 25%; }\n .w-30-ns { width: 30%; }\n .w-33-ns { width: 33%; }\n .w-34-ns { width: 34%; }\n .w-40-ns { width: 40%; }\n .w-50-ns { width: 50%; }\n .w-60-ns { width: 60%; }\n .w-70-ns { width: 70%; }\n .w-75-ns { width: 75%; }\n .w-80-ns { width: 80%; }\n .w-90-ns { width: 90%; }\n .w-100-ns { width: 100%; }\n .w-third-ns { width: calc( 100% / 3 ); }\n .w-two-thirds-ns { width: calc( 100% / 1.5 ); }\n .w-auto-ns { width: auto; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .w1-m { width: 1rem; }\n .w2-m { width: 2rem; }\n .w3-m { width: 4rem; }\n .w4-m { width: 8rem; }\n .w5-m { width: 16rem; }\n .w-10-m { width: 10%; }\n .w-20-m { width: 20%; }\n .w-25-m { width: 25%; }\n .w-30-m { width: 30%; }\n .w-33-m { width: 33%; }\n .w-34-m { width: 34%; }\n .w-40-m { width: 40%; }\n .w-50-m { width: 50%; }\n .w-60-m { width: 60%; }\n .w-70-m { width: 70%; }\n .w-75-m { width: 75%; }\n .w-80-m { width: 80%; }\n .w-90-m { width: 90%; }\n .w-100-m { width: 100%; }\n .w-third-m { width: calc( 100% / 3 ); }\n .w-two-thirds-m { width: calc( 100% / 1.5 ); }\n .w-auto-m { width: auto; }\n}\n@media screen and (min-width: 60em) {\n .w1-l { width: 1rem; }\n .w2-l { width: 2rem; }\n .w3-l { width: 4rem; }\n .w4-l { width: 8rem; }\n .w5-l { width: 16rem; }\n .w-10-l { width: 10%; }\n .w-20-l { width: 20%; }\n .w-25-l { width: 25%; }\n .w-30-l { width: 30%; }\n .w-33-l { width: 33%; }\n .w-34-l { width: 34%; }\n .w-40-l { width: 40%; }\n .w-50-l { width: 50%; }\n .w-60-l { width: 60%; }\n .w-70-l { width: 70%; }\n .w-75-l { width: 75%; }\n .w-80-l { width: 80%; }\n .w-90-l { width: 90%; }\n .w-100-l { width: 100%; }\n .w-third-l { width: calc( 100% / 3 ); }\n .w-two-thirds-l { width: calc( 100% / 1.5 ); }\n .w-auto-l { width: auto; }\n}\n\n" }, - "tachyons-word-break": { - "name": "tachyons-word-break", - "version": "3.0.4", - "metadata": {}, - "tableOfStyles": [ - { - "selector": ".word-normal", - "moduleName": "/Users/johno/c/tachyons/docs/tachyons-word-break", - "declarations": [ - "word-break: normal" - ] - }, - { - "selector": ".word-wrap", - "moduleName": "/Users/johno/c/tachyons/docs/tachyons-word-break", - "declarations": [ - "word-break: break-all" - ] - }, - { - "selector": ".word-nowrap", - "moduleName": "/Users/johno/c/tachyons/docs/tachyons-word-break", - "declarations": [ - "word-break: keep-all" - ] - }, - { - "selector": ".word-normal-ns", - "moduleName": "/Users/johno/c/tachyons/docs/tachyons-word-break", - "declarations": [ - "word-break: normal" - ] - }, - { - "selector": ".word-wrap-ns", - "moduleName": "/Users/johno/c/tachyons/docs/tachyons-word-break", - "declarations": [ - "word-break: break-all" - ] - }, - { - "selector": ".word-nowrap-ns", - "moduleName": "/Users/johno/c/tachyons/docs/tachyons-word-break", - "declarations": [ - "word-break: keep-all" - ] - }, - { - "selector": ".word-normal-m", - "moduleName": "/Users/johno/c/tachyons/docs/tachyons-word-break", - "declarations": [ - "word-break: normal" - ] - }, - { - "selector": ".word-wrap-m", - "moduleName": "/Users/johno/c/tachyons/docs/tachyons-word-break", - "declarations": [ - "word-break: break-all" - ] - }, - { - "selector": ".word-nowrap-m", - "moduleName": "/Users/johno/c/tachyons/docs/tachyons-word-break", - "declarations": [ - "word-break: keep-all" - ] - }, - { - "selector": ".word-normal-l", - "moduleName": "/Users/johno/c/tachyons/docs/tachyons-word-break", - "declarations": [ - "word-break: normal" - ] - }, - { - "selector": ".word-wrap-l", - "moduleName": "/Users/johno/c/tachyons/docs/tachyons-word-break", - "declarations": [ - "word-break: break-all" - ] - }, - { - "selector": ".word-nowrap-l", - "moduleName": "/Users/johno/c/tachyons/docs/tachyons-word-break", - "declarations": [ - "word-break: keep-all" - ] - } - ], - "readme": "# tachyons-word-break 3.0.0\n\nTachyons CSS module of utilities for setting word-break\n\n#### Stats\n\n187 | 12 | 12\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-word-break\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-word-break\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-word-break.git\n```\n\n## Usage\n\n#### Using with [PostCSS](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-word-break\";\n```\n\nThen process the CSS using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the CSS\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built CSS is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source CSS files can be found in the `src` directory.\nRunning `$ npm start` will process the source CSS and place the built CSS in the `css` directory.\n\n## The CSS\n\n```css\n/*\n\n WORD BREAK\n\n*/\n.word-normal { word-break: normal; }\n.word-wrap { word-break: break-all; }\n.word-nowrap { word-break: keep-all; }\n@media screen and (min-width: 30em) {\n .word-normal-ns { word-break: normal; }\n .word-wrap-ns { word-break: break-all; }\n .word-nowrap-ns { word-break: keep-all; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .word-normal-m { word-break: normal; }\n .word-wrap-m { word-break: break-all; }\n .word-nowrap-m { word-break: keep-all; }\n}\n@media screen and (min-width: 60em) {\n .word-normal-l { word-break: normal; }\n .word-wrap-l { word-break: break-all; }\n .word-nowrap-l { word-break: keep-all; }\n}\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "@custom-media --breakpoint-not-small screen and (min-width: 30em);\n@custom-media --breakpoint-medium screen and (min-width: 30em) and (max-width: 60em);\n@custom-media --breakpoint-large screen and (min-width: 60em);\n\n/*\n\n WORD BREAK\n\n*/\n\n.word-normal { word-break: normal; }\n.word-wrap { word-break: break-all; }\n.word-nowrap { word-break: keep-all; }\n\n@media (--breakpoint-not-small) {\n .word-normal-ns { word-break: normal; }\n .word-wrap-ns { word-break: break-all; }\n .word-nowrap-ns { word-break: keep-all; }\n}\n\n@media (--breakpoint-medium) {\n .word-normal-m { word-break: normal; }\n .word-wrap-m { word-break: break-all; }\n .word-nowrap-m { word-break: keep-all; }\n}\n\n@media (--breakpoint-large) {\n .word-normal-l { word-break: normal; }\n .word-wrap-l { word-break: break-all; }\n .word-nowrap-l { word-break: keep-all; }\n}\n\n", - "css": "/*\n\n WORD BREAK\n\n*/\n.word-normal { word-break: normal; }\n.word-wrap { word-break: break-all; }\n.word-nowrap { word-break: keep-all; }\n@media screen and (min-width: 30em) {\n .word-normal-ns { word-break: normal; }\n .word-wrap-ns { word-break: break-all; }\n .word-nowrap-ns { word-break: keep-all; }\n}\n@media screen and (min-width: 30em) and (max-width: 60em) {\n .word-normal-m { word-break: normal; }\n .word-wrap-m { word-break: break-all; }\n .word-nowrap-m { word-break: keep-all; }\n}\n@media screen and (min-width: 60em) {\n .word-normal-l { word-break: normal; }\n .word-wrap-l { word-break: break-all; }\n .word-nowrap-l { word-break: keep-all; }\n}\n\n" - }, "tachyons-z-index": { "name": "tachyons-z-index", "version": "1.0.9", @@ -16548,8 +16454,8 @@ ] } ], - "readme": "# tachyons-z-index 1.0.9\n\nTachyons css module for setting z-index on elements\n\n#### Stats\n\n510 | 12 | 12\n---|---|---\nbytes | selectors | declarations\n\n## Installation\n\n#### With [npm](https://npmjs.com)\n\n```\nnpm install --save-dev tachyons-z-index\n```\n\nLearn more about using css installed with npm:\n* https://webpack.github.io/docs/stylesheets.html\n* https://github.com/defunctzombie/npm-css\n\n#### With Git\n\nhttp:\n```\ngit clone https://github.com/tachyons-css/tachyons-z-index\n```\n\nssh:\n```\ngit clone git@github.com:tachyons-css/tachyons-z-index.git\n```\n\n## Usage\n\n#### Using with [Postcss](https://github.com/postcss/postcss)\n\nImport the css module\n\n```css\n@import \"tachyons-z-index\";\n```\n\nThen process the css using the [`tachyons-cli`](https://github.com/tachyons-css/tachyons-cli)\n\n```sh\n$ npm i -g tachyons-cli\n$ tachyons path/to/css-file.css > dist/t.css\n```\n\n#### Using the css\n\n##### CDN\nThe easiest and most simple way to use the css is to use the cdn hosted version. Include it in the head of your html with:\n\n```\n\n```\n\n##### Locally\nThe built css is located in the `css` directory. It contains an unminified and minified version.\nYou can either cut and paste that css or link to it directly in your html.\n\n```html\n\n```\n\n#### Development\n\nThe source css files can be found in the `src` directory.\nRunning `$ npm start` will process the source css and place the built css in the `css` directory.\n\n## The css\n\n```css\n/*\n\n Z-INDEX\n\n Base\n z = z-index\n\n Modifiers\n -0 = literal value 0\n -1 = literal value 1\n -2 = literal value 2\n -3 = literal value 3\n -4 = literal value 4\n -5 = literal value 5\n -999 = literal value 999\n -9999 = literal value 9999\n\n -max = largest accepted z-index value as integer\n\n -inherit = string value inherit\n -initial = string value initial\n -unset = string value unset\n\n MDN: https://developer.mozilla.org/en/docs/Web/CSS/z-index\n Spec: http://www.w3.org/TR/CSS2/zindex.html\n Articles:\n https://philipwalton.com/articles/what-no-one-told-you-about-z-index/\n\n Tips on extending:\n There might be a time worth using negative z-index values.\n Or if you are using tachyons with another project, you might need to\n adjust these values to suit your needs.\n\n*/\n.z-0 { z-index: 0; }\n.z-1 { z-index: 1; }\n.z-2 { z-index: 2; }\n.z-3 { z-index: 3; }\n.z-4 { z-index: 4; }\n.z-5 { z-index: 5; }\n.z-999 { z-index: 999; }\n.z-9999 { z-index: 9999; }\n.z-max { z-index: 2147483647; }\n.z-inherit { z-index: inherit; }\n.z-initial { z-index: initial; }\n.z-unset { z-index: unset; }\n```\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Authors\n\n* [mrmrs](http://mrmrs.io)\n* [johno](http://johnotander.com)\n\n## License\n\nISC\n\n", - "src": "/*\n\n Z-INDEX\n\n Base\n z = z-index\n\n Modifiers\n -0 = literal value 0\n -1 = literal value 1\n -2 = literal value 2\n -3 = literal value 3\n -4 = literal value 4\n -5 = literal value 5\n -999 = literal value 999\n -9999 = literal value 9999\n\n -max = largest accepted z-index value as integer\n\n -inherit = string value inherit\n -initial = string value initial\n -unset = string value unset\n\n MDN: https://developer.mozilla.org/en/docs/Web/CSS/z-index\n Spec: http://www.w3.org/TR/CSS2/zindex.html\n Articles:\n https://philipwalton.com/articles/what-no-one-told-you-about-z-index/\n\n Tips on extending:\n There might be a time worth using negative z-index values.\n Or if you are using tachyons with another project, you might need to\n adjust these values to suit your needs.\n\n*/\n\n.z-0 { z-index: 0; }\n.z-1 { z-index: 1; }\n.z-2 { z-index: 2; }\n.z-3 { z-index: 3; }\n.z-4 { z-index: 4; }\n.z-5 { z-index: 5; }\n\n.z-999 { z-index: 999; }\n.z-9999 { z-index: 9999; }\n\n.z-max {\n z-index: 2147483647;\n}\n\n.z-inherit { z-index: inherit; }\n.z-initial { z-index: initial; }\n.z-unset { z-index: unset; }\n\n", + "readme": "\n\n# Z-INDEX\n\n### Base\n\n- z = z-index\n\n### Modifiers\n\n- -0 = literal value 0\n- -1 = literal value 1\n- -2 = literal value 2\n- -3 = literal value 3\n- -4 = literal value 4\n- -5 = literal value 5\n- -999 = literal value 999\n- -9999 = literal value 9999\n\n- `-max` = largest accepted z-index value as integer\n\n- `-inherit` = string value inherit\n- `-initial` = string value initial\n- `-unset` = string value unset\n\n### MDN\n\nhttps://developer.mozilla.org/en/docs/Web/CSS/z-index\n\n### Spec\n\nhttp://www.w3.org/TR/CSS2/zindex.html\n\n### Articles:\nhttps://philipwalton.com/articles/what-no-one-told-you-about-z-index/\n\n### Tips on extending\n\nThere might be a time worth using negative z-index values.\nOr if you are using tachyons with another project, you might need to\nadjust these values to suit your needs.\n", + "src": "/*!!!\n\n# Z-INDEX\n\n### Base\n\n- z = z-index\n\n### Modifiers\n\n- -0 = literal value 0\n- -1 = literal value 1\n- -2 = literal value 2\n- -3 = literal value 3\n- -4 = literal value 4\n- -5 = literal value 5\n- -999 = literal value 999\n- -9999 = literal value 9999\n\n- `-max` = largest accepted z-index value as integer\n\n- `-inherit` = string value inherit\n- `-initial` = string value initial\n- `-unset` = string value unset\n\n### MDN\n\nhttps://developer.mozilla.org/en/docs/Web/CSS/z-index\n\n### Spec\n\nhttp://www.w3.org/TR/CSS2/zindex.html\n\n### Articles:\nhttps://philipwalton.com/articles/what-no-one-told-you-about-z-index/\n\n### Tips on extending\n\nThere might be a time worth using negative z-index values.\nOr if you are using tachyons with another project, you might need to\nadjust these values to suit your needs.\n*/\n\n.z-0 { z-index: 0; }\n.z-1 { z-index: 1; }\n.z-2 { z-index: 2; }\n.z-3 { z-index: 3; }\n.z-4 { z-index: 4; }\n.z-5 { z-index: 5; }\n\n.z-999 { z-index: 999; }\n.z-9999 { z-index: 9999; }\n\n.z-max {\n z-index: 2147483647;\n}\n\n.z-inherit { z-index: inherit; }\n.z-initial { z-index: initial; }\n.z-unset { z-index: unset; }\n", "css": "/*\n\n Z-INDEX\n\n Base\n z = z-index\n\n Modifiers\n -0 = literal value 0\n -1 = literal value 1\n -2 = literal value 2\n -3 = literal value 3\n -4 = literal value 4\n -5 = literal value 5\n -999 = literal value 999\n -9999 = literal value 9999\n\n -max = largest accepted z-index value as integer\n\n -inherit = string value inherit\n -initial = string value initial\n -unset = string value unset\n\n MDN: https://developer.mozilla.org/en/docs/Web/CSS/z-index\n Spec: http://www.w3.org/TR/CSS2/zindex.html\n Articles:\n https://philipwalton.com/articles/what-no-one-told-you-about-z-index/\n\n Tips on extending:\n There might be a time worth using negative z-index values.\n Or if you are using tachyons with another project, you might need to\n adjust these values to suit your needs.\n\n*/\n.z-0 { z-index: 0; }\n.z-1 { z-index: 1; }\n.z-2 { z-index: 2; }\n.z-3 { z-index: 3; }\n.z-4 { z-index: 4; }\n.z-5 { z-index: 5; }\n.z-999 { z-index: 999; }\n.z-9999 { z-index: 9999; }\n.z-max { z-index: 2147483647; }\n.z-inherit { z-index: inherit; }\n.z-initial { z-index: initial; }\n.z-unset { z-index: unset; }\n\n" } }