Add logo before the image in CSS

I am trying to add a logo above the FIRST avatar photo/image inside the .

Here's how the HTML looks like:

<div class="cn-list-body">
<!-- FIRST ITEM -->
<div class="cn-list-row cn-list-item vcard individual marketing cn-gridder-item">
   <div class="cn-gridder-thumb">
        <span class="cn-image-style">
            <span style="display: block; max-width: 100%; width: 360px">
            <img height="360" width="360" sizes="100vw" class="cn-image photo" srcset="/img/avatar-photo-1.jpg" loading="lazy">
        </span>
    </span>
   </div>

</div>

<!-- SECOND ITEM -->
<div class="cn-list-row cn-list-item vcard individual marketing cn-gridder-item">
    <div class="cn-gridder-thumb">
         <span class="cn-image-style">
             <span style="display: block; max-width: 100%; width: 360px">
             <img height="360" width="360" sizes="100vw" class="cn-image photo" srcset="/img/avatar-photo-2.jpg" loading="lazy">
         </span>
     </span>
    </div>
</div>

</div>

What I did is to select it like this:

.cn-list-row .cn-list-item:first-child:before img{
    content: '';
    background-image: url('https://backtowuve.com/wp-content/uploads/2021/01/wuve-logo.png');
    width: 100px;
    height: 100px;
    z-index: 9999;
    position: absolute;
    top: 120px;
    right: 50px;
}

This however did not work. How can I select the FIRST child and add the logo like this image:

.cn-list-row:first-child .cn-list-item:before img {
    content: '';
    background-image: url('https://backtowuve.com/wp-content/uploads/2021/01/wuve-logo.png');
    width: 100px;
    height: 100px;
    z-index: 9999;
    position: absolute;
    top: 120px;
    right: 50px;
}