body{
    background-color:rgb(130, 180, 182);
}

#img { 
    position: absolute;
    width: 100px;
    height: 100px;
    animation-duration: 6s;
    animation-play-state: running;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    animation-fill-mode: forwards;
    animation-name: img;
    animation-direction: normal;
}
  
@keyframes img {
    0%, 100% {
        top: 0;
        left: calc(50% - 50px);
    }

    25% {
        top: calc(50% - 50px);
        left: calc(100% - 100px);
    }

    50% {
        top: calc(100% - 100px);
        left: calc(50% - 50px);
    }

    75% {
        top: calc(50% - 50px);
        left: 0;
    }
}