diff --git a/osm_my_commerce/.yarn/install-state.gz b/osm_my_commerce/.yarn/install-state.gz
index 8ac7ece..f1ad08f 100644
Binary files a/osm_my_commerce/.yarn/install-state.gz and b/osm_my_commerce/.yarn/install-state.gz differ
diff --git a/osm_my_commerce/components/SearchLand.vue b/osm_my_commerce/components/SearchLand.vue
index 977568d..145d21d 100644
--- a/osm_my_commerce/components/SearchLand.vue
+++ b/osm_my_commerce/components/SearchLand.vue
@@ -1,10 +1,12 @@
 <script setup lang="ts">
+
   const queryString = ref("la tour eiffel")
   let selectedPoi = {}
 
+
   const {data, pending, refresh} = await useAsyncData(() => {
       if (queryString.value.length > 3) {
-       return $fetch(`https://demo.addok.xyz/search?&type=poi&q=${queryString.value}`)
+        return $fetch(`https://demo.addok.xyz/search?&type=poi&q=${queryString.value}`)
       }
     },
     {watch: [queryString]})
@@ -28,29 +30,35 @@
         sélectionné: {{selectedPoi.label}}
         <input type="text" v-model="selectedPoi.name">
       </div>
-      <label for="search_poi" class="text-4xl font-bold">
-        <!--          Effectuer une recherche-->
-        🔍
-      </label>
-      <input id="search_poi"
-             type="search"
-             class="h-10 px-6 rounded-md border-2"
-             placeholder="tour eiffel"
-             autofocus="autofocus"
-             v-model="queryString">
-      <button :disabled="pending" class="h-10 px-6 rounded-md bg-black text-white"
-              type="submit"
-              @click="useAsyncData()">
-        Rechercher
-      </button>
-      <div v-if="pending"> Loading ...</div>
-      <div v-if="data?.features.length"> {{data.features.length}} résultats
+      <div class="search-form">
+
+        <label for="search_poi" class="text-4xl font-bold">
+          <!--          Effectuer une recherche-->
+          🔍
+        </label>
+        <input id="search_poi"
+               type="search"
+               class="h-10 px-6 rounded-md border-2"
+               placeholder="tour eiffel"
+               autofocus="autofocus"
+               v-model="queryString">
+        <button :disabled="pending" class="h-10 px-6 rounded-md bg-black text-white"
+                type="submit"
+                @click="useAsyncData()">
+          Rechercher
+        </button>
+      </div>
+      <div class="states">
+        <div v-if="pending"> Loading ...</div>
+        <span class="mx-2" v-if="data?.features.length"> {{data.features.length}} résultats </span>
+      </div>
+      <div class="my-2">
+
 
-        Fetch result:
         <div v-for="elem in data.features" :key="elem.properties.id">
 
           <button
-            class="bg-slate-900 text-slate-100 rounded-md font-medium leading-6 py-1  ring-1 ring-inset ring-slate-900/5 mx-auto p-2 px-4 w-1/2"
+            class="bg-slate-900 hover:bg-slate-700 text-slate-100 rounded-md font-medium leading-6 py-1 mb-1 ring-1 ring-inset ring-slate-900/5 mx-auto p-2 px-4 w-1/2"
             @click="selectPoi(elem)">
             <span class="text-md">
 
@@ -70,6 +78,7 @@
         <!--        <pre class="text-left"><code>{{ data }}</code></pre>-->
       </div>
     </div>
+
   </div>
 </template>