API tools faq
paste
lovesjoon

THEME 07: JUNGKOOK ( 2 big graphs )

lovesjoon
Oct 23rd, 2020 (edited)
328
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 41.35 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5.  
  6.  
  7.  
  8.  
  9.  
  10.  
  11.  
  12.  
  13. <!--- ♡ THEME: 07 - JUNGKOOK (26,98%) by TWENTYS (rmon). ♡
  14.  
  15.  
  16. ♡ READ ME ♡
  17.  
  18.  
  19. + base code by @borntobewildcodes, edited by twentys
  20.  
  21. + updated post styling by @hixtapes, tysm love you lots juju !!! <3
  22.  
  23. + pretty please dont recreate / steal parts of this code / remove credit
  24.  
  25. + feel free to reach out if there are any bugs or questions ♡
  26.  
  27.  
  28. hope you enjoy this code !! ♡( ◡‿◡ ) --->
  29.  
  30.  
  31.  
  32.  
  33.  
  34.  
  35.  
  36.  
  37. <title>{Title}</title>
  38. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  39. <link rel="shortcut icon" href="{Favicon}">
  40. {block:Description}
  41. <meta name="description" content="{MetaDescription}">
  42. {/block:Description}
  43.  
  44.  
  45.  
  46.  
  47. <meta name="image:background" content="1"/>
  48. <meta name="image:graphic" content="1"/>
  49. <meta name="image:graphic2" content="https://via.placeholder.com/260x220"/>
  50. <meta name="image:icon1" content="1"/>
  51. <meta name="image:icon2" content="1"/>
  52. <meta name="image:icon3" content="1"/>
  53. <meta name="image:icon4" content="1"/>
  54. <meta name="image:navi" content="1"/>
  55. <meta name="image:navi icon" content="1"/>
  56.  
  57. <meta name="color:background" content="#0f0f0f"/>
  58. <meta name="color:container" content="#181818"/>
  59. <meta name="color:posts" content="#181818"/>
  60. <meta name="color:borders" content="#363636"/>
  61. <meta name="color:shadow" content="#0f0f0f"/>
  62. <meta name="color:accent" content="#d0b695"/>
  63. <meta name="color:accent2" content="#dcdcdc"/>
  64. <meta name="color:text" content="#acacac"/>
  65. <meta name="color:links" content="#b99680"/>
  66. <meta name="color:hover" content="#fff"/>
  67. <meta name="color:bold" content="#e0e0e0"/>
  68. <meta name="color:italic" content="#98a3a9"/>
  69.  
  70. <meta name="if:400px posts" content="1"/>
  71. <meta name="if:muse tab" content="1" />
  72.  
  73. <meta name="text:ask icon hover" content="have a great day &#9825;"/>
  74. <meta name="text:optional link" content="link."/>
  75. <meta name="text:optional link url" content="link url"/>
  76. <meta name="text:alias" content="penned by name"/>
  77. <meta name="text:error 404" content="error 404_not found"/>
  78.  
  79. <meta name="text:username" content="koocore_97"/>
  80. <meta name="text:detail1" content="<b>A0125:</b> piercings."/>
  81. <meta name="text:detail2" content="<b>C0426:</b> bucket hat."/>
  82. <meta name="text:detail3" content="<b>C0925:</b> balenciaga."/>
  83. <meta name="text:detail4" content="<b>A0558:</b> tattoos."/>
  84.  
  85. <meta name="text:link1" content="/"/>
  86. <meta name="text:link1title" content="hover title"/>
  87. <meta name="text:link2" content="/"/>
  88. <meta name="text:link2title" content="hover title"/>
  89. <meta name="text:link3" content="/"/>
  90. <meta name="text:link3title" content="hover title"/>
  91. <meta name="text:link4" content="/"/>
  92. <meta name="text:link4title" content="hover title"/>
  93. <meta name="text:link5" content="/"/>
  94. <meta name="text:link5title" content="hover title"/>
  95. <meta name="text:link6" content="/"/>
  96. <meta name="text:link6title" content="hover title"/>
  97.  
  98. <meta name="text:navi" content="Aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris. Aliquam mattis porta urna. Maecenas dui neque, rhoncus sed, vehicula vitae, auctor at, nisi."/>
  99.  
  100.  
  101.  
  102.  
  103. <!--- PT. 1: SCRIPTS: JQUERY + TOOLTIP + TABS + FONTS ---->
  104.  
  105.  
  106.  
  107.  
  108. <!--- JQUERY SCRIPTS --->
  109.  
  110. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  111. <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.4.1.min.js"></script>
  112.  
  113.  
  114.  
  115. <!--- TOOLTIP SCRIPT ---->
  116.  
  117. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  118. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  119. <script> (function($){ $(document).ready(function(){ $("a[title]").style_my_tooltips({ tip_follows_cursor:true, tip_delay_time:50, tip_fade_speed:600, attribute:"title" }); }); })(jQuery); </script>
  120.  
  121.  
  122.  
  123. <!--- GOOGLE + ICON FONTS ---->
  124.  
  125. <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.11.2/css/all.css">
  126. <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.11.2/css/v4-shims.css">
  127.  
  128. <link href="//solrainha.github.io/honeybee/honeybee.css" rel="stylesheet">
  129.  
  130. <script src="https://unpkg.com/feather-icons"></script>
  131.  
  132. <link href="https://fonts.googleapis.com/css2?family=Lato&family=Merriweather:ital@1&family=Open+Sans&display=swap" rel="stylesheet">
  133.  
  134. <link href="https://fonts.googleapis.com/css2?family=Julius+Sans+One&display=swap" rel="stylesheet">
  135.  
  136. <link href="css/hover.css" rel="stylesheet" media="all">
  137.  
  138.  
  139.  
  140.  
  141. <!--- VIDEO SCRIPT BY SHYTHEMES ---->
  142.  
  143. <script> $(document).ready(function(){ $('.video iframe').each(function(){ var scale = $(this).parents('.video').width() / 500; $(this).attr({ width: Math.floor($(this).attr('width') * scale), height: Math.floor($(this).attr('height') * scale) });});}); </script>
  144.  
  145.  
  146.  
  147.  
  148. <!--- TAB SCRIPT ---->
  149.  
  150. <script> function openCity(evt, cityName) { var i, tabcontent, tablinks; tabcontent = document.getElementsByClassName("tabcontent"); for (i = 0; i < tabcontent.length; i++) { tabcontent[i].style.display = "none"; } tablinks = document.getElementsByClassName("tablinks"); for (i = 0; i < tablinks.length; i++) { tablinks[i].className = tablinks[i].className.replace(" active", ""); } document.getElementById(cityName).style.display = "block"; evt.currentTarget.className += " active"; } </script>
  151.  
  152.  
  153.  
  154.  
  155. <!--- CLOCK SCRIPT ---->
  156.  
  157. <script> function startTime() { var today = new Date(); var h = today.getHours(); var m = today.getMinutes(); var s = today.getSeconds(); m = checkTime(m); s = checkTime(s); document.getElementById('txt').innerHTML = h + ":" + m + ":" + s; var t = setTimeout(startTime, 500); } function checkTime(i) { if (i < 10) {i = "0" + i}; return i; } </script>
  158.  
  159.  
  160.  
  161.  
  162. <style type="text/css">
  163.  
  164.  
  165.  
  166.  
  167. /*--- FONTS HOSTED BY TWENTYS ---*/
  168.  
  169. @font-face{ font-family:"joystix"; src: url('https://dl.dropboxusercontent.com/s/vatvxdzc0oevq0n/joystix%20monospace.ttf’)'); }
  170.  
  171.  
  172.  
  173.  
  174. /*---PT. 2: TOOLTIP + SCROLLBAR + SELECTION---*/
  175.  
  176.  
  177.  
  178.  
  179. /*TOOLTIP*/
  180.  
  181. #s-m-t-tooltip { max-width:auto; max-height:auto; background:{color:posts}; color:{color:text}; margin:20px 20px 20px 20px; padding:6px 10px 6px 10px; border:1px solid {color:borders}; border-radius:5px; z-index:9999999999; font-family:"lato"; font-size:8px; font-weight:bold; text-transform:uppercase; font-weight:bold; letter-spacing:1px; }
  182.  
  183.  
  184. /*SCROLLBAR*/
  185.  
  186. ::-webkit-scrollbar-thumb { display:none; }
  187.  
  188. ::-webkit-scrollbar { display:none; }
  189.  
  190.  
  191. /*SELECTION*/
  192.  
  193. ::-moz-selection { background:{color:accent}; color:{color:posts}; }
  194.  
  195. ::selection { background:{color:accent}; color:{color:posts}; }
  196.  
  197.  
  198.  
  199.  
  200. /*---PT. 3: BODY + TEXT STYLING---*/
  201.  
  202.  
  203.  
  204.  
  205. /*BODY*/
  206.  
  207. body { width:100%; height:100%; background:{color:background}; background-image:url({image:background}); background-attachment:fixed; background-repeat:repeat; color:{color:text}; margin:0; padding:0; font-family:'open sans', sans-serif; font-size:10px; line-height:20px; {block:if400pxPosts} font-size:12px; {/block:if400pxPosts} }
  208.  
  209.  
  210. /*FIX*/
  211.  
  212. iframe, img, embed, object { max-width:100%; margin:auto; border:none; }
  213.  
  214. img { max-width:100%; height:auto; margin:auto; border:none; }
  215.  
  216.  
  217. /*TEXT STYLING*/
  218.  
  219. select, textarea, input, a { outline:none; }
  220.  
  221. p { margin-top:5px; margin-bottom:5px; }
  222.  
  223. small, sub, sup { font-size:100%; }
  224.  
  225. big { font-size:110%; }
  226.  
  227. h1 { background:transparent; color:{color:accent2}; margin-top:20px; font-family:'merriweather', serif; font-size:25px; text-transform:lowercase; text-align:center; line-height:28px; letter-spacing:1px; }
  228.  
  229. h2 { color:{color:accent}; font-family:'lato', sans-serif; font-size:12px; text-transform:uppercase; text-align:center; line-height:18px; letter-spacing:2px; }
  230.  
  231. a { color:{color:links}; font-family:'lato', sans-serif; font-size:9px; font-weight:bold; text-transform:uppercase; text-decoration:none; letter-spacing:1px; }
  232.  
  233. a:hover { color:{color:hover};
  234.  
  235. -webkit-transition: all .3s;
  236. -moz-transition: all .3s;
  237. -o-transition: all .3s;
  238. -ms-transition: all .3s;
  239. transition: all .3s; }
  240.  
  241. ul, ol, li { margin:5px 10px; padding:0px; line-height:20px; }
  242.  
  243. b, strong { color:{color:bold}; }
  244.  
  245. i, em { color:{color:italic}; }
  246.  
  247. blockquote { margin:10px; padding-left:20px; border-left:1px solid {color:borders}; }
  248.  
  249.  
  250. /*TUMBLR CONTROLS*/
  251.  
  252. iframe.tmblr-iframe { top:0px!important; right:0px!important; opacity:0.8; transform:scale(0.6); transform-origin:100% 0; -webkit-transform:scale(0.8); -webkit-transform-origin:100% 0; -o-transform:scale(0.8); -o-transform-origin:100% 0; -moz-transform:scale(0.8); -moz-transform-origin:100% 0; -ms-transform:scale(0.8); -ms-transform-origin:100% 0; z-index:100000!important; }
  253.  
  254. iframe.tmblr-iframe:hover { opacity:1!important; }
  255.  
  256.  
  257.  
  258.  
  259. /*--- PT. 4: CONTAINER + SIDEBAR ---*/
  260.  
  261.  
  262.  
  263.  
  264. /*CONTAINER*/
  265.  
  266. #wrapper { position:absolute; width:1000px; height:560px; top:0px; right:0px; bottom:0px; left:0px; margin:auto; overflow:hidden; }
  267.  
  268. #container { position:absolute; width:850px; height:540px; top:0px; right:0px; bottom:0px; left:0px; margin:auto; background:{color:container}; overflow:hidden; {block:if400pxPosts} width:950px; {/block:if400pxPosts} }}
  269.  
  270. .vertical { position:absolute; width:850px; height:440px; top:50px; left:0px; }
  271.  
  272. .vertical li { width:106px; height:440px; display:inline-block; list-style-type:none; margin:-2px; border-right:1px solid {color:borders}; opacity:.2; }
  273.  
  274.  
  275. /*BAR STYLING*/
  276.  
  277. .bordertop { position:absolute; width:850px; height:50px; top:0px; left:0px; background:{color:container}; border-bottom:1px solid {color:borders}; z-index:999; {block:if400pxPosts} width:950px; {/block:if400pxPosts} }
  278.  
  279. .borderbottom { position:absolute; width:850px; height:50px; bottom:0px; left:0px; background:{color:container}; border-top:1px solid {color:borders}; z-index:999; {block:if400pxPosts} width:950px; {/block:if400pxPosts} }
  280.  
  281.  
  282. /*TOP BAR*/
  283.  
  284. .pagi { position:absolute; width:207px; height:50px; bottom:0px; left:0px; background:{color:container}; border-right:1px solid {color:borders}; z-index:999; line-height:50px; }
  285.  
  286. .topicon { position:absolute; width:101px; height:50px; top:0px; right:0px; background:{color:container}; border-left:1px solid {color:borders}; z-index:999; }
  287.  
  288. .tab { position:absolute; width:502px; height:50px; bottom:0px; left:248px; overflow:hidden; text-align:center; {block:if400pxPosts} width:602px; {/block:if400pxPosts} }
  289.  
  290. .tab li { display:inline-block; margin-right:50px; {block:if400pxPosts} margin-right:60px; {/block:if400pxPosts} }
  291.  
  292. .tab a { width:auto; height:50px; background:transparent; color:{color:accent2}; font-size:10px; line-height:40px; letter-spacing:1px; font-weight:normal; }
  293.  
  294. .tab a:hover { font-style:italic; }
  295.  
  296. .tab a:focus { font-style:italic; }
  297.  
  298.  
  299. /*BOTTOM BAR*/
  300.  
  301. .alias { position:absolute; width:207px; height:50px; bottom:0px; left:0px; background:{color:container}; border-right:1px solid {color:borders}; z-index:999; line-height:50px; font-size:9px; text-transform:uppercase; text-align:center; letter-spacing:1px; color:{color:accent}; font-weight:bold; }
  302.  
  303. .digits { position:absolute; width:217px; height:50px; top:0px; right:0px; padding-top:2px; background:{color:container}; border-left:1px solid {color:borders}; z-index:999; {block:if400pxPosts} font-size:10px; {/block:if400pxPosts} }
  304.  
  305. .bottomtxt { position:absolute; width:426px; height:50px; left:207px; top:0px; color:{color:accent2}; font-family:"joystix"; font-size:11px; letter-spacing:2px; line-height:50px; text-align:center; {block:if400pxPosts} width:526px; {/block:if400pxPosts} }
  306.  
  307. .blinking { animation:blinkingText 2.5s infinite; }
  308.  
  309. @keyframes blinkingText { 0%{color:{color:accent2};} 49%{color:{color:accent2};} 60%{color:transparent;} 99%{color:transparent;} 100%{color:{color:accent2};} }
  310.  
  311. #txt { position:absolute; width:60px; height:15px; top:0px; right:0px; bottom:0px; left:0px; margin:auto; font-size:11px; text-align:center; line-height:15px; }
  312.  
  313. .digi1 { position:absolute; width:60px; height:15px; top:0px; right:110px; bottom:0px; left:0px; margin:auto; line-height:15px; }
  314.  
  315. .digi2 { position:absolute; width:60px; height:15px; top:0px; right:0px; bottom:0px; left:80px; margin:auto; line-height:15px; text-align:right; }
  316.  
  317.  
  318. /*SIDEBAR*/
  319.  
  320. #sidebar { position:absolute; width:490px; height:438px; top:50px; left:0px;}
  321.  
  322. #window1 { position:absolute; width:260px; height:300px; top:0px; left:-70px; bottom:30px; right:40px; margin:auto; background:{color:container}; border:1px solid {color:borders}; z-index:999;
  323.  
  324. -webkit-box-shadow: 10px 10px 16px 0px {color:shadow};
  325. -moz-box-shadow: 10px 10px 16px 0px {color:shadow};
  326. box-shadow: 10px 10px 16px 0px {color:shadow}; }
  327.  
  328. #window1:hover { z-index:9999; }
  329.  
  330. .w1bar { position:absolute; width:230px; height:30px; top:0px; left:0px; padding:0px 15px 0px 15px; background:{color:container}; color:{color:accent}; border-top-left-radius:10px; border-top-right-radius:10px; font-size:13px; font-weight:bold; text-transform:uppercase; border-bottom:1px solid {color:borders}; }
  331.  
  332. .w1bar i { color:{color:accent2}; font-size:13px; }
  333.  
  334. .w1search { position:absolute; width:220px; height:20px; top:45px; left:20px; border-radius:10px; border:1px solid {color:borders}; color:{color:text}; line-height:20px; {block:if400pxPosts} font-size:10px; {/block:if400pxPosts} }
  335.  
  336. .w1search i { color:{color:accent2}; font-size:9px; }
  337.  
  338. .w1body { position:absolute; width:260px; height:220px; bottom:0px; left:0px; }
  339.  
  340. .w1body img { width:260px; height:220px; }
  341.  
  342. #window2 { position:absolute; width:200px; height:220px; bottom:40px; left:235px; background:{color:container}; border:1px solid {color:borders}; z-index:999;
  343.  
  344. -webkit-box-shadow: 10px 10px 16px 0px {color:shadow};
  345. -moz-box-shadow: 10px 10px 16px 0px {color:shadow};
  346. box-shadow: 10px 10px 16px 0px {color:shadow}; }
  347.  
  348. #window2 img { position:absolute; width:200px; height:190px; bottom:0px; left:0px; }
  349.  
  350. .w2bar { position:absolute; width:170px; height:29px; top:0px; left:0px; padding:0px 15px 0px 15px; background:{color:container}; color:{color:accent}; border-top-left-radius:10px; border-top-right-radius:10px; font-size:11px; font-weight:bold; text-transform:uppercase; border-bottom:1px solid {color:borders}; }
  351.  
  352. .w2bar i { color:{color:accent2}; font-size:10px; }
  353.  
  354. .hvr-grow { display:inline-block; vertical-align:middle; transform:translateZ(0); box-shadow:0 0 1px rgba(0, 0, 0, 0); -moz-osx-font-smoothing: grayscale; backface-visibility:hidden; transition-duration:0.3s; transition-property:transform; }
  355.  
  356. .hvr-grow:hover,
  357. .hvr-grow:focus,
  358. .hvr-grow:active { transform: scale(1.1); }
  359.  
  360.  
  361.  
  362.  
  363.  
  364. /*--- PT.5: POSTS + ENTRIES ---*/
  365.  
  366.  
  367.  
  368.  
  369. /*POST CONTAINER*/
  370.  
  371. #postcon { position:absolute; width:400px; height:498px; right:0px; top:0px; margin:auto; {block:if400pxPosts} width:500px; {/block:if400pxPosts} }
  372.  
  373.  
  374. /*POSTS*/
  375.  
  376. #posts { position:absolute; width:360px; height:408px; top:51px; left:20px; padding:20px 0px 10px 0px; z-index:1000; overflow-x:hidden; overflow-y:scroll; {block:if400pxPosts} width:460px; {/block:if400pxPosts} }
  377.  
  378.  
  379. /*ENTRY STYLING*/
  380.  
  381. .entry { width:300px; height:auto; margin:20px; padding:10px 10px 0px 10px; background:{color:posts}; border:1px solid {color:borders}; display:inline-block; overflow:hidden; {block:if400pxPosts} width:400px; {/block:if400pxPosts} }
  382.  
  383. .entry img { margin:0px; padding:0px; }
  384.  
  385.  
  386.  
  387.  
  388. /*--- PT.6: POST INFO + NOTES + PAGINATION + CREDIT---*/
  389.  
  390.  
  391.  
  392.  
  393. /*TOP POST INFO*/
  394.  
  395. .topinfo { width:100%; height:20px; margin-top:0px; margin-bottom:15px; margin-left:-10px; padding: 0px 10px 10px 10px; background:{color:posts}; border-bottom:1px solid {color:borders}; line-height:22px; }
  396.  
  397. .topinfo a { margin-left:5px; color:{color:links}; font-family:'lato', sans-serif; font-size:9px; font-weight:bold; text-transform:uppercase; letter-spacing:1px; }
  398.  
  399. .preblog { width:auto; height:26px; margin-top:0px; margin-right:5px; list-style:none; z-index:100; float:right; line-height:22px; }
  400.  
  401.  
  402. /*BOTTOM POST INFO*/
  403.  
  404. .bottominfo { width:100%; height:auto; min-height:20px; margin-top:15px; margin-left:-10px; padding:10px 15px; background:{color:posts}; color:{color:text}; border-top:1px solid {color:borders}; overflow:hidden; font-size:12px; line-height:22px; }
  405.  
  406. .bottominfo a { color:{color:links}; font-family:'lato', sans-serif; font-size:9px; font-weight:bold; text-transform:uppercase; letter-spacing:1px; }
  407.  
  408. .psource { width:auto; height:25px; margin-top:0px; margin-right:10px; list-style:none; z-index:100; float:right; line-height:22px; }
  409.  
  410.  
  411. /*TAGS*/
  412.  
  413. .tags { {block:IndexPage} width:290px; {block:if400pxPosts} width:390px; {/block:if400pxPosts} margin-top:0px; text-align:justify; line-height:14px; {/block:IndexPage} }
  414.  
  415. .tags a { color:{color:text}; font-family:'lato', sans-serif; font-size:7px; }
  416.  
  417. .tags a:hover { color:{color:hover}; font-weight:bold; }
  418.  
  419.  
  420. /*POST NOTES*/
  421.  
  422. .note c { float:left; }
  423.  
  424. #notes { width:300px; margin:0px; color:{color:text}; font-size:12px; {block:if400pxPosts} width:400px; {/block:if400pxPosts} }
  425.  
  426. ol.notes { margin:0px; padding:0px; list-style-type:none; }
  427.  
  428. ol.notes li.note { margin:0px; padding:10px 0px; border-bottom:1px solid {color:borders}; }
  429.  
  430. ol.notes li.note img.avatar { width:20px; height:20px; margin-right:10px; margin-left:0px; float:left; vertical-align:-5px; }
  431.  
  432. li.more_notes_link_container { font-size: 12px; }
  433.  
  434.  
  435. /*PAGINATION*/
  436.  
  437. .pagination { width:100%; text-align:center; font-size:11px; color:{color:borders}; }
  438.  
  439. .pagination a { padding:8px; word-spacing:2px; font-size:12px; }
  440.  
  441. .pagination a:hover { color:{color:accent}; }
  442.  
  443.  
  444. /*CREDIT*/
  445.  
  446. #cred { position:fixed; width:auto; height:auto; bottom:15px; right:15px; background-color:{color:posts}; border-top-right-radius:10px; border-bottom-left-radius:10px; }
  447.  
  448. #cred span { padding:10px; font-size:18px; background:-webkit-linear-gradient({color:accent}, {color:accent2});
  449.  
  450. -webkit-background-clip:text;
  451. -webkit-text-fill-color:transparent; }
  452.  
  453.  
  454.  
  455.  
  456. /*--- PT.7: POST STYLING ---*/
  457.  
  458.  
  459.  
  460.  
  461. /*CHATS*/
  462.  
  463. .answer span,.convo li { position:relative; max-width:75%; margin:0 0 15px; padding:.9em 10px; border-radius:1em; clear:both; }
  464.  
  465. .answer .them,.user_1,.user_3,.user_5,.user_7,.user_9,.user_11{ left:3px; background:#e6e6e6; color:#555555; float:left; }
  466.  
  467. .me::after,.user_1::after,.user_3::after,.user_5::after,.user_7::after,.user_9::after,.user_11::after{ content:""; position:absolute; width:.5em; height:1em; left:-.5em; bottom:0; border-right:.9em solid #e6e6e6; border-bottom-right-radius:1em .5em; }
  468.  
  469. .answer .me,.user_2,.user_4,.user_6,.user_8,.user_10,.user_12{ right:3px; background-color:#147efb; color:white; float:right; }
  470.  
  471. .them::after,.user_2::after,.user_4::after,.user_6::after,.user_8::after,.user_10::after,.user_12::after{ content:""; position:absolute; width:.5em; height:1em; right:-.5em; bottom:0; border-left:.9em solid #147efb; border-bottom-left-radius:1em .5em; }
  472.  
  473. .me p,.answer,.asked span{ margin:0; padding:0; }
  474.  
  475. .answer{ overflow:hidden; }
  476.  
  477. .asked p { margin:0 0px 10px 0px; padding:0; color:white; font-size:12px; text-align:left; line-height:0px; }
  478.  
  479. .footerright .viasrc { float:left; }
  480.  
  481. .asked a { margin:0; padding:0; }
  482.  
  483. .user_3{ background-color:#e6e6e6; color:#555555; }
  484.  
  485. .user_3::after{ border-color:#e6e6e6; }
  486.  
  487. .user_4{ background-color:#147efb; color:white; }
  488.  
  489. .user_4::after{ border-color:#147efb; }
  490.  
  491. .user_5{ background-color:#e6e6e6; color:#555555; }
  492.  
  493. .user_5::after{ border-color:#e6e6e6; }
  494.  
  495. .user_6{ background-color:#147efb; color:white; }
  496.  
  497. .user_6::after{ border-color:#147efb; }
  498.  
  499. .user_7{ background-color:#e6e6e6; color:#555555; }
  500.  
  501. .user_7::after{ border-color:#e6e6e6; }
  502.  
  503. .user_8{ background-color:#147efb; color:white; }
  504.  
  505. .user_8::after{ border-color:#147efb; }
  506.  
  507. .user_9{ background-color:#e6e6e6; color:#555555; }
  508.  
  509. .user_9::after{ border-color:#e6e6e6; }
  510.  
  511. .convo { margin:0; padding:0; overflow:hidden; list-style-type:none; }
  512.  
  513.  
  514. /*QUOTES*/
  515.  
  516. .quote { margin:10px; padding:5px; color:{color:italic}; font-family:'merriweather', serif; font-size:18px; text-align:center; text-transform:lowercase; line-height:25px; letter-spacing:1px; word-spacing:3px; }
  517.  
  518. .source { font-size:12px; text-align:right; line-height:20px; }
  519.  
  520.  
  521. /*ASKS*/
  522.  
  523. .asker { position:relative; color:{color:container}; font-size:9px; text-transform:lowercase; text-decoration:none; }
  524.  
  525. .asker a { color:{color:container}; font-family:'lato', sans-serif; font-style:italic; text-transform:uppercase; letter-spacing:1px; }
  526.  
  527. .asker b { padding:0px 6px 0px 6px; color:{color:container}; font-family:'lato', sans-serif; font-weight:bold; font-style:italic; text-transform:uppercase; letter-spacing:1px; }
  528.  
  529. .ask { width:247px; {block:if400pxPosts} width:347px; {/block:if400pxPosts} height:auto; margin-left:20px; padding:5px 5px 5px 10px; background:{color:accent}; border-top-left-radius:10px; border-top-right-radius:10px; }
  530.  
  531. .answer { margin:10px; }
  532.  
  533. .bubble { width:210px; {block:if400pxPosts} width:310px; {/block:if400pxPosts} height:auto; margin-top:-10px; margin-left:20px; padding:0px 25px 10px 25px; border:1px solid {color:borders}; border-bottom-left-radius:10px; border-bottom-right-radius:10px; font-family:'lato', sans-serif; font-size:7px; text-transform:uppercase; text-align:justify; letter-spacing:1px; }
  534.  
  535. .bubble span { position:absolute; width:auto; height:auto; margin-top:-5px; margin-left:225px; {block:if400pxPosts} margin-left:325px; {/block:if400pxPosts} background:{color:posts}; font-size:18px; }
  536.  
  537.  
  538. /*LINKS*/
  539.  
  540. .linktitle { margin:0; margin-top:30px; margin-bottom:30px; color:{color:accent2}; font-size:15px; font-weight:normal; text-transform:lowercase; line-height:20px; }
  541.  
  542.  
  543. /*AUDIO*/
  544.  
  545. .playbutton { position:relative; width:33px; height:38px; margin-top:45px; margin-left:30px; overflow:hidden; opacity:0.6; z-index:9; }
  546.  
  547. .albumart img { position:relative; width:65px; height:65px; margin-top:-65px; margin-left:0px; padding:10px; border:1px solid {color:borders}; }
  548.  
  549. .trackinfo { position:relative; width:185px; {block:if400pxPosts} width:285px; {/block:if400pxPosts} height:65px; top:2.5px; margin-top:-95px; margin-bottom:20px; margin-left:100px; padding:10px 5px 10px 5px; background:{color:posts}; color:{color:text}; border:1px solid {color:borders}; }
  550.  
  551. .trackname { position:relative; padding-top:15px; font-size:8px; font-weight:bold; text-transform:uppercase; text-align:center; line-height:12px; letter-spacing:2px; }
  552.  
  553. .artist { font-size:7.5px; text-transform:uppercase; text-align:center; letter-spacing:4px; }
  554.  
  555.  
  556. /*VIDEOS*/
  557.  
  558. .tumblr_video_container { width:auto!important; height:auto!important; }
  559.  
  560.  
  561.  
  562.  
  563. /*--- PT.8: TABS ---*/
  564.  
  565.  
  566.  
  567.  
  568. /*TAB + CLOSE CONTENT*/
  569.  
  570. .tabcontent { position:absolute; width:850px; {block:if400pxPosts} width:950px; {/block:if400pxPosts} height:438px; top:51px; right:0px; background:{color:container}; overflow:hidden; z-index:9999; display:none; animation: fadeEffect 1s; }
  571.  
  572. @keyframes fadeEffect { from {opacity: 0;} to {opacity: 1;} }
  573.  
  574. .close { position:absolute; right:0px; padding:15px 15px; color:{color:links}; z-index:999999; font-size:11px; }
  575.  
  576. .close:hover { cursor:pointer; }
  577.  
  578.  
  579.  
  580. /*NAVI TAB*/
  581.  
  582. #nbox1 { position:absolute; width:420px; height:250px; top:0px; left:0px; bottom:0px; right:0px; margin:auto; background:{color:container}; border:1px solid {color:borders};
  583.  
  584. -webkit-box-shadow: 10px 10px 16px 0px {color:shadow};
  585. -moz-box-shadow: 10px 10px 16px 0px {color:shadow};
  586. box-shadow: 10px 10px 16px 0px {color:shadow}; }
  587.  
  588. #nbox1 img { width:420px; height:220px; bottom:0px; left:0px; margin-top:30px; }
  589.  
  590. .nb1bar { position:absolute; width:390px; height:30px; top:0px; left:0px; padding:0px 15px 0px 15px; background:{color:container}; color:{color:accent}; border-top-left-radius:10px; border-top-right-radius:10px; font-size:13px; font-weight:bold; text-transform:uppercase; border-bottom:1px solid {color:borders}; }
  591.  
  592. .nb1bar i { color:{color:accent2}; font-size:13px; }
  593.  
  594. #nbox2 { position:absolute; width:230px; height:160px; left:80px; bottom:50px; background:{color:container}; border:1px solid {color:borders};
  595.  
  596. -webkit-box-shadow: 10px 10px 16px 0px {color:shadow};
  597. -moz-box-shadow: 10px 10px 16px 0px {color:shadow};
  598. box-shadow: 10px 10px 16px 0px {color:shadow}; }
  599.  
  600. .nb2bar { position:absolute; width:200px; height:30px; top:0px; left:0px; padding:0px 15px 0px 15px; background:{color:container}; color:{color:accent}; border-top-left-radius:10px; border-top-right-radius:10px; font-size:13px; font-weight:bold; text-transform:uppercase; border-bottom:1px solid {color:borders}; }
  601.  
  602. .nb2bar i { color:{color:accent2}; font-size:13px }
  603.  
  604. .links { position:absolute; top:48px; left:20px; overflow: hidden; height:auto; word-spacing:10px; width:190px; height:110px; }
  605.  
  606. .links li { display:inline-block; margin:0px; height:40px; width:40px; line-height:40px; margin:5px 10px 5px 10px; float:left; }
  607.  
  608. .links a { text-transform:uppercase; letter-spacing:1px; font-weight:bold; font-family: "lato"; color:{color:container}; background-color:{color:accent2}; letter-spacing:1px; font-style:italic; font-size:9px; padding:13px; border:1px solid {color:borders}; border-radius:5px; text-align:center; }
  609.  
  610. .links a:hover { color:{color:sidebar}; background-color:{color:accent}; border:1px solid {color:accent};
  611.  
  612. -webkit-transition: all 0.8s ease;
  613. -moz-transition: all 0.8s ease;
  614. -o-transition: all 0.8s ease;
  615. -ms-transition: all 0.8s ease;
  616. transition: all 0.8s ease; }
  617.  
  618. #nbox3 { position:absolute; width:100px; height:100px; right:160px; {block:if400pxPosts} right:200px; {/block:if400pxPosts} top:50px; background:{color:container}; border:1px solid {color:borders};
  619.  
  620. -webkit-box-shadow: 10px 10px 16px 0px {color:shadow};
  621. -moz-box-shadow: 10px 10px 16px 0px {color:shadow};
  622. box-shadow: 10px 10px 16px 0px {color:shadow}; }
  623.  
  624. .nb3bar { position:absolute; width:70px; height:29px; top:0px; left:0px; padding:0px 15px 0px 15px; background:{color:container}; color:{color:accent}; text-align:center; letter-spacing:1px; border-bottom:1px solid {color:borders}; {block:if400pxPosts} font-size:10px; {/block:if400pxPosts} }
  625.  
  626. .nb3bar i { color:{color:accent2}; font-size:10px; }
  627.  
  628. .nb3bar img { width:30px; height:70px; margin-top:30px; }
  629.  
  630. .nb3txt { position:absolute; width:100px; height:30px; bottom:5px; left:0px; text-align:center; line-height:15px; {block:if400pxPosts} font-size:10px; {/block:if400pxPosts} }
  631.  
  632. #nbox4 { position:absolute; width:230px; height:90px; right:80px; {block:if400pxPosts} right:120px; {/block:if400pxPosts} bottom:70px; background:{color:container}; border:1px solid {color:borders};
  633.  
  634. -webkit-box-shadow: 10px 10px 16px 0px {color:shadow};
  635. -moz-box-shadow: 10px 10px 16px 0px {color:shadow};
  636. box-shadow: 10px 10px 16px 0px {color:shadow}; }
  637.  
  638. .nb4bar { position:absolute; width:200px; height:30px; top:0px; left:0px; padding:0px 15px 0px 15px; background:{color:container}; color:{color:accent}; text-align:center; letter-spacing:1px; border-bottom:1px solid {color:borders}; }
  639.  
  640. .nb4bar i { color:{color:accent2}; font-size:10px; }
  641.  
  642. .nb4txt { font-size:9px; margin-top:30px; width:200px; height:35px; text-align:center; padding:10px 15px 10px 15px; line-height:20px; overflow:scroll; }
  643.  
  644.  
  645.  
  646. /*MUSE TAB*/
  647.  
  648. #bgmuses { position:absolute; width:790px; height:380px; bottom:20px; right:0px; overflow:scroll; {block:if400pxPosts} right:50px; {/block:if400pxPosts} }
  649.  
  650. .mbox { display:inline-block; width:200px; height:130px; margin:25px 25px 25px 20px; background:{color:container}; float:left; border:1px solid {color:borders}; }
  651.  
  652. .mboxbar { width:170px; height:25px; margin-top:0px; margin-left:0px; padding:0px 15px 0px 15px; background:{color:container}; color:{color:accent}; text-align:center; letter-spacing:1px; {block:if400pxPosts} font-size:10px; {/block:if400pxPosts} }
  653.  
  654. .mbox img { width:200px; height:80px; margin-top:0px; background:black; }
  655.  
  656. .msearch { position:absolute; width:160px; height:20px; margin-top:-20px; margin-left:20px; border-radius:10px; color:{color:container}; background:{color:accent2}; line-height:20px; font-weight:bold; letter-spacing:1px; font-size:8px;
  657.  
  658. -webkit-box-shadow: 10px 10px 16px 0px {color:shadow};
  659. -moz-box-shadow: 10px 10px 16px 0px {color:shadow};
  660. box-shadow: 10px 10px 16px 0px {color:shadow}; }
  661.  
  662. .msearch i { color:{color:container}; font-size:9px; }
  663.  
  664.  
  665.  
  666.  
  667. /*--- PT.9: CUSTOM CSS ---*/
  668.  
  669.  
  670.  
  671.  
  672. {CustomCSS}
  673. </style></head><body onload="startTime()">
  674.  
  675.  
  676. <div id="wrapper">
  677. <div id="container">
  678.  
  679. <div class="bordertop">
  680.  
  681. <div class="pagi"> {block:Pagination} <div class="pagination"> {block:previouspage} <a href="{previouspage}"> return </a> / &nbsp; {/block:previouspage} {block:nextpage} <a href="{nextpage}"> next </a> {/block:nextpage} </div> {/block:pagination} </div>
  682.  
  683. <div class="tab">
  684.  
  685. <li><a href="/"> home. </a></li>
  686. <li><a href="/ask"> message. </a></li>
  687. <li><a href="#" class="tablinks" onclick="openCity(event, 'navi')"> navigation. </a></li>
  688.  
  689. {block:ifmusetab} <li><a href="#" class="tablinks" onclick="openCity(event, 'muses')"> characters. </a></li> {/block:ifmusetab}
  690.  
  691. {block:ifNotmusetab} <li><a href="{text:optional link url}"> {text:optional link} </a></li> {/block:ifNotmusetab} </div>
  692.  
  693.  
  694. <div class="topicon"> <i width="22px" height="22px" style="position:absolute; margin:auto; top:0px; right:0px; bottom:0px; left:0px; color:{color:accent};" data-feather="alert-triangle"></i> </div>
  695.  
  696. </div>
  697.  
  698. <div class="borderbottom">
  699.  
  700. <div class="alias"> {text:alias} </div>
  701.  
  702. <div class="bottomtxt"><span class="blinking"> {text:error 404} </span></div>
  703.  
  704. <div class="digits"> <div class="digi1"> 82% <i width="14px" height="14px" style="position:absolute; padding-left:3px;" data-feather="battery-charging"></i> </div> <div id="txt"> 00:00:00 </div> <div class="digi2"> 25°c <i width="14px" height="14px" style="position:absolute; top:2px; padding-left:5px;" data-feather="cloud-lightning"></i> </div> </div>
  705.  
  706. </div>
  707.  
  708. <div class="vertical">
  709.  
  710. <li> &nbsp; </li><li> &nbsp; </li><li> &nbsp; </li>
  711. <li> &nbsp; </li><li> &nbsp; </li><li> &nbsp; </li>
  712. <li> &nbsp; </li><li> &nbsp; </li><li> &nbsp; </li>
  713.  
  714. </div>
  715.  
  716.  
  717.  
  718.  
  719. <!--- SIDEBAR --->
  720.  
  721.  
  722.  
  723.  
  724. <div id="sidebar">
  725.  
  726. <div id="window1" class="hvr-grow"> <div class="w1bar"> <p style="text-align:left;"> <i class="fas fa-bars"></i> <span style="float:right;"> <i class="fas fa-lock"></i> </p> <p style="margin-top:-25px; text-align:center"> @{text:username}
  727.  
  728. </div> <div class="w1search"> <p style="text-align:left; margin-top:0px; margin-left:8px;"> SEARCH... <span style="float:right; margin-top:-1px; margin-right:8px;"> <i class="fas fa-search"></i> </p></div>
  729.  
  730. <div class="w1body">
  731.  
  732. <img src="{image:graphic2}" draggable="false">
  733.  
  734. </div>
  735. </div>
  736.  
  737. <div id="window2" class="hvr-grow"> <div class="w2bar"> <p style="text-align:left;"> <i class="fas fa-bars"></i> <span style="float:right;"> <i class="fas fa-lock"></i> </p> <p style="margin-top:-25px; text-align:center"> @{text:username} </div> <img src="{image:graphic}" draggable="false">
  738.  
  739.  
  740. </div>
  741. </div>
  742.  
  743.  
  744.  
  745.  
  746. <!--- NAVIGATION TAB --->
  747.  
  748.  
  749.  
  750.  
  751. <div id="navi" class="tabcontent"> <span class="close" onclick="this.parentElement.style.display='none'"> <i data-feather="x" width="15px" height="15px"></i> </span>
  752.  
  753.  
  754. <div id="nbox1"> <div class="nb1bar"> <p style="text-align:left;"> <i class="fas fa-bars"></i> <span style="float:right;"> <i class="fas fa-lock"></i> <p style="margin-top:-25px; text-align:center"> still with you. </p> </div> <img src="{image:navi}" draggable="false"> </div>
  755.  
  756. <div id="nbox2" class="hvr-grow"> <div class="nb2bar"> <p style="text-align:left;"> <i class="fas fa-bars"></i> <span style="float:right;"> <i class="fas fa-lock"></i> <p style="margin-top:-25px; text-align:center"> lost or found ? </p> </div>
  757.  
  758. <div class="links">
  759.  
  760. <li><a href="{text:link1}" title="{text:link1title}">.o1</a></li>
  761. <li><a href="{text:link2}" title="{text:link2title}">.o2</a></li>
  762.  
  763. <li><a href="{text:link3}" title="{text:link3title}">.o3</a></li>
  764. <li><a href="{text:link4}" title="{text:link4title}">.o4</a></li>
  765.  
  766. <li><a href="{text:link5}" title="{text:link5title}">.o5</a></li>
  767. <li><a href="{text:link6}" title="{text:link6title}">.o6</a></li>
  768.  
  769. </div>
  770.  
  771. </div>
  772.  
  773. <div id="nbox3" class="hvr-grow"> <div class="nb3bar"> <p style="text-align:left;"> <i class="fas fa-bars"></i> <span style="float:right;"> <i class="fas fa-lock"></i> <p style="margin-top:-25px; text-align:center; padding-left:10px;"> 0901 </p> </div> <i width="22px" height="22px" style="position:absolute; margin:auto; top:0px; right:0px; bottom:0px; left:0px; color:{color:accent2};" data-feather="wifi-off"></i>
  774.  
  775. <!---- UPDATE YOUR DRAFTS + INBOX HERE !! ---->
  776.  
  777. <div class="nb3txt">
  778.  
  779. <b>inbox:</b> +00. <br>
  780. <b>drafts:</b> +00.
  781.  
  782. </div>
  783. </div>
  784.  
  785.  
  786. <div id="nbox4" class="hvr-grow"> <div class="nb4bar"> <p style="text-align:left;"> <i class="fas fa-bars"></i> <span style="float:right;"> <i class="fas fa-lock"></i> <p style="margin-top:-25px; text-align:center; padding-left:10px;"> +1 new notifcation! </p> </div> <div class="nb4txt"> {text:navi} </div>
  787.  
  788. </div>
  789. </div>
  790.  
  791.  
  792.  
  793.  
  794. <!--- MUSES TAB --->
  795.  
  796.  
  797.  
  798.  
  799. <div id="muses" class="tabcontent"> <span class="close" onclick="this.parentElement.style.display='none'"> <i data-feather="x" width="15px" height="15px"></i> </span>
  800.  
  801.  
  802. <div id="bgmuses">
  803.  
  804.  
  805.  
  806.  
  807. <!--- TO ADD A NEW ROW OF MUSES COPY FROM HERE --->
  808.  
  809.  
  810.  
  811.  
  812. <div class="mbox">
  813.  
  814. <div class="mboxbar"> <p style="text-align:left;"> <i class="fas fa-bars"></i> <span style="float:right;"> <i class="fas fa-user-plus"></i> </p>
  815.  
  816. <p style="margin-top:-25px; text-align:center"> <a href="/">@muse_01</a> </p> </div>
  817.  
  818. <img src="https://i.postimg.cc/LsvvFJRG/jungkook-muse.png">
  819.  
  820. <div class="msearch"> <p style="text-align:left; margin-top:0px; margin-left:8px;"> SEARCH... <span style="float:right; margin-top:-1px; margin-right:8px;"> <i class="fas fa-search"></i> </p> </div>
  821.  
  822. </div>
  823.  
  824.  
  825. <div class="mbox">
  826.  
  827. <div class="mboxbar"> <p style="text-align:left;"> <i class="fas fa-bars"></i> <span style="float:right;"> <i class="fas fa-user-plus"></i> </p>
  828.  
  829. <p style="margin-top:-25px; text-align:center"> <a href="/">@muse_02</a> </p> </div>
  830.  
  831. <img src="https://i.postimg.cc/LsvvFJRG/jungkook-muse.png">
  832.  
  833. <div class="msearch"> <p style="text-align:left; margin-top:0px; margin-left:8px;"> SEARCH... <span style="float:right; margin-top:-1px; margin-right:8px;"> <i class="fas fa-search"></i> </p> </div>
  834.  
  835. </div>
  836.  
  837. <div class="mbox">
  838.  
  839. <div class="mboxbar"> <p style="text-align:left;"> <i class="fas fa-bars"></i> <span style="float:right;"> <i class="fas fa-user-plus"></i> </p>
  840.  
  841. <p style="margin-top:-25px; text-align:center"> <a href="/">@muse_03</a> </p> </div>
  842.  
  843. <img src="https://i.postimg.cc/LsvvFJRG/jungkook-muse.png">
  844.  
  845. <div class="msearch"> <p style="text-align:left; margin-top:0px; margin-left:8px;"> SEARCH... <span style="float:right; margin-top:-1px; margin-right:8px;"> <i class="fas fa-search"></i> </p> </div>
  846.  
  847. </div>
  848.  
  849.  
  850. <!--- TO HERE !! --->
  851.  
  852.  
  853.  
  854. <div class="mbox">
  855.  
  856. <div class="mboxbar"> <p style="text-align:left;"> <i class="fas fa-bars"></i> <span style="float:right;"> <i class="fas fa-user-plus"></i> </p>
  857.  
  858. <p style="margin-top:-25px; text-align:center"> <a href="/">@muse_04</a> </p> </div>
  859.  
  860. <img src="https://i.postimg.cc/LsvvFJRG/jungkook-muse.png">
  861.  
  862. <div class="msearch"> <p style="text-align:left; margin-top:0px; margin-left:8px;"> SEARCH... <span style="float:right; margin-top:-1px; margin-right:8px;"> <i class="fas fa-search"></i> </p> </div>
  863.  
  864. </div>
  865.  
  866.  
  867. <div class="mbox">
  868.  
  869. <div class="mboxbar"> <p style="text-align:left;"> <i class="fas fa-bars"></i> <span style="float:right;"> <i class="fas fa-user-plus"></i> </p>
  870.  
  871. <p style="margin-top:-25px; text-align:center"> <a href="/">@muse_05</a> </p> </div>
  872.  
  873. <img src="https://i.postimg.cc/LsvvFJRG/jungkook-muse.png">
  874.  
  875. <div class="msearch"> <p style="text-align:left; margin-top:0px; margin-left:8px;"> SEARCH... <span style="float:right; margin-top:-1px; margin-right:8px;"> <i class="fas fa-search"></i> </p> </div>
  876.  
  877. </div>
  878.  
  879.  
  880. <div class="mbox">
  881.  
  882. <div class="mboxbar"> <p style="text-align:left;"> <i class="fas fa-bars"></i> <span style="float:right;"> <i class="fas fa-user-plus"></i> </p>
  883.  
  884. <p style="margin-top:-25px; text-align:center"> <a href="/">@muse_06</a> </p> </div>
  885.  
  886. <img src="https://i.postimg.cc/LsvvFJRG/jungkook-muse.png">
  887.  
  888. <div class="msearch"> <p style="text-align:left; margin-top:0px; margin-left:8px;"> SEARCH... <span style="float:right; margin-top:-1px; margin-right:8px;"> <i class="fas fa-search"></i> </p> </div>
  889.  
  890. </div>
  891.  
  892.  
  893. <div class="mbox">
  894.  
  895. <div class="mboxbar"> <p style="text-align:left;"> <i class="fas fa-bars"></i> <span style="float:right;"> <i class="fas fa-user-plus"></i> </p>
  896.  
  897. <p style="margin-top:-25px; text-align:center"> <a href="/">@muse_07</a> </p> </div>
  898.  
  899. <img src="https://i.postimg.cc/LsvvFJRG/jungkook-muse.png">
  900.  
  901. <div class="msearch"> <p style="text-align:left; margin-top:0px; margin-left:8px;"> SEARCH... <span style="float:right; margin-top:-1px; margin-right:8px;"> <i class="fas fa-search"></i> </p> </div>
  902.  
  903. </div>
  904.  
  905.  
  906. <div class="mbox">
  907.  
  908. <div class="mboxbar"> <p style="text-align:left;"> <i class="fas fa-bars"></i> <span style="float:right;"> <i class="fas fa-user-plus"></i> </p>
  909.  
  910. <p style="margin-top:-25px; text-align:center"> <a href="/">@muse_08</a> </p> </div>
  911.  
  912. <img src="https://i.postimg.cc/LsvvFJRG/jungkook-muse.png">
  913.  
  914. <div class="msearch"> <p style="text-align:left; margin-top:0px; margin-left:8px;"> SEARCH... <span style="float:right; margin-top:-1px; margin-right:8px;"> <i class="fas fa-search"></i> </p> </div>
  915.  
  916. </div>
  917.  
  918.  
  919. <div class="mbox">
  920.  
  921. <div class="mboxbar"> <p style="text-align:left;"> <i class="fas fa-bars"></i> <span style="float:right;"> <i class="fas fa-user-plus"></i> </p>
  922.  
  923. <p style="margin-top:-25px; text-align:center"> <a href="/">@muse_09</a> </p> </div>
  924.  
  925. <img src="https://i.postimg.cc/LsvvFJRG/jungkook-muse.png">
  926.  
  927. <div class="msearch"> <p style="text-align:left; margin-top:0px; margin-left:8px;"> SEARCH... <span style="float:right; margin-top:-1px; margin-right:8px;"> <i class="fas fa-search"></i> </p> </div>
  928.  
  929. </div>
  930.  
  931. </div>
  932. </div>
  933.  
  934.  
  935.  
  936.  
  937. <!--- POSTS --->
  938.  
  939.  
  940.  
  941.  
  942. <div id="postcon">
  943. <div id="posts">
  944. {block:Posts}
  945. <div class="entry">
  946.  
  947. {block:Date} <div class="topinfo"><a href="{Permalink}" title="posted {TimeAgo}.">{Month} {Year}</a> <div class="preblog"><a href="{ReblogURL}" target="_blank" title="reblog this post?">reblog</a></div></div>{/block:Date}
  948.  
  949.  
  950. <!--- TEXTS --->
  951.  
  952. {block:Text} {block:Title} <a href="{Permalink}"> <h1>{Title}</h1></a> {/block:Title} {Body} {/block:Text}
  953.  
  954.  
  955. <!--- PHOTOS --->
  956.  
  957. {block:Photo}<img src="{PhotoURL-500}" alt="{PhotoAlt}" />{/block:Photo}
  958.  
  959. {block:Photoset} {block:IndexPage}{Photoset-500}{/block:IndexPage} {block:PermalinkPage}{Photoset-500}{/block:PermalinkPage} {/block:Photoset}
  960.  
  961.  
  962. <!--- CHATS --->
  963.  
  964. {block:Chat} <ul class="convo">{block:Lines}<li class="line_{Alt} user_{UserNumber}">{block:Label}<span class="label" style="text-transform:uppercase; font-weight:bold;">@{Label} </span>{/block:Label}
  965. {Line}</li>{/block:Lines}</ul><div style="font-size:7px; color:{color:text}; margin-top:-10px; margin-left:240px; {block:if400pxPosts} margin-left:340px; {/block:if400pxPosts} letter-spacing:1px; text-transform:uppercase"><span class="fas fa-check"></span> delivered.</div>{/block:Chat}
  966.  
  967.  
  968. <!--- QUOTES --->
  969.  
  970. {block:Quote} <div class="quote"> {Quote} </div> <div class="source"> — {Source} </div> {/block:Quote}
  971.  
  972.  
  973. <!--- LINKS --->
  974.  
  975. {block:Link} <div class="linktitle"> <a href="{URL}"><h1>{Name}</h1></a></div>
  976. {block:Description} <p>{Description}</p> {/block:Description}{/block:Link}
  977.  
  978.  
  979. <!--- VIDEOS --->
  980.  
  981. {block:Video}<div class="video">{Video-500}</div>{/block:Video}
  982.  
  983.  
  984. <!--- AUDIOS --->
  985.  
  986. {block:Audio} {block:AudioPlayer} <div class="playbutton">{AudioPlayerGrey}</div> {block:AlbumArt}<div class="albumart"><img src="{AlbumArtURL}"></div>{/block:AlbumArt} <div class="trackinfo"> <div class="trackname"> {block:TrackName}{TrackName}{/block:TrackName}</div><div class="artist"> {block:Artist}{Artist}{/block:Artist} </div></div> {/block:AudioPlayer}{/block:Audio}
  987.  
  988.  
  989. <!--- ASKS --->
  990.  
  991. {block:Answer}<div style="margin-top:25px;" class="asker"><div class="ask">({TimeAgo}) <b>{Asker}</b> said:</div></div><div class="bubble"><br>{Question} <a href="/" title="{text:ask icon hover}"><span class="th th-plant-vase-o"></span></a></div><div class="answer"> {Answer} </div>{/block:Answer}
  992.  
  993.  
  994. {block:Caption}{Caption}{/block:Caption}
  995.  
  996. <div class="bottominfo"><div class="psource">{block:ContentSource}<a href="{SourceURL}" title="posted by {SourceTitle}.">source</a>{/block:ContentSource}</div>
  997.  
  998. {block:NoteCount}<a href="{Permalink}" title="view the notes."> {NoteCountWithLabel}</a>{/block:NoteCount}
  999.  
  1000. {block:HasTags} <div class="tags"> <span style="font-size:7px; color:{color:links}; letter-spacing:1px; text-transform:uppercase; font-weight:bold;"> {PostAuthorName} said: </span> {block:Tags}<a href="{TagURL}">{Tag}</a> &nbsp;{/block:Tags}<br></div>{/block:HasTags}</div>
  1001.  
  1002. {block:PermalinkPage}{block:PostNotes}<div id="notes">{PostNotes}</div>{/block:PostNotes}{/block:PermalinkPage}
  1003.  
  1004. </div>
  1005. {/block:Posts}
  1006.  
  1007.  
  1008.  
  1009.  
  1010. </div>
  1011. </div>
  1012.  
  1013. </div>
  1014. </div>
  1015.  
  1016.  
  1017.  
  1018.  
  1019. <div id="cred">
  1020. <a href="http://twentys.tumblr.com" title="made by julie."><span class="th th-holly-o"></span></a>
  1021. </div>
  1022.  
  1023. <script> feather.replace() </script>
  1024.  
  1025. </body>
  1026. </html>
  1027.  
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!