/*ANIMATION BACGROUND*/

.background-elems .bubble {border-radius: 50%;
	background-image: -webkit-radial-gradient(rgb(255,255,255) 0%, rgb(88,118,169) 100%);
	background-image: radial-gradient(circle,rgb(255,255,255), rgb(88,118,169));
	
	
	width: 400px; height: 400px; position:absolute; top: 0; bottom: 0; margin: auto;right: 0;}
.background-elems{width: 100%; height: 100%;

	 	
		}
.background-elems .bubble.elem-1{
	opacity:0;
	animation-name: zoom-1, fadein ; 
	animation-duration:5s, 1s; 
	animation-iteration-count:infinite, 1; 
	animation-timing-function:linear; 
	animation-delay: 1s, 1s; 
	animation-fill-mode: normal, forwards;
		
	-webkit-animation-name: zoom-1, fadein ; 
	-webkit-animation-duration:5s, 1s; 
	-webkit-animation-iteration-count:infinite, 1; 
	-webkit-animation-timing-function:linear; 
	-webkit-animation-delay: 1s, 1s; 
	-webkit-animation-fill-mode: normal, forwards;
		 }
.background-elems .bubble.elem-2{
	opacity:0;
	animation-name: zoom-2, fadein; 
	animation-duration:9s, 1s; 
	animation-iteration-count:infinite, 1 ; 
	animation-timing-function:linear; 
	animation-delay: 2s, 2s;
	animation-fill-mode: normal, forwards;
		
	-webkit-animation-name: zoom-2, fadein; 
	-webkit-animation-duration:9s, 1s; 
	-webkit-animation-iteration-count:infinite, 1 ; 
	-webkit-animation-timing-function:linear; 
	-webkit-animation-delay: 2s, 2s;
	-webkit-animation-fill-mode: normal, forwards;
		 }
.background-elems .bubble.elem-3{
	opacity:0;
	animation-name: zoom-3, fadein; 
	animation-duration:13s, 1s; 
	animation-iteration-count:infinite, 1 ; 
	animation-timing-function:linear, linear; 
	animation-delay: 3s, 3s; 
	animation-fill-mode: normal, forwards;
	
	-webkit-animation-name: zoom-3, fadein; 
	-webkit-animation-duration:13s, 1s; 
	-webkit-animation-iteration-count:infinite, 1 ; 
	-webkit-animation-timing-function:linear, linear; 
	-webkit-animation-delay: 3s, 3s; 
	-webkit-animation-fill-mode: normal, forwards;
	 }


@keyframes fadein{
	0%{opacity: 0}
	100%{opacity: 0.1}
}

@keyframes zoom-1{
	0%{transform: scale(1); opacity: 0.1}
	50%{transform: scale(1.2);opacity: 0.15}
	100%{transform: scale(1); opacity: 0.1}
}

@keyframes zoom-2{
	0%{transform: scale(2); opacity: 0.1}
	50%{transform: scale(2.2); opacity: 0.15}
	100%{transform: scale(2); opacity: 0.1}
}

@keyframes zoom-3{
	0%{transform: scale(3); opacity: 0.1}
	50%{transform: scale(3.2); opacity: 0.15}
	100%{transform: scale(3); opacity: 0.1}
}

@-webkit-keyframes fade-in{
	0%{opacity: 0}
	100%{opacity: 0.1}
}

@-webkit-keyframes  zoom-1{
	0%{-webkit-transform: scale(1); opacity: 0.1}
	50%{-webkit-transform: scale(1.2);opacity: 0.15}
	100%{-webkit-transform: scale(1); opacity: 0.1}
}

@-webkit-keyframes  zoom-2{
	0%{-webkit-transform: scale(2); opacity: 0.1}
	50%{-webkit-transform: scale(2.2); opacity: 0.15}
	100%{-webkit-transform: scale(2); opacity: 0.1}
}

@-webkit-keyframes  zoom-3{
	0%{-webkit-transform: scale(3); opacity: 0.1}
	50%{-webkit-transform: scale(3.2); opacity: 0.15}
	100%{-webkit-transform: scale(3); opacity: 0.1}
}


/***************************/
.animated{
	
	
}
/**********************/

.animated.fadeInUp{
	transition-property: transform  opacity;
	transition-duration: 0.8s;
	transition-timing-function: ease;
	-webkit-transition-property: -webkit-transform  opacity;
	-webkit-transition-duration: 0.8s;
	-webkit-transition-timing-function: ease;
	
	opacity:0;
	position:relative;
	transform:translateY(150px);
	-webkit-transform:translateY(150px);
}
	.animated.fadeInUp.run{
		opacity:1;
		transform:translateY(0px);
		-webkit-transform:translateY(0px);
	}

