First steps towards responsive radar

styles/components/item-list.css

@@ -1,4 +1,5 @@
 .item-list {
+  margin: 0 0 25px;
   &__header {
     margin-bottom: 20px;
   }

styles/components/page.css

@@ -1,8 +1,8 @@
 .page {
-  width: 1200px;
+  max-width: 1200px;
   min-height: 100%;
   margin: 0 auto;
-  padding: 0 10px;
+  padding: 0 15px;
   display: flex;
   flex-direction: column;
   min-height: 100vh;

styles/components/quadrant-grid.css

@@ -6,5 +6,8 @@
   &__quadrant {
     flex: 0 0 45%;
     margin-bottom: 40px;
+    @media (--until-lg) {
+      flex-basis: 100%;
+    }
   }
 }

styles/components/quadrant-section.css

@@ -5,11 +5,17 @@
 
   &__rings {
     display: flex;
+    flex-wrap: wrap;
   }
 
   &__ring {
     box-sizing: border-box;
     padding: 0 8px;
     flex: 0 0 25%;
+    margin: 0 0 25px;
+    @media (--until-sm) {
+      flex-basis: 50%;
+
+    }
   }
 }