/*
 * 	Global animations
 *	------------------------------------------------------------
 */

.animate-all
{ 
	-webkit-transition: all 0.15s ease-in-out;
	-moz-transition: all 0.15s ease-in-out;
	-ms-transition: all 0.15s ease-in-out;
	transition: all 0.15s ease-in-out; 
}

.animate-all.ng-leave, .animate-all.ng-enter-active { opacity: 1; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); transform: scale(1); }
.animate-all.ng-enter, .animate-all.ng-leave-active { opacity: 0; -webkit-transform: scale(0.9); -moz-transform: scale(0.9); -ms-transform: scale(0.9); transform: scale(0.9); }

.animate-all-slow 
{ 
	-webkit-transition: all 0.45s ease-out;
	-moz-transition: all 0.45s ease-out;
	-ms-transition: all 0.45s ease-out;
	transition: all 0.45s ease-out; 
}

.animate-all-really-slow 
{ 
	-webkit-transition: all 0.7s ease-in-out;
	-moz-transition: all 0.7s ease-in-out;
	-ms-transition: all 0.7s ease-in-out;
	transition: all 0.7s ease-in-out; 
}

/*
 * 	Keyframes animations
 *	------------------------------------------------------------
 */

@-webkit-keyframes highlight {
  0%   { -webkit-transform: translateY(0px) scale(1); }
  25%   { -webkit-transform: translateY(0px) scale(1); }
  50%   { -webkit-transform: translateY(-10px) scale(0.9); }
  75% { -webkit-transform: translateY(0px) scale(1); }
  100% { -webkit-transform: translateY(0px) scale(1); }
}
@-moz-keyframes highlight {
  0%   { -moz-transform: translateY(0px) scale(1); }
  25%   { -moz-transform: translateY(0px) scale(1); }
  50%   { -moz-transform: translateY(-10px) scale(0.9); }
  75% { -moz-transform: translateY(0px) scale(1); }
  100% { -moz-transform: translateY(0px) scale(1); }
}
@keyframes highlight {
  0%   { transform: translateY(0px) scale(1); }
  25%   { transform: translateY(0px) scale(1); }
  50%   { transform: translateY(-10px) scale(0.9); }
  75% { transform: translateY(0px) scale(1); }
  100% { transform: translateY(0px) scale(1); }
}

.animate-highlight {
  -webkit-animation: highlight 4s 1s infinite ease-in-out;
  -moz-animation:    highlight 4s 1s infinite ease-in-out;
  animation:         highlight 4s 1s infinite ease-in-out;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

/*
 * Scroll icon
 *	------------------------------------------------------------
 */

.icon-scroll-container { width: 100%; height: 180px; position: relative; }

.icon-scroll, .icon-scroll:before { position: absolute; left: 50% }

.icon-scroll { width: 40px; height: 70px; margin-left: -20px; top: 50%; margin-top: -25px; box-shadow: inset 0 0 0 1px #fe1f4c; border-radius: 25px; }

.icon-scroll:before { content: ''; width: 8px; height: 8px; background: #fe1f4c; margin-left: -4px; top: 8px; border-radius: 4px; animation-duration: 1.5s; animation-iteration-count: infinite; animation-name: scroll; }

@keyframes scroll
{
  0% { opacity: 1 }
  100% { opacity: 0; transform: translateY(46px) }
}