FAQ Accordion

Hello Sayed!! Congrats for your solution, it looks really nice!

I saw that you need help with your image position, so let me help you on that:

• The best way I found to not overflow the illustration image was: 1 - You have to create a section for your images

<section class="FaqSection>

  <section class= "imagesSection">
      <img src="./path/illustration-image.png">
      <img src="./path/background-image.png">
      <img src="./path/box-image.png">
  </section> 

  <section>
    //Rest of the code here
  </section>

</section>

• Now you create a DIV inside the image section to put the images that you dont want to overflow:

<section class="FaqSection>

  <section class= "imagesSection">
      <div class="overflowHiddenDiv"
          <img src="./path/illustration-image.png">
          <img src="./path/background-image.png">
      </div>
      <img src="./path/box-image.png">
  </section> 

  <section>
    //Rest of the code here
  </section>

</section>

• And in your css you cand add on that div a overflow hidden to it:

.overflowHiddenDiv{
    overflow: hidden;
    // Rest of the code
}

So in that way your both images won't be overflowing and your box image will be overflowing.

I hope that was helpfull!