diff --git a/app/assets/stylesheets/darkswarm/hub_node.css.sass b/app/assets/stylesheets/darkswarm/hub_node.css.sass
index c4ae2d0082..7da56435ed 100644
--- a/app/assets/stylesheets/darkswarm/hub_node.css.sass
+++ b/app/assets/stylesheets/darkswarm/hub_node.css.sass
@@ -11,8 +11,10 @@
       overflow-y: visible
 
     //Generic text link style
-    a:hover, a:active, a:focus
-      color: $clr-brick-bright
+    a, a *
+      color: $clr-brick
+      &:hover, &:active, &:focus
+        color: $clr-brick-bright
 
     //Hub and Producer icons
     i.ofn-i_063-hub, i.ofn-i_064-hub-reversed, i.ofn-i_059-producer, i.ofn-i_060-producer-reversed
@@ -33,72 +35,90 @@
       float: left
       font-weight: 700
 
-    @media all and (max-width: 640px) 
-      &.closed, &.open
+    //CLOSED row
+    &.closed
+      .active_table_row
+        border: 1px solid transparent
+        @media all and (max-width: 640px) 
+          border-color: $clr-brick-light
+        &:hover, &:active, &:focus
+          border-color: $clr-brick-light-bright
+
+    //OPEN row
+    &.open
+      .active_table_row, .active_table_row:first-child, .active_table_row:last-child
+        border-color: $clr-brick-light-bright
+
+    &.open, &.closed
+      @media all and (max-width: 640px) 
         .active_table_row:first-child .skinny-head
           background-color: $clr-brick-light
+          @include border-radius-mixed(0.5em, 0.5em, 0, 0)
           margin-top: -1rem
           margin-bottom: 1rem
           padding-top: 1rem
           padding-bottom: 1rem
-      &.inactive
-        &.closed, &.open
-          .active_table_row:first-child .skinny-head
-            background-color: white
-      &.current
-        &.closed, &.open
-          .active_table_row:first-child .skinny-head
-            background-color: $clr-brick-bright
-      &.current
-        &.inactive
-          &.closed, &.open
-            .active_table_row:first-child .skinny-head
-              background-color: #555
-
-    //Inactive row
-    &.inactive, &.inactive strong
-      color: $disabled-dark
-      &, & *
-        color: $disabled-dark
-
-      a i.ofn-i_040-hub
-        color: $disabled-dark
-    &.current
-      &.inactive
-        &.closed, &.open
-          .active_table_row:first-child
-            background-color: $disabled-dark
-            &, & *
-              color: white
-      &.closed
-        &:hover, &:active, &:focus
-          border: none
-          color: $disabled-dark
+        label
+          margin-top: 1rem
 
     //Padding second row
     &.open
       .active_table_row:nth-child(2)
         padding-bottom: 0.75rem
-        
-    //Current selected row
+    
+    //CURRENT hub (shows selected hub)
     &.current
       //overwrites active_table
       &.closed, &.open
+        a, a *
+          color: $clr-brick
+        .active_table_row
+          border-color: $clr-brick
         .active_table_row:first-child, .active_table_row:last-child
-          background-color: rgba(245, 230, 231, 0.95) 
+          background-color: $clr-brick-light-trans
           opacity: 1
           &:hover, &:focus, &:active
             opacity: 0.9
-      &.closed
-        a, a *
-          color: $clr-brick
-          &:hover, &:active, &:focus
-            color: $clr-brick-bright
-      &.open, &.closed
-        .active_table_row
-          border-color: $clr-brick
-      &.inactive
-        &.open, &.closed
-          .active_table_row
-            border-color: $disabled-dark
+            border-color: $clr-brick-bright
+        @media all and (max-width: 640px) 
+          .active_table_row:first-child .skinny-head
+            background-color: rgba(255,255,255,0.85)
+
+    //INACTIVE - closed hub
+    &.inactive
+      &.closed, &.open
+        &, & *
+          color: $disabled-dark
+      &.closed
+        .active_table_row, .active_table_row:first-child, .active_table_row:last-child
+          &:hover, &:active, &:focus
+            border-color: $disabled-bright
+      &.open
+        .active_table_row, .active_table_row:first-child, .active_table_row:last-child
+          border-color: $disabled-bright
+      // & Current hub
+      &.closed, &.open
+        &.current
+          .active_table_row, .active_table_row:first-child, .active_table_row:last-child
+            a, a *
+              color: $med-grey
+            border-color: $disabled-dark
+            background-color: rgba(220,220,220,0.5)
+            &:hover, &:focus, &:active
+              border-color: $disabled-dark
+          // Small devices
+          @media all and (max-width: 640px)
+            
+            .active_table_row:first-child .skinny-head
+              background-color: $disabled-bright
+        
+        // Small devices
+        @media all and (max-width: 640px) 
+          .active_table_row, .active_table_row:first-child, .active_table_row:last-child  
+            border-color: $disabled-bright
+            background-color: transparent
+            &:hover, &:focus, &:active
+              border-color: $disabled-dark
+          .active_table_row:first-child .skinny-head
+            background-color: $disabled-light