index.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>University Website Design</title>
    <link rel="stylesheet" href="CSS/style.css">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link rel="stylesheet" href="style.css">
    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
</head>

<!-- Navigation bar -->

<body>
    
    <div class="head">
        <div class="headimage1" style=" z-index: 2;">
            <img src="images/Indian_Institute_of_Information_Technology_Vadodara_Logo.svg.png" height="200px" >
            
        </div>
        <!-- <img src="images/Indian_Institute_of_Information_Technology_Vadodara_Logo.svg.png" id="headimage"> -->
        <div style="text-align: center ;  background-color: #b6e1ff;  "><h1 >Indian Institute of Information Technology Vadodara</h1></div>
      <div style="text-align: center; background-color: #b6e1ff; ">  <h1 >
            भारतीय सूचना प्रौद्योगिकी संस्‍‍थान वडोदरा</h1></div>

    </div>
    <div class="uppernav">
        <div class="unside">
            <!-- <img src="" height="160px" width="190">/ -->

        </div>
        <div class="un">
        <a href="http://diu.iiitvadodara.ac.in/" id="un1">Diu Campus</a> 
            <a href="#" id="un1">Convocation 2024</a>
                <a href="https://iiitvadodara.ac.in/placement.php" id="un1">Placements</a>
               <a href="pages content/website/faculty.html" id="un1">Faculty</a></div>
    </div>

    <nav>
        <input type="checkbox" id="sidebar-active">
        <label for="sidebar-active" class="open-sidebar-button">
          <svg xmlns="http://www.w3.org/2000/svg" height="32" viewBox="0 -960 960 960" width="32"><path d="M120-240v-80h720v80H120Zm0-200v-80h720v80H120Zm0-200v-80h720v80H120Z"/></svg>
        </label>
        <label id="overlay" for="sidebar-active"></label>
        <div class="links-container " style="width: 100vw;">
          <label for="sidebar-active" class="close-sidebar-button">
            <svg xmlns="http://www.w3.org/2000/svg" height="32" viewBox="0 -960 960 960" width="32"><path d="m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z"/></svg>
          </label>
    
          <!-- NOT IN TUTORIAL: The <a> tags are linked to the subpages -->
            <a class="home-link">
                <!-- <img src="https://wallpapers.com/images/hd/white-screen-background-sw1bnff9381f1zrq.jpg" alt="IIIT-Vadodara Logo" >  -->
               
            </a> 
           
            <div class="dropdown">
                <button class="dropdown-btn">About▼</button>
                <div class="dropdown-content">
                    <a href="pages content/website/instittute.html">Institute</a>
                    <a href="pages content/website/visionandmisson.html">Vision & Mission</a>
                    <a href="#option3">Director</a>
                    <a href="#option3">Act, Statutes, and Ordinance</a>
                    <a href="#option3">Director</a>
                    <a href="#option3">Statement & Reports 
                    </a>
                    <a href="#option3">Annual Reports
                    </a>
                    <a href="#option3">Dumad Campus Master Plan
                    </a>

                    <a href="#option3">FAQ</a>
                    <a href="#option3">Policies
                    </a>

                </div>
            </div>
            <div class="dropdown">
                <button class="dropdown-btn">Academics▼</button>
                <div class="dropdown-content">
                    <a href="pages content/website/ug.html">Programs</a>
                    <a href="#option2">list of holidays</a>
                    <a href="#option3">Academic ordiance </a>
                    <a href="#option3">Academic calender </a>
                </div>
            </div><div class="dropdown">
                <button class="dropdown-btn">Admission▼</button>
                <div class="dropdown-content">
                    <a href="#option1">M-tech</a>
                    <a href="pages content\website\btech.html">B-tech</a>
                    <a href="#option3">PhD</a>
                    <a href="#option3">NRI-admission</a>
                   
                </div>
            </div><div class="dropdown">
                <button class="dropdown-btn">Research▼</button>
                <div class="dropdown-content">
                    <a href="#option1">publication</a>
                    <a href="#option2">research lab</a>
                    <a href="pages content/website/reserach.html">sponsored project</a>
                </div>
            </div><div class="dropdown">
                <button class="dropdown-btn">People▼</button>
                <div class="dropdown-content">
                    <a href="pages content/website/faculty.html">faculty</a>
                    <a href="#option2">visiting faculty</a>
                    <a href="#option3">former faculty</a>
                    <a href="#option3">staff</a>
                </div>
            </div>
            <div class="dropdown">
                <button class="dropdown-btn">StudentCorner▼</button>
                <div class="dropdown-content">
                    <a href="#option1">placement </a>
                    <a href="#option2">library</a>
                    <a href="#option3">gymkhana</a>
                </div>
            </div><div class="dropdown">
                <button class="dropdown-btn">Job▼</button>
                <div class="dropdown-content">
                    <a href="pages content/website/facultypos.html">faculty position</a>
                    <a href="#option2">officer position</a>
                    <a href="#option3">staff position</a>
                </div>
            </div><div class="dropdown">
                <button class="dropdown-btn">Tenders▼</button>
                <div class="dropdown-content">
                    <a href="#option1">Tenders</a>
                    <a href="#option2">GSTPAN</a>
                    
                </div>
            </div>
           
      
        </div>
      </nav>
      <script>
        function showSidebar(){
          const sidebar = document.querySelector('.sidebar')
          sidebar.style.display = 'flex'
        }
        function hideSidebar(){
          const sidebar = document.querySelector('.sidebar')
          sidebar.style.display = 'none'
        }
      </script>


      <div>
        <section class="text-box">
            <video   autoplay loop muted id="video">
                <source src="images/iiit2.mp4" type="video/mp4">
               
            </video>
           
        </section>
        </div>
 
   
    <!-- Course -->
    <section class="course">
        <div>
            
            <h1 id="k">Announcements</h1>
            <p id="kpara">IIIT-Vadodara</p>
            <div class="scroller-container">
                <div class="scroll-content">
                    <p style="color: #000000 ;">
                        ☆ IIITV's Annual Tech Fest "Cerebro 2024-25", Date: 11-17 Nov. 2024:
                        
                       
                    </p>
                    <p style="color: #000000 ;">
                        ☆ IIITV (Intra) Web Hackathon, Date:4-24 Nov. 2024
                    </p>
                    <p style="color: #000000 ;">
                        ☆ Vigilance Awareness Week 2024 Time: Oct 28- Nov 3, 2024
                    </p>    
                    <p style="color: #000000 ;">
                        Tender enquiry for 'Hiring of Commercial Vehicle of one no. SUV Innova Crysta on monthly hire basis for a period of two years which can be extended by one more year on same terms and conditions"
                    </p>
                    <p style="color: #000000;">
                        
