API tools faq
paste
jadelynrph

Page 1: Reverse Psychology w/ pop up

jadelynrph
Nov 20th, 2017
409
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 234.45 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <!--
  5. (_) | | | | | | THEMES
  6. _ __ _ __| | ___| |_ _ _ __ _ __ _ __ | |__ Page Theme #1: Reverse
  7. | |/ _` |/ _` |/ _ \ | | | | '_ \| '__| '_ \| '_ \ Psychology
  8. | | (_| | (_| | __/ | |_| | | | | | | |_) | | | |11/7/2017
  9. | |\__,_|\__,_|\___|_|\__, |_| |_|_| | .__/|_| |_|11/14/2017
  10. _/ | __/ | | |
  11. |__/ |___/ |_|
  12.  
  13. * DO NOT STEAL THIS CODE. ESPECIALLY MY TWITTER CODE!!!
  14. * DO NOT REDISTRIBUTE
  15. * DO NOT USE MY THEME AS A BASE CODE UNLESS I GIVE YOU PERMISSION TO DO SO!!
  16. * IF YOU HAVE ANY QUESTIONS ABOUT THIS THEME, JUST MESSAGE ME.
  17. * KEEP THE CREDIT WHERE I PLACED IT!!!!
  18. * TABS/PAGES BELONG TO "https://ncighbourhood.tumblr.com/" I DID NOT DO THE TABS. CREDIT GOES TO HER FOR HER TAB TUTORIAL!!!
  19.  
  20. TABS STYLING--
  21. BASE CODE BY ALYOFRP. DO NOT REMOVE THIS CREDIT!
  22.  
  23. -->
  24.  
  25.  
  26. <head>
  27.  
  28. <!--scripts go here-->
  29.  
  30. <script>
  31. function openAlytut(evt, alytutName) {
  32. var i, x, tablinks;
  33. x = document.getElementsByClassName("alytut");
  34. for (i = 0; i < x.length; i++) {
  35. x[i].style.display = "none";
  36. }
  37. tablinks = document.getElementsByClassName("tablink");
  38. for (i = 0; i < x.length; i++) {
  39. tablinks[i].className = tablinks[i].className.replace(" tabzact", "");
  40. }
  41. document.getElementById(alytutName).style.display = "block";
  42. evt.currentTarget.className += " tabzact";
  43. }
  44. </script>
  45.  
  46.  
  47.  
  48. <script type="text/javascript"
  49. src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  50. <script>
  51. $(document).ready(function() {
  52. //
  53. $('a.poplight[href^=#]').click(function() {
  54. var popID = $(this).attr('rel'); //Get Popup Name
  55. var popURL = $(this).attr('href'); //Get Popup href to define size
  56. var query= popURL.split('?');
  57. var dim= query[1].split('&');
  58. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  59. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close" title="close"><img src="https://upload.wikimedia.org/wikipedia/commons/f/f8/Tooltip-CloseButton.png" class="btn_close" alt="escape" /></a>');
  60. var popMargTop = ($('#' + popID).height() + 80) / 2;
  61. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  62. //Apply Margin to Popup
  63. $('#' + popID).css({
  64. 'margin-top' : -popMargTop,
  65. 'margin-left' : -popMargLeft
  66. });
  67. $('body').append('<div id="fade"></div>');
  68. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  69. return false;
  70. });
  71. $('a.close, #fade').live('click', function() {
  72. $('#fade , .popup_block').fadeOut(function() {
  73. $('#fade, a.close').remove(); //fade them both out
  74. });
  75. return false;
  76. });
  77. });
  78. </script>
  79.  
  80.  
  81.  
  82.  
  83.  
  84.  
  85. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  86.  
  87. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  88.  
  89. <script>
  90. (function($){$(document).ready(function(){$("a[title]").style_my_tooltips({tip_follows_cursor:true,tip_delay_time:90,tip_fade_speed:600,attribute:"title"});});})(jQuery);
  91. </script>
  92.  
  93. <!-- relative links, font links, and font awesomre icon link goes here-->
  94.  
  95. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
  96.  
  97. <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro" rel="stylesheet">
  98.  
  99. <link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
  100.  
  101. <link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
  102.  
  103. <title>{Title}</title>
  104.  
  105. <link rel="shortcut icon" href="{Favicon}">
  106. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  107.  
  108.  
  109.  
  110.  
  111. <style type="text/css">
  112.  
  113. /* CSS */
  114. /*custom links can go here as well*/
  115.  
  116.  
  117. @font-face {
  118. font-family:"beauty and the beast";
  119. src: url('https://dl.dropboxusercontent.com/s/ngvhx7l37rey0sp/Beauty%20and%20the%20Beast%20Sample.ttf');}
  120.  
  121.  
  122.  
  123. iframe.tmblr-iframe {
  124. z-index:99999999999999!important;
  125. top:-2px!important;
  126. right:0!important;
  127. opacity:0;
  128. padding-right:38px;
  129. transform:scale(0.65);
  130. transform-origin:100% 0;
  131. -webkit-transform:scale(0.65);
  132. -webkit-transform-origin:100% 0;
  133. -o-transform:scale(0.65);
  134. -o-transform-origin:100% 0;
  135. -moz-transform:scale(0.65);
  136. -moz-transform-origin:100% 0;
  137. -ms-transform:scale(0.65);
  138. -ms-transform-origin:100% 0;}
  139.  
  140. iframe.tmblr-iframe:hover {
  141. opacity:0.9!important;
  142. width:330px;
  143. height:230px;
  144. }
  145.  
  146. .hcontrols {
  147. position:fixed;
  148. top:0;
  149. right:0;
  150. z-index:999999999;}
  151.  
  152. .hcontrols svg {
  153. width:30px;
  154. height:30px;
  155. padding:9px;}
  156.  
  157. .hcontrols svg path {
  158. fill:#888888;/* change this to change the color of the icon */}
  159.  
  160. ::-webkit-scrollbar {
  161. display: none;
  162. }
  163.  
  164.  
  165. #s-m-t-tooltip {
  166. max-width:200px; /*how big the tooltip can be at most*/
  167. max-height:90px;
  168. border-radius: 5px 5px 5px 5px; /*change your border radius*/
  169. padding:3px 4px 5px 4px; /*padding inside tooltip*/
  170. margin:20px 7px -2px 20px; /*distance from word*/
  171. background-color: #383637;/*background color*/
  172. background:rgba(0, 0, 0, 0.2);
  173. border:1px solid #adadad; /*border info*/
  174. font-family:"beauty and the beast"; /*tooltip font*/
  175. font-size:11px; /*tooltip font size*/
  176. letter-spacing:2px; /*tooltip letter spacing*/
  177. text-transform:none; /*makes the tooltip title uppercase*/
  178. color:#b5b5b6; /*tooltip font color*/
  179. z-index:999999999999999999999999999999999999;
  180. }
  181.  
  182. body {
  183. /*background: linear-gradient(to bottom right, #2a3a31,#5d2d15,#e29673);*/
  184. background-color:#1e1e1e;
  185. background-image:url('{image:background}');
  186. background-attachment: fixed;
  187. background-size: cover;
  188. font-family:'arial';
  189. font-size:12px;
  190. /*if you want a gradient background, and you don't know how to code, message me and i'll add it for you!!!*/
  191.  
  192. }
  193.  
  194.  
  195.  
  196. a {
  197. text-decoration:none;
  198. color:#adadad;
  199. -webkit-transition: all 0.5s ease-out;
  200. -moz-transition: all 0.5s ease-out;
  201. transition: all 0.5s ease-out;
  202. }
  203.  
  204. a:hover {
  205. text-decoration:none;
  206. color:#707171;
  207. -webkit-transition: all 0.5s ease-out;
  208. -moz-transition: all 0.5s ease-out;
  209. transition: all 0.5s ease-out;
  210.  
  211.  
  212. }
  213.  
  214.  
  215. /* IMESSAGE CHAT POST BY ANIMALITES */
  216.  
  217. .answer span,.convo li{
  218. margin:0 0 5px;
  219. border-radius:1em;
  220. padding:.5em 10px;
  221. max-width:70%;
  222. clear:both;
  223. position:relative
  224. }
  225.  
  226. .answer .them,.user_1,.user_3,.user_5,.user_7,.user_9,.user_11{
  227. float:left;
  228. background:#e5e5ea;
  229. color:#000;
  230. left:3px;
  231. text-transform:none;
  232.  
  233. }
  234.  
  235.  
  236. .me::after,.user_1::after,.user_3::after,.user_5::after,.user_7::after,.user_9::after,.user_11::after{
  237. content:"";
  238. position:absolute;
  239. left:-.5em;
  240. bottom:0;
  241. width:.5em;
  242. height:1em;
  243. border-right:.5em solid #e5e5ea;
  244. border-bottom-right-radius:1em .5em;
  245. }
  246.  
  247. .answer .me,.user_2,.user_4,.user_6,.user_8,.user_10,.user_12{
  248. right:3px;
  249. float:right;
  250. background-color:#4e42a2;
  251. color:#ffffff;
  252. text-transform:none;
  253.  
  254. }
  255.  
  256. .them::after,.user_2::after,.user_4::after,.user_6::after,.user_8::after,.user_10::after,.user_12::after{
  257. content:"";
  258. position:absolute;right:-.5em;
  259. bottom:0;
  260. width:.5em;
  261. height:1em;
  262. border-left:.5em solid #4e42a2;
  263. border-bottom-left-radius:1em .5em
  264.  
  265. }
  266.  
  267. .me p,.answer,.asked span{
  268. padding:0;
  269. margin:0
  270.  
  271. }
  272.  
  273. .answer{overflow:hidden}
  274. .asked p {
  275. text-align: left; margin: 0 0px 10px 0px;
  276. padding: 0;
  277. color: #666666;
  278. font-size: 12px;
  279. line-height: 0px;
  280.  
  281. }
  282.  
  283. .footerright .viasrc {float: left;}
  284. .asked a {margin:0;padding:0;}
  285.  
  286. .user_4{background-color:#55caff;color:#fff}.user_4::after{border-color:#55caff}.user_6{background-color:#60f246;color:#fff}.user_6::after{border-color:#60f246}.user_5{background-color:#9ff3fc;color:#000}.user_5::after{border-color:#9ff3fc}.user_3{background-color:#25c413;color:#fff}.user_3::after{border-color:#25c413}.user_7{background-color:#9b9b9b;color:#fff}.user_7::after{border-color:#9b9b9b}.user_8{background-color:#0d9321;color:#fff}.user_8::after{border-color:#0d9321}.user_9{background-color:#606060;color:#fff}.user_9::after{border-color:#606060} .convo { overflow: hidden;list-style-type: none;padding: 0; margin: 0; }
  287.  
  288. /*end of imessage chats*/
  289.  
  290. #accent {
  291. position:fixed;
  292. margin-top:65px;
  293. margin-left:160px;
  294. width:1000px;
  295. height:560px;
  296. background-color:#383637;
  297. }
  298.  
  299. #ac {
  300. position:absolute;
  301. overflow:auto;
  302. width:1000px;
  303. height:560px;
  304.  
  305. }
  306. /*1st character box*/
  307.  
  308. #cbox {
  309. position:absolute;
  310. width:800px;
  311. height:90px;
  312. margin-left:50px;
  313. margin-top:30px;
  314. background-color:#94989b;
  315. }
  316.  
  317. #cname {
  318. position:absolute;
  319. width:160px;
  320. height:70px;
  321. margin-left:0px;
  322. margin-top:0px;
  323. color:#373536;
  324. font-family:"beauty and the beast";
  325. font-size:17px;
  326. font-weight:bold;
  327. text-align:center;
  328. }
  329.  
  330.  
  331. #faceclaim {
  332. position:absolute;
  333. width:160px;
  334. height:50px;
  335. margin-left:8px;
  336. margin-top:29px;
  337. color:#373536;
  338. font-family:"beauty and the beast";
  339. font-size:14px;
  340. }
  341.  
  342. #clabel {
  343. position:absolute;
  344. width:160px;
  345. height:50px;
  346. margin-left:-3px;
  347. margin-top:53px;
  348. color:#373536;
  349. font-family:"beauty and the beast";
  350. font-size:14px;
  351. text-align:center;
  352. }
  353.  
  354. #cinfo {
  355. position:absolute;
  356. width:630px;
  357. height:90px;
  358. margin-left:170px;
  359. margin-top:8px;
  360. color:#373536;
  361. font-size:13.5px;
  362. }
  363.  
  364. #cim {
  365. position:absolute;
  366. width:90px;
  367. height:90px;
  368. margin-left:870px;
  369. margin-top:30px;
  370. border: 1px solid #adadad;
  371. z-index:9;
  372. }
  373.  
  374. /*2nd character box*/
  375.  
  376. #cbox2 {
  377. position:absolute;
  378. width:800px;
  379. height:90px;
  380. margin-left:160px;
  381. margin-top:135px;
  382. background-color:#94989b;
  383. }
  384.  
  385.  
  386. #cim2 {
  387. position:absolute;
  388. width:90px;
  389. height:90px;
  390. margin-left:50px;
  391. margin-top:135px;
  392. border: 1px solid #adadad;
  393. z-index:9;
  394. }
  395.  
  396.  
  397. /*tabs container & info*/
  398. .tabzcon { /* tablinks content aka the box under the tablinks */
  399. margin-top:65px;
  400. margin-left:160px;
  401. padding:10px;
  402. position:fixed;
  403. width:1000px;
  404. height:560px;
  405. background-color:#383637;
  406. color:#adadad;
  407. z-index:999;
  408. }
  409. .tabzclose { /* the close button, u prob dont need to touch this */
  410. text-transform:uppercase;
  411. font-weight:bold;
  412. font-size:20px;
  413. padding:3px;
  414. color:#adadad;
  415. margin-top:5px;
  416. margin-left:90px;
  417. float:right;
  418. }
  419.  
  420. .tabzclose:hover {
  421. cursor:pointer;
  422. color:#707171;
  423. }
  424.  
  425.  
  426.  
  427.  
  428. /*------------ pop up tabs ---------------*/
  429.  
  430. .popup_block{
  431. display:none;
  432. position:fixed;
  433. padding:10px;
  434. top:69.2%;left:43.05%;
  435. background-color:#160f33; /*you can change this to a color from the image pop up to make it look more realistic. make sure to change the background color of the popup info box to match*/
  436. z-index: 999999999999999999999;
  437.  
  438. }
  439.  
  440. *html #fade {position: fixed;}
  441. *html .popup_block {position: fixed;}
  442. #fade {
  443. display:none;
  444. position:fixed;
  445. top:0px;
  446. left:0px;
  447. width:100%;
  448. height:100%;
  449. z-index:9;
  450. }
  451.  
  452.  
  453.  
  454.  
  455.  
  456.  
  457. /*character page*/
  458. #fcim {
  459. position:fixed;
  460. width:200px;
  461. height:125px;
  462. margin-top:15px;
  463. margin-left:5px;
  464. border: 1px solid #b5b5b6;
  465. }
  466.  
  467. #label {
  468. position:fixed;
  469. width:400px;
  470. height:80px;
  471. margin-top:0px;
  472. margin-left:320px;
  473. font-family:'beauty and the beast';
  474. font-size:25px;
  475. color:#c3c3c5;
  476. text-align:center;
  477. }
  478.  
  479. #fcbox {
  480. position:absolute;
  481. overflow:auto;
  482. margin-top:50px;
  483. margin-left:220px;
  484. width:600px;
  485. height:92px;
  486. background-color:#94989b;
  487.  
  488. }
  489.  
  490. #fcinfo {
  491. margin-left:10px;
  492. margin-top:5px;
  493. color:#373536;
  494. font-size:12.5px;
  495. }
  496.  
  497. #fcinfo b {
  498. color:#252324;
  499. }
  500.  
  501. #fcinfo i {
  502. color:#211e1f;
  503. }
  504.  
  505. #ibox {
  506. margin-left:830px;
  507. margin-top:50px;
  508. position:fixed;
  509. width:170px;
  510. height:20px;
  511. background-color:#ffffff;
  512. color:#000000;
  513. text-align:center;
  514. font-weight:bold;
  515. }
  516.  
  517.  
  518. #ibox2 {
  519. margin-left:830px;
  520. margin-top:70px;
  521. position:absolute;
  522. overflow:auto;
  523. width:170px;
  524. height:200px;
  525. background-color:#ffffff;
  526. }
  527.  
  528. /*snaphat*/
  529.  
  530. .snap {
  531. margin-left:860px;
  532. margin-top:280px;
  533. position:fixed;
  534. width:140px;
  535. height:280px;
  536. border: 1px solid #f3f3f3;
  537. }
  538.  
  539. .snap2 {
  540. opacity:0;
  541. position:fixed;
  542. }
  543.  
  544.  
  545. .snap3{
  546. opacity:0;
  547. position:fixed;
  548. }
  549.  
  550. .snap4 {
  551. opacity:0;
  552. position:fixed;
  553. }
  554.  
  555. .snap5 {
  556. opacity:0;
  557. position:fixed;
  558. }
  559.  
  560.  
  561. .snap6 {
  562. opacity:0;
  563. position:fixed;
  564. }
  565.  
  566. .snap:hover .snap2 {
  567. opacity:1;
  568. transition-delay:3s;
  569.  
  570.  
  571. }
  572.  
  573. .snap:hover .snap3 {
  574. opacity:1;
  575. transition-delay:8s;
  576.  
  577. }
  578.  
  579. .snap:hover .snap4 {
  580. opacity:1;
  581. transition-delay:13.5s;
  582.  
  583. }
  584.  
  585. .snap:hover .snap5 {
  586. opacity:1;
  587. transition-delay:16s;
  588.  
  589. }
  590.  
  591. .snap:hover .snap6 {
  592. opacity:1;
  593. transition-delay:20.3s;
  594.  
  595. }
  596.  
  597.  
  598. .snapuser {
  599. position:absolute;
  600. margin-top:3px;
  601. margin-left:5px;
  602. font-family:'"Comic Sans MS", cursive, sans-serif;
  603. font-size:13px;
  604. color:#ffffff;
  605. font-weight:bold;
  606. text-shadow:3px 1px 3px #000;
  607. letter-spacing:1px;
  608. text-transform:normal;
  609. z-index:9999999;
  610.  
  611. }
  612.  
  613. .snaptime {
  614. color:#fff;
  615. text-shadow:2px 1px 3px #000;
  616. position:absolute;
  617. margin-top:22px;
  618. margin-left:4px;
  619. letter-spacing:1px;
  620. text-transform:lowercase;
  621. font-size:10px;
  622. font-family:'"Comic Sans MS", cursive, sans-serif;
  623.  
  624. }
  625.  
  626.  
  627. .snapcap {
  628. position:absolute;
  629. background:rgba(0, 0, 0, 0.6);
  630. width:130px;
  631. padding:5px;
  632. text-align:center;
  633. margin-top:160px;
  634. color:#e7e7e7;
  635. letter-spacing:1.5px;
  636. font-size:11px;
  637. font-family:'"Comic Sans MS", cursive, sans-serif;
  638.  
  639. }
  640.  
  641. /*connections*/
  642.  
  643. #conbox {
  644. position:absolute;
  645. overflow:auto;
  646. margin-top:150px;
  647. margin-left:5px;
  648. width:230px;
  649. height:414px;
  650. background-color:#94989b;
  651. }
  652.  
  653. #conbox2 {
  654. position:absolute;
  655. overflow:auto;
  656. margin-top:10px;
  657. margin-left:5px;
  658. width:145px;
  659. height:70px;
  660. background-color:#383637;
  661. }
  662.  
  663. #coninfo {
  664. margin-left:5px;
  665. margin-top:5px;
  666. font-size:13px;
  667. color:#adadad;
  668. }
  669.  
  670. #coninfo b {
  671. color:#dedbdb;
  672. }
  673.  
  674. #conicon {
  675. position:absolute;
  676. margin-left:153px;
  677. margin-top:5px;
  678. width:70px;
  679. height:70px;
  680. border-radius:70px;
  681.  
  682. }
  683.  
  684. #conicon img {
  685. border-radius:70px;
  686. }
  687.  
  688.  
  689. #conbox3 {
  690. position:absolute;
  691. overflow:auto;
  692. margin-top:90px;
  693. margin-left:80px;
  694. width:145px;
  695. height:70px;
  696. background-color:#383637;
  697. }
  698.  
  699. #coninfo2 {
  700. margin-left:5px;
  701. margin-top:5px;
  702. font-size:13px;
  703. color:#adadad;
  704. }
  705.  
  706. #coninfo2 b {
  707. color:#dedbdb;
  708. }
  709.  
  710. #conicon2 {
  711. position:absolute;
  712. margin-left:3px;
  713. margin-top:90px;
  714. width:70px;
  715. height:70px;
  716. border-radius:70px;
  717. }
  718.  
  719. #conicon2 img {
  720. border-radius:70px;
  721. }
  722.  
  723.  
  724. /*twitter*/
  725.  
  726. #twitter {
  727. position:fixed;
  728. margin-top:150px;
  729. margin-left:250px;
  730. width:260px;
  731. height:410px;
  732. }
  733.  
  734.  
  735.  
  736. #twithead {
  737. position:fixed;
  738. width:260px;
  739. height:50px;
  740. }
  741.  
  742. #twitic {
  743. position:fixed;
  744. width:60px;
  745. height:60px;
  746. margin-left:10px;
  747. margin-top:15px;
  748. border-radius:60px;
  749. border:3px solid #160f33;
  750. }
  751.  
  752. #twitic img {
  753. border-radius: 60px;
  754. }
  755.  
  756. #twitbg {
  757. position:fixed;
  758. width:260px;
  759. height:140px;
  760. margin-top:50px;
  761. margin-left:0px;
  762. background-color:#160f33;
  763. }
  764.  
  765. #twitname {
  766. position:fixed;
  767. width:90px;
  768. height:50px;
  769. font-size:15px;
  770. color:#ffffff;
  771. margin-top:35px;
  772. margin-left:10px;
  773. }
  774.  
  775. #twituser {
  776. position:fixed;
  777. width:90px;
  778. height:50px;
  779. font-size:13px;
  780. color:#b6b6b6;
  781. margin-top:53px;
  782. margin-left:5px;
  783. }
  784.  
  785. #twitdesc {
  786. position:fixed;
  787. width:246px;
  788. height:50px;
  789. font-size:13px;
  790. color:#ffffff;
  791. margin-top:75px;
  792. margin-left:10px;
  793. line-height:16px;
  794. }
  795.  
  796.  
  797. #twitf{
  798. position:fixed;
  799. width:230px;
  800. height:50px;
  801. font-size:13px;
  802. color:#b6b6b6;
  803. margin-top:120px;
  804. margin-left:10px;
  805. }
  806.  
  807.  
  808.  
  809. #twitf b{
  810. color:#ffffff;
  811. }
  812.  
  813. #twitpro {
  814. position:fixed;
  815. width:80px;
  816. height:19px;
  817. font-size:13px;
  818. color:#9ea4ff;
  819. margin-top:10px;
  820. margin-left:170px;
  821. border: 1px solid #9ea4ff;
  822. border-radius: 10px 10px 10px 10px;
  823. text-align:center;
  824. line-height:18.7px;
  825. }
  826.  
  827. #twitinfo {
  828. position:fixed;
  829. margin-top:190px;
  830. width:252px;
  831. padding:4px;
  832. font-size:14px;
  833. color:#b6b6b6;
  834. background-color:#2d2747;
  835. }
  836.  
  837.  
  838. #twitinfo b {
  839. color:#6076cc;
  840. }
  841.  
  842.  
  843. #twitborder {
  844. position:absolute;
  845. width:56px;
  846. margin-top:211px;
  847. border-bottom:3px solid #5f61ce;
  848. z-index:9999999;
  849. }
  850.  
  851. /*pinned tweet*/
  852.  
  853. #pinned {
  854. position:fixed;
  855. width:260px;
  856. height:200px;
  857. margin-top:214px;
  858. background-color:#160f33;
  859. }
  860.  
  861. #pinfo {
  862. position:fixed;
  863. width:140px;
  864. height:40px;
  865. margin-top:5px;
  866. margin-left:50px;
  867. font-size:12px;
  868. letter-spacing:.5px;
  869. color:#b6b6b6;
  870. }
  871.  
  872. #pname {
  873. position:fixed;
  874. width:90px;
  875. height:50px;
  876. font-size:13px;
  877. color:#ffffff;
  878. margin-top:0px;
  879. margin-left:16px;
  880. }
  881.  
  882.  
  883. #puser {
  884. position:fixed;
  885. width:100px;
  886. height:50px;
  887. font-size:12px;
  888. color:#b6b6b6;
  889. margin-top:0px;
  890. margin-left:63px;
  891. }
  892.  
  893. #pic {
  894. position:fixed;
  895. width:50px;
  896. height:50px;
  897. margin-left:9px;
  898. margin-top:17px;
  899. border-radius:50px;
  900. }
  901.  
  902. #pic img {
  903. width:50px;
  904. height:50px;
  905. border-radius: 50px;
  906. }
  907.  
  908. #ptweet{
  909. position:fixed;
  910. width:200px;
  911. height:40px;
  912. font-size:12px;
  913. color:#ffffff;
  914. margin-top:35px;
  915. margin-left:63px;
  916. }
  917.  
  918. #pim {
  919. position:fixed;
  920. width:190px;
  921. height:97px;
  922. margin-left:60px;
  923. margin-top:68px;
  924. border-radius:6px 6px 6px 6px;
  925. }
  926.  
  927.  
  928. #pim img {
  929. border-radius:6px 6px 6px 6px;
  930. }
  931.  
  932. #ptagged {
  933. position:fixed;
  934. margin-top:166px;
  935. margin-left:60px;
  936. width:150px;
  937. height:40px;
  938. font-size:11px;
  939. color:#b6b6b6;
  940. }
  941.  
  942. /*comments, retweets, and likes*/
  943. #pnotes {
  944. position:fixed;
  945. margin-top:183.5px;
  946. margin-left:63px;
  947. width:140px;
  948. height:30px;
  949. font-size:11px;
  950. color:#b6b6b6;
  951. font-family:'arial';
  952. }
  953.  
  954. #pact {
  955. position:fixed;
  956. margin-top:183.5px;
  957. margin-left:240px;
  958. width:140px;
  959. height:30px;
  960. font-size:11px;
  961. color:#b6b6b6;
  962. font-family:'arial';
  963. }
  964.  
  965.  
  966.  
  967. /*2nd twitter box for more tweets*/
  968. #twitter2 {
  969. position:absolute;
  970. overflow:auto;
  971. margin-top:150px;
  972. margin-left:520px;
  973. width:300px;
  974. height:120px;
  975. }
  976.  
  977. #twbg {
  978. position:absolute;
  979. overflow:auto;
  980. width:300px;
  981. height:120px;
  982. margin-top:0px;
  983. background-color:#160f33;
  984. }
  985.  
  986. #twi {
  987. position:absolute;
  988. width:300px;
  989. height:120px;
  990. }
  991.  
  992. #twinfo {
  993. position:absolute;
  994. width:140px;
  995. height:40px;
  996. margin-top:5px;
  997. margin-left:50px;
  998. font-size:12px;
  999. letter-spacing:.5px;
  1000. color:#b6b6b6;
  1001. }
  1002.  
  1003.  
  1004.  
  1005. #twname {
  1006. position:absolute;
  1007. width:90px;
  1008. height:50px;
  1009. font-size:13px;
  1010. color:#ffffff;
  1011. margin-top:0px;
  1012. margin-left:12px;
  1013. }
  1014.  
  1015.  
  1016. #twuser {
  1017. position:absolute;
  1018. width:100px;
  1019. height:50px;
  1020. font-size:12px;
  1021. color:#b6b6b6;
  1022. margin-top:0px;
  1023. margin-left:58px;
  1024. }
  1025.  
  1026.  
  1027.  
  1028. #twpic {
  1029. position:absolute;
  1030. width:50px;
  1031. height:50px;
  1032. margin-left:9px;
  1033. margin-top:5px;
  1034. border-radius:50px;
  1035. }
  1036.  
  1037. #twpic img {
  1038. border-radius: 50px;
  1039. }
  1040.  
  1041. #tweet{
  1042. position:absolute;
  1043. width:230px;
  1044. height:40px;
  1045. font-size:12px;
  1046. color:#ffffff;
  1047. margin-top:25px;
  1048. margin-left:63px;
  1049. }
  1050.  
  1051. #twsep {
  1052. position:absolute;
  1053. width:300px;
  1054. margin-top:103px;
  1055. margin-left:0px;
  1056. border-bottom:1px solid #b6b6b6;
  1057. z-index:9999999;
  1058. }
  1059.  
  1060.  
  1061.  
  1062. /*2nd comments, retweets, and likes*/
  1063. #twnotes {
  1064. position:absolute;
  1065. margin-top:85px;
  1066. margin-left:63px;
  1067. width:200px;
  1068. height:30px;
  1069. font-size:11px;
  1070. color:#b6b6b6;
  1071. font-family:'arial';
  1072. }
  1073.  
  1074. #twact {
  1075. position:absolute;
  1076. margin-top:85px;
  1077. margin-left:280px;
  1078. width:140px;
  1079. height:30px;
  1080. font-size:11px;
  1081. color:#b6b6b6;
  1082. font-family:'arial';
  1083. }
  1084.  
  1085.  
  1086. /*pinned image popup*/
  1087.  
  1088.  
  1089. #pinpop {
  1090. position:fixed;
  1091. width:150px;
  1092. height:380px;
  1093. margin-left:45px;
  1094. margin-top:-28.4px;
  1095. }
  1096.  
  1097.  
  1098. #pinpopz {
  1099. position:fixed;
  1100. width:260px;
  1101. height:80px;
  1102. margin-left:-10px;
  1103. margin-top:271px;
  1104. background:rgba(0, 0, 0, 0.4);
  1105. opacity:0;
  1106.  
  1107. }
  1108.  
  1109. #pinpopz:hover {
  1110. position:fixed;
  1111. opacity:1;
  1112. z-index:9999999999999999999999;
  1113. }
  1114.  
  1115. #ppopinf {
  1116. position:fixed;
  1117. margin-left:10px;
  1118. margin-top:10px;
  1119. font-size:12px;
  1120. text-align:center;
  1121. color:#ffffff;
  1122. }
  1123.  
  1124. #popsep{
  1125. position:absolute;
  1126. width:260px;
  1127. margin-top:351px;
  1128. margin-left:-10px;
  1129. border-bottom:1px solid #000000;
  1130. z-index:9999999;
  1131. }
  1132.  
  1133.  
  1134. #popbox {
  1135. width:260px;
  1136. height:36px;
  1137. margin-left:-10px;
  1138. margin-top:352px;
  1139. background-color:#160f33; /*you can change this to a color from the image pop up to make it look more realistic. make sure to change the background color of the popup block to match*/
  1140.  
  1141. }
  1142.  
  1143. #popnotes{
  1144. position:absolute;
  1145. margin-top:10px;
  1146. margin-left:20px;
  1147. width:240px;
  1148. height:30px;
  1149. font-size:13px;
  1150. color:#b6b6b6;
  1151. font-family:'arial';
  1152. }
  1153.  
  1154. #popmess {
  1155. position:absolute;
  1156. margin-top:10px;
  1157. margin-left:230px;
  1158. width:50px;
  1159. height:30px;
  1160. font-size:13px;
  1161. color:#b6b6b6;
  1162. font-family:'arial';
  1163. }
  1164.  
  1165.  
  1166. #popname {
  1167. position:fixed;
  1168. width:90px;
  1169. height:50px;
  1170. font-size:13px;
  1171. color:#ffffff;
  1172. margin-top:-5px;
  1173. margin-left:-25px;
  1174. }
  1175.  
  1176.  
  1177. #popuser {
  1178. position:fixed;
  1179. width:100px;
  1180. height:50px;
  1181. font-size:12px;
  1182. color:#b6b6b6;
  1183. margin-top:-4px;
  1184. margin-left:35px;
  1185. }
  1186.  
  1187. #poptweet{
  1188. position:fixed;
  1189. width:250px;
  1190. height:40px;
  1191. font-size:12.5px;
  1192. color:#ffffff;
  1193. margin-top:12px;
  1194. margin-left:-5px;
  1195. }
  1196.  
  1197. #poptagged {
  1198. position:fixed;
  1199. margin-top:56px;
  1200. margin-left:-10px;
  1201. width:150px;
  1202. height:40px;
  1203. font-size:11px;
  1204. color:#b6b6b6;
  1205. }
  1206.  
  1207.  
  1208. /*instagram*/
  1209.  
  1210. #ig {
  1211. position:fixed;
  1212. margin-top:130px;
  1213. width:325px;
  1214. height:284px;
  1215. background-color:#ffffff;
  1216. font-family: 'Montserrat', sans-serif;
  1217. }
  1218.  
  1219. #igic {
  1220. position:fixed;
  1221. margin-top:10px;
  1222. margin-left:5px;
  1223. width:80px;
  1224. height:80px;
  1225. border-radius:80px;
  1226. }
  1227.  
  1228. #igic img {
  1229. border-radius:80px;
  1230. }
  1231.  
  1232. #iguser {
  1233. margin-top:10px;
  1234. margin-left:90px;
  1235. width:100px;
  1236. height:40px;
  1237. font-size:15px;
  1238. color:#000000;
  1239. }
  1240.  
  1241.  
  1242. #igstats {
  1243. margin-top:-10px;
  1244. margin-left:88px;
  1245. width:240px;
  1246. height:40px;
  1247. font-size:11.6px;
  1248. color:#000000;
  1249. }
  1250.  
  1251. #igstats b {
  1252. font-weight:bold;
  1253. color:#000000;
  1254. }
  1255.  
  1256. #igdesc {
  1257. position:fixed;
  1258. width:240px;
  1259. height:40px;
  1260. margin-top:-13px;
  1261. margin-left:88px;
  1262. color:#000000};
  1263. }
  1264.  
  1265. #igdesc b {
  1266. font-weight:bold;
  1267. color:#000000;
  1268. }
  1269.  
  1270. #igdesc a {
  1271. color:#519bd6;
  1272. font-weight:bold;
  1273. }
  1274.  
  1275.  
  1276. #igposts {
  1277. position:fixed;
  1278. margin-top:50px;
  1279. margin-left:15px;
  1280. width:325px;
  1281. height:154px;
  1282. }
  1283.  
  1284. #igim {
  1285. position:fixed;
  1286. width:65px;
  1287. height:65px;
  1288. margin-top:10px;
  1289. margin-left:40px;
  1290.  
  1291. }
  1292.  
  1293. #igim img {
  1294. border:1px solid #252525;
  1295. }
  1296.  
  1297. /*CREDIT-- Just leave this please*/
  1298.  
  1299.  
  1300. #credit{
  1301. position:fixed;
  1302. font-size:8px;
  1303. font-weight:bold;
  1304. height:40px;
  1305. width:40px;
  1306. border-radius:40px;
  1307. margin-left:1190px;
  1308. margin-top:500px;
  1309. line-height:-90px;
  1310. text-align:center;
  1311. text-shadow:2px 1px 1px #000;
  1312. background: linear-gradient(to bottom right, #1e1e1e,#676767);
  1313. box-shadow: 3px 1px 3.5px #94989b;
  1314. transition-duration: 0.4s;
  1315. -webkit-transition: all 0.4s ease-out;
  1316. -moz-transition: all 0.4s ease-out;
  1317. -o-transition: all 0.4s ease-out;
  1318. -ms-transition: all 0.4s ease-out;
  1319. transition: all 0.4s ease-out;
  1320. -webkit-transition-timing-function: ease-out;
  1321. transition-timing-function: ease-out;
  1322. }
  1323.  
  1324.  
  1325. #credit a {
  1326. color:#adadad;
  1327. }
  1328.  
  1329.  
  1330. #credit a:hover {
  1331. color:#707171;
  1332.  
  1333. }
  1334.  
  1335. </style>
  1336. </head>
  1337.  
  1338. <body>
  1339.  
  1340.  
  1341. <div class="hcontrols"><svg version="1.1" id="Layer_1" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 216 216" enable-background="new 0 0 216 216" xml:space="preserve"><path d="M106.6,134c14.3,0,26-11.7,26-26s-11.7-26-26-26s-26,11.7-26,26S92.2,134,106.6,134z M106.6,94c7.7,0,14,6.3,14,14s-6.3,14-14,14s-14-6.3-14-14S98.9,94,106.6,94z M40.4,124.6l7.2,3.3c3,1.4,4.4,4.8,3.3,7.9l-2.8,7.4c-2.1,5.7-1.4,11.8,2.1,16.7c3.4,5,9,7.9,15,7.9c2.2,0,4.4-0.4,6.5-1.2l7.4-2.8c0.7-0.3,1.4-0.4,2.2-0.4c2.4,0,4.7,1.4,5.7,3.7l3.3,7.2c3,6.6,9.4,10.7,16.6,10.7s13.6-4.1,16.6-10.7l3.3-7.2c1-2.2,3.2-3.7,5.7-3.7c0.7,0,1.5,0.1,2.2,0.4l7.4,2.8c2.1,0.8,4.3,1.2,6.5,1.2c0,0,0,0,0,0c5.9,0,11.5-3,15-7.9c3.4-5,4.2-11.1,2.1-16.7l-2.8-7.4c-1.1-3.1,0.3-6.5,3.3-7.9l7.2-3.3c6.6-3,10.7-9.4,10.7-16.6s-4.1-13.6-10.7-16.6l-7.2-3.3c-3-1.4-4.4-4.8-3.3-7.9l2.8-7.4c2.1-5.7,1.4-11.8-2.1-16.7c-3.4-5-9-7.9-15-7.9c-2.2,0-4.4,0.4-6.5,1.2l-7.4,2.8c-0.7,0.3-1.4,0.4-2.2,0.4c-2.4,0-4.7-1.4-5.7-3.7l-3.3-7.2c-3-6.6-9.4-10.7-16.6-10.7S93,35.2,90,41.8l-3.3,7.2c-1,2.2-3.2,3.7-5.7,3.7c-0.7,0-1.5-0.1-2.2-0.4l-7.4-2.8c-2.1-0.8-4.3-1.2-6.5-1.2c-5.9,0-11.5,3-15,7.9c-3.4,5-4.2,11.1-2.1,16.7l2.8,7.4c1.1,3.1-0.3,6.5-3.3,7.9l-7.2,3.3c-6.6,3-10.7,9.4-10.7,16.6S33.8,121.6,40.4,124.6z M45.3,102.3l7.2-3.3c8.7-4,12.9-14.1,9.5-23l-2.8-7.4c-1-2.7,0-4.7,0.7-5.7c1.6-2.4,4.6-3.4,7.4-2.3l7.4,2.8c2.1,0.8,4.2,1.2,6.4,1.2c0,0,0,0,0,0c7.1,0,13.6-4.2,16.6-10.7l3.3-7.2c1.5-3.4,4.7-3.7,5.7-3.7s4.1,0.3,5.7,3.7l3.3,7.2c3,6.5,9.5,10.7,16.6,10.7c2.2,0,4.3-0.4,6.4-1.2l7.4-2.8c2.8-1,5.7,0,7.4,2.3c0.7,1,1.7,3,0.7,5.7l-2.8,7.4c-3.3,8.9,0.8,19,9.5,23l7.2,3.3c3.4,1.5,3.7,4.7,3.7,5.7s-0.3,4.1-3.7,5.7l-7.2,3.3c-8.7,4-12.9,14.1-9.5,23l2.8,7.4c1,2.7,0,4.7-0.7,5.7c-1.6,2.4-4.6,3.4-7.4,2.3l-7.4-2.8c-2.1-0.8-4.2-1.2-6.4-1.2c-7.1,0-13.6,4.2-16.6,10.7l-3.3,7.2c-1.5,3.4-4.7,3.7-5.7,3.7s-4.1-0.3-5.7-3.7l-3.3-7.2c-3-6.5-9.5-10.7-16.6-10.7c-2.2,0-4.3,0.4-6.4,1.2l-7.4,2.8c-2.8,1-5.7,0-7.4-2.3c-0.7-1-1.7-3-0.7-5.7l2.8-7.4c3.3-8.9-0.8-19-9.5-23l-7.2-3.3c-3.4-1.5-3.7-4.7-3.7-5.7S41.9,103.9,45.3,102.3z"/></svg></div>
  1342.  
  1343.  
  1344.  
  1345. <div id="accent">
  1346. <div id="ac">
  1347. <!--if you need help adding more muses, feel free to send me a message-->
  1348.  
  1349. <div id="cbox">
  1350. <div id="cname">name ; age</div>
  1351. <div id="clabel">The label ; Open</div>
  1352. <div id="faceclaim">faceclaim here</div>
  1353. <div id="cinfo"><b>- click the icon for more <i>!</i></b> ; a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. </div>
  1354. </div>
  1355. <div id="cim">
  1356. <a href="javascript:void(0)" class="tablink tabzact" onclick="openAlytut(event, 'TabzOne');" title="name"><img src="https://78.media.tumblr.com/1b4bc221246a245d4cd68d48a4537cc8/tumblr_inline_ozi14mr9GN1rvzd3s_540.png"></a></div>
  1357.  
  1358. <div id="cbox2">
  1359. <div id="cname">name ; age</div>
  1360. <div id="clabel">The label ; Open</div>
  1361. <div id="faceclaim">faceclaim here</div>
  1362. <div id="cinfo"><b>- click the icon for more <i>!</i></b> ; a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. </div>
  1363. </div>
  1364. <div id="cim2">
  1365. <a href="javascript:void(0)" class="tablink tabzact" onclick="openAlytut(event, 'TabzTwo');" title="name"><img src="https://78.media.tumblr.com/1b4bc221246a245d4cd68d48a4537cc8/tumblr_inline_ozi14mr9GN1rvzd3s_540.png"></a> </div>
  1366.  
  1367.  
  1368. <div id="cbox" style="margin-top:240px;">
  1369. <div id="cname">name ; age</div>
  1370. <div id="clabel">The label ; Open</div>
  1371. <div id="faceclaim">faceclaim here</div>
  1372. <div id="cinfo"><b>- click the icon for more <i>!</i></b> ; a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. </div>
  1373. </div>
  1374. <div id="cim" style="margin-top:240px;">
  1375. <a href="javascript:void(0)" class="tablink tabzact" onclick="openAlytut(event, 'TabzThree');" title="name"><img src="https://78.media.tumblr.com/1b4bc221246a245d4cd68d48a4537cc8/tumblr_inline_ozi14mr9GN1rvzd3s_540.png"></a>
  1376. </div>
  1377.  
  1378. <div id="cbox2" style="margin-top:345px;">
  1379. <div id="cname">name ; age</div>
  1380. <div id="clabel">The label ; Open</div>
  1381. <div id="faceclaim">faceclaim here</div>
  1382. <div id="cinfo"><b>- click the icon for more <i>!</i></b> ; a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. </div>
  1383. </div>
  1384. <div id="cim2" style="margin-top:345px;">
  1385. <a href="javascript:void(0)" class="tablink tabzact" onclick="openAlytut(event, 'TabzFour');" title="name"><img src="https://78.media.tumblr.com/1b4bc221246a245d4cd68d48a4537cc8/tumblr_inline_ozi14mr9GN1rvzd3s_540.png"></a>
  1386. </div>
  1387.  
  1388. <div id="cbox" style="margin-top:450px;">
  1389. <div id="cname">name ; age</div>
  1390. <div id="clabel">The label ; Open</div>
  1391. <div id="faceclaim">faceclaim here</div>
  1392. <div id="cinfo"><b>- click the icon for more <i>!</i></b> ; a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. </div>
  1393. </div>
  1394. <div id="cim" style="margin-top:450px;">
  1395. <a href="javascript:void(0)" class="tablink tabzact" onclick="openAlytut(event, 'TabzFive');" title="name"><img src="https://78.media.tumblr.com/1b4bc221246a245d4cd68d48a4537cc8/tumblr_inline_ozi14mr9GN1rvzd3s_540.png"></a>
  1396. </div>
  1397.  
  1398. <div id="cbox2" style="margin-top:560px;">
  1399. <div id="cname">name ; age</div>
  1400. <div id="clabel">The label ; Open</div>
  1401. <div id="faceclaim">faceclaim here</div>
  1402. <div id="cinfo"><b>- click the icon for more <i>!</i></b> ; a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. </div>
  1403. </div>
  1404. <div id="cim2" style="margin-top:560px;">
  1405. <a href="javascript:void(0)" class="tablink tabzact" onclick="openAlytut(event, 'TabzSix');" title="name"><img src="https://78.media.tumblr.com/1b4bc221246a245d4cd68d48a4537cc8/tumblr_inline_ozi14mr9GN1rvzd3s_540.png"></a>
  1406. </div>
  1407.  
  1408. <div id="cbox" style="margin-top:670px;">
  1409. <div id="cname">name ; age</div>
  1410. <div id="clabel">The label ; Open</div>
  1411. <div id="faceclaim">faceclaim here</div>
  1412. <div id="cinfo"><b>- click the icon for more <i>!</i></b> ; a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. </div>
  1413. </div>
  1414. <div id="cim" style="margin-top:670px;">
  1415. <a href="javascript:void(0)" class="tablink tabzact" onclick="openAlytut(event, 'TabzSeven');" title="name"><img src="https://78.media.tumblr.com/1b4bc221246a245d4cd68d48a4537cc8/tumblr_inline_ozi14mr9GN1rvzd3s_540.png"></a> </div>
  1416.  
  1417. <div id="cbox2" style="margin-top:780px;">
  1418. <div id="cname">name ; age</div>
  1419. <div id="clabel">The label ; Open</div>
  1420. <div id="faceclaim">faceclaim here</div>
  1421. <div id="cinfo"><b>- click the icon for more <i>!</i></b> ; a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. </div>
  1422. </div>
  1423. <div id="cim2" style="margin-top:780px;">
  1424. <a href="javascript:void(0)" class="tablink tabzact" onclick="openAlytut(event, 'TabzEight');" title="name"><img src="https://78.media.tumblr.com/1b4bc221246a245d4cd68d48a4537cc8/tumblr_inline_ozi14mr9GN1rvzd3s_540.png"></a> </div>
  1425.  
  1426. <div id="cbox" style="margin-top:890px;">
  1427. <div id="cname">name ; age</div>
  1428. <div id="clabel">The label ; Open</div>
  1429. <div id="faceclaim">faceclaim here</div>
  1430. <div id="cinfo"><b>- click the icon for more <i>!</i></b> ; a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. </div>
  1431. </div>
  1432. <div id="cim" style="margin-top:890px;">
  1433. <a href="javascript:void(0)" class="tablink tabzact" onclick="openAlytut(event, 'TabzNine');" title="name"><img src="https://78.media.tumblr.com/1b4bc221246a245d4cd68d48a4537cc8/tumblr_inline_ozi14mr9GN1rvzd3s_540.png"></a> </div>
  1434.  
  1435. <div id="cbox2" style="margin-top:1000px;">
  1436. <div id="cname">name ; age</div>
  1437. <div id="clabel">The label ; Open</div>
  1438. <div id="faceclaim">faceclaim here</div>
  1439. <div id="cinfo"><b>- click the icon for more <i>!</i></b> ; a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. </div>
  1440. </div>
  1441. <div id="cim2" style="margin-top:1000px;">
  1442. <a href="javascript:void(0)" class="tablink tabzact" onclick="openAlytut(event, 'TabzTen');" title="name"><img src="https://78.media.tumblr.com/1b4bc221246a245d4cd68d48a4537cc8/tumblr_inline_ozi14mr9GN1rvzd3s_540.png"></a> </div>
  1443.  
  1444. <div id="cbox" style="margin-top:1110px;">
  1445. <div id="cname">name ; age</div>
  1446. <div id="clabel">The label ; Open</div>
  1447. <div id="faceclaim">faceclaim here</div>
  1448. <div id="cinfo"><b>- click the icon for more <i>!</i></b> ; a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. </div>
  1449. </div>
  1450. <div id="cim" style="margin-top:1110px;">
  1451. <a href="javascript:void(0)" class="tablink tabzact" onclick="openAlytut(event, 'TabzEleven');" title="name"><img src="https://78.media.tumblr.com/1b4bc221246a245d4cd68d48a4537cc8/tumblr_inline_ozi14mr9GN1rvzd3s_540.png"></a>
  1452. </div>
  1453.  
  1454. <div id="cbox2" style="margin-top:1220px;">
  1455. <div id="cname">name ; age</div>
  1456. <div id="clabel">The label ; Open</div>
  1457. <div id="faceclaim">faceclaim here</div>
  1458. <div id="cinfo"><b>- click the icon for more <i>!</i></b> ; a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. a small bio for your muse can go here. do not exceed five lines. </div>
  1459. </div>
  1460. <div id="cim2" style="margin-top:1220px;">
  1461. <a href="javascript:void(0)" class="tablink tabzact" onclick="openAlytut(event, 'TabzTwelve');" title="name"><img src="https://78.media.tumblr.com/1b4bc221246a245d4cd68d48a4537cc8/tumblr_inline_ozi14mr9GN1rvzd3s_540.png"></a>
  1462. </div>
  1463. <!--end of muse links-->
  1464. </div>
  1465. <!--end of the front page-->
  1466. </div>
  1467.  
  1468.  
  1469.  
  1470.  
  1471.  
  1472. <!-- first muse box-->
  1473. <div id="TabzOne" class="tabzcon alytut" style="display:none">
  1474. <span onclick="this.parentElement.style.display='none'" class="tabzclose">
  1475. <a title="close">EXIT</a>
  1476. </span>
  1477.  
  1478. <div id="fcim"> <img src="https://78.media.tumblr.com/d1511adc3c9335751d3e1886a22184fd/tumblr_inline_ozi3mdge7x1rvzd3s_540.png"/> </div>
  1479. <div id="label">muse name - The label</div>
  1480. <div id="fcbox">
  1481. <div id="fcinfo"> you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls.
  1482. </div>
  1483. </div>
  1484.  
  1485. <!--iMessage box-->
  1486. <div id="ibox">name</div>
  1487. <div id="ibox2">
  1488. <ul class="convo" style="color:#fff;">
  1489. <li class="line_odd user_1">text one goes here. </li>
  1490. <li class="line_even user_2">or you can swap the lines so that the blue imessage is at the top.</li>
  1491. <li class="line_even user_2">you can put whatever you want here, in whatever order.</li>
  1492. <li class="line_odd user_1">this box scrolls by the way, so you can add more messages if you like.</li>
  1493. </ul>
  1494. </div>
  1495. <!--end of iMessage box-->
  1496.  
  1497.  
  1498.  
  1499. <!-- snapchat box and info-->
  1500. <div class="snap">
  1501.  
  1502. <div class="snapuser">snapuser</div>
  1503. <div class="snaptime">18h ago</div>
  1504. <div class="snapcap" style="margin-top:230px;">caption</div>
  1505. <div style="margin-top:0px;"><img src="https://78.media.tumblr.com/3504c178a1ffb7fbed77d98e805ef4f4/tumblr_inline_ozi3o62fbP1rvzd3s_540.png"></div>
  1506.  
  1507. <!-- copy from here -->
  1508. <div class="snap2">
  1509. <div class="snaptime" style="margin-top:-261px;">15h ago</div>
  1510. <!--<div class="snapcap" style="margin-top:-60px;">you can hide the caption box if you don't want to use it</div>-->
  1511. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/f694b50f53904660e3803e2f60da4789/tumblr_inline_ozi3p0MJJF1rvzd3s_540.png"></div></div>
  1512. <!--- to here. change 'snap2' to the next snap number -->
  1513.  
  1514. <!-- copy from here -->
  1515. <div class="snap3">
  1516. <div class="snaptime" style="margin-top:-261px;">8h ago</div>
  1517. <div class="snapcap" style="margin-top:-90px;">caption</div>
  1518. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/8a8b12ea1ff366c9741be95c724f181f/tumblr_inline_ozi3p0UpYY1rvzd3s_540.png"></div></div>
  1519. <!--- to here. change 'snap3' to the next snap number -->
  1520.  
  1521.  
  1522. <!-- copy from here -->
  1523. <div class="snap4">
  1524. <div class="snaptime" style="margin-top:-261px;">3h ago</div>
  1525. <div class="snapcap" style="margin-top:-90px;">caption</div>
  1526. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/b67af846b1ca76aef1f4301638864d8b/tumblr_inline_ozi3p9e4QI1rvzd3s_540.png"></div></div>
  1527. <!--- to here. change 'snap4' to the next snap number -->
  1528.  
  1529.  
  1530. <div class="snap5">
  1531. <div class="snaptime" style="margin-top:-261px;">3m ago</div>
  1532. <div class="snapcap" style="margin-top:-90px;">caption</div>
  1533. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/9af9cd6d13767f20dcbcab68d3bae2b1/tumblr_inline_ozi3prkUfg1rvzd3s_540.png"></div></div>
  1534.  
  1535.  
  1536. <div class="snap6">
  1537. <div class="snaptime" style="margin-top:-261px;">1m ago</div>
  1538. <div class="snapcap" style="margin-top:-90px;">caption</div>
  1539. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/dc3a3e4eead7f8abe1946055ae37b4e4/tumblr_inline_ozi3pyIgpm1rvzd3s_540.png"></div></div>
  1540. </div>
  1541. <!--end of snapchat box-->
  1542.  
  1543.  
  1544. <!--connections box-->
  1545. <div id="conbox">
  1546. <div id="conbox2">
  1547. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  1548. </div>
  1549.  
  1550.  
  1551.  
  1552. <div id="conicon"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/c70729ce8901968c74cd2fdd4064ee9d/tumblr_inline_ozi3mkORqC1rvzd3s_540.png"/></div></a>
  1553.  
  1554. <!-- 2nd connection-->
  1555. <div id="conbox3">
  1556. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  1557. </div>
  1558.  
  1559. <div id="conicon2"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/b1038815ee0e3c1ddac97cc10f59d2e2/tumblr_inline_ozi3mjpJJL1rvzd3s_540.png"/></div></a>
  1560.  
  1561.  
  1562. <!--3rd connection-->
  1563. <!--you can add more connections if you want, just copy from here -->
  1564.  
  1565. <div id="conbox2" style="margin-top:170px;">
  1566. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  1567. </div>
  1568.  
  1569. <div id="conicon" style="margin-top:170px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/2bd8435ce1cd93d7e22796ecb1bc44ab/tumblr_inline_ozi3mjWgKO1rvzd3s_540.png"/></div></a>
  1570.  
  1571. <!--4th connection-->
  1572.  
  1573. <div id="conbox3" style="margin-top:250px;">
  1574. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  1575. </div>
  1576.  
  1577. <div id="conicon2" style="margin-top:250px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/690039f56be111f5e89c514ada430396/tumblr_inline_ozi3mvqtZi1rvzd3s_540.png"/></div></a>
  1578.  
  1579. <!--to here, and change the 'margin-top'.-->
  1580.  
  1581.  
  1582.  
  1583. <!--5th connection-->
  1584. <!--you can add more connections if you want, just copy from here -->
  1585.  
  1586. <div id="conbox2" style="margin-top:330px;">
  1587. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  1588. </div>
  1589.  
  1590. <div id="conicon" style="margin-top:330px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/f3140f3c299f4c3bdb0b3c74f010a673/tumblr_inline_ozi3muIEFJ1rvzd3s_540.png"/></div></a>
  1591.  
  1592.  
  1593. <!--6th connection-->
  1594.  
  1595. <div id="conbox3" style="margin-top:410px;">
  1596. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  1597. </div>
  1598.  
  1599. <div id="conicon2" style="margin-top:410px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/dc8179b36a5759923b93cdcd5b776d0f/tumblr_inline_ozi3muQ3XN1rvzd3s_540.png"/></div></a>
  1600.  
  1601. <!--to here, and change the 'margin-top'.-->
  1602.  
  1603.  
  1604.  
  1605. </div>
  1606. <!-- end of connections box-->
  1607.  
  1608.  
  1609.  
  1610. <!--twitter-->
  1611. <!-- if you steal this part of my code, i WILL come after you-->
  1612. <div id="twitter">
  1613. <div id="twithead"><img src="https://78.media.tumblr.com/23ad5e786f5e71e993ae10ecc9dc3259/tumblr_inline_ozi3nx8QlX1rvzd3s_540.png"/></div>
  1614.  
  1615. <div id="twitbg">
  1616. <div id="twitname">name</div>
  1617. <div id="twituser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i></div>
  1618. <div id="twitdesc">Keep this description short. It shouldn't be longer than to lines.</div>
  1619. <div id="twitf"><b>50</b> Following <div style="margin-top:-14px; margin-left:100px;"><b>7.5m</b> Followers</div></div>
  1620. <div id="twitpro">Edit profile</div>
  1621. </div>
  1622.  
  1623. <div id="twitic"><img src="https://78.media.tumblr.com/d685c605911ce3829cded2f824a54385/tumblr_inline_ozi3nbxfj31rvzd3s_540.png"/></div>
  1624.  
  1625.  
  1626. <div id="twitborder"></div>
  1627. <div id="twitinfo">
  1628. <div style="margin-left:3px;"><b>Tweets</b></div>
  1629. <div style="margin-left:56px; margin-top:-16px;">Tweets & replies</div>
  1630. <div style="margin-left:168px; margin-top:-16px;">Media</div>
  1631. <div style="margin-left:218px; margin-top:-16px;">Likes</div>
  1632.  
  1633. </div>
  1634.  
  1635. <!--tweets and such go here-->
  1636.  
  1637. <div id="pinned">
  1638. <div id="pinfo">
  1639. <i class="fa fa-thumb-tack" aria-hidden="true"></i> Pinned Tweet
  1640. <div id="pname">name</div>
  1641. <div id="puser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h</div>
  1642. <div style="margin-top:3px; margin-left:193px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div>
  1643. </div>
  1644.  
  1645. <div id="pic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  1646.  
  1647. <div id="ptweet">photo caption.</div>
  1648.  
  1649.  
  1650. <div id="pim"> <a href="#?w=240" rel="box1" class="poplight" title="click me!"><img src="https://78.media.tumblr.com/557e5b97efa45710830293c69c743f30/tumblr_inline_ozi3naqqwC1rvzd3s_540.png"/></a></div>
  1651.  
  1652.  
  1653. <div id="ptagged">
  1654. twitter name and # others <!-- no more than "9" others btw -->
  1655. </div>
  1656.  
  1657. <div id="pnotes">
  1658. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  1659. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  1660. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  1661. </div>
  1662.  
  1663. <div id="pact">
  1664. <i class="fa fa-signal" aria-hidden="true"></i>
  1665. </div>
  1666. <!--end of pinned tweet-->
  1667. </div>
  1668.  
  1669.  
  1670. <!--pinned image pop up-->
  1671. <div id="box1" class="popup_block" style="height:395px;">
  1672.  
  1673. <div id="pinpop"><img src="https://78.media.tumblr.com/84674ef6fac489e6173246af5a5ff330/tumblr_inline_ozr3y46d151rvzd3s_540.png"/></div>
  1674.  
  1675. <div id="pinpopz">
  1676.  
  1677. <!--popup image caption box. hover over the image to view caption-->
  1678. <div id="ppopinf">
  1679. <div id="popname">name</div>
  1680. <div id="popuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h <div style="margin-top:-13px; margin-left:190px;"><span class="lnr lnr-chevron-down"></span></div> </div>
  1681.  
  1682.  
  1683. <div id="poptweet">keep this caption about two to three lines short. this box doesn't scroll. keep this caption about two to three lines short.</div>
  1684.  
  1685. <div id="poptagged">
  1686. twitter name and # others <!-- no more than "9" others btw --></div>
  1687.  
  1688. </div>
  1689. <!--end of caption box-->
  1690. </div>
  1691.  
  1692.  
  1693.  
  1694.  
  1695. <div id="popsep"></div>
  1696. <div id="popbox">
  1697.  
  1698. <!--popup box notes-->
  1699. <div id="popnotes">
  1700. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  1701. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  1702. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  1703. </div>
  1704.  
  1705. <div id="popmess">
  1706. <i class="fa fa-envelope-o" aria-hidden="true"></i></div>
  1707.  
  1708. <!--end of popup box notes -->
  1709. </div>
  1710.  
  1711. <!--end of image pop up-->
  1712. </div>
  1713. <!--end of 1st twitter box-->
  1714. </div>
  1715.  
  1716.  
  1717.  
  1718.  
  1719.  
  1720. <!--2nd twitter box for more tweets-->
  1721. <div id="twitter2">
  1722. <div id="twbg">
  1723.  
  1724. <!--1st tweet-->
  1725.  
  1726. <div id="twi">
  1727. <div id="twinfo">
  1728. <div id="twname">name</div>
  1729. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 10h</div>
  1730. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  1731.  
  1732.  
  1733. <div id="twpic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  1734.  
  1735. <div id="tweet">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  1736.  
  1737.  
  1738. <div id="twnotes">
  1739. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  1740. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  1741. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  1742. </div>
  1743.  
  1744. <div id="twact">
  1745. <i class="fa fa-signal" aria-hidden="true"></i>
  1746. </div>
  1747.  
  1748.  
  1749. <div id="twsep"></div>
  1750.  
  1751.  
  1752.  
  1753. <!--2nd tweet -->
  1754.  
  1755. <div id="twinfo" style="margin-top:112px;">
  1756. <div id="twname">name</div>
  1757. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  1758. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  1759.  
  1760.  
  1761. <div id="twpic" style="margin-top:112px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  1762.  
  1763. <div id="tweet" style="margin-top:133px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  1764.  
  1765.  
  1766. <div id="twnotes" style="margin-top:193px;">
  1767. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  1768. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  1769. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  1770. </div>
  1771.  
  1772. <div id="twact" style="margin-top:193px;">
  1773. <i class="fa fa-signal" aria-hidden="true"></i>
  1774. </div>
  1775.  
  1776.  
  1777. <div id="twsep" style="margin-top:210px;"></div>
  1778.  
  1779.  
  1780. <!--3rd tweet-->
  1781. <div id="twinfo" style="margin-top:218px;">
  1782. <div id="twname">name</div>
  1783. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  1784. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  1785.  
  1786.  
  1787. <div id="twpic" style="margin-top:218px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  1788.  
  1789. <div id="tweet" style="margin-top:237px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  1790.  
  1791.  
  1792. <div id="twnotes" style="margin-top:296px;">
  1793. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  1794. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  1795. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  1796. </div>
  1797.  
  1798. <div id="twact" style="margin-top:296px;">
  1799. <i class="fa fa-signal" aria-hidden="true"></i>
  1800. </div>
  1801.  
  1802. <div id="twsep" style="margin-top:313px;"></div>
  1803. <!--end of tweets-->
  1804. </div>
  1805. <!--end of 2nd twitter box-->
  1806. </div>
  1807. <!--end of twitter-->
  1808.  
  1809.  
  1810.  
  1811. <!--instagram-->
  1812. <div id='ig'>
  1813. <div id="igic"> <img src="https://78.media.tumblr.com/c0cc8dd37837fcd6d572236fdf089b21/tumblr_inline_ozi3q6yoLu1rvzd3s_540.png"/> </div>
  1814.  
  1815. <div id="iguser">
  1816. username <i class="fa fa-check-circle" aria-hidden="true" style="color:#519bd6;"></i>
  1817. </div>
  1818.  
  1819. <div id="igstats">
  1820. <b>###</b> posts <b>###m</b> followers <b>###</b> following
  1821. </div>
  1822.  
  1823. <div id="igdesc">
  1824. <b>name.</b> instagram bio goes here. don't make it longer than three lines <br>
  1825. <a href="/museurl" title="muse's url">site.com</a>
  1826. </div>
  1827.  
  1828.  
  1829. <div id="igposts">
  1830.  
  1831. <div id="igim"> <img src="https://78.media.tumblr.com/f11d0cc9ba78fdb7d98fc0aa386a0c9c/tumblr_inline_ozi3qprISd1rvzd3s_540.png"/> </div>
  1832.  
  1833.  
  1834. <div id="igim" style="margin-left:120px;"> <img src="https://78.media.tumblr.com/ff2836c8a6b56b18db7422832bbb757d/tumblr_inline_ozi3qqVFdP1rvzd3s_540.png"/> </div>
  1835.  
  1836.  
  1837. <div id="igim" style="margin-left:200px;"> <img src="https://78.media.tumblr.com/cce56591ef05ece7304268166297a5a5/tumblr_inline_ozi3qqgzfk1rvzd3s_540.png"/> </div>
  1838.  
  1839.  
  1840. <!--second row-->
  1841.  
  1842.  
  1843. <div id="igim" style="margin-top:85px;"> <img src="https://78.media.tumblr.com/af803c5d7fa334fed5c3b2daa4d65245/tumblr_inline_ozi3r0mSw41rvzd3s_540.png"/> </div>
  1844.  
  1845.  
  1846. <div id="igim" style="margin-top:85px; margin-left:120px;"> <img src="https://78.media.tumblr.com/e5bfc3c14783b6342df0499f671745d3/tumblr_inline_ozi3r06KXe1rvzd3s_540.png"/> </div>
  1847.  
  1848.  
  1849. <div id="igim" style="margin-top:85px; margin-left:200px;"> <img src="https://78.media.tumblr.com/5e311035b1f11f4ac75f0fdf35ea8f18/tumblr_inline_ozi3r13gHP1rvzd3s_540.png"/> </div>
  1850.  
  1851.  
  1852. </div>
  1853. <!--end of instagram-->
  1854. </div>
  1855.  
  1856. <!--end of first muse box-->
  1857. </div>
  1858. </div>
  1859.  
  1860.  
  1861.  
  1862. <!-- second muse box-->
  1863.  
  1864. <div id="TabzTwo" class="tabzcon alytut" style="display:none">
  1865. <span onclick="this.parentElement.style.display='none'" class="tabzclose">
  1866. <a title="close">EXIT</a>
  1867. </span>
  1868.  
  1869.  
  1870. <div id="fcim"> <img src="https://78.media.tumblr.com/d1511adc3c9335751d3e1886a22184fd/tumblr_inline_ozi3mdge7x1rvzd3s_540.png"/> </div>
  1871. <div id="label">muse name - The label</div>
  1872. <div id="fcbox">
  1873. <div id="fcinfo"> you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls.
  1874. </div>
  1875. </div>
  1876.  
  1877. <!--iMessage box-->
  1878. <div id="ibox">name</div>
  1879. <div id="ibox2">
  1880. <ul class="convo" style="color:#fff;">
  1881. <li class="line_odd user_1">text one goes here. </li>
  1882. <li class="line_even user_2">or you can swap the lines so that the blue imessage is at the top.</li>
  1883. <li class="line_even user_2">you can put whatever you want here, in whatever order.</li>
  1884. <li class="line_odd user_1">this box scrolls by the way, so you can add more messages if you like.</li>
  1885. </ul>
  1886. </div>
  1887. <!--end of iMessage box-->
  1888.  
  1889.  
  1890.  
  1891. <!-- snapchat box and info-->
  1892. <div class="snap">
  1893.  
  1894. <div class="snapuser">snapuser</div>
  1895. <div class="snaptime">18h ago</div>
  1896. <div class="snapcap" style="margin-top:230px;">caption</div>
  1897. <div style="margin-top:0px;"><img src="https://78.media.tumblr.com/3504c178a1ffb7fbed77d98e805ef4f4/tumblr_inline_ozi3o62fbP1rvzd3s_540.png"></div>
  1898.  
  1899. <!-- copy from here -->
  1900. <div class="snap2">
  1901. <div class="snaptime" style="margin-top:-261px;">15h ago</div>
  1902. <!--<div class="snapcap" style="margin-top:-60px;">you can hide the caption box if you don't want to use it</div>-->
  1903. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/f694b50f53904660e3803e2f60da4789/tumblr_inline_ozi3p0MJJF1rvzd3s_540.png"></div></div>
  1904. <!--- to here. change 'snap2' to the next snap number -->
  1905.  
  1906. <!-- copy from here -->
  1907. <div class="snap3">
  1908. <div class="snaptime" style="margin-top:-261px;">8h ago</div>
  1909. <div class="snapcap" style="margin-top:-90px;">caption</div>
  1910. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/8a8b12ea1ff366c9741be95c724f181f/tumblr_inline_ozi3p0UpYY1rvzd3s_540.png"></div></div>
  1911. <!--- to here. change 'snap3' to the next snap number -->
  1912.  
  1913.  
  1914. <!-- copy from here -->
  1915. <div class="snap4">
  1916. <div class="snaptime" style="margin-top:-261px;">3h ago</div>
  1917. <div class="snapcap" style="margin-top:-90px;">caption</div>
  1918. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/b67af846b1ca76aef1f4301638864d8b/tumblr_inline_ozi3p9e4QI1rvzd3s_540.png"></div></div>
  1919. <!--- to here. change 'snap4' to the next snap number -->
  1920.  
  1921.  
  1922. <div class="snap5">
  1923. <div class="snaptime" style="margin-top:-261px;">3m ago</div>
  1924. <div class="snapcap" style="margin-top:-90px;">caption</div>
  1925. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/9af9cd6d13767f20dcbcab68d3bae2b1/tumblr_inline_ozi3prkUfg1rvzd3s_540.png"></div></div>
  1926.  
  1927.  
  1928. <div class="snap6">
  1929. <div class="snaptime" style="margin-top:-261px;">1m ago</div>
  1930. <div class="snapcap" style="margin-top:-90px;">caption</div>
  1931. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/dc3a3e4eead7f8abe1946055ae37b4e4/tumblr_inline_ozi3pyIgpm1rvzd3s_540.png"></div></div>
  1932. </div>
  1933. <!--end of snapchat box-->
  1934.  
  1935.  
  1936. <!--connections box-->
  1937. <div id="conbox">
  1938. <div id="conbox2">
  1939. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  1940. </div>
  1941.  
  1942.  
  1943.  
  1944. <div id="conicon"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/c70729ce8901968c74cd2fdd4064ee9d/tumblr_inline_ozi3mkORqC1rvzd3s_540.png"/></div></a>
  1945.  
  1946. <!-- 2nd connection-->
  1947. <div id="conbox3">
  1948. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  1949. </div>
  1950.  
  1951. <div id="conicon2"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/b1038815ee0e3c1ddac97cc10f59d2e2/tumblr_inline_ozi3mjpJJL1rvzd3s_540.png"/></div></a>
  1952.  
  1953.  
  1954. <!--3rd connection-->
  1955. <!--you can add more connections if you want, just copy from here -->
  1956.  
  1957. <div id="conbox2" style="margin-top:170px;">
  1958. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  1959. </div>
  1960.  
  1961. <div id="conicon" style="margin-top:170px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/2bd8435ce1cd93d7e22796ecb1bc44ab/tumblr_inline_ozi3mjWgKO1rvzd3s_540.png"/></div></a>
  1962.  
  1963. <!--4th connection-->
  1964.  
  1965. <div id="conbox3" style="margin-top:250px;">
  1966. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  1967. </div>
  1968.  
  1969. <div id="conicon2" style="margin-top:250px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/690039f56be111f5e89c514ada430396/tumblr_inline_ozi3mvqtZi1rvzd3s_540.png"/></div></a>
  1970.  
  1971. <!--to here, and change the 'margin-top'.-->
  1972.  
  1973.  
  1974.  
  1975. <!--5th connection-->
  1976. <!--you can add more connections if you want, just copy from here -->
  1977.  
  1978. <div id="conbox2" style="margin-top:330px;">
  1979. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  1980. </div>
  1981.  
  1982. <div id="conicon" style="margin-top:330px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/f3140f3c299f4c3bdb0b3c74f010a673/tumblr_inline_ozi3muIEFJ1rvzd3s_540.png"/></div></a>
  1983.  
  1984.  
  1985. <!--6th connection-->
  1986.  
  1987. <div id="conbox3" style="margin-top:410px;">
  1988. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  1989. </div>
  1990.  
  1991. <div id="conicon2" style="margin-top:410px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/dc8179b36a5759923b93cdcd5b776d0f/tumblr_inline_ozi3muQ3XN1rvzd3s_540.png"/></div></a>
  1992.  
  1993. <!--to here, and change the 'margin-top'.-->
  1994.  
  1995.  
  1996.  
  1997. </div>
  1998. <!-- end of connections box-->
  1999.  
  2000.  
  2001.  
  2002. <!--twitter-->
  2003. <!-- if you steal this part of my code, i WILL come after you-->
  2004. <div id="twitter">
  2005. <div id="twithead"><img src="https://78.media.tumblr.com/23ad5e786f5e71e993ae10ecc9dc3259/tumblr_inline_ozi3nx8QlX1rvzd3s_540.png"/></div>
  2006.  
  2007. <div id="twitbg">
  2008. <div id="twitname">name</div>
  2009. <div id="twituser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i></div>
  2010. <div id="twitdesc">Keep this description short. It shouldn't be longer than to lines.</div>
  2011. <div id="twitf"><b>50</b> Following <div style="margin-top:-14px; margin-left:100px;"><b>7.5m</b> Followers</div></div>
  2012. <div id="twitpro">Edit profile</div>
  2013. </div>
  2014.  
  2015. <div id="twitic"><img src="https://78.media.tumblr.com/d685c605911ce3829cded2f824a54385/tumblr_inline_ozi3nbxfj31rvzd3s_540.png"/></div>
  2016.  
  2017.  
  2018. <div id="twitborder"></div>
  2019. <div id="twitinfo">
  2020. <div style="margin-left:3px;"><b>Tweets</b></div>
  2021. <div style="margin-left:56px; margin-top:-16px;">Tweets & replies</div>
  2022. <div style="margin-left:168px; margin-top:-16px;">Media</div>
  2023. <div style="margin-left:218px; margin-top:-16px;">Likes</div>
  2024.  
  2025. </div>
  2026.  
  2027. <!--tweets and such go here-->
  2028.  
  2029. <div id="pinned">
  2030. <div id="pinfo">
  2031. <i class="fa fa-thumb-tack" aria-hidden="true"></i> Pinned Tweet
  2032. <div id="pname">name</div>
  2033. <div id="puser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h</div>
  2034. <div style="margin-top:3px; margin-left:193px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div>
  2035. </div>
  2036.  
  2037. <div id="pic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  2038.  
  2039. <div id="ptweet">photo caption.</div>
  2040.  
  2041.  
  2042. <div id="pim"> <a href="#?w=240" rel="box2" class="poplight" title="click me!"><img src="https://78.media.tumblr.com/557e5b97efa45710830293c69c743f30/tumblr_inline_ozi3naqqwC1rvzd3s_540.png"/></a></div>
  2043.  
  2044.  
  2045. <div id="ptagged">
  2046. twitter name and # others <!-- no more than "9" others btw -->
  2047. </div>
  2048.  
  2049. <div id="pnotes">
  2050. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  2051. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  2052. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  2053. </div>
  2054.  
  2055. <div id="pact">
  2056. <i class="fa fa-signal" aria-hidden="true"></i>
  2057. </div>
  2058. <!--end of pinned tweet-->
  2059. </div>
  2060.  
  2061.  
  2062. <!--pinned image pop up-->
  2063. <div id="box2" class="popup_block" style="height:395px;">
  2064.  
  2065. <div id="pinpop"><img src="https://78.media.tumblr.com/84674ef6fac489e6173246af5a5ff330/tumblr_inline_ozr3y46d151rvzd3s_540.png"/></div>
  2066.  
  2067. <div id="pinpopz">
  2068.  
  2069. <!--popup image caption box. hover over the image to view caption-->
  2070. <div id="ppopinf">
  2071. <div id="popname">name</div>
  2072. <div id="popuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h <div style="margin-top:-13px; margin-left:190px;"><span class="lnr lnr-chevron-down"></span></div> </div>
  2073.  
  2074.  
  2075. <div id="poptweet">keep this caption about two to three lines short. this box doesn't scroll. keep this caption about two to three lines short.</div>
  2076.  
  2077. <div id="poptagged">
  2078. twitter name and # others <!-- no more than "9" others btw --></div>
  2079.  
  2080. </div>
  2081. <!--end of caption box-->
  2082. </div>
  2083.  
  2084.  
  2085.  
  2086.  
  2087. <div id="popsep"></div>
  2088. <div id="popbox">
  2089.  
  2090. <!--popup box notes-->
  2091. <div id="popnotes">
  2092. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  2093. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  2094. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  2095. </div>
  2096.  
  2097. <div id="popmess">
  2098. <i class="fa fa-envelope-o" aria-hidden="true"></i></div>
  2099.  
  2100. <!--end of popup box notes -->
  2101. </div>
  2102.  
  2103. <!--end of image pop up-->
  2104. </div>
  2105. <!--end of 1st twitter box-->
  2106. </div>
  2107.  
  2108.  
  2109.  
  2110.  
  2111.  
  2112. <!--2nd twitter box for more tweets-->
  2113. <div id="twitter2">
  2114. <div id="twbg">
  2115.  
  2116. <!--1st tweet-->
  2117.  
  2118. <div id="twi">
  2119. <div id="twinfo">
  2120. <div id="twname">name</div>
  2121. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 10h</div>
  2122. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  2123.  
  2124.  
  2125. <div id="twpic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  2126.  
  2127. <div id="tweet">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  2128.  
  2129.  
  2130. <div id="twnotes">
  2131. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  2132. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  2133. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  2134. </div>
  2135.  
  2136. <div id="twact">
  2137. <i class="fa fa-signal" aria-hidden="true"></i>
  2138. </div>
  2139.  
  2140.  
  2141. <div id="twsep"></div>
  2142.  
  2143.  
  2144.  
  2145. <!--2nd tweet -->
  2146.  
  2147. <div id="twinfo" style="margin-top:112px;">
  2148. <div id="twname">name</div>
  2149. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  2150. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  2151.  
  2152.  
  2153. <div id="twpic" style="margin-top:112px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  2154.  
  2155. <div id="tweet" style="margin-top:133px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  2156.  
  2157.  
  2158. <div id="twnotes" style="margin-top:193px;">
  2159. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  2160. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  2161. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  2162. </div>
  2163.  
  2164. <div id="twact" style="margin-top:193px;">
  2165. <i class="fa fa-signal" aria-hidden="true"></i>
  2166. </div>
  2167.  
  2168.  
  2169. <div id="twsep" style="margin-top:210px;"></div>
  2170.  
  2171.  
  2172. <!--3rd tweet-->
  2173. <div id="twinfo" style="margin-top:218px;">
  2174. <div id="twname">name</div>
  2175. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  2176. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  2177.  
  2178.  
  2179. <div id="twpic" style="margin-top:218px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  2180.  
  2181. <div id="tweet" style="margin-top:237px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  2182.  
  2183.  
  2184. <div id="twnotes" style="margin-top:296px;">
  2185. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  2186. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  2187. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  2188. </div>
  2189.  
  2190. <div id="twact" style="margin-top:296px;">
  2191. <i class="fa fa-signal" aria-hidden="true"></i>
  2192. </div>
  2193.  
  2194. <div id="twsep" style="margin-top:313px;"></div>
  2195. <!--end of tweets-->
  2196. </div>
  2197. <!--end of 2nd twitter box-->
  2198. </div>
  2199. <!--end of twitter-->
  2200.  
  2201.  
  2202.  
  2203. <!--instagram-->
  2204. <div id='ig'>
  2205. <div id="igic"> <img src="https://78.media.tumblr.com/c0cc8dd37837fcd6d572236fdf089b21/tumblr_inline_ozi3q6yoLu1rvzd3s_540.png"/> </div>
  2206.  
  2207. <div id="iguser">
  2208. username <i class="fa fa-check-circle" aria-hidden="true" style="color:#519bd6;"></i>
  2209. </div>
  2210.  
  2211. <div id="igstats">
  2212. <b>###</b> posts <b>###m</b> followers <b>###</b> following
  2213. </div>
  2214.  
  2215. <div id="igdesc">
  2216. <b>name.</b> instagram bio goes here. don't make it longer than three lines <br>
  2217. <a href="/museurl" title="muse's url">site.com</a>
  2218. </div>
  2219.  
  2220.  
  2221. <div id="igposts">
  2222.  
  2223. <div id="igim"> <img src="https://78.media.tumblr.com/f11d0cc9ba78fdb7d98fc0aa386a0c9c/tumblr_inline_ozi3qprISd1rvzd3s_540.png"/> </div>
  2224.  
  2225.  
  2226. <div id="igim" style="margin-left:120px;"> <img src="https://78.media.tumblr.com/ff2836c8a6b56b18db7422832bbb757d/tumblr_inline_ozi3qqVFdP1rvzd3s_540.png"/> </div>
  2227.  
  2228.  
  2229. <div id="igim" style="margin-left:200px;"> <img src="https://78.media.tumblr.com/cce56591ef05ece7304268166297a5a5/tumblr_inline_ozi3qqgzfk1rvzd3s_540.png"/> </div>
  2230.  
  2231.  
  2232. <!--second row-->
  2233.  
  2234.  
  2235. <div id="igim" style="margin-top:85px;"> <img src="https://78.media.tumblr.com/af803c5d7fa334fed5c3b2daa4d65245/tumblr_inline_ozi3r0mSw41rvzd3s_540.png"/> </div>
  2236.  
  2237.  
  2238. <div id="igim" style="margin-top:85px; margin-left:120px;"> <img src="https://78.media.tumblr.com/e5bfc3c14783b6342df0499f671745d3/tumblr_inline_ozi3r06KXe1rvzd3s_540.png"/> </div>
  2239.  
  2240.  
  2241. <div id="igim" style="margin-top:85px; margin-left:200px;"> <img src="https://78.media.tumblr.com/5e311035b1f11f4ac75f0fdf35ea8f18/tumblr_inline_ozi3r13gHP1rvzd3s_540.png"/> </div>
  2242.  
  2243.  
  2244. </div>
  2245. <!--end of instagram-->
  2246. </div>
  2247.  
  2248. <!--end of second muse box-->
  2249. </div>
  2250. </div>
  2251.  
  2252.  
  2253.  
  2254.  
  2255. <!-- third muse box-->
  2256.  
  2257. <div id="TabzThree" class="tabzcon alytut" style="display:none">
  2258. <span onclick="this.parentElement.style.display='none'" class="tabzclose">
  2259. <a title="close">EXIT</a>
  2260. </span>
  2261.  
  2262.  
  2263. <div id="fcim"> <img src="https://78.media.tumblr.com/d1511adc3c9335751d3e1886a22184fd/tumblr_inline_ozi3mdge7x1rvzd3s_540.png"/> </div>
  2264. <div id="label">muse name - The label</div>
  2265. <div id="fcbox">
  2266. <div id="fcinfo"> you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls.
  2267. </div>
  2268. </div>
  2269.  
  2270. <!--iMessage box-->
  2271. <div id="ibox">name</div>
  2272. <div id="ibox2">
  2273. <ul class="convo" style="color:#fff;">
  2274. <li class="line_odd user_1">text one goes here. </li>
  2275. <li class="line_even user_2">or you can swap the lines so that the blue imessage is at the top.</li>
  2276. <li class="line_even user_2">you can put whatever you want here, in whatever order.</li>
  2277. <li class="line_odd user_1">this box scrolls by the way, so you can add more messages if you like.</li>
  2278. </ul>
  2279. </div>
  2280. <!--end of iMessage box-->
  2281.  
  2282.  
  2283.  
  2284. <!-- snapchat box and info-->
  2285. <div class="snap">
  2286.  
  2287. <div class="snapuser">snapuser</div>
  2288. <div class="snaptime">18h ago</div>
  2289. <div class="snapcap" style="margin-top:230px;">caption</div>
  2290. <div style="margin-top:0px;"><img src="https://78.media.tumblr.com/3504c178a1ffb7fbed77d98e805ef4f4/tumblr_inline_ozi3o62fbP1rvzd3s_540.png"></div>
  2291.  
  2292. <!-- copy from here -->
  2293. <div class="snap2">
  2294. <div class="snaptime" style="margin-top:-261px;">15h ago</div>
  2295. <!--<div class="snapcap" style="margin-top:-60px;">you can hide the caption box if you don't want to use it</div>-->
  2296. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/f694b50f53904660e3803e2f60da4789/tumblr_inline_ozi3p0MJJF1rvzd3s_540.png"></div></div>
  2297. <!--- to here. change 'snap2' to the next snap number -->
  2298.  
  2299. <!-- copy from here -->
  2300. <div class="snap3">
  2301. <div class="snaptime" style="margin-top:-261px;">8h ago</div>
  2302. <div class="snapcap" style="margin-top:-90px;">caption</div>
  2303. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/8a8b12ea1ff366c9741be95c724f181f/tumblr_inline_ozi3p0UpYY1rvzd3s_540.png"></div></div>
  2304. <!--- to here. change 'snap3' to the next snap number -->
  2305.  
  2306.  
  2307. <!-- copy from here -->
  2308. <div class="snap4">
  2309. <div class="snaptime" style="margin-top:-261px;">3h ago</div>
  2310. <div class="snapcap" style="margin-top:-90px;">caption</div>
  2311. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/b67af846b1ca76aef1f4301638864d8b/tumblr_inline_ozi3p9e4QI1rvzd3s_540.png"></div></div>
  2312. <!--- to here. change 'snap4' to the next snap number -->
  2313.  
  2314.  
  2315. <div class="snap5">
  2316. <div class="snaptime" style="margin-top:-261px;">3m ago</div>
  2317. <div class="snapcap" style="margin-top:-90px;">caption</div>
  2318. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/9af9cd6d13767f20dcbcab68d3bae2b1/tumblr_inline_ozi3prkUfg1rvzd3s_540.png"></div></div>
  2319.  
  2320.  
  2321. <div class="snap6">
  2322. <div class="snaptime" style="margin-top:-261px;">1m ago</div>
  2323. <div class="snapcap" style="margin-top:-90px;">caption</div>
  2324. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/dc3a3e4eead7f8abe1946055ae37b4e4/tumblr_inline_ozi3pyIgpm1rvzd3s_540.png"></div></div>
  2325. </div>
  2326. <!--end of snapchat box-->
  2327.  
  2328.  
  2329. <!--connections box-->
  2330. <div id="conbox">
  2331. <div id="conbox2">
  2332. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  2333. </div>
  2334.  
  2335.  
  2336.  
  2337. <div id="conicon"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/c70729ce8901968c74cd2fdd4064ee9d/tumblr_inline_ozi3mkORqC1rvzd3s_540.png"/></div></a>
  2338.  
  2339. <!-- 2nd connection-->
  2340. <div id="conbox3">
  2341. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  2342. </div>
  2343.  
  2344. <div id="conicon2"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/b1038815ee0e3c1ddac97cc10f59d2e2/tumblr_inline_ozi3mjpJJL1rvzd3s_540.png"/></div></a>
  2345.  
  2346.  
  2347. <!--3rd connection-->
  2348. <!--you can add more connections if you want, just copy from here -->
  2349.  
  2350. <div id="conbox2" style="margin-top:170px;">
  2351. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  2352. </div>
  2353.  
  2354. <div id="conicon" style="margin-top:170px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/2bd8435ce1cd93d7e22796ecb1bc44ab/tumblr_inline_ozi3mjWgKO1rvzd3s_540.png"/></div></a>
  2355.  
  2356. <!--4th connection-->
  2357.  
  2358. <div id="conbox3" style="margin-top:250px;">
  2359. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  2360. </div>
  2361.  
  2362. <div id="conicon2" style="margin-top:250px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/690039f56be111f5e89c514ada430396/tumblr_inline_ozi3mvqtZi1rvzd3s_540.png"/></div></a>
  2363.  
  2364. <!--to here, and change the 'margin-top'.-->
  2365.  
  2366.  
  2367.  
  2368. <!--5th connection-->
  2369. <!--you can add more connections if you want, just copy from here -->
  2370.  
  2371. <div id="conbox2" style="margin-top:330px;">
  2372. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  2373. </div>
  2374.  
  2375. <div id="conicon" style="margin-top:330px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/f3140f3c299f4c3bdb0b3c74f010a673/tumblr_inline_ozi3muIEFJ1rvzd3s_540.png"/></div></a>
  2376.  
  2377.  
  2378. <!--6th connection-->
  2379.  
  2380. <div id="conbox3" style="margin-top:410px;">
  2381. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  2382. </div>
  2383.  
  2384. <div id="conicon2" style="margin-top:410px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/dc8179b36a5759923b93cdcd5b776d0f/tumblr_inline_ozi3muQ3XN1rvzd3s_540.png"/></div></a>
  2385.  
  2386. <!--to here, and change the 'margin-top'.-->
  2387.  
  2388.  
  2389.  
  2390. </div>
  2391. <!-- end of connections box-->
  2392.  
  2393.  
  2394.  
  2395. <!--twitter-->
  2396. <!-- if you steal this part of my code, i WILL come after you-->
  2397. <div id="twitter">
  2398. <div id="twithead"><img src="https://78.media.tumblr.com/23ad5e786f5e71e993ae10ecc9dc3259/tumblr_inline_ozi3nx8QlX1rvzd3s_540.png"/></div>
  2399.  
  2400. <div id="twitbg">
  2401. <div id="twitname">name</div>
  2402. <div id="twituser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i></div>
  2403. <div id="twitdesc">Keep this description short. It shouldn't be longer than to lines.</div>
  2404. <div id="twitf"><b>50</b> Following <div style="margin-top:-14px; margin-left:100px;"><b>7.5m</b> Followers</div></div>
  2405. <div id="twitpro">Edit profile</div>
  2406. </div>
  2407.  
  2408. <div id="twitic"><img src="https://78.media.tumblr.com/d685c605911ce3829cded2f824a54385/tumblr_inline_ozi3nbxfj31rvzd3s_540.png"/></div>
  2409.  
  2410.  
  2411. <div id="twitborder"></div>
  2412. <div id="twitinfo">
  2413. <div style="margin-left:3px;"><b>Tweets</b></div>
  2414. <div style="margin-left:56px; margin-top:-16px;">Tweets & replies</div>
  2415. <div style="margin-left:168px; margin-top:-16px;">Media</div>
  2416. <div style="margin-left:218px; margin-top:-16px;">Likes</div>
  2417.  
  2418. </div>
  2419.  
  2420. <!--tweets and such go here-->
  2421.  
  2422. <div id="pinned">
  2423. <div id="pinfo">
  2424. <i class="fa fa-thumb-tack" aria-hidden="true"></i> Pinned Tweet
  2425. <div id="pname">name</div>
  2426. <div id="puser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h</div>
  2427. <div style="margin-top:3px; margin-left:193px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div>
  2428. </div>
  2429.  
  2430. <div id="pic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  2431.  
  2432. <div id="ptweet">photo caption.</div>
  2433.  
  2434.  
  2435. <div id="pim"> <a href="#?w=240" rel="box3" class="poplight" title="click me!"><img src="https://78.media.tumblr.com/557e5b97efa45710830293c69c743f30/tumblr_inline_ozi3naqqwC1rvzd3s_540.png"/></a></div>
  2436.  
  2437.  
  2438. <div id="ptagged">
  2439. twitter name and # others <!-- no more than "9" others btw -->
  2440. </div>
  2441.  
  2442. <div id="pnotes">
  2443. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  2444. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  2445. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  2446. </div>
  2447.  
  2448. <div id="pact">
  2449. <i class="fa fa-signal" aria-hidden="true"></i>
  2450. </div>
  2451. <!--end of pinned tweet-->
  2452. </div>
  2453.  
  2454.  
  2455. <!--pinned image pop up-->
  2456. <div id="box3" class="popup_block" style="height:395px;">
  2457.  
  2458. <div id="pinpop"><img src="https://78.media.tumblr.com/84674ef6fac489e6173246af5a5ff330/tumblr_inline_ozr3y46d151rvzd3s_540.png"/></div>
  2459.  
  2460. <div id="pinpopz">
  2461.  
  2462. <!--popup image caption box. hover over the image to view caption-->
  2463. <div id="ppopinf">
  2464. <div id="popname">name</div>
  2465. <div id="popuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h <div style="margin-top:-13px; margin-left:190px;"><span class="lnr lnr-chevron-down"></span></div> </div>
  2466.  
  2467.  
  2468. <div id="poptweet">keep this caption about two to three lines short. this box doesn't scroll. keep this caption about two to three lines short.</div>
  2469.  
  2470. <div id="poptagged">
  2471. twitter name and # others <!-- no more than "9" others btw --></div>
  2472.  
  2473. </div>
  2474. <!--end of caption box-->
  2475. </div>
  2476.  
  2477.  
  2478.  
  2479.  
  2480. <div id="popsep"></div>
  2481. <div id="popbox">
  2482.  
  2483. <!--popup box notes-->
  2484. <div id="popnotes">
  2485. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  2486. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  2487. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  2488. </div>
  2489.  
  2490. <div id="popmess">
  2491. <i class="fa fa-envelope-o" aria-hidden="true"></i></div>
  2492.  
  2493. <!--end of popup box notes -->
  2494. </div>
  2495.  
  2496. <!--end of image pop up-->
  2497. </div>
  2498. <!--end of 1st twitter box-->
  2499. </div>
  2500.  
  2501.  
  2502.  
  2503.  
  2504.  
  2505. <!--2nd twitter box for more tweets-->
  2506. <div id="twitter2">
  2507. <div id="twbg">
  2508.  
  2509. <!--1st tweet-->
  2510.  
  2511. <div id="twi">
  2512. <div id="twinfo">
  2513. <div id="twname">name</div>
  2514. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 10h</div>
  2515. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  2516.  
  2517.  
  2518. <div id="twpic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  2519.  
  2520. <div id="tweet">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  2521.  
  2522.  
  2523. <div id="twnotes">
  2524. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  2525. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  2526. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  2527. </div>
  2528.  
  2529. <div id="twact">
  2530. <i class="fa fa-signal" aria-hidden="true"></i>
  2531. </div>
  2532.  
  2533.  
  2534. <div id="twsep"></div>
  2535.  
  2536.  
  2537.  
  2538. <!--2nd tweet -->
  2539.  
  2540. <div id="twinfo" style="margin-top:112px;">
  2541. <div id="twname">name</div>
  2542. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  2543. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  2544.  
  2545.  
  2546. <div id="twpic" style="margin-top:112px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  2547.  
  2548. <div id="tweet" style="margin-top:133px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  2549.  
  2550.  
  2551. <div id="twnotes" style="margin-top:193px;">
  2552. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  2553. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  2554. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  2555. </div>
  2556.  
  2557. <div id="twact" style="margin-top:193px;">
  2558. <i class="fa fa-signal" aria-hidden="true"></i>
  2559. </div>
  2560.  
  2561.  
  2562. <div id="twsep" style="margin-top:210px;"></div>
  2563.  
  2564.  
  2565. <!--3rd tweet-->
  2566. <div id="twinfo" style="margin-top:218px;">
  2567. <div id="twname">name</div>
  2568. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  2569. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  2570.  
  2571.  
  2572. <div id="twpic" style="margin-top:218px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  2573.  
  2574. <div id="tweet" style="margin-top:237px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  2575.  
  2576.  
  2577. <div id="twnotes" style="margin-top:296px;">
  2578. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  2579. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  2580. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  2581. </div>
  2582.  
  2583. <div id="twact" style="margin-top:296px;">
  2584. <i class="fa fa-signal" aria-hidden="true"></i>
  2585. </div>
  2586.  
  2587. <div id="twsep" style="margin-top:313px;"></div>
  2588. <!--end of tweets-->
  2589. </div>
  2590. <!--end of 2nd twitter box-->
  2591. </div>
  2592. <!--end of twitter-->
  2593.  
  2594.  
  2595.  
  2596. <!--instagram-->
  2597. <div id='ig'>
  2598. <div id="igic"> <img src="https://78.media.tumblr.com/c0cc8dd37837fcd6d572236fdf089b21/tumblr_inline_ozi3q6yoLu1rvzd3s_540.png"/> </div>
  2599.  
  2600. <div id="iguser">
  2601. username <i class="fa fa-check-circle" aria-hidden="true" style="color:#519bd6;"></i>
  2602. </div>
  2603.  
  2604. <div id="igstats">
  2605. <b>###</b> posts <b>###m</b> followers <b>###</b> following
  2606. </div>
  2607.  
  2608. <div id="igdesc">
  2609. <b>name.</b> instagram bio goes here. don't make it longer than three lines <br>
  2610. <a href="/museurl" title="muse's url">site.com</a>
  2611. </div>
  2612.  
  2613.  
  2614. <div id="igposts">
  2615.  
  2616. <div id="igim"> <img src="https://78.media.tumblr.com/f11d0cc9ba78fdb7d98fc0aa386a0c9c/tumblr_inline_ozi3qprISd1rvzd3s_540.png"/> </div>
  2617.  
  2618.  
  2619. <div id="igim" style="margin-left:120px;"> <img src="https://78.media.tumblr.com/ff2836c8a6b56b18db7422832bbb757d/tumblr_inline_ozi3qqVFdP1rvzd3s_540.png"/> </div>
  2620.  
  2621.  
  2622. <div id="igim" style="margin-left:200px;"> <img src="https://78.media.tumblr.com/cce56591ef05ece7304268166297a5a5/tumblr_inline_ozi3qqgzfk1rvzd3s_540.png"/> </div>
  2623.  
  2624.  
  2625. <!--second row-->
  2626.  
  2627.  
  2628. <div id="igim" style="margin-top:85px;"> <img src="https://78.media.tumblr.com/af803c5d7fa334fed5c3b2daa4d65245/tumblr_inline_ozi3r0mSw41rvzd3s_540.png"/> </div>
  2629.  
  2630.  
  2631. <div id="igim" style="margin-top:85px; margin-left:120px;"> <img src="https://78.media.tumblr.com/e5bfc3c14783b6342df0499f671745d3/tumblr_inline_ozi3r06KXe1rvzd3s_540.png"/> </div>
  2632.  
  2633.  
  2634. <div id="igim" style="margin-top:85px; margin-left:200px;"> <img src="https://78.media.tumblr.com/5e311035b1f11f4ac75f0fdf35ea8f18/tumblr_inline_ozi3r13gHP1rvzd3s_540.png"/> </div>
  2635.  
  2636.  
  2637. </div>
  2638. <!--end of instagram-->
  2639. </div>
  2640.  
  2641. <!--end of third muse box-->
  2642. </div>
  2643. </div>
  2644.  
  2645.  
  2646.  
  2647.  
  2648. <!-- fourth muse box-->
  2649.  
  2650. <div id="TabzFour" class="tabzcon alytut" style="display:none">
  2651. <span onclick="this.parentElement.style.display='none'" class="tabzclose">
  2652. <a title="close">EXIT</a>
  2653. </span>
  2654.  
  2655.  
  2656. <div id="fcim"> <img src="https://78.media.tumblr.com/d1511adc3c9335751d3e1886a22184fd/tumblr_inline_ozi3mdge7x1rvzd3s_540.png"/> </div>
  2657. <div id="label">muse name - The label</div>
  2658. <div id="fcbox">
  2659. <div id="fcinfo"> you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls.
  2660. </div>
  2661. </div>
  2662.  
  2663. <!--iMessage box-->
  2664. <div id="ibox">name</div>
  2665. <div id="ibox2">
  2666. <ul class="convo" style="color:#fff;">
  2667. <li class="line_odd user_1">text one goes here. </li>
  2668. <li class="line_even user_2">or you can swap the lines so that the blue imessage is at the top.</li>
  2669. <li class="line_even user_2">you can put whatever you want here, in whatever order.</li>
  2670. <li class="line_odd user_1">this box scrolls by the way, so you can add more messages if you like.</li>
  2671. </ul>
  2672. </div>
  2673. <!--end of iMessage box-->
  2674.  
  2675.  
  2676.  
  2677. <!-- snapchat box and info-->
  2678. <div class="snap">
  2679.  
  2680. <div class="snapuser">snapuser</div>
  2681. <div class="snaptime">18h ago</div>
  2682. <div class="snapcap" style="margin-top:230px;">caption</div>
  2683. <div style="margin-top:0px;"><img src="https://78.media.tumblr.com/3504c178a1ffb7fbed77d98e805ef4f4/tumblr_inline_ozi3o62fbP1rvzd3s_540.png"></div>
  2684.  
  2685. <!-- copy from here -->
  2686. <div class="snap2">
  2687. <div class="snaptime" style="margin-top:-261px;">15h ago</div>
  2688. <!--<div class="snapcap" style="margin-top:-60px;">you can hide the caption box if you don't want to use it</div>-->
  2689. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/f694b50f53904660e3803e2f60da4789/tumblr_inline_ozi3p0MJJF1rvzd3s_540.png"></div></div>
  2690. <!--- to here. change 'snap2' to the next snap number -->
  2691.  
  2692. <!-- copy from here -->
  2693. <div class="snap3">
  2694. <div class="snaptime" style="margin-top:-261px;">8h ago</div>
  2695. <div class="snapcap" style="margin-top:-90px;">caption</div>
  2696. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/8a8b12ea1ff366c9741be95c724f181f/tumblr_inline_ozi3p0UpYY1rvzd3s_540.png"></div></div>
  2697. <!--- to here. change 'snap3' to the next snap number -->
  2698.  
  2699.  
  2700. <!-- copy from here -->
  2701. <div class="snap4">
  2702. <div class="snaptime" style="margin-top:-261px;">3h ago</div>
  2703. <div class="snapcap" style="margin-top:-90px;">caption</div>
  2704. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/b67af846b1ca76aef1f4301638864d8b/tumblr_inline_ozi3p9e4QI1rvzd3s_540.png"></div></div>
  2705. <!--- to here. change 'snap4' to the next snap number -->
  2706.  
  2707.  
  2708. <div class="snap5">
  2709. <div class="snaptime" style="margin-top:-261px;">3m ago</div>
  2710. <div class="snapcap" style="margin-top:-90px;">caption</div>
  2711. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/9af9cd6d13767f20dcbcab68d3bae2b1/tumblr_inline_ozi3prkUfg1rvzd3s_540.png"></div></div>
  2712.  
  2713.  
  2714. <div class="snap6">
  2715. <div class="snaptime" style="margin-top:-261px;">1m ago</div>
  2716. <div class="snapcap" style="margin-top:-90px;">caption</div>
  2717. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/dc3a3e4eead7f8abe1946055ae37b4e4/tumblr_inline_ozi3pyIgpm1rvzd3s_540.png"></div></div>
  2718. </div>
  2719. <!--end of snapchat box-->
  2720.  
  2721.  
  2722. <!--connections box-->
  2723. <div id="conbox">
  2724. <div id="conbox2">
  2725. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  2726. </div>
  2727.  
  2728.  
  2729.  
  2730. <div id="conicon"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/c70729ce8901968c74cd2fdd4064ee9d/tumblr_inline_ozi3mkORqC1rvzd3s_540.png"/></div></a>
  2731.  
  2732. <!-- 2nd connection-->
  2733. <div id="conbox3">
  2734. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  2735. </div>
  2736.  
  2737. <div id="conicon2"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/b1038815ee0e3c1ddac97cc10f59d2e2/tumblr_inline_ozi3mjpJJL1rvzd3s_540.png"/></div></a>
  2738.  
  2739.  
  2740. <!--3rd connection-->
  2741. <!--you can add more connections if you want, just copy from here -->
  2742.  
  2743. <div id="conbox2" style="margin-top:170px;">
  2744. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  2745. </div>
  2746.  
  2747. <div id="conicon" style="margin-top:170px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/2bd8435ce1cd93d7e22796ecb1bc44ab/tumblr_inline_ozi3mjWgKO1rvzd3s_540.png"/></div></a>
  2748.  
  2749. <!--4th connection-->
  2750.  
  2751. <div id="conbox3" style="margin-top:250px;">
  2752. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  2753. </div>
  2754.  
  2755. <div id="conicon2" style="margin-top:250px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/690039f56be111f5e89c514ada430396/tumblr_inline_ozi3mvqtZi1rvzd3s_540.png"/></div></a>
  2756.  
  2757. <!--to here, and change the 'margin-top'.-->
  2758.  
  2759.  
  2760.  
  2761. <!--5th connection-->
  2762. <!--you can add more connections if you want, just copy from here -->
  2763.  
  2764. <div id="conbox2" style="margin-top:330px;">
  2765. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  2766. </div>
  2767.  
  2768. <div id="conicon" style="margin-top:330px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/f3140f3c299f4c3bdb0b3c74f010a673/tumblr_inline_ozi3muIEFJ1rvzd3s_540.png"/></div></a>
  2769.  
  2770.  
  2771. <!--6th connection-->
  2772.  
  2773. <div id="conbox3" style="margin-top:410px;">
  2774. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  2775. </div>
  2776.  
  2777. <div id="conicon2" style="margin-top:410px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/dc8179b36a5759923b93cdcd5b776d0f/tumblr_inline_ozi3muQ3XN1rvzd3s_540.png"/></div></a>
  2778.  
  2779. <!--to here, and change the 'margin-top'.-->
  2780.  
  2781.  
  2782.  
  2783. </div>
  2784. <!-- end of connections box-->
  2785.  
  2786.  
  2787.  
  2788. <!--twitter-->
  2789. <!-- if you steal this part of my code, i WILL come after you-->
  2790. <div id="twitter">
  2791. <div id="twithead"><img src="https://78.media.tumblr.com/23ad5e786f5e71e993ae10ecc9dc3259/tumblr_inline_ozi3nx8QlX1rvzd3s_540.png"/></div>
  2792.  
  2793. <div id="twitbg">
  2794. <div id="twitname">name</div>
  2795. <div id="twituser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i></div>
  2796. <div id="twitdesc">Keep this description short. It shouldn't be longer than to lines.</div>
  2797. <div id="twitf"><b>50</b> Following <div style="margin-top:-14px; margin-left:100px;"><b>7.5m</b> Followers</div></div>
  2798. <div id="twitpro">Edit profile</div>
  2799. </div>
  2800.  
  2801. <div id="twitic"><img src="https://78.media.tumblr.com/d685c605911ce3829cded2f824a54385/tumblr_inline_ozi3nbxfj31rvzd3s_540.png"/></div>
  2802.  
  2803.  
  2804. <div id="twitborder"></div>
  2805. <div id="twitinfo">
  2806. <div style="margin-left:3px;"><b>Tweets</b></div>
  2807. <div style="margin-left:56px; margin-top:-16px;">Tweets & replies</div>
  2808. <div style="margin-left:168px; margin-top:-16px;">Media</div>
  2809. <div style="margin-left:218px; margin-top:-16px;">Likes</div>
  2810.  
  2811. </div>
  2812.  
  2813. <!--tweets and such go here-->
  2814.  
  2815. <div id="pinned">
  2816. <div id="pinfo">
  2817. <i class="fa fa-thumb-tack" aria-hidden="true"></i> Pinned Tweet
  2818. <div id="pname">name</div>
  2819. <div id="puser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h</div>
  2820. <div style="margin-top:3px; margin-left:193px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div>
  2821. </div>
  2822.  
  2823. <div id="pic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  2824.  
  2825. <div id="ptweet">photo caption.</div>
  2826.  
  2827.  
  2828. <div id="pim"> <a href="#?w=240" rel="box4" class="poplight" title="click me!"><img src="https://78.media.tumblr.com/557e5b97efa45710830293c69c743f30/tumblr_inline_ozi3naqqwC1rvzd3s_540.png"/></a></div>
  2829.  
  2830.  
  2831. <div id="ptagged">
  2832. twitter name and # others <!-- no more than "9" others btw -->
  2833. </div>
  2834.  
  2835. <div id="pnotes">
  2836. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  2837. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  2838. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  2839. </div>
  2840.  
  2841. <div id="pact">
  2842. <i class="fa fa-signal" aria-hidden="true"></i>
  2843. </div>
  2844. <!--end of pinned tweet-->
  2845. </div>
  2846.  
  2847.  
  2848. <!--pinned image pop up-->
  2849. <div id="box4" class="popup_block" style="height:395px;">
  2850.  
  2851. <div id="pinpop"><img src="https://78.media.tumblr.com/84674ef6fac489e6173246af5a5ff330/tumblr_inline_ozr3y46d151rvzd3s_540.png"/></div>
  2852.  
  2853. <div id="pinpopz">
  2854.  
  2855. <!--popup image caption box. hover over the image to view caption-->
  2856. <div id="ppopinf">
  2857. <div id="popname">name</div>
  2858. <div id="popuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h <div style="margin-top:-13px; margin-left:190px;"><span class="lnr lnr-chevron-down"></span></div> </div>
  2859.  
  2860.  
  2861. <div id="poptweet">keep this caption about two to three lines short. this box doesn't scroll. keep this caption about two to three lines short.</div>
  2862.  
  2863. <div id="poptagged">
  2864. twitter name and # others <!-- no more than "9" others btw --></div>
  2865.  
  2866. </div>
  2867. <!--end of caption box-->
  2868. </div>
  2869.  
  2870.  
  2871.  
  2872.  
  2873. <div id="popsep"></div>
  2874. <div id="popbox">
  2875.  
  2876. <!--popup box notes-->
  2877. <div id="popnotes">
  2878. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  2879. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  2880. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  2881. </div>
  2882.  
  2883. <div id="popmess">
  2884. <i class="fa fa-envelope-o" aria-hidden="true"></i></div>
  2885.  
  2886. <!--end of popup box notes -->
  2887. </div>
  2888.  
  2889. <!--end of image pop up-->
  2890. </div>
  2891. <!--end of 1st twitter box-->
  2892. </div>
  2893.  
  2894.  
  2895.  
  2896.  
  2897.  
  2898. <!--2nd twitter box for more tweets-->
  2899. <div id="twitter2">
  2900. <div id="twbg">
  2901.  
  2902. <!--1st tweet-->
  2903.  
  2904. <div id="twi">
  2905. <div id="twinfo">
  2906. <div id="twname">name</div>
  2907. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 10h</div>
  2908. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  2909.  
  2910.  
  2911. <div id="twpic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  2912.  
  2913. <div id="tweet">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  2914.  
  2915.  
  2916. <div id="twnotes">
  2917. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  2918. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  2919. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  2920. </div>
  2921.  
  2922. <div id="twact">
  2923. <i class="fa fa-signal" aria-hidden="true"></i>
  2924. </div>
  2925.  
  2926.  
  2927. <div id="twsep"></div>
  2928.  
  2929.  
  2930.  
  2931. <!--2nd tweet -->
  2932.  
  2933. <div id="twinfo" style="margin-top:112px;">
  2934. <div id="twname">name</div>
  2935. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  2936. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  2937.  
  2938.  
  2939. <div id="twpic" style="margin-top:112px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  2940.  
  2941. <div id="tweet" style="margin-top:133px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  2942.  
  2943.  
  2944. <div id="twnotes" style="margin-top:193px;">
  2945. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  2946. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  2947. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  2948. </div>
  2949.  
  2950. <div id="twact" style="margin-top:193px;">
  2951. <i class="fa fa-signal" aria-hidden="true"></i>
  2952. </div>
  2953.  
  2954.  
  2955. <div id="twsep" style="margin-top:210px;"></div>
  2956.  
  2957.  
  2958. <!--3rd tweet-->
  2959. <div id="twinfo" style="margin-top:218px;">
  2960. <div id="twname">name</div>
  2961. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  2962. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  2963.  
  2964.  
  2965. <div id="twpic" style="margin-top:218px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  2966.  
  2967. <div id="tweet" style="margin-top:237px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  2968.  
  2969.  
  2970. <div id="twnotes" style="margin-top:296px;">
  2971. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  2972. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  2973. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  2974. </div>
  2975.  
  2976. <div id="twact" style="margin-top:296px;">
  2977. <i class="fa fa-signal" aria-hidden="true"></i>
  2978. </div>
  2979.  
  2980. <div id="twsep" style="margin-top:313px;"></div>
  2981. <!--end of tweets-->
  2982. </div>
  2983. <!--end of 2nd twitter box-->
  2984. </div>
  2985. <!--end of twitter-->
  2986.  
  2987.  
  2988.  
  2989. <!--instagram-->
  2990. <div id='ig'>
  2991. <div id="igic"> <img src="https://78.media.tumblr.com/c0cc8dd37837fcd6d572236fdf089b21/tumblr_inline_ozi3q6yoLu1rvzd3s_540.png"/> </div>
  2992.  
  2993. <div id="iguser">
  2994. username <i class="fa fa-check-circle" aria-hidden="true" style="color:#519bd6;"></i>
  2995. </div>
  2996.  
  2997. <div id="igstats">
  2998. <b>###</b> posts <b>###m</b> followers <b>###</b> following
  2999. </div>
  3000.  
  3001. <div id="igdesc">
  3002. <b>name.</b> instagram bio goes here. don't make it longer than three lines <br>
  3003. <a href="/museurl" title="muse's url">site.com</a>
  3004. </div>
  3005.  
  3006.  
  3007. <div id="igposts">
  3008.  
  3009. <div id="igim"> <img src="https://78.media.tumblr.com/f11d0cc9ba78fdb7d98fc0aa386a0c9c/tumblr_inline_ozi3qprISd1rvzd3s_540.png"/> </div>
  3010.  
  3011.  
  3012. <div id="igim" style="margin-left:120px;"> <img src="https://78.media.tumblr.com/ff2836c8a6b56b18db7422832bbb757d/tumblr_inline_ozi3qqVFdP1rvzd3s_540.png"/> </div>
  3013.  
  3014.  
  3015. <div id="igim" style="margin-left:200px;"> <img src="https://78.media.tumblr.com/cce56591ef05ece7304268166297a5a5/tumblr_inline_ozi3qqgzfk1rvzd3s_540.png"/> </div>
  3016.  
  3017.  
  3018. <!--second row-->
  3019.  
  3020.  
  3021. <div id="igim" style="margin-top:85px;"> <img src="https://78.media.tumblr.com/af803c5d7fa334fed5c3b2daa4d65245/tumblr_inline_ozi3r0mSw41rvzd3s_540.png"/> </div>
  3022.  
  3023.  
  3024. <div id="igim" style="margin-top:85px; margin-left:120px;"> <img src="https://78.media.tumblr.com/e5bfc3c14783b6342df0499f671745d3/tumblr_inline_ozi3r06KXe1rvzd3s_540.png"/> </div>
  3025.  
  3026.  
  3027. <div id="igim" style="margin-top:85px; margin-left:200px;"> <img src="https://78.media.tumblr.com/5e311035b1f11f4ac75f0fdf35ea8f18/tumblr_inline_ozi3r13gHP1rvzd3s_540.png"/> </div>
  3028.  
  3029.  
  3030. </div>
  3031. <!--end of instagram-->
  3032. </div>
  3033.  
  3034. <!--end of forth muse box-->
  3035. </div>
  3036. </div>
  3037.  
  3038.  
  3039.  
  3040.  
  3041.  
  3042. <!-- fifth muse box-->
  3043.  
  3044. <div id="TabzFive" class="tabzcon alytut" style="display:none">
  3045. <span onclick="this.parentElement.style.display='none'" class="tabzclose">
  3046. <a title="close">EXIT</a>
  3047. </span>
  3048.  
  3049. <div id="fcim"> <img src="https://78.media.tumblr.com/d1511adc3c9335751d3e1886a22184fd/tumblr_inline_ozi3mdge7x1rvzd3s_540.png"/> </div>
  3050. <div id="label">muse name - The label</div>
  3051. <div id="fcbox">
  3052. <div id="fcinfo"> you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls.
  3053. </div>
  3054. </div>
  3055.  
  3056. <!--iMessage box-->
  3057. <div id="ibox">name</div>
  3058. <div id="ibox2">
  3059. <ul class="convo" style="color:#fff;">
  3060. <li class="line_odd user_1">text one goes here. </li>
  3061. <li class="line_even user_2">or you can swap the lines so that the blue imessage is at the top.</li>
  3062. <li class="line_even user_2">you can put whatever you want here, in whatever order.</li>
  3063. <li class="line_odd user_1">this box scrolls by the way, so you can add more messages if you like.</li>
  3064. </ul>
  3065. </div>
  3066. <!--end of iMessage box-->
  3067.  
  3068.  
  3069.  
  3070. <!-- snapchat box and info-->
  3071. <div class="snap">
  3072.  
  3073. <div class="snapuser">snapuser</div>
  3074. <div class="snaptime">18h ago</div>
  3075. <div class="snapcap" style="margin-top:230px;">caption</div>
  3076. <div style="margin-top:0px;"><img src="https://78.media.tumblr.com/3504c178a1ffb7fbed77d98e805ef4f4/tumblr_inline_ozi3o62fbP1rvzd3s_540.png"></div>
  3077.  
  3078. <!-- copy from here -->
  3079. <div class="snap2">
  3080. <div class="snaptime" style="margin-top:-261px;">15h ago</div>
  3081. <!--<div class="snapcap" style="margin-top:-60px;">you can hide the caption box if you don't want to use it</div>-->
  3082. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/f694b50f53904660e3803e2f60da4789/tumblr_inline_ozi3p0MJJF1rvzd3s_540.png"></div></div>
  3083. <!--- to here. change 'snap2' to the next snap number -->
  3084.  
  3085. <!-- copy from here -->
  3086. <div class="snap3">
  3087. <div class="snaptime" style="margin-top:-261px;">8h ago</div>
  3088. <div class="snapcap" style="margin-top:-90px;">caption</div>
  3089. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/8a8b12ea1ff366c9741be95c724f181f/tumblr_inline_ozi3p0UpYY1rvzd3s_540.png"></div></div>
  3090. <!--- to here. change 'snap3' to the next snap number -->
  3091.  
  3092.  
  3093. <!-- copy from here -->
  3094. <div class="snap4">
  3095. <div class="snaptime" style="margin-top:-261px;">3h ago</div>
  3096. <div class="snapcap" style="margin-top:-90px;">caption</div>
  3097. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/b67af846b1ca76aef1f4301638864d8b/tumblr_inline_ozi3p9e4QI1rvzd3s_540.png"></div></div>
  3098. <!--- to here. change 'snap4' to the next snap number -->
  3099.  
  3100.  
  3101. <div class="snap5">
  3102. <div class="snaptime" style="margin-top:-261px;">3m ago</div>
  3103. <div class="snapcap" style="margin-top:-90px;">caption</div>
  3104. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/9af9cd6d13767f20dcbcab68d3bae2b1/tumblr_inline_ozi3prkUfg1rvzd3s_540.png"></div></div>
  3105.  
  3106.  
  3107. <div class="snap6">
  3108. <div class="snaptime" style="margin-top:-261px;">1m ago</div>
  3109. <div class="snapcap" style="margin-top:-90px;">caption</div>
  3110. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/dc3a3e4eead7f8abe1946055ae37b4e4/tumblr_inline_ozi3pyIgpm1rvzd3s_540.png"></div></div>
  3111. </div>
  3112. <!--end of snapchat box-->
  3113.  
  3114.  
  3115. <!--connections box-->
  3116. <div id="conbox">
  3117. <div id="conbox2">
  3118. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  3119. </div>
  3120.  
  3121.  
  3122.  
  3123. <div id="conicon"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/c70729ce8901968c74cd2fdd4064ee9d/tumblr_inline_ozi3mkORqC1rvzd3s_540.png"/></div></a>
  3124.  
  3125. <!-- 2nd connection-->
  3126. <div id="conbox3">
  3127. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  3128. </div>
  3129.  
  3130. <div id="conicon2"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/b1038815ee0e3c1ddac97cc10f59d2e2/tumblr_inline_ozi3mjpJJL1rvzd3s_540.png"/></div></a>
  3131.  
  3132.  
  3133. <!--3rd connection-->
  3134. <!--you can add more connections if you want, just copy from here -->
  3135.  
  3136. <div id="conbox2" style="margin-top:170px;">
  3137. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  3138. </div>
  3139.  
  3140. <div id="conicon" style="margin-top:170px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/2bd8435ce1cd93d7e22796ecb1bc44ab/tumblr_inline_ozi3mjWgKO1rvzd3s_540.png"/></div></a>
  3141.  
  3142. <!--4th connection-->
  3143.  
  3144. <div id="conbox3" style="margin-top:250px;">
  3145. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  3146. </div>
  3147.  
  3148. <div id="conicon2" style="margin-top:250px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/690039f56be111f5e89c514ada430396/tumblr_inline_ozi3mvqtZi1rvzd3s_540.png"/></div></a>
  3149.  
  3150. <!--to here, and change the 'margin-top'.-->
  3151.  
  3152.  
  3153.  
  3154. <!--5th connection-->
  3155. <!--you can add more connections if you want, just copy from here -->
  3156.  
  3157. <div id="conbox2" style="margin-top:330px;">
  3158. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  3159. </div>
  3160.  
  3161. <div id="conicon" style="margin-top:330px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/f3140f3c299f4c3bdb0b3c74f010a673/tumblr_inline_ozi3muIEFJ1rvzd3s_540.png"/></div></a>
  3162.  
  3163.  
  3164. <!--6th connection-->
  3165.  
  3166. <div id="conbox3" style="margin-top:410px;">
  3167. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  3168. </div>
  3169.  
  3170. <div id="conicon2" style="margin-top:410px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/dc8179b36a5759923b93cdcd5b776d0f/tumblr_inline_ozi3muQ3XN1rvzd3s_540.png"/></div></a>
  3171.  
  3172. <!--to here, and change the 'margin-top'.-->
  3173.  
  3174.  
  3175.  
  3176. </div>
  3177. <!-- end of connections box-->
  3178.  
  3179.  
  3180.  
  3181. <!--twitter-->
  3182. <!-- if you steal this part of my code, i WILL come after you-->
  3183. <div id="twitter">
  3184. <div id="twithead"><img src="https://78.media.tumblr.com/23ad5e786f5e71e993ae10ecc9dc3259/tumblr_inline_ozi3nx8QlX1rvzd3s_540.png"/></div>
  3185.  
  3186. <div id="twitbg">
  3187. <div id="twitname">name</div>
  3188. <div id="twituser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i></div>
  3189. <div id="twitdesc">Keep this description short. It shouldn't be longer than to lines.</div>
  3190. <div id="twitf"><b>50</b> Following <div style="margin-top:-14px; margin-left:100px;"><b>7.5m</b> Followers</div></div>
  3191. <div id="twitpro">Edit profile</div>
  3192. </div>
  3193.  
  3194. <div id="twitic"><img src="https://78.media.tumblr.com/d685c605911ce3829cded2f824a54385/tumblr_inline_ozi3nbxfj31rvzd3s_540.png"/></div>
  3195.  
  3196.  
  3197. <div id="twitborder"></div>
  3198. <div id="twitinfo">
  3199. <div style="margin-left:3px;"><b>Tweets</b></div>
  3200. <div style="margin-left:56px; margin-top:-16px;">Tweets & replies</div>
  3201. <div style="margin-left:168px; margin-top:-16px;">Media</div>
  3202. <div style="margin-left:218px; margin-top:-16px;">Likes</div>
  3203.  
  3204. </div>
  3205.  
  3206. <!--tweets and such go here-->
  3207.  
  3208. <div id="pinned">
  3209. <div id="pinfo">
  3210. <i class="fa fa-thumb-tack" aria-hidden="true"></i> Pinned Tweet
  3211. <div id="pname">name</div>
  3212. <div id="puser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h</div>
  3213. <div style="margin-top:3px; margin-left:193px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div>
  3214. </div>
  3215.  
  3216. <div id="pic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  3217.  
  3218. <div id="ptweet">photo caption.</div>
  3219.  
  3220.  
  3221. <div id="pim"> <a href="#?w=240" rel="box5" class="poplight" title="click me!"><img src="https://78.media.tumblr.com/557e5b97efa45710830293c69c743f30/tumblr_inline_ozi3naqqwC1rvzd3s_540.png"/></a></div>
  3222.  
  3223.  
  3224. <div id="ptagged">
  3225. twitter name and # others <!-- no more than "9" others btw -->
  3226. </div>
  3227.  
  3228. <div id="pnotes">
  3229. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  3230. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  3231. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  3232. </div>
  3233.  
  3234. <div id="pact">
  3235. <i class="fa fa-signal" aria-hidden="true"></i>
  3236. </div>
  3237. <!--end of pinned tweet-->
  3238. </div>
  3239.  
  3240.  
  3241. <!--pinned image pop up-->
  3242. <div id="box5" class="popup_block" style="height:395px;">
  3243.  
  3244. <div id="pinpop"><img src="https://78.media.tumblr.com/84674ef6fac489e6173246af5a5ff330/tumblr_inline_ozr3y46d151rvzd3s_540.png"/></div>
  3245.  
  3246. <div id="pinpopz">
  3247.  
  3248. <!--popup image caption box. hover over the image to view caption-->
  3249. <div id="ppopinf">
  3250. <div id="popname">name</div>
  3251. <div id="popuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h <div style="margin-top:-13px; margin-left:190px;"><span class="lnr lnr-chevron-down"></span></div> </div>
  3252.  
  3253.  
  3254. <div id="poptweet">keep this caption about two to three lines short. this box doesn't scroll. keep this caption about two to three lines short.</div>
  3255.  
  3256. <div id="poptagged">
  3257. twitter name and # others <!-- no more than "9" others btw --></div>
  3258.  
  3259. </div>
  3260. <!--end of caption box-->
  3261. </div>
  3262.  
  3263.  
  3264.  
  3265.  
  3266. <div id="popsep"></div>
  3267. <div id="popbox">
  3268.  
  3269. <!--popup box notes-->
  3270. <div id="popnotes">
  3271. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  3272. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  3273. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  3274. </div>
  3275.  
  3276. <div id="popmess">
  3277. <i class="fa fa-envelope-o" aria-hidden="true"></i></div>
  3278.  
  3279. <!--end of popup box notes -->
  3280. </div>
  3281.  
  3282. <!--end of image pop up-->
  3283. </div>
  3284. <!--end of 1st twitter box-->
  3285. </div>
  3286.  
  3287.  
  3288.  
  3289.  
  3290.  
  3291. <!--2nd twitter box for more tweets-->
  3292. <div id="twitter2">
  3293. <div id="twbg">
  3294.  
  3295. <!--1st tweet-->
  3296.  
  3297. <div id="twi">
  3298. <div id="twinfo">
  3299. <div id="twname">name</div>
  3300. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 10h</div>
  3301. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  3302.  
  3303.  
  3304. <div id="twpic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  3305.  
  3306. <div id="tweet">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  3307.  
  3308.  
  3309. <div id="twnotes">
  3310. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  3311. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  3312. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  3313. </div>
  3314.  
  3315. <div id="twact">
  3316. <i class="fa fa-signal" aria-hidden="true"></i>
  3317. </div>
  3318.  
  3319.  
  3320. <div id="twsep"></div>
  3321.  
  3322.  
  3323.  
  3324. <!--2nd tweet -->
  3325.  
  3326. <div id="twinfo" style="margin-top:112px;">
  3327. <div id="twname">name</div>
  3328. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  3329. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  3330.  
  3331.  
  3332. <div id="twpic" style="margin-top:112px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  3333.  
  3334. <div id="tweet" style="margin-top:133px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  3335.  
  3336.  
  3337. <div id="twnotes" style="margin-top:193px;">
  3338. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  3339. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  3340. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  3341. </div>
  3342.  
  3343. <div id="twact" style="margin-top:193px;">
  3344. <i class="fa fa-signal" aria-hidden="true"></i>
  3345. </div>
  3346.  
  3347.  
  3348. <div id="twsep" style="margin-top:210px;"></div>
  3349.  
  3350.  
  3351. <!--3rd tweet-->
  3352. <div id="twinfo" style="margin-top:218px;">
  3353. <div id="twname">name</div>
  3354. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  3355. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  3356.  
  3357.  
  3358. <div id="twpic" style="margin-top:218px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  3359.  
  3360. <div id="tweet" style="margin-top:237px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  3361.  
  3362.  
  3363. <div id="twnotes" style="margin-top:296px;">
  3364. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  3365. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  3366. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  3367. </div>
  3368.  
  3369. <div id="twact" style="margin-top:296px;">
  3370. <i class="fa fa-signal" aria-hidden="true"></i>
  3371. </div>
  3372.  
  3373. <div id="twsep" style="margin-top:313px;"></div>
  3374. <!--end of tweets-->
  3375. </div>
  3376. <!--end of 2nd twitter box-->
  3377. </div>
  3378. <!--end of twitter-->
  3379.  
  3380.  
  3381.  
  3382. <!--instagram-->
  3383. <div id='ig'>
  3384. <div id="igic"> <img src="https://78.media.tumblr.com/c0cc8dd37837fcd6d572236fdf089b21/tumblr_inline_ozi3q6yoLu1rvzd3s_540.png"/> </div>
  3385.  
  3386. <div id="iguser">
  3387. username <i class="fa fa-check-circle" aria-hidden="true" style="color:#519bd6;"></i>
  3388. </div>
  3389.  
  3390. <div id="igstats">
  3391. <b>###</b> posts <b>###m</b> followers <b>###</b> following
  3392. </div>
  3393.  
  3394. <div id="igdesc">
  3395. <b>name.</b> instagram bio goes here. don't make it longer than three lines <br>
  3396. <a href="/museurl" title="muse's url">site.com</a>
  3397. </div>
  3398.  
  3399.  
  3400. <div id="igposts">
  3401.  
  3402. <div id="igim"> <img src="https://78.media.tumblr.com/f11d0cc9ba78fdb7d98fc0aa386a0c9c/tumblr_inline_ozi3qprISd1rvzd3s_540.png"/> </div>
  3403.  
  3404.  
  3405. <div id="igim" style="margin-left:120px;"> <img src="https://78.media.tumblr.com/ff2836c8a6b56b18db7422832bbb757d/tumblr_inline_ozi3qqVFdP1rvzd3s_540.png"/> </div>
  3406.  
  3407.  
  3408. <div id="igim" style="margin-left:200px;"> <img src="https://78.media.tumblr.com/cce56591ef05ece7304268166297a5a5/tumblr_inline_ozi3qqgzfk1rvzd3s_540.png"/> </div>
  3409.  
  3410.  
  3411. <!--second row-->
  3412.  
  3413.  
  3414. <div id="igim" style="margin-top:85px;"> <img src="https://78.media.tumblr.com/af803c5d7fa334fed5c3b2daa4d65245/tumblr_inline_ozi3r0mSw41rvzd3s_540.png"/> </div>
  3415.  
  3416.  
  3417. <div id="igim" style="margin-top:85px; margin-left:120px;"> <img src="https://78.media.tumblr.com/e5bfc3c14783b6342df0499f671745d3/tumblr_inline_ozi3r06KXe1rvzd3s_540.png"/> </div>
  3418.  
  3419.  
  3420. <div id="igim" style="margin-top:85px; margin-left:200px;"> <img src="https://78.media.tumblr.com/5e311035b1f11f4ac75f0fdf35ea8f18/tumblr_inline_ozi3r13gHP1rvzd3s_540.png"/> </div>
  3421.  
  3422.  
  3423. </div>
  3424. <!--end of instagram-->
  3425. </div>
  3426.  
  3427.  
  3428. <!--end of fifth muse box-->
  3429. </div>
  3430. </div>
  3431.  
  3432.  
  3433.  
  3434.  
  3435.  
  3436.  
  3437. <!-- sixth muse box-->
  3438.  
  3439. <div id="TabzSix" class="tabzcon alytut" style="display:none">
  3440. <span onclick="this.parentElement.style.display='none'" class="tabzclose">
  3441. <a title="close">EXIT</a>
  3442. </span>
  3443.  
  3444.  
  3445. <div id="fcim"> <img src="https://78.media.tumblr.com/d1511adc3c9335751d3e1886a22184fd/tumblr_inline_ozi3mdge7x1rvzd3s_540.png"/> </div>
  3446. <div id="label">muse name - The label</div>
  3447. <div id="fcbox">
  3448. <div id="fcinfo"> you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls.
  3449. </div>
  3450. </div>
  3451.  
  3452. <!--iMessage box-->
  3453. <div id="ibox">name</div>
  3454. <div id="ibox2">
  3455. <ul class="convo" style="color:#fff;">
  3456. <li class="line_odd user_1">text one goes here. </li>
  3457. <li class="line_even user_2">or you can swap the lines so that the blue imessage is at the top.</li>
  3458. <li class="line_even user_2">you can put whatever you want here, in whatever order.</li>
  3459. <li class="line_odd user_1">this box scrolls by the way, so you can add more messages if you like.</li>
  3460. </ul>
  3461. </div>
  3462. <!--end of iMessage box-->
  3463.  
  3464.  
  3465.  
  3466. <!-- snapchat box and info-->
  3467. <div class="snap">
  3468.  
  3469. <div class="snapuser">snapuser</div>
  3470. <div class="snaptime">18h ago</div>
  3471. <div class="snapcap" style="margin-top:230px;">caption</div>
  3472. <div style="margin-top:0px;"><img src="https://78.media.tumblr.com/3504c178a1ffb7fbed77d98e805ef4f4/tumblr_inline_ozi3o62fbP1rvzd3s_540.png"></div>
  3473.  
  3474. <!-- copy from here -->
  3475. <div class="snap2">
  3476. <div class="snaptime" style="margin-top:-261px;">15h ago</div>
  3477. <!--<div class="snapcap" style="margin-top:-60px;">you can hide the caption box if you don't want to use it</div>-->
  3478. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/f694b50f53904660e3803e2f60da4789/tumblr_inline_ozi3p0MJJF1rvzd3s_540.png"></div></div>
  3479. <!--- to here. change 'snap2' to the next snap number -->
  3480.  
  3481. <!-- copy from here -->
  3482. <div class="snap3">
  3483. <div class="snaptime" style="margin-top:-261px;">8h ago</div>
  3484. <div class="snapcap" style="margin-top:-90px;">caption</div>
  3485. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/8a8b12ea1ff366c9741be95c724f181f/tumblr_inline_ozi3p0UpYY1rvzd3s_540.png"></div></div>
  3486. <!--- to here. change 'snap3' to the next snap number -->
  3487.  
  3488.  
  3489. <!-- copy from here -->
  3490. <div class="snap4">
  3491. <div class="snaptime" style="margin-top:-261px;">3h ago</div>
  3492. <div class="snapcap" style="margin-top:-90px;">caption</div>
  3493. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/b67af846b1ca76aef1f4301638864d8b/tumblr_inline_ozi3p9e4QI1rvzd3s_540.png"></div></div>
  3494. <!--- to here. change 'snap4' to the next snap number -->
  3495.  
  3496.  
  3497. <div class="snap5">
  3498. <div class="snaptime" style="margin-top:-261px;">3m ago</div>
  3499. <div class="snapcap" style="margin-top:-90px;">caption</div>
  3500. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/9af9cd6d13767f20dcbcab68d3bae2b1/tumblr_inline_ozi3prkUfg1rvzd3s_540.png"></div></div>
  3501.  
  3502.  
  3503. <div class="snap6">
  3504. <div class="snaptime" style="margin-top:-261px;">1m ago</div>
  3505. <div class="snapcap" style="margin-top:-90px;">caption</div>
  3506. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/dc3a3e4eead7f8abe1946055ae37b4e4/tumblr_inline_ozi3pyIgpm1rvzd3s_540.png"></div></div>
  3507. </div>
  3508. <!--end of snapchat box-->
  3509.  
  3510.  
  3511. <!--connections box-->
  3512. <div id="conbox">
  3513. <div id="conbox2">
  3514. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  3515. </div>
  3516.  
  3517.  
  3518.  
  3519. <div id="conicon"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/c70729ce8901968c74cd2fdd4064ee9d/tumblr_inline_ozi3mkORqC1rvzd3s_540.png"/></div></a>
  3520.  
  3521. <!-- 2nd connection-->
  3522. <div id="conbox3">
  3523. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  3524. </div>
  3525.  
  3526. <div id="conicon2"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/b1038815ee0e3c1ddac97cc10f59d2e2/tumblr_inline_ozi3mjpJJL1rvzd3s_540.png"/></div></a>
  3527.  
  3528.  
  3529. <!--3rd connection-->
  3530. <!--you can add more connections if you want, just copy from here -->
  3531.  
  3532. <div id="conbox2" style="margin-top:170px;">
  3533. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  3534. </div>
  3535.  
  3536. <div id="conicon" style="margin-top:170px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/2bd8435ce1cd93d7e22796ecb1bc44ab/tumblr_inline_ozi3mjWgKO1rvzd3s_540.png"/></div></a>
  3537.  
  3538. <!--4th connection-->
  3539.  
  3540. <div id="conbox3" style="margin-top:250px;">
  3541. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  3542. </div>
  3543.  
  3544. <div id="conicon2" style="margin-top:250px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/690039f56be111f5e89c514ada430396/tumblr_inline_ozi3mvqtZi1rvzd3s_540.png"/></div></a>
  3545.  
  3546. <!--to here, and change the 'margin-top'.-->
  3547.  
  3548.  
  3549.  
  3550. <!--5th connection-->
  3551. <!--you can add more connections if you want, just copy from here -->
  3552.  
  3553. <div id="conbox2" style="margin-top:330px;">
  3554. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  3555. </div>
  3556.  
  3557. <div id="conicon" style="margin-top:330px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/f3140f3c299f4c3bdb0b3c74f010a673/tumblr_inline_ozi3muIEFJ1rvzd3s_540.png"/></div></a>
  3558.  
  3559.  
  3560. <!--6th connection-->
  3561.  
  3562. <div id="conbox3" style="margin-top:410px;">
  3563. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  3564. </div>
  3565.  
  3566. <div id="conicon2" style="margin-top:410px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/dc8179b36a5759923b93cdcd5b776d0f/tumblr_inline_ozi3muQ3XN1rvzd3s_540.png"/></div></a>
  3567.  
  3568. <!--to here, and change the 'margin-top'.-->
  3569.  
  3570.  
  3571.  
  3572. </div>
  3573. <!-- end of connections box-->
  3574.  
  3575.  
  3576.  
  3577. <!--twitter-->
  3578. <!-- if you steal this part of my code, i WILL come after you-->
  3579. <div id="twitter">
  3580. <div id="twithead"><img src="https://78.media.tumblr.com/23ad5e786f5e71e993ae10ecc9dc3259/tumblr_inline_ozi3nx8QlX1rvzd3s_540.png"/></div>
  3581.  
  3582. <div id="twitbg">
  3583. <div id="twitname">name</div>
  3584. <div id="twituser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i></div>
  3585. <div id="twitdesc">Keep this description short. It shouldn't be longer than to lines.</div>
  3586. <div id="twitf"><b>50</b> Following <div style="margin-top:-14px; margin-left:100px;"><b>7.5m</b> Followers</div></div>
  3587. <div id="twitpro">Edit profile</div>
  3588. </div>
  3589.  
  3590. <div id="twitic"><img src="https://78.media.tumblr.com/d685c605911ce3829cded2f824a54385/tumblr_inline_ozi3nbxfj31rvzd3s_540.png"/></div>
  3591.  
  3592.  
  3593. <div id="twitborder"></div>
  3594. <div id="twitinfo">
  3595. <div style="margin-left:3px;"><b>Tweets</b></div>
  3596. <div style="margin-left:56px; margin-top:-16px;">Tweets & replies</div>
  3597. <div style="margin-left:168px; margin-top:-16px;">Media</div>
  3598. <div style="margin-left:218px; margin-top:-16px;">Likes</div>
  3599.  
  3600. </div>
  3601.  
  3602. <!--tweets and such go here-->
  3603.  
  3604. <div id="pinned">
  3605. <div id="pinfo">
  3606. <i class="fa fa-thumb-tack" aria-hidden="true"></i> Pinned Tweet
  3607. <div id="pname">name</div>
  3608. <div id="puser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h</div>
  3609. <div style="margin-top:3px; margin-left:193px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div>
  3610. </div>
  3611.  
  3612. <div id="pic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  3613.  
  3614. <div id="ptweet">photo caption.</div>
  3615.  
  3616.  
  3617. <div id="pim"> <a href="#?w=240" rel="box6" class="poplight" title="click me!"><img src="https://78.media.tumblr.com/557e5b97efa45710830293c69c743f30/tumblr_inline_ozi3naqqwC1rvzd3s_540.png"/></a></div>
  3618.  
  3619.  
  3620. <div id="ptagged">
  3621. twitter name and # others <!-- no more than "9" others btw -->
  3622. </div>
  3623.  
  3624. <div id="pnotes">
  3625. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  3626. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  3627. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  3628. </div>
  3629.  
  3630. <div id="pact">
  3631. <i class="fa fa-signal" aria-hidden="true"></i>
  3632. </div>
  3633. <!--end of pinned tweet-->
  3634. </div>
  3635.  
  3636.  
  3637. <!--pinned image pop up-->
  3638. <div id="box6" class="popup_block" style="height:395px;">
  3639.  
  3640. <div id="pinpop"><img src="https://78.media.tumblr.com/84674ef6fac489e6173246af5a5ff330/tumblr_inline_ozr3y46d151rvzd3s_540.png"/></div>
  3641.  
  3642. <div id="pinpopz">
  3643.  
  3644. <!--popup image caption box. hover over the image to view caption-->
  3645. <div id="ppopinf">
  3646. <div id="popname">name</div>
  3647. <div id="popuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h <div style="margin-top:-13px; margin-left:190px;"><span class="lnr lnr-chevron-down"></span></div> </div>
  3648.  
  3649.  
  3650. <div id="poptweet">keep this caption about two to three lines short. this box doesn't scroll. keep this caption about two to three lines short.</div>
  3651.  
  3652. <div id="poptagged">
  3653. twitter name and # others <!-- no more than "9" others btw --></div>
  3654.  
  3655. </div>
  3656. <!--end of caption box-->
  3657. </div>
  3658.  
  3659.  
  3660.  
  3661.  
  3662. <div id="popsep"></div>
  3663. <div id="popbox">
  3664.  
  3665. <!--popup box notes-->
  3666. <div id="popnotes">
  3667. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  3668. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  3669. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  3670. </div>
  3671.  
  3672. <div id="popmess">
  3673. <i class="fa fa-envelope-o" aria-hidden="true"></i></div>
  3674.  
  3675. <!--end of popup box notes -->
  3676. </div>
  3677.  
  3678. <!--end of image pop up-->
  3679. </div>
  3680. <!--end of 1st twitter box-->
  3681. </div>
  3682.  
  3683.  
  3684.  
  3685.  
  3686.  
  3687. <!--2nd twitter box for more tweets-->
  3688. <div id="twitter2">
  3689. <div id="twbg">
  3690.  
  3691. <!--1st tweet-->
  3692.  
  3693. <div id="twi">
  3694. <div id="twinfo">
  3695. <div id="twname">name</div>
  3696. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 10h</div>
  3697. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  3698.  
  3699.  
  3700. <div id="twpic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  3701.  
  3702. <div id="tweet">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  3703.  
  3704.  
  3705. <div id="twnotes">
  3706. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  3707. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  3708. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  3709. </div>
  3710.  
  3711. <div id="twact">
  3712. <i class="fa fa-signal" aria-hidden="true"></i>
  3713. </div>
  3714.  
  3715.  
  3716. <div id="twsep"></div>
  3717.  
  3718.  
  3719.  
  3720. <!--2nd tweet -->
  3721.  
  3722. <div id="twinfo" style="margin-top:112px;">
  3723. <div id="twname">name</div>
  3724. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  3725. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  3726.  
  3727.  
  3728. <div id="twpic" style="margin-top:112px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  3729.  
  3730. <div id="tweet" style="margin-top:133px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  3731.  
  3732.  
  3733. <div id="twnotes" style="margin-top:193px;">
  3734. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  3735. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  3736. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  3737. </div>
  3738.  
  3739. <div id="twact" style="margin-top:193px;">
  3740. <i class="fa fa-signal" aria-hidden="true"></i>
  3741. </div>
  3742.  
  3743.  
  3744. <div id="twsep" style="margin-top:210px;"></div>
  3745.  
  3746.  
  3747. <!--3rd tweet-->
  3748. <div id="twinfo" style="margin-top:218px;">
  3749. <div id="twname">name</div>
  3750. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  3751. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  3752.  
  3753.  
  3754. <div id="twpic" style="margin-top:218px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  3755.  
  3756. <div id="tweet" style="margin-top:237px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  3757.  
  3758.  
  3759. <div id="twnotes" style="margin-top:296px;">
  3760. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  3761. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  3762. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  3763. </div>
  3764.  
  3765. <div id="twact" style="margin-top:296px;">
  3766. <i class="fa fa-signal" aria-hidden="true"></i>
  3767. </div>
  3768.  
  3769. <div id="twsep" style="margin-top:313px;"></div>
  3770. <!--end of tweets-->
  3771. </div>
  3772. <!--end of 2nd twitter box-->
  3773. </div>
  3774. <!--end of twitter-->
  3775.  
  3776.  
  3777.  
  3778. <!--instagram-->
  3779. <div id='ig'>
  3780. <div id="igic"> <img src="https://78.media.tumblr.com/c0cc8dd37837fcd6d572236fdf089b21/tumblr_inline_ozi3q6yoLu1rvzd3s_540.png"/> </div>
  3781.  
  3782. <div id="iguser">
  3783. username <i class="fa fa-check-circle" aria-hidden="true" style="color:#519bd6;"></i>
  3784. </div>
  3785.  
  3786. <div id="igstats">
  3787. <b>###</b> posts <b>###m</b> followers <b>###</b> following
  3788. </div>
  3789.  
  3790. <div id="igdesc">
  3791. <b>name.</b> instagram bio goes here. don't make it longer than three lines <br>
  3792. <a href="/museurl" title="muse's url">site.com</a>
  3793. </div>
  3794.  
  3795.  
  3796. <div id="igposts">
  3797.  
  3798. <div id="igim"> <img src="https://78.media.tumblr.com/f11d0cc9ba78fdb7d98fc0aa386a0c9c/tumblr_inline_ozi3qprISd1rvzd3s_540.png"/> </div>
  3799.  
  3800.  
  3801. <div id="igim" style="margin-left:120px;"> <img src="https://78.media.tumblr.com/ff2836c8a6b56b18db7422832bbb757d/tumblr_inline_ozi3qqVFdP1rvzd3s_540.png"/> </div>
  3802.  
  3803.  
  3804. <div id="igim" style="margin-left:200px;"> <img src="https://78.media.tumblr.com/cce56591ef05ece7304268166297a5a5/tumblr_inline_ozi3qqgzfk1rvzd3s_540.png"/> </div>
  3805.  
  3806.  
  3807. <!--second row-->
  3808.  
  3809.  
  3810. <div id="igim" style="margin-top:85px;"> <img src="https://78.media.tumblr.com/af803c5d7fa334fed5c3b2daa4d65245/tumblr_inline_ozi3r0mSw41rvzd3s_540.png"/> </div>
  3811.  
  3812.  
  3813. <div id="igim" style="margin-top:85px; margin-left:120px;"> <img src="https://78.media.tumblr.com/e5bfc3c14783b6342df0499f671745d3/tumblr_inline_ozi3r06KXe1rvzd3s_540.png"/> </div>
  3814.  
  3815.  
  3816. <div id="igim" style="margin-top:85px; margin-left:200px;"> <img src="https://78.media.tumblr.com/5e311035b1f11f4ac75f0fdf35ea8f18/tumblr_inline_ozi3r13gHP1rvzd3s_540.png"/> </div>
  3817.  
  3818.  
  3819. </div>
  3820. <!--end of instagram-->
  3821. </div>
  3822.  
  3823. <!--end of sixth muse box-->
  3824. </div>
  3825. </div>
  3826.  
  3827.  
  3828.  
  3829.  
  3830.  
  3831.  
  3832. <!-- seventh muse box-->
  3833.  
  3834. <div id="TabzSeven" class="tabzcon alytut" style="display:none">
  3835. <span onclick="this.parentElement.style.display='none'" class="tabzclose">
  3836. <a title="close">EXIT</a>
  3837. </span>
  3838.  
  3839.  
  3840. <div id="fcim"> <img src="https://78.media.tumblr.com/d1511adc3c9335751d3e1886a22184fd/tumblr_inline_ozi3mdge7x1rvzd3s_540.png"/> </div>
  3841. <div id="label">muse name - The label</div>
  3842. <div id="fcbox">
  3843. <div id="fcinfo"> you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls.
  3844. </div>
  3845. </div>
  3846.  
  3847. <!--iMessage box-->
  3848. <div id="ibox">name</div>
  3849. <div id="ibox2">
  3850. <ul class="convo" style="color:#fff;">
  3851. <li class="line_odd user_1">text one goes here. </li>
  3852. <li class="line_even user_2">or you can swap the lines so that the blue imessage is at the top.</li>
  3853. <li class="line_even user_2">you can put whatever you want here, in whatever order.</li>
  3854. <li class="line_odd user_1">this box scrolls by the way, so you can add more messages if you like.</li>
  3855. </ul>
  3856. </div>
  3857. <!--end of iMessage box-->
  3858.  
  3859.  
  3860.  
  3861. <!-- snapchat box and info-->
  3862. <div class="snap">
  3863.  
  3864. <div class="snapuser">snapuser</div>
  3865. <div class="snaptime">18h ago</div>
  3866. <div class="snapcap" style="margin-top:230px;">caption</div>
  3867. <div style="margin-top:0px;"><img src="https://78.media.tumblr.com/3504c178a1ffb7fbed77d98e805ef4f4/tumblr_inline_ozi3o62fbP1rvzd3s_540.png"></div>
  3868.  
  3869. <!-- copy from here -->
  3870. <div class="snap2">
  3871. <div class="snaptime" style="margin-top:-261px;">15h ago</div>
  3872. <!--<div class="snapcap" style="margin-top:-60px;">you can hide the caption box if you don't want to use it</div>-->
  3873. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/f694b50f53904660e3803e2f60da4789/tumblr_inline_ozi3p0MJJF1rvzd3s_540.png"></div></div>
  3874. <!--- to here. change 'snap2' to the next snap number -->
  3875.  
  3876. <!-- copy from here -->
  3877. <div class="snap3">
  3878. <div class="snaptime" style="margin-top:-261px;">8h ago</div>
  3879. <div class="snapcap" style="margin-top:-90px;">caption</div>
  3880. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/8a8b12ea1ff366c9741be95c724f181f/tumblr_inline_ozi3p0UpYY1rvzd3s_540.png"></div></div>
  3881. <!--- to here. change 'snap3' to the next snap number -->
  3882.  
  3883.  
  3884. <!-- copy from here -->
  3885. <div class="snap4">
  3886. <div class="snaptime" style="margin-top:-261px;">3h ago</div>
  3887. <div class="snapcap" style="margin-top:-90px;">caption</div>
  3888. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/b67af846b1ca76aef1f4301638864d8b/tumblr_inline_ozi3p9e4QI1rvzd3s_540.png"></div></div>
  3889. <!--- to here. change 'snap4' to the next snap number -->
  3890.  
  3891.  
  3892. <div class="snap5">
  3893. <div class="snaptime" style="margin-top:-261px;">3m ago</div>
  3894. <div class="snapcap" style="margin-top:-90px;">caption</div>
  3895. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/9af9cd6d13767f20dcbcab68d3bae2b1/tumblr_inline_ozi3prkUfg1rvzd3s_540.png"></div></div>
  3896.  
  3897.  
  3898. <div class="snap6">
  3899. <div class="snaptime" style="margin-top:-261px;">1m ago</div>
  3900. <div class="snapcap" style="margin-top:-90px;">caption</div>
  3901. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/dc3a3e4eead7f8abe1946055ae37b4e4/tumblr_inline_ozi3pyIgpm1rvzd3s_540.png"></div></div>
  3902. </div>
  3903. <!--end of snapchat box-->
  3904.  
  3905.  
  3906. <!--connections box-->
  3907. <div id="conbox">
  3908. <div id="conbox2">
  3909. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  3910. </div>
  3911.  
  3912.  
  3913.  
  3914. <div id="conicon"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/c70729ce8901968c74cd2fdd4064ee9d/tumblr_inline_ozi3mkORqC1rvzd3s_540.png"/></div></a>
  3915.  
  3916. <!-- 2nd connection-->
  3917. <div id="conbox3">
  3918. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  3919. </div>
  3920.  
  3921. <div id="conicon2"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/b1038815ee0e3c1ddac97cc10f59d2e2/tumblr_inline_ozi3mjpJJL1rvzd3s_540.png"/></div></a>
  3922.  
  3923.  
  3924. <!--3rd connection-->
  3925. <!--you can add more connections if you want, just copy from here -->
  3926.  
  3927. <div id="conbox2" style="margin-top:170px;">
  3928. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  3929. </div>
  3930.  
  3931. <div id="conicon" style="margin-top:170px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/2bd8435ce1cd93d7e22796ecb1bc44ab/tumblr_inline_ozi3mjWgKO1rvzd3s_540.png"/></div></a>
  3932.  
  3933. <!--4th connection-->
  3934.  
  3935. <div id="conbox3" style="margin-top:250px;">
  3936. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  3937. </div>
  3938.  
  3939. <div id="conicon2" style="margin-top:250px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/690039f56be111f5e89c514ada430396/tumblr_inline_ozi3mvqtZi1rvzd3s_540.png"/></div></a>
  3940.  
  3941. <!--to here, and change the 'margin-top'.-->
  3942.  
  3943.  
  3944.  
  3945. <!--5th connection-->
  3946. <!--you can add more connections if you want, just copy from here -->
  3947.  
  3948. <div id="conbox2" style="margin-top:330px;">
  3949. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  3950. </div>
  3951.  
  3952. <div id="conicon" style="margin-top:330px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/f3140f3c299f4c3bdb0b3c74f010a673/tumblr_inline_ozi3muIEFJ1rvzd3s_540.png"/></div></a>
  3953.  
  3954.  
  3955. <!--6th connection-->
  3956.  
  3957. <div id="conbox3" style="margin-top:410px;">
  3958. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  3959. </div>
  3960.  
  3961. <div id="conicon2" style="margin-top:410px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/dc8179b36a5759923b93cdcd5b776d0f/tumblr_inline_ozi3muQ3XN1rvzd3s_540.png"/></div></a>
  3962.  
  3963. <!--to here, and change the 'margin-top'.-->
  3964.  
  3965.  
  3966.  
  3967. </div>
  3968. <!-- end of connections box-->
  3969.  
  3970.  
  3971.  
  3972. <!--twitter-->
  3973. <!-- if you steal this part of my code, i WILL come after you-->
  3974. <div id="twitter">
  3975. <div id="twithead"><img src="https://78.media.tumblr.com/23ad5e786f5e71e993ae10ecc9dc3259/tumblr_inline_ozi3nx8QlX1rvzd3s_540.png"/></div>
  3976.  
  3977. <div id="twitbg">
  3978. <div id="twitname">name</div>
  3979. <div id="twituser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i></div>
  3980. <div id="twitdesc">Keep this description short. It shouldn't be longer than to lines.</div>
  3981. <div id="twitf"><b>50</b> Following <div style="margin-top:-14px; margin-left:100px;"><b>7.5m</b> Followers</div></div>
  3982. <div id="twitpro">Edit profile</div>
  3983. </div>
  3984.  
  3985. <div id="twitic"><img src="https://78.media.tumblr.com/d685c605911ce3829cded2f824a54385/tumblr_inline_ozi3nbxfj31rvzd3s_540.png"/></div>
  3986.  
  3987.  
  3988. <div id="twitborder"></div>
  3989. <div id="twitinfo">
  3990. <div style="margin-left:3px;"><b>Tweets</b></div>
  3991. <div style="margin-left:56px; margin-top:-16px;">Tweets & replies</div>
  3992. <div style="margin-left:168px; margin-top:-16px;">Media</div>
  3993. <div style="margin-left:218px; margin-top:-16px;">Likes</div>
  3994.  
  3995. </div>
  3996.  
  3997. <!--tweets and such go here-->
  3998.  
  3999. <div id="pinned">
  4000. <div id="pinfo">
  4001. <i class="fa fa-thumb-tack" aria-hidden="true"></i> Pinned Tweet
  4002. <div id="pname">name</div>
  4003. <div id="puser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h</div>
  4004. <div style="margin-top:3px; margin-left:193px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div>
  4005. </div>
  4006.  
  4007. <div id="pic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  4008.  
  4009. <div id="ptweet">photo caption.</div>
  4010.  
  4011.  
  4012. <div id="pim"> <a href="#?w=240" rel="box7" class="poplight" title="click me!"><img src="https://78.media.tumblr.com/557e5b97efa45710830293c69c743f30/tumblr_inline_ozi3naqqwC1rvzd3s_540.png"/></a></div>
  4013.  
  4014.  
  4015. <div id="ptagged">
  4016. twitter name and # others <!-- no more than "9" others btw -->
  4017. </div>
  4018.  
  4019. <div id="pnotes">
  4020. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  4021. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  4022. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  4023. </div>
  4024.  
  4025. <div id="pact">
  4026. <i class="fa fa-signal" aria-hidden="true"></i>
  4027. </div>
  4028. <!--end of pinned tweet-->
  4029. </div>
  4030.  
  4031.  
  4032. <!--pinned image pop up-->
  4033. <div id="box7" class="popup_block" style="height:395px;">
  4034.  
  4035. <div id="pinpop"><img src="https://78.media.tumblr.com/84674ef6fac489e6173246af5a5ff330/tumblr_inline_ozr3y46d151rvzd3s_540.png"/></div>
  4036.  
  4037. <div id="pinpopz">
  4038.  
  4039. <!--popup image caption box. hover over the image to view caption-->
  4040. <div id="ppopinf">
  4041. <div id="popname">name</div>
  4042. <div id="popuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h <div style="margin-top:-13px; margin-left:190px;"><span class="lnr lnr-chevron-down"></span></div> </div>
  4043.  
  4044.  
  4045. <div id="poptweet">keep this caption about two to three lines short. this box doesn't scroll. keep this caption about two to three lines short.</div>
  4046.  
  4047. <div id="poptagged">
  4048. twitter name and # others <!-- no more than "9" others btw --></div>
  4049.  
  4050. </div>
  4051. <!--end of caption box-->
  4052. </div>
  4053.  
  4054.  
  4055.  
  4056.  
  4057. <div id="popsep"></div>
  4058. <div id="popbox">
  4059.  
  4060. <!--popup box notes-->
  4061. <div id="popnotes">
  4062. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  4063. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  4064. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  4065. </div>
  4066.  
  4067. <div id="popmess">
  4068. <i class="fa fa-envelope-o" aria-hidden="true"></i></div>
  4069.  
  4070. <!--end of popup box notes -->
  4071. </div>
  4072.  
  4073. <!--end of image pop up-->
  4074. </div>
  4075. <!--end of 1st twitter box-->
  4076. </div>
  4077.  
  4078.  
  4079.  
  4080.  
  4081.  
  4082. <!--2nd twitter box for more tweets-->
  4083. <div id="twitter2">
  4084. <div id="twbg">
  4085.  
  4086. <!--1st tweet-->
  4087.  
  4088. <div id="twi">
  4089. <div id="twinfo">
  4090. <div id="twname">name</div>
  4091. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 10h</div>
  4092. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  4093.  
  4094.  
  4095. <div id="twpic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  4096.  
  4097. <div id="tweet">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  4098.  
  4099.  
  4100. <div id="twnotes">
  4101. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  4102. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  4103. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  4104. </div>
  4105.  
  4106. <div id="twact">
  4107. <i class="fa fa-signal" aria-hidden="true"></i>
  4108. </div>
  4109.  
  4110.  
  4111. <div id="twsep"></div>
  4112.  
  4113.  
  4114.  
  4115. <!--2nd tweet -->
  4116.  
  4117. <div id="twinfo" style="margin-top:112px;">
  4118. <div id="twname">name</div>
  4119. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  4120. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  4121.  
  4122.  
  4123. <div id="twpic" style="margin-top:112px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  4124.  
  4125. <div id="tweet" style="margin-top:133px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  4126.  
  4127.  
  4128. <div id="twnotes" style="margin-top:193px;">
  4129. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  4130. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  4131. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  4132. </div>
  4133.  
  4134. <div id="twact" style="margin-top:193px;">
  4135. <i class="fa fa-signal" aria-hidden="true"></i>
  4136. </div>
  4137.  
  4138.  
  4139. <div id="twsep" style="margin-top:210px;"></div>
  4140.  
  4141.  
  4142. <!--3rd tweet-->
  4143. <div id="twinfo" style="margin-top:218px;">
  4144. <div id="twname">name</div>
  4145. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  4146. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  4147.  
  4148.  
  4149. <div id="twpic" style="margin-top:218px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  4150.  
  4151. <div id="tweet" style="margin-top:237px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  4152.  
  4153.  
  4154. <div id="twnotes" style="margin-top:296px;">
  4155. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  4156. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  4157. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  4158. </div>
  4159.  
  4160. <div id="twact" style="margin-top:296px;">
  4161. <i class="fa fa-signal" aria-hidden="true"></i>
  4162. </div>
  4163.  
  4164. <div id="twsep" style="margin-top:313px;"></div>
  4165. <!--end of tweets-->
  4166. </div>
  4167. <!--end of 2nd twitter box-->
  4168. </div>
  4169. <!--end of twitter-->
  4170.  
  4171.  
  4172.  
  4173. <!--instagram-->
  4174. <div id='ig'>
  4175. <div id="igic"> <img src="https://78.media.tumblr.com/c0cc8dd37837fcd6d572236fdf089b21/tumblr_inline_ozi3q6yoLu1rvzd3s_540.png"/> </div>
  4176.  
  4177. <div id="iguser">
  4178. username <i class="fa fa-check-circle" aria-hidden="true" style="color:#519bd6;"></i>
  4179. </div>
  4180.  
  4181. <div id="igstats">
  4182. <b>###</b> posts <b>###m</b> followers <b>###</b> following
  4183. </div>
  4184.  
  4185. <div id="igdesc">
  4186. <b>name.</b> instagram bio goes here. don't make it longer than three lines <br>
  4187. <a href="/museurl" title="muse's url">site.com</a>
  4188. </div>
  4189.  
  4190.  
  4191. <div id="igposts">
  4192.  
  4193. <div id="igim"> <img src="https://78.media.tumblr.com/f11d0cc9ba78fdb7d98fc0aa386a0c9c/tumblr_inline_ozi3qprISd1rvzd3s_540.png"/> </div>
  4194.  
  4195.  
  4196. <div id="igim" style="margin-left:120px;"> <img src="https://78.media.tumblr.com/ff2836c8a6b56b18db7422832bbb757d/tumblr_inline_ozi3qqVFdP1rvzd3s_540.png"/> </div>
  4197.  
  4198.  
  4199. <div id="igim" style="margin-left:200px;"> <img src="https://78.media.tumblr.com/cce56591ef05ece7304268166297a5a5/tumblr_inline_ozi3qqgzfk1rvzd3s_540.png"/> </div>
  4200.  
  4201.  
  4202. <!--second row-->
  4203.  
  4204.  
  4205. <div id="igim" style="margin-top:85px;"> <img src="https://78.media.tumblr.com/af803c5d7fa334fed5c3b2daa4d65245/tumblr_inline_ozi3r0mSw41rvzd3s_540.png"/> </div>
  4206.  
  4207.  
  4208. <div id="igim" style="margin-top:85px; margin-left:120px;"> <img src="https://78.media.tumblr.com/e5bfc3c14783b6342df0499f671745d3/tumblr_inline_ozi3r06KXe1rvzd3s_540.png"/> </div>
  4209.  
  4210.  
  4211. <div id="igim" style="margin-top:85px; margin-left:200px;"> <img src="https://78.media.tumblr.com/5e311035b1f11f4ac75f0fdf35ea8f18/tumblr_inline_ozi3r13gHP1rvzd3s_540.png"/> </div>
  4212.  
  4213.  
  4214. </div>
  4215. <!--end of instagram-->
  4216. </div>
  4217.  
  4218. <!--end of seventh muse box-->
  4219. </div>
  4220. </div>
  4221.  
  4222.  
  4223. <!-- eigth muse box-->
  4224.  
  4225. <div id="TabzEight" class="tabzcon alytut" style="display:none">
  4226. <span onclick="this.parentElement.style.display='none'" class="tabzclose">
  4227. <a title="close">EXIT</a>
  4228. </span>
  4229.  
  4230.  
  4231. <div id="fcim"> <img src="https://78.media.tumblr.com/d1511adc3c9335751d3e1886a22184fd/tumblr_inline_ozi3mdge7x1rvzd3s_540.png"/> </div>
  4232. <div id="label">muse name - The label</div>
  4233. <div id="fcbox">
  4234. <div id="fcinfo"> you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls.
  4235. </div>
  4236. </div>
  4237.  
  4238. <!--iMessage box-->
  4239. <div id="ibox">name</div>
  4240. <div id="ibox2">
  4241. <ul class="convo" style="color:#fff;">
  4242. <li class="line_odd user_1">text one goes here. </li>
  4243. <li class="line_even user_2">or you can swap the lines so that the blue imessage is at the top.</li>
  4244. <li class="line_even user_2">you can put whatever you want here, in whatever order.</li>
  4245. <li class="line_odd user_1">this box scrolls by the way, so you can add more messages if you like.</li>
  4246. </ul>
  4247. </div>
  4248. <!--end of iMessage box-->
  4249.  
  4250.  
  4251.  
  4252. <!-- snapchat box and info-->
  4253. <div class="snap">
  4254.  
  4255. <div class="snapuser">snapuser</div>
  4256. <div class="snaptime">18h ago</div>
  4257. <div class="snapcap" style="margin-top:230px;">caption</div>
  4258. <div style="margin-top:0px;"><img src="https://78.media.tumblr.com/3504c178a1ffb7fbed77d98e805ef4f4/tumblr_inline_ozi3o62fbP1rvzd3s_540.png"></div>
  4259.  
  4260. <!-- copy from here -->
  4261. <div class="snap2">
  4262. <div class="snaptime" style="margin-top:-261px;">15h ago</div>
  4263. <!--<div class="snapcap" style="margin-top:-60px;">you can hide the caption box if you don't want to use it</div>-->
  4264. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/f694b50f53904660e3803e2f60da4789/tumblr_inline_ozi3p0MJJF1rvzd3s_540.png"></div></div>
  4265. <!--- to here. change 'snap2' to the next snap number -->
  4266.  
  4267. <!-- copy from here -->
  4268. <div class="snap3">
  4269. <div class="snaptime" style="margin-top:-261px;">8h ago</div>
  4270. <div class="snapcap" style="margin-top:-90px;">caption</div>
  4271. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/8a8b12ea1ff366c9741be95c724f181f/tumblr_inline_ozi3p0UpYY1rvzd3s_540.png"></div></div>
  4272. <!--- to here. change 'snap3' to the next snap number -->
  4273.  
  4274.  
  4275. <!-- copy from here -->
  4276. <div class="snap4">
  4277. <div class="snaptime" style="margin-top:-261px;">3h ago</div>
  4278. <div class="snapcap" style="margin-top:-90px;">caption</div>
  4279. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/b67af846b1ca76aef1f4301638864d8b/tumblr_inline_ozi3p9e4QI1rvzd3s_540.png"></div></div>
  4280. <!--- to here. change 'snap4' to the next snap number -->
  4281.  
  4282.  
  4283. <div class="snap5">
  4284. <div class="snaptime" style="margin-top:-261px;">3m ago</div>
  4285. <div class="snapcap" style="margin-top:-90px;">caption</div>
  4286. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/9af9cd6d13767f20dcbcab68d3bae2b1/tumblr_inline_ozi3prkUfg1rvzd3s_540.png"></div></div>
  4287.  
  4288.  
  4289. <div class="snap6">
  4290. <div class="snaptime" style="margin-top:-261px;">1m ago</div>
  4291. <div class="snapcap" style="margin-top:-90px;">caption</div>
  4292. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/dc3a3e4eead7f8abe1946055ae37b4e4/tumblr_inline_ozi3pyIgpm1rvzd3s_540.png"></div></div>
  4293. </div>
  4294. <!--end of snapchat box-->
  4295.  
  4296.  
  4297. <!--connections box-->
  4298. <div id="conbox">
  4299. <div id="conbox2">
  4300. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  4301. </div>
  4302.  
  4303.  
  4304.  
  4305. <div id="conicon"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/c70729ce8901968c74cd2fdd4064ee9d/tumblr_inline_ozi3mkORqC1rvzd3s_540.png"/></div></a>
  4306.  
  4307. <!-- 2nd connection-->
  4308. <div id="conbox3">
  4309. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  4310. </div>
  4311.  
  4312. <div id="conicon2"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/b1038815ee0e3c1ddac97cc10f59d2e2/tumblr_inline_ozi3mjpJJL1rvzd3s_540.png"/></div></a>
  4313.  
  4314.  
  4315. <!--3rd connection-->
  4316. <!--you can add more connections if you want, just copy from here -->
  4317.  
  4318. <div id="conbox2" style="margin-top:170px;">
  4319. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  4320. </div>
  4321.  
  4322. <div id="conicon" style="margin-top:170px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/2bd8435ce1cd93d7e22796ecb1bc44ab/tumblr_inline_ozi3mjWgKO1rvzd3s_540.png"/></div></a>
  4323.  
  4324. <!--4th connection-->
  4325.  
  4326. <div id="conbox3" style="margin-top:250px;">
  4327. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  4328. </div>
  4329.  
  4330. <div id="conicon2" style="margin-top:250px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/690039f56be111f5e89c514ada430396/tumblr_inline_ozi3mvqtZi1rvzd3s_540.png"/></div></a>
  4331.  
  4332. <!--to here, and change the 'margin-top'.-->
  4333.  
  4334.  
  4335.  
  4336. <!--5th connection-->
  4337. <!--you can add more connections if you want, just copy from here -->
  4338.  
  4339. <div id="conbox2" style="margin-top:330px;">
  4340. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  4341. </div>
  4342.  
  4343. <div id="conicon" style="margin-top:330px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/f3140f3c299f4c3bdb0b3c74f010a673/tumblr_inline_ozi3muIEFJ1rvzd3s_540.png"/></div></a>
  4344.  
  4345.  
  4346. <!--6th connection-->
  4347.  
  4348. <div id="conbox3" style="margin-top:410px;">
  4349. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  4350. </div>
  4351.  
  4352. <div id="conicon2" style="margin-top:410px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/dc8179b36a5759923b93cdcd5b776d0f/tumblr_inline_ozi3muQ3XN1rvzd3s_540.png"/></div></a>
  4353.  
  4354. <!--to here, and change the 'margin-top'.-->
  4355.  
  4356.  
  4357.  
  4358. </div>
  4359. <!-- end of connections box-->
  4360.  
  4361.  
  4362.  
  4363. <!--twitter-->
  4364. <!-- if you steal this part of my code, i WILL come after you-->
  4365. <div id="twitter">
  4366. <div id="twithead"><img src="https://78.media.tumblr.com/23ad5e786f5e71e993ae10ecc9dc3259/tumblr_inline_ozi3nx8QlX1rvzd3s_540.png"/></div>
  4367.  
  4368. <div id="twitbg">
  4369. <div id="twitname">name</div>
  4370. <div id="twituser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i></div>
  4371. <div id="twitdesc">Keep this description short. It shouldn't be longer than to lines.</div>
  4372. <div id="twitf"><b>50</b> Following <div style="margin-top:-14px; margin-left:100px;"><b>7.5m</b> Followers</div></div>
  4373. <div id="twitpro">Edit profile</div>
  4374. </div>
  4375.  
  4376. <div id="twitic"><img src="https://78.media.tumblr.com/d685c605911ce3829cded2f824a54385/tumblr_inline_ozi3nbxfj31rvzd3s_540.png"/></div>
  4377.  
  4378.  
  4379. <div id="twitborder"></div>
  4380. <div id="twitinfo">
  4381. <div style="margin-left:3px;"><b>Tweets</b></div>
  4382. <div style="margin-left:56px; margin-top:-16px;">Tweets & replies</div>
  4383. <div style="margin-left:168px; margin-top:-16px;">Media</div>
  4384. <div style="margin-left:218px; margin-top:-16px;">Likes</div>
  4385.  
  4386. </div>
  4387.  
  4388. <!--tweets and such go here-->
  4389.  
  4390. <div id="pinned">
  4391. <div id="pinfo">
  4392. <i class="fa fa-thumb-tack" aria-hidden="true"></i> Pinned Tweet
  4393. <div id="pname">name</div>
  4394. <div id="puser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h</div>
  4395. <div style="margin-top:3px; margin-left:193px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div>
  4396. </div>
  4397.  
  4398. <div id="pic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  4399.  
  4400. <div id="ptweet">photo caption.</div>
  4401.  
  4402.  
  4403. <div id="pim"> <a href="#?w=240" rel="box8" class="poplight" title="click me!"><img src="https://78.media.tumblr.com/557e5b97efa45710830293c69c743f30/tumblr_inline_ozi3naqqwC1rvzd3s_540.png"/></a></div>
  4404.  
  4405.  
  4406. <div id="ptagged">
  4407. twitter name and # others <!-- no more than "9" others btw -->
  4408. </div>
  4409.  
  4410. <div id="pnotes">
  4411. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  4412. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  4413. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  4414. </div>
  4415.  
  4416. <div id="pact">
  4417. <i class="fa fa-signal" aria-hidden="true"></i>
  4418. </div>
  4419. <!--end of pinned tweet-->
  4420. </div>
  4421.  
  4422.  
  4423. <!--pinned image pop up-->
  4424. <div id="box8" class="popup_block" style="height:395px;">
  4425.  
  4426. <div id="pinpop"><img src="https://78.media.tumblr.com/84674ef6fac489e6173246af5a5ff330/tumblr_inline_ozr3y46d151rvzd3s_540.png"/></div>
  4427.  
  4428. <div id="pinpopz">
  4429.  
  4430. <!--popup image caption box. hover over the image to view caption-->
  4431. <div id="ppopinf">
  4432. <div id="popname">name</div>
  4433. <div id="popuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h <div style="margin-top:-13px; margin-left:190px;"><span class="lnr lnr-chevron-down"></span></div> </div>
  4434.  
  4435.  
  4436. <div id="poptweet">keep this caption about two to three lines short. this box doesn't scroll. keep this caption about two to three lines short.</div>
  4437.  
  4438. <div id="poptagged">
  4439. twitter name and # others <!-- no more than "9" others btw --></div>
  4440.  
  4441. </div>
  4442. <!--end of caption box-->
  4443. </div>
  4444.  
  4445.  
  4446.  
  4447.  
  4448. <div id="popsep"></div>
  4449. <div id="popbox">
  4450.  
  4451. <!--popup box notes-->
  4452. <div id="popnotes">
  4453. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  4454. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  4455. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  4456. </div>
  4457.  
  4458. <div id="popmess">
  4459. <i class="fa fa-envelope-o" aria-hidden="true"></i></div>
  4460.  
  4461. <!--end of popup box notes -->
  4462. </div>
  4463.  
  4464. <!--end of image pop up-->
  4465. </div>
  4466. <!--end of 1st twitter box-->
  4467. </div>
  4468.  
  4469.  
  4470.  
  4471.  
  4472.  
  4473. <!--2nd twitter box for more tweets-->
  4474. <div id="twitter2">
  4475. <div id="twbg">
  4476.  
  4477. <!--1st tweet-->
  4478.  
  4479. <div id="twi">
  4480. <div id="twinfo">
  4481. <div id="twname">name</div>
  4482. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 10h</div>
  4483. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  4484.  
  4485.  
  4486. <div id="twpic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  4487.  
  4488. <div id="tweet">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  4489.  
  4490.  
  4491. <div id="twnotes">
  4492. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  4493. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  4494. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  4495. </div>
  4496.  
  4497. <div id="twact">
  4498. <i class="fa fa-signal" aria-hidden="true"></i>
  4499. </div>
  4500.  
  4501.  
  4502. <div id="twsep"></div>
  4503.  
  4504.  
  4505.  
  4506. <!--2nd tweet -->
  4507.  
  4508. <div id="twinfo" style="margin-top:112px;">
  4509. <div id="twname">name</div>
  4510. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  4511. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  4512.  
  4513.  
  4514. <div id="twpic" style="margin-top:112px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  4515.  
  4516. <div id="tweet" style="margin-top:133px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  4517.  
  4518.  
  4519. <div id="twnotes" style="margin-top:193px;">
  4520. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  4521. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  4522. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  4523. </div>
  4524.  
  4525. <div id="twact" style="margin-top:193px;">
  4526. <i class="fa fa-signal" aria-hidden="true"></i>
  4527. </div>
  4528.  
  4529.  
  4530. <div id="twsep" style="margin-top:210px;"></div>
  4531.  
  4532.  
  4533. <!--3rd tweet-->
  4534. <div id="twinfo" style="margin-top:218px;">
  4535. <div id="twname">name</div>
  4536. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  4537. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  4538.  
  4539.  
  4540. <div id="twpic" style="margin-top:218px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  4541.  
  4542. <div id="tweet" style="margin-top:237px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  4543.  
  4544.  
  4545. <div id="twnotes" style="margin-top:296px;">
  4546. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  4547. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  4548. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  4549. </div>
  4550.  
  4551. <div id="twact" style="margin-top:296px;">
  4552. <i class="fa fa-signal" aria-hidden="true"></i>
  4553. </div>
  4554.  
  4555. <div id="twsep" style="margin-top:313px;"></div>
  4556. <!--end of tweets-->
  4557. </div>
  4558. <!--end of 2nd twitter box-->
  4559. </div>
  4560. <!--end of twitter-->
  4561.  
  4562.  
  4563.  
  4564. <!--instagram-->
  4565. <div id='ig'>
  4566. <div id="igic"> <img src="https://78.media.tumblr.com/c0cc8dd37837fcd6d572236fdf089b21/tumblr_inline_ozi3q6yoLu1rvzd3s_540.png"/> </div>
  4567.  
  4568. <div id="iguser">
  4569. username <i class="fa fa-check-circle" aria-hidden="true" style="color:#519bd6;"></i>
  4570. </div>
  4571.  
  4572. <div id="igstats">
  4573. <b>###</b> posts <b>###m</b> followers <b>###</b> following
  4574. </div>
  4575.  
  4576. <div id="igdesc">
  4577. <b>name.</b> instagram bio goes here. don't make it longer than three lines <br>
  4578. <a href="/museurl" title="muse's url">site.com</a>
  4579. </div>
  4580.  
  4581.  
  4582. <div id="igposts">
  4583.  
  4584. <div id="igim"> <img src="https://78.media.tumblr.com/f11d0cc9ba78fdb7d98fc0aa386a0c9c/tumblr_inline_ozi3qprISd1rvzd3s_540.png"/> </div>
  4585.  
  4586.  
  4587. <div id="igim" style="margin-left:120px;"> <img src="https://78.media.tumblr.com/ff2836c8a6b56b18db7422832bbb757d/tumblr_inline_ozi3qqVFdP1rvzd3s_540.png"/> </div>
  4588.  
  4589.  
  4590. <div id="igim" style="margin-left:200px;"> <img src="https://78.media.tumblr.com/cce56591ef05ece7304268166297a5a5/tumblr_inline_ozi3qqgzfk1rvzd3s_540.png"/> </div>
  4591.  
  4592.  
  4593. <!--second row-->
  4594.  
  4595.  
  4596. <div id="igim" style="margin-top:85px;"> <img src="https://78.media.tumblr.com/af803c5d7fa334fed5c3b2daa4d65245/tumblr_inline_ozi3r0mSw41rvzd3s_540.png"/> </div>
  4597.  
  4598.  
  4599. <div id="igim" style="margin-top:85px; margin-left:120px;"> <img src="https://78.media.tumblr.com/e5bfc3c14783b6342df0499f671745d3/tumblr_inline_ozi3r06KXe1rvzd3s_540.png"/> </div>
  4600.  
  4601.  
  4602. <div id="igim" style="margin-top:85px; margin-left:200px;"> <img src="https://78.media.tumblr.com/5e311035b1f11f4ac75f0fdf35ea8f18/tumblr_inline_ozi3r13gHP1rvzd3s_540.png"/> </div>
  4603.  
  4604.  
  4605. </div>
  4606. <!--end of instagram-->
  4607. </div>
  4608.  
  4609. <!--end of eighth muse box-->
  4610. </div>
  4611. </div>
  4612.  
  4613.  
  4614.  
  4615.  
  4616.  
  4617. <!-- ninth muse box-->
  4618.  
  4619. <div id="TabzNine" class="tabzcon alytut" style="display:none">
  4620. <span onclick="this.parentElement.style.display='none'" class="tabzclose">
  4621. <a title="close">EXIT</a>
  4622. </span>
  4623.  
  4624.  
  4625. <div id="fcim"> <img src="https://78.media.tumblr.com/d1511adc3c9335751d3e1886a22184fd/tumblr_inline_ozi3mdge7x1rvzd3s_540.png"/> </div>
  4626. <div id="label">muse name - The label</div>
  4627. <div id="fcbox">
  4628. <div id="fcinfo"> you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls.
  4629. </div>
  4630. </div>
  4631.  
  4632. <!--iMessage box-->
  4633. <div id="ibox">name</div>
  4634. <div id="ibox2">
  4635. <ul class="convo" style="color:#fff;">
  4636. <li class="line_odd user_1">text one goes here. </li>
  4637. <li class="line_even user_2">or you can swap the lines so that the blue imessage is at the top.</li>
  4638. <li class="line_even user_2">you can put whatever you want here, in whatever order.</li>
  4639. <li class="line_odd user_1">this box scrolls by the way, so you can add more messages if you like.</li>
  4640. </ul>
  4641. </div>
  4642. <!--end of iMessage box-->
  4643.  
  4644.  
  4645.  
  4646. <!-- snapchat box and info-->
  4647. <div class="snap">
  4648.  
  4649. <div class="snapuser">snapuser</div>
  4650. <div class="snaptime">18h ago</div>
  4651. <div class="snapcap" style="margin-top:230px;">caption</div>
  4652. <div style="margin-top:0px;"><img src="https://78.media.tumblr.com/3504c178a1ffb7fbed77d98e805ef4f4/tumblr_inline_ozi3o62fbP1rvzd3s_540.png"></div>
  4653.  
  4654. <!-- copy from here -->
  4655. <div class="snap2">
  4656. <div class="snaptime" style="margin-top:-261px;">15h ago</div>
  4657. <!--<div class="snapcap" style="margin-top:-60px;">you can hide the caption box if you don't want to use it</div>-->
  4658. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/f694b50f53904660e3803e2f60da4789/tumblr_inline_ozi3p0MJJF1rvzd3s_540.png"></div></div>
  4659. <!--- to here. change 'snap2' to the next snap number -->
  4660.  
  4661. <!-- copy from here -->
  4662. <div class="snap3">
  4663. <div class="snaptime" style="margin-top:-261px;">8h ago</div>
  4664. <div class="snapcap" style="margin-top:-90px;">caption</div>
  4665. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/8a8b12ea1ff366c9741be95c724f181f/tumblr_inline_ozi3p0UpYY1rvzd3s_540.png"></div></div>
  4666. <!--- to here. change 'snap3' to the next snap number -->
  4667.  
  4668.  
  4669. <!-- copy from here -->
  4670. <div class="snap4">
  4671. <div class="snaptime" style="margin-top:-261px;">3h ago</div>
  4672. <div class="snapcap" style="margin-top:-90px;">caption</div>
  4673. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/b67af846b1ca76aef1f4301638864d8b/tumblr_inline_ozi3p9e4QI1rvzd3s_540.png"></div></div>
  4674. <!--- to here. change 'snap4' to the next snap number -->
  4675.  
  4676.  
  4677. <div class="snap5">
  4678. <div class="snaptime" style="margin-top:-261px;">3m ago</div>
  4679. <div class="snapcap" style="margin-top:-90px;">caption</div>
  4680. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/9af9cd6d13767f20dcbcab68d3bae2b1/tumblr_inline_ozi3prkUfg1rvzd3s_540.png"></div></div>
  4681.  
  4682.  
  4683. <div class="snap6">
  4684. <div class="snaptime" style="margin-top:-261px;">1m ago</div>
  4685. <div class="snapcap" style="margin-top:-90px;">caption</div>
  4686. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/dc3a3e4eead7f8abe1946055ae37b4e4/tumblr_inline_ozi3pyIgpm1rvzd3s_540.png"></div></div>
  4687. </div>
  4688. <!--end of snapchat box-->
  4689.  
  4690.  
  4691. <!--connections box-->
  4692. <div id="conbox">
  4693. <div id="conbox2">
  4694. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  4695. </div>
  4696.  
  4697.  
  4698.  
  4699. <div id="conicon"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/c70729ce8901968c74cd2fdd4064ee9d/tumblr_inline_ozi3mkORqC1rvzd3s_540.png"/></div></a>
  4700.  
  4701. <!-- 2nd connection-->
  4702. <div id="conbox3">
  4703. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  4704. </div>
  4705.  
  4706. <div id="conicon2"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/b1038815ee0e3c1ddac97cc10f59d2e2/tumblr_inline_ozi3mjpJJL1rvzd3s_540.png"/></div></a>
  4707.  
  4708.  
  4709. <!--3rd connection-->
  4710. <!--you can add more connections if you want, just copy from here -->
  4711.  
  4712. <div id="conbox2" style="margin-top:170px;">
  4713. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  4714. </div>
  4715.  
  4716. <div id="conicon" style="margin-top:170px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/2bd8435ce1cd93d7e22796ecb1bc44ab/tumblr_inline_ozi3mjWgKO1rvzd3s_540.png"/></div></a>
  4717.  
  4718. <!--4th connection-->
  4719.  
  4720. <div id="conbox3" style="margin-top:250px;">
  4721. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  4722. </div>
  4723.  
  4724. <div id="conicon2" style="margin-top:250px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/690039f56be111f5e89c514ada430396/tumblr_inline_ozi3mvqtZi1rvzd3s_540.png"/></div></a>
  4725.  
  4726. <!--to here, and change the 'margin-top'.-->
  4727.  
  4728.  
  4729.  
  4730. <!--5th connection-->
  4731. <!--you can add more connections if you want, just copy from here -->
  4732.  
  4733. <div id="conbox2" style="margin-top:330px;">
  4734. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  4735. </div>
  4736.  
  4737. <div id="conicon" style="margin-top:330px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/f3140f3c299f4c3bdb0b3c74f010a673/tumblr_inline_ozi3muIEFJ1rvzd3s_540.png"/></div></a>
  4738.  
  4739.  
  4740. <!--6th connection-->
  4741.  
  4742. <div id="conbox3" style="margin-top:410px;">
  4743. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  4744. </div>
  4745.  
  4746. <div id="conicon2" style="margin-top:410px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/dc8179b36a5759923b93cdcd5b776d0f/tumblr_inline_ozi3muQ3XN1rvzd3s_540.png"/></div></a>
  4747.  
  4748. <!--to here, and change the 'margin-top'.-->
  4749.  
  4750.  
  4751.  
  4752. </div>
  4753. <!-- end of connections box-->
  4754.  
  4755.  
  4756.  
  4757. <!--twitter-->
  4758. <!-- if you steal this part of my code, i WILL come after you-->
  4759. <div id="twitter">
  4760. <div id="twithead"><img src="https://78.media.tumblr.com/23ad5e786f5e71e993ae10ecc9dc3259/tumblr_inline_ozi3nx8QlX1rvzd3s_540.png"/></div>
  4761.  
  4762. <div id="twitbg">
  4763. <div id="twitname">name</div>
  4764. <div id="twituser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i></div>
  4765. <div id="twitdesc">Keep this description short. It shouldn't be longer than to lines.</div>
  4766. <div id="twitf"><b>50</b> Following <div style="margin-top:-14px; margin-left:100px;"><b>7.5m</b> Followers</div></div>
  4767. <div id="twitpro">Edit profile</div>
  4768. </div>
  4769.  
  4770. <div id="twitic"><img src="https://78.media.tumblr.com/d685c605911ce3829cded2f824a54385/tumblr_inline_ozi3nbxfj31rvzd3s_540.png"/></div>
  4771.  
  4772.  
  4773. <div id="twitborder"></div>
  4774. <div id="twitinfo">
  4775. <div style="margin-left:3px;"><b>Tweets</b></div>
  4776. <div style="margin-left:56px; margin-top:-16px;">Tweets & replies</div>
  4777. <div style="margin-left:168px; margin-top:-16px;">Media</div>
  4778. <div style="margin-left:218px; margin-top:-16px;">Likes</div>
  4779.  
  4780. </div>
  4781.  
  4782. <!--tweets and such go here-->
  4783.  
  4784. <div id="pinned">
  4785. <div id="pinfo">
  4786. <i class="fa fa-thumb-tack" aria-hidden="true"></i> Pinned Tweet
  4787. <div id="pname">name</div>
  4788. <div id="puser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h</div>
  4789. <div style="margin-top:3px; margin-left:193px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div>
  4790. </div>
  4791.  
  4792. <div id="pic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  4793.  
  4794. <div id="ptweet">photo caption.</div>
  4795.  
  4796.  
  4797. <div id="pim"> <a href="#?w=240" rel="box9" class="poplight" title="click me!"><img src="https://78.media.tumblr.com/557e5b97efa45710830293c69c743f30/tumblr_inline_ozi3naqqwC1rvzd3s_540.png"/></a></div>
  4798.  
  4799.  
  4800. <div id="ptagged">
  4801. twitter name and # others <!-- no more than "9" others btw -->
  4802. </div>
  4803.  
  4804. <div id="pnotes">
  4805. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  4806. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  4807. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  4808. </div>
  4809.  
  4810. <div id="pact">
  4811. <i class="fa fa-signal" aria-hidden="true"></i>
  4812. </div>
  4813. <!--end of pinned tweet-->
  4814. </div>
  4815.  
  4816.  
  4817. <!--pinned image pop up-->
  4818. <div id="box9" class="popup_block" style="height:395px;">
  4819.  
  4820. <div id="pinpop"><img src="https://78.media.tumblr.com/84674ef6fac489e6173246af5a5ff330/tumblr_inline_ozr3y46d151rvzd3s_540.png"/></div>
  4821.  
  4822. <div id="pinpopz">
  4823.  
  4824. <!--popup image caption box. hover over the image to view caption-->
  4825. <div id="ppopinf">
  4826. <div id="popname">name</div>
  4827. <div id="popuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h <div style="margin-top:-13px; margin-left:190px;"><span class="lnr lnr-chevron-down"></span></div> </div>
  4828.  
  4829.  
  4830. <div id="poptweet">keep this caption about two to three lines short. this box doesn't scroll. keep this caption about two to three lines short.</div>
  4831.  
  4832. <div id="poptagged">
  4833. twitter name and # others <!-- no more than "9" others btw --></div>
  4834.  
  4835. </div>
  4836. <!--end of caption box-->
  4837. </div>
  4838.  
  4839.  
  4840.  
  4841.  
  4842. <div id="popsep"></div>
  4843. <div id="popbox">
  4844.  
  4845. <!--popup box notes-->
  4846. <div id="popnotes">
  4847. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  4848. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  4849. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  4850. </div>
  4851.  
  4852. <div id="popmess">
  4853. <i class="fa fa-envelope-o" aria-hidden="true"></i></div>
  4854.  
  4855. <!--end of popup box notes -->
  4856. </div>
  4857.  
  4858. <!--end of image pop up-->
  4859. </div>
  4860. <!--end of 1st twitter box-->
  4861. </div>
  4862.  
  4863.  
  4864.  
  4865.  
  4866.  
  4867. <!--2nd twitter box for more tweets-->
  4868. <div id="twitter2">
  4869. <div id="twbg">
  4870.  
  4871. <!--1st tweet-->
  4872.  
  4873. <div id="twi">
  4874. <div id="twinfo">
  4875. <div id="twname">name</div>
  4876. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 10h</div>
  4877. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  4878.  
  4879.  
  4880. <div id="twpic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  4881.  
  4882. <div id="tweet">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  4883.  
  4884.  
  4885. <div id="twnotes">
  4886. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  4887. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  4888. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  4889. </div>
  4890.  
  4891. <div id="twact">
  4892. <i class="fa fa-signal" aria-hidden="true"></i>
  4893. </div>
  4894.  
  4895.  
  4896. <div id="twsep"></div>
  4897.  
  4898.  
  4899.  
  4900. <!--2nd tweet -->
  4901.  
  4902. <div id="twinfo" style="margin-top:112px;">
  4903. <div id="twname">name</div>
  4904. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  4905. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  4906.  
  4907.  
  4908. <div id="twpic" style="margin-top:112px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  4909.  
  4910. <div id="tweet" style="margin-top:133px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  4911.  
  4912.  
  4913. <div id="twnotes" style="margin-top:193px;">
  4914. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  4915. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  4916. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  4917. </div>
  4918.  
  4919. <div id="twact" style="margin-top:193px;">
  4920. <i class="fa fa-signal" aria-hidden="true"></i>
  4921. </div>
  4922.  
  4923.  
  4924. <div id="twsep" style="margin-top:210px;"></div>
  4925.  
  4926.  
  4927. <!--3rd tweet-->
  4928. <div id="twinfo" style="margin-top:218px;">
  4929. <div id="twname">name</div>
  4930. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  4931. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  4932.  
  4933.  
  4934. <div id="twpic" style="margin-top:218px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  4935.  
  4936. <div id="tweet" style="margin-top:237px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  4937.  
  4938.  
  4939. <div id="twnotes" style="margin-top:296px;">
  4940. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  4941. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  4942. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  4943. </div>
  4944.  
  4945. <div id="twact" style="margin-top:296px;">
  4946. <i class="fa fa-signal" aria-hidden="true"></i>
  4947. </div>
  4948.  
  4949. <div id="twsep" style="margin-top:313px;"></div>
  4950. <!--end of tweets-->
  4951. </div>
  4952. <!--end of 2nd twitter box-->
  4953. </div>
  4954. <!--end of twitter-->
  4955.  
  4956.  
  4957.  
  4958.  
  4959.  
  4960. <!--instagram-->
  4961. <div id='ig'>
  4962. <div id="igic"> <img src="https://78.media.tumblr.com/c0cc8dd37837fcd6d572236fdf089b21/tumblr_inline_ozi3q6yoLu1rvzd3s_540.png"/> </div>
  4963.  
  4964. <div id="iguser">
  4965. username <i class="fa fa-check-circle" aria-hidden="true" style="color:#519bd6;"></i>
  4966. </div>
  4967.  
  4968. <div id="igstats">
  4969. <b>###</b> posts <b>###m</b> followers <b>###</b> following
  4970. </div>
  4971.  
  4972. <div id="igdesc">
  4973. <b>name.</b> instagram bio goes here. don't make it longer than three lines <br>
  4974. <a href="/museurl" title="muse's url">site.com</a>
  4975. </div>
  4976.  
  4977.  
  4978. <div id="igposts">
  4979.  
  4980. <div id="igim"> <img src="https://78.media.tumblr.com/f11d0cc9ba78fdb7d98fc0aa386a0c9c/tumblr_inline_ozi3qprISd1rvzd3s_540.png"/> </div>
  4981.  
  4982.  
  4983. <div id="igim" style="margin-left:120px;"> <img src="https://78.media.tumblr.com/ff2836c8a6b56b18db7422832bbb757d/tumblr_inline_ozi3qqVFdP1rvzd3s_540.png"/> </div>
  4984.  
  4985.  
  4986. <div id="igim" style="margin-left:200px;"> <img src="https://78.media.tumblr.com/cce56591ef05ece7304268166297a5a5/tumblr_inline_ozi3qqgzfk1rvzd3s_540.png"/> </div>
  4987.  
  4988.  
  4989. <!--second row-->
  4990.  
  4991.  
  4992. <div id="igim" style="margin-top:85px;"> <img src="https://78.media.tumblr.com/af803c5d7fa334fed5c3b2daa4d65245/tumblr_inline_ozi3r0mSw41rvzd3s_540.png"/> </div>
  4993.  
  4994.  
  4995. <div id="igim" style="margin-top:85px; margin-left:120px;"> <img src="https://78.media.tumblr.com/e5bfc3c14783b6342df0499f671745d3/tumblr_inline_ozi3r06KXe1rvzd3s_540.png"/> </div>
  4996.  
  4997.  
  4998. <div id="igim" style="margin-top:85px; margin-left:200px;"> <img src="https://78.media.tumblr.com/5e311035b1f11f4ac75f0fdf35ea8f18/tumblr_inline_ozi3r13gHP1rvzd3s_540.png"/> </div>
  4999.  
  5000.  
  5001. </div>
  5002. <!--end of instagram-->
  5003. </div>
  5004.  
  5005. <!--end of ninth muse box-->
  5006. </div>
  5007. </div>
  5008.  
  5009.  
  5010.  
  5011. <!-- tenth muse box-->
  5012.  
  5013. <div id="TabzTen" class="tabzcon alytut" style="display:none">
  5014. <span onclick="this.parentElement.style.display='none'" class="tabzclose">
  5015. <a title="close">EXIT</a>
  5016. </span>
  5017.  
  5018.  
  5019. <div id="fcim"> <img src="https://78.media.tumblr.com/d1511adc3c9335751d3e1886a22184fd/tumblr_inline_ozi3mdge7x1rvzd3s_540.png"/> </div>
  5020. <div id="label">muse name - The label</div>
  5021. <div id="fcbox">
  5022. <div id="fcinfo"> you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls.
  5023. </div>
  5024. </div>
  5025.  
  5026. <!--iMessage box-->
  5027. <div id="ibox">name</div>
  5028. <div id="ibox2">
  5029. <ul class="convo" style="color:#fff;">
  5030. <li class="line_odd user_1">text one goes here. </li>
  5031. <li class="line_even user_2">or you can swap the lines so that the blue imessage is at the top.</li>
  5032. <li class="line_even user_2">you can put whatever you want here, in whatever order.</li>
  5033. <li class="line_odd user_1">this box scrolls by the way, so you can add more messages if you like.</li>
  5034. </ul>
  5035. </div>
  5036. <!--end of iMessage box-->
  5037.  
  5038.  
  5039.  
  5040. <!-- snapchat box and info-->
  5041. <div class="snap">
  5042.  
  5043. <div class="snapuser">snapuser</div>
  5044. <div class="snaptime">18h ago</div>
  5045. <div class="snapcap" style="margin-top:230px;">caption</div>
  5046. <div style="margin-top:0px;"><img src="https://78.media.tumblr.com/3504c178a1ffb7fbed77d98e805ef4f4/tumblr_inline_ozi3o62fbP1rvzd3s_540.png"></div>
  5047.  
  5048. <!-- copy from here -->
  5049. <div class="snap2">
  5050. <div class="snaptime" style="margin-top:-261px;">15h ago</div>
  5051. <!--<div class="snapcap" style="margin-top:-60px;">you can hide the caption box if you don't want to use it</div>-->
  5052. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/f694b50f53904660e3803e2f60da4789/tumblr_inline_ozi3p0MJJF1rvzd3s_540.png"></div></div>
  5053. <!--- to here. change 'snap2' to the next snap number -->
  5054.  
  5055. <!-- copy from here -->
  5056. <div class="snap3">
  5057. <div class="snaptime" style="margin-top:-261px;">8h ago</div>
  5058. <div class="snapcap" style="margin-top:-90px;">caption</div>
  5059. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/8a8b12ea1ff366c9741be95c724f181f/tumblr_inline_ozi3p0UpYY1rvzd3s_540.png"></div></div>
  5060. <!--- to here. change 'snap3' to the next snap number -->
  5061.  
  5062.  
  5063. <!-- copy from here -->
  5064. <div class="snap4">
  5065. <div class="snaptime" style="margin-top:-261px;">3h ago</div>
  5066. <div class="snapcap" style="margin-top:-90px;">caption</div>
  5067. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/b67af846b1ca76aef1f4301638864d8b/tumblr_inline_ozi3p9e4QI1rvzd3s_540.png"></div></div>
  5068. <!--- to here. change 'snap4' to the next snap number -->
  5069.  
  5070.  
  5071. <div class="snap5">
  5072. <div class="snaptime" style="margin-top:-261px;">3m ago</div>
  5073. <div class="snapcap" style="margin-top:-90px;">caption</div>
  5074. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/9af9cd6d13767f20dcbcab68d3bae2b1/tumblr_inline_ozi3prkUfg1rvzd3s_540.png"></div></div>
  5075.  
  5076.  
  5077. <div class="snap6">
  5078. <div class="snaptime" style="margin-top:-261px;">1m ago</div>
  5079. <div class="snapcap" style="margin-top:-90px;">caption</div>
  5080. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/dc3a3e4eead7f8abe1946055ae37b4e4/tumblr_inline_ozi3pyIgpm1rvzd3s_540.png"></div></div>
  5081. </div>
  5082. <!--end of snapchat box-->
  5083.  
  5084.  
  5085. <!--connections box-->
  5086. <div id="conbox">
  5087. <div id="conbox2">
  5088. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  5089. </div>
  5090.  
  5091.  
  5092.  
  5093. <div id="conicon"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/c70729ce8901968c74cd2fdd4064ee9d/tumblr_inline_ozi3mkORqC1rvzd3s_540.png"/></div></a>
  5094.  
  5095. <!-- 2nd connection-->
  5096. <div id="conbox3">
  5097. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  5098. </div>
  5099.  
  5100. <div id="conicon2"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/b1038815ee0e3c1ddac97cc10f59d2e2/tumblr_inline_ozi3mjpJJL1rvzd3s_540.png"/></div></a>
  5101.  
  5102.  
  5103. <!--3rd connection-->
  5104. <!--you can add more connections if you want, just copy from here -->
  5105.  
  5106. <div id="conbox2" style="margin-top:170px;">
  5107. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  5108. </div>
  5109.  
  5110. <div id="conicon" style="margin-top:170px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/2bd8435ce1cd93d7e22796ecb1bc44ab/tumblr_inline_ozi3mjWgKO1rvzd3s_540.png"/></div></a>
  5111.  
  5112. <!--4th connection-->
  5113.  
  5114. <div id="conbox3" style="margin-top:250px;">
  5115. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  5116. </div>
  5117.  
  5118. <div id="conicon2" style="margin-top:250px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/690039f56be111f5e89c514ada430396/tumblr_inline_ozi3mvqtZi1rvzd3s_540.png"/></div></a>
  5119.  
  5120. <!--to here, and change the 'margin-top'.-->
  5121.  
  5122.  
  5123.  
  5124. <!--5th connection-->
  5125. <!--you can add more connections if you want, just copy from here -->
  5126.  
  5127. <div id="conbox2" style="margin-top:330px;">
  5128. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  5129. </div>
  5130.  
  5131. <div id="conicon" style="margin-top:330px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/f3140f3c299f4c3bdb0b3c74f010a673/tumblr_inline_ozi3muIEFJ1rvzd3s_540.png"/></div></a>
  5132.  
  5133.  
  5134. <!--6th connection-->
  5135.  
  5136. <div id="conbox3" style="margin-top:410px;">
  5137. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  5138. </div>
  5139.  
  5140. <div id="conicon2" style="margin-top:410px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/dc8179b36a5759923b93cdcd5b776d0f/tumblr_inline_ozi3muQ3XN1rvzd3s_540.png"/></div></a>
  5141.  
  5142. <!--to here, and change the 'margin-top'.-->
  5143.  
  5144.  
  5145.  
  5146. </div>
  5147. <!-- end of connections box-->
  5148.  
  5149.  
  5150.  
  5151. <!--twitter-->
  5152. <!-- if you steal this part of my code, i WILL come after you-->
  5153. <div id="twitter">
  5154. <div id="twithead"><img src="https://78.media.tumblr.com/23ad5e786f5e71e993ae10ecc9dc3259/tumblr_inline_ozi3nx8QlX1rvzd3s_540.png"/></div>
  5155.  
  5156. <div id="twitbg">
  5157. <div id="twitname">name</div>
  5158. <div id="twituser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i></div>
  5159. <div id="twitdesc">Keep this description short. It shouldn't be longer than to lines.</div>
  5160. <div id="twitf"><b>50</b> Following <div style="margin-top:-14px; margin-left:100px;"><b>7.5m</b> Followers</div></div>
  5161. <div id="twitpro">Edit profile</div>
  5162. </div>
  5163.  
  5164. <div id="twitic"><img src="https://78.media.tumblr.com/d685c605911ce3829cded2f824a54385/tumblr_inline_ozi3nbxfj31rvzd3s_540.png"/></div>
  5165.  
  5166.  
  5167. <div id="twitborder"></div>
  5168. <div id="twitinfo">
  5169. <div style="margin-left:3px;"><b>Tweets</b></div>
  5170. <div style="margin-left:56px; margin-top:-16px;">Tweets & replies</div>
  5171. <div style="margin-left:168px; margin-top:-16px;">Media</div>
  5172. <div style="margin-left:218px; margin-top:-16px;">Likes</div>
  5173.  
  5174. </div>
  5175.  
  5176. <!--tweets and such go here-->
  5177.  
  5178. <div id="pinned">
  5179. <div id="pinfo">
  5180. <i class="fa fa-thumb-tack" aria-hidden="true"></i> Pinned Tweet
  5181. <div id="pname">name</div>
  5182. <div id="puser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h</div>
  5183. <div style="margin-top:3px; margin-left:193px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div>
  5184. </div>
  5185.  
  5186. <div id="pic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  5187.  
  5188. <div id="ptweet">photo caption.</div>
  5189.  
  5190.  
  5191. <div id="pim"> <a href="#?w=240" rel="box10" class="poplight" title="click me!"><img src="https://78.media.tumblr.com/557e5b97efa45710830293c69c743f30/tumblr_inline_ozi3naqqwC1rvzd3s_540.png"/></a></div>
  5192.  
  5193.  
  5194. <div id="ptagged">
  5195. twitter name and # others <!-- no more than "9" others btw -->
  5196. </div>
  5197.  
  5198. <div id="pnotes">
  5199. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  5200. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  5201. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  5202. </div>
  5203.  
  5204. <div id="pact">
  5205. <i class="fa fa-signal" aria-hidden="true"></i>
  5206. </div>
  5207. <!--end of pinned tweet-->
  5208. </div>
  5209.  
  5210.  
  5211. <!--pinned image pop up-->
  5212. <div id="box10" class="popup_block" style="height:395px;">
  5213.  
  5214. <div id="pinpop"><img src="https://78.media.tumblr.com/84674ef6fac489e6173246af5a5ff330/tumblr_inline_ozr3y46d151rvzd3s_540.png"/></div>
  5215.  
  5216. <div id="pinpopz">
  5217.  
  5218. <!--popup image caption box. hover over the image to view caption-->
  5219. <div id="ppopinf">
  5220. <div id="popname">name</div>
  5221. <div id="popuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h <div style="margin-top:-13px; margin-left:190px;"><span class="lnr lnr-chevron-down"></span></div> </div>
  5222.  
  5223.  
  5224. <div id="poptweet">keep this caption about two to three lines short. this box doesn't scroll. keep this caption about two to three lines short.</div>
  5225.  
  5226. <div id="poptagged">
  5227. twitter name and # others <!-- no more than "9" others btw --></div>
  5228.  
  5229. </div>
  5230. <!--end of caption box-->
  5231. </div>
  5232.  
  5233.  
  5234.  
  5235.  
  5236. <div id="popsep"></div>
  5237. <div id="popbox">
  5238.  
  5239. <!--popup box notes-->
  5240. <div id="popnotes">
  5241. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  5242. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  5243. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  5244. </div>
  5245.  
  5246. <div id="popmess">
  5247. <i class="fa fa-envelope-o" aria-hidden="true"></i></div>
  5248.  
  5249. <!--end of popup box notes -->
  5250. </div>
  5251.  
  5252. <!--end of image pop up-->
  5253. </div>
  5254. <!--end of 1st twitter box-->
  5255. </div>
  5256.  
  5257.  
  5258.  
  5259.  
  5260.  
  5261. <!--2nd twitter box for more tweets-->
  5262. <div id="twitter2">
  5263. <div id="twbg">
  5264.  
  5265. <!--1st tweet-->
  5266.  
  5267. <div id="twi">
  5268. <div id="twinfo">
  5269. <div id="twname">name</div>
  5270. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 10h</div>
  5271. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  5272.  
  5273.  
  5274. <div id="twpic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  5275.  
  5276. <div id="tweet">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  5277.  
  5278.  
  5279. <div id="twnotes">
  5280. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  5281. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  5282. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  5283. </div>
  5284.  
  5285. <div id="twact">
  5286. <i class="fa fa-signal" aria-hidden="true"></i>
  5287. </div>
  5288.  
  5289.  
  5290. <div id="twsep"></div>
  5291.  
  5292.  
  5293.  
  5294. <!--2nd tweet -->
  5295.  
  5296. <div id="twinfo" style="margin-top:112px;">
  5297. <div id="twname">name</div>
  5298. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  5299. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  5300.  
  5301.  
  5302. <div id="twpic" style="margin-top:112px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  5303.  
  5304. <div id="tweet" style="margin-top:133px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  5305.  
  5306.  
  5307. <div id="twnotes" style="margin-top:193px;">
  5308. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  5309. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  5310. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  5311. </div>
  5312.  
  5313. <div id="twact" style="margin-top:193px;">
  5314. <i class="fa fa-signal" aria-hidden="true"></i>
  5315. </div>
  5316.  
  5317.  
  5318. <div id="twsep" style="margin-top:210px;"></div>
  5319.  
  5320.  
  5321. <!--3rd tweet-->
  5322. <div id="twinfo" style="margin-top:218px;">
  5323. <div id="twname">name</div>
  5324. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  5325. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  5326.  
  5327.  
  5328. <div id="twpic" style="margin-top:218px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  5329.  
  5330. <div id="tweet" style="margin-top:237px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  5331.  
  5332.  
  5333. <div id="twnotes" style="margin-top:296px;">
  5334. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  5335. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  5336. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  5337. </div>
  5338.  
  5339. <div id="twact" style="margin-top:296px;">
  5340. <i class="fa fa-signal" aria-hidden="true"></i>
  5341. </div>
  5342.  
  5343. <div id="twsep" style="margin-top:313px;"></div>
  5344. <!--end of tweets-->
  5345. </div>
  5346. <!--end of 2nd twitter box-->
  5347. </div>
  5348. <!--end of twitter-->
  5349.  
  5350.  
  5351.  
  5352. <!--instagram-->
  5353. <div id='ig'>
  5354. <div id="igic"> <img src="https://78.media.tumblr.com/c0cc8dd37837fcd6d572236fdf089b21/tumblr_inline_ozi3q6yoLu1rvzd3s_540.png"/> </div>
  5355.  
  5356. <div id="iguser">
  5357. username <i class="fa fa-check-circle" aria-hidden="true" style="color:#519bd6;"></i>
  5358. </div>
  5359.  
  5360. <div id="igstats">
  5361. <b>###</b> posts <b>###m</b> followers <b>###</b> following
  5362. </div>
  5363.  
  5364. <div id="igdesc">
  5365. <b>name.</b> instagram bio goes here. don't make it longer than three lines <br>
  5366. <a href="/museurl" title="muse's url">site.com</a>
  5367. </div>
  5368.  
  5369.  
  5370. <div id="igposts">
  5371.  
  5372. <div id="igim"> <img src="https://78.media.tumblr.com/f11d0cc9ba78fdb7d98fc0aa386a0c9c/tumblr_inline_ozi3qprISd1rvzd3s_540.png"/> </div>
  5373.  
  5374.  
  5375. <div id="igim" style="margin-left:120px;"> <img src="https://78.media.tumblr.com/ff2836c8a6b56b18db7422832bbb757d/tumblr_inline_ozi3qqVFdP1rvzd3s_540.png"/> </div>
  5376.  
  5377.  
  5378. <div id="igim" style="margin-left:200px;"> <img src="https://78.media.tumblr.com/cce56591ef05ece7304268166297a5a5/tumblr_inline_ozi3qqgzfk1rvzd3s_540.png"/> </div>
  5379.  
  5380.  
  5381. <!--second row-->
  5382.  
  5383.  
  5384. <div id="igim" style="margin-top:85px;"> <img src="https://78.media.tumblr.com/af803c5d7fa334fed5c3b2daa4d65245/tumblr_inline_ozi3r0mSw41rvzd3s_540.png"/> </div>
  5385.  
  5386.  
  5387. <div id="igim" style="margin-top:85px; margin-left:120px;"> <img src="https://78.media.tumblr.com/e5bfc3c14783b6342df0499f671745d3/tumblr_inline_ozi3r06KXe1rvzd3s_540.png"/> </div>
  5388.  
  5389.  
  5390. <div id="igim" style="margin-top:85px; margin-left:200px;"> <img src="https://78.media.tumblr.com/5e311035b1f11f4ac75f0fdf35ea8f18/tumblr_inline_ozi3r13gHP1rvzd3s_540.png"/> </div>
  5391.  
  5392.  
  5393. </div>
  5394. <!--end of instagram-->
  5395. </div>
  5396.  
  5397. <!--end of tenth muse box-->
  5398. </div>
  5399. </div>
  5400.  
  5401.  
  5402.  
  5403.  
  5404. <!-- eleventh muse box-->
  5405.  
  5406. <div id="TabzEleven" class="tabzcon alytut" style="display:none">
  5407. <span onclick="this.parentElement.style.display='none'" class="tabzclose">
  5408. <a title="close">EXIT</a>
  5409. </span>
  5410.  
  5411.  
  5412. <div id="fcim"> <img src="https://78.media.tumblr.com/d1511adc3c9335751d3e1886a22184fd/tumblr_inline_ozi3mdge7x1rvzd3s_540.png"/> </div>
  5413. <div id="label">muse name - The label</div>
  5414. <div id="fcbox">
  5415. <div id="fcinfo"> you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls.
  5416. </div>
  5417. </div>
  5418.  
  5419. <!--iMessage box-->
  5420. <div id="ibox">name</div>
  5421. <div id="ibox2">
  5422. <ul class="convo" style="color:#fff;">
  5423. <li class="line_odd user_1">text one goes here. </li>
  5424. <li class="line_even user_2">or you can swap the lines so that the blue imessage is at the top.</li>
  5425. <li class="line_even user_2">you can put whatever you want here, in whatever order.</li>
  5426. <li class="line_odd user_1">this box scrolls by the way, so you can add more messages if you like.</li>
  5427. </ul>
  5428. </div>
  5429. <!--end of iMessage box-->
  5430.  
  5431.  
  5432.  
  5433. <!-- snapchat box and info-->
  5434. <div class="snap">
  5435.  
  5436. <div class="snapuser">snapuser</div>
  5437. <div class="snaptime">18h ago</div>
  5438. <div class="snapcap" style="margin-top:230px;">caption</div>
  5439. <div style="margin-top:0px;"><img src="https://78.media.tumblr.com/3504c178a1ffb7fbed77d98e805ef4f4/tumblr_inline_ozi3o62fbP1rvzd3s_540.png"></div>
  5440.  
  5441. <!-- copy from here -->
  5442. <div class="snap2">
  5443. <div class="snaptime" style="margin-top:-261px;">15h ago</div>
  5444. <!--<div class="snapcap" style="margin-top:-60px;">you can hide the caption box if you don't want to use it</div>-->
  5445. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/f694b50f53904660e3803e2f60da4789/tumblr_inline_ozi3p0MJJF1rvzd3s_540.png"></div></div>
  5446. <!--- to here. change 'snap2' to the next snap number -->
  5447.  
  5448. <!-- copy from here -->
  5449. <div class="snap3">
  5450. <div class="snaptime" style="margin-top:-261px;">8h ago</div>
  5451. <div class="snapcap" style="margin-top:-90px;">caption</div>
  5452. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/8a8b12ea1ff366c9741be95c724f181f/tumblr_inline_ozi3p0UpYY1rvzd3s_540.png"></div></div>
  5453. <!--- to here. change 'snap3' to the next snap number -->
  5454.  
  5455.  
  5456. <!-- copy from here -->
  5457. <div class="snap4">
  5458. <div class="snaptime" style="margin-top:-261px;">3h ago</div>
  5459. <div class="snapcap" style="margin-top:-90px;">caption</div>
  5460. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/b67af846b1ca76aef1f4301638864d8b/tumblr_inline_ozi3p9e4QI1rvzd3s_540.png"></div></div>
  5461. <!--- to here. change 'snap4' to the next snap number -->
  5462.  
  5463.  
  5464. <div class="snap5">
  5465. <div class="snaptime" style="margin-top:-261px;">3m ago</div>
  5466. <div class="snapcap" style="margin-top:-90px;">caption</div>
  5467. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/9af9cd6d13767f20dcbcab68d3bae2b1/tumblr_inline_ozi3prkUfg1rvzd3s_540.png"></div></div>
  5468.  
  5469.  
  5470. <div class="snap6">
  5471. <div class="snaptime" style="margin-top:-261px;">1m ago</div>
  5472. <div class="snapcap" style="margin-top:-90px;">caption</div>
  5473. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/dc3a3e4eead7f8abe1946055ae37b4e4/tumblr_inline_ozi3pyIgpm1rvzd3s_540.png"></div></div>
  5474. </div>
  5475. <!--end of snapchat box-->
  5476.  
  5477.  
  5478. <!--connections box-->
  5479. <div id="conbox">
  5480. <div id="conbox2">
  5481. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  5482. </div>
  5483.  
  5484.  
  5485.  
  5486. <div id="conicon"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/c70729ce8901968c74cd2fdd4064ee9d/tumblr_inline_ozi3mkORqC1rvzd3s_540.png"/></div></a>
  5487.  
  5488. <!-- 2nd connection-->
  5489. <div id="conbox3">
  5490. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  5491. </div>
  5492.  
  5493. <div id="conicon2"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/b1038815ee0e3c1ddac97cc10f59d2e2/tumblr_inline_ozi3mjpJJL1rvzd3s_540.png"/></div></a>
  5494.  
  5495.  
  5496. <!--3rd connection-->
  5497. <!--you can add more connections if you want, just copy from here -->
  5498.  
  5499. <div id="conbox2" style="margin-top:170px;">
  5500. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  5501. </div>
  5502.  
  5503. <div id="conicon" style="margin-top:170px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/2bd8435ce1cd93d7e22796ecb1bc44ab/tumblr_inline_ozi3mjWgKO1rvzd3s_540.png"/></div></a>
  5504.  
  5505. <!--4th connection-->
  5506.  
  5507. <div id="conbox3" style="margin-top:250px;">
  5508. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  5509. </div>
  5510.  
  5511. <div id="conicon2" style="margin-top:250px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/690039f56be111f5e89c514ada430396/tumblr_inline_ozi3mvqtZi1rvzd3s_540.png"/></div></a>
  5512.  
  5513. <!--to here, and change the 'margin-top'.-->
  5514.  
  5515.  
  5516.  
  5517. <!--5th connection-->
  5518. <!--you can add more connections if you want, just copy from here -->
  5519.  
  5520. <div id="conbox2" style="margin-top:330px;">
  5521. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  5522. </div>
  5523.  
  5524. <div id="conicon" style="margin-top:330px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/f3140f3c299f4c3bdb0b3c74f010a673/tumblr_inline_ozi3muIEFJ1rvzd3s_540.png"/></div></a>
  5525.  
  5526.  
  5527. <!--6th connection-->
  5528.  
  5529. <div id="conbox3" style="margin-top:410px;">
  5530. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  5531. </div>
  5532.  
  5533. <div id="conicon2" style="margin-top:410px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/dc8179b36a5759923b93cdcd5b776d0f/tumblr_inline_ozi3muQ3XN1rvzd3s_540.png"/></div></a>
  5534.  
  5535. <!--to here, and change the 'margin-top'.-->
  5536.  
  5537.  
  5538.  
  5539. </div>
  5540. <!-- end of connections box-->
  5541.  
  5542.  
  5543.  
  5544. <!--twitter-->
  5545. <!-- if you steal this part of my code, i WILL come after you-->
  5546. <div id="twitter">
  5547. <div id="twithead"><img src="https://78.media.tumblr.com/23ad5e786f5e71e993ae10ecc9dc3259/tumblr_inline_ozi3nx8QlX1rvzd3s_540.png"/></div>
  5548.  
  5549. <div id="twitbg">
  5550. <div id="twitname">name</div>
  5551. <div id="twituser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i></div>
  5552. <div id="twitdesc">Keep this description short. It shouldn't be longer than to lines.</div>
  5553. <div id="twitf"><b>50</b> Following <div style="margin-top:-14px; margin-left:100px;"><b>7.5m</b> Followers</div></div>
  5554. <div id="twitpro">Edit profile</div>
  5555. </div>
  5556.  
  5557. <div id="twitic"><img src="https://78.media.tumblr.com/d685c605911ce3829cded2f824a54385/tumblr_inline_ozi3nbxfj31rvzd3s_540.png"/></div>
  5558.  
  5559.  
  5560. <div id="twitborder"></div>
  5561. <div id="twitinfo">
  5562. <div style="margin-left:3px;"><b>Tweets</b></div>
  5563. <div style="margin-left:56px; margin-top:-16px;">Tweets & replies</div>
  5564. <div style="margin-left:168px; margin-top:-16px;">Media</div>
  5565. <div style="margin-left:218px; margin-top:-16px;">Likes</div>
  5566.  
  5567. </div>
  5568.  
  5569. <!--tweets and such go here-->
  5570.  
  5571. <div id="pinned">
  5572. <div id="pinfo">
  5573. <i class="fa fa-thumb-tack" aria-hidden="true"></i> Pinned Tweet
  5574. <div id="pname">name</div>
  5575. <div id="puser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h</div>
  5576. <div style="margin-top:3px; margin-left:193px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div>
  5577. </div>
  5578.  
  5579. <div id="pic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  5580.  
  5581. <div id="ptweet">photo caption.</div>
  5582.  
  5583.  
  5584. <div id="pim"> <a href="#?w=240" rel="box11" class="poplight" title="click me!"><img src="https://78.media.tumblr.com/557e5b97efa45710830293c69c743f30/tumblr_inline_ozi3naqqwC1rvzd3s_540.png"/></a></div>
  5585.  
  5586.  
  5587. <div id="ptagged">
  5588. twitter name and # others <!-- no more than "9" others btw -->
  5589. </div>
  5590.  
  5591. <div id="pnotes">
  5592. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  5593. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  5594. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  5595. </div>
  5596.  
  5597. <div id="pact">
  5598. <i class="fa fa-signal" aria-hidden="true"></i>
  5599. </div>
  5600. <!--end of pinned tweet-->
  5601. </div>
  5602.  
  5603.  
  5604. <!--pinned image pop up-->
  5605. <div id="box11" class="popup_block" style="height:395px;">
  5606.  
  5607. <div id="pinpop"><img src="https://78.media.tumblr.com/84674ef6fac489e6173246af5a5ff330/tumblr_inline_ozr3y46d151rvzd3s_540.png"/></div>
  5608.  
  5609. <div id="pinpopz">
  5610.  
  5611. <!--popup image caption box. hover over the image to view caption-->
  5612. <div id="ppopinf">
  5613. <div id="popname">name</div>
  5614. <div id="popuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h <div style="margin-top:-13px; margin-left:190px;"><span class="lnr lnr-chevron-down"></span></div> </div>
  5615.  
  5616.  
  5617. <div id="poptweet">keep this caption about two to three lines short. this box doesn't scroll. keep this caption about two to three lines short.</div>
  5618.  
  5619. <div id="poptagged">
  5620. twitter name and # others <!-- no more than "9" others btw --></div>
  5621.  
  5622. </div>
  5623. <!--end of caption box-->
  5624. </div>
  5625.  
  5626.  
  5627.  
  5628.  
  5629. <div id="popsep"></div>
  5630. <div id="popbox">
  5631.  
  5632. <!--popup box notes-->
  5633. <div id="popnotes">
  5634. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  5635. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  5636. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  5637. </div>
  5638.  
  5639. <div id="popmess">
  5640. <i class="fa fa-envelope-o" aria-hidden="true"></i></div>
  5641.  
  5642. <!--end of popup box notes -->
  5643. </div>
  5644.  
  5645. <!--end of image pop up-->
  5646. </div>
  5647. <!--end of 1st twitter box-->
  5648. </div>
  5649.  
  5650.  
  5651.  
  5652.  
  5653.  
  5654. <!--2nd twitter box for more tweets-->
  5655. <div id="twitter2">
  5656. <div id="twbg">
  5657.  
  5658. <!--1st tweet-->
  5659.  
  5660. <div id="twi">
  5661. <div id="twinfo">
  5662. <div id="twname">name</div>
  5663. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 10h</div>
  5664. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  5665.  
  5666.  
  5667. <div id="twpic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  5668.  
  5669. <div id="tweet">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  5670.  
  5671.  
  5672. <div id="twnotes">
  5673. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  5674. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  5675. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  5676. </div>
  5677.  
  5678. <div id="twact">
  5679. <i class="fa fa-signal" aria-hidden="true"></i>
  5680. </div>
  5681.  
  5682.  
  5683. <div id="twsep"></div>
  5684.  
  5685.  
  5686.  
  5687. <!--2nd tweet -->
  5688.  
  5689. <div id="twinfo" style="margin-top:112px;">
  5690. <div id="twname">name</div>
  5691. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  5692. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  5693.  
  5694.  
  5695. <div id="twpic" style="margin-top:112px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  5696.  
  5697. <div id="tweet" style="margin-top:133px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  5698.  
  5699.  
  5700. <div id="twnotes" style="margin-top:193px;">
  5701. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  5702. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  5703. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  5704. </div>
  5705.  
  5706. <div id="twact" style="margin-top:193px;">
  5707. <i class="fa fa-signal" aria-hidden="true"></i>
  5708. </div>
  5709.  
  5710.  
  5711. <div id="twsep" style="margin-top:210px;"></div>
  5712.  
  5713.  
  5714. <!--3rd tweet-->
  5715. <div id="twinfo" style="margin-top:218px;">
  5716. <div id="twname">name</div>
  5717. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  5718. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  5719.  
  5720.  
  5721. <div id="twpic" style="margin-top:218px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  5722.  
  5723. <div id="tweet" style="margin-top:237px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  5724.  
  5725.  
  5726. <div id="twnotes" style="margin-top:296px;">
  5727. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  5728. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  5729. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  5730. </div>
  5731.  
  5732. <div id="twact" style="margin-top:296px;">
  5733. <i class="fa fa-signal" aria-hidden="true"></i>
  5734. </div>
  5735.  
  5736. <div id="twsep" style="margin-top:313px;"></div>
  5737. <!--end of tweets-->
  5738. </div>
  5739. <!--end of 2nd twitter box-->
  5740. </div>
  5741. <!--end of twitter-->
  5742.  
  5743.  
  5744.  
  5745. <!--instagram-->
  5746. <div id='ig'>
  5747. <div id="igic"> <img src="https://78.media.tumblr.com/c0cc8dd37837fcd6d572236fdf089b21/tumblr_inline_ozi3q6yoLu1rvzd3s_540.png"/> </div>
  5748.  
  5749. <div id="iguser">
  5750. username <i class="fa fa-check-circle" aria-hidden="true" style="color:#519bd6;"></i>
  5751. </div>
  5752.  
  5753. <div id="igstats">
  5754. <b>###</b> posts <b>###m</b> followers <b>###</b> following
  5755. </div>
  5756.  
  5757. <div id="igdesc">
  5758. <b>name.</b> instagram bio goes here. don't make it longer than three lines <br>
  5759. <a href="/museurl" title="muse's url">site.com</a>
  5760. </div>
  5761.  
  5762.  
  5763. <div id="igposts">
  5764.  
  5765. <div id="igim"> <img src="https://78.media.tumblr.com/f11d0cc9ba78fdb7d98fc0aa386a0c9c/tumblr_inline_ozi3qprISd1rvzd3s_540.png"/> </div>
  5766.  
  5767.  
  5768. <div id="igim" style="margin-left:120px;"> <img src="https://78.media.tumblr.com/ff2836c8a6b56b18db7422832bbb757d/tumblr_inline_ozi3qqVFdP1rvzd3s_540.png"/> </div>
  5769.  
  5770.  
  5771. <div id="igim" style="margin-left:200px;"> <img src="https://78.media.tumblr.com/cce56591ef05ece7304268166297a5a5/tumblr_inline_ozi3qqgzfk1rvzd3s_540.png"/> </div>
  5772.  
  5773.  
  5774. <!--second row-->
  5775.  
  5776.  
  5777. <div id="igim" style="margin-top:85px;"> <img src="https://78.media.tumblr.com/af803c5d7fa334fed5c3b2daa4d65245/tumblr_inline_ozi3r0mSw41rvzd3s_540.png"/> </div>
  5778.  
  5779.  
  5780. <div id="igim" style="margin-top:85px; margin-left:120px;"> <img src="https://78.media.tumblr.com/e5bfc3c14783b6342df0499f671745d3/tumblr_inline_ozi3r06KXe1rvzd3s_540.png"/> </div>
  5781.  
  5782.  
  5783. <div id="igim" style="margin-top:85px; margin-left:200px;"> <img src="https://78.media.tumblr.com/5e311035b1f11f4ac75f0fdf35ea8f18/tumblr_inline_ozi3r13gHP1rvzd3s_540.png"/> </div>
  5784.  
  5785.  
  5786. </div>
  5787. <!--end of instagram-->
  5788. </div>
  5789.  
  5790. <!--end of eleventh muse box-->
  5791. </div>
  5792. </div>
  5793.  
  5794.  
  5795.  
  5796.  
  5797. <!-- twelfth muse box-->
  5798.  
  5799. <div id="TabzTwelve" class="tabzcon alytut" style="display:none">
  5800. <span onclick="this.parentElement.style.display='none'" class="tabzclose">
  5801. <a title="close">EXIT</a>
  5802. </span>
  5803.  
  5804.  
  5805. <div id="fcim"> <img src="https://78.media.tumblr.com/d1511adc3c9335751d3e1886a22184fd/tumblr_inline_ozi3mdge7x1rvzd3s_540.png"/> </div>
  5806. <div id="label">muse name - The label</div>
  5807. <div id="fcbox">
  5808. <div id="fcinfo"> you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls. you can place more information on the muse as you want. like, how they fix into the group, more background on them, etc. you can put as much info here as you want because this box scrolls.
  5809. </div>
  5810. </div>
  5811.  
  5812. <!--iMessage box-->
  5813. <div id="ibox">name</div>
  5814. <div id="ibox2">
  5815. <ul class="convo" style="color:#fff;">
  5816. <li class="line_odd user_1">text one goes here. </li>
  5817. <li class="line_even user_2">or you can swap the lines so that the blue imessage is at the top.</li>
  5818. <li class="line_even user_2">you can put whatever you want here, in whatever order.</li>
  5819. <li class="line_odd user_1">this box scrolls by the way, so you can add more messages if you like.</li>
  5820. </ul>
  5821. </div>
  5822. <!--end of iMessage box-->
  5823.  
  5824.  
  5825.  
  5826. <!-- snapchat box and info-->
  5827. <div class="snap">
  5828.  
  5829. <div class="snapuser">snapuser</div>
  5830. <div class="snaptime">18h ago</div>
  5831. <div class="snapcap" style="margin-top:230px;">caption</div>
  5832. <div style="margin-top:0px;"><img src="https://78.media.tumblr.com/3504c178a1ffb7fbed77d98e805ef4f4/tumblr_inline_ozi3o62fbP1rvzd3s_540.png"></div>
  5833.  
  5834. <!-- copy from here -->
  5835. <div class="snap2">
  5836. <div class="snaptime" style="margin-top:-261px;">15h ago</div>
  5837. <!--<div class="snapcap" style="margin-top:-60px;">you can hide the caption box if you don't want to use it</div>-->
  5838. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/f694b50f53904660e3803e2f60da4789/tumblr_inline_ozi3p0MJJF1rvzd3s_540.png"></div></div>
  5839. <!--- to here. change 'snap2' to the next snap number -->
  5840.  
  5841. <!-- copy from here -->
  5842. <div class="snap3">
  5843. <div class="snaptime" style="margin-top:-261px;">8h ago</div>
  5844. <div class="snapcap" style="margin-top:-90px;">caption</div>
  5845. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/8a8b12ea1ff366c9741be95c724f181f/tumblr_inline_ozi3p0UpYY1rvzd3s_540.png"></div></div>
  5846. <!--- to here. change 'snap3' to the next snap number -->
  5847.  
  5848.  
  5849. <!-- copy from here -->
  5850. <div class="snap4">
  5851. <div class="snaptime" style="margin-top:-261px;">3h ago</div>
  5852. <div class="snapcap" style="margin-top:-90px;">caption</div>
  5853. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/b67af846b1ca76aef1f4301638864d8b/tumblr_inline_ozi3p9e4QI1rvzd3s_540.png"></div></div>
  5854. <!--- to here. change 'snap4' to the next snap number -->
  5855.  
  5856.  
  5857. <div class="snap5">
  5858. <div class="snaptime" style="margin-top:-261px;">3m ago</div>
  5859. <div class="snapcap" style="margin-top:-90px;">caption</div>
  5860. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/9af9cd6d13767f20dcbcab68d3bae2b1/tumblr_inline_ozi3prkUfg1rvzd3s_540.png"></div></div>
  5861.  
  5862.  
  5863. <div class="snap6">
  5864. <div class="snaptime" style="margin-top:-261px;">1m ago</div>
  5865. <div class="snapcap" style="margin-top:-90px;">caption</div>
  5866. <div style="margin-top:-283px; margin-left:0px;"><img src="https://78.media.tumblr.com/dc3a3e4eead7f8abe1946055ae37b4e4/tumblr_inline_ozi3pyIgpm1rvzd3s_540.png"></div></div>
  5867. </div>
  5868. <!--end of snapchat box-->
  5869.  
  5870.  
  5871. <!--connections box-->
  5872. <div id="conbox">
  5873. <div id="conbox2">
  5874. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  5875. </div>
  5876.  
  5877.  
  5878.  
  5879. <div id="conicon"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/c70729ce8901968c74cd2fdd4064ee9d/tumblr_inline_ozi3mkORqC1rvzd3s_540.png"/></div></a>
  5880.  
  5881. <!-- 2nd connection-->
  5882. <div id="conbox3">
  5883. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  5884. </div>
  5885.  
  5886. <div id="conicon2"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/b1038815ee0e3c1ddac97cc10f59d2e2/tumblr_inline_ozi3mjpJJL1rvzd3s_540.png"/></div></a>
  5887.  
  5888.  
  5889. <!--3rd connection-->
  5890. <!--you can add more connections if you want, just copy from here -->
  5891.  
  5892. <div id="conbox2" style="margin-top:170px;">
  5893. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  5894. </div>
  5895.  
  5896. <div id="conicon" style="margin-top:170px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/2bd8435ce1cd93d7e22796ecb1bc44ab/tumblr_inline_ozi3mjWgKO1rvzd3s_540.png"/></div></a>
  5897.  
  5898. <!--4th connection-->
  5899.  
  5900. <div id="conbox3" style="margin-top:250px;">
  5901. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  5902. </div>
  5903.  
  5904. <div id="conicon2" style="margin-top:250px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/690039f56be111f5e89c514ada430396/tumblr_inline_ozi3mvqtZi1rvzd3s_540.png"/></div></a>
  5905.  
  5906. <!--to here, and change the 'margin-top'.-->
  5907.  
  5908.  
  5909.  
  5910. <!--5th connection-->
  5911. <!--you can add more connections if you want, just copy from here -->
  5912.  
  5913. <div id="conbox2" style="margin-top:330px;">
  5914. <div id="coninfo"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  5915. </div>
  5916.  
  5917. <div id="conicon" style="margin-top:330px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/f3140f3c299f4c3bdb0b3c74f010a673/tumblr_inline_ozi3muIEFJ1rvzd3s_540.png"/></div></a>
  5918.  
  5919.  
  5920. <!--6th connection-->
  5921.  
  5922. <div id="conbox3" style="margin-top:410px;">
  5923. <div id="coninfo2"><b>name: connection</b> connection description here. there's link to add a connection link from your rpg's inspo blog or whatever you see fit to do with the link. there's also a hover title over the icon. this will scroll if you want to add more.</div>
  5924. </div>
  5925.  
  5926. <div id="conicon2" style="margin-top:410px;"><a href="/connectionlink" title="name"><img src ="https://78.media.tumblr.com/dc8179b36a5759923b93cdcd5b776d0f/tumblr_inline_ozi3muQ3XN1rvzd3s_540.png"/></div></a>
  5927.  
  5928. <!--to here, and change the 'margin-top'.-->
  5929.  
  5930.  
  5931.  
  5932. </div>
  5933. <!-- end of connections box-->
  5934.  
  5935.  
  5936.  
  5937. <!--twitter-->
  5938. <!-- if you steal this part of my code, i WILL come after you-->
  5939. <div id="twitter">
  5940. <div id="twithead"><img src="https://78.media.tumblr.com/23ad5e786f5e71e993ae10ecc9dc3259/tumblr_inline_ozi3nx8QlX1rvzd3s_540.png"/></div>
  5941.  
  5942. <div id="twitbg">
  5943. <div id="twitname">name</div>
  5944. <div id="twituser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i></div>
  5945. <div id="twitdesc">Keep this description short. It shouldn't be longer than to lines.</div>
  5946. <div id="twitf"><b>50</b> Following <div style="margin-top:-14px; margin-left:100px;"><b>7.5m</b> Followers</div></div>
  5947. <div id="twitpro">Edit profile</div>
  5948. </div>
  5949.  
  5950. <div id="twitic"><img src="https://78.media.tumblr.com/d685c605911ce3829cded2f824a54385/tumblr_inline_ozi3nbxfj31rvzd3s_540.png"/></div>
  5951.  
  5952.  
  5953. <div id="twitborder"></div>
  5954. <div id="twitinfo">
  5955. <div style="margin-left:3px;"><b>Tweets</b></div>
  5956. <div style="margin-left:56px; margin-top:-16px;">Tweets & replies</div>
  5957. <div style="margin-left:168px; margin-top:-16px;">Media</div>
  5958. <div style="margin-left:218px; margin-top:-16px;">Likes</div>
  5959.  
  5960. </div>
  5961.  
  5962. <!--tweets and such go here-->
  5963.  
  5964. <div id="pinned">
  5965. <div id="pinfo">
  5966. <i class="fa fa-thumb-tack" aria-hidden="true"></i> Pinned Tweet
  5967. <div id="pname">name</div>
  5968. <div id="puser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h</div>
  5969. <div style="margin-top:3px; margin-left:193px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div>
  5970. </div>
  5971.  
  5972. <div id="pic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  5973.  
  5974. <div id="ptweet">photo caption.</div>
  5975.  
  5976.  
  5977. <div id="pim"> <a href="#?w=240" rel="box12" class="poplight" title="click me!"><img src="https://78.media.tumblr.com/557e5b97efa45710830293c69c743f30/tumblr_inline_ozi3naqqwC1rvzd3s_540.png"/></a></div>
  5978.  
  5979.  
  5980. <div id="ptagged">
  5981. twitter name and # others <!-- no more than "9" others btw -->
  5982. </div>
  5983.  
  5984. <div id="pnotes">
  5985. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  5986. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  5987. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:10px;"> ###k</i>
  5988. </div>
  5989.  
  5990. <div id="pact">
  5991. <i class="fa fa-signal" aria-hidden="true"></i>
  5992. </div>
  5993. <!--end of pinned tweet-->
  5994. </div>
  5995.  
  5996.  
  5997. <!--pinned image pop up-->
  5998. <div id="box12" class="popup_block" style="height:395px;">
  5999.  
  6000. <div id="pinpop"><img src="https://78.media.tumblr.com/84674ef6fac489e6173246af5a5ff330/tumblr_inline_ozr3y46d151rvzd3s_540.png"/></div>
  6001.  
  6002. <div id="pinpopz">
  6003.  
  6004. <!--popup image caption box. hover over the image to view caption-->
  6005. <div id="ppopinf">
  6006. <div id="popname">name</div>
  6007. <div id="popuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 19h <div style="margin-top:-13px; margin-left:190px;"><span class="lnr lnr-chevron-down"></span></div> </div>
  6008.  
  6009.  
  6010. <div id="poptweet">keep this caption about two to three lines short. this box doesn't scroll. keep this caption about two to three lines short.</div>
  6011.  
  6012. <div id="poptagged">
  6013. twitter name and # others <!-- no more than "9" others btw --></div>
  6014.  
  6015. </div>
  6016. <!--end of caption box-->
  6017. </div>
  6018.  
  6019.  
  6020.  
  6021.  
  6022. <div id="popsep"></div>
  6023. <div id="popbox">
  6024.  
  6025. <!--popup box notes-->
  6026. <div id="popnotes">
  6027. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  6028. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  6029. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:25px;"> ###k</i>
  6030. </div>
  6031.  
  6032. <div id="popmess">
  6033. <i class="fa fa-envelope-o" aria-hidden="true"></i></div>
  6034.  
  6035. <!--end of popup box notes -->
  6036. </div>
  6037.  
  6038. <!--end of image pop up-->
  6039. </div>
  6040. <!--end of 1st twitter box-->
  6041. </div>
  6042.  
  6043.  
  6044.  
  6045.  
  6046.  
  6047. <!--2nd twitter box for more tweets-->
  6048. <div id="twitter2">
  6049. <div id="twbg">
  6050.  
  6051. <!--1st tweet-->
  6052.  
  6053. <div id="twi">
  6054. <div id="twinfo">
  6055. <div id="twname">name</div>
  6056. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 10h</div>
  6057. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  6058.  
  6059.  
  6060. <div id="twpic"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  6061.  
  6062. <div id="tweet">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  6063.  
  6064.  
  6065. <div id="twnotes">
  6066. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  6067. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  6068. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  6069. </div>
  6070.  
  6071. <div id="twact">
  6072. <i class="fa fa-signal" aria-hidden="true"></i>
  6073. </div>
  6074.  
  6075.  
  6076. <div id="twsep"></div>
  6077.  
  6078.  
  6079.  
  6080. <!--2nd tweet -->
  6081.  
  6082. <div id="twinfo" style="margin-top:112px;">
  6083. <div id="twname">name</div>
  6084. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  6085. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  6086.  
  6087.  
  6088. <div id="twpic" style="margin-top:112px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  6089.  
  6090. <div id="tweet" style="margin-top:133px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  6091.  
  6092.  
  6093. <div id="twnotes" style="margin-top:193px;">
  6094. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  6095. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  6096. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  6097. </div>
  6098.  
  6099. <div id="twact" style="margin-top:193px;">
  6100. <i class="fa fa-signal" aria-hidden="true"></i>
  6101. </div>
  6102.  
  6103.  
  6104. <div id="twsep" style="margin-top:210px;"></div>
  6105.  
  6106.  
  6107. <!--3rd tweet-->
  6108. <div id="twinfo" style="margin-top:218px;">
  6109. <div id="twname">name</div>
  6110. <div id="twuser">@user <i class="fa fa-check-circle" style="color:#ffffff;" aria-hidden="true"></i> • 1d</div>
  6111. <div style="margin-top:3px; margin-left:230px; font-size:10px;"><span class="lnr lnr-chevron-down"></span></div></div>
  6112.  
  6113.  
  6114. <div id="twpic" style="margin-top:218px;"> <img src="https://78.media.tumblr.com/e429f0bf7c0577e38fa218b94bbe4947/tumblr_inline_ozi3nbuqFl1rvzd3s_540.png"/> </div>
  6115.  
  6116. <div id="tweet" style="margin-top:237px;">keep this about two to three lines short, no more than four. the tweet box should scroll so you can place more tweets.</div>
  6117.  
  6118.  
  6119. <div id="twnotes" style="margin-top:296px;">
  6120. <i class="fa fa-comment-o" aria-hidden="true"> ###</i>
  6121. <i class="fa fa-retweet" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  6122. <i class="fa fa-heart-o" aria-hidden="true" style="margin-left:20px;"> ###k</i>
  6123. </div>
  6124.  
  6125. <div id="twact" style="margin-top:296px;">
  6126. <i class="fa fa-signal" aria-hidden="true"></i>
  6127. </div>
  6128.  
  6129. <div id="twsep" style="margin-top:313px;"></div>
  6130. <!--end of tweets-->
  6131. </div>
  6132. <!--end of 2nd twitter box-->
  6133. </div>
  6134. <!--end of twitter-->
  6135.  
  6136.  
  6137.  
  6138. <!--instagram-->
  6139. <div id='ig'>
  6140. <div id="igic"> <img src="https://78.media.tumblr.com/c0cc8dd37837fcd6d572236fdf089b21/tumblr_inline_ozi3q6yoLu1rvzd3s_540.png"/> </div>
  6141.  
  6142. <div id="iguser">
  6143. username <i class="fa fa-check-circle" aria-hidden="true" style="color:#519bd6;"></i>
  6144. </div>
  6145.  
  6146. <div id="igstats">
  6147. <b>###</b> posts <b>###m</b> followers <b>###</b> following
  6148. </div>
  6149.  
  6150. <div id="igdesc">
  6151. <b>name.</b> instagram bio goes here. don't make it longer than three lines <br>
  6152. <a href="/museurl" title="muse's url">site.com</a>
  6153. </div>
  6154.  
  6155.  
  6156. <div id="igposts">
  6157.  
  6158. <div id="igim"> <img src="https://78.media.tumblr.com/f11d0cc9ba78fdb7d98fc0aa386a0c9c/tumblr_inline_ozi3qprISd1rvzd3s_540.png"/> </div>
  6159.  
  6160.  
  6161. <div id="igim" style="margin-left:120px;"> <img src="https://78.media.tumblr.com/ff2836c8a6b56b18db7422832bbb757d/tumblr_inline_ozi3qqVFdP1rvzd3s_540.png"/> </div>
  6162.  
  6163.  
  6164. <div id="igim" style="margin-left:200px;"> <img src="https://78.media.tumblr.com/cce56591ef05ece7304268166297a5a5/tumblr_inline_ozi3qqgzfk1rvzd3s_540.png"/> </div>
  6165.  
  6166.  
  6167. <!--second row-->
  6168.  
  6169.  
  6170. <div id="igim" style="margin-top:85px;"> <img src="https://78.media.tumblr.com/af803c5d7fa334fed5c3b2daa4d65245/tumblr_inline_ozi3r0mSw41rvzd3s_540.png"/> </div>
  6171.  
  6172.  
  6173. <div id="igim" style="margin-top:85px; margin-left:120px;"> <img src="https://78.media.tumblr.com/e5bfc3c14783b6342df0499f671745d3/tumblr_inline_ozi3r06KXe1rvzd3s_540.png"/> </div>
  6174.  
  6175.  
  6176. <div id="igim" style="margin-top:85px; margin-left:200px;"> <img src="https://78.media.tumblr.com/5e311035b1f11f4ac75f0fdf35ea8f18/tumblr_inline_ozi3r13gHP1rvzd3s_540.png"/> </div>
  6177.  
  6178.  
  6179. </div>
  6180. <!--end of instagram-->
  6181. </div>
  6182.  
  6183. <!--end of twelfth muse box-->
  6184. </div>
  6185. </div>
  6186.  
  6187.  
  6188.  
  6189.  
  6190.  
  6191. <!--Don't remove my credit, thanks!-->
  6192. <div id="credit">
  6193.  
  6194. <a href="https://cosmichelps.tumblr.com/"title="cosmichelps"><i class="fa fa-scissors" style="font-size:21px; margin-left:0px; margin-top:10px;"></i></a></div>
  6195. </div>
  6196.  
  6197.  
  6198.  
  6199. </body>
  6200. </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!