/*!**************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/@symfony/webpack-encore/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].oneOf[1].use[1]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[4].oneOf[1].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].oneOf[1].use[3]!./vendor/communice-web/communice-base/Resources/Private/Assets/StyleSheets/communice/content-elements/detail-base.scss ***!
  \**************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.detail--images {
  margin-top: 2rem;
}
@media (min-width: 992px) {
  .detail--images {
    margin-top: 3.5rem;
  }
}
@media (min-width: 768px) {
  .detail--images .tns-outer {
    width: 100%;
  }
}
@media (min-width: 768px) {
  .detail--images .detail--images--slider {
    display: flex;
    row-gap: 1.5rem;
    column-gap: 1.5rem;
    flex-wrap: wrap;
  }
}

.detail--images--item {
  margin-bottom: 0;
}
@media (min-width: 768px) {
  .detail--images--item {
    width: calc(50% - 0.75rem);
  }
}
@media (min-width: 992px) {
  .detail--images--item {
    width: calc(25% - 1.125rem);
  }
}

.detail--images--item--image {
  position: relative;
}

body.rounded-corners .detail--images--item--image img {
  border-radius: var(--rounded-corners--border-radius--base);
}