
.anim{
	-webkit-backface-visibility: hidden; /* Chrome, Safari, Opera */
   	backface-visibility: hidden;
	opacity:0;
}
.anim.in{
	opacity:1;
}
.anim.out{
	opacity:0 !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;
	  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;
	  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;
	  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;
	  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;
	  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;
	  animation: grow .8s ease;
}

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

.anim.grow-top{
	transform-origin:center top;

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

}
.anim.grow-top.in,.anim.grow-bottom.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;
	  animation: grow-y .8s ease;
	  
}
.anim.grow-left{
	transform-origin:left center;
}
.anim.grow-right{
	transform-origin:right center;
}
.anim.grow-left.in,.anim.grow-right.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;
	  animation: grow-x .8s ease;
	  
}


.anim.flip-x.in{
	-webkit-animation: flip-horizontal .8s ease;
	  -o-animation: flip-horizontal .8s ease;
	  -ms-animation: flip-horizontal .8s ease;
	  -moz-animation: flip-horizontal .8s ease;
	  animation: flip-horizontal .8s ease;
}

.anim.flip-y.in{
	-webkit-animation: flip-vertical .8s ease;
	  -o-animation: flip-vertical .8s ease;
	  -ms-animation: flip-vertical .8s ease;
	  -moz-animation: flip-vertical .8s ease;
	  animation: flip-vertical .8s ease;
}


/*animations*/
.spin {
  -webkit-animation: spin 2s infinite linear;
  animation: spin 2s infinite linear;
}
@-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);
  }
}

.beat {
  -webkit-animation: beat .4s infinite alternate;
 animation: beat .4s infinite alternate;
 transform-origin: center;
}
@-webkit-keyframes beat {
  to { transform: scale(1.3); }
}
@keyframes beat {
  to { transform: scale(1.3); }
}

.bounce {
  animation:bounce .4s infinite alternate;
  -webkit-animation:bounce .4s infinite alternate;
  transform-origin: bottom;
}

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




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

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






@-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;-o-transform:translateX(-50%) translateY(-20px)}to{opacity:1;-o-transform:translateX(-50%)  translateY(0)}}
@-ms-keyframes  slide-from-top-fixed{from{opacity:0;-ms-transform:translateX(-50%) translateY(-20px)}to{opacity:1;-ms-transform:translateX(-50%)  translateY(0)}}
@-moz-keyframes slide-from-top-fixed{from{opacity:0;-moz-transform:translateX(-50%) translateY(-20px)}to{opacity:1;-moz-transform:translateX(-50%)  translateY(0)}}
@keyframes slide-from-top-fixed{from{opacity:0;transform:translateX(-50%) translateY(-20px)}to{opacity:1;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 flip-horizontal{from{opacity:0;-webkit-transform: rotateX(90deg)}to{opacity:1;-webkit-transform:rotateX(0deg)}}
@-o-keyframes flip-horizontal{from{opacity:0;-o-transform:rotateX(90deg)}to{opacity:1;-o-transform:rotateX(0deg)}}
@-ms-keyframes flip-horizontal{from{opacity:0;-ms-transform:rotateX(90deg)}to{opacity:1;-ms-transform:rotateX(0deg)}}
@-moz-keyframes flip-horizontal{from{opacity:0;-moz-transform:rotateX(90deg)}to{opacity:1;-moz-transform:rotateX(0deg)}}
@keyframes flip-horizontal{from{opacity:0;transform:rotateX(90deg)}to{opacity:1;transform:rotateX(0deg)}}


@-webkit-keyframes flip-vertical{from{opacity:0;-webkit-transform: rotateY(90deg)}to{opacity:1;-webkit-transform:rotateY(0deg)}}
@-o-keyframes flip-vertical{from{opacity:0;-o-transform:rotateY(90deg)}to{opacity:1;-o-transform:rotateY(0deg)}}
@-ms-keyframes flip-vertical{from{opacity:0;-ms-transform:rotateY(90deg)}to{opacity:1;-ms-transform:rotateY(0deg)}}
@-moz-keyframes flip-vertical{from{opacity:0;-moz-transform:rotateY(90deg)}to{opacity:1;-moz-transform:rotateY(0deg)}}
@keyframes flip-vertical{from{opacity:0;transform:rotateY(90deg)}to{opacity:1;transform:rotateY(0deg)}}


@-webkit-keyframes rotate-center{from{opacity:0;-webkit-transform: scale(0.6) rotateZ(90deg)}to{opacity:1;-webkit-transform:scale(1) rotateZ(0deg)}}
@-o-keyframes rotate-center{from{opacity:0;-o-transform:scale(0.6) rotateZ(90deg)}to{opacity:1;-o-transform:scale(1) rotateZ(0deg)}}
@-ms-keyframes rotate-center{from{opacity:0;-ms-transform:scale(0.6) rotateZ(90deg)}to{opacity:1;-ms-transform:scale(1) rotateZ(0deg)}}
@-moz-keyframes rotate-center{from{opacity:0;-moz-transform:scale(0.6) rotateZ(90deg)}to{opacity:1;-moz-transform:scale(1) rotateZ(0deg)}}
@keyframes rotate-center{from{opacity:0;transform:scale(0.6) rotateZ(90deg)}to{opacity:1;transform:scale(1) rotateZ(0deg)}}



@-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)}}

