.grid-list {
  --gap: var(--theme-items-gap);
  gap: var(--gap);
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
}

.grid-list__item {
  min-width: 0px;
}

.grid-list--items {
  --items-count: 1;
  grid-template-columns: repeat(var(--items-count), 1fr);
}

.grid-list--items-2 {
  --items-count: 2;
}

.grid-list--items-3 {
  --items-count: 3;
}

.grid-list--items-4 {
  --items-count: 4;
}

.grid-list--items-5 {
  --items-count: 5;
}

.grid-list--no-gap .grid-list-border-outer {
  margin: 0px -1px -1px 0px;
}

@media(min-width: 601px) {
  .grid-list--items-2-from-601 {
    --items-count: 2;
  }

  .grid-list--items-3-from-601 {
    --items-count: 3;
  }

  .grid-list--auto-masonry--26-in-loop-span-4-1st-from-1200 .grid-list__item:nth-of-type(26n+1),
  .grid-list--auto-masonry--26-in-loop-span-4-14th-from-1200 .grid-list__item:nth-of-type(26n+14) {
    grid-column: span 2;
  }
}

@media(min-width: 768px) {
  .grid-list--items-5-from-768 {
    --items-count: 5;
  }

  .grid-list--items-4-from-768 {
    --items-count: 4;
  }

  .grid-list--items-3-from-768 {
    --items-count: 3;
  }

  .grid-list--items-2-from-768 {
    --items-count: 2;
  }

  .grid-list--items-1-from-768 {
    --items-count: 1;
  }
}

@media(min-width: 992px) {
  .grid-list--items-5-from-992 {
    --items-count: 5;
  }

  .grid-list--items-4-from-992 {
    --items-count: 4;
  }

  .grid-list--items-3-from-992 {
    --items-count: 3;
  }

  .grid-list--items-2-from-992 {
    --items-count: 2;
  }

  .grid-list--items-1-from-992 {
    --items-count: 1;
  }

  .grid-list--auto-masonry--26-in-loop-span-4-1st-from-1200 .grid-list__item:nth-of-type(26n+1),
  .grid-list--auto-masonry--26-in-loop-span-4-14th-from-1200 .grid-list__item:nth-of-type(26n+14) {
    grid-column: span 3;
  }
}

@media (min-width: 1200px) {
  .grid-list--items-6-from-1200 {
    --items-count: 6;
  }

  .grid-list--items-5-from-1200 {
    --items-count: 5;
  }

  .grid-list--items-4-from-1200 {
    --items-count: 4;
  }

  .grid-list--items-3-from-1200 {
    --items-count: 3;
  }

  .grid-list--items-2-from-1200 {
    --items-count: 2;
  }

  .grid-list--auto-masonry--6-in-loop-span-3rd-from-1200 .grid-list__item:nth-of-type(6n+3),
  .grid-list--auto-masonry--6-in-loop-span-4th-from-1200 .grid-list__item:nth-of-type(6n+4),
  .grid-list--auto-masonry--14-in-loop-span-1st-from-1200 .grid-list__item:nth-of-type(14n+1),
  .grid-list--auto-masonry--14-in-loop-span-10th-from-1200 .grid-list__item:nth-of-type(14n+10) {
    grid-column: span 2;
  }

  .grid-list--auto-masonry--26-in-loop-span-4-1st-from-1200 .grid-list__item:nth-of-type(26n+1),
  .grid-list--auto-masonry--26-in-loop-span-4-14th-from-1200 .grid-list__item:nth-of-type(26n+14) {
    grid-column: span 4;
  }
}

/* @media (max-width: 500px) {
  #main .grid-list:not(.mobile-scrolled) {
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  }
} */

@media (max-width: 600px) {
  .grid-list--items-2-to-600 {
    --items-count: 2;
  }

  /*compact*/
  #main .grid-list.grid-list--compact {
    --items-count: 2;
  }

  .grid-list {
    --gap: min(var(--theme-items-gap), 8px);
  }
}

@media (max-width: 450px) {

  /*compact*/
  #main .grid-list.grid-list--compact {
    gap: 0px;
  }

  #main .grid-list.grid-list--compact .grid-list-border-outer {
    margin: 0px -1px -1px 0px;
  }

  #main .grid-list.grid-list--compact .grid-list__item>.bordered,
  #main .grid-list.grid-list--compact .js-popup-block {
    border-radius: 0px;
  }
}

