Flexbox css modified

assets/css/flex.css

@@ -18,13 +18,13 @@ hr {
 }
 
 .column {
-    padding: 10%;
-    width: 100%;
+    flex: 100%;
     min-height: 400px;
     height: 100vh;
     max-height: 700px;
     box-sizing: border-box;
     overflow: hidden;
+    padding: 10%;
 }
 
 .column:nth-of-type(1) {
@@ -71,8 +71,7 @@ figure img {
 
 @media screen and (min-width: 540px) {
     .column {
-        flex: 100%;
-        padding: 4%;
+        padding: 10%;
     }
 
     .info {
@@ -89,6 +88,7 @@ figure img {
     .column {
         flex: 50%;
         max-height: 400px;
+        padding: 2%;
     }
 
     figure {
@@ -101,6 +101,7 @@ figure img {
         flex: 33.3%;
         flex-direction: column;
         min-height: 450px;
+        padding: 4%;
     }
 }
 

flexbox-layout.html

@@ -21,7 +21,7 @@
                 <p>1 Year Free Mobile Security</p>
             </div>
             <figure>
-                <img src="assets/img/image-1.png" class="c-img">
+                <img src="assets/img/image-1.png">
             </figure>
         </div>
         <div class="column">
@@ -76,7 +76,7 @@
                 <p>1000 pts Discount on Subscription</p>
             </div>
             <figure>
-                <img src="assets/img/image-6.png" class="c-img">
+                <img src="assets/img/image-6.png">
             </figure>
         </div>
     </div>