/*!************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./cartridges/app_custom_interceramic/cartridge/client/default/scss/experience/components/customAssets/mosaicLayout.scss ***!
  \************************************************************************************************************************************************************************************************************************************************************************/
:root {
  --gap-size: 1vw;
}

.mosaic-container-custom {
  width: 70%;
  margin: 0 auto var(--gap-size);
}

@media (max-width: 1199.98px) {
  .mosaic-container-custom {
    width: 100%;
  }
}
.mosaic-layout-custom {
  display: flex;
  flex-direction: column;
  gap: var(--gap-size);
}

.image-custom img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

.image-1-custom {
  width: calc(100% - var(--gap-size));
}

.row-custom {
  display: flex;
  gap: var(--gap-size);
}

.image-2-custom {
  width: calc(66.66% - var(--gap-size));
}

.column-custom {
  width: calc(33.33% - var(--gap-size));
  display: flex;
  flex-direction: column;
  gap: var(--gap-size);
}

.image-3-custom, .image-4-custom {
  width: 100%;
}

/*# sourceMappingURL=default\css\experience\components\customAssets\mosaicLayout.css.map*/