I'm going INSANE! I am trying to make an 'IMAGE' Embed code responsive in CSS - won't work : PLEASE HELP

So I have an embed code for an single image taken from a host picture archive. I want to attach the embed to my website so no one can drag the picture off and steal it. 

The problem is it needs to be responsive to height and width and the set values in the embed are making it very difficult.

I have changed the width to 100% but obviously it makes the height non responsive - height is currently set at 1000. I can manually change them but it does not comply across all devices.

I need the image to shrink to the bloody device I am using it on and be responsive If i make my browser smaller or larger

Here is the embed code I have been putting into my CSS on Wordpress

Please Help

<iframe id="embed-frame-11855" style="border: 0px none;" src="http://media.atlanticimages.uk/embed/0x4c6679423647313463494761457a726c3973553870336a6364327a58306b7771744c543334524e316f62433478354644704c744778596f6d727275427531794438384f556f7a6e3134623150486c796f31424f4b446b2f47734a354b707052434c47334449334345526a6b76353273426f463343344759544c50507174686463" width="686" height="1000" scrolling="no" data-image-link="http://media.atlanticimages.uk/item/en/1/11855"></iframe>
