index.html

<!DOCTYPE html>

<!--[if (gte IE 9)|!(IE)]><!--><html class="no-js" lang="en"> <!--<![endif]-->
<head>

   <!--- basic page needs
   ================================================== -->
   <meta charset="utf-8">
	<title>ITER ROBOTICS CLUB</title>
	<meta name="description" content="IRC is the Official Robotics of ITER College.">  
	

   <!-- mobile specific metas
   ================================================== -->
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

 	<!-- CSS
   ================================================== -->
   <link rel="stylesheet" href="css/base.css">
   <link rel="stylesheet" href="css/vendor.css">  
   <link rel="stylesheet" href="css/main.css">  
   <link rel="stylesheet" href="hi.scss">

   <!-- script
   ================================================== -->
   <script src="js/modernizr.js"></script>
   <script src="js/pace.min.js"></script>

   <!-- favicons
	================================================== -->
	<link rel="shortcut icon" href="logo.webp" type="image/x-icon">
	<link rel="icon" href="images/logo.webp" type="image/x-icon">

</head>


<body id="top">

	<!-- header 
   ================================================== -->
   <header> 

   	<div class="header-logo">
	      <a href="index.html">ITER ROBOTICS CLUB</a>
	   </div> 

		<a id="header-menu-trigger" href="#0">
		 	<span class="header-menu-text">Menu</span>
		  	<span class="header-menu-icon"></span>
		</a> 

		<nav id="menu-nav-wrap">

			<a href="#0" class="close-button" title="close"><span>Close</span></a>	

	   	<h3>ITER ROBOTICS CLUB.</h3>  

			<ul class="nav-list">
				<li class="current"><a class="smoothscroll" href="#home" title="">Home</a></li>
				<li><a class="smoothscroll" href="#about" title="">About</a></li>
				<li><a class="smoothscroll" href="#services" title="">What we do?</a></li>
				<li><a class="smoothscroll" href="#events" title="">Events</a></li>
				<li><a class="smoothscroll" href="#contact" title="">Contact</a></li>						
			</ul>			

			<ul class="header-social-list">

	         <li>
	         	<a href="https://www.instagram.com/iter_robotics_club/"><i class="fa fa-instagram"></i></a>
	         </li>
           
	             
	      </ul>		

		</nav>  <!-- end #menu-nav-wrap -->

	</header> <!-- end header -->  


   <!-- home
   ================================================== -->
   <section id="home">

   	<div class="overlay"></div>

   	<div class="home-content-table">	
		   		<div class="home-content-tablecell">
		   			<div class="row">
		   				<div class="col-twelve">		   			
				  			<h1 class="animate-intro">
								ITER ROBOTICS CLUB
							<h3 class="animate-intro">Innovating+Simulating+Fabricating+Coding = ROBOTizing</h3>
							  </h1>	
							  
							  <div class="more animate-intro">
								<a style="cursor: pointer; z-index: 999;" href="https://iterroboticsclub.github.io/register" target="_blank" >
								  <button class="button stroke" >
										JOIN IRC
								  </button>
								</a>
								
							</div>

			  			</div> <!-- end col-twelve --> 
		   			</div> <!-- end row --> 
		   		</div> <!-- end home-content-tablecell --> 		   
		</div> <!-- end home-content-table -->

		<ul class="home-social-list">

	      
	      <li class="animate-intro">
	        	<a href="https://www.instagram.com/iter_robotics_club/"><i class="fa fa-instagram"></i></a>
	      </li>

	      
	   </ul> <!-- end home-social-list -->	

		<div class="scrolldown">
			<a href="#about" class="scroll-icon smoothscroll">		
		   	E X P L O R E 		   	
		   	<i class="fa fa-long-arrow-right" aria-hidden="true"></i>
			</a>
		</div>			
   
   </section> <!-- end home -->


   <!-- about
   ================================================== -->
   <section id="about">

   	<div class="row about-wrap">
   		<div class="col-full">

   			<div class="about-profile-bg"></div>

				<div class="intro">
					<h3 class="animate-this">About IRC</h3>
				   <p class="lead animate-this"><span>ITER ROBOTICS CLUB</span> is the Official Robotics Club of ITER. 
					<br> 
					The need for a 'technical' club which could incorporate the principles of all the engineering branches was felt by some of the dynamic students of college, as a result of which the ITER ROBOTICS CLUB was initiated in the year 2007.
				</p>	
				</div>   
				<!-- <div class="more animate-intro">
					<a class="smoothscroll button stroke" href="/about.html">
						KNOW MORE ABOUT US!
					</a>
				</div> -->

   		</div> <!-- end col-full  -->
   	</div> <!-- end about-wrap  -->

   </section> <!-- end about -->


   <!-- about
   ================================================== -->

   <section id="services">

   	<div class="overlay"></div>
   	<div class="gradient-overlay"></div>
   	
   	<div class="row narrow section-intro with-bottom-sep animate-this">
   		<div class="col-full">
   			
   				
   			   <h1>WHAT WE DO?</h1>
   			
   			   <p class="lead">
				</p>
   			
   	   </div> <!-- end col-full -->
   	</div> <!-- end row -->
	   	
   	<div class="row services-content">

   		<div class="services-list block-1-2 block-tab-full group">

	      	<div class="bgrid service-item animate-this">	

				<span ><img src="https://img.icons8.com/ios-filled/50/E67E22/broken-robot.png"/></span>
	            <div class="service-content">
	            	<h3 class="h05">Robotics</h3>

		            <p></p>	         		
	         	</div> 	         	 

				</div> <!-- end bgrid -->

				<div class="bgrid service-item animate-this">	

					<span><img src="https://img.icons8.com/ios-filled/50/E67E22/laptop-coding.png"/></span>                          

	            <div class="service-content">	
	            	<h3 class="h05">Automation</h3>  

		            <p></p>	         		
	            </div>	                          

			   </div> <!-- end bgrid -->

			   <div class="bgrid service-item animate-this">

			   	<span><img src="https://img.icons8.com/ios-filled/50/E67E22/globe.png"/></span>		            

	            <div class="service-content">
	            	<h3 class="h05">Coding & Development</h3>

		            <p></p>
	            </div> 	            	               

			   </div> <!-- end bgrid -->

				<div class="bgrid service-item animate-this">

					<span><img src="https://img.icons8.com/ios-filled/50/E67E22/internet-of-things.png"/></span>	              

	            <div class="service-content">
	            	<h3 class="h05">Internet of Things</h3>

		            <p></p>	         		
	            </div>                

				</div> 			   

	      </div> 
   		
   	</div>   			

   </section> 
