.container {
    width:100%;
    height:1000px;
    background: transparent url(warfield.jpg) top left no-repeat;
    background-size: 100% 100%;
    margin:auto;
    position:relative;
}

.pics {
    width: 500px;
    height: 450px;
    position:absolute;

}
.pic {
    width: 750px;
    height: 400px;
    position:absolute;

}
.picss {
    width: 750px;
    height: 400px;
    position:absolute;

}

.p1 {
    top:100px;
    z-index:100;
    background:transparent url(image13.jpeg) 0 0 no-repeat;
    animation: drift 10s linear infinite;
  } 

.p2 {
    top:350px;
    z-index: 200;
    background:transparent url(image12.jpg) 0 0 no-repeat;
    animation: drift 15s 5s linear infinite backwards;
}
.p3 {
    top:350px;
    z-index: 200;
    background:transparent url(image14.jpg) 0 0 no-repeat;
    animation: drift 3s 5s linear infinite backwards;
}




@keyframes drift {
    from{transform: translateX(-700px);}
    to {transform: translateX(2000px);}
}