.in {
	-webkit-animation-timing-function: ease-out;
	-webkit-animation-duration: .35s;
	animation-timing-function: ease-out;
	animation-duration: .35s
}

.out {
	-webkit-animation-timing-function: ease-in;
	-webkit-animation-duration: 225ms;
	animation-timing-function: ease-in;
	animation-duration: 225ms
}

@-webkit-keyframes a {
	0% {
		opacity: 0
	}
	to {
		opacity: 1
	}
}

@keyframes a {
	0% {
		opacity: 0
	}
	to {
		opacity: 1
	}
}

@-webkit-keyframes b {
	0% {
		opacity: 1
	}
	to {
		opacity: 0
	}
}

@keyframes b {
	0% {
		opacity: 1
	}
	to {
		opacity: 0
	}
}

.fade.out {
	opacity: 0;
	-webkit-animation-duration: 125ms;
	-webkit-animation-name: b;
	animation-duration: 125ms;
	animation-name: b
}

.fade.in {
	opacity: 1;
	-webkit-animation-duration: 225ms;
	-webkit-animation-name: a;
	animation-duration: 225ms;
	animation-name: a
}

.pop {
	-webkit-transform-origin: 50% 50%;
	transform-origin: 50% 50%
}

.pop.in {
	-webkit-transform: scale(1);
	-webkit-animation-name: c;
	-webkit-animation-duration: .35s;
	transform: scale(1);
	animation-name: c;
	animation-duration: .35s;
	opacity: 1
}

.pop.out {
	-webkit-animation-name: b;
	-webkit-animation-duration: .1s;
	animation-name: b;
	animation-duration: .1s;
	opacity: 0
}

.pop.in.reverse {
	-webkit-animation-name: a;
	animation-name: a
}

.pop.out.reverse {
	-webkit-transform: scale(.8);
	-webkit-animation-name: d;
	transform: scale(.8);
	animation-name: d
}

@-webkit-keyframes c {
	0% {
		-webkit-transform: scale(.8);
		opacity: 0
	}
	to {
		-webkit-transform: scale(1);
		opacity: 1
	}
}

@keyframes c {
	0% {
		transform: scale(.8);
		opacity: 0
	}
	to {
		transform: scale(1);
		opacity: 1
	}
}

@-webkit-keyframes d {
	0% {
		-webkit-transform: scale(1);
		opacity: 1
	}
	to {
		-webkit-transform: scale(.8);
		opacity: 0
	}
}

@keyframes d {
	0% {
		transform: scale(1);
		opacity: 1
	}
	to {
		transform: scale(.8);
		opacity: 0
	}
}

@-webkit-keyframes e {
	0% {
		-webkit-transform: translate3d(100%, 0, 0)
	}
	to {
		-webkit-transform: translateZ(0)
	}
}

@keyframes e {
	0% {
		transform: translateX(100%)
	}
	to {
		transform: translateX(0)
	}
}

@-webkit-keyframes f {
	0% {
		-webkit-transform: translate3d(-100%, 0, 0)
	}
	to {
		-webkit-transform: translateZ(0)
	}
}

@keyframes f {
	0% {
		transform: translateX(-100%)
	}
	to {
		transform: translateX(0)
	}
}

@-webkit-keyframes g {
	0% {
		-webkit-transform: translateZ(0)
	}
	to {
		-webkit-transform: translate3d(-100%, 0, 0)
	}
}

@keyframes g {
	0% {
		transform: translateX(0)
	}
	to {
		transform: translateX(-100%)
	}
}

@-webkit-keyframes h {
	0% {
		-webkit-transform: translateZ(0)
	}
	to {
		-webkit-transform: translate3d(100%, 0, 0)
	}
}

@keyframes h {
	0% {
		transform: translateX(0)
	}
	to {
		transform: translateX(100%)
	}
}

.slide.in,
.slide.out {
	-webkit-animation-timing-function: ease-out;
	-webkit-animation-duration: .35s;
	animation-timing-function: ease-out;
	animation-duration: .35s
}

.slide.out {
	-webkit-transform: translate3d(-100%, 0, 0);
	-webkit-animation-name: g;
	transform: translateX(-100%);
	animation-name: g
}

.slide.in {
	-webkit-transform: translateZ(0);
	-webkit-animation-name: e;
	transform: translateX(0);
	animation-name: e
}

.slide.out.reverse {
	-webkit-transform: translate3d(100%, 0, 0);
	-webkit-animation-name: h;
	transform: translateX(100%);
	animation-name: h
}

.slide.in.reverse {
	-webkit-transform: translateZ(0);
	-webkit-animation-name: f;
	transform: translateX(0);
	animation-name: f
}

.slidefade.out {
	-webkit-transform: translateX(-100%);
	-webkit-animation-name: g;
	-webkit-animation-duration: 225ms;
	transform: translateX(-100%);
	animation-name: g;
	animation-duration: 225ms
}

