API tools faq
paste
Advertisement
Daichi-Sama

Page for alex

Daichi-Sama
Jan 4th, 2018
326
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 23.66 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2.  
  3. THEME 10 [BOUSSOLE] by saisei-themes @ tumblr
  4.  
  5. - do not repost
  6. - do not claim as your own
  7. - do not use as base
  8. - enjoy !
  9.  
  10. -->
  11.  
  12.  
  13. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  14. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  15.  
  16. <head>
  17.  
  18. <link href="https://fonts.googleapis.com/css?family=Quicksand" rel="stylesheet">
  19.  
  20.  
  21. <title>{Title}</title>
  22.  
  23. <link rel="shortcut icon" href="{Favicon}">
  24. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  25. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  26.  
  27. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
  28.  
  29. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
  30.  
  31. <script src="https://npmcdn.com/isotope-layout@3.0/dist/isotope.pkgd.min.js"></script>
  32.  
  33. <script src="https://use.fontawesome.com/257106a2c1.js"></script>
  34.  
  35. <script>
  36. $(document).ready(function() {
  37. var $container = $('.grid').isotope({
  38. itemSelector: '.grid-item',
  39. masonry: {
  40. columnWidth: 100
  41. }
  42. });
  43.  
  44. $('.btn').click(function () {
  45. $(this) // wrap this, it always refers to the clicked event element
  46. .parents('.grid-item')// find parent grid item
  47. .find('.drop, .drop2, .drop3') // find adjacent drop
  48. .toggle('slow'); // only toggle that one element
  49.  
  50. });
  51.  
  52. $('.btn').click(function () {
  53. $(this)
  54. .parents('.one')
  55. .find('.grid-item')
  56. .toggleClass('fullsize');
  57. $container.isotope('layout');
  58. });
  59.  
  60. });
  61. </script>
  62.  
  63. <style type="text/css">
  64.  
  65. /* POPUP BOXES */
  66.  
  67. .popup_block{
  68. display:none;
  69. background:{color:posts};
  70. padding:20px;
  71. border:5px solid {color:accent};
  72. outline: 1px solid {color:border};
  73. float:left;
  74. position:fixed;
  75. top:50%;left:50%;
  76. z-index: 99999;
  77. font-size: {text:font size}px;
  78. }
  79.  
  80. *html #fade {position: absolute;}
  81. *html .popup_block {position: absolute;}
  82. #fade {
  83. display:none;
  84. position:fixed;
  85. left:0px;
  86. top:0px;
  87. width:100%;
  88. height:100%;
  89. z-index:9999;
  90. background:#000; /* change to #fff for solid white */
  91. opacity:0.2; /* change to opacity:1; */
  92. }
  93.  
  94. #popheading {
  95. font-size: 35px;
  96. font-family: 'radiometry';
  97. color: {color:border};
  98. border-bottom: 1px solid {color:border2};
  99. padding-bottom: 5px;
  100. padding-top: 5px;
  101. margin-bottom: 10px;
  102. }
  103.  
  104. /* CUSTOM FONT */
  105.  
  106. @font-face { font-family: "silkscreen"; src: url('https://dl.dropboxusercontent.com/s/4bj79wi75v77m0r/slkscr.ttf?dl=1'); format(“truetype”);}
  107.  
  108. @font-face { font-family: "bebas_neue"; src: url('https://dl.dropboxusercontent.com/s/scbj3da4dz3dfmf/bebasneue.otf?dl=1'); format(“truetype”);}
  109.  
  110. .dc::-webkit-scrollbar{ width: 5px; }
  111.  
  112. .dc::-webkit-scrollbar-thumb{ background-color: #e6e6e6;}
  113.  
  114. .dc::-webkit-scrollbar-track { background-color: #f6f6f6;}
  115.  
  116.  
  117. /* TEXT STUFF */
  118.  
  119. h1, h2 {
  120. font-size: 25px;
  121. font-family: 'radiometry';
  122. }
  123.  
  124. small, sup, sub {
  125. font-size: {text:font size}px;
  126. }
  127.  
  128. a {
  129. text-decoration: none;
  130. color: #d2adad;
  131. -webkit-transition: all .8s ease-in-out;
  132. -moz-transition: all .8s ease-in-out;
  133. -o-transition: all .8s ease-in-out;
  134. transition: all .8s ease-in-out;
  135. font-style: bold;
  136. }
  137.  
  138. a:hover {
  139. color: #cfcfcf;
  140. -webkit-transition: all .8s ease-in-out;
  141. -moz-transition: all .8s ease-in-out;
  142. -o-transition: all .8s ease-in-out;
  143. transition: all .8s ease-in-out;
  144. }
  145.  
  146. b, strong {
  147. color: #919191;
  148. }
  149.  
  150. i, em {
  151. color: #cfcfcf;
  152. }
  153.  
  154. /* BODY */
  155.  
  156. body {
  157. background: url('http://i.imgur.com/fzhm3tM.png');
  158. margin: 0px;
  159. padding: 0px;
  160. color: {color:text};
  161. font-family: quicksand;
  162. font-size: 13px;
  163. overflow-y: scroll;
  164. overflow-x: hidden;
  165. font-size: {text:font size}px;
  166. -webkit-font-smoothing:antialiased;
  167. }
  168.  
  169. /* GRID */
  170.  
  171. .grid {
  172. margin-left: auto;
  173. margin-right: auto;
  174. margin-top: 50px;
  175. margin-bottom: 50px;
  176. width: 600px;
  177. height: 100%;
  178. }
  179.  
  180. .grid:after {
  181. display: inline-block;
  182. clear: both;
  183. content: '';
  184. }
  185.  
  186. .grid-item {
  187. float: left;
  188. margin: 10px;
  189. width: 150px;
  190. height: 150px;
  191. font-size: 10px;
  192. }
  193.  
  194. .grid-item img {
  195. height: 100px;
  196. width: 100px;
  197. }
  198.  
  199. .grid-item.fullsize {
  200. float: left;
  201. height: 350px;
  202. position: relative;
  203. }
  204.  
  205. /* PAGE HEADER */
  206.  
  207. #top {
  208. position: relative;
  209. background: #d2adad;
  210. color: #fff;
  211. width: 100%;
  212. padding: 5px;
  213. font-size: 30px;
  214. top: 0px;
  215. text-align: center;
  216. border-bottom: 2px solid #b78a8a;
  217. letter-spacing: 2px;
  218. font-family:'bebas_neue';
  219. text-shadow: 0px 1px 2px #aa8383;
  220. }
  221.  
  222. /* ROW */
  223.  
  224. .one {
  225. width: 500px;
  226. }
  227.  
  228. /* ICONS */
  229.  
  230. .icon {
  231. position: absolute;
  232. top: 0;
  233. right: 0;
  234. border: 5px solid #fff;
  235. height: 100px;
  236. width: 100px;
  237. outline: 1px solid #e6e6e6;
  238. }
  239.  
  240. /* NAME BUTTON */
  241.  
  242. .btn {
  243. background-color: #d2adad;
  244. color:#fff;
  245. font-size: 8px;
  246. font-family: 'silkscreen';
  247. margin-top: 115px;
  248. padding:3px;
  249. margin-left: 40px;
  250. border: none;
  251. text-align: left;
  252. width: 110px;
  253. -webkit-font-smoothing: none;
  254. border-bottom: 1px solid #b78a8a;
  255. }
  256.  
  257. .btn:after {
  258. position: absolute;
  259. right: 0;
  260. top: 118px;
  261. padding: 0 5px;
  262. content: "+";
  263. font-weight: 100;
  264. }
  265.  
  266. .btn:focus {
  267. outline: 0;
  268. }
  269.  
  270. /* BOXES */
  271.  
  272. .drop {
  273. background-color: #fff;
  274. height: 200px;
  275. width: 488px;
  276. position: absolute;
  277. margin-top: 10px;
  278. color: #919191;
  279. display:none;
  280. text-align: justify;
  281. margin-left: 40px;
  282. padding: 10px;
  283. border: 1px solid #e6e6e6;
  284. letter-spacing: .5px;
  285. z-index: 9999;
  286. }
  287.  
  288. .drop2 {
  289. background-color: #fff;
  290. height: 200px;
  291. width: 488px;
  292. position: absolute;
  293. margin-top: 10px;
  294. color: #919191;
  295. display:none;
  296. text-align: justify;
  297. margin-left: -160px;
  298. padding: 10px;
  299. border: 1px solid #e6e6e6;
  300. z-index: 9999;
  301. }
  302.  
  303. .drop3 {
  304. background-color: #fff;
  305. height: 200px;
  306. width: 488px;
  307. position: absolute;
  308. margin-top: 10px;
  309. color: #919191;
  310. display:none;
  311. text-align: justify;
  312. margin-left: -360px;
  313. padding: 10px;
  314. border: 1px solid #e6e6e6;
  315. z-index: 9999;
  316. }
  317.  
  318. .dc {
  319. width: 465px;
  320. height: 155px;
  321. overflow-y: scroll;
  322. padding: 10px;
  323. position: absolute;
  324. font-size: 11px;
  325. margin-top: 5px;
  326. }
  327.  
  328. /* BOX HEADER */
  329.  
  330. #boxtop {
  331. width: 100%;
  332. margin: -10px -10px 0px -10px;
  333. text-transform: uppercase;
  334. font-size: 15px;
  335. }
  336.  
  337. #header {
  338. font-family: 'bebas_neue';
  339. color: #fff;
  340. position: relative;
  341. letter-spacing: 1px;
  342. background: #d2adad;
  343. padding: 5px;
  344. width: 48%;
  345. text-transform: capitalize;
  346. display: inline-block;
  347. }
  348.  
  349. #subtitle {
  350. font-family: 'bebas_neue';
  351. color: #919191;
  352. position: relative;
  353. letter-spacing: 1px;
  354. border-bottom: 1px solid #e6e6e6;
  355. padding: 5px 9px 4px 10px;
  356. float: right;
  357. width: 50%;
  358. text-transform: uppercase;
  359. display: inline-block;
  360. margin-right: -20px;
  361. text-align: left;
  362. }
  363.  
  364. /* INFO SECTION */
  365.  
  366. .basic {
  367. width: 100%;
  368. margin-top: -10px;
  369. }
  370.  
  371. .info {
  372. width: 50%;
  373. display: inline-block;
  374. }
  375.  
  376. .info li {
  377. border-bottom: 1px solid #e6e6e6;
  378. list-style-type: none;
  379. padding:3px 0px 3px 0px;
  380. }
  381.  
  382. .info li:before {
  383. font-family: 'FontAwesome';
  384. content:"\f101";
  385. padding-right: 4px;
  386. }
  387.  
  388. /* LINKS */
  389.  
  390. .links {
  391. width: 45%;
  392. float:right;
  393. display: inline-block;
  394. margin-left: 10px;
  395. padding-top: 5px;
  396. }
  397.  
  398. .links a, .links i {
  399. display: inline-block;
  400. font-size: 10px;
  401. padding: 3px 0px 3px 0px;
  402. }
  403.  
  404. .links i {
  405. padding-right: 7px;
  406. color: #919191;
  407. }
  408.  
  409.  
  410. /* CREDIT - DO NOT DELETE */
  411.  
  412. #cred {
  413. background-color: #d2adad;
  414. font-family: 'bebas neue';
  415. font-size: 10px;
  416. color: #fff;
  417. padding: 5px 6px 5px 6px;
  418. width: 15px;
  419. border: 2px solid #fff;
  420. outline: 1px solid #d2adad;
  421. float:bottom;
  422. top: 95%;
  423. left: 10px;
  424. position: fixed;
  425. }
  426.  
  427. #cred a {
  428. color: #fff;
  429. font-size: 12px;
  430. letter-spacing: 3px;
  431. }
  432.  
  433. </style></head>
  434.  
  435. <body>
  436. <div id="top">MUSE SELECTION</div>
  437.  
  438. <div class="grid">
  439.  
  440. <!--BEGIN FIRST ROW -->
  441.  
  442. <!-- FIRST MUSE -->
  443.  
  444. <div class="one">
  445. <div class="grid-item">
  446. <div class="icon"><img src="https://66.media.tumblr.com/6a6f7c67c083d2e3c9131e18d8c778c6/tumblr_o4t733eboo1scxlsho1_250.gif"></div>
  447. <button class="btn">Fallout</button>
  448.  
  449. <div class="drop">
  450.  
  451. <div id="boxtop">
  452. <div id="header">Drifter</div><div id="subtitle">Fallout, Viper, Drifter</div></div>
  453.  
  454. <div class="dc">
  455.  
  456. <div class="basic">
  457. <div class="info">
  458.  
  459. <!-- WRITE BASIC INFO HERE, EACH LINE BETWEEN <li></li> TAGS. -->
  460.  
  461. <li><b>origin:</b> A Small Settlement</li>
  462. <li><b>gender:</b> Female</li>
  463. <li><b>age:</b> 25</li>
  464. </div>
  465.  
  466. <!-- LINK SECTION -->
  467.  
  468. <div class="links">
  469. <i class="fa fa-tag" aria-hidden="true"></i><a href="http://xviperinae.tumblr.com/tagged/Verse%3A-This-Is-The-Only-World-We%27ve-Ever-Known">CHARACTER TAG</a></div>
  470. </div>
  471.  
  472. <!-- BIOGRAPHY/INFO SECTION -->
  473.  
  474. <p>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..</p>
  475.  
  476. <p>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.</p>
  477.  
  478. <p>S.P.E.C.I.A.L</p>
  479.  
  480. Strenght - 5
  481. <br>
  482. Percpective - 10
  483. <br>
  484. Endurance - 8
  485. <br>
  486. Charisma - 11
  487. <br>
  488. Intelegence - 8
  489. <br>
  490. Agility - 10
  491. <br>
  492. Luck - 4
  493. <br><br>
  494. Perks: Black Widow(3), Gun Nut(2), Hacker(3), Locksmith(4), Mister Sandman(3), Sneak(5).</p>
  495.  
  496. </div>
  497. </div>
  498. </div>
  499.  
  500. <!-- SECOND MUSE -->
  501.  
  502. <div class="grid-item">
  503. <div class="icon"><img src="https://66.media.tumblr.com/5435f1c096213c9731d21636739f6504/tumblr_nolkebg3Rl1r2kjqxo7_400.gif"></div>
  504. <button class="btn">Game of Thrones</button>
  505.  
  506. <div class="drop2">
  507.  
  508. <div id="boxtop">
  509. <div id="header">Game of Thrones</div><div id="subtitle">Seraphine, Runaway Noble</div></div>
  510.  
  511. <div class="dc">
  512.  
  513. <div class="basic">
  514. <div class="info">
  515.  
  516. <!-- WRITE BASIC INFO HERE, EACH LINE BETWEEN <li></li> TAGS. -->
  517.  
  518. <li><b>origin:</b> The North, Smaller noble house</li>
  519. <li><b>gender:</b> Female</li>
  520. <li><b>age:</b> 25</li>
  521. </div>
  522.  
  523. <!-- LINK SECTION -->
  524.  
  525. <div class="links">
  526. <i class="fa fa-tag" aria-hidden="true"></i><a href="http://xviperinae.tumblr.com/tagged/Verse%3A-The-Games-Of-The-Nobles-Is-A-Game-For-Fools">CHARACTER TAG</a></div>
  527. </div>
  528.  
  529. <!-- BIOGRAPHY/INFO SECTION -->
  530.  
  531. <p>After the murder of her mother at the hands of her father, living with him became somewhat of a hell. Seraphine wanted nothing more then to get away, from his plans for her and her future, more then anything else. All she wanted was to have the freedom to choose her own path in life, to live like she wanted to live. Training in secret with her bodyguard to be able to survive out in the world on her own, as soon as she got the change, Seraphine made a run for it.</p>
  532.  
  533. <p>Traveling all over, keep being on the move to stay at least two steps ahead at all times from her father, enjoying the life of being a free person, being able to make all the choices for herself. Only part of her old life that she has kept is her mother's old ring, hanging in a necklace around her neck.</p>
  534.  
  535. </div>
  536. </div>
  537. </div>
  538.  
  539. <!--THIRD MUSE -->
  540.  
  541. <div class="grid-item">
  542. <div class="icon"><img src="https://68.media.tumblr.com/f7039769c7f5fdfd3e5087dd545ce3ff/tumblr_odx8x7kkS21s4ym2no5_250.gif"></div>
  543. <button class="btn">The Walking Dead</button>
  544.  
  545. <div class="drop3">
  546.  
  547. <div id="boxtop">
  548. <div id="header">The Walking Dead</div><div id="subtitle">The Walking Dead, Viper, Traveler</div></div>
  549.  
  550. <div class="dc">
  551.  
  552. <div class="basic">
  553. <div class="info">
  554.  
  555. <!-- WRITE BASIC INFO HERE, EACH LINE BETWEEN <li></li> TAGS. -->
  556.  
  557. <li><b>origin:</b> New York</li>
  558. <li><b>gender:</b> Female</li>
  559. <li><b>age:</b> 25</li>
  560. </div>
  561.  
  562. <!-- LINK SECTION -->
  563.  
  564. <div class="links">
  565. <i class="fa fa-tag" aria-hidden="true"></i><a href="http://xviperinae.tumblr.com/tagged/Verse:%20The%20Dead%20Comes%20Back%20To%20Haunt%20Us">CHARACTER TAG</div>
  566. </div>
  567.  
  568. <!-- BIOGRAPHY/INFO SECTION -->
  569.  
  570. <p>Everyone knew the world was going to end sooner or later. That it would come with zombies was a thing that she had not counted on. Guess being a person with a lot of guns could save your life in many ways. Of course it had also pulled more of them to her place, meaning she had to flee without most of it. Over time, after figuring out that sound attracted the walkers, or the Munchies as she prefered to call them by, she went to the closest store that had weapons, getting a compound bow, figuring that it would be the easiest choice in weaponds, quiet and new ammo was not hard to make, Viper set out on a mission to just survive.</p>
  571.  
  572. <p>Never staying in one place for to long, afraid it will be overrun and she will get caught, Viper is paranoid towards other survivers, though willing to lend a hand if someone needs it. She will just sass while doing so.</p>
  573.  
  574. </div>
  575. </div>
  576. </div>
  577.  
  578. </div>
  579.  
  580. <!-- END FIRST ROW -->
  581.  
  582.  
  583. <!-- BEGIN SECOND ROW -->
  584.  
  585. <!-- FOURTH MUSE -->
  586.  
  587. <div class="one">
  588. <div class="grid-item">
  589. <div class="icon"><img src="https://68.media.tumblr.com/c10f97611247991b4f43efa2edd07ef3/tumblr_inline_ovd85fECGa1u94ne3_540.png"></div>
  590. <button class="btn">Dragon Age</button>
  591. <div class="drop">
  592.  
  593. <div id="boxtop">
  594. <div id="header">Dragon Age</div><div id="subtitle">Dragon Age, Viper, Apostate</div></div>
  595.  
  596. <div class="dc">
  597.  
  598. <div class="basic">
  599. <div class="info">
  600.  
  601. <!-- WRITE BASIC INFO HERE, EACH LINE BETWEEN <li></li> TAGS. -->
  602.  
  603. <li><b>origin:</b> Ferelden</li>
  604. <li><b>gender:</b> Female</li>
  605. <li><b>age:</b> 25</li>
  606. </div>
  607.  
  608. <!-- LINK SECTION -->
  609.  
  610. <div class="links">
  611. <i class="fa fa-tag" aria-hidden="true"></i><a href="http://xviperinae.tumblr.com/tagged/Verse%3A-Dragons-Really-Are-The-King-Of-The-Skies">CHARACTER TAG</a> </div>
  612. </div>
  613.  
  614. <!-- BIOGRAPHY/INFO SECTION -->
  615.  
  616. <p>Growing up in not one place but many, since her family moved a lot, Viper always tried to just see the happy outlook on life. After all, what was the point in being sad every time you had to up and leave once more? Living with her two older brothers, one of them a mage as well. When the templars finally caught wind of them, her brother gave herself up to spare her having to go to the circle. Her other brother started templar training and joined the same circle to make sure his little brother was okay.</p>
  617.  
  618. <p>When all hell broke lose with the blight, Viper found her brothers as they had broken out and went looking for her. Her oldest died to the darkspawn to save them, and her mage brother turned to blood magic to save her, forcing her to keep a old promise of never letting a demon take either of them, by killing him herself.</p>
  619.  
  620. <p>Now she travels all over the place, fighting more often as a rouge then a mage, just to try and keep what she is hidden, though she is not afraid to take to her magic if it is needed in a fight. Viper goes where the adventure can be found.</p>
  621.  
  622. </div>
  623. </div>
  624. </div>
  625.  
  626. <!-- FIFTH MUSE -->
  627.  
  628. <div class="grid-item">
  629. <div class="icon"><img src="https://68.media.tumblr.com/4d1d7459d0270ba56617c8330b15469d/tumblr_o8kga7iqqf1qm25gco2_400.gif"></div>
  630. <button class="btn">Final Fantasy</button>
  631. <div class="drop2">
  632.  
  633. <div id="boxtop">
  634. <div id="header">MUSE FULL NAME</div><div id="subtitle">ALIAS, NICKNAME, TITLE</div></div>
  635.  
  636. <div class="dc">
  637.  
  638. <div class="basic">
  639. <div class="info">
  640.  
  641. <!-- WRITE BASIC INFO HERE, EACH LINE BETWEEN <li></li> TAGS. -->
  642.  
  643. <li><b>origin:</b> ORIGIN</li>
  644. <li><b>gender:</b> GENDER</li>
  645. <li><b>age:</b> AGE</li>
  646. </div>
  647.  
  648. <!-- LINK SECTION -->
  649.  
  650. <div class="links">
  651. <i class="fa fa-tag" aria-hidden="true"></i><a href="http://xviperinae.tumblr.com/LINK%20URL">CHARACTER TAG</a> </div>
  652. </div>
  653.  
  654. <!-- BIOGRAPHY/INFO SECTION -->
  655.  
  656. <p>Self trained hunter and mercenary, she took up the nickname of Viper to hide who she used to be, plus it really did fit in with how she fought. Going from place to place in search of work, or really just any kind of adventure that life had to give, enjoying what she could before it would come to an end, was basically how she worked.</p>
  657.  
  658. <p>And it helped that she really loved what she was doing as well.</p>
  659.  
  660. </div>
  661. </div>
  662. </div>
  663.  
  664. <!-- SIXTH MUSE -->
  665.  
  666. <div class="grid-item">
  667. <div class="icon"><img src="https://78.media.tumblr.com/64fdef22e560e0b4ef64b98ae5d42ecd/tumblr_inline_p1zuv5anw81u94ne3_540.gif"></div>
  668. <button class="btn">Borderlands</button>
  669. <div class="drop3">
  670.  
  671. <div id="boxtop">
  672. <div id="header">Borderlands</div><div id="subtitle">Viper, Merc/Troublemaker</div></div>
  673.  
  674. <div class="dc">
  675.  
  676. <div class="basic">
  677. <div class="info">
  678.  
  679. <!-- WRITE BASIC INFO HERE, EACH LINE BETWEEN <li></li> TAGS. -->
  680.  
  681. <li><b>origin:</b> Pandora</li>
  682. <li><b>gender:</b> Female</li>
  683. <li><b>age:</b> 25</li>
  684. </div>
  685.  
  686. <!-- LINK SECTION -->
  687.  
  688. <div class="links">
  689. <i class="fa fa-tag" aria-hidden="true"></i><a href="http://xviperinae.tumblr.com/tagged/Verse%3A-It-Is-Not-Ideal-But-It-Is-Sure-As-Hell-Home-On-This-Planet-%7BBorderlands%7D">CHARACTER TAG</a> </div>
  690. </div>
  691.  
  692. <!-- BIOGRAPHY/INFO SECTION -->
  693.  
  694. <p>She refuses to tell much about her past. Only a select few actually know about her family, fewer know about the fiance she lost. Only one old lady in a small town the whole story. Viper is a secretive person, knowing that to many details given can cause much more pain towards you in the end.</p>
  695.  
  696. <p>Moving from one place to another, causing as much trouble as she can while she goes, though at any place she can she also jumps in and does odd end jobs, hunting down things and killing people for a price.</p>
  697.  
  698. </div>
  699. </div>
  700. </div>
  701. </div>
  702.  
  703. <!-- END ROW 2 -->
  704.  
  705.  
  706. <!-- BEGIN ROW 3 -->
  707.  
  708. <!-- SEVENTH MUSE -->
  709.  
  710. <div class="one">
  711. <div class="grid-item">
  712. <div class="icon"><img src="image url here"></div>
  713. <button class="btn">MUSE NAME</button>
  714. <div class="drop">
  715.  
  716. <div id="boxtop">
  717. <div id="header">MUSE FULL NAME</div><div id="subtitle">ALIAS, NICKNAME, TITLE</div></div>
  718.  
  719. <div class="dc">
  720.  
  721. <div class="basic">
  722. <div class="info">
  723.  
  724. <!-- WRITE BASIC INFO HERE, EACH LINE BETWEEN <li></li> TAGS. -->
  725.  
  726. <li><b>origin:</b> ORIGIN</li>
  727. <li><b>gender:</b> GENDER</li>
  728. <li><b>age:</b> AGE</li>
  729. </div>
  730.  
  731. <!-- LINK SECTION -->
  732.  
  733. <div class="links">
  734. <i class="fa fa-tag" aria-hidden="true"></i><a href="LINK URL">CHARACTER TAG</a>
  735. <br>
  736. <i class="fa fa-heart" aria-hidden="true"></i><a href="LINK URL">RELATIONSHIPS</a>
  737. <br>
  738. <i class="fa fa-user" aria-hidden="true"></i><a href="LINK URL">FACE TAG</a></div>
  739. </div>
  740.  
  741. <!-- BIOGRAPHY/INFO SECTION -->
  742.  
  743. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed tincidunt turpis ligula, vel rhoncus tortor finibus in. Donec quam justo, hendrerit eget massa dapibus, dignissim vestibulum turpis. In non magna nisi. Sed consectetur leo nec consequat placerat. Duis sollicitudin lacus libero, quis viverra nunc imperdiet pulvinar. Quisque lacus ipsum, posuere eget blandit sed, pharetra at dolor. Proin metus quam, sodales a feugiat in, pulvinar non ligula. Integer in vestibulum urna. Phasellus ac enim pharetra diam egestas fermentum vel et dui.</p>
  744.  
  745. <p>Ut dapibus diam sed erat sodales, sit amet condimentum arcu facilisis. Suspendisse potenti. Aliquam imperdiet, est eu mollis viverra, ligula ex dignissim massa, nec pulvinar odio nunc eu mi. Curabitur lorem nulla, elementum at libero vel, aliquet varius est. Maecenas interdum vitae nisi sit amet mollis. Maecenas ultrices aliquam tincidunt. Fusce magna magna, efficitur eu magna id, ullamcorper scelerisque lectus. Aenean et purus eleifend, commodo turpis eu, accumsan metus.</p>
  746.  
  747. </div>
  748. </div>
  749. </div>
  750.  
  751. <!-- EIGHTH MUSE -->
  752.  
  753. <div class="grid-item">
  754. <div class="icon"><img src="image url here"></div>
  755. <button class="btn">MUSE NAME</button>
  756. <div class="drop2">
  757.  
  758. <div id="boxtop">
  759. <div id="header">MUSE FULL NAME</div><div id="subtitle">ALIAS, NICKNAME, TITLE</div></div>
  760.  
  761. <div class="dc">
  762.  
  763. <div class="basic">
  764. <div class="info">
  765.  
  766. <!-- WRITE BASIC INFO HERE, EACH LINE BETWEEN <li></li> TAGS. -->
  767.  
  768. <li><b>origin:</b> ORIGIN</li>
  769. <li><b>gender:</b> GENDER</li>
  770. <li><b>age:</b> AGE</li>
  771. </div>
  772.  
  773. <!-- LINK SECTION -->
  774.  
  775. <div class="links">
  776. <i class="fa fa-tag" aria-hidden="true"></i><a href="LINK URL">CHARACTER TAG</a>
  777. <br>
  778. <i class="fa fa-heart" aria-hidden="true"></i><a href="LINK URL">RELATIONSHIPS</a>
  779. <br>
  780. <i class="fa fa-user" aria-hidden="true"></i><a href="LINK URL">FACE TAG</a></div>
  781. </div>
  782.  
  783. <!-- BIOGRAPHY/INFO SECTION -->
  784.  
  785. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed tincidunt turpis ligula, vel rhoncus tortor finibus in. Donec quam justo, hendrerit eget massa dapibus, dignissim vestibulum turpis. In non magna nisi. Sed consectetur leo nec consequat placerat. Duis sollicitudin lacus libero, quis viverra nunc imperdiet pulvinar. Quisque lacus ipsum, posuere eget blandit sed, pharetra at dolor. Proin metus quam, sodales a feugiat in, pulvinar non ligula. Integer in vestibulum urna. Phasellus ac enim pharetra diam egestas fermentum vel et dui.</p>
  786.  
  787. <p>Ut dapibus diam sed erat sodales, sit amet condimentum arcu facilisis. Suspendisse potenti. Aliquam imperdiet, est eu mollis viverra, ligula ex dignissim massa, nec pulvinar odio nunc eu mi. Curabitur lorem nulla, elementum at libero vel, aliquet varius est. Maecenas interdum vitae nisi sit amet mollis. Maecenas ultrices aliquam tincidunt. Fusce magna magna, efficitur eu magna id, ullamcorper scelerisque lectus. Aenean et purus eleifend, commodo turpis eu, accumsan metus.</p>
  788.  
  789. </div>
  790. </div>
  791. </div>
  792.  
  793. <!-- NINTH MUSE -->
  794.  
  795. <div class="grid-item">
  796. <div class="icon"><img src="image url here"></div>
  797. <button class="btn">RIN</button>
  798. <div class="drop3">
  799.  
  800. <div id="boxtop">
  801. <div id="header">MUSE FULL NAME</div><div id="subtitle">ALIAS, NICKNAME, TITLE</div></div>
  802.  
  803. <div class="dc">
  804.  
  805. <div class="basic">
  806. <div class="info">
  807.  
  808. <!-- WRITE BASIC INFO HERE, EACH LINE BETWEEN <li></li> TAGS. -->
  809.  
  810. <li><b>origin:</b> ORIGIN</li>
  811. <li><b>gender:</b> GENDER</li>
  812. <li><b>age:</b> AGE</li>
  813. </div>
  814.  
  815. <!-- LINK SECTION -->
  816.  
  817. <div class="links">
  818. <i class="fa fa-tag" aria-hidden="true"></i><a href="LINK URL">CHARACTER TAG</a>
  819. <br>
  820. <i class="fa fa-heart" aria-hidden="true"></i><a href="LINK URL">RELATIONSHIPS</a>
  821. <br>
  822. <i class="fa fa-user" aria-hidden="true"></i><a href="LINK URL">FACE TAG</a></div>
  823. </div>
  824.  
  825. <!-- BIOGRAPHY/INFO SECTION -->
  826.  
  827. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed tincidunt turpis ligula, vel rhoncus tortor finibus in. Donec quam justo, hendrerit eget massa dapibus, dignissim vestibulum turpis. In non magna nisi. Sed consectetur leo nec consequat placerat. Duis sollicitudin lacus libero, quis viverra nunc imperdiet pulvinar. Quisque lacus ipsum, posuere eget blandit sed, pharetra at dolor. Proin metus quam, sodales a feugiat in, pulvinar non ligula. Integer in vestibulum urna. Phasellus ac enim pharetra diam egestas fermentum vel et dui.</p>
  828.  
  829. <p>Ut dapibus diam sed erat sodales, sit amet condimentum arcu facilisis. Suspendisse potenti. Aliquam imperdiet, est eu mollis viverra, ligula ex dignissim massa, nec pulvinar odio nunc eu mi. Curabitur lorem nulla, elementum at libero vel, aliquet varius est. Maecenas interdum vitae nisi sit amet mollis. Maecenas ultrices aliquam tincidunt. Fusce magna magna, efficitur eu magna id, ullamcorper scelerisque lectus. Aenean et purus eleifend, commodo turpis eu, accumsan metus.</p>
  830.  
  831. </div>
  832. </div>
  833. </div>
  834.  
  835. </div>
  836.  
  837. <!-- END ROW 3 -->
  838.  
  839. <!-- TO ADD ANOTHER ROW, COPY CONTENT FROM 'BEGIN ROW 3' TO 'END ROW 3' AND PASTE UNDERNEATH THIS LINE. -->
  840.  
  841.  
  842. </div>
  843.  
  844. <!--CREDIT -->
  845.  
  846. <div id="cred"><a href="http://www.saisei-themes.tumblr.com">ST</a></div>
  847. </body>
  848.  
  849. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!