:root {
    /* Width and Gutters */
    /* --vs-e-gutter-x: 20px; */
    --vs-gutter-x: 30px; /* Virtus Default 1.5rem */
    --vs-padding-x: 40px;
    --vs-gutter-y: 0;
    --max-vw: 100%;
    /* Margin and padding values */
    --margin-0: 0rem;
    --margin-1: .25rem; /* 10px */
    --margin-2: .5rem; /* 15px */
    --margin-3: 1.25rem; /* 20px */
    --margin-4: 1.875rem; /* 30px */
    --margin-5: 2.5rem; /* 40px */
    --margin-6: 6rem; /* 96px */
    --margin-7: 9rem; /* 144px */
    --margin-8: 12rem; /* 192px */
    --margin-9: 15rem; /* 240px */
    --margin-10: 20rem; /* 320px */
    --margin-n1: -0.625rem;
    --margin-n2: -0.9375;
    --margin-n3: -1.25rem;
    --margin-n4: -1.875rem;
    --margin-n5: -2.5rem;
    --margin-n6: -6rem;
    --margin-n7: -9rem;
    --margin-n8: -12rem;
    --margin-n9: -15rem;
    --margin-n10: -20rem;

    /* Flexbox alignments */
    --justify-center: center;
    --justify-between: space-between;
    --justify-around: space-around;
    --justify-evenly: space-evenly;
    --justify-start: flex-start;
    --justify-end: flex-end;
    --align-start: flex-start;
    --align-center: center;
    --align-end: flex-end;

    /* Cols and Offset percentages */
    --col-1: 8.33333333%;
    --col-2: 16.66666667%;
    --col-3: 25%;
    --col-4: 33.33333333%;
    --col-5: 41.66666667%;
    --col-6: 50%;
    --col-7: 58.33333333%;
    --col-8: 66.66666667%;
    --col-9: 75%;
    --col-10: 83.33333333%;
    --col-11: 91.66666667%;
    --col-n1: -8.33333333%;
    --col-n2: -16.66666667%;
    --col-n3: -25%;
    --col-n4: -33.33333333%;
    --col-n5: -41.66666667%;
    --col-n6: -50%;
    --col-n7: -58.33333333%;
    --col-n8: -66.66666667%;
    --col-n9: -75%;
    --col-n10: -83.33333333%;
    --col-n11: -91.66666667%;

    /* Spacing variables */
    --sp-xxs: calc(1.875rem + ((1vw - 0.225rem) * 2.6042)); /* 30px > 40px */
    --sp-xs: calc(1.875rem + ((1vw - 0.225rem) * 2.6042)); /* 30px > 40px */
    --sp-s: calc(2.5rem + ((1vw - 0.225rem) * 5.2083)); /* 40px > 60px */
    --sp-m: calc(2.5rem + ((1vw - 0.225rem) * 7.8125)); /* 40px > 70px */
    --sp-l: calc(3.125rem + ((1vw - 0.225rem) * 5.2083)); /* 50px > 70px */
    --sp-xl: calc(4.375rem + ((1vw - 0.225rem) * 7.8125)); /* 70px > 100px */
    --sp-xxl: calc(4.375rem + ((1vw - 0.225rem) * 7.8125)); /* 70px > 100px */
    --sp-xxxl: calc(7.5rem + ((1vw - 0.24375rem) * 9.2199)); /* 120px > 250px */
}
@media (min-width: 576px) {
    :root {
        /* --vs-e-gutter-x: 64px; */
        --vs-gutter-x: 64px;
        --vs-padding-x: 64px;
        --vs-gutter-y: 0
    }
}
@media (min-width: 744px) {
    :root {
        --vs-e-gutter-x: 0;
        --vs-gutter-x: 30px;
        --vs-padding-x: 80px;
        --vs-gutter-y: 0;
        --sp-xxs: 2.5rem; /* 40px */
        --sp-xs: calc(2.5rem + ((1vw - 0.465rem) * 0.947)); /* 40px > 50px */
        --sp-s: 3.75rem; /* 60px */
        --sp-m: 4.375rem; /* 70px */
        --sp-l: calc(4.375rem + ((1vw - 0.465rem) * 2.8409)); /* 70px > 100px */
        --sp-xl: calc(6.25rem + ((1vw - 0.465rem) * 4.7348)); /* 100px > 150px */
        --sp-xxl: calc(6.25rem + ((1vw - 0.465rem) * 9.4697)); /* 100px > 200px */
    }
}
@media (min-width: 1200px) {
    :root {
        --max-vw: 1800px;
        --vs-e-gutter-x: 20px;
        --vs-padding-x: 100px;
        --vs-gutter-x: 30px;
        --vs-gutter-y: 0;
    }
}
@media (min-width: 1800px) {
    :root {
        --max-vw: 1800px;
        --vs-e-gutter-x: 10px;
        --vs-padding-x: 100px;
        --vs-gutter-x: 30px;
        --vs-gutter-y: 0;
        --sp-xxs: 2.5rem; /* 40px */
        --sp-xs: 3.125rem; /* 50px */
        --sp-s: 3.75rem; /* 60px */
        --sp-m: 4.375rem; /* 70px */
        --sp-l: 6.25rem; /* 100px */
        --sp-xl: 9.375rem; /* 150px */
        --sp-xxl: 12.5rem; /* 200px */
        --sp-xxxl: 15.625rem; /* 250px */
    }
}