.slidefade.in {
	-webkit-transform: translateX(0);
	-webkit-animation-name: a;
	transform: translateX(0);
	animation-name: a
}

.slidefade.in,
.slidefade.out.reverse {
	-webkit-animation-duration: .2s;
	animation-duration: .2s
}

.slidefade.out.reverse {
	-webkit-transform: translateX(100%);
	-webkit-animation-name: h;
	transform: translateX(100%);
	animation-name: h
}

.slidefade.in.reverse {
	-webkit-transform: translateX(0);
	-webkit-animation-name: a;
	-webkit-animation-duration: .2s;
	transform: translateX(0);
	animation-name: a;
	animation-duration: .2s
}

.slidedown.out {
	-webkit-animation-name: b;
	-webkit-animation-duration: .1s;
	animation-name: b;
	animation-duration: .1s
}

.slidedown.in {
	-webkit-transform: translateY(0);
	-webkit-animation-name: i;
	-webkit-animation-duration: .25s;
	transform: translateY(0);
	animation-name: i;
	animation-duration: .25s
}

.slidedown.in.reverse {
	-webkit-animation-name: a;
	-webkit-animation-duration: .15s;
	animation-name: a;
	animation-duration: .15s
}

.slidedown.out.reverse {
	-webkit-transform: translateY(-100%);
	-webkit-animation-name: j;
	-webkit-animation-duration: .2s;
	transform: translateY(-100%);
	animation-name: j;
	animation-duration: .2s
}

@-webkit-keyframes i {
	0% {
		-webkit-transform: translateY(-100%)
	}
	to {
		-webkit-transform: translateY(0)
	}
}

@keyframes i {
	0% {
		transform: translateY(-100%)
	}
	to {
		transform: translateY(0)
	}
}

@-webkit-keyframes j {
	0% {
		-webkit-transform: translateY(0)
	}
	to {
		-webkit-transform: translateY(-100%)
	}
}

@keyframes j {
	0% {
		transform: translateY(0)
	}
	to {
		transform: translateY(-100%)
	}
}

.slideup.out {
	-webkit-animation-name: b;
	-webkit-animation-duration: .1s;
	animation-name: b;
	animation-duration: .1s
}

.slideup.in {
	-webkit-transform: translateY(0);
	-webkit-animation-name: k;
	-webkit-animation-duration: .25s;
	transform: translateY(0);
	animation-name: k;
	animation-duration: .25s
}

.slideup.in.reverse {
	-webkit-animation-name: a;
	-webkit-animation-duration: .15s;
	animation-name: a;
	animation-duration: .15s
}

.slideup.out.reverse {
	-webkit-transform: translateY(100%);
	-webkit-animation-name: l;
	-webkit-animation-duration: .2s;
	transform: translateY(100%);
	animation-name: l;
	animation-duration: .2s
}

@-webkit-keyframes k {
	0% {
		-webkit-transform: translateY(100%)
	}
	to {
		-webkit-transform: translateY(0)
	}
}

@keyframes k {
	0% {
		transform: translateY(100%)
	}
	to {
		transform: translateY(0)
	}
}

@-webkit-keyframes l {
	0% {
		-webkit-transform: translateY(0)
	}
	to {
		-webkit-transform: translateY(100%)
	}
}

@keyframes l {
	0% {
		transform: translateY(0)
	}
	to {
		transform: translateY(100%)
	}
}

.perspectiveView {
	-webkit-perspective: 1000;
	perspective: 1000
}

.flip {
	-webkit-backface-visibility: hidden;
	-webkit-transform: translateX(0);
	backface-visibility: hidden;
	transform: translateX(0);
	background: #fff
}

.flip.out {
	-webkit-transform: rotateY(-90deg) scale(.9);
	-webkit-animation-name: m;
	-webkit-animation-duration: 175ms;
	transform: rotateY(-90deg) scale(.9);
	animation-name: m;
	animation-duration: 175ms
}

.flip.in {
	-webkit-animation-name: p;
	-webkit-animation-duration: 225ms;
	animation-name: p;
	animation-duration: 225ms
}

.flip.out.reverse {
	-webkit-transform: rotateY(90deg) scale(.9);
	-webkit-animation-name: n;
	transform: rotateY(90deg) scale(.9);
	animation-name: n
}

.flip.in.reverse {
	-webkit-animation-name: o;
	animation-name: o
}

.viewport-turn {
	-webkit-perspective: 200px;
	perspective: 200px;
	position: absolute
}

.turn {
	-webkit-backface-visibility: hidden;
	-webkit-transform: translateX(0);
	-webkit-transform-origin: 0;
	backface-visibility: hidden;
	transform: translateX(0);
	transform-origin: 0
}

.turn.out {
	-webkit-transform: rotateY(-90deg) scale(.9);
	-webkit-animation-name: m;
	-webkit-animation-duration: 125ms;
	transform: rotateY(-90deg) scale(.9);
	animation-name: m;
	animation-duration: 125ms
}

