@baloise/ds-styles 0.0.5-nightly.e56f740

package/css/utilities/grid.css

@@ -0,0 +1,1209 @@
+.grid {
+  flex-basis: 0;
+  flex-grow: 1;
+  flex-shrink: 1;
+}
+
+.col {
+  display: block;
+  flex-basis: 0;
+  flex-grow: 1;
+  flex-shrink: 1;
+  padding: var(--bal-column-gap);
+}
+.grid.is-mobile > .col.is-narrow {
+  flex: none;
+  width: unset;
+}
+.grid.is-mobile > .col.is-full {
+  flex: none;
+  width: 100%;
+}
+.grid.is-mobile > .col.is-three-quarters {
+  flex: none;
+  width: 75%;
+}
+.grid.is-mobile > .col.is-two-thirds {
+  flex: none;
+  width: 66.6666%;
+}
+.grid.is-mobile > .col.is-half {
+  flex: none;
+  width: 50%;
+}
+.grid.is-mobile > .col.is-one-third {
+  flex: none;
+  width: 33.3333%;
+}
+.grid.is-mobile > .col.is-one-quarter {
+  flex: none;
+  width: 25%;
+}
+.grid.is-mobile > .col.is-one-fifth {
+  flex: none;
+  width: 20%;
+}
+.grid.is-mobile > .col.is-two-fifths {
+  flex: none;
+  width: 40%;
+}
+.grid.is-mobile > .col.is-three-fifths {
+  flex: none;
+  width: 60%;
+}
+.grid.is-mobile > .col.is-four-fifths {
+  flex: none;
+  width: 80%;
+}
+.grid.is-mobile > .col.is-offset-three-quarters {
+  margin-left: 75%;
+}
+.grid.is-mobile > .col.is-offset-two-thirds {
+  margin-left: 66.6666%;
+}
+.grid.is-mobile > .col.is-offset-half {
+  margin-left: 50%;
+}
+.grid.is-mobile > .col.is-offset-one-third {
+  margin-left: 33.3333%;
+}
+.grid.is-mobile > .col.is-offset-one-quarter {
+  margin-left: 25%;
+}
+.grid.is-mobile > .col.is-offset-one-fifth {
+  margin-left: 20%;
+}
+.grid.is-mobile > .col.is-offset-two-fifths {
+  margin-left: 40%;
+}
+.grid.is-mobile > .col.is-offset-three-fifths {
+  margin-left: 60%;
+}
+.grid.is-mobile > .col.is-offset-four-fifths {
+  margin-left: 80%;
+}
+.grid.is-mobile > .col.is-0 {
+  flex: none;
+  width: 0%;
+}
+.grid.is-mobile > .col.is-offset-0 {
+  margin-left: 0%;
+}
+.grid.is-mobile > .col.is-1 {
+  flex: none;
+  width: 8.3333333333%;
+}
+.grid.is-mobile > .col.is-offset-1 {
+  margin-left: 8.3333333333%;
+}
+.grid.is-mobile > .col.is-2 {
+  flex: none;
+  width: 16.6666666667%;
+}
+.grid.is-mobile > .col.is-offset-2 {
+  margin-left: 16.6666666667%;
+}
+.grid.is-mobile > .col.is-3 {
+  flex: none;
+  width: 25%;
+}
+.grid.is-mobile > .col.is-offset-3 {
+  margin-left: 25%;
+}
+.grid.is-mobile > .col.is-4 {
+  flex: none;
+  width: 33.3333333333%;
+}
+.grid.is-mobile > .col.is-offset-4 {
+  margin-left: 33.3333333333%;
+}
+.grid.is-mobile > .col.is-5 {
+  flex: none;
+  width: 41.6666666667%;
+}
+.grid.is-mobile > .col.is-offset-5 {
+  margin-left: 41.6666666667%;
+}
+.grid.is-mobile > .col.is-6 {
+  flex: none;
+  width: 50%;
+}
+.grid.is-mobile > .col.is-offset-6 {
+  margin-left: 50%;
+}
+.grid.is-mobile > .col.is-7 {
+  flex: none;
+  width: 58.3333333333%;
+}
+.grid.is-mobile > .col.is-offset-7 {
+  margin-left: 58.3333333333%;
+}
+.grid.is-mobile > .col.is-8 {
+  flex: none;
+  width: 66.6666666667%;
+}
+.grid.is-mobile > .col.is-offset-8 {
+  margin-left: 66.6666666667%;
+}
+.grid.is-mobile > .col.is-9 {
+  flex: none;
+  width: 75%;
+}
+.grid.is-mobile > .col.is-offset-9 {
+  margin-left: 75%;
+}
+.grid.is-mobile > .col.is-10 {
+  flex: none;
+  width: 83.3333333333%;
+}
+.grid.is-mobile > .col.is-offset-10 {
+  margin-left: 83.3333333333%;
+}
+.grid.is-mobile > .col.is-11 {
+  flex: none;
+  width: 91.6666666667%;
+}
+.grid.is-mobile > .col.is-offset-11 {
+  margin-left: 91.6666666667%;
+}
+.grid.is-mobile > .col.is-12 {
+  flex: none;
+  width: 100%;
+}
+.grid.is-mobile > .col.is-offset-12 {
+  margin-left: 100%;
+}
+@media screen and (max-width: 768px) {
+  .col.mobile\:is-narrow {
+    flex: none;
+    width: unset;
+  }
+  .col.mobile\:is-full {
+    flex: none;
+    width: 100%;
+  }
+  .col.mobile\:is-three-quarters {
+    flex: none;
+    width: 75%;
+  }
+  .col.mobile\:is-two-thirds {
+    flex: none;
+    width: 66.6666%;
+  }
+  .col.mobile\:is-half {
+    flex: none;
+    width: 50%;
+  }
+  .col.mobile\:is-one-third {
+    flex: none;
+    width: 33.3333%;
+  }
+  .col.mobile\:is-one-quarter {
+    flex: none;
+    width: 25%;
+  }
+  .col.mobile\:is-one-fifth {
+    flex: none;
+    width: 20%;
+  }
+  .col.mobile\:is-two-fifths {
+    flex: none;
+    width: 40%;
+  }
+  .col.mobile\:is-three-fifths {
+    flex: none;
+    width: 60%;
+  }
+  .col.mobile\:is-four-fifths {
+    flex: none;
+    width: 80%;
+  }
+  .col.mobile\:is-offset-three-quarters {
+    margin-left: 75%;
+  }
+  .col.mobile\:is-offset-two-thirds {
+    margin-left: 66.6666%;
+  }
+  .col.mobile\:is-offset-half {
+    margin-left: 50%;
+  }
+  .col.mobile\:is-offset-one-third {
+    margin-left: 33.3333%;
+  }
+  .col.mobile\:is-offset-one-quarter {
+    margin-left: 25%;
+  }
+  .col.mobile\:is-offset-one-fifth {
+    margin-left: 20%;
+  }
+  .col.mobile\:is-offset-two-fifths {
+    margin-left: 40%;
+  }
+  .col.mobile\:is-offset-three-fifths {
+    margin-left: 60%;
+  }
+  .col.mobile-offset-four-fifths {
+    margin-left: 80%;
+  }
+  .col.mobile\:is-0 {
+    flex: none;
+    width: 0%;
+  }
+  .col.mobile\:is-offset-0 {
+    margin-left: 0%;
+  }
+  .col.mobile\:is-1 {
+    flex: none;
+    width: 8.3333333333%;
+  }
+  .col.mobile\:is-offset-1 {
+    margin-left: 8.3333333333%;
+  }
+  .col.mobile\:is-2 {
+    flex: none;
+    width: 16.6666666667%;
+  }
+  .col.mobile\:is-offset-2 {
+    margin-left: 16.6666666667%;
+  }
+  .col.mobile\:is-3 {
+    flex: none;
+    width: 25%;
+  }
+  .col.mobile\:is-offset-3 {
+    margin-left: 25%;
+  }
+  .col.mobile\:is-4 {
+    flex: none;
+    width: 33.3333333333%;
+  }
+  .col.mobile\:is-offset-4 {
+    margin-left: 33.3333333333%;
+  }
+  .col.mobile\:is-5 {
+    flex: none;
+    width: 41.6666666667%;
+  }
+  .col.mobile\:is-offset-5 {
+    margin-left: 41.6666666667%;
+  }
+  .col.mobile\:is-6 {
+    flex: none;
+    width: 50%;
+  }
+  .col.mobile\:is-offset-6 {
+    margin-left: 50%;
+  }
+  .col.mobile\:is-7 {
+    flex: none;
+    width: 58.3333333333%;
+  }
+  .col.mobile\:is-offset-7 {
+    margin-left: 58.3333333333%;
+  }
+  .col.mobile\:is-8 {
+    flex: none;
+    width: 66.6666666667%;
+  }
+  .col.mobile\:is-offset-8 {
+    margin-left: 66.6666666667%;
+  }
+  .col.mobile\:is-9 {
+    flex: none;
+    width: 75%;
+  }
+  .col.mobile\:is-offset-9 {
+    margin-left: 75%;
+  }
+  .col.mobile\:is-10 {
+    flex: none;
+    width: 83.3333333333%;
+  }
+  .col.mobile\:is-offset-10 {
+    margin-left: 83.3333333333%;
+  }
+  .col.mobile\:is-11 {
+    flex: none;
+    width: 91.6666666667%;
+  }
+  .col.mobile\:is-offset-11 {
+    margin-left: 91.6666666667%;
+  }
+  .col.mobile\:is-12 {
+    flex: none;
+    width: 100%;
+  }
+  .col.mobile\:is-offset-12 {
+    margin-left: 100%;
+  }
+}
+@media screen and (min-width: 769px), print {
+  .col.is-narrow, .col.tablet\:is-narrow {
+    flex: none;
+    width: unset;
+  }
+  .col.is-full, .col.tablet\:is-full {
+    flex: none;
+    width: 100%;
+  }
+  .col.is-three-quarters, .col.tablet\:is-three-quarters {
+    flex: none;
+    width: 75%;
+  }
+  .col.is-two-thirds, .col.tablet\:is-two-thirds {
+    flex: none;
+    width: 66.6666%;
+  }
+  .col.is-half, .col.tablet\:is-half {
+    flex: none;
+    width: 50%;
+  }
+  .col.is-one-third, .col.tablet\:is-one-third {
+    flex: none;
+    width: 33.3333%;
+  }
+  .col.is-one-quarter, .col.tablet\:is-one-quarter {
+    flex: none;
+    width: 25%;
+  }
+  .col.is-one-fifth, .col.tablet\:is-one-fifth {
+    flex: none;
+    width: 20%;
+  }
+  .col.is-two-fifths, .col.tablet\:is-two-fifths {
+    flex: none;
+    width: 40%;
+  }
+  .col.is-three-fifths, .col.tablet\:is-three-fifths {
+    flex: none;
+    width: 60%;
+  }
+  .col.is-four-fifths, .col.tablet\:is-four-fifths {
+    flex: none;
+    width: 80%;
+  }
+  .col.is-offset-three-quarters, .col.tablet\:is-offset-three-quarters {
+    margin-left: 75%;
+  }
+  .col.is-offset-two-thirds, .col.tablet\:is-offset-two-thirds {
+    margin-left: 66.6666%;
+  }
+  .col.is-offset-half, .col.tablet\:is-offset-half {
+    margin-left: 50%;
+  }
+  .col.is-offset-one-third, .col.tablet\:is-offset-one-third {
+    margin-left: 33.3333%;
+  }
+  .col.is-offset-one-quarter, .col.tablet\:is-offset-one-quarter {
+    margin-left: 25%;
+  }
+  .col.is-offset-one-fifth, .col.tablet\:is-offset-one-fifth {
+    margin-left: 20%;
+  }
+  .col.is-offset-two-fifths, .col.tablet\:is-offset-two-fifths {
+    margin-left: 40%;
+  }
+  .col.is-offset-three-fifths, .col.tablet\:is-offset-three-fifths {
+    margin-left: 60%;
+  }
+  .col.is-offset-four-fifths, .col.tablet\:is-offset-four-fifths {
+    margin-left: 80%;
+  }
+  .col.is-0, .col.tablet\:is-0 {
+    flex: none;
+    width: 0%;
+  }
+  .col.is-offset-0, .col.tablet\:is-offset-0 {
+    margin-left: 0%;
+  }
+  .col.is-1, .col.tablet\:is-1 {
+    flex: none;
+    width: 8.3333333333%;
+  }
+  .col.is-offset-1, .col.tablet\:is-offset-1 {
+    margin-left: 8.3333333333%;
+  }
+  .col.is-2, .col.tablet\:is-2 {
+    flex: none;
+    width: 16.6666666667%;
+  }
+  .col.is-offset-2, .col.tablet\:is-offset-2 {
+    margin-left: 16.6666666667%;
+  }
+  .col.is-3, .col.tablet\:is-3 {
+    flex: none;
+    width: 25%;
+  }
+  .col.is-offset-3, .col.tablet\:is-offset-3 {
+    margin-left: 25%;
+  }
+  .col.is-4, .col.tablet\:is-4 {
+    flex: none;
+    width: 33.3333333333%;
+  }
+  .col.is-offset-4, .col.tablet\:is-offset-4 {
+    margin-left: 33.3333333333%;
+  }
+  .col.is-5, .col.tablet\:is-5 {
+    flex: none;
+    width: 41.6666666667%;
+  }
+  .col.is-offset-5, .col.tablet\:is-offset-5 {
+    margin-left: 41.6666666667%;
+  }
+  .col.is-6, .col.tablet\:is-6 {
+    flex: none;
+    width: 50%;
+  }
+  .col.is-offset-6, .col.tablet\:is-offset-6 {
+    margin-left: 50%;
+  }
+  .col.is-7, .col.tablet\:is-7 {
+    flex: none;
+    width: 58.3333333333%;
+  }
+  .col.is-offset-7, .col.tablet\:is-offset-7 {
+    margin-left: 58.3333333333%;
+  }
+  .col.is-8, .col.tablet\:is-8 {
+    flex: none;
+    width: 66.6666666667%;
+  }
+  .col.is-offset-8, .col.tablet\:is-offset-8 {
+    margin-left: 66.6666666667%;
+  }
+  .col.is-9, .col.tablet\:is-9 {
+    flex: none;
+    width: 75%;
+  }
+  .col.is-offset-9, .col.tablet\:is-offset-9 {
+    margin-left: 75%;
+  }
+  .col.is-10, .col.tablet\:is-10 {
+    flex: none;
+    width: 83.3333333333%;
+  }
+  .col.is-offset-10, .col.tablet\:is-offset-10 {
+    margin-left: 83.3333333333%;
+  }
+  .col.is-11, .col.tablet\:is-11 {
+    flex: none;
+    width: 91.6666666667%;
+  }
+  .col.is-offset-11, .col.tablet\:is-offset-11 {
+    margin-left: 91.6666666667%;
+  }
+  .col.is-12, .col.tablet\:is-12 {
+    flex: none;
+    width: 100%;
+  }
+  .col.is-offset-12, .col.tablet\:is-offset-12 {
+    margin-left: 100%;
+  }
+}
+@media screen and (max-width: 1023px) {
+  .col.touch\:is-narrow {
+    flex: none;
+    width: unset;
+  }
+  .col.touch\:is-full {
+    flex: none;
+    width: 100%;
+  }
+  .col.touch\:is-three-quarters {
+    flex: none;
+    width: 75%;
+  }
+  .col.touch\:is-two-thirds {
+    flex: none;
+    width: 66.6666%;
+  }
+  .col.touch\:is-half {
+    flex: none;
+    width: 50%;
+  }
+  .col.touch\:is-one-third {
+    flex: none;
+    width: 33.3333%;
+  }
+  .col.touch\:is-one-quarter {
+    flex: none;
+    width: 25%;
+  }
+  .col.touch\:is-one-fifth {
+    flex: none;
+    width: 20%;
+  }
+  .col.touch\:is-two-fifths {
+    flex: none;
+    width: 40%;
+  }
+  .col.touch\:is-three-fifths {
+    flex: none;
+    width: 60%;
+  }
+  .col.touch\:is-four-fifths {
+    flex: none;
+    width: 80%;
+  }
+  .col.touch\:is-offset-three-quarters {
+    margin-left: 75%;
+  }
+  .col.touch\:is-offset-two-thirds {
+    margin-left: 66.6666%;
+  }
+  .col.touch\:is-offset-half {
+    margin-left: 50%;
+  }
+  .col.touch\:is-offset-one-third {
+    margin-left: 33.3333%;
+  }
+  .col.touch\:is-offset-one-quarter {
+    margin-left: 25%;
+  }
+  .col.touch\:is-offset-one-fifth {
+    margin-left: 20%;
+  }
+  .col.touch\:is-offset-two-fifths {
+    margin-left: 40%;
+  }
+  .col.touch\:is-offset-three-fifths {
+    margin-left: 60%;
+  }
+  .col.touch\:is-offset-four-fifths {
+    margin-left: 80%;
+  }
+  .col.touch\:is-0 {
+    flex: none;
+    width: 0%;
+  }
+  .col.touch\:is-offset-0 {
+    margin-left: 0%;
+  }
+  .col.touch\:is-1 {
+    flex: none;
+    width: 8.3333333333%;
+  }
+  .col.touch\:is-offset-1 {
+    margin-left: 8.3333333333%;
+  }
+  .col.touch\:is-2 {
+    flex: none;
+    width: 16.6666666667%;
+  }
+  .col.touch\:is-offset-2 {
+    margin-left: 16.6666666667%;
+  }
+  .col.touch\:is-3 {
+    flex: none;
+    width: 25%;
+  }
+  .col.touch\:is-offset-3 {
+    margin-left: 25%;
+  }
+  .col.touch\:is-4 {
+    flex: none;
+    width: 33.3333333333%;
+  }
+  .col.touch\:is-offset-4 {
+    margin-left: 33.3333333333%;
+  }
+  .col.touch\:is-5 {
+    flex: none;
+    width: 41.6666666667%;
+  }
+  .col.touch\:is-offset-5 {
+    margin-left: 41.6666666667%;
+  }
+  .col.touch\:is-6 {
+    flex: none;
+    width: 50%;
+  }
+  .col.touch\:is-offset-6 {
+    margin-left: 50%;
+  }
+  .col.touch\:is-7 {
+    flex: none;
+    width: 58.3333333333%;
+  }
+  .col.touch\:is-offset-7 {
+    margin-left: 58.3333333333%;
+  }
+  .col.touch\:is-8 {
+    flex: none;
+    width: 66.6666666667%;
+  }
+  .col.touch\:is-offset-8 {
+    margin-left: 66.6666666667%;
+  }
+  .col.touch\:is-9 {
+    flex: none;
+    width: 75%;
+  }
+  .col.touch\:is-offset-9 {
+    margin-left: 75%;
+  }
+  .col.touch\:is-10 {
+    flex: none;
+    width: 83.3333333333%;
+  }
+  .col.touch\:is-offset-10 {
+    margin-left: 83.3333333333%;
+  }
+  .col.touch\:is-11 {
+    flex: none;
+    width: 91.6666666667%;
+  }
+  .col.touch\:is-offset-11 {
+    margin-left: 91.6666666667%;
+  }
+  .col.touch\:is-12 {
+    flex: none;
+    width: 100%;
+  }
+  .col.touch\:is-offset-12 {
+    margin-left: 100%;
+  }
+}
+@media screen and (min-width: 1024px) {
+  .col.desktop\:is-narrow {
+    flex: none;
+    width: unset;
+  }
+  .col.desktop\:is-full {
+    flex: none;
+    width: 100%;
+  }
+  .col.desktop\:is-three-quarters {
+    flex: none;
+    width: 75%;
+  }
+  .col.desktop\:is-two-thirds {
+    flex: none;
+    width: 66.6666%;
+  }
+  .col.desktop\:is-half {
+    flex: none;
+    width: 50%;
+  }
+  .col.desktop\:is-one-third {
+    flex: none;
+    width: 33.3333%;
+  }
+  .col.desktop\:is-one-quarter {
+    flex: none;
+    width: 25%;
+  }
+  .col.desktop\:is-one-fifth {
+    flex: none;
+    width: 20%;
+  }
+  .col.desktop\:is-two-fifths {
+    flex: none;
+    width: 40%;
+  }
+  .col.desktop\:is-three-fifths {
+    flex: none;
+    width: 60%;
+  }
+  .col.desktop\:is-four-fifths {
+    flex: none;
+    width: 80%;
+  }
+  .col.desktop\:is-offset-three-quarters {
+    margin-left: 75%;
+  }
+  .col.desktop\:is-offset-two-thirds {
+    margin-left: 66.6666%;
+  }
+  .col.desktop\:is-offset-half {
+    margin-left: 50%;
+  }
+  .col.desktop\:is-offset-one-third {
+    margin-left: 33.3333%;
+  }
+  .col.desktop\:is-offset-one-quarter {
+    margin-left: 25%;
+  }
+  .col.desktop\:is-offset-one-fifth {
+    margin-left: 20%;
+  }
+  .col.desktop\:is-offset-two-fifths {
+    margin-left: 40%;
+  }
+  .col.desktop\:is-offset-three-fifths {
+    margin-left: 60%;
+  }
+  .col.desktop\:is-offset-four-fifths {
+    margin-left: 80%;
+  }
+  .col.desktop\:is-0 {
+    flex: none;
+    width: 0%;
+  }
+  .col.desktop\:is-offset-0 {
+    margin-left: 0%;
+  }
+  .col.desktop\:is-1 {
+    flex: none;
+    width: 8.3333333333%;
+  }
+  .col.desktop\:is-offset-1 {
+    margin-left: 8.3333333333%;
+  }
+  .col.desktop\:is-2 {
+    flex: none;
+    width: 16.6666666667%;
+  }
+  .col.desktop\:is-offset-2 {
+    margin-left: 16.6666666667%;
+  }
+  .col.desktop\:is-3 {
+    flex: none;
+    width: 25%;
+  }
+  .col.desktop\:is-offset-3 {
+    margin-left: 25%;
+  }
+  .col.desktop\:is-4 {
+    flex: none;
+    width: 33.3333333333%;
+  }
+  .col.desktop\:is-offset-4 {
+    margin-left: 33.3333333333%;
+  }
+  .col.desktop\:is-5 {
+    flex: none;
+    width: 41.6666666667%;
+  }
+  .col.desktop\:is-offset-5 {
+    margin-left: 41.6666666667%;
+  }
+  .col.desktop\:is-6 {
+    flex: none;
+    width: 50%;
+  }
+  .col.desktop\:is-offset-6 {
+    margin-left: 50%;
+  }
+  .col.desktop\:is-7 {
+    flex: none;
+    width: 58.3333333333%;
+  }
+  .col.desktop\:is-offset-7 {
+    margin-left: 58.3333333333%;
+  }
+  .col.desktop\:is-8 {
+    flex: none;
+    width: 66.6666666667%;
+  }
+  .col.desktop\:is-offset-8 {
+    margin-left: 66.6666666667%;
+  }
+  .col.desktop\:is-9 {
+    flex: none;
+    width: 75%;
+  }
+  .col.desktop\:is-offset-9 {
+    margin-left: 75%;
+  }
+  .col.desktop\:is-10 {
+    flex: none;
+    width: 83.3333333333%;
+  }
+  .col.desktop\:is-offset-10 {
+    margin-left: 83.3333333333%;
+  }
+  .col.desktop\:is-11 {
+    flex: none;
+    width: 91.6666666667%;
+  }
+  .col.desktop\:is-offset-11 {
+    margin-left: 91.6666666667%;
+  }
+  .col.desktop\:is-12 {
+    flex: none;
+    width: 100%;
+  }
+  .col.desktop\:is-offset-12 {
+    margin-left: 100%;
+  }
+}
+@media screen and (min-width: 1440px) {
+  .col.widescreen\:is-narrow {
+    flex: none;
+    width: unset;
+  }
+  .col.widescreen\:is-full {
+    flex: none;
+    width: 100%;
+  }
+  .col.widescreen\:is-three-quarters {
+    flex: none;
+    width: 75%;
+  }
+  .col.widescreen\:is-two-thirds {
+    flex: none;
+    width: 66.6666%;
+  }
+  .col.widescreen\:is-half {
+    flex: none;
+    width: 50%;
+  }
+  .col.widescreen\:is-one-third {
+    flex: none;
+    width: 33.3333%;
+  }
+  .col.widescreen\:is-one-quarter {
+    flex: none;
+    width: 25%;
+  }
+  .col.widescreen\:is-one-fifth {
+    flex: none;
+    width: 20%;
+  }
+  .col.widescreen\:is-two-fifths {
+    flex: none;
+    width: 40%;
+  }
+  .col.widescreen\:is-three-fifths {
+    flex: none;
+    width: 60%;
+  }
+  .col.widescreen\:is-four-fifths {
+    flex: none;
+    width: 80%;
+  }
+  .col.widescreen\:is-offset-three-quarters {
+    margin-left: 75%;
+  }
+  .col.widescreen\:is-offset-two-thirds {
+    margin-left: 66.6666%;
+  }
+  .col.widescreen\:is-offset-half {
+    margin-left: 50%;
+  }
+  .col.widescreen\:is-offset-one-third {
+    margin-left: 33.3333%;
+  }
+  .col.widescreen\:is-offset-one-quarter {
+    margin-left: 25%;
+  }
+  .col.widescreen\:is-offset-one-fifth {
+    margin-left: 20%;
+  }
+  .col.widescreen\:is-offset-two-fifths {
+    margin-left: 40%;
+  }
+  .col.widescreen\:is-offset-three-fifths {
+    margin-left: 60%;
+  }
+  .col.widescreen\:is-offset-four-fifths {
+    margin-left: 80%;
+  }
+  .col.widescreen\:is-0 {
+    flex: none;
+    width: 0%;
+  }
+  .col.widescreen\:is-offset-0 {
+    margin-left: 0%;
+  }
+  .col.widescreen\:is-1 {
+    flex: none;
+    width: 8.3333333333%;
+  }
+  .col.widescreen\:is-offset-1 {
+    margin-left: 8.3333333333%;
+  }
+  .col.widescreen\:is-2 {
+    flex: none;
+    width: 16.6666666667%;
+  }
+  .col.widescreen\:is-offset-2 {
+    margin-left: 16.6666666667%;
+  }
+  .col.widescreen\:is-3 {
+    flex: none;
+    width: 25%;
+  }
+  .col.widescreen\:is-offset-3 {
+    margin-left: 25%;
+  }
+  .col.widescreen\:is-4 {
+    flex: none;
+    width: 33.3333333333%;
+  }
+  .col.widescreen\:is-offset-4 {
+    margin-left: 33.3333333333%;
+  }
+  .col.widescreen\:is-5 {
+    flex: none;
+    width: 41.6666666667%;
+  }
+  .col.widescreen\:is-offset-5 {
+    margin-left: 41.6666666667%;
+  }
+  .col.widescreen\:is-6 {
+    flex: none;
+    width: 50%;
+  }
+  .col.widescreen\:is-offset-6 {
+    margin-left: 50%;
+  }
+  .col.widescreen\:is-7 {
+    flex: none;
+    width: 58.3333333333%;
+  }
+  .col.widescreen\:is-offset-7 {
+    margin-left: 58.3333333333%;
+  }
+  .col.widescreen\:is-8 {
+    flex: none;
+    width: 66.6666666667%;
+  }
+  .col.widescreen\:is-offset-8 {
+    margin-left: 66.6666666667%;
+  }
+  .col.widescreen\:is-9 {
+    flex: none;
+    width: 75%;
+  }
+  .col.widescreen\:is-offset-9 {
+    margin-left: 75%;
+  }
+  .col.widescreen\:is-10 {
+    flex: none;
+    width: 83.3333333333%;
+  }
+  .col.widescreen\:is-offset-10 {
+    margin-left: 83.3333333333%;
+  }
+  .col.widescreen\:is-11 {
+    flex: none;
+    width: 91.6666666667%;
+  }
+  .col.widescreen\:is-offset-11 {
+    margin-left: 91.6666666667%;
+  }
+  .col.widescreen\:is-12 {
+    flex: none;
+    width: 100%;
+  }
+  .col.widescreen\:is-offset-12 {
+    margin-left: 100%;
+  }
+}
+@media screen and (min-width: 1920px) {
+  .col.fullhd\:is-narrow {
+    flex: none;
+    width: unset;
+  }
+  .col.fullhd\:is-full {
+    flex: none;
+    width: 100%;
+  }
+  .col.fullhd\:is-three-quarters {
+    flex: none;
+    width: 75%;
+  }
+  .col.fullhd\:is-two-thirds {
+    flex: none;
+    width: 66.6666%;
+  }
+  .col.fullhd\:is-half {
+    flex: none;
+    width: 50%;
+  }
+  .col.fullhd\:is-one-third {
+    flex: none;
+    width: 33.3333%;
+  }
+  .col.fullhd\:is-one-quarter {
+    flex: none;
+    width: 25%;
+  }
+  .col.fullhd\:is-one-fifth {
+    flex: none;
+    width: 20%;
+  }
+  .col.fullhd\:is-two-fifths {
+    flex: none;
+    width: 40%;
+  }
+  .col.fullhd\:is-three-fifths {
+    flex: none;
+    width: 60%;
+  }
+  .col.fullhd\:is-four-fifths {
+    flex: none;
+    width: 80%;
+  }
+  .col.fullhd\:is-offset-three-quarters {
+    margin-left: 75%;
+  }
+  .col.fullhd\:is-offset-two-thirds {
+    margin-left: 66.6666%;
+  }
+  .col.fullhd\:is-offset-half {
+    margin-left: 50%;
+  }
+  .col.fullhd\:is-offset-one-third {
+    margin-left: 33.3333%;
+  }
+  .col.fullhd\:is-offset-one-quarter {
+    margin-left: 25%;
+  }
+  .col.fullhd\:is-offset-one-fifth {
+    margin-left: 20%;
+  }
+  .col.fullhd\:is-offset-two-fifths {
+    margin-left: 40%;
+  }
+  .col.fullhd\:is-offset-three-fifths {
+    margin-left: 60%;
+  }
+  .col.fullhd\:is-offset-four-fifths {
+    margin-left: 80%;
+  }
+  .col.fullhd\:is-0 {
+    flex: none;
+    width: 0%;
+  }
+  .col.fullhd\:is-offset-0 {
+    margin-left: 0%;
+  }
+  .col.fullhd\:is-1 {
+    flex: none;
+    width: 8.3333333333%;
+  }
+  .col.fullhd\:is-offset-1 {
+    margin-left: 8.3333333333%;
+  }
+  .col.fullhd\:is-2 {
+    flex: none;
+    width: 16.6666666667%;
+  }
+  .col.fullhd\:is-offset-2 {
+    margin-left: 16.6666666667%;
+  }
+  .col.fullhd\:is-3 {
+    flex: none;
+    width: 25%;
+  }
+  .col.fullhd\:is-offset-3 {
+    margin-left: 25%;
+  }
+  .col.fullhd\:is-4 {
+    flex: none;
+    width: 33.3333333333%;
+  }
+  .col.fullhd\:is-offset-4 {
+    margin-left: 33.3333333333%;
+  }
+  .col.fullhd\:is-5 {
+    flex: none;
+    width: 41.6666666667%;
+  }
+  .col.fullhd\:is-offset-5 {
+    margin-left: 41.6666666667%;
+  }
+  .col.fullhd\:is-6 {
+    flex: none;
+    width: 50%;
+  }
+  .col.fullhd\:is-offset-6 {
+    margin-left: 50%;
+  }
+  .col.fullhd\:is-7 {
+    flex: none;
+    width: 58.3333333333%;
+  }
+  .col.fullhd\:is-offset-7 {
+    margin-left: 58.3333333333%;
+  }
+  .col.fullhd\:is-8 {
+    flex: none;
+    width: 66.6666666667%;
+  }
+  .col.fullhd\:is-offset-8 {
+    margin-left: 66.6666666667%;
+  }
+  .col.fullhd\:is-9 {
+    flex: none;
+    width: 75%;
+  }
+  .col.fullhd\:is-offset-9 {
+    margin-left: 75%;
+  }
+  .col.fullhd\:is-10 {
+    flex: none;
+    width: 83.3333333333%;
+  }
+  .col.fullhd\:is-offset-10 {
+    margin-left: 83.3333333333%;
+  }
+  .col.fullhd\:is-11 {
+    flex: none;
+    width: 91.6666666667%;
+  }
+  .col.fullhd\:is-offset-11 {
+    margin-left: 91.6666666667%;
+  }
+  .col.fullhd\:is-12 {
+    flex: none;
+    width: 100%;
+  }
+  .col.fullhd\:is-offset-12 {
+    margin-left: 100%;
+  }
+}
+
+.grid {
+  margin-left: calc(var(--bal-column-gap) * -1);
+  margin-right: calc(var(--bal-column-gap) * -1);
+  margin-top: calc(var(--bal-column-gap) * -1);
+}
+.grid:last-child {
+  margin-bottom: calc(var(--bal-column-gap) * -1);
+}
+.grid:not(:last-child) {
+  margin-bottom: calc(1.5rem - var(--bal-column-gap));
+}
+.grid.is-centered {
+  justify-content: center;
+}
+.grid.is-gapless {
+  margin-left: 0;
+  margin-right: 0;
+  margin-top: 0;
+}
+.grid.is-gapless > .col {
+  margin: 0;
+  padding: 0 !important;
+}
+.grid.is-gapless:not(:last-child) {
+  margin-bottom: 1.5rem;
+}
+.grid.is-gapless:last-child {
+  margin-bottom: 0;
+}
+.grid.is-mobile {
+  display: flex;
+}
+.grid.is-multiline {
+  flex-wrap: wrap;
+}
+.grid.is-vcentered {
+  align-items: center;
+}
+@media screen and (min-width: 769px), print {
+  .grid:not(.is-desktop) {
+    display: flex;
+  }
+}
+@media screen and (min-width: 1024px) {
+  .grid.is-desktop {
+    display: flex;
+  }
+}
+/*# sourceMappingURL=/utilities/grid.css.map */