/* VC Custom BOC Animations */

/* For larger screens */
@media only screen and (min-width: 769px) {
	.boc_animate_when_almost_visible {
		opacity: 0;
	}
	
	/* Used for gradually showing items like .info_item */
	.boc_anim_hidden {
		opacity: 0;
	}
	
	/* Global animation. delay: 0.25s */
	.boc_start_animation, .wpb_start_animation {
		opacity: 1;
		-webkit-transition: transform .7s cubic-bezier(.26, .87, .44, 1) .25s, opacity .6s ease .25s;
		-moz-transition: transform .7s cubic-bezier(.26, .87, .44, 1) .25s, opacity .6s ease .25s;
		-o-transition: transform .7s cubic-bezier(.26, .87, .44, 1) .25s, opacity .6s ease .25s;
		-ms-transition: transform .7s cubic-bezier(.26, .87, .44, 1) .25s, opacity .6s ease .25s;
		transition: transform .7s cubic-bezier(.26, .87, .44, 1) .25s, opacity .6s ease .25s;
	}
	
	/* Especially for buttons */
	.boc_start_animation.button {
		-webkit-transition: all .15s linear, transform .9s cubic-bezier(.26, .87, .44, 1) .25s, opacity .6s ease .25s;
		-moz-transition: all .15s linear, transform .9s cubic-bezier(.26, .87, .44, 1) .25s, opacity .6s ease .25s;
		-ms-transition: all .15s linear, transform .9s cubic-bezier(.26, .87, .44, 1) .25s, opacity .6s ease .25s;
		-o-transition: all .15s linear, transform .9s cubic-bezier(.26, .87, .44, 1) .25s, opacity .6s ease .25s;
		transition: all .15s linear, transform .9s cubic-bezier(.26, .87, .44, 1) .25s, opacity .6s ease .25s;
	}
	
	/*  Bounce back */
	.boc_start_animation.back {
		-webkit-transition: transform .7s cubic-bezier(.25, 1.59, .62, 1.04), opacity .7s ease;
		-moz-transition: transform .7s cubic-bezier(.25, 1.59, .62, 1.04), opacity .7s ease;
		-o-transition: transform .7s cubic-bezier(.25, 1.59, .62, 1.04), opacity .7s ease;
		-ms-transition: transform .7s cubic-bezier(.25, 1.59, .62, 1.04), opacity .7s ease;
		transition: transform .7s cubic-bezier(.25, 1.59, .62, 1.04), opacity .7s ease;
	}
	
	.boc_start_animation.boc_top-to-bottom, .wpb_start_animation.boc_top-to-bottom {
		transform: translateY(0px);
	}
	
	.boc_top-to-bottom {
		transform: translateY(-40px);
	}
	
	.boc_start_animation.boc_bottom-to-top, .wpb_start_animation.boc_bottom-to-top {
		transform: translateY(0px);
	}
	
	.boc_bottom-to-top {
		transform: translateY(40px);
	}
	
	.boc_start_animation.boc_left-to-right, .wpb_start_animation.boc_left-to-right {
		transform: translateY(0px);
	}
	
	.boc_left-to-right {
		transform: translateX(-40px);
	}
	
	.boc_start_animation.boc_right-to-left, .wpb_start_animation.boc_right-to-left {
		transform: translateY(0px);
	}
	
	.boc_right-to-left {
		transform: translateX(40px);
	}
	
	/* Preloader */
	@-webkit-keyframes spin {
		100% {
			-webkit-transform: rotate(360deg);
		}
	}
	
	@-moz-keyframes spin {
		100% {
			-moz-transform: rotate(360deg);
		}
	}
	
	@keyframes spin {
		100% {
			-webkit-transform: rotate(360deg);
			-moz-transform: rotate(360deg);
			-ms-transform: rotate(360deg);
			-o-transform: rotate(360deg);
			transform: rotate(360deg);
		}
	}
	
	/* These are for Owl Carousel from Animation.css lib */
	@-webkit-keyframes fadeIn {
		0% {
			opacity: 0;
		}
		
		100% {
			opacity: 1;
		}
	}
	
	@keyframes fadeIn {
		0% {
			opacity: 0;
		}
		
		100% {
			opacity: 1;
		}
	}
	
	.fadeIn {
		-webkit-animation-name: fadeIn;
		animation-name: fadeIn;
	}
	
	@-webkit-keyframes fadeOutDown {
		0% {
			opacity: 1;
		}
		
		100% {
			opacity: 0;
			-webkit-transform: translate3d(0, 100%, 0);
			transform: translate3d(0, 100%, 0);
		}
	}
	
	@keyframes fadeOutDown {
		0% {
			opacity: 1;
		}
		
		100% {
			opacity: 0;
			-webkit-transform: translate3d(0, 100%, 0);
			transform: translate3d(0, 100%, 0);
		}
	}
	
	.fadeOutDown {
		-webkit-animation-name: fadeOutDown;
		animation-name: fadeOutDown;
	}
	
	@-webkit-keyframes fadeInUp {
		0% {
			opacity: 0;
			-webkit-transform: translate3d(0, 100%, 0);
			transform: translate3d(0, 100%, 0);
		}
		
		100% {
			opacity: 1;
			-webkit-transform: none;
			transform: none;
		}
	}
	
	@keyframes fadeInUp {
		0% {
			opacity: 0;
			-webkit-transform: translate3d(0, 100%, 0);
			transform: translate3d(0, 100%, 0);
		}
		
		100% {
			opacity: 1;
			-webkit-transform: none;
			transform: none;
		}
	}
	
	.fadeInUp {
		-webkit-animation-name: fadeInUp;
		animation-name: fadeInUp;
	}
	
	@-webkit-keyframes flipInX {
		0% {
			-webkit-transform: perspective(6000px) rotate3d(1, 0, 0, 90deg);
			transform: perspective(6000px) rotate3d(1, 0, 0, 90deg);
			-webkit-transition-timing-function: ease-in;
			transition-timing-function: ease-in;
			opacity: 0;
		}
		
		40% {
			-webkit-transform: perspective(6000px) rotate3d(1, 0, 0, -20deg);
			transform: perspective(6000px) rotate3d(1, 0, 0, -20deg);
			-webkit-transition-timing-function: ease-in;
			transition-timing-function: ease-in;
		}
		
		60% {
			-webkit-transform: perspective(6000px) rotate3d(1, 0, 0, 10deg);
			transform: perspective(6000px) rotate3d(1, 0, 0, 10deg);
			opacity: 1;
		}
		
		80% {
			-webkit-transform: perspective(6000px) rotate3d(1, 0, 0, -5deg);
			transform: perspective(6000px) rotate3d(1, 0, 0, -5deg);
		}
		
		100% {
			-webkit-transform: perspective(6000px);
			transform: perspective(6000px);
		}
	}
	
	@keyframes flipInX {
		0% {
			-webkit-transform: perspective(6000px) rotate3d(1, 0, 0, 90deg);
			transform: perspective(6000px) rotate3d(1, 0, 0, 90deg);
			-webkit-transition-timing-function: ease-in;
			transition-timing-function: ease-in;
			opacity: 0;
		}
		
		40% {
			-webkit-transform: perspective(6000px) rotate3d(1, 0, 0, -20deg);
			transform: perspective(6000px) rotate3d(1, 0, 0, -20deg);
			-webkit-transition-timing-function: ease-in;
			transition-timing-function: ease-in;
		}
		
		60% {
			-webkit-transform: perspective(6000px) rotate3d(1, 0, 0, 10deg);
			transform: perspective(6000px) rotate3d(1, 0, 0, 10deg);
			opacity: 1;
		}
		
		80% {
			-webkit-transform: perspective(6000px) rotate3d(1, 0, 0, -5deg);
			transform: perspective(6000px) rotate3d(1, 0, 0, -5deg);
		}
		
		100% {
			-webkit-transform: perspective(6000px);
			transform: perspective(6000px);
		}
	}
	
	.flipInX {
		-webkit-backface-visibility: visible !important;
		backface-visibility: visible !important;
		-webkit-animation-name: flipInX;
		animation-name: flipInX;
	}
	
	/* Btn arrow bounce */
	@-webkit-keyframes sideBounce {
		0, 100% {
			-webkit-transform: translateX(0);
			transform: translateX(0);
			-webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
			animation-timing-function: cubic-bezier(.215, .61, .355, 1);
		}
		
		50% {
			-webkit-transform: translateX(6px);
			transform: translateX(6px);
			-webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .2);
			animation-timing-function: cubic-bezier(.55, .055, .675, .2);
		}
	}
	
	@keyframes sideBounce {
		0, 100% {
			-webkit-transform: translateX(0);
			transform: translateX(0);
			-webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
			animation-timing-function: cubic-bezier(.215, .61, .355, 1);
		}
		
		50% {
			-webkit-transform: translateX(6px);
			transform: translateX(6px);
			-webkit-animation-timing-function: cubic-bezier(.55, .055, .675, .2);
			animation-timing-function: cubic-bezier(.55, .055, .675, .2);
		}
	}
	
	.sideBounce {
		-webkit-animation: sideBounce .85s linear infinite;
		animation: sideBounce .85s linear infinite;
	}
	
	/* For button Icons */
	.side_bounce_icon i.icon {
		display: inline-block;
		-webkit-animation: sideBounce .85s linear infinite;
		animation: sideBounce .85s linear infinite;
	}
	
	/* Typed.js */
	.typed-cursor {
		opacity: 1;
		-webkit-animation: blink .7s infinite;
		-moz-animation: blink .7s infinite;
		animation: blink .7s infinite;
	}
	
	@keyframes blink {
		0% {
			opacity: 1;
		}
		
		50% {
			opacity: 0;
		}
		
		100% {
			opacity: 1;
		}
	}
	
	@-webkit-keyframes blink {
		0% {
			opacity: 1;
		}
		
		50% {
			opacity: 0;
		}
		
		100% {
			opacity: 1;
		}
	}
	
	@-moz-keyframes blink {
		0% {
			opacity: 1;
		}
		
		50% {
			opacity: 0;
		}
		
		100% {
			opacity: 1;
		}
	}
	
	/* Custom Animation for Side Icon boxes */
	.side_icon_box.boc_animate_when_almost_visible.boc_start_animation > * {
		-webkit-transition: all 600ms cubic-bezier(.23, 1, .32, 1) 0ms;
		-moz-transition: all 600ms cubic-bezier(.23, 1, .32, 1) 0ms;
		-o-transition: all 600ms cubic-bezier(.23, 1, .32, 1) 0ms;
		-ms-transition: all 600ms cubic-bezier(.23, 1, .32, 1) 0ms;
		transition: all 600ms cubic-bezier(.23, 1, .32, 1) 0ms;
	}
	
	.side_icon_box.boc_animate_when_almost_visible .icon_feat {
		opacity: 0;
		transform: translateX(-40px);
	}
	
	.side_icon_box.boc_animate_when_almost_visible.boc_start_animation .icon_feat {
		opacity: 1;
		transform: translateX(0px);
	}
	
	.side_icon_box.boc_animate_when_almost_visible h3 {
		opacity: 0;
		transform: translateX(40px);
	}
	
	.side_icon_box.boc_animate_when_almost_visible.boc_start_animation h3 {
		opacity: 1;
		transform: translateX(0px);
	}
	
	.side_icon_box.boc_animate_when_almost_visible .side_icon_box_content {
		opacity: 0;
		transform: translateX(40px);
	}
	
	.side_icon_box.boc_animate_when_almost_visible.boc_start_animation .side_icon_box_content {
		opacity: 1;
		transform: translateX(0px);
	}
	
	/* Custom Animation for Top Icon boxes : END */
	
	/* Custom Animation for Top Icon boxes */
	.top_icon_box.boc_animate_when_almost_visible > *:not(a), .top_icon_box.boc_animate_when_almost_visible > a > div {
		opacity: 0;
	}
	
	.top_icon_box.boc_animate_when_almost_visible.boc_start_animation > *, .top_icon_box.boc_animate_when_almost_visible.boc_start_animation > a > div {
		opacity: 1;
		-webkit-transition: all 1200ms cubic-bezier(.23, 1, .32, 1) 0ms;
		-moz-transition: all 1200ms cubic-bezier(.23, 1, .32, 1) 0ms;
		-o-transition: all 1200ms cubic-bezier(.23, 1, .32, 1) 0ms;
		-ms-transition: all 1200ms cubic-bezier(.23, 1, .32, 1) 0ms;
		transition: all 1200ms cubic-bezier(.23, 1, .32, 1) 0ms;
	}
	
	.top_icon_box.boc_animate_when_almost_visible .icon_holder {
		display: block;
		-moz-transform: rotateY(180deg);
		-webkit-transform: rotateY(180deg);
		transform: rotateY(180deg);
		-moz-backface-visibility: hidden;
		-webkit-backface-visibility: hidden;
	}
	
	.top_icon_box.boc_animate_when_almost_visible.boc_start_animation .icon_holder {
		-moz-transform: rotateY(360deg);
		-webkit-transform: rotateY(360deg);
		transform: rotateY(360deg);
	}
	
	.top_icon_box.boc_animate_when_almost_visible h3 {
		opacity: 0;
		top: -40px;
	}
	
	.top_icon_box.boc_animate_when_almost_visible.boc_start_animation h3 {
		opacity: 1;
		top: 0px;
		-webkit-transition: all 600ms cubic-bezier(.23, 1, .32, 1) 0ms;
		-moz-transition: all 600ms cubic-bezier(.23, 1, .32, 1) 0ms;
		-o-transition: all 600ms cubic-bezier(.23, 1, .32, 1) 0ms;
		-ms-transition: all 600ms cubic-bezier(.23, 1, .32, 1) 0ms;
		transition: all 600ms cubic-bezier(.23, 1, .32, 1) 0ms;
	}
	
	.top_icon_box.boc_animate_when_almost_visible p {
		opacity: 0;
		top: 40px;
	}
	
	.top_icon_box.boc_animate_when_almost_visible.boc_start_animation p {
		opacity: 1;
		top: 0px;
		-webkit-transition: all 600ms cubic-bezier(.23, 1, .32, 1) 0ms;
		-moz-transition: all 600ms cubic-bezier(.23, 1, .32, 1) 0ms;
		-o-transition: all 600ms cubic-bezier(.23, 1, .32, 1) 0ms;
		-ms-transition: all 600ms cubic-bezier(.23, 1, .32, 1) 0ms;
		transition: all 600ms cubic-bezier(.23, 1, .32, 1) 0ms;
	}
}

/* For smaller screens */
@media only screen and (max-width: 768px) {
	/* VC default animations (vc_single_image, vc_column_text) */
	.wpb_animate_when_almost_visible {
		opacity: 1;
		filter: alpha(opacity=100);
	}
}