/**********************************************************
// Block >> Example
**********************************************************/
.Member-Wrapper .Block-Container-Inner {
	display: flex;
	gap: 2%;
	flex-wrap: wrap;
}


.Member-Wrapper .Block-Container-Inner:before, .Member-Wrapper .Block-Container-Inner:after { display: none; }

.Block-Board-Member {
	flex-basis: 32%;
	gap: 1em;
	background: #fff;
	padding: 30px 20px 20px;
	text-align: center;
	}

a.Block-Board-Member:hover { var(--Links); }
a.Block-Board-Member {
	color: var(--Dark);
	}

.Block-Board-Member h2 { font-size: 1.5rem; padding: 0; }

.Block-Board-Member-Image {
	position: relative;
	width: 100%;
	aspect-ratio: 1 / 1; /* or use fixed height instead */
	overflow: hidden;
	border-radius: 50%;
	width: 200px;
	margin: 0 auto;
}

a.Block-Board-Member:hover { background: var(--Dark); color: #fff; }
.Block-Board-Member-Content { padding: 20px 20px 30px; }

a.Block-Board-Member:hover .Block-Board-Member-Image img { opacity: 1; }
.Block-Board-Member-Image img {
	width: 100%;
	height: 100%;
	object-fit: cover;       /* or 'contain' if you want full image visible */
	object-position: center; /* or 'top', 'bottom', etc. */
	display: block;
}


/**********************************************************
// Media Queries
**********************************************************/

@media
all and (max-width: 950px),
all and (max-device-width: 950px)
{
	.Block-Board-Member { flex-basis: 48%; }
}

@media
all and (max-width: 600px),
all and (max-device-width: 600px)
{
	.Block-Board-Member { flex-basis: 100%; }
}