diff --git a/frontend/src/lib/components/flag-component.svelte b/frontend/src/lib/components/flag-component.svelte
index cfbfa88..5c49ded 100644
--- a/frontend/src/lib/components/flag-component.svelte
+++ b/frontend/src/lib/components/flag-component.svelte
@@ -13,6 +13,6 @@
     </div>
     <div class="flag-text">
         <p>{lang}</p>
-        <p><span class="flag-bold">Level: </span>{level}</p>
+        <p>{level}</p>
     </div>
 </div>
diff --git a/frontend/src/lib/components/pill.svelte b/frontend/src/lib/components/pill.svelte
index 3d2a648..3cf1980 100644
--- a/frontend/src/lib/components/pill.svelte
+++ b/frontend/src/lib/components/pill.svelte
@@ -38,6 +38,7 @@
   let pill_tooltip;
   let main_pill;
   let pill_hitbox;
+  let pill_notification;
 
   // constants and variables
   let innerWidth;
@@ -115,9 +116,18 @@
     }
   }
 
+  function calculateNotification() {
+    // 19 is arbitrary, based on the pill-notification width (which is around 25.6 px) minus a constant
+    pill_notification.style.left = `${
+      main_pill.offsetLeft + main_pill.clientWidth - 19
+    }px`;
+    pill_notification.style.top = `${main_pill.offsetTop}px`;
+  }
+
   onMount(async () => {
     calculateOffsetUp();
     calculateHitbox();
+    calculateNotification();
   });
 </script>
 
@@ -128,6 +138,7 @@
     calculateOffsetUp();
     calculateHitbox();
     calculateOutOfBounds();
+    calculateNotification();
   }}
 />
 
@@ -151,17 +162,26 @@
           <div>
             <span>{td.title}</span>
             {#if td.project_id != null}
-            <div class="pill-last">
-              <button
-                class="pill-view"
-                on:click={() => showPopup(true, td.project_id)}
-                ><SvgIcon size="20" path={mdiPlus} type="mdi" /></button
-              >
-            </div>
+              <div class="pill-last">
+                <button
+                  class="pill-view"
+                  on:click={() => showPopup(true, td.project_id)}
+                  ><SvgIcon size="20" path={mdiPlus} type="mdi" /></button
+                >
+              </div>
             {/if}
           </div>
         {/each}
       </div>
+      <div
+        class={white
+          ? "pill-notification pill-white"
+          : "pill-notification pill-black"}
+        {style}
+        bind:this={pill_notification}
+      >
+        {tooltip_data.length}
+      </div>
     {/if}
     {#if type_icon === "simpleicons"}
       <img
diff --git a/frontend/src/lib/components/projects.svelte b/frontend/src/lib/components/projects.svelte
index 4b9189a..b01bca6 100644
--- a/frontend/src/lib/components/projects.svelte
+++ b/frontend/src/lib/components/projects.svelte
@@ -1,12 +1,18 @@
 <script>
   import { onMount } from "svelte";
   import SvgIcon from "@jamescoyle/svelte-icon";
-  import { mdiCalendarRange, mdiPlus, mdiAccount, mdiSchool } from "@mdi/js";
+  import {
+    mdiCalendarRange,
+    mdiBookOpenVariant,
+    mdiAccount,
+    mdiSchool,
+  } from "@mdi/js";
   import "$lib/css/slide.css";
   import { formatMonth } from "$lib/js/date.js";
   import { showPopup, popupDatas } from "$lib/js/popup.js";
 
   export let active = false;
+  export let text;
   export let data;
   export let max = 0;
   export let actualnum = 0;
@@ -64,9 +70,9 @@
       </div>
       <div class="slide-button-container">
         <button class="slide-button" on:click={() => showPopup(true, data.id)}>
-          <SvgIcon size="20" path={mdiPlus} type="mdi" />
-          More</button
-        >
+          <SvgIcon size="20" path={mdiBookOpenVariant} type="mdi" />
+          <p class="slide-aftericon slide-button-text">{text.projects_read}</p>
+        </button>
       </div>
     </div>
   </div>
diff --git a/frontend/src/lib/components/section.svelte b/frontend/src/lib/components/section.svelte
index 3e22f59..552ab97 100644
--- a/frontend/src/lib/components/section.svelte
+++ b/frontend/src/lib/components/section.svelte
@@ -8,6 +8,6 @@
 </script>
 
 <div class="section-container">
-    <SvgIcon size="60" path={icon} type="mdi" />
+    <SvgIcon size="45" path={icon} type="mdi" />
     <h1 class="section-h1">{title}</h1>
 </div>
diff --git a/frontend/src/lib/components/slideshow.svelte b/frontend/src/lib/components/slideshow.svelte
index 5ee6976..a73071f 100644
--- a/frontend/src/lib/components/slideshow.svelte
+++ b/frontend/src/lib/components/slideshow.svelte
@@ -14,6 +14,7 @@
 
   // Exported values
   export let data = [];
+  export let text = null;
   export let type;
   export let timeline = false;
   export let reverse = false;
@@ -220,12 +221,14 @@
         active={index == slideshow_index ? true : false}
         max={data.length}
         actualnum={index + 1}
+        {text}
       />
     {:else}
       <svelte:component
         this={type}
         data={selected_data}
         active={index == slideshow_index ? true : false}
+        {text}
       />
     {/if}
   {/each}
diff --git a/frontend/src/lib/components/subsection.svelte b/frontend/src/lib/components/subsection.svelte
index cd7b62a..4c6573d 100644
--- a/frontend/src/lib/components/subsection.svelte
+++ b/frontend/src/lib/components/subsection.svelte
@@ -8,6 +8,6 @@
 </script>
 
 <div class="subsection-container">
-    <SvgIcon size="40" path={icon} type="mdi" />
+    <SvgIcon size="30" path={icon} type="mdi" />
     <h1 class="section-h2">{title}</h1>
 </div>
diff --git a/frontend/src/lib/css/cv.css b/frontend/src/lib/css/cv.css
index 5f9c772..6425ef6 100644
--- a/frontend/src/lib/css/cv.css
+++ b/frontend/src/lib/css/cv.css
@@ -7,16 +7,7 @@
     #topbar {
         display: none;
     }
-}
 
