
.gallery-content img, .shop-content img  {
  displayx: block;
  width: 100%;
  object-fit:cover;
  height:100%;
  transition:all var(--trans-speedy) var(--trans-ease-in);
}

.gallery-content a, .shop-content a{border-radius:10px; text-decoration:none;}

.gallery-content figure, .shop-content figure{
    position: relative;
	margin: 0;
	width:100%;
	height:100%;
	display:grid;
	border-radius:10px;
	overflow:hidden;
	grid-template-areas: "card";
	box-shadow:var(--boxshadow);
}

.gallery-content figcaption, .shop-content figcaption {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0);
    color:var(--dark);
    transition:all var(--trans-speedy) var(--trans-ease-in);
	backdrop-filter:blur(3px);
	opacity:0%;
}

.gallery-content figure, .gshop-content figure{grid-area: card;}

.gallery-content figcaption::before {
	content: "\e611";
	font-family:themify;
	text-align:center;
	align-self:center;
	font-size:var(--text-5xl);
}

.gallery-content figure:hover figcaption {
    transform: translate(-50%, -50%) scale(1);
	opacity:100%;
}


.gallery-content figure:hover img{
	transform: scale(1.125);
	filter: blur(3px);
}
/* shop content borrows the same code except magnify glass changes to new window icon*/

.shop-content figcaption::before {
	content: "\e732";
	font-family:themify;
	text-align:center;
	align-self:center;
	font-size:var(--text-5xl);
}

.shop-content figure:hover figcaption {
    transform: translate(-50%, -50%) scale(1);
	opacity:100%;
}

.shop-content figure:hover img{
	transform: scale(1.125);
	filter: blur(3px);
}