.gradient-screen {
  display: flex;
  align-items: center;
  overflow: hidden;

  @include screen(md,max) {
    display: block;
  }

  > h3 {
    color: rgba(93, 73, 212, .79);
    font-size: 3.5rem;
    line-height: 1.15;
    margin: 0;
    padding-right: 2rem;
    width: 66%;
    box-sizing: border-box;
    flex-shrink: 0;

    @supports (-webkit-background-clip: text) {
      background-image: linear-gradient(90deg, rgba(45, 25, 165, 79), rgba(93, 73, 212, .79), rgba(120, 79, 203, .79));
      color: transparent;
      -webkit-background-clip: text;
      background-clip: text;
    }

    @include screen(lg,max) {
      width: 50%;
    }

    @include screen(md,max) {
      width: 100%;
    }
  }

  .avatar-slider {
    flex-grow: 1;
    max-height: 12rem;

    @include screen(md,max) {
      margin-top: 10rem;
      max-height: initial;
    }
  }
}
