@-webkit-keyframes slide-from-top{from{opacity:0;-webkit-transform:translateY(-20px)}to{opacity:1;-webkit-transform:translateY(0)}}
@-o-keyframes slide-from-top{from{opacity:0;-o-transform:translateY(-20px)}to{opacity:1;-o-transform:translateY(0)}}
@-ms-keyframes slide-from-top{from{opacity:0;-ms-transform:translateY(-20px)}to{opacity:1;-ms-transform:translateY(0)}}
@-moz-keyframes slide-from-top{from{opacity:0;-moz-transform:translateY(-20px)}to{opacity:1;-moz-transform:translateY(0)}}
@keyframes slide-from-top{from{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}

@-webkit-keyframes slide-from-top-fixed{from{opacity:0;-webkit-transform:translateX(-50%) translateY(-20px)}to{opacity:1;-webkit-transform:translateX(-50%)  translateY(0)}}
@-o-keyframes  slide-from-top-fixed{from{opacity:0;-webkit-transform:translateX(-50%) translateY(-20px)}to{opacity:1;-webkit-transform:translateX(-50%)  translateY(0)}}
@-ms-keyframes  slide-from-top-fixed{from{opacity:0;-webkit-transform:translateX(-50%) translateY(-20px)}to{opacity:1;-webkit-transform:translateX(-50%)  translateY(0)}}
@-moz-keyframes slide-from-top-fixed{from{opacity:0;-webkit-transform:translateX(-50%) translateY(-20px)}to{opacity:1;-webkit-transform:translateX(-50%)  translateY(0)}}
@keyframes slide-from-top-fixed{from{opacity:0;-webkit-transform:translateX(-50%) translateY(-20px)}to{opacity:1;-webkit-transform:translateX(-50%)  translateY(0)}}


@-webkit-keyframes slide-from-bottom{from{opacity:0;-webkit-transform:translateY(20px)}to{opacity:1;-webkit-transform:translateY(0)}}
@-o-keyframes slide-from-bottom{from{opacity:0;-o-transform:translateY(20px)}to{opacity:1;-o-transform:translateY(0)}}
@-ms-keyframes slide-from-bottom{from{opacity:0;-ms-transform:translateY(20px)}to{opacity:1;-ms-transform:translateY(0)}}
@-moz-keyframes slide-from-bottom{from{opacity:0;-moz-transform:translateY(20px)}to{opacity:1;-moz-transform:translateY(0)}}
@keyframes slide-from-bottom{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}


@-webkit-keyframes slide-from-right{from{opacity:0;-webkit-transform:translateX(20px)}to{opacity:1;-webkit-transform:translateX(0)}}
@-o-keyframes slide-from-right{from{opacity:0;-o-transform:translateX(20px)}to{opacity:1;-o-transform:translateX(0)}}
@-ms-keyframes slide-from-right{from{opacity:0;-ms-transform:translateX(20px)}to{opacity:1;-ms-transform:translateX(0)}}
@-moz-keyframes slide-from-right{from{opacity:0;-moz-transform:translateX(20px)}to{opacity:1;-moz-transform:translateX(0)}}
@keyframes slide-from-right{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}

@-webkit-keyframes slide-from-left{from{opacity:0;-webkit-transform:translateX(-20px)}to{opacity:1;-webkit-transform:translateX(0)}}
@-o-keyframes slide-from-left{from{opacity:0;-o-transform:translateX(-20px)}to{opacity:1;-o-transform:translateX(0)}}
@-ms-keyframes slide-from-left{from{opacity:0;-ms-transform:translateX(-20px)}to{opacity:1;-ms-transform:translateX(0)}}
@-moz-keyframes slide-from-left{from{opacity:0;-moz-transform:translateX(-20px)}to{opacity:1;-moz-transform:translateX(0)}}
@keyframes slide-from-left{from{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}


@-webkit-keyframes rotate-3d{from{opacity:0;-webkit-transform: rotateX(90deg)}to{opacity:1;-webkit-transform:rotateX(0deg)}}
@-o-keyframes rotate-3d{from{opacity:0;-o-transform:rotateX(90deg)}to{opacity:1;-o-transform:rotateX(150deg)}}
@-ms-keyframes rotate-3d{from{opacity:0;-ms-transform:rotateX(90deg)}to{opacity:1;-ms-transform:rotateX(150deg)}}
@-moz-keyframes rotate-3d{from{opacity:0;-moz-transform:rotateX(90deg)}to{opacity:1;-moz-transform:rotateX(150deg)}}
@keyframes rotate-3d{from{opacity:0;transform:rotateX(90deg)}to{opacity:1;transform:rotateX(150deg)}}



@-webkit-keyframes grow{from{opacity:0;-webkit-transform:scale(0.8)}to{opacity:1;-webkit-transform:scale(1)}}
@-o-keyframes grow{from{opacity:0;-o-transform:scale(0.8)}to{opacity:1;-o-transform:scale(1)}}
@-ms-keyframes grow{from{opacity:0;-ms-transform:scale(0.8)}to{opacity:1;-ms-transform:scale(1)}}
@-moz-keyframes grow{from{opacity:0;-moz-transform:scale(0.8)}to{opacity:1;-moz-transform:scale(1)}}
@keyframes grow{from{opacity:0;transform:scale(0.8)}to{opacity:1;transform:scale(1)}}


@-webkit-keyframes grow-y{from{opacity:0;-webkit-transform:scaleY(0)}to{opacity:1;-webkit-transform:scaleY(1)}}
@-o-keyframes grow-y{from{opacity:0;-o-transform:scaleY(0)}to{opacity:1;-o-transform:scaleY(1)}}
@-ms-keyframes grow-y{from{opacity:0;-ms-transform:scaleY(0)}to{opacity:1;-ms-transform:scaleY(1)}}
@-moz-keyframes grow-y{from{opacity:0;-moz-transform:scaleY(0)}to{opacity:1;-moz-transform:scaleY(1)}}
@keyframes grow-y{from{opacity:0;transform:scaleY(0)}to{opacity:1;transform:scaleY(1)}}


@-webkit-keyframes grow-x{from{opacity:0;-webkit-transform:scaleX(0)}to{opacity:1;-webkit-transform:scaleX(1)}}
@-o-keyframes grow-x{from{opacity:0;-o-transform:scaleX(0)}to{opacity:1;-o-transform:scaleX(1)}}
@-ms-keyframes grow-x{from{opacity:0;-ms-transform:scaleX(0)}to{opacity:1;-ms-transform:scaleX(1)}}
@-moz-keyframes grow-x{from{opacity:0;-moz-transform:scaleX(0)}to{opacity:1;-moz-transform:scaleX(1)}}
@keyframes grow-x{from{opacity:0;transform:scaleX(0)}to{opacity:1;transform:scaleX(1)}}


.anim{
	
	 -webkit-backface-visibility: hidden; /* Chrome, Safari, Opera */
   	backface-visibility: hidden;
	opacity:0;
}
.anim.in{
	opacity:1;
	-moz-transition:all 400ms ease-out;
	-ms-transition:all 400ms ease-out;
	-o-transition:all 400ms ease-out;
	-webkit-transition:all 400ms ease-out;
	transition:all 400ms ease-out;
}
.anim.out{
	opacity:0 !important;
}

.in.delay-1{
	-webkit-animation-delay: 100ms !important; 
    animation-delay: 100ms !important; 
	-webkit-transition-delay: 100ms !important; 
    transition-delay: 100ms !important;
}
.in.delay-2{
  -webkit-animation-delay: 200ms !important; 
    animation-delay: 200ms !important; 
	-webkit-transition-delay: 200ms !important; 
    transition-delay: 200ms !important;
}
.in.delay-3{
  -webkit-animation-delay: 300ms !important; 
    animation-delay: 300ms !important; 
	-webkit-transition-delay: 300ms !important; 
    transition-delay: 300ms !important;
}
.in.delay-4{
  -webkit-animation-delay: 400ms !important; 
    animation-delay: 400ms !important; 
	-webkit-transition-delay: 400ms !important; 
    transition-delay: 400ms !important;
}

.in.delay-5{
	-webkit-animation-delay: 500ms !important; 
    animation-delay: 500ms !important; 
	-webkit-transition-delay: 500ms !important; 
    transition-delay: 500ms !important;
}
.in.delay-6{
  -webkit-animation-delay: 600ms !important; 
    animation-delay: 600ms !important; 
	-webkit-transition-delay: 600ms !important; 
    transition-delay: 600ms !important;
}
.in.delay-7{
  -webkit-animation-delay: 700ms !important; 
    animation-delay: 700ms !important; 
	-webkit-transition-delay: 700ms !important; 
    transition-delay: 700ms !important;
}
.in.delay-8{
  -webkit-animation-delay: 800ms !important; 
    animation-delay: 800ms !important; 
	-webkit-transition-delay: 800ms !important; 
    transition-delay: 800ms !important;
}


.anim.from-right.in{
	-webkit-animation: slide-from-right .8s ease;
	  -o-animation: slide-from-right .8s ease;
	  -ms-animation: slide-from-right .8s ease;
	  -moz-animation: slide-from-right .8s ease;
}

.anim.from-left.in{
	-webkit-animation: slide-from-left .8s ease;
	  -o-animation: slide-from-left .8s ease;
	  -ms-animation: slide-from-left .8s ease;
	  -moz-animation: slide-from-left .8s ease;
}

.anim.from-top.in{
	-webkit-animation: slide-from-top .8s ease;
	  -o-animation: slide-from-top .8s ease;
	  -ms-animation: slide-from-top .8s ease;
	  -moz-animation: slide-from-top .8s ease;
}
.anim.from-top.fix.in{
	-webkit-animation: slide-from-top-fixed .8s ease;
	  -o-animation: slide-from-top-fixed .8s ease;
	  -ms-animation: slide-from-top-fixed .8s ease;
	  -moz-animation: slide-from-top-fixed .8s ease;
}

.anim.from-bottom.in{
	-webkit-animation: slide-from-bottom .8s ease;
	  -o-animation: slide-from-bottom .8s ease;
	  -ms-animation: slide-from-bottom .8s ease;
	  -moz-animation: slide-from-bottom .8s ease;
}
.anim.from-center.in{
	-webkit-animation: grow .8s ease;
	  -o-animation: grow .8s ease;
	  -ms-animation: grow .8s ease;
	  -moz-animation: grow .8s ease;
}

.anim.grow-y{
	transform-origin:center bottom;

}
.anim.grow-y.in{
	-webkit-animation: grow-y .8s ease;
	  -o-animation: grow-y .8s ease;
	  -ms-animation: grow-y .8s ease;
	  -moz-animation: grow-y .8s ease;
	  
}
.anim.grow-x{
	transform-origin:left center;
}
.anim.grow-x.in{
	-webkit-animation: grow-x .8s ease;
	  -o-animation: grow-x .8s ease;
	  -ms-animation: grow-x .8s ease;
	  -moz-animation: grow-x .8s ease;
	  
}



/*animacions*/


@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}



@-webkit-keyframes beat {
  to { transform: scale(1.2); }
}
@keyframes beat {
  to { transform: scale(1.2); }
}


@-webkit-keyframes pulse {
  to { opacity:0.1; }
}
@keyframes pulse {
  to { opacity:0.1; }
}




@-webkit-keyframes fadeOut {
  to { transform: rotate(180deg) scale(2); opacity:0.0; }
}
@keyframes fadeOut {
  to { transform: rotate(180deg) scale(2); opacity:0.0; }
}




@-webkit-keyframes bounce {
 to { transform: translateX(-50%) translateY(-0.25em); }
}
@keyframes bounce {
 to { transform: translateX(-50%)  translateY(-0.25em) }
}



@-webkit-keyframes orbit {
    from { -webkit-transform: rotate(0deg) translateX(2em) rotate(0deg); }
    to   { -webkit-transform: rotate(360deg) translateX(2em) rotate(-360deg); }
}

@keyframes orbit {
    from { transform: rotate(0deg) translateX(2em) rotate(0deg); }
    to   { transform: rotate(360deg) translateX(2em) rotate(-360deg); }
}