*{
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

body{
    background-color: yellowgreen;
}

.drop{

    background-color: #00FFFC;
    height: 5rem;
    width: 5rem;
    border-radius: 5%;
    border: 4px solid rgba(0, 0, 0, 0.6);
    position: absolute;
    animation: animate 5s linear;
    transition: all 0.5s ease-in-out;
}

@keyframes animate {

    0%{
        opacity: 1;
        transform: scale(2);
    }

    25%{
        border-radius: 25%;
    }

    50%{
        opacity: 0.5;
        transform: scale(3);
        border-radius: 35%;
        background-color: #9C00FF;
    }

    100%{
        opacity: 1;
        transform: scale(4);
        border-radius: 50%;
        background-color: #FFFC00;
    }
}