.animated {
    -webkit-animation-duration: 1.5s;
    animation-duration: 1.5s;
  }
  
@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100px, 0, 0);
    transform: translate3d(100px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100px, 0, 0);
    transform: translate3d(100px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}
@-webkit-keyframes fadeInLeft {
    from {
      opacity: 0;
      -webkit-transform: translate3d(-100px, 0, 0);
      transform: translate3d(-100px, 0, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
    }
  }
  
  @keyframes fadeInLeft {
    from {
      opacity: 0;
      -webkit-transform: translate3d(-100px, 0, 0);
      transform: translate3d(-100px, 0, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
    }
  }
  
.fadeInLeft {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInUp {
    from {
      opacity: 0;
      -webkit-transform: translate3d(0, -100px, 0);
      transform: translate3d(0, -100px, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
    }
  }
  @keyframes fadeInUp {
    from {
      opacity: 0;
      -webkit-transform: translate3d(0, -100px, 0);
      transform: translate3d(0, -100px, 0);
    }
  
    to {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
    }
  }
.fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
}  

@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100px, 0);
    transform: translate3d(0, 100px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100px, 0);
    transform: translate3d(0, 100px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}  

.bounceInAnimation{
  animation: bounceIn 20s;
  transform: scale(1.2);
  opacity: 0.5;
}
@keyframes bounceIn {
  0% {
    transform: scale(1.0);
    opacity: 0.5;
  }
  50% {
    transform: scale(1.5);
    opacity: 0.9;
  }
  100% {
    transform: scale(1.2);
    opacity: 0.5;
  }
}

.bounceOutAnimation{
  animation: bounceOut 5s;
}
@keyframes bounceOut {
  0% {
    transform: scale(0.7);
  }
  100% {
    transform: scale(1.0);
    opacity: 1;
  }
}

@keyframes color-me-in0 {
  0% {
    background: rgb(231, 90, 125);
    color:black;
  }
  50% {
    background: rgb(73, 158, 173);
    color:black;
  }
  100% {
    background: rgb(231, 90, 125);
    color:black;
  }
}
@keyframes color-me-in1 {
  0% {
    background: rgb(153, 209, 116);
  }
  50% {
    background: rgb(212, 87, 87);
    color: black;
  }
  100% {
    background: rgb(153, 209, 116);
  }
}
@keyframes color-me-in2 {
  0% {
    background: rgb(233, 164, 210);
  }
  50% {
    background: rgb(82, 98, 150);
    color: black;
  }
  100% {
    background: rgb(233, 164, 210);
  }
}
@keyframes color-me-in3 {
  0% {
    background: rgb(7, 161, 123);
    color:black;
  }
  50% {
    background: rgb(222, 198, 224);
    color:black;
  }
  100% {
    background: rgb(7, 161, 123);
    color:black;
  }
}
@keyframes color-me-in4 {
  0% {
    color: white;
  }
  100% {
    color:black;
  }
}