/*
// Spacing
*/

/* Without breakpoints */
/* Zero and half values */
.m-0 {
      margin: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
    }
.mt-0 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
    }
.mr-0 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
    }
.mb-0 {
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
    }
.ml-0 {
      margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
    }
.my-0 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
    }
.mx-0 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
      margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
    }
.m-1 {
      margin: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
    }
.mt-1 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
    }
.mr-1 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
    }
.mb-1 {
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
    }
.ml-1 {
      margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
    }
.my-1 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
    }
.mx-1 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
      margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
    }
/* The rest */
.m-2 {
      margin: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
    }
.mt-2 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
    }
.mr-2 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
    }
.mb-2 {
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
    }
.ml-2 {
      margin-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
    }
.my-2 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
    }
.mx-2 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
      margin-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
    }
.m-3 {
      margin: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
    }
.mt-3 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
    }
.mr-3 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
    }
.mb-3 {
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
    }
.ml-3 {
      margin-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
    }
.my-3 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
    }
.mx-3 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
      margin-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
    }
.m-4 {
      margin: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
    }
.mt-4 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
    }
.mr-4 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
    }
.mb-4 {
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
    }
.ml-4 {
      margin-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
    }
.my-4 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
    }
.mx-4 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
      margin-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
    }
.m-5 {
      margin: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
    }
.mt-5 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
    }
.mr-5 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
    }
.mb-5 {
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
    }
.ml-5 {
      margin-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
    }
.my-5 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
    }
.mx-5 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
      margin-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
    }
.m-6 {
      margin: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
    }
.mt-6 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
    }
.mr-6 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
    }
.mb-6 {
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
    }
.ml-6 {
      margin-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
    }
.my-6 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
    }
.mx-6 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
      margin-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
    }
.m-7 {
      margin: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
    }
.mt-7 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
    }
.mr-7 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
    }
.mb-7 {
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
    }
.ml-7 {
      margin-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
    }
.my-7 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
    }
.mx-7 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
      margin-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
    }
.m-8 {
      margin: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
    }
.mt-8 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
    }
.mr-8 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
    }
.mb-8 {
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
    }
.ml-8 {
      margin-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
    }
.my-8 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
    }
.mx-8 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
      margin-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
    }
.m-9 {
      margin: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
    }
.mt-9 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
    }
.mr-9 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
    }
.mb-9 {
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
    }
.ml-9 {
      margin-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
    }
.my-9 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
    }
.mx-9 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
      margin-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
    }
.m-10 {
      margin: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
    }
.mt-10 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
    }
.mr-10 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
    }
.mb-10 {
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
    }
.ml-10 {
      margin-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
    }
.my-10 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
    }
.mx-10 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
      margin-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
    }
.m-11 {
      margin: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
    }
.mt-11 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
    }
.mr-11 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
    }
.mb-11 {
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
    }
.ml-11 {
      margin-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
    }
.my-11 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
    }
.mx-11 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
      margin-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
    }
.m-12 {
      margin: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
    }
.mt-12 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
    }
.mr-12 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
    }
.mb-12 {
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
    }
.ml-12 {
      margin-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
    }
.my-12 {
      margin-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
      margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
    }
.mx-12 {
      margin-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
      margin-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
    }
/* Zero and half values */
.p-0 {
      padding: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
    }
.pt-0 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
    }
.pr-0 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
    }
.pb-0 {
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
    }
.pl-0 {
      padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
    }
.py-0 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
    }
.px-0 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
      padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
    }
.p-1 {
      padding: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
    }
.pt-1 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
    }
.pr-1 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
    }
.pb-1 {
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
    }
.pl-1 {
      padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
    }
.py-1 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
    }
.px-1 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
      padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
    }
/* The rest */
.p-2 {
      padding: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
    }
.pt-2 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
    }
.pr-2 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
    }
.pb-2 {
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
    }
.pl-2 {
      padding-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
    }
.py-2 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
    }
.px-2 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
      padding-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
    }
.p-3 {
      padding: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
    }
.pt-3 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
    }
.pr-3 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
    }
.pb-3 {
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
    }
.pl-3 {
      padding-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
    }
.py-3 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
    }
.px-3 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
      padding-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
    }
