/* -------------------------------------------------------------------
 * block style
 * 
 * @see
 * https://developer.wordpress.org/block-editor/developers/themes/theme-support/
 * ------------------------------------------------------------------ */
/*
 * Wide Alignment:  
 *
 * @see
 * https://codepen.io/joen/pen/zLWvrW
 */
figure {
  margin: 0;
  /* Remember this one, figures are born with margins */
  text-align: center;
}

/*
 * alignwide
 * Image width is parent element width.
 */
.wp-block-image.alignwide img {
  width: 100%;
}

/*
 * alignfull
 * If screen width is >= 768 then image max width is (bootstrap) column width. 
 * If screen width is < 768 then image width is device width.
 */
.wp-block-image.alignfull {
  margin: 0 -15px 15px;
}

.wp-block-image.alignfull img {
  width: 100%;
}

/*
 * alignleft
 * Image widh is 50% of parent element.
 */
.wp-block-image figure.alignleft {
  display: block;
  float: left;
  margin-right: 21px;
  max-width: 50%;
}

/*
 * alignright
 * Image widh is 50% of parent element.
 */
.wp-block-image figure.alignright {
  display: block;
  float: right;
  margin-left: 21px;
  max-width: 50%;
}

.wp-block-image figure.alignleft,
.wp-block-image figure.alignright {
  display: table;
}

.wp-block-image figure.alignleft figcaption,
.wp-block-image figure.alignright figcaption {
  caption-side: bottom;
  display: table-caption;
}

.wp-block-image figure.alignright figcaption,
.wp-block-image figure.alignleft figcaption {
  color: gray;
  font-size: 75%;
  margin-bottom: 1em;
}

/*
 * Editor Text Size Palette
 */
/*
 * Frontend & Editor Styles
 */
/*
 * Block Tools
 */
/*
 * Core Block Patterns
 */