.turn.in {
	-webkit-animation-name: p;
	-webkit-animation-duration: .25s;
	animation-name: p;
	animation-duration: .25s
}

.turn.out.reverse {
	-webkit-transform: rotateY(90deg) scale(.9);
	-webkit-animation-name: n;
	transform: rotateY(90deg) scale(.9);
	animation-name: n
}

.turn.in.reverse {
	-webkit-animation-name: o;
	animation-name: o
}

@-webkit-keyframes m {
	0% {
		-webkit-transform: rotateY(0)
	}
	to {
		-webkit-transform: rotateY(-90deg) scale(.9)
	}
}

@keyframes m {
	0% {
		transform: rotateY(0)
	}
	to {
		transform: rotateY(-90deg) scale(.9)
	}
}

@-webkit-keyframes n {
	0% {
		-webkit-transform: rotateY(0)
	}
	to {
		-webkit-transform: rotateY(90deg) scale(.9)
	}
}

@keyframes n {
	0% {
		transform: rotateY(0)
	}
	to {
		transform: rotateY(90deg) scale(.9)
	}
}

@-webkit-keyframes o {
	0% {
		-webkit-transform: rotateY(-90deg) scale(.9)
	}
	to {
		-webkit-transform: rotateY(0)
	}
}

@keyframes o {
	0% {
		transform: rotateY(-90deg) scale(.9)
	}
	to {
		transform: rotateY(0)
	}
}

@-webkit-keyframes p {
	0% {
		-webkit-transform: rotateY(90deg) scale(.9)
	}
	to {
		-webkit-transform: rotateY(0)
	}
}

@keyframes p {
	0% {
		transform: rotateY(90deg) scale(.9)
	}
	to {
		transform: rotateY(0)
	}
}

.flow {
	-webkit-transform-origin: 50% 30%;
	transform-origin: 50% 30%
}

.flow.out {
	-webkit-transform: translateX(-100%) scale(.7);
	-webkit-animation-name: q;
	-webkit-animation-timing-function: ease;
	-webkit-animation-duration: .35s;
	transform: translateX(-100%) scale(.7);
	animation-name: q;
	animation-timing-function: ease;
	animation-duration: .35s
}

.flow.in {
	-webkit-transform: translateX(0) scale(1);
	-webkit-animation-name: t;
	-webkit-animation-timing-function: ease;
	-webkit-animation-duration: .35s;
	transform: translateX(0) scale(1);
	animation-name: t;
	animation-timing-function: ease;
	animation-duration: .35s
}

.flow.out.reverse {
	-webkit-transform: translateX(100%);
	-webkit-animation-name: r;
	transform: translateX(100%);
	animation-name: r
}

.flow.in.reverse {
	-webkit-animation-name: s;
	animation-name: s
}

@-webkit-keyframes q {
	0% {
		-webkit-transform: translateX(0) scale(1)
	}
	60%,
	70% {
		-webkit-transform: translateX(0) scale(.7)
	}
	to {
		-webkit-transform: translateX(-100%) scale(.7)
	}
}

@keyframes q {
	0% {
		transform: translateX(0) scale(1)
	}
	60%,
	70% {
		transform: translateX(0) scale(.7)
	}
	to {
		transform: translateX(-100%) scale(.7)
	}
}

@-webkit-keyframes r {
	0% {
		-webkit-transform: translateX(0) scale(1)
	}
	60%,
	70% {
		-webkit-transform: translateX(0) scale(.7)
	}
	to {
		-webkit-transform: translateX(100%) scale(.7)
	}
}

@keyframes r {
	0% {
		transform: translateX(0) scale(1)
	}
	60%,
	70% {
		transform: translateX(0) scale(.7)
	}
	to {
		transform: translateX(100%) scale(.7)
	}
}

@-webkit-keyframes s {
	0% {
		-webkit-transform: translateX(-100%) scale(.7)
	}
	30%,
	40% {
		-webkit-transform: translateX(0) scale(.7)
	}
	to {
		-webkit-transform: translateX(0) scale(1)
	}
}

@keyframes s {
	0% {
		transform: translateX(-100%) scale(.7)
	}
	30%,
	40% {
		transform: translateX(0) scale(.7)
	}
	to {
		transform: translateX(0) scale(1)
	}
}

@-webkit-keyframes t {
	0% {
		-webkit-transform: translateX(100%) scale(.7)
	}
	30%,
	40% {
		-webkit-transform: translateX(0) scale(.7)
	}
	to {
		-webkit-transform: translateX(0) scale(1)
	}
}

@keyframes t {
	0% {
		transform: translateX(100%) scale(.7)
	}
	30%,
	40% {
		transform: translateX(0) scale(.7)
	}
	to {
		transform: translateX(0) scale(1)
	}
}