.p-4 {
      padding: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
    }
.pt-4 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
    }
.pr-4 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
    }
.pb-4 {
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
    }
.pl-4 {
      padding-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
    }
.py-4 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
    }
.px-4 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
      padding-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
    }
.p-5 {
      padding: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
    }
.pt-5 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
    }
.pr-5 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
    }
.pb-5 {
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
    }
.pl-5 {
      padding-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
    }
.py-5 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
    }
.px-5 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
      padding-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
    }
.p-6 {
      padding: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
    }
.pt-6 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
    }
.pr-6 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
    }
.pb-6 {
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
    }
.pl-6 {
      padding-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
    }
.py-6 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
    }
.px-6 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
      padding-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
    }
.p-7 {
      padding: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
    }
.pt-7 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
    }
.pr-7 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
    }
.pb-7 {
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
    }
.pl-7 {
      padding-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
    }
.py-7 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
    }
.px-7 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
      padding-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
    }
.p-8 {
      padding: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
    }
.pt-8 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
    }
.pr-8 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
    }
.pb-8 {
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
    }
.pl-8 {
      padding-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
    }
.py-8 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
    }
.px-8 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
      padding-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
    }
.p-9 {
      padding: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
    }
.pt-9 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
    }
.pr-9 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
    }
.pb-9 {
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
    }
.pl-9 {
      padding-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
    }
.py-9 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
    }
.px-9 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
      padding-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
    }
.p-10 {
      padding: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
    }
.pt-10 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
    }
.pr-10 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
    }
.pb-10 {
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
    }
.pl-10 {
      padding-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
    }
.py-10 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
    }
.px-10 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
      padding-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
    }
.p-11 {
      padding: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
    }
.pt-11 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
    }
.pr-11 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
    }
.pb-11 {
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
    }
.pl-11 {
      padding-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
    }
.py-11 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
    }
.px-11 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
      padding-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
    }
.p-12 {
      padding: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
    }
.pt-12 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
    }
.pr-12 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
    }
.pb-12 {
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
    }
.pl-12 {
      padding-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
    }
.py-12 {
      padding-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
      padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
    }
.px-12 {
      padding-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
      padding-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
    }

/* Auto values */

.m-auto {
    margin: auto;
  }

.mt-auto {
    margin-top: auto;
  }

.mr-auto {
    margin-right: auto;
  }

.mb-auto {
    margin-bottom: auto;
  }

.ml-auto {
    margin-left: auto;
  }

.my-auto {
    margin-top: auto;
    margin-bottom: auto;
  }

.mx-auto {
    margin-right: auto;
    margin-left: auto;
  }

