diff --git a/__pycache__/dashboard.cpython-310.pyc b/__pycache__/dashboard.cpython-310.pyc
index ecb6053..fa27820 100644
Binary files a/__pycache__/dashboard.cpython-310.pyc and b/__pycache__/dashboard.cpython-310.pyc differ
diff --git a/dashboard_static/index.html b/dashboard_static/index.html
index 03d1162..12a5c4c 100644
--- a/dashboard_static/index.html
+++ b/dashboard_static/index.html
@@ -6,6 +6,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Twitter sports dashboard</title>
     <link rel="stylesheet" href="./style/style.css">
+    <link rel="stylesheet" href="./style/responsive.css">
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,500;1,400&display=swap" rel="stylesheet">
@@ -13,10 +14,9 @@
     <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0" />
     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
     <link rel="icon" type="image/x-icon" href="./media/logo.png">
-    
 </head>
 <body>
-    <div id="tweet" style="height: 200px;"></div>
+    <!-- <div id="tweet" style="height: 200px;"></div> -->
     <div class="container">
         <div class="header">
             <div class="logo">
@@ -61,7 +61,7 @@
         <div class="main">
             <div class="maintable">
                 <div class="leftcol column">
-                    <h1 class="colheader">LATEST CLUCCS</h1>
+                    <span class="colheader">Latest Cluccs</span>
                     <div class="tweetcontainer">
                         <div class="tweet">
                             <img src="https://pbs.twimg.com/profile_images/1158803404656959490/9MKSbW4O_400x400.jpg" alt="" class="tweet-profilepicture">
@@ -90,16 +90,18 @@
                     </div>
                 </div>
                 <div class="centercol column">
-                    <h1 class="colheader">FILTERED CLUCCS</h1>
+                    <span class="colheader">Filtered Cluccs</span>
                 </div>
-                <div class="searchcontainer column">
-                    <input class = "searchbar" type = "text" placeholder="SEARCH CLUCCS...">
-                    <button class = "button">SORT BY</button>
-                    <button class = "button">BLOCKED WORDS</button>
-                    <button class = "button">POPULARITY FILTER</button>
-                </div>
-                <div class="popchart column">
-                    <h1 class="colheader chartheader">SPORTS POPULARITY CHART</h1>
+                <div class="rightcol column">
+                    <div class="searchcontainer column">
+                        <input class = "searchbar" type = "text" placeholder="SEARCH CLUCCS...">
+                        <button class = "button">SORT BY</button>
+                        <button class = "button">BLOCKED WORDS</button>
+                        <button class = "button">POPULARITY FILTER</button>
+                    </div>
+                    <div class="popchart column">
+                        <h1 class="colheader chartheader">SPORTS POPULARITY CHART</h1>
+                    </div>
                 </div>
             </div>
         </div> 
@@ -113,10 +115,10 @@
     <script src="./js/code.js"></script>
     <script src="./js/connection.js"></script>
     <script>
-        block("#tweet").tweets({
-            memory: 20
-        });
-        events.connect("tweet", "#tweet");
+        // block("#tweet").tweets({
+        //     memory: 20
+        // });
+        // events.connect("tweet", "#tweet");
         
         // // create a rolling chart block
         // block('#graph').rolling_chart({
diff --git a/dashboard_static/js/code.js b/dashboard_static/js/code.js
index 7679c8e..20a8484 100644
--- a/dashboard_static/js/code.js
+++ b/dashboard_static/js/code.js
@@ -16,12 +16,36 @@ $(".sport").on("click", function() {
     }
 
     $(this).trigger("selected", [selectedSports.includes(sportName), selectedSports]) // Trigger event
+    showFeeds()
 })
 
 function getCSSVariable(name) {
     return getComputedStyle(root).getPropertyValue(name)
 }
 
