/*!
 * Fluid6 VW Spacing Utilities
 * Viewport-width based spacing utilities: 1vw – 10vw
 */
:root {
  --vw-space-1: 1vw;
  --vw-space-2: 2vw;
  --vw-space-3: 3vw;
  --vw-space-4: 4vw;
  --vw-space-5: 5vw;
  --vw-space-6: 6vw;
  --vw-space-7: 7vw;
  --vw-space-8: 8vw;
  --vw-space-9: 9vw;
  --vw-space-10: 10vw;
}
/* 1vw */
.p-vw-1  { padding: var(--vw-space-1) !important; }
.pt-vw-1 { padding-top: var(--vw-space-1) !important; }
.pe-vw-1 { padding-inline-end: var(--vw-space-1) !important; }
.pb-vw-1 { padding-bottom: var(--vw-space-1) !important; }
.ps-vw-1 { padding-inline-start: var(--vw-space-1) !important; }
.px-vw-1 { padding-inline: var(--vw-space-1) !important; }
.py-vw-1 { padding-block: var(--vw-space-1) !important; }

.m-vw-1  { margin: var(--vw-space-1) !important; }
.mt-vw-1 { margin-top: var(--vw-space-1) !important; }
.me-vw-1 { margin-inline-end: var(--vw-space-1) !important; }
.mb-vw-1 { margin-bottom: var(--vw-space-1) !important; }
.ms-vw-1 { margin-inline-start: var(--vw-space-1) !important; }
.mx-vw-1 { margin-inline: var(--vw-space-1) !important; }
.my-vw-1 { margin-block: var(--vw-space-1) !important; }

.g-vw-1  { --bs-gutter-x: var(--vw-space-1); --bs-gutter-y: var(--vw-space-1); }
.gx-vw-1 { --bs-gutter-x: var(--vw-space-1); }
.gy-vw-1 { --bs-gutter-y: var(--vw-space-1); }

/* 2vw */
.p-vw-2  { padding: var(--vw-space-2) !important; }
.pt-vw-2 { padding-top: var(--vw-space-2) !important; }
.pe-vw-2 { padding-inline-end: var(--vw-space-2) !important; }
.pb-vw-2 { padding-bottom: var(--vw-space-2) !important; }
.ps-vw-2 { padding-inline-start: var(--vw-space-2) !important; }
.px-vw-2 { padding-inline: var(--vw-space-2) !important; }
.py-vw-2 { padding-block: var(--vw-space-2) !important; }

.m-vw-2  { margin: var(--vw-space-2) !important; }
.mt-vw-2 { margin-top: var(--vw-space-2) !important; }
.me-vw-2 { margin-inline-end: var(--vw-space-2) !important; }
.mb-vw-2 { margin-bottom: var(--vw-space-2) !important; }
.ms-vw-2 { margin-inline-start: var(--vw-space-2) !important; }
.mx-vw-2 { margin-inline: var(--vw-space-2) !important; }
.my-vw-2 { margin-block: var(--vw-space-2) !important; }

.g-vw-2  { --bs-gutter-x: var(--vw-space-2); --bs-gutter-y: var(--vw-space-2); }
.gx-vw-2 { --bs-gutter-x: var(--vw-space-2); }
.gy-vw-2 { --bs-gutter-y: var(--vw-space-2); }

/* 3vw */
.p-vw-3  { padding: var(--vw-space-3) !important; }
.pt-vw-3 { padding-top: var(--vw-space-3) !important; }
.pe-vw-3 { padding-inline-end: var(--vw-space-3) !important; }
.pb-vw-3 { padding-bottom: var(--vw-space-3) !important; }
.ps-vw-3 { padding-inline-start: var(--vw-space-3) !important; }
.px-vw-3 { padding-inline: var(--vw-space-3) !important; }
.py-vw-3 { padding-block: var(--vw-space-3) !important; }

.m-vw-3  { margin: var(--vw-space-3) !important; }
.mt-vw-3 { margin-top: var(--vw-space-3) !important; }
.me-vw-3 { margin-inline-end: var(--vw-space-3) !important; }
.mb-vw-3 { margin-bottom: var(--vw-space-3) !important; }
.ms-vw-3 { margin-inline-start: var(--vw-space-3) !important; }
.mx-vw-3 { margin-inline: var(--vw-space-3) !important; }
.my-vw-3 { margin-block: var(--vw-space-3) !important; }

.g-vw-3  { --bs-gutter-x: var(--vw-space-3); --bs-gutter-y: var(--vw-space-3); }
.gx-vw-3 { --bs-gutter-x: var(--vw-space-3); }
.gy-vw-3 { --bs-gutter-y: var(--vw-space-3); }

