﻿.tech-slideshow {
    height: 400px;
    max-width: 800px;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    transform: translate3d(0, 0, 0);
}

    .tech-slideshow > div {
        height: 200px;
        width: 2526px;
        /*background: url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/3/collage.jpg);*/
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        transform: translate3d(0, 0, 0);
    }

        .tech-slideshow .mover-1 {
        animation: moveSlidevertical 5s linear infinite;
    }

    .tech-slideshow:hover .mover-1 {
        animation-play-state: paused;
        cursor: pointer;
    }

    .tech-slideshow .mover-2 {
        animation: moveSlideshow 15s linear infinite;
    }

    .tech-slideshow:hover .mover-2 {
        animation-play-state: paused;
        cursor: pointer;
    }

@keyframes moveSlidevertical {
    100% {
        transform: translateY(-66.6666%);
    }
}
@keyframes moveSlideshow {
    100% {
        transform: translateX(-66.6666%);
    }
}