*{
    padding: 0;
    margin: 0;
}
body{
    height: 100vh;
    background: linear-gradient(
        to top,
       rgb(0, 0, 0) 0%,
        rgb(0, 4, 226) 50%,
        rgb(0, 4, 226)50%,
        rgb(0, 4, 226) 100%
    );
    display: flex;
    justify-content: center;
    align-items: center;
}
.square-1{
    height: 25vh;
    width: 25vh;
    border-radius: 50%;
    filter: blur(0px);
    display: block;
    text-decoration: none;
    background: linear-gradient(
        to bottom,
       rgb(0, 27, 26) 0%,
        rgb(0, 27, 216)  100%,
        rgb(0, 27, 216)50%,
        rgb(0, 27, 26) 100%
    );
}



.square-1 {
  animation-name: spin;
  animation-duration: 5000ms;
  animation-iteration-count: infinite;
  animation-timing-function: linear; 
  /* transform: rotate(3deg); */
   /* transform: rotate(0.3rad);/ */
   /* transform: rotate(3grad); */ 
   /* transform: rotate(.03turn);  */
}


@keyframes spin {
    from {
        transform:rotate(0deg);
    }
    to {
        transform:rotate(720deg);
    }
}