Update README.md

README.md

@@ -8,36 +8,25 @@ pinned: false
 ---
 
 <h1 style="display:inline-block;">
-  <img src="https://cdn-uploads.huggingface.co/production/uploads/6471b447a2b0a376b8b5e879/UBtI1vIvzl5YSMKL8-Mhx.png" width="32" height="32" style="vertical-align:middle;" />
-  
-  <strong class="hi-text">Human Intelligence</strong>
+  <img src="https://cdn-uploads.huggingface.co/production/uploads/6471b447a2b0a376b8b5e879/UBtI1vIvzl5YSMKL8-Mhx.png"
+       width="32"
+       style="vertical-align:middle;" />
+
+  <strong 
+    style="
+      position:relative;
+      display:inline-block;
+      padding:2px 4px;
+      background:linear-gradient(#e0e0e0,#e0e0e0) bottom/100% 6px no-repeat;
+      transition:background-size 0.25s ease;
+    "
+    onmouseover="this.style.backgroundSize='100% 100%'"
+    onmouseout="this.style.backgroundSize='100% 6px'"
+  >
+    Human Intelligence
+  </strong>
 </h1>
 
-<style>
-.hi-text {
-  position: relative;
-  display: inline-block;
-  padding: 2px 4px;
-}
-
-.hi-text::after {
-  content: "";
-  position: absolute;
-  left: 0;
-  bottom: 0;
-  width: 100%;
-  height: 6px;
-  background: #e0e0e0;
-  border-radius: 4px;
-  transition: height 0.25s ease;
-  z-index: -1;
-}
-
-.hi-text:hover::after {
-  height: 100%;
-}
-</style>
-
 A community-powered Q&A engine where questions are matched semantically. 
 Ask something, and if a similar question exists, you get the best voted answer instantly. 
 If not, anyone can write the first answer.