.gif {
    position: absolute;
    width: 100%;
    top: -70px;
    -webkit-animation: fadeslideUp 12s infinite; /* Chrome, Opera 15+, Safari 5+ */
    -moz-animation: fadeslideUp 12s infinite; /* Fx 5+ */
    -o-animation: fadeslideUp 12s infinite; /* Opera 12+ */
    animation: fadeslideUp 12s infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
  }
  
  
  #g2 {
      animation-delay: -9s;
      -webkit-animation-delay: -9s;
  }
  
  #g3 {
      animation-delay: -6s;
      -webkit-animation-delay: -6s;
  }
  
  #g4 {
      animation-delay: -3s;
      -webkit-animation-delay: -3s;
  }
  
  @-webkit-keyframes fadeslideUp {
      0% {
        opacity: 0;
        -webkit-transform: translateY(-40%);
      }
      10% {
        opacity: 1;
        -webkit-transform: translateY(-50%);
      }
      20% {
        opacity: 1;
        -webkit-transform: translateY(-50%);
      }
      25% {
        opacity: 0;
        -webkit-transform: translateY(-60%);
      }
      100% {
        opacity: 0;
        -webkit-transform: translateY(-60%);
      }
  }
  
  @-moz-keyframes fadeslideUp {
      0% {
        opacity: 0;
        transform: translateY(-40%);
      }
      10% {
        opacity: 1;
        transform: translateY(-50%);
      }
      20% {
        opacity: 1;
        transform: translateY(-50%);
      }
      25% {
        opacity: 0;
        transform: translateY(-60%);
      }
      100% {
        opacity: 0;
        transform: translateY(-60%);
      }
  }
  
  @-o-keyframes fadeslideUp {
      0% {
        opacity: 0;
        transform: translateY(-40%);
      }
      10% {
        opacity: 1;
        transform: translateY(-50%);
      }
      20% {
        opacity: 1;
        transform: translateY(-50%);
      }
      25% {
        opacity: 0;
        transform: translateY(-60%);
      }
      100% {
        opacity: 0;
        transform: translateY(-60%);
      }
  }
  
  @keyframes fadeslideUp {
      0% {
        opacity: 0;
        transform: translateY(-40%); 
        -ms-transform: translateY(-40%);
      }
      10% {
        opacity: 1;
        transform: translateY(-50%); 
        -ms-transform: translateY(-50%);
      }
      20% {
        opacity: 1;
        transform: translateY(-50%); 
        -ms-transform: translateY(-50%);
      }
      25% {
        opacity: 0;
        transform: translateY(-60%);
        -ms-transform: translateY(-60%); 
      }
      100% {
        opacity: 0;
        transform: translateY(-60%);
        -ms-transform: translateY(-60%); 
      }
  }