figure {
	--inline-figure-max-width: 350px;
	--inline-figure-margin-side: var(--page-padding);
}

figure.inner-left, figure.inner-right {
	max-width: var(--story-width);
}

figure.outer-left, figure.outer-right {
	max-width: calc(var(--story-width) + 2 * var(--inline-figure-max-width) + 4 * var(--inline-figure-margin-side));
}

figure.inline {
	display: block;
	margin: 0 auto;
	padding: 0px;
}

figure.inline > div:first-child {
  display: inline-block;
  background: transparent;
  position: relative;
  padding-top: 5px;
  padding-bottom: 10px;
  margin-left: var(--inline-figure-margin-side);
  margin-right: var(--inline-figure-margin-side);
  margin-bottom: 0px;
  inset: auto;
  max-width: var(--inline-figure-max-width);
}

figure.inner-left > div:first-child, figure.outer-left > div:first-child {
  float: left;
}

figure.inner-right > div:first-child, figure.outer-right > div:first-child {
	float: right;
}

figure.inner-left > div:first-child {
	margin-left: 0px;
}

figure.inner-right > div:first-child {
	margin-right: 0px;
}

figure.full-bleed figcaption {
	padding: 7px 10px;
}

.extra-wide {
	max-width: var(--extra-wide-max-width, 1200px);
}

figure.extra-wide {
	max-width: var(--extra-wide-max-width, 1200px);
}

figure.portrait {
	max-width: var(--portrait-max-width, 420px);
}

figure.inline.max-width > div:first-child {
	padding-bottom: 10px;
}

figure.inline.max-width figcaption {
	line-height: 1.3;
}

/* Dealing with Connatix */
.embed-media.wide {
	max-width: max(970px,var(--story-media-width)) !important;
}

.embed-media.extra-wide {
	max-width: var(--extra-wide-max-width, 1200px) !important;
}

@media only screen and (max-width: 768px) {
	figure.inline {
		padding: 0 var(--page-padding);
	}
	figure.inner-left > div:first-child, figure.outer-left > div:first-child {
		margin-left: 0px;
	}
	figure.inner-right > div:first-child, figure.outer-right > div:first-child {
		margin-right: 0px;
	}
}

@media only screen and (max-width: 650px) {
	figure.inline > div:first-child {
		max-width: 100%;
		margin-left: 0px;
		margin-right: 0px;
		padding-bottom: 30px;
		padding-top: 10px;
	}
	figure.inline.max-width {
		display: flex;
	}
	figure.inline.max-width > div:first-child {
		max-width: min(100%, var(--inline-figure-max-width));
		margin: 0 auto;
		margin-bottom: var(--space);
	}
}