diff --git a/src/pages/Index2.tsx b/src/pages/Index2.tsx
index 8a32fbe..b69680c 100644
--- a/src/pages/Index2.tsx
+++ b/src/pages/Index2.tsx
@@ -1,5 +1,5 @@
 import L from "leaflet";
-import { createResource, For, onMount, Suspense } from "solid-js";
+import { createResource, createSignal, For, onMount, Suspense } from "solid-js";
 import { LineSegmentsIcon } from "../icons/LineSegmentsIcon";
 import { Line, Lines, Route, Routes } from "../new_types";
 
@@ -98,6 +98,8 @@ function LineEl(props: { line: Line }) {
 }
 
 function RouteEl(props: { line_name: string, route: Route, color: string }) {
+    const [active, setActive] = createSignal(false);
+
     // Render the dots into the map
     const coords = props.route.points.map(([lat, lng]) => ({ lat, lng }));
     const line = L.polyline(coords, { color: props.color, opacity: LINE_OPACITY });
@@ -113,16 +115,27 @@ function RouteEl(props: { line_name: string, route: Route, color: string }) {
     lines_store.get(line_name)!.set(props.route.name, [line, 0]);
 
     const set_highlighted = () => {
+        const is_active = active();
         const arr = lines_store.get(props.line_name)?.get(props.route.name);
-        if (arr !== undefined) {
+
+        if (is_active && arr !== undefined) {
+            arr[1] -= 1;
+            setActive(false);
+        } else if (!is_active && arr !== undefined) {
             arr[1] += 1;
+            setActive(true);
         }
     };
 
+    const active_classes = () => {
+        if (active()) return "underline bg-[var(--hover-bg)] text-[var(--hover-on-bg)]";
+        else return "";
+    };
+
     return (
         <button
-            class="inline-block w-full text-left cursor-pointer pl-10
-                hover:bg-[var(--hover-bg)] hover:text-[var(--hover-on-bg)]"
+            class={`inline-block w-full text-left cursor-pointer pl-10
+                hover:bg-[var(--hover-bg)] hover:text-[var(--hover-on-bg)] ${active_classes()}`}
             onClick={set_highlighted}
             onMouseEnter={() => highlight_route(props.line_name, props.route.name)}
             onMouseLeave={() => unhighlight_route(props.line_name, props.route.name)}