📜 Fix image and example code in draw it level 12 (#5415)

Fixes #5267 

**How to test**
Go to level 12 - draw it 
<img width="1440" alt="Screenshot 2024-04-15 at 14 46 13" src="https://github.com/hedyorg/hedy/assets/48122190/97b614ba-aabb-4029-877e-878c93117a56">

content/adventures/en.yaml

@@ -4950,10 +4950,12 @@ adventures:
                 story_text: |
                     ### Exercise
                     Recreate the drawings with the turtle!
-                    Hint: Bracelet designing program. Firstly, define a function **for each shape** you want to use on the bacelet. Then, add the shapes to the bacelet like this:
-                    </div>
-                    Bracelet Designing program <img src="https://github.com/hedyorg/hedy/assets/80678586/549d7f3a-c492-4b4a-b173-746eb3400951" width="500">
+
+                    Firstly, define a function **for each shape** you want to use on the bracelet. Then, add the shapes to the bracelet like this:
+
+                    Bracelet Designing program <img src="https://github.com/hedyorg/hedy/assets/80678586/549d7f3a-c492-4b4a-b173-746eb3400951" width="500"> 
                 example_code: |
+                    Hint Bracelet Designing program
                     ```
                     {define} draw_a_square
                     _