/*
r-c = Responsive Columns

Full details here:
https://matthewjamestaylor.com/responsive-columns
*/

/* Responsive Columns Container */
r-c, [r-c], [data-r-c] {
    display:flex;
    flex-wrap:wrap;
}

/* containers are always auto-width (except for columns that are also containers) */
r-c, [data-r-c] {width:auto !important}

/* Prevent borders and padding from changing the column widths */
r-c, [r-c], [data-r-c], r-c > *, [r-c] > *, [data-r-c] > * {box-sizing:border-box}

/* Gutter Mode (Default) */
r-c, [r-c], [data-r-c] {
    margin:calc(5.455px + 1.42041vw);
    gap:calc(5.455px + 1.42041vw);
}

/* Join Mode (Container) */
[join], [data-join] {
    margin:0;
    gap:0;
}

/* Join Mode (Column) */
[join] > *, [data-join] > * {padding:calc(5.455px + 1.42041vw)}

/* No margin for columns that are also a container */
[r-c] {margin:0}

/* No padding for columns that are also a container */
[r-c][join] {padding:0}

/* Horizontal Column Alignment (Default: left aligned) */
r-c[center], [r-c][center], [data-center] {justify-content:center} /* centered columns */
r-c[right], [r-c][right], [data-right] {justify-content:flex-end} /* right-aligned columns */
r-c[space-between], [r-c][space-between], [data-space-between] {justify-content:space-between} /* space between columns */
r-c[space-evenly], [r-c][space-evenly], [data-space-evenly] {justify-content:space-evenly} /* even space between and either side of columns */

/* Vertical Column Alignment (Default: stretch to equal-heights per row) */
r-c[top], [r-c][top], [data-top] {align-items:flex-start} /* top-aligned columns */
r-c[middle], [r-c][middle], [data-middle] {align-items:center} /* vertically centered columns */
r-c[bottom], [r-c][bottom], [data-bottom] {align-items:flex-end} /* bottom-aligned columns */

/* Extra-Small Breakpoint: */

/*
Specificity on column width selectors (with gutters & column tag version)
Priority order from lowest to highest (higher priority must have higher specificity)

#3: Default column:
(specificity: 0,0,1)    r-c > *,
(specificity: 0,1,0)    [r-c] > *,
(specificity: 0,1,0)    [data-r-c] > * {}

#2: Column tag:
(specificity: 0,1,1)    c1-2:not([x]),
(specificity: 0,1,1)    [c1-2]:not(x),
(specificity: 0,1,1)    [data-c1-2]:not(x) {}

#1: Column width specified on parent tag:
(specificity: 0,1,2)    r-c[c1-2]:not(x) > *,
(specificity: 0,2,0)    [data-r-c][data-c1-2] > * {}

Put it all together and we have:
r-c > *, [r-c] > *, [data-r-c] > *,
c1-2:not([x]), [c1-2]:not(x), [data-c1-2]:not(x), r-c[c1-2]:not(x) > *, [data-r-c][c1-2] > * {}
*/

/* Column Widths */
r-c > *, [r-c] > *, [data-r-c] > *,
c1-1:not([x]), [c1-1]:not(x), [data-c1-2]:not(x), r-c[c1-1]:not(x) > *, [data-r-c][data-c1-1] > * {width:100%}
c1-2:not([x]), [c1-2]:not(x), [data-c1-2]:not(x), r-c[c1-2]:not(x) > *, [data-r-c][data-c1-2] > * {width:calc(50% - (5.455px + 1.42041vw)/2)}
c1-3:not([x]), [c1-3]:not(x), [data-c1-3]:not(x), r-c[c1-3]:not(x) > *, [data-r-c][data-c1-3] > * {width:calc(100%/3 - (5.455px + 1.42041vw)/3*2)}
c2-3:not([x]), [c2-3]:not(x), [data-c2-3]:not(x), r-c[c2-3]:not(x) > *, [data-r-c][data-c2-3] > * {width:calc(100%/3*2 - (5.455px + 1.42041vw)/3)}
c1-4:not([x]), [c1-4]:not(x), [data-c1-4]:not(x), r-c[c1-4]:not(x) > *, [data-r-c][data-c1-4] > * {width:calc(25% - (5.455px + 1.42041vw)/4*3)}
c2-4:not([x]), [c2-4]:not(x), [data-c2-4]:not(x), r-c[c2-4]:not(x) > *, [data-r-c][data-c2-4] > * {width:calc(50% - (5.455px + 1.42041vw)/2)}
c3-4:not([x]), [c3-4]:not(x), [data-c3-4]:not(x), r-c[c3-4]:not(x) > *, [data-r-c][data-c3-4] > * {width:calc(25% - (5.455px + 1.42041vw)/4)}
c1-5:not([x]), [c1-5]:not(x), [data-c1-5]:not(x), r-c[c1-5]:not(x) > *, [data-r-c][data-c1-5] > * {width:calc(100%/5 - (5.455px + 1.42041vw)/5*4)}
c2-5:not([x]), [c2-5]:not(x), [data-c2-5]:not(x), r-c[c2-5]:not(x) > *, [data-r-c][data-c2-5] > * {width:calc(100%/5*2 - (5.455px + 1.42041vw)/5*3)}
c3-5:not([x]), [c3-5]:not(x), [data-c3-5]:not(x), r-c[c3-5]:not(x) > *, [data-r-c][data-c3-5] > * {width:calc(100%/5*3 - (5.455px + 1.42041vw)/5*2)}
c4-5:not([x]), [c4-5]:not(x), [data-c4-5]:not(x), r-c[c4-5]:not(x) > *, [data-r-c][data-c4-5] > * {width:calc(100%/5*4 - (5.455px + 1.42041vw)/5)}
c1-6:not([x]), [c1-6]:not(x), [data-c1-6]:not(x), r-c[c1-6]:not(x) > *, [data-r-c][data-c1-6] > * {width:calc(100%/6 - (5.455px + 1.42041vw)/6*5)}
c2-6:not([x]), [c2-6]:not(x), [data-c2-6]:not(x), r-c[c2-6]:not(x) > *, [data-r-c][data-c2-6] > * {width:calc(100%/6*2 - (5.455px + 1.42041vw)/6*4)}
c3-6:not([x]), [c3-6]:not(x), [data-c3-6]:not(x), r-c[c3-6]:not(x) > *, [data-r-c][data-c3-6] > * {width:calc(50% - (5.455px + 1.42041vw)/2)}
c4-6:not([x]), [c4-6]:not(x), [data-c4-6]:not(x), r-c[c4-6]:not(x) > *, [data-r-c][data-c4-6] > * {width:calc(100%/6*4 - (5.455px + 1.42041vw)/6*2)}
c5-6:not([x]), [c5-6]:not(x), [data-c5-6]:not(x), r-c[c5-6]:not(x) > *, [data-r-c][data-c5-6] > * {width:calc(100%/6*5 - (5.455px + 1.42041vw)/6)}
c1-7:not([x]), [c1-7]:not(x), [data-c1-7]:not(x), r-c[c1-7]:not(x) > *, [data-r-c][data-c1-7] > * {width:calc(100%/7 - (5.455px + 1.42041vw)/7*6)}
c2-7:not([x]), [c2-7]:not(x), [data-c2-7]:not(x), r-c[c2-7]:not(x) > *, [data-r-c][data-c2-7] > * {width:calc(100%/7*2 - (5.455px + 1.42041vw)/7*5)}
c3-7:not([x]), [c3-7]:not(x), [data-c3-7]:not(x), r-c[c3-7]:not(x) > *, [data-r-c][data-c3-7] > * {width:calc(100%/7*3 - (5.455px + 1.42041vw)/7*4)}
c4-7:not([x]), [c4-7]:not(x), [data-c4-7]:not(x), r-c[c4-7]:not(x) > *, [data-r-c][data-c4-7] > * {width:calc(100%/7*4 - (5.455px + 1.42041vw)/7*3)}
c5-7:not([x]), [c5-7]:not(x), [data-c5-7]:not(x), r-c[c5-7]:not(x) > *, [data-r-c][data-c5-7] > * {width:calc(100%/7*5 - (5.455px + 1.42041vw)/7*2)}
c6-7:not([x]), [c6-7]:not(x), [data-c6-7]:not(x), r-c[c6-7]:not(x) > *, [data-r-c][data-c6-7] > * {width:calc(100%/7*6 - (5.455px + 1.42041vw)/7)}
c1-8:not([x]), [c1-8]:not(x), [data-c1-8]:not(x), r-c[c1-8]:not(x) > *, [data-r-c][data-c1-8] > * {width:calc(100%/8 - (5.455px + 1.42041vw)/8*7)}
c2-8:not([x]), [c2-8]:not(x), [data-c2-8]:not(x), r-c[c2-8]:not(x) > *, [data-r-c][data-c2-8] > * {width:calc(100%/8*2 - (5.455px + 1.42041vw)/8*6)}
c3-8:not([x]), [c3-8]:not(x), [data-c3-8]:not(x), r-c[c3-8]:not(x) > *, [data-r-c][data-c3-8] > * {width:calc(100%/8*3 - (5.455px + 1.42041vw)/8*5)}
c4-8:not([x]), [c4-8]:not(x), [data-c4-8]:not(x), r-c[c4-8]:not(x) > *, [data-r-c][data-c4-8] > * {width:calc(50% - (5.455px + 1.42041vw)/2)}
c5-8:not([x]), [c5-8]:not(x), [data-c5-8]:not(x), r-c[c5-8]:not(x) > *, [data-r-c][data-c5-8] > * {width:calc(100%/8*5 - (5.455px + 1.42041vw)/8*3)}
c6-8:not([x]), [c6-8]:not(x), [data-c6-8]:not(x), r-c[c6-8]:not(x) > *, [data-r-c][data-c6-8] > * {width:calc(100%/8*6 - (5.455px + 1.42041vw)/8*2)}
c7-8:not([x]), [c7-8]:not(x), [data-c7-8]:not(x), r-c[c7-8]:not(x) > *, [data-r-c][data-c7-8] > * {width:calc(100%/8*7 - (5.455px + 1.42041vw)/8)}

