.carousel-inner.vertical {
    height: 100%; /*Note: set specific height here if not, there will be some issues with IE browser*/
}
.carousel-inner.vertical > .item {
    -webkit-transition: .10s ease-in-out top;
    -o-transition: .10s ease-in-out top;
    transition: .10s ease-in-out top;
}

@media all and (transform-3d),
(-webkit-transform-3d) {
    .carousel-inner.vertical > .item {
        -webkit-transition: -webkit-transform .10s ease-in-out;
        -o-transition: -o-transform .10s ease-in-out;
        transition: transform .10s ease-in-out;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-perspective: 1000;
        perspective: 1000;
    }
    .carousel-inner.vertical > .item.next,
    .carousel-inner.vertical > .item.active.right {
        -webkit-transform: translate3d(0, 33.33%, 0);
        transform: translate3d(0, 33.33%, 0);
        top: 0;
    }
    .carousel-inner.vertical > .item.prev,
    .carousel-inner.vertical > .item.active.left {
        -webkit-transform: translate3d(0, -33.33%, 0);
        transform: translate3d(0, -33.33%, 0);
        top: 0;
    }
    .carousel-inner.vertical > .item.next.left,
    .carousel-inner.vertical > .item.prev.right,
    .carousel-inner.vertical > .item.active {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        top: 0;
    }
}

.carousel-inner.vertical > .active {
    top: 0;
}
.carousel-inner.vertical > .next,
.carousel-inner.vertical > .prev {
    top: 0;
    height: 100%;
    width: auto;
}
.carousel-inner.vertical > .next {
    left: 0;
    top: 33.33%;
    right:0;
}
.carousel-inner.vertical > .prev {
    left: 0;
    top: -33.33%;
    right:0;
}
.carousel-inner.vertical > .next.left,
.carousel-inner.vertical > .prev.right {
    top: 0;
}
.carousel-inner.vertical > .active.left {
    left: 0;
    top: -33.33%;
    right:0;
}
.carousel-inner.vertical > .active.right {
    left: 0;
    top: 33.33%;
    right:0;
}

#carousel-pager .carousel-control.left {
    bottom: initial;
    width: 100%;
}
#carousel-pager .carousel-control.right {
    top: initial;
    width: 100%;
}