From df3c6eae87d513d441ddd5ba68e3852e8b8402e1 Mon Sep 17 00:00:00 2001
From: nitishkhobragade <nitishkhobragade89@gmail.com>
Date: Wed, 21 Feb 2024 10:27:40 +0530
Subject: [PATCH] making rock paper scissors responsive

---
 08_rock_paper_scissors_01/style.css | 38 +++++++++++++++++++++++++----
 1 file changed, 33 insertions(+), 5 deletions(-)

diff --git a/08_rock_paper_scissors_01/style.css b/08_rock_paper_scissors_01/style.css
index da7cc5f..04659ab 100644
--- a/08_rock_paper_scissors_01/style.css
+++ b/08_rock_paper_scissors_01/style.css
@@ -87,7 +87,7 @@
     color: purple;
   }
 
-/* for smal screens  */
+/* for small screens  */
 
 @media(max-width:768px){
   .resp-cont{
@@ -97,12 +97,24 @@
   .choices{
     width: 100%;
   }
+}
 
+@media only screen and (max-width: 600px) {
   .choices {
-    display: flex;
-    flex-wrap: wrap;
+    gap: 1rem;
+  }
 
+  .choice {
+    height: 6.8rem;
+    width: 6.8rem;
   }
+  
+  
+  img {
+    height: 6.5rem;
+    width: 6.5rem;
+  }
+  
 }
 
 @media(max-width:380px) {
@@ -111,11 +123,27 @@
     justify-content: center;
     gap: 1rem;
     flex-wrap: wrap;
-    margin-top: 5rem;
+    margin-top: 3rem;
   }
 
   h1 {
     height: 5rem;
-    line-height: 2rem;
+    line-height: 5rem;
+  }
+
+  .choices {
+    gap: 1rem;
+    margin-top: 2rem;
+  }
+
+  .choice {
+    height: 6.8rem;
+    width: 7rem;
+  }
+  
+  
+  img {
+    height: 6rem;
+    width: 6rem;
   }
 }
\ No newline at end of file