/*                                 */
/*  CLASSI E MODIFICATORI DI BASE  */
/*                                 */

.animated {
	transition-property: transform;
	-webkit-transition-property: transform;
	transition-duration: 1s;
	-webkit-transition-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-duration: 1s;
}
.animated-paused {
	animation-play-state: paused;
	-webkit-animation-play-state: paused;
}
.animated.infinite {
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}
.animated.fast {
	transition-duration: .6s;
	-webkit-transition-duration: .6s;
	animation-duration: .6s;
	-webkit-animation-duration: .6s;
}
.animated.faster {
	transition-duration: .3s;
	-webkit-transition-duration: .3s;
	animation-duration: .3s;
	-webkit-animation-duration: .3s;
}
.animated.fastest {
	transition-duration: .1s;
	-webkit-transition-duration: .1s;
	animation-duration: .1s;
	-webkit-animation-duration: .1s;
}
.animated.slow {
	transition-duration: 2s;
	-webkit-transition-duration: 2s;
	animation-duration: 2s;
	-webkit-animation-duration: 2s;
}
.animated.slower {
	transition-duration: 3s;
	-webkit-transition-duration: 3s;
	animation-duration: 3s;
	-webkit-animation-duration: 3s;
}
.animated.slowest {
	transition-duration: 5s;
	-webkit-transition-duration: 5s;
	animation-duration: 5s;
	-webkit-animation-duration: 5s;
}
.animated.delay {
	transition-delay: 0.5s;
	-webkit-transition-delay: 0.5s;
	animation-delay: 0.5s;
	-webkit-animation-delay: 0.5s;
}
.animated.short-delay {
	transition-delay: 0.2s;
	-webkit-transition-delay: 0.2s;
	animation-delay: 0.2s;
	-webkit-animation-delay: 0.2s;
}
.animated.long-delay {
	transition-delay: 1s;
	-webkit-transition-delay: 1s;
	animation-delay: 1s;
	-webkit-animation-delay: 1s;
}
/****************************************************************************************/
/*
/*   EFFETTI 
/*
/****************************************************************************************/


/*********************/
/*   FADE
/*********************/

.fadeIn {
	animation-name: fadeIn;
	-webkit-animation-name: fadeIn;
}

.fadeIn-50-100 {
	animation-name: fadeIn-50-100;
	-webkit-animation-name: fadeIn-50-100;
}


.fadeOut {
	animation-name: fadeOut;
	-webkit-animation-name: fadeOut;
}
.fadeOut-100-20 {
	animation-name: fadeOut-100-20;
	-webkit-animation-name: fadeOut-100-20;
}
.fadeOut-80-20 {
	animation-name: fadeOut-80-20;
	-webkit-animation-name: fadeOut-80-20;
}


.fadeIn {
	animation-name: fadeIn;
	-webkit-animation-name: fadeIn;
}


.zoom {
	transform: scale(1);
	-webkit-transform: scale(1);
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden
}
.zoom:hover {
	transform: scale(1.10);
	-webkit-transform: scale(1.10)
}

.kbe {
	animation-name: kbe;
	-webkit-animation-name: kbe;

	transform-origin:bottom right;
	-webkit-transform-origin:top right;

	transition-duration: 10s;
	-webkit-transition-duration: 10s;
	animation-duration: 10s;
	-webkit-animation-duration: 10s;
	
	animation-fill-mode: forwards;
	-webkit-animation-fill-mode: forwards;

}


.rotate90 {
	transform: rotate( 90deg );
	-webkit-transform: rotate( 90deg );
}
.rotate180 {
	transform: rotate( 180deg );
	-webkit-transform: rotate( 180deg );
}

.rotate-cc-90 {
	transform: rotate( -90deg );
	-webkit-transform: rotate( -90deg );
}
.rotate-cc-180 {
	transform: rotate( -180deg );
	-webkit-transform: rotate( -180deg );
}



