{"version":3,"sources":["webpack:///./packages/mdc-layout-grid/mdc-layout-grid.scss","webpack:///mdc-layout-grid.scss","webpack:///./packages/mdc-layout-grid/_mixins.scss"],"names":[],"mappings":";;;;;;;AAyBA;EAEI;EAIA;EAIA;EARA;EAIA;EAIA;EARA;EAIA;EAIA;ACzBJ;;AC0DI;EFzBJ;IE+DE;IACA;IACA,aF9Da;IEgEb;ED5FA;AACF;AC4CI;EFpBJ;IE+DE;IACA;IACA,aF9Da;IEgEb;EDpFA;AACF;AC+BI;EFfJ;IE+DE;IACA;IACA,aF9Da;IEgEb;ED5EA;AACF;;ACiCI;EFfJ;IEqEE;IACA;IACA;IACA;IAEA;EDnFA;ECqFA;IF5EF;ME6EI;MACA;MACA,cF3EW;ME6EX;MACA;IDnFA;EACF;AACF;ACSI;EFVJ;IEqEE;IACA;IACA;IACA;IAEA;EDjEA;ECmEA;IF5EF;ME6EI;MACA;MACA,cF3EW;ME6EX;MACA;IDjEA;EACF;AACF;ACdI;EFLJ;IEqEE;IACA;IACA;IACA;IAEA;ED/CA;ECiDA;IF5EF;ME6EI;MACA;MACA,cF3EW;ME6EX;MACA;ID/CA;EACF;AACF;;ACtBI;EFJJ;IE0BE;IAEA;IAyDA;IACA;IAEA;EDrDA;ECLA;IF9BF;ME+BI;MACA;IDQA;EACF;ECiDA;IF1FF;ME2FI;ID9CA;EACF;EDjCe;;IEaf;IAEA;EDuBA;ECrBA;IFjBe;;MEkBb;MACA;IDyBA;EACF;;ED7Ce;;IEaf;IAEA;EDoCA;EClCA;IFjBe;;MEkBb;MACA;IDsCA;EACF;;ED1De;;IEaf;IAEA;EDiDA;EC/CA;IFjBe;;MEkBb;MACA;IDmDA;EACF;;EDvEe;;IEaf;IAEA;ED8DA;EC5DA;IFjBe;;MEkBb;MACA;IDgEA;EACF;;EDpFe;;IEaf;IAEA;ED2EA;ECzEA;IFjBe;;MEkBb;MACA;ID6EA;EACF;;EDjGe;;IEaf;IAEA;EDwFA;ECtFA;IFjBe;;MEkBb;MACA;ID0FA;EACF;;ED9Ge;;IEaf;IAEA;EDqGA;ECnGA;IFjBe;;MEkBb;MACA;IDuGA;EACF;;ED3He;;IEaf;IAEA;EDkHA;EChHA;IFjBe;;MEkBb;MACA;IDoHA;EACF;;EDxIe;;IEaf;IAEA;ED+HA;EC7HA;IFjBe;;MEkBb;MACA;IDiIA;EACF;;EDrJe;;IEaf;IAEA;ED4IA;EC1IA;IFjBe;;MEkBb;MACA;ID8IA;EACF;;EDlKe;;IEaf;IAEA;EDyJA;ECvJA;IFjBe;;MEkBb;MACA;ID2JA;EACF;;ED/Ke;;IEaf;IAEA;EDsKA;ECpKA;IFjBe;;MEkBb;MACA;IDwKA;EACF;AACF;AC3MI;EFCJ;IE0BE;IAEA;IAyDA;IACA;IAEA;ED0HA;ECpLA;IF9BF;ME+BI;MACA;IDuLA;EACF;EC9HA;IF1FF;ME2FI;IDiIA;EACF;EDhNe;;IEaf;IAEA;EDsMA;ECpMA;IFjBe;;MEkBb;MACA;IDwMA;EACF;;ED5Ne;;IEaf;IAEA;EDmNA;ECjNA;IFjBe;;MEkBb;MACA;IDqNA;EACF;;EDzOe;;IEaf;IAEA;EDgOA;EC9NA;IFjBe;;MEkBb;MACA;IDkOA;EACF;;EDtPe;;IEaf;IAEA;ED6OA;EC3OA;IFjBe;;MEkBb;MACA;ID+OA;EACF;;EDnQe;;IEaf;IAEA;ED0PA;ECxPA;IFjBe;;MEkBb;MACA;ID4PA;EACF;;EDhRe;;IEaf;IAEA;EDuQA;ECrQA;IFjBe;;MEkBb;MACA;IDyQA;EACF;;ED7Re;;IEaf;IAEA;EDoRA;EClRA;IFjBe;;MEkBb;MACA;IDsRA;EACF;;ED1Se;;IEaf;IAEA;EDiSA;EC/RA;IFjBe;;MEkBb;MACA;IDmSA;EACF;;EDvTe;;IEaf;IAEA;ED8SA;EC5SA;IFjBe;;MEkBb;MACA;IDgTA;EACF;;EDpUe;;IEaf;IAEA;ED2TA;ECzTA;IFjBe;;MEkBb;MACA;ID6TA;EACF;;EDjVe;;IEaf;IAEA;EDwUA;ECtUA;IFjBe;;MEkBb;MACA;ID0UA;EACF;;ED9Ve;;IEaf;IAEA;EDqVA;ECnVA;IFjBe;;MEkBb;MACA;IDuVA;EACF;AACF;AC/XI;EFMJ;IE0BE;IAEA;IAyDA;IACA;IAEA;EDySA;ECnWA;IF9BF;ME+BI;MACA;IDsWA;EACF;EC7SA;IF1FF;ME2FI;IDgTA;EACF;ED/Xe;;IEaf;IAEA;EDqXA;ECnXA;IFjBe;;MEkBb;MACA;IDuXA;EACF;;ED3Ye;;IEaf;IAEA;EDkYA;EChYA;IFjBe;;MEkBb;MACA;IDoYA;EACF;;EDxZe;;IEaf;IAEA;ED+YA;EC7YA;IFjBe;;MEkBb;MACA;IDiZA;EACF;;EDrae;;IEaf;IAEA;ED4ZA;EC1ZA;IFjBe;;MEkBb;MACA;ID8ZA;EACF;;EDlbe;;IEaf;IAEA;EDyaA;ECvaA;IFjBe;;MEkBb;MACA;ID2aA;EACF;;ED/be;;IEaf;IAEA;EDsbA;ECpbA;IFjBe;;MEkBb;MACA;IDwbA;EACF;;ED5ce;;IEaf;IAEA;EDmcA;ECjcA;IFjBe;;MEkBb;MACA;IDqcA;EACF;;EDzde;;IEaf;IAEA;EDgdA;EC9cA;IFjBe;;MEkBb;MACA;IDkdA;EACF;;EDtee;;IEaf;IAEA;ED6dA;EC3dA;IFjBe;;MEkBb;MACA;ID+dA;EACF;;EDnfe;;IEaf;IAEA;ED0eA;ECxeA;IFjBe;;MEkBb;MACA;ID4eA;EACF;;EDhgBe;;IEaf;IAEA;EDufA;ECrfA;IFjBe;;MEkBb;MACA;IDyfA;EACF;;ED7gBe;;IEaf;IAEA;EDogBA;EClgBA;IFjBe;;MEkBb;MACA;IDsgBA;EACF;AACF;ADhhBI;EEwEF,QFzEa;ACohBf;ADnhBI;EEwEF,QFzEa;ACuhBf;ADthBI;EEwEF,QFzEa;AC0hBf;ADzhBI;EEwEF,QFzEa;AC6hBf;AD5hBI;EEwEF,QFzEa;ACgiBf;AD/hBI;EEwEF,QFzEa;ACmiBf;ADliBI;EEwEF,QFzEa;ACsiBf;ADriBI;EEwEF,QFzEa;ACyiBf;ADxiBI;EEwEF,QFzEa;AC4iBf;AD3iBI;EEwEF,SFzEa;AC+iBf;AD9iBI;EEwEF,SFzEa;ACkjBf;ADjjBI;EEwEF,SFzEa;ACqjBf;AD9iBE;EEuEE;AD0eJ;ACxeI;EFzEF;IE0EI;ED2eJ;AACF;ADljBE;EE2EE;AD0eJ;ADjjBE;EE2EE;ADyeJ;ACveI;EF7EF;IE8EI;ED0eJ;AACF;;AC3lBI;EFuCJ;IE2FE;IAGA;;;;GAAA;EDgeA;AACF;AC3mBI;EF4CJ;IE2FE;IAGA;;;;GAAA;ED0eA;AACF;AC1nBI;EFiDJ;IE2FE;IAGA;;;;GAAA;EDofA;AACF;;ADlkBA;EACE;EACA;ACqkBF;;ADlkBA;EACE;EACA;ACqkBF,C","file":"mdc.layout-grid.css","sourcesContent":["// Copyright 2017 Google Inc.\n//\n// Permission is hereby granted, free of charge, to any person obtaining a copy\n// of this software and associated documentation files (the \"Software\"), to deal\n// in the Software without restriction, including without limitation the rights\n// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n// copies of the Software, and to permit persons to whom the Software is\n// furnished to do so, subject to the following conditions:\n//\n// The above copyright notice and this permission notice shall be included in\n// all copies or substantial portions of the Software.\n//\n// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n// THE SOFTWARE.\n\n@use 'sass:list';\n@use 'sass:map';\n@use './variables';\n@use './mixins';\n\n:root {\n  @each $size in map.keys(variables.$columns) {\n    --mdc-layout-grid-margin-#{$size}: #{map.get(\n        variables.$default-margin,\n        $size\n      )};\n    --mdc-layout-grid-gutter-#{$size}: #{map.get(\n        variables.$default-gutter,\n        $size\n      )};\n    --mdc-layout-grid-column-width-#{$size}: #{map.get(\n        variables.$column-width,\n        $size\n      )};\n  }\n}\n\n// postcss-bem-linter: define layout-grid\n.mdc-layout-grid {\n  @each $size in map.keys(variables.$columns) {\n    @include mixins.media-query_($size) {\n      $margin: map.get(variables.$default-margin, $size);\n\n      @include mixins.layout-grid($size, $margin, variables.$max-width);\n    }\n  }\n}\n\n.mdc-layout-grid__inner {\n  @each $size in map.keys(variables.$columns) {\n    @include mixins.media-query_($size) {\n      $margin: map.get(variables.$default-margin, $size);\n      $gutter: map.get(variables.$default-gutter, $size);\n\n      @include mixins.inner($size, $margin, $gutter);\n    }\n  }\n}\n\n.mdc-layout-grid__cell {\n  // select the upper breakpoint\n  $upper-breakpoint: list.nth(map.keys(variables.$columns), 1);\n\n  @each $size in map.keys(variables.$columns) {\n    @include mixins.media-query_($size) {\n      $gutter: map.get(variables.$default-gutter, $size);\n\n      @include mixins.cell($size, variables.$default-column-span, $gutter);\n\n      @for $span from 1 through map.get(variables.$columns, $upper-breakpoint) {\n        // Span classes.\n        // stylelint-disable max-nesting-depth\n        @at-root .mdc-layout-grid__cell--span-#{$span},\n          .mdc-layout-grid__cell--span-#{$span}-#{$size} {\n          @include mixins.cell-span_($size, $span, $gutter);\n        }\n        // stylelint-enable max-nesting-depth\n      }\n    }\n  }\n\n  // Order override classes.\n  @for $i from 1 through map.get(variables.$columns, $upper-breakpoint) {\n    &--order-#{$i} {\n      @include mixins.cell-order($i);\n    }\n  }\n\n  // Alignment classes.\n  &--align-top {\n    @include mixins.cell-align(top);\n  }\n\n  &--align-middle {\n    @include mixins.cell-align(middle);\n  }\n\n  &--align-bottom {\n    @include mixins.cell-align(bottom);\n  }\n}\n\n.mdc-layout-grid--fixed-column-width {\n  @each $size in map.keys(variables.$columns) {\n    @include mixins.media-query_($size) {\n      $margin: map.get(variables.$default-margin, $size);\n      $gutter: map.get(variables.$default-gutter, $size);\n      $column-width: map.get(variables.$column-width, $size);\n\n      @include mixins.fixed-column-width(\n        $size,\n        $margin,\n        $gutter,\n        $column-width\n      );\n    }\n  }\n}\n\n.mdc-layout-grid--align-left {\n  margin-right: auto;\n  margin-left: 0;\n}\n\n.mdc-layout-grid--align-right {\n  margin-right: 0;\n  margin-left: auto;\n}\n// postcss-bem-linter: end\n",":root {\n  --mdc-layout-grid-margin-desktop: 24px;\n  --mdc-layout-grid-gutter-desktop: 24px;\n  --mdc-layout-grid-column-width-desktop: 72px;\n  --mdc-layout-grid-margin-tablet: 16px;\n  --mdc-layout-grid-gutter-tablet: 16px;\n  --mdc-layout-grid-column-width-tablet: 72px;\n  --mdc-layout-grid-margin-phone: 16px;\n  --mdc-layout-grid-gutter-phone: 16px;\n  --mdc-layout-grid-column-width-phone: 72px;\n}\n\n@media (min-width: 840px) {\n  .mdc-layout-grid {\n    box-sizing: border-box;\n    margin: 0 auto;\n    padding: 24px;\n    padding: var(--mdc-layout-grid-margin-desktop, 24px);\n  }\n}\n@media (min-width: 600px) and (max-width: 839px) {\n  .mdc-layout-grid {\n    box-sizing: border-box;\n    margin: 0 auto;\n    padding: 16px;\n    padding: var(--mdc-layout-grid-margin-tablet, 16px);\n  }\n}\n@media (max-width: 599px) {\n  .mdc-layout-grid {\n    box-sizing: border-box;\n    margin: 0 auto;\n    padding: 16px;\n    padding: var(--mdc-layout-grid-margin-phone, 16px);\n  }\n}\n\n@media (min-width: 840px) {\n  .mdc-layout-grid__inner {\n    display: flex;\n    flex-flow: row wrap;\n    align-items: stretch;\n    margin: -12px;\n    margin: calc(var(--mdc-layout-grid-gutter-desktop, 24px) / 2 * -1);\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__inner {\n      display: grid;\n      margin: 0;\n      grid-gap: 24px;\n      grid-gap: var(--mdc-layout-grid-gutter-desktop, 24px);\n      grid-template-columns: repeat(12, minmax(0, 1fr));\n    }\n  }\n}\n@media (min-width: 600px) and (max-width: 839px) {\n  .mdc-layout-grid__inner {\n    display: flex;\n    flex-flow: row wrap;\n    align-items: stretch;\n    margin: -8px;\n    margin: calc(var(--mdc-layout-grid-gutter-tablet, 16px) / 2 * -1);\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__inner {\n      display: grid;\n      margin: 0;\n      grid-gap: 16px;\n      grid-gap: var(--mdc-layout-grid-gutter-tablet, 16px);\n      grid-template-columns: repeat(8, minmax(0, 1fr));\n    }\n  }\n}\n@media (max-width: 599px) {\n  .mdc-layout-grid__inner {\n    display: flex;\n    flex-flow: row wrap;\n    align-items: stretch;\n    margin: -8px;\n    margin: calc(var(--mdc-layout-grid-gutter-phone, 16px) / 2 * -1);\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__inner {\n      display: grid;\n      margin: 0;\n      grid-gap: 16px;\n      grid-gap: var(--mdc-layout-grid-gutter-phone, 16px);\n      grid-template-columns: repeat(4, minmax(0, 1fr));\n    }\n  }\n}\n\n@media (min-width: 840px) {\n  .mdc-layout-grid__cell {\n    width: calc(33.3333333333% - 24px);\n    width: calc(33.3333333333% - var(--mdc-layout-grid-gutter-desktop, 24px));\n    box-sizing: border-box;\n    margin: 12px;\n    margin: calc(var(--mdc-layout-grid-gutter-desktop, 24px) / 2);\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell {\n      width: auto;\n      grid-column-end: span 4;\n    }\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell {\n      margin: 0;\n    }\n  }\n  .mdc-layout-grid__cell--span-1,\n.mdc-layout-grid__cell--span-1-desktop {\n    width: calc(8.3333333333% - 24px);\n    width: calc(8.3333333333% - var(--mdc-layout-grid-gutter-desktop, 24px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-1,\n.mdc-layout-grid__cell--span-1-desktop {\n      width: auto;\n      grid-column-end: span 1;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-2,\n.mdc-layout-grid__cell--span-2-desktop {\n    width: calc(16.6666666667% - 24px);\n    width: calc(16.6666666667% - var(--mdc-layout-grid-gutter-desktop, 24px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-2,\n.mdc-layout-grid__cell--span-2-desktop {\n      width: auto;\n      grid-column-end: span 2;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-3,\n.mdc-layout-grid__cell--span-3-desktop {\n    width: calc(25% - 24px);\n    width: calc(25% - var(--mdc-layout-grid-gutter-desktop, 24px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-3,\n.mdc-layout-grid__cell--span-3-desktop {\n      width: auto;\n      grid-column-end: span 3;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-4,\n.mdc-layout-grid__cell--span-4-desktop {\n    width: calc(33.3333333333% - 24px);\n    width: calc(33.3333333333% - var(--mdc-layout-grid-gutter-desktop, 24px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-4,\n.mdc-layout-grid__cell--span-4-desktop {\n      width: auto;\n      grid-column-end: span 4;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-5,\n.mdc-layout-grid__cell--span-5-desktop {\n    width: calc(41.6666666667% - 24px);\n    width: calc(41.6666666667% - var(--mdc-layout-grid-gutter-desktop, 24px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-5,\n.mdc-layout-grid__cell--span-5-desktop {\n      width: auto;\n      grid-column-end: span 5;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-6,\n.mdc-layout-grid__cell--span-6-desktop {\n    width: calc(50% - 24px);\n    width: calc(50% - var(--mdc-layout-grid-gutter-desktop, 24px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-6,\n.mdc-layout-grid__cell--span-6-desktop {\n      width: auto;\n      grid-column-end: span 6;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-7,\n.mdc-layout-grid__cell--span-7-desktop {\n    width: calc(58.3333333333% - 24px);\n    width: calc(58.3333333333% - var(--mdc-layout-grid-gutter-desktop, 24px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-7,\n.mdc-layout-grid__cell--span-7-desktop {\n      width: auto;\n      grid-column-end: span 7;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-8,\n.mdc-layout-grid__cell--span-8-desktop {\n    width: calc(66.6666666667% - 24px);\n    width: calc(66.6666666667% - var(--mdc-layout-grid-gutter-desktop, 24px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-8,\n.mdc-layout-grid__cell--span-8-desktop {\n      width: auto;\n      grid-column-end: span 8;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-9,\n.mdc-layout-grid__cell--span-9-desktop {\n    width: calc(75% - 24px);\n    width: calc(75% - var(--mdc-layout-grid-gutter-desktop, 24px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-9,\n.mdc-layout-grid__cell--span-9-desktop {\n      width: auto;\n      grid-column-end: span 9;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-10,\n.mdc-layout-grid__cell--span-10-desktop {\n    width: calc(83.3333333333% - 24px);\n    width: calc(83.3333333333% - var(--mdc-layout-grid-gutter-desktop, 24px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-10,\n.mdc-layout-grid__cell--span-10-desktop {\n      width: auto;\n      grid-column-end: span 10;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-11,\n.mdc-layout-grid__cell--span-11-desktop {\n    width: calc(91.6666666667% - 24px);\n    width: calc(91.6666666667% - var(--mdc-layout-grid-gutter-desktop, 24px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-11,\n.mdc-layout-grid__cell--span-11-desktop {\n      width: auto;\n      grid-column-end: span 11;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-12,\n.mdc-layout-grid__cell--span-12-desktop {\n    width: calc(100% - 24px);\n    width: calc(100% - var(--mdc-layout-grid-gutter-desktop, 24px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-12,\n.mdc-layout-grid__cell--span-12-desktop {\n      width: auto;\n      grid-column-end: span 12;\n    }\n  }\n}\n@media (min-width: 600px) and (max-width: 839px) {\n  .mdc-layout-grid__cell {\n    width: calc(50% - 16px);\n    width: calc(50% - var(--mdc-layout-grid-gutter-tablet, 16px));\n    box-sizing: border-box;\n    margin: 8px;\n    margin: calc(var(--mdc-layout-grid-gutter-tablet, 16px) / 2);\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell {\n      width: auto;\n      grid-column-end: span 4;\n    }\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell {\n      margin: 0;\n    }\n  }\n  .mdc-layout-grid__cell--span-1,\n.mdc-layout-grid__cell--span-1-tablet {\n    width: calc(12.5% - 16px);\n    width: calc(12.5% - var(--mdc-layout-grid-gutter-tablet, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-1,\n.mdc-layout-grid__cell--span-1-tablet {\n      width: auto;\n      grid-column-end: span 1;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-2,\n.mdc-layout-grid__cell--span-2-tablet {\n    width: calc(25% - 16px);\n    width: calc(25% - var(--mdc-layout-grid-gutter-tablet, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-2,\n.mdc-layout-grid__cell--span-2-tablet {\n      width: auto;\n      grid-column-end: span 2;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-3,\n.mdc-layout-grid__cell--span-3-tablet {\n    width: calc(37.5% - 16px);\n    width: calc(37.5% - var(--mdc-layout-grid-gutter-tablet, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-3,\n.mdc-layout-grid__cell--span-3-tablet {\n      width: auto;\n      grid-column-end: span 3;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-4,\n.mdc-layout-grid__cell--span-4-tablet {\n    width: calc(50% - 16px);\n    width: calc(50% - var(--mdc-layout-grid-gutter-tablet, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-4,\n.mdc-layout-grid__cell--span-4-tablet {\n      width: auto;\n      grid-column-end: span 4;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-5,\n.mdc-layout-grid__cell--span-5-tablet {\n    width: calc(62.5% - 16px);\n    width: calc(62.5% - var(--mdc-layout-grid-gutter-tablet, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-5,\n.mdc-layout-grid__cell--span-5-tablet {\n      width: auto;\n      grid-column-end: span 5;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-6,\n.mdc-layout-grid__cell--span-6-tablet {\n    width: calc(75% - 16px);\n    width: calc(75% - var(--mdc-layout-grid-gutter-tablet, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-6,\n.mdc-layout-grid__cell--span-6-tablet {\n      width: auto;\n      grid-column-end: span 6;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-7,\n.mdc-layout-grid__cell--span-7-tablet {\n    width: calc(87.5% - 16px);\n    width: calc(87.5% - var(--mdc-layout-grid-gutter-tablet, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-7,\n.mdc-layout-grid__cell--span-7-tablet {\n      width: auto;\n      grid-column-end: span 7;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-8,\n.mdc-layout-grid__cell--span-8-tablet {\n    width: calc(100% - 16px);\n    width: calc(100% - var(--mdc-layout-grid-gutter-tablet, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-8,\n.mdc-layout-grid__cell--span-8-tablet {\n      width: auto;\n      grid-column-end: span 8;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-9,\n.mdc-layout-grid__cell--span-9-tablet {\n    width: calc(100% - 16px);\n    width: calc(100% - var(--mdc-layout-grid-gutter-tablet, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-9,\n.mdc-layout-grid__cell--span-9-tablet {\n      width: auto;\n      grid-column-end: span 8;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-10,\n.mdc-layout-grid__cell--span-10-tablet {\n    width: calc(100% - 16px);\n    width: calc(100% - var(--mdc-layout-grid-gutter-tablet, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-10,\n.mdc-layout-grid__cell--span-10-tablet {\n      width: auto;\n      grid-column-end: span 8;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-11,\n.mdc-layout-grid__cell--span-11-tablet {\n    width: calc(100% - 16px);\n    width: calc(100% - var(--mdc-layout-grid-gutter-tablet, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-11,\n.mdc-layout-grid__cell--span-11-tablet {\n      width: auto;\n      grid-column-end: span 8;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-12,\n.mdc-layout-grid__cell--span-12-tablet {\n    width: calc(100% - 16px);\n    width: calc(100% - var(--mdc-layout-grid-gutter-tablet, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-12,\n.mdc-layout-grid__cell--span-12-tablet {\n      width: auto;\n      grid-column-end: span 8;\n    }\n  }\n}\n@media (max-width: 599px) {\n  .mdc-layout-grid__cell {\n    width: calc(100% - 16px);\n    width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px));\n    box-sizing: border-box;\n    margin: 8px;\n    margin: calc(var(--mdc-layout-grid-gutter-phone, 16px) / 2);\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell {\n      width: auto;\n      grid-column-end: span 4;\n    }\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell {\n      margin: 0;\n    }\n  }\n  .mdc-layout-grid__cell--span-1,\n.mdc-layout-grid__cell--span-1-phone {\n    width: calc(25% - 16px);\n    width: calc(25% - var(--mdc-layout-grid-gutter-phone, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-1,\n.mdc-layout-grid__cell--span-1-phone {\n      width: auto;\n      grid-column-end: span 1;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-2,\n.mdc-layout-grid__cell--span-2-phone {\n    width: calc(50% - 16px);\n    width: calc(50% - var(--mdc-layout-grid-gutter-phone, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-2,\n.mdc-layout-grid__cell--span-2-phone {\n      width: auto;\n      grid-column-end: span 2;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-3,\n.mdc-layout-grid__cell--span-3-phone {\n    width: calc(75% - 16px);\n    width: calc(75% - var(--mdc-layout-grid-gutter-phone, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-3,\n.mdc-layout-grid__cell--span-3-phone {\n      width: auto;\n      grid-column-end: span 3;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-4,\n.mdc-layout-grid__cell--span-4-phone {\n    width: calc(100% - 16px);\n    width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-4,\n.mdc-layout-grid__cell--span-4-phone {\n      width: auto;\n      grid-column-end: span 4;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-5,\n.mdc-layout-grid__cell--span-5-phone {\n    width: calc(100% - 16px);\n    width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-5,\n.mdc-layout-grid__cell--span-5-phone {\n      width: auto;\n      grid-column-end: span 4;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-6,\n.mdc-layout-grid__cell--span-6-phone {\n    width: calc(100% - 16px);\n    width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-6,\n.mdc-layout-grid__cell--span-6-phone {\n      width: auto;\n      grid-column-end: span 4;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-7,\n.mdc-layout-grid__cell--span-7-phone {\n    width: calc(100% - 16px);\n    width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-7,\n.mdc-layout-grid__cell--span-7-phone {\n      width: auto;\n      grid-column-end: span 4;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-8,\n.mdc-layout-grid__cell--span-8-phone {\n    width: calc(100% - 16px);\n    width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-8,\n.mdc-layout-grid__cell--span-8-phone {\n      width: auto;\n      grid-column-end: span 4;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-9,\n.mdc-layout-grid__cell--span-9-phone {\n    width: calc(100% - 16px);\n    width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-9,\n.mdc-layout-grid__cell--span-9-phone {\n      width: auto;\n      grid-column-end: span 4;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-10,\n.mdc-layout-grid__cell--span-10-phone {\n    width: calc(100% - 16px);\n    width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-10,\n.mdc-layout-grid__cell--span-10-phone {\n      width: auto;\n      grid-column-end: span 4;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-11,\n.mdc-layout-grid__cell--span-11-phone {\n    width: calc(100% - 16px);\n    width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-11,\n.mdc-layout-grid__cell--span-11-phone {\n      width: auto;\n      grid-column-end: span 4;\n    }\n  }\n\n  .mdc-layout-grid__cell--span-12,\n.mdc-layout-grid__cell--span-12-phone {\n    width: calc(100% - 16px);\n    width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px));\n  }\n  @supports (display: grid) {\n    .mdc-layout-grid__cell--span-12,\n.mdc-layout-grid__cell--span-12-phone {\n      width: auto;\n      grid-column-end: span 4;\n    }\n  }\n}\n.mdc-layout-grid__cell--order-1 {\n  order: 1;\n}\n.mdc-layout-grid__cell--order-2 {\n  order: 2;\n}\n.mdc-layout-grid__cell--order-3 {\n  order: 3;\n}\n.mdc-layout-grid__cell--order-4 {\n  order: 4;\n}\n.mdc-layout-grid__cell--order-5 {\n  order: 5;\n}\n.mdc-layout-grid__cell--order-6 {\n  order: 6;\n}\n.mdc-layout-grid__cell--order-7 {\n  order: 7;\n}\n.mdc-layout-grid__cell--order-8 {\n  order: 8;\n}\n.mdc-layout-grid__cell--order-9 {\n  order: 9;\n}\n.mdc-layout-grid__cell--order-10 {\n  order: 10;\n}\n.mdc-layout-grid__cell--order-11 {\n  order: 11;\n}\n.mdc-layout-grid__cell--order-12 {\n  order: 12;\n}\n.mdc-layout-grid__cell--align-top {\n  align-self: flex-start;\n}\n@supports (display: grid) {\n  .mdc-layout-grid__cell--align-top {\n    align-self: start;\n  }\n}\n.mdc-layout-grid__cell--align-middle {\n  align-self: center;\n}\n.mdc-layout-grid__cell--align-bottom {\n  align-self: flex-end;\n}\n@supports (display: grid) {\n  .mdc-layout-grid__cell--align-bottom {\n    align-self: end;\n  }\n}\n\n@media (min-width: 840px) {\n  .mdc-layout-grid--fixed-column-width {\n    width: 1176px;\n    width: calc(\n    var(--mdc-layout-grid-column-width-desktop, 72px) * 12 +\n      var(--mdc-layout-grid-gutter-desktop, 24px) * 11 +\n      var(--mdc-layout-grid-margin-desktop, 24px) * 2\n  );\n  }\n}\n@media (min-width: 600px) and (max-width: 839px) {\n  .mdc-layout-grid--fixed-column-width {\n    width: 720px;\n    width: calc(\n    var(--mdc-layout-grid-column-width-tablet, 72px) * 8 +\n      var(--mdc-layout-grid-gutter-tablet, 16px) * 7 +\n      var(--mdc-layout-grid-margin-tablet, 16px) * 2\n  );\n  }\n}\n@media (max-width: 599px) {\n  .mdc-layout-grid--fixed-column-width {\n    width: 368px;\n    width: calc(\n    var(--mdc-layout-grid-column-width-phone, 72px) * 4 +\n      var(--mdc-layout-grid-gutter-phone, 16px) * 3 +\n      var(--mdc-layout-grid-margin-phone, 16px) * 2\n  );\n  }\n}\n\n.mdc-layout-grid--align-left {\n  margin-right: auto;\n  margin-left: 0;\n}\n\n.mdc-layout-grid--align-right {\n  margin-right: 0;\n  margin-left: auto;\n}","// Copyright 2017 Google Inc.\n//\n// Permission is hereby granted, free of charge, to any person obtaining a copy\n// of this software and associated documentation files (the \"Software\"), to deal\n// in the Software without restriction, including without limitation the rights\n// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n// copies of the Software, and to permit persons to whom the Software is\n// furnished to do so, subject to the following conditions:\n//\n// The above copyright notice and this permission notice shall be included in\n// all copies or substantial portions of the Software.\n//\n// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n// THE SOFTWARE.\n\n@use 'sass:list';\n@use 'sass:map';\n@use 'sass:math';\n@use './variables';\n\n// returns the lower grid boundary or null if the smallest grid is selected\n@function breakpoint-min($size) {\n  @if not map.has-key(variables.$columns, $size) {\n    @error \"Invalid style specified! Choose one of #{map.keys(variables.$columns)}\";\n  }\n  $min: map.get(variables.$breakpoints, $size);\n\n  @return if($min > 0, $min, null);\n}\n\n// returns the upper grid boundary or null if the largest grid is selected\n@function breakpoint-max($size) {\n  @if not map.has-key(variables.$columns, $size) {\n    @error \"Invalid style specified! Choose one of #{map.keys(variables.$columns)}\";\n  }\n  $names: map.keys(variables.$columns);\n  $n: list.index($names, $size);\n  $prev: if($n > 1, list.nth($names, $n - 1), null);\n\n  @return if($prev, (breakpoint-min($prev) - 1px), null);\n}\n\n// Private mixins, meant for internal use.\n@mixin media-query_($size) {\n  @if not map.has-key(variables.$columns, $size) {\n    @error \"Invalid style specified! Choose one of #{map.keys(variables.$columns)}\";\n  }\n\n  $min: breakpoint-min($size);\n  $max: breakpoint-max($size);\n\n  @if $min == null and $max != null {\n    // Phone\n    @media (max-width: $max) {\n      @content;\n    }\n  } @else if $min != null and $max != null {\n    // Tablet\n    @media (min-width: $min) and (max-width: $max) {\n      @content;\n    }\n  } @else if $min != null and $max == null {\n    // Desktop\n    @media (min-width: $min) {\n      @content;\n    }\n  } @else {\n    // Fallback - no breakpoints defined\n    @content;\n  }\n}\n\n@mixin cell-span_($size, $span, $gutter) {\n  @if not map.has-key(variables.$columns, $size) {\n    @error \"Invalid style specified! Choose one of #{map.keys(variables.$columns)}\";\n  }\n\n  $percent: math.percentage(\n    math.div($span, map.get(variables.$columns, $size))\n  );\n\n  @if $percent > 100% {\n    $percent: 100%;\n  }\n\n  width: calc(#{$percent} - #{$gutter});\n  // stylelint-disable-next-line declaration-block-no-duplicate-properties\n  width: calc(#{$percent} - var(--mdc-layout-grid-gutter-#{$size}, #{$gutter}));\n\n  @supports (display: grid) {\n    width: auto;\n    grid-column-end: span math.min($span, map.get(variables.$columns, $size));\n  }\n}\n\n// Public mixins, meant for developer usage.\n@mixin layout-grid($size, $margin, $max-width: null) {\n  @if not map.has-key(variables.$columns, $size) {\n    @error \"Invalid style specified! Choose one of #{map.keys(variables.$columns)}\";\n  }\n\n  box-sizing: border-box;\n  margin: 0 auto;\n  padding: $margin;\n  // stylelint-disable-next-line declaration-block-no-duplicate-properties\n  padding: var(--mdc-layout-grid-margin-#{$size}, #{$margin});\n\n  @if $max-width {\n    max-width: $max-width;\n  }\n}\n\n@mixin inner($size, $margin, $gutter) {\n  @if not map.has-key(variables.$columns, $size) {\n    @error \"Invalid style specified! Choose one of #{map.keys(variables.$columns)}\";\n  }\n\n  display: flex;\n  flex-flow: row wrap;\n  align-items: stretch;\n  margin: math.div(-$gutter, 2);\n  // stylelint-disable-next-line declaration-block-no-duplicate-properties\n  margin: calc(var(--mdc-layout-grid-gutter-#{$size}, #{$gutter}) / 2 * -1);\n\n  @supports (display: grid) {\n    display: grid;\n    margin: 0;\n    grid-gap: $gutter;\n    // stylelint-disable-next-line declaration-block-no-duplicate-properties\n    grid-gap: var(--mdc-layout-grid-gutter-#{$size}, $gutter);\n    grid-template-columns: repeat(\n      map.get(variables.$columns, $size),\n      minmax(0, 1fr)\n    );\n  }\n}\n\n@mixin cell($size, $default-span, $gutter) {\n  @if not map.has-key(variables.$columns, $size) {\n    @error \"Invalid style specified! Choose one of #{map.keys(variables.$columns)}\";\n  }\n\n  @include cell-span_($size, $default-span, $gutter);\n\n  box-sizing: border-box;\n  margin: math.div($gutter, 2);\n  // stylelint-disable-next-line declaration-block-no-duplicate-properties\n  margin: calc(var(--mdc-layout-grid-gutter-#{$size}, #{$gutter}) / 2);\n\n  @supports (display: grid) {\n    margin: 0;\n  }\n}\n\n@mixin cell-order($order) {\n  order: $order;\n}\n\n@mixin cell-align($position) {\n  @if $position == 'top' {\n    align-self: flex-start;\n\n    @supports (display: grid) {\n      align-self: start;\n    }\n  }\n\n  @if $position == 'middle' {\n    align-self: center;\n  }\n\n  @if $position == 'bottom' {\n    align-self: flex-end;\n\n    @supports (display: grid) {\n      align-self: end;\n    }\n  }\n\n  @if $position == 'stretch' {\n    align-self: stretch;\n  }\n}\n\n@mixin fixed-column-width($size, $margin, $gutter, $column-width) {\n  @if not map.has-key(variables.$columns, $size) {\n    @error \"Invalid style specified! Choose one of #{map.keys(variables.$columns)}\";\n  }\n\n  $columnCount: map.get(variables.$columns, $size);\n  $gutter-number: $columnCount - 1;\n  $margin-number: 2;\n\n  width: $column-width * $columnCount + $gutter * $gutter-number + $margin *\n    $margin-number;\n  // stylelint-disable-next-line declaration-block-no-duplicate-properties\n  width: calc(\n    var(--mdc-layout-grid-column-width-#{$size}, #{$column-width}) * #{$columnCount} +\n      var(--mdc-layout-grid-gutter-#{$size}, #{$gutter}) * #{$gutter-number} +\n      var(--mdc-layout-grid-margin-#{$size}, #{$margin}) * #{$margin-number}\n  );\n}\n"],"sourceRoot":""}