Lo que necesito es que al hacer hover sobre mi "img" haga el efecto que ahora hace, pero solo lo he logrado que lo haga con hover sobre todo el div con la clase "FirstColumnBasic".
He intentado otros métodos pero éste es el que se acerca más a lo que necesito, si alguien pudiera apoyarme se lo agradecería bastante.
De antemano muchas gracias por su tiempo!
img {
width:200px;
height:20px;
background-color:#000;
}
.st3{fill:#B3D9D9;}
.st4{fill:#D6EBEB;}
.FirstColumnBasic #ejecutivo-boton {
transform: translateY(0px);
}
.FirstColumnBasic:hover #ejecutivo-boton {
transform: translateY(-197px);
}
<div class="FirstColumnBasic">
<img class="image">
<div id="svgwrapper" style="width:1400px;">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 1275 456" style="enable-background:new 0 0 1275 456;" xml:space="preserve">
<g id="movimiento">
<rect id="linea-ejecutivo" x="632.5" y="-0.2" class="st3" width="10" height="235.9"/>
<g id="ejecutivo-boton">
<path class="st2" d="M649.4,225.7c0,4.7-4.1,8.5-9.2,8.5h-5.4c-5.1,0-9.2-3.8-9.2-8.5l-2.8-15.7c0-4.7,5.1-8.5,11.4-8.5h6.6
c6.3,0,11.4,3.8,11.4,8.5L649.4,225.7z"/>
<path class="st4" d="M626.9,209.8l2.8,15.6v0.4c0,2.5,2.3,4.5,5.1,4.5h5.4c2.8,0,5.1-2,5.1-4.5v-0.4l2.8-15.6
c-0.2-2-3.2-4.2-7.3-4.2h-6.6C630,205.6,627.1,207.8,626.9,209.8 M640.2,238.3h-5.4c-7.2,0-13-5.4-13.2-12.2l-2.9-15.7v-0.4
c0-7.1,6.8-12.6,15.5-12.6h6.6c8.7,0,15.5,5.5,15.5,12.6v0.4l-2.9,15.7C653.2,232.9,647.3,238.3,640.2,238.3"/>
</g>
</g>
</svg>
</div>
</div>