figure.effect-hera {
	background: #303fa9
}

figure.effect-hera h2 {
	font-size: 158.75%
}

figure.effect-hera h2,
figure.effect-hera .effect-description {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transition: opacity .35s, -webkit-transform .35s;
	transition: opacity .35s, transform .35s;
	-webkit-transform: translate3d(-50%, -50%, 0);
	-ms-transform: translate3d(-50%, -50%, 0);
	transform: translate3d(-50%, -50%, 0);
	-webkit-transform-origin: 50%;
	-ms-transform-origin: 50%;
	transform-origin: 50%
}

figure.effect-hera figcaption::before {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 200px;
	height: 200px;
	border: 2px solid #fff;
	content: '';
	opacity: 0;
	-webkit-transition: opacity .35s, -webkit-transform .35s;
	transition: opacity .35s, transform .35s;
	-webkit-transform: translate3d(-50%, -50%, 0) rotate3d(0, 0, 1, -45deg) scale3d(0, 0, 1);
	-ms-transform: translate3d(-50%, -50%, 0) rotate3d(0, 0, 1, -45deg) scale3d(0, 0, 1);
	transform: translate3d(-50%, -50%, 0) rotate3d(0, 0, 1, -45deg) scale3d(0, 0, 1);
	-webkit-transform-origin: 50%;
	-ms-transform-origin: 50%;
	transform-origin: 50%
}

figure.effect-hera .effect-description {
	width: 100px;
	text-transform: none
}

figure.effect-hera .effect-description a {
	color: #fff
}

figure.effect-hera .effect-description a:focus,
figure.effect-hera .effect-description a:hover {
	opacity: .6
}

figure.effect-hera .effect-description {
	opacity: 0;
	-webkit-transition: opacity .35s, -webkit-transform .35s;
	transition: opacity .35s, transform .35s
}

figure.effect-hera .effect-description a:first-child i {
	-webkit-transform: translate3d(-60px, -60px, 0);
	-ms-transform: translate3d(-60px, -60px, 0);
	transform: translate3d(-60px, -60px, 0)
}

figure.effect-hera .effect-description a:nth-child(2) i {
	-webkit-transform: translate3d(60px, -60px, 0);
	-ms-transform: translate3d(60px, -60px, 0);
	transform: translate3d(60px, -60px, 0)
}

figure.effect-hera .effect-description a:nth-child(3) i {
	-webkit-transform: translate3d(-60px, 60px, 0);
	-ms-transform: translate3d(-60px, 60px, 0);
	transform: translate3d(-60px, 60px, 0)
}

figure.effect-hera .effect-description a:nth-child(4) i {
	-webkit-transform: translate3d(60px, 60px, 0);
	-ms-transform: translate3d(60px, 60px, 0);
	transform: translate3d(60px, 60px, 0)
}

figure.effect-hera:hover figcaption::before {
	opacity: 1;
	-webkit-transform: translate3d(-50%, -50%, 0) rotate3d(0, 0, 1, -45deg) scale3d(1, 1, 1);
	-ms-transform: translate3d(-50%, -50%, 0) rotate3d(0, 0, 1, -45deg) scale3d(1, 1, 1);
	transform: translate3d(-50%, -50%, 0) rotate3d(0, 0, 1, -45deg) scale3d(1, 1, 1)
}

figure.effect-hera:hover h2 {
	opacity: 0;
	-webkit-transform: translate3d(-50%, -50%, 0) scale3d(0.8, .8, 1);
	-ms-transform: translate3d(-50%, -50%, 0) scale3d(0.8, .8, 1);
	transform: translate3d(-50%, -50%, 0) scale3d(0.8, .8, 1)
}

figure.effect-hera:hover .effect-description {
	-webkit-transform: translate3d(-50%, -50%, 0) scale3d(1, 1, 1);
	-ms-transform: translate3d(-50%, -50%, 0) scale3d(1, 1, 1);
	transform: translate3d(-50%, -50%, 0) scale3d(1, 1, 1);
	opacity: 1
}