/* 4 classes: navInLeft, navInRight, navOutLeft, navOutRight */

/*****************************************/
/* Slide forward */
/*****************************************/

.fxSlideForward .navOutNext {
	-webkit-transform-origin: -50% 50%;
	transform-origin: -50% 50%;
	-webkit-animation: scaleDown 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
	animation: scaleDown 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
}

.fxSlideForward .navInNext {
	-webkit-transform-origin: 150% 50%;
	transform-origin: 150% 50%;
	-webkit-animation: scaleUp 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
	animation: scaleUp 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
}

.fxSlideForward .navOutPrev {
	-webkit-transform-origin: 150% 50%;
	transform-origin: 150% 50%;
	-webkit-animation: scaleDown 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
	animation: scaleDown 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
}

.fxSlideForward .navInPrev {
	-webkit-transform-origin: -50% 50%;
	transform-origin: -50% 50%;
	-webkit-animation: scaleUp 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
	animation: scaleUp 0.5s forwards cubic-bezier(0.7, 0, 0.3, 1);
}

@-webkit-keyframes scaleUp {
	from {
		-webkit-transform: scale(0);
	}
	to {
		-webkit-transform: scale(1);
		opacity: 1;
	}
}

@keyframes scaleUp {
	from {
		-webkit-transform: scale(0);
		transform: scale(0);
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 1;
	}
}