/* Repsonsive */
@media (--viewport-ms-min) {
    /* Zero and half values */
        .m-ms-0 {
          margin: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .mt-ms-0 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .mr-ms-0 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .mb-ms-0 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .ml-ms-0 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .my-ms-0 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .mx-ms-0 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
          margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }
        .p-ms-0 {
          padding: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .pt-ms-0 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .pr-ms-0 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .pb-ms-0 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .pl-ms-0 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .py-ms-0 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .px-ms-0 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
          padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }
        .m-ms-1 {
          margin: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .mt-ms-1 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .mr-ms-1 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .mb-ms-1 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .ml-ms-1 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .my-ms-1 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .mx-ms-1 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
          margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }
        .p-ms-1 {
          padding: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .pt-ms-1 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .pr-ms-1 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .pb-ms-1 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .pl-ms-1 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .py-ms-1 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .px-ms-1 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
          padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

    /* The rest */
        .m-ms-2 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .mt-ms-2 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .mr-ms-2 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .mb-ms-2 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .ml-ms-2 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .my-ms-2 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .mx-ms-2 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }
        .p-ms-2 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .pt-ms-2 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .pr-ms-2 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .pb-ms-2 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .pl-ms-2 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .py-ms-2 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .px-ms-2 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }
        .m-ms-3 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .mt-ms-3 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .mr-ms-3 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .mb-ms-3 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .ml-ms-3 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .my-ms-3 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .mx-ms-3 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }
        .p-ms-3 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .pt-ms-3 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .pr-ms-3 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .pb-ms-3 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .pl-ms-3 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .py-ms-3 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .px-ms-3 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }
        .m-ms-4 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .mt-ms-4 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .mr-ms-4 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .mb-ms-4 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .ml-ms-4 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .my-ms-4 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .mx-ms-4 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }
        .p-ms-4 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .pt-ms-4 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .pr-ms-4 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .pb-ms-4 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .pl-ms-4 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .py-ms-4 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .px-ms-4 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }
        .m-ms-5 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .mt-ms-5 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .mr-ms-5 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .mb-ms-5 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .ml-ms-5 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .my-ms-5 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .mx-ms-5 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }
        .p-ms-5 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .pt-ms-5 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .pr-ms-5 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .pb-ms-5 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .pl-ms-5 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .py-ms-5 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .px-ms-5 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }
        .m-ms-6 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .mt-ms-6 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .mr-ms-6 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .mb-ms-6 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .ml-ms-6 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .my-ms-6 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .mx-ms-6 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }
        .p-ms-6 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .pt-ms-6 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .pr-ms-6 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .pb-ms-6 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .pl-ms-6 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .py-ms-6 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .px-ms-6 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }
        .m-ms-7 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .mt-ms-7 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .mr-ms-7 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .mb-ms-7 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .ml-ms-7 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .my-ms-7 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .mx-ms-7 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }
        .p-ms-7 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .pt-ms-7 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .pr-ms-7 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .pb-ms-7 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .pl-ms-7 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .py-ms-7 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .px-ms-7 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }
        .m-ms-8 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .mt-ms-8 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .mr-ms-8 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .mb-ms-8 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .ml-ms-8 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .my-ms-8 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .mx-ms-8 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }
        .p-ms-8 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .pt-ms-8 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .pr-ms-8 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .pb-ms-8 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .pl-ms-8 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .py-ms-8 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .px-ms-8 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }
        .m-ms-9 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .mt-ms-9 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .mr-ms-9 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .mb-ms-9 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .ml-ms-9 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .my-ms-9 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .mx-ms-9 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }
        .p-ms-9 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .pt-ms-9 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .pr-ms-9 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .pb-ms-9 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .pl-ms-9 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .py-ms-9 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .px-ms-9 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }
        .m-ms-10 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .mt-ms-10 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .mr-ms-10 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .mb-ms-10 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .ml-ms-10 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .my-ms-10 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .mx-ms-10 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }
        .p-ms-10 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .pt-ms-10 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .pr-ms-10 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .pb-ms-10 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .pl-ms-10 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .py-ms-10 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .px-ms-10 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }
        .m-ms-11 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .mt-ms-11 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .mr-ms-11 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .mb-ms-11 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .ml-ms-11 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .my-ms-11 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .mx-ms-11 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }
        .p-ms-11 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .pt-ms-11 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .pr-ms-11 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .pb-ms-11 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .pl-ms-11 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .py-ms-11 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .px-ms-11 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }
        .m-ms-12 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .mt-ms-12 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .mr-ms-12 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .mb-ms-12 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .ml-ms-12 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .my-ms-12 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .mx-ms-12 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }
        .p-ms-12 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .pt-ms-12 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .pr-ms-12 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .pb-ms-12 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .pl-ms-12 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .py-ms-12 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .px-ms-12 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

    /* Auto values */
      .mt-ms-auto {
        margin-top: auto;
      }

      .mr-ms-auto {
        margin-right: auto;
      }

      .mb-ms-auto {
        margin-bottom: auto;
      }

      .ml-ms-auto {
        margin-left: auto;
      }

      .my-ms-auto {
        margin-top: auto;
        margin-bottom: auto;
      }

      .mx-ms-auto {
        margin-right: auto;
        margin-left: auto;
      }
  }
