UNPKG

124 kBCSSView Raw
1/*! TACHYONS v4.9.0 | http://tachyons.io */
2/*
3 *
4 * ________ ______
5 * ___ __/_____ _________ /______ ______________________
6 * __ / _ __ `/ ___/_ __ \_ / / / __ \_ __ \_ ___/
7 * _ / / /_/ // /__ _ / / / /_/ // /_/ / / / /(__ )
8 * /_/ \__,_/ \___/ /_/ /_/_\__, / \____//_/ /_//____/
9 * /____/
10 *
11 * TABLE OF CONTENTS
12 *
13 * 1. External Library Includes
14 * - Normalize.css | http://normalize.css.github.io
15 * 2. Tachyons Modules
16 * 3. Variables
17 * - Media Queries
18 * - Colors
19 * 4. Debugging
20 * - Debug all
21 * - Debug children
22 *
23 */
24/* External Library Includes */
25/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */
26/* Document
27 ========================================================================== */
28/**
29 * 1. Correct the line height in all browsers.
30 * 2. Prevent adjustments of font size after orientation changes in
31 * IE on Windows Phone and in iOS.
32 */
33html { line-height: 1.15; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ }
34/* Sections
35 ========================================================================== */
36/**
37 * Remove the margin in all browsers (opinionated).
38 */
39body { margin: 0; }
40/**
41 * Add the correct display in IE 9-.
42 */
43article, aside, footer, header, nav, section { display: block; }
44/**
45 * Correct the font size and margin on `h1` elements within `section` and
46 * `article` contexts in Chrome, Firefox, and Safari.
47 */
48h1 { font-size: 2em; margin: .67em 0; }
49/* Grouping content
50 ========================================================================== */
51/**
52 * Add the correct display in IE 9-.
53 * 1. Add the correct display in IE.
54 */
55figcaption, figure, main {/* 1 */ display: block; }
56/**
57 * Add the correct margin in IE 8.
58 */
59figure { margin: 1em 40px; }
60/**
61 * 1. Add the correct box sizing in Firefox.
62 * 2. Show the overflow in Edge and IE.
63 */
64hr { box-sizing: content-box; /* 1 */ height: 0; /* 1 */ overflow: visible; /* 2 */ }
65/**
66 * 1. Correct the inheritance and scaling of font size in all browsers.
67 * 2. Correct the odd `em` font sizing in all browsers.
68 */
69pre { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ }
70/* Text-level semantics
71 ========================================================================== */
72/**
73 * 1. Remove the gray background on active links in IE 10.
74 * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
75 */
76a { background-color: transparent; /* 1 */ -webkit-text-decoration-skip: objects; /* 2 */ }
77/**
78 * 1. Remove the bottom border in Chrome 57- and Firefox 39-.
79 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
80 */
81abbr[title] { border-bottom: none; /* 1 */ text-decoration: underline; /* 2 */ -webkit-text-decoration: underline dotted; text-decoration: underline dotted; /* 2 */ }
82/**
83 * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
84 */
85b, strong { font-weight: inherit; }
86/**
87 * Add the correct font weight in Chrome, Edge, and Safari.
88 */
89b, strong { font-weight: bolder; }
90/**
91 * 1. Correct the inheritance and scaling of font size in all browsers.
92 * 2. Correct the odd `em` font sizing in all browsers.
93 */
94code, kbd, samp { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ }
95/**
96 * Add the correct font style in Android 4.3-.
97 */
98dfn { font-style: italic; }
99/**
100 * Add the correct background and color in IE 9-.
101 */
102mark { background-color: #ff0; color: #000; }
103/**
104 * Add the correct font size in all browsers.
105 */
106small { font-size: 80%; }
107/**
108 * Prevent `sub` and `sup` elements from affecting the line height in
109 * all browsers.
110 */
111sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
112sub { bottom: -0.25em; }
113sup { top: -0.5em; }
114/* Embedded content
115 ========================================================================== */
116/**
117 * Add the correct display in IE 9-.
118 */
119audio, video { display: inline-block; }
120/**
121 * Add the correct display in iOS 4-7.
122 */
123audio:not([controls]) { display: none; height: 0; }
124/**
125 * Remove the border on images inside links in IE 10-.
126 */
127img { border-style: none; }
128/**
129 * Hide the overflow in IE.
130 */
131svg:not(:root) { overflow: hidden; }
132/* Forms
133 ========================================================================== */
134/**
135 * 1. Change the font styles in all browsers (opinionated).
136 * 2. Remove the margin in Firefox and Safari.
137 */
138button, input, optgroup, select, textarea { font-family: sans-serif; /* 1 */ font-size: 100%; /* 1 */ line-height: 1.15; /* 1 */ margin: 0; /* 2 */ }
139/**
140 * Show the overflow in IE.
141 * 1. Show the overflow in Edge.
142 */
143button, input {/* 1 */ overflow: visible; }
144/**
145 * Remove the inheritance of text transform in Edge, Firefox, and IE.
146 * 1. Remove the inheritance of text transform in Firefox.
147 */
148button, select {/* 1 */ text-transform: none; }
149/**
150 * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
151 * controls in Android 4.
152 * 2. Correct the inability to style clickable types in iOS and Safari.
153 */
154button, html [type="button"], /* 1 */
155[type="reset"], [type="submit"] { -webkit-appearance: button; /* 2 */ }
156/**
157 * Remove the inner border and padding in Firefox.
158 */
159button::-moz-focus-inner, [type="button"]::-moz-focus-inner,
160[type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; }
161/**
162 * Restore the focus styles unset by the previous rule.
163 */
164button:-moz-focusring, [type="button"]:-moz-focusring,
165[type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; }
166/**
167 * Correct the padding in Firefox.
168 */
169fieldset { padding: .35em .75em .625em; }
170/**
171 * 1. Correct the text wrapping in Edge and IE.
172 * 2. Correct the color inheritance from `fieldset` elements in IE.
173 * 3. Remove the padding so developers are not caught out when they zero out
174 * `fieldset` elements in all browsers.
175 */
176legend { box-sizing: border-box; /* 1 */ color: inherit; /* 2 */ display: table; /* 1 */ max-width: 100%; /* 1 */ padding: 0; /* 3 */ white-space: normal; /* 1 */ }
177/**
178 * 1. Add the correct display in IE 9-.
179 * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
180 */
181progress { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ }
182/**
183 * Remove the default vertical scrollbar in IE.
184 */
185textarea { overflow: auto; }
186/**
187 * 1. Add the correct box sizing in IE 10-.
188 * 2. Remove the padding in IE 10-.
189 */
190[type="checkbox"], [type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ }
191/**
192 * Correct the cursor style of increment and decrement buttons in Chrome.
193 */
194[type="number"]::-webkit-inner-spin-button,
195[type="number"]::-webkit-outer-spin-button { height: auto; }
196/**
197 * 1. Correct the odd appearance in Chrome and Safari.
198 * 2. Correct the outline style in Safari.
199 */
200[type="search"] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ }
201/**
202 * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
203 */
204[type="search"]::-webkit-search-cancel-button,
205[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
206/**
207 * 1. Correct the inability to style clickable types in iOS and Safari.
208 * 2. Change font properties to `inherit` in Safari.
209 */
210::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ }
211/* Interactive
212 ========================================================================== */
213/*
214 * Add the correct display in IE 9-.
215 * 1. Add the correct display in Edge, IE, and Firefox.
216 */
217details, /* 1 */
218menu { display: block; }
219/*
220 * Add the correct display in all browsers.
221 */
222summary { display: list-item; }
223/* Scripting
224 ========================================================================== */
225/**
226 * Add the correct display in IE 9-.
227 */
228canvas { display: inline-block; }
229/**
230 * Add the correct display in IE.
231 */
232template { display: none; }
233/* Hidden
234 ========================================================================== */
235/**
236 * Add the correct display in IE 10-.
237 */
238[hidden] { display: none; }
239/* Modules */
240/*
241
242 BOX SIZING
243
244*/
245html, body, div, article, section, main, footer, header, form, fieldset, legend,
246pre, code, a, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, textarea, table,
247td, th, tr, input[type="email"], input[type="number"], input[type="password"],
248input[type="tel"], input[type="text"], input[type="url"], .border-box { box-sizing: border-box; }
249/*
250
251 ASPECT RATIOS
252
253*/
254/* This is for fluid media that is embedded from third party sites like youtube, vimeo etc.
255 * Wrap the outer element in aspect-ratio and then extend it with the desired ratio i.e
256 * Make sure there are no height and width attributes on the embedded media.
257 * Adapted from: https://github.com/suitcss/components-flex-embed
258 *
259 * Example:
260 *
261 * <div class="aspect-ratio aspect-ratio--16x9">
262 * <iframe class="aspect-ratio--object"></iframe>
263 * </div>
264 *
265 * */
266.aspect-ratio { height: 0; position: relative; }
267.aspect-ratio--16x9 { padding-bottom: 56.25%; }
268.aspect-ratio--9x16 { padding-bottom: 177.77%; }
269.aspect-ratio--4x3 { padding-bottom: 75%; }
270.aspect-ratio--3x4 { padding-bottom: 133.33%; }
271.aspect-ratio--6x4 { padding-bottom: 66.6%; }
272.aspect-ratio--4x6 { padding-bottom: 150%; }
273.aspect-ratio--8x5 { padding-bottom: 62.5%; }
274.aspect-ratio--5x8 { padding-bottom: 160%; }
275.aspect-ratio--7x5 { padding-bottom: 71.42%; }
276.aspect-ratio--5x7 { padding-bottom: 140%; }
277.aspect-ratio--1x1 { padding-bottom: 100%; }
278.aspect-ratio--object { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 100; }
279/*
280
281 IMAGES
282 Docs: http://tachyons.io/docs/elements/images/
283
284*/
285/* Responsive images! */
286img { max-width: 100%; }
287/*
288
289 BACKGROUND SIZE
290 Docs: http://tachyons.io/docs/themes/background-size/
291
292 Media Query Extensions:
293 -ns = not-small
294 -m = medium
295 -l = large
296
297*/
298/*
299 Often used in combination with background image set as an inline style
300 on an html element.
301*/
302.cover { background-size: cover !important; }
303.contain { background-size: contain !important; }
304/*
305
306 BACKGROUND POSITION
307
308 Base:
309 bg = background
310
311 Modifiers:
312 -center = center center
313 -top = top center
314 -right = center right
315 -bottom = bottom center
316 -left = center left
317
318 Media Query Extensions:
319 -ns = not-small
320 -m = medium
321 -l = large
322
323 */
324.bg-center { background-repeat: no-repeat; background-position: center center; }
325.bg-top { background-repeat: no-repeat; background-position: top center; }
326.bg-right { background-repeat: no-repeat; background-position: center right; }
327.bg-bottom { background-repeat: no-repeat; background-position: bottom center; }
328.bg-left { background-repeat: no-repeat; background-position: center left; }
329/*
330
331 OUTLINES
332
333 Media Query Extensions:
334 -ns = not-small
335 -m = medium
336 -l = large
337
338*/
339.outline { outline: 1px solid; }
340.outline-transparent { outline: 1px solid transparent; }
341.outline-0 { outline: 0; }
342/*
343
344 BORDERS
345 Docs: http://tachyons.io/docs/themes/borders/
346
347 Base:
348 b = border
349
350 Modifiers:
351 a = all
352 t = top
353 r = right
354 b = bottom
355 l = left
356 n = none
357
358 Media Query Extensions:
359 -ns = not-small
360 -m = medium
361 -l = large
362
363*/
364.ba { border-style: solid; border-width: 1px; }
365.bt { border-top-style: solid; border-top-width: 1px; }
366.br { border-right-style: solid; border-right-width: 1px; }
367.bb { border-bottom-style: solid; border-bottom-width: 1px; }
368.bl { border-left-style: solid; border-left-width: 1px; }
369.bn { border-style: none; border-width: 0; }
370/*
371
372 BORDER COLORS
373 Docs: http://tachyons.io/docs/themes/borders/
374
375 Border colors can be used to extend the base
376 border classes ba,bt,bb,br,bl found in the _borders.css file.
377
378 The base border class by default will set the color of the border
379 to that of the current text color. These classes are for the cases
380 where you desire for the text and border colors to be different.
381
382 Base:
383 b = border
384
385 Modifiers:
386 --color-name = each color variable name is also a border color name
387
388*/
389.b--black { border-color: #000; }
390.b--near-black { border-color: #111; }
391.b--dark-gray { border-color: #333; }
392.b--mid-gray { border-color: #5b7385; }
393.b--gray { border-color: #a1afba; }
394.b--silver { border-color: #999; }
395.b--light-silver { border-color: #aaa; }
396.b--moon-gray { border-color: #ccc; }
397.b--light-gray { border-color: #d0d7dc; }
398.b--near-white { border-color: #dbe1e5; }
399.b--white { border-color: #fff; }
400.b--white-90 { border-color: rgba( 255, 255, 255, .9 ); }
401.b--white-80 { border-color: rgba( 255, 255, 255, .8 ); }
402.b--white-70 { border-color: rgba( 255, 255, 255, .7 ); }
403.b--white-60 { border-color: rgba( 255, 255, 255, .6 ); }
404.b--white-50 { border-color: rgba( 255, 255, 255, .5 ); }
405.b--white-40 { border-color: rgba( 255, 255, 255, .4 ); }
406.b--white-30 { border-color: rgba( 255, 255, 255, .3 ); }
407.b--white-20 { border-color: rgba( 255, 255, 255, .2 ); }
408.b--white-10 { border-color: rgba( 255, 255, 255, .1 ); }
409.b--white-05 { border-color: rgba( 255, 255, 255, .05 ); }
410.b--white-025 { border-color: rgba( 255, 255, 255, .025 ); }
411.b--white-0125 { border-color: rgba( 255, 255, 255, .0125 ); }
412.b--black-90 { border-color: rgba( 0, 0, 0, .9 ); }
413.b--black-80 { border-color: rgba( 0, 0, 0, .8 ); }
414.b--black-70 { border-color: rgba( 0, 0, 0, .7 ); }
415.b--black-60 { border-color: rgba( 0, 0, 0, .6 ); }
416.b--black-50 { border-color: rgba( 0, 0, 0, .5 ); }
417.b--black-40 { border-color: rgba( 0, 0, 0, .4 ); }
418.b--black-30 { border-color: rgba( 0, 0, 0, .3 ); }
419.b--black-20 { border-color: rgba( 0, 0, 0, .2 ); }
420.b--black-10 { border-color: rgba( 0, 0, 0, .1 ); }
421.b--black-05 { border-color: rgba( 0, 0, 0, .05 ); }
422.b--black-025 { border-color: rgba( 0, 0, 0, .025 ); }
423.b--black-0125 { border-color: rgba( 0, 0, 0, .0125 ); }
424.b--dark-red { border-color: #e7040f; }
425.b--red { border-color: #f00; }
426.b--light-red { border-color: #ff725c; }
427.b--orange { border-color: #ff6300; }
428.b--gold { border-color: #ffb700; }
429.b--yellow { border-color: #ffd700; }
430.b--light-yellow { border-color: #fbf1a9; }
431.b--purple { border-color: #5e2ca5; }
432.b--light-purple { border-color: #a463f2; }
433.b--dark-pink { border-color: #d5008f; }
434.b--hot-pink { border-color: #ff41b4; }
435.b--pink { border-color: #ff80cc; }
436.b--light-pink { border-color: #ffa3d7; }
437.b--dark-green { border-color: #19a974; }
438.b--green { border-color: #0fdd83; }
439.b--light-green { border-color: #9eebcf; }
440.b--navy { border-color: #357edd; }
441.b--dark-blue { border-color: #133651; }
442.b--blue { border-color: #1f566f; }
443.b--light-blue { border-color: #53d6e4; }
444.b--lightest-blue { border-color: #bcebf1; }
445.b--washed-blue { border-color: #f6fffe; }
446.b--washed-green { border-color: #e8fdf5; }
447.b--washed-yellow { border-color: #fffceb; }
448.b--washed-red { border-color: #ffdfdf; }
449.b--transparent { border-color: transparent; }
450.b--inherit { border-color: inherit; }
451/*
452
453 BORDER RADIUS
454 Docs: http://tachyons.io/docs/themes/border-radius/
455
456 Base:
457 br = border-radius
458
459 Modifiers:
460 0 = 0/none
461 1 = 1st step in scale
462 2 = 2nd step in scale
463 3 = 3rd step in scale
464 4 = 4th step in scale
465
466 Literal values:
467 -100 = 100%
468 -pill = 9999px
469
470 Media Query Extensions:
471 -ns = not-small
472 -m = medium
473 -l = large
474
475*/
476.br0 { border-radius: 0; }
477.br1 { border-radius: .125rem; }
478.br2 { border-radius: .25rem; }
479.br3 { border-radius: .5rem; }
480.br4 { border-radius: 1rem; }
481.br-100 { border-radius: 100%; }
482.br-pill { border-radius: 9999px; }
483.br--bottom { border-top-left-radius: 0; border-top-right-radius: 0; }
484.br--top { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
485.br--right { border-top-left-radius: 0; border-bottom-left-radius: 0; }
486.br--left { border-top-right-radius: 0; border-bottom-right-radius: 0; }
487/*
488
489 BORDER STYLES
490 Docs: http://tachyons.io/docs/themes/borders/
491
492 Depends on base border module in _borders.css
493
494 Base:
495 b = border-style
496
497 Modifiers:
498 --none = none
499 --dotted = dotted
500 --dashed = dashed
501 --solid = solid
502
503 Media Query Extensions:
504 -ns = not-small
505 -m = medium
506 -l = large
507
508 */
509.b--dotted { border-style: dotted; }
510.b--dashed { border-style: dashed; }
511.b--solid { border-style: solid; }
512.b--none { border-style: none; }
513/*
514
515 BORDER WIDTHS
516 Docs: http://tachyons.io/docs/themes/borders/
517
518 Base:
519 bw = border-width
520
521 Modifiers:
522 0 = 0 width border
523 1 = 1st step in border-width scale
524 2 = 2nd step in border-width scale
525 3 = 3rd step in border-width scale
526 4 = 4th step in border-width scale
527 5 = 5th step in border-width scale
528
529 Media Query Extensions:
530 -ns = not-small
531 -m = medium
532 -l = large
533
534*/
535.bw0 { border-width: 0; }
536.bw1 { border-width: .125rem; }
537.bw2 { border-width: .25rem; }
538.bw3 { border-width: .5rem; }
539.bw4 { border-width: 1rem; }
540.bw5 { border-width: 2rem; }
541/* Resets */
542.bt-0 { border-top-width: 0; }
543.br-0 { border-right-width: 0; }
544.bb-0 { border-bottom-width: 0; }
545.bl-0 { border-left-width: 0; }
546/*
547
548 BOX-SHADOW
549 Docs: http://tachyons.io/docs/themes/box-shadow/
550
551 Media Query Extensions:
552 -ns = not-small
553 -m = medium
554 -l = large
555
556 */
557.shadow-1 { box-shadow: 0 1px 1px rgba( 0, 0, 0, .2 ); }
558.shadow-2 { box-shadow: 1px 1px 4px rgba( 0, 0, 0, .7 ); }
559.shadow-3 { box-shadow: inset 1px 1px 5px rgba( 0, 0, 0, .7 ); }
560.shadow-4 { box-shadow: 2px 2px 8px 0 rgba( 0, 0, 0, .2 ); }
561.shadow-5 { box-shadow: 4px 4px 8px 0 rgba( 0, 0, 0, .2 ); }
562/*
563
564 CODE
565
566*/
567.pre { overflow-x: auto; overflow-y: hidden; overflow: scroll; }
568/*
569
570 COORDINATES
571 Docs: http://tachyons.io/docs/layout/position/
572
573 Use in combination with the position module.
574
575 Base:
576 top
577 bottom
578 right
579 left
580
581 Modifiers:
582 -0 = literal value 0
583 -1 = literal value 1
584 -2 = literal value 2
585 --1 = literal value -1
586 --2 = literal value -2
587
588 Media Query Extensions:
589 -ns = not-small
590 -m = medium
591 -l = large
592
593*/
594.top-0 { top: 0; }
595.right-0 { right: 0; }
596.bottom-0 { bottom: 0; }
597.left-0 { left: 0; }
598.top-1 { top: 1rem; }
599.right-1 { right: 1rem; }
600.bottom-1 { bottom: 1rem; }
601.left-1 { left: 1rem; }
602.top-2 { top: 2rem; }
603.right-2 { right: 2rem; }
604.bottom-2 { bottom: 2rem; }
605.left-2 { left: 2rem; }
606.top--1 { top: -1rem; }
607.right--1 { right: -1rem; }
608.bottom--1 { bottom: -1rem; }
609.left--1 { left: -1rem; }
610.top--2 { top: -2rem; }
611.right--2 { right: -2rem; }
612.bottom--2 { bottom: -2rem; }
613.left--2 { left: -2rem; }
614.absolute--fill { top: 0; right: 0; bottom: 0; left: 0; }
615/*
616
617 CLEARFIX
618 http://tachyons.io/docs/layout/clearfix/
619
620*/
621/* Nicolas Gallaghers Clearfix solution
622 Ref: http://nicolasgallagher.com/micro-clearfix-hack/ */
623.cf:before, .cf:after { content: " "; display: table; }
624.cf:after { clear: both; }
625.cf { *zoom: 1; }
626.cl { clear: left; }
627.cr { clear: right; }
628.cb { clear: both; }
629.cn { clear: none; }
630/*
631
632 DISPLAY
633 Docs: http://tachyons.io/docs/layout/display
634
635 Base:
636 d = display
637
638 Modifiers:
639 n = none
640 b = block
641 ib = inline-block
642
643 Media Query Extensions:
644 -ns = not-small
645 -m = medium
646 -l = large
647
648*/
649.dn { display: none; }
650.di { display: inline; }
651.db { display: block; }
652.dib { display: inline-block; }
653/*
654
655 FLEXBOX
656
657 Media Query Extensions:
658 -ns = not-small
659 -m = medium
660 -l = large
661
662*/
663.flex { display: flex; }
664.inline-flex { display: inline-flex; }
665/* 1. Fix for Chrome 44 bug.
666 * https://code.google.com/p/chromium/issues/detail?id=506893 */
667.flex-auto { flex: 1 1 auto; min-width: 0; /* 1 */ min-height: 0; /* 1 */ }
668.flex-none { flex: none; }
669.flex-column { flex-direction: column; }
670.flex-row { flex-direction: row; }
671.flex-wrap { flex-wrap: wrap; }
672.flex-nowrap { flex-wrap: nowrap; }
673.flex-wrap-reverse { flex-wrap: wrap-reverse; }
674.flex-column-reverse { flex-direction: column-reverse; }
675.flex-row-reverse { flex-direction: row-reverse; }
676.items-start { align-items: flex-start; }
677.items-end { align-items: flex-end; }
678.items-center { align-items: center; }
679.items-baseline { align-items: baseline; }
680.items-stretch { align-items: stretch; }
681.self-start { align-self: flex-start; }
682.self-end { align-self: flex-end; }
683.self-center { align-self: center; }
684.self-baseline { align-self: baseline; }
685.self-stretch { align-self: stretch; }
686.justify-start { justify-content: flex-start; }
687.justify-end { justify-content: flex-end; }
688.justify-center { justify-content: center; }
689.justify-between { justify-content: space-between; }
690.justify-around { justify-content: space-around; }
691.content-start { align-content: flex-start; }
692.content-end { align-content: flex-end; }
693.content-center { align-content: center; }
694.content-between { align-content: space-between; }
695.content-around { align-content: space-around; }
696.content-stretch { align-content: stretch; }
697.order-0 { order: 0; }
698.order-1 { order: 1; }
699.order-2 { order: 2; }
700.order-3 { order: 3; }
701.order-4 { order: 4; }
702.order-5 { order: 5; }
703.order-6 { order: 6; }
704.order-7 { order: 7; }
705.order-8 { order: 8; }
706.order-last { order: 99999; }
707.flex-grow-0 { flex-grow: 0; }
708.flex-grow-1 { flex-grow: 1; }
709.flex-shrink-0 { flex-shrink: 0; }
710.flex-shrink-1 { flex-shrink: 1; }
711/*
712
713 FLOATS
714 http://tachyons.io/docs/layout/floats/
715
716 1. Floated elements are automatically rendered as block level elements.
717 Setting floats to display inline will fix the double margin bug in
718 ie6. You know... just in case.
719
720 2. Don't forget to clearfix your floats with .cf
721
722 Base:
723 f = float
724
725 Modifiers:
726 l = left
727 r = right
728 n = none
729
730 Media Query Extensions:
731 -ns = not-small
732 -m = medium
733 -l = large
734
735*/
736.fl { float: left; _display: inline; }
737.fr { float: right; _display: inline; }
738.fn { float: none; }
739/*
740
741 FONT FAMILY GROUPS
742 Docs: http://tachyons.io/docs/typography/font-family/
743
744*/
745.sans-serif { font-family: -apple-system, BlinkMacSystemFont, 'avenir next', avenir, helvetica, 'helvetica neue', ubuntu, roboto, noto, 'segoe ui', arial, sans-serif; }
746.serif { font-family: georgia, serif; }
747.system-sans-serif { font-family: sans-serif; }
748.system-serif { font-family: serif; }
749/* Monospaced Typefaces (for code) */
750/* From http://cssfontstack.com */
751code, .code { font-family: Consolas, monaco, monospace; }
752.courier { font-family: 'Courier Next', courier, monospace; }
753/* Sans-Serif Typefaces */
754.helvetica { font-family: 'helvetica neue', helvetica, sans-serif; }
755.avenir { font-family: 'avenir next', avenir, sans-serif; }
756/* Serif Typefaces */
757.athelas { font-family: athelas, georgia, serif; }
758.georgia { font-family: georgia, serif; }
759.times { font-family: times, serif; }
760.bodoni { font-family: "Bodoni MT", serif; }
761.calisto { font-family: "Calisto MT", serif; }
762.garamond { font-family: garamond, serif; }
763.baskerville { font-family: baskerville, serif; }
764/*
765
766 FONT STYLE
767 Docs: http://tachyons.io/docs/typography/font-style/
768
769 Media Query Extensions:
770 -ns = not-small
771 -m = medium
772 -l = large
773
774*/
775.i { font-style: italic; }
776.fs-normal { font-style: normal; }
777/*
778
779 FONT WEIGHT
780 Docs: http://tachyons.io/docs/typography/font-weight/
781
782 Base
783 fw = font-weight
784
785 Modifiers:
786 1 = literal value 100
787 2 = literal value 200
788 3 = literal value 300
789 4 = literal value 400
790 5 = literal value 500
791 6 = literal value 600
792 7 = literal value 700
793 8 = literal value 800
794 9 = literal value 900
795
796 Media Query Extensions:
797 -ns = not-small
798 -m = medium
799 -l = large
800
801*/
802.normal { font-weight: normal; }
803.b { font-weight: bold; }
804.fw1 { font-weight: 100; }
805.fw2 { font-weight: 200; }
806.fw3 { font-weight: 300; }
807.fw4 { font-weight: 400; }
808.fw5 { font-weight: 500; }
809.fw6 { font-weight: 600; }
810.fw7 { font-weight: 700; }
811.fw8 { font-weight: 800; }
812.fw9 { font-weight: 900; }
813/*
814
815 FORMS
816
817*/
818.input-reset { -webkit-appearance: none; -moz-appearance: none; }
819.button-reset::-moz-focus-inner, .input-reset::-moz-focus-inner { border: 0; padding: 0; }
820/*
821
822 HEIGHTS
823 Docs: http://tachyons.io/docs/layout/heights/
824
825 Base:
826 h = height
827 min-h = min-height
828 min-vh = min-height vertical screen height
829 vh = vertical screen height
830
831 Modifiers
832 1 = 1st step in height scale
833 2 = 2nd step in height scale
834 3 = 3rd step in height scale
835 4 = 4th step in height scale
836 5 = 5th step in height scale
837
838 -25 = literal value 25%
839 -50 = literal value 50%
840 -75 = literal value 75%
841 -100 = literal value 100%
842
843 -auto = string value of auto
844 -inherit = string value of inherit
845
846 Media Query Extensions:
847 -ns = not-small
848 -m = medium
849 -l = large
850
851*/
852/* Height Scale */
853.h1 { height: 1rem; }
854.h2 { height: 2rem; }
855.h3 { height: 4rem; }
856.h4 { height: 8rem; }
857.h5 { height: 16rem; }
858/* Height Percentages - Based off of height of parent */
859.h-25 { height: 25%; }
860.h-50 { height: 50%; }
861.h-75 { height: 75%; }
862.h-100 { height: 100%; }
863.min-h-100 { min-height: 100%; }
864.min-h3 { min-height: 4rem; }
865/* Screen Height Percentage */
866.vh-25 { height: 25vh; }
867.vh-50 { height: 50vh; }
868.vh-75 { height: 75vh; }
869.vh-100 { height: 100vh; }
870.min-vh-100 { min-height: 100vh; }
871/* String Properties */
872.h-auto { height: auto; }
873.h-inherit { height: inherit; }
874/*
875
876 LETTER SPACING
877 Docs: http://tachyons.io/docs/typography/tracking/
878
879 Media Query Extensions:
880 -ns = not-small
881 -m = medium
882 -l = large
883
884*/
885.tracked { letter-spacing: .1em; }
886.tracked-tight { letter-spacing: -0.05em; }
887.tracked-mega { letter-spacing: .25em; }
888/*
889
890 LINE HEIGHT / LEADING
891 Docs: http://tachyons.io/docs/typography/line-height
892
893 Media Query Extensions:
894 -ns = not-small
895 -m = medium
896 -l = large
897
898*/
899.lh-solid { line-height: 1; }
900.lh-title { line-height: 1.25; }
901.lh-copy { line-height: 1.5; }
902/*
903
904 LINKS
905 Docs: http://tachyons.io/docs/elements/links/
906
907*/
908.link { text-decoration: none; transition: color .15s ease-in; }
909.link:link, .link:visited { transition: color .15s ease-in; }
910.link:hover { transition: color .15s ease-in; }
911.link:active { transition: color .15s ease-in; }
912.link:focus { transition: color .15s ease-in; outline: 1px dotted currentColor; }
913/*
914
915 LISTS
916 http://tachyons.io/docs/elements/lists/
917
918*/
919.list { list-style-type: none; }
920/*
921
922 MAX WIDTHS
923 Docs: http://tachyons.io/docs/layout/max-widths/
924
925 Base:
926 mw = max-width
927
928 Modifiers
929 1 = 1st step in width scale
930 2 = 2nd step in width scale
931 3 = 3rd step in width scale
932 4 = 4th step in width scale
933 5 = 5th step in width scale
934 6 = 6st step in width scale
935 7 = 7nd step in width scale
936 8 = 8rd step in width scale
937 9 = 9th step in width scale
938
939 -100 = literal value 100%
940
941 -none = string value none
942
943
944 Media Query Extensions:
945 -ns = not-small
946 -m = medium
947 -l = large
948
949*/
950/* Max Width Percentages */
951.mw-100 { max-width: 100%; }
952/* Max Width Scale */
953.mw1 { max-width: 1rem; }
954.mw2 { max-width: 2rem; }
955.mw3 { max-width: 4rem; }
956.mw4 { max-width: 8rem; }
957.mw5 { max-width: 16rem; }
958.mw6 { max-width: 32rem; }
959.mw7 { max-width: 48rem; }
960.mw8 { max-width: 64rem; }
961.mw9 { max-width: 96rem; }
962/* Max Width String Properties */
963.mw-none { max-width: none; }
964/*
965
966 WIDTHS
967 Docs: http://tachyons.io/docs/layout/widths/
968
969 Base:
970 w = width
971
972 Modifiers
973 1 = 1st step in width scale
974 2 = 2nd step in width scale
975 3 = 3rd step in width scale
976 4 = 4th step in width scale
977 5 = 5th step in width scale
978
979 -10 = literal value 10%
980 -20 = literal value 20%
981 -25 = literal value 25%
982 -30 = literal value 30%
983 -33 = literal value 33%
984 -34 = literal value 34%
985 -40 = literal value 40%
986 -50 = literal value 50%
987 -60 = literal value 60%
988 -70 = literal value 70%
989 -75 = literal value 75%
990 -80 = literal value 80%
991 -90 = literal value 90%
992 -100 = literal value 100%
993
994 -third = 100% / 3 (Not supported in opera mini or IE8)
995 -two-thirds = 100% / 1.5 (Not supported in opera mini or IE8)
996 -auto = string value auto
997
998
999 Media Query Extensions:
1000 -ns = not-small
1001 -m = medium
1002 -l = large
1003
1004 */
1005/* Width Scale */
1006.w1 { width: 1rem; }
1007.w2 { width: 2rem; }
1008.w3 { width: 4rem; }
1009.w4 { width: 8rem; }
1010.w5 { width: 16rem; }
1011.w-10 { width: 10%; }
1012.w-20 { width: 20%; }
1013.w-25 { width: 25%; }
1014.w-30 { width: 30%; }
1015.w-33 { width: 33%; }
1016.w-34 { width: 34%; }
1017.w-40 { width: 40%; }
1018.w-50 { width: 50%; }
1019.w-60 { width: 60%; }
1020.w-70 { width: 70%; }
1021.w-75 { width: 75%; }
1022.w-80 { width: 80%; }
1023.w-90 { width: 90%; }
1024.w-100 { width: 100%; }
1025.w-third { width: 33.33333%; }
1026.w-two-thirds { width: 66.66667%; }
1027.w-auto { width: auto; }
1028/*
1029
1030 OVERFLOW
1031
1032 Media Query Extensions:
1033 -ns = not-small
1034 -m = medium
1035 -l = large
1036
1037 */
1038.overflow-visible { overflow: visible; }
1039.overflow-hidden { overflow: hidden; }
1040.overflow-scroll { overflow: scroll; }
1041.overflow-auto { overflow: auto; }
1042.overflow-x-visible { overflow-x: visible; }
1043.overflow-x-hidden { overflow-x: hidden; }
1044.overflow-x-scroll { overflow-x: scroll; }
1045.overflow-x-auto { overflow-x: auto; }
1046.overflow-y-visible { overflow-y: visible; }
1047.overflow-y-hidden { overflow-y: hidden; }
1048.overflow-y-scroll { overflow-y: scroll; }
1049.overflow-y-auto { overflow-y: auto; }
1050/*
1051
1052 POSITIONING
1053 Docs: http://tachyons.io/docs/layout/position/
1054
1055 Media Query Extensions:
1056 -ns = not-small
1057 -m = medium
1058 -l = large
1059
1060*/
1061.static { position: static; }
1062.relative { position: relative; }
1063.absolute { position: absolute; }
1064.fixed { position: fixed; }
1065/*
1066
1067 OPACITY
1068 Docs: http://tachyons.io/docs/themes/opacity/
1069
1070*/
1071.o-100 { opacity: 1; }
1072.o-90 { opacity: .9; }
1073.o-80 { opacity: .8; }
1074.o-70 { opacity: .7; }
1075.o-60 { opacity: .6; }
1076.o-50 { opacity: .5; }
1077.o-40 { opacity: .4; }
1078.o-30 { opacity: .3; }
1079.o-20 { opacity: .2; }
1080.o-10 { opacity: .1; }
1081.o-05 { opacity: .05; }
1082.o-025 { opacity: .025; }
1083.o-0 { opacity: 0; }
1084/*
1085
1086 ROTATIONS
1087
1088*/
1089.rotate-45 { -webkit-transform: rotate( 45deg ); transform: rotate( 45deg ); }
1090.rotate-90 { -webkit-transform: rotate( 90deg ); transform: rotate( 90deg ); }
1091.rotate-135 { -webkit-transform: rotate( 135deg ); transform: rotate( 135deg ); }
1092.rotate-180 { -webkit-transform: rotate( 180deg ); transform: rotate( 180deg ); }
1093.rotate-225 { -webkit-transform: rotate( 225deg ); transform: rotate( 225deg ); }
1094.rotate-270 { -webkit-transform: rotate( 270deg ); transform: rotate( 270deg ); }
1095.rotate-315 { -webkit-transform: rotate( 315deg ); transform: rotate( 315deg ); }
1096/*
1097
1098 SKINS
1099 Docs: http://tachyons.io/docs/themes/skins/
1100
1101 Classes for setting foreground and background colors on elements.
1102 If you haven't declared a border color, but set border on an element, it will
1103 be set to the current text color.
1104
1105*/
1106/* Text colors */
1107.black-90 { color: rgba( 0, 0, 0, .9 ); fill: rgba( 0, 0, 0, .9 ); }
1108.black-80 { color: rgba( 0, 0, 0, .8 ); fill: rgba( 0, 0, 0, .8 ); }
1109.black-70 { color: rgba( 0, 0, 0, .7 ); fill: rgba( 0, 0, 0, .7 ); }
1110.black-60 { color: rgba( 0, 0, 0, .6 ); fill: rgba( 0, 0, 0, .6 ); }
1111.black-50 { color: rgba( 0, 0, 0, .5 ); fill: rgba( 0, 0, 0, .5 ); }
1112.black-40 { color: rgba( 0, 0, 0, .4 ); fill: rgba( 0, 0, 0, .4 ); }
1113.black-30 { color: rgba( 0, 0, 0, .3 ); fill: rgba( 0, 0, 0, .3 ); }
1114.black-20 { color: rgba( 0, 0, 0, .2 ); fill: rgba( 0, 0, 0, .2 ); }
1115.black-10 { color: rgba( 0, 0, 0, .1 ); fill: rgba( 0, 0, 0, .1 ); }
1116.black-05 { color: rgba( 0, 0, 0, .05 ); fill: rgba( 0, 0, 0, .05 ); }
1117.white-90 { color: rgba( 255, 255, 255, .9 ); fill: rgba( 255, 255, 255, .9 ); }
1118.white-80 { color: rgba( 255, 255, 255, .8 ); fill: rgba( 255, 255, 255, .8 ); }
1119.white-70 { color: rgba( 255, 255, 255, .7 ); fill: rgba( 255, 255, 255, .7 ); }
1120.white-60 { color: rgba( 255, 255, 255, .6 ); fill: rgba( 255, 255, 255, .6 ); }
1121.white-50 { color: rgba( 255, 255, 255, .5 ); fill: rgba( 255, 255, 255, .5 ); }
1122.white-40 { color: rgba( 255, 255, 255, .4 ); fill: rgba( 255, 255, 255, .4 ); }
1123.white-30 { color: rgba( 255, 255, 255, .3 ); fill: rgba( 255, 255, 255, .3 ); }
1124.white-20 { color: rgba( 255, 255, 255, .2 ); fill: rgba( 255, 255, 255, .2 ); }
1125.white-10 { color: rgba( 255, 255, 255, .1 ); fill: rgba( 255, 255, 255, .1 ); }
1126.black { color: #000; fill: #000; }
1127.near-black { color: #111; fill: #111; }
1128.dark-gray { color: #333; fill: #333; }
1129.mid-gray { color: #5b7385; fill: #5b7385; }
1130.gray { color: #a1afba; fill: #a1afba; }
1131.silver { color: #999; fill: #999; }
1132.light-silver { color: #aaa; fill: #aaa; }
1133.moon-gray { color: #ccc; fill: #ccc; }
1134.light-gray { color: #d0d7dc; fill: #d0d7dc; }
1135.near-white { color: #dbe1e5; fill: #dbe1e5; }
1136.white { color: #fff; fill: #fff; }
1137.dark-red { color: #e7040f; fill: #e7040f; }
1138.red { color: #f00; fill: #f00; }
1139.light-red { color: #ff725c; fill: #ff725c; }
1140.orange { color: #ff6300; fill: #ff6300; }
1141.gold { color: #ffb700; fill: #ffb700; }
1142.yellow { color: #ffd700; fill: #ffd700; }
1143.light-yellow { color: #fbf1a9; fill: #fbf1a9; }
1144.purple { color: #5e2ca5; fill: #5e2ca5; }
1145.light-purple { color: #a463f2; fill: #a463f2; }
1146.dark-pink { color: #d5008f; fill: #d5008f; }
1147.hot-pink { color: #ff41b4; fill: #ff41b4; }
1148.pink { color: #ff80cc; fill: #ff80cc; }
1149.light-pink { color: #ffa3d7; fill: #ffa3d7; }
1150.dark-green { color: #19a974; fill: #19a974; }
1151.green { color: #0fdd83; fill: #0fdd83; }
1152.light-green { color: #9eebcf; fill: #9eebcf; }
1153.navy { color: #357edd; fill: #357edd; }
1154.dark-blue { color: #133651; fill: #133651; }
1155.blue { color: #1f566f; fill: #1f566f; }
1156.light-blue { color: #53d6e4; fill: #53d6e4; }
1157.lightest-blue { color: #bcebf1; fill: #bcebf1; }
1158.washed-blue { color: #f6fffe; fill: #f6fffe; }
1159.washed-green { color: #e8fdf5; fill: #e8fdf5; }
1160.washed-yellow { color: #fffceb; fill: #fffceb; }
1161.washed-red { color: #ffdfdf; fill: #ffdfdf; }
1162.color-inherit { color: inherit; }
1163.bg-black-90 { background-color: rgba( 0, 0, 0, .9 ); }
1164.bg-black-80 { background-color: rgba( 0, 0, 0, .8 ); }
1165.bg-black-70 { background-color: rgba( 0, 0, 0, .7 ); }
1166.bg-black-60 { background-color: rgba( 0, 0, 0, .6 ); }
1167.bg-black-50 { background-color: rgba( 0, 0, 0, .5 ); }
1168.bg-black-40 { background-color: rgba( 0, 0, 0, .4 ); }
1169.bg-black-30 { background-color: rgba( 0, 0, 0, .3 ); }
1170.bg-black-20 { background-color: rgba( 0, 0, 0, .2 ); }
1171.bg-black-10 { background-color: rgba( 0, 0, 0, .1 ); }
1172.bg-black-05 { background-color: rgba( 0, 0, 0, .05 ); }
1173.bg-white-90 { background-color: rgba( 255, 255, 255, .9 ); }
1174.bg-white-80 { background-color: rgba( 255, 255, 255, .8 ); }
1175.bg-white-70 { background-color: rgba( 255, 255, 255, .7 ); }
1176.bg-white-60 { background-color: rgba( 255, 255, 255, .6 ); }
1177.bg-white-50 { background-color: rgba( 255, 255, 255, .5 ); }
1178.bg-white-40 { background-color: rgba( 255, 255, 255, .4 ); }
1179.bg-white-30 { background-color: rgba( 255, 255, 255, .3 ); }
1180.bg-white-20 { background-color: rgba( 255, 255, 255, .2 ); }
1181.bg-white-10 { background-color: rgba( 255, 255, 255, .1 ); }
1182/* Background colors */
1183.bg-black { background-color: #000; }
1184.bg-near-black { background-color: #111; }
1185.bg-dark-gray { background-color: #333; }
1186.bg-mid-gray { background-color: #5b7385; }
1187.bg-gray { background-color: #a1afba; }
1188.bg-silver { background-color: #999; }
1189.bg-light-silver { background-color: #aaa; }
1190.bg-moon-gray { background-color: #ccc; }
1191.bg-light-gray { background-color: #d0d7dc; }
1192.bg-near-white { background-color: #dbe1e5; }
1193.bg-white { background-color: #fff; }
1194.bg-transparent { background-color: transparent; }
1195.bg-dark-red { background-color: #e7040f; }
1196.bg-red { background-color: #f00; }
1197.bg-light-red { background-color: #ff725c; }
1198.bg-orange { background-color: #ff6300; }
1199.bg-gold { background-color: #ffb700; }
1200.bg-yellow { background-color: #ffd700; }
1201.bg-light-yellow { background-color: #fbf1a9; }
1202.bg-purple { background-color: #5e2ca5; }
1203.bg-light-purple { background-color: #a463f2; }
1204.bg-dark-pink { background-color: #d5008f; }
1205.bg-hot-pink { background-color: #ff41b4; }
1206.bg-pink { background-color: #ff80cc; }
1207.bg-light-pink { background-color: #ffa3d7; }
1208.bg-dark-green { background-color: #19a974; }
1209.bg-green { background-color: #0fdd83; }
1210.bg-light-green { background-color: #9eebcf; }
1211.bg-navy { background-color: #357edd; }
1212.bg-dark-blue { background-color: #133651; }
1213.bg-blue { background-color: #1f566f; }
1214.bg-light-blue { background-color: #53d6e4; }
1215.bg-lightest-blue { background-color: #bcebf1; }
1216.bg-washed-blue { background-color: #f6fffe; }
1217.bg-washed-green { background-color: #e8fdf5; }
1218.bg-washed-yellow { background-color: #fffceb; }
1219.bg-washed-red { background-color: #ffdfdf; }
1220.bg-inherit { background-color: inherit; }
1221/*
1222
1223 SKINS:PSEUDO
1224
1225 Customize the color of an element when
1226 it is focused or hovered over.
1227
1228 */
1229.hover-black:hover { color: #000; }
1230.hover-black:focus { color: #000; }
1231.hover-near-black:hover { color: #111; }
1232.hover-near-black:focus { color: #111; }
1233.hover-dark-gray:hover { color: #333; }
1234.hover-dark-gray:focus { color: #333; }
1235.hover-mid-gray:hover { color: #5b7385; }
1236.hover-mid-gray:focus { color: #5b7385; }
1237.hover-gray:hover { color: #a1afba; }
1238.hover-gray:focus { color: #a1afba; }
1239.hover-silver:hover { color: #999; }
1240.hover-silver:focus { color: #999; }
1241.hover-light-silver:hover { color: #aaa; }
1242.hover-light-silver:focus { color: #aaa; }
1243.hover-moon-gray:hover { color: #ccc; }
1244.hover-moon-gray:focus { color: #ccc; }
1245.hover-light-gray:hover { color: #d0d7dc; }
1246.hover-light-gray:focus { color: #d0d7dc; }
1247.hover-near-white:hover { color: #dbe1e5; }
1248.hover-near-white:focus { color: #dbe1e5; }
1249.hover-white:hover { color: #fff; }
1250.hover-white:focus { color: #fff; }
1251.hover-black-90:hover { color: rgba( 0, 0, 0, .9 ); }
1252.hover-black-90:focus { color: rgba( 0, 0, 0, .9 ); }
1253.hover-black-80:hover { color: rgba( 0, 0, 0, .8 ); }
1254.hover-black-80:focus { color: rgba( 0, 0, 0, .8 ); }
1255.hover-black-70:hover { color: rgba( 0, 0, 0, .7 ); }
1256.hover-black-70:focus { color: rgba( 0, 0, 0, .7 ); }
1257.hover-black-60:hover { color: rgba( 0, 0, 0, .6 ); }
1258.hover-black-60:focus { color: rgba( 0, 0, 0, .6 ); }
1259.hover-black-50:hover { color: rgba( 0, 0, 0, .5 ); }
1260.hover-black-50:focus { color: rgba( 0, 0, 0, .5 ); }
1261.hover-black-40:hover { color: rgba( 0, 0, 0, .4 ); }
1262.hover-black-40:focus { color: rgba( 0, 0, 0, .4 ); }
1263.hover-black-30:hover { color: rgba( 0, 0, 0, .3 ); }
1264.hover-black-30:focus { color: rgba( 0, 0, 0, .3 ); }
1265.hover-black-20:hover { color: rgba( 0, 0, 0, .2 ); }
1266.hover-black-20:focus { color: rgba( 0, 0, 0, .2 ); }
1267.hover-black-10:hover { color: rgba( 0, 0, 0, .1 ); }
1268.hover-black-10:focus { color: rgba( 0, 0, 0, .1 ); }
1269.hover-white-90:hover { color: rgba( 255, 255, 255, .9 ); }
1270.hover-white-90:focus { color: rgba( 255, 255, 255, .9 ); }
1271.hover-white-80:hover { color: rgba( 255, 255, 255, .8 ); }
1272.hover-white-80:focus { color: rgba( 255, 255, 255, .8 ); }
1273.hover-white-70:hover { color: rgba( 255, 255, 255, .7 ); }
1274.hover-white-70:focus { color: rgba( 255, 255, 255, .7 ); }
1275.hover-white-60:hover { color: rgba( 255, 255, 255, .6 ); }
1276.hover-white-60:focus { color: rgba( 255, 255, 255, .6 ); }
1277.hover-white-50:hover { color: rgba( 255, 255, 255, .5 ); }
1278.hover-white-50:focus { color: rgba( 255, 255, 255, .5 ); }
1279.hover-white-40:hover { color: rgba( 255, 255, 255, .4 ); }
1280.hover-white-40:focus { color: rgba( 255, 255, 255, .4 ); }
1281.hover-white-30:hover { color: rgba( 255, 255, 255, .3 ); }
1282.hover-white-30:focus { color: rgba( 255, 255, 255, .3 ); }
1283.hover-white-20:hover { color: rgba( 255, 255, 255, .2 ); }
1284.hover-white-20:focus { color: rgba( 255, 255, 255, .2 ); }
1285.hover-white-10:hover { color: rgba( 255, 255, 255, .1 ); }
1286.hover-white-10:focus { color: rgba( 255, 255, 255, .1 ); }
1287.hover-inherit:hover, .hover-inherit:focus { color: inherit; }
1288.hover-bg-black:hover { background-color: #000; }
1289.hover-bg-black:focus { background-color: #000; }
1290.hover-bg-near-black:hover { background-color: #111; }
1291.hover-bg-near-black:focus { background-color: #111; }
1292.hover-bg-dark-gray:hover { background-color: #333; }
1293.hover-bg-dark-gray:focus { background-color: #333; }
1294.hover-bg-mid-gray:hover { background-color: #5b7385; }
1295.hover-bg-mid-gray:focus { background-color: #5b7385; }
1296.hover-bg-gray:hover { background-color: #a1afba; }
1297.hover-bg-gray:focus { background-color: #a1afba; }
1298.hover-bg-silver:hover { background-color: #999; }
1299.hover-bg-silver:focus { background-color: #999; }
1300.hover-bg-light-silver:hover { background-color: #aaa; }
1301.hover-bg-light-silver:focus { background-color: #aaa; }
1302.hover-bg-moon-gray:hover { background-color: #ccc; }
1303.hover-bg-moon-gray:focus { background-color: #ccc; }
1304.hover-bg-light-gray:hover { background-color: #d0d7dc; }
1305.hover-bg-light-gray:focus { background-color: #d0d7dc; }
1306.hover-bg-near-white:hover { background-color: #dbe1e5; }
1307.hover-bg-near-white:focus { background-color: #dbe1e5; }
1308.hover-bg-white:hover { background-color: #fff; }
1309.hover-bg-white:focus { background-color: #fff; }
1310.hover-bg-transparent:hover { background-color: transparent; }
1311.hover-bg-transparent:focus { background-color: transparent; }
1312.hover-bg-black-90:hover { background-color: rgba( 0, 0, 0, .9 ); }
1313.hover-bg-black-90:focus { background-color: rgba( 0, 0, 0, .9 ); }
1314.hover-bg-black-80:hover { background-color: rgba( 0, 0, 0, .8 ); }
1315.hover-bg-black-80:focus { background-color: rgba( 0, 0, 0, .8 ); }
1316.hover-bg-black-70:hover { background-color: rgba( 0, 0, 0, .7 ); }
1317.hover-bg-black-70:focus { background-color: rgba( 0, 0, 0, .7 ); }
1318.hover-bg-black-60:hover { background-color: rgba( 0, 0, 0, .6 ); }
1319.hover-bg-black-60:focus { background-color: rgba( 0, 0, 0, .6 ); }
1320.hover-bg-black-50:hover { background-color: rgba( 0, 0, 0, .5 ); }
1321.hover-bg-black-50:focus { background-color: rgba( 0, 0, 0, .5 ); }
1322.hover-bg-black-40:hover { background-color: rgba( 0, 0, 0, .4 ); }
1323.hover-bg-black-40:focus { background-color: rgba( 0, 0, 0, .4 ); }
1324.hover-bg-black-30:hover { background-color: rgba( 0, 0, 0, .3 ); }
1325.hover-bg-black-30:focus { background-color: rgba( 0, 0, 0, .3 ); }
1326.hover-bg-black-20:hover { background-color: rgba( 0, 0, 0, .2 ); }
1327.hover-bg-black-20:focus { background-color: rgba( 0, 0, 0, .2 ); }
1328.hover-bg-black-10:hover { background-color: rgba( 0, 0, 0, .1 ); }
1329.hover-bg-black-10:focus { background-color: rgba( 0, 0, 0, .1 ); }
1330.hover-bg-white-90:hover { background-color: rgba( 255, 255, 255, .9 ); }
1331.hover-bg-white-90:focus { background-color: rgba( 255, 255, 255, .9 ); }
1332.hover-bg-white-80:hover { background-color: rgba( 255, 255, 255, .8 ); }
1333.hover-bg-white-80:focus { background-color: rgba( 255, 255, 255, .8 ); }
1334.hover-bg-white-70:hover { background-color: rgba( 255, 255, 255, .7 ); }
1335.hover-bg-white-70:focus { background-color: rgba( 255, 255, 255, .7 ); }
1336.hover-bg-white-60:hover { background-color: rgba( 255, 255, 255, .6 ); }
1337.hover-bg-white-60:focus { background-color: rgba( 255, 255, 255, .6 ); }
1338.hover-bg-white-50:hover { background-color: rgba( 255, 255, 255, .5 ); }
1339.hover-bg-white-50:focus { background-color: rgba( 255, 255, 255, .5 ); }
1340.hover-bg-white-40:hover { background-color: rgba( 255, 255, 255, .4 ); }
1341.hover-bg-white-40:focus { background-color: rgba( 255, 255, 255, .4 ); }
1342.hover-bg-white-30:hover { background-color: rgba( 255, 255, 255, .3 ); }
1343.hover-bg-white-30:focus { background-color: rgba( 255, 255, 255, .3 ); }
1344.hover-bg-white-20:hover { background-color: rgba( 255, 255, 255, .2 ); }
1345.hover-bg-white-20:focus { background-color: rgba( 255, 255, 255, .2 ); }
1346.hover-bg-white-10:hover { background-color: rgba( 255, 255, 255, .1 ); }
1347.hover-bg-white-10:focus { background-color: rgba( 255, 255, 255, .1 ); }
1348.hover-dark-red:hover { color: #e7040f; }
1349.hover-dark-red:focus { color: #e7040f; }
1350.hover-red:hover { color: #f00; }
1351.hover-red:focus { color: #f00; }
1352.hover-light-red:hover { color: #ff725c; }
1353.hover-light-red:focus { color: #ff725c; }
1354.hover-orange:hover { color: #ff6300; }
1355.hover-orange:focus { color: #ff6300; }
1356.hover-gold:hover { color: #ffb700; }
1357.hover-gold:focus { color: #ffb700; }
1358.hover-yellow:hover { color: #ffd700; }
1359.hover-yellow:focus { color: #ffd700; }
1360.hover-light-yellow:hover { color: #fbf1a9; }
1361.hover-light-yellow:focus { color: #fbf1a9; }
1362.hover-purple:hover { color: #5e2ca5; }
1363.hover-purple:focus { color: #5e2ca5; }
1364.hover-light-purple:hover { color: #a463f2; }
1365.hover-light-purple:focus { color: #a463f2; }
1366.hover-dark-pink:hover { color: #d5008f; }
1367.hover-dark-pink:focus { color: #d5008f; }
1368.hover-hot-pink:hover { color: #ff41b4; }
1369.hover-hot-pink:focus { color: #ff41b4; }
1370.hover-pink:hover { color: #ff80cc; }
1371.hover-pink:focus { color: #ff80cc; }
1372.hover-light-pink:hover { color: #ffa3d7; }
1373.hover-light-pink:focus { color: #ffa3d7; }
1374.hover-dark-green:hover { color: #19a974; }
1375.hover-dark-green:focus { color: #19a974; }
1376.hover-green:hover { color: #0fdd83; }
1377.hover-green:focus { color: #0fdd83; }
1378.hover-light-green:hover { color: #9eebcf; }
1379.hover-light-green:focus { color: #9eebcf; }
1380.hover-navy:hover { color: #357edd; }
1381.hover-navy:focus { color: #357edd; }
1382.hover-dark-blue:hover { color: #133651; }
1383.hover-dark-blue:focus { color: #133651; }
1384.hover-blue:hover { color: #1f566f; }
1385.hover-blue:focus { color: #1f566f; }
1386.hover-light-blue:hover { color: #53d6e4; }
1387.hover-light-blue:focus { color: #53d6e4; }
1388.hover-lightest-blue:hover { color: #bcebf1; }
1389.hover-lightest-blue:focus { color: #bcebf1; }
1390.hover-washed-blue:hover { color: #f6fffe; }
1391.hover-washed-blue:focus { color: #f6fffe; }
1392.hover-washed-green:hover { color: #e8fdf5; }
1393.hover-washed-green:focus { color: #e8fdf5; }
1394.hover-washed-yellow:hover { color: #fffceb; }
1395.hover-washed-yellow:focus { color: #fffceb; }
1396.hover-washed-red:hover { color: #ffdfdf; }
1397.hover-washed-red:focus { color: #ffdfdf; }
1398.hover-bg-dark-red:hover { background-color: #e7040f; }
1399.hover-bg-dark-red:focus { background-color: #e7040f; }
1400.hover-bg-red:hover { background-color: #f00; }
1401.hover-bg-red:focus { background-color: #f00; }
1402.hover-bg-light-red:hover { background-color: #ff725c; }
1403.hover-bg-light-red:focus { background-color: #ff725c; }
1404.hover-bg-orange:hover { background-color: #ff6300; }
1405.hover-bg-orange:focus { background-color: #ff6300; }
1406.hover-bg-gold:hover { background-color: #ffb700; }
1407.hover-bg-gold:focus { background-color: #ffb700; }
1408.hover-bg-yellow:hover { background-color: #ffd700; }
1409.hover-bg-yellow:focus { background-color: #ffd700; }
1410.hover-bg-light-yellow:hover { background-color: #fbf1a9; }
1411.hover-bg-light-yellow:focus { background-color: #fbf1a9; }
1412.hover-bg-purple:hover { background-color: #5e2ca5; }
1413.hover-bg-purple:focus { background-color: #5e2ca5; }
1414.hover-bg-light-purple:hover { background-color: #a463f2; }
1415.hover-bg-light-purple:focus { background-color: #a463f2; }
1416.hover-bg-dark-pink:hover { background-color: #d5008f; }
1417.hover-bg-dark-pink:focus { background-color: #d5008f; }
1418.hover-bg-hot-pink:hover { background-color: #ff41b4; }
1419.hover-bg-hot-pink:focus { background-color: #ff41b4; }
1420.hover-bg-pink:hover { background-color: #ff80cc; }
1421.hover-bg-pink:focus { background-color: #ff80cc; }
1422.hover-bg-light-pink:hover { background-color: #ffa3d7; }
1423.hover-bg-light-pink:focus { background-color: #ffa3d7; }
1424.hover-bg-dark-green:hover { background-color: #19a974; }
1425.hover-bg-dark-green:focus { background-color: #19a974; }
1426.hover-bg-green:hover { background-color: #0fdd83; }
1427.hover-bg-green:focus { background-color: #0fdd83; }
1428.hover-bg-light-green:hover { background-color: #9eebcf; }
1429.hover-bg-light-green:focus { background-color: #9eebcf; }
1430.hover-bg-navy:hover { background-color: #357edd; }
1431.hover-bg-navy:focus { background-color: #357edd; }
1432.hover-bg-dark-blue:hover { background-color: #133651; }
1433.hover-bg-dark-blue:focus { background-color: #133651; }
1434.hover-bg-blue:hover { background-color: #1f566f; }
1435.hover-bg-blue:focus { background-color: #1f566f; }
1436.hover-bg-light-blue:hover { background-color: #53d6e4; }
1437.hover-bg-light-blue:focus { background-color: #53d6e4; }
1438.hover-bg-lightest-blue:hover { background-color: #bcebf1; }
1439.hover-bg-lightest-blue:focus { background-color: #bcebf1; }
1440.hover-bg-washed-blue:hover { background-color: #f6fffe; }
1441.hover-bg-washed-blue:focus { background-color: #f6fffe; }
1442.hover-bg-washed-green:hover { background-color: #e8fdf5; }
1443.hover-bg-washed-green:focus { background-color: #e8fdf5; }
1444.hover-bg-washed-yellow:hover { background-color: #fffceb; }
1445.hover-bg-washed-yellow:focus { background-color: #fffceb; }
1446.hover-bg-washed-red:hover { background-color: #ffdfdf; }
1447.hover-bg-washed-red:focus { background-color: #ffdfdf; }
1448.hover-bg-inherit:hover, .hover-bg-inherit:focus { background-color: inherit; }
1449/* Variables */
1450:root { }
1451/*
1452 SPACING
1453 Docs: http://tachyons.io/docs/layout/spacing/
1454
1455 An eight step powers of two scale ranging from 0 to 16rem.
1456
1457 Base:
1458 p = padding
1459 m = margin
1460
1461 Modifiers:
1462 a = all
1463 h = horizontal
1464 v = vertical
1465 t = top
1466 r = right
1467 b = bottom
1468 l = left
1469
1470 0 = none
1471 1 = 1st step in spacing scale
1472 2 = 2nd step in spacing scale
1473 3 = 3rd step in spacing scale
1474 4 = 4th step in spacing scale
1475 5 = 5th step in spacing scale
1476 6 = 6th step in spacing scale
1477 7 = 7th step in spacing scale
1478
1479 Media Query Extensions:
1480 -ns = not-small
1481 -m = medium
1482 -l = large
1483
1484*/
1485.pa0 { padding: 0; }
1486.pa1 { padding: .25rem; }
1487.pa2 { padding: .5rem; }
1488.pa3 { padding: 1rem; }
1489.pa4 { padding: 2rem; }
1490.pa5 { padding: 4rem; }
1491.pa6 { padding: 8rem; }
1492.pa7 { padding: 16rem; }
1493.pl0 { padding-left: 0; }
1494.pl1 { padding-left: .25rem; }
1495.pl2 { padding-left: .5rem; }
1496.pl3 { padding-left: 1rem; }
1497.pl4 { padding-left: 2rem; }
1498.pl5 { padding-left: 4rem; }
1499.pl6 { padding-left: 8rem; }
1500.pl7 { padding-left: 16rem; }
1501.pr0 { padding-right: 0; }
1502.pr1 { padding-right: .25rem; }
1503.pr2 { padding-right: .5rem; }
1504.pr3 { padding-right: 1rem; }
1505.pr4 { padding-right: 2rem; }
1506.pr5 { padding-right: 4rem; }
1507.pr6 { padding-right: 8rem; }
1508.pr7 { padding-right: 16rem; }
1509.pb0 { padding-bottom: 0; }
1510.pb1 { padding-bottom: .25rem; }
1511.pb2 { padding-bottom: .5rem; }
1512.pb3 { padding-bottom: 1rem; }
1513.pb4 { padding-bottom: 2rem; }
1514.pb5 { padding-bottom: 4rem; }
1515.pb6 { padding-bottom: 8rem; }
1516.pb7 { padding-bottom: 16rem; }
1517.pt0 { padding-top: 0; }
1518.pt1 { padding-top: .25rem; }
1519.pt2 { padding-top: .5rem; }
1520.pt3 { padding-top: 1rem; }
1521.pt4 { padding-top: 2rem; }
1522.pt5 { padding-top: 4rem; }
1523.pt6 { padding-top: 8rem; }
1524.pt7 { padding-top: 16rem; }
1525.pv0 { padding-top: 0; padding-bottom: 0; }
1526.pv1 { padding-top: .25rem; padding-bottom: .25rem; }
1527.pv2 { padding-top: .5rem; padding-bottom: .5rem; }
1528.pv3 { padding-top: 1rem; padding-bottom: 1rem; }
1529.pv4 { padding-top: 2rem; padding-bottom: 2rem; }
1530.pv5 { padding-top: 4rem; padding-bottom: 4rem; }
1531.pv6 { padding-top: 8rem; padding-bottom: 8rem; }
1532.pv7 { padding-top: 16rem; padding-bottom: 16rem; }
1533.ph0 { padding-left: 0; padding-right: 0; }
1534.ph1 { padding-left: .25rem; padding-right: .25rem; }
1535.ph2 { padding-left: .5rem; padding-right: .5rem; }
1536.ph3 { padding-left: 1rem; padding-right: 1rem; }
1537.ph4 { padding-left: 2rem; padding-right: 2rem; }
1538.ph5 { padding-left: 4rem; padding-right: 4rem; }
1539.ph6 { padding-left: 8rem; padding-right: 8rem; }
1540.ph7 { padding-left: 16rem; padding-right: 16rem; }
1541.ma0 { margin: 0; }
1542.ma1 { margin: .25rem; }
1543.ma2 { margin: .5rem; }
1544.ma3 { margin: 1rem; }
1545.ma4 { margin: 2rem; }
1546.ma5 { margin: 4rem; }
1547.ma6 { margin: 8rem; }
1548.ma7 { margin: 16rem; }
1549.ml0 { margin-left: 0; }
1550.ml1 { margin-left: .25rem; }
1551.ml2 { margin-left: .5rem; }
1552.ml3 { margin-left: 1rem; }
1553.ml4 { margin-left: 2rem; }
1554.ml5 { margin-left: 4rem; }
1555.ml6 { margin-left: 8rem; }
1556.ml7 { margin-left: 16rem; }
1557.mr0 { margin-right: 0; }
1558.mr1 { margin-right: .25rem; }
1559.mr2 { margin-right: .5rem; }
1560.mr3 { margin-right: 1rem; }
1561.mr4 { margin-right: 2rem; }
1562.mr5 { margin-right: 4rem; }
1563.mr6 { margin-right: 8rem; }
1564.mr7 { margin-right: 16rem; }
1565.mb0 { margin-bottom: 0; }
1566.mb1 { margin-bottom: .25rem; }
1567.mb2 { margin-bottom: .5rem; }
1568.mb3 { margin-bottom: 1rem; }
1569.mb4 { margin-bottom: 2rem; }
1570.mb5 { margin-bottom: 4rem; }
1571.mb6 { margin-bottom: 8rem; }
1572.mb7 { margin-bottom: 16rem; }
1573.mt0 { margin-top: 0; }
1574.mt1 { margin-top: .25rem; }
1575.mt2 { margin-top: .5rem; }
1576.mt3 { margin-top: 1rem; }
1577.mt4 { margin-top: 2rem; }
1578.mt5 { margin-top: 4rem; }
1579.mt6 { margin-top: 8rem; }
1580.mt7 { margin-top: 16rem; }
1581.mv0 { margin-top: 0; margin-bottom: 0; }
1582.mv1 { margin-top: .25rem; margin-bottom: .25rem; }
1583.mv2 { margin-top: .5rem; margin-bottom: .5rem; }
1584.mv3 { margin-top: 1rem; margin-bottom: 1rem; }
1585.mv4 { margin-top: 2rem; margin-bottom: 2rem; }
1586.mv5 { margin-top: 4rem; margin-bottom: 4rem; }
1587.mv6 { margin-top: 8rem; margin-bottom: 8rem; }
1588.mv7 { margin-top: 16rem; margin-bottom: 16rem; }
1589.mh0 { margin-left: 0; margin-right: 0; }
1590.mh1 { margin-left: .25rem; margin-right: .25rem; }
1591.mh2 { margin-left: .5rem; margin-right: .5rem; }
1592.mh3 { margin-left: 1rem; margin-right: 1rem; }
1593.mh4 { margin-left: 2rem; margin-right: 2rem; }
1594.mh5 { margin-left: 4rem; margin-right: 4rem; }
1595.mh6 { margin-left: 8rem; margin-right: 8rem; }
1596.mh7 { margin-left: 16rem; margin-right: 16rem; }
1597/*
1598 NEGATIVE MARGINS
1599
1600 Base:
1601 n = negative
1602
1603 Modifiers:
1604 a = all
1605 t = top
1606 r = right
1607 b = bottom
1608 l = left
1609
1610 1 = 1st step in spacing scale
1611 2 = 2nd step in spacing scale
1612 3 = 3rd step in spacing scale
1613 4 = 4th step in spacing scale
1614 5 = 5th step in spacing scale
1615 6 = 6th step in spacing scale
1616 7 = 7th step in spacing scale
1617
1618 Media Query Extensions:
1619 -ns = not-small
1620 -m = medium
1621 -l = large
1622
1623*/
1624.na1 { margin: -0.25rem; }
1625.na2 { margin: -0.5rem; }
1626.na3 { margin: -1rem; }
1627.na4 { margin: -2rem; }
1628.na5 { margin: -4rem; }
1629.na6 { margin: -8rem; }
1630.na7 { margin: -16rem; }
1631.nl1 { margin-left: -0.25rem; }
1632.nl2 { margin-left: -0.5rem; }
1633.nl3 { margin-left: -1rem; }
1634.nl4 { margin-left: -2rem; }
1635.nl5 { margin-left: -4rem; }
1636.nl6 { margin-left: -8rem; }
1637.nl7 { margin-left: -16rem; }
1638.nr1 { margin-right: -0.25rem; }
1639.nr2 { margin-right: -0.5rem; }
1640.nr3 { margin-right: -1rem; }
1641.nr4 { margin-right: -2rem; }
1642.nr5 { margin-right: -4rem; }
1643.nr6 { margin-right: -8rem; }
1644.nr7 { margin-right: -16rem; }
1645.nb1 { margin-bottom: -0.25rem; }
1646.nb2 { margin-bottom: -0.5rem; }
1647.nb3 { margin-bottom: -1rem; }
1648.nb4 { margin-bottom: -2rem; }
1649.nb5 { margin-bottom: -4rem; }
1650.nb6 { margin-bottom: -8rem; }
1651.nb7 { margin-bottom: -16rem; }
1652.nt1 { margin-top: -0.25rem; }
1653.nt2 { margin-top: -0.5rem; }
1654.nt3 { margin-top: -1rem; }
1655.nt4 { margin-top: -2rem; }
1656.nt5 { margin-top: -4rem; }
1657.nt6 { margin-top: -8rem; }
1658.nt7 { margin-top: -16rem; }
1659/*
1660
1661 TABLES
1662 Docs: http://tachyons.io/docs/elements/tables/
1663
1664*/
1665.collapse { border-collapse: collapse; border-spacing: 0; }
1666.striped--light-silver:nth-child(odd) { background-color: #aaa; }
1667.striped--moon-gray:nth-child(odd) { background-color: #ccc; }
1668.striped--light-gray:nth-child(odd) { background-color: #d0d7dc; }
1669.striped--near-white:nth-child(odd) { background-color: #dbe1e5; }
1670.stripe-light:nth-child(odd) { background-color: rgba( 255, 255, 255, .1 ); }
1671.stripe-dark:nth-child(odd) { background-color: rgba( 0, 0, 0, .1 ); }
1672/*
1673
1674 TEXT DECORATION
1675 Docs: http://tachyons.io/docs/typography/text-decoration/
1676
1677
1678 Media Query Extensions:
1679 -ns = not-small
1680 -m = medium
1681 -l = large
1682
1683*/
1684.strike { text-decoration: line-through; }
1685.underline { text-decoration: underline; }
1686.no-underline { text-decoration: none; }
1687/*
1688
1689 TEXT ALIGN
1690 Docs: http://tachyons.io/docs/typography/text-align/
1691
1692 Base
1693 t = text-align
1694
1695 Modifiers
1696 l = left
1697 r = right
1698 c = center
1699 j = justify
1700
1701 Media Query Extensions:
1702 -ns = not-small
1703 -m = medium
1704 -l = large
1705
1706*/
1707.tl { text-align: left; }
1708.tr { text-align: right; }
1709.tc { text-align: center; }
1710.tj { text-align: justify; }
1711/*
1712
1713 TEXT TRANSFORM
1714 Docs: http://tachyons.io/docs/typography/text-transform/
1715
1716 Base:
1717 tt = text-transform
1718
1719 Modifiers
1720 c = capitalize
1721 l = lowercase
1722 u = uppercase
1723 n = none
1724
1725 Media Query Extensions:
1726 -ns = not-small
1727 -m = medium
1728 -l = large
1729
1730*/
1731.ttc { text-transform: capitalize; }
1732.ttl { text-transform: lowercase; }
1733.ttu { text-transform: uppercase; }
1734.ttn { text-transform: none; }
1735/*
1736
1737 TYPE SCALE
1738 Docs: http://tachyons.io/docs/typography/scale/
1739
1740 Base:
1741 f = font-size
1742
1743 Modifiers
1744 1 = 1st step in size scale
1745 2 = 2nd step in size scale
1746 3 = 3rd step in size scale
1747 4 = 4th step in size scale
1748 5 = 5th step in size scale
1749 6 = 6th step in size scale
1750
1751 Media Query Extensions:
1752 -ns = not-small
1753 -m = medium
1754 -l = large
1755*/
1756/*
1757 * For Hero/Marketing Titles
1758 *
1759 * These generally are too large for mobile
1760 * so be careful using them on smaller screens.
1761 * */
1762.f-6 { font-size: 6rem; }
1763.f-headline { font-size: 6rem; }
1764.f-5 { font-size: 5rem; }
1765.f-subheadline { font-size: 5rem; }
1766/* Type Scale */
1767.f1 { font-size: 3rem; }
1768.f2 { font-size: 2.25rem; }
1769.f3 { font-size: 1.5rem; }
1770.f4 { font-size: 1.25rem; }
1771.f5 { font-size: 1rem; }
1772.f6 { font-size: .875rem; }
1773.f7 { font-size: .75rem; }
1774/*
1775
1776 TYPOGRAPHY
1777 http://tachyons.io/docs/typography/measure/
1778
1779 Media Query Extensions:
1780 -ns = not-small
1781 -m = medium
1782 -l = large
1783
1784*/
1785/* Measure is limited to ~66 characters */
1786.measure { max-width: 30em; }
1787/* Measure is limited to ~80 characters */
1788.measure-wide { max-width: 34em; }
1789/* Measure is limited to ~45 characters */
1790.measure-narrow { max-width: 20em; }
1791/* Book paragraph style - paragraphs are indented with no vertical spacing. */
1792.indent { text-indent: 1em; margin-top: 0; margin-bottom: 0; }
1793.small-caps { font-variant: small-caps; }
1794/* Combine this class with a width to truncate text (or just leave as is to truncate at width of containing element. */
1795.truncate { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
1796/*
1797
1798 UTILITIES
1799
1800 Media Query Extensions:
1801 -ns = not-small
1802 -m = medium
1803 -l = large
1804
1805*/
1806/* Equivalent to .overflow-y-scroll */
1807.overflow-container { overflow-y: scroll; }
1808.center { margin-right: auto; margin-left: auto; }
1809.mr-auto { margin-right: auto; }
1810.ml-auto { margin-left: auto; }
1811.v-scroll { overflow-y: auto; -webkit-overflow-scrolling: touch; }
1812.h-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
1813/* custom */
1814.noselect { -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Safari */ /* Konqueror HTML */ -moz-user-select: none; /* Firefox */ -ms-user-select: none; /* Internet Explorer/Edge */ user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */ }
1815/*
1816
1817 VISIBILITY
1818
1819 Media Query Extensions:
1820 -ns = not-small
1821 -m = medium
1822 -l = large
1823
1824*/
1825/*
1826 Text that is hidden but accessible
1827 Ref: http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
1828*/
1829.clip { position: fixed !important; _position: absolute !important; clip: rect( 1px 1px 1px 1px ); /* IE6, IE7 */ clip: rect( 1px, 1px, 1px, 1px ); }
1830/*
1831
1832 WHITE SPACE
1833
1834 Media Query Extensions:
1835 -ns = not-small
1836 -m = medium
1837 -l = large
1838
1839*/
1840.ws-normal { white-space: normal; }
1841.nowrap { white-space: nowrap; }
1842.pre { white-space: pre; }
1843/*
1844
1845 VERTICAL ALIGN
1846
1847 Media Query Extensions:
1848 -ns = not-small
1849 -m = medium
1850 -l = large
1851
1852*/
1853.v-base { vertical-align: baseline; }
1854.v-mid { vertical-align: middle; }
1855.v-top { vertical-align: top; }
1856.v-btm { vertical-align: bottom; }
1857/*
1858
1859 HOVER EFFECTS
1860 Docs: http://tachyons.io/docs/themes/hovers/
1861
1862 - Dim
1863 - Glow
1864 - Hide Child
1865 - Underline text
1866 - Grow
1867 - Pointer
1868 - Shadow
1869
1870*/
1871/*
1872
1873 Dim element on hover by adding the dim class.
1874
1875*/
1876.dim { opacity: 1; transition: opacity .15s ease-in; }
1877.dim:hover, .dim:focus { opacity: .5; transition: opacity .15s ease-in; }
1878.dim:active { opacity: .8; transition: opacity .15s ease-out; }
1879/*
1880
1881 Animate opacity to 100% on hover by adding the glow class.
1882
1883*/
1884.glow { transition: opacity .15s ease-in; }
1885.glow:hover, .glow:focus { opacity: 1; transition: opacity .15s ease-in; }
1886/*
1887
1888 Hide child & reveal on hover:
1889
1890 Put the hide-child class on a parent element and any nested element with the
1891 child class will be hidden and displayed on hover or focus.
1892
1893 <div class="hide-child">
1894 <div class="child"> Hidden until hover or focus </div>
1895 <div class="child"> Hidden until hover or focus </div>
1896 <div class="child"> Hidden until hover or focus </div>
1897 <div class="child"> Hidden until hover or focus </div>
1898 </div>
1899*/
1900.hide-child .child { opacity: 0; transition: opacity .15s ease-in; }
1901.hide-child:hover .child, .hide-child:focus .child, .hide-child:active .child { opacity: 1; transition: opacity .15s ease-in; }
1902.underline-hover:hover, .underline-hover:focus { text-decoration: underline; }
1903/* Can combine this with overflow-hidden to make background images grow on hover
1904 * even if you are using background-size: cover */
1905.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; }
1906.grow:hover, .grow:focus { -webkit-transform: scale( 1.05 ); transform: scale( 1.05 ); }
1907.grow:active { -webkit-transform: scale( .90 ); transform: scale( .90 ); }
1908.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; }
1909.grow-large:hover, .grow-large:focus { -webkit-transform: scale( 1.2 ); transform: scale( 1.2 ); }
1910.grow-large:active { -webkit-transform: scale( .95 ); transform: scale( .95 ); }
1911/* Add pointer on hover */
1912.pointer:hover { cursor: pointer; }
1913/*
1914 Add shadow on hover.
1915
1916 Performant box-shadow animation pattern from
1917 http://tobiasahlin.com/blog/how-to-animate-box-shadow/
1918*/
1919.shadow-hover { cursor: pointer; position: relative; transition: all .5s cubic-bezier( .165, .84, .44, 1 ); }
1920.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 ); }
1921.shadow-hover:hover::after, .shadow-hover:focus::after { opacity: 1; }
1922/* Combine with classes in skins and skins-pseudo for
1923 * many different transition possibilities. */
1924.bg-animate, .bg-animate:hover, .bg-animate:focus { transition: background-color .15s ease-in-out; }
1925/*
1926
1927 Z-INDEX
1928
1929 Base
1930 z = z-index
1931
1932 Modifiers
1933 -0 = literal value 0
1934 -1 = literal value 1
1935 -2 = literal value 2
1936 -3 = literal value 3
1937 -4 = literal value 4
1938 -5 = literal value 5
1939 -999 = literal value 999
1940 -9999 = literal value 9999
1941
1942 -max = largest accepted z-index value as integer
1943
1944 -inherit = string value inherit
1945 -initial = string value initial
1946 -unset = string value unset
1947
1948 MDN: https://developer.mozilla.org/en/docs/Web/CSS/z-index
1949 Spec: http://www.w3.org/TR/CSS2/zindex.html
1950 Articles:
1951 https://philipwalton.com/articles/what-no-one-told-you-about-z-index/
1952
1953 Tips on extending:
1954 There might be a time worth using negative z-index values.
1955 Or if you are using tachyons with another project, you might need to
1956 adjust these values to suit your needs.
1957
1958*/
1959.z-0 { z-index: 0; }
1960.z-1 { z-index: 1; }
1961.z-2 { z-index: 2; }
1962.z-3 { z-index: 3; }
1963.z-4 { z-index: 4; }
1964.z-5 { z-index: 5; }
1965.z-999 { z-index: 999; }
1966.z-9999 { z-index: 9999; }
1967.z-max { z-index: 2147483647; }
1968.z-inherit { z-index: inherit; }
1969.z-initial { z-index: initial; }
1970.z-unset { z-index: unset; }
1971/*
1972
1973 NESTED
1974 Tachyons module for styling nested elements
1975 that are generated by a cms.
1976
1977*/
1978.nested-copy-line-height p { line-height: 1.5; }
1979.nested-copy-line-height ul { line-height: 1.5; }
1980.nested-copy-line-height ol { line-height: 1.5; }
1981.nested-headline-line-height h1 { line-height: 1.25; }
1982.nested-headline-line-height h2 { line-height: 1.25; }
1983.nested-headline-line-height h3 { line-height: 1.25; }
1984.nested-headline-line-height h4 { line-height: 1.25; }
1985.nested-headline-line-height h5 { line-height: 1.25; }
1986.nested-headline-line-height h6 { line-height: 1.25; }
1987.nested-list-reset ul, .nested-list-reset ol { padding-left: 0; margin-left: 0; list-style-type: none; }
1988.nested-copy-indent p+p { text-indent: .1em; margin-top: 0; margin-bottom: 0; }
1989.nested-copy-seperator p+p { margin-top: 1.5em; }
1990.nested-img img { width: 100%; max-width: 100%; display: block; }
1991.nested-links a { color: #1f566f; transition: color .15s ease-in; }
1992.nested-links a:hover { color: #53d6e4; transition: color .15s ease-in; }
1993.nested-links a:focus { color: #53d6e4; transition: color .15s ease-in; }
1994/*
1995
1996 STYLES
1997
1998 Add custom styles here.
1999
2000*/
2001/* Variables */
2002/* Importing here will allow you to override any variables in the modules */
2003/*
2004
2005 VARIABLES
2006
2007*/
2008:root {/* overwrites! */ }
2009/* Debugging */
2010/*
2011
2012 DEBUG CHILDREN
2013 Docs: http://tachyons.io/docs/debug/
2014
2015 Just add the debug class to any element to see outlines on its
2016 children.
2017
2018*/
2019.debug * { outline: 1px solid gold; }
2020.debug-white * { outline: 1px solid white; }
2021.debug-black * { outline: 1px solid black; }
2022/*
2023
2024 DEBUG GRID
2025 http://tachyons.io/docs/debug-grid/
2026
2027 Can be useful for debugging layout issues
2028 or helping to make sure things line up perfectly.
2029 Just tack one of these classes onto a parent element.
2030
2031*/
2032.debug-grid { background: transparent url( data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MTRDOTY4N0U2N0VFMTFFNjg2MzZDQjkwNkQ4MjgwMEIiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MTRDOTY4N0Q2N0VFMTFFNjg2MzZDQjkwNkQ4MjgwMEIiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo3NjcyQkQ3NjY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo3NjcyQkQ3NzY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PsBS+GMAAAAjSURBVHjaYvz//z8DLsD4gcGXiYEAGBIKGBne//fFpwAgwAB98AaF2pjlUQAAAABJRU5ErkJggg== ) repeat top left; }
2033.debug-grid-16 { background: transparent url( data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6ODYyRjhERDU2N0YyMTFFNjg2MzZDQjkwNkQ4MjgwMEIiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6ODYyRjhERDQ2N0YyMTFFNjg2MzZDQjkwNkQ4MjgwMEIiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo3NjcyQkQ3QTY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo3NjcyQkQ3QjY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PvCS01IAAABMSURBVHjaYmR4/5+BFPBfAMFm/MBgx8RAGWCn1AAmSg34Q6kBDKMGMDCwICeMIemF/5QawEipAWwUhwEjMDvbAWlWkvVBwu8vQIABAEwBCph8U6c0AAAAAElFTkSuQmCC ) repeat top left; }
2034.debug-grid-8-solid { background: white url( data:image/jpeg;base64,/9j/4QAYRXhpZgAASUkqAAgAAAAAAAAAAAAAAP/sABFEdWNreQABAAQAAAAAAAD/4QMxaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLwA8P3hwYWNrZXQgYmVnaW49Iu+7vyIgaWQ9Ilc1TTBNcENlaGlIenJlU3pOVGN6a2M5ZCI/PiA8eDp4bXBtZXRhIHhtbG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJBZG9iZSBYTVAgQ29yZSA1LjYtYzExMSA3OS4xNTgzMjUsIDIwMTUvMDkvMTAtMDE6MTA6MjAgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDQyAyMDE1IChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkIxMjI0OTczNjdCMzExRTZCMkJDRTI0MDgxMDAyMTcxIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkIxMjI0OTc0NjdCMzExRTZCMkJDRTI0MDgxMDAyMTcxIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QjEyMjQ5NzE2N0IzMTFFNkIyQkNFMjQwODEwMDIxNzEiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QjEyMjQ5NzI2N0IzMTFFNkIyQkNFMjQwODEwMDIxNzEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7/7gAOQWRvYmUAZMAAAAAB/9sAhAAbGhopHSlBJiZBQi8vL0JHPz4+P0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHAR0pKTQmND8oKD9HPzU/R0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0dHR0f/wAARCAAIAAgDASIAAhEBAxEB/8QAWQABAQAAAAAAAAAAAAAAAAAAAAYBAQEAAAAAAAAAAAAAAAAAAAIEEAEBAAMBAAAAAAAAAAAAAAABADECA0ERAAEDBQAAAAAAAAAAAAAAAAARITFBUWESIv/aAAwDAQACEQMRAD8AoOnTV1QTD7JJshP3vSM3P//Z ) repeat top left; }
2035.debug-grid-16-solid { background: white url( data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAACQkWg2AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NzY3MkJEN0U2N0M1MTFFNkIyQkNFMjQwODEwMDIxNzEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NzY3MkJEN0Y2N0M1MTFFNkIyQkNFMjQwODEwMDIxNzEiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo3NjcyQkQ3QzY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo3NjcyQkQ3RDY3QzUxMUU2QjJCQ0UyNDA4MTAwMjE3MSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pve6J3kAAAAzSURBVHjaYvz//z8D0UDsMwMjSRoYP5Gq4SPNbRjVMEQ1fCRDg+in/6+J1AJUxsgAEGAA31BAJMS0GYEAAAAASUVORK5CYII= ) repeat top left; }
2036/* Uncomment out the line below to help debug layout issues */
2037/* @import './_debug'; */
2038.hidden { visibility: hidden; }
2039.sticky { position: -webkit-sticky; position: sticky; }
2040.transitionHeight { transition: height 500ms; }
2041.h-0 { height: 0; }
2042.transition { transition: opacity 300ms, -webkit-transform 300ms; transition: transform 300ms, opacity 300ms; transition: transform 300ms, opacity 300ms, -webkit-transform 300ms; }
2043.translate-y { -webkit-transform: translateY( 20px ); transform: translateY( 20px ); }
2044.form-hide { height: 0; overflow: hidden; }
2045.checkbox:focus + i { outline: rgb( 59, 153, 252 ) auto 5px !important; }
2046.shadow-inset { box-shadow: inset 1px 1px 1px rgba( 0, 0, 0, .5 ); }
2047.not-allowed { cursor: not-allowed; }
2048button { -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
2049button:disabled { cursor: not-allowed; }
2050button:active { outline: none; box-shadow: inset 1px 1px 1px rgba( 0, 0, 0, .5 ); }
2051.prevent-overscroll { -ms-scroll-chaining: none; overscroll-behavior: contain; }
2052@-webkit-keyframes spin {
2053 from { -webkit-transform: rotate( 0deg ); transform: rotate( 0deg ); }
2054 to { -webkit-transform: rotate( 360deg ); transform: rotate( 360deg ); }
2055}
2056@keyframes spin {
2057 from { -webkit-transform: rotate( 0deg ); transform: rotate( 0deg ); }
2058 to { -webkit-transform: rotate( 360deg ); transform: rotate( 360deg ); }
2059}
2060.spin-animation { -webkit-animation-name: spin; animation-name: spin; -webkit-animation-duration: 2000ms; animation-duration: 2000ms; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: linear; animation-timing-function: linear; }
2061@-webkit-keyframes bob {
2062 0% { -webkit-transform: translateY( -4px ); transform: translateY( -4px ); }
2063 50% { -webkit-transform: translateY( 4px ); transform: translateY( 4px ); }
2064 100% { -webkit-transform: translateY( -4px ); transform: translateY( -4px ); }
2065}
2066@keyframes bob {
2067 0% { -webkit-transform: translateY( -4px ); transform: translateY( -4px ); }
2068 50% { -webkit-transform: translateY( 4px ); transform: translateY( 4px ); }
2069 100% { -webkit-transform: translateY( -4px ); transform: translateY( -4px ); }
2070}
2071.bob-animation { -webkit-animation-name: bob; animation-name: bob; -webkit-animation-duration: 2s; animation-duration: 2s; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; }
2072@media screen and (min-width: 30em) {
2073 .aspect-ratio-ns { height: 0; position: relative; }
2074 .aspect-ratio--16x9-ns { padding-bottom: 56.25%; }
2075 .aspect-ratio--9x16-ns { padding-bottom: 177.77%; }
2076 .aspect-ratio--4x3-ns { padding-bottom: 75%; }
2077 .aspect-ratio--3x4-ns { padding-bottom: 133.33%; }
2078 .aspect-ratio--6x4-ns { padding-bottom: 66.6%; }
2079 .aspect-ratio--4x6-ns { padding-bottom: 150%; }
2080 .aspect-ratio--8x5-ns { padding-bottom: 62.5%; }
2081 .aspect-ratio--5x8-ns { padding-bottom: 160%; }
2082 .aspect-ratio--7x5-ns { padding-bottom: 71.42%; }
2083 .aspect-ratio--5x7-ns { padding-bottom: 140%; }
2084 .aspect-ratio--1x1-ns { padding-bottom: 100%; }
2085 .aspect-ratio--object-ns { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 100; }
2086 .cover-ns { background-size: cover !important; }
2087 .contain-ns { background-size: contain !important; }
2088 .bg-center-ns { background-repeat: no-repeat; background-position: center center; }
2089 .bg-top-ns { background-repeat: no-repeat; background-position: top center; }
2090 .bg-right-ns { background-repeat: no-repeat; background-position: center right; }
2091 .bg-bottom-ns { background-repeat: no-repeat; background-position: bottom center; }
2092 .bg-left-ns { background-repeat: no-repeat; background-position: center left; }
2093 .outline-ns { outline: 1px solid; }
2094 .outline-transparent-ns { outline: 1px solid transparent; }
2095 .outline-0-ns { outline: 0; }
2096 .ba-ns { border-style: solid; border-width: 1px; }
2097 .bt-ns { border-top-style: solid; border-top-width: 1px; }
2098 .br-ns { border-right-style: solid; border-right-width: 1px; }
2099 .bb-ns { border-bottom-style: solid; border-bottom-width: 1px; }
2100 .bl-ns { border-left-style: solid; border-left-width: 1px; }
2101 .bn-ns { border-style: none; border-width: 0; }
2102 .br0-ns { border-radius: 0; }
2103 .br1-ns { border-radius: .125rem; }
2104 .br2-ns { border-radius: .25rem; }
2105 .br3-ns { border-radius: .5rem; }
2106 .br4-ns { border-radius: 1rem; }
2107 .br-100-ns { border-radius: 100%; }
2108 .br-pill-ns { border-radius: 9999px; }
2109 .br--bottom-ns { border-top-left-radius: 0; border-top-right-radius: 0; }
2110 .br--top-ns { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
2111 .br--right-ns { border-top-left-radius: 0; border-bottom-left-radius: 0; }
2112 .br--left-ns { border-top-right-radius: 0; border-bottom-right-radius: 0; }
2113 .b--dotted-ns { border-style: dotted; }
2114 .b--dashed-ns { border-style: dashed; }
2115 .b--solid-ns { border-style: solid; }
2116 .b--none-ns { border-style: none; }
2117 .bw0-ns { border-width: 0; }
2118 .bw1-ns { border-width: .125rem; }
2119 .bw2-ns { border-width: .25rem; }
2120 .bw3-ns { border-width: .5rem; }
2121 .bw4-ns { border-width: 1rem; }
2122 .bw5-ns { border-width: 2rem; }
2123 .bt-0-ns { border-top-width: 0; }
2124 .br-0-ns { border-right-width: 0; }
2125 .bb-0-ns { border-bottom-width: 0; }
2126 .bl-0-ns { border-left-width: 0; }
2127 .shadow-1-ns { box-shadow: 0 1px 1px rgba( 0, 0, 0, .2 ); }
2128 .shadow-2-ns { box-shadow: 1px 1px 4px rgba( 0, 0, 0, .7 ); }
2129 .shadow-3-ns { box-shadow: inset 1px 1px 5px rgba( 0, 0, 0, .7 ); }
2130 .shadow-4-ns { box-shadow: 2px 2px 8px 0 rgba( 0, 0, 0, .2 ); }
2131 .shadow-5-ns { box-shadow: 4px 4px 8px 0 rgba( 0, 0, 0, .2 ); }
2132 .top-0-ns { top: 0; }
2133 .left-0-ns { left: 0; }
2134 .right-0-ns { right: 0; }
2135 .bottom-0-ns { bottom: 0; }
2136 .top-1-ns { top: 1rem; }
2137 .left-1-ns { left: 1rem; }
2138 .right-1-ns { right: 1rem; }
2139 .bottom-1-ns { bottom: 1rem; }
2140 .top-2-ns { top: 2rem; }
2141 .left-2-ns { left: 2rem; }
2142 .right-2-ns { right: 2rem; }
2143 .bottom-2-ns { bottom: 2rem; }
2144 .top--1-ns { top: -1rem; }
2145 .right--1-ns { right: -1rem; }
2146 .bottom--1-ns { bottom: -1rem; }
2147 .left--1-ns { left: -1rem; }
2148 .top--2-ns { top: -2rem; }
2149 .right--2-ns { right: -2rem; }
2150 .bottom--2-ns { bottom: -2rem; }
2151 .left--2-ns { left: -2rem; }
2152 .absolute--fill-ns { top: 0; right: 0; bottom: 0; left: 0; }
2153 .cl-ns { clear: left; }
2154 .cr-ns { clear: right; }
2155 .cb-ns { clear: both; }
2156 .cn-ns { clear: none; }
2157 .dn-ns { display: none; }
2158 .di-ns { display: inline; }
2159 .db-ns { display: block; }
2160 .dib-ns { display: inline-block; }
2161 .flex-ns { display: flex; }
2162 .inline-flex-ns { display: inline-flex; }
2163 .flex-auto-ns { flex: 1 1 auto; min-width: 0; /* 1 */ min-height: 0; /* 1 */ }
2164 .flex-none-ns { flex: none; }
2165 .flex-column-ns { flex-direction: column; }
2166 .flex-row-ns { flex-direction: row; }
2167 .flex-wrap-ns { flex-wrap: wrap; }
2168 .flex-nowrap-ns { flex-wrap: nowrap; }
2169 .flex-wrap-reverse-ns { flex-wrap: wrap-reverse; }
2170 .flex-column-reverse-ns { flex-direction: column-reverse; }
2171 .flex-row-reverse-ns { flex-direction: row-reverse; }
2172 .items-start-ns { align-items: flex-start; }
2173 .items-end-ns { align-items: flex-end; }
2174 .items-center-ns { align-items: center; }
2175 .items-baseline-ns { align-items: baseline; }
2176 .items-stretch-ns { align-items: stretch; }
2177 .self-start-ns { align-self: flex-start; }
2178 .self-end-ns { align-self: flex-end; }
2179 .self-center-ns { align-self: center; }
2180 .self-baseline-ns { align-self: baseline; }
2181 .self-stretch-ns { align-self: stretch; }
2182 .justify-start-ns { justify-content: flex-start; }
2183 .justify-end-ns { justify-content: flex-end; }
2184 .justify-center-ns { justify-content: center; }
2185 .justify-between-ns { justify-content: space-between; }
2186 .justify-around-ns { justify-content: space-around; }
2187 .content-start-ns { align-content: flex-start; }
2188 .content-end-ns { align-content: flex-end; }
2189 .content-center-ns { align-content: center; }
2190 .content-between-ns { align-content: space-between; }
2191 .content-around-ns { align-content: space-around; }
2192 .content-stretch-ns { align-content: stretch; }
2193 .order-0-ns { order: 0; }
2194 .order-1-ns { order: 1; }
2195 .order-2-ns { order: 2; }
2196 .order-3-ns { order: 3; }
2197 .order-4-ns { order: 4; }
2198 .order-5-ns { order: 5; }
2199 .order-6-ns { order: 6; }
2200 .order-7-ns { order: 7; }
2201 .order-8-ns { order: 8; }
2202 .order-last-ns { order: 99999; }
2203 .flex-grow-0-ns { flex-grow: 0; }
2204 .flex-grow-1-ns { flex-grow: 1; }
2205 .flex-shrink-0-ns { flex-shrink: 0; }
2206 .flex-shrink-1-ns { flex-shrink: 1; }
2207 .fl-ns { float: left; _display: inline; }
2208 .fr-ns { float: right; _display: inline; }
2209 .fn-ns { float: none; }
2210 .i-ns { font-style: italic; }
2211 .fs-normal-ns { font-style: normal; }
2212 .normal-ns { font-weight: normal; }
2213 .b-ns { font-weight: bold; }
2214 .fw1-ns { font-weight: 100; }
2215 .fw2-ns { font-weight: 200; }
2216 .fw3-ns { font-weight: 300; }
2217 .fw4-ns { font-weight: 400; }
2218 .fw5-ns { font-weight: 500; }
2219 .fw6-ns { font-weight: 600; }
2220 .fw7-ns { font-weight: 700; }
2221 .fw8-ns { font-weight: 800; }
2222 .fw9-ns { font-weight: 900; }
2223 .h1-ns { height: 1rem; }
2224 .h2-ns { height: 2rem; }
2225 .h3-ns { height: 4rem; }
2226 .h4-ns { height: 8rem; }
2227 .h5-ns { height: 16rem; }
2228 .h-25-ns { height: 25%; }
2229 .h-50-ns { height: 50%; }
2230 .h-75-ns { height: 75%; }
2231 .h-100-ns { height: 100%; }
2232 .min-h-100-ns { min-height: 100%; }
2233 .vh-25-ns { height: 25vh; }
2234 .vh-50-ns { height: 50vh; }
2235 .vh-75-ns { height: 75vh; }
2236 .vh-100-ns { height: 100vh; }
2237 .min-vh-100-ns { min-height: 100vh; }
2238 .h-auto-ns { height: auto; }
2239 .h-inherit-ns { height: inherit; }
2240 .tracked-ns { letter-spacing: .1em; }
2241 .tracked-tight-ns { letter-spacing: -0.05em; }
2242 .tracked-mega-ns { letter-spacing: .25em; }
2243 .lh-solid-ns { line-height: 1; }
2244 .lh-title-ns { line-height: 1.25; }
2245 .lh-copy-ns { line-height: 1.5; }
2246 .mw-100-ns { max-width: 100%; }
2247 .mw1-ns { max-width: 1rem; }
2248 .mw2-ns { max-width: 2rem; }
2249 .mw3-ns { max-width: 4rem; }
2250 .mw4-ns { max-width: 8rem; }
2251 .mw5-ns { max-width: 16rem; }
2252 .mw6-ns { max-width: 32rem; }
2253 .mw7-ns { max-width: 48rem; }
2254 .mw8-ns { max-width: 64rem; }
2255 .mw9-ns { max-width: 96rem; }
2256 .mw-none-ns { max-width: none; }
2257 .w1-ns { width: 1rem; }
2258 .w2-ns { width: 2rem; }
2259 .w3-ns { width: 4rem; }
2260 .w4-ns { width: 8rem; }
2261 .w5-ns { width: 16rem; }
2262 .w-10-ns { width: 10%; }
2263 .w-20-ns { width: 20%; }
2264 .w-25-ns { width: 25%; }
2265 .w-30-ns { width: 30%; }
2266 .w-33-ns { width: 33%; }
2267 .w-34-ns { width: 34%; }
2268 .w-40-ns { width: 40%; }
2269 .w-50-ns { width: 50%; }
2270 .w-60-ns { width: 60%; }
2271 .w-70-ns { width: 70%; }
2272 .w-75-ns { width: 75%; }
2273 .w-80-ns { width: 80%; }
2274 .w-90-ns { width: 90%; }
2275 .w-100-ns { width: 100%; }
2276 .w-third-ns { width: 33.33333%; }
2277 .w-two-thirds-ns { width: 66.66667%; }
2278 .w-auto-ns { width: auto; }
2279 .overflow-visible-ns { overflow: visible; }
2280 .overflow-hidden-ns { overflow: hidden; }
2281 .overflow-scroll-ns { overflow: scroll; }
2282 .overflow-auto-ns { overflow: auto; }
2283 .overflow-x-visible-ns { overflow-x: visible; }
2284 .overflow-x-hidden-ns { overflow-x: hidden; }
2285 .overflow-x-scroll-ns { overflow-x: scroll; }
2286 .overflow-x-auto-ns { overflow-x: auto; }
2287 .overflow-y-visible-ns { overflow-y: visible; }
2288 .overflow-y-hidden-ns { overflow-y: hidden; }
2289 .overflow-y-scroll-ns { overflow-y: scroll; }
2290 .overflow-y-auto-ns { overflow-y: auto; }
2291 .static-ns { position: static; }
2292 .relative-ns { position: relative; }
2293 .absolute-ns { position: absolute; }
2294 .fixed-ns { position: fixed; }
2295 .rotate-45-ns { -webkit-transform: rotate( 45deg ); transform: rotate( 45deg ); }
2296 .rotate-90-ns { -webkit-transform: rotate( 90deg ); transform: rotate( 90deg ); }
2297 .rotate-135-ns { -webkit-transform: rotate( 135deg ); transform: rotate( 135deg ); }
2298 .rotate-180-ns { -webkit-transform: rotate( 180deg ); transform: rotate( 180deg ); }
2299 .rotate-225-ns { -webkit-transform: rotate( 225deg ); transform: rotate( 225deg ); }
2300 .rotate-270-ns { -webkit-transform: rotate( 270deg ); transform: rotate( 270deg ); }
2301 .rotate-315-ns { -webkit-transform: rotate( 315deg ); transform: rotate( 315deg ); }
2302 .pa0-ns { padding: 0; }
2303 .pa1-ns { padding: .25rem; }
2304 .pa2-ns { padding: .5rem; }
2305 .pa3-ns { padding: 1rem; }
2306 .pa4-ns { padding: 2rem; }
2307 .pa5-ns { padding: 4rem; }
2308 .pa6-ns { padding: 8rem; }
2309 .pa7-ns { padding: 16rem; }
2310 .pl0-ns { padding-left: 0; }
2311 .pl1-ns { padding-left: .25rem; }
2312 .pl2-ns { padding-left: .5rem; }
2313 .pl3-ns { padding-left: 1rem; }
2314 .pl4-ns { padding-left: 2rem; }
2315 .pl5-ns { padding-left: 4rem; }
2316 .pl6-ns { padding-left: 8rem; }
2317 .pl7-ns { padding-left: 16rem; }
2318 .pr0-ns { padding-right: 0; }
2319 .pr1-ns { padding-right: .25rem; }
2320 .pr2-ns { padding-right: .5rem; }
2321 .pr3-ns { padding-right: 1rem; }
2322 .pr4-ns { padding-right: 2rem; }
2323 .pr5-ns { padding-right: 4rem; }
2324 .pr6-ns { padding-right: 8rem; }
2325 .pr7-ns { padding-right: 16rem; }
2326 .pb0-ns { padding-bottom: 0; }
2327 .pb1-ns { padding-bottom: .25rem; }
2328 .pb2-ns { padding-bottom: .5rem; }
2329 .pb3-ns { padding-bottom: 1rem; }
2330 .pb4-ns { padding-bottom: 2rem; }
2331 .pb5-ns { padding-bottom: 4rem; }
2332 .pb6-ns { padding-bottom: 8rem; }
2333 .pb7-ns { padding-bottom: 16rem; }
2334 .pt0-ns { padding-top: 0; }
2335 .pt1-ns { padding-top: .25rem; }
2336 .pt2-ns { padding-top: .5rem; }
2337 .pt3-ns { padding-top: 1rem; }
2338 .pt4-ns { padding-top: 2rem; }
2339 .pt5-ns { padding-top: 4rem; }
2340 .pt6-ns { padding-top: 8rem; }
2341 .pt7-ns { padding-top: 16rem; }
2342 .pv0-ns { padding-top: 0; padding-bottom: 0; }
2343 .pv1-ns { padding-top: .25rem; padding-bottom: .25rem; }
2344 .pv2-ns { padding-top: .5rem; padding-bottom: .5rem; }
2345 .pv3-ns { padding-top: 1rem; padding-bottom: 1rem; }
2346 .pv4-ns { padding-top: 2rem; padding-bottom: 2rem; }
2347 .pv5-ns { padding-top: 4rem; padding-bottom: 4rem; }
2348 .pv6-ns { padding-top: 8rem; padding-bottom: 8rem; }
2349 .pv7-ns { padding-top: 16rem; padding-bottom: 16rem; }
2350 .ph0-ns { padding-left: 0; padding-right: 0; }
2351 .ph1-ns { padding-left: .25rem; padding-right: .25rem; }
2352 .ph2-ns { padding-left: .5rem; padding-right: .5rem; }
2353 .ph3-ns { padding-left: 1rem; padding-right: 1rem; }
2354 .ph4-ns { padding-left: 2rem; padding-right: 2rem; }
2355 .ph5-ns { padding-left: 4rem; padding-right: 4rem; }
2356 .ph6-ns { padding-left: 8rem; padding-right: 8rem; }
2357 .ph7-ns { padding-left: 16rem; padding-right: 16rem; }
2358 .ma0-ns { margin: 0; }
2359 .ma1-ns { margin: .25rem; }
2360 .ma2-ns { margin: .5rem; }
2361 .ma3-ns { margin: 1rem; }
2362 .ma4-ns { margin: 2rem; }
2363 .ma5-ns { margin: 4rem; }
2364 .ma6-ns { margin: 8rem; }
2365 .ma7-ns { margin: 16rem; }
2366 .ml0-ns { margin-left: 0; }
2367 .ml1-ns { margin-left: .25rem; }
2368 .ml2-ns { margin-left: .5rem; }
2369 .ml3-ns { margin-left: 1rem; }
2370 .ml4-ns { margin-left: 2rem; }
2371 .ml5-ns { margin-left: 4rem; }
2372 .ml6-ns { margin-left: 8rem; }
2373 .ml7-ns { margin-left: 16rem; }
2374 .mr0-ns { margin-right: 0; }
2375 .mr1-ns { margin-right: .25rem; }
2376 .mr2-ns { margin-right: .5rem; }
2377 .mr3-ns { margin-right: 1rem; }
2378 .mr4-ns { margin-right: 2rem; }
2379 .mr5-ns { margin-right: 4rem; }
2380 .mr6-ns { margin-right: 8rem; }
2381 .mr7-ns { margin-right: 16rem; }
2382 .mb0-ns { margin-bottom: 0; }
2383 .mb1-ns { margin-bottom: .25rem; }
2384 .mb2-ns { margin-bottom: .5rem; }
2385 .mb3-ns { margin-bottom: 1rem; }
2386 .mb4-ns { margin-bottom: 2rem; }
2387 .mb5-ns { margin-bottom: 4rem; }
2388 .mb6-ns { margin-bottom: 8rem; }
2389 .mb7-ns { margin-bottom: 16rem; }
2390 .mt0-ns { margin-top: 0; }
2391 .mt1-ns { margin-top: .25rem; }
2392 .mt2-ns { margin-top: .5rem; }
2393 .mt3-ns { margin-top: 1rem; }
2394 .mt4-ns { margin-top: 2rem; }
2395 .mt5-ns { margin-top: 4rem; }
2396 .mt6-ns { margin-top: 8rem; }
2397 .mt7-ns { margin-top: 16rem; }
2398 .mv0-ns { margin-top: 0; margin-bottom: 0; }
2399 .mv1-ns { margin-top: .25rem; margin-bottom: .25rem; }
2400 .mv2-ns { margin-top: .5rem; margin-bottom: .5rem; }
2401 .mv3-ns { margin-top: 1rem; margin-bottom: 1rem; }
2402 .mv4-ns { margin-top: 2rem; margin-bottom: 2rem; }
2403 .mv5-ns { margin-top: 4rem; margin-bottom: 4rem; }
2404 .mv6-ns { margin-top: 8rem; margin-bottom: 8rem; }
2405 .mv7-ns { margin-top: 16rem; margin-bottom: 16rem; }
2406 .mh0-ns { margin-left: 0; margin-right: 0; }
2407 .mh1-ns { margin-left: .25rem; margin-right: .25rem; }
2408 .mh2-ns { margin-left: .5rem; margin-right: .5rem; }
2409 .mh3-ns { margin-left: 1rem; margin-right: 1rem; }
2410 .mh4-ns { margin-left: 2rem; margin-right: 2rem; }
2411 .mh5-ns { margin-left: 4rem; margin-right: 4rem; }
2412 .mh6-ns { margin-left: 8rem; margin-right: 8rem; }
2413 .mh7-ns { margin-left: 16rem; margin-right: 16rem; }
2414 .na1-ns { margin: -0.25rem; }
2415 .na2-ns { margin: -0.5rem; }
2416 .na3-ns { margin: -1rem; }
2417 .na4-ns { margin: -2rem; }
2418 .na5-ns { margin: -4rem; }
2419 .na6-ns { margin: -8rem; }
2420 .na7-ns { margin: -16rem; }
2421 .nl1-ns { margin-left: -0.25rem; }
2422 .nl2-ns { margin-left: -0.5rem; }
2423 .nl3-ns { margin-left: -1rem; }
2424 .nl4-ns { margin-left: -2rem; }
2425 .nl5-ns { margin-left: -4rem; }
2426 .nl6-ns { margin-left: -8rem; }
2427 .nl7-ns { margin-left: -16rem; }
2428 .nr1-ns { margin-right: -0.25rem; }
2429 .nr2-ns { margin-right: -0.5rem; }
2430 .nr3-ns { margin-right: -1rem; }
2431 .nr4-ns { margin-right: -2rem; }
2432 .nr5-ns { margin-right: -4rem; }
2433 .nr6-ns { margin-right: -8rem; }
2434 .nr7-ns { margin-right: -16rem; }
2435 .nb1-ns { margin-bottom: -0.25rem; }
2436 .nb2-ns { margin-bottom: -0.5rem; }
2437 .nb3-ns { margin-bottom: -1rem; }
2438 .nb4-ns { margin-bottom: -2rem; }
2439 .nb5-ns { margin-bottom: -4rem; }
2440 .nb6-ns { margin-bottom: -8rem; }
2441 .nb7-ns { margin-bottom: -16rem; }
2442 .nt1-ns { margin-top: -0.25rem; }
2443 .nt2-ns { margin-top: -0.5rem; }
2444 .nt3-ns { margin-top: -1rem; }
2445 .nt4-ns { margin-top: -2rem; }
2446 .nt5-ns { margin-top: -4rem; }
2447 .nt6-ns { margin-top: -8rem; }
2448 .nt7-ns { margin-top: -16rem; }
2449 .strike-ns { text-decoration: line-through; }
2450 .underline-ns { text-decoration: underline; }
2451 .no-underline-ns { text-decoration: none; }
2452 .tl-ns { text-align: left; }
2453 .tr-ns { text-align: right; }
2454 .tc-ns { text-align: center; }
2455 .tj-ns { text-align: justify; }
2456 .ttc-ns { text-transform: capitalize; }
2457 .ttl-ns { text-transform: lowercase; }
2458 .ttu-ns { text-transform: uppercase; }
2459 .ttn-ns { text-transform: none; }
2460 .f-6-ns { font-size: 6rem; }
2461 .f-headline-ns { font-size: 6rem; }
2462 .f-5-ns { font-size: 5rem; }
2463 .f-subheadline-ns { font-size: 5rem; }
2464 .f1-ns { font-size: 3rem; }
2465 .f2-ns { font-size: 2.25rem; }
2466 .f3-ns { font-size: 1.5rem; }
2467 .f4-ns { font-size: 1.25rem; }
2468 .f5-ns { font-size: 1rem; }
2469 .f6-ns { font-size: .875rem; }
2470 .f7-ns { font-size: .75rem; }
2471 .measure-ns { max-width: 30em; }
2472 .measure-wide-ns { max-width: 34em; }
2473 .measure-narrow-ns { max-width: 20em; }
2474 .indent-ns { text-indent: 1em; margin-top: 0; margin-bottom: 0; }
2475 .small-caps-ns { font-variant: small-caps; }
2476 .truncate-ns { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
2477 .center-ns { margin-right: auto; margin-left: auto; }
2478 .mr-auto-ns { margin-right: auto; }
2479 .ml-auto-ns { margin-left: auto; }
2480 .clip-ns { position: fixed !important; _position: absolute !important; clip: rect( 1px 1px 1px 1px ); /* IE6, IE7 */ clip: rect( 1px, 1px, 1px, 1px ); }
2481 .ws-normal-ns { white-space: normal; }
2482 .nowrap-ns { white-space: nowrap; }
2483 .pre-ns { white-space: pre; }
2484 .v-base-ns { vertical-align: baseline; }
2485 .v-mid-ns { vertical-align: middle; }
2486 .v-top-ns { vertical-align: top; }
2487 .v-btm-ns { vertical-align: bottom; }
2488}
2489@media screen and (min-width: 30em) and (max-width: 60em) {
2490 .aspect-ratio-m { height: 0; position: relative; }
2491 .aspect-ratio--16x9-m { padding-bottom: 56.25%; }
2492 .aspect-ratio--9x16-m { padding-bottom: 177.77%; }
2493 .aspect-ratio--4x3-m { padding-bottom: 75%; }
2494 .aspect-ratio--3x4-m { padding-bottom: 133.33%; }
2495 .aspect-ratio--6x4-m { padding-bottom: 66.6%; }
2496 .aspect-ratio--4x6-m { padding-bottom: 150%; }
2497 .aspect-ratio--8x5-m { padding-bottom: 62.5%; }
2498 .aspect-ratio--5x8-m { padding-bottom: 160%; }
2499 .aspect-ratio--7x5-m { padding-bottom: 71.42%; }
2500 .aspect-ratio--5x7-m { padding-bottom: 140%; }
2501 .aspect-ratio--1x1-m { padding-bottom: 100%; }
2502 .aspect-ratio--object-m { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 100; }
2503 .cover-m { background-size: cover !important; }
2504 .contain-m { background-size: contain !important; }
2505 .bg-center-m { background-repeat: no-repeat; background-position: center center; }
2506 .bg-top-m { background-repeat: no-repeat; background-position: top center; }
2507 .bg-right-m { background-repeat: no-repeat; background-position: center right; }
2508 .bg-bottom-m { background-repeat: no-repeat; background-position: bottom center; }
2509 .bg-left-m { background-repeat: no-repeat; background-position: center left; }
2510 .outline-m { outline: 1px solid; }
2511 .outline-transparent-m { outline: 1px solid transparent; }
2512 .outline-0-m { outline: 0; }
2513 .ba-m { border-style: solid; border-width: 1px; }
2514 .bt-m { border-top-style: solid; border-top-width: 1px; }
2515 .br-m { border-right-style: solid; border-right-width: 1px; }
2516 .bb-m { border-bottom-style: solid; border-bottom-width: 1px; }
2517 .bl-m { border-left-style: solid; border-left-width: 1px; }
2518 .bn-m { border-style: none; border-width: 0; }
2519 .br0-m { border-radius: 0; }
2520 .br1-m { border-radius: .125rem; }
2521 .br2-m { border-radius: .25rem; }
2522 .br3-m { border-radius: .5rem; }
2523 .br4-m { border-radius: 1rem; }
2524 .br-100-m { border-radius: 100%; }
2525 .br-pill-m { border-radius: 9999px; }
2526 .br--bottom-m { border-top-left-radius: 0; border-top-right-radius: 0; }
2527 .br--top-m { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
2528 .br--right-m { border-top-left-radius: 0; border-bottom-left-radius: 0; }
2529 .br--left-m { border-top-right-radius: 0; border-bottom-right-radius: 0; }
2530 .b--dotted-m { border-style: dotted; }
2531 .b--dashed-m { border-style: dashed; }
2532 .b--solid-m { border-style: solid; }
2533 .b--none-m { border-style: none; }
2534 .bw0-m { border-width: 0; }
2535 .bw1-m { border-width: .125rem; }
2536 .bw2-m { border-width: .25rem; }
2537 .bw3-m { border-width: .5rem; }
2538 .bw4-m { border-width: 1rem; }
2539 .bw5-m { border-width: 2rem; }
2540 .bt-0-m { border-top-width: 0; }
2541 .br-0-m { border-right-width: 0; }
2542 .bb-0-m { border-bottom-width: 0; }
2543 .bl-0-m { border-left-width: 0; }
2544 .shadow-1-m { box-shadow: 0 1px 1px rgba( 0, 0, 0, .2 ); }
2545 .shadow-2-m { box-shadow: 1px 1px 4px rgba( 0, 0, 0, .7 ); }
2546 .shadow-3-m { box-shadow: inset 1px 1px 5px rgba( 0, 0, 0, .7 ); }
2547 .shadow-4-m { box-shadow: 2px 2px 8px 0 rgba( 0, 0, 0, .2 ); }
2548 .shadow-5-m { box-shadow: 4px 4px 8px 0 rgba( 0, 0, 0, .2 ); }
2549 .top-0-m { top: 0; }
2550 .left-0-m { left: 0; }
2551 .right-0-m { right: 0; }
2552 .bottom-0-m { bottom: 0; }
2553 .top-1-m { top: 1rem; }
2554 .left-1-m { left: 1rem; }
2555 .right-1-m { right: 1rem; }
2556 .bottom-1-m { bottom: 1rem; }
2557 .top-2-m { top: 2rem; }
2558 .left-2-m { left: 2rem; }
2559 .right-2-m { right: 2rem; }
2560 .bottom-2-m { bottom: 2rem; }
2561 .top--1-m { top: -1rem; }
2562 .right--1-m { right: -1rem; }
2563 .bottom--1-m { bottom: -1rem; }
2564 .left--1-m { left: -1rem; }
2565 .top--2-m { top: -2rem; }
2566 .right--2-m { right: -2rem; }
2567 .bottom--2-m { bottom: -2rem; }
2568 .left--2-m { left: -2rem; }
2569 .absolute--fill-m { top: 0; right: 0; bottom: 0; left: 0; }
2570 .cl-m { clear: left; }
2571 .cr-m { clear: right; }
2572 .cb-m { clear: both; }
2573 .cn-m { clear: none; }
2574 .dn-m { display: none; }
2575 .di-m { display: inline; }
2576 .db-m { display: block; }
2577 .dib-m { display: inline-block; }
2578 .flex-m { display: flex; }
2579 .inline-flex-m { display: inline-flex; }
2580 .flex-auto-m { flex: 1 1 auto; min-width: 0; /* 1 */ min-height: 0; /* 1 */ }
2581 .flex-none-m { flex: none; }
2582 .flex-column-m { flex-direction: column; }
2583 .flex-row-m { flex-direction: row; }
2584 .flex-wrap-m { flex-wrap: wrap; }
2585 .flex-nowrap-m { flex-wrap: nowrap; }
2586 .flex-wrap-reverse-m { flex-wrap: wrap-reverse; }
2587 .flex-column-reverse-m { flex-direction: column-reverse; }
2588 .flex-row-reverse-m { flex-direction: row-reverse; }
2589 .items-start-m { align-items: flex-start; }
2590 .items-end-m { align-items: flex-end; }
2591 .items-center-m { align-items: center; }
2592 .items-baseline-m { align-items: baseline; }
2593 .items-stretch-m { align-items: stretch; }
2594 .self-start-m { align-self: flex-start; }
2595 .self-end-m { align-self: flex-end; }
2596 .self-center-m { align-self: center; }
2597 .self-baseline-m { align-self: baseline; }
2598 .self-stretch-m { align-self: stretch; }
2599 .justify-start-m { justify-content: flex-start; }
2600 .justify-end-m { justify-content: flex-end; }
2601 .justify-center-m { justify-content: center; }
2602 .justify-between-m { justify-content: space-between; }
2603 .justify-around-m { justify-content: space-around; }
2604 .content-start-m { align-content: flex-start; }
2605 .content-end-m { align-content: flex-end; }
2606 .content-center-m { align-content: center; }
2607 .content-between-m { align-content: space-between; }
2608 .content-around-m { align-content: space-around; }
2609 .content-stretch-m { align-content: stretch; }
2610 .order-0-m { order: 0; }
2611 .order-1-m { order: 1; }
2612 .order-2-m { order: 2; }
2613 .order-3-m { order: 3; }
2614 .order-4-m { order: 4; }
2615 .order-5-m { order: 5; }
2616 .order-6-m { order: 6; }
2617 .order-7-m { order: 7; }
2618 .order-8-m { order: 8; }
2619 .order-last-m { order: 99999; }
2620 .flex-grow-0-m { flex-grow: 0; }
2621 .flex-grow-1-m { flex-grow: 1; }
2622 .flex-shrink-0-m { flex-shrink: 0; }
2623 .flex-shrink-1-m { flex-shrink: 1; }
2624 .fl-m { float: left; _display: inline; }
2625 .fr-m { float: right; _display: inline; }
2626 .fn-m { float: none; }
2627 .i-m { font-style: italic; }
2628 .fs-normal-m { font-style: normal; }
2629 .normal-m { font-weight: normal; }
2630 .b-m { font-weight: bold; }
2631 .fw1-m { font-weight: 100; }
2632 .fw2-m { font-weight: 200; }
2633 .fw3-m { font-weight: 300; }
2634 .fw4-m { font-weight: 400; }
2635 .fw5-m { font-weight: 500; }
2636 .fw6-m { font-weight: 600; }
2637 .fw7-m { font-weight: 700; }
2638 .fw8-m { font-weight: 800; }
2639 .fw9-m { font-weight: 900; }
2640 .h1-m { height: 1rem; }
2641 .h2-m { height: 2rem; }
2642 .h3-m { height: 4rem; }
2643 .h4-m { height: 8rem; }
2644 .h5-m { height: 16rem; }
2645 .h-25-m { height: 25%; }
2646 .h-50-m { height: 50%; }
2647 .h-75-m { height: 75%; }
2648 .h-100-m { height: 100%; }
2649 .min-h-100-m { min-height: 100%; }
2650 .vh-25-m { height: 25vh; }
2651 .vh-50-m { height: 50vh; }
2652 .vh-75-m { height: 75vh; }
2653 .vh-100-m { height: 100vh; }
2654 .min-vh-100-m { min-height: 100vh; }
2655 .h-auto-m { height: auto; }
2656 .h-inherit-m { height: inherit; }
2657 .tracked-m { letter-spacing: .1em; }
2658 .tracked-tight-m { letter-spacing: -0.05em; }
2659 .tracked-mega-m { letter-spacing: .25em; }
2660 .lh-solid-m { line-height: 1; }
2661 .lh-title-m { line-height: 1.25; }
2662 .lh-copy-m { line-height: 1.5; }
2663 .mw-100-m { max-width: 100%; }
2664 .mw1-m { max-width: 1rem; }
2665 .mw2-m { max-width: 2rem; }
2666 .mw3-m { max-width: 4rem; }
2667 .mw4-m { max-width: 8rem; }
2668 .mw5-m { max-width: 16rem; }
2669 .mw6-m { max-width: 32rem; }
2670 .mw7-m { max-width: 48rem; }
2671 .mw8-m { max-width: 64rem; }
2672 .mw9-m { max-width: 96rem; }
2673 .mw-none-m { max-width: none; }
2674 .w1-m { width: 1rem; }
2675 .w2-m { width: 2rem; }
2676 .w3-m { width: 4rem; }
2677 .w4-m { width: 8rem; }
2678 .w5-m { width: 16rem; }
2679 .w-10-m { width: 10%; }
2680 .w-20-m { width: 20%; }
2681 .w-25-m { width: 25%; }
2682 .w-30-m { width: 30%; }
2683 .w-33-m { width: 33%; }
2684 .w-34-m { width: 34%; }
2685 .w-40-m { width: 40%; }
2686 .w-50-m { width: 50%; }
2687 .w-60-m { width: 60%; }
2688 .w-70-m { width: 70%; }
2689 .w-75-m { width: 75%; }
2690 .w-80-m { width: 80%; }
2691 .w-90-m { width: 90%; }
2692 .w-100-m { width: 100%; }
2693 .w-third-m { width: 33.33333%; }
2694 .w-two-thirds-m { width: 66.66667%; }
2695 .w-auto-m { width: auto; }
2696 .overflow-visible-m { overflow: visible; }
2697 .overflow-hidden-m { overflow: hidden; }
2698 .overflow-scroll-m { overflow: scroll; }
2699 .overflow-auto-m { overflow: auto; }
2700 .overflow-x-visible-m { overflow-x: visible; }
2701 .overflow-x-hidden-m { overflow-x: hidden; }
2702 .overflow-x-scroll-m { overflow-x: scroll; }
2703 .overflow-x-auto-m { overflow-x: auto; }
2704 .overflow-y-visible-m { overflow-y: visible; }
2705 .overflow-y-hidden-m { overflow-y: hidden; }
2706 .overflow-y-scroll-m { overflow-y: scroll; }
2707 .overflow-y-auto-m { overflow-y: auto; }
2708 .static-m { position: static; }
2709 .relative-m { position: relative; }
2710 .absolute-m { position: absolute; }
2711 .fixed-m { position: fixed; }
2712 .rotate-45-m { -webkit-transform: rotate( 45deg ); transform: rotate( 45deg ); }
2713 .rotate-90-m { -webkit-transform: rotate( 90deg ); transform: rotate( 90deg ); }
2714 .rotate-135-m { -webkit-transform: rotate( 135deg ); transform: rotate( 135deg ); }
2715 .rotate-180-m { -webkit-transform: rotate( 180deg ); transform: rotate( 180deg ); }
2716 .rotate-225-m { -webkit-transform: rotate( 225deg ); transform: rotate( 225deg ); }
2717 .rotate-270-m { -webkit-transform: rotate( 270deg ); transform: rotate( 270deg ); }
2718 .rotate-315-m { -webkit-transform: rotate( 315deg ); transform: rotate( 315deg ); }
2719 .pa0-m { padding: 0; }
2720 .pa1-m { padding: .25rem; }
2721 .pa2-m { padding: .5rem; }
2722 .pa3-m { padding: 1rem; }
2723 .pa4-m { padding: 2rem; }
2724 .pa5-m { padding: 4rem; }
2725 .pa6-m { padding: 8rem; }
2726 .pa7-m { padding: 16rem; }
2727 .pl0-m { padding-left: 0; }
2728 .pl1-m { padding-left: .25rem; }
2729 .pl2-m { padding-left: .5rem; }
2730 .pl3-m { padding-left: 1rem; }
2731 .pl4-m { padding-left: 2rem; }
2732 .pl5-m { padding-left: 4rem; }
2733 .pl6-m { padding-left: 8rem; }
2734 .pl7-m { padding-left: 16rem; }
2735 .pr0-m { padding-right: 0; }
2736 .pr1-m { padding-right: .25rem; }
2737 .pr2-m { padding-right: .5rem; }
2738 .pr3-m { padding-right: 1rem; }
2739 .pr4-m { padding-right: 2rem; }
2740 .pr5-m { padding-right: 4rem; }
2741 .pr6-m { padding-right: 8rem; }
2742 .pr7-m { padding-right: 16rem; }
2743 .pb0-m { padding-bottom: 0; }
2744 .pb1-m { padding-bottom: .25rem; }
2745 .pb2-m { padding-bottom: .5rem; }
2746 .pb3-m { padding-bottom: 1rem; }
2747 .pb4-m { padding-bottom: 2rem; }
2748 .pb5-m { padding-bottom: 4rem; }
2749 .pb6-m { padding-bottom: 8rem; }
2750 .pb7-m { padding-bottom: 16rem; }
2751 .pt0-m { padding-top: 0; }
2752 .pt1-m { padding-top: .25rem; }
2753 .pt2-m { padding-top: .5rem; }
2754 .pt3-m { padding-top: 1rem; }
2755 .pt4-m { padding-top: 2rem; }
2756 .pt5-m { padding-top: 4rem; }
2757 .pt6-m { padding-top: 8rem; }
2758 .pt7-m { padding-top: 16rem; }
2759 .pv0-m { padding-top: 0; padding-bottom: 0; }
2760 .pv1-m { padding-top: .25rem; padding-bottom: .25rem; }
2761 .pv2-m { padding-top: .5rem; padding-bottom: .5rem; }
2762 .pv3-m { padding-top: 1rem; padding-bottom: 1rem; }
2763 .pv4-m { padding-top: 2rem; padding-bottom: 2rem; }
2764 .pv5-m { padding-top: 4rem; padding-bottom: 4rem; }
2765 .pv6-m { padding-top: 8rem; padding-bottom: 8rem; }
2766 .pv7-m { padding-top: 16rem; padding-bottom: 16rem; }
2767 .ph0-m { padding-left: 0; padding-right: 0; }
2768 .ph1-m { padding-left: .25rem; padding-right: .25rem; }
2769 .ph2-m { padding-left: .5rem; padding-right: .5rem; }
2770 .ph3-m { padding-left: 1rem; padding-right: 1rem; }
2771 .ph4-m { padding-left: 2rem; padding-right: 2rem; }
2772 .ph5-m { padding-left: 4rem; padding-right: 4rem; }
2773 .ph6-m { padding-left: 8rem; padding-right: 8rem; }
2774 .ph7-m { padding-left: 16rem; padding-right: 16rem; }
2775 .ma0-m { margin: 0; }
2776 .ma1-m { margin: .25rem; }
2777 .ma2-m { margin: .5rem; }
2778 .ma3-m { margin: 1rem; }
2779 .ma4-m { margin: 2rem; }
2780 .ma5-m { margin: 4rem; }
2781 .ma6-m { margin: 8rem; }
2782 .ma7-m { margin: 16rem; }
2783 .ml0-m { margin-left: 0; }
2784 .ml1-m { margin-left: .25rem; }
2785 .ml2-m { margin-left: .5rem; }
2786 .ml3-m { margin-left: 1rem; }
2787 .ml4-m { margin-left: 2rem; }
2788 .ml5-m { margin-left: 4rem; }
2789 .ml6-m { margin-left: 8rem; }
2790 .ml7-m { margin-left: 16rem; }
2791 .mr0-m { margin-right: 0; }
2792 .mr1-m { margin-right: .25rem; }
2793 .mr2-m { margin-right: .5rem; }
2794 .mr3-m { margin-right: 1rem; }
2795 .mr4-m { margin-right: 2rem; }
2796 .mr5-m { margin-right: 4rem; }
2797 .mr6-m { margin-right: 8rem; }
2798 .mr7-m { margin-right: 16rem; }
2799 .mb0-m { margin-bottom: 0; }
2800 .mb1-m { margin-bottom: .25rem; }
2801 .mb2-m { margin-bottom: .5rem; }
2802 .mb3-m { margin-bottom: 1rem; }
2803 .mb4-m { margin-bottom: 2rem; }
2804 .mb5-m { margin-bottom: 4rem; }
2805 .mb6-m { margin-bottom: 8rem; }
2806 .mb7-m { margin-bottom: 16rem; }
2807 .mt0-m { margin-top: 0; }
2808 .mt1-m { margin-top: .25rem; }
2809 .mt2-m { margin-top: .5rem; }
2810 .mt3-m { margin-top: 1rem; }
2811 .mt4-m { margin-top: 2rem; }
2812 .mt5-m { margin-top: 4rem; }
2813 .mt6-m { margin-top: 8rem; }
2814 .mt7-m { margin-top: 16rem; }
2815 .mv0-m { margin-top: 0; margin-bottom: 0; }
2816 .mv1-m { margin-top: .25rem; margin-bottom: .25rem; }
2817 .mv2-m { margin-top: .5rem; margin-bottom: .5rem; }
2818 .mv3-m { margin-top: 1rem; margin-bottom: 1rem; }
2819 .mv4-m { margin-top: 2rem; margin-bottom: 2rem; }
2820 .mv5-m { margin-top: 4rem; margin-bottom: 4rem; }
2821 .mv6-m { margin-top: 8rem; margin-bottom: 8rem; }
2822 .mv7-m { margin-top: 16rem; margin-bottom: 16rem; }
2823 .mh0-m { margin-left: 0; margin-right: 0; }
2824 .mh1-m { margin-left: .25rem; margin-right: .25rem; }
2825 .mh2-m { margin-left: .5rem; margin-right: .5rem; }
2826 .mh3-m { margin-left: 1rem; margin-right: 1rem; }
2827 .mh4-m { margin-left: 2rem; margin-right: 2rem; }
2828 .mh5-m { margin-left: 4rem; margin-right: 4rem; }
2829 .mh6-m { margin-left: 8rem; margin-right: 8rem; }
2830 .mh7-m { margin-left: 16rem; margin-right: 16rem; }
2831 .na1-m { margin: -0.25rem; }
2832 .na2-m { margin: -0.5rem; }
2833 .na3-m { margin: -1rem; }
2834 .na4-m { margin: -2rem; }
2835 .na5-m { margin: -4rem; }
2836 .na6-m { margin: -8rem; }
2837 .na7-m { margin: -16rem; }
2838 .nl1-m { margin-left: -0.25rem; }
2839 .nl2-m { margin-left: -0.5rem; }
2840 .nl3-m { margin-left: -1rem; }
2841 .nl4-m { margin-left: -2rem; }
2842 .nl5-m { margin-left: -4rem; }
2843 .nl6-m { margin-left: -8rem; }
2844 .nl7-m { margin-left: -16rem; }
2845 .nr1-m { margin-right: -0.25rem; }
2846 .nr2-m { margin-right: -0.5rem; }
2847 .nr3-m { margin-right: -1rem; }
2848 .nr4-m { margin-right: -2rem; }
2849 .nr5-m { margin-right: -4rem; }
2850 .nr6-m { margin-right: -8rem; }
2851 .nr7-m { margin-right: -16rem; }
2852 .nb1-m { margin-bottom: -0.25rem; }
2853 .nb2-m { margin-bottom: -0.5rem; }
2854 .nb3-m { margin-bottom: -1rem; }
2855 .nb4-m { margin-bottom: -2rem; }
2856 .nb5-m { margin-bottom: -4rem; }
2857 .nb6-m { margin-bottom: -8rem; }
2858 .nb7-m { margin-bottom: -16rem; }
2859 .nt1-m { margin-top: -0.25rem; }
2860 .nt2-m { margin-top: -0.5rem; }
2861 .nt3-m { margin-top: -1rem; }
2862 .nt4-m { margin-top: -2rem; }
2863 .nt5-m { margin-top: -4rem; }
2864 .nt6-m { margin-top: -8rem; }
2865 .nt7-m { margin-top: -16rem; }
2866 .strike-m { text-decoration: line-through; }
2867 .underline-m { text-decoration: underline; }
2868 .no-underline-m { text-decoration: none; }
2869 .tl-m { text-align: left; }
2870 .tr-m { text-align: right; }
2871 .tc-m { text-align: center; }
2872 .tj-m { text-align: justify; }
2873 .ttc-m { text-transform: capitalize; }
2874 .ttl-m { text-transform: lowercase; }
2875 .ttu-m { text-transform: uppercase; }
2876 .ttn-m { text-transform: none; }
2877 .f-6-m { font-size: 6rem; }
2878 .f-headline-m { font-size: 6rem; }
2879 .f-5-m { font-size: 5rem; }
2880 .f-subheadline-m { font-size: 5rem; }
2881 .f1-m { font-size: 3rem; }
2882 .f2-m { font-size: 2.25rem; }
2883 .f3-m { font-size: 1.5rem; }
2884 .f4-m { font-size: 1.25rem; }
2885 .f5-m { font-size: 1rem; }
2886 .f6-m { font-size: .875rem; }
2887 .f7-m { font-size: .75rem; }
2888 .measure-m { max-width: 30em; }
2889 .measure-wide-m { max-width: 34em; }
2890 .measure-narrow-m { max-width: 20em; }
2891 .indent-m { text-indent: 1em; margin-top: 0; margin-bottom: 0; }
2892 .small-caps-m { font-variant: small-caps; }
2893 .truncate-m { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
2894 .center-m { margin-right: auto; margin-left: auto; }
2895 .mr-auto-m { margin-right: auto; }
2896 .ml-auto-m { margin-left: auto; }
2897 .clip-m { position: fixed !important; _position: absolute !important; clip: rect( 1px 1px 1px 1px ); /* IE6, IE7 */ clip: rect( 1px, 1px, 1px, 1px ); }
2898 .ws-normal-m { white-space: normal; }
2899 .nowrap-m { white-space: nowrap; }
2900 .pre-m { white-space: pre; }
2901 .v-base-m { vertical-align: baseline; }
2902 .v-mid-m { vertical-align: middle; }
2903 .v-top-m { vertical-align: top; }
2904 .v-btm-m { vertical-align: bottom; }
2905}
2906@media screen and (min-width: 60em) {
2907 .aspect-ratio-l { height: 0; position: relative; }
2908 .aspect-ratio--16x9-l { padding-bottom: 56.25%; }
2909 .aspect-ratio--9x16-l { padding-bottom: 177.77%; }
2910 .aspect-ratio--4x3-l { padding-bottom: 75%; }
2911 .aspect-ratio--3x4-l { padding-bottom: 133.33%; }
2912 .aspect-ratio--6x4-l { padding-bottom: 66.6%; }
2913 .aspect-ratio--4x6-l { padding-bottom: 150%; }
2914 .aspect-ratio--8x5-l { padding-bottom: 62.5%; }
2915 .aspect-ratio--5x8-l { padding-bottom: 160%; }
2916 .aspect-ratio--7x5-l { padding-bottom: 71.42%; }
2917 .aspect-ratio--5x7-l { padding-bottom: 140%; }
2918 .aspect-ratio--1x1-l { padding-bottom: 100%; }
2919 .aspect-ratio--object-l { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 100; }
2920 .cover-l { background-size: cover !important; }
2921 .contain-l { background-size: contain !important; }
2922 .bg-center-l { background-repeat: no-repeat; background-position: center center; }
2923 .bg-top-l { background-repeat: no-repeat; background-position: top center; }
2924 .bg-right-l { background-repeat: no-repeat; background-position: center right; }
2925 .bg-bottom-l { background-repeat: no-repeat; background-position: bottom center; }
2926 .bg-left-l { background-repeat: no-repeat; background-position: center left; }
2927 .outline-l { outline: 1px solid; }
2928 .outline-transparent-l { outline: 1px solid transparent; }
2929 .outline-0-l { outline: 0; }
2930 .ba-l { border-style: solid; border-width: 1px; }
2931 .bt-l { border-top-style: solid; border-top-width: 1px; }
2932 .br-l { border-right-style: solid; border-right-width: 1px; }
2933 .bb-l { border-bottom-style: solid; border-bottom-width: 1px; }
2934 .bl-l { border-left-style: solid; border-left-width: 1px; }
2935 .bn-l { border-style: none; border-width: 0; }
2936 .br0-l { border-radius: 0; }
2937 .br1-l { border-radius: .125rem; }
2938 .br2-l { border-radius: .25rem; }
2939 .br3-l { border-radius: .5rem; }
2940 .br4-l { border-radius: 1rem; }
2941 .br-100-l { border-radius: 100%; }
2942 .br-pill-l { border-radius: 9999px; }
2943 .br--bottom-l { border-top-left-radius: 0; border-top-right-radius: 0; }
2944 .br--top-l { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
2945 .br--right-l { border-top-left-radius: 0; border-bottom-left-radius: 0; }
2946 .br--left-l { border-top-right-radius: 0; border-bottom-right-radius: 0; }
2947 .b--dotted-l { border-style: dotted; }
2948 .b--dashed-l { border-style: dashed; }
2949 .b--solid-l { border-style: solid; }
2950 .b--none-l { border-style: none; }
2951 .bw0-l { border-width: 0; }
2952 .bw1-l { border-width: .125rem; }
2953 .bw2-l { border-width: .25rem; }
2954 .bw3-l { border-width: .5rem; }
2955 .bw4-l { border-width: 1rem; }
2956 .bw5-l { border-width: 2rem; }
2957 .bt-0-l { border-top-width: 0; }
2958 .br-0-l { border-right-width: 0; }
2959 .bb-0-l { border-bottom-width: 0; }
2960 .bl-0-l { border-left-width: 0; }
2961 .shadow-1-l { box-shadow: 0 1px 1px rgba( 0, 0, 0, .2 ); }
2962 .shadow-2-l { box-shadow: 1px 1px 4px rgba( 0, 0, 0, .7 ); }
2963 .shadow-3-l { box-shadow: inset 1px 1px 5px rgba( 0, 0, 0, .7 ); }
2964 .shadow-4-l { box-shadow: 2px 2px 8px 0 rgba( 0, 0, 0, .2 ); }
2965 .shadow-5-l { box-shadow: 4px 4px 8px 0 rgba( 0, 0, 0, .2 ); }
2966 .top-0-l { top: 0; }
2967 .left-0-l { left: 0; }
2968 .right-0-l { right: 0; }
2969 .bottom-0-l { bottom: 0; }
2970 .top-1-l { top: 1rem; }
2971 .left-1-l { left: 1rem; }
2972 .right-1-l { right: 1rem; }
2973 .bottom-1-l { bottom: 1rem; }
2974 .top-2-l { top: 2rem; }
2975 .left-2-l { left: 2rem; }
2976 .right-2-l { right: 2rem; }
2977 .bottom-2-l { bottom: 2rem; }
2978 .top--1-l { top: -1rem; }
2979 .right--1-l { right: -1rem; }
2980 .bottom--1-l { bottom: -1rem; }
2981 .left--1-l { left: -1rem; }
2982 .top--2-l { top: -2rem; }
2983 .right--2-l { right: -2rem; }
2984 .bottom--2-l { bottom: -2rem; }
2985 .left--2-l { left: -2rem; }
2986 .absolute--fill-l { top: 0; right: 0; bottom: 0; left: 0; }
2987 .cl-l { clear: left; }
2988 .cr-l { clear: right; }
2989 .cb-l { clear: both; }
2990 .cn-l { clear: none; }
2991 .dn-l { display: none; }
2992 .di-l { display: inline; }
2993 .db-l { display: block; }
2994 .dib-l { display: inline-block; }
2995 .flex-l { display: flex; }
2996 .inline-flex-l { display: inline-flex; }
2997 .flex-auto-l { flex: 1 1 auto; min-width: 0; /* 1 */ min-height: 0; /* 1 */ }
2998 .flex-none-l { flex: none; }
2999 .flex-column-l { flex-direction: column; }
3000 .flex-row-l { flex-direction: row; }
3001 .flex-wrap-l { flex-wrap: wrap; }
3002 .flex-nowrap-l { flex-wrap: nowrap; }
3003 .flex-wrap-reverse-l { flex-wrap: wrap-reverse; }
3004 .flex-column-reverse-l { flex-direction: column-reverse; }
3005 .flex-row-reverse-l { flex-direction: row-reverse; }
3006 .items-start-l { align-items: flex-start; }
3007 .items-end-l { align-items: flex-end; }
3008 .items-center-l { align-items: center; }
3009 .items-baseline-l { align-items: baseline; }
3010 .items-stretch-l { align-items: stretch; }
3011 .self-start-l { align-self: flex-start; }
3012 .self-end-l { align-self: flex-end; }
3013 .self-center-l { align-self: center; }
3014 .self-baseline-l { align-self: baseline; }
3015 .self-stretch-l { align-self: stretch; }
3016 .justify-start-l { justify-content: flex-start; }
3017 .justify-end-l { justify-content: flex-end; }
3018 .justify-center-l { justify-content: center; }
3019 .justify-between-l { justify-content: space-between; }
3020 .justify-around-l { justify-content: space-around; }
3021 .content-start-l { align-content: flex-start; }
3022 .content-end-l { align-content: flex-end; }
3023 .content-center-l { align-content: center; }
3024 .content-between-l { align-content: space-between; }
3025 .content-around-l { align-content: space-around; }
3026 .content-stretch-l { align-content: stretch; }
3027 .order-0-l { order: 0; }
3028 .order-1-l { order: 1; }
3029 .order-2-l { order: 2; }
3030 .order-3-l { order: 3; }
3031 .order-4-l { order: 4; }
3032 .order-5-l { order: 5; }
3033 .order-6-l { order: 6; }
3034 .order-7-l { order: 7; }
3035 .order-8-l { order: 8; }
3036 .order-last-l { order: 99999; }
3037 .flex-grow-0-l { flex-grow: 0; }
3038 .flex-grow-1-l { flex-grow: 1; }
3039 .flex-shrink-0-l { flex-shrink: 0; }
3040 .flex-shrink-1-l { flex-shrink: 1; }
3041 .fl-l { float: left; _display: inline; }
3042 .fr-l { float: right; _display: inline; }
3043 .fn-l { float: none; }
3044 .i-l { font-style: italic; }
3045 .fs-normal-l { font-style: normal; }
3046 .normal-l { font-weight: normal; }
3047 .b-l { font-weight: bold; }
3048 .fw1-l { font-weight: 100; }
3049 .fw2-l { font-weight: 200; }
3050 .fw3-l { font-weight: 300; }
3051 .fw4-l { font-weight: 400; }
3052 .fw5-l { font-weight: 500; }
3053 .fw6-l { font-weight: 600; }
3054 .fw7-l { font-weight: 700; }
3055 .fw8-l { font-weight: 800; }
3056 .fw9-l { font-weight: 900; }
3057 .h1-l { height: 1rem; }
3058 .h2-l { height: 2rem; }
3059 .h3-l { height: 4rem; }
3060 .h4-l { height: 8rem; }
3061 .h5-l { height: 16rem; }
3062 .h-25-l { height: 25%; }
3063 .h-50-l { height: 50%; }
3064 .h-75-l { height: 75%; }
3065 .h-100-l { height: 100%; }
3066 .min-h-100-l { min-height: 100%; }
3067 .vh-25-l { height: 25vh; }
3068 .vh-50-l { height: 50vh; }
3069 .vh-75-l { height: 75vh; }
3070 .vh-100-l { height: 100vh; }
3071 .min-vh-100-l { min-height: 100vh; }
3072 .h-auto-l { height: auto; }
3073 .h-inherit-l { height: inherit; }
3074 .tracked-l { letter-spacing: .1em; }
3075 .tracked-tight-l { letter-spacing: -0.05em; }
3076 .tracked-mega-l { letter-spacing: .25em; }
3077 .lh-solid-l { line-height: 1; }
3078 .lh-title-l { line-height: 1.25; }
3079 .lh-copy-l { line-height: 1.5; }
3080 .mw-100-l { max-width: 100%; }
3081 .mw1-l { max-width: 1rem; }
3082 .mw2-l { max-width: 2rem; }
3083 .mw3-l { max-width: 4rem; }
3084 .mw4-l { max-width: 8rem; }
3085 .mw5-l { max-width: 16rem; }
3086 .mw6-l { max-width: 32rem; }
3087 .mw7-l { max-width: 48rem; }
3088 .mw8-l { max-width: 64rem; }
3089 .mw9-l { max-width: 96rem; }
3090 .mw-none-l { max-width: none; }
3091 .w1-l { width: 1rem; }
3092 .w2-l { width: 2rem; }
3093 .w3-l { width: 4rem; }
3094 .w4-l { width: 8rem; }
3095 .w5-l { width: 16rem; }
3096 .w-10-l { width: 10%; }
3097 .w-20-l { width: 20%; }
3098 .w-25-l { width: 25%; }
3099 .w-30-l { width: 30%; }
3100 .w-33-l { width: 33%; }
3101 .w-34-l { width: 34%; }
3102 .w-40-l { width: 40%; }
3103 .w-50-l { width: 50%; }
3104 .w-60-l { width: 60%; }
3105 .w-70-l { width: 70%; }
3106 .w-75-l { width: 75%; }
3107 .w-80-l { width: 80%; }
3108 .w-90-l { width: 90%; }
3109 .w-100-l { width: 100%; }
3110 .w-third-l { width: 33.33333%; }
3111 .w-two-thirds-l { width: 66.66667%; }
3112 .w-auto-l { width: auto; }
3113 .overflow-visible-l { overflow: visible; }
3114 .overflow-hidden-l { overflow: hidden; }
3115 .overflow-scroll-l { overflow: scroll; }
3116 .overflow-auto-l { overflow: auto; }
3117 .overflow-x-visible-l { overflow-x: visible; }
3118 .overflow-x-hidden-l { overflow-x: hidden; }
3119 .overflow-x-scroll-l { overflow-x: scroll; }
3120 .overflow-x-auto-l { overflow-x: auto; }
3121 .overflow-y-visible-l { overflow-y: visible; }
3122 .overflow-y-hidden-l { overflow-y: hidden; }
3123 .overflow-y-scroll-l { overflow-y: scroll; }
3124 .overflow-y-auto-l { overflow-y: auto; }
3125 .static-l { position: static; }
3126 .relative-l { position: relative; }
3127 .absolute-l { position: absolute; }
3128 .fixed-l { position: fixed; }
3129 .rotate-45-l { -webkit-transform: rotate( 45deg ); transform: rotate( 45deg ); }
3130 .rotate-90-l { -webkit-transform: rotate( 90deg ); transform: rotate( 90deg ); }
3131 .rotate-135-l { -webkit-transform: rotate( 135deg ); transform: rotate( 135deg ); }
3132 .rotate-180-l { -webkit-transform: rotate( 180deg ); transform: rotate( 180deg ); }
3133 .rotate-225-l { -webkit-transform: rotate( 225deg ); transform: rotate( 225deg ); }
3134 .rotate-270-l { -webkit-transform: rotate( 270deg ); transform: rotate( 270deg ); }
3135 .rotate-315-l { -webkit-transform: rotate( 315deg ); transform: rotate( 315deg ); }
3136 .pa0-l { padding: 0; }
3137 .pa1-l { padding: .25rem; }
3138 .pa2-l { padding: .5rem; }
3139 .pa3-l { padding: 1rem; }
3140 .pa4-l { padding: 2rem; }
3141 .pa5-l { padding: 4rem; }
3142 .pa6-l { padding: 8rem; }
3143 .pa7-l { padding: 16rem; }
3144 .pl0-l { padding-left: 0; }
3145 .pl1-l { padding-left: .25rem; }
3146 .pl2-l { padding-left: .5rem; }
3147 .pl3-l { padding-left: 1rem; }
3148 .pl4-l { padding-left: 2rem; }
3149 .pl5-l { padding-left: 4rem; }
3150 .pl6-l { padding-left: 8rem; }
3151 .pl7-l { padding-left: 16rem; }
3152 .pr0-l { padding-right: 0; }
3153 .pr1-l { padding-right: .25rem; }
3154 .pr2-l { padding-right: .5rem; }
3155 .pr3-l { padding-right: 1rem; }
3156 .pr4-l { padding-right: 2rem; }
3157 .pr5-l { padding-right: 4rem; }
3158 .pr6-l { padding-right: 8rem; }
3159 .pr7-l { padding-right: 16rem; }
3160 .pb0-l { padding-bottom: 0; }
3161 .pb1-l { padding-bottom: .25rem; }
3162 .pb2-l { padding-bottom: .5rem; }
3163 .pb3-l { padding-bottom: 1rem; }
3164 .pb4-l { padding-bottom: 2rem; }
3165 .pb5-l { padding-bottom: 4rem; }
3166 .pb6-l { padding-bottom: 8rem; }
3167 .pb7-l { padding-bottom: 16rem; }
3168 .pt0-l { padding-top: 0; }
3169 .pt1-l { padding-top: .25rem; }
3170 .pt2-l { padding-top: .5rem; }
3171 .pt3-l { padding-top: 1rem; }
3172 .pt4-l { padding-top: 2rem; }
3173 .pt5-l { padding-top: 4rem; }
3174 .pt6-l { padding-top: 8rem; }
3175 .pt7-l { padding-top: 16rem; }
3176 .pv0-l { padding-top: 0; padding-bottom: 0; }
3177 .pv1-l { padding-top: .25rem; padding-bottom: .25rem; }
3178 .pv2-l { padding-top: .5rem; padding-bottom: .5rem; }
3179 .pv3-l { padding-top: 1rem; padding-bottom: 1rem; }
3180 .pv4-l { padding-top: 2rem; padding-bottom: 2rem; }
3181 .pv5-l { padding-top: 4rem; padding-bottom: 4rem; }
3182 .pv6-l { padding-top: 8rem; padding-bottom: 8rem; }
3183 .pv7-l { padding-top: 16rem; padding-bottom: 16rem; }
3184 .ph0-l { padding-left: 0; padding-right: 0; }
3185 .ph1-l { padding-left: .25rem; padding-right: .25rem; }
3186 .ph2-l { padding-left: .5rem; padding-right: .5rem; }
3187 .ph3-l { padding-left: 1rem; padding-right: 1rem; }
3188 .ph4-l { padding-left: 2rem; padding-right: 2rem; }
3189 .ph5-l { padding-left: 4rem; padding-right: 4rem; }
3190 .ph6-l { padding-left: 8rem; padding-right: 8rem; }
3191 .ph7-l { padding-left: 16rem; padding-right: 16rem; }
3192 .ma0-l { margin: 0; }
3193 .ma1-l { margin: .25rem; }
3194 .ma2-l { margin: .5rem; }
3195 .ma3-l { margin: 1rem; }
3196 .ma4-l { margin: 2rem; }
3197 .ma5-l { margin: 4rem; }
3198 .ma6-l { margin: 8rem; }
3199 .ma7-l { margin: 16rem; }
3200 .ml0-l { margin-left: 0; }
3201 .ml1-l { margin-left: .25rem; }
3202 .ml2-l { margin-left: .5rem; }
3203 .ml3-l { margin-left: 1rem; }
3204 .ml4-l { margin-left: 2rem; }
3205 .ml5-l { margin-left: 4rem; }
3206 .ml6-l { margin-left: 8rem; }
3207 .ml7-l { margin-left: 16rem; }
3208 .mr0-l { margin-right: 0; }
3209 .mr1-l { margin-right: .25rem; }
3210 .mr2-l { margin-right: .5rem; }
3211 .mr3-l { margin-right: 1rem; }
3212 .mr4-l { margin-right: 2rem; }
3213 .mr5-l { margin-right: 4rem; }
3214 .mr6-l { margin-right: 8rem; }
3215 .mr7-l { margin-right: 16rem; }
3216 .mb0-l { margin-bottom: 0; }
3217 .mb1-l { margin-bottom: .25rem; }
3218 .mb2-l { margin-bottom: .5rem; }
3219 .mb3-l { margin-bottom: 1rem; }
3220 .mb4-l { margin-bottom: 2rem; }
3221 .mb5-l { margin-bottom: 4rem; }
3222 .mb6-l { margin-bottom: 8rem; }
3223 .mb7-l { margin-bottom: 16rem; }
3224 .mt0-l { margin-top: 0; }
3225 .mt1-l { margin-top: .25rem; }
3226 .mt2-l { margin-top: .5rem; }
3227 .mt3-l { margin-top: 1rem; }
3228 .mt4-l { margin-top: 2rem; }
3229 .mt5-l { margin-top: 4rem; }
3230 .mt6-l { margin-top: 8rem; }
3231 .mt7-l { margin-top: 16rem; }
3232 .mv0-l { margin-top: 0; margin-bottom: 0; }
3233 .mv1-l { margin-top: .25rem; margin-bottom: .25rem; }
3234 .mv2-l { margin-top: .5rem; margin-bottom: .5rem; }
3235 .mv3-l { margin-top: 1rem; margin-bottom: 1rem; }
3236 .mv4-l { margin-top: 2rem; margin-bottom: 2rem; }
3237 .mv5-l { margin-top: 4rem; margin-bottom: 4rem; }
3238 .mv6-l { margin-top: 8rem; margin-bottom: 8rem; }
3239 .mv7-l { margin-top: 16rem; margin-bottom: 16rem; }
3240 .mh0-l { margin-left: 0; margin-right: 0; }
3241 .mh1-l { margin-left: .25rem; margin-right: .25rem; }
3242 .mh2-l { margin-left: .5rem; margin-right: .5rem; }
3243 .mh3-l { margin-left: 1rem; margin-right: 1rem; }
3244 .mh4-l { margin-left: 2rem; margin-right: 2rem; }
3245 .mh5-l { margin-left: 4rem; margin-right: 4rem; }
3246 .mh6-l { margin-left: 8rem; margin-right: 8rem; }
3247 .mh7-l { margin-left: 16rem; margin-right: 16rem; }
3248 .na1-l { margin: -0.25rem; }
3249 .na2-l { margin: -0.5rem; }
3250 .na3-l { margin: -1rem; }
3251 .na4-l { margin: -2rem; }
3252 .na5-l { margin: -4rem; }
3253 .na6-l { margin: -8rem; }
3254 .na7-l { margin: -16rem; }
3255 .nl1-l { margin-left: -0.25rem; }
3256 .nl2-l { margin-left: -0.5rem; }
3257 .nl3-l { margin-left: -1rem; }
3258 .nl4-l { margin-left: -2rem; }
3259 .nl5-l { margin-left: -4rem; }
3260 .nl6-l { margin-left: -8rem; }
3261 .nl7-l { margin-left: -16rem; }
3262 .nr1-l { margin-right: -0.25rem; }
3263 .nr2-l { margin-right: -0.5rem; }
3264 .nr3-l { margin-right: -1rem; }
3265 .nr4-l { margin-right: -2rem; }
3266 .nr5-l { margin-right: -4rem; }
3267 .nr6-l { margin-right: -8rem; }
3268 .nr7-l { margin-right: -16rem; }
3269 .nb1-l { margin-bottom: -0.25rem; }
3270 .nb2-l { margin-bottom: -0.5rem; }
3271 .nb3-l { margin-bottom: -1rem; }
3272 .nb4-l { margin-bottom: -2rem; }
3273 .nb5-l { margin-bottom: -4rem; }
3274 .nb6-l { margin-bottom: -8rem; }
3275 .nb7-l { margin-bottom: -16rem; }
3276 .nt1-l { margin-top: -0.25rem; }
3277 .nt2-l { margin-top: -0.5rem; }
3278 .nt3-l { margin-top: -1rem; }
3279 .nt4-l { margin-top: -2rem; }
3280 .nt5-l { margin-top: -4rem; }
3281 .nt6-l { margin-top: -8rem; }
3282 .nt7-l { margin-top: -16rem; }
3283 .strike-l { text-decoration: line-through; }
3284 .underline-l { text-decoration: underline; }
3285 .no-underline-l { text-decoration: none; }
3286 .tl-l { text-align: left; }
3287 .tr-l { text-align: right; }
3288 .tc-l { text-align: center; }
3289 .tj-l { text-align: justify; }
3290 .ttc-l { text-transform: capitalize; }
3291 .ttl-l { text-transform: lowercase; }
3292 .ttu-l { text-transform: uppercase; }
3293 .ttn-l { text-transform: none; }
3294 .f-6-l { font-size: 6rem; }
3295 .f-headline-l { font-size: 6rem; }
3296 .f-5-l { font-size: 5rem; }
3297 .f-subheadline-l { font-size: 5rem; }
3298 .f1-l { font-size: 3rem; }
3299 .f2-l { font-size: 2.25rem; }
3300 .f3-l { font-size: 1.5rem; }
3301 .f4-l { font-size: 1.25rem; }
3302 .f5-l { font-size: 1rem; }
3303 .f6-l { font-size: .875rem; }
3304 .f7-l { font-size: .75rem; }
3305 .measure-l { max-width: 30em; }
3306 .measure-wide-l { max-width: 34em; }
3307 .measure-narrow-l { max-width: 20em; }
3308 .indent-l { text-indent: 1em; margin-top: 0; margin-bottom: 0; }
3309 .small-caps-l { font-variant: small-caps; }
3310 .truncate-l { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
3311 .center-l { margin-right: auto; margin-left: auto; }
3312 .mr-auto-l { margin-right: auto; }
3313 .ml-auto-l { margin-left: auto; }
3314 .clip-l { position: fixed !important; _position: absolute !important; clip: rect( 1px 1px 1px 1px ); /* IE6, IE7 */ clip: rect( 1px, 1px, 1px, 1px ); }
3315 .ws-normal-l { white-space: normal; }
3316 .nowrap-l { white-space: nowrap; }
3317 .pre-l { white-space: pre; }
3318 .v-base-l { vertical-align: baseline; }
3319 .v-mid-l { vertical-align: middle; }
3320 .v-top-l { vertical-align: top; }
3321 .v-btm-l { vertical-align: bottom; }
3322}
3323@media screen and (max-height: 30em) {
3324 .dn-sh { display: none; }
3325 .di-sh { display: inline; }
3326 .db-sh { display: block; }
3327 .dib-sh { display: inline-block; }
3328 .flex-auto-sh { flex: 1 1 auto; min-width: 0; /* 1 */ min-height: 0; /* 1 */ }
3329 .flex-none-sh { flex: none; }
3330 .flex-column-sh { flex-direction: column; }
3331 .flex-row-sh { flex-direction: row; }
3332 .flex-wrap-sh { flex-wrap: wrap; }
3333 .flex-nowrap-sh { flex-wrap: nowrap; }
3334 .flex-wrap-reverse-sh { flex-wrap: wrap-reverse; }
3335 .flex-column-reverse-sh { flex-direction: column-reverse; }
3336 .flex-row-reverse-sh { flex-direction: row-reverse; }
3337 .items-start-sh { align-items: flex-start; }
3338 .items-end-sh { align-items: flex-end; }
3339 .items-center-sh { align-items: center; }
3340 .items-baseline-sh { align-items: baseline; }
3341 .items-stretch-sh { align-items: stretch; }
3342 .justify-start-sh { justify-content: flex-start; }
3343 .justify-end-sh { justify-content: flex-end; }
3344 .justify-center-sh { justify-content: center; }
3345 .justify-between-sh { justify-content: space-between; }
3346 .justify-around-sh { justify-content: space-around; }
3347}
3348
3349
3350
3351/*# sourceMappingURL=/tachyons.49dc960e.css.map */
\No newline at end of file