Admissions to PhD (Full Time/ Part Time) programme, Winter 2024-25"

	
                    </p>
                    <p style="color: #000000;">"Anti-Ragging Compliance"

                    </p>
                    <p style="color: #000000;">NRI Admissions B. Tech (CSE) Program: Last date of receipt application (15 Sept 2024)

                    </p>
                    <p style="color: #000000;">One Day Workshop on Harnessing Artificial Intelligence for Academic Administration sponsored by Department of Technical Education - 5th October, 2024."</p>
                </div>
            </div>
        </div>
        <div id ="viewall"><a href="https://iiitvadodara.ac.in/announcements.php" >view all</a></div>
        
        
    </section>

    <!-- Campus -->
    <section class="campus">
        <h1></h1>
        <p>IIIT-Vadodara</p>

        <div class="row">
            <div class="container-an">
                <!-- Events Section -->
                <div class="section-container-an">
                    <div class="section-header">Events</div>
                    <div class="section-content">
                        <div class="item">
                            <div class="date">
                                <div class="day">11 TO 17</div>
                                <div class="month">NOV</div>
                                <div class="year">2024</div>
                            </div>
                            <div class="details">
                                <div class="title">IIITV's Annual Tech Fest "Cerebro 2024-25"</div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="date">
                                <div class="day">4 TO 24</div>
                                <div class="month">NOV</div>
                                <div class="year">2024</div>
                            </div>
                            <div class="details">
                                <div class="title">IIITV (Intra) Web Hackathon</div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="date">
                                <div class="day">31</div>
                                <div class="month">OCT</div>
                                <div class="year">2024</div>
                            </div>
                            <div class="details">
                                <div class="title">Ph.D. Admissions (Full-Time / Part-Time)</div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="date">
                                <div class="day">JULY</div>
                                <div class="month">AUGUST</div>
                                <div class="year">2024</div>
                            </div>
                            <div class="details">
                                <div class="title">B.Tech 2024-25 Reporting Process</div>
                            </div>
                        </div>
                        <div class="view-more">
                            <a href="#">View more</a>
                        </div>
                    </div>
                </div>
        
                <!-- News Section -->
                <div class="section-container-an">
                    <div class="section-header">News</div>
                    <div class="section-content">
                        <div class="item">
                            <div class="date">
                                <div class="day">24</div>
                                <div class="month">AUGUST</div>
                                <div class="year">2024</div>
                            </div>
                            <div class="details">
                                <div class="title">8th Prof. Vijaya Agarwala Memorial National Workshop</div>
                                <div class="description">On Microwave Absorbing Materials (VAMMAM - 2024).</div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="date">
                                <div class="day">29</div>
                                <div class="month">JUNE</div>
                                <div class="year">2024</div>
                            </div>
                            <div class="details">
                                <div class="title">Tree Plantation at IIIT Vadodara Permanent Campus</div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="date">
                                <div class="day">5</div>
                                <div class="month">FEB</div>
                                <div class="year">2023</div>
                            </div>
                            <div class="details">
                                <div class="title">IIITV Team (BTech 2021 Batch)</div>
                                <div class="description">Sanidhya Kumar, Abhay Upadhyay, Samanway Maji, Riya...</div>
                            </div>
                        </div>
                        <div class="item">
                            <div class="date">
                                <div class="day">*</div>
                                <div class="month">*</div>
                                <div class="year">2022</div>
                            </div>
                            <div class="details">
                                <div class="title">IIITV's team HACKpackers</div>
                                <div class="description">Mugdha Sharma, Madhur Gupta, Kalash Shah...</div>
                            </div>
                        </div>
                        <div class="view-more">
                            <a href="#">View more</a>
                        </div>
                    </div>
                </div>
            </div>
    
            <div class="campus-col">
                <img src="images/PM-MODI-YOJANA.avif" alt="Campus Image">
                <div class="layer">
                    <h3>OUR GOVERNMENT</h3>
                </div>
            </div>
        </div>
    </section>

    <!-- ------Facilities--------- -->
    <section class="facilities">
        <h1>Our Clubs</h1>
        <p>IIIT-Vadodara</p>

        <div class="row">
            <div class="facilities-col">
                <img src="images/cerebro_event.jpg" alt="Library image">
                <h3>TECHNICAL CLUB</h3>
                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laborum doloremque distinctio est?</p>
            </div>
            <div class="facilities-col">
                <img src="images/kreiva.png" alt="Play ground image">
                <h3>CULTURAL CLUB</h3>
                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laborum doloremque distinctio est?</p>
            </div>
            <div class="facilities-col">
                <img src="images/sports.png" alt="Cafeteria image">
                <h3>SPORTS CLUB</h3>
                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laborum doloremque distinctio est?</p>
            </div>
        </div>
    </section>

    <!-- ----Testimonials---- -->
    <section class="testimonials">
        <div class="tld">
            <img src="images/Indian_Institute_of_Information_Technology_Vadodara_Logo.svg.png" id="lastlogo" alt=" logo.png">
        <div class="lastpara">
            <p>C/O Block No. 9
                Government Engineering College
                Sector-28, Gandhinagar
                Gujarat - 382028
                Email: administration@iiitvadodara.ac.in
                Phone: +91-79-29750281
                                 +91- 8849303883</p>
            
        </div>
        </div>
        <div class="tl" >
            <h1>Important Links</h1>

        <div>
            <a href="#" class="ab">
                <img src="images/rb_5843.png" height="60px" id="linkimg" alt="">
                Tender
            </a>
            <a href="#" class="ab">
                <img src="images/rb_5843.png" height="60px" id="linkimg" alt="">
               RTI
            </a>
            <a href="#" class="ab">
                <img src="images/rb_5843.png" height="60px" id="linkimg" alt="">
                Vigilance
            </a>
            <a href="#" class="ab">
                <img src="images/rb_5843.png" height="60px" id="linkimg" alt="">
                Placement
            </a>
            <a href="#" class="ab">
                <img src="images/rb_5843.png" height="60px" id="linkimg" alt="">
                Hostel
            </a>
            <a href="#" class="ab">
                <img src="images/rb_5843.png" height="60px" id="linkimg" alt="">
               Gallery
            </a>
            <a href="#"  class="ab">
                <img src="images/rb_5843.png" height="60px" id="linkimg" alt="">
              FAQs
            </a>
            
        </div>
        </div>
        <div class="tlb">
            <h1>Useful Academic Links</h1>
        <div>
            <a href="#"  class="ab">
                <img src="images/rb_5843.png" height="60px" id="linkimg" alt="">
                SWAYAM
            </a>
            <a href="#" class="ab">
                <img src="images/rb_5843.png" height="60px" id="linkimg" alt="">
                SWAYAM Prabha
            </a>
            <a href="#" class="ab">
                <img src="images/rb_5843.png" height="60px" id="linkimg" alt="">
                e-Yantra
            </a>
            <a href="#" class="ab">
                <img src="images/rb_5843.png" height="60px" id="linkimg" alt="">
                Virtual Labs
            </a>
            <a href="#" class="ab">
                <img src="images/rb_5843.png" height="60px" id="linkimg" alt="">
                FOSSEE
            </a>
            <a href="#" class="ab">
                <img src="images/rb_5843.png" height="60px" id="linkimg" alt="">
                Spoken Tutorial
            </a>
            <a href="#" class="ab">
                <img src="images/rb_5843.png" height="60px" id="linkimg" alt="">
               NDLI|e-SS
            </a>
            <a href="#" class="ab">
                <img src="images/rb_5843.png" height="60px" id="linkimg" alt="">
              PDS|IRNS
            </a>

        </div>
        </div>
        <div class="tlc">
            <h1>E-Resources</h1>
            <a href="#" class="ab">
                <img src="images/rb_5843.png" height="60px" id="linkimg" alt="">
                Moodle
            </a>
            <a href="#" class="ab">
                <img src="images/rb_5843.png" height="60px" id="linkimg" alt="">
                NPTEL@IIITV
            </a>
            <a href="#" class="ab">
                <img src="images/rb_5843.png" height="60px" id="linkimg" alt="">
                Matlab Online
            </a>
            <a href="#" class="ab">
                <img src="images/rb_5843.png" height="60px" id="linkimg" alt="">
                Library Catalogue OPAC
            </a>
            <a href="#" class="ab">
                <img src="images/rb_5843.png" height="60px" id="linkimg" alt="">
               Shodhganaga|NDL
            </a>
            <a href="#"  class="ab">
                <img src="images/rb_5843.png" height="60px" id="linkimg" alt="">
                World eBook Library
                
            </a>
            <a href="#"  class="ab">
                <img src="images/rb_5843.png" height="60px" id="linkimg" alt="">
            Open Access Journals
            </a>
            <a href="#"  class="ab">
                <img src="images/rb_5843.png" height="60px" id="linkimg" alt="">
              Paramshavak
            </a>

        <div>
            
           
        </div>
        </div>
       
       
    </section>

    <!-- ----Call To Action---- -->

   
    <!-- ---Footer--- -->
    <section class="footer">
        
        <p>
            © Copyright 2024Indian Institute of Information Technology Vadodara - All Rights Reserved</p>
        <div class="icons">
            <a href="" target="_blank"><i class="fa fa-facebook"></i></a>
            <a href=""target=_blank><i class="fa fa-twitter"></i></a>
            <a href=""target=_blank><i class="fa fa-instagram"></i></a>
            <a href=""target=_blank><i class="fa fa-linkedin"></i></a>
        </div>
        <p>The contents in the website are for information purpose only. IIIT Vadodara regularly monitors and updates the information on this website. We attempt to ensure that the information on this website is correct, however, we do not warrant its completeness or accuracy. No rights can be derived from the information contained in the IIIT Vadodara website. The website may contain links to websites of third party organizations. IIIT Vadodara cannot be held responsible for any consequences arising from the use of information obtained from these websites.</p>
    </section>
    
</body>

</html>