diff --git a/images/3d-business-young-woman-with-laptop-studying-online.png b/images/3d-business-young-woman-with-laptop-studying-online.png
new file mode 100644
index 0000000..7b3d425
Binary files /dev/null and b/images/3d-business-young-woman-with-laptop-studying-online.png differ
diff --git a/images/3d-business-young-women-students-smiling.png b/images/3d-business-young-women-students-smiling.png
new file mode 100644
index 0000000..5627cba
Binary files /dev/null and b/images/3d-business-young-women-students-smiling.png differ
diff --git a/index.html b/index.html
index 6790716..12db802 100644
--- a/index.html
+++ b/index.html
@@ -18,6 +18,7 @@
     <script src="https://kit.fontawesome.com/c4254e24a8.js"></script>
     <script src="https://kit.fontawesome.com/739255457e.js" crossorigin="anonymous"></script>
     <script src="https://kit.fontawesome.com/YOUR_KIT_CODE.js" crossorigin="anonymous"></script>
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@9/swiper-bundle.min.css"/>
 
 </head>
 <body>
@@ -67,7 +68,23 @@ <h1>CHAIBASA ENGINEERING<br>COLLEGE</h1>
                     </div>
                 </div>
                 <div class="col-2">
-                    <img class="students" src="images/college1.png">
+                         <img class="students" >
+                    <!-- Slider main container -->
+<div class="swiper">
+    <!-- Additional required wrapper -->
+    <div class="swiper-wrapper">
+      <!-- Slides -->
+      <div class="swiper-slide"><img src="images/3d-business-young-woman-with-laptop-studying-online.png"> </div>
+      <div class="swiper-slide"><img src="images/3d-business-young-women-students-smiling.png"></div>
+      <div class="swiper-slide"><img src="images/college1.png"> </div>
+      ...
+    </div>
+    <!-- If we need pagination -->
+    <div class="swiper-pagination"></div>
+
+    <!-- If we need navigation buttons -->
+    <div class="swiper-button-prev"></div>
+    <div class="swiper-button-next"></div>
                 </div>
             </div>
         </div>
@@ -354,5 +371,23 @@ <h3>News<span>letter</span></h3>
     }); 
 </script> 
 
+<script src="https://cdn.jsdelivr.net/npm/swiper@9/swiper-bundle.min.js"></script> 
+<script>
+  const swiper = new Swiper('.swiper', {
+autoplay:{
+delay:3000,
+disableOnInteraction:false,
+},
+loop: true,
+pagination: {
+el: '.swiper-pagination',
+clickable:true,
+},
+navigation: {
+nextEl: '.swiper-button-next',
+prevEl: '.swiper-button-prev',
+},
+});  
+</script>
 </body>
 </html>
diff --git a/style.css b/style.css
index b9eedaf..f46d8c4 100644
--- a/style.css
+++ b/style.css
@@ -124,6 +124,23 @@ nav ul li {
   margin-left: -50px;
 }
 
+.swiper{
+  width:80%;
+  height:fit-content;
+
+}
+.swiper-slide img{
+  width:100%;
+
+
+}
+.swiper .swiper-button-prev,.swiper .swiper-button-next{
+  color:white;
+
+}
+.swiper .swiper-pagination-bullet-active{
+  background:white;
+}
 
 .col-2 p {
   text-align: justify;
