/* animation */ 
.anim{
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
	
		/* fadeOut */ 
	@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}	
	/* rubberBand */ 
@-webkit-keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(.95, 1.05, 1);
    transform: scale3d(.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, .95, 1);
    transform: scale3d(1.05, .95, 1);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(.95, 1.05, 1);
    transform: scale3d(.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, .95, 1);
    transform: scale3d(1.05, .95, 1);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
		/* rollIn */ 
@-webkit-keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }

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

@keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
		/*zoomIn*/
@-webkit-keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}

@keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}
		/*fadeInLeft*/
@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

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

@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
		/*flipInX*/
@-webkit-keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

@keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}
		/*fadeInUp*/
@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

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

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
		/*fadeInUp back*/
@-webkit-keyframes fadeInUpback {
  from {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

@keyframes fadeInUpback {
  from {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}
		/*fadeInDown*/
@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

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

@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
		/*fadeInRight*/
@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

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

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
		  /*shake*/
@-webkit-keyframes shake {
  from, to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}

@keyframes shake {
  from, to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}
		  /*bounceInRight*/
@-webkit-keyframes bounceInRight {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
    transform: translate3d(-25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes bounceInRight {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
    transform: translate3d(-25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}
		  /*rotateIn*/
@-webkit-keyframes rotateIn {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateIn {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

		  /*bounceInLeft*/
@-webkit-keyframes bounceInLeft {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes bounceInLeft {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

		  /*slideInUp*/
@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
		  /*slideOutLeft*/
@-webkit-keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-120%, 0, 0);
    transform: translate3d(-120%, 0, 0);
  }
}
		  /*slideInLeft*/
@-webkit-keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

		  /*slideInDown*/
@-webkit-keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}
@keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

@-webkit-keyframes jello {
  from, 11.1%, to {
    -webkit-transform: none;
    transform: none;
  }

  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
    transform: skewX(0.390625deg) skewY(0.390625deg);
  }

  88.8% {
    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}
		  /*slideInDown*/
@keyframes jello {
  from, 11.1%, to {
    -webkit-transform: none;
    transform: none;
  }

  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
    transform: skewX(0.390625deg) skewY(0.390625deg);
  }

  88.8% {
    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}
		  /*slideInRight*/
@-webkit-keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
		  /*flash*/
@-webkit-keyframes flash {
  from, 50%, to {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

@keyframes flash {
  from, 50%, to {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}
		  /*bounceInUp*/
@-webkit-keyframes bounceInUp {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes bounceInUp {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
		  /*flipInY*/
@-webkit-keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

@keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}
		  /*lightSpeedIn*/
@-webkit-keyframes lightSpeedIn {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg);
    opacity: 1;
  }

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

@keyframes lightSpeedIn {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg);
    opacity: 1;
  }

  to {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}
		  /*rotateInDownRight*/
@-webkit-keyframes rotateInDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}
@-webkit-keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
	visibility: hidden;	
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

@keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
	visibility: hidden;	
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}
		  /*my*/
@-webkit-keyframes my {
  from {
    opacity: 0;
    -webkit-transform: translateY(5%);
            transform: translateY(5%);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
  }
}
@keyframes my {
  from {
    opacity: 0;
    -webkit-transform: translateY(5%);
    /* transform: translateY(5%); */
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0%);
    /* transform: translateY(0%); */
  }
}
	/* employee jostle */
@-webkit-keyframes jostle {
     0% { -webkit-transform: translate3d(0, 0, 0); } 
   100% { -webkit-transform: translate3d(0, -15%, 0); }
}
@-moz-keyframes jostle {
     0% { -moz-transform: translate3d(0, 0, 0); } 
   100% { -moz-transform: translate3d(0, -15%, 0); }
}
@keyframes jostle {
     0% { transform: translate3d(0, 0, 0); } 
   100% { transform: translate3d(0, -15%, 0); }
}
/*--------------------------:[ main/Slide 0 ]:---------------------------*/
 section#header {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
   -webkit-animation-delay: 1.3s;
    -moz-animation-delay: 1.3;
    animation-delay: 1.3s;}

.fp-viewing-main .top-link {
	-webkit-animation-name: fadeOutDown;
	animation-name: fadeOutDown;
		}
.fp-viewing-history .top-link {
	-webkit-animation-name: fadeOutDown;
	animation-name: fadeOutDown;
		}
.fp-viewing-about .top-link {
	-webkit-animation-name: fadeOutDown;
	animation-name: fadeOutDown;
		}
.fp-viewing-list .top-link-list {
	-webkit-animation-name: fadeOutDown;
	animation-name: fadeOutDown;
		}
 .top-link {
	-webkit-animation-name: fadeInUp;
	animation-name: fadeInUp;
	transition-timing-function: cubic-bezier(0.48, 0.01, 0.39, 1.8);
    transition-duration: 1s;}
.top-link-list {
	-webkit-animation-name: fadeInUp;
	animation-name: fadeInUp;}
/*--------------------------:[ NEWS ]:---------------------------*/
#new.active .fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;  
}
/*--------------------------:[ CONTACT ]:---------------------------*/
.fp-viewing-contact-office .slideInUp0 {
  -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}
.fp-viewing-contact-office .slideInUp1 {
  -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
       -webkit-animation-delay: 0.1s;
    -moz-animation-delay: 0.1;
    animation-delay: 0.1s;
}
.fp-viewing-contact-office .slideInUp2 {
  -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
       -webkit-animation-delay: 0.2s;
    -moz-animation-delay: 0.2;
    animation-delay: 0.2s;
}
.fp-viewing-contact-office .slideInUp3 {
  -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
       -webkit-animation-delay: 0.3s;
    -moz-animation-delay: 0.3;
    animation-delay: 0.3s;
}
.fp-viewing-contact-office .fadeInDown0 {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}
.fp-viewing-contact-office .fadeInUp1 {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
         -webkit-animation-delay: 1.3s;
    -moz-animation-delay: 1.3;
    animation-delay: 1.3s;
}

/*--------------------------:[ prodlist ]:---------------------------*/
#prodlist.active .fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
     -webkit-animation-delay: 0.1s;
    -moz-animation-delay: 0.1;
    animation-delay: 0.1s;
}
#prodlist.active .fadeInLeft1 {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
     -webkit-animation-delay: 0.2s;
    -moz-animation-delay: 0.2;
    animation-delay: 0.2s;
}
#prodlist.active .fadeInLeft2 {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
     -webkit-animation-delay: 0.3s;
    -moz-animation-delay: 0.3;
    animation-delay: 0.3s;
}
#prodlist.active .fadeInLeft3 {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
     -webkit-animation-delay: 0.4s;
    -moz-animation-delay: 0.4;
    animation-delay: 0.4s;
}
#prodlist.active .fadeInLeft4 {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
     -webkit-animation-delay: 0.5s;
    -moz-animation-delay: 0.5;
    animation-delay: 0.5s;
}
#prodlist.active .fadeInLeft5 {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
     -webkit-animation-delay: 0.6s;
    -moz-animation-delay: 0.6;
    animation-delay: 0.6s;
}
#prodlist.active .fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
#prodlist.active .fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}
#prodlist.active .fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
     -webkit-animation-delay: 0.1s;
    -moz-animation-delay: 0.1;
    animation-delay: 0.1s;
}
#prodlist.active .fadeInRight1 {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
     -webkit-animation-delay: 0.2s;
    -moz-animation-delay: 0.2;
    animation-delay: 0.2s;
}
#prodlist.active .fadeInRight2 {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
     -webkit-animation-delay: 0.3s;
    -moz-animation-delay: 0.3;
    animation-delay: 0.3s;
}
#prodlist.active .fadeInRight3 {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
     -webkit-animation-delay: 0.4s;
    -moz-animation-delay: 0.4;
    animation-delay: 0.4s;
}
#prodlist.active .fadeInRight4 {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
     -webkit-animation-delay: 0.5s;
    -moz-animation-delay: 0.5;
    animation-delay: 0.5s;
}
#prodlist.active .fadeInRight5 {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
     -webkit-animation-delay: 0.6s;
    -moz-animation-delay: 0.6;
    animation-delay: 0.6s;
}
.active .down_arrow{
	animation: jostle 1.4s 1s  infinite alternate;
}
.active .up_arrow {
	animation: jostle 1.4s 2s  infinite alternate;
}
.active .start_arrow {
	animation: jostle 1.4s 1s  infinite alternate;
}

