/*!*****************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/image-gallery/style.scss ***!
  \*****************************************************************************************************************************************************************************************************************************************************/
/**
 * The following styles get applied both on the front of your site
 * and in the editor.
 *
 * Replace them with your own styles or remove the file completely.
 */
.wp-block-create-block-image-gallery {
  color: #fff;
  padding: 2px;
}

.custom-gallery-frontend.grid,
.gallery-preview.grid {
  display: grid;
  grid-column-gap: var(--column-gap, 10px);
  gap: var(--row-gap, 10px) var(--column-gap, 10px);
}

.custom-gallery-frontend.grid img,
.gallery-preview.grid img {
  width: 100%;
  aspect-ratio: 1/1; /* makes perfect square */
  -o-object-fit: cover;
     object-fit: cover; /* crop instead of stretch */
  display: block;
}

.custom-gallery-frontend.masonry,
.gallery-preview.masonry {
  -moz-column-gap: var(--column-gap, 10px);
       column-gap: var(--column-gap, 10px);
}

.custom-gallery-frontend.masonry img,
.gallery-preview.masonry img {
  width: 100%;
  height: auto;
  margin-bottom: var(--row-gap, 10px);
  display: block;
  -moz-column-break-inside: avoid;
       break-inside: avoid;
}

/*# sourceMappingURL=style-index.css.map*/