Before installing XTable dependencies

This commit is contained in:
Your Name 2021-12-07 17:01:37 +03:30
parent bfbd80a253
commit 8c87d05193
10 changed files with 1278 additions and 118 deletions

View File

@ -1,5 +1,5 @@
module.exports = {
presets: [
'@vue/cli-plugin-babel/preset',
],
presets: [
'@vue/cli-plugin-babel/preset',
],
}

View File

@ -5,6 +5,8 @@ NOTE:
PLACE HERE YOUR OWN SCSS CODES AND IF NEEDED, OVERRIDE THE STYLES FROM THE OTHER STYLESHEETS.
WE WILL RELEASE FUTURE UPDATES SO IN ORDER TO NOT OVERWRITE YOUR STYLES IT'S BETTER LIKE THIS. */
@import "utility-classes/spacing/space-between.scss";
@font-face {
font-family: "roboto";
src: url("../fonts/roboto/roboto-thin.ttf");
@ -115,7 +117,7 @@ body {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1rem;
background-color: white;

View File

@ -0,0 +1,890 @@
/*******************************************************************************
* Space Between: *
* A bunch of utility classes for controlling the space between child elements.*
* *
* Description: *
* - The sx{amount} series of classes control the horizontal space between *
* child elements. *
* - The sy{amount} series of classes control the vertical space between child *
* elements. *
* - If your elements are in reverse order (e.g. using "flex=row_reverse"), *
* use the 'sx_reverse' or 'sy_reverese" classes to ensure the space is *
* added to the correct side each element. *
* *
* Limitations: *
* These utility classes are really just a shortcut for adding margin to all *
* but the first item in a group, and aren't designed to handle complex cases *
* like grids, layouts that wrap, or situations where the children are rendered*
* in a complex custom order rather than their natural DOM order. *
* For those situations, it's better to use the gap utility classes when *
* possible, or add margin to every element with a matching negative margin on *
* the parent. *
* Also these classes are not designed to work together with the divide *
* utility classes. For those situations, consider adding margin/padding *
* classes to the children instead. *
* *
* Implementation: *
* Note that the 'sx_reverse' and 'sy_reverse' classes must be defined after *
* their corresponding classes, otherwise, the reverse variants will not work. *
*******************************************************************************/
/**********************/
/* Horizontal Spacing */
/**********************/
.sx-96 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-24rem * var(--sx-reverse)); margin-left: calc(-24rem * calc(1 - var(--sx-reverse))); }
.sx-80 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-20rem * var(--sx-reverse)); margin-left: calc(-20rem * calc(1 - var(--sx-reverse))); }
.sx-72 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-18rem * var(--sx-reverse)); margin-left: calc(-18rem * calc(1 - var(--sx-reverse))); }
.sx-64 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-16rem * var(--sx-reverse)); margin-left: calc(-16rem * calc(1 - var(--sx-reverse))); }
.sx-60 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-15rem * var(--sx-reverse)); margin-left: calc(-15rem * calc(1 - var(--sx-reverse))); }
.sx-56 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-14rem * var(--sx-reverse)); margin-left: calc(-14rem * calc(1 - var(--sx-reverse))); }
.sx-52 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-13rem * var(--sx-reverse)); margin-left: calc(-13rem * calc(1 - var(--sx-reverse))); }
.sx-48 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-12rem * var(--sx-reverse)); margin-left: calc(-12rem * calc(1 - var(--sx-reverse))); }
.sx-44 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-11rem * var(--sx-reverse)); margin-left: calc(-11rem * calc(1 - var(--sx-reverse))); }
.sx-40 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-10rem * var(--sx-reverse)); margin-left: calc(-10rem * calc(1 - var(--sx-reverse))); }
.sx-36 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-9rem * var(--sx-reverse)); margin-left: calc(-9rem * calc(1 - var(--sx-reverse))); }
.sx-32 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-8rem * var(--sx-reverse)); margin-left: calc(-8rem * calc(1 - var(--sx-reverse))); }
.sx-28 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-7rem * var(--sx-reverse)); margin-left: calc(-7rem * calc(1 - var(--sx-reverse))); }
.sx-24 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-6rem * var(--sx-reverse)); margin-left: calc(-6rem * calc(1 - var(--sx-reverse))); }
.sx-20 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-5rem * var(--sx-reverse)); margin-left: calc(-5rem * calc(1 - var(--sx-reverse))); }
.sx-16 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-4rem * var(--sx-reverse)); margin-left: calc(-4rem * calc(1 - var(--sx-reverse))); }
.sx-14 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-3.5rem * var(--sx-reverse)); margin-left: calc(-3.5rem * calc(1 - var(--sx-reverse))); }
.sx-12 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-3rem * var(--sx-reverse)); margin-left: calc(-3rem * calc(1 - var(--sx-reverse))); }
.sx-11 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2.75rem * var(--sx-reverse)); margin-left: calc(-2.75rem * calc(1 - var(--sx-reverse))); }
.sx-10 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2.5rem * var(--sx-reverse)); margin-left: calc(-2.5rem * calc(1 - var(--sx-reverse))); }
.sx-9 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2.25rem * var(--sx-reverse)); margin-left: calc(-2.25rem * calc(1 - var(--sx-reverse))); }
.sx-8 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2rem * var(--sx-reverse)); margin-left: calc(-2rem * calc(1 - var(--sx-reverse))); }
.sx-7 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1.75rem * var(--sx-reverse)); margin-left: calc(-1.75rem * calc(1 - var(--sx-reverse))); }
.sx-6 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1.5rem * var(--sx-reverse)); margin-left: calc(-1.5rem * calc(1 - var(--sx-reverse))); }
.sx-5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1.25rem * var(--sx-reverse)); margin-left: calc(-1.25rem * calc(1 - var(--sx-reverse))); }
.sx-4 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1rem * var(--sx-reverse)); margin-left: calc(-1rem * calc(1 - var(--sx-reverse))); }
.sx-3\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.875rem * var(--sx-reverse)); margin-left: calc(-0.875rem * calc(1 - var(--sx-reverse))); }
.sx-3 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.75rem * var(--sx-reverse)); margin-left: calc(-0.75rem * calc(1 - var(--sx-reverse))); }
.sx-2\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.625rem * var(--sx-reverse)); margin-left: calc(-0.625rem * calc(1 - var(--sx-reverse))); }
.sx-2 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.5rem * var(--sx-reverse)); margin-left: calc(-0.5rem * calc(1 - var(--sx-reverse))); }
.sx-1\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.375rem * var(--sx-reverse)); margin-left: calc(-0.375rem * calc(1 - var(--sx-reverse))); }
.sx-1 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.25rem * var(--sx-reverse)); margin-left: calc(-0.25rem * calc(1 - var(--sx-reverse))); }
.sx-0\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.125rem * var(--sx-reverse)); margin-left: calc(-0.125rem * calc(1 - var(--sx-reverse))); }
.sx0 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0 * var(--sx-reverse)); margin-left: calc(0 * calc(1 - var(--sx-reverse))); }
.sx0\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.125rem * var(--sx-reverse)); margin-left: calc(0.125rem * calc(1 - var(--sx-reverse))); }
.sx1 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.25rem * var(--sx-reverse)); margin-left: calc(0.25rem * calc(1 - var(--sx-reverse))); }
.sx1\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.375rem * var(--sx-reverse)); margin-left: calc(0.375rem * calc(1 - var(--sx-reverse))); }
.sx2 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.5rem * var(--sx-reverse)); margin-left: calc(0.5rem * calc(1 - var(--sx-reverse))); }
.sx2\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.625rem * var(--sx-reverse)); margin-left: calc(0.625rem * calc(1 - var(--sx-reverse))); }
.sx3 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.75rem * var(--sx-reverse)); margin-left: calc(0.75rem * calc(1 - var(--sx-reverse))); }
.sx3\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.875rem * var(--sx-reverse)); margin-left: calc(0.875rem * calc(1 - var(--sx-reverse))); }
.sx4 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1rem * var(--sx-reverse)); margin-left: calc(1rem * calc(1 - var(--sx-reverse))); }
.sx5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1.25rem * var(--sx-reverse)); margin-left: calc(1.25rem * calc(1 - var(--sx-reverse))); }
.sx6 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1.5rem * var(--sx-reverse)); margin-left: calc(1.5rem * calc(1 - var(--sx-reverse))); }
.sx7 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1.75rem * var(--sx-reverse)); margin-left: calc(1.75rem * calc(1 - var(--sx-reverse))); }
.sx8 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2rem * var(--sx-reverse)); margin-left: calc(2rem * calc(1 - var(--sx-reverse))); }
.sx9 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2.25rem * var(--sx-reverse)); margin-left: calc(2.25rem * calc(1 - var(--sx-reverse))); }
.sx10 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2.5rem * var(--sx-reverse)); margin-left: calc(2.5rem * calc(1 - var(--sx-reverse))); }
.sx11 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2.75rem * var(--sx-reverse)); margin-left: calc(2.75rem * calc(1 - var(--sx-reverse))); }
.sx12 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(3rem * var(--sx-reverse)); margin-left: calc(3rem * calc(1 - var(--sx-reverse))); }
.sx14 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(3.5rem * var(--sx-reverse)); margin-left: calc(3.5rem * calc(1 - var(--sx-reverse))); }
.sx16 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(4rem * var(--sx-reverse)); margin-left: calc(4rem * calc(1 - var(--sx-reverse))); }
.sx20 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(5rem * var(--sx-reverse)); margin-left: calc(5rem * calc(1 - var(--sx-reverse))); }
.sx24 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(6rem * var(--sx-reverse)); margin-left: calc(6rem * calc(1 - var(--sx-reverse))); }
.sx28 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(7rem * var(--sx-reverse)); margin-left: calc(7rem * calc(1 - var(--sx-reverse))); }
.sx32 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(8rem * var(--sx-reverse)); margin-left: calc(8rem * calc(1 - var(--sx-reverse))); }
.sx36 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(9rem * var(--sx-reverse)); margin-left: calc(9rem * calc(1 - var(--sx-reverse))); }
.sx40 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(10rem * var(--sx-reverse)); margin-left: calc(10rem * calc(1 - var(--sx-reverse))); }
.sx44 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(11rem * var(--sx-reverse)); margin-left: calc(11rem * calc(1 - var(--sx-reverse))); }
.sx48 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(12rem * var(--sx-reverse)); margin-left: calc(12rem * calc(1 - var(--sx-reverse))); }
.sx52 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(13rem * var(--sx-reverse)); margin-left: calc(13rem * calc(1 - var(--sx-reverse))); }
.sx56 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(14rem * var(--sx-reverse)); margin-left: calc(14rem * calc(1 - var(--sx-reverse))); }
.sx60 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(15rem * var(--sx-reverse)); margin-left: calc(15rem * calc(1 - var(--sx-reverse))); }
.sx64 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(16rem * var(--sx-reverse)); margin-left: calc(16rem * calc(1 - var(--sx-reverse))); }
.sx72 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(18rem * var(--sx-reverse)); margin-left: calc(18rem * calc(1 - var(--sx-reverse))); }
.sx80 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(20rem * var(--sx-reverse)); margin-left: calc(20rem * calc(1 - var(--sx-reverse))); }
.sx96 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(24rem * var(--sx-reverse)); margin-left: calc(24rem * calc(1 - var(--sx-reverse))); }
.sx1px > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1px * var(--sx-reverse)); margin-left: calc(1px * calc(1 - var(--sx-reverse))); }
.sx_reverse > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 1; }
/********************/
/* Vertical Spacing */
/********************/
.sy-96 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-24rem * var(--sy-reverse)); margin-top: calc(-24rem * calc(1 - var(--sy-reverse))); }
.sy-80 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-20rem * var(--sy-reverse)); margin-top: calc(-20rem * calc(1 - var(--sy-reverse))); }
.sy-72 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-18rem * var(--sy-reverse)); margin-top: calc(-18rem * calc(1 - var(--sy-reverse))); }
.sy-64 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-16rem * var(--sy-reverse)); margin-top: calc(-16rem * calc(1 - var(--sy-reverse))); }
.sy-60 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-15rem * var(--sy-reverse)); margin-top: calc(-15rem * calc(1 - var(--sy-reverse))); }
.sy-56 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-14rem * var(--sy-reverse)); margin-top: calc(-14rem * calc(1 - var(--sy-reverse))); }
.sy-52 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-13rem * var(--sy-reverse)); margin-top: calc(-13rem * calc(1 - var(--sy-reverse))); }
.sy-48 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-12rem * var(--sy-reverse)); margin-top: calc(-12rem * calc(1 - var(--sy-reverse))); }
.sy-44 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-11rem * var(--sy-reverse)); margin-top: calc(-11rem * calc(1 - var(--sy-reverse))); }
.sy-40 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-10rem * var(--sy-reverse)); margin-top: calc(-10rem * calc(1 - var(--sy-reverse))); }
.sy-36 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-9rem * var(--sy-reverse)); margin-top: calc(-9rem * calc(1 - var(--sy-reverse))); }
.sy-32 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-8rem * var(--sy-reverse)); margin-top: calc(-8rem * calc(1 - var(--sy-reverse))); }
.sy-28 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-7rem * var(--sy-reverse)); margin-top: calc(-7rem * calc(1 - var(--sy-reverse))); }
.sy-24 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-6rem * var(--sy-reverse)); margin-top: calc(-6rem * calc(1 - var(--sy-reverse))); }
.sy-20 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-5rem * var(--sy-reverse)); margin-top: calc(-5rem * calc(1 - var(--sy-reverse))); }
.sy-16 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-4rem * var(--sy-reverse)); margin-top: calc(-4rem * calc(1 - var(--sy-reverse))); }
.sy-14 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-3.5rem * var(--sy-reverse)); margin-top: calc(-3.5rem * calc(1 - var(--sy-reverse))); }
.sy-12 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-3rem * var(--sy-reverse)); margin-top: calc(-3rem * calc(1 - var(--sy-reverse))); }
.sy-11 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2.75rem * var(--sy-reverse)); margin-top: calc(-2.75rem * calc(1 - var(--sy-reverse))); }
.sy-10 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2.5rem * var(--sy-reverse)); margin-top: calc(-2.5rem * calc(1 - var(--sy-reverse))); }
.sy-9 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2.25rem * var(--sy-reverse)); margin-top: calc(-2.25rem * calc(1 - var(--sy-reverse))); }
.sy-8 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2rem * var(--sy-reverse)); margin-top: calc(-2rem * calc(1 - var(--sy-reverse))); }
.sy-7 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1.75rem * var(--sy-reverse)); margin-top: calc(-1.75rem * calc(1 - var(--sy-reverse))); }
.sy-6 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1.5rem * var(--sy-reverse)); margin-top: calc(-1.5rem * calc(1 - var(--sy-reverse))); }
.sy-5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1.25rem * var(--sy-reverse)); margin-top: calc(-1.25rem * calc(1 - var(--sy-reverse))); }
.sy-4 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1rem * var(--sy-reverse)); margin-top: calc(-1rem * calc(1 - var(--sy-reverse))); }
.sy-3\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.875rem * var(--sy-reverse)); margin-top: calc(-0.875rem * calc(1 - var(--sy-reverse))); }
.sy-3 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.75rem * var(--sy-reverse)); margin-top: calc(-0.75rem * calc(1 - var(--sy-reverse))); }
.sy-2\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.625rem * var(--sy-reverse)); margin-top: calc(-0.625rem * calc(1 - var(--sy-reverse))); }
.sy-2 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.5rem * var(--sy-reverse)); margin-top: calc(-0.5rem * calc(1 - var(--sy-reverse))); }
.sy-1\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.375rem * var(--sy-reverse)); margin-top: calc(-0.375rem * calc(1 - var(--sy-reverse))); }
.sy-1 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.25rem * var(--sy-reverse)); margin-top: calc(-0.25rem * calc(1 - var(--sy-reverse))); }
.sy-0\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.125rem * var(--sy-reverse)); margin-top: calc(-0.125rem * calc(1 - var(--sy-reverse))); }
.sy0 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0 * var(--sy-reverse)); margin-top: calc(0 * calc(1 - var(--sy-reverse))); }
.sy0\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.125rem * var(--sy-reverse)); margin-top: calc(0.125rem * calc(1 - var(--sy-reverse))); }
.sy1 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.25rem * var(--sy-reverse)); margin-top: calc(0.25rem * calc(1 - var(--sy-reverse))); }
.sy1\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.375rem * var(--sy-reverse)); margin-top: calc(0.375rem * calc(1 - var(--sy-reverse))); }
.sy2 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.5rem * var(--sy-reverse)); margin-top: calc(0.5rem * calc(1 - var(--sy-reverse))); }
.sy2\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.625rem * var(--sy-reverse)); margin-top: calc(0.625rem * calc(1 - var(--sy-reverse))); }
.sy3 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.75rem * var(--sy-reverse)); margin-top: calc(0.75rem * calc(1 - var(--sy-reverse))); }
.sy3\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.875rem * var(--sy-reverse)); margin-top: calc(0.875rem * calc(1 - var(--sy-reverse))); }
.sy4 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1rem * var(--sy-reverse)); margin-top: calc(1rem * calc(1 - var(--sy-reverse))); }
.sy5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1.25rem * var(--sy-reverse)); margin-top: calc(1.25rem * calc(1 - var(--sy-reverse))); }
.sy6 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1.5rem * var(--sy-reverse)); margin-top: calc(1.5rem * calc(1 - var(--sy-reverse))); }
.sy7 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1.75rem * var(--sy-reverse)); margin-top: calc(1.75rem * calc(1 - var(--sy-reverse))); }
.sy8 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2rem * var(--sy-reverse)); margin-top: calc(2rem * calc(1 - var(--sy-reverse))); }
.sy9 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2.25rem * var(--sy-reverse)); margin-top: calc(2.25rem * calc(1 - var(--sy-reverse))); }
.sy10 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2.5rem * var(--sy-reverse)); margin-top: calc(2.5rem * calc(1 - var(--sy-reverse))); }
.sy11 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2.75rem * var(--sy-reverse)); margin-top: calc(2.75rem * calc(1 - var(--sy-reverse))); }
.sy12 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(3rem * var(--sy-reverse)); margin-top: calc(3rem * calc(1 - var(--sy-reverse))); }
.sy14 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(3.5rem * var(--sy-reverse)); margin-top: calc(3.5rem * calc(1 - var(--sy-reverse))); }
.sy16 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(4rem * var(--sy-reverse)); margin-top: calc(4rem * calc(1 - var(--sy-reverse))); }
.sy20 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(5rem * var(--sy-reverse)); margin-top: calc(5rem * calc(1 - var(--sy-reverse))); }
.sy24 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(6rem * var(--sy-reverse)); margin-top: calc(6rem * calc(1 - var(--sy-reverse))); }
.sy28 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(7rem * var(--sy-reverse)); margin-top: calc(7rem * calc(1 - var(--sy-reverse))); }
.sy32 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(8rem * var(--sy-reverse)); margin-top: calc(8rem * calc(1 - var(--sy-reverse))); }
.sy36 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(9rem * var(--sy-reverse)); margin-top: calc(9rem * calc(1 - var(--sy-reverse))); }
.sy40 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(10rem * var(--sy-reverse)); margin-top: calc(10rem * calc(1 - var(--sy-reverse))); }
.sy44 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(11rem * var(--sy-reverse)); margin-top: calc(11rem * calc(1 - var(--sy-reverse))); }
.sy48 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(12rem * var(--sy-reverse)); margin-top: calc(12rem * calc(1 - var(--sy-reverse))); }
.sy52 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(13rem * var(--sy-reverse)); margin-top: calc(13rem * calc(1 - var(--sy-reverse))); }
.sy56 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(14rem * var(--sy-reverse)); margin-top: calc(14rem * calc(1 - var(--sy-reverse))); }
.sy60 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(15rem * var(--sy-reverse)); margin-top: calc(15rem * calc(1 - var(--sy-reverse))); }
.sy64 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(16rem * var(--sy-reverse)); margin-top: calc(16rem * calc(1 - var(--sy-reverse))); }
.sy72 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(18rem * var(--sy-reverse)); margin-top: calc(18rem * calc(1 - var(--sy-reverse))); }
.sy80 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(20rem * var(--sy-reverse)); margin-top: calc(20rem * calc(1 - var(--sy-reverse))); }
.sy96 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(24rem * var(--sy-reverse)); margin-top: calc(24rem * calc(1 - var(--sy-reverse))); }
.sy1px > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1px * var(--sx-reverse)); margin-top: calc(1px * calc(1 - var(--sy-reverse))); }
.sy_reverse > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 1; }
/***********************/
/* Responsive Variants */
/***********************/
@media (min-width: 576px) {
.sm\:sx-96 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-24rem * var(--sx-reverse)); margin-left: calc(-24rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-80 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-20rem * var(--sx-reverse)); margin-left: calc(-20rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-72 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-18rem * var(--sx-reverse)); margin-left: calc(-18rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-64 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-16rem * var(--sx-reverse)); margin-left: calc(-16rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-60 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-15rem * var(--sx-reverse)); margin-left: calc(-15rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-56 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-14rem * var(--sx-reverse)); margin-left: calc(-14rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-52 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-13rem * var(--sx-reverse)); margin-left: calc(-13rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-48 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-12rem * var(--sx-reverse)); margin-left: calc(-12rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-44 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-11rem * var(--sx-reverse)); margin-left: calc(-11rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-40 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-10rem * var(--sx-reverse)); margin-left: calc(-10rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-36 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-9rem * var(--sx-reverse)); margin-left: calc(-9rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-32 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-8rem * var(--sx-reverse)); margin-left: calc(-8rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-28 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-7rem * var(--sx-reverse)); margin-left: calc(-7rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-24 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-6rem * var(--sx-reverse)); margin-left: calc(-6rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-20 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-5rem * var(--sx-reverse)); margin-left: calc(-5rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-16 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-4rem * var(--sx-reverse)); margin-left: calc(-4rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-14 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-3.5rem * var(--sx-reverse)); margin-left: calc(-3.5rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-12 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-3rem * var(--sx-reverse)); margin-left: calc(-3rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-11 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2.75rem * var(--sx-reverse)); margin-left: calc(-2.75rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-10 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2.5rem * var(--sx-reverse)); margin-left: calc(-2.5rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-9 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2.25rem * var(--sx-reverse)); margin-left: calc(-2.25rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-8 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2rem * var(--sx-reverse)); margin-left: calc(-2rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-7 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1.75rem * var(--sx-reverse)); margin-left: calc(-1.75rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-6 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1.5rem * var(--sx-reverse)); margin-left: calc(-1.5rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1.25rem * var(--sx-reverse)); margin-left: calc(-1.25rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-4 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1rem * var(--sx-reverse)); margin-left: calc(-1rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-3\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.875rem * var(--sx-reverse)); margin-left: calc(-0.875rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-3 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.75rem * var(--sx-reverse)); margin-left: calc(-0.75rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-2\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.625rem * var(--sx-reverse)); margin-left: calc(-0.625rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-2 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.5rem * var(--sx-reverse)); margin-left: calc(-0.5rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-1\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.375rem * var(--sx-reverse)); margin-left: calc(-0.375rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-1 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.25rem * var(--sx-reverse)); margin-left: calc(-0.25rem * calc(1 - var(--sx-reverse))); }
.sm\:sx-0\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.125rem * var(--sx-reverse)); margin-left: calc(-0.125rem * calc(1 - var(--sx-reverse))); }
.sm\:sx0 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0 * var(--sx-reverse)); margin-left: calc(0 * calc(1 - var(--sx-reverse))); }
.sm\:sx0\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.125rem * var(--sx-reverse)); margin-left: calc(0.125rem * calc(1 - var(--sx-reverse))); }
.sm\:sx1 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.25rem * var(--sx-reverse)); margin-left: calc(0.25rem * calc(1 - var(--sx-reverse))); }
.sm\:sx1\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.375rem * var(--sx-reverse)); margin-left: calc(0.375rem * calc(1 - var(--sx-reverse))); }
.sm\:sx2 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.5rem * var(--sx-reverse)); margin-left: calc(0.5rem * calc(1 - var(--sx-reverse))); }
.sm\:sx2\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.625rem * var(--sx-reverse)); margin-left: calc(0.625rem * calc(1 - var(--sx-reverse))); }
.sm\:sx3 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.75rem * var(--sx-reverse)); margin-left: calc(0.75rem * calc(1 - var(--sx-reverse))); }
.sm\:sx3\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.875rem * var(--sx-reverse)); margin-left: calc(0.875rem * calc(1 - var(--sx-reverse))); }
.sm\:sx4 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1rem * var(--sx-reverse)); margin-left: calc(1rem * calc(1 - var(--sx-reverse))); }
.sm\:sx5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1.25rem * var(--sx-reverse)); margin-left: calc(1.25rem * calc(1 - var(--sx-reverse))); }
.sm\:sx6 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1.5rem * var(--sx-reverse)); margin-left: calc(1.5rem * calc(1 - var(--sx-reverse))); }
.sm\:sx7 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1.75rem * var(--sx-reverse)); margin-left: calc(1.75rem * calc(1 - var(--sx-reverse))); }
.sm\:sx8 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2rem * var(--sx-reverse)); margin-left: calc(2rem * calc(1 - var(--sx-reverse))); }
.sm\:sx9 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2.25rem * var(--sx-reverse)); margin-left: calc(2.25rem * calc(1 - var(--sx-reverse))); }
.sm\:sx10 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2.5rem * var(--sx-reverse)); margin-left: calc(2.5rem * calc(1 - var(--sx-reverse))); }
.sm\:sx11 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2.75rem * var(--sx-reverse)); margin-left: calc(2.75rem * calc(1 - var(--sx-reverse))); }
.sm\:sx12 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(3rem * var(--sx-reverse)); margin-left: calc(3rem * calc(1 - var(--sx-reverse))); }
.sm\:sx14 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(3.5rem * var(--sx-reverse)); margin-left: calc(3.5rem * calc(1 - var(--sx-reverse))); }
.sm\:sx16 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(4rem * var(--sx-reverse)); margin-left: calc(4rem * calc(1 - var(--sx-reverse))); }
.sm\:sx20 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(5rem * var(--sx-reverse)); margin-left: calc(5rem * calc(1 - var(--sx-reverse))); }
.sm\:sx24 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(6rem * var(--sx-reverse)); margin-left: calc(6rem * calc(1 - var(--sx-reverse))); }
.sm\:sx28 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(7rem * var(--sx-reverse)); margin-left: calc(7rem * calc(1 - var(--sx-reverse))); }
.sm\:sx32 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(8rem * var(--sx-reverse)); margin-left: calc(8rem * calc(1 - var(--sx-reverse))); }
.sm\:sx36 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(9rem * var(--sx-reverse)); margin-left: calc(9rem * calc(1 - var(--sx-reverse))); }
.sm\:sx40 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(10rem * var(--sx-reverse)); margin-left: calc(10rem * calc(1 - var(--sx-reverse))); }
.sm\:sx44 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(11rem * var(--sx-reverse)); margin-left: calc(11rem * calc(1 - var(--sx-reverse))); }
.sm\:sx48 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(12rem * var(--sx-reverse)); margin-left: calc(12rem * calc(1 - var(--sx-reverse))); }
.sm\:sx52 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(13rem * var(--sx-reverse)); margin-left: calc(13rem * calc(1 - var(--sx-reverse))); }
.sm\:sx56 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(14rem * var(--sx-reverse)); margin-left: calc(14rem * calc(1 - var(--sx-reverse))); }
.sm\:sx60 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(15rem * var(--sx-reverse)); margin-left: calc(15rem * calc(1 - var(--sx-reverse))); }
.sm\:sx64 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(16rem * var(--sx-reverse)); margin-left: calc(16rem * calc(1 - var(--sx-reverse))); }
.sm\:sx72 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(18rem * var(--sx-reverse)); margin-left: calc(18rem * calc(1 - var(--sx-reverse))); }
.sm\:sx80 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(20rem * var(--sx-reverse)); margin-left: calc(20rem * calc(1 - var(--sx-reverse))); }
.sm\:sx96 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(24rem * var(--sx-reverse)); margin-left: calc(24rem * calc(1 - var(--sx-reverse))); }
.sm\:sx1px > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1px * var(--sx-reverse)); margin-left: calc(1px * calc(1 - var(--sx-reverse))); }
.sm\:sx_reverse > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 1; }
.sm\:sy-96 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-24rem * var(--sy-reverse)); margin-top: calc(-24rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-80 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-20rem * var(--sy-reverse)); margin-top: calc(-20rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-72 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-18rem * var(--sy-reverse)); margin-top: calc(-18rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-64 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-16rem * var(--sy-reverse)); margin-top: calc(-16rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-60 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-15rem * var(--sy-reverse)); margin-top: calc(-15rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-56 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-14rem * var(--sy-reverse)); margin-top: calc(-14rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-52 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-13rem * var(--sy-reverse)); margin-top: calc(-13rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-48 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-12rem * var(--sy-reverse)); margin-top: calc(-12rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-44 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-11rem * var(--sy-reverse)); margin-top: calc(-11rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-40 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-10rem * var(--sy-reverse)); margin-top: calc(-10rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-36 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-9rem * var(--sy-reverse)); margin-top: calc(-9rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-32 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-8rem * var(--sy-reverse)); margin-top: calc(-8rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-28 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-7rem * var(--sy-reverse)); margin-top: calc(-7rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-24 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-6rem * var(--sy-reverse)); margin-top: calc(-6rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-20 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-5rem * var(--sy-reverse)); margin-top: calc(-5rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-16 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-4rem * var(--sy-reverse)); margin-top: calc(-4rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-14 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-3.5rem * var(--sy-reverse)); margin-top: calc(-3.5rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-12 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-3rem * var(--sy-reverse)); margin-top: calc(-3rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-11 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2.75rem * var(--sy-reverse)); margin-top: calc(-2.75rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-10 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2.5rem * var(--sy-reverse)); margin-top: calc(-2.5rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-9 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2.25rem * var(--sy-reverse)); margin-top: calc(-2.25rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-8 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2rem * var(--sy-reverse)); margin-top: calc(-2rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-7 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1.75rem * var(--sy-reverse)); margin-top: calc(-1.75rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-6 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1.5rem * var(--sy-reverse)); margin-top: calc(-1.5rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1.25rem * var(--sy-reverse)); margin-top: calc(-1.25rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-4 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1rem * var(--sy-reverse)); margin-top: calc(-1rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-3\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.875rem * var(--sy-reverse)); margin-top: calc(-0.875rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-3 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.75rem * var(--sy-reverse)); margin-top: calc(-0.75rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-2\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.625rem * var(--sy-reverse)); margin-top: calc(-0.625rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-2 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.5rem * var(--sy-reverse)); margin-top: calc(-0.5rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-1\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.375rem * var(--sy-reverse)); margin-top: calc(-0.375rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-1 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.25rem * var(--sy-reverse)); margin-top: calc(-0.25rem * calc(1 - var(--sy-reverse))); }
.sm\:sy-0\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.125rem * var(--sy-reverse)); margin-top: calc(-0.125rem * calc(1 - var(--sy-reverse))); }
.sm\:sy0 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0 * var(--sy-reverse)); margin-top: calc(0 * calc(1 - var(--sy-reverse))); }
.sm\:sy0\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.125rem * var(--sy-reverse)); margin-top: calc(0.125rem * calc(1 - var(--sy-reverse))); }
.sm\:sy1 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.25rem * var(--sy-reverse)); margin-top: calc(0.25rem * calc(1 - var(--sy-reverse))); }
.sm\:sy1\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.375rem * var(--sy-reverse)); margin-top: calc(0.375rem * calc(1 - var(--sy-reverse))); }
.sm\:sy2 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.5rem * var(--sy-reverse)); margin-top: calc(0.5rem * calc(1 - var(--sy-reverse))); }
.sm\:sy2\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.625rem * var(--sy-reverse)); margin-top: calc(0.625rem * calc(1 - var(--sy-reverse))); }
.sm\:sy3 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.75rem * var(--sy-reverse)); margin-top: calc(0.75rem * calc(1 - var(--sy-reverse))); }
.sm\:sy3\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.875rem * var(--sy-reverse)); margin-top: calc(0.875rem * calc(1 - var(--sy-reverse))); }
.sm\:sy4 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1rem * var(--sy-reverse)); margin-top: calc(1rem * calc(1 - var(--sy-reverse))); }
.sm\:sy5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1.25rem * var(--sy-reverse)); margin-top: calc(1.25rem * calc(1 - var(--sy-reverse))); }
.sm\:sy6 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1.5rem * var(--sy-reverse)); margin-top: calc(1.5rem * calc(1 - var(--sy-reverse))); }
.sm\:sy7 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1.75rem * var(--sy-reverse)); margin-top: calc(1.75rem * calc(1 - var(--sy-reverse))); }
.sm\:sy8 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2rem * var(--sy-reverse)); margin-top: calc(2rem * calc(1 - var(--sy-reverse))); }
.sm\:sy9 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2.25rem * var(--sy-reverse)); margin-top: calc(2.25rem * calc(1 - var(--sy-reverse))); }
.sm\:sy10 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2.5rem * var(--sy-reverse)); margin-top: calc(2.5rem * calc(1 - var(--sy-reverse))); }
.sm\:sy11 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2.75rem * var(--sy-reverse)); margin-top: calc(2.75rem * calc(1 - var(--sy-reverse))); }
.sm\:sy12 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(3rem * var(--sy-reverse)); margin-top: calc(3rem * calc(1 - var(--sy-reverse))); }
.sm\:sy14 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(3.5rem * var(--sy-reverse)); margin-top: calc(3.5rem * calc(1 - var(--sy-reverse))); }
.sm\:sy16 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(4rem * var(--sy-reverse)); margin-top: calc(4rem * calc(1 - var(--sy-reverse))); }
.sm\:sy20 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(5rem * var(--sy-reverse)); margin-top: calc(5rem * calc(1 - var(--sy-reverse))); }
.sm\:sy24 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(6rem * var(--sy-reverse)); margin-top: calc(6rem * calc(1 - var(--sy-reverse))); }
.sm\:sy28 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(7rem * var(--sy-reverse)); margin-top: calc(7rem * calc(1 - var(--sy-reverse))); }
.sm\:sy32 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(8rem * var(--sy-reverse)); margin-top: calc(8rem * calc(1 - var(--sy-reverse))); }
.sm\:sy36 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(9rem * var(--sy-reverse)); margin-top: calc(9rem * calc(1 - var(--sy-reverse))); }
.sm\:sy40 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(10rem * var(--sy-reverse)); margin-top: calc(10rem * calc(1 - var(--sy-reverse))); }
.sm\:sy44 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(11rem * var(--sy-reverse)); margin-top: calc(11rem * calc(1 - var(--sy-reverse))); }
.sm\:sy48 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(12rem * var(--sy-reverse)); margin-top: calc(12rem * calc(1 - var(--sy-reverse))); }
.sm\:sy52 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(13rem * var(--sy-reverse)); margin-top: calc(13rem * calc(1 - var(--sy-reverse))); }
.sm\:sy56 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(14rem * var(--sy-reverse)); margin-top: calc(14rem * calc(1 - var(--sy-reverse))); }
.sm\:sy60 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(15rem * var(--sy-reverse)); margin-top: calc(15rem * calc(1 - var(--sy-reverse))); }
.sm\:sy64 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(16rem * var(--sy-reverse)); margin-top: calc(16rem * calc(1 - var(--sy-reverse))); }
.sm\:sy72 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(18rem * var(--sy-reverse)); margin-top: calc(18rem * calc(1 - var(--sy-reverse))); }
.sm\:sy80 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(20rem * var(--sy-reverse)); margin-top: calc(20rem * calc(1 - var(--sy-reverse))); }
.sm\:sy96 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(24rem * var(--sy-reverse)); margin-top: calc(24rem * calc(1 - var(--sy-reverse))); }
.sm\:sy1px > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1px * var(--sx-reverse)); margin-top: calc(1px * calc(1 - var(--sy-reverse))); }
.sm\:sy_reverse > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 1; }
}
@media (min-width: 768px) {
.md\:sx-96 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-24rem * var(--sx-reverse)); margin-left: calc(-24rem * calc(1 - var(--sx-reverse))); }
.md\:sx-80 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-20rem * var(--sx-reverse)); margin-left: calc(-20rem * calc(1 - var(--sx-reverse))); }
.md\:sx-72 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-18rem * var(--sx-reverse)); margin-left: calc(-18rem * calc(1 - var(--sx-reverse))); }
.md\:sx-64 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-16rem * var(--sx-reverse)); margin-left: calc(-16rem * calc(1 - var(--sx-reverse))); }
.md\:sx-60 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-15rem * var(--sx-reverse)); margin-left: calc(-15rem * calc(1 - var(--sx-reverse))); }
.md\:sx-56 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-14rem * var(--sx-reverse)); margin-left: calc(-14rem * calc(1 - var(--sx-reverse))); }
.md\:sx-52 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-13rem * var(--sx-reverse)); margin-left: calc(-13rem * calc(1 - var(--sx-reverse))); }
.md\:sx-48 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-12rem * var(--sx-reverse)); margin-left: calc(-12rem * calc(1 - var(--sx-reverse))); }
.md\:sx-44 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-11rem * var(--sx-reverse)); margin-left: calc(-11rem * calc(1 - var(--sx-reverse))); }
.md\:sx-40 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-10rem * var(--sx-reverse)); margin-left: calc(-10rem * calc(1 - var(--sx-reverse))); }
.md\:sx-36 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-9rem * var(--sx-reverse)); margin-left: calc(-9rem * calc(1 - var(--sx-reverse))); }
.md\:sx-32 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-8rem * var(--sx-reverse)); margin-left: calc(-8rem * calc(1 - var(--sx-reverse))); }
.md\:sx-28 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-7rem * var(--sx-reverse)); margin-left: calc(-7rem * calc(1 - var(--sx-reverse))); }
.md\:sx-24 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-6rem * var(--sx-reverse)); margin-left: calc(-6rem * calc(1 - var(--sx-reverse))); }
.md\:sx-20 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-5rem * var(--sx-reverse)); margin-left: calc(-5rem * calc(1 - var(--sx-reverse))); }
.md\:sx-16 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-4rem * var(--sx-reverse)); margin-left: calc(-4rem * calc(1 - var(--sx-reverse))); }
.md\:sx-14 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-3.5rem * var(--sx-reverse)); margin-left: calc(-3.5rem * calc(1 - var(--sx-reverse))); }
.md\:sx-12 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-3rem * var(--sx-reverse)); margin-left: calc(-3rem * calc(1 - var(--sx-reverse))); }
.md\:sx-11 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2.75rem * var(--sx-reverse)); margin-left: calc(-2.75rem * calc(1 - var(--sx-reverse))); }
.md\:sx-10 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2.5rem * var(--sx-reverse)); margin-left: calc(-2.5rem * calc(1 - var(--sx-reverse))); }
.md\:sx-9 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2.25rem * var(--sx-reverse)); margin-left: calc(-2.25rem * calc(1 - var(--sx-reverse))); }
.md\:sx-8 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2rem * var(--sx-reverse)); margin-left: calc(-2rem * calc(1 - var(--sx-reverse))); }
.md\:sx-7 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1.75rem * var(--sx-reverse)); margin-left: calc(-1.75rem * calc(1 - var(--sx-reverse))); }
.md\:sx-6 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1.5rem * var(--sx-reverse)); margin-left: calc(-1.5rem * calc(1 - var(--sx-reverse))); }
.md\:sx-5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1.25rem * var(--sx-reverse)); margin-left: calc(-1.25rem * calc(1 - var(--sx-reverse))); }
.md\:sx-4 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1rem * var(--sx-reverse)); margin-left: calc(-1rem * calc(1 - var(--sx-reverse))); }
.md\:sx-3\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.875rem * var(--sx-reverse)); margin-left: calc(-0.875rem * calc(1 - var(--sx-reverse))); }
.md\:sx-3 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.75rem * var(--sx-reverse)); margin-left: calc(-0.75rem * calc(1 - var(--sx-reverse))); }
.md\:sx-2\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.625rem * var(--sx-reverse)); margin-left: calc(-0.625rem * calc(1 - var(--sx-reverse))); }
.md\:sx-2 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.5rem * var(--sx-reverse)); margin-left: calc(-0.5rem * calc(1 - var(--sx-reverse))); }
.md\:sx-1\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.375rem * var(--sx-reverse)); margin-left: calc(-0.375rem * calc(1 - var(--sx-reverse))); }
.md\:sx-1 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.25rem * var(--sx-reverse)); margin-left: calc(-0.25rem * calc(1 - var(--sx-reverse))); }
.md\:sx-0\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.125rem * var(--sx-reverse)); margin-left: calc(-0.125rem * calc(1 - var(--sx-reverse))); }
.md\:sx0 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0 * var(--sx-reverse)); margin-left: calc(0 * calc(1 - var(--sx-reverse))); }
.md\:sx0\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.125rem * var(--sx-reverse)); margin-left: calc(0.125rem * calc(1 - var(--sx-reverse))); }
.md\:sx1 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.25rem * var(--sx-reverse)); margin-left: calc(0.25rem * calc(1 - var(--sx-reverse))); }
.md\:sx1\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.375rem * var(--sx-reverse)); margin-left: calc(0.375rem * calc(1 - var(--sx-reverse))); }
.md\:sx2 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.5rem * var(--sx-reverse)); margin-left: calc(0.5rem * calc(1 - var(--sx-reverse))); }
.md\:sx2\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.625rem * var(--sx-reverse)); margin-left: calc(0.625rem * calc(1 - var(--sx-reverse))); }
.md\:sx3 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.75rem * var(--sx-reverse)); margin-left: calc(0.75rem * calc(1 - var(--sx-reverse))); }
.md\:sx3\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.875rem * var(--sx-reverse)); margin-left: calc(0.875rem * calc(1 - var(--sx-reverse))); }
.md\:sx4 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1rem * var(--sx-reverse)); margin-left: calc(1rem * calc(1 - var(--sx-reverse))); }
.md\:sx5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1.25rem * var(--sx-reverse)); margin-left: calc(1.25rem * calc(1 - var(--sx-reverse))); }
.md\:sx6 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1.5rem * var(--sx-reverse)); margin-left: calc(1.5rem * calc(1 - var(--sx-reverse))); }
.md\:sx7 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1.75rem * var(--sx-reverse)); margin-left: calc(1.75rem * calc(1 - var(--sx-reverse))); }
.md\:sx8 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2rem * var(--sx-reverse)); margin-left: calc(2rem * calc(1 - var(--sx-reverse))); }
.md\:sx9 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2.25rem * var(--sx-reverse)); margin-left: calc(2.25rem * calc(1 - var(--sx-reverse))); }
.md\:sx10 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2.5rem * var(--sx-reverse)); margin-left: calc(2.5rem * calc(1 - var(--sx-reverse))); }
.md\:sx11 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2.75rem * var(--sx-reverse)); margin-left: calc(2.75rem * calc(1 - var(--sx-reverse))); }
.md\:sx12 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(3rem * var(--sx-reverse)); margin-left: calc(3rem * calc(1 - var(--sx-reverse))); }
.md\:sx14 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(3.5rem * var(--sx-reverse)); margin-left: calc(3.5rem * calc(1 - var(--sx-reverse))); }
.md\:sx16 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(4rem * var(--sx-reverse)); margin-left: calc(4rem * calc(1 - var(--sx-reverse))); }
.md\:sx20 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(5rem * var(--sx-reverse)); margin-left: calc(5rem * calc(1 - var(--sx-reverse))); }
.md\:sx24 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(6rem * var(--sx-reverse)); margin-left: calc(6rem * calc(1 - var(--sx-reverse))); }
.md\:sx28 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(7rem * var(--sx-reverse)); margin-left: calc(7rem * calc(1 - var(--sx-reverse))); }
.md\:sx32 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(8rem * var(--sx-reverse)); margin-left: calc(8rem * calc(1 - var(--sx-reverse))); }
.md\:sx36 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(9rem * var(--sx-reverse)); margin-left: calc(9rem * calc(1 - var(--sx-reverse))); }
.md\:sx40 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(10rem * var(--sx-reverse)); margin-left: calc(10rem * calc(1 - var(--sx-reverse))); }
.md\:sx44 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(11rem * var(--sx-reverse)); margin-left: calc(11rem * calc(1 - var(--sx-reverse))); }
.md\:sx48 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(12rem * var(--sx-reverse)); margin-left: calc(12rem * calc(1 - var(--sx-reverse))); }
.md\:sx52 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(13rem * var(--sx-reverse)); margin-left: calc(13rem * calc(1 - var(--sx-reverse))); }
.md\:sx56 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(14rem * var(--sx-reverse)); margin-left: calc(14rem * calc(1 - var(--sx-reverse))); }
.md\:sx60 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(15rem * var(--sx-reverse)); margin-left: calc(15rem * calc(1 - var(--sx-reverse))); }
.md\:sx64 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(16rem * var(--sx-reverse)); margin-left: calc(16rem * calc(1 - var(--sx-reverse))); }
.md\:sx72 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(18rem * var(--sx-reverse)); margin-left: calc(18rem * calc(1 - var(--sx-reverse))); }
.md\:sx80 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(20rem * var(--sx-reverse)); margin-left: calc(20rem * calc(1 - var(--sx-reverse))); }
.md\:sx96 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(24rem * var(--sx-reverse)); margin-left: calc(24rem * calc(1 - var(--sx-reverse))); }
.md\:sx1px > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1px * var(--sx-reverse)); margin-left: calc(1px * calc(1 - var(--sx-reverse))); }
.md\:sx_reverse > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 1; }
.md\:sy-96 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-24rem * var(--sy-reverse)); margin-top: calc(-24rem * calc(1 - var(--sy-reverse))); }
.md\:sy-80 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-20rem * var(--sy-reverse)); margin-top: calc(-20rem * calc(1 - var(--sy-reverse))); }
.md\:sy-72 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-18rem * var(--sy-reverse)); margin-top: calc(-18rem * calc(1 - var(--sy-reverse))); }
.md\:sy-64 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-16rem * var(--sy-reverse)); margin-top: calc(-16rem * calc(1 - var(--sy-reverse))); }
.md\:sy-60 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-15rem * var(--sy-reverse)); margin-top: calc(-15rem * calc(1 - var(--sy-reverse))); }
.md\:sy-56 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-14rem * var(--sy-reverse)); margin-top: calc(-14rem * calc(1 - var(--sy-reverse))); }
.md\:sy-52 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-13rem * var(--sy-reverse)); margin-top: calc(-13rem * calc(1 - var(--sy-reverse))); }
.md\:sy-48 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-12rem * var(--sy-reverse)); margin-top: calc(-12rem * calc(1 - var(--sy-reverse))); }
.md\:sy-44 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-11rem * var(--sy-reverse)); margin-top: calc(-11rem * calc(1 - var(--sy-reverse))); }
.md\:sy-40 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-10rem * var(--sy-reverse)); margin-top: calc(-10rem * calc(1 - var(--sy-reverse))); }
.md\:sy-36 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-9rem * var(--sy-reverse)); margin-top: calc(-9rem * calc(1 - var(--sy-reverse))); }
.md\:sy-32 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-8rem * var(--sy-reverse)); margin-top: calc(-8rem * calc(1 - var(--sy-reverse))); }
.md\:sy-28 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-7rem * var(--sy-reverse)); margin-top: calc(-7rem * calc(1 - var(--sy-reverse))); }
.md\:sy-24 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-6rem * var(--sy-reverse)); margin-top: calc(-6rem * calc(1 - var(--sy-reverse))); }
.md\:sy-20 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-5rem * var(--sy-reverse)); margin-top: calc(-5rem * calc(1 - var(--sy-reverse))); }
.md\:sy-16 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-4rem * var(--sy-reverse)); margin-top: calc(-4rem * calc(1 - var(--sy-reverse))); }
.md\:sy-14 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-3.5rem * var(--sy-reverse)); margin-top: calc(-3.5rem * calc(1 - var(--sy-reverse))); }
.md\:sy-12 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-3rem * var(--sy-reverse)); margin-top: calc(-3rem * calc(1 - var(--sy-reverse))); }
.md\:sy-11 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2.75rem * var(--sy-reverse)); margin-top: calc(-2.75rem * calc(1 - var(--sy-reverse))); }
.md\:sy-10 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2.5rem * var(--sy-reverse)); margin-top: calc(-2.5rem * calc(1 - var(--sy-reverse))); }
.md\:sy-9 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2.25rem * var(--sy-reverse)); margin-top: calc(-2.25rem * calc(1 - var(--sy-reverse))); }
.md\:sy-8 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2rem * var(--sy-reverse)); margin-top: calc(-2rem * calc(1 - var(--sy-reverse))); }
.md\:sy-7 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1.75rem * var(--sy-reverse)); margin-top: calc(-1.75rem * calc(1 - var(--sy-reverse))); }
.md\:sy-6 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1.5rem * var(--sy-reverse)); margin-top: calc(-1.5rem * calc(1 - var(--sy-reverse))); }
.md\:sy-5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1.25rem * var(--sy-reverse)); margin-top: calc(-1.25rem * calc(1 - var(--sy-reverse))); }
.md\:sy-4 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1rem * var(--sy-reverse)); margin-top: calc(-1rem * calc(1 - var(--sy-reverse))); }
.md\:sy-3\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.875rem * var(--sy-reverse)); margin-top: calc(-0.875rem * calc(1 - var(--sy-reverse))); }
.md\:sy-3 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.75rem * var(--sy-reverse)); margin-top: calc(-0.75rem * calc(1 - var(--sy-reverse))); }
.md\:sy-2\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.625rem * var(--sy-reverse)); margin-top: calc(-0.625rem * calc(1 - var(--sy-reverse))); }
.md\:sy-2 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.5rem * var(--sy-reverse)); margin-top: calc(-0.5rem * calc(1 - var(--sy-reverse))); }
.md\:sy-1\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.375rem * var(--sy-reverse)); margin-top: calc(-0.375rem * calc(1 - var(--sy-reverse))); }
.md\:sy-1 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.25rem * var(--sy-reverse)); margin-top: calc(-0.25rem * calc(1 - var(--sy-reverse))); }
.md\:sy-0\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.125rem * var(--sy-reverse)); margin-top: calc(-0.125rem * calc(1 - var(--sy-reverse))); }
.md\:sy0 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0 * var(--sy-reverse)); margin-top: calc(0 * calc(1 - var(--sy-reverse))); }
.md\:sy0\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.125rem * var(--sy-reverse)); margin-top: calc(0.125rem * calc(1 - var(--sy-reverse))); }
.md\:sy1 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.25rem * var(--sy-reverse)); margin-top: calc(0.25rem * calc(1 - var(--sy-reverse))); }
.md\:sy1\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.375rem * var(--sy-reverse)); margin-top: calc(0.375rem * calc(1 - var(--sy-reverse))); }
.md\:sy2 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.5rem * var(--sy-reverse)); margin-top: calc(0.5rem * calc(1 - var(--sy-reverse))); }
.md\:sy2\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.625rem * var(--sy-reverse)); margin-top: calc(0.625rem * calc(1 - var(--sy-reverse))); }
.md\:sy3 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.75rem * var(--sy-reverse)); margin-top: calc(0.75rem * calc(1 - var(--sy-reverse))); }
.md\:sy3\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.875rem * var(--sy-reverse)); margin-top: calc(0.875rem * calc(1 - var(--sy-reverse))); }
.md\:sy4 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1rem * var(--sy-reverse)); margin-top: calc(1rem * calc(1 - var(--sy-reverse))); }
.md\:sy5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1.25rem * var(--sy-reverse)); margin-top: calc(1.25rem * calc(1 - var(--sy-reverse))); }
.md\:sy6 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1.5rem * var(--sy-reverse)); margin-top: calc(1.5rem * calc(1 - var(--sy-reverse))); }
.md\:sy7 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1.75rem * var(--sy-reverse)); margin-top: calc(1.75rem * calc(1 - var(--sy-reverse))); }
.md\:sy8 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2rem * var(--sy-reverse)); margin-top: calc(2rem * calc(1 - var(--sy-reverse))); }
.md\:sy9 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2.25rem * var(--sy-reverse)); margin-top: calc(2.25rem * calc(1 - var(--sy-reverse))); }
.md\:sy10 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2.5rem * var(--sy-reverse)); margin-top: calc(2.5rem * calc(1 - var(--sy-reverse))); }
.md\:sy11 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2.75rem * var(--sy-reverse)); margin-top: calc(2.75rem * calc(1 - var(--sy-reverse))); }
.md\:sy12 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(3rem * var(--sy-reverse)); margin-top: calc(3rem * calc(1 - var(--sy-reverse))); }
.md\:sy14 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(3.5rem * var(--sy-reverse)); margin-top: calc(3.5rem * calc(1 - var(--sy-reverse))); }
.md\:sy16 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(4rem * var(--sy-reverse)); margin-top: calc(4rem * calc(1 - var(--sy-reverse))); }
.md\:sy20 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(5rem * var(--sy-reverse)); margin-top: calc(5rem * calc(1 - var(--sy-reverse))); }
.md\:sy24 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(6rem * var(--sy-reverse)); margin-top: calc(6rem * calc(1 - var(--sy-reverse))); }
.md\:sy28 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(7rem * var(--sy-reverse)); margin-top: calc(7rem * calc(1 - var(--sy-reverse))); }
.md\:sy32 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(8rem * var(--sy-reverse)); margin-top: calc(8rem * calc(1 - var(--sy-reverse))); }
.md\:sy36 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(9rem * var(--sy-reverse)); margin-top: calc(9rem * calc(1 - var(--sy-reverse))); }
.md\:sy40 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(10rem * var(--sy-reverse)); margin-top: calc(10rem * calc(1 - var(--sy-reverse))); }
.md\:sy44 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(11rem * var(--sy-reverse)); margin-top: calc(11rem * calc(1 - var(--sy-reverse))); }
.md\:sy48 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(12rem * var(--sy-reverse)); margin-top: calc(12rem * calc(1 - var(--sy-reverse))); }
.md\:sy52 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(13rem * var(--sy-reverse)); margin-top: calc(13rem * calc(1 - var(--sy-reverse))); }
.md\:sy56 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(14rem * var(--sy-reverse)); margin-top: calc(14rem * calc(1 - var(--sy-reverse))); }
.md\:sy60 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(15rem * var(--sy-reverse)); margin-top: calc(15rem * calc(1 - var(--sy-reverse))); }
.md\:sy64 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(16rem * var(--sy-reverse)); margin-top: calc(16rem * calc(1 - var(--sy-reverse))); }
.md\:sy72 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(18rem * var(--sy-reverse)); margin-top: calc(18rem * calc(1 - var(--sy-reverse))); }
.md\:sy80 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(20rem * var(--sy-reverse)); margin-top: calc(20rem * calc(1 - var(--sy-reverse))); }
.md\:sy96 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(24rem * var(--sy-reverse)); margin-top: calc(24rem * calc(1 - var(--sy-reverse))); }
.md\:sy1px > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1px * var(--sx-reverse)); margin-top: calc(1px * calc(1 - var(--sy-reverse))); }
.md\:sy_reverse > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 1; }
}
@media (min-width: 992px) {
.lg\:sx-96 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-24rem * var(--sx-reverse)); margin-left: calc(-24rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-80 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-20rem * var(--sx-reverse)); margin-left: calc(-20rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-72 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-18rem * var(--sx-reverse)); margin-left: calc(-18rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-64 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-16rem * var(--sx-reverse)); margin-left: calc(-16rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-60 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-15rem * var(--sx-reverse)); margin-left: calc(-15rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-56 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-14rem * var(--sx-reverse)); margin-left: calc(-14rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-52 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-13rem * var(--sx-reverse)); margin-left: calc(-13rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-48 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-12rem * var(--sx-reverse)); margin-left: calc(-12rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-44 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-11rem * var(--sx-reverse)); margin-left: calc(-11rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-40 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-10rem * var(--sx-reverse)); margin-left: calc(-10rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-36 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-9rem * var(--sx-reverse)); margin-left: calc(-9rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-32 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-8rem * var(--sx-reverse)); margin-left: calc(-8rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-28 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-7rem * var(--sx-reverse)); margin-left: calc(-7rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-24 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-6rem * var(--sx-reverse)); margin-left: calc(-6rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-20 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-5rem * var(--sx-reverse)); margin-left: calc(-5rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-16 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-4rem * var(--sx-reverse)); margin-left: calc(-4rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-14 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-3.5rem * var(--sx-reverse)); margin-left: calc(-3.5rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-12 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-3rem * var(--sx-reverse)); margin-left: calc(-3rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-11 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2.75rem * var(--sx-reverse)); margin-left: calc(-2.75rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-10 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2.5rem * var(--sx-reverse)); margin-left: calc(-2.5rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-9 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2.25rem * var(--sx-reverse)); margin-left: calc(-2.25rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-8 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2rem * var(--sx-reverse)); margin-left: calc(-2rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-7 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1.75rem * var(--sx-reverse)); margin-left: calc(-1.75rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-6 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1.5rem * var(--sx-reverse)); margin-left: calc(-1.5rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1.25rem * var(--sx-reverse)); margin-left: calc(-1.25rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-4 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1rem * var(--sx-reverse)); margin-left: calc(-1rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-3\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.875rem * var(--sx-reverse)); margin-left: calc(-0.875rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-3 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.75rem * var(--sx-reverse)); margin-left: calc(-0.75rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-2\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.625rem * var(--sx-reverse)); margin-left: calc(-0.625rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-2 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.5rem * var(--sx-reverse)); margin-left: calc(-0.5rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-1\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.375rem * var(--sx-reverse)); margin-left: calc(-0.375rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-1 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.25rem * var(--sx-reverse)); margin-left: calc(-0.25rem * calc(1 - var(--sx-reverse))); }
.lg\:sx-0\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.125rem * var(--sx-reverse)); margin-left: calc(-0.125rem * calc(1 - var(--sx-reverse))); }
.lg\:sx0 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0 * var(--sx-reverse)); margin-left: calc(0 * calc(1 - var(--sx-reverse))); }
.lg\:sx0\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.125rem * var(--sx-reverse)); margin-left: calc(0.125rem * calc(1 - var(--sx-reverse))); }
.lg\:sx1 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.25rem * var(--sx-reverse)); margin-left: calc(0.25rem * calc(1 - var(--sx-reverse))); }
.lg\:sx1\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.375rem * var(--sx-reverse)); margin-left: calc(0.375rem * calc(1 - var(--sx-reverse))); }
.lg\:sx2 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.5rem * var(--sx-reverse)); margin-left: calc(0.5rem * calc(1 - var(--sx-reverse))); }
.lg\:sx2\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.625rem * var(--sx-reverse)); margin-left: calc(0.625rem * calc(1 - var(--sx-reverse))); }
.lg\:sx3 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.75rem * var(--sx-reverse)); margin-left: calc(0.75rem * calc(1 - var(--sx-reverse))); }
.lg\:sx3\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.875rem * var(--sx-reverse)); margin-left: calc(0.875rem * calc(1 - var(--sx-reverse))); }
.lg\:sx4 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1rem * var(--sx-reverse)); margin-left: calc(1rem * calc(1 - var(--sx-reverse))); }
.lg\:sx5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1.25rem * var(--sx-reverse)); margin-left: calc(1.25rem * calc(1 - var(--sx-reverse))); }
.lg\:sx6 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1.5rem * var(--sx-reverse)); margin-left: calc(1.5rem * calc(1 - var(--sx-reverse))); }
.lg\:sx7 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1.75rem * var(--sx-reverse)); margin-left: calc(1.75rem * calc(1 - var(--sx-reverse))); }
.lg\:sx8 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2rem * var(--sx-reverse)); margin-left: calc(2rem * calc(1 - var(--sx-reverse))); }
.lg\:sx9 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2.25rem * var(--sx-reverse)); margin-left: calc(2.25rem * calc(1 - var(--sx-reverse))); }
.lg\:sx10 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2.5rem * var(--sx-reverse)); margin-left: calc(2.5rem * calc(1 - var(--sx-reverse))); }
.lg\:sx11 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2.75rem * var(--sx-reverse)); margin-left: calc(2.75rem * calc(1 - var(--sx-reverse))); }
.lg\:sx12 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(3rem * var(--sx-reverse)); margin-left: calc(3rem * calc(1 - var(--sx-reverse))); }
.lg\:sx14 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(3.5rem * var(--sx-reverse)); margin-left: calc(3.5rem * calc(1 - var(--sx-reverse))); }
.lg\:sx16 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(4rem * var(--sx-reverse)); margin-left: calc(4rem * calc(1 - var(--sx-reverse))); }
.lg\:sx20 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(5rem * var(--sx-reverse)); margin-left: calc(5rem * calc(1 - var(--sx-reverse))); }
.lg\:sx24 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(6rem * var(--sx-reverse)); margin-left: calc(6rem * calc(1 - var(--sx-reverse))); }
.lg\:sx28 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(7rem * var(--sx-reverse)); margin-left: calc(7rem * calc(1 - var(--sx-reverse))); }
.lg\:sx32 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(8rem * var(--sx-reverse)); margin-left: calc(8rem * calc(1 - var(--sx-reverse))); }
.lg\:sx36 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(9rem * var(--sx-reverse)); margin-left: calc(9rem * calc(1 - var(--sx-reverse))); }
.lg\:sx40 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(10rem * var(--sx-reverse)); margin-left: calc(10rem * calc(1 - var(--sx-reverse))); }
.lg\:sx44 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(11rem * var(--sx-reverse)); margin-left: calc(11rem * calc(1 - var(--sx-reverse))); }
.lg\:sx48 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(12rem * var(--sx-reverse)); margin-left: calc(12rem * calc(1 - var(--sx-reverse))); }
.lg\:sx52 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(13rem * var(--sx-reverse)); margin-left: calc(13rem * calc(1 - var(--sx-reverse))); }
.lg\:sx56 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(14rem * var(--sx-reverse)); margin-left: calc(14rem * calc(1 - var(--sx-reverse))); }
.lg\:sx60 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(15rem * var(--sx-reverse)); margin-left: calc(15rem * calc(1 - var(--sx-reverse))); }
.lg\:sx64 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(16rem * var(--sx-reverse)); margin-left: calc(16rem * calc(1 - var(--sx-reverse))); }
.lg\:sx72 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(18rem * var(--sx-reverse)); margin-left: calc(18rem * calc(1 - var(--sx-reverse))); }
.lg\:sx80 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(20rem * var(--sx-reverse)); margin-left: calc(20rem * calc(1 - var(--sx-reverse))); }
.lg\:sx96 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(24rem * var(--sx-reverse)); margin-left: calc(24rem * calc(1 - var(--sx-reverse))); }
.lg\:sx1px > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1px * var(--sx-reverse)); margin-left: calc(1px * calc(1 - var(--sx-reverse))); }
.lg\:sx_reverse > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 1; }
.lg\:sy-96 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-24rem * var(--sy-reverse)); margin-top: calc(-24rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-80 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-20rem * var(--sy-reverse)); margin-top: calc(-20rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-72 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-18rem * var(--sy-reverse)); margin-top: calc(-18rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-64 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-16rem * var(--sy-reverse)); margin-top: calc(-16rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-60 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-15rem * var(--sy-reverse)); margin-top: calc(-15rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-56 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-14rem * var(--sy-reverse)); margin-top: calc(-14rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-52 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-13rem * var(--sy-reverse)); margin-top: calc(-13rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-48 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-12rem * var(--sy-reverse)); margin-top: calc(-12rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-44 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-11rem * var(--sy-reverse)); margin-top: calc(-11rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-40 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-10rem * var(--sy-reverse)); margin-top: calc(-10rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-36 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-9rem * var(--sy-reverse)); margin-top: calc(-9rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-32 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-8rem * var(--sy-reverse)); margin-top: calc(-8rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-28 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-7rem * var(--sy-reverse)); margin-top: calc(-7rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-24 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-6rem * var(--sy-reverse)); margin-top: calc(-6rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-20 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-5rem * var(--sy-reverse)); margin-top: calc(-5rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-16 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-4rem * var(--sy-reverse)); margin-top: calc(-4rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-14 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-3.5rem * var(--sy-reverse)); margin-top: calc(-3.5rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-12 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-3rem * var(--sy-reverse)); margin-top: calc(-3rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-11 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2.75rem * var(--sy-reverse)); margin-top: calc(-2.75rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-10 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2.5rem * var(--sy-reverse)); margin-top: calc(-2.5rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-9 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2.25rem * var(--sy-reverse)); margin-top: calc(-2.25rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-8 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2rem * var(--sy-reverse)); margin-top: calc(-2rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-7 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1.75rem * var(--sy-reverse)); margin-top: calc(-1.75rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-6 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1.5rem * var(--sy-reverse)); margin-top: calc(-1.5rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1.25rem * var(--sy-reverse)); margin-top: calc(-1.25rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-4 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1rem * var(--sy-reverse)); margin-top: calc(-1rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-3\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.875rem * var(--sy-reverse)); margin-top: calc(-0.875rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-3 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.75rem * var(--sy-reverse)); margin-top: calc(-0.75rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-2\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.625rem * var(--sy-reverse)); margin-top: calc(-0.625rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-2 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.5rem * var(--sy-reverse)); margin-top: calc(-0.5rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-1\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.375rem * var(--sy-reverse)); margin-top: calc(-0.375rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-1 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.25rem * var(--sy-reverse)); margin-top: calc(-0.25rem * calc(1 - var(--sy-reverse))); }
.lg\:sy-0\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.125rem * var(--sy-reverse)); margin-top: calc(-0.125rem * calc(1 - var(--sy-reverse))); }
.lg\:sy0 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0 * var(--sy-reverse)); margin-top: calc(0 * calc(1 - var(--sy-reverse))); }
.lg\:sy0\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.125rem * var(--sy-reverse)); margin-top: calc(0.125rem * calc(1 - var(--sy-reverse))); }
.lg\:sy1 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.25rem * var(--sy-reverse)); margin-top: calc(0.25rem * calc(1 - var(--sy-reverse))); }
.lg\:sy1\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.375rem * var(--sy-reverse)); margin-top: calc(0.375rem * calc(1 - var(--sy-reverse))); }
.lg\:sy2 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.5rem * var(--sy-reverse)); margin-top: calc(0.5rem * calc(1 - var(--sy-reverse))); }
.lg\:sy2\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.625rem * var(--sy-reverse)); margin-top: calc(0.625rem * calc(1 - var(--sy-reverse))); }
.lg\:sy3 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.75rem * var(--sy-reverse)); margin-top: calc(0.75rem * calc(1 - var(--sy-reverse))); }
.lg\:sy3\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.875rem * var(--sy-reverse)); margin-top: calc(0.875rem * calc(1 - var(--sy-reverse))); }
.lg\:sy4 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1rem * var(--sy-reverse)); margin-top: calc(1rem * calc(1 - var(--sy-reverse))); }
.lg\:sy5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1.25rem * var(--sy-reverse)); margin-top: calc(1.25rem * calc(1 - var(--sy-reverse))); }
.lg\:sy6 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1.5rem * var(--sy-reverse)); margin-top: calc(1.5rem * calc(1 - var(--sy-reverse))); }
.lg\:sy7 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1.75rem * var(--sy-reverse)); margin-top: calc(1.75rem * calc(1 - var(--sy-reverse))); }
.lg\:sy8 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2rem * var(--sy-reverse)); margin-top: calc(2rem * calc(1 - var(--sy-reverse))); }
.lg\:sy9 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2.25rem * var(--sy-reverse)); margin-top: calc(2.25rem * calc(1 - var(--sy-reverse))); }
.lg\:sy10 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2.5rem * var(--sy-reverse)); margin-top: calc(2.5rem * calc(1 - var(--sy-reverse))); }
.lg\:sy11 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2.75rem * var(--sy-reverse)); margin-top: calc(2.75rem * calc(1 - var(--sy-reverse))); }
.lg\:sy12 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(3rem * var(--sy-reverse)); margin-top: calc(3rem * calc(1 - var(--sy-reverse))); }
.lg\:sy14 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(3.5rem * var(--sy-reverse)); margin-top: calc(3.5rem * calc(1 - var(--sy-reverse))); }
.lg\:sy16 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(4rem * var(--sy-reverse)); margin-top: calc(4rem * calc(1 - var(--sy-reverse))); }
.lg\:sy20 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(5rem * var(--sy-reverse)); margin-top: calc(5rem * calc(1 - var(--sy-reverse))); }
.lg\:sy24 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(6rem * var(--sy-reverse)); margin-top: calc(6rem * calc(1 - var(--sy-reverse))); }
.lg\:sy28 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(7rem * var(--sy-reverse)); margin-top: calc(7rem * calc(1 - var(--sy-reverse))); }
.lg\:sy32 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(8rem * var(--sy-reverse)); margin-top: calc(8rem * calc(1 - var(--sy-reverse))); }
.lg\:sy36 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(9rem * var(--sy-reverse)); margin-top: calc(9rem * calc(1 - var(--sy-reverse))); }
.lg\:sy40 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(10rem * var(--sy-reverse)); margin-top: calc(10rem * calc(1 - var(--sy-reverse))); }
.lg\:sy44 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(11rem * var(--sy-reverse)); margin-top: calc(11rem * calc(1 - var(--sy-reverse))); }
.lg\:sy48 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(12rem * var(--sy-reverse)); margin-top: calc(12rem * calc(1 - var(--sy-reverse))); }
.lg\:sy52 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(13rem * var(--sy-reverse)); margin-top: calc(13rem * calc(1 - var(--sy-reverse))); }
.lg\:sy56 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(14rem * var(--sy-reverse)); margin-top: calc(14rem * calc(1 - var(--sy-reverse))); }
.lg\:sy60 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(15rem * var(--sy-reverse)); margin-top: calc(15rem * calc(1 - var(--sy-reverse))); }
.lg\:sy64 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(16rem * var(--sy-reverse)); margin-top: calc(16rem * calc(1 - var(--sy-reverse))); }
.lg\:sy72 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(18rem * var(--sy-reverse)); margin-top: calc(18rem * calc(1 - var(--sy-reverse))); }
.lg\:sy80 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(20rem * var(--sy-reverse)); margin-top: calc(20rem * calc(1 - var(--sy-reverse))); }
.lg\:sy96 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(24rem * var(--sy-reverse)); margin-top: calc(24rem * calc(1 - var(--sy-reverse))); }
.lg\:sy1px > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1px * var(--sx-reverse)); margin-top: calc(1px * calc(1 - var(--sy-reverse))); }
.lg\:sy_reverse > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 1; }
}
@media (min-width: 1200px) {
.xl\:sx-96 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-24rem * var(--sx-reverse)); margin-left: calc(-24rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-80 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-20rem * var(--sx-reverse)); margin-left: calc(-20rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-72 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-18rem * var(--sx-reverse)); margin-left: calc(-18rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-64 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-16rem * var(--sx-reverse)); margin-left: calc(-16rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-60 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-15rem * var(--sx-reverse)); margin-left: calc(-15rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-56 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-14rem * var(--sx-reverse)); margin-left: calc(-14rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-52 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-13rem * var(--sx-reverse)); margin-left: calc(-13rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-48 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-12rem * var(--sx-reverse)); margin-left: calc(-12rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-44 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-11rem * var(--sx-reverse)); margin-left: calc(-11rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-40 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-10rem * var(--sx-reverse)); margin-left: calc(-10rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-36 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-9rem * var(--sx-reverse)); margin-left: calc(-9rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-32 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-8rem * var(--sx-reverse)); margin-left: calc(-8rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-28 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-7rem * var(--sx-reverse)); margin-left: calc(-7rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-24 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-6rem * var(--sx-reverse)); margin-left: calc(-6rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-20 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-5rem * var(--sx-reverse)); margin-left: calc(-5rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-16 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-4rem * var(--sx-reverse)); margin-left: calc(-4rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-14 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-3.5rem * var(--sx-reverse)); margin-left: calc(-3.5rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-12 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-3rem * var(--sx-reverse)); margin-left: calc(-3rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-11 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2.75rem * var(--sx-reverse)); margin-left: calc(-2.75rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-10 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2.5rem * var(--sx-reverse)); margin-left: calc(-2.5rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-9 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2.25rem * var(--sx-reverse)); margin-left: calc(-2.25rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-8 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2rem * var(--sx-reverse)); margin-left: calc(-2rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-7 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1.75rem * var(--sx-reverse)); margin-left: calc(-1.75rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-6 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1.5rem * var(--sx-reverse)); margin-left: calc(-1.5rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1.25rem * var(--sx-reverse)); margin-left: calc(-1.25rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-4 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1rem * var(--sx-reverse)); margin-left: calc(-1rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-3\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.875rem * var(--sx-reverse)); margin-left: calc(-0.875rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-3 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.75rem * var(--sx-reverse)); margin-left: calc(-0.75rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-2\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.625rem * var(--sx-reverse)); margin-left: calc(-0.625rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-2 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.5rem * var(--sx-reverse)); margin-left: calc(-0.5rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-1\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.375rem * var(--sx-reverse)); margin-left: calc(-0.375rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-1 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.25rem * var(--sx-reverse)); margin-left: calc(-0.25rem * calc(1 - var(--sx-reverse))); }
.xl\:sx-0\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.125rem * var(--sx-reverse)); margin-left: calc(-0.125rem * calc(1 - var(--sx-reverse))); }
.xl\:sx0 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0 * var(--sx-reverse)); margin-left: calc(0 * calc(1 - var(--sx-reverse))); }
.xl\:sx0\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.125rem * var(--sx-reverse)); margin-left: calc(0.125rem * calc(1 - var(--sx-reverse))); }
.xl\:sx1 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.25rem * var(--sx-reverse)); margin-left: calc(0.25rem * calc(1 - var(--sx-reverse))); }
.xl\:sx1\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.375rem * var(--sx-reverse)); margin-left: calc(0.375rem * calc(1 - var(--sx-reverse))); }
.xl\:sx2 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.5rem * var(--sx-reverse)); margin-left: calc(0.5rem * calc(1 - var(--sx-reverse))); }
.xl\:sx2\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.625rem * var(--sx-reverse)); margin-left: calc(0.625rem * calc(1 - var(--sx-reverse))); }
.xl\:sx3 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.75rem * var(--sx-reverse)); margin-left: calc(0.75rem * calc(1 - var(--sx-reverse))); }
.xl\:sx3\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.875rem * var(--sx-reverse)); margin-left: calc(0.875rem * calc(1 - var(--sx-reverse))); }
.xl\:sx4 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1rem * var(--sx-reverse)); margin-left: calc(1rem * calc(1 - var(--sx-reverse))); }
.xl\:sx5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1.25rem * var(--sx-reverse)); margin-left: calc(1.25rem * calc(1 - var(--sx-reverse))); }
.xl\:sx6 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1.5rem * var(--sx-reverse)); margin-left: calc(1.5rem * calc(1 - var(--sx-reverse))); }
.xl\:sx7 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1.75rem * var(--sx-reverse)); margin-left: calc(1.75rem * calc(1 - var(--sx-reverse))); }
.xl\:sx8 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2rem * var(--sx-reverse)); margin-left: calc(2rem * calc(1 - var(--sx-reverse))); }
.xl\:sx9 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2.25rem * var(--sx-reverse)); margin-left: calc(2.25rem * calc(1 - var(--sx-reverse))); }
.xl\:sx10 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2.5rem * var(--sx-reverse)); margin-left: calc(2.5rem * calc(1 - var(--sx-reverse))); }
.xl\:sx11 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2.75rem * var(--sx-reverse)); margin-left: calc(2.75rem * calc(1 - var(--sx-reverse))); }
.xl\:sx12 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(3rem * var(--sx-reverse)); margin-left: calc(3rem * calc(1 - var(--sx-reverse))); }
.xl\:sx14 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(3.5rem * var(--sx-reverse)); margin-left: calc(3.5rem * calc(1 - var(--sx-reverse))); }
.xl\:sx16 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(4rem * var(--sx-reverse)); margin-left: calc(4rem * calc(1 - var(--sx-reverse))); }
.xl\:sx20 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(5rem * var(--sx-reverse)); margin-left: calc(5rem * calc(1 - var(--sx-reverse))); }
.xl\:sx24 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(6rem * var(--sx-reverse)); margin-left: calc(6rem * calc(1 - var(--sx-reverse))); }
.xl\:sx28 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(7rem * var(--sx-reverse)); margin-left: calc(7rem * calc(1 - var(--sx-reverse))); }
.xl\:sx32 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(8rem * var(--sx-reverse)); margin-left: calc(8rem * calc(1 - var(--sx-reverse))); }
.xl\:sx36 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(9rem * var(--sx-reverse)); margin-left: calc(9rem * calc(1 - var(--sx-reverse))); }
.xl\:sx40 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(10rem * var(--sx-reverse)); margin-left: calc(10rem * calc(1 - var(--sx-reverse))); }
.xl\:sx44 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(11rem * var(--sx-reverse)); margin-left: calc(11rem * calc(1 - var(--sx-reverse))); }
.xl\:sx48 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(12rem * var(--sx-reverse)); margin-left: calc(12rem * calc(1 - var(--sx-reverse))); }
.xl\:sx52 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(13rem * var(--sx-reverse)); margin-left: calc(13rem * calc(1 - var(--sx-reverse))); }
.xl\:sx56 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(14rem * var(--sx-reverse)); margin-left: calc(14rem * calc(1 - var(--sx-reverse))); }
.xl\:sx60 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(15rem * var(--sx-reverse)); margin-left: calc(15rem * calc(1 - var(--sx-reverse))); }
.xl\:sx64 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(16rem * var(--sx-reverse)); margin-left: calc(16rem * calc(1 - var(--sx-reverse))); }
.xl\:sx72 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(18rem * var(--sx-reverse)); margin-left: calc(18rem * calc(1 - var(--sx-reverse))); }
.xl\:sx80 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(20rem * var(--sx-reverse)); margin-left: calc(20rem * calc(1 - var(--sx-reverse))); }
.xl\:sx96 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(24rem * var(--sx-reverse)); margin-left: calc(24rem * calc(1 - var(--sx-reverse))); }
.xl\:sx1px > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1px * var(--sx-reverse)); margin-left: calc(1px * calc(1 - var(--sx-reverse))); }
.xl\:sx_reverse > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 1; }
.xl\:sy-96 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-24rem * var(--sy-reverse)); margin-top: calc(-24rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-80 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-20rem * var(--sy-reverse)); margin-top: calc(-20rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-72 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-18rem * var(--sy-reverse)); margin-top: calc(-18rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-64 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-16rem * var(--sy-reverse)); margin-top: calc(-16rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-60 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-15rem * var(--sy-reverse)); margin-top: calc(-15rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-56 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-14rem * var(--sy-reverse)); margin-top: calc(-14rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-52 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-13rem * var(--sy-reverse)); margin-top: calc(-13rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-48 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-12rem * var(--sy-reverse)); margin-top: calc(-12rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-44 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-11rem * var(--sy-reverse)); margin-top: calc(-11rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-40 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-10rem * var(--sy-reverse)); margin-top: calc(-10rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-36 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-9rem * var(--sy-reverse)); margin-top: calc(-9rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-32 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-8rem * var(--sy-reverse)); margin-top: calc(-8rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-28 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-7rem * var(--sy-reverse)); margin-top: calc(-7rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-24 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-6rem * var(--sy-reverse)); margin-top: calc(-6rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-20 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-5rem * var(--sy-reverse)); margin-top: calc(-5rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-16 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-4rem * var(--sy-reverse)); margin-top: calc(-4rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-14 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-3.5rem * var(--sy-reverse)); margin-top: calc(-3.5rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-12 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-3rem * var(--sy-reverse)); margin-top: calc(-3rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-11 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2.75rem * var(--sy-reverse)); margin-top: calc(-2.75rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-10 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2.5rem * var(--sy-reverse)); margin-top: calc(-2.5rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-9 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2.25rem * var(--sy-reverse)); margin-top: calc(-2.25rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-8 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2rem * var(--sy-reverse)); margin-top: calc(-2rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-7 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1.75rem * var(--sy-reverse)); margin-top: calc(-1.75rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-6 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1.5rem * var(--sy-reverse)); margin-top: calc(-1.5rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1.25rem * var(--sy-reverse)); margin-top: calc(-1.25rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-4 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1rem * var(--sy-reverse)); margin-top: calc(-1rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-3\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.875rem * var(--sy-reverse)); margin-top: calc(-0.875rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-3 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.75rem * var(--sy-reverse)); margin-top: calc(-0.75rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-2\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.625rem * var(--sy-reverse)); margin-top: calc(-0.625rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-2 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.5rem * var(--sy-reverse)); margin-top: calc(-0.5rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-1\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.375rem * var(--sy-reverse)); margin-top: calc(-0.375rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-1 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.25rem * var(--sy-reverse)); margin-top: calc(-0.25rem * calc(1 - var(--sy-reverse))); }
.xl\:sy-0\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.125rem * var(--sy-reverse)); margin-top: calc(-0.125rem * calc(1 - var(--sy-reverse))); }
.xl\:sy0 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0 * var(--sy-reverse)); margin-top: calc(0 * calc(1 - var(--sy-reverse))); }
.xl\:sy0\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.125rem * var(--sy-reverse)); margin-top: calc(0.125rem * calc(1 - var(--sy-reverse))); }
.xl\:sy1 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.25rem * var(--sy-reverse)); margin-top: calc(0.25rem * calc(1 - var(--sy-reverse))); }
.xl\:sy1\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.375rem * var(--sy-reverse)); margin-top: calc(0.375rem * calc(1 - var(--sy-reverse))); }
.xl\:sy2 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.5rem * var(--sy-reverse)); margin-top: calc(0.5rem * calc(1 - var(--sy-reverse))); }
.xl\:sy2\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.625rem * var(--sy-reverse)); margin-top: calc(0.625rem * calc(1 - var(--sy-reverse))); }
.xl\:sy3 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.75rem * var(--sy-reverse)); margin-top: calc(0.75rem * calc(1 - var(--sy-reverse))); }
.xl\:sy3\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.875rem * var(--sy-reverse)); margin-top: calc(0.875rem * calc(1 - var(--sy-reverse))); }
.xl\:sy4 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1rem * var(--sy-reverse)); margin-top: calc(1rem * calc(1 - var(--sy-reverse))); }
.xl\:sy5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1.25rem * var(--sy-reverse)); margin-top: calc(1.25rem * calc(1 - var(--sy-reverse))); }
.xl\:sy6 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1.5rem * var(--sy-reverse)); margin-top: calc(1.5rem * calc(1 - var(--sy-reverse))); }
.xl\:sy7 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1.75rem * var(--sy-reverse)); margin-top: calc(1.75rem * calc(1 - var(--sy-reverse))); }
.xl\:sy8 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2rem * var(--sy-reverse)); margin-top: calc(2rem * calc(1 - var(--sy-reverse))); }
.xl\:sy9 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2.25rem * var(--sy-reverse)); margin-top: calc(2.25rem * calc(1 - var(--sy-reverse))); }
.xl\:sy10 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2.5rem * var(--sy-reverse)); margin-top: calc(2.5rem * calc(1 - var(--sy-reverse))); }
.xl\:sy11 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2.75rem * var(--sy-reverse)); margin-top: calc(2.75rem * calc(1 - var(--sy-reverse))); }
.xl\:sy12 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(3rem * var(--sy-reverse)); margin-top: calc(3rem * calc(1 - var(--sy-reverse))); }
.xl\:sy14 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(3.5rem * var(--sy-reverse)); margin-top: calc(3.5rem * calc(1 - var(--sy-reverse))); }
.xl\:sy16 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(4rem * var(--sy-reverse)); margin-top: calc(4rem * calc(1 - var(--sy-reverse))); }
.xl\:sy20 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(5rem * var(--sy-reverse)); margin-top: calc(5rem * calc(1 - var(--sy-reverse))); }
.xl\:sy24 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(6rem * var(--sy-reverse)); margin-top: calc(6rem * calc(1 - var(--sy-reverse))); }
.xl\:sy28 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(7rem * var(--sy-reverse)); margin-top: calc(7rem * calc(1 - var(--sy-reverse))); }
.xl\:sy32 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(8rem * var(--sy-reverse)); margin-top: calc(8rem * calc(1 - var(--sy-reverse))); }
.xl\:sy36 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(9rem * var(--sy-reverse)); margin-top: calc(9rem * calc(1 - var(--sy-reverse))); }
.xl\:sy40 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(10rem * var(--sy-reverse)); margin-top: calc(10rem * calc(1 - var(--sy-reverse))); }
.xl\:sy44 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(11rem * var(--sy-reverse)); margin-top: calc(11rem * calc(1 - var(--sy-reverse))); }
.xl\:sy48 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(12rem * var(--sy-reverse)); margin-top: calc(12rem * calc(1 - var(--sy-reverse))); }
.xl\:sy52 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(13rem * var(--sy-reverse)); margin-top: calc(13rem * calc(1 - var(--sy-reverse))); }
.xl\:sy56 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(14rem * var(--sy-reverse)); margin-top: calc(14rem * calc(1 - var(--sy-reverse))); }
.xl\:sy60 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(15rem * var(--sy-reverse)); margin-top: calc(15rem * calc(1 - var(--sy-reverse))); }
.xl\:sy64 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(16rem * var(--sy-reverse)); margin-top: calc(16rem * calc(1 - var(--sy-reverse))); }
.xl\:sy72 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(18rem * var(--sy-reverse)); margin-top: calc(18rem * calc(1 - var(--sy-reverse))); }
.xl\:sy80 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(20rem * var(--sy-reverse)); margin-top: calc(20rem * calc(1 - var(--sy-reverse))); }
.xl\:sy96 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(24rem * var(--sy-reverse)); margin-top: calc(24rem * calc(1 - var(--sy-reverse))); }
.xl\:sy1px > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1px * var(--sx-reverse)); margin-top: calc(1px * calc(1 - var(--sy-reverse))); }
.xl\:sy_reverse > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 1; }
}
@media (min-width: 1400px) {
.xxl\:sx-96 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-24rem * var(--sx-reverse)); margin-left: calc(-24rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-80 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-20rem * var(--sx-reverse)); margin-left: calc(-20rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-72 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-18rem * var(--sx-reverse)); margin-left: calc(-18rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-64 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-16rem * var(--sx-reverse)); margin-left: calc(-16rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-60 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-15rem * var(--sx-reverse)); margin-left: calc(-15rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-56 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-14rem * var(--sx-reverse)); margin-left: calc(-14rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-52 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-13rem * var(--sx-reverse)); margin-left: calc(-13rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-48 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-12rem * var(--sx-reverse)); margin-left: calc(-12rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-44 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-11rem * var(--sx-reverse)); margin-left: calc(-11rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-40 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-10rem * var(--sx-reverse)); margin-left: calc(-10rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-36 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-9rem * var(--sx-reverse)); margin-left: calc(-9rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-32 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-8rem * var(--sx-reverse)); margin-left: calc(-8rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-28 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-7rem * var(--sx-reverse)); margin-left: calc(-7rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-24 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-6rem * var(--sx-reverse)); margin-left: calc(-6rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-20 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-5rem * var(--sx-reverse)); margin-left: calc(-5rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-16 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-4rem * var(--sx-reverse)); margin-left: calc(-4rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-14 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-3.5rem * var(--sx-reverse)); margin-left: calc(-3.5rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-12 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-3rem * var(--sx-reverse)); margin-left: calc(-3rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-11 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2.75rem * var(--sx-reverse)); margin-left: calc(-2.75rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-10 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2.5rem * var(--sx-reverse)); margin-left: calc(-2.5rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-9 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2.25rem * var(--sx-reverse)); margin-left: calc(-2.25rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-8 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-2rem * var(--sx-reverse)); margin-left: calc(-2rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-7 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1.75rem * var(--sx-reverse)); margin-left: calc(-1.75rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-6 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1.5rem * var(--sx-reverse)); margin-left: calc(-1.5rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1.25rem * var(--sx-reverse)); margin-left: calc(-1.25rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-4 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-1rem * var(--sx-reverse)); margin-left: calc(-1rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-3\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.875rem * var(--sx-reverse)); margin-left: calc(-0.875rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-3 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.75rem * var(--sx-reverse)); margin-left: calc(-0.75rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-2\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.625rem * var(--sx-reverse)); margin-left: calc(-0.625rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-2 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.5rem * var(--sx-reverse)); margin-left: calc(-0.5rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-1\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.375rem * var(--sx-reverse)); margin-left: calc(-0.375rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-1 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.25rem * var(--sx-reverse)); margin-left: calc(-0.25rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx-0\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(-0.125rem * var(--sx-reverse)); margin-left: calc(-0.125rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx0 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0 * var(--sx-reverse)); margin-left: calc(0 * calc(1 - var(--sx-reverse))); }
.xxl\:sx0\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.125rem * var(--sx-reverse)); margin-left: calc(0.125rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx1 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.25rem * var(--sx-reverse)); margin-left: calc(0.25rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx1\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.375rem * var(--sx-reverse)); margin-left: calc(0.375rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx2 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.5rem * var(--sx-reverse)); margin-left: calc(0.5rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx2\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.625rem * var(--sx-reverse)); margin-left: calc(0.625rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx3 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.75rem * var(--sx-reverse)); margin-left: calc(0.75rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx3\.5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(0.875rem * var(--sx-reverse)); margin-left: calc(0.875rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx4 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1rem * var(--sx-reverse)); margin-left: calc(1rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx5 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1.25rem * var(--sx-reverse)); margin-left: calc(1.25rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx6 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1.5rem * var(--sx-reverse)); margin-left: calc(1.5rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx7 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1.75rem * var(--sx-reverse)); margin-left: calc(1.75rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx8 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2rem * var(--sx-reverse)); margin-left: calc(2rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx9 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2.25rem * var(--sx-reverse)); margin-left: calc(2.25rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx10 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2.5rem * var(--sx-reverse)); margin-left: calc(2.5rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx11 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(2.75rem * var(--sx-reverse)); margin-left: calc(2.75rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx12 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(3rem * var(--sx-reverse)); margin-left: calc(3rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx14 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(3.5rem * var(--sx-reverse)); margin-left: calc(3.5rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx16 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(4rem * var(--sx-reverse)); margin-left: calc(4rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx20 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(5rem * var(--sx-reverse)); margin-left: calc(5rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx24 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(6rem * var(--sx-reverse)); margin-left: calc(6rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx28 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(7rem * var(--sx-reverse)); margin-left: calc(7rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx32 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(8rem * var(--sx-reverse)); margin-left: calc(8rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx36 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(9rem * var(--sx-reverse)); margin-left: calc(9rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx40 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(10rem * var(--sx-reverse)); margin-left: calc(10rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx44 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(11rem * var(--sx-reverse)); margin-left: calc(11rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx48 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(12rem * var(--sx-reverse)); margin-left: calc(12rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx52 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(13rem * var(--sx-reverse)); margin-left: calc(13rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx56 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(14rem * var(--sx-reverse)); margin-left: calc(14rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx60 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(15rem * var(--sx-reverse)); margin-left: calc(15rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx64 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(16rem * var(--sx-reverse)); margin-left: calc(16rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx72 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(18rem * var(--sx-reverse)); margin-left: calc(18rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx80 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(20rem * var(--sx-reverse)); margin-left: calc(20rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx96 > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(24rem * var(--sx-reverse)); margin-left: calc(24rem * calc(1 - var(--sx-reverse))); }
.xxl\:sx1px > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 0; margin-right: calc(1px * var(--sx-reverse)); margin-left: calc(1px * calc(1 - var(--sx-reverse))); }
.xxl\:sx_reverse > :not([hidden]) ~ :not([hidden]) { --sx-reverse: 1; }
.xxl\:sy-96 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-24rem * var(--sy-reverse)); margin-top: calc(-24rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-80 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-20rem * var(--sy-reverse)); margin-top: calc(-20rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-72 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-18rem * var(--sy-reverse)); margin-top: calc(-18rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-64 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-16rem * var(--sy-reverse)); margin-top: calc(-16rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-60 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-15rem * var(--sy-reverse)); margin-top: calc(-15rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-56 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-14rem * var(--sy-reverse)); margin-top: calc(-14rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-52 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-13rem * var(--sy-reverse)); margin-top: calc(-13rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-48 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-12rem * var(--sy-reverse)); margin-top: calc(-12rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-44 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-11rem * var(--sy-reverse)); margin-top: calc(-11rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-40 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-10rem * var(--sy-reverse)); margin-top: calc(-10rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-36 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-9rem * var(--sy-reverse)); margin-top: calc(-9rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-32 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-8rem * var(--sy-reverse)); margin-top: calc(-8rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-28 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-7rem * var(--sy-reverse)); margin-top: calc(-7rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-24 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-6rem * var(--sy-reverse)); margin-top: calc(-6rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-20 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-5rem * var(--sy-reverse)); margin-top: calc(-5rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-16 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-4rem * var(--sy-reverse)); margin-top: calc(-4rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-14 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-3.5rem * var(--sy-reverse)); margin-top: calc(-3.5rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-12 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-3rem * var(--sy-reverse)); margin-top: calc(-3rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-11 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2.75rem * var(--sy-reverse)); margin-top: calc(-2.75rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-10 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2.5rem * var(--sy-reverse)); margin-top: calc(-2.5rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-9 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2.25rem * var(--sy-reverse)); margin-top: calc(-2.25rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-8 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-2rem * var(--sy-reverse)); margin-top: calc(-2rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-7 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1.75rem * var(--sy-reverse)); margin-top: calc(-1.75rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-6 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1.5rem * var(--sy-reverse)); margin-top: calc(-1.5rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1.25rem * var(--sy-reverse)); margin-top: calc(-1.25rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-4 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-1rem * var(--sy-reverse)); margin-top: calc(-1rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-3\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.875rem * var(--sy-reverse)); margin-top: calc(-0.875rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-3 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.75rem * var(--sy-reverse)); margin-top: calc(-0.75rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-2\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.625rem * var(--sy-reverse)); margin-top: calc(-0.625rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-2 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.5rem * var(--sy-reverse)); margin-top: calc(-0.5rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-1\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.375rem * var(--sy-reverse)); margin-top: calc(-0.375rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-1 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.25rem * var(--sy-reverse)); margin-top: calc(-0.25rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy-0\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(-0.125rem * var(--sy-reverse)); margin-top: calc(-0.125rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy0 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0 * var(--sy-reverse)); margin-top: calc(0 * calc(1 - var(--sy-reverse))); }
.xxl\:sy0\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.125rem * var(--sy-reverse)); margin-top: calc(0.125rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy1 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.25rem * var(--sy-reverse)); margin-top: calc(0.25rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy1\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.375rem * var(--sy-reverse)); margin-top: calc(0.375rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy2 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.5rem * var(--sy-reverse)); margin-top: calc(0.5rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy2\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.625rem * var(--sy-reverse)); margin-top: calc(0.625rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy3 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.75rem * var(--sy-reverse)); margin-top: calc(0.75rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy3\.5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(0.875rem * var(--sy-reverse)); margin-top: calc(0.875rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy4 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1rem * var(--sy-reverse)); margin-top: calc(1rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy5 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1.25rem * var(--sy-reverse)); margin-top: calc(1.25rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy6 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1.5rem * var(--sy-reverse)); margin-top: calc(1.5rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy7 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1.75rem * var(--sy-reverse)); margin-top: calc(1.75rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy8 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2rem * var(--sy-reverse)); margin-top: calc(2rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy9 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2.25rem * var(--sy-reverse)); margin-top: calc(2.25rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy10 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2.5rem * var(--sy-reverse)); margin-top: calc(2.5rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy11 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(2.75rem * var(--sy-reverse)); margin-top: calc(2.75rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy12 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(3rem * var(--sy-reverse)); margin-top: calc(3rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy14 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(3.5rem * var(--sy-reverse)); margin-top: calc(3.5rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy16 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(4rem * var(--sy-reverse)); margin-top: calc(4rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy20 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(5rem * var(--sy-reverse)); margin-top: calc(5rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy24 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(6rem * var(--sy-reverse)); margin-top: calc(6rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy28 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(7rem * var(--sy-reverse)); margin-top: calc(7rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy32 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(8rem * var(--sy-reverse)); margin-top: calc(8rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy36 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(9rem * var(--sy-reverse)); margin-top: calc(9rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy40 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(10rem * var(--sy-reverse)); margin-top: calc(10rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy44 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(11rem * var(--sy-reverse)); margin-top: calc(11rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy48 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(12rem * var(--sy-reverse)); margin-top: calc(12rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy52 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(13rem * var(--sy-reverse)); margin-top: calc(13rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy56 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(14rem * var(--sy-reverse)); margin-top: calc(14rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy60 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(15rem * var(--sy-reverse)); margin-top: calc(15rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy64 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(16rem * var(--sy-reverse)); margin-top: calc(16rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy72 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(18rem * var(--sy-reverse)); margin-top: calc(18rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy80 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(20rem * var(--sy-reverse)); margin-top: calc(20rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy96 > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(24rem * var(--sy-reverse)); margin-top: calc(24rem * calc(1 - var(--sy-reverse))); }
.xxl\:sy1px > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 0; margin-bottom: calc(1px * var(--sx-reverse)); margin-top: calc(1px * calc(1 - var(--sy-reverse))); }
.xxl\:sy_reverse > :not([hidden]) ~ :not([hidden]) { --sy-reverse: 1; }
}

50
src/axios.js Normal file
View File

@ -0,0 +1,50 @@
import axios from 'axios'
import router from '@/router'
const baseURL = 'https://api.ira-lex.com/'
const ConfiguredAxios = axios.create({
baseURL,
headers: {
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Methods': 'GET, PUT, POST, DELETE, OPTIONS',
'Access-Control-Allow-Header': 'Content-Type',
'Accept': "application/json",
'Content-Type' : 'application/json',
'Auth': localStorage.getItem("accessToken") || localStorage.accessToken,
'Cache-Control': 'no-cache',
'Pragma':'Pragma',
'Expires': '0',
}
})
ConfiguredAxios.interceptors.request.use(
config => {
config.headers["Auth"] = localStorage.getItem("accessToken")
config.headers["Access-Control-Allow-Origin"] = '*'
return config
},
error => {
Promise.reject(error)
}
);
ConfiguredAxios.interceptors.response.use(
function (res)
{
return res
},
function ({response})
{
console.log(response,'response response response')
if (response.status === 401)
{
router.push({path:'/login'});
}
return Promise.reject(response);
}
);
export default ConfiguredAxios

View File

@ -0,0 +1,174 @@
<!--
Documentation:
Props:
Name Type Description
------ ------- --------------------------------------------------------------
type String The type of the user you want to add; can be one of "user", "lawyer" or "law firm"
-->
<template>
<b-modal id="modal-add-user" v-bind:centered="true" size="lg">
<!-- Header -->
<template v-slot:modal-header="{ close }">
<h2 v-if="type === 'user'" class="text-primary m-0">Add User</h2>
<h2 v-else-if="type === 'lawyer'" class="text-primary m-0">Add Lawyer</h2>
<h2 v-else-if="type === 'law firm'" class="text-primary m-0">Add Law Firm</h2>
<img style="cursor: pointer;" src="@/assets/svg/cross.svg" alt="close-icon" v-on:click="close()">
</template>
<!-- Body -->
<template v-slot:default>
<b-form class="d-flex flex-column">
<b-row>
<b-col md="6">
<b-form-group label="First Name" label-for="txtFirstName">
<b-form-input id="txtFirstName" />
</b-form-group>
</b-col>
<b-col md="6">
<b-form-group label="Last Name" label-for="txtLastName">
<b-form-input id="txtLastName" />
</b-form-group>
</b-col>
<b-col md="12">
<b-form-group label="Email" label-for="txtEmail">
<b-form-input id="txtEmail" placeholder="example@gmail.com" />
</b-form-group>
</b-col>
<b-col md="6">
<b-form-group label="User Type" label-for="dpdUserType">
<b-form-select id="dpdUserType" />
</b-form-group>
</b-col>
<b-col md="6">
<b-form-group label="Birth Day" label-for="dtpBirthDay">
<b-form-datepicker
id="dtpBirthDay"
v-bind:date-format-options="{ day: 'numeric', month: 'long', year: 'numeric' }"
today-button
close-button
label-help=""
nav-button-variant="primary"
/>
</b-form-group>
</b-col>
<b-col md="5" lg="4">
<b-form-group label="Gender">
<div class="d-flex" style="column-gap: 1rem;">
<b-form-radio value="0" name="gender">Male</b-form-radio>
<b-form-radio value="1" name="gender">Female</b-form-radio>
</div>
</b-form-group>
</b-col>
<b-col md="5" lg="4">
<b-form-group label="Martial Status">
<div class="d-flex" style="column-gap: 1rem;">
<b-form-radio value="0" name="martial-status">Married</b-form-radio>
<b-form-radio value="1" name="martial-status">Single</b-form-radio>
</div>
</b-form-group>
</b-col>
<b-col md="5" lg="4">
<b-form-group label="Status">
<div class="d-flex" style="column-gap: 1rem;">
<b-form-radio value="0" name="status">Active</b-form-radio>
<b-form-radio value="1" name="status">Inactive</b-form-radio>
</div>
</b-form-group>
</b-col>
<b-col class="add-user-form--bottom-row" md="12">
<b-form-group id="phone-number" label="Phone Number:">
<div style="display: flex; align-items: center; column-gap: 1rem;">
<b-form-input type="number" v-bind:max="3" />
<span style="min-width: 0.60rem;">--</span>
<b-form-input type="number" v-bind:max="4" />
<b-form-input type="number" v-bind:max="4" />
<b-form-input type="number" v-bind:max="4" />
</div>
</b-form-group>
<b-form-group id="password" label="Password:">
<b-form-input />
</b-form-group>
<b-form-group id="address" label="Address:">
<b-form-textarea rows="4" no-resize style="margin-top: 0.2rem;" />
</b-form-group>
</b-col>
</b-row>
</b-form>
</template>
<!-- Footer -->
<template v-slot:modal-footer="{ hide }">
<b-button
class="mr-1"
variant="primary"
v-ripple.400="'rgba(255, 255, 255, 0.15)'"
>
Save New
<span v-if="type === 'user'">User</span>
<span v-else-if="type === 'lawyer'">Lawyer</span>
<span v-else-if="type === 'law firm'">Law Firm</span>
</b-button>
or
<a class="text-primary" v-on:click="hide()">Cancel</a>
</template>
</b-modal>
</template>
<script>
import { BForm, BButton, BRow, BCol, BFormGroup, BFormInput, BFormSelect, BFormDatepicker, BFormRadio, BFormTextarea } from 'bootstrap-vue'
import Ripple from 'vue-ripple-directive'
export default {
name: 'AddUserModalComponent',
props: {
type: {
type: String,
required: true,
},
},
components: {
BForm,
BButton,
BRow,
BCol,
BFormGroup,
BFormInput,
BFormSelect,
BFormDatepicker,
BFormRadio,
BFormTextarea,
},
directives: {
Ripple,
},
}
</script>
<style scoped lang="scss">
.add-user-form--bottom-row {
display: grid;
grid-template-columns: 1fr;
}
@media (min-width: 768px) {
.add-user-form--bottom-row {
grid-template-columns: 1fr 1fr;
column-gap: 1.75rem;
#phone-number {
grid-area: 1 / 1 / span 1 / span 1;
}
#password {
grid-area: 2 / 1 / span 1 / span 1;
}
#address {
grid-area: 1 / 2 / span 2 / span 2;
}
}
}
</style>

104
src/mixins/index.js Normal file
View File

@ -0,0 +1,104 @@
/*
Contains a bunch of general-purpose utilities, XTable methods and data, etc.
*/
import axios from "@/axios"
export default {
data() {
return {
Form_D: this.$form.createForm(this, {name: 'coordinated'}),
DateFormat_D: 'YYYY-MM-DD',
SearchMatterOptions_D: {
placeholder: 'search to Matter',
label: 'Matters',
field: 'matter',
width: '100%',
allow_clear: true,
},
SearchContactOptions_D: {
placeholder: 'search to Contact',
label: 'Contacts',
field: 'contact',
width: '100%',
allow_clear: true,
},
}
},
computed:{
isSmallerScreen()
{
return this.$store.state.windowWidth < 768
},
},
methods:{
async RemoveItem(index,array_item,id,new_array,item_delete)
{
console.log(array_item,'array_item array_item')
const Keys = this.form.getFieldValue(item_delete)
if( this.editContact && id )
{
this.form.setFieldsValue({
[item_delete]: Keys.filter(item => item.id !== id),
})
const find_id_remove = array_item.find(item=>item.id == id)
new_array.push(find_id_remove.id)
await axios.post(`/matter/delete/${this.$route.params.id}/`, {[item_delete]: new_array})
}
else
{
this.form.setFieldsValue({
[item_delete]: Keys.filter((item,i) => i !== index),
})
}
array_item.splice(index,1)
},
onlyNumber($event)
{
let keyCode = ($event.keyCode ? $event.keyCode : $event.which)
if( (keyCode > 31 && (keyCode < 48 || keyCode > 57)) && keyCode !== 46 )
{
$event.preventDefault()
}
},
FilterOption(Input, Option)
{
return (
Option.componentOptions.children[0].text.toLowerCase().indexOf(Input.toLowerCase()) >= 0
)
},
GetRandomDigitsWords(length)
{
let result = '';
let characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
let charactersLength = characters.length;
for ( let i = 0; i < length; i++ ) {
result += characters.charAt(Math.floor(Math.random() * charactersLength));
}
return result;
},
FindScrollHeight(element)
{
let height_collapse = element.scrollHeight
this.isSmallerScreen ? height_collapse += 160 : height_collapse += 79
element.style.maxHeight = `${height_collapse}px`
},
Discard(url) { this.$router.push(url) },
IsInEditMode() { return this.$route.params && this.$route.params.id !== undefined },
CheckPagenation(ref)
{
const tbl_length = ref.data.length
if( tbl_length <= 5 || tbl_length <= 10 || tbl_length <= 20 )
ref.query.page = 1
},
}
}

View File

@ -115,7 +115,7 @@ export default {
}
</script>
<style lang="scss" scoped>
<style scoped lang="scss">
#add-user--container {
width: auto;
}

View File

@ -1,11 +1,21 @@
<template>
<div class="page--main">
<h3>Users List</h3>
<div v-bind:class="{ 'page--main': users.length === 0 }">
<!-- Title -->
<div class="d-flex justify-content-between">
<h3>Users List</h3>
<div v-if="users.length > 0" class="sx2">
<b-button variant="danger" v-ripple.400="'rgba(255, 255, 255, 0.15)'">Remove</b-button>
<b-button variant="primary" v-ripple.400="'rgba(255, 255, 255, 0.15)'" v-b-modal:modal-add-user>Add</b-button>
</div>
</div>
<!-- Body -->
<b-card class="mt-1 position-relative" style="min-height: 95%;">
<!-- No Users Exist -->
<div id="no-users--container" v-if="users.length === 0" class="d-flex flex-column justify-content-center align-items-center">
<img src="@/assets/svg/hero.svg" alt="no-users-found">
<h4 class="" style="text-align: center;">You haven't created any users.</h4>
<p style="text-align: center;">Click here or use the button in the bottom to create a new user.</p>
<p style="text-align: center;">Click the following button to create a new user.</p>
<b-button
variant="primary"
v-ripple.400="'rgba(255, 255, 255, 0.15)'"
@ -14,113 +24,24 @@
Add User
</b-button>
</div>
<!-- List of Users -->
<div v-else>
</div>
</b-card>
<b-modal id="modal-add-user" v-bind:centered="true" size="lg">
<template v-slot:modal-header="{ close }">
<h2 class="text-primary m-0">Add User</h2>
<img style="cursor: pointer;" src="@/assets/svg/cross.svg" alt="close-icon" v-on:click="close()">
</template>
<template v-slot:default>
<b-form class="d-flex flex-column">
<b-row>
<b-col md="6">
<b-form-group label="First Name" label-for="txtFirstName">
<b-form-input id="txtFirstName" />
</b-form-group>
</b-col>
<b-col md="6">
<b-form-group label="Last Name" label-for="txtLastName">
<b-form-input id="txtLastName" />
</b-form-group>
</b-col>
<b-col md="12">
<b-form-group label="Email" label-for="txtEmail">
<b-form-input id="txtEmail" placeholder="example@gmail.com" />
</b-form-group>
</b-col>
<b-col md="6">
<b-form-group label="User Type" label-for="dpdUserType">
<b-form-select id="dpdUserType" />
</b-form-group>
</b-col>
<b-col md="6">
<b-form-group label="Birth Day" label-for="dtpBirthDay">
<b-form-datepicker
id="dtpBirthDay"
v-bind:date-format-options="{ day: 'numeric', month: 'long', year: 'numeric' }"
today-button
close-button
label-help=""
nav-button-variant="primary"
/>
</b-form-group>
</b-col>
<b-col md="4">
<b-form-group label="Gender">
<div class="d-flex" style="column-gap: 1rem;">
<b-form-radio value="0" name="gender">Male</b-form-radio>
<b-form-radio value="1" name="gender">Female</b-form-radio>
</div>
</b-form-group>
</b-col>
<b-col md="4">
<b-form-group label="Martial Status">
<div class="d-flex" style="column-gap: 1rem;">
<b-form-radio value="0" name="martial-status">Married</b-form-radio>
<b-form-radio value="1" name="martial-status">Single</b-form-radio>
</div>
</b-form-group>
</b-col>
<b-col md="4">
<b-form-group label="Status">
<div class="d-flex" style="column-gap: 1rem;">
<b-form-radio value="0" name="status">Active</b-form-radio>
<b-form-radio value="1" name="status">Inactive</b-form-radio>
</div>
</b-form-group>
</b-col>
<b-col class="add-user-form--bottom-row" md="12">
<b-form-group id="phone-number" label="Phone Number:">
<div style="display: flex; align-items: center; column-gap: 1rem;">
<b-form-input type="number" v-bind:max="3" />
<span style="min-width: 0.60rem;">--</span>
<b-form-input type="number" v-bind:max="4" />
<b-form-input type="number" v-bind:max="4" />
<b-form-input type="number" v-bind:max="4" />
</div>
</b-form-group>
<b-form-group id="password" label="Password:">
<b-form-input />
</b-form-group>
<b-form-group id="address" label="Address:">
<b-form-textarea rows="4" no-resize style="margin-top: 0.2rem;" />
</b-form-group>
</b-col>
</b-row>
</b-form>
</template>
<template v-slot:modal-footer="{ hide }">
<b-button
class="mr-1"
variant="primary"
v-ripple.400="'rgba(255, 255, 255, 0.15)'"
>
Save New User
</b-button>
or
<a class="text-primary" v-on:click="hide()">Cancel</a>
</template>
</b-modal>
<AddUserModal id="modal-add-user" type="user" />
</div>
</template>
<script>
import { BCard, BButton, BForm, BRow, BCol, BFormGroup, BFormRadio, BFormInput, BFormDatepicker, BFormSelect, BModal, VBModal } from 'bootstrap-vue'
import { BCard, BButton, VBModal } from 'bootstrap-vue'
import Ripple from 'vue-ripple-directive'
import AddUserModal from '@/components/ui/AddUserModal'
// import XTable from "@/components/x-table/XTable"
import * as TableCol from "./userTbl"
import axios from '@/axios'
import Mixin from '@/mixins/index'
export default {
name: 'UsersListComponent',
@ -128,15 +49,8 @@ export default {
components: {
BCard,
BButton,
BForm,
BRow,
BCol,
BFormGroup,
BFormRadio,
BFormInput,
BFormDatepicker,
BFormSelect,
BModal,
AddUserModal,
// XTable,
},
directives: {
@ -144,10 +58,13 @@ export default {
Ripple,
},
mixins: [
Mixin,
],
data() {
return {
users: [],
loading: true,
users: [2],
}
},
}
@ -165,6 +82,7 @@ export default {
img {
width: 100%;
user-select: none;
}
}
@media (min-width: 768px) {

View File

@ -0,0 +1,11 @@
import XTbl, { Xtc } from '../../components/x-table/index'
const tbl = new XTbl('', 'UsersDeleted')
tbl.add(new Xtc('action', 'Action').noSort().renderSlot('action'))
tbl.add(new Xtc('name', 'Name'))
tbl.add(new Xtc('email', 'Email'))
tbl.add(new Xtc('user_type', 'User Type'))
tbl.add(new Xtc('birthday', 'Birthday'))
tbl.add(new Xtc('status', 'status'))
export default tbl

View File

@ -0,0 +1,11 @@
import XTbl, { Xtc } from '@/components/x-table/index'
const tbl = new XTbl('', 'Users')
tbl.add(new Xtc('action', 'Action').noSort().renderSlot('action'))
tbl.add(new Xtc('name', 'Name'))
tbl.add(new Xtc('email', 'Email'))
tbl.add(new Xtc('user_type', 'User Type'))
tbl.add(new Xtc('birthday', 'Birthday'))
tbl.add(new Xtc('status', 'status'))
export default tbl