/*
Specificity on column width selectors (joined & column tag version)
Priority order from lowest to highest (higher priority must have higher specificity)

#3: Default column eg:
(specificity: 0,0,1)    r-c > *,
(specificity: 0,1,0)    [r-c] > *,
(specificity: 0,1,0)    [data-r-c] > * {}

#2: Column tag eg:
(specificity: 0,1,1)    [join] > c1-2,
(specificity: 0,2,0)    [join] > [data-c1-2],
(specificity: 0,1,1)    [data-join] > c1-2,
(specificity: 0,2,0)    [data-join] > [data-c1-2] {}

#1: Column width specified on parent tag:
(specificity: 0,2,1)    [join][c1-2]:not(x) > *,
(specificity: 0,2,1)    [data-join][data-c1-2]:not(x) > * {}

Put it all together and we have:
[join] > c1-2, [join] > [data-c1-2], [data-join] > c1-2, [data-join] > [data-c1-2], [join][c1-2]:not(x) > *, [data-join][data-c1-2]:not(x) > * {}
*/

/* Column Widths (Joined) */
[join] > c1-1, [join] > [data-c1-1], [data-join] > c1-1, [data-join] > [data-c1-1], [join][c1-1]:not(x) > *, [data-join][data-c1-1]:not(x) > * {width:100%}
[join] > c1-2, [join] > [data-c1-2], [data-join] > c1-2, [data-join] > [data-c1-2], [join][c1-2]:not(x) > *, [data-join][data-c1-2]:not(x) > *,
[join] > c2-4, [join] > [data-c2-4], [data-join] > c2-4, [data-join] > [data-c2-4], [join][c2-4]:not(x) > *, [data-join][data-c2-4]:not(x) > *,
[join] > c3-6, [join] > [data-c3-6], [data-join] > c3-6, [data-join] > [data-c3-6], [join][c3-6]:not(x) > *, [data-join][data-c3-6]:not(x) > *,
[join] > c4-8, [join] > [data-c4-8], [data-join] > c4-8, [data-join] > [data-c4-8], [join][c4-8]:not(x) > *, [data-join][data-c4-8]:not(x) > * {width:50%}
[join] > c1-3, [join] > [data-c1-3], [data-join] > c1-3, [data-join] > [data-c1-3], [join][c1-3]:not(x) > *, [data-join][data-c1-3]:not(x) > *,
[join] > c2-6, [join] > [data-c2-6], [data-join] > c2-6, [data-join] > [data-c2-6], [join][c2-6]:not(x) > *, [data-join][data-c2-6]:not(x) > * {width:calc(100%/3)}
[join] > c2-3, [join] > [data-c2-3], [data-join] > c2-3, [data-join] > [data-c2-3], [join][c2-3]:not(x) > *, [data-join][data-c2-3]:not(x) > *,
[join] > c4-6, [join] > [data-c4-6], [data-join] > c4-6, [data-join] > [data-c4-6], [join][c4-6]:not(x) > *, [data-join][data-c4-6]:not(x) > * {width:calc(100%/3*2)}
[join] > c1-4, [join] > [data-c1-4], [data-join] > c1-4, [data-join] > [data-c1-4], [join][c1-4]:not(x) > *, [data-join][data-c1-4]:not(x) > *,
[join] > c2-8, [join] > [data-c2-8], [data-join] > c2-8, [data-join] > [data-c2-8], [join][c2-8]:not(x) > *, [data-join][data-c2-8]:not(x) > * {width:25%}
[join] > c3-4, [join] > [data-c3-4], [data-join] > c3-4, [data-join] > [data-c3-4], [join][c3-4]:not(x) > *, [data-join][data-c3-4]:not(x) > *,
[join] > c6-8, [join] > [data-c6-8], [data-join] > c6-8, [data-join] > [data-c6-8], [join][c6-8]:not(x) > *, [data-join][data-c6-8]:not(x) > * {width:75%}
[join] > c1-5, [join] > [data-c1-5], [data-join] > c1-5, [data-join] > [data-c1-5], [join][c1-5]:not(x) > *, [data-join][data-c1-5]:not(x) > * {width:20%}
[join] > c2-5, [join] > [data-c2-5], [data-join] > c2-5, [data-join] > [data-c2-5], [join][c2-5]:not(x) > *, [data-join][data-c2-5]:not(x) > * {width:40%}
[join] > c3-5, [join] > [data-c3-5], [data-join] > c3-5, [data-join] > [data-c3-5], [join][c3-5]:not(x) > *, [data-join][data-c3-5]:not(x) > * {width:60%}
[join] > c4-5, [join] > [data-c4-5], [data-join] > c4-5, [data-join] > [data-c4-5], [join][c4-5]:not(x) > *, [data-join][data-c4-5]:not(x) > * {width:80%}
[join] > c1-6, [join] > [data-c1-6], [data-join] > c1-6, [data-join] > [data-c1-6], [join][c1-6]:not(x) > *, [data-join][data-c1-6]:not(x) > * {width:calc(100%/6)}
[join] > c5-6, [join] > [data-c5-6], [data-join] > c5-6, [data-join] > [data-c5-6], [join][c5-6]:not(x) > *, [data-join][data-c5-6]:not(x) > * {width:calc(100%/6*5)}
[join] > c1-7, [join] > [data-c1-7], [data-join] > c1-7, [data-join] > [data-c1-7], [join][c1-7]:not(x) > *, [data-join][data-c1-7]:not(x) > * {width:calc(100%/7)}
[join] > c2-7, [join] > [data-c2-7], [data-join] > c2-7, [data-join] > [data-c2-7], [join][c2-7]:not(x) > *, [data-join][data-c2-7]:not(x) > * {width:calc(100%/7*2)}
[join] > c3-7, [join] > [data-c3-7], [data-join] > c3-7, [data-join] > [data-c3-7], [join][c3-7]:not(x) > *, [data-join][data-c3-7]:not(x) > * {width:calc(100%/7*3)}
[join] > c4-7, [join] > [data-c4-7], [data-join] > c4-7, [data-join] > [data-c4-7], [join][c4-7]:not(x) > *, [data-join][data-c4-7]:not(x) > * {width:calc(100%/7*4)}
[join] > c5-7, [join] > [data-c5-7], [data-join] > c5-7, [data-join] > [data-c5-7], [join][c5-7]:not(x) > *, [data-join][data-c5-7]:not(x) > * {width:calc(100%/7*5)}
[join] > c6-7, [join] > [data-c6-7], [data-join] > c6-7, [data-join] > [data-c6-7], [join][c6-7]:not(x) > *, [data-join][data-c6-7]:not(x) > * {width:calc(100%/7*6)}
[join] > c1-8, [join] > [data-c1-8], [data-join] > c1-8, [data-join] > [data-c1-8], [join][c1-8]:not(x) > *, [data-join][data-c1-8]:not(x) > * {width:calc(100%/8)}
[join] > c3-8, [join] > [data-c3-8], [data-join] > c3-8, [data-join] > [data-c3-8], [join][c3-8]:not(x) > *, [data-join][data-c3-8]:not(x) > * {width:calc(100%/8*3)}
[join] > c5-8, [join] > [data-c5-8], [data-join] > c5-8, [data-join] > [data-c5-8], [join][c5-8]:not(x) > *, [data-join][data-c5-8]:not(x) > * {width:calc(100%/8*5)}
[join] > c7-8, [join] > [data-c7-8], [data-join] > c7-8, [data-join] > [data-c7-8], [join][c7-8]:not(x) > *, [data-join][data-c7-8]:not(x) > * {width:calc(100%/8*7)}

/* Column Ordering */
[xs1], [data-xs1] {order:-8}
[xs2], [data-xs2] {order:-7}
[xs3], [data-xs3] {order:-6}
[xs4], [data-xs4] {order:-5}
[xs5], [data-xs5] {order:-4}
[xs6], [data-xs6] {order:-3}
[xs7], [data-xs7] {order:-2}
[xs8], [data-xs8] {order:-1}

