pseudo selection nth-child issue

Question

I am trying to select only the first image to move it up:

#rockfon_mono:nth-child(1) img {
	margin-top:-40px;
  border: solid green;
	
}

<div id="rockfon_mono">
<img src="images/products/rockfon-mono/rockfon-header.png" alt="" />
 <h2>Mono® Acoustic TE</h2>

<p>Seamless acoustic ceiling and wall lining |  Acoustic and aesthetic comfort | No more compromises</p>
<p>The current trend in architectural design favours the use of highly reflective, sturdy materials such</p>
<div id="rockfonImageOne"> 
    <img src="images/products/rockfon-mono/Mono.png" alt="" />
</div>
 <h2>Acoustics</h2>

<p>Full acoustic control for any space | Acoustic enhancement for new and refurbished spaces | High sound absorption | Improved speech intelligibility</p>
<p>Acoustic and aesthetic comfort Mono Acoustic TE’s aesthetic quality matches its acoustic quality. Mono Acoustic TE provides high sound absorption, echo reduction, a significant decrease in reverberation</p>
<div id="rockfonImageOne"> 
    <img src="images/products/rockfon-mono/Acoustics.png" alt="" />
</div>
 <h2>Characteristics</h2>

<p>System description and performance the unique Mono Acoustic TE system is a highly acoustic monolithic ceiling and wall lining. This patented innovation is made of high quality stone wool for optimum</p>

It is however selecting every image in the whole page

Answer 1

In your specific HTML markup you can use the direct child as the other imgs are not direct childs

#rockfon_mono > img {
    margin-top:-40px;
    border: solid green;
}

DEMO