<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">:root {
  --ck-image-style-spacing: 1.5em; }

.ck-content .image-style-side,
.ck-content .image-style-align-left,
.ck-content .image-style-align-center,
.ck-content .image-style-align-right {
  max-width: 50%; }

.ck-content .image-style-side {
  float: right;
  margin-left: var(--ck-image-style-spacing); }

.ck-content .image-style-align-left {
  float: left;
  margin-right: var(--ck-image-style-spacing); }

.ck-content .image-style-align-center {
  margin-left: auto;
  margin-right: auto; }

.ck-content .image-style-align-right {
  float: right;
  margin-left: var(--ck-image-style-spacing); }

.ck-content .image &gt; figcaption {
  /*** Caption ***/
  display: table-caption;
  caption-side: bottom;
  word-break: break-word;
  color: #333333;
  background-color: #f7f7f7;
  padding: .6em;
  font-size: .75em;
  outline-offset: -1px; }

.ck-content .image.image_resized {
  /*** Resize ***/
  max-width: 100%;
  /*
		The `&lt;figure&gt;` element for resized images must not use `display:table` as browsers do not support `max-width` for it well.
		See https://stackoverflow.com/questions/4019604/chrome-safari-ignoring-max-width-in-table/14420691#14420691 for more.
		Fortunately, since we control the width, there is no risk that the image will look bad.
		*/
  display: block;
  box-sizing: border-box; }
  .ck-content .image.image_resized img {
    /* For resized images it is the `&lt;figure&gt;` element that determines the image width. */
    width: 100%; }
  .ck-content .image.image_resized &gt; figcaption {
    /* The `&lt;figure&gt;` element uses `display:block`, so `&lt;figcaption&gt;` also has to. */
    display: block; }
</pre></body></html>