diff --git a/src/app/__tests__/__snapshots__/App.tsx.snap b/src/app/__tests__/__snapshots__/App.tsx.snap
index 64b5982..90c3d5a 100644
--- a/src/app/__tests__/__snapshots__/App.tsx.snap
+++ b/src/app/__tests__/__snapshots__/App.tsx.snap
@@ -2,7 +2,7 @@
 
 exports[`<App /> renders 1`] = `
 <div
-  className="App"
+  className="app"
 >
   <a
     className="header"
diff --git a/src/app/index.tsx b/src/app/index.tsx
index d93cc71..5cf734e 100755
--- a/src/app/index.tsx
+++ b/src/app/index.tsx
@@ -15,7 +15,7 @@ interface Route {
 }
 
 const App = ({ route }: Route): JSX.Element => (
-    <div className={styles.App}>
+    <div className={styles.app}>
         <Helmet {...config.APP} />
         <Link to="/" className={styles.header}>
             <img src={logo} alt="Logo" role="presentation" />
diff --git a/src/app/styles.module.scss b/src/app/styles.module.scss
index 0315e6b..725e368 100755
--- a/src/app/styles.module.scss
+++ b/src/app/styles.module.scss
@@ -5,21 +5,13 @@ body {
     font-family: "Helvetica-Light", Helvetica, Arial, sans-serif;
 }
 
-.App {
+.app {
     color: $color-white;
 
-    .header {
-        color: inherit;
-        display: block;
-        overflow: auto;
-        padding: 15px;
-        text-decoration: none;
-
-        img {
-            float: left;
-            height: 70px;
-            margin-right: 1em;
-        }
+    img {
+        float: left;
+        height: 70px;
+        margin-right: 1em;
     }
 
     hr {
@@ -28,3 +20,11 @@ body {
         opacity: 0.15;
     }
 }
+
+.header {
+    color: inherit;
+    display: block;
+    overflow: auto;
+    padding: 15px;
+    text-decoration: none;
+}
diff --git a/src/components/AddEnvie/styles.module.scss b/src/components/AddEnvie/styles.module.scss
index ee7f04a..e03c513 100644
--- a/src/components/AddEnvie/styles.module.scss
+++ b/src/components/AddEnvie/styles.module.scss
@@ -5,10 +5,10 @@
 
     ul {
         padding-left: 17px;
+    }
 
-        li {
-            margin-bottom: 0.5em;
-        }
+    li {
+        margin-bottom: 0.5em;
     }
 
     a {
diff --git a/src/components/JeuJavList/styles.module.scss b/src/components/JeuJavList/styles.module.scss
index ee7f04a..e03c513 100644
--- a/src/components/JeuJavList/styles.module.scss
+++ b/src/components/JeuJavList/styles.module.scss
@@ -5,10 +5,10 @@
 
     ul {
         padding-left: 17px;
+    }
 
-        li {
-            margin-bottom: 0.5em;
-        }
+    li {
+        margin-bottom: 0.5em;
     }
 
     a {
diff --git a/src/components/Loading/__tests__/__snapshots__/Loading.tsx.snap b/src/components/Loading/__tests__/__snapshots__/Loading.tsx.snap
index e10a78e..e4399dc 100644
--- a/src/components/Loading/__tests__/__snapshots__/Loading.tsx.snap
+++ b/src/components/Loading/__tests__/__snapshots__/Loading.tsx.snap
@@ -2,7 +2,7 @@
 
 exports[`<Loading /> renders 1`] = `
 <div
-  class="Loading"
+  class="loading"
 >
   <p>
     Loading...
diff --git a/src/components/Loading/index.tsx b/src/components/Loading/index.tsx
index e4b9fa6..8577986 100755
--- a/src/components/Loading/index.tsx
+++ b/src/components/Loading/index.tsx
@@ -1,7 +1,7 @@
 import styles from "./styles.module.scss"
 
 const Loading = (): JSX.Element => (
-    <div className={styles.Loading}>
+    <div className={styles.loading}>
         <p>Loading...</p>
     </div>
 )
