diff --git a/app/styles/components/verse.scss b/app/styles/components/verse.scss
index 30e0259..289e513 100644
--- a/app/styles/components/verse.scss
+++ b/app/styles/components/verse.scss
@@ -1,13 +1,15 @@
 .bi-arrow-left-square {
 	float:left;
-	font-size:2rem;
-	vertical-align: center;
+	width:2rem;
+    margin-top: .5rem;
+    margin-right: .75rem;
 }
 
 .bi-arrow-right-square {
 	float:right;
-	font-size:2rem;
-	vertical-align: center;
+	width:2rem;
+    margin-top: .5rem;
+    margin-left: .75rem;
 }
 
 a .bi-arrow-left-square, a .bi-arrow-right-square {
@@ -16,4 +18,8 @@ a .bi-arrow-left-square, a .bi-arrow-right-square {
 
 .bi-arrow-left-square:hover,.bi-arrow-right-square:hover {
 	color:darkgrey;
+}
+
+h1#verse-ref {
+    display: inline-block;
 }
\ No newline at end of file
diff --git a/app/templates/verse.hbs b/app/templates/verse.hbs
index ee8b27a..e49695c 100644
--- a/app/templates/verse.hbs
+++ b/app/templates/verse.hbs
@@ -1,7 +1,17 @@
-<div class="container pt-4">
-  <i role="button" class="bi bi-arrow-left-square"></i>
-  <h1>{{model.reference}}</h1>
-  <i role="button" class="bi bi-arrow-right-square"></i>
+<div class="container pt-4 text-center">
+  <a href="#" title="Go to the previous verse">
+  <svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" class="bi bi-arrow-left-square" viewBox="0 0 16 16">
+  <path fill-rule="evenodd" d="M15 2a1 1 0 0 0-1-1H2a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V2zM0 2a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V2zm11.5 5.5a.5.5 0 0 1 0 1H5.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L5.707 7.5H11.5z"/>
+  </svg>
+  </a>
+    <h1 id="verse-ref">{{model.reference}}</h1>
+  <a href="#" title="Go to the next verse">
+  <svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" class="bi bi-arrow-right-square" viewBox="0 0 16 16">
+  <path fill-rule="evenodd" d="M15 2a1 1 0 0 0-1-1H2a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V2zM0 2a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V2zm4.5 5.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z"/>
+  </svg>
+  </a>
+</div>
+<div class="container">
   <div class="row">
     <div class="col-12 pt-4 pb-3">
       <h4>ULB</h4>