.element-animated {
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
}

.element-animated.short {
  -webkit-animation-duration: .5s;
          animation-duration: .5s;
}

.element-animated.long {
  -webkit-animation-duration: 2s;
          animation-duration: 2s;
}

.element-animated.infinite {
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}

@-webkit-keyframes slide-from-right {
  0% {
    -webkit-transform: translateX(200px);
            transform: translateX(200px);
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes slide-from-right {
  0% {
    -webkit-transform: translateX(200px);
            transform: translateX(200px);
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

.slide-from-right {
  -webkit-animation-name: slide-from-right;
          animation-name: slide-from-right;
}

@-webkit-keyframes slide-from-left {
  0% {
    -webkit-transform: translateX(-200px);
            transform: translateX(-200px);
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes slide-from-left {
  0% {
    -webkit-transform: translateX(-200px);
            transform: translateX(-200px);
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

.slide-from-left {
  -webkit-animation-name: slide-from-left;
          animation-name: slide-from-left;
}

@-webkit-keyframes slide-from-top {
  0% {
    -webkit-transform: translateY(-200px);
            transform: translateY(-200px);
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes slide-from-top {
  0% {
    -webkit-transform: translateY(-200px);
            transform: translateY(-200px);
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

.slide-from-top {
  -webkit-animation-name: slide-from-top;
          animation-name: slide-from-top;
}

@-webkit-keyframes slide-from-bottom {
  0% {
    -webkit-transform: translateY(200px);
            transform: translateY(200px);
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes slide-from-bottom {
  0% {
    -webkit-transform: translateY(200px);
            transform: translateY(200px);
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

.slide-from-bottom {
  -webkit-animation-name: slide-from-bottom;
          animation-name: slide-from-bottom;
}

@-webkit-keyframes slide-from-right-bottom {
  0% {
    -webkit-transform: translate(100px, 100px);
            transform: translate(100px, 100px);
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes slide-from-right-bottom {
  0% {
    -webkit-transform: translate(100px, 100px);
            transform: translate(100px, 100px);
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

.slide-from-right-bottom {
  -webkit-animation-name: slide-from-right-bottom;
          animation-name: slide-from-right-bottom;
}

@-webkit-keyframes slide-from-left-bottom {
  0% {
    -webkit-transform: translate(-100px, 100px);
            transform: translate(-100px, 100px);
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes slide-from-left-bottom {
  0% {
    -webkit-transform: translate(-100px, 100px);
            transform: translate(-100px, 100px);
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

.slide-from-left-bottom {
  -webkit-animation-name: slide-from-left-bottom;
          animation-name: slide-from-left-bottom;
}

@-webkit-keyframes slide-from-right-top {
  0% {
    -webkit-transform: translate(100px, -100px);
            transform: translate(100px, -100px);
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes slide-from-right-top {
  0% {
    -webkit-transform: translate(100px, -100px);
            transform: translate(100px, -100px);
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

.slide-from-right-top {
  -webkit-animation-name: slide-from-right-top;
          animation-name: slide-from-right-top;
}

@-webkit-keyframes slide-from-left-top {
  0% {
    -webkit-transform: translate(-100px, -100px);
            transform: translate(-100px, -100px);
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes slide-from-left-top {
  0% {
    -webkit-transform: translate(-100px, -100px);
            transform: translate(-100px, -100px);
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

.slide-from-left-top {
  -webkit-animation-name: slide-from-left-top;
          animation-name: slide-from-left-top;
}

@-webkit-keyframes slide-left-right {
  0% {
    -webkit-transform: translateX(-100px);
            transform: translateX(-100px);
  }
  50% {
    -webkit-transform: none;
            transform: none;
  }
  100% {
    -webkit-transform: translateX(100px);
            transform: translateX(100px);
  }
}

@keyframes slide-left-right {
  0% {
    -webkit-transform: translateX(-100px);
            transform: translateX(-100px);
  }
  50% {
    -webkit-transform: none;
            transform: none;
  }
  100% {
    -webkit-transform: translateX(100px);
            transform: translateX(100px);
  }
}

.slide-left-right {
  -webkit-animation-name: slide-left-right;
          animation-name: slide-left-right;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-animation-direction: alternate;
          animation-direction: alternate;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}

@-webkit-keyframes slide-top-bottom {
  0% {
    -webkit-transform: translateY(-100px);
            transform: translateY(-100px);
  }
  50% {
    -webkit-transform: none;
            transform: none;
  }
  100% {
    -webkit-transform: translateY(100px);
            transform: translateY(100px);
  }
}

@keyframes slide-top-bottom {
  0% {
    -webkit-transform: translateY(-100px);
            transform: translateY(-100px);
  }
  50% {
    -webkit-transform: none;
            transform: none;
  }
  100% {
    -webkit-transform: translateY(100px);
            transform: translateY(100px);
  }
}

.slide-top-bottom {
  -webkit-animation-name: slide-top-bottom;
          animation-name: slide-top-bottom;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-animation-direction: alternate;
          animation-direction: alternate;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}

@-webkit-keyframes tremble {
  0%, 20%, 40%, 60%, 80%, 100% {
    -webkit-transform: translateX(5px);
            transform: translateX(5px);
  }
  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes tremble {
  0%, 20%, 40%, 60%, 80%, 100% {
    -webkit-transform: translateX(5px);
            transform: translateX(5px);
  }
  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: none;
            transform: none;
  }
}

.tremble {
  -webkit-animation-name: tremble;
          animation-name: tremble;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}

@-webkit-keyframes fade-out {
  0% {
    opacity: .8;
  }
  100% {
    opacity: 0;
  }
}

@keyframes fade-out {
  0% {
    opacity: .8;
  }
  100% {
    opacity: 0;
  }
}

.fade-out {
  -webkit-animation-name: fade-out;
          animation-name: fade-out;
}

@-webkit-keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: .8;
  }
}

@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: .8;
  }
}

.fade-in {
  -webkit-animation-name: fade-in;
          animation-name: fade-in;
  -webkit-animation-timing-function: ease-in;
          animation-timing-function: ease-in;
}

@-webkit-keyframes pulsate {
  0%, 100% {
    opacity: .8;
  }
  50% {
    opacity: .6;
  }
}

@keyframes pulsate {
  0%, 100% {
    opacity: .8;
  }
  50% {
    opacity: .6;
  }
}

.pulsate {
  -webkit-animation-name: pulsate;
          animation-name: pulsate;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
  -webkit-animation-direction: alternate;
          animation-direction: alternate;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}

@-webkit-keyframes rotate {
  0% {
    -webkit-transform: rotate(-1turn);
            transform: rotate(-1turn);
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes rotate {
  0% {
    -webkit-transform: rotate(-1turn);
            transform: rotate(-1turn);
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

.rotate {
  -webkit-animation-name: rotate;
          animation-name: rotate;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
}

@-webkit-keyframes rotate-slide-from-right {
  0% {
    -webkit-transform: translateX(200px) rotate(1turn);
            transform: translateX(200px) rotate(1turn);
    -webkit-transform-origin: center;
            transform-origin: center;
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes rotate-slide-from-right {
  0% {
    -webkit-transform: translateX(200px) rotate(1turn);
            transform: translateX(200px) rotate(1turn);
    -webkit-transform-origin: center;
            transform-origin: center;
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

.rotate-slide-from-right {
  -webkit-animation-name: rotate-slide-from-right;
          animation-name: rotate-slide-from-right;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
}

@-webkit-keyframes rotate-slide-from-left {
  0% {
    -webkit-transform: translateX(-200px) rotate(-1turn);
            transform: translateX(-200px) rotate(-1turn);
    -webkit-transform-origin: center;
            transform-origin: center;
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes rotate-slide-from-left {
  0% {
    -webkit-transform: translateX(-200px) rotate(-1turn);
            transform: translateX(-200px) rotate(-1turn);
    -webkit-transform-origin: center;
            transform-origin: center;
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

.rotate-slide-from-left {
  -webkit-animation-name: rotate-slide-from-left;
          animation-name: rotate-slide-from-left;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
}

@-webkit-keyframes rotate-slide-from-top {
  0% {
    -webkit-transform: translateY(-200px) rotate(-1turn);
            transform: translateY(-200px) rotate(-1turn);
    -webkit-transform-origin: center;
            transform-origin: center;
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes rotate-slide-from-top {
  0% {
    -webkit-transform: translateY(-200px) rotate(-1turn);
            transform: translateY(-200px) rotate(-1turn);
    -webkit-transform-origin: center;
            transform-origin: center;
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

.rotate-slide-from-top {
  -webkit-animation-name: rotate-slide-from-top;
          animation-name: rotate-slide-from-top;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
}

@-webkit-keyframes rotate-slide-from-bottom {
  0% {
    -webkit-transform: translateY(200px) rotate(-1turn);
            transform: translateY(200px) rotate(-1turn);
    -webkit-transform-origin: center;
            transform-origin: center;
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes rotate-slide-from-bottom {
  0% {
    -webkit-transform: translateY(200px) rotate(-1turn);
            transform: translateY(200px) rotate(-1turn);
    -webkit-transform-origin: center;
            transform-origin: center;
  }
  100% {
    -webkit-transform: none;
            transform: none;
  }
}

.rotate-slide-from-bottom {
  -webkit-animation-name: rotate-slide-from-bottom;
          animation-name: rotate-slide-from-bottom;
  -webkit-animation-timing-function: ease-in-out;
          animation-timing-function: ease-in-out;
}

@-webkit-keyframes appear-from-right {
  0% {
    -webkit-transform: translateX(200px);
            transform: translateX(200px);
    opacity: 0;
  }
  40% {
    opacity: .7;
  }
  70% {
    opacity: 1;
  }
  100% {
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}

@keyframes appear-from-right {
  0% {
    -webkit-transform: translateX(200px);
            transform: translateX(200px);
    opacity: 0;
  }
  40% {
    opacity: .7;
  }
  70% {
    opacity: 1;
  }
  100% {
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}

.appear-from-right {
  -webkit-animation-name: appear-from-right;
          animation-name: appear-from-right;
  -webkit-animation-timing-function: cubic-bezier(0.39, 0.58, 0.57, 1);
          animation-timing-function: cubic-bezier(0.39, 0.58, 0.57, 1);
}

@-webkit-keyframes appear-from-left {
  0% {
    -webkit-transform: translateX(-200px);
            transform: translateX(-200px);
    opacity: 0;
  }
  40% {
    opacity: .7;
  }
  70% {
    opacity: 1;
  }
  100% {
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}

@keyframes appear-from-left {
  0% {
    -webkit-transform: translateX(-200px);
            transform: translateX(-200px);
    opacity: 0;
  }
  40% {
    opacity: .7;
  }
  70% {
    opacity: 1;
  }
  100% {
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}

.appear-from-left {
  -webkit-animation-name: appear-from-left;
          animation-name: appear-from-left;
  -webkit-animation-timing-function: cubic-bezier(0.39, 0.58, 0.57, 1);
          animation-timing-function: cubic-bezier(0.39, 0.58, 0.57, 1);
}

@-webkit-keyframes appear-from-top {
  0% {
    -webkit-transform: translateY(-200px);
            transform: translateY(-200px);
    opacity: 0;
  }
  40% {
    opacity: .7;
  }
  70% {
    opacity: 1;
  }
  100% {
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}

@keyframes appear-from-top {
  0% {
    -webkit-transform: translateY(-200px);
            transform: translateY(-200px);
    opacity: 0;
  }
  40% {
    opacity: .7;
  }
  70% {
    opacity: 1;
  }
  100% {
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}

.appear-from-top {
  -webkit-animation-name: appear-from-top;
          animation-name: appear-from-top;
  -webkit-animation-timing-function: cubic-bezier(0.39, 0.58, 0.57, 1);
          animation-timing-function: cubic-bezier(0.39, 0.58, 0.57, 1);
}

@-webkit-keyframes appear-from-bottom {
  0% {
    -webkit-transform: translateY(200px);
            transform: translateY(200px);
    opacity: 0;
  }
  40% {
    opacity: .7;
  }
  70% {
    opacity: 1;
  }
  100% {
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}

@keyframes appear-from-bottom {
  0% {
    -webkit-transform: translateY(200px);
            transform: translateY(200px);
    opacity: 0;
  }
  40% {
    opacity: .7;
  }
  70% {
    opacity: 1;
  }
  100% {
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}

.appear-from-bottom {
  -webkit-animation-name: appear-from-bottom;
          animation-name: appear-from-bottom;
  -webkit-animation-timing-function: cubic-bezier(0.39, 0.58, 0.57, 1);
          animation-timing-function: cubic-bezier(0.39, 0.58, 0.57, 1);
}