diff --git a/frontend/public/eraser.png b/frontend/public/eraser.png
new file mode 100644
index 0000000..df2d564
Binary files /dev/null and b/frontend/public/eraser.png differ
diff --git a/frontend/public/magnifier.png b/frontend/public/magnifier.png
index 3e2f37b..300fd94 100644
Binary files a/frontend/public/magnifier.png and b/frontend/public/magnifier.png differ
diff --git a/frontend/src/App.css b/frontend/src/App.css
index db7c102..26ca9cf 100644
--- a/frontend/src/App.css
+++ b/frontend/src/App.css
@@ -60,6 +60,13 @@ html {
   margin-top: 8px;
 }
 
+.buttonsDiv {
+  height: 93px;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-around;
+}
+
 .containerExtraSections2 {
   display: flex;
   flex-direction: column;
@@ -84,7 +91,7 @@ html {
 }
 
 .version {
-  margin-right: 20px;
+  margin-right: 28px;
   margin-top: -18px;
   color: #3176b1 !important;
   font-weight: 600 !important;
@@ -100,12 +107,42 @@ html {
 }
 
 .searchButton {
-  padding-right: 4px;
-  padding-left: 0px;
   cursor: pointer;
   margin-left: 12px;
   border: none;
+  border-radius: 100px;
+  background: #3176b1;
+  padding: 10px, 24px, 10px, 16px;
+  color: white;
+  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
+    Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+  font-size: 14px;
+  display: flex;
+  font-weight: 500;
+  width: 99px;
+  height: 40px;
+  justify-content: space-evenly;
+  align-items: center;
+}
+
+.clearButton {
+  cursor: pointer;
+  margin-left: 12px;
+  border: none;
+  border-radius: 100px;
   background: white;
+  padding: 10px, 24px, 10px, 16px;
+  color: #3176b1;
+  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
+    Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+  font-size: 14px;
+  display: flex;
+  font-weight: 500;
+  width: 99px;
+  height: 40px;
+  justify-content: space-evenly;
+  align-items: center;
+  border: 1px solid #3176b1;
 }
 
 .scopeDiv {
@@ -396,12 +433,12 @@ p a {
 }
 
 .searchIcon {
-  width: 31px;
-  margin-top: -1px;
+  width: 13px;
+  margin-right: -2px;
 }
-.searchIcon:hover {
-  width: 33px;
-  margin-top: -3px;
+.clearIcon {
+  width: 15px;
+  margin-right: -2px;
 }
 
 .forwardIcon {
@@ -697,7 +734,8 @@ p a {
 .container2 {
   width: 100vw;
   display: flex;
-  margin-bottom: 40px;
+  margin-bottom: 18px;
+  margin-top: 10px;
 }
 
 .NavlinkVerifier {
@@ -860,7 +898,6 @@ p a {
   transition: 0.2s ease-in-out;
 }
 
-
 .elixirLogo:hover {
   -webkit-filter: grayscale(0%);
   filter: grayscale(0%);
@@ -1439,6 +1476,12 @@ h5 {
     text-underline-offset: 1px;
   }
 
+  .buttonsDiv {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-around;
+  }
+
   .crossQueriesTittle {
     margin-bottom: 12px;
     font-size: 12px;
@@ -1556,10 +1599,6 @@ h5 {
     box-shadow: rgb(234 221 221 / 16%) 0px 1px 4px;
   }
 
-  .container2 {
-    margin-bottom: 0px;
-  }
-
   .exampleQuery {
     width: 100%;
     border: none;
@@ -1715,21 +1754,6 @@ h5 {
       'Helvetica Neue', sans-serif;
     text-transform: uppercase;
   }
-  .searchIcon {
-    width: 26px;
-    margin-top: -1px;
-    margin-left: -8px;
-  }
-  .searchIcon:hover {
-    width: 27px;
-    margin-top: -1px;
-    margin-left: -8px;
-  }
-
-  .searchButton {
-    height: 30px;
-    cursor: pointer;
-  }
 
   .examplesQueriesList {
     display: flex;
@@ -1889,10 +1913,6 @@ h5 {
     box-shadow: rgb(234 221 221 / 16%) 0px 1px 4px;
   }
 
-  .container2 {
-    margin-bottom: 0px;
-  }
-
   .exampleQuery {
     width: 100%;
     border: none;
@@ -2065,22 +2085,6 @@ h5 {
       'Helvetica Neue', sans-serif;
     text-transform: uppercase;
   }
-  .searchIcon {
-    width: 26px;
-    margin-top: -1px;
-    margin-left: -8px;
-  }
-  .searchIcon:hover {
-    width: 27px;
-    margin-top: -1px;
-    margin-left: -8px;
-  }
-
-
-  .searchButton {
-    height: 30px;
-    cursor: pointer;
-  }
 
   .examplesQueriesList {
     display: flex;
@@ -2116,6 +2120,15 @@ h5 {
   }
 }
 
+@media (max-width: 700px) {
+  .buttonsDiv {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-around;
+    margin-top: 5px;
+    height: 101px;
+  }
+}
 @media (max-width: 460px) {
   .containerForm {
     margin-left: 0px;
diff --git a/frontend/src/components/Biosamples/BiosamplesResults.js b/frontend/src/components/Biosamples/BiosamplesResults.js
index 5347cb6..0da1b32 100644
--- a/frontend/src/components/Biosamples/BiosamplesResults.js
+++ b/frontend/src/components/Biosamples/BiosamplesResults.js
@@ -316,7 +316,8 @@ function BiosamplesResults (props) {
                 queryArray[index].push('!')
               } else {
                 queryArray[index] = term.split('%')
-                queryArray[index].push('%')
+                console.log(queryArray[index])
+                queryArray[index].push('=')
               }
 
               let alphanumericFilter = {}
@@ -466,7 +467,9 @@ function BiosamplesResults (props) {
         }
 
         if (updatedArrayFilterVar.length === 0) {
-          beaconsList.push(res.data.response)
+          res.data.responses.forEach(element => {
+            beaconsList.push(element)
+          })
         }
 
         let variablePause = false
diff --git a/frontend/src/components/CrossQueries/CrossQueries.css b/frontend/src/components/CrossQueries/CrossQueries.css
index 3871540..0a14b77 100644
--- a/frontend/src/components/CrossQueries/CrossQueries.css
+++ b/frontend/src/components/CrossQueries/CrossQueries.css
@@ -135,18 +135,7 @@ h5:hover {
     margin-left: 10px;
     margin-right: 10px;
   }
-  .inputSearch {
-    width: 70vw;
-    height: -moz-fit-content;
-    height: fit-content;
-    padding: 10px;
-    font-size: 14 px;
-    border: 1px solid #3176b1;
-    text-overflow: clip;
-    max-width: 80vw;
-    font-size: 13px;
-    border-radius: 3px;
-  }
+
   .crossQueriesForm {
     padding: 34px;
     display: flex;
diff --git a/frontend/src/components/Dataset/BeaconInfo.css b/frontend/src/components/Dataset/BeaconInfo.css
index ca9c8df..decc888 100644
--- a/frontend/src/components/Dataset/BeaconInfo.css
+++ b/frontend/src/components/Dataset/BeaconInfo.css
@@ -69,7 +69,6 @@ p a:hover {
 .tittle2 h1 {
   font-size: 14px;
   font-weight: normal;
-  margin: 14px;
   color: #5d5454;
 }
 
@@ -97,7 +96,7 @@ p a:hover {
   margin-bottom: -3px;
 }
 .tittle {
-  width: 40vw;
+  width: 36vw;
   background: #c8d4e6;
   border-radius: 2px;
   /* height: 80px; */
@@ -120,7 +119,6 @@ p a:hover {
   flex-direction: row;
   justify-content: center;
   align-items: center;
-  margin-bottom: 7px;
 }
 
 .descriptionBeacon a {
@@ -166,7 +164,7 @@ p a:hover {
 }
 
 .datasetCard {
-  width: 40vw;
+  width: 36.7vw;
   margin: 30px;
 
   /* border: 2px solid #3b9ad5; */
@@ -212,12 +210,17 @@ p a:hover {
 }
 
 .datasetCard p {
-  font-size: 12px;
   font-weight: normal;
   color: rgb(61 60 60);
   line-height: 20px;
   margin-top: -5px;
+  width: 35vw;
+  text-align: justify;
+  height: 92px;
+  overflow-y: scroll;
+  font-size: 13px;
 }
+
 .datasetCardResults p {
   font-size: 12px;
   font-weight: normal;
@@ -229,7 +232,6 @@ p a:hover {
 .tittle2 h1 {
   font-size: 14px;
   font-weight: normal;
-  margin: 14px;
   color: #5d5454;
 }
 
@@ -269,13 +271,15 @@ p a:hover {
   margin-bottom: -3px;
 }
 .tittle {
-  width: 38vw;
+  width: 36vw;
   background: #c8d4e6;
   border-radius: 2px;
-  /* height: 80px; */
+  height: fit-content;
   display: flex;
   padding: 2px;
   flex-direction: column;
+  align-items: center;
+  justify-content: center;
 }
 
 .tittleResults {
@@ -321,6 +325,8 @@ p a:hover {
   color: rgba(12, 16, 64, 0.606);
   font-size: 12px;
   font-weight: 600;
+  margin-bottom: 8px;
+  margin-top: 2px;
 }
 
 .tittleResults h2 {
@@ -346,6 +352,7 @@ p a:hover {
   background: #c8d4e6;
   flex-wrap: wrap;
   align-items: center;
+  margin-top: 8px;
 }
 
 .tittle4 {
@@ -493,7 +500,6 @@ h5 {
   .tittle2 h1 {
     font-size: 11px;
     font-weight: normal;
-    margin: 14px;
     color: #5d5454;
   }
 }
@@ -612,7 +618,6 @@ h5 {
     font-weight: bold;
     /* margin: 14px; */
     color: #5d5454;
-    margin: 7px;
   }
 }
 
diff --git a/frontend/src/components/FilteringTerms/FilteringTerms.css b/frontend/src/components/FilteringTerms/FilteringTerms.css
index d21c068..6cdaf32 100644
--- a/frontend/src/components/FilteringTerms/FilteringTerms.css
+++ b/frontend/src/components/FilteringTerms/FilteringTerms.css
@@ -20,14 +20,14 @@
   margin-left: 34px;
   border: 1px solid #3176b1;
   border-radius: 2px;
-  box-shadow: rgba(216, 207, 207, 0.25) 0px 1px 1px, rgba(197, 150, 150, 0.13) 0px 0px 1px 1px;
+  box-shadow: rgba(216, 207, 207, 0.25) 0px 1px 1px,
+    rgba(197, 150, 150, 0.13) 0px 0px 1px 1px;
 }
 
 .inputTerm {
   display: flex;
   align-items: center;
   justify-content: flex-start;
-  
 }
 
 .inputLabel {
@@ -68,12 +68,12 @@ tbody {
   height: fit-content;
   flex-direction: column;
   margin-left: 1vw;
+  align-items: center;
 }
 
 .tableWrapper {
   height: 100vh;
-  width: 85vw;
-  overflow: scroll;
+
   display: flex;
 
   justify-content: center;
@@ -257,7 +257,8 @@ tbody {
   margin-left: 23px;
   border: 1px solid #3176b1;
   border-radius: 2px;
-  box-shadow: rgba(216, 207, 207, 0.25) 0px 1px 1px, rgba(197, 150, 150, 0.13) 0px 0px 1px 1px;
+  box-shadow: rgba(216, 207, 207, 0.25) 0px 1px 1px,
+    rgba(197, 150, 150, 0.13) 0px 0px 1px 1px;
 }
 
 tr {
@@ -306,9 +307,99 @@ tr {
   }
   .tableWrapper {
     height: 100vh;
-    width: 95vw;
-    overflow: scroll;
+
+    display: flex;
+    justify-content: center;
+  }
+}
+
+@media (max-width: 750px) {
+  tbody {
+    width: 96vw !important;
+  }
+  .thead1 {
+    position: sticky;
+    top: 0px;
+    z-index: 2;
+    width: 97%;
+  }
+  .searchTermInput {
+    margin: 5px;
+    width: 70%;
+    height: 28px;
+    /* margin-left: 34px; */
+    border: 1px solid #3176b1;
+    border-radius: 2px;
+    box-shadow: rgba(216, 207, 207, 0.25) 0px 1px 1px,
+      rgba(197, 150, 150, 0.13) 0px 0px 1px 1px;
+  }
+}
+
+@media (max-width: 500px) {
+  .searchTermInput1,
+  .searchTermInput {
+    width: 80%;
+    height: 23px;
+    margin-left: 4px;
+    border: 1px solid #3176b1;
+    border-radius: 2px;
+    box-shadow: rgba(216, 207, 207, 0.25) 0px 1px 1px,
+      rgba(197, 150, 150, 0.13) 0px 0px 1px 1px;
+    font-size: 10px;
+  }
+  .tableWrapper {
+    height: 100vh;
     display: flex;
     justify-content: center;
+    width: 100vw;
+  }
+
+  .th2 {
+    display: flex;
+    width: 73%;
+    /* height: 100%; */
+    /* justify-content: center; */
+    margin-top: 12px;
+    margin-bottom: 12px;
+    padding-left: 10px;
+    padding-left: 0px;
+    padding-top: 10px;
+    overflow-x: auto;
+    padding-bottom: 10px;
+    align-items: center;
+    font-size: 11px;
+}
+  .th4 {
+    display: flex;
+    width: 104%;
+    /* height: 100%; */
+    /* justify-content: center; */
+    overflow-x: scroll;
+    margin-bottom: -23px;
+    padding-left: 30px;
+    padding-top: 10px;
+    padding-bottom: 10px;
+    font-size: 11px;
+  }
+  input[type='checkbox']:before {
+    content: '✓';
+    font-size: 15px;
+    color: transparent !important;
+    background: #ffffff;
+    display: block;
+    width: 8px;
+    height: 8px;
+    border: 1.8px solid #3176b1;
+    margin-right: 1px;
+  }
+  #table {
+    display: flex;
+    font-size: 15px;
+    width: 90%;
+    height: -moz-fit-content;
+    height: fit-content;
+    flex-direction: column;
+    margin-left: 1vw;
+    align-items: center;
   }
 }
diff --git a/frontend/src/components/GenomicVariations/VariantsResults.js b/frontend/src/components/GenomicVariations/VariantsResults.js
index 2fadb26..397b84c 100644
--- a/frontend/src/components/GenomicVariations/VariantsResults.js
+++ b/frontend/src/components/GenomicVariations/VariantsResults.js
@@ -466,7 +466,9 @@ function VariantsResults (props) {
         }
 
         if (updatedArrayFilterVar.length === 0) {
-          beaconsList.push(res.data.response)
+          res.data.responses.forEach(element => {
+            beaconsList.push(element)
+          })
         }
 
         let variablePause = false
diff --git a/frontend/src/components/Individuals/IndividualsResults.js b/frontend/src/components/Individuals/IndividualsResults.js
index 666c577..c197aa4 100644
--- a/frontend/src/components/Individuals/IndividualsResults.js
+++ b/frontend/src/components/Individuals/IndividualsResults.js
@@ -316,7 +316,10 @@ function IndividualsResults (props) {
                 queryArray[index].push('!')
               } else {
                 queryArray[index] = term.split('%')
-                queryArray[index].push('%')
+
+                queryArray[index][1] = '%' + queryArray[index][1] + '%'
+                console.log(queryArray[index])
+                queryArray[index].push('=')
               }
 
               let alphanumericFilter = {}
@@ -329,7 +332,7 @@ function IndividualsResults (props) {
                     if (queryArray[index][0].toLowerCase() === 'individual') {
                       alphanumericFilter = {
                         id: element.id,
-                        scope: ['individual']
+                        scope: ['individuals']
                       }
                     } else if (
                       queryArray[index][0].toLowerCase() === 'genomicvariation'
@@ -465,18 +468,18 @@ function IndividualsResults (props) {
           datasetList.push(res2.data.response.collections)
         }
 
-        if (updatedArrayFilterVar.length === 0) {
+        if (updatedArrayFilterVar.length === 0 && props.isNetwork === true) {
           res.data.responses.forEach(element => {
             beaconsList.push(element)
           })
-       
+        } else if (updatedArrayFilterVar.length === 0 && props.isNetwork === false){
+          beaconsList.push(res.data.response)
         }
 
         let variablePause = false
 
         if (props.query === null || props.query === '') {
           // show all individuals
-
           let jsonData1 = {}
 
           if (arrayRequestParameters.length > 0) {
@@ -534,6 +537,7 @@ function IndividualsResults (props) {
             console.log(jsonData1)
             console.log(res)
           } else {
+        
             const headers = { Authorization: `Bearer ${token}` }
             console.log('querying with token')
             res = await axios.post(
@@ -724,6 +728,7 @@ function IndividualsResults (props) {
           }
           setTriggerSubmit(true)
         } else {
+         
           let jsonData2 = {}
           variablePause = false
 
@@ -861,6 +866,7 @@ function IndividualsResults (props) {
               token = auth.userData.access_token
             }
             if (token === null) {
+   
               console.log('Querying without token')
               res = await axios.post(
                 configData.API_URL + '/individuals',
@@ -870,7 +876,7 @@ function IndividualsResults (props) {
               console.log(res)
             } else {
               console.log('Querying WITH token')
-
+        
               const headers = { Authorization: `Bearer ${token}` }
 
               res = await axios.post(
@@ -878,6 +884,8 @@ function IndividualsResults (props) {
                 jsonData2,
                 { headers: headers }
               )
+              console.log(jsonData2)
+              console.log(res)
             }
 
             setTimeOut(true)
diff --git a/frontend/src/components/Layout/Layout.css b/frontend/src/components/Layout/Layout.css
index ac832d3..d91be02 100644
--- a/frontend/src/components/Layout/Layout.css
+++ b/frontend/src/components/Layout/Layout.css
@@ -1,10 +1,9 @@
 .containerSelection {
   display: flex;
   width: 100vw;
-  align-items: center;
+  /* align-items: center; */
   justify-content: center;
   margin-bottom: 40px;
-  margin-top: -60px;
 }
 
 .buttonShowExamples {
@@ -42,6 +41,7 @@
   /* margin-top: -53px; */
   /* margin-bottom: 10px; */
   margin-top: 24px;
+  align-items: center;
 }
 
 .buttonAllFilters:hover {
@@ -61,7 +61,12 @@
 
 .formInput {
   display: flex;
-  align-items: center;
+  align-items: flex-start;
+  margin-top: 0px;
+}
+
+.layout-container {
+  width: 82vw;
 }
 
 .moduleAddedVariant h4 {
@@ -77,8 +82,14 @@
   width: 90%;
 }
 
+.searchButton:hover {
+  background-color: rgb(180, 196, 210);
+}
+.clearButton:hover {
+  background-color: rgb(180, 196, 210);
+}
+
 p {
-  font-size: 15px !important;
   color: #2a6169;
 }
 
@@ -117,6 +128,8 @@ p {
     Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
   color: #3176b1;
   font-weight: 600;
+  border-top-left-radius: 5px;
+  border-top-right-radius: 5px;
 }
 
 .tab.active {
@@ -124,11 +137,16 @@ p {
   border-top: 1px solid #3176b1;
   border-left: 1px solid #3176b1;
   border-right: 1px solid #3176b1;
+  border-top-left-radius: 5px;
+  border-top-right-radius: 5px;
 }
 
 .tab-content {
   padding: 10px;
   border: 1px solid #3176b1;
+  border-top-right-radius: 5px;
+  border-bottom-right-radius: 5px;
+  border-bottom-left-radius: 5px;
 }
 
 .label-ontology-div label {
@@ -136,15 +154,15 @@ p {
 }
 .inputSearch {
   width: 36vw;
-  height: -moz-fit-content;
-  height: fit-content;
+  resize: none;
+  padding-top: 6px;
+  height: 85px;
   padding-top: -10px;
   padding-left: 10px;
   font-size: 16px;
-  border-radius: 3px;
+  border-radius: 5px;
   border: 1px solid #3176b1;
   text-overflow: clip;
-  line-height: 3.1;
   max-width: 50vw;
   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
     'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
@@ -208,7 +226,6 @@ p {
   align-content: space-between;
   /* justify-content: space-around; */
   align-items: flex-end;
-  margin-top: 30px;
 }
 
 .moduleAddedVariant2 h2 {
@@ -339,11 +356,12 @@ label {
 }
 
 .resetButton {
-  background-color: rgb(249, 249, 249);
-  border: 1px solid rgb(169, 169, 216);
+  background-color: #ddf2f7;
+  border: 1.9px solid rgb(37 66 200);
   border-radius: 2px;
-  margin-bottom: 3px;
   cursor: pointer;
+  height: 28px;
+  margin-left: 5px;
 }
 
 .resetButton:hover {
@@ -373,6 +391,7 @@ h14 {
   color: #64646a;
   margin-left: 10px;
   margin-right: 10px;
+  margin-top: 4.2px;
 }
 
 .label:hover + .onHover {
@@ -472,7 +491,7 @@ h14 {
 .formula {
   width: 20px;
   margin-right: 12.5px;
-  margin-left: 7px;
+  margin-left: 6px;
 }
 
 .dictionary {
@@ -568,27 +587,16 @@ h14 {
     /* margin-left: -10px; */
     /* padding-top: 30px; */
     /* padding-left: 26px; */
- 
   }
 }
 @media (max-width: 1200px) {
   .inputSearch {
     width: 28vw;
-    height: fit-content;
-    padding: 10px;
-    font-size: 14 px;
+
     border: 1px solid #3176b1;
-    border-radius: 3px;
     text-overflow: clip;
     max-width: 38vw;
   }
-  .containerSelection {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    margin-bottom: 40px;
-    margin-top: -60px;
-  }
 }
 @media (max-width: 900) {
   ul div {
@@ -605,46 +613,63 @@ h14 {
 @media (max-width: 950px) {
   .inputSearch {
     width: 28vw;
-    height: fit-content;
-    padding: 10px;
+
     font-size: 14 px;
     border: 1px solid #3176b1;
     text-overflow: clip;
     max-width: 40vw;
-    border-radius: 3px;
   }
-  .containerSelection {
+  .buttonText {
+    display: none !important;
+  }
+  .searchButton {
+    cursor: pointer;
+    margin-left: 12px;
+    border: none;
+    border-radius: 100px;
+    background: #3176b1;
+    padding: 10px, 24px, 10px, 16px;
+    color: white;
+    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI',
+      Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue',
+      sans-serif;
+    font-size: 14px;
     display: flex;
+    font-weight: 500;
+    width: 99px;
+    height: 40px;
+    width: 40px;
+    justify-content: space-evenly;
     align-items: center;
-    justify-content: center;
-    margin-bottom: 40px;
-    margin-top: -60px;
   }
 
-  .selectModule1 {
-    width: 150px !important;
-  }
-}
-
-@media (max-width: 950px) {
-  .inputSearch {
-    width: 28vw;
-    height: fit-content;
-    padding: 10px;
-    font-size: 14 px;
+  .clearButton {
+    cursor: pointer;
+    margin-left: 12px;
+    border: none;
+    border-radius: 100px;
+    background: white;
+    padding: 10px, 24px, 10px, 16px;
+    color: #3176b1;
+    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI',
+      Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue',
+      sans-serif;
+    font-size: 14px;
+    display: flex;
+    font-weight: 500;
+    width: 40px;
+    height: 40px;
+    justify-content: space-evenly;
+    align-items: center;
     border: 1px solid #3176b1;
-    text-overflow: clip;
-    max-width: 80vw;
-    border-radius: 3px;
   }
   .containerSelection {
+    flex-wrap: wrap;
     display: flex;
-    align-items: center;
+    width: 100vw;
+    /* align-items: center; */
     justify-content: center;
     margin-bottom: 40px;
-    margin-top: 20px;
-    width: 100vw;
-    flex-wrap: wrap;
   }
 
   ul {
@@ -683,7 +708,97 @@ h14 {
   }
 }
 
+@media (max-width: 750px) {
+  .inputSearch {
+    width: 63vw;
+
+    font-size: 13px;
+    border: 1px solid #3176b1;
+    text-overflow: clip;
+    max-width: 80vw;
+    margin-top: 10px;
+    margin-left: 26px;
+  }
+  .filterTermsContainer {
+    display: flex;
+    width: 84vw;
+    justify-content: space-evenly;
+    /* margin-bottom: 18px; */
+    flex-wrap: wrap;
+    height: -moz-fit-content;
+    height: fit-content;
+    border: none;
+    /* margin-left: -10px; */
+    padding-top: 30px;
+    padding-left: 0px;
+    /* border-radius: 8px; */
+  }
+  s .containerSelection {
+    margin-top: 12px;
+  }
+}
+
 @media (max-width: 500px) {
+  .searchButton {
+    cursor: pointer;
+    margin-left: 12px;
+    border: none;
+    border-radius: 100px;
+    background: #3176b1;
+    padding: 10px, 24px, 10px, 16px;
+    color: white;
+    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI',
+      Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue',
+      sans-serif;
+    font-size: 14px;
+    display: flex;
+    font-weight: 500;
+    width: 99px;
+    height: 36px;
+    width: 36px;
+    justify-content: space-evenly;
+    align-items: center;
+  }
+  .clearButton {
+    cursor: pointer;
+    margin-left: 12px;
+    border: none;
+    border-radius: 100px;
+    background: white;
+    padding: 10px, 24px, 10px, 16px;
+    color: #3176b1;
+    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI',
+      Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue',
+      sans-serif;
+    font-size: 14px;
+    display: flex;
+    font-weight: 500;
+    width: 36px;
+    height: 36px;
+    justify-content: space-evenly;
+    align-items: center;
+    border: 1px solid #3176b1;
+  }
+
+  .buttonsDiv {
+    /* height: 105px; */
+    height: 105px;
+    display: flex;
+    flex-direction: column;
+    /* justify-content: space-around; */
+    margin-top: 5px;
+  }
+  .buttonAllFilters h4 {
+    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI',
+      Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue',
+      sans-serif;
+    font-size: 12px;
+    color: #3176b1;
+    margin-left: 3px;
+    margin-bottom: 0px;
+    margin-top: 0px;
+    font-weight: 600;
+  }
   ul {
     padding-left: 0;
 
@@ -698,6 +813,9 @@ h14 {
   .scopeSelection h10 {
     font-size: 12px;
   }
+  .formInput {
+    margin-top: 12px;
+  }
   .scopeSelection {
     position: absolute;
     top: 286px;
@@ -722,6 +840,20 @@ h14 {
   select {
     height: 21px;
   }
+
+  .inputSearch {
+    margin-left: 0px;
+  }
+
+  .resetButton {
+    background-color: #ddf2f7;
+    border: 1.9px solid rgb(37 66 200);
+    border-radius: 2px;
+    cursor: pointer;
+    height: 25px;
+    margin-left: 5px;
+    font-size: 12px;
+  }
 }
 
 @media (max-width: 300px) {
diff --git a/frontend/src/components/Layout/Layout.js b/frontend/src/components/Layout/Layout.js
index 5a87458..ac19ba9 100644
--- a/frontend/src/components/Layout/Layout.js
+++ b/frontend/src/components/Layout/Layout.js
@@ -207,7 +207,7 @@ function Layout (props) {
 
     const arrayQuery = title
       .map((titleQuery, indexQuery) =>
-        titleQuery === 'geneId'
+        titleQuery === 'geneId' || titleQuery === 'aminoacidChange'
           ? `${titleQuery}:${value[indexQuery]}`
           : `${titleQuery}=${value[indexQuery]}`
       )
@@ -477,7 +477,7 @@ function Layout (props) {
                 ></img>
               </a>
             </div>
-            <h1 className='version'>v0.5.5</h1>
+            <h1 className='version'>v0.5.6</h1>
           </div>
         </div>
         <div className='containerSelection'>
@@ -516,20 +516,25 @@ function Layout (props) {
                 value={query}
                 onChange={e => search(e)}
               />
-              <input
-                className='resetButton'
-                type='reset'
-                value='Clear'
-                onClick={handleReset}
-              ></input>
             </div>
-            <button className='searchButton' type='submit'>
-              <img
-                className='searchIcon'
-                src='./magnifier.png'
-                alt='searchIcon'
-              ></img>
-            </button>
+            <div className='buttonsDiv'>
+              <button className='searchButton' type='submit'>
+                <img
+                  className='searchIcon'
+                  src='./magnifier.png'
+                  alt='searchIcon'
+                ></img>
+              <span className='buttonText'>Search</span>
+              </button>
+              <button className='clearButton' onClick={handleReset} type='button'>
+                <img
+                  className='clearIcon'
+                  src='./eraser.png'
+                  alt='eraserIcon'
+                ></img>
+                <span className='buttonText'>Clear</span>
+              </button>
+            </div>
           </form>
         </div>
       </div>
diff --git a/frontend/src/components/NavBar/Navbar.css b/frontend/src/components/NavBar/Navbar.css
index f0ba69f..4c3abf7 100644
--- a/frontend/src/components/NavBar/Navbar.css
+++ b/frontend/src/components/NavBar/Navbar.css
@@ -1,3 +1,6 @@
+.h1Menu{
+  color: white !important;
+}
 @media (min-width: 1410px) {
   /* … */
   .nav4 {
@@ -511,7 +514,6 @@
     /* margin-bottom: 5px; */
     padding-right: 10px;
     padding-left: 10px;
-    color: white !important;
     text-decoration: none !important;
     font-weight: 500;
   }
diff --git a/frontend/src/components/NavBar/Navbar.js b/frontend/src/components/NavBar/Navbar.js
index 8ed6831..6296e98 100644
--- a/frontend/src/components/NavBar/Navbar.js
+++ b/frontend/src/components/NavBar/Navbar.js
@@ -266,7 +266,7 @@ function Navbar () {
                         }
                       >
                         {' '}
-                        <h1>Beacon Info</h1>
+                        <h1 className='h1Menu'>Beacon Info</h1>
                       </NavLink>
                     )}
                     {isNetwork && (
@@ -278,7 +278,7 @@ function Navbar () {
                         }
                       >
                         {' '}
-                        <h1>Network members</h1>
+                        <h1 className='h1Menu'>Network members</h1>
                       </NavLink>
                     )}
 
@@ -291,7 +291,7 @@ function Navbar () {
                           isActive ? 'Sign-in5' : 'Sign-in6'
                         }
                       >
-                        <h1>Log in</h1>
+                        <h1 className='h1Menu'>Log in</h1>
                       </NavLink>
                     )}
 
@@ -310,7 +310,7 @@ function Navbar () {
                             src='/../logout.png'
                             alt='ls-login-image2'
                           />
-                          <h1>Log out</h1>
+                          <h1 className='h1Menu'>Log out</h1>
                         </NavLink>
                         <h5 className='userNameOpenMenu'>{userNameToShare}</h5>
                       </>
@@ -397,7 +397,7 @@ function Navbar () {
                         }
                       >
                         {' '}
-                        <h1>Beacon Info</h1>
+                        <h1 className='h1Menu'>Beacon Info</h1>
                       </NavLink>
                     )}
                     {isNetwork && (
@@ -409,7 +409,7 @@ function Navbar () {
                         }
                       >
                         {' '}
-                        <h1>Network members</h1>
+                        <h1 className='h1Menu'>Network members</h1>
                       </NavLink>
                     )}
                     {!isLoggedIn && (
@@ -421,7 +421,7 @@ function Navbar () {
                           isActive ? 'Sign-in5' : 'Sign-in6'
                         }
                       >
-                        <h1>Log in</h1>
+                        <h1 className='h1Menu'>Log in</h1>
                       </NavLink>
                     )}
                     {isLoggedIn && (
@@ -439,7 +439,7 @@ function Navbar () {
                             src='/../logout.png'
                             alt='ls-login-image2'
                           />
-                          <h1>Log out</h1>
+                          <h1 className='h1Menu'>Log out</h1>
                         </NavLink>
 
                         <h5 className='userNameSmallScreen'>
diff --git a/frontend/src/components/Results/BiosamplesResults/TableResultsBiosamples.js b/frontend/src/components/Results/BiosamplesResults/TableResultsBiosamples.js
index 1b04fd1..33ff105 100644
--- a/frontend/src/components/Results/BiosamplesResults/TableResultsBiosamples.js
+++ b/frontend/src/components/Results/BiosamplesResults/TableResultsBiosamples.js
@@ -826,136 +826,150 @@ function TableResultsBiosamples (props) {
 
   return (
     <div className='containerBeaconResults'>
-      {showDatsets === true &&
+     {showDatsets === true &&
         props.beaconsList.map((result, beaconIndex) => {
           return (
-            <table className='tableGranularity' key={beaconIndex}>
-              <thead className='theadGranularity'>
-                <tr id='trGranuHeader'>
-                  <th className='thGranularityTitleBeacon'>Beacon</th>
-                  <th className='thGranularityTitle'>Dataset</th>
-                  <th className='thGranularityTitle'>Result</th>
-                </tr>
-              </thead>
-              <tbody className='tbodyGranu'>
-                {props.results.length > 0 &&
-                  props.resultsPerDataset.map((dataset, index2) => {
-                    const totalCount = dataset[3]
-                      ? dataset[3].reduce((acc, count) => acc + count, 0)
-                      : 0
-                    const allTrue = dataset[2]
-                      ? dataset[2].every(booleanElement => booleanElement)
-                      : 'No, sorry'
-
-                    return (
-                      <React.Fragment key={index2}>
-                        <tr
-                          className='trGranuBeacon'
-                          onClick={() => toggleRow(index2)}
-                        >
-                          <td className='tdGranuBeacon'>
-                            {dataset[0]}
-                            {expandedRows.includes(index2) ? (
-                              <ion-icon name='chevron-down-outline'></ion-icon>
-                            ) : (
-                              <ion-icon name='chevron-up-outline'></ion-icon>
+            <>
+              {beaconIndex === 0 && (
+                <table className='tableGranularity' key={beaconIndex}>
+                  <thead className='theadGranularity'>
+                    <tr id='trGranuHeader'>
+                      <th className='thGranularityTitleBeacon'>Beacon</th>
+                      <th className='thGranularityTitle'>Dataset</th>
+                      <th className='thGranularityTitle'>Result</th>
+                    </tr>
+                  </thead>
+                  <tbody className='tbodyGranu'>
+                    {props.results.length > 0 &&
+                      props.resultsPerDataset.map((dataset, index2) => {
+                        const totalCount = dataset[3]
+                          ? dataset[3].reduce((acc, count) => acc + count, 0)
+                          : 0
+                        const allTrue = dataset[2]
+                          ? dataset[2].every(booleanElement => booleanElement)
+                          : 'No, sorry'
+
+                        return (
+                          <React.Fragment key={index2}>
+                            <tr
+                              className='trGranuBeacon'
+                              onClick={() => toggleRow(index2)}
+                            >
+                              <td className='tdGranuBeacon'>
+                                {dataset[0]}
+                                {expandedRows.includes(index2) ? (
+                                  <ion-icon name='chevron-down-outline'></ion-icon>
+                                ) : (
+                                  <ion-icon name='chevron-up-outline'></ion-icon>
+                                )}
+                              </td>
+                              <td className='tdGranuBeacon'></td>
+                              <td className='tdGranuBeacon'>
+                                {props.show === 'boolean'
+                                  ? allTrue
+                                    ? 'YES'
+                                    : 'No, sorry'
+                                  : totalCount}
+                              </td>
+                            </tr>
+                            {expandedRows.includes(index2) && (
+                              <React.Fragment key={`expanded-${index2}`}>
+                                {props.show === 'boolean' &&
+                                  dataset[2].map(
+                                    (booleanElement, booleanIndex) => (
+                                      <tr
+                                        className='trGranu'
+                                        key={`boolean-${booleanIndex}`}
+                                      >
+                                        <td className='tdGranu'></td>
+                                        <td
+                                          className={`tdGranu ${
+                                            booleanElement
+                                              ? 'tdFoundDataset'
+                                              : 'tdNotFoundDataset'
+                                          }`}
+                                        >
+                                          {dataset[1][booleanIndex]}
+                                        </td>
+                                        <td
+                                          className={`tdGranu ${
+                                            booleanElement
+                                              ? 'tdFound'
+                                              : 'tdNotFound'
+                                          }`}
+                                        >
+                                          {booleanElement ? 'YES' : 'No, sorry'}
+                                        </td>
+                                      </tr>
+                                    )
+                                  )}
+                                {props.show === 'count' &&
+                                  dataset[3].map((countElement, countIndex) => (
+                                    <tr
+                                      className='trGranu'
+                                      key={`count-${countIndex}`}
+                                    >
+                                      <td className='tdGranu'></td>
+                                      <td
+                                        className={`tdGranu ${
+                                          countElement !== undefined &&
+                                          countElement !== null &&
+                                          countElement !== 0
+                                            ? 'tdFoundDataset'
+                                            : 'tdNotFoundDataset'
+                                        }`}
+                                      >
+                                        {dataset[1][countIndex]}
+                                      </td>
+                                      <td
+                                        className={`tdGranu ${
+                                          countElement !== undefined &&
+                                          countElement !== null &&
+                                          countElement !== 0
+                                            ? 'tdFound'
+                                            : 'tdNotFound'
+                                        }`}
+                                      >
+                                        {countElement}
+                                      </td>
+                                    </tr>
+                                  ))}
+                              </React.Fragment>
                             )}
-                          </td>
-                          <td className='tdGranuBeacon'></td>
-                          <td className='tdGranuBeacon'>
-                            {props.show === 'boolean'
-                              ? allTrue
-                                ? 'YES'
-                                : 'No, sorry'
-                              : totalCount}
-                          </td>
-                        </tr>
-                        {expandedRows.includes(index2) && (
-                          <React.Fragment key={`expanded-${index2}`}>
-                            {props.show === 'boolean' &&
-                              dataset[2].map((booleanElement, booleanIndex) => (
-                                <tr
-                                  className='trGranu'
-                                  key={`boolean-${booleanIndex}`}
-                                >
-                                  <td className='tdGranu'></td>
-                                  <td
-                                    className={`tdGranu ${
-                                      booleanElement
-                                        ? 'tdFoundDataset'
-                                        : 'tdNotFoundDataset'
-                                    }`}
-                                  >
-                                    {dataset[1][booleanIndex]}
-                                  </td>
-                                  <td
-                                    className={`tdGranu ${
-                                      booleanElement ? 'tdFound' : 'tdNotFound'
-                                    }`}
-                                  >
-                                    {booleanElement ? 'YES' : 'No, sorry'}
-                                  </td>
-                                </tr>
-                              ))}
-                            {props.show === 'count' &&
-                              dataset[3].map((countElement, countIndex) => (
-                                <tr
-                                  className='trGranu'
-                                  key={`count-${countIndex}`}
-                                >
-                                  <td className='tdGranu'></td>
-                                  <td
-                                    className={`tdGranu ${
-                                      countElement !== undefined &&
-                                      countElement !== null &&
-                                      countElement !== 0
-                                        ? 'tdFoundDataset'
-                                        : 'tdNotFoundDataset'
-                                    }`}
-                                  >
-                                    {dataset[1][countIndex]}
-                                  </td>
-                                  <td
-                                    className={`tdGranu ${
-                                      countElement !== undefined &&
-                                      countElement !== null &&
-                                      countElement !== 0
-                                        ? 'tdFound'
-                                        : 'tdNotFound'
-                                    }`}
-                                  >
-                                    {countElement}
-                                  </td>
-                                </tr>
-                              ))}
                           </React.Fragment>
-                        )}
-                      </React.Fragment>
-                    )
-                  })}
-                {props.results.length === 0 && (
-                  <React.Fragment key={beaconIndex}>
-                    <tr
-                      className='trGranuBeacon'
-                      onClick={() => toggleRow(beaconIndex)}
-                    >
-                      <td className='tdGranuBeaconNoResults'>{result.id}</td>
-                      <td className='tdGranuNoResults'></td>
-                      {props.show === 'boolean' && (
-                        <td
-                          className={`tdGranuNoResults ${'tdNotFoundDataset'}`}
-                        >
-                          No, sorry
-                        </td>
-                      )}
-                      {props.show === 'count' && (
-                        <td className={`tdGranu ${'tdNotFound'}`}>0 results</td>
-                      )}
-                    </tr>
-                  </React.Fragment>
-                )}
-              </tbody>
-            </table>
+                        )
+                      })}
+                    {props.results.length === 0 &&
+                      props.beaconsList.map((beacon, index2) => {
+                        const totalCount = 0
+                        const allTrue = 'No, sorry'
+
+                        return (
+                          <React.Fragment key={index2}>
+                            <tr
+                              className='trGranuBeacon'
+                              onClick={() => toggleRow(index2)}
+                            >
+                              <td className='tdGranuBeacon tdNotFoundDataset'>
+                                {beacon.response.name}
+                            
+                              </td>
+                              <td className='tdGranuBeacon'></td>
+                              <td className='tdGranuBeacon tdNotFoundDataset'>
+                                {props.show === 'boolean'
+                                  ? allTrue
+                                    ? 'YES'
+                                    : 'No, sorry'
+                                  : totalCount}
+                              </td>
+                            </tr>
+                          </React.Fragment>
+                        )
+                      })}
+                  </tbody>
+                </table>
+              )}
+            </>
           )
         })}
 
diff --git a/frontend/src/components/Results/IndividualsResults/TableResultsIndividuals.css b/frontend/src/components/Results/IndividualsResults/TableResultsIndividuals.css
index 02a24f5..2205dcf 100644
--- a/frontend/src/components/Results/IndividualsResults/TableResultsIndividuals.css
+++ b/frontend/src/components/Results/IndividualsResults/TableResultsIndividuals.css
@@ -321,11 +321,13 @@ tr {
   width: 328px;
   font-family: sans-serif;
   /* padding: 8px; */
-  text-align: center;
+  /* text-align: center; */
   display: flex;
-  align-items: center;
+  word-break: break-all;
+  /* align-items: center; */
   align-content: center;
-  justify-content: flex-start;
+  /* justify-content: flex-start; */
+
 }
 
 .tdGranuNoResults,
diff --git a/frontend/src/components/Results/IndividualsResults/TableResultsIndividuals.js b/frontend/src/components/Results/IndividualsResults/TableResultsIndividuals.js
index cd6af17..961a766 100644
--- a/frontend/src/components/Results/IndividualsResults/TableResultsIndividuals.js
+++ b/frontend/src/components/Results/IndividualsResults/TableResultsIndividuals.js
@@ -5,7 +5,7 @@ import CrossQueries from '../../CrossQueries/CrossQueries'
 import { FaBars, FaEye, FaEyeSlash } from 'react-icons/fa' // Import icons from react-icons library
 import { FiLayers, FiDownload } from 'react-icons/fi'
 
-function TableResultsIndividuals(props) {
+function TableResultsIndividuals (props) {
   const [showDatsets, setShowDatasets] = useState(false)
   const [showResults, setShowResults] = useState(false)
   const [resultsSelected, setResultsSelected] = useState(props.results)
@@ -53,6 +53,23 @@ function TableResultsIndividuals(props) {
     setMenuVisible(prevState => !prevState)
   }
 
+  const getBeaconName = (beaconId, beaconsList) => {
+    if (beaconId === 'org.progenetix') {
+      beaconId = 'org.progenetix.beacon'
+    }
+    beaconsList.forEach(element => {
+      console.log(element.id)
+    })
+
+    const beacon = beaconsList.find(b => (b.response?.id ?? b.id) === beaconId)
+
+    return beacon
+      ? beacon.response
+        ? beacon.response.name
+        : beacon.name
+      : beacon.id
+  }
+
   const [columnVisibility, setColumnVisibility] = useState({
     IndividualId: true,
     ethnicity: true,
@@ -513,10 +530,13 @@ function TableResultsIndividuals(props) {
                         const totalCount = dataset[3]
                           ? dataset[3].reduce((acc, count) => acc + count, 0)
                           : 0
-                        const allTrue = dataset[2]
-                          ? dataset[2].every(booleanElement => booleanElement)
-                          : 'No, sorry'
-
+                        const hasTrueElement = dataset[2]
+                          ? dataset[2].some(booleanElement => booleanElement)
+                          : false
+                        const beaconName = getBeaconName(
+                          dataset[0],
+                          props.beaconsList
+                        )
                         return (
                           <React.Fragment key={index2}>
                             <tr
@@ -524,7 +544,7 @@ function TableResultsIndividuals(props) {
                               onClick={() => toggleRow(index2)}
                             >
                               <td className='tdGranuBeacon'>
-                                {dataset[0]}
+                                {beaconName}
                                 {expandedRows.includes(index2) ? (
                                   <ion-icon name='chevron-down-outline'></ion-icon>
                                 ) : (
@@ -534,7 +554,7 @@ function TableResultsIndividuals(props) {
                               <td className='tdGranuBeacon'></td>
                               <td className='tdGranuBeacon'>
                                 {props.show === 'boolean'
-                                  ? allTrue
+                                  ? hasTrueElement
                                     ? 'YES'
                                     : 'No, sorry'
                                   : totalCount}
@@ -610,7 +630,7 @@ function TableResultsIndividuals(props) {
                     {props.results.length === 0 &&
                       props.beaconsList.map((beacon, index2) => {
                         const totalCount = 0
-                        const allTrue = 'No, sorry'
+                        const hasTrueElement = false
 
                         return (
                           <React.Fragment key={index2}>
@@ -620,12 +640,11 @@ function TableResultsIndividuals(props) {
                             >
                               <td className='tdGranuBeacon tdNotFoundDataset'>
                                 {beacon.response.name}
-                            
                               </td>
                               <td className='tdGranuBeacon'></td>
                               <td className='tdGranuBeacon tdNotFoundDataset'>
                                 {props.show === 'boolean'
-                                  ? allTrue
+                                  ? hasTrueElement
                                     ? 'YES'
                                     : 'No, sorry'
                                   : totalCount}
diff --git a/frontend/src/components/Results/VariantResults/TableResultsVariant.js b/frontend/src/components/Results/VariantResults/TableResultsVariant.js
index 875f0cd..0f6b99a 100644
--- a/frontend/src/components/Results/VariantResults/TableResultsVariant.js
+++ b/frontend/src/components/Results/VariantResults/TableResultsVariant.js
@@ -481,139 +481,151 @@ function TableResultsVariants (props) {
   return (
     <div className='containerBeaconResults'>
       {showDatsets === true &&
-         props.beaconsList.map((result, beaconIndex) => {
+        props.beaconsList.map((result, beaconIndex) => {
           return (
-            <table className='tableGranularity' key={beaconIndex}>
-              <thead className='theadGranularity'>
-                <tr id='trGranuHeader'>
-                  <th className='thGranularityTitleBeacon'>Beacon</th>
-                  <th className='thGranularityTitle'>Dataset</th>
-                  <th className='thGranularityTitle'>Result</th>
-                </tr>
-              </thead>
-              <tbody className='tbodyGranu'>
-                {props.results.length > 0 &&
-                  props.resultsPerDataset.map((dataset, index2) => {
-                    const totalCount = dataset[3]
-                      ? dataset[3].reduce((acc, count) => acc + count, 0)
-                      : 0
-                    const allTrue = dataset[2]
-                      ? dataset[2].every(booleanElement => booleanElement)
-                      : 'No, sorry'
-
-                    return (
-                      <React.Fragment key={index2}>
-                        <tr
-                          className='trGranuBeacon'
-                          onClick={() => toggleRow(index2)}
-                        >
-                          <td className='tdGranuBeacon'>
-                            {dataset[0]}
-                            {expandedRows.includes(index2) ? (
-                              <ion-icon name='chevron-down-outline'></ion-icon>
-                            ) : (
-                              <ion-icon name='chevron-up-outline'></ion-icon>
+            <>
+              {beaconIndex === 0 && (
+                <table className='tableGranularity' key={beaconIndex}>
+                  <thead className='theadGranularity'>
+                    <tr id='trGranuHeader'>
+                      <th className='thGranularityTitleBeacon'>Beacon</th>
+                      <th className='thGranularityTitle'>Dataset</th>
+                      <th className='thGranularityTitle'>Result</th>
+                    </tr>
+                  </thead>
+                  <tbody className='tbodyGranu'>
+                    {props.results.length > 0 &&
+                      props.resultsPerDataset.map((dataset, index2) => {
+                        const totalCount = dataset[3]
+                          ? dataset[3].reduce((acc, count) => acc + count, 0)
+                          : 0
+                        const allTrue = dataset[2]
+                          ? dataset[2].every(booleanElement => booleanElement)
+                          : 'No, sorry'
+
+                        return (
+                          <React.Fragment key={index2}>
+                            <tr
+                              className='trGranuBeacon'
+                              onClick={() => toggleRow(index2)}
+                            >
+                              <td className='tdGranuBeacon'>
+                                {dataset[0]}
+                                {expandedRows.includes(index2) ? (
+                                  <ion-icon name='chevron-down-outline'></ion-icon>
+                                ) : (
+                                  <ion-icon name='chevron-up-outline'></ion-icon>
+                                )}
+                              </td>
+                              <td className='tdGranuBeacon'></td>
+                              <td className='tdGranuBeacon'>
+                                {props.show === 'boolean'
+                                  ? allTrue
+                                    ? 'YES'
+                                    : 'No, sorry'
+                                  : totalCount}
+                              </td>
+                            </tr>
+                            {expandedRows.includes(index2) && (
+                              <React.Fragment key={`expanded-${index2}`}>
+                                {props.show === 'boolean' &&
+                                  dataset[2].map(
+                                    (booleanElement, booleanIndex) => (
+                                      <tr
+                                        className='trGranu'
+                                        key={`boolean-${booleanIndex}`}
+                                      >
+                                        <td className='tdGranu'></td>
+                                        <td
+                                          className={`tdGranu ${
+                                            booleanElement
+                                              ? 'tdFoundDataset'
+                                              : 'tdNotFoundDataset'
+                                          }`}
+                                        >
+                                          {dataset[1][booleanIndex]}
+                                        </td>
+                                        <td
+                                          className={`tdGranu ${
+                                            booleanElement
+                                              ? 'tdFound'
+                                              : 'tdNotFound'
+                                          }`}
+                                        >
+                                          {booleanElement ? 'YES' : 'No, sorry'}
+                                        </td>
+                                      </tr>
+                                    )
+                                  )}
+                                {props.show === 'count' &&
+                                  dataset[3].map((countElement, countIndex) => (
+                                    <tr
+                                      className='trGranu'
+                                      key={`count-${countIndex}`}
+                                    >
+                                      <td className='tdGranu'></td>
+                                      <td
+                                        className={`tdGranu ${
+                                          countElement !== undefined &&
+                                          countElement !== null &&
+                                          countElement !== 0
+                                            ? 'tdFoundDataset'
+                                            : 'tdNotFoundDataset'
+                                        }`}
+                                      >
+                                        {dataset[1][countIndex]}
+                                      </td>
+                                      <td
+                                        className={`tdGranu ${
+                                          countElement !== undefined &&
+                                          countElement !== null &&
+                                          countElement !== 0
+                                            ? 'tdFound'
+                                            : 'tdNotFound'
+                                        }`}
+                                      >
+                                        {countElement}
+                                      </td>
+                                    </tr>
+                                  ))}
+                              </React.Fragment>
                             )}
-                          </td>
-                          <td className='tdGranuBeacon'></td>
-                          <td className='tdGranuBeacon'>
-                            {props.show === 'boolean'
-                              ? allTrue
-                                ? 'YES'
-                                : 'No, sorry'
-                              : totalCount}
-                          </td>
-                        </tr>
-                        {expandedRows.includes(index2) && (
-                          <React.Fragment key={`expanded-${index2}`}>
-                            {props.show === 'boolean' &&
-                              dataset[2].map((booleanElement, booleanIndex) => (
-                                <tr
-                                  className='trGranu'
-                                  key={`boolean-${booleanIndex}`}
-                                >
-                                  <td className='tdGranu'></td>
-                                  <td
-                                    className={`tdGranu ${
-                                      booleanElement
-                                        ? 'tdFoundDataset'
-                                        : 'tdNotFoundDataset'
-                                    }`}
-                                  >
-                                    {dataset[1][booleanIndex]}
-                                  </td>
-                                  <td
-                                    className={`tdGranu ${
-                                      booleanElement ? 'tdFound' : 'tdNotFound'
-                                    }`}
-                                  >
-                                    {booleanElement ? 'YES' : 'No, sorry'}
-                                  </td>
-                                </tr>
-                              ))}
-                            {props.show === 'count' &&
-                              dataset[3].map((countElement, countIndex) => (
-                                <tr
-                                  className='trGranu'
-                                  key={`count-${countIndex}`}
-                                >
-                                  <td className='tdGranu'></td>
-                                  <td
-                                    className={`tdGranu ${
-                                      countElement !== undefined &&
-                                      countElement !== null &&
-                                      countElement !== 0
-                                        ? 'tdFoundDataset'
-                                        : 'tdNotFoundDataset'
-                                    }`}
-                                  >
-                                    {dataset[1][countIndex]}
-                                  </td>
-                                  <td
-                                    className={`tdGranu ${
-                                      countElement !== undefined &&
-                                      countElement !== null &&
-                                      countElement !== 0
-                                        ? 'tdFound'
-                                        : 'tdNotFound'
-                                    }`}
-                                  >
-                                    {countElement}
-                                  </td>
-                                </tr>
-                              ))}
                           </React.Fragment>
-                        )}
-                      </React.Fragment>
-                    )
-                  })}
-                {props.results.length === 0 && (
-                  <React.Fragment key={beaconIndex}>
-                    <tr
-                      className='trGranuBeacon'
-                      onClick={() => toggleRow(beaconIndex)}
-                    >
-                      <td className='tdGranuBeaconNoResults'>{result.id}</td>
-                      <td className='tdGranuNoResults'></td>
-                      {props.show === 'boolean' && (
-                        <td
-                          className={`tdGranuNoResults ${'tdNotFoundDataset'}`}
-                        >
-                          No, sorry
-                        </td>
-                      )}
-                      {props.show === 'count' && (
-                        <td className={`tdGranu ${'tdNotFound'}`}>0 results</td>
-                      )}
-                    </tr>
-                  </React.Fragment>
-                )}
-              </tbody>
-            </table>
+                        )
+                      })}
+                    {props.results.length === 0 &&
+                      props.beaconsList.map((beacon, index2) => {
+                        const totalCount = 0
+                        const allTrue = 'No, sorry'
+
+                        return (
+                          <React.Fragment key={index2}>
+                            <tr
+                              className='trGranuBeacon'
+                              onClick={() => toggleRow(index2)}
+                            >
+                              <td className='tdGranuBeacon tdNotFoundDataset'>
+                                {beacon.response.name}
+                              </td>
+                              <td className='tdGranuBeacon'></td>
+                              <td className='tdGranuBeacon tdNotFoundDataset'>
+                                {props.show === 'boolean'
+                                  ? allTrue
+                                    ? 'YES'
+                                    : 'No, sorry'
+                                  : totalCount}
+                              </td>
+                            </tr>
+                          </React.Fragment>
+                        )
+                      })}
+                  </tbody>
+                </table>
+              )}
+            </>
           )
         })}
 
-
       {!showCrossQuery &&
         showDatsets === false &&
         props.results.length > 0 &&
@@ -1001,7 +1013,7 @@ function TableResultsVariants (props) {
         !showCrossQuery && (
           <h5 className='noResultsFullResponse'>No results, sorry.</h5>
         )}
-        
+
       {showCrossQuery && (
         <CrossQueries
           parameter={parameterCrossQuery}
diff --git a/frontend/src/config-examples-cancer.json b/frontend/src/config-examples-cancer.json
index 6d292f8..b8db337 100644
--- a/frontend/src/config-examples-cancer.json
+++ b/frontend/src/config-examples-cancer.json
@@ -326,8 +326,8 @@
               "subTitle": "Mutations in:",
               "subTitle2": "gene:",
               "label": "KRAS",
-              "value": "KRAS",
-              "schemaField": "geneId"
+              "value": "molecularAttributes.geneIds=KRAS",
+              "schemaField": "molecularAttributes.geneIds"
             }
           ]
         ]
diff --git a/frontend/src/config-examples-covid.json b/frontend/src/config-examples-covid.json
index bfc4981..e8a4404 100644
--- a/frontend/src/config-examples-covid.json
+++ b/frontend/src/config-examples-covid.json
@@ -29,24 +29,6 @@
             "type": "alphanumeric",
             "schemaField": "diseases.ageOfOnset.iso8601duration"
           }
-        ],
-        [
-          {
-            "label": "Weight",
-            "value": "Weight",
-            "ontology": "",
-            "type": "alphanumeric",
-            "schemaField": "measures.assayCode"
-          }
-        ],
-        [
-          {
-            "label": "Height",
-            "value": "Height",
-            "ontology": "",
-            "type": "alphanumeric",
-            "schemaField": "measures.assayCode"
-          }
         ]
       ]
     },
diff --git a/frontend/src/config.json b/frontend/src/config.json
index ceb1a2f..412e2e2 100644
--- a/frontend/src/config.json
+++ b/frontend/src/config.json
@@ -1,5 +1,5 @@
 {
-  "API_URL": "https://beacon-network-backend-demo.ega-archive.org/beacon-network/v2.0.0",
-  "REDIRECT_URL": "https://beacon-network-demo.ega-archive.org/",
+  "API_URL": "https://beacon-apis-test.ega-archive.org/api",
+  "REDIRECT_URL": "http://localhost:3000/",
   "KEYCLOAK_URL": "https://beacon-network-demo2.ega-archive.org"
 }
\ No newline at end of file