/* Small Breakpoint: (sm) */
@media (min-width:600px) {
    /*
    Specificity on column width selectors (Gutters)
    Priority order from lowest to highest (higher priority must have higher specificity)

    #3: Default column eg:
    (specificity: 0,0,1)    r-c > *,
    (specificity: 0,1,0)    [r-c] > *,
    (specificity: 0,1,0)    [data-r-c] > * {}

    #2: Column tag eg:
    (specificity: 0,1,1)    [sm1-2]:not(x),
    (specificity: 0,1,1)    [data-sm1-2]:not(x) {}

    #1: Column width specified on parent tag:
    (specificity: 0,1,2)    r-c[sm1-2]:not(x) > *,
    (specificity: 0,2,0)    [data-r-c][sm1-2] > * {}

    Put it all together and we have:
    [sm1-2]:not(x), [data-sm1-2]:not(x), r-c[sm1-2]:not(x) > *, [data-r-c][data-sm1-2] > * {}
    */

    /* Column Widths */
    [sm1-1]:not(x), [data-sm1-1]:not(x), r-c[sm1-1]:not(x) > *, [data-r-c][data-sm1-1] > * {width:100%}
    [sm1-2]:not(x), [data-sm1-2]:not(x), r-c[sm1-2]:not(x) > *, [data-r-c][data-sm1-2] > * {width:calc(50% - (5.455px + 1.42041vw)/2)}
    [sm1-3]:not(x), [data-sm1-3]:not(x), r-c[sm1-3]:not(x) > *, [data-r-c][data-sm1-3] > * {width:calc(100%/3 - (5.455px + 1.42041vw)/3*2)}
    [sm2-3]:not(x), [data-sm2-3]:not(x), r-c[sm2-3]:not(x) > *, [data-r-c][data-sm2-3] > * {width:calc(100%/3*2 - (5.455px + 1.42041vw)/3)}
    [sm1-4]:not(x), [data-sm1-4]:not(x), r-c[sm1-4]:not(x) > *, [data-r-c][data-sm1-4] > * {width:calc(25% - (5.455px + 1.42041vw)/4*3)}
    [sm2-4]:not(x), [data-sm2-4]:not(x), r-c[sm2-4]:not(x) > *, [data-r-c][data-sm2-4] > * {width:calc(50% - (5.455px + 1.42041vw)/2)}
    [sm3-4]:not(x), [data-sm3-4]:not(x), r-c[sm3-4]:not(x) > *, [data-r-c][data-sm3-4] > * {width:calc(25% - (5.455px + 1.42041vw)/4)}
    [sm1-5]:not(x), [data-sm1-5]:not(x), r-c[sm1-5]:not(x) > *, [data-r-c][data-sm1-5] > * {width:calc(100%/5 - (5.455px + 1.42041vw)/5*4)}
    [sm2-5]:not(x), [data-sm2-5]:not(x), r-c[sm2-5]:not(x) > *, [data-r-c][data-sm2-5] > * {width:calc(100%/5*2 - (5.455px + 1.42041vw)/5*3)}
    [sm3-5]:not(x), [data-sm3-5]:not(x), r-c[sm3-5]:not(x) > *, [data-r-c][data-sm3-5] > * {width:calc(100%/5*3 - (5.455px + 1.42041vw)/5*2)}
    [sm4-5]:not(x), [data-sm4-5]:not(x), r-c[sm4-5]:not(x) > *, [data-r-c][data-sm4-5] > * {width:calc(100%/5*4 - (5.455px + 1.42041vw)/5)}
    [sm1-6]:not(x), [data-sm1-6]:not(x), r-c[sm1-6]:not(x) > *, [data-r-c][data-sm1-6] > * {width:calc(100%/6 - (5.455px + 1.42041vw)/6*5)}
    [sm2-6]:not(x), [data-sm2-6]:not(x), r-c[sm2-6]:not(x) > *, [data-r-c][data-sm2-6] > * {width:calc(100%/6*2 - (5.455px + 1.42041vw)/6*4)}
    [sm3-6]:not(x), [data-sm3-6]:not(x), r-c[sm3-6]:not(x) > *, [data-r-c][data-sm3-6] > * {width:calc(50% - (5.455px + 1.42041vw)/2)}
    [sm4-6]:not(x), [data-sm4-6]:not(x), r-c[sm4-6]:not(x) > *, [data-r-c][data-sm4-6] > * {width:calc(100%/6*4 - (5.455px + 1.42041vw)/6*2)}
    [sm5-6]:not(x), [data-sm5-6]:not(x), r-c[sm5-6]:not(x) > *, [data-r-c][data-sm5-6] > * {width:calc(100%/6*5 - (5.455px + 1.42041vw)/6)}
    [sm1-7]:not(x), [data-sm1-7]:not(x), r-c[sm1-7]:not(x) > *, [data-r-c][data-sm1-7] > * {width:calc(100%/7 - (5.455px + 1.42041vw)/7*6)}
    [sm2-7]:not(x), [data-sm2-7]:not(x), r-c[sm2-7]:not(x) > *, [data-r-c][data-sm2-7] > * {width:calc(100%/7*2 - (5.455px + 1.42041vw)/7*5)}
    [sm3-7]:not(x), [data-sm3-7]:not(x), r-c[sm3-7]:not(x) > *, [data-r-c][data-sm3-7] > * {width:calc(100%/7*3 - (5.455px + 1.42041vw)/7*4)}
    [sm4-7]:not(x), [data-sm4-7]:not(x), r-c[sm4-7]:not(x) > *, [data-r-c][data-sm4-7] > * {width:calc(100%/7*4 - (5.455px + 1.42041vw)/7*3)}
    [sm5-7]:not(x), [data-sm5-7]:not(x), r-c[sm5-7]:not(x) > *, [data-r-c][data-sm5-7] > * {width:calc(100%/7*5 - (5.455px + 1.42041vw)/7*2)}
    [sm6-7]:not(x), [data-sm6-7]:not(x), r-c[sm6-7]:not(x) > *, [data-r-c][data-sm6-7] > * {width:calc(100%/7*6 - (5.455px + 1.42041vw)/7)}
    [sm1-8]:not(x), [data-sm1-8]:not(x), r-c[sm1-8]:not(x) > *, [data-r-c][data-sm1-8] > * {width:calc(100%/8 - (5.455px + 1.42041vw)/8*7)}
    [sm2-8]:not(x), [data-sm2-8]:not(x), r-c[sm2-8]:not(x) > *, [data-r-c][data-sm2-8] > * {width:calc(100%/8*2 - (5.455px + 1.42041vw)/8*6)}
    [sm3-8]:not(x), [data-sm3-8]:not(x), r-c[sm3-8]:not(x) > *, [data-r-c][data-sm3-8] > * {width:calc(100%/8*3 - (5.455px + 1.42041vw)/8*5)}
    [sm4-8]:not(x), [data-sm4-8]:not(x), r-c[sm4-8]:not(x) > *, [data-r-c][data-sm4-8] > * {width:calc(50% - (5.455px + 1.42041vw)/2)}
    [sm5-8]:not(x), [data-sm5-8]:not(x), r-c[sm5-8]:not(x) > *, [data-r-c][data-sm5-8] > * {width:calc(100%/8*5 - (5.455px + 1.42041vw)/8*3)}
    [sm6-8]:not(x), [data-sm6-8]:not(x), r-c[sm6-8]:not(x) > *, [data-r-c][data-sm6-8] > * {width:calc(100%/8*6 - (5.455px + 1.42041vw)/8*2)}
    [sm7-8]:not(x), [data-sm7-8]:not(x), r-c[sm7-8]:not(x) > *, [data-r-c][data-sm7-8] > * {width:calc(100%/8*7 - (5.455px + 1.42041vw)/8)}

    /*
    Specificity on column width selectors (Joined)
    Priority order from lowest to highest (higher priority must have higher specificity)

    #3: Default column eg:
    (specificity: 0,0,1)    r-c > *,
    (specificity: 0,1,0)    [r-c] > *,
    (specificity: 0,1,0)    [data-r-c] > * {}

    #2: Column tag eg:
    (specificity: 0,2,0)    [join] > [sm1-2],
    (specificity: 0,2,0)    [join] > [data-sm1-2],
    (specificity: 0,2,0)    [data-join] > [sm1-2],
    (specificity: 0,2,0)    [data-join] > [data-sm1-2] {}

    #1: Column width specified on parent tag:
    (specificity: 0,2,1)    [join][sm1-2]:not(x) > *,
    (specificity: 0,2,1)    [data-join][data-sm1-2]:not(x) > * {}

    Put it all together and we have:
    [join] > [sm1-2], [join] > [data-sm1-2], [data-join] > [sm1-2], [data-join] > [data-sm1-2], [join][sm1-2]:not(x) > *, [data-join][data-sm1-2]:not(x) > * {}
    */

    /* Column Widths (Joined) */
    [join] > [sm1-1], [join] > [data-sm1-1], [data-join] > [sm1-1], [data-join] > [data-sm1-1], [join][sm1-1]:not([r-c]) > *, [data-join][data-sm1-1]:not([x]) > * {width:100%}
    [join] > [sm1-2], [join] > [data-sm1-2], [data-join] > [sm1-2], [data-join] > [data-sm1-2], [join][sm1-2]:not([r-c]) > *, [data-join][data-sm1-2]:not([x]) > *,
    [join] > [sm2-4], [join] > [data-sm2-4], [data-join] > [sm2-4], [data-join] > [data-sm2-4], [join][sm2-4]:not([r-c]) > *, [data-join][data-sm2-4]:not([x]) > *,
    [join] > [sm3-6], [join] > [data-sm3-6], [data-join] > [sm3-6], [data-join] > [data-sm3-6], [join][sm3-6]:not([r-c]) > *, [data-join][data-sm3-6]:not([x]) > *,
    [join] > [sm4-8], [join] > [data-sm4-8], [data-join] > [sm4-8], [data-join] > [data-sm4-8], [join][sm4-8]:not([r-c]) > *, [data-join][data-sm4-8]:not([x]) > * {width:50%}
    [join] > [sm1-3], [join] > [data-sm1-3], [data-join] > [sm1-3], [data-join] > [data-sm1-3], [join][sm1-3]:not([r-c]) > *, [data-join][data-sm1-3]:not([x]) > *,
    [join] > [sm2-6], [join] > [data-sm2-6], [data-join] > [sm2-6], [data-join] > [data-sm2-6], [join][sm2-6]:not([r-c]) > *, [data-join][data-sm2-6]:not([x]) > * {width:calc(100%/3)}
    [join] > [sm2-3], [join] > [data-sm2-3], [data-join] > [sm2-3], [data-join] > [data-sm2-3], [join][sm2-3]:not([r-c]) > *, [data-join][data-sm2-3]:not([x]) > *,
    [join] > [sm4-6], [join] > [data-sm4-6], [data-join] > [sm4-6], [data-join] > [data-sm4-6], [join][sm4-6]:not([r-c]) > *, [data-join][data-sm4-6]:not([x]) > * {width:calc(100%/3*2)}
    [join] > [sm1-4], [join] > [data-sm1-4], [data-join] > [sm1-4], [data-join] > [data-sm1-4], [join][sm1-4]:not([r-c]) > *, [data-join][data-sm1-4]:not([x]) > *,
    [join] > [sm2-8], [join] > [data-sm2-8], [data-join] > [sm2-8], [data-join] > [data-sm2-8], [join][sm2-8]:not([r-c]) > *, [data-join][data-sm2-8]:not([x]) > * {width:25%}
    [join] > [sm3-4], [join] > [data-sm3-4], [data-join] > [sm3-4], [data-join] > [data-sm3-4], [join][sm3-4]:not([r-c]) > *, [data-join][data-sm3-4]:not([x]) > *,
    [join] > [sm6-8], [join] > [data-sm6-8], [data-join] > [sm6-8], [data-join] > [data-sm6-8], [join][sm6-8]:not([r-c]) > *, [data-join][data-sm6-8]:not([x]) > * {width:75%}
    [join] > [sm1-5], [join] > [data-sm1-5], [data-join] > [sm1-5], [data-join] > [data-sm1-5], [join][sm1-5]:not([r-c]) > *, [data-join][data-sm1-5]:not([x]) > * {width:20%}
    [join] > [sm2-5], [join] > [data-sm2-5], [data-join] > [sm2-5], [data-join] > [data-sm2-5], [join][sm2-5]:not([r-c]) > *, [data-join][data-sm2-5]:not([x]) > * {width:40%}
    [join] > [sm3-5], [join] > [data-sm3-5], [data-join] > [sm3-5], [data-join] > [data-sm3-5], [join][sm3-5]:not([r-c]) > *, [data-join][data-sm3-5]:not([x]) > * {width:60%}
    [join] > [sm4-5], [join] > [data-sm4-5], [data-join] > [sm4-5], [data-join] > [data-sm4-5], [join][sm4-5]:not([r-c]) > *, [data-join][data-sm4-5]:not([x]) > * {width:80%}
    [join] > [sm1-6], [join] > [data-sm1-6], [data-join] > [sm1-6], [data-join] > [data-sm1-6], [join][sm1-6]:not([r-c]) > *, [data-join][data-sm1-6]:not([x]) > * {width:calc(100%/6)}
    [join] > [sm5-6], [join] > [data-sm5-6], [data-join] > [sm5-6], [data-join] > [data-sm5-6], [join][sm5-6]:not([r-c]) > *, [data-join][data-sm5-6]:not([x]) > * {width:calc(100%/6*5)}
    [join] > [sm1-7], [join] > [data-sm1-7], [data-join] > [sm1-7], [data-join] > [data-sm1-7], [join][sm1-7]:not([r-c]) > *, [data-join][data-sm1-7]:not([x]) > * {width:calc(100%/7)}
    [join] > [sm2-7], [join] > [data-sm2-7], [data-join] > [sm2-7], [data-join] > [data-sm2-7], [join][sm2-7]:not([r-c]) > *, [data-join][data-sm2-7]:not([x]) > * {width:calc(100%/7*2)}
    [join] > [sm3-7], [join] > [data-sm3-7], [data-join] > [sm3-7], [data-join] > [data-sm3-7], [join][sm3-7]:not([r-c]) > *, [data-join][data-sm3-7]:not([x]) > * {width:calc(100%/7*3)}
    [join] > [sm4-7], [join] > [data-sm4-7], [data-join] > [sm4-7], [data-join] > [data-sm4-7], [join][sm4-7]:not([r-c]) > *, [data-join][data-sm4-7]:not([x]) > * {width:calc(100%/7*4)}
    [join] > [sm5-7], [join] > [data-sm5-7], [data-join] > [sm5-7], [data-join] > [data-sm5-7], [join][sm5-7]:not([r-c]) > *, [data-join][data-sm5-7]:not([x]) > * {width:calc(100%/7*5)}
    [join] > [sm6-7], [join] > [data-sm6-7], [data-join] > [sm6-7], [data-join] > [data-sm6-7], [join][sm6-7]:not([r-c]) > *, [data-join][data-sm6-7]:not([x]) > * {width:calc(100%/7*6)}
    [join] > [sm1-8], [join] > [data-sm1-8], [data-join] > [sm1-8], [data-join] > [data-sm1-8], [join][sm1-8]:not([r-c]) > *, [data-join][data-sm1-8]:not([x]) > * {width:calc(100%/8)}
    [join] > [sm3-8], [join] > [data-sm3-8], [data-join] > [sm3-8], [data-join] > [data-sm3-8], [join][sm3-8]:not([r-c]) > *, [data-join][data-sm3-8]:not([x]) > * {width:calc(100%/8*3)}
    [join] > [sm5-8], [join] > [data-sm5-8], [data-join] > [sm5-8], [data-join] > [data-sm5-8], [join][sm5-8]:not([r-c]) > *, [data-join][data-sm5-8]:not([x]) > * {width:calc(100%/8*5)}
    [join] > [sm7-8], [join] > [data-sm7-8], [data-join] > [sm7-8], [data-join] > [data-sm7-8], [join][sm7-8]:not([r-c]) > *, [data-join][data-sm7-8]:not([x]) > * {width:calc(100%/8*7)}

    /* Column Ordering */
    [sm1], [data-sm1] {order:-8}
    [sm2], [data-sm2] {order:-7}
    [sm3], [data-sm3] {order:-6}
    [sm4], [data-sm4] {order:-5}
    [sm5], [data-sm5] {order:-4}
    [sm6], [data-sm6] {order:-3}
    [sm7], [data-sm7] {order:-2}
    [sm8], [data-sm8] {order:-1}
}

