API tools faq
paste
Advertisement
Guest User

Karneval - Circus

a guest
Jul 25th, 2014
228
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 31.34 KB | None | 0 0
raw download clone embed print report
  1. // This code is <div> heavy. Be very careful not to delete any of them. I got lost so many times when I accidentally did. Anyway, the color scheme is totally changeable. There are hover boxes involved in this code. I'm still new so I'm sorry for the flickering boxes. When hovering over the title word, place the mouse on the appearing box immediately for best results. Also, feel free to add a background to it, just make sure it is aligned right or the main part of the image is on the right side for best viewing. I hope you Remember, I'm still new so problems will pop up, but I hope you enjoy.//
  2.  
  3.  
  4.  
  5. //this is what goes in your about me section.//
  6. <style>table div font {display: none;}.mslogo,.clearfix form,.clearfix a,.clearfix select,.profileinfo,.contacttable,
  7. .userprofileurl,.interestsanddetails,.usereufleur,.userprofiledetail,.ricky, .userprofilenetworking,.userprofileschool, .userprofilecompany,.userote, .extendednetwork,.eufleuric,.latestblogentry,.blurbs td.text,.orangetext15, .friendspace,.friendscomments,table div {display:none!important;}table table div, .clearfix,.clearfix div {display: block!important;}table, tr, td, .clearfix {background:none!important;}div.profileWidth div { filter:alpha(opacity=0);opacity:0.0001; }
  8. .clearfix.profileWidth{display:none !important;}
  9. .top_nav_black{display:none !important;}
  10. </style>
  11.  
  12.  
  13.  
  14. <link href='http://fonts.googleapis.com/css?family=Indie+Flower' rel='stylesheet' type='text/css'>
  15. <style>
  16. body
  17. {
  18. background-color: #F2F3B1;
  19. }
  20. /* the below are containers & box css*/
  21. #container
  22. {
  23. background-color: #EDEDED;
  24. width: 960px;
  25. height: 1060px;
  26. top: 10px;
  27. left: 10px;
  28. border: 2px solid #AECAB1;
  29. position: absolute;
  30. }
  31.  
  32. #navig
  33. {
  34. background-color: #E54C5E;
  35. top: 0px;
  36. width: 960px;
  37. height: 35px;
  38. z-index: 2;
  39. text-align: center;
  40. }
  41.  
  42. #feature
  43. {
  44. width: 960px;
  45. height: 300px;
  46. background-color: #F04548;
  47. top: 35px;
  48. }
  49.  
  50. .text1
  51. {
  52. background-color: #F9BD81;
  53. top: 0px;
  54. width: 250px;
  55. height: 100%;
  56. float: left;
  57. z-index: 2;
  58. overflow-y: auto;
  59. overflow-x: hidden;
  60. }
  61.  
  62. .banner
  63. {
  64. width: 710px;
  65. height: 100%;
  66. float: right;
  67. background-color: #FF6467;
  68. z-index: 2;
  69. }
  70.  
  71. #content
  72. {
  73. background-color: transparent;
  74. margin: 5px;
  75. width: 99%;
  76. height: 700px;
  77. margin-top: 10px;
  78. margin-right: auto;
  79. margin-left: auto;
  80. margin-bottom: 10px;
  81. z-index: 2;
  82. }
  83.  
  84. .left
  85. {
  86. width: 230px;
  87. height: 700px;
  88. float: left;
  89. z-index: 2;
  90. border-right: 2px solid #D5295B;
  91. overflow-y: auto;
  92. overflow-x: hidden;
  93. background-color: #D7D7D7;
  94. }
  95.  
  96. .right
  97. {
  98. background-color: #D7D7D7;
  99. width: 230px;
  100. height: 700px;
  101. float: right;
  102. z-index: 2;
  103. border-left: 2px solid #D5295B;
  104. overflow-x: hidden;
  105. overflow-y: auto;
  106. }
  107. .sideboxes
  108. {
  109. margin: 5px;
  110. margin-top: 5px;
  111. margin-right: auto;
  112. margin-left: auto;
  113. margin-bottom: 10px;
  114. height: auto;
  115. width: 220px;
  116. }
  117. /*Middle content*/
  118. .center
  119. {
  120. margin: 0px auto;
  121. background-color: #D3D3D3;
  122. width: 940;
  123. height: 660px;
  124. }
  125.  
  126. .middleboxes
  127. {
  128. background-color: #CDCDCD;
  129. width: 475px;
  130. height: 200px;
  131. margin-top: 10px;
  132. margin-bottom: 10px;
  133. margin-right: auto;
  134. margin-left: auto;
  135. z-index: 3;
  136. overflow-y: auto;
  137. overflow-x: hidden;
  138. }
  139.  
  140. .zero
  141. {
  142. width: 475px;
  143. height: 175px;
  144. overflow-y: auto;
  145. overflow-x: hidden;
  146. z-index: 1;
  147. position: relative;
  148. background-color: #E3E3E3;
  149. }
  150.  
  151. .sectionhead
  152. {
  153. background-color: #D5295B;
  154. width: 100%;
  155. height: 20px;
  156. word-spacing: 20px;
  157. left: 0px;
  158. z-index: 1;
  159. }
  160. /* hover boxes*/
  161.  
  162.  
  163. .one
  164. {
  165. width: 100px;
  166. height: 200px;
  167. z-index: 1;
  168. margin-top: -200px;
  169. opacity: 0;
  170. margin-left: 110px;
  171. display: block;
  172. position: absolute;
  173. }
  174. .one:hover
  175. {
  176. background-color: #D3D3D3;
  177. width: 475px;
  178. height: 175px;
  179. margin-top: -174px;
  180. margin-bottom: 5px;
  181. opacity: 1;
  182. z-index: 8;
  183. -webkit-transition: ease-in-out .7s;
  184. -webkit-transform-style: preserve-3d;
  185. margin-left: 0px;
  186. overflow-y: auto;
  187. overflow-x: hidden;
  188. position: absolute;
  189. }
  190.  
  191. .two
  192. {
  193. width: 100px;
  194. height: 200px;
  195. z-index: 1;
  196. margin-top: -205px;
  197. opacity: 0;
  198. margin-left: 220px;
  199. position: absolute;
  200. }
  201. .two:hover
  202. {
  203. background-color: #D3D3D3;
  204. width: 475px;
  205. height: 175px;
  206. margin-top: -174px;
  207. margin-bottom: 5px;
  208. opacity: 1;
  209. z-index: 4;
  210. -webkit-transition: ease-in-out .7s;
  211. -webkit-transform-style: preserve-3d;
  212. margin-left: 0px;
  213. overflow-y: auto;
  214. overflow-x: hidden;
  215. position: absolute;
  216. }
  217.  
  218. .three
  219. {
  220. width: 100px;
  221. height: 200px;
  222. z-index: 1;
  223. margin-top: -200px;
  224. opacity: 0;
  225. margin-left: 326px;
  226. position: absolute;
  227. }
  228. .three:hover
  229. {
  230. background-color: #D3D3D3;
  231. width: 475px;
  232. height: 175px;
  233. margin-top: -174px;
  234. margin-bottom: 5px;
  235. opacity: 1;
  236. z-index: 4;
  237. -webkit-transition: ease-in-out .7s;
  238. -webkit-transform-style: preserve-3d;
  239. float: right;
  240. overflow-y: auto;
  241. overflow-x: hidden;
  242. position: absolute;
  243. margin-left: 0px;
  244. }
  245.  
  246.  
  247. /*the below is text css*/
  248. h2
  249. {
  250. <strong></strong>margin-top: 0px;
  251. text-align: center;
  252. color: #838383;
  253. border-bottom: 2px solid #D5295B;
  254. border-top: 2px solid #D5295B;
  255. letter-spacing: 10px;
  256. background-color: #EDEDED;
  257. }
  258.  
  259. h3
  260. {
  261. text-align: center;
  262. color: #FFFFFF;
  263. border-right: 2px solid #FFFFFF;
  264. letter-spacing: 5px;
  265. background-color: #E54C5E;
  266. display: inline-block;
  267. margin-top: 0px;
  268. font-size: medium;
  269. margin-left: 6px;
  270. width: 100px;
  271. }
  272. p
  273. {
  274. margin-left: 5px;
  275. margin-right: 5px;
  276. font-size: small;
  277. text-align: justify;
  278. color: #9F9F9F;
  279. margin-top: 5px;
  280. margin-bottom: 5px;
  281. word-wrap:break-word;
  282. }
  283.  
  284. blockquote
  285. {
  286. font-family: 'Indie Flower', cursive;
  287. margin-left: auto;
  288. margin-right: auto;
  289. background-color: #F84F50;
  290. z-index: 1;
  291. margin: 5px;
  292. color: #F7F7F7;
  293. text-align: center;
  294. font-style: italic;
  295. letter-spacing: 1px;
  296. }
  297.  
  298. b
  299. {
  300. text-transform: uppercase;
  301. color: #FFFFFF;
  302. font-weight: bolder;
  303. }
  304. u
  305. {
  306. color: #E9E58B;
  307. letter-spacing: 4px;
  308. }
  309.  
  310. s
  311. {
  312. color: #819884;
  313. font-weight: 500;
  314. vertical-align: sub;
  315. font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
  316. font-style: oblique;
  317. }
  318.  
  319. i
  320. {
  321. color: #FF4448;
  322. letter-spacing: 3px;
  323. }
  324. /*image indention*/
  325. .textwrapRight
  326. {
  327. float: right;
  328. margin: 5px;
  329. }
  330.  
  331. .textwrapLeft
  332. {
  333. clear: right;
  334. float: left;
  335. margin: 5px;
  336. }
  337.  
  338. /*Link css*/
  339. a.navi:link, a.navi:active, a.navi:visited
  340. {
  341. color: #E9E9E9;
  342. text-decoration: none;
  343. text-transform: uppercase;
  344. vertical-align: sub;
  345. word-spacing: 50px;
  346. letter-spacing: 3px;
  347. font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
  348. text-indent: 0px;
  349. }
  350.  
  351. a.navi:hover
  352. {
  353. letter-spacing: 2px;
  354. color: #FFFFFF;
  355. text-decoration: overline;
  356. text-align: center;
  357. text-shadow: 0px 0px 4px #FFFFFF;
  358. }
  359.  
  360. a.friend:link, a.friend:active, a.friend:visited
  361. {
  362. color: #4F4F4F;
  363. text-transform: uppercase;
  364. letter-spacing: 3px;
  365. font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
  366. text-align: center;
  367. text-decoration: none;
  368. background-color: #9E9E9E;
  369. width: 200px;
  370. display: inline-block;
  371. border-left: #EDEDED 2px solid;
  372. border-right: #EDEDED 2px solid;
  373. }
  374.  
  375. a.friend:hover
  376. {
  377. letter-spacing: 2px;
  378. color: #FFFFFF;
  379. text-align: center;
  380. text-shadow: 0px 0px 4px #FFFFFF;
  381. border-left: 2px solid #F72727;
  382. border-right: 2px solid #F72727;
  383. }
  384. ::-webkit-scrollbar-thumb:vertical { background-color: #BC1445; border-spacing: 0px 7px;
  385. border-spacing: 0px 8px;
  386. }
  387. ::-webkit-scrollbar-thumb:horizontal { background-color: #AECAB1;}
  388. ::-webkit-scrollbar {height: 8px; width: 8px;border: #E54C5E 3px solid; background-color: #FFFFFF;}
  389. </style>
  390.  
  391.  
  392.  
  393. // THIS IS WHAT GOES INTHE I'D LIKE TO MEET SECTION.//
  394.  
  395.  
  396. <body>
  397.  
  398. <div id="container">
  399. <div id="navig">
  400. <a href="" class="navi"> home </a>
  401. <a href="" class="navi"> home </a>
  402. <a href="" class="navi"> home </a>
  403. <a href="" class="navi"> home </a>
  404. <a href="" class="navi"> home </a>
  405. <a href="" class="navi"> home </a>
  406.  
  407. </div>
  408.  
  409. <div id="feature">
  410. <div class="text1">
  411. <div class="sideboxes">
  412. <p style="color: #E8E8E8;"> <u> underline</u>this is going to be a very short sentence but I hope it can go long enough so that I can mess around with the code.<s> strike </s><i> italic</i> <blockquote> "this is really nice text for a quote maybe. this is a blockquote" </blockquote></p>
  413.  
  414. </div>
  415.  
  416. </div>
  417.  
  418. <div class="banner">
  419. <img src="http://i.imgur.com/dd74p6y.jpg">
  420. </div>
  421. </div>
  422.  
  423. <div id="content">
  424. <div class="left">
  425. <div class="sideboxes">
  426. <img src="http://i.imgur.com/jkj6UxD.jpg">
  427. <h2>Title</h2>
  428. <p>
  429. <br>
  430. <a href="" class="friend"> friend </a>
  431. <a href="" class="friend"> friend </a>
  432. <a href="" class="friend"> friend </a>
  433. <a href="" class="friend"> friend </a>
  434. <a href="" class="friend"> friend </a>
  435. <a href="" class="friend"> friend </a>
  436.  
  437.  
  438.  
  439. </p>
  440. </div>
  441.  
  442. <div class="sideboxes"> <img src="http://i.imgur.com/jkj6UxD.jpg">
  443. <h2>Title</h2>
  444. <p>
  445. <b>NAME:</b> info
  446. <BR><b>NICKNAMES:</b> info
  447. <BR><b>ALIASES:</b> info
  448. <BR><b>DATE OF BIRTH:</b> info
  449. <BR><b>PLACE OF BIRTH:</b> info
  450. <BR><b>CURRENT RESIDENCE:</b> info
  451. </p>
  452. <img src="http://i.imgur.com/jkj6UxD.jpg">
  453. <h2> Title </h2>
  454. <p> <b>ETHNICITY:</b> info
  455. <BR><b>HAIR COLOR:</b> info
  456. <BR><b>EYE COLOR:</b> info
  457. <BR><b>HEIGHT:</b> info
  458. <BR><b>WEIGHT:</b> info
  459. </p>
  460. <img src="http://i.imgur.com/jkj6UxD.jpg">
  461. <h2> Title </h2>
  462. <p><b>Traits:</b> Info
  463. <BR><b>Disorders:</b> Info
  464. <BR><b>Addictions:</b> Info
  465. <BR><b>Likes:</b> Info
  466. <BR><b>Dislikes:</b> Info
  467. <BR><b>Quirks:</b> Info
  468. </p>
  469. </div>
  470. </div>
  471.  
  472.  
  473. <div class="right">
  474. <div class="sideboxes">
  475. <h2>o3.Title</h2>
  476. <p>
  477. <b>MOTHER:</b> info
  478. <BR><b>FATHER:</b> info
  479. <BR><b>SISTER(S):</b> info
  480. <BR><b>BROTHER(S):</b> info
  481. <BR><b>Other Family:</b> info
  482. </p>
  483. <img src="http://i.imgur.com/jkj6UxD.jpg">
  484. <h2> Title </h2>
  485. <p> <b>SEXUAL ORIENTATION:</b> info
  486. <BR><b>RELATIONSHIP STATUS:</b> info
  487. <BR><b>CURRENT RELATIONSHIP(S):</b> info
  488. <BR><b>PAST RELATIONSHIP(S):</b> info
  489. </p>
  490. <img src="http://i.imgur.com/jkj6UxD.jpg">
  491. <h2> Title </h2>
  492.  
  493. </p>
  494. </div>
  495. </div>
  496.  
  497. <div class="middleboxes">
  498.  
  499. <div class="sectionhead">
  500. <h3>one</h3><h3>two</h3><h3>three</h3><h3>four</h3>
  501. </div>
  502. <div class="zero">
  503. <img src="http://i.imgur.com/kl1rvzF.jpg" class="textwrapLeft">
  504. <p> <b>Hover over different areas of this area and three other boxes will appear where you can stuff information. Each word up there is the title of each section. Also, when playing around with the image sections, when adding a new image, make sure that you copy the part of the code that aligns the image on the side you want, whether its textwrapLeft or textwrapRight.
  505. Now, you can put whatever the heck you want here.</b> </p>
  506. <img src="http://i.imgur.com/kl1rvzF.jpg" class="textwrapRight">
  507. <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  508. </div>
  509.  
  510.  
  511. <div class="one">
  512. <p> <blockquote> this is nice text </blockquote></p>
  513. </div>
  514. <div class="two">
  515. <p><img src="http://i.imgur.com/kl1rvzF.jpg" class="textwrapLeft">
  516. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  517. <img src="http://i.imgur.com/kl1rvzF.jpg" class="textwrapRight">
  518. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  519. </div>
  520. <div class="three">
  521. <p><img src="http://i.imgur.com/kl1rvzF.jpg" class="textwrapLeft">
  522. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  523. <img src="http://i.imgur.com/kl1rvzF.jpg" class="textwrapRight">
  524. <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  525. </div>
  526.  
  527. </div>
  528.  
  529. <div class="middleboxes">
  530.  
  531. <div class="sectionhead">
  532. <h3>one</h3><h3>two</h3><h3>three</h3><h3>four</h3>
  533. </div>
  534. <div class="zero">
  535. <p> if you want more information boxes, just copy the entire middleboxes div area and paste it after the last section.and fill it up as much as you need.
  536.  
  537. </div>
  538.  
  539. <div class="one">
  540. <p><img src="http://i.imgur.com/kl1rvzF.jpg" class="textwrapLeft">
  541. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  542. <img src="http://i.imgur.com/kl1rvzF.jpg" class="textwrapRight">
  543. <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  544. </div>
  545. <div class="two">
  546. <p><img src="http://i.imgur.com/kl1rvzF.jpg" class="textwrapLeft">
  547. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  548. <img src="http://i.imgur.com/kl1rvzF.jpg" class="textwrapRight">
  549. <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  550. </div>
  551. <div class="three">
  552. <p><img src="http://i.imgur.com/kl1rvzF.jpg" class="textwrapLeft">
  553. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  554. <img src="http://i.imgur.com/kl1rvzF.jpg" class="textwrapRight">
  555. <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  556. </div>
  557.  
  558. </div>
  559.  
  560. <div class="middleboxes">
  561.  
  562. <div class="sectionhead">
  563. <h3>one</h3><h3>two</h3><h3>three</h3><h3>four</h3>
  564. </div>
  565. <div class="zero">
  566. <p> <img src="http://i.imgur.com/kl1rvzF.jpg" class="textwrapLeft">
  567. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  568. <img src="http://i.imgur.com/kl1rvzF.jpg" class="textwrapRight">
  569. <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. jhgsdfgyhj</p>
  570.  
  571. </div>
  572.  
  573. <div class="one">
  574. <p><img src="http://i.imgur.com/kl1rvzF.jpg" class="textwrapLeft">
  575. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  576. <img src="http://i.imgur.com/kl1rvzF.jpg" class="textwrapRight">
  577. <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  578. </div>
  579. <div class="two">
  580. <p><img src="http://i.imgur.com/kl1rvzF.jpg" class="textwrapLeft">
  581. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  582. <img src="http://i.imgur.com/kl1rvzF.jpg" class="textwrapRight">
  583. <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  584. </div>
  585. <div class="three">
  586. <p><img src="http://i.imgur.com/kl1rvzF.jpg" class="textwrapLeft">
  587. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  588. <img src="http://i.imgur.com/kl1rvzF.jpg" class="textwrapRight">
  589. <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  590. </div>
  591.  
  592. </div>
  593.  
  594. </div>
  595.  
  596. </div>
  597.  
  598. </div>
  599. </div>
  600.  
  601. </div>
  602.  
  603. </body>
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!