diff --git a/ProjectSourceCode/src/resources/css/generated-pages/card-styling.css b/ProjectSourceCode/src/resources/css/generated-pages/card-styling.css
index e69de29..c46c3d6 100644
--- a/ProjectSourceCode/src/resources/css/generated-pages/card-styling.css
+++ b/ProjectSourceCode/src/resources/css/generated-pages/card-styling.css
@@ -0,0 +1,83 @@
+/*
+==============================================================
+                 ENTIRE PAGE CONTAINER
+==============================================================
+*/
+
+.page-container {
+        /* --- SIZE CONTAINER --- */
+        width: 100%; /* Set the width to the full width of screen */
+        padding: 10px 100px; /* Create some distance between page boundries and elements */
+    
+        /* --- FORMAT CHILD ITEMS (Table and Leading Scorers Cards) --- */
+        display: flex; /* Enable flexbox layout */
+        flex-direction: column; /* Arrange child elements vertically */
+}
+
+/*
+=================================
+    LEAGUE INFORMATION HEADER
+=================================
+*/
+
+/* Stylization for League Information Header Card */
+.information-container
+{
+    /* --- POSITION CONTAINER --- */
+    align-items: center; /* Center content vertically */
+    margin: 20px;
+
+    /* --- SIZE CONTAINER --- */
+    height: 100px;
+    width: fit-content;
+    padding: 10px 20px; /* Adjust padding as needed */
+
+    /* --- STYLE CONTAINER --- */
+    background: linear-gradient(to right, white, rgb(245, 245, 245), rgb(227, 227, 227)); /* Gradient from white to gray */
+    transform: skewX(-20deg); /* Skew the banner to create a triangular side */
+    box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.4);
+
+    /* --- FORMAT CHILD ITEMS (logo, league name, flag) --- */
+    display: flex; /* Enable flexbox layout */
+    flex-direction: row; /* Arrange child elements horizontally */
+}
+
+    /*
+    ===========================
+   LEAGUE INFORMATION CHILD ITEMS
+    ===========================
+    */
+
+    /* Adds Red Diagonal Strip at the end of the #league-information-container */
+    .information-container::after
+    {
+        content: '';
+        position: absolute;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        width: 8px; /* Width of the red strip */
+        background-color: red; /* Red color */
+    }
+
+/*
+=============================================
+             CARDS IN PAGE BODY
+=============================================
+*/
+    
+/* Styling for Standings and Top Scorers Cards */
+.card-container
+{
+    /* --- POSITION CONTAINER --- */
+    margin: 0 10px;
+    margin-bottom: 20px;
+
+    /* --- SIZE CONTAINER --- */
+    padding: 15px;
+
+    /* --- STYLE CONTAINER --- */
+    background: linear-gradient(to top, rgb(216, 216, 216), rgb(236, 236, 236), rgb(241, 240, 240));
+    border: 1px solid gray;
+    box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.5);
+}
\ No newline at end of file
diff --git a/ProjectSourceCode/src/resources/css/generated-pages/club-pages/club-page.css b/ProjectSourceCode/src/resources/css/generated-pages/club-pages/club-page.css
index d82f2f6..b8b757a 100644
--- a/ProjectSourceCode/src/resources/css/generated-pages/club-pages/club-page.css
+++ b/ProjectSourceCode/src/resources/css/generated-pages/club-pages/club-page.css
@@ -1,69 +1,42 @@
-#club-page-body {
-    display: flex;
-    flex-direction: column;
-    width: 100%;
-    padding: 10px 100px;
-}
-
 /*
-=================================
-    LEAGUE INFORMATION HEADER
-=================================
+===========================
+LEAGUE INFORMATION CHILD ITEMS
+===========================
 */
 
-#club-header-container {
-    height: 100px;
-    width: fit-content;
-    margin: 20px;
-    background: linear-gradient(to right, white, rgb(245, 245, 245), rgb(227, 227, 227)); /* Gradient from white to gray */
-    padding: 10px 20px; /* Adjust padding as needed */
-    transform: skewX(-20deg); /* Skew the banner to create a triangular side */
-    cursor: pointer; /* Change cursor to pointer on hover */
-    box-shadow: 0px 3px 4px rgba(0, 0, 0, 0.4);
+/* Adds Red Diagonal Strip at the end of the #club-information-container */
+#club-header-container::after {
+    content: '';
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    width: 8px; /* Width of the red strip */
+    background-color: red; /* Red color */
+    }
 
-    display: flex; /* Use flexbox for layout */
-    align-items: center; /* Center content vertically */
+/* Styling for League Logo in Club Information Header */
+#club-logo 
+{
+    margin: 0px 30px;
+    transform: skewX(20deg); /* Skew the banner to create a triangular side */
+    height: 80%;
 }
 
