diff --git a/src/t2-design/components/IconItem.css b/src/t2-design/components/IconItem.css
index bf8bd45..c536870 100644
--- a/src/t2-design/components/IconItem.css
+++ b/src/t2-design/components/IconItem.css
@@ -1,11 +1,27 @@
-.topo-item-icon {
+i.icon.topo-item-icon {
     border-radius: 10px;
     color: #4a4a4a;
     background-color: #f6f6f6;
+    line-height: 1;
+    vertical-align: baseline;
+    width: 2em;
+    height: 2em;
+    padding: .5em 0!important;
+    box-shadow: 0 0 0 1px #d4d4d5, 0 2px 0 0 #767676, 0 1px 3px 0 #d4d4d5;
 }
 
-
+i.icon.topo-item-icon:hover {
+    box-shadow: 0px 0px 5px #41ff00 !important;
+    transform: translateY(-3px);
+    animation: none;
+    cursor: pointer;
+}
 
 .topo-item-icon.selected {
-    background-color: #e8e8e8;
+    box-shadow: 0px 0px 5px #41ff00 !important;
+}
+
+i.icon.topo-item-icon.selected:hover {
+    transform: none;
+    animation: none;
 }
diff --git a/src/t2-design/components/Item.css b/src/t2-design/components/Item.css
index 55a7c41..6895d9e 100644
--- a/src/t2-design/components/Item.css
+++ b/src/t2-design/components/Item.css
@@ -4,14 +4,6 @@
     animation-iteration-count: infinite;
 }
 
-.topo-item:hover {
-    background-color: #dfdfdf;
-}
-
-.topo-item {
-    background-color: #f1f1f1;
-}
-
 
 @keyframes item-bounce {
     from { transform: translate3d(0, 0, 0);     }
diff --git a/src/t2-design/components/Service.css b/src/t2-design/components/Service.css
index 20f7617..c1a03da 100644
--- a/src/t2-design/components/Service.css
+++ b/src/t2-design/components/Service.css
@@ -4,8 +4,18 @@
     margin: auto !important;
 }
 
-.topo-service.selected {
-    background-color: #ebebeb !important;
+.topo-item.topo-service {
+    background-color: #f1f1f1;
+}
+
+.topo-item.topo-service:hover {
+    background-color: #f1f1f1 !important;
+    box-shadow: 0px 0px 5px #41ff00 !important;
+    animation: none;
+}
+
+.topo-item.topo-service.selected {
+    box-shadow: 0px 0px 5px #41ff00;
 }
 
 .topo-service .floatleft {