Style and formatting changes added to score cards

.gitignore

@@ -1,2 +1,2 @@
-node_modules
+ProjectSourceCode/node_modules
 .DS_Store

ProjectSourceCode/src/resources/css/scoreboard-header/game-card.css

@@ -3,11 +3,9 @@
     border: 1px solid #ccc;
     border-radius: 4px;
     padding: 6px;
-    margin: 2.5px 2.5px; /* Remove horizontal margin */
-    min-height: 100px;
+    margin: 5px 2.5px; /* Distance between cards and container */
     min-width: 150px;
-    box-sizing: border-box;
-
+    
     transition: transform 0.4s ease; /* Add transition for smooth effect */
 }
 
@@ -15,6 +13,7 @@
     transform: scale(1.05); /* Scale up by 10% on hover */
 }
 
+/* Entire Card Information Body */
 .score-card-body {
     display: flex;
     width: 100%;
@@ -22,30 +21,38 @@
     align-items: center;
 }
 
+/* Left Side of Container (Scores) */
 .card-team-container {
     flex: 70%;
-    display: flex;
-    flex-direction: column;
+    flex-grow: 1; /* Both team containers will grow to occupy equal width */
+    flex-direction: column; /* Stacks each team over one another */
 }
 
+/* Right Side of Container (Time) */
 .card-game-information-container {
     flex: 30%;
     display: flex;
-    align-items: center;
-    justify-content: center;
+    margin-left: 10px;
 }
 
 .team {
     display: flex;
-    align-items: center;
+    align-items: center; /* Center items vertically */
+    justify-content: center;
     padding: 5px;
 }
 
+
 .team p {
-    margin-right: 10px; /* Adjust this value to control the space between team name and score */
+    margin: 0; /* Remove default margin */
+}
+
+#team-name {
+    margin-right: 10px;
 }
 
 .team img {
-    height: 30px;
+    width: 20px; /* Set the width of the image to 100% of its container */
+    height: auto; /* Maintain the aspect ratio */
     margin-right: 10px;
 }