body{
    padding:0;
    margin:0;
    background-color:#ffd6d6;
}
.slider-frame{
    overflow:hidden;
    height:800px;
    width:1200px;
    margin-top:20px;
}
/*---slide animation---*/
@-webkit-keyframes slide_animation{
    0% {left:0px;}
    10% {left:0px;}
    20% {left:1200px;}
    30% {left:1200px;}
    40% {left:1200px;}
    50% {left:2400px;}
    60% {left:2400px;}
    70% {left:1200px;}
    80 {left:0px;}
    90% {left:0px;}
    100% {left:0px;}

}

.slide-images{
    width:3600px;
    height:800px;
    margin:0 0 0 -2400;
    position:relative;
    -webkit-animation-name:slide_animation;
    -webkit-animation-duration:9s;
    -webkit-animation-iteration-count:infinite;
    -webkit-animation-direction:alternate;
    -webkit-animation-play-state:running;
}
.img-container{
    height:800px;
    width:1200px;
    position:relative;
    float:left;

}