index.html

<!DOCTYPE HTML>


<html>
	<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>Coppell Coders</title>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="description" content="Coppell Coders: Coppell App Development Club" />
	<meta name="author" content="Coppell App Development Club" />

  	<!-- Facebook and Twitter integration -->
	<meta property="og:title" content=""/>
	<meta property="og:image" content=""/>
	<meta property="og:url" content=""/>
	<meta property="og:site_name" content=""/>
	<meta property="og:description" content=""/>
	<meta name="twitter:title" content="" />
	<meta name="twitter:image" content="" />
	<meta name="twitter:url" content="" />
	<meta name="twitter:card" content="" />

	<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,700" rel="stylesheet">
	
	<!-- Animate.css -->
	<link rel="stylesheet" href="css/animate.css">
	<!-- Icomoon Icon Fonts-->
	<link rel="stylesheet" href="css/icomoon.css">
	<!-- Themify Icons-->
	<link rel="stylesheet" href="css/themify-icons.css">
	<!-- Bootstrap  -->
	<link rel="stylesheet" href="css/bootstrap.css">

	<!-- Magnific Popup -->
	<link rel="stylesheet" href="css/magnific-popup.css">

	<!-- Owl Carousel  -->
	<link rel="stylesheet" href="css/owl.carousel.min.css">
	<link rel="stylesheet" href="css/owl.theme.default.min.css">

	<!-- Theme style  -->
	<link rel="stylesheet" href="css/style.css">

	<!-- Modernizr JS -->
	<script src="js/modernizr-2.6.2.min.js"></script>
	<!-- FOR IE9 below -->
	<!--[if lt IE 9]>
	<script src="js/respond.min.js"></script>
	<![endif]-->

	</head>
	<body>
		
	<div class="gtco-loader"></div>
	
	<div id="page">

	
	<div class="page-inner">


	<header id="gtco-header" class="gtco-cover gtco-cover-md" role="banner" style="background-image: url(images/img_bg_4.jpg)" data-stellar-background-ratio="0.5">
		<div class="overlay"></div>
		<div class="gtco-container">
			<div class="row row-mt-15em">
				<div class="col-md-12 mt-text text-center animate-box" data-animate-effect="fadeInUp">
					<h1><strong>Coppell Coders</strong></h1>	
					<h2>Students using software to change the world</h2>
					<a href="https://discord.gg/KnkabEk">Join the Discord</a>

				</div>
			</div>
		</div>
	</header>

	<div class="flex-section gtco-gray-bg">
		<div class="col-1">
			<div class="text">

				<div class="row row-pb-sm">
					<div class="col-md-20">
					<h2>About Us</h2>
					
					<p style = "font-family:verdana;"> All meetings are held at Coppell High School and take place at 4:10 - 5:00 every Tuesday in room E102.</p>
					<p style = "font-family:verdana;"> The App Development Club offers young learners from 9th - 12th grade the opportunity to advance skills in:</p>
					</div>
				</div>
				<div class="row">
					<div class="col-md-6">
						<ul class="check-li">
							<li>Planning</li>
							<li>Collaboration</li>
							<li>Management</li>
						</ul>
					</div>
					<div class="col-md-6">
						<ul class="check-li">
							<li>Software programming</li>
							<li>Interface development</li>
							
						</ul>
					</div>
				</div>
			</div>
		</div>
		<div class="col-2 flex-img" style="background-image: url(images/img_2.jpg);"></div>
	</div>
	
	
	<div class="flex-section gtco-gray-bg reverse">
		<div class="col-1">
			<div class="text">

				<div class="row row-pb-sm">
					<div class="col-md-20">
						<h2>Officers</h2>
						<p style = "font-family:;"><font color = "#f04747" size = "+1">       President | Darshan Bhatta </font></br> 
						<font color = "#b16fd5" size = "+1"> Vice President | Sean Tran </font> </br>
						<font color = "#4c8ddc" size = "+1"> Secretary | Ajay Amit </font></br>
						<font color = "#f1c40f" size = "+1"> Director | BP Rimal</font></br>
						<font color = "#69db93" size = "+1"> Project Coordinator | Harsha Jagannathan</font></p>
						
						<h2>Members</h2>
						<p style = "font-family:verdana;"> <font color = "#36393f" size = "+1"> Ethan Duong <br /> 
						Ragib Arnab <br />
						Rohith Karkala<br />
						Sugandaraj Adhikari<br />
						Suhas Sompalli<br />
						Aadarsh Srivatsav<br />
						Saksham Sangraula<br />
						Samriddhi Sangraula<br />
						Hayeon Lee<br />
						Kokil Kounder<br />
						Chaitanya Eranki<br />
						Hemanth Anantha<br />
						Pranav Kommaraju<br />
						Vamsi Immanneni</font></p>
						</div>
				</div>
			
				
			</div>
		</div>
		<div class="col-2 flex-img" style="background-image: url(images/img_2.jpg);"></div>
	</div>


	<div class="overflow-hid"> 
		<div class="gtco-section gtco-gray-bg">
			<div class="gtco-container">
				<div class="row">
					<div class="col-md-8 col-md-offset-2 text-center gtco-heading">
						<h2><strong>Applications</strong></h2>
						<p>Android apps created at the club</p>
					</div>
				</div>
				<div class="row">

					<div class="col-lg-4 col-md-4 col-sm-6">
						<a href="https://play.google.com/store/apps/details?id=com.darshan.ageguesser" target = "_blank" class="gtco-card-item">
							<figure>
								<div class="overlay"><i class="ti-plus"></i></div>
								<center>
								<img src="images/ageguesser_logo.png" alt="Image" class="img-responsive">
							</figure>
							<div class="gtco-text">
								<h2>AgeGuesser</h2>
								<p>Utilizes 'Yes' and 'No' responses to guess a number from 1 - 100</p>
								<p><span class="btn btn-primary">Learn more</span></p>
							</div>
						</a>
					</div>
					<div class="col-lg-4 col-md-4 col-sm-6">
						<a href="https://play.google.com/store/apps/details?id=com.coppellcoders.icycle" target = "_blank" class="gtco-card-item">
							<figure>
								<div class="overlay"><i class="ti-plus"></i></div>
								<center>
								<img src="images/icycle_logo.png" alt="Image" class="img-responsive">
							</figure>
							<div class="gtco-text">
								<h2>iCycle</h2>
								<p>Details the materialistic makeup of an item taken by a camera</p>
								<p><span class="btn btn-primary">Learn more</span></p>
							</div>
						</a>
					</div>
					<div class="col-lg-4 col-md-4 col-sm-6">
						<a href="https://play.google.com/store/apps/details?id=ml.coppellcoders.realitydex" target = "_blank" class="gtco-card-item">
							<figure>
								<div class="overlay"><i class="ti-plus"></i></div>
								<center>
								<img src="images/realitydex_logo.png" alt="Image" class="img-responsive">
							</figure>
							<div class="gtco-text">
								<h2>RealityDex</h2>
								<p>Use a device camera to identify the name of a pokemon</p>
								<p><span class="btn btn-primary">Learn more</span></p>
							</div>
						</a>
					</div>


					<div class="col-lg-4 col-md-4 col-sm-6">
						<a href="#" class="gtco-card-item">
							<figure>
								<div class="overlay"><i class="ti-plus"></i></div>
								<img src="images/img_1.jpg" alt="Image" class="img-responsive">
							</figure>
							<div class="gtco-text">
								<h2>Future Project</h2>
								<p>Currently in Preparation Phase</p>
								<p><span class="btn btn-primary">Learn more</span></p>
							</div>
						</a>
					</div>

					<div class="col-lg-4 col-md-4 col-sm-6">
						<a href="#" class="gtco-card-item">
							<figure>
								<div class="overlay"><i class="ti-plus"></i></div>
								<img src="images/img_2.jpg" alt="Image" class="img-responsive">
							</figure>
							<div class="gtco-text">
								<h2>Future Project</h2>
								<p>Currently in Preparation Phase</p>
								<p><span class="btn btn-primary">Learn more</span></p>
							</div>
						</a>
					</div>

					<div class="col-lg-4 col-md-4 col-sm-6">
						<a href="#" class="gtco-card-item">
							<figure>
								<div class="overlay"><i class="ti-plus"></i></div>
								<img src="images/img_3.jpg" alt="Image" class="img-responsive">
							</figure>
							<div class="gtco-text">
								<h2>Future Project</h2>
								<p>Currently in Preparation Phase</p>
								<p><span class="btn btn-primary">Learn more</span></p>
							</div>
						</a>
					</div>

				</div>
			</div>
		</div>
		
		<div id="gtco-features">
			<div class="gtco-container">
				<div class="row">
					<div class="col-md-8 col-md-offset-2 text-center gtco-heading animate-box">
					
								</div>
				</div>
				<div class="row">
					<div class="col-md-4 col-sm-6">
					
					</div>
					<div class="col-md-4 col-sm-6">
						
					</div>
					<div class="col-md-4 col-sm-6">
						
					</div>
					

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


	</div>

	</div>

	<div class="gototop js-top">
		<a href="#" class="js-gotop"><i class="icon-arrow-up"></i></a>
	</div>
	
	<!-- jQuery -->
	<script src="js/jquery.min.js"></script>
	<!-- jQuery Easing -->
	<script src="js/jquery.easing.1.3.js"></script>
	<!-- Bootstrap -->
	<script src="js/bootstrap.min.js"></script>
	<!-- Waypoints -->
	<script src="js/jquery.waypoints.min.js"></script>
	<script src="js/sticky.js"></script>
	<!-- Carousel -->
	<script src="js/owl.carousel.min.js"></script>
	<!-- countTo -->
	<script src="js/jquery.countTo.js"></script>

	<!-- Stellar Parallax -->
	<script src="js/jquery.stellar.min.js"></script>

	<!-- Magnific Popup -->
	<script src="js/jquery.magnific-popup.min.js"></script>
	<script src="js/magnific-popup-options.js"></script>
	
	<!-- Main -->
	<script src="js/main.js"></script>

	</body>
</html>