diff --git a/src/components/Loading/styles.module.scss b/src/components/Loading/styles.module.scss
index b398772..dad6478 100755
--- a/src/components/Loading/styles.module.scss
+++ b/src/components/Loading/styles.module.scss
@@ -1,3 +1,3 @@
-.Loading {
+.loading {
     padding: 0 15px;
 }
diff --git a/src/components/MembreInfo/styles.module.scss b/src/components/MembreInfo/styles.module.scss
index d3a8829..015aa11 100755
--- a/src/components/MembreInfo/styles.module.scss
+++ b/src/components/MembreInfo/styles.module.scss
@@ -1,9 +1,9 @@
 .membre-card {
     ul {
         padding-left: 17px;
+    }
 
-        li {
-            margin-bottom: 0.5em;
-        }
+    li {
+        margin-bottom: 0.5em;
     }
 }
diff --git a/src/components/MembreList/__tests__/__snapshots__/MembreList.tsx.snap b/src/components/MembreList/__tests__/__snapshots__/MembreList.tsx.snap
index 20010c7..b48b05f 100644
--- a/src/components/MembreList/__tests__/__snapshots__/MembreList.tsx.snap
+++ b/src/components/MembreList/__tests__/__snapshots__/MembreList.tsx.snap
@@ -2,7 +2,7 @@
 
 exports[`<MembreList /> renders 1`] = `
 <div
-  class="MembreList"
+  class="user-list"
 >
   <h4>
     Membre List
diff --git a/src/components/MembreList/index.tsx b/src/components/MembreList/index.tsx
index ab6376a..130f043 100755
--- a/src/components/MembreList/index.tsx
+++ b/src/components/MembreList/index.tsx
@@ -9,7 +9,7 @@ interface Props {
 }
 
 const MembreList = ({ items }: Props) => (
-    <div className={styles.MembreList}>
+    <div className={styles["user-list"]}>
         <h4>Membre List</h4>
         <ul>
             {items.map(({ id, nom, prenom }) => (
diff --git a/src/components/MembreList/styles.module.scss b/src/components/MembreList/styles.module.scss
index 916be1d..7fbac1c 100755
--- a/src/components/MembreList/styles.module.scss
+++ b/src/components/MembreList/styles.module.scss
@@ -1,14 +1,14 @@
 @import "../../theme/variables";
 
-.UserList {
+.user-list {
     color: $color-white;
 
     ul {
         padding-left: 17px;
+    }
 
-        li {
-            margin-bottom: 0.5em;
-        }
+    li {
+        margin-bottom: 0.5em;
     }
 
     a {
diff --git a/src/components/MembreSet/styles.module.scss b/src/components/MembreSet/styles.module.scss
index ee7f04a..e03c513 100644
--- a/src/components/MembreSet/styles.module.scss
+++ b/src/components/MembreSet/styles.module.scss
@@ -5,10 +5,10 @@
 
     ul {
         padding-left: 17px;
+    }
 
-        li {
-            margin-bottom: 0.5em;
-        }
+    li {
+        margin-bottom: 0.5em;
     }
 
     a {
diff --git a/src/pages/Home/Home.tsx b/src/pages/Home/Home.tsx
index 2e10a43..310eb97 100755
--- a/src/pages/Home/Home.tsx
+++ b/src/pages/Home/Home.tsx
@@ -37,7 +37,7 @@ function useList<Entity>(
 const Home: FC<Props> = (): JSX.Element => {
     const dispatch = useDispatch()
     return (
-        <div className={styles.Home}>
+        <div className={styles.home}>
             <Helmet title="Home" />
             <AddEnvie dispatch={dispatch} />
             {/* {useList((state: AppState) => state.envieList, fetchEnvieListifNeed)()} */}
diff --git a/src/pages/Home/__tests__/__snapshots__/Home.tsx.snap b/src/pages/Home/__tests__/__snapshots__/Home.tsx.snap
index 6a2e376..688463e 100644
--- a/src/pages/Home/__tests__/__snapshots__/Home.tsx.snap
+++ b/src/pages/Home/__tests__/__snapshots__/Home.tsx.snap
@@ -2,7 +2,7 @@
 
 exports[`<Home /> renders an error if loading failed 1`] = `
 <div
-  class="Home"
+  class="home"
 >
   <section
     class="EnvieList"
@@ -77,7 +77,7 @@ exports[`<Home /> renders an error if loading failed 1`] = `
 
 exports[`<Home /> renders the <List /> if loading was successful 1`] = `
 <div
-  class="Home"
+  class="home"
 >
   <section
     class="EnvieList"
@@ -164,7 +164,7 @@ exports[`<Home /> renders the <List /> if loading was successful 1`] = `
 
 exports[`<Home /> renders the loading status if data invalid 1`] = `
 <div
-  class="Home"
+  class="home"
 >
   <section
     class="EnvieList"
@@ -239,7 +239,7 @@ exports[`<Home /> renders the loading status if data invalid 1`] = `
 
 exports[`<Home /> renders the loading status if requesting data 1`] = `
 <div
-  class="Home"
+  class="home"
 >
   <section
     class="EnvieList"
diff --git a/src/pages/Home/styles.module.scss b/src/pages/Home/styles.module.scss
index e10d1ce..a38c8cf 100755
--- a/src/pages/Home/styles.module.scss
+++ b/src/pages/Home/styles.module.scss
@@ -1,3 +1,3 @@
-.Home {
+.home {
     padding: 0 15px;
 }
diff --git a/src/pages/MembrePage/MembrePage.tsx b/src/pages/MembrePage/MembrePage.tsx
index bbd1642..b79d2e0 100755
--- a/src/pages/MembrePage/MembrePage.tsx
+++ b/src/pages/MembrePage/MembrePage.tsx
@@ -37,7 +37,7 @@ const MembrePage = ({ match }: Props): JSX.Element => {
     }
 
     return (
-        <div className={styles.Membre}>
+        <div className={styles.membre}>
             <Helmet title="User Info" />
             {renderInfo()}
         </div>
diff --git a/src/pages/MembrePage/__tests__/__snapshots__/MembrePage.tsx.snap b/src/pages/MembrePage/__tests__/__snapshots__/MembrePage.tsx.snap
index 2a37f8c..9b5121d 100644
--- a/src/pages/MembrePage/__tests__/__snapshots__/MembrePage.tsx.snap
+++ b/src/pages/MembrePage/__tests__/__snapshots__/MembrePage.tsx.snap
@@ -2,7 +2,7 @@
 
 exports[`<MembrePage /> renders an error if loading failed 1`] = `
 <div
-  class="Membre"
+  class="membre"
 >
   <p>
     Oops! Failed to load data.
@@ -12,7 +12,7 @@ exports[`<MembrePage /> renders an error if loading failed 1`] = `
 
 exports[`<MembrePage /> renders the <Info /> if loading was successful 1`] = `
 <div
-  class="Membre"
+  class="membre"
 >
   <div>
     <div
@@ -85,7 +85,7 @@ exports[`<MembrePage /> renders the <Info /> if loading was successful 1`] = `
 
 exports[`<MembrePage /> renders the loading status if data invalid 1`] = `
 <div
-  class="Membre"
+  class="membre"
 >
   <p>
     Oops! Failed to load data.
@@ -95,7 +95,7 @@ exports[`<MembrePage /> renders the loading status if data invalid 1`] = `
 
 exports[`<MembrePage /> renders the loading status if requesting data 1`] = `
 <div
-  class="Membre"
+  class="membre"
 >
   <p>
     Loading...
diff --git a/src/pages/MembrePage/styles.module.scss b/src/pages/MembrePage/styles.module.scss
index dee30cc..0dbe1be 100755
--- a/src/pages/MembrePage/styles.module.scss
+++ b/src/pages/MembrePage/styles.module.scss
@@ -1,3 +1,3 @@
-.Membre {
+.membre {
     padding: 0 15px;
 }
diff --git a/src/pages/NotFound/__tests__/__snapshots__/NotFound.tsx.snap b/src/pages/NotFound/__tests__/__snapshots__/NotFound.tsx.snap
index e0c5951..7cf9370 100644
--- a/src/pages/NotFound/__tests__/__snapshots__/NotFound.tsx.snap
+++ b/src/pages/NotFound/__tests__/__snapshots__/NotFound.tsx.snap
@@ -2,7 +2,7 @@
 
 exports[`<NotFound /> renders 1`] = `
 <div
-  class="NotFound"
+  class="not-found"
 >
   <p>
     Oops, Page was not found!
diff --git a/src/pages/NotFound/index.tsx b/src/pages/NotFound/index.tsx
index 70ce81b..73b09e3 100755
--- a/src/pages/NotFound/index.tsx
+++ b/src/pages/NotFound/index.tsx
@@ -13,7 +13,7 @@ const NotFound = ({ staticContext }: Props) => {
     if (staticContext) staticContext.statusCode = 404
 
     return (
-        <div className={styles.NotFound}>
+        <div className={styles["not-found"]}>
             <Helmet title="Oops" />
             <p>Oops, Page was not found!</p>
         </div>
diff --git a/src/pages/NotFound/styles.module.scss b/src/pages/NotFound/styles.module.scss
index d850c6c..6eba38d 100755
--- a/src/pages/NotFound/styles.module.scss
+++ b/src/pages/NotFound/styles.module.scss
@@ -1,3 +1,3 @@
-.NotFound {
+.not-found {
     padding: 0 15px;
 }