/* ==========================
FADE UP
========================== */

.reveal{

opacity:0;
transform:translateY(60px);
transition:all .8s ease;

}

.reveal.active{

opacity:1;
transform:translateY(0);

}

/* ==========================
ZOOM
========================== */

.zoom{

opacity:0;
transform:scale(.9);
transition:.8s;

}

.zoom.active{

opacity:1;
transform:scale(1);

}

/* ==========================
LEFT
========================== */

.left{

opacity:0;
transform:translateX(-80px);
transition:.8s;

}

.left.active{

opacity:1;
transform:translateX(0);

}

/* ==========================
RIGHT
========================== */

.right{

opacity:0;
transform:translateX(80px);
transition:.8s;

}

.right.active{

opacity:1;
transform:translateX(0);

}

/* ==========================
HOVER CARD
========================== */

.category-card,
.product-card,
.why-card{

transition:.35s;

}

.category-card:hover,
.product-card:hover,
.why-card:hover{

transform:translateY(-10px);
box-shadow:0 20px 45px rgba(0,0,0,.12);

}

/* ==========================
BUTTON
========================== */

.btn-primary,
.btn-secondary{

transition:.35s;

}

.btn-primary:hover{

transform:translateY(-3px);

}

.btn-secondary:hover{

transform:translateY(-3px);

}

/* ==========================
IMAGE
========================== */

.product-image img{

transition:.5s;

}

.product-card:hover img{

transform:scale(1.05);

}