@-webkit-keyframes scaleDown {
	from {} /* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
	to {
		-webkit-transform: scale(0);
		opacity: 0;
	}
}

@keyframes scaleDown {
	from {} /* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
	to {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0;
	}
}

/*****************************************/
/* Table Drop */
/*****************************************/

.fxTableDrop .navOutNext {
	-webkit-animation: slideOutDown 0.4s forwards cubic-bezier(0.7, 0, 0.3, 1);
	animation: slideOutDown 0.4s forwards cubic-bezier(0.7, 0, 0.3, 1);
}

.fxTableDrop .navInNext {
	-webkit-transform-origin: 50% 100%;
	transform-origin: 50% 100%;
	-webkit-animation: slideInDown 0.4s 0.2s forwards ease-in;
	animation: slideInDown 0.4s 0.2s forwards ease-in;
}

.fxTableDrop .navOutPrev {
	-webkit-animation: slideOutUp 0.4s forwards cubic-bezier(0.7, 0, 0.3, 1);
	animation: slideOutUp 0.4s forwards cubic-bezier(0.7, 0, 0.3, 1);
}

.fxTableDrop .navInPrev {
	-webkit-transform-origin: 50% 100%;
	transform-origin: 50% 100%;
	-webkit-animation: slideInUp 0.4s 0.2s forwards ease-in;
	animation: slideInUp 0.4s 0.2s forwards ease-in;
}

@-webkit-keyframes slideOutDown {
	from {} /* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
	100% {
		-webkit-transform: translateY(150%);
		opacity: 0;
	}
}

@keyframes slideOutDown {
	from {} /* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
	100% {
		-webkit-transform: translateY(150%);
		transform: translateY(150%);
		opacity: 0;
	}
}

@-webkit-keyframes slideInDown {
	0% {
		-webkit-animation-timing-function: ease-in-out;
		-webkit-transform: translateY(-150%);
	}
	50% {
		-webkit-transform: translateY(0) rotate(1deg);
		opacity: 1;
	}
	70% {
		-webkit-transform: translateY(0) rotate(-1deg);
	}
	85% {
		-webkit-transform: translateY(0) rotate(1deg);
	}
	95% {
		-webkit-transform: translateY(0) rotate(-1deg);
	}
	100% {
		-webkit-transform: translateY(0);
		opacity: 1;
	}
}

@keyframes slideInDown {
	0% {
		-webkit-animation-timing-function: ease-in-out;
		animation-timing-function: ease-in-out;
		-webkit-transform: translateY(-150%);
		transform: translateY(-150%);
	}
	50% {
		-webkit-transform: translateY(0) rotate(1deg);
		transform: translateY(0) rotate(1deg);
		opacity: 1;
	}
	70% {
		-webkit-transform: translateY(0) rotate(-1deg);
		transform: translateY(0) rotate(-1deg);
	}
	85% {
		-webkit-transform: translateY(0) rotate(1deg);
		transform: translateY(0) rotate(1deg);
	}
	95% {
		-webkit-transform: translateY(0) rotate(-1deg);
		transform: translateY(0) rotate(-1deg);
	}
	100% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1;
	}
}

@-webkit-keyframes slideOutUp {
	from {} /* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
	100% {
		-webkit-transform: translateY(-150%);
		opacity: 0;
	}
}

@keyframes slideOutUp {
	from {} /* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
	100% {
		-webkit-transform: translateY(-150%);
		transform: translateY(-150%);
		opacity: 0;
	}
}

@-webkit-keyframes slideInUp {
	0% {
		-webkit-animation-timing-function: ease-in-out;
		-webkit-transform: translateY(150%);
	}
	50% {
		-webkit-transform: translateY(0) rotate(-1deg);
		opacity: 1;
	}
	70% {
		-webkit-transform: translateY(0) rotate(1deg);
	}
	85% {
		-webkit-transform: translateY(0) rotate(-1deg);
	}
	95% {
		-webkit-transform: translateY(0) rotate(1deg);
	}
	100% {
		-webkit-transform: translateY(0);
		opacity: 1;
	}
}

@keyframes slideInUp {
	0% {
		-webkit-animation-timing-function: ease-in-out;
		animation-timing-function: ease-in-out;
		-webkit-transform: translateY(150%);
		transform: translateY(150%);
	}
	50% {
		-webkit-transform: translateY(0) rotate(-1deg);
		transform: translateY(0) rotate(-1deg);
		opacity: 1;
	}
	70% {
		-webkit-transform: translateY(0) rotate(1deg);
		transform: translateY(0) rotate(1deg);
	}
	85% {
		-webkit-transform: translateY(0) rotate(-1deg);
		transform: translateY(0) rotate(-1deg);
	}
	95% {
		-webkit-transform: translateY(0) rotate(1deg);
		transform: translateY(0) rotate(1deg);
	}
	100% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1;
	}
}

/*****************************************/
/* Slide it */
/*****************************************/

.fxSlideIt li {
	-webkit-transform-origin: 50% 100%;
	transform-origin: 50% 100%;
}

.fxSlideIt .navOutNext {
	-webkit-animation: slideOutLeft 0.5s forwards;
	animation: slideOutLeft 0.5s forwards;
}

.fxSlideIt .navInNext {
	-webkit-animation: rotateSlideInRight 0.6s 0.1s forwards ease-in-out;
	animation: rotateSlideInRight 0.6s 0.1s forwards ease-in-out;
}

.fxSlideIt .navOutPrev {
	-webkit-animation: slideOutRight 0.5s forwards;
	animation: slideOutRight 0.5s forwards;
}

.fxSlideIt .navInPrev {
	-webkit-animation: rotateSlideInLeft 0.6s 0.1s forwards ease-in-out;
	animation: rotateSlideInLeft 0.6s 0.1s forwards ease-in-out;
}

@-webkit-keyframes slideOutLeft {
	from {} /* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
	100% {
		-webkit-transform: translateX(-400%);
		opacity: 0;
	}
}

@keyframes slideOutLeft {
	from {} /* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
	100% {
		-webkit-transform: translateX(-400%);
		transform: translateX(-400%);
		opacity: 0;
	}
}

@-webkit-keyframes rotateSlideInRight {
	0% {
		-webkit-transform: translateX(100%) rotate(20deg);
	}
	35% {
		-webkit-transform: rotate(-8deg);
	}
	55% {
		-webkit-transform: rotate(6deg);
	}
	70% {
		-webkit-transform: rotate(-4deg);
	}
	85% {
		-webkit-transform: rotate(2deg);
	}
	95% {
		-webkit-transform: rotate(-1deg);
	}
	100% {
		-webkit-transform: translateX(0) rotate(0deg);
		opacity: 1;
	}
}

@keyframes rotateSlideInRight {
	0% {
		-webkit-transform: translateX(100%) rotate(20deg);
		transform: translateX(100%) rotate(20deg);
	}
	35% {
		-webkit-transform: rotate(-8deg);
		transform: rotate(-8deg);
	}
	55% {
		-webkit-transform: rotate(6deg);
		transform: rotate(6deg);
	}
	70% {
		-webkit-transform: rotate(-4deg);
		transform: rotate(-4deg);
	}
	85% {
		-webkit-transform: rotate(2deg);
		transform: rotate(2deg);
	}
	95% {
		-webkit-transform: rotate(-1deg);
		transform: rotate(-1deg);
	}
	100% {
		-webkit-transform: translateX(0) rotate(0deg);
		transform: translateX(0) rotate(0deg);
		opacity: 1;
	}
}

@-webkit-keyframes slideOutRight {
	from {} /* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
	100% {
		-webkit-transform: translateX(400%);
		opacity: 0;
	}
}

@keyframes slideOutRight {
	from {} /* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
	100% {
		-webkit-transform: translateX(400%);
		transform: translateX(400%);
		opacity: 0;
	}
}

@-webkit-keyframes rotateSlideInLeft {
	0% {
		-webkit-transform: translateX(-100%) rotate(-20deg);
	}
	35% {
		-webkit-transform: rotate(8deg);
	}
	55% {
		-webkit-transform: rotate(-6deg);
	}
	70% {
		-webkit-transform: rotate(4deg);
	}
	85% {
		-webkit-transform: rotate(-2deg);
	}
	95% {
		-webkit-transform: rotate(1deg);
	}
	100% {
		-webkit-transform: translateX(0) rotate(0deg);
		opacity: 1;
	}
}

@keyframes rotateSlideInLeft {
	0% {
		-webkit-transform: translateX(-100%) rotate(-20deg);
		transform: translateX(-100%) rotate(-20deg);
	}
	35% {
		-webkit-transform: rotate(8deg);
		transform: rotate(8deg);
	}
	55% {
		-webkit-transform: rotate(-6deg);
		transform: rotate(-6deg);
	}
	70% {
		-webkit-transform: rotate(4deg);
		transform: rotate(4deg);
	}
	85% {
		-webkit-transform: rotate(-2deg);
		transform: rotate(-2deg);
	}
	95% {
		-webkit-transform: rotate(1deg);
		transform: rotate(1deg);
	}
	100% {
		-webkit-transform: translateX(0) rotate(0deg);
		transform: translateX(0) rotate(0deg);
		opacity: 1;
	}
}

/*****************************************/
/* Bottle kick */
/*****************************************/

.fxBottleKick li {
	-webkit-transform-origin: 50% 100%;
	transform-origin: 50% 100%;
}

.fxBottleKick .navOutNext {
	-webkit-transform-origin: 0% 100%;
	transform-origin: 0% 100%;
	-webkit-animation: rotateBounceOutLeft 1s forwards ease-in-out;
	animation: rotateBounceOutLeft 1s forwards ease-in-out;
}

.fxBottleKick .navInNext {
	-webkit-animation: rotateBounceInRight 1s 0.1s forwards ease-in-out;
	animation: rotateBounceInRight 1s 0.1s forwards ease-in-out;
}

.fxBottleKick .navOutPrev {
	-webkit-transform-origin: 100% 100%;
	transform-origin: 100% 100%;
	-webkit-animation: rotateBounceOutRight 1s forwards ease-in-out;
	animation: rotateBounceOutRight 1s forwards ease-in-out;
}

.fxBottleKick .navInPrev {
	-webkit-animation: rotateBounceInLeft 1s 0.1s forwards ease-in-out;
	animation: rotateBounceInLeft 1s 0.1s forwards ease-in-out;
}

@-webkit-keyframes rotateBounceOutLeft {
	from {} /* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
	25% {
		-webkit-transform: translateX(-100%) rotate(0deg);
		opacity: 0.9;
	}
	58% {
		-webkit-transform: translateX(-150%) rotate(-92deg);
		opacity: 0.9;
	}
	70% {
		-webkit-transform: translateX(-150%) rotate(-75deg);
	}
	86% {
		-webkit-transform: translateX(-150%) rotate(-92deg);
	}
	95% {
		-webkit-transform: translateX(-150%) rotate(-87deg);
	}
	100% {
		-webkit-transform: translateX(-150%) rotate(-90deg);
		opacity: 0;
	}
}

@keyframes rotateBounceOutLeft {
	from {} /* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
	25% {
		-webkit-transform: translateX(-100%) rotate(0deg);
		transform: translateX(-100%) rotate(0deg);
		opacity: 0.9;
	}
	58% {
		-webkit-transform: translateX(-150%) rotate(-92deg);
		transform: translateX(-150%) rotate(-92deg);
		opacity: 0.9;
	}
	70% {
		-webkit-transform: translateX(-150%) rotate(-75deg);
		transform: translateX(-150%) rotate(-75deg);
	}
	86% {
		-webkit-transform: translateX(-150%) rotate(-92deg);
		transform: translateX(-150%) rotate(-92deg);
	}
	95% {
		-webkit-transform: translateX(-150%) rotate(-87deg);
		transform: translateX(-150%) rotate(-87deg);
	}
	100% {
		-webkit-transform: translateX(-150%) rotate(-90deg);
		transform: translateX(-150%) rotate(-90deg);
		opacity: 0;
	}
}

@-webkit-keyframes rotateBounceInRight {
	0% {
		-webkit-transform: translateX(200%) rotate(20deg);
	}
	25% {
		-webkit-transform: rotate(-5deg);
	}
	55% {
		-webkit-transform: translateX(-5%) rotate(3deg);
		opacity: 1;
	}
	80% {
		-webkit-transform: rotate(-2deg);
	}
	100% {
		-webkit-transform: translateX(0) rotate(0deg);
		opacity: 1;
	}
}

@keyframes rotateBounceInRight {
	0% {
		-webkit-transform: translateX(200%) rotate(20deg);
		transform: translateX(200%) rotate(20deg);
	}
	25% {
		-webkit-transform: rotate(-5deg);
		transform: rotate(-5deg);
	}
	55% {
		-webkit-transform: translateX(-5%) rotate(3deg);
		transform: translateX(-5%) rotate(3deg);
		opacity: 1;
	}
	80% {
		-webkit-transform: rotate(-2deg);
		transform: rotate(-2deg);
	}
	100% {
		-webkit-transform: translateX(0) rotate(0deg);
		transform: translateX(0) rotate(0deg);
		opacity: 1;
	}
}

@-webkit-keyframes rotateBounceOutRight {
	from {} /* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
	25% {
		-webkit-transform: translateX(100%) rotate(0deg);
		opacity: 0.9;
	}
	58% {
		-webkit-transform: translateX(150%) rotate(92deg);
		opacity: 0.9;
	}
	70% {
		-webkit-transform: translateX(150%) rotate(75deg);
	}
	86% {
		-webkit-transform: translateX(150%) rotate(92deg);
	}
	95% {
		-webkit-transform: translateX(150%) rotate(87deg);
	}
	100% {
		-webkit-transform: translateX(150%) rotate(90deg);
		opacity: 0;
	}
}

@keyframes rotateBounceOutRight {
	from {} /* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
	25% {
		-webkit-transform: translateX(100%) rotate(0deg);
		transform: translateX(100%) rotate(0deg);
		opacity: 0.9;
	}
	58% {
		-webkit-transform: translateX(150%) rotate(92deg);
		transform: translateX(150%) rotate(92deg);
		opacity: 0.9;
	}
	70% {
		-webkit-transform: translateX(150%) rotate(75deg);
		transform: translateX(150%) rotate(75deg);
	}
	86% {
		-webkit-transform: translateX(150%) rotate(92deg);
		transform: translateX(150%) rotate(92deg);
	}
	95% {
		-webkit-transform: translateX(150%) rotate(87deg);
		transform: translateX(150%) rotate(87deg);
	}
	100% {
		-webkit-transform: translateX(150%) rotate(90deg);
		transform: translateX(150%) rotate(90deg);
		opacity: 0;
	}
}

@-webkit-keyframes rotateBounceInLeft {
	0% {
		-webkit-transform: translateX(-200%) rotate(-20deg);
	}
	25% {
		-webkit-transform: rotate(5deg);
	}
	55% {
		-webkit-transform: translateX(5%) rotate(-3deg);
		opacity: 1;
	}
	80% {
		-webkit-transform: rotate(2deg);
	}
	100% {
		-webkit-transform: translateX(0) rotate(0deg);
		opacity: 1;
	}
}

@keyframes rotateBounceInLeft {
	0% {
		-webkit-transform: translateX(-200%) rotate(-20deg);
		transform: translateX(-200%) rotate(-20deg);
	}
	25% {
		-webkit-transform: rotate(5deg);
		transform: rotate(5deg);
	}
	55% {
		-webkit-transform: translateX(5%) rotate(-3deg);
		transform: translateX(5%) rotate(-3deg);
		opacity: 1;
	}
	80% {
		-webkit-transform: rotate(2deg);
		transform: rotate(2deg);
	}
	100% {
		-webkit-transform: translateX(0) rotate(0deg);
		transform: translateX(0) rotate(0deg);
		opacity: 1;
	}
}

/*****************************************/
/* Off the Shelf */
/*****************************************/

.fxShelf li {
	-webkit-transform-origin: 50% 100%;
	transform-origin: 50% 100%;
}

.fxShelf .navOutNext {
	-webkit-animation: addToShelfLeft 0.3s forwards ease-in-out;
	animation: addToShelfLeft 0.3s forwards ease-in-out;
}

.fxShelf .navInNext {
	-webkit-animation: removeFromShelfRight 0.5s forwards ease-in-out;
	animation: removeFromShelfRight 0.5s forwards ease-in-out;
}

.fxShelf .navOutPrev {
	-webkit-animation: addToShelfRight 0.3s forwards ease-in-out;
	animation: addToShelfRight 0.3s forwards ease-in-out;
}

.fxShelf .navInPrev {
	-webkit-animation: removeFromShelfLeft 0.5s forwards ease-in-out;
	animation: removeFromShelfLeft 0.5s forwards ease-in-out;
}

@-webkit-keyframes addToShelfLeft {
	from {} /* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
	to {
		-webkit-transform: translateY(-120%) translateX(-300%) rotate(-90deg);
		opacity: 0;
	}
}

@keyframes addToShelfLeft {
	from {} /* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
	to {
		-webkit-transform: translateY(-120%) translateX(-300%) rotate(-90deg);
		transform: translateY(-120%) translateX(-300%) rotate(-90deg);
		opacity: 0;
	}
}

@-webkit-keyframes removeFromShelfRight {
	0% {
		-webkit-transform: translateY(-120%) translateX(300%) rotate(90deg);
	}
	45% {
		-webkit-transform: translateY(0) translateX(0) rotate(-3deg);
		opacity: 1;
	}
	65% {
		-webkit-transform: translateY(0) translateX(0) rotate(2deg);
		opacity: 1;
	}
	80% {
		-webkit-transform: translateY(0) translateX(0) rotate(-1deg);
		opacity: 1;
	}
	95% {
		-webkit-transform: translateY(0) translateX(0) rotate(1deg);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateY(0) translateX(0) rotate(0deg);
		opacity: 1;
	}
}

@keyframes removeFromShelfRight {
	0% {
		-webkit-transform: translateY(-120%) translateX(300%) rotate(90deg);
		transform: translateY(-120%) translateX(300%) rotate(90deg);
	}
	45% {
		-webkit-transform: translateY(0) translateX(0) rotate(-3deg);
		transform: translateY(0) translateX(0) rotate(-3deg);
		opacity: 1;
	}
	65% {
		-webkit-transform: translateY(0) translateX(0) rotate(2deg);
		transform: translateY(0) translateX(0) rotate(2deg);
		opacity: 1;
	}
	80% {
		-webkit-transform: translateY(0) translateX(0) rotate(-1deg);
		transform: translateY(0) translateX(0) rotate(-1deg);
		opacity: 1;
	}
	95% {
		-webkit-transform: translateY(0) translateX(0) rotate(1deg);
		transform: translateY(0) translateX(0) rotate(1deg);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateY(0) translateX(0) rotate(0deg);
		transform: translateY(0) translateX(0) rotate(0deg);
		opacity: 1;
	}
}

@-webkit-keyframes addToShelfRight {
	from {} /* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
	to {
		-webkit-transform: translateY(-120%) translateX(300%) rotate(90deg);
		opacity: 0;
	}
}

@keyframes addToShelfRight {
	from {} /* Fixes Chrome issue 35.0.1916.114 (easing breaks) */
	to {
		-webkit-transform: translateY(-120%) translateX(300%) rotate(90deg);
		transform: translateY(-120%) translateX(300%) rotate(90deg);
		opacity: 0;
	}
}

@-webkit-keyframes removeFromShelfLeft {
	0% {
		-webkit-transform: translateY(-120%) translateX(-300%) rotate(-90deg);
	}
	45% {
		-webkit-transform: translateY(0) translateX(0) rotate(3deg);
		opacity: 1;
	}
	65% {
		-webkit-transform: translateY(0) translateX(0) rotate(-2deg);
		opacity: 1;
	}
	80% {
		-webkit-transform: translateY(0) translateX(0) rotate(1deg);
		opacity: 1;
	}
	95% {
		-webkit-transform: translateY(0) translateX(0) rotate(-1deg);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateY(0) translateX(0) rotate(0deg);
		opacity: 1;
	}
}

@keyframes removeFromShelfLeft {
	0% {
		-webkit-transform: translateY(-120%) translateX(-300%) rotate(-90deg);
		transform: translateY(-120%) translateX(-300%) rotate(-90deg);
	}
	45% {
		-webkit-transform: translateY(0) translateX(0) rotate(3deg);
		transform: translateY(0) translateX(0) rotate(3deg);
		opacity: 1;
	}
	65% {
		-webkit-transform: translateY(0) translateX(0) rotate(-2deg);
		transform: translateY(0) translateX(0) rotate(-2deg);
		opacity: 1;
	}
	80% {
		-webkit-transform: translateY(0) translateX(0) rotate(1deg);
		transform: translateY(0) translateX(0) rotate(1deg);
		opacity: 1;
	}
	95% {
		-webkit-transform: translateY(0) translateX(0) rotate(-1deg);
		transform: translateY(0) translateX(0) rotate(-1deg);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateY(0) translateX(0) rotate(0deg);
		transform: translateY(0) translateX(0) rotate(0deg);
		opacity: 1;
	}
}