
.lit-tile{
background: #FFF;
}

.art-tile{
background: #FFF;
}

.tht-tile{
background: #FFF;
}

.stg-tile{
background: #fff;
}

.tileholder{
display: inline-block;
width: 49%;

min-height: 9em;

}

.tile{
display: inline-block;
width: 100%;
margin-left: 0.6%;
min-height: 9em;
border:thick 2px #900;
transform-style: preserve-3d;
transition: all 1s;
-webkit-transform-style: preserve-3d;
-webkit-transition: all 1s;
box-shadow: 2px 2px 10px black;


}

.tile figure{
position: relative;
font-size: 1.3rem;

}


.tile figure figcaption {
position: absolute;
width: 100%; height: 100%; top: 0;
-webkit-transform: rotateY(.5turn) translateZ(1px);
-moz-transform: rotateY(.5turn) translateZ(1px);
-o-transform: rotateY(.5turn) translateZ(1px);
-ms-transform: rotateY(.5turn) translateZ(1px);
transform: rotateY(.5turn) translateZ(1px);
background: rgba(255,255,255,0.9);
text-align: center;

opacity: 0;

transition: 1s .5s opacity;
-webkit-transition: 1s .5s opacity;
}

.tileholder:hover .tile{
	transform: rotateY(.5turn);
	-webkit-transform: rotateY(.5turn);
	transition: 1s rotateY .1s opacity;
	-webkit-transition: 1s rotateY .1s opacity;
	background: rgba(180,180,180,0.5);
}
.tileholder:hover .tile img{
opacity: 0;
}

.tileholder:hover figure figcaption {
	opacity: 100;
}