$rsce_hero_color-bright: $ls-color-white !default;
$rsce_hero_color-dark: $ls-color-black !default;
$rsce_hero_opacity: 30% !default;


.demo {
  .ce_rsce_hero {

    .text-container {

      .text-content {

        a {
          @include ls_defaultButton;
          @include ls_dynamicBackground;
        }
      }
    }

    &.imageOption {

      .image-wrapper {

        &::after {
          content: '';
          position: absolute;
          top: 0;
          bottom: 0;
          left: 0;
          right: 0;
          background-color: rgba($rsce_hero_color-dark, $rsce_hero_opacity);
        }
      }

      .text-content {
        color: $rsce_hero_color-bright;
      }
    }

    &:not(.imageOption) {

      .text-box-wrapper {

        &::before {
          content: '';
          position: absolute;
          top: 0;
          bottom: 0;
          left: 0;
          right: 0;
          background-color: rgba($rsce_hero_color-dark, $rsce_hero_opacity);
        }
      }

      .text-content {
        color: $rsce_hero_color-bright;
      }
    }
  }
}