Can't get custom code to apply

Trying to add a custom clipping path to an image. It works fine in the design mode, but as soon as I apply it reverts. 

I'm thinking I'm maybe applying the css to the wrong ID? I want to do 3 different custom clip paths on 3 different images so want to apply it to a specific image, as opposed to an entire section.

Thanks!

Code:

#yui_3_17_2_1_1674761161873_327{
clip-path: polygon(100% 0%, 75% 50%, 100% 100%, 25% 100%, 0% 50%, 25% 0%);
transition: all .5s;
}

#yui_3_17_2_1_1674761161873_327:hover{
clip-path: polygon(75% 0%, 100% 50%, 75% 100%, 0% 100%, 25% 50%, 0% 0%);
}

Thank you! That worked. I appreciate it.