API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Jan 28th, 2014
207
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 11.32 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8" />
  5. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  6. <link rel="stylesheet" type="text/css" href="css/style.css" />
  7. <link rel="stylesheet" href="css/flexslider.css" type="text/css">
  8. <script src="jquery/jquery.flexslider.js"></script>
  9. <link href='http://fonts.googleapis.com/css?family=Exo+2:300' rel='stylesheet' type='text/css'>
  10. <link href='http://fonts.googleapis.com/css?family=Exo+2:200' rel='stylesheet' type='text/css'>
  11. <link href='http://fonts.googleapis.com/css?family=Josefin+Sans' rel='stylesheet' type='text/css'>
  12. <title>Leef je uit!</title>
  13. <!-- Load jQuery -->
  14. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
  15.  
  16. <!-- Load ScrollTo -->
  17. <script src="http://flesler-plugins.googlecode.com/files/jquery.scrollTo-1.4.2-min.js"></script>
  18.  
  19. <!-- Load LocalScroll -->
  20. <script src="http://flesler-plugins.googlecode.com/files/jquery.localscroll-1.2.7-min.js"></script>
  21. <script>
  22. // When the document is loaded...
  23. $(document).ready(function()
  24. {
  25. // Scroll the whole document
  26. $('#piraten-box').localScroll({
  27. target:'body'
  28. });
  29. $('#ridder-box').localScroll({
  30. target:'body'
  31. });
  32. $('#mega-box').localScroll({
  33. target:'body'
  34. });
  35. $('#cocktail-box').localScroll({
  36. target:'body'
  37. });
  38. $('#anubis-box').localScroll({
  39. target:'body'
  40. });
  41. $('#sprookje-box').localScroll({
  42. target:'body'
  43. });
  44. });
  45. </script>
  46. </head>
  47. <body>
  48. <div class="container">
  49. <header>
  50. <div class="logo">
  51. <img src="img/logo.jpg"/>
  52. </div>
  53. <ul id="nav_menu_top">
  54. <li class="nav_li_top">
  55. <a href="index.html">home</a>
  56. </li>
  57. <li class="nav_li_top">
  58. <a href="themakisten.html">themakisten</a>
  59. </li>
  60. <li class="nav_li_top">
  61. <a href="wiezijnwij.html">wie zijn wij</a>
  62. </li>
  63. <li class="nav_li_top">
  64. <a href="contact.html">contact</a>
  65. </li>
  66. </ul>
  67. </header>
  68. <section>
  69. <div id="contact_banner">
  70. <h1 id="contact_head">THEMAKISTEN</h1>
  71. </div>
  72. <div id="themakist_top_img">
  73. <div class="themakist_block grow">
  74. <a href="#piraten-box"><img src="img/piraten_thema.png" alt="megamindy_kistje"></a>
  75. </div>
  76. <div class="themakist_block grow">
  77. <a href="#sprookje-box"><img src="img/sprookjes_thema.png" alt="sprookjes_kistje"></a>
  78. </div>
  79. <div class="themakist_block_2 grow">
  80. <a href="#mega-box"><img src="img/megamindy_thema.png" alt="sprookjes_kistje"></a>
  81. </div>
  82. <div class="themakist_block grow">
  83. <a href="#anubis-box"><img src="img/anubus_thema.png" alt="ridders-en-prinsessen_kistje"></a>
  84. </div>
  85. <div class="themakist_block grow">
  86. <a href="#cocktail-box"><img src="img/cocktail_thema.png" alt="cocktail_kistje"></a>
  87. </div>
  88. <div class="themakist_block_2 grow">
  89. <a href="#ridder-box"><img src="img/ridders_thema.png" alt="Anubis_kistje"></a>
  90. </div>
  91. <div class="themakist_block grow">
  92. <a href="#piraten-box"><img src="img/piraten_thema.png" alt="megamindy_kistje"></a>
  93. </div>
  94. <img id="lines" src="img/lines.png" alt="meer in aankomst"/>
  95. </div>
  96. <div id="themakist_wrapper">
  97. <div id="piraten-box" class="themakist_item_blue">
  98. <div class="ball_title">
  99. <img src="img/piraten_klein_rechts.png" alt="piraten-kist" class="ball_left ball_top">
  100. <img src="img/piraten_groot.png" alt="piraten-kist" class="ball_left">
  101. <img src="img/piraten_klein_links.png" alt="piraten-kist" class="ball_top">
  102. </div>
  103. <h1 class="title">Piraten</h1>
  104. <div class="themakist_info">
  105. <p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak met letters nam en ze door elkaar husselde om een font-catalogus te maken. Het heeft niet alleen vijf eeuwen overleefd maar is ook, vrijwel onveranderd, overgenomen in elektronische letterzetting. Het is in de jaren '60 populair geworden met de introductie van Letraset vellen met Lorem Ipsum passages en meer recentelijk door desktop publishing software zoals Aldus PageMaker die versies van Lorem Ipsum bevatten.
  106. </p>
  107. <a href="huren.html" class="reserveer_blue grow">RESERVEER</a>
  108. </div>
  109. </div>
  110. <div id="cocktail-box" class="themakist_item_green">
  111. <div class="ball_title">
  112. <img src="img/cocktail_klein_links.png" alt="cocktail-kist" class="ball_left ball_top">
  113. <img src="img/cocktail_groot.png" alt="cocktail-kist" class="ball_left">
  114. <img src="img/cocktail_klein_rechts.png" alt="cocktail-kist" class="ball_top">
  115. </div>
  116. <h1 class="title">Cocktailparty</h1>
  117. <div class="themakist_info">
  118. <p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak met letters nam en ze door elkaar husselde om een font-catalogus te maken. Het heeft niet alleen vijf eeuwen overleefd maar is ook, vrijwel onveranderd, overgenomen in elektronische letterzetting. Het is in de jaren '60 populair geworden met de introductie van Letraset vellen met Lorem Ipsum passages en meer recentelijk door desktop publishing software zoals Aldus PageMaker die versies van Lorem Ipsum bevatten.
  119. </p>
  120. <a href="huren.html" class="reserveer_green grow">RESERVEER</a>
  121. </div>
  122. </div>
  123. <div id="ridder-box" class="themakist_item_red">
  124. <div class="ball_title">
  125. <img src="img/ridder_klein_links.png" alt="Ridder-logo" class="ball_left ball_top">
  126. <img src="img/ridder_groot.png" alt="Ridder-logo" class="ball_left">
  127. <img src="img/ridder_klein_rechts.png" alt="Ridder-logo" class="ball_top">
  128. </div>
  129. <h1 class="title">Ridders en prinsessen</h1>
  130. <div class="themakist_info">
  131. <p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak met letters nam en ze door elkaar husselde om een font-catalogus te maken. Het heeft niet alleen vijf eeuwen overleefd maar is ook, vrijwel onveranderd, overgenomen in elektronische letterzetting. Het is in de jaren '60 populair geworden met de introductie van Letraset vellen met Lorem Ipsum passages en meer recentelijk door desktop publishing software zoals Aldus PageMaker die versies van Lorem Ipsum bevatten.
  132. </p>
  133. <a href="huren.html" class="reserveer_red grow">RESERVEER</a>
  134. </div>
  135. </div>
  136. <div id="anubis-box" class="themakist_item_blue">
  137. <div class="ball_title">
  138. <img src="img/anubis_klein_links.png" alt="anubis-kist" class="ball_left ball_top">
  139. <img src="img/anubis_groot.png" alt="anubis-kist" class="ball_left">
  140. <img src="img/anubis_klein_rechts.png" alt="anubis-kist" class="ball_top">
  141. </div>
  142. <h1 class="title">Huis Anubis</h1>
  143. <div class="themakist_info">
  144. <p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak met letters nam en ze door elkaar husselde om een font-catalogus te maken. Het heeft niet alleen vijf eeuwen overleefd maar is ook, vrijwel onveranderd, overgenomen in elektronische letterzetting. Het is in de jaren '60 populair geworden met de introductie van Letraset vellen met Lorem Ipsum passages en meer recentelijk door desktop publishing software zoals Aldus PageMaker die versies van Lorem Ipsum bevatten.
  145. </p>
  146. <a href="huren.html" class="reserveer_blue grow">RESERVEER</a>
  147. </div>
  148. </div>
  149. <div id="sprookje-box" class="themakist_item_green">
  150. <div class="ball_title">
  151. <img src="img/sprookje_klein_links.png" alt="sprookjes-kist" class="ball_left ball_top">
  152. <img src="img/sprookje_groot.png" alt="sprookjes-kist" class="ball_left">
  153. <img src="img/sprookjes_klein_rechts.png" alt="sprookjes-kist" class="ball_top">
  154. </div>
  155. <h1 class="title">Sprookjes</h1>
  156. <div class="themakist_info">
  157. <p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak met letters nam en ze door elkaar husselde om een font-catalogus te maken. Het heeft niet alleen vijf eeuwen overleefd maar is ook, vrijwel onveranderd, overgenomen in elektronische letterzetting. Het is in de jaren '60 populair geworden met de introductie van Letraset vellen met Lorem Ipsum passages en meer recentelijk door desktop publishing software zoals Aldus PageMaker die versies van Lorem Ipsum bevatten.
  158. </p>
  159. <a href="huren.html" class="reserveer_green grow">RESERVEER</a>
  160. </div>
  161. </div>
  162. <div id="mega-box" class="themakist_item_red">
  163. <div class="ball_title">
  164. <img src="img/mega_klein_links.png" alt="mega-kist" class="ball_left ball_top">
  165. <img src="img/mega_groot.png" alt="mega-kist" class="ball_left">
  166. <img src="img/mega_klein_rechts.png" alt="mega-kist" class="ball_top">
  167. </div>
  168. <h1 class="title">Mega Mindy</h1>
  169. <div class="themakist_info">
  170. <p>Lorem Ipsum is slechts een proeftekst uit het drukkerij- en zetterijwezen. Lorem Ipsum is de standaard proeftekst in deze bedrijfstak sinds de 16e eeuw, toen een onbekende drukker een zethaak met letters nam en ze door elkaar husselde om een font-catalogus te maken. Het heeft niet alleen vijf eeuwen overleefd maar is ook, vrijwel onveranderd, overgenomen in elektronische letterzetting. Het is in de jaren '60 populair geworden met de introductie van Letraset vellen met Lorem Ipsum passages en meer recentelijk door desktop publishing software zoals Aldus PageMaker die versies van Lorem Ipsum bevatten.
  171. </p>
  172. <a href="huren.html" class="reserveer_red grow">RESERVEER</a>
  173. </div>
  174. </div>
  175. </div>
  176. </section>
  177. </div><!--EINDE CONTAINER-->
  178. <footer>
  179. <div id="devider"></div>
  180. <div id="footer_wrapper">
  181. <div class="footer_item">
  182. <h5>Menu</h5>
  183. <br>
  184. <ul id="footer_menu_nav">
  185. <li>
  186. <a href="index.html">Home</a>
  187. </li>
  188. <li class="footer_menu_li">
  189. <a href="themakisten.html">Themakisten</a>
  190. </li>
  191. <li class="footer_menu_li">
  192. <a href="wiezijnwij.html">Wie zijn wij</a>
  193. </li>
  194. <li class="footer_menu_li">
  195. <a href="contact.html">Contact</a>
  196. </li>
  197. </ul>
  198. </div>
  199. <div class="footer_item">
  200. <h5>Contact</h5>
  201. <br>
  202. <p>Michelleverstegen@hoi.nl</p>
  203. <p>Hondennekkenstraat 43</p>
  204. <p>54352KJ Sint Michiels</p>
  205. <p>06XXXXXXXXXX</p>
  206. </div>
  207. <div class="footer_item" div id="over">
  208. <h5>Over Leef je uit!</h5>
  209. <br>
  210. <p>De plek waar je leuke themakisten kunt huren, voor een geweldig
  211. themafeest.</p>
  212. </div>
  213. </div>
  214. </footer>
  215. </body>
  216. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!