diff --git a/src/components/Modal.vue b/src/components/Modal.vue
index 41ee38c..f406817 100644
--- a/src/components/Modal.vue
+++ b/src/components/Modal.vue
@@ -9,7 +9,7 @@
             <slot>
             </slot>
             <button @click="close" class="button">
-            Fermer
+            Close
             </button>
 				</div>
 			</transition>
@@ -69,7 +69,7 @@
 	width: 100vw;
 	height: 100vh;
 	position: fixed;
-	z-index: 1;
+	z-index: 999;
 	display: flex;
 	justify-content: center;
 	align-items: center;
@@ -112,7 +112,7 @@ h1{
   background-color: #e5e5e5;
   color: $red;
   font-size: 1.7em;
-  transition: color 0.5s ease;
+  transition: color 0.25s ease;
   &:hover{
     color: lighten($red, 15%);
     cursor:pointer;
@@ -131,7 +131,7 @@ h1{
   border-radius: 0.5em;
   margin:0.5em auto;
   display: block;
-  padding: 0.4em 0.75em;
+  padding: 0.5em 1em;
   border:none;
   color:$red;
   font-family: Arial, Helvetica, sans-serif;
@@ -141,5 +141,10 @@ h1{
   outline: $red;
   outline-style: solid;
   outline-offset: -5px;
+  transition: 0.25s ease;
+  &:hover{
+    background-color: darken($green, 10%);
+    cursor:pointer;
+  }
 }
 </style>
\ No newline at end of file
diff --git a/src/components/Spinner.vue b/src/components/Spinner.vue
new file mode 100644
index 0000000..a244263
--- /dev/null
+++ b/src/components/Spinner.vue
@@ -0,0 +1,55 @@
+<template>
+  <div>
+  </div>
+</template>
+<script>
+export default {
+name : 'SpinnerCpnt'
+}
+</script>
+
+<style lang="scss" scoped>
+div{
+  display: inline-block;
+width: 1.0em;
+margin-right: 1ch;
+aspect-ratio: 1;
+border:3px solid #ff00c8;
+border-top:3px solid rgb(216, 226, 253);
+border-radius:50%;
+
+-webkit-transition-property: -webkit-transform;
+-webkit-transition-duration: 1.2s;
+-webkit-animation-name: rotate;
+-webkit-animation-iteration-count: infinite;
+-webkit-animation-timing-function: linear;
+
+-moz-transition-property: -moz-transform;
+-moz-animation-name: rotate; 
+-moz-animation-duration: 1.2s; 
+-moz-animation-iteration-count: infinite;
+-moz-animation-timing-function: linear;
+
+transition-property: transform;
+animation-name: rotate; 
+animation-duration: 1.2s; 
+animation-iteration-count: infinite;
+animation-timing-function: linear;}
+
+@-webkit-keyframes rotate {
+  from {-webkit-transform: rotate(0deg);}
+  to {-webkit-transform: rotate(360deg);}
+}
+
+@-moz-keyframes rotate {
+  from {-moz-transform: rotate(0deg);}
+  to {-moz-transform: rotate(360deg);}
+}
+
+@keyframes rotate {
+  from {transform: rotate(0deg);}
+  to {transform: rotate(360deg);}
+}
+
+
+</style>
\ No newline at end of file
diff --git a/src/views/Contact.vue b/src/views/Contact.vue
index bb1a364..3b00d34 100644
--- a/src/views/Contact.vue
+++ b/src/views/Contact.vue
@@ -3,6 +3,8 @@ import { useBurgerStore } from '@/stores/burger'
 import Modal from '@/components/Modal.vue';
 import { ref, onMounted } from 'vue';
 import { formService } from '@/services/form';
+import Spinner from '@/components/Spinner.vue';
+
 //import { badge } from 'fontawesome';
 onMounted(() => {
   burger.check()
@@ -133,7 +135,8 @@ const onSubmit = () => {
           Send !
         </div>
         <div v-else>
-          Sending
+          <Spinner/>
+          Sending...
         </div>
       </button>
       <div class="error" v-if="errors.database">
@@ -146,8 +149,8 @@ const onSubmit = () => {
     
   <Modal @close="toggleModal" :modalActive="modalActive">
     <div class="modal-content">
-      <h1 class="modal-title">Merci !</h1>
-      <p class="modal-p">Votre message a bien été envoyé !</p>
+      <h1 class="modal-title">Thank you !</h1>
+      <p class="modal-p">Your message has been sent successfully!</p>
     </div>
   </Modal>
   </div>
@@ -224,11 +227,12 @@ const onSubmit = () => {
       }
     }
     & button{
+     
       margin: 0.5em;
       border: none;
       //border-radius: 10px;
       font-size:1.5rem;
-      background-color: white;
+      background-color: darken($green, 10%);
       outline : 3px;
       outline-style: solid;
       outline-offset: -5px;
@@ -236,16 +240,22 @@ const onSubmit = () => {
       color:black;
       padding: 0.3em 0.9em;
       transition:0.3s;
+      
       &:hover{
         cursor: pointer; 
-        background-color: darken(white, 15%);
+        background-color: $green
       }
       &:disabled{
-        background-color: rgb(165, 165, 165);
+        background-color: hsl(0, 0%, 55%);
         &:hover{
           cursor : default;
         }
       }
+      & > div{
+        display: flex;
+        justify-content: center;
+        align-items: center;
+      }
     }
   }
 }
@@ -255,8 +265,5 @@ const onSubmit = () => {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 1.25em;
 }
-.grecaptcha-badge{
-  transition : 0.5s;
-  opacity : 1;
-}
+
 </style>
\ No newline at end of file
diff --git a/src/views/Networks.vue b/src/views/Networks.vue
index f6daf55..ee6d700 100644
--- a/src/views/Networks.vue
+++ b/src/views/Networks.vue
@@ -15,25 +15,30 @@ onMounted(() => {
       <h3>Networks</h3> 
     </div>
     <div class="list github">
-      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512" width="2em">
-        <path 
-        d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"/>
-      </svg>
+      <a href="https://www.github.com/Raffiskender" target="_blank">
+        <svg viewBox="0 0 496 512" width="2em">
+          <path 
+          d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"/>
+        </svg>
+      </a>
       <p>Github page and projects: <a href="https://www.github.com/Raffiskender" target="_blank">github.com/Raffiskender</a> </p>
-      </div>
-      <div class="list linkedin">
-        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"  width="2em">
-          <path d="M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z"/></svg>
+    </div>
+    <div class="list linkedin">
+        <a href="https://fr.linkedin.com/in/raffi-alexanian" target="_blank">
+          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"  width="2em">
+            <path d="M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z"/>
+          </svg>
+        </a>
         <p>A Linkedin profil: <a href="https://fr.linkedin.com/in/raffi-alexanian" target="_blank">fr.linkedin.com/in/raffi-alexanian</a> </p>
       </div>
       <div class="list cv">
-        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"   width="2em">
-          <path d="M224 256A128 128 0 1 0 224 0a128 128 0 1 0 0 256zm-45.7 48C79.8 304 0 383.8 0 482.3C0 498.7 13.3 512 29.7 512H418.3c16.4 0 29.7-13.3 29.7-29.7C448 383.8 368.2 304 269.7 304H178.3z"/>
-        </svg>
+        <a href="https://cv.raffiskender.com" target="_blank">
+          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" width="2em">
+            <path d="M224 256A128 128 0 1 0 224 0a128 128 0 1 0 0 256zm-45.7 48C79.8 304 0 383.8 0 482.3C0 498.7 13.3 512 29.7 512H418.3c16.4 0 29.7-13.3 29.7-29.7C448 383.8 368.2 304 269.7 304H178.3z"/>
+          </svg>
+        </a>
         <p>And also a CV (in french) <a href="https://cv.raffiskender.com" target="_blank">https://cv.raffiskender.com</a> </p>
-      </div>
-    <p>And that should be fine !</p>
-    
+      </div>    
   </div>
 </template>
 <style lang="scss" scoped>
diff --git a/src/views/Technologies.vue b/src/views/Technologies.vue
index 8f4f257..5f61f8b 100644
--- a/src/views/Technologies.vue
+++ b/src/views/Technologies.vue
@@ -1,10 +1,14 @@
 <script setup>
-import { onMounted } from 'vue';
+import { ref, onMounted } from 'vue';
 import { useBurgerStore } from '@/stores/burger'
 const burger = useBurgerStore();
 onMounted(() => {
   burger.check();
 })
+
+const showVueUnderList=ref(false)
+const showWordpressUnderList=ref(false)
+
 </script>
 <template>
   <div class="content">
@@ -13,25 +17,32 @@ onMounted(() => {
       </div>
       <h3><span>technos</span></h3> 
     </div>
-    <p class="first">Technologies are just like legos. I mean, it's a variety of bricks you can put together to build an all. Here are certains languages I feel confortable with:</p>
+    <p class="first">Technologies are just like Legos. I mean, they consist of a variety of bricks you can put together to build amazing things. Here are certain languages I feel comfortable with:</p>
     <ul>
       <li>html</li>
-      <li>css</li>
+      <li>css / scss</li>
       <li>js</li>
-      <li>php (this old guy)</li>
+      <li>php</li>
     </ul>
     <p>And also some other stuff:</p>
     <ul>
-      <li>Vue.js</li>
-      <li>Worpress</li>
-      <li>Yarn</li>
-      <li>npm</li>
+      <li>Versioning with Git</li>
+      <li>npm / yarn</li>
+      <li @click="showVueUnderList = !showVueUnderList" v-bind:class="{ open : showVueUnderList }" class="under-listed">Vue.js</li>
+        <li v-bind:class="{ hide : !showVueUnderList }" class="under-li">Vue2 / Vue3</li>
+        <li v-bind:class="{ hide : !showVueUnderList }" class="under-li">Option api / Composition api</li>
+        <li v-bind:class="{ hide : !showVueUnderList }" class="under-li">Nuxt</li>
+        <li v-bind:class="{ hide : !showVueUnderList }" class="under-li last">Vuetify <span class=red>💚</span></li>
+      <li  @click="showWordpressUnderList = !showWordpressUnderList" v-bind:class="{ open : showWordpressUnderList }" class="under-listed">Worpress</li>
+      <li v-bind:class="{ hide : !showWordpressUnderList }" class="under-li">Custom plugins</li>
+      <li v-bind:class="{ hide : !showWordpressUnderList }" class="under-li">Custom themes</li>
+      <li v-bind:class="{ hide : !showWordpressUnderList }" class="under-li">Rest API backend</li>
+      <li v-bind:class="{ hide : !showWordpressUnderList }" class="under-li last">User management</li>
       <li>Google API console</li>
-      <li>Figma</li>
-      <li>Linux systems</li>
+      <li>Linux systems...</li>
     </ul>
     
-    <p>As you may suppose I do not stop learning, and this list is not exhaustive.</p>
+    <p>... And ready to learn more.</p>
     
   </div>
 </template>
@@ -62,13 +73,57 @@ onMounted(() => {
   & ul{
     padding: 0.5em 1em 0 3em;
   }
-  & li::before{
+  li{
+    &::before{
     margin-left: 1em;
-	  content: "• ";
+    margin-right: 0.5em;
+	  content: "•";
 	  word-spacing: 0.5em;
 	  color: $green;    
   }
-}
+    &.under-listed{
+      font-weight: bold;
+      transition: 0.25s;
+      &::before{
+        display:inline-block;
+        content:"⏵";
+        font-size: 0.85em;
+        transform: rotate(0deg);
+        transition: 0.25s;
+      }
+      &.open{
+        &::before{
+          content:"⏵";
+          transform: rotate(90deg);
+        }
+      }
+      &:hover{
+        color: $red;
+        cursor: pointer;
+      }
+    }
+  &.under-li{
+    margin-left: 2em;
+   
+    &.last{
+      margin-bottom: 0.5em;
+    }
+    &::before{
+      margin-left: 1em;
+      margin-right: 1em;
+      font-size:small;
+      content: "■";
+      word-spacing: 0.5em;
+      color: $green;
+    }
+    &.hide{
+      display: none;
+   }
+  }
+}}
+span.red{
+  color:$red;
+}  
 
 @keyframes text{
 0%{
diff --git a/src/views/WhoAmI.vue b/src/views/WhoAmI.vue
index 75aac7d..c0d0507 100644
--- a/src/views/WhoAmI.vue
+++ b/src/views/WhoAmI.vue
@@ -15,9 +15,10 @@ onMounted(() => {
       <div class="logo"></div>
       <h3>Who Am I&nbsp;?</h3> 
     </div>
-    <p>As you guessed it, my name is Raffi. I've been working 20 years long in the beutyfull world of maintenance where I learnt a lot about logic. I've learnt several programmation languages during my life, for proffesionnal purposes... And also for fun. Here are some of them : Vidjeo Designer, Twido Soft, Zelio Soft, PL7... Also when Iwas young : Turbo Pascal, Qbasic, and more recently a little bit of C (during confinement).</p>
-    <p>in 2022 I've followed a 5 months training courses to learn more about web programmation. So I learnt html, css, js, wordPress and Vue.js, php, sql, database management and so much more ! After that I worked on my own to go deeper in wordpress api-rest, to understand what can be done with Vue etc. Now I feel ready to go !</p>
+  <p>As you guessed, my name is Raffi. I have been working in the beautiful world of maintenance for 20 years, where I have learned a lot about logic. Throughout my life, both for professional purposes and for fun, I have learned several programming languages. Here are some of them: Video Designer, Twido Soft, Zelio Soft, PL7. When I was younger, I also dabbled in Turbo Pascal, Qbasic, and more recently, during the confinement, I explored a bit of C.</p>
 
+<p>In 2022, I took a five-month training course to further my knowledge of web programming. During this time, I learned HTML, CSS, JavaScript, WordPress, Vue.js, PHP, SQL, database management, and much more! After completing the training, I continued to work independently to delve deeper into WordPress API-REST and gain a better understanding of what can be achieved with Vue.js. Now, I feel prepared to move forward!</p>
+<p>I'm accustomed to working with deadlines, challenges, and all kinds of unforeseen circumstances. I thrive in situations that push me out of my comfort zone and require quick thinking. As a native French speaker, I'm also fluent in English and Turkish, allowing me to communicate effectively in multiple languages. I enjoy discovering new things and seizing opportunities to learn and grow. With my experience and language skills, I'm ready to take on new challenges and contribute to motivating projects.</p>
   </div>
 </template>
 <style lang="scss" scoped>
@@ -35,8 +36,8 @@ onMounted(() => {
   
     color : $white;
     opacity: 1;
-    padding:2em;
-    line-height: 1.25em;
+    padding:1em 1.25em 0em 1em;
+    line-height: 1.5em;
     animation: text 0.7s cubic-bezier(0.445, 0.05, 0.55, 0.95);
   }
 }