diff --git a/resources/sass/fo/base/_common.scss b/resources/sass/fo/base/_common.scss
index 2fdf42a..b7af7c7 100644
--- a/resources/sass/fo/base/_common.scss
+++ b/resources/sass/fo/base/_common.scss
@@ -80,6 +80,10 @@ img { max-width: 100%; }
     }
 }
 
+.rotate-180 {
+    rotate: 180deg;
+}
+
 .rotate-n45 {
     rotate: -45deg;
 }
diff --git a/resources/sass/fo/pages/_about-us.scss b/resources/sass/fo/pages/_about-us.scss
index 1b6a73f..4760782 100644
--- a/resources/sass/fo/pages/_about-us.scss
+++ b/resources/sass/fo/pages/_about-us.scss
@@ -27,36 +27,39 @@
         .date-bloc:nth-child(2),
         .date-bloc:nth-child(3),
         .date-bloc:nth-child(7) {
-            .year-bloc img { max-width: 50%; }
+            .year-bloc > img { max-width: 50%; }
         }
 
         // 4 : 1991
         .date-bloc:nth-child(4) {
-            .year-bloc img { max-width: 75%; }
+            .year-bloc > img { max-width: 75%; }
         }
 
         // 5 : 1995
         // 9 : 2018
         .date-bloc:nth-child(5),
         .date-bloc:nth-child(9) {
-            .year-bloc img { max-width: 100%; }
+            .year-bloc > img { max-width: 100%; }
         }
 
         // 6 : 2005
         .date-bloc:nth-child(6) {
-            .year-bloc img { max-width: 10%; }
+            .year-bloc > img { max-width: 10%; }
         }
 
         // 8 : 2009
-        // 11 : 2021
-        .date-bloc:nth-child(8),
-        .date-bloc:nth-child(11) {
+        .date-bloc:nth-child(8) {
             .year-bloc img { max-width: 25%; }
         }
 
         // 10 : 2020
         .date-bloc:nth-child(10) {
-            .year-bloc img { max-width: 40%; }
+            .year-bloc > img { max-width: 40%; }
+        }
+
+        // 11 : 2021
+        .date-bloc:nth-child(11) {
+            .year-bloc > img { max-width: 25%; }
         }
     }
 
diff --git a/resources/sass/fo/utilities/_bootstrap-variables.scss b/resources/sass/fo/utilities/_bootstrap-variables.scss
index fb556a9..5e21135 100644
--- a/resources/sass/fo/utilities/_bootstrap-variables.scss
+++ b/resources/sass/fo/utilities/_bootstrap-variables.scss
@@ -57,3 +57,14 @@ $h6-font-size: $font-size-base * $heading-multiplicator;
 
 // Enable negative margin
 $enable-negative-margins: true;
+
+// Customize bs breakpoints
+$grid-breakpoints: (
+    xs: 0,
+    mn: 450px,
+    sm: 576px,
+    md: 768px,
+    lg: 992px,
+    xl: 1200px,
+    xxl: 1400px
+);
diff --git a/resources/views/fo/pages/about-us.blade.php b/resources/views/fo/pages/about-us.blade.php
index 9bfcb98..3bf6267 100644
--- a/resources/views/fo/pages/about-us.blade.php
+++ b/resources/views/fo/pages/about-us.blade.php
@@ -15,7 +15,7 @@
                     <img class="img-fluid h-lg-100" src="{{ Vite::asset('resources/assets/images/about-us/depuis-1987.png') }}"
                         alt="{{ __('Depuis 1987') }}" />
                 </div>
-                <div class="col-lg-8 col-xl-6 mt-lg-3">
+                <div class="col-lg-8 col-xl-6 mt-lg-3 z-1">
                     <div class="d-lg-inline-block text-center">
                         <h1 class="position-relative d-lg-inline-block f-sheldon ls-1 my-4">{{ __($staticPageModel->title) }}</h1>
                     </div>
@@ -47,7 +47,7 @@
                         <div class="position-relative mx-4">
                             <p class="f-sheldon fw-bold h4 lh-base mx-3 mb-2">{{ __('Création de la société') }}</p>
                             <p class="f-readex-pro fw-bold lh-sm">{!! clean('grâce à l\'innovation<br>de la cuisson sous vide.') !!}</p>
