Index: gc_lang/fr/webext/content_scripts/panel_gc.css
==================================================================
--- gc_lang/fr/webext/content_scripts/panel_gc.css
+++ gc_lang/fr/webext/content_scripts/panel_gc.css
@@ -13,11 +13,11 @@
 .grammalecte_paragraph {
     margin: 0;
     padding: 10px;
     background-color: hsl(0, 0%, 96%);
     border-radius: 2px;
-    line-height: normal;
+    line-height: 1.4;
     text-align: left;
     font-size: 14px;
     font-family: "Courier New", Courier, "Lucida Sans Typewriter", "Lucida Typewriter", monospace;
     color: hsl(0, 0%, 0%);
 }
@@ -218,18 +218,19 @@
 }
 
 
 /* elems */
 .grammalecte_error_WORD {
-    /*border-bottom: 2px solid hsl(0, 10%, 30%);*/
-    background-color: hsl(0, 50%, 50%);
-    color: hsl(0, 0%, 96%);
+    border-bottom: 2px solid hsl(0, 90%, 40%);
+    background-color: hsl(0, 90%, 90%);
+    color: hsl(0, 90%, 20%);
     /*text-decoration: underline wavy hsl(0, 50%, 50%);*/
 }
 .grammalecte_error_WORD:hover {
-    background-color: hsl(0, 60%, 40%);
-    color: hsl(0, 0%, 100%);
+    border-bottom: 2px solid hsl(0, 90%, 30%);
+    background-color: hsl(0, 100%, 85%);
+    color: hsl(0, 90%, 20%);
 }
 
 /* elems */
 .grammalecte_error_typo, 
 .grammalecte_error_esp, 
@@ -242,13 +243,13 @@
 .grammalecte_error_unit, 
 .grammalecte_error_nf, 
 .grammalecte_error_liga, 
 .grammalecte_error_mapos, 
 .grammalecte_error_chim {
-    background-color: hsl(30, 70%, 50%);
-    color: hsl(30, 10%, 96%);
-    /*text-decoration: underline wavy hsl(30, 70%, 50%);*/
+    border-bottom: 2px solid hsl(30, 100%, 40%);
+    background-color: hsl(30, 100%, 90%);
+    color: hsl(30, 90%, 20%);
 }
 
 .grammalecte_error_typo:hover, 
 .grammalecte_error_esp:hover, 
 .grammalecte_error_nbsp:hover, 
@@ -260,72 +261,77 @@
 .grammalecte_error_unit:hover, 
 .grammalecte_error_nf:hover, 
 .grammalecte_error_liga:hover, 
 .grammalecte_error_mapos:hover, 
 .grammalecte_error_chim:hover {
-    background-color: hsl(30, 80%, 45%);
-    color: hsl(30, 10%, 96%);
+    border-bottom: 2px solid hsl(30, 100%, 30%);
+    background-color: hsl(30, 100%, 85%);
+    color: hsl(30, 90%, 20%);
 }
 
 /* elems */
 .grammalecte_error_apos {
-    background-color: hsl(40, 90%, 50%);
-    color: hsl(40, 10%, 96%);
-    /*text-decoration: underline wavy hsl(40, 70%, 45%);*/
+    border-bottom: 2px solid hsl(50, 100%, 50%);
+    background-color: hsl(50, 100%, 80%);
+    color: hsl(50, 90%, 20%);
 }
 .grammalecte_error_apos:hover {
-    background-color: hsl(40, 100%, 45%);
-    color: hsl(40, 10%, 96%);
+    border-bottom: 2px solid hsl(50, 100%, 45%);
+    background-color: hsl(50, 100%, 75%);
+    color: hsl(50, 90%, 20%);
 }
 
 /* elems */
 .grammalecte_error_gn,
 .grammalecte_error_sgpl {
-    background-color: hsl(210, 50%, 50%);
-    color: hsl(210, 10%, 96%);
-    /*text-decoration: underline wavy hsl(210, 50%, 50%);*/
+    border-bottom: 2px solid hsl(210, 90%, 40%);
+    background-color: hsl(210, 100%, 90%);
+    color: hsl(210, 90%, 20%);
 }
 .grammalecte_error_gn:hover,
 .grammalecte_error_sgpl:hover {
-    background-color: hsl(210, 60%, 40%);
-    color: hsl(210, 10%, 96%);
+    border-bottom: 2px solid hsl(210, 90%, 30%);
+    background-color: hsl(210, 100%, 85%);
+    color: hsl(210, 90%, 20%);
 }
 
 /* elems */
 .grammalecte_error_conj, 
 .grammalecte_error_infi, 
 .grammalecte_error_imp, 
 .grammalecte_error_inte, 
 .grammalecte_error_ppas, 
 .grammalecte_error_vmode  {
-    background-color: hsl(300, 30%, 40%);
-    color: hsl(300, 10%, 96%);
-    /*text-decoration: underline wavy hsl(300, 40%, 40%);*/
+    border-bottom: 2px solid hsl(240, 90%, 40%);
+    background-color: hsl(240, 100%, 90%);
+    color: hsl(240, 90%, 20%);
 }
 
 .grammalecte_error_conj:hover, 
 .grammalecte_error_infi:hover, 
 .grammalecte_error_imp:hover, 
 .grammalecte_error_inte:hover, 
 .grammalecte_error_ppas:hover, 
 .grammalecte_error_vmode:hover {
-    background-color: hsl(300, 40%, 30%);
-    color: hsl(300, 10%, 96%);
+    border-bottom: 2px solid hsl(240, 90%, 30%);
+    background-color: hsl(240, 100%, 85%);
+    color: hsl(240, 90%, 20%);
 }
 
 /* elems */
 .grammalecte_error_conf, 
 .grammalecte_error_ocr {
-    background-color: hsl(270, 40%, 30%);
-    color: hsl(270, 10%, 96%);
-    /*text-decoration: underline wavy hsl(270, 40%, 30%);*/
+    border-bottom: 2px solid hsl(270, 90%, 40%);
+    background-color: hsl(270, 100%, 90%);
+    color: hsl(270, 90%, 20%);
 }
 
 .grammalecte_error_conf:hover, 
 .grammalecte_error_ocr:hover {
-    background-color: hsl(270, 50%, 20%);
-    color: hsl(270, 10%, 96%);
+    border-bottom: 2px solid hsl(270, 90%, 30%);
+    background-color: hsl(270, 100%, 85%);
+    color: hsl(270, 90%, 20%);
 }
 
 /* elems */
 .grammalecte_error_bs, 
 .grammalecte_error_pleo, 