+function showFeeds() {
+    if ($(window).width() < 1280) {
+        if (selectedSports.length === 0) {
+            $(".leftcol").show()
+            $(".centercol").hide()
+        } else {
+            $(".leftcol").hide()
+            $(".centercol").show()
+        }
+    } else {
+        $(".leftcol").show()
+        $(".centercol").show()
+    }
+}
+
+$(window).on("resize", function(){
+    showFeeds()
+});
+
+$(window).on("load", function() {
+    showFeeds()
+})
+
 function tweetCell(tweet) {
     var cell = document.createElement("div");
     cell.innerHTML =
@@ -50,7 +74,4 @@ function tweetCell(tweet) {
         </div>
     </div>`
     return cell
-}
-
-$(document).on('tweet', console.log(tweet));
-    
+}
\ No newline at end of file
diff --git a/dashboard_static/style/responsive.css b/dashboard_static/style/responsive.css
new file mode 100644
index 0000000..379fbba
--- /dev/null
+++ b/dashboard_static/style/responsive.css
@@ -0,0 +1,33 @@
+@media only screen and (max-width: 1280px) {
+    .maintable {
+        grid-template-columns: 1fr 1fr;
+        grid-gap: 32px;
+    }
+}
+
+
+@media only screen and (max-width: 850px) {
+    .maintable {
+        grid-template-columns: 1fr;
+    }
+    .header-title {
+        display: none;
+    }
+    .sport-name {
+        font-size: 20px;
+    }
+    .column {
+        grid-row: unset;
+    }
+    .colheader {
+        font-size: 32px;
+    }
+
+}
+
+
+
+
+
+  /* 360x640 414x896
+  601x962 1280x800 */
\ No newline at end of file
diff --git a/dashboard_static/style/style.css b/dashboard_static/style/style.css
index a33777c..258ca21 100644
--- a/dashboard_static/style/style.css
+++ b/dashboard_static/style/style.css
@@ -24,6 +24,8 @@ body {
 	background-color: var(--main-bg);
 	color: white;
 	padding: 16px 48px;
+	display: flex;
+	flex-direction: column;
 }
 
 .header, .sports, .logo {
@@ -45,11 +47,11 @@ body {
 }
 
 .logo img {
-	height: 40px;
+	height: 36px;
 }
 
 .logo span {
-	font-size: 40px;
+	font-size: 36px;
 	font-weight: 500;
 	margin: 0 8px;
 }
@@ -112,7 +114,7 @@ body {
 .tweet-interaction {
 	display: flex;
 	align-items: center;
-	margin-right: 32px;
+	margin-right: 24px;
 }
 
 .tweet-interaction .material-symbols-outlined {
@@ -147,51 +149,61 @@ body {
 /* Three main columns; CSS Grid */
 .maintable {
 	/*background-color: #ffffff; */ /* The colors are there just so that I can see what I'm doing better */
-	display: grid;
 	width: 100%;
+	height: 100%;
+	display: grid;
 	grid-template-columns: 1fr 1fr 1fr;
-	grid-template-rows: 1fr 1fr;
-
-	gap: 48px;
+	grid-template-rows: 1fr;
+	grid-gap: 48px;
 	/* margin:20px; */
 }
 
 .main {
-	margin-top: 48px;
+	margin-top: 32px;
+	height: 100%;
 }
 
 .column {
 	border-radius: 16px;
 }
 
+.leftcol, .centercol {
+	overflow-y: auto;
+	grid-row: 1/ -1;
+}
+
 .leftcol {
 	background-color: red;
-	grid-row: 1/ -1;
 }
 
 .centercol {
 	background-color: green;
-	grid-row: 1/ -1;
+}
+
+.rightcol {
+	display: flex;
+    flex-direction: column;
 }
 
 .searchcontainer {
 	background-color: blue;
-	height: 400px;
+	/* height: 400px; */
 }
 
 .popchart {
 	background-color: rgba(255, 0, 255, 0.344);
-	height: 400px;
+	/* height: 400px; */
 }
 
 .colheader {
+	display: block;
+	font-weight: 500;
+	font-size: 40px;
+	padding: 8px 16px;
 	font-size: 38px;
 	padding-left: 30px;
 }
 
-.searchbar {
-	width: 500px;
-}
 .searchbar, .button {
 	font-weight: bold;
 	font-size: 32px;
@@ -205,6 +217,6 @@ body {
 	border: none;
 }
 
-.button:hover {
+/* .button:hover {
 	background-color: ;
-}
\ No newline at end of file
+} */
\ No newline at end of file
diff --git a/eca/__pycache__/arff.cpython-310.pyc b/eca/__pycache__/arff.cpython-310.pyc
index f36aef8..dab7427 100644
Binary files a/eca/__pycache__/arff.cpython-310.pyc and b/eca/__pycache__/arff.cpython-310.pyc differ
diff --git a/eca/__pycache__/generators.cpython-310.pyc b/eca/__pycache__/generators.cpython-310.pyc
index c475398..01498c6 100644
Binary files a/eca/__pycache__/generators.cpython-310.pyc and b/eca/__pycache__/generators.cpython-310.pyc differ