/* Medium Breakpoint: (md) */
@media (min-width:900px) {

    /* Column Widths */
    [md1-1]:not(x), [data-md1-1]:not(x), r-c[md1-1]:not(x) > *, [data-r-c][data-md1-1] > * {width:100%}
    [md1-2]:not(x), [data-md1-2]:not(x), r-c[md1-2]:not(x) > *, [data-r-c][data-md1-2] > * {width:calc(50% - (5.455px + 1.42041vw)/2)}
    [md1-3]:not(x), [data-md1-3]:not(x), r-c[md1-3]:not(x) > *, [data-r-c][data-md1-3] > * {width:calc(100%/3 - (5.455px + 1.42041vw)/3*2)}
    [md2-3]:not(x), [data-md2-3]:not(x), r-c[md2-3]:not(x) > *, [data-r-c][data-md2-3] > * {width:calc(100%/3*2 - (5.455px + 1.42041vw)/3)}
    [md1-4]:not(x), [data-md1-4]:not(x), r-c[md1-4]:not(x) > *, [data-r-c][data-md1-4] > * {width:calc(25% - (5.455px + 1.42041vw)/4*3)}
    [md2-4]:not(x), [data-md2-4]:not(x), r-c[md2-4]:not(x) > *, [data-r-c][data-md2-4] > * {width:calc(50% - (5.455px + 1.42041vw)/2)}
    [md3-4]:not(x), [data-md3-4]:not(x), r-c[md3-4]:not(x) > *, [data-r-c][data-md3-4] > * {width:calc(25% - (5.455px + 1.42041vw)/4)}
    [md1-5]:not(x), [data-md1-5]:not(x), r-c[md1-5]:not(x) > *, [data-r-c][data-md1-5] > * {width:calc(100%/5 - (5.455px + 1.42041vw)/5*4)}
    [md2-5]:not(x), [data-md2-5]:not(x), r-c[md2-5]:not(x) > *, [data-r-c][data-md2-5] > * {width:calc(100%/5*2 - (5.455px + 1.42041vw)/5*3)}
    [md3-5]:not(x), [data-md3-5]:not(x), r-c[md3-5]:not(x) > *, [data-r-c][data-md3-5] > * {width:calc(100%/5*3 - (5.455px + 1.42041vw)/5*2)}
    [md4-5]:not(x), [data-md4-5]:not(x), r-c[md4-5]:not(x) > *, [data-r-c][data-md4-5] > * {width:calc(100%/5*4 - (5.455px + 1.42041vw)/5)}
    [md1-6]:not(x), [data-md1-6]:not(x), r-c[md1-6]:not(x) > *, [data-r-c][data-md1-6] > * {width:calc(100%/6 - (5.455px + 1.42041vw)/6*5)}
    [md2-6]:not(x), [data-md2-6]:not(x), r-c[md2-6]:not(x) > *, [data-r-c][data-md2-6] > * {width:calc(100%/6*2 - (5.455px + 1.42041vw)/6*4)}
    [md3-6]:not(x), [data-md3-6]:not(x), r-c[md3-6]:not(x) > *, [data-r-c][data-md3-6] > * {width:calc(50% - (5.455px + 1.42041vw)/2)}
    [md4-6]:not(x), [data-md4-6]:not(x), r-c[md4-6]:not(x) > *, [data-r-c][data-md4-6] > * {width:calc(100%/6*4 - (5.455px + 1.42041vw)/6*2)}
    [md5-6]:not(x), [data-md5-6]:not(x), r-c[md5-6]:not(x) > *, [data-r-c][data-md5-6] > * {width:calc(100%/6*5 - (5.455px + 1.42041vw)/6)}
    [md1-7]:not(x), [data-md1-7]:not(x), r-c[md1-7]:not(x) > *, [data-r-c][data-md1-7] > * {width:calc(100%/7 - (5.455px + 1.42041vw)/7*6)}
    [md2-7]:not(x), [data-md2-7]:not(x), r-c[md2-7]:not(x) > *, [data-r-c][data-md2-7] > * {width:calc(100%/7*2 - (5.455px + 1.42041vw)/7*5)}
    [md3-7]:not(x), [data-md3-7]:not(x), r-c[md3-7]:not(x) > *, [data-r-c][data-md3-7] > * {width:calc(100%/7*3 - (5.455px + 1.42041vw)/7*4)}
    [md4-7]:not(x), [data-md4-7]:not(x), r-c[md4-7]:not(x) > *, [data-r-c][data-md4-7] > * {width:calc(100%/7*4 - (5.455px + 1.42041vw)/7*3)}
    [md5-7]:not(x), [data-md5-7]:not(x), r-c[md5-7]:not(x) > *, [data-r-c][data-md5-7] > * {width:calc(100%/7*5 - (5.455px + 1.42041vw)/7*2)}
    [md6-7]:not(x), [data-md6-7]:not(x), r-c[md6-7]:not(x) > *, [data-r-c][data-md6-7] > * {width:calc(100%/7*6 - (5.455px + 1.42041vw)/7)}
    [md1-8]:not(x), [data-md1-8]:not(x), r-c[md1-8]:not(x) > *, [data-r-c][data-md1-8] > * {width:calc(100%/8 - (5.455px + 1.42041vw)/8*7)}
    [md2-8]:not(x), [data-md2-8]:not(x), r-c[md2-8]:not(x) > *, [data-r-c][data-md2-8] > * {width:calc(100%/8*2 - (5.455px + 1.42041vw)/8*6)}
    [md3-8]:not(x), [data-md3-8]:not(x), r-c[md3-8]:not(x) > *, [data-r-c][data-md3-8] > * {width:calc(100%/8*3 - (5.455px + 1.42041vw)/8*5)}
    [md4-8]:not(x), [data-md4-8]:not(x), r-c[md4-8]:not(x) > *, [data-r-c][data-md4-8] > * {width:calc(50% - (5.455px + 1.42041vw)/2)}
    [md5-8]:not(x), [data-md5-8]:not(x), r-c[md5-8]:not(x) > *, [data-r-c][data-md5-8] > * {width:calc(100%/8*5 - (5.455px + 1.42041vw)/8*3)}
    [md6-8]:not(x), [data-md6-8]:not(x), r-c[md6-8]:not(x) > *, [data-r-c][data-md6-8] > * {width:calc(100%/8*6 - (5.455px + 1.42041vw)/8*2)}
    [md7-8]:not(x), [data-md7-8]:not(x), r-c[md7-8]:not(x) > *, [data-r-c][data-md7-8] > * {width:calc(100%/8*7 - (5.455px + 1.42041vw)/8)}

    /* Column Widths (Joined) */
    [join] > [md1-1], [join] > [data-md1-1], [data-join] > [md1-1], [data-join] > [data-md1-1], [join][md1-1]:not([r-c]) > *, [data-join][data-md1-1]:not([x]) > * {width:100%}
    [join] > [md1-2], [join] > [data-md1-2], [data-join] > [md1-2], [data-join] > [data-md1-2], [join][md1-2]:not([r-c]) > *, [data-join][data-md1-2]:not([x]) > *,
    [join] > [md2-4], [join] > [data-md2-4], [data-join] > [md2-4], [data-join] > [data-md2-4], [join][md2-4]:not([r-c]) > *, [data-join][data-md2-4]:not([x]) > *,
    [join] > [md3-6], [join] > [data-md3-6], [data-join] > [md3-6], [data-join] > [data-md3-6], [join][md3-6]:not([r-c]) > *, [data-join][data-md3-6]:not([x]) > *,
    [join] > [md4-8], [join] > [data-md4-8], [data-join] > [md4-8], [data-join] > [data-md4-8], [join][md4-8]:not([r-c]) > *, [data-join][data-md4-8]:not([x]) > * {width:50%}
    [join] > [md1-3], [join] > [data-md1-3], [data-join] > [md1-3], [data-join] > [data-md1-3], [join][md1-3]:not([r-c]) > *, [data-join][data-md1-3]:not([x]) > *,
    [join] > [md2-6], [join] > [data-md2-6], [data-join] > [md2-6], [data-join] > [data-md2-6], [join][md2-6]:not([r-c]) > *, [data-join][data-md2-6]:not([x]) > * {width:calc(100%/3)}
    [join] > [md2-3], [join] > [data-md2-3], [data-join] > [md2-3], [data-join] > [data-md2-3], [join][md2-3]:not([r-c]) > *, [data-join][data-md2-3]:not([x]) > *,
    [join] > [md4-6], [join] > [data-md4-6], [data-join] > [md4-6], [data-join] > [data-md4-6], [join][md4-6]:not([r-c]) > *, [data-join][data-md4-6]:not([x]) > * {width:calc(100%/3*2)}
    [join] > [md1-4], [join] > [data-md1-4], [data-join] > [md1-4], [data-join] > [data-md1-4], [join][md1-4]:not([r-c]) > *, [data-join][data-md1-4]:not([x]) > *,
    [join] > [md2-8], [join] > [data-md2-8], [data-join] > [md2-8], [data-join] > [data-md2-8], [join][md2-8]:not([r-c]) > *, [data-join][data-md2-8]:not([x]) > * {width:25%}
    [join] > [md3-4], [join] > [data-md3-4], [data-join] > [md3-4], [data-join] > [data-md3-4], [join][md3-4]:not([r-c]) > *, [data-join][data-md3-4]:not([x]) > *,
    [join] > [md6-8], [join] > [data-md6-8], [data-join] > [md6-8], [data-join] > [data-md6-8], [join][md6-8]:not([r-c]) > *, [data-join][data-md6-8]:not([x]) > * {width:75%}
    [join] > [md1-5], [join] > [data-md1-5], [data-join] > [md1-5], [data-join] > [data-md1-5], [join][md1-5]:not([r-c]) > *, [data-join][data-md1-5]:not([x]) > * {width:20%}
    [join] > [md2-5], [join] > [data-md2-5], [data-join] > [md2-5], [data-join] > [data-md2-5], [join][md2-5]:not([r-c]) > *, [data-join][data-md2-5]:not([x]) > * {width:40%}
    [join] > [md3-5], [join] > [data-md3-5], [data-join] > [md3-5], [data-join] > [data-md3-5], [join][md3-5]:not([r-c]) > *, [data-join][data-md3-5]:not([x]) > * {width:60%}
    [join] > [md4-5], [join] > [data-md4-5], [data-join] > [md4-5], [data-join] > [data-md4-5], [join][md4-5]:not([r-c]) > *, [data-join][data-md4-5]:not([x]) > * {width:80%}
    [join] > [md1-6], [join] > [data-md1-6], [data-join] > [md1-6], [data-join] > [data-md1-6], [join][md1-6]:not([r-c]) > *, [data-join][data-md1-6]:not([x]) > * {width:calc(100%/6)}
    [join] > [md5-6], [join] > [data-md5-6], [data-join] > [md5-6], [data-join] > [data-md5-6], [join][md5-6]:not([r-c]) > *, [data-join][data-md5-6]:not([x]) > * {width:calc(100%/6*5)}
    [join] > [md1-7], [join] > [data-md1-7], [data-join] > [md1-7], [data-join] > [data-md1-7], [join][md1-7]:not([r-c]) > *, [data-join][data-md1-7]:not([x]) > * {width:calc(100%/7)}
    [join] > [md2-7], [join] > [data-md2-7], [data-join] > [md2-7], [data-join] > [data-md2-7], [join][md2-7]:not([r-c]) > *, [data-join][data-md2-7]:not([x]) > * {width:calc(100%/7*2)}
    [join] > [md3-7], [join] > [data-md3-7], [data-join] > [md3-7], [data-join] > [data-md3-7], [join][md3-7]:not([r-c]) > *, [data-join][data-md3-7]:not([x]) > * {width:calc(100%/7*3)}
    [join] > [md4-7], [join] > [data-md4-7], [data-join] > [md4-7], [data-join] > [data-md4-7], [join][md4-7]:not([r-c]) > *, [data-join][data-md4-7]:not([x]) > * {width:calc(100%/7*4)}
    [join] > [md5-7], [join] > [data-md5-7], [data-join] > [md5-7], [data-join] > [data-md5-7], [join][md5-7]:not([r-c]) > *, [data-join][data-md5-7]:not([x]) > * {width:calc(100%/7*5)}
    [join] > [md6-7], [join] > [data-md6-7], [data-join] > [md6-7], [data-join] > [data-md6-7], [join][md6-7]:not([r-c]) > *, [data-join][data-md6-7]:not([x]) > * {width:calc(100%/7*6)}
    [join] > [md1-8], [join] > [data-md1-8], [data-join] > [md1-8], [data-join] > [data-md1-8], [join][md1-8]:not([r-c]) > *, [data-join][data-md1-8]:not([x]) > * {width:calc(100%/8)}
    [join] > [md3-8], [join] > [data-md3-8], [data-join] > [md3-8], [data-join] > [data-md3-8], [join][md3-8]:not([r-c]) > *, [data-join][data-md3-8]:not([x]) > * {width:calc(100%/8*3)}
    [join] > [md5-8], [join] > [data-md5-8], [data-join] > [md5-8], [data-join] > [data-md5-8], [join][md5-8]:not([r-c]) > *, [data-join][data-md5-8]:not([x]) > * {width:calc(100%/8*5)}
    [join] > [md7-8], [join] > [data-md7-8], [data-join] > [md7-8], [data-join] > [data-md7-8], [join][md7-8]:not([r-c]) > *, [data-join][data-md7-8]:not([x]) > * {width:calc(100%/8*7)}

    /* Column Ordering */
    [md1], [data-md1] {order:-8}
    [md2], [data-md2] {order:-7}
    [md3], [data-md3] {order:-6}
    [md4], [data-md4] {order:-5}
    [md5], [data-md5] {order:-4}
    [md6], [data-md6] {order:-3}
    [md7], [data-md7] {order:-2}
    [md8], [data-md8] {order:-1}
}

