API tools faq
paste
txrpe

GAME OF LIFE-PAGE

txrpe
Dec 26th, 2018
215
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 41.93 KB | None | 0 0
raw download clone embed print report
  1. <!-- PAGE 01 - GAME OF LIFE by hcpebred. Please do not claim as your own. Please do not remove the credit. -->
  2.  
  3.  
  4. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  5. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  6.  
  7. <head>
  8.  
  9. <link href="https://fonts.googleapis.com/css?family=Quicksand" rel="stylesheet">
  10.  
  11.  
  12. <title>{Title}</title>
  13.  
  14. <link rel="shortcut icon" href="{Favicon}">
  15. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  16. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  17.  
  18. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
  19.  
  20. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
  21.  
  22. <script src="https://npmcdn.com/[email protected]/dist/isotope.pkgd.min.js"></script>
  23.  
  24. <script src="https://use.fontawesome.com/257106a2c1.js"></script>
  25.  
  26. <script>
  27. $(document).ready(function() {
  28. var $container = $('.grid').isotope({
  29. itemSelector: '.grid-item',
  30. masonry: {
  31. columnWidth: 100
  32. }
  33. });
  34.  
  35. $('.btn').click(function () {
  36. $(this) // wrap this, it always refers to the clicked event element
  37. .parents('.grid-item')// find parent grid item
  38. .find('.drop, .drop2, .drop3') // find adjacent drop
  39. .toggle('slow'); // only toggle that one element
  40.  
  41. });
  42.  
  43. $('.btn').click(function () {
  44. $(this)
  45. .parents('.one')
  46. .find('.grid-item')
  47. .toggleClass('fullsize');
  48. $container.isotope('layout');
  49. });
  50.  
  51. });
  52. </script>
  53.  
  54. <style type="text/css">
  55.  
  56. /* CUSTOM FONT */
  57.  
  58. @font-face { font-family: "silkscreen"; src: url('https://dl.dropboxusercontent.com/s/4bj79wi75v77m0r/slkscr.ttf?dl=1'); format(“truetype”);}
  59.  
  60. @font-face { font-family: "bebas_neue"; src: url('https://dl.dropboxusercontent.com/s/scbj3da4dz3dfmf/bebasneue.otf?dl=1'); format(“truetype”);}
  61.  
  62. ::-webkit-scrollbar{ width: 5px; }
  63.  
  64. ::-webkit-scrollbar-thumb{ background-color: #dbdbdb;}
  65.  
  66. ::-webkit-scrollbar-track { background-color: #f6f6f6;}
  67.  
  68.  
  69. /* TEXT STUFF */
  70.  
  71. h1, h2 {
  72. font-size: 25px;
  73. font-family: 'bebas_neue';
  74. }
  75.  
  76. a {
  77. text-decoration: none;
  78. color: #b1b1b1;
  79. -webkit-transition: all .8s ease-in-out;
  80. -moz-transition: all .8s ease-in-out;
  81. -o-transition: all .8s ease-in-out;
  82. transition: all .8s ease-in-out;
  83. font-style: bold;
  84. }
  85.  
  86. a:hover {
  87. color: #d1d1d1;
  88. -webkit-transition: all .8s ease-in-out;
  89. -moz-transition: all .8s ease-in-out;
  90. -o-transition: all .8s ease-in-out;
  91. transition: all .8s ease-in-out;
  92. }
  93.  
  94. b, strong {
  95. color: #3f3f3f;
  96. }
  97.  
  98. i, em {
  99. color: #a4a4a4;
  100. }
  101.  
  102. /* BODY */
  103.  
  104. body {
  105. background: url('http://i.imgur.com/fzhm3tM.png');
  106. margin: 0px;
  107. padding: 0px;
  108. color: #707070;
  109. font-family: silkscreen;
  110. font-size: 11px;
  111. overflow-y: scroll;
  112. overflow-x: hidden;
  113. font-size: 12px;
  114. -webkit-font-smoothing:antialiased;
  115. }
  116.  
  117. /* PROFILE SECTIONS */
  118.  
  119. #breath {
  120. margin-top: 5%;
  121. width: 600px;
  122. margin-left: 30%;
  123. }
  124.  
  125. #skeleton {
  126. width: 900px;
  127. height: 400px;
  128. display: block;
  129. margin-bottom: 100px;
  130. }
  131.  
  132. /* CHARACTER PICTURES */
  133.  
  134. #portrait {
  135. height:400px;
  136. float: left;
  137. position: relative;
  138. background-color: #fff;
  139. padding: 10px;
  140. border: 1px solid #dbdbdb;
  141. width: 200px;
  142. }
  143.  
  144. /* CHARACTER NAMES.
  145.  
  146. EACH SUCCESSIVE SECTION REPRESENTS A NEW CHARACTER. NAME IS CHARA ONE, NAME2 IS CHARA TWO, AND SO ON. THIS ALLOWS YOU TO CHOOSE DIFFERENT COLORS FOR YOUR NAME CARDS. IF YOUR CHARACTER'S NAME IS TOO LONG FOR THE BANNER, DECREASE THE FONT SIZE IN THE RESPECTIVE SECTION.
  147.  
  148. IF YOU HAVE MORE THAN TEN MUSES AND WISH TO USE A DIFFERENT COLOR FOR THEM, COPY AND PASTE THE LAST NAME## SECTION (NAME10) BELOW IT AND CHANGE THE BACKGROUND COLOR PROPERTY. */
  149.  
  150. #name {
  151. font-size: 30px;
  152. text-transform: uppercase;
  153. font-family: 'bebas_neue';
  154. position: relative;
  155. margin-top: -90px;
  156. margin-left: -20px;
  157. width: 200px;
  158. background-color: #cc4040;
  159. letter-spacing: 3px;
  160. color: white;
  161. padding: 5px 10px 0px 10px;
  162. height: 40px;
  163. text-shadow: 0px 1px 1px #404040;
  164. }
  165.  
  166. #name2 {
  167. font-size: 28px;
  168. text-transform: uppercase;
  169. font-family: 'bebas_neue';
  170. position: relative;
  171. margin-top: -90px;
  172. margin-left: -20px;
  173. width: 200px;
  174. background-color: #59cdb9;
  175. letter-spacing: 3px;
  176. color: white;
  177. padding: 5px 10px 0px 10px;
  178. height: 40px;
  179. text-shadow: 0px 1px 1px #404040;
  180. }
  181.  
  182. #name3 {
  183. font-size: 28px;
  184. text-transform: uppercase;
  185. font-family: 'bebas_neue';
  186. position: relative;
  187. margin-top: -90px;
  188. margin-left: -20px;
  189. width: 200px;
  190. background-color: #99bbdd;
  191. letter-spacing: 3px;
  192. color: white;
  193. padding: 5px 10px 0px 10px;
  194. height: 40px;
  195. text-shadow: 0px 1px 1px #404040;
  196. }
  197.  
  198. #name4 {
  199. font-size: 25px;
  200. text-transform: uppercase;
  201. font-family: 'bebas_neue';
  202. position: relative;
  203. margin-top: -90px;
  204. margin-left: -20px;
  205. width: 200px;
  206. background-color: #c999dd;
  207. letter-spacing: 3px;
  208. color: white;
  209. padding: 5px 10px 0px 10px;
  210. height: 40px;
  211. text-shadow: 0px 1px 1px #404040;
  212. }
  213.  
  214. #name5 {
  215. font-size: 28px;
  216. text-transform: uppercase;
  217. font-family: 'bebas_neue';
  218. position: relative;
  219. margin-top: -90px;
  220. margin-left: -20px;
  221. width: 200px;
  222. background-color: #dc0101;
  223. letter-spacing: 3px;
  224. color: white;
  225. padding: 5px 10px 0px 10px;
  226. height: 40px;
  227. text-shadow: 0px 1px 1px #404040;
  228. }
  229.  
  230. #name6 {
  231. font-size: 28px;
  232. text-transform: uppercase;
  233. font-family: 'bebas_neue';
  234. position: relative;
  235. margin-top: -90px;
  236. margin-left: -20px;
  237. width: 200px;
  238. background-color: #5cb64d;
  239. letter-spacing: 3px;
  240. color: white;
  241. padding: 5px 10px 0px 10px;
  242. height: 40px;
  243. text-shadow: 0px 1px 1px #404040;
  244. }
  245.  
  246. #name7 {
  247. font-size: 28px;
  248. text-transform: uppercase;
  249. font-family: 'bebas_neue';
  250. position: relative;
  251. margin-top: -90px;
  252. margin-left: -20px;
  253. width: 200px;
  254. background-color: #000;
  255. letter-spacing: 3px;
  256. color: white;
  257. padding: 5px 10px 0px 10px;
  258. height: 40px;
  259. text-shadow: 0px 1px 1px #404040;
  260. }
  261.  
  262. #name8 {
  263. font-size: 28px;
  264. text-transform: uppercase;
  265. font-family: 'bebas_neue';
  266. position: relative;
  267. margin-top: -90px;
  268. margin-left: -20px;
  269. width: 200px;
  270. background-color: #43c2e2;
  271. letter-spacing: 3px;
  272. color: white;
  273. padding: 5px 10px 0px 10px;
  274. height: 40px;
  275. text-shadow: 0px 1px 1px #404040;
  276. }
  277.  
  278. #name9 {
  279. font-size: 28px;
  280. text-transform: uppercase;
  281. font-family: 'bebas_neue';
  282. position: relative;
  283. margin-top: -90px;
  284. margin-left: -20px;
  285. width: 200px;
  286. background-color: #fda1ae;
  287. letter-spacing: 3px;
  288. color: white;
  289. padding: 5px 10px 0px 10px;
  290. height: 40px;
  291. text-shadow: 0px 1px 1px #404040;
  292. }
  293.  
  294. #name10 {
  295. font-size: 28px;
  296. text-transform: uppercase;
  297. font-family: 'bebas_neue';
  298. position: relative;
  299. margin-top: -90px;
  300. margin-left: -20px;
  301. width: 200px;
  302. background-color: #c081bb;
  303. letter-spacing: 3px;
  304. color: white;
  305. padding: 5px 10px 0px 10px;
  306. height: 40px;
  307. text-shadow: 0px 1px 1px #404040;
  308. }
  309.  
  310. /* SUBTITLE. ADD A VERY SHORT CHARACTER QUOTE IF YOU CHOOSE TO. */
  311.  
  312. #subtitle {
  313. font-size: 10px;
  314. text-transform: uppercase;
  315. font-family: 'silkscreen';
  316. position: relative;
  317. margin-left: 3px;
  318. width: 190px;
  319. background-color: transparent;
  320. letter-spacing: 1px;
  321. color: white;
  322. text-shadow:
  323. -1px -1px 0 #000,
  324. 1px -1px 0 #000,
  325. -1px 1px 0 #000,
  326. 1px 1px 0 #000;
  327. text-align: center;
  328. margin-top: 5px;
  329. }
  330.  
  331. /* INFO BOXES */
  332.  
  333. #tabspace {
  334. margin-left: 230px;
  335. width: 600px;
  336. position: relative;
  337. }
  338.  
  339. /* INFO BOXES PART TWO.
  340. AGAIN, IF YOU HAVE MORE THAN TEN CHARACTERS AND WISH TO USE A DIFFERENT COLOR FOR THEM, COPY AND PASTE THE LAST TAB SECTION (TAB10) BELOW IT AND CHANGE THE BACKGROUND COLOR PROPERTY. DO THIS FOR EACH SUCCESSIVE NEW CHARACTER AND COLOR - TAB11, TAB12, TAB13, SO ON AND SO FORTH */
  341.  
  342. #tab1 {
  343. display: inline-block;
  344. width: 150px;
  345. padding: 5px;
  346. background-color: #cc4040;
  347. color: #fff;
  348. font-size: 10px;
  349. font-family: 'silkscreen';
  350. position: relative;
  351. margin-right: 10px;
  352. margin-bottom:10px;
  353. text-align: center;
  354. text-shadow: 0px 1px 1px #404040;
  355. }
  356.  
  357. #tab2 {
  358. display: inline-block;
  359. width: 150px;
  360. padding: 5px;
  361. background-color: #59cdb9;
  362. color: #fff;
  363. font-size: 10px;
  364. font-family: 'silkscreen';
  365. position: relative;
  366. margin-right: 10px;
  367. margin-bottom:10px;
  368. text-align: center;
  369. text-shadow: 0px 1px 1px #1a1a1a;
  370. }
  371.  
  372. #tab3 {
  373. display: inline-block;
  374. width: 150px;
  375. padding: 5px;
  376. background-color: #99bbdd;
  377. color: #fff;
  378. font-size: 10px;
  379. font-family: 'silkscreen';
  380. position: relative;
  381. margin-right: 10px;
  382. margin-bottom:10px;
  383. text-align: center;
  384. text-shadow: 0px 1px 1px #1a1a1a;
  385. }
  386.  
  387. /* FOR LONG MORAL ALIGNMENTS THAT DON'T FIT IN THE BOX, USE THE BELOW SECTION AS AN EXAMPLE TO FIT IN THE INFORMATION. MAKE SURE TO CHANGE THE NUMBER THAT CORRESPONDS TO YOUR CHARACTER! */
  388.  
  389. #tab3s {
  390. display: inline-block;
  391. width: 150px;
  392. padding: 5px;
  393. background-color: #99bbdd;
  394. color: #fff;
  395. font-size: 8px;
  396. font-family: 'silkscreen';
  397. position: relative;
  398. margin-right: 10px;
  399. margin-bottom:8px;
  400. text-align: center;
  401. text-shadow: 0px 1px 1px #1a1a1a;
  402. height: 10px;
  403. top: -2px;
  404. }
  405.  
  406. #tab4 {
  407. display: inline-block;
  408. width: 150px;
  409. padding: 5px;
  410. background-color: #c999dd;
  411. color: #fff;
  412. font-size: 10px;
  413. font-family: 'silkscreen';
  414. position: relative;
  415. margin-right: 10px;
  416. margin-bottom:10px;
  417. text-align: center;
  418. text-shadow: 0px 1px 1px #1a1a1a;
  419. }
  420.  
  421. #tab5 {
  422. display: inline-block;
  423. width: 150px;
  424. padding: 5px;
  425. background-color: #dc0101;
  426. color: #fff;
  427. font-size: 10px;
  428. font-family: 'silkscreen';
  429. position: relative;
  430. margin-right: 10px;
  431. margin-bottom:10px;
  432. text-align: center;
  433. text-shadow: 0px 1px 1px #1a1a1a;
  434. }
  435.  
  436. #tab6 {
  437. display: inline-block;
  438. width: 150px;
  439. padding: 5px;
  440. background-color: #5cb64d;
  441. color: #fff;
  442. font-size: 10px;
  443. font-family: 'silkscreen';
  444. position: relative;
  445. margin-right: 10px;
  446. margin-bottom:10px;
  447. text-align: center;
  448. text-shadow: 0px 1px 1px #1a1a1a;
  449. }
  450.  
  451. #tab7 {
  452. display: inline-block;
  453. width: 150px;
  454. padding: 5px;
  455. background-color: #000;
  456. color: #fff;
  457. font-size: 10px;
  458. font-family: 'silkscreen';
  459. position: relative;
  460. margin-right: 10px;
  461. margin-bottom:10px;
  462. text-align: center;
  463. text-shadow: 0px 1px 1px #1a1a1a;
  464. }
  465.  
  466. #tab8 {
  467. display: inline-block;
  468. width: 150px;
  469. padding: 5px;
  470. background-color: #43c2e2;
  471. color: #fff;
  472. font-size: 10px;
  473. font-family: 'silkscreen';
  474. position: relative;
  475. margin-right: 10px;
  476. margin-bottom:10px;
  477. text-align: center;
  478. text-shadow: 0px 1px 1px #1a1a1a;
  479. }
  480.  
  481. #tab9 {
  482. display: inline-block;
  483. width: 150px;
  484. padding: 5px;
  485. background-color: #fda1ae;
  486. color: #fff;
  487. font-size: 10px;
  488. font-family: 'silkscreen';
  489. position: relative;
  490. margin-right: 10px;
  491. margin-bottom:10px;
  492. text-align: center;
  493. text-shadow: 0px 1px 1px #1a1a1a;
  494. }
  495.  
  496. #tab9s {
  497. display: inline-block;
  498. width: 150px;
  499. padding: 5px;
  500. background-color: #fda1ae;
  501. color: #fff;
  502. font-size: 8px;
  503. font-family: 'silkscreen';
  504. position: relative;
  505. margin-right: 10px;
  506. margin-bottom:8px;
  507. text-align: center;
  508. text-shadow: 0px 1px 1px #1a1a1a;
  509. height: 10px;
  510. top: -2px;
  511. }
  512.  
  513. #tab10 {
  514. display: inline-block;
  515. width: 150px;
  516. padding: 5px;
  517. background-color: #c081bb;
  518. color: #fff;
  519. font-size: 10px;
  520. font-family: 'silkscreen';
  521. position: relative;
  522. margin-right: 10px;
  523. margin-bottom:10px;
  524. text-align: center;
  525. text-shadow: 0px 1px 1px #1a1a1a;
  526. }
  527.  
  528. #bio {
  529. margin-left: 230px;
  530. width: 510px;
  531. position: relative;
  532. background-color: #fff;
  533. border: 1px solid #dbdbdb;
  534. height: 330px;
  535. }
  536.  
  537. /* BIOGRAPHY TITLE CARDS. FOLLOW THE STEPS FOR PREVIOUS SECTIONS FOR EACH NEW CHARACTER AND COLOR. */
  538.  
  539. #title {
  540. padding: 5px 10px 3px 10px;
  541. font-size: 30px;
  542. text-transform: uppercase;
  543. font-family: 'bebas_neue';
  544. position: relative;
  545. width: 490px;
  546. background-color: #cc4040;
  547. letter-spacing: 3px;
  548. color: white;
  549. text-shadow: 0px 1px 1px #404040;
  550. }
  551.  
  552. #title2 {
  553. background-color: #59cdb9;
  554. padding: 5px 10px 3px 10px;
  555. font-size: 30px;
  556. text-transform: uppercase;
  557. font-family: 'bebas_neue';
  558. position: relative;
  559. width: 490px;
  560. letter-spacing: 3px;
  561. color: white;
  562. text-shadow: 0px 1px 1px #404040;
  563. }
  564.  
  565. #title3 {
  566. background-color: #99bbdd;
  567. padding: 5px 10px 3px 10px;
  568. font-size: 30px;
  569. text-transform: uppercase;
  570. font-family: 'bebas_neue';
  571. position: relative;
  572. width: 490px;
  573. letter-spacing: 3px;
  574. color: white;
  575. text-shadow: 0px 1px 1px #404040;
  576. }
  577.  
  578. #title4 {
  579. background-color: #c999dd;
  580. padding: 5px 10px 3px 10px;
  581. font-size: 30px;
  582. text-transform: uppercase;
  583. font-family: 'bebas_neue';
  584. position: relative;
  585. width: 490px;
  586. letter-spacing: 3px;
  587. color: white;
  588. text-shadow: 0px 1px 1px #404040;
  589. }
  590.  
  591. #title5 {
  592. background-color: #dc0101;
  593. padding: 5px 10px 3px 10px;
  594. font-size: 30px;
  595. text-transform: uppercase;
  596. font-family: 'bebas_neue';
  597. position: relative;
  598. width: 490px;
  599. letter-spacing: 3px;
  600. color: white;
  601. text-shadow: 0px 1px 1px #404040;
  602. }
  603.  
  604. #title6 {
  605. background-color: #5cb64d;
  606. padding: 5px 10px 3px 10px;
  607. font-size: 30px;
  608. text-transform: uppercase;
  609. font-family: 'bebas_neue';
  610. position: relative;
  611. width: 490px;
  612. letter-spacing: 3px;
  613. color: white;
  614. text-shadow: 0px 1px 1px #404040;
  615. }
  616.  
  617. #title7 {
  618. background-color: #000;
  619. padding: 5px 10px 3px 10px;
  620. font-size: 30px;
  621. text-transform: uppercase;
  622. font-family: 'bebas_neue';
  623. position: relative;
  624. width: 490px;
  625. letter-spacing: 3px;
  626. color: white;
  627. text-shadow: 0px 1px 1px #404040;
  628. }
  629.  
  630. #title8 {
  631. background-color: #43c2e2;
  632. padding: 5px 10px 3px 10px;
  633. font-size: 30px;
  634. text-transform: uppercase;
  635. font-family: 'bebas_neue';
  636. position: relative;
  637. width: 490px;
  638. letter-spacing: 3px;
  639. color: white;
  640. text-shadow: 0px 1px 1px #404040;
  641. }
  642.  
  643. #title9 {
  644. background-color: #fda1ae;
  645. padding: 5px 10px 3px 10px;
  646. font-size: 30px;
  647. text-transform: uppercase;
  648. font-family: 'bebas_neue';
  649. position: relative;
  650. width: 490px;
  651. letter-spacing: 3px;
  652. color: white;
  653. text-shadow: 0px 1px 1px #404040;
  654. }
  655.  
  656. #title10 {
  657. background-color: #c081bb;
  658. padding: 5px 10px 3px 10px;
  659. font-size: 30px;
  660. text-transform: uppercase;
  661. font-family: 'bebas_neue';
  662. position: relative;
  663. width: 490px;
  664. letter-spacing: 3px;
  665. color: white;
  666. text-shadow: 0px 1px 1px #404040;
  667. }
  668.  
  669. #biot {
  670. height: 265px;
  671. overflow-y: scroll;
  672. overflow-x: hidden;
  673. font-size: 10px;
  674. width: 480px;
  675. margin: 10px;
  676. padding-right: 10px;
  677. letter-spacing: .5px;
  678. line-height: 17px;
  679. }
  680.  
  681. #topper {
  682. background-color: #fff;
  683. padding: 20px;
  684. font-family: 'bebas_neue';
  685. font-size: 40px;
  686. text-align: center;
  687. letter-spacing: 2px;
  688. color: #707070;
  689. border-bottom: 1px solid #dbdbdb;
  690. }
  691.  
  692. #credit {
  693. font-family: 'silkscreen';
  694. font-size: 10px;
  695. color: #000 !important;
  696. position: relative;
  697. height: 10px;
  698. width: 50px;
  699. float:bottom;
  700. top: 97%;
  701. right: -5px;
  702. position: fixed;
  703.  
  704. }
  705.  
  706. </style></head>
  707.  
  708. <body>
  709.  
  710. <div id="topper">MUSE SELECTION</div>
  711. <div id="breath">
  712.  
  713.  
  714. <div id="skeleton">
  715.  
  716. <div id="portrait"><img src="https://i.imgur.com/E3HmWAe.png">
  717. <div id="name">NAME</div>
  718. <div id="subtitle">SUBTITLE</div>
  719. </div>
  720.  
  721. <div id="tabspace">
  722. <div id="tab1">FANDOM:</div>
  723. <div id="tab1">SPECIES:</div>
  724. <div id="tab1">AGE:</div>
  725. <div id="tab1">GENDER:</div>
  726. <div id="tab1">HAIR:</div>
  727. <div id="tab1">EYES:</div>
  728. <div id="tab1">ORIENTATION:</div>
  729. <div id="tab1">OCCUPATION:</div>
  730. <div id="tab1">ALIGNMENT:</div>
  731. </div>
  732.  
  733. <div id="bio">
  734. <div id="title">BIOGRAPHY</div>
  735.  
  736. <div id="biot">
  737. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et varius lacus, quis luctus massa. Cras maximus ante a nisi ullamcorper aliquet. Aliquam quis pharetra turpis. Quisque eleifend erat quis magna posuere aliquet. Aliquam vehicula varius turpis. Morbi at risus eget eros tempus laoreet et a nulla. Nullam sit amet turpis varius, faucibus massa sit amet, consectetur velit. Mauris vulputate sit amet nibh at feugiat. Sed ante nisi, porta eget facilisis ut, euismod vel nisi. Vivamus gravida mauris vehicula est pharetra dapibus. Aenean molestie, metus quis rhoncus varius, ex justo tincidunt enim, a rutrum velit magna eget sem. Nullam arcu ex, iaculis sed enim id, tempor consectetur sapien. Vivamus id nisi gravida, tempus justo in, consectetur purus.
  738.  
  739. Curabitur pellentesque eros vel velit blandit pulvinar. Sed aliquam, erat sit amet tincidunt suscipit, velit ligula sagittis odio, quis ultrices velit quam a nisi. Suspendisse mattis nisi in porttitor faucibus. Nullam consequat pellentesque risus eget luctus. Donec fringilla risus et ipsum volutpat tempor. Praesent nec libero metus. Pellentesque hendrerit erat hendrerit faucibus condimentum. Suspendisse dictum, tellus ac feugiat pulvinar, ligula libero suscipit nisl, et consequat risus massa quis risus. Cras neque nibh, tempus a scelerisque ac, lobortis a ex. Proin bibendum lectus at mi sollicitudin imperdiet. Nunc vitae nunc urna. Aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pretium tempus massa quis molestie. Cras condimentum ligula sit amet lacus hendrerit dictum.
  740.  
  741. Integer risus est, scelerisque quis magna sit amet, malesuada imperdiet leo. Integer lobortis lacus eu dapibus tempor. Aliquam vestibulum commodo euismod. Duis eu pretium turpis. Nulla gravida posuere convallis. Morbi suscipit velit urna, nec imperdiet nisl lacinia lobortis. Suspendisse consectetur laoreet facilisis. Etiam porta auctor nibh, sed dictum tellus facilisis ac. Aliquam lacinia laoreet elit sit amet tincidunt. Aliquam nec nisi diam. Suspendisse faucibus pharetra tincidunt. Nullam augue quam, elementum eget urna ac, lobortis tempus tortor. Cras aliquam ac ante at euismod. Phasellus eu massa sit amet est porta venenatis.</div></div>
  742.  
  743. </div>
  744.  
  745. <div id="skeleton">
  746.  
  747. <div id="portrait"><img src="https://i.imgur.com/9CEev5L.png">
  748. <div id="name2">NAME</div>
  749. <div id="subtitle">SUBTITLE</div>
  750. </div>
  751.  
  752. <div id="tabspace">
  753. <div id="tab2">FANDOM:</div>
  754. <div id="tab2">SPECIES:</div>
  755. <div id="tab2">AGE:</div>
  756. <div id="tab2">GENDER:</div>
  757. <div id="tab2">HAIR:</div>
  758. <div id="tab2">EYES:</div>
  759. <div id="tab2">ORIENTATION:</div>
  760. <div id="tab2">OCCUPATION:</div>
  761. <div id="tab2">ALIGNMENT:</div>
  762. </div>
  763.  
  764. <div id="bio">
  765. <div id="title2">BIOGRAPHY</div>
  766.  
  767. <div id="biot">
  768. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et varius lacus, quis luctus massa. Cras maximus ante a nisi ullamcorper aliquet. Aliquam quis pharetra turpis. Quisque eleifend erat quis magna posuere aliquet. Aliquam vehicula varius turpis. Morbi at risus eget eros tempus laoreet et a nulla. Nullam sit amet turpis varius, faucibus massa sit amet, consectetur velit. Mauris vulputate sit amet nibh at feugiat. Sed ante nisi, porta eget facilisis ut, euismod vel nisi. Vivamus gravida mauris vehicula est pharetra dapibus. Aenean molestie, metus quis rhoncus varius, ex justo tincidunt enim, a rutrum velit magna eget sem. Nullam arcu ex, iaculis sed enim id, tempor consectetur sapien. Vivamus id nisi gravida, tempus justo in, consectetur purus.
  769.  
  770. Curabitur pellentesque eros vel velit blandit pulvinar. Sed aliquam, erat sit amet tincidunt suscipit, velit ligula sagittis odio, quis ultrices velit quam a nisi. Suspendisse mattis nisi in porttitor faucibus. Nullam consequat pellentesque risus eget luctus. Donec fringilla risus et ipsum volutpat tempor. Praesent nec libero metus. Pellentesque hendrerit erat hendrerit faucibus condimentum. Suspendisse dictum, tellus ac feugiat pulvinar, ligula libero suscipit nisl, et consequat risus massa quis risus. Cras neque nibh, tempus a scelerisque ac, lobortis a ex. Proin bibendum lectus at mi sollicitudin imperdiet. Nunc vitae nunc urna. Aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pretium tempus massa quis molestie. Cras condimentum ligula sit amet lacus hendrerit dictum.
  771.  
  772. Integer risus est, scelerisque quis magna sit amet, malesuada imperdiet leo. Integer lobortis lacus eu dapibus tempor. Aliquam vestibulum commodo euismod. Duis eu pretium turpis. Nulla gravida posuere convallis. Morbi suscipit velit urna, nec imperdiet nisl lacinia lobortis. Suspendisse consectetur laoreet facilisis. Etiam porta auctor nibh, sed dictum tellus facilisis ac. Aliquam lacinia laoreet elit sit amet tincidunt. Aliquam nec nisi diam. Suspendisse faucibus pharetra tincidunt. Nullam augue quam, elementum eget urna ac, lobortis tempus tortor. Cras aliquam ac ante at euismod. Phasellus eu massa sit amet est porta venenatis.<br><br>
  773. </div></div>
  774.  
  775. </div>
  776.  
  777. <div id="skeleton">
  778.  
  779. <div id="portrait"><img src="https://i.imgur.com/fe2dugH.png">
  780. <div id="name3">NAME</div>
  781. <div id="subtitle">SUBTITLE</div>
  782. </div>
  783.  
  784. <div id="tabspace">
  785. <div id="tab3">FANDOM:</div>
  786. <div id="tab3">SPECIES:</div>
  787. <div id="tab3">AGE:</div>
  788. <div id="tab3">GENDER:</div>
  789. <div id="tab3">HAIR:</div>
  790. <div id="tab3">EYES:</div>
  791. <div id="tab3">ORIENTATION:</div>
  792. <div id="tab3">OCCUPATION:</div>
  793. <div id="tab3s">ALIGNMENT:</div>
  794. </div>
  795.  
  796. <div id="bio">
  797. <div id="title3">BIOGRAPHY</div>
  798.  
  799. <div id="biot">
  800. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et varius lacus, quis luctus massa. Cras maximus ante a nisi ullamcorper aliquet. Aliquam quis pharetra turpis. Quisque eleifend erat quis magna posuere aliquet. Aliquam vehicula varius turpis. Morbi at risus eget eros tempus laoreet et a nulla. Nullam sit amet turpis varius, faucibus massa sit amet, consectetur velit. Mauris vulputate sit amet nibh at feugiat. Sed ante nisi, porta eget facilisis ut, euismod vel nisi. Vivamus gravida mauris vehicula est pharetra dapibus. Aenean molestie, metus quis rhoncus varius, ex justo tincidunt enim, a rutrum velit magna eget sem. Nullam arcu ex, iaculis sed enim id, tempor consectetur sapien. Vivamus id nisi gravida, tempus justo in, consectetur purus.
  801.  
  802. Curabitur pellentesque eros vel velit blandit pulvinar. Sed aliquam, erat sit amet tincidunt suscipit, velit ligula sagittis odio, quis ultrices velit quam a nisi. Suspendisse mattis nisi in porttitor faucibus. Nullam consequat pellentesque risus eget luctus. Donec fringilla risus et ipsum volutpat tempor. Praesent nec libero metus. Pellentesque hendrerit erat hendrerit faucibus condimentum. Suspendisse dictum, tellus ac feugiat pulvinar, ligula libero suscipit nisl, et consequat risus massa quis risus. Cras neque nibh, tempus a scelerisque ac, lobortis a ex. Proin bibendum lectus at mi sollicitudin imperdiet. Nunc vitae nunc urna. Aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pretium tempus massa quis molestie. Cras condimentum ligula sit amet lacus hendrerit dictum.
  803.  
  804. Integer risus est, scelerisque quis magna sit amet, malesuada imperdiet leo. Integer lobortis lacus eu dapibus tempor. Aliquam vestibulum commodo euismod. Duis eu pretium turpis. Nulla gravida posuere convallis. Morbi suscipit velit urna, nec imperdiet nisl lacinia lobortis. Suspendisse consectetur laoreet facilisis. Etiam porta auctor nibh, sed dictum tellus facilisis ac. Aliquam lacinia laoreet elit sit amet tincidunt. Aliquam nec nisi diam. Suspendisse faucibus pharetra tincidunt. Nullam augue quam, elementum eget urna ac, lobortis tempus tortor. Cras aliquam ac ante at euismod. Phasellus eu massa sit amet est porta venenatis.</div></div>
  805.  
  806. </div>
  807.  
  808. <div id="skeleton">
  809.  
  810. <div id="portrait"><img src="https://i.imgur.com/z0i75c2.png">
  811. <div id="name4">NAME</div>
  812. <div id="subtitle">SUBTITLE</div>
  813. </div>
  814.  
  815. <div id="tabspace">
  816. <div id="tab4">FANDOM:</div>
  817. <div id="tab4">SPECIES:</div>
  818. <div id="tab4">AGE:</div>
  819. <div id="tab4">GENDER:</div>
  820. <div id="tab4">HAIR:</div>
  821. <div id="tab4">EYES:</div>
  822. <div id="tab4">ORIENTATION:</div>
  823. <div id="tab4">OCCUPATION:</div>
  824. <div id="tab4">ALIGNMENT:</div>
  825. </div>
  826.  
  827. <div id="bio">
  828. <div id="title4">BIOGRAPHY</div>
  829.  
  830. <div id="biot">
  831. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et varius lacus, quis luctus massa. Cras maximus ante a nisi ullamcorper aliquet. Aliquam quis pharetra turpis. Quisque eleifend erat quis magna posuere aliquet. Aliquam vehicula varius turpis. Morbi at risus eget eros tempus laoreet et a nulla. Nullam sit amet turpis varius, faucibus massa sit amet, consectetur velit. Mauris vulputate sit amet nibh at feugiat. Sed ante nisi, porta eget facilisis ut, euismod vel nisi. Vivamus gravida mauris vehicula est pharetra dapibus. Aenean molestie, metus quis rhoncus varius, ex justo tincidunt enim, a rutrum velit magna eget sem. Nullam arcu ex, iaculis sed enim id, tempor consectetur sapien. Vivamus id nisi gravida, tempus justo in, consectetur purus.
  832.  
  833. Curabitur pellentesque eros vel velit blandit pulvinar. Sed aliquam, erat sit amet tincidunt suscipit, velit ligula sagittis odio, quis ultrices velit quam a nisi. Suspendisse mattis nisi in porttitor faucibus. Nullam consequat pellentesque risus eget luctus. Donec fringilla risus et ipsum volutpat tempor. Praesent nec libero metus. Pellentesque hendrerit erat hendrerit faucibus condimentum. Suspendisse dictum, tellus ac feugiat pulvinar, ligula libero suscipit nisl, et consequat risus massa quis risus. Cras neque nibh, tempus a scelerisque ac, lobortis a ex. Proin bibendum lectus at mi sollicitudin imperdiet. Nunc vitae nunc urna. Aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pretium tempus massa quis molestie. Cras condimentum ligula sit amet lacus hendrerit dictum.
  834.  
  835. Integer risus est, scelerisque quis magna sit amet, malesuada imperdiet leo. Integer lobortis lacus eu dapibus tempor. Aliquam vestibulum commodo euismod. Duis eu pretium turpis. Nulla gravida posuere convallis. Morbi suscipit velit urna, nec imperdiet nisl lacinia lobortis. Suspendisse consectetur laoreet facilisis. Etiam porta auctor nibh, sed dictum tellus facilisis ac. Aliquam lacinia laoreet elit sit amet tincidunt. Aliquam nec nisi diam. Suspendisse faucibus pharetra tincidunt. Nullam augue quam, elementum eget urna ac, lobortis tempus tortor. Cras aliquam ac ante at euismod. Phasellus eu massa sit amet est porta venenatis.</div></div>
  836.  
  837. </div>
  838.  
  839. <div id="skeleton">
  840.  
  841. <div id="portrait"><img src="https://i.imgur.com/gYlf4hG.png">
  842. <div id="name5">NAME</div>
  843. <div id="subtitle">SUBTITLE</div>
  844. </div>
  845.  
  846. <div id="tabspace">
  847. <div id="tab5">FANDOM:</div>
  848. <div id="tab5">SPECIES:</div>
  849. <div id="tab5">AGE:</div>
  850. <div id="tab5">GENDER:</div>
  851. <div id="tab5">HAIR:</div>
  852. <div id="tab5">EYES:</div>
  853. <div id="tab5">ORIENTATION:</div>
  854. <div id="tab5">OCCUPATION:</div>
  855. <div id="tab5">ALIGNMENT:</div>
  856. </div>
  857.  
  858. <div id="bio">
  859. <div id="title5">BIOGRAPHY</div>
  860.  
  861. <div id="biot">
  862. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et varius lacus, quis luctus massa. Cras maximus ante a nisi ullamcorper aliquet. Aliquam quis pharetra turpis. Quisque eleifend erat quis magna posuere aliquet. Aliquam vehicula varius turpis. Morbi at risus eget eros tempus laoreet et a nulla. Nullam sit amet turpis varius, faucibus massa sit amet, consectetur velit. Mauris vulputate sit amet nibh at feugiat. Sed ante nisi, porta eget facilisis ut, euismod vel nisi. Vivamus gravida mauris vehicula est pharetra dapibus. Aenean molestie, metus quis rhoncus varius, ex justo tincidunt enim, a rutrum velit magna eget sem. Nullam arcu ex, iaculis sed enim id, tempor consectetur sapien. Vivamus id nisi gravida, tempus justo in, consectetur purus.
  863.  
  864. Curabitur pellentesque eros vel velit blandit pulvinar. Sed aliquam, erat sit amet tincidunt suscipit, velit ligula sagittis odio, quis ultrices velit quam a nisi. Suspendisse mattis nisi in porttitor faucibus. Nullam consequat pellentesque risus eget luctus. Donec fringilla risus et ipsum volutpat tempor. Praesent nec libero metus. Pellentesque hendrerit erat hendrerit faucibus condimentum. Suspendisse dictum, tellus ac feugiat pulvinar, ligula libero suscipit nisl, et consequat risus massa quis risus. Cras neque nibh, tempus a scelerisque ac, lobortis a ex. Proin bibendum lectus at mi sollicitudin imperdiet. Nunc vitae nunc urna. Aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pretium tempus massa quis molestie. Cras condimentum ligula sit amet lacus hendrerit dictum.
  865.  
  866. Integer risus est, scelerisque quis magna sit amet, malesuada imperdiet leo. Integer lobortis lacus eu dapibus tempor. Aliquam vestibulum commodo euismod. Duis eu pretium turpis. Nulla gravida posuere convallis. Morbi suscipit velit urna, nec imperdiet nisl lacinia lobortis. Suspendisse consectetur laoreet facilisis. Etiam porta auctor nibh, sed dictum tellus facilisis ac. Aliquam lacinia laoreet elit sit amet tincidunt. Aliquam nec nisi diam. Suspendisse faucibus pharetra tincidunt. Nullam augue quam, elementum eget urna ac, lobortis tempus tortor. Cras aliquam ac ante at euismod. Phasellus eu massa sit amet est porta venenatis.
  867. </div></div>
  868.  
  869. </div>
  870.  
  871. <div id="skeleton">
  872.  
  873. <div id="portrait"><img src="https://i.imgur.com/1S5g5Tj.png">
  874. <div id="name6">NAME</div>
  875. <div id="subtitle">SUBTITLE</div>
  876. </div>
  877.  
  878. <div id="tabspace">
  879. <div id="tab6">FANDOM:</div>
  880. <div id="tab6">SPECIES:</div>
  881. <div id="tab6">AGE:</div>
  882. <div id="tab6">GENDER:</div>
  883. <div id="tab6">HAIR:</div>
  884. <div id="tab6">EYES:</div>
  885. <div id="tab6">ORIENTATION:</div>
  886. <div id="tab6">OCCUPATION:</div>
  887. <div id="tab6">ALIGNMENT:</div>
  888. </div>
  889.  
  890. <div id="bio">
  891. <div id="title6">BIOGRAPHY</div>
  892.  
  893. <div id="biot">
  894. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et varius lacus, quis luctus massa. Cras maximus ante a nisi ullamcorper aliquet. Aliquam quis pharetra turpis. Quisque eleifend erat quis magna posuere aliquet. Aliquam vehicula varius turpis. Morbi at risus eget eros tempus laoreet et a nulla. Nullam sit amet turpis varius, faucibus massa sit amet, consectetur velit. Mauris vulputate sit amet nibh at feugiat. Sed ante nisi, porta eget facilisis ut, euismod vel nisi. Vivamus gravida mauris vehicula est pharetra dapibus. Aenean molestie, metus quis rhoncus varius, ex justo tincidunt enim, a rutrum velit magna eget sem. Nullam arcu ex, iaculis sed enim id, tempor consectetur sapien. Vivamus id nisi gravida, tempus justo in, consectetur purus.
  895.  
  896. Curabitur pellentesque eros vel velit blandit pulvinar. Sed aliquam, erat sit amet tincidunt suscipit, velit ligula sagittis odio, quis ultrices velit quam a nisi. Suspendisse mattis nisi in porttitor faucibus. Nullam consequat pellentesque risus eget luctus. Donec fringilla risus et ipsum volutpat tempor. Praesent nec libero metus. Pellentesque hendrerit erat hendrerit faucibus condimentum. Suspendisse dictum, tellus ac feugiat pulvinar, ligula libero suscipit nisl, et consequat risus massa quis risus. Cras neque nibh, tempus a scelerisque ac, lobortis a ex. Proin bibendum lectus at mi sollicitudin imperdiet. Nunc vitae nunc urna. Aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pretium tempus massa quis molestie. Cras condimentum ligula sit amet lacus hendrerit dictum.
  897.  
  898. Integer risus est, scelerisque quis magna sit amet, malesuada imperdiet leo. Integer lobortis lacus eu dapibus tempor. Aliquam vestibulum commodo euismod. Duis eu pretium turpis. Nulla gravida posuere convallis. Morbi suscipit velit urna, nec imperdiet nisl lacinia lobortis. Suspendisse consectetur laoreet facilisis. Etiam porta auctor nibh, sed dictum tellus facilisis ac. Aliquam lacinia laoreet elit sit amet tincidunt. Aliquam nec nisi diam. Suspendisse faucibus pharetra tincidunt. Nullam augue quam, elementum eget urna ac, lobortis tempus tortor. Cras aliquam ac ante at euismod. Phasellus eu massa sit amet est porta venenatis.</div></div>
  899.  
  900. </div>
  901.  
  902. <div id="skeleton">
  903.  
  904. <div id="portrait"><img src="https://i.imgur.com/CNbB6N2.png">
  905. <div id="name7">NAME</div>
  906. <div id="subtitle">SUBTITLE.</div>
  907. </div>
  908.  
  909. <div id="tabspace">
  910. <div id="tab7">FANDOM:</div>
  911. <div id="tab7">SPECIES:</div>
  912. <div id="tab7">AGE:</div>
  913. <div id="tab7">GENDER:/div>
  914. <div id="tab7">HAIR:</div>
  915. <div id="tab7">EYES:</div>
  916. <div id="tab7">ORIENTATION:</div>
  917. <div id="tab7">OCCUPATION:</div>
  918. <div id="tab7">ALIGNMENT:</div>
  919. </div>
  920.  
  921. <div id="bio">
  922. <div id="title7">BIOGRAPHY</div>
  923.  
  924. <div id="biot">
  925. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et varius lacus, quis luctus massa. Cras maximus ante a nisi ullamcorper aliquet. Aliquam quis pharetra turpis. Quisque eleifend erat quis magna posuere aliquet. Aliquam vehicula varius turpis. Morbi at risus eget eros tempus laoreet et a nulla. Nullam sit amet turpis varius, faucibus massa sit amet, consectetur velit. Mauris vulputate sit amet nibh at feugiat. Sed ante nisi, porta eget facilisis ut, euismod vel nisi. Vivamus gravida mauris vehicula est pharetra dapibus. Aenean molestie, metus quis rhoncus varius, ex justo tincidunt enim, a rutrum velit magna eget sem. Nullam arcu ex, iaculis sed enim id, tempor consectetur sapien. Vivamus id nisi gravida, tempus justo in, consectetur purus.
  926.  
  927. Curabitur pellentesque eros vel velit blandit pulvinar. Sed aliquam, erat sit amet tincidunt suscipit, velit ligula sagittis odio, quis ultrices velit quam a nisi. Suspendisse mattis nisi in porttitor faucibus. Nullam consequat pellentesque risus eget luctus. Donec fringilla risus et ipsum volutpat tempor. Praesent nec libero metus. Pellentesque hendrerit erat hendrerit faucibus condimentum. Suspendisse dictum, tellus ac feugiat pulvinar, ligula libero suscipit nisl, et consequat risus massa quis risus. Cras neque nibh, tempus a scelerisque ac, lobortis a ex. Proin bibendum lectus at mi sollicitudin imperdiet. Nunc vitae nunc urna. Aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pretium tempus massa quis molestie. Cras condimentum ligula sit amet lacus hendrerit dictum.
  928.  
  929. Integer risus est, scelerisque quis magna sit amet, malesuada imperdiet leo. Integer lobortis lacus eu dapibus tempor. Aliquam vestibulum commodo euismod. Duis eu pretium turpis. Nulla gravida posuere convallis. Morbi suscipit velit urna, nec imperdiet nisl lacinia lobortis. Suspendisse consectetur laoreet facilisis. Etiam porta auctor nibh, sed dictum tellus facilisis ac. Aliquam lacinia laoreet elit sit amet tincidunt. Aliquam nec nisi diam. Suspendisse faucibus pharetra tincidunt. Nullam augue quam, elementum eget urna ac, lobortis tempus tortor. Cras aliquam ac ante at euismod. Phasellus eu massa sit amet est porta venenatis.</div></div>
  930.  
  931. </div>
  932.  
  933. <div id="skeleton">
  934.  
  935. <div id="portrait"><img src="https://i.imgur.com/A6NVxwP.png">
  936. <div id="name8">NAME</div>
  937. <div id="subtitle">SUBTITLED</div>
  938. </div>
  939.  
  940. <div id="tabspace">
  941. <div id="tab8">FANDOM:</div>
  942. <div id="tab8">SPECIES:</div>
  943. <div id="tab8">AGE:</div>
  944. <div id="tab8">GENDER:</div>
  945. <div id="tab8">HAIR:</div>
  946. <div id="tab8">EYES:</div>
  947. <div id="tab8">ORIENTATION:</div>
  948. <div id="tab8">OCCUPATION:</div>
  949. <div id="tab8">ALIGNMENT:</div>
  950. </div>
  951.  
  952. <div id="bio">
  953. <div id="title8">BIOGRAPHY</div>
  954.  
  955. <div id="biot">
  956. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et varius lacus, quis luctus massa. Cras maximus ante a nisi ullamcorper aliquet. Aliquam quis pharetra turpis. Quisque eleifend erat quis magna posuere aliquet. Aliquam vehicula varius turpis. Morbi at risus eget eros tempus laoreet et a nulla. Nullam sit amet turpis varius, faucibus massa sit amet, consectetur velit. Mauris vulputate sit amet nibh at feugiat. Sed ante nisi, porta eget facilisis ut, euismod vel nisi. Vivamus gravida mauris vehicula est pharetra dapibus. Aenean molestie, metus quis rhoncus varius, ex justo tincidunt enim, a rutrum velit magna eget sem. Nullam arcu ex, iaculis sed enim id, tempor consectetur sapien. Vivamus id nisi gravida, tempus justo in, consectetur purus.
  957.  
  958. Curabitur pellentesque eros vel velit blandit pulvinar. Sed aliquam, erat sit amet tincidunt suscipit, velit ligula sagittis odio, quis ultrices velit quam a nisi. Suspendisse mattis nisi in porttitor faucibus. Nullam consequat pellentesque risus eget luctus. Donec fringilla risus et ipsum volutpat tempor. Praesent nec libero metus. Pellentesque hendrerit erat hendrerit faucibus condimentum. Suspendisse dictum, tellus ac feugiat pulvinar, ligula libero suscipit nisl, et consequat risus massa quis risus. Cras neque nibh, tempus a scelerisque ac, lobortis a ex. Proin bibendum lectus at mi sollicitudin imperdiet. Nunc vitae nunc urna. Aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pretium tempus massa quis molestie. Cras condimentum ligula sit amet lacus hendrerit dictum.
  959.  
  960. Integer risus est, scelerisque quis magna sit amet, malesuada imperdiet leo. Integer lobortis lacus eu dapibus tempor. Aliquam vestibulum commodo euismod. Duis eu pretium turpis. Nulla gravida posuere convallis. Morbi suscipit velit urna, nec imperdiet nisl lacinia lobortis. Suspendisse consectetur laoreet facilisis. Etiam porta auctor nibh, sed dictum tellus facilisis ac. Aliquam lacinia laoreet elit sit amet tincidunt. Aliquam nec nisi diam. Suspendisse faucibus pharetra tincidunt. Nullam augue quam, elementum eget urna ac, lobortis tempus tortor. Cras aliquam ac ante at euismod. Phasellus eu massa sit amet est porta venenatis.
  961.  
  962. </div></div>
  963. </div>
  964.  
  965. <div id="skeleton">
  966.  
  967. <div id="portrait"><img src="https://i.imgur.com/TveRxmH.png">
  968. <div id="name9">NAME</div>
  969. <div id="subtitle">SUBTITLE</div>
  970. </div>
  971.  
  972. <div id="tabspace">
  973. <div id="tab9">FANDOM:</div>
  974. <div id="tab9">SPECIES:</div>
  975. <div id="tab9">AGE:</div>
  976. <div id="tab9">GENDER:</div>
  977. <div id="tab9">FUR:</div>
  978. <div id="tab9">EYES:</div>
  979. <div id="tab9">ORIENTATION:</div>
  980. <div id="tab9">OCCUPATION:</div>
  981. <div id="tab9s">ALIGNMENT:</div>
  982. </div>
  983.  
  984. <div id="bio">
  985. <div id="title9">BIOGRAPHY</div>
  986.  
  987. <div id="biot">
  988. <b>UNDER CONSTRUCTION</b><br>
  989. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et varius lacus, quis luctus massa. Cras maximus ante a nisi ullamcorper aliquet. Aliquam quis pharetra turpis. Quisque eleifend erat quis magna posuere aliquet. Aliquam vehicula varius turpis. Morbi at risus eget eros tempus laoreet et a nulla. Nullam sit amet turpis varius, faucibus massa sit amet, consectetur velit. Mauris vulputate sit amet nibh at feugiat. Sed ante nisi, porta eget facilisis ut, euismod vel nisi. Vivamus gravida mauris vehicula est pharetra dapibus. Aenean molestie, metus quis rhoncus varius, ex justo tincidunt enim, a rutrum velit magna eget sem. Nullam arcu ex, iaculis sed enim id, tempor consectetur sapien. Vivamus id nisi gravida, tempus justo in, consectetur purus.
  990.  
  991. Curabitur pellentesque eros vel velit blandit pulvinar. Sed aliquam, erat sit amet tincidunt suscipit, velit ligula sagittis odio, quis ultrices velit quam a nisi. Suspendisse mattis nisi in porttitor faucibus. Nullam consequat pellentesque risus eget luctus. Donec fringilla risus et ipsum volutpat tempor. Praesent nec libero metus. Pellentesque hendrerit erat hendrerit faucibus condimentum. Suspendisse dictum, tellus ac feugiat pulvinar, ligula libero suscipit nisl, et consequat risus massa quis risus. Cras neque nibh, tempus a scelerisque ac, lobortis a ex. Proin bibendum lectus at mi sollicitudin imperdiet. Nunc vitae nunc urna. Aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pretium tempus massa quis molestie. Cras condimentum ligula sit amet lacus hendrerit dictum.
  992.  
  993. Integer risus est, scelerisque quis magna sit amet, malesuada imperdiet leo. Integer lobortis lacus eu dapibus tempor. Aliquam vestibulum commodo euismod. Duis eu pretium turpis. Nulla gravida posuere convallis. Morbi suscipit velit urna, nec imperdiet nisl lacinia lobortis. Suspendisse consectetur laoreet facilisis. Etiam porta auctor nibh, sed dictum tellus facilisis ac. Aliquam lacinia laoreet elit sit amet tincidunt. Aliquam nec nisi diam. Suspendisse faucibus pharetra tincidunt. Nullam augue quam, elementum eget urna ac, lobortis tempus tortor. Cras aliquam ac ante at euismod. Phasellus eu massa sit amet est porta venenatis.</p>
  994. </div></div>
  995.  
  996. </div>
  997.  
  998. <div id="skeleton">
  999.  
  1000. <div id="portrait"><img src="https://i.imgur.com/TorEFCp.png">
  1001. <div id="name10">NAME</div>
  1002. <div id="subtitle">SUBTITLE</div>
  1003. </div>
  1004.  
  1005. <div id="tabspace">
  1006. <div id="tab10">FANDOM:</div>
  1007. <div id="tab10">SPECIES:</div>
  1008. <div id="tab10">AGE:</div>
  1009. <div id="tab10">GENDER:</div>
  1010. <div id="tab10">HAIR:</div>
  1011. <div id="tab10">EYES:</div>
  1012. <div id="tab10">ORIENTATION:</div>
  1013. <div id="tab10">OCCUPATION:</div>
  1014. <div id="tab10">ALIGNMENT:</div>
  1015. </div>
  1016.  
  1017. <div id="bio">
  1018. <div id="title10">BIOGRAPHY</div>
  1019.  
  1020. <div id="biot">
  1021. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et varius lacus, quis luctus massa. Cras maximus ante a nisi ullamcorper aliquet. Aliquam quis pharetra turpis. Quisque eleifend erat quis magna posuere aliquet. Aliquam vehicula varius turpis. Morbi at risus eget eros tempus laoreet et a nulla. Nullam sit amet turpis varius, faucibus massa sit amet, consectetur velit. Mauris vulputate sit amet nibh at feugiat. Sed ante nisi, porta eget facilisis ut, euismod vel nisi. Vivamus gravida mauris vehicula est pharetra dapibus. Aenean molestie, metus quis rhoncus varius, ex justo tincidunt enim, a rutrum velit magna eget sem. Nullam arcu ex, iaculis sed enim id, tempor consectetur sapien. Vivamus id nisi gravida, tempus justo in, consectetur purus.
  1022.  
  1023. Curabitur pellentesque eros vel velit blandit pulvinar. Sed aliquam, erat sit amet tincidunt suscipit, velit ligula sagittis odio, quis ultrices velit quam a nisi. Suspendisse mattis nisi in porttitor faucibus. Nullam consequat pellentesque risus eget luctus. Donec fringilla risus et ipsum volutpat tempor. Praesent nec libero metus. Pellentesque hendrerit erat hendrerit faucibus condimentum. Suspendisse dictum, tellus ac feugiat pulvinar, ligula libero suscipit nisl, et consequat risus massa quis risus. Cras neque nibh, tempus a scelerisque ac, lobortis a ex. Proin bibendum lectus at mi sollicitudin imperdiet. Nunc vitae nunc urna. Aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pretium tempus massa quis molestie. Cras condimentum ligula sit amet lacus hendrerit dictum.
  1024.  
  1025. Integer risus est, scelerisque quis magna sit amet, malesuada imperdiet leo. Integer lobortis lacus eu dapibus tempor. Aliquam vestibulum commodo euismod. Duis eu pretium turpis. Nulla gravida posuere convallis. Morbi suscipit velit urna, nec imperdiet nisl lacinia lobortis. Suspendisse consectetur laoreet facilisis. Etiam porta auctor nibh, sed dictum tellus facilisis ac. Aliquam lacinia laoreet elit sit amet tincidunt. Aliquam nec nisi diam. Suspendisse faucibus pharetra tincidunt. Nullam augue quam, elementum eget urna ac, lobortis tempus tortor. Cras aliquam ac ante at euismod. Phasellus eu massa sit amet est porta venenatis.
  1026. </div></div>
  1027.  
  1028. </div>
  1029.  
  1030. </div>
  1031.  
  1032. <div id="credit"><a href="http://www.hcpefulcodes.tumblr.com">❤</a></div>
  1033. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
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!