add: profile temp

css/theme-styles.css

@@ -67,7 +67,6 @@ button:hover {
 }
 
 .container {
-  max-width: 100%;
   margin: 0xp auto;
   padding: 10px 30px;
   overflow: hidden;
@@ -264,7 +263,7 @@ section#second-nav-section .second-nav-active {
   margin: 10px 0px 10px 30px;
   max-width: 60%;
   height: 60px;
-  /* background-color: #ColorThree; */
+  background-color: #ColorThree;
 }
 
 .white-bg {
@@ -459,15 +458,15 @@ section#second-nav-section .second-nav-active {
   margin: 20px 0px;
 }
 
-#faculty-midroll {
+#dept-notices {
   background-image: url("../img/campus_07.jpg");
   text-align: center;
 }
-#faculty-midroll h1 {
+#dept-notices h1 {
   font-family: "DM Serif Text", serif;
   letter-spacing: 3px;
 }
-#faculty-midroll p {
+#dept-notices p {
   font-size: 16px;
 }
 
@@ -533,7 +532,7 @@ section#second-nav-section .second-nav-active {
   width: auto;
   filter: brightness(40%);
   transition-duration: 0.6s;
-  box-shadow: 3px 3px 8px rgba(51, 51, 51, 0.2549019608);
+  box-shadow: 3px 3px 15px rgba(51, 51, 51, 0.2549019608);
 }
 .news-big-img-holder img {
   height: 400px;
@@ -578,7 +577,7 @@ section#second-nav-section .second-nav-active {
   border-radius: 10px;
   padding: 10px;
   background-color: #fff;
-  box-shadow: 3px 3px 5px rgba(51, 51, 51, 0.3882352941);
+  box-shadow: 3px 3px 15px rgba(51, 51, 51, 0.3882352941);
   margin-bottom: 20px;
   max-height: 400px;
 }
@@ -1129,7 +1128,7 @@ footer.container-fluid ul > li a:hover {
     font-size: 30px !important;
     margin: 0px auto;
   }
-  .carousel-button {
+  .banner-slider-button {
     display: none;
   }
 }
@@ -1137,14 +1136,13 @@ footer.container-fluid ul > li a:hover {
   width: 100%;
   height: 100%;
 }
