@alfalab/core-components 45.6.0-beta.2 → 45.6.1

package/grid/cssm/col/index.css

@@ -1,2003 +0,0 @@
-/* hash: 5hsv8 */
-:root {
-    --grid-col-width: calc(100% / 12);
-}
-
-.component {
-    max-width: 100%;
-    min-height: 1px;
-    flex-basis: 0;
-    flex-grow: 1;
-    box-sizing: border-box;
-}
-
-.width-auto {
-    flex: 0 0 auto;
-    width: auto;
-    max-width: none;
-}
-
-.width-available {
-    flex-basis: auto;
-    min-height: auto;
-    height: auto;
-}
-
-.width-1 {
-        flex: 0 0 calc(var(--grid-col-width) * 1);
-        max-width: calc(var(--grid-col-width) * 1);
-    }
-
-.width-2 {
-        flex: 0 0 calc(var(--grid-col-width) * 2);
-        max-width: calc(var(--grid-col-width) * 2);
-    }
-
-.width-3 {
-        flex: 0 0 calc(var(--grid-col-width) * 3);
-        max-width: calc(var(--grid-col-width) * 3);
-    }
-
-.width-4 {
-        flex: 0 0 calc(var(--grid-col-width) * 4);
-        max-width: calc(var(--grid-col-width) * 4);
-    }
-
-.width-5 {
-        flex: 0 0 calc(var(--grid-col-width) * 5);
-        max-width: calc(var(--grid-col-width) * 5);
-    }
-
-.width-6 {
-        flex: 0 0 calc(var(--grid-col-width) * 6);
-        max-width: calc(var(--grid-col-width) * 6);
-    }
-
-.width-7 {
-        flex: 0 0 calc(var(--grid-col-width) * 7);
-        max-width: calc(var(--grid-col-width) * 7);
-    }
-
-.width-8 {
-        flex: 0 0 calc(var(--grid-col-width) * 8);
-        max-width: calc(var(--grid-col-width) * 8);
-    }
-
-.width-9 {
-        flex: 0 0 calc(var(--grid-col-width) * 9);
-        max-width: calc(var(--grid-col-width) * 9);
-    }
-
-.width-10 {
-        flex: 0 0 calc(var(--grid-col-width) * 10);
-        max-width: calc(var(--grid-col-width) * 10);
-    }
-
-.width-11 {
-        flex: 0 0 calc(var(--grid-col-width) * 11);
-        max-width: calc(var(--grid-col-width) * 11);
-    }
-
-.width-12 {
-        flex: 0 0 calc(var(--grid-col-width) * 12);
-        max-width: calc(var(--grid-col-width) * 12);
-    }
-
-.align-top {
-    align-self: flex-start;
-}
-
-.align-middle {
-    align-self: center;
-}
-
-.align-bottom {
-    align-self: flex-end;
-}
-
-.offset-1 {
-        margin-left: calc(var(--grid-col-width) * 1);
-    }
-
-.offset-2 {
-        margin-left: calc(var(--grid-col-width) * 2);
-    }
-
-.offset-3 {
-        margin-left: calc(var(--grid-col-width) * 3);
-    }
-
-.offset-4 {
-        margin-left: calc(var(--grid-col-width) * 4);
-    }
-
-.offset-5 {
-        margin-left: calc(var(--grid-col-width) * 5);
-    }
-
-.offset-6 {
-        margin-left: calc(var(--grid-col-width) * 6);
-    }
-
-.offset-7 {
-        margin-left: calc(var(--grid-col-width) * 7);
-    }
-
-.offset-8 {
-        margin-left: calc(var(--grid-col-width) * 8);
-    }
-
-.offset-9 {
-        margin-left: calc(var(--grid-col-width) * 9);
-    }
-
-.offset-10 {
-        margin-left: calc(var(--grid-col-width) * 10);
-    }
-
-.offset-11 {
-        margin-left: calc(var(--grid-col-width) * 11);
-    }
-
-.order-first {
-    order: -1;
-}
-
-.order-last {
-    order: 13;
-}
-
-.order-1 {
-        order: 1;
-    }
-
-.order-2 {
-        order: 2;
-    }
-
-.order-3 {
-        order: 3;
-    }
-
-.order-4 {
-        order: 4;
-    }
-
-.order-5 {
-        order: 5;
-    }
-
-.order-6 {
-        order: 6;
-    }
-
-.order-7 {
-        order: 7;
-    }
-
-.order-8 {
-        order: 8;
-    }
-
-.order-9 {
-        order: 9;
-    }
-
-.order-10 {
-        order: 10;
-    }
-
-.order-11 {
-        order: 11;
-    }
-
-.order-12 {
-        order: 12;
-    }
-
-@media (max-width: 599px) {
-        .width-mobile-auto {
-            flex: 0 0 auto;
-            width: auto;
-            max-width: none;
-        }
-
-        .width-mobile-available {
-            flex-basis: auto;
-            min-height: auto;
-            height: auto;
-        }
-            .width-mobile-1 {
-                flex: 0 0 calc(var(--grid-col-width) * 1);
-                max-width: calc(var(--grid-col-width) * 1);
-            }
-            .width-mobile-2 {
-                flex: 0 0 calc(var(--grid-col-width) * 2);
-                max-width: calc(var(--grid-col-width) * 2);
-            }
-            .width-mobile-3 {
-                flex: 0 0 calc(var(--grid-col-width) * 3);
-                max-width: calc(var(--grid-col-width) * 3);
-            }
-            .width-mobile-4 {
-                flex: 0 0 calc(var(--grid-col-width) * 4);
-                max-width: calc(var(--grid-col-width) * 4);
-            }
-            .width-mobile-5 {
-                flex: 0 0 calc(var(--grid-col-width) * 5);
-                max-width: calc(var(--grid-col-width) * 5);
-            }
-            .width-mobile-6 {
-                flex: 0 0 calc(var(--grid-col-width) * 6);
-                max-width: calc(var(--grid-col-width) * 6);
-            }
-            .width-mobile-7 {
-                flex: 0 0 calc(var(--grid-col-width) * 7);
-                max-width: calc(var(--grid-col-width) * 7);
-            }
-            .width-mobile-8 {
-                flex: 0 0 calc(var(--grid-col-width) * 8);
-                max-width: calc(var(--grid-col-width) * 8);
-            }
-            .width-mobile-9 {
-                flex: 0 0 calc(var(--grid-col-width) * 9);
-                max-width: calc(var(--grid-col-width) * 9);
-            }
-            .width-mobile-10 {
-                flex: 0 0 calc(var(--grid-col-width) * 10);
-                max-width: calc(var(--grid-col-width) * 10);
-            }
-            .width-mobile-11 {
-                flex: 0 0 calc(var(--grid-col-width) * 11);
-                max-width: calc(var(--grid-col-width) * 11);
-            }
-            .width-mobile-12 {
-                flex: 0 0 calc(var(--grid-col-width) * 12);
-                max-width: calc(var(--grid-col-width) * 12);
-            }
-            .offset-mobile-1 {
-                margin-left: calc(var(--grid-col-width) * 1);
-            }
-            .offset-mobile-2 {
-                margin-left: calc(var(--grid-col-width) * 2);
-            }
-            .offset-mobile-3 {
-                margin-left: calc(var(--grid-col-width) * 3);
-            }
-            .offset-mobile-4 {
-                margin-left: calc(var(--grid-col-width) * 4);
-            }
-            .offset-mobile-5 {
-                margin-left: calc(var(--grid-col-width) * 5);
-            }
-            .offset-mobile-6 {
-                margin-left: calc(var(--grid-col-width) * 6);
-            }
-            .offset-mobile-7 {
-                margin-left: calc(var(--grid-col-width) * 7);
-            }
-            .offset-mobile-8 {
-                margin-left: calc(var(--grid-col-width) * 8);
-            }
-            .offset-mobile-9 {
-                margin-left: calc(var(--grid-col-width) * 9);
-            }
-            .offset-mobile-10 {
-                margin-left: calc(var(--grid-col-width) * 10);
-            }
-            .offset-mobile-11 {
-                margin-left: calc(var(--grid-col-width) * 11);
-            }
-
-        .order-mobile-first {
-            order: -1;
-        }
-
-        .order-mobile-last {
-            order: 13;
-        }
-            .order-mobile-1 {
-                order: 1;
-            }
-            .order-mobile-2 {
-                order: 2;
-            }
-            .order-mobile-3 {
-                order: 3;
-            }
-            .order-mobile-4 {
-                order: 4;
-            }
-            .order-mobile-5 {
-                order: 5;
-            }
-            .order-mobile-6 {
-                order: 6;
-            }
-            .order-mobile-7 {
-                order: 7;
-            }
-            .order-mobile-8 {
-                order: 8;
-            }
-            .order-mobile-9 {
-                order: 9;
-            }
-            .order-mobile-10 {
-                order: 10;
-            }
-            .order-mobile-11 {
-                order: 11;
-            }
-            .order-mobile-12 {
-                order: 12;
-            }
-    }
-
-@media (min-width: 320px) {
-        .width-mobile-xs-auto {
-            flex: 0 0 auto;
-            width: auto;
-            max-width: none;
-        }
-
-        .width-mobile-xs-available {
-            flex-basis: auto;
-            min-height: auto;
-            height: auto;
-        }
-            .width-mobile-xs-1 {
-                flex: 0 0 calc(var(--grid-col-width) * 1);
-                max-width: calc(var(--grid-col-width) * 1);
-            }
-            .width-mobile-xs-2 {
-                flex: 0 0 calc(var(--grid-col-width) * 2);
-                max-width: calc(var(--grid-col-width) * 2);
-            }
-            .width-mobile-xs-3 {
-                flex: 0 0 calc(var(--grid-col-width) * 3);
-                max-width: calc(var(--grid-col-width) * 3);
-            }
-            .width-mobile-xs-4 {
-                flex: 0 0 calc(var(--grid-col-width) * 4);
-                max-width: calc(var(--grid-col-width) * 4);
-            }
-            .width-mobile-xs-5 {
-                flex: 0 0 calc(var(--grid-col-width) * 5);
-                max-width: calc(var(--grid-col-width) * 5);
-            }
-            .width-mobile-xs-6 {
-                flex: 0 0 calc(var(--grid-col-width) * 6);
-                max-width: calc(var(--grid-col-width) * 6);
-            }
-            .width-mobile-xs-7 {
-                flex: 0 0 calc(var(--grid-col-width) * 7);
-                max-width: calc(var(--grid-col-width) * 7);
-            }
-            .width-mobile-xs-8 {
-                flex: 0 0 calc(var(--grid-col-width) * 8);
-                max-width: calc(var(--grid-col-width) * 8);
-            }
-            .width-mobile-xs-9 {
-                flex: 0 0 calc(var(--grid-col-width) * 9);
-                max-width: calc(var(--grid-col-width) * 9);
-            }
-            .width-mobile-xs-10 {
-                flex: 0 0 calc(var(--grid-col-width) * 10);
-                max-width: calc(var(--grid-col-width) * 10);
-            }
-            .width-mobile-xs-11 {
-                flex: 0 0 calc(var(--grid-col-width) * 11);
-                max-width: calc(var(--grid-col-width) * 11);
-            }
-            .width-mobile-xs-12 {
-                flex: 0 0 calc(var(--grid-col-width) * 12);
-                max-width: calc(var(--grid-col-width) * 12);
-            }
-            .offset-mobile-xs-1 {
-                margin-left: calc(var(--grid-col-width) * 1);
-            }
-            .offset-mobile-xs-2 {
-                margin-left: calc(var(--grid-col-width) * 2);
-            }
-            .offset-mobile-xs-3 {
-                margin-left: calc(var(--grid-col-width) * 3);
-            }
-            .offset-mobile-xs-4 {
-                margin-left: calc(var(--grid-col-width) * 4);
-            }
-            .offset-mobile-xs-5 {
-                margin-left: calc(var(--grid-col-width) * 5);
-            }
-            .offset-mobile-xs-6 {
-                margin-left: calc(var(--grid-col-width) * 6);
-            }
-            .offset-mobile-xs-7 {
-                margin-left: calc(var(--grid-col-width) * 7);
-            }
-            .offset-mobile-xs-8 {
-                margin-left: calc(var(--grid-col-width) * 8);
-            }
-            .offset-mobile-xs-9 {
-                margin-left: calc(var(--grid-col-width) * 9);
-            }
-            .offset-mobile-xs-10 {
-                margin-left: calc(var(--grid-col-width) * 10);
-            }
-            .offset-mobile-xs-11 {
-                margin-left: calc(var(--grid-col-width) * 11);
-            }
-
-        .order-mobile-xs-first {
-            order: -1;
-        }
-
-        .order-mobile-xs-last {
-            order: 13;
-        }
-            .order-mobile-xs-1 {
-                order: 1;
-            }
-            .order-mobile-xs-2 {
-                order: 2;
-            }
-            .order-mobile-xs-3 {
-                order: 3;
-            }
-            .order-mobile-xs-4 {
-                order: 4;
-            }
-            .order-mobile-xs-5 {
-                order: 5;
-            }
-            .order-mobile-xs-6 {
-                order: 6;
-            }
-            .order-mobile-xs-7 {
-                order: 7;
-            }
-            .order-mobile-xs-8 {
-                order: 8;
-            }
-            .order-mobile-xs-9 {
-                order: 9;
-            }
-            .order-mobile-xs-10 {
-                order: 10;
-            }
-            .order-mobile-xs-11 {
-                order: 11;
-            }
-            .order-mobile-xs-12 {
-                order: 12;
-            }
-    }
-
-@media (min-width: 360px) {
-        .width-mobile-s-auto {
-            flex: 0 0 auto;
-            width: auto;
-            max-width: none;
-        }
-
-        .width-mobile-s-available {
-            flex-basis: auto;
-            min-height: auto;
-            height: auto;
-        }
-            .width-mobile-s-1 {
-                flex: 0 0 calc(var(--grid-col-width) * 1);
-                max-width: calc(var(--grid-col-width) * 1);
-            }
-            .width-mobile-s-2 {
-                flex: 0 0 calc(var(--grid-col-width) * 2);
-                max-width: calc(var(--grid-col-width) * 2);
-            }
-            .width-mobile-s-3 {
-                flex: 0 0 calc(var(--grid-col-width) * 3);
-                max-width: calc(var(--grid-col-width) * 3);
-            }
-            .width-mobile-s-4 {
-                flex: 0 0 calc(var(--grid-col-width) * 4);
-                max-width: calc(var(--grid-col-width) * 4);
-            }
-            .width-mobile-s-5 {
-                flex: 0 0 calc(var(--grid-col-width) * 5);
-                max-width: calc(var(--grid-col-width) * 5);
-            }
-            .width-mobile-s-6 {
-                flex: 0 0 calc(var(--grid-col-width) * 6);
-                max-width: calc(var(--grid-col-width) * 6);
-            }
-            .width-mobile-s-7 {
-                flex: 0 0 calc(var(--grid-col-width) * 7);
-                max-width: calc(var(--grid-col-width) * 7);
-            }
-            .width-mobile-s-8 {
-                flex: 0 0 calc(var(--grid-col-width) * 8);
-                max-width: calc(var(--grid-col-width) * 8);
-            }
-            .width-mobile-s-9 {
-                flex: 0 0 calc(var(--grid-col-width) * 9);
-                max-width: calc(var(--grid-col-width) * 9);
-            }
-            .width-mobile-s-10 {
-                flex: 0 0 calc(var(--grid-col-width) * 10);
-                max-width: calc(var(--grid-col-width) * 10);
-            }
-            .width-mobile-s-11 {
-                flex: 0 0 calc(var(--grid-col-width) * 11);
-                max-width: calc(var(--grid-col-width) * 11);
-            }
-            .width-mobile-s-12 {
-                flex: 0 0 calc(var(--grid-col-width) * 12);
-                max-width: calc(var(--grid-col-width) * 12);
-            }
-            .offset-mobile-s-1 {
-                margin-left: calc(var(--grid-col-width) * 1);
-            }
-            .offset-mobile-s-2 {
-                margin-left: calc(var(--grid-col-width) * 2);
-            }
-            .offset-mobile-s-3 {
-                margin-left: calc(var(--grid-col-width) * 3);
-            }
-            .offset-mobile-s-4 {
-                margin-left: calc(var(--grid-col-width) * 4);
-            }
-            .offset-mobile-s-5 {
-                margin-left: calc(var(--grid-col-width) * 5);
-            }
-            .offset-mobile-s-6 {
-                margin-left: calc(var(--grid-col-width) * 6);
-            }
-            .offset-mobile-s-7 {
-                margin-left: calc(var(--grid-col-width) * 7);
-            }
-            .offset-mobile-s-8 {
-                margin-left: calc(var(--grid-col-width) * 8);
-            }
-            .offset-mobile-s-9 {
-                margin-left: calc(var(--grid-col-width) * 9);
-            }
-            .offset-mobile-s-10 {
-                margin-left: calc(var(--grid-col-width) * 10);
-            }
-            .offset-mobile-s-11 {
-                margin-left: calc(var(--grid-col-width) * 11);
-            }
-
-        .order-mobile-s-first {
-            order: -1;
-        }
-
-        .order-mobile-s-last {
-            order: 13;
-        }
-            .order-mobile-s-1 {
-                order: 1;
-            }
-            .order-mobile-s-2 {
-                order: 2;
-            }
-            .order-mobile-s-3 {
-                order: 3;
-            }
-            .order-mobile-s-4 {
-                order: 4;
-            }
-            .order-mobile-s-5 {
-                order: 5;
-            }
-            .order-mobile-s-6 {
-                order: 6;
-            }
-            .order-mobile-s-7 {
-                order: 7;
-            }
-            .order-mobile-s-8 {
-                order: 8;
-            }
-            .order-mobile-s-9 {
-                order: 9;
-            }
-            .order-mobile-s-10 {
-                order: 10;
-            }
-            .order-mobile-s-11 {
-                order: 11;
-            }
-            .order-mobile-s-12 {
-                order: 12;
-            }
-    }
-
-@media (min-width: 375px) {
-        .width-mobile-m-auto {
-            flex: 0 0 auto;
-            width: auto;
-            max-width: none;
-        }
-
-        .width-mobile-m-available {
-            flex-basis: auto;
-            min-height: auto;
-            height: auto;
-        }
-            .width-mobile-m-1 {
-                flex: 0 0 calc(var(--grid-col-width) * 1);
-                max-width: calc(var(--grid-col-width) * 1);
-            }
-            .width-mobile-m-2 {
-                flex: 0 0 calc(var(--grid-col-width) * 2);
-                max-width: calc(var(--grid-col-width) * 2);
-            }
-            .width-mobile-m-3 {
-                flex: 0 0 calc(var(--grid-col-width) * 3);
-                max-width: calc(var(--grid-col-width) * 3);
-            }
-            .width-mobile-m-4 {
-                flex: 0 0 calc(var(--grid-col-width) * 4);
-                max-width: calc(var(--grid-col-width) * 4);
-            }
-            .width-mobile-m-5 {
-                flex: 0 0 calc(var(--grid-col-width) * 5);
-                max-width: calc(var(--grid-col-width) * 5);
-            }
-            .width-mobile-m-6 {
-                flex: 0 0 calc(var(--grid-col-width) * 6);
-                max-width: calc(var(--grid-col-width) * 6);
-            }
-            .width-mobile-m-7 {
-                flex: 0 0 calc(var(--grid-col-width) * 7);
-                max-width: calc(var(--grid-col-width) * 7);
-            }
-            .width-mobile-m-8 {
-                flex: 0 0 calc(var(--grid-col-width) * 8);
-                max-width: calc(var(--grid-col-width) * 8);
-            }
-            .width-mobile-m-9 {
-                flex: 0 0 calc(var(--grid-col-width) * 9);
-                max-width: calc(var(--grid-col-width) * 9);
-            }
-            .width-mobile-m-10 {
-                flex: 0 0 calc(var(--grid-col-width) * 10);
-                max-width: calc(var(--grid-col-width) * 10);
-            }
-            .width-mobile-m-11 {
-                flex: 0 0 calc(var(--grid-col-width) * 11);
-                max-width: calc(var(--grid-col-width) * 11);
-            }
-            .width-mobile-m-12 {
-                flex: 0 0 calc(var(--grid-col-width) * 12);
-                max-width: calc(var(--grid-col-width) * 12);
-            }
-            .offset-mobile-m-1 {
-                margin-left: calc(var(--grid-col-width) * 1);
-            }
-            .offset-mobile-m-2 {
-                margin-left: calc(var(--grid-col-width) * 2);
-            }
-            .offset-mobile-m-3 {
-                margin-left: calc(var(--grid-col-width) * 3);
-            }
-            .offset-mobile-m-4 {
-                margin-left: calc(var(--grid-col-width) * 4);
-            }
-            .offset-mobile-m-5 {
-                margin-left: calc(var(--grid-col-width) * 5);
-            }
-            .offset-mobile-m-6 {
-                margin-left: calc(var(--grid-col-width) * 6);
-            }
-            .offset-mobile-m-7 {
-                margin-left: calc(var(--grid-col-width) * 7);
-            }
-            .offset-mobile-m-8 {
-                margin-left: calc(var(--grid-col-width) * 8);
-            }
-            .offset-mobile-m-9 {
-                margin-left: calc(var(--grid-col-width) * 9);
-            }
-            .offset-mobile-m-10 {
-                margin-left: calc(var(--grid-col-width) * 10);
-            }
-            .offset-mobile-m-11 {
-                margin-left: calc(var(--grid-col-width) * 11);
-            }
-
-        .order-mobile-m-first {
-            order: -1;
-        }
-
-        .order-mobile-m-last {
-            order: 13;
-        }
-            .order-mobile-m-1 {
-                order: 1;
-            }
-            .order-mobile-m-2 {
-                order: 2;
-            }
-            .order-mobile-m-3 {
-                order: 3;
-            }
-            .order-mobile-m-4 {
-                order: 4;
-            }
-            .order-mobile-m-5 {
-                order: 5;
-            }
-            .order-mobile-m-6 {
-                order: 6;
-            }
-            .order-mobile-m-7 {
-                order: 7;
-            }
-            .order-mobile-m-8 {
-                order: 8;
-            }
-            .order-mobile-m-9 {
-                order: 9;
-            }
-            .order-mobile-m-10 {
-                order: 10;
-            }
-            .order-mobile-m-11 {
-                order: 11;
-            }
-            .order-mobile-m-12 {
-                order: 12;
-            }
-    }
-
-@media (min-width: 412px) {
-        .width-mobile-l-auto {
-            flex: 0 0 auto;
-            width: auto;
-            max-width: none;
-        }
-
-        .width-mobile-l-available {
-            flex-basis: auto;
-            min-height: auto;
-            height: auto;
-        }
-            .width-mobile-l-1 {
-                flex: 0 0 calc(var(--grid-col-width) * 1);
-                max-width: calc(var(--grid-col-width) * 1);
-            }
-            .width-mobile-l-2 {
-                flex: 0 0 calc(var(--grid-col-width) * 2);
-                max-width: calc(var(--grid-col-width) * 2);
-            }
-            .width-mobile-l-3 {
-                flex: 0 0 calc(var(--grid-col-width) * 3);
-                max-width: calc(var(--grid-col-width) * 3);
-            }
-            .width-mobile-l-4 {
-                flex: 0 0 calc(var(--grid-col-width) * 4);
-                max-width: calc(var(--grid-col-width) * 4);
-            }
-            .width-mobile-l-5 {
-                flex: 0 0 calc(var(--grid-col-width) * 5);
-                max-width: calc(var(--grid-col-width) * 5);
-            }
-            .width-mobile-l-6 {
-                flex: 0 0 calc(var(--grid-col-width) * 6);
-                max-width: calc(var(--grid-col-width) * 6);
-            }
-            .width-mobile-l-7 {
-                flex: 0 0 calc(var(--grid-col-width) * 7);
-                max-width: calc(var(--grid-col-width) * 7);
-            }
-            .width-mobile-l-8 {
-                flex: 0 0 calc(var(--grid-col-width) * 8);
-                max-width: calc(var(--grid-col-width) * 8);
-            }
-            .width-mobile-l-9 {
-                flex: 0 0 calc(var(--grid-col-width) * 9);
-                max-width: calc(var(--grid-col-width) * 9);
-            }
-            .width-mobile-l-10 {
-                flex: 0 0 calc(var(--grid-col-width) * 10);
-                max-width: calc(var(--grid-col-width) * 10);
-            }
-            .width-mobile-l-11 {
-                flex: 0 0 calc(var(--grid-col-width) * 11);
-                max-width: calc(var(--grid-col-width) * 11);
-            }
-            .width-mobile-l-12 {
-                flex: 0 0 calc(var(--grid-col-width) * 12);
-                max-width: calc(var(--grid-col-width) * 12);
-            }
-            .offset-mobile-l-1 {
-                margin-left: calc(var(--grid-col-width) * 1);
-            }
-            .offset-mobile-l-2 {
-                margin-left: calc(var(--grid-col-width) * 2);
-            }
-            .offset-mobile-l-3 {
-                margin-left: calc(var(--grid-col-width) * 3);
-            }
-            .offset-mobile-l-4 {
-                margin-left: calc(var(--grid-col-width) * 4);
-            }
-            .offset-mobile-l-5 {
-                margin-left: calc(var(--grid-col-width) * 5);
-            }
-            .offset-mobile-l-6 {
-                margin-left: calc(var(--grid-col-width) * 6);
-            }
-            .offset-mobile-l-7 {
-                margin-left: calc(var(--grid-col-width) * 7);
-            }
-            .offset-mobile-l-8 {
-                margin-left: calc(var(--grid-col-width) * 8);
-            }
-            .offset-mobile-l-9 {
-                margin-left: calc(var(--grid-col-width) * 9);
-            }
-            .offset-mobile-l-10 {
-                margin-left: calc(var(--grid-col-width) * 10);
-            }
-            .offset-mobile-l-11 {
-                margin-left: calc(var(--grid-col-width) * 11);
-            }
-
-        .order-mobile-l-first {
-            order: -1;
-        }
-
-        .order-mobile-l-last {
-            order: 13;
-        }
-            .order-mobile-l-1 {
-                order: 1;
-            }
-            .order-mobile-l-2 {
-                order: 2;
-            }
-            .order-mobile-l-3 {
-                order: 3;
-            }
-            .order-mobile-l-4 {
-                order: 4;
-            }
-            .order-mobile-l-5 {
-                order: 5;
-            }
-            .order-mobile-l-6 {
-                order: 6;
-            }
-            .order-mobile-l-7 {
-                order: 7;
-            }
-            .order-mobile-l-8 {
-                order: 8;
-            }
-            .order-mobile-l-9 {
-                order: 9;
-            }
-            .order-mobile-l-10 {
-                order: 10;
-            }
-            .order-mobile-l-11 {
-                order: 11;
-            }
-            .order-mobile-l-12 {
-                order: 12;
-            }
-    }
-
-@media (min-width: 600px) and (max-width: 1023px) {
-        .width-tablet-auto {
-            flex: 0 0 auto;
-            width: auto;
-            max-width: none;
-        }
-
-        .width-tablet-available {
-            flex-basis: auto;
-            min-height: auto;
-            height: auto;
-        }
-            .width-tablet-1 {
-                flex: 0 0 calc(var(--grid-col-width) * 1);
-                max-width: calc(var(--grid-col-width) * 1);
-            }
-            .width-tablet-2 {
-                flex: 0 0 calc(var(--grid-col-width) * 2);
-                max-width: calc(var(--grid-col-width) * 2);
-            }
-            .width-tablet-3 {
-                flex: 0 0 calc(var(--grid-col-width) * 3);
-                max-width: calc(var(--grid-col-width) * 3);
-            }
-            .width-tablet-4 {
-                flex: 0 0 calc(var(--grid-col-width) * 4);
-                max-width: calc(var(--grid-col-width) * 4);
-            }
-            .width-tablet-5 {
-                flex: 0 0 calc(var(--grid-col-width) * 5);
-                max-width: calc(var(--grid-col-width) * 5);
-            }
-            .width-tablet-6 {
-                flex: 0 0 calc(var(--grid-col-width) * 6);
-                max-width: calc(var(--grid-col-width) * 6);
-            }
-            .width-tablet-7 {
-                flex: 0 0 calc(var(--grid-col-width) * 7);
-                max-width: calc(var(--grid-col-width) * 7);
-            }
-            .width-tablet-8 {
-                flex: 0 0 calc(var(--grid-col-width) * 8);
-                max-width: calc(var(--grid-col-width) * 8);
-            }
-            .width-tablet-9 {
-                flex: 0 0 calc(var(--grid-col-width) * 9);
-                max-width: calc(var(--grid-col-width) * 9);
-            }
-            .width-tablet-10 {
-                flex: 0 0 calc(var(--grid-col-width) * 10);
-                max-width: calc(var(--grid-col-width) * 10);
-            }
-            .width-tablet-11 {
-                flex: 0 0 calc(var(--grid-col-width) * 11);
-                max-width: calc(var(--grid-col-width) * 11);
-            }
-            .width-tablet-12 {
-                flex: 0 0 calc(var(--grid-col-width) * 12);
-                max-width: calc(var(--grid-col-width) * 12);
-            }
-            .offset-tablet-1 {
-                margin-left: calc(var(--grid-col-width) * 1);
-            }
-            .offset-tablet-2 {
-                margin-left: calc(var(--grid-col-width) * 2);
-            }
-            .offset-tablet-3 {
-                margin-left: calc(var(--grid-col-width) * 3);
-            }
-            .offset-tablet-4 {
-                margin-left: calc(var(--grid-col-width) * 4);
-            }
-            .offset-tablet-5 {
-                margin-left: calc(var(--grid-col-width) * 5);
-            }
-            .offset-tablet-6 {
-                margin-left: calc(var(--grid-col-width) * 6);
-            }
-            .offset-tablet-7 {
-                margin-left: calc(var(--grid-col-width) * 7);
-            }
-            .offset-tablet-8 {
-                margin-left: calc(var(--grid-col-width) * 8);
-            }
-            .offset-tablet-9 {
-                margin-left: calc(var(--grid-col-width) * 9);
-            }
-            .offset-tablet-10 {
-                margin-left: calc(var(--grid-col-width) * 10);
-            }
-            .offset-tablet-11 {
-                margin-left: calc(var(--grid-col-width) * 11);
-            }
-
-        .order-tablet-first {
-            order: -1;
-        }
-
-        .order-tablet-last {
-            order: 13;
-        }
-            .order-tablet-1 {
-                order: 1;
-            }
-            .order-tablet-2 {
-                order: 2;
-            }
-            .order-tablet-3 {
-                order: 3;
-            }
-            .order-tablet-4 {
-                order: 4;
-            }
-            .order-tablet-5 {
-                order: 5;
-            }
-            .order-tablet-6 {
-                order: 6;
-            }
-            .order-tablet-7 {
-                order: 7;
-            }
-            .order-tablet-8 {
-                order: 8;
-            }
-            .order-tablet-9 {
-                order: 9;
-            }
-            .order-tablet-10 {
-                order: 10;
-            }
-            .order-tablet-11 {
-                order: 11;
-            }
-            .order-tablet-12 {
-                order: 12;
-            }
-    }
-
-@media (min-width: 600px) {
-        .width-tablet-s-auto {
-            flex: 0 0 auto;
-            width: auto;
-            max-width: none;
-        }
-
-        .width-tablet-s-available {
-            flex-basis: auto;
-            min-height: auto;
-            height: auto;
-        }
-            .width-tablet-s-1 {
-                flex: 0 0 calc(var(--grid-col-width) * 1);
-                max-width: calc(var(--grid-col-width) * 1);
-            }
-            .width-tablet-s-2 {
-                flex: 0 0 calc(var(--grid-col-width) * 2);
-                max-width: calc(var(--grid-col-width) * 2);
-            }
-            .width-tablet-s-3 {
-                flex: 0 0 calc(var(--grid-col-width) * 3);
-                max-width: calc(var(--grid-col-width) * 3);
-            }
-            .width-tablet-s-4 {
-                flex: 0 0 calc(var(--grid-col-width) * 4);
-                max-width: calc(var(--grid-col-width) * 4);
-            }
-            .width-tablet-s-5 {
-                flex: 0 0 calc(var(--grid-col-width) * 5);
-                max-width: calc(var(--grid-col-width) * 5);
-            }
-            .width-tablet-s-6 {
-                flex: 0 0 calc(var(--grid-col-width) * 6);
-                max-width: calc(var(--grid-col-width) * 6);
-            }
-            .width-tablet-s-7 {
-                flex: 0 0 calc(var(--grid-col-width) * 7);
-                max-width: calc(var(--grid-col-width) * 7);
-            }
-            .width-tablet-s-8 {
-                flex: 0 0 calc(var(--grid-col-width) * 8);
-                max-width: calc(var(--grid-col-width) * 8);
-            }
-            .width-tablet-s-9 {
-                flex: 0 0 calc(var(--grid-col-width) * 9);
-                max-width: calc(var(--grid-col-width) * 9);
-            }
-            .width-tablet-s-10 {
-                flex: 0 0 calc(var(--grid-col-width) * 10);
-                max-width: calc(var(--grid-col-width) * 10);
-            }
-            .width-tablet-s-11 {
-                flex: 0 0 calc(var(--grid-col-width) * 11);
-                max-width: calc(var(--grid-col-width) * 11);
-            }
-            .width-tablet-s-12 {
-                flex: 0 0 calc(var(--grid-col-width) * 12);
-                max-width: calc(var(--grid-col-width) * 12);
-            }
-            .offset-tablet-s-1 {
-                margin-left: calc(var(--grid-col-width) * 1);
-            }
-            .offset-tablet-s-2 {
-                margin-left: calc(var(--grid-col-width) * 2);
-            }
-            .offset-tablet-s-3 {
-                margin-left: calc(var(--grid-col-width) * 3);
-            }
-            .offset-tablet-s-4 {
-                margin-left: calc(var(--grid-col-width) * 4);
-            }
-            .offset-tablet-s-5 {
-                margin-left: calc(var(--grid-col-width) * 5);
-            }
-            .offset-tablet-s-6 {
-                margin-left: calc(var(--grid-col-width) * 6);
-            }
-            .offset-tablet-s-7 {
-                margin-left: calc(var(--grid-col-width) * 7);
-            }
-            .offset-tablet-s-8 {
-                margin-left: calc(var(--grid-col-width) * 8);
-            }
-            .offset-tablet-s-9 {
-                margin-left: calc(var(--grid-col-width) * 9);
-            }
-            .offset-tablet-s-10 {
-                margin-left: calc(var(--grid-col-width) * 10);
-            }
-            .offset-tablet-s-11 {
-                margin-left: calc(var(--grid-col-width) * 11);
-            }
-
-        .order-tablet-s-first {
-            order: -1;
-        }
-
-        .order-tablet-s-last {
-            order: 13;
-        }
-            .order-tablet-s-1 {
-                order: 1;
-            }
-            .order-tablet-s-2 {
-                order: 2;
-            }
-            .order-tablet-s-3 {
-                order: 3;
-            }
-            .order-tablet-s-4 {
-                order: 4;
-            }
-            .order-tablet-s-5 {
-                order: 5;
-            }
-            .order-tablet-s-6 {
-                order: 6;
-            }
-            .order-tablet-s-7 {
-                order: 7;
-            }
-            .order-tablet-s-8 {
-                order: 8;
-            }
-            .order-tablet-s-9 {
-                order: 9;
-            }
-            .order-tablet-s-10 {
-                order: 10;
-            }
-            .order-tablet-s-11 {
-                order: 11;
-            }
-            .order-tablet-s-12 {
-                order: 12;
-            }
-    }
-
-@media (min-width: 768px) {
-        .width-tablet-m-auto {
-            flex: 0 0 auto;
-            width: auto;
-            max-width: none;
-        }
-
-        .width-tablet-m-available {
-            flex-basis: auto;
-            min-height: auto;
-            height: auto;
-        }
-            .width-tablet-m-1 {
-                flex: 0 0 calc(var(--grid-col-width) * 1);
-                max-width: calc(var(--grid-col-width) * 1);
-            }
-            .width-tablet-m-2 {
-                flex: 0 0 calc(var(--grid-col-width) * 2);
-                max-width: calc(var(--grid-col-width) * 2);
-            }
-            .width-tablet-m-3 {
-                flex: 0 0 calc(var(--grid-col-width) * 3);
-                max-width: calc(var(--grid-col-width) * 3);
-            }
-            .width-tablet-m-4 {
-                flex: 0 0 calc(var(--grid-col-width) * 4);
-                max-width: calc(var(--grid-col-width) * 4);
-            }
-            .width-tablet-m-5 {
-                flex: 0 0 calc(var(--grid-col-width) * 5);
-                max-width: calc(var(--grid-col-width) * 5);
-            }
-            .width-tablet-m-6 {
-                flex: 0 0 calc(var(--grid-col-width) * 6);
-                max-width: calc(var(--grid-col-width) * 6);
-            }
-            .width-tablet-m-7 {
-                flex: 0 0 calc(var(--grid-col-width) * 7);
-                max-width: calc(var(--grid-col-width) * 7);
-            }
-            .width-tablet-m-8 {
-                flex: 0 0 calc(var(--grid-col-width) * 8);
-                max-width: calc(var(--grid-col-width) * 8);
-            }
-            .width-tablet-m-9 {
-                flex: 0 0 calc(var(--grid-col-width) * 9);
-                max-width: calc(var(--grid-col-width) * 9);
-            }
-            .width-tablet-m-10 {
-                flex: 0 0 calc(var(--grid-col-width) * 10);
-                max-width: calc(var(--grid-col-width) * 10);
-            }
-            .width-tablet-m-11 {
-                flex: 0 0 calc(var(--grid-col-width) * 11);
-                max-width: calc(var(--grid-col-width) * 11);
-            }
-            .width-tablet-m-12 {
-                flex: 0 0 calc(var(--grid-col-width) * 12);
-                max-width: calc(var(--grid-col-width) * 12);
-            }
-            .offset-tablet-m-1 {
-                margin-left: calc(var(--grid-col-width) * 1);
-            }
-            .offset-tablet-m-2 {
-                margin-left: calc(var(--grid-col-width) * 2);
-            }
-            .offset-tablet-m-3 {
-                margin-left: calc(var(--grid-col-width) * 3);
-            }
-            .offset-tablet-m-4 {
-                margin-left: calc(var(--grid-col-width) * 4);
-            }
-            .offset-tablet-m-5 {
-                margin-left: calc(var(--grid-col-width) * 5);
-            }
-            .offset-tablet-m-6 {
-                margin-left: calc(var(--grid-col-width) * 6);
-            }
-            .offset-tablet-m-7 {
-                margin-left: calc(var(--grid-col-width) * 7);
-            }
-            .offset-tablet-m-8 {
-                margin-left: calc(var(--grid-col-width) * 8);
-            }
-            .offset-tablet-m-9 {
-                margin-left: calc(var(--grid-col-width) * 9);
-            }
-            .offset-tablet-m-10 {
-                margin-left: calc(var(--grid-col-width) * 10);
-            }
-            .offset-tablet-m-11 {
-                margin-left: calc(var(--grid-col-width) * 11);
-            }
-
-        .order-tablet-m-first {
-            order: -1;
-        }
-
-        .order-tablet-m-last {
-            order: 13;
-        }
-            .order-tablet-m-1 {
-                order: 1;
-            }
-            .order-tablet-m-2 {
-                order: 2;
-            }
-            .order-tablet-m-3 {
-                order: 3;
-            }
-            .order-tablet-m-4 {
-                order: 4;
-            }
-            .order-tablet-m-5 {
-                order: 5;
-            }
-            .order-tablet-m-6 {
-                order: 6;
-            }
-            .order-tablet-m-7 {
-                order: 7;
-            }
-            .order-tablet-m-8 {
-                order: 8;
-            }
-            .order-tablet-m-9 {
-                order: 9;
-            }
-            .order-tablet-m-10 {
-                order: 10;
-            }
-            .order-tablet-m-11 {
-                order: 11;
-            }
-            .order-tablet-m-12 {
-                order: 12;
-            }
-    }
-
-@media (min-width: 1024px) {
-        .width-desktop-auto {
-            flex: 0 0 auto;
-            width: auto;
-            max-width: none;
-        }
-
-        .width-desktop-available {
-            flex-basis: auto;
-            min-height: auto;
-            height: auto;
-        }
-            .width-desktop-1 {
-                flex: 0 0 calc(var(--grid-col-width) * 1);
-                max-width: calc(var(--grid-col-width) * 1);
-            }
-            .width-desktop-2 {
-                flex: 0 0 calc(var(--grid-col-width) * 2);
-                max-width: calc(var(--grid-col-width) * 2);
-            }
-            .width-desktop-3 {
-                flex: 0 0 calc(var(--grid-col-width) * 3);
-                max-width: calc(var(--grid-col-width) * 3);
-            }
-            .width-desktop-4 {
-                flex: 0 0 calc(var(--grid-col-width) * 4);
-                max-width: calc(var(--grid-col-width) * 4);
-            }
-            .width-desktop-5 {
-                flex: 0 0 calc(var(--grid-col-width) * 5);
-                max-width: calc(var(--grid-col-width) * 5);
-            }
-            .width-desktop-6 {
-                flex: 0 0 calc(var(--grid-col-width) * 6);
-                max-width: calc(var(--grid-col-width) * 6);
-            }
-            .width-desktop-7 {
-                flex: 0 0 calc(var(--grid-col-width) * 7);
-                max-width: calc(var(--grid-col-width) * 7);
-            }
-            .width-desktop-8 {
-                flex: 0 0 calc(var(--grid-col-width) * 8);
-                max-width: calc(var(--grid-col-width) * 8);
-            }
-            .width-desktop-9 {
-                flex: 0 0 calc(var(--grid-col-width) * 9);
-                max-width: calc(var(--grid-col-width) * 9);
-            }
-            .width-desktop-10 {
-                flex: 0 0 calc(var(--grid-col-width) * 10);
-                max-width: calc(var(--grid-col-width) * 10);
-            }
-            .width-desktop-11 {
-                flex: 0 0 calc(var(--grid-col-width) * 11);
-                max-width: calc(var(--grid-col-width) * 11);
-            }
-            .width-desktop-12 {
-                flex: 0 0 calc(var(--grid-col-width) * 12);
-                max-width: calc(var(--grid-col-width) * 12);
-            }
-            .offset-desktop-1 {
-                margin-left: calc(var(--grid-col-width) * 1);
-            }
-            .offset-desktop-2 {
-                margin-left: calc(var(--grid-col-width) * 2);
-            }
-            .offset-desktop-3 {
-                margin-left: calc(var(--grid-col-width) * 3);
-            }
-            .offset-desktop-4 {
-                margin-left: calc(var(--grid-col-width) * 4);
-            }
-            .offset-desktop-5 {
-                margin-left: calc(var(--grid-col-width) * 5);
-            }
-            .offset-desktop-6 {
-                margin-left: calc(var(--grid-col-width) * 6);
-            }
-            .offset-desktop-7 {
-                margin-left: calc(var(--grid-col-width) * 7);
-            }
-            .offset-desktop-8 {
-                margin-left: calc(var(--grid-col-width) * 8);
-            }
-            .offset-desktop-9 {
-                margin-left: calc(var(--grid-col-width) * 9);
-            }
-            .offset-desktop-10 {
-                margin-left: calc(var(--grid-col-width) * 10);
-            }
-            .offset-desktop-11 {
-                margin-left: calc(var(--grid-col-width) * 11);
-            }
-
-        .order-desktop-first {
-            order: -1;
-        }
-
-        .order-desktop-last {
-            order: 13;
-        }
-            .order-desktop-1 {
-                order: 1;
-            }
-            .order-desktop-2 {
-                order: 2;
-            }
-            .order-desktop-3 {
-                order: 3;
-            }
-            .order-desktop-4 {
-                order: 4;
-            }
-            .order-desktop-5 {
-                order: 5;
-            }
-            .order-desktop-6 {
-                order: 6;
-            }
-            .order-desktop-7 {
-                order: 7;
-            }
-            .order-desktop-8 {
-                order: 8;
-            }
-            .order-desktop-9 {
-                order: 9;
-            }
-            .order-desktop-10 {
-                order: 10;
-            }
-            .order-desktop-11 {
-                order: 11;
-            }
-            .order-desktop-12 {
-                order: 12;
-            }
-    }
-
-@media (min-width: 1024px) {
-        .width-desktop-s-auto {
-            flex: 0 0 auto;
-            width: auto;
-            max-width: none;
-        }
-
-        .width-desktop-s-available {
-            flex-basis: auto;
-            min-height: auto;
-            height: auto;
-        }
-            .width-desktop-s-1 {
-                flex: 0 0 calc(var(--grid-col-width) * 1);
-                max-width: calc(var(--grid-col-width) * 1);
-            }
-            .width-desktop-s-2 {
-                flex: 0 0 calc(var(--grid-col-width) * 2);
-                max-width: calc(var(--grid-col-width) * 2);
-            }
-            .width-desktop-s-3 {
-                flex: 0 0 calc(var(--grid-col-width) * 3);
-                max-width: calc(var(--grid-col-width) * 3);
-            }
-            .width-desktop-s-4 {
-                flex: 0 0 calc(var(--grid-col-width) * 4);
-                max-width: calc(var(--grid-col-width) * 4);
-            }
-            .width-desktop-s-5 {
-                flex: 0 0 calc(var(--grid-col-width) * 5);
-                max-width: calc(var(--grid-col-width) * 5);
-            }
-            .width-desktop-s-6 {
-                flex: 0 0 calc(var(--grid-col-width) * 6);
-                max-width: calc(var(--grid-col-width) * 6);
-            }
-            .width-desktop-s-7 {
-                flex: 0 0 calc(var(--grid-col-width) * 7);
-                max-width: calc(var(--grid-col-width) * 7);
-            }
-            .width-desktop-s-8 {
-                flex: 0 0 calc(var(--grid-col-width) * 8);
-                max-width: calc(var(--grid-col-width) * 8);
-            }
-            .width-desktop-s-9 {
-                flex: 0 0 calc(var(--grid-col-width) * 9);
-                max-width: calc(var(--grid-col-width) * 9);
-            }
-            .width-desktop-s-10 {
-                flex: 0 0 calc(var(--grid-col-width) * 10);
-                max-width: calc(var(--grid-col-width) * 10);
-            }
-            .width-desktop-s-11 {
-                flex: 0 0 calc(var(--grid-col-width) * 11);
-                max-width: calc(var(--grid-col-width) * 11);
-            }
-            .width-desktop-s-12 {
-                flex: 0 0 calc(var(--grid-col-width) * 12);
-                max-width: calc(var(--grid-col-width) * 12);
-            }
-            .offset-desktop-s-1 {
-                margin-left: calc(var(--grid-col-width) * 1);
-            }
-            .offset-desktop-s-2 {
-                margin-left: calc(var(--grid-col-width) * 2);
-            }
-            .offset-desktop-s-3 {
-                margin-left: calc(var(--grid-col-width) * 3);
-            }
-            .offset-desktop-s-4 {
-                margin-left: calc(var(--grid-col-width) * 4);
-            }
-            .offset-desktop-s-5 {
-                margin-left: calc(var(--grid-col-width) * 5);
-            }
-            .offset-desktop-s-6 {
-                margin-left: calc(var(--grid-col-width) * 6);
-            }
-            .offset-desktop-s-7 {
-                margin-left: calc(var(--grid-col-width) * 7);
-            }
-            .offset-desktop-s-8 {
-                margin-left: calc(var(--grid-col-width) * 8);
-            }
-            .offset-desktop-s-9 {
-                margin-left: calc(var(--grid-col-width) * 9);
-            }
-            .offset-desktop-s-10 {
-                margin-left: calc(var(--grid-col-width) * 10);
-            }
-            .offset-desktop-s-11 {
-                margin-left: calc(var(--grid-col-width) * 11);
-            }
-
-        .order-desktop-s-first {
-            order: -1;
-        }
-
-        .order-desktop-s-last {
-            order: 13;
-        }
-            .order-desktop-s-1 {
-                order: 1;
-            }
-            .order-desktop-s-2 {
-                order: 2;
-            }
-            .order-desktop-s-3 {
-                order: 3;
-            }
-            .order-desktop-s-4 {
-                order: 4;
-            }
-            .order-desktop-s-5 {
-                order: 5;
-            }
-            .order-desktop-s-6 {
-                order: 6;
-            }
-            .order-desktop-s-7 {
-                order: 7;
-            }
-            .order-desktop-s-8 {
-                order: 8;
-            }
-            .order-desktop-s-9 {
-                order: 9;
-            }
-            .order-desktop-s-10 {
-                order: 10;
-            }
-            .order-desktop-s-11 {
-                order: 11;
-            }
-            .order-desktop-s-12 {
-                order: 12;
-            }
-    }
-
-@media (min-width: 1280px) {
-        .width-desktop-m-auto {
-            flex: 0 0 auto;
-            width: auto;
-            max-width: none;
-        }
-
-        .width-desktop-m-available {
-            flex-basis: auto;
-            min-height: auto;
-            height: auto;
-        }
-            .width-desktop-m-1 {
-                flex: 0 0 calc(var(--grid-col-width) * 1);
-                max-width: calc(var(--grid-col-width) * 1);
-            }
-            .width-desktop-m-2 {
-                flex: 0 0 calc(var(--grid-col-width) * 2);
-                max-width: calc(var(--grid-col-width) * 2);
-            }
-            .width-desktop-m-3 {
-                flex: 0 0 calc(var(--grid-col-width) * 3);
-                max-width: calc(var(--grid-col-width) * 3);
-            }
-            .width-desktop-m-4 {
-                flex: 0 0 calc(var(--grid-col-width) * 4);
-                max-width: calc(var(--grid-col-width) * 4);
-            }
-            .width-desktop-m-5 {
-                flex: 0 0 calc(var(--grid-col-width) * 5);
-                max-width: calc(var(--grid-col-width) * 5);
-            }
-            .width-desktop-m-6 {
-                flex: 0 0 calc(var(--grid-col-width) * 6);
-                max-width: calc(var(--grid-col-width) * 6);
-            }
-            .width-desktop-m-7 {
-                flex: 0 0 calc(var(--grid-col-width) * 7);
-                max-width: calc(var(--grid-col-width) * 7);
-            }
-            .width-desktop-m-8 {
-                flex: 0 0 calc(var(--grid-col-width) * 8);
-                max-width: calc(var(--grid-col-width) * 8);
-            }
-            .width-desktop-m-9 {
-                flex: 0 0 calc(var(--grid-col-width) * 9);
-                max-width: calc(var(--grid-col-width) * 9);
-            }
-            .width-desktop-m-10 {
-                flex: 0 0 calc(var(--grid-col-width) * 10);
-                max-width: calc(var(--grid-col-width) * 10);
-            }
-            .width-desktop-m-11 {
-                flex: 0 0 calc(var(--grid-col-width) * 11);
-                max-width: calc(var(--grid-col-width) * 11);
-            }
-            .width-desktop-m-12 {
-                flex: 0 0 calc(var(--grid-col-width) * 12);
-                max-width: calc(var(--grid-col-width) * 12);
-            }
-            .offset-desktop-m-1 {
-                margin-left: calc(var(--grid-col-width) * 1);
-            }
-            .offset-desktop-m-2 {
-                margin-left: calc(var(--grid-col-width) * 2);
-            }
-            .offset-desktop-m-3 {
-                margin-left: calc(var(--grid-col-width) * 3);
-            }
-            .offset-desktop-m-4 {
-                margin-left: calc(var(--grid-col-width) * 4);
-            }
-            .offset-desktop-m-5 {
-                margin-left: calc(var(--grid-col-width) * 5);
-            }
-            .offset-desktop-m-6 {
-                margin-left: calc(var(--grid-col-width) * 6);
-            }
-            .offset-desktop-m-7 {
-                margin-left: calc(var(--grid-col-width) * 7);
-            }
-            .offset-desktop-m-8 {
-                margin-left: calc(var(--grid-col-width) * 8);
-            }
-            .offset-desktop-m-9 {
-                margin-left: calc(var(--grid-col-width) * 9);
-            }
-            .offset-desktop-m-10 {
-                margin-left: calc(var(--grid-col-width) * 10);
-            }
-            .offset-desktop-m-11 {
-                margin-left: calc(var(--grid-col-width) * 11);
-            }
-
-        .order-desktop-m-first {
-            order: -1;
-        }
-
-        .order-desktop-m-last {
-            order: 13;
-        }
-            .order-desktop-m-1 {
-                order: 1;
-            }
-            .order-desktop-m-2 {
-                order: 2;
-            }
-            .order-desktop-m-3 {
-                order: 3;
-            }
-            .order-desktop-m-4 {
-                order: 4;
-            }
-            .order-desktop-m-5 {
-                order: 5;
-            }
-            .order-desktop-m-6 {
-                order: 6;
-            }
-            .order-desktop-m-7 {
-                order: 7;
-            }
-            .order-desktop-m-8 {
-                order: 8;
-            }
-            .order-desktop-m-9 {
-                order: 9;
-            }
-            .order-desktop-m-10 {
-                order: 10;
-            }
-            .order-desktop-m-11 {
-                order: 11;
-            }
-            .order-desktop-m-12 {
-                order: 12;
-            }
-    }
-
-@media (min-width: 1440px) {
-        .width-desktop-l-auto {
-            flex: 0 0 auto;
-            width: auto;
-            max-width: none;
-        }
-
-        .width-desktop-l-available {
-            flex-basis: auto;
-            min-height: auto;
-            height: auto;
-        }
-            .width-desktop-l-1 {
-                flex: 0 0 calc(var(--grid-col-width) * 1);
-                max-width: calc(var(--grid-col-width) * 1);
-            }
-            .width-desktop-l-2 {
-                flex: 0 0 calc(var(--grid-col-width) * 2);
-                max-width: calc(var(--grid-col-width) * 2);
-            }
-            .width-desktop-l-3 {
-                flex: 0 0 calc(var(--grid-col-width) * 3);
-                max-width: calc(var(--grid-col-width) * 3);
-            }
-            .width-desktop-l-4 {
-                flex: 0 0 calc(var(--grid-col-width) * 4);
-                max-width: calc(var(--grid-col-width) * 4);
-            }
-            .width-desktop-l-5 {
-                flex: 0 0 calc(var(--grid-col-width) * 5);
-                max-width: calc(var(--grid-col-width) * 5);
-            }
-            .width-desktop-l-6 {
-                flex: 0 0 calc(var(--grid-col-width) * 6);
-                max-width: calc(var(--grid-col-width) * 6);
-            }
-            .width-desktop-l-7 {
-                flex: 0 0 calc(var(--grid-col-width) * 7);
-                max-width: calc(var(--grid-col-width) * 7);
-            }
-            .width-desktop-l-8 {
-                flex: 0 0 calc(var(--grid-col-width) * 8);
-                max-width: calc(var(--grid-col-width) * 8);
-            }
-            .width-desktop-l-9 {
-                flex: 0 0 calc(var(--grid-col-width) * 9);
-                max-width: calc(var(--grid-col-width) * 9);
-            }
-            .width-desktop-l-10 {
-                flex: 0 0 calc(var(--grid-col-width) * 10);
-                max-width: calc(var(--grid-col-width) * 10);
-            }
-            .width-desktop-l-11 {
-                flex: 0 0 calc(var(--grid-col-width) * 11);
-                max-width: calc(var(--grid-col-width) * 11);
-            }
-            .width-desktop-l-12 {
-                flex: 0 0 calc(var(--grid-col-width) * 12);
-                max-width: calc(var(--grid-col-width) * 12);
-            }
-            .offset-desktop-l-1 {
-                margin-left: calc(var(--grid-col-width) * 1);
-            }
-            .offset-desktop-l-2 {
-                margin-left: calc(var(--grid-col-width) * 2);
-            }
-            .offset-desktop-l-3 {
-                margin-left: calc(var(--grid-col-width) * 3);
-            }
-            .offset-desktop-l-4 {
-                margin-left: calc(var(--grid-col-width) * 4);
-            }
-            .offset-desktop-l-5 {
-                margin-left: calc(var(--grid-col-width) * 5);
-            }
-            .offset-desktop-l-6 {
-                margin-left: calc(var(--grid-col-width) * 6);
-            }
-            .offset-desktop-l-7 {
-                margin-left: calc(var(--grid-col-width) * 7);
-            }
-            .offset-desktop-l-8 {
-                margin-left: calc(var(--grid-col-width) * 8);
-            }
-            .offset-desktop-l-9 {
-                margin-left: calc(var(--grid-col-width) * 9);
-            }
-            .offset-desktop-l-10 {
-                margin-left: calc(var(--grid-col-width) * 10);
-            }
-            .offset-desktop-l-11 {
-                margin-left: calc(var(--grid-col-width) * 11);
-            }
-
-        .order-desktop-l-first {
-            order: -1;
-        }
-
-        .order-desktop-l-last {
-            order: 13;
-        }
-            .order-desktop-l-1 {
-                order: 1;
-            }
-            .order-desktop-l-2 {
-                order: 2;
-            }
-            .order-desktop-l-3 {
-                order: 3;
-            }
-            .order-desktop-l-4 {
-                order: 4;
-            }
-            .order-desktop-l-5 {
-                order: 5;
-            }
-            .order-desktop-l-6 {
-                order: 6;
-            }
-            .order-desktop-l-7 {
-                order: 7;
-            }
-            .order-desktop-l-8 {
-                order: 8;
-            }
-            .order-desktop-l-9 {
-                order: 9;
-            }
-            .order-desktop-l-10 {
-                order: 10;
-            }
-            .order-desktop-l-11 {
-                order: 11;
-            }
-            .order-desktop-l-12 {
-                order: 12;
-            }
-    }
-
-@media (min-width: 1920px) {
-        .width-desktop-xl-auto {
-            flex: 0 0 auto;
-            width: auto;
-            max-width: none;
-        }
-
-        .width-desktop-xl-available {
-            flex-basis: auto;
-            min-height: auto;
-            height: auto;
-        }
-            .width-desktop-xl-1 {
-                flex: 0 0 calc(var(--grid-col-width) * 1);
-                max-width: calc(var(--grid-col-width) * 1);
-            }
-            .width-desktop-xl-2 {
-                flex: 0 0 calc(var(--grid-col-width) * 2);
-                max-width: calc(var(--grid-col-width) * 2);
-            }
-            .width-desktop-xl-3 {
-                flex: 0 0 calc(var(--grid-col-width) * 3);
-                max-width: calc(var(--grid-col-width) * 3);
-            }
-            .width-desktop-xl-4 {
-                flex: 0 0 calc(var(--grid-col-width) * 4);
-                max-width: calc(var(--grid-col-width) * 4);
-            }
-            .width-desktop-xl-5 {
-                flex: 0 0 calc(var(--grid-col-width) * 5);
-                max-width: calc(var(--grid-col-width) * 5);
-            }
-            .width-desktop-xl-6 {
-                flex: 0 0 calc(var(--grid-col-width) * 6);
-                max-width: calc(var(--grid-col-width) * 6);
-            }
-            .width-desktop-xl-7 {
-                flex: 0 0 calc(var(--grid-col-width) * 7);
-                max-width: calc(var(--grid-col-width) * 7);
-            }
-            .width-desktop-xl-8 {
-                flex: 0 0 calc(var(--grid-col-width) * 8);
-                max-width: calc(var(--grid-col-width) * 8);
-            }
-            .width-desktop-xl-9 {
-                flex: 0 0 calc(var(--grid-col-width) * 9);
-                max-width: calc(var(--grid-col-width) * 9);
-            }
-            .width-desktop-xl-10 {
-                flex: 0 0 calc(var(--grid-col-width) * 10);
-                max-width: calc(var(--grid-col-width) * 10);
-            }
-            .width-desktop-xl-11 {
-                flex: 0 0 calc(var(--grid-col-width) * 11);
-                max-width: calc(var(--grid-col-width) * 11);
-            }
-            .width-desktop-xl-12 {
-                flex: 0 0 calc(var(--grid-col-width) * 12);
-                max-width: calc(var(--grid-col-width) * 12);
-            }
-            .offset-desktop-xl-1 {
-                margin-left: calc(var(--grid-col-width) * 1);
-            }
-            .offset-desktop-xl-2 {
-                margin-left: calc(var(--grid-col-width) * 2);
-            }
-            .offset-desktop-xl-3 {
-                margin-left: calc(var(--grid-col-width) * 3);
-            }
-            .offset-desktop-xl-4 {
-                margin-left: calc(var(--grid-col-width) * 4);
-            }
-            .offset-desktop-xl-5 {
-                margin-left: calc(var(--grid-col-width) * 5);
-            }
-            .offset-desktop-xl-6 {
-                margin-left: calc(var(--grid-col-width) * 6);
-            }
-            .offset-desktop-xl-7 {
-                margin-left: calc(var(--grid-col-width) * 7);
-            }
-            .offset-desktop-xl-8 {
-                margin-left: calc(var(--grid-col-width) * 8);
-            }
-            .offset-desktop-xl-9 {
-                margin-left: calc(var(--grid-col-width) * 9);
-            }
-            .offset-desktop-xl-10 {
-                margin-left: calc(var(--grid-col-width) * 10);
-            }
-            .offset-desktop-xl-11 {
-                margin-left: calc(var(--grid-col-width) * 11);
-            }
-
-        .order-desktop-xl-first {
-            order: -1;
-        }
-
-        .order-desktop-xl-last {
-            order: 13;
-        }
-            .order-desktop-xl-1 {
-                order: 1;
-            }
-            .order-desktop-xl-2 {
-                order: 2;
-            }
-            .order-desktop-xl-3 {
-                order: 3;
-            }
-            .order-desktop-xl-4 {
-                order: 4;
-            }
-            .order-desktop-xl-5 {
-                order: 5;
-            }
-            .order-desktop-xl-6 {
-                order: 6;
-            }
-            .order-desktop-xl-7 {
-                order: 7;
-            }
-            .order-desktop-xl-8 {
-                order: 8;
-            }
-            .order-desktop-xl-9 {
-                order: 9;
-            }
-            .order-desktop-xl-10 {
-                order: 10;
-            }
-            .order-desktop-xl-11 {
-                order: 11;
-            }
-            .order-desktop-xl-12 {
-                order: 12;
-            }
-    }