.customizableContent {
  position: relative;
  display: flex;
  flex-direction: column;

  .moduleBackground {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: var(--arrangeBack);

    &.solidColorWhite { background-color: var(--white); }
    &.solidColorBlue { background-color: var(--holtBlue); }
    &.solidColorLightBlue { background-color: var(--holtLightBlue); }

    img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  }

  .innerWrapper {
    position: relative;
    display: block;

    .contentBlocks {
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      gap: clamp(24px, 4vw, 100px);
      position: relative;
      width: 100%;
      z-index: var(--arrangeFront);

      .contentBlock {
        display: flex;
        flex-direction: column;
        gap: 15px;

        /* Mobile | Every block stacks full width */
        &.width-1-4,
        &.width-1-3,
        &.width-1-2,
        &.width-full { grid-column: span 12; }

        /* Tablet | Fractional blocks go 2-up, full stays full */
        @media (min-width: 768px) {
          &.width-1-4  { grid-column: span 6; }
          &.width-1-3  { grid-column: span 6; }
          &.width-1-2  { grid-column: span 6; }
          &.width-full { grid-column: span 12; }
        }

        /* Desktop | True fractional widths */
        @media (min-width: 1024px) {
          &.width-1-4  { grid-column: span 3; }
          &.width-1-3  { grid-column: span 4; }
          &.width-1-2  { grid-column: span 6; }
          &.width-full { grid-column: span 12; }
        }

        &.blockBackgroundGrey {
          background-color: var(--grey);
          padding: clamp(24px, 4vw, 50px);

          @media (min-width: 1024px) { padding: clamp(24px, 4vw, 100px); }
        }

        &.contentAlignLeft {
          align-items: flex-start;
        }
        
        &.contentAlignCenter {
          align-items: center;

          img {
            display: inline-block;
          }
        }
        
        &.contentAlignRight {
          align-items: flex-end;
        }

        &.contentAlignUnset {
          align-items: normal;
        }

        &.contentAlignVerticalTop { justify-content: flex-start; }
        &.contentAlignVerticalCenter { justify-content: center; }
        &.contentAlignVerticalBottom { justify-content: flex-end; }

        &.textColorWhite { h1, h2, h3, h4, h5, h6, p, ol, ul { color: var(--white) }}
        &.textColorBlack { h1, h2, h3, h4, h5, h6, p, ol, ul { color: var(--Black) }}
        &.textColorBlue { h1, h2, h3, h4, h5, h6, p, ol, ul { color: var(--holtBlue) }}
        &.textColorLightBlue { h1, h2, h3, h4, h5, h6, p, ol, ul { color: var(--holtLightBlue) }}

        @media (max-width: 767px) {
          &.borderLeftWhite { border-bottom: 2px solid var(--white); padding-bottom: clamp(24px, 4vw, 50px); }
          &.borderRightWhite { border-bottom: 2px solid var(--white); padding-bottom: clamp(24px, 4vw, 50px); }
          &.borderLeftLightBlue { border-bottom: 2px solid var(--holtLightBlue); padding-bottom: clamp(24px, 4vw, 50px); }
          &.borderRightLightBlue { border-bottom: 2px solid var(--holtLightBlue); padding-bottom: clamp(24px, 4vw, 50px); }
        }

        @media (min-width: 768px) {
          &.borderLeftWhite { border-left: 2px solid var(--white); padding-left: clamp(24px, 4vw, 100px); }
          &.borderRightWhite { border-right: 2px solid var(--white); padding-right: clamp(24px, 4vw, 100px); }
          &.borderLeftLightBlue { border-left: 2px solid var(--holtLightBlue); padding-left: clamp(24px, 4vw, 100px); }
          &.borderRightLightBlue { border-right: 2px solid var(--holtLightBlue); padding-right: clamp(24px, 4vw, 100px); }
        }

        h1, h2, h3, h4, h5, h6, p, ul, ol {
          width: 100%;
          max-width: 800px;
        }

        p {
          margin: 0px;
        }

        img {
          max-width: 100%;
          max-height: 500px;
          object-fit: cover;

          @media (min-width: 768px) {
            max-height: none;
          }
        }
      }
    }
  }
}