.animated {
	-webkit-animation-duration: 0.5s;
	animation-duration: 0.5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}

/*=== fadeInDown animation ===*/
@-webkit-keyframes fadeInDown {
	0% {
		opacity: 0;
		-webkit-transform: translate3d(0, -50px, 0);
		transform: translate3d(0, -50px, 0);
	}
	100% {
		opacity: 1;
		-webkit-transform:nonne;
		transform:none;
	}
}
@keyframes fadeInDown {
	0% {
		opacity: 0;
		-webkit-transform: translate3d(0, -50px, 0);
		-ms-transform: translate3d(0, -50px, 0);
		transform: translate3d(0, -50px, 0);
	}
	100% {
		opacity: 1;
		-webkit-transform:none;
		-ms-transform:none;
		transform:none;
	}
}
.fadeInDown {
	-webkit-animation-name: fadeInDown;
	animation-name: fadeInDown;
}

/*=== fadeOutUp animation ===*/
@-webkit-keyframes fadeOutUp {
	0% {
		opacity: 1;
		visibility: visible;
		-webkit-transform: none;
		transform: none;
	}
	100% {
		opacity: 0;
		visibility: hidden;
		-webkit-transform: translate3d(0, -50px, 0);
		transform: translate3d(0, -50px 0);
	}
}
@keyframes fadeOutUp {
	0% {
		opacity: 1;
		visibility: visible;
		-webkit-transform: none;
		-ms-transform: none;
		transform: none;
	}
	100% {
		opacity: 0;
		visibility: hidden;
		-webkit-transform: translate3d(0, -50px, 0);
		-ms-transform: translate3d(0, -50px, 0);
		transform: translate3d(0, -50px, 0);
	}
}
.fadeOutUp{
	-webkit-animation-name: fadeOutUp;
	animation-name: fadeOutUp;
}

/*=== fadeOutLeft animation ===*/
@-webkit-keyframes fadeOutLeft {
	0% {
		opacity: 1;
		visibility: visible;
		-webkit-transform:none;
		transform:none;
	}
	100% {
		opacity: 0;
		visibility: hidden;
		-webkit-transform: translate3d(-50px, 0, 0);
		transform: translate3d(-50px, 0, 0);
	}
}
@keyframes fadeOutLeft {
	0% {
		opacity: 1;
		visibility: visible;
		-webkit-transform:none;
		-ms-transform:none;
		transform:none;
	}
	100% {
		opacity: 0;
		visibility: hidden;
		-webkit-transform: translate3d(-50px, 0, 0);
		-ms-transform: translate3d(-50px, 0, 0);
		transform: translate3d(-50px, 0, 0);
	}
}
.fadeOutLeft {
	-webkit-animation-name: fadeOutLeft;
	animation-name: fadeOutLeft;
}

