body{
  background-color: #000000;
  background-image:linear-gradient( #000000,#ff3535,#000000);
  height:3600px;
}


#st{
  position:absolute;
  display:flex;
  flex-direction:row; 
  flex-wrap:wrap;
  justify-content:center;
}

.square{
  background-color:#ff3535;
  width:150px;
  height:150px;
  margin:50px;
   -webkit-transition: -webkit-transform .8s ease-in-out;
    -ms-transition: -ms-transform .8s ease-in-out;
    transition: transform .8s ease-in-out;  
}



.square:hover {
    transform:rotate(2000deg);
    -ms-transform:rotate(2000deg);
    -webkit-transform:rotate(2000deg);
    width:150px;
    height:150px;
    border-radius:100%;
    background-image:
    linear-gradient( to right,  #000000, #ff4343);
    opacity: 0;
    transition: 0.5s ease-in;
    


}