.projectHero {text-align: center; padding-bottom: 20px;}
.action_links{ text-align:center;}

.second-grid.fluid-flex {
	align-items: flex-start;
}

th, td {border-bottom: 1px solid var(--medium-grey);}

/* Case Study Nav label links */
.label-link {
	color: var(--visited-color);
	outline: 1;
	font-weight: bold;
	text-decoration: none;
}

.label-link:visited { color: var(--link-color);}
.label-link:hover { color: var(--hover-color);}

/* GRID SYSTEM*/
@layer reset, theme, layout;

@layer theme {
	:root {
		--layout-fluid-min: 35ch;
		--layout-default-repeat: 5;
		--layout-default-gap: 3vmax;
		--fluid-flex-min: 14ch;
	}
}

@layer layout {
	/* Repeating grid and flexbox */
	.repeating-grid {
		--_grid-repeat: var(--grid-repeat, var(--layout-default-repeat));
		--_repeating-grid-gap: var(--grid-gap, var(--layout-default-gap));
		display: grid;
		grid-template-columns: repeat(var(--_grid-repeat), 1fr);
		gap: var(--_repeating-grid-gap);
	}

	@media all and (max-width: 575px) {
		.repeating-grid {
			grid-template-columns: 1fr;
		}
	}

	.repeating-flex {
		--_flex-repeat: var(--flex-repeat, var(--layout-default-repeat));
		--_repeating-flex-gap: var(--flex-gap, var(--layout-default-gap));
		--_gap-count: calc(var(--_flex-repeat) - 1);
		--_gap-repeater-calc: calc(var(--_repeating-flex-gap) / var(--_flex-repeat) * var(--_gap-count));
		display: flex;
		flex-wrap: wrap;
		gap: var(--_repeating-flex-gap);

		>* {
			flex: 1 1 calc((100% / var(--_flex-repeat)) - var(--_gap-repeater-calc));
		}
	}

	/* Fluid grid and flexbox */
	.fluid-grid {
		--_fluid-grid-min: var(--fluid-grid-min, var(--layout-fluid-min));
		--_fluid-grid-gap: var(--grid-gap, var(--layout-default-gap));
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(min(var(--_fluid-grid-min), 100%), 1fr));
		gap: var(--_fluid-grid-gap);
	}

	.fluid-flex {
		--_fluid-flex-min: var(--fluid-flex-min, var(--layout-fluid-min));
		--_fluid-flex-gap: var(--flex-gap, var(--layout-default-gap));
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: var(--_fluid-flex-gap);

		>* {
			flex: 1 1 var(--_fluid-flex-min);
		}
	}
.second-grid.fluid-flex > .grphx {
  flex: 0 1 300px;   /* don't grow past 280px, can shrink, basis 280px */
}

.second-grid.fluid-flex > .grphx + div {
  flex: 3 1 320px;   /* grows 3x as eagerly, min basis 300px */
}
	/* Subgrid utility */
	.subgrid-rows {
		&:has(> :nth-child(1):last-child) { --_subgrid-rows: 1; }
		&:has(> :nth-child(2):last-child) { --_subgrid-rows: 2; }
		&:has(> :nth-child(3):last-child) { --_subgrid-rows: 3; }
		&:has(> :nth-child(4):last-child) { --_subgrid-rows: 4; }
        &:has(> :nth-child(4):last-child) { --_subgrid-rows: 5; }

		>* {
			display: grid;
			gap: var(--subgrid-gap, 0);
			grid-row: auto / span var(--subgrid-rows, var(--_subgrid-rows, 5));
			grid-template-rows: subgrid;
		}
	}

	:is(.fluid-grid:not(.subgrid-rows), .repeating-grid:not(.subgrid-rows), .repeating-flex, .fluid-flex)>* {
		container: var(--grid-item-container, grid-item) / inline-size;
	}
}

@layer reset {
	*,
	*::before,
	*::after {
		box-sizing: border-box;
	}
	body {
		margin: 0;
	}
}

/* Div switcher */
.wrapper {
	width: 100%;
	padding: 0;
	position: relative;
	display: grid;
	text-align: center;
}

.project {
	-webkit-transition: all 0.2s linear;
	transition: all 0.3s linear;
}

[type="radio"]:checked,
[type="radio"]:not(:checked) {
	position: absolute;
	left: -9999px;
}

#over[type="radio"]:checked~.content label.linkOver,
#prblm[type="radio"]:checked~.content label.linkPrblm,
#prcss[type="radio"]:checked~.content label.linkPrcss,
#rslts[type="radio"]:checked~.content label.linkRslts,
#impct[type="radio"]:checked~.content label.linkImpct {
	color: var(--link-color);
	border-bottom: 3px solid var(--link-color);
	height: max-content;
}

[type="radio"]:not(:checked)+label {
	color: var(--text-color);
	border: none;
}

* [type="radio"]:checked+.content label,
* [type="radio"]:not(:checked)+.content label {
	position: relative;
	padding-left: 12px;
	padding-right: 12px;
	letter-spacing: 3px;
	cursor: pointer;
	font-size: 15px;
	text-transform: uppercase;
	font-weight: 700;
	margin-right: 10px;
	margin-left: 10px;
	-webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

* [type="radio"]:checked+.content label:after,
* [type="radio"]:not(:checked)+.content label:after {
	content: "";
	height: 30px;
	padding: 5px;
	position: absolute;
	bottom: 0;
	left: 6px;
	top: -4px;
	z-index: -1;
	-webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

[type="radio"]:not(:checked)~.content label:after {
	opacity: 0;
	width: 0;
}

[type="radio"]:checked~.content label:after {
	opacity: 1;
	width: calc(100% - 16px);
}

*[type="radio"]:checked~.content label:hover,
*[type="radio"]:not(:checked)~.content label:hover {
	color: var(--hover-color);
	border-bottom: 3px solid var(--hover-color);
	height: max-content;
}

.project.over,
.project.prblm,
.project.prcss,
.project.rslts,
.project.impct {
	opacity: 0;
	transform: scale(0);
	padding: 0;
	margin: 0;
	visibility: hidden;
	border-width: 0;
	height: 0px;
}

#over:checked~.project.over,
#prblm:checked~.project.prblm,
#prcss:checked~.project.prcss,
#rslts:checked~.project.rslts,
#impct:checked~.project.impct {
	opacity: 1;
	height: 100%;
	width: 100%;
	margin-top: 50px;
	visibility: visible;
	transform: scale(1);
	border-width: 3px;
	text-align: left;
	z-index: 1;
	display: block;
}

.grphx {
	text-align: center;
}