// vf-figure

@import 'package.variables.scss';
// Debug information from component's `package.json`:
// ---
/*!
 * Component: #{map-get($componentInfo, 'name')}
 * Version: #{map-get($componentInfo, 'version')}
 * Location: #{map-get($componentInfo, 'location')}
 */

.vf-figure {
  @include figure;
}

.vf-figure__image {
  display: block;
  height: auto;
  max-width: 100%;
}

.vf-figure--align {
  display: table;

  .vf-figure__caption {
    caption-side: bottom;
    display: table-caption;
  }
}

.vf-figure--align-inline-start {
  float: left;
}

.vf-figure--align-inline-end {
  float: right;
}

.vf-figure--align-centered {
  margin: 0 auto;
}