/*
Returns a CSS clamp function which resolves to
$size-at-min-width when page width is below $min-width,
$size-at-max-width when page width is above $max-width,
and linearly scales between the two between $min-width and $max-width*/
.cm-story-block {
  height: 490px;
  max-width: 1440px; }
  @media (max-width: 768.98px) {
    .cm-story-block {
      height: 680px; } }
  @media (max-width: 543.98px) {
    .cm-story-block {
      height: 680px; } }
  .cm-story-block .cm-block-wrapper {
    height: 100%;
    background-color: #fff;
    gap: 0 !important;
    padding: 0; }
    .cm-story-block .cm-block-wrapper .image-component {
      height: 100%; }
      .cm-story-block .cm-block-wrapper .image-component img {
        position: absolute;
        max-width: 16.625rem;
        right: -12rem;
        top: 50%;
        transform: translateY(-50%); }
        @media (max-width: 991.98px) {
          .cm-story-block .cm-block-wrapper .image-component img {
            right: -82%; } }
        @media (max-width: 768.98px) {
          .cm-story-block .cm-block-wrapper .image-component img {
            top: -22%;
            left: 50%;
            transform: translate(-50%, -50%);
            max-width: 327px; } }
      .cm-story-block .cm-block-wrapper .image-component-overlay {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column;
            flex-direction: column;
        -ms-flex-align: center;
            align-items: center;
        -ms-flex-pack: center;
            justify-content: center;
        width: 100%;
        max-width: 31.25rem;
        padding: 0 15px; }
        .cm-story-block .cm-block-wrapper .image-component-overlay-title {
          font-size: 1rem;
          text-transform: uppercase;
          margin-bottom: 1rem; }
        .cm-story-block .cm-block-wrapper .image-component-overlay-secondary-title {
          font-size: 1.5rem;
          font-weight: 700;
          margin-bottom: 1.5rem; }
        .cm-story-block .cm-block-wrapper .image-component-overlay-description {
          text-align: center;
          margin-bottom: 2rem; }
          .cm-story-block .cm-block-wrapper .image-component-overlay-description a {
            font-size: 0.875rem;
            font-weight: 700; }
        @media (max-width: 768.98px) {
          .cm-story-block .cm-block-wrapper .image-component-overlay {
            position: inherit;
            transform: none;
            margin-top: 7.5em; }
            .cm-story-block .cm-block-wrapper .image-component-overlay-secondary-title {
              text-transform: uppercase; } }
        @media (max-width: 543.98px) {
          .cm-story-block .cm-block-wrapper .image-component-overlay {
            margin-top: 9.5em; } }
    .cm-story-block .cm-block-wrapper .region {
      margin-bottom: 0; }
      @media (max-width: 768.98px) {
        .cm-story-block .cm-block-wrapper .region:nth-child(1) {
          max-height: 400px; } }
      @media (max-width: 768.98px) {
        .cm-story-block .cm-block-wrapper .region:nth-child(1) {
          max-height: 400px; } }
      .cm-story-block .cm-block-wrapper .region:nth-child(2) {
        padding: 0;
        position: inherit; }
        .cm-story-block .cm-block-wrapper .region:nth-child(2) .photo-tile-figure {
          margin: 0; }
        @media (max-width: 768.98px) {
          .cm-story-block .cm-block-wrapper .region:nth-child(2) {
            max-height: 281px;
            display: block;
            height: 100%;
            width: 100%; } }
    @media (max-width: 991.98px) {
      .cm-story-block .cm-block-wrapper {
        -ms-flex-direction: row;
            flex-direction: row; } }
    @media (max-width: 768.98px) {
      .cm-story-block .cm-block-wrapper {
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
        -ms-flex-align: center;
            align-items: center; } }

/*# sourceMappingURL=cmStoryBlock.css.map*/