Advertisement
Daichi-Sama

Alex's Viper Verses Page

Feb 14th, 2019
250
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 25.40 KB | None | 0 0
  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 by arithemes/darthvcder
  7.  
  8. CREDITS
  9.  
  10. icon font by suiomi
  11. filter tutorial by cyantists
  12. control fix by cyantists
  13.  
  14. ----->
  15.  
  16. <head>
  17.  
  18.  
  19.  
  20. <title>characters</title> <!-----change the title on the tab here----->
  21. <link rel="shortcut icon" href="{Favicon}">
  22. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  23.  
  24. <link href='https://fonts.googleapis.com/css?family=Karla' rel='stylesheet' type='text/css'>
  25. <link href="//dl.dropbox.com/s/vpi3f9s7nhpe7v7/honeybee.css" rel="stylesheet">
  26.  
  27. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  28. <script src="https://static.tumblr.com/xd6ujov/9Rpouml9f/imagesloaded.pkgd.min.js"></script>
  29. <script src="https://static.tumblr.com/f6blkfc/3khouzw5b/masonry.pkgd.min.js"></script>
  30.  
  31. <script>$(document).ready(function(){
  32. var $grid = $(".container"); $grid.imagesLoaded(function() {
  33. $grid.masonry({
  34. itemSelector: ".chara",
  35. columnWidth: 10
  36. });
  37. });
  38. $(".button").click(function(){
  39. $(this).addClass("selected");
  40. $(".button").not($(this)).removeClass("selected");
  41. var ssf = $(this).attr("filter");
  42. $(".chara." + ssf).show();
  43. $(".chara").not("." + ssf).hide();
  44. $grid.masonry();
  45. });
  46. });</script>
  47.  
  48.  
  49.  
  50.  
  51.  
  52. <style type="text/css">
  53.  
  54. /*FIX BY CYANTISTS*/
  55. iframe.tmblr-iframe {
  56. z-index:99999999999999!important;
  57. top:0!important;
  58. right:0!important;
  59. opacity:0.4;
  60. /* delete from here */
  61. filter:invert(1);
  62. -webkit-filter:invert(1);
  63. -o-filter:invert(1);
  64. -moz-filter:invert(1);
  65. -ms-filter:invert(1);
  66. /* to here if your blog has a dark background */
  67. transform:scale(0.6);
  68. transform-origin:100% 0;
  69. -webkit-transform:scale(0.6);
  70. -webkit-transform-origin:100% 0;
  71. -o-transform:scale(0.6);
  72. -o-transform-origin:100% 0;
  73. -moz-transform:scale(0.6);
  74. -moz-transform-origin:100% 0;
  75. -ms-transform:scale(0.6);
  76. -ms-transform-origin:100% 0;}
  77.  
  78. iframe.tmblr-iframe:hover {
  79. opacity:0.6!important;}
  80.  
  81.  
  82. ::-webkit-scrollbar-thumb {
  83. background-color: #eeeeee; /*change the scrollbar*/
  84. height:auto;
  85. border-bottom:none;
  86. }
  87. ::-webkit-scrollbar {
  88. height:9px;
  89. width:5px;
  90. background-color: transparent;
  91.  
  92. }
  93.  
  94. ::selection {
  95. background-color: #acd4e6; /*selection bg*/
  96. color: #fcfcfc; /*selection text*/
  97. }
  98.  
  99. body {
  100. background-color: #fcfcfc; /*background color*/
  101. background-image: url(/); /*background image url if you want one*/
  102. background-repeat: repeat;
  103. font-family: 'Karla', sans-serif;
  104. line-height: 110%;
  105. font-size: 11px;
  106. color: #9c9c9c; /*tag/categories color*/
  107. }
  108.  
  109.  
  110. #sidebar {
  111. width: 100px;
  112. height: 100%;
  113. margin-left: 0px;
  114. background-color: #eee; /*sidebar background color*/
  115. padding: 20px;
  116. margin-top: -30px;
  117. position: fixed;
  118. }
  119.  
  120. #title {
  121. font-size: 15px;
  122. color: #9c9c9c; /*page title color*/
  123. text-transform: uppercase;
  124. letter-spacing: 2px;
  125. font-weight: bold;
  126. margin-top: 100px;
  127. text-align: center;
  128. }
  129.  
  130. #nav {
  131. font-size: 13px;
  132. margin-top: 10px;
  133. text-align: center;
  134. }
  135.  
  136. #nav a {
  137. height: relative;
  138. color: #9c9c9c; /*home/ask/archive links color*/
  139. padding-right: 2px;
  140. padding-left: 2px;
  141. letter-spacing: 1px;
  142. text-decoration: none;
  143. }
  144.  
  145. #nav a:hover {
  146. color: #4c4c4c; /*home/ask/archive links hover color*/
  147. }
  148.  
  149. #buttons {
  150. width: 60px;
  151. height: relative;
  152. padding: 20px;
  153. background-color: #fcfcfc; /*filter container background color*/
  154. border-radius: 5px;
  155. margin-top: 50px;
  156. }
  157.  
  158. .button{
  159. color: #a6a6a6; /*filter text color*/
  160. cursor: help;
  161. font-size: 12px;
  162. display: block;
  163. margin-top: 20px;
  164. }
  165.  
  166. .button.selected {
  167. color: #acd4e6; /*selected filter color*/
  168. }
  169.  
  170. .button.selected a {
  171. color: #a6a6a6; /*selected filter bubble color*/
  172. }
  173.  
  174. .button a {
  175. color: #acd4e6; /*filter bubble color*/
  176. }
  177.  
  178. .container {
  179. width: 1100px;
  180. height: auto;
  181. margin-left: 150px;
  182. margin-bottom: 20px;
  183. margin-top: 30px;
  184. }
  185.  
  186. .chara {
  187. width: 300px;
  188. height: relative;
  189. background-color: white; /*character bg color*/
  190. padding: 10px;
  191. border: 1px solid #eeeeee; /*character border color*/
  192. border-radius: 5px;
  193. margin-top: 20px;
  194. margin-left: 20px;
  195. }
  196.  
  197. .chara img {
  198. width: 150px;
  199. height: 330px;
  200. margin-left: 150px;
  201. margin-top: 10px;
  202. border-radius: 5px;
  203. }
  204.  
  205. .name {
  206. font-size: 15px;
  207. color: #9c9c9c; /*character name color*/
  208. text-transform: uppercase;
  209. margin-left: 100px;
  210. font-weight: bold;
  211. }
  212.  
  213. #info {
  214. font-size: 13px;
  215. margin-top: -350px;
  216. }
  217.  
  218. .info {
  219. display: block;
  220. margin-top: 20px;
  221. background-color: #eee;
  222. border-radius: 5px;
  223. padding: 10px;
  224. color: #9c9c9c; /*info like url, age, etc text color*/
  225. width: 40%;
  226. }
  227.  
  228. .info a {
  229. color: #9c9c9c; /*info link color like for blog urls*/
  230. text-decoration: underline;
  231. }
  232.  
  233. .info a:hover {
  234. color: #4c4c4c; /*info link hover color*/
  235. }
  236.  
  237. .info span {
  238. color: #acd4e6; /*info icon color like the birthday cake/heart/etc*/
  239. }
  240.  
  241. .bio {
  242. width: 260px;
  243. height: relative;
  244. background-color: #eee; /*bio bg color*/
  245. padding: 20px;
  246. border-radius: 5px;
  247. margin-top: 20px;
  248. color: #9c9c9c; /*bio text color*/
  249. text-align: justify;
  250. }
  251.  
  252. .bio h1 {
  253. text-align: left;
  254. font-size: 14px;
  255. text-transform: lowercase;
  256. letter-spacing: 2px;
  257. color: #acd4e6; /*heading color*/
  258. border-bottom: 1px solid #acd4e6; /*heading border color*/
  259. padding-bottom: 5px;
  260. width: 50%;
  261. }
  262.  
  263. .title {
  264. font-size: 15px;
  265. color: #9c9c9c; /*bio title color*/
  266. text-transform: uppercase;
  267. margin-left: 100px;
  268. font-weight: bold;
  269. }
  270.  
  271. </style>
  272. </head>
  273.  
  274. <body>
  275.  
  276.  
  277.  
  278. <div id="sidebar">
  279.  
  280. <div id="title">
  281. characters <!--page title-->
  282. </div>
  283.  
  284. <div id="nav">
  285. <a href="/" class="th th-home" title="home"></a> <!--home link-->
  286. <a href="/faq" class="th th-paper-plane" title="ask"></a> <!--ask link-->
  287. <a href="/archive" class="th th-calendar-2" title="archive"></a> <!--archive link-->
  288. </div>
  289.  
  290. <div id="buttons">
  291. <div class="button selected" filter="chara" style="margin-top: 0px"><a class="th th-circle"></a> all</div> <!--all categories. only change the name "all categories"-->
  292. <div class="button" filter="cat1"><a class="th th-circle"></a> filter 1</div>
  293. <div class="button" filter="cat2"><a class="th th-circle"></a> filter 2</div>
  294. <div class="button" filter="cat3"><a class="th th-circle"></a> filter 3</div>
  295. <div class="button" filter="cat4"><a class="th th-circle"></a> filter 4</div>
  296. <div class="button" filter="cat5"><a class="th th-circle"></a> filter 5</div>
  297. <div class="button" filter="cat6"><a class="th th-circle"></a> filter 6</div>
  298. </div>
  299.  
  300. <!--to edit the above, replace "cat1" "cat2" etc with the category labels you would like to use. for example, "active" "archive". then replace "category 1" "category 2" etc with the label you want to give those things.-->
  301.  
  302. </div>
  303.  
  304.  
  305. <div class="container">
  306.  
  307.  
  308.  
  309. <!--character 1-->
  310.  
  311. <div class="chara cat1 cat6"> <!--here replace "cat1" and "cat6" with whatever labels you created above for your groups. i.e i'd put "active" for mine. no quotation marks, commas, or periods are needed-->
  312.  
  313. <div class="name">Fallout</div> <!--character name-->
  314.  
  315. <img src="https://66.media.tumblr.com/4f0d3e70b45c93cf43d4ff26ccd19cfb/tumblr_mi2w4eYTYg1rzyxxoo2_250.gif"> <!--put your character icon here. 150x330px-->
  316.  
  317. <div id="info">
  318. <div class="info"><span class="th th-link"></span> <a href="/tagged/Verse%3A-This-Is-The-Only-World-We've-Ever-Known">Tag</a></div>
  319. <div class="info"><span class="th th-cake-3"></span> 25</div>
  320. <div class="info"><span class="th th-heart-1"></span> Female</div>
  321. <div class="info"><span class="th th-location-1"></span> Drifter info</div>
  322. <div class="info"><span class="th th-quote-up"></span>
  323.  
  324. Really? You don't think Deathclaws are cute? Henry might have something to say about that~
  325.  
  326. <span class="th th-quote-down"></div>
  327. </div>
  328.  
  329.  
  330. <!--biography section-->
  331.  
  332. <div class="bio">
  333. <div class="title">biography</div> <!--biography section title-->
  334.  
  335. <h1>heading</h1> <!--you can make these subheadings just by adding the <h1></h1> brackets-->
  336. A Drifter moving from place to place, never staying in one place for to long. Wandering around all the time, she learns everything she can about both survival and everything around her. Always looking for small jobs to earn a few caps, but not above just taking what she needs either. She also have a real love for Deathclaws..
  337. <br><br>
  338. Finding a lost deathclaw baby has not changed this attitude towards them, only inhanced it. And that is why she is now the proud mother of said baby deathclaw, who she named Henry.
  339. <br><br>
  340. S.P.E.C.I.A.L
  341. <br><br>
  342. Strenght - 5
  343. <br><br>
  344. Percpective - 10
  345. <br><br>
  346. Endurance - 8
  347. <br><br>
  348. Charisma - 11
  349. <br><br>
  350. Intelegence - 8
  351. <br><br>
  352. Agility - 10
  353. <br><br>
  354. Luck - 4<br><br>
  355. Perks: Black Widow(3), Gun Nut(2), Hacker(3), Locksmith(4), Mister Sandman(3), Sneak(5).
  356.  
  357. </div>
  358.  
  359. <!--end biography section. if you're just doing a network page or something similar then you can delete this section if you don't need it-->
  360.  
  361. </div>
  362.  
  363. <!--end character 1. repeat the above for every character-->
  364.  
  365.  
  366. <!--character 2-->
  367.  
  368. <div class="chara cat2 cat5">
  369.  
  370. <div class="name">Dragon Age</div> <!--character name-->
  371.  
  372. <img src="https://66.media.tumblr.com/24613cf5cecbb78f36d2ee8b643606de/tumblr_oakvzpI9ne1vyhceho1_250.gif"> <!--put your character icon here. 150x330px-->
  373.  
  374. <div id="info">
  375. <div class="info"><span class="th th-link"></span> <a href="/tagged/verse:%20Dragons%20Really%20Are%20The%20King%20Of%20The%20Skies">blog url</a></div>
  376. <div class="info"><span class="th th-cake-3"></span> 25</div>
  377. <div class="info"><span class="th th-heart-1"></span> Female</div>
  378. <div class="info"><span class="th th-location-1"></span> Apostate/Rogue</div>
  379.  
  380. <div class="info"><span class="th th-quote-up"></span>
  381.  
  382. Mages and Templars? No matter what side you look at, none of them will want to admit that maybe they need to think differently.
  383.  
  384. <span class="th th-quote-down"></div>
  385. </div>
  386.  
  387. <!--biography section-->
  388.  
  389.  
  390. <div class="bio">
  391. <div class="title">biography</div> <!--biography section title-->
  392.  
  393. <h1>heading</h1> <!--you can make these subheadings just by adding the <h1></h1> brackets-->
  394.  
  395. Hiding from everyone that she is a mage, Viper has spent more of her life fighting as a Rogue, perfecting that art instead, though she is not bad with magic either. A fear of being caught is deep, though she will always play it off with a smile or a joke.
  396. <br><br>
  397. Losing her brothers to the blight, she travels around a lot. Never staying in one place for too long in case someone might have doubts about what she might be and how she fights.
  398. </div>
  399.  
  400. <!--end biography section. if you're just doing a network page or something similar then you can delete this section if you don't need it-->
  401.  
  402. </div>
  403.  
  404. <!--end character 2-->
  405.  
  406. <!--character 3-->
  407.  
  408. <div class="chara cat3 cat4">
  409.  
  410. <div class="name">Fire Emblem</div> <!--character name-->
  411.  
  412. <img src="https://66.media.tumblr.com/5435f1c096213c9731d21636739f6504/tumblr_nolkebg3Rl1r2kjqxo7_400.gif"> <!--put your character icon here. 150x330px-->
  413.  
  414. <div id="info">
  415. <div class="info"><span class="th th-link"></span> <a href="/tagged/These%20Embers%20Burn%20Eternally%20%7BFire%20Emblem%7D">Tag</a></div>
  416. <div class="info"><span class="th th-cake-3"></span> 104</div>
  417. <div class="info"><span class="th th-heart-1"></span> Female</div>
  418. <div class="info"><span class="th th-location-1"></span> Black Dragon Laguz</div>
  419.  
  420. <div class="info"><span class="th th-quote-up"></span>
  421.  
  422. I never wanted anything to do with being in power because of what I was born as. I rather be away and free.
  423.  
  424. <span class="th th-quote-down"></div>
  425. </div>
  426.  
  427. <!--biography section-->
  428.  
  429.  
  430. <div class="bio">
  431. <div class="title">biography</div> <!--biography section title-->
  432.  
  433. <h1>heading</h1> <!--you can make these subheadings just by adding the <h1></h1> brackets-->
  434.  
  435. Knowing that Black Dragons often was put in a place of power, Viper left as soon as she could. Though being outside of Goldoa was a fully new thing, as such she had no idea what to expect or how to really treat others. But doing as best she can in any situation.
  436. <br><br>
  437. Training as an assassin as well, she picks up the daggers for any cause she deems worthy, always staying true to herself and only revealing what she really is in rare cases when it is needed or it is someone she trusts. Either way, she knows she is a force to be reckoned with.
  438. </div>
  439.  
  440.  
  441. <!--end biography section. if you're just doing a network page or something similar then you can delete this section if you don't need it-->
  442.  
  443. </div>
  444.  
  445. <!--end character 3-->
  446.  
  447. <!--character 4-->
  448.  
  449. <div class="chara cat3 cat4">
  450.  
  451. <div class="name">character four</div> <!--character name-->
  452.  
  453. <img src="https://static.tumblr.com/gru63qm/KCvplpghb/character_icon.jpg"> <!--put your character icon here. 150x330px-->
  454.  
  455. <div id="info">
  456. <div class="info"><span class="th th-link"></span> <a href="https://url.tumblr.com">blog url</a></div>
  457. <div class="info"><span class="th th-cake-3"></span> age</div>
  458. <div class="info"><span class="th th-heart-1"></span> gender</div>
  459. <div class="info"><span class="th th-location-1"></span> more info</div>
  460. <div class="info"><span class="th th-information"></span> more info</div>
  461. <div class="info"><span class="th th-quote-up"></span>
  462.  
  463. short quote. lorem ipsum dolor sit amet.
  464.  
  465. <span class="th th-quote-down"></div>
  466. </div>
  467.  
  468. <!--biography section-->
  469.  
  470.  
  471. <div class="bio">
  472. <div class="title">biography</div> <!--biography section title-->
  473.  
  474. <h1>heading</h1> <!--you can make these subheadings just by adding the <h1></h1> brackets-->
  475.  
  476. Lorem ipsum dolor sit amet, consectetur adipiscing 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
  477. </div>
  478.  
  479.  
  480. <!--end biography section. if you're just doing a network page or something similar then you can delete this section if you don't need it-->
  481.  
  482. </div>
  483.  
  484. <!--end character 4-->
  485.  
  486. <!--character 5-->
  487.  
  488. <div class="chara cat2 cat5">
  489.  
  490. <div class="name">character five</div> <!--character name-->
  491.  
  492. <img src="https://static.tumblr.com/gru63qm/KCvplpghb/character_icon.jpg"> <!--put your character icon here. 150x330px-->
  493.  
  494. <div id="info">
  495. <div class="info"><span class="th th-link"></span> <a href="https://url.tumblr.com">blog url</a></div>
  496. <div class="info"><span class="th th-cake-3"></span> age</div>
  497. <div class="info"><span class="th th-heart-1"></span> gender</div>
  498. <div class="info"><span class="th th-location-1"></span> more info</div>
  499. <div class="info"><span class="th th-information"></span> more info</div>
  500. <div class="info"><span class="th th-quote-up"></span>
  501.  
  502. short quote. lorem ipsum dolor sit amet.
  503.  
  504. <span class="th th-quote-down"></div>
  505. </div>
  506.  
  507. <!--biography section-->
  508.  
  509.  
  510. <div class="bio">
  511. <div class="title">biography</div> <!--biography section title-->
  512.  
  513. <h1>heading</h1> <!--you can make these subheadings just by adding the <h1></h1> brackets-->
  514.  
  515. Lorem ipsum dolor sit amet, consectetur adipiscing 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
  516. </div>
  517.  
  518.  
  519. <!--end biography section. if you're just doing a network page or something similar then you can delete this section if you don't need it-->
  520.  
  521. </div>
  522.  
  523. <!--end character 5-->
  524.  
  525. <!--character 6-->
  526.  
  527. <div class="chara cat1 cat6">
  528.  
  529. <div class="name">character six</div> <!--character name-->
  530.  
  531. <img src="https://static.tumblr.com/gru63qm/KCvplpghb/character_icon.jpg"> <!--put your character icon here. 150x330px-->
  532.  
  533. <div id="info">
  534. <div class="info"><span class="th th-link"></span> <a href="https://url.tumblr.com">blog url</a></div>
  535. <div class="info"><span class="th th-cake-3"></span> age</div>
  536. <div class="info"><span class="th th-heart-1"></span> gender</div>
  537. <div class="info"><span class="th th-location-1"></span> more info</div>
  538. <div class="info"><span class="th th-information"></span> more info</div>
  539. <div class="info"><span class="th th-quote-up"></span>
  540.  
  541. short quote. lorem ipsum dolor sit amet.
  542.  
  543. <span class="th th-quote-down"></div>
  544. </div>
  545.  
  546. <!--biography section-->
  547.  
  548.  
  549. <div class="bio">
  550. <div class="title">biography</div> <!--biography section title-->
  551.  
  552. <h1>heading</h1> <!--you can make these subheadings just by adding the <h1></h1> brackets-->
  553.  
  554. Lorem ipsum dolor sit amet, consectetur adipiscing 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<br><br> <!--add the two <br> brackets any time you want a break between paragraphs-->
  555.  
  556. <h1>heading 2</h1>
  557.  
  558. Lorem ipsum dolor sit amet, consectetur adipiscing 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
  559. </div>
  560.  
  561.  
  562. <!--end biography section. if you're just doing a network page or something similar then you can delete this section if you don't need it-->
  563.  
  564. </div>
  565. <!--character 4-->
  566.  
  567. <div class="chara cat3 cat4">
  568.  
  569. <div class="name">character four</div> <!--character name-->
  570.  
  571. <img src="https://static.tumblr.com/gru63qm/KCvplpghb/character_icon.jpg"> <!--put your character icon here. 150x330px-->
  572.  
  573. <div id="info">
  574. <div class="info"><span class="th th-link"></span> <a href="https://url.tumblr.com">blog url</a></div>
  575. <div class="info"><span class="th th-cake-3"></span> age</div>
  576. <div class="info"><span class="th th-heart-1"></span> gender</div>
  577. <div class="info"><span class="th th-location-1"></span> more info</div>
  578. <div class="info"><span class="th th-information"></span> more info</div>
  579. <div class="info"><span class="th th-quote-up"></span>
  580.  
  581. short quote. lorem ipsum dolor sit amet.
  582.  
  583. <span class="th th-quote-down"></div>
  584. </div>
  585.  
  586. <!--biography section-->
  587.  
  588.  
  589. <div class="bio">
  590. <div class="title">biography</div> <!--biography section title-->
  591.  
  592. <h1>heading</h1> <!--you can make these subheadings just by adding the <h1></h1> brackets-->
  593.  
  594. Lorem ipsum dolor sit amet, consectetur adipiscing 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
  595. </div>
  596.  
  597.  
  598. <!--end biography section. if you're just doing a network page or something similar then you can delete this section if you don't need it-->
  599.  
  600. </div>
  601.  
  602. <!--end character 4-->
  603.  
  604. <!--character 5-->
  605.  
  606. <div class="chara cat2 cat5">
  607.  
  608. <div class="name">character five</div> <!--character name-->
  609.  
  610. <img src="https://static.tumblr.com/gru63qm/KCvplpghb/character_icon.jpg"> <!--put your character icon here. 150x330px-->
  611.  
  612. <div id="info">
  613. <div class="info"><span class="th th-link"></span> <a href="https://url.tumblr.com">blog url</a></div>
  614. <div class="info"><span class="th th-cake-3"></span> age</div>
  615. <div class="info"><span class="th th-heart-1"></span> gender</div>
  616. <div class="info"><span class="th th-location-1"></span> more info</div>
  617. <div class="info"><span class="th th-information"></span> more info</div>
  618. <div class="info"><span class="th th-quote-up"></span>
  619.  
  620. short quote. lorem ipsum dolor sit amet.
  621.  
  622. <span class="th th-quote-down"></div>
  623. </div>
  624.  
  625. <!--biography section-->
  626.  
  627.  
  628. <div class="bio">
  629. <div class="title">biography</div> <!--biography section title-->
  630.  
  631. <h1>heading</h1> <!--you can make these subheadings just by adding the <h1></h1> brackets-->
  632.  
  633. Lorem ipsum dolor sit amet, consectetur adipiscing 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
  634. </div>
  635.  
  636.  
  637. <!--end biography section. if you're just doing a network page or something similar then you can delete this section if you don't need it-->
  638.  
  639. </div>
  640.  
  641. <!--end character 5-->
  642. </div>
  643.  
  644. <!--end character 6-->
  645.  
  646. <!--to add more characters copy and paste the following:
  647.  
  648. <div class="chara cat1 cat6">
  649.  
  650. <div class="name">character six</div>
  651.  
  652. <img src="https://static.tumblr.com/gru63qm/KCvplpghb/character_icon.jpg">
  653.  
  654. <div id="info">
  655. <div class="info"><span class="th th-link"></span> <a href="https://url.tumblr.com">blog url</a></div>
  656. <div class="info"><span class="th th-cake-3"></span> age</div>
  657. <div class="info"><span class="th th-heart-1"></span> gender</div>
  658. <div class="info"><span class="th th-location-1"></span> more info</div>
  659. <div class="info"><span class="th th-information"></span> more info</div>
  660. <div class="info"><span class="th th-quote-up"></span>
  661.  
  662. short quote. lorem ipsum dolor sit amet.
  663.  
  664. <span class="th th-quote-down"></div>
  665. </div>
  666.  
  667.  
  668. <div class="bio">
  669. <div class="title">biography</div>
  670.  
  671. <h1>heading</h1>
  672.  
  673. Lorem ipsum dolor sit amet, consectetur adipiscing 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<br><br>
  674.  
  675. <h1>heading 2</h1>
  676.  
  677. Lorem ipsum dolor sit amet, consectetur adipiscing 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
  678. </div>
  679.  
  680. </div>
  681.  
  682. -->
  683.  
  684. </div>
  685.  
  686. <!--DON'T TOUCH ANYTHING HERE EXCEPT FOR #acd4e6 TO CHANGE LINK COLOR-->
  687.  
  688. <div style="position:fixed; bottom:8px; right:15px; font-size: 15px;"><a style="color:#acd4e6; text-decoration:none; font-weight: bold" class= "th th-stars" href="http://arithemes.tumblr.com/"></a></center></div>
  689.  
  690. </body>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement