.anim-collapse { animation: collapse 1s; overflow:hidden; animation-fill-mode: forwards; -webkit-animation-fill-mode: forwards; }

@keyframes collapse {
	0%   { opacity: 1.0; }
	50%  { opacity: 0.0; }
	100% { max-height:0; margin:0; padding:0;}
}

.anim-fadein { animation: fadein 0.5s; }

@keyframes fadein {
	0%   { opacity: 0.0; }
	100% { opacity: 1.0; }
}

.anim-slide-left { animation: slide-left 0.5s; }

@keyframes slide-left {
  0%   { left: -100%; }
  100% { left: 0; }
}

.anim-slide-right { animation: slide-right 0.5s; }

@keyframes slide-right {
  0%   { right: -100%; }
  100% { right: 0; }
}

.anim-pulse {
	animation: pulse 1.5s infinite;
}

@keyframes pulse {
	0%   { transform: scale(0.95); }
	70%  { transform: scale(1); }
	100% { transform: scale(0.95); }
}

.anim-gradient {
  animation: gradient 3s infinite;
  animation-fill-mode: forwards;
  animation-timing-function: linear;
}

@keyframes gradient {
  0%   { background-position: 0 0; }
  100% { background-position: -200% 0; }
}

.anim-shine:before {
    animation: shine 4s infinite;
    animation-delay: 0.5s;
}

@keyframes shine {
	0%   { left: 0; opacity: 0; }
	5%   {opacity: 0.0}
	48%  {opacity: 0.4}
	80%  {opacity: 0.0}
	100% { left: 80%}
}

.anim-shaking { animation: shaking .1s linear infinite; }

@keyframes shaking {
	0% { transform: rotate(0deg); }
	25% { transform: rotate(3deg); }
	50% { transform: rotate(0deg); }
	75% { transform: rotate(-3deg); }
}

.anim-rotate { animation: rotate 5s linear infinite; }

@keyframes rotate {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

.parallax > use {
  animation: move-forever 25s cubic-bezier(.55,.5,.45,.5) infinite;
}
.parallax > use:nth-child(1) {
  animation-delay: -2s;
  animation-duration: 3s;
}
.parallax > use:nth-child(2) {
  animation-delay: -4s;
  animation-duration: 1.5s;
}

@keyframes move-forever {
  0% { transform: translate3d(-90px,0,0); }
  100% { transform: translate3d(85px,0,0); }
}


.anim-ants {
  -webkit-animation: ants 30s linear infinite;
  -webkit-animation-fill-mode: forwards;
}

@-webkit-keyframes ants  {
  to { stroke-dashoffset: -100%; }
}

/**************************************
	EFFECTS
**************************************/

/* Shine effect */

.shine {
	position:relative;
}

.shine:before {
    position: absolute;
    content: '';
    opacity: 0;
    top: 0;
    left: 0;
    width: 20%;
    height: 100%;
    transform: skew(-20deg);
}

.shine:before { background: linear-gradient(to right, #fff0 0%, #fff6 30%, 50%, #fffA 70%, #fffA 71%, #fff0 100%); }

/* Ripple effect */

.ripple { position:relative; overflow:hidden;}
.ripple:after {
	content:'';
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-position: center;
	transition: background 0.8s;
}

.ripple:hover:after {
  background: #fff0 radial-gradient(circle, #fff3 1%, #fff1 1%) center/15000%;
}

.ripple:active:after {
  background-color: #fff0;
  background-size: 100%;
  transition: background 0s;
}


.loader {
  display: inline-block;
  position:relative;
  width:1rem;
  height:1rem;
}

.loader:after {
  content: "";
  position:absolute;
  display: block;
  top:0;
  left:0;
  width: calc(100% - 4px);
  height: calc(100% - 4px);
  border-radius: 50%;
  border: 2px solid #fff;
  border-color: #0007 #0003 #0007 #0003;
  animation: rotate 1s linear infinite;
}

.loader.light:after { border-color: #fff7 #fff3 #fff7 #fff3; }