/*--------------------------:[ rcs_oily/acne_crem ]:---------------------------*/
#acnecrem.active .bounceInLeft {
 -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}
#acnecrem.active .slideInUp {
 -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}
/*--------------------------:[ rcs_oily/acne_mask ]:---------------------------*/
#acnemask.active .slideInUp {
 -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}
#acnemask.active .bounceInLeft {
 -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}
/*--------------------------:[ rcs_oily/acne_day_night ]:---------------------------*/
#acnedaynight.active .zoomIn {
 -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}
#acnedaynight.active .slideInDown {
 -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}
/*--------------------------:[ rcs_oily/acne_washing_up ]:---------------------------*/
#acnewashingup.active .bounceInLeft {
 -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}
#acnewashingup.active .slideInUp {
 -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}
/*--------------------------:[ rcs_dry/biomimetic ]:---------------------------*/
#bio.active .slideInUp {
 -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}
#bio.active .bounceInLeft {
 -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}
/*--------------------------:[ rcs_dry/exspress ]:---------------------------*/
#exspr.active .slideInUp {
 -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}
#exspr.active .bounceInLeft {
 -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}
/*--------------------------:[ rcs_dry/emolent ]:---------------------------*/
#emol.active .zoomIn {
 -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}
#emol.active .slideInDown {
 -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}
