diff --git a/code/button_displayer.js b/code/button_displayer.js
index 366a5a0..d668842 100644
--- a/code/button_displayer.js
+++ b/code/button_displayer.js
@@ -8,6 +8,8 @@ var modeSelected;
 var diffSelected;
 var pauseSelected;
 
+var selectedTheme="selectedDay";
+
 var btn_options=document.getElementById("btn_options");
 btn_options.width=size/2;
 
@@ -23,9 +25,9 @@ modes.forEach(element => {
     {
         disp(e);
         modes.forEach(element => {
-            document.getElementById("img_"+element).classList.remove("selected");
+            document.getElementById("img_"+element).classList.remove(selectedTheme);
         })
-        document.getElementById(e.currentTarget.id).classList.add("selected");
+        document.getElementById(e.currentTarget.id).classList.add(selectedTheme);
     });
 
     var tab=document.getElementById(element).children;
@@ -39,12 +41,12 @@ modes.forEach(element => {
                 var tabChilds=document.getElementById(tab.item(cpt).id).children;
                 for(var cptChild=1;cptChild<tabChilds.length;cptChild+=2)
                 {
-                    tabChilds.item(cptChild).children[0].classList.remove("selected");
+                    tabChilds.item(cptChild).children[0].classList.remove(selectedTheme);
                 }
             }
             modeSelected= e.currentTarget.id.substring(4,e.currentTarget.id.length);
 
-            document.getElementById(e.currentTarget.id).classList.add("selected");
+            document.getElementById(e.currentTarget.id).classList.add(selectedTheme);
             if(diffSelected!="" && modeSelected!="" && pauseSelected!="")
             {
                 document.getElementById(modeSelected).checked=true;
@@ -64,9 +66,9 @@ diffs.forEach(element => {
         var tab=document.getElementById("diff").children;
         for(var cpt=1;cpt<tab.length;cpt+=2)
         {
-            tab.item(cpt).children[0].classList.remove("selected");
+            tab.item(cpt).children[0].classList.remove(selectedTheme);
         }
-        document.getElementById(e.currentTarget.id).classList.add("selected");
+        document.getElementById(e.currentTarget.id).classList.add(selectedTheme);
         if(diffSelected!="" && modeSelected!="" && pauseSelected!="")
         {
             document.getElementById(diffSelected).checked=true;
@@ -84,9 +86,9 @@ pauses.forEach(element => {
         var tab=document.getElementById("diff").children;
         for(var cpt=1;cpt<tab.length;cpt+=2)
         {
-            tab.item(cpt).children[0].classList.remove("selected");
+            tab.item(cpt).children[0].classList.remove(selectedTheme);
         }
-        document.getElementById(e.currentTarget.id).classList.add("selected");
+        document.getElementById(e.currentTarget.id).classList.add(selectedTheme);
         if(diffSelected!="" && modeSelected!="" && pauseSelected!="")
         {
             console.log("pause "+pauseSelected);
@@ -151,6 +153,7 @@ function hideAll()
 function play()
 {
     var pseudo = (getCookie("pseudo")=="" ? prompt("Saisissez votre pseudo", '') : getCookie("pseudo"));
+    setCookie("pause",(document.getElementById("pause_1").checked ? "1" : "0"),30);
     if(pseudo!="")
     {
         setCookie("pseudo",pseudo,30);
@@ -168,10 +171,10 @@ if(document.getElementById("diffSel")!=null)
     gameSelected = (modeSelected.includes("s") ? "survie" : (modeSelected.includes("p") ? "points" : "temps"));
 
     disp(gameSelected, true);
-    document.getElementById("img_"+diffSelected).classList.add("selected");
-    document.getElementById("img_"+gameSelected).classList.add("selected");
-    document.getElementById("img_"+modeSelected).classList.add("selected");
-    document.getElementById("img_pause_"+pauseSelected).classList.add("selected");
+    document.getElementById("img_"+diffSelected).classList.add(selectedTheme);
+    document.getElementById("img_"+gameSelected).classList.add(selectedTheme);
+    document.getElementById("img_"+modeSelected).classList.add(selectedTheme);
+    document.getElementById("img_pause_"+pauseSelected).classList.add(selectedTheme);
 
     document.getElementById(diffSelected).checked=true;
     document.getElementById(modeSelected).checked=true;
@@ -188,10 +191,10 @@ else
     document.getElementById(diffSelected).checked=true;
     document.getElementById(modeSelected).checked=true;
     document.getElementById("pause_"+pauseSelected).checked=true;
-    document.getElementById("img_points").classList.add("selected");
-    document.getElementById("img_5p").classList.add("selected");
-    document.getElementById("img_easy").classList.add("selected");
-    document.getElementById("img_pause_1").classList.add("selected");
+    document.getElementById("img_points").classList.add(selectedTheme);
+    document.getElementById("img_5p").classList.add(selectedTheme);
+    document.getElementById("img_easy").classList.add(selectedTheme);
+    document.getElementById("img_pause_1").classList.add(selectedTheme);
 }
 
 for(var cpt=1;cpt<9;cpt++)
@@ -205,7 +208,6 @@ for(var cpt=1;cpt<9;cpt++)
 function dispDots()
 {
     var amountI = parseInt(amount);
-    console.log(displ);
     if(displ=="points")
     {
         for(var cpt=1;cpt<9;cpt++)
diff --git a/code/index.css b/code/index.css
index a1f185b..959e82a 100644
--- a/code/index.css
+++ b/code/index.css
@@ -40,10 +40,16 @@
     padding: 2px;
 }
 
-.selected {
-    -webkit-box-shadow:inset 0px 0px 0px 5px black;
-    -moz-box-shadow:inset 0px 0px 0px 5px black;
-    box-shadow:inset 0px 0px 0px 5px black;
+.selectedDay {
+  -webkit-box-shadow:inset 0px 0px 0px 5px black;
+  -moz-box-shadow:inset 0px 0px 0px 5px black;
+  box-shadow:inset 0px 0px 0px 5px black;
+}
+
+.selectedNight {
+  -webkit-box-shadow:inset 0px 0px 0px 5px #eee;
+  -moz-box-shadow:inset 0px 0px 0px 5px #eee;
+  box-shadow:inset 0px 0px 0px 5px #eee;
 }
   /* The Modal (background) */
 .modal {
diff --git a/code/index.php b/code/index.php
index e4f6708..db180ef 100644
--- a/code/index.php
+++ b/code/index.php
@@ -199,7 +199,6 @@ if(isset($_POST["game_mode"]) && $_POST["game_mode"]!="" && $_POST["difficulty"]
             </div>
         </div>
         <div id="gems_picker">
-            <div class="texte">Gemmes à afficher</div>
             <img id="gem1" class="gem" draggable="true" ondragstart="drag(event)"/>
             <img id="gem2" class="gem" draggable="true" ondragstart="drag(event)"/>
             <img id="gem3" class="gem" draggable="true" ondragstart="drag(event)"/>
@@ -209,14 +208,15 @@ if(isset($_POST["game_mode"]) && $_POST["game_mode"]!="" && $_POST["difficulty"]
             <img id="gem7" class="gem" draggable="true" ondragstart="drag(event)"/>
             <img id="gem8" class="gem" draggable="true" ondragstart="drag(event)"/>
             <div>
-            <div id="slot1" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
-            <div id="slot2" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
-            <div id="slot3" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
-            <div id="slot4" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
-            <div id="slot5" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
-            <div id="slot6" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
-            <div id="slot7" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
-            <div id="slot8" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
+                <p class="texte">Gemmes à afficher</p>
+            <span id="slot1" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></span>
+            <span id="slot2" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></span>
+            <span id="slot3" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></span>
+            <span id="slot4" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></span>
+            <span id="slot5" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></span>
+            <span id="slot6" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></span>
+            <span id="slot7" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></span>
+            <span id="slot8" class="slot" ondrop="drop(event)" ondragover="allowDrop(event)"></span>
             <img id="resetGems2" onClick="resetGems()" src="ress/reset"/>
             </div>
         </div>
diff --git a/code/options.js b/code/options.js
index 5edee23..856b7a5 100644
--- a/code/options.js
+++ b/code/options.js
@@ -114,13 +114,29 @@ for(var cpt=1;cpt<9;cpt++)
         document.getElementById("col`+cpt+`").style.background=pickr`+cpt+`.getSelectedColor().toHEXA().toString();
     }).on('save', function () {
         document.getElementById("col`+cpt+`").style.background=pickr`+cpt+`.getColor().toHEXA().toString();
-        setCookie("color_`+cpt+`",pickr`+cpt+`.getColor().toHEXA().toString(),30);
+        colorBake();
         pickr`+cpt+`.hide();
         dispDots();
     });`);
     
 }
 
+function colorBake()
+{
+    for(var cpt=1;cpt<9;cpt++)
+    {
+        setCookie("color_"+cpt,eval("pickr"+cpt+".getColor().toHEXA().toString()"),30);
+    }
+}
+
+function gemBake()
+{
+    for(var cpt=1;cpt<9;cpt++)
+    {
+        setCookie("gem"+cpt,eval("gem"+cpt).src.substring(document.getElementById("gem"+cpt).src.search("/ress")+6),30);
+    }
+}
+
 function allowDrop(ev) {
     ev.preventDefault();
 }
@@ -141,10 +157,25 @@ function drop(ev) {
         [gemsSelected[dragFrom.id.substring(4)-1],gemsSelected[ev.currentTarget.id.substring(4)-1]]=[gemsSelected[ev.currentTarget.id.substring(4)-1],gemsSelected[dragFrom.id.substring(4)-1]];
         dragFrom.appendChild(ev.currentTarget.firstChild);
         ev.currentTarget.appendChild(dragFrom.firstChild);
-        
-        setCookie("gem"+ev.currentTarget.id.substring(4),ev.currentTarget.firstChild.src.substring(document.getElementById(data).src.search("/ress")+6),30);
-        setCookie("gem"+dragFrom.id.substring(4),dragFrom.firstChild.src.substring(document.getElementById(data).src.search("/ress")+6),30);
-        
+        if(displ=="both")
+        {/*
+            var target = document.getElementById("slot"+dragFrom.id.substring(4));
+            target.style.backgroundColor=target.children[0].src.substring(target.children[0].src.search("/ress")+6);
+
+            target = document.getElementById("slot"+ev.currentTarget.id.substring(4));
+            target.style.backgroundColor=target.children[0].src.substring(target.children[0].src.search("/ress")+6);*/
+            applyBackgrounds();
+        }
+        gemBake();
+    }
+}
+
+function applyBackgrounds()
+{
+    for(var cpt=1;cpt<9;cpt++)
+    {
+        var target = document.getElementById("slot"+cpt);
+        target.style.backgroundColor=target.children[0].src.substring(target.children[0].src.search("/ress")+6);
     }
 }
 
@@ -179,4 +210,8 @@ function resetGems()
         setCookie("gem"+cpt,"",30);
         document.getElementById("slot"+cpt).appendChild(eval("gemIcon_"+gemsAvailable[cpt-1]));
     }
+    if(displ=="both")
+    {
+        applyBackgrounds();
+    }
 }
\ No newline at end of file
diff --git a/code/selecteur.js b/code/selecteur.js
index d11687d..fa341aa 100644
--- a/code/selecteur.js
+++ b/code/selecteur.js
@@ -20,23 +20,27 @@ if(document.getElementById("canvasR")!=null)
     document.getElementById("canvasR").style.display="none";
     document.getElementById("reserveText").style.display="none";
 }
-if (get['mode'].includes('p'))
+if(document.getElementById("canvasTotal")!=null)
 {
-    objPts=get['mode'].substring(0,get['mode'].length-1);
-    document.getElementById("timer").style.display="none";
-}
-else if(get['mode'].includes('m'))
-{
-    objPts=null;
-    tpsRem=[0,parseInt(get['mode'].substring(0,get['mode'].length-1),10),0];
-    document.getElementById("chronotime").style.display="none";
-}
-else if(get['mode'].includes('s'))
-{
-    objPts=null;
-    tpsRem=[0,1,0];
-    document.getElementById("chronotime").style.display="none";
+	if (get['mode'].includes('p'))
+	{
+		objPts=get['mode'].substring(0,get['mode'].length-1);
+		document.getElementById("timer").style.display="none";
+	}
+	else if(get['mode'].includes('m'))
+	{
+		objPts=null;
+		tpsRem=[0,parseInt(get['mode'].substring(0,get['mode'].length-1),10),0];
+		document.getElementById("chronotime").style.display="none";
+	}
+	else if(get['mode'].includes('s'))
+	{
+		objPts=null;
+		tpsRem=[0,1,0];
+		document.getElementById("chronotime").style.display="none";
+	}
 }
 
+
 difficulty=get["diff"];
 console.log("difficulté = "+difficulty+" mode:"+get['mode']);
\ No newline at end of file
diff --git a/code/themeSwitcher.js b/code/themeSwitcher.js
index 33cc3e3..0d31a4f 100644
--- a/code/themeSwitcher.js
+++ b/code/themeSwitcher.js
@@ -1,4 +1,5 @@
 var light= (getCookie("light")=="" ? true : getCookie("light"));
+selectedTheme = "selected"+(light=="true" ? "Day" : "Night");
 
 document.getElementById("light").width=size/4;
 
@@ -34,6 +35,17 @@ function applyLight(li) {
     
     document.getElementsByTagName("body")[0].classList.add((li=="true" ? "day" : "night"));
     document.getElementsByTagName("body")[0].classList.remove((li=="true" ? "night" : "day"));
+
+    var all = document.getElementsByClassName('selected'+(li!="true" ? "Day" : "Night"));
+    console.log('selected'+(li=="true" ? "Day" : "Night"));
+    
+    selectedTheme = "selected"+(li=="true" ? "Day" : "Night");
+    for (var cpt = 0; cpt < all.length; cpt++) {
+        var el=all[cpt];
+        el.classList.remove('selected'+(li!="true" ? "Day" : "Night"));
+        el.classList.add('selected'+(li=="true" ? "Day" : "Night"));
+        console.log(el.id+ " : " + el.classList);
+    }
 }
 
 applyLight(light);
\ No newline at end of file