#heroBG {
	width: 100%;
	height: 100vh;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	pointer-events: none;
	overflow: hidden;
}

#heroBG #blob {
	display: block;
	position: absolute;
	width: 70vw;
	height: 70vw;
	background-color: #0080CE!important;
	right: -10vw;
	top: -30vw;
	border-radius: 50% 50% 50% 50%;
	animation:	transform 20s ease-in-out infinite both alternate, 
				movement_one 30s ease-in-out infinite both;
}


@media screen and (max-width: 1900px) {
	#heroBG #blob {
		width: 75vw;
		height: 75vw;
		right: -10vw;
		top: -20vw;
	}

}



@media screen and (max-width: 960px) {
	#heroBG #blob {
		width: 80vw;
		height: 80vw;
		right: -13vw;
		top: -20vw;
	}

}


@keyframes transform {
    0% { border-radius: 50% 50% 50% 50% / 50% 50% 50% 50%; } 
   20% { border-radius: 37% 63% 51% 49% / 37% 65% 35% 63%; } 
   40% { border-radius: 36% 64% 64% 36% / 64% 48% 52% 36%; } 
   60% { border-radius: 37% 63% 51% 49% / 30% 30% 70% 70%; } 
   80% { border-radius: 40% 60% 42% 58% / 41% 51% 49% 59%; } 
  100% { border-radius: 33% 67% 70% 30% / 30% 30% 70% 70%; } 
}

@keyframes movement_one
{
    0%,
  100% { transform: none; }
   50% { transform: translate(10%, -10%) rotateY(10deg) scale(0.8); }
}