@import "../default-skin.less";
@import "../../global/mixin.less";

.l_roll {
	position:relative; transform-style:preserve-3d; perspective:500px;
	.l_rollFront,
	.l_rollBack { transition:all 0.3s; transform-origin:50%;}
	.l_rollFront { position:relative; z-index:1; backface-visibility:hidden;}
	.l_rollBack { position:absolute; top:0; left:0; right:0; bottom:0; z-index:0; transform:rotateY(-180deg); pointer-events:none;}
}
.l_roll-back .l_rollFront { transform:rotateY(180deg); pointer-events:none;}
.l_roll-back .l_rollBack { transform:rotateY(0deg); pointer-events:auto;}