style.css

.box{
	height: 100px;
	width: 100px;
	border: 2px solid black;
	margin-top: 20%;
	margin-left: 25%;
	transition: 10s;
	animation-name: box;
	position:absolute;
	animation-duration: 20s;
    animation: box 20s linear ;
    -webkit-animation: box 20s linear ;
    left: 0;
    
	
}


.up:hover{
	border: 10px solid white;
    border-radius: 100px;
    background-color: #48dbfb;
    box-shadow: 0px 0px 100px #48dbfb;
    transform: rotate(7200deg);


}

#background{
	position:absolute;
	background-color: white;
	top: 0px;
	right: 0px;
	bottom: 0px;
	left: 0px;
	z-index: -1;
	transition: 3s;

}

.box:hover ~ #background{
  background-color: rgb(2,2,2);

}

@keyframes box {
    100% {
        left:100%;
    }
}
@-webkit-keyframes box {
    100% {
        left:100%;
    }
}