diff --git a/_includes/static/navbar.html b/_includes/static/navbar.html
index f348ee6a..4cd3f96f 100755
--- a/_includes/static/navbar.html
+++ b/_includes/static/navbar.html
@@ -23,11 +23,19 @@
                 </div>
               </form>
             </div>
-            <div class="col-sm-8">
+            <div class="column col-sm-8">
               <ul class="navbar-nav">
                 <li class="nav-item"><a href="../../" class="nav-link nav-btn-hover">Home</a></li>
                 <li class="nav-item"><a href="../../history/" class="nav-link nav-btn-hover">History</a></li>
                 <li class="nav-item"><a href="../../contact_us/" class="nav-link nav-btn-hover">Contact Us</a></li>
+                <div class="dropdown nav-btn-hover">
+                  <button class="dropbtn">Societies <svg xmlns="http://www.w3.org/2000/svg" width="8" height="8" fill="currentColor" class="bi bi-caret-down-fill" viewBox="0 0 16 16">
+                    <path d="M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z"/>
+                  </svg></button>
+                  <div class="dropdown-content">
+                    <a class="dropdown-items" href="../../acf/">Computer Fraternity</a>
+                  </div>
+                </div>
               </ul>
             </div>
           </div>
diff --git a/assets/css/custom.css b/assets/css/custom.css
index bb9ed6ed..656deba8 100755
--- a/assets/css/custom.css
+++ b/assets/css/custom.css
@@ -40,6 +40,60 @@
   color: #00316A;
 }
 
+.dropbtn {
+  color: #495057;
+  padding: 13px;
+  font-size: 12px;
+  border: none;
+  border-radius: 3px;
+  text-transform: uppercase;
+  background-color: #fcfcfc;
+}
+
+.dropdown {
+  position: relative;
+  display: inline-block;
+  width: 100%;
+  border-radius: 3px;
+}
+
+.dropdown-content {
+  background-color: rgb(253, 253, 253);
+  display: none;
+  position: absolute;
+  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+  z-index: 1;
+  min-width: 9.5rem;
+  padding: 6px;
+  border-radius: 3px; 
+}
+
+.dropdown-content a {
+  color: #212529;
+  text-align: center;
+  text-decoration: none;
+  display: block;
+  border-radius: 0.25rem;
+  padding: 6px 10px;
+  font-size: 13px;  
+  height: 35px;
+  background-color: rgb(245, 245, 245);
+}
+
+.dropdown-content a:hover {
+  background-color: #00c8e2;
+  color: white;
+  box-shadow: 0px 1px 8px 0px #00bcd4;
+}
+
+.dropdown:hover .dropdown-content {
+  display: block;
+}
+
+.dropdown:hover .dropbtn {
+  background-color: #dedede;
+}
+
 .contact-us .google-map {
   position: relative;
   bottom: 8px;
@@ -112,6 +166,9 @@
     z-index: 99;
   }
 
+  .dropdown-content {
+    width: 100%;
+  }
 }
 
 .page-header .btn-primary{
diff --git a/assets/css/material-kit.css b/assets/css/material-kit.css
index aba69708..15b87c84 100644
--- a/assets/css/material-kit.css
+++ b/assets/css/material-kit.css
@@ -3779,6 +3779,7 @@ tbody.collapse.show {
 .nav-link {
   display: block;
   padding: 0.5rem 1rem;
+  white-space: nowrap;
 }
 .nav-link:hover, .nav-link:focus {
   text-decoration: none;