diff --git a/build.js b/build.js index f9b63563f..e3b74141b 100644 --- a/build.js +++ b/build.js @@ -4,22 +4,22 @@ const prettyHrtime = require('pretty-hrtime'); const startTime = process.hrtime(); -// require('./src/header-build')() + require('./src/header-build')() // require('./src/gallery-build')() -// require('./src/resources-build')() -// console.log('header build complete') -// require('./src/table-of-styles-build')() -// console.log('table of styles build complete') -// require('./src/table-of-properties-build')() -// console.log('table of properties build complete') -// require('./src/home-build')() -// console.log('home build complete') + //require('./src/resources-build')() + console.log('header build complete') + require('./src/table-of-styles-build')() + console.log('table of styles build complete') + require('./src/table-of-properties-build')() + console.log('table of properties build complete') + require('./src/home-build')() + console.log('home build complete') -const componentsBuildList = require('./src/components-build-list'); -const componentsBuildIndex = require('./src/components-build-index'); -const componentsBuildRSS = require('./src/components-build-rss'); -const componentsBuildPages = require('./src/components-build-pages'); -const componentsBuildScreenshots = require('./src/components-build-screenshots'); +//const componentsBuildList = require('./src/components-build-list'); +//const componentsBuildIndex = require('./src/components-build-index'); +//const componentsBuildRSS = require('./src/components-build-rss'); +//const componentsBuildPages = require('./src/components-build-pages'); +//const componentsBuildScreenshots = require('./src/components-build-screenshots'); // See src/components-build-defaults for list of options that can be overriden const options = { @@ -48,11 +48,11 @@ const options = { // as the new one (i.e. no need to re-generate *all* the screenshots unless you made // modifications to the screenshots script itself). co(function* generator() { - yield componentsBuildList(options); // <- builds temporary components list (JSON) - yield componentsBuildIndex(options); // <- builds index pages (by category & most recent) - yield componentsBuildRSS(options); // <- builds RSS feed - yield componentsBuildPages(options); // <- comment to skip building pages - yield componentsBuildScreenshots(options); // <- comment to skip building screenshots + //yield componentsBuildList(options); // <- builds temporary components list (JSON) + //yield componentsBuildIndex(options); // <- builds index pages (by category & most recent) + //yield componentsBuildRSS(options); // <- builds RSS feed + //yield componentsBuildPages(options); // <- comment to skip building pages + //yield componentsBuildScreenshots(options); // <- comment to skip building screenshots }).then(() => { const elapsed = process.hrtime(startTime); console.log(chalk.green('All done'), chalk.dim(prettyHrtime(elapsed))); diff --git a/components/article-lists/title-preview-author-media-flipped/index.html b/components/article-lists/title-preview-author-media-flipped/index.html index 9778ba5cf..6d67d4cc8 100644 --- a/components/article-lists/title-preview-author-media-flipped/index.html +++ b/components/article-lists/title-preview-author-media-flipped/index.html @@ -1103,7 +1103,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1114,7 +1114,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/article-lists/title-preview-author-media-flipped/screenshot.jpg b/components/article-lists/title-preview-author-media-flipped/screenshot.jpg index a1a248b5b..e995a4eab 100644 Binary files a/components/article-lists/title-preview-author-media-flipped/screenshot.jpg and b/components/article-lists/title-preview-author-media-flipped/screenshot.jpg differ diff --git a/components/article-lists/title-preview-author-media/index.html b/components/article-lists/title-preview-author-media/index.html index bb4e6c363..ae7e22fb8 100644 --- a/components/article-lists/title-preview-author-media/index.html +++ b/components/article-lists/title-preview-author-media/index.html @@ -1118,7 +1118,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1129,7 +1129,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/article-lists/title-preview-author-media/screenshot.jpg b/components/article-lists/title-preview-author-media/screenshot.jpg index bd412aca0..1a8e46fc4 100644 Binary files a/components/article-lists/title-preview-author-media/screenshot.jpg and b/components/article-lists/title-preview-author-media/screenshot.jpg differ diff --git a/components/articles/feature/index.html b/components/articles/feature/index.html index aab6d4541..8a1ba739f 100644 --- a/components/articles/feature/index.html +++ b/components/articles/feature/index.html @@ -1083,7 +1083,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1094,7 +1094,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/articles/feature/screenshot.jpg b/components/articles/feature/screenshot.jpg index bf5543251..50c9f9583 100644 Binary files a/components/articles/feature/screenshot.jpg and b/components/articles/feature/screenshot.jpg differ diff --git a/components/articles/full-bleed-background/index.html b/components/articles/full-bleed-background/index.html index fc5eda4c4..18a7fe054 100644 --- a/components/articles/full-bleed-background/index.html +++ b/components/articles/full-bleed-background/index.html @@ -1010,7 +1010,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1021,7 +1021,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/articles/full-bleed-background/screenshot.jpg b/components/articles/full-bleed-background/screenshot.jpg index a1a14c1fa..df4d71724 100644 Binary files a/components/articles/full-bleed-background/screenshot.jpg and b/components/articles/full-bleed-background/screenshot.jpg differ diff --git a/components/articles/headline-title-text/index.html b/components/articles/headline-title-text/index.html index fa5a63acf..e321d53f0 100644 --- a/components/articles/headline-title-text/index.html +++ b/components/articles/headline-title-text/index.html @@ -890,7 +890,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -901,7 +901,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/articles/headline-title-text/screenshot.jpg b/components/articles/headline-title-text/screenshot.jpg index 2619a5b94..97ef62cd0 100644 Binary files a/components/articles/headline-title-text/screenshot.jpg and b/components/articles/headline-title-text/screenshot.jpg differ diff --git a/components/articles/large-title-text/index.html b/components/articles/large-title-text/index.html index 52432acf2..b4f414b9a 100644 --- a/components/articles/large-title-text/index.html +++ b/components/articles/large-title-text/index.html @@ -890,7 +890,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -901,7 +901,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/articles/left-title-top-border/index.html b/components/articles/left-title-top-border/index.html index 58fa442d0..1a7b3512b 100644 --- a/components/articles/left-title-top-border/index.html +++ b/components/articles/left-title-top-border/index.html @@ -211,7 +211,7 @@

css

@media screen and (min-width: 30em) { .fl-ns { float: left; - display: inline; + _display: inline; } .w-50-ns { @@ -240,7 +240,7 @@

css

Css stats for this component

Gzipped Size
-
463B +
465B
@@ -1036,7 +1036,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1047,7 +1047,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/articles/left-title/index.html b/components/articles/left-title/index.html index 43c998bbc..8c16f2114 100644 --- a/components/articles/left-title/index.html +++ b/components/articles/left-title/index.html @@ -164,7 +164,7 @@

css

@media screen and (min-width: 30em) { .fl-ns { float: left; - display: inline; + _display: inline; } .w-50-ns { @@ -193,7 +193,7 @@

css

Css stats for this component

Gzipped Size
-
392B +
394B
@@ -983,7 +983,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -994,7 +994,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/articles/photo-essay/index.html b/components/articles/photo-essay/index.html index fb97cdd55..5187c3e10 100644 --- a/components/articles/photo-essay/index.html +++ b/components/articles/photo-essay/index.html @@ -1213,7 +1213,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1224,7 +1224,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/articles/single-column-large-title/index.html b/components/articles/single-column-large-title/index.html index ff529d1b0..cbaddf8ba 100644 --- a/components/articles/single-column-large-title/index.html +++ b/components/articles/single-column-large-title/index.html @@ -1045,7 +1045,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1056,7 +1056,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/articles/title-highlight-header-cover/index.html b/components/articles/title-highlight-header-cover/index.html index 45a0c758b..56a20bedb 100644 --- a/components/articles/title-highlight-header-cover/index.html +++ b/components/articles/title-highlight-header-cover/index.html @@ -1091,7 +1091,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1102,7 +1102,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/articles/title-text-image/index.html b/components/articles/title-text-image/index.html index f2713ec70..6277a32a4 100644 --- a/components/articles/title-text-image/index.html +++ b/components/articles/title-text-image/index.html @@ -890,7 +890,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -901,7 +901,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/articles/title-text/index.html b/components/articles/title-text/index.html index 3ad635f16..c44b091ea 100644 --- a/components/articles/title-text/index.html +++ b/components/articles/title-text/index.html @@ -872,7 +872,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -883,7 +883,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/avatars/circle-border/index.html b/components/avatars/circle-border/index.html index 78fb374dc..3ea93bc56 100644 --- a/components/avatars/circle-border/index.html +++ b/components/avatars/circle-border/index.html @@ -871,7 +871,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -882,7 +882,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/avatars/circle/index.html b/components/avatars/circle/index.html index 5328ced4e..eb94586ba 100644 --- a/components/avatars/circle/index.html +++ b/components/avatars/circle/index.html @@ -864,7 +864,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -875,7 +875,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/avatars/double-ring/index.html b/components/avatars/double-ring/index.html index 53de85a8c..767bc0561 100644 --- a/components/avatars/double-ring/index.html +++ b/components/avatars/double-ring/index.html @@ -871,7 +871,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -882,7 +882,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/avatars/rounded-large/index.html b/components/avatars/rounded-large/index.html index b3a4059de..8c834b965 100644 --- a/components/avatars/rounded-large/index.html +++ b/components/avatars/rounded-large/index.html @@ -864,7 +864,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -875,7 +875,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/avatars/rounded-medium/index.html b/components/avatars/rounded-medium/index.html index 144d15987..98b0a16c2 100644 --- a/components/avatars/rounded-medium/index.html +++ b/components/avatars/rounded-medium/index.html @@ -864,7 +864,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -875,7 +875,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/avatars/rounded-small/index.html b/components/avatars/rounded-small/index.html index 38b6e85fc..2f2e4a108 100644 --- a/components/avatars/rounded-small/index.html +++ b/components/avatars/rounded-small/index.html @@ -864,7 +864,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -875,7 +875,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/avatars/square/index.html b/components/avatars/square/index.html index 8bda04a5b..e2f54ec2d 100644 --- a/components/avatars/square/index.html +++ b/components/avatars/square/index.html @@ -858,7 +858,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -869,7 +869,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/banners/basic/index.html b/components/banners/basic/index.html index 505e12d71..9c63a2459 100644 --- a/components/banners/basic/index.html +++ b/components/banners/basic/index.html @@ -1037,7 +1037,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1048,7 +1048,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/banners/info/index.html b/components/banners/info/index.html index c8363935c..091bdea4b 100644 --- a/components/banners/info/index.html +++ b/components/banners/info/index.html @@ -878,7 +878,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -889,7 +889,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/banners/single-cta/index.html b/components/banners/single-cta/index.html index 30b26e36a..101bd60df 100644 --- a/components/banners/single-cta/index.html +++ b/components/banners/single-cta/index.html @@ -1034,7 +1034,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1045,7 +1045,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/buttons/basic-previous-next/index.html b/components/buttons/basic-previous-next/index.html index 10af5f627..0d09d7b70 100644 --- a/components/buttons/basic-previous-next/index.html +++ b/components/buttons/basic-previous-next/index.html @@ -951,7 +951,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -962,7 +962,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/buttons/basic-rounded-extra-small/index.html b/components/buttons/basic-rounded-extra-small/index.html index ae15fe85b..d0525402a 100644 --- a/components/buttons/basic-rounded-extra-small/index.html +++ b/components/buttons/basic-rounded-extra-small/index.html @@ -1178,7 +1178,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1189,7 +1189,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/buttons/basic-rounded-small/index.html b/components/buttons/basic-rounded-small/index.html index fab7743ad..0e4853aca 100644 --- a/components/buttons/basic-rounded-small/index.html +++ b/components/buttons/basic-rounded-small/index.html @@ -1178,7 +1178,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1189,7 +1189,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/buttons/basic-rounded/index.html b/components/buttons/basic-rounded/index.html index b0169d370..c26ea5491 100644 --- a/components/buttons/basic-rounded/index.html +++ b/components/buttons/basic-rounded/index.html @@ -1178,7 +1178,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1189,7 +1189,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/buttons/basic/index.html b/components/buttons/basic/index.html index 78d647375..9540964cf 100644 --- a/components/buttons/basic/index.html +++ b/components/buttons/basic/index.html @@ -1172,7 +1172,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1183,7 +1183,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/buttons/centered-icons/index.html b/components/buttons/centered-icons/index.html index 6dd82f42b..b3e166471 100644 --- a/components/buttons/centered-icons/index.html +++ b/components/buttons/centered-icons/index.html @@ -1008,7 +1008,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1019,7 +1019,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/buttons/pill-grow/index.html b/components/buttons/pill-grow/index.html index a10f2c58b..53292e687 100644 --- a/components/buttons/pill-grow/index.html +++ b/components/buttons/pill-grow/index.html @@ -1160,7 +1160,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1171,7 +1171,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/buttons/pill/index.html b/components/buttons/pill/index.html index dd4d73987..ee951c928 100644 --- a/components/buttons/pill/index.html +++ b/components/buttons/pill/index.html @@ -1178,7 +1178,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1189,7 +1189,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/cards/album-centered/index.html b/components/cards/album-centered/index.html index 9431e2962..6faee1c6c 100644 --- a/components/cards/album-centered/index.html +++ b/components/cards/album-centered/index.html @@ -970,7 +970,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -981,7 +981,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/cards/album-left/index.html b/components/cards/album-left/index.html index beec4dca9..311f16087 100644 --- a/components/cards/album-left/index.html +++ b/components/cards/album-left/index.html @@ -970,7 +970,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -981,7 +981,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/cards/basic-text-card/index.html b/components/cards/basic-text-card/index.html index bfcba55ab..ee28d75ee 100644 --- a/components/cards/basic-text-card/index.html +++ b/components/cards/basic-text-card/index.html @@ -931,7 +931,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -942,7 +942,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/cards/news-card/index.html b/components/cards/news-card/index.html index 2762205b2..667bbeb37 100644 --- a/components/cards/news-card/index.html +++ b/components/cards/news-card/index.html @@ -972,7 +972,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -983,7 +983,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/cards/product-card/index.html b/components/cards/product-card/index.html index e4e7c4e86..fe90bdbb5 100644 --- a/components/cards/product-card/index.html +++ b/components/cards/product-card/index.html @@ -998,7 +998,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1009,7 +1009,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/cards/profile-card-title-subtitle/index.html b/components/cards/profile-card-title-subtitle/index.html index 5c9b3f750..b7ae7f9cd 100644 --- a/components/cards/profile-card-title-subtitle/index.html +++ b/components/cards/profile-card-title-subtitle/index.html @@ -951,7 +951,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -962,7 +962,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/cards/profile-card/index.html b/components/cards/profile-card/index.html index 3085354a7..9e94fce92 100644 --- a/components/cards/profile-card/index.html +++ b/components/cards/profile-card/index.html @@ -966,7 +966,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -977,7 +977,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/cards/suggested-profile/index.html b/components/cards/suggested-profile/index.html index 4ab1d5187..812aa7c6e 100644 --- a/components/cards/suggested-profile/index.html +++ b/components/cards/suggested-profile/index.html @@ -1081,7 +1081,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1092,7 +1092,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/cards/text-card/index.html b/components/cards/text-card/index.html index 3ab1309d6..50e63a380 100644 --- a/components/cards/text-card/index.html +++ b/components/cards/text-card/index.html @@ -948,7 +948,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -959,7 +959,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/collections/albums/index.html b/components/collections/albums/index.html index 66ab0e19b..7d8f998fb 100644 --- a/components/collections/albums/index.html +++ b/components/collections/albums/index.html @@ -1233,7 +1233,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1244,7 +1244,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/collections/movies/index.html b/components/collections/movies/index.html index e33af3ff7..41d4d6702 100644 --- a/components/collections/movies/index.html +++ b/components/collections/movies/index.html @@ -1040,7 +1040,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1051,7 +1051,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/collections/posters-dim/index.html b/components/collections/posters-dim/index.html index e1c96eb0e..9f0e66bdd 100644 --- a/components/collections/posters-dim/index.html +++ b/components/collections/posters-dim/index.html @@ -1311,7 +1311,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1322,7 +1322,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/collections/posters/index.html b/components/collections/posters/index.html index eb577936c..8c2f27399 100644 --- a/components/collections/posters/index.html +++ b/components/collections/posters/index.html @@ -965,7 +965,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -976,7 +976,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/collections/square-title-subtitle/index.html b/components/collections/square-title-subtitle/index.html index a3c133f57..e57ea3d73 100644 --- a/components/collections/square-title-subtitle/index.html +++ b/components/collections/square-title-subtitle/index.html @@ -1385,7 +1385,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1396,7 +1396,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/collections/vinyl/index.html b/components/collections/vinyl/index.html index ffa16fb46..e4c62f086 100644 --- a/components/collections/vinyl/index.html +++ b/components/collections/vinyl/index.html @@ -1108,7 +1108,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1119,7 +1119,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/definition-lists/inline/index.html b/components/definition-lists/inline/index.html index 68f9b3b84..4043f7ebe 100644 --- a/components/definition-lists/inline/index.html +++ b/components/definition-lists/inline/index.html @@ -935,7 +935,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -946,7 +946,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/definition-lists/simple/index.html b/components/definition-lists/simple/index.html index 531633149..65ddf3e06 100644 --- a/components/definition-lists/simple/index.html +++ b/components/definition-lists/simple/index.html @@ -882,7 +882,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -893,7 +893,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/error-pages/404/index.html b/components/error-pages/404/index.html index 2bb79397c..3b8db3131 100644 --- a/components/error-pages/404/index.html +++ b/components/error-pages/404/index.html @@ -1039,7 +1039,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1050,7 +1050,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/footers/centered-icons-hover-glow/index.html b/components/footers/centered-icons-hover-glow/index.html index 867c80081..5bd524354 100644 --- a/components/footers/centered-icons-hover-glow/index.html +++ b/components/footers/centered-icons-hover-glow/index.html @@ -1049,7 +1049,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1060,7 +1060,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/footers/inline-text/index.html b/components/footers/inline-text/index.html index 0b4a79a14..b23184868 100644 --- a/components/footers/inline-text/index.html +++ b/components/footers/inline-text/index.html @@ -933,7 +933,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -944,7 +944,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/footers/simple-large-type/index.html b/components/footers/simple-large-type/index.html index db84ce36a..34fb31a37 100644 --- a/components/footers/simple-large-type/index.html +++ b/components/footers/simple-large-type/index.html @@ -978,7 +978,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -989,7 +989,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/footers/small-print/index.html b/components/footers/small-print/index.html index 08a1c5430..5fe24f2e2 100644 --- a/components/footers/small-print/index.html +++ b/components/footers/small-print/index.html @@ -944,7 +944,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -955,7 +955,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/footers/social-circles/index.html b/components/footers/social-circles/index.html index e94ac2c7a..fb211203b 100644 --- a/components/footers/social-circles/index.html +++ b/components/footers/social-circles/index.html @@ -991,7 +991,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1002,7 +1002,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/footers/social-simple-text/index.html b/components/footers/social-simple-text/index.html index 4655ec7ec..8bf2dd07a 100644 --- a/components/footers/social-simple-text/index.html +++ b/components/footers/social-simple-text/index.html @@ -1011,7 +1011,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1022,7 +1022,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/footers/social-simple/index.html b/components/footers/social-simple/index.html index adf2d3347..997e24949 100644 --- a/components/footers/social-simple/index.html +++ b/components/footers/social-simple/index.html @@ -983,7 +983,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -994,7 +994,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/footers/social-text/index.html b/components/footers/social-text/index.html index da253ce0a..a69f87786 100644 --- a/components/footers/social-text/index.html +++ b/components/footers/social-text/index.html @@ -1013,7 +1013,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1024,7 +1024,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/footers/social/index.html b/components/footers/social/index.html index 9eeeda39d..e914b9e93 100644 --- a/components/footers/social/index.html +++ b/components/footers/social/index.html @@ -996,7 +996,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1007,7 +1007,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/footers/studios/index.html b/components/footers/studios/index.html index 36e275fd6..92b710985 100644 --- a/components/footers/studios/index.html +++ b/components/footers/studios/index.html @@ -1434,7 +1434,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1445,7 +1445,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/forms/checkbox-list/index.html b/components/forms/checkbox-list/index.html index ae828d071..7ba5e54d5 100644 --- a/components/forms/checkbox-list/index.html +++ b/components/forms/checkbox-list/index.html @@ -927,7 +927,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -938,7 +938,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/forms/input-text-label/index.html b/components/forms/input-text-label/index.html index 940abd16d..f8fb4bb32 100644 --- a/components/forms/input-text-label/index.html +++ b/components/forms/input-text-label/index.html @@ -915,7 +915,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -926,7 +926,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/forms/newsletter-subscription/index.html b/components/forms/newsletter-subscription/index.html index a9ffb6061..748638f06 100644 --- a/components/forms/newsletter-subscription/index.html +++ b/components/forms/newsletter-subscription/index.html @@ -1063,7 +1063,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1074,7 +1074,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/forms/password/index.html b/components/forms/password/index.html index 4e74a9560..669f042dc 100644 --- a/components/forms/password/index.html +++ b/components/forms/password/index.html @@ -923,7 +923,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -934,7 +934,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/forms/sign-in/index.html b/components/forms/sign-in/index.html index c4eefc15a..3389ab863 100644 --- a/components/forms/sign-in/index.html +++ b/components/forms/sign-in/index.html @@ -1087,7 +1087,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1098,7 +1098,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/forms/sign-up/index.html b/components/forms/sign-up/index.html index a059eba56..0cb09a543 100644 --- a/components/forms/sign-up/index.html +++ b/components/forms/sign-up/index.html @@ -997,7 +997,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1008,7 +1008,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/forms/textarea-label/index.html b/components/forms/textarea-label/index.html index d52bfadee..264818e16 100644 --- a/components/forms/textarea-label/index.html +++ b/components/forms/textarea-label/index.html @@ -963,7 +963,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -974,7 +974,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/headers/circle-avatar-title-subtitle/index.html b/components/headers/circle-avatar-title-subtitle/index.html index 78de238b5..d1874e9ab 100644 --- a/components/headers/circle-avatar-title-subtitle/index.html +++ b/components/headers/circle-avatar-title-subtitle/index.html @@ -929,7 +929,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -940,7 +940,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/headers/rounded-avatar-title-subtitle/index.html b/components/headers/rounded-avatar-title-subtitle/index.html index 085c2d73e..52f2a36a6 100644 --- a/components/headers/rounded-avatar-title-subtitle/index.html +++ b/components/headers/rounded-avatar-title-subtitle/index.html @@ -921,7 +921,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -932,7 +932,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/headers/startup-hero/index.html b/components/headers/startup-hero/index.html index adb189226..1a1f6e01f 100644 --- a/components/headers/startup-hero/index.html +++ b/components/headers/startup-hero/index.html @@ -1211,7 +1211,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1222,7 +1222,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/index.html b/components/index.html index d6d5a1e96..c27473b9d 100644 --- a/components/index.html +++ b/components/index.html @@ -48,7 +48,7 @@ Tachyons
- v4.8.0 + v4.12.0
@@ -163,7 +163,7 @@

Article Lists

title="Title Preview Author Media Flipped">
@@ -179,7 +179,7 @@

Article Lists

title="Title Preview Author Media">
@@ -206,7 +206,7 @@

Articles

title="Feature">
@@ -222,7 +222,7 @@

Articles

title="Full Bleed Background">
@@ -238,7 +238,7 @@

Articles

title="Headline Title Text">
@@ -254,7 +254,7 @@

Articles

title="Large Title Text">
@@ -270,7 +270,7 @@

Articles

title="Left Title Top Border">
@@ -286,7 +286,7 @@

Articles

title="Left Title">
@@ -302,7 +302,7 @@

Articles

title="Photo Essay">
@@ -318,7 +318,7 @@

Articles

title="Single Column Large Title">
@@ -334,7 +334,7 @@

Articles

title="Title Highlight Header Cover">
@@ -350,7 +350,7 @@

Articles

title="Title Text Image">
@@ -366,7 +366,7 @@

Articles

title="Title Text">
@@ -393,7 +393,7 @@

Avatars

title="Circle Border">
@@ -409,7 +409,7 @@

Avatars

title="Circle">
@@ -425,7 +425,7 @@

Avatars

title="Double Ring">
@@ -441,7 +441,7 @@

Avatars

title="Rounded Large">
@@ -457,7 +457,7 @@

Avatars

title="Rounded Medium">
@@ -473,7 +473,7 @@

Avatars

title="Rounded Small">
@@ -489,7 +489,7 @@

Avatars

title="Square">
@@ -516,7 +516,7 @@

Banners

title="Basic">
@@ -532,7 +532,7 @@

Banners

title="Info">
@@ -548,7 +548,7 @@

Banners

title="Single Cta">
@@ -575,7 +575,7 @@

Buttons

title="Basic Previous Next">
@@ -591,7 +591,7 @@

Buttons

title="Basic Rounded Extra Small">
@@ -607,7 +607,7 @@

Buttons

title="Basic Rounded Small">
@@ -623,7 +623,7 @@

Buttons

title="Basic Rounded">
@@ -639,7 +639,7 @@

Buttons

title="Basic">
@@ -655,7 +655,7 @@

Buttons

title="Centered Icons">
@@ -671,7 +671,7 @@

Buttons

title="Pill Grow">
@@ -687,7 +687,7 @@

Buttons

title="Pill">
@@ -714,7 +714,7 @@

Cards

title="Album Centered">
@@ -730,7 +730,7 @@

Cards

title="Album Left">
@@ -746,7 +746,7 @@

Cards

title="Basic Text Card">
@@ -762,7 +762,7 @@

Cards

title="News Card">
@@ -778,7 +778,7 @@

Cards

title="Product Card">
@@ -794,7 +794,7 @@

Cards

title="Profile Card Title Subtitle">
@@ -810,7 +810,7 @@

Cards

title="Profile Card">
@@ -826,7 +826,7 @@

Cards

title="Suggested Profile">
@@ -842,7 +842,7 @@

Cards

title="Text Card">
@@ -869,7 +869,7 @@

Collections

title="Albums">
@@ -885,7 +885,7 @@

Collections

title="Movies">
@@ -901,7 +901,7 @@

Collections

title="Posters Dim">
@@ -917,7 +917,7 @@

Collections

title="Posters">
@@ -933,7 +933,7 @@

Collections

title="Square Title Subtitle">
@@ -949,7 +949,7 @@

Collections

title="Vinyl">
@@ -976,7 +976,7 @@

Definition Lists

title="Inline">
@@ -992,7 +992,7 @@

Definition Lists

title="Simple">
@@ -1019,7 +1019,7 @@

Error Pages

title="404">
@@ -1046,7 +1046,7 @@

Footers

title="Centered Icons Hover Glow">
@@ -1062,7 +1062,7 @@

Footers

title="Inline Text">
@@ -1078,7 +1078,7 @@

Footers

title="Simple Large Type">
@@ -1094,7 +1094,7 @@

Footers

title="Small Print">
@@ -1110,7 +1110,7 @@

Footers

title="Social Circles">
@@ -1126,7 +1126,7 @@

Footers

title="Social Simple Text">
@@ -1142,7 +1142,7 @@

Footers

title="Social Simple">
@@ -1158,7 +1158,7 @@

Footers

title="Social Text">
@@ -1174,7 +1174,7 @@

Footers

title="Social">
@@ -1190,7 +1190,7 @@

Footers

title="Studios">
@@ -1217,7 +1217,7 @@

Forms

title="Checkbox List">
@@ -1233,7 +1233,7 @@

Forms

title="Input Text Label">
@@ -1249,7 +1249,7 @@

Forms

title="Newsletter Subscription">
@@ -1265,7 +1265,7 @@

Forms

title="Password">
@@ -1281,7 +1281,7 @@

Forms

title="Sign In">
@@ -1297,7 +1297,7 @@

Forms

title="Sign Up">
@@ -1313,7 +1313,7 @@

Forms

title="Textarea Label">
@@ -1340,7 +1340,7 @@

Headers

title="Circle Avatar Title Subtitle">
@@ -1356,7 +1356,7 @@

Headers

title="Rounded Avatar Title Subtitle">
@@ -1372,7 +1372,7 @@

Headers

title="Startup Hero">
@@ -1399,7 +1399,7 @@

Layout

title="Aspect Ratio 16x9">
@@ -1415,7 +1415,7 @@

Layout

title="Aspect Ratio 1x1">
@@ -1431,7 +1431,7 @@

Layout

title="Aspect Ratio 3x4">
@@ -1447,7 +1447,7 @@

Layout

title="Aspect Ratio 4x3">
@@ -1463,7 +1463,7 @@

Layout

title="Aspect Ratio 4x6">
@@ -1479,7 +1479,7 @@

Layout

title="Aspect Ratio 5x7">
@@ -1495,7 +1495,7 @@

Layout

title="Aspect Ratio 5x8">
@@ -1511,7 +1511,7 @@

Layout

title="Aspect Ratio 6x4">
@@ -1527,7 +1527,7 @@

Layout

title="Aspect Ratio 7x5">
@@ -1543,7 +1543,7 @@

Layout

title="Aspect Ratio 8x5">
@@ -1559,7 +1559,7 @@

Layout

title="Aspect Ratio 9x16">
@@ -1575,7 +1575,7 @@

Layout

title="Centered Container">
@@ -1591,7 +1591,7 @@

Layout

title="Five Column Collapse Alternate">
@@ -1607,7 +1607,7 @@

Layout

title="Five Column Collapse Asymmetrical">
@@ -1623,7 +1623,7 @@

Layout

title="Five Column Collapse Mixed">
@@ -1639,7 +1639,7 @@

Layout

title="Five Column Collapse One">
@@ -1655,7 +1655,7 @@

Layout

title="Five Column">
@@ -1671,7 +1671,7 @@

Layout

title="Fixed Table Layout Grid Mixed Rows">
@@ -1687,7 +1687,7 @@

Layout

title="Fixed Table Layout Grid">
@@ -1703,7 +1703,7 @@

Layout

title="Flag Object Bottom">
@@ -1719,7 +1719,7 @@

Layout

title="Flag Object Collapse">
@@ -1735,7 +1735,7 @@

Layout

title="Flag Object Top">
@@ -1751,7 +1751,7 @@

Layout

title="Flag Object">
@@ -1767,7 +1767,7 @@

Layout

title="Four Column Collapse Two Collapse One">
@@ -1783,7 +1783,7 @@

Layout

title="Four Column Collapse Two">
@@ -1799,7 +1799,7 @@

Layout

title="Four Column">
@@ -1815,7 +1815,7 @@

Layout

title="Full Bleed 16x9">
@@ -1831,7 +1831,7 @@

Layout

title="Full Bleed 4x6">
@@ -1847,7 +1847,7 @@

Layout

title="Full Bleed 5x7">
@@ -1863,7 +1863,7 @@

Layout

title="Full Bleed 5x8">
@@ -1879,7 +1879,7 @@

Layout

title="Full Bleed 6x4">
@@ -1895,7 +1895,7 @@

Layout

title="Full Bleed 7x5">
@@ -1911,7 +1911,7 @@

Layout

title="Full Bleed 8x5">
@@ -1927,7 +1927,7 @@

Layout

title="Full Bleed 9x16">
@@ -1943,7 +1943,7 @@

Layout

title="Full Bleed Square">
@@ -1959,7 +1959,7 @@

Layout

title="Full Screen Centered Title">
@@ -1975,7 +1975,7 @@

Layout

title="Horizontal Aspect Ratios">
@@ -1991,7 +1991,7 @@

Layout

title="Three Column Collapse One">
@@ -2007,7 +2007,7 @@

Layout

title="Three Column">
@@ -2023,7 +2023,7 @@

Layout

title="Two Column Collapse One">
@@ -2039,7 +2039,7 @@

Layout

title="Two Column">
@@ -2066,7 +2066,7 @@

Links

title="Animate Background Color">
@@ -2082,7 +2082,7 @@

Links

title="Animate Color">
@@ -2098,7 +2098,7 @@

Links

title="Dim No Underline">
@@ -2114,7 +2114,7 @@

Links

title="Underline On Hover">
@@ -2141,7 +2141,7 @@

Lists

title="Block Item Dotted Border">
@@ -2157,7 +2157,7 @@

Lists

title="Border Spaced">
@@ -2173,7 +2173,7 @@

Lists

title="Border Tight">
@@ -2189,7 +2189,7 @@

Lists

title="Contact Phone">
@@ -2205,7 +2205,7 @@

Lists

title="Follower Notifications Rounded Square Avatar">
@@ -2221,7 +2221,7 @@

Lists

title="Follower Notifications">
@@ -2237,7 +2237,7 @@

Lists

title="Hashtags">
@@ -2253,7 +2253,7 @@

Lists

title="Items Image Title Price">
@@ -2269,7 +2269,7 @@

Lists

title="Large Links Inline">
@@ -2285,7 +2285,7 @@

Lists

title="Links Animate Color">
@@ -2301,7 +2301,7 @@

Lists

title="Links Inline">
@@ -2317,7 +2317,7 @@

Lists

title="Links With Borders Inline">
@@ -2333,7 +2333,7 @@

Lists

title="Slab Stat Large">
@@ -2349,7 +2349,7 @@

Lists

title="Slab Stat Small">
@@ -2365,7 +2365,7 @@

Lists

title="Slab Stat">
@@ -2381,7 +2381,7 @@

Lists

title="Title Text">
@@ -2408,7 +2408,7 @@

Marketing

title="Iphone App">
@@ -2435,7 +2435,7 @@

Nav

title="Fixed Semi Transparent">
@@ -2451,7 +2451,7 @@

Nav

title="Large Title Link List">
@@ -2467,7 +2467,7 @@

Nav

title="List Overflow">
@@ -2483,7 +2483,7 @@

Nav

title="Logo Links Inline Collapse">
@@ -2499,7 +2499,7 @@

Nav

title="Logo Links Inline">
@@ -2515,7 +2515,7 @@

Nav

title="Logo Titles Links Centered">
@@ -2531,7 +2531,7 @@

Nav

title="Minimal Sign Up">
@@ -2547,7 +2547,7 @@

Nav

title="Title Link List">
@@ -2574,7 +2574,7 @@

Pages

title="4x4 Mixed Grid">
@@ -2590,7 +2590,7 @@

Pages

title="Double">
@@ -2606,7 +2606,7 @@

Pages

title="Portfolio Project">
@@ -2622,7 +2622,7 @@

Pages

title="Swiss Cover Five Columns">
@@ -2649,7 +2649,7 @@

Quotes

title="Left Border">
@@ -2665,7 +2665,7 @@

Quotes

title="Pull Quote">
@@ -2692,7 +2692,7 @@

Tables

title="Basic">
@@ -2708,7 +2708,7 @@

Tables

title="Striped Dark">
@@ -2735,7 +2735,7 @@

Text

title="Large Paragraph">
@@ -2751,7 +2751,7 @@

Text

title="Narrow Paragraph">
@@ -2767,7 +2767,7 @@

Text

title="Paragraph">
@@ -2783,7 +2783,7 @@

Text

title="Small Narrow Paragraph">
@@ -2799,7 +2799,7 @@

Text

title="Small Paragraph">
@@ -2815,7 +2815,7 @@

Text

title="Title Subtitle Centered">
@@ -2831,7 +2831,7 @@

Text

title="Wide Paragraph">
@@ -2907,7 +2907,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -2918,7 +2918,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/aspect-ratio-16x9/index.html b/components/layout/aspect-ratio-16x9/index.html index 49f74ff9f..968b20dd3 100644 --- a/components/layout/aspect-ratio-16x9/index.html +++ b/components/layout/aspect-ratio-16x9/index.html @@ -885,7 +885,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -896,7 +896,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/aspect-ratio-1x1/index.html b/components/layout/aspect-ratio-1x1/index.html index 97662910c..b7072a797 100644 --- a/components/layout/aspect-ratio-1x1/index.html +++ b/components/layout/aspect-ratio-1x1/index.html @@ -885,7 +885,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -896,7 +896,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/aspect-ratio-3x4/index.html b/components/layout/aspect-ratio-3x4/index.html index 31aa00d76..491cd3bfe 100644 --- a/components/layout/aspect-ratio-3x4/index.html +++ b/components/layout/aspect-ratio-3x4/index.html @@ -885,7 +885,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -896,7 +896,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/aspect-ratio-4x3/index.html b/components/layout/aspect-ratio-4x3/index.html index c2e81632c..40fa0c88a 100644 --- a/components/layout/aspect-ratio-4x3/index.html +++ b/components/layout/aspect-ratio-4x3/index.html @@ -885,7 +885,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -896,7 +896,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/aspect-ratio-4x6/index.html b/components/layout/aspect-ratio-4x6/index.html index e61233a1f..f8d88d5aa 100644 --- a/components/layout/aspect-ratio-4x6/index.html +++ b/components/layout/aspect-ratio-4x6/index.html @@ -885,7 +885,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -896,7 +896,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/aspect-ratio-5x7/index.html b/components/layout/aspect-ratio-5x7/index.html index e8d28b0c2..c3491a387 100644 --- a/components/layout/aspect-ratio-5x7/index.html +++ b/components/layout/aspect-ratio-5x7/index.html @@ -885,7 +885,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -896,7 +896,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/aspect-ratio-5x8/index.html b/components/layout/aspect-ratio-5x8/index.html index acdffbc8d..8bdb7915e 100644 --- a/components/layout/aspect-ratio-5x8/index.html +++ b/components/layout/aspect-ratio-5x8/index.html @@ -885,7 +885,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -896,7 +896,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/aspect-ratio-6x4/index.html b/components/layout/aspect-ratio-6x4/index.html index bce5fb53e..8cebdd305 100644 --- a/components/layout/aspect-ratio-6x4/index.html +++ b/components/layout/aspect-ratio-6x4/index.html @@ -885,7 +885,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -896,7 +896,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/aspect-ratio-7x5/index.html b/components/layout/aspect-ratio-7x5/index.html index ac4224600..87e88d472 100644 --- a/components/layout/aspect-ratio-7x5/index.html +++ b/components/layout/aspect-ratio-7x5/index.html @@ -885,7 +885,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -896,7 +896,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/aspect-ratio-8x5/index.html b/components/layout/aspect-ratio-8x5/index.html index beee1eb5b..66b6e4361 100644 --- a/components/layout/aspect-ratio-8x5/index.html +++ b/components/layout/aspect-ratio-8x5/index.html @@ -885,7 +885,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -896,7 +896,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/aspect-ratio-9x16/index.html b/components/layout/aspect-ratio-9x16/index.html index 124ade927..b8f2b6716 100644 --- a/components/layout/aspect-ratio-9x16/index.html +++ b/components/layout/aspect-ratio-9x16/index.html @@ -885,7 +885,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -896,7 +896,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/centered-container/index.html b/components/layout/centered-container/index.html index cb9c4aa17..1187d9725 100644 --- a/components/layout/centered-container/index.html +++ b/components/layout/centered-container/index.html @@ -884,7 +884,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -895,7 +895,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/five-column-collapse-alternate/index.html b/components/layout/five-column-collapse-alternate/index.html index cf0d49837..f3aeb5912 100644 --- a/components/layout/five-column-collapse-alternate/index.html +++ b/components/layout/five-column-collapse-alternate/index.html @@ -917,7 +917,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -928,7 +928,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/five-column-collapse-asymmetrical/index.html b/components/layout/five-column-collapse-asymmetrical/index.html index d8d41044f..30c2ea7ef 100644 --- a/components/layout/five-column-collapse-asymmetrical/index.html +++ b/components/layout/five-column-collapse-asymmetrical/index.html @@ -921,7 +921,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -932,7 +932,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/five-column-collapse-mixed/index.html b/components/layout/five-column-collapse-mixed/index.html index a71c1e6d4..1bd7e2cff 100644 --- a/components/layout/five-column-collapse-mixed/index.html +++ b/components/layout/five-column-collapse-mixed/index.html @@ -917,7 +917,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -928,7 +928,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/five-column-collapse-one/index.html b/components/layout/five-column-collapse-one/index.html index c43786525..cc5dbd74a 100644 --- a/components/layout/five-column-collapse-one/index.html +++ b/components/layout/five-column-collapse-one/index.html @@ -913,7 +913,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -924,7 +924,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/five-column/index.html b/components/layout/five-column/index.html index e3a2eda84..6a2680f71 100644 --- a/components/layout/five-column/index.html +++ b/components/layout/five-column/index.html @@ -903,7 +903,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -914,7 +914,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/fixed-table-layout-grid-mixed-rows/index.html b/components/layout/fixed-table-layout-grid-mixed-rows/index.html index c64943f1f..d3b480f47 100644 --- a/components/layout/fixed-table-layout-grid-mixed-rows/index.html +++ b/components/layout/fixed-table-layout-grid-mixed-rows/index.html @@ -996,7 +996,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -1007,7 +1007,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/fixed-table-layout-grid/index.html b/components/layout/fixed-table-layout-grid/index.html index 89f4b3f96..0246dd2a9 100644 --- a/components/layout/fixed-table-layout-grid/index.html +++ b/components/layout/fixed-table-layout-grid/index.html @@ -988,7 +988,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -999,7 +999,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/flag-object-bottom/index.html b/components/layout/flag-object-bottom/index.html index 0106f35d5..b55d2ef85 100644 --- a/components/layout/flag-object-bottom/index.html +++ b/components/layout/flag-object-bottom/index.html @@ -911,7 +911,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -922,7 +922,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/flag-object-collapse/index.html b/components/layout/flag-object-collapse/index.html index 5e776b7a9..27389f6e6 100644 --- a/components/layout/flag-object-collapse/index.html +++ b/components/layout/flag-object-collapse/index.html @@ -934,7 +934,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -945,7 +945,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/flag-object-top/index.html b/components/layout/flag-object-top/index.html index 1398b540b..3dc10ad5e 100644 --- a/components/layout/flag-object-top/index.html +++ b/components/layout/flag-object-top/index.html @@ -913,7 +913,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -924,7 +924,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/flag-object/index.html b/components/layout/flag-object/index.html index 63a3d3830..5b0ed5771 100644 --- a/components/layout/flag-object/index.html +++ b/components/layout/flag-object/index.html @@ -902,7 +902,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -913,7 +913,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/four-column-collapse-two-collapse-one/index.html b/components/layout/four-column-collapse-two-collapse-one/index.html index 252823f33..d3846ac2d 100644 --- a/components/layout/four-column-collapse-two-collapse-one/index.html +++ b/components/layout/four-column-collapse-two-collapse-one/index.html @@ -901,7 +901,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -912,7 +912,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/four-column-collapse-two/index.html b/components/layout/four-column-collapse-two/index.html index 2f6270ab3..3862288d6 100644 --- a/components/layout/four-column-collapse-two/index.html +++ b/components/layout/four-column-collapse-two/index.html @@ -878,7 +878,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -889,7 +889,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/four-column/index.html b/components/layout/four-column/index.html index 5102d59db..c2e06e756 100644 --- a/components/layout/four-column/index.html +++ b/components/layout/four-column/index.html @@ -893,7 +893,7 @@

Text

Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

@@ -904,7 +904,7 @@

Text

that always moves faster than light. The word comes from the Greek:

- ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
diff --git a/components/layout/full-bleed-16x9/index.html b/components/layout/full-bleed-16x9/index.html index 6a4d973be..45c497da0 100644 --- a/components/layout/full-bleed-16x9/index.html +++ b/components/layout/full-bleed-16x9/index.html @@ -29,122 +29,122 @@
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
- +
@@ -160,122 +160,122 @@

HTML

<main class="cf w-100"> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--16x9"> - <img style="background-image:url(http://mrmrs.github.io/images/0006.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0006.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--16x9"> - <img style="background-image:url(http://mrmrs.github.io/images/0002.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0002.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--16x9"> - <img style="background-image:url(http://mrmrs.github.io/images/0003.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0003.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--16x9"> - <img style="background-image:url(http://mrmrs.github.io/images/0004.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0004.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--16x9"> - <img style="background-image:url(http://mrmrs.github.io/images/0007.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0007.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--16x9"> - <img style="background-image:url(http://mrmrs.github.io/images/0008.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0008.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--16x9"> - <img style="background-image:url(http://mrmrs.github.io/images/0009.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0009.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--16x9"> - <img style="background-image:url(http://mrmrs.github.io/images/0010.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0010.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--16x9"> - <img style="background-image:url(http://mrmrs.github.io/images/0011.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0011.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--16x9"> - <img style="background-image:url(http://mrmrs.github.io/images/0012.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0012.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--16x9"> - <img style="background-image:url(http://mrmrs.github.io/images/0013.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0013.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--16x9"> - <img style="background-image:url(http://mrmrs.github.io/images/0014.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0014.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--16x9"> - <img style="background-image:url(http://mrmrs.github.io/images/0015.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0015.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--16x9"> - <img style="background-image:url(http://mrmrs.github.io/images/0016.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0016.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--16x9"> - <img style="background-image:url(http://mrmrs.github.io/images/0017.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0017.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--16x9"> - <img style="background-image:url(http://mrmrs.github.io/images/0018.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0018.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--16x9"> - <img style="background-image:url(http://mrmrs.github.io/images/0019.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0019.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--16x9"> - <img style="background-image:url(http://mrmrs.github.io/images/0020.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0020.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--16x9"> - <img style="background-image:url(http://mrmrs.github.io/images/0021.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0021.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--16x9"> - <img style="background-image:url(http://mrmrs.github.io/images/0022.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0022.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> </main> @@ -326,10 +326,6 @@

css

*zoom: 1; } -.db { - display: block; -} - .fl { float: left; _display: inline; @@ -363,16 +359,16 @@

css

Css stats for this component

Gzipped Size
-
384B +
374B
Selectors
-
15
+
14
Declarations
-
25
+
24
@@ -387,8 +383,6 @@

Modules referenced

  • tachyons-clears
  • -
  • tachyons-display
  • -
  • tachyons-floats
  • tachyons-widths
  • @@ -401,7 +395,7 @@

    Modules referenced

    Install via npm Only installs the needed tachyons-modules for this component

    - npm i --save tachyons-aspect-ratios tachyons-background-size tachyons-background-position tachyons-clears tachyons-display tachyons-floats tachyons-widths + npm i --save tachyons-aspect-ratios tachyons-background-size tachyons-background-position tachyons-clears tachyons-floats tachyons-widths

    Other Components

    @@ -1147,7 +1141,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1158,7 +1152,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/layout/full-bleed-4x6/index.html b/components/layout/full-bleed-4x6/index.html index 1fad24f2b..948cd144a 100644 --- a/components/layout/full-bleed-4x6/index.html +++ b/components/layout/full-bleed-4x6/index.html @@ -29,122 +29,122 @@
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    @@ -160,122 +160,122 @@

    HTML

    <main class="cf w-100"> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--4x6"> - <img style="background-image:url(http://mrmrs.github.io/images/0006.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0006.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--4x6"> - <img style="background-image:url(http://mrmrs.github.io/images/0002.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0002.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--4x6"> - <img style="background-image:url(http://mrmrs.github.io/images/0003.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0003.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--4x6"> - <img style="background-image:url(http://mrmrs.github.io/images/0004.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0004.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--4x6"> - <img style="background-image:url(http://mrmrs.github.io/images/0007.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0007.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--4x6"> - <img style="background-image:url(http://mrmrs.github.io/images/0008.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0008.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--4x6"> - <img style="background-image:url(http://mrmrs.github.io/images/0009.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0009.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--4x6"> - <img style="background-image:url(http://mrmrs.github.io/images/0010.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0010.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--4x6"> - <img style="background-image:url(http://mrmrs.github.io/images/0011.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0011.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--4x6"> - <img style="background-image:url(http://mrmrs.github.io/images/0012.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0012.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--4x6"> - <img style="background-image:url(http://mrmrs.github.io/images/0013.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0013.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--4x6"> - <img style="background-image:url(http://mrmrs.github.io/images/0014.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0014.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--4x6"> - <img style="background-image:url(http://mrmrs.github.io/images/0015.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0015.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--4x6"> - <img style="background-image:url(http://mrmrs.github.io/images/0016.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0016.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--4x6"> - <img style="background-image:url(http://mrmrs.github.io/images/0017.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0017.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--4x6"> - <img style="background-image:url(http://mrmrs.github.io/images/0018.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0018.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--4x6"> - <img style="background-image:url(http://mrmrs.github.io/images/0019.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0019.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--4x6"> - <img style="background-image:url(http://mrmrs.github.io/images/0020.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0020.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--4x6"> - <img style="background-image:url(http://mrmrs.github.io/images/0021.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0021.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--4x6"> - <img style="background-image:url(http://mrmrs.github.io/images/0022.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0022.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> </main> @@ -326,10 +326,6 @@

    css

    *zoom: 1; } -.db { - display: block; -} - .fl { float: left; _display: inline; @@ -363,16 +359,16 @@

    css

    Css stats for this component

    Gzipped Size
    -
    379B +
    368B
    Selectors
    -
    15
    +
    14
    Declarations
    -
    25
    +
    24
    @@ -387,8 +383,6 @@

    Modules referenced

  • tachyons-clears
  • -
  • tachyons-display
  • -
  • tachyons-floats
  • tachyons-widths
  • @@ -401,7 +395,7 @@

    Modules referenced

    Install via npm Only installs the needed tachyons-modules for this component

    - npm i --save tachyons-aspect-ratios tachyons-background-size tachyons-background-position tachyons-clears tachyons-display tachyons-floats tachyons-widths + npm i --save tachyons-aspect-ratios tachyons-background-size tachyons-background-position tachyons-clears tachyons-floats tachyons-widths

    Other Components

    @@ -1147,7 +1141,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1158,7 +1152,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/layout/full-bleed-5x7/index.html b/components/layout/full-bleed-5x7/index.html index 20d11caf2..b964fb62d 100644 --- a/components/layout/full-bleed-5x7/index.html +++ b/components/layout/full-bleed-5x7/index.html @@ -29,122 +29,122 @@
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    @@ -160,122 +160,122 @@

    HTML

    <main class="cf w-100"> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x7"> - <img style="background-image:url(http://mrmrs.github.io/images/0006.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0006.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x7"> - <img style="background-image:url(http://mrmrs.github.io/images/0002.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0002.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x7"> - <img style="background-image:url(http://mrmrs.github.io/images/0003.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0003.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x7"> - <img style="background-image:url(http://mrmrs.github.io/images/0004.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0004.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x7"> - <img style="background-image:url(http://mrmrs.github.io/images/0007.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0007.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x7"> - <img style="background-image:url(http://mrmrs.github.io/images/0008.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0008.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x7"> - <img style="background-image:url(http://mrmrs.github.io/images/0009.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0009.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x7"> - <img style="background-image:url(http://mrmrs.github.io/images/0010.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0010.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x7"> - <img style="background-image:url(http://mrmrs.github.io/images/0011.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0011.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x7"> - <img style="background-image:url(http://mrmrs.github.io/images/0012.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0012.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x7"> - <img style="background-image:url(http://mrmrs.github.io/images/0013.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0013.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x7"> - <img style="background-image:url(http://mrmrs.github.io/images/0014.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0014.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x7"> - <img style="background-image:url(http://mrmrs.github.io/images/0015.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0015.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x7"> - <img style="background-image:url(http://mrmrs.github.io/images/0016.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0016.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x7"> - <img style="background-image:url(http://mrmrs.github.io/images/0017.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0017.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x7"> - <img style="background-image:url(http://mrmrs.github.io/images/0018.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0018.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x7"> - <img style="background-image:url(http://mrmrs.github.io/images/0019.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0019.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x7"> - <img style="background-image:url(http://mrmrs.github.io/images/0020.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0020.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x7"> - <img style="background-image:url(http://mrmrs.github.io/images/0021.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0021.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x7"> - <img style="background-image:url(http://mrmrs.github.io/images/0022.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0022.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> </main> @@ -326,10 +326,6 @@

    css

    *zoom: 1; } -.db { - display: block; -} - .fl { float: left; _display: inline; @@ -363,16 +359,16 @@

    css

    Css stats for this component

    Gzipped Size
    -
    380B +
    370B
    Selectors
    -
    15
    +
    14
    Declarations
    -
    25
    +
    24
    @@ -387,8 +383,6 @@

    Modules referenced

  • tachyons-clears
  • -
  • tachyons-display
  • -
  • tachyons-floats
  • tachyons-widths
  • @@ -401,7 +395,7 @@

    Modules referenced

    Install via npm Only installs the needed tachyons-modules for this component

    - npm i --save tachyons-aspect-ratios tachyons-background-size tachyons-background-position tachyons-clears tachyons-display tachyons-floats tachyons-widths + npm i --save tachyons-aspect-ratios tachyons-background-size tachyons-background-position tachyons-clears tachyons-floats tachyons-widths

    Other Components

    @@ -1147,7 +1141,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1158,7 +1152,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/layout/full-bleed-5x8/index.html b/components/layout/full-bleed-5x8/index.html index 1e7f23557..3072fb222 100644 --- a/components/layout/full-bleed-5x8/index.html +++ b/components/layout/full-bleed-5x8/index.html @@ -29,122 +29,122 @@
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    @@ -160,122 +160,122 @@

    HTML

    <main class="cf w-100"> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x8"> - <img style="background-image:url(http://mrmrs.github.io/images/0006.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0006.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x8"> - <img style="background-image:url(http://mrmrs.github.io/images/0002.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0002.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x8"> - <img style="background-image:url(http://mrmrs.github.io/images/0003.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0003.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x8"> - <img style="background-image:url(http://mrmrs.github.io/images/0004.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0004.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x8"> - <img style="background-image:url(http://mrmrs.github.io/images/0007.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0007.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x8"> - <img style="background-image:url(http://mrmrs.github.io/images/0008.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0008.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x8"> - <img style="background-image:url(http://mrmrs.github.io/images/0009.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0009.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x8"> - <img style="background-image:url(http://mrmrs.github.io/images/0010.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0010.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x8"> - <img style="background-image:url(http://mrmrs.github.io/images/0011.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0011.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x8"> - <img style="background-image:url(http://mrmrs.github.io/images/0012.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0012.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x8"> - <img style="background-image:url(http://mrmrs.github.io/images/0013.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0013.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x8"> - <img style="background-image:url(http://mrmrs.github.io/images/0014.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0014.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x8"> - <img style="background-image:url(http://mrmrs.github.io/images/0015.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0015.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x8"> - <img style="background-image:url(http://mrmrs.github.io/images/0016.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0016.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x8"> - <img style="background-image:url(http://mrmrs.github.io/images/0017.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0017.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x8"> - <img style="background-image:url(http://mrmrs.github.io/images/0018.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0018.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x8"> - <img style="background-image:url(http://mrmrs.github.io/images/0019.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0019.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x8"> - <img style="background-image:url(http://mrmrs.github.io/images/0020.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0020.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x8"> - <img style="background-image:url(http://mrmrs.github.io/images/0021.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0021.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--5x8"> - <img style="background-image:url(http://mrmrs.github.io/images/0022.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0022.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> </main> @@ -326,10 +326,6 @@

    css

    *zoom: 1; } -.db { - display: block; -} - .fl { float: left; _display: inline; @@ -363,16 +359,16 @@

    css

    Css stats for this component

    Gzipped Size
    -
    380B +
    370B
    Selectors
    -
    15
    +
    14
    Declarations
    -
    25
    +
    24
    @@ -387,8 +383,6 @@

    Modules referenced

  • tachyons-clears
  • -
  • tachyons-display
  • -
  • tachyons-floats
  • tachyons-widths
  • @@ -401,7 +395,7 @@

    Modules referenced

    Install via npm Only installs the needed tachyons-modules for this component

    - npm i --save tachyons-aspect-ratios tachyons-background-size tachyons-background-position tachyons-clears tachyons-display tachyons-floats tachyons-widths + npm i --save tachyons-aspect-ratios tachyons-background-size tachyons-background-position tachyons-clears tachyons-floats tachyons-widths

    Other Components

    @@ -1147,7 +1141,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1158,7 +1152,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/layout/full-bleed-6x4/index.html b/components/layout/full-bleed-6x4/index.html index fc24d9cfd..09a8c7652 100644 --- a/components/layout/full-bleed-6x4/index.html +++ b/components/layout/full-bleed-6x4/index.html @@ -29,122 +29,122 @@
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    @@ -160,122 +160,122 @@

    HTML

    <main class="cf w-100"> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--6x4"> - <img style="background-image:url(http://mrmrs.github.io/images/0006.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0006.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--6x4"> - <img style="background-image:url(http://mrmrs.github.io/images/0002.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0002.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--6x4"> - <img style="background-image:url(http://mrmrs.github.io/images/0003.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0003.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--6x4"> - <img style="background-image:url(http://mrmrs.github.io/images/0004.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0004.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--6x4"> - <img style="background-image:url(http://mrmrs.github.io/images/0007.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0007.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--6x4"> - <img style="background-image:url(http://mrmrs.github.io/images/0008.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0008.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--6x4"> - <img style="background-image:url(http://mrmrs.github.io/images/0009.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0009.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--6x4"> - <img style="background-image:url(http://mrmrs.github.io/images/0010.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0010.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--6x4"> - <img style="background-image:url(http://mrmrs.github.io/images/0011.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0011.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--6x4"> - <img style="background-image:url(http://mrmrs.github.io/images/0012.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0012.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--6x4"> - <img style="background-image:url(http://mrmrs.github.io/images/0013.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0013.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--6x4"> - <img style="background-image:url(http://mrmrs.github.io/images/0014.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0014.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--6x4"> - <img style="background-image:url(http://mrmrs.github.io/images/0015.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0015.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--6x4"> - <img style="background-image:url(http://mrmrs.github.io/images/0016.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0016.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--6x4"> - <img style="background-image:url(http://mrmrs.github.io/images/0017.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0017.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--6x4"> - <img style="background-image:url(http://mrmrs.github.io/images/0018.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0018.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--6x4"> - <img style="background-image:url(http://mrmrs.github.io/images/0019.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0019.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--6x4"> - <img style="background-image:url(http://mrmrs.github.io/images/0020.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0020.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--6x4"> - <img style="background-image:url(http://mrmrs.github.io/images/0021.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0021.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--6x4"> - <img style="background-image:url(http://mrmrs.github.io/images/0022.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0022.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> </main> @@ -326,10 +326,6 @@

    css

    *zoom: 1; } -.db { - display: block; -} - .fl { float: left; _display: inline; @@ -363,16 +359,16 @@

    css

    Css stats for this component

    Gzipped Size
    -
    381B +
    371B
    Selectors
    -
    15
    +
    14
    Declarations
    -
    25
    +
    24
    @@ -387,8 +383,6 @@

    Modules referenced

  • tachyons-clears
  • -
  • tachyons-display
  • -
  • tachyons-floats
  • tachyons-widths
  • @@ -401,7 +395,7 @@

    Modules referenced

    Install via npm Only installs the needed tachyons-modules for this component

    - npm i --save tachyons-aspect-ratios tachyons-background-size tachyons-background-position tachyons-clears tachyons-display tachyons-floats tachyons-widths + npm i --save tachyons-aspect-ratios tachyons-background-size tachyons-background-position tachyons-clears tachyons-floats tachyons-widths

    Other Components

    @@ -1147,7 +1141,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1158,7 +1152,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/layout/full-bleed-7x5/index.html b/components/layout/full-bleed-7x5/index.html index 0056e7c9a..1e54f7987 100644 --- a/components/layout/full-bleed-7x5/index.html +++ b/components/layout/full-bleed-7x5/index.html @@ -29,122 +29,122 @@
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    @@ -160,122 +160,122 @@

    HTML

    <main class="cf w-100"> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--7x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0006.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0006.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--7x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0002.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0002.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--7x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0003.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0003.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--7x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0004.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0004.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--7x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0007.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0007.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--7x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0008.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0008.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--7x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0009.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0009.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--7x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0010.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0010.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--7x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0011.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0011.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--7x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0012.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0012.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--7x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0013.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0013.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--7x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0014.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0014.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--7x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0015.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0015.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--7x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0016.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0016.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--7x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0017.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0017.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--7x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0018.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0018.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--7x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0019.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0019.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--7x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0020.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0020.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--7x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0021.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0021.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--7x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0022.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0022.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> </main> @@ -326,10 +326,6 @@

    css

    *zoom: 1; } -.db { - display: block; -} - .fl { float: left; _display: inline; @@ -363,16 +359,16 @@

    css

    Css stats for this component

    Gzipped Size
    -
    383B +
    373B
    Selectors
    -
    15
    +
    14
    Declarations
    -
    25
    +
    24
    @@ -387,8 +383,6 @@

    Modules referenced

  • tachyons-clears
  • -
  • tachyons-display
  • -
  • tachyons-floats
  • tachyons-widths
  • @@ -401,7 +395,7 @@

    Modules referenced

    Install via npm Only installs the needed tachyons-modules for this component

    - npm i --save tachyons-aspect-ratios tachyons-background-size tachyons-background-position tachyons-clears tachyons-display tachyons-floats tachyons-widths + npm i --save tachyons-aspect-ratios tachyons-background-size tachyons-background-position tachyons-clears tachyons-floats tachyons-widths

    Other Components

    @@ -1147,7 +1141,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1158,7 +1152,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/layout/full-bleed-8x5/index.html b/components/layout/full-bleed-8x5/index.html index 15adc9fb8..9b7843d43 100644 --- a/components/layout/full-bleed-8x5/index.html +++ b/components/layout/full-bleed-8x5/index.html @@ -29,122 +29,122 @@
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    @@ -160,122 +160,122 @@

    HTML

    <main class="cf w-100"> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--8x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0006.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0006.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--8x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0002.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0002.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--8x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0003.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0003.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--8x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0004.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0004.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--8x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0007.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0007.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--8x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0008.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0008.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--8x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0009.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0009.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--8x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0010.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0010.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--8x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0011.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0011.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--8x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0012.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0012.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--8x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0013.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0013.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--8x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0014.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0014.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--8x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0015.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0015.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--8x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0016.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0016.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--8x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0017.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0017.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--8x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0018.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0018.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--8x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0019.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0019.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--8x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0020.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0020.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--8x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0021.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0021.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--8x5"> - <img style="background-image:url(http://mrmrs.github.io/images/0022.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0022.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> </main> @@ -326,10 +326,6 @@

    css

    *zoom: 1; } -.db { - display: block; -} - .fl { float: left; _display: inline; @@ -363,16 +359,16 @@

    css

    Css stats for this component

    Gzipped Size
    -
    382B +
    372B
    Selectors
    -
    15
    +
    14
    Declarations
    -
    25
    +
    24
    @@ -387,8 +383,6 @@

    Modules referenced

  • tachyons-clears
  • -
  • tachyons-display
  • -
  • tachyons-floats
  • tachyons-widths
  • @@ -401,7 +395,7 @@

    Modules referenced

    Install via npm Only installs the needed tachyons-modules for this component

    - npm i --save tachyons-aspect-ratios tachyons-background-size tachyons-background-position tachyons-clears tachyons-display tachyons-floats tachyons-widths + npm i --save tachyons-aspect-ratios tachyons-background-size tachyons-background-position tachyons-clears tachyons-floats tachyons-widths

    Other Components

    @@ -1147,7 +1141,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1158,7 +1152,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/layout/full-bleed-9x16/index.html b/components/layout/full-bleed-9x16/index.html index 436498abe..02643c628 100644 --- a/components/layout/full-bleed-9x16/index.html +++ b/components/layout/full-bleed-9x16/index.html @@ -29,122 +29,122 @@
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    - +
    @@ -160,122 +160,122 @@

    HTML

    <main class="cf w-100"> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--9x16"> - <img style="background-image:url(http://mrmrs.github.io/images/0006.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0006.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--9x16"> - <img style="background-image:url(http://mrmrs.github.io/images/0002.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0002.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--9x16"> - <img style="background-image:url(http://mrmrs.github.io/images/0003.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0003.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--9x16"> - <img style="background-image:url(http://mrmrs.github.io/images/0004.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0004.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--9x16"> - <img style="background-image:url(http://mrmrs.github.io/images/0007.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0007.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--9x16"> - <img style="background-image:url(http://mrmrs.github.io/images/0008.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0008.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--9x16"> - <img style="background-image:url(http://mrmrs.github.io/images/0009.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0009.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--9x16"> - <img style="background-image:url(http://mrmrs.github.io/images/0010.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0010.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--9x16"> - <img style="background-image:url(http://mrmrs.github.io/images/0011.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0011.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--9x16"> - <img style="background-image:url(http://mrmrs.github.io/images/0012.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0012.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--9x16"> - <img style="background-image:url(http://mrmrs.github.io/images/0013.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0013.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--9x16"> - <img style="background-image:url(http://mrmrs.github.io/images/0014.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0014.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--9x16"> - <img style="background-image:url(http://mrmrs.github.io/images/0015.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0015.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--9x16"> - <img style="background-image:url(http://mrmrs.github.io/images/0016.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0016.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--9x16"> - <img style="background-image:url(http://mrmrs.github.io/images/0017.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0017.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--9x16"> - <img style="background-image:url(http://mrmrs.github.io/images/0018.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0018.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--9x16"> - <img style="background-image:url(http://mrmrs.github.io/images/0019.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0019.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--9x16"> - <img style="background-image:url(http://mrmrs.github.io/images/0020.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0020.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--9x16"> - <img style="background-image:url(http://mrmrs.github.io/images/0021.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0021.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> <div class="fl w-50 w-third-m w-25-ns"> <div class="aspect-ratio aspect-ratio--9x16"> - <img style="background-image:url(http://mrmrs.github.io/images/0022.jpg);" - class="db bg-center cover aspect-ratio--object" /> + <div style="background-image:url(http://mrmrs.github.io/images/0022.jpg);" + class="bg-center cover aspect-ratio--object"></div> </div> </div> </main> @@ -326,10 +326,6 @@

    css

    *zoom: 1; } -.db { - display: block; -} - .fl { float: left; _display: inline; @@ -363,16 +359,16 @@

    css

    Css stats for this component

    Gzipped Size
    -
    383B +
    374B
    Selectors
    -
    15
    +
    14
    Declarations
    -
    25
    +
    24
    @@ -387,8 +383,6 @@

    Modules referenced

  • tachyons-clears
  • -
  • tachyons-display
  • -
  • tachyons-floats
  • tachyons-widths
  • @@ -401,7 +395,7 @@

    Modules referenced

    Install via npm Only installs the needed tachyons-modules for this component

    - npm i --save tachyons-aspect-ratios tachyons-background-size tachyons-background-position tachyons-clears tachyons-display tachyons-floats tachyons-widths + npm i --save tachyons-aspect-ratios tachyons-background-size tachyons-background-position tachyons-clears tachyons-floats tachyons-widths

    Other Components

    @@ -1147,7 +1141,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1158,7 +1152,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/layout/full-bleed-square/index.html b/components/layout/full-bleed-square/index.html index 2987e8173..97b2ede99 100644 --- a/components/layout/full-bleed-square/index.html +++ b/components/layout/full-bleed-square/index.html @@ -1147,7 +1147,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1158,7 +1158,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/layout/full-screen-centered-title/index.html b/components/layout/full-screen-centered-title/index.html index d24d2f052..83c6b2527 100644 --- a/components/layout/full-screen-centered-title/index.html +++ b/components/layout/full-screen-centered-title/index.html @@ -908,7 +908,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -919,7 +919,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/layout/horizontal-aspect-ratios/index.html b/components/layout/horizontal-aspect-ratios/index.html index df8a148f7..2dea4295d 100644 --- a/components/layout/horizontal-aspect-ratios/index.html +++ b/components/layout/horizontal-aspect-ratios/index.html @@ -963,7 +963,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -974,7 +974,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/layout/three-column-collapse-one/index.html b/components/layout/three-column-collapse-one/index.html index c71d01649..8f549ff2b 100644 --- a/components/layout/three-column-collapse-one/index.html +++ b/components/layout/three-column-collapse-one/index.html @@ -880,7 +880,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -891,7 +891,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/layout/three-column/index.html b/components/layout/three-column/index.html index fe3a663f8..482791ecd 100644 --- a/components/layout/three-column/index.html +++ b/components/layout/three-column/index.html @@ -878,7 +878,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -889,7 +889,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/layout/two-column-collapse-one/index.html b/components/layout/two-column-collapse-one/index.html index 3a6396c3f..a01b7d680 100644 --- a/components/layout/two-column-collapse-one/index.html +++ b/components/layout/two-column-collapse-one/index.html @@ -884,7 +884,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -895,7 +895,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/layout/two-column/index.html b/components/layout/two-column/index.html index 624ed7b72..0adfc7668 100644 --- a/components/layout/two-column/index.html +++ b/components/layout/two-column/index.html @@ -878,7 +878,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -889,7 +889,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/links/animate-background-color/index.html b/components/links/animate-background-color/index.html index 5ef5a943d..bbeb41d37 100644 --- a/components/links/animate-background-color/index.html +++ b/components/links/animate-background-color/index.html @@ -890,7 +890,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -901,7 +901,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/links/animate-color/index.html b/components/links/animate-color/index.html index 6ffa5a7a6..3118443d6 100644 --- a/components/links/animate-color/index.html +++ b/components/links/animate-color/index.html @@ -1044,7 +1044,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1055,7 +1055,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/links/dim-no-underline/index.html b/components/links/dim-no-underline/index.html index 2fc2d1cf1..0344091ba 100644 --- a/components/links/dim-no-underline/index.html +++ b/components/links/dim-no-underline/index.html @@ -991,7 +991,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1002,7 +1002,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/links/underline-on-hover/index.html b/components/links/underline-on-hover/index.html index 078263a1e..3ce04c4b6 100644 --- a/components/links/underline-on-hover/index.html +++ b/components/links/underline-on-hover/index.html @@ -962,7 +962,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -973,7 +973,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/lists/block-item-dotted-border/index.html b/components/lists/block-item-dotted-border/index.html index df05a78ea..eeedde433 100644 --- a/components/lists/block-item-dotted-border/index.html +++ b/components/lists/block-item-dotted-border/index.html @@ -917,7 +917,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -928,7 +928,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/lists/border-spaced/index.html b/components/lists/border-spaced/index.html index cd705a2d0..426d26195 100644 --- a/components/lists/border-spaced/index.html +++ b/components/lists/border-spaced/index.html @@ -921,7 +921,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -932,7 +932,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/lists/border-tight/index.html b/components/lists/border-tight/index.html index f9aa57ca3..1960a797c 100644 --- a/components/lists/border-tight/index.html +++ b/components/lists/border-tight/index.html @@ -907,7 +907,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -918,7 +918,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/lists/contact-phone/index.html b/components/lists/contact-phone/index.html index 73b8facfb..75ea78f4c 100644 --- a/components/lists/contact-phone/index.html +++ b/components/lists/contact-phone/index.html @@ -1073,7 +1073,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1084,7 +1084,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/lists/follower-notifications-rounded-square-avatar/index.html b/components/lists/follower-notifications-rounded-square-avatar/index.html index 324a5ff79..ec91e3e9f 100644 --- a/components/lists/follower-notifications-rounded-square-avatar/index.html +++ b/components/lists/follower-notifications-rounded-square-avatar/index.html @@ -1239,7 +1239,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1250,7 +1250,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/lists/follower-notifications/index.html b/components/lists/follower-notifications/index.html index aa769014e..ebf39cfd5 100644 --- a/components/lists/follower-notifications/index.html +++ b/components/lists/follower-notifications/index.html @@ -1239,7 +1239,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1250,7 +1250,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/lists/hashtags/index.html b/components/lists/hashtags/index.html index aae8f77b2..8bd0b8a7a 100644 --- a/components/lists/hashtags/index.html +++ b/components/lists/hashtags/index.html @@ -1098,7 +1098,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1109,7 +1109,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/lists/items-image-title-price/index.html b/components/lists/items-image-title-price/index.html index 2773489ee..0a5cc8b49 100644 --- a/components/lists/items-image-title-price/index.html +++ b/components/lists/items-image-title-price/index.html @@ -1177,7 +1177,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1188,7 +1188,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/lists/large-links-inline/index.html b/components/lists/large-links-inline/index.html index d1a3f4c17..1e21913d2 100644 --- a/components/lists/large-links-inline/index.html +++ b/components/lists/large-links-inline/index.html @@ -1105,7 +1105,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1116,7 +1116,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/lists/links-animate-color/index.html b/components/lists/links-animate-color/index.html index 6e0938865..82d3ebe28 100644 --- a/components/lists/links-animate-color/index.html +++ b/components/lists/links-animate-color/index.html @@ -125,19 +125,19 @@

    css

    } .hover-orange:hover { - color: #ff6300; + color: #f48120; } .hover-orange:focus { - color: #ff6300; + color: #f48120; } .hover-gold:hover { - color: #ffb700; + color: #faad3f; } .hover-gold:focus { - color: #ffb700; + color: #faad3f; } .hover-yellow:hover { @@ -205,19 +205,19 @@

    css

    } .hover-blue:hover { - color: #357edd; + color: #408bc9; } .hover-blue:focus { - color: #357edd; + color: #408bc9; } .hover-light-blue:hover { - color: #96ccff; + color: #76c4e2; } .hover-light-blue:focus { - color: #96ccff; + color: #76c4e2; } .pa3 { @@ -262,7 +262,7 @@

    css

    Css stats for this component

    Gzipped Size
    -
    543B +
    549B
    @@ -1048,7 +1048,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1059,7 +1059,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/lists/links-inline/index.html b/components/lists/links-inline/index.html index 3d81ea8de..4c741d6bd 100644 --- a/components/lists/links-inline/index.html +++ b/components/lists/links-inline/index.html @@ -1112,7 +1112,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1123,7 +1123,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/lists/links-with-borders-inline/index.html b/components/lists/links-with-borders-inline/index.html index 221bf0541..8f96d43c4 100644 --- a/components/lists/links-with-borders-inline/index.html +++ b/components/lists/links-with-borders-inline/index.html @@ -276,7 +276,7 @@

    css

    } .dark-gray { - color: #333; + color: #4d4d4f; } .pa2 { @@ -339,7 +339,7 @@

    css

    Css stats for this component

    Gzipped Size
    -
    457B +
    458B
    @@ -1129,7 +1129,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1140,7 +1140,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/lists/slab-stat-large/index.html b/components/lists/slab-stat-large/index.html index eaed30416..449c2b1d6 100644 --- a/components/lists/slab-stat-large/index.html +++ b/components/lists/slab-stat-large/index.html @@ -971,7 +971,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -982,7 +982,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/lists/slab-stat-small/index.html b/components/lists/slab-stat-small/index.html index 9928574a6..68d05f20b 100644 --- a/components/lists/slab-stat-small/index.html +++ b/components/lists/slab-stat-small/index.html @@ -978,7 +978,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -989,7 +989,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/lists/slab-stat/index.html b/components/lists/slab-stat/index.html index beb3a560d..5b48e28f5 100644 --- a/components/lists/slab-stat/index.html +++ b/components/lists/slab-stat/index.html @@ -922,7 +922,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -933,7 +933,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/lists/title-text/index.html b/components/lists/title-text/index.html index 9ad070a53..be306037d 100644 --- a/components/lists/title-text/index.html +++ b/components/lists/title-text/index.html @@ -1013,7 +1013,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1024,7 +1024,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/marketing/iphone-app/index.html b/components/marketing/iphone-app/index.html index b7b3cc861..511c532b7 100644 --- a/components/marketing/iphone-app/index.html +++ b/components/marketing/iphone-app/index.html @@ -1217,7 +1217,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1228,7 +1228,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/nav/fixed-semi-transparent/index.html b/components/nav/fixed-semi-transparent/index.html index afe0deac6..9d2c45b6e 100644 --- a/components/nav/fixed-semi-transparent/index.html +++ b/components/nav/fixed-semi-transparent/index.html @@ -964,7 +964,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -975,7 +975,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/nav/large-title-link-list/index.html b/components/nav/large-title-link-list/index.html index 31b627ac7..1d91b2db1 100644 --- a/components/nav/large-title-link-list/index.html +++ b/components/nav/large-title-link-list/index.html @@ -955,7 +955,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -966,7 +966,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/nav/list-overflow/index.html b/components/nav/list-overflow/index.html index bdf9c769c..8bb9ec168 100644 --- a/components/nav/list-overflow/index.html +++ b/components/nav/list-overflow/index.html @@ -996,7 +996,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1007,7 +1007,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/nav/logo-links-inline-collapse/index.html b/components/nav/logo-links-inline-collapse/index.html index 8394613d7..424498947 100644 --- a/components/nav/logo-links-inline-collapse/index.html +++ b/components/nav/logo-links-inline-collapse/index.html @@ -115,7 +115,7 @@

    css

    } .dark-gray { - color: #333; + color: #4d4d4f; } .mid-gray { @@ -212,7 +212,7 @@

    css

    Css stats for this component

    Gzipped Size
    -
    521B +
    522B
    @@ -1006,7 +1006,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1017,7 +1017,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/nav/logo-links-inline/index.html b/components/nav/logo-links-inline/index.html index ca318ea78..55f9383cd 100644 --- a/components/nav/logo-links-inline/index.html +++ b/components/nav/logo-links-inline/index.html @@ -123,7 +123,7 @@

    css

    } .dark-gray { - color: #333; + color: #4d4d4f; } .mid-gray { @@ -188,7 +188,7 @@

    css

    Css stats for this component

    Gzipped Size
    -
    473B +
    474B
    @@ -982,7 +982,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -993,7 +993,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/nav/logo-titles-links-centered/index.html b/components/nav/logo-titles-links-centered/index.html index bdbbfe059..4ff5e55db 100644 --- a/components/nav/logo-titles-links-centered/index.html +++ b/components/nav/logo-titles-links-centered/index.html @@ -194,11 +194,11 @@

    css

    } .hover-bg-light-blue:hover { - background-color: #96ccff; + background-color: #76c4e2; } .hover-bg-light-blue:focus { - background-color: #96ccff; + background-color: #76c4e2; } .hover-bg-lightest-blue:hover { @@ -274,7 +274,7 @@

    css

    Css stats for this component

    Gzipped Size
    -
    722B +
    726B
    @@ -1084,7 +1084,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1095,7 +1095,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/nav/minimal-sign-up/index.html b/components/nav/minimal-sign-up/index.html index fed766190..d44118c01 100644 --- a/components/nav/minimal-sign-up/index.html +++ b/components/nav/minimal-sign-up/index.html @@ -1033,7 +1033,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1044,7 +1044,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/nav/title-link-list/index.html b/components/nav/title-link-list/index.html index 27a22d450..c1d2300e6 100644 --- a/components/nav/title-link-list/index.html +++ b/components/nav/title-link-list/index.html @@ -921,7 +921,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -932,7 +932,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/pages/4x4-mixed-grid/index.html b/components/pages/4x4-mixed-grid/index.html index 2ed724baa..efe958d8e 100644 --- a/components/pages/4x4-mixed-grid/index.html +++ b/components/pages/4x4-mixed-grid/index.html @@ -1193,7 +1193,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1204,7 +1204,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/pages/double/index.html b/components/pages/double/index.html index c43fe7a92..7ec6de84e 100644 --- a/components/pages/double/index.html +++ b/components/pages/double/index.html @@ -277,7 +277,7 @@

    css

    } .dark-gray { - color: #333; + color: #4d4d4f; } .bg-white { @@ -505,7 +505,7 @@

    css

    Css stats for this component

    Gzipped Size
    -
    808B +
    810B
    @@ -1307,7 +1307,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1318,7 +1318,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/pages/portfolio-project/index.html b/components/pages/portfolio-project/index.html index b550025b4..92d01703e 100644 --- a/components/pages/portfolio-project/index.html +++ b/components/pages/portfolio-project/index.html @@ -1378,7 +1378,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1389,7 +1389,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/pages/swiss-cover-five-columns/index.html b/components/pages/swiss-cover-five-columns/index.html index c792a74a5..d58fbcb78 100644 --- a/components/pages/swiss-cover-five-columns/index.html +++ b/components/pages/swiss-cover-five-columns/index.html @@ -199,7 +199,7 @@

    css

    .fl-ns { float: left; - display: inline; + _display: inline; } .mb5-ns { @@ -255,7 +255,7 @@

    css

    Css stats for this component

    Gzipped Size
    -
    450B +
    449B
    @@ -1045,7 +1045,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1056,7 +1056,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/quotes/left-border/index.html b/components/quotes/left-border/index.html index 735212351..da00995b1 100644 --- a/components/quotes/left-border/index.html +++ b/components/quotes/left-border/index.html @@ -72,7 +72,7 @@

    css

    } .b--blue { - border-color: #357edd; + border-color: #408bc9; } .bw2 { @@ -945,7 +945,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -956,7 +956,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/quotes/pull-quote/index.html b/components/quotes/pull-quote/index.html index a4db4df02..b0a4c8699 100644 --- a/components/quotes/pull-quote/index.html +++ b/components/quotes/pull-quote/index.html @@ -936,7 +936,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -947,7 +947,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/recent.html b/components/recent.html index a28e6b930..cb4b21660 100644 --- a/components/recent.html +++ b/components/recent.html @@ -48,7 +48,7 @@ Tachyons
    - v4.8.0 + v4.9.1
    @@ -98,7 +98,7 @@

    December 12, 2016

    title="Basic">
    @@ -114,7 +114,7 @@

    December 12, 2016

    title="Striped Dark">
    @@ -130,7 +130,7 @@

    December 12, 2016

    title="Studios">
    @@ -146,7 +146,7 @@

    December 12, 2016

    title="Iphone App">
    @@ -162,7 +162,7 @@

    December 12, 2016

    title="Portfolio Project">
    @@ -176,9 +176,9 @@

    December 12, 2016

    -
    +
    -

    December 9, 2016

    +

    December 10, 2016

    @@ -189,7 +189,7 @@

    December 9, 2016

    title="Basic Text Card">
    @@ -205,7 +205,7 @@

    December 9, 2016

    title="Checkbox List">
    @@ -221,7 +221,7 @@

    December 9, 2016

    title="Title Subtitle Centered">
    @@ -232,12 +232,23 @@

    December 9, 2016

    +
    +
    + +
    +
    +

    December 9, 2016

    +
    +
    +
    +
    +
    @@ -253,7 +264,7 @@

    December 9, 2016

    title="Info">
    @@ -269,7 +280,7 @@

    December 9, 2016

    title="Basic Previous Next">
    @@ -285,7 +296,7 @@

    December 9, 2016

    title="404">
    @@ -301,7 +312,7 @@

    December 9, 2016

    title="Inline Text">
    @@ -328,7 +339,7 @@

    December 6, 2016

    title="Input Text Label">
    @@ -344,7 +355,7 @@

    December 6, 2016

    title="Password">
    @@ -360,7 +371,7 @@

    December 6, 2016

    title="Textarea Label">
    @@ -376,7 +387,7 @@

    December 6, 2016

    title="Minimal Sign Up">
    @@ -403,7 +414,7 @@

    December 5, 2016

    title="Headline Title Text">
    @@ -419,7 +430,7 @@

    December 5, 2016

    title="Vinyl">
    @@ -435,7 +446,7 @@

    December 5, 2016

    title="Inline">
    @@ -451,7 +462,7 @@

    December 5, 2016

    title="Block Item Dotted Border">
    @@ -467,7 +478,7 @@

    December 5, 2016

    title="Contact Phone">
    @@ -494,7 +505,7 @@

    December 4, 2016

    title="Single Cta">
    @@ -510,7 +521,7 @@

    December 4, 2016

    title="Suggested Profile">
    @@ -537,7 +548,7 @@

    November 29, 2016

    title="Centered Icons">
    @@ -553,7 +564,7 @@

    November 29, 2016

    title="Centered Icons Hover Glow">
    @@ -580,7 +591,7 @@

    November 28, 2016

    title="Social Simple Text">
    @@ -596,7 +607,7 @@

    November 28, 2016

    title="Social Simple">
    @@ -612,7 +623,7 @@

    November 28, 2016

    title="Basic Rounded Extra Small">
    @@ -628,7 +639,7 @@

    November 28, 2016

    title="Basic Rounded Small">
    @@ -644,7 +655,7 @@

    November 28, 2016

    title="Basic Rounded">
    @@ -655,23 +666,12 @@

    November 28, 2016

    -
    -
    - -
    -
    -

    November 27, 2016

    -
    -
    -
    -
    - + +
    +
    +

    November 27, 2016

    +
    +
    +
    +
    +
    @@ -703,7 +714,7 @@

    November 27, 2016

    title="Animate Background Color">
    @@ -719,7 +730,7 @@

    November 27, 2016

    title="Animate Color">
    @@ -735,7 +746,7 @@

    November 27, 2016

    title="Dim No Underline">
    @@ -751,7 +762,7 @@

    November 27, 2016

    title="Underline On Hover">
    @@ -778,7 +789,7 @@

    October 20, 2016

    title="Circle Border">
    @@ -794,7 +805,7 @@

    October 20, 2016

    title="Circle">
    @@ -810,7 +821,7 @@

    October 20, 2016

    title="Double Ring">
    @@ -826,7 +837,7 @@

    October 20, 2016

    title="Rounded Large">
    @@ -842,7 +853,7 @@

    October 20, 2016

    title="Rounded Medium">
    @@ -858,7 +869,7 @@

    October 20, 2016

    title="Rounded Small">
    @@ -874,7 +885,7 @@

    October 20, 2016

    title="Square">
    @@ -888,9 +899,9 @@

    October 20, 2016

    -
    +
    -

    October 12, 2016

    +

    October 13, 2016

    @@ -901,7 +912,7 @@

    October 12, 2016

    title="Posters Dim">
    @@ -928,7 +939,7 @@

    September 27, 2016

    title="Simple">
    @@ -944,7 +955,7 @@

    September 27, 2016

    title="Follower Notifications Rounded Square Avatar">
    @@ -960,7 +971,7 @@

    September 27, 2016

    title="Follower Notifications">
    @@ -976,7 +987,7 @@

    September 27, 2016

    title="Hashtags">
    @@ -992,7 +1003,7 @@

    September 27, 2016

    title="Links Animate Color">
    @@ -1068,7 +1079,7 @@

    September 27, 2016

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1079,7 +1090,7 @@

    September 27, 2016

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/rss.xml b/components/rss.xml index 8bf8ff5d7..66747710c 100644 --- a/components/rss.xml +++ b/components/rss.xml @@ -1,81 +1,81 @@ -<![CDATA[Tachyons Recent Components]]>http://tachyons.ioRSS for NodeTue, 15 Aug 2017 12:36:29 GMT60<![CDATA[Tables | Basic]]>http://tachyons.ioRSS for NodeTue, 05 Jun 2018 13:18:57 GMT60<![CDATA[Tables | Basic]]>http://tachyons.io/components/tables/basic/index.htmltables:basicMon, 12 Dec 2016 19:57:38 GMT<![CDATA[Tables | Striped Dark]]>http://tachyons.io/components/tables/striped-dark/index.htmltables:striped-darkMon, 12 Dec 2016 19:57:38 GMT<![CDATA[Footers | Studios]]>http://tachyons.io/components/footers/studios/index.htmlfooters:studiosMon, 12 Dec 2016 11:46:58 GMT<![CDATA[Marketing | Iphone App]]>http://tachyons.io/components/marketing/iphone-app/index.htmlmarketing:iphone-appMon, 12 Dec 2016 11:46:58 GMT<![CDATA[Pages | Portfolio Project]]>http://tachyons.io/components/pages/portfolio-project/index.htmlpages:portfolio-projectMon, 12 Dec 2016 11:46:58 GMT<![CDATA[Cards | Basic Text Card]]>http://tachyons.io/components/cards/basic-text-card/index.htmlcards:basic-text-cardFri, 09 Dec 2016 23:01:48 GMT<![CDATA[Forms | Checkbox List]]>http://tachyons.io/components/forms/checkbox-list/index.htmlforms:checkbox-listFri, 09 Dec 2016 23:01:48 GMT<![CDATA[Text | Title Subtitle Centered]]>http://tachyons.io/components/text/title-subtitle-centered/index.htmltext:title-subtitle-centeredFri, 09 Dec 2016 23:01:48 GMT<![CDATA[Articles | Title Highlight Header Cover]]>http://tachyons.io/components/articles/title-highlight-header-cover/index.htmlarticles:title-highlight-header-coverFri, 09 Dec 2016 15:22:14 GMT<![CDATA[Banners | Info]]>http://tachyons.io/components/banners/info/index.htmlbanners:infoFri, 09 Dec 2016 15:22:14 GMT<![CDATA[Buttons | Basic Previous Next]]>http://tachyons.io/components/buttons/basic-previous-next/index.htmlbuttons:basic-previous-nextFri, 09 Dec 2016 15:22:14 GMT<![CDATA[Error Pages | 404]]>http://tachyons.io/components/error-pages/404/index.htmlerror-pages:404Fri, 09 Dec 2016 15:22:14 GMT<![CDATA[Footers | Inline Text]]>http://tachyons.io/components/footers/inline-text/index.htmlfooters:inline-textFri, 09 Dec 2016 15:22:14 GMT<![CDATA[Forms | Input Text Label]]>http://tachyons.io/components/forms/input-text-label/index.htmlforms:input-text-labelTue, 06 Dec 2016 01:39:57 GMT<![CDATA[Forms | Password]]>http://tachyons.io/components/forms/password/index.htmlforms:passwordTue, 06 Dec 2016 01:39:57 GMT<![CDATA[Forms | Textarea Label]]>http://tachyons.io/components/forms/textarea-label/index.htmlforms:textarea-labelTue, 06 Dec 2016 01:39:57 GMT<![CDATA[Nav | Minimal Sign Up]]>http://tachyons.io/components/nav/minimal-sign-up/index.htmlnav:minimal-sign-upTue, 06 Dec 2016 01:39:57 GMT<![CDATA[Articles | Headline Title Text]]>http://tachyons.io/components/articles/headline-title-text/index.htmlarticles:headline-title-textMon, 05 Dec 2016 03:11:04 GMT<![CDATA[Collections | Vinyl]]>http://tachyons.io/components/collections/vinyl/index.htmlcollections:vinylMon, 05 Dec 2016 03:11:04 GMT<![CDATA[Definition Lists | Inline]]>http://tachyons.io/components/definition-lists/inline/index.htmldefinition-lists:inlineMon, 05 Dec 2016 03:11:04 GMT \ No newline at end of file diff --git a/components/tables/basic/index.html b/components/tables/basic/index.html index 6bf30f532..5dbf63988 100644 --- a/components/tables/basic/index.html +++ b/components/tables/basic/index.html @@ -997,7 +997,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1008,7 +1008,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/tables/striped-dark/index.html b/components/tables/striped-dark/index.html index 4b6e929b1..f114f6acd 100644 --- a/components/tables/striped-dark/index.html +++ b/components/tables/striped-dark/index.html @@ -981,7 +981,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -992,7 +992,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/text/large-paragraph/index.html b/components/text/large-paragraph/index.html index dc47c40df..20fee1c38 100644 --- a/components/text/large-paragraph/index.html +++ b/components/text/large-paragraph/index.html @@ -864,7 +864,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -875,7 +875,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/text/narrow-paragraph/index.html b/components/text/narrow-paragraph/index.html index a501769a3..66d734cc9 100644 --- a/components/text/narrow-paragraph/index.html +++ b/components/text/narrow-paragraph/index.html @@ -864,7 +864,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -875,7 +875,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/text/paragraph/index.html b/components/text/paragraph/index.html index e14eca41f..2076de7ed 100644 --- a/components/text/paragraph/index.html +++ b/components/text/paragraph/index.html @@ -864,7 +864,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -875,7 +875,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/text/small-narrow-paragraph/index.html b/components/text/small-narrow-paragraph/index.html index 156d6e2da..e0099042d 100644 --- a/components/text/small-narrow-paragraph/index.html +++ b/components/text/small-narrow-paragraph/index.html @@ -864,7 +864,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -875,7 +875,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/text/small-paragraph/index.html b/components/text/small-paragraph/index.html index 2187caab6..baa18db2a 100644 --- a/components/text/small-paragraph/index.html +++ b/components/text/small-paragraph/index.html @@ -864,7 +864,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -875,7 +875,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/text/title-subtitle-centered/index.html b/components/text/title-subtitle-centered/index.html index 54854af01..925901f2b 100644 --- a/components/text/title-subtitle-centered/index.html +++ b/components/text/title-subtitle-centered/index.html @@ -908,7 +908,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -919,7 +919,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/components/text/wide-paragraph/index.html b/components/text/wide-paragraph/index.html index 238bd8a1c..f128f60ae 100644 --- a/components/text/wide-paragraph/index.html +++ b/components/text/wide-paragraph/index.html @@ -864,7 +864,7 @@

    Text

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -875,7 +875,7 @@

    Text

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/css/tachyons.css b/css/tachyons.css index fa5f5a67e..7f82a0d2e 100644 --- a/css/tachyons.css +++ b/css/tachyons.css @@ -388,7 +388,7 @@ img { max-width: 100%; } */ .b--black { border-color: #000; } .b--near-black { border-color: #111; } -.b--dark-gray { border-color: #4d4d4f; } +.b--dark-gray { border-color: #333; } .b--mid-gray { border-color: #555; } .b--gray { border-color: #777; } .b--silver { border-color: #999; } @@ -424,8 +424,8 @@ img { max-width: 100%; } .b--dark-red { border-color: #e7040f; } .b--red { border-color: #ff4136; } .b--light-red { border-color: #ff725c; } -.b--orange { border-color: #f48120; } -.b--gold { border-color: #faad3f; } +.b--orange { border-color: #ff6300; } +.b--gold { border-color: #ffb700; } .b--yellow { border-color: #ffd700; } .b--light-yellow { border-color: #fbf1a9; } .b--purple { border-color: #5e2ca5; } @@ -439,8 +439,8 @@ img { max-width: 100%; } .b--light-green { border-color: #9eebcf; } .b--navy { border-color: #001b44; } .b--dark-blue { border-color: #00449e; } -.b--blue { border-color: #408bc9; } -.b--light-blue { border-color: #76c4e2; } +.b--blue { border-color: #357edd; } +.b--light-blue { border-color: #96ccff; } .b--lightest-blue { border-color: #cdecff; } .b--washed-blue { border-color: #f6fffe; } .b--washed-green { border-color: #e8fdf5; } @@ -1138,7 +1138,7 @@ code, .code { font-family: Consolas, monaco, monospace; } .white-10 { color: rgba( 255, 255, 255, .1 ); } .black { color: #000; } .near-black { color: #111; } -.dark-gray { color: #4d4d4f; } +.dark-gray { color: #333; } .mid-gray { color: #555; } .gray { color: #777; } .silver { color: #999; } @@ -1150,8 +1150,8 @@ code, .code { font-family: Consolas, monaco, monospace; } .dark-red { color: #e7040f; } .red { color: #ff4136; } .light-red { color: #ff725c; } -.orange { color: #f48120; } -.gold { color: #faad3f; } +.orange { color: #ff6300; } +.gold { color: #ffb700; } .yellow { color: #ffd700; } .light-yellow { color: #fbf1a9; } .purple { color: #5e2ca5; } @@ -1165,8 +1165,8 @@ code, .code { font-family: Consolas, monaco, monospace; } .light-green { color: #9eebcf; } .navy { color: #001b44; } .dark-blue { color: #00449e; } -.blue { color: #408bc9; } -.light-blue { color: #76c4e2; } +.blue { color: #357edd; } +.light-blue { color: #96ccff; } .lightest-blue { color: #cdecff; } .washed-blue { color: #f6fffe; } .washed-green { color: #e8fdf5; } @@ -1195,7 +1195,7 @@ code, .code { font-family: Consolas, monaco, monospace; } /* Background colors */ .bg-black { background-color: #000; } .bg-near-black { background-color: #111; } -.bg-dark-gray { background-color: #4d4d4f; } +.bg-dark-gray { background-color: #333; } .bg-mid-gray { background-color: #555; } .bg-gray { background-color: #777; } .bg-silver { background-color: #999; } @@ -1208,8 +1208,8 @@ code, .code { font-family: Consolas, monaco, monospace; } .bg-dark-red { background-color: #e7040f; } .bg-red { background-color: #ff4136; } .bg-light-red { background-color: #ff725c; } -.bg-orange { background-color: #f48120; } -.bg-gold { background-color: #faad3f; } +.bg-orange { background-color: #ff6300; } +.bg-gold { background-color: #ffb700; } .bg-yellow { background-color: #ffd700; } .bg-light-yellow { background-color: #fbf1a9; } .bg-purple { background-color: #5e2ca5; } @@ -1223,8 +1223,8 @@ code, .code { font-family: Consolas, monaco, monospace; } .bg-light-green { background-color: #9eebcf; } .bg-navy { background-color: #001b44; } .bg-dark-blue { background-color: #00449e; } -.bg-blue { background-color: #408bc9; } -.bg-light-blue { background-color: #76c4e2; } +.bg-blue { background-color: #357edd; } +.bg-light-blue { background-color: #96ccff; } .bg-lightest-blue { background-color: #cdecff; } .bg-washed-blue { background-color: #f6fffe; } .bg-washed-green { background-color: #e8fdf5; } @@ -1243,8 +1243,8 @@ code, .code { font-family: Consolas, monaco, monospace; } .hover-black:focus { color: #000; } .hover-near-black:hover { color: #111; } .hover-near-black:focus { color: #111; } -.hover-dark-gray:hover { color: #4d4d4f; } -.hover-dark-gray:focus { color: #4d4d4f; } +.hover-dark-gray:hover { color: #333; } +.hover-dark-gray:focus { color: #333; } .hover-mid-gray:hover { color: #555; } .hover-mid-gray:focus { color: #555; } .hover-gray:hover { color: #777; } @@ -1302,8 +1302,8 @@ code, .code { font-family: Consolas, monaco, monospace; } .hover-bg-black:focus { background-color: #000; } .hover-bg-near-black:hover { background-color: #111; } .hover-bg-near-black:focus { background-color: #111; } -.hover-bg-dark-gray:hover { background-color: #4d4d4f; } -.hover-bg-dark-gray:focus { background-color: #4d4d4f; } +.hover-bg-dark-gray:hover { background-color: #333; } +.hover-bg-dark-gray:focus { background-color: #333; } .hover-bg-mid-gray:hover { background-color: #555; } .hover-bg-mid-gray:focus { background-color: #555; } .hover-bg-gray:hover { background-color: #777; } @@ -1364,10 +1364,10 @@ code, .code { font-family: Consolas, monaco, monospace; } .hover-red:focus { color: #ff4136; } .hover-light-red:hover { color: #ff725c; } .hover-light-red:focus { color: #ff725c; } -.hover-orange:hover { color: #f48120; } -.hover-orange:focus { color: #f48120; } -.hover-gold:hover { color: #faad3f; } -.hover-gold:focus { color: #faad3f; } +.hover-orange:hover { color: #ff6300; } +.hover-orange:focus { color: #ff6300; } +.hover-gold:hover { color: #ffb700; } +.hover-gold:focus { color: #ffb700; } .hover-yellow:hover { color: #ffd700; } .hover-yellow:focus { color: #ffd700; } .hover-light-yellow:hover { color: #fbf1a9; } @@ -1394,10 +1394,10 @@ code, .code { font-family: Consolas, monaco, monospace; } .hover-navy:focus { color: #001b44; } .hover-dark-blue:hover { color: #00449e; } .hover-dark-blue:focus { color: #00449e; } -.hover-blue:hover { color: #408bc9; } -.hover-blue:focus { color: #408bc9; } -.hover-light-blue:hover { color: #76c4e2; } -.hover-light-blue:focus { color: #76c4e2; } +.hover-blue:hover { color: #357edd; } +.hover-blue:focus { color: #357edd; } +.hover-light-blue:hover { color: #96ccff; } +.hover-light-blue:focus { color: #96ccff; } .hover-lightest-blue:hover { color: #cdecff; } .hover-lightest-blue:focus { color: #cdecff; } .hover-washed-blue:hover { color: #f6fffe; } @@ -1414,10 +1414,10 @@ code, .code { font-family: Consolas, monaco, monospace; } .hover-bg-red:focus { background-color: #ff4136; } .hover-bg-light-red:hover { background-color: #ff725c; } .hover-bg-light-red:focus { background-color: #ff725c; } -.hover-bg-orange:hover { background-color: #f48120; } -.hover-bg-orange:focus { background-color: #f48120; } -.hover-bg-gold:hover { background-color: #faad3f; } -.hover-bg-gold:focus { background-color: #faad3f; } +.hover-bg-orange:hover { background-color: #ff6300; } +.hover-bg-orange:focus { background-color: #ff6300; } +.hover-bg-gold:hover { background-color: #ffb700; } +.hover-bg-gold:focus { background-color: #ffb700; } .hover-bg-yellow:hover { background-color: #ffd700; } .hover-bg-yellow:focus { background-color: #ffd700; } .hover-bg-light-yellow:hover { background-color: #fbf1a9; } @@ -1444,10 +1444,10 @@ code, .code { font-family: Consolas, monaco, monospace; } .hover-bg-navy:focus { background-color: #001b44; } .hover-bg-dark-blue:hover { background-color: #00449e; } .hover-bg-dark-blue:focus { background-color: #00449e; } -.hover-bg-blue:hover { background-color: #408bc9; } -.hover-bg-blue:focus { background-color: #408bc9; } -.hover-bg-light-blue:hover { background-color: #76c4e2; } -.hover-bg-light-blue:focus { background-color: #76c4e2; } +.hover-bg-blue:hover { background-color: #357edd; } +.hover-bg-blue:focus { background-color: #357edd; } +.hover-bg-light-blue:hover { background-color: #96ccff; } +.hover-bg-light-blue:focus { background-color: #96ccff; } .hover-bg-lightest-blue:hover { background-color: #cdecff; } .hover-bg-lightest-blue:focus { background-color: #cdecff; } .hover-bg-washed-blue:hover { background-color: #f6fffe; } @@ -1990,11 +1990,11 @@ code, .code { font-family: Consolas, monaco, monospace; } .nested-headline-line-height h5, .nested-headline-line-height h6 { line-height: 1.25; } .nested-list-reset ul, .nested-list-reset ol { padding-left: 0; margin-left: 0; list-style-type: none; } .nested-copy-indent p+p { text-indent: 1em; margin-top: 0; margin-bottom: 0; } -.nested-copy-seperator p+p { margin-top: 1.5em; } +.nested-copy-separator p+p { margin-top: 1.5em; } .nested-img img { width: 100%; max-width: 100%; display: block; } -.nested-links a { color: #408bc9; transition: color .15s ease-in; } -.nested-links a:hover { color: #76c4e2; transition: color .15s ease-in; } -.nested-links a:focus { color: #76c4e2; transition: color .15s ease-in; } +.nested-links a { color: #357edd; transition: color .15s ease-in; } +.nested-links a:hover { color: #96ccff; transition: color .15s ease-in; } +.nested-links a:focus { color: #96ccff; transition: color .15s ease-in; } /* STYLES diff --git a/css/tachyons.min.css b/css/tachyons.min.css index c2f5cb66e..c977bebf8 100644 --- a/css/tachyons.min.css +++ b/css/tachyons.min.css @@ -1,3 +1,3 @@ /*! TACHYONS v4.6.0 | http://tachyons.io */ -/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}figcaption,figure,main{display:block}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent;-webkit-text-decoration-skip:objects}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit;font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}dfn{font-style:italic}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{font-family:sans-serif;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}/* 1 */ [type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}/* 1 */ menu,details{display:block}summary{display:list-item}canvas{display:inline-block}[hidden],template{display:none}.border-box,a,article,body,code,dd,div,dl,dt,fieldset,footer,form,h1,h2,h3,h4,h5,h6,header,html,input[type=email],input[type=number],input[type=password],input[type=tel],input[type=text],input[type=url],legend,li,main,ol,p,pre,section,table,td,textarea,th,tr,ul{box-sizing:border-box}.aspect-ratio{height:0;position:relative}.aspect-ratio--16x9{padding-bottom:56.25%}.aspect-ratio--9x16{padding-bottom:177.77%}.aspect-ratio--4x3{padding-bottom:75%}.aspect-ratio--3x4{padding-bottom:133.33%}.aspect-ratio--6x4{padding-bottom:66.6%}.aspect-ratio--4x6{padding-bottom:150%}.aspect-ratio--8x5{padding-bottom:62.5%}.aspect-ratio--5x8{padding-bottom:160%}.aspect-ratio--7x5{padding-bottom:71.42%}.aspect-ratio--5x7{padding-bottom:140%}.aspect-ratio--1x1{padding-bottom:100%}.aspect-ratio--object{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:100}img{max-width:100%}.cover{background-size:cover!important}.contain{background-size:contain!important}.bg-center{background-position:50%}.bg-center,.bg-top{background-repeat:no-repeat}.bg-top{background-position:top}.bg-right{background-position:100%}.bg-bottom,.bg-right{background-repeat:no-repeat}.bg-bottom{background-position:bottom}.bg-left{background-repeat:no-repeat;background-position:0}.outline{outline:1px solid}.outline-transparent{outline:1px solid transparent}.outline-0{outline:0}.ba{border-style:solid;border-width:1px}.bt{border-top-style:solid;border-top-width:1px}.br{border-right-style:solid;border-right-width:1px}.bb{border-bottom-style:solid;border-bottom-width:1px}.bl{border-left-style:solid;border-left-width:1px}.bn{border-style:none;border-width:0}.b--black{border-color:#000}.b--near-black{border-color:#111}.b--dark-gray{border-color:#4d4d4f}.b--mid-gray{border-color:#555}.b--gray{border-color:#777}.b--silver{border-color:#999}.b--light-silver{border-color:#aaa}.b--moon-gray{border-color:#ccc}.b--light-gray{border-color:#eee}.b--near-white{border-color:#f4f4f4}.b--white{border-color:#fff}.b--white-90{border-color:hsla(0,0%,100%,.9)}.b--white-80{border-color:hsla(0,0%,100%,.8)}.b--white-70{border-color:hsla(0,0%,100%,.7)}.b--white-60{border-color:hsla(0,0%,100%,.6)}.b--white-50{border-color:hsla(0,0%,100%,.5)}.b--white-40{border-color:hsla(0,0%,100%,.4)}.b--white-30{border-color:hsla(0,0%,100%,.3)}.b--white-20{border-color:hsla(0,0%,100%,.2)}.b--white-10{border-color:hsla(0,0%,100%,.1)}.b--white-05{border-color:hsla(0,0%,100%,.05)}.b--white-025{border-color:hsla(0,0%,100%,.025)}.b--white-0125{border-color:hsla(0,0%,100%,.0125)}.b--black-90{border-color:rgba(0,0,0,.9)}.b--black-80{border-color:rgba(0,0,0,.8)}.b--black-70{border-color:rgba(0,0,0,.7)}.b--black-60{border-color:rgba(0,0,0,.6)}.b--black-50{border-color:rgba(0,0,0,.5)}.b--black-40{border-color:rgba(0,0,0,.4)}.b--black-30{border-color:rgba(0,0,0,.3)}.b--black-20{border-color:rgba(0,0,0,.2)}.b--black-10{border-color:rgba(0,0,0,.1)}.b--black-05{border-color:rgba(0,0,0,.05)}.b--black-025{border-color:rgba(0,0,0,.025)}.b--black-0125{border-color:rgba(0,0,0,.0125)}.b--dark-red{border-color:#e7040f}.b--red{border-color:#ff4136}.b--light-red{border-color:#ff725c}.b--orange{border-color:#f48120}.b--gold{border-color:#faad3f}.b--yellow{border-color:gold}.b--light-yellow{border-color:#fbf1a9}.b--purple{border-color:#5e2ca5}.b--light-purple{border-color:#a463f2}.b--dark-pink{border-color:#d5008f}.b--hot-pink{border-color:#ff41b4}.b--pink{border-color:#ff80cc}.b--light-pink{border-color:#ffa3d7}.b--dark-green{border-color:#137752}.b--green{border-color:#19a974}.b--light-green{border-color:#9eebcf}.b--navy{border-color:#001b44}.b--dark-blue{border-color:#00449e}.b--blue{border-color:#408bc9}.b--light-blue{border-color:#76c4e2}.b--lightest-blue{border-color:#cdecff}.b--washed-blue{border-color:#f6fffe}.b--washed-green{border-color:#e8fdf5}.b--washed-yellow{border-color:#fffceb}.b--washed-red{border-color:#ffdfdf}.b--transparent{border-color:transparent}.b--inherit{border-color:inherit}.br0{border-radius:0}.br1{border-radius:.125rem}.br2{border-radius:.25rem}.br3{border-radius:.5rem}.br4{border-radius:1rem}.br-100{border-radius:100%}.br-pill{border-radius:9999px}.br--bottom{border-top-left-radius:0;border-top-right-radius:0}.br--top{border-bottom-right-radius:0}.br--right,.br--top{border-bottom-left-radius:0}.br--right{border-top-left-radius:0}.br--left{border-top-right-radius:0;border-bottom-right-radius:0}.b--dotted{border-style:dotted}.b--dashed{border-style:dashed}.b--solid{border-style:solid}.b--none{border-style:none}.bw0{border-width:0}.bw1{border-width:.125rem}.bw2{border-width:.25rem}.bw3{border-width:.5rem}.bw4{border-width:1rem}.bw5{border-width:2rem}.bt-0{border-top-width:0}.br-0{border-right-width:0}.bb-0{border-bottom-width:0}.bl-0{border-left-width:0}.shadow-1{box-shadow:0 0 4px 2px rgba(0,0,0,.2)}.shadow-2{box-shadow:0 0 8px 2px rgba(0,0,0,.2)}.shadow-3{box-shadow:2px 2px 4px 2px rgba(0,0,0,.2)}.shadow-4{box-shadow:2px 2px 8px 0 rgba(0,0,0,.2)}.shadow-5{box-shadow:4px 4px 8px 0 rgba(0,0,0,.2)}.pre{overflow-x:auto;overflow-y:hidden;overflow:scroll}.top-0{top:0}.right-0{right:0}.bottom-0{bottom:0}.left-0{left:0}.top-1{top:1rem}.right-1{right:1rem}.bottom-1{bottom:1rem}.left-1{left:1rem}.top-2{top:2rem}.right-2{right:2rem}.bottom-2{bottom:2rem}.left-2{left:2rem}.top--1{top:-1rem}.right--1{right:-1rem}.bottom--1{bottom:-1rem}.left--1{left:-1rem}.top--2{top:-2rem}.right--2{right:-2rem}.bottom--2{bottom:-2rem}.left--2{left:-2rem}.absolute--fill{top:0;right:0;bottom:0;left:0}.cf:after,.cf:before{content:" ";display:table}.cf:after{clear:both}.cf{*zoom:1}.cl{clear:left}.cr{clear:right}.cb{clear:both}.cn{clear:none}.dn{display:none}.di{display:inline}.db{display:block}.dib{display:inline-block}.dit{display:inline-table}.dt{display:table}.dtc{display:table-cell}.dt-row{display:table-row}.dt-row-group{display:table-row-group}.dt-column{display:table-column}.dt-column-group{display:table-column-group}.dt--fixed{table-layout:fixed;width:100%}.flex{display:-webkit-box;display:-ms-flexbox;display:flex}.inline-flex{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.flex-auto{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;min-width:0;min-height:0}.flex-none{-webkit-box-flex:0;-ms-flex:none;flex:none}.flex-column{-webkit-box-orient:vertical;-ms-flex-direction:column;flex-direction:column}.flex-column,.flex-row{-webkit-box-direction:normal}.flex-row{-webkit-box-orient:horizontal;-ms-flex-direction:row;flex-direction:row}.flex-wrap{-ms-flex-wrap:wrap;flex-wrap:wrap}.flex-nowrap{-ms-flex-wrap:nowrap;flex-wrap:nowrap}.flex-wrap-reverse{-ms-flex-wrap:wrap-reverse;flex-wrap:wrap-reverse}.flex-column-reverse{-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.flex-row-reverse{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.items-start{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.items-end{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.items-center{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.items-baseline{-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline}.items-stretch{-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch}.self-start{-ms-flex-item-align:start;align-self:flex-start}.self-end{-ms-flex-item-align:end;align-self:flex-end}.self-center{-ms-flex-item-align:center;-ms-grid-row-align:center;align-self:center}.self-baseline{-ms-flex-item-align:baseline;align-self:baseline}.self-stretch{-ms-flex-item-align:stretch;-ms-grid-row-align:stretch;align-self:stretch}.justify-start{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.justify-end{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.justify-center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.justify-between{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.justify-around{-ms-flex-pack:distribute;justify-content:space-around}.content-start{-ms-flex-line-pack:start;align-content:flex-start}.content-end{-ms-flex-line-pack:end;align-content:flex-end}.content-center{-ms-flex-line-pack:center;align-content:center}.content-between{-ms-flex-line-pack:justify;align-content:space-between}.content-around{-ms-flex-line-pack:distribute;align-content:space-around}.content-stretch{-ms-flex-line-pack:stretch;align-content:stretch}.order-0{-webkit-box-ordinal-group:1;-ms-flex-order:0;order:0}.order-1{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.order-2{-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}.order-3{-webkit-box-ordinal-group:4;-ms-flex-order:3;order:3}.order-4{-webkit-box-ordinal-group:5;-ms-flex-order:4;order:4}.order-5{-webkit-box-ordinal-group:6;-ms-flex-order:5;order:5}.order-6{-webkit-box-ordinal-group:7;-ms-flex-order:6;order:6}.order-7{-webkit-box-ordinal-group:8;-ms-flex-order:7;order:7}.order-8{-webkit-box-ordinal-group:9;-ms-flex-order:8;order:8}.order-last{-webkit-box-ordinal-group:100000;-ms-flex-order:99999;order:99999}.fl{float:left}.fl,.fr{_display:inline}.fr{float:right}.fn{float:none}.sans-serif{font-family:-apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif}.serif{font-family:georgia,times,serif}.system-sans-serif{font-family:sans-serif}.system-serif{font-family:serif}.code,code{font-family:Consolas,monaco,monospace}.courier{font-family:Courier Next,courier,monospace}.helvetica{font-family:helvetica neue,helvetica,sans-serif}.avenir{font-family:avenir next,avenir,sans-serif}.athelas{font-family:athelas,georgia,serif}.georgia{font-family:georgia,serif}.times{font-family:times,serif}.bodoni{font-family:Bodoni MT,serif}.calisto{font-family:Calisto MT,serif}.garamond{font-family:garamond,serif}.baskerville{font-family:baskerville,serif}.i{font-style:italic}.fs-normal{font-style:normal}.normal{font-weight:400}.b{font-weight:700}.fw1{font-weight:100}.fw2{font-weight:200}.fw3{font-weight:300}.fw4{font-weight:400}.fw5{font-weight:500}.fw6{font-weight:600}.fw7{font-weight:700}.fw8{font-weight:800}.fw9{font-weight:900}.input-reset{-webkit-appearance:none;-moz-appearance:none}.button-reset::-moz-focus-inner,.input-reset::-moz-focus-inner{border:0;padding:0}.h1{height:1rem}.h2{height:2rem}.h3{height:4rem}.h4{height:8rem}.h5{height:16rem}.h-25{height:25%}.h-50{height:50%}.h-75{height:75%}.h-100{height:100%}.min-h-100{min-height:100%}.vh-25{height:25vh}.vh-50{height:50vh}.vh-75{height:75vh}.vh-100{height:100vh}.min-vh-100{min-height:100vh}.h-auto{height:auto}.h-inherit{height:inherit}.tracked{letter-spacing:.1em}.tracked-tight{letter-spacing:-.05em}.tracked-mega{letter-spacing:.25em}.lh-solid{line-height:1}.lh-title{line-height:1.25}.lh-copy{line-height:1.5}.link{text-decoration:none}.link,.link:active,.link:focus,.link:hover,.link:link,.link:visited{transition:color .15s ease-in}.link:focus{outline:1px dotted currentColor}.list{list-style-type:none}.mw-100{max-width:100%}.mw1{max-width:1rem}.mw2{max-width:2rem}.mw3{max-width:4rem}.mw4{max-width:8rem}.mw5{max-width:16rem}.mw6{max-width:32rem}.mw7{max-width:48rem}.mw8{max-width:64rem}.mw9{max-width:96rem}.mw-none{max-width:none}.w1{width:1rem}.w2{width:2rem}.w3{width:4rem}.w4{width:8rem}.w5{width:16rem}.w-10{width:10%}.w-20{width:20%}.w-25{width:25%}.w-30{width:30%}.w-33{width:33%}.w-34{width:34%}.w-40{width:40%}.w-50{width:50%}.w-60{width:60%}.w-70{width:70%}.w-75{width:75%}.w-80{width:80%}.w-90{width:90%}.w-100{width:100%}.w-third{width:33.33333%}.w-two-thirds{width:66.66667%}.w-auto{width:auto}.overflow-visible{overflow:visible}.overflow-hidden{overflow:hidden}.overflow-scroll{overflow:scroll}.overflow-auto{overflow:auto}.overflow-x-visible{overflow-x:visible}.overflow-x-hidden{overflow-x:hidden}.overflow-x-scroll{overflow-x:scroll}.overflow-x-auto{overflow-x:auto}.overflow-y-visible{overflow-y:visible}.overflow-y-hidden{overflow-y:hidden}.overflow-y-scroll{overflow-y:scroll}.overflow-y-auto{overflow-y:auto}.static{position:static}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.o-100{opacity:1}.o-90{opacity:.9}.o-80{opacity:.8}.o-70{opacity:.7}.o-60{opacity:.6}.o-50{opacity:.5}.o-40{opacity:.4}.o-30{opacity:.3}.o-20{opacity:.2}.o-10{opacity:.1}.o-05{opacity:.05}.o-025{opacity:.025}.o-0{opacity:0}.rotate-45{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.rotate-90{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.rotate-135{-webkit-transform:rotate(135deg);transform:rotate(135deg)}.rotate-180{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.rotate-225{-webkit-transform:rotate(225deg);transform:rotate(225deg)}.rotate-270{-webkit-transform:rotate(270deg);transform:rotate(270deg)}.rotate-315{-webkit-transform:rotate(315deg);transform:rotate(315deg)}.black-90{color:rgba(0,0,0,.9)}.black-80{color:rgba(0,0,0,.8)}.black-70{color:rgba(0,0,0,.7)}.black-60{color:rgba(0,0,0,.6)}.black-50{color:rgba(0,0,0,.5)}.black-40{color:rgba(0,0,0,.4)}.black-30{color:rgba(0,0,0,.3)}.black-20{color:rgba(0,0,0,.2)}.black-10{color:rgba(0,0,0,.1)}.black-05{color:rgba(0,0,0,.05)}.white-90{color:hsla(0,0%,100%,.9)}.white-80{color:hsla(0,0%,100%,.8)}.white-70{color:hsla(0,0%,100%,.7)}.white-60{color:hsla(0,0%,100%,.6)}.white-50{color:hsla(0,0%,100%,.5)}.white-40{color:hsla(0,0%,100%,.4)}.white-30{color:hsla(0,0%,100%,.3)}.white-20{color:hsla(0,0%,100%,.2)}.white-10{color:hsla(0,0%,100%,.1)}.black{color:#000}.near-black{color:#111}.dark-gray{color:#4d4d4f}.mid-gray{color:#555}.gray{color:#777}.silver{color:#999}.light-silver{color:#aaa}.moon-gray{color:#ccc}.light-gray{color:#eee}.near-white{color:#f4f4f4}.white{color:#fff}.dark-red{color:#e7040f}.red{color:#ff4136}.light-red{color:#ff725c}.orange{color:#f48120}.gold{color:#faad3f}.yellow{color:gold}.light-yellow{color:#fbf1a9}.purple{color:#5e2ca5}.light-purple{color:#a463f2}.dark-pink{color:#d5008f}.hot-pink{color:#ff41b4}.pink{color:#ff80cc}.light-pink{color:#ffa3d7}.dark-green{color:#137752}.green{color:#19a974}.light-green{color:#9eebcf}.navy{color:#001b44}.dark-blue{color:#00449e}.blue{color:#408bc9}.light-blue{color:#76c4e2}.lightest-blue{color:#cdecff}.washed-blue{color:#f6fffe}.washed-green{color:#e8fdf5}.washed-yellow{color:#fffceb}.washed-red{color:#ffdfdf}.color-inherit{color:inherit}.bg-black-90{background-color:rgba(0,0,0,.9)}.bg-black-80{background-color:rgba(0,0,0,.8)}.bg-black-70{background-color:rgba(0,0,0,.7)}.bg-black-60{background-color:rgba(0,0,0,.6)}.bg-black-50{background-color:rgba(0,0,0,.5)}.bg-black-40{background-color:rgba(0,0,0,.4)}.bg-black-30{background-color:rgba(0,0,0,.3)}.bg-black-20{background-color:rgba(0,0,0,.2)}.bg-black-10{background-color:rgba(0,0,0,.1)}.bg-black-05{background-color:rgba(0,0,0,.05)}.bg-white-90{background-color:hsla(0,0%,100%,.9)}.bg-white-80{background-color:hsla(0,0%,100%,.8)}.bg-white-70{background-color:hsla(0,0%,100%,.7)}.bg-white-60{background-color:hsla(0,0%,100%,.6)}.bg-white-50{background-color:hsla(0,0%,100%,.5)}.bg-white-40{background-color:hsla(0,0%,100%,.4)}.bg-white-30{background-color:hsla(0,0%,100%,.3)}.bg-white-20{background-color:hsla(0,0%,100%,.2)}.bg-white-10{background-color:hsla(0,0%,100%,.1)}.bg-black{background-color:#000}.bg-near-black{background-color:#111}.bg-dark-gray{background-color:#4d4d4f}.bg-mid-gray{background-color:#555}.bg-gray{background-color:#777}.bg-silver{background-color:#999}.bg-light-silver{background-color:#aaa}.bg-moon-gray{background-color:#ccc}.bg-light-gray{background-color:#eee}.bg-near-white{background-color:#f4f4f4}.bg-white{background-color:#fff}.bg-transparent{background-color:transparent}.bg-dark-red{background-color:#e7040f}.bg-red{background-color:#ff4136}.bg-light-red{background-color:#ff725c}.bg-orange{background-color:#f48120}.bg-gold{background-color:#faad3f}.bg-yellow{background-color:gold}.bg-light-yellow{background-color:#fbf1a9}.bg-purple{background-color:#5e2ca5}.bg-light-purple{background-color:#a463f2}.bg-dark-pink{background-color:#d5008f}.bg-hot-pink{background-color:#ff41b4}.bg-pink{background-color:#ff80cc}.bg-light-pink{background-color:#ffa3d7}.bg-dark-green{background-color:#137752}.bg-green{background-color:#19a974}.bg-light-green{background-color:#9eebcf}.bg-navy{background-color:#001b44}.bg-dark-blue{background-color:#00449e}.bg-blue{background-color:#408bc9}.bg-light-blue{background-color:#76c4e2}.bg-lightest-blue{background-color:#cdecff}.bg-washed-blue{background-color:#f6fffe}.bg-washed-green{background-color:#e8fdf5}.bg-washed-yellow{background-color:#fffceb}.bg-washed-red{background-color:#ffdfdf}.bg-inherit{background-color:inherit}.hover-black:focus,.hover-black:hover{color:#000}.hover-near-black:focus,.hover-near-black:hover{color:#111}.hover-dark-gray:focus,.hover-dark-gray:hover{color:#4d4d4f}.hover-mid-gray:focus,.hover-mid-gray:hover{color:#555}.hover-gray:focus,.hover-gray:hover{color:#777}.hover-silver:focus,.hover-silver:hover{color:#999}.hover-light-silver:focus,.hover-light-silver:hover{color:#aaa}.hover-moon-gray:focus,.hover-moon-gray:hover{color:#ccc}.hover-light-gray:focus,.hover-light-gray:hover{color:#eee}.hover-near-white:focus,.hover-near-white:hover{color:#f4f4f4}.hover-white:focus,.hover-white:hover{color:#fff}.hover-black-90:focus,.hover-black-90:hover{color:rgba(0,0,0,.9)}.hover-black-80:focus,.hover-black-80:hover{color:rgba(0,0,0,.8)}.hover-black-70:focus,.hover-black-70:hover{color:rgba(0,0,0,.7)}.hover-black-60:focus,.hover-black-60:hover{color:rgba(0,0,0,.6)}.hover-black-50:focus,.hover-black-50:hover{color:rgba(0,0,0,.5)}.hover-black-40:focus,.hover-black-40:hover{color:rgba(0,0,0,.4)}.hover-black-30:focus,.hover-black-30:hover{color:rgba(0,0,0,.3)}.hover-black-20:focus,.hover-black-20:hover{color:rgba(0,0,0,.2)}.hover-black-10:focus,.hover-black-10:hover{color:rgba(0,0,0,.1)}.hover-white-90:focus,.hover-white-90:hover{color:hsla(0,0%,100%,.9)}.hover-white-80:focus,.hover-white-80:hover{color:hsla(0,0%,100%,.8)}.hover-white-70:focus,.hover-white-70:hover{color:hsla(0,0%,100%,.7)}.hover-white-60:focus,.hover-white-60:hover{color:hsla(0,0%,100%,.6)}.hover-white-50:focus,.hover-white-50:hover{color:hsla(0,0%,100%,.5)}.hover-white-40:focus,.hover-white-40:hover{color:hsla(0,0%,100%,.4)}.hover-white-30:focus,.hover-white-30:hover{color:hsla(0,0%,100%,.3)}.hover-white-20:focus,.hover-white-20:hover{color:hsla(0,0%,100%,.2)}.hover-white-10:focus,.hover-white-10:hover{color:hsla(0,0%,100%,.1)}.hover-inherit:focus,.hover-inherit:hover{color:inherit}.hover-bg-black:focus,.hover-bg-black:hover{background-color:#000}.hover-bg-near-black:focus,.hover-bg-near-black:hover{background-color:#111}.hover-bg-dark-gray:focus,.hover-bg-dark-gray:hover{background-color:#4d4d4f}.hover-bg-mid-gray:focus,.hover-bg-mid-gray:hover{background-color:#555}.hover-bg-gray:focus,.hover-bg-gray:hover{background-color:#777}.hover-bg-silver:focus,.hover-bg-silver:hover{background-color:#999}.hover-bg-light-silver:focus,.hover-bg-light-silver:hover{background-color:#aaa}.hover-bg-moon-gray:focus,.hover-bg-moon-gray:hover{background-color:#ccc}.hover-bg-light-gray:focus,.hover-bg-light-gray:hover{background-color:#eee}.hover-bg-near-white:focus,.hover-bg-near-white:hover{background-color:#f4f4f4}.hover-bg-white:focus,.hover-bg-white:hover{background-color:#fff}.hover-bg-transparent:focus,.hover-bg-transparent:hover{background-color:transparent}.hover-bg-black-90:focus,.hover-bg-black-90:hover{background-color:rgba(0,0,0,.9)}.hover-bg-black-80:focus,.hover-bg-black-80:hover{background-color:rgba(0,0,0,.8)}.hover-bg-black-70:focus,.hover-bg-black-70:hover{background-color:rgba(0,0,0,.7)}.hover-bg-black-60:focus,.hover-bg-black-60:hover{background-color:rgba(0,0,0,.6)}.hover-bg-black-50:focus,.hover-bg-black-50:hover{background-color:rgba(0,0,0,.5)}.hover-bg-black-40:focus,.hover-bg-black-40:hover{background-color:rgba(0,0,0,.4)}.hover-bg-black-30:focus,.hover-bg-black-30:hover{background-color:rgba(0,0,0,.3)}.hover-bg-black-20:focus,.hover-bg-black-20:hover{background-color:rgba(0,0,0,.2)}.hover-bg-black-10:focus,.hover-bg-black-10:hover{background-color:rgba(0,0,0,.1)}.hover-bg-white-90:focus,.hover-bg-white-90:hover{background-color:hsla(0,0%,100%,.9)}.hover-bg-white-80:focus,.hover-bg-white-80:hover{background-color:hsla(0,0%,100%,.8)}.hover-bg-white-70:focus,.hover-bg-white-70:hover{background-color:hsla(0,0%,100%,.7)}.hover-bg-white-60:focus,.hover-bg-white-60:hover{background-color:hsla(0,0%,100%,.6)}.hover-bg-white-50:focus,.hover-bg-white-50:hover{background-color:hsla(0,0%,100%,.5)}.hover-bg-white-40:focus,.hover-bg-white-40:hover{background-color:hsla(0,0%,100%,.4)}.hover-bg-white-30:focus,.hover-bg-white-30:hover{background-color:hsla(0,0%,100%,.3)}.hover-bg-white-20:focus,.hover-bg-white-20:hover{background-color:hsla(0,0%,100%,.2)}.hover-bg-white-10:focus,.hover-bg-white-10:hover{background-color:hsla(0,0%,100%,.1)}.hover-dark-red:focus,.hover-dark-red:hover{color:#e7040f}.hover-red:focus,.hover-red:hover{color:#ff4136}.hover-light-red:focus,.hover-light-red:hover{color:#ff725c}.hover-orange:focus,.hover-orange:hover{color:#f48120}.hover-gold:focus,.hover-gold:hover{color:#faad3f}.hover-yellow:focus,.hover-yellow:hover{color:gold}.hover-light-yellow:focus,.hover-light-yellow:hover{color:#fbf1a9}.hover-purple:focus,.hover-purple:hover{color:#5e2ca5}.hover-light-purple:focus,.hover-light-purple:hover{color:#a463f2}.hover-dark-pink:focus,.hover-dark-pink:hover{color:#d5008f}.hover-hot-pink:focus,.hover-hot-pink:hover{color:#ff41b4}.hover-pink:focus,.hover-pink:hover{color:#ff80cc}.hover-light-pink:focus,.hover-light-pink:hover{color:#ffa3d7}.hover-dark-green:focus,.hover-dark-green:hover{color:#137752}.hover-green:focus,.hover-green:hover{color:#19a974}.hover-light-green:focus,.hover-light-green:hover{color:#9eebcf}.hover-navy:focus,.hover-navy:hover{color:#001b44}.hover-dark-blue:focus,.hover-dark-blue:hover{color:#00449e}.hover-blue:focus,.hover-blue:hover{color:#408bc9}.hover-light-blue:focus,.hover-light-blue:hover{color:#76c4e2}.hover-lightest-blue:focus,.hover-lightest-blue:hover{color:#cdecff}.hover-washed-blue:focus,.hover-washed-blue:hover{color:#f6fffe}.hover-washed-green:focus,.hover-washed-green:hover{color:#e8fdf5}.hover-washed-yellow:focus,.hover-washed-yellow:hover{color:#fffceb}.hover-washed-red:focus,.hover-washed-red:hover{color:#ffdfdf}.hover-bg-dark-red:focus,.hover-bg-dark-red:hover{background-color:#e7040f}.hover-bg-red:focus,.hover-bg-red:hover{background-color:#ff4136}.hover-bg-light-red:focus,.hover-bg-light-red:hover{background-color:#ff725c}.hover-bg-orange:focus,.hover-bg-orange:hover{background-color:#f48120}.hover-bg-gold:focus,.hover-bg-gold:hover{background-color:#faad3f}.hover-bg-yellow:focus,.hover-bg-yellow:hover{background-color:gold}.hover-bg-light-yellow:focus,.hover-bg-light-yellow:hover{background-color:#fbf1a9}.hover-bg-purple:focus,.hover-bg-purple:hover{background-color:#5e2ca5}.hover-bg-light-purple:focus,.hover-bg-light-purple:hover{background-color:#a463f2}.hover-bg-dark-pink:focus,.hover-bg-dark-pink:hover{background-color:#d5008f}.hover-bg-hot-pink:focus,.hover-bg-hot-pink:hover{background-color:#ff41b4}.hover-bg-pink:focus,.hover-bg-pink:hover{background-color:#ff80cc}.hover-bg-light-pink:focus,.hover-bg-light-pink:hover{background-color:#ffa3d7}.hover-bg-dark-green:focus,.hover-bg-dark-green:hover{background-color:#137752}.hover-bg-green:focus,.hover-bg-green:hover{background-color:#19a974}.hover-bg-light-green:focus,.hover-bg-light-green:hover{background-color:#9eebcf}.hover-bg-navy:focus,.hover-bg-navy:hover{background-color:#001b44}.hover-bg-dark-blue:focus,.hover-bg-dark-blue:hover{background-color:#00449e}.hover-bg-blue:focus,.hover-bg-blue:hover{background-color:#408bc9}.hover-bg-light-blue:focus,.hover-bg-light-blue:hover{background-color:#76c4e2}.hover-bg-lightest-blue:focus,.hover-bg-lightest-blue:hover{background-color:#cdecff}.hover-bg-washed-blue:focus,.hover-bg-washed-blue:hover{background-color:#f6fffe}.hover-bg-washed-green:focus,.hover-bg-washed-green:hover{background-color:#e8fdf5}.hover-bg-washed-yellow:focus,.hover-bg-washed-yellow:hover{background-color:#fffceb}.hover-bg-washed-red:focus,.hover-bg-washed-red:hover{background-color:#ffdfdf}.hover-bg-inherit:focus,.hover-bg-inherit:hover{background-color:inherit}.pa0{padding:0}.pa1{padding:.25rem}.pa2{padding:.5rem}.pa3{padding:1rem}.pa4{padding:2rem}.pa5{padding:4rem}.pa6{padding:8rem}.pa7{padding:16rem}.pl0{padding-left:0}.pl1{padding-left:.25rem}.pl2{padding-left:.5rem}.pl3{padding-left:1rem}.pl4{padding-left:2rem}.pl5{padding-left:4rem}.pl6{padding-left:8rem}.pl7{padding-left:16rem}.pr0{padding-right:0}.pr1{padding-right:.25rem}.pr2{padding-right:.5rem}.pr3{padding-right:1rem}.pr4{padding-right:2rem}.pr5{padding-right:4rem}.pr6{padding-right:8rem}.pr7{padding-right:16rem}.pb0{padding-bottom:0}.pb1{padding-bottom:.25rem}.pb2{padding-bottom:.5rem}.pb3{padding-bottom:1rem}.pb4{padding-bottom:2rem}.pb5{padding-bottom:4rem}.pb6{padding-bottom:8rem}.pb7{padding-bottom:16rem}.pt0{padding-top:0}.pt1{padding-top:.25rem}.pt2{padding-top:.5rem}.pt3{padding-top:1rem}.pt4{padding-top:2rem}.pt5{padding-top:4rem}.pt6{padding-top:8rem}.pt7{padding-top:16rem}.pv0{padding-top:0;padding-bottom:0}.pv1{padding-top:.25rem;padding-bottom:.25rem}.pv2{padding-top:.5rem;padding-bottom:.5rem}.pv3{padding-top:1rem;padding-bottom:1rem}.pv4{padding-top:2rem;padding-bottom:2rem}.pv5{padding-top:4rem;padding-bottom:4rem}.pv6{padding-top:8rem;padding-bottom:8rem}.pv7{padding-top:16rem;padding-bottom:16rem}.ph0{padding-left:0;padding-right:0}.ph1{padding-left:.25rem;padding-right:.25rem}.ph2{padding-left:.5rem;padding-right:.5rem}.ph3{padding-left:1rem;padding-right:1rem}.ph4{padding-left:2rem;padding-right:2rem}.ph5{padding-left:4rem;padding-right:4rem}.ph6{padding-left:8rem;padding-right:8rem}.ph7{padding-left:16rem;padding-right:16rem}.ma0{margin:0}.ma1{margin:.25rem}.ma2{margin:.5rem}.ma3{margin:1rem}.ma4{margin:2rem}.ma5{margin:4rem}.ma6{margin:8rem}.ma7{margin:16rem}.ml0{margin-left:0}.ml1{margin-left:.25rem}.ml2{margin-left:.5rem}.ml3{margin-left:1rem}.ml4{margin-left:2rem}.ml5{margin-left:4rem}.ml6{margin-left:8rem}.ml7{margin-left:16rem}.mr0{margin-right:0}.mr1{margin-right:.25rem}.mr2{margin-right:.5rem}.mr3{margin-right:1rem}.mr4{margin-right:2rem}.mr5{margin-right:4rem}.mr6{margin-right:8rem}.mr7{margin-right:16rem}.mb0{margin-bottom:0}.mb1{margin-bottom:.25rem}.mb2{margin-bottom:.5rem}.mb3{margin-bottom:1rem}.mb4{margin-bottom:2rem}.mb5{margin-bottom:4rem}.mb6{margin-bottom:8rem}.mb7{margin-bottom:16rem}.mt0{margin-top:0}.mt1{margin-top:.25rem}.mt2{margin-top:.5rem}.mt3{margin-top:1rem}.mt4{margin-top:2rem}.mt5{margin-top:4rem}.mt6{margin-top:8rem}.mt7{margin-top:16rem}.mv0{margin-top:0;margin-bottom:0}.mv1{margin-top:.25rem;margin-bottom:.25rem}.mv2{margin-top:.5rem;margin-bottom:.5rem}.mv3{margin-top:1rem;margin-bottom:1rem}.mv4{margin-top:2rem;margin-bottom:2rem}.mv5{margin-top:4rem;margin-bottom:4rem}.mv6{margin-top:8rem;margin-bottom:8rem}.mv7{margin-top:16rem;margin-bottom:16rem}.mh0{margin-left:0;margin-right:0}.mh1{margin-left:.25rem;margin-right:.25rem}.mh2{margin-left:.5rem;margin-right:.5rem}.mh3{margin-left:1rem;margin-right:1rem}.mh4{margin-left:2rem;margin-right:2rem}.mh5{margin-left:4rem;margin-right:4rem}.mh6{margin-left:8rem;margin-right:8rem}.mh7{margin-left:16rem;margin-right:16rem}.na1{margin:-.25rem}.na2{margin:-.5rem}.na3{margin:-1rem}.na4{margin:-2rem}.na5{margin:-4rem}.na6{margin:-8rem}.na7{margin:-16rem}.nl1{margin-left:-.25rem}.nl2{margin-left:-.5rem}.nl3{margin-left:-1rem}.nl4{margin-left:-2rem}.nl5{margin-left:-4rem}.nl6{margin-left:-8rem}.nl7{margin-left:-16rem}.nr1{margin-right:-.25rem}.nr2{margin-right:-.5rem}.nr3{margin-right:-1rem}.nr4{margin-right:-2rem}.nr5{margin-right:-4rem}.nr6{margin-right:-8rem}.nr7{margin-right:-16rem}.nb1{margin-bottom:-.25rem}.nb2{margin-bottom:-.5rem}.nb3{margin-bottom:-1rem}.nb4{margin-bottom:-2rem}.nb5{margin-bottom:-4rem}.nb6{margin-bottom:-8rem}.nb7{margin-bottom:-16rem}.nt1{margin-top:-.25rem}.nt2{margin-top:-.5rem}.nt3{margin-top:-1rem}.nt4{margin-top:-2rem}.nt5{margin-top:-4rem}.nt6{margin-top:-8rem}.nt7{margin-top:-16rem}.collapse{border-collapse:collapse;border-spacing:0}.striped--light-silver:nth-child(odd){background-color:#aaa}.striped--moon-gray:nth-child(odd){background-color:#ccc}.striped--light-gray:nth-child(odd){background-color:#eee}.striped--near-white:nth-child(odd){background-color:#f4f4f4}.stripe-light:nth-child(odd){background-color:hsla(0,0%,100%,.1)}.stripe-dark:nth-child(odd){background-color:rgba(0,0,0,.1)}.strike{text-decoration:line-through}.underline{text-decoration:underline}.no-underline{text-decoration:none}.tl{text-align:left}.tr{text-align:right}.tc{text-align:center}.tj{text-align:justify}.ttc{text-transform:capitalize}.ttl{text-transform:lowercase}.ttu{text-transform:uppercase}.ttn{text-transform:none}.f-6,.f-headline{font-size:6rem}.f-5,.f-subheadline{font-size:5rem}.f1{font-size:3rem}.f2{font-size:2.25rem}.f3{font-size:1.5rem}.f4{font-size:1.25rem}.f5{font-size:1rem}.f6{font-size:.875rem}.f7{font-size:.75rem}.measure{max-width:30em}.measure-wide{max-width:34em}.measure-narrow{max-width:20em}.indent{text-indent:1em;margin-top:0;margin-bottom:0}.small-caps{font-variant:small-caps}.truncate{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.overflow-container{overflow-y:scroll}.center{margin-left:auto}.center,.mr-auto{margin-right:auto}.ml-auto{margin-left:auto}.clip{position:fixed!important;_position:absolute!important;clip:rect(1px 1px 1px 1px);clip:rect(1px,1px,1px,1px)}.ws-normal{white-space:normal}.nowrap{white-space:nowrap}.pre{white-space:pre}.v-base{vertical-align:baseline}.v-mid{vertical-align:middle}.v-top{vertical-align:top}.v-btm{vertical-align:bottom}.dim{opacity:1}.dim,.dim:focus,.dim:hover{transition:opacity .15s ease-in}.dim:focus,.dim:hover{opacity:.5}.dim:active{opacity:.8;transition:opacity .15s ease-out}.glow,.glow:focus,.glow:hover{transition:opacity .15s ease-in}.glow:focus,.glow:hover{opacity:1}.hide-child .child{opacity:0;transition:opacity .15s ease-in}.hide-child:active .child,.hide-child:focus .child,.hide-child:hover .child{opacity:1;transition:opacity .15s ease-in}.underline-hover:focus,.underline-hover:hover{text-decoration:underline}.grow{-moz-osx-font-smoothing:grayscale;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transform:translateZ(0);transform:translateZ(0);transition:-webkit-transform .25s ease-out;transition:transform .25s ease-out;transition:transform .25s ease-out,-webkit-transform .25s ease-out}.grow:focus,.grow:hover{-webkit-transform:scale(1.05);transform:scale(1.05)}.grow:active{-webkit-transform:scale(.9);transform:scale(.9)}.grow-large{-moz-osx-font-smoothing:grayscale;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transform:translateZ(0);transform:translateZ(0);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}.grow-large:focus,.grow-large:hover{-webkit-transform:scale(1.2);transform:scale(1.2)}.grow-large:active{-webkit-transform:scale(.95);transform:scale(.95)}.pointer:hover,.shadow-hover{cursor:pointer}.shadow-hover{position:relative;transition:all .5s cubic-bezier(.165,.84,.44,1)}.shadow-hover:after{content:"";box-shadow:0 0 16px 2px rgba(0,0,0,.2);border-radius:inherit;opacity:0;position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;transition:opacity .5s cubic-bezier(.165,.84,.44,1)}.shadow-hover:focus:after,.shadow-hover:hover:after{opacity:1}.bg-animate,.bg-animate:focus,.bg-animate:hover{transition:background-color .15s ease-in-out}.z-0{z-index:0}.z-1{z-index:1}.z-2{z-index:2}.z-3{z-index:3}.z-4{z-index:4}.z-5{z-index:5}.z-999{z-index:999}.z-9999{z-index:9999}.z-max{z-index:2147483647}.z-inherit{z-index:inherit}.z-initial{z-index:auto}.z-unset{z-index:unset}.nested-copy-line-height ol,.nested-copy-line-height p,.nested-copy-line-height ul{line-height:1.5}.nested-headline-line-height h1,.nested-headline-line-height h2,.nested-headline-line-height h3,.nested-headline-line-height h4,.nested-headline-line-height h5,.nested-headline-line-height h6{line-height:1.25}.nested-list-reset ol,.nested-list-reset ul{padding-left:0;margin-left:0;list-style-type:none}.nested-copy-indent p+p{text-indent:1em;margin-top:0;margin-bottom:0}.nested-copy-seperator p+p{margin-top:1.5em}.nested-img img{width:100%;max-width:100%;display:block}.nested-links a{color:#408bc9;transition:color .15s ease-in}.nested-links a:focus,.nested-links a:hover{color:#76c4e2;transition:color .15s ease-in}.debug *{outline:1px solid gold}.debug-white *{outline:1px solid #fff}.debug-black *{outline:1px solid #000}.debug-grid{background:transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAAFElEQVR4AWPAC97/9x0eCsAEPgwAVLshdpENIxcAAAAASUVORK5CYII=) repeat 0 0}.debug-grid-16{background:transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAMklEQVR4AWOgCLz/b0epAa6UGuBOqQHOQHLUgFEDnAbcBZ4UGwDOkiCnkIhdgNgNxAYAiYlD+8sEuo8AAAAASUVORK5CYII=) repeat 0 0}.debug-grid-8-solid{background:#fff url(data:image/gif;base64,R0lGODdhCAAIAPEAAADw/wDx/////wAAACwAAAAACAAIAAACDZQvgaeb/lxbAIKA8y0AOw==) repeat 0 0}.debug-grid-16-solid{background:#fff url(data:image/gif;base64,R0lGODdhEAAQAPEAAADw/wDx/xXy/////ywAAAAAEAAQAAACIZyPKckYDQFsb6ZqD85jZ2+BkwiRFKehhqQCQgDHcgwEBQA7) repeat 0 0}@media screen and (min-width:30em){.aspect-ratio-ns{height:0;position:relative}.aspect-ratio--16x9-ns{padding-bottom:56.25%}.aspect-ratio--9x16-ns{padding-bottom:177.77%}.aspect-ratio--4x3-ns{padding-bottom:75%}.aspect-ratio--3x4-ns{padding-bottom:133.33%}.aspect-ratio--6x4-ns{padding-bottom:66.6%}.aspect-ratio--4x6-ns{padding-bottom:150%}.aspect-ratio--8x5-ns{padding-bottom:62.5%}.aspect-ratio--5x8-ns{padding-bottom:160%}.aspect-ratio--7x5-ns{padding-bottom:71.42%}.aspect-ratio--5x7-ns{padding-bottom:140%}.aspect-ratio--1x1-ns{padding-bottom:100%}.aspect-ratio--object-ns{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:100}.cover-ns{background-size:cover!important}.contain-ns{background-size:contain!important}.bg-center-ns{background-position:50%}.bg-center-ns,.bg-top-ns{background-repeat:no-repeat}.bg-top-ns{background-position:top}.bg-right-ns{background-position:100%}.bg-bottom-ns,.bg-right-ns{background-repeat:no-repeat}.bg-bottom-ns{background-position:bottom}.bg-left-ns{background-repeat:no-repeat;background-position:0}.outline-ns{outline:1px solid}.outline-transparent-ns{outline:1px solid transparent}.outline-0-ns{outline:0}.ba-ns{border-style:solid;border-width:1px}.bt-ns{border-top-style:solid;border-top-width:1px}.br-ns{border-right-style:solid;border-right-width:1px}.bb-ns{border-bottom-style:solid;border-bottom-width:1px}.bl-ns{border-left-style:solid;border-left-width:1px}.bn-ns{border-style:none;border-width:0}.br0-ns{border-radius:0}.br1-ns{border-radius:.125rem}.br2-ns{border-radius:.25rem}.br3-ns{border-radius:.5rem}.br4-ns{border-radius:1rem}.br-100-ns{border-radius:100%}.br-pill-ns{border-radius:9999px}.br--bottom-ns{border-top-left-radius:0;border-top-right-radius:0}.br--top-ns{border-bottom-right-radius:0}.br--right-ns,.br--top-ns{border-bottom-left-radius:0}.br--right-ns{border-top-left-radius:0}.br--left-ns{border-top-right-radius:0;border-bottom-right-radius:0}.b--dotted-ns{border-style:dotted}.b--dashed-ns{border-style:dashed}.b--solid-ns{border-style:solid}.b--none-ns{border-style:none}.bw0-ns{border-width:0}.bw1-ns{border-width:.125rem}.bw2-ns{border-width:.25rem}.bw3-ns{border-width:.5rem}.bw4-ns{border-width:1rem}.bw5-ns{border-width:2rem}.bt-0-ns{border-top-width:0}.br-0-ns{border-right-width:0}.bb-0-ns{border-bottom-width:0}.bl-0-ns{border-left-width:0}.shadow-1-ns{box-shadow:0 0 4px 2px rgba(0,0,0,.2)}.shadow-2-ns{box-shadow:0 0 8px 2px rgba(0,0,0,.2)}.shadow-3-ns{box-shadow:2px 2px 4px 2px rgba(0,0,0,.2)}.shadow-4-ns{box-shadow:2px 2px 8px 0 rgba(0,0,0,.2)}.shadow-5-ns{box-shadow:4px 4px 8px 0 rgba(0,0,0,.2)}.top-0-ns{top:0}.left-0-ns{left:0}.right-0-ns{right:0}.bottom-0-ns{bottom:0}.top-1-ns{top:1rem}.left-1-ns{left:1rem}.right-1-ns{right:1rem}.bottom-1-ns{bottom:1rem}.top-2-ns{top:2rem}.left-2-ns{left:2rem}.right-2-ns{right:2rem}.bottom-2-ns{bottom:2rem}.top--1-ns{top:-1rem}.right--1-ns{right:-1rem}.bottom--1-ns{bottom:-1rem}.left--1-ns{left:-1rem}.top--2-ns{top:-2rem}.right--2-ns{right:-2rem}.bottom--2-ns{bottom:-2rem}.left--2-ns{left:-2rem}.absolute--fill-ns{top:0;right:0;bottom:0;left:0}.cl-ns{clear:left}.cr-ns{clear:right}.cb-ns{clear:both}.cn-ns{clear:none}.dn-ns{display:none}.di-ns{display:inline}.db-ns{display:block}.dib-ns{display:inline-block}.dit-ns{display:inline-table}.dt-ns{display:table}.dtc-ns{display:table-cell}.dt-row-ns{display:table-row}.dt-row-group-ns{display:table-row-group}.dt-column-ns{display:table-column}.dt-column-group-ns{display:table-column-group}.dt--fixed-ns{table-layout:fixed;width:100%}.flex-ns{display:-webkit-box;display:-ms-flexbox;display:flex}.inline-flex-ns{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.flex-auto-ns{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;min-width:0;min-height:0}.flex-none-ns{-webkit-box-flex:0;-ms-flex:none;flex:none}.flex-column-ns{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.flex-row-ns{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.flex-wrap-ns{-ms-flex-wrap:wrap;flex-wrap:wrap}.flex-nowrap-ns{-ms-flex-wrap:nowrap;flex-wrap:nowrap}.flex-wrap-reverse-ns{-ms-flex-wrap:wrap-reverse;flex-wrap:wrap-reverse}.flex-column-reverse-ns{-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.flex-row-reverse-ns{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.items-start-ns{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.items-end-ns{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.items-center-ns{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.items-baseline-ns{-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline}.items-stretch-ns{-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch}.self-start-ns{-ms-flex-item-align:start;align-self:flex-start}.self-end-ns{-ms-flex-item-align:end;align-self:flex-end}.self-center-ns{-ms-flex-item-align:center;-ms-grid-row-align:center;align-self:center}.self-baseline-ns{-ms-flex-item-align:baseline;align-self:baseline}.self-stretch-ns{-ms-flex-item-align:stretch;-ms-grid-row-align:stretch;align-self:stretch}.justify-start-ns{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.justify-end-ns{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.justify-center-ns{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.justify-between-ns{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.justify-around-ns{-ms-flex-pack:distribute;justify-content:space-around}.content-start-ns{-ms-flex-line-pack:start;align-content:flex-start}.content-end-ns{-ms-flex-line-pack:end;align-content:flex-end}.content-center-ns{-ms-flex-line-pack:center;align-content:center}.content-between-ns{-ms-flex-line-pack:justify;align-content:space-between}.content-around-ns{-ms-flex-line-pack:distribute;align-content:space-around}.content-stretch-ns{-ms-flex-line-pack:stretch;align-content:stretch}.order-0-ns{-webkit-box-ordinal-group:1;-ms-flex-order:0;order:0}.order-1-ns{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.order-2-ns{-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}.order-3-ns{-webkit-box-ordinal-group:4;-ms-flex-order:3;order:3}.order-4-ns{-webkit-box-ordinal-group:5;-ms-flex-order:4;order:4}.order-5-ns{-webkit-box-ordinal-group:6;-ms-flex-order:5;order:5}.order-6-ns{-webkit-box-ordinal-group:7;-ms-flex-order:6;order:6}.order-7-ns{-webkit-box-ordinal-group:8;-ms-flex-order:7;order:7}.order-8-ns{-webkit-box-ordinal-group:9;-ms-flex-order:8;order:8}.order-last-ns{-webkit-box-ordinal-group:100000;-ms-flex-order:99999;order:99999}.fl-ns{float:left}.fl-ns,.fr-ns{display:inline}.fr-ns{float:right}.fn-ns{float:none}.i-ns{font-style:italic}.fs-normal-ns{font-style:normal}.normal-ns{font-weight:400}.b-ns{font-weight:700}.fw1-ns{font-weight:100}.fw2-ns{font-weight:200}.fw3-ns{font-weight:300}.fw4-ns{font-weight:400}.fw5-ns{font-weight:500}.fw6-ns{font-weight:600}.fw7-ns{font-weight:700}.fw8-ns{font-weight:800}.fw9-ns{font-weight:900}.h1-ns{height:1rem}.h2-ns{height:2rem}.h3-ns{height:4rem}.h4-ns{height:8rem}.h5-ns{height:16rem}.h-25-ns{height:25%}.h-50-ns{height:50%}.h-75-ns{height:75%}.h-100-ns{height:100%}.min-h-100-ns{min-height:100%}.vh-25-ns{height:25vh}.vh-50-ns{height:50vh}.vh-75-ns{height:75vh}.vh-100-ns{height:100vh}.min-vh-100-ns{min-height:100vh}.h-auto-ns{height:auto}.h-inherit-ns{height:inherit}.tracked-ns{letter-spacing:.1em}.tracked-tight-ns{letter-spacing:-.05em}.tracked-mega-ns{letter-spacing:.25em}.lh-solid-ns{line-height:1}.lh-title-ns{line-height:1.25}.lh-copy-ns{line-height:1.5}.mw-100-ns{max-width:100%}.mw1-ns{max-width:1rem}.mw2-ns{max-width:2rem}.mw3-ns{max-width:4rem}.mw4-ns{max-width:8rem}.mw5-ns{max-width:16rem}.mw6-ns{max-width:32rem}.mw7-ns{max-width:48rem}.mw8-ns{max-width:64rem}.mw9-ns{max-width:96rem}.mw-none-ns{max-width:none}.w1-ns{width:1rem}.w2-ns{width:2rem}.w3-ns{width:4rem}.w4-ns{width:8rem}.w5-ns{width:16rem}.w-10-ns{width:10%}.w-20-ns{width:20%}.w-25-ns{width:25%}.w-30-ns{width:30%}.w-33-ns{width:33%}.w-34-ns{width:34%}.w-40-ns{width:40%}.w-50-ns{width:50%}.w-60-ns{width:60%}.w-70-ns{width:70%}.w-75-ns{width:75%}.w-80-ns{width:80%}.w-90-ns{width:90%}.w-100-ns{width:100%}.w-third-ns{width:33.33333%}.w-two-thirds-ns{width:66.66667%}.w-auto-ns{width:auto}.overflow-visible-ns{overflow:visible}.overflow-hidden-ns{overflow:hidden}.overflow-scroll-ns{overflow:scroll}.overflow-auto-ns{overflow:auto}.overflow-x-visible-ns{overflow-x:visible}.overflow-x-hidden-ns{overflow-x:hidden}.overflow-x-scroll-ns{overflow-x:scroll}.overflow-x-auto-ns{overflow-x:auto}.overflow-y-visible-ns{overflow-y:visible}.overflow-y-hidden-ns{overflow-y:hidden}.overflow-y-scroll-ns{overflow-y:scroll}.overflow-y-auto-ns{overflow-y:auto}.static-ns{position:static}.relative-ns{position:relative}.absolute-ns{position:absolute}.fixed-ns{position:fixed}.rotate-45-ns{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.rotate-90-ns{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.rotate-135-ns{-webkit-transform:rotate(135deg);transform:rotate(135deg)}.rotate-180-ns{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.rotate-225-ns{-webkit-transform:rotate(225deg);transform:rotate(225deg)}.rotate-270-ns{-webkit-transform:rotate(270deg);transform:rotate(270deg)}.rotate-315-ns{-webkit-transform:rotate(315deg);transform:rotate(315deg)}.pa0-ns{padding:0}.pa1-ns{padding:.25rem}.pa2-ns{padding:.5rem}.pa3-ns{padding:1rem}.pa4-ns{padding:2rem}.pa5-ns{padding:4rem}.pa6-ns{padding:8rem}.pa7-ns{padding:16rem}.pl0-ns{padding-left:0}.pl1-ns{padding-left:.25rem}.pl2-ns{padding-left:.5rem}.pl3-ns{padding-left:1rem}.pl4-ns{padding-left:2rem}.pl5-ns{padding-left:4rem}.pl6-ns{padding-left:8rem}.pl7-ns{padding-left:16rem}.pr0-ns{padding-right:0}.pr1-ns{padding-right:.25rem}.pr2-ns{padding-right:.5rem}.pr3-ns{padding-right:1rem}.pr4-ns{padding-right:2rem}.pr5-ns{padding-right:4rem}.pr6-ns{padding-right:8rem}.pr7-ns{padding-right:16rem}.pb0-ns{padding-bottom:0}.pb1-ns{padding-bottom:.25rem}.pb2-ns{padding-bottom:.5rem}.pb3-ns{padding-bottom:1rem}.pb4-ns{padding-bottom:2rem}.pb5-ns{padding-bottom:4rem}.pb6-ns{padding-bottom:8rem}.pb7-ns{padding-bottom:16rem}.pt0-ns{padding-top:0}.pt1-ns{padding-top:.25rem}.pt2-ns{padding-top:.5rem}.pt3-ns{padding-top:1rem}.pt4-ns{padding-top:2rem}.pt5-ns{padding-top:4rem}.pt6-ns{padding-top:8rem}.pt7-ns{padding-top:16rem}.pv0-ns{padding-top:0;padding-bottom:0}.pv1-ns{padding-top:.25rem;padding-bottom:.25rem}.pv2-ns{padding-top:.5rem;padding-bottom:.5rem}.pv3-ns{padding-top:1rem;padding-bottom:1rem}.pv4-ns{padding-top:2rem;padding-bottom:2rem}.pv5-ns{padding-top:4rem;padding-bottom:4rem}.pv6-ns{padding-top:8rem;padding-bottom:8rem}.pv7-ns{padding-top:16rem;padding-bottom:16rem}.ph0-ns{padding-left:0;padding-right:0}.ph1-ns{padding-left:.25rem;padding-right:.25rem}.ph2-ns{padding-left:.5rem;padding-right:.5rem}.ph3-ns{padding-left:1rem;padding-right:1rem}.ph4-ns{padding-left:2rem;padding-right:2rem}.ph5-ns{padding-left:4rem;padding-right:4rem}.ph6-ns{padding-left:8rem;padding-right:8rem}.ph7-ns{padding-left:16rem;padding-right:16rem}.ma0-ns{margin:0}.ma1-ns{margin:.25rem}.ma2-ns{margin:.5rem}.ma3-ns{margin:1rem}.ma4-ns{margin:2rem}.ma5-ns{margin:4rem}.ma6-ns{margin:8rem}.ma7-ns{margin:16rem}.ml0-ns{margin-left:0}.ml1-ns{margin-left:.25rem}.ml2-ns{margin-left:.5rem}.ml3-ns{margin-left:1rem}.ml4-ns{margin-left:2rem}.ml5-ns{margin-left:4rem}.ml6-ns{margin-left:8rem}.ml7-ns{margin-left:16rem}.mr0-ns{margin-right:0}.mr1-ns{margin-right:.25rem}.mr2-ns{margin-right:.5rem}.mr3-ns{margin-right:1rem}.mr4-ns{margin-right:2rem}.mr5-ns{margin-right:4rem}.mr6-ns{margin-right:8rem}.mr7-ns{margin-right:16rem}.mb0-ns{margin-bottom:0}.mb1-ns{margin-bottom:.25rem}.mb2-ns{margin-bottom:.5rem}.mb3-ns{margin-bottom:1rem}.mb4-ns{margin-bottom:2rem}.mb5-ns{margin-bottom:4rem}.mb6-ns{margin-bottom:8rem}.mb7-ns{margin-bottom:16rem}.mt0-ns{margin-top:0}.mt1-ns{margin-top:.25rem}.mt2-ns{margin-top:.5rem}.mt3-ns{margin-top:1rem}.mt4-ns{margin-top:2rem}.mt5-ns{margin-top:4rem}.mt6-ns{margin-top:8rem}.mt7-ns{margin-top:16rem}.mv0-ns{margin-top:0;margin-bottom:0}.mv1-ns{margin-top:.25rem;margin-bottom:.25rem}.mv2-ns{margin-top:.5rem;margin-bottom:.5rem}.mv3-ns{margin-top:1rem;margin-bottom:1rem}.mv4-ns{margin-top:2rem;margin-bottom:2rem}.mv5-ns{margin-top:4rem;margin-bottom:4rem}.mv6-ns{margin-top:8rem;margin-bottom:8rem}.mv7-ns{margin-top:16rem;margin-bottom:16rem}.mh0-ns{margin-left:0;margin-right:0}.mh1-ns{margin-left:.25rem;margin-right:.25rem}.mh2-ns{margin-left:.5rem;margin-right:.5rem}.mh3-ns{margin-left:1rem;margin-right:1rem}.mh4-ns{margin-left:2rem;margin-right:2rem}.mh5-ns{margin-left:4rem;margin-right:4rem}.mh6-ns{margin-left:8rem;margin-right:8rem}.mh7-ns{margin-left:16rem;margin-right:16rem}.na1-ns{margin:-.25rem}.na2-ns{margin:-.5rem}.na3-ns{margin:-1rem}.na4-ns{margin:-2rem}.na5-ns{margin:-4rem}.na6-ns{margin:-8rem}.na7-ns{margin:-16rem}.nl1-ns{margin-left:-.25rem}.nl2-ns{margin-left:-.5rem}.nl3-ns{margin-left:-1rem}.nl4-ns{margin-left:-2rem}.nl5-ns{margin-left:-4rem}.nl6-ns{margin-left:-8rem}.nl7-ns{margin-left:-16rem}.nr1-ns{margin-right:-.25rem}.nr2-ns{margin-right:-.5rem}.nr3-ns{margin-right:-1rem}.nr4-ns{margin-right:-2rem}.nr5-ns{margin-right:-4rem}.nr6-ns{margin-right:-8rem}.nr7-ns{margin-right:-16rem}.nb1-ns{margin-bottom:-.25rem}.nb2-ns{margin-bottom:-.5rem}.nb3-ns{margin-bottom:-1rem}.nb4-ns{margin-bottom:-2rem}.nb5-ns{margin-bottom:-4rem}.nb6-ns{margin-bottom:-8rem}.nb7-ns{margin-bottom:-16rem}.nt1-ns{margin-top:-.25rem}.nt2-ns{margin-top:-.5rem}.nt3-ns{margin-top:-1rem}.nt4-ns{margin-top:-2rem}.nt5-ns{margin-top:-4rem}.nt6-ns{margin-top:-8rem}.nt7-ns{margin-top:-16rem}.strike-ns{text-decoration:line-through}.underline-ns{text-decoration:underline}.no-underline-ns{text-decoration:none}.tl-ns{text-align:left}.tr-ns{text-align:right}.tc-ns{text-align:center}.tj-ns{text-align:justify}.ttc-ns{text-transform:capitalize}.ttl-ns{text-transform:lowercase}.ttu-ns{text-transform:uppercase}.ttn-ns{text-transform:none}.f-6-ns,.f-headline-ns{font-size:6rem}.f-5-ns,.f-subheadline-ns{font-size:5rem}.f1-ns{font-size:3rem}.f2-ns{font-size:2.25rem}.f3-ns{font-size:1.5rem}.f4-ns{font-size:1.25rem}.f5-ns{font-size:1rem}.f6-ns{font-size:.875rem}.f7-ns{font-size:.75rem}.measure-ns{max-width:30em}.measure-wide-ns{max-width:34em}.measure-narrow-ns{max-width:20em}.indent-ns{text-indent:1em;margin-top:0;margin-bottom:0}.small-caps-ns{font-variant:small-caps}.truncate-ns{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.center-ns{margin-left:auto}.center-ns,.mr-auto-ns{margin-right:auto}.ml-auto-ns{margin-left:auto}.clip-ns{position:fixed!important;position:absolute!important;clip:rect(1px 1px 1px 1px);clip:rect(1px,1px,1px,1px)}.ws-normal-ns{white-space:normal}.nowrap-ns{white-space:nowrap}.pre-ns{white-space:pre}.v-base-ns{vertical-align:baseline}.v-mid-ns{vertical-align:middle}.v-top-ns{vertical-align:top}.v-btm-ns{vertical-align:bottom}}@media screen and (min-width:30em) and (max-width:60em){.aspect-ratio-m{height:0;position:relative}.aspect-ratio--16x9-m{padding-bottom:56.25%}.aspect-ratio--9x16-m{padding-bottom:177.77%}.aspect-ratio--4x3-m{padding-bottom:75%}.aspect-ratio--3x4-m{padding-bottom:133.33%}.aspect-ratio--6x4-m{padding-bottom:66.6%}.aspect-ratio--4x6-m{padding-bottom:150%}.aspect-ratio--8x5-m{padding-bottom:62.5%}.aspect-ratio--5x8-m{padding-bottom:160%}.aspect-ratio--7x5-m{padding-bottom:71.42%}.aspect-ratio--5x7-m{padding-bottom:140%}.aspect-ratio--1x1-m{padding-bottom:100%}.aspect-ratio--object-m{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:100}.cover-m{background-size:cover!important}.contain-m{background-size:contain!important}.bg-center-m{background-position:50%}.bg-center-m,.bg-top-m{background-repeat:no-repeat}.bg-top-m{background-position:top}.bg-right-m{background-position:100%}.bg-bottom-m,.bg-right-m{background-repeat:no-repeat}.bg-bottom-m{background-position:bottom}.bg-left-m{background-repeat:no-repeat;background-position:0}.outline-m{outline:1px solid}.outline-transparent-m{outline:1px solid transparent}.outline-0-m{outline:0}.ba-m{border-style:solid;border-width:1px}.bt-m{border-top-style:solid;border-top-width:1px}.br-m{border-right-style:solid;border-right-width:1px}.bb-m{border-bottom-style:solid;border-bottom-width:1px}.bl-m{border-left-style:solid;border-left-width:1px}.bn-m{border-style:none;border-width:0}.br0-m{border-radius:0}.br1-m{border-radius:.125rem}.br2-m{border-radius:.25rem}.br3-m{border-radius:.5rem}.br4-m{border-radius:1rem}.br-100-m{border-radius:100%}.br-pill-m{border-radius:9999px}.br--bottom-m{border-top-left-radius:0;border-top-right-radius:0}.br--top-m{border-bottom-right-radius:0}.br--right-m,.br--top-m{border-bottom-left-radius:0}.br--right-m{border-top-left-radius:0}.br--left-m{border-top-right-radius:0;border-bottom-right-radius:0}.b--dotted-m{border-style:dotted}.b--dashed-m{border-style:dashed}.b--solid-m{border-style:solid}.b--none-m{border-style:none}.bw0-m{border-width:0}.bw1-m{border-width:.125rem}.bw2-m{border-width:.25rem}.bw3-m{border-width:.5rem}.bw4-m{border-width:1rem}.bw5-m{border-width:2rem}.bt-0-m{border-top-width:0}.br-0-m{border-right-width:0}.bb-0-m{border-bottom-width:0}.bl-0-m{border-left-width:0}.shadow-1-m{box-shadow:0 0 4px 2px rgba(0,0,0,.2)}.shadow-2-m{box-shadow:0 0 8px 2px rgba(0,0,0,.2)}.shadow-3-m{box-shadow:2px 2px 4px 2px rgba(0,0,0,.2)}.shadow-4-m{box-shadow:2px 2px 8px 0 rgba(0,0,0,.2)}.shadow-5-m{box-shadow:4px 4px 8px 0 rgba(0,0,0,.2)}.top-0-m{top:0}.left-0-m{left:0}.right-0-m{right:0}.bottom-0-m{bottom:0}.top-1-m{top:1rem}.left-1-m{left:1rem}.right-1-m{right:1rem}.bottom-1-m{bottom:1rem}.top-2-m{top:2rem}.left-2-m{left:2rem}.right-2-m{right:2rem}.bottom-2-m{bottom:2rem}.top--1-m{top:-1rem}.right--1-m{right:-1rem}.bottom--1-m{bottom:-1rem}.left--1-m{left:-1rem}.top--2-m{top:-2rem}.right--2-m{right:-2rem}.bottom--2-m{bottom:-2rem}.left--2-m{left:-2rem}.absolute--fill-m{top:0;right:0;bottom:0;left:0}.cl-m{clear:left}.cr-m{clear:right}.cb-m{clear:both}.cn-m{clear:none}.dn-m{display:none}.di-m{display:inline}.db-m{display:block}.dib-m{display:inline-block}.dit-m{display:inline-table}.dt-m{display:table}.dtc-m{display:table-cell}.dt-row-m{display:table-row}.dt-row-group-m{display:table-row-group}.dt-column-m{display:table-column}.dt-column-group-m{display:table-column-group}.dt--fixed-m{table-layout:fixed;width:100%}.flex-m{display:-webkit-box;display:-ms-flexbox;display:flex}.inline-flex-m{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.flex-auto-m{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;min-width:0;min-height:0}.flex-none-m{-webkit-box-flex:0;-ms-flex:none;flex:none}.flex-column-m{-webkit-box-orient:vertical;-ms-flex-direction:column;flex-direction:column}.flex-column-m,.flex-row-m{-webkit-box-direction:normal}.flex-row-m{-webkit-box-orient:horizontal;-ms-flex-direction:row;flex-direction:row}.flex-wrap-m{-ms-flex-wrap:wrap;flex-wrap:wrap}.flex-nowrap-m{-ms-flex-wrap:nowrap;flex-wrap:nowrap}.flex-wrap-reverse-m{-ms-flex-wrap:wrap-reverse;flex-wrap:wrap-reverse}.flex-column-reverse-m{-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.flex-row-reverse-m{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.items-start-m{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.items-end-m{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.items-center-m{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.items-baseline-m{-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline}.items-stretch-m{-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch}.self-start-m{-ms-flex-item-align:start;align-self:flex-start}.self-end-m{-ms-flex-item-align:end;align-self:flex-end}.self-center-m{-ms-flex-item-align:center;-ms-grid-row-align:center;align-self:center}.self-baseline-m{-ms-flex-item-align:baseline;align-self:baseline}.self-stretch-m{-ms-flex-item-align:stretch;-ms-grid-row-align:stretch;align-self:stretch}.justify-start-m{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.justify-end-m{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.justify-center-m{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.justify-between-m{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.justify-around-m{-ms-flex-pack:distribute;justify-content:space-around}.content-start-m{-ms-flex-line-pack:start;align-content:flex-start}.content-end-m{-ms-flex-line-pack:end;align-content:flex-end}.content-center-m{-ms-flex-line-pack:center;align-content:center}.content-between-m{-ms-flex-line-pack:justify;align-content:space-between}.content-around-m{-ms-flex-line-pack:distribute;align-content:space-around}.content-stretch-m{-ms-flex-line-pack:stretch;align-content:stretch}.order-0-m{-webkit-box-ordinal-group:1;-ms-flex-order:0;order:0}.order-1-m{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.order-2-m{-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}.order-3-m{-webkit-box-ordinal-group:4;-ms-flex-order:3;order:3}.order-4-m{-webkit-box-ordinal-group:5;-ms-flex-order:4;order:4}.order-5-m{-webkit-box-ordinal-group:6;-ms-flex-order:5;order:5}.order-6-m{-webkit-box-ordinal-group:7;-ms-flex-order:6;order:6}.order-7-m{-webkit-box-ordinal-group:8;-ms-flex-order:7;order:7}.order-8-m{-webkit-box-ordinal-group:9;-ms-flex-order:8;order:8}.order-last-m{-webkit-box-ordinal-group:100000;-ms-flex-order:99999;order:99999}.fl-m{float:left}.fl-m,.fr-m{display:inline}.fr-m{float:right}.fn-m{float:none}.i-m{font-style:italic}.fs-normal-m{font-style:normal}.normal-m{font-weight:400}.b-m{font-weight:700}.fw1-m{font-weight:100}.fw2-m{font-weight:200}.fw3-m{font-weight:300}.fw4-m{font-weight:400}.fw5-m{font-weight:500}.fw6-m{font-weight:600}.fw7-m{font-weight:700}.fw8-m{font-weight:800}.fw9-m{font-weight:900}.h1-m{height:1rem}.h2-m{height:2rem}.h3-m{height:4rem}.h4-m{height:8rem}.h5-m{height:16rem}.h-25-m{height:25%}.h-50-m{height:50%}.h-75-m{height:75%}.h-100-m{height:100%}.min-h-100-m{min-height:100%}.vh-25-m{height:25vh}.vh-50-m{height:50vh}.vh-75-m{height:75vh}.vh-100-m{height:100vh}.min-vh-100-m{min-height:100vh}.h-auto-m{height:auto}.h-inherit-m{height:inherit}.tracked-m{letter-spacing:.1em}.tracked-tight-m{letter-spacing:-.05em}.tracked-mega-m{letter-spacing:.25em}.lh-solid-m{line-height:1}.lh-title-m{line-height:1.25}.lh-copy-m{line-height:1.5}.mw-100-m{max-width:100%}.mw1-m{max-width:1rem}.mw2-m{max-width:2rem}.mw3-m{max-width:4rem}.mw4-m{max-width:8rem}.mw5-m{max-width:16rem}.mw6-m{max-width:32rem}.mw7-m{max-width:48rem}.mw8-m{max-width:64rem}.mw9-m{max-width:96rem}.mw-none-m{max-width:none}.w1-m{width:1rem}.w2-m{width:2rem}.w3-m{width:4rem}.w4-m{width:8rem}.w5-m{width:16rem}.w-10-m{width:10%}.w-20-m{width:20%}.w-25-m{width:25%}.w-30-m{width:30%}.w-33-m{width:33%}.w-34-m{width:34%}.w-40-m{width:40%}.w-50-m{width:50%}.w-60-m{width:60%}.w-70-m{width:70%}.w-75-m{width:75%}.w-80-m{width:80%}.w-90-m{width:90%}.w-100-m{width:100%}.w-third-m{width:33.33333%}.w-two-thirds-m{width:66.66667%}.w-auto-m{width:auto}.overflow-visible-m{overflow:visible}.overflow-hidden-m{overflow:hidden}.overflow-scroll-m{overflow:scroll}.overflow-auto-m{overflow:auto}.overflow-x-visible-m{overflow-x:visible}.overflow-x-hidden-m{overflow-x:hidden}.overflow-x-scroll-m{overflow-x:scroll}.overflow-x-auto-m{overflow-x:auto}.overflow-y-visible-m{overflow-y:visible}.overflow-y-hidden-m{overflow-y:hidden}.overflow-y-scroll-m{overflow-y:scroll}.overflow-y-auto-m{overflow-y:auto}.static-m{position:static}.relative-m{position:relative}.absolute-m{position:absolute}.fixed-m{position:fixed}.rotate-45-m{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.rotate-90-m{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.rotate-135-m{-webkit-transform:rotate(135deg);transform:rotate(135deg)}.rotate-180-m{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.rotate-225-m{-webkit-transform:rotate(225deg);transform:rotate(225deg)}.rotate-270-m{-webkit-transform:rotate(270deg);transform:rotate(270deg)}.rotate-315-m{-webkit-transform:rotate(315deg);transform:rotate(315deg)}.pa0-m{padding:0}.pa1-m{padding:.25rem}.pa2-m{padding:.5rem}.pa3-m{padding:1rem}.pa4-m{padding:2rem}.pa5-m{padding:4rem}.pa6-m{padding:8rem}.pa7-m{padding:16rem}.pl0-m{padding-left:0}.pl1-m{padding-left:.25rem}.pl2-m{padding-left:.5rem}.pl3-m{padding-left:1rem}.pl4-m{padding-left:2rem}.pl5-m{padding-left:4rem}.pl6-m{padding-left:8rem}.pl7-m{padding-left:16rem}.pr0-m{padding-right:0}.pr1-m{padding-right:.25rem}.pr2-m{padding-right:.5rem}.pr3-m{padding-right:1rem}.pr4-m{padding-right:2rem}.pr5-m{padding-right:4rem}.pr6-m{padding-right:8rem}.pr7-m{padding-right:16rem}.pb0-m{padding-bottom:0}.pb1-m{padding-bottom:.25rem}.pb2-m{padding-bottom:.5rem}.pb3-m{padding-bottom:1rem}.pb4-m{padding-bottom:2rem}.pb5-m{padding-bottom:4rem}.pb6-m{padding-bottom:8rem}.pb7-m{padding-bottom:16rem}.pt0-m{padding-top:0}.pt1-m{padding-top:.25rem}.pt2-m{padding-top:.5rem}.pt3-m{padding-top:1rem}.pt4-m{padding-top:2rem}.pt5-m{padding-top:4rem}.pt6-m{padding-top:8rem}.pt7-m{padding-top:16rem}.pv0-m{padding-top:0;padding-bottom:0}.pv1-m{padding-top:.25rem;padding-bottom:.25rem}.pv2-m{padding-top:.5rem;padding-bottom:.5rem}.pv3-m{padding-top:1rem;padding-bottom:1rem}.pv4-m{padding-top:2rem;padding-bottom:2rem}.pv5-m{padding-top:4rem;padding-bottom:4rem}.pv6-m{padding-top:8rem;padding-bottom:8rem}.pv7-m{padding-top:16rem;padding-bottom:16rem}.ph0-m{padding-left:0;padding-right:0}.ph1-m{padding-left:.25rem;padding-right:.25rem}.ph2-m{padding-left:.5rem;padding-right:.5rem}.ph3-m{padding-left:1rem;padding-right:1rem}.ph4-m{padding-left:2rem;padding-right:2rem}.ph5-m{padding-left:4rem;padding-right:4rem}.ph6-m{padding-left:8rem;padding-right:8rem}.ph7-m{padding-left:16rem;padding-right:16rem}.ma0-m{margin:0}.ma1-m{margin:.25rem}.ma2-m{margin:.5rem}.ma3-m{margin:1rem}.ma4-m{margin:2rem}.ma5-m{margin:4rem}.ma6-m{margin:8rem}.ma7-m{margin:16rem}.ml0-m{margin-left:0}.ml1-m{margin-left:.25rem}.ml2-m{margin-left:.5rem}.ml3-m{margin-left:1rem}.ml4-m{margin-left:2rem}.ml5-m{margin-left:4rem}.ml6-m{margin-left:8rem}.ml7-m{margin-left:16rem}.mr0-m{margin-right:0}.mr1-m{margin-right:.25rem}.mr2-m{margin-right:.5rem}.mr3-m{margin-right:1rem}.mr4-m{margin-right:2rem}.mr5-m{margin-right:4rem}.mr6-m{margin-right:8rem}.mr7-m{margin-right:16rem}.mb0-m{margin-bottom:0}.mb1-m{margin-bottom:.25rem}.mb2-m{margin-bottom:.5rem}.mb3-m{margin-bottom:1rem}.mb4-m{margin-bottom:2rem}.mb5-m{margin-bottom:4rem}.mb6-m{margin-bottom:8rem}.mb7-m{margin-bottom:16rem}.mt0-m{margin-top:0}.mt1-m{margin-top:.25rem}.mt2-m{margin-top:.5rem}.mt3-m{margin-top:1rem}.mt4-m{margin-top:2rem}.mt5-m{margin-top:4rem}.mt6-m{margin-top:8rem}.mt7-m{margin-top:16rem}.mv0-m{margin-top:0;margin-bottom:0}.mv1-m{margin-top:.25rem;margin-bottom:.25rem}.mv2-m{margin-top:.5rem;margin-bottom:.5rem}.mv3-m{margin-top:1rem;margin-bottom:1rem}.mv4-m{margin-top:2rem;margin-bottom:2rem}.mv5-m{margin-top:4rem;margin-bottom:4rem}.mv6-m{margin-top:8rem;margin-bottom:8rem}.mv7-m{margin-top:16rem;margin-bottom:16rem}.mh0-m{margin-left:0;margin-right:0}.mh1-m{margin-left:.25rem;margin-right:.25rem}.mh2-m{margin-left:.5rem;margin-right:.5rem}.mh3-m{margin-left:1rem;margin-right:1rem}.mh4-m{margin-left:2rem;margin-right:2rem}.mh5-m{margin-left:4rem;margin-right:4rem}.mh6-m{margin-left:8rem;margin-right:8rem}.mh7-m{margin-left:16rem;margin-right:16rem}.na1-m{margin:-.25rem}.na2-m{margin:-.5rem}.na3-m{margin:-1rem}.na4-m{margin:-2rem}.na5-m{margin:-4rem}.na6-m{margin:-8rem}.na7-m{margin:-16rem}.nl1-m{margin-left:-.25rem}.nl2-m{margin-left:-.5rem}.nl3-m{margin-left:-1rem}.nl4-m{margin-left:-2rem}.nl5-m{margin-left:-4rem}.nl6-m{margin-left:-8rem}.nl7-m{margin-left:-16rem}.nr1-m{margin-right:-.25rem}.nr2-m{margin-right:-.5rem}.nr3-m{margin-right:-1rem}.nr4-m{margin-right:-2rem}.nr5-m{margin-right:-4rem}.nr6-m{margin-right:-8rem}.nr7-m{margin-right:-16rem}.nb1-m{margin-bottom:-.25rem}.nb2-m{margin-bottom:-.5rem}.nb3-m{margin-bottom:-1rem}.nb4-m{margin-bottom:-2rem}.nb5-m{margin-bottom:-4rem}.nb6-m{margin-bottom:-8rem}.nb7-m{margin-bottom:-16rem}.nt1-m{margin-top:-.25rem}.nt2-m{margin-top:-.5rem}.nt3-m{margin-top:-1rem}.nt4-m{margin-top:-2rem}.nt5-m{margin-top:-4rem}.nt6-m{margin-top:-8rem}.nt7-m{margin-top:-16rem}.strike-m{text-decoration:line-through}.underline-m{text-decoration:underline}.no-underline-m{text-decoration:none}.tl-m{text-align:left}.tr-m{text-align:right}.tc-m{text-align:center}.tj-m{text-align:justify}.ttc-m{text-transform:capitalize}.ttl-m{text-transform:lowercase}.ttu-m{text-transform:uppercase}.ttn-m{text-transform:none}.f-6-m,.f-headline-m{font-size:6rem}.f-5-m,.f-subheadline-m{font-size:5rem}.f1-m{font-size:3rem}.f2-m{font-size:2.25rem}.f3-m{font-size:1.5rem}.f4-m{font-size:1.25rem}.f5-m{font-size:1rem}.f6-m{font-size:.875rem}.f7-m{font-size:.75rem}.measure-m{max-width:30em}.measure-wide-m{max-width:34em}.measure-narrow-m{max-width:20em}.indent-m{text-indent:1em;margin-top:0;margin-bottom:0}.small-caps-m{font-variant:small-caps}.truncate-m{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.center-m{margin-left:auto}.center-m,.mr-auto-m{margin-right:auto}.ml-auto-m{margin-left:auto}.clip-m{position:fixed!important;position:absolute!important;clip:rect(1px 1px 1px 1px);clip:rect(1px,1px,1px,1px)}.ws-normal-m{white-space:normal}.nowrap-m{white-space:nowrap}.pre-m{white-space:pre}.v-base-m{vertical-align:baseline}.v-mid-m{vertical-align:middle}.v-top-m{vertical-align:top}.v-btm-m{vertical-align:bottom}}@media screen and (min-width:60em){.aspect-ratio-l{height:0;position:relative}.aspect-ratio--16x9-l{padding-bottom:56.25%}.aspect-ratio--9x16-l{padding-bottom:177.77%}.aspect-ratio--4x3-l{padding-bottom:75%}.aspect-ratio--3x4-l{padding-bottom:133.33%}.aspect-ratio--6x4-l{padding-bottom:66.6%}.aspect-ratio--4x6-l{padding-bottom:150%}.aspect-ratio--8x5-l{padding-bottom:62.5%}.aspect-ratio--5x8-l{padding-bottom:160%}.aspect-ratio--7x5-l{padding-bottom:71.42%}.aspect-ratio--5x7-l{padding-bottom:140%}.aspect-ratio--1x1-l{padding-bottom:100%}.aspect-ratio--object-l{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:100}.cover-l{background-size:cover!important}.contain-l{background-size:contain!important}.bg-center-l{background-position:50%}.bg-center-l,.bg-top-l{background-repeat:no-repeat}.bg-top-l{background-position:top}.bg-right-l{background-position:100%}.bg-bottom-l,.bg-right-l{background-repeat:no-repeat}.bg-bottom-l{background-position:bottom}.bg-left-l{background-repeat:no-repeat;background-position:0}.outline-l{outline:1px solid}.outline-transparent-l{outline:1px solid transparent}.outline-0-l{outline:0}.ba-l{border-style:solid;border-width:1px}.bt-l{border-top-style:solid;border-top-width:1px}.br-l{border-right-style:solid;border-right-width:1px}.bb-l{border-bottom-style:solid;border-bottom-width:1px}.bl-l{border-left-style:solid;border-left-width:1px}.bn-l{border-style:none;border-width:0}.br0-l{border-radius:0}.br1-l{border-radius:.125rem}.br2-l{border-radius:.25rem}.br3-l{border-radius:.5rem}.br4-l{border-radius:1rem}.br-100-l{border-radius:100%}.br-pill-l{border-radius:9999px}.br--bottom-l{border-top-left-radius:0;border-top-right-radius:0}.br--top-l{border-bottom-right-radius:0}.br--right-l,.br--top-l{border-bottom-left-radius:0}.br--right-l{border-top-left-radius:0}.br--left-l{border-top-right-radius:0;border-bottom-right-radius:0}.b--dotted-l{border-style:dotted}.b--dashed-l{border-style:dashed}.b--solid-l{border-style:solid}.b--none-l{border-style:none}.bw0-l{border-width:0}.bw1-l{border-width:.125rem}.bw2-l{border-width:.25rem}.bw3-l{border-width:.5rem}.bw4-l{border-width:1rem}.bw5-l{border-width:2rem}.bt-0-l{border-top-width:0}.br-0-l{border-right-width:0}.bb-0-l{border-bottom-width:0}.bl-0-l{border-left-width:0}.shadow-1-l{box-shadow:0 0 4px 2px rgba(0,0,0,.2)}.shadow-2-l{box-shadow:0 0 8px 2px rgba(0,0,0,.2)}.shadow-3-l{box-shadow:2px 2px 4px 2px rgba(0,0,0,.2)}.shadow-4-l{box-shadow:2px 2px 8px 0 rgba(0,0,0,.2)}.shadow-5-l{box-shadow:4px 4px 8px 0 rgba(0,0,0,.2)}.top-0-l{top:0}.left-0-l{left:0}.right-0-l{right:0}.bottom-0-l{bottom:0}.top-1-l{top:1rem}.left-1-l{left:1rem}.right-1-l{right:1rem}.bottom-1-l{bottom:1rem}.top-2-l{top:2rem}.left-2-l{left:2rem}.right-2-l{right:2rem}.bottom-2-l{bottom:2rem}.top--1-l{top:-1rem}.right--1-l{right:-1rem}.bottom--1-l{bottom:-1rem}.left--1-l{left:-1rem}.top--2-l{top:-2rem}.right--2-l{right:-2rem}.bottom--2-l{bottom:-2rem}.left--2-l{left:-2rem}.absolute--fill-l{top:0;right:0;bottom:0;left:0}.cl-l{clear:left}.cr-l{clear:right}.cb-l{clear:both}.cn-l{clear:none}.dn-l{display:none}.di-l{display:inline}.db-l{display:block}.dib-l{display:inline-block}.dit-l{display:inline-table}.dt-l{display:table}.dtc-l{display:table-cell}.dt-row-l{display:table-row}.dt-row-group-l{display:table-row-group}.dt-column-l{display:table-column}.dt-column-group-l{display:table-column-group}.dt--fixed-l{table-layout:fixed;width:100%}.flex-l{display:-webkit-box;display:-ms-flexbox;display:flex}.inline-flex-l{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.flex-auto-l{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;min-width:0;min-height:0}.flex-none-l{-webkit-box-flex:0;-ms-flex:none;flex:none}.flex-column-l{-webkit-box-orient:vertical;-ms-flex-direction:column;flex-direction:column}.flex-column-l,.flex-row-l{-webkit-box-direction:normal}.flex-row-l{-webkit-box-orient:horizontal;-ms-flex-direction:row;flex-direction:row}.flex-wrap-l{-ms-flex-wrap:wrap;flex-wrap:wrap}.flex-nowrap-l{-ms-flex-wrap:nowrap;flex-wrap:nowrap}.flex-wrap-reverse-l{-ms-flex-wrap:wrap-reverse;flex-wrap:wrap-reverse}.flex-column-reverse-l{-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.flex-row-reverse-l{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.items-start-l{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.items-end-l{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.items-center-l{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.items-baseline-l{-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline}.items-stretch-l{-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch}.self-start-l{-ms-flex-item-align:start;align-self:flex-start}.self-end-l{-ms-flex-item-align:end;align-self:flex-end}.self-center-l{-ms-flex-item-align:center;-ms-grid-row-align:center;align-self:center}.self-baseline-l{-ms-flex-item-align:baseline;align-self:baseline}.self-stretch-l{-ms-flex-item-align:stretch;-ms-grid-row-align:stretch;align-self:stretch}.justify-start-l{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.justify-end-l{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.justify-center-l{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.justify-between-l{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.justify-around-l{-ms-flex-pack:distribute;justify-content:space-around}.content-start-l{-ms-flex-line-pack:start;align-content:flex-start}.content-end-l{-ms-flex-line-pack:end;align-content:flex-end}.content-center-l{-ms-flex-line-pack:center;align-content:center}.content-between-l{-ms-flex-line-pack:justify;align-content:space-between}.content-around-l{-ms-flex-line-pack:distribute;align-content:space-around}.content-stretch-l{-ms-flex-line-pack:stretch;align-content:stretch}.order-0-l{-webkit-box-ordinal-group:1;-ms-flex-order:0;order:0}.order-1-l{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.order-2-l{-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}.order-3-l{-webkit-box-ordinal-group:4;-ms-flex-order:3;order:3}.order-4-l{-webkit-box-ordinal-group:5;-ms-flex-order:4;order:4}.order-5-l{-webkit-box-ordinal-group:6;-ms-flex-order:5;order:5}.order-6-l{-webkit-box-ordinal-group:7;-ms-flex-order:6;order:6}.order-7-l{-webkit-box-ordinal-group:8;-ms-flex-order:7;order:7}.order-8-l{-webkit-box-ordinal-group:9;-ms-flex-order:8;order:8}.order-last-l{-webkit-box-ordinal-group:100000;-ms-flex-order:99999;order:99999}.fl-l{float:left}.fl-l,.fr-l{display:inline}.fr-l{float:right}.fn-l{float:none}.i-l{font-style:italic}.fs-normal-l{font-style:normal}.normal-l{font-weight:400}.b-l{font-weight:700}.fw1-l{font-weight:100}.fw2-l{font-weight:200}.fw3-l{font-weight:300}.fw4-l{font-weight:400}.fw5-l{font-weight:500}.fw6-l{font-weight:600}.fw7-l{font-weight:700}.fw8-l{font-weight:800}.fw9-l{font-weight:900}.h1-l{height:1rem}.h2-l{height:2rem}.h3-l{height:4rem}.h4-l{height:8rem}.h5-l{height:16rem}.h-25-l{height:25%}.h-50-l{height:50%}.h-75-l{height:75%}.h-100-l{height:100%}.min-h-100-l{min-height:100%}.vh-25-l{height:25vh}.vh-50-l{height:50vh}.vh-75-l{height:75vh}.vh-100-l{height:100vh}.min-vh-100-l{min-height:100vh}.h-auto-l{height:auto}.h-inherit-l{height:inherit}.tracked-l{letter-spacing:.1em}.tracked-tight-l{letter-spacing:-.05em}.tracked-mega-l{letter-spacing:.25em}.lh-solid-l{line-height:1}.lh-title-l{line-height:1.25}.lh-copy-l{line-height:1.5}.mw-100-l{max-width:100%}.mw1-l{max-width:1rem}.mw2-l{max-width:2rem}.mw3-l{max-width:4rem}.mw4-l{max-width:8rem}.mw5-l{max-width:16rem}.mw6-l{max-width:32rem}.mw7-l{max-width:48rem}.mw8-l{max-width:64rem}.mw9-l{max-width:96rem}.mw-none-l{max-width:none}.w1-l{width:1rem}.w2-l{width:2rem}.w3-l{width:4rem}.w4-l{width:8rem}.w5-l{width:16rem}.w-10-l{width:10%}.w-20-l{width:20%}.w-25-l{width:25%}.w-30-l{width:30%}.w-33-l{width:33%}.w-34-l{width:34%}.w-40-l{width:40%}.w-50-l{width:50%}.w-60-l{width:60%}.w-70-l{width:70%}.w-75-l{width:75%}.w-80-l{width:80%}.w-90-l{width:90%}.w-100-l{width:100%}.w-third-l{width:33.33333%}.w-two-thirds-l{width:66.66667%}.w-auto-l{width:auto}.overflow-visible-l{overflow:visible}.overflow-hidden-l{overflow:hidden}.overflow-scroll-l{overflow:scroll}.overflow-auto-l{overflow:auto}.overflow-x-visible-l{overflow-x:visible}.overflow-x-hidden-l{overflow-x:hidden}.overflow-x-scroll-l{overflow-x:scroll}.overflow-x-auto-l{overflow-x:auto}.overflow-y-visible-l{overflow-y:visible}.overflow-y-hidden-l{overflow-y:hidden}.overflow-y-scroll-l{overflow-y:scroll}.overflow-y-auto-l{overflow-y:auto}.static-l{position:static}.relative-l{position:relative}.absolute-l{position:absolute}.fixed-l{position:fixed}.rotate-45-l{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.rotate-90-l{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.rotate-135-l{-webkit-transform:rotate(135deg);transform:rotate(135deg)}.rotate-180-l{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.rotate-225-l{-webkit-transform:rotate(225deg);transform:rotate(225deg)}.rotate-270-l{-webkit-transform:rotate(270deg);transform:rotate(270deg)}.rotate-315-l{-webkit-transform:rotate(315deg);transform:rotate(315deg)}.pa0-l{padding:0}.pa1-l{padding:.25rem}.pa2-l{padding:.5rem}.pa3-l{padding:1rem}.pa4-l{padding:2rem}.pa5-l{padding:4rem}.pa6-l{padding:8rem}.pa7-l{padding:16rem}.pl0-l{padding-left:0}.pl1-l{padding-left:.25rem}.pl2-l{padding-left:.5rem}.pl3-l{padding-left:1rem}.pl4-l{padding-left:2rem}.pl5-l{padding-left:4rem}.pl6-l{padding-left:8rem}.pl7-l{padding-left:16rem}.pr0-l{padding-right:0}.pr1-l{padding-right:.25rem}.pr2-l{padding-right:.5rem}.pr3-l{padding-right:1rem}.pr4-l{padding-right:2rem}.pr5-l{padding-right:4rem}.pr6-l{padding-right:8rem}.pr7-l{padding-right:16rem}.pb0-l{padding-bottom:0}.pb1-l{padding-bottom:.25rem}.pb2-l{padding-bottom:.5rem}.pb3-l{padding-bottom:1rem}.pb4-l{padding-bottom:2rem}.pb5-l{padding-bottom:4rem}.pb6-l{padding-bottom:8rem}.pb7-l{padding-bottom:16rem}.pt0-l{padding-top:0}.pt1-l{padding-top:.25rem}.pt2-l{padding-top:.5rem}.pt3-l{padding-top:1rem}.pt4-l{padding-top:2rem}.pt5-l{padding-top:4rem}.pt6-l{padding-top:8rem}.pt7-l{padding-top:16rem}.pv0-l{padding-top:0;padding-bottom:0}.pv1-l{padding-top:.25rem;padding-bottom:.25rem}.pv2-l{padding-top:.5rem;padding-bottom:.5rem}.pv3-l{padding-top:1rem;padding-bottom:1rem}.pv4-l{padding-top:2rem;padding-bottom:2rem}.pv5-l{padding-top:4rem;padding-bottom:4rem}.pv6-l{padding-top:8rem;padding-bottom:8rem}.pv7-l{padding-top:16rem;padding-bottom:16rem}.ph0-l{padding-left:0;padding-right:0}.ph1-l{padding-left:.25rem;padding-right:.25rem}.ph2-l{padding-left:.5rem;padding-right:.5rem}.ph3-l{padding-left:1rem;padding-right:1rem}.ph4-l{padding-left:2rem;padding-right:2rem}.ph5-l{padding-left:4rem;padding-right:4rem}.ph6-l{padding-left:8rem;padding-right:8rem}.ph7-l{padding-left:16rem;padding-right:16rem}.ma0-l{margin:0}.ma1-l{margin:.25rem}.ma2-l{margin:.5rem}.ma3-l{margin:1rem}.ma4-l{margin:2rem}.ma5-l{margin:4rem}.ma6-l{margin:8rem}.ma7-l{margin:16rem}.ml0-l{margin-left:0}.ml1-l{margin-left:.25rem}.ml2-l{margin-left:.5rem}.ml3-l{margin-left:1rem}.ml4-l{margin-left:2rem}.ml5-l{margin-left:4rem}.ml6-l{margin-left:8rem}.ml7-l{margin-left:16rem}.mr0-l{margin-right:0}.mr1-l{margin-right:.25rem}.mr2-l{margin-right:.5rem}.mr3-l{margin-right:1rem}.mr4-l{margin-right:2rem}.mr5-l{margin-right:4rem}.mr6-l{margin-right:8rem}.mr7-l{margin-right:16rem}.mb0-l{margin-bottom:0}.mb1-l{margin-bottom:.25rem}.mb2-l{margin-bottom:.5rem}.mb3-l{margin-bottom:1rem}.mb4-l{margin-bottom:2rem}.mb5-l{margin-bottom:4rem}.mb6-l{margin-bottom:8rem}.mb7-l{margin-bottom:16rem}.mt0-l{margin-top:0}.mt1-l{margin-top:.25rem}.mt2-l{margin-top:.5rem}.mt3-l{margin-top:1rem}.mt4-l{margin-top:2rem}.mt5-l{margin-top:4rem}.mt6-l{margin-top:8rem}.mt7-l{margin-top:16rem}.mv0-l{margin-top:0;margin-bottom:0}.mv1-l{margin-top:.25rem;margin-bottom:.25rem}.mv2-l{margin-top:.5rem;margin-bottom:.5rem}.mv3-l{margin-top:1rem;margin-bottom:1rem}.mv4-l{margin-top:2rem;margin-bottom:2rem}.mv5-l{margin-top:4rem;margin-bottom:4rem}.mv6-l{margin-top:8rem;margin-bottom:8rem}.mv7-l{margin-top:16rem;margin-bottom:16rem}.mh0-l{margin-left:0;margin-right:0}.mh1-l{margin-left:.25rem;margin-right:.25rem}.mh2-l{margin-left:.5rem;margin-right:.5rem}.mh3-l{margin-left:1rem;margin-right:1rem}.mh4-l{margin-left:2rem;margin-right:2rem}.mh5-l{margin-left:4rem;margin-right:4rem}.mh6-l{margin-left:8rem;margin-right:8rem}.mh7-l{margin-left:16rem;margin-right:16rem}.na1-l{margin:-.25rem}.na2-l{margin:-.5rem}.na3-l{margin:-1rem}.na4-l{margin:-2rem}.na5-l{margin:-4rem}.na6-l{margin:-8rem}.na7-l{margin:-16rem}.nl1-l{margin-left:-.25rem}.nl2-l{margin-left:-.5rem}.nl3-l{margin-left:-1rem}.nl4-l{margin-left:-2rem}.nl5-l{margin-left:-4rem}.nl6-l{margin-left:-8rem}.nl7-l{margin-left:-16rem}.nr1-l{margin-right:-.25rem}.nr2-l{margin-right:-.5rem}.nr3-l{margin-right:-1rem}.nr4-l{margin-right:-2rem}.nr5-l{margin-right:-4rem}.nr6-l{margin-right:-8rem}.nr7-l{margin-right:-16rem}.nb1-l{margin-bottom:-.25rem}.nb2-l{margin-bottom:-.5rem}.nb3-l{margin-bottom:-1rem}.nb4-l{margin-bottom:-2rem}.nb5-l{margin-bottom:-4rem}.nb6-l{margin-bottom:-8rem}.nb7-l{margin-bottom:-16rem}.nt1-l{margin-top:-.25rem}.nt2-l{margin-top:-.5rem}.nt3-l{margin-top:-1rem}.nt4-l{margin-top:-2rem}.nt5-l{margin-top:-4rem}.nt6-l{margin-top:-8rem}.nt7-l{margin-top:-16rem}.strike-l{text-decoration:line-through}.underline-l{text-decoration:underline}.no-underline-l{text-decoration:none}.tl-l{text-align:left}.tr-l{text-align:right}.tc-l{text-align:center}.tj-l{text-align:justify}.ttc-l{text-transform:capitalize}.ttl-l{text-transform:lowercase}.ttu-l{text-transform:uppercase}.ttn-l{text-transform:none}.f-6-l,.f-headline-l{font-size:6rem}.f-5-l,.f-subheadline-l{font-size:5rem}.f1-l{font-size:3rem}.f2-l{font-size:2.25rem}.f3-l{font-size:1.5rem}.f4-l{font-size:1.25rem}.f5-l{font-size:1rem}.f6-l{font-size:.875rem}.f7-l{font-size:.75rem}.measure-l{max-width:30em}.measure-wide-l{max-width:34em}.measure-narrow-l{max-width:20em}.indent-l{text-indent:1em;margin-top:0;margin-bottom:0}.small-caps-l{font-variant:small-caps}.truncate-l{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.center-l{margin-left:auto}.center-l,.mr-auto-l{margin-right:auto}.ml-auto-l{margin-left:auto}.clip-l{position:fixed!important;position:absolute!important;clip:rect(1px 1px 1px 1px);clip:rect(1px,1px,1px,1px)}.ws-normal-l{white-space:normal}.nowrap-l{white-space:nowrap}.pre-l{white-space:pre}.v-base-l{vertical-align:baseline}.v-mid-l{vertical-align:middle}.v-top-l{vertical-align:top}.v-btm-l{vertical-align:bottom}} +/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}figcaption,figure,main{display:block}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent;-webkit-text-decoration-skip:objects}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit;font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}dfn{font-style:italic}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{font-family:sans-serif;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item}canvas{display:inline-block}[hidden],template{display:none}.border-box,a,article,body,code,dd,div,dl,dt,fieldset,footer,form,h1,h2,h3,h4,h5,h6,header,html,input[type=email],input[type=number],input[type=password],input[type=tel],input[type=text],input[type=url],legend,li,main,ol,p,pre,section,table,td,textarea,th,tr,ul{box-sizing:border-box}.aspect-ratio{height:0;position:relative}.aspect-ratio--16x9{padding-bottom:56.25%}.aspect-ratio--9x16{padding-bottom:177.77%}.aspect-ratio--4x3{padding-bottom:75%}.aspect-ratio--3x4{padding-bottom:133.33%}.aspect-ratio--6x4{padding-bottom:66.6%}.aspect-ratio--4x6{padding-bottom:150%}.aspect-ratio--8x5{padding-bottom:62.5%}.aspect-ratio--5x8{padding-bottom:160%}.aspect-ratio--7x5{padding-bottom:71.42%}.aspect-ratio--5x7{padding-bottom:140%}.aspect-ratio--1x1{padding-bottom:100%}.aspect-ratio--object{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:100}img{max-width:100%}.cover{background-size:cover!important}.contain{background-size:contain!important}.bg-center{background-position:50%}.bg-center,.bg-top{background-repeat:no-repeat}.bg-top{background-position:top}.bg-right{background-position:100%}.bg-bottom,.bg-right{background-repeat:no-repeat}.bg-bottom{background-position:bottom}.bg-left{background-repeat:no-repeat;background-position:0}.outline{outline:1px solid}.outline-transparent{outline:1px solid transparent}.outline-0{outline:0}.ba{border-style:solid;border-width:1px}.bt{border-top-style:solid;border-top-width:1px}.br{border-right-style:solid;border-right-width:1px}.bb{border-bottom-style:solid;border-bottom-width:1px}.bl{border-left-style:solid;border-left-width:1px}.bn{border-style:none;border-width:0}.b--black{border-color:#000}.b--near-black{border-color:#111}.b--dark-gray{border-color:#4d4d4f}.b--mid-gray{border-color:#555}.b--gray{border-color:#777}.b--silver{border-color:#999}.b--light-silver{border-color:#aaa}.b--moon-gray{border-color:#ccc}.b--light-gray{border-color:#eee}.b--near-white{border-color:#f4f4f4}.b--white{border-color:#fff}.b--white-90{border-color:hsla(0,0%,100%,.9)}.b--white-80{border-color:hsla(0,0%,100%,.8)}.b--white-70{border-color:hsla(0,0%,100%,.7)}.b--white-60{border-color:hsla(0,0%,100%,.6)}.b--white-50{border-color:hsla(0,0%,100%,.5)}.b--white-40{border-color:hsla(0,0%,100%,.4)}.b--white-30{border-color:hsla(0,0%,100%,.3)}.b--white-20{border-color:hsla(0,0%,100%,.2)}.b--white-10{border-color:hsla(0,0%,100%,.1)}.b--white-05{border-color:hsla(0,0%,100%,.05)}.b--white-025{border-color:hsla(0,0%,100%,.025)}.b--white-0125{border-color:hsla(0,0%,100%,.0125)}.b--black-90{border-color:rgba(0,0,0,.9)}.b--black-80{border-color:rgba(0,0,0,.8)}.b--black-70{border-color:rgba(0,0,0,.7)}.b--black-60{border-color:rgba(0,0,0,.6)}.b--black-50{border-color:rgba(0,0,0,.5)}.b--black-40{border-color:rgba(0,0,0,.4)}.b--black-30{border-color:rgba(0,0,0,.3)}.b--black-20{border-color:rgba(0,0,0,.2)}.b--black-10{border-color:rgba(0,0,0,.1)}.b--black-05{border-color:rgba(0,0,0,.05)}.b--black-025{border-color:rgba(0,0,0,.025)}.b--black-0125{border-color:rgba(0,0,0,.0125)}.b--dark-red{border-color:#e7040f}.b--red{border-color:#ff4136}.b--light-red{border-color:#ff725c}.b--orange{border-color:#f48120}.b--gold{border-color:#faad3f}.b--yellow{border-color:gold}.b--light-yellow{border-color:#fbf1a9}.b--purple{border-color:#5e2ca5}.b--light-purple{border-color:#a463f2}.b--dark-pink{border-color:#d5008f}.b--hot-pink{border-color:#ff41b4}.b--pink{border-color:#ff80cc}.b--light-pink{border-color:#ffa3d7}.b--dark-green{border-color:#137752}.b--green{border-color:#19a974}.b--light-green{border-color:#9eebcf}.b--navy{border-color:#001b44}.b--dark-blue{border-color:#00449e}.b--blue{border-color:#408bc9}.b--light-blue{border-color:#76c4e2}.b--lightest-blue{border-color:#cdecff}.b--washed-blue{border-color:#f6fffe}.b--washed-green{border-color:#e8fdf5}.b--washed-yellow{border-color:#fffceb}.b--washed-red{border-color:#ffdfdf}.b--transparent{border-color:transparent}.b--inherit{border-color:inherit}.br0{border-radius:0}.br1{border-radius:.125rem}.br2{border-radius:.25rem}.br3{border-radius:.5rem}.br4{border-radius:1rem}.br-100{border-radius:100%}.br-pill{border-radius:9999px}.br--bottom{border-top-left-radius:0;border-top-right-radius:0}.br--top{border-bottom-right-radius:0}.br--right,.br--top{border-bottom-left-radius:0}.br--right{border-top-left-radius:0}.br--left{border-top-right-radius:0;border-bottom-right-radius:0}.b--dotted{border-style:dotted}.b--dashed{border-style:dashed}.b--solid{border-style:solid}.b--none{border-style:none}.bw0{border-width:0}.bw1{border-width:.125rem}.bw2{border-width:.25rem}.bw3{border-width:.5rem}.bw4{border-width:1rem}.bw5{border-width:2rem}.bt-0{border-top-width:0}.br-0{border-right-width:0}.bb-0{border-bottom-width:0}.bl-0{border-left-width:0}.shadow-1{box-shadow:0 0 4px 2px rgba(0,0,0,.2)}.shadow-2{box-shadow:0 0 8px 2px rgba(0,0,0,.2)}.shadow-3{box-shadow:2px 2px 4px 2px rgba(0,0,0,.2)}.shadow-4{box-shadow:2px 2px 8px 0 rgba(0,0,0,.2)}.shadow-5{box-shadow:4px 4px 8px 0 rgba(0,0,0,.2)}.pre{overflow-x:auto;overflow-y:hidden;overflow:scroll}.top-0{top:0}.right-0{right:0}.bottom-0{bottom:0}.left-0{left:0}.top-1{top:1rem}.right-1{right:1rem}.bottom-1{bottom:1rem}.left-1{left:1rem}.top-2{top:2rem}.right-2{right:2rem}.bottom-2{bottom:2rem}.left-2{left:2rem}.top--1{top:-1rem}.right--1{right:-1rem}.bottom--1{bottom:-1rem}.left--1{left:-1rem}.top--2{top:-2rem}.right--2{right:-2rem}.bottom--2{bottom:-2rem}.left--2{left:-2rem}.absolute--fill{top:0;right:0;bottom:0;left:0}.cf:after,.cf:before{content:" ";display:table}.cf:after{clear:both}.cf{*zoom:1}.cl{clear:left}.cr{clear:right}.cb{clear:both}.cn{clear:none}.dn{display:none}.di{display:inline}.db{display:block}.dib{display:inline-block}.dit{display:inline-table}.dt{display:table}.dtc{display:table-cell}.dt-row{display:table-row}.dt-row-group{display:table-row-group}.dt-column{display:table-column}.dt-column-group{display:table-column-group}.dt--fixed{table-layout:fixed;width:100%}.flex{display:-webkit-box;display:-ms-flexbox;display:flex}.inline-flex{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.flex-auto{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;min-width:0;min-height:0}.flex-none{-webkit-box-flex:0;-ms-flex:none;flex:none}.flex-column{-webkit-box-orient:vertical;-ms-flex-direction:column;flex-direction:column}.flex-column,.flex-row{-webkit-box-direction:normal}.flex-row{-webkit-box-orient:horizontal;-ms-flex-direction:row;flex-direction:row}.flex-wrap{-ms-flex-wrap:wrap;flex-wrap:wrap}.flex-nowrap{-ms-flex-wrap:nowrap;flex-wrap:nowrap}.flex-wrap-reverse{-ms-flex-wrap:wrap-reverse;flex-wrap:wrap-reverse}.flex-column-reverse{-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.flex-row-reverse{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.items-start{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.items-end{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.items-center{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.items-baseline{-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline}.items-stretch{-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch}.self-start{-ms-flex-item-align:start;align-self:flex-start}.self-end{-ms-flex-item-align:end;align-self:flex-end}.self-center{-ms-flex-item-align:center;-ms-grid-row-align:center;align-self:center}.self-baseline{-ms-flex-item-align:baseline;align-self:baseline}.self-stretch{-ms-flex-item-align:stretch;-ms-grid-row-align:stretch;align-self:stretch}.justify-start{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.justify-end{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.justify-center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.justify-between{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.justify-around{-ms-flex-pack:distribute;justify-content:space-around}.content-start{-ms-flex-line-pack:start;align-content:flex-start}.content-end{-ms-flex-line-pack:end;align-content:flex-end}.content-center{-ms-flex-line-pack:center;align-content:center}.content-between{-ms-flex-line-pack:justify;align-content:space-between}.content-around{-ms-flex-line-pack:distribute;align-content:space-around}.content-stretch{-ms-flex-line-pack:stretch;align-content:stretch}.order-0{-webkit-box-ordinal-group:1;-ms-flex-order:0;order:0}.order-1{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.order-2{-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}.order-3{-webkit-box-ordinal-group:4;-ms-flex-order:3;order:3}.order-4{-webkit-box-ordinal-group:5;-ms-flex-order:4;order:4}.order-5{-webkit-box-ordinal-group:6;-ms-flex-order:5;order:5}.order-6{-webkit-box-ordinal-group:7;-ms-flex-order:6;order:6}.order-7{-webkit-box-ordinal-group:8;-ms-flex-order:7;order:7}.order-8{-webkit-box-ordinal-group:9;-ms-flex-order:8;order:8}.order-last{-webkit-box-ordinal-group:100000;-ms-flex-order:99999;order:99999}.fl{float:left}.fl,.fr{_display:inline}.fr{float:right}.fn{float:none}.sans-serif{font-family:-apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif}.serif{font-family:georgia,times,serif}.system-sans-serif{font-family:sans-serif}.system-serif{font-family:serif}.code,code{font-family:Consolas,monaco,monospace}.courier{font-family:Courier Next,courier,monospace}.helvetica{font-family:helvetica neue,helvetica,sans-serif}.avenir{font-family:avenir next,avenir,sans-serif}.athelas{font-family:athelas,georgia,serif}.georgia{font-family:georgia,serif}.times{font-family:times,serif}.bodoni{font-family:Bodoni MT,serif}.calisto{font-family:Calisto MT,serif}.garamond{font-family:garamond,serif}.baskerville{font-family:baskerville,serif}.i{font-style:italic}.fs-normal{font-style:normal}.normal{font-weight:400}.b{font-weight:700}.fw1{font-weight:100}.fw2{font-weight:200}.fw3{font-weight:300}.fw4{font-weight:400}.fw5{font-weight:500}.fw6{font-weight:600}.fw7{font-weight:700}.fw8{font-weight:800}.fw9{font-weight:900}.input-reset{-webkit-appearance:none;-moz-appearance:none}.button-reset::-moz-focus-inner,.input-reset::-moz-focus-inner{border:0;padding:0}.h1{height:1rem}.h2{height:2rem}.h3{height:4rem}.h4{height:8rem}.h5{height:16rem}.h-25{height:25%}.h-50{height:50%}.h-75{height:75%}.h-100{height:100%}.min-h-100{min-height:100%}.vh-25{height:25vh}.vh-50{height:50vh}.vh-75{height:75vh}.vh-100{height:100vh}.min-vh-100{min-height:100vh}.h-auto{height:auto}.h-inherit{height:inherit}.tracked{letter-spacing:.1em}.tracked-tight{letter-spacing:-.05em}.tracked-mega{letter-spacing:.25em}.lh-solid{line-height:1}.lh-title{line-height:1.25}.lh-copy{line-height:1.5}.link{text-decoration:none}.link,.link:active,.link:focus,.link:hover,.link:link,.link:visited{-webkit-transition:color .15s ease-in;transition:color .15s ease-in}.link:focus{outline:1px dotted currentColor}.list{list-style-type:none}.mw-100{max-width:100%}.mw1{max-width:1rem}.mw2{max-width:2rem}.mw3{max-width:4rem}.mw4{max-width:8rem}.mw5{max-width:16rem}.mw6{max-width:32rem}.mw7{max-width:48rem}.mw8{max-width:64rem}.mw9{max-width:96rem}.mw-none{max-width:none}.w1{width:1rem}.w2{width:2rem}.w3{width:4rem}.w4{width:8rem}.w5{width:16rem}.w-10{width:10%}.w-20{width:20%}.w-25{width:25%}.w-30{width:30%}.w-33{width:33%}.w-34{width:34%}.w-40{width:40%}.w-50{width:50%}.w-60{width:60%}.w-70{width:70%}.w-75{width:75%}.w-80{width:80%}.w-90{width:90%}.w-100{width:100%}.w-third{width:33.33333%}.w-two-thirds{width:66.66667%}.w-auto{width:auto}.overflow-visible{overflow:visible}.overflow-hidden{overflow:hidden}.overflow-scroll{overflow:scroll}.overflow-auto{overflow:auto}.overflow-x-visible{overflow-x:visible}.overflow-x-hidden{overflow-x:hidden}.overflow-x-scroll{overflow-x:scroll}.overflow-x-auto{overflow-x:auto}.overflow-y-visible{overflow-y:visible}.overflow-y-hidden{overflow-y:hidden}.overflow-y-scroll{overflow-y:scroll}.overflow-y-auto{overflow-y:auto}.static{position:static}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.o-100{opacity:1}.o-90{opacity:.9}.o-80{opacity:.8}.o-70{opacity:.7}.o-60{opacity:.6}.o-50{opacity:.5}.o-40{opacity:.4}.o-30{opacity:.3}.o-20{opacity:.2}.o-10{opacity:.1}.o-05{opacity:.05}.o-025{opacity:.025}.o-0{opacity:0}.rotate-45{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.rotate-90{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.rotate-135{-webkit-transform:rotate(135deg);transform:rotate(135deg)}.rotate-180{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.rotate-225{-webkit-transform:rotate(225deg);transform:rotate(225deg)}.rotate-270{-webkit-transform:rotate(270deg);transform:rotate(270deg)}.rotate-315{-webkit-transform:rotate(315deg);transform:rotate(315deg)}.black-90{color:rgba(0,0,0,.9)}.black-80{color:rgba(0,0,0,.8)}.black-70{color:rgba(0,0,0,.7)}.black-60{color:rgba(0,0,0,.6)}.black-50{color:rgba(0,0,0,.5)}.black-40{color:rgba(0,0,0,.4)}.black-30{color:rgba(0,0,0,.3)}.black-20{color:rgba(0,0,0,.2)}.black-10{color:rgba(0,0,0,.1)}.black-05{color:rgba(0,0,0,.05)}.white-90{color:hsla(0,0%,100%,.9)}.white-80{color:hsla(0,0%,100%,.8)}.white-70{color:hsla(0,0%,100%,.7)}.white-60{color:hsla(0,0%,100%,.6)}.white-50{color:hsla(0,0%,100%,.5)}.white-40{color:hsla(0,0%,100%,.4)}.white-30{color:hsla(0,0%,100%,.3)}.white-20{color:hsla(0,0%,100%,.2)}.white-10{color:hsla(0,0%,100%,.1)}.black{color:#000}.near-black{color:#111}.dark-gray{color:#4d4d4f}.mid-gray{color:#555}.gray{color:#777}.silver{color:#999}.light-silver{color:#aaa}.moon-gray{color:#ccc}.light-gray{color:#eee}.near-white{color:#f4f4f4}.white{color:#fff}.dark-red{color:#e7040f}.red{color:#ff4136}.light-red{color:#ff725c}.orange{color:#f48120}.gold{color:#faad3f}.yellow{color:gold}.light-yellow{color:#fbf1a9}.purple{color:#5e2ca5}.light-purple{color:#a463f2}.dark-pink{color:#d5008f}.hot-pink{color:#ff41b4}.pink{color:#ff80cc}.light-pink{color:#ffa3d7}.dark-green{color:#137752}.green{color:#19a974}.light-green{color:#9eebcf}.navy{color:#001b44}.dark-blue{color:#00449e}.blue{color:#408bc9}.light-blue{color:#76c4e2}.lightest-blue{color:#cdecff}.washed-blue{color:#f6fffe}.washed-green{color:#e8fdf5}.washed-yellow{color:#fffceb}.washed-red{color:#ffdfdf}.color-inherit{color:inherit}.bg-black-90{background-color:rgba(0,0,0,.9)}.bg-black-80{background-color:rgba(0,0,0,.8)}.bg-black-70{background-color:rgba(0,0,0,.7)}.bg-black-60{background-color:rgba(0,0,0,.6)}.bg-black-50{background-color:rgba(0,0,0,.5)}.bg-black-40{background-color:rgba(0,0,0,.4)}.bg-black-30{background-color:rgba(0,0,0,.3)}.bg-black-20{background-color:rgba(0,0,0,.2)}.bg-black-10{background-color:rgba(0,0,0,.1)}.bg-black-05{background-color:rgba(0,0,0,.05)}.bg-white-90{background-color:hsla(0,0%,100%,.9)}.bg-white-80{background-color:hsla(0,0%,100%,.8)}.bg-white-70{background-color:hsla(0,0%,100%,.7)}.bg-white-60{background-color:hsla(0,0%,100%,.6)}.bg-white-50{background-color:hsla(0,0%,100%,.5)}.bg-white-40{background-color:hsla(0,0%,100%,.4)}.bg-white-30{background-color:hsla(0,0%,100%,.3)}.bg-white-20{background-color:hsla(0,0%,100%,.2)}.bg-white-10{background-color:hsla(0,0%,100%,.1)}.bg-black{background-color:#000}.bg-near-black{background-color:#111}.bg-dark-gray{background-color:#4d4d4f}.bg-mid-gray{background-color:#555}.bg-gray{background-color:#777}.bg-silver{background-color:#999}.bg-light-silver{background-color:#aaa}.bg-moon-gray{background-color:#ccc}.bg-light-gray{background-color:#eee}.bg-near-white{background-color:#f4f4f4}.bg-white{background-color:#fff}.bg-transparent{background-color:transparent}.bg-dark-red{background-color:#e7040f}.bg-red{background-color:#ff4136}.bg-light-red{background-color:#ff725c}.bg-orange{background-color:#f48120}.bg-gold{background-color:#faad3f}.bg-yellow{background-color:gold}.bg-light-yellow{background-color:#fbf1a9}.bg-purple{background-color:#5e2ca5}.bg-light-purple{background-color:#a463f2}.bg-dark-pink{background-color:#d5008f}.bg-hot-pink{background-color:#ff41b4}.bg-pink{background-color:#ff80cc}.bg-light-pink{background-color:#ffa3d7}.bg-dark-green{background-color:#137752}.bg-green{background-color:#19a974}.bg-light-green{background-color:#9eebcf}.bg-navy{background-color:#001b44}.bg-dark-blue{background-color:#00449e}.bg-blue{background-color:#408bc9}.bg-light-blue{background-color:#76c4e2}.bg-lightest-blue{background-color:#cdecff}.bg-washed-blue{background-color:#f6fffe}.bg-washed-green{background-color:#e8fdf5}.bg-washed-yellow{background-color:#fffceb}.bg-washed-red{background-color:#ffdfdf}.bg-inherit{background-color:inherit}.hover-black:focus,.hover-black:hover{color:#000}.hover-near-black:focus,.hover-near-black:hover{color:#111}.hover-dark-gray:focus,.hover-dark-gray:hover{color:#4d4d4f}.hover-mid-gray:focus,.hover-mid-gray:hover{color:#555}.hover-gray:focus,.hover-gray:hover{color:#777}.hover-silver:focus,.hover-silver:hover{color:#999}.hover-light-silver:focus,.hover-light-silver:hover{color:#aaa}.hover-moon-gray:focus,.hover-moon-gray:hover{color:#ccc}.hover-light-gray:focus,.hover-light-gray:hover{color:#eee}.hover-near-white:focus,.hover-near-white:hover{color:#f4f4f4}.hover-white:focus,.hover-white:hover{color:#fff}.hover-black-90:focus,.hover-black-90:hover{color:rgba(0,0,0,.9)}.hover-black-80:focus,.hover-black-80:hover{color:rgba(0,0,0,.8)}.hover-black-70:focus,.hover-black-70:hover{color:rgba(0,0,0,.7)}.hover-black-60:focus,.hover-black-60:hover{color:rgba(0,0,0,.6)}.hover-black-50:focus,.hover-black-50:hover{color:rgba(0,0,0,.5)}.hover-black-40:focus,.hover-black-40:hover{color:rgba(0,0,0,.4)}.hover-black-30:focus,.hover-black-30:hover{color:rgba(0,0,0,.3)}.hover-black-20:focus,.hover-black-20:hover{color:rgba(0,0,0,.2)}.hover-black-10:focus,.hover-black-10:hover{color:rgba(0,0,0,.1)}.hover-white-90:focus,.hover-white-90:hover{color:hsla(0,0%,100%,.9)}.hover-white-80:focus,.hover-white-80:hover{color:hsla(0,0%,100%,.8)}.hover-white-70:focus,.hover-white-70:hover{color:hsla(0,0%,100%,.7)}.hover-white-60:focus,.hover-white-60:hover{color:hsla(0,0%,100%,.6)}.hover-white-50:focus,.hover-white-50:hover{color:hsla(0,0%,100%,.5)}.hover-white-40:focus,.hover-white-40:hover{color:hsla(0,0%,100%,.4)}.hover-white-30:focus,.hover-white-30:hover{color:hsla(0,0%,100%,.3)}.hover-white-20:focus,.hover-white-20:hover{color:hsla(0,0%,100%,.2)}.hover-white-10:focus,.hover-white-10:hover{color:hsla(0,0%,100%,.1)}.hover-inherit:focus,.hover-inherit:hover{color:inherit}.hover-bg-black:focus,.hover-bg-black:hover{background-color:#000}.hover-bg-near-black:focus,.hover-bg-near-black:hover{background-color:#111}.hover-bg-dark-gray:focus,.hover-bg-dark-gray:hover{background-color:#4d4d4f}.hover-bg-mid-gray:focus,.hover-bg-mid-gray:hover{background-color:#555}.hover-bg-gray:focus,.hover-bg-gray:hover{background-color:#777}.hover-bg-silver:focus,.hover-bg-silver:hover{background-color:#999}.hover-bg-light-silver:focus,.hover-bg-light-silver:hover{background-color:#aaa}.hover-bg-moon-gray:focus,.hover-bg-moon-gray:hover{background-color:#ccc}.hover-bg-light-gray:focus,.hover-bg-light-gray:hover{background-color:#eee}.hover-bg-near-white:focus,.hover-bg-near-white:hover{background-color:#f4f4f4}.hover-bg-white:focus,.hover-bg-white:hover{background-color:#fff}.hover-bg-transparent:focus,.hover-bg-transparent:hover{background-color:transparent}.hover-bg-black-90:focus,.hover-bg-black-90:hover{background-color:rgba(0,0,0,.9)}.hover-bg-black-80:focus,.hover-bg-black-80:hover{background-color:rgba(0,0,0,.8)}.hover-bg-black-70:focus,.hover-bg-black-70:hover{background-color:rgba(0,0,0,.7)}.hover-bg-black-60:focus,.hover-bg-black-60:hover{background-color:rgba(0,0,0,.6)}.hover-bg-black-50:focus,.hover-bg-black-50:hover{background-color:rgba(0,0,0,.5)}.hover-bg-black-40:focus,.hover-bg-black-40:hover{background-color:rgba(0,0,0,.4)}.hover-bg-black-30:focus,.hover-bg-black-30:hover{background-color:rgba(0,0,0,.3)}.hover-bg-black-20:focus,.hover-bg-black-20:hover{background-color:rgba(0,0,0,.2)}.hover-bg-black-10:focus,.hover-bg-black-10:hover{background-color:rgba(0,0,0,.1)}.hover-bg-white-90:focus,.hover-bg-white-90:hover{background-color:hsla(0,0%,100%,.9)}.hover-bg-white-80:focus,.hover-bg-white-80:hover{background-color:hsla(0,0%,100%,.8)}.hover-bg-white-70:focus,.hover-bg-white-70:hover{background-color:hsla(0,0%,100%,.7)}.hover-bg-white-60:focus,.hover-bg-white-60:hover{background-color:hsla(0,0%,100%,.6)}.hover-bg-white-50:focus,.hover-bg-white-50:hover{background-color:hsla(0,0%,100%,.5)}.hover-bg-white-40:focus,.hover-bg-white-40:hover{background-color:hsla(0,0%,100%,.4)}.hover-bg-white-30:focus,.hover-bg-white-30:hover{background-color:hsla(0,0%,100%,.3)}.hover-bg-white-20:focus,.hover-bg-white-20:hover{background-color:hsla(0,0%,100%,.2)}.hover-bg-white-10:focus,.hover-bg-white-10:hover{background-color:hsla(0,0%,100%,.1)}.hover-dark-red:focus,.hover-dark-red:hover{color:#e7040f}.hover-red:focus,.hover-red:hover{color:#ff4136}.hover-light-red:focus,.hover-light-red:hover{color:#ff725c}.hover-orange:focus,.hover-orange:hover{color:#f48120}.hover-gold:focus,.hover-gold:hover{color:#faad3f}.hover-yellow:focus,.hover-yellow:hover{color:gold}.hover-light-yellow:focus,.hover-light-yellow:hover{color:#fbf1a9}.hover-purple:focus,.hover-purple:hover{color:#5e2ca5}.hover-light-purple:focus,.hover-light-purple:hover{color:#a463f2}.hover-dark-pink:focus,.hover-dark-pink:hover{color:#d5008f}.hover-hot-pink:focus,.hover-hot-pink:hover{color:#ff41b4}.hover-pink:focus,.hover-pink:hover{color:#ff80cc}.hover-light-pink:focus,.hover-light-pink:hover{color:#ffa3d7}.hover-dark-green:focus,.hover-dark-green:hover{color:#137752}.hover-green:focus,.hover-green:hover{color:#19a974}.hover-light-green:focus,.hover-light-green:hover{color:#9eebcf}.hover-navy:focus,.hover-navy:hover{color:#001b44}.hover-dark-blue:focus,.hover-dark-blue:hover{color:#00449e}.hover-blue:focus,.hover-blue:hover{color:#408bc9}.hover-light-blue:focus,.hover-light-blue:hover{color:#76c4e2}.hover-lightest-blue:focus,.hover-lightest-blue:hover{color:#cdecff}.hover-washed-blue:focus,.hover-washed-blue:hover{color:#f6fffe}.hover-washed-green:focus,.hover-washed-green:hover{color:#e8fdf5}.hover-washed-yellow:focus,.hover-washed-yellow:hover{color:#fffceb}.hover-washed-red:focus,.hover-washed-red:hover{color:#ffdfdf}.hover-bg-dark-red:focus,.hover-bg-dark-red:hover{background-color:#e7040f}.hover-bg-red:focus,.hover-bg-red:hover{background-color:#ff4136}.hover-bg-light-red:focus,.hover-bg-light-red:hover{background-color:#ff725c}.hover-bg-orange:focus,.hover-bg-orange:hover{background-color:#f48120}.hover-bg-gold:focus,.hover-bg-gold:hover{background-color:#faad3f}.hover-bg-yellow:focus,.hover-bg-yellow:hover{background-color:gold}.hover-bg-light-yellow:focus,.hover-bg-light-yellow:hover{background-color:#fbf1a9}.hover-bg-purple:focus,.hover-bg-purple:hover{background-color:#5e2ca5}.hover-bg-light-purple:focus,.hover-bg-light-purple:hover{background-color:#a463f2}.hover-bg-dark-pink:focus,.hover-bg-dark-pink:hover{background-color:#d5008f}.hover-bg-hot-pink:focus,.hover-bg-hot-pink:hover{background-color:#ff41b4}.hover-bg-pink:focus,.hover-bg-pink:hover{background-color:#ff80cc}.hover-bg-light-pink:focus,.hover-bg-light-pink:hover{background-color:#ffa3d7}.hover-bg-dark-green:focus,.hover-bg-dark-green:hover{background-color:#137752}.hover-bg-green:focus,.hover-bg-green:hover{background-color:#19a974}.hover-bg-light-green:focus,.hover-bg-light-green:hover{background-color:#9eebcf}.hover-bg-navy:focus,.hover-bg-navy:hover{background-color:#001b44}.hover-bg-dark-blue:focus,.hover-bg-dark-blue:hover{background-color:#00449e}.hover-bg-blue:focus,.hover-bg-blue:hover{background-color:#408bc9}.hover-bg-light-blue:focus,.hover-bg-light-blue:hover{background-color:#76c4e2}.hover-bg-lightest-blue:focus,.hover-bg-lightest-blue:hover{background-color:#cdecff}.hover-bg-washed-blue:focus,.hover-bg-washed-blue:hover{background-color:#f6fffe}.hover-bg-washed-green:focus,.hover-bg-washed-green:hover{background-color:#e8fdf5}.hover-bg-washed-yellow:focus,.hover-bg-washed-yellow:hover{background-color:#fffceb}.hover-bg-washed-red:focus,.hover-bg-washed-red:hover{background-color:#ffdfdf}.hover-bg-inherit:focus,.hover-bg-inherit:hover{background-color:inherit}.pa0{padding:0}.pa1{padding:.25rem}.pa2{padding:.5rem}.pa3{padding:1rem}.pa4{padding:2rem}.pa5{padding:4rem}.pa6{padding:8rem}.pa7{padding:16rem}.pl0{padding-left:0}.pl1{padding-left:.25rem}.pl2{padding-left:.5rem}.pl3{padding-left:1rem}.pl4{padding-left:2rem}.pl5{padding-left:4rem}.pl6{padding-left:8rem}.pl7{padding-left:16rem}.pr0{padding-right:0}.pr1{padding-right:.25rem}.pr2{padding-right:.5rem}.pr3{padding-right:1rem}.pr4{padding-right:2rem}.pr5{padding-right:4rem}.pr6{padding-right:8rem}.pr7{padding-right:16rem}.pb0{padding-bottom:0}.pb1{padding-bottom:.25rem}.pb2{padding-bottom:.5rem}.pb3{padding-bottom:1rem}.pb4{padding-bottom:2rem}.pb5{padding-bottom:4rem}.pb6{padding-bottom:8rem}.pb7{padding-bottom:16rem}.pt0{padding-top:0}.pt1{padding-top:.25rem}.pt2{padding-top:.5rem}.pt3{padding-top:1rem}.pt4{padding-top:2rem}.pt5{padding-top:4rem}.pt6{padding-top:8rem}.pt7{padding-top:16rem}.pv0{padding-top:0;padding-bottom:0}.pv1{padding-top:.25rem;padding-bottom:.25rem}.pv2{padding-top:.5rem;padding-bottom:.5rem}.pv3{padding-top:1rem;padding-bottom:1rem}.pv4{padding-top:2rem;padding-bottom:2rem}.pv5{padding-top:4rem;padding-bottom:4rem}.pv6{padding-top:8rem;padding-bottom:8rem}.pv7{padding-top:16rem;padding-bottom:16rem}.ph0{padding-left:0;padding-right:0}.ph1{padding-left:.25rem;padding-right:.25rem}.ph2{padding-left:.5rem;padding-right:.5rem}.ph3{padding-left:1rem;padding-right:1rem}.ph4{padding-left:2rem;padding-right:2rem}.ph5{padding-left:4rem;padding-right:4rem}.ph6{padding-left:8rem;padding-right:8rem}.ph7{padding-left:16rem;padding-right:16rem}.ma0{margin:0}.ma1{margin:.25rem}.ma2{margin:.5rem}.ma3{margin:1rem}.ma4{margin:2rem}.ma5{margin:4rem}.ma6{margin:8rem}.ma7{margin:16rem}.ml0{margin-left:0}.ml1{margin-left:.25rem}.ml2{margin-left:.5rem}.ml3{margin-left:1rem}.ml4{margin-left:2rem}.ml5{margin-left:4rem}.ml6{margin-left:8rem}.ml7{margin-left:16rem}.mr0{margin-right:0}.mr1{margin-right:.25rem}.mr2{margin-right:.5rem}.mr3{margin-right:1rem}.mr4{margin-right:2rem}.mr5{margin-right:4rem}.mr6{margin-right:8rem}.mr7{margin-right:16rem}.mb0{margin-bottom:0}.mb1{margin-bottom:.25rem}.mb2{margin-bottom:.5rem}.mb3{margin-bottom:1rem}.mb4{margin-bottom:2rem}.mb5{margin-bottom:4rem}.mb6{margin-bottom:8rem}.mb7{margin-bottom:16rem}.mt0{margin-top:0}.mt1{margin-top:.25rem}.mt2{margin-top:.5rem}.mt3{margin-top:1rem}.mt4{margin-top:2rem}.mt5{margin-top:4rem}.mt6{margin-top:8rem}.mt7{margin-top:16rem}.mv0{margin-top:0;margin-bottom:0}.mv1{margin-top:.25rem;margin-bottom:.25rem}.mv2{margin-top:.5rem;margin-bottom:.5rem}.mv3{margin-top:1rem;margin-bottom:1rem}.mv4{margin-top:2rem;margin-bottom:2rem}.mv5{margin-top:4rem;margin-bottom:4rem}.mv6{margin-top:8rem;margin-bottom:8rem}.mv7{margin-top:16rem;margin-bottom:16rem}.mh0{margin-left:0;margin-right:0}.mh1{margin-left:.25rem;margin-right:.25rem}.mh2{margin-left:.5rem;margin-right:.5rem}.mh3{margin-left:1rem;margin-right:1rem}.mh4{margin-left:2rem;margin-right:2rem}.mh5{margin-left:4rem;margin-right:4rem}.mh6{margin-left:8rem;margin-right:8rem}.mh7{margin-left:16rem;margin-right:16rem}.na1{margin:-.25rem}.na2{margin:-.5rem}.na3{margin:-1rem}.na4{margin:-2rem}.na5{margin:-4rem}.na6{margin:-8rem}.na7{margin:-16rem}.nl1{margin-left:-.25rem}.nl2{margin-left:-.5rem}.nl3{margin-left:-1rem}.nl4{margin-left:-2rem}.nl5{margin-left:-4rem}.nl6{margin-left:-8rem}.nl7{margin-left:-16rem}.nr1{margin-right:-.25rem}.nr2{margin-right:-.5rem}.nr3{margin-right:-1rem}.nr4{margin-right:-2rem}.nr5{margin-right:-4rem}.nr6{margin-right:-8rem}.nr7{margin-right:-16rem}.nb1{margin-bottom:-.25rem}.nb2{margin-bottom:-.5rem}.nb3{margin-bottom:-1rem}.nb4{margin-bottom:-2rem}.nb5{margin-bottom:-4rem}.nb6{margin-bottom:-8rem}.nb7{margin-bottom:-16rem}.nt1{margin-top:-.25rem}.nt2{margin-top:-.5rem}.nt3{margin-top:-1rem}.nt4{margin-top:-2rem}.nt5{margin-top:-4rem}.nt6{margin-top:-8rem}.nt7{margin-top:-16rem}.collapse{border-collapse:collapse;border-spacing:0}.striped--light-silver:nth-child(odd){background-color:#aaa}.striped--moon-gray:nth-child(odd){background-color:#ccc}.striped--light-gray:nth-child(odd){background-color:#eee}.striped--near-white:nth-child(odd){background-color:#f4f4f4}.stripe-light:nth-child(odd){background-color:hsla(0,0%,100%,.1)}.stripe-dark:nth-child(odd){background-color:rgba(0,0,0,.1)}.strike{text-decoration:line-through}.underline{text-decoration:underline}.no-underline{text-decoration:none}.tl{text-align:left}.tr{text-align:right}.tc{text-align:center}.tj{text-align:justify}.ttc{text-transform:capitalize}.ttl{text-transform:lowercase}.ttu{text-transform:uppercase}.ttn{text-transform:none}.f-6,.f-headline{font-size:6rem}.f-5,.f-subheadline{font-size:5rem}.f1{font-size:3rem}.f2{font-size:2.25rem}.f3{font-size:1.5rem}.f4{font-size:1.25rem}.f5{font-size:1rem}.f6{font-size:.875rem}.f7{font-size:.75rem}.measure{max-width:30em}.measure-wide{max-width:34em}.measure-narrow{max-width:20em}.indent{text-indent:1em;margin-top:0;margin-bottom:0}.small-caps{font-variant:small-caps}.truncate{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.overflow-container{overflow-y:scroll}.center{margin-left:auto}.center,.mr-auto{margin-right:auto}.ml-auto{margin-left:auto}.clip{position:fixed!important;_position:absolute!important;clip:rect(1px 1px 1px 1px);clip:rect(1px,1px,1px,1px)}.ws-normal{white-space:normal}.nowrap{white-space:nowrap}.pre{white-space:pre}.v-base{vertical-align:baseline}.v-mid{vertical-align:middle}.v-top{vertical-align:top}.v-btm{vertical-align:bottom}.dim{opacity:1}.dim,.dim:focus,.dim:hover{-webkit-transition:opacity .15s ease-in;transition:opacity .15s ease-in}.dim:focus,.dim:hover{opacity:.5}.dim:active{opacity:.8;-webkit-transition:opacity .15s ease-out;transition:opacity .15s ease-out}.glow,.glow:focus,.glow:hover{-webkit-transition:opacity .15s ease-in;transition:opacity .15s ease-in}.glow:focus,.glow:hover{opacity:1}.hide-child .child{opacity:0;-webkit-transition:opacity .15s ease-in;transition:opacity .15s ease-in}.hide-child:active .child,.hide-child:focus .child,.hide-child:hover .child{opacity:1;-webkit-transition:opacity .15s ease-in;transition:opacity .15s ease-in}.underline-hover:focus,.underline-hover:hover{text-decoration:underline}.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}.grow:focus,.grow:hover{-webkit-transform:scale(1.05);transform:scale(1.05)}.grow:active{-webkit-transform:scale(.9);transform:scale(.9)}.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}.grow-large:focus,.grow-large:hover{-webkit-transform:scale(1.2);transform:scale(1.2)}.grow-large:active{-webkit-transform:scale(.95);transform:scale(.95)}.pointer:hover,.shadow-hover{cursor:pointer}.shadow-hover{position:relative;-webkit-transition:all .5s cubic-bezier(.165,.84,.44,1);transition:all .5s cubic-bezier(.165,.84,.44,1)}.shadow-hover:after{content:"";box-shadow:0 0 16px 2px rgba(0,0,0,.2);border-radius:inherit;opacity:0;position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;-webkit-transition:opacity .5s cubic-bezier(.165,.84,.44,1);transition:opacity .5s cubic-bezier(.165,.84,.44,1)}.shadow-hover:focus:after,.shadow-hover:hover:after{opacity:1}.bg-animate,.bg-animate:focus,.bg-animate:hover{-webkit-transition:background-color .15s ease-in-out;transition:background-color .15s ease-in-out}.z-0{z-index:0}.z-1{z-index:1}.z-2{z-index:2}.z-3{z-index:3}.z-4{z-index:4}.z-5{z-index:5}.z-999{z-index:999}.z-9999{z-index:9999}.z-max{z-index:2147483647}.z-inherit{z-index:inherit}.z-initial{z-index:auto}.z-unset{z-index:unset}.nested-copy-line-height ol,.nested-copy-line-height p,.nested-copy-line-height ul{line-height:1.5}.nested-headline-line-height h1,.nested-headline-line-height h2,.nested-headline-line-height h3,.nested-headline-line-height h4,.nested-headline-line-height h5,.nested-headline-line-height h6{line-height:1.25}.nested-list-reset ol,.nested-list-reset ul{padding-left:0;margin-left:0;list-style-type:none}.nested-copy-indent p+p{text-indent:1em;margin-top:0;margin-bottom:0}.nested-copy-separator p+p{margin-top:1.5em}.nested-img img{width:100%;max-width:100%;display:block}.nested-links a{color:#408bc9;-webkit-transition:color .15s ease-in;transition:color .15s ease-in}.nested-links a:focus,.nested-links a:hover{color:#76c4e2;-webkit-transition:color .15s ease-in;transition:color .15s ease-in}.debug *{outline:1px solid gold}.debug-white *{outline:1px solid #fff}.debug-black *{outline:1px solid #000}.debug-grid{background:transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAAFElEQVR4AWPAC97/9x0eCsAEPgwAVLshdpENIxcAAAAASUVORK5CYII=) repeat 0 0}.debug-grid-16{background:transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAMklEQVR4AWOgCLz/b0epAa6UGuBOqQHOQHLUgFEDnAbcBZ4UGwDOkiCnkIhdgNgNxAYAiYlD+8sEuo8AAAAASUVORK5CYII=) repeat 0 0}.debug-grid-8-solid{background:#fff url(data:image/gif;base64,R0lGODdhCAAIAPEAAADw/wDx/////wAAACwAAAAACAAIAAACDZQvgaeb/lxbAIKA8y0AOw==) repeat 0 0}.debug-grid-16-solid{background:#fff url(data:image/gif;base64,R0lGODdhEAAQAPEAAADw/wDx/xXy/////ywAAAAAEAAQAAACIZyPKckYDQFsb6ZqD85jZ2+BkwiRFKehhqQCQgDHcgwEBQA7) repeat 0 0}@media screen and (min-width:30em){.aspect-ratio-ns{height:0;position:relative}.aspect-ratio--16x9-ns{padding-bottom:56.25%}.aspect-ratio--9x16-ns{padding-bottom:177.77%}.aspect-ratio--4x3-ns{padding-bottom:75%}.aspect-ratio--3x4-ns{padding-bottom:133.33%}.aspect-ratio--6x4-ns{padding-bottom:66.6%}.aspect-ratio--4x6-ns{padding-bottom:150%}.aspect-ratio--8x5-ns{padding-bottom:62.5%}.aspect-ratio--5x8-ns{padding-bottom:160%}.aspect-ratio--7x5-ns{padding-bottom:71.42%}.aspect-ratio--5x7-ns{padding-bottom:140%}.aspect-ratio--1x1-ns{padding-bottom:100%}.aspect-ratio--object-ns{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:100}.cover-ns{background-size:cover!important}.contain-ns{background-size:contain!important}.bg-center-ns{background-position:50%}.bg-center-ns,.bg-top-ns{background-repeat:no-repeat}.bg-top-ns{background-position:top}.bg-right-ns{background-position:100%}.bg-bottom-ns,.bg-right-ns{background-repeat:no-repeat}.bg-bottom-ns{background-position:bottom}.bg-left-ns{background-repeat:no-repeat;background-position:0}.outline-ns{outline:1px solid}.outline-transparent-ns{outline:1px solid transparent}.outline-0-ns{outline:0}.ba-ns{border-style:solid;border-width:1px}.bt-ns{border-top-style:solid;border-top-width:1px}.br-ns{border-right-style:solid;border-right-width:1px}.bb-ns{border-bottom-style:solid;border-bottom-width:1px}.bl-ns{border-left-style:solid;border-left-width:1px}.bn-ns{border-style:none;border-width:0}.br0-ns{border-radius:0}.br1-ns{border-radius:.125rem}.br2-ns{border-radius:.25rem}.br3-ns{border-radius:.5rem}.br4-ns{border-radius:1rem}.br-100-ns{border-radius:100%}.br-pill-ns{border-radius:9999px}.br--bottom-ns{border-top-left-radius:0;border-top-right-radius:0}.br--top-ns{border-bottom-right-radius:0}.br--right-ns,.br--top-ns{border-bottom-left-radius:0}.br--right-ns{border-top-left-radius:0}.br--left-ns{border-top-right-radius:0;border-bottom-right-radius:0}.b--dotted-ns{border-style:dotted}.b--dashed-ns{border-style:dashed}.b--solid-ns{border-style:solid}.b--none-ns{border-style:none}.bw0-ns{border-width:0}.bw1-ns{border-width:.125rem}.bw2-ns{border-width:.25rem}.bw3-ns{border-width:.5rem}.bw4-ns{border-width:1rem}.bw5-ns{border-width:2rem}.bt-0-ns{border-top-width:0}.br-0-ns{border-right-width:0}.bb-0-ns{border-bottom-width:0}.bl-0-ns{border-left-width:0}.shadow-1-ns{box-shadow:0 0 4px 2px rgba(0,0,0,.2)}.shadow-2-ns{box-shadow:0 0 8px 2px rgba(0,0,0,.2)}.shadow-3-ns{box-shadow:2px 2px 4px 2px rgba(0,0,0,.2)}.shadow-4-ns{box-shadow:2px 2px 8px 0 rgba(0,0,0,.2)}.shadow-5-ns{box-shadow:4px 4px 8px 0 rgba(0,0,0,.2)}.top-0-ns{top:0}.left-0-ns{left:0}.right-0-ns{right:0}.bottom-0-ns{bottom:0}.top-1-ns{top:1rem}.left-1-ns{left:1rem}.right-1-ns{right:1rem}.bottom-1-ns{bottom:1rem}.top-2-ns{top:2rem}.left-2-ns{left:2rem}.right-2-ns{right:2rem}.bottom-2-ns{bottom:2rem}.top--1-ns{top:-1rem}.right--1-ns{right:-1rem}.bottom--1-ns{bottom:-1rem}.left--1-ns{left:-1rem}.top--2-ns{top:-2rem}.right--2-ns{right:-2rem}.bottom--2-ns{bottom:-2rem}.left--2-ns{left:-2rem}.absolute--fill-ns{top:0;right:0;bottom:0;left:0}.cl-ns{clear:left}.cr-ns{clear:right}.cb-ns{clear:both}.cn-ns{clear:none}.dn-ns{display:none}.di-ns{display:inline}.db-ns{display:block}.dib-ns{display:inline-block}.dit-ns{display:inline-table}.dt-ns{display:table}.dtc-ns{display:table-cell}.dt-row-ns{display:table-row}.dt-row-group-ns{display:table-row-group}.dt-column-ns{display:table-column}.dt-column-group-ns{display:table-column-group}.dt--fixed-ns{table-layout:fixed;width:100%}.flex-ns{display:-webkit-box;display:-ms-flexbox;display:flex}.inline-flex-ns{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.flex-auto-ns{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;min-width:0;min-height:0}.flex-none-ns{-webkit-box-flex:0;-ms-flex:none;flex:none}.flex-column-ns{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.flex-row-ns{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.flex-wrap-ns{-ms-flex-wrap:wrap;flex-wrap:wrap}.flex-nowrap-ns{-ms-flex-wrap:nowrap;flex-wrap:nowrap}.flex-wrap-reverse-ns{-ms-flex-wrap:wrap-reverse;flex-wrap:wrap-reverse}.flex-column-reverse-ns{-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.flex-row-reverse-ns{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.items-start-ns{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.items-end-ns{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.items-center-ns{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.items-baseline-ns{-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline}.items-stretch-ns{-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch}.self-start-ns{-ms-flex-item-align:start;align-self:flex-start}.self-end-ns{-ms-flex-item-align:end;align-self:flex-end}.self-center-ns{-ms-flex-item-align:center;-ms-grid-row-align:center;align-self:center}.self-baseline-ns{-ms-flex-item-align:baseline;align-self:baseline}.self-stretch-ns{-ms-flex-item-align:stretch;-ms-grid-row-align:stretch;align-self:stretch}.justify-start-ns{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.justify-end-ns{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.justify-center-ns{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.justify-between-ns{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.justify-around-ns{-ms-flex-pack:distribute;justify-content:space-around}.content-start-ns{-ms-flex-line-pack:start;align-content:flex-start}.content-end-ns{-ms-flex-line-pack:end;align-content:flex-end}.content-center-ns{-ms-flex-line-pack:center;align-content:center}.content-between-ns{-ms-flex-line-pack:justify;align-content:space-between}.content-around-ns{-ms-flex-line-pack:distribute;align-content:space-around}.content-stretch-ns{-ms-flex-line-pack:stretch;align-content:stretch}.order-0-ns{-webkit-box-ordinal-group:1;-ms-flex-order:0;order:0}.order-1-ns{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.order-2-ns{-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}.order-3-ns{-webkit-box-ordinal-group:4;-ms-flex-order:3;order:3}.order-4-ns{-webkit-box-ordinal-group:5;-ms-flex-order:4;order:4}.order-5-ns{-webkit-box-ordinal-group:6;-ms-flex-order:5;order:5}.order-6-ns{-webkit-box-ordinal-group:7;-ms-flex-order:6;order:6}.order-7-ns{-webkit-box-ordinal-group:8;-ms-flex-order:7;order:7}.order-8-ns{-webkit-box-ordinal-group:9;-ms-flex-order:8;order:8}.order-last-ns{-webkit-box-ordinal-group:100000;-ms-flex-order:99999;order:99999}.fl-ns{float:left}.fl-ns,.fr-ns{display:inline}.fr-ns{float:right}.fn-ns{float:none}.i-ns{font-style:italic}.fs-normal-ns{font-style:normal}.normal-ns{font-weight:400}.b-ns{font-weight:700}.fw1-ns{font-weight:100}.fw2-ns{font-weight:200}.fw3-ns{font-weight:300}.fw4-ns{font-weight:400}.fw5-ns{font-weight:500}.fw6-ns{font-weight:600}.fw7-ns{font-weight:700}.fw8-ns{font-weight:800}.fw9-ns{font-weight:900}.h1-ns{height:1rem}.h2-ns{height:2rem}.h3-ns{height:4rem}.h4-ns{height:8rem}.h5-ns{height:16rem}.h-25-ns{height:25%}.h-50-ns{height:50%}.h-75-ns{height:75%}.h-100-ns{height:100%}.min-h-100-ns{min-height:100%}.vh-25-ns{height:25vh}.vh-50-ns{height:50vh}.vh-75-ns{height:75vh}.vh-100-ns{height:100vh}.min-vh-100-ns{min-height:100vh}.h-auto-ns{height:auto}.h-inherit-ns{height:inherit}.tracked-ns{letter-spacing:.1em}.tracked-tight-ns{letter-spacing:-.05em}.tracked-mega-ns{letter-spacing:.25em}.lh-solid-ns{line-height:1}.lh-title-ns{line-height:1.25}.lh-copy-ns{line-height:1.5}.mw-100-ns{max-width:100%}.mw1-ns{max-width:1rem}.mw2-ns{max-width:2rem}.mw3-ns{max-width:4rem}.mw4-ns{max-width:8rem}.mw5-ns{max-width:16rem}.mw6-ns{max-width:32rem}.mw7-ns{max-width:48rem}.mw8-ns{max-width:64rem}.mw9-ns{max-width:96rem}.mw-none-ns{max-width:none}.w1-ns{width:1rem}.w2-ns{width:2rem}.w3-ns{width:4rem}.w4-ns{width:8rem}.w5-ns{width:16rem}.w-10-ns{width:10%}.w-20-ns{width:20%}.w-25-ns{width:25%}.w-30-ns{width:30%}.w-33-ns{width:33%}.w-34-ns{width:34%}.w-40-ns{width:40%}.w-50-ns{width:50%}.w-60-ns{width:60%}.w-70-ns{width:70%}.w-75-ns{width:75%}.w-80-ns{width:80%}.w-90-ns{width:90%}.w-100-ns{width:100%}.w-third-ns{width:33.33333%}.w-two-thirds-ns{width:66.66667%}.w-auto-ns{width:auto}.overflow-visible-ns{overflow:visible}.overflow-hidden-ns{overflow:hidden}.overflow-scroll-ns{overflow:scroll}.overflow-auto-ns{overflow:auto}.overflow-x-visible-ns{overflow-x:visible}.overflow-x-hidden-ns{overflow-x:hidden}.overflow-x-scroll-ns{overflow-x:scroll}.overflow-x-auto-ns{overflow-x:auto}.overflow-y-visible-ns{overflow-y:visible}.overflow-y-hidden-ns{overflow-y:hidden}.overflow-y-scroll-ns{overflow-y:scroll}.overflow-y-auto-ns{overflow-y:auto}.static-ns{position:static}.relative-ns{position:relative}.absolute-ns{position:absolute}.fixed-ns{position:fixed}.rotate-45-ns{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.rotate-90-ns{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.rotate-135-ns{-webkit-transform:rotate(135deg);transform:rotate(135deg)}.rotate-180-ns{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.rotate-225-ns{-webkit-transform:rotate(225deg);transform:rotate(225deg)}.rotate-270-ns{-webkit-transform:rotate(270deg);transform:rotate(270deg)}.rotate-315-ns{-webkit-transform:rotate(315deg);transform:rotate(315deg)}.pa0-ns{padding:0}.pa1-ns{padding:.25rem}.pa2-ns{padding:.5rem}.pa3-ns{padding:1rem}.pa4-ns{padding:2rem}.pa5-ns{padding:4rem}.pa6-ns{padding:8rem}.pa7-ns{padding:16rem}.pl0-ns{padding-left:0}.pl1-ns{padding-left:.25rem}.pl2-ns{padding-left:.5rem}.pl3-ns{padding-left:1rem}.pl4-ns{padding-left:2rem}.pl5-ns{padding-left:4rem}.pl6-ns{padding-left:8rem}.pl7-ns{padding-left:16rem}.pr0-ns{padding-right:0}.pr1-ns{padding-right:.25rem}.pr2-ns{padding-right:.5rem}.pr3-ns{padding-right:1rem}.pr4-ns{padding-right:2rem}.pr5-ns{padding-right:4rem}.pr6-ns{padding-right:8rem}.pr7-ns{padding-right:16rem}.pb0-ns{padding-bottom:0}.pb1-ns{padding-bottom:.25rem}.pb2-ns{padding-bottom:.5rem}.pb3-ns{padding-bottom:1rem}.pb4-ns{padding-bottom:2rem}.pb5-ns{padding-bottom:4rem}.pb6-ns{padding-bottom:8rem}.pb7-ns{padding-bottom:16rem}.pt0-ns{padding-top:0}.pt1-ns{padding-top:.25rem}.pt2-ns{padding-top:.5rem}.pt3-ns{padding-top:1rem}.pt4-ns{padding-top:2rem}.pt5-ns{padding-top:4rem}.pt6-ns{padding-top:8rem}.pt7-ns{padding-top:16rem}.pv0-ns{padding-top:0;padding-bottom:0}.pv1-ns{padding-top:.25rem;padding-bottom:.25rem}.pv2-ns{padding-top:.5rem;padding-bottom:.5rem}.pv3-ns{padding-top:1rem;padding-bottom:1rem}.pv4-ns{padding-top:2rem;padding-bottom:2rem}.pv5-ns{padding-top:4rem;padding-bottom:4rem}.pv6-ns{padding-top:8rem;padding-bottom:8rem}.pv7-ns{padding-top:16rem;padding-bottom:16rem}.ph0-ns{padding-left:0;padding-right:0}.ph1-ns{padding-left:.25rem;padding-right:.25rem}.ph2-ns{padding-left:.5rem;padding-right:.5rem}.ph3-ns{padding-left:1rem;padding-right:1rem}.ph4-ns{padding-left:2rem;padding-right:2rem}.ph5-ns{padding-left:4rem;padding-right:4rem}.ph6-ns{padding-left:8rem;padding-right:8rem}.ph7-ns{padding-left:16rem;padding-right:16rem}.ma0-ns{margin:0}.ma1-ns{margin:.25rem}.ma2-ns{margin:.5rem}.ma3-ns{margin:1rem}.ma4-ns{margin:2rem}.ma5-ns{margin:4rem}.ma6-ns{margin:8rem}.ma7-ns{margin:16rem}.ml0-ns{margin-left:0}.ml1-ns{margin-left:.25rem}.ml2-ns{margin-left:.5rem}.ml3-ns{margin-left:1rem}.ml4-ns{margin-left:2rem}.ml5-ns{margin-left:4rem}.ml6-ns{margin-left:8rem}.ml7-ns{margin-left:16rem}.mr0-ns{margin-right:0}.mr1-ns{margin-right:.25rem}.mr2-ns{margin-right:.5rem}.mr3-ns{margin-right:1rem}.mr4-ns{margin-right:2rem}.mr5-ns{margin-right:4rem}.mr6-ns{margin-right:8rem}.mr7-ns{margin-right:16rem}.mb0-ns{margin-bottom:0}.mb1-ns{margin-bottom:.25rem}.mb2-ns{margin-bottom:.5rem}.mb3-ns{margin-bottom:1rem}.mb4-ns{margin-bottom:2rem}.mb5-ns{margin-bottom:4rem}.mb6-ns{margin-bottom:8rem}.mb7-ns{margin-bottom:16rem}.mt0-ns{margin-top:0}.mt1-ns{margin-top:.25rem}.mt2-ns{margin-top:.5rem}.mt3-ns{margin-top:1rem}.mt4-ns{margin-top:2rem}.mt5-ns{margin-top:4rem}.mt6-ns{margin-top:8rem}.mt7-ns{margin-top:16rem}.mv0-ns{margin-top:0;margin-bottom:0}.mv1-ns{margin-top:.25rem;margin-bottom:.25rem}.mv2-ns{margin-top:.5rem;margin-bottom:.5rem}.mv3-ns{margin-top:1rem;margin-bottom:1rem}.mv4-ns{margin-top:2rem;margin-bottom:2rem}.mv5-ns{margin-top:4rem;margin-bottom:4rem}.mv6-ns{margin-top:8rem;margin-bottom:8rem}.mv7-ns{margin-top:16rem;margin-bottom:16rem}.mh0-ns{margin-left:0;margin-right:0}.mh1-ns{margin-left:.25rem;margin-right:.25rem}.mh2-ns{margin-left:.5rem;margin-right:.5rem}.mh3-ns{margin-left:1rem;margin-right:1rem}.mh4-ns{margin-left:2rem;margin-right:2rem}.mh5-ns{margin-left:4rem;margin-right:4rem}.mh6-ns{margin-left:8rem;margin-right:8rem}.mh7-ns{margin-left:16rem;margin-right:16rem}.na1-ns{margin:-.25rem}.na2-ns{margin:-.5rem}.na3-ns{margin:-1rem}.na4-ns{margin:-2rem}.na5-ns{margin:-4rem}.na6-ns{margin:-8rem}.na7-ns{margin:-16rem}.nl1-ns{margin-left:-.25rem}.nl2-ns{margin-left:-.5rem}.nl3-ns{margin-left:-1rem}.nl4-ns{margin-left:-2rem}.nl5-ns{margin-left:-4rem}.nl6-ns{margin-left:-8rem}.nl7-ns{margin-left:-16rem}.nr1-ns{margin-right:-.25rem}.nr2-ns{margin-right:-.5rem}.nr3-ns{margin-right:-1rem}.nr4-ns{margin-right:-2rem}.nr5-ns{margin-right:-4rem}.nr6-ns{margin-right:-8rem}.nr7-ns{margin-right:-16rem}.nb1-ns{margin-bottom:-.25rem}.nb2-ns{margin-bottom:-.5rem}.nb3-ns{margin-bottom:-1rem}.nb4-ns{margin-bottom:-2rem}.nb5-ns{margin-bottom:-4rem}.nb6-ns{margin-bottom:-8rem}.nb7-ns{margin-bottom:-16rem}.nt1-ns{margin-top:-.25rem}.nt2-ns{margin-top:-.5rem}.nt3-ns{margin-top:-1rem}.nt4-ns{margin-top:-2rem}.nt5-ns{margin-top:-4rem}.nt6-ns{margin-top:-8rem}.nt7-ns{margin-top:-16rem}.strike-ns{text-decoration:line-through}.underline-ns{text-decoration:underline}.no-underline-ns{text-decoration:none}.tl-ns{text-align:left}.tr-ns{text-align:right}.tc-ns{text-align:center}.tj-ns{text-align:justify}.ttc-ns{text-transform:capitalize}.ttl-ns{text-transform:lowercase}.ttu-ns{text-transform:uppercase}.ttn-ns{text-transform:none}.f-6-ns,.f-headline-ns{font-size:6rem}.f-5-ns,.f-subheadline-ns{font-size:5rem}.f1-ns{font-size:3rem}.f2-ns{font-size:2.25rem}.f3-ns{font-size:1.5rem}.f4-ns{font-size:1.25rem}.f5-ns{font-size:1rem}.f6-ns{font-size:.875rem}.f7-ns{font-size:.75rem}.measure-ns{max-width:30em}.measure-wide-ns{max-width:34em}.measure-narrow-ns{max-width:20em}.indent-ns{text-indent:1em;margin-top:0;margin-bottom:0}.small-caps-ns{font-variant:small-caps}.truncate-ns{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.center-ns{margin-left:auto}.center-ns,.mr-auto-ns{margin-right:auto}.ml-auto-ns{margin-left:auto}.clip-ns{position:fixed!important;position:absolute!important;clip:rect(1px 1px 1px 1px);clip:rect(1px,1px,1px,1px)}.ws-normal-ns{white-space:normal}.nowrap-ns{white-space:nowrap}.pre-ns{white-space:pre}.v-base-ns{vertical-align:baseline}.v-mid-ns{vertical-align:middle}.v-top-ns{vertical-align:top}.v-btm-ns{vertical-align:bottom}}@media screen and (min-width:30em) and (max-width:60em){.aspect-ratio-m{height:0;position:relative}.aspect-ratio--16x9-m{padding-bottom:56.25%}.aspect-ratio--9x16-m{padding-bottom:177.77%}.aspect-ratio--4x3-m{padding-bottom:75%}.aspect-ratio--3x4-m{padding-bottom:133.33%}.aspect-ratio--6x4-m{padding-bottom:66.6%}.aspect-ratio--4x6-m{padding-bottom:150%}.aspect-ratio--8x5-m{padding-bottom:62.5%}.aspect-ratio--5x8-m{padding-bottom:160%}.aspect-ratio--7x5-m{padding-bottom:71.42%}.aspect-ratio--5x7-m{padding-bottom:140%}.aspect-ratio--1x1-m{padding-bottom:100%}.aspect-ratio--object-m{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:100}.cover-m{background-size:cover!important}.contain-m{background-size:contain!important}.bg-center-m{background-position:50%}.bg-center-m,.bg-top-m{background-repeat:no-repeat}.bg-top-m{background-position:top}.bg-right-m{background-position:100%}.bg-bottom-m,.bg-right-m{background-repeat:no-repeat}.bg-bottom-m{background-position:bottom}.bg-left-m{background-repeat:no-repeat;background-position:0}.outline-m{outline:1px solid}.outline-transparent-m{outline:1px solid transparent}.outline-0-m{outline:0}.ba-m{border-style:solid;border-width:1px}.bt-m{border-top-style:solid;border-top-width:1px}.br-m{border-right-style:solid;border-right-width:1px}.bb-m{border-bottom-style:solid;border-bottom-width:1px}.bl-m{border-left-style:solid;border-left-width:1px}.bn-m{border-style:none;border-width:0}.br0-m{border-radius:0}.br1-m{border-radius:.125rem}.br2-m{border-radius:.25rem}.br3-m{border-radius:.5rem}.br4-m{border-radius:1rem}.br-100-m{border-radius:100%}.br-pill-m{border-radius:9999px}.br--bottom-m{border-top-left-radius:0;border-top-right-radius:0}.br--top-m{border-bottom-right-radius:0}.br--right-m,.br--top-m{border-bottom-left-radius:0}.br--right-m{border-top-left-radius:0}.br--left-m{border-top-right-radius:0;border-bottom-right-radius:0}.b--dotted-m{border-style:dotted}.b--dashed-m{border-style:dashed}.b--solid-m{border-style:solid}.b--none-m{border-style:none}.bw0-m{border-width:0}.bw1-m{border-width:.125rem}.bw2-m{border-width:.25rem}.bw3-m{border-width:.5rem}.bw4-m{border-width:1rem}.bw5-m{border-width:2rem}.bt-0-m{border-top-width:0}.br-0-m{border-right-width:0}.bb-0-m{border-bottom-width:0}.bl-0-m{border-left-width:0}.shadow-1-m{box-shadow:0 0 4px 2px rgba(0,0,0,.2)}.shadow-2-m{box-shadow:0 0 8px 2px rgba(0,0,0,.2)}.shadow-3-m{box-shadow:2px 2px 4px 2px rgba(0,0,0,.2)}.shadow-4-m{box-shadow:2px 2px 8px 0 rgba(0,0,0,.2)}.shadow-5-m{box-shadow:4px 4px 8px 0 rgba(0,0,0,.2)}.top-0-m{top:0}.left-0-m{left:0}.right-0-m{right:0}.bottom-0-m{bottom:0}.top-1-m{top:1rem}.left-1-m{left:1rem}.right-1-m{right:1rem}.bottom-1-m{bottom:1rem}.top-2-m{top:2rem}.left-2-m{left:2rem}.right-2-m{right:2rem}.bottom-2-m{bottom:2rem}.top--1-m{top:-1rem}.right--1-m{right:-1rem}.bottom--1-m{bottom:-1rem}.left--1-m{left:-1rem}.top--2-m{top:-2rem}.right--2-m{right:-2rem}.bottom--2-m{bottom:-2rem}.left--2-m{left:-2rem}.absolute--fill-m{top:0;right:0;bottom:0;left:0}.cl-m{clear:left}.cr-m{clear:right}.cb-m{clear:both}.cn-m{clear:none}.dn-m{display:none}.di-m{display:inline}.db-m{display:block}.dib-m{display:inline-block}.dit-m{display:inline-table}.dt-m{display:table}.dtc-m{display:table-cell}.dt-row-m{display:table-row}.dt-row-group-m{display:table-row-group}.dt-column-m{display:table-column}.dt-column-group-m{display:table-column-group}.dt--fixed-m{table-layout:fixed;width:100%}.flex-m{display:-webkit-box;display:-ms-flexbox;display:flex}.inline-flex-m{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.flex-auto-m{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;min-width:0;min-height:0}.flex-none-m{-webkit-box-flex:0;-ms-flex:none;flex:none}.flex-column-m{-webkit-box-orient:vertical;-ms-flex-direction:column;flex-direction:column}.flex-column-m,.flex-row-m{-webkit-box-direction:normal}.flex-row-m{-webkit-box-orient:horizontal;-ms-flex-direction:row;flex-direction:row}.flex-wrap-m{-ms-flex-wrap:wrap;flex-wrap:wrap}.flex-nowrap-m{-ms-flex-wrap:nowrap;flex-wrap:nowrap}.flex-wrap-reverse-m{-ms-flex-wrap:wrap-reverse;flex-wrap:wrap-reverse}.flex-column-reverse-m{-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.flex-row-reverse-m{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.items-start-m{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.items-end-m{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.items-center-m{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.items-baseline-m{-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline}.items-stretch-m{-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch}.self-start-m{-ms-flex-item-align:start;align-self:flex-start}.self-end-m{-ms-flex-item-align:end;align-self:flex-end}.self-center-m{-ms-flex-item-align:center;-ms-grid-row-align:center;align-self:center}.self-baseline-m{-ms-flex-item-align:baseline;align-self:baseline}.self-stretch-m{-ms-flex-item-align:stretch;-ms-grid-row-align:stretch;align-self:stretch}.justify-start-m{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.justify-end-m{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.justify-center-m{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.justify-between-m{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.justify-around-m{-ms-flex-pack:distribute;justify-content:space-around}.content-start-m{-ms-flex-line-pack:start;align-content:flex-start}.content-end-m{-ms-flex-line-pack:end;align-content:flex-end}.content-center-m{-ms-flex-line-pack:center;align-content:center}.content-between-m{-ms-flex-line-pack:justify;align-content:space-between}.content-around-m{-ms-flex-line-pack:distribute;align-content:space-around}.content-stretch-m{-ms-flex-line-pack:stretch;align-content:stretch}.order-0-m{-webkit-box-ordinal-group:1;-ms-flex-order:0;order:0}.order-1-m{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.order-2-m{-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}.order-3-m{-webkit-box-ordinal-group:4;-ms-flex-order:3;order:3}.order-4-m{-webkit-box-ordinal-group:5;-ms-flex-order:4;order:4}.order-5-m{-webkit-box-ordinal-group:6;-ms-flex-order:5;order:5}.order-6-m{-webkit-box-ordinal-group:7;-ms-flex-order:6;order:6}.order-7-m{-webkit-box-ordinal-group:8;-ms-flex-order:7;order:7}.order-8-m{-webkit-box-ordinal-group:9;-ms-flex-order:8;order:8}.order-last-m{-webkit-box-ordinal-group:100000;-ms-flex-order:99999;order:99999}.fl-m{float:left}.fl-m,.fr-m{display:inline}.fr-m{float:right}.fn-m{float:none}.i-m{font-style:italic}.fs-normal-m{font-style:normal}.normal-m{font-weight:400}.b-m{font-weight:700}.fw1-m{font-weight:100}.fw2-m{font-weight:200}.fw3-m{font-weight:300}.fw4-m{font-weight:400}.fw5-m{font-weight:500}.fw6-m{font-weight:600}.fw7-m{font-weight:700}.fw8-m{font-weight:800}.fw9-m{font-weight:900}.h1-m{height:1rem}.h2-m{height:2rem}.h3-m{height:4rem}.h4-m{height:8rem}.h5-m{height:16rem}.h-25-m{height:25%}.h-50-m{height:50%}.h-75-m{height:75%}.h-100-m{height:100%}.min-h-100-m{min-height:100%}.vh-25-m{height:25vh}.vh-50-m{height:50vh}.vh-75-m{height:75vh}.vh-100-m{height:100vh}.min-vh-100-m{min-height:100vh}.h-auto-m{height:auto}.h-inherit-m{height:inherit}.tracked-m{letter-spacing:.1em}.tracked-tight-m{letter-spacing:-.05em}.tracked-mega-m{letter-spacing:.25em}.lh-solid-m{line-height:1}.lh-title-m{line-height:1.25}.lh-copy-m{line-height:1.5}.mw-100-m{max-width:100%}.mw1-m{max-width:1rem}.mw2-m{max-width:2rem}.mw3-m{max-width:4rem}.mw4-m{max-width:8rem}.mw5-m{max-width:16rem}.mw6-m{max-width:32rem}.mw7-m{max-width:48rem}.mw8-m{max-width:64rem}.mw9-m{max-width:96rem}.mw-none-m{max-width:none}.w1-m{width:1rem}.w2-m{width:2rem}.w3-m{width:4rem}.w4-m{width:8rem}.w5-m{width:16rem}.w-10-m{width:10%}.w-20-m{width:20%}.w-25-m{width:25%}.w-30-m{width:30%}.w-33-m{width:33%}.w-34-m{width:34%}.w-40-m{width:40%}.w-50-m{width:50%}.w-60-m{width:60%}.w-70-m{width:70%}.w-75-m{width:75%}.w-80-m{width:80%}.w-90-m{width:90%}.w-100-m{width:100%}.w-third-m{width:33.33333%}.w-two-thirds-m{width:66.66667%}.w-auto-m{width:auto}.overflow-visible-m{overflow:visible}.overflow-hidden-m{overflow:hidden}.overflow-scroll-m{overflow:scroll}.overflow-auto-m{overflow:auto}.overflow-x-visible-m{overflow-x:visible}.overflow-x-hidden-m{overflow-x:hidden}.overflow-x-scroll-m{overflow-x:scroll}.overflow-x-auto-m{overflow-x:auto}.overflow-y-visible-m{overflow-y:visible}.overflow-y-hidden-m{overflow-y:hidden}.overflow-y-scroll-m{overflow-y:scroll}.overflow-y-auto-m{overflow-y:auto}.static-m{position:static}.relative-m{position:relative}.absolute-m{position:absolute}.fixed-m{position:fixed}.rotate-45-m{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.rotate-90-m{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.rotate-135-m{-webkit-transform:rotate(135deg);transform:rotate(135deg)}.rotate-180-m{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.rotate-225-m{-webkit-transform:rotate(225deg);transform:rotate(225deg)}.rotate-270-m{-webkit-transform:rotate(270deg);transform:rotate(270deg)}.rotate-315-m{-webkit-transform:rotate(315deg);transform:rotate(315deg)}.pa0-m{padding:0}.pa1-m{padding:.25rem}.pa2-m{padding:.5rem}.pa3-m{padding:1rem}.pa4-m{padding:2rem}.pa5-m{padding:4rem}.pa6-m{padding:8rem}.pa7-m{padding:16rem}.pl0-m{padding-left:0}.pl1-m{padding-left:.25rem}.pl2-m{padding-left:.5rem}.pl3-m{padding-left:1rem}.pl4-m{padding-left:2rem}.pl5-m{padding-left:4rem}.pl6-m{padding-left:8rem}.pl7-m{padding-left:16rem}.pr0-m{padding-right:0}.pr1-m{padding-right:.25rem}.pr2-m{padding-right:.5rem}.pr3-m{padding-right:1rem}.pr4-m{padding-right:2rem}.pr5-m{padding-right:4rem}.pr6-m{padding-right:8rem}.pr7-m{padding-right:16rem}.pb0-m{padding-bottom:0}.pb1-m{padding-bottom:.25rem}.pb2-m{padding-bottom:.5rem}.pb3-m{padding-bottom:1rem}.pb4-m{padding-bottom:2rem}.pb5-m{padding-bottom:4rem}.pb6-m{padding-bottom:8rem}.pb7-m{padding-bottom:16rem}.pt0-m{padding-top:0}.pt1-m{padding-top:.25rem}.pt2-m{padding-top:.5rem}.pt3-m{padding-top:1rem}.pt4-m{padding-top:2rem}.pt5-m{padding-top:4rem}.pt6-m{padding-top:8rem}.pt7-m{padding-top:16rem}.pv0-m{padding-top:0;padding-bottom:0}.pv1-m{padding-top:.25rem;padding-bottom:.25rem}.pv2-m{padding-top:.5rem;padding-bottom:.5rem}.pv3-m{padding-top:1rem;padding-bottom:1rem}.pv4-m{padding-top:2rem;padding-bottom:2rem}.pv5-m{padding-top:4rem;padding-bottom:4rem}.pv6-m{padding-top:8rem;padding-bottom:8rem}.pv7-m{padding-top:16rem;padding-bottom:16rem}.ph0-m{padding-left:0;padding-right:0}.ph1-m{padding-left:.25rem;padding-right:.25rem}.ph2-m{padding-left:.5rem;padding-right:.5rem}.ph3-m{padding-left:1rem;padding-right:1rem}.ph4-m{padding-left:2rem;padding-right:2rem}.ph5-m{padding-left:4rem;padding-right:4rem}.ph6-m{padding-left:8rem;padding-right:8rem}.ph7-m{padding-left:16rem;padding-right:16rem}.ma0-m{margin:0}.ma1-m{margin:.25rem}.ma2-m{margin:.5rem}.ma3-m{margin:1rem}.ma4-m{margin:2rem}.ma5-m{margin:4rem}.ma6-m{margin:8rem}.ma7-m{margin:16rem}.ml0-m{margin-left:0}.ml1-m{margin-left:.25rem}.ml2-m{margin-left:.5rem}.ml3-m{margin-left:1rem}.ml4-m{margin-left:2rem}.ml5-m{margin-left:4rem}.ml6-m{margin-left:8rem}.ml7-m{margin-left:16rem}.mr0-m{margin-right:0}.mr1-m{margin-right:.25rem}.mr2-m{margin-right:.5rem}.mr3-m{margin-right:1rem}.mr4-m{margin-right:2rem}.mr5-m{margin-right:4rem}.mr6-m{margin-right:8rem}.mr7-m{margin-right:16rem}.mb0-m{margin-bottom:0}.mb1-m{margin-bottom:.25rem}.mb2-m{margin-bottom:.5rem}.mb3-m{margin-bottom:1rem}.mb4-m{margin-bottom:2rem}.mb5-m{margin-bottom:4rem}.mb6-m{margin-bottom:8rem}.mb7-m{margin-bottom:16rem}.mt0-m{margin-top:0}.mt1-m{margin-top:.25rem}.mt2-m{margin-top:.5rem}.mt3-m{margin-top:1rem}.mt4-m{margin-top:2rem}.mt5-m{margin-top:4rem}.mt6-m{margin-top:8rem}.mt7-m{margin-top:16rem}.mv0-m{margin-top:0;margin-bottom:0}.mv1-m{margin-top:.25rem;margin-bottom:.25rem}.mv2-m{margin-top:.5rem;margin-bottom:.5rem}.mv3-m{margin-top:1rem;margin-bottom:1rem}.mv4-m{margin-top:2rem;margin-bottom:2rem}.mv5-m{margin-top:4rem;margin-bottom:4rem}.mv6-m{margin-top:8rem;margin-bottom:8rem}.mv7-m{margin-top:16rem;margin-bottom:16rem}.mh0-m{margin-left:0;margin-right:0}.mh1-m{margin-left:.25rem;margin-right:.25rem}.mh2-m{margin-left:.5rem;margin-right:.5rem}.mh3-m{margin-left:1rem;margin-right:1rem}.mh4-m{margin-left:2rem;margin-right:2rem}.mh5-m{margin-left:4rem;margin-right:4rem}.mh6-m{margin-left:8rem;margin-right:8rem}.mh7-m{margin-left:16rem;margin-right:16rem}.na1-m{margin:-.25rem}.na2-m{margin:-.5rem}.na3-m{margin:-1rem}.na4-m{margin:-2rem}.na5-m{margin:-4rem}.na6-m{margin:-8rem}.na7-m{margin:-16rem}.nl1-m{margin-left:-.25rem}.nl2-m{margin-left:-.5rem}.nl3-m{margin-left:-1rem}.nl4-m{margin-left:-2rem}.nl5-m{margin-left:-4rem}.nl6-m{margin-left:-8rem}.nl7-m{margin-left:-16rem}.nr1-m{margin-right:-.25rem}.nr2-m{margin-right:-.5rem}.nr3-m{margin-right:-1rem}.nr4-m{margin-right:-2rem}.nr5-m{margin-right:-4rem}.nr6-m{margin-right:-8rem}.nr7-m{margin-right:-16rem}.nb1-m{margin-bottom:-.25rem}.nb2-m{margin-bottom:-.5rem}.nb3-m{margin-bottom:-1rem}.nb4-m{margin-bottom:-2rem}.nb5-m{margin-bottom:-4rem}.nb6-m{margin-bottom:-8rem}.nb7-m{margin-bottom:-16rem}.nt1-m{margin-top:-.25rem}.nt2-m{margin-top:-.5rem}.nt3-m{margin-top:-1rem}.nt4-m{margin-top:-2rem}.nt5-m{margin-top:-4rem}.nt6-m{margin-top:-8rem}.nt7-m{margin-top:-16rem}.strike-m{text-decoration:line-through}.underline-m{text-decoration:underline}.no-underline-m{text-decoration:none}.tl-m{text-align:left}.tr-m{text-align:right}.tc-m{text-align:center}.tj-m{text-align:justify}.ttc-m{text-transform:capitalize}.ttl-m{text-transform:lowercase}.ttu-m{text-transform:uppercase}.ttn-m{text-transform:none}.f-6-m,.f-headline-m{font-size:6rem}.f-5-m,.f-subheadline-m{font-size:5rem}.f1-m{font-size:3rem}.f2-m{font-size:2.25rem}.f3-m{font-size:1.5rem}.f4-m{font-size:1.25rem}.f5-m{font-size:1rem}.f6-m{font-size:.875rem}.f7-m{font-size:.75rem}.measure-m{max-width:30em}.measure-wide-m{max-width:34em}.measure-narrow-m{max-width:20em}.indent-m{text-indent:1em;margin-top:0;margin-bottom:0}.small-caps-m{font-variant:small-caps}.truncate-m{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.center-m{margin-left:auto}.center-m,.mr-auto-m{margin-right:auto}.ml-auto-m{margin-left:auto}.clip-m{position:fixed!important;position:absolute!important;clip:rect(1px 1px 1px 1px);clip:rect(1px,1px,1px,1px)}.ws-normal-m{white-space:normal}.nowrap-m{white-space:nowrap}.pre-m{white-space:pre}.v-base-m{vertical-align:baseline}.v-mid-m{vertical-align:middle}.v-top-m{vertical-align:top}.v-btm-m{vertical-align:bottom}}@media screen and (min-width:60em){.aspect-ratio-l{height:0;position:relative}.aspect-ratio--16x9-l{padding-bottom:56.25%}.aspect-ratio--9x16-l{padding-bottom:177.77%}.aspect-ratio--4x3-l{padding-bottom:75%}.aspect-ratio--3x4-l{padding-bottom:133.33%}.aspect-ratio--6x4-l{padding-bottom:66.6%}.aspect-ratio--4x6-l{padding-bottom:150%}.aspect-ratio--8x5-l{padding-bottom:62.5%}.aspect-ratio--5x8-l{padding-bottom:160%}.aspect-ratio--7x5-l{padding-bottom:71.42%}.aspect-ratio--5x7-l{padding-bottom:140%}.aspect-ratio--1x1-l{padding-bottom:100%}.aspect-ratio--object-l{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:100}.cover-l{background-size:cover!important}.contain-l{background-size:contain!important}.bg-center-l{background-position:50%}.bg-center-l,.bg-top-l{background-repeat:no-repeat}.bg-top-l{background-position:top}.bg-right-l{background-position:100%}.bg-bottom-l,.bg-right-l{background-repeat:no-repeat}.bg-bottom-l{background-position:bottom}.bg-left-l{background-repeat:no-repeat;background-position:0}.outline-l{outline:1px solid}.outline-transparent-l{outline:1px solid transparent}.outline-0-l{outline:0}.ba-l{border-style:solid;border-width:1px}.bt-l{border-top-style:solid;border-top-width:1px}.br-l{border-right-style:solid;border-right-width:1px}.bb-l{border-bottom-style:solid;border-bottom-width:1px}.bl-l{border-left-style:solid;border-left-width:1px}.bn-l{border-style:none;border-width:0}.br0-l{border-radius:0}.br1-l{border-radius:.125rem}.br2-l{border-radius:.25rem}.br3-l{border-radius:.5rem}.br4-l{border-radius:1rem}.br-100-l{border-radius:100%}.br-pill-l{border-radius:9999px}.br--bottom-l{border-top-left-radius:0;border-top-right-radius:0}.br--top-l{border-bottom-right-radius:0}.br--right-l,.br--top-l{border-bottom-left-radius:0}.br--right-l{border-top-left-radius:0}.br--left-l{border-top-right-radius:0;border-bottom-right-radius:0}.b--dotted-l{border-style:dotted}.b--dashed-l{border-style:dashed}.b--solid-l{border-style:solid}.b--none-l{border-style:none}.bw0-l{border-width:0}.bw1-l{border-width:.125rem}.bw2-l{border-width:.25rem}.bw3-l{border-width:.5rem}.bw4-l{border-width:1rem}.bw5-l{border-width:2rem}.bt-0-l{border-top-width:0}.br-0-l{border-right-width:0}.bb-0-l{border-bottom-width:0}.bl-0-l{border-left-width:0}.shadow-1-l{box-shadow:0 0 4px 2px rgba(0,0,0,.2)}.shadow-2-l{box-shadow:0 0 8px 2px rgba(0,0,0,.2)}.shadow-3-l{box-shadow:2px 2px 4px 2px rgba(0,0,0,.2)}.shadow-4-l{box-shadow:2px 2px 8px 0 rgba(0,0,0,.2)}.shadow-5-l{box-shadow:4px 4px 8px 0 rgba(0,0,0,.2)}.top-0-l{top:0}.left-0-l{left:0}.right-0-l{right:0}.bottom-0-l{bottom:0}.top-1-l{top:1rem}.left-1-l{left:1rem}.right-1-l{right:1rem}.bottom-1-l{bottom:1rem}.top-2-l{top:2rem}.left-2-l{left:2rem}.right-2-l{right:2rem}.bottom-2-l{bottom:2rem}.top--1-l{top:-1rem}.right--1-l{right:-1rem}.bottom--1-l{bottom:-1rem}.left--1-l{left:-1rem}.top--2-l{top:-2rem}.right--2-l{right:-2rem}.bottom--2-l{bottom:-2rem}.left--2-l{left:-2rem}.absolute--fill-l{top:0;right:0;bottom:0;left:0}.cl-l{clear:left}.cr-l{clear:right}.cb-l{clear:both}.cn-l{clear:none}.dn-l{display:none}.di-l{display:inline}.db-l{display:block}.dib-l{display:inline-block}.dit-l{display:inline-table}.dt-l{display:table}.dtc-l{display:table-cell}.dt-row-l{display:table-row}.dt-row-group-l{display:table-row-group}.dt-column-l{display:table-column}.dt-column-group-l{display:table-column-group}.dt--fixed-l{table-layout:fixed;width:100%}.flex-l{display:-webkit-box;display:-ms-flexbox;display:flex}.inline-flex-l{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.flex-auto-l{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;min-width:0;min-height:0}.flex-none-l{-webkit-box-flex:0;-ms-flex:none;flex:none}.flex-column-l{-webkit-box-orient:vertical;-ms-flex-direction:column;flex-direction:column}.flex-column-l,.flex-row-l{-webkit-box-direction:normal}.flex-row-l{-webkit-box-orient:horizontal;-ms-flex-direction:row;flex-direction:row}.flex-wrap-l{-ms-flex-wrap:wrap;flex-wrap:wrap}.flex-nowrap-l{-ms-flex-wrap:nowrap;flex-wrap:nowrap}.flex-wrap-reverse-l{-ms-flex-wrap:wrap-reverse;flex-wrap:wrap-reverse}.flex-column-reverse-l{-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.flex-row-reverse-l{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.items-start-l{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.items-end-l{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.items-center-l{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.items-baseline-l{-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline}.items-stretch-l{-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch}.self-start-l{-ms-flex-item-align:start;align-self:flex-start}.self-end-l{-ms-flex-item-align:end;align-self:flex-end}.self-center-l{-ms-flex-item-align:center;-ms-grid-row-align:center;align-self:center}.self-baseline-l{-ms-flex-item-align:baseline;align-self:baseline}.self-stretch-l{-ms-flex-item-align:stretch;-ms-grid-row-align:stretch;align-self:stretch}.justify-start-l{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.justify-end-l{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.justify-center-l{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.justify-between-l{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.justify-around-l{-ms-flex-pack:distribute;justify-content:space-around}.content-start-l{-ms-flex-line-pack:start;align-content:flex-start}.content-end-l{-ms-flex-line-pack:end;align-content:flex-end}.content-center-l{-ms-flex-line-pack:center;align-content:center}.content-between-l{-ms-flex-line-pack:justify;align-content:space-between}.content-around-l{-ms-flex-line-pack:distribute;align-content:space-around}.content-stretch-l{-ms-flex-line-pack:stretch;align-content:stretch}.order-0-l{-webkit-box-ordinal-group:1;-ms-flex-order:0;order:0}.order-1-l{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.order-2-l{-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}.order-3-l{-webkit-box-ordinal-group:4;-ms-flex-order:3;order:3}.order-4-l{-webkit-box-ordinal-group:5;-ms-flex-order:4;order:4}.order-5-l{-webkit-box-ordinal-group:6;-ms-flex-order:5;order:5}.order-6-l{-webkit-box-ordinal-group:7;-ms-flex-order:6;order:6}.order-7-l{-webkit-box-ordinal-group:8;-ms-flex-order:7;order:7}.order-8-l{-webkit-box-ordinal-group:9;-ms-flex-order:8;order:8}.order-last-l{-webkit-box-ordinal-group:100000;-ms-flex-order:99999;order:99999}.fl-l{float:left}.fl-l,.fr-l{display:inline}.fr-l{float:right}.fn-l{float:none}.i-l{font-style:italic}.fs-normal-l{font-style:normal}.normal-l{font-weight:400}.b-l{font-weight:700}.fw1-l{font-weight:100}.fw2-l{font-weight:200}.fw3-l{font-weight:300}.fw4-l{font-weight:400}.fw5-l{font-weight:500}.fw6-l{font-weight:600}.fw7-l{font-weight:700}.fw8-l{font-weight:800}.fw9-l{font-weight:900}.h1-l{height:1rem}.h2-l{height:2rem}.h3-l{height:4rem}.h4-l{height:8rem}.h5-l{height:16rem}.h-25-l{height:25%}.h-50-l{height:50%}.h-75-l{height:75%}.h-100-l{height:100%}.min-h-100-l{min-height:100%}.vh-25-l{height:25vh}.vh-50-l{height:50vh}.vh-75-l{height:75vh}.vh-100-l{height:100vh}.min-vh-100-l{min-height:100vh}.h-auto-l{height:auto}.h-inherit-l{height:inherit}.tracked-l{letter-spacing:.1em}.tracked-tight-l{letter-spacing:-.05em}.tracked-mega-l{letter-spacing:.25em}.lh-solid-l{line-height:1}.lh-title-l{line-height:1.25}.lh-copy-l{line-height:1.5}.mw-100-l{max-width:100%}.mw1-l{max-width:1rem}.mw2-l{max-width:2rem}.mw3-l{max-width:4rem}.mw4-l{max-width:8rem}.mw5-l{max-width:16rem}.mw6-l{max-width:32rem}.mw7-l{max-width:48rem}.mw8-l{max-width:64rem}.mw9-l{max-width:96rem}.mw-none-l{max-width:none}.w1-l{width:1rem}.w2-l{width:2rem}.w3-l{width:4rem}.w4-l{width:8rem}.w5-l{width:16rem}.w-10-l{width:10%}.w-20-l{width:20%}.w-25-l{width:25%}.w-30-l{width:30%}.w-33-l{width:33%}.w-34-l{width:34%}.w-40-l{width:40%}.w-50-l{width:50%}.w-60-l{width:60%}.w-70-l{width:70%}.w-75-l{width:75%}.w-80-l{width:80%}.w-90-l{width:90%}.w-100-l{width:100%}.w-third-l{width:33.33333%}.w-two-thirds-l{width:66.66667%}.w-auto-l{width:auto}.overflow-visible-l{overflow:visible}.overflow-hidden-l{overflow:hidden}.overflow-scroll-l{overflow:scroll}.overflow-auto-l{overflow:auto}.overflow-x-visible-l{overflow-x:visible}.overflow-x-hidden-l{overflow-x:hidden}.overflow-x-scroll-l{overflow-x:scroll}.overflow-x-auto-l{overflow-x:auto}.overflow-y-visible-l{overflow-y:visible}.overflow-y-hidden-l{overflow-y:hidden}.overflow-y-scroll-l{overflow-y:scroll}.overflow-y-auto-l{overflow-y:auto}.static-l{position:static}.relative-l{position:relative}.absolute-l{position:absolute}.fixed-l{position:fixed}.rotate-45-l{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.rotate-90-l{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.rotate-135-l{-webkit-transform:rotate(135deg);transform:rotate(135deg)}.rotate-180-l{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.rotate-225-l{-webkit-transform:rotate(225deg);transform:rotate(225deg)}.rotate-270-l{-webkit-transform:rotate(270deg);transform:rotate(270deg)}.rotate-315-l{-webkit-transform:rotate(315deg);transform:rotate(315deg)}.pa0-l{padding:0}.pa1-l{padding:.25rem}.pa2-l{padding:.5rem}.pa3-l{padding:1rem}.pa4-l{padding:2rem}.pa5-l{padding:4rem}.pa6-l{padding:8rem}.pa7-l{padding:16rem}.pl0-l{padding-left:0}.pl1-l{padding-left:.25rem}.pl2-l{padding-left:.5rem}.pl3-l{padding-left:1rem}.pl4-l{padding-left:2rem}.pl5-l{padding-left:4rem}.pl6-l{padding-left:8rem}.pl7-l{padding-left:16rem}.pr0-l{padding-right:0}.pr1-l{padding-right:.25rem}.pr2-l{padding-right:.5rem}.pr3-l{padding-right:1rem}.pr4-l{padding-right:2rem}.pr5-l{padding-right:4rem}.pr6-l{padding-right:8rem}.pr7-l{padding-right:16rem}.pb0-l{padding-bottom:0}.pb1-l{padding-bottom:.25rem}.pb2-l{padding-bottom:.5rem}.pb3-l{padding-bottom:1rem}.pb4-l{padding-bottom:2rem}.pb5-l{padding-bottom:4rem}.pb6-l{padding-bottom:8rem}.pb7-l{padding-bottom:16rem}.pt0-l{padding-top:0}.pt1-l{padding-top:.25rem}.pt2-l{padding-top:.5rem}.pt3-l{padding-top:1rem}.pt4-l{padding-top:2rem}.pt5-l{padding-top:4rem}.pt6-l{padding-top:8rem}.pt7-l{padding-top:16rem}.pv0-l{padding-top:0;padding-bottom:0}.pv1-l{padding-top:.25rem;padding-bottom:.25rem}.pv2-l{padding-top:.5rem;padding-bottom:.5rem}.pv3-l{padding-top:1rem;padding-bottom:1rem}.pv4-l{padding-top:2rem;padding-bottom:2rem}.pv5-l{padding-top:4rem;padding-bottom:4rem}.pv6-l{padding-top:8rem;padding-bottom:8rem}.pv7-l{padding-top:16rem;padding-bottom:16rem}.ph0-l{padding-left:0;padding-right:0}.ph1-l{padding-left:.25rem;padding-right:.25rem}.ph2-l{padding-left:.5rem;padding-right:.5rem}.ph3-l{padding-left:1rem;padding-right:1rem}.ph4-l{padding-left:2rem;padding-right:2rem}.ph5-l{padding-left:4rem;padding-right:4rem}.ph6-l{padding-left:8rem;padding-right:8rem}.ph7-l{padding-left:16rem;padding-right:16rem}.ma0-l{margin:0}.ma1-l{margin:.25rem}.ma2-l{margin:.5rem}.ma3-l{margin:1rem}.ma4-l{margin:2rem}.ma5-l{margin:4rem}.ma6-l{margin:8rem}.ma7-l{margin:16rem}.ml0-l{margin-left:0}.ml1-l{margin-left:.25rem}.ml2-l{margin-left:.5rem}.ml3-l{margin-left:1rem}.ml4-l{margin-left:2rem}.ml5-l{margin-left:4rem}.ml6-l{margin-left:8rem}.ml7-l{margin-left:16rem}.mr0-l{margin-right:0}.mr1-l{margin-right:.25rem}.mr2-l{margin-right:.5rem}.mr3-l{margin-right:1rem}.mr4-l{margin-right:2rem}.mr5-l{margin-right:4rem}.mr6-l{margin-right:8rem}.mr7-l{margin-right:16rem}.mb0-l{margin-bottom:0}.mb1-l{margin-bottom:.25rem}.mb2-l{margin-bottom:.5rem}.mb3-l{margin-bottom:1rem}.mb4-l{margin-bottom:2rem}.mb5-l{margin-bottom:4rem}.mb6-l{margin-bottom:8rem}.mb7-l{margin-bottom:16rem}.mt0-l{margin-top:0}.mt1-l{margin-top:.25rem}.mt2-l{margin-top:.5rem}.mt3-l{margin-top:1rem}.mt4-l{margin-top:2rem}.mt5-l{margin-top:4rem}.mt6-l{margin-top:8rem}.mt7-l{margin-top:16rem}.mv0-l{margin-top:0;margin-bottom:0}.mv1-l{margin-top:.25rem;margin-bottom:.25rem}.mv2-l{margin-top:.5rem;margin-bottom:.5rem}.mv3-l{margin-top:1rem;margin-bottom:1rem}.mv4-l{margin-top:2rem;margin-bottom:2rem}.mv5-l{margin-top:4rem;margin-bottom:4rem}.mv6-l{margin-top:8rem;margin-bottom:8rem}.mv7-l{margin-top:16rem;margin-bottom:16rem}.mh0-l{margin-left:0;margin-right:0}.mh1-l{margin-left:.25rem;margin-right:.25rem}.mh2-l{margin-left:.5rem;margin-right:.5rem}.mh3-l{margin-left:1rem;margin-right:1rem}.mh4-l{margin-left:2rem;margin-right:2rem}.mh5-l{margin-left:4rem;margin-right:4rem}.mh6-l{margin-left:8rem;margin-right:8rem}.mh7-l{margin-left:16rem;margin-right:16rem}.na1-l{margin:-.25rem}.na2-l{margin:-.5rem}.na3-l{margin:-1rem}.na4-l{margin:-2rem}.na5-l{margin:-4rem}.na6-l{margin:-8rem}.na7-l{margin:-16rem}.nl1-l{margin-left:-.25rem}.nl2-l{margin-left:-.5rem}.nl3-l{margin-left:-1rem}.nl4-l{margin-left:-2rem}.nl5-l{margin-left:-4rem}.nl6-l{margin-left:-8rem}.nl7-l{margin-left:-16rem}.nr1-l{margin-right:-.25rem}.nr2-l{margin-right:-.5rem}.nr3-l{margin-right:-1rem}.nr4-l{margin-right:-2rem}.nr5-l{margin-right:-4rem}.nr6-l{margin-right:-8rem}.nr7-l{margin-right:-16rem}.nb1-l{margin-bottom:-.25rem}.nb2-l{margin-bottom:-.5rem}.nb3-l{margin-bottom:-1rem}.nb4-l{margin-bottom:-2rem}.nb5-l{margin-bottom:-4rem}.nb6-l{margin-bottom:-8rem}.nb7-l{margin-bottom:-16rem}.nt1-l{margin-top:-.25rem}.nt2-l{margin-top:-.5rem}.nt3-l{margin-top:-1rem}.nt4-l{margin-top:-2rem}.nt5-l{margin-top:-4rem}.nt6-l{margin-top:-8rem}.nt7-l{margin-top:-16rem}.strike-l{text-decoration:line-through}.underline-l{text-decoration:underline}.no-underline-l{text-decoration:none}.tl-l{text-align:left}.tr-l{text-align:right}.tc-l{text-align:center}.tj-l{text-align:justify}.ttc-l{text-transform:capitalize}.ttl-l{text-transform:lowercase}.ttu-l{text-transform:uppercase}.ttn-l{text-transform:none}.f-6-l,.f-headline-l{font-size:6rem}.f-5-l,.f-subheadline-l{font-size:5rem}.f1-l{font-size:3rem}.f2-l{font-size:2.25rem}.f3-l{font-size:1.5rem}.f4-l{font-size:1.25rem}.f5-l{font-size:1rem}.f6-l{font-size:.875rem}.f7-l{font-size:.75rem}.measure-l{max-width:30em}.measure-wide-l{max-width:34em}.measure-narrow-l{max-width:20em}.indent-l{text-indent:1em;margin-top:0;margin-bottom:0}.small-caps-l{font-variant:small-caps}.truncate-l{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.center-l{margin-left:auto}.center-l,.mr-auto-l{margin-right:auto}.ml-auto-l{margin-left:auto}.clip-l{position:fixed!important;position:absolute!important;clip:rect(1px 1px 1px 1px);clip:rect(1px,1px,1px,1px)}.ws-normal-l{white-space:normal}.nowrap-l{white-space:nowrap}.pre-l{white-space:pre}.v-base-l{vertical-align:baseline}.v-mid-l{vertical-align:middle}.v-top-l{vertical-align:top}.v-btm-l{vertical-align:bottom}} diff --git a/docs/debug-grid/index.html b/docs/debug-grid/index.html index 14c4ca273..e435e4d36 100644 --- a/docs/debug-grid/index.html +++ b/docs/debug-grid/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -121,7 +121,7 @@

    Debug Grid

    color outline. The purpose of this is to help distinguish elements that are close together by giving them different colors. This has been helpful at times when the outlines are overlapping by 1 or 2 - pixels and it's hard to tell where one element ends and the other + pixels and it’s hard to tell where one element ends and the other begins.

    @@ -181,7 +181,7 @@

    Image Title

    Previous

    - Debug + Debug
    @@ -112,7 +112,7 @@

    Debug

    Tachyons comes with two convenient modules to help debug layout issues you might be having.

    - The debug_children module allows you to use a class called "debug" on + The debug_children module allows you to use a class called “debug” on any element. That element along with any child node will have an outline of 1px solid gold placed on it.

    @@ -123,7 +123,7 @@

    Debug

    color outline. The purpose of this is to help distinguish elements that are close together by giving them different colors. This has been helpful at times when the outlines are overlapping by 1 or 2 - pixels and it's hard to tell where one element ends and the other + pixels and it’s hard to tell where one element ends and the other begins.

    @@ -340,7 +340,7 @@

    Reference

    tachyons-debug

    - v1.1.10 + v1.1.11 902 B
    @@ -646,7 +646,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -657,7 +657,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/elements/forms/index.html b/docs/elements/forms/index.html index 61ebd3fd8..b88519d0f 100644 --- a/docs/elements/forms/index.html +++ b/docs/elements/forms/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -104,7 +104,7 @@

    Reference

    tachyons-forms

    - v3.1.3 + v3.1.4 110 B
    @@ -278,7 +278,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -289,7 +289,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/elements/images/index.html b/docs/elements/images/index.html index 33cbc1de6..dd9cc43f3 100644 --- a/docs/elements/images/index.html +++ b/docs/elements/images/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -78,7 +78,7 @@

    Images

    Examples

    Image

    - This photo is more than 3000 pixels wide. The width is set to 100% to ensure it doesn't bleed off the viewport and always fills its container. In some situations, this will make the image stretch to be larger than its actual width. To avoid the image stretching past its width, set max-width instead. + This photo is more than 3000 pixels wide. The width is set to 100% to ensure it doesn’t bleed off the viewport and always fills its container. In some situations, this will make the image stretch to be larger than its actual width. To avoid the image stretching past its width, set max-width instead.

    <img src="http://tachyons.io/img/over-canvas.jpg" class="w-100" alt="night sky over land"> night sky over land @@ -233,7 +233,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -244,7 +244,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/elements/links/index.html b/docs/elements/links/index.html index 32354ac5f..8ffdfc9e7 100644 --- a/docs/elements/links/index.html +++ b/docs/elements/links/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -74,7 +74,7 @@

    Links

    - Tachyons doesn't style links by default, but provides the necessary classes to + Tachyons doesn’t style links by default, but provides the necessary classes to generate a wide variety of link styles.

    @@ -331,7 +331,7 @@

    Reference

    tachyons-links

    - v3.0.9 + v3.0.11 111 B
    @@ -518,7 +518,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -529,7 +529,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/elements/lists/index.html b/docs/elements/lists/index.html index 2a2cb4e4a..37aca5229 100644 --- a/docs/elements/lists/index.html +++ b/docs/elements/lists/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -112,7 +112,7 @@

    Reference

    tachyons-lists

    - v2.0.12 + v2.0.13 46 B
    @@ -278,7 +278,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -289,7 +289,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/elements/tables/index.html b/docs/elements/tables/index.html index 607b30847..3c69a8e60 100644 --- a/docs/elements/tables/index.html +++ b/docs/elements/tables/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -116,7 +116,7 @@

    Reference

    tachyons-tables

    - v1.0.7 + v1.0.8 142 B
    @@ -309,7 +309,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -320,7 +320,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/index.html b/docs/index.html index 074b977be..b5c7c4657 100644 --- a/docs/index.html +++ b/docs/index.html @@ -31,7 +31,7 @@
    Tachyons
    - v4.9.0 + v4.12.0
    @@ -194,7 +194,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -205,7 +205,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/layout/box-sizing/index.html b/docs/layout/box-sizing/index.html index 81805c745..c91410eed 100644 --- a/docs/layout/box-sizing/index.html +++ b/docs/layout/box-sizing/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -112,8 +112,8 @@

    Box Sizing

    The box model has been known to trip up a few people. This module should make things a bit easier.

    - While many people make fun of Microsoft's 'Internet Explorer' browser - the one thing that most css authors - agree on is that it's the most favorable box model. Fortunately the box-sizing property is well supported + While many people make fun of Microsoft’s ‘Internet Explorer’ browser - the one thing that most css authors + agree on is that it’s the most favorable box model. Fortunately the box-sizing property is well supported now so we can fix the atrocity that is the box model that chrome, firefox, safari, and others have implemented in modern browsers.

    @@ -157,8 +157,8 @@

    Reference

    tachyons-box-sizing

    - v3.2.1 - 185 B + v3.2.2 + 206 B
    Declarations
    @@ -166,7 +166,7 @@

    tachyons-box-sizing

    Selectors
    -
    35
    +
    40
    Max. Specificity Score
    @@ -358,7 +358,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -369,7 +369,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/layout/clearfix/index.html b/docs/layout/clearfix/index.html index 51e82534e..beba55ce5 100644 --- a/docs/layout/clearfix/index.html +++ b/docs/layout/clearfix/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -121,7 +121,7 @@

    Cleared Floats

    This example shows two floated elements wrapped in an element with a 4px solid red border. In the top version where the floats are cleared, the red element wraps around the elements. In the second example - the parent element is collapsed and the two floated elements sit outside of it. - It should be noted you don't have to clear floated elements that are inside another floated element. + It should be noted you don’t have to clear floated elements that are inside another floated element.

    @@ -322,7 +322,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -333,7 +333,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/layout/display/index.html b/docs/layout/display/index.html index a2e7cb3da..21f48d629 100644 --- a/docs/layout/display/index.html +++ b/docs/layout/display/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -127,7 +127,7 @@

    Display Block

    <span class="db"></span> -

    Block will inherently set width to 100% of its parent element. It will also cause a line break, even if the declared width doesn't take up the full width of the parent.

    +

    Block will inherently set width to 100% of its parent element. It will also cause a line break, even if the declared width doesn’t take up the full width of the parent.

    block
    @@ -166,7 +166,7 @@

    Display Inline

    <div class="di"></div>

    - Set content inline. Inline doesn't respect height or width values. It does not render white space between elements. + Set content inline. Inline doesn’t respect height or width values. It does not render white space between elements.

    display: inline @@ -242,7 +242,7 @@

    Reference

    tachyons-display

    - v5.0.4 + v5.0.5 305 B
    @@ -504,7 +504,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -515,7 +515,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/layout/flexbox/index.html b/docs/layout/flexbox/index.html index 0b6e93cc1..7b3ce69ea 100644 --- a/docs/layout/flexbox/index.html +++ b/docs/layout/flexbox/index.html @@ -34,7 +34,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -719,19 +719,19 @@

    Reference

    tachyons-flexbox

    - v2.1.0 - 1.36 KB + v2.1.1 + 939 B
    Declarations
    - 513 + 192
    Selectors
    - 190 + 184
    @@ -743,7 +743,7 @@

    tachyons-flexbox

    Size of Avg. Rule
    - 2.7433155080213902 + 1.0434782608695652
    @@ -1111,7 +1111,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1122,7 +1122,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/layout/floats/index.html b/docs/layout/floats/index.html index 9fb47ba86..27ccbfd2c 100644 --- a/docs/layout/floats/index.html +++ b/docs/layout/floats/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -113,7 +113,7 @@

    Floats

    Floats may be set on any element, but it will only affect elements - that aren't absolutely positioned. When you float an element + that aren’t absolutely positioned. When you float an element you inherently set its display to block.

    @@ -163,7 +163,7 @@

    Reference

    tachyons-floats

    - v3.0.4 + v3.0.5 176 B
    @@ -370,7 +370,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -381,7 +381,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/layout/grid/index.html b/docs/layout/grid/index.html index b7dab0ec3..fde3d0354 100644 --- a/docs/layout/grid/index.html +++ b/docs/layout/grid/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -553,7 +553,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -564,7 +564,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/layout/heights/index.html b/docs/layout/heights/index.html index f7b2e7ae2..aafae52ca 100644 --- a/docs/layout/heights/index.html +++ b/docs/layout/heights/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -216,7 +216,7 @@

    Reference

    tachyons-heights

    - v6.1.3 + v6.1.4 342 B
    @@ -498,7 +498,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -509,7 +509,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/layout/max-widths/index.html b/docs/layout/max-widths/index.html index 62d4e1743..2b62f2f64 100644 --- a/docs/layout/max-widths/index.html +++ b/docs/layout/max-widths/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -115,7 +115,7 @@

    Max Widths

    Max - widths can be combined with widths to ensure that your content doesn't get too + widths can be combined with widths to ensure that your content doesn’t get too wide on larger monitors. Max-widths can also help keep embedded media within the canvas. As they are fluid across ranges of screen widths, max-widths are extremely useful when trying to keep a design @@ -281,7 +281,7 @@

    Reference

    tachyons-max-widths

    - v4.0.4 + v4.0.6 249 B
    @@ -537,7 +537,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -548,7 +548,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/layout/position/index.html b/docs/layout/position/index.html index d3ef759b6..e8b346aea 100644 --- a/docs/layout/position/index.html +++ b/docs/layout/position/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -126,7 +126,7 @@

    Position

    If you do find it useful you could easily extend the position module to include this option. It should be noted that sticky is not well supported at the moment. If the provided - coordinates don't suit your needs the module is easy to extend to add any + coordinates don’t suit your needs the module is easy to extend to add any values you might need.

    @@ -138,7 +138,7 @@

    Position Static

    Position Relative

    -

    This is relatively positioned content that doesn't affect the position of other elements which is why the text overlaps with the content that is set to position static.

    +

    This is relatively positioned content that doesn’t affect the position of other elements which is why the text overlaps with the content that is set to position static.

    @@ -159,7 +159,7 @@

    Position Relative + Absolute

    - This is an absolutely positioned element set to have offsets of top and left to 1rem with right and bottom offset by 2rem. It's parent with the light gray background is set to position relative. + This is an absolutely positioned element set to have offsets of top and left to 1rem with right and bottom offset by 2rem. It’s parent with the light gray background is set to position relative.

    @@ -193,7 +193,7 @@

    Reference

    tachyons-position

    - v6.0.4 + v6.0.7 169 B
    @@ -526,7 +526,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -537,7 +537,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/layout/spacing/index.html b/docs/layout/spacing/index.html index a45caf434..ed1f76149 100644 --- a/docs/layout/spacing/index.html +++ b/docs/layout/spacing/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -113,16 +113,16 @@

    Spacing

    Good design is based on math. Certain patterns and ratios are so -prevelant in nature and music that they can't be denied as elegant design +prevelant in nature and music that they can’t be denied as elegant design solutions. Even in the 18th century, pages in books were designed with ratios. In the 21st century, we have gotten away from this on the web, often using -magic numbers to match a 'spec' that has been produced in a graphics program +magic numbers to match a ‘spec’ that has been produced in a graphics program such as photoshop, illustrator, or sketch. While these programs are useful for -sketching ideas, they aren't 100% accurate in their reflection of how the web +sketching ideas, they aren’t 100% accurate in their reflection of how the web works across device sizes or how things get drawn to the screen.

    -Tachyons features a spacing scale based on powers of two that starts at .25rem (for most devices this will be the equivalent of 4px). Since tachyons uses rem units with px as a fallback, if a user has declared a different base font-size for their device, your spacing will scale based on a defined ratio that has stood the test of time. As powers of two will always produce integers, there will be no problems with sub pixel rendering across browsers. Computers aren't that great at math and so decimals lead to inconsistencies across platforms. Inconsistencies should be avoided where possible. You'll find that when using a well thought out scale - things just line up. It works, with little effort, regardless of your design knowledge or sensibilities. +Tachyons features a spacing scale based on powers of two that starts at .25rem (for most devices this will be the equivalent of 4px). Since tachyons uses rem units with px as a fallback, if a user has declared a different base font-size for their device, your spacing will scale based on a defined ratio that has stood the test of time. As powers of two will always produce integers, there will be no problems with sub pixel rendering across browsers. Computers aren’t that great at math and so decimals lead to inconsistencies across platforms. Inconsistencies should be avoided where possible. You’ll find that when using a well thought out scale - things just line up. It works, with little effort, regardless of your design knowledge or sensibilities.

    @@ -276,7 +276,7 @@

    Reference

    tachyons-spacing

    - v6.0.4 + v6.0.5 1.7 KB
    @@ -1386,7 +1386,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -1397,7 +1397,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/layout/widths/index.html b/docs/layout/widths/index.html index 998c632e6..b7f046fb9 100644 --- a/docs/layout/widths/index.html +++ b/docs/layout/widths/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -143,7 +143,7 @@

    Widths

    -100 = literal value 100% -third = calc(100% / 3) - -two-thirds = calc(100% / 3) + -two-thirds = calc(100% / 1.5) -auto = string value auto @@ -254,7 +254,7 @@

    Reference

    tachyons-widths

    - v5.1.1 + v5.2.1 394 B
    @@ -555,7 +555,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -566,7 +566,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/table-of-properties/index.html b/docs/table-of-properties/index.html index 06bbd7ccd..c9deb0b7d 100644 --- a/docs/table-of-properties/index.html +++ b/docs/table-of-properties/index.html @@ -34,7 +34,7 @@ Tachyons
    - v4.8.1 + v4.12.0
    @@ -340,7 +340,7 @@

    Table of Properties

    margin-left
    .center: auto
    .center-l: auto
    .center-m: auto
    .center-ns: auto
    .mh0: var(--spacing-none)
    .mh0-l: var(--spacing-none)
    .mh0-m: var(--spacing-none)
    .mh0-ns: var(--spacing-none)
    .mh1: var(--spacing-extra-small)
    .mh1-l: var(--spacing-extra-small)
    .mh1-m: var(--spacing-extra-small)
    .mh1-ns: var(--spacing-extra-small)
    .mh2: var(--spacing-small)
    .mh2-l: var(--spacing-small)
    .mh2-m: var(--spacing-small)
    .mh2-ns: var(--spacing-small)
    .mh3: var(--spacing-medium)
    .mh3-l: var(--spacing-medium)
    .mh3-m: var(--spacing-medium)
    .mh3-ns: var(--spacing-medium)
    .mh4: var(--spacing-large)
    .mh4-l: var(--spacing-large)
    .mh4-m: var(--spacing-large)
    .mh4-ns: var(--spacing-large)
    .mh5: var(--spacing-extra-large)
    .mh5-l: var(--spacing-extra-large)
    .mh5-m: var(--spacing-extra-large)
    .mh5-ns: var(--spacing-extra-large)
    .mh6: var(--spacing-extra-extra-large)
    .mh6-l: var(--spacing-extra-extra-large)
    .mh6-m: var(--spacing-extra-extra-large)
    .mh6-ns: var(--spacing-extra-extra-large)
    .mh7: var(--spacing-extra-extra-extra-large)
    .mh7-l: var(--spacing-extra-extra-extra-large)
    .mh7-m: var(--spacing-extra-extra-extra-large)
    .mh7-ns: var(--spacing-extra-extra-extra-large)
    .ml-auto: auto
    .ml-auto-l: auto
    .ml-auto-m: auto
    .ml-auto-ns: auto
    .ml0: var(--spacing-none)
    .ml0-l: var(--spacing-none)
    .ml0-m: var(--spacing-none)
    .ml0-ns: var(--spacing-none)
    .ml1: var(--spacing-extra-small)
    .ml1-l: var(--spacing-extra-small)
    .ml1-m: var(--spacing-extra-small)
    .ml1-ns: var(--spacing-extra-small)
    .ml2: var(--spacing-small)
    .ml2-l: var(--spacing-small)
    .ml2-m: var(--spacing-small)
    .ml2-ns: var(--spacing-small)
    .ml3: var(--spacing-medium)
    .ml3-l: var(--spacing-medium)
    .ml3-m: var(--spacing-medium)
    .ml3-ns: var(--spacing-medium)
    .ml4: var(--spacing-large)
    .ml4-l: var(--spacing-large)
    .ml4-m: var(--spacing-large)
    .ml4-ns: var(--spacing-large)
    .ml5: var(--spacing-extra-large)
    .ml5-l: var(--spacing-extra-large)
    .ml5-m: var(--spacing-extra-large)
    .ml5-ns: var(--spacing-extra-large)
    .ml6: var(--spacing-extra-extra-large)
    .ml6-l: var(--spacing-extra-extra-large)
    .ml6-m: var(--spacing-extra-extra-large)
    .ml6-ns: var(--spacing-extra-extra-large)
    .ml7: var(--spacing-extra-extra-extra-large)
    .ml7-l: var(--spacing-extra-extra-extra-large)
    .ml7-m: var(--spacing-extra-extra-extra-large)
    .ml7-ns: var(--spacing-extra-extra-extra-large)
    .nested-list-reset ul, .nested-list-reset ol: 0
    .nl1: -var(--spacing-extra-small)
    .nl1-l: -var(--spacing-extra-small)
    .nl1-m: -var(--spacing-extra-small)
    .nl1-ns: -var(--spacing-extra-small)
    .nl2: -var(--spacing-small)
    .nl2-l: -var(--spacing-small)
    .nl2-m: -var(--spacing-small)
    .nl2-ns: -var(--spacing-small)
    .nl3: -var(--spacing-medium)
    .nl3-l: -var(--spacing-medium)
    .nl3-m: -var(--spacing-medium)
    .nl3-ns: -var(--spacing-medium)
    .nl4: -var(--spacing-large)
    .nl4-l: -var(--spacing-large)
    .nl4-m: -var(--spacing-large)
    .nl4-ns: -var(--spacing-large)
    .nl5: -var(--spacing-extra-large)
    .nl5-l: -var(--spacing-extra-large)
    .nl5-m: -var(--spacing-extra-large)
    .nl5-ns: -var(--spacing-extra-large)
    .nl6: -var(--spacing-extra-extra-large)
    .nl6-l: -var(--spacing-extra-extra-large)
    .nl6-m: -var(--spacing-extra-extra-large)
    .nl6-ns: -var(--spacing-extra-extra-large)
    .nl7: -var(--spacing-extra-extra-extra-large)
    .nl7-l: -var(--spacing-extra-extra-extra-large)
    .nl7-m: -var(--spacing-extra-extra-extra-large)
    .nl7-ns: -var(--spacing-extra-extra-extra-large)
    spacing
    negative-margins
    utilities
    nested
    margin-right
    .center: auto
    .center-l: auto
    .center-m: auto
    .center-ns: auto
    .mh0: var(--spacing-none)
    .mh0-l: var(--spacing-none)
    .mh0-m: var(--spacing-none)
    .mh0-ns: var(--spacing-none)
    .mh1: var(--spacing-extra-small)
    .mh1-l: var(--spacing-extra-small)
    .mh1-m: var(--spacing-extra-small)
    .mh1-ns: var(--spacing-extra-small)
    .mh2: var(--spacing-small)
    .mh2-l: var(--spacing-small)
    .mh2-m: var(--spacing-small)
    .mh2-ns: var(--spacing-small)
    .mh3: var(--spacing-medium)
    .mh3-l: var(--spacing-medium)
    .mh3-m: var(--spacing-medium)
    .mh3-ns: var(--spacing-medium)
    .mh4: var(--spacing-large)
    .mh4-l: var(--spacing-large)
    .mh4-m: var(--spacing-large)
    .mh4-ns: var(--spacing-large)
    .mh5: var(--spacing-extra-large)
    .mh5-l: var(--spacing-extra-large)
    .mh5-m: var(--spacing-extra-large)
    .mh5-ns: var(--spacing-extra-large)
    .mh6: var(--spacing-extra-extra-large)
    .mh6-l: var(--spacing-extra-extra-large)
    .mh6-m: var(--spacing-extra-extra-large)
    .mh6-ns: var(--spacing-extra-extra-large)
    .mh7: var(--spacing-extra-extra-extra-large)
    .mh7-l: var(--spacing-extra-extra-extra-large)
    .mh7-m: var(--spacing-extra-extra-extra-large)
    .mh7-ns: var(--spacing-extra-extra-extra-large)
    .mr-auto: auto
    .mr-auto-l: auto
    .mr-auto-m: auto
    .mr-auto-ns: auto
    .mr0: var(--spacing-none)
    .mr0-l: var(--spacing-none)
    .mr0-m: var(--spacing-none)
    .mr0-ns: var(--spacing-none)
    .mr1: var(--spacing-extra-small)
    .mr1-l: var(--spacing-extra-small)
    .mr1-m: var(--spacing-extra-small)
    .mr1-ns: var(--spacing-extra-small)
    .mr2: var(--spacing-small)
    .mr2-l: var(--spacing-small)
    .mr2-m: var(--spacing-small)
    .mr2-ns: var(--spacing-small)
    .mr3: var(--spacing-medium)
    .mr3-l: var(--spacing-medium)
    .mr3-m: var(--spacing-medium)
    .mr3-ns: var(--spacing-medium)
    .mr4: var(--spacing-large)
    .mr4-l: var(--spacing-large)
    .mr4-m: var(--spacing-large)
    .mr4-ns: var(--spacing-large)
    .mr5: var(--spacing-extra-large)
    .mr5-l: var(--spacing-extra-large)
    .mr5-m: var(--spacing-extra-large)
    .mr5-ns: var(--spacing-extra-large)
    .mr6: var(--spacing-extra-extra-large)
    .mr6-l: var(--spacing-extra-extra-large)
    .mr6-m: var(--spacing-extra-extra-large)
    .mr6-ns: var(--spacing-extra-extra-large)
    .mr7: var(--spacing-extra-extra-extra-large)
    .mr7-l: var(--spacing-extra-extra-extra-large)
    .mr7-m: var(--spacing-extra-extra-extra-large)
    .mr7-ns: var(--spacing-extra-extra-extra-large)
    .nr1: -var(--spacing-extra-small)
    .nr1-l: -var(--spacing-extra-small)
    .nr1-m: -var(--spacing-extra-small)
    .nr1-ns: -var(--spacing-extra-small)
    .nr2: -var(--spacing-small)
    .nr2-l: -var(--spacing-small)
    .nr2-m: -var(--spacing-small)
    .nr2-ns: -var(--spacing-small)
    .nr3: -var(--spacing-medium)
    .nr3-l: -var(--spacing-medium)
    .nr3-m: -var(--spacing-medium)
    .nr3-ns: -var(--spacing-medium)
    .nr4: -var(--spacing-large)
    .nr4-l: -var(--spacing-large)
    .nr4-m: -var(--spacing-large)
    .nr4-ns: -var(--spacing-large)
    .nr5: -var(--spacing-extra-large)
    .nr5-l: -var(--spacing-extra-large)
    .nr5-m: -var(--spacing-extra-large)
    .nr5-ns: -var(--spacing-extra-large)
    .nr6: -var(--spacing-extra-extra-large)
    .nr6-l: -var(--spacing-extra-extra-large)
    .nr6-m: -var(--spacing-extra-extra-large)
    .nr6-ns: -var(--spacing-extra-extra-large)
    .nr7: -var(--spacing-extra-extra-extra-large)
    .nr7-l: -var(--spacing-extra-extra-extra-large)
    .nr7-m: -var(--spacing-extra-extra-extra-large)
    .nr7-ns: -var(--spacing-extra-extra-extra-large)
    spacing
    negative-margins
    utilities -
    margin-top
    .indent: 0
    .indent-l: 0
    .indent-m: 0
    .indent-ns: 0
    .mt0: var(--spacing-none)
    .mt0-l: var(--spacing-none)
    .mt0-m: var(--spacing-none)
    .mt0-ns: var(--spacing-none)
    .mt1: var(--spacing-extra-small)
    .mt1-l: var(--spacing-extra-small)
    .mt1-m: var(--spacing-extra-small)
    .mt1-ns: var(--spacing-extra-small)
    .mt2: var(--spacing-small)
    .mt2-l: var(--spacing-small)
    .mt2-m: var(--spacing-small)
    .mt2-ns: var(--spacing-small)
    .mt3: var(--spacing-medium)
    .mt3-l: var(--spacing-medium)
    .mt3-m: var(--spacing-medium)
    .mt3-ns: var(--spacing-medium)
    .mt4: var(--spacing-large)
    .mt4-l: var(--spacing-large)
    .mt4-m: var(--spacing-large)
    .mt4-ns: var(--spacing-large)
    .mt5: var(--spacing-extra-large)
    .mt5-l: var(--spacing-extra-large)
    .mt5-m: var(--spacing-extra-large)
    .mt5-ns: var(--spacing-extra-large)
    .mt6: var(--spacing-extra-extra-large)
    .mt6-l: var(--spacing-extra-extra-large)
    .mt6-m: var(--spacing-extra-extra-large)
    .mt6-ns: var(--spacing-extra-extra-large)
    .mt7: var(--spacing-extra-extra-extra-large)
    .mt7-l: var(--spacing-extra-extra-extra-large)
    .mt7-m: var(--spacing-extra-extra-extra-large)
    .mt7-ns: var(--spacing-extra-extra-extra-large)
    .mv0: var(--spacing-none)
    .mv0-l: var(--spacing-none)
    .mv0-m: var(--spacing-none)
    .mv0-ns: var(--spacing-none)
    .mv1: var(--spacing-extra-small)
    .mv1-l: var(--spacing-extra-small)
    .mv1-m: var(--spacing-extra-small)
    .mv1-ns: var(--spacing-extra-small)
    .mv2: var(--spacing-small)
    .mv2-l: var(--spacing-small)
    .mv2-m: var(--spacing-small)
    .mv2-ns: var(--spacing-small)
    .mv3: var(--spacing-medium)
    .mv3-l: var(--spacing-medium)
    .mv3-m: var(--spacing-medium)
    .mv3-ns: var(--spacing-medium)
    .mv4: var(--spacing-large)
    .mv4-l: var(--spacing-large)
    .mv4-m: var(--spacing-large)
    .mv4-ns: var(--spacing-large)
    .mv5: var(--spacing-extra-large)
    .mv5-l: var(--spacing-extra-large)
    .mv5-m: var(--spacing-extra-large)
    .mv5-ns: var(--spacing-extra-large)
    .mv6: var(--spacing-extra-extra-large)
    .mv6-l: var(--spacing-extra-extra-large)
    .mv6-m: var(--spacing-extra-extra-large)
    .mv6-ns: var(--spacing-extra-extra-large)
    .mv7: var(--spacing-extra-extra-extra-large)
    .mv7-l: var(--spacing-extra-extra-extra-large)
    .mv7-m: var(--spacing-extra-extra-extra-large)
    .mv7-ns: var(--spacing-extra-extra-extra-large)
    .nested-copy-indent p+p: 0
    .nested-copy-seperator p+p: 1.5em
    .nt1: -var(--spacing-extra-small)
    .nt1-l: -var(--spacing-extra-small)
    .nt1-m: -var(--spacing-extra-small)
    .nt1-ns: -var(--spacing-extra-small)
    .nt2: -var(--spacing-small)
    .nt2-l: -var(--spacing-small)
    .nt2-m: -var(--spacing-small)
    .nt2-ns: -var(--spacing-small)
    .nt3: -var(--spacing-medium)
    .nt3-l: -var(--spacing-medium)
    .nt3-m: -var(--spacing-medium)
    .nt3-ns: -var(--spacing-medium)
    .nt4: -var(--spacing-large)
    .nt4-l: -var(--spacing-large)
    .nt4-m: -var(--spacing-large)
    .nt4-ns: -var(--spacing-large)
    .nt5: -var(--spacing-extra-large)
    .nt5-l: -var(--spacing-extra-large)
    .nt5-m: -var(--spacing-extra-large)
    .nt5-ns: -var(--spacing-extra-large)
    .nt6: -var(--spacing-extra-extra-large)
    .nt6-l: -var(--spacing-extra-extra-large)
    .nt6-m: -var(--spacing-extra-extra-large)
    .nt6-ns: -var(--spacing-extra-extra-large)
    .nt7: -var(--spacing-extra-extra-extra-large)
    .nt7-l: -var(--spacing-extra-extra-extra-large)
    .nt7-m: -var(--spacing-extra-extra-extra-large)
    .nt7-ns: -var(--spacing-extra-extra-extra-large)
    spacing
    negative-margins
    typography
    nested +
    margin-top
    .indent: 0
    .indent-l: 0
    .indent-m: 0
    .indent-ns: 0
    .mt0: var(--spacing-none)
    .mt0-l: var(--spacing-none)
    .mt0-m: var(--spacing-none)
    .mt0-ns: var(--spacing-none)
    .mt1: var(--spacing-extra-small)
    .mt1-l: var(--spacing-extra-small)
    .mt1-m: var(--spacing-extra-small)
    .mt1-ns: var(--spacing-extra-small)
    .mt2: var(--spacing-small)
    .mt2-l: var(--spacing-small)
    .mt2-m: var(--spacing-small)
    .mt2-ns: var(--spacing-small)
    .mt3: var(--spacing-medium)
    .mt3-l: var(--spacing-medium)
    .mt3-m: var(--spacing-medium)
    .mt3-ns: var(--spacing-medium)
    .mt4: var(--spacing-large)
    .mt4-l: var(--spacing-large)
    .mt4-m: var(--spacing-large)
    .mt4-ns: var(--spacing-large)
    .mt5: var(--spacing-extra-large)
    .mt5-l: var(--spacing-extra-large)
    .mt5-m: var(--spacing-extra-large)
    .mt5-ns: var(--spacing-extra-large)
    .mt6: var(--spacing-extra-extra-large)
    .mt6-l: var(--spacing-extra-extra-large)
    .mt6-m: var(--spacing-extra-extra-large)
    .mt6-ns: var(--spacing-extra-extra-large)
    .mt7: var(--spacing-extra-extra-extra-large)
    .mt7-l: var(--spacing-extra-extra-extra-large)
    .mt7-m: var(--spacing-extra-extra-extra-large)
    .mt7-ns: var(--spacing-extra-extra-extra-large)
    .mv0: var(--spacing-none)
    .mv0-l: var(--spacing-none)
    .mv0-m: var(--spacing-none)
    .mv0-ns: var(--spacing-none)
    .mv1: var(--spacing-extra-small)
    .mv1-l: var(--spacing-extra-small)
    .mv1-m: var(--spacing-extra-small)
    .mv1-ns: var(--spacing-extra-small)
    .mv2: var(--spacing-small)
    .mv2-l: var(--spacing-small)
    .mv2-m: var(--spacing-small)
    .mv2-ns: var(--spacing-small)
    .mv3: var(--spacing-medium)
    .mv3-l: var(--spacing-medium)
    .mv3-m: var(--spacing-medium)
    .mv3-ns: var(--spacing-medium)
    .mv4: var(--spacing-large)
    .mv4-l: var(--spacing-large)
    .mv4-m: var(--spacing-large)
    .mv4-ns: var(--spacing-large)
    .mv5: var(--spacing-extra-large)
    .mv5-l: var(--spacing-extra-large)
    .mv5-m: var(--spacing-extra-large)
    .mv5-ns: var(--spacing-extra-large)
    .mv6: var(--spacing-extra-extra-large)
    .mv6-l: var(--spacing-extra-extra-large)
    .mv6-m: var(--spacing-extra-extra-large)
    .mv6-ns: var(--spacing-extra-extra-large)
    .mv7: var(--spacing-extra-extra-extra-large)
    .mv7-l: var(--spacing-extra-extra-extra-large)
    .mv7-m: var(--spacing-extra-extra-extra-large)
    .mv7-ns: var(--spacing-extra-extra-extra-large)
    .nested-copy-indent p+p: 0
    .nested-copy-separator p+p: 1.5em
    .nt1: -var(--spacing-extra-small)
    .nt1-l: -var(--spacing-extra-small)
    .nt1-m: -var(--spacing-extra-small)
    .nt1-ns: -var(--spacing-extra-small)
    .nt2: -var(--spacing-small)
    .nt2-l: -var(--spacing-small)
    .nt2-m: -var(--spacing-small)
    .nt2-ns: -var(--spacing-small)
    .nt3: -var(--spacing-medium)
    .nt3-l: -var(--spacing-medium)
    .nt3-m: -var(--spacing-medium)
    .nt3-ns: -var(--spacing-medium)
    .nt4: -var(--spacing-large)
    .nt4-l: -var(--spacing-large)
    .nt4-m: -var(--spacing-large)
    .nt4-ns: -var(--spacing-large)
    .nt5: -var(--spacing-extra-large)
    .nt5-l: -var(--spacing-extra-large)
    .nt5-m: -var(--spacing-extra-large)
    .nt5-ns: -var(--spacing-extra-large)
    .nt6: -var(--spacing-extra-extra-large)
    .nt6-l: -var(--spacing-extra-extra-large)
    .nt6-m: -var(--spacing-extra-extra-large)
    .nt6-ns: -var(--spacing-extra-extra-large)
    .nt7: -var(--spacing-extra-extra-extra-large)
    .nt7-l: -var(--spacing-extra-extra-extra-large)
    .nt7-m: -var(--spacing-extra-extra-extra-large)
    .nt7-ns: -var(--spacing-extra-extra-extra-large)
    spacing
    negative-margins
    typography
    nested
    max-width
    .measure: 30em
    .measure-l: 30em
    .measure-m: 30em
    .measure-narrow: 20em
    .measure-narrow-l: 20em
    .measure-narrow-m: 20em
    .measure-narrow-ns: 20em
    .measure-ns: 30em
    .measure-wide: 34em
    .measure-wide-l: 34em
    .measure-wide-m: 34em
    .measure-wide-ns: 34em
    .mw-100: 100%
    .mw-100-l: 100%
    .mw-100-m: 100%
    .mw-100-ns: 100%
    .mw-none: none
    .mw-none-l: none
    .mw-none-m: none
    .mw-none-ns: none
    .mw1: 1rem
    .mw1-l: 1rem
    .mw1-m: 1rem
    .mw1-ns: 1rem
    .mw2: 2rem
    .mw2-l: 2rem
    .mw2-m: 2rem
    .mw2-ns: 2rem
    .mw3: 4rem
    .mw3-l: 4rem
    .mw3-m: 4rem
    .mw3-ns: 4rem
    .mw4: 8rem
    .mw4-l: 8rem
    .mw4-m: 8rem
    .mw4-ns: 8rem
    .mw5: 16rem
    .mw5-l: 16rem
    .mw5-m: 16rem
    .mw5-ns: 16rem
    .mw6: 32rem
    .mw6-l: 32rem
    .mw6-m: 32rem
    .mw6-ns: 32rem
    .mw7: 48rem
    .mw7-l: 48rem
    .mw7-m: 48rem
    .mw7-ns: 48rem
    .mw8: 64rem
    .mw8-l: 64rem
    .mw8-m: 64rem
    .mw8-ns: 64rem
    .mw9: 96rem
    .mw9-l: 96rem
    .mw9-m: 96rem
    .mw9-ns: 96rem
    .nested-img img: 100%
    img: 100%
    images
    max-widths
    typography
    nested
    min-height
    .flex-auto: 0
    .flex-auto-l: 0
    .flex-auto-m: 0
    .flex-auto-ns: 0
    .min-h-100: 100%
    .min-h-100-l: 100%
    .min-h-100-m: 100%
    .min-h-100-ns: 100%
    .min-vh-100: 100vh
    .min-vh-100-l: 100vh
    .min-vh-100-m: 100vh
    .min-vh-100-ns: 100vh
    flexbox
    heights
    min-width
    .flex-auto: 0
    .flex-auto-l: 0
    .flex-auto-m: 0
    .flex-auto-ns: 0
    flexbox @@ -452,7 +452,7 @@

    Table of Properties

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -463,7 +463,7 @@

    Table of Properties

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/table-of-styles/index.html b/docs/table-of-styles/index.html index 440108ca8..1712c3d10 100644 --- a/docs/table-of-styles/index.html +++ b/docs/table-of-styles/index.html @@ -34,7 +34,7 @@ Tachyons
    - v4.8.1 + v4.12.0
    @@ -289,7 +289,7 @@

    Table of Styles

    .nested-headline-line-height h4, .nested-headline-line-height h5, .nested-headline-line-height h6
    line-height:1.25
    nested
    .nested-list-reset ul,
    -.nested-list-reset ol
    padding-left:0
    margin-left:0
    list-style-type:none
    nested
    .nested-copy-indent p+p
    text-indent:1em
    margin-top:0
    margin-bottom:0
    nested
    .nested-copy-seperator p+p
    margin-top:1.5em
    nested
    .nested-img img
    width:100%
    max-width:100%
    display:block
    nested
    .nested-links a
    color:var(--blue)
    transition:color .15s ease-in
    nested
    .nested-links a:hover,
    +.nested-list-reset ol
    padding-left:0
    margin-left:0
    list-style-type:none
    nested
    .nested-copy-indent p+p
    text-indent:1em
    margin-top:0
    margin-bottom:0
    nested
    .nested-copy-separator p+p
    margin-top:1.5em
    nested
    .nested-img img
    width:100%
    max-width:100%
    display:block
    nested
    .nested-links a
    color:var(--blue)
    transition:color .15s ease-in
    nested
    .nested-links a:hover,
     .nested-links a:focus
    color:var(--light-blue)
    transition:color .15s ease-in
    nested
    .debug *
    outline:1px solid gold
    debug-children
    .debug-white *
    outline:1px solid white
    debug-children
    .debug-black *
    outline:1px solid black
    debug-children
    .debug-grid
    background:transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAAFElEQVR4AWPAC97/9x0eCsAEPgwAVLshdpENIxcAAAAASUVORK5CYII=) repeat top left
    debug-grid
    .debug-grid-16
    background:transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAMklEQVR4AWOgCLz/b0epAa6UGuBOqQHOQHLUgFEDnAbcBZ4UGwDOkiCnkIhdgNgNxAYAiYlD+8sEuo8AAAAASUVORK5CYII=) repeat top left
    debug-grid
    .debug-grid-8-solid
    background:white url(data:image/gif;base64,R0lGODdhCAAIAPEAAADw/wDx/////wAAACwAAAAACAAIAAACDZQvgaeb/lxbAIKA8y0AOw==) repeat top left
    debug-grid
    .debug-grid-16-solid
    background:white url(data:image/gif;base64,R0lGODdhEAAQAPEAAADw/wDx/xXy/////ywAAAAAEAAQAAACIZyPKckYDQFsb6ZqD85jZ2+BkwiRFKehhqQCQgDHcgwEBQA7) repeat top left
    debug-grid @@ -354,7 +354,7 @@

    Table of Styles

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -365,7 +365,7 @@

    Table of Styles

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/themes/background-size/index.html b/docs/themes/background-size/index.html index cd32e7890..655516b1d 100644 --- a/docs/themes/background-size/index.html +++ b/docs/themes/background-size/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -77,7 +77,7 @@

    Background Size

    Background-size affects how background images fill their containing elements. - While measurements can be declared explicitly to size an image, the values + While measurements can be declared explicitly to size an image, the values that seem most reusable are contain and cover.

    @@ -91,7 +91,7 @@

    Examples

    .cover { background-size: cover } -

    cover will make sure the entire element is covered - but won't guarantee that the entire image will be shown.

    +

    cover will make sure the entire element is covered - but won’t guarantee that the entire image will be shown.

    @@ -312,7 +312,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -323,7 +323,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/themes/border-radius/index.html b/docs/themes/border-radius/index.html index d2b0a2448..d5790cfe0 100644 --- a/docs/themes/border-radius/index.html +++ b/docs/themes/border-radius/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -411,7 +411,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -422,7 +422,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/themes/borders/index.html b/docs/themes/borders/index.html index 03b6f47ef..5564db4e2 100644 --- a/docs/themes/borders/index.html +++ b/docs/themes/borders/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -78,7 +78,7 @@

    Borders

    There is a base border module that can be extended with the border-width, border-color, border-style modules. By default you - don't need to set a border color. It will just inherit whatever the + don’t need to set a border color. It will just inherit whatever the text color is for that dom node. You can target any side to put a border on ie. top, right, bottom, left.

    @@ -949,7 +949,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -960,7 +960,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/themes/box-shadow/index.html b/docs/themes/box-shadow/index.html index c76fdb0b8..3e99466c3 100644 --- a/docs/themes/box-shadow/index.html +++ b/docs/themes/box-shadow/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -306,7 +306,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -317,7 +317,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/themes/hovers/index.html b/docs/themes/hovers/index.html index 9c199c7c2..2adb908b8 100644 --- a/docs/themes/hovers/index.html +++ b/docs/themes/hovers/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -112,10 +112,10 @@

    Reveal Children on Hover

    -<a href="#" style="background-image: url(http://mrmrs.github.io/images/0010.jpg); +<a href="#" style="background-image: url(http://mrmrs.github.io/images/0010.jpg); class="link mw5 dt hide-child br2 cover bg-center" "> <span class="white dtc v-mid w-100 h-100 child bg-black-40 pa5"> - Card title + Card title </span> </a> @@ -133,7 +133,7 @@

    Add pointer on hover

    Grow on Hover

    -

    Using the grow class on an element will cause it to scale to 1.05% of it's normal size on hover.

    +

    Using the grow class on an element will cause it to scale to 1.05% of its normal size on hover.

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -492,7 +492,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/themes/opacity/index.html b/docs/themes/opacity/index.html index 18bd1206d..6b3ba928a 100644 --- a/docs/themes/opacity/index.html +++ b/docs/themes/opacity/index.html @@ -32,7 +32,7 @@
    Tachyons
    - v4.9.0 + v4.12.0
    @@ -305,7 +305,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -316,7 +316,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/themes/skins/index.html b/docs/themes/skins/index.html index 05e97622a..fd1c82533 100644 --- a/docs/themes/skins/index.html +++ b/docs/themes/skins/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -226,11 +226,12 @@

    Color Palette

  • -
    +
    + dark-gray @@ -264,7 +265,8 @@

    Color Palette

    - #4D4D4F + + #333333
  • @@ -788,7 +790,7 @@

    Color Palette

  • -
    +
    @@ -805,6 +807,8 @@

    Color Palette

    + orange + @@ -826,14 +830,14 @@

    Color Palette

    - #F48120 + #FF6300
  • -
    +
    @@ -850,6 +854,8 @@

    Color Palette

    + + gold @@ -871,7 +877,7 @@

    Color Palette

    - #FAAD3F + #FFB700
  • @@ -1489,7 +1495,7 @@

    Color Palette

  • -
    +
    @@ -1521,20 +1527,22 @@

    Color Palette

    + blue - #408BC9 + + #357EDD
  • -
    +
    @@ -1566,13 +1574,15 @@

    Color Palette

    + + light-blue - #76C4E2 + #96CCFF
  • @@ -1817,15 +1827,15 @@

    Color Palette

    Accessible Combinations

    AA Large (contrast ≥ 3.0) - 500 + 518

    AA (contrast ≥ 4.5) - 310 + 318

    AAA (contrast ≥ 7.0) - 182 + 194

      @@ -1923,10 +1933,10 @@

      Accessible Combinations

    • + style="color:#000000;background-color:#777777">
      Aa - 7.27 + 4.69

      In visual perception a color is almost never seen as it really @@ -1937,6 +1947,7 @@

      Accessible Combinations

      + .black { color: #000000 } @@ -1972,7 +1983,6 @@

      Accessible Combinations

      - .washed-red { color: #FFDFDF } @@ -1980,6 +1990,7 @@

      Accessible Combinations

      + .bg-gray { background-color: #777777 } @@ -2004,7 +2015,6 @@

      Accessible Combinations

      - .bg-dark-blue { background-color: #00449E } @@ -2873,10 +2883,10 @@

      Accessible Combinations

    • + style="color:#000000;background-color:#FF6300">
      Aa - 8.01 + 7.04

      In visual perception a color is almost never seen as it really @@ -2940,6 +2950,8 @@

      Accessible Combinations

      + .bg-orange { background-color: #FF6300 } + @@ -2966,10 +2978,10 @@

      Accessible Combinations

    • + style="color:#000000;background-color:#FFB700">
      Aa - 11.11 + 12.03

      In visual perception a color is almost never seen as it really @@ -3033,6 +3045,8 @@

      Accessible Combinations

      + + .bg-gold { background-color: #FFB700 } @@ -4009,10 +4023,10 @@

      Accessible Combinations

    • + style="color:#000000;background-color:#357EDD">
      Aa - 5.75 + 5.18

      In visual perception a color is almost never seen as it really @@ -4090,6 +4104,8 @@

      Accessible Combinations

      + + .bg-blue { background-color: #357EDD } @@ -4102,10 +4118,10 @@

      Accessible Combinations

    • + style="color:#000000;background-color:#96CCFF">
      Aa - 10.76 + 12.38

      In visual perception a color is almost never seen as it really @@ -4184,6 +4200,8 @@

      Accessible Combinations

      + + .bg-light-blue { background-color: #96CCFF } @@ -4857,10 +4875,10 @@

      Accessible Combinations

    • + style="color:#FFFF00;background-color:#333333">
      Aa - 7.85 + 11.77

      In visual perception a color is almost never seen as it really @@ -4910,6 +4928,8 @@

      Accessible Combinations

      + .bg-dark-gray { background-color: #333333 } + @@ -5878,10 +5898,10 @@

      Accessible Combinations

    • + style="color:#FFFF00;background-color:#357EDD">
      Aa - 3.40 + 3.78

      In visual perception a color is almost never seen as it really @@ -5957,6 +5977,8 @@

      Accessible Combinations

      + + .bg-blue { background-color: #357EDD } @@ -7012,10 +7034,10 @@

      Accessible Combinations

    • + style="color:#111111;background-color:#FF6300">
      Aa - 7.20 + 6.33

      In visual perception a color is almost never seen as it really @@ -7079,6 +7101,8 @@

      Accessible Combinations

      + .bg-orange { background-color: #FF6300 } + @@ -7105,10 +7129,10 @@

      Accessible Combinations

    • + style="color:#111111;background-color:#FFB700">
      Aa - 9.99 + 10.81

      In visual perception a color is almost never seen as it really @@ -7172,6 +7196,8 @@

      Accessible Combinations

      + + .bg-gold { background-color: #FFB700 } @@ -8148,10 +8174,10 @@

      Accessible Combinations

    • + style="color:#111111;background-color:#357EDD">
      Aa - 5.17 + 4.66

      In visual perception a color is almost never seen as it really @@ -8229,6 +8255,8 @@

      Accessible Combinations

      + + .bg-blue { background-color: #357EDD } @@ -8241,10 +8269,10 @@

      Accessible Combinations

    • + style="color:#111111;background-color:#96CCFF">
      Aa - 9.68 + 11.13

      In visual perception a color is almost never seen as it really @@ -8323,6 +8351,8 @@

      Accessible Combinations

      + + .bg-light-blue { background-color: #96CCFF } @@ -8810,10 +8840,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#FFFF00">
      Aa - 7.85 + 11.77

      In visual perception a color is almost never seen as it really @@ -8826,6 +8856,8 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } + @@ -8901,10 +8933,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#999999">
      Aa - 3.63 + 4.43

      In visual perception a color is almost never seen as it really @@ -8917,6 +8949,7 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } @@ -8958,7 +8991,8 @@

      Accessible Combinations

      - .bg-light-silver { background-color: #AAAAAA } + .bg-silver { background-color: #999999 } + @@ -8994,10 +9028,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#AAAAAA">
      Aa - 5.25 + 5.44

      In visual perception a color is almost never seen as it really @@ -9010,6 +9044,7 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } @@ -9052,7 +9087,8 @@

      Accessible Combinations

      - .bg-moon-gray { background-color: #CCCCCC } + .bg-light-silver { background-color: #AAAAAA } + @@ -9087,10 +9123,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#CCCCCC">
      Aa - 7.27 + 7.87

      In visual perception a color is almost never seen as it really @@ -9103,6 +9139,7 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } @@ -9146,7 +9183,8 @@

      Accessible Combinations

      - .bg-light-gray { background-color: #EEEEEE } + .bg-moon-gray { background-color: #CCCCCC } + @@ -9180,10 +9218,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#EEEEEE">
      Aa - 7.67 + 10.89

      In visual perception a color is almost never seen as it really @@ -9196,6 +9234,7 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } @@ -9240,7 +9279,8 @@

      Accessible Combinations

      - .bg-near-white { background-color: #F4F4F4 } + .bg-light-gray { background-color: #EEEEEE } + @@ -9273,10 +9313,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#F4F4F4">
      Aa - 8.43 + 11.49

      In visual perception a color is almost never seen as it really @@ -9289,6 +9329,7 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } @@ -9334,7 +9375,8 @@

      Accessible Combinations

      - .bg-white { background-color: #FFFFFF } + .bg-near-white { background-color: #F4F4F4 } + @@ -9366,10 +9408,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#FFFFFF">
      Aa - 3.14 + 12.63

      In visual perception a color is almost never seen as it really @@ -9382,6 +9424,8 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } + @@ -9427,10 +9471,10 @@

      Accessible Combinations

      + .bg-white { background-color: #FFFFFF } - .bg-light-red { background-color: #FF725C } @@ -9459,10 +9503,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#FF4136">
      Aa - 3.22 + 3.65

      In visual perception a color is almost never seen as it really @@ -9475,6 +9519,8 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } + @@ -9522,6 +9568,8 @@

      Accessible Combinations

      + .bg-red { background-color: #FF4136 } + @@ -9550,10 +9598,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#FF725C">
      Aa - 4.46 + 4.70

      In visual perception a color is almost never seen as it really @@ -9566,6 +9614,7 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } @@ -9615,6 +9664,9 @@

      Accessible Combinations

      + .bg-light-red { background-color: #FF725C } + + @@ -9641,10 +9693,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#FF6300">
      Aa - 6.01 + 4.23

      In visual perception a color is almost never seen as it really @@ -9657,6 +9709,7 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } @@ -9707,8 +9760,9 @@

      Accessible Combinations

      + .bg-orange { background-color: #FF6300 } + - .bg-yellow { background-color: #FFD700 } @@ -9734,10 +9788,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#FFB700">
      Aa - 7.33 + 7.24

      In visual perception a color is almost never seen as it really @@ -9750,6 +9804,7 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } @@ -9800,9 +9855,10 @@

      Accessible Combinations

      + + .bg-gold { background-color: #FFB700 } - .bg-light-yellow { background-color: #FBF1A9 } @@ -9827,10 +9883,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#FFD700">
      Aa - 3.70 + 9.01

      In visual perception a color is almost never seen as it really @@ -9843,6 +9899,8 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } + @@ -9894,13 +9952,13 @@

      Accessible Combinations

      + .bg-yellow { background-color: #FFD700 } - .bg-pink { background-color: #FF80CC } @@ -9920,10 +9978,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#FBF1A9">
      Aa - 4.61 + 10.98

      In visual perception a color is almost never seen as it really @@ -9936,6 +9994,8 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } + @@ -9988,13 +10048,13 @@

      Accessible Combinations

      + .bg-light-yellow { background-color: #FBF1A9 } - .bg-light-pink { background-color: #FFA3D7 } @@ -10013,10 +10073,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#A463F2">
      Aa - 6.12 + 3.40

      In visual perception a color is almost never seen as it really @@ -10029,6 +10089,8 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } + @@ -10083,6 +10145,7 @@

      Accessible Combinations

      + .bg-light-purple { background-color: #A463F2 } @@ -10090,7 +10153,6 @@

      Accessible Combinations

      - .bg-light-green { background-color: #9EEBCF } @@ -10106,10 +10168,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#FF41B4">
      Aa - 4.32 + 4.01

      In visual perception a color is almost never seen as it really @@ -10122,6 +10184,8 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } + @@ -10177,6 +10241,8 @@

      Accessible Combinations

      + + .bg-hot-pink { background-color: #FF41B4 } @@ -10197,10 +10263,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#FF80CC">
      Aa - 6.84 + 5.54

      In visual perception a color is almost never seen as it really @@ -10213,6 +10279,8 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } + @@ -10270,6 +10338,7 @@

      Accessible Combinations

      + .bg-pink { background-color: #FF80CC } @@ -10279,7 +10348,6 @@

      Accessible Combinations

      - .bg-lightest-blue { background-color: #CDECFF } @@ -10290,10 +10358,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#FFA3D7">
      Aa - 8.29 + 6.90

      In visual perception a color is almost never seen as it really @@ -10306,6 +10374,7 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } @@ -10364,6 +10433,8 @@

      Accessible Combinations

      + + .bg-light-pink { background-color: #FFA3D7 } @@ -10373,7 +10444,6 @@

      Accessible Combinations

      - .bg-washed-blue { background-color: #F6FFFE } @@ -10383,10 +10453,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#19A974">
      Aa - 7.95 + 4.19

      In visual perception a color is almost never seen as it really @@ -10399,6 +10469,8 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } + @@ -10459,6 +10531,7 @@

      Accessible Combinations

      + .bg-green { background-color: #19A974 } @@ -10467,7 +10540,6 @@

      Accessible Combinations

      - .bg-washed-green { background-color: #E8FDF5 } @@ -10476,10 +10548,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#9EEBCF">
      Aa - 8.18 + 9.17

      In visual perception a color is almost never seen as it really @@ -10492,6 +10564,7 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } @@ -10553,6 +10626,8 @@

      Accessible Combinations

      + + .bg-light-green { background-color: #9EEBCF } @@ -10561,7 +10636,6 @@

      Accessible Combinations

      - .bg-washed-yellow { background-color: #FFFCEB }
      @@ -10569,10 +10643,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#357EDD">
      Aa - 6.78 + 3.12

      In visual perception a color is almost never seen as it really @@ -10585,6 +10659,7 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } @@ -10650,12 +10725,12 @@

      Accessible Combinations

      + .bg-blue { background-color: #357EDD } - .bg-washed-red { background-color: #FFDFDF }
      @@ -10663,10 +10738,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#96CCFF">
      Aa - 6.94 + 7.45

      In visual perception a color is almost never seen as it really @@ -10679,8 +10754,8 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } - .mid-gray { color: #555555 } @@ -10745,6 +10820,8 @@

      Accessible Combinations

      + + .bg-light-blue { background-color: #96CCFF } @@ -10756,10 +10833,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#CDECFF">
      Aa - 3.21 + 10.25

      In visual perception a color is almost never seen as it really @@ -10772,8 +10849,8 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } - .mid-gray { color: #555555 } @@ -10815,7 +10892,6 @@

      Accessible Combinations

      - .bg-light-silver { background-color: #AAAAAA } @@ -10841,6 +10917,7 @@

      Accessible Combinations

      + .bg-lightest-blue { background-color: #CDECFF } @@ -10851,10 +10928,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#F6FFFE">
      Aa - 4.64 + 12.43

      In visual perception a color is almost never seen as it really @@ -10867,8 +10944,8 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } - .mid-gray { color: #555555 } @@ -10911,7 +10988,6 @@

      Accessible Combinations

      - .bg-moon-gray { background-color: #CCCCCC } @@ -10937,6 +11013,7 @@

      Accessible Combinations

      + .bg-washed-blue { background-color: #F6FFFE } @@ -10946,10 +11023,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#E8FDF5">
      Aa - 6.43 + 11.91

      In visual perception a color is almost never seen as it really @@ -10962,8 +11039,8 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } - .mid-gray { color: #555555 } @@ -11007,7 +11084,6 @@

      Accessible Combinations

      - .bg-light-gray { background-color: #EEEEEE } @@ -11033,6 +11109,7 @@

      Accessible Combinations

      + .bg-washed-green { background-color: #E8FDF5 } @@ -11041,10 +11118,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#FFFCEB">
      Aa - 6.78 + 12.26

      In visual perception a color is almost never seen as it really @@ -11057,8 +11134,8 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } - .mid-gray { color: #555555 } @@ -11103,7 +11180,6 @@

      Accessible Combinations

      - .bg-near-white { background-color: #F4F4F4 } @@ -11129,6 +11205,7 @@

      Accessible Combinations

      + .bg-washed-yellow { background-color: #FFFCEB }
      @@ -11136,10 +11213,10 @@

      Accessible Combinations

    • + style="color:#333333;background-color:#FFDFDF">
      Aa - 7.46 + 10.15

      In visual perception a color is almost never seen as it really @@ -11152,8 +11229,9 @@

      Accessible Combinations

      + .dark-gray { color: #333333 } + - .mid-gray { color: #555555 } @@ -11199,7 +11277,6 @@

      Accessible Combinations

      - .bg-white { background-color: #FFFFFF } @@ -11224,6 +11301,7 @@

      Accessible Combinations

      + .bg-washed-red { background-color: #FFDFDF }
      @@ -11231,10 +11309,10 @@

      Accessible Combinations

    • + style="color:#555555;background-color:#FFFF00">
      Aa - 3.95 + 6.94

      In visual perception a color is almost never seen as it really @@ -11324,10 +11402,10 @@

      Accessible Combinations

    • + style="color:#555555;background-color:#AAAAAA">
      Aa - 5.32 + 3.21

      In visual perception a color is almost never seen as it really @@ -11383,6 +11461,7 @@

      Accessible Combinations

      + .bg-light-silver { background-color: #AAAAAA } @@ -11393,7 +11472,6 @@

      Accessible Combinations

      - .bg-yellow { background-color: #FFD700 } @@ -11419,10 +11497,10 @@

      Accessible Combinations

    • + style="color:#555555;background-color:#CCCCCC">
      Aa - 6.48 + 4.64

      In visual perception a color is almost never seen as it really @@ -11479,6 +11557,7 @@

      Accessible Combinations

      + .bg-moon-gray { background-color: #CCCCCC } @@ -11489,7 +11568,6 @@

      Accessible Combinations

      - .bg-light-yellow { background-color: #FBF1A9 } @@ -11514,10 +11592,10 @@

      Accessible Combinations

    • + style="color:#555555;background-color:#EEEEEE">
      Aa - 3.27 + 6.43

      In visual perception a color is almost never seen as it really @@ -11575,6 +11653,7 @@

      Accessible Combinations

      + .bg-light-gray { background-color: #EEEEEE } @@ -11589,7 +11668,6 @@

      Accessible Combinations

      - .bg-pink { background-color: #FF80CC } @@ -11609,10 +11687,10 @@

      Accessible Combinations

    • + style="color:#555555;background-color:#F4F4F4">
      Aa - 4.07 + 6.78

      In visual perception a color is almost never seen as it really @@ -11671,6 +11749,7 @@

      Accessible Combinations

      + .bg-near-white { background-color: #F4F4F4 } @@ -11685,7 +11764,6 @@

      Accessible Combinations

      - .bg-light-pink { background-color: #FFA3D7 } @@ -11704,10 +11782,10 @@

      Accessible Combinations

    • + style="color:#555555;background-color:#FFFFFF">
      Aa - 5.41 + 7.46

      In visual perception a color is almost never seen as it really @@ -11767,6 +11845,7 @@

      Accessible Combinations

      + .bg-white { background-color: #FFFFFF } @@ -11783,7 +11862,6 @@

      Accessible Combinations

      - .bg-light-green { background-color: #9EEBCF } @@ -11799,10 +11877,10 @@

      Accessible Combinations

    • + style="color:#555555;background-color:#FFB700">
      Aa - 3.82 + 4.27

      In visual perception a color is almost never seen as it really @@ -11866,6 +11944,8 @@

      Accessible Combinations

      + + .bg-gold { background-color: #FFB700 } @@ -11892,10 +11972,10 @@

      Accessible Combinations

    • + style="color:#555555;background-color:#FFD700">
      Aa - 6.05 + 5.32

      In visual perception a color is almost never seen as it really @@ -11961,6 +12041,7 @@

      Accessible Combinations

      + .bg-yellow { background-color: #FFD700 } @@ -11976,7 +12057,6 @@

      Accessible Combinations

      - .bg-lightest-blue { background-color: #CDECFF } @@ -11987,10 +12067,10 @@

      Accessible Combinations

    • + style="color:#555555;background-color:#FBF1A9">
      Aa - 7.33 + 6.48

      In visual perception a color is almost never seen as it really @@ -12057,6 +12137,7 @@

      Accessible Combinations

      + .bg-light-yellow { background-color: #FBF1A9 } @@ -12072,7 +12153,6 @@

      Accessible Combinations

      - .bg-washed-blue { background-color: #F6FFFE } @@ -12082,10 +12162,10 @@

      Accessible Combinations

    • + style="color:#555555;background-color:#FF80CC">
      Aa - 7.03 + 3.27

      In visual perception a color is almost never seen as it really @@ -12157,6 +12237,7 @@

      Accessible Combinations

      + .bg-pink { background-color: #FF80CC } @@ -12168,7 +12249,6 @@

      Accessible Combinations

      - .bg-washed-green { background-color: #E8FDF5 } @@ -12177,10 +12257,10 @@

      Accessible Combinations

    • + style="color:#555555;background-color:#FFA3D7">
      Aa - 7.23 + 4.07

      In visual perception a color is almost never seen as it really @@ -12253,6 +12333,7 @@

      Accessible Combinations

      + .bg-light-pink { background-color: #FFA3D7 } @@ -12264,7 +12345,6 @@

      Accessible Combinations

      - .bg-washed-yellow { background-color: #FFFCEB }
      @@ -12272,10 +12352,10 @@

      Accessible Combinations

    • + style="color:#555555;background-color:#9EEBCF">
      Aa - 5.99 + 5.41

      In visual perception a color is almost never seen as it really @@ -12351,6 +12431,7 @@

      Accessible Combinations

      + .bg-light-green { background-color: #9EEBCF } @@ -12359,8 +12440,6 @@

      Accessible Combinations

      - - .bg-washed-red { background-color: #FFDFDF }
      @@ -12368,10 +12447,10 @@

      Accessible Combinations

    • + style="color:#555555;background-color:#96CCFF">
      Aa - 4.69 + 4.39

      In visual perception a color is almost never seen as it really @@ -12385,8 +12464,8 @@

      Accessible Combinations

      + .mid-gray { color: #555555 } - .gray { color: #777777 } @@ -12421,7 +12500,6 @@

      Accessible Combinations

      - .bg-black { background-color: #000000 } @@ -12452,6 +12530,7 @@

      Accessible Combinations

      + .bg-light-blue { background-color: #96CCFF } @@ -12463,10 +12542,10 @@

      Accessible Combinations

    • + style="color:#555555;background-color:#CDECFF">
      Aa - 4.17 + 6.05

      In visual perception a color is almost never seen as it really @@ -12480,8 +12559,8 @@

      Accessible Combinations

      + .mid-gray { color: #555555 } - .gray { color: #777777 } @@ -12546,6 +12625,8 @@

      Accessible Combinations

      + + .bg-lightest-blue { background-color: #CDECFF } @@ -12556,10 +12637,10 @@

      Accessible Combinations

    • + style="color:#555555;background-color:#F6FFFE">
      Aa - 4.22 + 7.33

      In visual perception a color is almost never seen as it really @@ -12573,8 +12654,8 @@

      Accessible Combinations

      + .mid-gray { color: #555555 } - .gray { color: #777777 } @@ -12610,7 +12691,6 @@

      Accessible Combinations

      - .bg-near-black { background-color: #111111 } @@ -12642,6 +12722,7 @@

      Accessible Combinations

      + .bg-washed-blue { background-color: #F6FFFE } @@ -12651,10 +12732,10 @@

      Accessible Combinations

    • + style="color:#555555;background-color:#E8FDF5">
      Aa - 3.86 + 7.03

      In visual perception a color is almost never seen as it really @@ -12668,8 +12749,8 @@

      Accessible Combinations

      + .mid-gray { color: #555555 } - .gray { color: #777777 } @@ -12712,7 +12793,6 @@

      Accessible Combinations

      - .bg-light-gray { background-color: #EEEEEE } @@ -12738,6 +12818,7 @@

      Accessible Combinations

      + .bg-washed-green { background-color: #E8FDF5 } @@ -12746,10 +12827,10 @@

      Accessible Combinations

    • + style="color:#555555;background-color:#FFFCEB">
      Aa - 4.07 + 7.23

      In visual perception a color is almost never seen as it really @@ -12763,8 +12844,8 @@

      Accessible Combinations

      + .mid-gray { color: #555555 } - .gray { color: #777777 } @@ -12808,7 +12889,6 @@

      Accessible Combinations

      - .bg-near-white { background-color: #F4F4F4 } @@ -12834,6 +12914,7 @@

      Accessible Combinations

      + .bg-washed-yellow { background-color: #FFFCEB }
      @@ -12841,10 +12922,10 @@

      Accessible Combinations

    • + style="color:#555555;background-color:#FFDFDF">
      Aa - 4.48 + 5.99

      In visual perception a color is almost never seen as it really @@ -12858,8 +12939,9 @@

      Accessible Combinations

      + .mid-gray { color: #555555 } + - .gray { color: #777777 } @@ -12904,7 +12986,6 @@

      Accessible Combinations

      - .bg-white { background-color: #FFFFFF } @@ -12929,6 +13010,7 @@

      Accessible Combinations

      + .bg-washed-red { background-color: #FFDFDF }
      @@ -12936,10 +13018,10 @@

      Accessible Combinations

    • + style="color:#777777;background-color:#000000">
      Aa - 3.19 + 4.69

      In visual perception a color is almost never seen as it really @@ -12989,6 +13071,7 @@

      Accessible Combinations

      + .bg-black { background-color: #000000 } @@ -13005,7 +13088,6 @@

      Accessible Combinations

      - .bg-yellow { background-color: #FFD700 } @@ -13031,10 +13113,10 @@

      Accessible Combinations

    • + style="color:#777777;background-color:#FFFF00">
      Aa - 3.89 + 4.17

      In visual perception a color is almost never seen as it really @@ -13100,8 +13182,6 @@

      Accessible Combinations

      - - .bg-light-yellow { background-color: #FBF1A9 } @@ -13126,10 +13206,10 @@

      Accessible Combinations

    • + style="color:#777777;background-color:#111111">
      Aa - 3.25 + 4.22

      In visual perception a color is almost never seen as it really @@ -13180,6 +13260,7 @@

      Accessible Combinations

      + .bg-near-black { background-color: #111111 } @@ -13205,7 +13286,6 @@

      Accessible Combinations

      - .bg-light-green { background-color: #9EEBCF } @@ -13221,10 +13301,10 @@

      Accessible Combinations

    • + style="color:#777777;background-color:#EEEEEE">
      Aa - 3.78 + 3.86

      In visual perception a color is almost never seen as it really @@ -13282,6 +13362,8 @@

      Accessible Combinations

      + .bg-light-gray { background-color: #EEEEEE } + @@ -13300,8 +13382,6 @@

      Accessible Combinations

      - - .bg-navy { background-color: #001B44 } @@ -13316,10 +13396,10 @@

      Accessible Combinations

    • + style="color:#777777;background-color:#F4F4F4">
      Aa - 3.63 + 4.07

      In visual perception a color is almost never seen as it really @@ -13378,6 +13458,7 @@

      Accessible Combinations

      + .bg-near-white { background-color: #F4F4F4 } @@ -13400,7 +13481,6 @@

      Accessible Combinations

      - .bg-lightest-blue { background-color: #CDECFF } @@ -13411,10 +13491,10 @@

      Accessible Combinations

    • + style="color:#777777;background-color:#FFFFFF">
      Aa - 4.40 + 4.48

      In visual perception a color is almost never seen as it really @@ -13474,6 +13554,7 @@

      Accessible Combinations

      + .bg-white { background-color: #FFFFFF } @@ -13496,7 +13577,6 @@

      Accessible Combinations

      - .bg-washed-blue { background-color: #F6FFFE } @@ -13506,10 +13586,10 @@

      Accessible Combinations

    • + style="color:#777777;background-color:#FFD700">
      Aa - 4.22 + 3.19

      In visual perception a color is almost never seen as it really @@ -13575,6 +13655,7 @@

      Accessible Combinations

      + .bg-yellow { background-color: #FFD700 } @@ -13592,7 +13673,6 @@

      Accessible Combinations

      - .bg-washed-green { background-color: #E8FDF5 } @@ -13601,10 +13681,10 @@

      Accessible Combinations

    • + style="color:#777777;background-color:#FBF1A9">
      Aa - 4.34 + 3.89

      In visual perception a color is almost never seen as it really @@ -13671,6 +13751,7 @@

      Accessible Combinations

      + .bg-light-yellow { background-color: #FBF1A9 } @@ -13688,7 +13769,6 @@

      Accessible Combinations

      - .bg-washed-yellow { background-color: #FFFCEB }
      @@ -13696,10 +13776,10 @@

      Accessible Combinations

    • + style="color:#777777;background-color:#9EEBCF">
      Aa - 3.60 + 3.25

      In visual perception a color is almost never seen as it really @@ -13775,6 +13855,7 @@

      Accessible Combinations

      + .bg-light-green { background-color: #9EEBCF } @@ -13783,8 +13864,6 @@

      Accessible Combinations

      - - .bg-washed-red { background-color: #FFDFDF }
      @@ -13792,10 +13871,10 @@

      Accessible Combinations

    • + style="color:#777777;background-color:#001B44">
      Aa - 7.37 + 3.78

      In visual perception a color is almost never seen as it really @@ -13810,8 +13889,8 @@

      Accessible Combinations

      + .gray { color: #777777 } - .silver { color: #999999 } @@ -13845,7 +13924,6 @@

      Accessible Combinations

      - .bg-black { background-color: #000000 } @@ -13873,6 +13951,7 @@

      Accessible Combinations

      + .bg-navy { background-color: #001B44 } @@ -13887,10 +13966,10 @@

      Accessible Combinations

    • + style="color:#777777;background-color:#CDECFF">
      Aa - 6.63 + 3.63

      In visual perception a color is almost never seen as it really @@ -13905,8 +13984,8 @@

      Accessible Combinations

      + .gray { color: #777777 } - .silver { color: #999999 } @@ -13941,7 +14020,6 @@

      Accessible Combinations

      - .bg-near-black { background-color: #111111 } @@ -13972,6 +14050,7 @@

      Accessible Combinations

      + .bg-lightest-blue { background-color: #CDECFF } @@ -13982,10 +14061,10 @@

      Accessible Combinations

    • + style="color:#777777;background-color:#F6FFFE">
      Aa - 3.10 + 4.40

      In visual perception a color is almost never seen as it really @@ -14000,8 +14079,8 @@

      Accessible Combinations

      + .gray { color: #777777 } - .silver { color: #999999 } @@ -14053,7 +14132,6 @@

      Accessible Combinations

      - .bg-purple { background-color: #5E2CA5 } @@ -14068,6 +14146,7 @@

      Accessible Combinations

      + .bg-washed-blue { background-color: #F6FFFE } @@ -14077,10 +14156,10 @@

      Accessible Combinations

    • + style="color:#777777;background-color:#E8FDF5">
      Aa - 5.94 + 4.22

      In visual perception a color is almost never seen as it really @@ -14095,8 +14174,8 @@

      Accessible Combinations

      + .gray { color: #777777 } - .silver { color: #999999 } @@ -14157,13 +14236,13 @@

      Accessible Combinations

      - .bg-navy { background-color: #001B44 } + .bg-washed-green { background-color: #E8FDF5 } @@ -14172,10 +14251,10 @@

      Accessible Combinations

    • + style="color:#777777;background-color:#FFFCEB">
      Aa - 3.18 + 4.34

      In visual perception a color is almost never seen as it really @@ -14190,8 +14269,8 @@

      Accessible Combinations

      + .gray { color: #777777 } - .silver { color: #999999 } @@ -14253,13 +14332,13 @@

      Accessible Combinations

      - .bg-dark-blue { background-color: #00449E } + .bg-washed-yellow { background-color: #FFFCEB }
      @@ -14267,10 +14346,10 @@

      Accessible Combinations

    • + style="color:#777777;background-color:#FFDFDF">
      Aa - 9.04 + 3.60

      In visual perception a color is almost never seen as it really @@ -14285,9 +14364,9 @@

      Accessible Combinations

      + .gray { color: #777777 } - .light-silver { color: #AAAAAA } @@ -14320,7 +14399,6 @@

      Accessible Combinations

      - .bg-black { background-color: #000000 } @@ -14355,6 +14433,8 @@

      Accessible Combinations

      + + .bg-washed-red { background-color: #FFDFDF }
      @@ -14362,10 +14442,10 @@

      Accessible Combinations

    • + style="color:#999999;background-color:#000000">
      Aa - 8.13 + 7.37

      In visual perception a color is almost never seen as it really @@ -14381,8 +14461,8 @@

      Accessible Combinations

      + .silver { color: #999999 } - .light-silver { color: #AAAAAA } @@ -14415,8 +14495,8 @@

      Accessible Combinations

      + .bg-black { background-color: #000000 } - .bg-near-black { background-color: #111111 } @@ -14457,10 +14537,10 @@

      Accessible Combinations

    • + style="color:#999999;background-color:#111111">
      Aa - 3.63 + 6.63

      In visual perception a color is almost never seen as it really @@ -14476,8 +14556,9 @@

      Accessible Combinations

      + .silver { color: #999999 } + - .light-silver { color: #AAAAAA } @@ -14510,6 +14591,7 @@

      Accessible Combinations

      + .bg-near-black { background-color: #111111 } @@ -14550,10 +14632,10 @@

      Accessible Combinations

    • + style="color:#999999;background-color:#333333">
      Aa - 3.21 + 4.43

      In visual perception a color is almost never seen as it really @@ -14569,8 +14651,8 @@

      Accessible Combinations

      + .silver { color: #999999 } - .light-silver { color: #AAAAAA } @@ -14605,8 +14687,8 @@

      Accessible Combinations

      + .bg-dark-gray { background-color: #333333 } - .bg-mid-gray { background-color: #555555 } @@ -14645,10 +14727,10 @@

      Accessible Combinations

    • + style="color:#999999;background-color:#5E2CA5">
      Aa - 3.80 + 3.10

      In visual perception a color is almost never seen as it really @@ -14664,8 +14746,8 @@

      Accessible Combinations

      + .silver { color: #999999 } - .light-silver { color: #AAAAAA } @@ -14740,10 +14822,10 @@

      Accessible Combinations

    • + style="color:#999999;background-color:#001B44">
      Aa - 7.29 + 5.94

      In visual perception a color is almost never seen as it really @@ -14759,8 +14841,8 @@

      Accessible Combinations

      + .silver { color: #999999 } - .light-silver { color: #AAAAAA } @@ -14835,10 +14917,10 @@

      Accessible Combinations

    • + style="color:#999999;background-color:#00449E">
      Aa - 3.90 + 3.18

      In visual perception a color is almost never seen as it really @@ -14854,8 +14936,8 @@

      Accessible Combinations

      + .silver { color: #999999 } - .light-silver { color: #AAAAAA } @@ -14930,10 +15012,10 @@

      Accessible Combinations

    • + style="color:#AAAAAA;background-color:#000000">
      Aa - 13.08 + 9.04

      In visual perception a color is almost never seen as it really @@ -14950,8 +15032,8 @@

      Accessible Combinations

      + .light-silver { color: #AAAAAA } - .moon-gray { color: #CCCCCC } @@ -15025,10 +15107,10 @@

      Accessible Combinations

    • + style="color:#AAAAAA;background-color:#111111">
      Aa - 11.76 + 8.13

      In visual perception a color is almost never seen as it really @@ -15045,8 +15127,8 @@

      Accessible Combinations

      + .light-silver { color: #AAAAAA } - .moon-gray { color: #CCCCCC } @@ -15120,10 +15202,10 @@

      Accessible Combinations

    • + style="color:#AAAAAA;background-color:#333333">
      Aa - 5.25 + 5.44

      In visual perception a color is almost never seen as it really @@ -15140,8 +15222,8 @@

      Accessible Combinations

      + .light-silver { color: #AAAAAA } - .moon-gray { color: #CCCCCC } @@ -15175,6 +15257,8 @@

      Accessible Combinations

      + .bg-dark-gray { background-color: #333333 } + @@ -15213,10 +15297,10 @@

      Accessible Combinations

    • + style="color:#AAAAAA;background-color:#555555">
      Aa - 4.64 + 3.21

      In visual perception a color is almost never seen as it really @@ -15233,8 +15317,8 @@

      Accessible Combinations

      + .light-silver { color: #AAAAAA } - .moon-gray { color: #CCCCCC } @@ -15308,10 +15392,10 @@

      Accessible Combinations

    • + style="color:#AAAAAA;background-color:#5E2CA5">
      Aa - 5.50 + 3.80

      In visual perception a color is almost never seen as it really @@ -15328,8 +15412,8 @@

      Accessible Combinations

      + .light-silver { color: #AAAAAA } - .moon-gray { color: #CCCCCC } @@ -15403,10 +15487,10 @@

      Accessible Combinations

    • + style="color:#AAAAAA;background-color:#001B44">
      Aa - 3.09 + 7.29

      In visual perception a color is almost never seen as it really @@ -15423,8 +15507,8 @@

      Accessible Combinations

      + .light-silver { color: #AAAAAA } - .moon-gray { color: #CCCCCC } @@ -15476,7 +15560,6 @@

      Accessible Combinations

      - .bg-dark-pink { background-color: #D5008F } @@ -15484,6 +15567,7 @@

      Accessible Combinations

      + .bg-navy { background-color: #001B44 } @@ -15498,10 +15582,10 @@

      Accessible Combinations

    • + style="color:#AAAAAA;background-color:#00449E">
      Aa - 3.45 + 3.90

      In visual perception a color is almost never seen as it really @@ -15518,8 +15602,8 @@

      Accessible Combinations

      + .light-silver { color: #AAAAAA } - .moon-gray { color: #CCCCCC } @@ -15575,11 +15659,11 @@

      Accessible Combinations

      - .bg-dark-green { background-color: #137752 } + .bg-dark-blue { background-color: #00449E } @@ -15593,10 +15677,10 @@

      Accessible Combinations

    • + style="color:#CCCCCC;background-color:#000000">
      Aa - 10.54 + 13.08

      In visual perception a color is almost never seen as it really @@ -15646,6 +15730,7 @@

      Accessible Combinations

      + .bg-black { background-color: #000000 } @@ -15673,7 +15758,6 @@

      Accessible Combinations

      - .bg-navy { background-color: #001B44 } @@ -15688,10 +15772,10 @@

      Accessible Combinations

    • + style="color:#CCCCCC;background-color:#111111">
      Aa - 5.64 + 11.76

      In visual perception a color is almost never seen as it really @@ -15742,6 +15826,7 @@

      Accessible Combinations

      + .bg-near-black { background-color: #111111 } @@ -15769,7 +15854,6 @@

      Accessible Combinations

      - .bg-dark-blue { background-color: #00449E } @@ -15783,10 +15867,10 @@

      Accessible Combinations

    • + style="color:#CCCCCC;background-color:#333333">
      Aa - 18.10 + 7.87

      In visual perception a color is almost never seen as it really @@ -15804,8 +15888,8 @@

      Accessible Combinations

      + .moon-gray { color: #CCCCCC } - .light-gray { color: #EEEEEE } @@ -15836,9 +15920,9 @@

      Accessible Combinations

      - .bg-black { background-color: #000000 } + .bg-dark-gray { background-color: #333333 } @@ -15878,10 +15962,10 @@

      Accessible Combinations

    • + style="color:#CCCCCC;background-color:#555555">
      Aa - 16.28 + 4.64

      In visual perception a color is almost never seen as it really @@ -15899,8 +15983,8 @@

      Accessible Combinations

      + .moon-gray { color: #CCCCCC } - .light-gray { color: #EEEEEE } @@ -15932,9 +16016,9 @@

      Accessible Combinations

      - .bg-near-black { background-color: #111111 } + .bg-mid-gray { background-color: #555555 } @@ -15973,10 +16057,10 @@

      Accessible Combinations

    • + style="color:#CCCCCC;background-color:#5E2CA5">
      Aa - 7.27 + 5.50

      In visual perception a color is almost never seen as it really @@ -15994,8 +16078,8 @@

      Accessible Combinations

      + .moon-gray { color: #CCCCCC } - .light-gray { color: #EEEEEE } @@ -16043,6 +16127,8 @@

      Accessible Combinations

      + + .bg-purple { background-color: #5E2CA5 } @@ -16066,10 +16152,10 @@

      Accessible Combinations

    • + style="color:#CCCCCC;background-color:#D5008F">
      Aa - 6.43 + 3.09

      In visual perception a color is almost never seen as it really @@ -16087,8 +16173,8 @@

      Accessible Combinations

      + .moon-gray { color: #CCCCCC } - .light-gray { color: #EEEEEE } @@ -16122,7 +16208,6 @@

      Accessible Combinations

      - .bg-mid-gray { background-color: #555555 } @@ -16140,6 +16225,7 @@

      Accessible Combinations

      + .bg-dark-pink { background-color: #D5008F } @@ -16161,10 +16247,10 @@

      Accessible Combinations

    • + style="color:#CCCCCC;background-color:#137752">
      Aa - 3.86 + 3.45

      In visual perception a color is almost never seen as it really @@ -16182,8 +16268,8 @@

      Accessible Combinations

      + .moon-gray { color: #CCCCCC } - .light-gray { color: #EEEEEE } @@ -16218,7 +16304,6 @@

      Accessible Combinations

      - .bg-gray { background-color: #777777 } @@ -16239,6 +16324,7 @@

      Accessible Combinations

      + .bg-dark-green { background-color: #137752 } @@ -16256,10 +16342,10 @@

      Accessible Combinations

    • + style="color:#CCCCCC;background-color:#001B44">
      Aa - 4.09 + 10.54

      In visual perception a color is almost never seen as it really @@ -16277,8 +16363,8 @@

      Accessible Combinations

      + .moon-gray { color: #CCCCCC } - .light-gray { color: #EEEEEE } @@ -16320,7 +16406,6 @@

      Accessible Combinations

      - .bg-dark-red { background-color: #E7040F } @@ -16337,6 +16422,7 @@

      Accessible Combinations

      + .bg-navy { background-color: #001B44 } @@ -16351,10 +16437,10 @@

      Accessible Combinations

    • + style="color:#CCCCCC;background-color:#00449E">
      Aa - 7.61 + 5.64

      In visual perception a color is almost never seen as it really @@ -16372,8 +16458,8 @@

      Accessible Combinations

      + .moon-gray { color: #CCCCCC } - .light-gray { color: #EEEEEE } @@ -16422,7 +16508,6 @@

      Accessible Combinations

      - .bg-purple { background-color: #5E2CA5 } @@ -16433,6 +16518,7 @@

      Accessible Combinations

      + .bg-dark-blue { background-color: #00449E } @@ -16446,10 +16532,10 @@

      Accessible Combinations

    • + style="color:#EEEEEE;background-color:#000000">
      Aa - 3.21 + 18.10

      In visual perception a color is almost never seen as it really @@ -16499,6 +16585,7 @@

      Accessible Combinations

      + .bg-black { background-color: #000000 } @@ -16518,7 +16605,6 @@

      Accessible Combinations

      - .bg-light-purple { background-color: #A463F2 } @@ -16541,10 +16627,10 @@

      Accessible Combinations

    • + style="color:#EEEEEE;background-color:#111111">
      Aa - 4.28 + 16.28

      In visual perception a color is almost never seen as it really @@ -16595,6 +16681,7 @@

      Accessible Combinations

      + .bg-near-black { background-color: #111111 } @@ -16614,7 +16701,6 @@

      Accessible Combinations

      - .bg-dark-pink { background-color: #D5008F } @@ -16636,10 +16722,10 @@

      Accessible Combinations

    • + style="color:#EEEEEE;background-color:#333333">
      Aa - 4.78 + 10.89

      In visual perception a color is almost never seen as it really @@ -16691,6 +16777,7 @@

      Accessible Combinations

      + .bg-dark-gray { background-color: #333333 } @@ -16713,7 +16800,6 @@

      Accessible Combinations

      - .bg-dark-green { background-color: #137752 } @@ -16731,10 +16817,10 @@

      Accessible Combinations

    • + style="color:#EEEEEE;background-color:#555555">
      Aa - 14.59 + 6.43

      In visual perception a color is almost never seen as it really @@ -16787,6 +16873,7 @@

      Accessible Combinations

      + .bg-mid-gray { background-color: #555555 } @@ -16811,7 +16898,6 @@

      Accessible Combinations

      - .bg-navy { background-color: #001B44 } @@ -16826,10 +16912,10 @@

      Accessible Combinations

    • + style="color:#EEEEEE;background-color:#777777">
      Aa - 7.80 + 3.86

      In visual perception a color is almost never seen as it really @@ -16883,6 +16969,9 @@

      Accessible Combinations

      + .bg-gray { background-color: #777777 } + + @@ -16905,9 +16994,6 @@

      Accessible Combinations

      - - - .bg-dark-blue { background-color: #00449E } @@ -16921,10 +17007,10 @@

      Accessible Combinations

    • + style="color:#EEEEEE;background-color:#E7040F">
      Aa - 3.15 + 4.09

      In visual perception a color is almost never seen as it really @@ -16985,6 +17071,8 @@

      Accessible Combinations

      + .bg-dark-red { background-color: #E7040F } + @@ -17014,10 +17102,10 @@

      Accessible Combinations

    • + style="color:#EEEEEE;background-color:#5E2CA5">
      Aa - 19.09 + 7.61

      In visual perception a color is almost never seen as it really @@ -17036,8 +17124,8 @@

      Accessible Combinations

      + .light-gray { color: #EEEEEE } - .near-white { color: #F4F4F4 } @@ -17067,7 +17155,6 @@

      Accessible Combinations

      - .bg-black { background-color: #000000 } @@ -17086,6 +17173,7 @@

      Accessible Combinations

      + .bg-purple { background-color: #5E2CA5 } @@ -17109,10 +17197,10 @@

      Accessible Combinations

    • + style="color:#EEEEEE;background-color:#A463F2">
      Aa - 17.17 + 3.21

      In visual perception a color is almost never seen as it really @@ -17131,8 +17219,8 @@

      Accessible Combinations

      + .light-gray { color: #EEEEEE } - .near-white { color: #F4F4F4 } @@ -17163,7 +17251,6 @@

      Accessible Combinations

      - .bg-near-black { background-color: #111111 } @@ -17182,6 +17269,7 @@

      Accessible Combinations

      + .bg-light-purple { background-color: #A463F2 } @@ -17204,10 +17292,10 @@

      Accessible Combinations

    • + style="color:#EEEEEE;background-color:#D5008F">
      Aa - 7.67 + 4.28

      In visual perception a color is almost never seen as it really @@ -17226,8 +17314,8 @@

      Accessible Combinations

      + .light-gray { color: #EEEEEE } - .near-white { color: #F4F4F4 } @@ -17276,6 +17364,8 @@

      Accessible Combinations

      + + .bg-dark-pink { background-color: #D5008F } @@ -17297,10 +17387,10 @@

      Accessible Combinations

    • + style="color:#EEEEEE;background-color:#137752">
      Aa - 6.78 + 4.78

      In visual perception a color is almost never seen as it really @@ -17319,8 +17409,8 @@

      Accessible Combinations

      + .light-gray { color: #EEEEEE } - .near-white { color: #F4F4F4 } @@ -17353,7 +17443,6 @@

      Accessible Combinations

      - .bg-mid-gray { background-color: #555555 } @@ -17375,6 +17464,7 @@

      Accessible Combinations

      + .bg-dark-green { background-color: #137752 } @@ -17392,10 +17482,10 @@

      Accessible Combinations

    • + style="color:#EEEEEE;background-color:#001B44">
      Aa - 4.07 + 14.59

      In visual perception a color is almost never seen as it really @@ -17414,8 +17504,8 @@

      Accessible Combinations

      + .light-gray { color: #EEEEEE } - .near-white { color: #F4F4F4 } @@ -17449,7 +17539,6 @@

      Accessible Combinations

      - .bg-gray { background-color: #777777 } @@ -17473,6 +17562,7 @@

      Accessible Combinations

      + .bg-navy { background-color: #001B44 } @@ -17487,10 +17577,10 @@

      Accessible Combinations

    • + style="color:#EEEEEE;background-color:#00449E">
      Aa - 4.32 + 7.80

      In visual perception a color is almost never seen as it really @@ -17509,8 +17599,8 @@

      Accessible Combinations

      + .light-gray { color: #EEEEEE } - .near-white { color: #F4F4F4 } @@ -17551,7 +17641,6 @@

      Accessible Combinations

      - .bg-dark-red { background-color: #E7040F } @@ -17569,6 +17658,7 @@

      Accessible Combinations

      + .bg-dark-blue { background-color: #00449E } @@ -17582,10 +17672,10 @@

      Accessible Combinations

    • + style="color:#EEEEEE;background-color:#357EDD">
      Aa - 3.15 + 3.49

      In visual perception a color is almost never seen as it really @@ -17604,8 +17694,8 @@

      Accessible Combinations

      + .light-gray { color: #EEEEEE } - .near-white { color: #F4F4F4 } @@ -17647,7 +17737,6 @@

      Accessible Combinations

      - .bg-red { background-color: #FF4136 } @@ -17665,6 +17754,7 @@

      Accessible Combinations

      + .bg-blue { background-color: #357EDD } @@ -17677,10 +17767,10 @@

      Accessible Combinations

    • + style="color:#F4F4F4;background-color:#000000">
      Aa - 8.02 + 19.09

      In visual perception a color is almost never seen as it really @@ -17730,6 +17820,7 @@

      Accessible Combinations

      + .bg-black { background-color: #000000 } @@ -17748,7 +17839,6 @@

      Accessible Combinations

      - .bg-purple { background-color: #5E2CA5 } @@ -17772,10 +17862,10 @@

      Accessible Combinations

    • + style="color:#F4F4F4;background-color:#111111">
      Aa - 3.38 + 17.17

      In visual perception a color is almost never seen as it really @@ -17826,6 +17916,7 @@

      Accessible Combinations

      + .bg-near-black { background-color: #111111 } @@ -17844,7 +17935,6 @@

      Accessible Combinations

      - .bg-light-purple { background-color: #A463F2 } @@ -17867,10 +17957,10 @@

      Accessible Combinations

    • + style="color:#F4F4F4;background-color:#333333">
      Aa - 4.52 + 11.49

      In visual perception a color is almost never seen as it really @@ -17922,6 +18012,7 @@

      Accessible Combinations

      + .bg-dark-gray { background-color: #333333 } @@ -17940,7 +18031,6 @@

      Accessible Combinations

      - .bg-dark-pink { background-color: #D5008F } @@ -17962,10 +18052,10 @@

      Accessible Combinations

    • + style="color:#F4F4F4;background-color:#555555">
      Aa - 5.04 + 6.78

      In visual perception a color is almost never seen as it really @@ -18018,6 +18108,7 @@

      Accessible Combinations

      + .bg-mid-gray { background-color: #555555 } @@ -18039,7 +18130,6 @@

      Accessible Combinations

      - .bg-dark-green { background-color: #137752 } @@ -18057,10 +18147,10 @@

      Accessible Combinations

    • + style="color:#F4F4F4;background-color:#777777">
      Aa - 15.39 + 4.07

      In visual perception a color is almost never seen as it really @@ -18114,6 +18204,7 @@

      Accessible Combinations

      + .bg-gray { background-color: #777777 } @@ -18137,7 +18228,6 @@

      Accessible Combinations

      - .bg-navy { background-color: #001B44 } @@ -18152,10 +18242,10 @@

      Accessible Combinations

    • + style="color:#F4F4F4;background-color:#E7040F">
      Aa - 8.23 + 4.32

      In visual perception a color is almost never seen as it really @@ -18216,6 +18306,7 @@

      Accessible Combinations

      + .bg-dark-red { background-color: #E7040F } @@ -18233,7 +18324,6 @@

      Accessible Combinations

      - .bg-dark-blue { background-color: #00449E } @@ -18247,10 +18337,10 @@

      Accessible Combinations

    • + style="color:#F4F4F4;background-color:#FF4136">
      Aa - 3.32 + 3.15

      In visual perception a color is almost never seen as it really @@ -18312,6 +18402,8 @@

      Accessible Combinations

      + .bg-red { background-color: #FF4136 } + @@ -18340,10 +18432,10 @@

      Accessible Combinations

    • + style="color:#F4F4F4;background-color:#5E2CA5">
      Aa - 21.00 + 8.02

      In visual perception a color is almost never seen as it really @@ -18363,8 +18455,8 @@

      Accessible Combinations

      + .near-white { color: #F4F4F4 } - .white { color: #FFFFFF } @@ -18393,7 +18485,6 @@

      Accessible Combinations

      - .bg-black { background-color: #000000 } @@ -18412,6 +18503,7 @@

      Accessible Combinations

      + .bg-purple { background-color: #5E2CA5 } @@ -18435,10 +18527,10 @@

      Accessible Combinations

    • + style="color:#F4F4F4;background-color:#A463F2">
      Aa - 18.88 + 3.38

      In visual perception a color is almost never seen as it really @@ -18458,8 +18550,8 @@

      Accessible Combinations

      + .near-white { color: #F4F4F4 } - .white { color: #FFFFFF } @@ -18489,7 +18581,6 @@

      Accessible Combinations

      - .bg-near-black { background-color: #111111 } @@ -18508,6 +18599,7 @@

      Accessible Combinations

      + .bg-light-purple { background-color: #A463F2 } @@ -18530,10 +18622,10 @@

      Accessible Combinations

    • + style="color:#F4F4F4;background-color:#D5008F">
      Aa - 8.43 + 4.52

      In visual perception a color is almost never seen as it really @@ -18553,8 +18645,9 @@

      Accessible Combinations

      + .near-white { color: #F4F4F4 } + - .white { color: #FFFFFF } @@ -18602,6 +18695,7 @@

      Accessible Combinations

      + .bg-dark-pink { background-color: #D5008F } @@ -18623,10 +18717,10 @@

      Accessible Combinations

    • + style="color:#F4F4F4;background-color:#137752">
      Aa - 7.46 + 5.04

      In visual perception a color is almost never seen as it really @@ -18646,8 +18740,8 @@

      Accessible Combinations

      + .near-white { color: #F4F4F4 } - .white { color: #FFFFFF } @@ -18679,7 +18773,6 @@

      Accessible Combinations

      - .bg-mid-gray { background-color: #555555 } @@ -18701,6 +18794,7 @@

      Accessible Combinations

      + .bg-dark-green { background-color: #137752 } @@ -18718,10 +18812,10 @@

      Accessible Combinations

    • + style="color:#F4F4F4;background-color:#001B44">
      Aa - 4.48 + 15.39

      In visual perception a color is almost never seen as it really @@ -18741,8 +18835,8 @@

      Accessible Combinations

      + .near-white { color: #F4F4F4 } - .white { color: #FFFFFF } @@ -18775,7 +18869,6 @@

      Accessible Combinations

      - .bg-gray { background-color: #777777 } @@ -18799,6 +18892,7 @@

      Accessible Combinations

      + .bg-navy { background-color: #001B44 } @@ -18813,10 +18907,10 @@

      Accessible Combinations

    • + style="color:#F4F4F4;background-color:#00449E">
      Aa - 4.75 + 8.23

      In visual perception a color is almost never seen as it really @@ -18836,8 +18930,8 @@

      Accessible Combinations

      + .near-white { color: #F4F4F4 } - .white { color: #FFFFFF } @@ -18877,7 +18971,6 @@

      Accessible Combinations

      - .bg-dark-red { background-color: #E7040F } @@ -18895,6 +18988,7 @@

      Accessible Combinations

      + .bg-dark-blue { background-color: #00449E } @@ -18908,10 +19002,10 @@

      Accessible Combinations

    • + style="color:#F4F4F4;background-color:#357EDD">
      Aa - 3.46 + 3.69

      In visual perception a color is almost never seen as it really @@ -18931,8 +19025,8 @@

      Accessible Combinations

      + .near-white { color: #F4F4F4 } - .white { color: #FFFFFF } @@ -18973,7 +19067,6 @@

      Accessible Combinations

      - .bg-red { background-color: #FF4136 } @@ -18991,6 +19084,7 @@

      Accessible Combinations

      + .bg-blue { background-color: #357EDD } @@ -19003,10 +19097,10 @@

      Accessible Combinations

    • + style="color:#FFFFFF;background-color:#000000">
      Aa - 8.83 + 21.00

      In visual perception a color is almost never seen as it really @@ -19056,6 +19150,7 @@

      Accessible Combinations

      + .bg-black { background-color: #000000 } @@ -19074,7 +19169,6 @@

      Accessible Combinations

      - .bg-purple { background-color: #5E2CA5 } @@ -19098,10 +19192,10 @@

      Accessible Combinations

    • + style="color:#FFFFFF;background-color:#111111">
      Aa - 3.72 + 18.88

      In visual perception a color is almost never seen as it really @@ -19152,6 +19246,7 @@

      Accessible Combinations

      + .bg-near-black { background-color: #111111 } @@ -19170,7 +19265,6 @@

      Accessible Combinations

      - .bg-light-purple { background-color: #A463F2 } @@ -19193,10 +19287,10 @@

      Accessible Combinations

    • + style="color:#FFFFFF;background-color:#333333">
      Aa - 4.97 + 12.63

      In visual perception a color is almost never seen as it really @@ -19248,6 +19342,7 @@

      Accessible Combinations

      + .bg-dark-gray { background-color: #333333 } @@ -19266,7 +19361,6 @@

      Accessible Combinations

      - .bg-dark-pink { background-color: #D5008F } @@ -19288,10 +19382,10 @@

      Accessible Combinations

    • + style="color:#FFFFFF;background-color:#555555">
      Aa - 3.15 + 7.46

      In visual perception a color is almost never seen as it really @@ -19344,6 +19438,7 @@

      Accessible Combinations

      + .bg-mid-gray { background-color: #555555 } @@ -19362,7 +19457,6 @@

      Accessible Combinations

      - .bg-hot-pink { background-color: #FF41B4 } @@ -19383,10 +19477,10 @@

      Accessible Combinations

    • + style="color:#FFFFFF;background-color:#777777">
      Aa - 5.54 + 4.48

      In visual perception a color is almost never seen as it really @@ -19440,6 +19534,7 @@

      Accessible Combinations

      + .bg-gray { background-color: #777777 } @@ -19460,7 +19555,6 @@

      Accessible Combinations

      - .bg-dark-green { background-color: #137752 } @@ -19478,10 +19572,10 @@

      Accessible Combinations

    • + style="color:#FFFFFF;background-color:#E7040F">
      Aa - 3.01 + 4.75

      In visual perception a color is almost never seen as it really @@ -19542,6 +19636,7 @@

      Accessible Combinations

      + .bg-dark-red { background-color: #E7040F } @@ -19556,7 +19651,6 @@

      Accessible Combinations

      - .bg-green { background-color: #19A974 } @@ -19573,10 +19667,10 @@

      Accessible Combinations

    • + style="color:#FFFFFF;background-color:#FF4136">
      Aa - 16.93 + 3.46

      In visual perception a color is almost never seen as it really @@ -19638,6 +19732,7 @@

      Accessible Combinations

      + .bg-red { background-color: #FF4136 } @@ -19653,7 +19748,6 @@

      Accessible Combinations

      - .bg-navy { background-color: #001B44 } @@ -19668,10 +19762,10 @@

      Accessible Combinations

    • + style="color:#FFFFFF;background-color:#5E2CA5">
      Aa - 9.05 + 8.83

      In visual perception a color is almost never seen as it really @@ -19739,6 +19833,7 @@

      Accessible Combinations

      + .bg-purple { background-color: #5E2CA5 } @@ -19749,7 +19844,6 @@

      Accessible Combinations

      - .bg-dark-blue { background-color: #00449E } @@ -19763,10 +19857,10 @@

      Accessible Combinations

    • + style="color:#FFFFFF;background-color:#A463F2">
      Aa - 3.65 + 3.72

      In visual perception a color is almost never seen as it really @@ -19834,6 +19928,8 @@

      Accessible Combinations

      + + .bg-light-purple { background-color: #A463F2 } @@ -19856,10 +19952,10 @@

      Accessible Combinations

    • + style="color:#FFFFFF;background-color:#D5008F">
      Aa - 4.42 + 4.97

      In visual perception a color is almost never seen as it really @@ -19880,8 +19976,8 @@

      Accessible Combinations

      + .white { color: #FFFFFF } - .dark-red { color: #E7040F } @@ -19909,7 +20005,6 @@

      Accessible Combinations

      - .bg-black { background-color: #000000 } @@ -19930,6 +20025,7 @@

      Accessible Combinations

      + .bg-dark-pink { background-color: #D5008F } @@ -19951,10 +20047,10 @@

      Accessible Combinations

    • + style="color:#FFFFFF;background-color:#FF41B4">
      Aa - 4.42 + 3.15

      In visual perception a color is almost never seen as it really @@ -19975,8 +20071,8 @@

      Accessible Combinations

      + .white { color: #FFFFFF } - .dark-red { color: #E7040F } @@ -20024,6 +20120,8 @@

      Accessible Combinations

      + + .bg-hot-pink { background-color: #FF41B4 } @@ -20044,10 +20142,10 @@

      Accessible Combinations

    • + style="color:#FFFFFF;background-color:#137752">
      Aa - 3.98 + 5.54

      In visual perception a color is almost never seen as it really @@ -20068,8 +20166,8 @@

      Accessible Combinations

      + .white { color: #FFFFFF } - .dark-red { color: #E7040F } @@ -20098,7 +20196,6 @@

      Accessible Combinations

      - .bg-near-black { background-color: #111111 } @@ -20122,6 +20219,7 @@

      Accessible Combinations

      + .bg-dark-green { background-color: #137752 } @@ -20139,10 +20237,10 @@

      Accessible Combinations

    • + style="color:#FFFFFF;background-color:#19A974">
      Aa - 4.09 + 3.01

      In visual perception a color is almost never seen as it really @@ -20163,8 +20261,8 @@

      Accessible Combinations

      + .white { color: #FFFFFF } - .dark-red { color: #E7040F } @@ -20200,7 +20298,6 @@

      Accessible Combinations

      - .bg-light-gray { background-color: #EEEEEE } @@ -20218,6 +20315,7 @@

      Accessible Combinations

      + .bg-green { background-color: #19A974 } @@ -20234,10 +20332,10 @@

      Accessible Combinations

    • + style="color:#FFFFFF;background-color:#001B44">
      Aa - 4.32 + 16.93

      In visual perception a color is almost never seen as it really @@ -20258,8 +20356,8 @@

      Accessible Combinations

      + .white { color: #FFFFFF } - .dark-red { color: #E7040F } @@ -20296,7 +20394,6 @@

      Accessible Combinations

      - .bg-near-white { background-color: #F4F4F4 } @@ -20315,6 +20412,7 @@

      Accessible Combinations

      + .bg-navy { background-color: #001B44 } @@ -20329,10 +20427,10 @@

      Accessible Combinations

    • + style="color:#FFFFFF;background-color:#00449E">
      Aa - 4.75 + 9.05

      In visual perception a color is almost never seen as it really @@ -20353,8 +20451,8 @@

      Accessible Combinations

      + .white { color: #FFFFFF } - .dark-red { color: #E7040F } @@ -20392,7 +20490,6 @@

      Accessible Combinations

      - .bg-white { background-color: #FFFFFF } @@ -20411,6 +20508,7 @@

      Accessible Combinations

      + .bg-dark-blue { background-color: #00449E } @@ -20424,10 +20522,10 @@

      Accessible Combinations

    • + style="color:#FFFFFF;background-color:#357EDD">
      Aa - 3.39 + 4.05

      In visual perception a color is almost never seen as it really @@ -20448,8 +20546,8 @@

      Accessible Combinations

      + .white { color: #FFFFFF } - .dark-red { color: #E7040F } @@ -20493,7 +20591,6 @@

      Accessible Combinations

      - .bg-yellow { background-color: #FFD700 } @@ -20507,6 +20604,7 @@

      Accessible Combinations

      + .bg-blue { background-color: #357EDD } @@ -20519,10 +20617,10 @@

      Accessible Combinations

    • + style="color:#E7040F;background-color:#000000">
      Aa - 4.13 + 4.42

      In visual perception a color is almost never seen as it really @@ -20572,6 +20670,8 @@

      Accessible Combinations

      + .bg-black { background-color: #000000 } + @@ -20588,8 +20688,6 @@

      Accessible Combinations

      - - .bg-light-yellow { background-color: #FBF1A9 } @@ -20614,10 +20712,10 @@

      Accessible Combinations

    • + style="color:#E7040F;background-color:#FFFF00">
      Aa - 3.45 + 4.42

      In visual perception a color is almost never seen as it really @@ -20692,8 +20790,6 @@

      Accessible Combinations

      - - .bg-light-green { background-color: #9EEBCF } @@ -20709,10 +20805,10 @@

      Accessible Combinations

    • + style="color:#E7040F;background-color:#111111">
      Aa - 3.57 + 3.98

      In visual perception a color is almost never seen as it really @@ -20763,6 +20859,7 @@

      Accessible Combinations

      + .bg-near-black { background-color: #111111 } @@ -20789,7 +20886,6 @@

      Accessible Combinations

      - .bg-navy { background-color: #001B44 } @@ -20804,10 +20900,10 @@

      Accessible Combinations

    • + style="color:#E7040F;background-color:#EEEEEE">
      Aa - 3.85 + 4.09

      In visual perception a color is almost never seen as it really @@ -20865,6 +20961,7 @@

      Accessible Combinations

      + .bg-light-gray { background-color: #EEEEEE } @@ -20888,7 +20985,6 @@

      Accessible Combinations

      - .bg-lightest-blue { background-color: #CDECFF } @@ -20899,10 +20995,10 @@

      Accessible Combinations

    • + style="color:#E7040F;background-color:#F4F4F4">
      Aa - 4.67 + 4.32

      In visual perception a color is almost never seen as it really @@ -20961,6 +21057,7 @@

      Accessible Combinations

      + .bg-near-white { background-color: #F4F4F4 } @@ -20984,7 +21081,6 @@

      Accessible Combinations

      - .bg-washed-blue { background-color: #F6FFFE } @@ -20994,10 +21090,10 @@

      Accessible Combinations

    • + style="color:#E7040F;background-color:#FFFFFF">
      Aa - 4.48 + 4.75

      In visual perception a color is almost never seen as it really @@ -21057,6 +21153,7 @@

      Accessible Combinations

      + .bg-white { background-color: #FFFFFF } @@ -21080,7 +21177,6 @@

      Accessible Combinations

      - .bg-washed-green { background-color: #E8FDF5 } @@ -21089,10 +21185,10 @@

      Accessible Combinations

    • + style="color:#E7040F;background-color:#FFD700">
      Aa - 4.61 + 3.39

      In visual perception a color is almost never seen as it really @@ -21158,6 +21254,7 @@

      Accessible Combinations

      + .bg-yellow { background-color: #FFD700 } @@ -21176,7 +21273,6 @@

      Accessible Combinations

      - .bg-washed-yellow { background-color: #FFFCEB }
      @@ -21184,10 +21280,10 @@

      Accessible Combinations

    • + style="color:#E7040F;background-color:#FBF1A9">
      Aa - 3.82 + 4.13

      In visual perception a color is almost never seen as it really @@ -21254,6 +21350,7 @@

      Accessible Combinations

      + .bg-light-yellow { background-color: #FBF1A9 } @@ -21271,8 +21368,6 @@

      Accessible Combinations

      - - .bg-washed-red { background-color: #FFDFDF }
      @@ -21280,10 +21375,10 @@

      Accessible Combinations

    • + style="color:#E7040F;background-color:#9EEBCF">
      Aa - 6.06 + 3.45

      In visual perception a color is almost never seen as it really @@ -21305,8 +21400,8 @@

      Accessible Combinations

      + .dark-red { color: #E7040F } - .red { color: #FF4136 } @@ -21333,7 +21428,6 @@

      Accessible Combinations

      - .bg-black { background-color: #000000 } @@ -21360,6 +21454,7 @@

      Accessible Combinations

      + .bg-light-green { background-color: #9EEBCF } @@ -21375,10 +21470,10 @@

      Accessible Combinations

    • + style="color:#E7040F;background-color:#001B44">
      Aa - 3.23 + 3.57

      In visual perception a color is almost never seen as it really @@ -21400,8 +21495,9 @@

      Accessible Combinations

      + .dark-red { color: #E7040F } + - .red { color: #FF4136 } @@ -21454,6 +21550,7 @@

      Accessible Combinations

      + .bg-navy { background-color: #001B44 } @@ -21468,10 +21565,10 @@

      Accessible Combinations

    • + style="color:#E7040F;background-color:#CDECFF">
      Aa - 5.45 + 3.85

      In visual perception a color is almost never seen as it really @@ -21493,8 +21590,8 @@

      Accessible Combinations

      + .dark-red { color: #E7040F } - .red { color: #FF4136 } @@ -21522,7 +21619,6 @@

      Accessible Combinations

      - .bg-near-black { background-color: #111111 } @@ -21553,6 +21649,7 @@

      Accessible Combinations

      + .bg-lightest-blue { background-color: #CDECFF } @@ -21563,10 +21660,10 @@

      Accessible Combinations

    • + style="color:#E7040F;background-color:#F6FFFE">
      Aa - 3.15 + 4.67

      In visual perception a color is almost never seen as it really @@ -21588,8 +21685,8 @@

      Accessible Combinations

      + .dark-red { color: #E7040F } - .red { color: #FF4136 } @@ -21625,7 +21722,6 @@

      Accessible Combinations

      - .bg-near-white { background-color: #F4F4F4 } @@ -21649,6 +21745,7 @@

      Accessible Combinations

      + .bg-washed-blue { background-color: #F6FFFE } @@ -21658,10 +21755,10 @@

      Accessible Combinations

    • + style="color:#E7040F;background-color:#E8FDF5">
      Aa - 3.46 + 4.48

      In visual perception a color is almost never seen as it really @@ -21683,8 +21780,8 @@

      Accessible Combinations

      + .dark-red { color: #E7040F } - .red { color: #FF4136 } @@ -21721,7 +21818,6 @@

      Accessible Combinations

      - .bg-white { background-color: #FFFFFF } @@ -21745,6 +21841,7 @@

      Accessible Combinations

      + .bg-washed-green { background-color: #E8FDF5 } @@ -21753,10 +21850,10 @@

      Accessible Combinations

    • + style="color:#E7040F;background-color:#FFFCEB">
      Aa - 3.01 + 4.61

      In visual perception a color is almost never seen as it really @@ -21778,8 +21875,8 @@

      Accessible Combinations

      + .dark-red { color: #E7040F } - .red { color: #FF4136 } @@ -21823,7 +21920,6 @@

      Accessible Combinations

      - .bg-light-yellow { background-color: #FBF1A9 } @@ -21841,6 +21937,7 @@

      Accessible Combinations

      + .bg-washed-yellow { background-color: #FFFCEB }
      @@ -21848,10 +21945,10 @@

      Accessible Combinations

    • + style="color:#E7040F;background-color:#FFDFDF">
      Aa - 4.89 + 3.82

      In visual perception a color is almost never seen as it really @@ -21873,8 +21970,8 @@

      Accessible Combinations

      + .dark-red { color: #E7040F } - .red { color: #FF4136 } @@ -21928,7 +22025,6 @@

      Accessible Combinations

      - .bg-navy { background-color: #001B44 } @@ -21936,6 +22032,8 @@

      Accessible Combinations

      + + .bg-washed-red { background-color: #FFDFDF }
      @@ -21943,10 +22041,10 @@

      Accessible Combinations

    • + style="color:#FF4136;background-color:#000000">
      Aa - 3.41 + 6.06

      In visual perception a color is almost never seen as it really @@ -21996,6 +22094,7 @@

      Accessible Combinations

      + .bg-black { background-color: #000000 } @@ -22028,7 +22127,6 @@

      Accessible Combinations

      - .bg-washed-blue { background-color: #F6FFFE } @@ -22038,10 +22136,10 @@

      Accessible Combinations

    • + style="color:#FF4136;background-color:#FFFF00">
      Aa - 3.27 + 3.23

      In visual perception a color is almost never seen as it really @@ -22123,8 +22221,6 @@

      Accessible Combinations

      - - .bg-washed-green { background-color: #E8FDF5 } @@ -22133,10 +22229,10 @@

      Accessible Combinations

    • + style="color:#FF4136;background-color:#111111">
      Aa - 3.36 + 5.45

      In visual perception a color is almost never seen as it really @@ -22187,6 +22283,7 @@

      Accessible Combinations

      + .bg-near-black { background-color: #111111 } @@ -22220,7 +22317,6 @@

      Accessible Combinations

      - .bg-washed-yellow { background-color: #FFFCEB }
      @@ -22228,10 +22324,10 @@

      Accessible Combinations

    • + style="color:#FF4136;background-color:#333333">
      Aa - 7.81 + 3.65

      In visual perception a color is almost never seen as it really @@ -22254,8 +22350,8 @@

      Accessible Combinations

      + .red { color: #FF4136 } - .light-red { color: #FF725C } @@ -22281,9 +22377,9 @@

      Accessible Combinations

      - .bg-black { background-color: #000000 } + .bg-dark-gray { background-color: #333333 } @@ -22323,10 +22419,10 @@

      Accessible Combinations

    • + style="color:#FF4136;background-color:#F4F4F4">
      Aa - 7.03 + 3.15

      In visual perception a color is almost never seen as it really @@ -22349,8 +22445,8 @@

      Accessible Combinations

      + .red { color: #FF4136 } - .light-red { color: #FF725C } @@ -22377,7 +22473,6 @@

      Accessible Combinations

      - .bg-near-black { background-color: #111111 } @@ -22386,6 +22481,7 @@

      Accessible Combinations

      + .bg-near-white { background-color: #F4F4F4 } @@ -22418,10 +22514,10 @@

      Accessible Combinations

    • + style="color:#FF4136;background-color:#FFFFFF">
      Aa - 3.14 + 3.46

      In visual perception a color is almost never seen as it really @@ -22444,8 +22540,8 @@

      Accessible Combinations

      + .red { color: #FF4136 } - .light-red { color: #FF725C } @@ -22481,6 +22577,8 @@

      Accessible Combinations

      + .bg-white { background-color: #FFFFFF } + @@ -22511,10 +22609,10 @@

      Accessible Combinations

    • + style="color:#FF4136;background-color:#FBF1A9">
      Aa - 3.28 + 3.01

      In visual perception a color is almost never seen as it really @@ -22537,8 +22635,8 @@

      Accessible Combinations

      + .red { color: #FF4136 } - .light-red { color: #FF725C } @@ -22581,8 +22679,8 @@

      Accessible Combinations

      + .bg-light-yellow { background-color: #FBF1A9 } - .bg-purple { background-color: #5E2CA5 } @@ -22606,10 +22704,10 @@

      Accessible Combinations

    • + style="color:#FF4136;background-color:#001B44">
      Aa - 6.30 + 4.89

      In visual perception a color is almost never seen as it really @@ -22632,8 +22730,8 @@

      Accessible Combinations

      + .red { color: #FF4136 } - .light-red { color: #FF725C } @@ -22701,10 +22799,10 @@

      Accessible Combinations

    • + style="color:#FF4136;background-color:#F6FFFE">
      Aa - 3.37 + 3.41

      In visual perception a color is almost never seen as it really @@ -22727,8 +22825,8 @@

      Accessible Combinations

      + .red { color: #FF4136 } - .light-red { color: #FF725C } @@ -22782,11 +22880,11 @@

      Accessible Combinations

      - .bg-dark-blue { background-color: #00449E } + .bg-washed-blue { background-color: #F6FFFE } @@ -22796,10 +22894,10 @@

      Accessible Combinations

    • + style="color:#FF4136;background-color:#E8FDF5">
      Aa - 8.01 + 3.27

      In visual perception a color is almost never seen as it really @@ -22822,6 +22920,7 @@

      Accessible Combinations

      + .red { color: #FF4136 } @@ -22847,7 +22946,6 @@

      Accessible Combinations

      - .bg-black { background-color: #000000 } @@ -22881,6 +22979,8 @@

      Accessible Combinations

      + + .bg-washed-green { background-color: #E8FDF5 } @@ -22889,10 +22989,10 @@

      Accessible Combinations

    • + style="color:#FF4136;background-color:#FFFCEB">
      Aa - 7.20 + 3.36

      In visual perception a color is almost never seen as it really @@ -22915,6 +23015,7 @@

      Accessible Combinations

      + .red { color: #FF4136 } @@ -22941,7 +23042,6 @@

      Accessible Combinations

      - .bg-near-black { background-color: #111111 } @@ -22975,6 +23075,8 @@

      Accessible Combinations

      + + .bg-washed-yellow { background-color: #FFFCEB }
      @@ -22982,10 +23084,10 @@

      Accessible Combinations

    • + style="color:#FF725C;background-color:#000000">
      Aa - 3.22 + 7.81

      In visual perception a color is almost never seen as it really @@ -23009,6 +23111,8 @@

      Accessible Combinations

      + .light-red { color: #FF725C } + @@ -23033,6 +23137,8 @@

      Accessible Combinations

      + .bg-black { background-color: #000000 } + @@ -23073,10 +23179,10 @@

      Accessible Combinations

    • + style="color:#FF725C;background-color:#111111">
      Aa - 3.37 + 7.03

      In visual perception a color is almost never seen as it really @@ -23100,6 +23206,8 @@

      Accessible Combinations

      + .light-red { color: #FF725C } + @@ -23125,6 +23233,7 @@

      Accessible Combinations

      + .bg-near-black { background-color: #111111 } @@ -23142,7 +23251,6 @@

      Accessible Combinations

      - .bg-purple { background-color: #5E2CA5 } @@ -23166,10 +23274,10 @@

      Accessible Combinations

    • + style="color:#FF725C;background-color:#333333">
      Aa - 6.46 + 4.70

      In visual perception a color is almost never seen as it really @@ -23193,6 +23301,8 @@

      Accessible Combinations

      + .light-red { color: #FF725C } + @@ -23219,6 +23329,7 @@

      Accessible Combinations

      + .bg-dark-gray { background-color: #333333 } @@ -23244,7 +23355,6 @@

      Accessible Combinations

      - .bg-navy { background-color: #001B44 } @@ -23259,10 +23369,10 @@

      Accessible Combinations

    • + style="color:#FF725C;background-color:#5E2CA5">
      Aa - 3.45 + 3.28

      In visual perception a color is almost never seen as it really @@ -23286,6 +23396,7 @@

      Accessible Combinations

      + .light-red { color: #FF725C } @@ -23328,6 +23439,8 @@

      Accessible Combinations

      + + .bg-purple { background-color: #5E2CA5 } @@ -23338,7 +23451,6 @@

      Accessible Combinations

      - .bg-dark-blue { background-color: #00449E } @@ -23352,10 +23464,10 @@

      Accessible Combinations

    • + style="color:#FF725C;background-color:#001B44">
      Aa - 11.11 + 6.30

      In visual perception a color is almost never seen as it really @@ -23379,6 +23491,8 @@

      Accessible Combinations

      + .light-red { color: #FF725C } + @@ -23403,7 +23517,6 @@

      Accessible Combinations

      - .bg-black { background-color: #000000 } @@ -23431,6 +23544,7 @@

      Accessible Combinations

      + .bg-navy { background-color: #001B44 } @@ -23445,10 +23559,10 @@

      Accessible Combinations

    • + style="color:#FF725C;background-color:#00449E">
      Aa - 9.99 + 3.37

      In visual perception a color is almost never seen as it really @@ -23472,6 +23586,8 @@

      Accessible Combinations

      + .light-red { color: #FF725C } + @@ -23497,7 +23613,6 @@

      Accessible Combinations

      - .bg-near-black { background-color: #111111 } @@ -23525,6 +23640,7 @@

      Accessible Combinations

      + .bg-dark-blue { background-color: #00449E } @@ -23538,10 +23654,10 @@

      Accessible Combinations

    • + style="color:#FF6300;background-color:#000000">
      Aa - 4.46 + 7.04

      In visual perception a color is almost never seen as it really @@ -23566,6 +23682,8 @@

      Accessible Combinations

      + .orange { color: #FF6300 } + @@ -23589,6 +23707,8 @@

      Accessible Combinations

      + .bg-black { background-color: #000000 } + @@ -23629,10 +23749,10 @@

      Accessible Combinations

    • + style="color:#FF6300;background-color:#111111">
      Aa - 3.95 + 6.33

      In visual perception a color is almost never seen as it really @@ -23657,6 +23777,8 @@

      Accessible Combinations

      + .orange { color: #FF6300 } + @@ -23681,9 +23803,9 @@

      Accessible Combinations

      + .bg-near-black { background-color: #111111 } - .bg-mid-gray { background-color: #555555 } @@ -23722,10 +23844,10 @@

      Accessible Combinations

    • + style="color:#FF6300;background-color:#333333">
      Aa - 4.67 + 4.23

      In visual perception a color is almost never seen as it really @@ -23750,6 +23872,7 @@

      Accessible Combinations

      + .orange { color: #FF6300 } @@ -23776,6 +23899,8 @@

      Accessible Combinations

      + .bg-dark-gray { background-color: #333333 } + @@ -23791,7 +23916,6 @@

      Accessible Combinations

      - .bg-purple { background-color: #5E2CA5 } @@ -23815,10 +23939,10 @@

      Accessible Combinations

    • + style="color:#FF6300;background-color:#001B44">
      Aa - 8.96 + 5.67

      In visual perception a color is almost never seen as it really @@ -23843,6 +23967,8 @@

      Accessible Combinations

      + .orange { color: #FF6300 } + @@ -23908,10 +24034,10 @@

      Accessible Combinations

    • + style="color:#FF6300;background-color:#00449E">
      Aa - 4.79 + 3.03

      In visual perception a color is almost never seen as it really @@ -23936,6 +24062,8 @@

      Accessible Combinations

      + .orange { color: #FF6300 } + @@ -24001,10 +24129,10 @@

      Accessible Combinations

    • + style="color:#FFB700;background-color:#000000">
      Aa - 14.97 + 12.03

      In visual perception a color is almost never seen as it really @@ -24030,8 +24158,8 @@

      Accessible Combinations

      + .gold { color: #FFB700 } - .yellow { color: #FFD700 } @@ -24096,10 +24224,10 @@

      Accessible Combinations

    • + style="color:#FFB700;background-color:#111111">
      Aa - 13.46 + 10.81

      In visual perception a color is almost never seen as it really @@ -24125,8 +24253,8 @@

      Accessible Combinations

      + .gold { color: #FFB700 } - .yellow { color: #FFD700 } @@ -24191,10 +24319,10 @@

      Accessible Combinations

    • + style="color:#FFB700;background-color:#333333">
      Aa - 6.01 + 7.24

      In visual perception a color is almost never seen as it really @@ -24220,8 +24348,8 @@

      Accessible Combinations

      + .gold { color: #FFB700 } - .yellow { color: #FFD700 } @@ -24246,6 +24374,8 @@

      Accessible Combinations

      + .bg-dark-gray { background-color: #333333 } + @@ -24284,10 +24414,10 @@

      Accessible Combinations

    • + style="color:#FFB700;background-color:#555555">
      Aa - 5.32 + 4.27

      In visual perception a color is almost never seen as it really @@ -24313,8 +24443,8 @@

      Accessible Combinations

      + .gold { color: #FFB700 } - .yellow { color: #FFD700 } @@ -24379,10 +24509,10 @@

      Accessible Combinations

    • + style="color:#FFB700;background-color:#5E2CA5">
      Aa - 3.19 + 5.05

      In visual perception a color is almost never seen as it really @@ -24408,8 +24538,8 @@

      Accessible Combinations

      + .gold { color: #FFB700 } - .yellow { color: #FFD700 } @@ -24436,7 +24566,6 @@

      Accessible Combinations

      - .bg-gray { background-color: #777777 } @@ -24451,6 +24580,7 @@

      Accessible Combinations

      + .bg-purple { background-color: #5E2CA5 } @@ -24474,10 +24604,10 @@

      Accessible Combinations

    • + style="color:#FFB700;background-color:#137752">
      Aa - 3.39 + 3.17

      In visual perception a color is almost never seen as it really @@ -24503,8 +24633,8 @@

      Accessible Combinations

      + .gold { color: #FFB700 } - .yellow { color: #FFD700 } @@ -24538,7 +24668,6 @@

      Accessible Combinations

      - .bg-dark-red { background-color: #E7040F } @@ -24552,6 +24681,7 @@

      Accessible Combinations

      + .bg-dark-green { background-color: #137752 } @@ -24569,10 +24699,10 @@

      Accessible Combinations

    • + style="color:#FFB700;background-color:#001B44">
      Aa - 6.29 + 9.70

      In visual perception a color is almost never seen as it really @@ -24598,8 +24728,8 @@

      Accessible Combinations

      + .gold { color: #FFB700 } - .yellow { color: #FFD700 } @@ -24640,7 +24770,6 @@

      Accessible Combinations

      - .bg-purple { background-color: #5E2CA5 } @@ -24650,6 +24779,7 @@

      Accessible Combinations

      + .bg-navy { background-color: #001B44 } @@ -24664,10 +24794,10 @@

      Accessible Combinations

    • + style="color:#FFB700;background-color:#00449E">
      Aa - 3.54 + 5.18

      In visual perception a color is almost never seen as it really @@ -24693,8 +24823,11 @@

      Accessible Combinations

      + .gold { color: #FFB700 } + + + - .yellow { color: #FFD700 } @@ -24734,10 +24867,6 @@

      Accessible Combinations

      - - - - .bg-dark-pink { background-color: #D5008F } @@ -24746,6 +24875,7 @@

      Accessible Combinations

      + .bg-dark-blue { background-color: #00449E } @@ -24759,10 +24889,10 @@

      Accessible Combinations

    • + style="color:#FFD700;background-color:#000000">
      Aa - 3.95 + 14.97

      In visual perception a color is almost never seen as it really @@ -24812,6 +24942,7 @@

      Accessible Combinations

      + .bg-black { background-color: #000000 } @@ -24836,7 +24967,6 @@

      Accessible Combinations

      - .bg-dark-green { background-color: #137752 } @@ -24854,10 +24984,10 @@

      Accessible Combinations

    • + style="color:#FFD700;background-color:#111111">
      Aa - 12.07 + 13.46

      In visual perception a color is almost never seen as it really @@ -24908,6 +25038,7 @@

      Accessible Combinations

      + .bg-near-black { background-color: #111111 } @@ -24934,7 +25065,6 @@

      Accessible Combinations

      - .bg-navy { background-color: #001B44 } @@ -24949,10 +25079,10 @@

      Accessible Combinations

    • + style="color:#FFD700;background-color:#333333">
      Aa - 6.45 + 9.01

      In visual perception a color is almost never seen as it really @@ -25004,6 +25134,7 @@

      Accessible Combinations

      + .bg-dark-gray { background-color: #333333 } @@ -25030,7 +25161,6 @@

      Accessible Combinations

      - .bg-dark-blue { background-color: #00449E } @@ -25044,10 +25174,10 @@

      Accessible Combinations

    • + style="color:#FFD700;background-color:#555555">
      Aa - 18.26 + 5.32

      In visual perception a color is almost never seen as it really @@ -25074,8 +25204,8 @@

      Accessible Combinations

      + .yellow { color: #FFD700 } - .light-yellow { color: #FBF1A9 } @@ -25097,10 +25227,10 @@

      Accessible Combinations

      - .bg-black { background-color: #000000 } + .bg-mid-gray { background-color: #555555 } @@ -25139,10 +25269,10 @@

      Accessible Combinations

    • + style="color:#FFD700;background-color:#777777">
      Aa - 16.42 + 3.19

      In visual perception a color is almost never seen as it really @@ -25169,8 +25299,8 @@

      Accessible Combinations

      + .yellow { color: #FFD700 } - .light-yellow { color: #FBF1A9 } @@ -25193,10 +25323,10 @@

      Accessible Combinations

      - .bg-near-black { background-color: #111111 } + .bg-gray { background-color: #777777 } @@ -25234,10 +25364,10 @@

      Accessible Combinations

    • + style="color:#FFD700;background-color:#E7040F">
      Aa - 7.33 + 3.39

      In visual perception a color is almost never seen as it really @@ -25264,8 +25394,8 @@

      Accessible Combinations

      + .yellow { color: #FFD700 } - .light-yellow { color: #FBF1A9 } @@ -25298,6 +25428,8 @@

      Accessible Combinations

      + .bg-dark-red { background-color: #E7040F } + @@ -25327,10 +25459,10 @@

      Accessible Combinations

    • + style="color:#FFD700;background-color:#5E2CA5">
      Aa - 6.48 + 6.29

      In visual perception a color is almost never seen as it really @@ -25357,8 +25489,8 @@

      Accessible Combinations

      + .yellow { color: #FFD700 } - .light-yellow { color: #FBF1A9 } @@ -25383,7 +25515,6 @@

      Accessible Combinations

      - .bg-mid-gray { background-color: #555555 } @@ -25399,6 +25530,7 @@

      Accessible Combinations

      + .bg-purple { background-color: #5E2CA5 } @@ -25422,10 +25554,10 @@

      Accessible Combinations

    • + style="color:#FFD700;background-color:#D5008F">
      Aa - 4.69 + 3.54

      In visual perception a color is almost never seen as it really @@ -25436,7 +25568,6 @@

      Accessible Combinations

      - .black { color: #000000 } @@ -25453,6 +25584,7 @@

      Accessible Combinations

      + .yellow { color: #FFD700 } @@ -25479,7 +25611,6 @@

      Accessible Combinations

      - .bg-gray { background-color: #777777 } @@ -25496,6 +25627,7 @@

      Accessible Combinations

      + .bg-dark-pink { background-color: #D5008F } @@ -25517,10 +25649,10 @@

      Accessible Combinations

    • + style="color:#FFD700;background-color:#137752">
      Aa - 4.13 + 3.95

      In visual perception a color is almost never seen as it really @@ -25547,8 +25679,8 @@

      Accessible Combinations

      + .yellow { color: #FFD700 } - .light-yellow { color: #FBF1A9 } @@ -25581,7 +25713,6 @@

      Accessible Combinations

      - .bg-dark-red { background-color: #E7040F } @@ -25595,6 +25726,7 @@

      Accessible Combinations

      + .bg-dark-green { background-color: #137752 } @@ -25612,10 +25744,10 @@

      Accessible Combinations

    • + style="color:#FFD700;background-color:#001B44">
      Aa - 3.01 + 12.07

      In visual perception a color is almost never seen as it really @@ -25642,8 +25774,8 @@

      Accessible Combinations

      + .yellow { color: #FFD700 } - .light-yellow { color: #FBF1A9 } @@ -25677,7 +25809,6 @@

      Accessible Combinations

      - .bg-red { background-color: #FF4136 } @@ -25693,6 +25824,7 @@

      Accessible Combinations

      + .bg-navy { background-color: #001B44 } @@ -25707,10 +25839,10 @@

      Accessible Combinations

    • + style="color:#FFD700;background-color:#00449E">
      Aa - 7.67 + 6.45

      In visual perception a color is almost never seen as it really @@ -25737,8 +25869,8 @@

      Accessible Combinations

      + .yellow { color: #FFD700 } - .light-yellow { color: #FBF1A9 } @@ -25778,7 +25910,6 @@

      Accessible Combinations

      - .bg-purple { background-color: #5E2CA5 } @@ -25789,6 +25920,7 @@

      Accessible Combinations

      + .bg-dark-blue { background-color: #00449E } @@ -25802,10 +25934,10 @@

      Accessible Combinations

    • + style="color:#FBF1A9;background-color:#000000">
      Aa - 3.23 + 18.26

      In visual perception a color is almost never seen as it really @@ -25855,6 +25987,7 @@

      Accessible Combinations

      + .bg-black { background-color: #000000 } @@ -25874,7 +26007,6 @@

      Accessible Combinations

      - .bg-light-purple { background-color: #A463F2 } @@ -25897,10 +26029,10 @@

      Accessible Combinations

    • + style="color:#FBF1A9;background-color:#111111">
      Aa - 4.32 + 16.42

      In visual perception a color is almost never seen as it really @@ -25951,6 +26083,7 @@

      Accessible Combinations

      + .bg-near-black { background-color: #111111 } @@ -25970,7 +26103,6 @@

      Accessible Combinations

      - .bg-dark-pink { background-color: #D5008F } @@ -25992,10 +26124,10 @@

      Accessible Combinations

    • + style="color:#FBF1A9;background-color:#333333">
      Aa - 4.82 + 10.98

      In visual perception a color is almost never seen as it really @@ -26047,6 +26179,7 @@

      Accessible Combinations

      + .bg-dark-gray { background-color: #333333 } @@ -26069,7 +26202,6 @@

      Accessible Combinations

      - .bg-dark-green { background-color: #137752 } @@ -26087,10 +26219,10 @@

      Accessible Combinations

    • + style="color:#FBF1A9;background-color:#555555">
      Aa - 14.72 + 6.48

      In visual perception a color is almost never seen as it really @@ -26143,6 +26275,7 @@

      Accessible Combinations

      + .bg-mid-gray { background-color: #555555 } @@ -26167,7 +26300,6 @@

      Accessible Combinations

      - .bg-navy { background-color: #001B44 } @@ -26182,10 +26314,10 @@

      Accessible Combinations

    • + style="color:#FBF1A9;background-color:#777777">
      Aa - 7.87 + 3.89

      In visual perception a color is almost never seen as it really @@ -26239,6 +26371,7 @@

      Accessible Combinations

      + .bg-gray { background-color: #777777 } @@ -26263,7 +26396,6 @@

      Accessible Combinations

      - .bg-dark-blue { background-color: #00449E } @@ -26277,10 +26409,10 @@

      Accessible Combinations

    • + style="color:#FBF1A9;background-color:#E7040F">
      Aa - 3.17 + 4.13

      In visual perception a color is almost never seen as it really @@ -26341,6 +26473,8 @@

      Accessible Combinations

      + .bg-dark-red { background-color: #E7040F } + @@ -26370,10 +26504,10 @@

      Accessible Combinations

    • + style="color:#FBF1A9;background-color:#FF4136">
      Aa - 8.22 + 3.01

      In visual perception a color is almost never seen as it really @@ -26401,8 +26535,8 @@

      Accessible Combinations

      + .light-yellow { color: #FBF1A9 } - .purple { color: #5E2CA5 } @@ -26435,6 +26569,8 @@

      Accessible Combinations

      + .bg-red { background-color: #FF4136 } + @@ -26463,10 +26599,10 @@

      Accessible Combinations

    • + style="color:#FBF1A9;background-color:#5E2CA5">
      Aa - 3.10 + 7.67

      In visual perception a color is almost never seen as it really @@ -26494,8 +26630,8 @@

      Accessible Combinations

      + .light-yellow { color: #FBF1A9 } - .purple { color: #5E2CA5 } @@ -26521,7 +26657,6 @@

      Accessible Combinations

      - .bg-silver { background-color: #999999 } @@ -26535,6 +26670,7 @@

      Accessible Combinations

      + .bg-purple { background-color: #5E2CA5 } @@ -26558,10 +26694,10 @@

      Accessible Combinations

    • + style="color:#FBF1A9;background-color:#A463F2">
      Aa - 3.80 + 3.23

      In visual perception a color is almost never seen as it really @@ -26589,8 +26725,8 @@

      Accessible Combinations

      + .light-yellow { color: #FBF1A9 } - .purple { color: #5E2CA5 } @@ -26617,7 +26753,6 @@

      Accessible Combinations

      - .bg-light-silver { background-color: #AAAAAA } @@ -26631,6 +26766,7 @@

      Accessible Combinations

      + .bg-light-purple { background-color: #A463F2 } @@ -26653,10 +26789,10 @@

      Accessible Combinations

    • + style="color:#FBF1A9;background-color:#D5008F">
      Aa - 5.50 + 4.32

      In visual perception a color is almost never seen as it really @@ -26684,8 +26820,8 @@

      Accessible Combinations

      + .light-yellow { color: #FBF1A9 } - .purple { color: #5E2CA5 } @@ -26713,7 +26849,6 @@

      Accessible Combinations

      - .bg-moon-gray { background-color: #CCCCCC } @@ -26727,6 +26862,7 @@

      Accessible Combinations

      + .bg-dark-pink { background-color: #D5008F } @@ -26748,10 +26884,10 @@

      Accessible Combinations

    • + style="color:#FBF1A9;background-color:#137752">
      Aa - 7.61 + 4.82

      In visual perception a color is almost never seen as it really @@ -26779,8 +26915,8 @@

      Accessible Combinations

      + .light-yellow { color: #FBF1A9 } - .purple { color: #5E2CA5 } @@ -26809,7 +26945,6 @@

      Accessible Combinations

      - .bg-light-gray { background-color: #EEEEEE } @@ -26826,6 +26961,7 @@

      Accessible Combinations

      + .bg-dark-green { background-color: #137752 } @@ -26843,10 +26979,10 @@

      Accessible Combinations

    • + style="color:#FBF1A9;background-color:#001B44">
      Aa - 8.02 + 14.72

      In visual perception a color is almost never seen as it really @@ -26874,8 +27010,8 @@

      Accessible Combinations

      + .light-yellow { color: #FBF1A9 } - .purple { color: #5E2CA5 } @@ -26905,7 +27041,6 @@

      Accessible Combinations

      - .bg-near-white { background-color: #F4F4F4 } @@ -26924,6 +27059,7 @@

      Accessible Combinations

      + .bg-navy { background-color: #001B44 } @@ -26938,10 +27074,10 @@

      Accessible Combinations

    • + style="color:#FBF1A9;background-color:#00449E">
      Aa - 8.83 + 7.87

      In visual perception a color is almost never seen as it really @@ -26969,8 +27105,8 @@

      Accessible Combinations

      + .light-yellow { color: #FBF1A9 } - .purple { color: #5E2CA5 } @@ -27001,7 +27137,6 @@

      Accessible Combinations

      - .bg-white { background-color: #FFFFFF } @@ -27020,6 +27155,7 @@

      Accessible Combinations

      + .bg-dark-blue { background-color: #00449E } @@ -27033,10 +27169,10 @@

      Accessible Combinations

    • + style="color:#FBF1A9;background-color:#357EDD">
      Aa - 3.28 + 3.52

      In visual perception a color is almost never seen as it really @@ -27064,8 +27200,8 @@

      Accessible Combinations

      + .light-yellow { color: #FBF1A9 } - .purple { color: #5E2CA5 } @@ -27099,7 +27235,6 @@

      Accessible Combinations

      - .bg-light-red { background-color: #FF725C } @@ -27116,6 +27251,7 @@

      Accessible Combinations

      + .bg-blue { background-color: #357EDD } @@ -27128,10 +27264,10 @@

      Accessible Combinations

    • + style="color:#5E2CA5;background-color:#FFFF00">
      Aa - 3.37 + 8.22

      In visual perception a color is almost never seen as it really @@ -27221,10 +27357,10 @@

      Accessible Combinations

    • + style="color:#5E2CA5;background-color:#999999">
      Aa - 4.67 + 3.10

      In visual perception a color is almost never seen as it really @@ -27279,6 +27415,8 @@

      Accessible Combinations

      + .bg-silver { background-color: #999999 } + @@ -27314,10 +27452,10 @@

      Accessible Combinations

    • + style="color:#5E2CA5;background-color:#AAAAAA">
      Aa - 6.29 + 3.80

      In visual perception a color is almost never seen as it really @@ -27373,6 +27511,7 @@

      Accessible Combinations

      + .bg-light-silver { background-color: #AAAAAA } @@ -27383,7 +27522,6 @@

      Accessible Combinations

      - .bg-yellow { background-color: #FFD700 } @@ -27409,10 +27547,10 @@

      Accessible Combinations

    • + style="color:#5E2CA5;background-color:#CCCCCC">
      Aa - 7.67 + 5.50

      In visual perception a color is almost never seen as it really @@ -27469,6 +27607,7 @@

      Accessible Combinations

      + .bg-moon-gray { background-color: #CCCCCC } @@ -27479,7 +27618,6 @@

      Accessible Combinations

      - .bg-light-yellow { background-color: #FBF1A9 } @@ -27504,10 +27642,10 @@

      Accessible Combinations

    • + style="color:#5E2CA5;background-color:#EEEEEE">
      Aa - 3.87 + 7.61

      In visual perception a color is almost never seen as it really @@ -27565,6 +27703,7 @@

      Accessible Combinations

      + .bg-light-gray { background-color: #EEEEEE } @@ -27579,7 +27718,6 @@

      Accessible Combinations

      - .bg-pink { background-color: #FF80CC } @@ -27599,10 +27737,10 @@

      Accessible Combinations

    • + style="color:#5E2CA5;background-color:#F4F4F4">
      Aa - 4.82 + 8.02

      In visual perception a color is almost never seen as it really @@ -27661,6 +27799,7 @@

      Accessible Combinations

      + .bg-near-white { background-color: #F4F4F4 } @@ -27675,7 +27814,6 @@

      Accessible Combinations

      - .bg-light-pink { background-color: #FFA3D7 } @@ -27694,10 +27832,10 @@

      Accessible Combinations

    • + style="color:#5E2CA5;background-color:#FFFFFF">
      Aa - 6.40 + 8.83

      In visual perception a color is almost never seen as it really @@ -27757,6 +27895,7 @@

      Accessible Combinations

      + .bg-white { background-color: #FFFFFF } @@ -27773,7 +27912,6 @@

      Accessible Combinations

      - .bg-light-green { background-color: #9EEBCF } @@ -27789,10 +27927,10 @@

      Accessible Combinations

    • + style="color:#5E2CA5;background-color:#FF725C">
      Aa - 4.52 + 3.28

      In visual perception a color is almost never seen as it really @@ -27855,6 +27993,8 @@

      Accessible Combinations

      + .bg-light-red { background-color: #FF725C } + @@ -27882,10 +28022,10 @@

      Accessible Combinations

    • + style="color:#5E2CA5;background-color:#FFB700">
      Aa - 7.16 + 5.05

      In visual perception a color is almost never seen as it really @@ -27950,6 +28090,7 @@

      Accessible Combinations

      + .bg-gold { background-color: #FFB700 } @@ -27966,7 +28107,6 @@

      Accessible Combinations

      - .bg-lightest-blue { background-color: #CDECFF } @@ -27977,10 +28117,10 @@

      Accessible Combinations

    • + style="color:#5E2CA5;background-color:#FFD700">
      Aa - 8.68 + 6.29

      In visual perception a color is almost never seen as it really @@ -28046,6 +28186,7 @@

      Accessible Combinations

      + .bg-yellow { background-color: #FFD700 } @@ -28062,7 +28203,6 @@

      Accessible Combinations

      - .bg-washed-blue { background-color: #F6FFFE } @@ -28072,10 +28212,10 @@

      Accessible Combinations

    • + style="color:#5E2CA5;background-color:#FBF1A9">
      Aa - 8.32 + 7.67

      In visual perception a color is almost never seen as it really @@ -28142,6 +28282,7 @@

      Accessible Combinations

      + .bg-light-yellow { background-color: #FBF1A9 } @@ -28158,7 +28299,6 @@

      Accessible Combinations

      - .bg-washed-green { background-color: #E8FDF5 } @@ -28167,10 +28307,10 @@

      Accessible Combinations

    • + style="color:#5E2CA5;background-color:#FF80CC">
      Aa - 8.56 + 3.87

      In visual perception a color is almost never seen as it really @@ -28242,6 +28382,7 @@

      Accessible Combinations

      + .bg-pink { background-color: #FF80CC } @@ -28254,7 +28395,6 @@

      Accessible Combinations

      - .bg-washed-yellow { background-color: #FFFCEB }
      @@ -28262,10 +28402,10 @@

      Accessible Combinations

    • + style="color:#5E2CA5;background-color:#FFA3D7">
      Aa - 7.09 + 4.82

      In visual perception a color is almost never seen as it really @@ -28338,6 +28478,7 @@

      Accessible Combinations

      + .bg-light-pink { background-color: #FFA3D7 } @@ -28349,8 +28490,6 @@

      Accessible Combinations

      - - .bg-washed-red { background-color: #FFDFDF }
      @@ -28358,10 +28497,10 @@

      Accessible Combinations

    • + style="color:#5E2CA5;background-color:#9EEBCF">
      Aa - 5.65 + 6.40

      In visual perception a color is almost never seen as it really @@ -28390,8 +28529,8 @@

      Accessible Combinations

      + .purple { color: #5E2CA5 } - .light-purple { color: #A463F2 } @@ -28411,7 +28550,6 @@

      Accessible Combinations

      - .bg-black { background-color: #000000 } @@ -28438,6 +28576,7 @@

      Accessible Combinations

      + .bg-light-green { background-color: #9EEBCF } @@ -28453,10 +28592,10 @@

      Accessible Combinations

    • + style="color:#5E2CA5;background-color:#96CCFF">
      Aa - 3.46 + 5.20

      In visual perception a color is almost never seen as it really @@ -28485,8 +28624,9 @@

      Accessible Combinations

      + .purple { color: #5E2CA5 } + - .light-purple { color: #A463F2 } @@ -28535,6 +28675,7 @@

      Accessible Combinations

      + .bg-light-blue { background-color: #96CCFF } @@ -28546,10 +28687,10 @@

      Accessible Combinations

    • + style="color:#5E2CA5;background-color:#CDECFF">
      Aa - 5.08 + 7.16

      In visual perception a color is almost never seen as it really @@ -28578,8 +28719,8 @@

      Accessible Combinations

      + .purple { color: #5E2CA5 } - .light-purple { color: #A463F2 } @@ -28600,7 +28741,6 @@

      Accessible Combinations

      - .bg-near-black { background-color: #111111 } @@ -28631,6 +28771,7 @@

      Accessible Combinations

      + .bg-lightest-blue { background-color: #CDECFF } @@ -28641,10 +28782,10 @@

      Accessible Combinations

    • + style="color:#5E2CA5;background-color:#F6FFFE">
      Aa - 3.21 + 8.68

      In visual perception a color is almost never seen as it really @@ -28673,8 +28814,8 @@

      Accessible Combinations

      + .purple { color: #5E2CA5 } - .light-purple { color: #A463F2 } @@ -28702,7 +28843,6 @@

      Accessible Combinations

      - .bg-light-gray { background-color: #EEEEEE } @@ -28727,6 +28867,7 @@

      Accessible Combinations

      + .bg-washed-blue { background-color: #F6FFFE } @@ -28736,10 +28877,10 @@

      Accessible Combinations

    • + style="color:#5E2CA5;background-color:#E8FDF5">
      Aa - 3.38 + 8.32

      In visual perception a color is almost never seen as it really @@ -28768,8 +28909,8 @@

      Accessible Combinations

      + .purple { color: #5E2CA5 } - .light-purple { color: #A463F2 } @@ -28798,7 +28939,6 @@

      Accessible Combinations

      - .bg-near-white { background-color: #F4F4F4 } @@ -28823,6 +28963,7 @@

      Accessible Combinations

      + .bg-washed-green { background-color: #E8FDF5 } @@ -28831,10 +28972,10 @@

      Accessible Combinations

    • + style="color:#5E2CA5;background-color:#FFFCEB">
      Aa - 3.72 + 8.56

      In visual perception a color is almost never seen as it really @@ -28863,8 +29004,8 @@

      Accessible Combinations

      + .purple { color: #5E2CA5 } - .light-purple { color: #A463F2 } @@ -28894,7 +29035,6 @@

      Accessible Combinations

      - .bg-white { background-color: #FFFFFF } @@ -28919,6 +29059,7 @@

      Accessible Combinations

      + .bg-washed-yellow { background-color: #FFFCEB }
      @@ -28926,10 +29067,10 @@

      Accessible Combinations

    • + style="color:#5E2CA5;background-color:#FFDFDF">
      Aa - 3.23 + 7.09

      In visual perception a color is almost never seen as it really @@ -28958,8 +29099,9 @@

      Accessible Combinations

      + .purple { color: #5E2CA5 } + - .light-purple { color: #A463F2 } @@ -28996,7 +29138,6 @@

      Accessible Combinations

      - .bg-light-yellow { background-color: #FBF1A9 } @@ -29014,6 +29155,7 @@

      Accessible Combinations

      + .bg-washed-red { background-color: #FFDFDF }
      @@ -29021,10 +29163,10 @@

      Accessible Combinations

    • + style="color:#A463F2;background-color:#000000">
      Aa - 4.55 + 5.65

      In visual perception a color is almost never seen as it really @@ -29074,6 +29216,7 @@

      Accessible Combinations

      + .bg-black { background-color: #000000 } @@ -29101,7 +29244,6 @@

      Accessible Combinations

      - .bg-navy { background-color: #001B44 } @@ -29116,10 +29258,10 @@

      Accessible Combinations

    • + style="color:#A463F2;background-color:#FFFF00">
      Aa - 3.02 + 3.46

      In visual perception a color is almost never seen as it really @@ -29199,8 +29341,6 @@

      Accessible Combinations

      - - .bg-lightest-blue { background-color: #CDECFF } @@ -29211,10 +29351,10 @@

      Accessible Combinations

    • + style="color:#A463F2;background-color:#111111">
      Aa - 3.66 + 5.08

      In visual perception a color is almost never seen as it really @@ -29265,6 +29405,7 @@

      Accessible Combinations

      + .bg-near-black { background-color: #111111 } @@ -29296,7 +29437,6 @@

      Accessible Combinations

      - .bg-washed-blue { background-color: #F6FFFE } @@ -29306,10 +29446,10 @@

      Accessible Combinations

    • + style="color:#A463F2;background-color:#333333">
      Aa - 3.51 + 3.40

      In visual perception a color is almost never seen as it really @@ -29361,6 +29501,7 @@

      Accessible Combinations

      + .bg-dark-gray { background-color: #333333 } @@ -29392,7 +29533,6 @@

      Accessible Combinations

      - .bg-washed-green { background-color: #E8FDF5 } @@ -29401,10 +29541,10 @@

      Accessible Combinations

    • + style="color:#A463F2;background-color:#EEEEEE">
      Aa - 3.61 + 3.21

      In visual perception a color is almost never seen as it really @@ -29462,6 +29602,7 @@

      Accessible Combinations

      + .bg-light-gray { background-color: #EEEEEE } @@ -29488,7 +29629,6 @@

      Accessible Combinations

      - .bg-washed-yellow { background-color: #FFFCEB }
      @@ -29496,10 +29636,10 @@

      Accessible Combinations

    • + style="color:#A463F2;background-color:#F4F4F4">
      Aa - 4.23 + 3.38

      In visual perception a color is almost never seen as it really @@ -29529,8 +29669,8 @@

      Accessible Combinations

      + .light-purple { color: #A463F2 } - .dark-pink { color: #D5008F } @@ -29549,7 +29689,6 @@

      Accessible Combinations

      - .bg-black { background-color: #000000 } @@ -29559,6 +29698,7 @@

      Accessible Combinations

      + .bg-near-white { background-color: #F4F4F4 } @@ -29591,10 +29731,10 @@

      Accessible Combinations

    • + style="color:#A463F2;background-color:#FFFFFF">
      Aa - 4.63 + 3.72

      In visual perception a color is almost never seen as it really @@ -29624,8 +29764,9 @@

      Accessible Combinations

      + .light-purple { color: #A463F2 } + - .dark-pink { color: #D5008F } @@ -29653,6 +29794,7 @@

      Accessible Combinations

      + .bg-white { background-color: #FFFFFF } @@ -29684,10 +29826,10 @@

      Accessible Combinations

    • + style="color:#A463F2;background-color:#FBF1A9">
      Aa - 3.80 + 3.23

      In visual perception a color is almost never seen as it really @@ -29717,8 +29859,8 @@

      Accessible Combinations

      + .light-purple { color: #A463F2 } - .dark-pink { color: #D5008F } @@ -29738,7 +29880,6 @@

      Accessible Combinations

      - .bg-near-black { background-color: #111111 } @@ -29755,6 +29896,7 @@

      Accessible Combinations

      + .bg-light-yellow { background-color: #FBF1A9 } @@ -29779,10 +29921,10 @@

      Accessible Combinations

    • + style="color:#A463F2;background-color:#001B44">
      Aa - 3.09 + 4.55

      In visual perception a color is almost never seen as it really @@ -29812,8 +29954,8 @@

      Accessible Combinations

      + .light-purple { color: #A463F2 } - .dark-pink { color: #D5008F } @@ -29839,7 +29981,6 @@

      Accessible Combinations

      - .bg-moon-gray { background-color: #CCCCCC } @@ -29860,6 +30001,7 @@

      Accessible Combinations

      + .bg-navy { background-color: #001B44 } @@ -29874,10 +30016,10 @@

      Accessible Combinations

    • + style="color:#A463F2;background-color:#CDECFF">
      Aa - 4.28 + 3.02

      In visual perception a color is almost never seen as it really @@ -29907,8 +30049,8 @@

      Accessible Combinations

      + .light-purple { color: #A463F2 } - .dark-pink { color: #D5008F } @@ -29935,7 +30077,6 @@

      Accessible Combinations

      - .bg-light-gray { background-color: #EEEEEE } @@ -29959,6 +30100,7 @@

      Accessible Combinations

      + .bg-lightest-blue { background-color: #CDECFF } @@ -29969,10 +30111,10 @@

      Accessible Combinations

    • + style="color:#A463F2;background-color:#F6FFFE">
      Aa - 4.52 + 3.66

      In visual perception a color is almost never seen as it really @@ -30002,8 +30144,8 @@

      Accessible Combinations

      + .light-purple { color: #A463F2 } - .dark-pink { color: #D5008F } @@ -30031,7 +30173,6 @@

      Accessible Combinations

      - .bg-near-white { background-color: #F4F4F4 } @@ -30055,6 +30196,7 @@

      Accessible Combinations

      + .bg-washed-blue { background-color: #F6FFFE } @@ -30064,10 +30206,10 @@

      Accessible Combinations

    • + style="color:#A463F2;background-color:#E8FDF5">
      Aa - 4.97 + 3.51

      In visual perception a color is almost never seen as it really @@ -30097,8 +30239,8 @@

      Accessible Combinations

      + .light-purple { color: #A463F2 } - .dark-pink { color: #D5008F } @@ -30127,7 +30269,6 @@

      Accessible Combinations

      - .bg-white { background-color: #FFFFFF } @@ -30151,6 +30292,7 @@

      Accessible Combinations

      + .bg-washed-green { background-color: #E8FDF5 } @@ -30159,10 +30301,10 @@

      Accessible Combinations

    • + style="color:#A463F2;background-color:#FFFCEB">
      Aa - 3.54 + 3.61

      In visual perception a color is almost never seen as it really @@ -30192,8 +30334,8 @@

      Accessible Combinations

      + .light-purple { color: #A463F2 } - .dark-pink { color: #D5008F } @@ -30228,7 +30370,6 @@

      Accessible Combinations

      - .bg-yellow { background-color: #FFD700 } @@ -30247,6 +30388,7 @@

      Accessible Combinations

      + .bg-washed-yellow { background-color: #FFFCEB }
      @@ -30254,10 +30396,10 @@

      Accessible Combinations

    • + style="color:#D5008F;background-color:#000000">
      Aa - 4.32 + 4.23

      In visual perception a color is almost never seen as it really @@ -30307,6 +30449,7 @@

      Accessible Combinations

      + .bg-black { background-color: #000000 } @@ -30324,7 +30467,6 @@

      Accessible Combinations

      - .bg-light-yellow { background-color: #FBF1A9 } @@ -30349,10 +30491,10 @@

      Accessible Combinations

    • + style="color:#D5008F;background-color:#FFFF00">
      Aa - 3.61 + 4.63

      In visual perception a color is almost never seen as it really @@ -30427,8 +30569,6 @@

      Accessible Combinations

      - - .bg-light-green { background-color: #9EEBCF } @@ -30444,10 +30584,10 @@

      Accessible Combinations

    • + style="color:#D5008F;background-color:#111111">
      Aa - 3.41 + 3.80

      In visual perception a color is almost never seen as it really @@ -30498,6 +30638,7 @@

      Accessible Combinations

      + .bg-near-black { background-color: #111111 } @@ -30524,7 +30665,6 @@

      Accessible Combinations

      - .bg-navy { background-color: #001B44 } @@ -30539,10 +30679,10 @@

      Accessible Combinations

    • + style="color:#D5008F;background-color:#CCCCCC">
      Aa - 4.03 + 3.09

      In visual perception a color is almost never seen as it really @@ -30599,6 +30739,7 @@

      Accessible Combinations

      + .bg-moon-gray { background-color: #CCCCCC } @@ -30623,7 +30764,6 @@

      Accessible Combinations

      - .bg-lightest-blue { background-color: #CDECFF } @@ -30634,10 +30774,10 @@

      Accessible Combinations

    • + style="color:#D5008F;background-color:#EEEEEE">
      Aa - 4.89 + 4.28

      In visual perception a color is almost never seen as it really @@ -30695,6 +30835,7 @@

      Accessible Combinations

      + .bg-light-gray { background-color: #EEEEEE } @@ -30719,7 +30860,6 @@

      Accessible Combinations

      - .bg-washed-blue { background-color: #F6FFFE } @@ -30729,10 +30869,10 @@

      Accessible Combinations

    • + style="color:#D5008F;background-color:#F4F4F4">
      Aa - 4.69 + 4.52

      In visual perception a color is almost never seen as it really @@ -30791,6 +30931,7 @@

      Accessible Combinations

      + .bg-near-white { background-color: #F4F4F4 } @@ -30815,7 +30956,6 @@

      Accessible Combinations

      - .bg-washed-green { background-color: #E8FDF5 } @@ -30824,10 +30964,10 @@

      Accessible Combinations

    • + style="color:#D5008F;background-color:#FFFFFF">
      Aa - 4.82 + 4.97

      In visual perception a color is almost never seen as it really @@ -30887,6 +31027,7 @@

      Accessible Combinations

      + .bg-white { background-color: #FFFFFF } @@ -30911,7 +31052,6 @@

      Accessible Combinations

      - .bg-washed-yellow { background-color: #FFFCEB }
      @@ -30919,10 +31059,10 @@

      Accessible Combinations

    • + style="color:#D5008F;background-color:#FFD700">
      Aa - 3.99 + 3.54

      In visual perception a color is almost never seen as it really @@ -30988,6 +31128,7 @@

      Accessible Combinations

      + .bg-yellow { background-color: #FFD700 } @@ -31006,8 +31147,6 @@

      Accessible Combinations

      - - .bg-washed-red { background-color: #FFDFDF }
      @@ -31015,10 +31154,10 @@

      Accessible Combinations

    • + style="color:#D5008F;background-color:#FBF1A9">
      Aa - 6.67 + 4.32

      In visual perception a color is almost never seen as it really @@ -31049,8 +31188,8 @@

      Accessible Combinations

      + .dark-pink { color: #D5008F } - .hot-pink { color: #FF41B4 } @@ -31068,7 +31207,6 @@

      Accessible Combinations

      - .bg-black { background-color: #000000 } @@ -31086,6 +31224,7 @@

      Accessible Combinations

      + .bg-light-yellow { background-color: #FBF1A9 } @@ -31110,10 +31249,10 @@

      Accessible Combinations

    • + style="color:#D5008F;background-color:#9EEBCF">
      Aa - 6.00 + 3.61

      In visual perception a color is almost never seen as it really @@ -31144,8 +31283,8 @@

      Accessible Combinations

      + .dark-pink { color: #D5008F } - .hot-pink { color: #FF41B4 } @@ -31164,7 +31303,6 @@

      Accessible Combinations

      - .bg-near-black { background-color: #111111 } @@ -31190,6 +31328,7 @@

      Accessible Combinations

      + .bg-light-green { background-color: #9EEBCF } @@ -31205,10 +31344,10 @@

      Accessible Combinations

    • + style="color:#D5008F;background-color:#001B44">
      Aa - 3.15 + 3.41

      In visual perception a color is almost never seen as it really @@ -31239,8 +31378,8 @@

      Accessible Combinations

      + .dark-pink { color: #D5008F } - .hot-pink { color: #FF41B4 } @@ -31268,7 +31407,6 @@

      Accessible Combinations

      - .bg-white { background-color: #FFFFFF } @@ -31286,6 +31424,7 @@

      Accessible Combinations

      + .bg-navy { background-color: #001B44 } @@ -31300,10 +31439,10 @@

      Accessible Combinations

    • + style="color:#D5008F;background-color:#CDECFF">
      Aa - 5.38 + 4.03

      In visual perception a color is almost never seen as it really @@ -31334,8 +31473,8 @@

      Accessible Combinations

      + .dark-pink { color: #D5008F } - .hot-pink { color: #FF41B4 } @@ -31380,11 +31519,11 @@

      Accessible Combinations

      - .bg-navy { background-color: #001B44 } + .bg-lightest-blue { background-color: #CDECFF } @@ -31395,10 +31534,10 @@

      Accessible Combinations

    • + style="color:#D5008F;background-color:#F6FFFE">
      Aa - 3.10 + 4.89

      In visual perception a color is almost never seen as it really @@ -31429,8 +31568,8 @@

      Accessible Combinations

      + .dark-pink { color: #D5008F } - .hot-pink { color: #FF41B4 } @@ -31490,10 +31629,10 @@

      Accessible Combinations

    • + style="color:#D5008F;background-color:#E8FDF5">
      Aa - 3.06 + 4.69

      In visual perception a color is almost never seen as it really @@ -31524,8 +31663,8 @@

      Accessible Combinations

      + .dark-pink { color: #D5008F } - .hot-pink { color: #FF41B4 } @@ -31576,8 +31715,8 @@

      Accessible Combinations

      + .bg-washed-green { background-color: #E8FDF5 } - .bg-washed-yellow { background-color: #FFFCEB }
      @@ -31585,10 +31724,10 @@

      Accessible Combinations

    • + style="color:#D5008F;background-color:#FFFCEB">
      Aa - 9.21 + 4.82

      In visual perception a color is almost never seen as it really @@ -31618,32 +31757,31 @@

      Accessible Combinations

      + + .dark-pink { color: #D5008F } + + + + + + + + + + + + + + + + + + + + - .pink { color: #FF80CC } - - - - - - - - - - - - - - - - - .bg-black { background-color: #000000 } - - - - - @@ -31673,6 +31811,7 @@

      Accessible Combinations

      + .bg-washed-yellow { background-color: #FFFCEB }
      @@ -31680,10 +31819,10 @@

      Accessible Combinations

    • + style="color:#D5008F;background-color:#FFDFDF">
      Aa - 8.28 + 3.99

      In visual perception a color is almost never seen as it really @@ -31714,9 +31853,10 @@

      Accessible Combinations

      + .dark-pink { color: #D5008F } + - .pink { color: #FF80CC } @@ -31734,7 +31874,6 @@

      Accessible Combinations

      - .bg-near-black { background-color: #111111 } @@ -31768,6 +31907,7 @@

      Accessible Combinations

      + .bg-washed-red { background-color: #FFDFDF }
      @@ -31775,10 +31915,10 @@

      Accessible Combinations

    • + style="color:#FF41B4;background-color:#000000">
      Aa - 3.70 + 6.67

      In visual perception a color is almost never seen as it really @@ -31810,8 +31950,8 @@

      Accessible Combinations

      + .hot-pink { color: #FF41B4 } - .pink { color: #FF80CC } @@ -31828,6 +31968,8 @@

      Accessible Combinations

      + .bg-black { background-color: #000000 } + @@ -31868,10 +32010,10 @@

      Accessible Combinations

    • + style="color:#FF41B4;background-color:#111111">
      Aa - 3.27 + 6.00

      In visual perception a color is almost never seen as it really @@ -31903,8 +32045,8 @@

      Accessible Combinations

      + .hot-pink { color: #FF41B4 } - .pink { color: #FF80CC } @@ -31922,9 +32064,9 @@

      Accessible Combinations

      + .bg-near-black { background-color: #111111 } - .bg-mid-gray { background-color: #555555 } @@ -31963,10 +32105,10 @@

      Accessible Combinations

    • + style="color:#FF41B4;background-color:#333333">
      Aa - 3.87 + 4.01

      In visual perception a color is almost never seen as it really @@ -31998,8 +32140,8 @@

      Accessible Combinations

      + .hot-pink { color: #FF41B4 } - .pink { color: #FF80CC } @@ -32018,6 +32160,7 @@

      Accessible Combinations

      + .bg-dark-gray { background-color: #333333 } @@ -32034,7 +32177,6 @@

      Accessible Combinations

      - .bg-purple { background-color: #5E2CA5 } @@ -32058,10 +32200,10 @@

      Accessible Combinations

    • + style="color:#FF41B4;background-color:#FFFFFF">
      Aa - 7.43 + 3.15

      In visual perception a color is almost never seen as it really @@ -32093,8 +32235,8 @@

      Accessible Combinations

      + .hot-pink { color: #FF41B4 } - .pink { color: #FF80CC } @@ -32121,6 +32263,7 @@

      Accessible Combinations

      + .bg-white { background-color: #FFFFFF } @@ -32138,7 +32281,6 @@

      Accessible Combinations

      - .bg-navy { background-color: #001B44 } @@ -32153,10 +32295,10 @@

      Accessible Combinations

    • + style="color:#FF41B4;background-color:#001B44">
      Aa - 3.97 + 5.38

      In visual perception a color is almost never seen as it really @@ -32188,8 +32330,8 @@

      Accessible Combinations

      + .hot-pink { color: #FF41B4 } - .pink { color: #FF80CC } @@ -32233,8 +32375,8 @@

      Accessible Combinations

      + .bg-navy { background-color: #001B44 } - .bg-dark-blue { background-color: #00449E } @@ -32248,10 +32390,10 @@

      Accessible Combinations

    • + style="color:#FF41B4;background-color:#F6FFFE">
      Aa - 11.47 + 3.10

      In visual perception a color is almost never seen as it really @@ -32283,9 +32425,9 @@

      Accessible Combinations

      + .hot-pink { color: #FF41B4 } - .light-pink { color: #FFA3D7 } @@ -32301,7 +32443,6 @@

      Accessible Combinations

      - .bg-black { background-color: #000000 } @@ -32334,6 +32475,7 @@

      Accessible Combinations

      + .bg-washed-blue { background-color: #F6FFFE } @@ -32343,10 +32485,10 @@

      Accessible Combinations

    • + style="color:#FF41B4;background-color:#FFFCEB">
      Aa - 10.32 + 3.06

      In visual perception a color is almost never seen as it really @@ -32378,9 +32520,9 @@

      Accessible Combinations

      + .hot-pink { color: #FF41B4 } - .light-pink { color: #FFA3D7 } @@ -32397,7 +32539,6 @@

      Accessible Combinations

      - .bg-near-black { background-color: #111111 } @@ -32431,6 +32572,7 @@

      Accessible Combinations

      + .bg-washed-yellow { background-color: #FFFCEB }
      @@ -32438,10 +32580,10 @@

      Accessible Combinations

    • + style="color:#FF80CC;background-color:#000000">
      Aa - 4.61 + 9.21

      In visual perception a color is almost never seen as it really @@ -32474,8 +32616,8 @@

      Accessible Combinations

      + .pink { color: #FF80CC } - .light-pink { color: #FFA3D7 } @@ -32491,6 +32633,8 @@

      Accessible Combinations

      + .bg-black { background-color: #000000 } + @@ -32531,10 +32675,10 @@

      Accessible Combinations

    • + style="color:#FF80CC;background-color:#111111">
      Aa - 4.07 + 8.28

      In visual perception a color is almost never seen as it really @@ -32567,8 +32711,8 @@

      Accessible Combinations

      + .pink { color: #FF80CC } - .light-pink { color: #FFA3D7 } @@ -32585,9 +32729,9 @@

      Accessible Combinations

      + .bg-near-black { background-color: #111111 } - .bg-mid-gray { background-color: #555555 } @@ -32626,10 +32770,10 @@

      Accessible Combinations

    • + style="color:#FF80CC;background-color:#333333">
      Aa - 4.82 + 5.54

      In visual perception a color is almost never seen as it really @@ -32662,8 +32806,8 @@

      Accessible Combinations

      + .pink { color: #FF80CC } - .light-pink { color: #FFA3D7 } @@ -32681,6 +32825,7 @@

      Accessible Combinations

      + .bg-dark-gray { background-color: #333333 } @@ -32697,7 +32842,6 @@

      Accessible Combinations

      - .bg-purple { background-color: #5E2CA5 } @@ -32721,10 +32865,10 @@

      Accessible Combinations

    • + style="color:#FF80CC;background-color:#555555">
      Aa - 3.03 + 3.27

      In visual perception a color is almost never seen as it really @@ -32757,8 +32901,8 @@

      Accessible Combinations

      + .pink { color: #FF80CC } - .light-pink { color: #FFA3D7 } @@ -32777,6 +32921,7 @@

      Accessible Combinations

      + .bg-mid-gray { background-color: #555555 } @@ -32798,7 +32943,6 @@

      Accessible Combinations

      - .bg-dark-green { background-color: #137752 } @@ -32816,10 +32960,10 @@

      Accessible Combinations

    • + style="color:#FF80CC;background-color:#5E2CA5">
      Aa - 9.25 + 3.87

      In visual perception a color is almost never seen as it really @@ -32852,8 +32996,8 @@

      Accessible Combinations

      + .pink { color: #FF80CC } - .light-pink { color: #FFA3D7 } @@ -32887,6 +33031,7 @@

      Accessible Combinations

      + .bg-purple { background-color: #5E2CA5 } @@ -32896,7 +33041,6 @@

      Accessible Combinations

      - .bg-navy { background-color: #001B44 } @@ -32911,10 +33055,10 @@

      Accessible Combinations

    • + style="color:#FF80CC;background-color:#001B44">
      Aa - 4.94 + 7.43

      In visual perception a color is almost never seen as it really @@ -32947,8 +33091,8 @@

      Accessible Combinations

      + .pink { color: #FF80CC } - .light-pink { color: #FFA3D7 } @@ -32991,8 +33135,8 @@

      Accessible Combinations

      + .bg-navy { background-color: #001B44 } - .bg-dark-blue { background-color: #00449E } @@ -33006,10 +33150,10 @@

      Accessible Combinations

    • + style="color:#FF80CC;background-color:#00449E">
      Aa - 3.79 + 3.97

      In visual perception a color is almost never seen as it really @@ -33042,9 +33186,9 @@

      Accessible Combinations

      + .pink { color: #FF80CC } - .dark-green { color: #137752 } @@ -33059,7 +33203,6 @@

      Accessible Combinations

      - .bg-black { background-color: #000000 } @@ -33088,6 +33231,7 @@

      Accessible Combinations

      + .bg-dark-blue { background-color: #00449E } @@ -33101,10 +33245,10 @@

      Accessible Combinations

    • + style="color:#FFA3D7;background-color:#000000">
      Aa - 5.16 + 11.47

      In visual perception a color is almost never seen as it really @@ -33138,8 +33282,8 @@

      Accessible Combinations

      + .light-pink { color: #FFA3D7 } - .dark-green { color: #137752 } @@ -33154,6 +33298,8 @@

      Accessible Combinations

      + .bg-black { background-color: #000000 } + @@ -33194,10 +33340,10 @@

      Accessible Combinations

    • + style="color:#FFA3D7;background-color:#111111">
      Aa - 3.41 + 10.32

      In visual perception a color is almost never seen as it really @@ -33231,8 +33377,8 @@

      Accessible Combinations

      + .light-pink { color: #FFA3D7 } - .dark-green { color: #137752 } @@ -33289,10 +33435,10 @@

      Accessible Combinations

    • + style="color:#FFA3D7;background-color:#333333">
      Aa - 3.45 + 6.90

      In visual perception a color is almost never seen as it really @@ -33326,8 +33472,8 @@

      Accessible Combinations

      + .light-pink { color: #FFA3D7 } - .dark-green { color: #137752 } @@ -33344,12 +33490,12 @@

      Accessible Combinations

      + .bg-dark-gray { background-color: #333333 } - .bg-moon-gray { background-color: #CCCCCC } @@ -33384,10 +33530,10 @@

      Accessible Combinations

    • + style="color:#FFA3D7;background-color:#555555">
      Aa - 4.78 + 4.07

      In visual perception a color is almost never seen as it really @@ -33421,8 +33567,8 @@

      Accessible Combinations

      + .light-pink { color: #FFA3D7 } - .dark-green { color: #137752 } @@ -33440,12 +33586,12 @@

      Accessible Combinations

      + .bg-mid-gray { background-color: #555555 } - .bg-light-gray { background-color: #EEEEEE } @@ -33479,10 +33625,10 @@

      Accessible Combinations

    • + style="color:#FFA3D7;background-color:#5E2CA5">
      Aa - 5.04 + 4.82

      In visual perception a color is almost never seen as it really @@ -33516,8 +33662,8 @@

      Accessible Combinations

      + .light-pink { color: #FFA3D7 } - .dark-green { color: #137752 } @@ -33541,7 +33687,6 @@

      Accessible Combinations

      - .bg-near-white { background-color: #F4F4F4 } @@ -33551,6 +33696,7 @@

      Accessible Combinations

      + .bg-purple { background-color: #5E2CA5 } @@ -33574,10 +33720,10 @@

      Accessible Combinations

    • + style="color:#FFA3D7;background-color:#137752">
      Aa - 5.54 + 3.03

      In visual perception a color is almost never seen as it really @@ -33611,8 +33757,8 @@

      Accessible Combinations

      + .light-pink { color: #FFA3D7 } - .dark-green { color: #137752 } @@ -33637,7 +33783,6 @@

      Accessible Combinations

      - .bg-white { background-color: #FFFFFF } @@ -33652,6 +33797,7 @@

      Accessible Combinations

      + .bg-dark-green { background-color: #137752 } @@ -33669,10 +33815,10 @@

      Accessible Combinations

    • + style="color:#FFA3D7;background-color:#001B44">
      Aa - 3.95 + 9.25

      In visual perception a color is almost never seen as it really @@ -33706,8 +33852,8 @@

      Accessible Combinations

      + .light-pink { color: #FFA3D7 } - .dark-green { color: #137752 } @@ -33738,7 +33884,6 @@

      Accessible Combinations

      - .bg-yellow { background-color: #FFD700 } @@ -33750,6 +33895,7 @@

      Accessible Combinations

      + .bg-navy { background-color: #001B44 } @@ -33764,10 +33910,10 @@

      Accessible Combinations

    • + style="color:#FFA3D7;background-color:#00449E">
      Aa - 4.82 + 4.94

      In visual perception a color is almost never seen as it really @@ -33801,8 +33947,8 @@

      Accessible Combinations

      + .light-pink { color: #FFA3D7 } - .dark-green { color: #137752 } @@ -33834,7 +33980,6 @@

      Accessible Combinations

      - .bg-light-yellow { background-color: #FBF1A9 } @@ -33846,6 +33991,7 @@

      Accessible Combinations

      + .bg-dark-blue { background-color: #00449E } @@ -33859,10 +34005,10 @@

      Accessible Combinations

    • + style="color:#137752;background-color:#000000">
      Aa - 3.03 + 3.79

      In visual perception a color is almost never seen as it really @@ -33912,6 +34058,7 @@

      Accessible Combinations

      + .bg-black { background-color: #000000 } @@ -33935,7 +34082,6 @@

      Accessible Combinations

      - .bg-light-pink { background-color: #FFA3D7 } @@ -33954,10 +34100,10 @@

      Accessible Combinations

    • + style="color:#137752;background-color:#FFFF00">
      Aa - 4.02 + 5.16

      In visual perception a color is almost never seen as it really @@ -34032,8 +34178,6 @@

      Accessible Combinations

      - - .bg-light-green { background-color: #9EEBCF } @@ -34049,10 +34193,10 @@

      Accessible Combinations

    • + style="color:#137752;background-color:#111111">
      Aa - 3.05 + 3.41

      In visual perception a color is almost never seen as it really @@ -34103,6 +34247,7 @@

      Accessible Combinations

      + .bg-near-black { background-color: #111111 } @@ -34129,7 +34274,6 @@

      Accessible Combinations

      - .bg-navy { background-color: #001B44 } @@ -34144,10 +34288,10 @@

      Accessible Combinations

    • + style="color:#137752;background-color:#CCCCCC">
      Aa - 4.50 + 3.45

      In visual perception a color is almost never seen as it really @@ -34204,6 +34348,7 @@

      Accessible Combinations

      + .bg-moon-gray { background-color: #CCCCCC } @@ -34228,7 +34373,6 @@

      Accessible Combinations

      - .bg-lightest-blue { background-color: #CDECFF } @@ -34239,10 +34383,10 @@

      Accessible Combinations

    • + style="color:#137752;background-color:#EEEEEE">
      Aa - 5.45 + 4.78

      In visual perception a color is almost never seen as it really @@ -34300,6 +34444,7 @@

      Accessible Combinations

      + .bg-light-gray { background-color: #EEEEEE } @@ -34324,7 +34469,6 @@

      Accessible Combinations

      - .bg-washed-blue { background-color: #F6FFFE } @@ -34334,10 +34478,10 @@

      Accessible Combinations

    • + style="color:#137752;background-color:#F4F4F4">
      Aa - 5.23 + 5.04

      In visual perception a color is almost never seen as it really @@ -34396,6 +34540,7 @@

      Accessible Combinations

      + .bg-near-white { background-color: #F4F4F4 } @@ -34420,7 +34565,6 @@

      Accessible Combinations

      - .bg-washed-green { background-color: #E8FDF5 } @@ -34429,10 +34573,10 @@

      Accessible Combinations

    • + style="color:#137752;background-color:#FFFFFF">
      Aa - 5.38 + 5.54

      In visual perception a color is almost never seen as it really @@ -34492,6 +34636,7 @@

      Accessible Combinations

      + .bg-white { background-color: #FFFFFF } @@ -34516,7 +34661,6 @@

      Accessible Combinations

      - .bg-washed-yellow { background-color: #FFFCEB }
      @@ -34524,10 +34668,10 @@

      Accessible Combinations

    • + style="color:#137752;background-color:#FFB700">
      Aa - 4.45 + 3.17

      In visual perception a color is almost never seen as it really @@ -34592,6 +34736,7 @@

      Accessible Combinations

      + .bg-gold { background-color: #FFB700 } @@ -34611,8 +34756,6 @@

      Accessible Combinations

      - - .bg-washed-red { background-color: #FFDFDF }
      @@ -34620,10 +34763,10 @@

      Accessible Combinations

    • + style="color:#137752;background-color:#FFD700">
      Aa - 6.97 + 3.95

      In visual perception a color is almost never seen as it really @@ -34658,14 +34801,7 @@

      Accessible Combinations

      - - .green { color: #19A974 } - - - - - - + .dark-green { color: #137752 } @@ -34673,7 +34809,6 @@

      Accessible Combinations

      - .bg-black { background-color: #000000 } @@ -34690,6 +34825,14 @@

      Accessible Combinations

      + + + + + + + + .bg-yellow { background-color: #FFD700 } @@ -34715,10 +34858,10 @@

      Accessible Combinations

    • + style="color:#137752;background-color:#FBF1A9">
      Aa - 6.27 + 4.82

      In visual perception a color is almost never seen as it really @@ -34753,8 +34896,8 @@

      Accessible Combinations

      + .dark-green { color: #137752 } - .green { color: #19A974 } @@ -34769,7 +34912,6 @@

      Accessible Combinations

      - .bg-near-black { background-color: #111111 } @@ -34786,6 +34928,7 @@

      Accessible Combinations

      + .bg-light-yellow { background-color: #FBF1A9 } @@ -34810,10 +34953,10 @@

      Accessible Combinations

    • + style="color:#137752;background-color:#FFA3D7">
      Aa - 3.01 + 3.03

      In visual perception a color is almost never seen as it really @@ -34848,8 +34991,8 @@

      Accessible Combinations

      + .dark-green { color: #137752 } - .green { color: #19A974 } @@ -34873,7 +35016,6 @@

      Accessible Combinations

      - .bg-white { background-color: #FFFFFF } @@ -34887,6 +35029,7 @@

      Accessible Combinations

      + .bg-light-pink { background-color: #FFA3D7 } @@ -34905,10 +35048,10 @@

      Accessible Combinations

    • + style="color:#137752;background-color:#9EEBCF">
      Aa - 5.62 + 4.02

      In visual perception a color is almost never seen as it really @@ -34943,8 +35086,8 @@

      Accessible Combinations

      + .dark-green { color: #137752 } - .green { color: #19A974 } @@ -34984,8 +35127,8 @@

      Accessible Combinations

      + .bg-light-green { background-color: #9EEBCF } - .bg-navy { background-color: #001B44 } @@ -35000,10 +35143,10 @@

      Accessible Combinations

    • + style="color:#137752;background-color:#001B44">
      Aa - 3.00 + 3.05

      In visual perception a color is almost never seen as it really @@ -35038,8 +35181,8 @@

      Accessible Combinations

      + .dark-green { color: #137752 } - .green { color: #19A974 } @@ -35080,8 +35223,8 @@

      Accessible Combinations

      + .bg-navy { background-color: #001B44 } - .bg-dark-blue { background-color: #00449E } @@ -35095,10 +35238,10 @@

      Accessible Combinations

    • + style="color:#137752;background-color:#96CCFF">
      Aa - 15.24 + 3.27

      In visual perception a color is almost never seen as it really @@ -35133,9 +35276,9 @@

      Accessible Combinations

      + .dark-green { color: #137752 } - .light-green { color: #9EEBCF } @@ -35148,7 +35291,6 @@

      Accessible Combinations

      - .bg-black { background-color: #000000 } @@ -35179,6 +35321,7 @@

      Accessible Combinations

      + .bg-light-blue { background-color: #96CCFF } @@ -35190,10 +35333,10 @@

      Accessible Combinations

    • + style="color:#137752;background-color:#CDECFF">
      Aa - 13.70 + 4.50

      In visual perception a color is almost never seen as it really @@ -35228,9 +35371,9 @@

      Accessible Combinations

      + .dark-green { color: #137752 } - .light-green { color: #9EEBCF } @@ -35244,7 +35387,6 @@

      Accessible Combinations

      - .bg-near-black { background-color: #111111 } @@ -35275,6 +35417,7 @@

      Accessible Combinations

      + .bg-lightest-blue { background-color: #CDECFF } @@ -35285,10 +35428,10 @@

      Accessible Combinations

    • + style="color:#137752;background-color:#F6FFFE">
      Aa - 6.12 + 5.45

      In visual perception a color is almost never seen as it really @@ -35323,9 +35466,10 @@

      Accessible Combinations

      + .dark-green { color: #137752 } + - .light-green { color: #9EEBCF } @@ -35369,6 +35513,7 @@

      Accessible Combinations

      + .bg-washed-blue { background-color: #F6FFFE } @@ -35378,10 +35523,10 @@

      Accessible Combinations

    • + style="color:#137752;background-color:#E8FDF5">
      Aa - 5.41 + 5.23

      In visual perception a color is almost never seen as it really @@ -35416,9 +35561,9 @@

      Accessible Combinations

      + .dark-green { color: #137752 } - .light-green { color: #9EEBCF } @@ -35434,7 +35579,6 @@

      Accessible Combinations

      - .bg-mid-gray { background-color: #555555 } @@ -35465,6 +35609,7 @@

      Accessible Combinations

      + .bg-washed-green { background-color: #E8FDF5 } @@ -35473,10 +35618,10 @@

      Accessible Combinations

    • + style="color:#137752;background-color:#FFFCEB">
      Aa - 3.25 + 5.38

      In visual perception a color is almost never seen as it really @@ -35511,9 +35656,9 @@

      Accessible Combinations

      + .dark-green { color: #137752 } - .light-green { color: #9EEBCF } @@ -35530,7 +35675,6 @@

      Accessible Combinations

      - .bg-gray { background-color: #777777 } @@ -35561,6 +35705,7 @@

      Accessible Combinations

      + .bg-washed-yellow { background-color: #FFFCEB }
      @@ -35568,10 +35713,10 @@

      Accessible Combinations

    • + style="color:#137752;background-color:#FFDFDF">
      Aa - 3.45 + 4.45

      In visual perception a color is almost never seen as it really @@ -35606,9 +35751,10 @@

      Accessible Combinations

      + .dark-green { color: #137752 } + - .light-green { color: #9EEBCF } @@ -35632,7 +35778,6 @@

      Accessible Combinations

      - .bg-dark-red { background-color: #E7040F } @@ -35656,6 +35801,7 @@

      Accessible Combinations

      + .bg-washed-red { background-color: #FFDFDF }
      @@ -35663,10 +35809,10 @@

      Accessible Combinations

    • + style="color:#19A974;background-color:#000000">
      Aa - 6.40 + 6.97

      In visual perception a color is almost never seen as it really @@ -35702,8 +35848,8 @@

      Accessible Combinations

      + .green { color: #19A974 } - .light-green { color: #9EEBCF } @@ -35716,6 +35862,7 @@

      Accessible Combinations

      + .bg-black { background-color: #000000 } @@ -35734,7 +35881,6 @@

      Accessible Combinations

      - .bg-purple { background-color: #5E2CA5 } @@ -35758,10 +35904,10 @@

      Accessible Combinations

    • + style="color:#19A974;background-color:#111111">
      Aa - 3.61 + 6.27

      In visual perception a color is almost never seen as it really @@ -35797,8 +35943,8 @@

      Accessible Combinations

      + .green { color: #19A974 } - .light-green { color: #9EEBCF } @@ -35812,6 +35958,7 @@

      Accessible Combinations

      + .bg-near-black { background-color: #111111 } @@ -35831,7 +35978,6 @@

      Accessible Combinations

      - .bg-dark-pink { background-color: #D5008F } @@ -35853,10 +35999,10 @@

      Accessible Combinations

    • + style="color:#19A974;background-color:#333333">
      Aa - 4.02 + 4.19

      In visual perception a color is almost never seen as it really @@ -35892,8 +36038,8 @@

      Accessible Combinations

      + .green { color: #19A974 } - .light-green { color: #9EEBCF } @@ -35908,6 +36054,7 @@

      Accessible Combinations

      + .bg-dark-gray { background-color: #333333 } @@ -35930,7 +36077,6 @@

      Accessible Combinations

      - .bg-dark-green { background-color: #137752 } @@ -35948,10 +36094,10 @@

      Accessible Combinations

    • + style="color:#19A974;background-color:#FFFFFF">
      Aa - 12.29 + 3.01

      In visual perception a color is almost never seen as it really @@ -35987,8 +36133,8 @@

      Accessible Combinations

      + .green { color: #19A974 } - .light-green { color: #9EEBCF } @@ -36011,6 +36157,7 @@

      Accessible Combinations

      + .bg-white { background-color: #FFFFFF } @@ -36028,7 +36175,6 @@

      Accessible Combinations

      - .bg-navy { background-color: #001B44 } @@ -36043,10 +36189,10 @@

      Accessible Combinations

    • + style="color:#19A974;background-color:#001B44">
      Aa - 6.57 + 5.62

      In visual perception a color is almost never seen as it really @@ -36082,8 +36228,8 @@

      Accessible Combinations

      + .green { color: #19A974 } - .light-green { color: #9EEBCF } @@ -36123,8 +36269,8 @@

      Accessible Combinations

      + .bg-navy { background-color: #001B44 } - .bg-dark-blue { background-color: #00449E } @@ -36138,10 +36284,10 @@

      Accessible Combinations

    • + style="color:#19A974;background-color:#00449E">
      Aa - 15.77 + 3.00

      In visual perception a color is almost never seen as it really @@ -36177,9 +36323,9 @@

      Accessible Combinations

      + .green { color: #19A974 } - .navy { color: #001B44 } @@ -36218,6 +36364,8 @@

      Accessible Combinations

      + + .bg-dark-blue { background-color: #00449E } @@ -36231,10 +36379,10 @@

      Accessible Combinations

    • + style="color:#9EEBCF;background-color:#000000">
      Aa - 3.78 + 15.24

      In visual perception a color is almost never seen as it really @@ -36271,8 +36419,8 @@

      Accessible Combinations

      + .light-green { color: #9EEBCF } - .navy { color: #001B44 } @@ -36284,11 +36432,11 @@

      Accessible Combinations

      + .bg-black { background-color: #000000 } - .bg-gray { background-color: #777777 } @@ -36326,10 +36474,10 @@

      Accessible Combinations

    • + style="color:#9EEBCF;background-color:#111111">
      Aa - 5.94 + 13.70

      In visual perception a color is almost never seen as it really @@ -36366,8 +36514,8 @@

      Accessible Combinations

      + .light-green { color: #9EEBCF } - .navy { color: #001B44 } @@ -36380,11 +36528,11 @@

      Accessible Combinations

      + .bg-near-black { background-color: #111111 } - .bg-silver { background-color: #999999 } @@ -36421,10 +36569,10 @@

      Accessible Combinations

    • + style="color:#9EEBCF;background-color:#333333">
      Aa - 7.29 + 9.17

      In visual perception a color is almost never seen as it really @@ -36461,8 +36609,8 @@

      Accessible Combinations

      + .light-green { color: #9EEBCF } - .navy { color: #001B44 } @@ -36476,11 +36624,11 @@

      Accessible Combinations

      + .bg-dark-gray { background-color: #333333 } - .bg-light-silver { background-color: #AAAAAA } @@ -36516,10 +36664,10 @@

      Accessible Combinations

    • + style="color:#9EEBCF;background-color:#555555">
      Aa - 10.54 + 5.41

      In visual perception a color is almost never seen as it really @@ -36556,8 +36704,8 @@

      Accessible Combinations

      + .light-green { color: #9EEBCF } - .navy { color: #001B44 } @@ -36572,11 +36720,11 @@

      Accessible Combinations

      + .bg-mid-gray { background-color: #555555 } - .bg-moon-gray { background-color: #CCCCCC } @@ -36611,10 +36759,10 @@

      Accessible Combinations

    • + style="color:#9EEBCF;background-color:#777777">
      Aa - 14.59 + 3.25

      In visual perception a color is almost never seen as it really @@ -36651,8 +36799,8 @@

      Accessible Combinations

      + .light-green { color: #9EEBCF } - .navy { color: #001B44 } @@ -36668,11 +36816,11 @@

      Accessible Combinations

      + .bg-gray { background-color: #777777 } - .bg-light-gray { background-color: #EEEEEE } @@ -36706,10 +36854,10 @@

      Accessible Combinations

    • + style="color:#9EEBCF;background-color:#E7040F">
      Aa - 15.39 + 3.45

      In visual perception a color is almost never seen as it really @@ -36746,8 +36894,8 @@

      Accessible Combinations

      + .light-green { color: #9EEBCF } - .navy { color: #001B44 } @@ -36768,9 +36916,9 @@

      Accessible Combinations

      - .bg-near-white { background-color: #F4F4F4 } + .bg-dark-red { background-color: #E7040F } @@ -36801,10 +36949,10 @@

      Accessible Combinations

    • + style="color:#9EEBCF;background-color:#5E2CA5">
      Aa - 16.93 + 6.40

      In visual perception a color is almost never seen as it really @@ -36841,8 +36989,8 @@

      Accessible Combinations

      + .light-green { color: #9EEBCF } - .navy { color: #001B44 } @@ -36864,7 +37012,6 @@

      Accessible Combinations

      - .bg-white { background-color: #FFFFFF } @@ -36873,6 +37020,7 @@

      Accessible Combinations

      + .bg-purple { background-color: #5E2CA5 } @@ -36896,10 +37044,10 @@

      Accessible Combinations

    • + style="color:#9EEBCF;background-color:#D5008F">
      Aa - 3.57 + 3.61

      In visual perception a color is almost never seen as it really @@ -36936,8 +37084,8 @@

      Accessible Combinations

      + .light-green { color: #9EEBCF } - .navy { color: #001B44 } @@ -36960,7 +37108,6 @@

      Accessible Combinations

      - .bg-dark-red { background-color: #E7040F } @@ -36970,6 +37117,7 @@

      Accessible Combinations

      + .bg-dark-pink { background-color: #D5008F } @@ -36991,10 +37139,10 @@

      Accessible Combinations

    • + style="color:#9EEBCF;background-color:#137752">
      Aa - 4.89 + 4.02

      In visual perception a color is almost never seen as it really @@ -37031,8 +37179,8 @@

      Accessible Combinations

      + .light-green { color: #9EEBCF } - .navy { color: #001B44 } @@ -37056,7 +37204,6 @@

      Accessible Combinations

      - .bg-red { background-color: #FF4136 } @@ -37069,6 +37216,7 @@

      Accessible Combinations

      + .bg-dark-green { background-color: #137752 } @@ -37086,10 +37234,10 @@

      Accessible Combinations

    • + style="color:#9EEBCF;background-color:#001B44">
      Aa - 6.30 + 12.29

      In visual perception a color is almost never seen as it really @@ -37126,8 +37274,8 @@

      Accessible Combinations

      + .light-green { color: #9EEBCF } - .navy { color: #001B44 } @@ -37152,7 +37300,6 @@

      Accessible Combinations

      - .bg-light-red { background-color: #FF725C } @@ -37167,6 +37314,7 @@

      Accessible Combinations

      + .bg-navy { background-color: #001B44 } @@ -37181,10 +37329,10 @@

      Accessible Combinations

    • + style="color:#9EEBCF;background-color:#00449E">
      Aa - 6.46 + 6.57

      In visual perception a color is almost never seen as it really @@ -37221,8 +37369,8 @@

      Accessible Combinations

      + .light-green { color: #9EEBCF } - .navy { color: #001B44 } @@ -37261,6 +37409,8 @@

      Accessible Combinations

      + + .bg-dark-blue { background-color: #00449E } @@ -37274,10 +37424,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#FFFF00">
      Aa - 8.96 + 15.77

      In visual perception a color is almost never seen as it really @@ -37367,10 +37517,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#777777">
      Aa - 12.07 + 3.78

      In visual perception a color is almost never seen as it really @@ -37424,6 +37574,7 @@

      Accessible Combinations

      + .bg-gray { background-color: #777777 } @@ -37436,7 +37587,6 @@

      Accessible Combinations

      - .bg-yellow { background-color: #FFD700 } @@ -37462,10 +37612,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#999999">
      Aa - 14.72 + 5.94

      In visual perception a color is almost never seen as it really @@ -37520,6 +37670,7 @@

      Accessible Combinations

      + .bg-silver { background-color: #999999 } @@ -37532,7 +37683,6 @@

      Accessible Combinations

      - .bg-light-yellow { background-color: #FBF1A9 } @@ -37557,10 +37707,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#AAAAAA">
      Aa - 4.55 + 7.29

      In visual perception a color is almost never seen as it really @@ -37616,6 +37766,7 @@

      Accessible Combinations

      + .bg-light-silver { background-color: #AAAAAA } @@ -37629,7 +37780,6 @@

      Accessible Combinations

      - .bg-light-purple { background-color: #A463F2 } @@ -37652,10 +37802,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#CCCCCC">
      Aa - 3.41 + 10.54

      In visual perception a color is almost never seen as it really @@ -37712,6 +37862,7 @@

      Accessible Combinations

      + .bg-moon-gray { background-color: #CCCCCC } @@ -37725,7 +37876,6 @@

      Accessible Combinations

      - .bg-dark-pink { background-color: #D5008F } @@ -37747,10 +37897,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#EEEEEE">
      Aa - 5.38 + 14.59

      In visual perception a color is almost never seen as it really @@ -37808,6 +37958,7 @@

      Accessible Combinations

      + .bg-light-gray { background-color: #EEEEEE } @@ -37821,7 +37972,6 @@

      Accessible Combinations

      - .bg-hot-pink { background-color: #FF41B4 } @@ -37842,10 +37992,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#F4F4F4">
      Aa - 7.43 + 15.39

      In visual perception a color is almost never seen as it really @@ -37904,6 +38054,7 @@

      Accessible Combinations

      + .bg-near-white { background-color: #F4F4F4 } @@ -37917,7 +38068,6 @@

      Accessible Combinations

      - .bg-pink { background-color: #FF80CC } @@ -37937,10 +38087,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#FFFFFF">
      Aa - 9.25 + 16.93

      In visual perception a color is almost never seen as it really @@ -38000,6 +38150,9 @@

      Accessible Combinations

      + .bg-white { background-color: #FFFFFF } + + @@ -38011,9 +38164,6 @@

      Accessible Combinations

      - - - .bg-light-pink { background-color: #FFA3D7 } @@ -38032,10 +38182,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#E7040F">
      Aa - 3.05 + 3.57

      In visual perception a color is almost never seen as it really @@ -38096,6 +38246,7 @@

      Accessible Combinations

      + .bg-dark-red { background-color: #E7040F } @@ -38109,7 +38260,6 @@

      Accessible Combinations

      - .bg-dark-green { background-color: #137752 } @@ -38127,10 +38277,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#FF4136">
      Aa - 5.62 + 4.89

      In visual perception a color is almost never seen as it really @@ -38192,6 +38342,7 @@

      Accessible Combinations

      + .bg-red { background-color: #FF4136 } @@ -38205,7 +38356,6 @@

      Accessible Combinations

      - .bg-green { background-color: #19A974 } @@ -38222,10 +38372,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#FF725C">
      Aa - 12.29 + 6.30

      In visual perception a color is almost never seen as it really @@ -38288,6 +38438,7 @@

      Accessible Combinations

      + .bg-light-red { background-color: #FF725C } @@ -38301,7 +38452,6 @@

      Accessible Combinations

      - .bg-light-green { background-color: #9EEBCF } @@ -38317,10 +38467,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#FF6300">
      Aa - 4.64 + 5.67

      In visual perception a color is almost never seen as it really @@ -38384,6 +38534,8 @@

      Accessible Combinations

      + .bg-orange { background-color: #FF6300 } + @@ -38410,10 +38562,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#FFB700">
      Aa - 8.68 + 9.70

      In visual perception a color is almost never seen as it really @@ -38477,6 +38629,8 @@

      Accessible Combinations

      + + .bg-gold { background-color: #FFB700 } @@ -38503,10 +38657,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#FFD700">
      Aa - 13.74 + 12.07

      In visual perception a color is almost never seen as it really @@ -38572,6 +38726,7 @@

      Accessible Combinations

      + .bg-yellow { background-color: #FFD700 } @@ -38587,7 +38742,6 @@

      Accessible Combinations

      - .bg-lightest-blue { background-color: #CDECFF } @@ -38598,10 +38752,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#FBF1A9">
      Aa - 16.65 + 14.72

      In visual perception a color is almost never seen as it really @@ -38668,6 +38822,7 @@

      Accessible Combinations

      + .bg-light-yellow { background-color: #FBF1A9 } @@ -38683,7 +38838,6 @@

      Accessible Combinations

      - .bg-washed-blue { background-color: #F6FFFE } @@ -38693,10 +38847,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#A463F2">
      Aa - 15.96 + 4.55

      In visual perception a color is almost never seen as it really @@ -38765,6 +38919,7 @@

      Accessible Combinations

      + .bg-light-purple { background-color: #A463F2 } @@ -38779,7 +38934,6 @@

      Accessible Combinations

      - .bg-washed-green { background-color: #E8FDF5 } @@ -38788,10 +38942,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#D5008F">
      Aa - 16.43 + 3.41

      In visual perception a color is almost never seen as it really @@ -38861,6 +39015,7 @@

      Accessible Combinations

      + .bg-dark-pink { background-color: #D5008F } @@ -38875,7 +39030,6 @@

      Accessible Combinations

      - .bg-washed-yellow { background-color: #FFFCEB }
      @@ -38883,10 +39037,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#FF41B4">
      Aa - 13.60 + 5.38

      In visual perception a color is almost never seen as it really @@ -38957,6 +39111,7 @@

      Accessible Combinations

      + .bg-hot-pink { background-color: #FF41B4 } @@ -38970,8 +39125,6 @@

      Accessible Combinations

      - - .bg-washed-red { background-color: #FFDFDF }
      @@ -38979,10 +39132,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#FF80CC">
      Aa - 8.43 + 7.43

      In visual perception a color is almost never seen as it really @@ -39020,8 +39173,8 @@

      Accessible Combinations

      + .navy { color: #001B44 } - .dark-blue { color: #00449E } @@ -39053,6 +39206,8 @@

      Accessible Combinations

      + + .bg-pink { background-color: #FF80CC } @@ -39072,10 +39227,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#FFA3D7">
      Aa - 3.18 + 9.25

      In visual perception a color is almost never seen as it really @@ -39113,8 +39268,8 @@

      Accessible Combinations

      + .navy { color: #001B44 } - .dark-blue { color: #00449E } @@ -39130,7 +39285,6 @@

      Accessible Combinations

      - .bg-silver { background-color: #999999 } @@ -39149,6 +39303,7 @@

      Accessible Combinations

      + .bg-light-pink { background-color: #FFA3D7 } @@ -39167,10 +39322,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#137752">
      Aa - 3.90 + 3.05

      In visual perception a color is almost never seen as it really @@ -39208,8 +39363,8 @@

      Accessible Combinations

      + .navy { color: #001B44 } - .dark-blue { color: #00449E } @@ -39226,7 +39381,6 @@

      Accessible Combinations

      - .bg-light-silver { background-color: #AAAAAA } @@ -39245,6 +39399,7 @@

      Accessible Combinations

      + .bg-dark-green { background-color: #137752 } @@ -39262,10 +39417,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#19A974">
      Aa - 5.64 + 5.62

      In visual perception a color is almost never seen as it really @@ -39303,8 +39458,8 @@

      Accessible Combinations

      + .navy { color: #001B44 } - .dark-blue { color: #00449E } @@ -39322,7 +39477,6 @@

      Accessible Combinations

      - .bg-moon-gray { background-color: #CCCCCC } @@ -39341,6 +39495,7 @@

      Accessible Combinations

      + .bg-green { background-color: #19A974 } @@ -39357,10 +39512,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#9EEBCF">
      Aa - 7.80 + 12.29

      In visual perception a color is almost never seen as it really @@ -39398,8 +39553,8 @@

      Accessible Combinations

      + .navy { color: #001B44 } - .dark-blue { color: #00449E } @@ -39418,7 +39573,6 @@

      Accessible Combinations

      - .bg-light-gray { background-color: #EEEEEE } @@ -39437,6 +39591,7 @@

      Accessible Combinations

      + .bg-light-green { background-color: #9EEBCF } @@ -39452,10 +39607,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#357EDD">
      Aa - 8.23 + 4.18

      In visual perception a color is almost never seen as it really @@ -39493,8 +39648,8 @@

      Accessible Combinations

      + .navy { color: #001B44 } - .dark-blue { color: #00449E } @@ -39514,7 +39669,6 @@

      Accessible Combinations

      - .bg-near-white { background-color: #F4F4F4 } @@ -39535,6 +39689,7 @@

      Accessible Combinations

      + .bg-blue { background-color: #357EDD } @@ -39547,10 +39702,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#96CCFF">
      Aa - 9.05 + 9.98

      In visual perception a color is almost never seen as it really @@ -39588,8 +39743,8 @@

      Accessible Combinations

      + .navy { color: #001B44 } - .dark-blue { color: #00449E } @@ -39610,7 +39765,6 @@

      Accessible Combinations

      - .bg-white { background-color: #FFFFFF } @@ -39631,6 +39785,7 @@

      Accessible Combinations

      + .bg-light-blue { background-color: #96CCFF } @@ -39642,10 +39797,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#CDECFF">
      Aa - 3.37 + 13.74

      In visual perception a color is almost never seen as it really @@ -39683,8 +39838,8 @@

      Accessible Combinations

      + .navy { color: #001B44 } - .dark-blue { color: #00449E } @@ -39708,7 +39863,6 @@

      Accessible Combinations

      - .bg-light-red { background-color: #FF725C } @@ -39727,6 +39881,7 @@

      Accessible Combinations

      + .bg-lightest-blue { background-color: #CDECFF } @@ -39737,10 +39892,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#F6FFFE">
      Aa - 3.45 + 16.65

      In visual perception a color is almost never seen as it really @@ -39778,8 +39933,9 @@

      Accessible Combinations

      + .navy { color: #001B44 } + - .dark-blue { color: #00449E } @@ -39821,6 +39977,7 @@

      Accessible Combinations

      + .bg-washed-blue { background-color: #F6FFFE } @@ -39830,10 +39987,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#E8FDF5">
      Aa - 4.79 + 15.96

      In visual perception a color is almost never seen as it really @@ -39871,8 +40028,9 @@

      Accessible Combinations

      + .navy { color: #001B44 } + - .dark-blue { color: #00449E } @@ -39915,6 +40073,7 @@

      Accessible Combinations

      + .bg-washed-green { background-color: #E8FDF5 } @@ -39923,10 +40082,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#FFFCEB">
      Aa - 6.45 + 16.43

      In visual perception a color is almost never seen as it really @@ -39964,8 +40123,8 @@

      Accessible Combinations

      + .navy { color: #001B44 } - .dark-blue { color: #00449E } @@ -39992,7 +40151,6 @@

      Accessible Combinations

      - .bg-yellow { background-color: #FFD700 } @@ -40011,6 +40169,7 @@

      Accessible Combinations

      + .bg-washed-yellow { background-color: #FFFCEB }
      @@ -40018,10 +40177,10 @@

      Accessible Combinations

    • + style="color:#001B44;background-color:#FFDFDF">
      Aa - 7.87 + 13.60

      In visual perception a color is almost never seen as it really @@ -40059,8 +40218,9 @@

      Accessible Combinations

      + .navy { color: #001B44 } + - .dark-blue { color: #00449E } @@ -40088,7 +40248,6 @@

      Accessible Combinations

      - .bg-light-yellow { background-color: #FBF1A9 } @@ -40106,6 +40265,7 @@

      Accessible Combinations

      + .bg-washed-red { background-color: #FFDFDF }
      @@ -40113,10 +40273,10 @@

      Accessible Combinations

    • + style="color:#00449E;background-color:#FFFF00">
      Aa - 3.97 + 8.43

      In visual perception a color is almost never seen as it really @@ -40187,8 +40347,6 @@

      Accessible Combinations

      - - .bg-pink { background-color: #FF80CC } @@ -40208,10 +40366,10 @@

      Accessible Combinations

    • + style="color:#00449E;background-color:#999999">
      Aa - 4.94 + 3.18

      In visual perception a color is almost never seen as it really @@ -40266,6 +40424,7 @@

      Accessible Combinations

      + .bg-silver { background-color: #999999 } @@ -40284,7 +40443,6 @@

      Accessible Combinations

      - .bg-light-pink { background-color: #FFA3D7 } @@ -40303,10 +40461,10 @@

      Accessible Combinations

    • + style="color:#00449E;background-color:#AAAAAA">
      Aa - 3.00 + 3.90

      In visual perception a color is almost never seen as it really @@ -40362,6 +40520,7 @@

      Accessible Combinations

      + .bg-light-silver { background-color: #AAAAAA } @@ -40381,7 +40540,6 @@

      Accessible Combinations

      - .bg-green { background-color: #19A974 } @@ -40398,10 +40556,10 @@

      Accessible Combinations

    • + style="color:#00449E;background-color:#CCCCCC">
      Aa - 6.57 + 5.64

      In visual perception a color is almost never seen as it really @@ -40458,6 +40616,7 @@

      Accessible Combinations

      + .bg-moon-gray { background-color: #CCCCCC } @@ -40477,7 +40636,6 @@

      Accessible Combinations

      - .bg-light-green { background-color: #9EEBCF } @@ -40493,10 +40651,10 @@

      Accessible Combinations

    • + style="color:#00449E;background-color:#EEEEEE">
      Aa - 4.64 + 7.80

      In visual perception a color is almost never seen as it really @@ -40554,6 +40712,8 @@

      Accessible Combinations

      + .bg-light-gray { background-color: #EEEEEE } + @@ -40586,10 +40746,10 @@

      Accessible Combinations

    • + style="color:#00449E;background-color:#F4F4F4">
      Aa - 7.34 + 8.23

      In visual perception a color is almost never seen as it really @@ -40648,6 +40808,7 @@

      Accessible Combinations

      + .bg-near-white { background-color: #F4F4F4 } @@ -40670,7 +40831,6 @@

      Accessible Combinations

      - .bg-lightest-blue { background-color: #CDECFF } @@ -40681,10 +40841,10 @@

      Accessible Combinations

    • + style="color:#00449E;background-color:#FFFFFF">
      Aa - 8.90 + 9.05

      In visual perception a color is almost never seen as it really @@ -40744,6 +40904,7 @@

      Accessible Combinations

      + .bg-white { background-color: #FFFFFF } @@ -40766,7 +40927,6 @@

      Accessible Combinations

      - .bg-washed-blue { background-color: #F6FFFE } @@ -40776,10 +40936,10 @@

      Accessible Combinations

    • + style="color:#00449E;background-color:#FF725C">
      Aa - 8.53 + 3.37

      In visual perception a color is almost never seen as it really @@ -40842,6 +41002,7 @@

      Accessible Combinations

      + .bg-light-red { background-color: #FF725C } @@ -40862,7 +41023,6 @@

      Accessible Combinations

      - .bg-washed-green { background-color: #E8FDF5 } @@ -40871,10 +41031,10 @@

      Accessible Combinations

    • + style="color:#00449E;background-color:#FF6300">
      Aa - 8.78 + 3.03

      In visual perception a color is almost never seen as it really @@ -40938,6 +41098,7 @@

      Accessible Combinations

      + .bg-orange { background-color: #FF6300 } @@ -40958,7 +41119,6 @@

      Accessible Combinations

      - .bg-washed-yellow { background-color: #FFFCEB }
      @@ -40966,10 +41126,10 @@

      Accessible Combinations

    • + style="color:#00449E;background-color:#FFB700">
      Aa - 7.27 + 5.18

      In visual perception a color is almost never seen as it really @@ -41034,6 +41194,7 @@

      Accessible Combinations

      + .bg-gold { background-color: #FFB700 } @@ -41053,8 +41214,6 @@

      Accessible Combinations

      - - .bg-washed-red { background-color: #FFDFDF }
      @@ -41062,10 +41221,10 @@

      Accessible Combinations

    • + style="color:#00449E;background-color:#FFD700">
      Aa - 5.75 + 6.45

      In visual perception a color is almost never seen as it really @@ -41104,6 +41263,8 @@

      Accessible Combinations

      + .dark-blue { color: #00449E } + @@ -41113,7 +41274,6 @@

      Accessible Combinations

      - .bg-black { background-color: #000000 } @@ -41130,6 +41290,7 @@

      Accessible Combinations

      + .bg-yellow { background-color: #FFD700 } @@ -41155,10 +41316,10 @@

      Accessible Combinations

    • + style="color:#00449E;background-color:#FBF1A9">
      Aa - 3.40 + 7.87

      In visual perception a color is almost never seen as it really @@ -41197,6 +41358,8 @@

      Accessible Combinations

      + .dark-blue { color: #00449E } + @@ -41222,6 +41385,8 @@

      Accessible Combinations

      + + .bg-light-yellow { background-color: #FBF1A9 } @@ -41246,10 +41411,10 @@

      Accessible Combinations

    • + style="color:#00449E;background-color:#FF80CC">
      Aa - 5.17 + 3.97

      In visual perception a color is almost never seen as it really @@ -41288,6 +41453,7 @@

      Accessible Combinations

      + .dark-blue { color: #00449E } @@ -41298,7 +41464,6 @@

      Accessible Combinations

      - .bg-near-black { background-color: #111111 } @@ -41320,6 +41485,8 @@

      Accessible Combinations

      + + .bg-pink { background-color: #FF80CC } @@ -41339,10 +41506,10 @@

      Accessible Combinations

    • + style="color:#00449E;background-color:#FFA3D7">
      Aa - 3.15 + 4.94

      In visual perception a color is almost never seen as it really @@ -41381,6 +41548,8 @@

      Accessible Combinations

      + .dark-blue { color: #00449E } + @@ -41398,7 +41567,6 @@

      Accessible Combinations

      - .bg-light-gray { background-color: #EEEEEE } @@ -41414,6 +41582,7 @@

      Accessible Combinations

      + .bg-light-pink { background-color: #FFA3D7 } @@ -41432,10 +41601,10 @@

      Accessible Combinations

    • + style="color:#00449E;background-color:#19A974">
      Aa - 3.32 + 3.00

      In visual perception a color is almost never seen as it really @@ -41474,6 +41643,8 @@

      Accessible Combinations

      + .dark-blue { color: #00449E } + @@ -41492,7 +41663,6 @@

      Accessible Combinations

      - .bg-near-white { background-color: #F4F4F4 } @@ -41509,6 +41679,7 @@

      Accessible Combinations

      + .bg-green { background-color: #19A974 } @@ -41525,10 +41696,10 @@

      Accessible Combinations

    • + style="color:#00449E;background-color:#9EEBCF">
      Aa - 3.65 + 6.57

      In visual perception a color is almost never seen as it really @@ -41567,6 +41738,7 @@

      Accessible Combinations

      + .dark-blue { color: #00449E } @@ -41586,7 +41758,6 @@

      Accessible Combinations

      - .bg-white { background-color: #FFFFFF } @@ -41603,6 +41774,8 @@

      Accessible Combinations

      + + .bg-light-green { background-color: #9EEBCF } @@ -41618,10 +41791,10 @@

      Accessible Combinations

    • + style="color:#00449E;background-color:#96CCFF">
      Aa - 3.17 + 5.33

      In visual perception a color is almost never seen as it really @@ -41660,6 +41833,8 @@

      Accessible Combinations

      + .dark-blue { color: #00449E } + @@ -41686,7 +41861,6 @@

      Accessible Combinations

      - .bg-light-yellow { background-color: #FBF1A9 } @@ -41700,6 +41874,7 @@

      Accessible Combinations

      + .bg-light-blue { background-color: #96CCFF } @@ -41711,10 +41886,10 @@

      Accessible Combinations

    • + style="color:#00449E;background-color:#CDECFF">
      Aa - 4.64 + 7.34

      In visual perception a color is almost never seen as it really @@ -41753,6 +41928,8 @@

      Accessible Combinations

      + .dark-blue { color: #00449E } + @@ -41789,11 +41966,11 @@

      Accessible Combinations

      - .bg-navy { background-color: #001B44 } + .bg-lightest-blue { background-color: #CDECFF } @@ -41804,10 +41981,10 @@

      Accessible Combinations

    • + style="color:#00449E;background-color:#F6FFFE">
      Aa - 3.59 + 8.90

      In visual perception a color is almost never seen as it really @@ -41846,6 +42023,8 @@

      Accessible Combinations

      + .dark-blue { color: #00449E } + @@ -41897,10 +42076,10 @@

      Accessible Combinations

    • + style="color:#00449E;background-color:#E8FDF5">
      Aa - 3.44 + 8.53

      In visual perception a color is almost never seen as it really @@ -41939,6 +42118,8 @@

      Accessible Combinations

      + .dark-blue { color: #00449E } + @@ -41990,10 +42171,10 @@

      Accessible Combinations

    • + style="color:#00449E;background-color:#FFFCEB">
      Aa - 3.54 + 8.78

      In visual perception a color is almost never seen as it really @@ -42032,6 +42213,8 @@

      Accessible Combinations

      + .dark-blue { color: #00449E } + @@ -42083,10 +42266,10 @@

      Accessible Combinations

    • + style="color:#00449E;background-color:#FFDFDF">
      Aa - 10.76 + 7.27

      In visual perception a color is almost never seen as it really @@ -42125,6 +42308,8 @@

      Accessible Combinations

      + .dark-blue { color: #00449E } + @@ -42134,7 +42319,6 @@

      Accessible Combinations

      - .bg-black { background-color: #000000 } @@ -42169,6 +42353,8 @@

      Accessible Combinations

      + + .bg-washed-red { background-color: #FFDFDF }
      @@ -42176,10 +42362,10 @@

      Accessible Combinations

    • + style="color:#357EDD;background-color:#000000">
      Aa - 9.68 + 5.18

      In visual perception a color is almost never seen as it really @@ -42219,6 +42405,7 @@

      Accessible Combinations

      + .blue { color: #357EDD } @@ -42228,7 +42415,8 @@

      Accessible Combinations

      - .bg-near-black { background-color: #111111 } + .bg-black { background-color: #000000 } + @@ -42269,10 +42457,10 @@

      Accessible Combinations

    • + style="color:#357EDD;background-color:#FFFF00">
      Aa - 4.32 + 3.78

      In visual perception a color is almost never seen as it really @@ -42312,6 +42500,8 @@

      Accessible Combinations

      + .blue { color: #357EDD } + @@ -42360,10 +42550,10 @@

      Accessible Combinations

    • + style="color:#357EDD;background-color:#111111">
      Aa - 3.82 + 4.66

      In visual perception a color is almost never seen as it really @@ -42402,6 +42592,8 @@

      Accessible Combinations

      + + .blue { color: #357EDD } @@ -42412,9 +42604,9 @@

      Accessible Combinations

      + .bg-near-black { background-color: #111111 } - .bg-mid-gray { background-color: #555555 } @@ -42453,10 +42645,10 @@

      Accessible Combinations

    • + style="color:#357EDD;background-color:#333333">
      Aa - 4.52 + 3.12

      In visual perception a color is almost never seen as it really @@ -42496,6 +42688,7 @@

      Accessible Combinations

      + .blue { color: #357EDD } @@ -42507,6 +42700,8 @@

      Accessible Combinations

      + .bg-dark-gray { background-color: #333333 } + @@ -42522,7 +42717,6 @@

      Accessible Combinations

      - .bg-purple { background-color: #5E2CA5 } @@ -42546,10 +42740,10 @@

      Accessible Combinations

    • + style="color:#357EDD;background-color:#EEEEEE">
      Aa - 8.68 + 3.49

      In visual perception a color is almost never seen as it really @@ -42589,6 +42783,7 @@

      Accessible Combinations

      + .blue { color: #357EDD } @@ -42606,6 +42801,8 @@

      Accessible Combinations

      + .bg-light-gray { background-color: #EEEEEE } + @@ -42624,7 +42821,6 @@

      Accessible Combinations

      - .bg-navy { background-color: #001B44 } @@ -42639,10 +42835,10 @@

      Accessible Combinations

    • + style="color:#357EDD;background-color:#F4F4F4">
      Aa - 4.64 + 3.69

      In visual perception a color is almost never seen as it really @@ -42682,6 +42878,7 @@

      Accessible Combinations

      + .blue { color: #357EDD } @@ -42700,6 +42897,8 @@

      Accessible Combinations

      + .bg-near-white { background-color: #F4F4F4 } + @@ -42718,7 +42917,6 @@

      Accessible Combinations

      - .bg-dark-blue { background-color: #00449E } @@ -42732,10 +42930,10 @@

      Accessible Combinations

    • + style="color:#357EDD;background-color:#FFFFFF">
      Aa - 17.04 + 4.05

      In visual perception a color is almost never seen as it really @@ -42775,9 +42973,9 @@

      Accessible Combinations

      + .blue { color: #357EDD } - .lightest-blue { color: #CDECFF } @@ -42785,7 +42983,6 @@

      Accessible Combinations

      - .bg-black { background-color: #000000 } @@ -42796,6 +42993,7 @@

      Accessible Combinations

      + .bg-white { background-color: #FFFFFF } @@ -42827,10 +43025,10 @@

      Accessible Combinations

    • + style="color:#357EDD;background-color:#FBF1A9">
      Aa - 15.32 + 3.52

      In visual perception a color is almost never seen as it really @@ -42870,9 +43068,9 @@

      Accessible Combinations

      + .blue { color: #357EDD } - .lightest-blue { color: #CDECFF } @@ -42881,7 +43079,6 @@

      Accessible Combinations

      - .bg-near-black { background-color: #111111 } @@ -42898,6 +43095,7 @@

      Accessible Combinations

      + .bg-light-yellow { background-color: #FBF1A9 } @@ -42922,10 +43120,10 @@

      Accessible Combinations

    • + style="color:#357EDD;background-color:#001B44">
      Aa - 6.84 + 4.18

      In visual perception a color is almost never seen as it really @@ -42965,9 +43163,9 @@

      Accessible Combinations

      + .blue { color: #357EDD } - .lightest-blue { color: #CDECFF } @@ -43001,6 +43199,8 @@

      Accessible Combinations

      + + .bg-navy { background-color: #001B44 } @@ -43015,10 +43215,10 @@

      Accessible Combinations

    • + style="color:#357EDD;background-color:#CDECFF">
      Aa - 6.05 + 3.29

      In visual perception a color is almost never seen as it really @@ -43058,9 +43258,9 @@

      Accessible Combinations

      + .blue { color: #357EDD } - .lightest-blue { color: #CDECFF } @@ -43071,7 +43271,6 @@

      Accessible Combinations

      - .bg-mid-gray { background-color: #555555 } @@ -43100,6 +43299,7 @@

      Accessible Combinations

      + .bg-lightest-blue { background-color: #CDECFF } @@ -43110,10 +43310,10 @@

      Accessible Combinations

    • + style="color:#357EDD;background-color:#F6FFFE">
      Aa - 3.63 + 3.99

      In visual perception a color is almost never seen as it really @@ -43153,9 +43353,9 @@

      Accessible Combinations

      + .blue { color: #357EDD } - .lightest-blue { color: #CDECFF } @@ -43167,7 +43367,6 @@

      Accessible Combinations

      - .bg-gray { background-color: #777777 } @@ -43196,6 +43395,7 @@

      Accessible Combinations

      + .bg-washed-blue { background-color: #F6FFFE } @@ -43205,10 +43405,10 @@

      Accessible Combinations

    • + style="color:#357EDD;background-color:#E8FDF5">
      Aa - 3.85 + 3.82

      In visual perception a color is almost never seen as it really @@ -43248,9 +43448,9 @@

      Accessible Combinations

      + .blue { color: #357EDD } - .lightest-blue { color: #CDECFF } @@ -43269,7 +43469,6 @@

      Accessible Combinations

      - .bg-dark-red { background-color: #E7040F } @@ -43292,6 +43491,7 @@

      Accessible Combinations

      + .bg-washed-green { background-color: #E8FDF5 } @@ -43300,10 +43500,10 @@

      Accessible Combinations

    • + style="color:#357EDD;background-color:#FFFCEB">
      Aa - 7.16 + 3.93

      In visual perception a color is almost never seen as it really @@ -43343,9 +43543,9 @@

      Accessible Combinations

      + .blue { color: #357EDD } - .lightest-blue { color: #CDECFF } @@ -43371,7 +43571,6 @@

      Accessible Combinations

      - .bg-purple { background-color: #5E2CA5 } @@ -43388,6 +43587,7 @@

      Accessible Combinations

      + .bg-washed-yellow { background-color: #FFFCEB }
      @@ -43395,10 +43595,10 @@

      Accessible Combinations

    • + style="color:#357EDD;background-color:#FFDFDF">
      Aa - 3.02 + 3.26

      In visual perception a color is almost never seen as it really @@ -43438,9 +43638,9 @@

      Accessible Combinations

      + .blue { color: #357EDD } - .lightest-blue { color: #CDECFF } @@ -43467,7 +43667,6 @@

      Accessible Combinations

      - .bg-light-purple { background-color: #A463F2 } @@ -43483,6 +43682,8 @@

      Accessible Combinations

      + + .bg-washed-red { background-color: #FFDFDF }
      @@ -43490,10 +43691,10 @@

      Accessible Combinations

    • + style="color:#96CCFF;background-color:#000000">
      Aa - 4.03 + 12.38

      In visual perception a color is almost never seen as it really @@ -43534,8 +43735,8 @@

      Accessible Combinations

      + .light-blue { color: #96CCFF } - .lightest-blue { color: #CDECFF } @@ -43543,6 +43744,7 @@

      Accessible Combinations

      + .bg-black { background-color: #000000 } @@ -43563,7 +43765,6 @@

      Accessible Combinations

      - .bg-dark-pink { background-color: #D5008F } @@ -43585,10 +43786,10 @@

      Accessible Combinations

    • + style="color:#96CCFF;background-color:#111111">
      Aa - 4.50 + 11.13

      In visual perception a color is almost never seen as it really @@ -43629,8 +43830,8 @@

      Accessible Combinations

      + .light-blue { color: #96CCFF } - .lightest-blue { color: #CDECFF } @@ -43639,6 +43840,7 @@

      Accessible Combinations

      + .bg-near-black { background-color: #111111 } @@ -43662,7 +43864,6 @@

      Accessible Combinations

      - .bg-dark-green { background-color: #137752 } @@ -43680,10 +43881,10 @@

      Accessible Combinations

    • + style="color:#96CCFF;background-color:#333333">
      Aa - 13.74 + 7.45

      In visual perception a color is almost never seen as it really @@ -43724,8 +43925,8 @@

      Accessible Combinations

      + .light-blue { color: #96CCFF } - .lightest-blue { color: #CDECFF } @@ -43735,6 +43936,7 @@

      Accessible Combinations

      + .bg-dark-gray { background-color: #333333 } @@ -43760,7 +43962,6 @@

      Accessible Combinations

      - .bg-navy { background-color: #001B44 } @@ -43775,10 +43976,10 @@

      Accessible Combinations

    • + style="color:#96CCFF;background-color:#555555">
      Aa - 7.34 + 4.39

      In visual perception a color is almost never seen as it really @@ -43819,8 +44020,8 @@

      Accessible Combinations

      + .light-blue { color: #96CCFF } - .lightest-blue { color: #CDECFF } @@ -43831,6 +44032,7 @@

      Accessible Combinations

      + .bg-mid-gray { background-color: #555555 } @@ -43856,7 +44058,6 @@

      Accessible Combinations

      - .bg-dark-blue { background-color: #00449E } @@ -43870,10 +44071,10 @@

      Accessible Combinations

    • + style="color:#96CCFF;background-color:#5E2CA5">
      Aa - 20.65 + 5.20

      In visual perception a color is almost never seen as it really @@ -43914,16 +44115,15 @@

      Accessible Combinations

      + .light-blue { color: #96CCFF } - .washed-blue { color: #F6FFFE } - .bg-black { background-color: #000000 } @@ -43942,6 +44142,7 @@

      Accessible Combinations

      + .bg-purple { background-color: #5E2CA5 } @@ -43965,10 +44166,10 @@

      Accessible Combinations

    • + style="color:#96CCFF;background-color:#137752">
      Aa - 18.57 + 3.27

      In visual perception a color is almost never seen as it really @@ -44009,9 +44210,9 @@

      Accessible Combinations

      + .light-blue { color: #96CCFF } - .washed-blue { color: #F6FFFE } @@ -44019,7 +44220,6 @@

      Accessible Combinations

      - .bg-near-black { background-color: #111111 } @@ -44043,6 +44243,7 @@

      Accessible Combinations

      + .bg-dark-green { background-color: #137752 } @@ -44060,10 +44261,10 @@

      Accessible Combinations

    • + style="color:#96CCFF;background-color:#001B44">
      Aa - 8.29 + 9.98

      In visual perception a color is almost never seen as it really @@ -44104,9 +44305,10 @@

      Accessible Combinations

      + .light-blue { color: #96CCFF } + - .washed-blue { color: #F6FFFE } @@ -44139,6 +44341,7 @@

      Accessible Combinations

      + .bg-navy { background-color: #001B44 } @@ -44153,10 +44356,10 @@

      Accessible Combinations

    • + style="color:#96CCFF;background-color:#00449E">
      Aa - 7.33 + 5.33

      In visual perception a color is almost never seen as it really @@ -44197,9 +44400,9 @@

      Accessible Combinations

      + .light-blue { color: #96CCFF } - .washed-blue { color: #F6FFFE } @@ -44209,7 +44412,6 @@

      Accessible Combinations

      - .bg-mid-gray { background-color: #555555 } @@ -44235,6 +44437,7 @@

      Accessible Combinations

      + .bg-dark-blue { background-color: #00449E } @@ -44248,10 +44451,10 @@

      Accessible Combinations

    • + style="color:#CDECFF;background-color:#000000">
      Aa - 4.40 + 17.04

      In visual perception a color is almost never seen as it really @@ -44293,19 +44496,19 @@

      Accessible Combinations

      + .lightest-blue { color: #CDECFF } - .washed-blue { color: #F6FFFE } + .bg-black { background-color: #000000 } - .bg-gray { background-color: #777777 } @@ -44343,10 +44546,10 @@

      Accessible Combinations

    • + style="color:#CDECFF;background-color:#111111">
      Aa - 4.67 + 15.32

      In visual perception a color is almost never seen as it really @@ -44388,8 +44591,8 @@

      Accessible Combinations

      + .lightest-blue { color: #CDECFF } - .washed-blue { color: #F6FFFE } @@ -44397,6 +44600,7 @@

      Accessible Combinations

      + .bg-near-black { background-color: #111111 } @@ -44407,7 +44611,6 @@

      Accessible Combinations

      - .bg-dark-red { background-color: #E7040F } @@ -44438,10 +44641,10 @@

      Accessible Combinations

    • + style="color:#CDECFF;background-color:#333333">
      Aa - 3.41 + 10.25

      In visual perception a color is almost never seen as it really @@ -44483,8 +44686,8 @@

      Accessible Combinations

      + .lightest-blue { color: #CDECFF } - .washed-blue { color: #F6FFFE } @@ -44493,6 +44696,7 @@

      Accessible Combinations

      + .bg-dark-gray { background-color: #333333 } @@ -44503,7 +44707,6 @@

      Accessible Combinations

      - .bg-red { background-color: #FF4136 } @@ -44533,10 +44736,10 @@

      Accessible Combinations

    • + style="color:#CDECFF;background-color:#555555">
      Aa - 8.68 + 6.05

      In visual perception a color is almost never seen as it really @@ -44578,8 +44781,8 @@

      Accessible Combinations

      + .lightest-blue { color: #CDECFF } - .washed-blue { color: #F6FFFE } @@ -44589,6 +44792,7 @@

      Accessible Combinations

      + .bg-mid-gray { background-color: #555555 } @@ -44604,7 +44808,6 @@

      Accessible Combinations

      - .bg-purple { background-color: #5E2CA5 } @@ -44628,10 +44831,10 @@

      Accessible Combinations

    • + style="color:#CDECFF;background-color:#777777">
      Aa - 3.66 + 3.63

      In visual perception a color is almost never seen as it really @@ -44673,8 +44876,8 @@

      Accessible Combinations

      + .lightest-blue { color: #CDECFF } - .washed-blue { color: #F6FFFE } @@ -44685,6 +44888,7 @@

      Accessible Combinations

      + .bg-gray { background-color: #777777 } @@ -44700,7 +44904,6 @@

      Accessible Combinations

      - .bg-light-purple { background-color: #A463F2 } @@ -44723,10 +44926,10 @@

      Accessible Combinations

    • + style="color:#CDECFF;background-color:#E7040F">
      Aa - 4.89 + 3.85

      In visual perception a color is almost never seen as it really @@ -44768,8 +44971,8 @@

      Accessible Combinations

      + .lightest-blue { color: #CDECFF } - .washed-blue { color: #F6FFFE } @@ -44787,6 +44990,7 @@

      Accessible Combinations

      + .bg-dark-red { background-color: #E7040F } @@ -44796,7 +45000,6 @@

      Accessible Combinations

      - .bg-dark-pink { background-color: #D5008F } @@ -44818,10 +45021,10 @@

      Accessible Combinations

    • + style="color:#CDECFF;background-color:#5E2CA5">
      Aa - 3.10 + 7.16

      In visual perception a color is almost never seen as it really @@ -44863,8 +45066,8 @@

      Accessible Combinations

      + .lightest-blue { color: #CDECFF } - .washed-blue { color: #F6FFFE } @@ -44889,10 +45092,10 @@

      Accessible Combinations

      + .bg-purple { background-color: #5E2CA5 } - .bg-hot-pink { background-color: #FF41B4 } @@ -44913,10 +45116,10 @@

      Accessible Combinations

    • + style="color:#CDECFF;background-color:#A463F2">
      Aa - 5.45 + 3.02

      In visual perception a color is almost never seen as it really @@ -44958,8 +45161,8 @@

      Accessible Combinations

      + .lightest-blue { color: #CDECFF } - .washed-blue { color: #F6FFFE } @@ -44985,12 +45188,12 @@

      Accessible Combinations

      + .bg-light-purple { background-color: #A463F2 } - .bg-dark-green { background-color: #137752 } @@ -45008,10 +45211,10 @@

      Accessible Combinations

    • + style="color:#CDECFF;background-color:#D5008F">
      Aa - 16.65 + 4.03

      In visual perception a color is almost never seen as it really @@ -45053,8 +45256,8 @@

      Accessible Combinations

      + .lightest-blue { color: #CDECFF } - .washed-blue { color: #F6FFFE } @@ -45081,6 +45284,7 @@

      Accessible Combinations

      + .bg-dark-pink { background-color: #D5008F } @@ -45088,7 +45292,6 @@

      Accessible Combinations

      - .bg-navy { background-color: #001B44 } @@ -45103,10 +45306,10 @@

      Accessible Combinations

    • + style="color:#CDECFF;background-color:#137752">
      Aa - 8.90 + 4.50

      In visual perception a color is almost never seen as it really @@ -45148,8 +45351,8 @@

      Accessible Combinations

      + .lightest-blue { color: #CDECFF } - .washed-blue { color: #F6FFFE } @@ -45180,11 +45383,11 @@

      Accessible Combinations

      + .bg-dark-green { background-color: #137752 } - .bg-dark-blue { background-color: #00449E } @@ -45198,10 +45401,10 @@

      Accessible Combinations

    • + style="color:#CDECFF;background-color:#001B44">
      Aa - 3.59 + 13.74

      In visual perception a color is almost never seen as it really @@ -45243,8 +45446,9 @@

      Accessible Combinations

      + .lightest-blue { color: #CDECFF } + - .washed-blue { color: #F6FFFE } @@ -45277,6 +45481,7 @@

      Accessible Combinations

      + .bg-navy { background-color: #001B44 } @@ -45291,10 +45496,10 @@

      Accessible Combinations

    • + style="color:#CDECFF;background-color:#00449E">
      Aa - 19.80 + 7.34

      In visual perception a color is almost never seen as it really @@ -45336,15 +45541,14 @@

      Accessible Combinations

      + .lightest-blue { color: #CDECFF } - .washed-green { color: #E8FDF5 } - .bg-black { background-color: #000000 } @@ -45373,6 +45577,7 @@

      Accessible Combinations

      + .bg-dark-blue { background-color: #00449E } @@ -45386,10 +45591,10 @@

      Accessible Combinations

    • + style="color:#CDECFF;background-color:#357EDD">
      Aa - 17.80 + 3.29

      In visual perception a color is almost never seen as it really @@ -45431,16 +45636,15 @@

      Accessible Combinations

      + .lightest-blue { color: #CDECFF } - .washed-green { color: #E8FDF5 } - .bg-near-black { background-color: #111111 } @@ -45469,6 +45673,7 @@

      Accessible Combinations

      + .bg-blue { background-color: #357EDD } @@ -45481,10 +45686,10 @@

      Accessible Combinations

    • + style="color:#F6FFFE;background-color:#000000">
      Aa - 7.95 + 20.65

      In visual perception a color is almost never seen as it really @@ -45527,13 +45732,15 @@

      Accessible Combinations

      + .washed-blue { color: #F6FFFE } - .washed-green { color: #E8FDF5 } + .bg-black { background-color: #000000 } + @@ -45574,10 +45781,10 @@

      Accessible Combinations

    • + style="color:#F6FFFE;background-color:#111111">
      Aa - 7.03 + 18.57

      In visual perception a color is almost never seen as it really @@ -45620,17 +45827,17 @@

      Accessible Combinations

      + .washed-blue { color: #F6FFFE } - .washed-green { color: #E8FDF5 } + .bg-near-black { background-color: #111111 } - .bg-mid-gray { background-color: #555555 } @@ -45669,10 +45876,10 @@

      Accessible Combinations

    • + style="color:#F6FFFE;background-color:#333333">
      Aa - 4.22 + 12.43

      In visual perception a color is almost never seen as it really @@ -45715,8 +45922,8 @@

      Accessible Combinations

      + .washed-blue { color: #F6FFFE } - .washed-green { color: #E8FDF5 } @@ -45724,9 +45931,9 @@

      Accessible Combinations

      + .bg-dark-gray { background-color: #333333 } - .bg-gray { background-color: #777777 } @@ -45764,10 +45971,10 @@

      Accessible Combinations

    • + style="color:#F6FFFE;background-color:#555555">
      Aa - 4.48 + 7.33

      In visual perception a color is almost never seen as it really @@ -45810,8 +46017,8 @@

      Accessible Combinations

      + .washed-blue { color: #F6FFFE } - .washed-green { color: #E8FDF5 } @@ -45820,6 +46027,7 @@

      Accessible Combinations

      + .bg-mid-gray { background-color: #555555 } @@ -45828,7 +46036,6 @@

      Accessible Combinations

      - .bg-dark-red { background-color: #E7040F } @@ -45859,10 +46066,10 @@

      Accessible Combinations

    • + style="color:#F6FFFE;background-color:#777777">
      Aa - 3.27 + 4.40

      In visual perception a color is almost never seen as it really @@ -45905,8 +46112,8 @@

      Accessible Combinations

      + .washed-blue { color: #F6FFFE } - .washed-green { color: #E8FDF5 } @@ -45916,6 +46123,7 @@

      Accessible Combinations

      + .bg-gray { background-color: #777777 } @@ -45924,7 +46132,6 @@

      Accessible Combinations

      - .bg-red { background-color: #FF4136 } @@ -45954,10 +46161,10 @@

      Accessible Combinations

    • + style="color:#F6FFFE;background-color:#E7040F">
      Aa - 8.32 + 4.67

      In visual perception a color is almost never seen as it really @@ -46000,8 +46207,8 @@

      Accessible Combinations

      + .washed-blue { color: #F6FFFE } - .washed-green { color: #E8FDF5 } @@ -46018,6 +46225,7 @@

      Accessible Combinations

      + .bg-dark-red { background-color: #E7040F } @@ -46025,7 +46233,6 @@

      Accessible Combinations

      - .bg-purple { background-color: #5E2CA5 } @@ -46049,10 +46256,10 @@

      Accessible Combinations

    • + style="color:#F6FFFE;background-color:#FF4136">
      Aa - 3.51 + 3.41

      In visual perception a color is almost never seen as it really @@ -46095,8 +46302,7 @@

      Accessible Combinations

      - - .washed-green { color: #E8FDF5 } + .washed-blue { color: #F6FFFE } @@ -46115,13 +46321,14 @@

      Accessible Combinations

      + .bg-red { background-color: #FF4136 } + - .bg-light-purple { background-color: #A463F2 } @@ -46144,10 +46351,10 @@

      Accessible Combinations

    • + style="color:#F6FFFE;background-color:#5E2CA5">
      Aa - 4.69 + 8.68

      In visual perception a color is almost never seen as it really @@ -46190,8 +46397,8 @@

      Accessible Combinations

      + .washed-blue { color: #F6FFFE } - .washed-green { color: #E8FDF5 } @@ -46215,9 +46422,9 @@

      Accessible Combinations

      + .bg-purple { background-color: #5E2CA5 } - .bg-dark-pink { background-color: #D5008F } @@ -46239,10 +46446,10 @@

      Accessible Combinations

    • + style="color:#F6FFFE;background-color:#A463F2">
      Aa - 5.23 + 3.66

      In visual perception a color is almost never seen as it really @@ -46285,8 +46492,8 @@

      Accessible Combinations

      + .washed-blue { color: #F6FFFE } - .washed-green { color: #E8FDF5 } @@ -46311,12 +46518,12 @@

      Accessible Combinations

      + .bg-light-purple { background-color: #A463F2 } - .bg-dark-green { background-color: #137752 } @@ -46334,10 +46541,10 @@

      Accessible Combinations

    • + style="color:#F6FFFE;background-color:#D5008F">
      Aa - 15.96 + 4.89

      In visual perception a color is almost never seen as it really @@ -46380,8 +46587,8 @@

      Accessible Combinations

      + .washed-blue { color: #F6FFFE } - .washed-green { color: #E8FDF5 } @@ -46407,6 +46614,7 @@

      Accessible Combinations

      + .bg-dark-pink { background-color: #D5008F } @@ -46414,7 +46622,6 @@

      Accessible Combinations

      - .bg-navy { background-color: #001B44 } @@ -46429,10 +46636,10 @@

      Accessible Combinations

    • + style="color:#F6FFFE;background-color:#FF41B4">
      Aa - 8.53 + 3.10

      In visual perception a color is almost never seen as it really @@ -46475,8 +46682,8 @@

      Accessible Combinations

      + .washed-blue { color: #F6FFFE } - .washed-green { color: #E8FDF5 } @@ -46503,6 +46710,7 @@

      Accessible Combinations

      + .bg-hot-pink { background-color: #FF41B4 } @@ -46510,7 +46718,6 @@

      Accessible Combinations

      - .bg-dark-blue { background-color: #00449E } @@ -46524,10 +46731,10 @@

      Accessible Combinations

    • + style="color:#F6FFFE;background-color:#137752">
      Aa - 3.44 + 5.45

      In visual perception a color is almost never seen as it really @@ -46570,8 +46777,8 @@

      Accessible Combinations

      + .washed-blue { color: #F6FFFE } - .washed-green { color: #E8FDF5 } @@ -46600,6 +46807,8 @@

      Accessible Combinations

      + + .bg-dark-green { background-color: #137752 } @@ -46617,10 +46826,10 @@

      Accessible Combinations

    • + style="color:#F6FFFE;background-color:#001B44">
      Aa - 20.38 + 16.65

      In visual perception a color is almost never seen as it really @@ -46663,14 +46872,13 @@

      Accessible Combinations

      + .washed-blue { color: #F6FFFE } - .washed-yellow { color: #FFFCEB } - .bg-black { background-color: #000000 } @@ -46698,6 +46906,7 @@

      Accessible Combinations

      + .bg-navy { background-color: #001B44 } @@ -46712,10 +46921,10 @@

      Accessible Combinations

    • + style="color:#F6FFFE;background-color:#00449E">
      Aa - 18.32 + 8.90

      In visual perception a color is almost never seen as it really @@ -46758,15 +46967,14 @@

      Accessible Combinations

      + .washed-blue { color: #F6FFFE } - .washed-yellow { color: #FFFCEB } - .bg-near-black { background-color: #111111 } @@ -46794,6 +47002,7 @@

      Accessible Combinations

      + .bg-dark-blue { background-color: #00449E } @@ -46807,10 +47016,10 @@

      Accessible Combinations

    • + style="color:#F6FFFE;background-color:#357EDD">
      Aa - 8.18 + 3.99

      In visual perception a color is almost never seen as it really @@ -46853,9 +47062,10 @@

      Accessible Combinations

      + .washed-blue { color: #F6FFFE } + - .washed-yellow { color: #FFFCEB } @@ -46888,6 +47098,7 @@

      Accessible Combinations

      + .bg-blue { background-color: #357EDD } @@ -46900,10 +47111,10 @@

      Accessible Combinations

    • + style="color:#E8FDF5;background-color:#000000">
      Aa - 7.23 + 19.80

      In visual perception a color is almost never seen as it really @@ -46947,16 +47158,16 @@

      Accessible Combinations

      + .washed-green { color: #E8FDF5 } - .washed-yellow { color: #FFFCEB } + .bg-black { background-color: #000000 } - .bg-mid-gray { background-color: #555555 } @@ -46995,10 +47206,10 @@

      Accessible Combinations

    • + style="color:#E8FDF5;background-color:#111111">
      Aa - 4.34 + 17.80

      In visual perception a color is almost never seen as it really @@ -47042,17 +47253,17 @@

      Accessible Combinations

      + .washed-green { color: #E8FDF5 } - .washed-yellow { color: #FFFCEB } + .bg-near-black { background-color: #111111 } - .bg-gray { background-color: #777777 } @@ -47090,10 +47301,10 @@

      Accessible Combinations

    • + style="color:#E8FDF5;background-color:#333333">
      Aa - 4.61 + 11.91

      In visual perception a color is almost never seen as it really @@ -47137,14 +47348,15 @@

      Accessible Combinations

      + .washed-green { color: #E8FDF5 } - .washed-yellow { color: #FFFCEB } + .bg-dark-gray { background-color: #333333 } @@ -47154,7 +47366,6 @@

      Accessible Combinations

      - .bg-dark-red { background-color: #E7040F } @@ -47185,10 +47396,10 @@

      Accessible Combinations

    • + style="color:#E8FDF5;background-color:#555555">
      Aa - 3.36 + 7.03

      In visual perception a color is almost never seen as it really @@ -47232,8 +47443,8 @@

      Accessible Combinations

      + .washed-green { color: #E8FDF5 } - .washed-yellow { color: #FFFCEB } @@ -47241,6 +47452,7 @@

      Accessible Combinations

      + .bg-mid-gray { background-color: #555555 } @@ -47250,7 +47462,6 @@

      Accessible Combinations

      - .bg-red { background-color: #FF4136 } @@ -47280,10 +47491,10 @@

      Accessible Combinations

    • + style="color:#E8FDF5;background-color:#777777">
      Aa - 8.56 + 4.22

      In visual perception a color is almost never seen as it really @@ -47327,8 +47538,8 @@

      Accessible Combinations

      + .washed-green { color: #E8FDF5 } - .washed-yellow { color: #FFFCEB } @@ -47337,6 +47548,7 @@

      Accessible Combinations

      + .bg-gray { background-color: #777777 } @@ -47351,7 +47563,6 @@

      Accessible Combinations

      - .bg-purple { background-color: #5E2CA5 } @@ -47375,10 +47586,10 @@

      Accessible Combinations

    • + style="color:#E8FDF5;background-color:#E7040F">
      Aa - 3.61 + 4.48

      In visual perception a color is almost never seen as it really @@ -47422,8 +47633,8 @@

      Accessible Combinations

      + .washed-green { color: #E8FDF5 } - .washed-yellow { color: #FFFCEB } @@ -47439,6 +47650,7 @@

      Accessible Combinations

      + .bg-dark-red { background-color: #E7040F } @@ -47447,7 +47659,6 @@

      Accessible Combinations

      - .bg-light-purple { background-color: #A463F2 } @@ -47470,10 +47681,10 @@

      Accessible Combinations

    • + style="color:#E8FDF5;background-color:#FF4136">
      Aa - 4.82 + 3.27

      In visual perception a color is almost never seen as it really @@ -47517,8 +47728,8 @@

      Accessible Combinations

      + .washed-green { color: #E8FDF5 } - .washed-yellow { color: #FFFCEB } @@ -47535,6 +47746,7 @@

      Accessible Combinations

      + .bg-red { background-color: #FF4136 } @@ -47543,7 +47755,6 @@

      Accessible Combinations

      - .bg-dark-pink { background-color: #D5008F } @@ -47565,10 +47776,10 @@

      Accessible Combinations

    • + style="color:#E8FDF5;background-color:#5E2CA5">
      Aa - 3.06 + 8.32

      In visual perception a color is almost never seen as it really @@ -47612,8 +47823,8 @@

      Accessible Combinations

      + .washed-green { color: #E8FDF5 } - .washed-yellow { color: #FFFCEB } @@ -47636,10 +47847,10 @@

      Accessible Combinations

      + .bg-purple { background-color: #5E2CA5 } - .bg-hot-pink { background-color: #FF41B4 } @@ -47660,10 +47871,10 @@

      Accessible Combinations

    • + style="color:#E8FDF5;background-color:#A463F2">
      Aa - 5.38 + 3.51

      In visual perception a color is almost never seen as it really @@ -47707,8 +47918,8 @@

      Accessible Combinations

      + .washed-green { color: #E8FDF5 } - .washed-yellow { color: #FFFCEB } @@ -47732,12 +47943,12 @@

      Accessible Combinations

      + .bg-light-purple { background-color: #A463F2 } - .bg-dark-green { background-color: #137752 } @@ -47755,10 +47966,10 @@

      Accessible Combinations

    • + style="color:#E8FDF5;background-color:#D5008F">
      Aa - 16.43 + 4.69

      In visual perception a color is almost never seen as it really @@ -47802,8 +48013,8 @@

      Accessible Combinations

      + .washed-green { color: #E8FDF5 } - .washed-yellow { color: #FFFCEB } @@ -47828,6 +48039,7 @@

      Accessible Combinations

      + .bg-dark-pink { background-color: #D5008F } @@ -47835,7 +48047,6 @@

      Accessible Combinations

      - .bg-navy { background-color: #001B44 } @@ -47850,10 +48061,10 @@

      Accessible Combinations

    • + style="color:#E8FDF5;background-color:#137752">
      Aa - 8.78 + 5.23

      In visual perception a color is almost never seen as it really @@ -47897,8 +48108,8 @@

      Accessible Combinations

      + .washed-green { color: #E8FDF5 } - .washed-yellow { color: #FFFCEB } @@ -47927,11 +48138,11 @@

      Accessible Combinations

      + .bg-dark-green { background-color: #137752 } - .bg-dark-blue { background-color: #00449E } @@ -47945,10 +48156,10 @@

      Accessible Combinations

    • + style="color:#E8FDF5;background-color:#001B44">
      Aa - 3.54 + 15.96

      In visual perception a color is almost never seen as it really @@ -47992,8 +48203,8 @@

      Accessible Combinations

      + .washed-green { color: #E8FDF5 } - .washed-yellow { color: #FFFCEB } @@ -48024,6 +48235,8 @@

      Accessible Combinations

      + + .bg-navy { background-color: #001B44 } @@ -48038,10 +48251,10 @@

      Accessible Combinations

    • + style="color:#E8FDF5;background-color:#00449E">
      Aa - 16.87 + 8.53

      In visual perception a color is almost never seen as it really @@ -48085,13 +48298,12 @@

      Accessible Combinations

      + .washed-green { color: #E8FDF5 } - .washed-red { color: #FFDFDF } - .bg-black { background-color: #000000 } @@ -48120,6 +48332,7 @@

      Accessible Combinations

      + .bg-dark-blue { background-color: #00449E } @@ -48133,10 +48346,10 @@

      Accessible Combinations

    • + style="color:#E8FDF5;background-color:#357EDD">
      Aa - 15.17 + 3.82

      In visual perception a color is almost never seen as it really @@ -48180,14 +48393,13 @@

      Accessible Combinations

      + .washed-green { color: #E8FDF5 } - .washed-red { color: #FFDFDF } - .bg-near-black { background-color: #111111 } @@ -48216,6 +48428,7 @@

      Accessible Combinations

      + .bg-blue { background-color: #357EDD } @@ -48228,10 +48441,10 @@

      Accessible Combinations

    • + style="color:#FFFCEB;background-color:#000000">
      Aa - 6.78 + 20.38

      In visual perception a color is almost never seen as it really @@ -48275,11 +48488,13 @@

      Accessible Combinations

      + + .washed-yellow { color: #FFFCEB } - .washed-red { color: #FFDFDF } + .bg-black { background-color: #000000 } @@ -48321,10 +48536,10 @@

      Accessible Combinations

    • + style="color:#FFFCEB;background-color:#111111">
      Aa - 5.99 + 18.32

      In visual perception a color is almost never seen as it really @@ -48369,15 +48584,15 @@

      Accessible Combinations

      + .washed-yellow { color: #FFFCEB } - .washed-red { color: #FFDFDF } + .bg-near-black { background-color: #111111 } - .bg-mid-gray { background-color: #555555 } @@ -48416,10 +48631,10 @@

      Accessible Combinations

    • + style="color:#FFFCEB;background-color:#333333">
      Aa - 3.60 + 12.26

      In visual perception a color is almost never seen as it really @@ -48464,16 +48679,16 @@

      Accessible Combinations

      + .washed-yellow { color: #FFFCEB } - .washed-red { color: #FFDFDF } + .bg-dark-gray { background-color: #333333 } - .bg-gray { background-color: #777777 } @@ -48511,10 +48726,10 @@

      Accessible Combinations

    • + style="color:#FFFCEB;background-color:#555555">
      Aa - 3.82 + 7.23

      In visual perception a color is almost never seen as it really @@ -48559,14 +48774,15 @@

      Accessible Combinations

      + .washed-yellow { color: #FFFCEB } - .washed-red { color: #FFDFDF } + .bg-mid-gray { background-color: #555555 } @@ -48575,7 +48791,6 @@

      Accessible Combinations

      - .bg-dark-red { background-color: #E7040F } @@ -48606,10 +48821,10 @@

      Accessible Combinations

    • + style="color:#FFFCEB;background-color:#777777">
      Aa - 7.09 + 4.34

      In visual perception a color is almost never seen as it really @@ -48654,8 +48869,8 @@

      Accessible Combinations

      + .washed-yellow { color: #FFFCEB } - .washed-red { color: #FFDFDF } @@ -48663,6 +48878,7 @@

      Accessible Combinations

      + .bg-gray { background-color: #777777 } @@ -48677,7 +48893,6 @@

      Accessible Combinations

      - .bg-purple { background-color: #5E2CA5 } @@ -48701,10 +48916,10 @@

      Accessible Combinations

    • + style="color:#FFFCEB;background-color:#E7040F">
      Aa - 3.99 + 4.61

      In visual perception a color is almost never seen as it really @@ -48749,8 +48964,8 @@

      Accessible Combinations

      + .washed-yellow { color: #FFFCEB } - .washed-red { color: #FFDFDF } @@ -48765,6 +48980,7 @@

      Accessible Combinations

      + .bg-dark-red { background-color: #E7040F } @@ -48774,7 +48990,6 @@

      Accessible Combinations

      - .bg-dark-pink { background-color: #D5008F } @@ -48796,10 +49011,10 @@

      Accessible Combinations

    • + style="color:#FFFCEB;background-color:#FF4136">
      Aa - 4.45 + 3.36

      In visual perception a color is almost never seen as it really @@ -48844,8 +49059,8 @@

      Accessible Combinations

      + .washed-yellow { color: #FFFCEB } - .washed-red { color: #FFDFDF } @@ -48861,6 +49076,7 @@

      Accessible Combinations

      + .bg-red { background-color: #FF4136 } @@ -48873,7 +49089,6 @@

      Accessible Combinations

      - .bg-dark-green { background-color: #137752 } @@ -48891,10 +49106,10 @@

      Accessible Combinations

    • + style="color:#FFFCEB;background-color:#5E2CA5">
      Aa - 13.60 + 8.56

      In visual perception a color is almost never seen as it really @@ -48939,38 +49154,1653 @@

      Accessible Combinations

      - - .washed-red { color: #FFDFDF } - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + .washed-yellow { color: #FFFCEB } + + + + + + + + + + + + + + + + + + + + + + + .bg-purple { background-color: #5E2CA5 } + + + + + + + + + + + + + + + + + + +
      +
    + + +
  • +
    + Aa + 3.61 +
    +

    + In visual perception a color is almost never seen as it really +is – as it physically is. This fact makes color the most relative medium in +art. + - Josef Albers +

    +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .washed-yellow { color: #FFFCEB } + + + + + + + + + + + + + + + + + + + + + + + + .bg-light-purple { background-color: #A463F2 } + + + + + + + + + + + + + + + + + +
    +
    +
  • + +
  • +
    + Aa + 4.82 +
    +

    + In visual perception a color is almost never seen as it really +is – as it physically is. This fact makes color the most relative medium in +art. + - Josef Albers +

    +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .washed-yellow { color: #FFFCEB } + + + + + + + + + + + + + + + + + + + + + + + + + .bg-dark-pink { background-color: #D5008F } + + + + + + + + + + + + + + + + +
    +
    +
  • + +
  • +
    + Aa + 3.06 +
    +

    + In visual perception a color is almost never seen as it really +is – as it physically is. This fact makes color the most relative medium in +art. + - Josef Albers +

    +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .washed-yellow { color: #FFFCEB } + + + + + + + + + + + + + + + + + + + + + + + + + + .bg-hot-pink { background-color: #FF41B4 } + + + + + + + + + + + + + + + +
    +
    +
  • + +
  • +
    + Aa + 5.38 +
    +

    + In visual perception a color is almost never seen as it really +is – as it physically is. This fact makes color the most relative medium in +art. + - Josef Albers +

    +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .washed-yellow { color: #FFFCEB } + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .bg-dark-green { background-color: #137752 } + + + + + + + + + + + + +
    +
    +
  • + +
  • +
    + Aa + 16.43 +
    +

    + In visual perception a color is almost never seen as it really +is – as it physically is. This fact makes color the most relative medium in +art. + - Josef Albers +

    +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .washed-yellow { color: #FFFCEB } + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .bg-navy { background-color: #001B44 } + + + + + + + + + +
    +
    +
  • + +
  • +
    + Aa + 8.78 +
    +

    + In visual perception a color is almost never seen as it really +is – as it physically is. This fact makes color the most relative medium in +art. + - Josef Albers +

    +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .washed-yellow { color: #FFFCEB } + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .bg-dark-blue { background-color: #00449E } + + + + + + + + +
    +
    +
  • + +
  • +
    + Aa + 3.93 +
    +

    + In visual perception a color is almost never seen as it really +is – as it physically is. This fact makes color the most relative medium in +art. + - Josef Albers +

    +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .washed-yellow { color: #FFFCEB } + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .bg-blue { background-color: #357EDD } + + + + + + + +
    +
    +
  • + +
  • +
    + Aa + 16.87 +
    +

    + In visual perception a color is almost never seen as it really +is – as it physically is. This fact makes color the most relative medium in +art. + - Josef Albers +

    +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .washed-red { color: #FFDFDF } + + + + .bg-black { background-color: #000000 } + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
    +
  • + +
  • +
    + Aa + 15.17 +
    +

    + In visual perception a color is almost never seen as it really +is – as it physically is. This fact makes color the most relative medium in +art. + - Josef Albers +

    +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .washed-red { color: #FFDFDF } + + + + + .bg-near-black { background-color: #111111 } + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
    +
  • + +
  • +
    + Aa + 10.15 +
    +

    + In visual perception a color is almost never seen as it really +is – as it physically is. This fact makes color the most relative medium in +art. + - Josef Albers +

    +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .washed-red { color: #FFDFDF } + + + + + + .bg-dark-gray { background-color: #333333 } + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
    +
  • + +
  • +
    + Aa + 5.99 +
    +

    + In visual perception a color is almost never seen as it really +is – as it physically is. This fact makes color the most relative medium in +art. + - Josef Albers +

    +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .washed-red { color: #FFDFDF } + + + + + + + .bg-mid-gray { background-color: #555555 } + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
    +
  • + +
  • +
    + Aa + 3.60 +
    +

    + In visual perception a color is almost never seen as it really +is – as it physically is. This fact makes color the most relative medium in +art. + - Josef Albers +

    +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .washed-red { color: #FFDFDF } + + + + + + + + .bg-gray { background-color: #777777 } + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
    +
  • + +
  • +
    + Aa + 3.82 +
    +

    + In visual perception a color is almost never seen as it really +is – as it physically is. This fact makes color the most relative medium in +art. + - Josef Albers +

    +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .washed-red { color: #FFDFDF } + + + + + + + + + + + + + + + .bg-dark-red { background-color: #E7040F } + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
    +
  • + +
  • +
    + Aa + 7.09 +
    +

    + In visual perception a color is almost never seen as it really +is – as it physically is. This fact makes color the most relative medium in +art. + - Josef Albers +

    +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .washed-red { color: #FFDFDF } + + + + + + + + + + + + + + + + + + + + + + .bg-purple { background-color: #5E2CA5 } + + + + + + + + + + + + + + + + + + +
    +
    +
  • + +
  • +
    + Aa + 3.99 +
    +

    + In visual perception a color is almost never seen as it really +is – as it physically is. This fact makes color the most relative medium in +art. + - Josef Albers +

    +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .washed-red { color: #FFDFDF } + + + + + + + + + + + + + + + + + + + + + + + + .bg-dark-pink { background-color: #D5008F } + + + + + + + + + + + + + + + + +
    +
    +
  • + +
  • +
    + Aa + 4.45 +
    +

    + In visual perception a color is almost never seen as it really +is – as it physically is. This fact makes color the most relative medium in +art. + - Josef Albers +

    +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .washed-red { color: #FFDFDF } + + + + + + + + + + + + + + + + + + + + + + + + + + + + .bg-dark-green { background-color: #137752 } + + + + + + + + + + + + +
    +
    +
  • + +
  • +
    + Aa + 13.60 +
    +

    + In visual perception a color is almost never seen as it really +is – as it physically is. This fact makes color the most relative medium in +art. + - Josef Albers +

    +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .washed-red { color: #FFDFDF } + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .bg-navy { background-color: #001B44 } @@ -48986,10 +50816,10 @@

    Accessible Combinations

  • + style="color:#FFDFDF;background-color:#00449E">
    Aa - 3.89 + 7.27

    In visual perception a color is almost never seen as it really @@ -49017,7 +50847,6 @@

    Accessible Combinations

    - .light-yellow { color: #FBF1A9 } @@ -49036,6 +50865,102 @@

    Accessible Combinations

    + .washed-red { color: #FFDFDF } + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .bg-dark-blue { background-color: #00449E } + + + + + + + + +
    +
  • + + +
  • +
    + Aa + 3.26 +
    +

    + In visual perception a color is almost never seen as it really +is – as it physically is. This fact makes color the most relative medium in +art. + - Josef Albers +

    +
    +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + .washed-red { color: #FFDFDF } @@ -49043,7 +50968,6 @@

    Accessible Combinations

    - .bg-gray { background-color: #777777 } @@ -49069,6 +50993,7 @@

    Accessible Combinations

    + .bg-blue { background-color: #357EDD } @@ -49100,17 +51025,17 @@

    Reference

    tachyons-skins

    - v4.0.3 - 846 B + v4.1.1 + 868 B
    Declarations
    -
    111
    +
    113
    Selectors
    -
    111
    +
    113
    Max. Specificity Score
    @@ -49395,7 +51320,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -49406,7 +51331,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/typography/font-family/athelas/index.html b/docs/typography/font-family/athelas/index.html index dd283ab32..742e9076c 100644 --- a/docs/typography/font-family/athelas/index.html +++ b/docs/typography/font-family/athelas/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -491,7 +491,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -502,7 +502,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/typography/font-family/avenir/index.html b/docs/typography/font-family/avenir/index.html index 4397b8f30..25086a6c5 100644 --- a/docs/typography/font-family/avenir/index.html +++ b/docs/typography/font-family/avenir/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
  • @@ -338,10 +338,10 @@

    Italic

    In 1988, the Swiss typeface designer first presented Avenir to the public, which already at that time marked an excellent alternative to other well known typefaces such as Futura® or Avant Garde®. Compared to the mere metric construction of other typefaces, Avenir was convincing because of its optical construction which lent it a more humane appearance, as seen, for instance, in the classically drawn “a”.

    - The word avenir is French for "future". The font takes inspiration from the early geometric sans-serif typefaces Erbar (1922), designed by Jakob Erbar, and Futura (1927), designed by Paul Renner. Frutiger intended Avenir to be a more organic, humanist interpretation of these highly geometric types. While similarities can be seen with Futura, the two-story lowercase a is more like Erbar, and also recalls Frutiger’s earlier namesake typeface, Frutiger. + The word avenir is French for “future”. The font takes inspiration from the early geometric sans-serif typefaces Erbar (1922), designed by Jakob Erbar, and Futura (1927), designed by Paul Renner. Frutiger intended Avenir to be a more organic, humanist interpretation of these highly geometric types. While similarities can be seen with Futura, the two-story lowercase a is more like Erbar, and also recalls Frutiger’s earlier namesake typeface, Frutiger.

    - Frutiger considers Avenir his finest work. 'The quality of the draughtsmanship – rather than the intellectual idea behind it – is my masterpiece. (...) It was the hardest typeface I have worked on in my life. Working on it, I always had human nature in mind. And what's crucial is that I developed the typeface alone, in peace and quiet – no drafting assistants, no-one was there. My personality is stamped upon it. I'm proud that I was able to create Avenir. + Frutiger considers Avenir his finest work. ‘The quality of the draughtsmanship – rather than the intellectual idea behind it – is my masterpiece. (…) It was the hardest typeface I have worked on in my life. Working on it, I always had human nature in mind. And what’s crucial is that I developed the typeface alone, in peace and quiet – no drafting assistants, no-one was there. My personality is stamped upon it. I’m proud that I was able to create Avenir.’

    The current set of weights is therefore ultra light, thin, light, regular, medium, demi bold, bold and heavy, in four styles each (two widths and italics for each width). The installation on OS X does not include the thin and light weights, but does include Greek and Cyrillic glyphs in the regular width. @@ -493,7 +493,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -504,7 +504,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/typography/font-family/baskerville/index.html b/docs/typography/font-family/baskerville/index.html index 2744cce1f..1047316b3 100644 --- a/docs/typography/font-family/baskerville/index.html +++ b/docs/typography/font-family/baskerville/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -339,10 +339,10 @@

    Italic

    Compared to earlier designs, Baskerville increased the contrast between thick and thin strokes, making the serifs sharper and more tapered, and shifted the axis of rounded letters to a more vertical position. - The curved strokes are more circular in shape, and the characters became more regular. These changes created a greater consistency in size and form. + The curved strokes are more circular in shape, and the characters became more regular. These changes created a greater consistency in size and form.

    - Baskerville's typeface was the culmination of a large series of experiments. Baskerville, a wealthy industrialist who had begun his career as a writing-master, sought to develop new and higher-quality methods of printing, developing also finely pressed, smooth paper and a high quality of ink. + Baskerville’s typeface was the culmination of a large series of experiments. Baskerville, a wealthy industrialist who had begun his career as a writing-master, sought to develop new and higher-quality methods of printing, developing also finely pressed, smooth paper and a high quality of ink.

    The crispness of his work seems to have unsettled his contemporaries, and some claimed the stark contrasts in his printing damaged the eyes. Baskerville was never particularly successful as a printer, being a printer of specialist and elite editions. Abroad, however, he was much admired, notably by Pierre Simon Fournier, Giambattista Bodoni (who intended at one point to come to England to meet him), and Benjamin Franklin. @@ -494,7 +494,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -505,7 +505,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/typography/font-family/bodoni/index.html b/docs/typography/font-family/bodoni/index.html index f8c184ad9..3a67db229 100644 --- a/docs/typography/font-family/bodoni/index.html +++ b/docs/typography/font-family/bodoni/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -293,7 +293,7 @@

    Italic

    Bodoni is the name given to the serif typefaces first designed by Giambattista Bodoni (1740–1813) in the late eighteenth century - and frequently revived since. Bodoni's typefaces are + and frequently revived since. Bodoni’s typefaces are classified as Didone or modern. Bodoni followed the ideas of John Baskerville, as found in the printing type Baskerville.

    @@ -458,7 +458,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -469,7 +469,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/typography/font-family/garamond/index.html b/docs/typography/font-family/garamond/index.html index 9d56bdb23..dd01d76d0 100644 --- a/docs/typography/font-family/garamond/index.html +++ b/docs/typography/font-family/garamond/index.html @@ -31,7 +31,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -334,7 +334,7 @@

    Italic

    - Some distinctive characteristics in Garamond's letters are the small eye of the 'e' and the bowl of the a, which has a sharp hook upwards at top left. The 'M' is slightly splayed. The x-height (height of lower-case letters) is low, especially at larger sizes, making the capitals large relative to the lower case, while the top serifs on the ascenders of letters like 'd' have a downward slope and rise subtly above the cap height. Garamond typefaces are popular and often used, particularly for printing body text and books. + Some distinctive characteristics in Garamond’s letters are the small eye of the ‘e’ and the bowl of the ‘a’, which has a sharp hook upwards at top left. The ‘M’ is slightly splayed. The x-height (height of lower-case letters) is low, especially at larger sizes, making the capitals large relative to the lower case, while the top serifs on the ascenders of letters like ‘d’ have a downward slope and rise subtly above the cap height. Garamond typefaces are popular and often used, particularly for printing body text and books.

    Garmond, antiqua was designed and cut in Paris in 1535 by the punch-cutter @@ -347,13 +347,13 @@

    Italic

    The normal or medium faces are often used in small sizes for marginalia and captions to pictures. The semi-bold, bold, and italic faces are used mostly as display - faces. + faces.

    Since around 1910, many modern revivals of Garamond and related typefaces have been developed. Among these, the roman (regular; upright) versions of Adobe Garamond, Granjon, Sabon, and Stempel - Garamond are directly based on Garamond's work. + Garamond are directly based on Garamond’s work.

    @@ -502,7 +502,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -513,7 +513,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/typography/font-family/georgia/index.html b/docs/typography/font-family/georgia/index.html index 275155f9d..16b013a98 100644 --- a/docs/typography/font-family/georgia/index.html +++ b/docs/typography/font-family/georgia/index.html @@ -31,7 +31,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -334,13 +334,13 @@

    Italic

    - Some distinctive characteristics in georgia's letters are the small eye of the 'e' and the bowl of the a, which has a sharp hook upwards at top left. The 'M' is slightly splayed. The x-height (height of lower-case letters) is low, especially at larger sizes, making the capitals large relative to the lower case, while the top serifs on the ascenders of letters like 'd' have a downward slope and rise subtly above the cap height. Georgia typefaces are popular and often used, particularly for printing body text and books. + Some distinctive characteristics in georgia’s letters are the small eye of the ‘e’ and the bowl of the a, which has a sharp hook upwards at top left. The ‘M’ is slightly splayed. The x-height (height of lower-case letters) is low, especially at larger sizes, making the capitals large relative to the lower case, while the top serifs on the ascenders of letters like ‘d’ have a downward slope and rise subtly above the cap height. Georgia typefaces are popular and often used, particularly for printing body text and books.

    -As a transitional serif design, Georgia shows a number of traditional features of 'rational' serif typefaces from around the early 19th century, such as alternating thick and thin strokes, ball terminals, a vertical axis and an italic taking inspiration from calligraphy. Its figure (numeral) designs are lower-case or text figures, designed to blend into continuous text; this was at the time a rare feature in computer fonts. +As a transitional serif design, Georgia shows a number of traditional features of ‘rational’ serif typefaces from around the early 19th century, such as alternating thick and thin strokes, ball terminals, a vertical axis and an italic taking inspiration from calligraphy. Its figure (numeral) designs are lower-case or text figures, designed to blend into continuous text; this was at the time a rare feature in computer fonts.

    - Georgia's bold is also unusually bold, almost black. Carter noted that, "Verdana and Georgia...were all about binary bitmaps: every pixel was on or off, black or white...The bold versions of Verdana and Georgia are bolder than most bolds, because on the screen, at the time we were doing this in the mid-1990s, if the stem wanted to be thicker than one pixel, it could only go to two pixels. That is a bigger jump in weight than is conventional in print series." + Georgia’s bold is also unusually bold, almost black. Carter noted that, “Verdana and Georgia… were all about binary bitmaps: every pixel was on or off, black or white… The bold versions of Verdana and Georgia are bolder than most bolds, because on the screen, at the time we were doing this in the mid-1990s, if the stem wanted to be thicker than one pixel, it could only go to two pixels. That is a bigger jump in weight than is conventional in print series.”

    The Georgia typeface is similar to Times New Roman, another revival of transitional serif designs, but with many subtle differences: Georgia is larger than Times at the same point size, and has a much larger x-height at the same actual size. @@ -492,7 +492,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -503,7 +503,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/typography/font-family/helvetica/index.html b/docs/typography/font-family/helvetica/index.html index 925f8efb2..a29f61a7f 100644 --- a/docs/typography/font-family/helvetica/index.html +++ b/docs/typography/font-family/helvetica/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -98,7 +98,7 @@ - Georgia + Georgia @@ -335,12 +335,12 @@

    Italic

    - Some distinctive characteristics in helvetica's letters are the - small eye of the 'e' and the bowl of the a, which has a sharp - hook upwards at top left. The 'M' is slightly splayed. The + Some distinctive characteristics in Helvetica’s letters are the + small eye of the ‘e’ and the bowl of the a, which has a sharp + hook upwards at top left. The ‘M’ is slightly splayed. The x-height (height of lower-case letters) is low, especially at larger sizes, making the capitals large relative to the lower - case, while the top serifs on the ascenders of letters like 'd' + case, while the top serifs on the ascenders of letters like ‘d’ have a downward slope and rise subtly above the cap height. helvetica typefaces are popular and often used, particularly for printing body text and books. @@ -354,14 +354,14 @@

    Italic

    which give it a dense, compact appearance.

    - Influences of Helvetica included Schelter-Grotesk and Haas' Normal Grotesk. + Influences of Helvetica included Schelter-Grotesk and Haas’ Normal Grotesk. Attracting considerable attention on its release as Neue Haas Grotesk, Linotype adopted Neue Haas Grotesk for widespread release.

    Like many neo-grotesque designs, Helvetica has narrow apertures, which limit its legibility onscreen and at small print sizes. It also has no visible -difference between upper-case 'i' and lower-case 'L', although the number 1 is +difference between upper-case ‘i’ and lower-case ‘L’, although the number 1 is quite identifiable with its flag at top left.

    @@ -511,7 +511,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -522,7 +522,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/typography/font-family/index.html b/docs/typography/font-family/index.html index 7504722d9..48cbb2a7e 100644 --- a/docs/typography/font-family/index.html +++ b/docs/typography/font-family/index.html @@ -32,7 +32,7 @@
    Tachyons
    - v4.9.0 + v4.12.0
    @@ -87,7 +87,7 @@

    Font Family

    Relying on systems fonts greatly improves page performance and can also help - your web application/site blend in with the user's operating + your web application/site blend in with the user’s operating system. Readability is strongly linked to familiarity, so this helps create a more fluid reading experience, allowing your users to focus on your content. @@ -219,7 +219,7 @@

    Reference

    tachyons-font-family

    - v4.3.3 + v4.3.4 285 B
    @@ -239,7 +239,7 @@

    tachyons-font-family

    1
    - src/_font-families.css + src/_font-family.css
     
    @@ -477,7 +477,7 @@ 

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -488,7 +488,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/typography/font-family/roboto/index.html b/docs/typography/font-family/roboto/index.html index 173d1797c..071cf189e 100644 --- a/docs/typography/font-family/roboto/index.html +++ b/docs/typography/font-family/roboto/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -338,8 +338,8 @@

    Italic

    Roboto is a sans-serif typeface family developed by Google as the system font for its mobile operating system Android.

    - "We see Roboto as an evolving type family and plan to continue to change and update it as the system evolves. It used to be that a type family was designed once and then used without change for many years. Sometimes an updated version was released with a new name, sometimes by appending a “Neue” or “New”. The old model for releasing metal typefaces doesn’t make sense - for an operating system that is constantly improving. As the system evolves over time, the type should evolve along with it." - Google + “We see Roboto as an evolving type family and plan to continue to change and update it as the system evolves. It used to be that a type family was designed once and then used without change for many years. Sometimes an updated version was released with a new name, sometimes by appending a ‘Neue’ or ‘New’. The old model for releasing metal typefaces doesn’t make sense + for an operating system that is constantly improving. As the system evolves over time, the type should evolve along with it.” - Google

    Roboto supports 16 weights as well as advanced typographic features such as small caps, ligatures and lower case numerals. Roboto currently covers most scripts based on Latin, Cyrillic and Greek alphabets. @@ -347,7 +347,7 @@

    Italic

    Like many neo-grotesque designs, roboto has narrow apertures, which limit its legibility onscreen and at small print sizes. It also has no visible - difference between upper-case 'i' and lower-case 'L', although the number 1 is + difference between upper-case ‘i’ and lower-case ‘L’, although the number 1 is quite identifiable with its flag at top left.

    @@ -497,7 +497,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -508,7 +508,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/typography/font-family/san-francisco/index.html b/docs/typography/font-family/san-francisco/index.html index daee2ee62..b0139d2bd 100644 --- a/docs/typography/font-family/san-francisco/index.html +++ b/docs/typography/font-family/san-francisco/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -495,7 +495,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -506,7 +506,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/typography/font-family/system-sans-serif/index.html b/docs/typography/font-family/system-sans-serif/index.html index f847fa2e5..b73c2b930 100644 --- a/docs/typography/font-family/system-sans-serif/index.html +++ b/docs/typography/font-family/system-sans-serif/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -479,7 +479,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -490,7 +490,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/typography/font-family/system-serif/index.html b/docs/typography/font-family/system-serif/index.html index 0b6b87d37..3cec26acb 100644 --- a/docs/typography/font-family/system-serif/index.html +++ b/docs/typography/font-family/system-serif/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -479,7 +479,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -490,7 +490,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/typography/font-style/index.html b/docs/typography/font-style/index.html index b5cd23bbb..7f1bb23aa 100644 --- a/docs/typography/font-style/index.html +++ b/docs/typography/font-style/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -121,7 +121,7 @@

    Reference

    tachyons-font-style

    - v4.0.4 + v4.0.5 131 B
    @@ -308,7 +308,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -319,7 +319,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/typography/font-weight/index.html b/docs/typography/font-weight/index.html index 7cad605fa..171d10437 100644 --- a/docs/typography/font-weight/index.html +++ b/docs/typography/font-weight/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -158,7 +158,7 @@

    Reference

    tachyons-font-weight

    - v5.0.4 + v5.0.5 244 B
    @@ -396,7 +396,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -407,7 +407,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/typography/line-height/index.html b/docs/typography/line-height/index.html index 08712eea7..a51d383a6 100644 --- a/docs/typography/line-height/index.html +++ b/docs/typography/line-height/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -90,19 +90,19 @@

    Line Height

    - "Many people with cognitive disabilities have trouble tracking lines + “Many people with cognitive disabilities have trouble tracking lines of text when a block of text is single spaced. Providing spacing between 1.5 to 2 allows them to start a new line more easily once they have finished the - previous one." + previous one.”

    - - WCAG 2.0 Compliance Techniques + —WCAG 2.0 Compliance Techniques

    Line-height affects how easy it is to read a piece of text, so having a well constructed set of values can help make your text easier to read, increasing the chances that people will read it. Tachyons provides - classes to set text at three common line-height values. 1.5 for body copy, 1.25 for titles, - and 1 for text that doesn't wrap. + classes to set text at three common line-height values. 1.5 for body copy, 1.25 for titles, + and 1 for text that doesn’t wrap.

    @@ -154,7 +154,7 @@

    Reference

    tachyons-line-height

    - v3.0.6 + v3.0.7 151 B
    @@ -346,7 +346,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -357,7 +357,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/typography/measure/index.html b/docs/typography/measure/index.html index ec5ae37e0..f0a9e7c13 100644 --- a/docs/typography/measure/index.html +++ b/docs/typography/measure/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -93,12 +93,12 @@

    Measure

    of readability.

    - "Anything from 45 to 75 characters is widely regarded as a satisfactory length of line for a single-column page...the 66-character line (counting both letters and spaces) is widely regarded as ideal. For multiple-column work, a better average is 40-50 characters." - Robert Bringhurst - The Elements of Typographic Style + “Anything from 45 to 75 characters is widely regarded as a satisfactory length of line for a single-column page… the 66-character line (counting both letters and spaces) is widely regarded as ideal. For multiple-column work, a better average is 40-50 characters.” + —Robert Bringhurst, The Elements of Typographic Style

    Tachyons provides 3 classes for setting measure. -

    +

    .measure = line lengths ~66 characters .measure-narrow = line lengths ~45 characters .measure-wide = line lengths ~80 characters @@ -201,7 +201,7 @@

    1.25rem (20px) at 20em

    Scale is the size of design elements in comparison to other elements in a layout as well as to the physical context of the work. Scale is relative. 12-pt type displayed on a 32-inch monitor can look very small, while 12-pt type - printed on a book page can look flabby and overweight. + printed on a book page can look flabby and overweight.

    @@ -222,7 +222,7 @@

    1rem (16px) at 30em

    Scale is the size of design elements in comparison to other elements in a layout as well as to the physical context of the work. Scale is relative. 12-pt type displayed on a 32-inch monitor can look very small, while 12-pt type - printed on a book page clook flabby and overweight. + printed on a book page clook flabby and overweight.

    1rem (16px) at 20em

    @@ -241,7 +241,7 @@

    1rem (16px) at 20em

    Scale is the size of design elements in comparison to other elements in a layout as well as to the physical context of the work. Scale is relative. 12-pt type displayed on a 32-inch monitor can look very small, while 12-pt type - printed on a book page can look flabby and overweight. + printed on a book page can look flabby and overweight.

    @@ -315,7 +315,7 @@

    Reference

    tachyons-typography

    - v3.0.4 + v3.0.5 270 B
    @@ -595,7 +595,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -606,7 +606,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/typography/scale/index.html b/docs/typography/scale/index.html index 2c2857f1b..33ba675bd 100644 --- a/docs/typography/scale/index.html +++ b/docs/typography/scale/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -92,18 +92,18 @@

    Type Scale

    Often times, websites devote a non-trivial amount of css to setting font-size. They declare an unnecessary amount of different - font-sizes that upon inspection, don't come close to resembling a sane type scale. + font-sizes that upon inspection, don’t come close to resembling a sane type scale.

    - To create and design an easily readable interface, you don't need + To create and design an easily readable interface, you don’t need more than 40 font-sizes. A simple ratio-based scale with 8 options should suffice. Using the class extension namespaces you can set the font-size for any particular breakpoint that you desire.

    - Don't spend time constantly overriding font-sizes in your css. - If you don't like a default font-size for an element, use the utilities to quickly make the text larger or smaller until it looks just right. + Don’t spend time constantly overriding font-sizes in your css. + If you don’t like a default font-size for an element, use the utilities to quickly make the text larger or smaller until it looks just right.

    @@ -111,9 +111,9 @@

    Type Scale

    - "The simplest scale is a single note, and sticking with a single note draws more attention to other parameters, such as rhythm and inflection... In the sixteenth century, a series of common sizes developed among European typographers, and the series survived with little change and few additions for 400 years... This is the typographic equivalent of the diatonic scale." + “The simplest scale is a single note, and sticking with a single note draws more attention to other parameters, such as rhythm and inflection… In the sixteenth century, a series of common sizes developed among European typographers, and the series survived with little change and few additions for 400 years… This is the typographic equivalent of the diatonic scale.”

    -

    Robert Bringhurst - The Elements of Typographic Style

    +

    —Robert Bringhurst, The Elements of Typographic Style

    Font sizes

    @@ -213,16 +213,16 @@

    Reference

    tachyons-type-scale

    - v6.0.4 - 242 B + v6.1.1 + 252 B
    Declarations
    -
    32
    +
    36
    Selectors
    -
    40
    +
    44
    Max. Specificity Score
    @@ -469,7 +469,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -480,7 +480,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/typography/text-align/index.html b/docs/typography/text-align/index.html index 037a7635d..85486b27a 100644 --- a/docs/typography/text-align/index.html +++ b/docs/typography/text-align/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -126,16 +126,16 @@

    Reference

    tachyons-text-align

    - v3.0.4 - 145 B + v3.1.0 + 165 B
    Declarations
    -
    12
    +
    16
    Selectors
    -
    12
    +
    16
    Max. Specificity Score
    @@ -331,7 +331,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -342,7 +342,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/typography/text-decoration/index.html b/docs/typography/text-decoration/index.html index 3c1109d86..00298c26c 100644 --- a/docs/typography/text-decoration/index.html +++ b/docs/typography/text-decoration/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -122,7 +122,7 @@

    Reference

    tachyons-text-decoration

    - v4.0.4 + v4.0.6 162 B
    @@ -315,7 +315,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -326,7 +326,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/typography/text-transform/index.html b/docs/typography/text-transform/index.html index 4b3573e4e..aeb9822cb 100644 --- a/docs/typography/text-transform/index.html +++ b/docs/typography/text-transform/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -84,7 +84,7 @@

    Text Transform

    Use these classes to set the capitalization of text.

    - If you use the uppercase class, don't forget to combine it with a tracking utility from the letter-spacing module. + If you use the uppercase class, don’t forget to combine it with a tracking utility from the letter-spacing module.

    @@ -117,7 +117,7 @@

    Reference

    tachyons-text-transform

    - v4.0.4 + v4.0.6 173 B
    @@ -321,7 +321,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -332,7 +332,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/typography/tracking/index.html b/docs/typography/tracking/index.html index 0945fe82a..cb86a2c3e 100644 --- a/docs/typography/tracking/index.html +++ b/docs/typography/tracking/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -136,7 +136,7 @@

    Reference

    tachyons-letter-spacing

    - v3.0.4 + v3.0.5 159 B
    @@ -327,7 +327,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -338,7 +338,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/typography/vertical-align/index.html b/docs/typography/vertical-align/index.html index 46e9b5939..5c73f238f 100644 --- a/docs/typography/vertical-align/index.html +++ b/docs/typography/vertical-align/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -85,7 +85,7 @@

    Vertical Align

    works on inline-level elements (display inline and inline-block) and on table cells.

    - This documents how vertical align affects text elements. If you'd + This documents how vertical align affects text elements. If you’d like to see how to vertically align elements - checkout the layout documentation.

    @@ -132,18 +132,18 @@

    Align to the top

    - You can say, "I love you," in Helvetica. And you can say it with Helvetica + You can say, “I love you,” in Helvetica. And you can say it with Helvetica Extra Light if you want to be really fancy. Or you can say it with the Extra - Bold if it's really intensive and passionate, you know, and it might work. -

    + Bold if it’s really intensive and passionate, you know, and it might work. +

    - You can say, "I love you," in Helvetica. And you can say it with Helvetica - Extra Light... -

    + You can say, “I love you,” in Helvetica. And you can say it with Helvetica + Extra Light… +

    if you want to be really fancy. Or you can say it with the Extra - Bold if it's really intensive and passionate, you know, and it might work. -

    + Bold if it’s really intensive and passionate, you know, and it might work. +

    Mix and match

    @@ -153,18 +153,18 @@

    Mix and match

    - You can say, "I love you," in Helvetica. And you can say it with Helvetica + You can say, “I love you,” in Helvetica. And you can say it with Helvetica Extra Light if you want to be really fancy. Or you can say it with the Extra - Bold if it's really intensive and passionate, you know, and it might work. -

    + Bold if it’s really intensive and passionate, you know, and it might work. +

    - You can say, "I love you," in Helvetica. And you can say it with Helvetica - Extra Light... -

    + You can say, “I love you,” in Helvetica. And you can say it with Helvetica + Extra Light… +

    if you want to be really fancy. Or you can say it with the Extra - Bold if it's really intensive and passionate, you know, and it might work. -

    + Bold if it’s really intensive and passionate, you know, and it might work. +

    Align to the middle

    @@ -174,17 +174,17 @@

    Align to the middle

    - You can say, "I love you," in Helvetica. And you can say it with Helvetica + You can say, “I love you,” in Helvetica. And you can say it with Helvetica Extra Light if you want to be really fancy. Or you can say it with the Extra - Bold if it's really intensive and passionate, you know, and it might work. -

    + Bold if it’s really intensive and passionate, you know, and it might work. +

    - You can say, "I love you," in Helvetica. And you can say it with Helvetica - Extra Light... -

    + You can say, “I love you,” in Helvetica. And you can say it with Helvetica + Extra Light… +

    - if you want to be really fancy. -

    + if you want to be really fancy. +

    Align to the bottom

    @@ -194,19 +194,19 @@

    Align to the bottom

    - You can say, "I love you," in Helvetica. And you can say it with Helvetica + You can say, “I love you,” in Helvetica. And you can say it with Helvetica Extra Light if you want to be really fancy. Or you can say it with the Extra - Bold if it's really intensive and passionate, you know, and it might work. -

    + Bold if it’s really intensive and passionate, you know, and it might work. +

    - You can say, "I love you," in Helvetica. And you can say it with Helvetica - Extra Light... -

    + You can say, “I love you,” in Helvetica. And you can say it with Helvetica + Extra Light… +

    - if you want to be really fancy. -

    + if you want to be really fancy. +

    - + @@ -230,7 +230,7 @@

    Reference

    tachyons-vertical-align

    - v4.0.4 + v4.0.6 174 B
    @@ -424,7 +424,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -435,7 +435,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/docs/typography/white-space/index.html b/docs/typography/white-space/index.html index bb3864eff..374930753 100644 --- a/docs/typography/white-space/index.html +++ b/docs/typography/white-space/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.9.0 + v4.12.0
    @@ -156,7 +156,7 @@

    Reference

    tachyons-white-space

    - v4.0.5 + v4.0.7 153 B
    @@ -348,7 +348,7 @@

    Elements

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -359,7 +359,7 @@

    Elements

    that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/gallery/index.html b/gallery/index.html index 0ef489d3c..5c4d11d97 100644 --- a/gallery/index.html +++ b/gallery/index.html @@ -32,7 +32,7 @@ Tachyons
    - v4.8.1 + v4.12.0
    @@ -77,6 +77,7 @@
    @@ -227,7 +224,7 @@

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -238,7 +235,7 @@ that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/index.html b/index.html index 597674dff..8c71eca66 100644 --- a/index.html +++ b/index.html @@ -27,16 +27,27 @@
    -
    -
    - +
    + -
    + +
    +
    +
    +

    Customizing

    +

    + Tachyons has several methods and workflows for customization: +
    +
    + We offer an API you can post a config to get a custom css build with generated documentation. +
    +
    + + If you prefer Css Variables check out + + Tachyons-custom. + +
    +
    + Both Theme-ui and Styled-system implementations are easy to customize in theme.js + + We've built a GUI for generating and customizing Tachyons builds over at Components AI that will output css-in-js and css variable configs you can copy paste into your projects. +

    +
    +
    + +
    +
    +
    - src/_font-families.css + src/_font-family.css
     
    diff --git a/src/templates/docs/garamond/index.html b/src/templates/docs/garamond/index.html
    index 2df6c6aa1..29308e9b3 100644
    --- a/src/templates/docs/garamond/index.html
    +++ b/src/templates/docs/garamond/index.html
    @@ -282,7 +282,7 @@ 

    Italic

    - Some distinctive characteristics in Garamond's letters are the small eye of the 'e' and the bowl of the a, which has a sharp hook upwards at top left. The 'M' is slightly splayed. The x-height (height of lower-case letters) is low, especially at larger sizes, making the capitals large relative to the lower case, while the top serifs on the ascenders of letters like 'd' have a downward slope and rise subtly above the cap height. Garamond typefaces are popular and often used, particularly for printing body text and books. + Some distinctive characteristics in Garamond’s letters are the small eye of the ‘e’ and the bowl of the ‘a’, which has a sharp hook upwards at top left. The ‘M’ is slightly splayed. The x-height (height of lower-case letters) is low, especially at larger sizes, making the capitals large relative to the lower case, while the top serifs on the ascenders of letters like ‘d’ have a downward slope and rise subtly above the cap height. Garamond typefaces are popular and often used, particularly for printing body text and books.

    Garmond, antiqua was designed and cut in Paris in 1535 by the punch-cutter @@ -295,13 +295,13 @@

    Italic

    The normal or medium faces are often used in small sizes for marginalia and captions to pictures. The semi-bold, bold, and italic faces are used mostly as display - faces. + faces.

    Since around 1910, many modern revivals of Garamond and related typefaces have been developed. Among these, the roman (regular; upright) versions of Adobe Garamond, Granjon, Sabon, and Stempel - Garamond are directly based on Garamond's work. + Garamond are directly based on Garamond’s work.

    diff --git a/src/templates/docs/georgia/index.html b/src/templates/docs/georgia/index.html index 8ec9df967..daed40948 100644 --- a/src/templates/docs/georgia/index.html +++ b/src/templates/docs/georgia/index.html @@ -282,13 +282,13 @@

    Italic

    - Some distinctive characteristics in georgia's letters are the small eye of the 'e' and the bowl of the a, which has a sharp hook upwards at top left. The 'M' is slightly splayed. The x-height (height of lower-case letters) is low, especially at larger sizes, making the capitals large relative to the lower case, while the top serifs on the ascenders of letters like 'd' have a downward slope and rise subtly above the cap height. Georgia typefaces are popular and often used, particularly for printing body text and books. + Some distinctive characteristics in georgia’s letters are the small eye of the ‘e’ and the bowl of the a, which has a sharp hook upwards at top left. The ‘M’ is slightly splayed. The x-height (height of lower-case letters) is low, especially at larger sizes, making the capitals large relative to the lower case, while the top serifs on the ascenders of letters like ‘d’ have a downward slope and rise subtly above the cap height. Georgia typefaces are popular and often used, particularly for printing body text and books.

    -As a transitional serif design, Georgia shows a number of traditional features of 'rational' serif typefaces from around the early 19th century, such as alternating thick and thin strokes, ball terminals, a vertical axis and an italic taking inspiration from calligraphy. Its figure (numeral) designs are lower-case or text figures, designed to blend into continuous text; this was at the time a rare feature in computer fonts. +As a transitional serif design, Georgia shows a number of traditional features of ‘rational’ serif typefaces from around the early 19th century, such as alternating thick and thin strokes, ball terminals, a vertical axis and an italic taking inspiration from calligraphy. Its figure (numeral) designs are lower-case or text figures, designed to blend into continuous text; this was at the time a rare feature in computer fonts.

    - Georgia's bold is also unusually bold, almost black. Carter noted that, "Verdana and Georgia...were all about binary bitmaps: every pixel was on or off, black or white...The bold versions of Verdana and Georgia are bolder than most bolds, because on the screen, at the time we were doing this in the mid-1990s, if the stem wanted to be thicker than one pixel, it could only go to two pixels. That is a bigger jump in weight than is conventional in print series." + Georgia’s bold is also unusually bold, almost black. Carter noted that, “Verdana and Georgia… were all about binary bitmaps: every pixel was on or off, black or white… The bold versions of Verdana and Georgia are bolder than most bolds, because on the screen, at the time we were doing this in the mid-1990s, if the stem wanted to be thicker than one pixel, it could only go to two pixels. That is a bigger jump in weight than is conventional in print series.”

    The Georgia typeface is similar to Times New Roman, another revival of transitional serif designs, but with many subtle differences: Georgia is larger than Times at the same point size, and has a much larger x-height at the same actual size. diff --git a/src/templates/docs/helvetica/index.html b/src/templates/docs/helvetica/index.html index 77bda4ecc..e89429f94 100644 --- a/src/templates/docs/helvetica/index.html +++ b/src/templates/docs/helvetica/index.html @@ -46,7 +46,7 @@ - Georgia + Georgia @@ -283,12 +283,12 @@

    Italic

    - Some distinctive characteristics in helvetica's letters are the - small eye of the 'e' and the bowl of the a, which has a sharp - hook upwards at top left. The 'M' is slightly splayed. The + Some distinctive characteristics in Helvetica’s letters are the + small eye of the ‘e’ and the bowl of the a, which has a sharp + hook upwards at top left. The ‘M’ is slightly splayed. The x-height (height of lower-case letters) is low, especially at larger sizes, making the capitals large relative to the lower - case, while the top serifs on the ascenders of letters like 'd' + case, while the top serifs on the ascenders of letters like ‘d’ have a downward slope and rise subtly above the cap height. helvetica typefaces are popular and often used, particularly for printing body text and books. @@ -302,14 +302,14 @@

    Italic

    which give it a dense, compact appearance.

    - Influences of Helvetica included Schelter-Grotesk and Haas' Normal Grotesk. + Influences of Helvetica included Schelter-Grotesk and Haas’ Normal Grotesk. Attracting considerable attention on its release as Neue Haas Grotesk, Linotype adopted Neue Haas Grotesk for widespread release.

    Like many neo-grotesque designs, Helvetica has narrow apertures, which limit its legibility onscreen and at small print sizes. It also has no visible -difference between upper-case 'i' and lower-case 'L', although the number 1 is +difference between upper-case ‘i’ and lower-case ‘L’, although the number 1 is quite identifiable with its flag at top left.

    diff --git a/src/templates/docs/hovers/index.html b/src/templates/docs/hovers/index.html index 8b82fcbed..17c1ab369 100644 --- a/src/templates/docs/hovers/index.html +++ b/src/templates/docs/hovers/index.html @@ -60,10 +60,10 @@

    Reveal Children on Hover

    -<a href="#" style="background-image: url(http://mrmrs.github.io/images/0010.jpg); +<a href="#" style="background-image: url(http://mrmrs.github.io/images/0010.jpg); class="link mw5 dt hide-child br2 cover bg-center" "> <span class="white dtc v-mid w-100 h-100 child bg-black-40 pa5"> - Card title + Card title </span> </a> @@ -81,7 +81,7 @@

    Add pointer on hover

    Grow on Hover

    -

    Using the grow class on an element will cause it to scale to 1.05% of it's normal size on hover.

    +

    Using the grow class on an element will cause it to scale to 1.05% of its normal size on hover.

    Portfolio Project #11 diff --git a/src/templates/docs/images/index.html b/src/templates/docs/images/index.html index 9a3b20e36..f94b247f8 100644 --- a/src/templates/docs/images/index.html +++ b/src/templates/docs/images/index.html @@ -26,7 +26,7 @@

    Images

    Examples

    Image

    - This photo is more than 3000 pixels wide. The width is set to 100% to ensure it doesn't bleed off the viewport and always fills its container. In some situations, this will make the image stretch to be larger than its actual width. To avoid the image stretching past its width, set max-width instead. + This photo is more than 3000 pixels wide. The width is set to 100% to ensure it doesn’t bleed off the viewport and always fills its container. In some situations, this will make the image stretch to be larger than its actual width. To avoid the image stretching past its width, set max-width instead.

    <img src="http://tachyons.io/img/over-canvas.jpg" class="w-100" alt="night sky over land"> night sky over land diff --git a/src/templates/docs/line-height/index.html b/src/templates/docs/line-height/index.html index d60805100..4ffe45839 100644 --- a/src/templates/docs/line-height/index.html +++ b/src/templates/docs/line-height/index.html @@ -38,19 +38,19 @@

    Line Height

    - "Many people with cognitive disabilities have trouble tracking lines + “Many people with cognitive disabilities have trouble tracking lines of text when a block of text is single spaced. Providing spacing between 1.5 to 2 allows them to start a new line more easily once they have finished the - previous one." + previous one.”

    -
    - WCAG 2.0 Compliance Techniques + —WCAG 2.0 Compliance Techniques

    Line-height affects how easy it is to read a piece of text, so having a well constructed set of values can help make your text easier to read, increasing the chances that people will read it. Tachyons provides - classes to set text at three common line-height values. 1.5 for body copy, 1.25 for titles, - and 1 for text that doesn't wrap. + classes to set text at three common line-height values. 1.5 for body copy, 1.25 for titles, + and 1 for text that doesn’t wrap.

    diff --git a/src/templates/docs/links/index.html b/src/templates/docs/links/index.html index a5fd76559..46582d331 100644 --- a/src/templates/docs/links/index.html +++ b/src/templates/docs/links/index.html @@ -22,7 +22,7 @@

    Links

    - Tachyons doesn't style links by default, but provides the necessary classes to + Tachyons doesn’t style links by default, but provides the necessary classes to generate a wide variety of link styles.

    diff --git a/src/templates/docs/max-widths/index.html b/src/templates/docs/max-widths/index.html index 2df834e38..d3c31b6e5 100644 --- a/src/templates/docs/max-widths/index.html +++ b/src/templates/docs/max-widths/index.html @@ -24,7 +24,7 @@

    Max Widths

    Max - widths can be combined with widths to ensure that your content doesn't get too + widths can be combined with widths to ensure that your content doesn’t get too wide on larger monitors. Max-widths can also help keep embedded media within the canvas. As they are fluid across ranges of screen widths, max-widths are extremely useful when trying to keep a design diff --git a/src/templates/docs/measure/avenir-next/index.html b/src/templates/docs/measure/avenir-next/index.html index f21a305d0..3e1ff98ab 100644 --- a/src/templates/docs/measure/avenir-next/index.html +++ b/src/templates/docs/measure/avenir-next/index.html @@ -54,7 +54,7 @@

    Avenir Next

    - Measure is...
    + Measure is…
    Measure impacts the readability of text. An appropriate line length for single column text is 45-75 characters including spaces. 66 characters is regarded as the most ideal line length. @@ -86,7 +86,7 @@

    Avenir Nex

    - Climb leg sit by the fire. Scream at teh bath intrigued by the shower, yet spot something, big eyes, big eyes, crouch, shake butt, prepare to pounce yet swat at dog. Then cats take over the world loves cheeseburgers or cough furball hiss at vacuum cleaner. Lick butt burrow under covers cough furball sit in box sit by the fire. Need to chase tail. Leave dead animals as gifts. Climb leg claws in your leg. Scratch the furniture. Climb leg scratch leg; meow for can opener to feed me cat slap dog in face, shove bum in owner's face like camera. Claws in your leg. Hide from vacuum cleaner intently sniff hand + Climb leg sit by the fire. Scream at teh bath intrigued by the shower, yet spot something, big eyes, big eyes, crouch, shake butt, prepare to pounce yet swat at dog. Then cats take over the world loves cheeseburgers or cough furball hiss at vacuum cleaner. Lick butt burrow under covers cough furball sit in box sit by the fire. Need to chase tail. Leave dead animals as gifts. Climb leg claws in your leg. Scratch the furniture. Climb leg scratch leg; meow for can opener to feed me cat slap dog in face, shove bum in owner’s face like camera. Claws in your leg. Hide from vacuum cleaner intently sniff hand knock dish off table head butt cant eat out of my own dish chew foot, and stick butt in face.

    diff --git a/src/templates/docs/measure/garamond/index.html b/src/templates/docs/measure/garamond/index.html index d33733f44..d84086edd 100644 --- a/src/templates/docs/measure/garamond/index.html +++ b/src/templates/docs/measure/garamond/index.html @@ -37,7 +37,7 @@

    <%= name %>

    - Measure is...
    + Measure is…
    Measure impacts the readability of text. An appropriate line length for single column text is 45-75 characters including spaces. 66 characters is regarded as the most ideal line length. @@ -75,7 +75,7 @@

    Garamond set to

    - Climb leg sit by the fire. Scream at teh bath intrigued by the shower, yet spot something, big eyes, big eyes, crouch, shake butt, prepare to pounce yet swat at dog. Then cats take over the world loves cheeseburgers or cough furball hiss at vacuum cleaner. Lick butt burrow under covers cough furball sit in box sit by the fire. Need to chase tail. Leave dead animals as gifts. Climb leg claws in your leg. Scratch the furniture. Climb leg scratch leg; meow for can opener to feed me cat slap dog in face, shove bum in owner's face like camera. + Climb leg sit by the fire. Scream at teh bath intrigued by the shower, yet spot something, big eyes, big eyes, crouch, shake butt, prepare to pounce yet swat at dog. Then cats take over the world loves cheeseburgers or cough furball hiss at vacuum cleaner. Lick butt burrow under covers cough furball sit in box sit by the fire. Need to chase tail. Leave dead animals as gifts. Climb leg claws in your leg. Scratch the furniture. Climb leg scratch leg; meow for can opener to feed me cat slap dog in face, shove bum in owner’s face like camera. claws in your leg. Hide from vacuum cleaner intently sniff hand knock dish off table head butt cant eat out of my own dish chew foot, and stick butt in face.

    diff --git a/src/templates/docs/measure/georgia/index.html b/src/templates/docs/measure/georgia/index.html index 1a4cb47fb..fbc1664bc 100644 --- a/src/templates/docs/measure/georgia/index.html +++ b/src/templates/docs/measure/georgia/index.html @@ -53,7 +53,7 @@
    Garamond

    - Measure is...
    + Measure is…
    Measure impacts the readability of text. An appropriate line length for single column text is 45-75 characters including spaces. 66 characters is regarded as the most ideal line length. @@ -87,7 +87,7 @@

    Garamond

    - Climb leg sit by the fire. Scream at teh bath intrigued by the shower, yet spot something, big eyes, big eyes, crouch, shake butt, prepare to pounce yet swat at dog. Then cats take over the world loves cheeseburgers or cough furball hiss at vacuum cleaner. Lick butt burrow under covers cough furball sit in box sit by the fire. Need to chase tail. Leave dead animals as gifts. Climb leg claws in your leg. Scratch the furniture. Climb leg scratch leg; meow for can opener to feed me cat slap dog in face, shove bum in owner's face like camera. + Climb leg sit by the fire. Scream at teh bath intrigued by the shower, yet spot something, big eyes, big eyes, crouch, shake butt, prepare to pounce yet swat at dog. Then cats take over the world loves cheeseburgers or cough furball hiss at vacuum cleaner. Lick butt burrow under covers cough furball sit in box sit by the fire. Need to chase tail. Leave dead animals as gifts. Climb leg claws in your leg. Scratch the furniture. Climb leg scratch leg; meow for can opener to feed me cat slap dog in face, shove bum in owner’s face like camera. claws in your leg. Hide from vacuum cleaner intently sniff hand knock dish off table head butt cant eat out of my own dish chew foot, and stick butt in face.

    diff --git a/src/templates/docs/measure/index.html b/src/templates/docs/measure/index.html index 34fa60e14..6c6b817ad 100644 --- a/src/templates/docs/measure/index.html +++ b/src/templates/docs/measure/index.html @@ -41,12 +41,12 @@

    Measure

    of readability.

    - "Anything from 45 to 75 characters is widely regarded as a satisfactory length of line for a single-column page...the 66-character line (counting both letters and spaces) is widely regarded as ideal. For multiple-column work, a better average is 40-50 characters." - Robert Bringhurst - The Elements of Typographic Style + “Anything from 45 to 75 characters is widely regarded as a satisfactory length of line for a single-column page… the 66-character line (counting both letters and spaces) is widely regarded as ideal. For multiple-column work, a better average is 40-50 characters.” + —Robert Bringhurst, The Elements of Typographic Style

    Tachyons provides 3 classes for setting measure. -

    +

    .measure = line lengths ~66 characters .measure-narrow = line lengths ~45 characters .measure-wide = line lengths ~80 characters @@ -149,7 +149,7 @@

    1.25rem (20px) at 20em

    Scale is the size of design elements in comparison to other elements in a layout as well as to the physical context of the work. Scale is relative. 12-pt type displayed on a 32-inch monitor can look very small, while 12-pt type - printed on a book page can look flabby and overweight. + printed on a book page can look flabby and overweight.

    @@ -170,7 +170,7 @@

    1rem (16px) at 30em

    Scale is the size of design elements in comparison to other elements in a layout as well as to the physical context of the work. Scale is relative. 12-pt type displayed on a 32-inch monitor can look very small, while 12-pt type - printed on a book page clook flabby and overweight. + printed on a book page clook flabby and overweight.

    1rem (16px) at 20em

    @@ -189,7 +189,7 @@

    1rem (16px) at 20em

    Scale is the size of design elements in comparison to other elements in a layout as well as to the physical context of the work. Scale is relative. 12-pt type displayed on a 32-inch monitor can look very small, while 12-pt type - printed on a book page can look flabby and overweight. + printed on a book page can look flabby and overweight.

    diff --git a/src/templates/docs/measure/times/index.html b/src/templates/docs/measure/times/index.html index 52dca6aca..c691ef91a 100644 --- a/src/templates/docs/measure/times/index.html +++ b/src/templates/docs/measure/times/index.html @@ -53,7 +53,7 @@
    Times

    - Measure is...
    + Measure is…
    Measure impacts the readability of text. An appropriate line length for single column text is 45-75 characters including spaces. 66 characters is regarded as the most ideal line length. @@ -87,7 +87,7 @@

    Times set

    - Climb leg sit by the fire. Scream at teh bath intrigued by the shower, yet spot something, big eyes, big eyes, crouch, shake butt, prepare to pounce yet swat at dog. Then cats take over the world loves cheeseburgers or cough furball hiss at vacuum cleaner. Lick butt burrow under covers cough furball sit in box sit by the fire. Need to chase tail. Leave dead animals as gifts. Climb leg claws in your leg. Scratch the furniture. Climb leg scratch leg; meow for can opener to feed me cat slap dog in face, shove bum in owner's face like camera. + Climb leg sit by the fire. Scream at teh bath intrigued by the shower, yet spot something, big eyes, big eyes, crouch, shake butt, prepare to pounce yet swat at dog. Then cats take over the world loves cheeseburgers or cough furball hiss at vacuum cleaner. Lick butt burrow under covers cough furball sit in box sit by the fire. Need to chase tail. Leave dead animals as gifts. Climb leg claws in your leg. Scratch the furniture. Climb leg scratch leg; meow for can opener to feed me cat slap dog in face, shove bum in owner’s face like camera. claws in your leg. Hide from vacuum cleaner intently sniff hand knock dish off table head butt cant eat out of my own dish chew foot, and stick butt in face.

    diff --git a/src/templates/docs/position/index.html b/src/templates/docs/position/index.html index 45524813a..12a4dc2e7 100644 --- a/src/templates/docs/position/index.html +++ b/src/templates/docs/position/index.html @@ -35,7 +35,7 @@

    Position

    If you do find it useful you could easily extend the position module to include this option. It should be noted that sticky is not well supported at the moment. If the provided - coordinates don't suit your needs the module is easy to extend to add any + coordinates don’t suit your needs the module is easy to extend to add any values you might need.

    @@ -47,7 +47,7 @@

    Position Static

    Position Relative

    -

    This is relatively positioned content that doesn't affect the position of other elements which is why the text overlaps with the content that is set to position static.

    +

    This is relatively positioned content that doesn’t affect the position of other elements which is why the text overlaps with the content that is set to position static.

    @@ -68,7 +68,7 @@

    Position Relative + Absolute

    - This is an absolutely positioned element set to have offsets of top and left to 1rem with right and bottom offset by 2rem. It's parent with the light gray background is set to position relative. + This is an absolutely positioned element set to have offsets of top and left to 1rem with right and bottom offset by 2rem. It’s parent with the light gray background is set to position relative.

    diff --git a/src/templates/docs/roboto/index.html b/src/templates/docs/roboto/index.html index 083522627..a94dd9f0e 100644 --- a/src/templates/docs/roboto/index.html +++ b/src/templates/docs/roboto/index.html @@ -286,8 +286,8 @@

    Italic

    Roboto is a sans-serif typeface family developed by Google as the system font for its mobile operating system Android.

    - "We see Roboto as an evolving type family and plan to continue to change and update it as the system evolves. It used to be that a type family was designed once and then used without change for many years. Sometimes an updated version was released with a new name, sometimes by appending a “Neue” or “New”. The old model for releasing metal typefaces doesn’t make sense - for an operating system that is constantly improving. As the system evolves over time, the type should evolve along with it." - Google + “We see Roboto as an evolving type family and plan to continue to change and update it as the system evolves. It used to be that a type family was designed once and then used without change for many years. Sometimes an updated version was released with a new name, sometimes by appending a ‘Neue’ or ‘New’. The old model for releasing metal typefaces doesn’t make sense + for an operating system that is constantly improving. As the system evolves over time, the type should evolve along with it.” - Google

    Roboto supports 16 weights as well as advanced typographic features such as small caps, ligatures and lower case numerals. Roboto currently covers most scripts based on Latin, Cyrillic and Greek alphabets. @@ -295,7 +295,7 @@

    Italic

    Like many neo-grotesque designs, roboto has narrow apertures, which limit its legibility onscreen and at small print sizes. It also has no visible - difference between upper-case 'i' and lower-case 'L', although the number 1 is + difference between upper-case ‘i’ and lower-case ‘L’, although the number 1 is quite identifiable with its flag at top left.

    diff --git a/src/templates/docs/spacing/index.html b/src/templates/docs/spacing/index.html index 865d3b309..071b1b8e6 100644 --- a/src/templates/docs/spacing/index.html +++ b/src/templates/docs/spacing/index.html @@ -22,16 +22,16 @@

    Spacing

    Good design is based on math. Certain patterns and ratios are so -prevelant in nature and music that they can't be denied as elegant design +prevelant in nature and music that they can’t be denied as elegant design solutions. Even in the 18th century, pages in books were designed with ratios. In the 21st century, we have gotten away from this on the web, often using -magic numbers to match a 'spec' that has been produced in a graphics program +magic numbers to match a ‘spec’ that has been produced in a graphics program such as photoshop, illustrator, or sketch. While these programs are useful for -sketching ideas, they aren't 100% accurate in their reflection of how the web +sketching ideas, they aren’t 100% accurate in their reflection of how the web works across device sizes or how things get drawn to the screen.

    -Tachyons features a spacing scale based on powers of two that starts at .25rem (for most devices this will be the equivalent of 4px). Since tachyons uses rem units with px as a fallback, if a user has declared a different base font-size for their device, your spacing will scale based on a defined ratio that has stood the test of time. As powers of two will always produce integers, there will be no problems with sub pixel rendering across browsers. Computers aren't that great at math and so decimals lead to inconsistencies across platforms. Inconsistencies should be avoided where possible. You'll find that when using a well thought out scale - things just line up. It works, with little effort, regardless of your design knowledge or sensibilities. +Tachyons features a spacing scale based on powers of two that starts at .25rem (for most devices this will be the equivalent of 4px). Since tachyons uses rem units with px as a fallback, if a user has declared a different base font-size for their device, your spacing will scale based on a defined ratio that has stood the test of time. As powers of two will always produce integers, there will be no problems with sub pixel rendering across browsers. Computers aren’t that great at math and so decimals lead to inconsistencies across platforms. Inconsistencies should be avoided where possible. You’ll find that when using a well thought out scale - things just line up. It works, with little effort, regardless of your design knowledge or sensibilities.

    diff --git a/src/templates/docs/text-transform/index.html b/src/templates/docs/text-transform/index.html index 735e48517..958618158 100644 --- a/src/templates/docs/text-transform/index.html +++ b/src/templates/docs/text-transform/index.html @@ -32,7 +32,7 @@

    Text Transform

    Use these classes to set the capitalization of text.

    - If you use the uppercase class, don't forget to combine it with a tracking utility from the letter-spacing module. + If you use the uppercase class, don’t forget to combine it with a tracking utility from the letter-spacing module.

    diff --git a/src/templates/docs/type-scale/index.html b/src/templates/docs/type-scale/index.html index c556adadc..0b5f0e52d 100644 --- a/src/templates/docs/type-scale/index.html +++ b/src/templates/docs/type-scale/index.html @@ -40,18 +40,18 @@

    Type Scale

    Often times, websites devote a non-trivial amount of css to setting font-size. They declare an unnecessary amount of different - font-sizes that upon inspection, don't come close to resembling a sane type scale. + font-sizes that upon inspection, don’t come close to resembling a sane type scale.

    - To create and design an easily readable interface, you don't need + To create and design an easily readable interface, you don’t need more than 40 font-sizes. A simple ratio-based scale with 8 options should suffice. Using the class extension namespaces you can set the font-size for any particular breakpoint that you desire.

    - Don't spend time constantly overriding font-sizes in your css. - If you don't like a default font-size for an element, use the utilities to quickly make the text larger or smaller until it looks just right. + Don’t spend time constantly overriding font-sizes in your css. + If you don’t like a default font-size for an element, use the utilities to quickly make the text larger or smaller until it looks just right.

    @@ -59,9 +59,9 @@

    Type Scale

    - "The simplest scale is a single note, and sticking with a single note draws more attention to other parameters, such as rhythm and inflection... In the sixteenth century, a series of common sizes developed among European typographers, and the series survived with little change and few additions for 400 years... This is the typographic equivalent of the diatonic scale." + “The simplest scale is a single note, and sticking with a single note draws more attention to other parameters, such as rhythm and inflection… In the sixteenth century, a series of common sizes developed among European typographers, and the series survived with little change and few additions for 400 years… This is the typographic equivalent of the diatonic scale.”

    -

    Robert Bringhurst - The Elements of Typographic Style

    +

    —Robert Bringhurst, The Elements of Typographic Style

    Font sizes

    diff --git a/src/templates/docs/typography/index.html b/src/templates/docs/typography/index.html index 467b9f206..45ff3e095 100644 --- a/src/templates/docs/typography/index.html +++ b/src/templates/docs/typography/index.html @@ -77,7 +77,7 @@

    Examples

    .f4 1.25rem

    We promptly judged antique ivory buckles for the next prize. Heavy - boxes perform quick waltzes and jigs. Blowzy night-frumps vex'd Jack Q + boxes perform quick waltzes and jigs. Blowzy night-frumps vex’d Jack Q

    .f5 1rem

    diff --git a/src/templates/docs/vertical-align/index.html b/src/templates/docs/vertical-align/index.html index 651b7c087..d588e85ba 100644 --- a/src/templates/docs/vertical-align/index.html +++ b/src/templates/docs/vertical-align/index.html @@ -33,7 +33,7 @@

    Vertical Align

    works on inline-level elements (display inline and inline-block) and on table cells.

    - This documents how vertical align affects text elements. If you'd + This documents how vertical align affects text elements. If you’d like to see how to vertically align elements - checkout the layout documentation.

    @@ -80,18 +80,18 @@

    Align to the top

    - You can say, "I love you," in Helvetica. And you can say it with Helvetica + You can say, “I love you,” in Helvetica. And you can say it with Helvetica Extra Light if you want to be really fancy. Or you can say it with the Extra - Bold if it's really intensive and passionate, you know, and it might work. -

    + Bold if it’s really intensive and passionate, you know, and it might work. +

    - You can say, "I love you," in Helvetica. And you can say it with Helvetica - Extra Light... -

    + You can say, “I love you,” in Helvetica. And you can say it with Helvetica + Extra Light… +

    if you want to be really fancy. Or you can say it with the Extra - Bold if it's really intensive and passionate, you know, and it might work. -

    + Bold if it’s really intensive and passionate, you know, and it might work. +

    Mix and match

    @@ -101,18 +101,18 @@

    Mix and match

    - You can say, "I love you," in Helvetica. And you can say it with Helvetica + You can say, “I love you,” in Helvetica. And you can say it with Helvetica Extra Light if you want to be really fancy. Or you can say it with the Extra - Bold if it's really intensive and passionate, you know, and it might work. -

    + Bold if it’s really intensive and passionate, you know, and it might work. +

    - You can say, "I love you," in Helvetica. And you can say it with Helvetica - Extra Light... -

    + You can say, “I love you,” in Helvetica. And you can say it with Helvetica + Extra Light… +

    if you want to be really fancy. Or you can say it with the Extra - Bold if it's really intensive and passionate, you know, and it might work. -

    + Bold if it’s really intensive and passionate, you know, and it might work. +

    Align to the middle

    @@ -122,17 +122,17 @@

    Align to the middle

    - You can say, "I love you," in Helvetica. And you can say it with Helvetica + You can say, “I love you,” in Helvetica. And you can say it with Helvetica Extra Light if you want to be really fancy. Or you can say it with the Extra - Bold if it's really intensive and passionate, you know, and it might work. -

    + Bold if it’s really intensive and passionate, you know, and it might work. +

    - You can say, "I love you," in Helvetica. And you can say it with Helvetica - Extra Light... -

    + You can say, “I love you,” in Helvetica. And you can say it with Helvetica + Extra Light… +

    - if you want to be really fancy. -

    + if you want to be really fancy. +

    Align to the bottom

    @@ -142,19 +142,19 @@

    Align to the bottom

    - You can say, "I love you," in Helvetica. And you can say it with Helvetica + You can say, “I love you,” in Helvetica. And you can say it with Helvetica Extra Light if you want to be really fancy. Or you can say it with the Extra - Bold if it's really intensive and passionate, you know, and it might work. -

    + Bold if it’s really intensive and passionate, you know, and it might work. +

    - You can say, "I love you," in Helvetica. And you can say it with Helvetica - Extra Light... -

    + You can say, “I love you,” in Helvetica. And you can say it with Helvetica + Extra Light… +

    - if you want to be really fancy. -

    + if you want to be really fancy. +

    - + diff --git a/src/templates/docs/widths/index.html b/src/templates/docs/widths/index.html index bd3ba65f5..ac1e3a9d2 100644 --- a/src/templates/docs/widths/index.html +++ b/src/templates/docs/widths/index.html @@ -52,7 +52,7 @@

    Widths

    -100 = literal value 100% -third = calc(100% / 3) - -two-thirds = calc(100% / 3) + -two-thirds = calc(100% / 1.5) -auto = string value auto diff --git a/src/templates/footer-template.html b/src/templates/footer-template.html index b364accc9..e17a5fead 100644 --- a/src/templates/footer-template.html +++ b/src/templates/footer-template.html @@ -34,7 +34,7 @@

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -45,7 +45,7 @@ that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/src/templates/footer.html b/src/templates/footer.html index a728f795a..244b52428 100644 --- a/src/templates/footer.html +++ b/src/templates/footer.html @@ -57,7 +57,7 @@

    Have a question? Need help? Feel free to open an issue on GitHub or ask a - question in our slack channel. We're here to try and help make designing in + question in our slack channel. We’re here to try and help make designing in the browser fun.

    @@ -68,7 +68,7 @@ that always moves faster than light. The word comes from the Greek:

    - ταχύς or tachys, meaning "swift, quick, fast, rapid" + ταχύς or tachys, meaning “swift, quick, fast, rapid”
    diff --git a/src/templates/gallery.html b/src/templates/gallery.html index d6fdd268a..613172c55 100644 --- a/src/templates/gallery.html +++ b/src/templates/gallery.html @@ -105,14 +105,10 @@ urlbox.io - + tylernford.com - - - uptimeumbrella.com -
    diff --git a/src/templates/header.html b/src/templates/header.html index ca7c0342e..70b99418d 100644 --- a/src/templates/header.html +++ b/src/templates/header.html @@ -1,14 +1,25 @@
    -
    -
    - +
    + -
    + +
    +
    +
    +

    Customizing

    +

    + Tachyons has several methods and workflows for customization: +
    +
    + We offer an API you can post a config to get a custom css build with generated documentation. +
    +
    + + If you prefer Css Variables check out + + Tachyons-custom. + +
    +
    + Both Theme-ui and Styled-system implementations are easy to customize in theme.js + + We've built a GUI for generating and customizing Tachyons builds over at Components AI that will output css-in-js and css variable configs you can copy paste into your projects. +

    +
    +
    + +
    +
    +