Refactor CSS.

assets/styles/site.css

@@ -41,6 +41,15 @@ p, li {
     font-size: 1.3rem;
 }
 
+a {
+    text-decoration: none;
+    color: inherit;
+}
+
+a:hover {
+    font-weight: bold;
+}
+
 
 /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * 
  *  HEADER                                                                   *
@@ -79,6 +88,7 @@ nav > ul {
 nav > ul > li {
     display: inline-block;
     margin-right: 0.8rem;
+    color: #006666;
 }
 
 nav > ul > li:before {
@@ -86,27 +96,31 @@ nav > ul > li:before {
     margin-right: 0.3rem;
 }
 
-nav > ul > li > a {
-    color: #006666;
-    text-decoration: none;
-}
-
-nav > ul > li > a:hover {
-    text-decoration: underline;
-}
-
 
 /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * 
  *  SECTION                                                                  *
  * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
 
+section {
+    margin-bottom: 2rem;
+}
+
+section:last-child {
+    margin-bottom: 0;
+}
+
 section > p {
-    display: inline-block;
     margin: 0;
+}
+
+section > p > span {
+    padding: 0.1rem 0;
     background: #000000;
+    box-shadow: 0.2rem 0 0 #000000, -0.2rem 0 0 #000000;
     color: #ffffff;
 }
 
-section > p.accent {
+section > p:first-child > span {
     background: #006666;
+    box-shadow: 0.2rem 0 0 #006666, -0.2rem 0 0 #006666;
 }

index.html

@@ -42,9 +42,9 @@
 </nav>
 
 <section>
-    <p class="accent">Viale Molise 68, Milano</p>
+    <p><span>Viale Molise 68, Milano</span></p>
-    <p>unit at paranoici.org</p>
+    <p><span>unit at paranoici dot org</span></p>
-    <p>#unit on irc.autistici.org</p>
+    <p><span>#unit on irc.autistici.org<span></p>
 </section>
 </body>