/* Row & B */
.r              { display: flex; flex-wrap: wrap; margin-left: -2rem; margin-right: -2rem; }
.b              { width: 100%; max-width: 1500px; margin-left: auto; margin-right: auto; }

.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col-pad { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; }
.col-1    { flex: 0 0 8.333%;  max-width: 8.333%;  }
.col-2    { flex: 0 0 16.666%; max-width: 16.666%; }
.col-3    { flex: 0 0 25%;     max-width: 25%;     }
.col-4    { flex: 0 0 33.333%; max-width: 33.333%; }
.col-5    { flex: 0 0 41.666%; max-width: 41.666%; }
.col-6    { flex: 0 0 50%;     max-width: 50%;     }
.col-7    { flex: 0 0 58.333%; max-width: 58.333%; }
.col-8    { flex: 0 0 66.666%; max-width: 66.666%; }
.col-9    { flex: 0 0 75%;     max-width: 75%;     }
.col-10   { flex: 0 0 83.333%; max-width: 83.333%; }
.col-11   { flex: 0 0 91.666%; max-width: 91.666%; }
.col-12   { flex: 0 0 100%;    max-width: 100%;    }

.no-col-pad { padding-left: 0 !important; padding-right: 0 !important; }

.flx      { display: flex; }
.flx-jc   { justify-content: center; }
.flx-js   { justify-content: flex-start; }
.flx-je   { justify-content: flex-end; }
.flx-jsb  { justify-content: space-between; }
.flx-as   { align-items: flex-start; }
.flx-ac   { align-items: center; }
.flx-ae   { align-items: flex-end; }
.flx-ast  { align-items: stretch; }
.flx-dc   { flex-direction: column; }
.flx-dcr  { flex-direction: column-reverse; }
.flx-dr   { flex-direction: row; }
.flx-drr  { flex-direction: row-reverse; }
.flx-ww   { flex-wrap: wrap; }
.flx-nw   { flex-wrap: nowrap; }

.flx-0-auto { flex: 0 0 auto; }
.flx-1-auto { flex: 1 0 auto; }
.flx-1      { flex: 1; }
.flx-2      { flex: 2; }
.flx-shr-0  { flex-shrink: 0; }
.flx-shr-1  { flex-shrink: 1; }
.flx-shr-2  { flex-shrink: 2; }
.flx-shr-3  { flex-shrink: 3; }

.gap-line { gap: 2px; }
.gap-xxs  { gap: .25rem; }
.gap-xs   { gap: .5rem; }
.gap-s    { gap: 1rem; }
.gap-m    { gap: 2rem; }
.gap-l    { gap: 3rem; }
.gap-xl   { gap: 4rem; }

.rgap-xxs { row-gap: .25rem; }
.rgap-xs  { row-gap: .5rem; }
.rgap-s   { row-gap: 1rem; }
.rgap-m   { row-gap: 2rem; }
.rgap-l   { row-gap: 3rem; }
.rgap-xl  { row-gap: 4rem; }
.rgap-xxl { row-gap: 6rem; }

.hide     { display: none !important; }
.show     { display: block; }

.no-padding-top { padding-top: 0 !important; }
.no-padding-bottom { padding-bottom: 0 !important; }

