css updated for responsive

Author: mryunt02

styles.css

@@ -129,21 +129,37 @@ code {
 .example {
   background-color: #e8f5e9;
   padding: 10px;
-  padding-left: 32px;
   border: 1px solid #388e3c;
   border-radius: 5px;
   margin-bottom: 20px;
 }
 .bad-example {
   background-color: #ffebee;
   padding: 10px;
-  padding-left: 32px;
   border: 1px solid #d32f2f;
   border-radius: 5px;
   margin-bottom: 20px;
 }
 @media screen and (max-width: 600px) {
+  body {
+    margin: 10px;
+  }
+  nav ul {
+    flex-direction: column;
+    align-items: center;
+  }
+  nav ul li {
+    margin-bottom: 10px;
+    margin-right: 0;
+  }
   .principles-container {
     grid-template-columns: 1fr;
   }
+  p,
+  .principle-box,
+  .example,
+  .bad-example {
+    padding: 5px;
+    margin: 5px 0;
+  }
 }