/*
  Styles for saved Redactor HTML rendered OUTSIDE the editor.

  Redactor 4 (static/ss-admin/redactor/) records its image "wrap" control's left and
  right as a class on the <figure>: float-left, float-right. Center is written inline
  (wrapWithStyle in static/ss-admin/js/ss-redactor-options.js), but copy saved before
  that switch still carries wrap-center. Those classes are defined only under
  .rx-content in redactor.min.css, and .rx-content is the editor's own wrapper div,
  so it never exists in the saved markup. Any page that prints the saved HTML
  without these rules renders a centered image left-aligned.

  Wrap the printed content in .redactor-content and the alignment a client picked in
  the editor survives on the public page. The class names below are Redactor's own
  output contract and must match redactor.min.css exactly.

  Deliberately NOT copied from the editor: its `.rx-content * { margin: 0 }` reset.
  Zeroing every margin would collapse paragraph spacing on the public page, and the
  host page already has its own prose rhythm.
*/

.redactor-content figure {
    margin: 0 0 1em;
}

.redactor-content figure img {
    max-width: 100%;
    height: auto;
}

.redactor-content figcaption {
    display: block;
    margin-top: 4px;
    font-size: 14px;
    line-height: 1.3;
}

.redactor-content .wrap-center {
    text-align: center;
}

.redactor-content .wrap-center img {
    margin-left: auto;
    margin-right: auto;
}

.redactor-content .wrap-center figcaption {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

.redactor-content .float-left {
    float: left;
    margin-right: 1em;
    margin-bottom: 1em;
    max-width: 200px;
}

.redactor-content .float-right {
    float: right;
    margin-left: 1em;
    margin-bottom: 1em;
    max-width: 200px;
}