-                            <img class="d-none d-lg-block position-absolute end-100 top-100 translate-middle-y z-1"
+                            <img class="d-none d-lg-block position-absolute end-100 top-100 w-50 translate-middle-y z-1"
                                 src="{{ Vite::asset('resources/assets/images/about-us/pointilles-01.png') }}" alt="{{ __('Des pointillés') }}">
                         </div>
                     </div>
@@ -55,7 +55,7 @@
 
                 {{-- 1988 --}}
                 <div class="date-bloc col-12 col-lg-6 mt-lg-0 mb-lg-0 my-5">
-                    <div class="ratio ratio-1x1">
+                    <div class="ratio ratio-1x1 mx-auto">
                         <div
                             class="year-bloc d-flex flex-column justify-content-center align-items-center rounded-circle bg-light mx-auto text-center">
                             <img class="img-fluid" src="{{ Vite::asset('resources/assets/images/about-us/plats-cuisines.png') }}"
@@ -63,9 +63,12 @@
                             <p class="f-readex-pro fs-5 fw-bold highlight light-green w-50 mx-auto mb-2 px-3 text-white">
                                 {{ __('1988') }}
                             </p>
-                            <div class="mx-4">
-                                <p class="f-readex-pro fw-bold text-uppercase mx-4 mb-0">{{ __('Rayon Traiteur coupe :') }}</p>
-                                <p class="f-sheldon fw-bold h4 lh-base mx-5">{{ __('Lancement gamme plats cuisinés') }}</p>
+                            <div class="position-relative pb-lg-4 mx-4">
+                                <p class="f-readex-pro fw-bold text-uppercase mx-4 mb-0">{!! clean('Rayon Traiteur coupe :<br>lancement gamme') !!}</p>
+                                <p class="f-sheldon fw-bold h4 lh-base mx-5">{{ __('plats cuisinés') }}</p>
+                                <img class="d-none d-lg-block position-absolute start-50 start-xl-100 top-100 z-1"
+                                    src="{{ Vite::asset('resources/assets/images/about-us/pointilles-02.png') }}"
+                                    alt="{{ __('Des pointillés') }}">
                             </div>
                         </div>
                     </div>
@@ -73,7 +76,7 @@
 
                 {{-- 1989 --}}
                 <div class="date-bloc col-12 col-lg-6 mt-lg-10 mb-lg-0 my-5">
-                    <div class="ratio ratio-1x1">
+                    <div class="ratio ratio-1x1 mx-auto">
                         <div
                             class="year-bloc d-flex flex-column justify-content-center align-items-center rounded-circle bg-light mx-auto text-center">
                             <img class="position-absolute start-50 translate-middle-y img-fluid top-0"
@@ -88,6 +91,9 @@
                                     {{ __('Démarrage des gammes à marque distributeurs') }}
                                 </p>
                             </div>
+                            <img class="d-none d-lg-block position-absolute top-100 w-25 z-1 end-50 translate-middle-y"
+                                src="{{ Vite::asset('resources/assets/images/about-us/pointilles-03.png') }}"
+                                alt="{{ __('Des pointillés') }}">
                         </div>
                     </div>
                 </div>
@@ -108,6 +114,8 @@
                                 </p>
                             </div>
                         </div>
+                        <img class="d-none d-lg-block position-absolute top-100 z-1 start-50"
+                            src="{{ Vite::asset('resources/assets/images/about-us/pointilles-04.png') }}" alt="{{ __('Des pointillés') }}">
                     </div>
                 </div>
 
@@ -131,17 +139,20 @@
 
                 {{-- 2005 --}}
                 <div class="date-bloc col-12 col-lg-6 mt-lg-n5">
-                    <div class="ratio ratio-1x1">
+                    <div class="ratio ratio-1x1 mx-auto">
                         <div class="year-bloc d-flex flex-column justify-content-center align-items-center rounded-circle mx-auto text-center">
                             <img class="img-fluid mb-3" src="{{ Vite::asset('resources/assets/images/global/logo-ldc-traiteur.svg') }}"
                                 alt="{{ __('Logo de l\'entité LDC Traiteur') }}" />
                             <p class="f-readex-pro fs-5 fw-bold highlight yellow mx-auto mb-2 px-2 text-white">
                                 {{ __('2005') }}
                             </p>
