API tools faq
paste
Advertisement
alokasenna

Relations 03

alokasenna
Jun 14th, 2014
1,235
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 48.30 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html>
  3.  
  4. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  5.  
  6. <!-----PAGE 14 BY STVCKY (http://odinsson.co.vu/). DON'T STEAL OR REDISTRIBUTE. THANK.
  7.  
  8. ADDING SOME SHIT BECAUSE I WAS A DUMB AND UPLOADED THIS AS A GUEST ON PASTEBIN AND BECAUSE IT'S BEEN UPLOADED IT THINKS I'M STEALING MY OWN CODE. IGNORE THIS. IGNORE ME.----->
  9.  
  10. <head>
  11.  
  12. <!--KEEP THIS IN PLACE!!!! VERY VERY IMPORTANT!!! DO NOT TOUCH THIS!!!!-->
  13.  
  14. <script type="text/javascript"
  15. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  16. <script>
  17. $(document).ready(function() {
  18. //
  19. $('a.poplight[href^=#]').click(function() {
  20. var popID = $(this).attr('rel'); //Get Popup Name
  21. var popURL = $(this).attr('href'); //Get Popup href to define size
  22. var query= popURL.split('?');
  23. var dim= query[1].split('&');
  24. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  25. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"></a>');
  26. var popMargTop = ($('#' + popID).height() + 80) / 2;
  27. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  28. //Apply Margin to Popup
  29. $('#' + popID).css({
  30. 'margin-top' : -popMargTop,
  31. 'margin-left' : -popMargLeft
  32. });
  33. $('body').append('<div id="fade"></div>');
  34. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  35. return false;
  36. });
  37. $('a.close, #fade').live('click', function() {
  38. $('#fade , .popup_block').fadeOut(function() {
  39. $('#fade, a.close').remove(); //fade them both out
  40. });
  41. return false;
  42. });
  43. });
  44. </script>
  45.  
  46. <!--ALRIGHT CARRY ON-->
  47.  
  48.  
  49.  
  50. <title>Relationships</title> <!-----CHANGE THE TITLE ON THE TAB HERE----->
  51. <link rel="shortcut icon" href="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png"> <!-----CHANGE THE ICON ON THE TAB HERE----->
  52. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  53.  
  54.  
  55. <style type="text/css">
  56.  
  57. @font-face {font-family:b;src:url(http://static.tumblr.com/cvlbtjz/cnsln9tpp/bebasneue.otf);}
  58.  
  59. @font-face{font-family:k;src:url(http://static.tumblr.com/9wzbixa/USGm0c3z9/komikax.ttf);}
  60.  
  61. @font-face{font-family:j; src: url(http://static.tumblr.com/9wzbixa/mf3mj3kzl/marmellata_jam__demo.ttf);}
  62.  
  63.  
  64.  
  65. ::-webkit-scrollbar-thumb {
  66. background-color: #fcfcfc; /*CHANGE THE SCROLLBAR*/
  67. height:auto;
  68. border-bottom:none;
  69. }
  70. ::-webkit-scrollbar {
  71. height:9px;
  72. width:7px;
  73. background-color: #a2ebba; /*MATCH THIS TO THE BG COLOR OF THE POPUP BOX*/
  74.  
  75. }
  76.  
  77. ::selection {
  78. background-color: #a2ebba; /*SELECTION BG*/
  79. color: #fcfcfc; /*SELECTION TEXT*/
  80. }
  81.  
  82. body {
  83. background-color: #fcfcfc; /*BACKGROUND COLOR*/
  84. background-image: url(/); /*BACKGROUND URL*/
  85. background-repeat: repeat;
  86. }
  87.  
  88.  
  89. a {
  90. text-decoration: none;
  91. -webkit-transition: 0.5s;
  92. -moz-transition: 0.5s;
  93. transition: 0.5s;
  94. color: #000;
  95. }
  96.  
  97. a: hover {
  98. text-decoration: none;
  99. -webkit-transition: 0.5s;
  100. -moz-transition: 0.5s;
  101. transition: 0.5s;
  102. color: white;
  103. }
  104.  
  105. .popup_block{
  106. display:none;
  107. background: #a2ebba; /*CHANGE THE BG COLOR OF THE POPUP BOXES*/
  108. border: 20px solid #fcfcfc; /*CHANGE THE BORDER OF THE POPUP BOXES*/
  109. padding:20px;
  110. float:left;
  111. position:fixed;
  112. top:50%;left:50%;
  113. z-index: 99999;
  114. overflow-y: scroll;
  115. }
  116.  
  117. img.btn_close {
  118. float: right;
  119. margin: -20 -20px 0 0;
  120. }
  121. *html #fade {
  122. position: absolute;
  123. }
  124. *html .popup_block {
  125. position: absolute;
  126. }
  127.  
  128. #fade {
  129. display:none;
  130. background:#000;
  131. position:fixed;
  132. left:0;
  133. top:0;
  134. width:100%;
  135. height:100%;
  136. opacity:0.0;
  137. z-index:9999;
  138. }
  139.  
  140. #box {
  141. width: 620px;
  142. height: 410px;
  143. margin-top: 150px;
  144. }
  145.  
  146. .box {
  147. width: 200px;
  148. height: 200px;
  149. position: fixed;
  150. background-color: #a2ebba; /*CHANGE THE BG COLOR OF THE VERSE BOXES*/
  151. font-family: j;
  152. font-size: 40px;
  153. }
  154.  
  155. .box a {
  156. color: #fcfcfc;
  157. }
  158.  
  159. .box a:hover {
  160. opacity: .7;
  161. }
  162.  
  163. .relations {
  164. margin-top: 40px;
  165. border-bottom: 2px dotted #fcfcfc; /*CHANGE THE DOTTED BORDER BETWEEN RELATIONS AND DESC*/
  166. padding-bottom: 10px;
  167. width: 140px;
  168. }
  169.  
  170. .desc {
  171. margin-top: 10px;
  172. }
  173.  
  174. .title {
  175. font-family: k;
  176. font-size: 60px;
  177. color: #fcfcfc; /*CHANGE THE VERSE TITLES' COLORS*/
  178. text-shadow: 2px 2px #a2ebba; /*CHANGE SAID TITLES' TEXT SHADOWS*/
  179. }
  180.  
  181. .titlei {
  182. margin-top: -230px;
  183. }
  184.  
  185. .titleii {
  186. margin-top: -20px;
  187. }
  188.  
  189. #description {
  190. height: 260px;
  191. padding: 20px;
  192. color: #fcfcfc; /*CHANGE THE COLOR OF THE POPUP DESCRIPTION TEXT*/
  193. font-size: 14px;
  194. font-family: arial;
  195. text-align: center;
  196. }
  197.  
  198. .desci {
  199. background-color: #fcfcfc; /*CHANGE THE BG OF DESCRIPTION INFO... THINGS*/
  200. color: #a2ebba; /*CHANGE THE COLOR OF SAID THINGS*/
  201. font-family: b;
  202. font-size: 15px;
  203. padding: 5px;
  204. margin-top: 10px;
  205. }
  206.  
  207. .desci:hover {
  208. letter-spacing: 2px;
  209. -webkit-transition: 0.8s;
  210. -moz-transition: 0.8s;
  211. transition: 0.8s;
  212. }
  213.  
  214. #relations {
  215. height: 340px;
  216. padding: 20px;
  217. font-family: arial;
  218. font-size: 12px;
  219. color: #a2ebba; /*CHANGE THE TEXT COLOR OF YOUR RELATIONSHIPS*/
  220. }
  221.  
  222. #columni {
  223. width: 200px;
  224. height: 100%;
  225. }
  226.  
  227. #columnii {
  228. width: 200px;
  229. height: 100%;
  230. margin-left: 210px;
  231. margin-top: -350px;
  232. }
  233.  
  234. #rbox {
  235. width: 200px;
  236. height: 300px;
  237. background-color: #fcfcfc; /*CHANGE THE BG OF YOUR RELATIONSHIP BOXES*/
  238. margin-top: 10px;
  239. text-align: center;
  240. }
  241.  
  242. #rbox a {
  243. color: #a2ebba; /*CHANGE THE LINK COLOR OF YOUR RELATIONSHIP BOXES*/
  244. }
  245.  
  246. #rbox a:hover {
  247. opacity: .7;
  248. letter-spacing: 2px;
  249. -webkit-transition: 0.8s;
  250. -moz-transition: 0.8s;
  251. transition: 0.8s;
  252. }
  253.  
  254. .pic {
  255. width: 80px;
  256. }
  257.  
  258. .pic img {
  259. width: 80px;
  260. height: 80px;
  261. border: 20px solid #a2ebba; /*CHANGE THE IMAGE BORDERS*/
  262. margin-top: 20px;
  263. margin-left: 40px;
  264. }
  265.  
  266. .ibox {
  267. width: 200px;
  268. height: 150px;
  269. overflow-y: scroll;
  270. margin-top: 10px;
  271. }
  272.  
  273. .reli {
  274. background-color: #a2ebba; /*CHANGE THE BG OF THE RELATIONSHIP INFO LIKE URL/NAME/ECT.*/
  275. color: #fcfcfc; /*CHANGE THE COLOR OF THE INFO TEXT*/
  276. font-family: b;
  277. font-size: 15px;
  278. padding: 5px;
  279. margin-top: 5px;
  280. }
  281.  
  282. .reli:hover {
  283. letter-spacing: 2px;
  284. -webkit-transition: 0.8s;
  285. -moz-transition: 0.8s;
  286. transition: 0.8s;
  287. }
  288.  
  289. </style>
  290. </head>
  291.  
  292. <body>
  293.  
  294. <!--YOU DON'T REALLY HAVE TO CHANGE ANYTHING HERE. AT ALL. UNLESS YOU WANT TO CHANGE THE NAMES 'RELATIONS' AND 'DESC'. THERE'S NOTHING HERE THAT DOES MUCH SO JUST. GO ON IF YOU WANT.-->
  295.  
  296. <center>
  297. <div id="box">
  298.  
  299. <div class="box">
  300.  
  301. <div class="relations">
  302. <a href="#?w=450" rel="box1" class="poplight">relations</a>
  303. </div>
  304.  
  305. <div class="desc">
  306. <a href="#?w=300" rel="box2" class="poplight">desc</a>
  307. </div>
  308.  
  309. <div class="titlei">
  310. <div class="title">
  311. one
  312. </div>
  313. </div>
  314.  
  315. </div>
  316.  
  317.  
  318. <div class="box" style="margin-left: 210px">
  319.  
  320. <div class="relations">
  321. <a href="#?w=450" rel="box3" class="poplight">relations</a>
  322. </div>
  323.  
  324. <div class="desc">
  325. <a href="#?w=300" rel="box4" class="poplight">desc</a>
  326. </div>
  327.  
  328. <div class="titlei">
  329. <div class="title">
  330. two
  331. </div>
  332. </div>
  333.  
  334. </div>
  335.  
  336.  
  337. <div class="box" style="margin-left: 420px">
  338.  
  339. <div class="relations">
  340. <a href="#?w=450" rel="box5" class="poplight">relations</a>
  341. </div>
  342.  
  343. <div class="desc">
  344. <a href="#?w=300" rel="box6" class="poplight">desc</a>
  345. </div>
  346.  
  347. <div class="titlei">
  348. <div class="title">
  349. three
  350. </div>
  351. </div>
  352.  
  353. </div>
  354.  
  355.  
  356. <div class="box" style="margin-top: 210px">
  357.  
  358. <div class="relations">
  359. <a href="#?w=450" rel="box7" class="poplight">relations</a>
  360. </div>
  361.  
  362. <div class="desc">
  363. <a href="#?w=300" rel="box8" class="poplight">desc</a>
  364. </div>
  365.  
  366. <div class="titleii">
  367. <div class="title">
  368. four
  369. </div>
  370. </div>
  371.  
  372. </div>
  373.  
  374.  
  375. <div class="box" style="margin-left: 210px; margin-top: 210px">
  376.  
  377. <div class="relations">
  378. <a href="#?w=450" rel="box9" class="poplight">relations</a>
  379. </div>
  380.  
  381. <div class="desc">
  382. <a href="#?w=300" rel="box10" class="poplight">desc</a>
  383. </div>
  384.  
  385. <div class="titleii">
  386. <div class="title">
  387. five
  388. </div>
  389. </div>
  390.  
  391. </div>
  392.  
  393.  
  394. <div class="box" style="margin-left: 420px; margin-top: 210px">
  395.  
  396. <div class="relations">
  397. <a href="#?w=450" rel="box11" class="poplight">relations</a>
  398. </div>
  399.  
  400. <div class="desc">
  401. <a href="#?w=300" rel="box12" class="poplight">desc</a>
  402. </div>
  403.  
  404. <div class="titleii">
  405. <div class="title">
  406. six
  407. </div>
  408. </div>
  409.  
  410. </div>
  411.  
  412.  
  413.  
  414.  
  415. </div>
  416.  
  417. </div>
  418. </center>
  419.  
  420.  
  421. <!--DON'T TOUCH ANYTHING HERE EXCEPT FOR #A2EBBA AND #FCFCFC TO CHANGE THE CREDIT BG AND LINK-->
  422.  
  423. <div style="position:fixed;bottom:2px; right:3px; font-size:9px; letter-spacing:1px; font-family:calibri; height: 15px; width: 20px; background-color:#a2ebba; border:1px solid #a2ebba; border-radius: 50%; padding-top: 4px; text-align: center"><a style="color:#fcfcfc; text-decoration:none;" href="http://stvcky.tumblr.com/">S</a></center></div>
  424.  
  425. <!--CARRY ON-->
  426.  
  427. </body>
  428.  
  429. <!--HERE YOU START THE REAL CUSTOMIZATION.-->
  430.  
  431. <!--AND HERE WE START THE FIRST VERSE INFORMATION-->
  432.  
  433. <div id="box1" class="popup_block">
  434.  
  435. <div id="relations">
  436.  
  437. <div id="columni">
  438.  
  439. <div id="rbox">
  440.  
  441. <!--CHANGE THE IMAGE-->
  442. <div class="pic">
  443. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  444. </div>
  445.  
  446. <div class="ibox">
  447.  
  448. <!--ENTER YOUR INFO-->
  449. <div class="reli">
  450. name:
  451. </div>
  452. <br>
  453. name
  454.  
  455. <!--ENTER YOUR INFO-->
  456. <div class="reli">
  457. url:
  458. </div>
  459. <br>
  460. <a href="/">url</a> <!--IN PLACE OF THE SLASH, PUT THE URL. WRITE THE URL IN PLACE OF URL.-->
  461.  
  462. <!--ENTER YOUR INFO-->
  463. <div class="reli">
  464. description:
  465. </div>
  466. <br>
  467.  
  468. Here you write the characters description. Make it as long as you want.
  469.  
  470. </div>
  471.  
  472. </div>
  473.  
  474. <!--DO THE SAME FOR EVERY RELATIONSHIPS BOX ON THIS ENTIRE PAGE. HAVE FUN.-->
  475.  
  476. <div id="rbox">
  477.  
  478. <div class="pic">
  479. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  480. </div>
  481.  
  482. <div class="ibox">
  483.  
  484. <div class="reli">
  485. name:
  486. </div>
  487. <br>
  488. name
  489.  
  490. <div class="reli">
  491. url:
  492. </div>
  493. <br>
  494. <a href="/">url</a>
  495.  
  496. <div class="reli">
  497. description:
  498. </div>
  499. <br>
  500.  
  501. Here you write the characters description. Make it as long as you want.
  502.  
  503. </div>
  504.  
  505. </div>
  506.  
  507.  
  508. </div>
  509.  
  510.  
  511. <div id="columnii">
  512.  
  513. <div id="rbox">
  514.  
  515. <div class="pic">
  516. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  517. </div>
  518.  
  519. <div class="ibox">
  520.  
  521. <div class="reli">
  522. name:
  523. </div>
  524. <br>
  525. name
  526.  
  527. <div class="reli">
  528. url:
  529. </div>
  530. <br>
  531. <a href="/">url</a>
  532.  
  533. <div class="reli">
  534. description:
  535. </div>
  536. <br>
  537.  
  538. Here you write the characters description. Make it as long as you want.
  539.  
  540. </div>
  541.  
  542. </div>
  543.  
  544. <div id="rbox">
  545.  
  546. <div class="pic">
  547. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  548. </div>
  549.  
  550. <div class="ibox">
  551.  
  552. <div class="reli">
  553. name:
  554. </div>
  555. <br>
  556. name
  557.  
  558. <div class="reli">
  559. url:
  560. </div>
  561. <br>
  562. <a href="/">url</a>
  563.  
  564. <div class="reli">
  565. description:
  566. </div>
  567. <br>
  568.  
  569. Here you write the characters description. Make it as long as you want.
  570.  
  571. </div>
  572.  
  573. </div>
  574.  
  575.  
  576. </div>
  577.  
  578. </div>
  579.  
  580. </div>
  581.  
  582.  
  583. <!--THIS ONE IS MOSTLY JUST TEXT WITH NO HTML SO JUST REPLACE MY STUFF WITH YOUR STUFF AND YOU SHOULD BE GOLDEN. IF NOT THEN HIT ME UP-->
  584.  
  585. <div id="box2" class="popup_block">
  586.  
  587. <div id="description">
  588.  
  589. <div class="desci">
  590. location
  591. </div>
  592. <br>
  593. Location. Or whatever you want.
  594.  
  595. <div class="desci">
  596. period
  597. </div>
  598. <br>
  599. You can change this to whatever you want. Personally I'd use period for time periods but that all depends on your rp so feel free to change it.
  600.  
  601. <div class="desci">
  602. description
  603. </div>
  604. <br>
  605. Here you write your description of your verse. Make it as long or short as you want. I'm not here to stop you. A scrollbar will appear if it gets too long.
  606. <br><br>
  607. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Typi non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem. Investigationes demonstraverunt lectores legere me lius quod ii legunt saepius. Claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum. Mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima. Eodem modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in futurum.
  608.  
  609. </div>
  610.  
  611. </div>
  612.  
  613. </div>
  614.  
  615. <!--HERE IS WHERE THE FIRST VERSE ENDS. REPEAT EVERYTHING THERE FOR EVERYTHING BELOW.-->
  616.  
  617.  
  618. <!--HERE YOU START YOUR SECOND VERSE'S INFORMATION-->
  619.  
  620.  
  621. <div id="box3" class="popup_block">
  622.  
  623. <div id="relations">
  624.  
  625. <div id="columni">
  626.  
  627. <div id="rbox">
  628.  
  629. <div class="pic">
  630. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  631. </div>
  632.  
  633. <div class="ibox">
  634.  
  635. <div class="reli">
  636. name:
  637. </div>
  638. <br>
  639. name
  640.  
  641. <div class="reli">
  642. url:
  643. </div>
  644. <br>
  645. <a href="/">url</a>
  646.  
  647. <div class="reli">
  648. description:
  649. </div>
  650. <br>
  651.  
  652. Here you write the characters description. Make it as long as you want.
  653.  
  654. </div>
  655.  
  656. </div>
  657.  
  658. <div id="rbox">
  659.  
  660. <div class="pic">
  661. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  662. </div>
  663.  
  664. <div class="ibox">
  665.  
  666. <div class="reli">
  667. name:
  668. </div>
  669. <br>
  670. name
  671.  
  672. <div class="reli">
  673. url:
  674. </div>
  675. <br>
  676. <a href="/">url</a>
  677.  
  678. <div class="reli">
  679. description:
  680. </div>
  681. <br>
  682.  
  683. Here you write the characters description. Make it as long as you want.
  684.  
  685. </div>
  686.  
  687. </div>
  688.  
  689.  
  690. </div>
  691.  
  692.  
  693. <div id="columnii">
  694.  
  695. <div id="rbox">
  696.  
  697. <div class="pic">
  698. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  699. </div>
  700.  
  701. <div class="ibox">
  702.  
  703. <div class="reli">
  704. name:
  705. </div>
  706. <br>
  707. name
  708.  
  709. <div class="reli">
  710. url:
  711. </div>
  712. <br>
  713. <a href="/">url</a>
  714.  
  715. <div class="reli">
  716. description:
  717. </div>
  718. <br>
  719.  
  720. Here you write the characters description. Make it as long as you want.
  721.  
  722. </div>
  723.  
  724. </div>
  725.  
  726. <div id="rbox">
  727.  
  728. <div class="pic">
  729. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  730. </div>
  731.  
  732. <div class="ibox">
  733.  
  734. <div class="reli">
  735. name:
  736. </div>
  737. <br>
  738. name
  739.  
  740. <div class="reli">
  741. url:
  742. </div>
  743. <br>
  744. <a href="/">url</a>
  745.  
  746. <div class="reli">
  747. description:
  748. </div>
  749. <br>
  750.  
  751. Here you write the characters description. Make it as long as you want.
  752.  
  753. </div>
  754.  
  755. </div>
  756.  
  757.  
  758. </div>
  759.  
  760. </div>
  761.  
  762. </div>
  763.  
  764.  
  765.  
  766. <div id="box4" class="popup_block">
  767.  
  768. <div id="description">
  769.  
  770. <div class="desci">
  771. location
  772. </div>
  773. <br>
  774. Location. Or whatever you want.
  775.  
  776. <div class="desci">
  777. period
  778. </div>
  779. <br>
  780. You can change this to whatever you want. Personally I'd use period for time periods but that all depends on your rp so feel free to change it.
  781.  
  782. <div class="desci">
  783. description
  784. </div>
  785. <br>
  786. Here you write your description of your verse. Make it as long or short as you want. I'm not here to stop you. A scrollbar will appear if it gets too long.
  787. <br><br>
  788. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Typi non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem. Investigationes demonstraverunt lectores legere me lius quod ii legunt saepius. Claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum. Mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima. Eodem modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in futurum.
  789.  
  790. </div>
  791.  
  792. </div>
  793.  
  794. </div>
  795.  
  796. <!--HERE YOUR SECOND VERSE ENDS-->
  797.  
  798. <!--HERE YOUR THIRD VERSE STARTS-->
  799.  
  800. <div id="box5" class="popup_block">
  801.  
  802. <div id="relations">
  803.  
  804. <div id="columni">
  805.  
  806. <div id="rbox">
  807.  
  808. <div class="pic">
  809. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  810. </div>
  811.  
  812. <div class="ibox">
  813.  
  814. <div class="reli">
  815. name:
  816. </div>
  817. <br>
  818. name
  819.  
  820. <div class="reli">
  821. url:
  822. </div>
  823. <br>
  824. <a href="/">url</a>
  825.  
  826. <div class="reli">
  827. description:
  828. </div>
  829. <br>
  830.  
  831. Here you write the characters description. Make it as long as you want.
  832.  
  833. </div>
  834.  
  835. </div>
  836.  
  837. <div id="rbox">
  838.  
  839. <div class="pic">
  840. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  841. </div>
  842.  
  843. <div class="ibox">
  844.  
  845. <div class="reli">
  846. name:
  847. </div>
  848. <br>
  849. name
  850.  
  851. <div class="reli">
  852. url:
  853. </div>
  854. <br>
  855. <a href="/">url</a>
  856.  
  857. <div class="reli">
  858. description:
  859. </div>
  860. <br>
  861.  
  862. Here you write the characters description. Make it as long as you want.
  863.  
  864. </div>
  865.  
  866. </div>
  867.  
  868.  
  869. </div>
  870.  
  871.  
  872. <div id="columnii">
  873.  
  874. <div id="rbox">
  875.  
  876. <div class="pic">
  877. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  878. </div>
  879.  
  880. <div class="ibox">
  881.  
  882. <div class="reli">
  883. name:
  884. </div>
  885. <br>
  886. name
  887.  
  888. <div class="reli">
  889. url:
  890. </div>
  891. <br>
  892. <a href="/">url</a>
  893.  
  894. <div class="reli">
  895. description:
  896. </div>
  897. <br>
  898.  
  899. Here you write the characters description. Make it as long as you want.
  900.  
  901. </div>
  902.  
  903. </div>
  904.  
  905. <div id="rbox">
  906.  
  907. <div class="pic">
  908. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  909. </div>
  910.  
  911. <div class="ibox">
  912.  
  913. <div class="reli">
  914. name:
  915. </div>
  916. <br>
  917. name
  918.  
  919. <div class="reli">
  920. url:
  921. </div>
  922. <br>
  923. <a href="/">url</a>
  924.  
  925. <div class="reli">
  926. description:
  927. </div>
  928. <br>
  929.  
  930. Here you write the characters description. Make it as long as you want.
  931.  
  932. </div>
  933.  
  934. </div>
  935.  
  936.  
  937. </div>
  938.  
  939. </div>
  940.  
  941. </div>
  942.  
  943.  
  944.  
  945. <div id="box6" class="popup_block">
  946.  
  947. <div id="description">
  948.  
  949. <div class="desci">
  950. location
  951. </div>
  952. <br>
  953. Location. Or whatever you want.
  954.  
  955. <div class="desci">
  956. period
  957. </div>
  958. <br>
  959. You can change this to whatever you want. Personally I'd use period for time periods but that all depends on your rp so feel free to change it.
  960.  
  961. <div class="desci">
  962. description
  963. </div>
  964. <br>
  965. Here you write your description of your verse. Make it as long or short as you want. I'm not here to stop you. A scrollbar will appear if it gets too long.
  966. <br><br>
  967. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Typi non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem. Investigationes demonstraverunt lectores legere me lius quod ii legunt saepius. Claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum. Mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima. Eodem modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in futurum.
  968.  
  969. </div>
  970.  
  971. </div>
  972.  
  973. </div>
  974.  
  975. <!--HERE YOUR THIRD VERSE ENDS-->
  976.  
  977. <!--HERE YOUR FOURTH VERSE STARTS-->
  978.  
  979. <div id="box7" class="popup_block">
  980.  
  981. <div id="relations">
  982.  
  983. <div id="columni">
  984.  
  985. <div id="rbox">
  986.  
  987. <div class="pic">
  988. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  989. </div>
  990.  
  991. <div class="ibox">
  992.  
  993. <div class="reli">
  994. name:
  995. </div>
  996. <br>
  997. name
  998.  
  999. <div class="reli">
  1000. url:
  1001. </div>
  1002. <br>
  1003. <a href="/">url</a>
  1004.  
  1005. <div class="reli">
  1006. description:
  1007. </div>
  1008. <br>
  1009.  
  1010. Here you write the characters description. Make it as long as you want.
  1011.  
  1012. </div>
  1013.  
  1014. </div>
  1015.  
  1016. <div id="rbox">
  1017.  
  1018. <div class="pic">
  1019. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  1020. </div>
  1021.  
  1022. <div class="ibox">
  1023.  
  1024. <div class="reli">
  1025. name:
  1026. </div>
  1027. <br>
  1028. name
  1029.  
  1030. <div class="reli">
  1031. url:
  1032. </div>
  1033. <br>
  1034. <a href="/">url</a>
  1035.  
  1036. <div class="reli">
  1037. description:
  1038. </div>
  1039. <br>
  1040.  
  1041. Here you write the characters description. Make it as long as you want.
  1042.  
  1043. </div>
  1044.  
  1045. </div>
  1046.  
  1047.  
  1048. </div>
  1049.  
  1050.  
  1051. <div id="columnii">
  1052.  
  1053. <div id="rbox">
  1054.  
  1055. <div class="pic">
  1056. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  1057. </div>
  1058.  
  1059. <div class="ibox">
  1060.  
  1061. <div class="reli">
  1062. name:
  1063. </div>
  1064. <br>
  1065. name
  1066.  
  1067. <div class="reli">
  1068. url:
  1069. </div>
  1070. <br>
  1071. <a href="/">url</a>
  1072.  
  1073. <div class="reli">
  1074. description:
  1075. </div>
  1076. <br>
  1077.  
  1078. Here you write the characters description. Make it as long as you want.
  1079.  
  1080. </div>
  1081.  
  1082. </div>
  1083.  
  1084. <div id="rbox">
  1085.  
  1086. <div class="pic">
  1087. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  1088. </div>
  1089.  
  1090. <div class="ibox">
  1091.  
  1092. <div class="reli">
  1093. name:
  1094. </div>
  1095. <br>
  1096. name
  1097.  
  1098. <div class="reli">
  1099. url:
  1100. </div>
  1101. <br>
  1102. <a href="/">url</a>
  1103.  
  1104. <div class="reli">
  1105. description:
  1106. </div>
  1107. <br>
  1108.  
  1109. Here you write the characters description. Make it as long as you want.
  1110.  
  1111. </div>
  1112.  
  1113. </div>
  1114.  
  1115.  
  1116. </div>
  1117.  
  1118. </div>
  1119.  
  1120. </div>
  1121.  
  1122.  
  1123.  
  1124. <div id="box8" class="popup_block">
  1125.  
  1126. <div id="description">
  1127.  
  1128. <div class="desci">
  1129. location
  1130. </div>
  1131. <br>
  1132. Location. Or whatever you want.
  1133.  
  1134. <div class="desci">
  1135. period
  1136. </div>
  1137. <br>
  1138. You can change this to whatever you want. Personally I'd use period for time periods but that all depends on your rp so feel free to change it.
  1139.  
  1140. <div class="desci">
  1141. description
  1142. </div>
  1143. <br>
  1144. Here you write your description of your verse. Make it as long or short as you want. I'm not here to stop you. A scrollbar will appear if it gets too long.
  1145. <br><br>
  1146. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Typi non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem. Investigationes demonstraverunt lectores legere me lius quod ii legunt saepius. Claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum. Mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima. Eodem modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in futurum.
  1147.  
  1148. </div>
  1149.  
  1150. </div>
  1151.  
  1152. </div>
  1153.  
  1154. <!--HERE YOUR FOURTH VERSE ENDS-->
  1155.  
  1156. <!--HERE YOUR FIFTH VERSE STARTS-->
  1157.  
  1158. <div id="box9" class="popup_block">
  1159.  
  1160. <div id="relations">
  1161.  
  1162. <div id="columni">
  1163.  
  1164. <div id="rbox">
  1165.  
  1166. <div class="pic">
  1167. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  1168. </div>
  1169.  
  1170. <div class="ibox">
  1171.  
  1172. <div class="reli">
  1173. name:
  1174. </div>
  1175. <br>
  1176. name
  1177.  
  1178. <div class="reli">
  1179. url:
  1180. </div>
  1181. <br>
  1182. <a href="/">url</a>
  1183.  
  1184. <div class="reli">
  1185. description:
  1186. </div>
  1187. <br>
  1188.  
  1189. Here you write the characters description. Make it as long as you want.
  1190.  
  1191. </div>
  1192.  
  1193. </div>
  1194.  
  1195. <div id="rbox">
  1196.  
  1197. <div class="pic">
  1198. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  1199. </div>
  1200.  
  1201. <div class="ibox">
  1202.  
  1203. <div class="reli">
  1204. name:
  1205. </div>
  1206. <br>
  1207. name
  1208.  
  1209. <div class="reli">
  1210. url:
  1211. </div>
  1212. <br>
  1213. <a href="/">url</a>
  1214.  
  1215. <div class="reli">
  1216. description:
  1217. </div>
  1218. <br>
  1219.  
  1220. Here you write the characters description. Make it as long as you want.
  1221.  
  1222. </div>
  1223.  
  1224. </div>
  1225.  
  1226.  
  1227. </div>
  1228.  
  1229.  
  1230. <div id="columnii">
  1231.  
  1232. <div id="rbox">
  1233.  
  1234. <div class="pic">
  1235. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  1236. </div>
  1237.  
  1238. <div class="ibox">
  1239.  
  1240. <div class="reli">
  1241. name:
  1242. </div>
  1243. <br>
  1244. name
  1245.  
  1246. <div class="reli">
  1247. url:
  1248. </div>
  1249. <br>
  1250. <a href="/">url</a>
  1251.  
  1252. <div class="reli">
  1253. description:
  1254. </div>
  1255. <br>
  1256.  
  1257. Here you write the characters description. Make it as long as you want.
  1258.  
  1259. </div>
  1260.  
  1261. </div>
  1262.  
  1263. <div id="rbox">
  1264.  
  1265. <div class="pic">
  1266. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  1267. </div>
  1268.  
  1269. <div class="ibox">
  1270.  
  1271. <div class="reli">
  1272. name:
  1273. </div>
  1274. <br>
  1275. name
  1276.  
  1277. <div class="reli">
  1278. url:
  1279. </div>
  1280. <br>
  1281. <a href="/">url</a>
  1282.  
  1283. <div class="reli">
  1284. description:
  1285. </div>
  1286. <br>
  1287.  
  1288. Here you write the characters description. Make it as long as you want.
  1289.  
  1290. </div>
  1291.  
  1292. </div>
  1293.  
  1294.  
  1295. </div>
  1296.  
  1297. </div>
  1298.  
  1299. </div>
  1300.  
  1301.  
  1302.  
  1303. <div id="box10" class="popup_block">
  1304.  
  1305. <div id="description">
  1306.  
  1307. <div class="desci">
  1308. location
  1309. </div>
  1310. <br>
  1311. Location. Or whatever you want.
  1312.  
  1313. <div class="desci">
  1314. period
  1315. </div>
  1316. <br>
  1317. You can change this to whatever you want. Personally I'd use period for time periods but that all depends on your rp so feel free to change it.
  1318.  
  1319. <div class="desci">
  1320. description
  1321. </div>
  1322. <br>
  1323. Here you write your description of your verse. Make it as long or short as you want. I'm not here to stop you. A scrollbar will appear if it gets too long.
  1324. <br><br>
  1325. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Typi non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem. Investigationes demonstraverunt lectores legere me lius quod ii legunt saepius. Claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum. Mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima. Eodem modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in futurum.
  1326.  
  1327. </div>
  1328.  
  1329. </div>
  1330.  
  1331. </div>
  1332.  
  1333. <!--HERE YOUR FIFTH VERSE ENDS-->
  1334.  
  1335. <!--HERE YOUR SIXTH VERSE STARTS-->
  1336.  
  1337. <div id="box11" class="popup_block">
  1338.  
  1339. <div id="relations">
  1340.  
  1341. <div id="columni">
  1342.  
  1343. <div id="rbox">
  1344.  
  1345. <div class="pic">
  1346. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  1347. </div>
  1348.  
  1349. <div class="ibox">
  1350.  
  1351. <div class="reli">
  1352. name:
  1353. </div>
  1354. <br>
  1355. name
  1356.  
  1357. <div class="reli">
  1358. url:
  1359. </div>
  1360. <br>
  1361. <a href="/">url</a>
  1362.  
  1363. <div class="reli">
  1364. description:
  1365. </div>
  1366. <br>
  1367.  
  1368. Here you write the characters description. Make it as long as you want.
  1369.  
  1370. </div>
  1371.  
  1372. </div>
  1373.  
  1374. <div id="rbox">
  1375.  
  1376. <div class="pic">
  1377. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  1378. </div>
  1379.  
  1380. <div class="ibox">
  1381.  
  1382. <div class="reli">
  1383. name:
  1384. </div>
  1385. <br>
  1386. name
  1387.  
  1388. <div class="reli">
  1389. url:
  1390. </div>
  1391. <br>
  1392. <a href="/">url</a>
  1393.  
  1394. <div class="reli">
  1395. description:
  1396. </div>
  1397. <br>
  1398.  
  1399. Here you write the characters description. Make it as long as you want.
  1400.  
  1401. </div>
  1402.  
  1403. </div>
  1404.  
  1405.  
  1406. </div>
  1407.  
  1408.  
  1409. <div id="columnii">
  1410.  
  1411. <div id="rbox">
  1412.  
  1413. <div class="pic">
  1414. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  1415. </div>
  1416.  
  1417. <div class="ibox">
  1418.  
  1419. <div class="reli">
  1420. name:
  1421. </div>
  1422. <br>
  1423. name
  1424.  
  1425. <div class="reli">
  1426. url:
  1427. </div>
  1428. <br>
  1429. <a href="/">url</a>
  1430.  
  1431. <div class="reli">
  1432. description:
  1433. </div>
  1434. <br>
  1435.  
  1436. Here you write the characters description. Make it as long as you want.
  1437.  
  1438. </div>
  1439.  
  1440. </div>
  1441.  
  1442. <div id="rbox">
  1443.  
  1444. <div class="pic">
  1445. <img src="https://31.media.tumblr.com/bba8237cb348443348706f6add035c0c/tumblr_n75a41PZZf1tpb7s5o1_250.png">
  1446. </div>
  1447.  
  1448. <div class="ibox">
  1449.  
  1450. <div class="reli">
  1451. name:
  1452. </div>
  1453. <br>
  1454. name
  1455.  
  1456. <div class="reli">
  1457. url:
  1458. </div>
  1459. <br>
  1460. <a href="/">url</a>
  1461.  
  1462. <div class="reli">
  1463. description:
  1464. </div>
  1465. <br>
  1466.  
  1467. Here you write the characters description. Make it as long as you want.
  1468.  
  1469. </div>
  1470.  
  1471. </div>
  1472.  
  1473.  
  1474. </div>
  1475.  
  1476. </div>
  1477.  
  1478. </div>
  1479.  
  1480.  
  1481.  
  1482. <div id="box12" class="popup_block">
  1483.  
  1484. <div id="description">
  1485.  
  1486. <div class="desci">
  1487. location
  1488. </div>
  1489. <br>
  1490. Location. Or whatever you want.
  1491.  
  1492. <div class="desci">
  1493. period
  1494. </div>
  1495. <br>
  1496. You can change this to whatever you want. Personally I'd use period for time periods but that all depends on your rp so feel free to change it.
  1497.  
  1498. <div class="desci">
  1499. description
  1500. </div>
  1501. <br>
  1502. Here you write your description of your verse. Make it as long or short as you want. I'm not here to stop you. A scrollbar will appear if it gets too long.
  1503. <br><br>
  1504. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Typi non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem. Investigationes demonstraverunt lectores legere me lius quod ii legunt saepius. Claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum. Mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima. Eodem modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in futurum.
  1505.  
  1506. </div>
  1507.  
  1508. </div>
  1509.  
  1510. </div>
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!