/**
 * De rechterkolom van de productpagina loopt mee bij scrollen.
 *
 * De hoogte van de kolom en de afstand tot de bovenkant regelt
 * rechterkolom.js; hier staat alleen wat nodig is om te kunnen meelopen.
 * Zonder align-self rekt de kolom mee met de foto ernaast, en dan is er niets
 * om mee te lopen. Onder 768 px staan de kolommen onder elkaar en zet het
 * script de klasse er niet op.
 */

@media (min-width: 768px) {

	/* Meelopen werkt niet binnen een element dat zelf kan scrollen, en met
	   overflow-x: hidden is de body precies zo'n element. Het thema zet dat om
	   te voorkomen dat iets breders dan het scherm een balk onderin geeft. Met
	   clip wordt er net zo hard afgeknipt, alleen zonder scrollend element.
	   Deze regel geldt alleen op de productpagina, want daar wordt dit
	   stijlbestand ingeladen. */
	body.single-product {
		overflow-x: clip;
	}

	.productkolom--meelopend {
		position: sticky;
		align-self: flex-start;
		top: 16px;
	}
}