<!-- gallery
   ================================================== -->
<!-- <section id="gallery">
	<div class="title"><h1>The Projects we have worked on!</h1></div>
   <div class="wrapper-gallery">
	<a class="tile" href="" target="_blank" style="background: #FFD01A;">
	  <h1>NAME OF PROJECT</h1>
	  
	</a>
	<a class="tile" href="" target="_blank" class="tile" style="background: #776BFF;">
	  <h1>NAME OF PROJECT</h1>
	  
	</a>
	<a href="" target="_blank" class="tile" style="background: #FFA600;">
	  <h1>NAME OF PROJECT</h1>
	  
	</a>
	<a href="" target="_blank" class="tile" style="background: #FA4E89;">
	  <h1>NAME OF PROJECT</h1>
	  
	</a>
	<a href="" target="_blank" class="tile" style="background: #FF87FF;">
	  <h1>NAME OF PROJECT</h1>
	  
	</a>
	<a href="" target="_blank" class="tile" style="background-color: #00E0A7">
	  <h1>NAME OF PROJECT</h1>
	</a>
	
  </div>
</section> -->


	<!-- events
   ================================================== -->
   <section id="events">

	<div class="row animate-this">
		<h1>Events</h1>
		<div class="col-twelve">
				  <a href="./register.html"><img src="./images/events/ircwworkshop.png" alt="" style="width: 500px;"></a>
				  
			</div> 
			
		</div> <!-- end col-twelve -->
	</div> <!-- end row -->

