@charset "UTF-8";

/*--------------------------------------------------------------
1. Sticky video sidebar
----------------------------------------------------------------*/
.container.scroller-container {
  display:flex;
	flex-direction: column; /* Default: Stack vertically */
	gap: 1rem; /* Optional spacing */
}
.scroll-item {
	position:sticky;
	top:10px;
}

.container.scroller-container .content {
	order: 2; /* Default: Content below Sidebar */
}

.container.scroller-container .sidebar {
	order: 1; /* Default: Sidebar above Content */
}

@media (min-width: 768px) {
	.container.scroller-container {
		flex-direction: row; /* Arrange items side by side on larger screens */
	}

	.container.scroller-container .content {
		order: 1; /* Content comes first on desktop */
		flex: 2; /* Optional: make content take more space */
	}

	.container.scroller-container .sidebar {
		order: 2; /* Sidebar comes second on desktop */
		flex: 1; /* Optional: sidebar takes less space */
	}		
}