API tools faq
paste
codesbyally

dreams. ♡

codesbyally
Jan 11th, 2019 (edited)
2,320
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 60.23 KB | None | 0 0
raw download clone embed print report
  1. <!---
  2.  
  3.  
  4.  
  5.  
  6. DREAMS by ALLY
  7.  
  8. — don't steal anything from this code
  9. — don't remove the credit, it's very small, it won't hurt your aesthetic
  10. — don't redistribute or claim this theme as your own
  11.  
  12.  
  13.  
  14.  
  15. --->
  16.  
  17.  
  18.  
  19. <html><head>
  20.  
  21.  
  22.  
  23. <!------ meta tags & scripts ------>
  24.  
  25.  
  26.  
  27. <meta name="image:background" content=""/>
  28. <meta name="image:sidebar" content=""/>
  29.  
  30. <meta name="image:muse1" content=""/>
  31. <meta name="image:muse2" content=""/>
  32. <meta name="image:muse3" content=""/>
  33. <meta name="image:muse4" content=""/>
  34. <meta name="image:muse5" content=""/>
  35. <meta name="image:muse6" content=""/>
  36. <meta name="image:muse7" content=""/>
  37. <meta name="image:muse8" content=""/>
  38. <meta name="image:muse9" content=""/>
  39. <meta name="image:muse10" content=""/>
  40. <meta name="image:muse11" content=""/>
  41. <meta name="image:muse12" content=""/>
  42.  
  43. <meta name="color:background" content="#f3f3f3"/>
  44. <meta name="color:entries" content="#eaeaea"/>
  45. <meta name="color:sidebar" content="#f8f8f8"/>
  46. <meta name="color:accent" content="#fff"/>
  47. <meta name="color:accent2" content="#efefef"/>
  48. <meta name="color:sidelinkbg" content="#666"/>
  49. <meta name="color:postbg" content="#f3f3f3"/>
  50. <meta name="color:title" content="#525252"/>
  51. <meta name="color:desc" content="#898989"/>
  52. <meta name="color:descbg" content="#eaeaea"/>
  53. <meta name="color:bold" content="#d4caa2"/>
  54. <meta name="color:italic" content="#d4a587"/>
  55. <meta name="color:text" content="#525252"/>
  56. <meta name="color:links" content="#525252"/>
  57. <meta name="color:hover" content="#f3f3f3"/>
  58.  
  59. <meta name="text:title" content="sunday morning"/>
  60. <meta name="text:title2" content="easy"/>
  61.  
  62. <meta name="text:tablink1" content="/"/>
  63. <meta name="text:tablink2" content="/"/>
  64. <meta name="text:tablink3" content="/"/>
  65. <meta name="text:fullnav" content="/n"/>
  66.  
  67. <meta name="text:muse1" content="first last"/>
  68. <meta name="text:muse2" content="first last"/>
  69. <meta name="text:muse3" content="first last"/>
  70. <meta name="text:muse4" content="first last"/>
  71. <meta name="text:muse5" content="first last"/>
  72. <meta name="text:muse6" content="first last"/>
  73. <meta name="text:muse7" content="first last"/>
  74. <meta name="text:muse8" content="first last"/>
  75. <meta name="text:muse9" content="first last"/>
  76. <meta name="text:muse10" content="first last"/>
  77. <meta name="text:muse11" content="first last"/>
  78. <meta name="text:muse12" content="first last"/>
  79.  
  80.  
  81.  
  82. <link rel="shortcut icon" href="{Favicon}" />
  83. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  84. <title>{Title}</title>
  85. {block:Description}<meta name="description" content="{MetaDescription}" /> {/block:Description}
  86.  
  87.  
  88. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  89. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  90.  
  91. <script>
  92. (function($){
  93. $(document).ready(function() {
  94. $("a[title]").style_my_tooltips({
  95. tip_follows_cursor:false,
  96. tip_delay_time:90,
  97. tip_fade_speed:600,
  98. attribute:"title"
  99. });
  100. });
  101. })(jQuery);
  102. </script>
  103.  
  104.  
  105. <script>
  106. $(document).ready(function() {
  107. //
  108. $('a.poplight[href^=#]').click(function() {
  109. var popID = $(this).attr('rel'); //Get Popup Name
  110. var popURL = $(this).attr('href'); //Get Popup href to define size
  111. var query= popURL.split('?');
  112. var dim= query[1].split('&');
  113. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  114. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend();
  115. $('body').append('<div id="fade"></div>');
  116. $('#fade').css({'filter' : 'alpha(opacity=30)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=30)'})
  117. return false;
  118. });
  119.  
  120. $('a.close, #fade').live('click', function() {
  121. $('#fade, .popup_block').fadeOut(function() {
  122. $('#fade, a.close').remove(); //fade them both out
  123. });
  124. return false;
  125. });
  126. });
  127. </script>
  128.  
  129.  
  130. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  131.  
  132.  
  133.  
  134. <script>
  135. function openCity(evt, cityName) {
  136. var i, sidenav, sidelinks;
  137. sidenav = document.getElementsByClassName("sidenav");
  138. for (i = 0; i < sidenav.length; i++) {
  139. sidenav[i].style.display = "none";
  140. }
  141. sidelinks = document.getElementsByClassName("sidelinks");
  142. for (i = 0; i < sidelinks.length; i++) {
  143. sidelinks[i].className = sidelinks[i].className.replace(" active", "");
  144. }
  145. document.getElementById(cityName).style.display = "block";
  146. evt.currentTarget.className += " active";
  147. }
  148. </script>
  149.  
  150. <script>
  151. function openCity(evt, cityName) {
  152. var i, tabcontent, tablinks;
  153. tabcontent = document.getElementsByClassName("tabcontent");
  154. for (i = 0; i < tabcontent.length; i++) {
  155. tabcontent[i].style.display = "none";
  156. }
  157. tablinks = document.getElementsByClassName("tablinks");
  158. for (i = 0; i < tablinks.length; i++) {
  159. tablinks[i].className = tablinks[i].className.replace(" active", "");
  160. }
  161. document.getElementById(cityName).style.display = "block";
  162. evt.currentTarget.className += " active";
  163. }
  164. </script>
  165.  
  166. <script>
  167. function openCity(evt, cityName) {
  168. var i, musecontent, muselinks;
  169. musecontent = document.getElementsByClassName("musecontent");
  170. for (i = 0; i < musecontent.length; i++) {
  171. musecontent[i].style.display = "none";
  172. }
  173. muselinks = document.getElementsByClassName("muselinks");
  174. for (i = 0; i < muselinks.length; i++) {
  175. muselinks[i].className = muselinks[i].className.replace(" active", "");
  176. }
  177. document.getElementById(cityName).style.display = "block";
  178. evt.currentTarget.className += " active";
  179. }
  180. </script>
  181.  
  182. <script type="text/javascript">
  183. $(document).ready(function(){
  184.  
  185. $('ul.tabs li').click(function(){
  186. var tab_id = $(this).attr('data-tab');
  187.  
  188. $('ul.tabs li').removeClass('current');
  189. $('.tab-content').removeClass('current');
  190.  
  191. $(this).addClass('current');
  192. $("#"+tab_id).addClass('current');
  193. })
  194.  
  195. })
  196. </script>
  197.  
  198. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  199. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  200.  
  201. <script>
  202. (function($){
  203. $(document).ready(function(){
  204. $(“[title],a[title],img[title]”).style_my_tooltips({
  205. tip_follows_cursor:true,
  206. tip_delay_time:90,
  207. tip_fade_speed:600,
  208. attribute:“title”
  209. });
  210. });
  211. })(jQuery);
  212. </script>
  213.  
  214. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  215.  
  216. <script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  217.  
  218. <link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
  219.  
  220. <script src="https://kit.fontawesome.com/bd9f878505.js"></script>
  221.  
  222. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/simple-line-icons/2.4.1/css/simple-line-icons.css">
  223.  
  224. <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
  225.  
  226. <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
  227.  
  228. <link rel="stylesheet" href="https://static.tumblr.com/i5s2zks/6kOohwlux/pe-icon-7-stroke.css">
  229.  
  230. <link href="//dl.dropbox.com/s/50g6fbds3rh4m0j/saturnicons.css" rel="stylesheet">
  231.  
  232. <link href="//dl.dropbox.com/s/vpi3f9s7nhpe7v7/honeybee.css" rel="stylesheet">
  233.  
  234. <link href="https://fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900" rel="stylesheet">
  235.  
  236. <link href="https://fonts.googleapis.com/css?family=Comfortaa:300,400,700" rel="stylesheet">
  237.  
  238.  
  239.  
  240. <style type="text/css">
  241.  
  242.  
  243.  
  244. /* ------ fonts ------ */
  245.  
  246.  
  247.  
  248. @font-face { font-family: "coco"; src: url('https://dl.dropboxusercontent.com/s/h4xmli8klp2dub5/CerebriSans-Bold.ttf') ;}
  249.  
  250. @font-face { font-family: dillova; src: url('https://dl.dropboxusercontent.com/s/y6nkqox5dqu98of/Dillova.ttf') ; }
  251.  
  252.  
  253.  
  254. /* ------ scrollbar ------ */
  255.  
  256.  
  257.  
  258. ::-webkit-scrollbar { width: 0px; height:0px; background:transparent; }
  259.  
  260. ::-webkit-scrollbar-thumb { background-color: transparent; }
  261.  
  262.  
  263.  
  264. /* ------ lightbox ------ */
  265.  
  266.  
  267.  
  268. .vignette, #vignette { opacity:0; }
  269.  
  270. .lightbox-image, #tumblr_lightbox img { box-shadow:none !important; border-radius:0 !important; max-width:none; border:5px solid #fff !important; -moz-box-sizing:border-box; box-sizing:border-box; }
  271.  
  272. .tmblr-lightbox, #tumblr_lightbox { background-color:rgba(245,245,245,.84) !important; }
  273.  
  274. .lightbox-caption, #tumblr_lightbox_caption { visibility:hidden; }
  275.  
  276.  
  277. /* ------ tooltip ------ */
  278.  
  279.  
  280.  
  281. #s-m-t-tooltip { max-width:250px; padding:4px 4px 4px 6px; margin:-30px 12px; color:{color:text}; z-index:99999; font-size:7px; border-radius:4px; text-transform:uppercase; font-variant:none; letter-spacing:2px; font-weight:bold; background-color:{color:bold}; }
  282.  
  283.  
  284.  
  285. /* ------ selection ------ */
  286.  
  287.  
  288.  
  289. ::-moz-selection { background:{color:links}; color:{color:linksbg}; }
  290.  
  291. ::selection { background:{color:links}; color:{color:linksbg}; }
  292.  
  293.  
  294.  
  295. /* ------ text styles ------ */
  296.  
  297.  
  298.  
  299. body { background:{color:background}; margin:0px; font-weight:500; color:{color:text}; font-family:'montserrat'; font-size:10px; line-height:16px; letter-spacing:.5px; text-align:justify; background-image:url('{image:Background}'); }
  300.  
  301. a { text-decoration:none; color:{color:links}; -moz-transition-duration:0.3s; -webkit-transition-duration:0.3s; -o-transition-duration:0.3s; }
  302.  
  303. a:hover { color:{color:text}; background:transparent; -moz-transition-duration:0.3s; -webkit-transition-duration:0.3s; -o-transition-duration:0.3s; }
  304.  
  305. b, strong { color:{color:bold}; font-weight:700; }
  306.  
  307. em, i { color:{color:italic}; font-weight:600; }
  308.  
  309. i:hover { background:transparent; }
  310.  
  311. strike { color:{color:italic}; }
  312.  
  313. small { font-size:10px; }
  314.  
  315. big { color:{color:title}; font-weight:600; font-variant:small-caps; letter-spacing:2px; }
  316.  
  317. sup { font-variant:small-caps; letter-spacing:2px; color:{color:bold}; font-weight:normal; }
  318.  
  319. blockquote { margin-left:5px; padding-left:10px; width:265px; border-left:1px solid {color:background}; }
  320.  
  321. blockquote blockquote { padding-left:10px; width:245px; border-left:1px solid {color:background}; }
  322.  
  323. h1 { color:{color:bold}; font-size:8px; letter-spacing:2px; text-transform:uppercase; font-family:'coco'; font-style:none; line-height:10px; text-align:left; padding:0px; }
  324.  
  325. h2 { text-align:center; color:{color:text}; font-size:11px; letter-spacing:.5px; text-transform:lowercase; font-style:none; font-weight:400; line-height:14px; text-align:normal; padding:0px; }
  326.  
  327. h3 { letter-spacing:0px; font-size:30px; line-height:24px; text-align:center; color:{color:italic}; font-family:'coco'; font-weight:800; text-transform:lowercase; font-style:normal; }
  328.  
  329. h3 a { color:{color:italic}; text-shadow:1px 0px {color:title}; }
  330.  
  331.  
  332.  
  333. /* ------ images/videos ------ */
  334.  
  335.  
  336.  
  337. img { border:none; max-width:100%; height:auto; border-radius:6px; -webkit-filter:grayscale(100%); -moz-transition-duration:1s; -webkit-transition-duration:1s; -o-transition-duration:1s; }
  338.  
  339. img:hover { -webkit-filter:grayscale(0%); -moz-transition-duration:1s; -webkit-transition-duration:1s; -o-transition-duration:1s; }
  340.  
  341. resize { width: 300px; height:auto; }
  342.  
  343. #posts img { -webkit-filter:grayscale(100%); -moz-transition-duration:1s; -webkit-transition-duration:1s; -o-transition-duration:1s; }
  344.  
  345. .photoset { width:100%; border-radius:6px; -webkit-filter:grayscale(100%); -moz-transition-duration:1s; -webkit-transition-duration:1s; -o-transition-duration:1s; }
  346.  
  347. #posts img:hover { -webkit-filter:grayscale(0%); -moz-transition-duration:1s; -webkit-transition-duration:1s; -o-transition-duration:1s; }
  348.  
  349. .photoset:hover { max-width:100%; -webkit-filter:grayscale(0%); -moz-transition-duration:1s; -webkit-transition-duration:1s; -o-transition-duration:1s; }
  350.  
  351.  
  352.  
  353. /* ------ body ------ */
  354.  
  355.  
  356.  
  357. #contain { width:740px; height:480px; margin:auto; left:0px; right:0px; top:0px; bottom:0px; background:transparent; position:absolute; overflow:visible; border-radius:4px; z-index:1; }
  358.  
  359. #entries { width:400px; background:{color:entries}; height:400px; top:40px; left:50px; border-radius:4px 0px 0px 4px; font-size:10px; position:absolute; font-family:'montserrat'; overflow-x:hidden; overflow-y:auto; letter-spacing:0px; z-index:1; }
  360.  
  361. #post { margin:auto; top:0px; right:0px; bottom:0px; left:0px; width:300px; background: {color:postbg}; padding:20px; position:relative; border-radius:3px; margin-top:40px; }
  362.  
  363.  
  364.  
  365. /* ------ sidebar ------ */
  366.  
  367.  
  368.  
  369. #sidebar { background-color:{color:sidebar}; border-radius:0px 4px 4px 0px; width:240px; height:400px; position:absolute; top:40px; right:50px; overflow:hidden; }
  370.  
  371. #sidebar img { width:240px; height:140px; border-radius:0px; position:absolute; margin:0px; -webkit-filter:grayscale(0%); }
  372.  
  373. #accent { height:240px; width:240px; position:absolute; bottom:0px; right:0px; opacity:1; background-color:{color:accent}; }
  374.  
  375. .title { position:absolute; top:170px; left:0px; width:240px; height:auto; font-size:7px; letter-spacing:5px; line-height:20px; text-align:center; color:{color:title}; font-family:'montserrat'; text-transform:uppercase; z-index:99; }
  376.  
  377. .desc { font-weight:400; position:absolute; width:160px; line-height:18px; height:120px; bottom:40px; left:0px; overflow:scroll; font-size:9px; color:{color:desc}; padding:10px 40px 10px 40px; border-bottom:20px solid {color:sidebar}; text-transform:normal; font-family:'montserrat'; letter-spacing:1px; text-align:center; z-index:4; -moz-transition-duration:1s; -webkit-transition-duration:1s; -o-transition-duration:1s; }
  378.  
  379. .desc i, em { color:{color:italic}; font-weight:400; }
  380.  
  381. .desc b, strong { color:{color:bold}; }
  382.  
  383. .desc a { color:{color:italic}; }
  384.  
  385. .sidenavi { position:absolute; bottom:0px; right:0px; background:{color:accent}; padding:10px; font-size:7px; letter-spacing:3px; line-height:20px; text-align:center; color:{color:title}; font-family:'montserrat'; text-transform:uppercase; height:20px; width:220px; }
  386.  
  387. .sidenavi a { color:#fff; }
  388.  
  389. .sidelink { background:{color:accent}; text-align:center; font-size:18px; height:52px; width:240px; top:0px; right:0px; position:absolute; letter-spacing:0px; overflow:hidden; z-index:5; }
  390.  
  391. .sidelink a { color:{color:bold}; border-radius:6px; display:inline-block; margin:5px; text-transform:uppercase; -moz-transition-duration:0.3s; -webkit-transition-duration:0.3s; -o-transition-duration:0.3s; z-index:99999999999999; }
  392.  
  393. ul.sidelink { position:relative; overflow:hidden; list-style-type: none; margin: 0; padding: 0; top:2px; right:0px; text-align:center; background-color: transparent; z-index:999999999; }
  394.  
  395. ul.sidelink li { width: 20px; display:inline-block; margin:10px; }
  396.  
  397. ul.sidelink li a, li i { display:inline-block; color:{color:accent2}; font-size:12px; padding:3px; border-radius:100px; margin:-3px 0px 0px -2px; }
  398.  
  399.  
  400.  
  401. /* ------ pagination ------ */
  402.  
  403.  
  404. #pagination { width:400px; position:relative; height:14px; padding:3px; padding-top:5px; margin:auto; bottom:20px; left:0px; word-spacing:20px; text-align:center; color:{color:text}; z-index:999; }
  405.  
  406. #pagination a { padding:5px; padding-left:8px; background:{color:postbg}; color:{color:text}; font-weight:bold; letter-spacing:5px; font-size:7px; border-radius:6px; }
  407.  
  408.  
  409.  
  410. /* ------ info / tags ------ */
  411.  
  412.  
  413.  
  414. #info { background:{color:entries}; width:auto; height:20px; text-align:left; margin-top:8px; letter-spacing:1px; font-size:12px; font-style:none; padding:7px; line-height:20px; text-transform:uppercase; color:#6d6d6d; border-radius:3px; }
  415.  
  416. #info a { color:{color:italic}; -moz-transition-duration:1s; -webkit-transition-duration:1s; -o-transition-duration:1s; }
  417.  
  418. #info a:hover { -moz-transition-duration:1s; -webkit-transition-duration:1s; -o-transition-duration:1s; color:{color:text}; background:transparent; }
  419.  
  420. #tags { padding: 5px; color:{color:text}; text-transform: none; font-style:none; font-size: 7px; text-align: center; letter-spacing: 1px; }
  421.  
  422. #tags i { color:{color:text}; }
  423.  
  424. #tags a { color: {color:title}; }
  425.  
  426. #tags a:hover { color: {color:text}; background:transparent; }
  427.  
  428. .textbody { margin-bottom:-15px; }
  429.  
  430. #notes { width:275px; }
  431.  
  432.  
  433.  
  434. /* ------ questions ------ */
  435.  
  436.  
  437.  
  438. #question { border-radius:10px 10px 0px 0px; color:{color:entries}; padding:14px; font-family:'montserrat'; font-size:10px; font-weight:500; letter-spacing:.5px; text-align:center; margin-top:0px; text-transform:normal; line-height:16px; background-color:{color:text}; }
  439.  
  440. #asker { font-size:12px; color:{color:bold}; padding:5px; background:{color:entries}; width:auto; text-align:right; text-transform:uppercase; border-radius:0px 0px 10px 10px; }
  441.  
  442. #asker a { color:{color:bold}; }
  443.  
  444. #asker b { color:{color:bold}; }
  445.  
  446. #asker i { color:{color:bold}; }
  447.  
  448.  
  449.  
  450. /* ------ music player ------ */
  451.  
  452.  
  453.  
  454. .audio { width:400px; padding-bottom:10px; background-color:{color:border}; }
  455.  
  456. .audioinfo { background:{color:entries}; width:198px; height:40px; text-align:center; margin-left:70px; padding:16px; color:{color:text}; text-transform:lowercase; border-radius:0px 10px 10px 0px; }
  457.  
  458. .audioinfo b, strong, i, em { color:{color:title}; }
  459.  
  460. .audioinfo h1 { text-align:center; font-size:20px; letter-spacing:0px; height:0px; font-weight:800; margin-top:10px; font-variant:none; text-transform:lowercase; color:{color:fl}; font-family:'coco'; }
  461.  
  462. .playerborderer { height:50px; width:50px; padding:15px; background:transparent; position:absolute; }
  463.  
  464. .player { margin-top:-13px; margin-left:-13px; position:relative; text-align:center; width:6px; height:10px; overflow:hidden; padding:20px; background:transparent; opacity:.5; }
  465.  
  466. .cover { border-radius:10px 0px 0px 10px; height:60px; width:60px; margin-right:10px; margin-top:0px; border:6px solid #ddd; }
  467.  
  468.  
  469.  
  470.  
  471. /* ------ quote source ------ */
  472.  
  473.  
  474.  
  475. .qsource { text-align:center; }
  476.  
  477. .qsource i, em { color:{color:text}; }
  478.  
  479.  
  480.  
  481. /* ------ huney ------ */
  482.  
  483.  
  484.  
  485. #huney { text-align:center; font-size:14px; height:38px; width:80px; bottom:10px; left:10px; position:absolute; line-height:20px; padding:3px; letter-spacing:0px; overflow:hidden; z-index:5; }
  486.  
  487. #huney li { width:22px; height:22px; padding:8px; list-style:none; text-align:center; line-height:5px; background:{color:sidebar}; border-radius:4px; margin-right:17px; float:left; }
  488.  
  489. #huney a { font-weight:bold; line-height:14px; font-size:20px;letter-spacing:2px; color:{color:links}; -moz-transition-duration:1s; -webkit-transition-duration:1s; -o-transition-duration:1s; z-index:99999999999999; }
  490.  
  491. ul.huney { position:absolute; overflow:hidden; list-style-type: none; margin: 0; padding: 0; background-color: transparent; right:30px; top:5px; z-index:999999999; }
  492.  
  493. ul.huney li { width: 20px; float:left; margin-left:2px; }
  494.  
  495. ul.huney li a{ display:inline-block; color:{color:desc}; font-size:20px; padding:3px; border-radius:100px; margin:-3px 0px 0px -2px; }
  496.  
  497.  
  498.  
  499. /* ------ tab coding ------ */
  500.  
  501.  
  502.  
  503. .close { position:absolute; top:-5px; right:0px; font-weight:600; color:{color:text}; background:{color:entries}; z-index:9999999; padding: 16px; width: 16px; border-radius: 50%; font-size:11px;text-align:center; -webkit-transform:rotate(45deg); -moz-transition-duration:0.3s; -webkit-transition-duration:0.3s; -o-transition-duration:0.3s }
  504.  
  505. .close:hover { cursor: pointer; color:rgba(14,14,14,.5); -moz-transition-duration:0.3s; -webkit-transition-duration:0.3s; -o-transition-duration:0.3s; }
  506.  
  507. .close2 { position:absolute; top:-11px; right:-15px; font-weight:600; color:{color:accent2}; z-index:9999999; padding: 16px; width: 16px; border-radius: 50%; font-size:8px; text-align:center; -webkit-transform:rotate(45deg); -moz-transition-duration:0.3s; -webkit-transition-duration:0.3s; -o-transition-duration:0.3s }
  508.  
  509. .close2:hover { cursor: pointer; color:rgba(14,14,14,.5); -moz-transition-duration:0.3s; -webkit-transition-duration:0.3s; -o-transition-duration:0.3s; }
  510.  
  511. .tabcontent { overflow:hidden; display: none; height:375; width:360px; padding:0px; margin-left:292px; margin-top:0px; background-color:transparent; z-index:9999; -webkit-animation: fadeEffect 1s; animation: fadeEffect 1s; }
  512.  
  513. .tabcontent.current { display: inherit; -webkit-animation: fadeEffect 1s; animation: fadeEffect 1s; }
  514.  
  515. .musecontent { overflow:hidden; display: none; height:375; width:360px; padding:0px; margin-left:292px; margin-top:0px; background-color:transparent; z-index:9999; -webkit-animation: fadeEffect 1s; animation: fadeEffect 1s; }
  516.  
  517. .musecontent.current { display: inherit; -webkit-animation: fadeEffect 1s; animation: fadeEffect 1s; }
  518.  
  519. .sidenav { overflow:hidden; display: none; height:100px; width:240px; padding:0px; background-color:transparent; z-index:9999; -webkit-animation: fadeEffect 1s; animation: fadeEffect 1s; }
  520.  
  521. .sidenav.current { display: inherit; -webkit-animation: fadeEffect 1s; animation: fadeEffect 1s; }
  522.  
  523. @-webkit-keyframes fadeEffect { from { opacity: 0; } to { opacity: 1; } }
  524.  
  525. @keyframes fadeEffect { from { opacity: 0; } to { opacity: 1; } }
  526.  
  527.  
  528.  
  529. /* ------ tab cosmetics ------ */
  530.  
  531.  
  532.  
  533. #sidetab { position:absolute; right:50px; bottom:40px; width: 240px; height:40px; border-radius:0px 0px 4px 0px; background-color:{color:sidebar}; overflow:hidden; z-index:99999; }
  534.  
  535. #navtab { position:absolute; margin:auto; left:50px; top:40px; width: 400px; padding-top:20px; height:380px; border-radius:4px 0px 0px 4px; background-color:{color:entries}; overflow:hidden; }
  536.  
  537. #musetab { position:absolute; margin:auto; left:50px; top:40px; width: 400px; padding-top:20px; height:380px; border-radius:4px 0px 0px 4px; background-color:{color:entries}; overflow:hidden; }
  538.  
  539. #chara1tab { position:absolute; margin:auto; left:50px; top:40px; width: 400px; padding-top:20px; height:380px; border-radius:4px 0px 0px 4px; background-color:{color:entries}; overflow:hidden; }
  540.  
  541. #chara1tab i,em { color:{color:italic}; }
  542.  
  543. #chara1tab img { -webkit-filter:grayscale(0%); }
  544.  
  545. #chara2tab { position:absolute; margin:auto; left:50px; top:40px; width: 400px; padding-top:20px; height:380px; border-radius:4px 0px 0px 4px; background-color:{color:entries}; overflow:hidden; }
  546.  
  547. #chara2tab i,em { color:{color:italic}; }
  548.  
  549. #chara2tab img { -webkit-filter:grayscale(0%); }
  550.  
  551. #chara3tab { position:absolute; margin:auto; left:50px; top:40px; width: 400px; padding-top:20px; height:380px; border-radius:4px 0px 0px 4px; background-color:{color:entries}; overflow:hidden; }
  552.  
  553. #chara3tab i,em { color:{color:italic}; }
  554.  
  555. #chara3tab img { -webkit-filter:grayscale(0%); }
  556.  
  557. #chara4tab { position:absolute; margin:auto; left:50px; top:40px; width: 400px; padding-top:20px; height:380px; border-radius:4px 0px 0px 4px; background-color:{color:entries}; overflow:hidden; }
  558.  
  559. #chara4tab i,em { color:{color:italic}; }
  560.  
  561. #chara4tab img { -webkit-filter:grayscale(0%); }
  562.  
  563. #chara5tab { position:absolute; margin:auto; left:50px; top:40px; width: 400px; padding-top:20px; height:380px; border-radius:4px 0px 0px 4px; background-color:{color:entries}; overflow:hidden; }
  564.  
  565. #chara5tab i,em { color:{color:italic}; }
  566.  
  567. #chara5tab img { -webkit-filter:grayscale(0%); }
  568.  
  569. #chara6tab { position:absolute; margin:auto; left:50px; top:40px; width: 400px; padding-top:20px; height:380px; border-radius:4px 0px 0px 4px; background-color:{color:entries}; overflow:hidden; }
  570.  
  571. #chara6tab i,em { color:{color:italic}; }
  572.  
  573. #chara6tab img { -webkit-filter:grayscale(0%); }
  574.  
  575. #chara7tab { position:absolute; margin:auto; left:50px; top:40px; width: 400px; padding-top:20px; height:380px; border-radius:4px 0px 0px 4px; background-color:{color:entries}; overflow:hidden; }
  576.  
  577. #chara7tab i,em { color:{color:italic}; }
  578.  
  579. #chara7tab img { -webkit-filter:grayscale(0%); }
  580.  
  581. #chara8tab { position:absolute; margin:auto; left:50px; top:40px; width: 400px; padding-top:20px; height:380px; border-radius:4px 0px 0px 4px; background-color:{color:entries}; overflow:hidden; }
  582.  
  583. #chara8tab i,em { color:{color:italic}; }
  584.  
  585. #chara8tab img { -webkit-filter:grayscale(0%); }
  586.  
  587. #chara9tab { position:absolute; margin:auto; left:50px; top:40px; width: 400px; padding-top:20px; height:380px; border-radius:4px 0px 0px 4px; background-color:{color:entries}; overflow:hidden; }
  588.  
  589. #chara9tab i,em { color:{color:italic}; }
  590.  
  591. #chara9tab img { -webkit-filter:grayscale(0%); }
  592.  
  593. #chara10tab { position:absolute; margin:auto; left:50px; top:40px; width: 400px; padding-top:20px; height:380px; border-radius:4px 0px 0px 4px; background-color:{color:entries}; overflow:hidden; }
  594.  
  595. #chara10tab i,em { color:{color:italic}; }
  596.  
  597. #chara11tab img { -webkit-filter:grayscale(0%); }
  598.  
  599. #chara11tab { position:absolute; margin:auto; left:50px; top:40px; width: 400px; padding-top:20px; height:380px; border-radius:4px 0px 0px 4px; background-color:{color:entries}; overflow:hidden; }
  600.  
  601. #chara11tab i,em { color:{color:italic}; }
  602.  
  603. #chara11tab img { -webkit-filter:grayscale(0%); }
  604.  
  605. #chara12tab { position:absolute; margin:auto; left:50px; top:40px; width: 400px; padding-top:20px; height:380px; border-radius:4px 0px 0px 4px; background-color:{color:entries}; overflow:hidden; }
  606.  
  607. #chara12tab i,em { color:{color:italic}; }
  608.  
  609. #chara12tab img { -webkit-filter:grayscale(0%); }
  610.  
  611.  
  612.  
  613. /* ------ navtab cosmetics ------ */
  614.  
  615.  
  616.  
  617. .tabbox1 { position:absolute; right:70px; top:50px; background:{color:accent2}; width:200px; height:120px; overflow-x:hidden; overflow-y:scroll; padding:10px; font-size:9px; line-height:18px; border-radius:4px; }
  618.  
  619. .tape1 { position:absolute; left:95px; top:52px; background:{color:bold}; width:60px; height:15px; font-size:9px; border-radius:2px; opacity:.7; -webkit-transform:rotate(-30deg); }
  620.  
  621. .tape2 { position:absolute; right:55px; top:172px; background:{color:bold}; width:60px; height:15px; font-size:9px; border-radius:2px; opacity:.7; -webkit-transform:rotate(-30deg); }
  622.  
  623. .tabbox2 { position:absolute; right:50px; bottom:40px; background:{color:accent2}; width:200px; height:120px; overflow-x:hidden; overflow-y:scroll; padding:10px; font-size:9px; line-height:18px; border-radius:4px; }
  624.  
  625. .tape3 { position:absolute; left:115px; bottom:162px; background:{color:bold}; width:60px; height:15px; font-size:9px; border-radius:2px; opacity:.7; -webkit-transform:rotate(-30deg); }
  626.  
  627. .tape4 { position:absolute; right:35px; bottom:42px; background:{color:bold}; width:60px; height:15px; font-size:9px; border-radius:2px; opacity:.7; -webkit-transform:rotate(-30deg); }
  628.  
  629. .navi { text-align:center; position:absolute; bottom:0px; left:15px; width:10px; height:400px; overflow:visible; display:inline-block; padding:0px; }
  630.  
  631. ul.navi { font-weight:700; font-family:'coco'; font-size:50px; color:{color:entries}; width:50px; height:225px; position:absolute; left:0px; bottom:0px; display:inline-block; }
  632.  
  633. ul.navi li { width:30px; height:30px; padding:10px; background:{color:accent}; display:inline-block; margin:5px; border-radius:50%; -moz-transition-duration:1s; -webkit-transition-duration:1s; -o-transition-duration:1s; }
  634.  
  635. ul.navi li:hover { background:{color:bold}; -moz-transition-duration:1s; -webkit-transition-duration:1s; -o-transition-duration:1s; }
  636.  
  637. ul.navi li a { display:inline-block; color:{color:text}; font-size:24px; padding:3px; border-radius:100px; margin:0px 0px 0px 0px; }
  638.  
  639.  
  640.  
  641. /* ------ musetab cosmetics ------ */
  642.  
  643.  
  644.  
  645. .musetitle { position:absolute; top:45px; right:46px; width:274px; height:auto; font-family:'dillova'; font-size:70px; text-align:center; color:{color:text}; }
  646.  
  647. .muses { background:{color:accent2}; border-radius:4px; padding:10px; position:absolute; bottom:20px; left:20px; width:340px; height:250px; display:inline-block; text-align:center; overflow:scroll; }
  648.  
  649. .tape5 { position:absolute; left:120px; top:100px; background:{color:accent}; width:160px; height:30px; font-size:9px; border-radius:2px; opacity:.7; -webkit-transform:rotate(2deg); }
  650.  
  651. .muse { width:auto; height:auto; display:inline-block; margin:5px; border-radius:50%; }
  652.  
  653. .muse img { border-radius:50%; width:80px; -webkit-filter:grayscale(0%); }
  654.  
  655.  
  656.  
  657. /* ------ charatab cosmetics 2.0 ------ */
  658.  
  659.  
  660.  
  661. .charaname { position:absolute; bottom:60px; left:60px; width:auto; height:auto; color:{color:italic}; font-weight:700; font-family:'coco'; font-size:60px; text-transform:uppercase; text-align:center; -webkit-filter:blur(2px); -moz-transition-duration:0.3s; -webkit-transition-duration:0.3s; -o-transition-duration:0.3s; }
  662.  
  663. .bio { position:absolute; top:45px; left:55px; width:140px; height:140px; padding:10px; background:{color:bold}; text-align:center; line-height:16px; font-size:8px; font-family:'montserrat'; border-radius:4px; overflow-x:hidden; overflow-y:scroll; -webkit-transform:rotate(-5deg); z-index:99; }
  664.  
  665. .tape6 { position:absolute; left:80px; top:35px; background:{color:accent}; width:60px; height:15px; font-size:9px; border-radius:2px; opacity:.7; -webkit-transform:rotate(-2deg); z-index:999; }
  666.  
  667. .tape7 { position:absolute; right:85px; top:100px; background:{color:accent}; width:60px; height:15px; font-size:9px; border-radius:2px; opacity:.7; -webkit-transform:rotate(3deg); z-index:999; }
  668.  
  669. .tape8 { position:absolute; right:65px; top:100px; background:{color:accent}; width:60px; height:15px; font-size:9px; border-radius:2px; opacity:.7; -webkit-transform:rotate(3deg); z-index:999; }
  670.  
  671. .aesthetics { position:absolute; top:80px; left:60px; border-radius:4px; padding:10px; width:140px; height:180px; color:white; background:rgba(255,255,255,.2); overflow:auto; opacity:0; -moz-transition-duration:1s; -webkit-transition-duration:1s; -o-transition-duration:1s; }
  672.  
  673. .aesthetics:hover { opacity:1; -moz-transition-duration:1s; -webkit-transition-duration:1s; -o-transition-duration:1s; }
  674.  
  675. .charanavi { text-align:left; height:auto; width:160px; bottom:55px; left:20px; position:absolute; letter-spacing:0px; overflow:hidden; z-index:5; }
  676.  
  677. ul.charanavi { position:relative; overflow:hidden; list-style-type: none; margin: 0; padding: 0; top:0px; right:0px; text-align:center; background-color: transparent; z-index:999999999; }
  678.  
  679. ul.charanavi li { display:inline-block; margin:5px; }
  680.  
  681. ul.charanavi li a, li i { display:inline-block; color:{color:italic}; font-size:60px; padding:3px; border-radius:100px; margin:-3px 0px 0px -2px; }
  682.  
  683.  
  684.  
  685. /* ------ end of css coding ------ */
  686.  
  687.  
  688.  
  689. {CustomCSS}</style></head><body>
  690.  
  691.  
  692.  
  693. <!------ begin html coding ------>
  694.  
  695.  
  696. <div id="contain">
  697.  
  698. <div id="sidebar">
  699.  
  700. <img src="{image:sidebar}">
  701.  
  702. <div class="title">
  703. {text:title}</div>
  704.  
  705. <div class="sidenavi">
  706. <a href="#" class="sidelinks" onclick="openCity(event, 'sidetab')" title="navigation"> click for navigation!</a>
  707. </div>
  708.  
  709. <div class="desc">{Description}</div>
  710.  
  711. </div>
  712.  
  713.  
  714.  
  715. <!------ navigation tab ------>
  716.  
  717.  
  718.  
  719. <div id="sidetab" class="sidenav">
  720. <span onclick="this.parentElement.style.display='none'" class="close2"> <i class="far fa-plus"></i> </span>
  721.  
  722. <div class="sidelink">
  723. <ul class="sidelink">
  724. <li><a href="/" title="refresh"><i class="fal fa-home"></i></a></li>
  725. <li><a href="/faq" title="message"><i class="far fa-comments"></i></a></li>
  726. <li><a href="#" class="tablinks" onclick="openCity(event, 'navtab')" title="navig8"><i class="fal fa-plus"></i></a></li>
  727. <li><a href="#" class="tablinks" onclick="openCity(event, 'musetab')" title="muses"><i class="fal fa-heart"></i></a></li>
  728. </ul>
  729. </div>
  730.  
  731. </div>
  732.  
  733.  
  734.  
  735. <!------ navigation tab ------>
  736.  
  737.  
  738.  
  739. <div id="navtab" class="tabcontent">
  740. <span onclick="this.parentElement.style.display='none'" class="close"> <i class="far fa-plus"></i> </span>
  741.  
  742.  
  743.  
  744. <!------ don't touch from here.. ------>
  745. <div style="position:absolute; top:14px; left:10px; width:380px; height:2px; border-bottom:1px solid {color:text}; opacity:.4;"></div>
  746. <div style="position:absolute; top:10px; left:20px; background:{color:bold}; overflow:hidden; width:50px; height:80px; -webkit-clip-path: polygon(100% 0, 100% 100%, 50% 75%, 0 100%, 0 0); clip-path: polygon(100% 0, 100% 100%, 50% 75%, 0 100%, 0 0); border-radius:4px;">
  747. <div style="width:auto; height:auto; text-align:center; position:absolute; top:24px; left:2.5px; font-size:40px; letter-spacing:0px; font-family:'coco'; font-weight:800; color:{color:sidebar};">01</div>
  748. </div>
  749. <!------ ..to here! ------>
  750.  
  751. <!------ tab navigation ------>
  752. <div class="navi">
  753. <ul class="navi">
  754. <li><a href="{text:tablink1}"><i class="far fa-star"></i></a></li>
  755. <li><a href="{text:tablink2}"><i class="far fa-moon"></i></a></li>
  756. <li><a href="{text:tablink3}"><i class="far fa-planet-ringed"></i></a></li>
  757. <li><a href="{text:tablink4}"><i class="far fa-meteor"></i></a></li>
  758. </ul>
  759. </div>
  760.  
  761. <div class="tabbox1">
  762. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque id gravida eros. Nunc eget justo lacus. Sed iaculis erat vel elit laoreet, sit amet hendrerit ex tristique. Duis a auctor libero. Integer facilisis, leo vitae efficitur convallis, felis risus lobortis justo, nec molestie nisl felis a sapien. Aliquam commodo sapien mauris, at pulvinar enim malesuada ultrices. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nam tincidunt quis tellus ut condimentum. Quisque semper vitae neque vitae pharetra. Aenean turpis massa, pretium ut enim at, maximus aliquam velit. Morbi sed purus elementum, pretium est in, posuere ipsum. Nunc id risus nisl.
  763. </div>
  764. <div class="tape1"></div>
  765. <div class="tape2"></div>
  766.  
  767.  
  768. <div class="tabbox2">
  769. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque id gravida eros. Nunc eget justo lacus. Sed iaculis erat vel elit laoreet, sit amet hendrerit ex tristique. Duis a auctor libero. Integer facilisis, leo vitae efficitur convallis, felis risus lobortis justo, nec molestie nisl felis a sapien. Aliquam commodo sapien mauris, at pulvinar enim malesuada ultrices. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nam tincidunt quis tellus ut condimentum. Quisque semper vitae neque vitae pharetra. Aenean turpis massa, pretium ut enim at, maximus aliquam velit. Morbi sed purus elementum, pretium est in, posuere ipsum. Nunc id risus nisl.
  770. </div>
  771. <div class="tape3"></div>
  772. <div class="tape4"></div>
  773.  
  774. </div>
  775.  
  776.  
  777.  
  778. <!------ muse tab ------>
  779.  
  780.  
  781.  
  782. <div id="musetab" class="tabcontent">
  783. <span onclick="this.parentElement.style.display='none'" class="close"> <i class="far fa-plus"></i> </span>
  784.  
  785. <!------ don't touch from here.. ------>
  786. <div style="position:absolute; top:14px; left:10px; width:380px; height:2px; border-bottom:1px solid {color:text}; opacity:.4;"></div>
  787. <div style="position:absolute; top:10px; left:20px; background:{color:bold}; overflow:hidden; width:50px; height:80px; -webkit-clip-path: polygon(100% 0, 100% 100%, 50% 75%, 0 100%, 0 0); clip-path: polygon(100% 0, 100% 100%, 50% 75%, 0 100%, 0 0); border-radius:4px; z-index:99;">
  788. <div style="width:auto; height:auto; text-align:center; position:absolute; top:24px; left:2.5px; font-size:40px; letter-spacing:-3px; font-family:'coco'; font-weight:800; color:{color:sidebar};">02</div>
  789. </div>
  790. <!------ ..to here! ------>
  791.  
  792. <div class="musetitle">muses</div>
  793. <div class="muses">
  794.  
  795.  
  796.  
  797. <!------ begin muse 1 ------>
  798.  
  799. <div class="muse">
  800. <a href="#" class="muselinks" onclick="openCity(event, 'chara1tab')" title="{text:muse1}"><img src="{image:muse1}"></a>
  801. </div>
  802.  
  803. <!------ end muse 1 ------>
  804.  
  805.  
  806.  
  807. <!------ begin muse 2 ------>
  808.  
  809. <div class="muse">
  810. <a href="#" class="muselinks" onclick="openCity(event, 'chara2tab')" title="{text:muse2}"><img src="{image:muse2}"></a>
  811. </div>
  812.  
  813. <!------ end muse 2 ------>
  814.  
  815.  
  816.  
  817. <!------ begin muse 3 ------>
  818.  
  819. <div class="muse">
  820. <a href="#" class="muselinks" onclick="openCity(event, 'chara3tab')" title="{text:muse3}"><img src="{image:muse3}"></a>
  821. </div>
  822.  
  823. <!------ end muse 3 ------>
  824.  
  825.  
  826.  
  827. <!------ begin muse 4 ------>
  828.  
  829. <div class="muse">
  830. <a href="#" class="muselinks" onclick="openCity(event, 'chara4tab')" title="{text:muse4}"><img src="{image:muse4}"></a>
  831. </div>
  832.  
  833. <!------ end muse 4 ------>
  834.  
  835.  
  836.  
  837. <!------ begin muse 5 ------>
  838.  
  839. <div class="muse">
  840. <a href="#" class="muselinks" onclick="openCity(event, 'chara5tab')" title="{text:muse5}"><img src="{image:muse5}"></a>
  841. </div>
  842.  
  843. <!------ end muse 5 ------>
  844.  
  845.  
  846.  
  847. <!------ begin muse 6 ------>
  848.  
  849. <div class="muse">
  850. <a href="#" class="muselinks" onclick="openCity(event, 'chara6tab')" title="{text:muse6}"><img src="{image:muse6}"></a>
  851. </div>
  852.  
  853. <!------ end muse 6 ------>
  854.  
  855.  
  856.  
  857. <!------ begin muse 7 ------>
  858.  
  859. <div class="muse">
  860. <a href="#" class="muselinks" onclick="openCity(event, 'chara7tab')" title="{text:muse7}"><img src="{image:muse7}"></a>
  861. </div>
  862.  
  863. <!------ end muse 7 ------>
  864.  
  865.  
  866.  
  867. <!------ begin muse 8 ------>
  868.  
  869. <div class="muse">
  870. <a href="#" class="muselinks" onclick="openCity(event, 'chara8tab')" title="{text:muse8}"><img src="{image:muse8}"></a>
  871. </div>
  872.  
  873. <!------ end muse 8 ------>
  874.  
  875.  
  876.  
  877. <!------ begin muse 9 ------>
  878.  
  879. <div class="muse">
  880. <a href="#" class="muselinks" onclick="openCity(event, 'chara9tab')" title="{text:muse9}"><img src="{image:muse9}"></a>
  881. </div>
  882.  
  883. <!------ end muse 9 ------>
  884.  
  885.  
  886.  
  887. <!------ begin muse 10 ------>
  888.  
  889. <div class="muse">
  890. <a href="#" class="muselinks" onclick="openCity(event, 'chara10tab')" title="{text:muse10}"><img src="{image:muse10}"></a>
  891. </div>
  892.  
  893. <!------ end muse 10 ------>
  894.  
  895.  
  896.  
  897. <!------ begin muse 11 ------>
  898.  
  899. <div class="muse">
  900. <a href="#" class="muselinks" onclick="openCity(event, 'chara11tab')" title="{text:muse11}"><img src="{image:muse11}"></a>
  901. </div>
  902.  
  903. <!------ end muse 11 ------>
  904.  
  905.  
  906.  
  907. <!------ begin muse 12 ------>
  908.  
  909. <div class="muse">
  910. <a href="#" class="muselinks" onclick="openCity(event, 'chara12tab')" title="{text:muse12}"><img src="{image:muse12}"></a>
  911. </div>
  912.  
  913. <!------ end muse 12 ------>
  914.  
  915.  
  916.  
  917.  
  918. </div>
  919. <div class="tape5"></div>
  920.  
  921.  
  922. </div>
  923.  
  924.  
  925.  
  926. <!------ begin chara 1 tab ------>
  927.  
  928.  
  929.  
  930. <div id="chara1tab" class="musecontent">
  931. <span onclick="this.parentElement.style.display='none'" class="close"> <i class="far fa-plus"></i> </span>
  932.  
  933. <div class="bio"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin et massa tellus. Praesent dictum mauris nec quam consectetur, vitae tristique metus rhoncus. Nulla vitae tortor semper mauris lobortis tincidunt in vel justo. Aenean sit amet ligula rhoncus, finibus lacus a, molestie elit. Suspendisse in consequat leo. Nulla porta ante a arcu interdum pulvinar. Aliquam at erat a nisl accumsan auctor. </div>
  934. <div class="tape6"></div>
  935.  
  936. <div class="charanavi">
  937. <ul class="charanavi">
  938. <li><a href="/" title="tag"><i class="fas fa-hashtag"></i></a></li>
  939. <li><a href="/" title="threads"><i class="fas fa-quote-right"></i></a></li>
  940. <li><a href="/" title="ship"><i class="fas fa-heart"></i></a></li>
  941. <li><a href="/" title="pinterest"><i class="fab fa-pinterest"></i></a></li>
  942. </ul>
  943. </div>
  944.  
  945. <img src="https://66.media.tumblr.com/9906b6cd9788c48b7436704e0f917e28/tumblr_inline_pl797hxEVb1rcw8fh_1280.png" style="border-radius:4px; border-left:solid 10px {color:accent2}; border-top:solid 10px {color:accent2}; border-right:solid 10px {color:accent2}; border-bottom:solid 30px {color:accent2}; position:absolute; right:35px; bottom:70px; -webkit-transform:rotate(4deg);">
  946. <div class="tape7"></div>
  947.  
  948. </div>
  949.  
  950.  
  951.  
  952. <!------ end chara 1 tab ------>
  953.  
  954.  
  955.  
  956. <!------ begin chara 2 tab ------>
  957.  
  958.  
  959.  
  960. <div id="chara2tab" class="musecontent">
  961. <span onclick="this.parentElement.style.display='none'" class="close"> <i class="far fa-plus"></i> </span>
  962.  
  963. <div class="bio"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin et massa tellus. Praesent dictum mauris nec quam consectetur, vitae tristique metus rhoncus. Nulla vitae tortor semper mauris lobortis tincidunt in vel justo. Aenean sit amet ligula rhoncus, finibus lacus a, molestie elit. Suspendisse in consequat leo. Nulla porta ante a arcu interdum pulvinar. Aliquam at erat a nisl accumsan auctor. </div>
  964. <div class="tape6"></div>
  965.  
  966. <div class="charanavi">
  967. <ul class="charanavi">
  968. <li><a href="/" title="tag"><i class="fas fa-hashtag"></i></a></li>
  969. <li><a href="/" title="threads"><i class="fas fa-quote-right"></i></a></li>
  970. <li><a href="/" title="ship"><i class="fas fa-heart"></i></a></li>
  971. <li><a href="/" title="pinterest"><i class="fab fa-pinterest"></i></a></li>
  972. </ul>
  973. </div>
  974.  
  975. <img src="https://66.media.tumblr.com/9906b6cd9788c48b7436704e0f917e28/tumblr_inline_pl797hxEVb1rcw8fh_1280.png" style="border-radius:4px; border-left:solid 10px {color:accent2}; border-top:solid 10px {color:accent2}; border-right:solid 10px {color:accent2}; border-bottom:solid 30px {color:accent2}; position:absolute; right:35px; bottom:70px; -webkit-transform:rotate(4deg);">
  976. <div class="tape7"></div>
  977.  
  978. </div>
  979.  
  980.  
  981.  
  982. <!------ end chara 2 tab ------>
  983.  
  984.  
  985.  
  986. <!------ begin chara 3 tab ------>
  987.  
  988.  
  989.  
  990. <div id="chara3tab" class="musecontent">
  991. <span onclick="this.parentElement.style.display='none'" class="close"> <i class="far fa-plus"></i> </span>
  992.  
  993. <div class="bio"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin et massa tellus. Praesent dictum mauris nec quam consectetur, vitae tristique metus rhoncus. Nulla vitae tortor semper mauris lobortis tincidunt in vel justo. Aenean sit amet ligula rhoncus, finibus lacus a, molestie elit. Suspendisse in consequat leo. Nulla porta ante a arcu interdum pulvinar. Aliquam at erat a nisl accumsan auctor. </div>
  994. <div class="tape6"></div>
  995.  
  996. <div class="charanavi">
  997. <ul class="charanavi">
  998. <li><a href="/" title="tag"><i class="fas fa-hashtag"></i></a></li>
  999. <li><a href="/" title="threads"><i class="fas fa-quote-right"></i></a></li>
  1000. <li><a href="/" title="ship"><i class="fas fa-heart"></i></a></li>
  1001. <li><a href="/" title="pinterest"><i class="fab fa-pinterest"></i></a></li>
  1002. </ul>
  1003. </div>
  1004.  
  1005. <img src="https://66.media.tumblr.com/9906b6cd9788c48b7436704e0f917e28/tumblr_inline_pl797hxEVb1rcw8fh_1280.png" style="border-radius:4px; border-left:solid 10px {color:accent2}; border-top:solid 10px {color:accent2}; border-right:solid 10px {color:accent2}; border-bottom:solid 30px {color:accent2}; position:absolute; right:35px; bottom:70px; -webkit-transform:rotate(4deg);">
  1006. <div class="tape7"></div>
  1007.  
  1008. </div>
  1009.  
  1010.  
  1011.  
  1012. <!------ end chara 3 tab ------>
  1013.  
  1014.  
  1015.  
  1016. <!------ begin chara 4 tab ------>
  1017.  
  1018.  
  1019.  
  1020. <div id="chara4tab" class="musecontent">
  1021. <span onclick="this.parentElement.style.display='none'" class="close"> <i class="far fa-plus"></i> </span>
  1022.  
  1023. <div class="bio"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin et massa tellus. Praesent dictum mauris nec quam consectetur, vitae tristique metus rhoncus. Nulla vitae tortor semper mauris lobortis tincidunt in vel justo. Aenean sit amet ligula rhoncus, finibus lacus a, molestie elit. Suspendisse in consequat leo. Nulla porta ante a arcu interdum pulvinar. Aliquam at erat a nisl accumsan auctor. </div>
  1024. <div class="tape6"></div>
  1025.  
  1026. <div class="charanavi">
  1027. <ul class="charanavi">
  1028. <li><a href="/" title="tag"><i class="fas fa-hashtag"></i></a></li>
  1029. <li><a href="/" title="threads"><i class="fas fa-quote-right"></i></a></li>
  1030. <li><a href="/" title="ship"><i class="fas fa-heart"></i></a></li>
  1031. <li><a href="/" title="pinterest"><i class="fab fa-pinterest"></i></a></li>
  1032. </ul>
  1033. </div>
  1034.  
  1035. <img src="https://66.media.tumblr.com/9906b6cd9788c48b7436704e0f917e28/tumblr_inline_pl797hxEVb1rcw8fh_1280.png" style="border-radius:4px; border-left:solid 10px {color:accent2}; border-top:solid 10px {color:accent2}; border-right:solid 10px {color:accent2}; border-bottom:solid 30px {color:accent2}; position:absolute; right:35px; bottom:70px; -webkit-transform:rotate(4deg);">
  1036. <div class="tape7"></div>
  1037.  
  1038. </div>
  1039.  
  1040.  
  1041.  
  1042. <!------ end chara 4 tab ------>
  1043.  
  1044.  
  1045.  
  1046. <!------ begin chara 5 tab ------>
  1047.  
  1048.  
  1049.  
  1050. <div id="chara5tab" class="musecontent">
  1051. <span onclick="this.parentElement.style.display='none'" class="close"> <i class="far fa-plus"></i> </span>
  1052.  
  1053. <div class="bio"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin et massa tellus. Praesent dictum mauris nec quam consectetur, vitae tristique metus rhoncus. Nulla vitae tortor semper mauris lobortis tincidunt in vel justo. Aenean sit amet ligula rhoncus, finibus lacus a, molestie elit. Suspendisse in consequat leo. Nulla porta ante a arcu interdum pulvinar. Aliquam at erat a nisl accumsan auctor. </div>
  1054. <div class="tape6"></div>
  1055.  
  1056. <div class="charanavi">
  1057. <ul class="charanavi">
  1058. <li><a href="/" title="tag"><i class="fas fa-hashtag"></i></a></li>
  1059. <li><a href="/" title="threads"><i class="fas fa-quote-right"></i></a></li>
  1060. <li><a href="/" title="ship"><i class="fas fa-heart"></i></a></li>
  1061. <li><a href="/" title="pinterest"><i class="fab fa-pinterest"></i></a></li>
  1062. </ul>
  1063. </div>
  1064.  
  1065. <img src="https://66.media.tumblr.com/9906b6cd9788c48b7436704e0f917e28/tumblr_inline_pl797hxEVb1rcw8fh_1280.png" style="border-radius:4px; border-left:solid 10px {color:accent2}; border-top:solid 10px {color:accent2}; border-right:solid 10px {color:accent2}; border-bottom:solid 30px {color:accent2}; position:absolute; right:35px; bottom:70px; -webkit-transform:rotate(4deg);">
  1066. <div class="tape7"></div>
  1067.  
  1068. </div>
  1069.  
  1070.  
  1071.  
  1072. <!------ end chara 5 tab ------>
  1073.  
  1074.  
  1075.  
  1076. <!------ begin chara 6 tab ------>
  1077.  
  1078.  
  1079.  
  1080. <div id="chara6tab" class="musecontent">
  1081. <span onclick="this.parentElement.style.display='none'" class="close"> <i class="far fa-plus"></i> </span>
  1082.  
  1083. <div class="bio"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin et massa tellus. Praesent dictum mauris nec quam consectetur, vitae tristique metus rhoncus. Nulla vitae tortor semper mauris lobortis tincidunt in vel justo. Aenean sit amet ligula rhoncus, finibus lacus a, molestie elit. Suspendisse in consequat leo. Nulla porta ante a arcu interdum pulvinar. Aliquam at erat a nisl accumsan auctor. </div>
  1084. <div class="tape6"></div>
  1085.  
  1086. <div class="charanavi">
  1087. <ul class="charanavi">
  1088. <li><a href="/" title="tag"><i class="fas fa-hashtag"></i></a></li>
  1089. <li><a href="/" title="threads"><i class="fas fa-quote-right"></i></a></li>
  1090. <li><a href="/" title="ship"><i class="fas fa-heart"></i></a></li>
  1091. <li><a href="/" title="pinterest"><i class="fab fa-pinterest"></i></a></li>
  1092. </ul>
  1093. </div>
  1094.  
  1095. <img src="https://66.media.tumblr.com/9906b6cd9788c48b7436704e0f917e28/tumblr_inline_pl797hxEVb1rcw8fh_1280.png" style="border-radius:4px; border-left:solid 10px {color:accent2}; border-top:solid 10px {color:accent2}; border-right:solid 10px {color:accent2}; border-bottom:solid 30px {color:accent2}; position:absolute; right:35px; bottom:70px; -webkit-transform:rotate(4deg);">
  1096. <div class="tape7"></div>
  1097.  
  1098. </div>
  1099.  
  1100.  
  1101.  
  1102. <!------ end chara 6 tab ------>
  1103.  
  1104.  
  1105. <!------ begin chara 7 tab ------>
  1106.  
  1107.  
  1108.  
  1109. <div id="chara7tab" class="musecontent">
  1110. <span onclick="this.parentElement.style.display='none'" class="close"> <i class="far fa-plus"></i> </span>
  1111.  
  1112. <div class="bio"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin et massa tellus. Praesent dictum mauris nec quam consectetur, vitae tristique metus rhoncus. Nulla vitae tortor semper mauris lobortis tincidunt in vel justo. Aenean sit amet ligula rhoncus, finibus lacus a, molestie elit. Suspendisse in consequat leo. Nulla porta ante a arcu interdum pulvinar. Aliquam at erat a nisl accumsan auctor. </div>
  1113. <div class="tape6"></div>
  1114.  
  1115. <div class="charanavi">
  1116. <ul class="charanavi">
  1117. <li><a href="/" title="tag"><i class="fas fa-hashtag"></i></a></li>
  1118. <li><a href="/" title="threads"><i class="fas fa-quote-right"></i></a></li>
  1119. <li><a href="/" title="ship"><i class="fas fa-heart"></i></a></li>
  1120. <li><a href="/" title="pinterest"><i class="fab fa-pinterest"></i></a></li>
  1121. </ul>
  1122. </div>
  1123.  
  1124. <img src="https://66.media.tumblr.com/9906b6cd9788c48b7436704e0f917e28/tumblr_inline_pl797hxEVb1rcw8fh_1280.png" style="border-radius:4px; border-left:solid 10px {color:accent2}; border-top:solid 10px {color:accent2}; border-right:solid 10px {color:accent2}; border-bottom:solid 30px {color:accent2}; position:absolute; right:35px; bottom:70px; -webkit-transform:rotate(4deg);">
  1125. <div class="tape7"></div>
  1126.  
  1127. </div>
  1128.  
  1129.  
  1130.  
  1131. <!------ end chara 7 tab ------>
  1132.  
  1133.  
  1134.  
  1135. <!------ begin chara 8 tab ------>
  1136.  
  1137.  
  1138.  
  1139. <div id="chara8tab" class="musecontent">
  1140. <span onclick="this.parentElement.style.display='none'" class="close"> <i class="far fa-plus"></i> </span>
  1141.  
  1142. <div class="bio"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin et massa tellus. Praesent dictum mauris nec quam consectetur, vitae tristique metus rhoncus. Nulla vitae tortor semper mauris lobortis tincidunt in vel justo. Aenean sit amet ligula rhoncus, finibus lacus a, molestie elit. Suspendisse in consequat leo. Nulla porta ante a arcu interdum pulvinar. Aliquam at erat a nisl accumsan auctor. </div>
  1143. <div class="tape6"></div>
  1144.  
  1145. <div class="charanavi">
  1146. <ul class="charanavi">
  1147. <li><a href="/" title="tag"><i class="fas fa-hashtag"></i></a></li>
  1148. <li><a href="/" title="threads"><i class="fas fa-quote-right"></i></a></li>
  1149. <li><a href="/" title="ship"><i class="fas fa-heart"></i></a></li>
  1150. <li><a href="/" title="pinterest"><i class="fab fa-pinterest"></i></a></li>
  1151. </ul>
  1152. </div>
  1153.  
  1154. <img src="https://66.media.tumblr.com/9906b6cd9788c48b7436704e0f917e28/tumblr_inline_pl797hxEVb1rcw8fh_1280.png" style="border-radius:4px; border-left:solid 10px {color:accent2}; border-top:solid 10px {color:accent2}; border-right:solid 10px {color:accent2}; border-bottom:solid 30px {color:accent2}; position:absolute; right:35px; bottom:70px; -webkit-transform:rotate(4deg);">
  1155. <div class="tape7"></div>
  1156.  
  1157. </div>
  1158.  
  1159.  
  1160.  
  1161. <!------ end chara 8 tab ------>
  1162.  
  1163.  
  1164.  
  1165. <!------ begin chara 9 tab ------>
  1166.  
  1167.  
  1168.  
  1169. <div id="chara9tab" class="musecontent">
  1170. <span onclick="this.parentElement.style.display='none'" class="close"> <i class="far fa-plus"></i> </span>
  1171.  
  1172. <div class="bio"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin et massa tellus. Praesent dictum mauris nec quam consectetur, vitae tristique metus rhoncus. Nulla vitae tortor semper mauris lobortis tincidunt in vel justo. Aenean sit amet ligula rhoncus, finibus lacus a, molestie elit. Suspendisse in consequat leo. Nulla porta ante a arcu interdum pulvinar. Aliquam at erat a nisl accumsan auctor. </div>
  1173. <div class="tape6"></div>
  1174.  
  1175. <div class="charanavi">
  1176. <ul class="charanavi">
  1177. <li><a href="/" title="tag"><i class="fas fa-hashtag"></i></a></li>
  1178. <li><a href="/" title="threads"><i class="fas fa-quote-right"></i></a></li>
  1179. <li><a href="/" title="ship"><i class="fas fa-heart"></i></a></li>
  1180. <li><a href="/" title="pinterest"><i class="fab fa-pinterest"></i></a></li>
  1181. </ul>
  1182. </div>
  1183.  
  1184. <img src="https://66.media.tumblr.com/9906b6cd9788c48b7436704e0f917e28/tumblr_inline_pl797hxEVb1rcw8fh_1280.png" style="border-radius:4px; border-left:solid 10px {color:accent2}; border-top:solid 10px {color:accent2}; border-right:solid 10px {color:accent2}; border-bottom:solid 30px {color:accent2}; position:absolute; right:35px; bottom:70px; -webkit-transform:rotate(4deg);">
  1185. <div class="tape7"></div>
  1186.  
  1187. </div>
  1188.  
  1189.  
  1190.  
  1191. <!------ end chara 9 tab ------>
  1192.  
  1193.  
  1194.  
  1195. <!------ begin chara 10 tab ------>
  1196.  
  1197.  
  1198.  
  1199. <div id="chara10tab" class="musecontent">
  1200. <span onclick="this.parentElement.style.display='none'" class="close"> <i class="far fa-plus"></i> </span>
  1201.  
  1202. <div class="bio"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin et massa tellus. Praesent dictum mauris nec quam consectetur, vitae tristique metus rhoncus. Nulla vitae tortor semper mauris lobortis tincidunt in vel justo. Aenean sit amet ligula rhoncus, finibus lacus a, molestie elit. Suspendisse in consequat leo. Nulla porta ante a arcu interdum pulvinar. Aliquam at erat a nisl accumsan auctor. </div>
  1203. <div class="tape6"></div>
  1204.  
  1205. <div class="charanavi">
  1206. <ul class="charanavi">
  1207. <li><a href="/" title="tag"><i class="fas fa-hashtag"></i></a></li>
  1208. <li><a href="/" title="threads"><i class="fas fa-quote-right"></i></a></li>
  1209. <li><a href="/" title="ship"><i class="fas fa-heart"></i></a></li>
  1210. <li><a href="/" title="pinterest"><i class="fab fa-pinterest"></i></a></li>
  1211. </ul>
  1212. </div>
  1213.  
  1214. <img src="https://66.media.tumblr.com/9906b6cd9788c48b7436704e0f917e28/tumblr_inline_pl797hxEVb1rcw8fh_1280.png" style="border-radius:4px; border-left:solid 10px {color:accent2}; border-top:solid 10px {color:accent2}; border-right:solid 10px {color:accent2}; border-bottom:solid 30px {color:accent2}; position:absolute; right:35px; bottom:70px; -webkit-transform:rotate(4deg);">
  1215. <div class="tape7"></div>
  1216.  
  1217. </div>
  1218.  
  1219.  
  1220.  
  1221. <!------ end chara 10 tab ------>
  1222.  
  1223.  
  1224.  
  1225. <!------ begin chara 11 tab ------>
  1226.  
  1227.  
  1228.  
  1229. <div id="chara11tab" class="musecontent">
  1230. <span onclick="this.parentElement.style.display='none'" class="close"> <i class="far fa-plus"></i> </span>
  1231.  
  1232. <div class="bio"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin et massa tellus. Praesent dictum mauris nec quam consectetur, vitae tristique metus rhoncus. Nulla vitae tortor semper mauris lobortis tincidunt in vel justo. Aenean sit amet ligula rhoncus, finibus lacus a, molestie elit. Suspendisse in consequat leo. Nulla porta ante a arcu interdum pulvinar. Aliquam at erat a nisl accumsan auctor. </div>
  1233. <div class="tape6"></div>
  1234.  
  1235. <div class="charanavi">
  1236. <ul class="charanavi">
  1237. <li><a href="/" title="tag"><i class="fas fa-hashtag"></i></a></li>
  1238. <li><a href="/" title="threads"><i class="fas fa-quote-right"></i></a></li>
  1239. <li><a href="/" title="ship"><i class="fas fa-heart"></i></a></li>
  1240. <li><a href="/" title="pinterest"><i class="fab fa-pinterest"></i></a></li>
  1241. </ul>
  1242. </div>
  1243.  
  1244. <img src="https://66.media.tumblr.com/9906b6cd9788c48b7436704e0f917e28/tumblr_inline_pl797hxEVb1rcw8fh_1280.png" style="border-radius:4px; border-left:solid 10px {color:accent2}; border-top:solid 10px {color:accent2}; border-right:solid 10px {color:accent2}; border-bottom:solid 30px {color:accent2}; position:absolute; right:35px; bottom:70px; -webkit-transform:rotate(4deg);">
  1245. <div class="tape7"></div>
  1246.  
  1247. </div>
  1248.  
  1249.  
  1250.  
  1251. <!------ end chara 11 tab ------>
  1252.  
  1253.  
  1254.  
  1255. <!------ begin chara 12 tab ------>
  1256.  
  1257.  
  1258.  
  1259. <div id="chara12tab" class="musecontent">
  1260. <span onclick="this.parentElement.style.display='none'" class="close"> <i class="far fa-plus"></i> </span>
  1261.  
  1262. <div class="bio"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin et massa tellus. Praesent dictum mauris nec quam consectetur, vitae tristique metus rhoncus. Nulla vitae tortor semper mauris lobortis tincidunt in vel justo. Aenean sit amet ligula rhoncus, finibus lacus a, molestie elit. Suspendisse in consequat leo. Nulla porta ante a arcu interdum pulvinar. Aliquam at erat a nisl accumsan auctor. </div>
  1263. <div class="tape6"></div>
  1264.  
  1265. <div class="charanavi">
  1266. <ul class="charanavi">
  1267. <li><a href="/" title="tag"><i class="fas fa-hashtag"></i></a></li>
  1268. <li><a href="/" title="threads"><i class="fas fa-quote-right"></i></a></li>
  1269. <li><a href="/" title="ship"><i class="fas fa-heart"></i></a></li>
  1270. <li><a href="/" title="pinterest"><i class="fab fa-pinterest"></i></a></li>
  1271. </ul>
  1272. </div>
  1273.  
  1274. <img src="https://66.media.tumblr.com/9906b6cd9788c48b7436704e0f917e28/tumblr_inline_pl797hxEVb1rcw8fh_1280.png" style="border-radius:4px; border-left:solid 10px {color:accent2}; border-top:solid 10px {color:accent2}; border-right:solid 10px {color:accent2}; border-bottom:solid 30px {color:accent2}; position:absolute; right:35px; bottom:70px; -webkit-transform:rotate(4deg);">
  1275. <div class="tape7"></div>
  1276.  
  1277. </div>
  1278.  
  1279.  
  1280.  
  1281. <!------ end chara 12 tab ------>
  1282.  
  1283.  
  1284.  
  1285.  
  1286. <div id="entries">
  1287. {block:posts}
  1288. <!-- {block:NoRebloggedFrom}
  1289. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  1290. {/block:NoRebloggedFrom} -->
  1291. {block:ContentSource}<!-- {SourceURL}
  1292. {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{Sourcetitle}" />{/block:SourceLogo}
  1293. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1294. {/block:ContentSource}
  1295. <div id="post">
  1296.  
  1297. {block:Text}
  1298. {block:title}<h3>{title}</h3>{/block:title}
  1299. <div class="textbody">{Body}</div>{/block:Text}
  1300.  
  1301. {block:Photo}<center><img src="{PhotoURL-400}"/></center>{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  1302.  
  1303. {block:Photoset}<center>{Photoset}</center>{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  1304.  
  1305. {block:Quote}<h2>{Quote}</h2><br>
  1306. {block:Source}<div class="qsource"> — {Source}</div>
  1307. {/block:Source}{/block:Quote}
  1308.  
  1309. {block:Link}<h3><a href="{URL}" {Target}>{Name}</a></h3>{block:Description}{Description}{/block:Description}{/block:Link}
  1310.  
  1311. {block:Chat}{block:title}<h3>{title}</h3>{/block:title}<br>{block:Lines}{block:Label}<b>{Label}</b>{/block:Label} {Line}<br>{/block:Lines}{/block:Chat}
  1312.  
  1313. {block:Audio}{block:AlbumArt}<img src="{AlbumArtURL}" align="left" class="cover" />{/block:AlbumArt}<div class="playerborderer"><div class="player">{block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}</div></div><div class="audioinfo">{block:TrackName}<h1>{TrackName}</h1>{/block:TrackName}{block:Artist}— {Artist} —{/block:Artist}</div>{/block:Audio}<br>
  1314.  
  1315. {block:Video}<div class="video">{Video-400}</div>{block:Caption}{Caption}{/block:Caption}{/block:Video}
  1316.  
  1317. {block:Answer}<div id="question">{Question}</div><div id="asker"><b><i>{Asker}</i></b><br></div>{Answer}{/block:Answer}
  1318.  
  1319. <div id="info">
  1320. <div style="float:left; padding:0px 6px 0px 6px; font-family:coco; font-weight:600; font-size:10px; background:{color:postbg}; border-radius:4px;"><a href="{Permalink}" title="{TimeAgo}">{ShortMonth}{DayOfMonthWithZero}</a></div>
  1321. <div style="float:right; padding:0px 6px 0px 6px; font-family:coco; font-weight:600; font-size:10px; background:{color:postbg}; border-radius:4px;"> <a href="{ReblogURL}" target="_blank" class="details">REBLOG</span></a></span></div>{/block:NoteCount}
  1322. <div style="float:right; margin-right:5px; padding:0px 6px 0px 6px; font-family:coco; font-weight:600; font-size:10px; background:{color:postbg}; border-radius:4px;"> <a href="{Permalink}" title="{TimeAgo}">{NoteCount}N</a>&nbsp;</div></div>
  1323.  
  1324.  
  1325. {block:HasTags}<div id="tags">
  1326.  
  1327. {block:Tags}<i class="far fa-tag"></i> <a href="/tagged/{Tag}">{Tag}</a>&nbsp;&nbsp;{/block:Tags}
  1328. </div>{block:HasTags}
  1329. </div>
  1330. {/block:Posts}
  1331. <br><br>{block:PostNotes}<div id="notes"><left>{PostNotes}</div>{/block:PostNotes}
  1332. {/block:Posts}
  1333.  
  1334. <div id="pagination">{block:Pagination}{block:PreviousPage}<a href="{PreviousPage}">BACK</a>{/block:PreviousPage} {block:NextPage}<a href="{NextPage}">NEXT</a><br />{/block:NextPage}{/block:Pagination}</div>
  1335.  
  1336. </div></div>
  1337. </div>
  1338.  
  1339. <div id="huney"><ul class="huney"><li><a href="https://streamkai.tumblr.com" title="code by ally"><i class="far fa-cloud"></i></a></li></ul></div>
  1340. </div>
  1341.  
  1342.  
  1343.  
  1344. <!-- begin scripts ————— DO NOT DELETE! -->
  1345.  
  1346.  
  1347.  
  1348. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  1349. <script>
  1350. $(document).ready(function(){
  1351. $('.video iframe').each(function(){
  1352. var scale = $(this).parents('.video').width() / 400;
  1353. $(this).attr({
  1354. width: Math.floor($(this).attr('width') * scale),
  1355. height: Math.floor($(this).attr('height') * scale)
  1356. });
  1357. });
  1358. });
  1359. </script>
  1360.  
  1361.  
  1362. <!-- TABS/ALL-INN-ONE SCRIPTS DO NOT REMOVE!!! -->
  1363.  
  1364. <script>
  1365. $(document).ready(function() {
  1366. $('.tabs .tab-links a').on('click', function(e) {
  1367. var currentAttrValue = $(this).attr('href');
  1368.  
  1369. // Show/Hide Tabs
  1370. $('.tabs ' + currentAttrValue).fadeIn(600).siblings().hide();
  1371.  
  1372. // Change/remove current tab to active
  1373. $(this).parent('li').addClass('active').siblings().removeClass('active');
  1374.  
  1375. e.preventDefault();
  1376. });
  1377. });
  1378. </script>
  1379.  
  1380. <script>
  1381. $(document).ready(function() {
  1382. $('#filterOptions li a').click(function() {
  1383. // fetch the class of the clicked item
  1384. var ourClass = $(this).attr('class');
  1385.  
  1386. // reset the active class on all the buttons
  1387. $('#filterOptions li').removeClass('active');
  1388. // update the active state on our clicked button
  1389. $(this).parent().addClass('active');
  1390.  
  1391. if(ourClass == 'all') {
  1392. // show all our items
  1393. $('#ourHolder').children('div.item').show();
  1394. }
  1395. else {
  1396. // hide all elements that don't share ourClass
  1397. $('#ourHolder').children('div:not(.' + ourClass + ')').hide();
  1398. // show all elements that do share ourClass
  1399. $('#ourHolder').children('div.' + ourClass).show();
  1400. }
  1401. return false;
  1402. });
  1403. });
  1404. </script>
  1405.  
  1406.  
  1407. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!