API tools faq
paste
Advertisement
Guest User

FOR SAGE

a guest
Feb 22nd, 2017
75
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 28.09 KB | None | 0 0
raw download clone embed print report
  1. <html><head>
  2.  
  3.  
  4. <!-- - ̗̀ THEME EIGHTEEN aka FALSE ALARM by VCNILLA ̖́- -->
  5.  
  6. <!-- friendly reminder: stealing isn't ok -->
  7.  
  8.  
  9. <!-- - ̗̀ PART ONE aka the STYLESHEETS ̖́- -->
  10.  
  11. <title>{title}</title>
  12. <link rel="shortcut icon" href="{Favicon}">
  13. <link rel="stylesheet" href="hint.css">
  14. <link href="css/hover.css" rel="stylesheet" media="all">
  15. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  16.  
  17. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  18. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  19. <script src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.1/SmoothScroll.min.js"></script>
  20.  
  21. <link href="css/hover.css" rel="stylesheet" media="all">
  22. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  23. <script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  24.  
  25. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css">
  26. <link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
  27.  
  28. <link href="https://fonts.googleapis.com/css?family=Montserrat:400,700|Work+Sans" rel="stylesheet">
  29. <link href="https://fonts.googleapis.com/css?family=Rubik:300,400,500,700" rel="stylesheet">
  30. <link href="https://fonts.googleapis.com/css?family=Heebo:300,400,500,700" rel="stylesheet">
  31. <link href="https://fonts.googleapis.com/css?family=Roboto:400,500,700,900" rel="stylesheet">
  32.  
  33.  
  34.  
  35. <!-- - ̗̀ PART TWO aka the SCRIPTS ̖́- -->
  36.  
  37. <script> (function($){ $(document).ready(function() { $("a[title]").style_my_tooltips({ tip_follows_cursor:true, tip_delay_time:20, tip_fade_speed:200, attribute:"title" }); }); })(jQuery); </script>
  38.  
  39. <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 < tabcontent.length; i++) { tablinks[i].className = tablinks[i].className.replace(" active", ""); } document.getElementById(cityName).style.display = "block"; evt.currentTarget.className += " active" } </script>
  40.  
  41. <script> function openCity1(evt, cityName) { var i, tabcontent1, tablinks1;tabcontent1 = document.getElementsByClassName("tabcontent1"); for (i = 0; i < tabcontent1.length; i++) { tabcontent1[i].style.display = "none"; } tablinks1 = document.getElementsByClassName("tablinks1"); for (i = 0; i < tabcontent1.length; i++) { tablinks1[i].className = tablinks1[i].className.replace(" active", ""); } document.getElementById(cityName).style.display = "block"; evt.currentTarget.className += " active" } </script>
  42.  
  43.  
  44.  
  45. <!-- - ̗̀ PART THREE aka the META TAGS ̖́- -->
  46.  
  47. <meta name="color:background" content="#eaeaea">
  48. <meta name="color:text" content="#868686" />
  49. <meta name="color:posts" content="#ffffff"/>
  50. <meta name="color:linkhover" content="#ddd" />
  51. <meta name="color:link" content="#979797" />
  52. <meta name="color:posts link" content="#818181"/>
  53. <meta name="color:Bold" content="#cea5a5" />
  54. <meta name="color:Italic" content="#393939"/>
  55. <meta name="color:Scrollbar" content="#dcdcdc"/>
  56. <meta name="color:container" content="#f4f4f4"/>
  57. <meta name="color:sidebar" content="#e8e8e8"/>
  58. <meta name="color:borders" content="#e3e3e3"/>
  59. <meta name="color:tab links" content="#606060"/>
  60.  
  61. <meta name="text:link1" content="/url"/>
  62. <meta name="text:snapchat user" content="@snapuser" />
  63. <meta name="text:snap1 caption" content="caption of first snap" />
  64. <meta name="text:snap2 caption" content="caption of second snap" />
  65. <meta name="text:snap3 caption" content="caption of third snap" />
  66. <meta name="text:twitter name" content="twt name" />
  67. <meta name="text:twitter username" content="@twtuser" />
  68. <meta name="text:twitter desc" content="keep this one or two lines at most pls" />
  69. <meta name="text:tweet 1" content="Hell is having the lyric-less song you heard at the club last night stuck in your head. #howareyousupposedtosingdubstep" />
  70. <meta name="text:tweet 2" content="People who stop shopping when they drop are weak. #RealShoppers whip out their phones and keep going online." />
  71. <meta name="text:instagram username" content="@iguser" />
  72. <meta name="text:instagram desc" content="this is the instagram description !!" />
  73.  
  74. <meta name="image:sidebar" content=""/>
  75. <meta name="image:background" content=""/>
  76. <meta name="image:tab img" content=""/>
  77. <meta name="image:snapchat1" content=""/>
  78. <meta name="image:snapchat2" content=""/>
  79. <meta name="image:snapchat3" content=""/>
  80. <meta name="image:twitter header" content=""/>
  81. <meta name="image:twitter icon" content=""/>
  82. <meta name="image:instagram icon" content=""/>
  83. <meta name="image:instagram1" content=""/>
  84. <meta name="image:instagram2" content=""/>
  85. <meta name="image:instagram3" content=""/>
  86. <meta name="image:instagram4" content=""/>
  87. <meta name="image:instagram5" content=""/>
  88. <meta name="image:instagram6" content=""/>
  89. <meta name="image:instagram7" content=""/>
  90. <meta name="image:instagram8" content=""/>
  91. <meta name="image:instagram9" content=""/>
  92.  
  93. <meta name="if:scrollbar" content="0" /> </head>
  94.  
  95.  
  96.  
  97. <!-- - ̗̀ PART FOUR aka the SCROLLBAR ̖́- -->
  98.  
  99. <style type="text/css">
  100. {block:IfScrollbar}
  101. ::-webkit-scrollbar { width:2px; height: 4px; }
  102. ::-webkit-scrollbar-thumb { background-color: {color:scrollbar};
  103. -webkit-border-radius: 5px; }
  104. {/block:IfScrollbar}
  105.  
  106. {block:IfNotScrollbar}
  107. ::-webkit-scrollbar { width:0px; height: 4px; }
  108. ::-webkit-scrollbar-thumb { background-color: {color:borders};
  109. -webkit-border-radius: 5px; }
  110. {/block:IfNotScrollbar}
  111.  
  112.  
  113.  
  114. /* - ̗̀ PART FIVE aka the TOOLTIPS ̖́- */
  115.  
  116. #s-m-t-tooltip { max-width:300px; padding:2px; padding-left:5px; padding-right:5px; margin:20px 20px 5px 10px; font-weight:bold; text-transform:uppercase; font-family:'Montserrat'; font-size:7px; letter-spacing:2px; background:{color:container}; z-index:99999999; border-radius:5px; color:{color:text}; background:rgba(250,250,250,0.7); }
  117.  
  118. ::-moz-selection { background:{color:borders}; color:{color:text}; }
  119. ::selection { background:{color:borders}; color:{color:text}; }
  120.  
  121.  
  122.  
  123. /* - ̗̀ PART SIX aka the BODY ̖́- */
  124.  
  125. body { color:{color:text}; background-color:{color:background}; line-height:14px; text-align:justify; background-image:url('{image:background}'); font-family:'Montserrat'; font-size:10px; }
  126.  
  127. #vcnilla { width:608px; height:400px; position: absolute; margin:auto; left:0; top:0; right:0; bottom:0; background-color:{color:container}; overflow:hidden; background-image:url('{image:container bg}'); }
  128.  
  129. a:link, a:active, a:visited { color: {color:link}; text-decoration:none; }
  130. a:hover { color:{color:linkhover}; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; transition: all 0.2s linear; }
  131.  
  132. #posts a:link, a:active, a:visited { color:{color:posts link}; text-decoration:none; }
  133. #posts a:hover { color:{color:posts link}; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; transition: all 0.2s linear; }
  134.  
  135.  
  136. /* - ̗̀ PART SEVEN aka the TEXT ̖́- */
  137.  
  138. small { font-size:10px; }
  139. sub, sup {font-size:9px;}
  140. pre { white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; word-wrap: break-word; }
  141. big {font-size:auto;}
  142. b, strong { color:{color:italic}; }
  143. h2, h1 { padding:9px; font-size:9px; text-transform:uppercase; line-height:14px; text-align:right; line-height:13px; letter-spacing:1px; background:{color:container}; font-family:'Montserrat'; font-weight:bold; }
  144. .quoter { color:{color:bold}; font-size:8px; }
  145. i, em {color:{color:italic};}
  146. p { margin-top:6px; margin-bottom:6px;}
  147. li { list-style-type: circle;}
  148. blockquote { margin:12px; padding-left:10px; padding-right:10px; border-left:1px solid {color:borders}; }
  149. img a { border:none; width:100%;}
  150.  
  151.  
  152.  
  153. /* - ̗̀ PART EIGHT aka the CONTAINER ̖́- */
  154.  
  155. #container { height:370px; width:440px; overflow: auto; position:absolute; right:15px; top:15px; }
  156. #entries { text-align: justify; }
  157.  
  158. #posts { margin-top:0px; margin-bottom:25px; margin-left:10px; width:400px; text-align: justify; padding:15px; padding-bottom:7px; background-color:{color:posts}; font-family:'Work Sans', sans-serif; }
  159. #posts img { max-width:100%; }
  160.  
  161. #info {padding:5px; text-align:center; text-transform:uppercase; background:{color:container}; font-family:'Montserrat'; }
  162. #info a { font-weight:bold; font-size:7px; letter-spacing:1px; color:{color:text}; }
  163. #info i { color:{color:bold}; font-size:6px; margin:6px; }
  164.  
  165.  
  166.  
  167. /* - ̗̀ PART NINE aka the SIDEBAR ̖́- */
  168.  
  169. #sidebar { width:115px; left:15px; top:82px; position:absolute; height:273px; text-align:left; background-color:{color:sidebar}; text-transform:uppercase; font-weight:bold; font-size:6.5px; letter-spacing:1px; text-align:justify; padding:10px; font-family:'Montserrat'; overflow:auto; line-height:17px; z-index:9999; padding-bottom:20px; }
  170.  
  171. #sbline { position:absolute; top:15px; z-index:9999; left:82px; width:50px; height:50px; }
  172. #sbline img { width:50px; border:9px solid {color:borders}; height:50px;}
  173.  
  174. #linkbox { width:53px; height:54px; font-family:'Montserrat'; text-transform:uppercase; font-size:11px; letter-spacing:4px; z-index:999; position:absolute; top:15px; left:15px; background:{color:bold}; padding:7px; text-align:center; line-height:26px; }
  175. #linkbox li { float:left; list-style-type:none; margin-left:6px; }
  176. #linkbox a, #linkbox i { color:{color:container}; font-size:13px; margin-left:2px; }
  177. .earth { z-index:99999; margin-left:22px; }
  178. #lb2 { margin:2px; width:50px; height:50px; }
  179.  
  180. #pagination { position:absolute; bottom:15px; left:15px; color:{color:posts}; font-weight:bold; font-size:7px; width:125px; text-transform:uppercase; letter-spacing:1px; text-align:center; line-height:10px;background:transparent; padding:5px; background:{color:bold}; z-index:9999; }
  181. #pagination a { color:{color:link}; }
  182.  
  183.  
  184.  
  185. /* - ̗̀ PART TEN aka the TAB ̖́- */
  186.  
  187. ul.tab { list-style-type:none; position:absolute; width:20px; top:24px; left:-33px; z-index:999; }
  188. .tab i { color:{color:link}; }
  189. ul.tab a { float: left;}
  190. ul.tab li a:hover { color: {color:bold};}
  191. .tabcontent { display:none; position:absolute; background:{color:posts}; width:430px; height:370px; z-index:99999; overflow:auto; right:15px; top:15px; }
  192.  
  193. #tabtabs { width:202px; position:absolute; text-align:center; bottom:10px; padding:5px; right:10px; background:{color:bold}; }
  194. #tabtabs i { font-size:21px; color:{color:tab links}; margin-left:5px; margin-right:5px; }
  195.  
  196. #tabimg img { width:160px; height:160px; background:#aaa; margin:11px; border:13px solid {color:borders}; }
  197.  
  198. #tabbox { position:absolute; bottom:8px; left:8px; width:135px; }
  199. #tabbox li { list-style-type:none; background:{color:borders}; padding:2px; text-align:center; font-weight:bold; font-size:8px; letter-spacing:1px; text-transform:uppercase; margin:3px; margin-top:5px; width:182px; transition: all 0.5s ease; }
  200. #tabbox a, #tabbox a:hover { color:{color:text}; }
  201. #tabbox li:hover { letter-spacing:2px; transition: all 0.5s ease; }
  202.  
  203.  
  204.  
  205. /* - ̗̀ PART ELEVEN aka the TAB INSIDE TAB ̖́- */
  206.  
  207. ul.tab1 { list-style-type:none; margin-top:-9px; }
  208. .tab1 i { color:{color:borders}; }
  209. ul.tab1 a {float: left;}
  210. ul.tab1 li a:hover { color: {color:italic};}
  211. ul.tab1 li a:active { color: {color:borders};}
  212. .tabcontent1 { display:none; position:absolute; background:{color:borders}; width:192px; height:297px; z-index:99999; overflow:auto; padding:10px; top:11px; right:10px; }
  213.  
  214.  
  215.  
  216. /* - ̗̀ PART ELEVEN A aka the SNAPCHAT TAB ̖́- */
  217.  
  218. #snap { background:#e9e9e9; border-radius:0px; width:192px; height:297px; position:absolute; overflow:hidden; }
  219. .txt { margin:20px; line-height:15px; }
  220. #snap img { border-radius:0px; width:192px; height:297px; }
  221. #s1 { opacity:0; position:absolute; }
  222. #s2 { opacity:0; position:absolute; }
  223. #snap:hover #s1 { opacity:1; transition-delay:1s; }
  224. #snap:hover #s2 { opacity:1; transition-delay:2.5s; }
  225. .username { color:#f3f3f3; font-weight:bold; text-shadow:1px 1px 2px #6e6e6e; position:absolute; top:7px; letter-spacing:1px; left:7px; text-transform:uppercase; z-index:9999; }
  226. .caption { position:absolute; background:rgba(0, 0, 0, 0.5); width:186px; padding:3px; text-align:center; top:245px; color:#f5f5f5; letter-spacing:1px; font-size:7px; font-family:'montserrat'; font-weight:bold; text-transform:uppercase; line-height:9px; }
  227. .timeago { color:#f5f5f5; position:absolute; text-shadow:0px 0px 3px #aaa; top:20px; letter-spacing:2px; left:7px; text-transform:uppercase; font-size:7px; }
  228.  
  229.  
  230.  
  231. /* - ̗̀ PART ELEVEN B aka the TWITTER TAB ̖́- */
  232.  
  233. .twtheader { background:#aaa; width:192px; height:76px; }
  234. .twticon { position:absolute; left:20px; top:61px; }
  235. .twticon img { border:3px solid {color:container}; border-radius:4px; width:40px; height:40px; }
  236. .twtfollow { padding-left:2px; padding-right:2px; background:{color:bold}; font-size:7px; text-transform:uppercase; font-weight:bold; letter-spacing:1px; position:absolute; top:91px; right:10px; border-radius:3px; border:1px solid transparent; color:{color:container}; }
  237. .twtname { position:absolute; font-size:11px; font-family:'Roboto'; top:113px; left:10px; font-weight:600; text-transform:uppercase;}
  238. .twtuser { position:absolute; font-size:9px; font-family:'Roboto'; top:123px; left:10px; font-weight:400; text-transform:lowercase; letter-spacing:1px; }
  239. .twtdesc { position:absolute; font-size:9px; font-family:'Roboto'; top:140px; left:10px; font-weight:400; text-transform:lowercase; letter-spacing:1px; line-height:8px; margin-right:12px; text-align:left; }
  240. .twtstats { position:absolute; font-size:7px; font-family:'Roboto'; top:162px; left:10px; font-weight:700; text-transform:uppercase; line-height:8px; text-align:center; background:{color:container}; padding:3px; width:184px; color:{color:italic};}
  241. .twtstats b { color:{color:bold}; }
  242. .atwt { background:{color:container}; position:absolute; top:181px; width:184px; padding:3px; left:10px; height:57px; font-family:'Roboto'; }
  243. .atwt img { width:20px; height:20px; border-radius:4px; margin:3px; }
  244. .atwt twtname { text-transform:uppercase; position:absolute; left:30px; top:4px; font-weight:600; color:{color:italic}}
  245. .atwt twtuser { position:absolute; left:30px; top:15px; font-size:9px;color:{color:italic} }
  246. .atwt tweet { position:absolute; left:5px; top:31px; width:177px; line-height:8px; color:{color:italic} }
  247. .btwt { background:{color:container}; position:absolute; top:249px; width:184px; padding:3px; left:10px; height:57px; font-family:'Roboto'; }
  248. .btwt img { width:20px; height:20px; border-radius:4px; margin:3px; }
  249. .btwt twtname { text-transform:uppercase; position:absolute; left:30px; top:4px; font-weight:600; color:{color:italic}}
  250. .btwt twtuser { position:absolute; left:30px; top:15px; font-size:9px; color:{color:italic}}
  251. .btwt tweet { position:absolute; left:5px; top:31px; width:177px; line-height:8px; color:{color:italic} }
  252.  
  253.  
  254.  
  255. /* - ̗̀ PART ELEVEN C aka the INSTAGRAM TAB ̖́- */
  256.  
  257. .igicon { margin:0px; }
  258. .igicon img { width:60px; height:60px; border-radius:100%; }
  259. .igusername { position:absolute; left:80px; font-family:'Roboto'; font-size:11px; font-weight:700; letter-spacing:0px; top:21px; text-transform:uppercase; }
  260. .igdesc { position:absolute; top:38px; font-family:'Roboto'; font-size:9px; width:110px; left:80px; line-height:9px; }
  261. .igstats { position:absolute; font-size:8px; font-family:'Roboto'; top:76px; left:10px; font-weight:900; text-transform:uppercase; line-height:7px; text-align:center; background:{color:container}; padding:3px; width:185px; letter-spacing:2px; color:{color:italic} }
  262. .igstats b { color:{color:bold}; }
  263. .igfollow { padding:0px; background:{color:bold}; font-size:7px; text-transform:uppercase; font-weight:bold; letter-spacing:1px; position:absolute; top:95px; right:10px; border-radius:16px; border:1px solid transparent; color:{color:container}; text-align:center; left:10px; width:190px; }
  264. .igimages { position:absolute; top:115px; left:6px; width:200px; text-align:center; }
  265. .igimages img { width:56px; margin:4px; }
  266.  
  267.  
  268.  
  269. /* - ̗̀ PART TWELVE aka the CREDIT ̖́- */
  270.  
  271. #credit { position:fixed; bottom:10px; left:10px; }
  272. #credit a { font-size:9px; color:{color:text}; font-weight:bold; }
  273. #credit i {border-radius:80px; color:{color:bold}; text-transform:uppercase; letter-spacing: 0px; padding:4px; width:10px; height:10px; background:{color:container}; opacity:1; text-align:center; line-height:10px; }
  274. #creditbox { position:fixed; width:100px; height:100px; bottom:10px; left:10px; }
  275. .tooltip { display:inline; position:absolute; z-index:999; }
  276. .tooltip::after { content:''; position:absolute; width:60px; height:20px; bottom:00px; left:0px; pointer-events:none; }
  277. .tooltip:hover::after { pointer-events: auto; }
  278. .tooltip-content { position:absolute; z-index:9999; width:60px; left:-5px; bottom:-70px; font-size:8px; color:{color:text}; background:transparent; opacity:0; cursor:default; pointer-events:none; -webkit-font-smoothing:antialiased; -webkit-transition:opacity 0.3s 0.3s; transition:opacity 0.3s 0.3s; }
  279. .tooltip:hover .tooltip-content { opacity:1; pointer-events:auto; -webkit-transition-delay:0s; transition-delay:0s; }
  280. .tooltip-content span { display:block; }
  281. .tooltip-text { border-bottom:7px solid {color:bold}; overflow:hidden; -webkit-transform: scale3d(0,1,1); transform: scale3d(0,1,1); -webkit-transition: -webkit-transform 0.3s 0.3s; transition: transform 0.3s 0.3s; }
  282. .tooltip:hover .tooltip-text { -webkit-transition-delay: 0s; transition-delay: 0s; -webkit-transform: scale3d(1,1,1); transform: scale3d(1,1,1); }
  283. .tooltip-inner { background: {color:container}; padding:7px; line-height:11px; -webkit-transform: translate3d(0,100%,0); transform: translate3d(0,100%,0); webkit-transition: -webkit-transform 0.3s; transition: transform 0.3s; text-align:justify;}
  284. .tooltip:hover .tooltip-inner { -webkit-transition-delay: 0.3s; transition-delay: 0.3s; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); }
  285. .tooltip-content::after { content:''; bottom:-15px; left:26%; border:solid transparent; height:0; width:0; position:absolute; pointer-events:none; border-color:transparent; border-top-color:{color:bold}; border-width:8px; margin-left:-10px; }
  286.  
  287.  
  288.  
  289. /* - ̗̀ PART THIRTEEN aka the POST STYLES ̖́- */
  290.  
  291. #question { margin:0px; padding:8px; text-align:center; background:{color:container}; font-size:9px; text-transform:lowercase; }
  292. #question b { text-transform:uppercase; text-align:right; }
  293. #asker a { padding:0px; border-bottom:none; color:{color:posts}; }
  294. #asker { margin:0px; padding:3px; text-align:right; background:{color:bold}; font-size:9px; color:{color:container}; text-transform:uppercase; letter-spacing:2px; }
  295.  
  296. #audioplayer { width:27px; height:27px; background:#fff; border-radius:60px; overflow:hidden; position:absolute; padding:0px; margin-top:9px; margin-left:17px; opacity:0.7; z-index:9999; -webkit-transition:0.5s; }
  297. #audioplayer:hover { opacity:1; -webkit-transition:0.5s; }
  298. #audioart { float:left; margin-top:-9px; margin-left:0px; padding-right:10px; }
  299. #audioart img { border:6px solid {color:borders}; width:50px; border-radius:70px; }
  300. #audioinfo { background:{color:container};height:57px; margin-left:0px; text-transform:uppercase; font-size:7px; text-align:left; padding-left:10px; top:0px; padding-top:15px; letter-spacing:1px; margin-bottom:5px; }
  301. .notes img { margin-right:2px; width:10px; border-radius:100px; }
  302. ol.notes, .notes li { width:300px; list-style:none; margin:3px; margin-left:8px; padding:0px; }
  303. .notes li a { font-weight:bold; color:{color:bold}; text-transform:uppercase; font-size:7px; letter-spacing:1px; }
  304.  
  305. #tags { text-align:center; width:300px; margin-top:6px; font-size:7px; padding-left:0px; line-height:10px; font-family:'Montserrat'; }
  306. #tags a { padding:0px; border-bottom:none; color:{color:text}; text-shadow:none; text-transform:uppercase; letter-spacing:1px; font-size:7px;}
  307. #tags i { color:{color:bold}; }
  308.  
  309. .answer span,.convo li { margin:0 0 5px; border-radius:1em; padding:.5em 10px; max-width:75%; clear:both; position:relative; list-style-type:none;}
  310. .answer .them,.user_1,.user_3,.user_5,.user_7,.user_9,.user_11,.user_13 { float:left; background:{color:container}; left:3px; }
  311. .me::after,.user_1::after,.user_3::after,.user_5::after,.user_7::after,.user_9::after,.user_11::after,.user_13::after { content:""; position:absolute; left:-.5em; bottom:0;width:.5em; height:1em; border-right:.5em solid {color:container}; border-bottom-right-radius:1em .5em; }
  312. .answer .me,.user_2,.user_4,.user_6,.user_8,.user_10,.user_12,.user_14 { right:3px; float:right; background-color:{color:borders}; }
  313. .them::after,.user_2::after,.user_4::after,.user_6::after,.user_8::after,.user_10::after,.user_12::after,.user_14::after { content:"";position:absolute; right:-.5em; bottom:0; width:.5em; height:1em; border-left:.5em solid {color:borders}; border-bottom-left-radius:1em .5em; }
  314. .convo { overflow:hidden; list-style-type:none; padding:0; margin:0; list-style-type:none; }</style>
  315.  
  316.  
  317.  
  318. <!-- - ̗̀ PART FOURTEEN aka the HTML ̖́- -->
  319.  
  320. <body><div id="vcnilla">
  321.  
  322. <!-- - ̗̀ PART FIFTEEN aka the SIDEBAR ̖́- -->
  323.  
  324. <div id="sbline"><img src="{image:sidebar}"></div>
  325.  
  326. <div id="linkbox">
  327. <div id="lb2">
  328. <a href="/" title="home;"><li><span class="lnr lnr-home"></span></li></a>
  329.  
  330. <a href="/ask" title="inbox;"><li><span class="lnr lnr-mic"></span></li></a>
  331.  
  332. <div class="earth"><a href="{text:link1}" title="seattle;"><li><span class="lnr lnr-earth"></span></li></a></div>
  333.  
  334.  
  335. <ul class="tab"><a title="more;" href="#" class="tablinks" onclick="openCity(event, 'tabone')"><li><span class="lnr lnr-menu"></span></li></a></ul>
  336.  
  337. </div></div>
  338.  
  339. <div id="sidebar">{description}</div>
  340.  
  341. {block:Pagination}<div id="pagination">{block:PreviousPage}<a href="{PreviousPage}">BACK <b>/</b></a>{/block:PreviousPage} {block:NextPage}<a href="{NextPage}">FORTH</a><br />{/block:NextPage}</div>{/block:Pagination}
  342.  
  343.  
  344.  
  345.  
  346. <!-- - ̗̀ PART FOURTEEN A aka the TAB ̖́- -->
  347.  
  348. <div id="tabone" class="tabcontent">
  349. <div id="tabimg"><img src="{image:tab img}"></div>
  350.  
  351. <div id="tabbox">
  352. <a href="/abt" title="about;"><li>biography</li></a>
  353. <a href="/rel" title="let's plot!"><li>relationships</li></a>
  354. <a href="/tagged/mirror;" title="face;"><li>expressions</li></a>
  355. <a href="/tagged/musings;" title="muse;"><li>inspirations</li></a>
  356. <a href="/tagged/afmtask" title="tasks;"><li>developments</li></a>
  357. <a href="/tagged/convo;" title="with a specific character, /tagged/c;name"><li>conversations</li></a>
  358. <a href="/tagged/para;" title="with a specific character, /tagged/p;name"><li>paragraphs</li></a>
  359. </div>
  360.  
  361.  
  362. <!-- - ̗̀ PART FOURTEEN B aka the INNER TABS ̖́- -->
  363.  
  364. <div id="tabtabs">
  365. <a href="#" class="tablinks1" onclick="openCity1(event, 'tab1')"><i class="fa fa-snapchat-ghost" aria-hidden="true"></i></a>
  366. <a href="#" class="tablinks1" onclick="openCity1(event, 'tab2')"><i class="fa fa-twitter" aria-hidden="true"></i></a>
  367. <a href="#" class="tablinks1" onclick="openCity1(event, 'tab3')"><i class="fa fa-instagram" aria-hidden="true"></i></a>
  368. </div>
  369.  
  370. <div id="tab1" class="tabcontent1" style="display:block;">
  371.  
  372.  
  373. <!-- - ̗̀ PART FOURTEEN C aka the SNAPTAB ̖́- -->
  374.  
  375. <div id="snapchat">
  376. <div id="snap" style="background-image:url('{image:snapchat1}');">
  377. <div class="username">{text:snapchat user}</div>
  378. <div class="timeago">5mins ago</div>
  379. <div class="caption">{text:snap1 caption}</div>
  380.  
  381. <div id="s1">
  382. <div class="timeago">8hrs ago</div>
  383. <div class="caption">{text:snap2 caption}</div>
  384. <img src="{image:snapchat2}"></div>
  385.  
  386. <div id="s2">
  387. <div class="timeago">23hrs ago</div>
  388. <div class="caption">{text:snap3 caption}</div>
  389. <img src="{image:snapchat3}"></div>
  390. </div></div></div>
  391.  
  392.  
  393. <!-- - ̗̀ PART FOURTEEN D aka the TWITTAB ̖́- -->
  394.  
  395. <div id="tab2" class="tabcontent1">
  396.  
  397. <div class="twtheader"><img src="{image:twitter header}"></div>
  398. <div class="twticon"><img src="{image:twitter icon}"></div>
  399. <div class="twtfollow">FOLLOW</div>
  400. <div class="twtname">{text:twitter name}</div>
  401. <div class="twtuser">{text:twitter username}</div>
  402. <div class="twtdesc">{text:twitter desc}</div>
  403.  
  404. <div class="twtstats">
  405. <b>345</b> following
  406. <b>32.4k</b> followers
  407. </div>
  408.  
  409. <div class="atwt">
  410. <img src="{image:twitter icon}">
  411. <twtname>{text:twitter name}</twtname>
  412. <twtuser>{text:twitter username}</twtuser>
  413. <tweet>{text:tweet 1}</tweet>
  414. </div>
  415.  
  416. <div class="btwt">
  417. <img src="{image:twitter icon}">
  418. <twtname>{text:twitter name}</twtname>
  419. <twtuser>{text:twitter username}</twtuser>
  420. <tweet>{text:tweet 2}</tweet>
  421. </div>
  422. </div>
  423.  
  424.  
  425. <!-- - ̗̀ PART FOURTEEN E aka the IGTAB ̖́- -->
  426.  
  427. <div id="tab3" class="tabcontent1">
  428. <div class="igicon"><img src="{image:instagram icon}"></div>
  429. <div class="igusername">{text:instagram username}</div>
  430. <div class="igdesc">{text:instagram desc}</div>
  431.  
  432. <div class="igstats">
  433. <b>254</b> posts
  434. <b>3,819</b> followers
  435. </div>
  436.  
  437. <div class="igfollow">+ follow this user</div>
  438.  
  439. <div class="igimages">
  440. <img src="{image:instagram1}"/>
  441. <img src="{image:instagram2}"/>
  442. <img src="{image:instagram3}"/>
  443. <img src="{image:instagram4}"/>
  444. <img src="{image:instagram5}"/>
  445. <img src="{image:instagram6}"/>
  446. <img src="{image:instagram7}"/>
  447. <img src="{image:instagram8}"/>
  448. <img src="{image:instagram9}"/>
  449. </div></div></div>
  450.  
  451.  
  452.  
  453.  
  454.  
  455. <!-- - ̗̀ do not delete ̖́- -->
  456. <div id="creditbox">
  457. <a class="tooltip" href="http://vcnilla.tumblr.com/">
  458. <div id="credit"><i class="fa fa-asterisk" aria-hidden="true"></i></div>
  459. <span class="tooltip-content">
  460. <span class="tooltip-text">
  461. <span class="tooltip-inner">code by <b>vcnilla</b>, don't take parts of the coding pls & tnx !</span></span></span></a></div>
  462.  
  463.  
  464.  
  465. <!-- - ̗̀ PART SIXTEEN aka the POSTS ̖́- -->
  466.  
  467. <div id="container">
  468. <div id="entries">
  469. {block:posts}
  470. <!-- {block:NoRebloggedFrom}
  471. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  472. {/block:NoRebloggedFrom} -->
  473. {block:ContentSource}<!-- {SourceURL}
  474. {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  475. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  476. {/block:ContentSource}
  477.  
  478. <div id="posts">
  479. {block:Text}{block:Title}
  480. <h1>{Title}</h1>{/block:Title}{Body}{/block:Text}
  481.  
  482. {block:Quote}<h2>{Quote} <div class="quoter">— {Source}</div></h2>{/block:Quote}
  483.  
  484. {block:Link}<a href="{URL}"><h1>{Name}</h1></a>
  485. {block:Description}<p>{Description}</p>{/block:Description}{/block:Link}
  486.  
  487. {block:Photo}<center><img src="{PhotoURL-500}"/></center>{block:Caption}{Caption}{/block:Caption}{/block:Photo}{block:Photoset}<center>{Photoset}</center>{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  488.  
  489. {block:Chat} {block:Title} <h1>{Title}</h1>{/block:Title}<br>
  490. <ul class="convo">{block:Lines}<li class="line_{Alt} user_{UserNumber}">{block:Label}<span class="label"><strong>{Label}</strong></span>{/block:Label}
  491. {Line}</li>{/block:Lines}</ul>{/block:Chat}
  492.  
  493. {block:Video}<div class="video">{Video-500}</div>{block:Caption}{Caption}{/block:Caption}{/block:Video}
  494.  
  495. {block:Answer}<div id="question"> {Question}</div>
  496. <div id="asker">{Asker}</div>
  497. {Answer}{/block:Answer}
  498.  
  499. {block:Audio}<div id="audioinfo"><div id="audioplayer">{AudioPlayerWhite}</div><div id="audioart">{block:AlbumArt}<img src="{AlbumArtURL}" width="60">{/block:AlbumArt}</div>
  500. <b>ARTIST:</b> {Artist}
  501. <br><b>TRACK NAME:</b> {TrackName}
  502. <br><b>PLAYED:</b> {PlayCountWithLabel}
  503. </div>{block:Caption}{Caption}{/block:Caption} {/block:Audio}
  504.  
  505. {block:Date}
  506. <div id="info">
  507. <a href="{ReblogURL}" target="_blank" class="details" title="reblog">REBLOG</a> <i class="fa fa-circle" aria-hidden="true"></i> <a href="{Permalink}">{NoteCountWithLabel}</a> <i class="fa fa-circle" aria-hidden="true"></i> <a href="{Permalink}">{TimeAgo}</a>{block:ContentSource}{/block:NoSourceLogo}{/block:ContentSource}</div>
  508. {/block:Date}
  509.  
  510. <div id="tags"> {block:HasTags}{block:Tags} <a href="{TagURL}"><i class="fa fa-tag" aria-hidden="true"></i> {Tag} </a> {/block:Tags}{/block:HasTags} </div></div>
  511. {/block:Posts}{block:PostNotes}{PostNotes}{/block:PostNotes}<br /></div>
  512.  
  513. </div></div></div></div></body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!