index.html 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Blasting off with Bootstrap</title>
  6. <meta http-equiv="X-UA-COMPATIBLE" content="IE=Edge" />
  7. <meta name="viewport" content="width=device-width, initial-scale=1" />
  8. <link rel="stylesheet" href="css/bootstrap.css"/>
  9. <link rel="stylesheet" href="css/main.css" />
  10. </head>
  11. <body>
  12. <div class="container">
  13. <div class="row">
  14. <h1>Blasting off with Boostrap</h1>
  15. </div>
  16. <div class="row">
  17. <div class="col-xs-12 col-md-6">
  18. <h2>The fastest way to space</h2>images
  19. <p class="lead">Make your way to space in the comfort of your own rocket, elevator or transporter.</p>
  20. <button>Take the tour</button>
  21. <button>Book Tickets now</button>
  22. </div>
  23. <div class="visible-md visible-lg col-sm-6">
  24. <a class=thumbnail href="images/blasting-off.png"><img src="images/blasting-off.png" /></a>
  25. </div>
  26. </div>
  27. <div class="row features text-center">
  28. <div class="col-xs-10 col-xs-offset-1 col-sm-4 col-sm-offset-0">
  29. <i class="glyphicon glyphicon-briefcase"></i>
  30. <h3>Book Today!</h3>
  31. <p>Even if you're traveling tomorrow, you can still get tickets today. We have
  32. a number of conveniently located ports around the globe to service everyone.</p>
  33. </div>
  34. <div class="col-xs-6 col-sm-4">
  35. <i class="glyphicon glyphicon-random"></i>
  36. <h3>Go anywhere</h3>
  37. <p>If you need to get to space today, why not try out a transporter? Despite
  38. the claims, there has been no deaths in the last 6 weeks!</p>
  39. </div>
  40. <div class="col-xs-6 col-sm-4">
  41. <i class="glyphicon glyphicon-send"></i>
  42. <h3>RocketBus&reg;</h3>
  43. <p>For cheapest fares, catch the next RocketBus&reg; to the stars. Cheaper on
  44. your wallet, and easiest way to make friends.</p>
  45. </div>
  46. </div>
  47. <div class="footer row">
  48. <div class="col-sm-3 text-justify">
  49. <h4>Who we are</h4>
  50. <p><em>Blasting off with Bootstrap</em> is the fastest way to space.
  51. If you want to travel to stars,
  52. <a href="http://www.codeschool.com">book your ticket today</a>!</em></p>
  53. <p><a href="http://www.codeshool.com">More About Us
  54. <i class="glyphicon glyphicon-arrow-right"></i></a>
  55. </p>
  56. </div>
  57. <div class="col-sm-2 col-sm-offset-1">
  58. <h4>Links</h4>
  59. <ul class="list-unstyled">
  60. <li><a href="index.html">Home</a></li>
  61. <li><a href="tickets.html">Tickets</a></li>
  62. <li><a href="stations.html">Stations</a></li>
  63. </ul>
  64. </div>
  65. <div class="col-sm-3">
  66. <h4>Reach out</h4>
  67. <ul class="list-unstyled">
  68. <li><a href="#">About</a></li>
  69. <li><a href="#">Contact us</a></li>
  70. <li><a href="#">Blog</a></li>
  71. <li><a href="#">Twitter</a></li>
  72. <li><a href="#">Facebook</a></li>
  73. </ul>
  74. </div>
  75. <div class="col-sm-3">
  76. <h4>Get in touch</h4></h3>
  77. <p>Want to get in touch with us?<br />
  78. There's a few easy ways.</p>
  79. <ul class="list-unstyled">
  80. <li><i class="glyphicon glyphicon-globe"></i> Orlando, FL</li>
  81. <li><i class="glyphicon glyphicon-phone"></i> 1-555-blast-off</li>
  82. <li><i class="glyphicon glyphicon-envelope"></i> <a href="mailto:blastingoff@codeshool.com">blastingoff@codeshool.com</a></li>
  83. </ul>
  84. <p>Blasting Off With Bootstrap<br />
  85. &copy;2214.</p>
  86. </div>
  87. </div>
  88. </div>
  89. <script src="js/jquery-2.2.1.js"></script>
  90. <script src="js/bootstrap.js"></script>
  91. </body>
  92. </html>