/* Source: https://css-tricks.com/books/greatest-css-tricks/scroll-shadows/ */
.scroll-shadows {
	--bg: rgb(var(--bgRGB));
	--bgTrans: rgba(var(--bgRGB), 0);

	--shadow: rgba(255, 255, 255, 0.5);

	background:
		/* Shadow Cover TOP */
		linear-gradient(var(--bg) 30%, var(--bgTrans)) center top,

		/* Shadow Cover BOTTOM */
		linear-gradient(var(--bgTrans), var(--bg) 70%) center bottom,

		/* Shadow TOP */
		radial-gradient(farthest-side at 50% 0, var(--shadow), rgba(0, 0, 0, 0)) center top,

		/* Shadow BOTTOM */
		radial-gradient(farthest-side at 50% 100%, var(--shadow), rgba(0, 0, 0, 0)) center bottom;

	background-repeat: no-repeat;
	background-size: 100% 40px, 100% 40px, 100% 14px, 100% 14px;
	background-attachment: local, local, scroll, scroll;
}