@media (--viewport-sm-min) {
    /* Zero and half values */
        .m-sm-0 {
          margin: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .mt-sm-0 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .mr-sm-0 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .mb-sm-0 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .ml-sm-0 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .my-sm-0 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .mx-sm-0 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
          margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }
        .p-sm-0 {
          padding: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .pt-sm-0 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .pr-sm-0 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .pb-sm-0 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .pl-sm-0 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .py-sm-0 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .px-sm-0 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
          padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }
        .m-sm-1 {
          margin: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .mt-sm-1 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .mr-sm-1 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .mb-sm-1 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .ml-sm-1 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .my-sm-1 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .mx-sm-1 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
          margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }
        .p-sm-1 {
          padding: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .pt-sm-1 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .pr-sm-1 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .pb-sm-1 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .pl-sm-1 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .py-sm-1 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .px-sm-1 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
          padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

    /* The rest */
        .m-sm-2 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .mt-sm-2 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .mr-sm-2 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .mb-sm-2 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .ml-sm-2 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .my-sm-2 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .mx-sm-2 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }
        .p-sm-2 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .pt-sm-2 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .pr-sm-2 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .pb-sm-2 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .pl-sm-2 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .py-sm-2 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .px-sm-2 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }
        .m-sm-3 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .mt-sm-3 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .mr-sm-3 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .mb-sm-3 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .ml-sm-3 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .my-sm-3 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .mx-sm-3 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }
        .p-sm-3 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .pt-sm-3 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .pr-sm-3 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .pb-sm-3 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .pl-sm-3 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .py-sm-3 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .px-sm-3 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }
        .m-sm-4 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .mt-sm-4 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .mr-sm-4 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .mb-sm-4 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .ml-sm-4 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .my-sm-4 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .mx-sm-4 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }
        .p-sm-4 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .pt-sm-4 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .pr-sm-4 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .pb-sm-4 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .pl-sm-4 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .py-sm-4 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .px-sm-4 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }
        .m-sm-5 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .mt-sm-5 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .mr-sm-5 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .mb-sm-5 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .ml-sm-5 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .my-sm-5 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .mx-sm-5 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }
        .p-sm-5 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .pt-sm-5 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .pr-sm-5 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .pb-sm-5 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .pl-sm-5 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .py-sm-5 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .px-sm-5 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }
        .m-sm-6 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .mt-sm-6 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .mr-sm-6 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .mb-sm-6 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .ml-sm-6 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .my-sm-6 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .mx-sm-6 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }
        .p-sm-6 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .pt-sm-6 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .pr-sm-6 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .pb-sm-6 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .pl-sm-6 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .py-sm-6 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .px-sm-6 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }
        .m-sm-7 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .mt-sm-7 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .mr-sm-7 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .mb-sm-7 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .ml-sm-7 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .my-sm-7 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .mx-sm-7 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }
        .p-sm-7 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .pt-sm-7 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .pr-sm-7 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .pb-sm-7 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .pl-sm-7 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .py-sm-7 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .px-sm-7 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }
        .m-sm-8 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .mt-sm-8 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .mr-sm-8 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .mb-sm-8 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .ml-sm-8 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .my-sm-8 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .mx-sm-8 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }
        .p-sm-8 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .pt-sm-8 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .pr-sm-8 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .pb-sm-8 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .pl-sm-8 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .py-sm-8 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .px-sm-8 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }
        .m-sm-9 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .mt-sm-9 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .mr-sm-9 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .mb-sm-9 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .ml-sm-9 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .my-sm-9 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .mx-sm-9 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }
        .p-sm-9 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .pt-sm-9 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .pr-sm-9 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .pb-sm-9 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .pl-sm-9 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .py-sm-9 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .px-sm-9 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }
        .m-sm-10 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .mt-sm-10 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .mr-sm-10 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .mb-sm-10 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .ml-sm-10 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .my-sm-10 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .mx-sm-10 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }
        .p-sm-10 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .pt-sm-10 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .pr-sm-10 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .pb-sm-10 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .pl-sm-10 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .py-sm-10 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .px-sm-10 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }
        .m-sm-11 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .mt-sm-11 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .mr-sm-11 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .mb-sm-11 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .ml-sm-11 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .my-sm-11 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .mx-sm-11 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }
        .p-sm-11 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .pt-sm-11 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .pr-sm-11 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .pb-sm-11 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .pl-sm-11 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .py-sm-11 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .px-sm-11 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }
        .m-sm-12 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .mt-sm-12 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .mr-sm-12 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .mb-sm-12 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .ml-sm-12 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .my-sm-12 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .mx-sm-12 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }
        .p-sm-12 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .pt-sm-12 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .pr-sm-12 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .pb-sm-12 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .pl-sm-12 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .py-sm-12 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .px-sm-12 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

    /* Auto values */
      .mt-sm-auto {
        margin-top: auto;
      }

      .mr-sm-auto {
        margin-right: auto;
      }

      .mb-sm-auto {
        margin-bottom: auto;
      }

      .ml-sm-auto {
        margin-left: auto;
      }

      .my-sm-auto {
        margin-top: auto;
        margin-bottom: auto;
      }

      .mx-sm-auto {
        margin-right: auto;
        margin-left: auto;
      }
  }
