diff --git a/dist/1.962e195c.jpg b/dist/1.962e195c.jpg new file mode 100644 index 0000000..31d5a4e Binary files /dev/null and b/dist/1.962e195c.jpg differ diff --git a/dist/2.bb0a3088.jpg b/dist/2.bb0a3088.jpg new file mode 100644 index 0000000..c0fa5db Binary files /dev/null and b/dist/2.bb0a3088.jpg differ diff --git a/dist/3.bed12ebf.jpg b/dist/3.bed12ebf.jpg new file mode 100644 index 0000000..d304b53 Binary files /dev/null and b/dist/3.bed12ebf.jpg differ diff --git a/dist/index.html b/dist/index.html index 878cc08..81bd4d0 100644 --- a/dist/index.html +++ b/dist/index.html @@ -1,500 +1,4 @@ - - - - - - - - - Spirit | A simple CSS framework - - - - - - - -
-
-

Spirit

-

- A customisable CSS framework that strives to be small, yet complete. With a strong focus on - typography, clean spacing, and semantic naming conventions, - Spirit is the perfect CSS microframework for everyone. -

- -
-

Typography

-

Opiniated styles are applied on the HTML heading elements in order to fluidly style them. Use the - variables - available to - customise them to your need. -

-

Typefaces used

-

These are freely available, high quality typefaces.

- -

h1 - Heading 1

-

h2 - Heading 2

-

h3 - Heading 3

-

h4 - Heading 4

-
h5 - Heading 5
-
h6 - Heading 6
- -

Custom sizes

-

Custom sizes are not fluid, but they let you 'lock' the font-size of text across all device widths.

-

.size-1

-

.size-2

-

.size-3

-

.size-4

-

.size-5

-

.size-6

-

.size-7

- -

Links

-

- Links are specially styled to look better in a block of text. -

- -

Scale text

-

A utility class to make the font-size of text content slightly smaller than it's parent. It uses fluid - sizing - in order to be perfectly responsive.

-

This sentence, for example, is scaled down.

- -

Title

-

This provides a sans-serif title font, with extra weight.

- -
- -

Grids:

-

Use Grids to create responsive layouts that flow in two dimensions. The default grid is 12x12 cells, this - can - easily be extended to any arbitrary number by using CSS variables. - This one stays the same across all viewports:

-
- - , 2 - 3 - - 7-8 - 2+2 - 5-8 - 1-4 - 6.. - 2.. - 4.. - 1-2, 5-6 - 4-5 - -
- -
-

This is a responsive grid:

- - 2 / row - 3, 6 / row - 1-2 / 1 - 3.. / 2 - -

Note: This is a heavily modified version of the Raster - Grid - Subsystem.

-
- -

Flexbox utilities:

-

Composable flexbox utilities allows you to quickly style content that flows in one-dimension. - Applying class="container row is-fullheight flex-center" to a div element creates the following content: -

- -
-

Lorem ipsum.

-
-

Infinitely nestable rows and columns allow you to effortlessly create incredibly - complex - layouts. Use the - full power - of Flexbox and Grid to bend CSS to your will. -

-
-
- C1 -
-
N1
-
N2
-
N3
-
-
-
C2
-
C3
-
- -

Note: Fixed width content within a flex container may overflow on smaller displays.

-
-

Forms:

-

Simple styles with rational defaults, to provide a cohesive design.

-
-
- - -
Don't worry, your information is safe with us.
-
-
- - -
-
- - -
-
- - -
- -

You can use the color utilities to mix and match your own styles of elements. For example:

- -
- -
-

Tables:

-

Tables are minimally styled, and come with a handy .table-container class for horizontally scrollable - tables. -

-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
NameIDFavorite ColorFavorite ColorFavorite ColorFavorite ColorFavorite ColorFavorite ColorFavorite ColorFavorite ColorFavorite ColorFavorite Color
JimGreenGreenGreenGreen00001BlueBlueBlueBlueBlueBlue
Sue00002RedGreenGreenGreenGreenBlueBlueRedRedRed
Barb00003RedRedRedRedRedBlueBlueGreenGreenGreen
-
- -
- -

Images

-

Images are styled using an aspect ratio box technique. It requires you to add the aspect ratio of the - image - using the style attribute.

-

Random images from Unsplash:

-
-
- - - Unsplash - -
This image uses --aspect-ratio: 1.5
-
-
-
-
- - - - Unsplash - -
This image uses --aspect-ratio: 1344/1789
-
-
-
-
- - - - Unsplash - -
This image uses --aspect-ratio: 860/1290
-
-
-
-
-

These images will maintain their aspect ratio across all viewports. In combination with using the - picture tag, responsive images has never been easier. -

-

Note: Based on code from this article. In particular, Thierry Koblentz's - work. -

-
- -

Elements

-

A collection of other useful elements and styles.

- -

Box

-
-

- The box element is a simple container with padding and shadow. It can contain any arbitrary content. -

-
- -

Lists

-
-
-

Unordered lists:

-
    -
  • List item 1
    • -
  • List item 2
    • -
  • List item 3
    • -
  • List item 4
    • -
-
-
-

Ordered lists:

-
    -
  1. List item 1
    2. -
  2. List item 2
    3. -
  3. List item 3
    4. -
  4. List item 4
    5. -
-
-
- -

Horizontal rule:

-

A restyled horizontal rule element you can use to add class to your design.

-
- -

Article wrapper & breakout

-

- It's common to see articles limit the width of the content on wide displays in order to improve - readability. - Spirit provides a Grid powered wrapper for this situation, which is completely responsive. As a bonus, - it - also supplies a customisable .breakout class - which you can use to allow elements to be fullwidth, responsively. -

-
-

Example

-

This content will only extend until a max-width of 480px, beyond which it will start wrapping. This - width - is customisable inline. The default can be customised in the _variables.scss file. -

-

- On the other hand, this content is placed within a .breakout class. This means that it will always - span - the fullwidth of the viewport. This is especially useful for images or charts. -

-
-

This effect is easily nestable, as seen on this very element. All the content on this page has been - wrapped in this style, with this element being wrapped twice. -

-

Note: Code based on this article.

- -
- -

Spacing utilities

-

- Use these utility classes to perfectly position your content using margins and padding. -

-

Available class prefixes:

-
-
-
    -
  • .mt
    • -
  • .mr
    • -
  • .mb
    • -
  • .ml
    • -
-
-
-
    -
  • .pt
    • -
  • .pr
    • -
  • .pb
    • -
  • .pl
    • -
-
-
- -

In order to use these classes, combine a prefix with one of the following levels to achieve the desired - result. For example, .mr-3 defines margin-right: 1.75 rem.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
LevelValue
00
10.75 rem
21.25 rem
31.75 rem
42.25 rem
52.75 rem
- -

Special class: .mx-auto sets margin: auto on the left and right. Useful for centering - content, - but honestly, you should just use flexbox. -

-
- -

Responsive helpers

-

A host of helper classes to conditionally display content based on the viewport width. There are 9 helper - classes. Resize your window to see the effect. -

-
    -
  1. This sentence is hidden on mobile devices.
    2. -
  2. This sentence is hidden on tablets.
    3. -
  3. This sentence is hidden on desktops.
    4. -
  4. This sentence is hidden on widescreen.
    5. - -
  5. This sentence is hidden upto touch devices.
    6. -
  6. This sentence is hidden from tablet and above.
    7. -
  7. This sentence is hidden from desktop and above.
    8. -
  8. This sentence is hidden from widescreen and above.
    9. -
  9. This sentence is hidden from fullhd and above.
    10. -
-

Note: These helpers were taken directly from Bulma CSS. -

- -
-

Color helpers

-

Spirit includes a tiny set of classes to quickly style the background, font-color or border-color of any - element.

- -
- - .bg-navy .aqua - - .bg-blue .aqua - - .bg-aqua .navy - - .bg-teal .black - - .bg-olive .black - - .bg-green .white - - .bg-lime .black - - .bg-yellow .red - - .bg-orange .white - - .bg-red .white - - .bg-fuchsia - .white - .bg-purple .white - - .bg-maroon .white - - .bg-black .white - - .bg-gray .black - - .bg-silver .black - - .bg-white .black .border .border--black - -

Note: Based on clrs.cc by mrmrs

-
- -
-

First stable release with proper documentation is on the way. Stay tuned!