/* 4vw */
.p-vw-4  { padding: var(--vw-space-4) !important; }
.pt-vw-4 { padding-top: var(--vw-space-4) !important; }
.pe-vw-4 { padding-inline-end: var(--vw-space-4) !important; }
.pb-vw-4 { padding-bottom: var(--vw-space-4) !important; }
.ps-vw-4 { padding-inline-start: var(--vw-space-4) !important; }
.px-vw-4 { padding-inline: var(--vw-space-4) !important; }
.py-vw-4 { padding-block: var(--vw-space-4) !important; }

.m-vw-4  { margin: var(--vw-space-4) !important; }
.mt-vw-4 { margin-top: var(--vw-space-4) !important; }
.me-vw-4 { margin-inline-end: var(--vw-space-4) !important; }
.mb-vw-4 { margin-bottom: var(--vw-space-4) !important; }
.ms-vw-4 { margin-inline-start: var(--vw-space-4) !important; }
.mx-vw-4 { margin-inline: var(--vw-space-4) !important; }
.my-vw-4 { margin-block: var(--vw-space-4) !important; }

.g-vw-4  { --bs-gutter-x: var(--vw-space-4); --bs-gutter-y: var(--vw-space-4); }
.gx-vw-4 { --bs-gutter-x: var(--vw-space-4); }
.gy-vw-4 { --bs-gutter-y: var(--vw-space-4); }

/* 5vw */
.p-vw-5  { padding: var(--vw-space-5) !important; }
.pt-vw-5 { padding-top: var(--vw-space-5) !important; }
.pe-vw-5 { padding-inline-end: var(--vw-space-5) !important; }
.pb-vw-5 { padding-bottom: var(--vw-space-5) !important; }
.ps-vw-5 { padding-inline-start: var(--vw-space-5) !important; }
.px-vw-5 { padding-inline: var(--vw-space-5) !important; }
.py-vw-5 { padding-block: var(--vw-space-5) !important; }

.m-vw-5  { margin: var(--vw-space-5) !important; }
.mt-vw-5 { margin-top: var(--vw-space-5) !important; }
.me-vw-5 { margin-inline-end: var(--vw-space-5) !important; }
.mb-vw-5 { margin-bottom: var(--vw-space-5) !important; }
.ms-vw-5 { margin-inline-start: var(--vw-space-5) !important; }
.mx-vw-5 { margin-inline: var(--vw-space-5) !important; }
.my-vw-5 { margin-block: var(--vw-space-5) !important; }

.g-vw-5  { --bs-gutter-x: var(--vw-space-5); --bs-gutter-y: var(--vw-space-5); }
.gx-vw-5 { --bs-gutter-x: var(--vw-space-5); }
.gy-vw-5 { --bs-gutter-y: var(--vw-space-5); }

/* 6vw */
.p-vw-6  { padding: var(--vw-space-6) !important; }
.pt-vw-6 { padding-top: var(--vw-space-6) !important; }
.pe-vw-6 { padding-inline-end: var(--vw-space-6) !important; }
.pb-vw-6 { padding-bottom: var(--vw-space-6) !important; }
.ps-vw-6 { padding-inline-start: var(--vw-space-6) !important; }
.px-vw-6 { padding-inline: var(--vw-space-6) !important; }
.py-vw-6 { padding-block: var(--vw-space-6) !important; }

.m-vw-6  { margin: var(--vw-space-6) !important; }
.mt-vw-6 { margin-top: var(--vw-space-6) !important; }
.me-vw-6 { margin-inline-end: var(--vw-space-6) !important; }
.mb-vw-6 { margin-bottom: var(--vw-space-6) !important; }
.ms-vw-6 { margin-inline-start: var(--vw-space-6) !important; }
.mx-vw-6 { margin-inline: var(--vw-space-6) !important; }
.my-vw-6 { margin-block: var(--vw-space-6) !important; }

.g-vw-6  { --bs-gutter-x: var(--vw-space-6); --bs-gutter-y: var(--vw-space-6); }
.gx-vw-6 { --bs-gutter-x: var(--vw-space-6); }
.gy-vw-6 { --bs-gutter-y: var(--vw-space-6); }

/* 7vw */
.p-vw-7  { padding: var(--vw-space-7) !important; }
.pt-vw-7 { padding-top: var(--vw-space-7) !important; }
.pe-vw-7 { padding-inline-end: var(--vw-space-7) !important; }
.pb-vw-7 { padding-bottom: var(--vw-space-7) !important; }
.ps-vw-7 { padding-inline-start: var(--vw-space-7) !important; }
.px-vw-7 { padding-inline: var(--vw-space-7) !important; }
.py-vw-7 { padding-block: var(--vw-space-7) !important; }