</section> <!-- end clients -->

   <!-- What Alumini Says
   ================================================== -->
   <!-- <section id="testimonials">

   	<div class="row">
   		<div class="col-twelve">
   			<h2 class="animate-this">What Our Alumini Say About Us.</h2>
   		</div>   		
   	</div>   	

      <div class="row flex-container">
    
         <div id="testimonial-slider" class="flex-slider animate-this">

            <ul class="slides">

               <li>
                  <p>
                  (TEXT)
                  </p> 

                  <div class="testimonial-author">
                    	<img src="images/avatars/user-02.jpg" alt="Author image">
                    	<div class="author-info">
                    		Name
                    		<span class="position">Passout year</span>
                    	</div>
                  </div>                 
             	</li> <

               <li>
                  <p>
                  (TEXT)   
                  </p>

               	<div class="testimonial-author">
                    	<img src="images/avatars/user-03.jpg" alt="Author image">
                    	<div class="author-info">
                    		Name
                    		<span>Passout year.</span>
                    	</div>
                  </div>                                         
               </li> 

            </ul> 

         </div>         
        
      </div> 

   </section>  -->


    <!-- gallery
   ================================================== -->
   <!-- <section id="project">
   	
	<div class="intro-wrap">

		<div class="row narrow section-intro with-bottom-sep animate-this">
			<div class="col-twelve">
				<h3>Showcase</h3>
				<h1>Have a peek into our memories.</h1>  		
			</div>   		
		</div> 		

	</div>   	

	<div class="row project-content">
		<div class="col-twelve">
			<div id="folio-wrap" class="bricks-wrapper">					

				<div class="brick folio-item">
				<div class="item-wrap animate-this" data-src="images/project/project.png" data-sub-html="#01" > 	
				   <a href="#" class="overlay">
					   <img src="images/project/project.png" alt="(PROJECT NAME)">	                     
					  <div class="item-text">
						  <span class="folio-types">
									PROJECT CATEGORY.
								 </span>
								 <h3 class="folio-title">(PROJECT NAME)</h3>	     					   
							  </div>                                        
				   </a>
				   <a href="(PROJECT SITE)" class='details-link' title="details">
					 <img src="https://img.icons8.com/pastel-glyph/50/E67E22/search--v2.png"/>
				   </a>
				</div> 
					 
					 <div id="01" class='hide'>
						 <h4>(PROJECT NAME)</h4>
						 <p>(TEXT) <a href="(PROJECT SITE)">Details</a></p>
					 </div>
				 </div> 

				 <div class="brick folio-item">
				<div class="item-wrap animate-this" data-src="images/project/project.png" data-sub-html="#02"> 	
				   <a href="#" class="overlay">
					   <img src="images/project/project.png" alt="(PROJECT NAME)">	                     
					  <div class="item-text">
						  <span class="folio-types">
							 PROJECT CATEGORY
								 </span>
								 <h3 class="folio-title">(PROJECT NAME)</h3>  	     					   
							  </div>                                        
				   </a>
				   <a href="(PROJECT SITE)" class='details-link' title="details">
					 <img src="https://img.icons8.com/pastel-glyph/50/E67E22/search--v2.png"/>
				   </a>
				</div> 

				<div id="02" class='hide'>
						 <h4>(PROJECT NAME)</h4>
						 <p>(TEXT) <a href="(PROJECT SITE)">Details</a></p>
					 </div>	               
				 </div> 

				 <div class="brick folio-item">
				<div class="item-wrap animate-this" data-src="images/project/project.png" data-sub-html="#03" >   	
				   <a href="#" class="overlay">
					   <img src="images/project/project.png" alt="(PROJECT NAME)">	                     
					  <div class="item-text">	                     		     					    
								 <span class="folio-types">
								 PROJECT CATEGORY
								 </span>
								 <h3 class="folio-title">(PROJECT NAME)</h3>
							  </div>                                        
				   </a>
				   <a href="(PROJECT SITE)" class='details-link' title="details">
					 <img src="https://img.icons8.com/pastel-glyph/50/E67E22/search--v2.png"/>
				   </a>
				</div> 

				<div id="03" class='hide'>
						 <h4>(PROJECT NAME)</h4>
						 <p>(TEXT) <a href="(PROJECT SITE)">Details</a></p>
					 </div>               
				 </div> 

				 <div class="brick folio-item">
				<div class="item-wrap animate-this"  data-src="images/project/project.png"  data-sub-html="#04" >
				   <a href="#" class="overlay">
					   <img src="images/project/project.png" alt="(PROJECT NAME)">	                     
					  <div class="item-text">	     					    
								 <span class="folio-types">
								 PROJECT CATEGORY
								 </span>
								 <h3 class="folio-title">(PROJECT NAME)</h3>
							  </div>                                        
				   </a>
				   <a href="(PROJECT SITE)" class='details-link' title="details">
					 <img src="https://img.icons8.com/pastel-glyph/50/E67E22/search--v2.png"/>
				   </a>
				</div> 

				<div id="04" class='hide'>
						 <h4>(PROJECT NAME)</h4>
						 <p>(TEXT) <a href="(PROJECT SITE)">Details</a></p>
					 </div>  	               
				 </div> 

				 <div class="brick folio-item">
				<div class="item-wrap animate-this"  data-src="images/project/project.png"  data-sub-html="#05" >  	
				   <a href="#" class="overlay">
					   <img src="images/project/project.png" alt="(PROJECT NAME)">	                     
					  <div class="item-text">	     					    
								 <span class="folio-types">
								 PROJECT CATEGORY
								 </span>
								 <h3 class="folio-title">(PROJECT NAME)</h3>
							  </div>                                        
				   </a>
				   <a href="(PROJECT SITE)" class='details-link' title="details">
					 <img src="https://img.icons8.com/pastel-glyph/50/E67E22/search--v2.png"/>
				   </a>
				</div> 

				<div id="05" class='hide'>
						 <h4>(PROJECT NAME)</h4>
						 <p>(TEXT) <a href="(PROJECT SITE)">Details</a></p>
					 </div>	               
				 </div> 
			
				 <div class="brick folio-item">
				<div class="item-wrap animate-this"  data-src="images/project/project.png"  data-sub-html="#06">     	
				   <a href="#" class="overlay">
					   <img src="images/project/project.png" alt="(PROJECT NAME)">	                     
					  <div class="item-text">	     					    
								 <span class="folio-types">
								 PROJECT CATEGORY
								 </span>
								 <h3 class="folio-title">(PROJECT NAME)</h3>
							  </div>                                        
				   </a>
				   <a href="(PROJECT SITE)" class='details-link' title="details">
					 <img src="https://img.icons8.com/pastel-glyph/50/E67E22/search--v2.png"/>
				   </a>
				</div> 

				<div id="06" class='hide'>
						 <h4>(PROJECT NAME)</h4>
						 <p>(TEXT) <a href="(PROJECT SITE)">Details</a></p>
					 </div>	               
				 </div>   				

			</div> 
		</div> 
	</div> 	

