/**
 * Gel 2022.0
 * Gallery Stylesheet
 * @version 2022.0.1
 * @modified 2022-02-10 by Grant Mosier
 */

/*
font-family: Raleway, Verdana, Helvetica, sans-serif;
Red: #363845;
Gray: #404545;
Khaki: #B2B0A4;
Gold: #FFE8AA;
*/

/* LIST OF GALLERIES */
.gallery-container {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
/* Show galleries three wide by default. */
.galleries-list-item {
	flex: 0 0 30%;
	position: relative;
	width: 30%;
	display: inline-block;
	margin-bottom: 2em;
}
/* If there are two galleries or four galleries, show two wide. */
.galleries-list-item:nth-last-child(even):first-child,
.galleries-list-item:nth-last-child(even):first-child ~ .galleries-list-item {
	flex: 0 0 48%;
	width: 48%;
}
.gallery-list-thumb {
	width: 8em;
	margin-right: 1.5em;
	background: none;
}
.gallery-list-thumb img {
	width: 100%;
}
.gallery-title-desc {
	width: 100%;
	font-size: .9em;
	margin-top: .5em;
	position: relative;
	z-index: 1;
}
.gallery-title-desc h2 {
	margin: 0 0 .2em;
	font-size: 1.5em;
}
.gallery-title-desc a {
	font-style: normal;
}

@media screen and (max-width: 768px) {
	.galleries-list-item {
		flex: 0 0 48%;
		width: 48%;
		margin-bottom: 1.5em;
	}
}

@media screen and (max-width: 600px) {
	.gallery-list-thumb {
		width: 100%;
		margin: 0 0 1em;
	}
	.gallery-list-thumb img {
		max-width: 300px;
	}
}

@media screen and (max-width: 432px) {
	.gallery-container {
		justify-content: center;
		text-align: center;
	}
	.galleries-list-item,
	.galleries-list-item:nth-last-child(even):first-child,
	.galleries-list-item:nth-last-child(even):first-child ~ .galleries-list-item {
		flex: 0 0 92%;
		width: 92%;
		margin-bottom: 2.5em;
	}
}

/* GALLERY */
.gallery {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	column-gap: 2%;
	row-gap: 2%;
}
.gallery-image {
	position: relative;
}
.std-width-ctnr h2:first-child {
	margin-top: .3em;
}
.gallery img {
	width: 100%;
}
.gallery p {
	margin: 0;
	font-size: 1.15em;
}
#lbPrevHov, #lbNextHov {
	-moz-transition: none;
	-webkit-transition: none;
	transition: none;
}
@media screen and (max-width: 1024px) {
	.gallery {
		grid-template-columns: 1fr 1fr;
		row-gap: 1%;
	}
}
@media screen and (max-width: 600px) {
	.gallery {
		grid-template-columns: 1fr;
		row-gap: .5%;
	}
}