-
-.carousel {
+.banner-slider {
   z-index: -6;
   width: 100vw;
   height: 100vh;
   position: relative;
 }
-.carousel ul {
+.banner-slider ul {
   margin: 0;
   padding: 0;
   list-style: none;
@@ -1173,7 +1171,7 @@ footer.container-fluid ul > li a:hover {
   transition-delay: 0ms;
 }
 
-.carousel-button {
+.banner-slider-button {
   position: absolute;
   z-index: 3;
   background: none;
@@ -1188,24 +1186,24 @@ footer.container-fluid ul > li a:hover {
   outline: none;
 }
 
-.carousel-button:hover,
-.carousel-button:focus {
+.banner-slider-button:hover,
+.banner-slider-button:focus {
   color: white;
   background-color: transparent;
   border: none;
   outline: none;
 }
 
-.carousel-button:focus {
+.banner-slider-button:focus {
   border: none;
   outline: none;
 }
 
-.carousel-button.prev {
+.banner-slider-button.prev {
   left: 1rem;
 }
 
-.carousel-button.next {
+.banner-slider-button.next {
   right: 1rem;
 }
 
@@ -1219,85 +1217,34 @@ button:focus {
   position: absolute;
   top: 0;
   z-index: 5;
-  height: 100%;
-  width: 100%;
-  background-color: rgba(0, 0, 0, 0.4156862745);
+  height: 100vh;
+  width: 100vw;
+  background-color: rgba(0, 0, 0, 0.5607843137) !important;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}
+.banner-overlay h1, .banner-overlay h2, .banner-overlay h3, .banner-overlay h4 {
+  text-align: center;
+  font-family: "Open Sans", sans-serif;
+  font-weight: 400 !important;
 }
 .banner-overlay h1 {
-  font-family: "DM Serif Text", serif;
   font-size: 50px !important;
-  line-height: 100%;
-  text-align: center;
-  width: 750px;
-  margin: 0px auto;
-  position: relative;
-  top: 50%;
-  transform: translateY(-50%);
-  padding: 30px 0px 30px 0px;
+  margin-bottom: 100px !important;
 }
-@media (max-width: 600px) {
+@media screen and (max-width: 1100px) {
   .banner-overlay h1 {
-    top: 50%;
-  }
-}
-.banner-overlay h4 {
-  margin: 10px auto;
-  width: 300px;
-  text-align: center;
-  position: relative;
-  top: 50%;
-  transform: translateY(-100%);
-  font-family: "Open Sans", sans-serif;
-  font-size: 16px;
-  letter-spacing: 5px;
-  font-weight: lighter;
-  margin-bottom: 30px !important;
-  padding: 30px;
-}
-@media (max-width: 600px) {
-  .banner-overlay h4 {
-    margin-bottom: 0px !important;
+    font-size: 40px !important;
   }
 }
 .banner-overlay h3 {
-  margin: 10px auto;
-  width: 500px;
-  text-align: center;
-  position: relative;
-  top: 50%;
-  transform: translateY(-40%);
-  font-family: "Open Sans", sans-serif;
-  font-size: 20px;
-  letter-spacing: 5px;
-  font-weight: lighter;
-  padding: 30px 0px;
+  font-size: 20px !important;
 }
-@media (max-width: 600px) {
-  .banner-overlay h3 {
-    transform: translateY(-50%);
-    max-width: 400px;
-  }
-}
-.banner-overlay h4:nth-child(1) {
-  margin: -80px auto 80px auto;
-}
-@media (max-width: 1100px) {
-  .banner-overlay {
-    margin: 0 auto;
-  }
-  .banner-overlay h1 {
-    text-align: center;
-    width: 300px !important;
-    font-size: 30px !important;
-    margin: 0px auto;
-  }
-  .banner-overlay h4 {
-    font-size: 12px;
-    letter-spacing: 5px;
-  }
-  .banner-overlay h4:nth-child(1) {
-    margin: -10px auto 10px auto;
-  }
+.banner-overlay h4 {
+  margin-top: 100px;
+  margin-bottom: 100px !important;
 }
 
 .program {
@@ -1353,7 +1300,7 @@ button:focus {
 }
 
 .notice-main {
-  width: 1000px;
+  max-width: 1000px;
   margin: 30px auto;
 }
 .notice-main button {
@@ -1577,8 +1524,6 @@ button:focus {
 
 
 
-
-
   /* The Overlay (background) */
   .overlay {
     /* Height & width depends on how you want to reveal the overlay (see JS below) */
@@ -1650,4 +1595,12 @@ button:focus {
 }
 header.entry-header {
   display: none!important;
+}
+
+.static-banner .static-banner-overlay {
+  top: 0;
+}
+
+.desc-block p {
+  margin-left: 0!important;
 }

footer.php

@@ -18,7 +18,6 @@
 <!-- .site-info -->
 <!-- </footer> -->
 <footer class="container-fluid">
-
 	<div class="container">
 		<div class="grid">
 			<div>
@@ -104,6 +103,8 @@
 			<li>Site Information</li>
 		</ul>
 	</div>
+
+
 </footer><!-- #colophon -->
 </div><!-- #page -->
 

header.php

@@ -28,18 +28,11 @@
 		<a class="skip-link screen-reader-text" href="#primary"><?php esc_html_e('Skip to content', 'uiu-cse'); ?></a>
 
 		<header id="masthead" class="site-header">
-			<!-- <div class="site-branding">
-
-			</div> -->
-			<!-- .site-branding -->
-			<!-- <nav id="site-navigation" class="main-navigation">
-
-		</nav> -->
-			<!-- #site-navigation -->
 			<section id="first-nav-section">
 				<nav id="first-nav" class="container-fluid">
 					<ul>
 						<img src="<?php echo (get_header_image()); ?>" alt="<?php echo (get_bloginfo('title')); ?>" />
+
 						<li><a><span onclick="openNav()">About</span></a></li>
 						<li><a><span onclick="openNav()">Admission</span></a></li>
 
@@ -53,9 +46,7 @@
 							</a>
 						</li>
 						<li>
-						<li class="color-picker"></li>
 
-						</li>
 					</ul>
 					<span onclick="openNav()" id="menu-bars" class="material-icons">
 						menu
@@ -78,78 +69,4 @@
 					</ul>
 				</nav>
 			</section>
-
-
-			<section id="banner" class="container-fluid">
-
-				<div class="carousel" data-carousel>
-					<button class="carousel-button prev" data-carousel-button="prev">
-						<span class="material-symbols-outlined">
-							arrow_back_ios
-						</span>
-					</button>
-					<button class="carousel-button next" data-carousel-button="next">
-						<span class="material-symbols-outlined">
-							arrow_forward_ios
-						</span>
-					</button>
-
-					<ul data-slides>
-
-						<li class="slide" data-active>
-							<div class="slider-single-div">
-								<img src="<?php echo (get_template_directory_uri()) ?>/img/campus_01.jpg" alt="">
-
-								<div class="banner-overlay">
-									<h4>Welcome to </h4>
-									<h1>United<br> International<br> University</h1>
-									<h3>
-										Department of <br>
-										Computer Science &amp; Engineering
-									</h3>
-								</div>
-							</div>
-						</li>
-
-
-						<li class="slide">
-							<div class="slider-single-div">
-								<img src="<?php echo (get_template_directory_uri()) ?>/img/Slider_Swan2.jpg" alt="">
-
-								<div class="banner-overlay">
-									<h4>Welcome to </h4>
-									<h1>United International University</h1>
-									<h3>
-										Department of <br>
-										Computer Science &amp; Engineering
-									</h3>
-								</div>
-							</div>
-						</li>
-
-
-						<li class="slide">
-							<div class="slider-single-div">
-								<img src="<?php echo (get_template_directory_uri()) ?>/img/campus_02.jpg" alt="">
-
-								<div class="banner-overlay">
-									<h4>Welcome to </h4>
-									<h1>Department of <br>
-										Computer Science &amp; Engineering</h1>
-									<h3>
-										United International University
-									</h3>
-								</div>
-							</div>
-						</li>
-
-					</ul>
-
-
-
-				</div>
-
-
-			</section>
-
 		</header><!-- #masthead -->

inc/acf-json/group_642c30c3d7bd7.json

@@ -16,8 +16,8 @@
                 "class": "",
                 "id": ""
             },
-            "return_format": "",
-            "library": "",
+            "return_format": "url",
+            "library": "all",
             "min_width": "",
             "min_height": "",
             "min_size": "",
@@ -66,5 +66,5 @@
     "active": true,
     "description": "",
     "show_in_rest": 0,
-    "modified": 1680617800
+    "modified": 1680628858
 }

inc/raw_temp/home.html

@@ -0,0 +1,785 @@
+
+    <section id="banner" class="container-fluid">
+
+      <div class="banner-slider" data-banner-slider>
+        <button class="banner-slider-button prev" data-banner-slider-button="prev">
+          <span class="material-symbols-outlined">
+            arrow_back_ios
+          </span>
+        </button>
+        <button class="banner-slider-button next" data-banner-slider-button="next">
+          <span class="material-symbols-outlined">
+            arrow_forward_ios
+          </span>
+        </button>
+
+        <ul data-slides>
+
+          <li class="slide" data-active>
+            <div class="slider-single-div">
+              <img src="wp-content/themes/uiu-cse/img/campus_01.jpg" alt="">
+
+              <div class="banner-overlay">
+                <h4>Welcome to </h4>
+                <h1>United<br> International<br> University</h1>
+                <h3>
+                  Department of <br>
+                  Computer Science &amp; Engineering
+                </h3>
+              </div>
+            </div>
+          </li>
+
+
+          <li class="slide">
+            <div class="slider-single-div">
+              <img src="wp-content/themes/uiu-cse/img/Slider_Swan2.jpg" alt="">
+
+              <div class="banner-overlay">
+                <h4>Welcome to </h4>
+                <h1>United International University</h1>
+                <h3>
+                  Department of <br>
+                  Computer Science &amp; Engineering
+                </h3>
+              </div>
+            </div>
+          </li>
+
+
+          <li class="slide">
+            <div class="slider-single-div">
+              <img src="wp-content/themes/uiu-cse/img/campus_02.jpg" alt="">
+
+              <div class="banner-overlay">
+                <h4>Welcome to </h4>
+                <h1>Department of <br>
+                  Computer Science  &amp; Engineering</h1>
+                <h3>
+                  United International University
+                </h3>
+              </div>
+            </div>
+          </li>
+
+        </ul>
+
+      </div>
+    </section>
+    
+
+    <main id="main" class="site-main" role="main">
+
+      <div class="sections">
+
+        <section class="container-fluid white-bg">
+          <div class="container">
+            <h1>We evolve with technology</h1>
+            <p>
+              The CSE Department of UIU has been involved in several projects in last five years including projects under Thrust/Emerging Areas, Modernization and Removal of Obsolescence, Industry-Institution Interaction.
+            </p>
+  
+  
+            <button class="primary-c">Learn more</button>
+  
+            <div class="grid">
+  
+  
+              <div class="program">
+                <div class="img-cont-2">
+                  <img src="wp-content/themes/uiu-cse/img/student_03.jpg" alt="">
+                </div>
+                <div class="program-details">
+                  <h2>Graduate Program</h2>
+                  <p>
+                    <b>United International University (UIU)</b> has been running its M.Sc. in Computer Science and Engineering program since its inception and has attracted not only fresh undergraduates but also a handful number of ICT professionals from the industry.
+                  </p>
+  
+                  <button class="primary-c"> View All Programs </button>
+  
+  
+                </div>
+              </div>
+  
+              <div class="program">
+                <div class="img-cont-2">
+                  <img src="wp-content/themes/uiu-cse/img/undergrad.jpg" alt="">
+                </div>
+  
+  
+                <div class="program-details">
+                  <h2>Undergraduate Program</h2>
+                  <p>
+                    Bachelor of Science in Computer Science and Engineering primarily involves the study of a number of core courses, which every CSE graduate should know, and a significant number of courses from specialized areas.
+                  </p>
+                  <button class="primary-c"> View All Programs </button>
+                </div>
+  
+  
+              </div>
+  
+            </div>
+  
+          </div>
+        </section>
+  
+  
+        <section id="faculty-section" class="container-fluid white-bg">
+          <div class="container">
+            <h1>World Class Faculty</h1>
+            <p>
+              The Department of Computer Science and Engineering at UIU boasts one of the biggest faculty bodies
+              amongst all private universities in the country and is bolstered by a rich and diverse battery of published research work.
+            </p>
+          </div>
+  
+          <div class="container">
+  
+            <div id="faculty-img">
+              <img src="wp-content/themes/uiu-cse/img/faculty-grp.jpg" alt="">
+            </div>
+  
+            <p>
+              The Department of Computer Science and Engineering faculty members are an impressive group, bearing the academic tradition of higher excellence. World renowned, they are engaged in ground-breaking research. Further, they are so attuned to what’s happening in business that they are shaping its future.
+            </p>
+  
+            <button class="primary-c">
+              View complete faculty list
+            </button>
+  
+          </div>
+  
+        </section>
+  
+        <section class="container-fluid car" id="faculty-carousel">
+          <div class="car-buttons">
+            <button class="car-control primary-c" id="prev-car" onclick="scrollToPrev()">
+              >
+            </button>
+  
+            <button class="car-control primary-c" id="next-car" onclick="scrollToNext()">
+              >
+            </button>
+          </div>
+  
+  
+          <div class="profile-carousel">
+  
+            <div class="car-item">
+              <div class="car-item-holder">
+                <div class="car-img-holder">
+                  <img src="wp-content/themes/uiu-cse/img/saim.jpg" alt="">
+                </div>
+  
+                <div class="faculty-details">
+                  <h2>Islam, Salekul<span class="degree">, Ph.D.</span></h2>
+                  <h3><span class="degree">Professor & Head of the Dept.</span></h3>
+  
+  
+                </div>
+  
+              </div>
+            </div>
+  
+            <div class="car-item">
+              <div class="car-item-holder">
+                <div class="car-img-holder">
+                  <img src="wp-content/themes/uiu-cse/img/mamun.jpg" alt="">
+                </div>
+  
+                <div class="faculty-details">
+                  <h2>Mamun, Khondaker Abdullah Al<span class="degree">, Ph.D.</span></h2>
+                  <h3><span class="degree">Professor & Director - AIMS Lab</span></h3>
+                </div>
+  
+              </div>
+            </div>
+  
+            <div class="car-item">
+              <div class="car-item-holder">
+                <div class="car-img-holder">
+                  <img src="wp-content/themes/uiu-cse/img/swakkhar.jpg" alt="">
+                </div>
+  
+                <div class="faculty-details">
+                  <h2>Shatabda, Swakkhar<span class="degree">, Ph.D</span></h2>
+                  <h3><span class="degree">Professor & Director - IQAC</span></h3>
+  
+  
+                </div>
+  
+              </div>
+            </div>
+  
+            <div class="car-item">
+              <div class="car-item-holder">
+                <div class="car-img-holder">
+                  <img src="wp-content/themes/uiu-cse/img/ShahriarRahman.jpg" alt="">
+                </div>
+  
+                <div class="faculty-details">
+                  <h2>Rahman, Mohammad Shahriar<span class="degree">, Ph.D</span></h2>
+                  <h3><span class="degree">Professor & Director - CITS</span></h3>
+  
+  
+                </div>
+  
+              </div>
+            </div>
+  
+            <div class="car-item">
+  
+              <div class="car-item-holder">
+                <div class="car-img-holder">
+                  <img src="wp-content/themes/uiu-cse/img/mofizur.jpg" alt="">
+                </div>
+  
+                <div class="faculty-details">
+                  <h2>Rahman, Chowdhury Mofizur<span class="degree">, Ph.D</span></h2>
+                  <h3><span class="degree">Professor & Advisor to Board of Trustees</span></h3>
+  
+  
+                </div>
+  
+              </div>
+            </div>
+  
+  
+            <div class="car-item">
+  
+              <div class="car-item-holder">
+                <div class="car-img-holder">
+                  <img src="wp-content/themes/uiu-cse/img/nurul-huda.png" alt="">
+                </div>
+  
+                <div class="faculty-details">
+                  <h2>Huda, Mohammad Nurul<span class="degree">, Ph.D</span></h2>
+                  <h3><span class="degree">Professor & Director - MSCSE</span></h3>
+  
+                </div>
+  
+              </div>
+            </div>
+  
+  
+          </div>
+  
+        </section>
+  
+  
+        <section id="Success-section" class="container-fluid white-bg">
+          <div class="container">
+            <h1>Success Stories</h1>
+            <p>
+              Our students inspire us by their courage and perseverance, and are a reminder that obstacles can be overcome when you have just one person cheering you on to the finish line.
+            </p>
+          </div>
+  
+          <div class="container">
+  
+  
+            <div id="us-imgs" class="grid student-stories">
+  
+              <div>
+                <div class="img-cont">
+                  <img src="wp-content/themes/uiu-cse/img/story_hasan_shaharear.jpg" alt="">
+                </div>
+                <div>
+                  <h2>Mohammad Hasan Shaharear</h2>
+                  <h5>Senior Database Engineer,Therap (BD) Ltd</h5>
+                  <p>
+                    It was a complete unknown territory for me when I admitted to BSCSE of UIU in 2003. In fact, I had never operate a computer before. Initially I was a bit exited as well as scared.  Though I had tough time in the beginning, gradually I became familiar with logic of computing and programming languages. With the course of time, I had start enjoying different courses.
+                   </p>
+  
+                  <a href="#">Learn more</a>
+                </div>
+              </div>
+  
+              <div>
+                <div class="img-cont">
+                  <img src="wp-content/themes/uiu-cse/img/story_foysal-ahmed.jpg" alt="">
+                </div>
+                <div>
+                  <h2>Foysal Ahamed</h2>
+                  <h5>Software Engineer, TigerIT Bangladesh Limited</h5>
+                  <p>
+                    I still remember the day I first stepped into the UIU campus. I really did not know what kind of career path I would choose. Two weeks into the SPL (Structured Programming Language) course, I discovered something that was driving me, something amazing happened and finally I found myself in a position where I knew what I was going to do. Dr.
+                  </p>
+                  <a href="#">Learn more</a>
+                </div>
+              </div>
+  
+              <div>
+                <div class="img-cont">
+                  <img src="wp-content/themes/uiu-cse/img/story_kamrul_islam.jpg" alt="">
+                </div>
+                <div>
+                  <h2>Kamrul Islam Shahin</h2>
+                  <h5>Programmer, Big Web Technologies Limited</h5>
+                  <p>
+                    It’s still like a dream. The day I accomplished my goal by finishing my studies, all the struggles of the past years seemed nothing. My hard work showed its result finally. When I started my educational journey with United International University (UIU), the path seemed dark, confusing and quite uncertain.
+                   </p>
+                  <a href="#">Learn more </a>
+                </div>
+              </div>
+  
+  
+            </div>
+  
+            <div>
+              <h1>Notable Alumni</h1>
+              <p>
+                Pellentesque est est, luctus non iaculis sed, congue non diam. In efficitur gravida ipsum vitae finibus. Etiam sollicitudin placerat leo.
+              </p>
+            </div>
+  
+  
+            <button class="primary-c">
+              View complete Alumni list
+            </button>
+  
+          </div>
+  
+        </section>
+  
+        <section class="container-fluid car" id="alumni-carousel">
+          <div class="car-buttons">
+            <button class="car-control primary-c"  onclick="scrollToPrevAl()">
+              <
+            </button>
+  
+            <button class="car-control primary-c"  onclick="scrollToNextAl()">
+              >
+            </button>
+          </div>
+  
+  
+          <div class="profile-carousel">
+  
+            <div class="car-item">
+              <div class="car-item-holder">
+                <div class="car-img-holder">
+                  <img src="wp-content/themes/uiu-cse/img/tazbir_ur_rahman.jpeg" alt="">
+                </div>
+  
+                <div class="faculty-details">
+                  <h2>Md. Tazbir Ur Rahman Bhuiyan</h2>
+                  <h3><span class="degree">Lead Engineer at Brain Station 23 Limited</span></h3>
+  
+  
+                </div>
+  
+              </div>
+            </div>
+  
+            <div class="car-item">
+              <div class="car-item-holder">
+                <div class="car-img-holder">
+                  <img src="wp-content/themes/uiu-cse/img/saifur_rahman_sazib.jpeg" alt="">
+                </div>
+  
+                <div class="faculty-details">
+                  <h2>Saifur Rahman Sazib</h2>
+                  <h3><span class="degree">Lead Engineer at Objectstream Inc, USA</span></h3>
+  
+  
+                </div>
+  
+              </div>
+            </div>
+  
+  
+  
+            <div class="car-item">
+              <div class="car-item-holder">
+                <div class="car-img-holder">
+                  <img src="wp-content/themes/uiu-cse/img/faisal_kabir.jpeg" alt="">
+                </div>
+  
+                <div class="faculty-details">
+                  <h2>Md Faisal Kabir</h2>
+                  <h3><span class="degree">PhD student at North Dakota State University (NDSU)</span></h3>
+  
+  
+                </div>
+  
+              </div>
+            </div>
+  
+            <div class="car-item">
+              <div class="car-item-holder">
+                <div class="car-img-holder">
+                  <img src="wp-content/themes/uiu-cse/img/achia_nila.jpeg" alt="">
+                </div>
+  
+                <div class="faculty-details">
+                  <h2>Achia Nila</h2>
+                  <h3><span class="degree"> Founder, Women In Digital - Empowerment through Technology</span></h3>
+  
+  
+                </div>
+  
+              </div>
+            </div>
+  
+            <div class="car-item">
+              <div class="car-item-holder">
+                <div class="car-img-holder">
+                  <img src="wp-content/themes/uiu-cse/img/hussain_kmr.jpeg" alt="">
+                </div>
+  
+                <div class="faculty-details">
+                  <h2>Hussain KMR Behestee</h2>
+                  <h3><span class="degree">Mobile Device Specialist, K.K. Innovative Solutions</span></h3>
+  
+  
+                </div>
+  
+              </div>
+            </div>
+  
+  
+  
+          </div>
+  
+        </section>
+  
+        <section id="dept-notices" class="container-fluid mid-roll" >
+  
+  
+  
+          <div class="bg-tint">
+  
+            <div class="container">
+  
+              <h1>Department Notices</h1>
+  
+              <div class="notice-main">
+  
+                <a href="#">
+  
+                  <div class="notice-container">
+  
+                    <div class="event-date">
+                      <h3>Dec</h3>
+                      <h3>16</h3>
+                    </div>
+  
+                    <div>
+                      <h6><span class="subtitle">8 Dec, 2022</span></h6>
+                      <h4>List of Candidates for Fall 2022 semester</h4>
+                      <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.</p>
+                    </div>
+  
+                  </div>
+                </a>
+  
+                <a href="#">
+  
+                  <div class="notice-container">
+  
+                    <div class="event-date">
+                      <h3>Dec</h3>
+                      <h3>12</h3>
+                    </div>
+  
+                    <div>
+                      <h6><span class="subtitle">8 Dec, 2022</span></h6>
+                      <h4>List of Candidates for Fall 2022 semester</h4>
+                      <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.</p>
+                    </div>
+  
+                  </div>
+                </a>
+  
+  
+                <a href="#">
+  
+                  <div class="notice-container">
+  
+                    <div class="event-date">
+                      <h3>Dec</h3>
+                      <h3>03</h3>
+                    </div>
+  
+                    <div>
+                      <h6><span class="subtitle">8 Dec, 2022</span></h6>
+                      <h4>List of Candidates for Fall 2022 semester</h4>
+                      <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.</p>
+                    </div>
+  
+                  </div>
+                </a>
+  
+  
+                <a href="#">
+  
+                  <div class="notice-container">
+  
+                    <div class="event-date">
+                      <h3>Nov</h3>
+                      <h3>25</h3>
+                    </div>
+  
+                    <div>
+                      <h6><span class="subtitle">8 Dec, 2022</span></h6>
+                      <h4>List of Candidates for Fall 2022 semester</h4>
+                      <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.</p>
+                    </div>
+  
+                  </div>
+                </a>
+  
+                <a href="#">
+  
+                  <div class="notice-container">
+  
+                    <div class="event-date">
+                      <h3>Nov</h3>
+                      <h3>12</h3>
+                    </div>
+  
+                    <div>
+                      <h6><span class="subtitle">8 Dec, 2022</span></h6>
+                      <h4>List of Candidates for Fall 2022 semester</h4>
+                      <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.</p>
+                    </div>
+  
+                  </div>
+                </a>
+  
+  
+  
+                <button>View All Notices</button>
+  
+  
+              </div>
+  
+  
+            </div>
+          </div>
+        </section>
+  
+        <section id="dept-news" class="container-fluid white-bg">
+  
+          <div class="container">
+  
+  
+  
+            <h1>Department News</h1>
+  
+            <p>
+              Catch up with what's happening at the Department of CSE
+            </p>
+  
+            <div class="grid news-row">
+  
+              <div class="news-big-img">
+                <div class="news-big-img-holder">
+                  <img src="wp-content/themes/uiu-cse/img/campus_05.jpg" alt="">
+                </div>
+  
+                <div class="news-big-img-text">
+                  <h5>28th March, 2016</h5>
+                  <h4> <a href=""> Seminar</a></h4>
+                  <a href=""><p>Development and Mining of a Volatile Organic Compound Database</p></a>
+                </div>
+              </div>
+  
+  
+              <div class="grid">
+                <div class="news-small-img">
+                  <div class="news-sm-img-holder">
+                    <img src="wp-content/themes/uiu-cse/img/campus_05.jpg" alt="">
+                  </div>
+                  <div class="news-sm-img-text">
+                    <h5>28th March, 2016</h5>
+                    <h4> <a href=""> Seminar</a></h4>
+                    <a href=""><p>Development and Mining of a Volatile Compounds</p></a>
+                  </div>
+                </div>
+  
+                <div class="news-small-img">
+                  <div class="news-sm-img-holder">
+                    <img src="wp-content/themes/uiu-cse/img/campus_01.jpg" alt="">
+                  </div>
+                  <div class="news-sm-img-text">
+                    <h5>28th March, 2016</h5>
+                    <h4> <a href=""> Seminar</a></h4>
+                    <a href=""><p>Development and Mining of a Volatile Compounds</p></a>
+                  </div>
+                </div>
+  
+              </div>
+            </div>
+  
+            <div class="grid news-row">
+  
+              <div class="grid">
+                <div class="news-small-img">
+                  <div class="news-sm-img-holder">
+                    <img src="wp-content/themes/uiu-cse/img/campus_05.jpg" alt="">
+                  </div>
+                  <div class="news-sm-img-text">
+                    <h5>28th March, 2016</h5>
+                    <h4> <a href=""> Seminar</a></h4>
+                    <a href=""><p>Development and Mining of a Volatile Compounds</p></a>
+                  </div>
+                </div>
+  
+                <div class="news-small-img">
+                  <div class="news-sm-img-holder">
+                    <img src="wp-content/themes/uiu-cse/img/campus_01.jpg" alt="">
+                  </div>
+                  <div class="news-sm-img-text">
+                    <h5>28th March, 2016</h5>
+                    <h4> <a href=""> Seminar</a></h4>
+                    <a href=""><p>Development and Mining of a Volatile Compounds</p></a>
+                  </div>
+                </div>
+  
+              </div>
+  
+              <div class="news-big-img">
+                <div class="news-big-img-holder">
+                  <img src="wp-content/themes/uiu-cse/img/campus_05.jpg" alt="">
+                </div>
+  
+                <div class="news-big-img-text">
+                  <h5>28th March, 2016</h5>
+                  <h4> <a href=""> Seminar</a></h4>
+                  <a href=""><p>Development and Mining of a Volatile Organic Compound Database</p></a>
+                </div>
+              </div>
+  
+  
+            </div>
+  
+            <button class="primary-c">View All News</button>
+          </div>
+  
+        </section>
+  
+        <section id="events" class="container-fluid mid-roll" >
+          <div class="bg-tint">
+  
+            <div class="container">
+  
+              <h1>Upcoming Events</h1>
+  
+              <div class="grid">
+                <div class="event-holder">
+                  <div class="event-img-holder">
+                    <img src="wp-content/themes/uiu-cse/img/0555.jpg" alt="">
+                  </div>
+  
+                  <div class="event-date primary-c">
+                    <h3>Dec</h3>
+                    <h3>17</h3>
+                  </div>
+  
+                  <div class="event-details">
+                    <a href="">
+                      <h3>Seminar</h3>
+                    <h2>Blockchain: The Coming Revolution</h2>
+                    </a>
+                  </div>
+                </div>
+  
+                <div class="event-holder">
+                  <div class="event-img-holder">
+                    <img src="wp-content/themes/uiu-cse/img/2.jpg" alt="">
+                  </div>
+  
+                  <div class="event-date primary-c">
+                    <h3>Nov</h3>
+                    <h3>27</h3>
+                  </div>
+  
+                  <div class="event-details">
+                    <a href="">
+                      <h3>Pre-Advising</h3>
+                    <h2>Blockchain: The Coming Revolution</h2>
+                    </a>
+                  </div>
+                </div>
+  
+                <div class="event-holder">
+                  <div class="event-img-holder">
+                    <img src="wp-content/themes/uiu-cse/img/research_01.jpg" alt="">
+                  </div>
+  
+                  <div class="event-date primary-c">
+                    <h3>Nov</h3>
+                    <h3>22</h3>
+                  </div>
+  
+                  <div class="event-details">
+                    <a href="">
+                      <h3>Cultural Event</h3>
+                    <h2>Blockchain: The Coming Revolution</h2>
+                    </a>
+  
+                  </div>
+                </div>
+  
+                <div class="event-holder">
+                  <div class="event-img-holder">
+                    <img src="wp-content/themes/uiu-cse/img/research_03.jpg" alt="">
+                  </div>
+  
+                  <div class="event-date primary-c">
+                    <h3>Nov</h3>
+                    <h3>12</h3>
+                  </div>
+  
+                  <div class="event-details">
+                    <a href="">
+                      <h3>Seminar</h3>
+                    <h2>Blockchain: The Coming Revolution</h2>
+                    </a>
+  
+                  </div>
+                </div>
+              </div>
+  
+              <button class="primary-c">View all events</button>
+  
+            </div>
+          </div>
+        </section>
+
+  
+        <section id="research-grants" class="white-bg">
+          <div class="container">
+            <h1>Research &amp; Grants</h1>
+            <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.
+              Mus mauris vitae ultricies leo integer malesuada nunc vel. Mus mauris vitae ultricies leo integer malesuada nunc vel.
+            </p>
+  
+            <div id="research-pointers" class="grid">
+  
+              <div>
+                <h3>32 Research Projects</h3>
+                <p>Spread across Undergraduate and Graduate Programs</p>
+              </div>
+  
+              <div>
+                <h3>Tk 5 Crores in grants</h3>
+                <p>Spread across Undergraduate and Graduate Programs</p>
+              </div>
+  
+  
+              <div>
+                <h3>32 Research Projects</h3>
+                <p>Spread across Undergraduate and Graduate Programs</p>
+              </div>
+            </div>
+
+  
+          </div>
+        </section>
+  
+      </div>
+      
+    </main>

inc/raw_temp/home.php

@@ -0,0 +1,785 @@
+
+    <section id="banner" class="container-fluid">
+
+      <div class="banner-slider" data-banner-slider>
+        <button class="banner-slider-button prev" data-banner-slider-button="prev">
+          <span class="material-symbols-outlined">
+            arrow_back_ios
+          </span>
+        </button>
+        <button class="banner-slider-button next" data-banner-slider-button="next">
+          <span class="material-symbols-outlined">
+            arrow_forward_ios
+          </span>
+        </button>
+
+        <ul data-slides>
+
+          <li class="slide" data-active>
+            <div class="slider-single-div">
+              <img src="img/campus_01.jpg" alt="">
+
+              <div class="banner-overlay">
+                <h4>Welcome to </h4>
+                <h1>United<br> International<br> University</h1>
+                <h3>
+                  Department of <br>
+                  Computer Science &amp; Engineering
+                </h3>
+              </div>
+            </div>
+          </li>
+
+
+          <li class="slide">
+            <div class="slider-single-div">
+              <img src="img/Slider_Swan2.jpg" alt="">
+
+              <div class="banner-overlay">
+                <h4>Welcome to </h4>
+                <h1>United International University</h1>
+                <h3>
+                  Department of <br>
+                  Computer Science &amp; Engineering
+                </h3>
+              </div>
+            </div>
+          </li>
+
+
+          <li class="slide">
+            <div class="slider-single-div">
+              <img src="img/campus_02.jpg" alt="">
+
+              <div class="banner-overlay">
+                <h4>Welcome to </h4>
+                <h1>Department of <br>
+                  Computer Science  &amp; Engineering</h1>
+                <h3>
+                  United International University
+                </h3>
+              </div>
+            </div>
+          </li>
+
+        </ul>
+
+      </div>
+    </section>
+    
+
+    <main id="main" class="site-main" role="main">
+
+      <div class="sections">
+
+        <section class="container-fluid white-bg">
+          <div class="container">
+            <h1>We evolve with technology</h1>
+            <p>
+              The CSE Department of UIU has been involved in several projects in last five years including projects under Thrust/Emerging Areas, Modernization and Removal of Obsolescence, Industry-Institution Interaction.
+            </p>
+  
+  
+            <button class="primary-c">Learn more</button>
+  
+            <div class="grid">
+  
+  
+              <div class="program">
+                <div class="img-cont-2">
+                  <img src="img/student_03.jpg" alt="">
+                </div>
+                <div class="program-details">
+                  <h2>Graduate Program</h2>
+                  <p>
+                    <b>United International University (UIU)</b> has been running its M.Sc. in Computer Science and Engineering program since its inception and has attracted not only fresh undergraduates but also a handful number of ICT professionals from the industry.
+                  </p>
+  
+                  <button class="primary-c"> View All Programs </button>
+  
+  
+                </div>
+              </div>
+  
+              <div class="program">
+                <div class="img-cont-2">
+                  <img src="img/undergrad.jpg" alt="">
+                </div>
+  
+  
+                <div class="program-details">
+                  <h2>Undergraduate Program</h2>
+                  <p>
+                    Bachelor of Science in Computer Science and Engineering primarily involves the study of a number of core courses, which every CSE graduate should know, and a significant number of courses from specialized areas.
+                  </p>
+                  <button class="primary-c"> View All Programs </button>
+                </div>
+  
+  
+              </div>
+  
+            </div>
+  
+          </div>
+        </section>
+  
+  
+        <section id="faculty-section" class="container-fluid white-bg">
+          <div class="container">
+            <h1>World Class Faculty</h1>
+            <p>
+              The Department of Computer Science and Engineering at UIU boasts one of the biggest faculty bodies
+              amongst all private universities in the country and is bolstered by a rich and diverse battery of published research work.
+            </p>
+          </div>
+  
+          <div class="container">
+  
+            <div id="faculty-img">
+              <img src="img/faculty-grp.jpg" alt="">
+            </div>
+  
+            <p>
+              The Department of Computer Science and Engineering faculty members are an impressive group, bearing the academic tradition of higher excellence. World renowned, they are engaged in ground-breaking research. Further, they are so attuned to what’s happening in business that they are shaping its future.
+            </p>
+  
+            <button class="primary-c">
+              View complete faculty list
+            </button>
+  
+          </div>
+  
+        </section>
+  
+        <section class="container-fluid car" id="faculty-carousel">
+          <div class="car-buttons">
+            <button class="car-control primary-c" id="prev-car" onclick="scrollToPrev()">
+              >
+            </button>
+  
+            <button class="car-control primary-c" id="next-car" onclick="scrollToNext()">
+              >
+            </button>
+          </div>
+  
+  
+          <div class="profile-carousel">
+  
+            <div class="car-item">
+              <div class="car-item-holder">
+                <div class="car-img-holder">
+                  <img src="img/saim.jpg" alt="">
+                </div>
+  
+                <div class="faculty-details">
+                  <h2>Islam, Salekul<span class="degree">, Ph.D.</span></h2>
+                  <h3><span class="degree">Professor & Head of the Dept.</span></h3>
+  
+  
+                </div>
+  
+              </div>
+            </div>
+  
+            <div class="car-item">
+              <div class="car-item-holder">
+                <div class="car-img-holder">
+                  <img src="img/mamun.jpg" alt="">
+                </div>
+  
+                <div class="faculty-details">
+                  <h2>Mamun, Khondaker Abdullah Al<span class="degree">, Ph.D.</span></h2>
+                  <h3><span class="degree">Professor & Director - AIMS Lab</span></h3>
+                </div>
+  
+              </div>
+            </div>
+  
+            <div class="car-item">
+              <div class="car-item-holder">
+                <div class="car-img-holder">
+                  <img src="img/swakkhar.jpg" alt="">
+                </div>
+  
+                <div class="faculty-details">
+                  <h2>Shatabda, Swakkhar<span class="degree">, Ph.D</span></h2>
+                  <h3><span class="degree">Professor & Director - IQAC</span></h3>
+  
+  
+                </div>
+  
+              </div>
+            </div>
+  
+            <div class="car-item">
+              <div class="car-item-holder">
+                <div class="car-img-holder">
+                  <img src="img/ShahriarRahman.jpg" alt="">
+                </div>
+  
+                <div class="faculty-details">
+                  <h2>Rahman, Mohammad Shahriar<span class="degree">, Ph.D</span></h2>
+                  <h3><span class="degree">Professor & Director - CITS</span></h3>
+  
+  
+                </div>
+  
+              </div>
+            </div>
+  
+            <div class="car-item">
+  
+              <div class="car-item-holder">
+                <div class="car-img-holder">
+                  <img src="img/mofizur.jpg" alt="">
+                </div>
+  
+                <div class="faculty-details">
+                  <h2>Rahman, Chowdhury Mofizur<span class="degree">, Ph.D</span></h2>
+                  <h3><span class="degree">Professor & Advisor to Board of Trustees</span></h3>
+  
+  
+                </div>
+  
+              </div>
+            </div>
+  
+  
+            <div class="car-item">
+  
+              <div class="car-item-holder">
+                <div class="car-img-holder">
+                  <img src="img/nurul-huda.png" alt="">
+                </div>
+  
+                <div class="faculty-details">
+                  <h2>Huda, Mohammad Nurul<span class="degree">, Ph.D</span></h2>
+                  <h3><span class="degree">Professor & Director - MSCSE</span></h3>
+  
+                </div>
+  
+              </div>
+            </div>
+  
+  
+          </div>
+  
+        </section>
+  
+  
+        <section id="Success-section" class="container-fluid white-bg">
+          <div class="container">
+            <h1>Success Stories</h1>
+            <p>
+              Our students inspire us by their courage and perseverance, and are a reminder that obstacles can be overcome when you have just one person cheering you on to the finish line.
+            </p>
+          </div>
+  
+          <div class="container">
+  
+  
+            <div id="us-imgs" class="grid student-stories">
+  
+              <div>
+                <div class="img-cont">
+                  <img src="img/story_hasan_shaharear.jpg" alt="">
+                </div>
+                <div>
+                  <h2>Mohammad Hasan Shaharear</h2>
+                  <h5>Senior Database Engineer,Therap (BD) Ltd</h5>
+                  <p>
+                    It was a complete unknown territory for me when I admitted to BSCSE of UIU in 2003. In fact, I had never operate a computer before. Initially I was a bit exited as well as scared.  Though I had tough time in the beginning, gradually I became familiar with logic of computing and programming languages. With the course of time, I had start enjoying different courses.
+                   </p>
+  
+                  <a href="#">Learn more</a>
+                </div>
+              </div>
+  
+              <div>
+                <div class="img-cont">
+                  <img src="img/story_foysal-ahmed.jpg" alt="">
+                </div>
+                <div>
+                  <h2>Foysal Ahamed</h2>
+                  <h5>Software Engineer, TigerIT Bangladesh Limited</h5>
+                  <p>
+                    I still remember the day I first stepped into the UIU campus. I really did not know what kind of career path I would choose. Two weeks into the SPL (Structured Programming Language) course, I discovered something that was driving me, something amazing happened and finally I found myself in a position where I knew what I was going to do. Dr.
+                  </p>
+                  <a href="#">Learn more</a>
+                </div>
+              </div>
+  
+              <div>
+                <div class="img-cont">
+                  <img src="img/story_kamrul_islam.jpg" alt="">
+                </div>
+                <div>
+                  <h2>Kamrul Islam Shahin</h2>
+                  <h5>Programmer, Big Web Technologies Limited</h5>
+                  <p>
+                    It’s still like a dream. The day I accomplished my goal by finishing my studies, all the struggles of the past years seemed nothing. My hard work showed its result finally. When I started my educational journey with United International University (UIU), the path seemed dark, confusing and quite uncertain.
+                   </p>
+                  <a href="#">Learn more </a>
+                </div>
+              </div>
+  
+  
+            </div>
+  
+            <div>
+              <h1>Notable Alumni</h1>
+              <p>
+                Pellentesque est est, luctus non iaculis sed, congue non diam. In efficitur gravida ipsum vitae finibus. Etiam sollicitudin placerat leo.
+              </p>
+            </div>
+  
+  
+            <button class="primary-c">
+              View complete Alumni list
+            </button>
+  
+          </div>
+  
+        </section>
+  
+        <section class="container-fluid car" id="alumni-carousel">
+          <div class="car-buttons">
+            <button class="car-control primary-c"  onclick="scrollToPrevAl()">
+              <
+            </button>
+  
+            <button class="car-control primary-c"  onclick="scrollToNextAl()">
+              >
+            </button>
+          </div>
+  
+  
+          <div class="profile-carousel">
+  
+            <div class="car-item">
+              <div class="car-item-holder">
+                <div class="car-img-holder">
+                  <img src="img/tazbir_ur_rahman.jpeg" alt="">
+                </div>
+  
+                <div class="faculty-details">
+                  <h2>Md. Tazbir Ur Rahman Bhuiyan</h2>
+                  <h3><span class="degree">Lead Engineer at Brain Station 23 Limited</span></h3>
+  
+  
+                </div>
+  
+              </div>
+            </div>
+  
+            <div class="car-item">
+              <div class="car-item-holder">
+                <div class="car-img-holder">
+                  <img src="img/saifur_rahman_sazib.jpeg" alt="">
+                </div>
+  
+                <div class="faculty-details">
+                  <h2>Saifur Rahman Sazib</h2>
+                  <h3><span class="degree">Lead Engineer at Objectstream Inc, USA</span></h3>
+  
+  
+                </div>
+  
+              </div>
+            </div>
+  
+  
+  
+            <div class="car-item">
+              <div class="car-item-holder">
+                <div class="car-img-holder">
+                  <img src="img/faisal_kabir.jpeg" alt="">
+                </div>
+  
+                <div class="faculty-details">
+                  <h2>Md Faisal Kabir</h2>
+                  <h3><span class="degree">PhD student at North Dakota State University (NDSU)</span></h3>
+  
+  
+                </div>
+  
+              </div>
+            </div>
+  
+            <div class="car-item">
+              <div class="car-item-holder">
+                <div class="car-img-holder">
+                  <img src="img/achia_nila.jpeg" alt="">
+                </div>
+  
+                <div class="faculty-details">
+                  <h2>Achia Nila</h2>
+                  <h3><span class="degree"> Founder, Women In Digital - Empowerment through Technology</span></h3>
+  
+  
+                </div>
+  
+              </div>
+            </div>
+  
+            <div class="car-item">
+              <div class="car-item-holder">
+                <div class="car-img-holder">
+                  <img src="img/hussain_kmr.jpeg" alt="">
+                </div>
+  
+                <div class="faculty-details">
+                  <h2>Hussain KMR Behestee</h2>
+                  <h3><span class="degree">Mobile Device Specialist, K.K. Innovative Solutions</span></h3>
+  
+  
+                </div>
+  
+              </div>
+            </div>
+  
+  
+  
+          </div>
+  
+        </section>
+  
+        <section id="dept-notices" class="container-fluid mid-roll" >
+  
+  
+  
+          <div class="bg-tint">
+  
+            <div class="container">
+  
+              <h1>Department Notices</h1>
+  
+              <div class="notice-main">
+  
+                <a href="#">
+  
+                  <div class="notice-container">
+  
+                    <div class="event-date">
+                      <h3>Dec</h3>
+                      <h3>16</h3>
+                    </div>
+  
+                    <div>
+                      <h6><span class="subtitle">8 Dec, 2022</span></h6>
+                      <h4>List of Candidates for Fall 2022 semester</h4>
+                      <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.</p>
+                    </div>
+  
+                  </div>
+                </a>
+  
+                <a href="#">
+  
+                  <div class="notice-container">
+  
+                    <div class="event-date">
+                      <h3>Dec</h3>
+                      <h3>12</h3>
+                    </div>
+  
+                    <div>
+                      <h6><span class="subtitle">8 Dec, 2022</span></h6>
+                      <h4>List of Candidates for Fall 2022 semester</h4>
+                      <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.</p>
+                    </div>
+  
+                  </div>
+                </a>
+  
+  
+                <a href="#">
+  
+                  <div class="notice-container">
+  
+                    <div class="event-date">
+                      <h3>Dec</h3>
+                      <h3>03</h3>
+                    </div>
+  
+                    <div>
+                      <h6><span class="subtitle">8 Dec, 2022</span></h6>
+                      <h4>List of Candidates for Fall 2022 semester</h4>
+                      <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.</p>
+                    </div>
+  
+                  </div>
+                </a>
+  
+  
+                <a href="#">
+  
+                  <div class="notice-container">
+  
+                    <div class="event-date">
+                      <h3>Nov</h3>
+                      <h3>25</h3>
+                    </div>
+  
+                    <div>
+                      <h6><span class="subtitle">8 Dec, 2022</span></h6>
+                      <h4>List of Candidates for Fall 2022 semester</h4>
+                      <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.</p>
+                    </div>
+  
+                  </div>
+                </a>
+  
+                <a href="#">
+  
+                  <div class="notice-container">
+  
+                    <div class="event-date">
+                      <h3>Nov</h3>
+                      <h3>12</h3>
+                    </div>
+  
+                    <div>
+                      <h6><span class="subtitle">8 Dec, 2022</span></h6>
+                      <h4>List of Candidates for Fall 2022 semester</h4>
+                      <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.</p>
+                    </div>
+  
+                  </div>
+                </a>
+  
+  
+  
+                <button>View All Notices</button>
+  
+  
+              </div>
+  
+  
+            </div>
+          </div>
+        </section>
+  
+        <section id="dept-news" class="container-fluid white-bg">
+  
+          <div class="container">
+  
+  
+  
+            <h1>Department News</h1>
+  
+            <p>
+              Catch up with what's happening at the Department of CSE
+            </p>
+  
+            <div class="grid news-row">
+  
+              <div class="news-big-img">
+                <div class="news-big-img-holder">
+                  <img src="img/campus_05.jpg" alt="">
+                </div>
+  
+                <div class="news-big-img-text">
+                  <h5>28th March, 2016</h5>
+                  <h4> <a href=""> Seminar</a></h4>
+                  <a href=""><p>Development and Mining of a Volatile Organic Compound Database</p></a>
+                </div>
+              </div>
+  
+  
+              <div class="grid">
+                <div class="news-small-img">
+                  <div class="news-sm-img-holder">
+                    <img src="img/campus_05.jpg" alt="">
+                  </div>
+                  <div class="news-sm-img-text">
+                    <h5>28th March, 2016</h5>
+                    <h4> <a href=""> Seminar</a></h4>
+                    <a href=""><p>Development and Mining of a Volatile Compounds</p></a>
+                  </div>
+                </div>
+  
+                <div class="news-small-img">
+                  <div class="news-sm-img-holder">
+                    <img src="img/campus_01.jpg" alt="">
+                  </div>
+                  <div class="news-sm-img-text">
+                    <h5>28th March, 2016</h5>
+                    <h4> <a href=""> Seminar</a></h4>
+                    <a href=""><p>Development and Mining of a Volatile Compounds</p></a>
+                  </div>
+                </div>
+  
+              </div>
+            </div>
+  
+            <div class="grid news-row">
+  
+              <div class="grid">
+                <div class="news-small-img">
+                  <div class="news-sm-img-holder">
+                    <img src="img/campus_05.jpg" alt="">
+                  </div>
+                  <div class="news-sm-img-text">
+                    <h5>28th March, 2016</h5>
+                    <h4> <a href=""> Seminar</a></h4>
+                    <a href=""><p>Development and Mining of a Volatile Compounds</p></a>
+                  </div>
+                </div>
+  
+                <div class="news-small-img">
+                  <div class="news-sm-img-holder">
+                    <img src="img/campus_01.jpg" alt="">
+                  </div>
+                  <div class="news-sm-img-text">
+                    <h5>28th March, 2016</h5>
+                    <h4> <a href=""> Seminar</a></h4>
+                    <a href=""><p>Development and Mining of a Volatile Compounds</p></a>
+                  </div>
+                </div>
+  
+              </div>
+  
+              <div class="news-big-img">
+                <div class="news-big-img-holder">
+                  <img src="img/campus_05.jpg" alt="">
+                </div>
+  
+                <div class="news-big-img-text">
+                  <h5>28th March, 2016</h5>
+                  <h4> <a href=""> Seminar</a></h4>
+                  <a href=""><p>Development and Mining of a Volatile Organic Compound Database</p></a>
+                </div>
+              </div>
+  
+  
+            </div>
+  
+            <button class="primary-c">View All News</button>
+          </div>
+  
+        </section>
+  
+        <section id="events" class="container-fluid mid-roll" >
+          <div class="bg-tint">
+  
+            <div class="container">
+  
+              <h1>Upcoming Events</h1>
+  
+              <div class="grid">
+                <div class="event-holder">
+                  <div class="event-img-holder">
+                    <img src="img/0555.jpg" alt="">
+                  </div>
+  
+                  <div class="event-date primary-c">
+                    <h3>Dec</h3>
+                    <h3>17</h3>
+                  </div>
+  
+                  <div class="event-details">
+                    <a href="">
+                      <h3>Seminar</h3>
+                    <h2>Blockchain: The Coming Revolution</h2>
+                    </a>
+                  </div>
+                </div>
+  
+                <div class="event-holder">
+                  <div class="event-img-holder">
+                    <img src="img/2.jpg" alt="">
+                  </div>
+  
+                  <div class="event-date primary-c">
+                    <h3>Nov</h3>
+                    <h3>27</h3>
+                  </div>
+  
+                  <div class="event-details">
+                    <a href="">
+                      <h3>Pre-Advising</h3>
+                    <h2>Blockchain: The Coming Revolution</h2>
+                    </a>
+                  </div>
+                </div>
+  
+                <div class="event-holder">
+                  <div class="event-img-holder">
+                    <img src="img/research_01.jpg" alt="">
+                  </div>
+  
+                  <div class="event-date primary-c">
+                    <h3>Nov</h3>
+                    <h3>22</h3>
+                  </div>
+  
+                  <div class="event-details">
+                    <a href="">
+                      <h3>Cultural Event</h3>
+                    <h2>Blockchain: The Coming Revolution</h2>
+                    </a>
+  
+                  </div>
+                </div>
+  
+                <div class="event-holder">
+                  <div class="event-img-holder">
+                    <img src="img/research_03.jpg" alt="">
+                  </div>
+  
+                  <div class="event-date primary-c">
+                    <h3>Nov</h3>
+                    <h3>12</h3>
+                  </div>
+  
+                  <div class="event-details">
+                    <a href="">
+                      <h3>Seminar</h3>
+                    <h2>Blockchain: The Coming Revolution</h2>
+                    </a>
+  
+                  </div>
+                </div>
+              </div>
+  
+              <button class="primary-c">View all events</button>
+  
+            </div>
+          </div>
+        </section>
+
+  
+        <section id="research-grants" class="white-bg">
+          <div class="container">
+            <h1>Research &amp; Grants</h1>
+            <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.
+              Mus mauris vitae ultricies leo integer malesuada nunc vel. Mus mauris vitae ultricies leo integer malesuada nunc vel.
+            </p>
+  
+            <div id="research-pointers" class="grid">
+  
+              <div>
+                <h3>32 Research Projects</h3>
+                <p>Spread across Undergraduate and Graduate Programs</p>
+              </div>
+  
+              <div>
+                <h3>Tk 5 Crores in grants</h3>
+                <p>Spread across Undergraduate and Graduate Programs</p>
+              </div>
+  
+  
+              <div>
+                <h3>32 Research Projects</h3>
+                <p>Spread across Undergraduate and Graduate Programs</p>
+              </div>
+            </div>
+
+  
+          </div>
+        </section>
+  
+      </div>
+      
+    </main>

js/theme-settings.js

@@ -134,6 +134,55 @@ function closeNav() {
   document.getElementById("myNav").style.height = "0%";
 }
 
+//profile
+
+window.addEventListener("resize", showSidebarOptions);
+
+const biosTitle = document.querySelectorAll("h2.m-text");
+const list = document.querySelector("ul.profile-choices");
+const bios = document.querySelectorAll(".desc-block");
+
+if (window.innerWidth < 600) {
+  bios.forEach((el) => el.classList.remove(".desc-block-hidden"));
+} else {
+  biosTitle.forEach((el, index) => {
+    console.log(el.textContent);
+    let text =
+      '<li onclick="displaydetails(' +
+      index +
+      ')"><a >' +
+      el.textContent +
+      "</a></li>";
+    list.insertAdjacentHTML("beforeend", text);
+  });
+
+  bios.forEach((el) => el.classList.add("desc-block-hidden"));
+  bios[0].classList.remove("desc-block-hidden");
+
+  let listItem = document.querySelectorAll("ul.profile-choices>li");
+  listItem[0].classList.add("desc-active");
+}
+
+function displaydetails(i) {
+  bios.forEach((el) => el.classList.add("desc-block-hidden"));
+  bios[i].classList.remove("desc-block-hidden");
+
+  let listItem = document.querySelectorAll("ul.profile-choices>li");
+  listItem.forEach((el) => el.classList.remove("desc-active"));
+  listItem[i].classList.add("desc-active");
+}
+
+function showSidebarOptions() {
+  console.log(window.innerWidth);
+  let windowX = window.matchMedia("(max-width: 600px)");
+  if (windowX.matches) {
+    bios.forEach((el) => el.classList.remove(".desc-block-hidden"));
+  } else {
+    bios.forEach((el) => el.classList.add("desc-block-hidden"));
+    bios[0].classList.remove("desc-block-hidden");
+  }
+}
+
 // Simple example, see optional options for more configuration.
 const pickr = Pickr.create({
   el: ".color-picker",

page-template/page-home-hcoded.php

@@ -9,738 +9,800 @@ get_header(); ?>
 
 <!-- <div class="container full-width">
     <div class="row"> -->
-<main id="main" class="site-main" role="main">
 
-    <!-- section: Department -->
-    <section class="container-fluid white-bg">
-        <div class="container">
-            <h1>We evolve with technology</h1>
-            <p>
-                The CSE Department of UIU has been involved in several projects in last five years including projects under Thrust/Emerging Areas, Modernization and Removal of Obsolescence, Industry-Institution Interaction.
-            </p>
+<section id="banner" class="container-fluid">
+
+    <div class="banner-slider" data-banner-slider>
+        <button class="banner-slider-button prev" data-banner-slider-button="prev">
+            <span class="material-symbols-outlined">
+                arrow_back_ios
+            </span>
+        </button>
+        <button class="banner-slider-button next" data-banner-slider-button="next">
+            <span class="material-symbols-outlined">
+                arrow_forward_ios
+            </span>
+        </button>
+
+        <ul data-slides>
+
+            <li class="slide" data-active>
+                <div class="slider-single-div">
+                    <img src="<?php echo (get_template_directory_uri()) ?>/img/campus_01.jpg" alt="">
+
+                    <div class="banner-overlay">
+                        <h4>Welcome to </h4>
+                        <h1>United<br> International<br> University</h1>
+                        <h3>
+                            Department of <br>
+                            Computer Science &amp; Engineering
+                        </h3>
+                    </div>
+                </div>
+            </li>
 
-            <button class="primary-c">Learn more</button>
 
-            <div class="grid">
+            <li class="slide">
+                <div class="slider-single-div">
+                    <img src="<?php echo (get_template_directory_uri()) ?>/img/Slider_Swan2.jpg" alt="">
 
-                <div class="program">
-                    <div class="img-cont-2">
-                        <img src="<?php echo (get_template_directory_uri()) ?>/img/student_03.jpg" alt="">
+                    <div class="banner-overlay">
+                        <h4>Welcome to </h4>
+                        <h1>United International University</h1>
+                        <h3>
+                            Department of <br>
+                            Computer Science &amp; Engineering
+                        </h3>
                     </div>
-                    <div class="program-details">
-                        <h2>Graduate Program</h2>
-                        <p>
-                            <b>United International University (UIU)</b> has been running its M.Sc. in Computer Science and Engineering program since its inception and has attracted not only fresh undergraduates but also a handful number of ICT professionals from the industry.
-                        </p>
+                </div>
+            </li>
 
-                        <button class="primary-c"> View All Programs </button>
 
+            <li class="slide">
+                <div class="slider-single-div">
+                    <img src="<?php echo (get_template_directory_uri()) ?>/img/campus_02.jpg" alt="">
 
+                    <div class="banner-overlay">
+                        <h4>Welcome to </h4>
+                        <h1>Department of <br>
+                            Computer Science &amp; Engineering</h1>
+                        <h3>
+                            United International University
+                        </h3>
                     </div>
                 </div>
+            </li>
 
-                <div class="program">
-                    <div class="img-cont-2">
-                        <img src="<?php echo (get_template_directory_uri()) ?>/img/undergrad.jpg" alt="">
-                    </div>
+        </ul>
 
+    </div>
+</section>
 
-                    <div class="program-details">
-                        <h2>Undergraduate Program</h2>
-                        <p>
-                            Bachelor of Science in Computer Science and Engineering primarily involves the study of a number of core courses, which every CSE graduate should know, and a significant number of courses from specialized areas.
-                        </p>
-                        <button class="primary-c"> View All Programs </button>
-                    </div>
 
+<main id="main" class="site-main" role="main">
 
-                </div>
-
-            </div>
-        </div>
-    </section>
+    <div class="sections">
 
+        <section class="container-fluid white-bg">
+            <div class="container">
+                <h1>We evolve with technology</h1>
+                <p>
+                    The CSE Department of UIU has been involved in several projects in last five years including projects under Thrust/Emerging Areas, Modernization and Removal of Obsolescence, Industry-Institution Interaction.
+                </p>
 
-    <!-- section: faculty -->
-    <section id="faculty-section" class="container-fluid white-bg">
-        <div class="container">
-            <h1>World Class Faculty</h1>
-            <p>
-                The Department of Computer Science and Engineering at UIU boasts one of the biggest faculty bodies
-                amongst all private universities in the country and is bolstered by a rich and diverse battery of published research work.
-            </p>
-        </div>
 
-        <div class="container">
+                <button class="primary-c">Learn more</button>
 
-            <div id="faculty-img">
-                <img src="<?php echo (get_template_directory_uri()) ?>/img/faculty-grp.jpg" alt="">
-            </div>
+                <div class="grid">
 
-            <p>
-                The Department of Computer Science and Engineering faculty members are an impressive group, bearing the academic tradition of higher excellence. World renowned, they are engaged in ground-breaking research. Further, they are so attuned to what’s happening in business that they are shaping its future.
-            </p>
 
-            <button class="primary-c">
-                View complete faculty list
-            </button>
+                    <div class="program">
+                        <div class="img-cont-2">
+                            <img src="<?php echo (get_template_directory_uri()) ?>/img/student_03.jpg" alt="">
+                        </div>
+                        <div class="program-details">
+                            <h2>Graduate Program</h2>
+                            <p>
+                                <b>United International University (UIU)</b> has been running its M.Sc. in Computer Science and Engineering program since its inception and has attracted not only fresh undergraduates but also a handful number of ICT professionals from the industry.
+                            </p>
 
-        </div>
+                            <button class="primary-c"> View All Programs </button>
 
-    </section>
 
+                        </div>
+                    </div>
 
-    <!-- section: faculty-carousel -->
-    <section class="container-fluid car" id="faculty-carousel">
-        <div class="car-buttons">
-            <button class="car-control primary-c" id="prev-car" onclick="scrollToPrev()">
-                >
-            </button>
+                    <div class="program">
+                        <div class="img-cont-2">
+                            <img src="<?php echo (get_template_directory_uri()) ?>/img/undergrad.jpg" alt="">
+                        </div>
 
-            <button class="car-control primary-c" id="next-car" onclick="scrollToNext()">
-                >
-            </button>
-        </div>
 
+                        <div class="program-details">
+                            <h2>Undergraduate Program</h2>
+                            <p>
+                                Bachelor of Science in Computer Science and Engineering primarily involves the study of a number of core courses, which every CSE graduate should know, and a significant number of courses from specialized areas.
+                            </p>
+                            <button class="primary-c"> View All Programs </button>
+                        </div>
 
-        <div class="profile-carousel">
 
-            <div class="car-item">
-                <div class="car-item-holder">
-                    <div class="car-img-holder">
-                        <img src="<?php echo (get_template_directory_uri()) ?>/img/saim.jpg" alt="">
                     </div>
 
-                    <div class="faculty-details">
-                        <h2>Islam, Salekul<span class="degree">, Ph.D.</span></h2>
-                        <h3><span class="degree">Professor & Head of the Dept.</span></h3>
+                </div>
 
+            </div>
+        </section>
 
-                    </div>
 
+        <section id="faculty-section" class="container-fluid white-bg">
+            <div class="container">
+                <h1>World Class Faculty</h1>
+                <p>
+                    The Department of Computer Science and Engineering at UIU boasts one of the biggest faculty bodies
+                    amongst all private universities in the country and is bolstered by a rich and diverse battery of published research work.
+                </p>
+            </div>
+
+            <div class="container">
+
+                <div id="faculty-img">
+                    <img src="<?php echo (get_template_directory_uri()) ?>/img/faculty-grp.jpg" alt="">
                 </div>
+
+                <p>
+                    The Department of Computer Science and Engineering faculty members are an impressive group, bearing the academic tradition of higher excellence. World renowned, they are engaged in ground-breaking research. Further, they are so attuned to what’s happening in business that they are shaping its future.
+                </p>
+
+                <button class="primary-c">
+                    View complete faculty list
+                </button>
+
             </div>
 
-            <div class="car-item">
-                <div class="car-item-holder">
-                    <div class="car-img-holder">
-                        <img src="<?php echo (get_template_directory_uri()) ?>/img/mamun.jpg" alt="">
-                    </div>
+        </section>
 
-                    <div class="faculty-details">
-                        <h2>Mamun, Khondaker Abdullah Al<span class="degree">, Ph.D.</span></h2>
-                        <h3><span class="degree">Professor & Director - AIMS Lab</span></h3>
-                    </div>
+        <section class="container-fluid car" id="faculty-carousel">
+            <div class="car-buttons">
+                <button class="car-control primary-c" id="prev-car" onclick="scrollToPrev()">
+                    >
+                </button>
 
-                </div>
+                <button class="car-control primary-c" id="next-car" onclick="scrollToNext()">
+                    >
+                </button>
             </div>
 
-            <div class="car-item">
-                <div class="car-item-holder">
-                    <div class="car-img-holder">
-                        <img src="<?php echo (get_template_directory_uri()) ?>/img/swakkhar.jpg" alt="">
-                    </div>
 
-                    <div class="faculty-details">
-                        <h2>Shatabda, Swakkhar<span class="degree">, Ph.D</span></h2>
-                        <h3><span class="degree">Professor & Director - IQAC</span></h3>
+            <div class="profile-carousel">
 
+                <div class="car-item">
+                    <div class="car-item-holder">
+                        <div class="car-img-holder">
+                            <img src="<?php echo (get_template_directory_uri()) ?>/img/saim.jpg" alt="">
+                        </div>
 
-                    </div>
+                        <div class="faculty-details">
+                            <h2>Islam, Salekul<span class="degree">, Ph.D.</span></h2>
+                            <h3><span class="degree">Professor & Head of the Dept.</span></h3>
 
-                </div>
-            </div>
 
-            <div class="car-item">
-                <div class="car-item-holder">
-                    <div class="car-img-holder">
-                        <img src="<?php echo (get_template_directory_uri()) ?>/img/ShahriarRahman.jpg" alt="">
+                        </div>
+
                     </div>
+                </div>
 
-                    <div class="faculty-details">
-                        <h2>Rahman, Mohammad Shahriar<span class="degree">, Ph.D</span></h2>
-                        <h3><span class="degree">Professor & Director - CITS</span></h3>
+                <div class="car-item">
+                    <div class="car-item-holder">
+                        <div class="car-img-holder">
+                            <img src="<?php echo (get_template_directory_uri()) ?>/img/mamun.jpg" alt="">
+                        </div>
 
+                        <div class="faculty-details">
+                            <h2>Mamun, Khondaker Abdullah Al<span class="degree">, Ph.D.</span></h2>
+                            <h3><span class="degree">Professor & Director - AIMS Lab</span></h3>
+                        </div>
 
                     </div>
-
                 </div>
-            </div>
 
-            <div class="car-item">
+                <div class="car-item">
+                    <div class="car-item-holder">
+                        <div class="car-img-holder">
+                            <img src="<?php echo (get_template_directory_uri()) ?>/img/swakkhar.jpg" alt="">
+                        </div>
 
-                <div class="car-item-holder">
-                    <div class="car-img-holder">
-                        <img src="<?php echo (get_template_directory_uri()) ?>/img/mofizur.jpg" alt="">
-                    </div>
+                        <div class="faculty-details">
+                            <h2>Shatabda, Swakkhar<span class="degree">, Ph.D</span></h2>
+                            <h3><span class="degree">Professor & Director - IQAC</span></h3>
 
-                    <div class="faculty-details">
-                        <h2>Rahman, Chowdhury Mofizur<span class="degree">, Ph.D</span></h2>
-                        <h3><span class="degree">Professor & Advisor to Board of Trustees</span></h3>
 
+                        </div>
 
                     </div>
-
                 </div>
-            </div>
 
+                <div class="car-item">
+                    <div class="car-item-holder">
+                        <div class="car-img-holder">
+                            <img src="<?php echo (get_template_directory_uri()) ?>/img/ShahriarRahman.jpg" alt="">
+                        </div>
+
+                        <div class="faculty-details">
+                            <h2>Rahman, Mohammad Shahriar<span class="degree">, Ph.D</span></h2>
+                            <h3><span class="degree">Professor & Director - CITS</span></h3>
 
-            <div class="car-item">
 
-                <div class="car-item-holder">
-                    <div class="car-img-holder">
-                        <img src="<?php echo (get_template_directory_uri()) ?>/img/nurul-huda.png" alt="">
+                        </div>
+
                     </div>
+                </div>
+
+                <div class="car-item">
+
+                    <div class="car-item-holder">
+                        <div class="car-img-holder">
+                            <img src="<?php echo (get_template_directory_uri()) ?>/img/mofizur.jpg" alt="">
+                        </div>
 
-                    <div class="faculty-details">
-                        <h2>Huda, Mohammad Nurul<span class="degree">, Ph.D</span></h2>
-                        <h3><span class="degree">Professor & Director - MSCSE</span></h3>
+                        <div class="faculty-details">
+                            <h2>Rahman, Chowdhury Mofizur<span class="degree">, Ph.D</span></h2>
+                            <h3><span class="degree">Professor & Advisor to Board of Trustees</span></h3>
+
+
+                        </div>
 
                     </div>
+                </div>
 
+
+                <div class="car-item">
+
+                    <div class="car-item-holder">
+                        <div class="car-img-holder">
+                            <img src="<?php echo (get_template_directory_uri()) ?>/img/nurul-huda.png" alt="">
+                        </div>
+
+                        <div class="faculty-details">
+                            <h2>Huda, Mohammad Nurul<span class="degree">, Ph.D</span></h2>
+                            <h3><span class="degree">Professor & Director - MSCSE</span></h3>
+
+                        </div>
+
+                    </div>
                 </div>
+
+
             </div>
-        </div>
 
-    </section>
+        </section>
 
 
-    <!-- section: Success-section -->
-    <section id="Success-section" class="container-fluid white-bg">
-        <div class="container">
-            <h1>Success Stories</h1>
-            <p>
-                Our students inspire us by their courage and perseverance, and are a reminder that obstacles can be overcome when you have just one person cheering you on to the finish line.
-            </p>
-        </div>
+        <section id="Success-section" class="container-fluid white-bg">
+            <div class="container">
+                <h1>Success Stories</h1>
+                <p>
+                    Our students inspire us by their courage and perseverance, and are a reminder that obstacles can be overcome when you have just one person cheering you on to the finish line.
+                </p>
+            </div>
 
-        <div class="container">
+            <div class="container">
 
 
-            <div id="us-imgs" class="grid student-stories">
+                <div id="us-imgs" class="grid student-stories">
 
-                <div>
-                    <div class="img-cont">
-                        <img src="<?php echo (get_template_directory_uri()) ?>/img/story_hasan_shaharear.jpg" alt="">
-                    </div>
                     <div>
-                        <h2>Mohammad Hasan Shaharear</h2>
-                        <h5>Senior Database Engineer,Therap (BD) Ltd</h5>
-                        <p>
-                            It was a complete unknown territory for me when I admitted to BSCSE of UIU in 2003. In fact, I had never operate a computer before. Initially I was a bit exited as well as scared. Though I had tough time in the beginning, gradually I became familiar with logic of computing and programming languages. With the course of time, I had start enjoying different courses.
-                        </p>
-
-                        <a href="#">Learn more</a>
+                        <div class="img-cont">
+                            <img src="<?php echo (get_template_directory_uri()) ?>/img/story_hasan_shaharear.jpg" alt="">
+                        </div>
+                        <div>
+                            <h2>Mohammad Hasan Shaharear</h2>
+                            <h5>Senior Database Engineer,Therap (BD) Ltd</h5>
+                            <p>
+                                It was a complete unknown territory for me when I admitted to BSCSE of UIU in 2003. In fact, I had never operate a computer before. Initially I was a bit exited as well as scared. Though I had tough time in the beginning, gradually I became familiar with logic of computing and programming languages. With the course of time, I had start enjoying different courses.
+                            </p>
+
+                            <a href="#">Learn more</a>
+                        </div>
                     </div>
-                </div>
 
-                <div>
-                    <div class="img-cont">
-                        <img src="<?php echo (get_template_directory_uri()) ?>/img/story_foysal-ahmed.jpg" alt="">
+                    <div>
+                        <div class="img-cont">
+                            <img src="<?php echo (get_template_directory_uri()) ?>/img/story_foysal-ahmed.jpg" alt="">
+                        </div>
+                        <div>
+                            <h2>Foysal Ahamed</h2>
+                            <h5>Software Engineer, TigerIT Bangladesh Limited</h5>
+                            <p>
+                                I still remember the day I first stepped into the UIU campus. I really did not know what kind of career path I would choose. Two weeks into the SPL (Structured Programming Language) course, I discovered something that was driving me, something amazing happened and finally I found myself in a position where I knew what I was going to do. Dr.
+                            </p>
+                            <a href="#">Learn more</a>
+                        </div>
                     </div>
+
                     <div>
-                        <h2>Foysal Ahamed</h2>
-                        <h5>Software Engineer, TigerIT Bangladesh Limited</h5>
-                        <p>
-                            I still remember the day I first stepped into the UIU campus. I really did not know what kind of career path I would choose. Two weeks into the SPL (Structured Programming Language) course, I discovered something that was driving me, something amazing happened and finally I found myself in a position where I knew what I was going to do. Dr.
-                        </p>
-                        <a href="#">Learn more</a>
+                        <div class="img-cont">
+                            <img src="<?php echo (get_template_directory_uri()) ?>/img/story_kamrul_islam.jpg" alt="">
+                        </div>
+                        <div>
+                            <h2>Kamrul Islam Shahin</h2>
+                            <h5>Programmer, Big Web Technologies Limited</h5>
+                            <p>
+                                It’s still like a dream. The day I accomplished my goal by finishing my studies, all the struggles of the past years seemed nothing. My hard work showed its result finally. When I started my educational journey with United International University (UIU), the path seemed dark, confusing and quite uncertain.
+                            </p>
+                            <a href="#">Learn more </a>
+                        </div>
                     </div>
+
+
                 </div>
 
                 <div>
-                    <div class="img-cont">
-                        <img src="<?php echo (get_template_directory_uri()) ?>/img/story_kamrul_islam.jpg" alt="">
-                    </div>
-                    <div>
-                        <h2>Kamrul Islam Shahin</h2>
-                        <h5>Programmer, Big Web Technologies Limited</h5>
-                        <p>
-                            It’s still like a dream. The day I accomplished my goal by finishing my studies, all the struggles of the past years seemed nothing. My hard work showed its result finally. When I started my educational journey with United International University (UIU), the path seemed dark, confusing and quite uncertain.
-                        </p>
-                        <a href="#">Learn more </a>
-                    </div>
+                    <h1>Notable Alumni</h1>
+                    <p>
+                        Pellentesque est est, luctus non iaculis sed, congue non diam. In efficitur gravida ipsum vitae finibus. Etiam sollicitudin placerat leo.
+                    </p>
                 </div>
 
 
-            </div>
+                <button class="primary-c">
+                    View complete Alumni list
+                </button>
 
-            <div>
-                <h1>Notable Alumni</h1>
-                <p>
-                    Pellentesque est est, luctus non iaculis sed, congue non diam. In efficitur gravida ipsum vitae finibus. Etiam sollicitudin placerat leo.
-                </p>
             </div>
 
+        </section>
 
-            <button class="primary-c">
-                View complete Alumni list
-            </button>
+        <section class="container-fluid car" id="alumni-carousel">
+            <div class="car-buttons">
+                <button class="car-control primary-c" onclick="scrollToPrevAl()">
+                    < </button>
 
-        </div>
+                        <button class="car-control primary-c" onclick="scrollToNextAl()">
+                            >
+                        </button>
+            </div>
 
-    </section>
 
+            <div class="profile-carousel">
 
-    <!-- section: alumni-carousel -->
-    <section class="container-fluid car" id="alumni-carousel">
-        <div class="car-buttons">
-            <button class="car-control primary-c" onclick="scrollToPrevAl()">
-                < </button>
+                <div class="car-item">
+                    <div class="car-item-holder">
+                        <div class="car-img-holder">
+                            <img src="<?php echo (get_template_directory_uri()) ?>/img/tazbir_ur_rahman.jpeg" alt="">
+                        </div>
 
-                    <button class="car-control primary-c" onclick="scrollToNextAl()">
-                        >
-                    </button>
-        </div>
+                        <div class="faculty-details">
+                            <h2>Md. Tazbir Ur Rahman Bhuiyan</h2>
+                            <h3><span class="degree">Lead Engineer at Brain Station 23 Limited</span></h3>
 
 
-        <div class="profile-carousel">
+                        </div>
 
-            <div class="car-item">
-                <div class="car-item-holder">
-                    <div class="car-img-holder">
-                        <img src="<?php echo (get_template_directory_uri()) ?>/img/tazbir_ur_rahman.jpeg" alt="">
                     </div>
+                </div>
 
-                    <div class="faculty-details">
-                        <h2>Md. Tazbir Ur Rahman Bhuiyan</h2>
-                        <h3><span class="degree">Lead Engineer at Brain Station 23 Limited</span></h3>
+                <div class="car-item">
+                    <div class="car-item-holder">
+                        <div class="car-img-holder">
+                            <img src="<?php echo (get_template_directory_uri()) ?>/img/saifur_rahman_sazib.jpeg" alt="">
+                        </div>
 
+                        <div class="faculty-details">
+                            <h2>Saifur Rahman Sazib</h2>
+                            <h3><span class="degree">Lead Engineer at Objectstream Inc, USA</span></h3>
 
-                    </div>
 
-                </div>
-            </div>
+                        </div>
 
-            <div class="car-item">
-                <div class="car-item-holder">
-                    <div class="car-img-holder">
-                        <img src="<?php echo (get_template_directory_uri()) ?>/img/saifur_rahman_sazib.jpeg" alt="">
                     </div>
+                </div>
 
-                    <div class="faculty-details">
-                        <h2>Saifur Rahman Sazib</h2>
-                        <h3><span class="degree">Lead Engineer at Objectstream Inc, USA</span></h3>
 
 
-                    </div>
+                <div class="car-item">
+                    <div class="car-item-holder">
+                        <div class="car-img-holder">
+                            <img src="<?php echo (get_template_directory_uri()) ?>/img/faisal_kabir.jpeg" alt="">
+                        </div>
 
-                </div>
-            </div>
+                        <div class="faculty-details">
+                            <h2>Md Faisal Kabir</h2>
+                            <h3><span class="degree">PhD student at North Dakota State University (NDSU)</span></h3>
 
 
+                        </div>
 
-            <div class="car-item">
-                <div class="car-item-holder">
-                    <div class="car-img-holder">
-                        <img src="<?php echo (get_template_directory_uri()) ?>/img/faisal_kabir.jpeg" alt="">
                     </div>
+                </div>
 
-                    <div class="faculty-details">
-                        <h2>Md Faisal Kabir</h2>
-                        <h3><span class="degree">PhD student at North Dakota State University (NDSU)</span></h3>
+                <div class="car-item">
+                    <div class="car-item-holder">
+                        <div class="car-img-holder">
+                            <img src="<?php echo (get_template_directory_uri()) ?>/img/achia_nila.jpeg" alt="">
+                        </div>
 
+                        <div class="faculty-details">
+                            <h2>Achia Nila</h2>
+                            <h3><span class="degree"> Founder, Women In Digital - Empowerment through Technology</span></h3>
 
-                    </div>
 
-                </div>
-            </div>
+                        </div>
 
-            <div class="car-item">
-                <div class="car-item-holder">
-                    <div class="car-img-holder">
-                        <img src="<?php echo (get_template_directory_uri()) ?>/img/achia_nila.jpeg" alt="">
                     </div>
+                </div>
 
-                    <div class="faculty-details">
-                        <h2>Achia Nila</h2>
-                        <h3><span class="degree"> Founder, Women In Digital - Empowerment through Technology</span></h3>
+                <div class="car-item">
+                    <div class="car-item-holder">
+                        <div class="car-img-holder">
+                            <img src="<?php echo (get_template_directory_uri()) ?>/img/hussain_kmr.jpeg" alt="">
+                        </div>
 
+                        <div class="faculty-details">
+                            <h2>Hussain KMR Behestee</h2>
+                            <h3><span class="degree">Mobile Device Specialist, K.K. Innovative Solutions</span></h3>
 
-                    </div>
 
-                </div>
-            </div>
+                        </div>
 
-            <div class="car-item">
-                <div class="car-item-holder">
-                    <div class="car-img-holder">
-                        <img src="<?php echo (get_template_directory_uri()) ?>/img/hussain_kmr.jpeg" alt="">
                     </div>
-
-                    <div class="faculty-details">
-                        <h2>Hussain KMR Behestee</h2>
-                        <h3><span class="degree">Mobile Device Specialist, K.K. Innovative Solutions</span></h3>
+                </div>
 
 
-                    </div>
 
-                </div>
             </div>
 
+        </section>
 
+        <section id="dept-notices" class="container-fluid mid-roll">
 
-        </div>
 
-    </section>
 
+            <div class="bg-tint">
 
-    <!-- section: faculty-midroll -->
-    <section id="faculty-midroll" class="container-fluid mid-roll">
+                <div class="container">
 
+                    <h1>Department Notices</h1>
 
+                    <div class="notice-main">
 
-        <div class="bg-tint">
+                        <a href="#">
 
-            <div class="container">
-
-                <h1>Department Notices</h1>
-
-                <div class="notice-main">
+                            <div class="notice-container">
 
-                    <a href="#">
+                                <div class="event-date">
+                                    <h3>Dec</h3>
+                                    <h3>16</h3>
+                                </div>
 
-                        <div class="notice-container">
+                                <div>
+                                    <h6><span class="subtitle">8 Dec, 2022</span></h6>
+                                    <h4>List of Candidates for Fall 2022 semester</h4>
+                                    <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.</p>
+                                </div>
 
-                            <div class="event-date">
-                                <h3>Dec</h3>
-                                <h3>16</h3>
                             </div>
+                        </a>
 
-                            <div>
-                                <h6><span class="subtitle">8 Dec, 2022</span></h6>
-                                <h4>List of Candidates for Fall 2022 semester</h4>
-                                <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.</p>
-                            </div>
+                        <a href="#">
 
-                        </div>
-                    </a>
+                            <div class="notice-container">
 
-                    <a href="#">
+                                <div class="event-date">
+                                    <h3>Dec</h3>
+                                    <h3>12</h3>
+                                </div>
 
-                        <div class="notice-container">
+                                <div>
+                                    <h6><span class="subtitle">8 Dec, 2022</span></h6>
+                                    <h4>List of Candidates for Fall 2022 semester</h4>
+                                    <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.</p>
+                                </div>
 
-                            <div class="event-date">
-                                <h3>Dec</h3>
-                                <h3>12</h3>
                             </div>
+                        </a>
 
-                            <div>
-                                <h6><span class="subtitle">8 Dec, 2022</span></h6>
-                                <h4>List of Candidates for Fall 2022 semester</h4>
-                                <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.</p>
-                            </div>
 
-                        </div>
-                    </a>
+                        <a href="#">
 
+                            <div class="notice-container">
 
-                    <a href="#">
+                                <div class="event-date">
+                                    <h3>Dec</h3>
+                                    <h3>03</h3>
+                                </div>
 
-                        <div class="notice-container">
+                                <div>
+                                    <h6><span class="subtitle">8 Dec, 2022</span></h6>
+                                    <h4>List of Candidates for Fall 2022 semester</h4>
+                                    <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.</p>
+                                </div>
 
-                            <div class="event-date">
-                                <h3>Dec</h3>
-                                <h3>03</h3>
                             </div>
+                        </a>
 
-                            <div>
-                                <h6><span class="subtitle">8 Dec, 2022</span></h6>
-                                <h4>List of Candidates for Fall 2022 semester</h4>
-                                <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.</p>
-                            </div>
 
-                        </div>
-                    </a>
+                        <a href="#">
 
+                            <div class="notice-container">
 
-                    <a href="#">
+                                <div class="event-date">
+                                    <h3>Nov</h3>
+                                    <h3>25</h3>
+                                </div>
 
-                        <div class="notice-container">
+                                <div>
+                                    <h6><span class="subtitle">8 Dec, 2022</span></h6>
+                                    <h4>List of Candidates for Fall 2022 semester</h4>
+                                    <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.</p>
+                                </div>
 
-                            <div class="event-date">
-                                <h3>Nov</h3>
-                                <h3>25</h3>
                             </div>
+                        </a>
 
-                            <div>
-                                <h6><span class="subtitle">8 Dec, 2022</span></h6>
-                                <h4>List of Candidates for Fall 2022 semester</h4>
-                                <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.</p>
-                            </div>
+                        <a href="#">
 
-                        </div>
-                    </a>
+                            <div class="notice-container">
 
-                    <a href="#">
+                                <div class="event-date">
+                                    <h3>Nov</h3>
+                                    <h3>12</h3>
+                                </div>
 
-                        <div class="notice-container">
+                                <div>
+                                    <h6><span class="subtitle">8 Dec, 2022</span></h6>
+                                    <h4>List of Candidates for Fall 2022 semester</h4>
+                                    <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.</p>
+                                </div>
 
-                            <div class="event-date">
-                                <h3>Nov</h3>
-                                <h3>12</h3>
                             </div>
+                        </a>
 
-                            <div>
-                                <h6><span class="subtitle">8 Dec, 2022</span></h6>
-                                <h4>List of Candidates for Fall 2022 semester</h4>
-                                <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.</p>
-                            </div>
 
-                        </div>
-                    </a>
 
+                        <button>View All Notices</button>
 
 
-                    <button>View All Notices</button>
+                    </div>
 
 
                 </div>
-
-
             </div>
-        </div>
-    </section>
-
-
-    <!-- section: news -->
-    <section id="news" class="container-fluid white-bg">
+        </section>
 
-        <div class="container">
+        <section id="dept-news" class="container-fluid white-bg">
 
+            <div class="container">
 
 
-            <h1>Department News</h1>
-
-            <p>
-                Catch up with what's happening at the Department of CSE
-            </p>
-
-            <div class="grid news-row">
 
-                <div class="news-big-img">
-                    <div class="news-big-img-holder">
-                        <img src="<?php echo (get_template_directory_uri()) ?>/img/campus_05.jpg" alt="">
-                    </div>
+                <h1>Department News</h1>
 
-                    <div class="news-big-img-text">
-                        <h5>28th March, 2016</h5>
-                        <h4> <a href=""> Seminar</a></h4>
-                        <a href="">
-                            <p>Development and Mining of a Volatile Organic Compound Database</p>
-                        </a>
-                    </div>
-                </div>
+                <p>
+                    Catch up with what's happening at the Department of CSE
+                </p>
 
+                <div class="grid news-row">
 
-                <div class="grid">
-                    <div class="news-small-img">
-                        <div class="news-sm-img-holder">
+                    <div class="news-big-img">
+                        <div class="news-big-img-holder">
                             <img src="<?php echo (get_template_directory_uri()) ?>/img/campus_05.jpg" alt="">
                         </div>
-                        <div class="news-sm-img-text">
+
+                        <div class="news-big-img-text">
                             <h5>28th March, 2016</h5>
                             <h4> <a href=""> Seminar</a></h4>
                             <a href="">
-                                <p>Development and Mining of a Volatile Compounds</p>
+                                <p>Development and Mining of a Volatile Organic Compound Database</p>
                             </a>
                         </div>
                     </div>
 
-                    <div class="news-small-img">
-                        <div class="news-sm-img-holder">
-                            <img src="<?php echo (get_template_directory_uri()) ?>/img/campus_01.jpg" alt="">
+
+                    <div class="grid">
+                        <div class="news-small-img">
+                            <div class="news-sm-img-holder">
+                                <img src="<?php echo (get_template_directory_uri()) ?>/img/campus_05.jpg" alt="">
+                            </div>
+                            <div class="news-sm-img-text">
+                                <h5>28th March, 2016</h5>
+                                <h4> <a href=""> Seminar</a></h4>
+                                <a href="">
+                                    <p>Development and Mining of a Volatile Compounds</p>
+                                </a>
+                            </div>
                         </div>
-                        <div class="news-sm-img-text">
-                            <h5>28th March, 2016</h5>
-                            <h4> <a href=""> Seminar</a></h4>
-                            <a href="">
-                                <p>Development and Mining of a Volatile Compounds</p>
-                            </a>
+
+                        <div class="news-small-img">
+                            <div class="news-sm-img-holder">
+                                <img src="<?php echo (get_template_directory_uri()) ?>/img/campus_01.jpg" alt="">
+                            </div>
+                            <div class="news-sm-img-text">
+                                <h5>28th March, 2016</h5>
+                                <h4> <a href=""> Seminar</a></h4>
+                                <a href="">
+                                    <p>Development and Mining of a Volatile Compounds</p>
+                                </a>
+                            </div>
                         </div>
-                    </div>
 
+                    </div>
                 </div>
-            </div>
 
-            <div class="grid news-row">
+                <div class="grid news-row">
 
-                <div class="grid">
-                    <div class="news-small-img">
-                        <div class="news-sm-img-holder">
-                            <img src="<?php echo (get_template_directory_uri()) ?>/img/campus_05.jpg" alt="">
+                    <div class="grid">
+                        <div class="news-small-img">
+                            <div class="news-sm-img-holder">
+                                <img src="<?php echo (get_template_directory_uri()) ?>/img/campus_05.jpg" alt="">
+                            </div>
+                            <div class="news-sm-img-text">
+                                <h5>28th March, 2016</h5>
+                                <h4> <a href=""> Seminar</a></h4>
+                                <a href="">
+                                    <p>Development and Mining of a Volatile Compounds</p>
+                                </a>
+                            </div>
                         </div>
-                        <div class="news-sm-img-text">
-                            <h5>28th March, 2016</h5>
-                            <h4> <a href=""> Seminar</a></h4>
-                            <a href="">
-                                <p>Development and Mining of a Volatile Compounds</p>
-                            </a>
+
+                        <div class="news-small-img">
+                            <div class="news-sm-img-holder">
+                                <img src="<?php echo (get_template_directory_uri()) ?>/img/campus_01.jpg" alt="">
+                            </div>
+                            <div class="news-sm-img-text">
+                                <h5>28th March, 2016</h5>
+                                <h4> <a href=""> Seminar</a></h4>
+                                <a href="">
+                                    <p>Development and Mining of a Volatile Compounds</p>
+                                </a>
+                            </div>
                         </div>
+
                     </div>
 
-                    <div class="news-small-img">
-                        <div class="news-sm-img-holder">
-                            <img src="<?php echo (get_template_directory_uri()) ?>/img/campus_01.jpg" alt="">
+                    <div class="news-big-img">
+                        <div class="news-big-img-holder">
+                            <img src="<?php echo (get_template_directory_uri()) ?>/img/campus_05.jpg" alt="">
                         </div>
-                        <div class="news-sm-img-text">
+
+                        <div class="news-big-img-text">
                             <h5>28th March, 2016</h5>
                             <h4> <a href=""> Seminar</a></h4>
                             <a href="">
-                                <p>Development and Mining of a Volatile Compounds</p>
+                                <p>Development and Mining of a Volatile Organic Compound Database</p>
                             </a>
                         </div>
                     </div>
 
-                </div>
 
-                <div class="news-big-img">
-                    <div class="news-big-img-holder">
-                        <img src="<?php echo (get_template_directory_uri()) ?>/img/campus_05.jpg" alt="">
-                    </div>
-
-                    <div class="news-big-img-text">
-                        <h5>28th March, 2016</h5>
-                        <h4> <a href=""> Seminar</a></h4>
-                        <a href="">
-                            <p>Development and Mining of a Volatile Organic Compound Database</p>
-                        </a>
-                    </div>
                 </div>
 
-
+                <button class="primary-c">View All News</button>
             </div>
 
-            <button class="primary-c">View All News</button>
-        </div>
+        </section>
 
-    </section>
+        <section id="events" class="container-fluid mid-roll">
+            <div class="bg-tint">
 
-    <!-- section: events -->
-    <section id="events" class="container-fluid mid-roll">
-        <div class="bg-tint">
-
-            <div class="container">
+                <div class="container">
 
-                <h1>Upcoming Events</h1>
+                    <h1>Upcoming Events</h1>
 
-                <div class="grid">
-                    <div class="event-holder">
-                        <div class="event-img-holder">
-                            <img src="<?php echo (get_template_directory_uri()) ?>/img/0555.jpg" alt="">
-                        </div>
+                    <div class="grid">
+                        <div class="event-holder">
+                            <div class="event-img-holder">
+                                <img src="<?php echo (get_template_directory_uri()) ?>/img/0555.jpg" alt="">
+                            </div>
 
-                        <div class="event-date primary-c">
-                            <h3>Dec</h3>
-                            <h3>17</h3>
-                        </div>
+                            <div class="event-date primary-c">
+                                <h3>Dec</h3>
+                                <h3>17</h3>
+                            </div>
 
-                        <div class="event-details">
-                            <a href="">
-                                <h3>Seminar</h3>
-                                <h2>Blockchain: The Coming Revolution</h2>
-                            </a>
+                            <div class="event-details">
+                                <a href="">
+                                    <h3>Seminar</h3>
+                                    <h2>Blockchain: The Coming Revolution</h2>
+                                </a>
+                            </div>
                         </div>
-                    </div>
 
-                    <div class="event-holder">
-                        <div class="event-img-holder">
-                            <img src="<?php echo (get_template_directory_uri()) ?>/img/2.jpg" alt="">
-                        </div>
+                        <div class="event-holder">
+                            <div class="event-img-holder">
+                                <img src="<?php echo (get_template_directory_uri()) ?>/img/2.jpg" alt="">
+                            </div>
 
-                        <div class="event-date primary-c">
-                            <h3>Nov</h3>
-                            <h3>27</h3>
-                        </div>
+                            <div class="event-date primary-c">
+                                <h3>Nov</h3>
+                                <h3>27</h3>
+                            </div>
 
-                        <div class="event-details">
-                            <a href="">
-                                <h3>Pre-Advising</h3>
-                                <h2>Blockchain: The Coming Revolution</h2>
-                            </a>
+                            <div class="event-details">
+                                <a href="">
+                                    <h3>Pre-Advising</h3>
+                                    <h2>Blockchain: The Coming Revolution</h2>
+                                </a>
+                            </div>
                         </div>
-                    </div>
 
-                    <div class="event-holder">
-                        <div class="event-img-holder">
-                            <img src="<?php echo (get_template_directory_uri()) ?>/img/research_01.jpg" alt="">
-                        </div>
+                        <div class="event-holder">
+                            <div class="event-img-holder">
+                                <img src="<?php echo (get_template_directory_uri()) ?>/img/research_01.jpg" alt="">
+                            </div>
 
-                        <div class="event-date primary-c">
-                            <h3>Nov</h3>
-                            <h3>22</h3>
-                        </div>
+                            <div class="event-date primary-c">
+                                <h3>Nov</h3>
+                                <h3>22</h3>
+                            </div>
 
-                        <div class="event-details">
-                            <a href="">
-                                <h3>Cultural Event</h3>
-                                <h2>Blockchain: The Coming Revolution</h2>
-                            </a>
+                            <div class="event-details">
+                                <a href="">
+                                    <h3>Cultural Event</h3>
+                                    <h2>Blockchain: The Coming Revolution</h2>
+                                </a>
 
+                            </div>
                         </div>
-                    </div>
 
-                    <div class="event-holder">
-                        <div class="event-img-holder">
-                            <img src="<?php echo (get_template_directory_uri()) ?>/img/research_03.jpg" alt="">
-                        </div>
+                        <div class="event-holder">
+                            <div class="event-img-holder">
+                                <img src="<?php echo (get_template_directory_uri()) ?>/img/research_03.jpg" alt="">
+                            </div>
 
-                        <div class="event-date primary-c">
-                            <h3>Nov</h3>
-                            <h3>12</h3>
-                        </div>
+                            <div class="event-date primary-c">
+                                <h3>Nov</h3>
+                                <h3>12</h3>
+                            </div>
 
-                        <div class="event-details">
-                            <a href="">
-                                <h3>Seminar</h3>
-                                <h2>Blockchain: The Coming Revolution</h2>
-                            </a>
+                            <div class="event-details">
+                                <a href="">
+                                    <h3>Seminar</h3>
+                                    <h2>Blockchain: The Coming Revolution</h2>
+                                </a>
 
+                            </div>
                         </div>
                     </div>
-                </div>
-
-                <button class="primary-c">View all events</button>
 
+                    <button class="primary-c">View all events</button>
 
+                </div>
             </div>
-        </div>
-    </section>
-
+        </section>
 
 
-    <!-- section: Research -->
-    <section class="white-bg">
-        <div class="container">
-            <h1>Research &amp; Grants</h1>
-            <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.
-                Mus mauris vitae ultricies leo integer malesuada nunc vel. Mus mauris vitae ultricies leo integer malesuada nunc vel.
-            </p>
+        <section id="research-grants" class="white-bg">
+            <div class="container">
+                <h1>Research &amp; Grants</h1>
+                <p>Maecenas sed enim ut sem viverra aliquet. Neque laoreet suspendisse interdum consectetur.
+                    Mus mauris vitae ultricies leo integer malesuada nunc vel. Mus mauris vitae ultricies leo integer malesuada nunc vel.
+                </p>
 
-            <div id="research-pointers" class="grid">
+                <div id="research-pointers" class="grid">
 
-                <div>
-                    <h3>32 Research Projects</h3>
-                    <p>Spread across Undergraduate and Graduate Programs</p>
-                </div>
+                    <div>
+                        <h3>32 Research Projects</h3>
+                        <p>Spread across Undergraduate and Graduate Programs</p>
+                    </div>
 
-                <div>
-                    <h3>Tk 5 Crores in grants</h3>
-                    <p>Spread across Undergraduate and Graduate Programs</p>
-                </div>
+                    <div>
+                        <h3>Tk 5 Crores in grants</h3>
+                        <p>Spread across Undergraduate and Graduate Programs</p>
+                    </div>
 
 
-                <div>
-                    <h3>32 Research Projects</h3>
-                    <p>Spread across Undergraduate and Graduate Programs</p>
+                    <div>
+                        <h3>32 Research Projects</h3>
+                        <p>Spread across Undergraduate and Graduate Programs</p>
+                    </div>
                 </div>
-            </div>
-        </div>
-    </section>
-
 
 
+            </div>
+        </section>
 
+    </div>
 
 </main><!-- #main -->
 <!-- </div> -->

single-faculty.php

@@ -1,4 +1,5 @@
 <?php
+
 /**
  * Template Name: Single Project
  *
@@ -6,20 +7,513 @@
  */
 get_header(); ?>
 
-<div id="content" class="site-content full-width">
-	<main id="main" class="site-main" role="main">
 
-		<section class="container page-contents">
-			<div class="row content-holder">
-				<div class="col-xs-12">
-					<?php while ( have_posts() ) : the_post(); 
-					the_content(); 
-					endwhile; ?>
+<?php while (have_posts()) : the_post(); ?>
+
+	<section class="static-banner">
+		<div class="static-banner-underlay">
+			<img src="<?php echo get_the_post_thumbnail_url(); ?>" alt="">
+		</div>
+		<div class="static-banner-overlay"></div>
+	</section>
+
+	<main>
+		<section class="profile-header">
+
+
+			<div class="profile-main">
+				<div class="container">
+
+					<div class="top-row">
+						<div class="profile-img-container">
+							<img src="<?php the_field('profile_photo'); ?>" alt="">
+						</div>
+
+						<div class="profile-header-text">
+							<!-- <h3 class="sub-title">Faculty Profile</h3> -->
+							<h1 class="profile-name">
+								<?php echo get_the_title(); ?>
+							</h1>
+
+							<h2 class="profile-des">
+								<?php the_field('designation'); ?>
+							</h2>
+
+							<?php if (have_rows('contact_details')) : ?>
+
+								<?php while (have_rows('contact_details')) : the_row(); ?>
+
+									<span class="contact-dets"><?php the_sub_field('contact_info'); ?></span>
+									<?php
+									//  $sub_field_3 = get_sub_field('sub_field_3');
+									// do something with $sub_field_3
+									?>
+								<?php endwhile; ?>
+
+							<?php endif; ?>
+
+						</div>
+					</div>
+				</div>
+			</div>
+
+		</section>
+
+
+		<section class="profile-body primary-c">
+			<div class="container">
+				<div class="profile-second-row">
+					<div class="left-col">
+						<ul class="profile-choices">
+
+						</ul>
+
+					</div>
+
+					<div class="profile-main-description">
+
+
+						<?php if (have_rows('main_information')) : ?>
+
+							<?php while (have_rows('main_information')) : the_row(); ?>
+
+								<span class="contact-dets"></span>
+								<div class="bio desc-block">
+									<h2 class="m-text"><?php the_sub_field('title'); ?></h2>
+									<p class="m-text">
+										<?php the_sub_field('contents'); ?>
+									</p>
+								</div>
+
+							<?php endwhile; ?>
+
+						<?php endif; ?>
+					</div>
 				</div>
 			</div>
-		</section><!-- .page-contents -->
+		</section>
+	</main>
+	<!-- #main -->
+
+<?php endwhile; // end of the loop.
+?>
+<style>
+	header {
+		margin: 0px !important;
+		padding: 0px !important;
+		height: 350px;
+		overflow: hidden;
+	}
+
+	main {
+		min-height: calc(100vh - 400px);
+		position: relative;
+		padding: 0px !important;
+		background: rgb(56, 32, 23);
+		background: linear-gradient(180deg, rgb(48, 18, 7) 0%, rgb(40, 21, 13) 22%, rgb(5, 0, 6) 100%);
+		height: 100%;
+	}
+
+	h1 {
+		font-family: "DM Serif Text", serif;
+		font-size: 40px !important;
+		letter-spacing: 2px !important;
+		line-height: 110%;
+		color: #fff;
+		width: 100%;
+		margin: 20px auto !important;
+		text-align: left;
+	}
+
+	h2 {
+		font-family: "DM Serif Text", serif;
+		font-size: 40px;
+		line-height: 45px;
+		color: #ffc3c3;
+		width: 100%;
+		margin: 20px auto;
+		text-align: left;
+	}
+
+	p {
+		max-width: 1200px;
+		font-size: 18px;
+		color: #ffc3c3;
+		margin: 50px 15px !important;
+	}
+
+	.desc-block ul>li {
+		list-style: none;
+		font-size: 16px;
+		line-height: 20px;
+		font-size: 18px;
+		color: #ffc3c3;
+	}
+
+	.static-banner {
+		position: relative;
+	}
+
+	.static-banner .static-banner-underlay {
+		position: fixed;
+		height: 100%;
+		width: 100%;
+		top: 0px;
+	}
+
+	.static-banner .static-banner-underlay img {
+		height: 100%;
+		width: 100%;
+		-o-object-fit: cover;
+		object-fit: cover;
+		-o-object-position: bottom;
+		object-position: bottom;
+	}
+
+	.static-banner .static-banner-overlay {
+		position: fixed;
+		width: 100%;
+		height: 100%;
+		background-color: #0b1419;
+		opacity: 0.8;
+	}
+
+	.profile-header {
+		position: absolute;
+		top: -300px;
+		width: 100%;
+	}
+
+	.top-row {
+		display: flex;
+		flex-direction: row;
+		margin-top: 50px;
+	}
+
+	@media screen and (max-width: 600px) {
+		.top-row {
+			display: flex;
+			flex-direction: column;
+			justify-content: center;
+			align-items: center;
+			margin-top: -10px;
+		}
+	}
+
+	.profile-img-container {
+		flex-basis: 200px;
+		border-radius: 50%;
+		border: 2px solid #F68B1F;
+		overflow: hidden;
+	}
+
+	.profile-img-container img {
+		height: 100%;
+		width: 100%;
+		-o-object-position: top;
+		object-position: top;
+		-o-object-fit: cover;
+		object-fit: cover;
+	}
+
+	@media screen and (max-width: 600px) {
+		.profile-img-container {
+			flex-basis: 100px;
+			width: 100px !important;
+			height: 100px !important;
+			border-radius: 50%;
+			border: 2px solid #F68B1F;
+			overflow: hidden;
+		}
+	}
+
+	.profile-header-text {
+		margin: 20px 0px 0px 50px !important;
+	}
+
+	@media screen and (max-width: 600px) {
+		.profile-header-text {
+			margin: 20px 0px !important;
+		}
+	}
+
+	.profile-header-text h1 {
+		font-size: 40px !important;
+		margin: 5px 0px !important;
+	}
+
+	.profile-header-text h2 {
+		font-size: 20px !important;
+		line-height: 24px !important;
+		color: #fff;
+		letter-spacing: 2px;
+		font-weight: normal;
+		margin: 5px 0px !important;
+	}
+
+	.profile-header-text .contact-dets {
+		display: inline-block;
+		font-size: 12px;
+		margin-top: 15px !important;
+		margin-right: 20px !important;
+		font-weight: lighter;
+		color: #fff;
+		letter-spacing: 2px;
+	}
+
+	.profile-header-text h3 {
+		font-size: 14px !important;
+		text-transform: uppercase;
+		text-decoration: none !important;
+		font-family: "Open Sans", sans-serif;
+		letter-spacing: 2px;
+		text-align: center !important;
+		font-weight: normal;
+		margin: 5px 0px 0px 0px !important;
+		text-align: left !important;
+	}
+
+	@media screen and (max-width: 700px) {
+		.profile-header-text {
+			text-align: center;
+		}
+
+		.profile-header-text h1 {
+			font-size: 20px !important;
+			margin: 5px 0px 0px 0px !important;
+			text-align: center;
+		}
+
+		.profile-header-text h2 {
+			font-size: 14px !important;
+			line-height: 16px !important;
+			color: #fff;
+			letter-spacing: 2px;
+			font-weight: normal;
+			margin: 5px 0px 10px 0px !important;
+			text-align: center;
+		}
+
+		.profile-header-text h3 {
+			font-size: 14px !important;
+			text-transform: uppercase;
+			text-decoration: none !important;
+			font-family: "Open Sans", sans-serif;
+			letter-spacing: 2px;
+			text-align: center !important;
+			font-weight: normal;
+			margin: 5px 0px 0px 0px !important;
+			text-align: center;
+		}
+
+		.profile-header-text .contact-dets {
+			display: block;
+			font-size: 12px;
+			margin-top: 5px !important;
+			font-weight: lighter;
+			color: #fff;
+			letter-spacing: 1px;
+		}
+	}
+
+	.profile-second-row {
+		display: flex;
+		flex-direction: row;
+		justify-content: space-between;
+	}
+
+	.left-col {
+		margin-right: 30px;
+		width: 400px;
+	}
+
+	@media screen and (max-width: 650px) {
+		.left-col {
+			display: none;
+		}
+	}
+
+	ul.profile-choices>li {
+		list-style: none;
+		border-radius: 5px;
+		overflow: hidden;
+		height: 50px;
+	}
+
+	ul.profile-choices>li a {
+		padding: 5px 10px;
+		font-size: 20px;
+		line-height: 40px;
+		font-weight: lighter;
+		color: #fff;
+		display: flex;
+		flex-direction: row;
+		justify-content: space-between;
+		transition-duration: 0.5s;
+		height: 50px !important;
+	}
+
+	ul.profile-choices>li a:after {
+		content: "chevron_right";
+		font-family: "Material Icons";
+		font-size: 20px;
+		margin-right: 10px;
+	}
+
+	ul.profile-choices>li a:hover {
+		color: #000;
+		text-decoration: none;
+		background-color: rgba(255, 255, 255, 0.2039215686);
+	}
+
+	.pickr {
+		display: inline-block;
+		margin-right: 6px !important;
+	}
+
+	.profile-des {
+		font-family: "Open Sans", sans-serif;
+		font-size: 25px;
+		font-weight: normal;
+		margin: 5px 0px;
+		color: #fff;
+	}
+
+	details {
+		margin-left: 0px !important;
+	}
+
+	.accordions {
+		margin-top: 100px;
+	}
+
+	.sub-title {
+		font-family: "Open Sans", sans-serif !important;
+		font-size: 14px;
+		letter-spacing: 5px;
+	}
+
+	b {
+		font-weight: 500 !important;
+		font-size: 22px !important;
+	}
+
+	i {
+		font-size: 14px;
+		margin-bottom: 130px !important;
+		border-bottom: 1px solid #fff;
+	}
+
+	ul {
+		margin-top: 20px !important;
+		margin-bottom: 50px !important;
+	}
+
+	ul>li {
+		list-style: none;
+		font-size: 16px;
+		line-height: 20px;
+	}
+
+	h2.m-text {
+		font-size: 30px;
+		margin-left: 0px;
+		font-weight: normal;
+	}
+
+	.desc-block {
+		opacity: 1;
+		transition-duration: 0.4s;
+		overflow: none;
+	}
+
+	.desc-block-hidden {
+		display: none;
+	}
+
+	.desc-active {
+		text-decoration: none;
+		background-color: rgba(255, 255, 255, 0.2039215686);
+	}
+
+	.desc-active a {
+		color: #000;
+	}
+
+	ul.m-text {
+		margin-top: 10px !important;
+	}
+
+	/* The Overlay (background) */
+	.overlay {
+		/* Height & width depends on how you want to reveal the overlay (see JS below) */
+		height: 0%;
+		width: 100%;
+		position: fixed;
+		/* Stay in place */
+		z-index: 1100;
+		/* Sit on top */
+		left: 0;
+		top: 0;
+		background-color: rgb(0, 0, 0);
+		/* Black fallback color */
+		background-color: rgba(0, 0, 0, 0.9);
+		/* Black w/opacity */
+		overflow-x: hidden;
+		/* Disable horizontal scroll */
+		transition: 0.5s;
+		/* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
+	}
+
+	/* Position the content inside the overlay */
+	.overlay-content {
+
+		position: relative;
+		height: 100%;
+		top: 25%;
+		/* 25% from the top */
+		width: 100%;
+		/* 100% width */
+
+		text-align: center;
+		/* Centered text/links */
+		margin-top: 30px;
+		/* 30px top margin to avoid conflict with the close button on smaller screens */
+	}
+
+	/* The navigation links inside the overlay */
+	.overlay a {
+		padding: 8px;
+		text-decoration: none;
+		font-size: 18px;
+		color: white;
+		display: block;
+		/* Display block instead of inline */
+		transition: 0.3s;
+		/* Transition effects on hover (color) */
+	}
+
+	.overlay h1 {
+		color: white;
+		font-size: 20px;
+		font-weight: lighter;
+		margin-bottom: 10px;
+		text-decoration: underline;
+	}
+
+	/* When you mouse over the navigation links, change their color */
+	.overlay a:hover,
+	.overlay a:focus {
+		color: #f1f1f1;
 
-	</main><!-- #main -->
-</div><!-- .container -->
+	}
 
+	/* Position the close button (top right corner) */
+	.overlay .closebtn {
+		position: absolute;
+		top: 20px;
+		right: 45px;
+		font-size: 60px;
+	}
+</style>
 <?php get_footer(); ?>