diff --git a/cnf-certification-test/webserver/index.html b/cnf-certification-test/webserver/index.html
index 100d1377e..9b05c387a 100644
--- a/cnf-certification-test/webserver/index.html
+++ b/cnf-certification-test/webserver/index.html
@@ -139,6 +139,14 @@
         opacity: var(--main-opacity, 1);
         transition: opacity 200ms ease;
       }
+       h4 input[type="checkbox"] {
+            display: inline-block;
+        }
+
+        h4 label {
+            display: inline-block;
+            margin-left: 8px; /* Adjust margin as needed */
+        }
     </style>
 
       <script type="module">
@@ -158,6 +166,8 @@
       import '@rhds/elements/rh-table/rh-table.js';
       import '@rhds/elements/rh-blockquote/rh-blockquote.js';
       import '@rhds/elements/rh-accordion/rh-accordion.js';
+      import '@rhds/elements/rh-tabs/rh-tabs.js';
+
       // set up interactive elements
       // use dynamic import to improve page load times
       document.getElementById('logs').addEventListener('open', () => import('./logs.js'));
@@ -278,7 +288,16 @@ <h1>CNF Certification Test</h1>
         <fieldset>
           <legend>Select a Test</legend>
 
-          <legend id="selectComboBox"> Selcet a Test Tag <select name="class" id="selectScenarioComboBox" onchange="selectScenario()">
+          <legend id="selectComboBox"> Selcet a Test Tag <select name="class" id="selectScenarioComboBox" onchange="   
+            selectScenario('lifecycle')
+            selectScenario('manageability')
+            selectScenario('affiliated-certification')
+            selectScenario('operator')
+            selectScenario('access-control')
+            selectScenario('platform-alteration')
+            selectScenario('networking')
+            selectScenario('performance')
+            selectScenario('observability')">
           
             <option value="all"> All</option>
             <option value="faredge"> Far-Edge</option>
@@ -287,60 +306,133 @@ <h1>CNF Certification Test</h1>
             <option value="extended"> Extended</option>
 
           </select>
-          <select name="class" id="selectOpt" onchange="selectScenario()" hidden>
+          <select name="class" id="selectOpt" onchange="        
+          selectScenario('lifecycle')
+          selectScenario('manageability')
+          selectScenario('affiliated-certification')
+          selectScenario('operator')
+          selectScenario('access-control')
+          selectScenario('platform-alteration')
+          selectScenario('networking')
+          selectScenario('performance')
+          selectScenario('observability')" hidden>
             <option value="Mandatory"> Mandatory</option>
             <option value="Optional"> Optional</option>
          
           </select>
-
         </legend>