/* Large Breakpoint: (lg) */
@media (min-width:1200px) {

    /* Column Widths */
    [lg1-1]:not(x), [data-lg1-1]:not(x), r-c[lg1-1]:not(x) > *, [data-r-c][data-lg1-1] > * {width:100%}
    [lg1-2]:not(x), [data-lg1-2]:not(x), r-c[lg1-2]:not(x) > *, [data-r-c][data-lg1-2] > * {width:calc(50% - (5.455px + 1.42041vw)/2)}
    [lg1-3]:not(x), [data-lg1-3]:not(x), r-c[lg1-3]:not(x) > *, [data-r-c][data-lg1-3] > * {width:calc(100%/3 - (5.455px + 1.42041vw)/3*2)}
    [lg2-3]:not(x), [data-lg2-3]:not(x), r-c[lg2-3]:not(x) > *, [data-r-c][data-lg2-3] > * {width:calc(100%/3*2 - (5.455px + 1.42041vw)/3)}
    [lg1-4]:not(x), [data-lg1-4]:not(x), r-c[lg1-4]:not(x) > *, [data-r-c][data-lg1-4] > * {width:calc(25% - (5.455px + 1.42041vw)/4*3)}
    [lg2-4]:not(x), [data-lg2-4]:not(x), r-c[lg2-4]:not(x) > *, [data-r-c][data-lg2-4] > * {width:calc(50% - (5.455px + 1.42041vw)/2)}
    [lg3-4]:not(x), [data-lg3-4]:not(x), r-c[lg3-4]:not(x) > *, [data-r-c][data-lg3-4] > * {width:calc(25% - (5.455px + 1.42041vw)/4)}
    [lg1-5]:not(x), [data-lg1-5]:not(x), r-c[lg1-5]:not(x) > *, [data-r-c][data-lg1-5] > * {width:calc(100%/5 - (5.455px + 1.42041vw)/5*4)}
    [lg2-5]:not(x), [data-lg2-5]:not(x), r-c[lg2-5]:not(x) > *, [data-r-c][data-lg2-5] > * {width:calc(100%/5*2 - (5.455px + 1.42041vw)/5*3)}
    [lg3-5]:not(x), [data-lg3-5]:not(x), r-c[lg3-5]:not(x) > *, [data-r-c][data-lg3-5] > * {width:calc(100%/5*3 - (5.455px + 1.42041vw)/5*2)}
    [lg4-5]:not(x), [data-lg4-5]:not(x), r-c[lg4-5]:not(x) > *, [data-r-c][data-lg4-5] > * {width:calc(100%/5*4 - (5.455px + 1.42041vw)/5)}
    [lg1-6]:not(x), [data-lg1-6]:not(x), r-c[lg1-6]:not(x) > *, [data-r-c][data-lg1-6] > * {width:calc(100%/6 - (5.455px + 1.42041vw)/6*5)}
    [lg2-6]:not(x), [data-lg2-6]:not(x), r-c[lg2-6]:not(x) > *, [data-r-c][data-lg2-6] > * {width:calc(100%/6*2 - (5.455px + 1.42041vw)/6*4)}
    [lg3-6]:not(x), [data-lg3-6]:not(x), r-c[lg3-6]:not(x) > *, [data-r-c][data-lg3-6] > * {width:calc(50% - (5.455px + 1.42041vw)/2)}
    [lg4-6]:not(x), [data-lg4-6]:not(x), r-c[lg4-6]:not(x) > *, [data-r-c][data-lg4-6] > * {width:calc(100%/6*4 - (5.455px + 1.42041vw)/6*2)}
    [lg5-6]:not(x), [data-lg5-6]:not(x), r-c[lg5-6]:not(x) > *, [data-r-c][data-lg5-6] > * {width:calc(100%/6*5 - (5.455px + 1.42041vw)/6)}
    [lg1-7]:not(x), [data-lg1-7]:not(x), r-c[lg1-7]:not(x) > *, [data-r-c][data-lg1-7] > * {width:calc(100%/7 - (5.455px + 1.42041vw)/7*6)}
    [lg2-7]:not(x), [data-lg2-7]:not(x), r-c[lg2-7]:not(x) > *, [data-r-c][data-lg2-7] > * {width:calc(100%/7*2 - (5.455px + 1.42041vw)/7*5)}
    [lg3-7]:not(x), [data-lg3-7]:not(x), r-c[lg3-7]:not(x) > *, [data-r-c][data-lg3-7] > * {width:calc(100%/7*3 - (5.455px + 1.42041vw)/7*4)}
    [lg4-7]:not(x), [data-lg4-7]:not(x), r-c[lg4-7]:not(x) > *, [data-r-c][data-lg4-7] > * {width:calc(100%/7*4 - (5.455px + 1.42041vw)/7*3)}
    [lg5-7]:not(x), [data-lg5-7]:not(x), r-c[lg5-7]:not(x) > *, [data-r-c][data-lg5-7] > * {width:calc(100%/7*5 - (5.455px + 1.42041vw)/7*2)}
    [lg6-7]:not(x), [data-lg6-7]:not(x), r-c[lg6-7]:not(x) > *, [data-r-c][data-lg6-7] > * {width:calc(100%/7*6 - (5.455px + 1.42041vw)/7)}
    [lg1-8]:not(x), [data-lg1-8]:not(x), r-c[lg1-8]:not(x) > *, [data-r-c][data-lg1-8] > * {width:calc(100%/8 - (5.455px + 1.42041vw)/8*7)}
    [lg2-8]:not(x), [data-lg2-8]:not(x), r-c[lg2-8]:not(x) > *, [data-r-c][data-lg2-8] > * {width:calc(100%/8*2 - (5.455px + 1.42041vw)/8*6)}
    [lg3-8]:not(x), [data-lg3-8]:not(x), r-c[lg3-8]:not(x) > *, [data-r-c][data-lg3-8] > * {width:calc(100%/8*3 - (5.455px + 1.42041vw)/8*5)}
    [lg4-8]:not(x), [data-lg4-8]:not(x), r-c[lg4-8]:not(x) > *, [data-r-c][data-lg4-8] > * {width:calc(50% - (5.455px + 1.42041vw)/2)}
    [lg5-8]:not(x), [data-lg5-8]:not(x), r-c[lg5-8]:not(x) > *, [data-r-c][data-lg5-8] > * {width:calc(100%/8*5 - (5.455px + 1.42041vw)/8*3)}
    [lg6-8]:not(x), [data-lg6-8]:not(x), r-c[lg6-8]:not(x) > *, [data-r-c][data-lg6-8] > * {width:calc(100%/8*6 - (5.455px + 1.42041vw)/8*2)}
    [lg7-8]:not(x), [data-lg7-8]:not(x), r-c[lg7-8]:not(x) > *, [data-r-c][data-lg7-8] > * {width:calc(100%/8*7 - (5.455px + 1.42041vw)/8)}

    /* Column Widths (Joined) */
    [join] > [lg1-1], [join] > [data-lg1-1], [data-join] > [lg1-1], [data-join] > [data-lg1-1], [join][lg1-1]:not([r-c]) > *, [data-join][data-lg1-1]:not([x]) > * {width:100%}
    [join] > [lg1-2], [join] > [data-lg1-2], [data-join] > [lg1-2], [data-join] > [data-lg1-2], [join][lg1-2]:not([r-c]) > *, [data-join][data-lg1-2]:not([x]) > *,
    [join] > [lg2-4], [join] > [data-lg2-4], [data-join] > [lg2-4], [data-join] > [data-lg2-4], [join][lg2-4]:not([r-c]) > *, [data-join][data-lg2-4]:not([x]) > *,
    [join] > [lg3-6], [join] > [data-lg3-6], [data-join] > [lg3-6], [data-join] > [data-lg3-6], [join][lg3-6]:not([r-c]) > *, [data-join][data-lg3-6]:not([x]) > *,
    [join] > [lg4-8], [join] > [data-lg4-8], [data-join] > [lg4-8], [data-join] > [data-lg4-8], [join][lg4-8]:not([r-c]) > *, [data-join][data-lg4-8]:not([x]) > * {width:50%}
    [join] > [lg1-3], [join] > [data-lg1-3], [data-join] > [lg1-3], [data-join] > [data-lg1-3], [join][lg1-3]:not([r-c]) > *, [data-join][data-lg1-3]:not([x]) > *,
    [join] > [lg2-6], [join] > [data-lg2-6], [data-join] > [lg2-6], [data-join] > [data-lg2-6], [join][lg2-6]:not([r-c]) > *, [data-join][data-lg2-6]:not([x]) > * {width:calc(100%/3)}
    [join] > [lg2-3], [join] > [data-lg2-3], [data-join] > [lg2-3], [data-join] > [data-lg2-3], [join][lg2-3]:not([r-c]) > *, [data-join][data-lg2-3]:not([x]) > *,
    [join] > [lg4-6], [join] > [data-lg4-6], [data-join] > [lg4-6], [data-join] > [data-lg4-6], [join][lg4-6]:not([r-c]) > *, [data-join][data-lg4-6]:not([x]) > * {width:calc(100%/3*2)}
    [join] > [lg1-4], [join] > [data-lg1-4], [data-join] > [lg1-4], [data-join] > [data-lg1-4], [join][lg1-4]:not([r-c]) > *, [data-join][data-lg1-4]:not([x]) > *,
    [join] > [lg2-8], [join] > [data-lg2-8], [data-join] > [lg2-8], [data-join] > [data-lg2-8], [join][lg2-8]:not([r-c]) > *, [data-join][data-lg2-8]:not([x]) > * {width:25%}
    [join] > [lg3-4], [join] > [data-lg3-4], [data-join] > [lg3-4], [data-join] > [data-lg3-4], [join][lg3-4]:not([r-c]) > *, [data-join][data-lg3-4]:not([x]) > *,
    [join] > [lg6-8], [join] > [data-lg6-8], [data-join] > [lg6-8], [data-join] > [data-lg6-8], [join][lg6-8]:not([r-c]) > *, [data-join][data-lg6-8]:not([x]) > * {width:75%}
    [join] > [lg1-5], [join] > [data-lg1-5], [data-join] > [lg1-5], [data-join] > [data-lg1-5], [join][lg1-5]:not([r-c]) > *, [data-join][data-lg1-5]:not([x]) > * {width:20%}
    [join] > [lg2-5], [join] > [data-lg2-5], [data-join] > [lg2-5], [data-join] > [data-lg2-5], [join][lg2-5]:not([r-c]) > *, [data-join][data-lg2-5]:not([x]) > * {width:40%}
    [join] > [lg3-5], [join] > [data-lg3-5], [data-join] > [lg3-5], [data-join] > [data-lg3-5], [join][lg3-5]:not([r-c]) > *, [data-join][data-lg3-5]:not([x]) > * {width:60%}
    [join] > [lg4-5], [join] > [data-lg4-5], [data-join] > [lg4-5], [data-join] > [data-lg4-5], [join][lg4-5]:not([r-c]) > *, [data-join][data-lg4-5]:not([x]) > * {width:80%}
    [join] > [lg1-6], [join] > [data-lg1-6], [data-join] > [lg1-6], [data-join] > [data-lg1-6], [join][lg1-6]:not([r-c]) > *, [data-join][data-lg1-6]:not([x]) > * {width:calc(100%/6)}
    [join] > [lg5-6], [join] > [data-lg5-6], [data-join] > [lg5-6], [data-join] > [data-lg5-6], [join][lg5-6]:not([r-c]) > *, [data-join][data-lg5-6]:not([x]) > * {width:calc(100%/6*5)}
    [join] > [lg1-7], [join] > [data-lg1-7], [data-join] > [lg1-7], [data-join] > [data-lg1-7], [join][lg1-7]:not([r-c]) > *, [data-join][data-lg1-7]:not([x]) > * {width:calc(100%/7)}
    [join] > [lg2-7], [join] > [data-lg2-7], [data-join] > [lg2-7], [data-join] > [data-lg2-7], [join][lg2-7]:not([r-c]) > *, [data-join][data-lg2-7]:not([x]) > * {width:calc(100%/7*2)}
    [join] > [lg3-7], [join] > [data-lg3-7], [data-join] > [lg3-7], [data-join] > [data-lg3-7], [join][lg3-7]:not([r-c]) > *, [data-join][data-lg3-7]:not([x]) > * {width:calc(100%/7*3)}
    [join] > [lg4-7], [join] > [data-lg4-7], [data-join] > [lg4-7], [data-join] > [data-lg4-7], [join][lg4-7]:not([r-c]) > *, [data-join][data-lg4-7]:not([x]) > * {width:calc(100%/7*4)}
    [join] > [lg5-7], [join] > [data-lg5-7], [data-join] > [lg5-7], [data-join] > [data-lg5-7], [join][lg5-7]:not([r-c]) > *, [data-join][data-lg5-7]:not([x]) > * {width:calc(100%/7*5)}
    [join] > [lg6-7], [join] > [data-lg6-7], [data-join] > [lg6-7], [data-join] > [data-lg6-7], [join][lg6-7]:not([r-c]) > *, [data-join][data-lg6-7]:not([x]) > * {width:calc(100%/7*6)}
    [join] > [lg1-8], [join] > [data-lg1-8], [data-join] > [lg1-8], [data-join] > [data-lg1-8], [join][lg1-8]:not([r-c]) > *, [data-join][data-lg1-8]:not([x]) > * {width:calc(100%/8)}
    [join] > [lg3-8], [join] > [data-lg3-8], [data-join] > [lg3-8], [data-join] > [data-lg3-8], [join][lg3-8]:not([r-c]) > *, [data-join][data-lg3-8]:not([x]) > * {width:calc(100%/8*3)}
    [join] > [lg5-8], [join] > [data-lg5-8], [data-join] > [lg5-8], [data-join] > [data-lg5-8], [join][lg5-8]:not([r-c]) > *, [data-join][data-lg5-8]:not([x]) > * {width:calc(100%/8*5)}
    [join] > [lg7-8], [join] > [data-lg7-8], [data-join] > [lg7-8], [data-join] > [data-lg7-8], [join][lg7-8]:not([r-c]) > *, [data-join][data-lg7-8]:not([x]) > * {width:calc(100%/8*7)}

    /* Column Ordering */
    [lg1], [data-lg1] {order:-8}
    [lg2], [data-lg2] {order:-7}
    [lg3], [data-lg3] {order:-6}
    [lg4], [data-lg4] {order:-5}
    [lg5], [data-lg5] {order:-4}
    [lg6], [data-lg6] {order:-3}
    [lg7], [data-lg7] {order:-2}
    [lg8], [data-lg8] {order:-1}
}