/* MARK: max 680px */
@media (max-width: 680px) {
.only-desktop,
.hide-xs                  { display: none !important; }
.text-center-mobile       { text-align: center; }
.text-right-mobile        { text-align: right; }
.xs-no-col-pad            { padding-left: 0; padding-right: 0; }

.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-pad { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; }
.col-xs-1    { flex: 0 0 8.333%;  max-width: 8.333%;  }
.col-xs-2    { flex: 0 0 16.666%; max-width: 16.666%; }
.col-xs-3    { flex: 0 0 25%;     max-width: 25%;     }
.col-xs-4    { flex: 0 0 33.333%; max-width: 33.333%; }
.col-xs-5    { flex: 0 0 41.666%; max-width: 41.666%; }
.col-xs-6    { flex: 0 0 50%;     max-width: 50%;     }
.col-xs-7    { flex: 0 0 58.333%; max-width: 58.333%; }
.col-xs-8    { flex: 0 0 66.666%; max-width: 66.666%; }
.col-xs-9    { flex: 0 0 75%;     max-width: 75%;     }
.col-xs-10   { flex: 0 0 83.333%; max-width: 83.333%; }
.col-xs-11   { flex: 0 0 91.666%; max-width: 91.666%; }
.col-xs-12   { flex: 0 0 100%;    max-width: 100%;    }

.off-xs-1    { margin-left: 8.333%;  }
.off-xs-2    { margin-left: 16.666%; }
.off-xs-3    { margin-left: 25%;     }
.off-xs-4    { margin-left: 33.333%; }
.off-xs-5    { margin-left: 41.666%; }
.off-xs-6    { margin-left: 50%;     }
.off-xs-7    { margin-left: 58.333%; }
.off-xs-8    { margin-left: 66.666%; }
.off-xs-9    { margin-left: 75%;     }
.off-xs-10   { margin-left: 83.333%; }
.off-xs-11   { margin-left: 91.666%; }

.flx-xs      { display: flex; }
.flx-xs-jc   { justify-content: center; }
.flx-xs-js   { justify-content: flex-start; }
.flx-xs-je   { justify-content: flex-end; }
.flx-xs-jsb  { justify-content: space-between; }
.flx-xs-as   { align-items: flex-start; }
.flx-xs-ac   { align-items: center; }
.flx-xs-ae   { align-items: flex-end; }
.flx-xs-ast  { align-items: stretch; }
.flx-xs-dc   { flex-direction: column; }
.flx-xs-dcr  { flex-direction: column-reverse; }
.flx-xs-dr   { flex-direction: row; }
.flx-xs-drr  { flex-direction: row-reverse; }
.flx-xs-ww   { flex-wrap: wrap; }
.flx-xs-nw   { flex-wrap: nowrap; }

.bleed-xs, .bleed-xs-left   { margin-left: -1.5rem; }
.bleed-xs, .bleed-xs-right  { margin-right: -1.5rem; }
.xs-no-padding-top { padding-top: 0 !important; }
.xs-no-padding-bottom { padding-bottom: 0 !important; }

}

