/* Animations */
.appear-animation {
	opacity: 0;
}

.appear-animation-visible {
	opacity: 1;
}

/* Transitions */
.transition-2ms {
	transition: all 0.2s ease-in-out;
}

/* Side Header Arrow Animations */
@-webkit-keyframes sideMenuArrow {
	0% {
		left: 5px;
	}

	50% {
		left: 10px;
	}

	100% {
		left: 5px;
	}
}

@keyframes sideMenuArrow {
	0% {
		left: 5px;
	}

	50% {
		left: 10px;
	}

	100% {
		left: 5px;
	}
}

@-webkit-keyframes sideMenuArrowBack {
	0% {
		right: 5px;
	}

	50% {
		right: 10px;
	}

	100% {
		right: 5px;
	}
}

@keyframes sideMenuArrowBack {
	0% {
		right: 5px;
	}

	50% {
		right: 10px;
	}

	100% {
		right: 5px;
	}
}

/* Mask Up */
@-webkit-keyframes maskUp {
	from {
		transform: translate(0, 100%);
	}

	to {
		transform: translate(0, 0);
	}
}

@keyframes maskUp {
	from {
		transform: translate(0, 100%);
	}

	to {
		transform: translate(0, 0);
	}
}

/* Mask Right */
@-webkit-keyframes maskRight {
	from {
		transform: translate(-100%, 0);
	}

	to {
		transform: translate(0, 0);
	}
}

@keyframes maskRight {
	from {
		transform: translate(-100%, 0);
	}

	to {
		transform: translate(0, 0);
	}
}

/* Mask Down */
@-webkit-keyframes maskDown {
	from {
		transform: translate(0, -100%);
	}

	to {
		transform: translate(0, 0);
	}
}

@keyframes maskDown {
	from {
		transform: translate(0, -100%);
	}

	to {
		transform: translate(0, 0);
	}
}

/* Mask Left */
@-webkit-keyframes maskLeft {
	from {
		transform: translate(100%, 0);
	}

	to {
		transform: translate(0, 0);
	}
}

@keyframes maskLeft {
	from {
		transform: translate(100%, 0);
	}

	to {
		transform: translate(0, 0);
	}
}

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

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

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

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

@-webkit-keyframes headerReveal {
	from {
		top: -150px;
	}

	to {
		top: 0;
	}
}

@keyframes headerReveal {
	from {
		top: -150px;
	}

	to {
		top: 0;
	}
}