@media (--viewport-md-min) {
    /* Zero and half values */
        .m-md-0 {
          margin: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .mt-md-0 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .mr-md-0 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .mb-md-0 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .ml-md-0 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .my-md-0 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .mx-md-0 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
          margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }
        .p-md-0 {
          padding: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .pt-md-0 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .pr-md-0 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .pb-md-0 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .pl-md-0 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .py-md-0 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .px-md-0 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
          padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }
        .m-md-1 {
          margin: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .mt-md-1 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .mr-md-1 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .mb-md-1 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .ml-md-1 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .my-md-1 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .mx-md-1 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
          margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }
        .p-md-1 {
          padding: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .pt-md-1 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .pr-md-1 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .pb-md-1 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .pl-md-1 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .py-md-1 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .px-md-1 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
          padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

    /* The rest */
        .m-md-2 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .mt-md-2 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .mr-md-2 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .mb-md-2 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .ml-md-2 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .my-md-2 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .mx-md-2 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }
        .p-md-2 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .pt-md-2 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .pr-md-2 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .pb-md-2 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .pl-md-2 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .py-md-2 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .px-md-2 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }
        .m-md-3 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .mt-md-3 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .mr-md-3 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .mb-md-3 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .ml-md-3 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .my-md-3 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .mx-md-3 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }
        .p-md-3 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .pt-md-3 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .pr-md-3 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .pb-md-3 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .pl-md-3 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .py-md-3 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .px-md-3 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }
        .m-md-4 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .mt-md-4 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .mr-md-4 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .mb-md-4 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .ml-md-4 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .my-md-4 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .mx-md-4 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }
        .p-md-4 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .pt-md-4 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .pr-md-4 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .pb-md-4 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .pl-md-4 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .py-md-4 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .px-md-4 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }
        .m-md-5 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .mt-md-5 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .mr-md-5 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .mb-md-5 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .ml-md-5 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .my-md-5 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .mx-md-5 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }
        .p-md-5 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .pt-md-5 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .pr-md-5 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .pb-md-5 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .pl-md-5 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .py-md-5 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .px-md-5 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }
        .m-md-6 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .mt-md-6 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .mr-md-6 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .mb-md-6 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .ml-md-6 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .my-md-6 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .mx-md-6 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }
        .p-md-6 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .pt-md-6 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .pr-md-6 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .pb-md-6 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .pl-md-6 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .py-md-6 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .px-md-6 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }
        .m-md-7 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .mt-md-7 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .mr-md-7 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .mb-md-7 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .ml-md-7 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .my-md-7 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .mx-md-7 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }
        .p-md-7 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .pt-md-7 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .pr-md-7 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .pb-md-7 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .pl-md-7 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .py-md-7 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .px-md-7 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }
        .m-md-8 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .mt-md-8 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .mr-md-8 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .mb-md-8 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .ml-md-8 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .my-md-8 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .mx-md-8 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }
        .p-md-8 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .pt-md-8 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .pr-md-8 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .pb-md-8 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .pl-md-8 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .py-md-8 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .px-md-8 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }
        .m-md-9 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .mt-md-9 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .mr-md-9 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .mb-md-9 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .ml-md-9 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .my-md-9 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .mx-md-9 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }
        .p-md-9 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .pt-md-9 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .pr-md-9 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .pb-md-9 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .pl-md-9 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .py-md-9 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .px-md-9 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }
        .m-md-10 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .mt-md-10 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .mr-md-10 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .mb-md-10 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .ml-md-10 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .my-md-10 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .mx-md-10 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }
        .p-md-10 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .pt-md-10 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .pr-md-10 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .pb-md-10 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .pl-md-10 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .py-md-10 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .px-md-10 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }
        .m-md-11 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .mt-md-11 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .mr-md-11 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .mb-md-11 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .ml-md-11 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .my-md-11 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .mx-md-11 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }
        .p-md-11 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .pt-md-11 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .pr-md-11 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .pb-md-11 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .pl-md-11 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .py-md-11 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .px-md-11 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }
        .m-md-12 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .mt-md-12 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .mr-md-12 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .mb-md-12 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .ml-md-12 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .my-md-12 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .mx-md-12 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }
        .p-md-12 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .pt-md-12 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .pr-md-12 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .pb-md-12 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .pl-md-12 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .py-md-12 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .px-md-12 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

    /* Auto values */
      .mt-md-auto {
        margin-top: auto;
      }

      .mr-md-auto {
        margin-right: auto;
      }

      .mb-md-auto {
        margin-bottom: auto;
      }

      .ml-md-auto {
        margin-left: auto;
      }

      .my-md-auto {
        margin-top: auto;
        margin-bottom: auto;
      }

      .mx-md-auto {
        margin-right: auto;
        margin-left: auto;
      }
  }