-    /*
-    ===========================
-   LEAGUE INFORMATION CHILD ITEMS
-    ===========================
-    */
+/* Styling for League Title in Club Information Header */
+#club-title 
+{
+    transform: skewX(20deg); /* Skew the banner to create a triangular side */
+    margin-right: 20px;
+}
 
-    /* Adds Red Diagonal Strip at the end of the #club-information-container */
-    #club-header-container::after {
-        content: '';
-        position: absolute;
-        top: 0;
-        right: 0;
-        bottom: 0;
-        width: 8px; /* Width of the red strip */
-        background-color: red; /* Red color */
-      }
-
-    /* Styling for League Logo in Club Information Header */
-    #club-logo 
-    {
-        margin: 0px 30px;
-        transform: skewX(20deg); /* Skew the banner to create a triangular side */
-        height: 80%;
-    }
-
-    /* Styling for League Title in Club Information Header */
-    #club-title 
-    {
-        transform: skewX(20deg); /* Skew the banner to create a triangular side */
-        margin-right: 20px;
-    }
-
-    /* Styling for FLag in Club Information Header */
-    #club-flag 
-    {
-        transform: skewX(20deg); /* Skew the banner to create a triangular side */
-        height: 20px;
-        margin-right: 200px;
-    }
+/* Styling for FLag in Club Information Header */
+#club-flag 
+{
+    transform: skewX(20deg); /* Skew the banner to create a triangular side */
+    height: 20px;
+    margin-right: 200px;
+}
 
 /*
 =============================================
@@ -76,21 +49,7 @@
     flex-direction: row;
 }
 
-/* Styling for Standings and Top Scorers Cards */
-.card-container
-{
-    /* --- POSITION CONTAINER --- */
-    margin: 0 10px;
-    margin-bottom: 20px;
-
-    /* --- SIZE CONTAINER --- */
-    padding: 15px;
-
-    /* --- STYLE CONTAINER --- */
-    background: linear-gradient(to top, rgb(216, 216, 216), rgb(236, 236, 236), rgb(241, 240, 240));
-    border: 1px solid gray;
-    box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.5);
-}
+
 
 
 
diff --git a/ProjectSourceCode/src/resources/css/generated-pages/league-pages/league-page.css b/ProjectSourceCode/src/resources/css/generated-pages/league-pages/league-page.css
index 6baf1db..65de088 100644
--- a/ProjectSourceCode/src/resources/css/generated-pages/league-pages/league-page.css
+++ b/ProjectSourceCode/src/resources/css/generated-pages/league-pages/league-page.css
@@ -1,88 +1,43 @@
 /*
-==============================================================
-                     OVERALL PAGE STYLES
-==============================================================
+===========================
+LEAGUE INFORMATION CHILD ITEMS
+===========================
 */
 
-#league-page-body 
+/* Adds Red Diagonal Strip at the end of the #league-information-container */
+#league-information-container::after
 {
-    /* --- SIZE CONTAINER --- */
-    width: 100%; /* Set the width to the full width of screen */
-    padding: 10px 100px; /* Create some distance between page boundries and elements */
-
-    /* --- FORMAT CHILD ITEMS (Table and Leading Scorers Cards) --- */
-    display: flex; /* Enable flexbox layout */
-    flex-direction: column; /* Arrange child elements vertically */
+    content: '';
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    width: 8px; /* Width of the red strip */
+    background-color: red; /* Red color */
 }
 
-/*
-=================================
-    LEAGUE INFORMATION HEADER
-=================================
-*/
-
-/* Stylization for League Information Header Card */
-#league-information-container 
+/* Styling for League Logo in League Information Header */
+#league-logo 
 {
-    /* --- POSITION CONTAINER --- */
-    align-items: center; /* Center content vertically */
-    margin: 20px;
-
-    /* --- SIZE CONTAINER --- */
-    height: 100px;
-    width: fit-content;
-    padding: 10px 20px; /* Adjust padding as needed */
-
-    /* --- STYLE CONTAINER --- */
-    background: linear-gradient(to right, white, rgb(245, 245, 245), rgb(227, 227, 227)); /* Gradient from white to gray */
-    transform: skewX(-20deg); /* Skew the banner to create a triangular side */
-    box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.4);
-
-    /* --- FORMAT CHILD ITEMS (logo, league name, flag) --- */
-    display: flex; /* Enable flexbox layout */
-    flex-direction: row; /* Arrange child elements horizontally */
+    margin: 0px 30px;
+    transform: skewX(20deg); /* Skew the banner to create a triangular side */
+    height: 80%;
 }
 
-    /*
-    ===========================
-   LEAGUE INFORMATION CHILD ITEMS
-    ===========================
-    */
+/* Styling for League Title in League Information Header */
+#league-title 
+{
+    transform: skewX(20deg); /* Skew the banner to create a triangular side */
+    margin-right: 20px;
+}
 