/* MARK: 680px */
@media (min-width: 680px) {
.col-md-1, .col-md-2, .col-md-2-4, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-pad-md { width: 100%; padding-left: 2rem; padding-right: 2rem; }
.col-md-1    { flex: 0 0 8.333%;  max-width: 8.333%;  }
.col-md-2    { flex: 0 0 16.666%; max-width: 16.666%; }
.col-md-2-4  { flex: 0 0 20%;     max-width: 20%; }
.col-md-3    { flex: 0 0 25%;     max-width: 25%;     }
.col-md-4    { flex: 0 0 33.333%; max-width: 33.333%; }
.col-md-5    { flex: 0 0 41.666%; max-width: 41.666%; }
.col-md-6    { flex: 0 0 50%;     max-width: 50%;     }
.col-md-7    { flex: 0 0 58.333%; max-width: 58.333%; }
.col-md-8    { flex: 0 0 66.666%; max-width: 66.666%; }
.col-md-9    { flex: 0 0 75%;     max-width: 75%;     }
.col-md-10   { flex: 0 0 83.333%; max-width: 83.333%; }
.col-md-11   { flex: 0 0 91.666%; max-width: 91.666%; }
.col-md-12   { flex: 0 0 100%;    max-width: 100%;    }
.off-md-0    { margin-left: 0;  }
.off-md-1    { margin-left: 8.333%;  }
.off-md-2    { margin-left: 16.666%; }
.off-md-3    { margin-left: 25%;     }
.off-md-4    { margin-left: 33.333%; }
.off-md-5    { margin-left: 41.666%; }
.off-md-6    { margin-left: 50%;     }
.off-md-7    { margin-left: 58.333%; }
.off-md-8    { margin-left: 66.666%; }
.off-md-9    { margin-left: 75%;     }
.off-md-10   { margin-left: 83.333%; }
.off-md-11   { margin-left: 91.666%; }
.no-col-pad-md { padding-left: 0; padding-right: 0; }
.flx-md      { display: flex; }
.flx-md-jc   { justify-content: center; }
.flx-md-js   { justify-content: flex-start; }
.flx-md-je   { justify-content: flex-end; }
.flx-md-jsb  { justify-content: space-between; }
.flx-md-as   { align-items: flex-start; }
.flx-md-ac   { align-items: center; }
.flx-md-ae   { align-items: flex-end; }
.flx-md-ast  { align-items: stretch; }
.flx-md-dc   { flex-direction: column; }
.flx-md-dcr  { flex-direction: column-reverse; }
.flx-md-dr   { flex-direction: row; }
.flx-md-drr  { flex-direction: row-reverse; }
.flx-md-ww   { flex-wrap: wrap; }
.flx-md-nw   { flex-wrap: nowrap; }
.flx-md-0-auto { flex: 0 0 auto; }
.flx-md-1-auto { flex: 1 0 auto; }
.flx-md-2-auto { flex: 2 0 auto; }
.flx-md-1      { flex: 1; }
.flx-md-2      { flex: 2; }
.flx-md-shr-0 { flex-shrink: 0; }
.flx-md-shr-1 { flex-shrink: 1; }
.flx-md-shr-2 { flex-shrink: 2; }
.flx-md-shr-3 { flex-shrink: 3; }
.gap-md-line { gap: 2px; }
.gap-md-xxs  { gap: .25rem; }
.gap-md-xs   { gap: .5rem; }
.gap-md-s    { gap: 1rem; }
.gap-md-m    { gap: 2rem; }
.gap-md-l    { gap: 3rem; }
.gap-md-xl   { gap: 4rem; }
.rgap-md-xxs { row-gap: .25rem; }
.rgap-md-xs  { row-gap: .5rem; }
.rgap-md-s   { row-gap: 1rem; }
.rgap-md-m   { row-gap: 2rem; }
.rgap-md-l   { row-gap: 3rem; }
.rgap-md-xl  { row-gap: 4rem; }
.rgap-md-xxl { row-gap: 6rem; }
.only-mobile,
.hide-md     { display: none !important; }
.show-md     { display: block; }
.text-center-desktop { text-align: center; }
.text-right-desktop   { text-align: right; }
.bleed-md, .bleed-md-left        { margin-left: -4rem; }
.bleed-md, .bleed-md-right       { margin-right: -4rem; }
.md-no-padding-top { padding-top: 0 !important; }
.md-no-padding-bottom { padding-bottom: 0 !important; }
.md-col-padding-top { padding-top: 10vh; }
.md-col-padding-bottom { padding-bottom: 10vh; }
}

