.gridListImageItem {
  --agate-gridlistimageitem-aspect-ratio: 1;
}
.gridListImageItem:global(.carbon) .image {
  position: relative;
  height: 0rem;
  padding: calc(50% * var(--agate-gridlistimageitem-aspect-ratio, 1)) 0;
  flex: 0 1 0%;
}
.gridListImageItem:global(.carbon) .overlayContainer {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: auto;
}
.gridListImageItem:global(.carbon) .caption {
  font-weight: normal;
  height: 2rem;
  line-height: 2rem;
  text-align: center;
}
.gridListImageItem:global(.carbon) .subCaption {
  height: 2rem;
  line-height: 2rem;
  text-align: center;
}
.gridListImageItem:global(.cobalt) .image {
  position: relative;
  height: 0rem;
  padding: calc(50% * var(--agate-gridlistimageitem-aspect-ratio, 1)) 0;
  flex: 0 1 0%;
}
.gridListImageItem:global(.cobalt) .overlayContainer {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: auto;
}
.gridListImageItem:global(.cobalt) .caption {
  font-weight: 400;
  height: 2rem;
  line-height: 2rem;
  text-align: center;
}
.gridListImageItem:global(.cobalt) .subCaption {
  height: 2rem;
  line-height: 2rem;
  text-align: center;
}
.gridListImageItem:global(.cobalt):global(.night) .image {
  position: relative;
  height: 0rem;
  padding: calc(50% * var(--agate-gridlistimageitem-aspect-ratio, 1)) 0;
  flex: 0 1 0%;
}
.gridListImageItem:global(.cobalt):global(.night) .overlayContainer {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: auto;
}
.gridListImageItem:global(.cobalt):global(.night) .caption {
  font-weight: 400;
  height: 2rem;
  line-height: 2rem;
  text-align: center;
}
.gridListImageItem:global(.cobalt):global(.night) .subCaption {
  height: 2rem;
  line-height: 2rem;
  text-align: center;
}
.gridListImageItem:global(.copper) .image {
  position: relative;
  height: 0rem;
  padding: calc(50% * var(--agate-gridlistimageitem-aspect-ratio, 1)) 0;
  flex: 0 1 0%;
}
.gridListImageItem:global(.copper) .overlayContainer {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: auto;
}
.gridListImageItem:global(.copper) .caption {
  font-weight: 400;
  height: 2rem;
  line-height: 2rem;
  text-align: center;
}
.gridListImageItem:global(.copper) .subCaption {
  height: 2rem;
  line-height: 2rem;
  text-align: center;
}
.gridListImageItem:global(.copper):global(.night) .image {
  position: relative;
  height: 0rem;
  padding: calc(50% * var(--agate-gridlistimageitem-aspect-ratio, 1)) 0;
  flex: 0 1 0%;
}
.gridListImageItem:global(.copper):global(.night) .overlayContainer {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: auto;
}
.gridListImageItem:global(.copper):global(.night) .caption {
  font-weight: 400;
  height: 2rem;
  line-height: 2rem;
  text-align: center;
}
.gridListImageItem:global(.copper):global(.night) .subCaption {
  height: 2rem;
  line-height: 2rem;
  text-align: center;
}
.gridListImageItem:global(.electro) .image {
  position: relative;
  height: 0rem;
  padding: calc(50% * var(--agate-gridlistimageitem-aspect-ratio, 1)) 0;
  flex: 0 1 0%;
}
.gridListImageItem:global(.electro) .overlayContainer {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: auto;
}
.gridListImageItem:global(.electro) .caption {
  font-weight: normal;
  height: 2rem;
  line-height: 2rem;
  text-align: center;
}
.gridListImageItem:global(.electro) .subCaption {
  height: 2rem;
  line-height: 2rem;
  text-align: center;
}
.gridListImageItem:global(.gallium) .image {
  position: relative;
  height: 0rem;
  padding: calc(50% * var(--agate-gridlistimageitem-aspect-ratio, 1)) 0;
  flex: 0 1 0%;
}
.gridListImageItem:global(.gallium) .overlayContainer {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: auto;
}
.gridListImageItem:global(.gallium) .caption {
  font-weight: normal;
  height: 2rem;
  line-height: 2rem;
  text-align: center;
}
.gridListImageItem:global(.gallium) .subCaption {
  height: 2rem;
  line-height: 2rem;
  text-align: center;
}
.gridListImageItem:global(.gallium):global(.night) .image {
  position: relative;
  height: 0rem;
  padding: calc(50% * var(--agate-gridlistimageitem-aspect-ratio, 1)) 0;
  flex: 0 1 0%;
}
.gridListImageItem:global(.gallium):global(.night) .overlayContainer {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: auto;
}
.gridListImageItem:global(.gallium):global(.night) .caption {
  font-weight: normal;
  height: 2rem;
  line-height: 2rem;
  text-align: center;
}
.gridListImageItem:global(.gallium):global(.night) .subCaption {
  height: 2rem;
  line-height: 2rem;
  text-align: center;
}
.gridListImageItem:global(.silicon) .image {
  position: relative;
  height: 0rem;
  padding: calc(50% * var(--agate-gridlistimageitem-aspect-ratio, 1)) 0;
  flex: 0 1 0%;
}
.gridListImageItem:global(.silicon) .overlayContainer {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: auto;
}
.gridListImageItem:global(.silicon) .caption {
  font-weight: normal;
  height: 2rem;
  line-height: 2rem;
  text-align: center;
}
.gridListImageItem:global(.silicon) .subCaption {
  height: 2rem;
  line-height: 2rem;
  text-align: center;
}
.gridListImageItem:global(.silicon):global(.night) .image {
  position: relative;
  height: 0rem;
  padding: calc(50% * var(--agate-gridlistimageitem-aspect-ratio, 1)) 0;
  flex: 0 1 0%;
}
.gridListImageItem:global(.silicon):global(.night) .overlayContainer {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: auto;
}
.gridListImageItem:global(.silicon):global(.night) .caption {
  font-weight: normal;
  height: 2rem;
  line-height: 2rem;
  text-align: center;
}
.gridListImageItem:global(.silicon):global(.night) .subCaption {
  height: 2rem;
  line-height: 2rem;
  text-align: center;
}
.gridListImageItem:global(.titanium) .image {
  position: relative;
  height: 0rem;
  padding: calc(50% * var(--agate-gridlistimageitem-aspect-ratio, 1)) 0;
  flex: 0 1 0%;
}
.gridListImageItem:global(.titanium) .overlayContainer {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: auto;
}
.gridListImageItem:global(.titanium) .caption {
  font-weight: 400;
  height: 2rem;
  line-height: 2rem;
  text-align: center;
}
.gridListImageItem:global(.titanium) .subCaption {
  height: 2rem;
  line-height: 2rem;
  text-align: center;
}
