/*--------------------------------------------------------------
  # Layouts
  --------------------------------------------------------------*/
  /*------- Layout that centers vertically and horizontally --------*/
  .layout-center-content {
	display: flex;
	align-items: center;
	justify-content: center;
  }
  
  /*------- Grid of cards. requires grid class --------*/
  .layout-cards-7 > * {
	grid-column: span 4;
  }
  .layout-cards-7 > * .hide-on-small-card {
	display: none;
  }
  .layout-cards-7 > *:nth-child(7n-3),
  .layout-cards-7 > *:nth-child(7n-6) {
	grid-column: span 8;
  }
  .layout-cards-7 > *:nth-child(7n-3) .hide-on-small-card,
  .layout-cards-7 > *:nth-child(7n-6) .hide-on-small-card {
	display: block;
  }
  
  @media all and (-ms-high-contrast: none) {
	.layout-cards-7 > * {
	  width: calc(33.333% - 30px);
	  width: calc(33.333% - var(--gap));
	}
	.layout-cards-7 > * .hide-on-small-card {
	  display: none;
	}
	.layout-cards-7 > *:nth-child(7n-3),
  .layout-cards-7 > *:nth-child(7n-6) {
	  width: calc(66.66666% - 30px);
	  width: calc(66.66666% - var(--gap));
	}
	.layout-cards-7 > *:nth-child(7n-3) .hide-on-small-card,
  .layout-cards-7 > *:nth-child(7n-6) .hide-on-small-card {
	  display: block;
	}
  }

  
  /*--------------------------------------------------------------
  # CARD GRIDS
  --------------------------------------------------------------*/
  /*------- Grid Layouts --------*/
  /*
  - Simple Responsive grid of equal sized items
  - Create your own responsive grid!
  - Add @include grid($min-size-of-items);
  - The default min size is 350
  - Items grow if there is room to grow, or fall to next row fi there isnt.
   */
  .card-grid {
	display: grid;
	--card-min: 250px;
	--card-max: 1fr;
	--card-type: auto-fit;
	grid-template-columns: repeat(var(--card-type), minmax(min(var(--card-min), 100%), var(--card-max)));
	grid-gap: 30px;
	grid-gap: var(--grid-gap);
	justify-content: center;
  }
  @media all and (-ms-high-contrast: none) {
	.card-grid {
	  display: flex;
	  flex-wrap: wrap;
	}
	.card-grid > * {
	  flex-grow: 1;
	  flex-shrink: 1;
	  flex-basis: 0;
	  min-width: calc(320px);
	  margin: 15px;
	  margin-top: 0;
	  margin-bottom: 30px;
	}
	.card-grid.no-gutters {
	  margin-left: 0;
	  margin-right: 0;
	}
	.card-grid.no-gutters > * {
	  margin: 0;
	}
	.conainer .card-grid, .container-fluid .card-grid, .container-content .card-grid {
	  margin-left: calc(-1 * 30px);
	  margin-left: calc(-1 * var(--gap));
	  margin-right: calc(-1 * 30px);
	  margin-right: calc(-1 * var(--gap));
	}
	.conainer .card-grid.no-gutters, .container-fluid .card-grid.no-gutters, .container-content .card-grid.no-gutters {
	  margin-left: 0;
	  margin-right: 0;
	}
  }
  
  .card-grid-fill {
	display: grid;
	--card-min: 250px;
	--card-max: 1fr;
	--card-type: auto-fill;
	grid-template-columns: repeat(var(--card-type), minmax(min(var(--card-min), 100%), var(--card-max)));
	grid-gap: 30px;
	grid-gap: var(--grid-gap);
	justify-content: center;
  }
  @media all and (-ms-high-contrast: none) {
	.card-grid-fill {
	  display: flex;
	  flex-wrap: wrap;
	}
	.card-grid-fill > * {
	  flex-grow: 1;
	  flex-shrink: 1;
	  flex-basis: 0;
	  min-width: calc(320px);
	  margin: 15px;
	  margin-top: 0;
	  margin-bottom: 30px;
	}
	.card-grid-fill.no-gutters {
	  margin-left: 0;
	  margin-right: 0;
	}
	.card-grid-fill.no-gutters > * {
	  margin: 0;
	}
	.conainer .card-grid-fill, .container-fluid .card-grid-fill, .container-content .card-grid-fill {
	  margin-left: calc(-1 * 30px);
	  margin-left: calc(-1 * var(--gap));
	  margin-right: calc(-1 * 30px);
	  margin-right: calc(-1 * var(--gap));
	}
	.conainer .card-grid-fill.no-gutters, .container-fluid .card-grid-fill.no-gutters, .container-content .card-grid-fill.no-gutters {
	  margin-left: 0;
	  margin-right: 0;
	}
  }
  
  .flex-card-grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-left: -15px;
	margin-right: -15px;
  }
  .flex-card-grid > * {
	flex-grow: 1;
	flex-shrink: 1;
	flex-basis: calc(320px);
	margin: 0 15px 30px 15px;
  }
  .flex-card-grid.no-gutters {
	margin-left: 0;
	margin-right: 0;
  }
  .flex-card-grid.no-gutters > * {
	margin: 0;
  }
  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	.flex-card-grid > * {
	  flex-basis: auto;
	  min-width: calc(320px);
	}
  }
  
  /*--------------------------------------------------------------
  # 12 Column CSS Grids
  --------------------------------------------------------------*/
  .no-gutters {
	grid-gap: 0;
  }
  
  .grid {
	display: grid;
	grid-template-columns: repeat(12, minmax(1px, 1fr));
	grid-gap: min(30px, calc(100%/12));
	grid-gap: min(var(--grid-gap), calc(100%/12));
  }
  div .grid .span-1, .grid.span-all-1 > * {
	grid-column: span 1;
  }
  div .grid .span-2, .grid.span-all-2 > * {
	grid-column: span 2;
  }
  div .grid .span-3, .grid.span-all-3 > * {
	grid-column: span 3;
  }
  div .grid .span-4, .grid.span-all-4 > * {
	grid-column: span 4;
  }
  div .grid .span-5, .grid.span-all-5 > * {
	grid-column: span 5;
  }
  div .grid .span-6, .grid.span-all-6 > * {
	grid-column: span 6;
  }
  div .grid .span-7, .grid.span-all-7 > * {
	grid-column: span 7;
  }
  div .grid .span-8, .grid.span-all-8 > * {
	grid-column: span 8;
  }
  div .grid .span-9, .grid.span-all-9 > * {
	grid-column: span 9;
  }
  div .grid .span-10, .grid.span-all-10 > * {
	grid-column: span 10;
  }
  div .grid .span-11, .grid.span-all-11 > * {
	grid-column: span 11;
  }
  div .grid .span-12, .grid.span-all-12 > * {
	grid-column: span 12;
  }
  
  .span-full {
	grid-column: 1/-1;
	flex-basis: 100%;
  }
  
  /*------- Overriding spans at media sizes --------*/
  @media (max-width: 1200px) {
	div .grid > .container-span-1, .grid.container-span-all-1 > * {
	  grid-column: span 1;
	}
	div .grid > .container-span-2, .grid.container-span-all-2 > * {
	  grid-column: span 2;
	}
	div .grid > .container-span-3, .grid.container-span-all-3 > * {
	  grid-column: span 3;
	}
	div .grid > .container-span-4, .grid.container-span-all-4 > * {
	  grid-column: span 4;
	}
	div .grid > .container-span-5, .grid.container-span-all-5 > * {
	  grid-column: span 5;
	}
	div .grid > .container-span-6, .grid.container-span-all-6 > * {
	  grid-column: span 6;
	}
	div .grid > .container-span-7, .grid.container-span-all-7 > * {
	  grid-column: span 7;
	}
	div .grid > .container-span-8, .grid.container-span-all-8 > * {
	  grid-column: span 8;
	}
	div .grid > .container-span-9, .grid.container-span-all-9 > * {
	  grid-column: span 9;
	}
	div .grid > .container-span-10, .grid.container-span-all-10 > * {
	  grid-column: span 10;
	}
	div .grid > .container-span-11, .grid.container-span-all-11 > * {
	  grid-column: span 11;
	}
	div .grid > .container-span-12, .grid.container-span-all-12 > * {
	  grid-column: span 12;
	}
  }
  @media (max-width: 1030px) {
	div .grid > .large-span-1, .grid.large-span-all-1 > * {
	  grid-column: span 1;
	}
	div .grid > .large-span-2, .grid.large-span-all-2 > * {
	  grid-column: span 2;
	}
	div .grid > .large-span-3, .grid.large-span-all-3 > * {
	  grid-column: span 3;
	}
	div .grid > .large-span-4, .grid.large-span-all-4 > * {
	  grid-column: span 4;
	}
	div .grid > .large-span-5, .grid.large-span-all-5 > * {
	  grid-column: span 5;
	}
	div .grid > .large-span-6, .grid.large-span-all-6 > * {
	  grid-column: span 6;
	}
	div .grid > .large-span-7, .grid.large-span-all-7 > * {
	  grid-column: span 7;
	}
	div .grid > .large-span-8, .grid.large-span-all-8 > * {
	  grid-column: span 8;
	}
	div .grid > .large-span-9, .grid.large-span-all-9 > * {
	  grid-column: span 9;
	}
	div .grid > .large-span-10, .grid.large-span-all-10 > * {
	  grid-column: span 10;
	}
	div .grid > .large-span-11, .grid.large-span-all-11 > * {
	  grid-column: span 11;
	}
	div .grid > .large-span-12, .grid.large-span-all-12 > * {
	  grid-column: span 12;
	}
  }
  @media (max-width: 768px) {
	div .grid > .medium-span-1, .grid.medium-span-all-1 > * {
	  grid-column: span 1;
	}
	div .grid > .medium-span-2, .grid.medium-span-all-2 > * {
	  grid-column: span 2;
	}
	div .grid > .medium-span-3, .grid.medium-span-all-3 > * {
	  grid-column: span 3;
	}
	div .grid > .medium-span-4, .grid.medium-span-all-4 > * {
	  grid-column: span 4;
	}
	div .grid > .medium-span-5, .grid.medium-span-all-5 > * {
	  grid-column: span 5;
	}
	div .grid > .medium-span-6, .grid.medium-span-all-6 > * {
	  grid-column: span 6;
	}
	div .grid > .medium-span-7, .grid.medium-span-all-7 > * {
	  grid-column: span 7;
	}
	div .grid > .medium-span-8, .grid.medium-span-all-8 > * {
	  grid-column: span 8;
	}
	div .grid > .medium-span-9, .grid.medium-span-all-9 > * {
	  grid-column: span 9;
	}
	div .grid > .medium-span-10, .grid.medium-span-all-10 > * {
	  grid-column: span 10;
	}
	div .grid > .medium-span-11, .grid.medium-span-all-11 > * {
	  grid-column: span 11;
	}
	div .grid > .medium-span-12, .grid.medium-span-all-12 > * {
	  grid-column: span 12;
	}
  }
  @media (max-width: 576px) {
	div.site .grid > * {
	  grid-column: 1/-1;
	}
	div .grid > .small-span-1, div .grid.small-span-all-1 > * {
	  grid-column: span 1;
	}
	div .grid > .small-span-2, div .grid.small-span-all-2 > * {
	  grid-column: span 2;
	}
	div .grid > .small-span-3, div .grid.small-span-all-3 > * {
	  grid-column: span 3;
	}
	div .grid > .small-span-4, div .grid.small-span-all-4 > * {
	  grid-column: span 4;
	}
	div .grid > .small-span-5, div .grid.small-span-all-5 > * {
	  grid-column: span 5;
	}
	div .grid > .small-span-6, div .grid.small-span-all-6 > * {
	  grid-column: span 6;
	}
	div .grid > .small-span-7, div .grid.small-span-all-7 > * {
	  grid-column: span 7;
	}
	div .grid > .small-span-8, div .grid.small-span-all-8 > * {
	  grid-column: span 8;
	}
	div .grid > .small-span-9, div .grid.small-span-all-9 > * {
	  grid-column: span 9;
	}
	div .grid > .small-span-10, div .grid.small-span-all-10 > * {
	  grid-column: span 10;
	}
	div .grid > .small-span-11, div .grid.small-span-all-11 > * {
	  grid-column: span 11;
	}
	div .grid > .small-span-12, div .grid.small-span-all-12 > * {
	  grid-column: span 12;
	}
  }
  
  /*--------------------------------------------------------------
  # Flexbox grids. 99% same as css grid
  --------------------------------------------------------------*/
  .container.flex:not(.no-gutters),
  .container-fluid.flex:not(.no-gutters),
  .container-content.flex:not(.no-gutters) {
	padding: 0 calc(30px / 2);
	padding: 0 calc(var(--container-padding) / 2);
	margin: auto;
  }
  .container.flex.no-gutters,
  .container-fluid.flex.no-gutters,
  .container-content.flex.no-gutters {
	margin: auto;
  }
  
  .container-left.flex:not(.no-gutters) {
	padding-right: calc(30px / 2);
	padding-right: calc(var(--container-padding) / 2);
	margin: 0 auto 0 0;
  }
  .container-left.flex.no-gutters {
	margin: 0 auto 0 0;
  }
  
  .container-right.flex:not(.no-gutters) {
	padding-left: calc(30px / 2);
	padding-left: calc(var(--container-padding) / 2);
	margin: 0 0 0 auto;
  }
  .container-right.flex.no-gutters {
	margin: 0 0 0 auto;
  }
  
  /*--------------------------------------------------------------
  # Flex grid
  --------------------------------------------------------------*/
  .flex,
  .flex-grid {
	display: flex;
	margin-left: calc(-1 * calc(30px / 2));
	margin-left: calc(-1 * var(--flex-gap));
	margin-right: calc(-1 * calc(30px / 2));
	margin-right: calc(-1 * var(--flex-gap));
  }
  .flex > *,
  .flex-grid > * {
	margin-right: calc(30px / 2);
	margin-right: var(--flex-gap);
	margin-left: calc(30px / 2);
	margin-left: var(--flex-gap);
	flex: 1;
  }
  .flex > .no-gutters,
  .flex-grid > .no-gutters {
	margin-left: 0;
	margin-right: 0;
  }
  div .flex .span-1, .flex.span-all-1 > *,
  div .flex-grid .span-1,
  .flex-grid.span-all-1 > * {
	flex-basis: calc(8.3333333333% - 30px);
	flex-basis: calc(8.3333333333% - var(--grid-gap));
  }
  div .flex > .span-1,
  div .flex-grid > .span-1 {
	flex-grow: 0;
	flex-shrink: 0;
  }
  div .flex .span-2, .flex.span-all-2 > *,
  div .flex-grid .span-2,
  .flex-grid.span-all-2 > * {
	flex-basis: calc(16.6666666667% - 30px);
	flex-basis: calc(16.6666666667% - var(--grid-gap));
  }
  div .flex > .span-2,
  div .flex-grid > .span-2 {
	flex-grow: 0;
	flex-shrink: 0;
  }
  div .flex .span-3, .flex.span-all-3 > *,
  div .flex-grid .span-3,
  .flex-grid.span-all-3 > * {
	flex-basis: calc(25% - 30px);
	flex-basis: calc(25% - var(--grid-gap));
  }
  div .flex > .span-3,
  div .flex-grid > .span-3 {
	flex-grow: 0;
	flex-shrink: 0;
  }
  div .flex .span-4, .flex.span-all-4 > *,
  div .flex-grid .span-4,
  .flex-grid.span-all-4 > * {
	flex-basis: calc(33.3333333333% - 30px);
	flex-basis: calc(33.3333333333% - var(--grid-gap));
  }
  div .flex > .span-4,
  div .flex-grid > .span-4 {
	flex-grow: 0;
	flex-shrink: 0;
  }
  div .flex .span-5, .flex.span-all-5 > *,
  div .flex-grid .span-5,
  .flex-grid.span-all-5 > * {
	flex-basis: calc(41.6666666667% - 30px);
	flex-basis: calc(41.6666666667% - var(--grid-gap));
  }
  div .flex > .span-5,
  div .flex-grid > .span-5 {
	flex-grow: 0;
	flex-shrink: 0;
  }
  div .flex .span-6, .flex.span-all-6 > *,
  div .flex-grid .span-6,
  .flex-grid.span-all-6 > * {
	flex-basis: calc(50% - 30px);
	flex-basis: calc(50% - var(--grid-gap));
  }
  div .flex > .span-6,
  div .flex-grid > .span-6 {
	flex-grow: 0;
	flex-shrink: 0;
  }
  div .flex .span-7, .flex.span-all-7 > *,
  div .flex-grid .span-7,
  .flex-grid.span-all-7 > * {
	flex-basis: calc(58.3333333333% - 30px);
	flex-basis: calc(58.3333333333% - var(--grid-gap));
  }
  div .flex > .span-7,
  div .flex-grid > .span-7 {
	flex-grow: 0;
	flex-shrink: 0;
  }
  div .flex .span-8, .flex.span-all-8 > *,
  div .flex-grid .span-8,
  .flex-grid.span-all-8 > * {
	flex-basis: calc(66.6666666667% - 30px);
	flex-basis: calc(66.6666666667% - var(--grid-gap));
  }
  div .flex > .span-8,
  div .flex-grid > .span-8 {
	flex-grow: 0;
	flex-shrink: 0;
  }
  div .flex .span-9, .flex.span-all-9 > *,
  div .flex-grid .span-9,
  .flex-grid.span-all-9 > * {
	flex-basis: calc(75% - 30px);
	flex-basis: calc(75% - var(--grid-gap));
  }
  div .flex > .span-9,
  div .flex-grid > .span-9 {
	flex-grow: 0;
	flex-shrink: 0;
  }
  div .flex .span-10, .flex.span-all-10 > *,
  div .flex-grid .span-10,
  .flex-grid.span-all-10 > * {
	flex-basis: calc(83.3333333333% - 30px);
	flex-basis: calc(83.3333333333% - var(--grid-gap));
  }
  div .flex > .span-10,
  div .flex-grid > .span-10 {
	flex-grow: 0;
	flex-shrink: 0;
  }
  div .flex .span-11, .flex.span-all-11 > *,
  div .flex-grid .span-11,
  .flex-grid.span-all-11 > * {
	flex-basis: calc(91.6666666667% - 30px);
	flex-basis: calc(91.6666666667% - var(--grid-gap));
  }
  div .flex > .span-11,
  div .flex-grid > .span-11 {
	flex-grow: 0;
	flex-shrink: 0;
  }
  div .flex .span-12, .flex.span-all-12 > *,
  div .flex-grid .span-12,
  .flex-grid.span-all-12 > * {
	flex-basis: calc(100% - 30px);
	flex-basis: calc(100% - var(--grid-gap));
  }
  div .flex > .span-12,
  div .flex-grid > .span-12 {
	flex-grow: 0;
	flex-shrink: 0;
  }
  .flex.no-gutters,
  .flex-grid.no-gutters {
	margin-left: 0;
	margin-right: 0;
  }
  .flex.no-gutters > *,
  .flex-grid.no-gutters > * {
	margin: 0;
	--grid-gap: 0px;
  }
  
  .flex-grid {
	flex-wrap: wrap;
  }
  .flex-grid > * {
	margin-bottom: 30px;
	margin-bottom: var(--grid-gap);
  }
  
  #page .no-wrap {
	flex-wrap: nowrap;
  }
  
  /*------- Span sizes for flexbox grids --------*/
  @media (max-width: 1200px) {
	div .flex-grid > .container-span-1, .flex-grid.container-span-all-1 > *,
  div .flex > .container-span-1,
  .flex.container-span-all-1 > * {
	  flex-basis: calc(8.3333333333% - 30px);
	  flex-basis: calc(8.3333333333% - var(--grid-gap));
	}
	div .flex-grid > .container-span-1,
  div .flex > .container-span-1 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .container-span-2, .flex-grid.container-span-all-2 > *,
  div .flex > .container-span-2,
  .flex.container-span-all-2 > * {
	  flex-basis: calc(16.6666666667% - 30px);
	  flex-basis: calc(16.6666666667% - var(--grid-gap));
	}
	div .flex-grid > .container-span-2,
  div .flex > .container-span-2 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .container-span-3, .flex-grid.container-span-all-3 > *,
  div .flex > .container-span-3,
  .flex.container-span-all-3 > * {
	  flex-basis: calc(25% - 30px);
	  flex-basis: calc(25% - var(--grid-gap));
	}
	div .flex-grid > .container-span-3,
  div .flex > .container-span-3 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .container-span-4, .flex-grid.container-span-all-4 > *,
  div .flex > .container-span-4,
  .flex.container-span-all-4 > * {
	  flex-basis: calc(33.3333333333% - 30px);
	  flex-basis: calc(33.3333333333% - var(--grid-gap));
	}
	div .flex-grid > .container-span-4,
  div .flex > .container-span-4 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .container-span-5, .flex-grid.container-span-all-5 > *,
  div .flex > .container-span-5,
  .flex.container-span-all-5 > * {
	  flex-basis: calc(41.6666666667% - 30px);
	  flex-basis: calc(41.6666666667% - var(--grid-gap));
	}
	div .flex-grid > .container-span-5,
  div .flex > .container-span-5 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .container-span-6, .flex-grid.container-span-all-6 > *,
  div .flex > .container-span-6,
  .flex.container-span-all-6 > * {
	  flex-basis: calc(50% - 30px);
	  flex-basis: calc(50% - var(--grid-gap));
	}
	div .flex-grid > .container-span-6,
  div .flex > .container-span-6 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .container-span-7, .flex-grid.container-span-all-7 > *,
  div .flex > .container-span-7,
  .flex.container-span-all-7 > * {
	  flex-basis: calc(58.3333333333% - 30px);
	  flex-basis: calc(58.3333333333% - var(--grid-gap));
	}
	div .flex-grid > .container-span-7,
  div .flex > .container-span-7 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .container-span-8, .flex-grid.container-span-all-8 > *,
  div .flex > .container-span-8,
  .flex.container-span-all-8 > * {
	  flex-basis: calc(66.6666666667% - 30px);
	  flex-basis: calc(66.6666666667% - var(--grid-gap));
	}
	div .flex-grid > .container-span-8,
  div .flex > .container-span-8 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .container-span-9, .flex-grid.container-span-all-9 > *,
  div .flex > .container-span-9,
  .flex.container-span-all-9 > * {
	  flex-basis: calc(75% - 30px);
	  flex-basis: calc(75% - var(--grid-gap));
	}
	div .flex-grid > .container-span-9,
  div .flex > .container-span-9 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .container-span-10, .flex-grid.container-span-all-10 > *,
  div .flex > .container-span-10,
  .flex.container-span-all-10 > * {
	  flex-basis: calc(83.3333333333% - 30px);
	  flex-basis: calc(83.3333333333% - var(--grid-gap));
	}
	div .flex-grid > .container-span-10,
  div .flex > .container-span-10 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .container-span-11, .flex-grid.container-span-all-11 > *,
  div .flex > .container-span-11,
  .flex.container-span-all-11 > * {
	  flex-basis: calc(91.6666666667% - 30px);
	  flex-basis: calc(91.6666666667% - var(--grid-gap));
	}
	div .flex-grid > .container-span-11,
  div .flex > .container-span-11 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .container-span-12, .flex-grid.container-span-all-12 > *,
  div .flex > .container-span-12,
  .flex.container-span-all-12 > * {
	  flex-basis: calc(100% - 30px);
	  flex-basis: calc(100% - var(--grid-gap));
	}
	div .flex-grid > .container-span-12,
  div .flex > .container-span-12 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
  }
  @media (max-width: 1030px) {
	div .flex-grid > .large-span-1, .flex-grid.large-span-all-1 > *,
  div .flex > .large-span-1,
  .flex.large-span-all-1 > * {
	  flex-basis: calc(8.3333333333% - 30px);
	  flex-basis: calc(8.3333333333% - var(--grid-gap));
	}
	div .flex-grid > .large-span-1,
  div .flex > .large-span-1 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .large-span-2, .flex-grid.large-span-all-2 > *,
  div .flex > .large-span-2,
  .flex.large-span-all-2 > * {
	  flex-basis: calc(16.6666666667% - 30px);
	  flex-basis: calc(16.6666666667% - var(--grid-gap));
	}
	div .flex-grid > .large-span-2,
  div .flex > .large-span-2 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .large-span-3, .flex-grid.large-span-all-3 > *,
  div .flex > .large-span-3,
  .flex.large-span-all-3 > * {
	  flex-basis: calc(25% - 30px);
	  flex-basis: calc(25% - var(--grid-gap));
	}
	div .flex-grid > .large-span-3,
  div .flex > .large-span-3 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .large-span-4, .flex-grid.large-span-all-4 > *,
  div .flex > .large-span-4,
  .flex.large-span-all-4 > * {
	  flex-basis: calc(33.3333333333% - 30px);
	  flex-basis: calc(33.3333333333% - var(--grid-gap));
	}
	div .flex-grid > .large-span-4,
  div .flex > .large-span-4 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .large-span-5, .flex-grid.large-span-all-5 > *,
  div .flex > .large-span-5,
  .flex.large-span-all-5 > * {
	  flex-basis: calc(41.6666666667% - 30px);
	  flex-basis: calc(41.6666666667% - var(--grid-gap));
	}
	div .flex-grid > .large-span-5,
  div .flex > .large-span-5 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .large-span-6, .flex-grid.large-span-all-6 > *,
  div .flex > .large-span-6,
  .flex.large-span-all-6 > * {
	  flex-basis: calc(50% - 30px);
	  flex-basis: calc(50% - var(--grid-gap));
	}
	div .flex-grid > .large-span-6,
  div .flex > .large-span-6 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .large-span-7, .flex-grid.large-span-all-7 > *,
  div .flex > .large-span-7,
  .flex.large-span-all-7 > * {
	  flex-basis: calc(58.3333333333% - 30px);
	  flex-basis: calc(58.3333333333% - var(--grid-gap));
	}
	div .flex-grid > .large-span-7,
  div .flex > .large-span-7 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .large-span-8, .flex-grid.large-span-all-8 > *,
  div .flex > .large-span-8,
  .flex.large-span-all-8 > * {
	  flex-basis: calc(66.6666666667% - 30px);
	  flex-basis: calc(66.6666666667% - var(--grid-gap));
	}
	div .flex-grid > .large-span-8,
  div .flex > .large-span-8 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .large-span-9, .flex-grid.large-span-all-9 > *,
  div .flex > .large-span-9,
  .flex.large-span-all-9 > * {
	  flex-basis: calc(75% - 30px);
	  flex-basis: calc(75% - var(--grid-gap));
	}
	div .flex-grid > .large-span-9,
  div .flex > .large-span-9 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .large-span-10, .flex-grid.large-span-all-10 > *,
  div .flex > .large-span-10,
  .flex.large-span-all-10 > * {
	  flex-basis: calc(83.3333333333% - 30px);
	  flex-basis: calc(83.3333333333% - var(--grid-gap));
	}
	div .flex-grid > .large-span-10,
  div .flex > .large-span-10 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .large-span-11, .flex-grid.large-span-all-11 > *,
  div .flex > .large-span-11,
  .flex.large-span-all-11 > * {
	  flex-basis: calc(91.6666666667% - 30px);
	  flex-basis: calc(91.6666666667% - var(--grid-gap));
	}
	div .flex-grid > .large-span-11,
  div .flex > .large-span-11 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .large-span-12, .flex-grid.large-span-all-12 > *,
  div .flex > .large-span-12,
  .flex.large-span-all-12 > * {
	  flex-basis: calc(100% - 30px);
	  flex-basis: calc(100% - var(--grid-gap));
	}
	div .flex-grid > .large-span-12,
  div .flex > .large-span-12 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
  }
  @media (max-width: 768px) {
	div .flex-grid > .medium-span-1, .flex-grid.medium-span-all-1 > *,
  div .flex > .medium-span-1,
  .flex.medium-span-all-1 > * {
	  flex-basis: calc(8.3333333333% - 30px);
	  flex-basis: calc(8.3333333333% - var(--grid-gap));
	}
	div .flex-grid > .medium-span-1,
  div .flex > .medium-span-1 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .medium-span-2, .flex-grid.medium-span-all-2 > *,
  div .flex > .medium-span-2,
  .flex.medium-span-all-2 > * {
	  flex-basis: calc(16.6666666667% - 30px);
	  flex-basis: calc(16.6666666667% - var(--grid-gap));
	}
	div .flex-grid > .medium-span-2,
  div .flex > .medium-span-2 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .medium-span-3, .flex-grid.medium-span-all-3 > *,
  div .flex > .medium-span-3,
  .flex.medium-span-all-3 > * {
	  flex-basis: calc(25% - 30px);
	  flex-basis: calc(25% - var(--grid-gap));
	}
	div .flex-grid > .medium-span-3,
  div .flex > .medium-span-3 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .medium-span-4, .flex-grid.medium-span-all-4 > *,
  div .flex > .medium-span-4,
  .flex.medium-span-all-4 > * {
	  flex-basis: calc(33.3333333333% - 30px);
	  flex-basis: calc(33.3333333333% - var(--grid-gap));
	}
	div .flex-grid > .medium-span-4,
  div .flex > .medium-span-4 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .medium-span-5, .flex-grid.medium-span-all-5 > *,
  div .flex > .medium-span-5,
  .flex.medium-span-all-5 > * {
	  flex-basis: calc(41.6666666667% - 30px);
	  flex-basis: calc(41.6666666667% - var(--grid-gap));
	}
	div .flex-grid > .medium-span-5,
  div .flex > .medium-span-5 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .medium-span-6, .flex-grid.medium-span-all-6 > *,
  div .flex > .medium-span-6,
  .flex.medium-span-all-6 > * {
	  flex-basis: calc(50% - 30px);
	  flex-basis: calc(50% - var(--grid-gap));
	}
	div .flex-grid > .medium-span-6,
  div .flex > .medium-span-6 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .medium-span-7, .flex-grid.medium-span-all-7 > *,
  div .flex > .medium-span-7,
  .flex.medium-span-all-7 > * {
	  flex-basis: calc(58.3333333333% - 30px);
	  flex-basis: calc(58.3333333333% - var(--grid-gap));
	}
	div .flex-grid > .medium-span-7,
  div .flex > .medium-span-7 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .medium-span-8, .flex-grid.medium-span-all-8 > *,
  div .flex > .medium-span-8,
  .flex.medium-span-all-8 > * {
	  flex-basis: calc(66.6666666667% - 30px);
	  flex-basis: calc(66.6666666667% - var(--grid-gap));
	}
	div .flex-grid > .medium-span-8,
  div .flex > .medium-span-8 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .medium-span-9, .flex-grid.medium-span-all-9 > *,
  div .flex > .medium-span-9,
  .flex.medium-span-all-9 > * {
	  flex-basis: calc(75% - 30px);
	  flex-basis: calc(75% - var(--grid-gap));
	}
	div .flex-grid > .medium-span-9,
  div .flex > .medium-span-9 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .medium-span-10, .flex-grid.medium-span-all-10 > *,
  div .flex > .medium-span-10,
  .flex.medium-span-all-10 > * {
	  flex-basis: calc(83.3333333333% - 30px);
	  flex-basis: calc(83.3333333333% - var(--grid-gap));
	}
	div .flex-grid > .medium-span-10,
  div .flex > .medium-span-10 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .medium-span-11, .flex-grid.medium-span-all-11 > *,
  div .flex > .medium-span-11,
  .flex.medium-span-all-11 > * {
	  flex-basis: calc(91.6666666667% - 30px);
	  flex-basis: calc(91.6666666667% - var(--grid-gap));
	}
	div .flex-grid > .medium-span-11,
  div .flex > .medium-span-11 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .medium-span-12, .flex-grid.medium-span-all-12 > *,
  div .flex > .medium-span-12,
  .flex.medium-span-all-12 > * {
	  flex-basis: calc(100% - 30px);
	  flex-basis: calc(100% - var(--grid-gap));
	}
	div .flex-grid > .medium-span-12,
  div .flex > .medium-span-12 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
  }
  @media (max-width: 576px) {
	.flex-grid,
  .flex {
	  flex-wrap: wrap;
	}
	div.site .flex-grid > *,
  div.site .flex > * {
	  flex-basis: calc(100% - 30px);
	  flex-basis: calc(100% - var(--grid-gap));
	}
	div .flex-grid > .small-span-1, div .flex-grid.small-span-all-1 > *,
  div .flex > .small-span-1,
  div .flex.small-span-all-1 > * {
	  flex-basis: calc(8.3333333333% - 30px);
	  flex-basis: calc(8.3333333333% - var(--grid-gap));
	}
	div .flex-grid > .small-span-1,
  div .flex > .small-span-1 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .small-span-2, div .flex-grid.small-span-all-2 > *,
  div .flex > .small-span-2,
  div .flex.small-span-all-2 > * {
	  flex-basis: calc(16.6666666667% - 30px);
	  flex-basis: calc(16.6666666667% - var(--grid-gap));
	}
	div .flex-grid > .small-span-2,
  div .flex > .small-span-2 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .small-span-3, div .flex-grid.small-span-all-3 > *,
  div .flex > .small-span-3,
  div .flex.small-span-all-3 > * {
	  flex-basis: calc(25% - 30px);
	  flex-basis: calc(25% - var(--grid-gap));
	}
	div .flex-grid > .small-span-3,
  div .flex > .small-span-3 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .small-span-4, div .flex-grid.small-span-all-4 > *,
  div .flex > .small-span-4,
  div .flex.small-span-all-4 > * {
	  flex-basis: calc(33.3333333333% - 30px);
	  flex-basis: calc(33.3333333333% - var(--grid-gap));
	}
	div .flex-grid > .small-span-4,
  div .flex > .small-span-4 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .small-span-5, div .flex-grid.small-span-all-5 > *,
  div .flex > .small-span-5,
  div .flex.small-span-all-5 > * {
	  flex-basis: calc(41.6666666667% - 30px);
	  flex-basis: calc(41.6666666667% - var(--grid-gap));
	}
	div .flex-grid > .small-span-5,
  div .flex > .small-span-5 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .small-span-6, div .flex-grid.small-span-all-6 > *,
  div .flex > .small-span-6,
  div .flex.small-span-all-6 > * {
	  flex-basis: calc(50% - 30px);
	  flex-basis: calc(50% - var(--grid-gap));
	}
	div .flex-grid > .small-span-6,
  div .flex > .small-span-6 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .small-span-7, div .flex-grid.small-span-all-7 > *,
  div .flex > .small-span-7,
  div .flex.small-span-all-7 > * {
	  flex-basis: calc(58.3333333333% - 30px);
	  flex-basis: calc(58.3333333333% - var(--grid-gap));
	}
	div .flex-grid > .small-span-7,
  div .flex > .small-span-7 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .small-span-8, div .flex-grid.small-span-all-8 > *,
  div .flex > .small-span-8,
  div .flex.small-span-all-8 > * {
	  flex-basis: calc(66.6666666667% - 30px);
	  flex-basis: calc(66.6666666667% - var(--grid-gap));
	}
	div .flex-grid > .small-span-8,
  div .flex > .small-span-8 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .small-span-9, div .flex-grid.small-span-all-9 > *,
  div .flex > .small-span-9,
  div .flex.small-span-all-9 > * {
	  flex-basis: calc(75% - 30px);
	  flex-basis: calc(75% - var(--grid-gap));
	}
	div .flex-grid > .small-span-9,
  div .flex > .small-span-9 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .small-span-10, div .flex-grid.small-span-all-10 > *,
  div .flex > .small-span-10,
  div .flex.small-span-all-10 > * {
	  flex-basis: calc(83.3333333333% - 30px);
	  flex-basis: calc(83.3333333333% - var(--grid-gap));
	}
	div .flex-grid > .small-span-10,
  div .flex > .small-span-10 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .small-span-11, div .flex-grid.small-span-all-11 > *,
  div .flex > .small-span-11,
  div .flex.small-span-all-11 > * {
	  flex-basis: calc(91.6666666667% - 30px);
	  flex-basis: calc(91.6666666667% - var(--grid-gap));
	}
	div .flex-grid > .small-span-11,
  div .flex > .small-span-11 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
	div .flex-grid > .small-span-12, div .flex-grid.small-span-all-12 > *,
  div .flex > .small-span-12,
  div .flex.small-span-all-12 > * {
	  flex-basis: calc(100% - 30px);
	  flex-basis: calc(100% - var(--grid-gap));
	}
	div .flex-grid > .small-span-12,
  div .flex > .small-span-12 {
	  flex-grow: 0;
	  flex-shrink: 0;
	}
  }
  
  .site .flex.stay-flexed > * {
	flex-basis: auto;
  }
  
  /*--------------------------------------------------------------
   # Flexbox grids. 99% same as css grid
   --------------------------------------------------------------*/
   .flex, .flex-grid, .grid {
    display: flex;
    margin-left: calc(-1 * calc(30px / 2));
    margin-left: calc(-1 * var(--flex-gap));
    margin-right: calc(-1 * calc(30px / 2));
    margin-right: calc(-1 * var(--flex-gap));
  }
  .flex > *, .flex-grid > *, .grid > * {
    margin-right: calc(30px / 2);
    margin-right: var(--flex-gap);
    margin-left: calc(30px / 2);
    margin-left: var(--flex-gap);
    flex-grow: 1;
    flex-shrink: 1;
  }
  div .flex .span-1, .flex.span-all-1 > *, div .flex-grid .span-1, .flex-grid.span-all-1 > *, div .grid .span-1, .grid.span-all-1 > * {
    width: calc(8.3333333333% - 30px);
    width: calc(8.3333333333% - var(--grid-gap));
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: auto;
  }
  div .flex > .span-1, div .flex-grid > .span-1, div .grid > .span-1 {
    flex-grow: 0;
    flex-shrink: 0;
  }
  div .flex .span-2, .flex.span-all-2 > *, div .flex-grid .span-2, .flex-grid.span-all-2 > *, div .grid .span-2, .grid.span-all-2 > * {
    width: calc(16.6666666667% - 30px);
    width: calc(16.6666666667% - var(--grid-gap));
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: auto;
  }
  div .flex > .span-2, div .flex-grid > .span-2, div .grid > .span-2 {
    flex-grow: 0;
    flex-shrink: 0;
  }
  div .flex .span-3, .flex.span-all-3 > *, div .flex-grid .span-3, .flex-grid.span-all-3 > *, div .grid .span-3, .grid.span-all-3 > * {
    width: calc(25% - 30px);
    width: calc(25% - var(--grid-gap));
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: auto;
  }
  div .flex > .span-3, div .flex-grid > .span-3, div .grid > .span-3 {
    flex-grow: 0;
    flex-shrink: 0;
  }
  div .flex .span-4, .flex.span-all-4 > *, div .flex-grid .span-4, .flex-grid.span-all-4 > *, div .grid .span-4, .grid.span-all-4 > * {
    width: calc(33.3333333333% - 30px);
    width: calc(33.3333333333% - var(--grid-gap));
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: auto;
  }
  div .flex > .span-4, div .flex-grid > .span-4, div .grid > .span-4 {
    flex-grow: 0;
    flex-shrink: 0;
  }
  div .flex .span-5, .flex.span-all-5 > *, div .flex-grid .span-5, .flex-grid.span-all-5 > *, div .grid .span-5, .grid.span-all-5 > * {
    width: calc(41.6666666667% - 30px);
    width: calc(41.6666666667% - var(--grid-gap));
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: auto;
  }
  div .flex > .span-5, div .flex-grid > .span-5, div .grid > .span-5 {
    flex-grow: 0;
    flex-shrink: 0;
  }
  div .flex .span-6, .flex.span-all-6 > *, div .flex-grid .span-6, .flex-grid.span-all-6 > *, div .grid .span-6, .grid.span-all-6 > * {
    width: calc(50% - 30px);
    width: calc(50% - var(--grid-gap));
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: auto;
  }
  div .flex > .span-6, div .flex-grid > .span-6, div .grid > .span-6 {
    flex-grow: 0;
    flex-shrink: 0;
  }
  div .flex .span-7, .flex.span-all-7 > *, div .flex-grid .span-7, .flex-grid.span-all-7 > *, div .grid .span-7, .grid.span-all-7 > * {
    width: calc(58.3333333333% - 30px);
    width: calc(58.3333333333% - var(--grid-gap));
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: auto;
  }
  div .flex > .span-7, div .flex-grid > .span-7, div .grid > .span-7 {
    flex-grow: 0;
    flex-shrink: 0;
  }
  div .flex .span-8, .flex.span-all-8 > *, div .flex-grid .span-8, .flex-grid.span-all-8 > *, div .grid .span-8, .grid.span-all-8 > * {
    width: calc(66.6666666667% - 30px);
    width: calc(66.6666666667% - var(--grid-gap));
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: auto;
  }
  div .flex > .span-8, div .flex-grid > .span-8, div .grid > .span-8 {
    flex-grow: 0;
    flex-shrink: 0;
  }
  div .flex .span-9, .flex.span-all-9 > *, div .flex-grid .span-9, .flex-grid.span-all-9 > *, div .grid .span-9, .grid.span-all-9 > * {
    width: calc(75% - 30px);
    width: calc(75% - var(--grid-gap));
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: auto;
  }
  div .flex > .span-9, div .flex-grid > .span-9, div .grid > .span-9 {
    flex-grow: 0;
    flex-shrink: 0;
  }
  div .flex .span-10, .flex.span-all-10 > *, div .flex-grid .span-10, .flex-grid.span-all-10 > *, div .grid .span-10, .grid.span-all-10 > * {
    width: calc(83.3333333333% - 30px);
    width: calc(83.3333333333% - var(--grid-gap));
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: auto;
  }
  div .flex > .span-10, div .flex-grid > .span-10, div .grid > .span-10 {
    flex-grow: 0;
    flex-shrink: 0;
  }
  div .flex .span-11, .flex.span-all-11 > *, div .flex-grid .span-11, .flex-grid.span-all-11 > *, div .grid .span-11, .grid.span-all-11 > * {
    width: calc(91.6666666667% - 30px);
    width: calc(91.6666666667% - var(--grid-gap));
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: auto;
  }
  div .flex > .span-11, div .flex-grid > .span-11, div .grid > .span-11 {
    flex-grow: 0;
    flex-shrink: 0;
  }
  div .flex .span-12, .flex.span-all-12 > *, div .flex-grid .span-12, .flex-grid.span-all-12 > *, div .grid .span-12, .grid.span-all-12 > * {
    width: calc(100% - 30px);
    width: calc(100% - var(--grid-gap));
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: auto;
  }
  div .flex > .span-12, div .flex-grid > .span-12, div .grid > .span-12 {
    flex-grow: 0;
    flex-shrink: 0;
  }

  .grid {
    flex-wrap: wrap;
  }
  .grid > * {
    margin-bottom: 30px;
    margin-bottom: var(--grid-gap);
  }
}
@media screen and (-ms-high-contrast: active) and (max-width: 1200px), (-ms-high-contrast: none) and (max-width: 1200px) {
  div div .flex-grid > .container-span-1, div .flex-grid.container-span-all-1 > *, div div .flex > .container-span-1, div .flex.container-span-all-1 > *, div div .grid > .container-span-1, div .grid.container-span-all-1 > * {
    width: calc(8.3333333333% - 30px);
    width: calc(8.3333333333% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .container-span-2, div .flex-grid.container-span-all-2 > *, div div .flex > .container-span-2, div .flex.container-span-all-2 > *, div div .grid > .container-span-2, div .grid.container-span-all-2 > * {
    width: calc(16.6666666667% - 30px);
    width: calc(16.6666666667% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .container-span-3, div .flex-grid.container-span-all-3 > *, div div .flex > .container-span-3, div .flex.container-span-all-3 > *, div div .grid > .container-span-3, div .grid.container-span-all-3 > * {
    width: calc(25% - 30px);
    width: calc(25% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .container-span-4, div .flex-grid.container-span-all-4 > *, div div .flex > .container-span-4, div .flex.container-span-all-4 > *, div div .grid > .container-span-4, div .grid.container-span-all-4 > * {
    width: calc(33.3333333333% - 30px);
    width: calc(33.3333333333% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .container-span-5, div .flex-grid.container-span-all-5 > *, div div .flex > .container-span-5, div .flex.container-span-all-5 > *, div div .grid > .container-span-5, div .grid.container-span-all-5 > * {
    width: calc(41.6666666667% - 30px);
    width: calc(41.6666666667% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .container-span-6, div .flex-grid.container-span-all-6 > *, div div .flex > .container-span-6, div .flex.container-span-all-6 > *, div div .grid > .container-span-6, div .grid.container-span-all-6 > * {
    width: calc(50% - 30px);
    width: calc(50% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .container-span-7, div .flex-grid.container-span-all-7 > *, div div .flex > .container-span-7, div .flex.container-span-all-7 > *, div div .grid > .container-span-7, div .grid.container-span-all-7 > * {
    width: calc(58.3333333333% - 30px);
    width: calc(58.3333333333% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .container-span-8, div .flex-grid.container-span-all-8 > *, div div .flex > .container-span-8, div .flex.container-span-all-8 > *, div div .grid > .container-span-8, div .grid.container-span-all-8 > * {
    width: calc(66.6666666667% - 30px);
    width: calc(66.6666666667% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .container-span-9, div .flex-grid.container-span-all-9 > *, div div .flex > .container-span-9, div .flex.container-span-all-9 > *, div div .grid > .container-span-9, div .grid.container-span-all-9 > * {
    width: calc(75% - 30px);
    width: calc(75% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .container-span-10, div .flex-grid.container-span-all-10 > *, div div .flex > .container-span-10, div .flex.container-span-all-10 > *, div div .grid > .container-span-10, div .grid.container-span-all-10 > * {
    width: calc(83.3333333333% - 30px);
    width: calc(83.3333333333% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .container-span-11, div .flex-grid.container-span-all-11 > *, div div .flex > .container-span-11, div .flex.container-span-all-11 > *, div div .grid > .container-span-11, div .grid.container-span-all-11 > * {
    width: calc(91.6666666667% - 30px);
    width: calc(91.6666666667% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .container-span-12, div .flex-grid.container-span-all-12 > *, div div .flex > .container-span-12, div .flex.container-span-all-12 > *, div div .grid > .container-span-12, div .grid.container-span-all-12 > * {
    width: calc(100% - 30px);
    width: calc(100% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
}
@media screen and (-ms-high-contrast: active) and (max-width: 1030px), (-ms-high-contrast: none) and (max-width: 1030px) {
  div div .flex-grid > .large-span-1, div .flex-grid.large-span-all-1 > *, div div .flex > .large-span-1, div .flex.large-span-all-1 > *, div div .grid > .large-span-1, div .grid.large-span-all-1 > * {
    width: calc(8.3333333333% - 30px);
    width: calc(8.3333333333% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .large-span-2, div .flex-grid.large-span-all-2 > *, div div .flex > .large-span-2, div .flex.large-span-all-2 > *, div div .grid > .large-span-2, div .grid.large-span-all-2 > * {
    width: calc(16.6666666667% - 30px);
    width: calc(16.6666666667% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .large-span-3, div .flex-grid.large-span-all-3 > *, div div .flex > .large-span-3, div .flex.large-span-all-3 > *, div div .grid > .large-span-3, div .grid.large-span-all-3 > * {
    width: calc(25% - 30px);
    width: calc(25% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .large-span-4, div .flex-grid.large-span-all-4 > *, div div .flex > .large-span-4, div .flex.large-span-all-4 > *, div div .grid > .large-span-4, div .grid.large-span-all-4 > * {
    width: calc(33.3333333333% - 30px);
    width: calc(33.3333333333% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .large-span-5, div .flex-grid.large-span-all-5 > *, div div .flex > .large-span-5, div .flex.large-span-all-5 > *, div div .grid > .large-span-5, div .grid.large-span-all-5 > * {
    width: calc(41.6666666667% - 30px);
    width: calc(41.6666666667% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .large-span-6, div .flex-grid.large-span-all-6 > *, div div .flex > .large-span-6, div .flex.large-span-all-6 > *, div div .grid > .large-span-6, div .grid.large-span-all-6 > * {
    width: calc(50% - 30px);
    width: calc(50% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .large-span-7, div .flex-grid.large-span-all-7 > *, div div .flex > .large-span-7, div .flex.large-span-all-7 > *, div div .grid > .large-span-7, div .grid.large-span-all-7 > * {
    width: calc(58.3333333333% - 30px);
    width: calc(58.3333333333% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .large-span-8, div .flex-grid.large-span-all-8 > *, div div .flex > .large-span-8, div .flex.large-span-all-8 > *, div div .grid > .large-span-8, div .grid.large-span-all-8 > * {
    width: calc(66.6666666667% - 30px);
    width: calc(66.6666666667% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .large-span-9, div .flex-grid.large-span-all-9 > *, div div .flex > .large-span-9, div .flex.large-span-all-9 > *, div div .grid > .large-span-9, div .grid.large-span-all-9 > * {
    width: calc(75% - 30px);
    width: calc(75% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .large-span-10, div .flex-grid.large-span-all-10 > *, div div .flex > .large-span-10, div .flex.large-span-all-10 > *, div div .grid > .large-span-10, div .grid.large-span-all-10 > * {
    width: calc(83.3333333333% - 30px);
    width: calc(83.3333333333% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .large-span-11, div .flex-grid.large-span-all-11 > *, div div .flex > .large-span-11, div .flex.large-span-all-11 > *, div div .grid > .large-span-11, div .grid.large-span-all-11 > * {
    width: calc(91.6666666667% - 30px);
    width: calc(91.6666666667% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .large-span-12, div .flex-grid.large-span-all-12 > *, div div .flex > .large-span-12, div .flex.large-span-all-12 > *, div div .grid > .large-span-12, div .grid.large-span-all-12 > * {
    width: calc(100% - 30px);
    width: calc(100% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
}
@media screen and (-ms-high-contrast: active) and (max-width: 768px), (-ms-high-contrast: none) and (max-width: 768px) {
  div div .flex-grid > .medium-span-1, div .flex-grid.medium-span-all-1 > *, div div .flex > .medium-span-1, div .flex.medium-span-all-1 > *, div div .grid > .medium-span-1, div .grid.medium-span-all-1 > * {
    width: calc(8.3333333333% - 30px);
    width: calc(8.3333333333% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .medium-span-2, div .flex-grid.medium-span-all-2 > *, div div .flex > .medium-span-2, div .flex.medium-span-all-2 > *, div div .grid > .medium-span-2, div .grid.medium-span-all-2 > * {
    width: calc(16.6666666667% - 30px);
    width: calc(16.6666666667% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .medium-span-3, div .flex-grid.medium-span-all-3 > *, div div .flex > .medium-span-3, div .flex.medium-span-all-3 > *, div div .grid > .medium-span-3, div .grid.medium-span-all-3 > * {
    width: calc(25% - 30px);
    width: calc(25% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .medium-span-4, div .flex-grid.medium-span-all-4 > *, div div .flex > .medium-span-4, div .flex.medium-span-all-4 > *, div div .grid > .medium-span-4, div .grid.medium-span-all-4 > * {
    width: calc(33.3333333333% - 30px);
    width: calc(33.3333333333% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .medium-span-5, div .flex-grid.medium-span-all-5 > *, div div .flex > .medium-span-5, div .flex.medium-span-all-5 > *, div div .grid > .medium-span-5, div .grid.medium-span-all-5 > * {
    width: calc(41.6666666667% - 30px);
    width: calc(41.6666666667% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .medium-span-6, div .flex-grid.medium-span-all-6 > *, div div .flex > .medium-span-6, div .flex.medium-span-all-6 > *, div div .grid > .medium-span-6, div .grid.medium-span-all-6 > * {
    width: calc(50% - 30px);
    width: calc(50% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .medium-span-7, div .flex-grid.medium-span-all-7 > *, div div .flex > .medium-span-7, div .flex.medium-span-all-7 > *, div div .grid > .medium-span-7, div .grid.medium-span-all-7 > * {
    width: calc(58.3333333333% - 30px);
    width: calc(58.3333333333% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .medium-span-8, div .flex-grid.medium-span-all-8 > *, div div .flex > .medium-span-8, div .flex.medium-span-all-8 > *, div div .grid > .medium-span-8, div .grid.medium-span-all-8 > * {
    width: calc(66.6666666667% - 30px);
    width: calc(66.6666666667% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .medium-span-9, div .flex-grid.medium-span-all-9 > *, div div .flex > .medium-span-9, div .flex.medium-span-all-9 > *, div div .grid > .medium-span-9, div .grid.medium-span-all-9 > * {
    width: calc(75% - 30px);
    width: calc(75% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .medium-span-10, div .flex-grid.medium-span-all-10 > *, div div .flex > .medium-span-10, div .flex.medium-span-all-10 > *, div div .grid > .medium-span-10, div .grid.medium-span-all-10 > * {
    width: calc(83.3333333333% - 30px);
    width: calc(83.3333333333% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .medium-span-11, div .flex-grid.medium-span-all-11 > *, div div .flex > .medium-span-11, div .flex.medium-span-all-11 > *, div div .grid > .medium-span-11, div .grid.medium-span-all-11 > * {
    width: calc(91.6666666667% - 30px);
    width: calc(91.6666666667% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .medium-span-12, div .flex-grid.medium-span-all-12 > *, div div .flex > .medium-span-12, div .flex.medium-span-all-12 > *, div div .grid > .medium-span-12, div .grid.medium-span-all-12 > * {
    width: calc(100% - 30px);
    width: calc(100% - var(--grid-gap));
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
  }
}
@media screen and (-ms-high-contrast: active) and (max-width: 576px), (-ms-high-contrast: none) and (max-width: 576px) {
  div .flex-grid, div .flex, div .grid {
    flex-wrap: wrap;
  }
  div.site div .flex-grid > *, div.site div .flex > *, div.site div .grid > * {
    width: calc(100% - 30px);
    width: calc(100% - var(--grid-gap));
  }
  div div .flex-grid > .small-span-1, div div .flex-grid.small-span-all-1 > *, div div .flex > .small-span-1, div div .flex.small-span-all-1 > *, div div .grid > .small-span-1, div div .grid.small-span-all-1 > * {
    width: calc(8.3333333333% - 30px);
    width: calc(8.3333333333% - var(--grid-gap));
  }
  div div .flex-grid > .small-span-1, div div .flex > .small-span-1, div div .grid > .small-span-1 {
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .small-span-2, div div .flex-grid.small-span-all-2 > *, div div .flex > .small-span-2, div div .flex.small-span-all-2 > *, div div .grid > .small-span-2, div div .grid.small-span-all-2 > * {
    width: calc(16.6666666667% - 30px);
    width: calc(16.6666666667% - var(--grid-gap));
  }
  div div .flex-grid > .small-span-2, div div .flex > .small-span-2, div div .grid > .small-span-2 {
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .small-span-3, div div .flex-grid.small-span-all-3 > *, div div .flex > .small-span-3, div div .flex.small-span-all-3 > *, div div .grid > .small-span-3, div div .grid.small-span-all-3 > * {
    width: calc(25% - 30px);
    width: calc(25% - var(--grid-gap));
  }
  div div .flex-grid > .small-span-3, div div .flex > .small-span-3, div div .grid > .small-span-3 {
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .small-span-4, div div .flex-grid.small-span-all-4 > *, div div .flex > .small-span-4, div div .flex.small-span-all-4 > *, div div .grid > .small-span-4, div div .grid.small-span-all-4 > * {
    width: calc(33.3333333333% - 30px);
    width: calc(33.3333333333% - var(--grid-gap));
  }
  div div .flex-grid > .small-span-4, div div .flex > .small-span-4, div div .grid > .small-span-4 {
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .small-span-5, div div .flex-grid.small-span-all-5 > *, div div .flex > .small-span-5, div div .flex.small-span-all-5 > *, div div .grid > .small-span-5, div div .grid.small-span-all-5 > * {
    width: calc(41.6666666667% - 30px);
    width: calc(41.6666666667% - var(--grid-gap));
  }
  div div .flex-grid > .small-span-5, div div .flex > .small-span-5, div div .grid > .small-span-5 {
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .small-span-6, div div .flex-grid.small-span-all-6 > *, div div .flex > .small-span-6, div div .flex.small-span-all-6 > *, div div .grid > .small-span-6, div div .grid.small-span-all-6 > * {
    width: calc(50% - 30px);
    width: calc(50% - var(--grid-gap));
  }
  div div .flex-grid > .small-span-6, div div .flex > .small-span-6, div div .grid > .small-span-6 {
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .small-span-7, div div .flex-grid.small-span-all-7 > *, div div .flex > .small-span-7, div div .flex.small-span-all-7 > *, div div .grid > .small-span-7, div div .grid.small-span-all-7 > * {
    width: calc(58.3333333333% - 30px);
    width: calc(58.3333333333% - var(--grid-gap));
  }
  div div .flex-grid > .small-span-7, div div .flex > .small-span-7, div div .grid > .small-span-7 {
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .small-span-8, div div .flex-grid.small-span-all-8 > *, div div .flex > .small-span-8, div div .flex.small-span-all-8 > *, div div .grid > .small-span-8, div div .grid.small-span-all-8 > * {
    width: calc(66.6666666667% - 30px);
    width: calc(66.6666666667% - var(--grid-gap));
  }
  div div .flex-grid > .small-span-8, div div .flex > .small-span-8, div div .grid > .small-span-8 {
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .small-span-9, div div .flex-grid.small-span-all-9 > *, div div .flex > .small-span-9, div div .flex.small-span-all-9 > *, div div .grid > .small-span-9, div div .grid.small-span-all-9 > * {
    width: calc(75% - 30px);
    width: calc(75% - var(--grid-gap));
  }
  div div .flex-grid > .small-span-9, div div .flex > .small-span-9, div div .grid > .small-span-9 {
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .small-span-10, div div .flex-grid.small-span-all-10 > *, div div .flex > .small-span-10, div div .flex.small-span-all-10 > *, div div .grid > .small-span-10, div div .grid.small-span-all-10 > * {
    width: calc(83.3333333333% - 30px);
    width: calc(83.3333333333% - var(--grid-gap));
  }
  div div .flex-grid > .small-span-10, div div .flex > .small-span-10, div div .grid > .small-span-10 {
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .small-span-11, div div .flex-grid.small-span-all-11 > *, div div .flex > .small-span-11, div div .flex.small-span-all-11 > *, div div .grid > .small-span-11, div div .grid.small-span-all-11 > * {
    width: calc(91.6666666667% - 30px);
    width: calc(91.6666666667% - var(--grid-gap));
  }
  div div .flex-grid > .small-span-11, div div .flex > .small-span-11, div div .grid > .small-span-11 {
    flex-grow: 0;
    flex-shrink: 0;
  }
  div div .flex-grid > .small-span-12, div div .flex-grid.small-span-all-12 > *, div div .flex > .small-span-12, div div .flex.small-span-all-12 > *, div div .grid > .small-span-12, div div .grid.small-span-all-12 > * {
    width: calc(100% - 30px);
    width: calc(100% - var(--grid-gap));
  }
  div div .flex-grid > .small-span-12, div div .flex > .small-span-12, div div .grid > .small-span-12 {
    flex-grow: 0;
    flex-shrink: 0;
  }
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .layout-center-content > * {
    margin: 0;
  }
}
/*--------------------------------------------------------------
# Adding the core styles necessary to run aspace-free
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Animation Setup
--------------------------------------------------------------*/
/*------- For animations --------*/
.animate {
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  transform: translate(0);
}

/*------- infinite animations --------*/
.infinite {
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}

/*--------------------------------------------------------------
# Scroll Animation with data-scrollanimation
--------------------------------------------------------------*/
/*------- when using data-scrollanimation with scrubbing, turn off transitions --------*/
#page [data-scrollscrub] {
  transition: none;
}

/*------- Special class for fixing at top. Used with scrollanimation --------*/
.fixed-at-top {
  position: fixed;
  top: 0;
}

/*------- Animate in a sequence --------*/
.active.sequence:nth-of-type(1) {
  transition-delay: 0s;
}

.active.sequence:nth-of-type(2) {
  transition-delay: 0.25s;
}

.active.sequence:nth-of-type(3) {
  transition-delay: 0.5s;
}

.active.sequence:nth-of-type(4) {
  transition-delay: 0.75s;
}

.active.sequence:nth-of-type(5) {
  transition-delay: 1s;
}

.active.sequence:nth-of-type(6) {
  transition-delay: 1.25s;
}

.active.sequence:nth-of-type(7) {
  transition-delay: 1.5s;
}

.active.sequence:nth-of-type(8) {
  transition-delay: 1.75s;
}

.active.sequence:nth-of-type(9) {
  transition-delay: 2s;
}

.active.sequence:nth-of-type(10) {
  transition-delay: 2.25s;
}

.active.sequence:nth-of-type(11) {
  transition-delay: 2.5s;
}

.active.sequence:nth-of-type(12) {
  transition-delay: 2.75s;
}

.active.sequence:nth-of-type(13) {
  transition-delay: 3s;
}

.active.sequence:nth-of-type(14) {
  transition-delay: 3.25s;
}

.active.sequence:nth-of-type(15) {
  transition-delay: 3.5s;
}

.active.sequence:nth-of-type(16) {
  transition-delay: 3.75s;
}

.active.sequence:nth-of-type(17) {
  transition-delay: 4s;
}

.active.sequence:nth-of-type(18) {
  transition-delay: 4.25s;
}

.active.sequence:nth-of-type(19) {
  transition-delay: 4.5s;
}

.active.sequence:nth-of-type(20) {
  transition-delay: 4.75s;
}

.active.sequence:nth-of-type(21) {
  transition-delay: 5s;
}

.active.sequence:nth-of-type(22) {
  transition-delay: 5.25s;
}

.active.sequence:nth-of-type(23) {
  transition-delay: 5.5s;
}

.active.sequence:nth-of-type(24) {
  transition-delay: 5.75s;
}

.active.sequence:nth-of-type(25) {
  transition-delay: 6s;
}

.active.sequence:nth-of-type(26) {
  transition-delay: 6.25s;
}

.active.sequence:nth-of-type(27) {
  transition-delay: 6.5s;
}

.active.sequence:nth-of-type(28) {
  transition-delay: 6.75s;
}

.active.sequence:nth-of-type(29) {
  transition-delay: 7s;
}

.active.sequence:nth-of-type(30) {
  transition-delay: 7.25s;
}

.active.sequence:nth-of-type(31) {
  transition-delay: 7.5s;
}

/*--------------------------------------------------------------
# Animations
--------------------------------------------------------------*/
.js [data-scrollanimation*=fadeInUp] {
  opacity: 0;
  transition: all 0.5s;
  transform: translate3d(0, 100%, 0);
}
.js [data-scrollanimation*=fadeInUp].fadeInUp {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.js [data-scrollanimation*=zoomIn] {
  transition: all 0.5s;
  opacity: 0;
  transform: scale3d(0.3, 0.3, 0.3);
}
.js [data-scrollanimation*=zoomIn].zoomIn {
  transform: scale(1);
  opacity: 1;
}