body {
    -webkit-perspective: 1000px;
    -moz-perspective: 1000px;
    -o-perspective: 1000px;
    perspective: 1000px;
}

.effect-moveleft {
    transition: all 0.3s linear;
    transform: rotateY(0deg);
    -webkit-transform: translateX(0%) rotateY(0deg) translateZ(0px);
    transform: translateX(0%) rotateY(0deg) translateZ(0px);
}

.effect-moveleft {
    &.active {
        transform-style: preserve-3d;
        transition: all 0.3s linear;
        transform: rotateY(30deg);
        -webkit-transform: translateX(-60%) rotateY(45deg) translateZ(-50px);
        transform: translateX(10%) rotateY(45deg) translateZ(-300px);
        //margin-top: -70px;

        &:before {
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.45);
            content: '';
            z-index: 9;
            position: absolute;
        }
    }
}