JSFiddle - React, Tailwind, and code Playground

HTML

<svg width="588px" height="512px" viewBox="0 0 588 512">
    <g id="clock_bottom_3_wrap">
        <g id="clock_bottom_3" transform="translate(72 306)">
            <ellipse fill="blue" cx="87" cy="52" rx="87" ry="52"></ellipse>
        </g>
    </g>
</svg>

CSS

#clock_bottom_3_wrap {transition: transform 0.3s;}

svg:hover #clock_bottom_3_wrap {transform: translate(0px, 14px);}