glenthemes

Theme [09]: Radiance

Sep 26th, 2015 (edited)
15,443
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 95.49 KB | None
  1. <!----------------------------------------------------
  2. Theme [09]: Radiance
  3. Made by glenthemes
  4.  
  5. Initial release: 2015/09/28
  6. Rework date: 2021/12/05
  7. Last updated: 2022/03/02
  8.  
  9. ------------------------------------------------------
  10.  
  11. 📖 PLEASE READ THE GUIDE: 📖
  12.  
  13. https://docs.google.com/presentation/d/1Ntb6G6nYOz4NcLfHYB_JyJvZPpXQvaQbYCNLttMGREM/edit?usp=sharing
  14.  
  15. ------------------------------------------------------
  16. TERMS OF USE:
  17. 1) Do not remove the theme credit.
  18. 2) Do not repost/redistribute my themes.
  19. 3) Do not take parts of the code and. use it as your own.
  20. 4) Do not use my themes as a base code.
  21. 5) Do not mix my themes together.
  22.  
  23. CREDITS:
  24. (⊃。•́‿•̀。)⊃ ~ glencredits.tumblr.com/radiance
  25. ----------------------------------------------------->
  26. <!DOCTYPE>
  27. <html font="{select:font}" tumblr-controls="{select:tumblr controls color}" bg-type="{select:background image type}" portrait="{PortraitURL-64}" {block:TagPage}tag-page{/block:TagPage} credit-pos="{select:theme credit location}">
  28.  
  29. <head>
  30.  
  31. <title>{Title}</title>
  32. <link rel="shortcut icon" href="{Favicon}">
  33.  
  34. {block:Description}
  35. <meta name="description" content="{MetaDescription}">
  36. {/block:Description}
  37.  
  38. <!-------- FONTS -------->
  39. <!-- google fonts -->
  40. <link href="//fonts.googleapis.com/css?family=Work+Sans:500|Cousine|Libre+Franklin:400,600|Manrope:500,700|Karla:400,700|Rubik:400,500|Open+Sans:400,600|Delius+Unicase:400,700|Archivo:400,700|Sen:400,700|Inter:400,600|Manjari:700" rel="stylesheet">
  41.  
  42. <!-------- ICON FONTS -------->
  43. <!-- phosphor icons -->
  44. <link rel="stylesheet" href="//unpkg.com/phosphor-icons@1.3.2/src/css/phosphor.css">
  45.  
  46. <!-- cappucicons -->
  47. <link href="//static.tumblr.com/gtjt4bo/tQkr83ou4/cappuccicons.css" rel="stylesheet">
  48.  
  49. <!-- iconsax -->
  50. <script src="//glenthemes.github.io/iconsax/geticons.js"></script>
  51. <link href="//glenthemes.github.io/iconsax/style.css" rel="stylesheet">
  52.  
  53. <!-- boobstrap -->
  54. <link rel="stylesheet" href="//glen-assets.github.io/bootstrap-icons/bootstrap-icons.css">
  55.  
  56. <!-------- PRELOAD -------->
  57. <link rel="preload" href="{image:sidebar image}" as="image">
  58. <link rel="preload" href="//glen-assets.github.io/fonts/Dharko Gilbert.ttf" as="font" type="font/ttf" crossorigin>
  59.  
  60. <!-------- JQUERY -------->
  61. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  62.  
  63. <!-------- THEME SCRIPTS -------->
  64. <script src="//npf-images-v3.github.io/script.js"></script>
  65. <link rel="stylesheet" href="//npf-images-v3.github.io/recon.css">
  66.  
  67. <script src="//rawgit.com/robinpx/tumblr/master/scripts/flexibleFrames/flexibleFrames.min.js"></script>
  68.  
  69. <link href="//static.tumblr.com/0podkko/oDSpg7y88/photosets.css" rel="stylesheet">
  70.  
  71. <script src="//static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  72.  
  73. <script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script>
  74.  
  75. <script src="https://glenthemes.s3.eu-west-2.amazonaws.com/thms/09/tamago-kake-gohan.js"></script>
  76.  
  77. <!-------- CUSTOMIZE PANEL OPTIONS -------->
  78. <!-- hi if you're reading this, GO BACK to edit! -->
  79. <!-- editing stuff here (the meta names) won't do anything -->
  80.  
  81. <meta name="image:&#x2B50; PLEASE READ THE GUIDE LINKED IN GREEN &#x2B50;" content="0">
  82. <meta name="image:sidebar image" content="//64.media.tumblr.com/e85f8d87d0566777da2368e0c1c9dbdf/aa56c24116a90bd2-a6/s2048x3072/01dd55682256a25dbb9b9c22b8818822d14bad42.png">
  83. <meta name="image:background image" content="//64.media.tumblr.com/d1decb703434224e8c01163304863f30/aa56c24116a90bd2-9c/s2048x3072/600a6ef52d711119d75e0e05b0ab67607a8ce14b.png">
  84. <meta name="image:header icon" content="//64.media.tumblr.com/7984dee5099820429a0dfd81d696a1a7/aa56c24116a90bd2-4c/s2048x3072/8b813497ea2d7af8d81e5888fe06faf8081ac3f4.png">
  85.  
  86. <meta name="image:&#9472;&#9472;&#9472;&#9472;&#9472;&#9472; &#x2740;&bull;&deg;&#x2740;&deg;&bull;&#x2740; &#9472;&#9472;&#9472;&#9472;&#9472;&#9472;" content="0">
  87.  
  88. <!----- COLORS ----->
  89. <meta name="color:background" content="#fdfdfd">
  90.  
  91. <meta name="color:sidebar hover background" content="#f5eee8">
  92. <meta name="color:sidebar corner title" content="#3f3f3c">
  93. <meta name="color:sidebar top icons" content="#262626">
  94.  
  95. <meta name="color:sidebar notif text A" content="#444">
  96. <meta name="color:sidebar notif text B" content="#736a65">
  97. <meta name="color:sidebar notif icon" content="#a59688">
  98.  
  99. <meta name="color:notif background" content="#fefefe">
  100.  
  101. <meta name="color:sidebar frame front" content="#eeebe9">
  102. <meta name="color:sidebar frame back" content="#eeebe9">
  103.  
  104. <meta name="color:sidebar title" content="#fcfcfc">
  105. <meta name="color:sidebar title outline" content="#d3c4b6">
  106. <meta name="color:sidebar title shadow" content="#e4d8c8">
  107.  
  108. <meta name="color:music player controls A" content="#efe7de">
  109. <meta name="color:music player controls B" content="#3f3f3c">
  110. <meta name="color:music player circle" content="#ff8b76">
  111. <meta name="color:music player background" content="#efe7de">
  112. <meta name="color:music player text" content="#67645c">
  113.  
  114. <meta name="color:customlinks background" content="#efe7de">
  115. <meta name="color:customlinks text" content="#888073">
  116.  
  117. <meta name="color:customlinks hover bg" content="#f5af96">
  118. <meta name="color:customlinks hover text" content="#fefefe">
  119.  
  120. <meta name="color:&#9472;&#9472;&#9472;&#9472;&#9472;&#9472; &#x2740;&bull;&deg;&#x2740;&deg;&bull;&#x2740; &#9472;&#9472;&#9472;&#9472;&#9472;&#9472;">
  121.  
  122. <!----- POST COLORS ----->
  123. <meta name="color:header icon border A" content="#f0f0f0">
  124. <meta name="color:header icon border B" content="#fefefe">
  125.  
  126. <meta name="color:&#9472;&#9472;&#9472;&#9472;&#9472;&#9472; &#x2740;&bull;&deg;&#x2740;&deg;&bull;&#x2740; &#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#8202;">
  127.  
  128. <meta name="color:post" content="#fefefe">
  129. <meta name="color:text" content="#a39795">
  130. <meta name="color:bold" content="#f9bf8c">
  131. <meta name="color:italic" content="#fea78d">
  132. <meta name="color:link" content="#ff8b76">
  133. <meta name="color:reblogger name" content="#c3aea2">
  134.  
  135. <meta name="color:top permalink background" content="#fafafa">
  136. <meta name="color:top permalink border" content="#f0f0f0">
  137. <meta name="color:top permalink text" content="#888">
  138.  
  139. <meta name="color:&#9472;&#9472;&#9472;&#9472;&#9472;&#9472; &#x2740;&bull;&deg;&#x2740;&deg;&bull;&#x2740; &#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#8202;&#8202;">
  140.  
  141. <meta name="color:post menu border" content="#e9e9e9">
  142. <meta name="color:post menu background" content="#fff">
  143. <meta name="color:post menu text" content="#999">
  144. <meta name="color:post menu text hover" content="#ff8b7c">
  145.  
  146. <meta name="color:&#9472;&#9472;&#9472;&#9472;&#9472;&#9472; &#x2740;&bull;&deg;&#x2740;&deg;&bull;&#x2740; &#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#8202;&#8202;&#8202;">
  147.  
  148. <meta name="color:post borders outer" content="#eee">
  149. <meta name="color:post borders inner" content="#f2f2f2">
  150. <meta name="color:post shadow" content="#cba48f">
  151.  
  152. <meta name="color:special border" content="#efefef">
  153. <meta name="color:special background" content="#fafafa">
  154. <meta name="color:special text" content="#a39795">
  155.  
  156. <meta name="color:tags" content="#978a87">
  157.  
  158. <meta name="color:bottom permalink background" content="#fafafa">
  159. <meta name="color:bottom permalink border" content="#f0f0f0">
  160. <meta name="color:bottom permalink text" content="#888">
  161.  
  162. <meta name="color:post buttons" content="#857e7c">
  163. <meta name="color:like button liked" content="#ff8b76">
  164.  
  165. <meta name="color:&#9472;&#9472;&#9472;&#9472;&#9472;&#9472; &#x2740;&bull;&deg;&#x2740;&deg;&bull;&#x2740; &#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#8202;&#8202;">
  166.  
  167. <meta name="color:scrollbar" content="#d1d1d1">
  168. <meta name="color:scrollbar background" content="#fdfdfd">
  169.  
  170. <meta name="color:text selection background" content="#f3eae6">
  171. <meta name="color:text selected" content="#a39795">
  172.  
  173. <meta name="select:&#9472;&#9472;&#9472;&#9472;&#9472;&#9472; &#x2740;&bull;&deg;&#x2740;&deg;&bull;&#x2740; &#9472;&#9472;&#9472;&#9472;&#9472;&#9472;">
  174.  
  175. <!-------- GENERAL OPTIONS -------->
  176. <meta name="select:font" title="Manrope" content="Manrope">
  177. <meta name="select:font" title="Rubik" content="Rubik">
  178. <meta name="select:font" title="Libre Franklin" content="Libre Franklin">
  179. <meta name="select:font" title="Karla" content="Karla">
  180. <meta name="select:font" title="Open Sans" content="Open Sans">
  181. <meta name="select:font" title="Archivo" content="Archivo">
  182. <meta name="select:font" title="Sen" content="Sen">
  183. <meta name="select:font" title="Inter" content="Inter">
  184.  
  185. <meta name="select:font size" title="12px" content="12px">
  186. <meta name="select:font size" title="10px" content="10px">
  187. <meta name="select:font size" title="11px" content="11px">
  188. <meta name="select:font size" title="13px" content="13px">
  189. <meta name="select:font size" title="14px" content="14px">
  190. <meta name="select:font size" title="15px" content="15px">
  191.  
  192. <meta name="select:&#9472;&#9472;&#9472;&#9472;&#9472;&#9472; &#x2740;&bull;&deg;&#x2740;&deg;&bull;&#x2740; &#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#8202;">
  193.  
  194. <!-------- SIDEBAR OPTIONS -------->
  195. <meta name="select:sidebar width" title="250px" content="250px">
  196. <meta name="select:sidebar width" title="175px" content="175px">
  197. <meta name="select:sidebar width" title="200px" content="200px">
  198. <meta name="select:sidebar width" title="225px" content="225px">
  199. <meta name="select:sidebar width" title="275px" content="275px">
  200. <meta name="select:sidebar width" title="300px" content="300px">
  201. <meta name="select:sidebar width" title="325px" content="325px">
  202.  
  203. <meta name="select:sidebar corner title size" title="8px" content="8px">
  204. <meta name="select:sidebar corner title size" title="7px" content="7px">
  205. <meta name="select:sidebar corner title size" title="9px" content="9px">
  206. <meta name="select:sidebar corner title size" title="10px" content="10px">
  207. <meta name="select:sidebar corner title size" title="11px" content="11px">
  208. <meta name="select:sidebar corner title size" title="12px" content="12px">
  209. <meta name="select:sidebar corner title size" title="13px" content="13px">
  210.  
  211. <meta name="select:battery status" title="charging" content="-charging">
  212. <meta name="select:battery status" title="empty" content="">
  213. <meta name="select:battery status" title="half" content="-half">
  214. <meta name="select:battery status" title="full" content="-full">
  215.  
  216. <meta name="select:notif panel transparency" title="100%" content="1">
  217. <meta name="select:notif panel transparency" title="90%" content="0.9">
  218. <meta name="select:notif panel transparency" title="80%" content="0.8">
  219. <meta name="select:notif panel transparency" title="70%" content="0.7">
  220. <meta name="select:notif panel transparency" title="60%" content="0.6">
  221. <meta name="select:notif panel transparency" title="50%" content="0.5">
  222. <meta name="select:notif panel transparency" title="40%" content="0.4">
  223. <meta name="select:notif panel transparency" title="30%" content="0.3">
  224. <meta name="select:notif panel transparency" title="20%" content="0.2">
  225. <meta name="select:notif panel transparency" title="10%" content="0.1">
  226. <meta name="select:notif panel transparency" title="0%" content="0">
  227.  
  228. <meta name="select:notif transparency" title="50%" content="0.5">
  229. <meta name="select:notif transparency" title="10%" content="0.1">
  230. <meta name="select:notif transparency" title="20%" content="0.2">
  231. <meta name="select:notif transparency" title="30%" content="0.3">
  232. <meta name="select:notif transparency" title="40%" content="0.4">
  233. <meta name="select:notif transparency" title="60%" content="0.6">
  234. <meta name="select:notif transparency" title="70%" content="0.7">
  235. <meta name="select:notif transparency" title="80%" content="0.8">
  236. <meta name="select:notif transparency" title="90%" content="0.9">
  237. <meta name="select:notif transparency" title="100%" content="1">
  238.  
  239. <meta name="select:sidebar title size" title="40px" content="40px">
  240. <meta name="select:sidebar title size" title="30px" content="30px">
  241. <meta name="select:sidebar title size" title="35px" content="35px">
  242. <meta name="select:sidebar title size" title="45px" content="45px">
  243. <meta name="select:sidebar title size" title="50px" content="50px">
  244.  
  245. <meta name="select:sidebar title outline" title="yes" content="yes">
  246. <meta name="select:sidebar title outline" title="no" content="no">
  247.  
  248. <meta name="select:sidebar title shadow" title="yes" content="yes">
  249. <meta name="select:sidebar title shadow" title="no" content="no">
  250.  
  251. <meta name="select:sidebar frame front transparency" title="0%" content="0">
  252. <meta name="select:sidebar frame front transparency" title="10%" content="0.1">
  253. <meta name="select:sidebar frame front transparency" title="20%" content="0.2">
  254. <meta name="select:sidebar frame front transparency" title="30%" content="0.3">
  255. <meta name="select:sidebar frame front transparency" title="40%" content="0.4">
  256. <meta name="select:sidebar frame front transparency" title="50%" content="0.5">
  257. <meta name="select:sidebar frame front transparency" title="60%" content="0.6">
  258. <meta name="select:sidebar frame front transparency" title="70%" content="0.7">
  259. <meta name="select:sidebar frame front transparency" title="80%" content="0.8">
  260. <meta name="select:sidebar frame front transparency" title="90%" content="0.9">
  261. <meta name="select:sidebar frame front transparency" title="100%" content="1">
  262.  
  263.  
  264. <meta name="select:sidebar frame back transparency" title="0%" content="0">
  265. <meta name="select:sidebar frame back transparency" title="10%" content="0.1">
  266. <meta name="select:sidebar frame back transparency" title="20%" content="0.2">
  267. <meta name="select:sidebar frame back transparency" title="30%" content="0.3">
  268. <meta name="select:sidebar frame back transparency" title="40%" content="0.4">
  269. <meta name="select:sidebar frame back transparency" title="50%" content="0.5">
  270. <meta name="select:sidebar frame back transparency" title="60%" content="0.6">
  271. <meta name="select:sidebar frame back transparency" title="70%" content="0.7">
  272. <meta name="select:sidebar frame back transparency" title="80%" content="0.8">
  273. <meta name="select:sidebar frame back transparency" title="90%" content="0.9">
  274. <meta name="select:sidebar frame back transparency" title="100%" content="1">
  275.  
  276. <meta name="select:customlinks per row" title="4" content="4">
  277. <meta name="select:customlinks per row" title="1" content="1">
  278. <meta name="select:customlinks per row" title="2" content="2">
  279. <meta name="select:customlinks per row" title="3" content="3">
  280.  
  281. <meta name="select:&#9472;&#9472;&#9472;&#9472;&#9472;&#9472; &#x2740;&bull;&deg;&#x2740;&deg;&bull;&#x2740; &#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#8202;&#8202;">
  282.  
  283. <!-------- GAPS BETWEEN POST & SIDEBARS -------->
  284. <meta name="select:center gaps" title="60px" content="60px">
  285. <meta name="select:center gaps" title="20px" content="20px">
  286. <meta name="select:center gaps" title="30px" content="30px">
  287. <meta name="select:center gaps" title="35px" content="35px">
  288. <meta name="select:center gaps" title="40px" content="40px">
  289. <meta name="select:center gaps" title="45px" content="45px">
  290. <meta name="select:center gaps" title="55px" content="55px">
  291. <meta name="select:center gaps" title="50px" content="50px">
  292. <meta name="select:center gaps" title="55px" content="55px">
  293. <meta name="select:center gaps" title="65px" content="65px">
  294. <meta name="select:center gaps" title="70px" content="70px">
  295. <meta name="select:center gaps" title="75px" content="75px">
  296. <meta name="select:center gaps" title="80px" content="80px">
  297.  
  298. <!-------- POST OPTIONS -------->
  299. <meta name="select:&#9472;&#9472;&#9472;&#9472;&#9472;&#9472; &#x2740;&bull;&deg;&#x2740;&deg;&bull;&#x2740; &#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#8202;&#8202;&#8202;">
  300.  
  301. <meta name="select:header icon size" title="64px" content="64px">
  302. <meta name="select:header icon size" title="32px" content="32px">
  303. <meta name="select:header icon size" title="40px" content="40px">
  304. <meta name="select:header icon size" title="48px" content="48px">
  305. <meta name="select:header icon size" title="56px" content="56px">
  306. <meta name="select:header icon size" title="72px" content="72px">
  307. <meta name="select:header icon size" title="80px" content="80px">
  308.  
  309. <meta name="select:header icon type" title="soft" content="soft">
  310. <meta name="select:header icon type" title="round" content="round">
  311. <meta name="select:header icon type" title="square" content="square">
  312.  
  313. <!------------------------------>
  314.  
  315. <meta name="select:post width" title="500px" content="500px">
  316. <meta name="select:post width" title="400px" content="400px">
  317. <meta name="select:post width" title="425px" content="425px">
  318. <meta name="select:post width" title="450px" content="450px">
  319. <meta name="select:post width" title="475px" content="475px">
  320. <meta name="select:post width" title="520px" content="520px">
  321. <meta name="select:post width" title="540px" content="540px">
  322. <meta name="select:post width" title="600px" content="600px">
  323.  
  324. <meta name="select:post shadow transparency" title="90%" content="0.9">
  325. <meta name="select:post shadow transparency" title="0%" content="0">
  326. <meta name="select:post shadow transparency" title="10%" content="0.1">
  327. <meta name="select:post shadow transparency" title="20%" content="0.2">
  328. <meta name="select:post shadow transparency" title="30%" content="0.3">
  329. <meta name="select:post shadow transparency" title="40%" content="0.4">
  330. <meta name="select:post shadow transparency" title="50%" content="0.5">
  331. <meta name="select:post shadow transparency" title="60%" content="0.6">
  332. <meta name="select:post shadow transparency" title="70%" content="0.7">
  333. <meta name="select:post shadow transparency" title="80%" content="0.8">
  334. <meta name="select:post shadow transparency" title="100%" content="1">
  335.  
  336. <meta name="select:post padding" title="14px" content="14px">
  337. <meta name="select:post padding" title="0px" content="0px">
  338. <meta name="select:post padding" title="10px" content="10px">
  339. <meta name="select:post padding" title="18px" content="18px">
  340. <meta name="select:post padding" title="22px" content="22px">
  341.  
  342. <meta name="select:photoset spacing" title="4px" content="4px">
  343. <meta name="select:photoset spacing" title="2px" content="2px">
  344. <meta name="select:photoset spacing" title="6px" content="6px">
  345. <meta name="select:photoset spacing" title="8px" content="8px">
  346. <meta name="select:photoset spacing" title="10px" content="10px">
  347.  
  348. <meta name="select:grayscale images" title="off" content="off">
  349. <meta name="select:grayscale images" title="reblogger icon only" content="rb-ico">
  350. <meta name="select:grayscale images" title="everything in posts" content="everything">
  351.  
  352. <meta name="select:click tags" title="yes" content="yes">
  353. <meta name="select:click tags" title="no" content="no">
  354.  
  355. <meta name="select:post spacing" title="50px" content="50px">
  356. <meta name="select:post spacing" title="25px" content="25px">
  357. <meta name="select:post spacing" title="30px" content="30px">
  358. <meta name="select:post spacing" title="35px" content="35px">
  359. <meta name="select:post spacing" title="40px" content="40px">
  360. <meta name="select:post spacing" title="45px" content="45px">
  361. <meta name="select:post spacing" title="55px" content="55px">
  362. <meta name="select:post spacing" title="60px" content="60px">
  363. <meta name="select:post spacing" title="65px" content="65px">
  364. <meta name="select:post spacing" title="70px" content="70px">
  365. <meta name="select:post spacing" title="75px" content="75px">
  366.  
  367. <meta name="select:&#9472;&#9472;&#9472;&#9472;&#9472;&#9472; &#x2740;&bull;&deg;&#x2740;&deg;&bull;&#x2740; &#9472;&#9472;&#9472;&#9472;&#9472;&#9472;&#8202;&#8202;&#8202;&#8202;">
  368.  
  369. <meta name="select:theme credit location" title="bottom corner" content="bot">
  370. <meta name="select:theme credit location" title="sidebar" content="in-sb">
  371.  
  372. <meta name="select:tumblr controls color" title="white" content="white">
  373. <meta name="select:tumblr controls color" title="black" content="black">
  374.  
  375. <meta name="select:background image type" title="small" content="repeat">
  376. <meta name="select:background image type" title="large" content="full">
  377.  
  378. <meta name="if:show music player" content="1">
  379. <meta name="if:show music player" content="0">
  380.  
  381. <!--------- TEXT FIELDS --------->
  382. <meta name="text:description" content="Maybe love is &lt;i&gt;not supposed to be&lt;/i&gt; like fireworks, shortness of breath, or powerful oceans. Maybe love is the &lt;b&gt;kiss of sunlight&lt;/b&gt; on cold, goosebumped skin. Maybe love is the pure and gentle beauty of the most ordinary things, and we simply aren&rsquo;t looking close enough to see it. &amp;mdash; &lt;a href=&quot;https://wnq-writers.tumblr.com/post/148226119736&quot; title=&quot;@slow-it-down-dear&quot;&gt;Z.M.&lt;/a&gt;">
  383.  
  384. <meta name="text:sidebar corner title" content="As long as I'm here, you're invincible.">
  385. <meta name="text:sidebar vertical title" content="radiance">
  386.  
  387. <meta name="text:&#x2B50; PLEASE READ THIS GUIDE &#x2B50;" content="docs.google.com/presentation/d/1Ntb6G6nYOz4NcLfHYB_JyJvZPpXQvaQbYCNLttMGREM/edit?usp=sharing">
  388.  
  389. <!-- DO NOT EDIT STUFF HERE, PRESS THE BACK ARROW -->
  390.  
  391. <meta name="text:sidebar hover notifs" content="***&NewLine;[img][https://cdn.discordapp.com/attachments/382037367940448256/915902675428716554/tumblr_8a242fdeb60476edaaf67ea2e2e35594_bba83309_2048.jpg]&NewLine;[msg][&#x201C;you did WHAAT?!&#x201D;]&NewLine;[icon-name][message-dots]&NewLine;[sender][(&#x3E;&#x15DC;&#x3C;)&#x2606; YACHI-SAN]">
  392.  
  393. <!-------------------------------->
  394.  
  395. <meta name="text:&#x2B50; HOW TO LINK MUSIC &#x2B50;" content="linktr.ee/direct_file_links">
  396.  
  397. <!-- DO NOT EDIT STUFF HERE, PRESS THE BACK ARROW -->
  398.  
  399. <meta name="text:music song 1 name" content="&#xA4B0; Baby Bird &#xA4B1; &ndash; Hayashi Yuuki">
  400. <meta name="text:music song 1 mp3" content="https://cdn.discordapp.com/attachments/900670626774265886/912717651875356772/Baby_Bird.mp3">
  401. <meta name="text:music song 1 volume" content="80%">
  402.  
  403. <meta name="text:music song 2 name" content="&#xA4B0; Evolution &#xA4B1; &ndash; Hayashi Yuuki, Tachibana Asami">
  404. <meta name="text:music song 2 mp3" content="https://cdn.discordapp.com/attachments/900670626774265886/912727054376656976/Evolution.mp3">
  405. <meta name="text:music song 2 volume" content="100%">
  406.  
  407. <meta name="text:music song 3 name" content="&#xA4B0; &#x30CF;&#x30FC;&#x30B1;&#x30F3; &#xA4B1; &ndash; Hayashi Yuuki">
  408. <meta name="text:music song 3 mp3" content="https://cdn.discordapp.com/attachments/900670626774265886/912727813243699260/Piton.mp3">
  409. <meta name="text:music song 3 volume" content="100%">
  410.  
  411. <meta name="text:customlink 1 name" content="sample link">
  412. <meta name="text:customlink 1 url" content="https://youtube.com/watch?v=ZkNMZlkrzaU">
  413. <meta name="text:customlink 2 name" content="">
  414. <meta name="text:customlink 2 url" content="">
  415. <meta name="text:customlink 3 name" content="">
  416. <meta name="text:customlink 3 url" content="">
  417. <meta name="text:customlink 4 name" content="">
  418. <meta name="text:customlink 4 url" content="">
  419. <meta name="text:customlink 5 name" content="">
  420. <meta name="text:customlink 5 url" content="">
  421. <meta name="text:customlink 6 name" content="">
  422. <meta name="text:customlink 6 url" content="">
  423. <meta name="text:customlink 7 name" content="">
  424. <meta name="text:customlink 7 url" content="">
  425. <meta name="text:customlink 8 name" content="">
  426. <meta name="text:customlink 8 url" content="">
  427.  
  428. <meta name="text:how to change the icon &#8211; go to this website, pick an icon you like, copy its name (don't click on it) and replace 'sparkle' with your icon name" content="https://phosphoricons.com/#toolbar">
  429. <meta name="text:bottom permalink icon" content="sparkle">
  430.  
  431. <!--------------------------------------------------->
  432.  
  433. <style type="text/css">
  434.  
  435. @font-face { font-family: "dharko gilbert"; src: url('//glen-assets.github.io/fonts/Dharko Gilbert.ttf'); }
  436.  
  437. /*-------- TUMBLR CONTROLS --------*/
  438. iframe#tumblr_controls, .iframe-controls--desktop {
  439. top:5px!important;
  440. right:5px!important;
  441. position:fixed!important;
  442.  
  443. transform:scale(0.65,0.65);
  444. -webkit-transform:scale(0.65,0.65);
  445.  
  446. transform-origin:100% 0;
  447. z-index:11!important;
  448. user-select:none;
  449. }
  450.  
  451. [tumblr-controls="black"] iframe#tumblr_controls,
  452. [tumblr-controls="black"] .iframe-controls--desktop {
  453. filter:invert(100%) hue-rotate(180deg)!important;
  454. -webkit-filter:invert(100%) hue-rotate(180deg)!important;
  455. }
  456.  
  457. .tmblr-iframe--follow-teaser, .follow-teaser, .iframe-controls--phone-mobile, .tmblr-iframe--app-cta-button {
  458. display:none!important;
  459. }
  460.  
  461. /*------- SCROLLBAR --------*/
  462. ::-webkit-scrollbar {
  463. width:var(--Scrollbar-Padding);
  464. height:0;
  465. background-color:{color:scrollbar background};
  466. }
  467.  
  468. ::-webkit-scrollbar-thumb {
  469. background-color:{color:scrollbar};
  470. border:calc((var(--Scrollbar-Padding) - 1px) / 2) solid transparent;
  471. border-top:calc(var(--Scrollbar-Padding) / 1.69) solid transparent;
  472. border-bottom:calc(var(--Scrollbar-Padding) / 1.69) solid transparent;
  473. background-clip:padding-box;
  474. }
  475.  
  476. ::-webkit-scrollbar-corner {
  477. background:{color:scrollbar background};
  478. }
  479.  
  480. /*------- TOOLTIPS --------*/
  481. #s-m-t-tooltip {
  482. padding:8px 9px 5px 9px;
  483.  
  484. margin:17px;
  485. background-color:{color:post};
  486. border-radius:2px;
  487. border:1px solid rgba({RGBcolor:text},0.25);
  488. font-family:var(--SmallCaps-Font-Family);
  489. font-size:calc(var(--SmallCaps-Font-Size) - .5px);
  490. letter-spacing:1px;
  491. text-transform:uppercase;
  492. color:{color:text};
  493. line-height:var(--Line-Height);
  494. z-index:99;
  495. max-width:40vw;
  496. }
  497.  
  498. /*---- GLOBAL FONT SETTINGS -----*/
  499. [font]{
  500. font-family:var(--Body-Font-Family);
  501. font-size:var(--Body-Font-Size);
  502. color:var(--Body-Text-Color);
  503. }
  504.  
  505. [font="Libre Franklin"]{
  506. font-size:calc(var(--Body-Font-Size) - .5px)!important;
  507. letter-spacing:0.1px;
  508. }
  509.  
  510. [font="Manrope"],
  511. [font="Archivo"]{
  512. font-size:calc(var(--Body-Font-Size) - .7px)!important;
  513. letter-spacing:0.3px;
  514. }
  515.  
  516. [font="Inter"]{
  517. font-size:calc(var(--Body-Font-Size) - .7px)!important;
  518. }
  519.  
  520. [font="Rubik"]{
  521. font-weight:400;
  522. }
  523.  
  524. /*------- TEXT HIGHLIGHT --------*/
  525. ::selection {
  526. background:{color:text selection background};
  527. color:{color:text selected};
  528. }
  529.  
  530. ::-moz-selection {
  531. background:{color:text selection background};
  532. color:{color:text selected};
  533. }
  534.  
  535. /*------- BASICS --------*/
  536. html, body {
  537. scrollbar-width:thin; /* firefox only */
  538. }
  539.  
  540. body {
  541. margin:0;
  542. background-color:{color:background};
  543. background-image:url('{image:background image}');
  544. background-attachment:fixed;
  545. overscroll-behavior-y:none;
  546. }
  547.  
  548. [bg-type="repeat"] body {
  549. background-repeat:repeat;
  550. }
  551.  
  552. [bg-type="full"] body {
  553. background-repeat:no-repeat;
  554. background-size:cover;
  555. background-position:center;
  556. }
  557.  
  558. a {
  559. text-decoration:none;
  560. color:var(--Link);
  561. }
  562.  
  563. a[title][class*="smt-current-element"]:not([href]){
  564. cursor:help;
  565. }
  566.  
  567. a[title=""]:not([href]){
  568. cursor:initial;
  569. }
  570.  
  571. p {
  572. margin:var(--Paragraph-Margins) 0;
  573. }
  574.  
  575. blockquote {
  576. margin:var(--Paragraph-Margins);
  577. margin-right:0;
  578. padding-left:var(--Paragraph-Margins);
  579. border-left:1px solid rgba({RGBcolor:text},0.169);
  580. }
  581.  
  582. h1, h2, h3, h4, h5, h6, .linkpost-title {
  583. margin:var(--Heading-Margins) 0;
  584. font-family:var(--Heading-Font-Family);
  585. font-size:var(--Body-Font-Size);
  586. text-transform:uppercase;
  587. letter-spacing:.3px;
  588. word-spacing:.7px;
  589. line-height:calc(var(--Line-Height) * 1.1);
  590. }
  591.  
  592. img, iframe {
  593. vertical-align:middle;
  594. max-width:100%;
  595. }
  596.  
  597. figure {
  598. margin:0;
  599. }
  600.  
  601. pre, code {
  602. white-space:pre-wrap;
  603. font-family:cousine;
  604. font-size:calc(var(--Body-Font-Size) - 2px);
  605. background:{color:special background};
  606. border:1px solid {color:special border};
  607. color:{color:special text};
  608. }
  609.  
  610. pre {
  611. padding:0.8em 1em;
  612. }
  613.  
  614. code {
  615. padding:3px 4px;
  616. }
  617.  
  618. hr {
  619. display:block;
  620. margin:var(--Heading-Margins) auto;
  621. border-width:0px;
  622. width:69%;
  623. height:1px;
  624. background:{color:post borders inner};
  625. }
  626.  
  627. a.read_more {
  628. display:block;
  629. margin-bottom:-3px;
  630. font-family:var(--SmallCaps-Font-Family);
  631. font-size:calc(var(--SmallCaps-Font-Size) + 2px);
  632. text-transform:uppercase;
  633. letter-spacing:.7px;
  634. text-align:center;
  635. }
  636.  
  637. ul, ol {
  638. margin:var(--Paragraph-Margins) 0;
  639. margin-left:1.69em;
  640. padding:0;
  641. }
  642.  
  643. ol li {
  644. padding-left:0.420em;
  645. }
  646.  
  647. ul li {
  648. position:relative;
  649. padding-left:0.25em;
  650. margin-left:calc((var(--Body-Font-Size) * 1.420) - 3px);
  651. list-style:none;
  652. }
  653.  
  654. ul li:before {
  655. content:"";
  656. position:absolute;
  657. margin-top:calc(((var(--Body-Font-Size) * var(--Line-Height-INT)) / 2) - 0px);
  658. transform:translateY(-50%);
  659. left:0;margin-left:calc((var(--Body-Font-Size) * -1.420) - 3px);
  660. width:var(--Body-Font-Size);
  661. height:.7px;
  662. background:rgba({RGBcolor:text},0.420);
  663. }
  664.  
  665. b, strong {
  666. color:{color:bold};
  667. }
  668.  
  669. [font="Manrope"] b, [font="Manrope"] strong,
  670. [font="Archivo"] b, [font="Archivo"] strong,
  671. [font="Karla"] b, [font="Karla"] strong {
  672. font-weight:700;
  673. }
  674.  
  675. [font="Open Sans"] b, [font="Open Sans"] strong,
  676. [font="Sen"] b, [font="Sen"] strong,
  677. [font="Inter"] b, [font="Inter"] strong,
  678. [font="Libre Franklin"] b, [font="Libre Franklin"] strong {
  679. font-weight:600;
  680. }
  681.  
  682. [font="Rubik"] b, [font="Rubik"] strong {
  683. font-weight:500;
  684. }
  685.  
  686. i:not([class]), em:not([class]){
  687. color:{color:italic};
  688. }
  689.  
  690. .flex, [flex]{
  691. display:flex!important;
  692. align-items:center;
  693. }
  694.  
  695. :root {
  696. /*--- SIDEBAR SETTINGS ---*/
  697. --Sidebar-Width:{select:sidebar width};
  698.  
  699. --Sidebar-Top-Icons-Size:12px;
  700. --Sidebar-Top-Icons-Spacing:7px;
  701. --Sidebar-Top-Icons-Edge-Offset:10px;
  702.  
  703. --Sidebar-Desc-Width:80%;
  704. --Sidebar-Desc-Width-INT:0.8; /* divide above number by 100 */
  705.  
  706. --Sidebar-Avatar-Size:28px;
  707. --Sidebar-Notif-Padding:10px;
  708. --Sidebar-Notif-Corner-Roundness:5px;
  709. --Sidebar-Notif-Row-Spacing:8px;
  710. --Sidebar-Notif-Dismiss-Speed:350ms;
  711. --Sidebar-Notif-Dismiss-Speed-INT:350;
  712.  
  713. --Sidebar-Vertical-Title-Size:{select:sidebar title size};
  714. --Sidebar-Image-Roundness:3px;
  715. --Sidebar-Image-Frame-Front-Roundness:3px;
  716. --Sidebar-Image-Frame-Back-Roundness:3px;
  717. --Sidebar-Frame-Indent:10px;
  718.  
  719. --MusicPlayer-Icon-Size:12px;
  720. --MusicPlayer-Icon-Spacing:9px;
  721. --MusicPlayer-Icon-Padding:10px;
  722.  
  723. --MusicPlayer-Padding:10px;
  724. --MusicPlayer-Text-Size:8px;
  725. --MusicPlayer-Text-Fade-Speed:200ms;
  726. --MusicPlayer-Text-Fade-Speed-RAW:200;
  727.  
  728. --Autoplay-First-Song:no;
  729. --Autoplay-Next-Song:yes;
  730. --Loop-Playlist-Infinitely:yes;
  731.  
  732. --CustomLinks-Per-Row:{select:customlinks per row};
  733. --CustomLinks-Font-Size:calc(var(--SmallCaps-Font-Size) - 1px);
  734. --CustomLinks-Padding:7px;
  735. --CustomLinks-Spacing:7px;
  736.  
  737. --Center-Aisle-Gaps:{select:center gaps};
  738.  
  739. /*--- POST SETTINGS ---*/
  740. --Header-Icon-Size:{select:header icon size};
  741. --Header-Icon-Padding:5px;
  742.  
  743. --Desc-Left-Gap:15px;
  744. --Desc-Box-Padding:15px;
  745.  
  746. --Paragraph-Margins:1em;
  747. --Heading-Margins:1em;
  748.  
  749. --Body-Font-Family:{select:font};
  750. --Body-Font-Size:{select:font size};
  751. --Body-Text-Color:{color:text};
  752.  
  753. --Line-Height:1.7em; /* line-height with suffix */
  754. --Line-Height-INT:1.7; /* line-height without suffix */
  755.  
  756. --Heading-Font-Family:"Delius Unicase";
  757. --Heading-Font-Size:calc(var(--Body-Font-Size) + 1px);
  758.  
  759. --SmallCaps-Font-Family:"Manjari";
  760. --SmallCaps-Font-Size:calc(var(--Body-Font-Size) - 3px);
  761.  
  762. --Post-Width:{select:post width};
  763. --Post-Shadow-Size:10px;
  764. --Post-Padding:{select:post padding};
  765. --Post-Spacing:{select:post spacing};
  766.  
  767. --Posts-Corner-Roundness:3px;
  768. --Dots-Menu-Icon-Size:calc(var(--Body-Font-Size) + 4px);
  769. --Post-Menu-Roundness:3px;
  770. --Post-Menu-Padding:7px;
  771. --Post-Menu-Fade-Speed:0.420s;
  772.  
  773. --Reblogger-Avatar-Size:22px;
  774. --Reblogger-Avatar-Gap-Right:8px;
  775. --Reblogger-Username-Color:{color:reblogger name};
  776. --Reblogger-Avatar-Bottom-Gap:9px;
  777.  
  778. --Reblogs-Spacing:15px;
  779. --Reblogs-Border:{color:post borders inner};
  780.  
  781. --Captions-Gap:15px;
  782. --NPF-Caption-Spacing:var(--Captions-Gap);
  783.  
  784. --Photoset-Spacing:{select:photoset spacing};
  785. --NPF-Image-Spacing:var(--Photoset-Spacing);
  786.  
  787. --Grayscale-Settings:grayscale(100%) contrast(110%) brightness(104%);
  788. --Grayscale-Transition-Speed:0.269s;
  789.  
  790. --AskerPortrait-Size:42px;
  791. --AskerPortrait-Padding:6px;
  792.  
  793. --Audio-Post-Album-Size:64px;
  794. --Audio-Post-Album-Right-Gap:13px;
  795. --Audio-Post-Buttons-Size:11px;
  796. --Audio-Post-Buttons-Color:{color:special text};
  797. --Audio-Post-Buttons-Padding:11px;
  798. --Audio-Post-Buttons-Background:{color:special background};
  799.  
  800. --Link:{color:link};
  801. --Post-Borders-Inner:{color:post borders inner};
  802.  
  803. --Quote-Font-Family:var(--Heading-Font-Family);
  804. --Quote-Font-Size:calc(var(--Body-Font-Size) - 1px);
  805.  
  806. --Asker-Avatar-Size:35px;
  807. --Asker-Avatar-Padding:4px;
  808.  
  809. /*--- TAGS SETTINGS ---*/
  810. --Tags-Fade-Speed-MS:269; /* fade speed without suffix */
  811. --Tags-Fade-Speed-MS-SFX:269ms; /* fade speed with suffix */
  812. --Tags-Spacing:4px;
  813.  
  814. /*--- PERMALINK SETTINGS ---*/
  815. --Permalink-Text-Spacing:14px;
  816.  
  817. /*--- POST BUTTONS SETTINGS ---*/
  818. --Post-Buttons-Size:var(--Body-Font-Size);
  819. --Post-Buttons-Color:{color:post buttons};
  820. --Like-Button-Liked:{color:like button liked};
  821. --Post-Buttons-Spacing:4px;
  822.  
  823. /*--- POST NOTES SETTINGS ---*/
  824. --Notes-Indicator-Size:14px;
  825. --Notes-Indicator-Gap-Right:7px;
  826. --Notes-Row-Spacing:9px;
  827.  
  828. /*--- MISC ---*/
  829. --Pagination-Color:{color:text};
  830.  
  831. --TumblrControls-Color:{select:tumblr controls color};
  832.  
  833. --Scrollbar-Padding:13px;
  834. }
  835.  
  836. /*---- MAIN CONTENT CONTAINER ----*/
  837. .mynoots {
  838. margin:auto;
  839. text-align:center;
  840. }
  841.  
  842. .nymoots {
  843. display:inline-block;
  844. text-align:initial;
  845. margin-left:var(--Post-Shadow-Size);
  846. }
  847.  
  848. .ensoot {
  849. display:flex;
  850. flex-wrap:nowrap;
  851. }
  852.  
  853. /*---- LEFT SIDEBAR ----*/
  854. .left-sb {
  855. position:fixed;
  856. margin-left:calc(var(--Sidebar-Vertical-Title-Size) / -2);
  857. width:var(--Sidebar-Width);
  858. height:100vh;
  859. display:table;
  860. z-index:9;
  861. }
  862.  
  863. .lbs {
  864. display:table-cell;
  865. vertical-align:middle;
  866. }
  867.  
  868. .el-present {
  869. position:relative;
  870. width:var(--Sidebar-Width);
  871. {block:ifshowmusicplayer}
  872. padding-bottom:calc(var(--MusicPlayer-Text-Size) + (var(--MusicPlayer-Padding) * 2));
  873. {/block:ifshowmusicplayer}
  874. }
  875.  
  876. /*---- SIDEBAR FRAME FRONT ----*/
  877. .el-present:before {
  878. content:"";
  879. position:absolute;
  880. top:0;margin-top:var(--Sidebar-Frame-Indent);
  881. left:0;margin-left:calc(0px - var(--Sidebar-Frame-Indent));
  882. width:100%;
  883. height:100%;
  884. border:1px solid rgba({RGBcolor:sidebar frame front},calc(1 - {select:sidebar frame front transparency}));
  885. box-sizing:border-box;
  886. mix-blend-mode:color-dodge;
  887. border-radius:var(--Sidebar-Image-Frame-Front-Roundness);
  888. z-index:3;
  889. }
  890.  
  891. /*---- SIDEBAR FRAME BACK ----*/
  892. .el-present:after {
  893. content:"";
  894. position:absolute;
  895. top:0;margin-top:calc(0px - var(--Sidebar-Frame-Indent));
  896. right:0;margin-right:calc(0px - var(--Sidebar-Frame-Indent));
  897. width:100%;
  898. height:100%;
  899. border:1px solid rgba({RGBcolor:sidebar frame back},calc(1 - {select:sidebar frame back transparency}));
  900. box-sizing:border-box;
  901. border-radius:var(--Sidebar-Image-Frame-Back-Roundness);
  902. z-index:-1;
  903. }
  904.  
  905. /*---- MAIN SIDEBAR IMAGE ----*/
  906. .moolait {
  907. position:relative;
  908. }
  909.  
  910. .moolait:after {
  911. content:"";
  912. position:absolute;
  913. top:0;
  914. left:0;
  915. width:100%;
  916. height:100%;
  917. z-index:-1;
  918. }
  919.  
  920. .moolait, .moolait:after {
  921. background:{color:sidebar hover background};
  922.  
  923. {block:ifshowmusicplayer}
  924. border-radius:var(--Sidebar-Image-Roundness) var(--Sidebar-Image-Roundness) 0 0;
  925. {/block:ifshowmusicplayer}
  926.  
  927. {block:ifnotshowmusicplayer}
  928. border-radius:var(--Sidebar-Image-Roundness);
  929. {/block:ifnotshowmusicplayer}
  930. }
  931.  
  932. .mooed .main-sb-img {
  933. opacity:0;
  934. }
  935.  
  936. .main-sb-img {
  937. width:100%;
  938. height:auto;
  939.  
  940. {block:ifshowmusicplayer}
  941. border-radius:var(--Sidebar-Image-Roundness) var(--Sidebar-Image-Roundness) 0 0;
  942. {/block:ifshowmusicplayer}
  943.  
  944. {block:ifnotshowmusicplayer}
  945. border-radius:var(--Sidebar-Image-Roundness);
  946. {/block:ifnotshowmusicplayer}
  947.  
  948. transition:opacity 0.420s ease-in-out; /* mouse leave */
  949. }
  950.  
  951. .mooed .main-sb-img {
  952. transition:opacity 0.25s ease-in-out; /* mouse enter */
  953. }
  954.  
  955. .main-sb-img::-moz-selection {background:transparent;}
  956. .main-sb-img::selection {background:transparent;}
  957.  
  958. /*---- SIDEBAR TOP ROW ----*/
  959. .martiny {
  960. position:absolute;
  961. top:0;margin-top:calc(var(--Sidebar-Frame-Indent) + 1px + var(--Sidebar-Top-Icons-Edge-Offset));
  962. left:0;margin-left:calc(1px + var(--Sidebar-Top-Icons-Edge-Offset));
  963. width:calc(100% - 2px - var(--Sidebar-Frame-Indent) - (var(--Sidebar-Top-Icons-Edge-Offset) * 2));
  964. display:flex;
  965. align-items:center;
  966. justify-content:space-between;
  967. z-index:13;
  968. }
  969.  
  970. .bubun {
  971. position:relative;
  972. overflow:hidden;
  973. display:flex;
  974. align-items:center;
  975. margin-left:2px;
  976. margin-right:5px;
  977. font-family:delius unicase;
  978. text-transform:uppercase;
  979. font-size:{select:sidebar corner title size};
  980. color:{color:sidebar corner title};
  981. letter-spacing:.5px;
  982. word-spacing:.7px;
  983. line-height:1em;
  984. white-space:nowrap;
  985. z-index:5;
  986. }
  987.  
  988. .bubun span {
  989. display:block;
  990. height:100%;
  991. }
  992.  
  993. .moomoo {
  994. transform:translateX(100%);
  995. animation:scroll-left 6.9s linear infinite;
  996. }
  997.  
  998. .tubbz {
  999. display:flex;
  1000. align-items:center;
  1001. z-index:5;
  1002. }
  1003.  
  1004. .tubbz > * {
  1005. display:block;
  1006. margin-left:var(--Sidebar-Top-Icons-Spacing);
  1007. line-height:var(--Sidebar-Top-Icons-Size);
  1008. }
  1009.  
  1010. .tubbz .bi {
  1011. font-size:var(--Sidebar-Top-Icons-Size);
  1012. color:{color:sidebar top icons};
  1013. }
  1014.  
  1015. .tubbz [class*='bi-battery']{
  1016. font-size:calc(var(--Sidebar-Top-Icons-Size) + 2px);
  1017. }
  1018.  
  1019. /*---- SIDEBAR VERTICAL TITLE ----*/
  1020. .hoez {
  1021. position:absolute;
  1022. top:50%;
  1023. right:0;
  1024. white-space:nowrap;
  1025. font-family:Dharko Gilbert;
  1026. font-size:var(--Sidebar-Vertical-Title-Size);
  1027. text-transform:uppercase;
  1028. letter-spacing:0.08em;
  1029. color:{color:sidebar title};
  1030. transform:rotate(-90deg) translateY(-50%);
  1031. transform-origin:center;
  1032. height:1em;
  1033. z-index:10;
  1034. }
  1035.  
  1036. .hoez[t-shad="yes"]{
  1037. text-shadow:-1px 2px 2.5px {color:sidebar title shadow};
  1038. }
  1039.  
  1040. .hoez[t-outline="yes"]{
  1041. text-shadow:.5px .5px 0px {color:sidebar title outline}, -.5px -.5px 0px {color:sidebar title outline}, .5px -.5px 0px {color:sidebar title outline}, -.5px .5px 0px {color:sidebar title outline};
  1042. }
  1043.  
  1044. .hoez[t-shad="yes"][t-outline="yes"]{
  1045. text-shadow:-1px 2px 2.5px {color:sidebar title shadow}, .5px .5px 0px {color:sidebar title outline}, -.5px -.5px 0px {color:sidebar title outline}, .5px -.5px 0px {color:sidebar title outline}, -.5px .5px 0px {color:sidebar title outline};
  1046. }
  1047.  
  1048. .hoez span {
  1049. display:block;
  1050. margin-top:50%;
  1051. padding-top:calc(var(--Sidebar-Vertical-Title-Size) / 2);
  1052. margin-left:var(--Sidebar-Frame-Indent);
  1053. -webkit-font-smoothing:antialiased;
  1054. }
  1055.  
  1056. /*---- SIDEBAR MUSIC PLAYER ----*/
  1057. /* sorry for the mess lmao */
  1058. .botstick, .bingbong {
  1059. position:absolute;
  1060. left:0;bottom:0;
  1061. width:100%;
  1062. border-radius:0 0 var(--Sidebar-Image-Roundness) var(--Sidebar-Image-Roundness);
  1063. height:calc(var(--MusicPlayer-Text-Size) + (var(--MusicPlayer-Padding) * 2));
  1064. padding-left:var(--MusicPlayer-Padding);
  1065. padding-right:calc(var(--Sidebar-Frame-Indent) + 1px);
  1066. background:{color:music player background};
  1067. box-sizing:border-box;
  1068. z-index:0;
  1069. }
  1070.  
  1071. .bingbong {
  1072. display:flex;
  1073. align-items:center;
  1074. justify-content:center;
  1075. background:transparent;
  1076. z-index:9; /* was 13 */
  1077. }
  1078.  
  1079. .bingbong:after {
  1080. content:"";
  1081. position:absolute;
  1082. top:0;
  1083. right:0;margin-right:calc(var(--Sidebar-Frame-Indent) + 1px);
  1084. width:var(--MusicPlayer-Padding);
  1085. height:100%;
  1086. background:{color:music player background};
  1087. }
  1088.  
  1089. .dingding {
  1090. position:relative;
  1091. font-family:Delius Unicase;
  1092. font-size:var(--MusicPlayer-Text-Size);
  1093. text-transform:uppercase;
  1094. letter-spacing:.7px;
  1095. color:{color:music player text};
  1096. line-height:1em;
  1097. white-space:nowrap;
  1098. overflow:hidden;
  1099. }
  1100.  
  1101. .dingding span, .bongfade {
  1102. transition:opacity var(--MusicPlayer-Text-Fade-Speed) ease-in-out;
  1103. }
  1104.  
  1105. .dingding span:not(:first-child){
  1106. display:none;
  1107. }
  1108.  
  1109. .bongfade {
  1110. opacity:0;
  1111. }
  1112.  
  1113. .markee {
  1114. position:relative;
  1115. overflow:hidden;
  1116. }
  1117.  
  1118. .marinah {
  1119. width:calc(100% + (var(--Sidebar-Frame-Indent) * 2));
  1120. height:100%;
  1121. transform:translateX(100%);
  1122. animation:scroll-left 10s linear infinite;
  1123. }
  1124.  
  1125. @keyframes scroll-left {
  1126. 0% {
  1127. transform: translateX(100%);
  1128. }
  1129. 100% {
  1130. transform: translateX(-100%);
  1131. }
  1132. }
  1133.  
  1134. .lvttvce {
  1135. position:absolute;
  1136. left:0;bottom:0;
  1137. margin-bottom:calc(var(--MusicPlayer-Text-Size) + (var(--MusicPlayer-Padding) * 2) + 10px);
  1138. width:100%;
  1139. z-index:13;
  1140. }
  1141.  
  1142. .peev {
  1143. position:absolute;
  1144. margin-left:calc(50% - (var(--MusicPlayer-Icon-Size) / 2) - var(--MusicPlayer-Icon-Padding) - var(--MusicPlayer-Icon-Size) - var(--MusicPlayer-Icon-Spacing) - 6px);
  1145. bottom:0;margin-bottom:calc(var(--MusicPlayer-Icon-Padding) - 6px);
  1146. font-size:var(--MusicPlayer-Icon-Size);
  1147. color:{color:music player controls B};
  1148. padding:6px;
  1149. z-index:9;
  1150. }
  1151.  
  1152. .neet {
  1153. position:absolute;
  1154. right:0;
  1155. margin-right:calc(50% - (var(--MusicPlayer-Icon-Size) / 2) - var(--MusicPlayer-Icon-Padding) - var(--MusicPlayer-Icon-Size) - var(--MusicPlayer-Icon-Spacing) - 6px);
  1156. bottom:0;margin-bottom:calc(var(--MusicPlayer-Icon-Padding) - 6px);
  1157. font-size:var(--MusicPlayer-Icon-Size);
  1158. color:{color:music player controls B};
  1159. padding:6px;
  1160. z-index:9;
  1161. }
  1162.  
  1163. .peev, .neet {
  1164. cursor:pointer!important;
  1165. }
  1166.  
  1167. .qorqle {
  1168. margin:auto;
  1169. width:calc(var(--MusicPlayer-Icon-Size) + (var(--MusicPlayer-Icon-Padding) * 2));
  1170. height:calc(var(--MusicPlayer-Icon-Size) + (var(--MusicPlayer-Icon-Padding) * 2));
  1171. border-radius:100%;
  1172. background:{color:music player circle};
  1173. display:flex;
  1174. align-items:center;
  1175. justify-content:center;
  1176. cursor:pointer;
  1177. z-index:10;
  1178. }
  1179.  
  1180. .qorqle i {
  1181. font-size:var(--MusicPlayer-Icon-Size);
  1182. color:{color:music player controls A};
  1183. line-height:0px;
  1184. }
  1185.  
  1186. .qorqle:active i {
  1187. font-size:calc(var(--MusicPlayer-Icon-Size) - 3px);
  1188. }
  1189.  
  1190. .vause {
  1191. display:none;
  1192. }
  1193.  
  1194. /*---- SIDEBAR NOTIF BLOCKS ----*/
  1195. .paindesk {
  1196. position:absolute;
  1197. top:0;
  1198. left:0;
  1199. width:var(--Sidebar-Width);
  1200.  
  1201. {block:ifnotshowmusicplayer}
  1202. height:100%;
  1203. {/block:ifnotshowmusicplayer}
  1204.  
  1205. {block:ifshowmusicplayer}
  1206. height:calc(100% - var(--MusicPlayer-Text-Size) - (var(--MusicPlayer-Padding) * 2));
  1207. {/block:ifshowmusicplayer}
  1208. display:table;
  1209. opacity:calc(1 - {select:notif panel transparency});
  1210. z-index:12;
  1211. transition:opacity 0.420s ease-in-out; /* mouse leave */
  1212. }
  1213.  
  1214. .paindesk:hover {
  1215. opacity:1;
  1216. transition:opacity 0.25s ease-in-out; /* mouse enter */
  1217. }
  1218.  
  1219. .muchpain {
  1220. display:table-cell;
  1221. vertical-align:middle;
  1222. }
  1223.  
  1224. .chellfish {
  1225. {block:ifnotsidebarverticaltitle}
  1226. margin-left:calc((var(--Sidebar-Width) - (var(--Sidebar-Width) * var(--Sidebar-Desc-Width-INT))) / 2);
  1227. {/block:ifnotsidebarverticaltitle}
  1228.  
  1229. {block:ifsidebarverticaltitle}
  1230. margin-left:calc(((var(--Sidebar-Width) - (var(--Sidebar-Width) * var(--Sidebar-Desc-Width-INT))) / 2) - 7px);
  1231. {/block:ifsidebarverticaltitle}
  1232.  
  1233. margin-top:10px;
  1234. width:calc(var(--Sidebar-Width) * var(--Sidebar-Desc-Width-INT));
  1235. box-sizing:border-box;
  1236. backface-visibility:hidden;
  1237. overflow:hidden;
  1238. }
  1239.  
  1240. .notif-wrap {
  1241. transition:transform 0.25s ease-in-out;
  1242. }
  1243.  
  1244. .notif-wrap:hover {
  1245. transform:scale(1.069);
  1246. transform-origin:center;
  1247. }
  1248.  
  1249. .notif-wrap + .notif-wrap {
  1250. margin-top:var(--Sidebar-Notif-Row-Spacing);
  1251. }
  1252.  
  1253. .notif-block {
  1254. width:100%;
  1255. padding:var(--Sidebar-Notif-Padding);
  1256. background:rgba({RGBcolor:notif background},calc(1 - {select:notif transparency}));
  1257. box-sizing:border-box;
  1258. border-radius:var(--Sidebar-Notif-Corner-Roundness);
  1259. display:flex;
  1260. align-items:center;
  1261. transition:background-color 0.25s ease-in-out;
  1262. }
  1263.  
  1264. .notif-block:hover {
  1265. background:rgba({RGBcolor:notif background},1);
  1266. }
  1267.  
  1268. .calicow {
  1269. transition:opacity var(--Sidebar-Notif-Dismiss-Speed) ease-in-out;
  1270. }
  1271.  
  1272. .calicow {
  1273. opacity:0;
  1274. }
  1275.  
  1276. .avowrap {
  1277. position:relative;
  1278. width:var(--Sidebar-Avatar-Size);
  1279. height:var(--Sidebar-Avatar-Size);
  1280. border-radius:100%;
  1281. background-size:cover;
  1282. background-position:center;
  1283. flex-shrink:0;
  1284. }
  1285.  
  1286. .mini-avi {
  1287. position:absolute;
  1288. top:0;left:0;
  1289. width:var(--Sidebar-Avatar-Size);
  1290. height:var(--Sidebar-Avatar-Size);
  1291. border-radius:100%;
  1292. opacity:0;
  1293. z-index:2;
  1294. }
  1295.  
  1296. .avowrap + .notif-text {
  1297. margin-left:9px;
  1298. }
  1299.  
  1300. .notif-text {
  1301. font-size:var(--SmallCaps-Font-Size);
  1302. cursor:default;
  1303. }
  1304.  
  1305. .notif-text [top]{
  1306. font-family:delius unicase;
  1307. font-size:calc(var(--SmallCaps-Font-Size) - 1.5px);
  1308. letter-spacing:.5px;
  1309. color:{color:sidebar notif text A};
  1310. }
  1311.  
  1312. .notif-text .iconsax {
  1313. margin-right:4px;
  1314. --Iconsax-Size:calc(var(--SmallCaps-Font-Size) + 3px);
  1315. --Iconsax-Color:{color:sidebar notif icon};
  1316. }
  1317.  
  1318. .notif-text [top] + [bot]{
  1319. margin-top:4px;
  1320. }
  1321.  
  1322. .notif-text [bot]{
  1323. display:flex;
  1324. font-size:calc(var(--SmallCaps-Font-Size) - 1px);
  1325. text-transform:uppercase;
  1326. letter-spacing:.7px;
  1327. color:{color:sidebar notif text B};
  1328. }
  1329.  
  1330. .notif-text [bot] span {
  1331. display:block;
  1332. }
  1333.  
  1334. /*---- CUSTOM LINKS ----*/
  1335. .ceels {
  1336. margin-top:calc(var(--Sidebar-Frame-Indent) + 12px);
  1337. width:100%;
  1338. }
  1339.  
  1340. .pengweng {
  1341. margin:calc(var(--CustomLinks-Spacing) / -2);
  1342. margin-bottom:calc(0px - var(--CustomLinks-Spacing));
  1343. margin-right:0;
  1344. width:calc(100% + var(--CustomLinks-Spacing));
  1345. display:flex;
  1346. align-items:center;
  1347. justify-content:center;
  1348. flex-wrap:wrap;
  1349. }
  1350.  
  1351. .ceels a {
  1352. margin:calc(var(--CustomLinks-Spacing) / 2);
  1353. display:flex;
  1354. align-items:center;
  1355. justify-content:center;
  1356. width:calc((100% - (var(--CustomLinks-Spacing) * var(--CustomLinks-Per-Row))) / var(--CustomLinks-Per-Row));
  1357. padding:var(--CustomLinks-Padding) calc(var(--CustomLinks-Padding) * 0.8);
  1358.  
  1359. box-sizing:border-box;
  1360. background:{color:customlinks background};
  1361. border-radius:2px;
  1362. font-family:var(--SmallCaps-Font-Family);
  1363. font-size:var(--CustomLinks-Font-Size);
  1364. text-transform:uppercase;
  1365. letter-spacing:1.3px;
  1366. color:{color:customlinks text};
  1367. line-height:calc(var(--CustomLinks-Font-Size) * 1.4);
  1368. text-align:center;
  1369. flex-shrink:0;
  1370. overflow:hidden;
  1371. transition:all 0.25s ease-in-out;
  1372. }
  1373.  
  1374. .ceels span {
  1375. display:block;
  1376. margin-bottom:calc(var(--SmallCaps-Font-Size) * -0.4);
  1377. }
  1378.  
  1379. .ceels a:hover {
  1380. background:{color:customlinks hover bg};
  1381. color:{color:customlinks hover text};
  1382. }
  1383.  
  1384. /*---- AVATAR ICON + DESCRIPTION ----*/
  1385. /* the 'header' thing above the posts */
  1386. .xtoptop {
  1387. position:relative;
  1388. display:flex;
  1389. align-items:center;
  1390. margin-bottom:var(--Post-Spacing);
  1391. width:calc(var(--Post-Width) + (var(--Post-Padding) * 2) + 2px);
  1392. }
  1393.  
  1394. .gdgdgd {
  1395. position:relative;
  1396. width:calc(var(--Header-Icon-Size) + (var(--Header-Icon-Padding) * 2));
  1397. height:calc(var(--Header-Icon-Size) + (var(--Header-Icon-Padding) * 2));
  1398. border:1px solid {color:header icon border A};
  1399. background:{color:header icon border B};
  1400. border-radius:var(--Header-Icon-Roundness);
  1401. flex-shrink:0;
  1402. }
  1403.  
  1404. /*-- round --*/
  1405. [ico-type="round"] .gdgdgd {
  1406. --Header-Icon-Roundness:100%;
  1407. }
  1408.  
  1409. [ico-type="round"] .gdgdgd:after {
  1410. top:0;margin-top:calc(var(--Header-Icon-Padding) + 1px);
  1411. left:0;margin-left:var(--Header-Icon-Padding);
  1412. border-radius:var(--Header-Icon-Roundness);
  1413. width:100%;
  1414. height:100%;
  1415. }
  1416.  
  1417. /*-- soft --*/
  1418. [ico-type="soft"] .gdgdgd {
  1419. --Header-Icon-Roundness:var(--Header-Icon-Padding);
  1420. }
  1421.  
  1422. [ico-type="soft"] .gdgdgd:after {
  1423. border-radius:0 0 0 var(--Header-Icon-Roundness);
  1424. }
  1425.  
  1426. /*-- square --*/
  1427. [ico-type="square"] .gdgdgd {
  1428. --Header-Icon-Roundness:0px;
  1429. }
  1430.  
  1431. [ico-type="square"] .gdgdgd:after {
  1432. border-radius:0 0 0 var(--Header-Icon-Roundness);
  1433. }
  1434.  
  1435. .gdgdgd:after {
  1436. content:"";
  1437. position:absolute;
  1438. top:100%;
  1439. left:0;margin-left:var(--Post-Shadow-Size);
  1440. width:100%;
  1441. height:calc(var(--Header-Icon-Padding) + 1px);
  1442. background:rgba({RGBcolor:post shadow},calc(1 - {select:post shadow transparency}));
  1443. z-index:-1;
  1444. }
  1445.  
  1446. .shadowimg, .gdgdgd img {
  1447. width:var(--Header-Icon-Size);
  1448. height:var(--Header-Icon-Size);
  1449. margin-top:var(--Header-Icon-Padding);
  1450. margin-left:var(--Header-Icon-Padding);
  1451. border-radius:var(--Header-Icon-Roundness);
  1452. }
  1453.  
  1454. .shadowimg {
  1455. background-position:center;
  1456. background-image:url('{image:header icon}');
  1457. background-size:cover;
  1458. }
  1459.  
  1460. .gdgdgd img {
  1461. position:absolute;
  1462. top:0;left:0;
  1463. opacity:0;
  1464. z-index:2;
  1465. }
  1466.  
  1467. .mooshroom {
  1468. flex:1;
  1469. margin-left:calc(0px - 1px - var(--Header-Icon-Padding) - (var(--Header-Icon-Size) / 2));
  1470. min-height:calc(var(--Header-Icon-Size) + (var(--Header-Icon-Padding) * 2) + 2px + (var(--Desc-Box-Padding) * 2));
  1471. box-sizing:border-box;
  1472. background:{color:post};
  1473. border:1px solid {color:post borders outer};
  1474. border-radius:var(--Posts-Corner-Roundness);
  1475. box-shadow:var(--Post-Shadow-Size) var(--Post-Shadow-Size) 0 rgba({RGBcolor:post shadow},calc(1 - {select:post shadow transparency}));
  1476. display:flex;
  1477. align-items:center;
  1478. }
  1479.  
  1480. .deskwrap {
  1481. margin-left:calc(1px + var(--Header-Icon-Padding) + (var(--Header-Icon-Size) / 2) + var(--Desc-Left-Gap));
  1482. padding:var(--Desc-Box-Padding);
  1483. padding-left:0;
  1484. display:flex;
  1485. align-items:center;
  1486. }
  1487.  
  1488. .desc {
  1489. line-height:var(--Line-Height);
  1490. }
  1491.  
  1492. /*---- POST CONTAINER ----*/
  1493. .postscont {
  1494. margin-top:var(--Post-Spacing);
  1495. margin-left:calc(var(--Sidebar-Width) + var(--Center-Aisle-Gaps));
  1496. }
  1497.  
  1498. .posts, .notescont {
  1499. position:relative;
  1500. width:calc(var(--Post-Width) + (var(--Post-Padding) * 2) + 2px);
  1501. border:1px solid {color:post borders outer};
  1502. border-radius:var(--Posts-Corner-Roundness);
  1503. box-shadow:var(--Post-Shadow-Size) var(--Post-Shadow-Size) 0 rgba({RGBcolor:post shadow},calc(1 - {select:post shadow transparency}));
  1504. }
  1505.  
  1506. /*----------------------*/
  1507.  
  1508. .xtoptop + .posts, .posts:first-child, .posts + * {
  1509. margin-bottom:var(--Post-Spacing);
  1510. }
  1511.  
  1512. .posts:only-child {
  1513. {block:PermalinkPage}
  1514. margin-bottom:var(--Post-Spacing);
  1515. {/block:PermalinkPage}
  1516. }
  1517.  
  1518. .posts + *:not(.posts) {
  1519. margin-bottom:var(--Post-Spacing);
  1520. }
  1521.  
  1522. [black-and-white="rb-ico"] .reblog-head img {
  1523. transition:filter var(--Grayscale-Transition-Speed) ease-in-out;
  1524. filter:var(--Grayscale-Settings);
  1525. }
  1526.  
  1527. [black-and-white="everything"] img,
  1528. [black-and-white="everything"] iframe,
  1529. [black-and-white="everything"] video {
  1530. transition:filter var(--Grayscale-Transition-Speed) ease-in-out;
  1531. filter:var(--Grayscale-Settings);
  1532. }
  1533.  
  1534. [black-and-white="everything"] .posts:hover img,
  1535. [black-and-white="everything"] .posts:hover iframe,
  1536. [black-and-white="everything"] .posts:hover video {
  1537. filter:none;
  1538. }
  1539.  
  1540. /*-----------------------*/
  1541. .permatop {
  1542. position:relative;
  1543. background:{color:top permalink background};
  1544. border-radius:var(--Posts-Corner-Roundness) var(--Posts-Corner-Roundness) 0 0;
  1545. box-sizing:border-box;
  1546. padding:var(--Post-Padding);
  1547.  
  1548. padding-top:calc(var(--Post-Padding) + 1px);
  1549. padding-bottom:calc(var(--Post-Padding) - 1px);
  1550.  
  1551. border-bottom:1px solid {color:top permalink border};
  1552.  
  1553. font-family:var(--SmallCaps-Font-Family);
  1554. font-size:calc(var(--SmallCaps-Font-Size) - .5px);
  1555. text-transform:uppercase;
  1556. letter-spacing:1.1px;
  1557. word-spacing:.5px;
  1558. line-height:1em;
  1559. }
  1560.  
  1561. .permatop .iconsax {
  1562. margin-top:-1px;
  1563. margin-right:8px;
  1564. --Iconsax-Size:calc(var(--Body-Font-Size) + 2px);
  1565. --Iconsax-Color:{color:top permalink text};
  1566. }
  1567.  
  1568. .pzt {
  1569. padding-top:calc((var(--SmallCaps-Font-Size) - .5px) * 0.3);
  1570. }
  1571.  
  1572. .permatop, .permatop a {
  1573. color:{color:top permalink text};
  1574. }
  1575.  
  1576. .permatop a:not(.meh-menu a) {
  1577. margin:calc(0px - var(--Post-Padding));
  1578. padding:var(--Post-Padding);
  1579. padding-right:calc(var(--Post-Padding) / 2);
  1580. }
  1581.  
  1582. .acorn {
  1583. position:absolute;
  1584. top:0;
  1585. margin:0!important;
  1586. padding-left:calc(var(--Post-Padding) / 2)!important;
  1587. padding-right:var(--Post-Padding)!important;
  1588. right:0;
  1589. height:100%;
  1590. display:flex;
  1591. align-items:center;
  1592. justify-content:center;
  1593. box-sizing:border-box;
  1594. cursor:help;
  1595. }
  1596.  
  1597. .acorn [class^="ph"]{
  1598. font-size:var(--Dots-Menu-Icon-Size);
  1599. color:{color:top permalink text};
  1600. }
  1601.  
  1602. .meh-menu {
  1603. position:absolute;
  1604. top:100%;
  1605. margin-top:13px;
  1606. right:0;margin-right:var(--Post-Padding);
  1607. backface-visibility:hidden;
  1608. z-index:4;
  1609. --Meh-Arrow-Size:var(--Dots-Menu-Icon-Size);
  1610. --deez:calc((var(--Meh-Arrow-Size) * 1.4142) / 2);
  1611. --moo:calc(var(--deez) * (0.414 / 2));
  1612. transition:margin-top var(--Post-Menu-Fade-Speed) 0s ease-in-out, opacity var(--Post-Menu-Fade-Speed) 0s ease-in-out, visibility 0s var(--Post-Menu-Fade-Speed) ease-in-out;
  1613. visibility:hidden;
  1614. opacity:0;
  1615. }
  1616.  
  1617. .swip {
  1618. margin-top:5px!important;
  1619. opacity:1!important;
  1620. visibility:visible!important;
  1621. }
  1622.  
  1623. .nvt + .meh-menu {
  1624. transition:margin-top var(--Post-Menu-Fade-Speed) 0s ease-in-out, opacity var(--Post-Menu-Fade-Speed) 0s ease-in-out, visibility 0s 0s ease-in-out;
  1625. }
  1626.  
  1627. .yepclique:hover {
  1628. color:{color:post menu text}!important;
  1629. }
  1630.  
  1631. .meh-arrow {
  1632. position:absolute;
  1633. top:0;
  1634. margin-right:calc(var(--moo) + 2px);
  1635. right:0;margin-top:var(--moo);
  1636. width:calc(var(--Meh-Arrow-Size) / 2);
  1637. height:calc(var(--Meh-Arrow-Size) / 2);
  1638. transform-origin:center;
  1639. transform:rotate(45deg);
  1640. background:white;
  1641. border-top:1px solid {color:post menu border};
  1642. border-left:1px solid {color:post menu border};
  1643. box-sizing:border-box;
  1644. }
  1645.  
  1646. .meh-main {
  1647. margin-top:calc(var(--deez) / 2);
  1648. margin-left:calc(50% - var(--deez));
  1649. width:100%;
  1650. width:fit-content; /* firefox only */
  1651. border-radius:var(--Post-Menu-Roundness);
  1652. border:1px solid {color:post menu border};
  1653. background:{color:post menu background};
  1654. box-sizing:border-box;
  1655. box-shadow:5px 5px 0 rgba({RGBcolor:post shadow},calc(1 - {select:post shadow transparency}));
  1656. }
  1657.  
  1658. .meh-main a {
  1659. display:block;
  1660. --bvu:calc((var(--SmallCaps-Font-Size) - 1px) * 0.3);
  1661. padding:calc(var(--Post-Menu-Padding) + 2px);
  1662.  
  1663. padding-top:calc(var(--bvu) + var(--Post-Menu-Padding) - 1px);
  1664. padding-bottom:calc(var(--Post-Menu-Padding) - var(--bvu) + 1px);
  1665.  
  1666. font-family:var(--SmallCaps-Font-Family);
  1667. font-size:calc(var(--SmallCaps-Font-Size) - 1px);
  1668. text-transform:uppercase;
  1669. letter-spacing:1.1px;
  1670. box-sizing:border-box;
  1671. color:{color:post menu text};
  1672. white-space:nowrap;
  1673. line-height:1em;
  1674. transition:color .3s ease-in-out;
  1675. }
  1676.  
  1677. .meh-main a:first-child {
  1678. margin-top:2px;
  1679. }
  1680.  
  1681. .meh-main a[data-clipboard-text]{
  1682. cursor:help;
  1683. }
  1684.  
  1685. .meh-main a:hover {
  1686. color:{color:post menu text hover};
  1687. }
  1688.  
  1689. /*-----------------------*/
  1690.  
  1691. .postinner, .notescont {
  1692. padding:var(--Post-Padding);
  1693. background:{color:post};
  1694. line-height:var(--Line-Height);
  1695. overflow:hidden;
  1696. }
  1697.  
  1698. .desc a, .postinner a:not(.reblog-url a, .tumblr_blog, .linkpost-title, .single-photo, .post_media_photo_anchor, .npf_inst a, .inari, .tagsdiv a, a.read_more, .tmblr-attribution a){
  1699. padding-bottom:.5px;
  1700. border-bottom:1px solid rgba({RGBcolor:link},0.420);
  1701. }
  1702.  
  1703. /*---- REBLOG HEAD ----*/
  1704. .reblog-wrap {
  1705. margin:0 calc(0px - var(--Post-Padding));
  1706. padding:0 var(--Post-Padding);
  1707. }
  1708.  
  1709. .reblog-wrap + .reblog-wrap {
  1710. margin-top:var(--Reblogs-Spacing);
  1711. padding-top:var(--Reblogs-Spacing);
  1712. border-top:1px solid var(--Reblogs-Border);
  1713. }
  1714.  
  1715. .reblog-head {
  1716. display:flex;
  1717. align-items:center;
  1718. }
  1719.  
  1720. .reblog-head img {
  1721. width:var(--Reblogger-Avatar-Size);
  1722. height:var(--Reblogger-Avatar-Size);
  1723. border-radius:100%;
  1724. }
  1725.  
  1726. .reblog-head img + .reblog-url {
  1727. margin-left:var(--Reblogger-Avatar-Gap-Right);
  1728. }
  1729.  
  1730. .reblog-url, .reblog-url a, p > a.tumblr_blog[target='_blank'],
  1731. [customize-page='true'] .tumblr_blog,
  1732. .notescont .action a, .more_notes_link, .notes_loading {
  1733. font-family:var(--SmallCaps-Font-Family);
  1734. font-size:var(--SmallCaps-Font-Size);
  1735. text-transform:uppercase;
  1736. letter-spacing:1px;
  1737. color:var(--Reblogger-Username-Color);
  1738. line-height:1em;
  1739. }
  1740.  
  1741. .reblog-url, .reblog-url a {
  1742. padding-top:calc((var(--SmallCaps-Font-Size) + .3px) * 0.3);
  1743. font-size:calc(var(--SmallCaps-Font-Size) + .3px)!important;
  1744. }
  1745.  
  1746. .reblog-url .deac {
  1747. margin-left:3px;
  1748. color:var(--Body-Text-Color);
  1749. }
  1750.  
  1751. .reblog-head + .reblog-comment {
  1752. margin-top:calc(0px - var(--Paragraph-Margins) + var(--Reblogger-Avatar-Bottom-Gap));
  1753. }
  1754.  
  1755. /*---- NPF... STUFF ----*/
  1756. figure[data-orig-src] + figure[data-orig-src]{
  1757. margin-top:var(--Photoset-Spacing);
  1758. }
  1759.  
  1760. .tmblr-full video {
  1761. cursor:pointer;
  1762. }
  1763.  
  1764. video::-webkit-media-controls-panel {
  1765. position:absolute;
  1766. bottom:0;
  1767. background:transparent!important;
  1768. width:100%;
  1769. box-sizing:border-box;
  1770. opacity:1!important;
  1771. }
  1772.  
  1773. video::-webkit-media-controls-volume-slider, video::-webkit-media-controls-timeline {
  1774. display:none!important;
  1775. }
  1776.  
  1777. [customize-page="true"] .tmblr-full[data-npf*='video']{
  1778. max-height:540px;
  1779. }
  1780.  
  1781. .tmblr-full:not([data-tumblr-attribution]){line-height:0}
  1782.  
  1783. * + .npf-link-block {
  1784. margin-top:10px;
  1785. }
  1786.  
  1787. .npf-link-block {
  1788. margin-top:0px;
  1789. margin-bottom:0;
  1790. border-color:{color:special border}!important;
  1791. border-radius:0!important;
  1792. }
  1793.  
  1794. .npf-link-block + * {
  1795. margin-bottom:var(--Paragraph-Margins);
  1796. }
  1797.  
  1798. .npf-link-block a {
  1799. padding:0!important;
  1800. border:none!important;
  1801. }
  1802.  
  1803. .npf-link-block .title {
  1804. font-family:delius unicase!important;
  1805. font-size:calc(var(--SmallCaps-Font-Size) + 2.5px)!important;
  1806. text-transform:uppercase;
  1807. letter-spacing:.5px;
  1808. color:{color:text}!important;
  1809. line-height:1.7em!important;
  1810. text-shadow:1px 1px 1px rgba(0,0,0,0.1);
  1811. }
  1812.  
  1813. .npf-link-block .bottom {
  1814. background:{color:special background}!important;
  1815. }
  1816.  
  1817. .npf-link-block .description {
  1818. font-family:delius unicase!important;
  1819. font-weight:bold;
  1820. font-size:calc(var(--SmallCaps-Font-Size) + 2px)!important;
  1821. text-transform:uppercase;
  1822. letter-spacing:.5px;
  1823. color:{color:special text}!important;
  1824. line-height:1.7em!important;
  1825. }
  1826.  
  1827. .npf-link-block .site-name {
  1828. text-transform:initial!important;
  1829. font-family:var(--Body-Font-Family)!important;
  1830. font-weight:normal!important;
  1831. font-size:var(--Body-Font-Size)!important;
  1832. color:{color:special text}!important;
  1833. }
  1834.  
  1835. .npf-link-block .description + .site-name {
  1836. margin-top:0;
  1837. }
  1838.  
  1839. .npf-link-block.no-poster .title {
  1840. padding:0.8em!important;
  1841. text-shadow:none!important;
  1842. }
  1843.  
  1844. .npf-link-block.no-poster .title + .bottom {
  1845. border-top:1px solid {color:special border};
  1846. }
  1847.  
  1848. /* gif src attribution */
  1849. .tmblr-attribution {
  1850. font-family:var(--SmallCaps-Font-Family);
  1851. font-size:var(--SmallCaps-Font-Size);
  1852. text-transform:uppercase;
  1853. letter-spacing:1px;
  1854. }
  1855.  
  1856. /*---- TEXT POSTS (TITLE) ----*/
  1857. .post-title, .linkpost-title {
  1858. margin-top:2px;
  1859. margin-bottom:0;
  1860. padding:0.8em;
  1861. background:{color:special background};
  1862. border:1px solid {color:special border};
  1863. font-size:var(--Heading-Font-Size);
  1864. font-weight:normal;
  1865. color:{color:special text};
  1866. text-align:center;
  1867. }
  1868.  
  1869. .post-title + *, .linkpost-title + * {
  1870. margin-top:var(--Heading-Margins);
  1871. }
  1872.  
  1873. /*---- LINK POSTS (TITLE) ----*/
  1874. .linkpost-title {
  1875. display:flex;
  1876. align-items:center;
  1877. justify-content:space-between;
  1878. color:{color:special text};
  1879. text-align:left;
  1880. }
  1881.  
  1882. .linkpost-title span {
  1883. display:block;
  1884. max-width:calc(100% - (var(--Heading-Font-Size) * 1.1) - 10px - 2px);
  1885. }
  1886.  
  1887. span + .linksym {
  1888. margin-left:10px;
  1889. margin-right:2px;
  1890. }
  1891.  
  1892. .linksym {
  1893. width:calc(var(--Heading-Font-Size) * 1.1);
  1894. height:calc(var(--Heading-Font-Size) * 1.1);
  1895. -webkit-mask-size:contain;
  1896. -webkit-mask-repeat:no-repeat;
  1897. -webkit-mask-position:center;
  1898. -webkit-mask-image:var(--ext);
  1899. background:{color:special text};
  1900. }
  1901.  
  1902. .linkpost-title + .link-excerpt {
  1903. margin-top:-1px;
  1904. }
  1905.  
  1906. .link-excerpt {
  1907. padding:0.8em calc(0.8em + 2px);
  1908. border:1px solid {color:post borders inner};
  1909. }
  1910.  
  1911. .link-excerpt + * {
  1912. margin-top:var(--Heading-Margins);
  1913. }
  1914.  
  1915. .le-host {
  1916. font-family:var(--SmallCaps-Font-Family);
  1917. font-size:var(--SmallCaps-Font-Size);
  1918. text-transform:uppercase;
  1919. letter-spacing:.7px;
  1920. }
  1921.  
  1922. /*---- PHOTO POSTS ----*/
  1923. a.single-photo {
  1924. cursor:pointer;
  1925. }
  1926.  
  1927. img.photopic {
  1928. width:100%;
  1929. }
  1930.  
  1931. [photoset-layout] {
  1932. grid-gap:var(--Photoset-Spacing);
  1933. }
  1934.  
  1935. [photoset-layout] div {
  1936. cursor:pointer;
  1937. backface-visibility:hidden;
  1938. }
  1939.  
  1940. .caption {
  1941. margin-top:var(--Captions-Gap);
  1942. }
  1943.  
  1944. /*----- LIGHTBOX BS -----*/
  1945. .tmblr-lightbox, #tumblr_lightbox {
  1946. background-color:rgba({RGBcolor:post},0.69)!important;
  1947. }
  1948.  
  1949. .tmblr-lightbox .vignette {
  1950. background-image:none!important;
  1951. }
  1952.  
  1953. #vignette {display:none!important}
  1954.  
  1955. .lightbox-image, #tumblr_lightbox_left_image, #tumblr_lightbox_center_image, #tumblr_lightbox_right_image {
  1956. margin-top:calc(0px - var(--Post-Padding));
  1957. }
  1958.  
  1959. .tmblr-lightbox img, #tumblr_lightbox img {
  1960. max-width:initial;
  1961. box-shadow:none!important;
  1962. border-radius:0px!important;
  1963. padding:var(--Post-Padding);
  1964. background:{color:post}!important;
  1965. border:1px solid {color:post borders outer}!important;
  1966. }
  1967.  
  1968. /*----- QUOTE POSTS -----*/
  1969. .quote-words, .npf_quote:only-child {
  1970. padding:0 var(--Post-Padding);
  1971. font-family:var(--Quote-Font-Family)!important;
  1972. font-size:var(--Quote-Font-Size)!important;
  1973. letter-spacing:.3px;
  1974. text-align:center;
  1975. line-height:200%;
  1976. }
  1977.  
  1978. .quote-words + .quote-source,
  1979. .npf_quote + p[style*="margin-bottom: 0px;"]{
  1980. margin-top:var(--Paragraph-Margins);
  1981. text-align:center;
  1982. }
  1983.  
  1984. /*----- VIDEO POSTS -----*/
  1985. .tmblr-video {
  1986. max-width:initial;
  1987. }
  1988.  
  1989. .tumblr_video_container, .tumblr_video_iframe {
  1990. width:100%!important;
  1991. }
  1992.  
  1993. /*---- CHAT POSTS ----*/
  1994. .chatwrap {
  1995. border:1px solid var(--Post-Borders-Inner);
  1996. }
  1997.  
  1998. .chat_row {
  1999. position:relative;
  2000. display:table-row;
  2001. overflow:hidden;
  2002. }
  2003.  
  2004. .chat_row:after {
  2005. content:"";
  2006. position:absolute;
  2007. bottom:0;left:0;
  2008. transform:translateY(-.5px);
  2009. width:100%;
  2010. height:1px;
  2011. background:var(--Post-Borders-Inner);
  2012. }
  2013.  
  2014. .chatwrap .chat_row:last-child:after {
  2015. display:none;
  2016. }
  2017.  
  2018. .chat_row code:only-child {
  2019. display:block;
  2020. padding:0.8em;
  2021. border:none;
  2022. background:transparent;
  2023. }
  2024.  
  2025. .chat_label {
  2026. display:table-cell;
  2027. white-space:nowrap;
  2028. padding-right:1em;
  2029. font-family:var(--SmallCaps-Font-Family);
  2030. font-size:var(--SmallCaps-Font-Size);
  2031. text-transform:uppercase;
  2032. letter-spacing:1px;
  2033. }
  2034.  
  2035. .chat_label, .chat_content {
  2036. padding:calc(1em - 2px) 1em;
  2037. }
  2038.  
  2039. .chat_content {
  2040. display:table-cell;
  2041. width:100%;
  2042. }
  2043.  
  2044. .chat_label + .chat_content {
  2045. border-left:1px solid var(--Post-Borders-Inner);
  2046. }
  2047.  
  2048. /*---- AUDIO POSTS ----*/
  2049. .audio-post .npf_inst img {
  2050. width:100%;
  2051. }
  2052.  
  2053. .aud-emb {display:none}
  2054.  
  2055. .audiowrap {
  2056. display:flex;
  2057. align-items:center;
  2058. }
  2059.  
  2060. .albumwrap {
  2061. position:relative;
  2062. width:var(--Audio-Post-Album-Size);
  2063. height:var(--Audio-Post-Album-Size);
  2064. display:flex;
  2065. align-items:center;
  2066. justify-content:center;
  2067. }
  2068.  
  2069. .albumwrap[has-cover] .audplac {display:none}
  2070.  
  2071. .butts {
  2072. width:calc(var(--Audio-Post-Buttons-Size) + (var(--Audio-Post-Buttons-Padding) * 2));
  2073. height:calc(var(--Audio-Post-Buttons-Size) + (var(--Audio-Post-Buttons-Padding) * 2));
  2074. background:var(--Audio-Post-Buttons-Background);
  2075. border-radius:100%;
  2076. display:flex;
  2077. align-items:center;
  2078. justify-content:center;
  2079. cursor:pointer;
  2080. z-index:2;
  2081. }
  2082.  
  2083. .overplay, .overpause {
  2084. width:var(--Audio-Post-Buttons-Size);
  2085. height:var(--Audio-Post-Buttons-Size);
  2086. -webkit-mask-size:contain;
  2087. -webkit-mask-repeat:no-repeat;
  2088. -webkit-mask-position:center;
  2089. background:var(--Audio-Post-Buttons-Color);
  2090. }
  2091.  
  2092. .overplay {
  2093. margin-left:2px;
  2094. -webkit-mask-image:var(--audioplay);
  2095. }
  2096.  
  2097. .overpause {
  2098. display:none;
  2099. -webkit-mask-image:var(--audiopause);
  2100. }
  2101.  
  2102. .ov-y {display:block}
  2103. .ov-z {display:none}
  2104.  
  2105. .audplac {
  2106. position:absolute;
  2107. top:0;left:0;
  2108. width:var(--Audio-Post-Album-Size);
  2109. height:var(--Audio-Post-Album-Size);
  2110. background:var(--Audio-Post-Buttons-Background);
  2111. }
  2112.  
  2113. .albumwrap img {
  2114. position:absolute;
  2115. top:0;left:0;
  2116. width:100%;
  2117. height:100%;
  2118. }
  2119.  
  2120. .audiotxt {
  2121. flex:1;
  2122. height:var(--Audio-Post-Album-Size);
  2123. padding:var(--Audio-Post-Album-Right-Gap);
  2124. background:{color:special background};
  2125. border:1px solid {color:special border};
  2126. display:flex;
  2127. align-items:center;
  2128. box-sizing:border-box;
  2129. display:flex;
  2130. align-items:center;
  2131. justify-content:space-between;
  2132. font-size:calc(var(--Body-Font-Size) - 1px);
  2133. line-height:var(--Line-Height);
  2134. color:{color:special text};
  2135. }
  2136.  
  2137. .odin > div + div {
  2138. margin-top:calc((((var(--Body-Font-Size) - .3px) * var(--Line-Height-INT)) - (var(--Body-Font-Size) - .3px)) / -2);
  2139. padding-top:2px;
  2140. }
  2141.  
  2142. .aud-song-name {
  2143. padding-top:calc((var(--SmallCaps-Font-Size) + 1px) * 0.3);
  2144. margin-bottom:calc((var(--SmallCaps-Font-Size) + 1px) * -0.7);
  2145. font-family:var(--SmallCaps-Font-Family);
  2146. font-size:calc(var(--SmallCaps-Font-Size) + 1px);
  2147. text-transform:uppercase;
  2148. letter-spacing:1px;
  2149. }
  2150.  
  2151. .aud-song-name[has-name] .untit {
  2152. display:none;
  2153. }
  2154.  
  2155. .aud-artist[has-artist] .unart {
  2156. display:none;
  2157. }
  2158.  
  2159. .inari {
  2160. display:block;
  2161. padding:6px;
  2162. margin-right:-6px;
  2163. cursor:pointer;
  2164. }
  2165.  
  2166. .int-all {
  2167. display:block;
  2168. width:calc(var(--Audio-Post-Buttons-Size) + 5px);
  2169. height:calc(var(--Audio-Post-Buttons-Size) + 5px);
  2170. -webkit-mask-size:contain;
  2171. -webkit-mask-repeat:no-repeat;
  2172. -webkit-mask-position:center;
  2173. -webkit-mask-image:var(--install);
  2174. background:{color:special text};
  2175. }
  2176.  
  2177. /*---- SPOTIFY ----*/
  2178. iframe[src*='open.spotify.com'][src*='track'], figure[data-npf*='open.spotify.com'][data-npf*='track']{
  2179. height:80px!important;
  2180. }
  2181.  
  2182. .spotify_audio_player {
  2183. width:100%;
  2184. }
  2185.  
  2186. /*---- SOUNDCLOUD ----*/
  2187. .tmblr-video iframe[src*='soundcloud.com']{
  2188. }
  2189.  
  2190. .audio-soundcloud {
  2191. max-height:113px;
  2192. border-radius:4px;
  2193. overflow:hidden;
  2194. }
  2195.  
  2196. .soundcloud_audio_player {
  2197. margin:-1px;
  2198. margin-bottom:0;
  2199. width:calc(100% + 2px);
  2200. max-width:initial;
  2201. }
  2202.  
  2203. /*---- ASK/ANSWER POSTS ----*/
  2204. .une_question {
  2205. display:flex;
  2206. }
  2207.  
  2208. .askpor {
  2209. flex-shrink:0;
  2210. width:var(--Asker-Avatar-Size);
  2211. height:var(--Asker-Avatar-Size);
  2212. padding:var(--Asker-Avatar-Padding);
  2213. border:1px solid {color:post borders inner};
  2214. border-radius:100%;
  2215. margin-right:11px;
  2216. }
  2217.  
  2218. .que-person {
  2219. margin-top:calc(var(--Asker-Avatar-Padding) + 1px);
  2220. margin-bottom:calc((var(--SmallCaps-Font-Size) - 1px) * -0.3);
  2221. line-height:1em;
  2222. }
  2223.  
  2224. .que-person .reblog-url {
  2225. position:relative;
  2226.  
  2227. /* 'asked' color */
  2228. color:{color:text};
  2229. }
  2230.  
  2231. .que-person .reblog-url b {
  2232. /* asker username color */
  2233. font-weight:normal;
  2234. color:var(--Reblogger-Username-Color);
  2235. }
  2236.  
  2237. .question_text {
  2238. margin-top:calc(var(--Reblogger-Avatar-Bottom-Gap) - 1px);
  2239. padding:calc(1em - 2px) 1em;
  2240. background:{color:special background};
  2241. border-radius:3px;
  2242. border:1px solid {color:special border};
  2243. color:{color:special text};
  2244. }
  2245.  
  2246. .question_text > p:first-child {
  2247. margin-top:0px;
  2248. }
  2249.  
  2250. .question_text > p:only-child {
  2251. margin-bottom:0;
  2252. }
  2253.  
  2254. .une_question + .une_reponse {
  2255. margin-top:var(--Reblogs-Spacing);
  2256. padding-top:var(--Reblogs-Spacing);
  2257. border-top:1px solid var(--Reblogs-Border);
  2258. }
  2259.  
  2260. .une_reponse .reblog-url {
  2261. /* 'answered' text color */
  2262. color:{color:text};
  2263. }
  2264.  
  2265. /*---- TAGS SECTION ----*/
  2266. .tagsdiv {
  2267. margin-top:var(--Captions-Gap);
  2268. }
  2269.  
  2270. .tagsdiv[clicktags="yes"] {
  2271. {block:IndexPage}
  2272. display:none;
  2273. opacity:0;
  2274. transition:opacity var(--Tags-Fade-Speed-MS-SFX) ease-in-out;
  2275. {/block:IndexPage}
  2276. }
  2277.  
  2278. .tagsfade {
  2279. opacity:1!important;
  2280. }
  2281.  
  2282. .tagsin {
  2283. display:flex;
  2284. flex-wrap:wrap;
  2285. justify-content:flex-end;
  2286. margin:calc(0px - var(--Tags-Spacing));
  2287. /*margin-top:calc(var(--Captions-Gap) - var(--Tags-Spacing));*/
  2288. margin-bottom:calc((((var(--SmallCaps-Font-Size) - 1px) * var(--Line-Height-INT)) / 2) * -1);
  2289. line-height:var(--Line-Height);
  2290. }
  2291.  
  2292. .tagsin a {
  2293. position:relative;
  2294. display:block;
  2295. margin:0 var(--Tags-Spacing);
  2296. font-family:var(--SmallCaps-Font-Family);
  2297. font-size:calc(var(--SmallCaps-Font-Size) - 1px);
  2298. text-transform:uppercase;
  2299. letter-spacing:1px;
  2300. color:{color:tags};
  2301. }
  2302.  
  2303. .tagsin a:before {
  2304. content:"#";
  2305. font-family:work sans;
  2306. font-weight:500;
  2307. margin-right:.5px;
  2308. }
  2309.  
  2310. /*---- PERMALINK BAR BOTTOM ----*/
  2311. .botperma {
  2312. display:flex;
  2313. align-items:center;
  2314. justify-content:space-between;
  2315. padding:calc(var(--Post-Padding) - 2px) var(--Post-Padding);
  2316. background:{color:bottom permalink background};
  2317. border-radius:0 0 var(--Posts-Corner-Roundness) var(--Posts-Corner-Roundness);
  2318. border-top:1px solid {color:bottom permalink border};
  2319. font-family:var(--SmallCaps-Font-Family);
  2320. font-size:calc(var(--SmallCaps-Font-Size) - .5px);
  2321. text-transform:uppercase;
  2322. }
  2323.  
  2324. .botperma, .botperma a {
  2325. color:{color:bottom permalink text};
  2326. }
  2327.  
  2328. .permaleft {
  2329. text-transform:uppercase;
  2330. letter-spacing:1px;
  2331. word-spacing:1px;
  2332. line-height:1em;
  2333. }
  2334.  
  2335. .permaleft a {
  2336. display:flex;
  2337. align-items:center;
  2338. margin:calc(0px - var(--Post-Padding)) 0;
  2339. /*padding:var(--Post-Padding) 0;*/
  2340.  
  2341. --blehh:calc((var(--SmallCaps-Font-Size) - .5px) * 0.3);
  2342.  
  2343. padding-top:calc(var(--blehh) + var(--Post-Padding));
  2344. padding-bottom:calc(var(--Post-Padding) - var(--blehh));
  2345. }
  2346.  
  2347. .permaleft a + a {
  2348. margin-left:var(--Permalink-Text-Spacing);
  2349. }
  2350.  
  2351. .permaleft [class^="ph"]{
  2352. font-size:calc(var(--Body-Font-Size) + 2px);
  2353. margin-right:7px;
  2354. }
  2355.  
  2356. .permaright {
  2357. display:flex;
  2358. align-items:center;
  2359. justify-content:center;
  2360. letter-spacing:1px;
  2361. }
  2362.  
  2363. .permaright a {
  2364. display:block;
  2365. position:relative;
  2366. {block:IndexPage}
  2367. width:var(--Post-Buttons-Size);
  2368. height:var(--Post-Buttons-Size);
  2369. {/block:IndexPage}
  2370. backface-visibility:hidden;
  2371. {block:PermalinkPage}
  2372. padding-top:calc((var(--SmallCaps-Font-Size) - .5px) * 0.3);
  2373. {/block:PermalinkPage}
  2374. }
  2375.  
  2376. .permaright .iconsax {
  2377. display:block;
  2378. --Iconsax-Size:var(--Post-Buttons-Size);
  2379. --Iconsax-Color:var(--Post-Buttons-Color);
  2380. backface-visibility:hidden;
  2381. }
  2382.  
  2383. .permaright .iconsax[icon-name='repeat']{
  2384. transform-origin:center;
  2385. transform:scaleX(1.1);
  2386. }
  2387.  
  2388. .permaright .cp {
  2389. padding-left:1px;
  2390. font-size:var(--Post-Buttons-Size);
  2391. color:var(--Post-Buttons-Color);
  2392. }
  2393.  
  2394. .permaright span {display:block}
  2395.  
  2396. .permaright a + a {
  2397. margin-left:var(--Post-Buttons-Spacing);
  2398. }
  2399.  
  2400. .permaright[clicktags="no"] .clicktags {
  2401. display:none;
  2402. }
  2403.  
  2404. .clicktags {
  2405. cursor:help;
  2406. }
  2407.  
  2408. .like_button {
  2409. position:absolute;
  2410. top:0;left:0;
  2411. width:100%;
  2412. height:100%;
  2413. z-index:2;
  2414. }
  2415.  
  2416. .like_button iframe {
  2417. width:100%;
  2418. height:100%;
  2419. vertical-align:initial;
  2420. opacity:0;
  2421. }
  2422.  
  2423. .like_button.liked + .cp-heart-o {
  2424. color:var(--Like-Button-Liked);
  2425. }
  2426.  
  2427. /*---- POST NOTES ----*/
  2428. .notescont {
  2429. margin-top:var(--Post-Spacing);
  2430. margin-bottom:var(--Post-Spacing);
  2431. width:calc(var(--Post-Width) + (var(--Post-Padding) * 0) + 2px);
  2432. }
  2433.  
  2434. .notescont h1 {
  2435. margin-top:5px;
  2436. margin-bottom:calc(var(--Heading-Margins) + 5px);
  2437. font-weight:normal;
  2438. letter-spacing:.3px;
  2439. text-align:center;
  2440. }
  2441.  
  2442. .notescont ol.notes {
  2443. padding:0;
  2444. margin:0;
  2445. }
  2446.  
  2447. .notescont li {
  2448. list-style-type:none;
  2449. padding:0!important;
  2450. }
  2451.  
  2452. .notescont li + li {
  2453. margin-top:var(--Notes-Row-Spacing);
  2454. }
  2455.  
  2456. .notescont li:before {
  2457. font-family:phosphor;
  2458. font-size:var(--Notes-Indicator-Size);
  2459. color:{color:text};
  2460. vertical-align:middle;
  2461. }
  2462.  
  2463. .notescont li.like:before {
  2464. content:"\f1ca";
  2465. }
  2466.  
  2467. .notescont li.reblog:before {
  2468. content:"\f2c3";
  2469. }
  2470.  
  2471. .notescont li.reply:before,
  2472. .notescont li.with_commentary:before {
  2473. content:"\f0db"!important;
  2474. }
  2475.  
  2476. .notescont .avatar_frame {
  2477. display:none;
  2478. }
  2479.  
  2480. .notescont .avatar_frame + .action {
  2481. margin-left:var(--Notes-Indicator-Gap-Right);
  2482. }
  2483.  
  2484. .notescont .action a {
  2485. color:var(--Reblogger-Username-Color);
  2486. }
  2487.  
  2488. .notescont blockquote {
  2489. margin-left:calc(var(--Notes-Indicator-Size) / 2);
  2490. padding-left:calc((var(--Notes-Indicator-Size) / 2) + var(--Notes-Indicator-Gap-Right));
  2491. }
  2492.  
  2493. .more_notes_link_container {
  2494. margin-top:1em!important;
  2495. margin-bottom:calc(var(--Paragraph-Margins) / 2);
  2496. }
  2497.  
  2498. .more_notes_link, .notes_loading {
  2499. color:{color:link};
  2500. }
  2501.  
  2502. /*---- PAGINATION ----*/
  2503. .botpagi {
  2504. display:flex;
  2505. align-items:center;
  2506. justify-content:space-between;
  2507. width:calc(var(--Post-Width) + (var(--Post-Padding) * 2) + 2px);
  2508. margin-bottom:var(--Post-Spacing);
  2509. font-family:var(--SmallCaps-Font-Family);
  2510. font-size:calc(var(--SmallCaps-Font-Size) - 1px);
  2511. text-transform:uppercase;
  2512. letter-spacing:1.1px;
  2513. line-height:1em;
  2514. }
  2515.  
  2516. .botpagi a {
  2517. padding:0.69em;
  2518. margin:-0.69em;
  2519. color:var(--Pagination-Color)!important;
  2520. }
  2521.  
  2522. .botpagi span {
  2523. padding:0 4px;
  2524. padding-top:calc((var(--SmallCaps-Font-Size) - 1px) * 0.3);
  2525. }
  2526.  
  2527. .prev-svg {
  2528. width:calc(var(--Body-Font-Size) + 3px);
  2529. height:calc(var(--Body-Font-Size) + 3px);
  2530. -webkit-mask-image:var(--BackSVG);
  2531. -webkit-mask-repeat:no-repeat;
  2532. -webkit-mask-size:contain;
  2533. background:var(--Pagination-Color)
  2534. }
  2535.  
  2536. .next-svg {
  2537. width:calc(var(--Body-Font-Size) + 3px);
  2538. height:calc(var(--Body-Font-Size) + 3px);
  2539. -webkit-mask-image:var(--NextSVG);
  2540. -webkit-mask-repeat:no-repeat;
  2541. -webkit-mask-size:contain;
  2542. background:var(--Pagination-Color)
  2543. }
  2544.  
  2545. .tsugi {
  2546. margin-right:calc(0px - var(--Post-Shadow-Size) - 0.69em)!important;
  2547. }
  2548.  
  2549. .pn {
  2550. margin-left:auto!important;
  2551. }
  2552.  
  2553. /*---ignore this---*/
  2554. .musubi {
  2555. position:fixed;
  2556. bottom:0;left:0;
  2557. width:100%;
  2558. box-sizing:border-box;
  2559. padding:14px;
  2560. background:#121212;
  2561. font-family:delius unicase;
  2562. font-weight:700;
  2563. font-size:11.5px;
  2564. text-transform:uppercase;
  2565. color:#d5d5d5;
  2566. letter-spacing:.5px;
  2567. word-spacing:1px;
  2568. line-height:1em;
  2569. text-align:center;
  2570. display:none;
  2571. z-index:11;
  2572. }
  2573.  
  2574. .musubi a {
  2575. margin-right:1px;
  2576. font-weight:bold;
  2577. color:#b2d66b;
  2578. }
  2579.  
  2580. /*-------------------*/
  2581.  
  2582. [credit-pos="bot"] .tubbz a[href*='glenthemes.tumblr.com']{
  2583. display:none;
  2584. }
  2585.  
  2586. [credit-pos="in-sb"] .lah-nuit {
  2587. display:none;
  2588. }
  2589.  
  2590. .lah-nuit {
  2591. display:block;
  2592. position:fixed;
  2593. bottom:0;margin-bottom:10px;
  2594. right:0;margin-right:8px;
  2595. padding:8px 5px 5px 5px;
  2596. font-family:var(--SmallCaps-Font-Family);
  2597. font-size:8px;
  2598. text-transform:uppercase;
  2599. letter-spacing:1.3px;
  2600. color:{color:text};
  2601. line-height:1em;
  2602. z-index:10;
  2603. }
  2604.  
  2605. .posts[id="669645454703722496"] .photoset-grid {
  2606. filter:brightness(103%) contrast(102%)
  2607. }
  2608.  
  2609. {CustomCSS}
  2610. </style>
  2611.  
  2612. </head>
  2613.  
  2614. <!--------------------->
  2615.  
  2616. <body>
  2617.  
  2618. <div class="musubi"></div>
  2619.  
  2620. <div class="mynoots">
  2621. <div class="nymoots">
  2622. <div class="ensoot">
  2623.  
  2624. <!---- LEFT SIDEBAR ---->
  2625. <div class="left-sb">
  2626. <div class="lbs">
  2627. <div class="el-present">
  2628. <div class="moolait" {block:ifsidebarhovernotifs}sb-hov-yes{/block:ifsidebarhovernotifs}>
  2629. <img class="main-sb-img" src="{image:sidebar image}">
  2630. </div>
  2631. <div class="hoez" t-shad="{select:sidebar title shadow}" t-outline="{select:sidebar title outline}">
  2632. {block:ifsidebarverticaltitle}
  2633. <span>{text:sidebar vertical title}</span>
  2634. {/block:ifsidebarverticaltitle}
  2635. </div>
  2636.  
  2637. <!------ MUSIC PLAYER ------>
  2638. {block:ifshowmusicplayer}
  2639. <div class="botstick"></div>
  2640.  
  2641. <div class="bingbong">
  2642. <div class="dingding">
  2643. <span>{text:music song 1 name}</span>
  2644. <span>{text:music song 2 name}</span>
  2645. <span>{text:music song 3 name}</span>
  2646. </div>
  2647. </div>
  2648.  
  2649. <div class="lvttvce">
  2650. <a class="ph-skip-back peev"></a>
  2651.  
  2652. <div class="qorqle">
  2653. <i class="ph-play vlay"></i>
  2654. <i class="ph-pause vause"></i>
  2655. </div>
  2656.  
  2657. <a class="ph-skip-forward neet"></a>
  2658. </div>
  2659.  
  2660. <div class="audiostaque">
  2661. <audio src="{text:music song 1 mp3}" vol="{text:music song 1 volume}"></audio>
  2662. <audio src="{text:music song 2 mp3}" vol="{text:music song 2 volume}"></audio>
  2663. <audio src="{text:music song 3 mp3}" vol="{text:music song 3 volume}"></audio>
  2664. </div><!--do not remove this </div> line-->
  2665.  
  2666. {/block:ifshowmusicplayer}
  2667. <!--end musicplayer-->
  2668.  
  2669.  
  2670. <!------ SIDEBAR TOP ROW ------>
  2671. <div class="martiny">
  2672. <div class="bubun">
  2673. <span>{text:sidebar corner title}</span>
  2674. </div>
  2675.  
  2676. <div class="tubbz">
  2677.  
  2678. <a href="//{Name}.tumblr.com" title="home">
  2679. <i class="bi bi-house-door"></i>
  2680. </a>
  2681.  
  2682.  
  2683. <a href="//{Name}.tumblr.com/ask" title="askbox">
  2684. <i class="bi bi-envelope"></i>
  2685. </a>
  2686.  
  2687.  
  2688. <a href="//{Name}.tumblr.com/archive" title="archive">
  2689. <i class="bi bi-grid"></i>
  2690. </a>
  2691.  
  2692. <!-- pls do not remove the credit! -->
  2693. <a href="//glenthemes.tumblr.com" title="theme by glenthemes">
  2694. <i class="bi bi-code-slash"></i>
  2695. </a>
  2696.  
  2697. <i class="bi bi-battery{select:battery status}"></i>
  2698. </div><!--tubbz-->
  2699. </div><!--martiny-->
  2700.  
  2701.  
  2702. <!------ "NOTIF" BLOCKS SECTION ------>
  2703. <div class="paindesk">
  2704. <div class="muchpain">
  2705. <div class="chellfish">
  2706. {text:sidebar hover notifs}
  2707. </div><!--chellfish-->
  2708. </div><!--muchpain-->
  2709. </div><!--paindesk-->
  2710. </div><!--el-present-->
  2711.  
  2712. <!------ CUSTOM LINKS ------>
  2713. <div class="ceels">
  2714. <div class="pengweng">
  2715. {block:ifcustomlink1name}
  2716. <a href="{text:customlink 1 url}">
  2717. <span>{text:customlink 1 name}</span>
  2718. </a>
  2719. {/block:ifcustomlink1name}
  2720.  
  2721. {block:ifcustomlink2name}
  2722. <a href="{text:customlink 2 url}">
  2723. <span>{text:customlink 2 name}</span>
  2724. </a>
  2725. {/block:ifcustomlink2name}
  2726.  
  2727. {block:ifcustomlink3name}
  2728. <a href="{text:customlink 3 url}">
  2729. <span>{text:customlink 3 name}</span>
  2730. </a>
  2731. {/block:ifcustomlink3name}
  2732.  
  2733. {block:ifcustomlink4name}
  2734. <a href="{text:customlink 4 url}">
  2735. <span>{text:customlink 4 name}</span>
  2736. </a>
  2737. {/block:ifcustomlink4name}
  2738.  
  2739. {block:ifcustomlink5name}
  2740. <a href="{text:customlink 5 url}">
  2741. <span>{text:customlink 5 name}</span>
  2742. </a>
  2743. {/block:ifcustomlink5name}
  2744.  
  2745. {block:ifcustomlink6name}
  2746. <a href="{text:customlink 6 url}">
  2747. <span>{text:customlink 6 name}</span>
  2748. </a>
  2749. {/block:ifcustomlink6name}
  2750.  
  2751. {block:ifcustomlink7name}
  2752. <a href="{text:customlink 7 url}">
  2753. <span>{text:customlink 7 name}</span>
  2754. </a>
  2755. {/block:ifcustomlink7name}
  2756.  
  2757. {block:ifcustomlink8name}
  2758. <a href="{text:customlink 8 url}">
  2759. <span>{text:customlink 8 name}</span>
  2760. </a>
  2761. {/block:ifcustomlink8name}
  2762. </div>
  2763. </div>
  2764. </div><!--lbs-->
  2765. </div><!--left-sb-->
  2766.  
  2767.  
  2768.  
  2769. <!---- RIGHTSIDE CONTAINER ---->
  2770. <div class="postscont" black-and-white="{select:grayscale images}">
  2771.  
  2772.  
  2773. <!---- AVATAR ICON + DESCRIPTION ---->
  2774. <!-- the 'header' thing above the posts -->
  2775. <div class="xtoptop" ico-type="{select:header icon type}">
  2776. <div class="gdgdgd">
  2777. <div class="shadowimg"></div>
  2778. <img src="{image:header icon}">
  2779. </div>
  2780.  
  2781. <div class="mooshroom">
  2782. <div class="deskwrap">
  2783. <div class="desc">
  2784. {block:ifdescription}
  2785. {text:Description}
  2786. {/block:ifdescription}
  2787.  
  2788. {block:ifnotdescription}
  2789. {Description}
  2790. {/block:ifnotdescription}
  2791. </div>
  2792. </div>
  2793. </div>
  2794. </div><!--xtoptop-->
  2795.  
  2796.  
  2797. {block:Posts inlineMediaWidth="1280" inlineNestedMediaWidth="1280"}
  2798. <div class="posts {PostType}-post" id="{PostID}" post-type="{PostType}">
  2799.  
  2800. <!------ TOP PERMALINK ------>
  2801. <div class="permatop" flex>
  2802. <a flex {block:IndexPage}href="{Permalink}" title="view post"{/block:IndexPage}>
  2803. {block:Text}
  2804. <i class="iconsax" icon-name="letter-case"></i>
  2805. {/block:Text}
  2806.  
  2807. {block:Photo}
  2808. <i class="iconsax" icon-name="picture"></i>
  2809. {/block:Photo}
  2810.  
  2811. {block:Photoset}
  2812. <i class="iconsax" icon-name="picture"></i>
  2813. {/block:Photoset}
  2814.  
  2815. {block:Quote}
  2816. <i class="iconsax" icon-name="quote-start"></i>
  2817. {/block:Quote}
  2818.  
  2819. {block:Link}
  2820. <i class="iconsax" icon-name="globe"></i>
  2821. {/block:Link}
  2822.  
  2823. {block:Chat}
  2824. <i class="iconsax" icon-name="messages-1"></i>
  2825. {/block:Chat}
  2826.  
  2827. {block:Audio}
  2828. <i class="iconsax" icon-name="music"></i>
  2829. {/block:Audio}
  2830.  
  2831. {block:Video}
  2832. <i class="iconsax" icon-name="video-2"></i>
  2833. {/block:Video}
  2834.  
  2835. {block:Answer}
  2836. <i class="iconsax" icon-name="mail"></i>
  2837. {/block:Answer}
  2838.  
  2839. <!------------------>
  2840.  
  2841. <span class="pzt">
  2842. {block:RebloggedFrom}Reblogged on{/block:RebloggedFrom}
  2843. {block:NotReblog}Posted on{block:NotReblog}
  2844.  
  2845. {Month} {DayOfMonthWithSuffix} {Year}&#8194;&#8201;&#9472;&#8201;&#8194;{TimeAgo}
  2846. </span>
  2847. </a>
  2848.  
  2849. <a class="acorn">
  2850. <i class="ph-dots-three"></i>
  2851. </a>
  2852.  
  2853. <div class="meh-menu">
  2854. <div class="meh-arrow"></div>
  2855.  
  2856. <div class="meh-main">
  2857. <a item data-clipboard-text="{Permalink}">copy link</a>
  2858. {block:RebloggedFrom}
  2859. <a item href="{ReblogParentURL}">via:&#8201;{ReblogParentName}</a>
  2860. <a item href="{ReblogRootURL}">src:&#8201;{ReblogRootName}</a>
  2861. {/block:RebloggedFrom}
  2862. </div>
  2863. </div>
  2864. </div><!--permatop-->
  2865.  
  2866. <div class="postinner">
  2867.  
  2868. <!------ POST TITLE ------>
  2869. {block:Title}
  2870. <h1 class="post-title">{Title}</h1>
  2871. {/block:Title}
  2872.  
  2873. <!------ TEXT POSTS ------>
  2874. {block:Text}
  2875. {block:NotReblog}{Body}{/block:NotReblog}
  2876. {block:RebloggedFrom}
  2877. {block:Reblogs}
  2878. <div class="reblog-wrap">
  2879. <div class="reblog-head source-head">
  2880. <img src="{PortraitURL-64}">
  2881. <span class="reblog-url">
  2882. <a href="{Permalink}">{Username}</a>
  2883. </span>
  2884. </div>
  2885. <div class="reblog-comment">{Body}</div>
  2886. </div>
  2887. {/block:Reblogs}
  2888. {/block:RebloggedFrom}
  2889. {/block:Text}
  2890.  
  2891. <!------ SINGLE PHOTO ------>
  2892. {block:Photo}
  2893. <a class="single-photo" onclick="Tumblr.Lightbox.init([{ width:{PhotoWidth-HighRes}, height:{PhotoHeight-HighRes}, low_res:'{PhotoURL-500}', high_res:'{PhotoURL-HighRes}' }]); $('body').toggleClass('tumblr_lightbox_active'); return false"><img class="photopic" src="{PhotoURL-HighRes}" alt="{PhotoAlt}"></a>
  2894. {/block:Photo}
  2895.  
  2896. <!------ PHOTOSETS ------>
  2897. {block:Photoset}<div class="photoset-grid" photoset-layout="{PhotosetLayout}">{block:Photos}<div data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}" data-lowres="{PhotoURL-500}" data-highres="{PhotoURL-HighRes}" onclick="lightbox(this)"><img src="{PhotoURL-HighRes}" /></div>{/block:Photos}</div>{/block:Photoset}
  2898.  
  2899. <!------ QUOTE POSTS ------>
  2900. {block:Quote}
  2901. <div class="quote-words">{Quote}</div>
  2902. {block:Source}
  2903. <div class="quote-source">
  2904. <span mdash>&mdash;</span>
  2905. {Source}
  2906. </div>{/block:Source}
  2907. {/block:Quote}
  2908.  
  2909. <!------ LINK POSTS ------>
  2910. {block:Link}
  2911. <a class="linkpost-title" href="{URL}" {Target}>
  2912. <span>{Name}</span>
  2913. <div class="linksym"></div>
  2914. </a>
  2915.  
  2916. {block:Excerpt}
  2917. <div class="link-excerpt">
  2918. {Excerpt}
  2919. {block:Host}— <a class="le-host" href="{URL}" {Target}>{Host}</a>{/block:Host}
  2920. </div>
  2921. {/block:Excerpt}
  2922.  
  2923. {block:Description}
  2924. <div class="link-description">
  2925. {block:NotReblog}{Description}{/block:NotReblog}
  2926. {block:RebloggedFrom}
  2927. {block:Reblogs}
  2928. <div class="reblog-wrap">
  2929. <div class="reblog-head">
  2930. <img src="{PortraitURL-64}">
  2931. <span class="reblog-url">
  2932. <a href="{Permalink}">{Username}</a>
  2933. </span>
  2934. </div>
  2935. <div class="reblog-comment">{Body}</div>
  2936. </div>
  2937. {/block:Reblogs}
  2938. {/block:RebloggedFrom}
  2939. </div>
  2940. {/block:Description}
  2941. {/block:Link}
  2942.  
  2943. <!------ CHAT POSTS ------>
  2944. {block:Chat}
  2945. {block:Lines}
  2946. <div class="chat_row">
  2947. {block:Label}
  2948. <div class="chat_label">{Label}</div>
  2949. {/block:Label}
  2950.  
  2951. <div class="chat_content">
  2952. {Line}
  2953. </div>
  2954. </div>
  2955. {/block:Lines}
  2956. {/block:Chat}
  2957.  
  2958. <!------ AUDIO POSTS ------>
  2959. {block:Audio}
  2960. <div class="audiowrap">
  2961. {block:AudioPlayer}
  2962. <div class="aud-emb">
  2963. {AudioPlayer}
  2964. </div>
  2965. {/block:AudioPlayer}
  2966.  
  2967. <div class="albumwrap" {block:AlbumArt}has-cover{/block:AlbumArt}>
  2968. {block:AlbumArt}
  2969. <img src="{AlbumArtURL}">
  2970. {/block:AlbumArt}
  2971.  
  2972. <div class="audplac"></div>
  2973.  
  2974. <div class="butts">
  2975. <div class="overplay"></div>
  2976. <div class="overpause"></div>
  2977. </div>
  2978. </div>
  2979.  
  2980. <div class="audiotxt">
  2981. <div class="odin">
  2982.  
  2983. <div class="aud-song-name" {block:TrackName}has-name{/block:TrackName}>
  2984. <div class="untit">Untitled track</div>
  2985.  
  2986. {block:TrackName}
  2987. <div class="hastit">{TrackName}</div>
  2988. {/block:TrackName}
  2989. </div>
  2990.  
  2991. {block:Album}
  2992. <div class="aud-album-name">{Album}</div>
  2993. {/block:Album}
  2994.  
  2995. <div class="aud-artist" {block:Artist}has-artist{/block:Artist}>
  2996. <div class="unart">Unknown artist</div>
  2997.  
  2998. {block:Artist}
  2999. <div class="hasart">{Artist}</div>
  3000. {/block:Artist}
  3001. </div>
  3002. </div><!--odin-->
  3003.  
  3004. <a class="inari" title="download" target="_blank">
  3005. <span class="int-all"></span>
  3006. </a>
  3007. </div><!--audiotxt-->
  3008. </div><!--audiowrap-->
  3009. {/block:Audio}
  3010.  
  3011. <!------ VIDEO POSTS ------>
  3012. {block:Video}
  3013. <div class="tmblr-video">{Video-500}</div>
  3014. {/block:Video}
  3015.  
  3016. <!------ ANSWER POSTS ------>
  3017. {block:Answer}
  3018. <!-- who asked? -->
  3019. <div class="une_question">
  3020. <img class="askpor yoozah" src="{AskerPortraitURL-128}">
  3021.  
  3022. <div>
  3023. <div class="que-person">
  3024. <span class="reblog-url"><b>{Asker}</b> asked:</span>
  3025. </div>
  3026.  
  3027. <div class="question_text">{Question}</div>
  3028.  
  3029.  
  3030. </div>
  3031. </div><!--une_question-->
  3032.  
  3033. <!--------------------------------------->
  3034.  
  3035. <!-- who answered? -->
  3036. {block:Answerer}
  3037. <div class="reblog-wrap une_reponse">
  3038. <div class="answerer reblog-head">
  3039. <img src="{AnswererPortraitURL-64}">
  3040. <span class="reblog-url">{Answerer} answered:</span>
  3041. </div>
  3042. <p class="answer_text">{Answer}</p>
  3043. </div>
  3044.  
  3045. <!-- additional reblogs to the ask post -->
  3046. {block:Reblogs}
  3047. <div class="reblog-wrap reply_container">
  3048. <div class="replier reblog-head">
  3049. <img src="{PortraitURL-64}">
  3050. <span class="reblog-url">
  3051. <a href="{Permalink}">{Username}</a>
  3052. </span>
  3053. </div>
  3054. <div class="reply">{Body}</div>
  3055. </div>
  3056. {/block:Reblogs}
  3057. {/block:Answerer}
  3058.  
  3059. <!--------------------------------------->
  3060.  
  3061. <!-- original answer post -->
  3062. {block:NotReblog}
  3063. <div class="reblog-wrap une-reponse">
  3064. <div class="answerer reblog-head">
  3065. <img src="{PortraitURL-64}">
  3066. <span class="reblog-url">
  3067. <a href="{Permalink}">{Name}</a>
  3068. </span>
  3069. </div>
  3070.  
  3071. <div class="answer_text">{Answer}</div>
  3072. </div><!--answer-container-->
  3073. {/block:NotReblog}
  3074. {/block:Answer}
  3075. <!------ END ANSWER ------>
  3076.  
  3077. <!------ 'CAPTION'? ------>
  3078. {block:Caption}
  3079. <div class="caption">
  3080. {block:NotReblog}{Caption}{/block:NotReblog}
  3081. {block:RebloggedFrom}
  3082. {block:Reblogs}
  3083. <div class="reblog-wrap">
  3084. <div class="reblog-head">
  3085. <img src="{PortraitURL-64}">
  3086. <span class="reblog-url">
  3087. <a href="{Permalink}">{Username}</a>
  3088. </span>
  3089. </div><!--reblog-head-->
  3090. <div class="reblog-comment">{Body}</div>
  3091. </div><!--comment-container-->
  3092. {/block:Reblogs}
  3093. {/block:RebloggedFrom}
  3094. </div><!--caption-->
  3095. {/block:Caption}
  3096.  
  3097.  
  3098. <!------ TAGS ------>
  3099. {block:HasTags}
  3100. <div class="tagsdiv" clicktags="{select:click tags}">
  3101. <div class="tagsin">
  3102. {block:Tags}
  3103. <a href="{TagURL}">{Tag}</a>
  3104. {/block:Tags}
  3105. </div>
  3106. </div>
  3107. {/block:HasTags}
  3108. </div><!--postinner-->
  3109.  
  3110. <!------ BOTTOM PERMALINK ------>
  3111. {block:Date}
  3112. <div class="botperma">
  3113. <div class="permaleft" flex>
  3114. <i class="ph-{text:bottom permalink icon}"></i>
  3115.  
  3116. {block:RebloggedFrom}
  3117. <a href="{ReblogRootURL}" title="go to original poster">Source:&ensp;<span src-link>{ReblogRootName}</span></a>
  3118. {/block:RebloggedFrom}
  3119.  
  3120. {block:NotReblog}
  3121. <a{block:IndexPage} href="{Permalink}"{/block:IndexPage}>Original Post</a>
  3122. {/block:NotReblog}
  3123.  
  3124. <a{block:IndexPage} href="{Permalink}"{/block:IndexPage}>{NoteCountWithLabel}</a>
  3125.  
  3126. <a{block:IndexPage} href="{Permalink}"{/block:IndexPage}>{DayOfWeek}</a>
  3127.  
  3128. {block:IndexPage}
  3129. {block:PinnedPostLabel}<a>Pinned Post</a>{/block:PinnedPostLabel}
  3130. {/block:IndexPage}
  3131. </div>
  3132.  
  3133. <!------------------------------>
  3134. {block:IndexPage}
  3135. <div class="permaright" clicktags="{select:click tags}">
  3136. {block:HasTags}
  3137. <a class="clicktags">
  3138. <i class="iconsax" icon-name="hashtag"></i>
  3139. </a>
  3140. {/block:HasTags}
  3141.  
  3142.  
  3143. <a href="{ReblogURL}" title="reblog this post">
  3144. <i class="iconsax" icon-name="repeat"></i>
  3145. </a>
  3146.  
  3147. <a title="like this post">
  3148. {LikeButton}
  3149. <i class="cp cp-heart-o"></i>
  3150. </a>
  3151. </div>
  3152. {/block:IndexPage}
  3153. <!------------------------------>
  3154.  
  3155. {block:PermalinkPage}
  3156. <div class="permaright">
  3157. {block:NotReblog}
  3158. original post
  3159. {/block:NotReblog}
  3160.  
  3161. {block:RebloggedFrom}
  3162. <a href="{ReblogParentURL}">via: &thinsp;{ReblogParentName}</a>
  3163. {/block:RebloggedFrom}
  3164. </div>
  3165. {/block:PermalinkPage}
  3166.  
  3167. </div><!--botperma-->
  3168. {/block:Date}
  3169. </div><!--posts-->
  3170.  
  3171. {block:PostNotes}
  3172. <div class="notescont">
  3173. <h1>{NoteCountWithLabel}</h1>
  3174. {PostNotes}
  3175. </div>
  3176. {/block:PostNotes}
  3177.  
  3178. {/block:Posts}
  3179.  
  3180. <!------ PAGINATION ------>
  3181. {block:Pagination}
  3182. <div class="botpagi">
  3183. {block:PreviousPage}
  3184. <a class="flex" href="{PreviousPage}">
  3185. <div class="prev-svg"></div>
  3186. <span>previous page</span>
  3187. </a>
  3188. {/block:PreviousPage}
  3189.  
  3190. {block:NextPage}
  3191. <a class="flex pn tsugi" href="{NextPage}">
  3192. <span>next page</span>
  3193. <div class="next-svg"></div>
  3194. </a>
  3195. {/block:NextPage}
  3196. </div>
  3197. {/block:Pagination}
  3198. </div><!--postscont-->
  3199.  
  3200. </div><!--ensoot-->
  3201. </div><!--nymoots-->
  3202. </div><!--mynoots-->
  3203.  
  3204. <!-- PLS DO NOT REMOVE THE CREDIT ILYSM -->
  3205. <a class="lah-nuit" href="//glenthemes.tumblr.com">glenthemes</a>
  3206.  
  3207. <script src="//static.tumblr.com/0podkko/jfMplm3f8/modified_photosets.js"></script>
  3208.  
  3209. </body>
  3210. </html>
RAW Paste Data Copied