/***********************/

.animated.fadeInLeft{
	transition-property: transform  opacity;
	transition-duration: 0.8s;
	transition-timing-function: ease;
	-webkit-transition-property: -webkit-transform  opacity;
	-webkit-transition-duration: 0.8s;
	-webkit-transition-timing-function: ease;
	
	opacity:0;
	position:relative;
}
	.animated.fadeInLeft.run{
		left:-150px;
		opacity:1;
		
		transform:translateX(150px);
		-webkit-transform:translateX(150px);
	}	
/***********************/

.animated.fadeInRight{
	transition-property: transform  opacity;
	transition-duration: 0.8s;
	transition-timing-function: ease;
	-webkit-transition-property: -webkit-transform  opacity;
	-webkit-transition-duration: 0.8s;
	-webkit-transition-timing-function: ease;
	
	opacity:0;
	position:relative;
}
	.animated.fadeInRight.run{
		left:150px;
		opacity:1;
		
		transform:translateX(-150px);
		-webkit-transform:translateX(-150px);
	}	
	
		
/**********************/
.animated.fadeIn{
	transition-property:  opacity;
	transition-duration: 1s;
	transition-timing-function: ease;
	-webkit-transition-property:  opacity;
	-webkit-transition-duration: 1s;
	-webkit-transition-timing-function: ease;
	
	opacity:0;
	position:relative;	
}
	.animated.fadeIn.run{
		opacity:1;
		
	}
	
.animated.fadeInSlow{
	transition-property:  opacity;
	transition-duration: 1.5s;
	transition-timing-function: ease;
	-webkit-transition-property:  opacity;
	-webkit-transition-duration: 1.5s;
	-webkit-transition-timing-function: ease;
	
	opacity:0;
	position:relative;	
}
	.animated.fadeInSlow.run{
		opacity:1;
		
	}	
	/**********************************/
	/**********************************/
	/**********************/

.animate.fadeInUp{
	transition-property: transform  opacity;
	transition-duration: 0.8s;
	transition-timing-function: ease;
	-webkit-transition-property: -webkit-transform  opacity;
	-webkit-transition-duration: 0.8s;
	-webkit-transition-timing-function: ease;
	
	opacity:0;
	position:relative;
	transform:translateY(150px);
	-webkit-transform:translateY(150px);
}
	.animate.fadeInUp.run{
		opacity:1;
		transform:translateY(0px);
		-webkit-transform:translateY(0px);
	}

/***********************/

.animate.fadeInLeft{
	transition-property: transform  opacity;
	transition-duration: 0.8s;
	transition-timing-function: ease;
	-webkit-transition-property: -webkit-transform  opacity;
	-webkit-transition-duration: 0.8s;
	-webkit-transition-timing-function: ease;
	
	opacity:0;
	position:relative;
}
	.animate.fadeInLeft.run{
		left:-150px;
		opacity:1;
		
		transform:translateX(150px);
		-webkit-transform:translateX(150px);
	}	
/***********************/

.animate.fadeInRight{
	transition-property: transform  opacity;
	transition-duration: 0.8s;
	transition-timing-function: ease;
	-webkit-transition-property: -webkit-transform  opacity;
	-webkit-transition-duration: 0.8s;
	-webkit-transition-timing-function: ease;
	
	opacity:0;
	position:relative;
}
	.animate.fadeInRight.run{
		left:150px;
		opacity:1;
		
		transform:translateX(-150px);
		-webkit-transform:translateX(-150px);
	}	
	
		
/**********************/
.animate.fadeIn{
	transition-property:  opacity;
	transition-duration: 1s;
	transition-timing-function: ease;
	-webkit-transition-property:  opacity;
	-webkit-transition-duration: 1s;
	-webkit-transition-timing-function: ease;
	
	opacity:0;
	position:relative;	
}
	.animated-2.fadeIn.run{
		opacity:1;
		
	}
	
.animate.fadeInSlow{
	transition-property:  opacity;
	transition-duration: 1.5s;
	transition-timing-function: ease;
	-webkit-transition-property:  opacity;
	-webkit-transition-duration: 1.5s;
	-webkit-transition-timing-function: ease;
	
	opacity:0;
	position:relative;	
}
	.animate.fadeInSlow.run{
		opacity:1;
		
	}