index.html 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261
  1. <!DOCTYPE html>
  2. <html class="js">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width, initial-scale=1">
  7. <title>Layla - Coming Soon Page</title>
  8. <!-- Stylesheets -->
  9. <link rel="stylesheet" href="css/bootstrap.min.css">
  10. <link rel="stylesheet" href="css/ionicons.min.css">
  11. <link rel="stylesheet" href="css/animate.css">
  12. <link rel="stylesheet" href="css/style.css">
  13. <!-- Google Fonts -->
  14. <link href='http://fonts.googleapis.com/css?family=Josefin+Sans:100,300,400,600,700,100italic,300italic,400italic,600italic,700italic|Cinzel:400,700,900' rel='stylesheet' type='text/css'>
  15. </head>
  16. <body>
  17. <div id="preloader"></div>
  18. <section id="video-wrap">
  19. <div id="video"></div>
  20. <div class="container">
  21. <div class="row">
  22. <div class="col-md-12">
  23. <div class="logo text-center wow fadeInDown">
  24. <a href="#"><img src="assets/logo.png" alt="Layla"></a>
  25. </div>
  26. </div>
  27. </div>
  28. <div class="row">
  29. <div class="col-md-7 wow fadeInLeft" style="z-index: 9999;">
  30. <div class="headline-wrap">
  31. <h1 class="headline">
  32. We Are Coming With Something
  33. <br>
  34. <span class="quotes">Amazing</span>
  35. <span class="quotes">Beautiful</span>
  36. <span class="quotes">Superb</span>
  37. <span class="quotes">Terrific</span>
  38. <span class="quotes">Awesome</span>
  39. <span class="quotes">Amazing</span>
  40. <span class="quotes">Amazing</span>
  41. <br>
  42. Subscribe and Stay UPDATED.
  43. </h1>
  44. <form role="form" id="subscribe-form" class="row">
  45. <div class="form-group col-xs-10">
  46. <input type="email" name="email" class="form-control mc-email" id="subscriber-email" placeholder="Email" required>
  47. </div>
  48. <div class="form-group col-xs-2 push-btn-left">
  49. <button id="subscribe-button" type="submit" class="btn btn-default mc-btn">
  50. <i class="ion-paper-airplane"></i>
  51. </button>
  52. </div>
  53. </form>
  54. <!-- SUCCESS OR ERROR MESSAGES -->
  55. <div id="subscription-response"></div>
  56. </div>
  57. </div>
  58. <div class="col-md-5 wow fadeInRight">
  59. <div class="clock row">
  60. <div class="col-xs-3 col-sm-3 col-md-6">
  61. <div class="countdown-time-value clock-item clock-days">
  62. <div class="wrap">
  63. <div class="inner">
  64. <div id="canvas-days" class="clock-canvas"></div>
  65. <div class="text">
  66. <p class="val">0</p>
  67. <p class="type-days type-time">DAYS</p>
  68. </div><!-- /.text -->
  69. </div><!-- /.inner -->
  70. </div><!-- /.wrap -->
  71. </div>
  72. </div><!-- /.clock-item -->
  73. <div class="col-xs-3 col-sm-3 col-md-6">
  74. <div class="clock-item clock-hours countdown-time-value">
  75. <div class="wrap">
  76. <div class="inner">
  77. <div id="canvas-hours" class="clock-canvas"></div>
  78. <div class="text">
  79. <p class="val">0</p>
  80. <p class="type-hours type-time">HOURS</p>
  81. </div><!-- /.text -->
  82. </div><!-- /.inner -->
  83. </div><!-- /.wrap -->
  84. </div>
  85. </div><!-- /.clock-item -->
  86. <div class="col-xs-3 col-sm-3 col-md-6">
  87. <div class="clock-item clock-minutes countdown-time-value">
  88. <div class="wrap">
  89. <div class="inner">
  90. <div id="canvas-minutes" class="clock-canvas"></div>
  91. <div class="text">
  92. <p class="val">0</p>
  93. <p class="type-minutes type-time">MINUTES</p>
  94. </div><!-- /.text -->
  95. </div><!-- /.inner -->
  96. </div><!-- /.wrap -->
  97. </div>
  98. </div><!-- /.clock-item -->
  99. <div class="col-xs-3 col-sm-3 col-md-6">
  100. <div class="clock-item clock-seconds countdown-time-value">
  101. <div class="wrap">
  102. <div class="inner">
  103. <div id="canvas-seconds" class="clock-canvas"></div>
  104. <div class="text">
  105. <p class="val">0</p>
  106. <p class="type-seconds type-time">SECONDS</p>
  107. </div><!-- /.text -->
  108. </div><!-- /.inner -->
  109. </div><!-- /.wrap -->
  110. </div>
  111. </div><!-- /.clock-item -->
  112. </div>
  113. </div>
  114. </div>
  115. </div>
  116. <div class="arrow-down text-center">
  117. <a href="#nav-menu" class="wow bounce" data-wow-duration="4s" data-wow-delay="1s" data-wow-iteration="1000"><i class="ion-chevron-down"></i></a>
  118. </div>
  119. </section>
  120. <section>
  121. <nav id="nav-menu" class="navbar nav-layla" role="navigation">
  122. <div class="navbar-header">
  123. <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".main-nav">
  124. <i class="ion-navicon"></i>
  125. </button>
  126. <a class="navbar-brand" href="#">LAYLA</a>
  127. </div>
  128. <div class="collapse navbar-collapse main-nav">
  129. <ul class="nav navbar-nav navbar-right">
  130. <li><a href="#wrap">Top</a><span class="hover-li"></span></li>
  131. <li><a href="#about">About</a><span class="hover-li"></span></li>
  132. <li><a href="#contact">Contact</a><span class="hover-li"></span></li>
  133. </ul>
  134. </div>
  135. </nav>
  136. </section>
  137. <section id="about">
  138. <div class="container">
  139. <div class="row">
  140. <div class="col-xs-12">
  141. <div class="title text-center wow zoomIn">
  142. <h1>ABOUT</h1>
  143. <span class="title line"></span>
  144. </div>
  145. </div>
  146. </div>
  147. <div class="row">
  148. <div class="col-sm-6 text-center wow fadeInLeft">
  149. <img src="assets/lady.jpg" alt="Jane Doe" class="img-responsive portrait">
  150. </div>
  151. <div class="col-sm-6 wow fadeInRight">
  152. <div class="about-text">
  153. <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellendus itaque quos sunt, possimus inventore quo expedita earum animi optio, dignissimos placeat quaerat voluptatum deserunt voluptatibus molestias iure adipisci totam quidem. </p>
  154. <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellendus itaque quos sunt, possimus inventore quo expedita earum animi optio, dignissimos placeat quaerat voluptatum deserunt voluptatibus molestias iure adipisci totam quidem. </p>
  155. <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellendus itaque quos sunt, possimus inventore quo expedita earum animi optio, dignissimos placeat quaerat voluptatum deserunt voluptatibus molestias iure adipisci totam quidem. </p>
  156. <div class="signature text-right">
  157. <img src="assets/signature.png" class="img-responsive" alt="Jane Doe">
  158. </div>
  159. </div>
  160. </div>
  161. </div>
  162. </div>
  163. </section>
  164. <section id="contact">
  165. <div class="container">
  166. <div class="row">
  167. <div class="col-xs-12">
  168. <div class="title text-center wow zoomIn">
  169. <h1>CONTACT US</h1>
  170. <span class="title line"></span>
  171. </div>
  172. </div>
  173. </div>
  174. <div class="row">
  175. <div class="col-sm-6 wow fadeInLeft">
  176. <p>Send us your Query. Drop your Message</p>
  177. <form id="contact-form" method="post" class="form afsana-form" role="form">
  178. <div class="row">
  179. <div class="col-sm-12 form-group">
  180. <input class="form-control afsana-style" id="name" name="name" placeholder="Name" type="text" required autofocus />
  181. </div>
  182. <div class="col-sm-12 form-group">
  183. <input class="form-control afsana-style" id="email" name="email" placeholder="Email" type="email" required />
  184. </div>
  185. <div class="col-sm-12 form-group">
  186. <textarea class="form-control" id="message" name="message" placeholder="Message" rows="5"></textarea>
  187. </div>
  188. <div class="col-sm-12 form-group">
  189. <button class="btn btn-primary afsana-btn" type="submit">Submit <i class="ion-arrow-graph-up-right"></i></button>
  190. </div>
  191. </div>
  192. </form>
  193. </div>
  194. <div class="col-sm-6 wow fadeInRight">
  195. <p>Like us on Facebook and Stay updated.</p>
  196. <div class="facebook-box">
  197. <iframe src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2FTechNextit&amp;width&amp;height=258&amp;colorscheme=dark&amp;show_faces=true&amp;header=false&amp;stream=false&amp;show_border=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; height:258px;" allowTransparency="true"></iframe>
  198. </div>
  199. <div class="social-icons">
  200. <ul>
  201. <li class="facebook wow fadeInUp" data-wow-delay="1.1s"><a href="#"><i class="ion-social-facebook"></i></a></li>
  202. <li class="twitter wow fadeInUp" data-wow-delay="1.2s"><a href="#"><i class="ion-social-twitter"></i></a></li>
  203. <li class="googleplus wow fadeInUp" data-wow-delay="1.3s"><a href="#"><i class="ion-social-googleplus"></i></a></li>
  204. <li class="github wow fadeInUp" data-wow-delay="1.5s"><a href="#"><i class="ion-social-github"></i></a></li>
  205. <li class="linkedin wow fadeInUp" data-wow-delay="1.6s"><a href="#"><i class="ion-social-linkedin"></i></a></li>
  206. <li class="youtube wow fadeInUp" data-wow-delay="1.7s"><a href="#"><i class="ion-social-youtube"></i></a></li>
  207. </ul>
  208. </div>
  209. </div>
  210. </div>
  211. </div>
  212. </section>
  213. <section id="footer">
  214. <div class="container">
  215. <div class="row">
  216. <div class="col-sm-8">
  217. <p class="copyright text-left">Copyright © 2014 Your Website Link. All rights reserved.</p>
  218. </div>
  219. <div class="col-sm-4">
  220. <p class="copyright text-right">Theme by <a href="https://themewagon.com/">ThemeWagon</a></p>
  221. </div>
  222. </div>
  223. </div>
  224. </section>
  225. <script src="js/modernizr.custom.js"></script>
  226. <script src="js/jquery.min.js"></script>
  227. <script src="js/bootstrap.min.js"></script>
  228. <script src="js/jquery.videoBG.js"></script>
  229. <script src="js/jquery.sticky-kit.min.js"></script>
  230. <script src="js/wow.min.js"></script>
  231. <script src="js/kinetic.js"></script>
  232. <script src="js/jquery.final-countdown.min.js"></script>
  233. <script src="js/script.js"></script>
  234. </body>
  235. </html>