diff --git a/public/index.html b/public/index.html
index f48cfe9efa3d1249cb91391969e05d1636d070d3..dca636324dec46651e9d517af4865bf3e9e6a007 100644
--- a/public/index.html
+++ b/public/index.html
@@ -80,6 +80,23 @@
 
           </select>
           <div id="category-validation" class="error-message">Please select the category.</div>
+          <div class="more-information">
+            <div>
+              <h4> <span>&#9432;</span> More Information</h4>
+            </div>
+            <div>
+              <div>1) Mixed-ability group: It represents a standard classroom that includes learners whose average
+                scores in English range from 0 to 20.</div>
+              <div>2) High-ability group: This category represents learners of a very good level of English. This can be
+                determined by the English school average scale 16-20.</div>
+              <div>3) Good-ability group: This category represents learners of good level of English. This can be
+                determined by the English school average scale 13-15.99.</div>
+              <div>4) Average-ability group: This category includes learners of average level of English. This can be
+                determined by the English average scale 10-13.99.</div>
+              <div>5) Low-ability group: This category includes learners of low level of English. This can be determined
+                by the English school average that is lower than 10.</div>
+            </div>
+          </div>
         </div>
         <div>
           <div>
diff --git a/public/style.css b/public/style.css
index 3067a00ae820579ebebffc8b5d7b0b1ac4999041..82f1b2890b11f3351621c3dec61b9f2e3aeb7dde 100644
--- a/public/style.css
+++ b/public/style.css
@@ -132,3 +132,8 @@ button:hover {
   display: none;
 }
 
+.more-information {
+  font-size: 12px;
+  font-style: italic;
+}
+