-    /* Adds Red Diagonal Strip at the end of the #league-information-container */
-    #league-information-container::after
-    {
-        content: '';
-        position: absolute;
-        top: 0;
-        right: 0;
-        bottom: 0;
-        width: 8px; /* Width of the red strip */
-        background-color: red; /* Red color */
-    }
-
-    /* Styling for League Logo in League Information Header */
-    #league-logo 
-    {
-        margin: 0px 30px;
-        transform: skewX(20deg); /* Skew the banner to create a triangular side */
-        height: 80%;
-    }
-
-    /* Styling for League Title in League Information Header */
-    #league-title 
-    {
-        transform: skewX(20deg); /* Skew the banner to create a triangular side */
-        margin-right: 20px;
-    }
-
-    /* Styling for FLag in League Information Header */
-    #league-flag 
-    {
-        transform: skewX(20deg); /* Skew the banner to create a triangular side */
-        height: 20px;
-        margin-right: 200px;
-    }
+/* Styling for FLag in League Information Header */
+#league-flag 
+{
+    transform: skewX(20deg); /* Skew the banner to create a triangular side */
+    height: 20px;
+    margin-right: 200px;
+}
 
 /*
 =============================================
@@ -95,22 +50,6 @@
     flex-direction: row;
 }
 
-/* Styling for Standings and Top Scorers Cards */
-#league-table-stats-container, #league-top-scorers-stats-container 
-{
-    /* --- POSITION CONTAINER --- */
-    margin: 0 10px;
-    margin-bottom: 20px;
-
-    /* --- SIZE CONTAINER --- */
-    padding: 15px;
-
-    /* --- STYLE CONTAINER --- */
-    background: linear-gradient(to top, rgb(216, 216, 216), rgb(236, 236, 236), rgb(241, 240, 240));
-    border: 1px solid gray;
-    box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.5);
-}
-
 /*
 ==============================================================
                        HOVER STYLES
diff --git a/ProjectSourceCode/src/resources/css/generated-pages/league-pages/league-top-scorers.css b/ProjectSourceCode/src/resources/css/generated-pages/league-pages/league-top-scorers.css
index 5cf4fee..0fef2d5 100644
--- a/ProjectSourceCode/src/resources/css/generated-pages/league-pages/league-top-scorers.css
+++ b/ProjectSourceCode/src/resources/css/generated-pages/league-pages/league-top-scorers.css
@@ -1,6 +1,6 @@
 /*
 =================================
-    TABLE ADN HEADER CONTAINER
+    TABLE AND HEADER CONTAINER
 =================================
 */
 
diff --git a/ProjectSourceCode/src/views/pages/leagues-page.hbs b/ProjectSourceCode/src/views/pages/leagues-page.hbs
index bfee238..2b7e39d 100644
--- a/ProjectSourceCode/src/views/pages/leagues-page.hbs
+++ b/ProjectSourceCode/src/views/pages/leagues-page.hbs
@@ -1,25 +1,25 @@
 <div id="league-page-body" class="page-container">
 
     <!-- Container for all league information (logo, name, country, etc. ) <- top 100px -->
-    <div id="league-information-container" class="information-container">
+    <div id="league-header-container" class="information-container">
         <img id="league-logo" src="{{league.competition.league_emblem}}" alt="{{league.competition.league_name}} Emblem">
         <h1 id="league-title">{{league.competition.league_name}}</h2>
         <img id="league-flag" src="{{league.area.league_flag}}" alt="{{league.competition.league_name}} Flag">
     </div>
 
     <!-- Container to display all stats for league <- bottom rest of the container -->
-    <div id="table-and-top-scorers-containers" class="stats-container">
+    <div id="table-and-top-scorers-containers" class="page-content-container">
 
         <!-- Container to display league table <- split 50% -->
-        <div id="league-table-container" class="stats-container">
+        <div id="league-table-container" class="content-container">
 
             <!-- Put header above table container -->
-            <div id="league-table-header-container" class="header">
+            <div id="league-table-header-container" class="header-container">
                 <h2>Table</h2>
             </div>
             
             <!-- Container containing all league table stats -->
-            <div id="league-table-stats-container" class="stats-container">
+            <div id="league-table-stats-container" class="card-container">
                 <table id="league-standings-table">
                     <thead>
                         <tr>
@@ -54,13 +54,14 @@
         </div>
 
         <!-- Container to display top scorers for league <- Split 50% -->
-        <div id="league-top-scorers-container" class="stats-container">
-            <div id="league-top-scorers-header-container" class="header">
+        <div id="league-top-scorers-container" class="content-container">
+
+            <div id="league-top-scorers-header-container" class="header-container">
                 <h2>Top Scorers</h2>
             </div>
 
-            <div id="league-top-scorers-stats-container" class="stats-container">
-                <table>
+            <div id="league-top-scorers-stats-container" class="card-container">
+                <table id="league-top-scorers-table">
                     <thead>
                         <tr>
                             <th>Goals</th>