
.carousel-item.even {
    -webkit-transform: scale(100);
    -moz-transform: scale(100);
    -o-transform: scale(100);
    transform: scale(100);
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
}

.carousel-item.odd {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
}

.carousel-item.active {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

.in-top, .in-left, .in-right {
    overflow-y: hidden !important;
}

.in-top {
    position: relative;
    transform: translateY(10px);
    opacity: 0;
    transition: 1s all ease;
}
.in-top.visible {
    transform: translateY(0);
    opacity: 1;
}

.in-left {
    position: relative;
    transform: translatex(-150px);
    opacity: 0;
    transition: 1s all ease;
}
.in-left.visible {
    transform: translatex(0);
    opacity: 1;
}

.in-right {
    position: relative;
    transform: translatex(150px);
    opacity: 0;
    transition: 1s all ease;
}
.in-right.visible {
    transform: translatex(0);
    opacity: 1;
}

@keyframes fadeInLeft {
    from {
        opacity:0;
        -webkit-transform: translatex(-100px);
        -moz-transform: translatex(-100px);
        -o-transform: translatex(-100px);
        transform: translatex(-100px);
    }
    to {
        opacity:1;
        -webkit-transform: translatex(0);
        -moz-transform: translatex(0);
        -o-transform: translatex(0);
        transform: translatex(0);
    }
}

.in-init {
    -webkit-animation-name: fadeInLeft;
    -moz-animation-name: fadeInLeft;
    -o-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-delay: 1s;
    -moz-animation-delay: 1s;
    -o-animation-duration:1s;
    animation-delay: 1s;
}


@keyframes fadeInTop {
    from {
        opacity:0;
        -webkit-transform: translatey(-100px);
        -moz-transform: translatey(-100px);
        -o-transform: translatey(-100px);
        transform: translatey(-100px);
    }
    to {
        opacity:1;
        -webkit-transform: translatey(0);
        -moz-transform: translatey(0);
        -o-transform: translatey(0);
        transform: translatey(0);
    }
}


.in-init-top {
    -webkit-animation-name: fadeInTop;
    -moz-animation-name: fadeInTop;
    -o-animation-name: fadeInTop;
    animation-name: fadeInTop;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-delay: 1s;
    -moz-animation-delay: 1s;
    -o-animation-duration:1s;
    animation-delay: 1s;
}