-          <label id="selectedsuites" hidden>
-          <h4>Filter a Suite Test</h4>
-          <div id="checkboxContainer">
-            <input type="checkbox"
-                   value="lifecycle"
-                   name="selectedOptionstest" id ="lifecycle"  checked 
-                   onclick="performToggle('lifecycle')"> <label for="lifecycle">Lifecycle</label>
-            <input type="checkbox"
-            value="manageability"
-            name="selectedOptionstest" checked id ="manageability" 
-            onclick="performToggle('manageability')"><label for="manageability">Manageability</label>
-            <input type="checkbox"
-                   value="affiliated-certification"
-                   name="selectedOptionstest" checked id ="affiliated-certification"
-                    onclick="performToggle('affiliated-certification')"><label for="affiliated-certification">Certification</label>
-            <input type="checkbox"
-            value="operator"
-            name="selectedOptionstest" checked id ="operator"
-             onclick="performToggle('operator')"><label for="operator">Operator</label>               
-            <input type="checkbox"
-                   value="access-control"
-                   name="selectedOptionstest" checked id ="access-control"
-                    onclick="performToggle('access-control')"><label for="access-control">Access Control</label>
-            <input type="checkbox"
-            value="platform-alteration"
-            name="selectedOptionstest" checked id ="platform-alteration"
-            onclick="performToggle('platform-alteration')"><label for="platform-alteration">Platform Alteration</label>   
-            <input type="checkbox"
-                   value="networking"
-                   name="selectedOptionstest" checked id ="networking"
-                   onclick="performToggle('networking')" > <label for="networking">Networking</label>
-            <input type="checkbox"
-            value="performance"
-            name="selectedOptionstest" checked id ="performance"
-            onclick="performToggle('performance')"> <label for="performance">performance</label> 
-            <input type="checkbox"
-            value="observability"
-            name="selectedOptionstest" checked id ="observability"
-            onclick="performToggle('observability')"><label for="observability">Observability</label>   
-          </div>   
-          </label><br>   
-          <rh-table>
-            <table class="table" id="testTable" >
-            </table>
-          </rh-table>
-        </fieldset>
-
+        <br>
+        <rh-tabs>
+            <rh-tab slot="tab" onclick="show('lifecycle')"> Lifecycle</rh-tab>
+                   <rh-tab-panel >
+                    <input type="checkbox"
+                    value="lifecycle"
+                    name="selectedOptionstest" id ="lifecycle"  checked 
+                    onclick="performToggle('lifecycle')"><label for="lifecycle">Select/UnSelect All Lifecycle</label>
+                    <rh-table>
+  
+                      <table class="table" id="lifecycle-table" >
+                        
+                      </table>
+                    </rh-table>
+                  </rh-tab-panel>
+
+                  <rh-tab slot="tab" onclick="show('manageability')">Manageability</rh-tab>
+                           <rh-tab-panel >
+                            <input type="checkbox"
+                            value="manageability"
+                            name="selectedOptionstest" id ="manageability"  checked 
+                            onclick="performToggle('manageability')"> <label for="manageability">Select/UnSelect All Manageability</label>
+                            <rh-table>
+                              <table class="table" id="manageability-table" hidden >
+                              </table>
+                            </rh-table>
+                          </rh-tab-panel>
+
+      <rh-tab slot="tab" onclick="show('affiliated-certification')">Certification</rh-tab>
+                <rh-tab-panel >
+                  <input type="checkbox"
+                  value="affiliated-certification"
+                  name="selectedOptionstest" id ="affiliated-certification"  checked 
+                  onclick="performToggle('affiliated-certification')"> <label for="affiliated-certification">Select/UnSelect All Certification</label>
+                <rh-table>
+                  <table class="table" id="affiliated-certification-table" hidden>
+                  </table>
+                </rh-table>
+              </rh-tab-panel>
+                      
+      <rh-tab slot="tab" onclick="show('operator')">Operator</rh-tab>
+                <rh-tab-panel >
+                  <input type="checkbox"
+                  value="operator"
+                  name="selectedOptionstest" id ="operator"  checked 
+                  onclick="performToggle('operator')"> <label for="operator">Select/UnSelect All Operator</label>
+                <rh-table>
+                  <table class="table" id="operator-table" hidden>
+                  </table>
+                </rh-table>
+              </rh-tab-panel>
+
+
+              <rh-tab slot="tab" onclick="show('access-control')">Access Control </rh-tab>
+                        <rh-tab-panel >
+                          <input type="checkbox"
+                          value="access-control"
+                          name="selectedOptionstest" id ="access-control"  checked 
+                          onclick="performToggle('access-control')"> <label for="operator">Select/UnSelect All Access Control</label>
+                        <rh-table>
+                          <table class="table" id="access-control-table" hidden >
+                          </table>
+                        </rh-table>
+                      </rh-tab-panel>       
+                      
+                      <rh-tab slot="tab" onclick="show('platform-alteration')">Platform Alteration</rh-tab>
+                                <rh-tab-panel >
+                                  <input type="checkbox"
+                                  value="platform-alteration"
+                                  name="selectedOptionstest" id ="platform-alteration"  checked 
+                                  onclick="performToggle('platform-alteration')"> <label for="platform-alteration">Select/UnSelect All Platform Alteration</label>
+                                <rh-table>
+                                  <table class="table" id="platform-alteration-table" hidden>
+                                  </table>
+                                </rh-table>
+                              </rh-tab-panel>   
+    <rh-tab slot="tab" onclick="show('networking')">Networking</rh-tab>
+                      <rh-tab-panel >
+                        <input type="checkbox"
+                        value="networking"
+                        name="selectedOptionstest" id ="networking"  checked 
+                        onclick="performToggle('networking')"> <label for="networking">Select/UnSelect All Networking</label>
+                      <rh-table>
+                        <table class="table" id="networking-table" hidden>
+                        </table>
+                      </rh-table>
+                    </rh-tab-panel> 
+                    <rh-tab slot="tab" onclick="show('performance')">Performance</rh-tab>
+                              <rh-tab-panel >
+                                <input type="checkbox"
+                                value="performance"
+                                name="selectedOptionstest" id ="performance"  checked 
+                                onclick="performToggle('performance')"> <label for="performance">Select/UnSelect All Performance</label>
+                              <rh-table>
+                                <table class="table" id="performance-table" hidden>
+                                </table>
+                              </rh-table>
+                            </rh-tab-panel> 
+                            <rh-tab slot="tab" onclick="show('observability')">Observability</rh-tab>
+                                      <rh-tab-panel >
+                                        <input type="checkbox"
+                                        value="observability"
+                                        name="selectedOptionstest" id ="observability"  checked 
+                                        onclick="performToggle('observability')"> <label for="observability">Select/UnSelect All Observability</label>
+                                      <rh-table>
+                                        <table class="table" id="observability-table" hidden>
+                                        </table>
+                                      </rh-table>
+                                    </rh-tab-panel>    
+        </rh-tabs> 
+      
+      </fieldset>
         <rh-button type="submit" name="submit">Run Certification Test</rh-button>
       </form>
       <rh-button id="show-logs" type="button" variant="secondary">Show Log</rh-button>
