/* Site overrides, loaded after default.css */

/* Line text up with the images: default.css insets headings and paragraphs by 20px each side, but not images */
.content h1,
.content p {
	padding-left: 0;
	padding-right: 0;
}

.content h2 {
	margin-left: 0;
	margin-right: 0;
}

.content h3 {
	margin-left: 0;
	margin-right: 0;
}

/* lists in page content start at the same edge, with bullets inside */
.content section ul:not(.list) {
	margin-left: 0;
}

/* buttons (e.g. "More info..." on the home page) were indented to match the old text inset */
.content a.button {
	margin-left: 0;
}

/* below the 750px breakpoint the grid columns have no padding, so give page content a gutter
   (matching the breadcrumb) that text and images share; .row.pad rows already have one */
@media screen and (max-width: 749px) {
	.content > .row:not(.pad) > [class*="w-"] {
		padding-left: 20px;
		padding-right: 20px;
	}
}

/* contact forms: labels and fields start at the same edge as the page text */
.content fieldset.row > [class*="w-"] {
	padding-left: 0;
	padding-right: 0;
}

/* on wider screens form rows count as nested grid rows and get -10px side margins (and a divider
   inset 10px to match); keep them inside the text column instead */
@media screen and (min-width: 750px) {
	.content fieldset.row {
		margin-left: 0;
		margin-right: 0;
	}

	.content fieldset.row::before {
		left: 0;
		right: 0;
	}

	.content fieldset.row > .w-4 {
		padding-right: 20px;
	}
}

/* home page: same 40px gap below the last row of nursery cards as between the rows */
.content.home {
	padding-bottom: 40px;
}