</section>   -->





	<!-- contact
   ================================================== -->
   <section id="contact">

      <div class="overlay"></div>

		<div class="row narrow section-intro with-bottom-sep animate-this">
   		<div class="col-twelve">
   			<h3>Contact</h3>
   			<h1>Get In Touch.</h1>

   			<p class="lead">...</p>
   		</div> 
   	</div> <!-- end section-intro -->

   	<div class="row contact-content">

   		<div class="col-seven tab-full animate-this">

			<h5>Contact Information</h5>

			<div class="cinfo">
				  <h6>Where to Find Us</h6>
				  <p>
				   E-459, E-Block<br>
				   ITER, Bhubaneswar<br>
				   3PM to 6PM<br>
				   
			   </p>
			  </div> <!-- end cinfo -->

			  <div class="cinfo">
				  <h6>Email Us At</h6>
				  <p>
					  irciter@gmail.com	     
				  </p>
			  </div>

         </div> <!-- end col-seven --> 

         <div class="col-four tab-full contact-info end animate-this">

         	<h5>Map</h5>
			 <iframe src="https://www.google.com/maps/embed?pb=!1m14!1m12!1m3!1d367.82084430861596!2d85.80105918682234!3d20.247839569656417!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!5e0!3m2!1sen!2sin!4v1652542632866!5m2!1sen!2sin" width="350" height="250" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
         	 <!-- end cinfo -->

	   		<!-- <div class="cinfo">
	   			<h6>Call Us At</h6>
	   			<p>
	   				Phone:XXXXXXXXXX <br>
				   	
				   </p>
	   		</div> -->

         </div> <!-- end cinfo --> 

   	</div> <!-- end row contact-content -->
		
	</section> <!-- end contact -->


	

   	<div class="footer-bottom">

      	<div class="row">

      		<div class="col-twelve">
	      		<div class="copyright" style="color: white; margin-bottom:10px;">
		         	<span>© ITER Robotics Club</span> 
		         	<span>Design by Saswat Samal</a></span>		         	
		         </div>		               
	      	</div>

      	</div>   	

      </div> <!-- end footer-bottom -->

      <div id="go-top">
		   <a class="smoothscroll" title="Back to Top" href="#top">
		   	<i class="fa fa-long-arrow-up" aria-hidden="true"></i>
		   </a>
		</div>		
   </footer>

   <div id="preloader"> 
    	<div id="loader"></div>
   </div> 

   <!-- Java Script
   ================================================== --> 
   <script src="js/jquery-2.1.3.min.js"></script>
   <script src="js/plugins.js"></script>
   <script src="js/main.js"></script>

</body>

</html>