/* RTOWN21 Editor image output styles. Loaded in both the editor and published content. */
:where(.xe_content, .rhymix_content) {
	--rt-editor-image-spacing: 1.5em;
}

:where(.xe_content, .rhymix_content) figure.image {
	display: table;
	clear: both;
	min-width: 50px;
	max-width: 100%;
	margin: .9em auto;
	text-align: center;
}

:where(.xe_content, .rhymix_content) figure.image > img,
:where(.xe_content, .rhymix_content) figure.image > a > img,
:where(.xe_content, .rhymix_content) figure.image picture,
:where(.xe_content, .rhymix_content) figure.image picture > img {
	display: block;
	max-width: 100%;
	height: auto;
	margin: 0 auto;
}

:where(.xe_content, .rhymix_content) figure.image.image_resized {
	display: block;
	box-sizing: border-box;
}

:where(.xe_content, .rhymix_content) figure.image.image_resized > img,
:where(.xe_content, .rhymix_content) figure.image.image_resized > a,
:where(.xe_content, .rhymix_content) figure.image.image_resized > a > img,
:where(.xe_content, .rhymix_content) figure.image.image_resized picture,
:where(.xe_content, .rhymix_content) figure.image.image_resized picture > img {
	width: 100%;
}

:where(.xe_content, .rhymix_content) figure.image.image-style-block-align-left {
	margin-right: auto;
	margin-left: 0;
}

:where(.xe_content, .rhymix_content) figure.image.image-style-block-align-right {
	margin-right: 0;
	margin-left: auto;
}

:where(.xe_content, .rhymix_content) figure.image.image-style-align-left {
	float: left;
	clear: none;
	margin-right: var(--rt-editor-image-spacing);
	margin-left: 0;
}

:where(.xe_content, .rhymix_content) figure.image.image-style-align-right,
:where(.xe_content, .rhymix_content) figure.image.image-style-side {
	float: right;
	clear: none;
	margin-right: 0;
	margin-left: var(--rt-editor-image-spacing);
}

:where(.xe_content, .rhymix_content) figure.image.image-style-side {
	max-width: 50%;
}

:where(.xe_content, .rhymix_content) img.image-inline {
	display: inline-flex;
	max-width: 100%;
	height: auto;
	vertical-align: middle;
}

:where(.xe_content, .rhymix_content) figure.image > figcaption {
	display: table-caption;
	caption-side: bottom;
	padding: .6em;
	outline-offset: -1px;
	background: #f7f7f7;
	color: #333;
	font-size: .75em;
	word-break: break-word;
}

/* Rhymix removes non-whitelisted classes and may wrap images in a paragraph. */
:where(.xe_content, .rhymix_content) figure[data-rt-image-align],
:where(.xe_content, .rhymix_content) figure:not(.image):not([data-rt-image-align]):has(img:is([data-file-srl], [editor_component="image_link"])) {
	display: block;
	clear: both;
	box-sizing: border-box;
	max-width: 100%;
	margin: .9em auto;
	text-align: center;
}

:where(.xe_content, .rhymix_content) figure[data-rt-image-align] > p,
:where(.xe_content, .rhymix_content) figure:not(.image):not([data-rt-image-align]):has(img:is([data-file-srl], [editor_component="image_link"])) > p {
	margin: 0;
	text-align: inherit;
}

:where(.xe_content, .rhymix_content) figure[data-rt-image-align] img,
:where(.xe_content, .rhymix_content) figure:not(.image):not([data-rt-image-align]):has(img:is([data-file-srl], [editor_component="image_link"])) img {
	display: inline-block;
	max-width: 100%;
	height: auto;
	margin: 0;
}

:where(.xe_content, .rhymix_content) figure[data-rt-image-align="left"] {
	margin-right: auto;
	margin-left: 0;
	text-align: left;
}

:where(.xe_content, .rhymix_content) figure[data-rt-image-align="center"] {
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}

:where(.xe_content, .rhymix_content) figure[data-rt-image-align="right"] {
	margin-right: 0;
	margin-left: auto;
	text-align: right;
}

:where(.xe_content, .rhymix_content)::after {
	display: block;
	clear: both;
	content: "";
}