From 97bbc7b191fa9fac27aaa9d2f5e4d607b9f2507e Mon Sep 17 00:00:00 2001 From: mrmrs Date: Sat, 18 Jan 2014 00:26:39 -0800 Subject: [PATCH] Updates some of the files in this code. --- Rakefile | 13 + css/i.css | 1 + css/i.css.gz | Bin 0 -> 17275 bytes sass/_background_repeat.scss | 30 ++ sass/_background_size.scss | 42 +++ sass/_border_colors.scss | 145 +++++++++ sass/_border_radius.scss | 46 +++ sass/_border_style.scss | 10 + sass/_border_widths.scss | 26 ++ sass/_borders.scss | 34 +++ sass/_clears.scss | 17 ++ sass/_colors.scss | 157 ++++++++++ sass/_dimension_utilities.scss | 20 ++ sass/_display.scss | 97 ++++++ sass/_floats.scss | 27 ++ sass/_font_family.scss | 32 ++ sass/_font_style.scss | 20 ++ sass/_font_weight.scss | 77 +++++ sass/_forms.scss | 4 + sass/_grid.scss | 11 + sass/_heights.scss | 79 +++++ sass/_images.scss | 8 + sass/_letter_spacing.scss | 26 ++ sass/_line_height.scss | 26 ++ sass/_links.scss | 18 ++ sass/_lists.scss | 92 ++++++ sass/_max_heights.scss | 79 +++++ sass/_max_widths.scss | 98 ++++++ sass/_min_heights.scss | 94 ++++++ sass/_min_widths.scss | 478 +++++++++++++++++++++++++++++ sass/_normalize.scss | 405 +++++++++++++++++++++++++ sass/_opacity.scss | 56 ++++ sass/_overflow.scss | 30 ++ sass/_position.scss | 157 ++++++++++ sass/_queries.scss | 31 ++ sass/_skins.scss | 305 +++++++++++++++++++ sass/_spacing.scss | 539 +++++++++++++++++++++++++++++++++ sass/_squares.scss | 50 +++ sass/_text_align.scss | 56 ++++ sass/_text_decoration.scss | 35 +++ sass/_text_overflow.scss | 42 +++ sass/_text_transform.scss | 30 ++ sass/_type_scale.scss | 43 +++ sass/_utilities.scss | 82 +++++ sass/_vertical_align.scss | 46 +++ sass/_visibility.scss | 66 ++++ sass/_white_space.scss | 35 +++ sass/_widths.scss | 91 ++++++ sass/_word_spacing.scss | 26 ++ sass/i.scss | 47 +++ 50 files changed, 3979 insertions(+) create mode 100644 Rakefile create mode 100644 css/i.css create mode 100644 css/i.css.gz create mode 100644 sass/_background_repeat.scss create mode 100644 sass/_background_size.scss create mode 100644 sass/_border_colors.scss create mode 100644 sass/_border_radius.scss create mode 100644 sass/_border_style.scss create mode 100644 sass/_border_widths.scss create mode 100644 sass/_borders.scss create mode 100644 sass/_clears.scss create mode 100644 sass/_colors.scss create mode 100644 sass/_dimension_utilities.scss create mode 100644 sass/_display.scss create mode 100644 sass/_floats.scss create mode 100644 sass/_font_family.scss create mode 100644 sass/_font_style.scss create mode 100644 sass/_font_weight.scss create mode 100644 sass/_forms.scss create mode 100644 sass/_grid.scss create mode 100644 sass/_heights.scss create mode 100644 sass/_images.scss create mode 100644 sass/_letter_spacing.scss create mode 100644 sass/_line_height.scss create mode 100644 sass/_links.scss create mode 100644 sass/_lists.scss create mode 100644 sass/_max_heights.scss create mode 100644 sass/_max_widths.scss create mode 100644 sass/_min_heights.scss create mode 100644 sass/_min_widths.scss create mode 100644 sass/_normalize.scss create mode 100644 sass/_opacity.scss create mode 100644 sass/_overflow.scss create mode 100644 sass/_position.scss create mode 100644 sass/_queries.scss create mode 100644 sass/_skins.scss create mode 100644 sass/_spacing.scss create mode 100644 sass/_squares.scss create mode 100644 sass/_text_align.scss create mode 100644 sass/_text_decoration.scss create mode 100644 sass/_text_overflow.scss create mode 100644 sass/_text_transform.scss create mode 100644 sass/_type_scale.scss create mode 100644 sass/_utilities.scss create mode 100644 sass/_vertical_align.scss create mode 100644 sass/_visibility.scss create mode 100644 sass/_white_space.scss create mode 100644 sass/_widths.scss create mode 100644 sass/_word_spacing.scss create mode 100644 sass/i.scss diff --git a/Rakefile b/Rakefile new file mode 100644 index 0000000..d4aa8b7 --- /dev/null +++ b/Rakefile @@ -0,0 +1,13 @@ +require "rubygems" +require 'rake' + +desc "Start Sass so that is compiles to css upon file save" +task :sass do + system "sass --watch sass:css" +end # task :sass + +desc "Start Sass so that is compiles to css upon file save" +task :minify do + system "sass --watch sass:css --style compressed" +end # task :minify + diff --git a/css/i.css b/css/i.css new file mode 100644 index 0000000..67394c0 --- /dev/null +++ b/css/i.css @@ -0,0 +1 @@ +@charset "UTF-8";.bg-norep{background-repeat:no-repeat}.bg-x{background-repeat:repeat-x}.bg-y{background-repeat:repeat-y}.bg-rep{background-repeat:repeat}@media screen and (min-width: 48em){.bg-norep-ns{background-repeat:no-repeat}.bg-x-ns{background-repeat:repeat-x}.bg-y-ns{background-repeat:repeat-y}.bg-rep-ns{background-repeat:repeat}}@media screen and (min-width: 48em) and (max-width: 64em){.bg-norep-m{background-repeat:no-repeat}.bg-x-m{background-repeat:repeat-x}.bg-y-m{background-repeat:repeat-y}.bg-rep-m{background-repeat:repeat}}@media screen and (min-width: 64em){.bg-norep-l{background-repeat:no-repeat}.bg-x-l{background-repeat:repeat-x}.bg-y-l{background-repeat:repeat-y}.bg-rep-l{background-repeat:repeat}}.bg-cv{background-size:cover}.bg-cn{background-size:contain}.bg-quarter{background-size:25%}.bg-half{background-size:50%}.bg-three-quarters{background-size:75%}.bg-full{background-size:100%}.bg-auto{background-size:auto}@media screen and (min-width: 48em){.bg-cv-ns{background-size:cover}.bg-cn-ns{background-size:contain}.bg-quarter-ns{background-size:25%}.bg-half-ns{background-size:50%}.bg-three-quarters-ns{background-size:75%}.bg-full-ns{background-size:100%}.bg-auto-ns{background-size:auto}}@media screen and (min-width: 48em) and (max-width: 64em){.bg-cv-m{background-size:cover}.bg-cn-m{background-size:contain}.bg-quarter-m{background-size:25%}.bg-half-m{background-size:50%}.bg-three-quarters-m{background-size:75%}.bg-full-m{background-size:100%}.bg-auto-m{background-size:auto}}@media screen and (min-width: 64em){.bg-cv-l{background-size:cover}.bg-cn-l{background-size:contain}.bg-quarter-l{background-size:25%}.bg-half-l{background-size:50%}.bg-three-quarters-l{background-size:75%}.bg-full-l{background-size:100%}.bg-auto-l{background-size:auto}}.bor--blk{border-color:#111}.bor--dk-gry{border-color:#333}.bor--md-gry{border-color:#666}.bor--gray{border-color:gray}.bor--silver{border-color:silver}.bor--lt-slvr{border-color:#aaa}.bor--lt-gry{border-color:#ccc}.bor--near-wht{border-color:#eee}.bor--wht{border-color:#fff}.bor--pink{border-color:pink}.bor--lightpink{border-color:#ffb6c1}.bor--hotpink{border-color:hotpink}.bor--deeppink{border-color:#ff1493}.bor--palevioletred{border-color:#db7093}.bor--mediumvioletred{border-color:#c71585}.bor--lightsalmon{border-color:#ffa07a}.bor--salmon{border-color:salmon}.bor--darksalmon{border-color:#e9967a}.bor--lightcoral{border-color:#f08080}.bor--indianred{border-color:#cd5c5c}.bor--crimson{border-color:crimson}.bor--firebrick{border-color:#b22222}.bor--darkred{border-color:darkred}.bor--red{border-color:red}.bor--orangered{border-color:#ff4500}.bor--tomato{border-color:tomato}.bor--coral{border-color:coral}.bor--darkorange{border-color:#ff8c00}.bor--orange{border-color:orange}.bor--gold{border-color:gold}.bor--yellow{border-color:#ff0}.bor--lightyellow{border-color:#ffffe0}.bor--lemonchiffon{border-color:#fffacd}.bor--lightgoldenrod{border-color:#fafad2}.bor--papayawhip{border-color:#ffefd5}.bor--moccasin{border-color:#ffe4b5}.bor--peachpuff{border-color:#ffdab9}.bor--palegoldenrod{border-color:#eee8aa}.bor--khaki{border-color:khaki}.bor--darkkhaki{border-color:#bdb76b}.bor--cornsilk{border-color:#fff8dc}.bor--blanchedalmond{border-color:#ffebcd}.bor--bisque{border-color:bisque}.bor--navajowhite{border-color:#ffdead}.bor--wheat{border-color:wheat}.bor--burlywood{border-color:#deb887}.bor--tan{border-color:tan}.bor--rosybrown{border-color:#bc8f8f}.bor--sandybrown{border-color:#f4a460}.bor--goldenrod{border-color:#daa520}.bor--darkgoldenrod{border-color:#b8860b}.bor--peru{border-color:peru}.bor--chocolate{border-color:#d2691e}.bor--saddlebrown{border-color:#8b4513}.bor--sienna{border-color:sienna}.bor--brown{border-color:brown}.bor--maroon{border-color:maroon}.bor--darkolivegreen{border-color:#556b2f}.bor--olive{border-color:olive}.bor--olivedrab{border-color:#6b8e23}.bor--yellowgreen{border-color:#9acd32}.bor--limegreen{border-color:#32cd32}.bor--lime{border-color:lime}.bor--lawngreen{border-color:#7cfc00}.bor--chartreuse{border-color:#7fff00}.bor--greenyellow{border-color:#adff2f}.bor--springgreen{border-color:#00ff7f}.bor--medpringgreen{border-color:#00fa9a}.bor--lightgreen{border-color:#90ee90}.bor--palegreen{border-color:#98fb98}.bor--darkseagreen{border-color:#8fbc8f}.bor--mediumseagreen{border-color:#3cb371}.bor--seagreen{border-color:#2e8b57}.bor--forestgreen{border-color:#228b22}.bor--green{border-color:green}.bor--darkgreen{border-color:#006400}.bor--mediumaquamarine{border-color:#66cdaa}.bor--aqua{border-color:cyan}.bor--cyan{border-color:cyan}.bor--lightcyan{border-color:#e0ffff}.bor--paleturquoise{border-color:#afeeee}.bor--aquamarine{border-color:#7fffd4}.bor--turquoise{border-color:#40e0d0}.bor--mediumturquoise{border-color:#48d1cc}.bor--darkturquoise{border-color:#00ced1}.bor--lightseagreen{border-color:#20b2aa}.bor--cadetblue{border-color:#5f9ea0}.bor--darkcyan{border-color:#008b8b}.bor--teal{border-color:teal}.bor--lightsteelblue{border-color:#b0c4de}.bor--powderblue{border-color:#b0e0e6}.bor--lightblue{border-color:#add8e6}.bor--skyblue{border-color:skyblue}.bor--lightskyblue{border-color:#87cefa}.bor--deepskyblue{border-color:#00bfff}.bor--dodgerblue{border-color:#1e90ff}.bor--cornflowerblue{border-color:#6495ed}.bor--steelblue{border-color:#4682b4}.bor--royalblue{border-color:#4169e1}.bor--blue{border-color:blue}.bor--mediumblue{border-color:#0000cd}.bor--darkblue{border-color:#00008b}.bor--navy{border-color:navy}.bor--midnightblue{border-color:#191970}.bor--lavender{border-color:#e6e6fa}.bor--thistle{border-color:thistle}.bor--plum{border-color:plum}.bor--violet{border-color:violet}.bor--orchid{border-color:orchid}.bor--fuchsia{border-color:#f0f}.bor--magenta{border-color:#f0f}.bor--mediumorchid{border-color:#ba55d3}.bor--mediumpurple{border-color:#9370db}.bor--blueviolet{border-color:#8a2be2}.bor--darkviolet{border-color:#9400d3}.bor--darkorchid{border-color:#9932cc}.bor--darkmagenta{border-color:#8b008b}.bor--purple{border-color:purple}.bor--indigo{border-color:indigo}.bor--darkslateblue{border-color:#483d8b}.bor--slateblue{border-color:#6a5acd}.bor--mediumslateblue{border-color:#7b68ee}.bor--white{border-color:#fff}.bor--snow{border-color:snow}.bor--honeydew{border-color:#f0fff0}.bor--mintcream{border-color:#f5fffa}.bor--azure{border-color:azure}.bor--aliceblue{border-color:#f0f8ff}.bor--ghostwhite{border-color:#f8f8ff}.bor--whitesmoke{border-color:#f5f5f5}.bor--seashell{border-color:#fff5ee}.bor--beige{border-color:beige}.bor--oldlace{border-color:oldlace}.bor--floralwhite{border-color:#fffaf0}.bor--ivory{border-color:ivory}.bor--antiquewhite{border-color:#faebd7}.bor--linen{border-color:linen}.bor--lavenderblush{border-color:#fff0f5}.bor--mistyrose{border-color:#ffe4e1}.bor--gainsboro{border-color:#dcdcdc}.brn{border-radius:0}.br{border-radius:.125rem}.br2{border-radius:.25rem}.br3{border-radius:.5rem}.br4{border-radius:1rem}.br5{border-radius:2rem}.br-circ{border-radius:9999px}.br-100{border-radius:100%}@media screen and (min-width: 48em){.brn-ns{border-radius:0}.br-ns{border-radius:.125rem}.br2-ns{border-radius:.25rem}.br3-ns{border-radius:.5rem}.br4-ns{border-radius:1rem}.br5-ns{border-radius:2rem}.br-circ-ns{border-radius:9999px}.br-100-ns{border-radius:100%}}@media screen and (min-width: 48em) and (max-width: 64em){.brn-m{border-radius:0}.br-m{border-radius:.125rem}.br2-m{border-radius:.25rem}.br3-m{border-radius:.5rem}.br4-m{border-radius:1rem}.br5-m{border-radius:2rem}.br-circ-m{border-radius:9999px}.br-100-m{border-radius:100%}}@media screen and (min-width: 64em){.brn-l{border-radius:0}.br-l{border-radius:.125rem}.br2-l{border-radius:.25rem}.br3-l{border-radius:.5rem}.br4-l{border-radius:1rem}.br5-l{border-radius:2rem}.br-circ-l{border-radius:9999px}.br-100-l{border-radius:100%}}.ba-none{border-style:none}.ba-hidden{border-style:hidden}.ba-dotted{border-style:dotted}.ba-dashed{border-style:dashed}.ba-solid{border-style:solid}.baw0{border-width:0}.baw1{border-width:.125rem}.baw2{border-width:.25rem}.baw3{border-width:.5rem}.baw4{border-width:.75rem}.baw5{border-width:1rem}.ba{border-style:solid;border-width:1px}.bt{border-style:solid;border-left-width:1px}.br{border-style:solid;border-right-width:1px}.bb{border-style:solid;border-bottom-width:1px}.bl{border-style:solid;border-left-width:1px}@media screen and (min-width: 48em){.ba-ns{border-style:solid;border-width:1px}.bt-ns{border-style:solid;border-left-width:1px}.br-ns{border-style:solid;border-right-width:1px}.bb-ns{border-style:solid;border-bottom-width:1px}.bl-ns{border-style:solid;border-left-width:1px}}@media screen and (min-width: 48em) and (max-width: 64em){.ba-m{border-style:solid;border-width:1px}.bt-m{border-style:solid;border-left-width:1px}.br-m{border-style:solid;border-right-width:1px}.bb-m{border-style:solid;border-bottom-width:1px}.bl-m{border-style:solid;border-left-width:1px}}@media screen and (min-width: 64em){.ba-l{border-style:solid;border-width:1px}.bt-l{border-style:solid;border-left-width:1px}.br-l{border-style:solid;border-right-width:1px}.bb-l{border-style:solid;border-bottom-width:1px}.bl-l{border-style:solid;border-left-width:1px}}.cn{clear:none}.cl{clear:left}.cr{clear:right}.cb{clear:both}.cf:before,.cf:after{content:" ";display:table}.cf:after{clear:both}.cf{*zoom:1}.auto-wrap{display:block;width:auto !important}.auto-fill{display:block;overflow:hidden;width:auto !important}.dbf{display:block;width:100%}.dn{display:none}.di{display:inline}.db{display:block}.dib{display:inline-block}.dli{display:list-item}.dit{display:inline-table}.dt{display:table}.dtc{display:table-cell}.dtcol{display:table-column}.dtcolg{display:table-column-group}.dtfg{display:table-footer-group}.dthg{display:table-header-group}.dtr{display:table-row}.dtrg{display:table-row-group}.df{display:flex}.dif{display:inline-flex}.dg{display:grid}.dig{display:inline-grid}.dri{display:run-in}@media screen and (min-width: 48em){.dn-ns{display:none}.di-ns{display:inline}.db-ns{display:block}.dib-ns{display:inline-block}.dli-ns{display:list-item}.dit-ns{display:inline-table}.dt-ns{display:table}.dtc-ns{display:table-cell}.dtcol-ns{display:table-column}.dtcolg-ns{display:table-column-group}.dtfg-ns{display:table-footer-group}.dthg-ns{display:table-header-group}.dtr-ns{display:table-row}.dtrg-ns{display:table-row-group}.df-ns{display:flex}.dif-ns{display:inline-flex}.dg-ns{display:grid}.dig-ns{display:inline-grid}.dri-ns{display:run-in}}@media screen and (min-width: 48em) and (max-width: 64em){.dn-m{display:none}.di-m{display:inline}.db-m{display:block}.dib-m{display:inline-block}.dli-m{display:list-item}.dit-m{display:inline-table}.dt-m{display:table}.dtc-m{display:table-cell}.dtcol-m{display:table-column}.dtcolg-m{display:table-column-group}.dtfg-m{display:table-footer-group}.dthg-m{display:table-header-group}.dtr-m{display:table-row}.dtrg-m{display:table-row-group}.df-m{display:flex}.dif-m{display:inline-flex}.dg-m{display:grid}.dig-m{display:inline-grid}.dri-m{display:run-in}}@media screen and (min-width: 64em){.dn-l{display:none}.di-l{display:inline}.db-l{display:block}.dib-l{display:inline-block}.dli-l{display:list-item}.dit-l{display:inline-table}.dt-l{display:table}.dtc-l{display:table-cell}.dtcol-l{display:table-column}.dtcolg-l{display:table-column-group}.dtfg-l{display:table-footer-group}.dthg-l{display:table-header-group}.dtr-l{display:table-row}.dtrg-l{display:table-row-group}.df-l{display:flex}.dif-l{display:inline-flex}.dg-l{display:grid}.dig-l{display:inline-grid}.dri-l{display:run-in}}.fl{float:left;display:inline}.fr{float:right;display:inline}.fn{float:none}@media screen and (min-width: 48em){.fl-ns{float:left;display:inline}.fr-ns{float:right;display:inline}.fn-ns{float:none}}@media screen and (min-width: 48em) and (max-width: 64em){.fl-m{float:left;display:inline}.fr-m{float:right;display:inline}.fn-m{float:none}}@media screen and (min-width: 64em){.fl-l{float:left;display:inline}.fr-l{float:right;display:inline}.fn-l{float:none}}.serif{font-family:georgia, serif}.sans-serif{font-family:avenir, 'avenir next', helvetica, arial, sans-serif}.font-fantasy{font-family:fantasy}.font-cursive{font-family:cursive}.font-mono{font-family:monospace}@media screen and (min-width: 48em){.serif-ns{font-family:georgia, serif}.sans-serif-ns{font-family:avenir, 'avenir next', helvetica, arial, sans-serif}.font-fantasy-ns{font-family:fantasy}.font-cursive-ns{font-family:cursive}.font-mono-ns{font-family:monospace}}@media screen and (min-width: 48em) and (max-width: 64em){.serif-m{font-family:georgia, serif}.sans-serif-m{font-family:avenir, 'avenir next', helvetica, arial, sans-serif}.font-fantasy-m{font-family:fantasy}.font-cursive-m{font-family:cursive}.font-mono-m{font-family:monospace}}@media screen and (min-width: 64em){.serif-l{font-family:georgia, serif}.sans-serif-l{font-family:avenir, 'avenir next', helvetica, arial, sans-serif}.font-fantasy-l{font-family:fantasy}.font-cursive-l{font-family:cursive}.font-mono-l{font-family:monospace}}.fsn{font-style:normal}.i{font-style:italic}@media screen and (min-width: 48em){.fsn-ns{font-style:normal}.i-ns{font-style:italic}}@media screen and (min-width: 48em) and (max-width: 64em){.fsn-m{font-style:normal}.i-m{font-style:italic}}@media screen and (min-width: 64em){.fsn-l{font-style:normal}.i-l{font-style:italic}}.fwn{font-weight:normal}.b{font-weight:bold}.fw-light{font-weight:lighter}.fw-bolder{font-weight:bolder}.fw1{font-weight:100}.fw2{font-weight:200}.fw3{font-weight:300}.fw4{font-weight:400}.fw5{font-weight:500}.fw6{font-weight:600}.fw7{font-weight:700}.fw8{font-weight:800}.fw9{font-weight:900}@media screen and (min-width: 48em){.fwn{font-weight:normal}.b{font-weight:bold}.fw-light{font-weight:lighter}.fw-bolder{font-weight:bolder}.fw1{font-weight:100}.fw2{font-weight:200}.fw3{font-weight:300}.fw4{font-weight:400}.fw5{font-weight:500}.fw6{font-weight:600}.fw7{font-weight:700}.fw8{font-weight:800}.fw9{font-weight:900}}@media screen and (min-width: 48em) and (max-width: 64em){.fwn{font-weight:normal}.b{font-weight:bold}.fw-light{font-weight:lighter}.fw-bolder{font-weight:bolder}.fw1{font-weight:100}.fw2{font-weight:200}.fw3{font-weight:300}.fw4{font-weight:400}.fw5{font-weight:500}.fw6{font-weight:600}.fw7{font-weight:700}.fw8{font-weight:800}.fw9{font-weight:900}}@media screen and (min-width: 64em){.fwn{font-weight:normal}.b{font-weight:bold}.fw-light{font-weight:lighter}.fw-bolder{font-weight:bolder}.fw1{font-weight:100}.fw2{font-weight:200}.fw3{font-weight:300}.fw4{font-weight:400}.fw5{font-weight:500}.fw6{font-weight:600}.fw7{font-weight:700}.fw8{font-weight:800}.fw9{font-weight:900}}.hi-10,.tenth{height:10%}.hi-25,.quarter{height:25%}.hi-50,.half{height:50%}.hi-75,.three-quarters{height:75%}.hi-100,.full{height:100%}.ht1{height:1rem}.ht2{height:2rem}.ht3{height:4rem}.ht4{height:8rem}.ht5{height:16rem}.ht6{height:32rem}.ht7{height:48rem}.ht8{height:64rem}.ht9{height:96rem}.ht10{height:128rem}.ht-auto{height:auto}@media screen and (min-width: 48em){.hi-10-ns,.tenth-ns{height:10%}.hi-25-ns,.quarter-ns{height:25%}.hi-50-ns,.half-ns{height:50%}.hi-75-ns,.three-quarters-ns{height:75%}.hi-100-ns,.full-ns{height:100%}.ht1-ns{height:1rem}.ht2-ns{height:2rem}.ht3-ns{height:4rem}.ht4-ns{height:8rem}.ht5-ns{height:16rem}.ht6-ns{height:32rem}.ht7-ns{height:48rem}.ht8-ns{height:64rem}.ht9-ns{height:96rem}.ht10-ns{height:128rem}.ht-auto-ns{height:auto}}@media screen and (min-width: 48em) and (max-width: 64em){.hi-10-m,.tenth-m{height:10%}.hi-25-m,.quarter-m{height:25%}.hi-50-m,.half-m{height:50%}.hi-75-m,.three-quarters-m{height:75%}.hi-100-m,.full-m{height:100%}.ht1-m{height:1rem}.ht2-m{height:2rem}.ht3-m{height:4rem}.ht4-m{height:8rem}.ht5-m{height:16rem}.ht6-m{height:32rem}.ht7-m{height:48rem}.ht8-m{height:64rem}.ht9-m{height:96rem}.ht10-m{height:128rem}.ht-auto-m{height:auto}}@media screen and (min-width: 64em){.hi-10-l,.tenth-l{height:10%}.hi-25-l,.quarter-l{height:25%}.hi-50-l,.half-l{height:50%}.hi-75-l,.three-quarters-l{height:75%}.hi-100-l,.full-l{height:100%}.ht1-l{height:1rem}.ht2-l{height:2rem}.ht3-l{height:4rem}.ht4-l{height:8rem}.ht5-l{height:16rem}.ht6-l{height:32rem}.ht7-l{height:48rem}.ht8-l{height:64rem}.ht9-l{height:96rem}.ht10-l{height:128rem}.ht-auto-l{height:auto}}img{max-width:100%}.tracked{letter-spacing:.1em}.tracked-tight{letter-spacing:-.1em}.mega-tracked{letter-spacing:.2em}@media screen and (min-width: 48em){.tracked-ns{letter-spacing:.1em}.tracked-tight-ns{letter-spacing:-.1em}.mega-tracked-ns{letter-spacing:.2em}}@media screen and (min-width: 48em) and (max-width: 64em){.tracked-m{letter-spacing:.1em}.tracked-tight-m{letter-spacing:-.1em}.mega-tracked-m{letter-spacing:.2em}}@media screen and (min-width: 64em){.tracked-l{letter-spacing:.1em}.tracked-tight-l{letter-spacing:-.1em}.mega-tracked-l{letter-spacing:.2em}}.lh{line-height:1}.lh-title{line-height:1.3}.lh-copy{line-height:1.6}@media screen and (min-width: 48em){.lh-ns{line-height:1}.lh-title-ns{line-height:1.3}.lh-copy-ns{line-height:1.6}}@media screen and (min-width: 48em) and (max-width: 64em){.lh-m{line-height:1}.lh-title-m{line-height:1.3}.lh-copy-m{line-height:1.6}}@media screen and (min-width: 64em){.lh-l{line-height:1}.lh-title-l{line-height:1.3}.lh-copy-l{line-height:1.6}}.link{text-decoration:none}@media screen and (min-width: 48em){.link-ns{text-decoration:none}}@media screen and (min-width: 48em) and (max-width: 64em){.link-m{text-decoration:none}}@media screen and (min-width: 64em){.link-l{text-decoration:none}}.disc{list-style-type:disc}.circle{list-style-type:circle}.square{list-style-type:square}.decimal{list-style-type:decimal}.leading-zero{list-style-type:decimal-leading-zero}.lower-roman{list-style-type:lower-roman}.upper-roman{list-style-type:upper-roman}.lower-greek{list-style-type:lower-greek}.lower-latin{list-style-type:lower-latin}.upper-latin{list-style-type:upper-latin}.lower-alpha{list-style-type:lower-alpha}.upper-alpha{list-style-type:upper-alpha}.list{list-style-type:none}.list{list-style:none}.list--h{list-style-type:none}.list--h>li{display:inline-block}@media screen and (min-width: 48em){.disc-ns{list-style-type:disc}.circle-ns{list-style-type:circle}.square-ns{list-style-type:square}.decimal-ns{list-style-type:decimal}.leading-zero-ns{list-style-type:decimal-leading-zero}.lower-roman-ns{list-style-type:lower-roman}.upper-roman-ns{list-style-type:upper-roman}.lower-greek-ns{list-style-type:lower-greek}.lower-latin-ns{list-style-type:lower-latin}.upper-latin-ns{list-style-type:upper-latin}.lower-alpha-ns{list-style-type:lower-alpha}.upper-alpha-ns{list-style-type:upper-alpha}.list-ns{list-style-type:none}.list--h-ns{list-style-type:none}.list--h-ns>li{display:inline-block}}@media screen and (min-width: 48em) and (max-width: 64em){.disc-m{list-style-type:disc}.circle-m{list-style-type:circle}.square-m{list-style-type:square}.decimal-m{list-style-type:decimal}.leading-zero-m{list-style-type:decimal-leading-zero}.lower-roman-m{list-style-type:lower-roman}.upper-roman-m{list-style-type:upper-roman}.lower-greek-m{list-style-type:lower-greek}.lower-latin-m{list-style-type:lower-latin}.upper-latin-m{list-style-type:upper-latin}.lower-alpha-m{list-style-type:lower-alpha}.upper-alpha-m{list-style-type:upper-alpha}.list-m{list-style-type:none}.list-m{list-style:none}.list--h-m{list-style-type:none}.list--h-m>li{display:inline-block}}@media screen and (min-width: 64em){.disc-l{list-style-type:disc}.circle-l{list-style-type:circle}.square-l{list-style-type:square}.decimal-l{list-style-type:decimal}.leading-zero-l{list-style-type:decimal-leading-zero}.lower-roman-l{list-style-type:lower-roman}.upper-roman-l{list-style-type:upper-roman}.lower-greek-l{list-style-type:lower-greek}.lower-latin-l{list-style-type:lower-latin}.upper-latin-l{list-style-type:upper-latin}.lower-alpha-l{list-style-type:lower-alpha}.upper-alpha-l{list-style-type:upper-alpha}.list-l{list-style-type:none}.list-l{list-style:none}.list--h-l{list-style-type:none}.list--h-l>li{display:inline-block}}.mxhi1{max-height:1rem}.mxhi2{max-height:2rem}.mxhi3{max-height:4rem}.mxhi4{max-height:8rem}.mxhi5{max-height:16rem}.mxhi6{max-height:32rem}.mxhi7{max-height:48rem}.mxhi8{max-height:64rem}.mxhi9{max-height:96rem}.mxhi10{max-height:128rem}.mxhi-none{max-height:none}.mxhi-max{max-height:max-content}.mxhi-min{max-height:min-content}.mxhi-fit{max-height:fit-content}.mxhi-fill{max-height:fill-available}@media screen and (min-width: 48em){.mxhi1-ns{max-height:1rem}.mxhi2-ns{max-height:2rem}.mxhi3-ns{max-height:4rem}.mxhi4-ns{max-height:8rem}.mxhi5-ns{max-height:16rem}.mxhi6-ns{max-height:32rem}.mxhi7-ns{max-height:48rem}.mxhi8-ns{max-height:64rem}.mxhi9-ns{max-height:96rem}.mxhi10-ns{max-height:128rem}.mxhi-none-ns{max-height:none}.mxhi-max-ns{max-height:max-content}.mxhi-min-ns{max-height:min-content}.mxhi-fit-ns{max-height:fit-content}.mxhi-fill-ns{max-height:fill-available}}@media screen and (min-width: 48em) and (max-width: 64em){.mxhi1-m{max-height:1rem}.mxhi2-m{max-height:2rem}.mxhi3-m{max-height:4rem}.mxhi4-m{max-height:8rem}.mxhi5-m{max-height:16rem}.mxhi6-m{max-height:32rem}.mxhi7-m{max-height:48rem}.mxhi8-m{max-height:64rem}.mxhi9-m{max-height:96rem}.mxhi10-m{max-height:128rem}.mxhi-none-m{max-height:none}.mxhi-max-m{max-height:max-content}.mxhi-min-m{max-height:min-content}.mxhi-fit-m{max-height:fit-content}.mxhi-fill-m{max-height:fill-available}}@media screen and (min-width: 64em){.mxhi1-l{max-height:1rem}.mxhi2-l{max-height:2rem}.mxhi3-l{max-height:4rem}.mxhi4-l{max-height:8rem}.mxhi5-l{max-height:16rem}.mxhi6-l{max-height:32rem}.mxhi7-l{max-height:48rem}.mxhi8-l{max-height:64rem}.mxhi9-l{max-height:96rem}.mxhi10-l{max-height:128rem}.mxhi-none-l{max-height:none}.mxhi-max-l{max-height:max-content}.mxhi-min-l{max-height:min-content}.mxhi-fit-l{max-height:fit-content}.mxhi-fill-l{max-height:fill-available}}.mx-wi-100{max-width:100%}.mx-wi-75{max-width:75%}.mx-wi-50{max-width:50%}.mx-wi-25{max-width:25%}.mx-wi1{max-width:1rem}.mx-wi2{max-width:2rem}.mx-wi3{max-width:4rem}.mx-wi4{max-width:8rem}.mx-wi5{max-width:16rem}.mx-wi6{max-width:32rem}.mx-wi7{max-width:48rem}.mx-wi8{max-width:64rem}.mx-wi9{max-width:96rem}.mx-wi10{max-width:128rem}.mx-wi-none{max-width:none}.mx-wi-max{max-width:max-content}.mx-wi-min{max-width:min-content}.mx-wi-fit{max-width:fit-content}.mx-wi-fill{max-width:fill-available}@media screen and (min-width: 48em){.mx-wi-100-ns{max-width:100%}.mx-wi-75-ns{max-width:75%}.mx-wi-50-ns{max-width:50%}.mx-wi-25-ns{max-width:25%}.mx-wi1-ns{max-width:1rem}.mx-wi2-ns{max-width:2rem}.mx-wi3-ns{max-width:4rem}.mx-wi4-ns{max-width:8rem}.mx-wi5-ns{max-width:16rem}.mx-wi6-ns{max-width:32rem}.mx-wi7-ns{max-width:48rem}.mx-wi8-ns{max-width:64rem}.mx-wi9-ns{max-width:96rem}.mx-wi10-ns{max-width:128rem}.mx-wi-none-ns{max-width:none}.mx-wi-max-ns{max-width:max-content}.mx-wi-min-ns{max-width:min-content}.mx-wi-fit-ns{max-width:fit-content}.mx-wi-fill-ns{max-width:fill-available}}@media screen and (min-width: 48em) and (max-width: 64em){.mx-wi-100-m{max-width:100%}.mx-wi-75-m{max-width:75%}.mx-wi-50-m{max-width:50%}.mx-wi-25-m{max-width:25%}.mx-wi1-m{max-width:1rem}.mx-wi2-m{max-width:2rem}.mx-wi3-m{max-width:4rem}.mx-wi4-m{max-width:8rem}.mx-wi5-m{max-width:16rem}.mx-wi6-m{max-width:32rem}.mx-wi7-m{max-width:48rem}.mx-wi8-m{max-width:64rem}.mx-wi9-m{max-width:96rem}.mx-wi10-m{max-width:128rem}.mx-wi-none-m{max-width:none}.mx-wi-max-m{max-width:max-content}.mx-wi-min-m{max-width:min-content}.mx-wi-fit-m{max-width:fit-content}.mx-wi-fill-m{max-width:fill-available}}@media screen and (min-width: 64em){.mx-wi-100-l{max-width:100%}.mx-wi-75-l{max-width:75%}.mx-wi-50-l{max-width:50%}.mx-wi-25-l{max-width:25%}.mx-wi1-l{max-width:1rem}.mx-wi2-l{max-width:2rem}.mx-wi3-l{max-width:4rem}.mx-wi4-l{max-width:8rem}.mx-wi5-l{max-width:16rem}.mx-wi6-l{max-width:32rem}.mx-wi7-l{max-width:48rem}.mx-wi8-l{max-width:64rem}.mx-wi9-l{max-width:96rem}.mx-wi10-l{max-width:128rem}.mx-wi-none-l{max-width:none}.mx-wi-max-l{max-width:max-content}.mx-wi-min-l{max-width:min-content}.mx-wi-fit-l{max-width:fit-content}.mx-wi-fill-l{max-width:fill-available}}.mn-hi-100{min-height:100%}.mn-hi-75{min-height:75%}.mn-hi-50{min-height:50%}.mn-hi-25{min-height:25%}.mn-hi1{min-height:1rem}.mn-hi2{min-height:2rem}.mn-hi3{min-height:4rem}.mn-hi4{min-height:8rem}.mn-hi5{min-height:16rem}.mn-hi6{min-height:32rem}.mn-hi7{min-height:48rem}.mn-hi8{min-height:64rem}.mn-hi9{min-height:96rem}.mn-hi10{min-height:128rem}.mn-hi-max{min-height:max-content}.mn-hi-min{min-height:min-content}.mn-hi-fit{min-height:fit-content}.mn-hi-fill{min-height:fill-available}@media screen and (min-width: 48em){.mn-hi-100-ns{min-height:100%}.mn-hi-75-ns{min-height:75%}.mn-hi-50-ns{min-height:50%}.mn-hi-25-ns{min-height:25%}.mn-hi1-ns{min-height:1rem}.mn-hi2-ns{min-height:2rem}.mn-hi3-ns{min-height:4rem}.mn-hi4-ns{min-height:8rem}.mn-hi5-ns{min-height:16rem}.mn-hi6-ns{min-height:32rem}.mn-hi7-ns{min-height:48rem}.mn-hi8-ns{min-height:64rem}.mn-hi9-ns{min-height:96rem}.mn-hi10-ns{min-height:128rem}.mn-hi-max-ns{min-height:max-content}.mn-hi-min-ns{min-height:min-content}.mn-hi-fit-ns{min-height:fit-content}.mn-hi-fill-ns{min-height:fill-available}}@media screen and (min-width: 48em) and (max-width: 64em){.mn-hi-100-m{min-height:100%}.mn-hi-75-m{min-height:75%}.mn-hi-50-m{min-height:50%}.mn-hi-25-m{min-height:25%}.mn-hi1-m{min-height:1rem}.mn-hi2-m{min-height:2rem}.mn-hi3-m{min-height:4rem}.mn-hi4-m{min-height:8rem}.mn-hi5-m{min-height:16rem}.mn-hi6-m{min-height:32rem}.mn-hi7-m{min-height:48rem}.mn-hi8-m{min-height:64rem}.mn-hi9-m{min-height:96rem}.mn-hi10-m{min-height:128rem}.mn-hi-max-m{min-height:max-content}.mn-hi-min-m{min-height:min-content}.mn-hi-fit-m{min-height:fit-content}.mn-hi-fill-m{min-height:fill-available}}@media screen and (min-width: 64em){.mn-hi-100-l{min-height:100%}.mn-hi-75-l{min-height:75%}.mn-hi-50-l{min-height:50%}.mn-hi-25-l{min-height:25%}.mn-hi1-l{min-height:1rem}.mn-hi2-l{min-height:2rem}.mn-hi3-l{min-height:4rem}.mn-hi4-l{min-height:8rem}.mn-hi5-l{min-height:16rem}.mn-hi6-l{min-height:32rem}.mn-hi7-l{min-height:48rem}.mn-hi8-l{min-height:64rem}.mn-hi9-l{min-height:96rem}.mn-hi10-l{min-height:128rem}.mn-hi-max-l{min-height:max-content}.mn-hi-min-l{min-height:min-content}.mn-hi-fit-l{min-height:fit-content}.mn-hi-fill-l{min-height:fill-available}}.mn-wi-1{min-width:1%}.mn-wi-2{min-width:2%}.mn-wi-3{min-width:3%}.mn-wi-4{min-width:4%}.mn-wi-5{min-width:5%}.mn-wi-6{min-width:6%}.mn-wi-7{min-width:7%}.mn-wi-8{min-width:8%}.mn-wi-9{min-width:9%}.mn-wi-10{min-width:10%}.mn-wi-11{min-width:11%}.mn-wi-12{min-width:12%}.mn-wi-13{min-width:13%}.mn-wi-14{min-width:14%}.mn-wi-15{min-width:15%}.mn-wi-16{min-width:16%}.mn-wi-17{min-width:17%}.mn-wi-18{min-width:18%}.mn-wi-19{min-width:19%}.mn-wi-20{min-width:20%}.mn-wi-21{min-width:21%}.mn-wi-22{min-width:22%}.mn-wi-23{min-width:23%}.mn-wi-24{min-width:24%}.mn-wi-25{min-width:25%}.mn-wi-26{min-width:26%}.mn-wi-27{min-width:27%}.mn-wi-28{min-width:28%}.mn-wi-29{min-width:29%}.mn-wi-30{min-width:30%}.mn-wi-31{min-width:31%}.mn-wi-32{min-width:32%}.mn-wi-33{min-width:33%}.mn-wi-34{min-width:34%}.mn-wi-35{min-width:35%}.mn-wi-36{min-width:36%}.mn-wi-37{min-width:37%}.mn-wi-38{min-width:38%}.mn-wi-39{min-width:39%}.mn-wi-40{min-width:40%}.mn-wi-41{min-width:41%}.mn-wi-42{min-width:42%}.mn-wi-43{min-width:43%}.mn-wi-44{min-width:44%}.mn-wi-45{min-width:45%}.mn-wi-46{min-width:46%}.mn-wi-47{min-width:47%}.mn-wi-48{min-width:48%}.mn-wi-49{min-width:49%}.mn-wi-50{min-width:50%}.mn-wi-51{min-width:51%}.mn-wi-52{min-width:52%}.mn-wi-53{min-width:53%}.mn-wi-54{min-width:54%}.mn-wi-55{min-width:55%}.mn-wi-56{min-width:56%}.mn-wi-57{min-width:57%}.mn-wi-58{min-width:58%}.mn-wi-59{min-width:59%}.mn-wi-60{min-width:60%}.mn-wi-61{min-width:61%}.mn-wi-62{min-width:62%}.mn-wi-63{min-width:63%}.mn-wi-64{min-width:64%}.mn-wi-65{min-width:65%}.mn-wi-66{min-width:66%}.mn-wi-67{min-width:67%}.mn-wi-68{min-width:68%}.mn-wi-69{min-width:69%}.mn-wi-70{min-width:70%}.mn-wi-71{min-width:71%}.mn-wi-72{min-width:72%}.mn-wi-73{min-width:73%}.mn-wi-74{min-width:74%}.mn-wi-75{min-width:75%}.mn-wi-76{min-width:76%}.mn-wi-77{min-width:77%}.mn-wi-78{min-width:78%}.mn-wi-79{min-width:79%}.mn-wi-80{min-width:80%}.mn-wi-81{min-width:81%}.mn-wi-82{min-width:82%}.mn-wi-83{min-width:83%}.mn-wi-84{min-width:84%}.mn-wi-85{min-width:85%}.mn-wi-86{min-width:86%}.mn-wi-87{min-width:87%}.mn-wi-88{min-width:88%}.mn-wi-89{min-width:89%}.mn-wi-90{min-width:90%}.mn-wi-91{min-width:91%}.mn-wi-92{min-width:92%}.mn-wi-93{min-width:93%}.mn-wi-94{min-width:94%}.mn-wi-95{min-width:95%}.mn-wi-96{min-width:96%}.mn-wi-97{min-width:97%}.mn-wi-98{min-width:98%}.mn-wi-99{min-width:99%}.mn-wi-100{min-width:100%}.mn-wi1{min-width:1rem}.mn-wi2{min-width:2rem}.mn-wi3{min-width:4rem}.mn-wi4{min-width:8rem}.mn-wi5{min-width:16rem}.mn-wi6{min-width:32rem}.mn-wi7{min-width:48rem}.mn-wi8{min-width:64rem}.mn-wi9{min-width:96rem}.mn-wi10{min-width:128rem}.mn-wi-max{min-width:max-content}.mn-wi-min{min-width:min-content}.mn-wi-fit{min-width:fit-content}.mn-wi-fill{min-width:fill-available}@media screen and (min-width: 48em){.mn-wi-1-ns{min-width:1%}.mn-wi-2-ns{min-width:2%}.mn-wi-3-ns{min-width:3%}.mn-wi-4-ns{min-width:4%}.mn-wi-5-ns{min-width:5%}.mn-wi-6-ns{min-width:6%}.mn-wi-7-ns{min-width:7%}.mn-wi-8-ns{min-width:8%}.mn-wi-9-ns{min-width:9%}.mn-wi-10-ns{min-width:10%}.mn-wi-11-ns{min-width:11%}.mn-wi-12-ns{min-width:12%}.mn-wi-13-ns{min-width:13%}.mn-wi-14-ns{min-width:14%}.mn-wi-15-ns{min-width:15%}.mn-wi-16-ns{min-width:16%}.mn-wi-17-ns{min-width:17%}.mn-wi-18-ns{min-width:18%}.mn-wi-19-ns{min-width:19%}.mn-wi-20-ns{min-width:20%}.mn-wi-21-ns{min-width:21%}.mn-wi-22-ns{min-width:22%}.mn-wi-23-ns{min-width:23%}.mn-wi-24-ns{min-width:24%}.mn-wi-25-ns{min-width:25%}.mn-wi-26-ns{min-width:26%}.mn-wi-27-ns{min-width:27%}.mn-wi-28-ns{min-width:28%}.mn-wi-29-ns{min-width:29%}.mn-wi-30-ns{min-width:30%}.mn-wi-31-ns{min-width:31%}.mn-wi-32-ns{min-width:32%}.mn-wi-33-ns{min-width:33%}.mn-wi-34-ns{min-width:34%}.mn-wi-35-ns{min-width:35%}.mn-wi-36-ns{min-width:36%}.mn-wi-37-ns{min-width:37%}.mn-wi-38-ns{min-width:38%}.mn-wi-39-ns{min-width:39%}.mn-wi-40-ns{min-width:40%}.mn-wi-41-ns{min-width:41%}.mn-wi-42-ns{min-width:42%}.mn-wi-43-ns{min-width:43%}.mn-wi-44-ns{min-width:44%}.mn-wi-45-ns{min-width:45%}.mn-wi-46-ns{min-width:46%}.mn-wi-47-ns{min-width:47%}.mn-wi-48-ns{min-width:48%}.mn-wi-49-ns{min-width:49%}.mn-wi-50-ns{min-width:50%}.mn-wi-51-ns{min-width:51%}.mn-wi-52-ns{min-width:52%}.mn-wi-53-ns{min-width:53%}.mn-wi-54-ns{min-width:54%}.mn-wi-55-ns{min-width:55%}.mn-wi-56-ns{min-width:56%}.mn-wi-57-ns{min-width:57%}.mn-wi-58-ns{min-width:58%}.mn-wi-59-ns{min-width:59%}.mn-wi-60-ns{min-width:60%}.mn-wi-61-ns{min-width:61%}.mn-wi-62-ns{min-width:62%}.mn-wi-63-ns{min-width:63%}.mn-wi-64-ns{min-width:64%}.mn-wi-65-ns{min-width:65%}.mn-wi-66-ns{min-width:66%}.mn-wi-67-ns{min-width:67%}.mn-wi-68-ns{min-width:68%}.mn-wi-69-ns{min-width:69%}.mn-wi-70-ns{min-width:70%}.mn-wi-71-ns{min-width:71%}.mn-wi-72-ns{min-width:72%}.mn-wi-73-ns{min-width:73%}.mn-wi-74-ns{min-width:74%}.mn-wi-75-ns{min-width:75%}.mn-wi-76-ns{min-width:76%}.mn-wi-77-ns{min-width:77%}.mn-wi-78-ns{min-width:78%}.mn-wi-79-ns{min-width:79%}.mn-wi-80-ns{min-width:80%}.mn-wi-81-ns{min-width:81%}.mn-wi-82-ns{min-width:82%}.mn-wi-83-ns{min-width:83%}.mn-wi-84-ns{min-width:84%}.mn-wi-85-ns{min-width:85%}.mn-wi-86-ns{min-width:86%}.mn-wi-87-ns{min-width:87%}.mn-wi-88-ns{min-width:88%}.mn-wi-89-ns{min-width:89%}.mn-wi-90-ns{min-width:90%}.mn-wi-91-ns{min-width:91%}.mn-wi-92-ns{min-width:92%}.mn-wi-93-ns{min-width:93%}.mn-wi-94-ns{min-width:94%}.mn-wi-95-ns{min-width:95%}.mn-wi-96-ns{min-width:96%}.mn-wi-97-ns{min-width:97%}.mn-wi-98-ns{min-width:98%}.mn-wi-99-ns{min-width:99%}.mn-wi-100-ns{min-width:100%}.mn-wi1-ns{min-width:1rem}.mn-wi2-ns{min-width:2rem}.mn-wi3-ns{min-width:4rem}.mn-wi4-ns{min-width:8rem}.mn-wi5-ns{min-width:16rem}.mn-wi6-ns{min-width:32rem}.mn-wi7-ns{min-width:48rem}.mn-wi8-ns{min-width:64rem}.mn-wi9-ns{min-width:96rem}.mn-wi10-ns{min-width:128rem}.mn-wi-max-ns{min-width:max-content}.mn-wi-min-ns{min-width:min-content}.mn-wi-fit-ns{min-width:fit-content}.mn-wi-fill-ns{min-width:fill-available}}@media screen and (min-width: 48em) and (max-width: 64em){.mn-wi-1-m{min-width:1%}.mn-wi-2-m{min-width:2%}.mn-wi-3-m{min-width:3%}.mn-wi-4-m{min-width:4%}.mn-wi-5-m{min-width:5%}.mn-wi-6-m{min-width:6%}.mn-wi-7-m{min-width:7%}.mn-wi-8-m{min-width:8%}.mn-wi-9-m{min-width:9%}.mn-wi-10-m{min-width:10%}.mn-wi-11-m{min-width:11%}.mn-wi-12-m{min-width:12%}.mn-wi-13-m{min-width:13%}.mn-wi-14-m{min-width:14%}.mn-wi-15-m{min-width:15%}.mn-wi-16-m{min-width:16%}.mn-wi-17-m{min-width:17%}.mn-wi-18-m{min-width:18%}.mn-wi-19-m{min-width:19%}.mn-wi-20-m{min-width:20%}.mn-wi-21-m{min-width:21%}.mn-wi-22-m{min-width:22%}.mn-wi-23-m{min-width:23%}.mn-wi-24-m{min-width:24%}.mn-wi-25-m{min-width:25%}.mn-wi-26-m{min-width:26%}.mn-wi-27-m{min-width:27%}.mn-wi-28-m{min-width:28%}.mn-wi-29-m{min-width:29%}.mn-wi-30-m{min-width:30%}.mn-wi-31-m{min-width:31%}.mn-wi-32-m{min-width:32%}.mn-wi-33-m{min-width:33%}.mn-wi-34-m{min-width:34%}.mn-wi-35-m{min-width:35%}.mn-wi-36-m{min-width:36%}.mn-wi-37-m{min-width:37%}.mn-wi-38-m{min-width:38%}.mn-wi-39-m{min-width:39%}.mn-wi-40-m{min-width:40%}.mn-wi-41-m{min-width:41%}.mn-wi-42-m{min-width:42%}.mn-wi-43-m{min-width:43%}.mn-wi-44-m{min-width:44%}.mn-wi-45-m{min-width:45%}.mn-wi-46-m{min-width:46%}.mn-wi-47-m{min-width:47%}.mn-wi-48-m{min-width:48%}.mn-wi-49-m{min-width:49%}.mn-wi-50-m{min-width:50%}.mn-wi-51-m{min-width:51%}.mn-wi-52-m{min-width:52%}.mn-wi-53-m{min-width:53%}.mn-wi-54-m{min-width:54%}.mn-wi-55-m{min-width:55%}.mn-wi-56-m{min-width:56%}.mn-wi-57-m{min-width:57%}.mn-wi-58-m{min-width:58%}.mn-wi-59-m{min-width:59%}.mn-wi-60-m{min-width:60%}.mn-wi-61-m{min-width:61%}.mn-wi-62-m{min-width:62%}.mn-wi-63-m{min-width:63%}.mn-wi-64-m{min-width:64%}.mn-wi-65-m{min-width:65%}.mn-wi-66-m{min-width:66%}.mn-wi-67-m{min-width:67%}.mn-wi-68-m{min-width:68%}.mn-wi-69-m{min-width:69%}.mn-wi-70-m{min-width:70%}.mn-wi-71-m{min-width:71%}.mn-wi-72-m{min-width:72%}.mn-wi-73-m{min-width:73%}.mn-wi-74-m{min-width:74%}.mn-wi-75-m{min-width:75%}.mn-wi-76-m{min-width:76%}.mn-wi-77-m{min-width:77%}.mn-wi-78-m{min-width:78%}.mn-wi-79-m{min-width:79%}.mn-wi-80-m{min-width:80%}.mn-wi-81-m{min-width:81%}.mn-wi-82-m{min-width:82%}.mn-wi-83-m{min-width:83%}.mn-wi-84-m{min-width:84%}.mn-wi-85-m{min-width:85%}.mn-wi-86-m{min-width:86%}.mn-wi-87-m{min-width:87%}.mn-wi-88-m{min-width:88%}.mn-wi-89-m{min-width:89%}.mn-wi-90-m{min-width:90%}.mn-wi-91-m{min-width:91%}.mn-wi-92-m{min-width:92%}.mn-wi-93-m{min-width:93%}.mn-wi-94-m{min-width:94%}.mn-wi-95-m{min-width:95%}.mn-wi-96-m{min-width:96%}.mn-wi-97-m{min-width:97%}.mn-wi-98-m{min-width:98%}.mn-wi-99-m{min-width:99%}.mn-wi-100-m{min-width:100%}.mn-wi1-m{min-width:1rem}.mn-wi2-m{min-width:2rem}.mn-wi3-m{min-width:4rem}.mn-wi4-m{min-width:8rem}.mn-wi5-m{min-width:16rem}.mn-wi6-m{min-width:32rem}.mn-wi7-m{min-width:48rem}.mn-wi8-m{min-width:64rem}.mn-wi9-m{min-width:96rem}.mn-wi10-m{min-width:128rem}.mn-wi-max-m{min-width:max-content}.mn-wi-min-m{min-width:min-content}.mn-wi-fit-m{min-width:fit-content}.mn-wi-fill-m{min-width:fill-available}}@media screen and (min-width: 64em){.mn-wi-1-l{min-width:1%}.mn-wi-2-l{min-width:2%}.mn-wi-3-l{min-width:3%}.mn-wi-4-l{min-width:4%}.mn-wi-5-l{min-width:5%}.mn-wi-6-l{min-width:6%}.mn-wi-7-l{min-width:7%}.mn-wi-8-l{min-width:8%}.mn-wi-9-l{min-width:9%}.mn-wi-10-l{min-width:10%}.mn-wi-11-l{min-width:11%}.mn-wi-12-l{min-width:12%}.mn-wi-13-l{min-width:13%}.mn-wi-14-l{min-width:14%}.mn-wi-15-l{min-width:15%}.mn-wi-16-l{min-width:16%}.mn-wi-17-l{min-width:17%}.mn-wi-18-l{min-width:18%}.mn-wi-19-l{min-width:19%}.mn-wi-20-l{min-width:20%}.mn-wi-21-l{min-width:21%}.mn-wi-22-l{min-width:22%}.mn-wi-23-l{min-width:23%}.mn-wi-24-l{min-width:24%}.mn-wi-25-l{min-width:25%}.mn-wi-26-l{min-width:26%}.mn-wi-27-l{min-width:27%}.mn-wi-28-l{min-width:28%}.mn-wi-29-l{min-width:29%}.mn-wi-30-l{min-width:30%}.mn-wi-31-l{min-width:31%}.mn-wi-32-l{min-width:32%}.mn-wi-33-l{min-width:33%}.mn-wi-34-l{min-width:34%}.mn-wi-35-l{min-width:35%}.mn-wi-36-l{min-width:36%}.mn-wi-37-l{min-width:37%}.mn-wi-38-l{min-width:38%}.mn-wi-39-l{min-width:39%}.mn-wi-40-l{min-width:40%}.mn-wi-41-l{min-width:41%}.mn-wi-42-l{min-width:42%}.mn-wi-43-l{min-width:43%}.mn-wi-44-l{min-width:44%}.mn-wi-45-l{min-width:45%}.mn-wi-46-l{min-width:46%}.mn-wi-47-l{min-width:47%}.mn-wi-48-l{min-width:48%}.mn-wi-49-l{min-width:49%}.mn-wi-50-l{min-width:50%}.mn-wi-51-l{min-width:51%}.mn-wi-52-l{min-width:52%}.mn-wi-53-l{min-width:53%}.mn-wi-54-l{min-width:54%}.mn-wi-55-l{min-width:55%}.mn-wi-56-l{min-width:56%}.mn-wi-57-l{min-width:57%}.mn-wi-58-l{min-width:58%}.mn-wi-59-l{min-width:59%}.mn-wi-60-l{min-width:60%}.mn-wi-61-l{min-width:61%}.mn-wi-62-l{min-width:62%}.mn-wi-63-l{min-width:63%}.mn-wi-64-l{min-width:64%}.mn-wi-65-l{min-width:65%}.mn-wi-66-l{min-width:66%}.mn-wi-67-l{min-width:67%}.mn-wi-68-l{min-width:68%}.mn-wi-69-l{min-width:69%}.mn-wi-70-l{min-width:70%}.mn-wi-71-l{min-width:71%}.mn-wi-72-l{min-width:72%}.mn-wi-73-l{min-width:73%}.mn-wi-74-l{min-width:74%}.mn-wi-75-l{min-width:75%}.mn-wi-76-l{min-width:76%}.mn-wi-77-l{min-width:77%}.mn-wi-78-l{min-width:78%}.mn-wi-79-l{min-width:79%}.mn-wi-80-l{min-width:80%}.mn-wi-81-l{min-width:81%}.mn-wi-82-l{min-width:82%}.mn-wi-83-l{min-width:83%}.mn-wi-84-l{min-width:84%}.mn-wi-85-l{min-width:85%}.mn-wi-86-l{min-width:86%}.mn-wi-87-l{min-width:87%}.mn-wi-88-l{min-width:88%}.mn-wi-89-l{min-width:89%}.mn-wi-90-l{min-width:90%}.mn-wi-91-l{min-width:91%}.mn-wi-92-l{min-width:92%}.mn-wi-93-l{min-width:93%}.mn-wi-94-l{min-width:94%}.mn-wi-95-l{min-width:95%}.mn-wi-96-l{min-width:96%}.mn-wi-97-l{min-width:97%}.mn-wi-98-l{min-width:98%}.mn-wi-99-l{min-width:99%}.mn-wi-100-l{min-width:100%}.mn-wi1-l{min-width:1rem}.mn-wi2-l{min-width:2rem}.mn-wi3-l{min-width:4rem}.mn-wi4-l{min-width:8rem}.mn-wi5-l{min-width:16rem}.mn-wi6-l{min-width:32rem}.mn-wi7-l{min-width:48rem}.mn-wi8-l{min-width:64rem}.mn-wi9-l{min-width:96rem}.mn-wi10-l{min-width:128rem}.mn-wi-max-l{min-width:max-content}.mn-wi-min-l{min-width:min-content}.mn-wi-fit-l{min-width:fit-content}.mn-wi-fill-l{min-width:fill-available}}/* normalize.css v2.1.2 | MIT License | git.io/normalize */article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block}audio:not([controls]){display:none;height:0}[hidden],template{display:none}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}a{background:transparent}a:focus{outline:thin dotted}a:active,a:hover{outline:0}h1{margin:0.67em 0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}mark{background:#ff0;color:#000}code,kbd,pre,samp{font-family:monospace, serif;font-size:1em}pre{white-space:pre-wrap}q{quotes:"\201C" "\201D" "\2018" "\2019"}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:0}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em}legend{border:0;padding:0}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0}button,input{line-height:normal}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0}.o-10{opacity:.1}.o-20{opacity:.2}.o-30{opacity:.3}.o-40{opacity:.4}.o-50{opacity:.5}.o-60{opacity:.6}.o-70{opacity:.7}.o-80{opacity:.8}.o-90{opacity:.9}.o-full{opacity:1}@media screen and (min-width: 48em){.o-10-ns{opacity:.1}.o-20-ns{opacity:.2}.o-30-ns{opacity:.3}.o-40-ns{opacity:.4}.o-50-ns{opacity:.5}.o-60-ns{opacity:.6}.o-70-ns{opacity:.7}.o-80-ns{opacity:.8}.o-90-ns{opacity:.9}.o-full-ns{opacity:1}}@media screen and (min-width: 48em) and (max-width: 64em){.o-10-m{opacity:.1}.o-20-m{opacity:.2}.o-30-m{opacity:.3}.o-40-m{opacity:.4}.o-50-m{opacity:.5}.o-60-m{opacity:.6}.o-70-m{opacity:.7}.o-80-m{opacity:.8}.o-90-m{opacity:.9}.o-full-m{opacity:1}}@media screen and (min-width: 64em){.o-10-l{opacity:.1}.o-20-l{opacity:.2}.o-30-l{opacity:.3}.o-40-l{opacity:.4}.o-50-l{opacity:.5}.o-60-l{opacity:.6}.o-70-l{opacity:.7}.o-80-l{opacity:.8}.o-90-l{opacity:.9}.o-full-l{opacity:1}}.of-vis{overflow:visible}.of-hid{overflow:hidden}.of-scr{overflow:scroll}.of-aut{overflow:auto}@media screen and (min-width: 48em){.of-vis-ns{overflow:visible}.of-hid-ns{overflow:hidden}.of-scr-ns{overflow:scroll}.of-aut-ns{overflow:auto}}@media screen and (min-width: 48em) and (max-width: 64em){.of-vis-m{overflow:visible}.of-hid-m{overflow:hidden}.of-scr-m{overflow:scroll}.of-aut-m{overflow:auto}}@media screen and (min-width: 64em){.of-vis-l{overflow:visible}.of-hid-l{overflow:hidden}.of-scr-l{overflow:scroll}.of-aut-l{overflow:auto}}.pos-stat{position:static}.pos-rel{position:relative}.pos-abs{position:absolute}.pos-fix{position:fixed}.top-0{top:0}.left-0{left:0}.right-0{right:0}.bottom-0{bottom:0}.top-1{top:1rem}.left-1{left:1rem}.right-1{right:1rem}.bottom-1{bottom:1rem}.top-2{top:2rem}.left-2{left:2rem}.right-2{right:2rem}.bottom-2{bottom:2rem}.top-4{top:4rem}.left-4{left:4rem}.right-4{right:4rem}.bottom-4{bottom:4rem}.top-10{top:10%}.top-20{top:20%}.top-30{top:30%}.top-40{top:40%}.top-50{top:50%}.top-60{top:60%}.top-70{top:70%}.top-80{top:80%}.top-90{top:90%}.top-100{top:100%}.top-auto{top:auto}.top-i{top:inherit}.center{margin:0 auto}@media screen and (min-width: 48em){.pos-stat-ns{position:static}.pos-rel-ns{position:relative}.pos-abs-ns{position:absolute}.pos-fix-ns{position:fixed}.top-0-ns{top:0}.left-0-ns{left:0}.right-0-ns{right:0}.bottom-0-ns{bottom:0}.top-1-ns{top:1rem}.left-1-ns{left:1rem}.right-1-ns{right:1rem}.bottom-1-ns{bottom:1rem}.top-2-ns{top:2rem}.left-2-ns{left:2rem}.right-2-ns{right:2rem}.bottom-2-ns{bottom:2rem}.top-4-ns{top:4rem}.left-4-ns{left:4rem}.right-4-ns{right:4rem}.bottom-4-ns{bottom:4rem}.top-10-ns{top:10%}.top-20-ns{top:20%}.top-30-ns{top:30%}.top-40-ns{top:40%}.top-50-ns{top:50%}.top-60-ns{top:60%}.top-70-ns{top:70%}.top-80-ns{top:80%}.top-90-ns{top:90%}.top-100-ns{top:100%}.top-auto-ns{top:auto}.top-i-ns{top:inherit}.center-ns{margin:0 auto}}@media screen and (min-width: 48em) and (max-width: 64em){.pos-stat-m{position:static}.pos-rel-m{position:relative}.pos-abs-m{position:absolute}.pos-fix-m{position:fixed}.top-0-m{top:0}.left-0-m{left:0}.right-0-m{right:0}.bottom-0-m{bottom:0}.top-1-m{top:1rem}.left-1-m{left:1rem}.right-1-m{right:1rem}.bottom-1-m{bottom:1rem}.top-2-m{top:2rem}.left-2-m{left:2rem}.right-2-m{right:2rem}.bottom-2-m{bottom:2rem}.top-4-m{top:4rem}.left-4-m{left:4rem}.right-4-m{right:4rem}.bottom-4-m{bottom:4rem}.top-10-m{top:10%}.top-20-m{top:20%}.top-30-m{top:30%}.top-40-m{top:40%}.top-50-m{top:50%}.top-60-m{top:60%}.top-70-m{top:70%}.top-80-m{top:80%}.top-90-m{top:90%}.top-100-m{top:100%}.top-auto-m{top:auto}.top-i-m{top:inherit}.center-m{margin:0 auto}}@media screen and (min-width: 64em){.pos-stat-l{position:static}.pos-rel-l{position:relative}.pos-abs-l{position:absolute}.pos-fix-l{position:fixed}.top-0-l{top:0}.left-0-l{left:0}.right-0-l{right:0}.bottom-0-l{bottom:0}.top-1-l{top:1rem}.left-1-l{left:1rem}.right-1-l{right:1rem}.bottom-1-l{bottom:1rem}.top-2-l{top:2rem}.left-2-l{left:2rem}.right-2-l{right:2rem}.bottom-2-l{bottom:2rem}.top-4-l{top:4rem}.left-4-l{left:4rem}.right-4-l{right:4rem}.bottom-4-l{bottom:4rem}.top-10-l{top:10%}.top-20-l{top:20%}.top-30-l{top:30%}.top-40-l{top:40%}.top-50-l{top:50%}.top-60-l{top:60%}.top-70-l{top:70%}.top-80-l{top:80%}.top-90-l{top:90%}.top-100-l{top:100%}.top-auto-l{top:auto}.top-i-l{top:inherit}.center-l{margin:0 auto}}.blk{color:#111}.dk-gry{color:#333}.md-gry{color:#666}.gray{color:gray}.silver{color:silver}.lt-slvr{color:#aaa}.lt-gry{color:#ccc}.near-wht{color:#eee}.wht{color:#fff}.pink{color:pink}.lightpink{color:#ffb6c1}.hotpink{color:hotpink}.deeppink{color:#ff1493}.palevioletred{color:#db7093}.mediumvioletred{color:#c71585}.lightsalmon{color:#ffa07a}.salmon{color:salmon}.darksalmon{color:#e9967a}.lightcoral{color:#f08080}.indianred{color:#cd5c5c}.crimson{color:crimson}.firebrick{color:#b22222}.darkred{color:darkred}.red{color:red}.orangered{color:#ff4500}.tomato{color:tomato}.coral{color:coral}.darkorange{color:#ff8c00}.orange{color:orange}.gold{color:gold}.yellow{color:#ff0}.lightyellow{color:#ffffe0}.lemonchiffon{color:#fffacd}.lightgoldenrodyellow{color:#fafad2}.papayawhip{color:#ffefd5}.moccasin{color:#ffe4b5}.peachpuff{color:#ffdab9}.palegoldenrod{color:#eee8aa}.khaki{color:khaki}.darkkhaki{color:#bdb76b}.cornsilk{color:#fff8dc}.blanchedalmond{color:#ffebcd}.bisque{color:bisque}.navajowhite{color:#ffdead}.wheat{color:wheat}.burlywood{color:#deb887}.tan{color:tan}.rosybrown{color:#bc8f8f}.sandybrown{color:#f4a460}.goldenrod{color:#daa520}.darkgoldenrod{color:#b8860b}.peru{color:peru}.chocolate{color:#d2691e}.saddlebrown{color:#8b4513}.sienna{color:sienna}.brown{color:brown}.maroon{color:maroon}.darkolivegreen{color:#556b2f}.olive{color:olive}.olivedrab{color:#6b8e23}.yellowgreen{color:#9acd32}.limegreen{color:#32cd32}.lime{color:lime}.lawngreen{color:#7cfc00}.chartreuse{color:#7fff00}.greenyellow{color:#adff2f}.springgreen{color:#00ff7f}.mediumspringgreen{color:#00fa9a}.lightgreen{color:#90ee90}.palegreen{color:#98fb98}.darkseagreen{color:#8fbc8f}.mediumseagreen{color:#3cb371}.seagreen{color:#2e8b57}.forestgreen{color:#228b22}.green{color:green}.darkgreen{color:#006400}.mediumaquamarine{color:#66cdaa}.aqua{color:cyan}.cyan{color:cyan}.lightcyan{color:#e0ffff}.paleturquoise{color:#afeeee}.aquamarine{color:#7fffd4}.turquoise{color:#40e0d0}.mediumturquoise{color:#48d1cc}.darkturquoise{color:#00ced1}.lightseagreen{color:#20b2aa}.cadetblue{color:#5f9ea0}.darkcyan{color:#008b8b}.teal{color:teal}.lightsteelblue{color:#b0c4de}.powderblue{color:#b0e0e6}.lightblue{color:#add8e6}.skyblue{color:skyblue}.lightskyblue{color:#87cefa}.deepskyblue{color:#00bfff}.dodgerblue{color:#1e90ff}.cornflowerblue{color:#6495ed}.steelblue{color:#4682b4}.royalblue{color:#4169e1}.blue{color:blue}.mediumblue{color:#0000cd}.darkblue{color:#00008b}.navy{color:navy}.midnightblue{color:#191970}.lavender{color:#e6e6fa}.thistle{color:thistle}.plum{color:plum}.violet{color:violet}.orchid{color:orchid}.fuchsia{color:#f0f}.magenta{color:#f0f}.mediumorchid{color:#ba55d3}.mediumpurple{color:#9370db}.blueviolet{color:#8a2be2}.darkviolet{color:#9400d3}.darkorchid{color:#9932cc}.darkmagenta{color:#8b008b}.purple{color:purple}.indigo{color:indigo}.darkslateblue{color:#483d8b}.slateblue{color:#6a5acd}.mediumslateblue{color:#7b68ee}.white{color:#fff}.snow{color:snow}.honeydew{color:#f0fff0}.mintcream{color:#f5fffa}.azure{color:azure}.aliceblue{color:#f0f8ff}.ghostwhite{color:#f8f8ff}.whitesmoke{color:#f5f5f5}.seashell{color:#fff5ee}.beige{color:beige}.oldlace{color:oldlace}.floralwhite{color:#fffaf0}.ivory{color:ivory}.antiquewhite{color:#faebd7}.linen{color:linen}.lavenderblush{color:#fff0f5}.mistyrose{color:#ffe4e1}.gainsboro{color:#dcdcdc}.lightgray{color:#d3d3d3}.silver{color:silver}.darkgray{color:#a9a9a9}.gray{color:gray}.dimgray{color:dimgrey}.lightslategray{color:#789}.slategray{color:#708090}.darkslategray{color:#2f4f4f}.black{color:#000}.bg-pink{background-color:pink}.bg-lightpink{background-color:#ffb6c1}.bg-hotpink{background-color:hotpink}.bg-deeppink{background-color:#ff1493}.bg-palevioletred{background-color:#db7093}.bg-mediumvioletred{background-color:#c71585}.bg-lightsalmon{background-color:#ffa07a}.bg-salmon{background-color:salmon}.bg-darksalmon{background-color:#e9967a}.bg-lightcoral{background-color:#f08080}.bg-indianred{background-color:#cd5c5c}.bg-crimson{background-color:crimson}.bg-firebrick{background-color:#b22222}.bg-darkred{background-color:darkred}.bg-red{background-color:red}.bg-orangered{background-color:#ff4500}.bg-tomato{background-color:tomato}.bg-coral{background-color:coral}.bg-darkorange{background-color:#ff8c00}.bg-orange{background-color:orange}.bg-gold{background-color:gold}.bg-yellow{background-color:#ff0}.bg-lightyellow{background-color:#ffffe0}.bg-lemonchiffon{background-color:#fffacd}.bg-lightgoldenrodyellow{background-color:#fafad2}.bg-papayawhip{background-color:#ffefd5}.bg-moccasin{background-color:#ffe4b5}.bg-peachpuff{background-color:#ffdab9}.bg-palegoldenrod{background-color:#eee8aa}.bg-khaki{background-color:khaki}.bg-darkkhaki{background-color:#bdb76b}.bg-cornsilk{background-color:#fff8dc}.bg-blanchedalmond{background-color:#ffebcd}.bg-bisque{background-color:bisque}.bg-navajowhite{background-color:#ffdead}.bg-wheat{background-color:wheat}.bg-burlywood{background-color:#deb887}.bg-tan{background-color:tan}.bg-rosybrown{background-color:#bc8f8f}.bg-sandybrown{background-color:#f4a460}.bg-goldenrod{background-color:#daa520}.bg-darkgoldenrod{background-color:#b8860b}.bg-peru{background-color:peru}.bg-chocolate{background-color:#d2691e}.bg-saddlebrown{background-color:#8b4513}.bg-sienna{background-color:sienna}.bg-brown{background-color:brown}.bg-maroon{background-color:maroon}.bg-darkolivegreen{background-color:#556b2f}.bg-olive{background-color:olive}.bg-olivedrab{background-color:#6b8e23}.bg-yellowgreen{background-color:#9acd32}.bg-limegreen{background-color:#32cd32}.bg-lime{background-color:lime}.bg-lawngreen{background-color:#7cfc00}.bg-chartreuse{background-color:#7fff00}.bg-greenyellow{background-color:#adff2f}.bg-springgreen{background-color:#00ff7f}.bg-mediumspringgreen{background-color:#00fa9a}.bg-lightgreen{background-color:#90ee90}.bg-palegreen{background-color:#98fb98}.bg-darkseagreen{background-color:#8fbc8f}.bg-mediumseagreen{background-color:#3cb371}.bg-seagreen{background-color:#2e8b57}.bg-forestgreen{background-color:#228b22}.bg-green{background-color:green}.bg-darkgreen{background-color:#006400}.bg-mediumaquamarine{background-color:#66cdaa}.bg-aqua{background-color:cyan}.bg-cyan{background-color:cyan}.bg-lightcyan{background-color:#e0ffff}.bg-paleturquoise{background-color:#afeeee}.bg-aquamarine{background-color:#7fffd4}.bg-turquoise{background-color:#40e0d0}.bg-mediumturquoise{background-color:#48d1cc}.bg-darkturquoise{background-color:#00ced1}.bg-lightseagreen{background-color:#20b2aa}.bg-cadetblue{background-color:#5f9ea0}.bg-darkcyan{background-color:#008b8b}.bg-teal{background-color:teal}.bg-lightsteelblue{background-color:#b0c4de}.bg-powderblue{background-color:#b0e0e6}.bg-lightblue{background-color:#add8e6}.bg-skyblue{background-color:skyblue}.bg-lightskyblue{background-color:#87cefa}.bg-deepskyblue{background-color:#00bfff}.bg-dodgerblue{background-color:#1e90ff}.bg-cornflowerblue{background-color:#6495ed}.bg-steelblue{background-color:#4682b4}.bg-royalblue{background-color:#4169e1}.bg-blue{background-color:blue}.bg-mediumblue{background-color:#0000cd}.bg-darkblue{background-color:#00008b}.bg-navy{background-color:navy}.bg-midnightblue{background-color:#191970}.bg-lavender{background-color:#e6e6fa}.bg-thistle{background-color:thistle}.bg-plum{background-color:plum}.bg-violet{background-color:violet}.bg-orchid{background-color:orchid}.bg-fuchsia{background-color:#f0f}.bg-magenta{background-color:#f0f}.bg-mediumorchid{background-color:#ba55d3}.bg-mediumpurple{background-color:#9370db}.bg-blueviolet{background-color:#8a2be2}.bg-darkviolet{background-color:#9400d3}.bg-darkorchid{background-color:#9932cc}.bg-darkmagenta{background-color:#8b008b}.bg-purple{background-color:purple}.bg-indigo{background-color:indigo}.bg-darkslateblue{background-color:#483d8b}.bg-slateblue{background-color:#6a5acd}.bg-mediumslateblue{background-color:#7b68ee}.bg-white{background-color:#fff}.bg-snow{background-color:snow}.bg-honeydew{background-color:#f0fff0}.bg-mintcream{background-color:#f5fffa}.bg-azure{background-color:azure}.bg-aliceblue{background-color:#f0f8ff}.bg-ghostwhite{background-color:#f8f8ff}.bg-whitesmoke{background-color:#f5f5f5}.bg-seashell{background-color:#fff5ee}.bg-beige{background-color:beige}.bg-oldlace{background-color:oldlace}.bg-floralwhite{background-color:#fffaf0}.bg-ivory{background-color:ivory}.bg-antiquewhite{background-color:#faebd7}.bg-linen{background-color:linen}.bg-lavenderblush{background-color:#fff0f5}.bg-mistyrose{background-color:#ffe4e1}.bg-gainsboro{background-color:#dcdcdc}.bg-lightgray{background-color:#d3d3d3}.bg-silver{background-color:silver}.bg-darkgray{background-color:#a9a9a9}.bg-gray{background-color:gray}.bg-dimgray{background-color:dimgrey}.bg-lightslategray{background-color:#789}.bg-slategray{background-color:#708090}.bg-darkslategray{background-color:#2f4f4f}.bg-black{background-color:#000}.pan{padding:0}.paxs{padding:.25rem}.pas{padding:.5rem}.pam{padding:1rem}.pal{padding:2rem}.pax{padding:4rem}.paxl{padding:8rem}.paxxl{padding:16rem}.pln{padding-left:0}.plxs{padding-left:.25rem}.pls{padding-left:.5rem}.plm{padding-left:1rem}.pll{padding-left:2rem}.plx{padding-left:4rem}.plxl{padding-left:8rem}.plxxl{padding-left:16rem}.prn{padding-right:0}.prxs{padding-right:.25rem}.prs{padding-right:.5rem}.prm{padding-right:1rem}.prl{padding-right:2rem}.prx{padding-right:4rem}.prxl{padding-right:8rem}.prxxl{padding-right:16rem}.pbn{padding-bottom:0}.pbxs{padding-bottom:.25rem}.pbs{padding-bottom:.5rem}.pbm{padding-bottom:1rem}.pbl{padding-bottom:2rem}.pbx{padding-bottom:4rem}.pbxl{padding-bottom:8rem}.pbxxl{padding-bottom:16rem}.ptn{padding-top:0}.ptxs{padding-top:.25rem}.pts{padding-top:.5rem}.ptm{padding-top:1rem}.ptl{padding-top:2rem}.ptx{padding-top:4rem}.ptxl{padding-top:8rem}.ptxxl{padding-top:16rem}.pvn{padding-top:0;padding-bottom:0}.pvxs{padding-top:.25rem;padding-bottom:.25rem}.pvs{padding-top:.5rem;padding-bottom:.5rem}.pvm{padding-top:1rem;padding-bottom:1rem}.pvl{padding-top:2rem;padding-bottom:2rem}.pvx{padding-top:4rem;padding-bottom:4rem}.pvxl{padding-top:8rem;padding-bottom:8rem}.pvxxl{padding-top:16rem;padding-bottom:16rem}.phn{padding-left:0;padding-right:0}.pvxs{padding-left:.25rem;padding-right:.25rem}.phs{padding-left:.5rem;padding-right:.5rem}.phm{padding-left:1rem;padding-right:1rem}.phl{padding-left:2rem;padding-right:2rem}.phx{padding-left:4rem;padding-right:4rem}.phxl{padding-left:8rem;padding-right:8rem}.phxxl{padding-left:16rem;padding-right:16rem}.man{margin:0}.maxs{margin:.25rem}.mas{margin:.5rem}.mam{margin:1rem}.mal{margin:2rem}.max{margin:4rem}.maxl{margin:8rem}.maxxl{margin:16rem}.mln{margin-left:0}.mlxs{margin-left:.25rem}.mls{margin-left:.5rem}.mlm{margin-left:1rem}.mll{margin-left:2rem}.mlx{margin-left:4rem}.mlxl{margin-left:8rem}.mlxxl{margin-left:16rem}.mrn{margin-right:0}.mrxs{margin-right:.25rem}.mrs{margin-right:.5rem}.mrm{margin-right:1rem}.mrl{margin-right:2rem}.mrx{margin-right:4rem}.mrxl{margin-right:8rem}.mrxxl{margin-right:16rem}.mbn{margin-bottom:0}.mbxs{margin-bottom:.25rem}.mbs{margin-bottom:.5rem}.mbm{margin-bottom:1rem}.mbl{margin-bottom:2rem}.mbx{margin-bottom:4rem}.mbxl{margin-bottom:8rem}.mbxxl{margin-bottom:16rem}.mtn{margin-top:0}.mtxs{margin-top:.25rem}.mts{margin-top:.5rem}.mtm{margin-top:1rem}.mtl{margin-top:2rem}.mtx{margin-top:4rem}.mtxl{margin-top:8rem}.mtxxl{margin-top:16rem}.mvn{margin-top:0;margin-bottom:0rem}.mvxs{margin-top:.25rem;margin-bottom:.25rem}.mvs{margin-top:.5rem;margin-bottom:.5rem}.mvm{margin-top:1rem;margin-bottom:1rem}.mvl{margin-top:2rem;margin-bottom:2rem}.mvx{margin-top:4rem;margin-bottom:4rem}.mvxl{margin-top:8rem;margin-bottom:8rem}.mvxl{margin-top:16rem;margin-bottom:16rem}.mhn{margin-left:0;margin-right:0}.mhs{margin-left:.5rem;margin-right:.5rem}.mhm{margin-left:1rem;margin-right:1rem}.mhl{margin-left:2rem;margin-right:2rem}.mhx{margin-left:4rem;margin-right:4rem}.mhxl{margin-left:8rem;margin-right:8rem}.mhxxl{margin-left:16rem;margin-right:16rem}@media screen and (min-width: 48em){.pan-ns{padding:0}.paxs-ns{padding:.25rem}.pas-ns{padding:.5rem}.pam-ns{padding:1rem}.pal-ns{padding:2rem}.pax-ns{padding:4rem}.paxl-ns{padding:8rem}.paxxl-ns{padding:16rem}.pln-ns{padding-left:0}.plxs-ns{padding-left:.25rem}.pls-ns{padding-left:.5rem}.plm-ns{padding-left:1rem}.pll-ns{padding-left:2rem}.plx-ns{padding-left:4rem}.plxl-ns{padding-left:8rem}.plxxl-ns{padding-left:16rem}.prn-ns{padding-right:0}.prxs-ns{padding-right:.25rem}.prs-ns{padding-right:.5rem}.prm-ns{padding-right:1rem}.prl-ns{padding-right:2rem}.prx-ns{padding-right:4rem}.prxl-ns{padding-right:8rem}.prxxl-ns{padding-right:16rem}.pbn-ns{padding-bottom:0}.pbxs-ns{padding-bottom:.25rem}.pbs-ns{padding-bottom:.5rem}.pbm-ns{padding-bottom:1rem}.pbl-ns{padding-bottom:2rem}.pbx-ns{padding-bottom:4rem}.pbxl-ns{padding-bottom:8rem}.pbxxl-ns{padding-bottom:16rem}.ptn-ns{padding-top:0}.ptxs-ns{padding-top:.25rem}.pts-ns{padding-top:.5rem}.ptm-ns{padding-top:1rem}.ptl-ns{padding-top:2rem}.ptx-ns{padding-top:4rem}.ptxl-ns{padding-top:8rem}.ptxxl-ns{padding-top:16rem}.pvn-ns{padding-top:0;padding-bottom:0}.pvxs-ns{padding-top:.25rem;padding-bottom:.25rem}.pvs-ns{padding-top:.5rem;padding-bottom:.5rem}.pvm-ns{padding-top:1rem;padding-bottom:1rem}.pvl-ns{padding-top:2rem;padding-bottom:2rem}.pvx-ns{padding-top:4rem;padding-bottom:4rem}.pvxl-ns{padding-top:8rem;padding-bottom:8rem}.pvxxl-ns{padding-top:16rem;padding-bottom:16rem}.phn-ns{padding-left:0;padding-right:0}.pvxs-ns{padding-left:.25rem;padding-right:.25rem}.phs-ns{padding-left:.5rem;padding-right:.5rem}.phm-ns{padding-left:1rem;padding-right:1rem}.phl-ns{padding-left:2rem;padding-right:2rem}.phx-ns{padding-left:4rem;padding-right:4rem}.phxl-ns{padding-left:8rem;padding-right:8rem}.phxxl-ns{padding-left:16rem;padding-right:16rem}.man-ns{margin:0}.maxs-ns{margin:.25rem}.mas-ns{margin:.5rem}.mam-ns{margin:1rem}.mal-ns{margin:2rem}.max-ns{margin:4rem}.maxl-ns{margin:8rem}.maxxl-ns{margin:16rem}.mln-ns{margin-left:0}.mlxs-ns{margin-left:.25rem}.mls-ns{margin-left:.5rem}.mlm-ns{margin-left:1rem}.mll-ns{margin-left:2rem}.mlx-ns{margin-left:4rem}.mlxl-ns{margin-left:8rem}.mlxxl-ns{margin-left:16rem}.mrn-ns{margin-right:0}.mrxs-ns{margin-right:.25rem}.mrs-ns{margin-right:.5rem}.mrm-ns{margin-right:1rem}.mrl-ns{margin-right:2rem}.mrx-ns{margin-right:4rem}.mrxl-ns{margin-right:8rem}.mrxxl-ns{margin-right:16rem}.mbn-ns{margin-bottom:0}.mbxs-ns{margin-bottom:.25rem}.mbs-ns{margin-bottom:.5rem}.mbm-ns{margin-bottom:1rem}.mbl-ns{margin-bottom:2rem}.mbx-ns{margin-bottom:4rem}.mbxl-ns{margin-bottom:8rem}.mbxxl-ns{margin-bottom:16rem}.mtn-ns{margin-top:0}.mtxs-ns{margin-top:.25rem}.mts-ns{margin-top:.5rem}.mtm-ns{margin-top:1rem}.mtl-ns{margin-top:2rem}.mtx-ns{margin-top:4rem}.mtxl-ns{margin-top:8rem}.mtxxl-ns{margin-top:16rem}.mvn-ns{margin-top:0;margin-bottom:0rem}.mvxs-ns{margin-top:.25rem;margin-bottom:.25rem}.mvs-ns{margin-top:.5rem;margin-bottom:.5rem}.mvm-ns{margin-top:1rem;margin-bottom:1rem}.mvl-ns{margin-top:2rem;margin-bottom:2rem}.mvx-ns{margin-top:4rem;margin-bottom:4rem}.mvxl-ns{margin-top:8rem;margin-bottom:8rem}.mvxxl-ns{margin-top:16rem;margin-bottom:16rem}.mhn-ns{margin-left:0;margin-right:0}.mhs-ns{margin-left:.5rem;margin-right:.5rem}.mhm-ns{margin-left:1rem;margin-right:1rem}.mhl-ns{margin-left:2rem;margin-right:2rem}.mhx-ns{margin-left:4rem;margin-right:4rem}.mhxl-ns{margin-left:8rem;margin-right:8rem}.mhxxl-ns{margin-left:16rem;margin-right:16rem}}@media screen and (min-width: 48em) and (max-width: 64em){.pan-m{padding:0}.paxs-m{padding:.25rem}.pas-m{padding:.5rem}.pam-m{padding:1rem}.pal-m{padding:2rem}.pax-m{padding:4rem}.paxl-m{padding:8rem}.paxxl-m{padding:16rem}.pln-m{padding-left:0}.plxs-m{padding-left:.25rem}.pls-m{padding-left:.5rem}.plm-m{padding-left:1rem}.pll-m{padding-left:2rem}.plx-m{padding-left:4rem}.plxl-m{padding-left:8rem}.plxxl-m{padding-left:16rem}.prn-m{padding-right:0}.prxs-m{padding-right:.25rem}.prs-m{padding-right:.5rem}.prm-m{padding-right:1rem}.prl-m{padding-right:2rem}.prx-m{padding-right:4rem}.prxl-m{padding-right:8rem}.prxxl-m{padding-right:16rem}.pbn-m{padding-bottom:0}.pbxs-m{padding-bottom:.25rem}.pbs-m{padding-bottom:.5rem}.pbm-m{padding-bottom:1rem}.pbl-m{padding-bottom:2rem}.pbx-m{padding-bottom:4rem}.pbxl-m{padding-bottom:8rem}.pbxxl-m{padding-bottom:16rem}.ptn-m{padding-top:0}.ptxs-m{padding-top:.25rem}.pts-m{padding-top:.5rem}.ptm-m{padding-top:1rem}.ptl-m{padding-top:2rem}.ptx-m{padding-top:4rem}.ptxl-m{padding-top:8rem}.ptxxl-m{padding-top:16rem}.pvn-m{padding-top:0;padding-bottom:0}.pvxs-m{padding-top:.25rem;padding-bottom:.25rem}.pvs-m{padding-top:.5rem;padding-bottom:.5rem}.pvm-m{padding-top:1rem;padding-bottom:1rem}.pvl-m{padding-top:2rem;padding-bottom:2rem}.pvx-m{padding-top:4rem;padding-bottom:4rem}.pvxl-m{padding-top:8rem;padding-bottom:8rem}.pvxxl-m{padding-top:16rem;padding-bottom:16rem}.phn-m{padding-left:0;padding-right:0}.pvxs-m{padding-left:.25rem;padding-right:.25rem}.phs-m{padding-left:.5rem;padding-right:.5rem}.phm-m{padding-left:1rem;padding-right:1rem}.phl-m{padding-left:2rem;padding-right:2rem}.phx-m{padding-left:4rem;padding-right:4rem}.phxl-m{padding-left:8rem;padding-right:8rem}.phxxl-m{padding-left:16rem;padding-right:16rem}.man-m{margin:0}.maxs-m{margin:.25rem}.mas-m{margin:.5rem}.mam-m{margin:1rem}.mal-m{margin:2rem}.max-m{margin:4rem}.maxl-m{margin:8rem}.maxxl-m{margin:16rem}.mln-m{margin-left:0}.mlxs-m{margin-left:.25rem}.mls-m{margin-left:.5rem}.mlm-m{margin-left:1rem}.mll-m{margin-left:2rem}.mlx-m{margin-left:4rem}.mlxl-m{margin-left:8rem}.mlxxl-m{margin-left:16rem}.mrn-m{margin-right:0}.mrxs-m{margin-right:.25rem}.mrs-m{margin-right:.5rem}.mrm-m{margin-right:1rem}.mrl-m{margin-right:2rem}.mrx-m{margin-right:4rem}.mrxl-m{margin-right:8rem}.mrxxl-m{margin-right:16rem}.mbn-m{margin-bottom:0}.mbxs-m{margin-bottom:.25rem}.mbs-m{margin-bottom:.5rem}.mbm-m{margin-bottom:1rem}.mbl-m{margin-bottom:2rem}.mbx-m{margin-bottom:4rem}.mbxl-m{margin-bottom:8rem}.mbxxl-m{margin-bottom:16rem}.mtn-m{margin-top:0}.mtxs-m{margin-top:.25rem}.mts-m{margin-top:.5rem}.mtm-m{margin-top:1rem}.mtl-m{margin-top:2rem}.mtx-m{margin-top:4rem}.mtxl-m{margin-top:8rem}.mtxxl-m{margin-top:16rem}.mvn-m{margin-top:0;margin-bottom:0rem}.mvxs-m{margin-top:.25rem;margin-bottom:.25rem}.mvs-m{margin-top:.5rem;margin-bottom:.5rem}.mvm-m{margin-top:1rem;margin-bottom:1rem}.mvl-m{margin-top:2rem;margin-bottom:2rem}.mvx-m{margin-top:4rem;margin-bottom:4rem}.mvxl-m{margin-top:8rem;margin-bottom:8rem}.mvxxl-m{margin-top:16rem;margin-bottom:16rem}.mhn-m{margin-left:0;margin-right:0}.mhxs-m{margin-left:.25rem;margin-right:.25rem}.mhs-m{margin-left:.5rem;margin-right:.5rem}.mhm-m{margin-left:1rem;margin-right:1rem}.mhl-m{margin-left:2rem;margin-right:2rem}.mhx-m{margin-left:4rem;margin-right:4rem}.mhxl{margin-left:8rem;margin-right:8rem}.mhxxl{margin-left:16rem;margin-right:16rem}}@media screen and (min-width: 64em){.pan-l{padding:0}.paxs-l{padding:.25rem}.pas-l{padding:.5rem}.pam-l{padding:1rem}.pal-l{padding:2rem}.pax-l{padding:4rem}.paxl-l{padding:8rem}.paxxl-l{padding:16rem}.pln-l{padding-left:0}.plxs-l{padding-left:.25rem}.pls-l{padding-left:.5rem}.plm-l{padding-left:1rem}.pll-l{padding-left:2rem}.plx-l{padding-left:4rem}.plxl-l{padding-left:8rem}.plxxl-l{padding-left:16rem}.prn-l{padding-right:0}.prxs-l{padding-right:.25rem}.prs-l{padding-right:.5rem}.prm-l{padding-right:1rem}.prl-l{padding-right:2rem}.prx-l{padding-right:4rem}.prxl-l{padding-right:8rem}.prxxl-l{padding-right:16rem}.pbn-l{padding-bottom:0}.pbxs-l{padding-bottom:.25rem}.pbs-l{padding-bottom:.5rem}.pbm-l{padding-bottom:1rem}.pbl-l{padding-bottom:2rem}.pbx-l{padding-bottom:4rem}.pbxl-l{padding-bottom:8rem}.pbxxl-l{padding-bottom:16rem}.ptn-l{padding-top:0}.ptxs-l{padding-top:.25rem}.pts-l{padding-top:.5rem}.ptm-l{padding-top:1rem}.ptl-l{padding-top:2rem}.ptx-l{padding-top:4rem}.ptxl-l{padding-top:8rem}.ptxxl-l{padding-top:16rem}.pvn-l{padding-top:0;padding-bottom:0}.pvxs-l{padding-top:.25rem;padding-bottom:.25rem}.pvs-l{padding-top:.5rem;padding-bottom:.5rem}.pvm-l{padding-top:1rem;padding-bottom:1rem}.pvl-l{padding-top:2rem;padding-bottom:2rem}.pvx-l{padding-top:4rem;padding-bottom:4rem}.pvxl-l{padding-top:8rem;padding-bottom:8rem}.pvxxl-l{padding-top:16rem;padding-bottom:16rem}.phn-l{padding-left:0;padding-right:0}.pvxs-l{padding-left:.25rem;padding-right:.25rem}.phs-l{padding-left:.5rem;padding-right:.5rem}.phm-l{padding-left:1rem;padding-right:1rem}.phl-l{padding-left:2rem;padding-right:2rem}.phx-l{padding-left:4rem;padding-right:4rem}.phxl-l{padding-left:8rem;padding-right:8rem}.phxxl-l{padding-left:16rem;padding-right:16rem}.man-l{margin:0}.maxs-l{margin:.25rem}.mas-l{margin:.5rem}.mam-l{margin:1rem}.mal-l{margin:2rem}.max-l{margin:4rem}.maxl-l{margin:8rem}.maxxl-l{margin:16rem}.mln-l{margin-left:0}.mlxs-l{margin-left:.25rem}.mls-l{margin-left:.5rem}.mlm-l{margin-left:1rem}.mll-l{margin-left:2rem}.mlx-l{margin-left:4rem}.mlxl-l{margin-left:8rem}.mlxxl-l{margin-left:16rem}.mrn-l{margin-right:0}.mrxs-l{margin-right:.25rem}.mrs-l{margin-right:.5rem}.mrm-l{margin-right:1rem}.mrl-l{margin-right:2rem}.mrx-l{margin-right:4rem}.mrxl-l{margin-right:8rem}.mrxxl-l{margin-right:16rem}.mbn-l{margin-bottom:0}.mbxs-l{margin-bottom:.25rem}.mbs-l{margin-bottom:.5rem}.mbm-l{margin-bottom:1rem}.mbl-l{margin-bottom:2rem}.mbx-l{margin-bottom:4rem}.mbxl-l{margin-bottom:8rem}.mbxxl-l{margin-bottom:16rem}.mtn-l{margin-top:0}.mtxs-l{margin-top:.25rem}.mts-l{margin-top:.5rem}.mtm-l{margin-top:1rem}.mtl-l{margin-top:2rem}.mtx-l{margin-top:4rem}.mtxl-l{margin-top:8rem}.mtxxl-l{margin-top:16rem}.mvn-l{margin-top:0;margin-bottom:0rem}.mvxs-l{margin-top:.25rem;margin-bottom:.25rem}.mvs-l{margin-top:.5rem;margin-bottom:.5rem}.mvm-l{margin-top:1rem;margin-bottom:1rem}.mvl-l{margin-top:2rem;margin-bottom:2rem}.mvx-l{margin-top:4rem;margin-bottom:4rem}.mvxl-l{margin-top:8rem;margin-bottom:8rem}.mvxxl-l{margin-top:16rem;margin-bottom:16rem}.mhn-l{margin-left:0;margin-right:0}.mhxs-l{margin-left:.25rem;margin-right:.25rem}.mhs-l{margin-left:.5rem;margin-right:.5rem}.mhm-l{margin-left:1rem;margin-right:1rem}.mhl-l{margin-left:2rem;margin-right:2rem}.mhx-l{margin-left:4rem;margin-right:4rem}.mhxl-l{margin-left:8rem;margin-right:8rem}.mhxxl-l{margin-left:16rem;margin-right:16rem}}.sq1{width:1rem;height:1rem}.sq2{width:2rem;height:2rem}.sq3{width:4rem;height:4rem}.sq4{width:8rem;height:8rem}.sq5{width:16rem;height:16rem}.sq6{width:32rem;height:32rem}.sq7{width:48rem;height:48rem}.sq8{width:64rem;height:64rem}.sq9{width:96rem;height:96rem}@media screen and (min-width: 48em){.sq1-ns{width:1rem;height:1rem}.sq2-ns{width:2rem;height:2rem}.sq3-ns{width:4rem;height:4rem}.sq4-ns{width:8rem;height:8rem}.sq5-ns{width:16rem;height:16rem}.sq6-ns{width:32rem;height:32rem}.sq7-ns{width:48rem;height:48rem}.sq8-ns{width:64rem;height:64rem}.sq9-ns{width:96rem;height:96rem}}@media screen and (min-width: 48em) and (max-width: 64em){.sq1-m{width:1rem;height:1rem}.sq2-m{width:2rem;height:2rem}.sq3-m{width:4rem;height:4rem}.sq4-m{width:8rem;height:8rem}.sq5-m{width:16rem;height:16rem}.sq6-m{width:32rem;height:32rem}.sq7-m{width:48rem;height:48rem}.sq8-m{width:64rem;height:64rem}.sq9-m{width:96rem;height:96rem}}@media screen and (min-width: 64em){.sq1-l{width:1rem;height:1rem}.sq2-l{width:2rem;height:2rem}.sq3-l{width:4rem;height:4rem}.sq4-l{width:8rem;height:8rem}.sq5-l{width:16rem;height:16rem}.sq6-l{width:32rem;height:32rem}.sq7-l{width:48rem;height:48rem}.sq8-l{width:64rem;height:64rem}.sq9-l{width:96rem;height:96rem}}.under{text-decoration:underline}.over{text-decoration:overline}.strike{text-decoration:line-through}.blink{text-decoration:blink}.none{text-decoration:none}@media screen and (min-width: 48em){.under-ns{text-decoration:underline}.over-ns{text-decoration:overline}.strike-ns{text-decoration:line-through}.blink-ns{text-decoration:blink}.none-ns{text-decoration:none}}@media screen and (min-width: 48em) and (max-width: 64em){.under-m{text-decoration:underline}.over-m{text-decoration:overline}.strike-m{text-decoration:line-through}.blink-m{text-decoration:blink}.none-m{text-decoration:none}}@media screen and (min-width: 64em){.under-l{text-decoration:underline}.over-l{text-decoration:overline}.strike-l{text-decoration:line-through}.blink-l{text-decoration:blink}.none-l{text-decoration:none}}.tl{text-align:left}.tr{text-align:right}.tc{text-align:center}.tj{text-align:justify}.ts{text-align:start}.te{text-align:end}.tmp{text-align:match-parent}.tse{text-align:start end}.tp{text-align:"."}.tsp{text-align:start "."}.tpe{text-align:"." end}@media screen and (min-width: 48em){.tl-ns{text-align:left}.tr-ns{text-align:right}.tc-ns{text-align:center}.tj-ns{text-align:justify}.ts-ns{text-align:start}.te-ns{text-align:end}.tmp-ns{text-align:match-parent}.tse-ns{text-align:start end}.tp-ns{text-align:"."}.tsp-ns{text-align:start "."}.tpe-ns{text-align:"." end}}@media screen and (min-width: 48em) and (max-width: 64em){.tl-m{text-align:left}.tr-m{text-align:right}.tc-m{text-align:center}.tj-m{text-align:justify}.ts-m{text-align:start}.te-m{text-align:end}.tmp-m{text-align:match-parent}.tse-m{text-align:start end}.tp-m{text-align:"."}.tsp-m{text-align:start "."}.tpe-m{text-align:"." end}}@media screen and (min-width: 64em){.tl-l{text-align:left}.tr-l{text-align:right}.tc-l{text-align:center}.tj-l{text-align:justify}.ts-l{text-align:start}.te-l{text-align:end}.tmp-l{text-align:match-parent}.tse-l{text-align:start end}.tp-l{text-align:"."}.tsp-l{text-align:start "."}.tpe-l{text-align:"." end}}.t-clip{text-overflow:clip}.t-ellipsis{text-overflow:ellipsis}.t-dots{text-overflow:"…"}.t-clip-ellipsis{text-overflow:clip ellipsis}.t-double{text-overflow:"…" "…"}.t-i{text-overflow:inherit}@media screen and (min-width: 48em){.t-clip-ns{text-overflow:clip}.t-ellipsis-ns{text-overflow:ellipsis}.t-dots-ns{text-overflow:"…"}.t-clip-ellipsis-ns{text-overflow:clip ellipsis}.t-double-ns{text-overflow:"…" "…"}.t-i-ns{text-overflow:inherit}}@media screen and (min-width: 48em) and (max-width: 64em){.t-clip-m{text-overflow:clip}.t-ellipsis-m{text-overflow:ellipsis}.t-dots-m{text-overflow:"…"}.t-clip-ellipsis-m{text-overflow:clip ellipsis}.t-double-m{text-overflow:"…" "…"}.t-i-m{text-overflow:inherit}}@media screen and (min-width: 64em){.t-clip-l{text-overflow:clip}.t-ellipsis-l{text-overflow:ellipsis}.t-dots-l{text-overflow:"…"}.t-clip-ellipsis-l{text-overflow:clip ellipsis}.t-double-l{text-overflow:"…" "…"}.t-i-l{text-overflow:inherit}}.ttc{text-transform:capitalize}.ttu{text-transform:uppercase}.ttl{text-transform:lowercase}.ttn{text-transform:none}@media screen and (min-width: 48em){.ttc-ns{text-transform:capitalize}.ttu-ns{text-transform:uppercase}.ttl-ns{text-transform:lowercase}.ttn-ns{text-transform:none}}@media screen and (min-width: 48em) and (max-width: 64em){.ttc-m{text-transform:capitalize}.ttu-m{text-transform:uppercase}.ttl-m{text-transform:lowercase}.ttn-m{text-transform:none}}@media screen and (min-width: 64em){.ttc-l{text-transform:capitalize}.ttu-l{text-transform:uppercase}.ttl-l{text-transform:lowercase}.ttn-l{text-transform:none}}.f1{font-size:2rem}.f2{font-size:1.5rem}.f3{font-size:1.2rem}.f4{font-size:1.2rem}.f5{font-size:1rem}.f6,.small{font-size:.85rem}@media screen and (min-width: 48em){.mega-ns{font-size:3rem}.f1-ns{font-size:2rem}.f2-ns{font-size:1.5rem}.f3-ns{font-size:1.2rem}.f4-ns{font-size:1.2rem}.f5-ns{font-size:1rem}.f6-ns{font-size:.85rem}}@media screen and (min-width: 48em) and (max-width: 64em){.mega-m{font-size:3rem}.f1-m{font-size:2rem}.f2-m{font-size:1.5rem}.f3-m{font-size:1.2rem}.f4-m{font-size:1.2rem}.f5-m{font-size:1rem}.f6-m{font-size:.85rem}}@media screen and (min-width: 64em){.mega-l{font-size:4rem}.f1-l{font-size:3rem}.f2-l{font-size:2rem}.f3-l{font-size:1.5rem}.f4-l{font-size:1.2rem}.f5-l{font-size:1rem}.f6-l{font-size:1rem}}.flag{display:table;width:100%}.flag__image,.flag__body{display:table-cell;vertical-align:middle}.flag--top .flag__image,.flag--top .flag__body{vertical-align:top}.flag--bottom .flag__image,.flag--bottom .flag__body{vertical-align:bottom}.flag__image{padding-right:10px}.flag__image>img{display:block;max-width:none}.flag--rev .flag__image{padding-right:0;padding-left:10px}.flag__body{width:100%}.v-base{vertical-align:baseline}.v-sub{vertical-align:sub}.v-sup{vertical-align:super}.v-txt-top{vertical-align:text-top}.v-txt-btm{vertical-align:text-bottom}.v-mid{vertical-align:middle}.v-top{vertical-align:top}.v-btm{vertical-align:bottom}@media screen and (min-width: 48em){.v-base-ns{vertical-align:baseline}.v-sub-ns{vertical-align:sub}.v-sup-ns{vertical-align:super}.v-txt-top-ns{vertical-align:text-top}.v-txt-btm-ns{vertical-align:text-bottom}.v-mid-ns{vertical-align:middle}.v-top-ns{vertical-align:top}.v-btm-ns{vertical-align:bottom}}@media screen and (min-width: 48em) and (max-width: 64em){.v-base-m{vertical-align:baseline}.v-sub-m{vertical-align:sub}.v-sup-m{vertical-align:super}.v-txt-top-m{vertical-align:text-top}.v-txt-btm-m{vertical-align:text-bottom}.v-mid-m{vertical-align:middle}.v-top-m{vertical-align:top}.v-btm-m{vertical-align:bottom}}@media screen and (min-width: 64em){.v-base-l{vertical-align:baseline}.v-sub-l{vertical-align:sub}.v-sup-l{vertical-align:super}.v-txt-top-l{vertical-align:text-top}.v-txt-btm-l{vertical-align:text-bottom}.v-mid-l{vertical-align:middle}.v-top-l{vertical-align:top}.v-btm-l{vertical-align:bottom}}.vis{visibility:visible}.vis-hidden{visibility:hidden}.vis-collapse{visibility:collapse}.vis-bf-vis{backface-visibility:visible}.vis-bf-hid{backface-visibility:hidden}.clip{position:fixed !important;_position:absolute !important;clip:rect(1px 1px 1px 1px);clip:rect(1px, 1px, 1px, 1px)}@media screen and (min-width: 48em){.vis-ns{visibility:visible}.vis-hidden-ns{visibility:hidden}.vis-collapse-ns{visibility:collapse}.vis-bf-vis-ns{backface-visibility:visible}.vis-bf-hid-ns{backface-visibility:hidden}.clip-ns{position:fixed !important;_position:absolute !important;clip:rect(1px 1px 1px 1px);clip:rect(1px, 1px, 1px, 1px)}}@media screen and (min-width: 48em) and (max-width: 64em){.vis-m{visibility:visible}.vis-hidden-m{visibility:hidden}.vis-collapse-m{visibility:collapse}.vis-bf-vis-m{backface-visibility:visible}.vis-bf-hid-m{backface-visibility:hidden}.clip-m{position:fixed !important;_position:absolute !important;clip:rect(1px 1px 1px 1px);clip:rect(1px, 1px, 1px, 1px)}}@media screen and (min-width: 64em){.vis-l{visibility:visible}.vis-hidden-l{visibility:hidden}.vis-collapse-l{visibility:collapse}.vis-bf-vis-l{backface-visibility:visible}.vis-bf-hid-l{backface-visibility:hidden}.clip-l{position:fixed !important;_position:absolute !important;clip:rect(1px 1px 1px 1px);clip:rect(1px, 1px, 1px, 1px)}}.ws-norm{white-space:normal}.ws-nowrap{white-space:nowrap}.ws-pre{white-space:pre}.ws-prewrap{white-space:pre-wrap}.ws-preline{white-space:pre-line}@media screen and (min-width: 48em){.ws-norm-ns{white-space:normal}.ws-nowrap-ns{white-space:nowrap}.ws-pre-ns{white-space:pre}.ws-prewrap-ns{white-space:pre-wrap}.ws-preline-ns{white-space:pre-line}}@media screen and (min-width: 48em) and (max-width: 64em){.ws-norm-m{white-space:normal}.ws-nowrap-m{white-space:nowrap}.ws-pre-m{white-space:pre}.ws-prewrap-m{white-space:pre-wrap}.ws-preline-m{white-space:pre-line}}@media screen and (min-width: 64em){.ws-norm-l{white-space:normal}.ws-nowrap-l{white-space:nowrap}.ws-pre-l{white-space:pre}.ws-prewrap-l{white-space:pre-wrap}.ws-preline-l{white-space:pre-line}}.wi1{width:1rem}.wi2{width:2rem}.wi3{width:4rem}.wi4{width:8rem}.wi5{width:16rem}.wi6{width:32rem}.wi7{width:48rem}.wi8{width:64rem}.wi9{width:96rem}.wi10{width:128rem}.wi-bb{width:border-box}.wi-cb{width:content-box}.wi-mx{width:max-content}.wi-mn{width:min-content}.wi-av{width:available}.wi-fc{width:fit-content}.wi-at{width:auto}.wi-i{width:inherit}@media screen and (min-width: 48em){.wi1-ns{width:1rem}.wi2-ns{width:2rem}.wi3-ns{width:4rem}.wi4-ns{width:8rem}.wi5-ns{width:16rem}.wi6-ns{width:32rem}.wi7-ns{width:48rem}.wi8-ns{width:64rem}.wi9-ns{width:96rem}.wi10-ns{width:128rem}.wi-bb-ns{width:border-box}.wi-cb-ns{width:content-box}.wi-mx-ns{width:max-content}.wi-mn-ns{width:min-content}.wi-av-ns{width:available}.wi-fc-ns{width:fit-content}.wi-at-ns{width:auto}.wi-i-ns{width:inherit}}@media screen and (min-width: 48em) and (max-width: 64em){.wi1-m{width:1rem}.wi2-m{width:2rem}.wi3-m{width:4rem}.wi4-m{width:8rem}.wi5-m{width:16rem}.wi6-m{width:32rem}.wi7-m{width:48rem}.wi8-m{width:64rem}.wi9-m{width:96rem}.wi10-m{width:128rem}.wi-bb-m{width:border-box}.wi-cb-m{width:content-box}.wi-mx-m{width:max-content}.wi-mn-m{width:min-content}.wi-av-m{width:available}.wi-fc-m{width:fit-content}.wi-at-m{width:auto}.wi-i-m{width:inherit}}@media screen and (min-width: 64em){.wi1-l{width:1rem}.wi2-l{width:2rem}.wi3-l{width:4rem}.wi4-l{width:8rem}.wi5-l{width:16rem}.wi6-l{width:32rem}.wi7-l{width:48rem}.wi8-l{width:64rem}.wi9-l{width:96rem}.wi10-l{width:128rem}.wi-bb-l{width:border-box}.wi-cb-l{width:content-box}.wi-mx-l{width:max-content}.wi-mn-l{width:min-content}.wi-av-l{width:available}.wi-fc-l{width:fit-content}.wi-at-l{width:auto}.wi-i-l{width:inherit}}.wsn{word-spacing:normal}.ws1{word-spacing:0.3em}.ws2{word-spacing:-0.43em}@media screen and (min-width: 48em){.wsn-ns{word-spacing:normal}.ws1-ns{word-spacing:0.3em}.ws2-ns{word-spacing:-0.43em}}@media screen and (min-width: 48em) and (max-width: 64em){.wsn-m{word-spacing:normal}.ws1-m{word-spacing:0.3em}.ws2-m{word-spacing:-0.43em}}@media screen and (min-width: 64em){.wsn-l{word-spacing:normal}.ws1-l{word-spacing:0.3em}.ws2-l{word-spacing:-0.43em}} diff --git a/css/i.css.gz b/css/i.css.gz new file mode 100644 index 0000000000000000000000000000000000000000..3075ab64f0518f3b53050ff7574bfa29cfc778ad GIT binary patch literal 17275 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 literal 0 HcmV?d00001 diff --git a/sass/_background_repeat.scss b/sass/_background_repeat.scss new file mode 100644 index 0000000..b3dec51 --- /dev/null +++ b/sass/_background_repeat.scss @@ -0,0 +1,30 @@ +/* ========================================================================== + BACKGROUND REPEAT + ========================================================================== */ + + .bg-norep { background-repeat: no-repeat; } + .bg-x { background-repeat: repeat-x; } + .bg-y { background-repeat: repeat-y; } + .bg-rep { background-repeat: repeat; } + +@include break(not-small) { + .bg-norep-ns { background-repeat: no-repeat; } + .bg-x-ns { background-repeat: repeat-x; } + .bg-y-ns { background-repeat: repeat-y; } + .bg-rep-ns { background-repeat: repeat; } +} + +@include break(medium) { + .bg-norep-m { background-repeat: no-repeat; } + .bg-x-m { background-repeat: repeat-x; } + .bg-y-m { background-repeat: repeat-y; } + .bg-rep-m { background-repeat: repeat; } +} + +@include break(large) { + .bg-norep-l { background-repeat: no-repeat; } + .bg-x-l { background-repeat: repeat-x; } + .bg-y-l { background-repeat: repeat-y; } + .bg-rep-l { background-repeat: repeat; } +} + diff --git a/sass/_background_size.scss b/sass/_background_size.scss new file mode 100644 index 0000000..2d87b9e --- /dev/null +++ b/sass/_background_size.scss @@ -0,0 +1,42 @@ +/* ========================================================================== + BACKGROUND SIZE + ========================================================================== */ + + .bg-cv { background-size: cover; } + .bg-cn { background-size: contain; } + .bg-quarter { background-size: 25%; } + .bg-half { background-size: 50%; } + .bg-three-quarters { background-size: 75%; } + .bg-full { background-size: 100%; } + .bg-auto { background-size: auto; } + +@include break(not-small) { + .bg-cv-ns { background-size: cover; } + .bg-cn-ns { background-size: contain; } + .bg-quarter-ns { background-size: 25%; } + .bg-half-ns { background-size: 50%; } + .bg-three-quarters-ns { background-size: 75%; } + .bg-full-ns { background-size: 100%; } + .bg-auto-ns { background-size: auto; } +} + +@include break(medium) { + .bg-cv-m { background-size: cover; } + .bg-cn-m { background-size: contain; } + .bg-quarter-m { background-size: 25%; } + .bg-half-m { background-size: 50%; } + .bg-three-quarters-m { background-size: 75%; } + .bg-full-m { background-size: 100%; } + .bg-auto-m { background-size: auto; } +} + +@include break(large) { + .bg-cv-l { background-size: cover; } + .bg-cn-l { background-size: contain; } + .bg-quarter-l { background-size: 25%; } + .bg-half-l { background-size: 50%; } + .bg-three-quarters-l { background-size: 75%; } + .bg-full-l { background-size: 100%; } + .bg-auto-l { background-size: auto; } +} + diff --git a/sass/_border_colors.scss b/sass/_border_colors.scss new file mode 100644 index 0000000..247d7b2 --- /dev/null +++ b/sass/_border_colors.scss @@ -0,0 +1,145 @@ +/* ========================================================================== + BORDER COLORS + ========================================================================== */ + +.bor--blk { border-color: $near-black; } +.bor--dk-gry { border-color: $dark-gray; } +.bor--md-gry { border-color: $mid-gray; } +.bor--gray { border-color: $gray; } +.bor--silver { border-color: $silver; } +.bor--lt-slvr { border-color: $light-silver; } +.bor--lt-gry { border-color: $light-gray; } +.bor--near-wht { border-color: $near-white; } +.bor--wht { border-color: $white; } + +.bor--pink { border-color: $pink;} +.bor--lightpink { border-color: $lightpink; } +.bor--hotpink { border-color: $hotpink; } +.bor--deeppink { border-color: $deeppink; } +.bor--palevioletred { border-color: $palevioletred; } +.bor--mediumvioletred { border-color: $mediumvioletred; } +.bor--lightsalmon { border-color: $lightsalmon; } +.bor--salmon { border-color: $salmon; } +.bor--darksalmon { border-color: $darksalmon; } +.bor--lightcoral { border-color: $lightcoral; } +.bor--indianred { border-color: $indianred; } +.bor--crimson { border-color: $crimson; } +.bor--firebrick { border-color: $firebrick; } +.bor--darkred { border-color: $darkred; } +.bor--red { border-color: $red; } +.bor--orangered { border-color: $orangered; } +.bor--tomato { border-color: $tomato; } +.bor--coral { border-color: $coral; } +.bor--darkorange { border-color: $darkorange; } +.bor--orange { border-color: $orange; } +.bor--gold { border-color: $gold; } +.bor--yellow { border-color: $yellow; } +.bor--lightyellow { border-color: $lightyellow; } +.bor--lemonchiffon { border-color: $lemonchiffon; } +.bor--lightgoldenrod { border-color: $lightgoldenrodyellow; } +.bor--papayawhip { border-color: $papayawhip; } +.bor--moccasin { border-color: $moccasin; } +.bor--peachpuff { border-color: $peachpuff; } +.bor--palegoldenrod { border-color: $palegoldenrod; } +.bor--khaki { border-color: $khaki; } +.bor--darkkhaki { border-color: $darkkhaki; } +.bor--cornsilk { border-color: $cornsilk; } +.bor--blanchedalmond { border-color: $blanchedalmond; } +.bor--bisque { border-color: $bisque; } +.bor--navajowhite { border-color: $navajowhite; } +.bor--wheat { border-color: $wheat; } +.bor--burlywood { border-color: $burlywood; } +.bor--tan { border-color: $tan; } +.bor--rosybrown { border-color: $rosybrown; } +.bor--sandybrown { border-color: $sandybrown; } +.bor--goldenrod { border-color: $goldenrod; } +.bor--darkgoldenrod { border-color: $darkgoldenrod; } +.bor--peru { border-color: $peru; } +.bor--chocolate { border-color: $chocolate; } +.bor--saddlebrown { border-color: $saddlebrown; } +.bor--sienna { border-color: $sienna; } +.bor--brown { border-color: $brown; } +.bor--maroon { border-color: $maroon; } +.bor--darkolivegreen { border-color: $darkolivegreen; } +.bor--olive { border-color: $olive; } +.bor--olivedrab { border-color: $olivedrab; } +.bor--yellowgreen { border-color: $yellowgreen; } +.bor--limegreen { border-color: $limegreen; } +.bor--lime { border-color: $lime; } +.bor--lawngreen { border-color: $lawngreen; } +.bor--chartreuse { border-color: $chartreuse; } +.bor--greenyellow { border-color: $greenyellow; } +.bor--springgreen { border-color: $springgreen; } +.bor--medpringgreen { border-color: $mediumspringgreen; } +.bor--lightgreen { border-color: $lightgreen; } +.bor--palegreen { border-color: $palegreen; } +.bor--darkseagreen { border-color: $darkseagreen; } +.bor--mediumseagreen { border-color: $mediumseagreen; } +.bor--seagreen { border-color: $seagreen; } +.bor--forestgreen { border-color: $forestgreen; } +.bor--green { border-color: $green; } +.bor--darkgreen { border-color: $darkgreen; } +.bor--mediumaquamarine { border-color: $mediumaquamarine; } +.bor--aqua { border-color: $aqua; } +.bor--cyan { border-color: $cyan; } +.bor--lightcyan { border-color: $lightcyan; } +.bor--paleturquoise { border-color: $paleturquoise; } +.bor--aquamarine { border-color: $aquamarine; } +.bor--turquoise { border-color: $turquoise; } +.bor--mediumturquoise { border-color: $mediumturquoise; } +.bor--darkturquoise { border-color: $darkturquoise; } +.bor--lightseagreen { border-color: $lightseagreen; } +.bor--cadetblue { border-color: $cadetblue; } +.bor--darkcyan { border-color: $darkcyan; } +.bor--teal { border-color: $teal; } +.bor--lightsteelblue { border-color: $lightsteelblue; } +.bor--powderblue { border-color: $powderblue; } +.bor--lightblue { border-color: $lightblue; } +.bor--skyblue { border-color: $skyblue; } +.bor--lightskyblue { border-color: $lightskyblue; } +.bor--deepskyblue { border-color: $deepskyblue; } +.bor--dodgerblue { border-color: $dodgerblue; } +.bor--cornflowerblue { border-color: $cornflowerblue; } +.bor--steelblue { border-color: $steelblue; } +.bor--royalblue { border-color: $royalblue; } +.bor--blue { border-color: $blue; } +.bor--mediumblue { border-color: $mediumblue; } +.bor--darkblue { border-color: $darkblue; } +.bor--navy { border-color: $navy; } +.bor--midnightblue { border-color: $midnightblue; } +.bor--lavender { border-color: $lavender; } +.bor--thistle { border-color: $thistle; } +.bor--plum { border-color: $plum; } +.bor--violet { border-color: $violet; } +.bor--orchid { border-color: $orchid; } +.bor--fuchsia { border-color: $fuchsia; } +.bor--magenta { border-color: $magenta; } +.bor--mediumorchid { border-color: $mediumorchid; } +.bor--mediumpurple { border-color: $mediumpurple; } +.bor--blueviolet { border-color: $blueviolet; } +.bor--darkviolet { border-color: $darkviolet; } +.bor--darkorchid { border-color: $darkorchid; } +.bor--darkmagenta { border-color: $darkmagenta; } +.bor--purple { border-color: $purple; } +.bor--indigo { border-color: $indigo; } +.bor--darkslateblue { border-color: $darkslateblue; } +.bor--slateblue { border-color: $slateblue; } +.bor--mediumslateblue { border-color: $mediumslateblue; } +.bor--white { border-color: $white; } +.bor--snow { border-color: $snow; } +.bor--honeydew { border-color: $honeydew; } +.bor--mintcream { border-color: $mintcream; } +.bor--azure { border-color: $azure; } +.bor--aliceblue { border-color: $aliceblue; } +.bor--ghostwhite { border-color: $ghostwhite; } +.bor--whitesmoke { border-color: $whitesmoke; } +.bor--seashell { border-color: $seashell; } +.bor--beige { border-color: $beige; } +.bor--oldlace { border-color: $oldlace; } +.bor--floralwhite { border-color: $floralwhite; } +.bor--ivory { border-color: $ivory; } +.bor--antiquewhite { border-color: $antiquewhite; } +.bor--linen { border-color: $linen; } +.bor--lavenderblush { border-color: $lavenderblush; } +.bor--mistyrose { border-color: $mistyrose; } +.bor--gainsboro { border-color: $gainsboro; } diff --git a/sass/_border_radius.scss b/sass/_border_radius.scss new file mode 100644 index 0000000..24d78f8 --- /dev/null +++ b/sass/_border_radius.scss @@ -0,0 +1,46 @@ +/* ========================================================================== + BORDER RADIUS + ========================================================================== */ + + .brn { border-radius: 0; } + .br { border-radius: .125rem; } + .br2 { border-radius: .25rem; } + .br3 { border-radius: .5rem; } + .br4 { border-radius: 1rem; } + .br5 { border-radius: 2rem; } + .br-circ { border-radius: 9999px; } + .br-100 { border-radius: 100%; } + +@include break(not-small) { + .brn-ns { border-radius: 0; } + .br-ns { border-radius: .125rem; } + .br2-ns { border-radius: .25rem; } + .br3-ns { border-radius: .5rem; } + .br4-ns { border-radius: 1rem; } + .br5-ns { border-radius: 2rem; } + .br-circ-ns { border-radius: 9999px; } + .br-100-ns { border-radius: 100%; } +} + +@include break(medium) { + .brn-m { border-radius: 0; } + .br-m { border-radius: .125rem; } + .br2-m { border-radius: .25rem; } + .br3-m { border-radius: .5rem; } + .br4-m { border-radius: 1rem; } + .br5-m { border-radius: 2rem; } + .br-circ-m { border-radius: 9999px; } + .br-100-m { border-radius: 100%; } +} + +@include break(large) { + .brn-l { border-radius: 0; } + .br-l { border-radius: .125rem; } + .br2-l { border-radius: .25rem; } + .br3-l { border-radius: .5rem; } + .br4-l { border-radius: 1rem; } + .br5-l { border-radius: 2rem; } + .br-circ-l { border-radius: 9999px; } + .br-100-l { border-radius: 100%; } +} + diff --git a/sass/_border_style.scss b/sass/_border_style.scss new file mode 100644 index 0000000..4a3b35a --- /dev/null +++ b/sass/_border_style.scss @@ -0,0 +1,10 @@ +/* ========================================================================== + BORDER STYLES + ========================================================================== */ + +.ba-none { border-style: none; } +.ba-hidden { border-style: hidden; } +.ba-dotted { border-style: dotted; } +.ba-dashed { border-style: dashed; } +.ba-solid { border-style: solid; } + diff --git a/sass/_border_widths.scss b/sass/_border_widths.scss new file mode 100644 index 0000000..7c3945a --- /dev/null +++ b/sass/_border_widths.scss @@ -0,0 +1,26 @@ +/* ========================================================================== + BORDER WIDTHS + + LEGEND + + b = border + + a = all + t = top + b = bottom + l = left + r = right + + w = width + + 0-5 = step in sizing scale + + ========================================================================== */ + + .baw0 { border-width: 0; } + .baw1 { border-width: .125rem; } + .baw2 { border-width: .25rem; } + .baw3 { border-width: .5rem; } + .baw4 { border-width: .75rem; } + .baw5 { border-width: 1rem; } + diff --git a/sass/_borders.scss b/sass/_borders.scss new file mode 100644 index 0000000..d2edfe0 --- /dev/null +++ b/sass/_borders.scss @@ -0,0 +1,34 @@ +/* ========================================================================== + BORDER BASE + ========================================================================== */ + + .ba { border-style: solid; border-width: 1px; } + .bt { border-style: solid; border-left-width: 1px; } + .br { border-style: solid; border-right-width: 1px; } + .bb { border-style: solid; border-bottom-width: 1px; } + .bl { border-style: solid; border-left-width: 1px; } + +@include break(not-small) { + .ba-ns { border-style: solid; border-width: 1px; } + .bt-ns { border-style: solid; border-left-width: 1px; } + .br-ns { border-style: solid; border-right-width: 1px; } + .bb-ns { border-style: solid; border-bottom-width: 1px; } + .bl-ns { border-style: solid; border-left-width: 1px; } +} + +@include break(medium) { + .ba-m { border-style: solid; border-width: 1px; } + .bt-m { border-style: solid; border-left-width: 1px; } + .br-m { border-style: solid; border-right-width: 1px; } + .bb-m { border-style: solid; border-bottom-width: 1px; } + .bl-m { border-style: solid; border-left-width: 1px; } +} + +@include break(large) { + .ba-l { border-style: solid; border-width: 1px; } + .bt-l { border-style: solid; border-left-width: 1px; } + .br-l { border-style: solid; border-right-width: 1px; } + .bb-l { border-style: solid; border-bottom-width: 1px; } + .bl-l { border-style: solid; border-left-width: 1px; } +} + diff --git a/sass/_clears.scss b/sass/_clears.scss new file mode 100644 index 0000000..6af4266 --- /dev/null +++ b/sass/_clears.scss @@ -0,0 +1,17 @@ +/* ========================================================================== + CLEARS + ========================================================================== */ + +.cn { clear: none; } +.cl { clear: left; } +.cr { clear: right; } +.cb { clear: both; } + +/* Nicolas Gallaghers Clearfix solution + Ref: http://nicolasgallagher.com/micro-clearfix-hack/ */ + +.cf:before, +.cf:after { content: " "; display: table; } +.cf:after { clear: both; } +.cf { *zoom: 1; } + diff --git a/sass/_colors.scss b/sass/_colors.scss new file mode 100644 index 0000000..5d552da --- /dev/null +++ b/sass/_colors.scss @@ -0,0 +1,157 @@ +/* ========================================================================== + COLORS + ========================================================================== */ + +/* variables */ + +$near-black: #111; +$dark-gray:#333; +$mid-gray:#666; +$gray: #888; +$silver: #999; +$light-silver: #aaa; +$light-gray: #ccc; +$near-white: #eee; +$white: #fff; + +$pink: #ffc0cb; +$lightpink: #ffb6c1; +$hotpink: #ff69b4; +$deeppink: #ff1493; +$palevioletred: #db7093; +$mediumvioletred: #c71585; +$lightsalmon: #ffa07a; +$salmon: #fa8072; +$darksalmon: #e9967a; +$lightcoral: #f08080; +$indianred: #cd5c5c; +$crimson: #dc143c; +$firebrick: #b22222; +$darkred: #8b0000; +$red: #ff0000; +$orangered: #ff4500; +$tomato: #ff6347; +$coral: #ff7f50; +$darkorange: #ff8c00; +$orange: #ffa500; +$gold: #ffd700; +$yellow: #ffff00; +$lightyellow: #ffffe0; +$lemonchiffon: #fffacd; +$lightgoldenrodyellow: #fafad2; +$papayawhip: #ffefd5; +$moccasin: #ffe4b5; +$peachpuff: #ffdab9; +$palegoldenrod: #eee8aa; +$khaki: #f0e68c; +$darkkhaki: #bdb76b; +$cornsilk: #fff8dc; +$blanchedalmond: #ffebcd; +$bisque: #ffe4c4; +$navajowhite: #ffdead; +$wheat: #f5deb3; +$burlywood: #deb887; +$tan: #d2b48c; +$rosybrown: #bc8f8f; +$sandybrown: #f4a460; +$goldenrod: #daa520; +$darkgoldenrod: #b8860b; +$peru: #cd853f; +$chocolate: #d2691e; +$saddlebrown: #8b4513; +$sienna: #a0522d; +$brown: #a52a2a; +$maroon: #800000; +$darkolivegreen: #556b2f; +$olive: #808000; +$olivedrab: #6b8e23; +$yellowgreen: #9acd32; +$limegreen: #32cd32; +$lime: #00ff00; +$lawngreen: #7cfc00; +$chartreuse: #7fff00; +$greenyellow: #adff2f; +$springgreen: #00ff7f; +$mediumspringgreen: #00fa9a; +$lightgreen: #90ee90; +$palegreen: #98fb98; +$darkseagreen: #8fbc8f; +$mediumseagreen: #3cb371; +$seagreen: #2e8b57; +$forestgreen: #228b22; +$green: #008000; +$darkgreen: #006400; +$mediumaquamarine: #66cdaa; +$aqua: #00ffff; +$cyan: #00ffff; +$lightcyan: #e0ffff; +$paleturquoise: #afeeee; +$aquamarine: #7fffd4; +$turquoise: #40e0d0; +$mediumturquoise: #48d1cc; +$darkturquoise: #00ced1; +$lightseagreen: #20b2aa; +$cadetblue: #5f9ea0; +$darkcyan: #008b8b; +$teal: #008080; +$lightsteelblue: #b0c4de; +$powderblue: #b0e0e6; +$lightblue: #add8e6; +$skyblue: #87ceeb; +$lightskyblue: #87cefa; +$deepskyblue: #00bfff; +$dodgerblue: #1e90ff; +$cornflowerblue: #6495ed; +$steelblue: #4682b4; +$royalblue: #4169e1; +$blue: #0000ff; +$mediumblue: #0000cd; +$darkblue: #00008b; +$navy: #000080; +$midnightblue: #191970; +$lavender: #e6e6fa; +$thistle: #d8bfd8; +$plum: #dda0dd; +$violet: #ee82ee; +$orchid: #da70d6; +$fuchsia: #ff00ff; +$magenta: #ff00ff; +$mediumorchid: #ba55d3; +$mediumpurple: #9370db; +$blueviolet: #8a2be2; +$darkviolet: #9400d3; +$darkorchid: #9932cc; +$darkmagenta: #8b008b; +$purple: #800080; +$indigo: #4b0082; +$darkslateblue: #483d8b; +$slateblue: #6a5acd; +$mediumslateblue: #7b68ee; +$white: #ffffff; +$snow: #fffafa; +$honeydew: #f0fff0; +$mintcream: #f5fffa; +$azure: #f0ffff; +$aliceblue: #f0f8ff; +$ghostwhite: #f8f8ff; +$whitesmoke: #f5f5f5; +$seashell: #fff5ee; +$beige: #f5f5dc; +$oldlace: #fdf5e6; +$floralwhite: #fffaf0; +$ivory: #fffff0; +$antiquewhite: #faebd7; +$linen: #faf0e6; +$lavenderblush: #fff0f5; +$mistyrose: #ffe4e1; +$gainsboro: #dcdcdc; +$lightgray: #d3d3d3; +$silver: #c0c0c0; +$darkgray: #a9a9a9; +$gray: #808080; +$dimgray: #696969; +$lightslategray: #778899; +$slategray: #708090; +$darkslategray: #2f4f4f; +$black: #000000; + diff --git a/sass/_dimension_utilities.scss b/sass/_dimension_utilities.scss new file mode 100644 index 0000000..1479c3f --- /dev/null +++ b/sass/_dimension_utilities.scss @@ -0,0 +1,20 @@ +/* ========================================================================== + DIMENSION UTILITIES + ========================================================================== */ + +.auto-wrap { + display: block; + width: auto !important; +} + +.auto-fill { + display: block; + overflow: hidden; + width: auto !important; +} + +.dbf { + display: block; + width: 100%; +} + diff --git a/sass/_display.scss b/sass/_display.scss new file mode 100644 index 0000000..9ad006d --- /dev/null +++ b/sass/_display.scss @@ -0,0 +1,97 @@ +/* ========================================================================== + + DISPLAY + + - Mobile First + - Breakpoint: not-small + - Breakpoint: medium + - Breakpoint: large + + ========================================================================== */ + +.dn { display: none; } +.di { display: inline; } +.db { display: block; } +.dib { display: inline-block; } +.dli { display: list-item; } +.dit { display: inline-table; } +.dt { display: table; } +.dtc { display: table-cell; } +.dtcol { display: table-column; } +.dtcolg { display: table-column-group; } +.dtfg { display: table-footer-group; } +.dthg { display: table-header-group; } +.dtr { display: table-row; } +.dtrg { display: table-row-group; } +.df { display: flex; } +.dif { display: inline-flex; } +.dg { display: grid; } +.dig { display: inline-grid; } +.dri { display: run-in; } + +@include break(not-small) { + .dn-ns { display: none; } + .di-ns { display: inline; } + .db-ns { display: block; } + .dib-ns { display: inline-block; } + .dli-ns { display: list-item; } + .dit-ns { display: inline-table; } + .dt-ns { display: table; } + .dtc-ns { display: table-cell; } + .dtcol-ns { display: table-column; } + .dtcolg-ns { display: table-column-group; } + .dtfg-ns { display: table-footer-group; } + .dthg-ns { display: table-header-group; } + .dtr-ns { display: table-row; } + .dtrg-ns { display: table-row-group; } + .df-ns { display: flex; } + .dif-ns { display: inline-flex; } + .dg-ns { display: grid; } + .dig-ns { display: inline-grid; } + .dri-ns { display: run-in; } +} + +@include break(medium) { + .dn-m { display: none; } + .di-m { display: inline; } + .db-m { display: block; } + .dib-m { display: inline-block; } + .dli-m { display: list-item; } + .dit-m { display: inline-table; } + .dt-m { display: table; } + .dtc-m { display: table-cell; } + .dtcol-m { display: table-column; } + .dtcolg-m { display: table-column-group; } + .dtfg-m { display: table-footer-group; } + .dthg-m { display: table-header-group; } + .dtr-m { display: table-row; } + .dtrg-m { display: table-row-group; } + .df-m { display: flex; } + .dif-m { display: inline-flex; } + .dg-m { display: grid; } + .dig-m { display: inline-grid; } + .dri-m { display: run-in; } +} + +@include break(large) { + .dn-l { display: none; } + .di-l { display: inline; } + .db-l { display: block; } + .dib-l { display: inline-block; } + .dli-l { display: list-item; } + .dit-l { display: inline-table; } + .dt-l { display: table; } + .dtc-l { display: table-cell; } + .dtcol-l { display: table-column; } + .dtcolg-l { display: table-column-group; } + .dtfg-l { display: table-footer-group; } + .dthg-l { display: table-header-group; } + .dtr-l { display: table-row; } + .dtrg-l { display: table-row-group; } + .df-l { display: flex; } + .dif-l { display: inline-flex; } + .dg-l { display: grid; } + .dig-l { display: inline-grid; } + .dri-l { display: run-in; } +} + diff --git a/sass/_floats.scss b/sass/_floats.scss new file mode 100644 index 0000000..d6b696d --- /dev/null +++ b/sass/_floats.scss @@ -0,0 +1,27 @@ +/* ========================================================================== + FLOATS + ========================================================================== */ + + +.fl { float: left; display: inline; } +.fr { float: right; display: inline; } +.fn { float: none; } + +@include break(not-small) { + .fl-ns { float: left; display: inline; } + .fr-ns { float: right;display: inline; } + .fn-ns { float: none; } +} + +@include break(medium) { + .fl-m { float: left; display: inline; } + .fr-m { float: right; display: inline; } + .fn-m { float: none; } +} + +@include break(large) { + .fl-l { float: left; display: inline; } + .fr-l { float: right; display: inline; } + .fn-l { float: none; } +} + diff --git a/sass/_font_family.scss b/sass/_font_family.scss new file mode 100644 index 0000000..6f2e458 --- /dev/null +++ b/sass/_font_family.scss @@ -0,0 +1,32 @@ +/* Font Family Groups */ + +.serif { font-family: georgia, serif; } +.sans-serif { font-family: avenir, 'avenir next', helvetica, arial, sans-serif; } +.font-fantasy { font-family: fantasy; } +.font-cursive { font-family: cursive; } +.font-mono { font-family: monospace; } + +@include break(not-small) { + .serif-ns { font-family: georgia, serif; } + .sans-serif-ns { font-family: avenir, 'avenir next', helvetica, arial, sans-serif; } + .font-fantasy-ns { font-family: fantasy; } + .font-cursive-ns { font-family: cursive; } + .font-mono-ns { font-family: monospace; } +} + +@include break(medium) { + .serif-m { font-family: georgia, serif; } + .sans-serif-m { font-family: avenir, 'avenir next', helvetica, arial, sans-serif; } + .font-fantasy-m { font-family: fantasy; } + .font-cursive-m { font-family: cursive; } + .font-mono-m { font-family: monospace; } +} + +@include break(large) { + .serif-l { font-family: georgia, serif; } + .sans-serif-l { font-family: avenir, 'avenir next', helvetica, arial, sans-serif; } + .font-fantasy-l { font-family: fantasy; } + .font-cursive-l { font-family: cursive; } + .font-mono-l { font-family: monospace; } +} + diff --git a/sass/_font_style.scss b/sass/_font_style.scss new file mode 100644 index 0000000..30c99a0 --- /dev/null +++ b/sass/_font_style.scss @@ -0,0 +1,20 @@ +/* Font Style */ + +.fsn { font-style: normal; } +.i { font-style: italic; } + +@include break(not-small) { + .fsn-ns { font-style: normal; } + .i-ns { font-style: italic; } +} + +@include break(medium) { + .fsn-m { font-style: normal; } + .i-m { font-style: italic; } +} + +@include break(large) { + .fsn-l { font-style: normal; } + .i-l { font-style: italic; } +} + diff --git a/sass/_font_weight.scss b/sass/_font_weight.scss new file mode 100644 index 0000000..48a15b8 --- /dev/null +++ b/sass/_font_weight.scss @@ -0,0 +1,77 @@ +/* ========================================================================== + FONT WEIGHT + ========================================================================== */ + +.fwn { font-weight: normal; } +.b { font-weight: bold; } + +.fw-light { font-weight: lighter; } +.fw-bolder { font-weight: bolder; } + +.fw1 { font-weight: 100; } +.fw2 { font-weight: 200; } +.fw3 { font-weight: 300; } +.fw4 { font-weight: 400; } +.fw5 { font-weight: 500; } +.fw6 { font-weight: 600; } +.fw7 { font-weight: 700; } +.fw8 { font-weight: 800; } +.fw9 { font-weight: 900; } + +@include break(not-small) { +.fwn { font-weight: normal; } +.b { font-weight: bold; } + +.fw-light { font-weight: lighter; } +.fw-bolder { font-weight: bolder; } + +.fw1 { font-weight: 100; } +.fw2 { font-weight: 200; } +.fw3 { font-weight: 300; } +.fw4 { font-weight: 400; } +.fw5 { font-weight: 500; } +.fw6 { font-weight: 600; } +.fw7 { font-weight: 700; } +.fw8 { font-weight: 800; } +.fw9 { font-weight: 900; } + +} + +@include break(medium) { +.fwn { font-weight: normal; } +.b { font-weight: bold; } + +.fw-light { font-weight: lighter; } +.fw-bolder { font-weight: bolder; } + +.fw1 { font-weight: 100; } +.fw2 { font-weight: 200; } +.fw3 { font-weight: 300; } +.fw4 { font-weight: 400; } +.fw5 { font-weight: 500; } +.fw6 { font-weight: 600; } +.fw7 { font-weight: 700; } +.fw8 { font-weight: 800; } +.fw9 { font-weight: 900; } + +} + +@include break(large) { +.fwn { font-weight: normal; } +.b { font-weight: bold; } + +.fw-light { font-weight: lighter; } +.fw-bolder { font-weight: bolder; } + +.fw1 { font-weight: 100; } +.fw2 { font-weight: 200; } +.fw3 { font-weight: 300; } +.fw4 { font-weight: 400; } +.fw5 { font-weight: 500; } +.fw6 { font-weight: 600; } +.fw7 { font-weight: 700; } +.fw8 { font-weight: 800; } +.fw9 { font-weight: 900; } + +} + diff --git a/sass/_forms.scss b/sass/_forms.scss new file mode 100644 index 0000000..2ffed49 --- /dev/null +++ b/sass/_forms.scss @@ -0,0 +1,4 @@ +/* ========================================================================== + FORMS + ========================================================================== */ + diff --git a/sass/_grid.scss b/sass/_grid.scss new file mode 100644 index 0000000..844e7b4 --- /dev/null +++ b/sass/_grid.scss @@ -0,0 +1,11 @@ +@include break(not-small) { + +} + +@include break(medium) { + +} + +@include break(large) { + +} diff --git a/sass/_heights.scss b/sass/_heights.scss new file mode 100644 index 0000000..a737f1d --- /dev/null +++ b/sass/_heights.scss @@ -0,0 +1,79 @@ +/* ========================================================================== + HEIGHTS + ========================================================================== */ + +.hi-10, .tenth { height: 10%; } +.hi-25, .quarter { height: 25%; } +.hi-50, .half { height: 50%; } +.hi-75, .three-quarters { height: 75%; } +.hi-100, .full { height: 100%; } + +.ht1 { height: 1rem; } +.ht2 { height: 2rem; } +.ht3 { height: 4rem; } +.ht4 { height: 8rem; } +.ht5 { height: 16rem; } +.ht6 { height: 32rem; } +.ht7 { height: 48rem; } +.ht8 { height: 64rem; } +.ht9 { height: 96rem; } +.ht10 { height: 128rem; } + +.ht-auto { height: auto; } + +@include break(not-small) { + .hi-10-ns, .tenth-ns { height: 10%; } + .hi-25-ns, .quarter-ns { height: 25%; } + .hi-50-ns, .half-ns { height: 50%; } + .hi-75-ns, .three-quarters-ns { height: 75%; } + .hi-100-ns, .full-ns { height: 100%; } + .ht1-ns { height: 1rem; } + .ht2-ns { height: 2rem; } + .ht3-ns { height: 4rem; } + .ht4-ns { height: 8rem; } + .ht5-ns { height: 16rem; } + .ht6-ns { height: 32rem; } + .ht7-ns { height: 48rem; } + .ht8-ns { height: 64rem; } + .ht9-ns { height: 96rem; } + .ht10-ns { height: 128rem; } + .ht-auto-ns { height: auto; } +} + +@include break(medium) { + .hi-10-m, .tenth-m { height: 10%; } + .hi-25-m, .quarter-m { height: 25%; } + .hi-50-m, .half-m { height: 50%; } + .hi-75-m, .three-quarters-m { height: 75%; } + .hi-100-m, .full-m { height: 100%; } + .ht1-m { height: 1rem; } + .ht2-m { height: 2rem; } + .ht3-m { height: 4rem; } + .ht4-m { height: 8rem; } + .ht5-m { height: 16rem; } + .ht6-m { height: 32rem; } + .ht7-m { height: 48rem; } + .ht8-m { height: 64rem; } + .ht9-m { height: 96rem; } + .ht10-m { height: 128rem; } + .ht-auto-m { height: auto; } +} + +@include break(large) { + .hi-10-l, .tenth-l { height: 10%; } + .hi-25-l, .quarter-l { height: 25%; } + .hi-50-l, .half-l { height: 50%; } + .hi-75-l, .three-quarters-l { height: 75%; } + .hi-100-l, .full-l { height: 100%; } + .ht1-l { height: 1rem; } + .ht2-l { height: 2rem; } + .ht3-l { height: 4rem; } + .ht4-l { height: 8rem; } + .ht5-l { height: 16rem; } + .ht6-l { height: 32rem; } + .ht7-l { height: 48rem; } + .ht8-l { height: 64rem; } + .ht9-l { height: 96rem; } + .ht10-l { height: 128rem; } + .ht-auto-l { height: auto; } +} diff --git a/sass/_images.scss b/sass/_images.scss new file mode 100644 index 0000000..188681c --- /dev/null +++ b/sass/_images.scss @@ -0,0 +1,8 @@ +/* ========================================================================== + IMAGES + ========================================================================== */ + +/* Responsive images! */ + +img { max-width: 100%; } + diff --git a/sass/_letter_spacing.scss b/sass/_letter_spacing.scss new file mode 100644 index 0000000..53ca23c --- /dev/null +++ b/sass/_letter_spacing.scss @@ -0,0 +1,26 @@ +/* ========================================================================== + LETTER SPACING + ========================================================================== */ + +.tracked { letter-spacing: .1em; } +.tracked-tight { letter-spacing: -.1em; } +.mega-tracked { letter-spacing: .2em; } + +@include break(not-small) { + .tracked-ns { letter-spacing: .1em; } + .tracked-tight-ns { letter-spacing: -.1em; } + .mega-tracked-ns { letter-spacing: .2em; } +} + +@include break(medium) { + .tracked-m { letter-spacing: .1em; } + .tracked-tight-m { letter-spacing: -.1em; } + .mega-tracked-m { letter-spacing: .2em; } +} + +@include break(large) { + .tracked-l { letter-spacing: .1em; } + .tracked-tight-l { letter-spacing: -.1em; } + .mega-tracked-l { letter-spacing: .2em; } +} + diff --git a/sass/_line_height.scss b/sass/_line_height.scss new file mode 100644 index 0000000..67f16d7 --- /dev/null +++ b/sass/_line_height.scss @@ -0,0 +1,26 @@ +/* ========================================================================== + LINE HEIGHT + ========================================================================== */ + +.lh { line-height: 1; } +.lh-title { line-height: 1.3; } +.lh-copy { line-height: 1.6; } + +@include break(not-small) { + .lh-ns { line-height: 1; } + .lh-title-ns { line-height: 1.3; } + .lh-copy-ns { line-height: 1.6; } +} + +@include break(medium) { + .lh-m { line-height: 1; } + .lh-title-m { line-height: 1.3; } + .lh-copy-m { line-height: 1.6; } +} + +@include break(large) { + .lh-l { line-height: 1; } + .lh-title-l { line-height: 1.3; } + .lh-copy-l { line-height: 1.6; } +} + diff --git a/sass/_links.scss b/sass/_links.scss new file mode 100644 index 0000000..5efb70f --- /dev/null +++ b/sass/_links.scss @@ -0,0 +1,18 @@ +/* ========================================================================== + LINKS + ========================================================================== */ + +.link { text-decoration: none; } + +@include break(not-small) { + .link-ns { text-decoration: none; } +} + +@include break(medium) { + .link-m { text-decoration: none; } +} + +@include break(large) { + .link-l { text-decoration: none; } +} + diff --git a/sass/_lists.scss b/sass/_lists.scss new file mode 100644 index 0000000..c1d1847 --- /dev/null +++ b/sass/_lists.scss @@ -0,0 +1,92 @@ +/* ========================================================================== + LISTS + ========================================================================== */ + +/* List Style Types */ + +.disc { list-style-type: disc; } +.circle { list-style-type: circle; } +.square { list-style-type: square; } +.decimal { list-style-type: decimal; } +.leading-zero { list-style-type: decimal-leading-zero; } +.lower-roman { list-style-type: lower-roman; } +.upper-roman { list-style-type: upper-roman; } +.lower-greek { list-style-type: lower-greek; } +.lower-latin { list-style-type: lower-latin; } +.upper-latin { list-style-type: upper-latin; } +.lower-alpha { list-style-type: lower-alpha; } +.upper-alpha { list-style-type: upper-alpha; } +.list { list-style-type: none; } + + +/* Horizontal list: can be used on ol or ul */ + +.list { list-style: none; } + +.list--h { + list-style-type: none; + > li { display: inline-block; } +} + +@include break(not-small) { + .disc-ns { list-style-type: disc; } + .circle-ns { list-style-type: circle; } + .square-ns { list-style-type: square; } + .decimal-ns { list-style-type: decimal; } + .leading-zero-ns { list-style-type: decimal-leading-zero; } + .lower-roman-ns { list-style-type: lower-roman; } + .upper-roman-ns { list-style-type: upper-roman; } + .lower-greek-ns { list-style-type: lower-greek; } + .lower-latin-ns { list-style-type: lower-latin; } + .upper-latin-ns { list-style-type: upper-latin; } + .lower-alpha-ns { list-style-type: lower-alpha; } + .upper-alpha-ns { list-style-type: upper-alpha; } + .list-ns { list-style-type: none; } + .list--h-ns { + list-style-type: none; + > li { display: inline-block; } + } +} + +@include break(medium) { + .disc-m { list-style-type: disc; } + .circle-m { list-style-type: circle; } + .square-m { list-style-type: square; } + .decimal-m { list-style-type: decimal; } + .leading-zero-m { list-style-type: decimal-leading-zero; } + .lower-roman-m { list-style-type: lower-roman; } + .upper-roman-m { list-style-type: upper-roman; } + .lower-greek-m { list-style-type: lower-greek; } + .lower-latin-m { list-style-type: lower-latin; } + .upper-latin-m { list-style-type: upper-latin; } + .lower-alpha-m { list-style-type: lower-alpha; } + .upper-alpha-m { list-style-type: upper-alpha; } + .list-m { list-style-type: none; } + .list-m { list-style: none; } + .list--h-m { + list-style-type: none; + > li { display: inline-block; } + } +} + +@include break(large) { + .disc-l { list-style-type: disc; } + .circle-l { list-style-type: circle; } + .square-l { list-style-type: square; } + .decimal-l { list-style-type: decimal; } + .leading-zero-l { list-style-type: decimal-leading-zero; } + .lower-roman-l { list-style-type: lower-roman; } + .upper-roman-l { list-style-type: upper-roman; } + .lower-greek-l { list-style-type: lower-greek; } + .lower-latin-l { list-style-type: lower-latin; } + .upper-latin-l { list-style-type: upper-latin; } + .lower-alpha-l { list-style-type: lower-alpha; } + .upper-alpha-l { list-style-type: upper-alpha; } + .list-l { list-style-type: none; } + .list-l { list-style: none; } + .list--h-l { + list-style-type: none; + > li { display: inline-block; } + } +} + diff --git a/sass/_max_heights.scss b/sass/_max_heights.scss new file mode 100644 index 0000000..42f29fd --- /dev/null +++ b/sass/_max_heights.scss @@ -0,0 +1,79 @@ +/* ========================================================================== + MAX HEIGHT + ========================================================================== */ + +.mxhi1 { max-height: 1rem; } +.mxhi2 { max-height: 2rem; } +.mxhi3 { max-height: 4rem; } +.mxhi4 { max-height: 8rem; } +.mxhi5 { max-height: 16rem; } +.mxhi6 { max-height: 32rem; } +.mxhi7 { max-height: 48rem; } +.mxhi8 { max-height: 64rem; } +.mxhi9 { max-height: 96rem; } +.mxhi10 { max-height: 128rem; } + +.mxhi-none { max-height: none; } +.mxhi-max { max-height: max-content; } +.mxhi-min { max-height: min-content; } +.mxhi-fit { max-height: fit-content; } +.mxhi-fill { max-height: fill-available; } + +@include break(not-small) { + + .mxhi1-ns { max-height: 1rem; } + .mxhi2-ns { max-height: 2rem; } + .mxhi3-ns { max-height: 4rem; } + .mxhi4-ns { max-height: 8rem; } + .mxhi5-ns { max-height: 16rem; } + .mxhi6-ns { max-height: 32rem; } + .mxhi7-ns { max-height: 48rem; } + .mxhi8-ns { max-height: 64rem; } + .mxhi9-ns { max-height: 96rem; } + .mxhi10-ns { max-height: 128rem; } + + .mxhi-none-ns { max-height: none; } + .mxhi-max-ns { max-height: max-content; } + .mxhi-min-ns { max-height: min-content; } + .mxhi-fit-ns { max-height: fit-content; } + .mxhi-fill-ns { max-height: fill-available; } +} + +@include break(medium) { + .mxhi1-m { max-height: 1rem; } + .mxhi2-m { max-height: 2rem; } + .mxhi3-m { max-height: 4rem; } + .mxhi4-m { max-height: 8rem; } + .mxhi5-m { max-height: 16rem; } + .mxhi6-m { max-height: 32rem; } + .mxhi7-m { max-height: 48rem; } + .mxhi8-m { max-height: 64rem; } + .mxhi9-m { max-height: 96rem; } + .mxhi10-m { max-height: 128rem; } + + .mxhi-none-m { max-height: none; } + .mxhi-max-m { max-height: max-content; } + .mxhi-min-m { max-height: min-content; } + .mxhi-fit-m { max-height: fit-content; } + .mxhi-fill-m { max-height: fill-available; } +} + +@include break(large) { + .mxhi1-l { max-height: 1rem; } + .mxhi2-l { max-height: 2rem; } + .mxhi3-l { max-height: 4rem; } + .mxhi4-l { max-height: 8rem; } + .mxhi5-l { max-height: 16rem; } + .mxhi6-l { max-height: 32rem; } + .mxhi7-l { max-height: 48rem; } + .mxhi8-l { max-height: 64rem; } + .mxhi9-l { max-height: 96rem; } + .mxhi10-l { max-height: 128rem; } + + .mxhi-none-l { max-height: none; } + .mxhi-max-l { max-height: max-content; } + .mxhi-min-l { max-height: min-content; } + .mxhi-fit-l { max-height: fit-content; } + .mxhi-fill-l { max-height: fill-available; } +} + diff --git a/sass/_max_widths.scss b/sass/_max_widths.scss new file mode 100644 index 0000000..59da5e5 --- /dev/null +++ b/sass/_max_widths.scss @@ -0,0 +1,98 @@ +/* ========================================================================== + MAX WIDTHS + ========================================================================== */ + +.mx-wi-100 { max-width: 100%; } +.mx-wi-75 { max-width: 75%; } +.mx-wi-50 { max-width: 50%; } +.mx-wi-25 { max-width: 25%; } + +.mx-wi1 { max-width: 1rem; } +.mx-wi2 { max-width: 2rem; } +.mx-wi3 { max-width: 4rem; } +.mx-wi4 { max-width: 8rem; } +.mx-wi5 { max-width: 16rem; } +.mx-wi6 { max-width: 32rem; } +.mx-wi7 { max-width: 48rem; } +.mx-wi8 { max-width: 64rem; } +.mx-wi9 { max-width: 96rem; } +.mx-wi10 { max-width: 128rem; } + +.mx-wi-none { max-width: none; } +.mx-wi-max { max-width: max-content; } +.mx-wi-min { max-width: min-content; } +.mx-wi-fit { max-width: fit-content; } +.mx-wi-fill { max-width: fill-available; } + +@include break(not-small) { + .mx-wi-100-ns { max-width: 100%; } + .mx-wi-75-ns { max-width: 75%; } + .mx-wi-50-ns { max-width: 50%; } + .mx-wi-25-ns { max-width: 25%; } + + .mx-wi1-ns { max-width: 1rem; } + .mx-wi2-ns { max-width: 2rem; } + .mx-wi3-ns { max-width: 4rem; } + .mx-wi4-ns { max-width: 8rem; } + .mx-wi5-ns { max-width: 16rem; } + .mx-wi6-ns { max-width: 32rem; } + .mx-wi7-ns { max-width: 48rem; } + .mx-wi8-ns { max-width: 64rem; } + .mx-wi9-ns { max-width: 96rem; } + .mx-wi10-ns { max-width: 128rem; } + + .mx-wi-none-ns { max-width: none; } + .mx-wi-max-ns { max-width: max-content; } + .mx-wi-min-ns { max-width: min-content; } + .mx-wi-fit-ns { max-width: fit-content; } + .mx-wi-fill-ns { max-width: fill-available; } +} + +@include break(medium) { + .mx-wi-100-m { max-width: 100%; } + .mx-wi-75-m { max-width: 75%; } + .mx-wi-50-m { max-width: 50%; } + .mx-wi-25-m { max-width: 25%; } + + .mx-wi1-m { max-width: 1rem; } + .mx-wi2-m { max-width: 2rem; } + .mx-wi3-m { max-width: 4rem; } + .mx-wi4-m { max-width: 8rem; } + .mx-wi5-m { max-width: 16rem; } + .mx-wi6-m { max-width: 32rem; } + .mx-wi7-m { max-width: 48rem; } + .mx-wi8-m { max-width: 64rem; } + .mx-wi9-m { max-width: 96rem; } + .mx-wi10-m { max-width: 128rem; } + + .mx-wi-none-m { max-width: none; } + .mx-wi-max-m { max-width: max-content; } + .mx-wi-min-m { max-width: min-content; } + .mx-wi-fit-m { max-width: fit-content; } + .mx-wi-fill-m { max-width: fill-available; } +} + +@include break(large) { + .mx-wi-100-l { max-width: 100%; } + .mx-wi-75-l { max-width: 75%; } + .mx-wi-50-l { max-width: 50%; } + .mx-wi-25-l { max-width: 25%; } + + .mx-wi1-l { max-width: 1rem; } + .mx-wi2-l { max-width: 2rem; } + .mx-wi3-l { max-width: 4rem; } + .mx-wi4-l { max-width: 8rem; } + .mx-wi5-l { max-width: 16rem; } + .mx-wi6-l { max-width: 32rem; } + .mx-wi7-l { max-width: 48rem; } + .mx-wi8-l { max-width: 64rem; } + .mx-wi9-l { max-width: 96rem; } + .mx-wi10-l { max-width: 128rem; } + + .mx-wi-none-l { max-width: none; } + .mx-wi-max-l { max-width: max-content; } + .mx-wi-min-l { max-width: min-content; } + .mx-wi-fit-l { max-width: fit-content; } + .mx-wi-fill-l { max-width: fill-available; } +} + diff --git a/sass/_min_heights.scss b/sass/_min_heights.scss new file mode 100644 index 0000000..884f2f5 --- /dev/null +++ b/sass/_min_heights.scss @@ -0,0 +1,94 @@ +/* ========================================================================== + MIN HEIGHTS + ========================================================================== */ + +.mn-hi-100 { min-height: 100%; } +.mn-hi-75 { min-height: 75%; } +.mn-hi-50 { min-height: 50%; } +.mn-hi-25 { min-height: 25%; } + +.mn-hi1 { min-height: 1rem; } +.mn-hi2 { min-height: 2rem; } +.mn-hi3 { min-height: 4rem; } +.mn-hi4 { min-height: 8rem; } +.mn-hi5 { min-height: 16rem; } +.mn-hi6 { min-height: 32rem; } +.mn-hi7 { min-height: 48rem; } +.mn-hi8 { min-height: 64rem; } +.mn-hi9 { min-height: 96rem; } +.mn-hi10 { min-height: 128rem; } + +.mn-hi-max { min-height: max-content; } +.mn-hi-min { min-height: min-content; } +.mn-hi-fit { min-height: fit-content; } +.mn-hi-fill { min-height: fill-available; } + +@include break(not-small) { + .mn-hi-100-ns { min-height: 100%; } + .mn-hi-75-ns { min-height: 75%; } + .mn-hi-50-ns { min-height: 50%; } + .mn-hi-25-ns { min-height: 25%; } + + .mn-hi1-ns { min-height: 1rem; } + .mn-hi2-ns { min-height: 2rem; } + .mn-hi3-ns { min-height: 4rem; } + .mn-hi4-ns { min-height: 8rem; } + .mn-hi5-ns { min-height: 16rem; } + .mn-hi6-ns { min-height: 32rem; } + .mn-hi7-ns { min-height: 48rem; } + .mn-hi8-ns { min-height: 64rem; } + .mn-hi9-ns { min-height: 96rem; } + .mn-hi10-ns { min-height: 128rem; } + + .mn-hi-max-ns { min-height: max-content; } + .mn-hi-min-ns { min-height: min-content; } + .mn-hi-fit-ns { min-height: fit-content; } + .mn-hi-fill-ns { min-height: fill-available; } +} + +@include break(medium) { + .mn-hi-100-m { min-height: 100%; } + .mn-hi-75-m { min-height: 75%; } + .mn-hi-50-m { min-height: 50%; } + .mn-hi-25-m { min-height: 25%; } + + .mn-hi1-m { min-height: 1rem; } + .mn-hi2-m { min-height: 2rem; } + .mn-hi3-m { min-height: 4rem; } + .mn-hi4-m { min-height: 8rem; } + .mn-hi5-m { min-height: 16rem; } + .mn-hi6-m { min-height: 32rem; } + .mn-hi7-m { min-height: 48rem; } + .mn-hi8-m { min-height: 64rem; } + .mn-hi9-m { min-height: 96rem; } + .mn-hi10-m { min-height: 128rem; } + + .mn-hi-max-m { min-height: max-content; } + .mn-hi-min-m { min-height: min-content; } + .mn-hi-fit-m { min-height: fit-content; } + .mn-hi-fill-m { min-height: fill-available; } +} + +@include break(large) { + .mn-hi-100-l { min-height: 100%; } + .mn-hi-75-l { min-height: 75%; } + .mn-hi-50-l { min-height: 50%; } + .mn-hi-25-l { min-height: 25%; } + + .mn-hi1-l { min-height: 1rem; } + .mn-hi2-l { min-height: 2rem; } + .mn-hi3-l { min-height: 4rem; } + .mn-hi4-l { min-height: 8rem; } + .mn-hi5-l { min-height: 16rem; } + .mn-hi6-l { min-height: 32rem; } + .mn-hi7-l { min-height: 48rem; } + .mn-hi8-l { min-height: 64rem; } + .mn-hi9-l { min-height: 96rem; } + .mn-hi10-l { min-height: 128rem; } + + .mn-hi-max-l { min-height: max-content; } + .mn-hi-min-l { min-height: min-content; } + .mn-hi-fit-l { min-height: fit-content; } + .mn-hi-fill-l { min-height: fill-available; } +} + diff --git a/sass/_min_widths.scss b/sass/_min_widths.scss new file mode 100644 index 0000000..12f1b1b --- /dev/null +++ b/sass/_min_widths.scss @@ -0,0 +1,478 @@ +/* ========================================================================== + MIN WIDTHS + ========================================================================== */ + +.mn-wi-1 { min-width: 1%; } +.mn-wi-2 { min-width: 2%; } +.mn-wi-3 { min-width: 3%; } +.mn-wi-4 { min-width: 4%; } +.mn-wi-5 { min-width: 5%; } +.mn-wi-6 { min-width: 6%; } +.mn-wi-7 { min-width: 7%; } +.mn-wi-8 { min-width: 8%; } +.mn-wi-9 { min-width: 9%; } +.mn-wi-10 { min-width: 10%; } +.mn-wi-11 { min-width: 11%; } +.mn-wi-12 { min-width: 12%; } +.mn-wi-13 { min-width: 13%; } +.mn-wi-14 { min-width: 14%; } +.mn-wi-15 { min-width: 15%; } +.mn-wi-16 { min-width: 16%; } +.mn-wi-17 { min-width: 17%; } +.mn-wi-18 { min-width: 18%; } +.mn-wi-19 { min-width: 19%; } +.mn-wi-20 { min-width: 20%; } +.mn-wi-21 { min-width: 21%; } +.mn-wi-22 { min-width: 22%; } +.mn-wi-23 { min-width: 23%; } +.mn-wi-24 { min-width: 24%; } +.mn-wi-25 { min-width: 25%; } +.mn-wi-26 { min-width: 26%; } +.mn-wi-27 { min-width: 27%; } +.mn-wi-28 { min-width: 28%; } +.mn-wi-29 { min-width: 29%; } +.mn-wi-30 { min-width: 30%; } +.mn-wi-31 { min-width: 31%; } +.mn-wi-32 { min-width: 32%; } +.mn-wi-33 { min-width: 33%; } +.mn-wi-34 { min-width: 34%; } +.mn-wi-35 { min-width: 35%; } +.mn-wi-36 { min-width: 36%; } +.mn-wi-37 { min-width: 37%; } +.mn-wi-38 { min-width: 38%; } +.mn-wi-39 { min-width: 39%; } +.mn-wi-40 { min-width: 40%; } +.mn-wi-41 { min-width: 41%; } +.mn-wi-42 { min-width: 42%; } +.mn-wi-43 { min-width: 43%; } +.mn-wi-44 { min-width: 44%; } +.mn-wi-45 { min-width: 45%; } +.mn-wi-46 { min-width: 46%; } +.mn-wi-47 { min-width: 47%; } +.mn-wi-48 { min-width: 48%; } +.mn-wi-49 { min-width: 49%; } +.mn-wi-50 { min-width: 50%; } +.mn-wi-51 { min-width: 51%; } +.mn-wi-52 { min-width: 52%; } +.mn-wi-53 { min-width: 53%; } +.mn-wi-54 { min-width: 54%; } +.mn-wi-55 { min-width: 55%; } +.mn-wi-56 { min-width: 56%; } +.mn-wi-57 { min-width: 57%; } +.mn-wi-58 { min-width: 58%; } +.mn-wi-59 { min-width: 59%; } +.mn-wi-60 { min-width: 60%; } +.mn-wi-61 { min-width: 61%; } +.mn-wi-62 { min-width: 62%; } +.mn-wi-63 { min-width: 63%; } +.mn-wi-64 { min-width: 64%; } +.mn-wi-65 { min-width: 65%; } +.mn-wi-66 { min-width: 66%; } +.mn-wi-67 { min-width: 67%; } +.mn-wi-68 { min-width: 68%; } +.mn-wi-69 { min-width: 69%; } +.mn-wi-70 { min-width: 70%; } +.mn-wi-71 { min-width: 71%; } +.mn-wi-72 { min-width: 72%; } +.mn-wi-73 { min-width: 73%; } +.mn-wi-74 { min-width: 74%; } +.mn-wi-75 { min-width: 75%; } +.mn-wi-76 { min-width: 76%; } +.mn-wi-77 { min-width: 77%; } +.mn-wi-78 { min-width: 78%; } +.mn-wi-79 { min-width: 79%; } +.mn-wi-80 { min-width: 80%; } +.mn-wi-81 { min-width: 81%; } +.mn-wi-82 { min-width: 82%; } +.mn-wi-83 { min-width: 83%; } +.mn-wi-84 { min-width: 84%; } +.mn-wi-85 { min-width: 85%; } +.mn-wi-86 { min-width: 86%; } +.mn-wi-87 { min-width: 87%; } +.mn-wi-88 { min-width: 88%; } +.mn-wi-89 { min-width: 89%; } +.mn-wi-90 { min-width: 90%; } +.mn-wi-91 { min-width: 91%; } +.mn-wi-92 { min-width: 92%; } +.mn-wi-93 { min-width: 93%; } +.mn-wi-94 { min-width: 94%; } +.mn-wi-95 { min-width: 95%; } +.mn-wi-96 { min-width: 96%; } +.mn-wi-97 { min-width: 97%; } +.mn-wi-98 { min-width: 98%; } +.mn-wi-99 { min-width: 99%; } +.mn-wi-100 { min-width: 100%; } + +.mn-wi1 { min-width: 1rem; } +.mn-wi2 { min-width: 2rem; } +.mn-wi3 { min-width: 4rem; } +.mn-wi4 { min-width: 8rem; } +.mn-wi5 { min-width: 16rem; } +.mn-wi6 { min-width: 32rem; } +.mn-wi7 { min-width: 48rem; } +.mn-wi8 { min-width: 64rem; } +.mn-wi9 { min-width: 96rem; } +.mn-wi10 { min-width: 128rem; } + +.mn-wi-max { min-width: max-content; } +.mn-wi-min { min-width: min-content; } +.mn-wi-fit { min-width: fit-content; } +.mn-wi-fill { min-width: fill-available; } + +@include break(not-small) { + .mn-wi-1-ns { min-width: 1%; } + .mn-wi-2-ns { min-width: 2%; } + .mn-wi-3-ns { min-width: 3%; } + .mn-wi-4-ns { min-width: 4%; } + .mn-wi-5-ns { min-width: 5%; } + .mn-wi-6-ns { min-width: 6%; } + .mn-wi-7-ns { min-width: 7%; } + .mn-wi-8-ns { min-width: 8%; } + .mn-wi-9-ns { min-width: 9%; } + .mn-wi-10-ns { min-width: 10%; } + .mn-wi-11-ns { min-width: 11%; } + .mn-wi-12-ns { min-width: 12%; } + .mn-wi-13-ns { min-width: 13%; } + .mn-wi-14-ns { min-width: 14%; } + .mn-wi-15-ns { min-width: 15%; } + .mn-wi-16-ns { min-width: 16%; } + .mn-wi-17-ns { min-width: 17%; } + .mn-wi-18-ns { min-width: 18%; } + .mn-wi-19-ns { min-width: 19%; } + .mn-wi-20-ns { min-width: 20%; } + .mn-wi-21-ns { min-width: 21%; } + .mn-wi-22-ns { min-width: 22%; } + .mn-wi-23-ns { min-width: 23%; } + .mn-wi-24-ns { min-width: 24%; } + .mn-wi-25-ns { min-width: 25%; } + .mn-wi-26-ns { min-width: 26%; } + .mn-wi-27-ns { min-width: 27%; } + .mn-wi-28-ns { min-width: 28%; } + .mn-wi-29-ns { min-width: 29%; } + .mn-wi-30-ns { min-width: 30%; } + .mn-wi-31-ns { min-width: 31%; } + .mn-wi-32-ns { min-width: 32%; } + .mn-wi-33-ns { min-width: 33%; } + .mn-wi-34-ns { min-width: 34%; } + .mn-wi-35-ns { min-width: 35%; } + .mn-wi-36-ns { min-width: 36%; } + .mn-wi-37-ns { min-width: 37%; } + .mn-wi-38-ns { min-width: 38%; } + .mn-wi-39-ns { min-width: 39%; } + .mn-wi-40-ns { min-width: 40%; } + .mn-wi-41-ns { min-width: 41%; } + .mn-wi-42-ns { min-width: 42%; } + .mn-wi-43-ns { min-width: 43%; } + .mn-wi-44-ns { min-width: 44%; } + .mn-wi-45-ns { min-width: 45%; } + .mn-wi-46-ns { min-width: 46%; } + .mn-wi-47-ns { min-width: 47%; } + .mn-wi-48-ns { min-width: 48%; } + .mn-wi-49-ns { min-width: 49%; } + .mn-wi-50-ns { min-width: 50%; } + .mn-wi-51-ns { min-width: 51%; } + .mn-wi-52-ns { min-width: 52%; } + .mn-wi-53-ns { min-width: 53%; } + .mn-wi-54-ns { min-width: 54%; } + .mn-wi-55-ns { min-width: 55%; } + .mn-wi-56-ns { min-width: 56%; } + .mn-wi-57-ns { min-width: 57%; } + .mn-wi-58-ns { min-width: 58%; } + .mn-wi-59-ns { min-width: 59%; } + .mn-wi-60-ns { min-width: 60%; } + .mn-wi-61-ns { min-width: 61%; } + .mn-wi-62-ns { min-width: 62%; } + .mn-wi-63-ns { min-width: 63%; } + .mn-wi-64-ns { min-width: 64%; } + .mn-wi-65-ns { min-width: 65%; } + .mn-wi-66-ns { min-width: 66%; } + .mn-wi-67-ns { min-width: 67%; } + .mn-wi-68-ns { min-width: 68%; } + .mn-wi-69-ns { min-width: 69%; } + .mn-wi-70-ns { min-width: 70%; } + .mn-wi-71-ns { min-width: 71%; } + .mn-wi-72-ns { min-width: 72%; } + .mn-wi-73-ns { min-width: 73%; } + .mn-wi-74-ns { min-width: 74%; } + .mn-wi-75-ns { min-width: 75%; } + .mn-wi-76-ns { min-width: 76%; } + .mn-wi-77-ns { min-width: 77%; } + .mn-wi-78-ns { min-width: 78%; } + .mn-wi-79-ns { min-width: 79%; } + .mn-wi-80-ns { min-width: 80%; } + .mn-wi-81-ns { min-width: 81%; } + .mn-wi-82-ns { min-width: 82%; } + .mn-wi-83-ns { min-width: 83%; } + .mn-wi-84-ns { min-width: 84%; } + .mn-wi-85-ns { min-width: 85%; } + .mn-wi-86-ns { min-width: 86%; } + .mn-wi-87-ns { min-width: 87%; } + .mn-wi-88-ns { min-width: 88%; } + .mn-wi-89-ns { min-width: 89%; } + .mn-wi-90-ns { min-width: 90%; } + .mn-wi-91-ns { min-width: 91%; } + .mn-wi-92-ns { min-width: 92%; } + .mn-wi-93-ns { min-width: 93%; } + .mn-wi-94-ns { min-width: 94%; } + .mn-wi-95-ns { min-width: 95%; } + .mn-wi-96-ns { min-width: 96%; } + .mn-wi-97-ns { min-width: 97%; } + .mn-wi-98-ns { min-width: 98%; } + .mn-wi-99-ns { min-width: 99%; } + .mn-wi-100-ns { min-width: 100%; } + + .mn-wi1-ns { min-width: 1rem; } + .mn-wi2-ns { min-width: 2rem; } + .mn-wi3-ns { min-width: 4rem; } + .mn-wi4-ns { min-width: 8rem; } + .mn-wi5-ns { min-width: 16rem; } + .mn-wi6-ns { min-width: 32rem; } + .mn-wi7-ns { min-width: 48rem; } + .mn-wi8-ns { min-width: 64rem; } + .mn-wi9-ns { min-width: 96rem; } + .mn-wi10-ns { min-width: 128rem; } + + .mn-wi-max-ns { min-width: max-content; } + .mn-wi-min-ns { min-width: min-content; } + .mn-wi-fit-ns { min-width: fit-content; } + .mn-wi-fill-ns { min-width: fill-available; } +} + +@include break(medium) { + + .mn-wi-1-m { min-width: 1%; } + .mn-wi-2-m { min-width: 2%; } + .mn-wi-3-m { min-width: 3%; } + .mn-wi-4-m { min-width: 4%; } + .mn-wi-5-m { min-width: 5%; } + .mn-wi-6-m { min-width: 6%; } + .mn-wi-7-m { min-width: 7%; } + .mn-wi-8-m { min-width: 8%; } + .mn-wi-9-m { min-width: 9%; } + .mn-wi-10-m { min-width: 10%; } + .mn-wi-11-m { min-width: 11%; } + .mn-wi-12-m { min-width: 12%; } + .mn-wi-13-m { min-width: 13%; } + .mn-wi-14-m { min-width: 14%; } + .mn-wi-15-m { min-width: 15%; } + .mn-wi-16-m { min-width: 16%; } + .mn-wi-17-m { min-width: 17%; } + .mn-wi-18-m { min-width: 18%; } + .mn-wi-19-m { min-width: 19%; } + .mn-wi-20-m { min-width: 20%; } + .mn-wi-21-m { min-width: 21%; } + .mn-wi-22-m { min-width: 22%; } + .mn-wi-23-m { min-width: 23%; } + .mn-wi-24-m { min-width: 24%; } + .mn-wi-25-m { min-width: 25%; } + .mn-wi-26-m { min-width: 26%; } + .mn-wi-27-m { min-width: 27%; } + .mn-wi-28-m { min-width: 28%; } + .mn-wi-29-m { min-width: 29%; } + .mn-wi-30-m { min-width: 30%; } + .mn-wi-31-m { min-width: 31%; } + .mn-wi-32-m { min-width: 32%; } + .mn-wi-33-m { min-width: 33%; } + .mn-wi-34-m { min-width: 34%; } + .mn-wi-35-m { min-width: 35%; } + .mn-wi-36-m { min-width: 36%; } + .mn-wi-37-m { min-width: 37%; } + .mn-wi-38-m { min-width: 38%; } + .mn-wi-39-m { min-width: 39%; } + .mn-wi-40-m { min-width: 40%; } + .mn-wi-41-m { min-width: 41%; } + .mn-wi-42-m { min-width: 42%; } + .mn-wi-43-m { min-width: 43%; } + .mn-wi-44-m { min-width: 44%; } + .mn-wi-45-m { min-width: 45%; } + .mn-wi-46-m { min-width: 46%; } + .mn-wi-47-m { min-width: 47%; } + .mn-wi-48-m { min-width: 48%; } + .mn-wi-49-m { min-width: 49%; } + .mn-wi-50-m { min-width: 50%; } + .mn-wi-51-m { min-width: 51%; } + .mn-wi-52-m { min-width: 52%; } + .mn-wi-53-m { min-width: 53%; } + .mn-wi-54-m { min-width: 54%; } + .mn-wi-55-m { min-width: 55%; } + .mn-wi-56-m { min-width: 56%; } + .mn-wi-57-m { min-width: 57%; } + .mn-wi-58-m { min-width: 58%; } + .mn-wi-59-m { min-width: 59%; } + .mn-wi-60-m { min-width: 60%; } + .mn-wi-61-m { min-width: 61%; } + .mn-wi-62-m { min-width: 62%; } + .mn-wi-63-m { min-width: 63%; } + .mn-wi-64-m { min-width: 64%; } + .mn-wi-65-m { min-width: 65%; } + .mn-wi-66-m { min-width: 66%; } + .mn-wi-67-m { min-width: 67%; } + .mn-wi-68-m { min-width: 68%; } + .mn-wi-69-m { min-width: 69%; } + .mn-wi-70-m { min-width: 70%; } + .mn-wi-71-m { min-width: 71%; } + .mn-wi-72-m { min-width: 72%; } + .mn-wi-73-m { min-width: 73%; } + .mn-wi-74-m { min-width: 74%; } + .mn-wi-75-m { min-width: 75%; } + .mn-wi-76-m { min-width: 76%; } + .mn-wi-77-m { min-width: 77%; } + .mn-wi-78-m { min-width: 78%; } + .mn-wi-79-m { min-width: 79%; } + .mn-wi-80-m { min-width: 80%; } + .mn-wi-81-m { min-width: 81%; } + .mn-wi-82-m { min-width: 82%; } + .mn-wi-83-m { min-width: 83%; } + .mn-wi-84-m { min-width: 84%; } + .mn-wi-85-m { min-width: 85%; } + .mn-wi-86-m { min-width: 86%; } + .mn-wi-87-m { min-width: 87%; } + .mn-wi-88-m { min-width: 88%; } + .mn-wi-89-m { min-width: 89%; } + .mn-wi-90-m { min-width: 90%; } + .mn-wi-91-m { min-width: 91%; } + .mn-wi-92-m { min-width: 92%; } + .mn-wi-93-m { min-width: 93%; } + .mn-wi-94-m { min-width: 94%; } + .mn-wi-95-m { min-width: 95%; } + .mn-wi-96-m { min-width: 96%; } + .mn-wi-97-m { min-width: 97%; } + .mn-wi-98-m { min-width: 98%; } + .mn-wi-99-m { min-width: 99%; } + .mn-wi-100-m { min-width: 100%; } + .mn-wi1-m { min-width: 1rem; } + .mn-wi2-m { min-width: 2rem; } + .mn-wi3-m { min-width: 4rem; } + .mn-wi4-m { min-width: 8rem; } + .mn-wi5-m { min-width: 16rem; } + .mn-wi6-m { min-width: 32rem; } + .mn-wi7-m { min-width: 48rem; } + .mn-wi8-m { min-width: 64rem; } + .mn-wi9-m { min-width: 96rem; } + .mn-wi10-m { min-width: 128rem; } + + .mn-wi-max-m { min-width: max-content; } + .mn-wi-min-m { min-width: min-content; } + .mn-wi-fit-m { min-width: fit-content; } + .mn-wi-fill-m { min-width: fill-available; } +} + +@include break(large) { + .mn-wi-1-l { min-width: 1%; } + .mn-wi-2-l { min-width: 2%; } + .mn-wi-3-l { min-width: 3%; } + .mn-wi-4-l { min-width: 4%; } + .mn-wi-5-l { min-width: 5%; } + .mn-wi-6-l { min-width: 6%; } + .mn-wi-7-l { min-width: 7%; } + .mn-wi-8-l { min-width: 8%; } + .mn-wi-9-l { min-width: 9%; } + .mn-wi-10-l { min-width: 10%; } + .mn-wi-11-l { min-width: 11%; } + .mn-wi-12-l { min-width: 12%; } + .mn-wi-13-l { min-width: 13%; } + .mn-wi-14-l { min-width: 14%; } + .mn-wi-15-l { min-width: 15%; } + .mn-wi-16-l { min-width: 16%; } + .mn-wi-17-l { min-width: 17%; } + .mn-wi-18-l { min-width: 18%; } + .mn-wi-19-l { min-width: 19%; } + .mn-wi-20-l { min-width: 20%; } + .mn-wi-21-l { min-width: 21%; } + .mn-wi-22-l { min-width: 22%; } + .mn-wi-23-l { min-width: 23%; } + .mn-wi-24-l { min-width: 24%; } + .mn-wi-25-l { min-width: 25%; } + .mn-wi-26-l { min-width: 26%; } + .mn-wi-27-l { min-width: 27%; } + .mn-wi-28-l { min-width: 28%; } + .mn-wi-29-l { min-width: 29%; } + .mn-wi-30-l { min-width: 30%; } + .mn-wi-31-l { min-width: 31%; } + .mn-wi-32-l { min-width: 32%; } + .mn-wi-33-l { min-width: 33%; } + .mn-wi-34-l { min-width: 34%; } + .mn-wi-35-l { min-width: 35%; } + .mn-wi-36-l { min-width: 36%; } + .mn-wi-37-l { min-width: 37%; } + .mn-wi-38-l { min-width: 38%; } + .mn-wi-39-l { min-width: 39%; } + .mn-wi-40-l { min-width: 40%; } + .mn-wi-41-l { min-width: 41%; } + .mn-wi-42-l { min-width: 42%; } + .mn-wi-43-l { min-width: 43%; } + .mn-wi-44-l { min-width: 44%; } + .mn-wi-45-l { min-width: 45%; } + .mn-wi-46-l { min-width: 46%; } + .mn-wi-47-l { min-width: 47%; } + .mn-wi-48-l { min-width: 48%; } + .mn-wi-49-l { min-width: 49%; } + .mn-wi-50-l { min-width: 50%; } + .mn-wi-51-l { min-width: 51%; } + .mn-wi-52-l { min-width: 52%; } + .mn-wi-53-l { min-width: 53%; } + .mn-wi-54-l { min-width: 54%; } + .mn-wi-55-l { min-width: 55%; } + .mn-wi-56-l { min-width: 56%; } + .mn-wi-57-l { min-width: 57%; } + .mn-wi-58-l { min-width: 58%; } + .mn-wi-59-l { min-width: 59%; } + .mn-wi-60-l { min-width: 60%; } + .mn-wi-61-l { min-width: 61%; } + .mn-wi-62-l { min-width: 62%; } + .mn-wi-63-l { min-width: 63%; } + .mn-wi-64-l { min-width: 64%; } + .mn-wi-65-l { min-width: 65%; } + .mn-wi-66-l { min-width: 66%; } + .mn-wi-67-l { min-width: 67%; } + .mn-wi-68-l { min-width: 68%; } + .mn-wi-69-l { min-width: 69%; } + .mn-wi-70-l { min-width: 70%; } + .mn-wi-71-l { min-width: 71%; } + .mn-wi-72-l { min-width: 72%; } + .mn-wi-73-l { min-width: 73%; } + .mn-wi-74-l { min-width: 74%; } + .mn-wi-75-l { min-width: 75%; } + .mn-wi-76-l { min-width: 76%; } + .mn-wi-77-l { min-width: 77%; } + .mn-wi-78-l { min-width: 78%; } + .mn-wi-79-l { min-width: 79%; } + .mn-wi-80-l { min-width: 80%; } + .mn-wi-81-l { min-width: 81%; } + .mn-wi-82-l { min-width: 82%; } + .mn-wi-83-l { min-width: 83%; } + .mn-wi-84-l { min-width: 84%; } + .mn-wi-85-l { min-width: 85%; } + .mn-wi-86-l { min-width: 86%; } + .mn-wi-87-l { min-width: 87%; } + .mn-wi-88-l { min-width: 88%; } + .mn-wi-89-l { min-width: 89%; } + .mn-wi-90-l { min-width: 90%; } + .mn-wi-91-l { min-width: 91%; } + .mn-wi-92-l { min-width: 92%; } + .mn-wi-93-l { min-width: 93%; } + .mn-wi-94-l { min-width: 94%; } + .mn-wi-95-l { min-width: 95%; } + .mn-wi-96-l { min-width: 96%; } + .mn-wi-97-l { min-width: 97%; } + .mn-wi-98-l { min-width: 98%; } + .mn-wi-99-l { min-width: 99%; } + .mn-wi-100-l { min-width: 100%; } + + .mn-wi1-l { min-width: 1rem; } + .mn-wi2-l { min-width: 2rem; } + .mn-wi3-l { min-width: 4rem; } + .mn-wi4-l { min-width: 8rem; } + .mn-wi5-l { min-width: 16rem; } + .mn-wi6-l { min-width: 32rem; } + .mn-wi7-l { min-width: 48rem; } + .mn-wi8-l { min-width: 64rem; } + .mn-wi9-l { min-width: 96rem; } + .mn-wi10-l { min-width: 128rem; } + + .mn-wi-max-l { min-width: max-content; } + .mn-wi-min-l { min-width: min-content; } + .mn-wi-fit-l { min-width: fit-content; } + .mn-wi-fill-l { min-width: fill-available; } +} + diff --git a/sass/_normalize.scss b/sass/_normalize.scss new file mode 100644 index 0000000..5db1d59 --- /dev/null +++ b/sass/_normalize.scss @@ -0,0 +1,405 @@ +/*! normalize.css v2.1.2 | MIT License | git.io/normalize */ + +/* ========================================================================== + HTML5 display definitions + ========================================================================== */ + +/** + * Correct `block` display not defined in IE 8/9. + */ + +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +main, +nav, +section, +summary { + display: block; +} + +/** + * Correct `inline-block` display not defined in IE 8/9. + */ + +audio, +canvas, +video { + display: inline-block; +} + +/** + * Prevent modern browsers from displaying `audio` without controls. + * Remove excess height in iOS 5 devices. + */ + +audio:not([controls]) { + display: none; + height: 0; +} + +/** + * Address `[hidden]` styling not present in IE 8/9. + * Hide the `template` element in IE, Safari, and Firefox < 22. + */ + +[hidden], +template { + display: none; +} + +/* ========================================================================== + Base + ========================================================================== */ + +/** + * 1. Set default font family to sans-serif. + * 2. Prevent iOS text size adjust after orientation change, without disabling + * user zoom. + */ + +html { + font-family: sans-serif; /* 1 */ + -ms-text-size-adjust: 100%; /* 2 */ + -webkit-text-size-adjust: 100%; /* 2 */ +} + +/** + * Remove default margin. + */ + +body { + margin: 0; +} + +/* ========================================================================== + Links + ========================================================================== */ + +/** + * Remove the gray background color from active links in IE 10. + */ + +a { + background: transparent; +} + +/** + * Address `outline` inconsistency between Chrome and other browsers. + */ + +a:focus { + outline: thin dotted; +} + +/** + * Improve readability when focused and also mouse hovered in all browsers. + */ + +a:active, +a:hover { + outline: 0; +} + +/* ========================================================================== + Typography + ========================================================================== */ + +/** + * Address variable `h1` font-size and margin within `section` and `article` + * contexts in Firefox 4+, Safari 5, and Chrome. + */ + +h1 { + margin: 0.67em 0; +} + +/** + * Address styling not present in IE 8/9, Safari 5, and Chrome. + */ + +abbr[title] { + border-bottom: 1px dotted; +} + +/** + * Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome. + */ + +b, +strong { + font-weight: bold; +} + +/** + * Address styling not present in Safari 5 and Chrome. + */ + +dfn { + font-style: italic; +} + +/** + * Address differences between Firefox and other browsers. + */ + +hr { + -moz-box-sizing: content-box; + box-sizing: content-box; + height: 0; +} + +/** + * Address styling not present in IE 8/9. + */ + +mark { + background: #ff0; + color: #000; +} + +/** + * Correct font family set oddly in Safari 5 and Chrome. + */ + +code, +kbd, +pre, +samp { + font-family: monospace, serif; + font-size: 1em; +} + +/** + * Improve readability of pre-formatted text in all browsers. + */ + +pre { + white-space: pre-wrap; +} + +/** + * Set consistent quote types. + */ + +q { + quotes: "\201C" "\201D" "\2018" "\2019"; +} + +/** + * Address inconsistent and variable font size in all browsers. + */ + +small { + font-size: 80%; +} + +/** + * Prevent `sub` and `sup` affecting `line-height` in all browsers. + */ + +sub, +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} + +sup { + top: -0.5em; +} + +sub { + bottom: -0.25em; +} + +/* ========================================================================== + Embedded content + ========================================================================== */ + +/** + * Remove border when inside `a` element in IE 8/9. + */ + +img { + border: 0; +} + +/** + * Correct overflow displayed oddly in IE 9. + */ + +svg:not(:root) { + overflow: hidden; +} + +/* ========================================================================== + Figures + ========================================================================== */ + +/** + * Address margin not present in IE 8/9 and Safari 5. + */ + +figure { + margin: 0; +} + +/* ========================================================================== + Forms + ========================================================================== */ + +/** + * Define consistent border, margin, and padding. + */ + +fieldset { + border: 1px solid #c0c0c0; + margin: 0 2px; + padding: 0.35em 0.625em 0.75em; +} + +/** + * 1. Correct `color` not being inherited in IE 8/9. + * 2. Remove padding so people aren't caught out if they zero out fieldsets. + */ + +legend { + border: 0; /* 1 */ + padding: 0; /* 2 */ +} + +/** + * 1. Correct font family not being inherited in all browsers. + * 2. Correct font size not being inherited in all browsers. + * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome. + */ + +button, +input, +select, +textarea { + font-family: inherit; /* 1 */ + font-size: 100%; /* 2 */ + margin: 0; /* 3 */ +} + +/** + * Address Firefox 4+ setting `line-height` on `input` using `!important` in + * the UA stylesheet. + */ + +button, +input { + line-height: normal; +} + +/** + * Address inconsistent `text-transform` inheritance for `button` and `select`. + * All other form control elements do not inherit `text-transform` values. + * Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+. + * Correct `select` style inheritance in Firefox 4+ and Opera. + */ + +button, +select { + text-transform: none; +} + +/** + * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` + * and `video` controls. + * 2. Correct inability to style clickable `input` types in iOS. + * 3. Improve usability and consistency of cursor style between image-type + * `input` and others. + */ + +button, +html input[type="button"], /* 1 */ +input[type="reset"], +input[type="submit"] { + -webkit-appearance: button; /* 2 */ + cursor: pointer; /* 3 */ +} + +/** + * Re-set default cursor for disabled elements. + */ + +button[disabled], +html input[disabled] { + cursor: default; +} + +/** + * 1. Address box sizing set to `content-box` in IE 8/9. + * 2. Remove excess padding in IE 8/9. + */ + +input[type="checkbox"], +input[type="radio"] { + box-sizing: border-box; /* 1 */ + padding: 0; /* 2 */ +} + +/** + * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome. + * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome + * (include `-moz` to future-proof). + */ + +input[type="search"] { + -webkit-appearance: textfield; /* 1 */ + -moz-box-sizing: content-box; + -webkit-box-sizing: content-box; /* 2 */ + box-sizing: content-box; +} + +/** + * Remove inner padding and search cancel button in Safari 5 and Chrome + * on OS X. + */ + +input[type="search"]::-webkit-search-cancel-button, +input[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; +} + +/** + * Remove inner padding and border in Firefox 4+. + */ + +button::-moz-focus-inner, +input::-moz-focus-inner { + border: 0; + padding: 0; +} + +/** + * 1. Remove default vertical scrollbar in IE 8/9. + * 2. Improve readability and alignment in all browsers. + */ + +textarea { + overflow: auto; /* 1 */ + vertical-align: top; /* 2 */ +} + +/* ========================================================================== + Tables + ========================================================================== */ + +/** + * Remove most spacing between table cells. + */ + +table { + border-collapse: collapse; + border-spacing: 0; +} diff --git a/sass/_opacity.scss b/sass/_opacity.scss new file mode 100644 index 0000000..1687665 --- /dev/null +++ b/sass/_opacity.scss @@ -0,0 +1,56 @@ +/* ========================================================================== + OPACITY + ========================================================================== */ + +/* Opacity */ + +.o-10 { opacity: .1; } +.o-20 { opacity: .2; } +.o-30 { opacity: .3; } +.o-40 { opacity: .4; } +.o-50 { opacity: .5; } +.o-60 { opacity: .6; } +.o-70 { opacity: .7; } +.o-80 { opacity: .8; } +.o-90 { opacity: .9; } +.o-full { opacity: 1; } + +@include break(not-small) { + .o-10-ns { opacity: .1; } + .o-20-ns { opacity: .2; } + .o-30-ns { opacity: .3; } + .o-40-ns { opacity: .4; } + .o-50-ns { opacity: .5; } + .o-60-ns { opacity: .6; } + .o-70-ns { opacity: .7; } + .o-80-ns { opacity: .8; } + .o-90-ns { opacity: .9; } + .o-full-ns { opacity: 1; } +} + +@include break(medium) { + .o-10-m { opacity: .1; } + .o-20-m { opacity: .2; } + .o-30-m { opacity: .3; } + .o-40-m { opacity: .4; } + .o-50-m { opacity: .5; } + .o-60-m { opacity: .6; } + .o-70-m { opacity: .7; } + .o-80-m { opacity: .8; } + .o-90-m { opacity: .9; } + .o-full-m { opacity: 1; } +} + +@include break(large) { + .o-10-l { opacity: .1; } + .o-20-l { opacity: .2; } + .o-30-l { opacity: .3; } + .o-40-l { opacity: .4; } + .o-50-l { opacity: .5; } + .o-60-l { opacity: .6; } + .o-70-l { opacity: .7; } + .o-80-l { opacity: .8; } + .o-90-l { opacity: .9; } + .o-full-l { opacity: 1; } +} + diff --git a/sass/_overflow.scss b/sass/_overflow.scss new file mode 100644 index 0000000..6753793 --- /dev/null +++ b/sass/_overflow.scss @@ -0,0 +1,30 @@ + /* ========================================================================== + OVERFLOWS + ========================================================================== */ + +.of-vis { overflow: visible; } +.of-hid { overflow: hidden; } +.of-scr { overflow: scroll; } +.of-aut { overflow: auto; } + +@include break(not-small) { + .of-vis-ns { overflow: visible; } + .of-hid-ns { overflow: hidden; } + .of-scr-ns { overflow: scroll; } + .of-aut-ns { overflow: auto; } +} + +@include break(medium) { + .of-vis-m { overflow: visible; } + .of-hid-m { overflow: hidden; } + .of-scr-m { overflow: scroll; } + .of-aut-m { overflow: auto; } +} + +@include break(large) { + .of-vis-l { overflow: visible; } + .of-hid-l { overflow: hidden; } + .of-scr-l { overflow: scroll; } + .of-aut-l { overflow: auto; } +} + diff --git a/sass/_position.scss b/sass/_position.scss new file mode 100644 index 0000000..d3e2e8b --- /dev/null +++ b/sass/_position.scss @@ -0,0 +1,157 @@ + /* ========================================================================== + POSITIONING + ========================================================================== */ + +.pos-stat { position: static; } +.pos-rel { position: relative; } +.pos-abs { position: absolute; } +.pos-fix { position: fixed; } + +/* Values */ + +.top-0 { top: 0; } +.left-0 { left: 0; } +.right-0 { right: 0; } +.bottom-0 { bottom: 0; } + +.top-1 { top: 1rem; } +.left-1 { left: 1rem; } +.right-1 { right: 1rem; } +.bottom-1 { bottom: 1rem; } + +.top-2 { top: 2rem; } +.left-2 { left: 2rem; } +.right-2 { right: 2rem; } +.bottom-2 { bottom: 2rem; } + +.top-4 { top: 4rem; } +.left-4 { left: 4rem; } +.right-4 { right: 4rem; } +.bottom-4 { bottom: 4rem; } + +/* Top Percentage based scale */ + +.top-10 { top: 10%; } +.top-20 { top: 20%; } +.top-30 { top: 30%; } +.top-40 { top: 40%; } +.top-50 { top: 50%; } +.top-60 { top: 60%; } +.top-70 { top: 70%; } +.top-80 { top: 80%; } +.top-90 { top: 90%; } +.top-100 { top: 100%; } + +.top-auto { top: auto; } +.top-i { top: inherit; ;} + +.center { margin: 0 auto; } + +@include break(not-small) { + .pos-stat-ns { position: static; } + .pos-rel-ns { position: relative; } + .pos-abs-ns { position: absolute; } + .pos-fix-ns { position: fixed; } + .top-0-ns { top: 0; } + .left-0-ns { left: 0; } + .right-0-ns { right: 0; } + .bottom-0-ns { bottom: 0; } + .top-1-ns { top: 1rem; } + .left-1-ns { left: 1rem; } + .right-1-ns { right: 1rem; } + .bottom-1-ns { bottom: 1rem; } + .top-2-ns { top: 2rem; } + .left-2-ns { left: 2rem; } + .right-2-ns { right: 2rem; } + .bottom-2-ns { bottom: 2rem; } + .top-4-ns { top: 4rem; } + .left-4-ns { left: 4rem; } + .right-4-ns { right: 4rem; } + .bottom-4-ns { bottom: 4rem; } + .top-10-ns { top: 10%; } + .top-20-ns { top: 20%; } + .top-30-ns { top: 30%; } + .top-40-ns { top: 40%; } + .top-50-ns { top: 50%; } + .top-60-ns { top: 60%; } + .top-70-ns { top: 70%; } + .top-80-ns { top: 80%; } + .top-90-ns { top: 90%; } + .top-100-ns { top: 100%; } + .top-auto-ns { top: auto; } + .top-i-ns { top: inherit; ;} + .center-ns { margin: 0 auto; } +} + +@include break(medium) { + .pos-stat-m { position: static; } + .pos-rel-m { position: relative; } + .pos-abs-m { position: absolute; } + .pos-fix-m { position: fixed; } + .top-0-m { top: 0; } + .left-0-m { left: 0; } + .right-0-m { right: 0; } + .bottom-0-m { bottom: 0; } + .top-1-m { top: 1rem; } + .left-1-m { left: 1rem; } + .right-1-m { right: 1rem; } + .bottom-1-m { bottom: 1rem; } + .top-2-m { top: 2rem; } + .left-2-m { left: 2rem; } + .right-2-m { right: 2rem; } + .bottom-2-m { bottom: 2rem; } + .top-4-m { top: 4rem; } + .left-4-m { left: 4rem; } + .right-4-m { right: 4rem; } + .bottom-4-m { bottom: 4rem; } + .top-10-m { top: 10%; } + .top-20-m { top: 20%; } + .top-30-m { top: 30%; } + .top-40-m { top: 40%; } + .top-50-m { top: 50%; } + .top-60-m { top: 60%; } + .top-70-m { top: 70%; } + .top-80-m { top: 80%; } + .top-90-m { top: 90%; } + .top-100-m { top: 100%; } + .top-auto-m { top: auto; } + .top-i-m { top: inherit; ;} + .center-m { margin: 0 auto; } +} + +@include break(large) { + .pos-stat-l { position: static; } + .pos-rel-l { position: relative; } + .pos-abs-l { position: absolute; } + .pos-fix-l { position: fixed; } + .top-0-l { top: 0; } + .left-0-l { left: 0; } + .right-0-l { right: 0; } + .bottom-0-l { bottom: 0; } + .top-1-l { top: 1rem; } + .left-1-l { left: 1rem; } + .right-1-l { right: 1rem; } + .bottom-1-l { bottom: 1rem; } + .top-2-l { top: 2rem; } + .left-2-l { left: 2rem; } + .right-2-l { right: 2rem; } + .bottom-2-l { bottom: 2rem; } + .top-4-l { top: 4rem; } + .left-4-l { left: 4rem; } + .right-4-l { right: 4rem; } + .bottom-4-l { bottom: 4rem; } + .top-10-l { top: 10%; } + .top-20-l { top: 20%; } + .top-30-l { top: 30%; } + .top-40-l { top: 40%; } + .top-50-l { top: 50%; } + .top-60-l { top: 60%; } + .top-70-l { top: 70%; } + .top-80-l { top: 80%; } + .top-90-l { top: 90%; } + .top-100-l { top: 100%; } + .top-auto-l { top: auto; } + .top-i-l { top: inherit; ;} + .center-l { margin: 0 auto; } +} + diff --git a/sass/_queries.scss b/sass/_queries.scss new file mode 100644 index 0000000..5ee8568 --- /dev/null +++ b/sass/_queries.scss @@ -0,0 +1,31 @@ +/* ========================================================================== + QUERIES + ========================================================================== */ + +/* + * Mixing for mobile first queries. + * Two breakpoints. + * Use like @include break(medium) { + * ***Styles*** + * } + * + */ + +@mixin break($point) { + @if $point == not-small { + @media screen and (min-width: 48em) { + @content; + } + } + @else if $point == medium { + @media screen and (min-width: 48em) and (max-width: 64em) { + @content; + } + } + @else if $point == large { + @media screen and (min-width: 64em) { + @content; + } + } +} + diff --git a/sass/_skins.scss b/sass/_skins.scss new file mode 100644 index 0000000..8a60d6f --- /dev/null +++ b/sass/_skins.scss @@ -0,0 +1,305 @@ +/* ========================================================================== + SKINS + ========================================================================== */ + + +/* Grays */ + +.blk { color: $near-black; } +.dk-gry { color: $dark-gray; } +.md-gry { color: $mid-gray; } +.gray { color: $gray; } +.silver { color: $silver; } +.lt-slvr { color: $light-silver; } +.lt-gry { color: $light-gray; } +.near-wht { color: $near-white; } +.wht { color: $white; } + + +/* Text colors */ + +.pink {color: $pink;} +.lightpink { color: $lightpink; } +.hotpink { color: $hotpink; } +.deeppink { color: $deeppink; } +.palevioletred { color: $palevioletred; } +.mediumvioletred { color: $mediumvioletred; } +.lightsalmon { color: $lightsalmon; } +.salmon { color: $salmon; } +.darksalmon { color: $darksalmon; } +.lightcoral { color: $lightcoral; } +.indianred { color: $indianred; } +.crimson { color: $crimson; } +.firebrick { color: $firebrick; } +.darkred { color: $darkred; } +.red { color: $red; } +.orangered { color: $orangered; } +.tomato { color: $tomato; } +.coral { color: $coral; } +.darkorange { color: $darkorange; } +.orange { color: $orange; } +.gold { color: $gold; } +.yellow { color: $yellow; } +.lightyellow { color: $lightyellow; } +.lemonchiffon { color: $lemonchiffon; } +.lightgoldenrodyellow { color: $lightgoldenrodyellow; } +.papayawhip { color: $papayawhip; } +.moccasin { color: $moccasin; } +.peachpuff { color: $peachpuff; } +.palegoldenrod { color: $palegoldenrod; } +.khaki { color: $khaki; } +.darkkhaki { color: $darkkhaki; } +.cornsilk { color: $cornsilk; } +.blanchedalmond { color: $blanchedalmond; } +.bisque { color: $bisque; } +.navajowhite { color: $navajowhite; } +.wheat { color: $wheat; } +.burlywood { color: $burlywood; } +.tan { color: $tan; } +.rosybrown { color: $rosybrown; } +.sandybrown { color: $sandybrown; } +.goldenrod { color: $goldenrod; } +.darkgoldenrod { color: $darkgoldenrod; } +.peru { color: $peru; } +.chocolate { color: $chocolate; } +.saddlebrown { color: $saddlebrown; } +.sienna { color: $sienna; } +.brown { color: $brown; } +.maroon { color: $maroon; } +.darkolivegreen { color: $darkolivegreen; } +.olive { color: $olive; } +.olivedrab { color: $olivedrab; } +.yellowgreen { color: $yellowgreen; } +.limegreen { color: $limegreen; } +.lime { color: $lime; } +.lawngreen { color: $lawngreen; } +.chartreuse { color: $chartreuse; } +.greenyellow { color: $greenyellow; } +.springgreen { color: $springgreen; } +.mediumspringgreen { color: $mediumspringgreen; } +.lightgreen { color: $lightgreen; } +.palegreen { color: $palegreen; } +.darkseagreen { color: $darkseagreen; } +.mediumseagreen { color: $mediumseagreen; } +.seagreen { color: $seagreen; } +.forestgreen { color: $forestgreen; } +.green { color: $green; } +.darkgreen { color: $darkgreen; } +.mediumaquamarine { color: $mediumaquamarine; } +.aqua { color: $aqua; } +.cyan { color: $cyan; } +.lightcyan { color: $lightcyan; } +.paleturquoise { color: $paleturquoise; } +.aquamarine { color: $aquamarine; } +.turquoise { color: $turquoise; } +.mediumturquoise { color: $mediumturquoise; } +.darkturquoise { color: $darkturquoise; } +.lightseagreen { color: $lightseagreen; } +.cadetblue { color: $cadetblue; } +.darkcyan { color: $darkcyan; } +.teal { color: $teal; } +.lightsteelblue { color: $lightsteelblue; } +.powderblue { color: $powderblue; } +.lightblue { color: $lightblue; } +.skyblue { color: $skyblue; } +.lightskyblue { color: $lightskyblue; } +.deepskyblue { color: $deepskyblue; } +.dodgerblue { color: $dodgerblue; } +.cornflowerblue { color: $cornflowerblue; } +.steelblue { color: $steelblue; } +.royalblue { color: $royalblue; } +.blue { color: $blue; } +.mediumblue { color: $mediumblue; } +.darkblue { color: $darkblue; } +.navy { color: $navy; } +.midnightblue { color: $midnightblue; } +.lavender { color: $lavender; } +.thistle { color: $thistle; } +.plum { color: $plum; } +.violet { color: $violet; } +.orchid { color: $orchid; } +.fuchsia { color: $fuchsia; } +.magenta { color: $magenta; } +.mediumorchid { color: $mediumorchid; } +.mediumpurple { color: $mediumpurple; } +.blueviolet { color: $blueviolet; } +.darkviolet { color: $darkviolet; } +.darkorchid { color: $darkorchid; } +.darkmagenta { color: $darkmagenta; } +.purple { color: $purple; } +.indigo { color: $indigo; } +.darkslateblue { color: $darkslateblue; } +.slateblue { color: $slateblue; } +.mediumslateblue { color: $mediumslateblue; } +.white { color: $white; } +.snow { color: $snow; } +.honeydew { color: $honeydew; } +.mintcream { color: $mintcream; } +.azure { color: $azure; } +.aliceblue { color: $aliceblue; } +.ghostwhite { color: $ghostwhite; } +.whitesmoke { color: $whitesmoke; } +.seashell { color: $seashell; } +.beige { color: $beige; } +.oldlace { color: $oldlace; } +.floralwhite { color: $floralwhite; } +.ivory { color: $ivory; } +.antiquewhite { color: $antiquewhite; } +.linen { color: $linen; } +.lavenderblush { color: $lavenderblush; } +.mistyrose { color: $mistyrose; } +.gainsboro { color: $gainsboro; } +.lightgray { color: $lightgray; } +.silver { color: $silver; } +.darkgray { color: $darkgray; } +.gray { color: $gray; } +.dimgray { color: $dimgray; } +.lightslategray { color: $lightslategray; } +.slategray { color: $slategray; } +.darkslategray { color: $darkslategray; } +.black { color: $black; } + + +/* Background Skins */ + +.bg-pink {background-color: $pink;} +.bg-lightpink { background-color: $lightpink; } +.bg-hotpink { background-color: $hotpink; } +.bg-deeppink { background-color: $deeppink; } +.bg-palevioletred { background-color: $palevioletred; } +.bg-mediumvioletred { background-color: $mediumvioletred; } +.bg-lightsalmon { background-color: $lightsalmon; } +.bg-salmon { background-color: $salmon; } +.bg-darksalmon { background-color: $darksalmon; } +.bg-lightcoral { background-color: $lightcoral; } +.bg-indianred { background-color: $indianred; } +.bg-crimson { background-color: $crimson; } +.bg-firebrick { background-color: $firebrick; } +.bg-darkred { background-color: $darkred; } +.bg-red { background-color: $red; } +.bg-orangered { background-color: $orangered; } +.bg-tomato { background-color: $tomato; } +.bg-coral { background-color: $coral; } +.bg-darkorange { background-color: $darkorange; } +.bg-orange { background-color: $orange; } +.bg-gold { background-color: $gold; } +.bg-yellow { background-color: $yellow; } +.bg-lightyellow { background-color: $lightyellow; } +.bg-lemonchiffon { background-color: $lemonchiffon; } +.bg-lightgoldenrodyellow { background-color: $lightgoldenrodyellow; } +.bg-papayawhip { background-color: $papayawhip; } +.bg-moccasin { background-color: $moccasin; } +.bg-peachpuff { background-color: $peachpuff; } +.bg-palegoldenrod { background-color: $palegoldenrod; } +.bg-khaki { background-color: $khaki; } +.bg-darkkhaki { background-color: $darkkhaki; } +.bg-cornsilk { background-color: $cornsilk; } +.bg-blanchedalmond { background-color: $blanchedalmond; } +.bg-bisque { background-color: $bisque; } +.bg-navajowhite { background-color: $navajowhite; } +.bg-wheat { background-color: $wheat; } +.bg-burlywood { background-color: $burlywood; } +.bg-tan { background-color: $tan; } +.bg-rosybrown { background-color: $rosybrown; } +.bg-sandybrown { background-color: $sandybrown; } +.bg-goldenrod { background-color: $goldenrod; } +.bg-darkgoldenrod { background-color: $darkgoldenrod; } +.bg-peru { background-color: $peru; } +.bg-chocolate { background-color: $chocolate; } +.bg-saddlebrown { background-color: $saddlebrown; } +.bg-sienna { background-color: $sienna; } +.bg-brown { background-color: $brown; } +.bg-maroon { background-color: $maroon; } +.bg-darkolivegreen { background-color: $darkolivegreen; } +.bg-olive { background-color: $olive; } +.bg-olivedrab { background-color: $olivedrab; } +.bg-yellowgreen { background-color: $yellowgreen; } +.bg-limegreen { background-color: $limegreen; } +.bg-lime { background-color: $lime; } +.bg-lawngreen { background-color: $lawngreen; } +.bg-chartreuse { background-color: $chartreuse; } +.bg-greenyellow { background-color: $greenyellow; } +.bg-springgreen { background-color: $springgreen; } +.bg-mediumspringgreen { background-color: $mediumspringgreen; } +.bg-lightgreen { background-color: $lightgreen; } +.bg-palegreen { background-color: $palegreen; } +.bg-darkseagreen { background-color: $darkseagreen; } +.bg-mediumseagreen { background-color: $mediumseagreen; } +.bg-seagreen { background-color: $seagreen; } +.bg-forestgreen { background-color: $forestgreen; } +.bg-green { background-color: $green; } +.bg-darkgreen { background-color: $darkgreen; } +.bg-mediumaquamarine { background-color: $mediumaquamarine; } +.bg-aqua { background-color: $aqua; } +.bg-cyan { background-color: $cyan; } +.bg-lightcyan { background-color: $lightcyan; } +.bg-paleturquoise { background-color: $paleturquoise; } +.bg-aquamarine { background-color: $aquamarine; } +.bg-turquoise { background-color: $turquoise; } +.bg-mediumturquoise { background-color: $mediumturquoise; } +.bg-darkturquoise { background-color: $darkturquoise; } +.bg-lightseagreen { background-color: $lightseagreen; } +.bg-cadetblue { background-color: $cadetblue; } +.bg-darkcyan { background-color: $darkcyan; } +.bg-teal { background-color: $teal; } +.bg-lightsteelblue { background-color: $lightsteelblue; } +.bg-powderblue { background-color: $powderblue; } +.bg-lightblue { background-color: $lightblue; } +.bg-skyblue { background-color: $skyblue; } +.bg-lightskyblue { background-color: $lightskyblue; } +.bg-deepskyblue { background-color: $deepskyblue; } +.bg-dodgerblue { background-color: $dodgerblue; } +.bg-cornflowerblue { background-color: $cornflowerblue; } +.bg-steelblue { background-color: $steelblue; } +.bg-royalblue { background-color: $royalblue; } +.bg-blue { background-color: $blue; } +.bg-mediumblue { background-color: $mediumblue; } +.bg-darkblue { background-color: $darkblue; } +.bg-navy { background-color: $navy; } +.bg-midnightblue { background-color: $midnightblue; } +.bg-lavender { background-color: $lavender; } +.bg-thistle { background-color: $thistle; } +.bg-plum { background-color: $plum; } +.bg-violet { background-color: $violet; } +.bg-orchid { background-color: $orchid; } +.bg-fuchsia { background-color: $fuchsia; } +.bg-magenta { background-color: $magenta; } +.bg-mediumorchid { background-color: $mediumorchid; } +.bg-mediumpurple { background-color: $mediumpurple; } +.bg-blueviolet { background-color: $blueviolet; } +.bg-darkviolet { background-color: $darkviolet; } +.bg-darkorchid { background-color: $darkorchid; } +.bg-darkmagenta { background-color: $darkmagenta; } +.bg-purple { background-color: $purple; } +.bg-indigo { background-color: $indigo; } +.bg-darkslateblue { background-color: $darkslateblue; } +.bg-slateblue { background-color: $slateblue; } +.bg-mediumslateblue { background-color: $mediumslateblue; } +.bg-white { background-color: $white; } +.bg-snow { background-color: $snow; } +.bg-honeydew { background-color: $honeydew; } +.bg-mintcream { background-color: $mintcream; } +.bg-azure { background-color: $azure; } +.bg-aliceblue { background-color: $aliceblue; } +.bg-ghostwhite { background-color: $ghostwhite; } +.bg-whitesmoke { background-color: $whitesmoke; } +.bg-seashell { background-color: $seashell; } +.bg-beige { background-color: $beige; } +.bg-oldlace { background-color: $oldlace; } +.bg-floralwhite { background-color: $floralwhite; } +.bg-ivory { background-color: $ivory; } +.bg-antiquewhite { background-color: $antiquewhite; } +.bg-linen { background-color: $linen; } +.bg-lavenderblush { background-color: $lavenderblush; } +.bg-mistyrose { background-color: $mistyrose; } +.bg-gainsboro { background-color: $gainsboro; } +.bg-lightgray { background-color: $lightgray; } +.bg-silver { background-color: $silver; } +.bg-darkgray { background-color: $darkgray; } +.bg-gray { background-color: $gray; } +.bg-dimgray { background-color: $dimgray; } +.bg-lightslategray { background-color: $lightslategray; } +.bg-slategray { background-color: $slategray; } +.bg-darkslategray { background-color: $darkslategray; } +.bg-black { background-color: $black; } + diff --git a/sass/_spacing.scss b/sass/_spacing.scss new file mode 100644 index 0000000..43149b8 --- /dev/null +++ b/sass/_spacing.scss @@ -0,0 +1,539 @@ +/* ========================================================================== + SPACING + + An eight step powers of two scale ranging from 0 to 16rem. + + Legend: + + p = padding + m = margin + + a = all + h = horizontal + v = vertical + t = top + r = right + b = bottom + l = left + + n = none + xs = extra small + s = small + m = medium + l = large + x = extra + xl = extra large + xxl = extra extra large + + ========================================================================== */ + +.pan { padding: 0; } +.paxs { padding: .25rem; } +.pas { padding: .5rem; } +.pam { padding: 1rem; } +.pal { padding: 2rem; } +.pax { padding: 4rem; } +.paxl { padding: 8rem; } +.paxxl { padding: 16rem; } + +.pln { padding-left: 0; } +.plxs { padding-left: .25rem; } +.pls { padding-left: .5rem; } +.plm { padding-left: 1rem; } +.pll { padding-left: 2rem; } +.plx { padding-left: 4rem; } +.plxl { padding-left: 8rem; } +.plxxl { padding-left: 16rem; } + +.prn { padding-right: 0; } +.prxs { padding-right: .25rem; } +.prs { padding-right: .5rem; } +.prm { padding-right: 1rem; } +.prl { padding-right: 2rem; } +.prx { padding-right: 4rem; } +.prxl { padding-right: 8rem; } +.prxxl { padding-right: 16rem; } + +.pbn { padding-bottom: 0; } +.pbxs { padding-bottom: .25rem; } +.pbs { padding-bottom: .5rem; } +.pbm { padding-bottom: 1rem; } +.pbl { padding-bottom: 2rem; } +.pbx { padding-bottom: 4rem; } +.pbxl { padding-bottom: 8rem; } +.pbxxl { padding-bottom: 16rem; } + +.ptn { padding-top: 0; } +.ptxs { padding-top: .25rem; } +.pts { padding-top: .5rem; } +.ptm { padding-top: 1rem; } +.ptl { padding-top: 2rem; } +.ptx { padding-top: 4rem; } +.ptxl { padding-top: 8rem; } +.ptxxl { padding-top: 16rem; } + +.pvn { padding-top: 0; padding-bottom: 0; } +.pvxs { padding-top: .25rem; padding-bottom: .25rem; } +.pvs { padding-top: .5rem; padding-bottom: .5rem; } +.pvm { padding-top: 1rem; padding-bottom: 1rem; } +.pvl { padding-top: 2rem; padding-bottom: 2rem; } +.pvx { padding-top: 4rem; padding-bottom: 4rem; } +.pvxl { padding-top: 8rem; padding-bottom: 8rem; } +.pvxxl { padding-top: 16rem; padding-bottom: 16rem; } + +.phn { padding-left: 0; padding-right: 0; } +.pvxs { padding-left: .25rem; padding-right: .25rem; } +.phs { padding-left: .5rem; padding-right: .5rem; } +.phm { padding-left: 1rem; padding-right: 1rem; } +.phl { padding-left: 2rem; padding-right: 2rem; } +.phx { padding-left: 4rem; padding-right: 4rem; } +.phxl { padding-left: 8rem; padding-right: 8rem; } +.phxxl { padding-left: 16rem; padding-right: 16rem; } + +.man { margin: 0; } +.maxs { margin: .25rem; } +.mas { margin: .5rem; } +.mam { margin: 1rem; } +.mal { margin: 2rem; } +.max { margin: 4rem; } +.maxl { margin: 8rem; } +.maxxl { margin: 16rem; } + +.mln { margin-left: 0; } +.mlxs { margin-left: .25rem; } +.mls { margin-left: .5rem; } +.mlm { margin-left: 1rem; } +.mll { margin-left: 2rem; } +.mlx { margin-left: 4rem; } +.mlxl { margin-left: 8rem; } +.mlxxl { margin-left: 16rem; } + +.mrn { margin-right: 0; } +.mrxs { margin-right: .25rem; } +.mrs { margin-right: .5rem; } +.mrm { margin-right: 1rem; } +.mrl { margin-right: 2rem; } +.mrx { margin-right: 4rem; } +.mrxl { margin-right: 8rem; } +.mrxxl { margin-right: 16rem; } + +.mbn { margin-bottom: 0; } +.mbxs { margin-bottom: .25rem; } +.mbs { margin-bottom: .5rem; } +.mbm { margin-bottom: 1rem; } +.mbl { margin-bottom: 2rem; } +.mbx { margin-bottom: 4rem; } +.mbxl { margin-bottom: 8rem; } +.mbxxl { margin-bottom: 16rem; } + +.mtn { margin-top: 0; } +.mtxs { margin-top: .25rem; } +.mts { margin-top: .5rem; } +.mtm { margin-top: 1rem; } +.mtl { margin-top: 2rem; } +.mtx { margin-top: 4rem; } +.mtxl { margin-top: 8rem; } +.mtxxl { margin-top: 16rem; } + +.mvn { margin-top: 0; margin-bottom: 0rem; } +.mvxs { margin-top: .25rem; margin-bottom: .25rem; } +.mvs { margin-top: .5rem; margin-bottom: .5rem; } +.mvm { margin-top: 1rem; margin-bottom: 1rem; } +.mvl { margin-top: 2rem; margin-bottom: 2rem; } +.mvx { margin-top: 4rem; margin-bottom: 4rem; } +.mvxl { margin-top: 8rem; margin-bottom: 8rem; } +.mvxl { margin-top: 16rem; margin-bottom: 16rem; } + +.mhn { margin-left: 0; margin-right: 0; } +.mhs { margin-left: .5rem; margin-right: .5rem; } +.mhm { margin-left: 1rem; margin-right: 1rem; } +.mhl { margin-left: 2rem; margin-right: 2rem; } +.mhx { margin-left: 4rem; margin-right: 4rem; } +.mhxl { margin-left: 8rem; margin-right: 8rem; } +.mhxxl { margin-left: 16rem; margin-right: 16rem; } + +@include break(not-small) { + .pan-ns { padding: 0; } + .paxs-ns { padding: .25rem; } + .pas-ns { padding: .5rem; } + .pam-ns { padding: 1rem; } + .pal-ns { padding: 2rem; } + .pax-ns { padding: 4rem; } + .paxl-ns { padding: 8rem; } + .paxxl-ns { padding: 16rem; } + + .pln-ns { padding-left: 0; } + .plxs-ns { padding-left: .25rem; } + .pls-ns { padding-left: .5rem; } + .plm-ns { padding-left: 1rem; } + .pll-ns { padding-left: 2rem; } + .plx-ns { padding-left: 4rem; } + .plxl-ns { padding-left: 8rem; } + .plxxl-ns { padding-left: 16rem; } + + .prn-ns { padding-right: 0; } + .prxs-ns { padding-right: .25rem; } + .prs-ns { padding-right: .5rem; } + .prm-ns { padding-right: 1rem; } + .prl-ns { padding-right: 2rem; } + .prx-ns { padding-right: 4rem; } + .prxl-ns { padding-right: 8rem; } + .prxxl-ns { padding-right: 16rem; } + + .pbn-ns { padding-bottom: 0; } + .pbxs-ns { padding-bottom: .25rem; } + .pbs-ns { padding-bottom: .5rem; } + .pbm-ns { padding-bottom: 1rem; } + .pbl-ns { padding-bottom: 2rem; } + .pbx-ns { padding-bottom: 4rem; } + .pbxl-ns { padding-bottom: 8rem; } + .pbxxl-ns { padding-bottom: 16rem; } + + .ptn-ns { padding-top: 0; } + .ptxs-ns { padding-top: .25rem; } + .pts-ns { padding-top: .5rem; } + .ptm-ns { padding-top: 1rem; } + .ptl-ns { padding-top: 2rem; } + .ptx-ns { padding-top: 4rem; } + .ptxl-ns { padding-top: 8rem; } + .ptxxl-ns { padding-top: 16rem; } + + .pvn-ns { padding-top: 0; padding-bottom: 0; } + .pvxs-ns { padding-top: .25rem; padding-bottom: .25rem; } + .pvs-ns { padding-top: .5rem; padding-bottom: .5rem; } + .pvm-ns { padding-top: 1rem; padding-bottom: 1rem; } + .pvl-ns { padding-top: 2rem; padding-bottom: 2rem; } + .pvx-ns { padding-top: 4rem; padding-bottom: 4rem; } + .pvxl-ns { padding-top: 8rem; padding-bottom: 8rem; } + .pvxxl-ns { padding-top: 16rem; padding-bottom: 16rem; } + + .phn-ns { padding-left: 0; padding-right: 0; } + .pvxs-ns { padding-left: .25rem; padding-right: .25rem; } + .phs-ns { padding-left: .5rem; padding-right: .5rem; } + .phm-ns { padding-left: 1rem; padding-right: 1rem; } + .phl-ns { padding-left: 2rem; padding-right: 2rem; } + .phx-ns { padding-left: 4rem; padding-right: 4rem; } + .phxl-ns { padding-left: 8rem; padding-right: 8rem; } + .phxxl-ns { padding-left: 16rem; padding-right: 16rem; } + + .man-ns { margin: 0; } + .maxs-ns { margin: .25rem; } + .mas-ns { margin: .5rem; } + .mam-ns { margin: 1rem; } + .mal-ns { margin: 2rem; } + .max-ns { margin: 4rem; } + .maxl-ns { margin: 8rem; } + .maxxl-ns { margin: 16rem; } + + .mln-ns { margin-left: 0; } + .mlxs-ns { margin-left: .25rem; } + .mls-ns { margin-left: .5rem; } + .mlm-ns { margin-left: 1rem; } + .mll-ns { margin-left: 2rem; } + .mlx-ns { margin-left: 4rem; } + .mlxl-ns { margin-left: 8rem; } + .mlxxl-ns { margin-left: 16rem; } + + .mrn-ns { margin-right: 0; } + .mrxs-ns { margin-right: .25rem; } + .mrs-ns { margin-right: .5rem; } + .mrm-ns { margin-right: 1rem; } + .mrl-ns { margin-right: 2rem; } + .mrx-ns { margin-right: 4rem; } + .mrxl-ns { margin-right: 8rem; } + .mrxxl-ns { margin-right: 16rem; } + + .mbn-ns { margin-bottom: 0; } + .mbxs-ns { margin-bottom: .25rem; } + .mbs-ns { margin-bottom: .5rem; } + .mbm-ns { margin-bottom: 1rem; } + .mbl-ns { margin-bottom: 2rem; } + .mbx-ns { margin-bottom: 4rem; } + .mbxl-ns { margin-bottom: 8rem; } + .mbxxl-ns { margin-bottom: 16rem; } + + .mtn-ns { margin-top: 0; } + .mtxs-ns { margin-top: .25rem; } + .mts-ns { margin-top: .5rem; } + .mtm-ns { margin-top: 1rem; } + .mtl-ns { margin-top: 2rem; } + .mtx-ns { margin-top: 4rem; } + .mtxl-ns { margin-top: 8rem; } + .mtxxl-ns { margin-top: 16rem; } + + .mvn-ns { margin-top: 0; margin-bottom: 0rem; } + .mvxs-ns { margin-top: .25rem; margin-bottom: .25rem; } + .mvs-ns { margin-top: .5rem; margin-bottom: .5rem; } + .mvm-ns { margin-top: 1rem; margin-bottom: 1rem; } + .mvl-ns { margin-top: 2rem; margin-bottom: 2rem; } + .mvx-ns { margin-top: 4rem; margin-bottom: 4rem; } + .mvxl-ns { margin-top: 8rem; margin-bottom: 8rem; } + .mvxxl-ns { margin-top: 16rem; margin-bottom: 16rem; } + + .mhn-ns { margin-left: 0; margin-right: 0; } + .mhs-ns { margin-left: .5rem; margin-right: .5rem; } + .mhm-ns { margin-left: 1rem; margin-right: 1rem; } + .mhl-ns { margin-left: 2rem; margin-right: 2rem; } + .mhx-ns { margin-left: 4rem; margin-right: 4rem; } + .mhxl-ns { margin-left: 8rem; margin-right: 8rem; } + .mhxxl-ns { margin-left: 16rem; margin-right: 16rem; } + +} + +@include break(medium) { + .pan-m { padding: 0; } + .paxs-m { padding: .25rem; } + .pas-m { padding: .5rem; } + .pam-m { padding: 1rem; } + .pal-m { padding: 2rem; } + .pax-m { padding: 4rem; } + .paxl-m { padding: 8rem; } + .paxxl-m { padding: 16rem; } + + .pln-m { padding-left: 0; } + .plxs-m { padding-left: .25rem; } + .pls-m { padding-left: .5rem; } + .plm-m { padding-left: 1rem; } + .pll-m { padding-left: 2rem; } + .plx-m { padding-left: 4rem; } + .plxl-m { padding-left: 8rem; } + .plxxl-m { padding-left: 16rem; } + + .prn-m { padding-right: 0; } + .prxs-m { padding-right: .25rem; } + .prs-m { padding-right: .5rem; } + .prm-m { padding-right: 1rem; } + .prl-m { padding-right: 2rem; } + .prx-m { padding-right: 4rem; } + .prxl-m { padding-right: 8rem; } + .prxxl-m { padding-right: 16rem; } + + .pbn-m { padding-bottom: 0; } + .pbxs-m { padding-bottom: .25rem; } + .pbs-m { padding-bottom: .5rem; } + .pbm-m { padding-bottom: 1rem; } + .pbl-m { padding-bottom: 2rem; } + .pbx-m { padding-bottom: 4rem; } + .pbxl-m { padding-bottom: 8rem; } + .pbxxl-m { padding-bottom: 16rem; } + + .ptn-m { padding-top: 0; } + .ptxs-m { padding-top: .25rem; } + .pts-m { padding-top: .5rem; } + .ptm-m { padding-top: 1rem; } + .ptl-m { padding-top: 2rem; } + .ptx-m { padding-top: 4rem; } + .ptxl-m { padding-top: 8rem; } + .ptxxl-m { padding-top: 16rem; } + + .pvn-m { padding-top: 0; padding-bottom: 0; } + .pvxs-m { padding-top: .25rem; padding-bottom: .25rem; } + .pvs-m { padding-top: .5rem; padding-bottom: .5rem; } + .pvm-m { padding-top: 1rem; padding-bottom: 1rem; } + .pvl-m { padding-top: 2rem; padding-bottom: 2rem; } + .pvx-m { padding-top: 4rem; padding-bottom: 4rem; } + .pvxl-m { padding-top: 8rem; padding-bottom: 8rem; } + .pvxxl-m { padding-top: 16rem; padding-bottom: 16rem; } + + .phn-m { padding-left: 0; padding-right: 0; } + .pvxs-m { padding-left: .25rem; padding-right: .25rem; } + .phs-m { padding-left: .5rem; padding-right: .5rem; } + .phm-m { padding-left: 1rem; padding-right: 1rem; } + .phl-m { padding-left: 2rem; padding-right: 2rem; } + .phx-m { padding-left: 4rem; padding-right: 4rem; } + .phxl-m { padding-left: 8rem; padding-right: 8rem; } + .phxxl-m { padding-left: 16rem; padding-right: 16rem; } + + .man-m { margin: 0; } + .maxs-m { margin: .25rem; } + .mas-m { margin: .5rem; } + .mam-m { margin: 1rem; } + .mal-m { margin: 2rem; } + .max-m { margin: 4rem; } + .maxl-m { margin: 8rem; } + .maxxl-m { margin: 16rem; } + + .mln-m { margin-left: 0; } + .mlxs-m { margin-left: .25rem; } + .mls-m { margin-left: .5rem; } + .mlm-m { margin-left: 1rem; } + .mll-m { margin-left: 2rem; } + .mlx-m { margin-left: 4rem; } + .mlxl-m { margin-left: 8rem; } + .mlxxl-m { margin-left: 16rem; } + + .mrn-m { margin-right: 0; } + .mrxs-m { margin-right: .25rem; } + .mrs-m { margin-right: .5rem; } + .mrm-m { margin-right: 1rem; } + .mrl-m { margin-right: 2rem; } + .mrx-m { margin-right: 4rem; } + .mrxl-m { margin-right: 8rem; } + .mrxxl-m { margin-right: 16rem; } + + .mbn-m { margin-bottom: 0; } + .mbxs-m { margin-bottom: .25rem; } + .mbs-m { margin-bottom: .5rem; } + .mbm-m { margin-bottom: 1rem; } + .mbl-m { margin-bottom: 2rem; } + .mbx-m { margin-bottom: 4rem; } + .mbxl-m { margin-bottom: 8rem; } + .mbxxl-m { margin-bottom: 16rem; } + + .mtn-m { margin-top: 0; } + .mtxs-m { margin-top: .25rem; } + .mts-m { margin-top: .5rem; } + .mtm-m { margin-top: 1rem; } + .mtl-m { margin-top: 2rem; } + .mtx-m { margin-top: 4rem; } + .mtxl-m { margin-top: 8rem; } + .mtxxl-m { margin-top: 16rem; } + + .mvn-m { margin-top: 0; margin-bottom: 0rem; } + .mvxs-m { margin-top: .25rem; margin-bottom: .25rem; } + .mvs-m { margin-top: .5rem; margin-bottom: .5rem; } + .mvm-m { margin-top: 1rem; margin-bottom: 1rem; } + .mvl-m { margin-top: 2rem; margin-bottom: 2rem; } + .mvx-m { margin-top: 4rem; margin-bottom: 4rem; } + .mvxl-m { margin-top: 8rem; margin-bottom: 8rem; } + .mvxxl-m { margin-top: 16rem; margin-bottom: 16rem; } + + .mhn-m { margin-left: 0; margin-right: 0; } + .mhxs-m { margin-left: .25rem; margin-right: .25rem; } + .mhs-m { margin-left: .5rem; margin-right: .5rem; } + .mhm-m { margin-left: 1rem; margin-right: 1rem; } + .mhl-m { margin-left: 2rem; margin-right: 2rem; } + .mhx-m { margin-left: 4rem; margin-right: 4rem; } + .mhxl { margin-left: 8rem; margin-right: 8rem; } + .mhxxl { margin-left: 16rem; margin-right: 16rem; } + +} + +@include break(large) { + .pan-l { padding: 0; } + .paxs-l { padding: .25rem; } + .pas-l { padding: .5rem; } + .pam-l { padding: 1rem; } + .pal-l { padding: 2rem; } + .pax-l { padding: 4rem; } + .paxl-l { padding: 8rem; } + .paxxl-l { padding: 16rem; } + + .pln-l { padding-left: 0; } + .plxs-l { padding-left: .25rem; } + .pls-l { padding-left: .5rem; } + .plm-l { padding-left: 1rem; } + .pll-l { padding-left: 2rem; } + .plx-l { padding-left: 4rem; } + .plxl-l { padding-left: 8rem; } + .plxxl-l { padding-left: 16rem; } + + .prn-l { padding-right: 0; } + .prxs-l { padding-right: .25rem; } + .prs-l { padding-right: .5rem; } + .prm-l { padding-right: 1rem; } + .prl-l { padding-right: 2rem; } + .prx-l { padding-right: 4rem; } + .prxl-l { padding-right: 8rem; } + .prxxl-l { padding-right: 16rem; } + + .pbn-l { padding-bottom: 0; } + .pbxs-l { padding-bottom: .25rem; } + .pbs-l { padding-bottom: .5rem; } + .pbm-l { padding-bottom: 1rem; } + .pbl-l { padding-bottom: 2rem; } + .pbx-l { padding-bottom: 4rem; } + .pbxl-l { padding-bottom: 8rem; } + .pbxxl-l { padding-bottom: 16rem; } + + .ptn-l { padding-top: 0; } + .ptxs-l { padding-top: .25rem; } + .pts-l { padding-top: .5rem; } + .ptm-l { padding-top: 1rem; } + .ptl-l { padding-top: 2rem; } + .ptx-l { padding-top: 4rem; } + .ptxl-l { padding-top: 8rem; } + .ptxxl-l { padding-top: 16rem; } + + .pvn-l { padding-top: 0; padding-bottom: 0; } + .pvxs-l { padding-top: .25rem; padding-bottom: .25rem; } + .pvs-l { padding-top: .5rem; padding-bottom: .5rem; } + .pvm-l { padding-top: 1rem; padding-bottom: 1rem; } + .pvl-l { padding-top: 2rem; padding-bottom: 2rem; } + .pvx-l { padding-top: 4rem; padding-bottom: 4rem; } + .pvxl-l { padding-top: 8rem; padding-bottom: 8rem; } + .pvxxl-l { padding-top: 16rem; padding-bottom: 16rem; } + + .phn-l { padding-left: 0; padding-right: 0; } + .pvxs-l { padding-left: .25rem; padding-right: .25rem; } + .phs-l { padding-left: .5rem; padding-right: .5rem; } + .phm-l { padding-left: 1rem; padding-right: 1rem; } + .phl-l { padding-left: 2rem; padding-right: 2rem; } + .phx-l { padding-left: 4rem; padding-right: 4rem; } + .phxl-l { padding-left: 8rem; padding-right: 8rem; } + .phxxl-l { padding-left: 16rem; padding-right: 16rem; } + + .man-l { margin: 0; } + .maxs-l { margin: .25rem; } + .mas-l { margin: .5rem; } + .mam-l { margin: 1rem; } + .mal-l { margin: 2rem; } + .max-l { margin: 4rem; } + .maxl-l { margin: 8rem; } + .maxxl-l { margin: 16rem; } + + .mln-l { margin-left: 0; } + .mlxs-l { margin-left: .25rem; } + .mls-l { margin-left: .5rem; } + .mlm-l { margin-left: 1rem; } + .mll-l { margin-left: 2rem; } + .mlx-l { margin-left: 4rem; } + .mlxl-l { margin-left: 8rem; } + .mlxxl-l { margin-left: 16rem; } + + .mrn-l { margin-right: 0; } + .mrxs-l { margin-right: .25rem; } + .mrs-l { margin-right: .5rem; } + .mrm-l { margin-right: 1rem; } + .mrl-l { margin-right: 2rem; } + .mrx-l { margin-right: 4rem; } + .mrxl-l { margin-right: 8rem; } + .mrxxl-l { margin-right: 16rem; } + + .mbn-l { margin-bottom: 0; } + .mbxs-l { margin-bottom: .25rem; } + .mbs-l { margin-bottom: .5rem; } + .mbm-l { margin-bottom: 1rem; } + .mbl-l { margin-bottom: 2rem; } + .mbx-l { margin-bottom: 4rem; } + .mbxl-l { margin-bottom: 8rem; } + .mbxxl-l { margin-bottom: 16rem; } + + .mtn-l { margin-top: 0; } + .mtxs-l { margin-top: .25rem; } + .mts-l { margin-top: .5rem; } + .mtm-l { margin-top: 1rem; } + .mtl-l { margin-top: 2rem; } + .mtx-l { margin-top: 4rem; } + .mtxl-l { margin-top: 8rem; } + .mtxxl-l { margin-top: 16rem; } + + .mvn-l { margin-top: 0; margin-bottom: 0rem; } + .mvxs-l { margin-top: .25rem; margin-bottom: .25rem; } + .mvs-l { margin-top: .5rem; margin-bottom: .5rem; } + .mvm-l { margin-top: 1rem; margin-bottom: 1rem; } + .mvl-l { margin-top: 2rem; margin-bottom: 2rem; } + .mvx-l { margin-top: 4rem; margin-bottom: 4rem; } + .mvxl-l { margin-top: 8rem; margin-bottom: 8rem; } + .mvxxl-l { margin-top: 16rem; margin-bottom: 16rem; } + + .mhn-l { margin-left: 0; margin-right: 0; } + .mhxs-l { margin-left: .25rem; margin-right: .25rem; } + .mhs-l { margin-left: .5rem; margin-right: .5rem; } + .mhm-l { margin-left: 1rem; margin-right: 1rem; } + .mhl-l { margin-left: 2rem; margin-right: 2rem; } + .mhx-l { margin-left: 4rem; margin-right: 4rem; } + .mhxl-l { margin-left: 8rem; margin-right: 8rem; } + .mhxxl-l { margin-left: 16rem; margin-right: 16rem; } +} + diff --git a/sass/_squares.scss b/sass/_squares.scss new file mode 100644 index 0000000..5042aa5 --- /dev/null +++ b/sass/_squares.scss @@ -0,0 +1,50 @@ +/* ========================================================================== + SQUARES + ========================================================================== */ + +.sq1 { width: 1rem; height: 1rem; } +.sq2 { width: 2rem; height: 2rem; } +.sq3 { width: 4rem; height: 4rem; } +.sq4 { width: 8rem; height: 8rem; } +.sq5 { width: 16rem; height: 16rem; } +.sq6 { width: 32rem; height: 32rem; } +.sq7 { width: 48rem; height: 48rem; } +.sq8 { width: 64rem; height: 64rem; } +.sq9 { width: 96rem; height: 96rem; } + +@include break(not-small) { + .sq1-ns { width: 1rem; height: 1rem; } + .sq2-ns { width: 2rem; height: 2rem; } + .sq3-ns { width: 4rem; height: 4rem; } + .sq4-ns { width: 8rem; height: 8rem; } + .sq5-ns { width: 16rem; height: 16rem; } + .sq6-ns { width: 32rem; height: 32rem; } + .sq7-ns { width: 48rem; height: 48rem; } + .sq8-ns { width: 64rem; height: 64rem; } + .sq9-ns { width: 96rem; height: 96rem; } +} + +@include break(medium) { + .sq1-m { width: 1rem; height: 1rem; } + .sq2-m { width: 2rem; height: 2rem; } + .sq3-m { width: 4rem; height: 4rem; } + .sq4-m { width: 8rem; height: 8rem; } + .sq5-m { width: 16rem; height: 16rem; } + .sq6-m { width: 32rem; height: 32rem; } + .sq7-m { width: 48rem; height: 48rem; } + .sq8-m { width: 64rem; height: 64rem; } + .sq9-m { width: 96rem; height: 96rem; } +} + +@include break(large) { + .sq1-l { width: 1rem; height: 1rem; } + .sq2-l { width: 2rem; height: 2rem; } + .sq3-l { width: 4rem; height: 4rem; } + .sq4-l { width: 8rem; height: 8rem; } + .sq5-l { width: 16rem; height: 16rem; } + .sq6-l { width: 32rem; height: 32rem; } + .sq7-l { width: 48rem; height: 48rem; } + .sq8-l { width: 64rem; height: 64rem; } + .sq9-l { width: 96rem; height: 96rem; } +} + diff --git a/sass/_text_align.scss b/sass/_text_align.scss new file mode 100644 index 0000000..6bf7c76 --- /dev/null +++ b/sass/_text_align.scss @@ -0,0 +1,56 @@ +/* Text Align */ + +.tl { text-align: left; } +.tr { text-align: right; } +.tc { text-align: center; } +.tj { text-align: justify; } +.ts { text-align: start; } +.te { text-align: end; } +.tmp { text-align: match-parent; } +.tse { text-align: start end; } +.tp { text-align: "."; } +.tsp { text-align: start "."; } +.tpe { text-align: "." end; } + +@include break(not-small) { + .tl-ns { text-align: left; } + .tr-ns { text-align: right; } + .tc-ns { text-align: center; } + .tj-ns { text-align: justify; } + .ts-ns { text-align: start; } + .te-ns { text-align: end; } + .tmp-ns { text-align: match-parent; } + .tse-ns { text-align: start end; } + .tp-ns { text-align: "."; } + .tsp-ns { text-align: start "."; } + .tpe-ns { text-align: "." end; } +} + +@include break(medium) { + .tl-m { text-align: left; } + .tr-m { text-align: right; } + .tc-m { text-align: center; } + .tj-m { text-align: justify; } + .ts-m { text-align: start; } + .te-m { text-align: end; } + .tmp-m { text-align: match-parent; } + .tse-m { text-align: start end; } + .tp-m { text-align: "."; } + .tsp-m { text-align: start "."; } + .tpe-m { text-align: "." end; } +} + +@include break(large) { + .tl-l { text-align: left; } + .tr-l { text-align: right; } + .tc-l { text-align: center; } + .tj-l { text-align: justify; } + .ts-l { text-align: start; } + .te-l { text-align: end; } + .tmp-l { text-align: match-parent; } + .tse-l { text-align: start end; } + .tp-l { text-align: "."; } + .tsp-l { text-align: start "."; } + .tpe-l { text-align: "." end; } +} + diff --git a/sass/_text_decoration.scss b/sass/_text_decoration.scss new file mode 100644 index 0000000..33cc585 --- /dev/null +++ b/sass/_text_decoration.scss @@ -0,0 +1,35 @@ +/* ========================================================================== + TEXT DECORAION + ========================================================================== */ + +.under { text-decoration: underline; } +.over { text-decoration: overline; } +.strike { text-decoration: line-through; } +.blink { text-decoration: blink; } +.none { text-decoration: none; } + + +@include break(not-small) { + .under-ns { text-decoration: underline; } + .over-ns { text-decoration: overline; } + .strike-ns { text-decoration: line-through; } + .blink-ns { text-decoration: blink; } + .none-ns { text-decoration: none; } +} + +@include break(medium) { + .under-m { text-decoration: underline; } + .over-m { text-decoration: overline; } + .strike-m { text-decoration: line-through; } + .blink-m { text-decoration: blink; } + .none-m { text-decoration: none; } +} + +@include break(large) { + .under-l { text-decoration: underline; } + .over-l { text-decoration: overline; } + .strike-l { text-decoration: line-through; } + .blink-l { text-decoration: blink; } + .none-l { text-decoration: none; } +} + diff --git a/sass/_text_overflow.scss b/sass/_text_overflow.scss new file mode 100644 index 0000000..1fac197 --- /dev/null +++ b/sass/_text_overflow.scss @@ -0,0 +1,42 @@ +/* ========================================================================== + TEXT OVERFLOW + ========================================================================== */ + +.t-clip { text-overflow: clip; } +.t-ellipsis { text-overflow: ellipsis; } +.t-dots { text-overflow: "…"; } + +/* Two-value syntax: the first value describes the overflow at the left end of the line, + the second at the right end. Directionality has no influence */ + +.t-clip-ellipsis { text-overflow: clip ellipsis; } +.t-double { text-overflow: "…" "…"; } +.t-i { text-overflow: inherit; } + +@include break(not-small) { + .t-clip-ns { text-overflow: clip; } + .t-ellipsis-ns { text-overflow: ellipsis; } + .t-dots-ns { text-overflow: "…"; } + .t-clip-ellipsis-ns { text-overflow: clip ellipsis; } + .t-double-ns { text-overflow: "…" "…"; } + .t-i-ns { text-overflow: inherit; } +} + +@include break(medium) { + .t-clip-m { text-overflow: clip; } + .t-ellipsis-m { text-overflow: ellipsis; } + .t-dots-m { text-overflow: "…"; } + .t-clip-ellipsis-m { text-overflow: clip ellipsis; } + .t-double-m { text-overflow: "…" "…"; } + .t-i-m { text-overflow: inherit; } +} + +@include break(large) { + .t-clip-l { text-overflow: clip; } + .t-ellipsis-l { text-overflow: ellipsis; } + .t-dots-l { text-overflow: "…"; } + .t-clip-ellipsis-l { text-overflow: clip ellipsis; } + .t-double-l { text-overflow: "…" "…"; } + .t-i-l { text-overflow: inherit; } +} + diff --git a/sass/_text_transform.scss b/sass/_text_transform.scss new file mode 100644 index 0000000..f351af6 --- /dev/null +++ b/sass/_text_transform.scss @@ -0,0 +1,30 @@ +/* ========================================================================== + TEXT TRANSFORM + ========================================================================== */ + +.ttc { text-transform: capitalize; } +.ttu { text-transform: uppercase; } +.ttl { text-transform: lowercase; } +.ttn { text-transform: none; } + +@include break(not-small) { + .ttc-ns { text-transform: capitalize; } + .ttu-ns { text-transform: uppercase; } + .ttl-ns { text-transform: lowercase; } + .ttn-ns { text-transform: none; } +} + +@include break(medium) { + .ttc-m { text-transform: capitalize; } + .ttu-m { text-transform: uppercase; } + .ttl-m { text-transform: lowercase; } + .ttn-m { text-transform: none; } +} + +@include break(large) { + .ttc-l { text-transform: capitalize; } + .ttu-l { text-transform: uppercase; } + .ttl-l { text-transform: lowercase; } + .ttn-l { text-transform: none; } +} + diff --git a/sass/_type_scale.scss b/sass/_type_scale.scss new file mode 100644 index 0000000..9a8ec11 --- /dev/null +++ b/sass/_type_scale.scss @@ -0,0 +1,43 @@ +/* ========================================================================== + TYPE SCALE + ========================================================================== */ + +.f1 { font-size: 2rem; } +.f2 { font-size: 1.5rem; } +.f3 { font-size: 1.2rem; } +.f4 { font-size: 1.2rem; } +.f5 { font-size: 1rem; } +.f6, +.small { font-size: .85rem; } + + +@include break(not-small){ + .mega-ns { font-size: 3rem; } + .f1-ns { font-size: 2rem; } + .f2-ns { font-size: 1.5rem; } + .f3-ns { font-size: 1.2rem; } + .f4-ns { font-size: 1.2rem; } + .f5-ns { font-size: 1rem; } + .f6-ns { font-size: .85rem; } +} + +@include break(medium) { + .mega-m { font-size: 3rem; } + .f1-m { font-size: 2rem; } + .f2-m { font-size: 1.5rem; } + .f3-m { font-size: 1.2rem; } + .f4-m { font-size: 1.2rem; } + .f5-m { font-size: 1rem; } + .f6-m { font-size: .85rem; } +} + +@include break(large) { + .mega-l { font-size: 4rem; } + .f1-l { font-size: 3rem; } + .f2-l { font-size: 2rem; } + .f3-l { font-size: 1.5rem; } + .f4-l { font-size: 1.2rem; } + .f5-l { font-size: 1rem; } + .f6-l { font-size: 1rem; } +} + diff --git a/sass/_utilities.scss b/sass/_utilities.scss new file mode 100644 index 0000000..5ea5128 --- /dev/null +++ b/sass/_utilities.scss @@ -0,0 +1,82 @@ +/* ========================================================================== + UTILITIES + ========================================================================== */ + +/* + * The Media Object + * Built by @stubornella + * http://www.stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code/ + * + *
+ * + * + * me + * + * + *
+ * @Stubbornella 14 minutes ago + *
+ * + *
+ */ + + + +/* + * The Flag Object + * Built by @csswizzrdry + * http://csswizardry.com/2013/05/the-flag-object/ + * + * + * Use to vertically center text against an image. + * + *
+ *
+ * + *
+ *
+ *

+ *
+ *
+ * + */ + +.flag { + display: table; + width: 100%; +} + +.flag__image, +.flag__body { + display: table-cell; + vertical-align: middle; + + .flag--top & { + vertical-align: top; + } + + .flag--bottom & { + vertical-align: bottom; + } + +} + +.flag__image { + padding-right: 10px; + + > img { + display: block; + max-width: none; + } + + .flag--rev & { + padding-right: 0; + padding-left: 10px; + } + +} + +.flag__body { + width: 100%; +} + diff --git a/sass/_vertical_align.scss b/sass/_vertical_align.scss new file mode 100644 index 0000000..b8cfc00 --- /dev/null +++ b/sass/_vertical_align.scss @@ -0,0 +1,46 @@ +/* ========================================================================== + VERTICAL ALIGN + ========================================================================== */ + +.v-base { vertical-align: baseline; } +.v-sub { vertical-align: sub; } +.v-sup { vertical-align: super; } +.v-txt-top { vertical-align: text-top; } +.v-txt-btm { vertical-align: text-bottom; } +.v-mid { vertical-align: middle; } +.v-top { vertical-align: top; } +.v-btm { vertical-align: bottom; } + +@include break(not-small) { + .v-base-ns { vertical-align: baseline; } + .v-sub-ns { vertical-align: sub; } + .v-sup-ns { vertical-align: super; } + .v-txt-top-ns { vertical-align: text-top; } + .v-txt-btm-ns { vertical-align: text-bottom; } + .v-mid-ns { vertical-align: middle; } + .v-top-ns { vertical-align: top; } + .v-btm-ns { vertical-align: bottom; } +} + +@include break(medium) { + .v-base-m { vertical-align: baseline; } + .v-sub-m { vertical-align: sub; } + .v-sup-m { vertical-align: super; } + .v-txt-top-m { vertical-align: text-top; } + .v-txt-btm-m { vertical-align: text-bottom; } + .v-mid-m { vertical-align: middle; } + .v-top-m { vertical-align: top; } + .v-btm-m { vertical-align: bottom; } +} + +@include break(large) { + .v-base-l { vertical-align: baseline; } + .v-sub-l { vertical-align: sub; } + .v-sup-l { vertical-align: super; } + .v-txt-top-l { vertical-align: text-top; } + .v-txt-btm-l { vertical-align: text-bottom; } + .v-mid-l { vertical-align: middle; } + .v-top-l { vertical-align: top; } + .v-btm-l { vertical-align: bottom; } +} + diff --git a/sass/_visibility.scss b/sass/_visibility.scss new file mode 100644 index 0000000..2bb3140 --- /dev/null +++ b/sass/_visibility.scss @@ -0,0 +1,66 @@ +/* ========================================================================== + VISIBILITY + ========================================================================== */ + + +.vis { visibility: visible; } +.vis-hidden { visibility: hidden; } +.vis-collapse { visibility: collapse; } + +.vis-bf-vis { backface-visibility: visible; } +.vis-bf-hid { backface-visibility: hidden; } + +/* + Text that is hidden but accessible + Ref: http://snook.ca/archives/html_and_css/hiding-content-for-accessibility +*/ + +.clip { + position: fixed !important; + _position: absolute !important; + clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ + clip: rect(1px, 1px, 1px, 1px); +} + +@include break(not-small) { + .vis-ns { visibility: visible; } + .vis-hidden-ns { visibility: hidden; } + .vis-collapse-ns { visibility: collapse; } + .vis-bf-vis-ns { backface-visibility: visible; } + .vis-bf-hid-ns { backface-visibility: hidden; } + .clip-ns { + position: fixed !important; + _position: absolute !important; + clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ + clip: rect(1px, 1px, 1px, 1px); + } +} + +@include break(medium) { + .vis-m { visibility: visible; } + .vis-hidden-m { visibility: hidden; } + .vis-collapse-m { visibility: collapse; } + .vis-bf-vis-m { backface-visibility: visible; } + .vis-bf-hid-m { backface-visibility: hidden; } + .clip-m { + position: fixed !important; + _position: absolute !important; + clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ + clip: rect(1px, 1px, 1px, 1px); + } +} + +@include break(large) { + .vis-l { visibility: visible; } + .vis-hidden-l { visibility: hidden; } + .vis-collapse-l { visibility: collapse; } + .vis-bf-vis-l { backface-visibility: visible; } + .vis-bf-hid-l { backface-visibility: hidden; } + .clip-l { + position: fixed !important; + _position: absolute !important; + clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ + clip: rect(1px, 1px, 1px, 1px); + } +} + diff --git a/sass/_white_space.scss b/sass/_white_space.scss new file mode 100644 index 0000000..bf8aa40 --- /dev/null +++ b/sass/_white_space.scss @@ -0,0 +1,35 @@ +/* ========================================================================== + WHITE SPACE + ========================================================================== */ + + +.ws-norm { white-space: normal; } +.ws-nowrap { white-space: nowrap; } +.ws-pre { white-space: pre; } +.ws-prewrap { white-space: pre-wrap; } +.ws-preline { white-space: pre-line; } + +@include break(not-small) { + .ws-norm-ns { white-space: normal; } + .ws-nowrap-ns { white-space: nowrap; } + .ws-pre-ns { white-space: pre; } + .ws-prewrap-ns { white-space: pre-wrap; } + .ws-preline-ns { white-space: pre-line; } +} + +@include break(medium) { + .ws-norm-m { white-space: normal; } + .ws-nowrap-m { white-space: nowrap; } + .ws-pre-m { white-space: pre; } + .ws-prewrap-m { white-space: pre-wrap; } + .ws-preline-m { white-space: pre-line; } +} + +@include break(large) { + .ws-norm-l { white-space: normal; } + .ws-nowrap-l { white-space: nowrap; } + .ws-pre-l { white-space: pre; } + .ws-prewrap-l { white-space: pre-wrap; } + .ws-preline-l { white-space: pre-line; } +} + diff --git a/sass/_widths.scss b/sass/_widths.scss new file mode 100644 index 0000000..be6bf23 --- /dev/null +++ b/sass/_widths.scss @@ -0,0 +1,91 @@ +/* ========================================================================== + WIDTHS + ========================================================================== */ + +/* Width Scale */ + +.wi1 { width: 1rem; } +.wi2 { width: 2rem; } +.wi3 { width: 4rem; } +.wi4 { width: 8rem; } +.wi5 { width: 16rem; } +.wi6 { width: 32rem; } +.wi7 { width: 48rem; } +.wi8 { width: 64rem; } +.wi9 { width: 96rem; } +.wi10 { width: 128rem; } + +/* Width String Properties */ + +.wi-bb { width: border-box; } +.wi-cb { width: content-box; } +.wi-mx { width: max-content; } +.wi-mn { width: min-content; } +.wi-av { width: available; } +.wi-fc { width: fit-content; } +.wi-at { width: auto; } +.wi-i { width: inherit; } + +@include break(not-small) { + .wi1-ns { width: 1rem; } + .wi2-ns { width: 2rem; } + .wi3-ns { width: 4rem; } + .wi4-ns { width: 8rem; } + .wi5-ns { width: 16rem; } + .wi6-ns { width: 32rem; } + .wi7-ns { width: 48rem; } + .wi8-ns { width: 64rem; } + .wi9-ns { width: 96rem; } + .wi10-ns { width: 128rem; } + .wi-bb-ns { width: border-box; } + .wi-cb-ns { width: content-box; } + .wi-mx-ns { width: max-content; } + .wi-mn-ns { width: min-content; } + .wi-av-ns { width: available; } + .wi-fc-ns { width: fit-content; } + .wi-at-ns { width: auto; } + .wi-i-ns { width: inherit; } +} + +@include break(medium) { + .wi1-m { width: 1rem; } + .wi2-m { width: 2rem; } + .wi3-m { width: 4rem; } + .wi4-m { width: 8rem; } + .wi5-m { width: 16rem; } + .wi6-m { width: 32rem; } + .wi7-m { width: 48rem; } + .wi8-m { width: 64rem; } + .wi9-m { width: 96rem; } + .wi10-m { width: 128rem; } + .wi-bb-m { width: border-box; } + .wi-cb-m { width: content-box; } + .wi-mx-m { width: max-content; } + .wi-mn-m { width: min-content; } + .wi-av-m { width: available; } + .wi-fc-m { width: fit-content; } + .wi-at-m { width: auto; } + .wi-i-m { width: inherit; } +} + +@include break(large) { + .wi1-l { width: 1rem; } + .wi2-l { width: 2rem; } + .wi3-l { width: 4rem; } + .wi4-l { width: 8rem; } + .wi5-l { width: 16rem; } + .wi6-l { width: 32rem; } + .wi7-l { width: 48rem; } + .wi8-l { width: 64rem; } + .wi9-l { width: 96rem; } + .wi10-l { width: 128rem; } + .wi-bb-l { width: border-box; } + .wi-cb-l { width: content-box; } + .wi-mx-l { width: max-content; } + .wi-mn-l { width: min-content; } + .wi-av-l { width: available; } + .wi-fc-l { width: fit-content; } + .wi-at-l { width: auto; } + .wi-i-l { width: inherit; } +} + diff --git a/sass/_word_spacing.scss b/sass/_word_spacing.scss new file mode 100644 index 0000000..74c1913 --- /dev/null +++ b/sass/_word_spacing.scss @@ -0,0 +1,26 @@ +/* ========================================================================== + WORD SPACING + ========================================================================== */ + +.wsn { word-spacing: normal; } +.ws1 { word-spacing: 0.3em; } +.ws2 { word-spacing: -0.43em; } /* For eliminating space between inline-block elements */ + +@include break(not-small) { + .wsn-ns { word-spacing: normal; } + .ws1-ns { word-spacing: 0.3em; } + .ws2-ns { word-spacing: -0.43em; } +} + +@include break(medium) { + .wsn-m { word-spacing: normal; } + .ws1-m { word-spacing: 0.3em; } + .ws2-m { word-spacing: -0.43em; } +} + +@include break(large) { + .wsn-l { word-spacing: normal; } + .ws1-l { word-spacing: 0.3em; } + .ws2-l { word-spacing: -0.43em; } +} + diff --git a/sass/i.scss b/sass/i.scss new file mode 100644 index 0000000..7eac48f --- /dev/null +++ b/sass/i.scss @@ -0,0 +1,47 @@ +@import "queries"; +@import "colors"; + +@import "background_repeat"; +@import "background_size"; +@import "border_colors"; +@import "border_radius"; +@import "border_style"; +@import "border_widths"; +@import "borders"; +@import "clears"; +@import "dimension_utilities"; +@import "display"; +@import "floats"; +@import "font_family"; +@import "font_style"; +@import "font_weight"; +@import "forms"; +@import "grid"; +@import "heights"; +@import "images"; +@import "letter_spacing"; +@import "line_height"; +@import "links"; +@import "lists"; +@import "max_heights"; +@import "max_widths"; +@import "min_heights"; +@import "min_widths"; +@import "normalize"; +@import "opacity"; +@import "overflow"; +@import "position"; +@import "skins"; +@import "spacing"; +@import "squares"; +@import "text_decoration"; +@import "text_align"; +@import "text_overflow"; +@import "text_transform"; +@import "type_scale"; +@import "utilities"; +@import "vertical_align"; +@import "visibility"; +@import "white_space"; +@import "widths"; +@import "word_spacing";