<div id="slideshow">
      <div>
        <img src="https://image.ibb.co/jwQpBp/reloj1.png">
      </div>
      <div>  
        <img src="https://image.ibb.co/cVqNWp/reloj2.png">
      </div>
      <div>  
        <img src="https://image.ibb.co/ir02Z9/reloj2_5.png">
      </div>
      <div>
        <img src="https://image.ibb.co/bSjuBp/reloj3_5.png">
      </div>
      <div>
        <img src="https://image.ibb.co/j7Jbrp/reloj4.png"  id="3">
      </div>
    </div>
<img src="https://image.ibb.co/kDfexU/text.png" style="display:none" id="div2" onload="setTimeout('msj()',2300);">
body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100vh;
    color: #fff;
    background-image: radial-gradient(circle, #6699ff, #6600cc);
    overflow: hidden;
}

#slideshow {
  position: fixed;
  aling-items: center;
  justify-content: center;
}
#div2{
  width:350px;
}
img{
  width:200px;
}
$("#slideshow > div:gt(0)").hide();

setInterval(function() { 
  $('#slideshow > div:first')
    .fadeOut(0)
    .next()
    .fadeIn(0)
    .end()
    .appendTo('#3');
},  411);

  function msj(){
 $("#div2").fadeIn(3000);
  }

External CSS

  1. https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css
  2. https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css

External JavaScript

  1. https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js