453 lines
23 KiB
HTML
453 lines
23 KiB
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">
|
||
<meta name="description" content="Meetup is a free responsive single page bootstrap template by designerdada.com">
|
||
<meta name="author" content="Akash Bhadange">
|
||
<script src="js/destruct.js"></script>
|
||
<title>Meetup: Free Responsive One Page Bootstrap Template</title>
|
||
|
||
<!-- Bootstrap -->
|
||
<link href="css/bootstrap.min.css" rel="stylesheet">
|
||
<link href="css/style.css" rel="stylesheet">
|
||
<link href="css/themify-icons.css" rel="stylesheet">
|
||
<link href='css/dosis-font.css' rel='stylesheet' type='text/css'>
|
||
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
|
||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||
<!--[if lt IE 9]>
|
||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||
<![endif]-->
|
||
</head>
|
||
<body id="page-top" data-spy="scroll" data-target=".side-menu">
|
||
<nav class="side-menu">
|
||
<ul>
|
||
<li class="hidden active">
|
||
<a class="page-scroll" href="#page-top"></a>
|
||
</li>
|
||
<li>
|
||
<a href="#home" class="page-scroll">
|
||
<span class="menu-title">Home</span>
|
||
<span class="dot"></span>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="#speakers" class="page-scroll">
|
||
<span class="menu-title">Speakers</span>
|
||
<span class="dot"></span>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="#tickets" class="page-scroll">
|
||
<span class="menu-title">Buy Tickets</span>
|
||
<span class="dot"></span>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="#schedule" class="page-scroll">
|
||
<span class="menu-title">Schedule</span>
|
||
<span class="dot"></span>
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</nav>
|
||
<div class="container-fluid">
|
||
<!-- Start: Header -->
|
||
<div class="row hero-header" id="home">
|
||
<div class="col-md-7">
|
||
<img src="img/meetup-logo.png" class="logo">
|
||
<h1>Attend the most awaited Conference of 2015</h1>
|
||
<h3>to start you up with your business!</h3>
|
||
<h4>20<sup>th</sup> to 22<sup>nd</sup> October, 2015</h4>
|
||
<a href="#" class="btn btn-lg btn-red">Buy Tickets Now <span class="ti-arrow-right"></span></a>
|
||
|
||
</div>
|
||
<div class="col-md-5 hidden-xs">
|
||
<img src="img/rocket.png" class="rocket animated bounce">
|
||
</div>
|
||
</div>
|
||
<!-- End: Header -->
|
||
</div>
|
||
<div class="container">
|
||
<!-- Start: Desc -->
|
||
<div class="row me-row content-ct">
|
||
<h2 class="row-title">Why This Event Is Super Cool?</h2>
|
||
<div class="col-md-4 feature">
|
||
<span class="ti-ticket"></span>
|
||
<h3>Buy Early Bird Tickets</h3>
|
||
<p>Super cool discounts if you purchase early bird tickets now. Limited tickets available with some awesome perks and goodies!</p>
|
||
</div>
|
||
<div class="col-md-4 feature">
|
||
<span class="ti-microphone"></span>
|
||
<h3>Expert Speakers</h3>
|
||
<p>Best in class expert speakers who have extensive knowledge of the topic. All speakers are curated by the panel of experts.</p>
|
||
</div>
|
||
<div class="col-md-4 feature">
|
||
<span class="ti-world"></span>
|
||
<h3>People around the globe!</h3>
|
||
<p>Meet the people attending this event around the globe. This will be the best opportunity to meet and greet people from your industry.</p>
|
||
</div>
|
||
</div>
|
||
<!-- End: Desc -->
|
||
|
||
<!-- Start: Speakers -->
|
||
<div class="row me-row content-ct speaker" id="speakers">
|
||
<h2 class="row-title">Meet the Speakers</h2>
|
||
<div class="col-md-4 col-sm-6 feature">
|
||
<img src="img/speaker-1.png" class="speaker-img">
|
||
<h3>Simon Collins</h3>
|
||
<p>Simon is designer and partner at Fictivekin and has worked in a variety of situations for bands, record labels, governments, polar explorers, and most other things...</p>
|
||
<ul class="speaker-social">
|
||
<li><a href="#"><span class="ti-facebook"></span></a></li>
|
||
<li><a href="#"><span class="ti-twitter-alt"></span></a></li>
|
||
<li><a href="#"><span class="ti-linkedin"></span></a></li>
|
||
</ul>
|
||
</div>
|
||
<div class="col-md-4 col-sm-6 feature">
|
||
<img src="img/speaker-2.png" class="speaker-img">
|
||
<h3>Stephanie Troeth</h3>
|
||
<p>Stephie is a user experience researcher and designer. In over 15 years of working on the web, she has worn many hats, including a product lead for a tech startup in publishing...</p>
|
||
<ul class="speaker-social">
|
||
<li><a href="#"><span class="ti-facebook"></span></a></li>
|
||
<li><a href="#"><span class="ti-twitter-alt"></span></a></li>
|
||
<li><a href="#"><span class="ti-linkedin"></span></a></li>
|
||
</ul>
|
||
</div>
|
||
<div class="col-md-4 col-sm-6 feature">
|
||
<img src="img/speaker-3.png" class="speaker-img">
|
||
<h3>Harry Roberts</h3>
|
||
<p>Harry is a freelance designer, developer, writer, speaker and front-end architect from the UK, previously working as Senior UI Developer for Sky. He Tweets at...</p>
|
||
<ul class="speaker-social">
|
||
<li><a href="#"><span class="ti-facebook"></span></a></li>
|
||
<li><a href="#"><span class="ti-twitter-alt"></span></a></li>
|
||
<li><a href="#"><span class="ti-linkedin"></span></a></li>
|
||
</ul>
|
||
</div>
|
||
<div class="col-md-4 col-sm-6 feature">
|
||
<img src="img/speaker-4.png" class="speaker-img">
|
||
<h3>Geri Coady</h3>
|
||
<p>Harry is a freelance designer, developer, writer, speaker and front-end architect from the UK, previously working as Senior UI Developer for Sky. He Tweets at...</p>
|
||
<ul class="speaker-social">
|
||
<li><a href="#"><span class="ti-facebook"></span></a></li>
|
||
<li><a href="#"><span class="ti-twitter-alt"></span></a></li>
|
||
<li><a href="#"><span class="ti-linkedin"></span></a></li>
|
||
</ul>
|
||
</div>
|
||
<div class="col-md-4 col-sm-6 feature">
|
||
<img src="img/speaker-5.png" class="speaker-img">
|
||
<h3>Andy Budd</h3>
|
||
<p>Harry is a freelance designer, developer, writer, speaker and front-end architect from the UK, previously working as Senior UI Developer for Sky. He Tweets at...</p>
|
||
<ul class="speaker-social">
|
||
<li><a href="#"><span class="ti-facebook"></span></a></li>
|
||
<li><a href="#"><span class="ti-twitter-alt"></span></a></li>
|
||
<li><a href="#"><span class="ti-linkedin"></span></a></li>
|
||
</ul>
|
||
</div>
|
||
<div class="col-md-4 col-sm-6 feature">
|
||
<img src="img/speaker-6.png" class="speaker-img">
|
||
<h3>Christian Lauke</h3>
|
||
<p>Harry is a freelance designer, developer, writer, speaker and front-end architect from the UK, previously working as Senior UI Developer for Sky. He Tweets at...</p>
|
||
<ul class="speaker-social">
|
||
<li><a href="#"><span class="ti-facebook"></span></a></li>
|
||
<li><a href="#"><span class="ti-twitter-alt"></span></a></li>
|
||
<li><a href="#"><span class="ti-linkedin"></span></a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<!-- End: Speakers -->
|
||
</div>
|
||
|
||
<!-- Start: Tickets -->
|
||
<div class="container-fluid tickets" id="tickets">
|
||
<div class="row me-row content-ct">
|
||
<h2 class="row-title">Buy Tickets</h2>
|
||
<div class="col-md-4 col-sm-6 col-md-offset-2">
|
||
<h3>Early Bird Ticket</h3>
|
||
<p class="price">$399</p>
|
||
<p>All days entry pass for all the events.</p>
|
||
<a href="#" class="btn btn-lg btn-red">Buy <small>(6 remaining)</small></a>
|
||
</div>
|
||
<div class="col-md-4 col-sm-6">
|
||
<h3>Workshop Pass</h3>
|
||
<p class="price">$199</p>
|
||
<p>Entry pass for each workshop</p>
|
||
<a href="#" class="btn btn-lg btn-red">Buy <small>(42 remaining)</small></a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- End: Tickets -->
|
||
|
||
<!-- Start: Schedule -->
|
||
<div class="container">
|
||
<div class="row me-row schedule" id="schedule">
|
||
<h2 class="row-title content-ct">Event Schedule</h2>
|
||
<div class="col-md-12">
|
||
<!-- Nav tabs -->
|
||
<ul class="nav nav-tabs" role="tablist">
|
||
<li role="presentation" class="active"><a href="#day-1" aria-controls="home" role="tab" data-toggle="tab">Day 01 <small class="hidden-xs">(20<sup>th</sup>, October)</small></a></li>
|
||
<li role="presentation"><a href="#day-2" aria-controls="profile" role="tab" data-toggle="tab">Day 02 <small class="hidden-xs">(21<sup>st</sup>, October)</small></a></li>
|
||
<li role="presentation"><a href="#day-3" aria-controls="messages" role="tab" data-toggle="tab">Day 03 <small class="hidden-xs">(22<sup>nd</sup>, October)</small></a></li>
|
||
</ul>
|
||
|
||
<!-- Tab panes -->
|
||
<div class="tab-content">
|
||
<div role="tabpanel" class="tab-pane fade in active" id="day-1">
|
||
<div class="row">
|
||
<div class="col-md-6">
|
||
<div class="media">
|
||
<div class="media-left">
|
||
<a href="#">
|
||
<img class="media-object" src="img/speaker-1.png" alt="...">
|
||
</a>
|
||
</div>
|
||
<div class="media-body">
|
||
<h4 class="media-heading">10am to 10:30am</h4>
|
||
<h5>THE DESIGNER’S GUIDE TO BEING ESSENTIAL</h5>
|
||
<p>Simon is designer and partner at Fictivekin and has worked in a variety of situations for bands, record labels, governments, polar explorers, and most other things. </p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<div class="media">
|
||
<div class="media-left">
|
||
<a href="#">
|
||
<img class="media-object" src="img/speaker-2.png" alt="...">
|
||
</a>
|
||
</div>
|
||
<div class="media-body">
|
||
<h4 class="media-heading">10:45am to 11:30am</h4>
|
||
<h5>MODULAR DESIGN AT WORK</h5>
|
||
<p>Simon is designer and partner at Fictivekin and has worked in a variety of situations for bands, record labels, governments, polar explorers, and most other things. </p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<div class="media">
|
||
<div class="media-left">
|
||
<a href="#">
|
||
<img class="media-object" src="img/speaker-3.png" alt="...">
|
||
</a>
|
||
</div>
|
||
<div class="media-body">
|
||
<h4 class="media-heading">12:00pm to 01:30pm</h4>
|
||
<h5>AN INTRODUCTION TO TOUCH AND POINTER EVENTS</h5>
|
||
<p>Simon is designer and partner at Fictivekin and has worked in a variety of situations for bands, record labels, governments, polar explorers, and most other things. </p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<div class="media">
|
||
<div class="media-left">
|
||
<a href="#">
|
||
<img class="media-object" src="img/speaker-4.png" alt="...">
|
||
</a>
|
||
</div>
|
||
<div class="media-body">
|
||
<h4 class="media-heading">02:00pm to 03.30pm</h4>
|
||
<h5>WEB FONTS PERFORMANCE</h5>
|
||
<p>Simon is designer and partner at Fictivekin and has worked in a variety of situations for bands, record labels, governments, polar explorers, and most other things. </p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div role="tabpanel" class="tab-pane fade" id="day-2">
|
||
<div class="row">
|
||
<div class="col-md-6">
|
||
<div class="media">
|
||
<div class="media-left">
|
||
<a href="#">
|
||
<img class="media-object" src="img/speaker-4.png" alt="...">
|
||
</a>
|
||
</div>
|
||
<div class="media-body">
|
||
<h4 class="media-heading">10am to 10:30am</h4>
|
||
<h5>MAKING DOG FOOD PART OF A BALANCED DIET</h5>
|
||
<p>Simon is designer and partner at Fictivekin and has worked in a variety of situations for bands, record labels, governments, polar explorers, and most other things. </p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<div class="media">
|
||
<div class="media-left">
|
||
<a href="#">
|
||
<img class="media-object" src="img/speaker-3.png" alt="...">
|
||
</a>
|
||
</div>
|
||
<div class="media-body">
|
||
<h4 class="media-heading">10:45am to 11:30am</h4>
|
||
<h5>HANDS-ON WEB AUDIO</h5>
|
||
<p>Simon is designer and partner at Fictivekin and has worked in a variety of situations for bands, record labels, governments, polar explorers, and most other things. </p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<div class="media">
|
||
<div class="media-left">
|
||
<a href="#">
|
||
<img class="media-object" src="img/speaker-2.png" alt="...">
|
||
</a>
|
||
</div>
|
||
<div class="media-body">
|
||
<h4 class="media-heading">12:00pm to 01:30pm</h4>
|
||
<h5>CONVERSION RATE OPTIMIZATION TECHNIQUES IN ECOMMERCE</h5>
|
||
<p>Simon is designer and partner at Fictivekin and has worked in a variety of situations for bands, record labels, governments, polar explorers, and most other things. </p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<div class="media">
|
||
<div class="media-left">
|
||
<a href="#">
|
||
<img class="media-object" src="img/speaker-1.png" alt="...">
|
||
</a>
|
||
</div>
|
||
<div class="media-body">
|
||
<h4 class="media-heading">02:00pm to 03.30pm</h4>
|
||
<h5>PAPER PROTOTYPING APPLICATIONS</h5>
|
||
<p>Simon is designer and partner at Fictivekin and has worked in a variety of situations for bands, record labels, governments, polar explorers, and most other things. </p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div role="tabpanel" class="tab-pane fade" id="day-3">
|
||
<div class="row">
|
||
<div class="col-md-6">
|
||
<div class="media">
|
||
<div class="media-left">
|
||
<a href="#">
|
||
<img class="media-object" src="img/speaker-6.png" alt="...">
|
||
</a>
|
||
</div>
|
||
<div class="media-body">
|
||
<h4 class="media-heading">10am to 10:30am</h4>
|
||
<h5>THE DESIGNER’S GUIDE TO BEING ESSENTIAL</h5>
|
||
<p>Simon is designer and partner at Fictivekin and has worked in a variety of situations for bands, record labels, governments, polar explorers, and most other things. </p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<div class="media">
|
||
<div class="media-left">
|
||
<a href="#">
|
||
<img class="media-object" src="img/speaker-5.png" alt="...">
|
||
</a>
|
||
</div>
|
||
<div class="media-body">
|
||
<h4 class="media-heading">10:45am to 11:30am</h4>
|
||
<h5>THE DESIGNER’S GUIDE TO BEING ESSENTIAL</h5>
|
||
<p>Simon is designer and partner at Fictivekin and has worked in a variety of situations for bands, record labels, governments, polar explorers, and most other things. </p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<div class="media">
|
||
<div class="media-left">
|
||
<a href="#">
|
||
<img class="media-object" src="img/speaker-3.png" alt="...">
|
||
</a>
|
||
</div>
|
||
<div class="media-body">
|
||
<h4 class="media-heading">12:00pm to 01:30pm</h4>
|
||
<h5>THE DESIGNER’S GUIDE TO BEING ESSENTIAL</h5>
|
||
<p>Simon is designer and partner at Fictivekin and has worked in a variety of situations for bands, record labels, governments, polar explorers, and most other things. </p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<div class="media">
|
||
<div class="media-left">
|
||
<a href="#">
|
||
<img class="media-object" src="img/speaker-4.png" alt="...">
|
||
</a>
|
||
</div>
|
||
<div class="media-body">
|
||
<h4 class="media-heading">02:00pm to 03.30pm</h4>
|
||
<h5>THE DESIGNER’S GUIDE TO BEING ESSENTIAL</h5>
|
||
<p>Simon is designer and partner at Fictivekin and has worked in a variety of situations for bands, record labels, governments, polar explorers, and most other things. </p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- End: Schedule -->
|
||
|
||
<!-- Start: Footer -->
|
||
<div class="container-fluid footer">
|
||
<div class="row contact">
|
||
<div class="col-md-6 contact-form">
|
||
<h3 class="content-ct"><span class="ti-email"></span> Contact Form</h3>
|
||
<form class="form-horizontal" data-toggle="validator" role="form">
|
||
<div class="form-group">
|
||
<label for="name" class="col-sm-3 control-label">Name<sup>*</sup></label>
|
||
<div class="col-sm-9">
|
||
<input type="text" class="form-control" id="name" placeholder="John Doe" required>
|
||
<div class="help-block with-errors pull-right"></div>
|
||
<span class="form-control-feedback" aria-hidden="true"></span>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="email" class="col-sm-3 control-label">Email<sup>*</sup></label>
|
||
<div class="col-sm-9">
|
||
<input type="email" class="form-control" id="email" placeholder="you@youremail.com" required>
|
||
<div class="help-block with-errors pull-right"></div>
|
||
<span class="form-control-feedback" aria-hidden="true"></span>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="message" class="col-sm-3 control-label">Your Message<sup>*</sup></label>
|
||
<div class="col-sm-9">
|
||
<textarea id="message" class="form-control" rows="3" required></textarea>
|
||
<div class="help-block with-errors pull-right"></div>
|
||
<span class="form-control-feedback" aria-hidden="true"></span>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<div class="col-sm-offset-3 col-sm-9">
|
||
<button type="submit" id="submit" name="submit" class="btn btn-yellow pull-right">Send <span class="ti-arrow-right"></span></button>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
<div class="col-md-4 col-md-offset-1 content-ct">
|
||
<h3><span class="ti-twitter"></span> Twitter Feed</h3>
|
||
<p>Lorem <a href="#">#Ipsum</a> is a dummy text used as a text filler in designs. This is just a dummy text. via <a href="#">@designerdada</a> </p>
|
||
<hr>
|
||
<p>Lorem Ipsum is a <a href="#">#dummy</a> text used as a text filler in designs. This is just a dummy text. via <a href="#">@designerdada</a> </p>
|
||
<hr>
|
||
<p>Lorem Ipsum is a <a href="#">#dummy</a> text used as a text filler in designs. This is just a dummy text. via <a href="#">@designerdada</a> </p>
|
||
</div>
|
||
</div>
|
||
<div class="row footer-credit">
|
||
<div class="col-md-6 col-sm-6">
|
||
<p>© 2015, <a href="http://www.designerdada.com">DesignerDada.com</a> | All rights reserved.</p>
|
||
</div>
|
||
<div class="col-md-6 col-sm-6">
|
||
<ul class="footer-menu">
|
||
<li><a href="#">About Us</a></li>
|
||
<li><a href="#">Privacy Policy</a></li>
|
||
<li><a href="#">Terms & Condition</a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- End: Footer -->
|
||
|
||
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
|
||
<script src="js/jquery.min.js"></script>
|
||
<!-- Include all compiled plugins (below), or include individual files as needed -->
|
||
<script src="js/bootstrap.min.js"></script>
|
||
<script src="js/jquery.easing.min.js"></script>
|
||
<script src="js/scrolling-nav.js"></script>
|
||
<script src="js/validator.js"></script>
|
||
|
||
</body>
|
||
</html> |