@@ -333,13 +339,13 @@
 .grammalecte_error_redon1, 
 .grammalecte_error_redon2, 
 .grammalecte_error_mc, 
 .grammalecte_error_date, 
 .grammalecte_error_notype {
-    background-color: hsl(180, 50%, 40%);
-    color: hsl(180, 10%, 96%);
-    /*text-decoration: underline wavy hsl(180, 50%, 40%);*/
+    border-bottom: 2px solid hsl(180, 90%, 40%);
+    background-color: hsl(180, 100%, 90%);
+    color: hsl(180, 90%, 20%);
 }
 
 .grammalecte_error_bs:hover, 
 .grammalecte_error_pleo:hover, 
 .grammalecte_error_neg:hover, 
@@ -346,8 +352,9 @@
 .grammalecte_error_redon1:hover, 
 .grammalecte_error_redon2:hover, 
 .grammalecte_error_mc:hover, 
 .grammalecte_error_date:hover, 
 .grammalecte_error_notype:hover {
-    background-color: hsl(180, 60%, 30%);
-    color: hsl(180, 10%, 96%);
+    border-bottom: 2px solid hsl(180, 90%, 30%);
+    background-color: hsl(180, 100%, 85%);
+    color: hsl(180, 90%, 20%);
 }

Index: gc_lang/fr/webext/content_scripts/panel_gc.js
==================================================================
--- gc_lang/fr/webext/content_scripts/panel_gc.js
+++ gc_lang/fr/webext/content_scripts/panel_gc.js
@@ -308,13 +308,13 @@
     show (sNodeErrorId) {  // err
         try {
             let xNodeErr = document.getElementById(sNodeErrorId);
             this.sErrorId = xNodeErr.dataset.error_id; // we store error_id here to know if spell_suggestions are given to the right word.
             let nLimit = oGrammalecte.oGCPanel.getWidth() - 330; // paragraph width - tooltip width
-            this.xTooltipArrow.style.top = (xNodeErr.offsetTop + 16) + "px";
+            this.xTooltipArrow.style.top = (xNodeErr.offsetTop + 18) + "px";
             this.xTooltipArrow.style.left = (xNodeErr.offsetLeft + Math.floor((xNodeErr.offsetWidth / 2))-4) + "px"; // 4 is half the width of the arrow.
-            this.xTooltip.style.top = (xNodeErr.offsetTop + 20) + "px";
+            this.xTooltip.style.top = (xNodeErr.offsetTop + 22) + "px";
             this.xTooltip.style.left = (xNodeErr.offsetLeft > nLimit) ? nLimit + "px" : xNodeErr.offsetLeft + "px";
             if (xNodeErr.dataset.error_type === "grammar") {
                 // grammar error
                 if (xNodeErr.dataset.gc_message.includes(" ##")) {
                     let n = xNodeErr.dataset.gc_message.indexOf(" ##");