/* CHANGE DIMENSIONS HERE */
.tileHoverEffectFold .slice{
	width: 75px; /*width of one slice, must be the total width of the tile divided by 4*/
}
.tileHoverEffectFold .view-back {
	width: 35%; /*area available for text */
}
.tileHoverEffectFold .s2, 
.tileHoverEffectFold .s3,
.tileHoverEffectFold .s4 {
	margin-left:75px; /* must be the same as the width of one slice */
}
.tileHoverEffectFold .s1 {
	background-position: 0px 0px;
}
.tileHoverEffectFold .s2 {
	background-position: -75px 0px; /*must be the negative of the width of the slice*/
}
.tileHoverEffectFold .s3 {
	background-position: -150px 0px;/*must be the negative of the width*2 of the slice*/
}
.tileHoverEffectFold .s4 {
	background-position: -225px 0px;/*must be the negative of the width*3 of the slice*/
}
.tileHoverEffectFold .overlay {
	width: 75px; /* must be the same as the slice width */
}
.tileHoverEffectFold:hover .s2n,
.tileHoverEffectFold:hover .s3n, 
.tileHoverEffectFold:hover .s4n{
	margin-left:74px; /* must be the slice width -1 */
}

/* DO NOT CHANGE */
.tileHoverEffectFoldHover{
	-webkit-perspective: 500px;
	-moz-perspective: 500px;
	-o-perspective: 500px;
	-ms-perspective: 500px;
	perspective: 500px;
	overflow:visible;
}
.tileHoverEffectFold .slice{
	height: 100%;
	z-index: 10;	
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	transform-style: preserve-3d;	
}
.tileHoverEffectFoldHover .slice{
	-webkit-transform-origin: left center;
	-moz-transform-origin: left center;
	-o-transform-origin: left center;
	-ms-transform-origin: left center;
	transform-origin: left center;	
	-webkit-transition: -webkit-transform 200ms;
	-moz-transition: -moz-transform 200ms;
	-o-transition: -o-transform 200ms;
	-ms-transition: -ms-transform 200ms;
	transition: transform 200ms;	
}
.tileHoverEffectFold .view-back {
	position: absolute;
	right: 0;	height: 100%;
	display: block;
	float: right;
	padding: 5px 20px 5px;
	text-align: right;
	font-size: 16px;
	z-index: 0;
}
.tileHoverEffectFold .overlay {
	height: 100%;
	opacity: 0;
	position: absolute;
	-webkit-transition: opacity 200ms;
	-moz-transition: opacity 200ms;
	-o-transition: opacity 200ms;
	-ms-transition: opacity 200ms;
	transition: opacity 200ms;
}
.tileHoverEffectFold:hover .overlay {
	opacity: 1;
}
.tileHoverEffectFold img {
	position: absolute;
	z-index:1;
}
.tileHoverEffectFoldHover .s2n{
	z-index:101;
	-webkit-transform: rotate3d(0,1,0,-63deg);
	-moz-transform:  rotate3d(0,1,0,-63deg);
	-o-transform:  rotate3d(0,1,0,-63deg);
	-ms-transform:  rotate3d(0,1,0,-63deg);
	transform:  rotate3d(0,1,0,-63deg);
}
.tileHoverEffectFoldHover .s3n{
		z-index:101;
	-webkit-transform:  rotate3d(0,1,0,126deg);
	-moz-transform:  rotate3d(0,1,0,126deg);
	-o-transform:  rotate3d(0,1,0,126deg);
	-ms-transform:  rotate3d(0,1,0,126deg);
	transform:  rotate3d(0,1,0,126deg);
}
.tileHoverEffectFoldHover .s4n{
		z-index:101;
	-webkit-transform:  rotate3d(0,1,0,-126deg);
	-moz-transform:  rotate3d(0,1,0,-126deg);
	-o-transform:  rotate3d(0,1,0,-126deg);
	-ms-transform:  rotate3d(0,1,0,-126deg);
	transform:  rotate3d(0,1,0,-126deg);
}
.tileHoverEffectFoldHover .s1 > .overlay {
	background: -moz-linear-gradient(right, rgba(0,0,0,0.05) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(right, rgba(0,0,0,0.05) 0%,rgba(0,0,0,0) 100%);
	background: -o-linear-gradient(right, rgba(0,0,0,0.05) 0%,rgba(0,0,0,0) 100%);
	background: -ms-linear-gradient(right, rgba(0,0,0,0.05) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(right, rgba(0,0,0,0.05) 0%,rgba(0,0,0,0) 100%);
}
.tileHoverEffectFoldHover .s2 > .overlay {
	background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255, 255, 255, 0.2) 100%);
	background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255, 255, 255, 0.2) 100%);
	background: -o-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255, 255, 255, 0.2) 100%);
	background: -ms-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255, 255, 255, 0.2) 100%);
	background: linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255, 255, 255, 0.2) 100%);
}
.tileHoverEffectFoldHover .s3 > .overlay {
	background: -moz-linear-gradient(right, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.2) 100%);
	background: -webkit-linear-gradient(right, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.2) 100%);
	background: -o-linear-gradient(right, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.2) 100%);
	background: -ms-linear-gradient(right, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.2) 100%);
	background: linear-gradient(right, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.2) 100%);
}
.tileHoverEffectFoldHover .s4 > .overlay {
	background: -moz-linear-gradient(left, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(left, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0) 100%);
	background: -o-linear-gradient(left, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0) 100%);
	background: -ms-linear-gradient(left, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(left, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0) 100%);
}