diff --git a/Sources/index.html b/Sources/index.html
index 0b376f1..e9f6320 100644
--- a/Sources/index.html
+++ b/Sources/index.html
@@ -123,7 +123,7 @@
                     <div class="position-relative overflow-hidden mb-2">
                         <img class="img-fluid rounded w-100" src="img/portfolio-1.png" alt="">
                         <div class="portfolio-btn bg-primary d-flex align-items-center justify-content-center">
-                            <a href="img/portfolio-1.jpg" data-lightbox="portfolio">
+                            <a href="#" data-toggle="modal" data-target="#portfolioModal1">
                                 <i class="fa fa-plus text-white" style="font-size: 60px;"></i>
                             </a>
                         </div>
@@ -133,7 +133,7 @@
                     <div class="position-relative overflow-hidden mb-2">
                         <img class="img-fluid rounded w-100" src="img/portfolio-2.png" alt="">
                         <div class="portfolio-btn bg-primary d-flex align-items-center justify-content-center">
-                            <a href="img/portfolio-2.jpg" data-lightbox="portfolio">
+                            <a href="#" data-toggle="modal" data-target="#portfolioModal2">
                                 <i class="fa fa-plus text-white" style="font-size: 60px;"></i>
                             </a>
                         </div>
@@ -143,7 +143,7 @@
                     <div class="position-relative overflow-hidden mb-2">
                         <img class="img-fluid rounded w-100" src="img/portfolio-3.jpg" alt="">
                         <div class="portfolio-btn bg-primary d-flex align-items-center justify-content-center">
-                            <a href="img/portfolio-3.jpg" data-lightbox="portfolio">
+                            <a href="#" data-toggle="modal" data-target="#portfolioModal3">
                                 <i class="fa fa-plus text-white" style="font-size: 60px;"></i>
                             </a>
                         </div>
@@ -153,7 +153,7 @@
                     <div class="position-relative overflow-hidden mb-2">
                         <img class="img-fluid rounded w-100" src="img/portfolio-4.jpg" alt="">
                         <div class="portfolio-btn bg-primary d-flex align-items-center justify-content-center">
-                            <a href="img/portfolio-4.jpg" data-lightbox="portfolio">
+                            <a href="#" data-toggle="modal" data-target="#portfolioModal4">
                                 <i class="fa fa-plus text-white" style="font-size: 60px;"></i>
                             </a>
                         </div>
@@ -163,7 +163,7 @@
                     <div class="position-relative overflow-hidden mb-2">
                         <img class="img-fluid rounded w-100" src="img/portfolio-5.png" alt="">
                         <div class="portfolio-btn bg-primary d-flex align-items-center justify-content-center">
-                            <a href="img/portfolio-5.jpg" data-lightbox="portfolio">
+                            <a href="#" data-toggle="modal" data-target="#portfolioModal5">
                                 <i class="fa fa-plus text-white" style="font-size: 60px;"></i>
                             </a>
                         </div>
@@ -173,7 +173,7 @@
                     <div class="position-relative overflow-hidden mb-2">
                         <img class="img-fluid rounded w-100" src="img/portfolio-6.jpg" alt="">
                         <div class="portfolio-btn bg-primary d-flex align-items-center justify-content-center">
-                            <a href="img/portfolio-6.jpg" data-lightbox="portfolio">
+                            <a href="#" data-toggle="modal" data-target="#portfolioModal6">
                                 <i class="fa fa-plus text-white" style="font-size: 60px;"></i>
                             </a>
                         </div>
@@ -184,6 +184,125 @@
     </div>
     <!-- Portfolio End -->
 
