figure.effect-ruby {
	background-color: #17819c
}

figure.effect-ruby img {
	opacity: .7;
	-webkit-transition: opacity .35s, -webkit-transform .35s;
	transition: opacity .35s, transform .35s;
	-webkit-transform: scale(1.15);
	-ms-transform: scale(1.15);
	transform: scale(1.15)
}

figure.effect-ruby:hover img {
	opacity: .5;
	-webkit-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1)
}

figure.effect-ruby h2 {
	margin-top: 20%;
	-webkit-transition: -webkit-transform .35s;
	transition: transform .35s;
	-webkit-transform: translate3d(0, 20px, 0);
	-ms-transform: translate3d(0, 20px, 0);
	transform: translate3d(0, 20px, 0)
}

figure.effect-ruby .effect-description {
	margin: 1em 0 0;
	padding: 3em;
	border: 1px solid #fff;
	opacity: 0;
	-webkit-transition: opacity .35s, -webkit-transform .35s;
	transition: opacity .35s, transform .35s;
	-webkit-transform: translate3d(0, 20px, 0) scale(1.1);
	-ms-transform: translate3d(0, 20px, 0) scale(1.1);
	transform: translate3d(0, 20px, 0) scale(1.1)
}

figure.effect-ruby:hover h2 {
	-webkit-transform: translate3d(0, 0, 0);
	-ms-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0)
}

figure.effect-ruby:hover .effect-description {
	opacity: 1;
	-webkit-transform: translate3d(0, 0, 0) scale(1);
	-ms-transform: translate3d(0, 0, 0) scale(1);
	transform: translate3d(0, 0, 0) scale(1)
}