Photos in accordion dropdown

Hi there, 

I was able to embed images into my accordion dropdowns, however I'd like the images to be left aligned with the text wrapped around them (instead of the image on top of the text, like it is now). When I add a display:flex property, it makes the images all different sizes. 

site URL: https://www.couplesmarriageministry.org/resources/wives

Any help is welcomed!

Wrap like this?

Here is the full code 

.accordion-item__description:before{ content:" "; display:block; width:250px; height:120px; background-image:url(gus.jpg); background-size:contain; background-repeat:no-repeat; margin-right:15px }

.accordion-item:nth-child(2) .accordion-item__description:before{ background-image: url(shawn.png)!important }

.accordion-item:nth-child(3) .accordion-item__description:before{ content:none!important }

.accordion-item__description{ display:flex!important }

@tuanphan Yes, like that!

@LoftyDevs With that code, the images are different sizes.

@tuanphan I inputted part of that code, but the images are now all different sizes between the different accordion items.

@tuanphan Solved! Brilliant, THANK YOU!

Reopening this topic because I'm having some errors with the code @tuanphan. Two of the blog posts have images that appear to be placed randomly (in the accordion drop downs). When I look at the code, the file names are accurate for which images should be showing, but different images appear. The "For Couples" post is perfect, but "For Husbands" and "For Wives" appears to be jumbled. Can you see if there's something in the code that's off?

Post 1: https://www.couplesmarriageministry.org/resources/husbands

Post 2: https://www.couplesmarriageministry.org/resources/wives

This post has perfect images (filename and image match up): https://www.couplesmarriageministry.org/resources/couples