figure.effect-julia {
background: #2f3238
}
figure.effect-julia img {
max-width: none;
-webkit-transition: opacity 1s, -webkit-transform 1s;
transition: opacity 1s, transform 1s;
-webkit-backface-visibility: hidden;
-ms-backface-visibility: hidden;
backface-visibility: hidden
}
figure.effect-julia figcaption {
text-align: left
}
figure.effect-julia h2 {
position: relative;
padding: .5em 0
}
figure.effect-julia .effect-description {
display: inline-block;
margin: 0 0 .25em;
padding: .4em 1em;
background: rgba(255, 255, 255, .9);
color: #2f3238;
text-transform: none;
font-weight: 500;
font-size: 75%;
-webkit-transition: opacity .35s, -webkit-transform .35s;
transition: opacity .35s, transform .35s;
-webkit-transform: translate3d(-360px, 0, 0);
-ms-transform: translate3d(-360px, 0, 0);
transform: translate3d(-360px, 0, 0)
}
figure.effect-julia .effect-description:first-child {
-webkit-transition-delay: .15s;
transition-delay: .15s
}
figure.effect-julia .effect-description:nth-of-type(2) {
-webkit-transition-delay: .1s;
transition-delay: .1s
}
figure.effect-julia .effect-description:nth-of-type(3) {
-webkit-transition-delay: .05s;
transition-delay: .05s
}
figure.effect-julia:hover .effect-description:first-child {
-webkit-transition-delay: 0s;
transition-delay: 0s
}
figure.effect-julia:hover .effect-description:nth-of-type(2) {
-webkit-transition-delay: .05s;
transition-delay: .05s
}
figure.effect-julia:hover .effect-description:nth-of-type(3) {
-webkit-transition-delay: .1s;
transition-delay: .1s
}
figure.effect-julia:hover img {
opacity: .4;
-webkit-transform: scale3d(1.1, 1.1, 1);
-ms-transform: scale3d(1.1, 1.1, 1);
transform: scale3d(1.1, 1.1, 1)
}
figure.effect-julia:hover .effect-description {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0)
}