.lt-container {
  @include media-breakpoint-down(sm) {
    position: fixed;
    width: 100%;
    padding-bottom: 3.5rem;
  }
}

.x-notification-slider {
  @extend %d-flex,
          %w-100;
  margin-left: -0.25rem;
  margin-right: -0.25rem;

  .cdk-virtual-scroll-viewport {
    &::-webkit-scrollbar-track-piece,
    &::-webkit-scrollbar-track,
    &::-webkit-scrollbar  {
      width: 0;
      height: 0;
     }
  }

  .x-card-notify {
    @extend %m-2,
            %d-none;
    width: 100%;
    min-height: 8rem;

    .x-card-header .x-title {
      @extend %text-grey;

      b {
        @extend %text-default;
      }

      h6 {
        max-height: calc(1.5em * 2);
      }
    }

    .close {
      @include media-breakpoint-up(xl) {
        visibility: hidden;
      }
    }

    @include hover-focus {
      .close {
        visibility: visible;
      }
    }


    // Mobile Notification display 1
    &:nth-of-type(1) {
      @extend %d-flex;
    }

    // Tablet Notification display 2
    @include media-breakpoint-up(md) {
      width: 50%;
      max-width: 50%;

      &:nth-of-type(1),
      &:nth-of-type(2) {
        display: flex !important;
      }
    }

    // Desktop Notification display 3
    @include media-breakpoint-up(lg) {
      width: 33.333%;
      max-width: 33.333%;
      &:nth-of-type(1),
      &:nth-of-type(2),
      &:nth-of-type(3) {
        display: flex !important;
      }
    }
  }
}