/* PROF-X — vrijstaande 3D-producten in de kleine winkelvakken. */
.products .product .jar.whey,
.products .product .jar.pre,
.products .product .jar.diet-shake,
.products .product .product-pancake {
  background-color: transparent !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
  border: 0 !important;
  box-shadow: none !important;
  filter: drop-shadow(0 17px 16px rgba(0,0,0,.62));
  transform: perspective(780px) rotateY(-7deg) rotateX(2deg);
  transform-style: preserve-3d;
  transition: transform .28s ease, filter .28s ease;
}

.products .product .jar.whey { background-image: url('whey-full-wrap-3d.png') !important; }
.products .product .jar.pre { background-image: url('pre-workout-full-wrap-3d.png') !important; }
.products .product .jar.diet-shake { background-image: url('diet-shake-full-wrap-3d.png') !important; }
.products .product .product-pancake { background-image: url('protein-pancake-white-closure-3d.png') !important; }

.products .product:hover .jar.whey,
.products .product:hover .jar.pre,
.products .product:hover .jar.diet-shake,
.products .product:hover .product-pancake {
  filter: drop-shadow(0 24px 20px rgba(0,0,0,.78));
  transform: perspective(780px) rotateY(-1deg) rotateX(0) translateY(-6px) scale(1.035);
}

@media (max-width: 760px) {
  .products .product .jar.whey,
  .products .product .jar.pre,
  .products .product .jar.diet-shake,
  .products .product .product-pancake {
    filter: drop-shadow(0 11px 10px rgba(0,0,0,.55));
    transform: perspective(650px) rotateY(-5deg) rotateX(1deg);
  }
}
