diff --git a/src/html.rs b/src/html.rs
index 1ad0fb0..e2d0f8d 100644
--- a/src/html.rs
+++ b/src/html.rs
@@ -33,7 +33,6 @@ impl Traverser for Handler {
         match event {
             Event::Enter(Container::Headline(headline)) => {
                 let lvl = headline.level();
-                let lead = "#".repeat(lvl);
                 let lvl = 1 + min(lvl, 5);
                 let txt = headline.title().map(|t| t.to_string()).collect::<String>();
 
@@ -47,10 +46,7 @@ impl Traverser for Handler {
                     slugify!(&txt)
                 };
 
-                self.exp.push_str(format!(
-                    r##"<h{} id="{1}"><a aria-hidden=true tabindex=-1 href="#{1}">{2}</a> "##,
-                    lvl, id, lead
-                ));
+                self.exp.push_str(format!("<h{} id=\"{}\">", lvl, id));
 
                 if let Some(keyword) = headline.todo_keyword() {
                     self.exp.push_str(match headline.todo_type() {
@@ -69,7 +65,7 @@ impl Traverser for Handler {
                 }
 
                 self.exp.push_str(format!(
-                    r##" <small><a class=see-focus href="#{}">permalink to section</a></small></h{}>"##,
+                    r##" <a class=see-focus href="#{}" aria-label="permalink to section">¶</a></h{}>"##,
                     id, lvl
                 ));
             }
@@ -309,7 +305,7 @@ AAAA even more
         res.traverse(&mut exp);
         assert_eq!(
             exp.exp.finish(),
-            r##"<main><section></section><h2 id="meow"><a aria-hidden=true tabindex=-1 href="#meow">#</a> meow <small><a class=see-focus href="#meow">permalink to section</a></small></h2><section><div class="chat"><img class=chat-head width=64 src="faces/fox.png" alt="fox is fox"><div class=chat-text><span class=chat-nick aria-label="fox says">&lt;fox&gt;</span> AAAA
+            r##"<main><section></section><h2 id="meow">meow <a class=see-focus href="#meow" aria-label="permalink to section">¶</a></h2><section><div class="chat"><img class=chat-head width=64 src="faces/fox.png" alt="fox is fox"><div class=chat-text><span class=chat-nick aria-label="fox says">&lt;fox&gt;</span> AAAA
 </div></div><p>this__has__under_scores yip_{yap yop}
 </p><p><a href="#finish-writing-this-test">i am a heading link</a>
 <a href="hmm/example.org/test.html">should link to .html</a>
@@ -317,8 +313,8 @@ AAAA even more
 <a href="hmm/example.org/">im a directory!</a>
 <a href="https://example.org">webbed sight</a>
 </p><p><img src="https://cheapiesystems.com/media/images/libera-cat.png" alt="the libera.chat logo, but with the mountain replaced with a cat">
-</p></section><h3 id="foxwash-time"><a aria-hidden=true tabindex=-1 href="#foxwash-time">##</a> <span class=todo>TODO</span> wash the fox <small><a class=see-focus href="#foxwash-time">permalink to section</a></small></h3><section><p></p><div class="chat"><img class=chat-head width=64 src="faces/fox-stimky.png" alt="fox is stimky"><div class=chat-text><span class=chat-nick aria-label="fox says">&lt;fox&gt;</span> AAAA even more
-</div></div></section><h3 id="finish-writing-this-test"><a aria-hidden=true tabindex=-1 href="#finish-writing-this-test">##</a> <span class=done>DONE</span> finish writing this test <small><a class=see-focus href="#finish-writing-this-test">permalink to section</a></small></h3></main>"##
+</p></section><h3 id="foxwash-time"><span class=todo>TODO</span> wash the fox <a class=see-focus href="#foxwash-time" aria-label="permalink to section">¶</a></h3><section><p></p><div class="chat"><img class=chat-head width=64 src="faces/fox-stimky.png" alt="fox is stimky"><div class=chat-text><span class=chat-nick aria-label="fox says">&lt;fox&gt;</span> AAAA even more
+</div></div></section><h3 id="finish-writing-this-test"><span class=done>DONE</span> finish writing this test <a class=see-focus href="#finish-writing-this-test" aria-label="permalink to section">¶</a></h3></main>"##
         );
     }
 }
diff --git a/src/style.css b/src/style.css
index 0304539..e874c5b 100644
--- a/src/style.css
+++ b/src/style.css
@@ -9,10 +9,6 @@ body {
   padding: 10px;
 }
 
-h1, h2, h3, h4, h5, h6 {
-  font-weight: 400;
-}
-
 a {
   text-decoration: none;
   color: #3291ff;
@@ -128,13 +124,12 @@ li p:nth-of-type(1) {
   position: absolute;
   background: #000;
   color: #fff !important;
-  padding: 5px;
+  margin: 0 5px;
 }
 
-.see-focus:not(:focus) {
+:not(:hover) > .see-focus:not(:focus) {
   width: 1px;
   height: 1px;
-  padding: 0;
   overflow: hidden;
   clip: rect(1px 1px 1px 1px);
   clip: rect(1px, 1px, 1px, 1px);