
/*Animation (zoom)*/

@-webkit-keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(.3);
    transform: scale(.3);
  }

  50% {
    opacity: 1;
  }
}

@keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(.3);
    -ms-transform: scale(.3);
    transform: scale(.3);
  }

  50% {
    opacity: 1;
  }
}

.zoomIn {
  -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}

@-webkit-keyframes zoomInDown {
  0% {
    opacity: 0;
    -webkit-transform: scale(.1) translateY(-2000px);
    transform: scale(.1) translateY(-2000px);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  60% {
    opacity: 1;
    -webkit-transform: scale(.475) translateY(60px);
    transform: scale(.475) translateY(60px);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
}

@keyframes zoomInDown {
  0% {
    opacity: 0;
    -webkit-transform: scale(.1) translateY(-2000px);
    -ms-transform: scale(.1) translateY(-2000px);
    transform: scale(.1) translateY(-2000px);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  60% {
    opacity: 1;
    -webkit-transform: scale(.475) translateY(60px);
    -ms-transform: scale(.475) translateY(60px);
    transform: scale(.475) translateY(60px);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
}

.zoomInDown {
  -webkit-animation-name: zoomInDown;
  animation-name: zoomInDown;
}

@-webkit-keyframes zoomInLeft {
  0% {
    opacity: 0;
    -webkit-transform: scale(.1) translateX(-2000px);
    transform: scale(.1) translateX(-2000px);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  60% {
    opacity: 1;
    -webkit-transform: scale(.475) translateX(48px);
    transform: scale(.475) translateX(48px);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
}

@keyframes zoomInLeft {
  0% {
    opacity: 0;
    -webkit-transform: scale(.1) translateX(-2000px);
    -ms-transform: scale(.1) translateX(-2000px);
    transform: scale(.1) translateX(-2000px);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  60% {
    opacity: 1;
    -webkit-transform: scale(.475) translateX(48px);
    -ms-transform: scale(.475) translateX(48px);
    transform: scale(.475) translateX(48px);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
}

.zoomInLeft {
  -webkit-animation-name: zoomInLeft;
  animation-name: zoomInLeft;
}

@-webkit-keyframes zoomInRight {
  0% {
    opacity: 0;
    -webkit-transform: scale(.1) translateX(2000px);
    transform: scale(.1) translateX(2000px);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  60% {
    opacity: 1;
    -webkit-transform: scale(.475) translateX(-48px);
    transform: scale(.475) translateX(-48px);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
}

@keyframes zoomInRight {
  0% {
    opacity: 0;
    -webkit-transform: scale(.1) translateX(2000px);
    -ms-transform: scale(.1) translateX(2000px);
    transform: scale(.1) translateX(2000px);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  60% {
    opacity: 1;
    -webkit-transform: scale(.475) translateX(-48px);
    -ms-transform: scale(.475) translateX(-48px);
    transform: scale(.475) translateX(-48px);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
}

.zoomInRight {
  -webkit-animation-name: zoomInRight;
  animation-name: zoomInRight;
}

@-webkit-keyframes zoomInUp {
  0% {
    opacity: 0;
    -webkit-transform: scale(.1) translateY(2000px);
    transform: scale(.1) translateY(2000px);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  60% {
    opacity: 1;
    -webkit-transform: scale(.475) translateY(-60px);
    transform: scale(.475) translateY(-60px);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
}

@keyframes zoomInUp {
  0% {
    opacity: 0;
    -webkit-transform: scale(.1) translateY(2000px);
    -ms-transform: scale(.1) translateY(2000px);
    transform: scale(.1) translateY(2000px);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  60% {
    opacity: 1;
    -webkit-transform: scale(.475) translateY(-60px);
    -ms-transform: scale(.475) translateY(-60px);
    transform: scale(.475) translateY(-60px);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
}

.zoomInUp {
  -webkit-animation-name: zoomInUp;
  animation-name: zoomInUp;
}

@-webkit-keyframes zoomOut {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  50% {
    opacity: 0;
    -webkit-transform: scale(.3);
    transform: scale(.3);
  }

  100% {
    opacity: 0;
  }
}

@keyframes zoomOut {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }

  50% {
    opacity: 0;
    -webkit-transform: scale(.3);
    -ms-transform: scale(.3);
    transform: scale(.3);
  }

  100% {
    opacity: 0;
  }
}

.zoomOut {
  -webkit-animation-name: zoomOut;
  animation-name: zoomOut;
}

@-webkit-keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale(.475) translateY(-60px);
    transform: scale(.475) translateY(-60px);
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(.1) translateY(2000px);
    transform: scale(.1) translateY(2000px);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
  }
}

@keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale(.475) translateY(-60px);
    -ms-transform: scale(.475) translateY(-60px);
    transform: scale(.475) translateY(-60px);
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(.1) translateY(2000px);
    -ms-transform: scale(.1) translateY(2000px);
    transform: scale(.1) translateY(2000px);
    -webkit-transform-origin: center bottom;
    -ms-transform-origin: center bottom;
    transform-origin: center bottom;
  }
}

.zoomOutDown {
  -webkit-animation-name: zoomOutDown;
  animation-name: zoomOutDown;
}

@-webkit-keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale(.475) translateX(42px);
    transform: scale(.475) translateX(42px);
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(.1) translateX(-2000px);
    transform: scale(.1) translateX(-2000px);
    -webkit-transform-origin: left center;
    transform-origin: left center;
  }
}

@keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale(.475) translateX(42px);
    -ms-transform: scale(.475) translateX(42px);
    transform: scale(.475) translateX(42px);
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(.1) translateX(-2000px);
    -ms-transform: scale(.1) translateX(-2000px);
    transform: scale(.1) translateX(-2000px);
    -webkit-transform-origin: left center;
    -ms-transform-origin: left center;
    transform-origin: left center;
  }
}

.zoomOutLeft {
  -webkit-animation-name: zoomOutLeft;
  animation-name: zoomOutLeft;
}

@-webkit-keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale(.475) translateX(-42px);
    transform: scale(.475) translateX(-42px);
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(.1) translateX(2000px);
    transform: scale(.1) translateX(2000px);
    -webkit-transform-origin: right center;
    transform-origin: right center;
  }
}

@keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale(.475) translateX(-42px);
    -ms-transform: scale(.475) translateX(-42px);
    transform: scale(.475) translateX(-42px);
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(.1) translateX(2000px);
    -ms-transform: scale(.1) translateX(2000px);
    transform: scale(.1) translateX(2000px);
    -webkit-transform-origin: right center;
    -ms-transform-origin: right center;
    transform-origin: right center;
  }
}

.zoomOutRight {
  -webkit-animation-name: zoomOutRight;
  animation-name: zoomOutRight;
}

@-webkit-keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale(.475) translateY(60px);
    transform: scale(.475) translateY(60px);
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(.1) translateY(-2000px);
    transform: scale(.1) translateY(-2000px);
    -webkit-transform-origin: center top;
    transform-origin: center top;
  }
}

@keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale(.475) translateY(60px);
    -ms-transform: scale(.475) translateY(60px);
    transform: scale(.475) translateY(60px);
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(.1) translateY(-2000px);
    -ms-transform: scale(.1) translateY(-2000px);
    transform: scale(.1) translateY(-2000px);
    -webkit-transform-origin: center top;
    -ms-transform-origin: center top;
    transform-origin: center top;
  }
}

.zoomOutUp {
  -webkit-animation-name: zoomOutUp;
  animation-name: zoomOutUp;
}