add images

responsive.html

@@ -46,6 +46,7 @@ nav ul li a {
 
 .features {
   display: flex;
+  flex-direction: column;
   justify-content: space-around;
   padding: 20px;
 }
@@ -64,6 +65,10 @@ footer {
   color: #fff;
 }
 
+img{
+  width: 100%;
+}
+
 </style>
 
 </head>
@@ -87,14 +92,32 @@ footer {
     <section class="features">
       <div class="feature-item">
         <h3>Feature 1</h3>
+        <figure>
+          <img
+            src="images/kitchen1.jpg"
+            alt="Modern appliances" />
+          <figcaption>Modern appliances</figcaption>
+        </figure>
         <p>Description of feature 1.</p>
       </div>
       <div class="feature-item">
         <h3>Feature 2</h3>
+        <figure>
+          <img
+            src="images/kitchen2.jpg"
+            alt="industrial kitchen" />
+          <figcaption>Suitable for private and commmercial settings</figcaption>
+        </figure>
         <p>Description of feature 2.</p>
       </div>
       <div class="feature-item">
         <h3>Feature 3</h3>
+        <figure>
+          <img
+            src="images/kitchen3.jpg"
+            alt="food preparatoin" />
+          <figcaption>Safe and efficient food preparation</figcaption>
+        </figure>
         <p>Description of feature 3.</p>
       </div>
     </section>