media query fix

1 files changed, 21 insertions, 12 deletions

diff --git a/styles/Main.module.scss b/styles/Main.module.scss
index bac6a97..e5254d5 100644
--- a/styles/Main.module.scss
+++ b/styles/Main.module.scss
@@ -67,7 +67,11 @@
     padding: 2em 0 1.5em;
   }
 
-  fieldset:nth-of-type(1) {
+  & > fieldset:nth-of-type(1) {
+    fieldset {
+      display: inline-block;
+    }
+
     input {
       display: none;
     }
@@ -77,6 +81,7 @@
       transition: .3s color;
       display: inline-block;
       color: var(--color-decor);
+      margin-bottom: .5em;
 
       &:hover {
         color: #666;
@@ -89,7 +94,11 @@
     }
   }
 
-  fieldset:nth-of-type(2) {
+  & > fieldset:nth-of-type(2) {
+    fieldset {
+      display: inline-block;
+    }
+
     input {
       display: none;
     }
@@ -98,20 +107,20 @@
       width: 2em;
       height: 2em;
       display: inline-block;
-      margin: 0 1em;
+      margin: 0 1em 1em;
       outline-offset: 4px;
+    }
 
-      &:nth-of-type(1) {
-        background-color: #53e3a6;
-      }
+    fieldset:nth-of-type(1) label {
+      background-color: #53e3a6;
+    }
 
-      &:nth-of-type(2) {
-        background-color: #2986b3;
-      }
+    fieldset:nth-of-type(2) label {
+      background-color: #2986b3;
+    }
 
-      &:nth-of-type(3) {
-        background-color: #000;
-      }
+    fieldset:nth-of-type(3) label {
+      background-color: #000;
     }
 
     input:checked + label {