
.shakeludiscape{
	animation-name: spaceboots;
	animation-duration: 1s;
	transform-origin:50% 50%;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}

.shakeludiscape{
	-webkit-animation-name: spaceboots;
	-webkit-animation-duration: 1s;
	-webkit-transform-origin:50% 50%;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: linear;
}

.shakeludiscape{
	-ms-animation-name: spaceboots;
	-ms-animation-duration: 1s;
	-ms-transform-origin:50% 50%;
	-ms-animation-iteration-count: infinite;
	-ms-animation-timing-function: linear;
}

@keyframes spaceboots {
	0% {
		transform: translate(2px, 1px) rotate(0deg);}
	10% {
		transform: translate(-1px, -2px) rotate(-1deg);
	}
	20% {
		transform: translate(-3px, 0px) rotate(1deg);
	}
	30% {
		transform: translate(0px, 2px) rotate(0deg);
	}
	40% {
		transform: translate(1px, -1px) rotate(1deg);
	}
	50% {
		transform: translate(-1px, 2px) rotate(-1deg);
	}
	60% {
		transform: translate(-3px, 1px) rotate(0deg);
	}
	70% {
		transform: translate(2px, 1px) rotate(-1deg);
	}
	80% {
		transform: translate(-1px, -1px) rotate(1deg);
	}
	90% {
		transform: translate(2px, 2px) rotate(0deg);
	}
	100% {
		transform: translate(1px, -2px) rotate(-1deg);
	}
}

@-webkit-keyframes spaceboots {
	0% {
		-webkit-transform: translate(2px, 1px) rotate(0deg);}
	10% {
		-webkit-transform: translate(-1px, -2px) rotate(-1deg);
	}
	20% {
		-webkit-transform: translate(-3px, 0px) rotate(1deg);
	}
	30% {
		-webkit-transform: translate(0px, 2px) rotate(0deg);
	}
	40% {
		-webkit-transform: translate(1px, -1px) rotate(1deg);
	}
	50% {
		-webkit-transform: translate(-1px, 2px) rotate(-1deg);
	}
	60% {
		-webkit-transform: translate(-3px, 1px) rotate(0deg);
	}
	70% {
		-webkit-transform: translate(2px, 1px) rotate(-1deg);
	}
	80% {
		-webkit-transform: translate(-1px, -1px) rotate(1deg);
	}
	90% {
		-webkit-transform: translate(2px, 2px) rotate(0deg);
	}
	100% {
		-webkit-transform: translate(1px, -2px) rotate(-1deg);
	}
}

@-ms-keyframes spaceboots {
	0% {
		-ms-transform: translate(2px, 1px) rotate(0deg);}
	10% {
		-ms-transform: translate(-1px, -2px) rotate(-1deg);
	}
	20% {
		-ms-transform: translate(-3px, 0px) rotate(1deg);
	}
	30% {
		-ms-transform: translate(0px, 2px) rotate(0deg);
	}
	40% {
		-ms-transform: translate(1px, -1px) rotate(1deg);
	}
	50% {
		-ms-transform: translate(-1px, 2px) rotate(-1deg);
	}
	60% {
		-ms-transform: translate(-3px, 1px) rotate(0deg);
	}
	70% {
		-ms-transform: translate(2px, 1px) rotate(-1deg);
	}
	80% {
		-ms-transform: translate(-1px, -1px) rotate(1deg);
	}
	90% {
		-ms-transform: translate(2px, 2px) rotate(0deg);
	}
	100% {
		-ms-transform: translate(1px, -2px) rotate(-1deg);
	}
}

/**
 * http://animista.net/play/attention/jello
 * animation bounce-in-top
 * ----------------------------------------
 */
 
