Advertisement
lovesjoon

theme 07: jungkook.

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