- -
\ No newline at end of file diff --git a/dist/main.aa471670.css b/dist/main.aa471670.css new file mode 100644 index 0000000..5f488f1 --- /dev/null +++ b/dist/main.aa471670.css @@ -0,0 +1,2 @@ +/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}@font-face{font-family:Public Sans;src:local("Public Sans"),url(Public-Sans-Roman.6fef391f.ttf) format("truetype")}@font-face{font-family:Butler;src:local("Butler Regular"),url(Butler_Regular.f2583a0a.otf);font-weight:400}@font-face{font-family:Butler;src:local("Butler Bold"),url(Butler_Bold.9c541e6e.otf);font-weight:800}@font-face{font-family:Butler;src:local("Butler Light"),url(Butler_Light.08652589.otf);font-weight:200}*,:after,:before{box-sizing:border-box}:root{scroll-behavior:smooth;text-rendering:optimizeLegibility}html{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.no-pad{padding:0!important}.no-margin{margin:0!important}.is-flex{display:flex}.mt-0{margin-top:0}.mt-1{margin-top:.75rem}.mt-2{margin-top:1.25rem}.mt-3{margin-top:1.75rem}.mt-4{margin-top:2.25rem}.mt-5{margin-top:2.75rem}.mb-0{margin-bottom:0}.mb-1{margin-bottom:.75rem}.mb-2{margin-bottom:1.25rem}.mb-3{margin-bottom:1.75rem}.mb-4{margin-bottom:2.25rem}.mb-5{margin-bottom:2.75rem}.mr-0{margin-right:0}.mr-1{margin-right:.75rem}.mr-2{margin-right:1.25rem}.mr-3{margin-right:1.75rem}.mr-4{margin-right:2.25rem}.mr-5{margin-right:2.75rem}.ml-0{margin-left:0}.ml-1{margin-left:.75rem}.ml-2{margin-left:1.25rem}.ml-3{margin-left:1.75rem}.ml-4{margin-left:2.25rem}.ml-5{margin-left:2.75rem}.mx-auto{margin-left:auto;margin-right:auto}.pt-0{padding-top:0}.pt-1{padding-top:.75rem}.pt-2{padding-top:1.25rem}.pt-3{padding-top:1.75rem}.pt-4{padding-top:2.25rem}.pt-5{padding-top:2.75rem}.pr-0{padding-right:0}.pr-1{padding-right:.75rem}.pr-2{padding-right:1.25rem}.pr-3{padding-right:1.75rem}.pr-4{padding-right:2.25rem}.pr-5{padding-right:2.75rem}.pb-0{padding-bottom:0}.pb-1{padding-bottom:.75rem}.pb-2{padding-bottom:1.25rem}.pb-3{padding-bottom:1.75rem}.pb-4{padding-bottom:2.25rem}.pb-5{padding-bottom:2.75rem}.pl-0{padding-left:0}.pl-1{padding-left:.75rem}.pl-2{padding-left:1.25rem}.pl-3{padding-left:1.75rem}.pl-4{padding-left:2.25rem}.pl-5{padding-left:2.75rem}.border{border:1px solid}.is-hidden{display:none!important}.is-sr-only{border:none!important;clip:rect(0,0,0,0)!important;height:.01em!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:.01em!important}@media screen and (max-width:768px){.is-hidden-mobile{display:none!important}}@media print,screen and (min-width:769px){.is-hidden-tablet{display:none!important}}@media screen and (min-width:769px) and (max-width:1024px){.is-hidden-tablet-only{display:none!important}}@media screen and (max-width:1024px){.is-hidden-touch{display:none!important}}@media screen and (min-width:1024px){.is-hidden-desktop{display:none!important}}@media screen and (min-width:1024px) and (max-width:1216px){.is-hidden-desktop-only{display:none!important}}@media screen and (min-width:1216px){.is-hidden-widescreen{display:none!important}}@media screen and (min-width:1216px) and (max-width:1408px){.is-hidden-widescreen-only{display:none!important}}@media screen and (min-width:1408px){.is-hidden-fullhd{display:none!important}}r-grid{display:grid;--grid-tc:repeat(12,1fr);--grid-tr:repeat(12,1fr);--col-gap:1rem;--row-gap:1rem;gap:var(--row-gap) var(--col-gap);grid-template-columns:var(--grid-tc);grid-template-rows:var(--grid-tr);--grid-cs:1;--grid-ce:-1;--grid-rs:1;--grid-re:-1}r-grid>r-cell{display:block;-moz-appearance:none;appearance:none;-webkit-appearance:none}r-grid[style*="--col-gap"]{--col-gap:var(--col-gap)}r-grid[style*="--row-gap"]{--row-gap:var(--row-gap)}r-grid[style*="--columns"]{--grid-tc:repeat(var(--columns),1fr)}r-grid[style*="--rows"]{--grid-tr:repeat(var(--rows),1fr)}r-grid[columns="1"]{--grid-tc:repeat(1,1fr)}r-grid[columns="2"]{--grid-tc:repeat(2,1fr)}r-grid[columns="3"]{--grid-tc:repeat(3,1fr)}r-grid[columns="4"]{--grid-tc:repeat(4,1fr)}r-grid[columns="5"]{--grid-tc:repeat(5,1fr)}r-grid[columns="6"]{--grid-tc:repeat(6,1fr)}r-grid[columns="7"]{--grid-tc:repeat(7,1fr)}r-grid[columns="8"]{--grid-tc:repeat(8,1fr)}r-grid[columns="9"]{--grid-tc:repeat(9,1fr)}r-grid[columns="10"]{--grid-tc:repeat(10,1fr)}r-grid[columns="11"]{--grid-tc:repeat(11,1fr)}r-grid[columns="12"]{--grid-tc:repeat(12,1fr)}r-grid>r-cell[colspan^="1"]{--grid-cs:1}r-grid>r-cell[colspan^="2"]{--grid-cs:2}r-grid>r-cell[colspan^="3"]{--grid-cs:3}r-grid>r-cell[colspan^="4"]{--grid-cs:4}r-grid>r-cell[colspan^="5"]{--grid-cs:5}r-grid>r-cell[colspan^="6"]{--grid-cs:6}r-grid>r-cell[colspan^="7"]{--grid-cs:7}r-grid>r-cell[colspan^="8"]{--grid-cs:8}r-grid>r-cell[colspan^="9"]{--grid-cs:9}r-grid>r-cell[colspan^="10"]{--grid-cs:10}r-grid>r-cell[colspan^="11"]{--grid-cs:11}r-grid>r-cell[colspan^="12"]{--grid-cs:12}r-grid>r-cell[colspan$="+1"],r-grid>r-cell[colspan="1"]{--grid-ce:1}r-grid>r-cell[colspan$="+2"],r-grid>r-cell[colspan$="-1"],r-grid>r-cell[colspan="2"]{--grid-ce:2}r-grid>r-cell[colspan$="+3"],r-grid>r-cell[colspan$="-2"],r-grid>r-cell[colspan="3"]{--grid-ce:3}r-grid>r-cell[colspan$="+4"],r-grid>r-cell[colspan$="-3"],r-grid>r-cell[colspan="4"]{--grid-ce:4}r-grid>r-cell[colspan$="+5"],r-grid>r-cell[colspan$="-4"],r-grid>r-cell[colspan="5"]{--grid-ce:5}r-grid>r-cell[colspan$="+6"],r-grid>r-cell[colspan$="-5"],r-grid>r-cell[colspan="6"]{--grid-ce:6}r-grid>r-cell[colspan$="+7"],r-grid>r-cell[colspan$="-6"],r-grid>r-cell[colspan="7"]{--grid-ce:7}r-grid>r-cell[colspan$="+8"],r-grid>r-cell[colspan$="-7"],r-grid>r-cell[colspan="8"]{--grid-ce:8}r-grid>r-cell[colspan$="+9"],r-grid>r-cell[colspan$="-8"],r-grid>r-cell[colspan="9"]{--grid-ce:9}r-grid>r-cell[colspan$="+10"],r-grid>r-cell[colspan$="-9"],r-grid>r-cell[colspan="10"]{--grid-ce:10}r-grid>r-cell[colspan$="+11"],r-grid>r-cell[colspan$="-10"],r-grid>r-cell[colspan="11"]{--grid-ce:11}r-grid>r-cell[colspan$="+12"],r-grid>r-cell[colspan$="-11"],r-grid>r-cell[colspan="12"]{--grid-ce:12}r-grid>r-cell[colspan$="-12"]{--grid-ce:13}r-grid>r-cell[colspan]{grid-column-end:span var(--grid-ce)}r-grid>r-cell[colspan*="+"],r-grid>r-cell[colspan*="-"],r-grid>r-cell[colspan*=".."]{grid-column-start:var(--grid-cs)}r-grid>r-cell[colspan*="-"],r-grid>r-cell[colspan*=".."]{grid-column-end:var(--grid-ce)}r-grid>r-cell[colspan=row]{grid-column:1/-1}@media only screen and (max-width:768px){r-grid[columns-s="1"]{--grid-tc:repeat(1,1fr)}r-grid[columns-s="2"]{--grid-tc:repeat(2,1fr)}r-grid[columns-s="3"]{--grid-tc:repeat(3,1fr)}r-grid[columns-s="4"]{--grid-tc:repeat(4,1fr)}r-grid[columns-s="5"]{--grid-tc:repeat(5,1fr)}r-grid[columns-s="6"]{--grid-tc:repeat(6,1fr)}r-grid[columns-s="7"]{--grid-tc:repeat(7,1fr)}r-grid[columns-s="8"]{--grid-tc:repeat(8,1fr)}r-grid[columns-s="9"]{--grid-tc:repeat(9,1fr)}r-grid[columns-s="10"]{--grid-tc:repeat(10,1fr)}r-grid[columns-s="11"]{--grid-tc:repeat(11,1fr)}r-grid[columns-s="12"]{--grid-tc:repeat(12,1fr)}r-grid>r-cell[colspan-s^="1"]{--grid-cs:1}r-grid>r-cell[colspan-s^="2"]{--grid-cs:2}r-grid>r-cell[colspan-s^="3"]{--grid-cs:3}r-grid>r-cell[colspan-s^="4"]{--grid-cs:4}r-grid>r-cell[colspan-s^="5"]{--grid-cs:5}r-grid>r-cell[colspan-s^="6"]{--grid-cs:6}r-grid>r-cell[colspan-s^="7"]{--grid-cs:7}r-grid>r-cell[colspan-s^="8"]{--grid-cs:8}r-grid>r-cell[colspan-s^="9"]{--grid-cs:9}r-grid>r-cell[colspan-s^="10"]{--grid-cs:10}r-grid>r-cell[colspan-s^="11"]{--grid-cs:11}r-grid>r-cell[colspan-s^="12"]{--grid-cs:12}r-grid>r-cell[colspan-s$="+1"],r-grid>r-cell[colspan-s="1"]{--grid-ce:1}r-grid>r-cell[colspan-s$="+2"],r-grid>r-cell[colspan-s$="-1"],r-grid>r-cell[colspan-s="2"]{--grid-ce:2}r-grid>r-cell[colspan-s$="+3"],r-grid>r-cell[colspan-s$="-2"],r-grid>r-cell[colspan-s="3"]{--grid-ce:3}r-grid>r-cell[colspan-s$="+4"],r-grid>r-cell[colspan-s$="-3"],r-grid>r-cell[colspan-s="4"]{--grid-ce:4}r-grid>r-cell[colspan-s$="+5"],r-grid>r-cell[colspan-s$="-4"],r-grid>r-cell[colspan-s="5"]{--grid-ce:5}r-grid>r-cell[colspan-s$="+6"],r-grid>r-cell[colspan-s$="-5"],r-grid>r-cell[colspan-s="6"]{--grid-ce:6}r-grid>r-cell[colspan-s$="+7"],r-grid>r-cell[colspan-s$="-6"],r-grid>r-cell[colspan-s="7"]{--grid-ce:7}r-grid>r-cell[colspan-s$="+8"],r-grid>r-cell[colspan-s$="-7"],r-grid>r-cell[colspan-s="8"]{--grid-ce:8}r-grid>r-cell[colspan-s$="+9"],r-grid>r-cell[colspan-s$="-8"],r-grid>r-cell[colspan-s="9"]{--grid-ce:9}r-grid>r-cell[colspan-s$="+10"],r-grid>r-cell[colspan-s$="-9"],r-grid>r-cell[colspan-s="10"]{--grid-ce:10}r-grid>r-cell[colspan-s$="+11"],r-grid>r-cell[colspan-s$="-10"],r-grid>r-cell[colspan-s="11"]{--grid-ce:11}r-grid>r-cell[colspan-s$="+12"],r-grid>r-cell[colspan-s$="-11"],r-grid>r-cell[colspan-s="12"]{--grid-ce:12}r-grid>r-cell[colspan-s$="-12"]{--grid-ce:13}r-grid>r-cell[colspan-s]{grid-column-end:span var(--grid-ce)}r-grid>r-cell[colspan-s*="+"],r-grid>r-cell[colspan-s*="-"],r-grid>r-cell[colspan-s*=".."]{grid-column-start:var(--grid-cs)}r-grid>r-cell[colspan-s*="-"],r-grid>r-cell[colspan-s*=".."]{grid-column-end:var(--grid-ce)}r-grid>r-cell[colspan-s=row]{grid-column:1/-1}}@media only screen and (min-width:1599px){r-grid[columns-l="1"]{--grid-tc:repeat(1,1fr)}r-grid[columns-l="2"]{--grid-tc:repeat(2,1fr)}r-grid[columns-l="3"]{--grid-tc:repeat(3,1fr)}r-grid[columns-l="4"]{--grid-tc:repeat(4,1fr)}r-grid[columns-l="5"]{--grid-tc:repeat(5,1fr)}r-grid[columns-l="6"]{--grid-tc:repeat(6,1fr)}r-grid[columns-l="7"]{--grid-tc:repeat(7,1fr)}r-grid[columns-l="8"]{--grid-tc:repeat(8,1fr)}r-grid[columns-l="9"]{--grid-tc:repeat(9,1fr)}r-grid[columns-l="10"]{--grid-tc:repeat(10,1fr)}r-grid[columns-l="11"]{--grid-tc:repeat(11,1fr)}r-grid[columns-l="12"]{--grid-tc:repeat(12,1fr)}r-grid>r-cell[colspan-l^="1"]{--grid-cs:1}r-grid>r-cell[colspan-l^="2"]{--grid-cs:2}r-grid>r-cell[colspan-l^="3"]{--grid-cs:3}r-grid>r-cell[colspan-l^="4"]{--grid-cs:4}r-grid>r-cell[colspan-l^="5"]{--grid-cs:5}r-grid>r-cell[colspan-l^="6"]{--grid-cs:6}r-grid>r-cell[colspan-l^="7"]{--grid-cs:7}r-grid>r-cell[colspan-l^="8"]{--grid-cs:8}r-grid>r-cell[colspan-l^="9"]{--grid-cs:9}r-grid>r-cell[colspan-l^="10"]{--grid-cs:10}r-grid>r-cell[colspan-l^="11"]{--grid-cs:11}r-grid>r-cell[colspan-l^="12"]{--grid-cs:12}r-grid>r-cell[colspan-l$="+1"],r-grid>r-cell[colspan-l="1"]{--grid-ce:1}r-grid>r-cell[colspan-l$="+2"],r-grid>r-cell[colspan-l$="-1"],r-grid>r-cell[colspan-l="2"]{--grid-ce:2}r-grid>r-cell[colspan-l$="+3"],r-grid>r-cell[colspan-l$="-2"],r-grid>r-cell[colspan-l="3"]{--grid-ce:3}r-grid>r-cell[colspan-l$="+4"],r-grid>r-cell[colspan-l$="-3"],r-grid>r-cell[colspan-l="4"]{--grid-ce:4}r-grid>r-cell[colspan-l$="+5"],r-grid>r-cell[colspan-l$="-4"],r-grid>r-cell[colspan-l="5"]{--grid-ce:5}r-grid>r-cell[colspan-l$="+6"],r-grid>r-cell[colspan-l$="-5"],r-grid>r-cell[colspan-l="6"]{--grid-ce:6}r-grid>r-cell[colspan-l$="+7"],r-grid>r-cell[colspan-l$="-6"],r-grid>r-cell[colspan-l="7"]{--grid-ce:7}r-grid>r-cell[colspan-l$="+8"],r-grid>r-cell[colspan-l$="-7"],r-grid>r-cell[colspan-l="8"]{--grid-ce:8}r-grid>r-cell[colspan-l$="+9"],r-grid>r-cell[colspan-l$="-8"],r-grid>r-cell[colspan-l="9"]{--grid-ce:9}r-grid>r-cell[colspan-l$="+10"],r-grid>r-cell[colspan-l$="-9"],r-grid>r-cell[colspan-l="10"]{--grid-ce:10}r-grid>r-cell[colspan-l$="+11"],r-grid>r-cell[colspan-l$="-10"],r-grid>r-cell[colspan-l="11"]{--grid-ce:11}r-grid>r-cell[colspan-l$="+12"],r-grid>r-cell[colspan-l$="-11"],r-grid>r-cell[colspan-l="12"]{--grid-ce:12}r-grid>r-cell[colspan-l$="-12"]{--grid-ce:13}r-grid>r-cell[colspan-l]{grid-column-end:span var(--grid-ce)}r-grid>r-cell[colspan-l*="+"],r-grid>r-cell[colspan-l*="-"],r-grid>r-cell[colspan-l*=".."]{grid-column-start:var(--grid-cs)}r-grid>r-cell[colspan-l*="-"],r-grid>r-cell[colspan-l*=".."]{grid-column-end:var(--grid-ce)}r-grid>r-cell[colspan-l=row]{grid-column:1/-1}}r-grid[rows="1"]{--grid-tr:repeat(1,1fr)}r-grid[rows="2"]{--grid-tr:repeat(2,1fr)}r-grid[rows="3"]{--grid-tr:repeat(3,1fr)}r-grid[rows="4"]{--grid-tr:repeat(4,1fr)}r-grid[rows="5"]{--grid-tr:repeat(5,1fr)}r-grid[rows="6"]{--grid-tr:repeat(6,1fr)}r-grid[rows="7"]{--grid-tr:repeat(7,1fr)}r-grid[rows="8"]{--grid-tr:repeat(8,1fr)}r-grid[rows="9"]{--grid-tr:repeat(9,1fr)}r-grid[rows="10"]{--grid-tr:repeat(10,1fr)}r-grid[rows="11"]{--grid-tr:repeat(11,1fr)}r-grid[rows="12"]{--grid-tr:repeat(12,1fr)}r-grid>r-cell[rowspan^="1"]{--grid-rs:1}r-grid>r-cell[rowspan^="2"]{--grid-rs:2}r-grid>r-cell[rowspan^="3"]{--grid-rs:3}r-grid>r-cell[rowspan^="4"]{--grid-rs:4}r-grid>r-cell[rowspan^="5"]{--grid-rs:5}r-grid>r-cell[rowspan^="6"]{--grid-rs:6}r-grid>r-cell[rowspan^="7"]{--grid-rs:7}r-grid>r-cell[rowspan^="8"]{--grid-rs:8}r-grid>r-cell[rowspan^="9"]{--grid-rs:9}r-grid>r-cell[rowspan^="10"]{--grid-rs:10}r-grid>r-cell[rowspan^="11"]{--grid-rs:11}r-grid>r-cell[rowspan^="12"]{--grid-rs:12}r-grid>r-cell[rowspan$="+1"],r-grid>r-cell[rowspan="1"]{--grid-re:1}r-grid>r-cell[rowspan$="+2"],r-grid>r-cell[rowspan$="-1"],r-grid>r-cell[rowspan="2"]{--grid-re:2}r-grid>r-cell[rowspan$="+3"],r-grid>r-cell[rowspan$="-2"],r-grid>r-cell[rowspan="3"]{--grid-re:3}r-grid>r-cell[rowspan$="+4"],r-grid>r-cell[rowspan$="-3"],r-grid>r-cell[rowspan="4"]{--grid-re:4}r-grid>r-cell[rowspan$="+5"],r-grid>r-cell[rowspan$="-4"],r-grid>r-cell[rowspan="5"]{--grid-re:5}r-grid>r-cell[rowspan$="+6"],r-grid>r-cell[rowspan$="-5"],r-grid>r-cell[rowspan="6"]{--grid-re:6}r-grid>r-cell[rowspan$="+7"],r-grid>r-cell[rowspan$="-6"],r-grid>r-cell[rowspan="7"]{--grid-re:7}r-grid>r-cell[rowspan$="+8"],r-grid>r-cell[rowspan$="-7"],r-grid>r-cell[rowspan="8"]{--grid-re:8}r-grid>r-cell[rowspan$="+9"],r-grid>r-cell[rowspan$="-8"],r-grid>r-cell[rowspan="9"]{--grid-re:9}r-grid>r-cell[rowspan$="+10"],r-grid>r-cell[rowspan$="-9"],r-grid>r-cell[rowspan="10"]{--grid-re:10}r-grid>r-cell[rowspan$="+11"],r-grid>r-cell[rowspan$="-10"],r-grid>r-cell[rowspan="11"]{--grid-re:11}r-grid>r-cell[rowspan$="+12"],r-grid>r-cell[rowspan$="-11"],r-grid>r-cell[rowspan="12"]{--grid-re:12}r-grid>r-cell[rowspan$="-12"]{--grid-re:13}r-grid>r-cell[rowspan]{grid-row-end:span var(--grid-re)}r-grid>r-cell[rowspan*="+"],r-grid>r-cell[rowspan*="-"],r-grid>r-cell[rowspan*=".."]{grid-row-start:var(--grid-rs)}r-grid>r-cell[rowspan*="-"],r-grid>r-cell[rowspan*=".."]{grid-row-end:var(--grid-re)}r-grid>r-cell[rowspan=row]{grid-row:1/-1}r-grid.debug>*{--color:rgba(248,110,91,0.3);background-image:linear-gradient(180deg,var(--color) 0,var(--color))}r-grid.debug>:nth-child(6n+2){--color:rgba(103,126,208,0.3)}r-grid.debug>:nth-child(6n+3){--color:rgba(224,174,72,0.3)}r-grid.debug>:nth-child(6n+4){--color:rgba(77,214,115,0.3)}r-grid.debug>:nth-child(6n+5){--color:rgba(217,103,219,0.3)}r-grid.debug>:nth-child(6n+6){--color:rgba(94,204,211,0.3)}r-grid.debug>:nth-child(6n+7){--color:rgba(248,110,91,0.3)}h1,h2,h3,h4,h5,h6{font-weight:400;font-family:Butler,serif;line-height:1.5;margin:0}h1{font-size:min(calc(3rem + .75vw),6rem);margin:calc(.5rem + 2vh) 0 calc(.25rem + 1vh)}h2{font-size:min(calc(2.5rem + .75vw),5rem);margin:calc(.5rem + 1.75vh) 0 calc(.25rem + .75vh)}h3{font-size:min(calc(2.15rem + .75vw),4rem);margin:calc(.5rem + 1.5vh) 0 calc(.25rem + .5vh)}h4{font-size:min(calc(1.75rem + .75vw),3rem);margin:calc(.5rem + 1.25vh) 0 calc(.25rem + .75vh)}h5{font-size:min(calc(1.5rem + .75vw),2rem);margin:calc(.5rem + 1vh) 0 calc(.25rem + .75vh)}h6{font-size:min(calc(1.25rem + .75vw),1.75rem);margin:calc(.5rem + .75vh) 0 calc(.25rem + .75vh)}body{font-size:min(calc(.75rem + .75vw),2.5rem);margin:calc(.25rem + 1vh) 0 calc(.5rem + 2vh);line-height:1.5;font-family:Public Sans,sans-serif;font-weight:100}a,ins,u{-webkit-text-decoration-skip:ink edges;text-decoration-skip:ink edges}.size-1{font-size:3.25rem}.size-2{font-size:2.75rem}.size-3{font-size:2.5rem}.size-4{font-size:2.15rem}.size-5{font-size:1.75rem}.size-6{font-size:1.5rem}.size-7{font-size:1.25rem}a{transition:color .2s,border-bottom .2s;text-decoration:none;border-bottom:2px solid #0f52ba;border-radius:1px}a,a:link,a:visited{color:#0f52ba}a:hover{color:#0080ff;border-bottom:2px solid #0080ff}a:active{transition:color .2s;color:#0074d9}p{margin:1rem 0}.title,strong{font-weight:800}.title{font-family:Public Sans,sans-serif}.text-center{text-align:center}.text-justify{text-align:justify}.font-bold{font-weight:700}.font-light{font-weight:200}.italic{font-style:italic}.underline{text-decoration:underline}.scale-text{font-size:calc(1em - .2vw)}.is-family-sans-serif{font-family:Public Sans,sans-serif}.is-family-serif{font-family:Butler,serif}.container{max-width:100%;width:100%;padding:0 1rem;margin-left:auto;margin-right:auto}.column{flex-direction:column;flex-basis:0;padding:.5rem}.column,.row{display:flex;flex-grow:1;flex-shrink:1}.row{flex-direction:row}.is-fullheight{min-height:100vh}.flex-center{display:flex;height:100%;width:100%;align-items:center;justify-content:center}.breakout-wrapper,article{display:grid;grid-template-columns:[full-start] minmax(1em,1fr) [content-start] minmax(0,768px) [content-end] minmax(1em,1fr) [full-end]}.breakout-wrapper[style*="--breakout-width"]{grid-template-columns:[full-start] minmax(1em,1fr) [content-start] minmax(0,var(--breakout-width)) [content-end] minmax(1em,1fr) [full-end]}.breakout-wrapper>*,article>*{grid-column:content}.breakout{grid-column:full}section{display:flex;flex-direction:column;max-width:768px;margin:auto;padding:2rem .5rem}footer{display:flex;align-items:center;justify-content:center;padding:2rem 1rem 1rem}form{width:100%}form .field{display:flex;flex-direction:column;width:100%;margin:1rem 0 .5rem}form .field .help{padding-top:.25rem;font-size:.75em;opacity:.75}input,select,textarea{border:1px solid #000;border-radius:3px;padding:.75rem;transition:box-shadow .2s ease-in-out;font-size:.85em}input:active,input:focus,select:active,select:focus,textarea:active,textarea:focus{border:1px solid #000;box-shadow:0 8px 15px rgba(0,0,0,.1);outline:none}label{margin:.5rem 0 .25rem}button,select{cursor:pointer}button{font-size:.85em;border:none;border-radius:3px;padding:.75rem 1rem;margin:1rem 0 .5rem;background-color:#d4d4d4;transition:transform .1s ease-out,box-shadow .1s ease-out,-webkit-filter .2s ease-in-out;transition:filter .2s ease-in-out,transform .1s ease-out,box-shadow .1s ease-out;transition:filter .2s ease-in-out,transform .1s ease-out,box-shadow .1s ease-out,-webkit-filter .2s ease-in-out}button.lighten:hover{-webkit-filter:brightness(110%);filter:brightness(110%)}button:hover{-webkit-filter:brightness(90%);filter:brightness(90%);box-shadow:0 8px 15px rgba(0,0,0,.1)}button:active{transform:scale(.95)}button:focus{outline:none}table{border-collapse:collapse;margin:1rem 0 .5rem}td,th{border:1px solid #999;padding:.5rem;text-align:left;font-size:.8em}.table-container{max-width:100%;overflow-x:scroll}.box{border-radius:3px;padding:1rem;box-shadow:0 8px 15px rgba(0,0,0,.1)}ol,ul{margin:.25rem 0 1rem;padding:0}ul{list-style:disc inside}ul ul{list-style-type:circle}ol{list-style:decimal inside}ol ol{list-style-type:lower-alpha}figure{margin:0;padding:.25rem}figure picture img{width:100%;height:auto}figure figcaption{font-size:.75em;opacity:.75;font-style:italic;text-align:center;margin-bottom:1rem}picture[style*="--aspect-ratio"]>:first-child{width:100%}picture[style*="--aspect-ratio"]>img{height:auto}@supports (--custom:property){picture[style*="--aspect-ratio"]{position:relative}picture[style*="--aspect-ratio"]:before{content:"";display:block;padding-bottom:calc(100%/var(--aspect-ratio))}picture[style*="--aspect-ratio"]>:first-child{position:absolute;top:0;left:0;height:100%}}hr{height:2px;background-color:#000;width:100%;border:none;outline:none;border-radius:1px;margin:1rem 0}.bg-navy{background-color:#001f3f}.bg-blue{background-color:#0074d9}.bg-aqua{background-color:#7fdbff}.bg-teal{background-color:#39cccc}.bg-olive{background-color:#3d9970}.bg-green{background-color:#2ecc40}.bg-lime{background-color:#01ff70}.bg-yellow{background-color:#ffdc00}.bg-orange{background-color:#ff851b}.bg-red{background-color:#ff4136}.bg-fuchsia{background-color:#f012be}.bg-purple{background-color:#b10dc9}.bg-maroon{background-color:#85144b}.bg-white{background-color:#fff}.bg-gray{background-color:#aaa}.bg-silver{background-color:#ddd}.bg-black{background-color:#111}.navy{color:#001f3f}.blue{color:#0074d9}.aqua{color:#7fdbff}.teal{color:#39cccc}.olive{color:#3d9970}.green{color:#2ecc40}.lime{color:#01ff70}.yellow{color:#ffdc00}.orange{color:#ff851b}.red{color:#ff4136}.fuchsia{color:#f012be}.purple{color:#b10dc9}.maroon{color:#85144b}.white{color:#fff}.silver{color:#ddd}.gray{color:#aaa}.black{color:#111}.border--navy{border-color:#001f3f}.border--blue{border-color:#0074d9}.border--aqua{border-color:#7fdbff}.border--teal{border-color:#39cccc}.border--olive{border-color:#3d9970}.border--green{border-color:#2ecc40}.border--lime{border-color:#01ff70}.border--yellow{border-color:#ffdc00}.border--orange{border-color:#ff851b}.border--red{border-color:#ff4136}.border--fuchsia{border-color:#f012be}.border--purple{border-color:#b10dc9}.border--maroon{border-color:#85144b}.border--white{border-color:#fff}.border--gray{border-color:#aaa}.border--silver{border-color:#ddd}.border--black{border-color:#111} +/*# sourceMappingURL=main.aa471670.css.map */ \ No newline at end of file diff --git a/dist/main.aa471670.css.map b/dist/main.aa471670.css.map new file mode 100644 index 0000000..7dcb111 --- /dev/null +++ b/dist/main.aa471670.css.map @@ -0,0 +1 @@ +{"version":3,"sources":["normalize.css","scss\\_base.scss","scss\\_utils.scss","scss\\_responsive_helpers.scss","scss\\_raster.scss","scss\\_typography.scss","scss\\_variables.scss","scss\\_layout.scss","scss\\_forms.scss","scss\\_elements.scss","scss\\_colors.scss"],"names":[],"mappings":"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","file":"main.aa471670.css","sourceRoot":"..","sourcesContent":["/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */\n\n/* Document\n ========================================================================== */\n\n/**\n * 1. Correct the line height in all browsers.\n * 2. Prevent adjustments of font size after orientation changes in iOS.\n */\n\nhtml {\n line-height: 1.15; /* 1 */\n -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/* Sections\n ========================================================================== */\n\n/**\n * Remove the margin in all browsers.\n */\n\nbody {\n margin: 0;\n}\n\n/**\n * Render the `main` element consistently in IE.\n */\n\nmain {\n display: block;\n}\n\n/**\n * Correct the font size and margin on `h1` elements within `section` and\n * `article` contexts in Chrome, Firefox, and Safari.\n */\n\nh1 {\n font-size: 2em;\n margin: 0.67em 0;\n}\n\n/* Grouping content\n ========================================================================== */\n\n/**\n * 1. Add the correct box sizing in Firefox.\n * 2. Show the overflow in Edge and IE.\n */\n\nhr {\n box-sizing: content-box; /* 1 */\n height: 0; /* 1 */\n overflow: visible; /* 2 */\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n */\n\npre {\n font-family: monospace, monospace; /* 1 */\n font-size: 1em; /* 2 */\n}\n\n/* Text-level semantics\n ========================================================================== */\n\n/**\n * Remove the gray background on active links in IE 10.\n */\n\na {\n background-color: transparent;\n}\n\n/**\n * 1. Remove the bottom border in Chrome 57-\n * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\n */\n\nabbr[title] {\n border-bottom: none; /* 1 */\n text-decoration: underline; /* 2 */\n text-decoration: underline dotted; /* 2 */\n}\n\n/**\n * Add the correct font weight in Chrome, Edge, and Safari.\n */\n\nb,\nstrong {\n font-weight: bolder;\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n */\n\ncode,\nkbd,\nsamp {\n font-family: monospace, monospace; /* 1 */\n font-size: 1em; /* 2 */\n}\n\n/**\n * Add the correct font size in all browsers.\n */\n\nsmall {\n font-size: 80%;\n}\n\n/**\n * Prevent `sub` and `sup` elements from affecting the line height in\n * all browsers.\n */\n\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n\nsub {\n bottom: -0.25em;\n}\n\nsup {\n top: -0.5em;\n}\n\n/* Embedded content\n ========================================================================== */\n\n/**\n * Remove the border on images inside links in IE 10.\n */\n\nimg {\n border-style: none;\n}\n\n/* Forms\n ========================================================================== */\n\n/**\n * 1. Change the font styles in all browsers.\n * 2. Remove the margin in Firefox and Safari.\n */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n font-family: inherit; /* 1 */\n font-size: 100%; /* 1 */\n line-height: 1.15; /* 1 */\n margin: 0; /* 2 */\n}\n\n/**\n * Show the overflow in IE.\n * 1. Show the overflow in Edge.\n */\n\nbutton,\ninput { /* 1 */\n overflow: visible;\n}\n\n/**\n * Remove the inheritance of text transform in Edge, Firefox, and IE.\n * 1. Remove the inheritance of text transform in Firefox.\n */\n\nbutton,\nselect { /* 1 */\n text-transform: none;\n}\n\n/**\n * Correct the inability to style clickable types in iOS and Safari.\n */\n\nbutton,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"] {\n -webkit-appearance: button;\n}\n\n/**\n * Remove the inner border and padding in Firefox.\n */\n\nbutton::-moz-focus-inner,\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner {\n border-style: none;\n padding: 0;\n}\n\n/**\n * Restore the focus styles unset by the previous rule.\n */\n\nbutton:-moz-focusring,\n[type=\"button\"]:-moz-focusring,\n[type=\"reset\"]:-moz-focusring,\n[type=\"submit\"]:-moz-focusring {\n outline: 1px dotted ButtonText;\n}\n\n/**\n * Correct the padding in Firefox.\n */\n\nfieldset {\n padding: 0.35em 0.75em 0.625em;\n}\n\n/**\n * 1. Correct the text wrapping in Edge and IE.\n * 2. Correct the color inheritance from `fieldset` elements in IE.\n * 3. Remove the padding so developers are not caught out when they zero out\n * `fieldset` elements in all browsers.\n */\n\nlegend {\n box-sizing: border-box; /* 1 */\n color: inherit; /* 2 */\n display: table; /* 1 */\n max-width: 100%; /* 1 */\n padding: 0; /* 3 */\n white-space: normal; /* 1 */\n}\n\n/**\n * Add the correct vertical alignment in Chrome, Firefox, and Opera.\n */\n\nprogress {\n vertical-align: baseline;\n}\n\n/**\n * Remove the default vertical scrollbar in IE 10+.\n */\n\ntextarea {\n overflow: auto;\n}\n\n/**\n * 1. Add the correct box sizing in IE 10.\n * 2. Remove the padding in IE 10.\n */\n\n[type=\"checkbox\"],\n[type=\"radio\"] {\n box-sizing: border-box; /* 1 */\n padding: 0; /* 2 */\n}\n\n/**\n * Correct the cursor style of increment and decrement buttons in Chrome.\n */\n\n[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button {\n height: auto;\n}\n\n/**\n * 1. Correct the odd appearance in Chrome and Safari.\n * 2. Correct the outline style in Safari.\n */\n\n[type=\"search\"] {\n -webkit-appearance: textfield; /* 1 */\n outline-offset: -2px; /* 2 */\n}\n\n/**\n * Remove the inner padding in Chrome and Safari on macOS.\n */\n\n[type=\"search\"]::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/**\n * 1. Correct the inability to style clickable types in iOS and Safari.\n * 2. Change font properties to `inherit` in Safari.\n */\n\n::-webkit-file-upload-button {\n -webkit-appearance: button; /* 1 */\n font: inherit; /* 2 */\n}\n\n/* Interactive\n ========================================================================== */\n\n/*\n * Add the correct display in Edge, IE 10+, and Firefox.\n */\n\ndetails {\n display: block;\n}\n\n/*\n * Add the correct display in all browsers.\n */\n\nsummary {\n display: list-item;\n}\n\n/* Misc\n ========================================================================== */\n\n/**\n * Add the correct display in IE 10+.\n */\n\ntemplate {\n display: none;\n}\n\n/**\n * Add the correct display in IE 10.\n */\n\n[hidden] {\n display: none;\n}\n","@font-face {\r\n font-family: 'Public Sans';\r\n src: local('Public Sans'), url('./fonts/Public-Sans-Roman.ttf') format('truetype');\r\n}\r\n\r\n@font-face {\r\n font-family: 'Butler';\r\n src: local('Butler Regular'), url('./fonts/Butler_Regular.otf');\r\n font-weight: 400;\r\n}\r\n\r\n@font-face {\r\n font-family: 'Butler';\r\n src: local('Butler Bold'), url('./fonts/Butler_Bold.otf');\r\n font-weight: 800;\r\n}\r\n\r\n@font-face {\r\n font-family: 'Butler';\r\n src: local('Butler Light'), url('./fonts/Butler_Light.otf');\r\n font-weight: 200;\r\n}\r\n\r\n*,\r\n:before,\r\n:after {\r\n box-sizing: border-box;\r\n}\r\n\r\n:root {\r\n scroll-behavior: smooth;\r\n text-rendering: optimizeLegibility;\r\n}\r\n\r\nhtml {\r\n -moz-osx-font-smoothing: grayscale;\r\n -webkit-font-smoothing: antialiased\r\n}\r\n",".no-pad {\r\n padding: 0 !important;\r\n}\r\n\r\n.no-margin {\r\n margin: 0 !important;\r\n}\r\n\r\n.is-flex {\r\n display: flex;\r\n}\r\n\r\n// margins\r\n.mt {\r\n &-0 {\r\n margin-top: 0;\r\n }\r\n &-1 {\r\n margin-top: 0.75rem;\r\n }\r\n &-2 {\r\n margin-top: 1.25rem;\r\n }\r\n &-3 {\r\n margin-top: 1.75rem;\r\n }\r\n &-4 {\r\n margin-top: 2.25rem;\r\n }\r\n &-5 {\r\n margin-top: 2.75rem;\r\n }\r\n}\r\n\r\n.mb {\r\n &-0 {\r\n margin-bottom: 0;\r\n }\r\n &-1 {\r\n margin-bottom: 0.75rem;\r\n }\r\n &-2 {\r\n margin-bottom: 1.25rem;\r\n }\r\n &-3 {\r\n margin-bottom: 1.75rem;\r\n }\r\n &-4 {\r\n margin-bottom: 2.25rem;\r\n }\r\n &-5 {\r\n margin-bottom: 2.75rem;\r\n }\r\n}\r\n\r\n.mr {\r\n &-0 {\r\n margin-right: 0;\r\n }\r\n &-1 {\r\n margin-right: 0.75rem;\r\n }\r\n &-2 {\r\n margin-right: 1.25rem;\r\n }\r\n &-3 {\r\n margin-right: 1.75rem;\r\n }\r\n &-4 {\r\n margin-right: 2.25rem;\r\n }\r\n &-5 {\r\n margin-right: 2.75rem;\r\n }\r\n}\r\n\r\n.ml {\r\n &-0 {\r\n margin-left: 0;\r\n }\r\n &-1 {\r\n margin-left: 0.75rem;\r\n }\r\n &-2 {\r\n margin-left: 1.25rem;\r\n }\r\n &-3 {\r\n margin-left: 1.75rem;\r\n }\r\n &-4 {\r\n margin-left: 2.25rem;\r\n }\r\n &-5 {\r\n margin-left: 2.75rem;\r\n }\r\n}\r\n\r\n.mx-auto {\r\n margin-left: auto;\r\n margin-right: auto;\r\n}\r\n\r\n// padding\r\n\r\n.pt {\r\n &-0 {\r\n padding-top: 0;\r\n }\r\n &-1 {\r\n padding-top: 0.75rem;\r\n }\r\n &-2 {\r\n padding-top: 1.25rem;\r\n }\r\n &-3 {\r\n padding-top: 1.75rem;\r\n }\r\n &-4 {\r\n padding-top: 2.25rem;\r\n }\r\n &-5 {\r\n padding-top: 2.75rem;\r\n }\r\n}\r\n\r\n.pr {\r\n &-0 {\r\n padding-right: 0;\r\n }\r\n &-1 {\r\n padding-right: 0.75rem;\r\n }\r\n &-2 {\r\n padding-right: 1.25rem;\r\n }\r\n &-3 {\r\n padding-right: 1.75rem;\r\n }\r\n &-4 {\r\n padding-right: 2.25rem;\r\n }\r\n &-5 {\r\n padding-right: 2.75rem;\r\n }\r\n}\r\n.pb {\r\n &-0 {\r\n padding-bottom: 0;\r\n }\r\n &-1 {\r\n padding-bottom: 0.75rem;\r\n }\r\n &-2 {\r\n padding-bottom: 1.25rem;\r\n }\r\n &-3 {\r\n padding-bottom: 1.75rem;\r\n }\r\n &-4 {\r\n padding-bottom: 2.25rem;\r\n }\r\n &-5 {\r\n padding-bottom: 2.75rem;\r\n }\r\n}\r\n.pl {\r\n &-0 {\r\n padding-left: 0;\r\n }\r\n &-1 {\r\n padding-left: 0.75rem;\r\n }\r\n &-2 {\r\n padding-left: 1.25rem;\r\n }\r\n &-3 {\r\n padding-left: 1.75rem;\r\n }\r\n &-4 {\r\n padding-left: 2.25rem;\r\n }\r\n &-5 {\r\n padding-left: 2.75rem;\r\n }\r\n}\r\n\r\n.border {\r\n border: solid 1px;\r\n}","// helpers stolen from Bulma css\r\n\r\n.is-hidden {\r\n display: none !important;\r\n}\r\n\r\n.is-sr-only {\r\n border: none !important;\r\n clip: rect(0, 0, 0, 0) !important;\r\n height: 0.01em !important;\r\n overflow: hidden !important;\r\n padding: 0 !important;\r\n position: absolute !important;\r\n white-space: nowrap !important;\r\n width: 0.01em !important;\r\n}\r\n\r\n@media screen and (max-width: $mobile) {\r\n .is-hidden-mobile {\r\n display: none !important;\r\n }\r\n}\r\n\r\n@media screen and (min-width: $tablet),\r\nprint {\r\n .is-hidden-tablet {\r\n display: none !important;\r\n }\r\n}\r\n\r\n@media screen and (min-width: $tablet) and (max-width: $desktop) {\r\n .is-hidden-tablet-only {\r\n display: none !important;\r\n }\r\n}\r\n\r\n@media screen and (max-width: $desktop) {\r\n .is-hidden-touch {\r\n display: none !important;\r\n }\r\n}\r\n\r\n@media screen and (min-width: $desktop) {\r\n .is-hidden-desktop {\r\n display: none !important;\r\n }\r\n}\r\n\r\n@media screen and (min-width: $desktop) and (max-width: $widescreen) {\r\n .is-hidden-desktop-only {\r\n display: none !important;\r\n }\r\n}\r\n\r\n@media screen and (min-width: $widescreen) {\r\n .is-hidden-widescreen {\r\n display: none !important;\r\n }\r\n}\r\n\r\n@media screen and (min-width: $widescreen) and (max-width: $fullhd) {\r\n .is-hidden-widescreen-only {\r\n display: none !important;\r\n }\r\n}\r\n\r\n@media screen and (min-width: $fullhd) {\r\n .is-hidden-fullhd {\r\n display: none !important;\r\n }\r\n}","/* Raster grid subsystem (rsms.me/raster) \r\n\r\n Extended to support:\r\n + grid rows\r\n + sass variables\r\n + arbitrary number of rows and columns\r\n \r\n by Siddharth S. (github.com/siddharthsham) \r\n\r\n*/\r\n\r\n\r\nr-grid {\r\n display: grid;\r\n --grid-tc: #{$grid-tc};\r\n --grid-tr: #{$grid-tr};\r\n --col-gap: #{$col-gap};\r\n --row-gap: #{$row-gap};\r\n\r\n gap: var(--row-gap) var(--col-gap);\r\n grid-template-columns: var(--grid-tc);\r\n grid-template-rows: var(--grid-tr);\r\n --grid-cs: #{$grid-cs};\r\n /* column start */\r\n --grid-ce: #{$grid-ce};\r\n /* column end */\r\n --grid-rs: #{$grid-rs};\r\n --grid-re: #{$grid-re};\r\n}\r\n\r\n/* r-cell -- cell or column */\r\nr-grid>r-cell {\r\n display: block;\r\n appearance: none;\r\n -webkit-appearance: none\r\n}\r\n\r\nr-grid[style*=\"--col-gap\"] {\r\n --col-gap: var(--col-gap);\r\n}\r\n\r\nr-grid[style*=\"--row-gap\"] {\r\n --row-gap: var(--row-gap);\r\n}\r\n\r\n/* Accept arbitrary number of rows and columns */\r\nr-grid[style*=\"--columns\"] {\r\n --grid-tc: repeat(var(--columns), 1fr)\r\n}\r\n\r\nr-grid[style*=\"--rows\"] {\r\n --grid-tr: repeat(var(--rows), 1fr)\r\n}\r\n\r\n/* Fixed column counts: */\r\nr-grid[columns=\"1\"] {\r\n --grid-tc: repeat(1, 1fr)\r\n}\r\n\r\nr-grid[columns=\"2\"] {\r\n --grid-tc: repeat(2, 1fr)\r\n}\r\n\r\nr-grid[columns=\"3\"] {\r\n --grid-tc: repeat(3, 1fr)\r\n}\r\n\r\nr-grid[columns=\"4\"] {\r\n --grid-tc: repeat(4, 1fr)\r\n}\r\n\r\nr-grid[columns=\"5\"] {\r\n --grid-tc: repeat(5, 1fr)\r\n}\r\n\r\nr-grid[columns=\"6\"] {\r\n --grid-tc: repeat(6, 1fr)\r\n}\r\n\r\nr-grid[columns=\"7\"] {\r\n --grid-tc: repeat(7, 1fr)\r\n}\r\n\r\nr-grid[columns=\"8\"] {\r\n --grid-tc: repeat(8, 1fr)\r\n}\r\n\r\nr-grid[columns=\"9\"] {\r\n --grid-tc: repeat(9, 1fr)\r\n}\r\n\r\nr-grid[columns=\"10\"] {\r\n --grid-tc: repeat(10, 1fr)\r\n}\r\n\r\nr-grid[columns=\"11\"] {\r\n --grid-tc: repeat(11, 1fr)\r\n}\r\n\r\nr-grid[columns=\"12\"] {\r\n --grid-tc: repeat(12, 1fr)\r\n}\r\n\r\n/* colspan=start... */\r\nr-grid>r-cell[colspan^=\"1\"] {\r\n --grid-cs: 1\r\n}\r\n\r\nr-grid>r-cell[colspan^=\"2\"] {\r\n --grid-cs: 2\r\n}\r\n\r\nr-grid>r-cell[colspan^=\"3\"] {\r\n --grid-cs: 3\r\n}\r\n\r\nr-grid>r-cell[colspan^=\"4\"] {\r\n --grid-cs: 4\r\n}\r\n\r\nr-grid>r-cell[colspan^=\"5\"] {\r\n --grid-cs: 5\r\n}\r\n\r\nr-grid>r-cell[colspan^=\"6\"] {\r\n --grid-cs: 6\r\n}\r\n\r\nr-grid>r-cell[colspan^=\"7\"] {\r\n --grid-cs: 7\r\n}\r\n\r\nr-grid>r-cell[colspan^=\"8\"] {\r\n --grid-cs: 8\r\n}\r\n\r\nr-grid>r-cell[colspan^=\"9\"] {\r\n --grid-cs: 9\r\n}\r\n\r\nr-grid>r-cell[colspan^=\"10\"] {\r\n --grid-cs: 10\r\n}\r\n\r\nr-grid>r-cell[colspan^=\"11\"] {\r\n --grid-cs: 11\r\n}\r\n\r\nr-grid>r-cell[colspan^=\"12\"] {\r\n --grid-cs: 12\r\n}\r\n\r\n/* colspan=...+width, colspan=...-end */\r\nr-grid>r-cell[colspan$=\"+1\"],\r\nr-grid>r-cell[colspan=\"1\"] {\r\n --grid-ce: 1\r\n}\r\n\r\nr-grid>r-cell[colspan$=\"+2\"],\r\nr-grid>r-cell[colspan$=\"-1\"],\r\nr-grid>r-cell[colspan=\"2\"] {\r\n --grid-ce: 2\r\n}\r\n\r\nr-grid>r-cell[colspan$=\"+3\"],\r\nr-grid>r-cell[colspan$=\"-2\"],\r\nr-grid>r-cell[colspan=\"3\"] {\r\n --grid-ce: 3\r\n}\r\n\r\nr-grid>r-cell[colspan$=\"+4\"],\r\nr-grid>r-cell[colspan$=\"-3\"],\r\nr-grid>r-cell[colspan=\"4\"] {\r\n --grid-ce: 4\r\n}\r\n\r\nr-grid>r-cell[colspan$=\"+5\"],\r\nr-grid>r-cell[colspan$=\"-4\"],\r\nr-grid>r-cell[colspan=\"5\"] {\r\n --grid-ce: 5\r\n}\r\n\r\nr-grid>r-cell[colspan$=\"+6\"],\r\nr-grid>r-cell[colspan$=\"-5\"],\r\nr-grid>r-cell[colspan=\"6\"] {\r\n --grid-ce: 6\r\n}\r\n\r\nr-grid>r-cell[colspan$=\"+7\"],\r\nr-grid>r-cell[colspan$=\"-6\"],\r\nr-grid>r-cell[colspan=\"7\"] {\r\n --grid-ce: 7\r\n}\r\n\r\nr-grid>r-cell[colspan$=\"+8\"],\r\nr-grid>r-cell[colspan$=\"-7\"],\r\nr-grid>r-cell[colspan=\"8\"] {\r\n --grid-ce: 8\r\n}\r\n\r\nr-grid>r-cell[colspan$=\"+9\"],\r\nr-grid>r-cell[colspan$=\"-8\"],\r\nr-grid>r-cell[colspan=\"9\"] {\r\n --grid-ce: 9\r\n}\r\n\r\nr-grid>r-cell[colspan$=\"+10\"],\r\nr-grid>r-cell[colspan$=\"-9\"],\r\nr-grid>r-cell[colspan=\"10\"] {\r\n --grid-ce: 10\r\n}\r\n\r\nr-grid>r-cell[colspan$=\"+11\"],\r\nr-grid>r-cell[colspan$=\"-10\"],\r\nr-grid>r-cell[colspan=\"11\"] {\r\n --grid-ce: 11\r\n}\r\n\r\nr-grid>r-cell[colspan$=\"+12\"],\r\nr-grid>r-cell[colspan$=\"-11\"],\r\nr-grid>r-cell[colspan=\"12\"] {\r\n --grid-ce: 12\r\n}\r\n\r\nr-grid>r-cell[colspan$=\"-12\"] {\r\n --grid-ce: 13\r\n}\r\n\r\n/* connect vars */\r\nr-grid>r-cell[colspan] {\r\n grid-column-end: span var(--grid-ce)\r\n}\r\n\r\nr-grid>r-cell[colspan*=\"+\"],\r\nr-grid>r-cell[colspan*=\"-\"],\r\nr-grid>r-cell[colspan*=\"..\"] {\r\n grid-column-start: var(--grid-cs)\r\n}\r\n\r\nr-grid>r-cell[colspan*=\"-\"],\r\nr-grid>r-cell[colspan*=\"..\"] {\r\n grid-column-end: var(--grid-ce)\r\n}\r\n\r\nr-grid>r-cell[colspan=\"row\"] {\r\n grid-column: 1 / -1\r\n}\r\n\r\n/* for window width <= 768 */\r\n@media only screen and (max-width: 768px) {\r\n r-grid[columns-s=\"1\"] {\r\n --grid-tc: repeat(1, 1fr)\r\n }\r\n\r\n r-grid[columns-s=\"2\"] {\r\n --grid-tc: repeat(2, 1fr)\r\n }\r\n\r\n r-grid[columns-s=\"3\"] {\r\n --grid-tc: repeat(3, 1fr)\r\n }\r\n\r\n r-grid[columns-s=\"4\"] {\r\n --grid-tc: repeat(4, 1fr)\r\n }\r\n\r\n r-grid[columns-s=\"5\"] {\r\n --grid-tc: repeat(5, 1fr)\r\n }\r\n\r\n r-grid[columns-s=\"6\"] {\r\n --grid-tc: repeat(6, 1fr)\r\n }\r\n\r\n r-grid[columns-s=\"7\"] {\r\n --grid-tc: repeat(7, 1fr)\r\n }\r\n\r\n r-grid[columns-s=\"8\"] {\r\n --grid-tc: repeat(8, 1fr)\r\n }\r\n\r\n r-grid[columns-s=\"9\"] {\r\n --grid-tc: repeat(9, 1fr)\r\n }\r\n\r\n r-grid[columns-s=\"10\"] {\r\n --grid-tc: repeat(10, 1fr)\r\n }\r\n\r\n r-grid[columns-s=\"11\"] {\r\n --grid-tc: repeat(11, 1fr)\r\n }\r\n\r\n r-grid[columns-s=\"12\"] {\r\n --grid-tc: repeat(12, 1fr)\r\n }\r\n\r\n /* colspan-s=start... */\r\n r-grid>r-cell[colspan-s^=\"1\"] {\r\n --grid-cs: 1\r\n }\r\n\r\n r-grid>r-cell[colspan-s^=\"2\"] {\r\n --grid-cs: 2\r\n }\r\n\r\n r-grid>r-cell[colspan-s^=\"3\"] {\r\n --grid-cs: 3\r\n }\r\n\r\n r-grid>r-cell[colspan-s^=\"4\"] {\r\n --grid-cs: 4\r\n }\r\n\r\n r-grid>r-cell[colspan-s^=\"5\"] {\r\n --grid-cs: 5\r\n }\r\n\r\n r-grid>r-cell[colspan-s^=\"6\"] {\r\n --grid-cs: 6\r\n }\r\n\r\n r-grid>r-cell[colspan-s^=\"7\"] {\r\n --grid-cs: 7\r\n }\r\n\r\n r-grid>r-cell[colspan-s^=\"8\"] {\r\n --grid-cs: 8\r\n }\r\n\r\n r-grid>r-cell[colspan-s^=\"9\"] {\r\n --grid-cs: 9\r\n }\r\n\r\n r-grid>r-cell[colspan-s^=\"10\"] {\r\n --grid-cs: 10\r\n }\r\n\r\n r-grid>r-cell[colspan-s^=\"11\"] {\r\n --grid-cs: 11\r\n }\r\n\r\n r-grid>r-cell[colspan-s^=\"12\"] {\r\n --grid-cs: 12\r\n }\r\n\r\n /* colspan-s=...+width, colspan-s=...-end */\r\n r-grid>r-cell[colspan-s$=\"+1\"],\r\n r-grid>r-cell[colspan-s=\"1\"] {\r\n --grid-ce: 1\r\n }\r\n\r\n r-grid>r-cell[colspan-s$=\"+2\"],\r\n r-grid>r-cell[colspan-s$=\"-1\"],\r\n r-grid>r-cell[colspan-s=\"2\"] {\r\n --grid-ce: 2\r\n }\r\n\r\n r-grid>r-cell[colspan-s$=\"+3\"],\r\n r-grid>r-cell[colspan-s$=\"-2\"],\r\n r-grid>r-cell[colspan-s=\"3\"] {\r\n --grid-ce: 3\r\n }\r\n\r\n r-grid>r-cell[colspan-s$=\"+4\"],\r\n r-grid>r-cell[colspan-s$=\"-3\"],\r\n r-grid>r-cell[colspan-s=\"4\"] {\r\n --grid-ce: 4\r\n }\r\n\r\n r-grid>r-cell[colspan-s$=\"+5\"],\r\n r-grid>r-cell[colspan-s$=\"-4\"],\r\n r-grid>r-cell[colspan-s=\"5\"] {\r\n --grid-ce: 5\r\n }\r\n\r\n r-grid>r-cell[colspan-s$=\"+6\"],\r\n r-grid>r-cell[colspan-s$=\"-5\"],\r\n r-grid>r-cell[colspan-s=\"6\"] {\r\n --grid-ce: 6\r\n }\r\n\r\n r-grid>r-cell[colspan-s$=\"+7\"],\r\n r-grid>r-cell[colspan-s$=\"-6\"],\r\n r-grid>r-cell[colspan-s=\"7\"] {\r\n --grid-ce: 7\r\n }\r\n\r\n r-grid>r-cell[colspan-s$=\"+8\"],\r\n r-grid>r-cell[colspan-s$=\"-7\"],\r\n r-grid>r-cell[colspan-s=\"8\"] {\r\n --grid-ce: 8\r\n }\r\n\r\n r-grid>r-cell[colspan-s$=\"+9\"],\r\n r-grid>r-cell[colspan-s$=\"-8\"],\r\n r-grid>r-cell[colspan-s=\"9\"] {\r\n --grid-ce: 9\r\n }\r\n\r\n r-grid>r-cell[colspan-s$=\"+10\"],\r\n r-grid>r-cell[colspan-s$=\"-9\"],\r\n r-grid>r-cell[colspan-s=\"10\"] {\r\n --grid-ce: 10\r\n }\r\n\r\n r-grid>r-cell[colspan-s$=\"+11\"],\r\n r-grid>r-cell[colspan-s$=\"-10\"],\r\n r-grid>r-cell[colspan-s=\"11\"] {\r\n --grid-ce: 11\r\n }\r\n\r\n r-grid>r-cell[colspan-s$=\"+12\"],\r\n r-grid>r-cell[colspan-s$=\"-11\"],\r\n r-grid>r-cell[colspan-s=\"12\"] {\r\n --grid-ce: 12\r\n }\r\n\r\n r-grid>r-cell[colspan-s$=\"-12\"] {\r\n --grid-ce: 13\r\n }\r\n\r\n /* connect vars */\r\n r-grid>r-cell[colspan-s] {\r\n grid-column-end: span var(--grid-ce)\r\n }\r\n\r\n r-grid>r-cell[colspan-s*=\"+\"],\r\n r-grid>r-cell[colspan-s*=\"-\"],\r\n r-grid>r-cell[colspan-s*=\"..\"] {\r\n grid-column-start: var(--grid-cs)\r\n }\r\n\r\n r-grid>r-cell[colspan-s*=\"-\"],\r\n r-grid>r-cell[colspan-s*=\"..\"] {\r\n grid-column-end: var(--grid-ce)\r\n }\r\n\r\n r-grid>r-cell[colspan-s=\"row\"] {\r\n grid-column: 1 / -1\r\n }\r\n}\r\n\r\n/* for window width >= 1600 */\r\n@media only screen and (min-width: 1599px) {\r\n r-grid[columns-l=\"1\"] {\r\n --grid-tc: repeat(1, 1fr)\r\n }\r\n\r\n r-grid[columns-l=\"2\"] {\r\n --grid-tc: repeat(2, 1fr)\r\n }\r\n\r\n r-grid[columns-l=\"3\"] {\r\n --grid-tc: repeat(3, 1fr)\r\n }\r\n\r\n r-grid[columns-l=\"4\"] {\r\n --grid-tc: repeat(4, 1fr)\r\n }\r\n\r\n r-grid[columns-l=\"5\"] {\r\n --grid-tc: repeat(5, 1fr)\r\n }\r\n\r\n r-grid[columns-l=\"6\"] {\r\n --grid-tc: repeat(6, 1fr)\r\n }\r\n\r\n r-grid[columns-l=\"7\"] {\r\n --grid-tc: repeat(7, 1fr)\r\n }\r\n\r\n r-grid[columns-l=\"8\"] {\r\n --grid-tc: repeat(8, 1fr)\r\n }\r\n\r\n r-grid[columns-l=\"9\"] {\r\n --grid-tc: repeat(9, 1fr)\r\n }\r\n\r\n r-grid[columns-l=\"10\"] {\r\n --grid-tc: repeat(10, 1fr)\r\n }\r\n\r\n r-grid[columns-l=\"11\"] {\r\n --grid-tc: repeat(11, 1fr)\r\n }\r\n\r\n r-grid[columns-l=\"12\"] {\r\n --grid-tc: repeat(12, 1fr)\r\n }\r\n\r\n /* colspan-l=start... */\r\n r-grid>r-cell[colspan-l^=\"1\"] {\r\n --grid-cs: 1\r\n }\r\n\r\n r-grid>r-cell[colspan-l^=\"2\"] {\r\n --grid-cs: 2\r\n }\r\n\r\n r-grid>r-cell[colspan-l^=\"3\"] {\r\n --grid-cs: 3\r\n }\r\n\r\n r-grid>r-cell[colspan-l^=\"4\"] {\r\n --grid-cs: 4\r\n }\r\n\r\n r-grid>r-cell[colspan-l^=\"5\"] {\r\n --grid-cs: 5\r\n }\r\n\r\n r-grid>r-cell[colspan-l^=\"6\"] {\r\n --grid-cs: 6\r\n }\r\n\r\n r-grid>r-cell[colspan-l^=\"7\"] {\r\n --grid-cs: 7\r\n }\r\n\r\n r-grid>r-cell[colspan-l^=\"8\"] {\r\n --grid-cs: 8\r\n }\r\n\r\n r-grid>r-cell[colspan-l^=\"9\"] {\r\n --grid-cs: 9\r\n }\r\n\r\n r-grid>r-cell[colspan-l^=\"10\"] {\r\n --grid-cs: 10\r\n }\r\n\r\n r-grid>r-cell[colspan-l^=\"11\"] {\r\n --grid-cs: 11\r\n }\r\n\r\n r-grid>r-cell[colspan-l^=\"12\"] {\r\n --grid-cs: 12\r\n }\r\n\r\n /* colspan-l=...+width, colspan-l=...-end */\r\n r-grid>r-cell[colspan-l$=\"+1\"],\r\n r-grid>r-cell[colspan-l=\"1\"] {\r\n --grid-ce: 1\r\n }\r\n\r\n r-grid>r-cell[colspan-l$=\"+2\"],\r\n r-grid>r-cell[colspan-l$=\"-1\"],\r\n r-grid>r-cell[colspan-l=\"2\"] {\r\n --grid-ce: 2\r\n }\r\n\r\n r-grid>r-cell[colspan-l$=\"+3\"],\r\n r-grid>r-cell[colspan-l$=\"-2\"],\r\n r-grid>r-cell[colspan-l=\"3\"] {\r\n --grid-ce: 3\r\n }\r\n\r\n r-grid>r-cell[colspan-l$=\"+4\"],\r\n r-grid>r-cell[colspan-l$=\"-3\"],\r\n r-grid>r-cell[colspan-l=\"4\"] {\r\n --grid-ce: 4\r\n }\r\n\r\n r-grid>r-cell[colspan-l$=\"+5\"],\r\n r-grid>r-cell[colspan-l$=\"-4\"],\r\n r-grid>r-cell[colspan-l=\"5\"] {\r\n --grid-ce: 5\r\n }\r\n\r\n r-grid>r-cell[colspan-l$=\"+6\"],\r\n r-grid>r-cell[colspan-l$=\"-5\"],\r\n r-grid>r-cell[colspan-l=\"6\"] {\r\n --grid-ce: 6\r\n }\r\n\r\n r-grid>r-cell[colspan-l$=\"+7\"],\r\n r-grid>r-cell[colspan-l$=\"-6\"],\r\n r-grid>r-cell[colspan-l=\"7\"] {\r\n --grid-ce: 7\r\n }\r\n\r\n r-grid>r-cell[colspan-l$=\"+8\"],\r\n r-grid>r-cell[colspan-l$=\"-7\"],\r\n r-grid>r-cell[colspan-l=\"8\"] {\r\n --grid-ce: 8\r\n }\r\n\r\n r-grid>r-cell[colspan-l$=\"+9\"],\r\n r-grid>r-cell[colspan-l$=\"-8\"],\r\n r-grid>r-cell[colspan-l=\"9\"] {\r\n --grid-ce: 9\r\n }\r\n\r\n r-grid>r-cell[colspan-l$=\"+10\"],\r\n r-grid>r-cell[colspan-l$=\"-9\"],\r\n r-grid>r-cell[colspan-l=\"10\"] {\r\n --grid-ce: 10\r\n }\r\n\r\n r-grid>r-cell[colspan-l$=\"+11\"],\r\n r-grid>r-cell[colspan-l$=\"-10\"],\r\n r-grid>r-cell[colspan-l=\"11\"] {\r\n --grid-ce: 11\r\n }\r\n\r\n r-grid>r-cell[colspan-l$=\"+12\"],\r\n r-grid>r-cell[colspan-l$=\"-11\"],\r\n r-grid>r-cell[colspan-l=\"12\"] {\r\n --grid-ce: 12\r\n }\r\n\r\n r-grid>r-cell[colspan-l$=\"-12\"] {\r\n --grid-ce: 13\r\n }\r\n\r\n /* connect vars */\r\n r-grid>r-cell[colspan-l] {\r\n grid-column-end: span var(--grid-ce)\r\n }\r\n\r\n r-grid>r-cell[colspan-l*=\"+\"],\r\n r-grid>r-cell[colspan-l*=\"-\"],\r\n r-grid>r-cell[colspan-l*=\"..\"] {\r\n grid-column-start: var(--grid-cs)\r\n }\r\n\r\n r-grid>r-cell[colspan-l*=\"-\"],\r\n r-grid>r-cell[colspan-l*=\"..\"] {\r\n grid-column-end: var(--grid-ce)\r\n }\r\n\r\n r-grid>r-cell[colspan-l=\"row\"] {\r\n grid-column: 1 / -1\r\n }\r\n}\r\n\r\n/* grid rows */\r\n\r\n/* rows */\r\n\r\nr-grid[rows=\"1\"] {\r\n --grid-tr: repeat(1, 1fr)\r\n}\r\n\r\nr-grid[rows=\"2\"] {\r\n --grid-tr: repeat(2, 1fr)\r\n}\r\n\r\nr-grid[rows=\"3\"] {\r\n --grid-tr: repeat(3, 1fr)\r\n}\r\n\r\nr-grid[rows=\"4\"] {\r\n --grid-tr: repeat(4, 1fr)\r\n}\r\n\r\nr-grid[rows=\"5\"] {\r\n --grid-tr: repeat(5, 1fr)\r\n}\r\n\r\nr-grid[rows=\"6\"] {\r\n --grid-tr: repeat(6, 1fr)\r\n}\r\n\r\nr-grid[rows=\"7\"] {\r\n --grid-tr: repeat(7, 1fr)\r\n}\r\n\r\nr-grid[rows=\"8\"] {\r\n --grid-tr: repeat(8, 1fr)\r\n}\r\n\r\nr-grid[rows=\"9\"] {\r\n --grid-tr: repeat(9, 1fr)\r\n}\r\n\r\nr-grid[rows=\"10\"] {\r\n --grid-tr: repeat(10, 1fr)\r\n}\r\n\r\nr-grid[rows=\"11\"] {\r\n --grid-tr: repeat(11, 1fr)\r\n}\r\n\r\nr-grid[rows=\"12\"] {\r\n --grid-tr: repeat(12, 1fr)\r\n}\r\n\r\n\r\n/* rowspan=start... */\r\nr-grid>r-cell[rowspan^=\"1\"] {\r\n --grid-rs: 1\r\n}\r\n\r\nr-grid>r-cell[rowspan^=\"2\"] {\r\n --grid-rs: 2\r\n}\r\n\r\nr-grid>r-cell[rowspan^=\"3\"] {\r\n --grid-rs: 3\r\n}\r\n\r\nr-grid>r-cell[rowspan^=\"4\"] {\r\n --grid-rs: 4\r\n}\r\n\r\nr-grid>r-cell[rowspan^=\"5\"] {\r\n --grid-rs: 5\r\n}\r\n\r\nr-grid>r-cell[rowspan^=\"6\"] {\r\n --grid-rs: 6\r\n}\r\n\r\nr-grid>r-cell[rowspan^=\"7\"] {\r\n --grid-rs: 7\r\n}\r\n\r\nr-grid>r-cell[rowspan^=\"8\"] {\r\n --grid-rs: 8\r\n}\r\n\r\nr-grid>r-cell[rowspan^=\"9\"] {\r\n --grid-rs: 9\r\n}\r\n\r\nr-grid>r-cell[rowspan^=\"10\"] {\r\n --grid-rs: 10\r\n}\r\n\r\nr-grid>r-cell[rowspan^=\"11\"] {\r\n --grid-rs: 11\r\n}\r\n\r\nr-grid>r-cell[rowspan^=\"12\"] {\r\n --grid-rs: 12\r\n}\r\n\r\n/* rowspan=...+width, rowspan=...-end */\r\nr-grid>r-cell[rowspan$=\"+1\"],\r\nr-grid>r-cell[rowspan=\"1\"] {\r\n --grid-re: 1\r\n}\r\n\r\nr-grid>r-cell[rowspan$=\"+2\"],\r\nr-grid>r-cell[rowspan$=\"-1\"],\r\nr-grid>r-cell[rowspan=\"2\"] {\r\n --grid-re: 2\r\n}\r\n\r\nr-grid>r-cell[rowspan$=\"+3\"],\r\nr-grid>r-cell[rowspan$=\"-2\"],\r\nr-grid>r-cell[rowspan=\"3\"] {\r\n --grid-re: 3\r\n}\r\n\r\nr-grid>r-cell[rowspan$=\"+4\"],\r\nr-grid>r-cell[rowspan$=\"-3\"],\r\nr-grid>r-cell[rowspan=\"4\"] {\r\n --grid-re: 4\r\n}\r\n\r\nr-grid>r-cell[rowspan$=\"+5\"],\r\nr-grid>r-cell[rowspan$=\"-4\"],\r\nr-grid>r-cell[rowspan=\"5\"] {\r\n --grid-re: 5\r\n}\r\n\r\nr-grid>r-cell[rowspan$=\"+6\"],\r\nr-grid>r-cell[rowspan$=\"-5\"],\r\nr-grid>r-cell[rowspan=\"6\"] {\r\n --grid-re: 6\r\n}\r\n\r\nr-grid>r-cell[rowspan$=\"+7\"],\r\nr-grid>r-cell[rowspan$=\"-6\"],\r\nr-grid>r-cell[rowspan=\"7\"] {\r\n --grid-re: 7\r\n}\r\n\r\nr-grid>r-cell[rowspan$=\"+8\"],\r\nr-grid>r-cell[rowspan$=\"-7\"],\r\nr-grid>r-cell[rowspan=\"8\"] {\r\n --grid-re: 8\r\n}\r\n\r\nr-grid>r-cell[rowspan$=\"+9\"],\r\nr-grid>r-cell[rowspan$=\"-8\"],\r\nr-grid>r-cell[rowspan=\"9\"] {\r\n --grid-re: 9\r\n}\r\n\r\nr-grid>r-cell[rowspan$=\"+10\"],\r\nr-grid>r-cell[rowspan$=\"-9\"],\r\nr-grid>r-cell[rowspan=\"10\"] {\r\n --grid-re: 10\r\n}\r\n\r\nr-grid>r-cell[rowspan$=\"+11\"],\r\nr-grid>r-cell[rowspan$=\"-10\"],\r\nr-grid>r-cell[rowspan=\"11\"] {\r\n --grid-re: 11\r\n}\r\n\r\nr-grid>r-cell[rowspan$=\"+12\"],\r\nr-grid>r-cell[rowspan$=\"-11\"],\r\nr-grid>r-cell[rowspan=\"12\"] {\r\n --grid-re: 12\r\n}\r\n\r\nr-grid>r-cell[rowspan$=\"-12\"] {\r\n --grid-re: 13\r\n}\r\n\r\n\r\n/* connect vars */\r\nr-grid>r-cell[rowspan] {\r\n grid-row-end: span var(--grid-re)\r\n}\r\n\r\nr-grid>r-cell[rowspan*=\"+\"],\r\nr-grid>r-cell[rowspan*=\"-\"],\r\nr-grid>r-cell[rowspan*=\"..\"] {\r\n grid-row-start: var(--grid-rs)\r\n}\r\n\r\nr-grid>r-cell[rowspan*=\"-\"],\r\nr-grid>r-cell[rowspan*=\"..\"] {\r\n grid-row-end: var(--grid-re)\r\n}\r\n\r\nr-grid>r-cell[rowspan=\"row\"] {\r\n grid-row: 1 / -1\r\n}\r\n\r\n/* .debug can be added to a r-grid to visualize its effective cells */\r\nr-grid.debug>* {\r\n --color: rgba(248, 110, 91, 0.3);\r\n background-image:\r\n linear-gradient(to bottom, var(--color) 0%, var(--color) 100%);\r\n}\r\n\r\nr-grid.debug> :nth-child(6n+2) {\r\n --color: rgba(103, 126, 208, 0.3)\r\n}\r\n\r\nr-grid.debug> :nth-child(6n+3) {\r\n --color: rgba(224, 174, 72, 0.3)\r\n}\r\n\r\nr-grid.debug> :nth-child(6n+4) {\r\n --color: rgba(77, 214, 115, 0.3)\r\n}\r\n\r\nr-grid.debug> :nth-child(6n+5) {\r\n --color: rgba(217, 103, 219, 0.3)\r\n}\r\n\r\nr-grid.debug> :nth-child(6n+6) {\r\n --color: rgba(94, 204, 211, 0.3)\r\n}\r\n\r\nr-grid.debug> :nth-child(6n+7) {\r\n --color: rgba(248, 110, 91, 0.3)\r\n}","h1,\r\nh2,\r\nh3,\r\nh4,\r\nh5,\r\nh6 {\r\n font-weight: normal;\r\n font-family: $serif-font, serif;\r\n line-height: 1.5;\r\n margin: 0;\r\n}\r\n\r\nh1 {\r\n font-size: min(calc(3rem + 0.75vw), 6rem);\r\n margin: calc(0.5rem + 2vh) 0 calc(0.25rem + 1vh) 0;\r\n}\r\n\r\nh2 {\r\n font-size: min(calc(2.5rem + 0.75vw), 5rem);\r\n margin: calc(0.5rem + 1.75vh) 0 calc(0.25rem + 0.75vh) 0;\r\n}\r\n\r\nh3 {\r\n font-size: min(calc(2.15rem + 0.75vw), 4rem);\r\n margin: calc(0.5rem + 1.5vh) 0 calc(0.25rem + 0.5vh) 0;\r\n}\r\n\r\nh4 {\r\n font-size: min(calc(1.75rem + 0.75vw), 3rem);\r\n margin: calc(0.5rem + 1.25vh)0 calc(0.25rem + 0.75vh) 0;\r\n}\r\n\r\nh5 {\r\n font-size: min(calc(1.5rem + 0.75vw), 2rem);\r\n margin: calc(0.5rem + 1vh) 0 calc(0.25rem + 0.75vh) 0;\r\n}\r\n\r\nh6 {\r\n font-size: min(calc(1.25rem + 0.75vw), 1.75rem);\r\n margin: calc(0.5rem + 0.75vh) 0 calc(0.25rem + 0.75vh) 0;\r\n}\r\n\r\nbody {\r\n font-size: min(calc(0.75rem + 0.75vw), 2.5rem);\r\n margin: calc(0.25rem + 1vh) 0 calc(0.5rem + 2vh) 0;\r\n line-height: 1.5;\r\n font-family: $sans-font, sans-serif;\r\n font-weight: 100;\r\n}\r\n\r\na,\r\nins,\r\nu {\r\n text-decoration-skip: ink edges;\r\n}\r\n\r\n.size-1 {\r\n font-size: 3.25rem;\r\n}\r\n.size-2 {\r\n font-size: 2.75rem;\r\n}\r\n.size-3 {\r\n font-size: 2.5rem;\r\n}\r\n.size-4 {\r\n font-size: 2.15rem;\r\n}\r\n.size-5 {\r\n font-size: 1.75rem;\r\n}\r\n.size-6 {\r\n font-size: 1.5rem;\r\n}\r\n.size-7 {\r\n font-size: 1.25rem;\r\n}\r\n\r\na {\r\n \r\n\r\n transition: color .2s, border-bottom .2s;\r\n color: $link-dark;\r\n text-decoration: none;\r\n border-bottom: solid $link-dark 2px;\r\n border-radius: 1px;\r\n\r\n &:link, &:visited {\r\n color: $link-dark;\r\n }\r\n\r\n &:hover {\r\n color: $link-light;\r\n border-bottom: solid $link-light 2px;\r\n }\r\n\r\n &:active {\r\n transition: color .2s;\r\n color: $link-mid;\r\n }\r\n}\r\n\r\np {\r\n margin: 1rem 0 1rem 0;\r\n}\r\n\r\nstrong, .title {\r\n font-weight: 800;\r\n}\r\n\r\n.title {\r\n font-family: $sans-font;\r\n}\r\n\r\n.text-center {\r\n text-align: center;\r\n}\r\n\r\n.text-justify {\r\n text-align: justify;\r\n}\r\n\r\n.font-bold {\r\n font-weight: bold;\r\n}\r\n\r\n.font-light {\r\n font-weight: 200;\r\n}\r\n\r\n.italic {\r\n font-style: italic;\r\n}\r\n\r\n.underline {\r\n text-decoration: underline;\r\n}\r\n\r\n.scale-text {\r\n font-size: calc(1em - (1vw/5));\r\n}\r\n\r\n.is-family-sans-serif {\r\n font-family: $sans-font;\r\n}\r\n\r\n.is-family-serif {\r\n font-family: $serif-font;\r\n}","// font families\r\n$sans-font: 'Public Sans',\r\nsans-serif;\r\n$serif-font: 'Butler',\r\nserif;\r\n\r\n// breakpoint sizes\r\n$mobile: 768px;\r\n$tablet: 769px;\r\n$desktop: 1024px;\r\n$widescreen: 1216px;\r\n$fullhd: 1408px;\r\n\r\n// grid vars\r\n$grid-tc: repeat(12, 1fr);\r\n$grid-tr: repeat(12, 1fr);\r\n$col-gap: 1rem;\r\n$row-gap: 1rem;\r\n$grid-cs: 1;\r\n$grid-ce: -1;\r\n$grid-rs: 1;\r\n$grid-re: -1;\r\n\r\n// colors\r\n$navy: #001F3F;\r\n$blue: #0074D9;\r\n$aqua: #7FDBFF;\r\n$teal: #39CCCC;\r\n$olive: #3D9970;\r\n$green: #2ECC40;\r\n$lime: #01FF70;\r\n$yellow: #FFDC00;\r\n$orange: #FF851B;\r\n$red: #FF4136;\r\n$fuchsia: #F012BE;\r\n$purple: #B10DC9;\r\n$maroon: #85144B;\r\n$white: #FFFFFF;\r\n$gray: #AAAAAA;\r\n$silver:#DDDDDD;\r\n$black: #111111;\r\n\r\n// link styles\r\n$link-dark: #0F52BA;\r\n$link-light: #0080FF;\r\n$link-mid: #0074D9;",".container {\r\n max-width: 100%;\r\n width: 100%;\r\n padding: 0rem 1rem;\r\n margin-left: auto;\r\n margin-right: auto;\r\n}\r\n\r\n.column {\r\n display: flex;\r\n flex-direction: column;\r\n flex-grow: 1;\r\n flex-basis: 0;\r\n flex-shrink: 1;\r\n padding: 0.5rem;\r\n}\r\n\r\n.row {\r\n display: flex;\r\n flex-direction: row;\r\n flex-grow: 1;\r\n flex-shrink: 1;\r\n}\r\n\r\n.is-fullheight {\r\n min-height: 100vh;\r\n}\r\n\r\n.flex-center {\r\n display: flex;\r\n height: 100%;\r\n width: 100%;\r\n align-items: center;\r\n justify-content: center;\r\n}\r\n\r\narticle,\r\n.breakout-wrapper {\r\n display: grid;\r\n grid-template-columns: [full-start] minmax(1em, 1fr) [content-start] minmax(0, $mobile) [content-end] minmax(1em, 1fr) [full-end];\r\n}\r\n\r\n.breakout-wrapper[style*=\"--breakout-width\"] {\r\n grid-template-columns: [full-start] minmax(1em, 1fr) [content-start] minmax(0, var(--breakout-width)) [content-end] minmax(1em, 1fr) [full-end];\r\n}\r\n\r\narticle>*,\r\n.breakout-wrapper>* {\r\n grid-column: content;\r\n}\r\n\r\n.breakout {\r\n grid-column: full;\r\n}\r\n\r\nsection {\r\n display: flex;\r\n flex-direction: column;\r\n max-width: 768px;\r\n margin: auto;\r\n padding: 2rem 0.5rem;\r\n}\r\n\r\nfooter {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 2rem 1rem 1rem 1rem;\r\n}","form {\r\n width: 100%;\r\n\r\n .field {\r\n display: flex;\r\n flex-direction: column;\r\n width: 100%;\r\n margin: 1rem 0 0.5rem 0;\r\n\r\n .help {\r\n padding-top: 0.25rem;\r\n font-size: 0.75em;\r\n opacity: 0.75;\r\n }\r\n }\r\n}\r\n\r\ninput,\r\nselect,\r\ntextarea {\r\n border: 1px solid black;\r\n border-radius: 3px;\r\n padding: 0.75rem 0.75rem;\r\n transition: box-shadow 0.2s ease-in-out;\r\n font-size: 0.85em;\r\n\r\n &:active,\r\n &:focus {\r\n border: 1px solid black;\r\n box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);\r\n outline: none;\r\n }\r\n}\r\n\r\nlabel {\r\n margin: 0.5rem 0 0.25rem 0;\r\n}\r\n\r\nselect {\r\n cursor: pointer;\r\n}\r\n\r\nbutton {\r\n cursor: pointer;\r\n font-size: 0.85em;\r\n border: none;\r\n border-radius: 3px;\r\n padding: 0.75rem 1rem;\r\n margin: 1rem 0 0.5rem 0;\r\n background-color: #D4D4D4;\r\n transition: filter 0.2s ease-in-out,\r\n transform 0.1s ease-out,\r\n box-shadow 0.1s ease-out;\r\n\r\n &.lighten {\r\n &:hover {\r\n filter: brightness(110%);\r\n }\r\n }\r\n\r\n &:hover {\r\n filter: brightness(90%);\r\n box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);\r\n }\r\n\r\n &:active {\r\n transform: scale(0.95);\r\n }\r\n\r\n &:focus {\r\n outline: none;\r\n }\r\n\r\n}","table {\r\n border-collapse: collapse;\r\n margin: 1rem 0 0.5rem 0;\r\n}\r\n\r\ntd,\r\nth {\r\n border: 1px solid #999;\r\n padding: 0.5rem;\r\n text-align: left;\r\n font-size: 0.8em;\r\n}\r\n\r\n.table-container {\r\n max-width: 100%;\r\n overflow-x: scroll;\r\n}\r\n\r\n.box {\r\n border-radius: 3px;\r\n padding: 1rem;\r\n box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);\r\n}\r\n\r\nul,\r\nol {\r\n margin: 0.25rem 0 1rem 0;\r\n padding: 0;\r\n}\r\n\r\nul {\r\n list-style: disc inside;\r\n\r\n ul {\r\n list-style-type: circle;\r\n }\r\n}\r\n\r\nol {\r\n list-style: decimal inside;\r\n\r\n ol {\r\n list-style-type: lower-alpha;\r\n }\r\n}\r\n\r\nfigure {\r\n margin: 0;\r\n padding: 0.25rem;\r\n\r\n picture {\r\n img {\r\n width: 100%;\r\n height: auto;\r\n }\r\n }\r\n\r\n figcaption {\r\n font-size: 0.75em;\r\n opacity: 0.75;\r\n font-style: italic;\r\n text-align: center;\r\n margin-bottom: 1rem;\r\n }\r\n}\r\n\r\npicture[style*=\"--aspect-ratio\"]> :first-child {\r\n width: 100%;\r\n}\r\n\r\npicture[style*=\"--aspect-ratio\"]>img {\r\n height: auto;\r\n}\r\n\r\n@supports (--custom:property) {\r\n picture[style*=\"--aspect-ratio\"] {\r\n position: relative;\r\n }\r\n\r\n picture[style*=\"--aspect-ratio\"]::before {\r\n content: \"\";\r\n display: block;\r\n padding-bottom: calc(100% / (var(--aspect-ratio)));\r\n }\r\n\r\n picture[style*=\"--aspect-ratio\"]> :first-child {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n height: 100%;\r\n }\r\n}\r\n\r\nhr {\r\n height: 2px;\r\n background-color: black;\r\n width: 100%;\r\n border: none;\r\n outline: none;\r\n border-radius: 1px;\r\n margin: 1rem 0;\r\n}","/* \r\n Based on clrs.cc\r\n Extended to use sass variables by Siddharth S. (github.com/siddharthsham)\r\n*/\r\n\r\n\r\n/* Backgrounds */\r\n.bg-navy {\r\n background-color: $navy;\r\n}\r\n\r\n.bg-blue {\r\n background-color: $blue;\r\n}\r\n\r\n.bg-aqua {\r\n background-color: $aqua;\r\n}\r\n\r\n.bg-teal {\r\n background-color: $teal;\r\n}\r\n\r\n.bg-olive {\r\n background-color: $olive;\r\n}\r\n\r\n.bg-green {\r\n background-color: $green;\r\n}\r\n\r\n.bg-lime {\r\n background-color: $lime;\r\n}\r\n\r\n.bg-yellow {\r\n background-color: $yellow;\r\n}\r\n\r\n.bg-orange {\r\n background-color: $orange;\r\n}\r\n\r\n.bg-red {\r\n background-color: $red;\r\n}\r\n\r\n.bg-fuchsia {\r\n background-color: $fuchsia;\r\n}\r\n\r\n.bg-purple {\r\n background-color: $purple;\r\n}\r\n\r\n.bg-maroon {\r\n background-color: $maroon;\r\n}\r\n\r\n.bg-white {\r\n background-color: $white;\r\n}\r\n\r\n.bg-gray {\r\n background-color: $gray;\r\n}\r\n\r\n.bg-silver {\r\n background-color: $silver;\r\n}\r\n\r\n.bg-black {\r\n background-color: $black;\r\n}\r\n\r\n/* Colors */\r\n.navy {\r\n color: $navy;\r\n}\r\n\r\n.blue {\r\n color: $blue;\r\n}\r\n\r\n.aqua {\r\n color: $aqua;\r\n}\r\n\r\n.teal {\r\n color: $teal;\r\n}\r\n\r\n.olive {\r\n color: $olive;\r\n}\r\n\r\n.green {\r\n color: $green;\r\n}\r\n\r\n.lime {\r\n color: $lime;\r\n}\r\n\r\n.yellow {\r\n color: $yellow;\r\n}\r\n\r\n.orange {\r\n color: $orange;\r\n}\r\n\r\n.red {\r\n color: $red;\r\n}\r\n\r\n.fuchsia {\r\n color: $fuchsia;\r\n}\r\n\r\n.purple {\r\n color: $purple;\r\n}\r\n\r\n.maroon {\r\n color: $maroon;\r\n}\r\n\r\n.white {\r\n color: $white;\r\n}\r\n\r\n.silver {\r\n color: $silver;\r\n}\r\n\r\n.gray {\r\n color: $gray;\r\n}\r\n\r\n.black {\r\n color: $black;\r\n}\r\n\r\n// borders\r\n\r\n.border--navy {\r\n border-color: $navy;\r\n}\r\n\r\n.border--blue {\r\n border-color: $blue;\r\n}\r\n\r\n.border--aqua {\r\n border-color: $aqua;\r\n}\r\n\r\n.border--teal {\r\n border-color: $teal;\r\n}\r\n\r\n.border--olive {\r\n border-color: $olive;\r\n}\r\n\r\n.border--green {\r\n border-color: $green;\r\n}\r\n\r\n.border--lime {\r\n border-color: $lime;\r\n}\r\n\r\n.border--yellow {\r\n border-color: $yellow;\r\n}\r\n\r\n.border--orange {\r\n border-color: $orange;\r\n}\r\n\r\n.border--red {\r\n border-color: $red;\r\n}\r\n\r\n.border--fuchsia {\r\n border-color: $fuchsia;\r\n}\r\n\r\n.border--purple {\r\n border-color: $purple;\r\n}\r\n\r\n.border--maroon {\r\n border-color: $maroon;\r\n}\r\n\r\n.border--white {\r\n border-color: $white;\r\n}\r\n\r\n.border--gray {\r\n border-color: $gray;\r\n}\r\n\r\n.border--silver {\r\n border-color: $silver;\r\n}\r\n\r\n.border--black {\r\n border-color: $black;\r\n}"]} \ No newline at end of file