+    <!-- Modal HTML -->
+<div class="modal fade" id="portfolioModal1" tabindex="-1" role="dialog" aria-labelledby="portfolioModalLabel" aria-hidden="true">
+    <div class="modal-dialog" role="document">
+      <div class="modal-content">
+        <div class="modal-header">
+          <h5 class="modal-title" id="portfolioModalLabel">Craft#</h5>
+          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+            <span aria-hidden="true">&times;</span>
+          </button>
+        </div>
+        <div class="modal-body">
+          <p>A web application made in blazor in the theme of Minecraft, in which users will be able to list their item, crafter, buy...</p>
+        </div>
+        <div class="modal-footer">
+            <a href="https://codefirst.iut.uca.fr/git/rayhan.hassou/Projet_Blazor" target="_blank" class="btn btn-primary">Git repository</a>
+        </div>
+      </div>
+    </div>
+  </div>
+
+<div class="modal fade" id="portfolioModal2" tabindex="-1" role="dialog" aria-labelledby="portfolioModalLabel" aria-hidden="true">
+    <div class="modal-dialog" role="document">
+      <div class="modal-content">
+        <div class="modal-header">
+          <h5 class="modal-title" id="portfolioModalLabel">JustMusic</h5>
+          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+            <span aria-hidden="true">&times;</span>
+          </button>
+        </div>
+        <div class="modal-body">
+          <p>JustMusic is a collaborative for-profit project for Android/IOS using Dart/flutter technology carried out by 4 BUT students.
+
+            It is a social network so the user can post and comment on posts. He will be able to subscribe to other users to see their posts on his news feed.</p>
+        </div>
+        <div class="modal-footer">
+            <a href="https://codefirst.iut.uca.fr/git/justDEV/justMusic" target="_blank" class="btn btn-primary">Git repository</a>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <div class="modal fade" id="portfolioModal3" tabindex="-1" role="dialog" aria-labelledby="portfolioModalLabel" aria-hidden="true">
+    <div class="modal-dialog" role="document">
+      <div class="modal-content">
+        <div class="modal-header">
+          <h5 class="modal-title" id="portfolioModalLabel">ToDoList</h5>
+          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+            <span aria-hidden="true">&times;</span>
+          </button>
+        </div>
+        <div class="modal-body">
+          <p>Realize a PHP project consisting of making a To do List, which will contain visitors, users or administrator.</p>
+        </div>
+        <div class="modal-footer">
+            <a href="https://codefirst.iut.uca.fr/git/rayhan.hassou/Projet_ToDoList_Php" target="_blank" class="btn btn-primary">Git repository</a>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <div class="modal fade" id="portfolioModal4" tabindex="-1" role="dialog" aria-labelledby="portfolioModalLabel" aria-hidden="true">
+    <div class="modal-dialog" role="document">
+      <div class="modal-content">
+        <div class="modal-header">
+          <h5 class="modal-title" id="portfolioModalLabel">LeftOvers</h5>
+          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+            <span aria-hidden="true">&times;</span>
+          </button>
+        </div>
+        <div class="modal-body">
+          <p>A mobile application (IOS/Android) that enables users to choose ingredients in order to cook. The app will return a list of adapted recipes.</p>
+        </div>
+        <div class="modal-footer">
+            <a href="https://codefirst.iut.uca.fr/git/Sae_LeftOvers" target="_blank" class="btn btn-primary">Git repository</a>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <div class="modal fade" id="portfolioModal5" tabindex="-1" role="dialog" aria-labelledby="portfolioModalLabel" aria-hidden="true">
+    <div class="modal-dialog" role="document">
+      <div class="modal-content">
+        <div class="modal-header">
+          <h5 class="modal-title" id="portfolioModalLabel">Kotanga</h5>
+          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+            <span aria-hidden="true">&times;</span>
+          </button>
+        </div>
+        <div class="modal-body">
+          <p>Our app is called Kotanga which means counting in Lingala.
+            It aims to facilitate payments between friends, within a group of people such as collocates, families, ...</p>
+        </div>
+        <div class="modal-footer">
+            <a href="https://gitlab.com/nathanverdier/kotanga" target="_blank" class="btn btn-primary">Git repository</a>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <div class="modal fade" id="portfolioModal6" tabindex="-1" role="dialog" aria-labelledby="portfolioModalLabel" aria-hidden="true">
+    <div class="modal-dialog" role="document">
+      <div class="modal-content">
+        <div class="modal-header">
+          <h5 class="modal-title" id="portfolioModalLabel">Dou Shou Qi</h5>
+          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+            <span aria-hidden="true">&times;</span>
+          </button>
+        </div>
+        <div class="modal-body">
+          <p>Dou Shou Qi, or "Jungle Game", is a Chinese board game where two players move pieces representing animals on a 7x9 square board. Each animal has a different strength and can capture other animals according to a specific hierarchy, except the Rat that can capture the Elephant. The goal is to move one of his pieces into the opponent’s lair, while using the rivers and special abilities of the animals to capture the opponent’s pieces and defend his own lair.</p>
+        </div>
+        <div class="modal-footer">
+            <a href="https://codefirst.iut.uca.fr/git/remi.regnault/DouShouQi_App" target="_blank" class="btn btn-primary">Git repository</a>
+        </div>
+      </div>
+    </div>
+  </div>
+  
+
 
     <!-- Skill Start -->
     <div class="container-fluid py-5" id="skill">