.pic-wrapper {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: -1;

    left: 0;
    right: 0;
    top: 0;
    /* filter: brightness(0.4); */
    /* opacity: 0.7; */
  }
  
  figure {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    /*animation*/
    
    animation: slideShow 24s linear infinite 0s;
    -o-animation: slideShow 24s linear infinite 0s;
    -moz-animation: slideShow 24s linear infinite 0s;
    -webkit-animation: slideShow 24s linear infinite 0s;
  }
  
  figurecaption {
    position: absolute;
    top: 50%;
    left: 50%;
    color: #fff;
  }
  
  .pic-1 {
    opacity: 1;
    background: url(img/slider1.JPG) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  }
  
  .pic-2 {
    animation-delay: 6s;
    -o-animation-delay: 6s;
    -moz--animation-delay: 6s;
    -webkit-animation-delay: 6s;
    background: url(img/slider2.JPG) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  }
  
  .pic-3 {
    animation-delay: 12s;
    -o-animation-delay: 12s;
    -moz--animation-delay: 12s;
    -webkit-animation-delay: 12s;
    background: url(img/slider3.JPG) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  }
  
  .pic-4 {
    animation-delay: 18s;
    -o-animation-delay: 18s;
    -moz--animation-delay: 18s;
    -webkit-animation-delay: 18s;
    background: url(img/slider4.JPG) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  }
  /* keyframes*/
  
  @keyframes 
  slideShow {  0% {
   opacity: 0;
   transform:scale(1);
   -ms-transform:scale(1);
  }
   5% {
   opacity: 1
  }
   25% {
   opacity: 1;
  }
   30% {
   opacity: 0;
   transform:scale(1.1);
   -ms-transform:scale(1.1);
  }
   100% {
   opacity: 0;
   transform:scale(1);
   -ms-transformm:scale(1);
  }
  }
   @-o-keyframes 
  slideShow {  0% {
   opacity: 0;
   -o-transform:scale(1);
  }
   5% {
   opacity: 1
  }
   25% {
   opacity: 1;
  }
   30% {
   opacity: 0;
   -o-transform:scale(1.1);
  }
   100% {
   opacity: 0;
   -o-transformm:scale(1);
  }
  }
   @-moz-keyframes 
  slideShow {  0% {
   opacity: 0;
   -moz-transform:scale(1);
  }
   5% {
   opacity: 1
  }
   25% {
   opacity: 1;
  }
   30% {
   opacity: 0;
   -moz-transform:scale(1.1);
  }
   100% {
   opacity: 0;
   -moz-transformm:scale(1);
  }
  }
   @-webkit-keyframes 
  slideShow {  0% {
   opacity: 0;
   -webkit-transform:scale(1);
  }
   5% {
   opacity: 1
  }
   25% {
   opacity: 1;
  }
   30% {
   opacity: 0;
   -webkit-transform:scale(1.1);
  }
   100% {
   opacity: 0;
   -webkit-transformm:scale(1);
  }
  }