-@media screen and (max-width: 1200px) {
-    .container-cv {
-        display: flex;
-        flex-direction: column;
-    }
-}
-
-@media screen and (min-width: 1000px) {
     .name {
         text-align: center;
         text-shadow: -15px 5px 20px #00000030;
@@ -89,7 +80,13 @@
     }
 }
 
-@media screen and (max-width: 1000px) {
+@media screen and (max-width: 1200px) {
+    .container-cv {
+        display: flex;
+        flex-direction: column;
+    }
+
+
     #topbar {
         width: 100%;
         position: fixed;
@@ -167,6 +164,10 @@
         font-size: 1.5rem;
         font-weight: 100;
         transition: all .3s ease 0s;
+        overflow: hidden;
+        display: -webkit-box;
+        -webkit-box-orient: vertical;
+        -webkit-line-clamp: 1;
     }
 
     .name {
@@ -191,7 +192,7 @@
 
     .footer>div {
         padding-top: 2rem;
-        padding-bottom: 2rem;
+        padding-bottom: 1rem;
     }
 
     .footer-mobile-btn {
diff --git a/frontend/src/lib/css/flag.css b/frontend/src/lib/css/flag.css
index 23691eb..4bf0fd0 100644
--- a/frontend/src/lib/css/flag.css
+++ b/frontend/src/lib/css/flag.css
@@ -1,4 +1,4 @@
-@media screen and (min-width: 1000px) {
+@media screen and (min-width: 1200px) {
     .flag-main {
         display: flex;
         border-radius: 0.4rem;
@@ -12,13 +12,9 @@
         justify-content: center;
         align-items: center;
     }
-
-    .flag-text p {
-        margin: 0.5rem;
-    }
 }
 
-@media screen and (max-width: 1000px) {
+@media screen and (max-width: 1200px) {
     .flag-main {
         display: flex;
         border-radius: 0.4rem;
@@ -28,7 +24,6 @@
         margin-top: 1rem;
         padding: 1rem;
         transition: all .3s ease 0s;
-        justify-content: center;
         align-items: center;
         width: 100%;
     }
@@ -37,11 +32,11 @@
         margin-left: 10vw !important;
         margin-right: 10vw;
     }
+}
 
-    .flag-text p {
-        margin: 0.5rem;
-        font-size: 1.25rem;
-    }
+.flag-text p {
+    margin: 0.5rem;
+    font-size: 1.25rem;
 }
 
 .flag-img {
diff --git a/frontend/src/lib/css/markdown.css b/frontend/src/lib/css/markdown.css
index d4e492b..a207703 100644
--- a/frontend/src/lib/css/markdown.css
+++ b/frontend/src/lib/css/markdown.css
@@ -127,7 +127,7 @@ li {
     border-right: none;
 }
 
-@media screen and (min-width: 1000px) {
+@media screen and (min-width: 1200px) {
     .markdown img {
         max-height: 16rem;
         max-width: 40dvh;
@@ -137,7 +137,7 @@ li {
     }
 }
 
-@media screen and (max-width: 1000px) {
+@media screen and (max-width: 1200px) {
     .markdown img {
         max-width: 76dvw;
         max-height: 100%;
diff --git a/frontend/src/lib/css/pill.css b/frontend/src/lib/css/pill.css
index 182ad8f..514731b 100644
--- a/frontend/src/lib/css/pill.css
+++ b/frontend/src/lib/css/pill.css
@@ -140,4 +140,15 @@
 .pill-arrow-down {
     transform: translateY(2.2rem);
     border-bottom: 20px solid var(--color-background);
+}
+
+.pill-notification {
+    border-radius: 50%;
+    width: 1.6rem;
+    height: 1.6rem;
+    justify-content: center;
+    align-items: center;
+    display: flex;
+    position: absolute;
+    box-shadow: 0px 8px 18px -1px #011e3164 !important;
 }
\ No newline at end of file
diff --git a/frontend/src/lib/css/section.css b/frontend/src/lib/css/section.css
index f8409d1..513714c 100644
--- a/frontend/src/lib/css/section.css
+++ b/frontend/src/lib/css/section.css
@@ -1,4 +1,4 @@
-@media screen and (min-width: 1000px)
+@media screen and (min-width: 1200px)
 {
     .section-container {
         margin-top: 3rem;
@@ -23,6 +23,7 @@
     .section-h1 {
         margin-left: 2rem;
         font-size: 2.5rem;
+        font-family: 'Gabarito', sans-serif !important;
     }
     
     .section-h2 {
@@ -32,7 +33,7 @@
     }
 }
 
-@media screen and (max-width: 1000px)
+@media screen and (max-width: 1200px)
 {
     .section-container {
         margin-top: 2rem;
@@ -58,6 +59,7 @@
     .section-h1 {
         margin-left: 0.5rem;
         font-size: clamp(1.5rem, 8vh, 2.5rem);
+        font-family: 'Gabarito', sans-serif !important;
     }
     
     .section-h2 {
diff --git a/frontend/src/lib/css/sidebar-component.css b/frontend/src/lib/css/sidebar-component.css
index 4b1266f..c520256 100644
--- a/frontend/src/lib/css/sidebar-component.css
+++ b/frontend/src/lib/css/sidebar-component.css
@@ -1,9 +1,7 @@
-@media screen and (max-width: 1000px) {
+@media screen and (max-width: 1200px) {
     .sc-description-little {
-
-        margin-left: 3rem !important;
-        margin-right: 3rem !important;
-
+        margin-left: 6dvh !important;
+        margin-right: 6dvh !important;
     }
 }
 
diff --git a/frontend/src/lib/css/slide.css b/frontend/src/lib/css/slide.css
index 128579d..46a8a81 100644
--- a/frontend/src/lib/css/slide.css
+++ b/frontend/src/lib/css/slide.css
@@ -1,4 +1,4 @@
-@media screen and (min-width: 1000px) {
+@media screen and (min-width: 1200px) {
     .slide-container {
         display: flex;
         flex-direction: column;
@@ -42,6 +42,7 @@
         font-weight: 600;
         font-size: 2rem;
         margin-bottom: 0.5rem;
+        margin-top: 0;
     }
 
     /* Any Subtitle */
@@ -113,14 +114,14 @@
         transition: all .3s ease 0s;
     }
 
-/* Date text */
-.slide-date {
-    color: var(--color-special);
-    font-weight: 700;
-}
+    /* Date text */
+    .slide-date {
+        color: var(--color-special);
+        font-weight: 700;
+    }
 }
 
-@media screen and (max-width: 1000px) {
+@media screen and (max-width: 1200px) {
     .slide-container {
         display: flex;
         flex-direction: column;
@@ -169,6 +170,7 @@
         font-weight: 600;
         font-size: 1.8rem;
         margin-bottom: 0;
+        margin-top: 0;
     }
 
     /* Any Subtitle */
@@ -241,12 +243,16 @@
         transition: all .3s ease 0s;
     }
 
-/* Date text */
-.slide-date {
-    color: var(--color-special);
-    font-weight: 700;
-    font-size: 1.25rem;
-}
+    /* Date text */
+    .slide-date {
+        color: var(--color-special);
+        font-weight: 700;
+        font-size: 1.25rem;
+    }
+
+    .slide-overflow-title {
+        font-size: clamp(1rem, 2vh, 1.9rem);
+    }
 }
 
 .slide-overflow {
@@ -325,4 +331,11 @@
     font-family: 'Urbanist', sans-serif;
     font-weight: 700;
     box-shadow: 0px 8px 18px -1px #261C2C60;
+    padding-top: 0.8rem;
+    padding-bottom: 0.8rem;
+}
+
+.slide-button-text {
+    margin-top: 0.4rem;
+    margin-bottom: 0.4rem;
 }
\ No newline at end of file
diff --git a/frontend/src/lib/css/slideshow.css b/frontend/src/lib/css/slideshow.css
index 0a836ea..8c7deea 100644
--- a/frontend/src/lib/css/slideshow.css
+++ b/frontend/src/lib/css/slideshow.css
@@ -5,7 +5,7 @@
     position: relative;
 }
 
-@media screen and (min-width: 1000px) {
+@media screen and (min-width: 1200px) {
     .slideshow_btn {
         z-index: 2;
         position: absolute;
@@ -40,7 +40,7 @@
     }
 }
 
-@media screen and (max-width: 1000px) {
+@media screen and (max-width: 1200px) {
     .slideshow_btn {
         z-index: 2;
         position: absolute;
diff --git a/frontend/src/lib/lang/en.json b/frontend/src/lib/lang/en.json
index 99bdfe3..ea07bbe 100644
--- a/frontend/src/lib/lang/en.json
+++ b/frontend/src/lib/lang/en.json
@@ -1,6 +1,6 @@
 {
     "education": "Education",
-    "experience": "Experience",
+    "experience": "Experiences",
     "projects": "Projects",
     "skills": "Skills",
     "programming_languages": "Programming Languages",
@@ -14,7 +14,7 @@
     "lang": "Language",
     "madewith": "Made with",
     "usingsvelte": "using Svelte",
-    "copyright": "All rights reserved, Yohan Boujon",
+    "copyright": "All rights reserved • Yohan Boujon",
     "github": "Github Repo",
 
     "popup_school": "School",
@@ -26,6 +26,8 @@
     "popup_dl_arc": "Download Archive",
     "popup_dl_rep": "See Report",
 
+    "projects_read": "Read more",
+
     "backend": "This backend",
     "frontend": "This website"
   }
\ No newline at end of file
diff --git a/frontend/src/lib/lang/fr.json b/frontend/src/lib/lang/fr.json
index 40c16c4..cabca2c 100644
--- a/frontend/src/lib/lang/fr.json
+++ b/frontend/src/lib/lang/fr.json
@@ -1,6 +1,6 @@
 {
-    "education": "Éducation",
-    "experience": "Expérience",
+    "education": "Formation",
+    "experience": "Expériences",
     "projects": "Projets",
     "skills": "Compétences",
     "programming_languages": "Langages de programmation",
@@ -14,7 +14,7 @@
     "lang": "Langage",
     "madewith": "Fait avec",
     "usingsvelte": "à l'aide de Svelte",
-    "copyright": "Tous droits réservés, Yohan Boujon",
+    "copyright": "Tous droits réservés • Yohan Boujon",
     "github": "Lien Github",
 
     "popup_school": "École",
@@ -26,6 +26,8 @@
     "popup_dl_arc": "Archive ZIP",
     "popup_dl_rep": "Voir le Rapport",
 
+    "projects_read": "Lire plus",
+
     "backend": "Ce serveur",
     "frontend": "Ce site web"
   }
\ No newline at end of file
diff --git a/frontend/src/routes/lang=[lang]/+page.svelte b/frontend/src/routes/lang=[lang]/+page.svelte
index 16e823f..2e61648 100644
--- a/frontend/src/routes/lang=[lang]/+page.svelte
+++ b/frontend/src/routes/lang=[lang]/+page.svelte
@@ -88,6 +88,11 @@
       mobileTopBar();
     }
   }}
+  on:resize={() => {
+    if (innerWidth < 1200) {
+      mobileTopBar();
+    }
+  }}
 />
 
 {#if data.status == 0}
@@ -102,7 +107,7 @@
       <Sidebar info={cv.info} {footer} {containerCv} {text} />
     {/if}
     <!-- MOBILE TOP BAR -->
-    {#if innerWidth < 1000}
+    {#if innerWidth < 1200}
       <div id="topbar" bind:this={topbar}>
         <button
           class={scrollY <= 53
@@ -115,14 +120,12 @@
             <SvgIcon size="23" path={mdiAccount} type="mdi" />
           {/if}
         </button>
-
         <button
           class={scrollY <= 53 ? "none" : "topbar-button"}
           on:click={() => (window.location.href = `/lang=${otherlang}`)}
         >
           <span class={`fi fi-${flag} flag-little`}></span>
         </button>
-
         <h1 class={scrollY <= 53 ? "topbar-name" : "topbar-name-little"}>
           {cv.info.full_name}
         </h1>
@@ -131,7 +134,7 @@
     {/if}
     <!-- MAIN DIV (RIGHT: desktop/CENTER: mobile) -->
     <div class="main">
-      {#if innerWidth >= 1000}
+      {#if innerWidth >= 1200}
         <div class="lang-btn-container">
           <button
             class="footer-btn lang-btn"
@@ -143,7 +146,7 @@
         </div>
         <h1 class="name">{cv.info.full_name}</h1>
       {/if}
-      <h2 class="name">{cv.info.title}</h2>
+      <h2 class="name">{@html cv.info.title}</h2>
       <Section icon={mdiSchool} title={text.education} />
       <SlideShow
         data={cv.education}
@@ -163,6 +166,7 @@
         data={cv.skills.project}
         type={Projects}
         show_max_index={true}
+        {text}
       />
       <Section icon={mdiPencil} title={text.skills} />
       <SubSection icon={mdiXml} title={text.programming_languages} />
@@ -212,7 +216,7 @@
   <!-- Footer -->
   <div class="footer" bind:this={footer}>
     <!-- Footer desktop -->
-    {#if innerWidth >= 1000}
+    {#if innerWidth >= 1200}
       <div />
       <div class="footer-text">
         <p>
@@ -220,7 +224,7 @@
           <SvgIcon size="20" path={mdiHeart} type="mdi" />
           {text.usingsvelte}
         </p>
-        <p>{text.copyright} • {new Date().getFullYear()}</p>
+        <p>{new Date().getFullYear()} • {text.copyright}</p>
       </div>
       <div class="footer-btn-container">
         <a
@@ -245,7 +249,7 @@
           <SvgIcon size="20" path={mdiHeart} type="mdi" />
           {text.usingsvelte}
         </p>
-        <p>{text.copyright} • {new Date().getFullYear()}</p>
+        <p>{new Date().getFullYear()} • {text.copyright}</p>
       </div>
       <div class="footer-mobile-btn">
         <div class="footer-btn-container">