diff --git a/css/style.css b/css/style.css
index 1683dc5..b29172a 100644
--- a/css/style.css
+++ b/css/style.css
@@ -56,6 +56,11 @@ h5
 {
     width:23%;
 }
+.link-card-a
+{
+    width:100%;
+
+}
 
 @media (max-width: 500px) {
     .link-card {
diff --git a/images/dd-thumbnail.png b/images/dd-thumbnail.png
new file mode 100644
index 0000000..3a9a11a
Binary files /dev/null and b/images/dd-thumbnail.png differ
diff --git a/images/dms-thumbnail.png b/images/dms-thumbnail.png
new file mode 100644
index 0000000..d0bf337
Binary files /dev/null and b/images/dms-thumbnail.png differ
diff --git a/images/emat101-thumbnail.png b/images/emat101-thumbnail.png
new file mode 100644
index 0000000..33b7320
Binary files /dev/null and b/images/emat101-thumbnail.png differ
diff --git a/images/java-thumbnail.png b/images/java-thumbnail.png
new file mode 100644
index 0000000..995ebd1
Binary files /dev/null and b/images/java-thumbnail.png differ
diff --git a/index.html b/index.html
index 09ee6d3..e8137a0 100644
--- a/index.html
+++ b/index.html
@@ -19,13 +19,13 @@
     <div class="container-fluid p-0 d-flex h-100">
         <div id="bdSidebar" class="d-flex flex-column flex-shrink-0 p-3 text-dark bg-slate offcanvas-md offcanvas-start" style="width: 280px;">
             <a href="#" class="navbar-brand">
-                <h4> <i class="fa-solid fa-book me-2"></i>  BU Notes</h4>
+                <h4> <i class="fa-solid fa-book-open-reader me-2"></i> BU Notes</h4>
             </a>
             <hr>
             <ul class="mynav nav nav-pills flex-column mb-auto">
                 <li class="nav-item mb-1">
                     <a href="" class="active">
-                        <i class="fa-solid fa-house"></i>
+                        <i class="fa-solid fa-house"  ></i>
                         Home
                     </a>
                 </li>
@@ -89,7 +89,7 @@ <h5><span><i class="fa-solid fa-house me-3"></i></span>Home page</h5>
                 <hr>
                 <div class="pt-3">
                   <h5>Quick Links</h5>
-                  <div class="d-md-flex px-10 py-3" style="justify-content: space-between;">
+                  <div class="d-md-flex px-10 py-3 mb-3" style="justify-content: space-between;">
                     <a href="" class="px-3 py-4 bg-slate link-card rounded d-flex">
                         <i class="fa-solid fa-book p-3 bg-green rounded" style="font-size: 32px; color: #ffff;"></i>
                         <div class="ms-3">
@@ -119,6 +119,70 @@ <h5>Quick Links</h5>
                       </div>
                     </a>
                   </div>
+
+                  <h5>Suggested</h5>
+                  <div class="d-md-flex px-10 py-3" style="justify-content: space-between;">
+                    <div href="" class="px-3 pt-3 bg-slate link-card rounded">
+                      <a href="" class="d-flex mb-3" style="justify-content: center;">
+                        <!-- <i class="fa-solid fa-greater-than-equal mb-3 p-3 bg-red rounded" style="font-size: 32px; color: #ffff;"></i> -->
+                        <img src="/images/dms-thumbnail.png" width="80%" alt="" class="rounded">
+                      </a>
+                      <div class="d-flex" style="align-items: baseline; justify-content: space-between;">
+                        <a href="">
+                          <div class="d-flex ms-1" style="align-items:baseline; gap: 0.8rem;justify-content: space-aroun;">
+                            <i class="fa-solid fa-file-pdf"></i>
+                            <p>DMS All slides</p>
+                          </div>
+                        </a>
+                        <a href=""><i class="fa-solid fa-arrow-down me-2"></i></a>
+                      </div>
+                    </div>
+                    <div href="" class="px-3 pt-3 bg-slate link-card rounded">
+                      <a href="" class="d-flex mb-3" style="justify-content: center;">
+                        <!-- <i class="fa-solid fa-greater-than-equal mb-3 p-3 bg-red rounded" style="font-size: 32px; color: #ffff;"></i> -->
+                        <img src="/images/dd-thumbnail.png" width="80%" alt="" class="rounded">
+                      </a>
+                      <div class="d-flex" style="align-items: baseline; justify-content: space-between;">
+                        <a href="">
+                          <div class="d-flex ms-1" style="align-items:baseline; gap: 0.8rem;justify-content: space-aroun;">
+                            <i class="fa-solid fa-file-pdf"></i>
+                        <p>DD Question bank</p>
+                          </div>
+                        </a>
+                        <a href=""><i class="fa-solid fa-arrow-down me-2"></i></a>
+                      </div>
+                    </div>
+                    <div href="" class="px-3 pt-3 bg-slate link-card rounded">
+                      <a href="" class="d-flex mb-3" style="justify-content: center;">
+                        <!-- <i class="fa-solid fa-greater-than-equal mb-3 p-3 bg-red rounded" style="font-size: 32px; color: #ffff;"></i> -->
+                        <img src="/images/emat101-thumbnail.png" width="80%" alt="" class="rounded">
+                      </a>
+                      <div class="d-flex" style="align-items: baseline; justify-content: space-between;">
+                        <a href="">
+                          <div class="d-flex ms-1" style="align-items:baseline; gap: 0.8rem;justify-content: space-aroun;">
+                            <i class="fa-solid fa-file-pdf"></i>
+                            <p>Calculus All slides</p>
+                          </div>
+                        </a>
+                        <a href=""><i class="fa-solid fa-arrow-down me-2"></i></a>
+                      </div>
+                    </div>
+                    <div href="" class="px-3 pt-3 bg-slate link-card rounded">
+                      <a href="" class="d-flex mb-3" style="justify-content: center;">
+                        <!-- <i class="fa-solid fa-greater-than-equal mb-3 p-3 bg-red rounded" style="font-size: 32px; color: #ffff;"></i> -->
+                        <img src="/images/java-thumbnail.png" width="80%" alt="" class="rounded">
+                      </a>
+                      <div class="d-flex" style="align-items: baseline; justify-content: space-between;">
+                        <a href="">
+                          <div class="d-flex ms-1" style="align-items:baseline; gap: 0.8rem;justify-content: space-aroun;">
+                            <i class="fa-solid fa-file-pdf"></i>
+                            <p>JAVA Remedial Tut-3</p>
+                          </div>
+                        </a>
+                        <a href=""><i class="fa-solid fa-arrow-down me-2"></i></a>
+                      </div>
+                    </div>
+                  </div>
                 </div>
             </div>