responsiveness

1 files changed, 20 insertions, 25 deletions

diff --git a/common.css b/common.css
index cf4e037..30f664b 100644
--- a/common.css
+++ b/common.css
@@ -118,46 +118,41 @@ a:hover {
     align-items: center;
     align-self: flex-start;
     gap: 20px;
+    flex-direction: row;
 }
 
-@media (min-width: 900px) {
-    .art {
-        margin-left: 0%;
-        margin-right: 0%;
-    }
+.art-container img {
+    height: 300px;
+    width: auto;
+}
 
-    .art-nav {
-        margin-left: 30%;
-        margin-right: 30%;
+/* mobile */
+
+@media (max-width: 900px) {
+    body {
+        background-size: cover;
     }
 
     .art-container {
-        flex-direction: row;
+        flex-direction: column;
     }
 
     .art-container img {
-        height: 300px;
-        width: auto;
-        
+        height: auto;
+        width: 80vw;
     }
-}
 
-@media (max-width: 400px) {
-    body {
-        margin-left: 15px;
-        margin-right: 15px;
-        font-size: 20px;
+    .logo {
+        position: relative;
+        margin: 20px;
     }
 
-    .art-container {
-        flex-direction: column;
+    .logo img {
+        width: 80vw;
     }
 
-    .art-container img {
-        height: auto;
-        width: 80vw;
-        margin-left: 5vw;
-        margin-right: 5vw;
+    .logo img:hover {
+        width: 85vw;
     }
 }