.wrap-block.project-gallery {
	--theme-grid-margin: 13px; /* Override this to adjust grid-margin */
}

.project-gallery {
	background-image: url( ../../../images/projects-gallery-back.webp );
	background-position: top center;
	background-repeat: no-repeat;
	background-size: cover;
}

.no-webp .project-gallery {
	background-image: url( ../../../images/projects-gallery-back.jpg );
}

.project-gallery .vertical-padding {
	padding-top: clamp(15px, calc(100vw * (45/1440)), 45px);
	padding-bottom: clamp(0px, calc(100vw * (30/1440)), 30px);
}

.project-gallery h2 {
	font-size: clamp(22px, calc(100vw * (42/1440)), 42px);
	line-height: 1;
	color: black;
	text-transform: uppercase;
	font-weight: 900;
}

.project-gallery .category-filter {
	--theme-grid-margin: 16px;
	padding: clamp(5px, calc(100vw * (20/1440)), 20px) 0 clamp(10px, calc(100vw * (35/1440)), 35px);
}

.project-gallery .category-filter a {
	display: inline-block;
	font-size: 13px;
	line-height: 1;
	font-weight: 700;
	color: white;
	text-transform: uppercase;
	text-decoration: none;
	background-color: var(--theme-color-secondary);
	border-radius: 8px;
	-moz-background-clip: padding;
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
	transition: all 0.3s ease-out;
	padding: 10px;
}

.project-gallery .category-filter a:hover,
.project-gallery .category-filter a:focus-within,
.project-gallery .category-filter a.active {
	background-color: var(--theme-color-primary);
}

.project-gallery .projects .project {
	transition: all 0.3s ease-out;
	margin-bottom: clamp(10px, calc(100vw * (26/1440)), 26px);
}

.project-gallery .projects .project:hover,
.project-gallery .projects .project:focus-within {
	transform: scale(1.025);
}

/*= Responsive Styles
-------------------------------------------------------------- */
@media only screen and (max-width: 1440px) { /* Template Width */
	
}
@media only screen and (max-width: 1023px) { /* Medium Breakpoint */
	
}
@media only screen and (max-width: 639px) { /* Small Breakpoint */
	
}