.fadeInLeft {
	animation-name: fadeInLeft;
	-webkit-animation-name: fadeInLeft;
}
.fadeInRight {
	-webkit-animation-name: fadeInRight;
	animation-name: fadeInRight;
}
.fadeInUp {
	-webkit-animation-name: fadeInUp;
	animation-name: fadeInUp;
}
.fadeInUpLess {
	-webkit-animation-name: fadeInUp5;
	animation-name: fadeInUp5;
}
.zoomIn {
  -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}
.zoomOut {
  -webkit-animation-name: zoomOut;
  animation-name: zoomOut;
}

/*			*/
/* HELPERS	*/
/*			*/

.opaque {
	opacity: 1;
	-webkit-opacity: 1;
}

.transparent {
	opacity: 0;
	-webkit-opacity: 0;
}




/****************************************************************************************/
/*
/*  DEFINIZIONE KEYFRAME ANIMAZIONI  
/*
/****************************************************************************************/

@-webkit-keyframes fadeIn {	from {  -webkit-opacity: 0;  }	to {  -webkit-opacity: 1;  } }
@keyframes fadeIn {	from {  opacity: 0;  }	to {  opacity: 1;  } }

@-webkit-keyframes fadeIn-50-100 {from {  -webkit-opacity: 0.5;  }	to {  -webkit-opacity: 1;  }}
@keyframes fadeIn-50-100 { from {  opacity: 0.5;  } to {  opacity: 1;  } }


@-webkit-keyframes fadeOut { from {  -webkit-opacity: 1;  }	to {  -webkit-opacity: 0;  } }
@keyframes fadeOut { from {  opacity: 1;  }  to {  opacity: 0;  } }

@-webkit-keyframes fadeOut-100-20 { from {  -webkit-opacity: 1;  } to {  -webkit-opacity: 0.2;  } }
@keyframes fadeOut-100-20 { from {  opacity: 1;  } to {  opacity: 0.2;  } }

@-webkit-keyframes fadeOut-80-20 { from {  -webkit-opacity: 0.8;  } to {  -webkit-opacity: 0.2;  } }
@keyframes fadeOut-80-20 { from {  opacity: 0.8;  } to {  opacity: 0.2;  } }



@-webkit-keyframes fadeInLeft {
	from {
		opacity: 0;
		-webkit-transform: translate3d(-10%, 0, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
	}
}
@keyframes fadeInLeft {
	from {
		opacity: 0;
		transform: translate3d(-10%, 0, 0);
	}
	to {
		opacity: 1;
		transform: none;
	}
}



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




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

	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
	*/
	 0% {
		opacity: 0;
		-webkit-transform: translate3d(0, 30%, 0);
		transform: translate3d(0, 30%, 0);
	 }
	 25% {
		opacity: 1;
	 }
	 100% {
		-webkit-transform: none;
		transform: none;
	 }
}

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

	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
	*/
	 0% {
		opacity: 0;
		-webkit-transform: translate3d(0, 30%, 0);
		transform: translate3d(0, 30%, 0);
	 }
	 25% {
		opacity: 1;
	 }
	 100% {
		-webkit-transform: none;
		transform: none;
	 }
}


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

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

@keyframes fadeInUp10 {
	from {
		opacity: 0;
		transform: translate3d(0, 10%, 0);
	}

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

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

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

@keyframes fadeInUp5 {
	from {
		opacity: 0;
		transform: translate3d(0, 5%, 0);
	}

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


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

  to {
    opacity: 1;
  }
}

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

  to {
    opacity: 1;
  }
}




@-webkit-keyframes zoomOut {
  from {
    opacity: 0;
    -webkit-transform: scale3d(1.3, 1.3, 1.3);
    transform: scale3d(1.3, 1.3, 1.3);
  }

  to {
    opacity: 1;
  }
}

@keyframes zoomOut {
  from {
    opacity: 0;
    -webkit-transform: scale3d(1.3, 1.3, 1.3);
    transform: scale3d(1.3, 1.3, 1.3);
  }

  to {
    opacity: 1;
  }
}



@-webkit-keyframes kbe {
  from {
    -webkit-transform: scale(1.05);
  }
  to {
    -webkit-transform: scale(1.00);
  }
}

@keyframes kbe {
  from {
    transform: scale(1.05);
  }
  to {
    transform: scale(1.00);
  }
}