Disable selection of colon dividers in header

_includes/header.html

@@ -7,10 +7,10 @@
 </header>
 <nav>
     <a href="/">~/</a>
-    :
+    <span class="no-select">:</span>
     <a href="https://xevion.dev">~/about/</a>
-    :
+    <span class="no-select">:</span>
     <a href="https://xevion.dev/projects">~/projects/</a>
-    :
+    <span class="no-select">:</span>
     <a href="https://xevion.dev/resume">~/resume/</a>
 </nav>

_sass/helpers.scss

@@ -26,3 +26,12 @@ p {
 body.wide {
     max-width: 60rem !important;
 }
+
+.no-select {
+    -webkit-touch-callout: none; /* iOS Safari */
+    -webkit-user-select: none; /* Safari */
+    -khtml-user-select: none; /* Konqueror HTML */
+    -moz-user-select: none; /* Firefox */
+    -ms-user-select: none; /* Internet Explorer/Edge */
+    user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */
+}