@media (--viewport-lg-min) {
    /* Zero and half values */
        .m-lg-0 {
          margin: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .mt-lg-0 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .mr-lg-0 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .mb-lg-0 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .ml-lg-0 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .my-lg-0 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .mx-lg-0 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
          margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }
        .p-lg-0 {
          padding: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .pt-lg-0 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .pr-lg-0 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .pb-lg-0 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .pl-lg-0 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .py-lg-0 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .px-lg-0 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
          padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }
        .m-lg-1 {
          margin: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .mt-lg-1 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .mr-lg-1 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .mb-lg-1 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .ml-lg-1 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .my-lg-1 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .mx-lg-1 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
          margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }
        .p-lg-1 {
          padding: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .pt-lg-1 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .pr-lg-1 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .pb-lg-1 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .pl-lg-1 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .py-lg-1 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .px-lg-1 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
          padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

    /* The rest */
        .m-lg-2 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .mt-lg-2 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .mr-lg-2 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .mb-lg-2 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .ml-lg-2 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .my-lg-2 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .mx-lg-2 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }
        .p-lg-2 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .pt-lg-2 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .pr-lg-2 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .pb-lg-2 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .pl-lg-2 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .py-lg-2 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .px-lg-2 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }
        .m-lg-3 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .mt-lg-3 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .mr-lg-3 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .mb-lg-3 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .ml-lg-3 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .my-lg-3 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .mx-lg-3 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }
        .p-lg-3 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .pt-lg-3 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .pr-lg-3 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .pb-lg-3 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .pl-lg-3 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .py-lg-3 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .px-lg-3 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }
        .m-lg-4 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .mt-lg-4 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .mr-lg-4 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .mb-lg-4 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .ml-lg-4 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .my-lg-4 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .mx-lg-4 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }
        .p-lg-4 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .pt-lg-4 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .pr-lg-4 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .pb-lg-4 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .pl-lg-4 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .py-lg-4 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .px-lg-4 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }
        .m-lg-5 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .mt-lg-5 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .mr-lg-5 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .mb-lg-5 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .ml-lg-5 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .my-lg-5 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .mx-lg-5 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }
        .p-lg-5 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .pt-lg-5 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .pr-lg-5 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .pb-lg-5 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .pl-lg-5 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .py-lg-5 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .px-lg-5 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }
        .m-lg-6 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .mt-lg-6 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .mr-lg-6 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .mb-lg-6 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .ml-lg-6 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .my-lg-6 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .mx-lg-6 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }
        .p-lg-6 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .pt-lg-6 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .pr-lg-6 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .pb-lg-6 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .pl-lg-6 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .py-lg-6 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .px-lg-6 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }
        .m-lg-7 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .mt-lg-7 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .mr-lg-7 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .mb-lg-7 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .ml-lg-7 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .my-lg-7 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .mx-lg-7 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }
        .p-lg-7 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .pt-lg-7 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .pr-lg-7 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .pb-lg-7 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .pl-lg-7 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .py-lg-7 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .px-lg-7 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }
        .m-lg-8 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .mt-lg-8 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .mr-lg-8 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .mb-lg-8 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .ml-lg-8 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .my-lg-8 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .mx-lg-8 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }
        .p-lg-8 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .pt-lg-8 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .pr-lg-8 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .pb-lg-8 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .pl-lg-8 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .py-lg-8 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .px-lg-8 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }
        .m-lg-9 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .mt-lg-9 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .mr-lg-9 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .mb-lg-9 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .ml-lg-9 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .my-lg-9 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .mx-lg-9 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }
        .p-lg-9 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .pt-lg-9 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .pr-lg-9 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .pb-lg-9 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .pl-lg-9 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .py-lg-9 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .px-lg-9 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }
        .m-lg-10 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .mt-lg-10 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .mr-lg-10 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .mb-lg-10 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .ml-lg-10 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .my-lg-10 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .mx-lg-10 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }
        .p-lg-10 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .pt-lg-10 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .pr-lg-10 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .pb-lg-10 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .pl-lg-10 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .py-lg-10 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .px-lg-10 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }
        .m-lg-11 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .mt-lg-11 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .mr-lg-11 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .mb-lg-11 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .ml-lg-11 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .my-lg-11 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .mx-lg-11 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }
        .p-lg-11 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .pt-lg-11 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .pr-lg-11 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .pb-lg-11 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .pl-lg-11 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .py-lg-11 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .px-lg-11 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }
        .m-lg-12 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .mt-lg-12 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .mr-lg-12 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .mb-lg-12 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .ml-lg-12 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .my-lg-12 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .mx-lg-12 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }
        .p-lg-12 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .pt-lg-12 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .pr-lg-12 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .pb-lg-12 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .pl-lg-12 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .py-lg-12 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .px-lg-12 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

    /* Auto values */
      .mt-lg-auto {
        margin-top: auto;
      }

      .mr-lg-auto {
        margin-right: auto;
      }

      .mb-lg-auto {
        margin-bottom: auto;
      }

      .ml-lg-auto {
        margin-left: auto;
      }

      .my-lg-auto {
        margin-top: auto;
        margin-bottom: auto;
      }

      .mx-lg-auto {
        margin-right: auto;
        margin-left: auto;
      }
  }
