add media queries for medium and large devices

1 files changed, 49 insertions, 0 deletions

diff --git a/assets/css/media-queries.css b/assets/css/media-queries.css
index 4420677..7799c1a 100644
--- a/assets/css/media-queries.css
+++ b/assets/css/media-queries.css
@@ -9,6 +9,11 @@
 */
 
 @media only screen and (min-width: 576px) {
+    /* HEADER */
+    .header {
+        padding: 1.15rem 2.75rem;
+    }
+
     /* SECTIONS */
     .section {
         padding: 0 5%;
@@ -39,3 +44,47 @@
         padding: 0 15%;
     }
 }
+
+@media only screen and (min-width: 768px) {
+    /* SECTIONS */
+    .section {
+        padding: 0 9%;
+    }
+
+    /* CONTENT */
+    .single__content {
+        padding: 1.45rem 9%;
+    }
+
+    /* FOOTER */
+    .footer__agreement {
+        padding: 1.45rem 9%;
+    }
+
+    /* PAGINATION */
+    .pagination {
+        padding: 0 20%;
+    }
+}
+
+@media only screen and (min-width: 992px) {
+    /* SECTIONS */
+    .section {
+        padding: 0 21%;
+    }
+
+    /* CONTENT */
+    .single__content {
+        padding: 1.45rem 21%;
+    }
+
+    /* FOOTER */
+    .footer__agreement {
+        padding: 1.45rem 21%;
+    }
+
+    /* PAGINATION */
+    .pagination {
+        padding: 0 25%;
+    }
+}
\ No newline at end of file