/* Fade In Up Shorter */
@-webkit-keyframes fadeInUpShorter {
	from {
		opacity: 0;
		transform: translate(0, 50px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes fadeInUpShorter {
	from {
		opacity: 0;
		transform: translate(0, 50px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

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

/* Fade In Up Shorter Plus */
@-webkit-keyframes fadeInUpShorterPlus {
	from {
		opacity: 0;
		transform: translate(0, 15px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes fadeInUpShorterPlus {
	from {
		opacity: 0;
		transform: translate(0, 15px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

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

/* Fade In Left Shorter */
@-webkit-keyframes fadeInLeftShorter {
	from {
		opacity: 0;
		transform: translate(50px, 0);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes fadeInLeftShorter {
	from {
		opacity: 0;
		transform: translate(50px, 0);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

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

/* Fade In Left Shorter Plus */
@-webkit-keyframes fadeInLeftShorterPlus {
	from {
		opacity: 0;
		transform: translate(15px, 0);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes fadeInLeftShorterPlus {
	from {
		opacity: 0;
		transform: translate(15px, 0);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

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

/* Fade In Right Shorter */
@-webkit-keyframes fadeInRightShorter {
	from {
		opacity: 0;
		transform: translate(-50px, 0);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes fadeInRightShorter {
	from {
		opacity: 0;
		transform: translate(-50px, 0);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

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

/* Fade In Right Shorter Plus */
@-webkit-keyframes fadeInRightShorterPlus {
	from {
		opacity: 0;
		transform: translate(-15px, 0);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes fadeInRightShorterPlus {
	from {
		opacity: 0;
		transform: translate(-15px, 0);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

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

/* Fade In Right Shorter With Opacity */
@-webkit-keyframes fadeInRightShorterOpacity {
	from {
		opacity: 0;
		transform: translate(-50px, 0);
	}

	to {
		opacity: 0.7;
		transform: none;
	}
}

@keyframes fadeInRightShorterOpacity {
	from {
		opacity: 0;
		transform: translate(-50px, 0);
	}

	to {
		opacity: 0.7;
		transform: none;
	}
}

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

/* Fade In Down Shorter */
@-webkit-keyframes fadeInDownShorter {
	from {
		opacity: 0;
		transform: translate(0, -50px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes fadeInDownShorter {
	from {
		opacity: 0;
		transform: translate(0, -50px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

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

/* Fade In Down Shorter Plus */
@-webkit-keyframes fadeInDownShorterPlus {
	from {
		opacity: 0;
		transform: translate(0, -15px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes fadeInDownShorterPlus {
	from {
		opacity: 0;
		transform: translate(0, -15px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

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

/* Fade In Right and Down Shorter */
@-webkit-keyframes fadeInRightDownShorter {
	from {
		opacity: 0;
		transform: translate(-50px, -50px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes fadeInRightDownShorter {
	from {
		opacity: 0;
		transform: translate(-50px, -50px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

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

/* Fade In Right and Up Shorter */
@-webkit-keyframes fadeInRightUpShorter {
	from {
		opacity: 0;
		transform: translate(-50px, 50px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes fadeInRightUpShorter {
	from {
		opacity: 0;
		transform: translate(-50px, 50px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

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

/* Fade In Left and Down Shorter */
@-webkit-keyframes fadeInLeftDownShorter {
	from {
		opacity: 0;
		transform: translate(50px, -50px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes fadeInLeftDownShorter {
	from {
		opacity: 0;
		transform: translate(50px, -50px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

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

/* Fade In Left and Up Shorter */
@-webkit-keyframes fadeInLeftUpShorter {
	from {
		opacity: 0;
		transform: translate(50px, 50px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes fadeInLeftUpShorter {
	from {
		opacity: 0;
		transform: translate(50px, 50px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

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

/* Expand In */
@-webkit-keyframes expandIn {
	from {
		opacity: 0;
		transform: scale(0.8);
	}

	to {
		opacity: 1;
		transform: scale(1);
	}
}

@keyframes expandIn {
	from {
		opacity: 0;
		transform: scale(0.8);
	}

	to {
		opacity: 1;
		transform: scale(1);
	}
}

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

/* Gradient Transition */
@-webkit-keyframes gradientTransition {
	0% {
		background-position: 0% 50%;
	}

	50% {
		background-position: 100% 50%;
	}

	100% {
		background-position: 0% 50%;
	}
}

@keyframes gradientTransition {
	0% {
		background-position: 0% 50%;
	}

	50% {
		background-position: 100% 50%;
	}

	100% {
		background-position: 0% 50%;
	}
}

/* Slider Scroll Button Animation */
@-webkit-keyframes sliderScrollButton {
	0% {
		opacity: 1;
		transform: translate3d(-50%, 0, 0);
	}

	70% {
		opacity: 1;
		transform: translate3d(-50%, 10px, 0);
	}

	100% {
		opacity: 0;
		transform: translate3d(-50%, 10px, 0);
	}
}

@keyframes sliderScrollButton {
	0% {
		opacity: 1;
		transform: translate3d(-50%, 0, 0);
	}

	70% {
		opacity: 1;
		transform: translate3d(-50%, 10px, 0);
	}

	100% {
		opacity: 0;
		transform: translate3d(-50%, 10px, 0);
	}
}

/* Arrow Left Right */
@-webkit-keyframes arrowLeftRight {
	0% {
		transform: translate3d(-1px, 0, 0);
	}

	50% {
		transform: translate3d(1px, 0, 0);
	}

	100% {
		transform: translate3d(-1px, 0, 0);
	}
}

@keyframes arrowLeftRight {
	0% {
		transform: translate3d(-1px, 0, 0);
	}

	50% {
		transform: translate3d(1px, 0, 0);
	}

	100% {
		transform: translate3d(-1px, 0, 0);
	}
}

/* Nav Item Arrow */
@-webkit-keyframes navItemArrow {
	0% {
		position: relative;
		left: -1px;
	}

	50% {
		position: relative;
		left: 3px;
	}

	100% {
		position: relative;
		left: -1px;
	}
}

@keyframes navItemArrow {
	0% {
		position: relative;
		left: -1px;
	}

	50% {
		position: relative;
		left: 3px;
	}

	100% {
		position: relative;
		left: -1px;
	}
}

/* Hover 3d Effect */
.hover-in {
	transition: .1s ease-out !important;
}

.hover-out {
	transition: .1s ease-in !important;
}

.hover-3d {
	transition: none;
}

/* Hotspot */
@-webkit-keyframes hotspot-pulsate {
	0% {
		transform: scale(1);
		opacity: 0.8;
	}

	45% {
		transform: scale(1.75);
		opacity: 0;
	}
}

@keyframes hotspot-pulsate {
	0% {
		transform: scale(1);
		opacity: 0.8;
	}

	45% {
		transform: scale(1.75);
		opacity: 0;
	}
}

@-webkit-keyframes stop-hotspot-pulsate {
	from {
		opacity: 0.4;
	}

	to {
		transform: scale(2);
		opacity: 0;
	}
}

@keyframes stop-hotspot-pulsate {
	from {
		opacity: 0.4;
	}

	to {
		transform: scale(2);
		opacity: 0;
	}
}

/* Dot Pulse */
@-webkit-keyframes dotPulse {
	from {
		opacity: 1;
		transform: scale(0.2);
	}

	to {
		opacity: 0;
		transform: scale(1);
	}
}

@keyframes dotPulse {
	from {
		opacity: 1;
		transform: scale(0.2);
	}

	to {
		opacity: 0;
		transform: scale(1);
	}
}

.dotPulse {
	-webkit-animation-name: dotPulse;
	animation-name: dotPulse;
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
	-webkit-animation-duration: 4s;
	animation-duration: 4s;
}

/* Blur In */
@-webkit-keyframes blurIn {
	from {
		opacity: 0;
		filter: blur(20px);
		transform: scale(1.3);
	}

	to {
		opacity: 1;
		filter: blur(0.1px);
		transform: none;
	}
}

@keyframes blurIn {
	from {
		opacity: 0;
		filter: blur(20px);
		transform: scale(1.3);
	}

	to {
		opacity: 1;
		filter: blur(0.1px);
		transform: none;
	}
}

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

/* Ken Burns To Right */
@-webkit-keyframes kenBurnsToRight {
	from {
		transform: scale(1.2);
	}

	to {
		transform: scale(1);
	}
}

@keyframes kenBurnsToRight {
	from {
		transform: scale(1.2);
	}

	to {
		transform: scale(1);
	}
}

.kenBurnsToRight {
	-webkit-animation-name: kenBurnsToRight;
	animation-name: kenBurnsToRight;
	-webkit-animation-timing-function: linear;
	animation-timing-function: linear;
	transform-origin: right;
}

/* Ken Burns To Left and Top */
.kenBurnsToRightTop {
	-webkit-animation-name: kenBurnsToRight;
	animation-name: kenBurnsToRight;
	-webkit-animation-timing-function: linear;
	animation-timing-function: linear;
	transform-origin: right top;
}

/* Ken Burns To Left */
@-webkit-keyframes kenBurnsToLeft {
	from {
		transform: scale(1.2);
	}

	to {
		transform: scale(1);
	}
}

@keyframes kenBurnsToLeft {
	from {
		transform: scale(1.2);
	}

	to {
		transform: scale(1);
	}
}

.kenBurnsToLeft {
	-webkit-animation-name: kenBurnsToLeft;
	animation-name: kenBurnsToLeft;
	-webkit-animation-timing-function: linear;
	animation-timing-function: linear;
	transform-origin: left;
}

/* Ken Burns To Left and Top */
.kenBurnsToLeftTop {
	-webkit-animation-name: kenBurnsToLeft;
	animation-name: kenBurnsToLeft;
	-webkit-animation-timing-function: linear;
	animation-timing-function: linear;
	transform-origin: left top;
}

/* Moving From Top to Bottom */
@-webkit-keyframes bgPositionBottomToTop {
	from {
		background-position: bottom;
	}

	to {
		background-position: top;
	}
}

@keyframes bgPositionBottomToTop {
	from {
		background-position: bottom;
	}

	to {
		background-position: top;
	}
}

.bgPositionBottomToTop {
	-webkit-animation-name: bgPositionBottomToTop;
	animation-name: bgPositionBottomToTop;
	-webkit-animation-timing-function: linear;
	animation-timing-function: linear;
	transform-origin: right;
}

/* Pulse */
@-webkit-keyframes pulseAnim {
	from {
		transform: scale(1);
		opacity: 1;
	}

	to {
		transform: scale(1.4);
		opacity: 0;
	}
}

@keyframes pulseAnim {
	from {
		transform: scale(1);
		opacity: 1;
	}

	to {
		transform: scale(1.4);
		opacity: 0;
	}
}

.pulseAnim:not(:hover):after {
	-webkit-animation-name: pulseAnim;
	animation-name: pulseAnim;
}

.pulseAnim:after {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: inherit;
	border-radius: inherit;
	z-index: -1;
}

.pulseAnim.pulseAnimAnimated:after {
	-webkit-animation-duration: 1.5s;
	animation-duration: 1.5s;
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
	-webkit-animation-delay: 1s;
	animation-delay: 1s;
}

.pulseAnim:not(i):after {
	z-index: 0;
}

.pulseAnim:not(i) * {
	position: relative;
	z-index: 1;
}

/* Basic Rotation */
@-webkit-keyframes basicRotation {
	from {
		transform: rotate(0deg);
	}

	to {
		transform: rotate(360deg);
	}
}

@keyframes basicRotation {
	from {
		transform: rotate(0deg);
	}

	to {
		transform: rotate(360deg);
	}
}

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