@keyframes slideIn {
    0% {
      transform: translateX(100%);
      -webkit-transform: translateX(100%);
      -moz-transform: translateX(100%);
      -ms-transform: translateX(100%);
      -o-transform: translateX(100%);
    }
    100% {
      transform: translateX(0);
      -webkit-transform: translateX(0);
      -moz-transform: translateX(0);
      -ms-transform: translateX(0);
      -o-transform: translateX(0);
    }
}

.slide-in {
    animation: slideIn 0.5s ease-out;
    -webkit-animation: slideIn 0.5s ease-out;
}
/*
@keyframes slideInTop {
  0% {
    transform: translateY(100%);
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
}
  100% {
    transform: translateY(0);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
}
}

.slide-in-top {
  animation: slideInTop 0.5s ease-out;
  -webkit-animation: slideInTop 0.5s ease-out;
} */