html

slider {
 display: block;
 width: 100%;
 height: 100%;
 background-color: #1f1f1f;
 overflow: hidden;
 position: absolute;
}

slider > * {
 position: absolute;
 display: block;
 width: 100%;
 height: 100%;
 background: #1f1f1f;
 animation: slide 12s infinite;
 overflow: hidden;
}

slide:nth-child(1){
 left: 0%;
 animation-delay: -1s;
 background-image: url("../Imagenes/Banner2.jpg"); /*2*/
 background-size: cover;
 background-position: center;
}

slide:nth-child(2){
 animation-delay: 2s;
 background-image: url("../Imagenes/Banner3.jpg"); /*3*/
 background-size: cover;
 background-position: center;
}

slide:nth-child(3){
 animation-delay: 5s;
background-image: url("../Imagenes/Banner4.jpg"); /*4*/
 background-size: cover;
 background-position: center;
}

slide:nth-child(4){
 left: 0%;
 animation-delay: 8s;
background-image: url("../Imagenes/Banner1.jpg"); /*1*/
 background-size: cover;
 background-position: center;
}

slide p {
 font-family: Comfortaa;
 font-size: 70px;
 text-align: center;
 display: inline-block;
 width: 100%;
 margin-top: 340px;
 color: #fff;
}

@keyframes slide {
 0% { left: 100%; width: 100%; }
 5% { left: 0%; }
 25% { left: 0%; }
 30% { left: -100%; width: 100%; }
 30.0001% { left: -100%; width: 0%; }
 100% { left: 100%; width: 0%; }
}