/* Animazioni */
@keyframes scroolUp{
	0%{
		opacity:1;
		transform:scale(1.1,1.1) translateY(0)
	}
	100%{
		opacity:1;
		transform:scale(1.1,1.1) translateY(-4%)
	}
}
@keyframes scroolLeft{
	0%{
		opacity:1;
		transform:scale(1.1,1.1) translateX(0)
	}
	100%{
		opacity:1;
		transform:scale(1.1,1.1) translateX(-4%)
	}
}
@keyframes scroolRight{
	0%{
		opacity:1;
		transform:scale(1.1,1.1) translateX(0)
	}
	100%{
		opacity:1;
		transform:scale(1.1,1.1) translateX(4%)
	}
}
@keyframes scroolDown{
	0%{
		opacity:1;
		transform:scale(1.1,1.1) translateY(0)
	}
	100%{
		opacity:1;
		transform:scale(1.1,1.1) translateY(4%)
	}
}
@keyframes swashIn{
	0% {
	    opacity: 0;
	    transform: scale(0.5, 0.5);
	    transform-origin: 50% 50% 0;
	}
	90% {
	    opacity: 1;
	    transform: scale(0.9, 0.9);
	    transform-origin: 50% 50% 0;
	}
	100% {
	    opacity: 1;
	    transform: scale(1, 1);
	    transform-origin: 50% 50% 0;
	}
}
@keyframes slideLeft{
	0%{
		opacity:0;
		transform-origin:0 0;
		transform:translateX(180%)
		z-index: 1;
	}
	20%{
		opacity:0;
		transform-origin:0 0;
		transform:translateX(180%)
	}
	100%{
		opacity:1;
		transform-origin:0 0;
		transform:translateX(0)
	}
}
@keyframes slideRight{
	0%{
		opacity:0;
		transform-origin:0 0;
		transform:translateX(-80%)
		z-index: 1;
	}
	20%{
		opacity:0;
		transform-origin:0 0;
		transform:translateX(-80%)
	}
	100%{
		opacity:1;
		transform-origin:0 0;
		transform:translateX(0)
	}
}
@keyframes slideDown{
	0%{
		opacity:0;
		transform-origin:0 0;
		transform:translateY(-80%)
		z-index: 1;
	}
	20%{
		opacity:0;
		transform-origin:0 0;
		transform:translateY(-80%)
	}
	100%{
		opacity:1;
		transform-origin:0 0;
		transform:translateY(0)
	}
}
@keyframes slideUp{
	0%{
		opacity:0;
		transform-origin:0 0;
		transform:translateY(180%)
		z-index: 1;
	}
	20%{
		opacity:0;
		transform-origin:0 0;
		transform:translateY(180%)
	}
	100%{
		opacity:1;
		transform-origin:0 0;
		transform:translateY(0)
	}
}
@keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }

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

  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}
@keyframes swingDelay {
  4% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }

  8% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }

  12% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }

  16% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }

  20%, 100% {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}
@keyframes zoomInDown {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
    transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

.animate {
	animation-fill-mode: both;
	animation-duration: 6s;
}
.slow-animate {
	animation-fill-mode: both;
	animation-duration: 10s;
}
.fast-animate {
	animation-fill-mode: both;
	animation-duration: 1s;
}
.top-to-bottom {
	animation-name:scroolDown;
}
.bottom-to-top {
	animation-name:scroolUp;
}
.left-to-right {
	animation-name:scroolRight;
}
.right-to-left {
	animation-name:scroolLeft;
}
.swash-in{
	animation-name: swashIn;
	transform: scale(0.5, 0.5);
}
.swing {
  -webkit-transform-origin: top center;
  transform-origin: top center;
  -webkit-animation-name: swing;
  animation-name: swing;
}
.zoom-in-down {
  -webkit-animation-name: zoomInDown;
  animation-name: zoomInDown;
}
.slide-left{
	animation-name:slideLeft
}
.slide-right{
	animation-name:slideRight
}
.slide-down{
	animation-name:slideDown
}
.slide-up{
	animation-name:slideUp
}