.bounce-in-top {
	-webkit-animation: bounce-in-top 1.1s 1s both;
	animation: bounce-in-top 1.1s 1s both;
	-ms-animation : bounce-in-top 1.1s 1s both;
}
@-webkit-keyframes bounce-in-top {
  0% {
    -webkit-transform: translateY(-500px);
            transform: translateY(-500px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
    opacity: 0;
  }
  38% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
    opacity: 1;
  }
  55% {
    -webkit-transform: translateY(-65px);
            transform: translateY(-65px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  72% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  81% {
    -webkit-transform: translateY(-28px);
            transform: translateY(-28px);
    -webkit-animation-timing-function: ease-in;
  }
  90% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  95% {
    -webkit-transform: translateY(-8px);
            transform: translateY(-8px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}
@keyframes bounce-in-top {
  0% {
    -webkit-transform: translateY(-500px);
            transform: translateY(-500px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
    opacity: 0;
  }
  38% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
    opacity: 1;
  }
  55% {
    -webkit-transform: translateY(-65px);
            transform: translateY(-65px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  72% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  81% {
    -webkit-transform: translateY(-28px);
            transform: translateY(-28px);
    -webkit-animation-timing-function: ease-in;
  }
  90% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  95% {
    -webkit-transform: translateY(-8px);
            transform: translateY(-8px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}
@-ms-keyframes bounce-in-top {
  0% {
    -ms-transform: translateY(-500px);
            transform: translateY(-500px);
    -ms-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
    opacity: 0;
  }
  38% {
    -ms-transform: translateY(0);
            transform: translateY(0);
    -ms-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
    opacity: 1;
  }
  55% {
    -ms-transform: translateY(-65px);
            transform: translateY(-65px);
    -ms-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  72% {
    -ms-transform: translateY(0);
            transform: translateY(0);
    -ms-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  81% {
    -ms-transform: translateY(-28px);
            transform: translateY(-28px);
    -ms-animation-timing-function: ease-in;
  }
  90% {
    -ms-transform: translateY(0);
            transform: translateY(0);
    -ms-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  95% {
    -ms-transform: translateY(-8px);
            transform: translateY(-8px);
    -ms-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  100% {
    -ms-transform: translateY(0);
            transform: translateY(0);
    -ms-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}

.slideludiscape{
	-webkit-animation: slide-in-elliptic-top-fwd 0.7s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: slide-in-elliptic-top-fwd 0.7s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
			-ms-animation: slide-in-elliptic-top-fwd 0.7s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
@-webkit-keyframes slide-in-elliptic-top-fwd {
  0% {
    -webkit-transform: translateY(-600px) rotateX(-30deg) scale(0);
            transform: translateY(-600px) rotateX(-30deg) scale(0);
    -webkit-transform-origin: 50% 100%;
            transform-origin: 50% 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) rotateX(0) scale(1);
            transform: translateY(0) rotateX(0) scale(1);
    -webkit-transform-origin: 50% 1400px;
            transform-origin: 50% 1400px;
    opacity: 1;
  }
}
@-ms-keyframes slide-in-elliptic-top-fwd {
  0% {
    -ms-transform: translateY(-600px) rotateX(-30deg) scale(0);
            transform: translateY(-600px) rotateX(-30deg) scale(0);
    -ms-transform-origin: 50% 100%;
            transform-origin: 50% 100%;
    opacity: 0;
  }
  100% {
    -ms-transform: translateY(0) rotateX(0) scale(1);
            transform: translateY(0) rotateX(0) scale(1);
    -ms-transform-origin: 50% 1400px;
            transform-origin: 50% 1400px;
    opacity: 1;
  }
}
@keyframes slide-in-elliptic-top-fwd {
  0% {
    -webkit-transform: translateY(-600px) rotateX(-30deg) scale(0);
            transform: translateY(-600px) rotateX(-30deg) scale(0);
    -webkit-transform-origin: 50% 100%;
            transform-origin: 50% 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) rotateX(0) scale(1);
            transform: translateY(0) rotateX(0) scale(1);
    -webkit-transform-origin: 50% 1400px;
            transform-origin: 50% 1400px;
    opacity: 1;
  }
}

.heartbeatludiscape{
	-webkit-animation: heartbeat 1.5s ease-in-out infinite both;
	        animation: heartbeat 1.5s ease-in-out infinite both;
	    -ms-animation: heartbeat 1.5s ease-in-out infinite both;
}
@-ms-keyframes heartbeat {
  from {
    -ms-transform: scale(1);
            transform: scale(1);
    -ms-transform-origin: center center;
            transform-origin: center center;
    -ms-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  10% {
    -ms-transform: scale(0.91);
            transform: scale(0.91);
    -ms-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  17% {
    -ms-transform: scale(0.98);
            transform: scale(0.98);
    -ms-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  33% {
    -ms-transform: scale(0.87);
            transform: scale(0.87);
    -ms-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  45% {
    -ms-transform: scale(1);
            transform: scale(1);
    -ms-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}
@-webkit-keyframes heartbeat {
  from {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-transform-origin: center center;
            transform-origin: center center;
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  10% {
    -webkit-transform: scale(0.91);
            transform: scale(0.91);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  17% {
    -webkit-transform: scale(0.98);
            transform: scale(0.98);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  33% {
    -webkit-transform: scale(0.87);
            transform: scale(0.87);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  45% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}
@keyframes heartbeat {
  from {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-transform-origin: center center;
            transform-origin: center center;
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  10% {
    -webkit-transform: scale(0.91);
            transform: scale(0.91);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  17% {
    -webkit-transform: scale(0.98);
            transform: scale(0.98);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  33% {
    -webkit-transform: scale(0.87);
            transform: scale(0.87);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  45% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}
