.Tile {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  display: flex;
  align-items: end;
  justify-content: center;
}
.Tile.XXS {
  max-width: 396px;
  min-width: 253.3333333333px;
  width: -webkit-calc((100vw - 96px) / 4);
  width: -moz-calc((100vw - 96px) / 4);
  width: calc((100vw - 96px) / 4);
}
@media (max-width: 900px) {
  .Tile.XXS {
    max-width: 824px;
    min-width: 253.3333333333px;
    width: -webkit-calc((100vw - 32px) / 2);
    width: -moz-calc((100vw - 32px) / 2);
    width: calc((100vw - 32px) / 2);
  }
}
.Tile.XS {
  max-width: 538.6666666667px;
  min-width: 253.3333333333px;
  width: -webkit-calc((100vw - 64px) / 3);
  width: -moz-calc((100vw - 64px) / 3);
  width: calc((100vw - 64px) / 3);
}
@media (max-width: 900px) {
  .Tile.XS {
    max-width: 1109.3333333333px;
    min-width: 253.3333333333px;
    width: -webkit-calc((((100vw - 64px) / 3) * 2) + 32px);
    width: -moz-calc((((100vw - 64px) / 3) * 2) + 32px);
    width: calc((((100vw - 64px) / 3) * 2) + 32px);
  }
}
.Tile.S {
  max-width: 824px;
  min-width: 253.3333333333px;
  width: -webkit-calc((100vw - 32px) / 2);
  width: -moz-calc((100vw - 32px) / 2);
  width: calc((100vw - 32px) / 2);
}
@media (max-width: 900px) {
  .Tile.S {
    max-width: 1680px;
    min-width: 253.3333333333px;
    width: 100vw;
  }
}
.Tile.M {
  max-width: 1109.3333333333px;
  min-width: 253.3333333333px;
  width: -webkit-calc((((100vw - 64px) / 3) * 2) + 32px);
  width: -moz-calc((((100vw - 64px) / 3) * 2) + 32px);
  width: calc((((100vw - 64px) / 3) * 2) + 32px);
}
.Tile.L {
  max-width: 1252px;
  min-width: 253.3333333333px;
  width: -webkit-calc((((100vw - 96px) / 4) * 3) + 64px);
  width: -moz-calc((((100vw - 96px) / 4) * 3) + 64px);
  width: calc((((100vw - 96px) / 4) * 3) + 64px);
}
.Tile.XL {
  max-width: 1680px;
  min-width: 253.3333333333px;
  width: 100vw;
}