Update style.css

style.css

@@ -42,10 +42,10 @@
   main {
     display: flex;
     flex-direction: row;
-    width: 550px;
+    width: 600px;
     max-width: 100%;
     min-width: 450px;
-    height: 380px;
+    height: 480px;
     border-radius: 1.5rem;
     background-color: var(--white);
     box-shadow: 5px 5px 20px 0px var(--light-lavender);
@@ -59,7 +59,7 @@
     background-color: var(--cobalt-blue);
     background-image: linear-gradient(to bottom, var(--light-slate-blue), var(--light-royal-blue));
     border-radius: 1.5rem;
-    padding: 1.5rem;
+    padding: 2rem;
     color: var(--light-lavender);
     display: flex;
     align-items: center;
@@ -78,8 +78,8 @@
 
   /* Styling for the circle within Section 1 */
   .part1 > .circle {
-    height: 9rem;
-    width: 9rem;
+    height: 12.4rem;
+    width: 12rem;
     border-radius: 50%;
     background-color: var(--cobalt-blue);
     background-image: linear-gradient(to top, var(--violet-blue), var(--persian-blue));
@@ -93,14 +93,16 @@
   .part1 > .circle > span {
     display: flex;
     justify-content: center;
-    padding-top: 2rem;
-    font-size: 3.6rem;
+    flex-direction: column;
+    align-items: center;
+    padding-top: 4rem;
+    font-size: 3.9rem;
     font-weight: bold;
     color: var(--white);
   }
 
   .part1 > .circle > p {
-    margin-left: 0.8rem;
+    padding-left: 2rem;
   }
 
   /* Styling for h2 within Section 1 */
@@ -121,6 +123,7 @@
     flex-direction: column;
     text-align: center;
     margin-top: 0.5rem;
+    margin-bottom: 0.5rem;
   }
 
   /* Styling for Section 2 - Summary */
@@ -140,9 +143,9 @@
     flex-direction: column;
     justify-content: center;
     align-items: center;
-    gap: 15px;
-    margin-top: 20px;
-    margin-bottom: 20px;
+    gap: 20px;
+    margin-top: 25px;
+    margin-bottom: 25px;
   }
 
   /* Styling for individual sections within the container */
@@ -152,6 +155,7 @@
     align-items: center;
     padding: 10px;
     width: 100%;
+    height: 3.5rem;
     border-radius: 8px;
     justify-content: space-between;
   }
@@ -202,7 +206,7 @@
     justify-content: center;
     font-size: 1.2rem;
     width: 100%;
-    height: 2.8rem;
+    height: 3rem;
     background-color: hsl(224, 30%, 27%);
     color: white;
     border-radius: 2rem;