/* Extra-Large Breakpoint: (xl) */
@media (min-width:1800px) {

    /* Column Widths */
    [xl1-1]:not(x), [data-xl1-1]:not(x), r-c[xl1-1]:not(x) > *, [data-r-c][data-xl1-1] > * {width:100%}
    [xl1-2]:not(x), [data-xl1-2]:not(x), r-c[xl1-2]:not(x) > *, [data-r-c][data-xl1-2] > * {width:calc(50% - (5.455px + 1.42041vw)/2)}
    [xl1-3]:not(x), [data-xl1-3]:not(x), r-c[xl1-3]:not(x) > *, [data-r-c][data-xl1-3] > * {width:calc(100%/3 - (5.455px + 1.42041vw)/3*2)}
    [xl2-3]:not(x), [data-xl2-3]:not(x), r-c[xl2-3]:not(x) > *, [data-r-c][data-xl2-3] > * {width:calc(100%/3*2 - (5.455px + 1.42041vw)/3)}
    [xl1-4]:not(x), [data-xl1-4]:not(x), r-c[xl1-4]:not(x) > *, [data-r-c][data-xl1-4] > * {width:calc(25% - (5.455px + 1.42041vw)/4*3)}
    [xl2-4]:not(x), [data-xl2-4]:not(x), r-c[xl2-4]:not(x) > *, [data-r-c][data-xl2-4] > * {width:calc(50% - (5.455px + 1.42041vw)/2)}
    [xl3-4]:not(x), [data-xl3-4]:not(x), r-c[xl3-4]:not(x) > *, [data-r-c][data-xl3-4] > * {width:calc(25% - (5.455px + 1.42041vw)/4)}
    [xl1-5]:not(x), [data-xl1-5]:not(x), r-c[xl1-5]:not(x) > *, [data-r-c][data-xl1-5] > * {width:calc(100%/5 - (5.455px + 1.42041vw)/5*4)}
    [xl2-5]:not(x), [data-xl2-5]:not(x), r-c[xl2-5]:not(x) > *, [data-r-c][data-xl2-5] > * {width:calc(100%/5*2 - (5.455px + 1.42041vw)/5*3)}
    [xl3-5]:not(x), [data-xl3-5]:not(x), r-c[xl3-5]:not(x) > *, [data-r-c][data-xl3-5] > * {width:calc(100%/5*3 - (5.455px + 1.42041vw)/5*2)}
    [xl4-5]:not(x), [data-xl4-5]:not(x), r-c[xl4-5]:not(x) > *, [data-r-c][data-xl4-5] > * {width:calc(100%/5*4 - (5.455px + 1.42041vw)/5)}
    [xl1-6]:not(x), [data-xl1-6]:not(x), r-c[xl1-6]:not(x) > *, [data-r-c][data-xl1-6] > * {width:calc(100%/6 - (5.455px + 1.42041vw)/6*5)}
    [xl2-6]:not(x), [data-xl2-6]:not(x), r-c[xl2-6]:not(x) > *, [data-r-c][data-xl2-6] > * {width:calc(100%/6*2 - (5.455px + 1.42041vw)/6*4)}
    [xl3-6]:not(x), [data-xl3-6]:not(x), r-c[xl3-6]:not(x) > *, [data-r-c][data-xl3-6] > * {width:calc(50% - (5.455px + 1.42041vw)/2)}
    [xl4-6]:not(x), [data-xl4-6]:not(x), r-c[xl4-6]:not(x) > *, [data-r-c][data-xl4-6] > * {width:calc(100%/6*4 - (5.455px + 1.42041vw)/6*2)}
    [xl5-6]:not(x), [data-xl5-6]:not(x), r-c[xl5-6]:not(x) > *, [data-r-c][data-xl5-6] > * {width:calc(100%/6*5 - (5.455px + 1.42041vw)/6)}
    [xl1-7]:not(x), [data-xl1-7]:not(x), r-c[xl1-7]:not(x) > *, [data-r-c][data-xl1-7] > * {width:calc(100%/7 - (5.455px + 1.42041vw)/7*6)}
    [xl2-7]:not(x), [data-xl2-7]:not(x), r-c[xl2-7]:not(x) > *, [data-r-c][data-xl2-7] > * {width:calc(100%/7*2 - (5.455px + 1.42041vw)/7*5)}
    [xl3-7]:not(x), [data-xl3-7]:not(x), r-c[xl3-7]:not(x) > *, [data-r-c][data-xl3-7] > * {width:calc(100%/7*3 - (5.455px + 1.42041vw)/7*4)}
    [xl4-7]:not(x), [data-xl4-7]:not(x), r-c[xl4-7]:not(x) > *, [data-r-c][data-xl4-7] > * {width:calc(100%/7*4 - (5.455px + 1.42041vw)/7*3)}
    [xl5-7]:not(x), [data-xl5-7]:not(x), r-c[xl5-7]:not(x) > *, [data-r-c][data-xl5-7] > * {width:calc(100%/7*5 - (5.455px + 1.42041vw)/7*2)}
    [xl6-7]:not(x), [data-xl6-7]:not(x), r-c[xl6-7]:not(x) > *, [data-r-c][data-xl6-7] > * {width:calc(100%/7*6 - (5.455px + 1.42041vw)/7)}
    [xl1-8]:not(x), [data-xl1-8]:not(x), r-c[xl1-8]:not(x) > *, [data-r-c][data-xl1-8] > * {width:calc(100%/8 - (5.455px + 1.42041vw)/8*7)}
    [xl2-8]:not(x), [data-xl2-8]:not(x), r-c[xl2-8]:not(x) > *, [data-r-c][data-xl2-8] > * {width:calc(100%/8*2 - (5.455px + 1.42041vw)/8*6)}
    [xl3-8]:not(x), [data-xl3-8]:not(x), r-c[xl3-8]:not(x) > *, [data-r-c][data-xl3-8] > * {width:calc(100%/8*3 - (5.455px + 1.42041vw)/8*5)}
    [xl4-8]:not(x), [data-xl4-8]:not(x), r-c[xl4-8]:not(x) > *, [data-r-c][data-xl4-8] > * {width:calc(50% - (5.455px + 1.42041vw)/2)}
    [xl5-8]:not(x), [data-xl5-8]:not(x), r-c[xl5-8]:not(x) > *, [data-r-c][data-xl5-8] > * {width:calc(100%/8*5 - (5.455px + 1.42041vw)/8*3)}
    [xl6-8]:not(x), [data-xl6-8]:not(x), r-c[xl6-8]:not(x) > *, [data-r-c][data-xl6-8] > * {width:calc(100%/8*6 - (5.455px + 1.42041vw)/8*2)}
    [xl7-8]:not(x), [data-xl7-8]:not(x), r-c[xl7-8]:not(x) > *, [data-r-c][data-xl7-8] > * {width:calc(100%/8*7 - (5.455px + 1.42041vw)/8)}

    /* Column Widths (Joined) */
    [join] > [xl1-1], [join] > [data-xl1-1], [data-join] > [xl1-1], [data-join] > [data-xl1-1], [join][xl1-1]:not([r-c]) > *, [data-join][data-xl1-1]:not([x]) > * {width:100%}
    [join] > [xl1-2], [join] > [data-xl1-2], [data-join] > [xl1-2], [data-join] > [data-xl1-2], [join][xl1-2]:not([r-c]) > *, [data-join][data-xl1-2]:not([x]) > *,
    [join] > [xl2-4], [join] > [data-xl2-4], [data-join] > [xl2-4], [data-join] > [data-xl2-4], [join][xl2-4]:not([r-c]) > *, [data-join][data-xl2-4]:not([x]) > *,
    [join] > [xl3-6], [join] > [data-xl3-6], [data-join] > [xl3-6], [data-join] > [data-xl3-6], [join][xl3-6]:not([r-c]) > *, [data-join][data-xl3-6]:not([x]) > *,
    [join] > [xl4-8], [join] > [data-xl4-8], [data-join] > [xl4-8], [data-join] > [data-xl4-8], [join][xl4-8]:not([r-c]) > *, [data-join][data-xl4-8]:not([x]) > * {width:50%}
    [join] > [xl1-3], [join] > [data-xl1-3], [data-join] > [xl1-3], [data-join] > [data-xl1-3], [join][xl1-3]:not([r-c]) > *, [data-join][data-xl1-3]:not([x]) > *,
    [join] > [xl2-6], [join] > [data-xl2-6], [data-join] > [xl2-6], [data-join] > [data-xl2-6], [join][xl2-6]:not([r-c]) > *, [data-join][data-xl2-6]:not([x]) > * {width:calc(100%/3)}
    [join] > [xl2-3], [join] > [data-xl2-3], [data-join] > [xl2-3], [data-join] > [data-xl2-3], [join][xl2-3]:not([r-c]) > *, [data-join][data-xl2-3]:not([x]) > *,
    [join] > [xl4-6], [join] > [data-xl4-6], [data-join] > [xl4-6], [data-join] > [data-xl4-6], [join][xl4-6]:not([r-c]) > *, [data-join][data-xl4-6]:not([x]) > * {width:calc(100%/3*2)}
    [join] > [xl1-4], [join] > [data-xl1-4], [data-join] > [xl1-4], [data-join] > [data-xl1-4], [join][xl1-4]:not([r-c]) > *, [data-join][data-xl1-4]:not([x]) > *,
    [join] > [xl2-8], [join] > [data-xl2-8], [data-join] > [xl2-8], [data-join] > [data-xl2-8], [join][xl2-8]:not([r-c]) > *, [data-join][data-xl2-8]:not([x]) > * {width:25%}
    [join] > [xl3-4], [join] > [data-xl3-4], [data-join] > [xl3-4], [data-join] > [data-xl3-4], [join][xl3-4]:not([r-c]) > *, [data-join][data-xl3-4]:not([x]) > *,
    [join] > [xl6-8], [join] > [data-xl6-8], [data-join] > [xl6-8], [data-join] > [data-xl6-8], [join][xl6-8]:not([r-c]) > *, [data-join][data-xl6-8]:not([x]) > * {width:75%}
    [join] > [xl1-5], [join] > [data-xl1-5], [data-join] > [xl1-5], [data-join] > [data-xl1-5], [join][xl1-5]:not([r-c]) > *, [data-join][data-xl1-5]:not([x]) > * {width:20%}
    [join] > [xl2-5], [join] > [data-xl2-5], [data-join] > [xl2-5], [data-join] > [data-xl2-5], [join][xl2-5]:not([r-c]) > *, [data-join][data-xl2-5]:not([x]) > * {width:40%}
    [join] > [xl3-5], [join] > [data-xl3-5], [data-join] > [xl3-5], [data-join] > [data-xl3-5], [join][xl3-5]:not([r-c]) > *, [data-join][data-xl3-5]:not([x]) > * {width:60%}
    [join] > [xl4-5], [join] > [data-xl4-5], [data-join] > [xl4-5], [data-join] > [data-xl4-5], [join][xl4-5]:not([r-c]) > *, [data-join][data-xl4-5]:not([x]) > * {width:80%}
    [join] > [xl1-6], [join] > [data-xl1-6], [data-join] > [xl1-6], [data-join] > [data-xl1-6], [join][xl1-6]:not([r-c]) > *, [data-join][data-xl1-6]:not([x]) > * {width:calc(100%/6)}
    [join] > [xl5-6], [join] > [data-xl5-6], [data-join] > [xl5-6], [data-join] > [data-xl5-6], [join][xl5-6]:not([r-c]) > *, [data-join][data-xl5-6]:not([x]) > * {width:calc(100%/6*5)}
    [join] > [xl1-7], [join] > [data-xl1-7], [data-join] > [xl1-7], [data-join] > [data-xl1-7], [join][xl1-7]:not([r-c]) > *, [data-join][data-xl1-7]:not([x]) > * {width:calc(100%/7)}
    [join] > [xl2-7], [join] > [data-xl2-7], [data-join] > [xl2-7], [data-join] > [data-xl2-7], [join][xl2-7]:not([r-c]) > *, [data-join][data-xl2-7]:not([x]) > * {width:calc(100%/7*2)}
    [join] > [xl3-7], [join] > [data-xl3-7], [data-join] > [xl3-7], [data-join] > [data-xl3-7], [join][xl3-7]:not([r-c]) > *, [data-join][data-xl3-7]:not([x]) > * {width:calc(100%/7*3)}
    [join] > [xl4-7], [join] > [data-xl4-7], [data-join] > [xl4-7], [data-join] > [data-xl4-7], [join][xl4-7]:not([r-c]) > *, [data-join][data-xl4-7]:not([x]) > * {width:calc(100%/7*4)}
    [join] > [xl5-7], [join] > [data-xl5-7], [data-join] > [xl5-7], [data-join] > [data-xl5-7], [join][xl5-7]:not([r-c]) > *, [data-join][data-xl5-7]:not([x]) > * {width:calc(100%/7*5)}
    [join] > [xl6-7], [join] > [data-xl6-7], [data-join] > [xl6-7], [data-join] > [data-xl6-7], [join][xl6-7]:not([r-c]) > *, [data-join][data-xl6-7]:not([x]) > * {width:calc(100%/7*6)}
    [join] > [xl1-8], [join] > [data-xl1-8], [data-join] > [xl1-8], [data-join] > [data-xl1-8], [join][xl1-8]:not([r-c]) > *, [data-join][data-xl1-8]:not([x]) > * {width:calc(100%/8)}
    [join] > [xl3-8], [join] > [data-xl3-8], [data-join] > [xl3-8], [data-join] > [data-xl3-8], [join][xl3-8]:not([r-c]) > *, [data-join][data-xl3-8]:not([x]) > * {width:calc(100%/8*3)}
    [join] > [xl5-8], [join] > [data-xl5-8], [data-join] > [xl5-8], [data-join] > [data-xl5-8], [join][xl5-8]:not([r-c]) > *, [data-join][data-xl5-8]:not([x]) > * {width:calc(100%/8*5)}
    [join] > [xl7-8], [join] > [data-xl7-8], [data-join] > [xl7-8], [data-join] > [data-xl7-8], [join][xl7-8]:not([r-c]) > *, [data-join][data-xl7-8]:not([x]) > * {width:calc(100%/8*7)}

    /* Column Ordering */
    [xl1], [data-xl1] {order:-8}
    [xl2], [data-xl2] {order:-7}
    [xl3], [data-xl3] {order:-6}
    [xl4], [data-xl4] {order:-5}
    [xl5], [data-xl5] {order:-4}
    [xl6], [data-xl6] {order:-3}
    [xl7], [data-xl7] {order:-2}
    [xl8], [data-xl8] {order:-1}
}