diff --git a/css/i.css b/css/i.css
index ae00dc6..177759b 100644
--- a/css/i.css
+++ b/css/i.css
@@ -1,5861 +1,2830 @@
-/* ==========================================================================
- QUERIES
- ========================================================================== */
-/*
- * Mixing for mobile first queries.
- * Two breakpoints.
- * Use like @include break(medium) {
- * ***Styles***
- * }
- *
- */
-/* ==========================================================================
- COLORS
- ========================================================================== */
+/* ========================================================================== QUERIES ========================================================================== */
+/* Mixing for mobile first queries. Two breakpoints. Use like @include break(medium) { ***Styles*** } */
+/* ========================================================================== COLORS ========================================================================== */
/* variables */
-/* ==========================================================================
- BACKGROUND REPEAT
- ========================================================================== */
-.bg-norep {
- background-repeat: no-repeat; }
+/* ========================================================================== BACKGROUND REPEAT ========================================================================== */
+.bg-norep { background-repeat: no-repeat; }
-.bg-x {
- background-repeat: repeat-x; }
+.bg-x { background-repeat: repeat-x; }
-.bg-y {
- background-repeat: repeat-y; }
+.bg-y { background-repeat: repeat-y; }
-.bg-rep {
- background-repeat: repeat; }
+.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) { .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; } }
+/* ========================================================================== BACKGROUND SIZE ========================================================================== */
+.bg-cv { -webkit-background-size: cover; background-size: cover; }
-@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; } }
+.bg-cn { -webkit-background-size: contain; background-size: contain; }
-@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-quarter { -webkit-background-size: 25%; background-size: 25%; }
+
+.bg-half { -webkit-background-size: 50%; background-size: 50%; }
+
+.bg-three-quarters { -webkit-background-size: 75%; background-size: 75%; }
+
+.bg-full { -webkit-background-size: 100%; background-size: 100%; }
+
+.bg-auto { -webkit-background-size: auto; background-size: auto; }
+
+@media screen and (min-width: 48em) { .bg-cv-ns { -webkit-background-size: cover; background-size: cover; }
+ .bg-cn-ns { -webkit-background-size: contain; background-size: contain; }
+ .bg-quarter-ns { -webkit-background-size: 25%; background-size: 25%; }
+ .bg-half-ns { -webkit-background-size: 50%; background-size: 50%; }
+ .bg-three-quarters-ns { -webkit-background-size: 75%; background-size: 75%; }
+ .bg-full-ns { -webkit-background-size: 100%; background-size: 100%; }
+ .bg-auto-ns { -webkit-background-size: auto; background-size: auto; } }
+@media screen and (min-width: 48em) and (max-width: 64em) { .bg-cv-m { -webkit-background-size: cover; background-size: cover; }
+ .bg-cn-m { -webkit-background-size: contain; background-size: contain; }
+ .bg-quarter-m { -webkit-background-size: 25%; background-size: 25%; }
+ .bg-half-m { -webkit-background-size: 50%; background-size: 50%; }
+ .bg-three-quarters-m { -webkit-background-size: 75%; background-size: 75%; }
+ .bg-full-m { -webkit-background-size: 100%; background-size: 100%; }
+ .bg-auto-m { -webkit-background-size: auto; background-size: auto; } }
+@media screen and (min-width: 64em) { .bg-cv-l { -webkit-background-size: cover; background-size: cover; }
+ .bg-cn-l { -webkit-background-size: contain; background-size: contain; }
+ .bg-quarter-l { -webkit-background-size: 25%; background-size: 25%; }
+ .bg-half-l { -webkit-background-size: 50%; background-size: 50%; }
+ .bg-three-quarters-l { -webkit-background-size: 75%; background-size: 75%; }
+ .bg-full-l { -webkit-background-size: 100%; background-size: 100%; }
+ .bg-auto-l { -webkit-background-size: auto; background-size: auto; } }
+/* ========================================================================== BORDER COLORS ========================================================================== */
+.black { border-color: black; }
+
+.near-black { border-color: #111111; }
+
+.dark-gray { border-color: #333333; }
+
+.mid-gray { border-color: #666666; }
+
+.gray { border-color: #888888; }
+
+.silver { border-color: #999999; }
+
+.light-silver { border-color: #aaaaaa; }
+
+.light-gray { border-color: #cccccc; }
+
+.near-white { border-color: #eeeeee; }
+
+.white { border-color: white; }
+
+.aqua { border-color: #7fdbff; }
+
+.blue { border-color: #0074d9; }
+
+.navy { border-color: #001f3f; }
+
+.teal { border-color: #39cccc; }
+
+.green { border-color: #2ecc40; }
+
+.olive { border-color: #3d9970; }
+
+.lime { border-color: #01ff70; }
+
+.yellow { border-color: #ffdc00; }
+
+.orange { border-color: #ff851b; }
+
+.red { border-color: #ff4136; }
+
+.fuchsia { border-color: #f012be; }
+
+.purple { border-color: #b10dc9; }
+
+.maroon { border-color: #85144b; }
+
+/* ========================================================================== 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%; }
+
+@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%; } }
+/* ========================================================================== 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; }
+
+/* ========================================================================== 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; }
+
+/* ========================================================================== 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; }
+
+@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; } }
+/* ========================================================================== 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; }
+
+/* ========================================================================== DIMENSION UTILITIES ========================================================================== */
+.auto-wrap { display: block; width: auto !important; }
+
+.auto-fill { display: block; overflow: hidden; width: auto !important; }
+
+.dbf { display: block; width: 100%; }
/* ==========================================================================
- BACKGROUND SIZE
- ========================================================================== */
-.bg-cv {
- -webkit-background-size: cover;
- background-size: cover; }
-
-.bg-cn {
- -webkit-background-size: contain;
- background-size: contain; }
-
-.bg-quarter {
- -webkit-background-size: 25%;
- background-size: 25%; }
-
-.bg-half {
- -webkit-background-size: 50%;
- background-size: 50%; }
-
-.bg-three-quarters {
- -webkit-background-size: 75%;
- background-size: 75%; }
-
-.bg-full {
- -webkit-background-size: 100%;
- background-size: 100%; }
-
-.bg-auto {
- -webkit-background-size: auto;
- background-size: auto; }
-
-@media screen and (min-width: 48em) {
- .bg-cv-ns {
- -webkit-background-size: cover;
- background-size: cover; }
- .bg-cn-ns {
- -webkit-background-size: contain;
- background-size: contain; }
- .bg-quarter-ns {
- -webkit-background-size: 25%;
- background-size: 25%; }
- .bg-half-ns {
- -webkit-background-size: 50%;
- background-size: 50%; }
- .bg-three-quarters-ns {
- -webkit-background-size: 75%;
- background-size: 75%; }
- .bg-full-ns {
- -webkit-background-size: 100%;
- background-size: 100%; }
- .bg-auto-ns {
- -webkit-background-size: auto;
- background-size: auto; } }
-
-@media screen and (min-width: 48em) and (max-width: 64em) {
- .bg-cv-m {
- -webkit-background-size: cover;
- background-size: cover; }
- .bg-cn-m {
- -webkit-background-size: contain;
- background-size: contain; }
- .bg-quarter-m {
- -webkit-background-size: 25%;
- background-size: 25%; }
- .bg-half-m {
- -webkit-background-size: 50%;
- background-size: 50%; }
- .bg-three-quarters-m {
- -webkit-background-size: 75%;
- background-size: 75%; }
- .bg-full-m {
- -webkit-background-size: 100%;
- background-size: 100%; }
- .bg-auto-m {
- -webkit-background-size: auto;
- background-size: auto; } }
-
-@media screen and (min-width: 64em) {
- .bg-cv-l {
- -webkit-background-size: cover;
- background-size: cover; }
- .bg-cn-l {
- -webkit-background-size: contain;
- background-size: contain; }
- .bg-quarter-l {
- -webkit-background-size: 25%;
- background-size: 25%; }
- .bg-half-l {
- -webkit-background-size: 50%;
- background-size: 50%; }
- .bg-three-quarters-l {
- -webkit-background-size: 75%;
- background-size: 75%; }
- .bg-full-l {
- -webkit-background-size: 100%;
- background-size: 100%; }
- .bg-auto-l {
- -webkit-background-size: auto;
- background-size: auto; } }
-
-/* ==========================================================================
- BORDER COLORS
- ========================================================================== */
-.black {
- border-color: black; }
-
-.near-black {
- border-color: #111111; }
-
-.dark-gray {
- border-color: #333333; }
-
-.mid-gray {
- border-color: #666666; }
-
-.gray {
- border-color: #888888; }
-
-.silver {
- border-color: #999999; }
-
-.light-silver {
- border-color: #aaaaaa; }
-
-.light-gray {
- border-color: #cccccc; }
-
-.near-white {
- border-color: #eeeeee; }
-
-.white {
- border-color: white; }
-
-.aqua {
- border-color: #7fdbff; }
-
-.blue {
- border-color: #0074d9; }
-
-.navy {
- border-color: #001f3f; }
-
-.teal {
- border-color: #39cccc; }
-
-.green {
- border-color: #2ecc40; }
-
-.olive {
- border-color: #3d9970; }
-
-.lime {
- border-color: #01ff70; }
-
-.yellow {
- border-color: #ffdc00; }
-
-.orange {
- border-color: #ff851b; }
-
-.red {
- border-color: #ff4136; }
-
-.fuchsia {
- border-color: #f012be; }
-
-.purple {
- border-color: #b10dc9; }
-
-.maroon {
- border-color: #85144b; }
-
-/* ==========================================================================
- BORDER RADIUS
- ========================================================================== */
-.brn {
- border-radius: 0; }
-
-.br {
- border-radius: 0.125rem; }
-
-.br2 {
- border-radius: 0.25rem; }
-
-.br3 {
- border-radius: 0.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: 0.125rem; }
- .br2-ns {
- border-radius: 0.25rem; }
- .br3-ns {
- border-radius: 0.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: 0.125rem; }
- .br2-m {
- border-radius: 0.25rem; }
- .br3-m {
- border-radius: 0.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: 0.125rem; }
- .br2-l {
- border-radius: 0.25rem; }
- .br3-l {
- border-radius: 0.5rem; }
- .br4-l {
- border-radius: 1rem; }
- .br5-l {
- border-radius: 2rem; }
- .br-circ-l {
- border-radius: 9999px; }
- .br-100-l {
- border-radius: 100%; } }
-
-/* ==========================================================================
- 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; }
-
-/* ==========================================================================
- 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: 0.125rem; }
-
-.baw2 {
- border-width: 0.25rem; }
-
-.baw3 {
- border-width: 0.5rem; }
-
-.baw4 {
- border-width: 0.75rem; }
-
-.baw5 {
- border-width: 1rem; }
-
-/* ==========================================================================
- 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; }
-
-@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; } }
-
-/* ==========================================================================
- 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; }
-
-/* ==========================================================================
- DIMENSION UTILITIES
- ========================================================================== */
-.auto-wrap {
- display: block;
- width: auto !important; }
-
-.auto-fill {
- display: block;
- overflow: hidden;
- width: auto !important; }
-
-.dbf {
- display: block;
- width: 100%; }
-
-/* ==========================================================================
-
- 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: -webkit-box;
- display: -webkit-flex;
- display: -moz-box;
- display: -ms-flexbox;
- display: flex; }
-
-.dif {
- display: -webkit-inline-flex;
- display: -ms-inline-flexbox;
- 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: -webkit-box;
- display: -webkit-flex;
- display: -moz-box;
- display: -ms-flexbox;
- display: flex; }
- .dif-ns {
- display: -webkit-inline-flex;
- display: -ms-inline-flexbox;
- 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: -webkit-box;
- display: -webkit-flex;
- display: -moz-box;
- display: -ms-flexbox;
- display: flex; }
- .dif-m {
- display: -webkit-inline-flex;
- display: -ms-inline-flexbox;
- 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: -webkit-box;
- display: -webkit-flex;
- display: -moz-box;
- display: -ms-flexbox;
- display: flex; }
- .dif-l {
- display: -webkit-inline-flex;
- display: -ms-inline-flexbox;
- display: inline-flex; }
- .dg-l {
- display: grid; }
- .dig-l {
- display: inline-grid; }
- .dri-l {
- display: run-in; } }
-
-/* ==========================================================================
- FLOATS
- ========================================================================== */
-.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; } }
-
+ 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: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; }
+
+.dif { display: -webkit-inline-flex; display: -ms-inline-flexbox; 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: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; }
+ .dif-ns { display: -webkit-inline-flex; display: -ms-inline-flexbox; 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: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; }
+ .dif-m { display: -webkit-inline-flex; display: -ms-inline-flexbox; 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: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; }
+ .dif-l { display: -webkit-inline-flex; display: -ms-inline-flexbox; display: inline-flex; }
+ .dg-l { display: grid; }
+ .dig-l { display: inline-grid; }
+ .dri-l { display: run-in; } }
+/* ========================================================================== FLOATS ========================================================================== */
+.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; } }
/* Font Family Groups */
-.serif {
- font-family: georgia, serif; }
+.serif { font-family: georgia, serif; }
-.sans-serif {
- font-family: avenir, 'avenir next', helvetica, arial, sans-serif; }
+.sans-serif { font-family: avenir, 'avenir next', helvetica, arial, sans-serif; }
-.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-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-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-mono-l {
- font-family: monospace; } }
+.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-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-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-mono-l { font-family: monospace; } }
/* Font Style */
-.fsn {
- font-style: normal; }
+.fsn { font-style: normal; }
-.i {
- font-style: italic; }
+.i { font-style: italic; }
-/* ==========================================================================
- FONT WEIGHT
- ========================================================================== */
-.fwn {
- font-weight: normal; }
+/* ========================================================================== FONT WEIGHT ========================================================================== */
+.fwn { font-weight: normal; }
-.b {
- font-weight: bold; }
+.b { font-weight: bold; }
-.fw-light {
- font-weight: lighter; }
+.fw-light { font-weight: lighter; }
-.fw-bolder {
- font-weight: bolder; }
+.fw-bolder { font-weight: bolder; }
-.fw1 {
- font-weight: 100; }
+.fw1 { font-weight: 100; }
-.fw2 {
- font-weight: 200; }
+.fw2 { font-weight: 200; }
-.fw3 {
- font-weight: 300; }
+.fw3 { font-weight: 300; }
-.fw4 {
- font-weight: 400; }
+.fw4 { font-weight: 400; }
-.fw5 {
- font-weight: 500; }
+.fw5 { font-weight: 500; }
-.fw6 {
- font-weight: 600; }
+.fw6 { font-weight: 600; }
-.fw7 {
- font-weight: 700; }
+.fw7 { font-weight: 700; }
-.fw8 {
- font-weight: 800; }
+.fw8 { font-weight: 800; }
-.fw9 {
- font-weight: 900; }
+.fw9 { font-weight: 900; }
-@media screen and (min-width: 48em) {
- .fwn-ns {
- font-weight: normal; }
- .b-ns {
- font-weight: bold; }
- .fw-light-ns {
- font-weight: lighter; }
- .fw-bolder-ns {
- font-weight: bolder; }
- .fw1-ns {
- font-weight: 100; }
- .fw2-ns {
- font-weight: 200; }
- .fw3-ns {
- font-weight: 300; }
- .fw4-ns {
- font-weight: 400; }
- .fw5-ns {
- font-weight: 500; }
- .fw6-ns {
- font-weight: 600; }
- .fw7-ns {
- font-weight: 700; }
- .fw8-ns {
- font-weight: 800; }
- .fw9-ns {
- font-weight: 900; } }
+@media screen and (min-width: 48em) { .fwn-ns { font-weight: normal; }
+ .b-ns { font-weight: bold; }
+ .fw-light-ns { font-weight: lighter; }
+ .fw-bolder-ns { font-weight: bolder; }
+ .fw1-ns { font-weight: 100; }
+ .fw2-ns { font-weight: 200; }
+ .fw3-ns { font-weight: 300; }
+ .fw4-ns { font-weight: 400; }
+ .fw5-ns { font-weight: 500; }
+ .fw6-ns { font-weight: 600; }
+ .fw7-ns { font-weight: 700; }
+ .fw8-ns { font-weight: 800; }
+ .fw9-ns { font-weight: 900; } }
+@media screen and (min-width: 48em) and (max-width: 64em) { .fwn-m { font-weight: normal; }
+ .b-m { font-weight: bold; }
+ .fw-light-m { font-weight: lighter; }
+ .fw-bolder-m { font-weight: bolder; }
+ .fw1-m { font-weight: 100; }
+ .fw2-m { font-weight: 200; }
+ .fw3-m { font-weight: 300; }
+ .fw4-m { font-weight: 400; }
+ .fw5-m { font-weight: 500; }
+ .fw6-m { font-weight: 600; }
+ .fw7-m { font-weight: 700; }
+ .fw8-m { font-weight: 800; }
+ .fw9-m { font-weight: 900; } }
+@media screen and (min-width: 64em) { .fwn-l { font-weight: normal; }
+ .b-l { font-weight: bold; }
+ .fw-light-l { font-weight: lighter; }
+ .fw-bolder-l { font-weight: bolder; }
+ .fw1-l { font-weight: 100; }
+ .fw2-l { font-weight: 200; }
+ .fw3-l { font-weight: 300; }
+ .fw4-l { font-weight: 400; }
+ .fw5-l { font-weight: 500; }
+ .fw6-l { font-weight: 600; }
+ .fw7-l { font-weight: 700; }
+ .fw8-l { font-weight: 800; }
+ .fw9-l { font-weight: 900; } }
+/* ========================================================================== HEIGHTS ========================================================================== */
+.hi-10, .tenth { height: 10%; }
-@media screen and (min-width: 48em) and (max-width: 64em) {
- .fwn-m {
- font-weight: normal; }
- .b-m {
- font-weight: bold; }
- .fw-light-m {
- font-weight: lighter; }
- .fw-bolder-m {
- font-weight: bolder; }
- .fw1-m {
- font-weight: 100; }
- .fw2-m {
- font-weight: 200; }
- .fw3-m {
- font-weight: 300; }
- .fw4-m {
- font-weight: 400; }
- .fw5-m {
- font-weight: 500; }
- .fw6-m {
- font-weight: 600; }
- .fw7-m {
- font-weight: 700; }
- .fw8-m {
- font-weight: 800; }
- .fw9-m {
- font-weight: 900; } }
+.hi-25, .quarter { height: 25%; }
-@media screen and (min-width: 64em) {
- .fwn-l {
- font-weight: normal; }
- .b-l {
- font-weight: bold; }
- .fw-light-l {
- font-weight: lighter; }
- .fw-bolder-l {
- font-weight: bolder; }
- .fw1-l {
- font-weight: 100; }
- .fw2-l {
- font-weight: 200; }
- .fw3-l {
- font-weight: 300; }
- .fw4-l {
- font-weight: 400; }
- .fw5-l {
- font-weight: 500; }
- .fw6-l {
- font-weight: 600; }
- .fw7-l {
- font-weight: 700; }
- .fw8-l {
- font-weight: 800; }
- .fw9-l {
- font-weight: 900; } }
+.hi-50, .half { height: 50%; }
-@media screen and (min-width: 48em) { }
+.hi-75, .three-quarters { height: 75%; }
-@media screen and (min-width: 48em) and (max-width: 64em) { }
+.hi-100, .full { height: 100%; }
-@media screen and (min-width: 64em) { }
+.ht1 { height: 1rem; }
-/* ==========================================================================
- HEIGHTS
- ========================================================================== */
-.hi-10, .tenth {
- height: 10%; }
+.ht2 { height: 2rem; }
-.hi-25, .quarter {
- height: 25%; }
+.ht3 { height: 4rem; }
-.hi-50, .half {
- height: 50%; }
+.ht4 { height: 8rem; }
-.hi-75, .three-quarters {
- height: 75%; }
+.ht5 { height: 16rem; }
-.hi-100, .full {
- height: 100%; }
+.ht6 { height: 32rem; }
-.ht1 {
- height: 1rem; }
+.ht7 { height: 48rem; }
-.ht2 {
- height: 2rem; }
+.ht8 { height: 64rem; }
-.ht3 {
- height: 4rem; }
+.ht9 { height: 96rem; }
-.ht4 {
- height: 8rem; }
+.ht10 { height: 128rem; }
-.ht5 {
- height: 16rem; }
+.ht-auto { height: auto; }
-.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; } }
-
-/* ==========================================================================
- IMAGES
- ========================================================================== */
+@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; } }
+/* ========================================================================== IMAGES ========================================================================== */
/* Responsive images! */
-img {
- max-width: 100%; }
+img { max-width: 100%; }
-/* ==========================================================================
- LETTER SPACING
- ========================================================================== */
-.tracked {
- letter-spacing: 0.1em; }
+/* ========================================================================== LETTER SPACING ========================================================================== */
+.tracked { letter-spacing: .1em; }
-.tracked-tight {
- letter-spacing: -0.1em; }
+.tracked-tight { letter-spacing: -.1em; }
-.mega-tracked {
- letter-spacing: 0.2em; }
+.mega-tracked { letter-spacing: .2em; }
-@media screen and (min-width: 48em) {
- .tracked-ns {
- letter-spacing: 0.1em; }
- .tracked-tight-ns {
- letter-spacing: -0.1em; }
- .mega-tracked-ns {
- letter-spacing: 0.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; } }
+/* ========================================================================== LINE HEIGHT ========================================================================== */
+.lh { line-height: 1; }
-@media screen and (min-width: 48em) and (max-width: 64em) {
- .tracked-m {
- letter-spacing: 0.1em; }
- .tracked-tight-m {
- letter-spacing: -0.1em; }
- .mega-tracked-m {
- letter-spacing: 0.2em; } }
+.lh-title { line-height: 1.3; }
-@media screen and (min-width: 64em) {
- .tracked-l {
- letter-spacing: 0.1em; }
- .tracked-tight-l {
- letter-spacing: -0.1em; }
- .mega-tracked-l {
- letter-spacing: 0.2em; } }
+.lh-copy { line-height: 1.6; }
-/* ==========================================================================
- LINE HEIGHT
- ========================================================================== */
-.lh {
- line-height: 1; }
+@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; } }
+/* ========================================================================== LINKS ========================================================================== */
+.link { text-decoration: none; }
-.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; } }
-
-/* ==========================================================================
- LINKS
- ========================================================================== */
-.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; } }
-
-/* ==========================================================================
- LISTS
- ========================================================================== */
+@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; } }
+/* ========================================================================== LISTS ========================================================================== */
/* List Style Types */
-.disc {
- list-style-type: disc; }
+.disc { list-style-type: disc; }
-.circle {
- list-style-type: circle; }
+.circle { list-style-type: circle; }
-.square {
- list-style-type: square; }
+.square { list-style-type: square; }
-.decimal {
- list-style-type: decimal; }
+.decimal { list-style-type: decimal; }
/* Horizontal list: can be used on ol or ul */
-.list {
- list-style-type: none; }
-
-.list--h {
- list-style-type: none; }
- .list--h .list-item {
- 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; }
- .list-ns {
- list-style-type: none; }
- .list--h-ns {
- list-style-type: none; }
- .list--h-ns .list-item-ns {
- 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; }
- .list-m {
- list-style: none; }
- .list--h-m {
- list-style-type: none; }
- .list--h-m .list-item {
- 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--h-l {
- list-style-type: none; }
- .list--h-l .list-item {
- display: inline-block; } }
-
-/* ==========================================================================
- 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: -webkit-max-content;
- max-height: -moz-max-content;
- max-height: max-content; }
-
-.mxhi-min {
- max-height: -webkit-min-content;
- max-height: -moz-min-content;
- max-height: min-content; }
-
-.mxhi-fit {
- max-height: -webkit-fit-content;
- max-height: -moz-fit-content;
- max-height: fit-content; }
-
-.mxhi-fill {
- max-height: -webkit-fill-available;
- max-height: -moz-available;
- 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: -webkit-max-content;
- max-height: -moz-max-content;
- max-height: max-content; }
- .mxhi-min-ns {
- max-height: -webkit-min-content;
- max-height: -moz-min-content;
- max-height: min-content; }
- .mxhi-fit-ns {
- max-height: -webkit-fit-content;
- max-height: -moz-fit-content;
- max-height: fit-content; }
- .mxhi-fill-ns {
- max-height: -webkit-fill-available;
- max-height: -moz-available;
- 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: -webkit-max-content;
- max-height: -moz-max-content;
- max-height: max-content; }
- .mxhi-min-m {
- max-height: -webkit-min-content;
- max-height: -moz-min-content;
- max-height: min-content; }
- .mxhi-fit-m {
- max-height: -webkit-fit-content;
- max-height: -moz-fit-content;
- max-height: fit-content; }
- .mxhi-fill-m {
- max-height: -webkit-fill-available;
- max-height: -moz-available;
- 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: -webkit-max-content;
- max-height: -moz-max-content;
- max-height: max-content; }
- .mxhi-min-l {
- max-height: -webkit-min-content;
- max-height: -moz-min-content;
- max-height: min-content; }
- .mxhi-fit-l {
- max-height: -webkit-fit-content;
- max-height: -moz-fit-content;
- max-height: fit-content; }
- .mxhi-fill-l {
- max-height: -webkit-fill-available;
- max-height: -moz-available;
- max-height: fill-available; } }
-
-/* ==========================================================================
- 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: -webkit-max-content;
- max-width: -moz-max-content;
- max-width: max-content; }
-
-.mx-wi-min {
- max-width: -webkit-min-content;
- max-width: -moz-min-content;
- max-width: min-content; }
-
-.mx-wi-fit {
- max-width: -webkit-fit-content;
- max-width: -moz-fit-content;
- max-width: fit-content; }
-
-.mx-wi-fill {
- max-width: -webkit-fill-available;
- max-width: -moz-available;
- 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: -webkit-max-content;
- max-width: -moz-max-content;
- max-width: max-content; }
- .mx-wi-min-ns {
- max-width: -webkit-min-content;
- max-width: -moz-min-content;
- max-width: min-content; }
- .mx-wi-fit-ns {
- max-width: -webkit-fit-content;
- max-width: -moz-fit-content;
- max-width: fit-content; }
- .mx-wi-fill-ns {
- max-width: -webkit-fill-available;
- max-width: -moz-available;
- 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: -webkit-max-content;
- max-width: -moz-max-content;
- max-width: max-content; }
- .mx-wi-min-m {
- max-width: -webkit-min-content;
- max-width: -moz-min-content;
- max-width: min-content; }
- .mx-wi-fit-m {
- max-width: -webkit-fit-content;
- max-width: -moz-fit-content;
- max-width: fit-content; }
- .mx-wi-fill-m {
- max-width: -webkit-fill-available;
- max-width: -moz-available;
- 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: -webkit-max-content;
- max-width: -moz-max-content;
- max-width: max-content; }
- .mx-wi-min-l {
- max-width: -webkit-min-content;
- max-width: -moz-min-content;
- max-width: min-content; }
- .mx-wi-fit-l {
- max-width: -webkit-fit-content;
- max-width: -moz-fit-content;
- max-width: fit-content; }
- .mx-wi-fill-l {
- max-width: -webkit-fill-available;
- max-width: -moz-available;
- max-width: fill-available; } }
-
-/* ==========================================================================
- 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: -webkit-max-content;
- min-height: -moz-max-content;
- min-height: max-content; }
-
-.mn-hi-min {
- min-height: -webkit-min-content;
- min-height: -moz-min-content;
- min-height: min-content; }
-
-.mn-hi-fit {
- min-height: -webkit-fit-content;
- min-height: -moz-fit-content;
- min-height: fit-content; }
-
-.mn-hi-fill {
- min-height: -webkit-fill-available;
- min-height: -moz-available;
- 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: -webkit-max-content;
- min-height: -moz-max-content;
- min-height: max-content; }
- .mn-hi-min-ns {
- min-height: -webkit-min-content;
- min-height: -moz-min-content;
- min-height: min-content; }
- .mn-hi-fit-ns {
- min-height: -webkit-fit-content;
- min-height: -moz-fit-content;
- min-height: fit-content; }
- .mn-hi-fill-ns {
- min-height: -webkit-fill-available;
- min-height: -moz-available;
- 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: -webkit-max-content;
- min-height: -moz-max-content;
- min-height: max-content; }
- .mn-hi-min-m {
- min-height: -webkit-min-content;
- min-height: -moz-min-content;
- min-height: min-content; }
- .mn-hi-fit-m {
- min-height: -webkit-fit-content;
- min-height: -moz-fit-content;
- min-height: fit-content; }
- .mn-hi-fill-m {
- min-height: -webkit-fill-available;
- min-height: -moz-available;
- 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: -webkit-max-content;
- min-height: -moz-max-content;
- min-height: max-content; }
- .mn-hi-min-l {
- min-height: -webkit-min-content;
- min-height: -moz-min-content;
- min-height: min-content; }
- .mn-hi-fit-l {
- min-height: -webkit-fit-content;
- min-height: -moz-fit-content;
- min-height: fit-content; }
- .mn-hi-fill-l {
- min-height: -webkit-fill-available;
- min-height: -moz-available;
- min-height: fill-available; } }
-
-/* ==========================================================================
- 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%; }
+.list { list-style-type: none; }
+
+.list--h { list-style-type: none; }
+.list--h .list-item { 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; }
+ .list-ns { list-style-type: none; }
+ .list--h-ns { list-style-type: none; }
+ .list--h-ns .list-item-ns { 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; }
+ .list-m { list-style: none; }
+ .list--h-m { list-style-type: none; }
+ .list--h-m .list-item { 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--h-l { list-style-type: none; }
+ .list--h-l .list-item { display: inline-block; } }
+/* ========================================================================== 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: -webkit-max-content; max-height: -moz-max-content; max-height: max-content; }
+
+.mxhi-min { max-height: -webkit-min-content; max-height: -moz-min-content; max-height: min-content; }
+
+.mxhi-fit { max-height: -webkit-fit-content; max-height: -moz-fit-content; max-height: fit-content; }
+
+.mxhi-fill { max-height: -webkit-fill-available; max-height: -moz-available; 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: -webkit-max-content; max-height: -moz-max-content; max-height: max-content; }
+ .mxhi-min-ns { max-height: -webkit-min-content; max-height: -moz-min-content; max-height: min-content; }
+ .mxhi-fit-ns { max-height: -webkit-fit-content; max-height: -moz-fit-content; max-height: fit-content; }
+ .mxhi-fill-ns { max-height: -webkit-fill-available; max-height: -moz-available; 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: -webkit-max-content; max-height: -moz-max-content; max-height: max-content; }
+ .mxhi-min-m { max-height: -webkit-min-content; max-height: -moz-min-content; max-height: min-content; }
+ .mxhi-fit-m { max-height: -webkit-fit-content; max-height: -moz-fit-content; max-height: fit-content; }
+ .mxhi-fill-m { max-height: -webkit-fill-available; max-height: -moz-available; 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: -webkit-max-content; max-height: -moz-max-content; max-height: max-content; }
+ .mxhi-min-l { max-height: -webkit-min-content; max-height: -moz-min-content; max-height: min-content; }
+ .mxhi-fit-l { max-height: -webkit-fit-content; max-height: -moz-fit-content; max-height: fit-content; }
+ .mxhi-fill-l { max-height: -webkit-fill-available; max-height: -moz-available; max-height: fill-available; } }
+/* ========================================================================== 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: -webkit-max-content; max-width: -moz-max-content; max-width: max-content; }
+
+.mx-wi-min { max-width: -webkit-min-content; max-width: -moz-min-content; max-width: min-content; }
+
+.mx-wi-fit { max-width: -webkit-fit-content; max-width: -moz-fit-content; max-width: fit-content; }
+
+.mx-wi-fill { max-width: -webkit-fill-available; max-width: -moz-available; 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: -webkit-max-content; max-width: -moz-max-content; max-width: max-content; }
+ .mx-wi-min-ns { max-width: -webkit-min-content; max-width: -moz-min-content; max-width: min-content; }
+ .mx-wi-fit-ns { max-width: -webkit-fit-content; max-width: -moz-fit-content; max-width: fit-content; }
+ .mx-wi-fill-ns { max-width: -webkit-fill-available; max-width: -moz-available; 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: -webkit-max-content; max-width: -moz-max-content; max-width: max-content; }
+ .mx-wi-min-m { max-width: -webkit-min-content; max-width: -moz-min-content; max-width: min-content; }
+ .mx-wi-fit-m { max-width: -webkit-fit-content; max-width: -moz-fit-content; max-width: fit-content; }
+ .mx-wi-fill-m { max-width: -webkit-fill-available; max-width: -moz-available; 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: -webkit-max-content; max-width: -moz-max-content; max-width: max-content; }
+ .mx-wi-min-l { max-width: -webkit-min-content; max-width: -moz-min-content; max-width: min-content; }
+ .mx-wi-fit-l { max-width: -webkit-fit-content; max-width: -moz-fit-content; max-width: fit-content; }
+ .mx-wi-fill-l { max-width: -webkit-fill-available; max-width: -moz-available; max-width: fill-available; } }
+/* ========================================================================== 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: -webkit-max-content; min-height: -moz-max-content; min-height: max-content; }
+
+.mn-hi-min { min-height: -webkit-min-content; min-height: -moz-min-content; min-height: min-content; }
+
+.mn-hi-fit { min-height: -webkit-fit-content; min-height: -moz-fit-content; min-height: fit-content; }
+
+.mn-hi-fill { min-height: -webkit-fill-available; min-height: -moz-available; 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: -webkit-max-content; min-height: -moz-max-content; min-height: max-content; }
+ .mn-hi-min-ns { min-height: -webkit-min-content; min-height: -moz-min-content; min-height: min-content; }
+ .mn-hi-fit-ns { min-height: -webkit-fit-content; min-height: -moz-fit-content; min-height: fit-content; }
+ .mn-hi-fill-ns { min-height: -webkit-fill-available; min-height: -moz-available; 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: -webkit-max-content; min-height: -moz-max-content; min-height: max-content; }
+ .mn-hi-min-m { min-height: -webkit-min-content; min-height: -moz-min-content; min-height: min-content; }
+ .mn-hi-fit-m { min-height: -webkit-fit-content; min-height: -moz-fit-content; min-height: fit-content; }
+ .mn-hi-fill-m { min-height: -webkit-fill-available; min-height: -moz-available; 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: -webkit-max-content; min-height: -moz-max-content; min-height: max-content; }
+ .mn-hi-min-l { min-height: -webkit-min-content; min-height: -moz-min-content; min-height: min-content; }
+ .mn-hi-fit-l { min-height: -webkit-fit-content; min-height: -moz-fit-content; min-height: fit-content; }
+ .mn-hi-fill-l { min-height: -webkit-fill-available; min-height: -moz-available; min-height: fill-available; } }
+/* ========================================================================== MIN WIDTHS ========================================================================== */
+.mn-wi-1 { min-width: 1%; }
-.mn-wi-16 {
- min-width: 16%; }
+.mn-wi-2 { min-width: 2%; }
-.mn-wi-17 {
- min-width: 17%; }
+.mn-wi-3 { min-width: 3%; }
-.mn-wi-18 {
- min-width: 18%; }
+.mn-wi-4 { min-width: 4%; }
-.mn-wi-19 {
- min-width: 19%; }
+.mn-wi-5 { min-width: 5%; }
-.mn-wi-20 {
- min-width: 20%; }
+.mn-wi-6 { min-width: 6%; }
-.mn-wi-21 {
- min-width: 21%; }
+.mn-wi-7 { min-width: 7%; }
-.mn-wi-22 {
- min-width: 22%; }
+.mn-wi-8 { min-width: 8%; }
-.mn-wi-23 {
- min-width: 23%; }
+.mn-wi-9 { min-width: 9%; }
-.mn-wi-24 {
- min-width: 24%; }
+.mn-wi-10 { min-width: 10%; }
-.mn-wi-25 {
- min-width: 25%; }
+.mn-wi-11 { min-width: 11%; }
-.mn-wi-26 {
- min-width: 26%; }
+.mn-wi-12 { min-width: 12%; }
-.mn-wi-27 {
- min-width: 27%; }
+.mn-wi-13 { min-width: 13%; }
-.mn-wi-28 {
- min-width: 28%; }
+.mn-wi-14 { min-width: 14%; }
-.mn-wi-29 {
- min-width: 29%; }
+.mn-wi-15 { min-width: 15%; }
-.mn-wi-30 {
- min-width: 30%; }
+.mn-wi-16 { min-width: 16%; }
-.mn-wi-31 {
- min-width: 31%; }
+.mn-wi-17 { min-width: 17%; }
-.mn-wi-32 {
- min-width: 32%; }
+.mn-wi-18 { min-width: 18%; }
-.mn-wi-33 {
- min-width: 33%; }
+.mn-wi-19 { min-width: 19%; }
-.mn-wi-34 {
- min-width: 34%; }
+.mn-wi-20 { min-width: 20%; }
-.mn-wi-35 {
- min-width: 35%; }
+.mn-wi-21 { min-width: 21%; }
-.mn-wi-36 {
- min-width: 36%; }
+.mn-wi-22 { min-width: 22%; }
-.mn-wi-37 {
- min-width: 37%; }
+.mn-wi-23 { min-width: 23%; }
-.mn-wi-38 {
- min-width: 38%; }
+.mn-wi-24 { min-width: 24%; }
-.mn-wi-39 {
- min-width: 39%; }
+.mn-wi-25 { min-width: 25%; }
-.mn-wi-40 {
- min-width: 40%; }
+.mn-wi-26 { min-width: 26%; }
-.mn-wi-41 {
- min-width: 41%; }
+.mn-wi-27 { min-width: 27%; }
-.mn-wi-42 {
- min-width: 42%; }
+.mn-wi-28 { min-width: 28%; }
-.mn-wi-43 {
- min-width: 43%; }
+.mn-wi-29 { min-width: 29%; }
-.mn-wi-44 {
- min-width: 44%; }
+.mn-wi-30 { min-width: 30%; }
-.mn-wi-45 {
- min-width: 45%; }
+.mn-wi-31 { min-width: 31%; }
-.mn-wi-46 {
- min-width: 46%; }
+.mn-wi-32 { min-width: 32%; }
-.mn-wi-47 {
- min-width: 47%; }
+.mn-wi-33 { min-width: 33%; }
-.mn-wi-48 {
- min-width: 48%; }
+.mn-wi-34 { min-width: 34%; }
-.mn-wi-49 {
- min-width: 49%; }
+.mn-wi-35 { min-width: 35%; }
-.mn-wi-50 {
- min-width: 50%; }
+.mn-wi-36 { min-width: 36%; }
-.mn-wi-51 {
- min-width: 51%; }
+.mn-wi-37 { min-width: 37%; }
-.mn-wi-52 {
- min-width: 52%; }
+.mn-wi-38 { min-width: 38%; }
-.mn-wi-53 {
- min-width: 53%; }
+.mn-wi-39 { min-width: 39%; }
-.mn-wi-54 {
- min-width: 54%; }
+.mn-wi-40 { min-width: 40%; }
-.mn-wi-55 {
- min-width: 55%; }
+.mn-wi-41 { min-width: 41%; }
-.mn-wi-56 {
- min-width: 56%; }
+.mn-wi-42 { min-width: 42%; }
-.mn-wi-57 {
- min-width: 57%; }
+.mn-wi-43 { min-width: 43%; }
-.mn-wi-58 {
- min-width: 58%; }
+.mn-wi-44 { min-width: 44%; }
-.mn-wi-59 {
- min-width: 59%; }
+.mn-wi-45 { min-width: 45%; }
-.mn-wi-60 {
- min-width: 60%; }
+.mn-wi-46 { min-width: 46%; }
-.mn-wi-61 {
- min-width: 61%; }
+.mn-wi-47 { min-width: 47%; }
-.mn-wi-62 {
- min-width: 62%; }
+.mn-wi-48 { min-width: 48%; }
-.mn-wi-63 {
- min-width: 63%; }
+.mn-wi-49 { min-width: 49%; }
-.mn-wi-64 {
- min-width: 64%; }
+.mn-wi-50 { min-width: 50%; }
-.mn-wi-65 {
- min-width: 65%; }
+.mn-wi-51 { min-width: 51%; }
-.mn-wi-66 {
- min-width: 66%; }
+.mn-wi-52 { min-width: 52%; }
-.mn-wi-67 {
- min-width: 67%; }
+.mn-wi-53 { min-width: 53%; }
-.mn-wi-68 {
- min-width: 68%; }
+.mn-wi-54 { min-width: 54%; }
-.mn-wi-69 {
- min-width: 69%; }
+.mn-wi-55 { min-width: 55%; }
-.mn-wi-70 {
- min-width: 70%; }
+.mn-wi-56 { min-width: 56%; }
-.mn-wi-71 {
- min-width: 71%; }
+.mn-wi-57 { min-width: 57%; }
-.mn-wi-72 {
- min-width: 72%; }
+.mn-wi-58 { min-width: 58%; }
-.mn-wi-73 {
- min-width: 73%; }
+.mn-wi-59 { min-width: 59%; }
-.mn-wi-74 {
- min-width: 74%; }
+.mn-wi-60 { min-width: 60%; }
-.mn-wi-75 {
- min-width: 75%; }
+.mn-wi-61 { min-width: 61%; }
-.mn-wi-76 {
- min-width: 76%; }
+.mn-wi-62 { min-width: 62%; }
-.mn-wi-77 {
- min-width: 77%; }
+.mn-wi-63 { min-width: 63%; }
-.mn-wi-78 {
- min-width: 78%; }
+.mn-wi-64 { min-width: 64%; }
-.mn-wi-79 {
- min-width: 79%; }
+.mn-wi-65 { min-width: 65%; }
-.mn-wi-80 {
- min-width: 80%; }
+.mn-wi-66 { min-width: 66%; }
-.mn-wi-81 {
- min-width: 81%; }
+.mn-wi-67 { min-width: 67%; }
-.mn-wi-82 {
- min-width: 82%; }
+.mn-wi-68 { min-width: 68%; }
-.mn-wi-83 {
- min-width: 83%; }
+.mn-wi-69 { min-width: 69%; }
-.mn-wi-84 {
- min-width: 84%; }
+.mn-wi-70 { min-width: 70%; }
-.mn-wi-85 {
- min-width: 85%; }
+.mn-wi-71 { min-width: 71%; }
-.mn-wi-86 {
- min-width: 86%; }
+.mn-wi-72 { min-width: 72%; }
-.mn-wi-87 {
- min-width: 87%; }
+.mn-wi-73 { min-width: 73%; }
-.mn-wi-88 {
- min-width: 88%; }
+.mn-wi-74 { min-width: 74%; }
-.mn-wi-89 {
- min-width: 89%; }
+.mn-wi-75 { min-width: 75%; }
-.mn-wi-90 {
- min-width: 90%; }
+.mn-wi-76 { min-width: 76%; }
-.mn-wi-91 {
- min-width: 91%; }
+.mn-wi-77 { min-width: 77%; }
-.mn-wi-92 {
- min-width: 92%; }
+.mn-wi-78 { min-width: 78%; }
-.mn-wi-93 {
- min-width: 93%; }
+.mn-wi-79 { min-width: 79%; }
-.mn-wi-94 {
- min-width: 94%; }
+.mn-wi-80 { min-width: 80%; }
-.mn-wi-95 {
- min-width: 95%; }
+.mn-wi-81 { min-width: 81%; }
-.mn-wi-96 {
- min-width: 96%; }
+.mn-wi-82 { min-width: 82%; }
-.mn-wi-97 {
- min-width: 97%; }
+.mn-wi-83 { min-width: 83%; }
-.mn-wi-98 {
- min-width: 98%; }
+.mn-wi-84 { min-width: 84%; }
-.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: -webkit-max-content;
- min-width: -moz-max-content;
- min-width: max-content; }
-
-.mn-wi-min {
- min-width: -webkit-min-content;
- min-width: -moz-min-content;
- min-width: min-content; }
-
-.mn-wi-fit {
- min-width: -webkit-fit-content;
- min-width: -moz-fit-content;
- min-width: fit-content; }
-
-.mn-wi-fill {
- min-width: -webkit-fill-available;
- min-width: -moz-available;
- 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: -webkit-max-content;
- min-width: -moz-max-content;
- min-width: max-content; }
- .mn-wi-min-ns {
- min-width: -webkit-min-content;
- min-width: -moz-min-content;
- min-width: min-content; }
- .mn-wi-fit-ns {
- min-width: -webkit-fit-content;
- min-width: -moz-fit-content;
- min-width: fit-content; }
- .mn-wi-fill-ns {
- min-width: -webkit-fill-available;
- min-width: -moz-available;
- 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: -webkit-max-content;
- min-width: -moz-max-content;
- min-width: max-content; }
- .mn-wi-min-m {
- min-width: -webkit-min-content;
- min-width: -moz-min-content;
- min-width: min-content; }
- .mn-wi-fit-m {
- min-width: -webkit-fit-content;
- min-width: -moz-fit-content;
- min-width: fit-content; }
- .mn-wi-fill-m {
- min-width: -webkit-fill-available;
- min-width: -moz-available;
- 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: -webkit-max-content;
- min-width: -moz-max-content;
- min-width: max-content; }
- .mn-wi-min-l {
- min-width: -webkit-min-content;
- min-width: -moz-min-content;
- min-width: min-content; }
- .mn-wi-fit-l {
- min-width: -webkit-fit-content;
- min-width: -moz-fit-content;
- min-width: fit-content; }
- .mn-wi-fill-l {
- min-width: -webkit-fill-available;
- min-width: -moz-available;
- min-width: fill-available; } }
-
-/*! 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;
- -webkit-box-sizing: content-box;
- box-sizing: content-box;
- height: 0; }
-
-/**
- * Address styling not present in IE 8/9.
- */
-mark {
- background: yellow;
- color: black; }
-
-/**
- * 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 silver;
- 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"], 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"] {
- -webkit-box-sizing: border-box;
- -moz-box-sizing: border-box;
- 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; }
-
-/* ==========================================================================
- OPACITY
- ========================================================================== */
+.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: -webkit-max-content; min-width: -moz-max-content; min-width: max-content; }
+
+.mn-wi-min { min-width: -webkit-min-content; min-width: -moz-min-content; min-width: min-content; }
+
+.mn-wi-fit { min-width: -webkit-fit-content; min-width: -moz-fit-content; min-width: fit-content; }
+
+.mn-wi-fill { min-width: -webkit-fill-available; min-width: -moz-available; 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: -webkit-max-content; min-width: -moz-max-content; min-width: max-content; }
+ .mn-wi-min-ns { min-width: -webkit-min-content; min-width: -moz-min-content; min-width: min-content; }
+ .mn-wi-fit-ns { min-width: -webkit-fit-content; min-width: -moz-fit-content; min-width: fit-content; }
+ .mn-wi-fill-ns { min-width: -webkit-fill-available; min-width: -moz-available; 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: -webkit-max-content; min-width: -moz-max-content; min-width: max-content; }
+ .mn-wi-min-m { min-width: -webkit-min-content; min-width: -moz-min-content; min-width: min-content; }
+ .mn-wi-fit-m { min-width: -webkit-fit-content; min-width: -moz-fit-content; min-width: fit-content; }
+ .mn-wi-fill-m { min-width: -webkit-fill-available; min-width: -moz-available; 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: -webkit-max-content; min-width: -moz-max-content; min-width: max-content; }
+ .mn-wi-min-l { min-width: -webkit-min-content; min-width: -moz-min-content; min-width: min-content; }
+ .mn-wi-fit-l { min-width: -webkit-fit-content; min-width: -moz-fit-content; min-width: fit-content; }
+ .mn-wi-fill-l { min-width: -webkit-fill-available; min-width: -moz-available; min-width: fill-available; } }
+/* 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; -webkit-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"], 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"] { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; 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; }
+
+/* ========================================================================== OPACITY ========================================================================== */
/* Opacity */
-.o-10 {
- opacity: 0.1; }
+.o-10 { opacity: .1; }
-.o-20 {
- opacity: 0.2; }
+.o-20 { opacity: .2; }
-.o-30 {
- opacity: 0.3; }
+.o-30 { opacity: .3; }
-.o-40 {
- opacity: 0.4; }
+.o-40 { opacity: .4; }
-.o-50 {
- opacity: 0.5; }
+.o-50 { opacity: .5; }
-.o-60 {
- opacity: 0.6; }
+.o-60 { opacity: .6; }
-.o-70 {
- opacity: 0.7; }
+.o-70 { opacity: .7; }
-.o-80 {
- opacity: 0.8; }
+.o-80 { opacity: .8; }
-.o-90 {
- opacity: 0.9; }
+.o-90 { opacity: .9; }
-.o-full {
- opacity: 1; }
+.o-full { opacity: 1; }
-@media screen and (min-width: 48em) {
- .o-10-ns {
- opacity: 0.1; }
- .o-20-ns {
- opacity: 0.2; }
- .o-30-ns {
- opacity: 0.3; }
- .o-40-ns {
- opacity: 0.4; }
- .o-50-ns {
- opacity: 0.5; }
- .o-60-ns {
- opacity: 0.6; }
- .o-70-ns {
- opacity: 0.7; }
- .o-80-ns {
- opacity: 0.8; }
- .o-90-ns {
- opacity: 0.9; }
- .o-full-ns {
- 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; } }
+/* ========================================================================== OVERFLOWS ========================================================================== */
+.of-vis { overflow: visible; }
-@media screen and (min-width: 48em) and (max-width: 64em) {
- .o-10-m {
- opacity: 0.1; }
- .o-20-m {
- opacity: 0.2; }
- .o-30-m {
- opacity: 0.3; }
- .o-40-m {
- opacity: 0.4; }
- .o-50-m {
- opacity: 0.5; }
- .o-60-m {
- opacity: 0.6; }
- .o-70-m {
- opacity: 0.7; }
- .o-80-m {
- opacity: 0.8; }
- .o-90-m {
- opacity: 0.9; }
- .o-full-m {
- opacity: 1; } }
+.of-hid { overflow: hidden; }
-@media screen and (min-width: 64em) {
- .o-10-l {
- opacity: 0.1; }
- .o-20-l {
- opacity: 0.2; }
- .o-30-l {
- opacity: 0.3; }
- .o-40-l {
- opacity: 0.4; }
- .o-50-l {
- opacity: 0.5; }
- .o-60-l {
- opacity: 0.6; }
- .o-70-l {
- opacity: 0.7; }
- .o-80-l {
- opacity: 0.8; }
- .o-90-l {
- opacity: 0.9; }
- .o-full-l {
- opacity: 1; } }
+.of-scr { overflow: scroll; }
-/* ==========================================================================
- OVERFLOWS
- ========================================================================== */
-.of-vis {
- overflow: visible; }
+.of-aut { overflow: auto; }
-.of-hid {
- overflow: hidden; }
+@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; } }
+/* ========================================================================== POSITIONING ========================================================================== */
+.pos-stat { position: static; }
-.of-scr {
- overflow: scroll; }
+.pos-rel { position: relative; }
-.of-aut {
- overflow: auto; }
+.pos-abs { position: absolute; }
-@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; } }
-
-/* ==========================================================================
- POSITIONING
- ========================================================================== */
-.pos-stat {
- position: static; }
-
-.pos-rel {
- position: relative; }
-
-.pos-abs {
- position: absolute; }
-
-.pos-fix {
- position: fixed; }
+.pos-fix { position: fixed; }
/* Values */
-.top-0 {
- top: 0; }
+.top-0 { top: 0; }
-.left-0 {
- left: 0; }
+.left-0 { left: 0; }
-.right-0 {
- right: 0; }
+.right-0 { right: 0; }
-.bottom-0 {
- bottom: 0; }
+.bottom-0 { bottom: 0; }
-.top-1 {
- top: 1rem; }
+.top-1 { top: 1rem; }
-.left-1 {
- left: 1rem; }
+.left-1 { left: 1rem; }
-.right-1 {
- right: 1rem; }
+.right-1 { right: 1rem; }
-.bottom-1 {
- bottom: 1rem; }
+.bottom-1 { bottom: 1rem; }
-.top-2 {
- top: 2rem; }
+.top-2 { top: 2rem; }
-.left-2 {
- left: 2rem; }
+.left-2 { left: 2rem; }
-.right-2 {
- right: 2rem; }
+.right-2 { right: 2rem; }
-.bottom-2 {
- bottom: 2rem; }
+.bottom-2 { bottom: 2rem; }
-.top-4 {
- top: 4rem; }
+.top-4 { top: 4rem; }
-.left-4 {
- left: 4rem; }
+.left-4 { left: 4rem; }
-.right-4 {
- right: 4rem; }
+.right-4 { right: 4rem; }
-.bottom-4 {
- bottom: 4rem; }
+.bottom-4 { bottom: 4rem; }
/* Top Percentage based scale */
-.top-10 {
- top: 10%; }
+.top-10 { top: 10%; }
-.top-20 {
- top: 20%; }
+.top-20 { top: 20%; }
-.top-30 {
- top: 30%; }
+.top-30 { top: 30%; }
-.top-40 {
- top: 40%; }
+.top-40 { top: 40%; }
-.top-50 {
- top: 50%; }
+.top-50 { top: 50%; }
-.top-60 {
- top: 60%; }
+.top-60 { top: 60%; }
-.top-70 {
- top: 70%; }
+.top-70 { top: 70%; }
-.top-80 {
- top: 80%; }
+.top-80 { top: 80%; }
-.top-90 {
- top: 90%; }
+.top-90 { top: 90%; }
-.top-100 {
- top: 100%; }
+.top-100 { top: 100%; }
-.top-auto {
- top: auto; }
+.top-auto { top: auto; }
-.top-i {
- top: inherit; }
+.top-i { top: inherit; }
-.center {
- margin: 0 auto; }
+.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; } }
-
-/* ==========================================================================
- SKINS
- ========================================================================== */
+@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; } }
+/* ========================================================================== SKINS ========================================================================== */
/* Grays */
-.blk {
- color: #111111; }
+.blk { color: #111111; }
-.dk-gry {
- color: #333333; }
+.dk-gry { color: #333333; }
-.md-gry {
- color: #666666; }
+.md-gry { color: #666666; }
-.gray {
- color: #888888; }
+.gray { color: #888888; }
-.silver {
- color: #999999; }
+.silver { color: #999999; }
-.lt-slvr {
- color: #aaaaaa; }
+.lt-slvr { color: #aaaaaa; }
-.lt-gry {
- color: #cccccc; }
+.lt-gry { color: #cccccc; }
-.near-wht {
- color: #eeeeee; }
+.near-wht { color: #eeeeee; }
-.wht {
- color: white; }
+.wht { color: white; }
/* Text colors */
-.aqua {
- color: #7fdbff; }
+.aqua { color: #7fdbff; }
-.blue {
- color: #0074d9; }
+.blue { color: #0074d9; }
-.navy {
- color: #001f3f; }
+.navy { color: #001f3f; }
-.teal {
- color: #39cccc; }
+.teal { color: #39cccc; }
-.green {
- color: #2ecc40; }
+.green { color: #2ecc40; }
-.olive {
- color: #3d9970; }
+.olive { color: #3d9970; }
-.lime {
- color: #01ff70; }
+.lime { color: #01ff70; }
-.yellow {
- color: #ffdc00; }
+.yellow { color: #ffdc00; }
-.orange {
- color: #ff851b; }
+.orange { color: #ff851b; }
-.red {
- color: #ff4136; }
+.red { color: #ff4136; }
-.fuchsia {
- color: #f012be; }
+.fuchsia { color: #f012be; }
-.purple {
- color: #b10dc9; }
+.purple { color: #b10dc9; }
-.maroon {
- color: #85144b; }
+.maroon { color: #85144b; }
/* Background colors */
-.bg-aqua {
- background-color: #7fdbff; }
+.bg-aqua { background-color: #7fdbff; }
-.bg-blue {
- background-color: #0074d9; }
+.bg-blue { background-color: #0074d9; }
-.bg-navy {
- background-color: #001f3f; }
+.bg-navy { background-color: #001f3f; }
-.bg-teal {
- background-color: #39cccc; }
+.bg-teal { background-color: #39cccc; }
-.bg-green {
- background-color: #2ecc40; }
+.bg-green { background-color: #2ecc40; }
-.bg-olive {
- background-color: #3d9970; }
+.bg-olive { background-color: #3d9970; }
-.bg-lime {
- background-color: #01ff70; }
+.bg-lime { background-color: #01ff70; }
-.bg-yellow {
- background-color: #ffdc00; }
+.bg-yellow { background-color: #ffdc00; }
-.bg-orange {
- background-color: #ff851b; }
+.bg-orange { background-color: #ff851b; }
-.bg-red {
- background-color: #ff4136; }
+.bg-red { background-color: #ff4136; }
-.bg-fuchsia {
- background-color: #f012be; }
+.bg-fuchsia { background-color: #f012be; }
-.bg-purple {
- background-color: #b10dc9; }
+.bg-purple { background-color: #b10dc9; }
-.bg-maroon {
- background-color: #85144b; }
+.bg-maroon { background-color: #85144b; }
-/* ==========================================================================
- SPACING
+/* ========================================================================== 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; }
- An eight step powers of two scale ranging from 0 to 16rem.
+.paxs { padding: .25rem; }
- Legend:
+.pas { padding: .5rem; }
- p = padding
- m = margin
+.pam { padding: 1rem; }
- a = all
- h = horizontal
- v = vertical
- t = top
- r = right
- b = bottom
- l = left
+.pal { padding: 2rem; }
- n = none
- xs = extra small
- s = small
- m = medium
- l = large
- x = extra
- xl = extra large
- xxl = extra extra large
+.pax { padding: 4rem; }
- ========================================================================== */
-.pan {
- padding: 0; }
+.paxl { padding: 8rem; }
-.paxs {
- padding: 0.25rem; }
+.paxxl { padding: 16rem; }
-.pas {
- padding: 0.5rem; }
+.pln { padding-left: 0; }
-.pam {
- padding: 1rem; }
+.plxs { padding-left: .25rem; }
-.pal {
- padding: 2rem; }
+.pls { padding-left: .5rem; }
-.pax {
- padding: 4rem; }
+.plm { padding-left: 1rem; }
-.paxl {
- padding: 8rem; }
+.pll { padding-left: 2rem; }
-.paxxl {
- padding: 16rem; }
+.plx { padding-left: 4rem; }
-.pln {
- padding-left: 0; }
+.plxl { padding-left: 8rem; }
-.plxs {
- padding-left: 0.25rem; }
+.plxxl { padding-left: 16rem; }
-.pls {
- padding-left: 0.5rem; }
+.prn { padding-right: 0; }
-.plm {
- padding-left: 1rem; }
+.prxs { padding-right: .25rem; }
-.pll {
- padding-left: 2rem; }
+.prs { padding-right: .5rem; }
-.plx {
- padding-left: 4rem; }
+.prm { padding-right: 1rem; }
-.plxl {
- padding-left: 8rem; }
+.prl { padding-right: 2rem; }
-.plxxl {
- padding-left: 16rem; }
+.prx { padding-right: 4rem; }
-.prn {
- padding-right: 0; }
+.prxl { padding-right: 8rem; }
-.prxs {
- padding-right: 0.25rem; }
+.prxxl { padding-right: 16rem; }
-.prs {
- padding-right: 0.5rem; }
+.pbn { padding-bottom: 0; }
-.prm {
- padding-right: 1rem; }
+.pbxs { padding-bottom: .25rem; }
-.prl {
- padding-right: 2rem; }
+.pbs { padding-bottom: .5rem; }
-.prx {
- padding-right: 4rem; }
+.pbm { padding-bottom: 1rem; }
-.prxl {
- padding-right: 8rem; }
+.pbl { padding-bottom: 2rem; }
-.prxxl {
- padding-right: 16rem; }
+.pbx { padding-bottom: 4rem; }
-.pbn {
- padding-bottom: 0; }
+.pbxl { padding-bottom: 8rem; }
-.pbxs {
- padding-bottom: 0.25rem; }
+.pbxxl { padding-bottom: 16rem; }
-.pbs {
- padding-bottom: 0.5rem; }
+.ptn { padding-top: 0; }
-.pbm {
- padding-bottom: 1rem; }
+.ptxs { padding-top: .25rem; }
-.pbl {
- padding-bottom: 2rem; }
+.pts { padding-top: .5rem; }
-.pbx {
- padding-bottom: 4rem; }
+.ptm { padding-top: 1rem; }
-.pbxl {
- padding-bottom: 8rem; }
+.ptl { padding-top: 2rem; }
-.pbxxl {
- padding-bottom: 16rem; }
+.ptx { padding-top: 4rem; }
-.ptn {
- padding-top: 0; }
+.ptxl { padding-top: 8rem; }
-.ptxs {
- padding-top: 0.25rem; }
+.ptxxl { padding-top: 16rem; }
-.pts {
- padding-top: 0.5rem; }
+.pvn { padding-top: 0; padding-bottom: 0; }
-.ptm {
- padding-top: 1rem; }
+.pvxs { padding-top: .25rem; padding-bottom: .25rem; }
-.ptl {
- padding-top: 2rem; }
+.pvs { padding-top: .5rem; padding-bottom: .5rem; }
-.ptx {
- padding-top: 4rem; }
+.pvm { padding-top: 1rem; padding-bottom: 1rem; }
-.ptxl {
- padding-top: 8rem; }
+.pvl { padding-top: 2rem; padding-bottom: 2rem; }
-.ptxxl {
- padding-top: 16rem; }
+.pvx { padding-top: 4rem; padding-bottom: 4rem; }
-.pvn {
- padding-top: 0;
- padding-bottom: 0; }
+.pvxl { padding-top: 8rem; padding-bottom: 8rem; }
-.pvxs {
- padding-top: 0.25rem;
- padding-bottom: 0.25rem; }
+.pvxxl { padding-top: 16rem; padding-bottom: 16rem; }
-.pvs {
- padding-top: 0.5rem;
- padding-bottom: 0.5rem; }
+.phn { padding-left: 0; padding-right: 0; }
-.pvm {
- padding-top: 1rem;
- padding-bottom: 1rem; }
+.pvxs { padding-left: .25rem; padding-right: .25rem; }
-.pvl {
- padding-top: 2rem;
- padding-bottom: 2rem; }
+.phs { padding-left: .5rem; padding-right: .5rem; }
-.pvx {
- padding-top: 4rem;
- padding-bottom: 4rem; }
+.phm { padding-left: 1rem; padding-right: 1rem; }
-.pvxl {
- padding-top: 8rem;
- padding-bottom: 8rem; }
+.phl { padding-left: 2rem; padding-right: 2rem; }
-.pvxxl {
- padding-top: 16rem;
- padding-bottom: 16rem; }
+.phx { padding-left: 4rem; padding-right: 4rem; }
-.phn {
- padding-left: 0;
- padding-right: 0; }
+.phxl { padding-left: 8rem; padding-right: 8rem; }
-.pvxs {
- padding-left: 0.25rem;
- padding-right: 0.25rem; }
+.phxxl { padding-left: 16rem; padding-right: 16rem; }
-.phs {
- padding-left: 0.5rem;
- padding-right: 0.5rem; }
+.man { margin: 0; }
-.phm {
- padding-left: 1rem;
- padding-right: 1rem; }
+.maxs { margin: .25rem; }
-.phl {
- padding-left: 2rem;
- padding-right: 2rem; }
+.mas { margin: .5rem; }
-.phx {
- padding-left: 4rem;
- padding-right: 4rem; }
+.mam { margin: 1rem; }
-.phxl {
- padding-left: 8rem;
- padding-right: 8rem; }
+.mal { margin: 2rem; }
-.phxxl {
- padding-left: 16rem;
- padding-right: 16rem; }
+.max { margin: 4rem; }
-.man {
- margin: 0; }
+.maxl { margin: 8rem; }
-.maxs {
- margin: 0.25rem; }
+.maxxl { margin: 16rem; }
-.mas {
- margin: 0.5rem; }
+.mln { margin-left: 0; }
-.mam {
- margin: 1rem; }
+.mlxs { margin-left: .25rem; }
-.mal {
- margin: 2rem; }
+.mls { margin-left: .5rem; }
-.max {
- margin: 4rem; }
+.mlm { margin-left: 1rem; }
-.maxl {
- margin: 8rem; }
+.mll { margin-left: 2rem; }
-.maxxl {
- margin: 16rem; }
+.mlx { margin-left: 4rem; }
-.mln {
- margin-left: 0; }
+.mlxl { margin-left: 8rem; }
-.mlxs {
- margin-left: 0.25rem; }
+.mlxxl { margin-left: 16rem; }
-.mls {
- margin-left: 0.5rem; }
+.mrn { margin-right: 0; }
-.mlm {
- margin-left: 1rem; }
+.mrxs { margin-right: .25rem; }
-.mll {
- margin-left: 2rem; }
+.mrs { margin-right: .5rem; }
-.mlx {
- margin-left: 4rem; }
+.mrm { margin-right: 1rem; }
-.mlxl {
- margin-left: 8rem; }
+.mrl { margin-right: 2rem; }
-.mlxxl {
- margin-left: 16rem; }
+.mrx { margin-right: 4rem; }
-.mrn {
- margin-right: 0; }
+.mrxl { margin-right: 8rem; }
-.mrxs {
- margin-right: 0.25rem; }
+.mrxxl { margin-right: 16rem; }
-.mrs {
- margin-right: 0.5rem; }
+.mbn { margin-bottom: 0; }
-.mrm {
- margin-right: 1rem; }
+.mbxs { margin-bottom: .25rem; }
-.mrl {
- margin-right: 2rem; }
+.mbs { margin-bottom: .5rem; }
-.mrx {
- margin-right: 4rem; }
+.mbm { margin-bottom: 1rem; }
-.mrxl {
- margin-right: 8rem; }
+.mbl { margin-bottom: 2rem; }
-.mrxxl {
- margin-right: 16rem; }
+.mbx { margin-bottom: 4rem; }
-.mbn {
- margin-bottom: 0; }
+.mbxl { margin-bottom: 8rem; }
-.mbxs {
- margin-bottom: 0.25rem; }
+.mbxxl { margin-bottom: 16rem; }
-.mbs {
- margin-bottom: 0.5rem; }
+.mtn { margin-top: 0; }
-.mbm {
- margin-bottom: 1rem; }
+.mtxs { margin-top: .25rem; }
-.mbl {
- margin-bottom: 2rem; }
+.mts { margin-top: .5rem; }
-.mbx {
- margin-bottom: 4rem; }
+.mtm { margin-top: 1rem; }
-.mbxl {
- margin-bottom: 8rem; }
+.mtl { margin-top: 2rem; }
-.mbxxl {
- margin-bottom: 16rem; }
+.mtx { margin-top: 4rem; }
-.mtn {
- margin-top: 0; }
+.mtxl { margin-top: 8rem; }
-.mtxs {
- margin-top: 0.25rem; }
+.mtxxl { margin-top: 16rem; }
-.mts {
- margin-top: 0.5rem; }
+.mvn { margin-top: 0; margin-bottom: 0rem; }
-.mtm {
- margin-top: 1rem; }
+.mvxs { margin-top: .25rem; margin-bottom: .25rem; }
-.mtl {
- margin-top: 2rem; }
+.mvs { margin-top: .5rem; margin-bottom: .5rem; }
-.mtx {
- margin-top: 4rem; }
+.mvm { margin-top: 1rem; margin-bottom: 1rem; }
-.mtxl {
- margin-top: 8rem; }
+.mvl { margin-top: 2rem; margin-bottom: 2rem; }
-.mtxxl {
- margin-top: 16rem; }
-
-.mvn {
- margin-top: 0;
- margin-bottom: 0rem; }
-
-.mvxs {
- margin-top: 0.25rem;
- margin-bottom: 0.25rem; }
-
-.mvs {
- margin-top: 0.5rem;
- margin-bottom: 0.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: 0.5rem;
- margin-right: 0.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: 0.25rem; }
- .pas-ns {
- padding: 0.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: 0.25rem; }
- .pls-ns {
- padding-left: 0.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: 0.25rem; }
- .prs-ns {
- padding-right: 0.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: 0.25rem; }
- .pbs-ns {
- padding-bottom: 0.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: 0.25rem; }
- .pts-ns {
- padding-top: 0.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: 0.25rem;
- padding-bottom: 0.25rem; }
- .pvs-ns {
- padding-top: 0.5rem;
- padding-bottom: 0.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: 0.25rem;
- padding-right: 0.25rem; }
- .phs-ns {
- padding-left: 0.5rem;
- padding-right: 0.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: 0.25rem; }
- .mas-ns {
- margin: 0.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: 0.25rem; }
- .mls-ns {
- margin-left: 0.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: 0.25rem; }
- .mrs-ns {
- margin-right: 0.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: 0.25rem; }
- .mbs-ns {
- margin-bottom: 0.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: 0.25rem; }
- .mts-ns {
- margin-top: 0.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: 0.25rem;
- margin-bottom: 0.25rem; }
- .mvs-ns {
- margin-top: 0.5rem;
- margin-bottom: 0.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: 0.5rem;
- margin-right: 0.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: 0.25rem; }
- .pas-m {
- padding: 0.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: 0.25rem; }
- .pls-m {
- padding-left: 0.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: 0.25rem; }
- .prs-m {
- padding-right: 0.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: 0.25rem; }
- .pbs-m {
- padding-bottom: 0.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: 0.25rem; }
- .pts-m {
- padding-top: 0.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: 0.25rem;
- padding-bottom: 0.25rem; }
- .pvs-m {
- padding-top: 0.5rem;
- padding-bottom: 0.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: 0.25rem;
- padding-right: 0.25rem; }
- .phs-m {
- padding-left: 0.5rem;
- padding-right: 0.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: 0.25rem; }
- .mas-m {
- margin: 0.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: 0.25rem; }
- .mls-m {
- margin-left: 0.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: 0.25rem; }
- .mrs-m {
- margin-right: 0.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: 0.25rem; }
- .mbs-m {
- margin-bottom: 0.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: 0.25rem; }
- .mts-m {
- margin-top: 0.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: 0.25rem;
- margin-bottom: 0.25rem; }
- .mvs-m {
- margin-top: 0.5rem;
- margin-bottom: 0.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: 0.25rem;
- margin-right: 0.25rem; }
- .mhs-m {
- margin-left: 0.5rem;
- margin-right: 0.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: 0.25rem; }
- .pas-l {
- padding: 0.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: 0.25rem; }
- .pls-l {
- padding-left: 0.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: 0.25rem; }
- .prs-l {
- padding-right: 0.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: 0.25rem; }
- .pbs-l {
- padding-bottom: 0.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: 0.25rem; }
- .pts-l {
- padding-top: 0.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: 0.25rem;
- padding-bottom: 0.25rem; }
- .pvs-l {
- padding-top: 0.5rem;
- padding-bottom: 0.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: 0.25rem;
- padding-right: 0.25rem; }
- .phs-l {
- padding-left: 0.5rem;
- padding-right: 0.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: 0.25rem; }
- .mas-l {
- margin: 0.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: 0.25rem; }
- .mls-l {
- margin-left: 0.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: 0.25rem; }
- .mrs-l {
- margin-right: 0.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: 0.25rem; }
- .mbs-l {
- margin-bottom: 0.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: 0.25rem; }
- .mts-l {
- margin-top: 0.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: 0.25rem;
- margin-bottom: 0.25rem; }
- .mvs-l {
- margin-top: 0.5rem;
- margin-bottom: 0.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: 0.25rem;
- margin-right: 0.25rem; }
- .mhs-l {
- margin-left: 0.5rem;
- margin-right: 0.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; } }
-
-/* ==========================================================================
- 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; }
-
-@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; } }
-
-/* ==========================================================================
- TEXT DECORAION
- ========================================================================== */
-.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; } }
+.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; } }
+/* ========================================================================== 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; }
+
+@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; } }
+/* ========================================================================== TEXT DECORAION ========================================================================== */
+.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; } }
/* Text Align */
-.tl {
- text-align: left; }
+.tl { text-align: left; }
-.tr {
- text-align: right; }
+.tr { text-align: right; }
-.tc {
- text-align: center; }
+.tc { text-align: center; }
-@media screen and (min-width: 48em) {
- .tl-ns {
- text-align: left; }
- .tr-ns {
- text-align: right; }
- .tc-ns {
- text-align: center; } }
+@media screen and (min-width: 48em) { .tl-ns { text-align: left; }
+ .tr-ns { text-align: right; }
+ .tc-ns { text-align: center; } }
+@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; } }
+@media screen and (min-width: 64em) { .tl-l { text-align: left; }
+ .tr-l { text-align: right; }
+ .tc-l { text-align: center; } }
+/* ========================================================================== TEXT TRANSFORM ========================================================================== */
+.ttc { text-transform: capitalize; }
-@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; } }
+.ttu { text-transform: uppercase; word-spacing: .2em; }
-@media screen and (min-width: 64em) {
- .tl-l {
- text-align: left; }
- .tr-l {
- text-align: right; }
- .tc-l {
- text-align: center; } }
+.ttl { text-transform: lowercase; }
-/* ==========================================================================
- TEXT TRANSFORM
- ========================================================================== */
-.ttc {
- text-transform: capitalize; }
+.ttn { text-transform: none; }
-.ttu {
- text-transform: uppercase;
- word-spacing: 0.2em; }
+@media screen and (min-width: 48em) { .ttc-ns { text-transform: capitalize; }
+ .ttu-ns { text-transform: uppercase; word-spacing: .2em; }
+ .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; word-spacing: .2em; }
+ .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; word-spacing: .2em; }
+ .ttl-l { text-transform: lowercase; }
+ .ttn-l { text-transform: none; } }
+/* ========================================================================== TYPE SCALE ========================================================================== */
+.f1 { font-size: 2rem; }
-.ttl {
- text-transform: lowercase; }
+.f2 { font-size: 1.5rem; }
-.ttn {
- text-transform: none; }
+.f3 { font-size: 1.2rem; }
-@media screen and (min-width: 48em) {
- .ttc-ns {
- text-transform: capitalize; }
- .ttu-ns {
- text-transform: uppercase;
- word-spacing: 0.2em; }
- .ttl-ns {
- text-transform: lowercase; }
- .ttn-ns {
- text-transform: none; } }
+.f4 { font-size: 1.2rem; }
-@media screen and (min-width: 48em) and (max-width: 64em) {
- .ttc-m {
- text-transform: capitalize; }
- .ttu-m {
- text-transform: uppercase;
- word-spacing: 0.2em; }
- .ttl-m {
- text-transform: lowercase; }
- .ttn-m {
- text-transform: none; } }
+.f5 { font-size: 1rem; }
-@media screen and (min-width: 64em) {
- .ttc-l {
- text-transform: capitalize; }
- .ttu-l {
- text-transform: uppercase;
- word-spacing: 0.2em; }
- .ttl-l {
- text-transform: lowercase; }
- .ttn-l {
- text-transform: none; } }
+.f6, .small { font-size: .85rem; }
-/* ==========================================================================
- TYPE SCALE
- ========================================================================== */
-.f1 {
- font-size: 2rem; }
+@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; } }
+/* ========================================================================== UTILITIES ========================================================================== */
+/* The Media Object Built by @stubornella http://www.stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code/ */
+/* 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%; }
-.f2 {
- font-size: 1.5rem; }
+.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; }
-.f3 {
- font-size: 1.2rem; }
+.flag__image { padding-right: 10px; }
+.flag__image > img { display: block; max-width: none; }
+.flag--rev .flag__image { padding-right: 0; padding-left: 10px; }
-.f4 {
- font-size: 1.2rem; }
+.flag__body { width: 100%; }
-.f5 {
- font-size: 1rem; }
+/* ========================================================================== VERTICAL ALIGN ========================================================================== */
+.v-base { vertical-align: baseline; }
-.f6, .small {
- font-size: 0.85rem; }
+.v-sub { vertical-align: sub; }
-@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: 0.85rem; } }
+.v-sup { vertical-align: super; }
-@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: 0.85rem; } }
+.v-txt-top { vertical-align: text-top; }
-@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; } }
+.v-txt-btm { vertical-align: text-bottom; }
-/* ==========================================================================
- UTILITIES
- ========================================================================== */
-/*
- * The Media Object
- * Built by @stubornella
- * http://www.stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code/
- *
- *
- */
-/*
- * The Flag Object
- * Built by @csswizzrdry
- * http://csswizardry.com/2013/05/the-flag-object/
- *
- *
- * Use to vertically center text against an image.
- *
- *
- *
- *
![]()
- *
- *
- *
