/*----- IMAGE GALLERY - Open -----*/
#apb-wrapper .paragraph--type--apb-pb-image-gallery .apb-columns-2,
#apb-wrapper .paragraph--type--apb-pb-image-gallery .apb-columns-3,
#apb-wrapper .paragraph--type--apb-pb-image-gallery .apb-columns-4,
#apb-wrapper .paragraph--type--apb-pb-image-gallery .apb-columns-5 {
  grid-gap: 1rem;
}

/* v1 parity: Color Style background + centered magnifier PNG on the link.
   On hover the image fades to 20% opacity, revealing the swatch + icon. */
#apb-wrapper .paragraph--type--apb-pb-image-gallery .apb-ig-grid a {
  display: block;
  background-color: var(--apb-ig-tile-color, #666);
  background-image: url(../images/zoom-in-64x64-02.png);
  background-repeat: no-repeat;
  background-position: center center;
}

#apb-wrapper .paragraph--type--apb-pb-image-gallery .apb-ig-grid a img {
  display: block !important;
  height: auto !important;
  margin: 0 !important;
  max-width: 100% !important;
  width: auto !important;
}

#apb-wrapper .paragraph--type--apb-pb-image-gallery .apb-ig-grid a:hover img {
  opacity: 0.2;
}

/* GRID */
#apb-wrapper .apb-ig-grid.apb-columns-1,
#apb-wrapper .apb-ig-grid.apb-columns-2,
#apb-wrapper .apb-ig-grid.apb-columns-3,
#apb-wrapper .apb-ig-grid.apb-columns-4,
#apb-wrapper .apb-ig-grid.apb-columns-5,
#apb-wrapper .apb-ig-grid.apb-columns-6,
#apb-wrapper .apb-ig-grid.apb-columns-7,
#apb-wrapper .apb-ig-grid.apb-columns-8,
#apb-wrapper .apb-ig-grid.apb-columns-9,
#apb-wrapper .apb-ig-grid.apb-columns-10 {
  display: inline-grid;
  width: auto;
}

/* SINGLE IMAGE */
#apb-wrapper .apb-display-layout-single_image {
  display: flex !important;
}
#apb-wrapper .apb-display-layout-single_image .apb-ig-image {
  display: none !important;
}
#apb-wrapper .apb-display-layout-single_image .apb-ig-image:first-child {
  display: block !important;
  width: 100%;
}
#apb-wrapper .apb-display-layout-single_image a {
  display: block !important;
  width: fit-content !important;
}

/*----- IMAGE GALLERY - Close -----*/

/*----- CSS ANIME - Open -----*/
#apb-wrapper .apb-ig-grid a,
#apb-wrapper .apb-ig-grid a img {
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}
/*----- CSS ANIME - Close -----*/