-                            <div class="mx-4">
+                            <div class="position-relative px-lg-5 mx-4">
                                 <p class="f-readex-pro fw-bold text-uppercase mx-4 mb-0">{{ __('Agis devient') }}</p>
                                 <p class="f-sheldon fw-bold h4 lh-base mx-5">{!! clean('Filiale à 100%<br>du Groupe LDC') !!}
                                 </p>
+                                <img class="d-none d-lg-block position-absolute z-1 start-100 top-0"
+                                    src="{{ Vite::asset('resources/assets/images/about-us/pointilles-05.png') }}"
+                                    alt="{{ __('Des pointillés') }}">
                             </div>
                         </div>
                     </div>
@@ -166,7 +177,7 @@
                 </div>
 
                 {{-- 2009 --}}
-                <div class="date-bloc col-12 my-5 pb-5">
+                <div class="date-bloc col-12 mb-mn-10 my-5 pb-5">
                     <div class="year-bloc position-relative d-flex flex-column justify-content-center align-items-center mx-auto text-center">
                         <div class="d-flex justify-content-center align-items-center mb-3">
                             <img class="img-fluid" src="{{ Vite::asset('resources/assets/images/about-us/rouleaux-printemps.png') }}"
@@ -177,10 +188,13 @@
                             <img class="img-fluid" src="{{ Vite::asset('resources/assets/images/about-us/rouleaux-printemps.png') }}"
                                 alt="{{ __('Dessin d\'un rouleau de printemps') }}" />
                         </div>
-                        <div class="mx-4">
-                            <p class="f-sheldon fw-bold h4 lh-base mx-4">{{ __('Nos premiers rouleaux de printemps') }}
+                        <div class="position-relative mx-4">
+                            <p class="f-sheldon fw-bold h4 lh-base mx-4">{!! clean('Nos premiers<br>rouleaux de printemps') !!}
                             <p class="f-readex-pro fw-bold text-uppercase mx-3 mb-0">{{ __('arrivent sur le marché') }}</p>
                             </p>
+                            <img class="d-none d-lg-block position-absolute z-1 end-100 translate-middle-y top-50"
+                                src="{{ Vite::asset('resources/assets/images/about-us/pointilles-06.png') }}"
+                                alt="{{ __('Des pointillés') }}">
                         </div>
                     </div>
                 </div>
@@ -203,12 +217,14 @@
                             </p>
                             <p class="f-readex-pro fw-bold text-uppercase lh-sm mx-5 mb-0">{{ __('Pour le rayon frais emballé') }}</p>
                         </div>
+                        <img class="d-none d-lg-block position-absolute z-1 top-50 translate-middle w-50 end-0 rotate-180"
+                            src="{{ Vite::asset('resources/assets/images/about-us/pointilles-02.png') }}" alt="{{ __('Des pointillés') }}">
                     </div>
                 </div>
 
                 {{-- 2020 --}}
-                <div class="date-bloc col-12 col-lg-6 my-5 pt-5">
-                    <div class="ratio ratio-1x1">
+                <div class="date-bloc col-12 col-lg-6 mt-mn-10 my-5 pt-5">
+                    <div class="ratio ratio-1x1 mx-auto">
                         <div
                             class="year-bloc d-flex flex-column justify-content-center align-items-center rounded-circle bg-light mx-auto text-center">
                             <img class="img-fluid mb-2" src="{{ Vite::asset('resources/assets/images/about-us/bo-bun.png') }}"
@@ -216,9 +232,12 @@
                             <p class="f-readex-pro fs-5 fw-bold highlight deep-orange mx-auto mb-2 px-2 text-white">
                                 {{ __('2020') }}
                             </p>
-                            <div>
+                            <div class="px-lg-5 position-relative">
                                 <p class="f-sheldon fw-bold h4 lh-base mx-0">{{ __('Lancement des Bo Bun') }}</p>
                                 <p class="f-readex-pro fw-bold text-uppercase lh-sm mx-0 mb-0">{!! clean('Au rayon Frais emballé<br>Nouveau savoir-faire Sushi,<br>grâce à Asia General Food') !!}</p>
+                                <img class="d-none d-lg-block position-absolute z-1 top-50 end-100"
+                                    src="{{ Vite::asset('resources/assets/images/about-us/pointilles-01.png') }}"
+                                    alt="{{ __('Des pointillés') }}">
                             </div>
                         </div>
                     </div>