.slider {
  width: 100%;
  height: 500px;
  margin: 30px auto;
  position: relative;
}

.slide1,.slide2,.slide3 {
 position: absolute;
  width: 95%;
  height: 500px;
  margin: 35px 30px;
}
.slide1 {
  background: url("images/tlh27.jpg")no-repeat center;
    background-size: cover;
    animation:fade 60s linear infinite;
   -webkit-animation:fade 60s infinite;
   box-shadow: 0 0px 50px rgba(0, 0, 0, 10), inset 0 0px 500px rgba(0, 0, 0, .5);
 /*   border-radius: 5px;*/

} 
.slide2 {
  background: url("images/tlh22.jpg")no-repeat center;
    background-size: cover;
    animation:fade2 60s  linear infinite;
   -webkit-animation:fade2 60s infinite;
  box-shadow: 0 0px 50px rgba(0, 0, 0, 10), inset 0 0px 500px rgba(0, 0, 0, .5);
  /*  border-radius: 5px;*/
}

.slide3 {
    background: url("images/tlh23.jpg")no-repeat center;
      background-size: cover;
    animation:fade3 60s linear infinite;
-webkit-animation:fade3 60s infinite;
  box-shadow: 0 0px 50px rgba(0, 0, 0, 10), inset 0 0px 500px rgba(0, 0, 0, .5);
  /*  border-radius: 5px;*/
}

@keyframes fade
{
  0%   {opacity:1}
  33.333% { opacity: 0}
  66.666% { opacity: 0}
  100% { opacity: 1}
}

@keyframes fade2
{
  0%   {opacity:0}
  33.333% { opacity: 1}
  66.666% { opacity: 0 }
  100% { opacity: 0}
}
@keyframes fade3
{
  0%   {opacity:0}
  33.333% { opacity: 0}
  66.666% { opacity: 1}
  100% { opacity: 0}
}
    
    .blink_text {

    animation:1s blinker linear infinite;
    -webkit-animation:1s blinker linear infinite;
    -moz-animation:1s blinker linear infinite;
     color: red;
    }
 
    @-moz-keyframes blinker {  
     0% { opacity: 1.0; }
     50% { opacity: 0.0; }
     100% { opacity: 1.0; }
     }

    @-webkit-keyframes blinker {  
     0% { opacity: 1.0; }
     50% { opacity: 0.0; }
     100% { opacity: 1.0; }
     }

    @keyframes blinker {  
     0% { opacity: 1.0; }
     50% { opacity: 0.0; }
     100% { opacity: 1.0; }
     }


@media screen and (max-width: 750px){
    
    .slider{
        width:100%;
        height:350px;
        position:relative;
        margin:0;
    }
    
    .slide1,.slide2,.slide3 {
        position: absolute;
        width: 100%;
        height: 350px;
        margin: 0;
    }
    
}
 
    
@media screen and (max-width: 650px) {

    .slider{
        width:100%;
        height:250px;
        position:relative;
        margin:0;
    }
    
    .slide1,.slide2,.slide3 {
        position: absolute;
         width: 100%;
         height: 250px;
        margin: 0 ;
    }
 
}

