.gradient {
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(45deg,#003264,#006fdd,#001A33);
  background-size: 400% 400%;
  animation: colors 60s ease infinite;
  overflow:hidden;
}
.boxAnima div {
  position: absolute;
  width: 20px;
  height: 20px;
  background-color: transparent;
  border: 3px solid rgba(187,223,244,0.3);
}
.boxAnima div:nth-child(1){
  top:12%;
  left:42%;
  animation: animate 10s linear infinite;
}
.boxAnima div:nth-child(2){
  top:70%;
  left:50%;
  animation: animate 7s linear infinite;
}
.boxAnima div:nth-child(3){
  top:17%;
  left:6%;
  animation: animate 9s linear infinite;
}
.boxAnima div:nth-child(4){
  top:20%;
  left:60%;
  animation: animate 10s linear infinite;
}
.boxAnima div:nth-child(5){
  top:67%;
  left:10%;
  animation: animate 6s linear infinite;
}
.boxAnima div:nth-child(6){
  top:80%;
  left:70%;
  animation: animate 12s linear infinite;
}
.boxAnima div:nth-child(7){
  top:60%;
  left:80%;
  animation: animate 15s linear infinite;
}
.boxAnima div:nth-child(8){
  top:32%;
  left:25%;
  animation: animate 16s linear infinite;
}
.boxAnima div:nth-child(9){
  top:90%;
  left:25%;
  animation: animate 9s linear infinite;
}
.boxAnima div:nth-child(10){
  top:20%;
  left:80%;
  animation: animate 5s linear infinite;
}
@keyframes colors{
  0%{
    background-position: 0% 50%;
  }
  50%{
    background-position: 100% 50%;
  }
  100%{
    background-position: 0% 50%;
  }
}

@keyframes animate {
  0% {
    transform: scale(0) translateY(0) rotate(0);
	opacity: 1;
  }
  100% {
    transform: scale(1.3) translateY(-90px) rotate(360deg);
	opacity: 0;
  }
}