/* MARK: 1100px */
@media (min-width: 1100px) {
.col-lg-1, .col-lg-2, .col-lg-2-4, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-pad-lg { width: 100%; padding-left: 2rem; padding-right: 2rem; }
.col-lg-1    { flex: 0 0 8.333%;  max-width: 8.333%;  }
.col-lg-2    { flex: 0 0 16.666%; max-width: 16.666%; }
.col-lg-2-4  { flex: 0 0 20%;     max-width: 20%; }
.col-lg-3    { flex: 0 0 25%;     max-width: 25%;     }
.col-lg-4    { flex: 0 0 33.333%; max-width: 33.333%; }
.col-lg-5    { flex: 0 0 41.666%; max-width: 41.666%; }
.col-lg-6    { flex: 0 0 50%;     max-width: 50%;     }
.col-lg-7    { flex: 0 0 58.333%; max-width: 58.333%; }
.col-lg-8    { flex: 0 0 66.666%; max-width: 66.666%; }
.col-lg-9    { flex: 0 0 75%;     max-width: 75%;     }
.col-lg-10   { flex: 0 0 83.333%; max-width: 83.333%; }
.col-lg-11   { flex: 0 0 91.666%; max-width: 91.666%; }
.col-lg-12   { flex: 0 0 100%;    max-width: 100%;    }
.off-lg-0    { margin-left: 0;  }
.off-lg-1    { margin-left: 8.333%;  }
.off-lg-2    { margin-left: 16.666%; }
.off-lg-3    { margin-left: 25%;     }
.off-lg-4    { margin-left: 33.333%; }
.off-lg-5    { margin-left: 41.666%; }
.off-lg-6    { margin-left: 50%;     }
.off-lg-7    { margin-left: 58.333%; }
.off-lg-8    { margin-left: 66.666%; }
.off-lg-9    { margin-left: 75%;     }
.off-lg-10   { margin-left: 83.333%; }
.off-lg-11   { margin-left: 91.666%; }
.no-col-pad-lg { padding-left: 0; padding-right: 0; }
.flx-lg      { display: flex; }
.flx-lg-jc   { justify-content: center; }
.flx-lg-js   { justify-content: flex-start; }
.flx-lg-je   { justify-content: flex-end; }
.flx-lg-jsb  { justify-content: space-between; }
.flx-lg-as   { align-items: flex-start; }
.flx-lg-ac   { align-items: center; }
.flx-lg-ae   { align-items: flex-end; }
.flx-lg-ast  { align-items: stretch; }
.flx-lg-dc   { flex-direction: column; }
.flx-lg-dcr  { flex-direction: column-reverse; }
.flx-lg-dr   { flex-direction: row; }
.flx-lg-drr  { flex-direction: row-reverse; }
.flx-lg-ww   { flex-wrap: wrap; }
.flx-lg-nw   { flex-wrap: nowrap; }
.flx-lg-0-auto { flex: 0 0 auto; }
.flx-lg-1-auto { flex: 1 0 auto; }
.flx-lg-1      { flex: 1; }
.flx-lg-2      { flex: 2; }
.flx-lg-shr-0 { flex-shrink: 0; }
.flx-lg-shr-1 { flex-shrink: 1; }
.flx-lg-shr-2 { flex-shrink: 2; }
.flx-lg-shr-3 { flex-shrink: 3; }
.gap-lg-line { gap: 2px; }
.gap-lg-xxs  { gap: .25rem; }
.gap-lg-xs   { gap: .5rem; }
.gap-lg-s    { gap: 1rem; }
.gap-lg-m    { gap: 2rem; }
.gap-lg-l    { gap: 3rem; }
.gap-lg-xl   { gap: 4rem; }
.rgap-lg-xxs { row-gap: .25rem; }
.rgap-lg-xs  { row-gap: .5rem; }
.rgap-lg-s   { row-gap: 1rem; }
.rgap-lg-m   { row-gap: 2rem; }
.rgap-lg-l   { row-gap: 3rem; }
.rgap-lg-xl  { row-gap: 4rem; }
.rgap-lg-xxl { row-gap: 6rem; }
.hide-desktop,
.hide-lg     { display: none; }
.show-lg     { display: block; }
.t-lg-center { text-align: center; }
.t-lg-start  { text-align: left; }
.t-lg-end    { text-align: right; }
.bleed-lg, .bleed-lg-left        { margin-left: -4rem; }
.bleed-lg, .bleed-lg-right       { margin-right: -4rem; }
.lg-no-padding-top { padding-top: 0 !important; }
.lg-no-padding-bottom { padding-bottom: 0 !important; }
.lg-col-padding-top { padding-top: 10vh; }
.lg-col-padding-bottom { padding-bottom: 10vh; }
}