/*--------------------------:[ rcs_dry/atopik_shower ]:---------------------------*/
#shower.active .bounceInLeft {
 -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}
#shower.active .slideInUp {
 -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}
/*--------------------------:[  rcs_lips/lip_care ]:---------------------------*/
#lips.active .slideInUp {
 -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}
#lips.active .bounceInLeft {
 -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}
/*--------------------------:[ rcs_pigment/showskin_day ]:---------------------------*/
#day.active .slideInUp {
 -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}
#day.active .bounceInLeft {
 -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}
/*--------------------------:[ rcs_pigment/showskin_night ]:---------------------------*/
#night.active .slideInDown {
 -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}
#night.active .slideInUp {
 -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}
/*--------------------------:[ rcs_intim/crem_intim ]:---------------------------*/
#cremintim.active .slideInUp {
 -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}
#cremintim.active .bounceInLeft {
 -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}
/*--------------------------:[ rcs_intim/gel_intime ]:---------------------------*/
#gelintime.active .slideInDown {
 -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}
#gelintime.active .slideInUp {
 -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}
/*--------------------------:[ child_cosm/crem ]:---------------------------*/
#crem_ch.active .slideInUp {
 -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}
#crem_ch.active .bounceInLeft {
 -webkit-animation-name: bounceInLeft;
   animation-name: bounceInLeft;
}
/*--------------------------:[ child_cosm/crem_podguznik ]:---------------------------*/
#crempodguznik.active .slideInDown {
 -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}
#crempodguznik.active .bounceInLeft {
 -webkit-animation-name: bounceInLeft;
   animation-name: slideInUp;
}
/*--------------------------:[ child_cosm/crem_pantenol ]:---------------------------*/
#crempantenol.active .rollIn {
 -webkit-animation-name: rollIn;
  animation-name: rollIn;
}
#crempantenol.active .slideInDown {
 -webkit-animation-name: slideInDown;
   animation-name: slideInDown;
}
/*--------------------------:[ child_cosm/milk ]:---------------------------*/
#milk_ch.active .zoomIn {
 -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}
