/* ****************************************
Anim style file.
All instructions related to anim.
**************************************** */

/* Hearbeat */
@keyframes heartbeat
{
  0%
  {
    transform: scale( 1 );
  }
  20%
  {
    transform: scale( 1.25 );
  }
  40%
  {
    transform: scale( 1 );
  }
  60%
  {
    transform: scale( 1.25 );
  }
  80%
  {
    transform: scale( 1 );
  }
  100%
  {
    transform: scale( 1 );
  }
}

@keyframes slide_to_left {
  0% { right: -100%;}
  100%{ right: 0;}
}

@keyframes slide_to_right {
  0% { right: 0;}
  100%{ right: -100%;}
}

@keyframes slide_to_right_99 {
  0% { left: 0;}
  100%{ left: 99%;}
}




.with-animation:not(.on-screen) .block-title h1,
.with-animation:not(.on-screen) .block-title h2,
.with-animation:not(.on-screen) .block-title h3,
.with-animation:not(.on-screen) .block-title h4,
.with-animation:not(.on-screen) .block-title h5,
.with-animation:not(.on-screen) .block-title h6,
.with-animation:not(.on-screen) .content,
.with-animation:not(.on-screen) .btn,
.with-animation:not(.on-screen) .sideway-title span,
.with-animation:not(.on-screen) table {
	opacity: 0;
}
.with-animation:not(.on-screen) .block-title,
.with-animation:not(.on-screen) .content {
	overflow: hidden;
}
.with-animation:not(.on-screen) .sideway-title hr { transform: scaleX(0); }


@keyframes scale-in-hor-left {
  0% {
		-webkit-transform: scaleX(0);
		transform: scaleX(0);
		-webkit-transform-origin: 0% 0%;
		transform-origin: 0% 0%;
		opacity: 1;
  }
  100% {
		-webkit-transform: scaleX(1);
		transform: scaleX(1);
		-webkit-transform-origin: 0% 0%;
		transform-origin: 0% 0%;
		opacity: 1;
	}
}
  
.on-screen .sideway-title hr {
	-webkit-animation: scale-in-hor-left cubic-bezier(0, 0, 0.3, 1) 1s 0s forwards;
	animation: scale-in-hor-left cubic-bezier(0, 0, 0.3, 1) 1s 0s forwards;
}
.on-screen .sideway-title span{
	opacity: 0;
	-webkit-animation: fade-in cubic-bezier(0.390, 0.575, 0.565, 1.000) 1s 0.5s forwards;
	animation: fade-in cubic-bezier(0.390, 0.575, 0.565, 1.000) 1s 0.5s forwards;
}
  
  

/**
 * ----------------------------------------
 * Home Slider
 * ----------------------------------------
 */

/* Element slide in from right */
@keyframes slide-in-right {
  0% {
    -webkit-transform: translateX(1000px);
	transform: translateX(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
	transform: translateX(0);
    opacity: 1;
  }
}

.on-screen .slide-from-r, .on-screen .slide-to-l {
	-webkit-animation: slide-in-right cubic-bezier(0, 0, 0.3, 1) 1s 0s forwards;
	animation: slide-in-right cubic-bezier(0, 0, 0.3, 1) 1s 0s forwards;
}


/* Title slide up */ 
@keyframes slide-top {
	0% {
		-webkit-transform: translateY(110%);
		transform: translateY(110%);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1;
	}
}

.on-screen .block-title h1,
.on-screen .block-title h2,
.on-screen .block-title h3,
.on-screen .block-title h4,
.on-screen .block-title h5,
.on-screen .block-title h6 {
	-webkit-animation: slide-top cubic-bezier(0, 0, 0.3, 1) 1s 0s forwards;
	animation: slide-top cubic-bezier(0, 0, 0.3, 1) 1s 0s forwards;
}



/* Text fade-in */ 
@keyframes fade-in {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

.anim-fadeIn {
	opacity: 0;
	transition: opacity 0.6s;
}
.on-screen .anim-fadeIn {opacity: 1;}

.on-screen .content, 
.on-screen .btn, 
.on-screen table {
	opacity: 0;
	-webkit-animation: fade-in cubic-bezier(0.390, 0.575, 0.565, 1.000) 1.5s 0.5s forwards;
	animation: fade-in cubic-bezier(0.390, 0.575, 0.565, 1.000) 1.5s 0.5s forwards;
}






/*Vertival tabs slide IN from bottom | Slide OUT to top */
@keyframes slide-out-top {
	0% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateY(-1000px);
		transform: translateY(-1000px);
		opacity: 0;
	}
}
@keyframes slide-in-bottom {
	0% {
		-webkit-transform: translateY(1000px);
		transform: translateY(1000px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1;
	}
}
@keyframes slide-in-top {
	0% {
		-webkit-transform: translateY(-1000px);
		transform: translateY(-1000px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1;
	}
}
@keyframes slide-out-bottom {
	0% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateY(1000px);
		transform: translateY(1000px);
		opacity: 0;
	}
}

.slide-out-top {
	-webkit-animation: slide-out-top 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
	animation: slide-out-top 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}

.slide-in-bottom {
	-webkit-animation: slide-in-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	animation: slide-in-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

.slide-in-top {
	-webkit-animation: slide-in-top 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
	animation: slide-in-top 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}

.slide-out-bottom {
	-webkit-animation: slide-out-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	animation: slide-out-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

/*Vertival tabs MOBILE slide IN from left | Slide OUT to right */
@keyframes slide-out-right {
	0% {
		-webkit-transform: translateX(0);
		transform: translateX(0);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateX(1000px);
		transform: translateX(1000px);
		opacity: 0;
	}
}
@keyframes slide-in-right {
	0% {
		-webkit-transform: translateX(1000px);
		transform: translateX(1000px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateX(0);
		transform: translateX(0);
		opacity: 1;		
	}
}

@keyframes slide-out-left {
	0% {
		-webkit-transform: translateX(0);
		transform: translateX(0);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateX(-1000px);
		transform: translateX(-1000px);
		opacity: 0;
	}
}
@keyframes slide-in-left {
	0% {
		-webkit-transform: translateX(-1000px);
		transform: translateX(-1000px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateX(0);
		transform: translateX(0);
		opacity: 1;		
	}
}

.slide-out-right {
	-webkit-animation: slide-out-right 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
	animation: slide-out-right 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}

.slide-in-right {
	-webkit-animation: slide-in-right 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	animation: slide-in-right 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

.slide-out-left {
	-webkit-animation: slide-out-left 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	animation: slide-out-left 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

.slide-in-left {
	-webkit-animation: slide-in-left 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
	animation: slide-in-left 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}