@media (--viewport-xl-min) {
    /* Zero and half values */
        .m-xl-0 {
          margin: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .mt-xl-0 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .mr-xl-0 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .mb-xl-0 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .ml-xl-0 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .my-xl-0 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .mx-xl-0 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
          margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }
        .p-xl-0 {
          padding: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .pt-xl-0 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .pr-xl-0 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .pb-xl-0 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .pl-xl-0 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .py-xl-0 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }

        .px-xl-0 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
          padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 0);
        }
        .m-xl-1 {
          margin: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .mt-xl-1 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .mr-xl-1 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .mb-xl-1 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .ml-xl-1 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .my-xl-1 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .mx-xl-1 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
          margin-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }
        .p-xl-1 {
          padding: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .pt-xl-1 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .pr-xl-1 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .pb-xl-1 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .pl-xl-1 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .py-xl-1 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

        .px-xl-1 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
          padding-left: calc(var(--css-utils-spacing-base, 10px) / 2 * 1);
        }

    /* The rest */
        .m-xl-2 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .mt-xl-2 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .mr-xl-2 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .mb-xl-2 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .ml-xl-2 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .my-xl-2 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .mx-xl-2 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }
        .p-xl-2 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .pt-xl-2 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .pr-xl-2 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .pb-xl-2 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .pl-xl-2 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .py-xl-2 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }

        .px-xl-2 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 2 - var(--css-utils-spacing-base, 10px));
        }
        .m-xl-3 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .mt-xl-3 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .mr-xl-3 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .mb-xl-3 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .ml-xl-3 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .my-xl-3 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .mx-xl-3 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }
        .p-xl-3 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .pt-xl-3 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .pr-xl-3 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .pb-xl-3 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .pl-xl-3 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .py-xl-3 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }

        .px-xl-3 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 3 - var(--css-utils-spacing-base, 10px));
        }
        .m-xl-4 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .mt-xl-4 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .mr-xl-4 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .mb-xl-4 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .ml-xl-4 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .my-xl-4 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .mx-xl-4 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }
        .p-xl-4 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .pt-xl-4 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .pr-xl-4 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .pb-xl-4 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .pl-xl-4 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .py-xl-4 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }

        .px-xl-4 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 4 - var(--css-utils-spacing-base, 10px));
        }
        .m-xl-5 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .mt-xl-5 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .mr-xl-5 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .mb-xl-5 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .ml-xl-5 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .my-xl-5 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .mx-xl-5 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }
        .p-xl-5 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .pt-xl-5 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .pr-xl-5 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .pb-xl-5 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .pl-xl-5 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .py-xl-5 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }

        .px-xl-5 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 5 - var(--css-utils-spacing-base, 10px));
        }
        .m-xl-6 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .mt-xl-6 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .mr-xl-6 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .mb-xl-6 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .ml-xl-6 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .my-xl-6 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .mx-xl-6 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }
        .p-xl-6 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .pt-xl-6 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .pr-xl-6 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .pb-xl-6 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .pl-xl-6 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .py-xl-6 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }

        .px-xl-6 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 6 - var(--css-utils-spacing-base, 10px));
        }
        .m-xl-7 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .mt-xl-7 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .mr-xl-7 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .mb-xl-7 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .ml-xl-7 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .my-xl-7 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .mx-xl-7 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }
        .p-xl-7 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .pt-xl-7 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .pr-xl-7 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .pb-xl-7 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .pl-xl-7 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .py-xl-7 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }

        .px-xl-7 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 7 - var(--css-utils-spacing-base, 10px));
        }
        .m-xl-8 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .mt-xl-8 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .mr-xl-8 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .mb-xl-8 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .ml-xl-8 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .my-xl-8 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .mx-xl-8 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }
        .p-xl-8 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .pt-xl-8 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .pr-xl-8 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .pb-xl-8 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .pl-xl-8 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .py-xl-8 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }

        .px-xl-8 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 8 - var(--css-utils-spacing-base, 10px));
        }
        .m-xl-9 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .mt-xl-9 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .mr-xl-9 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .mb-xl-9 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .ml-xl-9 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .my-xl-9 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .mx-xl-9 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }
        .p-xl-9 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .pt-xl-9 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .pr-xl-9 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .pb-xl-9 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .pl-xl-9 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .py-xl-9 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }

        .px-xl-9 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 9 - var(--css-utils-spacing-base, 10px));
        }
        .m-xl-10 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .mt-xl-10 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .mr-xl-10 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .mb-xl-10 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .ml-xl-10 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .my-xl-10 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .mx-xl-10 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }
        .p-xl-10 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .pt-xl-10 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .pr-xl-10 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .pb-xl-10 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .pl-xl-10 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .py-xl-10 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }

        .px-xl-10 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 10 - var(--css-utils-spacing-base, 10px));
        }
        .m-xl-11 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .mt-xl-11 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .mr-xl-11 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .mb-xl-11 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .ml-xl-11 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .my-xl-11 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .mx-xl-11 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }
        .p-xl-11 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .pt-xl-11 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .pr-xl-11 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .pb-xl-11 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .pl-xl-11 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .py-xl-11 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }

        .px-xl-11 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 11 - var(--css-utils-spacing-base, 10px));
        }
        .m-xl-12 {
          margin: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .mt-xl-12 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .mr-xl-12 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .mb-xl-12 {
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .ml-xl-12 {
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .my-xl-12 {
          margin-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
          margin-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .mx-xl-12 {
          margin-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
          margin-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }
        .p-xl-12 {
          padding: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .pt-xl-12 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .pr-xl-12 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .pb-xl-12 {
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .pl-xl-12 {
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .py-xl-12 {
          padding-top: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
          padding-bottom: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

        .px-xl-12 {
          padding-right: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
          padding-left: calc(var(--css-utils-spacing-base, 10px) * 12 - var(--css-utils-spacing-base, 10px));
        }

    /* Auto values */
      .mt-xl-auto {
        margin-top: auto;
      }

      .mr-xl-auto {
        margin-right: auto;
      }

      .mb-xl-auto {
        margin-bottom: auto;
      }

      .ml-xl-auto {
        margin-left: auto;
      }

      .my-xl-auto {
        margin-top: auto;
        margin-bottom: auto;
      }

      .mx-xl-auto {
        margin-right: auto;
        margin-left: auto;
      }
  }