.flipping-tile {
	-webkit-perspective: 1600px;
	-o-perspective: 1600px;
	-moz-perspective: 1600px;
	perspective: 1600px;
	position: relative;
	margin: 0px;
	font-family: Roboto, Helvetica, sans-serif;
	display: grid;
	grid-template-rows: 1fr;
	grid-template-columns: 1fr;
	grid-template-areas: "overlap"
}
.flipping-tile .flip-front, .flipping-tile .flip-back {
   position:relative;
	border-radius: 15px;
	grid-area: overlap;
	min-width: 0; /*to keep content from breaking the grid*/
	box-shadow: 4px 12px 30px 3px rgba(0, 0, 0, 0.09);
	overflow: hidden;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition: -webkit-transform .7s cubic-bezier(0.39, 0.575, 0.565, 1);
	-moz-transition: transform .7s cubic-bezier(0.39, 0.575, 0.565, 1);
	-o-transition: transform .7s cubic-bezier(0.39, 0.575, 0.565, 1);
	transition: transform .7s cubic-bezier(0.39, 0.575, 0.565, 1);
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	transform-style: preserve-3d;
}
.flipping-tile .flip-front {
	-webkit-transform: rotateY(0deg);
	-moz-transform: rotateY(0deg);
	-o-transform: rotateY(0deg);
	transform: rotateY(0deg);
}
.flipping-tile .flip-back,
.flipping-tile[data-flip-direction="horizontal-to-right"].flip .flip-front,
.flipping-tile[data-flip-direction="horizontal-to-left"] .flip-back {
	-webkit-transform: rotateY(180deg);
	-moz-transform: rotateY(180deg);
	-o-transform: rotateY(180deg);
	transform: rotateY(180deg);
}
.flipping-tile[data-flip-direction="horizontal-to-left"].flip .flip-front,
.flipping-tile[data-flip-direction="horizontal-to-right"] .flip-back {
	-webkit-transform: rotateY(-180deg);
	-moz-transform: rotateY(-180deg);
	-o-transform: rotateY(-180deg);
	transform: rotateY(-180deg);
}
.flipping-tile[data-flip-direction="vertical-to-bottom"].flip .flip-front,
.flipping-tile[data-flip-direction="vertical-to-top"] .flip-back{
	-webkit-transform: rotateX(180deg);
	-moz-transform: rotateX(180deg);
	-o-transform: rotateX(180deg);
	transform: rotateX(180deg);
}
.flipping-tile[data-flip-direction="vertical-to-top"].flip .flip-front,
.flipping-tile[data-flip-direction="vertical-to-bottom"] .flip-back{
	-webkit-transform: rotateX(-180deg);
	-moz-transform: rotateX(-180deg);
	-o-transform: rotateX(-180deg);
	transform: rotateX(-180deg);
}
.flipping-tile.flip .flip-back {
	-webkit-transform: rotateY(0deg);
	-moz-transform: rotateY(0deg);
	-o-transform: rotateY(0deg);
	transform: rotateY(0deg);
}

.flipping-tile .flip-bg {
	position:absolute;
	width:100%;
	height:100%;
	background-repeat: no-repeat;
	background-size:100% auto;
	background-position: 50% 50%;
}
.flipping-tile .inner {position: relative;}
.flip-trigger {
	position: absolute;
	right: 24px;
	bottom: 24px;
	width: 36px;
	height: 36px;
	padding: 6px;
	background: #000;
	border-radius: 100%;
	cursor: pointer;
	font-family: FontAwesome;
	font-weight: normal;
	font-style: normal;
	text-decoration: inherit;
	-webkit-font-smoothing: antialiased;
	font-size: 24px;
	line-height: 24px;
	text-align: center;
}
.flip-trigger.flipper:before {content:"\f067"}
.flip-trigger.unflipper:before {content: "\f00d"}
.flip-trigger:before {
	display: block;
	transform: scale(.9);
	transform-origin: 50% 50%;
	transition: transform .3s ease;
}
.flip-trigger:hover:before {
	transform: scale(1);
}
.front-button-white .flip-trigger.flipper,
.back-button-white .flip-trigger.unflipper {background: #fff;color:#000;}
.front-button-black .flip-trigger.flipper,
.back-button-black .flip-trigger.unflipper {background: #000;color:#fff;}
.front-button-white .flip-trigger.flipper:hover,
.back-button-white .flip-trigger.unflipper:hover {background: rgba(255,255,255,0.8);color:#000;}
.front-button-black .flip-trigger.flipper:hover,
.back-button-black .flip-trigger.unflipper:hover {background: rgba(0,0,0,0.8);color:#fff;}

.flipping-tile .flip-back {
	display: flex;
	align-items: center;
}
.flipping-tile .flip-back .inner {
	margin: 0px auto;
}
.flip .flip-front {z-index:-1}
.flip .flip-back {z-index:2}

.vc_row-o-equal-height.ftnd-tile-equal-height .vc_column-inner>.wpb_wrapper, 
.vc_row-o-equal-height.ftnd-tile-equal-height .ftnd-flip-tile,
.vc_row-o-equal-height.ftnd-tile-equal-height .flipping-tile {height:100%;}