.tp-grid{
  display:grid;
  grid-template-columns:repeat(var(--tp-cols,2),1fr);
  gap:var(--tp-gap,20px);
}
.tp-item{text-align:center;}
.tp-image{position:relative;overflow:hidden;}
.tp-image img{width:100%;height:auto;display:block;transition:opacity .35s ease;-webkit-backface-visibility:hidden;backface-visibility:hidden;}
.tp-image img.back{position:absolute;top:0;left:0;opacity:0;}
.tp-image:hover img.front{opacity:0;}
.tp-image:hover img.back{opacity:1;}
.tp-title{font-size:1rem;margin-top:.6rem;}
@media (max-width:640px){
  .tp-grid{grid-template-columns:repeat(2,1fr);gap:12px;}
}