body {
    margin: 0;
    height: 100vh;
    background-image: linear-gradient(lightcyan 50%, black 50%);
}

.monster {
    width: 100vw;
    height: 16vmin;
    top: calc(50% - 16vmin);
    margin: 0;
    position: relative;
    overflow: hidden;
}

.body {
    position: absolute;
    width: 32vmin;
    height: 32vmin;
    background-color: teal;
    border-radius: 43% 40%;
    top: 2vmin;
    left: calc((100vw - 32vmin) / 2);
    animation:
        body-wander 5s linear infinite alternate,
        wave 3s linear infinite,
        bounce 1s infinite alternate;
}

.eyes {
    width: 16vmin;
    height: 5vmin;
    position: absolute;
    bottom: 2vmin;
    left: calc((100vw - 16vmin) / 2);
    display: flex;
    justify-content: space-between;
    animation: eyes-wander 5s linear infinite alternate;
}

.eyes::before,
.eyes::after {
    content: '';
    width: 5vmin;
    height: 5vmin;
    border: 1.25vmin solid white;
    box-sizing: border-box;
    border-radius: 50%;
    animation: blink 3s linear infinite;
}

@keyframes blink {
    6%, 30%, 36% {transform: scaleY(1);}
    3%, 33% {transform: scaleY(0);}
}

@keyframes body-wander {
    from {left: -2vmin;}
    to {left: calc(100vw - 32vmin + 2vmin);}
}

@keyframes eyes-wander {
    from {left: 10vmin;}
    to {left: calc(100vw - 16vmin - 10vmin);}
}

@keyframes wave {
    to {
        transform: rotate(1turn);
    }
}

@keyframes bounce {
    to {
        top: 4vmin;
    }
}