
.dynamicBackground {
	position: fixed;
	z-index: 1;
	top: 0px;
	left: 30%;
	transform: translate3d(0, 0, 0);
	-webkit-transform: translate3d(0, 0, 0);
	filter: blur(36px);
	-webkit-filter: blur(36px);
}

@media screen and (max-width: 533px) {
	.dynamicBackground {
		top: -80px;
		left: 0;
	}
}
.dot1 {
	width: 320px;
	height: 240px;
	border-radius: 50%;
	background: hsl(200, 100%, 60%);
	opacity: 0;
	position: relative;
	animation: ani1 20s linear infinite;
	animation-delay: 1s;
}
@keyframes ani1
{
0%   {opacity:0; top:60px; left:280px;}
10%	 {opacity:0.5;}
80%	 {opacity:0.5;}
100% {opacity:0; top:200px; left:0px;}
}
 .dot2 {
	width: 320px;
	height: 240px;
	border-radius: 50%;
	background: hsl(176, 100%, 60%);
	position: relative;
	opacity:0;
	animation: ani2 20s linear infinite;
	animation-delay: 3s;
}
@keyframes ani2
{
0%   {opacity:0; top: -100px; left:-80px;}
10%  {opacity:0.3;}
80%  {opacity:0.3;}
100% {opacity:0; top:180px; left:120px;}
}
.dot3 {
	width: 320px;
	height: 240px;
	border-radius: 50%;
	background: hsl(240, 100%, 80%);
	position: relative;
	opacity:0;
	animation-delay: 2s;
	animation: ani3 20s linear infinite;
	animation-delay: 6s;
}
@keyframes ani3
{
0%   {opacity:0; top:-160px; left:160px;}
10%  {opacity:0.6;}
80%  {opacity:0.6;}
100% {opacity:0;top:-360px; left:320px;}
}