/* MARK: 1360px */
@media (min-width: 1360px) {
.b           { padding-left: 2rem; padding-right: 2rem; }
.col-xl-1, .col-xl-2, .col-xl-2-4 .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-pad-xl { width: 100%; padding-left: 2rem; padding-right: 2rem; }
.col-xl-1    { flex: 0 0 8.333%;  max-width: 8.333%;  }
.col-xl-2    { flex: 0 0 16.666%; max-width: 16.666%; }
.col-xl-2-4  { flex: 0 0 20%;     max-width: 20%; }
.col-xl-3    { flex: 0 0 25%;     max-width: 25%;     }
.col-xl-4    { flex: 0 0 33.333%; max-width: 33.333%; }
.col-xl-5    { flex: 0 0 41.666%; max-width: 41.666%; }
.col-xl-6    { flex: 0 0 50%;     max-width: 50%;     }
.col-xl-7    { flex: 0 0 58.333%; max-width: 58.333%; }
.col-xl-8    { flex: 0 0 66.666%; max-width: 66.666%; }
.col-xl-9    { flex: 0 0 75%;     max-width: 75%;     }
.col-xl-10   { flex: 0 0 83.333%; max-width: 83.333%; }
.col-xl-11   { flex: 0 0 91.666%; max-width: 91.666%; }
.col-xl-12   { flex: 0 0 100%;    max-width: 100%;    }
.off-xl-0    { margin-left: 0;  }
.off-xl-1    { margin-left: 8.333%;  }
.off-xl-2    { margin-left: 16.666%; }
.off-xl-3    { margin-left: 25%;     }
.off-xl-4    { margin-left: 33.333%; }
.off-xl-5    { margin-left: 41.666%; }
.off-xl-6    { margin-left: 50%;     }
.off-xl-7    { margin-left: 58.333%; }
.off-xl-8    { margin-left: 66.666%; }
.off-xl-9    { margin-left: 75%;     }
.off-xl-10   { margin-left: 83.333%; }
.off-xl-11   { margin-left: 91.666%; }
.no-col-pad-xl { padding-left: 0; padding-right: 0; }
.flx-xl      { display: flex; }
.flx-xl-jc   { justify-content: center; }
.flx-xl-js   { justify-content: flex-start; }
.flx-xl-je   { justify-content: flex-end; }
.flx-xl-jsb  { justify-content: space-between; }
.flx-xl-as   { align-items: flex-start; }
.flx-xl-ac   { align-items: center; }
.flx-xl-ae   { align-items: flex-end; }
.flx-xl-ast  { align-items: stretch; }
.flx-xl-dc   { flex-direction: column; }
.flx-xl-dcr  { flex-direction: column-reverse; }
.flx-xl-dr   { flex-direction: row; }
.flx-xl-drr  { flex-direction: row-reverse; }
.flx-xl-nw   { flex-wrap: nowrap; }
.flx-xl-0-auto { flex: 0 0 auto; }
.flx-xl-1-auto { flex: 1 0 auto; }
.flx-xl-1      { flex: 1; }
.flx-xl-2      { flex: 2; }
.flx-xl-shr-0 { flex-shrink: 0; }
.flx-xl-shr-1 { flex-shrink: 1; }
.flx-xl-shr-2 { flex-shrink: 2; }
.flx-xl-shr-3 { flex-shrink: 3; }
.gap-xl-line { gap: 2px; }
.gap-xl-xxs  { gap: .25rem; }
.gap-xl-xs   { gap: .5rem; }
.gap-xl-s    { gap: 1rem; }
.gap-xl-m    { gap: 2rem; }
.gap-xl-l    { gap: 3rem; }
.gap-xl-xl   { gap: 4rem; }
.rgap-xl-xxs { row-gap: .25rem; }
.rgap-xl-xs  { row-gap: .5rem; }
.rgap-xl-s   { row-gap: 1rem; }
.rgap-xl-m   { row-gap: 2rem; }
.rgap-xl-l   { row-gap: 3rem; }
.rgap-xl-xl  { row-gap: 4rem; }
.rgap-xl-xxl { row-gap: 6rem; }
.show-xl     { display: block; }
.hide-xl     { display: none; }
.t-xl-center { text-align: center; }
.t-xl-start  { text-align: left; }
.t-xl-end    { text-align: right; }
.bleed-xl, .bleed-xl-left        { margin-left: -4rem; }
.bleed-xl, .bleed-xl-right       { margin-right: -4rem; }
.xl-no-padding-top { padding-top: 0 !important; }
.xl-no-padding-bottom { padding-bottom: 0 !important; }
.xl-col-padding-top { padding-top: 10vh; }
.xl-col-padding-bottom { padding-bottom: 10vh; }
.xl-min-height-50vh { min-height: 50vh; }
.s.bg.xl-min-height-50vh { display: flex; align-items: center; }
}

/* MARK: 1500px */
@media (min-width: 1500px) {
  .bleed-xl, .bleed-xl-left, .bleed-xl-left-no-limit  { margin-left: calc(-4rem - (100vw - 1500px) / 2); }
  .bleed-xl, .bleed-xl-right, .bleed-xl-right-no-limit { margin-right: calc(-4rem - (100vw - 1500px) / 2); }
}

/* MARK: 1900px */
@media (min-width: 1900px) {
  .bleed-xl, .bleed-xl-left  { margin-left: calc(-4rem - 400px / 2); }
  .bleed-xl, .bleed-xl-right { margin-right: calc(-4rem - 400px / 2); }
}
