diff --git a/client/package.json b/client/package.json
index e00b46793..4ab009956 100644
--- a/client/package.json
+++ b/client/package.json
@@ -19,6 +19,7 @@
     "firebase": "^7.13.1",
     "graphql": "^14.6.0",
     "i18next": "^19.3.4",
+    "i18next-browser-languagedetector": "^4.1.1",
     "node-sass": "^4.13.1",
     "query-string": "^6.11.1",
     "react": "^16.13.1",
diff --git a/client/src/components/header/header.component.jsx b/client/src/components/header/header.component.jsx
index f1f86a7db..d7d158480 100644
--- a/client/src/components/header/header.component.jsx
+++ b/client/src/components/header/header.component.jsx
@@ -90,13 +90,13 @@ function Header({
                   </span>
                 }
               >
-                <Menu.Item actiontype="lang-select" key="en_us">
+                <Menu.Item actiontype="lang-select" key="en-US">
                   {t("general.languages.english")}
                 </Menu.Item>
-                <Menu.Item actiontype="lang-select" key="fr">
+                <Menu.Item actiontype="lang-select" key="fr-CA">
                   {t("general.languages.french")}
                 </Menu.Item>
-                <Menu.Item actiontype="lang-select" key="es">
+                <Menu.Item actiontype="lang-select" key="es-MX">
                   {t("general.languages.spanish")}
                 </Menu.Item>
               </Menu.SubMenu>
@@ -259,13 +259,13 @@ function Header({
                   </span>
                 }
               >
-                <Menu.Item actiontype="lang-select" key="en_us">
+                <Menu.Item actiontype="lang-select" key="en-US">
                   {t("general.languages.english")}
                 </Menu.Item>
-                <Menu.Item actiontype="lang-select" key="fr">
+                <Menu.Item actiontype="lang-select" key="fr-CA">
                   {t("general.languages.french")}
                 </Menu.Item>
-                <Menu.Item actiontype="lang-select" key="es">
+                <Menu.Item actiontype="lang-select" key="es-MX">
                   {t("general.languages.spanish")}
                 </Menu.Item>
               </Menu.SubMenu>
diff --git a/client/src/redux/user/user.reducer.js b/client/src/redux/user/user.reducer.js
index 4b3897443..880ff98d0 100644
--- a/client/src/redux/user/user.reducer.js
+++ b/client/src/redux/user/user.reducer.js
@@ -3,7 +3,7 @@ import UserActionTypes from "./user.types";
 const INITIAL_STATE = {
   currentUser: {
     authorized: null,
-    language: "en_us"
+    //language: "en-US"
   },
   bodyshop: null,
   error: null
diff --git a/client/src/translations/i18n.js b/client/src/translations/i18n.js
index 3ddd99c33..7415220f1 100644
--- a/client/src/translations/i18n.js
+++ b/client/src/translations/i18n.js
@@ -1,5 +1,6 @@
 import i18n from "i18next";
 import { initReactI18next } from "react-i18next";
+import LanguageDetector from "i18next-browser-languagedetector";
 import en_Translation from "./en_us/common.json";
 import fr_Translation from "./fr/common.json";
 import es_Translation from "./es/common.json";
@@ -7,23 +8,25 @@ import es_Translation from "./es/common.json";
 // the translations
 // (tip move them in a JSON file and import them)
 const resources = {
-  en_us: en_Translation,
-  fr: fr_Translation,
-  es: es_Translation
+  "en-US": en_Translation,
+  "fr-CA": fr_Translation,
+  "es-MX": es_Translation,
 };
 i18n
-  .use(initReactI18next) // passes i18n down to react-i18next
+  .use(initReactI18next)
+  .use(LanguageDetector) // passes i18n down to react-i18next
   .init({
     resources,
-    lng: "en_us",
-    fallbackLng: "en-us",
+    //lng: "en",
+    detection: {},
+    fallbackLng: "en-US",
     debug: true,
 
     //keySeparator: false, // we do not use keys in form messages.welcome
 
     interpolation: {
-      escapeValue: false // react already safes from xss
-    }
+      escapeValue: false, // react already safes from xss
+    },
   });
 
 export default i18n;
diff --git a/client/yarn.lock b/client/yarn.lock
index cd10e4c98..c73622d05 100644
--- a/client/yarn.lock
+++ b/client/yarn.lock
@@ -6670,6 +6670,13 @@ hyphenate-style-name@^1.0.1:
   resolved "https://registry.yarnpkg.com/hyphenate-style-name/-/hyphenate-style-name-1.0.3.tgz#097bb7fa0b8f1a9cf0bd5c734cf95899981a9b48"
   integrity sha512-EcuixamT82oplpoJ2XU4pDtKGWQ7b00CD9f1ug9IaQ3p1bkHMiKCZ9ut9QDI6qsa6cpUuB+A/I+zLtdNK4n2DQ==
 
+i18next-browser-languagedetector@^4.1.1:
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/i18next-browser-languagedetector/-/i18next-browser-languagedetector-4.1.1.tgz#89656cd9b78bb92dc0c7e86c0d9606f3f15fabfa"
+  integrity sha512-akv0zurR/2KU7s1qaWkirY9FEEOT1TNsQaezEg8+1BLLQre7vylqb7tYoUgYqP/0/BEzXJgnoQnj+sh5xYFMhg==
+  dependencies:
+    "@babel/runtime" "^7.5.5"
+
 i18next@^19.3.4:
   version "19.3.4"
   resolved "https://registry.yarnpkg.com/i18next/-/i18next-19.3.4.tgz#512de50ee6075df825c646e1ce646a104f0938c9"