Mobile CSS by ID

I am using the Avada theme. This question is about the site http://www.finepointsmusic.com

On the photos page for (desktop), I placed the middle image in the row of 3 with a margin-top: 40px;

I attached an ID (mobilephoto) to the container for the middle photo.

In mobile, I would like this style not to exist. I want the margin to the be the same as the rest (remove the styling I did for desktop. )

I am using this CSS but its not making a change.

@media only screen and (max-device-width: 800px)
#mobilephoto { margin-top: 0px;
}

I can change this while inspecting element but can’t get the css correct when writing in my css style field.

Any help with this would be greatly appreciated!