/*=== fadeInRight animation ===*/
@-webkit-keyframes fadeInRight {
	0% {
		opacity: 0;
		visibility: hidden;
		-webkit-transform: translate3d(-50px, 0, 0);
		transform: translate3d(-50px, 0, 0);
	}
	100% {
		opacity: 1;
		visibility: visible;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0)
	}
}
@keyframes fadeInRight {
	0% {
		opacity: 0;
		visibility: hidden;
		-webkit-transform: translate3d(-50px, 0, 0);
		-ms-transform: translate3d(-50px, 0, 0);
		transform: translate3d(-50px, 0, 0);
	}
	100% {
		opacity: 1;
		visibility: visible;
		-webkit-transform: translate3d(0, 0, 0);
		-ms-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}
.fadeInRight {
	-webkit-animation-name: fadeInRight;
	animation-name: fadeInRight;
}

/*=== fadeOutLeft Alt animation ===*/
@-webkit-keyframes fadeOutLeftAlt {
	0% {
		opacity: 1;
		visibility: visible;
		-webkit-transform:none;
		transform:none;
	}
	100% {
		opacity: 0;
		visibility: hidden;
		-webkit-transform: translate3d(50px, 0, 0);
		transform: translate3d(50px, 0, 0);
	}
}
@keyframes fadeOutLeftAlt {
	0% {
		opacity: 1;
		visibility: visible;
		-webkit-transform:none;
		-ms-transform:none;
		transform:none;
	}
	100% {
		opacity: 0;
		visibility: hidden;
		-webkit-transform: translate3d(50px, 0, 0);
		-ms-transform: translate3d(50px, 0, 0);
		transform: translate3d(50px, 0, 0);
	}
}
.fadeOutLeftAlt {
	-webkit-animation-name: fadeOutLeftAlt;
	animation-name: fadeOutLeftAlt;
}

/*=== fadeInRight Alt animation ===*/
@-webkit-keyframes fadeInRightAlt {
	0% {
		opacity: 0;
		visibility: hidden;
		-webkit-transform: translate3d(50px, 0, 0);
		transform: translate3d(50px, 0, 0);
	}
	100% {
		opacity: 1;
		visibility: visible;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}
@keyframes fadeInRightAlt {
	0% {
		opacity: 0;
		visibility: hidden;
		-webkit-transform: translate3d(50px, 0, 0);
		-ms-transform: translate3d(50px, 0, 0);
		transform: translate3d(50px, 0, 0);
	}
	100% {
		opacity: 1;
		visibility: visible;
		-webkit-transform: translate3d(0, 0, 0);
		-ms-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}
.fadeInRightAlt {
	-webkit-animation-name: fadeInRightAlt;
	animation-name: fadeInRightAlt;
}

/*=== Pulse animation ===*/
@-webkit-keyframes pulse {
	0% {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
	50% {
		-webkit-transform: scale3d(1.1, 1.1, 1.1);
		transform: scale3d(1.1, 1.1, 1.1);
	}
	100% {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}
@keyframes pulse {
	0% {
		-webkit-transform: scale3d(1, 1, 1);
		-ms-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
	50% {
		-webkit-transform: scale3d(1.1, 1.1, 1.1);
		-ms-transform: scale3d(1.1, 1.1, 1.1);
		transform: scale3d(1.1, 1.1, 1.1);
	}
	100% {
		-webkit-transform: scale3d(1, 1, 1);
		-ms-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}
.pulse {  
	-webkit-animation:pulse 1.25s infinite;
	-moz-animation:pulse 1.25s infinite;
	-o-animation:pulse 1.25s infinite;
	animation:pulse 1.25s infinite;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}

/*=== scaleDown animation ===*/
@-webkit-keyframes scaleDown {
	0% { }
	100% {
		opacity: 0;
		-webkit-transform: scale(.75);
	}
}
@keyframes scaleDown {
	0% { }
	100% {
		opacity: 0;
		-webkit-transform: scale(.75);
		transform: scale(.75); }
}
.scaleDown {
	-webkit-animation: scaleDown .75s ease both;
	animation: scaleDown .75s ease both;
}

/*=== scaleUp animation ===*/
@-webkit-keyframes scaleUp {
	0% { }
	100% {
		opacity: 0;
		visibility: hidden;
		-webkit-transform: scale(1.5);
	}
}
@keyframes scaleUp {
	0% { }
	100% {
		opacity: 0;
		visibility: hidden;
		-webkit-transform: scale(1.5);
		transform: scale(1.5); }
}
.scaleUp {
	-webkit-animation: scaleUp .75s ease both;
	animation: scaleUp .75s ease both;
}

/*=== moveFromRight animation ===*/
@-webkit-keyframes moveFromRight {
	0% {
		-webkit-transform: translateX(100%); 
	}
}
@keyframes moveFromRight {
	0% {
		-webkit-transform: translateX(100%);
		transform: translateX(100%);
	}
}
.moveFromRight {
	-webkit-animation: moveFromRight .75s ease both;
	animation: moveFromRight .75s ease both;
}

/*=== SlideIn animation ===*/
@-webkit-keyframes slidein {
	0% {
		opacity: 0;
		-webkit-transform: translate3d(50px, 0, 0);
		transform: translate3d(50px, 0, 0);
	}
	30%{ opacity: 1;} 
	100% {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}
@-moz-keyframes slidein {
	0% {
		opacity: 0;
		-moz-transform: translate3d(50px, 0, 0);
		transform: translate3d(50px, 0, 0);
	}
	30%{ opacity: 1;} 
	100% {
		opacity: 1;
		-moz-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}
@keyframes slidein {
	0% {
		opacity: 0;
		-webkit-transform: translate3d(50px, 0, 0);
		-moz-transform: translate3d(50px, 0, 0);
		transform: translate3d(50px, 0, 0);
	}
	30%{ opacity: 1;} 
	100% {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		-moz-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}
.slideIn{
	-webkit-animation:slidein 1s;
	-moz-animation:slidein 1s;
	animation:slidein 1s;
	-webkit-animation-delay: 0.25s;
	animation-delay: 0.25s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}

/*=== SlideUp animation ===*/
@-webkit-keyframes slideup {
	0% {
		opacity: 0;
		visibility: hidden;
		-webkit-transform: translate3d(0, 50px, 0);
		transform: translate3d(0, 50px, 0);
	}
	30%{ opacity: 1;visibility: visible;} 
	100% {
		opacity: 1;visibility: visible;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}
@-moz-keyframes slideup {
	0% {
		opacity: 0;
		visibility: hidden;
		-moz-transform: translate3d(0, 50px, 0);
		transform: translate3d(0, 50px, 0);
	}
	30%{ opacity: 1;visibility: visible;} 
	100% {
		opacity: 1;visibility: visible;
		-moz-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}
@keyframes slideup {
	0% {
		visibility: hidden;
		opacity: 0;
		-webkit-transform: translate3d(0, 50px, 0);
		-moz-transform: translate3d(0, 50px, 0);
		transform: translate3d(0, 50px, 0);
	}
	30%{ opacity: 1;visibility: visible;} 
	100% {
		opacity: 1;visibility: visible;
		-webkit-transform: translate3d(0, 0, 0);
		-moz-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}
.slideUp{
	-webkit-animation:slideup 1s;
	-moz-animation:slideup 1s;
	animation:slideup 1s;
	-webkit-animation-delay: 0.25s;
	animation-delay: 0.25s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}


/*=== rotate nav button animation ===*/
@-webkit-keyframes NavRotate {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
}
@-moz-keyframes NavRotate {
	0% {
		-moz-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100% {
		-moz-transform: rotate(45deg);
		transform: rotate(45deg);
	}
}
@keyframes NavRotate {
	0% {
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(34deg);
		-moz-transform: rotate(45deg);
		transform: rotate(45deg);
	}
}
.navrotate{
	-webkit-animation:NavRotate 0.35s;
	-moz-animation:NavRotate 0.35s;
	animation:NavRotate 0.35s;
	-webkit-animation-delay: 0.25s;
	animation-delay: 0.25s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}


/*Body background color changing animation*/
@-webkit-keyframes kf100 {
  0%,100% { background: hsl(0, 90%, 60%); }
  1% { background: hsl(3.6, 90%, 60%); }
  2% { background: hsl(7.2, 90%, 60%); }
  3% { background: hsl(10.8, 90%, 60%); }
  4% { background: hsl(14.4, 90%, 60%); }
  5% { background: hsl(18, 90%, 60%); }
  6% { background: hsl(21.6, 90%, 60%); }
  7% { background: hsl(25.2, 90%, 60%); }
  8% { background: hsl(28.8, 90%, 60%); }
  9% { background: hsl(32.4, 90%, 60%); }
  10% { background: hsl(36, 90%, 60%); }
  11% { background: hsl(39.6, 90%, 60%); }
  12% { background: hsl(43.2, 90%, 60%); }
  13% { background: hsl(46.8, 90%, 60%); }
  14% { background: hsl(50.4, 90%, 60%); }
  15% { background: hsl(54, 90%, 60%); }
  16% { background: hsl(57.6, 90%, 60%); }
  17% { background: hsl(61.2, 90%, 60%); }
  18% { background: hsl(64.8, 90%, 60%); }
  19% { background: hsl(68.4, 90%, 60%); }
  20% { background: hsl(72, 90%, 60%); }
  21% { background: hsl(75.6, 90%, 60%); }
  22% { background: hsl(79.2, 90%, 60%); }
  23% { background: hsl(82.8, 90%, 60%); }
  24% { background: hsl(86.4, 90%, 60%); }
  25% { background: hsl(90, 90%, 60%); }
  26% { background: hsl(93.6, 90%, 60%); }
  27% { background: hsl(97.2, 90%, 60%); }
  28% { background: hsl(100.8, 90%, 60%); }
  29% { background: hsl(104.4, 90%, 60%); }
  30% { background: hsl(108, 90%, 60%); }
  31% { background: hsl(111.6, 90%, 60%); }
  32% { background: hsl(115.2, 90%, 60%); }
  33% { background: hsl(118.8, 90%, 60%); }
  34% { background: hsl(122.4, 90%, 60%); }
  35% { background: hsl(126, 90%, 60%); }
  36% { background: hsl(129.6, 90%, 60%); }
  37% { background: hsl(133.2, 90%, 60%); }
  38% { background: hsl(136.8, 90%, 60%); }
  39% { background: hsl(140.4, 90%, 60%); }
  40% { background: hsl(144, 90%, 60%); }
  41% { background: hsl(147.6, 90%, 60%); }
  42% { background: hsl(151.2, 90%, 60%); }
  43% { background: hsl(154.8, 90%, 60%); }
  44% { background: hsl(158.4, 90%, 60%); }
  45% { background: hsl(162, 90%, 60%); }
  46% { background: hsl(165.6, 90%, 60%); }
  47% { background: hsl(169.2, 90%, 60%); }
  48% { background: hsl(172.8, 90%, 60%); }
  49% { background: hsl(176.4, 90%, 60%); }
  50% { background: hsl(180, 90%, 60%); }
  51% { background: hsl(183.6, 90%, 60%); }
  52% { background: hsl(187.2, 90%, 60%); }
  53% { background: hsl(190.8, 90%, 60%); }
  54% { background: hsl(194.4, 90%, 60%); }
  55% { background: hsl(198, 90%, 60%); }
  56% { background: hsl(201.6, 90%, 60%); }
  57% { background: hsl(205.2, 90%, 60%); }
  58% { background: hsl(208.8, 90%, 60%); }
  59% { background: hsl(212.4, 90%, 60%); }
  60% { background: hsl(216, 90%, 60%); }
  61% { background: hsl(219.6, 90%, 60%); }
  62% { background: hsl(223.2, 90%, 60%); }
  63% { background: hsl(226.8, 90%, 60%); }
  64% { background: hsl(230.4, 90%, 60%); }
  65% { background: hsl(234, 90%, 60%); }
  66% { background: hsl(237.6, 90%, 60%); }
  67% { background: hsl(241.2, 90%, 60%); }
  68% { background: hsl(244.8, 90%, 60%); }
  69% { background: hsl(248.4, 90%, 60%); }
  70% { background: hsl(252, 90%, 60%); }
  71% { background: hsl(255.6, 90%, 60%); }
  72% { background: hsl(259.2, 90%, 60%); }
  73% { background: hsl(262.8, 90%, 60%); }
  74% { background: hsl(266.4, 90%, 60%); }
  75% { background: hsl(270, 90%, 60%); }
  76% { background: hsl(273.6, 90%, 60%); }
  77% { background: hsl(277.2, 90%, 60%); }
  78% { background: hsl(280.8, 90%, 60%); }
  79% { background: hsl(284.4, 90%, 60%); }
  80% { background: hsl(288, 90%, 60%); }
  81% { background: hsl(291.6, 90%, 60%); }
  82% { background: hsl(295.2, 90%, 60%); }
  83% { background: hsl(298.8, 90%, 60%); }
  84% { background: hsl(302.4, 90%, 60%); }
  85% { background: hsl(306, 90%, 60%); }
  86% { background: hsl(309.6, 90%, 60%); }
  87% { background: hsl(313.2, 90%, 60%); }
  88% { background: hsl(316.8, 90%, 60%); }
  89% { background: hsl(320.4, 90%, 60%); }
  90% { background: hsl(324, 90%, 60%); }
  91% { background: hsl(327.6, 90%, 60%); }
  92% { background: hsl(331.2, 90%, 60%); }
  93% { background: hsl(334.8, 90%, 60%); }
  94% { background: hsl(338.4, 90%, 60%); }
  95% { background: hsl(342, 90%, 60%); }
  96% { background: hsl(345.6, 90%, 60%); }
  97% { background: hsl(349.2, 90%, 60%); }
  98% { background: hsl(352.8, 90%, 60%); }
  99% { background: hsl(356.4, 90%, 60%); }
}

@-moz-keyframes kf100 {
  0%,100% { background: hsl(0, 90%, 60%); }
  1% { background: hsl(3.6, 90%, 60%); }
  2% { background: hsl(7.2, 90%, 60%); }
  3% { background: hsl(10.8, 90%, 60%); }
  4% { background: hsl(14.4, 90%, 60%); }
  5% { background: hsl(18, 90%, 60%); }
  6% { background: hsl(21.6, 90%, 60%); }
  7% { background: hsl(25.2, 90%, 60%); }
  8% { background: hsl(28.8, 90%, 60%); }
  9% { background: hsl(32.4, 90%, 60%); }
  10% { background: hsl(36, 90%, 60%); }
  11% { background: hsl(39.6, 90%, 60%); }
  12% { background: hsl(43.2, 90%, 60%); }
  13% { background: hsl(46.8, 90%, 60%); }
  14% { background: hsl(50.4, 90%, 60%); }
  15% { background: hsl(54, 90%, 60%); }
  16% { background: hsl(57.6, 90%, 60%); }
  17% { background: hsl(61.2, 90%, 60%); }
  18% { background: hsl(64.8, 90%, 60%); }
  19% { background: hsl(68.4, 90%, 60%); }
  20% { background: hsl(72, 90%, 60%); }
  21% { background: hsl(75.6, 90%, 60%); }
  22% { background: hsl(79.2, 90%, 60%); }
  23% { background: hsl(82.8, 90%, 60%); }
  24% { background: hsl(86.4, 90%, 60%); }
  25% { background: hsl(90, 90%, 60%); }
  26% { background: hsl(93.6, 90%, 60%); }
  27% { background: hsl(97.2, 90%, 60%); }
  28% { background: hsl(100.8, 90%, 60%); }
  29% { background: hsl(104.4, 90%, 60%); }
  30% { background: hsl(108, 90%, 60%); }
  31% { background: hsl(111.6, 90%, 60%); }
  32% { background: hsl(115.2, 90%, 60%); }
  33% { background: hsl(118.8, 90%, 60%); }
  34% { background: hsl(122.4, 90%, 60%); }
  35% { background: hsl(126, 90%, 60%); }
  36% { background: hsl(129.6, 90%, 60%); }
  37% { background: hsl(133.2, 90%, 60%); }
  38% { background: hsl(136.8, 90%, 60%); }
  39% { background: hsl(140.4, 90%, 60%); }
  40% { background: hsl(144, 90%, 60%); }
  41% { background: hsl(147.6, 90%, 60%); }
  42% { background: hsl(151.2, 90%, 60%); }
  43% { background: hsl(154.8, 90%, 60%); }
  44% { background: hsl(158.4, 90%, 60%); }
  45% { background: hsl(162, 90%, 60%); }
  46% { background: hsl(165.6, 90%, 60%); }
  47% { background: hsl(169.2, 90%, 60%); }
  48% { background: hsl(172.8, 90%, 60%); }
  49% { background: hsl(176.4, 90%, 60%); }
  50% { background: hsl(180, 90%, 60%); }
  51% { background: hsl(183.6, 90%, 60%); }
  52% { background: hsl(187.2, 90%, 60%); }
  53% { background: hsl(190.8, 90%, 60%); }
  54% { background: hsl(194.4, 90%, 60%); }
  55% { background: hsl(198, 90%, 60%); }
  56% { background: hsl(201.6, 90%, 60%); }
  57% { background: hsl(205.2, 90%, 60%); }
  58% { background: hsl(208.8, 90%, 60%); }
  59% { background: hsl(212.4, 90%, 60%); }
  60% { background: hsl(216, 90%, 60%); }
  61% { background: hsl(219.6, 90%, 60%); }
  62% { background: hsl(223.2, 90%, 60%); }
  63% { background: hsl(226.8, 90%, 60%); }
  64% { background: hsl(230.4, 90%, 60%); }
  65% { background: hsl(234, 90%, 60%); }
  66% { background: hsl(237.6, 90%, 60%); }
  67% { background: hsl(241.2, 90%, 60%); }
  68% { background: hsl(244.8, 90%, 60%); }
  69% { background: hsl(248.4, 90%, 60%); }
  70% { background: hsl(252, 90%, 60%); }
  71% { background: hsl(255.6, 90%, 60%); }
  72% { background: hsl(259.2, 90%, 60%); }
  73% { background: hsl(262.8, 90%, 60%); }
  74% { background: hsl(266.4, 90%, 60%); }
  75% { background: hsl(270, 90%, 60%); }
  76% { background: hsl(273.6, 90%, 60%); }
  77% { background: hsl(277.2, 90%, 60%); }
  78% { background: hsl(280.8, 90%, 60%); }
  79% { background: hsl(284.4, 90%, 60%); }
  80% { background: hsl(288, 90%, 60%); }
  81% { background: hsl(291.6, 90%, 60%); }
  82% { background: hsl(295.2, 90%, 60%); }
  83% { background: hsl(298.8, 90%, 60%); }
  84% { background: hsl(302.4, 90%, 60%); }
  85% { background: hsl(306, 90%, 60%); }
  86% { background: hsl(309.6, 90%, 60%); }
  87% { background: hsl(313.2, 90%, 60%); }
  88% { background: hsl(316.8, 90%, 60%); }
  89% { background: hsl(320.4, 90%, 60%); }
  90% { background: hsl(324, 90%, 60%); }
  91% { background: hsl(327.6, 90%, 60%); }
  92% { background: hsl(331.2, 90%, 60%); }
  93% { background: hsl(334.8, 90%, 60%); }
  94% { background: hsl(338.4, 90%, 60%); }
  95% { background: hsl(342, 90%, 60%); }
  96% { background: hsl(345.6, 90%, 60%); }
  97% { background: hsl(349.2, 90%, 60%); }
  98% { background: hsl(352.8, 90%, 60%); }
  99% { background: hsl(356.4, 90%, 60%); }
}