figure.effect-goliath {
background: #df4e4e
}
figure.effect-goliath h2,
figure.effect-goliath img {
-webkit-transition: -webkit-transform .35s;
transition: transform .35s
}
figure.effect-goliath img {
-webkit-backface-visibility: hidden;
-ms-backface-visibility: hidden;
backface-visibility: hidden
}
figure.effect-goliath h2,
figure.effect-goliath .effect-description {
position: absolute;
bottom: 0;
left: 0;
padding: 30px
}
figure.effect-goliath .effect-description {
text-transform: none;
font-size: 90%;
opacity: 0;
-webkit-transition: opacity .35s, -webkit-transform .35s;
transition: opacity .35s, transform .35s;
-webkit-transform: translate3d(0, 50px, 0);
-ms-transform: translate3d(0, 50px, 0);
transform: translate3d(0, 50px, 0)
}
figure.effect-goliath:hover img {
-webkit-transform: translate3d(0, -80px, 0);
-ms-transform: translate3d(0, -120px, 0);
transform: translate3d(0, -120px, 0)
}
figure.effect-goliath:hover h2 {
-webkit-transform: translate3d(0, -100px, 0);
-ms-transform: translate3d(0, -100px, 0);
transform: translate3d(0, -100px, 0)
}
figure.effect-goliath:hover .effect-description {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0)
}