/************************
 *						*
 *  CSS ANIM			*
 *  LC Salácia Pool		*
 *  ©2023				*
 *						*
 ************************/


.water {
	position: relative;
	width: 100%;
	height: 450px;
	/*background-image: linear-gradient(0deg, #2980b9, #00a2ec);*/
	background: url('imagens/bg01.jpg') center/cover;
	overflow: hidden;
}

.bubble {
	width: 30px;
	height: 30px;
	border-radius: 100%;
	position: absolute;
	background-color: white;
	bottom: -30px;
	opacity: .2;
	animation: bubble 10s ease-in-out infinite,
		sideWays 3s ease-in-out infinite alternate;
}

@keyframes bubble {
	0% {
		transform: translateY(0%);
		opacity: .1;
	}
	100% {
		transform: translateY(-120vh);
	}
}

@keyframes sideWays {
	0% {
		margin-left: 0px;
	}
	100% {
		margin-left: 200px;
	}
}

.bubble--1 {
	left: 10%;
	animation-delay: .5s;
	animation-duration: 14s;
	opacity: .2;
}

.bubble--2 {
	width: 15px;
	height: 15px;
	left: 40%;
	animation-delay: 1s;
	animation-duration: 8s;
	opacity: .1;
}

.bubble--3 {
	width: 10px;
	height: 10px;
	left: 30%;
	animation-delay: 5s;
	animation-duration: 18s;
	opacity: .3;
}

.bubble--4 {
	width: 25px;
	height: 25px;
	left: 40%;
	animation-delay: 8s;
	animation-duration: 15s;
	opacity: .2;
}

.bubble--5 {
	width: 30px;
	height: 30px;
	left: 60%;
	animation-delay: 10s;
	animation-duration: 13s;
	opacity: .1;
}

.bubble--6 {
	width: 10px;
	height: 10px;
	left: 80%;
	animation-delay: 3s;
	animation-duration: 26s;
	opacity: .4;
}

.bubble--7 {
	width: 15px;
	height: 15px;
	left: 90%;
	animation-delay: -7s;
	animation-duration: 22s;
	opacity: .3;
}

.bubble--9 {
	width: 20px;
	height: 20px;
	left: 50%;
	bottom: 30px;
	animation-delay: -5s;
	animation-duration: 17s;
	opacity: .2;
}

.bubble--10 {
	width: 40px;
	height: 40px;
	left: 30%;
	bottom: 30px;
	animation-delay: -21s;
	animation-duration: 14s;
	opacity: .3;
}

.bubble--11 {
	width: 30px;
	height: 30px;
	left: 60%;
	bottom: 30px;
	animation-delay: -13.75s;
	animation-duration: 18s;
	opacity: .3;
}

.bubble--11 {
	width: 25px;
	height: 25px;
	left: 90%;
	bottom: 30px;
	animation-delay: -10.5s;
	animation-duration: 17s;
	opacity: .3;
}