Update animate-images-with-keyframes-using-css.mdx

Author: asiqurrahman

projects/animate-images-with-keyframes-using-css/animate-images-with-keyframes-using-css.mdx

@@ -40,7 +40,7 @@ Images are quintessential to any website. It's the sparkle and it's the pizzaz!
 
 You may recall using this line to add an image to your HTML file.
 
-```html
+```
 <img src="your-path.png" alt="red chocolate chip cookie" />
 ```
 
@@ -78,10 +78,10 @@ CSS animations have "steps" in them (also known as keyframes) to signify each mo
 
 For example, 
 
-```html
+```
 <div className="box"></div>
 ```
-```css
+```
 @keyframes colorChange {
   0% { background-color: red; }
   50% { background-color: yellow; }
@@ -104,7 +104,7 @@ So at 0% of the animation, the color is red, at 50% it's yellow, and at 100% or
 
 Let's also take a look at this line of code: 
 
-```css
+```
 animation: colorChange 2s infinite;  
 ```
 
@@ -129,7 +129,7 @@ Some common ones you'll see:
 
 These can differ and are added right in the `animation:` of your CSS. 
 
-```css
+```
 .tinker_bell {
   animation: bounce 1s linear infinite;
 }
@@ -146,13 +146,13 @@ Think of the last time you saw a spinning loader:
 
 This can be recreated with a spin animation like so: 
 
-```html
+```
 <div className="sensei">
   <img src="sensei.png" alt="club penguin gray sensei penguin" />
 </div>
 ```
 
-```css
+```
 /* spinning animation */
 @keyframes spin {
   from {
@@ -188,12 +188,12 @@ Imagine you're playing a video game and you're choosing which character to play
 
 This is a hovering animation that we can create with keyframes! 
 
-```html
+```
 <div className="sensei">
   <img src="sensei.png" alt="club penguin gray sensei penguin" />
 </div>
 ```
-```css
+```
 /* bouncing animation (floating)  */
 @keyframes bounce {
   0%, 100% {