.m-vw-7  { margin: var(--vw-space-7) !important; }
.mt-vw-7 { margin-top: var(--vw-space-7) !important; }
.me-vw-7 { margin-inline-end: var(--vw-space-7) !important; }
.mb-vw-7 { margin-bottom: var(--vw-space-7) !important; }
.ms-vw-7 { margin-inline-start: var(--vw-space-7) !important; }
.mx-vw-7 { margin-inline: var(--vw-space-7) !important; }
.my-vw-7 { margin-block: var(--vw-space-7) !important; }

.g-vw-7  { --bs-gutter-x: var(--vw-space-7); --bs-gutter-y: var(--vw-space-7); }
.gx-vw-7 { --bs-gutter-x: var(--vw-space-7); }
.gy-vw-7 { --bs-gutter-y: var(--vw-space-7); }

/* 8vw */
.p-vw-8  { padding: var(--vw-space-8) !important; }
.pt-vw-8 { padding-top: var(--vw-space-8) !important; }
.pe-vw-8 { padding-inline-end: var(--vw-space-8) !important; }
.pb-vw-8 { padding-bottom: var(--vw-space-8) !important; }
.ps-vw-8 { padding-inline-start: var(--vw-space-8) !important; }
.px-vw-8 { padding-inline: var(--vw-space-8) !important; }
.py-vw-8 { padding-block: var(--vw-space-8) !important; }

.m-vw-8  { margin: var(--vw-space-8) !important; }
.mt-vw-8 { margin-top: var(--vw-space-8) !important; }
.me-vw-8 { margin-inline-end: var(--vw-space-8) !important; }
.mb-vw-8 { margin-bottom: var(--vw-space-8) !important; }
.ms-vw-8 { margin-inline-start: var(--vw-space-8) !important; }
.mx-vw-8 { margin-inline: var(--vw-space-8) !important; }
.my-vw-8 { margin-block: var(--vw-space-8) !important; }

.g-vw-8  { --bs-gutter-x: var(--vw-space-8); --bs-gutter-y: var(--vw-space-8); }
.gx-vw-8 { --bs-gutter-x: var(--vw-space-8); }
.gy-vw-8 { --bs-gutter-y: var(--vw-space-8); }

/* 9vw */
.p-vw-9  { padding: var(--vw-space-9) !important; }
.pt-vw-9 { padding-top: var(--vw-space-9) !important; }
.pe-vw-9 { padding-inline-end: var(--vw-space-9) !important; }
.pb-vw-9 { padding-bottom: var(--vw-space-9) !important; }
.ps-vw-9 { padding-inline-start: var(--vw-space-9) !important; }
.px-vw-9 { padding-inline: var(--vw-space-9) !important; }
.py-vw-9 { padding-block: var(--vw-space-9) !important; }

.m-vw-9  { margin: var(--vw-space-9) !important; }
.mt-vw-9 { margin-top: var(--vw-space-9) !important; }
.me-vw-9 { margin-inline-end: var(--vw-space-9) !important; }
.mb-vw-9 { margin-bottom: var(--vw-space-9) !important; }
.ms-vw-9 { margin-inline-start: var(--vw-space-9) !important; }
.mx-vw-9 { margin-inline: var(--vw-space-9) !important; }
.my-vw-9 { margin-block: var(--vw-space-9) !important; }

.g-vw-9  { --bs-gutter-x: var(--vw-space-9); --bs-gutter-y: var(--vw-space-9); }
.gx-vw-9 { --bs-gutter-x: var(--vw-space-9); }
.gy-vw-9 { --bs-gutter-y: var(--vw-space-9); }

/* 10vw */
.p-vw-10  { padding: var(--vw-space-10) !important; }
.pt-vw-10 { padding-top: var(--vw-space-10) !important; }
.pe-vw-10 { padding-inline-end: var(--vw-space-10) !important; }
.pb-vw-10 { padding-bottom: var(--vw-space-10) !important; }
.ps-vw-10 { padding-inline-start: var(--vw-space-10) !important; }
.px-vw-10 { padding-inline: var(--vw-space-10) !important; }
.py-vw-10 { padding-block: var(--vw-space-10) !important; }

.m-vw-10  { margin: var(--vw-space-10) !important; }
.mt-vw-10 { margin-top: var(--vw-space-10) !important; }
.me-vw-10 { margin-inline-end: var(--vw-space-10) !important; }
.mb-vw-10 { margin-bottom: var(--vw-space-10) !important; }
.ms-vw-10 { margin-inline-start: var(--vw-space-10) !important; }
.mx-vw-10 { margin-inline: var(--vw-space-10) !important; }
.my-vw-10 { margin-block: var(--vw-space-10) !important; }

.g-vw-10  { --bs-gutter-x: var(--vw-space-10); --bs-gutter-y: var(--vw-space-10); }
.gx-vw-10 { --bs-gutter-x: var(--vw-space-10); }
.gy-vw-10 { --bs-gutter-y: var(--vw-space-10); }