/* @media (max-width: 400px) {
  #main .grid-list:not(.mobile-scrolled):not(.grid-list--compact) {
    --items-count: 1;
  }
} */

.grid-list--fill-bg>.grid-list__item>div {
  background: var(--card_bg_black);
}

/* Grid span */
.grid-column-span,
.grid-column-span-to-1199 {
  --span: 2;
  grid-column: span var(--span);
}

.grid-column-span--3,
.grid-column-span--3-to-1199 {
  --span: 3;
}

.grid-column-span--4,
.grid-column-span--4-to-1199 {
  --span: 4;
}

@media (max-width: 1101px) {

  .grid-column-span,
  .grid-column-span--3,
  .grid-column-span--4 {
    --span: 1;
  }
}

@media (max-width: 1199px) {

  .grid-column-span-to-1199,
  .grid-column-span--3-to-1199,
  .grid-column-span--4-to-1199 {
    --span: 1;
  }
}

.grid-center {
  display: grid;
  place-content: center;
}

/* gap */
.gap {
  --gap: 0;
  gap: var(--gap);
}

.gap--2 {
  --gap: 2px;
}

.gap--4 {
  --gap: 4px;
}

.gap--6 {
  --gap: 6px;
}

.gap--8 {
  --gap: 8px;
}

.gap--12 {
  --gap: 12px;
}

.gap--16 {
  --gap: 16px;
}

.gap--20 {
  --gap: 20px;
}

.gap--24 {
  --gap: 24px;
}

.gap--28 {
  --gap: 28px;
}

.gap--32 {
  --gap: clamp(24px, 3vw, 32px);
}

.gap--36 {
  --gap: clamp(32px, 3vw, 36px);
}

.gap--40 {
  --gap: clamp(32px, 3vw, 40px);
}

.gap--48 {
  --gap: clamp(40px, 3vw, 48px);
}

.gap--x {
  --gap: var(--theme-items-gap);
}

/* row-gap */
.row-gap {
  --row-gap: 0;
  row-gap: var(--row-gap);
}

.row-gap--2 {
  --row-gap: 2px;
}

.row-gap--4 {
  --row-gap: 4px;
}

.row-gap--6 {
  --row-gap: 6px;
}

.row-gap--8 {
  --row-gap: 8px;
}

.row-gap--12 {
  --row-gap: 12px;
}

.row-gap--16 {
  --row-gap: 16px;
}

.row-gap--20 {
  --row-gap: 20px;
}

.row-gap--24 {
  --row-gap: 24px;
}

.row-gap--32 {
  --row-gap: clamp(24px, 3vw, 32px);
}

.row-gap--40 {
  --row-gap: clamp(32px, 3vw, 40px);
}

.row-gap--48 {
  --row-gap: clamp(40px, 3vw, 48px);
}

.row-gap--x {
  --row-gap: var(--theme-items-gap);
}

/* column-gap */
.column-gap {
  --column-gap: 0;
  column-gap: var(--column-gap);
}

.column-gap--2 {
  --column-gap: 2px;
}

.column-gap--4 {
  --column-gap: 4px;
}

.column-gap--6 {
  --column-gap: 6px;
}

.column-gap--8 {
  --column-gap: 8px;
}

.column-gap--12 {
  --column-gap: 12px;
}

.column-gap--16 {
  --column-gap: 16px;
}

.column-gap--20 {
  --column-gap: 20px;
}

.column-gap--24 {
  --column-gap: 24px;
}

.column-gap--32 {
  --column-gap: clamp(24px, 3vw, 32px);
}

.column-gap--40 {
  --column-gap: clamp(32px, 3vw, 40px);
}

.column-gap--48 {
  --column-gap: clamp(40px, 3vw, 48px);
}

.column-gap--64 {
  --column-gap: clamp(48px, 3vw, 64px);
}

.column-gap--80 {
  --column-gap: clamp(48px, 3vw, 80px);
}

.column-gap--x {
  --column-gap: var(--theme-items-gap);
}