  /* TANDEM */
  .unlcms-tandem-text p:last-child,
  .unlcms-tandem-text ol:last-child,
  .unlcms-tandem-text ul:last-child,
  .unlcms-tandem-text h2:last-child {
    margin-bottom: 0;
  }

  /* max sm 673 */
  @media (max-width: 42.09em) {

    .unlcms-tandem {
      padding-bottom: 3.16em;
    }

    .unlcms-tandem-text {
      padding-top: 1.33em;
    }

  }

  /************ Tandem Stack Styles **********/

  /* max sm 673 */
  @media only screen and (max-width: 42.09em) {

    .unlcms-tandem-stack-text {
      grid-area: 3 / 2 / 4 / -2;
    }

    .unlcms-tandem-stack-img {
      grid-area: 1 / 1 / 2 / -1;
    }

  }

  /* sm 673 */
  @media only screen and (min-width: 42.09em) and (max-width: 56.12em) {

    .unlcms-tandem-stack-text {
      grid-area: 3 / 4 / 4 / -4;
    }

    .unlcms-tandem-stack-img {
      grid-area: 1 / 4 / 2 / -4;
    }

  }

  /* max md 898 */
  @media only screen and (max-width: 56.12em) {

    .unlcms-tandem-stack {
      grid-template-rows: auto 1.33em auto 3.16em;
    }

  }

  /* sm 673 */
  @media only screen and (min-width: 56.12em) {

    .unlcms-tandem-stack {
      grid-template-rows: minmax(4.21em, 1fr) auto minmax(4.21em, 1fr);
    }

    .unlcms-tandem-stack-text-c {
      align-items: center;
      display: flex;
      flex-direction: column;
      grid-area: 2 / 2 / 3 / -2;
      text-align: center;
    }

    .unlcms-tandem-stack-text-c .unlcms-tandem-stack-text-card {
      max-width: 42.09em;
    }

    .unlcms-tandem-stack-text-card {
      background-color: var(--bg-card);
      -webkit-clip-path: polygon(0 0,0 100%,2px 100%,2px 2px,calc(100% - 2px) 2px,calc(100% - 2px) calc(100% - 2px),2px calc(100% - 2px),2px calc(100% - 5px),calc(100% - 5px) calc(100% - 5px),calc(100% - 5px) 5px,5px 5px,5px calc(100% - 5px),2px calc(100% - 5px),2px 100%,100% 100%,100% 0);
      clip-path: polygon(0 0,0 100%,2px 100%,2px 2px,calc(100% - 2px) 2px,calc(100% - 2px) calc(100% - 2px),2px calc(100% - 2px),2px calc(100% - 5px),calc(100% - 5px) calc(100% - 5px),calc(100% - 5px) 5px,5px 5px,5px calc(100% - 5px),2px calc(100% - 5px),2px 100%,100% 100%,100% 0);
      padding: 3.16em 2.37em;
    }

    .unlcms-tandem-stack-img {
      grid-area: 1 / 1 / -1 / -1;
    }

  }

  @media only screen and (min-width: 56.12em) {

    .unlcms-tandem-stack-text-l {
      grid-area: 2 / 2 / -2 / 10;
    }

    .unlcms-tandem-stack-text-r {
      grid-area: 2 / 6 / 3 / -2;
    }

  }

  /* md 898 */
  @media only screen and (min-width: 56.12em) and (max-width: 74.83em) {

    .unlcms-tandem-stack-text-l {
      grid-column-end: 13;
    }

    .unlcms-tandem-stack-text-r {
      grid-column-start: 9;
    }

  }

  /* lg 1197 */
  @media only screen and (min-width: 74.83em) {

    .unlcms-tandem-stack-text-l {
      grid-column-end: 10;
    }

    .unlcms-tandem-stack-text-r {
      grid-column-start: 12;
    }

  }

  /* xl 1596 */
  @media only screen and (min-width: 99.78em) {

    .unlcms-tandem-stack {
      max-height: 42.09em;
      overflow-y: hidden;
    }

  }

  /*********************** Tandem Fade Styles **********************/

  .unlcms-tandem-fade {
    background-color: var(--bg-color);
  }


  /* max sm 673 */
  @media only screen and (max-width: 42.09em) {

    .unlcms-tandem-fade-text {
      grid-area: 3 / 2 / 4 / -2;
    }

    .unlcms-tandem-fade-img {
      grid-area: 1 / 1 / 2 / -1;
    }

  }

  /* sm 673 */
  @media only screen and (min-width: 42.09em) and (max-width: 56.12em) {

    .unlcms-tandem-fade-text {
      grid-area: 3 / 4 / 4 / -4;
    }

    .unlcms-tandem-fade-img {
      grid-area: 1 / 4 / 2 / -4;
    }

  }

  /* max md 898 */
  @media only screen and (max-width: 56.12em) {

    .unlcms-tandem-fade {
      grid-template-rows: auto 1.33em auto  3.16em;
    }

  }

  /* md 898 */
  @media only screen and (min-width: 56.12em) {

    .unlcms-tandem-fade {
      grid-template-rows: minmax(4.21em, 1fr) auto minmax(4.21em, 1fr);
    }

    .unlcms-tandem-fade-img::after {
      background-image: linear-gradient(var(--direction), var(--bg-color), transparent);
      content: '';
      height: 100%;
      position: absolute;
      top: 0;
      width: 33%;
      z-index: 1;
    }

    .unlcms-tandem-fade-text-l {
      grid-area: 2 / 2 / 3 / 8;
    }

    .unlcms-tandem-fade-text-l ~ .unlcms-tandem-fade-img::after {
      --direction: 90deg;
    }

    .unlcms-tandem-fade-text-r {
      grid-area: 2 / 12 / 3 / -2;
    }

    .unlcms-tandem-fade-text-r ~ .unlcms-tandem-fade-img::after {
      --direction: 270deg;
      right: 0;
    }

    .unlcms-tandem-fade-text-l ~ .unlcms-tandem-fade-img {
      grid-area: 1 / 10 / -1 / -1;
    }

    .unlcms-tandem-fade-text-r ~ .unlcms-tandem-fade-img {
      grid-area: 1 / 1 / -1 / 8;
    }

  }

  /* lg 1197 */
  @media only screen and (min-width: 74.83em) {

    .unlcms-tandem-fade-text-l ~ .unlcms-tandem-fade-img {
      grid-column-start: 11;
    }

    .unlcms-tandem-fade-text-r ~ .unlcms-tandem-fade-img {
      grid-column-end: 8;
    }

  }


