.cromo_album {
  position: absolute;width:24.7%;height:24.2%;
}
.cromo_albumH {
  position: absolute;width:33.8%;height:17.8%;
}
.cromo_album img, .cromo_albumH img {
  width:100%;
  height:100%;
  display: block;
}

/* Vivify — micro animation library subset used by Netcrom album */
.vivify {
  -webkit-animation-duration: .8s;
  animation-duration: .8s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

/* jumpInLeft — used when sticking a card into the album */
.jumpInLeft {
  -webkit-animation-name: jumpInLeft;
  animation-name: jumpInLeft;
  -webkit-animation-timing-function: cubic-bezier(0.25,0.46,0.45,0.94);
  animation-timing-function: cubic-bezier(0.25,0.46,0.45,0.94);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
@keyframes jumpInLeft {
  0%   { opacity:0; -webkit-transform:translateX(-80px) scale(0.7) rotate(-8deg); transform:translateX(-80px) scale(0.7) rotate(-8deg); }
  60%  { opacity:1; -webkit-transform:translateX(10px) scale(1.05) rotate(2deg); transform:translateX(10px) scale(1.05) rotate(2deg); }
  80%  { -webkit-transform:translateX(-5px) scale(0.98) rotate(-1deg); transform:translateX(-5px) scale(0.98) rotate(-1deg); }
  100% { opacity:1; -webkit-transform:translateX(0) scale(1) rotate(0); transform:translateX(0) scale(1) rotate(0); }
}

/* fadeInTop — panel sliding in from top */
.fadeInTop {
  -webkit-animation-name: fadeInTop;
  animation-name: fadeInTop;
}
@keyframes fadeInTop {
  0%   { opacity:0; -webkit-transform:translateY(-40px); transform:translateY(-40px); }
  100% { opacity:1; -webkit-transform:translateY(0); transform:translateY(0); }
}

/* fadeOutTop — panel sliding out to top */
.fadeOutTop {
  -webkit-animation-name: fadeOutTop;
  animation-name: fadeOutTop;
}
@keyframes fadeOutTop {
  0%   { opacity:1; -webkit-transform:translateY(0); transform:translateY(0); }
  100% { opacity:0; -webkit-transform:translateY(-40px); transform:translateY(-40px); }
}

/* fadeInRight */
.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}
@keyframes fadeInRight {
  0%   { opacity:0; -webkit-transform:translateX(40px); transform:translateX(40px); }
  100% { opacity:1; -webkit-transform:translateX(0); transform:translateX(0); }
}

/* fadeOutRight */
.fadeOutRight {
  -webkit-animation-name: fadeOutRight;
  animation-name: fadeOutRight;
}
@keyframes fadeOutRight {
  0%   { opacity:1; -webkit-transform:translateX(0); transform:translateX(0); }
  100% { opacity:0; -webkit-transform:translateX(40px); transform:translateX(40px); }
}

/* d-none helper */
.d-none { display: none !important; }
