@keyframes fadeIn {
  0% {
    opacity: 0;
    transform: translateY(50px);
  }

  100% {
    opacity: 1;
    transform: translateY(-150px);
  }
}

.about {
  opacity: 0;
  animation-name: fadeIn;
  animation-duration: 3s;
  animation-delay: .5s;
  animation-fill-mode: forwards;
}

@keyframes fadeInMobile {
  0% {
    opacity: 0;
    transform: translateY(50px);
  }

  100% {
    opacity: 1;
    transform: translateY(-75px);
  }
}

@media(max-width: 450px) {
  .about {
  animation-name: fadeInMobile;
  animation-duration: 3s;
  animation-delay: .5s;
  animation-fill-mode: forwards;
  }
}


@keyframes bounce { 
            from { 
                transform: translate3d(0, 0, 0); 
            } 
            to { 
                transform: translate3d(0, 15px, 0); 
            } 
        } 



.section-footer img  { 
            -webkit-animation-name: bounce; 
            -webkit-animation-duration: 0.5s; 
            -webkit-animation-direction: alternate; 
            -webkit-animation-timing-function: cubic-bezier(0.5, 0.05, 1, .5); 
            -webkit-animation-iteration-count: infinite; 
        } 

@keyframes bounceUp { 
            from { 
                transform: translate3d(0, 0, 0); 
            } 
            to { 
                transform: translate3d(0, -15px, 0); 
            } 
        } 



.section-3-footer img  { 
            -webkit-animation-name: bounceUp; 
            -webkit-animation-duration: 0.5s; 
            -webkit-animation-direction: alternate; 
            -webkit-animation-timing-function: cubic-bezier(0.5, 0.05, 1, .5); 
            -webkit-animation-iteration-count: infinite; 
        } 