// ============================================================================
// :: Scroll
// ============================================================================
/**
 * Scope defined for visualising the scroll layout in the layout section of
 * the styleguides.
 */

// ============================================================================
// :: Root
// ============================================================================
.s-scroll {
  @include respond-to($bp-breakpoint-mobile-base) {
    position: relative;
    height: 100vh;
  }

  .l-scroll {
    padding: 3rem;

    border: 0.1rem dashed black;
  }

  .l-scroll__content,
  .l-scroll__bottom {
    padding: 3rem;

    border: 0.1rem dashed darken($bp-border-color-base, 20%);
  }
}