#milk_ch.active .slideInUp {
 -webkit-animation-name: slideInUp;
   animation-name: slideInUp;
}
/*--------------------------:[ child_bath/shampoo_girl ]:---------------------------*/
#shampoo_g.active .rollIn {
 -webkit-animation-name: rollIn;
  animation-name: rollIn;
}
#shampoo_g.active .bounceInLeft {
 -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}
/*--------------------------:[ child_bath/shampoo ]:---------------------------*/
#shampoo_all.active .zoomIn {
 -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}
#shampoo_all.active .slideInDown {
 -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}
/*--------------------------:[ child_bath/foam ]:---------------------------*/
#foam_ch.active .rollIn {
 -webkit-animation-name: rollIn;
  animation-name: rollIn;
}
#foam_ch.active .bounceInLeft {
 -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}
/*--------------------------:[ child_bath/gel ]:---------------------------*/
#gel_ch.active .zoomIn {
 -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}
#gel_ch.active .slideInDown {
 -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}
/*--------------------------:[ body/Slide 3 ]:---------------------------*/
#sust.active .slideInDown {
 -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}
#sust.active .slideInRight {
 -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}
/*--------------------------:[ body/body_milk]:---------------------------*/
#bodymilk.active  .zoomIn {
 -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}
#bodymilk.active  .slideInDown {
 -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}
/*--------------------------:[ body/crem ]:---------------------------*/
#crem_rc.active  .rollIn {
 -webkit-animation-name: rollIn;
  animation-name: rollIn;
}
#crem_rc.active  .slideInRight {
 -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}
/*--------------------------:[ body/crem_nails ]:---------------------------*/
#cremnails.active  .slideInUp {
 -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}
#cremnails.active  .slideInDown {
 -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}
/*--------------------------:[ body/crem_dry_foot ]:---------------------------*/
#cremdryfoot.active .rollIn {
 -webkit-animation-name: rollIn;
  animation-name: rollIn;
}
#cremdryfoot.active .zoomIn {
 -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}
/*--------------------------:[ body/crem_foot ]:---------------------------*/
#cremfoot.active  .slideInUp {
 -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}
#cremfoot.active  .bounceInLeft {
 -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}
/*--------------------------:[ hair/burdock ]:---------------------------*/
#burdock_rc.active .zoomIn {
 -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}
#burdock_rc.active .slideInDown {
 -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}
/*--------------------------:[ hair/burdock_nettle ]:---------------------------*/
#burdocknettle.active .rollIn {
 -webkit-animation-name: rollIn;
  animation-name: rollIn;
}
#burdocknettle.active .slideInRight {
 -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}
/*--------------------------:[ hair/burdock_chamomile ]:---------------------------*/
#burdockchamomile.active .slideInUp {
 -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}
#burdockchamomile.active .slideInDown {
 -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}
/*--------------------------:[ hair/burdock_pepper ]:---------------------------*/
#burdockpepper.active .rollIn {
 -webkit-animation-name: rollIn;
  animation-name: rollIn;
}
#burdockpepper.active .zoomIn {
 -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}

/*--------------------------:[ fadeOut AFTERLOAD ]:---------------------------*/

.fadeInLeft, .fadeInLeft1, .fadeInLeft2, .fadeInLeft3, .fadeInLeft4, .fadeInLeft5, .bounceInUp, .rubberBand, .rollIn, .zoomIn, .fadeInUp, .fadeInRight, .fadeInRight1, .fadeInRight2, .fadeInRight3, .fadeInRight4, .fadeInRight5, .slideInUp-p, .slideInUp0, .slideInUp1, .slideInUp2, .slideInUp3, .rotateIn, .bounceInRight, .bounceInLeft, .slideInUp, .slideInDown, .jello, .slideInRight, .flash, .flipInY, .flipInX, .flipInX1, .flipInX2, .flipInX3, .lightSpeedIn, .rotateInDownRight, .fadeInDown{
 -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
}