



.mydiv {
	  position: relative;
    	
      width: 160px;
     height: 160px;
     -moz-border-radius: 50%;
     -webkit-border-radius: 50%;
     border-radius: 50%;
     
}

/*
.mydiv {
	  position: relative;
    	
      width: 160px;
     height: 160px;
     -moz-border-radius: 50%;
     -webkit-border-radius: 50%;
     border-radius: 50%;
     
}

*/
.animate-bg:before, .animate-bg:after {
   	content: '';
	position: absolute;
	left: 58px;
	top: 58px;
	background: linear-gradient(120deg, #f5543f, #007bff, #505cfd,#f5f5f5, #007bff, #b0ef28,#ff6600, #04c2e4,#adad02, #00c3ff);;
	background-size: 950%;
	width:  calc(30% + -5px);
	height: calc(30% + -5px);
	z-index: -1;
	-moz-border-radius: 50%;
     -webkit-border-radius: 50%;
     border-radius: 50%;
	animation: BGgradient 15s ease infinite; 
}


/*

.animate-bg:before, .animate-bg:after {
   	content: '';
	position: absolute;
	left: 7px;
	top: 7px;
	background: linear-gradient(120deg, #cccccc, #007bff, #1e223b,#2c343b, #dee2e6, #cccccc,#ff6600, #04c2e4,#adad02, #00c3ff);
	background-size: 300%;
	width:  calc(90% + -5px);
	height: calc(90% + -5px);
	z-index: -1;
	-moz-border-radius: 50%;
     -webkit-border-radius: 50%;
     border-radius: 50%;
	animation: BGgradient 15s ease infinite; 
}


*/




@keyframes BGgradient {
	0% {
		background-position: 0% 200%;
	}
	50% {
		background-position: 200% 0%;
	}
	100% {
		background-position: 0% 330%;
	}
}

.animate-bg:after {
	filter: brightness(1.4);
	filter: drop-shadow(16px 16px 20px rgb(248, 220, 97));
	filter: blur(15px);
}