/**************** Other changes ******************************/
  .unlcms-tandem-fade-img .media-entity-bundle--image,
  .unlcms-tandem-basic-img .media-entity-bundle--image,
  .unlcms-tandem-stack-img .media-entity-bundle--image {
    margin-bottom: 0;
    height: 100%;
    width: 100%;
  }

  .unlcms-tandem-fade-img img,
  .unlcms-tandem-basic-img img,
  .unlcms-tandem-stack-img img {
    /* .dcf-obj-fit-cover */
    object-fit: cover !important;
    height: 100% !important;
    width: 100% !important;
      /* .dcf-d-block */
  /* display: block !important; */
  }

  .unlcms-tandem-stack-text-card h2 {
    /* .dcf-txt-h3 */
    font-size: 1.5em !important;
    /* dcf-mt-0 */
    margin-top: 0 !important;
  }

  /* This CSS is needed when a user selects 'Center' as the stack alignment.
  Otherwise, there is a gap between the list bullet point and the text. */
  .tandem-stack-c-ul-list-style {
    list-style-position: inside;
  }

    /* TANDEM - BASIC */
  .unlcms-tandem-basic-img-grid {
    grid-template-columns: 1em auto 1em;
    grid-template-rows: 1em auto 1em;
  }

  .unlcms-tandem-basic-img-translate-xy-tr { grid-area: 1 / 2 / 3 / 4; }
  .unlcms-tandem-basic-img-translate-xy-tl { grid-area: 1 / 1 / 3 / 3; }
  .unlcms-tandem-basic-img-translate-xy-br { grid-area: 2 / 2 / 4 / 4; }
  .unlcms-tandem-basic-img-translate-xy-bl { grid-area: 2 / 1 / 4 / 3; }