diff --git a/cnf-certification-test/webserver/index.js b/cnf-certification-test/webserver/index.js
index 4bddf534e..2726a542a 100644
--- a/cnf-certification-test/webserver/index.js
+++ b/cnf-certification-test/webserver/index.js
@@ -34,7 +34,15 @@ function addCrdElem(counters,name1,name2,clickedId){
  
 
   $(document).ready(function() {
-    selectScenario() // initilaize with all
+    selectScenario('lifecycle')
+    selectScenario('manageability')
+    selectScenario('affiliated-certification')
+    selectScenario('operator')
+    selectScenario('access-control')
+    selectScenario('platform-alteration')
+    selectScenario('networking')
+    selectScenario('performance')
+    selectScenario('observability')
     document.getElementById('targetNameSpacesremove').style.display = 'none';
     document.getElementById('podsUnderTestLabelsremove').style.display = 'none';
     document.getElementById('operatorsUnderTestLabelsremove').style.display = 'none';
@@ -222,19 +230,10 @@ var field='<label for="'+clickedId+counters[clickedId] +'">'+counters[clickedId]
 
  } 
 
-function selectScenario(){
-  
-  $('#testTable').empty()
-  var beginning='<caption> Select a Suite Name </caption> <colgroup> '+
-  '<col style="width: 200px;">'+
-   '<col>'+
-    '</colgroup>'+
-  '<thead><tr> <th style="width: 200px;" scope="col" data-label="Testname">Test Name<rh-sort-button></rh-sort-button></th>'+
-    '<th style="width: 500px;" scope="col" data-label="Description">Test Info</th>'+
-    '</tr></thead>'
-    $(beginning).appendTo('#testTable');
-
-  addCheckedTest()
+function selectScenario(table){
+  var idtable = '#'+table+'-table'
+  $(idtable).empty()
+ // addCheckedTest()
   var field = ""
   const selectScenarioComboBox = document.getElementById('selectScenarioComboBox')
   const selectedValue = selectScenarioComboBox.options[selectScenarioComboBox.selectedIndex].value
@@ -242,30 +241,34 @@ function selectScenario(){
     document.getElementById('selectOpt').setAttribute('hidden','hidden')
 
   for (const key in classification) {
-    field='<tr id="'+key+'"><td data-label="Testname"><label><input type="checkbox" value="'+
-     key +'" name="selectedOptions" checked> ' +
-    '<h7 for="'+key+'">'+key+
-    '</h7></label></td>'+
-    '<td data-label="Description"><rh-accordion>'+
-    '<rh-accordion-header><h4>Description</h4></rh-accordion-header><rh-accordion-panel><p>'+
-    classification[key][0].description+'</p></rh-accordion-panel>'+
-    '<rh-accordion-header><h4>Remediation</h4></rh-accordion-header><rh-accordion-panel><p>'+
-    classification[key][0].remediation+'</p></rh-accordion-panel>'+
-    '<rh-accordion-header><h4>BestPracticeReference</h4></rh-accordion-header><rh-accordion-panel><p>'+
-    classification[key][0].bestPracticeReference+'</p></rh-accordion-panel>'+
-    '</rh-accordion></td>'+
-    '</tr>'
-      $(field).appendTo('#testTable');
+    if (key.startsWith(table)){
+
+      field=
+      '<rh-accordion><rh-accordion-header><div>'+    
+      '<input type="checkbox" id ="'+key+ '" value="'+
+      key +'" name="selectedOptions" checked> ' +
+      '<label for="'+key+ '">'+key+'</label>'+
+      '</div></rh-accordion-header>'+
+      '<rh-accordion-panel><h4>Description </h4><p>'+
+      classification[key][0].description+'</p>'+
+      '<h4>Remediation</h4><p>'+
+      classification[key][0].remediation+'</p>'+
+      '<h4>BestPracticeReference</h4><p>'+
+      classification[key][0].bestPracticeReference+'</p></rh-accordion-panel>'+
+      '</rh-accordion>'
+      $(field).appendTo(idtable);
+    }
   }
 
   }else{ 
-  document.getElementById('selectOpt').removeAttribute('hidden')
-  buildTest(selectedValue)
+    document.getElementById('selectOpt').removeAttribute('hidden')
+
+  buildTest(selectedValue,table)
   }
-  document.getElementById('selectedsuites').removeAttribute('hidden')
 
 }
-function buildTest(scenarioValue){
+function buildTest(scenarioValue,table){
+  var idtable = '#'+table+'-table'
   const option = document.getElementById('selectOpt')
   const selectedValue = option.options[option.selectedIndex].value
   console.log(selectedValue)
@@ -283,57 +286,92 @@ for (const key in classification){
     eqData = classification[key][0]["categoryClassification"].Extended
   }
   if(eqData == selectedValue){
-    field='<tr id="'+key+'"><td data-label="Testname"><label><input type="checkbox" value="'+
-     key +'" name="selectedOptions" checked> ' +
-    '<h7 for="'+key+'">'+key+
-    '</h7></label></td>'+
-    '<td data-label="Description"><rh-accordion>'+
-    '<rh-accordion-header><h4>Description</h4></rh-accordion-header><rh-accordion-panel><p>'+
-    classification[key][0].description+'</p></rh-accordion-panel>'+
-    '<rh-accordion-header><h4>Remediation</h4></rh-accordion-header><rh-accordion-panel><p>'+
-    classification[key][0].remediation+'</p></rh-accordion-panel>'+
-    '<rh-accordion-header><h4>BestPracticeReference</h4></rh-accordion-header><rh-accordion-panel><p>'+
+    if (key.startsWith(table)){
+    field=
+    '<rh-accordion><rh-accordion-header><div>'+    
+    '<input type="checkbox" id ="'+key+ '" value="'+
+    key +'" name="selectedOptions" checked> ' +
+    '<label for="'+key+ '">'+key+'</label>'+
+    '</div></rh-accordion-header>'+
+    '<rh-accordion-panel><h4>Description </h4><p>'+
+    classification[key][0].description+'</p>'+
+    '<h4>Remediation</h4><p>'+
+    classification[key][0].remediation+'</p>'+
+    '<h4>BestPracticeReference</h4><p>'+
     classification[key][0].bestPracticeReference+'</p></rh-accordion-panel>'+
-    '</rh-accordion></td>'+
-    '</tr>'
-     $(field).appendTo('#testTable');
+    '</rh-accordion>'
+     $(field).appendTo(idtable);
+    }
   }
 }
 }
 
+function show(id){
+
+   if (id !="lifecycle"){
+    document.getElementById('lifecycle-table').setAttribute('hidden','hidden')
+
+   }
+   if (id !="manageability"){
+    document.getElementById('manageability-table').setAttribute('hidden','hidden')
+
+   }   
+   if (id !="affiliated-certification"){
+    document.getElementById('affiliated-certification-table').setAttribute('hidden','hidden')
+
+   }
+   if (id !="operator"){
+    document.getElementById('operator-table').setAttribute('hidden','hidden')
+
+   }
+   if (id !="access-control"){
+    document.getElementById('access-control-table').setAttribute('hidden','hidden')
+
+   }
+   if (id !="platform-alteration"){
+    document.getElementById('platform-alteration-table').setAttribute('hidden','hidden')
+
+   }
+   if (id !="networking"){
+    document.getElementById('networking-table').setAttribute('hidden','hidden')
+
+   }
+   if (id !="performance"){
+    document.getElementById('performance-table').setAttribute('hidden','hidden')
+
+   }
+   if (id !="observability"){
+    document.getElementById('observability-table').setAttribute('hidden','hidden')
+   }
+   document.getElementById(id+'-table').removeAttribute('hidden')
+   if (id =="performance"){
+    document.getElementById('performance-table').removeAttribute('hidden')
+
+   }
+}
+
 // Add an event listener to the checkbox
 function performToggle (triggerId) {
   var checkbox = document.getElementById(triggerId);
 var field = ""
   for (const key in classification) {
     var done=false
+  
     if (key.startsWith(triggerId)){
     if (checkbox.checked) {
-      field='<tr id="'+key+'"><td data-label="Testname"><label><input type="checkbox" value="'+
-      key +'" name="selectedOptions" checked> ' +
-     '<h7 for="'+key+'">'+key+
-     '</h7></label></td>'+
-     '<td data-label="Description"><rh-accordion>'+
-     '<rh-accordion-header><h4>Description</h4></rh-accordion-header><rh-accordion-panel><p>'+
-     classification[key][0].description+'</p></rh-accordion-panel>'+
-     '<rh-accordion-header><h4>Remediation</h4></rh-accordion-header><rh-accordion-panel><p>'+
-     classification[key][0].remediation+'</p></rh-accordion-panel>'+
-     '<rh-accordion-header><h4>BestPracticeReference</h4></rh-accordion-header><rh-accordion-panel><p>'+
-     classification[key][0].bestPracticeReference+'</p></rh-accordion-panel>'+
-     '</rh-accordion></td>'+
-     '</tr>'
-      $(field).appendTo('#testTable');
-       field = ""
-    } else {
-      var tbody = document.querySelector('#testTable tbody');
-
       var rowToRemove = document.getElementById(key);
+      if (rowToRemove) {
+      rowToRemove.checked = true;
+      }
+
 
+    } else {
+      var rowToRemove = document.getElementById(key); 
       // Check if the row exists
       if (rowToRemove) {
           // Remove the row from the table
-          tbody.removeChild(rowToRemove);
-      }
+          rowToRemove.checked = false;
+        }
     }
   }
 }