:root {

	--grid-base: 15vw; /* grid-base determines the size of the grid. Pixel units also work */
	--grid-spacer: 3vw;
	--hamburger-track-width: 7vw;	/* hamburger option is position fixed - allow for its vertical track */

	/* primary fontsize: applies to all elements in your html with the .all-grid--uifont class */
	--uifontsize: 1.25rem; /* var(--h4) 4vmin = loud, 1.5vmin = quiet, other units work too */
	--type-weight: 400;


	/* typography: limited to containers with the .typography class */

	--type-measure: clamp(48ch, 50vw, 60ch);
	--baseline: 1.5rem;
// https://type-scale.com/?size=16&scale=1.250&text=A%20Visual%20Type%20Scale&font=Montserrat&fontweight=400&bodyfont=body_font_default&bodyfontweight=400&lineheight=1.75&backgroundcolor=%23ffffff&fontcolor=%23000000&preview=false
	--h1: 3.052rem;
	--h2: 2.441rem;
	--h3: 1.953rem;
	--h4: 1.25rem;
	--h5: 1rem;


	/* Colours -- see http://all-grid.all-sorts.biz/about/colour-palette */

	/* Text colours */

	--headingColour: var(--black);
	--bodyColour: var(--black);
	--linkColour: var(--black);
	--hoverColour: var(--grey);
	--captionColour: white;
	--selectionColour: var(--black);
	--menuTextColour: var(--charcoal); /* used for hamburger menu text only */

	/* Background colours */

	--backgroundColour: white;
	--menuBackgroundColour: var(--yellow); /* used for hamburger menu background only */
	--footerBackgroundColour: var(--backgroundColour);
	--codeBackgroundColour: var(--white);


	/* Fonts */

	--sans: "Montserrat", "Gotham Light", sans-serif;
	--serif: Baskerville, Georgia, serif;
	--baseFont: var(--sans);
	--headingFont: var(--sans); /* typically headings within an excerpt or body field (all-grid uses .all-grid--uifont for most headings */

}



	/* Background colour mix (used for grid items without article images) */

.bg--mix:nth-child(5n+1) {
		background-color: var(--olive);
}
.bg--mix:nth-child(5n+2) {
		background-color: var(--green2);
}
.bg--mix:nth-child(5n+3) {
		background-color: var(--orange);
}
.bg--mix:nth-child(5n+4) {
		background-color: var(--purple);
}
.bg--mix:nth-child(5n+5) {
		background-color: var(--redbeige);
}


/* add other css overrides to the main all-grid stylesheet here eg.

	.all-grid {
		padding-left: var(--grid-spacer);
		padding-right: var(--grid-spacer);
	}
*/