/*
$grid-breakpoints: (
  xs: 0,
  sm: 576px,
  md: 768px,
  lg: 992px,
  xl: 1200px,
  xxl: 1400px
) !default;
*/
.collections-wrapper {
  overflow-x: scroll;
  position: relative;
  padding-right: 4rem;
}
@media only screen and (max-width: 576px) {
  .collections-wrapper {
    padding-right: 0.8rem;
  }
}

.collections-list {
  display: flex;
  overflow-x: auto;
  gap: 20px;
  padding-bottom: 20px;
  margin-right: -100px;
  padding-right: 100px;
  width: -moz-fit-content;
  width: fit-content;
}
.collections-list .collection-item {
  position: relative;
  height: 370px;
  width: 370px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
@media only screen and (max-width: 768px) {
  .collections-list .collection-item {
    height: 350px;
    width: 350px;
  }
}
.collections-list .collection-item .overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(180deg, rgba(21, 21, 21, 0) 0%, rgba(21, 21, 21, 0.6) 50%, rgba(21, 21, 21, 0.9) 100%);
}
.collections-list .collection-item .collection-item-content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 2rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.collections-list .collection-item .collection-item-content h4, .collections-list .collection-item .collection-item-content h6 {
  color: #FFFFFF;
  text-transform: uppercase;
}
.collections-list .collection-item .collection-item-content h6 span {
  color: #ED1C24;
}
