API tools faq
paste
glenthemes

Theme [13]: Parfait

glenthemes
Mar 22nd, 2020 (edited)
27,516
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 102.07 KB | None | 0 0
raw download clone embed print report
  1. <!----------------------------------------------------
  2. Theme [13]: Parfait
  3. Made by glenthemes
  4.  
  5. Initial release: 2015/11/??
  6. Remake [v1] date: 2020/03/23
  7. Remake [v2] date: 2022/05/10
  8. Last updated: 2023/08/18
  9.  
  10. What's new:
  11. ✱ NPF audio post support
  12.  
  13. HOW TO USE:
  14. https://docs.google.com/presentation/d/1jv8m7GLZWYv9-xrkmFFtfaRyxmEgDkbfn1WZ9cS8hgM/edit?usp=sharing
  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/parfait
  25. ----------------------------------------------------->
  26. <!DOCTYPE html>
  27. <html blog-name="{Name}" font="{select:font}" tumblr-controls="{select:tumblr controls color}" tc-hov="{select:hover tumblr controls}" bg-type="{select:background image type}" portrait="{PortraitURL-64}" {block:IndexPage}index-page{/block:IndexPage} {block:PermalinkPage}perma-page{/block:PermalinkPage} post-borders="{select:post borders}" cls="{select:customlinks}" thm-help="{select:theme help message}">
  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. <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
  39.  
  40. <!-------- FONTS -------->
  41. <!-- google fonts -->
  42. <link href="//fonts.googleapis.com/css?family=Work+Sans|Public+Sans:500|Cousine|Libre+Franklin|Open+Sans|Manrope:500|Karla|Inter|Plus+Jakarta+Sans:500|Krub:500|Sen|Sora|Quicksand:500|DM+Sans:500|Tajawal:500|Readex+Pro" rel="stylesheet">
  43.  
  44. <!-------- ICON FONTS -------->
  45. <!-- phosphor icons -->
  46. <link rel="stylesheet" href="//unpkg.com/phosphor-icons@1.3.2/src/css/phosphor.css">
  47.  
  48. <!-- akar icons -->
  49. <link href="//unpkg.com/akar-icons-fonts/src/css/akar-icons.css" rel="stylesheet">
  50.  
  51. <!-- mono icons -->
  52. <link href="//unpkg.com/mono-icons@latest/iconfont/icons.css" rel="stylesheet">
  53.  
  54. <!-- lucide icons -->
  55. <script src="//unpkg.com/lucide@latest/dist/umd/lucide.js"></script>
  56.  
  57. <!-------- JQUERY -------->
  58. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  59.  
  60. <!-------- PRELOAD -------->
  61. <link rel="preload" href="//glen-assets.github.io/fonts/GoogleSans-Regular.ttf" as="font" type="font/ttf" crossorigin>
  62.  
  63. <!-------- THEME SCRIPTS -------->
  64. <link rel="stylesheet" media="screen" href="//assets.tumblr.com/client/prod/standalone/blog-network-npf/index.build.css">
  65.  
  66. <script src="//npf-images-v3.github.io/script.js"></script>
  67. <link rel="stylesheet" href="//npf-images-v3.github.io/recon.css">
  68.  
  69. <script src="//rawgit.com/robinpx/tumblr/master/scripts/flexibleFrames/flexibleFrames.min.js"></script>
  70.  
  71. <link href="//static.tumblr.com/0podkko/oDSpg7y88/photosets.css" rel="stylesheet">
  72.  
  73. {block:ifsongfilemp3}
  74. <script src="//glenthemes.github.io/-music-/glenplayer07.js"></script>
  75. {/block:ifsongfilemp3}
  76.  
  77. <!-- cssgram -->
  78. <link href="https://static.tumblr.com/gtjt4bo/9L4raxpxh/cssgram-filters.css" rel="stylesheet">
  79.  
  80. <script src="//static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  81.  
  82. <link href="//static.tumblr.com/gtjt4bo/kIbrbaazv/glvwj.css" rel="stylesheet">
  83.  
  84. <script src="//static.tumblr.com/gtjt4bo/sgMrymui0/waitforelement.js"></script>
  85. <link href="//glen-themes.gitlab.io/thms/13/limonade-de-fraise.css" rel="stylesheet">
  86. <script src="//glen-themes.gitlab.io/thms/13/hibiscus-tea.js"></script>
  87. <script src="//glen-themes.gitlab.io/thms/13/more-tea.js"></script>
  88.  
  89. <!-- unblue polls -->
  90. <!-- glenthemes.tumblr.com/post/708014819571302400 -->
  91. <link href="//static.tumblr.com/gtjt4bo/mXBrpdj0n/unblue-polls.css" rel="stylesheet">
  92. <style unblue-polls>
  93. .poll-post {
  94. --Poll-Question-Font-Size: var(--Body-Font-Size);
  95.  
  96. --Poll-Option-Background-Color: {color:posts};
  97. --Poll-Option-Corner-Rounding: var(--Post-Corner-Roundness);
  98. --Poll-Option-Border-Size: 1px;
  99. --Poll-Option-Border-Color: {color:post borders inner};
  100. --Poll-Option-Padding: 8px;
  101. --Poll-Option-Font-Size: var(--Body-Font-Size);
  102. --Poll-Option-Spacing: 10px;
  103. --Poll-Option-Text-Color: {color:text};
  104.  
  105. --Poll-Option-HOVER-Border-Color: {color:special border};
  106. --Poll-Option-HOVER-Background-Color: {color:special background};
  107. --Poll-Option-HOVER-Text-Color: {color:special text};
  108. --Poll-Option-HOVER-Speed: 0.4s;
  109. }
  110.  
  111. .poll-see-results {
  112. padding-bottom:0!important;
  113. border-bottom:none!important;
  114. font-size:calc(var(--Poll-Option-Font-Size) - 1px)!important;
  115. text-transform:uppercase;
  116. letter-spacing:0.5px;
  117. }
  118. </style>
  119.  
  120. <!-- npf audio player -->
  121. <!-- glenthemes.tumblr.com/post/722160746171072512 -->
  122. <script src="//tmblr-npf-audio.gitlab.io/s/init.js"></script>
  123. <link href="//tmblr-npf-audio.gitlab.io/s/base.css" rel="stylesheet">
  124. <script>
  125. tumblr_npf_audio({
  126. emptyTitleText: "Untitled track",
  127. emptyArtistText: "Untitled artist",
  128. emptyAlbumText: "Untitled album",
  129.  
  130. titleLabel: "",
  131. artistLabel: "",
  132. albumLabel: ""
  133. });
  134. </script>
  135. <style edit-npf-audio-player>
  136. .npf-audio-wrapper {
  137. --NPF-Audio-Buttons-Size: var(--Audio-Post-Buttons-Size);
  138. --NPF-Audio-Buttons-Color: var(--Audio-Post-Buttons-Color);
  139. --NPF-Audio-Buttons-Padding: var(--Audio-Post-Buttons-Padding);
  140. --NPF-Audio-Buttons-Spacing: calc(var(--p) + var(--Audio-Post-Album-Right-Gap));
  141. --NPF-Audio-Image-Size: var(--Audio-Post-Album-Size);
  142. --NPF-Audio-Image-Spacing: 0px;
  143.  
  144. --t:calc((var(--NPF-Audio-Buttons-Padding) * 2) + var(--NPF-Audio-Buttons-Size));
  145. --p:calc(var(--NPF-Audio-Buttons-Padding) + ((var(--NPF-Audio-Image-Size) - var(--t)) / 2));
  146. }
  147.  
  148. .npf-audio-wrapper {
  149. position:relative;
  150. background:{color:special background};
  151. z-index:0;
  152. }
  153.  
  154. .npf-audio-background {
  155. margin-left:var(--p);
  156. }
  157.  
  158. .npf-audio-play, .npf-audio-pause {
  159. position:relative;
  160. z-index:0;
  161. }
  162.  
  163. .npf-audio-play:after, .npf-audio-pause:after {
  164. content:"";
  165. position:absolute;
  166. top:0;left:0;
  167. margin-top:calc(0px - var(--NPF-Audio-Buttons-Padding));
  168. margin-left:calc(0px - var(--NPF-Audio-Buttons-Padding));
  169. width:calc(100% + (var(--NPF-Audio-Buttons-Padding) * 2));
  170. height:calc(100% + (var(--NPF-Audio-Buttons-Padding) * 2));
  171. background:var(--Audio-Post-Buttons-Background);
  172. border-radius:100%;
  173. z-index:-1;
  174. }
  175.  
  176. .npf-audio-play svg { margin-left:1px; }
  177. .npf-audio-pause svg { margin-left:0; }
  178.  
  179. figcaption.audio-caption,
  180. figcaption.audio-caption ~ audio[controls]{
  181. display:none;
  182. }
  183.  
  184. .npf-audio-image {
  185. position:absolute;
  186. top:0;left:0;
  187. z-index:-1;
  188. }
  189.  
  190. .npf-audio-details {
  191. font-size:calc(var(--Body-Font-Size) - 1px);
  192. color:{color:special text};
  193. }
  194.  
  195. .npf-audio-details > * + * {
  196. margin-top:-1px;
  197. }
  198. </style>
  199.  
  200. <script src="//glen-npf.gitlab.io/other/neue.js"></script>
  201. <link href="//glen-npf.gitlab.io/other/neue.css" rel="stylesheet">
  202.  
  203. <!-------- CUSTOMIZE PANEL OPTIONS -------->
  204. {block:Hidden}
  205. <!-- hi if you're reading this click the back arrow to edit! -->
  206. <meta name="image:sidebar icon" content="//64.media.tumblr.com/3c028891215be5ea1b969866ae0a494a/43fd56aa2f0ea9ac-9a/s2048x3072/4ba3e9d1f95c66268213d15e3b47368712aa15bc.png">
  207. <meta name="image:header image" content="//66.media.tumblr.com/b7b8286748cad966a5a1eda5b362695f/8472e58f7738e2b6-2e/s1280x1920/3433c50da21a39636883ebb3c867e593433325fc.png">
  208. <meta name="image:background image" content="">
  209.  
  210. <meta name="color:background" content="#fdfdfd">
  211.  
  212. <!------ MUSIC PLAYER COLORS ------>
  213. <meta name="color:&#x1F338; &#x1D40C;&#x1D414;&#x1D412;&#x1D408;&#x1D402; &#x1D40F;&#x1D40B;&#x1D400;&#x1D418;&#x1D404;&#x1D411; &#x1F338;" content="#">
  214. <meta name="color:musicplayer bg" content="#fcfcfc">
  215. <meta name="color:musicplayer border" content="#eee">
  216. <meta name="color:musicplayer progress" content="#fdd1c1">
  217. <meta name="color:musicplayer buttons" content="#ebaf98">
  218. <meta name="color:song name" content="#333">
  219. <meta name="color:artist name" content="#999">
  220.  
  221. <!------ SIDEBAR COLORS ------>
  222. <meta name="color:&#x1F338; &#x1D412;&#x1D408;&#x1D403;&#x1D404;&#x1D401;&#x1D400;&#x1D411; &#x1F338;" content="#">
  223. <meta name="color:sidebar title" content="#333">
  224. <meta name="color:sidebar username" content="#999">
  225. <meta name="color:sidebar username hover" content="#f5b09d">
  226. <meta name="color:sidebar icon border A" content="#e0e0e0">
  227. <meta name="color:sidebar icon border B" content="#fff">
  228.  
  229. <!------ DESC COLORS ------>
  230. <meta name="color:&#x1F338;&#x20;&#x1D403;&#x1D404;&#x1D412;&#x1D402;&#x1D411;&#x1D408;&#x1D40F;&#x1D413;&#x1D408;&#x1D40E;&#x1D40D;&#x20;&#x1F338;" content="#">
  231. <meta name="color:desc text" content="#555">
  232. <meta name="color:desc bold" content="#ebaf98">
  233. <meta name="color:desc italic" content="#a29483">
  234. <meta name="color:desc link" content="#fc8f86">
  235. <meta name="color:desc link underline" content="#fed4d1">
  236. <meta name="color:desc line" content="#fdd1c1">
  237.  
  238. <!------ SEARCHBAR COLORS ------>
  239. <meta name="color:&#x1F338;&#x20;&#x1D412;&#x1D404;&#x1D400;&#x1D411;&#x1D402;&#x1D407;&#x1D401;&#x1D400;&#x1D411;&#x20;&#x1F338;" content="#">
  240. <meta name="color:searchbar placeholder text" content="#999">
  241. <meta name="color:searchbar text" content="#555">
  242. <meta name="color:searchbar icon" content="#ebaf98">
  243.  
  244. <!------ NAVLINKS COLORS ------>
  245. <meta name="color:&#x1F338;&#x20;&#x1D40D;&#x1D400;&#x1D415;&#x1D40B;&#x1D408;&#x1D40D;&#x1D40A;&#x1D412;&#x20;&#x1F338;" content="#">
  246. <meta name="color:navlinks bg" content="#fdbba8">
  247. <meta name="color:navlinks icon" content="#fff">
  248. <meta name="color:navlinks HOVER bg" content="#fc958f">
  249. <meta name="color:navlinks HOVER icon" content="#fff">
  250.  
  251. <!------ CUSTOMLINKS COLORS ------>
  252. <meta name="color:&#x1F338;&#x20;&#x1D402;&#x1D414;&#x1D412;&#x1D413;&#x1D40E;&#x1D40C;&#x20;&#x1D40B;&#x1D408;&#x1D40D;&#x1D40A;&#x1D412;&#x20;&#x1F338;" content="#">
  253. <meta name="color:customlinks plus" content="#f4b4a2">
  254.  
  255. <meta name="color:customlinks dot" content="#fdbba8">
  256. <meta name="color:customlinks text" content="#666">
  257.  
  258. <!------ HEADER COLORS ------>
  259. <meta name="color:&#x1F338;&#x20;&#x1D407;&#x1D404;&#x1D400;&#x1D403;&#x1D404;&#x1D411;&#x20;&#x1F338;" content="#">
  260. <meta name="color:header bg" content="#fff">
  261. <meta name="color:header info icons" content="#e8907f">
  262. <meta name="color:header info label" content="#e8907f">
  263. <meta name="color:header info text" content="#666">
  264. <meta name="color:header info links" content="#fc8f86">
  265. <meta name="color:header info links underline" content="#fed4d1">
  266.  
  267. <!------ POSTS COLORS ------>
  268. <meta name="color:&#x1F338;&#x20;&#x1D40F;&#x1D40E;&#x1D412;&#x1D413;&#x1D412;&#x20;&#x1F338;" content="#">
  269. <meta name="color:post" content="#fff">
  270. <meta name="color:post shadow" content="#000">
  271. <meta name="color:post borders outer" content="#eee">
  272. <meta name="color:post borders inner" content="#f2f2f2">
  273.  
  274. <meta name="color:text" content="#444">
  275. <meta name="color:link" content="#fc8f86">
  276. <meta name="color:link underline" content="#fed4d1">
  277.  
  278. <meta name="color:reblogger" content="#222">
  279.  
  280. <meta name="color:special background" content="#fafafa">
  281. <meta name="color:special text" content="#222">
  282. <meta name="color:special border" content="#e9e9e9">
  283.  
  284. <meta name="color:tags" content="#999">
  285.  
  286. <meta name="color:permalink" content="#222">
  287. <meta name="color:post buttons" content="#444">
  288. <meta name="color:like button liked" content="#f57a69">
  289.  
  290. <meta name="color:&#x1F338;&#x20;&#x1D40E;&#x1D413;&#x1D407;&#x1D404;&#x1D411;&#x20;&#x2F;&#x20;&#x1D40C;&#x1D408;&#x1D412;&#x1D402;&#x20;&#x1F338;" content="#">
  291. <meta name="color:scrollbar" content="#888">
  292. <meta name="color:scrollbar track" content="#eee">
  293. <meta name="color:scrollbar background" content="#fdfdfd">
  294.  
  295. <meta name="color:text selection background" content="#f7f4f1">
  296. <meta name="color:text selected" content="#333">
  297.  
  298. <meta name="color:tooltips bg" content="#fd9fa0">
  299. <meta name="color:tooltips border" content="#fd9fa0">
  300. <meta name="color:tooltips text" content="#fff">
  301.  
  302. <meta name="color:tumblr controls cog" content="#252525">
  303.  
  304. <!-------- GENERAL OPTIONS -------->
  305. <meta name="select:&#x1F338;&#x20;&#x1D406;&#x1D404;&#x1D40D;&#x1D404;&#x1D411;&#x1D400;&#x1D40B;&#x20;&#x1D40E;&#x1D40F;&#x1D413;&#x1D408;&#x1D40E;&#x1D40D;&#x1D412;&#x20;&#x1F338;" content="">
  306. <meta name="select:theme help message" title="show" content="show">
  307. <meta name="select:theme help message" title="hide" content="hide">
  308.  
  309. <meta name="select:window margin" title="55px" content="55px">
  310. <meta name="select:window margin" title="40px" content="40px">
  311. <meta name="select:window margin" title="45px" content="45px">
  312. <meta name="select:window margin" title="50px" content="50px">
  313. <meta name="select:window margin" title="60px" content="60px">
  314. <meta name="select:window margin" title="65px" content="65px">
  315. <meta name="select:window margin" title="70px" content="70px">
  316.  
  317. <meta name="select:font" title="Plus Jakarta Sans" content="Plus Jakarta Sans">
  318. <meta name="select:font" title="Libre Franklin" content="Libre Franklin">
  319. <meta name="select:font" title="Open Sans" content="Open Sans">
  320. <meta name="select:font" title="Manrope" content="Manrope">
  321. <meta name="select:font" title="Karla" content="Karla">
  322. <meta name="select:font" title="Google Sans" content="Google Sans">
  323. <meta name="select:font" title="Krub" content="Krub">
  324. <meta name="select:font" title="Sen" content="Sen">
  325. <meta name="select:font" title="Sora" content="Sora">
  326. <meta name="select:font" title="Quicksand" content="Quicksand">
  327. <meta name="select:font" title="Tajawal" content="Tajawal">
  328.  
  329. <meta name="select:font size" title="12px" content="12px">
  330. <meta name="select:font size" title="10px" content="10px">
  331. <meta name="select:font size" title="11px" content="11px">
  332. <meta name="select:font size" title="13px" content="13px">
  333. <meta name="select:font size" title="14px" content="14px">
  334. <meta name="select:font size" title="15px" content="15px">
  335.  
  336. <meta name="select:center gap" title="70px" content="70px">
  337. <meta name="select:center gap" title="50px" content="50px">
  338. <meta name="select:center gap" title="55px" content="55px">
  339. <meta name="select:center gap" title="60px" content="60px">
  340. <meta name="select:center gap" title="65px" content="65px">
  341. <meta name="select:center gap" title="75px" content="75px">
  342. <meta name="select:center gap" title="80px" content="80px">
  343. <meta name="select:center gap" title="85px" content="85px">
  344. <meta name="select:center gap" title="90px" content="90px">
  345.  
  346. <meta name="select:background image type" title="small" content="repeat">
  347. <meta name="select:background image type" title="large" content="full">
  348.  
  349. <!-------- SIDEBAR OPTIONS -------->
  350. <meta name="select:&#x1F338;&#x20;&#x1D412;&#x1D408;&#x1D403;&#x1D404;&#x1D401;&#x1D400;&#x1D411;&#x20;&#x1F338;" content="">
  351. <meta name="select:sidebar width" title="250px" content="250px">
  352. <meta name="select:sidebar width" title="200px" content="200px">
  353. <meta name="select:sidebar width" title="225px" content="225px">
  354. <meta name="select:sidebar width" title="275px" content="275px">
  355. <meta name="select:sidebar width" title="300px" content="300px">
  356. <meta name="select:sidebar width" title="325px" content="325px">
  357. <meta name="select:sidebar width" title="350px" content="350px">
  358.  
  359. <meta name="select:sidebar icon size" title="50px" content="50px">
  360. <meta name="select:sidebar icon size" title="40px" content="40px">
  361. <meta name="select:sidebar icon size" title="45px" content="45px">
  362. <meta name="select:sidebar icon size" title="55px" content="55px">
  363. <meta name="select:sidebar icon size" title="60px" content="60px">
  364. <meta name="select:sidebar icon size" title="65px" content="65px">
  365.  
  366. <meta name="select:sidebar icon padding" title="4px" content="4px">
  367. <meta name="select:sidebar icon padding" title="2px" content="2px">
  368. <meta name="select:sidebar icon padding" title="6px" content="6px">
  369. <meta name="select:sidebar icon padding" title="8px" content="8px">
  370. <meta name="select:sidebar icon padding" title="none" content="0px">
  371.  
  372. <meta name="select:&#x1F338;&#x20;&#x1D403;&#x1D404;&#x1D412;&#x1D402;&#x1D411;&#x1D408;&#x1D40F;&#x1D413;&#x1D408;&#x1D40E;&#x1D40D;&#x20;&#x1F338;" content="">
  373. <meta name="select:desc font size" title="11px" content="11px">
  374. <meta name="select:desc font size" title="10px" content="10px">
  375. <meta name="select:desc font size" title="12px" content="12px">
  376. <meta name="select:desc font size" title="13px" content="13px">
  377. <meta name="select:desc font size" title="14px" content="14px">
  378.  
  379. <meta name="select:desc text align" title="right" content="right">
  380. <meta name="select:desc text align" title="justify" content="justify">
  381. <meta name="select:desc text align" title="left" content="left">
  382. <meta name="select:desc text align" title="center" content="center">
  383.  
  384. <meta name="select:&#x1F338;&#x20;&#x1D412;&#x1D404;&#x1D400;&#x1D411;&#x1D402;&#x1D407;&#x1D401;&#x1D400;&#x1D411;&#x20;&#x1F338;" content="">
  385. <meta name="select:show searchbar" title="show" content="show">
  386. <meta name="select:show searchbar" title="hide" content="hide">
  387.  
  388. <meta name="select:searchbar icon" title="flipped" content="flipped">
  389. <meta name="select:searchbar icon" title="normal" content="normal">
  390.  
  391. <meta name="select:&#x1F338;&#x20;&#x1D402;&#x1D414;&#x1D412;&#x1D413;&#x1D40E;&#x1D40C;&#x20;&#x1D40B;&#x1D408;&#x1D40D;&#x1D40A;&#x1D412;&#x20;&#x1F338;" content="">
  392. <meta name="select:customlinks" title="toggle" content="toggle">
  393. <meta name="select:customlinks" title="always show" content="show">
  394.  
  395. <meta name="select:customlinks per row" title="3" content="3">
  396. <meta name="select:customlinks per row" title="1" content="1">
  397. <meta name="select:customlinks per row" title="2" content="2">
  398. <meta name="select:customlinks per row" title="4" content="4">
  399.  
  400. <meta name="select:customlinks column spacing" title="18px" content="18px">
  401. <meta name="select:customlinks column spacing" title="10px" content="10px">
  402. <meta name="select:customlinks column spacing" title="14px" content="14px">
  403. <meta name="select:customlinks column spacing" title="22px" content="22px">
  404. <meta name="select:customlinks column spacing" title="26px" content="26px">
  405.  
  406. <meta name="select:customlinks row spacing" title="11px" content="11px">
  407. <meta name="select:customlinks row spacing" title="5px" content="5px">
  408. <meta name="select:customlinks row spacing" title="8px" content="8px">
  409. <meta name="select:customlinks row spacing" title="14px" content="14px">
  410. <meta name="select:customlinks row spacing" title="17px" content="17px">
  411.  
  412. <!-------- HEADER OPTIONS -------->
  413. <meta name="select:&#x1F338;&#x20;&#x1D407;&#x1D404;&#x1D400;&#x1D403;&#x1D404;&#x1D411;&#x20;&#x1F338;" content="">
  414. <meta name="select:show header" title="show" content="show">
  415. <meta name="select:show header" title="hide" content="hide">
  416.  
  417. <meta name="select:header padding" title="26px" content="26px">
  418. <meta name="select:header padding" title="10px" content="10px">
  419. <meta name="select:header padding" title="14px" content="14px">
  420. <meta name="select:header padding" title="18px" content="18px">
  421. <meta name="select:header padding" title="22px" content="22px">
  422. <meta name="select:header padding" title="30px" content="30px">
  423. <meta name="select:header padding" title="34px" content="34px">
  424. <meta name="select:header padding" title="38px" content="38px">
  425.  
  426. <meta name="select:header bottom gap" title="50px" content="50px">
  427. <meta name="select:header bottom gap" title="25px" content="25px">
  428. <meta name="select:header bottom gap" title="30px" content="30px">
  429. <meta name="select:header bottom gap" title="35px" content="35px">
  430. <meta name="select:header bottom gap" title="40px" content="40px">
  431. <meta name="select:header bottom gap" title="45px" content="45px">
  432. <meta name="select:header bottom gap" title="55px" content="55px">
  433. <meta name="select:header bottom gap" title="60px" content="60px">
  434. <meta name="select:header bottom gap" title="65px" content="65px">
  435. <meta name="select:header bottom gap" title="70px" content="70px">
  436.  
  437. <!-------- POSTS OPTIONS -------->
  438. <meta name="select:&#x1F338;&#x20;&#x1D40F;&#x1D40E;&#x1D412;&#x1D413;&#x1D412;&#x20;&#x1F338;" content="">
  439. <meta name="select:post width" title="500px" content="500px">
  440. <meta name="select:post width" title="400px" content="400px">
  441. <meta name="select:post width" title="450px" content="450px">
  442. <meta name="select:post width" title="540px" content="540px">
  443. <meta name="select:post width" title="600px" content="600px">
  444.  
  445. <meta name="select:post padding" title="18px" content="18px">
  446. <meta name="select:post padding" title="10px" content="10px">
  447. <meta name="select:post padding" title="14px" content="14px">
  448. <meta name="select:post padding" title="22px" content="22px">
  449. <meta name="select:post padding" title="26px" content="26px">
  450.  
  451. <meta name="select:post borders" title="no" content="no">
  452. <meta name="select:post borders" title="yes" content="yes">
  453.  
  454. <meta name="select:photoset spacing" title="4px" content="4px">
  455. <meta name="select:photoset spacing" title="2px" content="2px">
  456. <meta name="select:photoset spacing" title="6px" content="6px">
  457. <meta name="select:photoset spacing" title="8px" content="8px">
  458. <meta name="select:photoset spacing" title="10px" content="10px">
  459.  
  460. <meta name="select:grayscale images" title="off" content="off">
  461. <meta name="select:grayscale images" title="reblogger icon only" content="rb-ico">
  462. <meta name="select:grayscale images" title="everything in posts" content="everything">
  463.  
  464. <meta name="select:click tags" title="yes" content="yes">
  465. <meta name="select:click tags" title="no" content="no">
  466.  
  467. <meta name="select:post spacing" title="45px" content="45px">
  468. <meta name="select:post spacing" title="30px" content="30px">
  469. <meta name="select:post spacing" title="25px" content="25px">
  470. <meta name="select:post spacing" title="35px" content="35px">
  471. <meta name="select:post spacing" title="40px" content="40px">
  472. <meta name="select:post spacing" title="50px" content="50px">
  473. <meta name="select:post spacing" title="55px" content="55px">
  474. <meta name="select:post spacing" title="60px" content="60px">
  475. <meta name="select:post spacing" title="65px" content="65px">
  476. <meta name="select:post spacing" title="70px" content="70px">
  477.  
  478. <!-------- PERMALINK OPTIONS -------->
  479. <meta name="select:&#x1F338;&#x20;&#x1D40F;&#x1D404;&#x1D411;&#x1D40C;&#x1D400;&#x1D40B;&#x1D408;&#x1D40D;&#x1D40A;&#x20;&#x1F338;" content="">
  480. <meta name="select:permalink top gap" title="regular" content="regular">
  481. <meta name="select:permalink top gap" title="small" content="small">
  482. <meta name="select:permalink top gap" title="large" content="large">
  483.  
  484. <meta name="select:permalink icon" title="eye" content="eye-open">
  485. <meta name="select:permalink icon" title="bookmark" content="ribbon">
  486. <meta name="select:permalink icon" title="link" content="link-chain">
  487. <meta name="select:permalink icon" title="paperclip" content="attach">
  488. <meta name="select:permalink icon" title="pin" content="pin">
  489. <meta name="select:permalink icon" title="pencil" content="pencil">
  490. <meta name="select:permalink icon" title="plant" content="plant">
  491. <meta name="select:permalink icon" title="radish" content="radish">
  492. <meta name="select:permalink icon" title="leaf" content="leaf">
  493. <meta name="select:permalink icon" title="moon & star" content="moon">
  494. <meta name="select:permalink icon" title="star" content="star">
  495. <meta name="select:permalink icon" title="cloud" content="cloud">
  496. <meta name="select:permalink icon" title="diamond" content="tetragon">
  497. <meta name="select:permalink icon" title="location pin 1" content="location">
  498. <meta name="select:permalink icon" title="location pin 2" content="check-in">
  499.  
  500. <!--------- TUMBLR CONTROLS OPTIONS --------->
  501. <meta name="select:&#x1F338;&#x20;&#x1D413;&#x1D414;&#x1D40C;&#x1D401;&#x1D40B;&#x1D411;&#x20;&#x1D402;&#x1D40E;&#x1D40D;&#x1D413;&#x1D411;&#x1D40E;&#x1D40B;&#x1D412;&#x20;&#x1F338;" content="">
  502. <meta name="select:tumblr controls color" title="black" content="black">
  503. <meta name="select:tumblr controls color" title="white" content="white">
  504.  
  505. <meta name="select:hover tumblr controls" title="hover" content="hover">
  506. <meta name="select:hover tumblr controls" title="always show" content="show">
  507. {/block:Hidden}
  508. <!--------- TEXT FIELDS --------->
  509. <meta name="text:move everything left" content="50px">
  510.  
  511. {block:Hidden}
  512. <meta name="text:&#917536;&#x200C;&#x200C;" content="&#x1F338;&#x20;&#x1D40C;&#x1D414;&#x1D412;&#x1D408;&#x1D402;&#x20;&#x1D40F;&#x1D40B;&#x1D400;&#x1D418;&#x1D404;&#x1D411;&#x20;&#x1F338;&NewLine;">
  513. {/block:Hidden}
  514. <meta name="text:&#x1F4AD; &#x29C;&#x1D0F;&#x1D21;&#x20;&#x1D1B;&#x1D0F;&#x20;&#x1D04;&#x29C;&#x1D00;&#x274;&#x262;&#x1D07;&#x20;&#x1D1B;&#x29C;&#x1D07;&#x20;&#x1D0D;&#x1D1C;&#x73;&#x26A;&#x1D04;&#x3F;" content="https://linktr.ee/direct_file_links">
  515. <meta name="text:song name" content="Spring Garden">
  516. <meta name="text:artist name" content="paniyolo">
  517. <meta name="text:song file mp3" content="https://rhizo.gitlab.io/m/Spring_Garden.mp3">
  518. <meta name="text:song volume" content="100%">
  519.  
  520. {block:Hidden}
  521. <meta name="text:&#917536;&#x200C;&#x200C;&#x200C;" content="&#x1F338;&#x20;&#x1D412;&#x1D408;&#x1D403;&#x1D404;&#x1D401;&#x1D400;&#x1D411;&#x20;&#x1F338;&NewLine;">
  522. {/block:Hidden}
  523. <meta name="text:sidebar title" content="&#x2A;&#x2727; &#x2014; parfait">
  524. <meta name="text:sidebar desc" content="your description here">
  525.  
  526. <meta name="text:searchbar placeholder text" content="search...">
  527.  
  528. {block:Hidden}
  529. <meta name="text:&#917536;&#x200C;" content="&#x1F338;&#x20;&#x1D407;&#x1D404;&#x1D400;&#x1D403;&#x1D404;&#x1D411;&#x20;&#x1D412;&#x1D413;&#x1D400;&#x1D413;&#x1D412;&#x20;&#x1F338;&NewLine;">
  530. {/block:Hidden}
  531.  
  532. <meta name="text:&#x1F4AD; &#x29C;&#x1D0F;&#x1D21;&#x20;&#x1D1B;&#x1D0F;&#x20;&#x1D07;&#x1D05;&#x26A;&#x1D1B;&#x20;&#x29C;&#x1D07;&#x1D00;&#x1D05;&#x1D07;&#x280;&#x20;&#x1D1B;&#x1D07;&#x78;&#x1D1B;&#x3F;" content="https://dub.sh/parfait-guide-slide11">
  533. <meta name="text:&#x1F4AD; &#x1D21;&#x29C;&#x1D00;&#x1D1B;&#x20;&#x26A;&#x1D04;&#x1D0F;&#x274;&#x73;&#x20;&#x1D04;&#x1D00;&#x274;&#x20;&#x26A;&#x20;&#x1D1C;&#x73;&#x1D07;&#x3F;" content="https://akaricons.com/">
  534. <meta name="text:header text column 1" content="&#x3C;li&#x3E;&NewLine;[icon-name] person&NewLine;[bold-text] A is for:&NewLine;[text] apple&NewLine;&NewLine;&#x3C;li&#x3E;&NewLine;[icon-name] face very happy&NewLine;[bold-text] C is for:&NewLine;[text] cannoli">
  535. <meta name="text:header text column 2" content="&#x3C;li&#x3E;&NewLine;[icon-name] person&NewLine;[bold-text] B is for:&NewLine;[text] bingo&NewLine;&NewLine;&#x3C;li&#x3E;&NewLine;[icon-name] face neutral&NewLine;[bold-text] D is for:&NewLine;[text] ding dong">
  536.  
  537. {block:Hidden}
  538. <meta name="text:&#917536;" content="&#x1F338;&#x20;&#x1D40F;&#x1D40E;&#x1D412;&#x1D413;&#x20;&#x1D412;&#x1D407;&#x1D400;&#x1D403;&#x1D40E;&#x1D416;&#x20;&#x1F338;&NewLine;">
  539. {/block:Hidden}
  540.  
  541. <meta name="text:post shadow size" content="1px">
  542. <meta name="text:post shadow strength" content="4%">
  543. <meta name="text:post shadow blur" content="7px">
  544.  
  545. {block:Hidden}
  546. <meta name="text:&#917536;&#x200B;" content="&#x1F338;&#x20;&#x1D402;&#x1D414;&#x1D412;&#x1D413;&#x1D40E;&#x1D40C;&#x20;&#x1D40B;&#x1D408;&#x1D40D;&#x1D40A;&#x1D412;&#x20;&#x1F338;&NewLine;">
  547. {/block:Hidden}
  548.  
  549. <meta name="text:customlink 1 name" content="sample link">
  550. <meta name="text:customlink 1 url" content="https://youtube.com/watch?v=ZkNMZlkrzaU">
  551.  
  552. {block:Hidden}
  553. <meta name="text:&#917536;&#x200B;&#x200B;" content="&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&NewLine;">
  554. {/block:Hidden}
  555.  
  556. <meta name="text:customlink 2 name" content="">
  557. <meta name="text:customlink 2 url" content="">
  558.  
  559. {block:Hidden}
  560. <meta name="text:&#917536;&#x200B;&#x200B;&#x200B;" content="&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&NewLine;">
  561. {/block:Hidden}
  562.  
  563. <meta name="text:customlink 3 name" content="">
  564. <meta name="text:customlink 3 url" content="">
  565.  
  566. {block:Hidden}
  567. <meta name="text:&#917536;&#x200B;&#x200B;&#x200B;&#x200B;" content="&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&NewLine;">
  568. {/block:Hidden}
  569.  
  570. <meta name="text:customlink 4 name" content="">
  571. <meta name="text:customlink 4 url" content="">
  572.  
  573. {block:Hidden}
  574. <meta name="text:&#917536;&#x200B;&#x200B;&#x200B;&#x200B;&#x200B;" content="&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&NewLine;">
  575. {/block:Hidden}
  576.  
  577. <meta name="text:customlink 5 name" content="">
  578. <meta name="text:customlink 5 url" content="">
  579.  
  580. {block:Hidden}
  581. <meta name="text:&#917536;&#x200B;&#x200B;&#x200B;&#x200B;&#x200B;&#x200B;" content="&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&NewLine;">
  582. {/block:Hidden}
  583.  
  584. <meta name="text:customlink 6 name" content="">
  585. <meta name="text:customlink 6 url" content="">
  586.  
  587. {block:Hidden}
  588. <meta name="text:&#917536;&#x200B;&#x200B;&#x200B;&#x200B;&#x200B;&#x200B;&#x200B;" content="&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&NewLine;">
  589. {/block:Hidden}
  590.  
  591. <meta name="text:customlink 7 name" content="">
  592. <meta name="text:customlink 7 url" content="">
  593.  
  594. {block:Hidden}
  595. <meta name="text:&#917536;&#x200B;&#x200B;&#x200B;&#x200B;&#x200B;&#x200B;&#x200B;&#x200B;" content="&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&#x2009;&#x2727;&NewLine;">
  596. {/block:Hidden}
  597.  
  598. <meta name="text:customlink 8 name" content="">
  599. <meta name="text:customlink 8 url" content="">
  600.  
  601. <!--------------------------------------------------->
  602.  
  603. <style type="text/css">
  604.  
  605. @font-face { font-family: "google sans"; src: url("//glen-assets.github.io/fonts/GoogleSans-Regular.ttf"); }
  606.  
  607. /*-------- TUMBLR CONTROLS --------*/
  608. iframe#tumblr_controls, .iframe-controls--desktop {
  609. top:9px!important;
  610. right:9px!important;
  611. position:fixed!important;
  612.  
  613. transform:scale(0.6,0.6);
  614. -webkit-transform:scale(0.6,0.6);
  615.  
  616. transform-origin:100% 0;
  617. z-index:999999!important;
  618. user-select:none;
  619. }
  620.  
  621. [tc-hov="hover"] iframe#tumblr_controls,
  622. [tc-hov="hover"] .iframe-controls--desktop {
  623. top:9px!important;
  624. right:var(--Cog-Edge-Offset)!important;
  625. opacity:0;
  626. transition:opacity 0.369s ease-in-out;
  627. }
  628.  
  629. [tc-hov="hover"] iframe#tumblr_controls:hover,
  630. [tc-hov="hover"] .iframe-controls--desktop:hover {
  631. opacity:1;
  632. }
  633.  
  634. [tumblr-controls="black"] iframe#tumblr_controls,
  635. [tumblr-controls="black"] .iframe-controls--desktop {
  636. filter:invert(100%) hue-rotate(180deg)!important;
  637. -webkit-filter:invert(100%) hue-rotate(180deg)!important;
  638. }
  639.  
  640. [corner-cog]{
  641. position:fixed;
  642. top:0;right:0;
  643. margin-top:var(--Cog-Edge-Offset);
  644. margin-right:var(--Cog-Edge-Offset);
  645. }
  646.  
  647. /* chrome adjustments for the tumblr controls */
  648. @supports(-webkit-text-security: circle){
  649. [tc-hov="hover"] iframe#tumblr_controls,
  650. [tc-hov="hover"] .iframe-controls--desktop {
  651. padding-right:calc(var(--TumblrControls-Cog-Size) + (var(--Scrollbar-Padding) / 2))!important;
  652. }
  653.  
  654. [corner-cog]{
  655. --Cog-Bonus-Gap:3px;
  656. margin-right:calc((var(--Cog-Edge-Offset) + var(--Cog-Bonus-Gap)) - calc(var(--Scrollbar-Padding) / 2));
  657. }
  658. }
  659.  
  660. /* firefox adjustments for the tumblr controls */
  661. @-moz-document url-prefix(){
  662. [tc-hov="hover"] iframe#tumblr_controls,
  663. [tc-hov="hover"] .iframe-controls--desktop {
  664. padding-right:calc(var(--TumblrControls-Cog-Size) + 14px)!important;
  665. }
  666. }
  667.  
  668. [tc-hov="show"] [corner-cog]{
  669. display:none;
  670. }
  671.  
  672. [corner-cog] [class*="ai-"]{
  673. font-size:var(--TumblrControls-Cog-Size);
  674. color:{color:tumblr controls cog};
  675. }
  676.  
  677.  
  678. /*------- SCROLLBAR --------*/
  679. ::-webkit-scrollbar {
  680. width:var(--Scrollbar-Padding);
  681. height:var(--Scrollbar-Padding);
  682. background-color:{color:scrollbar background};
  683. }
  684.  
  685. ::-webkit-scrollbar-thumb {
  686. background-color:{color:scrollbar};
  687. border:calc((var(--Scrollbar-Padding) - 1px) / 2) solid {color:scrollbar background};
  688. border-top:calc(var(--Scrollbar-Padding) / 2.69) solid {color:scrollbar background};
  689. border-bottom:calc(var(--Scrollbar-Padding) / 2.69) solid {color:scrollbar background};
  690. }
  691.  
  692. ::-webkit-scrollbar-track {
  693. background-color:{color:scrollbar track};
  694. border:calc((var(--Scrollbar-Padding) - 1px) / 2) solid {color:scrollbar background};
  695. border-top:calc(var(--Scrollbar-Padding) / 2.69) solid {color:scrollbar background};
  696. border-bottom:calc(var(--Scrollbar-Padding) / 2.69) solid {color:scrollbar background};
  697. }
  698.  
  699. ::-webkit-scrollbar-thumb:horizontal {
  700. border:calc((var(--Scrollbar-Padding) - 1px) / 2) solid {color:scrollbar background}!important;
  701. }
  702.  
  703. ::-webkit-scrollbar-track:horizontal {
  704. border:calc((var(--Scrollbar-Padding) - 1px) / 2) solid {color:scrollbar background}!important;
  705. }
  706.  
  707. ::-webkit-scrollbar-corner {
  708. background:{color:scrollbar background};
  709. }
  710.  
  711. /*------- TOOLTIPS --------*/
  712. #s-m-t-tooltip {
  713. padding:6px 9px;
  714. margin:17px;
  715. background:var(--Tooltips-BG);
  716. border:1px solid var(--Tooltips-Border);
  717. border-radius:2px;
  718. font-family:var(--SmallCaps-Font-Family);
  719. font-size:calc(var(--SmallCaps-Font-Size) - .5px);
  720. letter-spacing:0.5px;
  721. text-transform:uppercase;
  722. color:var(--Tooltips-Text);
  723. line-height:var(--Line-Height);
  724. z-index:99!important;
  725. max-width:40vw;
  726. }
  727.  
  728. #s-m-t-tooltip[style*="opacity: 0"]{
  729. display:none!important;
  730. }
  731.  
  732. /*---- GLOBAL FONT SETTINGS -----*/
  733. [font]{
  734. font-family:var(--Body-Font-Family);
  735. font-size:var(--Body-Font-Size);
  736. color:var(--Body-Text-Color);
  737. }
  738.  
  739. [font="Libre Franklin"]{
  740. font-size:calc(var(--Body-Font-Size) - .5px)!important;
  741. letter-spacing:0.1px;
  742. }
  743.  
  744. [font="Manrope"]{
  745. font-size:calc(var(--Body-Font-Size) - 1px)!important;
  746. letter-spacing:0.3px;
  747. }
  748.  
  749. [font="Plus Jakarta Sans"]{
  750. font-size:calc(var(--Body-Font-Size) - 0.5px)!important;
  751. letter-spacing:0.2px;
  752. }
  753.  
  754. [font="Google Sans"]{
  755. letter-spacing:0.5px;
  756. }
  757.  
  758. [font="Quicksand"]{
  759. font-size:calc(var(--Body-Font-Size) + .5px)!important;
  760. letter-spacing:0.2px;
  761. }
  762.  
  763. /*------- TEXT HIGHLIGHT --------*/
  764. ::selection {
  765. background:{color:text selection background};
  766. color:{color:text selected};
  767. }
  768.  
  769. ::-moz-selection {
  770. background:{color:text selection background};
  771. color:{color:text selected};
  772. }
  773.  
  774. img::selection {background:transparent}
  775. img::-moz-selection {background:transparent}
  776.  
  777. /*------- BASICS --------*/
  778. @-moz-document url-prefix(){
  779. * {
  780. scrollbar-width:thin; /* firefox only */
  781. }
  782. }
  783.  
  784. body {
  785. margin:0;
  786. background-color:{color:background};
  787. background-image:url('{image:background image}');
  788. background-attachment:fixed;
  789. overscroll-behavior-y:none;
  790. overflow-y:scroll!important;
  791. }
  792.  
  793. [bg-type="repeat"] body {
  794. background-repeat:repeat;
  795. }
  796.  
  797. [bg-type="full"] body {
  798. background-repeat:no-repeat;
  799. background-size:cover;
  800. background-position:center;
  801. }
  802.  
  803. a {
  804. text-decoration:none;
  805. color:var(--Link);
  806. }
  807.  
  808. a[title][class*="smt-current-element"]:not([href]){
  809. cursor:help;
  810. }
  811.  
  812. a[title=""]:not([href]){
  813. cursor:initial;
  814. }
  815.  
  816. p {
  817. margin:var(--Paragraph-Margins) 0;
  818. }
  819.  
  820. blockquote {
  821. margin:var(--Paragraph-Margins);
  822. margin-right:0;
  823. padding-left:var(--Paragraph-Margins);
  824. border-left:1px solid rgba({RGBcolor:text},0.169);
  825. }
  826.  
  827. .posts blockquote {
  828. margin-left:calc(var(--Reblogger-Avatar-Size) / 2);
  829. padding-left:calc((var(--Reblogger-Avatar-Size) / 2) + var(--Reblogger-Avatar-Gap-Right));
  830. }
  831.  
  832. b, strong {
  833. font-weight:normal;
  834. -webkit-text-stroke-width:.3px;
  835. -webkit-text-stroke-color:currentColor;
  836. }
  837.  
  838. /* headings */
  839. h1, h2, h3, h4, h5, h6 {
  840. margin:var(--Heading-Margins) 0;
  841. font-family:var(--Heading-Font-Family);
  842. font-weight:normal;
  843. font-size:var(--Body-Font-Size);
  844. text-transform:uppercase;
  845. letter-spacing:.3px;
  846. line-height:calc(var(--Line-Height) * 1.1);
  847. }
  848.  
  849. img, iframe {
  850. vertical-align:middle;
  851. max-width:100%;
  852. }
  853.  
  854. figure {
  855. margin:0;
  856. }
  857.  
  858. figure img {
  859. height:auto;
  860. }
  861.  
  862. pre, code {
  863. white-space:pre-wrap;
  864. font-family:cousine;
  865. font-size:calc(var(--Body-Font-Size) - 2px);
  866. background:{color:special background};
  867. border:1px solid {color:special border};
  868. color:{color:special text};
  869. }
  870.  
  871. pre {
  872. padding:0.8em 1em;
  873. }
  874.  
  875. code {
  876. padding:3px 4px;
  877. }
  878.  
  879. hr {
  880. display:block;
  881. margin:var(--Heading-Margins) auto;
  882. border-width:0px;
  883. width:69%;
  884. height:1px;
  885. background:{color:post borders inner};
  886. }
  887.  
  888. a.read_more {
  889. padding-bottom:1.5px!important;
  890. font-family:var(--SmallCaps-Font-Family);
  891. font-size:calc(var(--SmallCaps-Font-Size) + 1px);
  892. text-transform:uppercase;
  893. letter-spacing:.7px;
  894. }
  895.  
  896. a.read_more:before {
  897. content:"\f82d";
  898. display:inline-block;
  899. margin-top:-1.5px;
  900. font-family:phosphor;
  901. margin-right:4px;
  902. vertical-align:middle;
  903. }
  904.  
  905. ul, ol {
  906. margin:var(--Paragraph-Margins) 0;
  907. margin-left:1.69em;
  908. padding:0;
  909. }
  910.  
  911. ol li {
  912. padding-left:0.420em;
  913. }
  914.  
  915. ul li {
  916. position:relative;
  917. padding-left:0.25em;
  918. margin-left:calc((var(--Body-Font-Size) * 1.420) - 3px);
  919. list-style:none;
  920. }
  921.  
  922. ul li:before {
  923. content:"";
  924. position:absolute;
  925. margin-top:calc(((var(--Body-Font-Size) * var(--Line-Height-INT)) / 2) - 0px);
  926. transform:perspective(0);
  927. left:0;margin-left:calc((var(--Body-Font-Size) * -1.420) - 3px);
  928. width:var(--Body-Font-Size);
  929. height:.7px;
  930. background:rgba({RGBcolor:text},0.420);
  931. }
  932.  
  933. small {
  934. font-size:calc(var(--Body-Font-Size) * 0.85);
  935. }
  936.  
  937. .flex, [flex]{
  938. display:flex!important;
  939. align-items:center;
  940. }
  941.  
  942. .tmblr-attribution a {
  943. color:{color:link}!important;
  944. }
  945.  
  946. :root {
  947. --Window-Margin:{select:window margin};
  948. --Container-Shift-Amount:{text:move everything left};
  949.  
  950. /*--- MUSIC PLAYER SETTINGS ---*/
  951. --Circle-Size:38px;
  952. --Progress-Border-Size:2px;
  953. --Progress-Empty:{color:musicplayer border};
  954. --Progress-Fill:{color:musicplayer progress};
  955. --Player-Background:{color:musicplayer bg};
  956. --Play-Pause-Buttons-Size:9px;
  957. --Play-Pause-Buttons-Color:{color:musicplayer buttons};
  958. --Player-Text-Margin:13px;
  959.  
  960. --Song-Name-Font-Family:"readex pro";
  961. --Song-Name-Font-Size:var(--SmallCaps-Font-Size);
  962. --Song-Name-Color:{color:song name};
  963.  
  964. --Artist-Name-Font-Family:var(--Body-Font-Family);
  965. --Artist-Name-Font-Size:calc(var(--Body-Font-Size) - 1.5px);
  966. --Artist-Name-Color:{color:artist name};
  967.  
  968. /*--- SIDEBAR SETTINGS ---*/
  969. --Sidebar-Title-Font-Family:"readex pro";
  970. --Sidebar-Title-Font-Size:calc(var(--SmallCaps-Font-Size) + 1.5px);
  971.  
  972. --Sidebar-Username-Font-Family:"karla";
  973. --Sidebar-Username-Font-Size:calc(var(--SmallCaps-Font-Size) + .5px);
  974.  
  975. --Sidebar-Text-Row-Spacing:2px;
  976. --Sidebar-Text-Gap-Right:12px;
  977.  
  978. --Sidebar-Image-Size:{select:sidebar icon size};
  979. --Sidebar-Image-Padding:{select:sidebar icon padding};
  980. --Sidebar-Image-Border-Size:1px;
  981. --Sidebar-Image-Roundness:100%;
  982. --Sidebar-Image-Total-Size:calc(var(--Sidebar-Image-Size) + (var(--Sidebar-Image-Padding) * 2) + (var(--Sidebar-Image-Border-Size) * 2));
  983.  
  984. /*--- DESC SETTINGS ---*/
  985. --Description-Gap-X:14px; /* space between desc and the bar */
  986. --Description-Gap-Y:14px;
  987. --Description-Font-Family:var(--Body-Font-Family);
  988. --Description-Font-Size:{select:desc font size};
  989. --Description-Line-Height:185%;
  990. --Description-Bar-Width:3px;
  991. --Description-Bar-Bonus-Height:5px;
  992.  
  993. /* ignore the next few incoherent lines */
  994. --pfp-half:calc((var(--Sidebar-Image-Total-Size) / 2));
  995. --zcodl:calc(var(--pfp-half) - (var(--Description-Bar-Width) / 2));
  996. --eiwes:calc(var(--pfp-half) - (var(--Searchbar-Icon-Size) / 2));
  997. --kihwh:calc(var(--pfp-half) - (var(--CustomLinks-Toggle-Button-Size) / 2));
  998. --enxyf:calc(var(--pfp-half) - (var(--BoxLinks-Each-Total-Size) / 2));
  999.  
  1000. /*--- SEARCHBAR SETTINGS ---*/
  1001. --Searchbar-Font-Family:"public sans";
  1002. --Searchbar-Font-Size:calc(var(--SmallCaps-Font-Size) - 1px);
  1003. --Searchbar-Icon-Size:calc(var(--Searchbar-Font-Size) * 1.5);
  1004.  
  1005. /*--- NAVLINKS SETTINGS ---*/
  1006. --BoxLinks-Top-Gap:14px;
  1007.  
  1008. --BoxLinks-Icons-Size:12px;
  1009. --BoxLinks-Icons-Padding:6px;
  1010. --BoxLinks-Corner-Roundness:3px;
  1011. --BoxLinks-Each-Total-Size:calc(var(--BoxLinks-Icons-Size) + (var(--BoxLinks-Icons-Padding) * 2));
  1012. --BoxLinks-Spacing:5px;
  1013.  
  1014. --BoxLinks-Fade-Speed:0.269s;
  1015.  
  1016. /*--- CUSTOMLINKS SETTINGS ---*/
  1017. /* the 'plus' icon */
  1018. --CustomLinks-Toggle-Button-Size:14px;
  1019. --CustomLinks-Toggle-Button-Padding:5px;
  1020. --CustomLinks-Toggle-Button-Spin-Amount:135deg;
  1021. --CustomLinks-Toggle-Button-Spin-Speed:420ms;
  1022.  
  1023. --CustomLinks-Top-Gap:20px;
  1024.  
  1025. --CustomLinks-Area:calc({select:sidebar width} - var(--pfp-half) + var(--CustomLinks-Spacing-X));
  1026. --CustomLinks-Each-Width:calc(var(--CustomLinks-Area) / {select:customlinks per row});
  1027.  
  1028. --CustomLinks-Dot-Size:5px;
  1029. --CustomLinks-Dot-Gap-Right:7px;
  1030.  
  1031. --CustomLinks-Font-Family:"krub";
  1032. --CustomLinks-Font-Size:var(--SmallCaps-Font-Size);
  1033. --CustomLinks-Line-Height:1.5; /* number only */
  1034. --CustomLinks-Spacing-X:{select:customlinks column spacing};
  1035. --CustomLinks-Spacing-Y:{select:customlinks row spacing};
  1036.  
  1037. --CustomLinks-Fade-Speed:400ms; /* ms only */
  1038.  
  1039. /*--- HEADER SETTINGS ---*/
  1040. --Header-Corner-Roundness:5px;
  1041. --Header-Info-Columns:2;
  1042.  
  1043. --Header-Info-Row-Spacing:4px;
  1044. --Header-Info-Column-Spacing:10px;
  1045.  
  1046. --Header-Info-Icons-Size:calc(var(--Body-Font-Size) + 2px);
  1047. --Header-Info-Icons-Gap-Right:8px;
  1048.  
  1049. --Header-Info-Labels-Font-Size:calc(var(--SmallCaps-Font-Size) + .5px);
  1050. --Header-Info-Labels-Gap-Right:6px;
  1051.  
  1052. --Header-Info-Body-Text-Font-Family:var(--Body-Font-Family);
  1053. --Header-Info-Body-Text-Font-Size:calc(var(--Body-Font-Size) - 1px);
  1054.  
  1055. /*--- POST SETTINGS ---*/
  1056. --Paragraph-Margins:1em;
  1057. --Heading-Margins:1em;
  1058.  
  1059. --Body-Font-Family:{select:font};
  1060. --Body-Font-Size:{select:font size};
  1061. --Body-Text-Color:{color:text};
  1062.  
  1063. --Line-Height:1.7em; /* line-height with suffix */
  1064. --Line-Height-INT:1.7; /* line-height without suffix */
  1065.  
  1066. --Heading-Font-Family:"readex pro";
  1067. --Heading-Font-Size:calc(var(--Body-Font-Size) - 1px);
  1068.  
  1069. --SmallCaps-Font-Family:"readex pro";
  1070. --SmallCaps-Font-Size:calc(var(--Body-Font-Size) - 3px);
  1071.  
  1072. --Post-Total-Width:calc(var(--Post-Width) + (var(--Post-Padding) * 2) + (var(--Post-Border-Size) * 2));
  1073. --Post-Width:{select:post width};
  1074. --Post-Corner-Roundness:5px;
  1075. --Post-Padding:{select:post padding};
  1076. --Post-BG:{color:post};
  1077. --Post-Shadow-Distance:8px;
  1078. --Post-Shadow-Size:{text:post shadow size};
  1079. --Post-Shadow-Blur:{text:post shadow blur};
  1080. --Post-Shadow-Strength:{text:post shadow strength};
  1081. --Post-Spacing:{select:post spacing};
  1082.  
  1083. /* filter name MUST be encased in brackets */
  1084. /* available filters: dub.sh/cssgram-filters-list */
  1085. /* for no filter, remove the word in the quotes */
  1086. --Reblogger-Avatar-Filter:"lark";
  1087. --Reblogger-Avatar-Size:25px;
  1088. --Reblogger-Avatar-Gap-Right:8px;
  1089. --Reblogger-Username-Color:{color:reblogger};
  1090. --Reblogger-Avatar-Bottom-Gap:12px;
  1091.  
  1092. --Reblogs-Spacing:15px;
  1093. --Reblogs-Border:{color:post borders inner};
  1094.  
  1095. --Captions-Gap:15px;
  1096. --NPF-Caption-Spacing:var(--Captions-Gap);
  1097.  
  1098. --Photoset-Spacing:{select:photoset spacing};
  1099. --NPF-Image-Spacing:var(--Photoset-Spacing);
  1100.  
  1101. --Grayscale-Settings:grayscale(100%) contrast(105%) brightness(102%);
  1102. --Grayscale-Transition-Speed:0.269s;
  1103.  
  1104. --AskerPortrait-Size:40px;
  1105. --AskerPortrait-Padding:4px;
  1106.  
  1107. --Audio-Post-Album-Size:64px;
  1108. --Audio-Post-Album-Right-Gap:13px;
  1109. --Audio-Post-Buttons-Size:11px;
  1110. --Audio-Post-Buttons-Color:{color:navlinks icon};
  1111. --Audio-Post-Buttons-Padding:11px;
  1112. --Audio-Post-Buttons-Background:{color:navlinks bg};
  1113. --Audio-Post-Download-Color:{color:special text};
  1114.  
  1115. --Link:{color:link};
  1116. --Post-Borders-Inner:{color:post borders inner};
  1117.  
  1118. --Quote-Font-Family:var(--Heading-Font-Family);
  1119. --Quote-Font-Size:calc(var(--Body-Font-Size) - 1px);
  1120.  
  1121. /*--- TAGS SETTINGS ---*/
  1122. --Tags-Font-Family:"public sans";
  1123. --Tags-Font-Size:calc(var(--SmallCaps-Font-Size) - .5px);
  1124. --Tags-Fade-Speed:350ms; /* ms only */
  1125. --Tags-Spacing:4px;
  1126.  
  1127. /*--- PERMALINK SETTINGS ---*/
  1128. --Permalink-Padding:calc(var(--Post-Padding) + 2px);
  1129.  
  1130. --Permalink-Icon-Size:calc(var(--SmallCaps-Font-Size) * 1.4);
  1131. --Permalink-Icon-Gap:5px;
  1132.  
  1133. --Permalink-Font-Family:"dm sans";
  1134. --Permalink-Font-Size:calc(var(--SmallCaps-Font-Size) - 0px);
  1135.  
  1136. /*--- POST BUTTONS SETTINGS ---*/
  1137. --Post-Buttons-Size:var(--Body-Font-Size);
  1138. --Post-Buttons-Color:{color:post buttons};
  1139. --Like-Button-Liked:{color:like button liked};
  1140. --Post-Buttons-Spacing:4px;
  1141.  
  1142. /*--- POST NOTES SETTINGS ---*/
  1143. --Notes-Indicator-Size:14px;
  1144. --Notes-Indicator-Gap-Right:7px;
  1145. --Notes-Row-Spacing:7px;
  1146.  
  1147. /*--- MISC ---*/
  1148. --Center-Gap:{select:center gap};
  1149.  
  1150. --Pagination-Color:{color:text};
  1151.  
  1152. --TumblrControls-Color:{select:tumblr controls color};
  1153. --TumblrControls-Cog-Size:14px;
  1154. --TumblrControls-Cog-Color:{color:tumblr controls cog};
  1155. --Cog-Edge-Offset:15px;
  1156.  
  1157. --Scrollbar-Padding:13px;
  1158.  
  1159. --Tooltips-BG:{color:tooltips bg};
  1160. --Tooltips-Border:{color:tooltips border};
  1161. --Tooltips-Text:{color:tooltips text};
  1162. } /* end root */
  1163.  
  1164. [post-borders="yes"]:root {
  1165. --Post-Border-Size:1px;
  1166. }
  1167.  
  1168. [post-borders="no"]:root {
  1169. --Post-Border-Size:0px;
  1170. }
  1171.  
  1172. /*---- MAIN CONTAINER ----*/
  1173. .ubilu {
  1174. position:absolute;
  1175. margin:0 auto;
  1176. top:0;left:0;right:0;
  1177. text-align:center;
  1178. }
  1179.  
  1180. .jfqqj {
  1181. display:flex;
  1182. justify-content:center;
  1183. height:100%;
  1184. text-align:initial;
  1185. margin-left:calc(0px - var(--Container-Shift-Amount));
  1186. }
  1187.  
  1188. .vhmqu {
  1189. position:sticky;
  1190. top:0;
  1191. width:{select:sidebar width};
  1192. height:0;
  1193. margin-right:var(--Center-Gap);
  1194. flex-shrink:0;
  1195. }
  1196.  
  1197. .abtpk {
  1198. position:relative;
  1199. width:100%;
  1200. height:100vh;
  1201. display:table;
  1202. }
  1203.  
  1204. .uaizx {
  1205. display:table-cell;
  1206. vertical-align:middle;
  1207. }
  1208.  
  1209. .envzk {
  1210. margin:var(--CustomLinks-Top-Gap) 0;
  1211. }
  1212.  
  1213. [czmym]{
  1214. display:flex;
  1215. justify-content:flex-end;
  1216. }
  1217.  
  1218. /*--- SIDEBAR ICON TEXT ---*/
  1219. [jbwru]{
  1220. display:flex;
  1221. flex-direction:column;
  1222. justify-content:center;
  1223. line-height:150%;
  1224. text-align:right;
  1225. padding-right:var(--Sidebar-Text-Gap-Right);
  1226. margin-right:calc(0px - var(--Sidebar-Text-Gap-Right));
  1227. }
  1228.  
  1229. [avi-tit]{
  1230. font-family:var(--Sidebar-Title-Font-Family);
  1231. font-size:var(--Sidebar-Title-Font-Size);
  1232. letter-spacing:0.5px;
  1233. text-transform:uppercase;
  1234. color:{color:sidebar title};
  1235. }
  1236.  
  1237. [avi-tit] + [avi-username]{
  1238. margin-top:var(--Sidebar-Text-Row-Spacing);
  1239. }
  1240.  
  1241. [avi-username]{
  1242. font-family:var(--Sidebar-Username-Font-Family);
  1243. font-size:var(--Sidebar-Username-Font-Size);
  1244. text-transform:uppercase;
  1245. letter-spacing:.7px;
  1246. color:{color:sidebar username};
  1247. transition:color 0.420s ease-in-out;
  1248. }
  1249.  
  1250. [jbwru]:hover [avi-username]{
  1251. color:{color:sidebar username hover};
  1252. }
  1253.  
  1254. [avi-username]:before {
  1255. content:"@";
  1256. font-family:inter;
  1257. margin-right:1.3px;
  1258. font-size:calc(var(--Sidebar-Username-Font-Size) - 1px);
  1259. }
  1260.  
  1261. /*--- SIDEBAR ICON ---*/
  1262. [sb-avi]{
  1263. position:relative;
  1264. margin-left:var(--Sidebar-Text-Gap-Right);
  1265. width:var(--Sidebar-Image-Total-Size);
  1266. height:var(--Sidebar-Image-Total-Size);
  1267. overflow:hidden;
  1268. flex-shrink:0;
  1269. }
  1270.  
  1271. [sb-avi], [sb-avi] img {
  1272. border-radius:var(--Sidebar-Image-Roundness);
  1273. }
  1274.  
  1275. [sb-avi] img:not([bvahz]){
  1276. padding:var(--Sidebar-Image-Padding);
  1277. background:{color:sidebar icon border B};
  1278. border:var(--Sidebar-Image-Border-Size) solid {color:sidebar icon border A};
  1279. width:var(--Sidebar-Image-Size);
  1280. height:var(--Sidebar-Image-Size);
  1281. object-fit:cover;
  1282. }
  1283.  
  1284. [sb-avi] [bvahz]{
  1285. position:absolute;
  1286. top:0;left:0;
  1287. margin-top:calc(var(--Sidebar-Image-Border-Size) + var(--Sidebar-Image-Padding));
  1288. margin-left:calc(var(--Sidebar-Image-Border-Size) + var(--Sidebar-Image-Padding));
  1289. width:calc(100% - (var(--Sidebar-Image-Border-Size) * 2) - (var(--Sidebar-Image-Padding) * 2));
  1290. height:auto;
  1291. z-index:2;
  1292. opacity:0;
  1293. }
  1294.  
  1295. /*--- SIDEBAR DESCRIPTION ---*/
  1296. [amche]{
  1297. margin:var(--Description-Gap-Y) 0;
  1298. margin-left:calc(0px - var(--zcodl));
  1299. }
  1300.  
  1301. [pfgil]{
  1302. display:table;
  1303. border-collapse:separate;
  1304. border-spacing:var(--zcodl) 0;
  1305. width:100%;
  1306. }
  1307.  
  1308. [yconm]{
  1309. display:table-row;
  1310. }
  1311.  
  1312. [ghjax]{
  1313. display:table-cell;
  1314. }
  1315.  
  1316. [desc]{
  1317. margin-right:calc(0px - var(--zcodl) + var(--Description-Gap-X));
  1318. padding-top:calc((var(--Description-Bar-Bonus-Height) / 2) - 1.5px);
  1319. padding-bottom:calc(var(--Description-Bar-Bonus-Height) / 2);
  1320. font-family:var(--Description-Font-Family);
  1321. font-size:var(--Description-Font-Size);
  1322. color:{color:desc text};
  1323. line-height:var(--Description-Line-Height);
  1324. text-align:{select:desc text align};
  1325. }
  1326.  
  1327. [desc] a {
  1328. color:{color:desc link};
  1329. padding-bottom:.5px;
  1330. border-bottom:1px solid {color:desc link underline};
  1331. }
  1332.  
  1333. [desc] b, [desc] strong {
  1334. color:{color:desc bold};
  1335. }
  1336.  
  1337. [desc] i, [desc] em {
  1338. color:{color:desc italic};
  1339. }
  1340.  
  1341. [barlinething]{
  1342. width:var(--Description-Bar-Width);
  1343. background:{color:desc line};
  1344. border-radius:var(--Description-Bar-Width);
  1345. }
  1346.  
  1347. /*--- SIDEBAR SEARCHBAR ---*/
  1348. [schb="hide"]{
  1349. display:none;
  1350. }
  1351.  
  1352. [searchbar-form] form {
  1353. display:flex;
  1354. align-items:center;
  1355. justify-content:flex-end;
  1356. margin-top:-3px;
  1357. margin-right:var(--eiwes);
  1358. margin-bottom:0;
  1359. }
  1360.  
  1361. [sbf] input {
  1362. display:block;
  1363. padding:6px;
  1364. margin:0;
  1365. margin-top:1px;
  1366. border:none;
  1367. outline:none;
  1368. background:transparent;
  1369. font-family:var(--Searchbar-Font-Family);
  1370. font-size:var(--Searchbar-Font-Size);
  1371. text-transform:uppercase;
  1372. letter-spacing:.7px;
  1373. text-align:right;
  1374. box-sizing:border-box;
  1375. color:{color:searchbar text};
  1376. line-height:1em;
  1377. flex:1;
  1378. }
  1379.  
  1380. [sbf] input::placeholder {
  1381. color:{color:searchbar placeholder text};
  1382. }
  1383.  
  1384. [sbf] input:focus::-webkit-input-placeholder {color:transparent;}
  1385. [sbf] input:focus::-moz-placeholder {color:transparent;}
  1386. [sbf] input:focus:-ms-input-placeholder {color:transparent;}
  1387.  
  1388. [sbf] button {
  1389. display:block;
  1390. flex-shrink:0;
  1391. padding:0;
  1392. margin-left:calc(var(--Description-Gap-X) - (var(--Searchbar-Icon-Size) / 2) + 2px - 12px);
  1393. margin-right:calc(0px - 2px - 6px);
  1394. border:none;
  1395. background:transparent;
  1396. outline:none;
  1397. line-height:var(--Searchbar-Icon-Size);
  1398. cursor:pointer;
  1399. }
  1400.  
  1401. [tib="flipped"] {
  1402. margin-left:calc(var(--Description-Gap-X) - (var(--Searchbar-Icon-Size) / 2) - 12px)!important;
  1403. margin-right:calc(0px - 6px)!important;
  1404. }
  1405.  
  1406. [tib="flipped"] [class*="ai-"]{
  1407. transform:scaleX(-1);
  1408. }
  1409.  
  1410. [sbf] [class*="ai-"]{
  1411. display:block;
  1412. padding:6px;
  1413. font-size:var(--Searchbar-Icon-Size);
  1414. color:{color:searchbar icon};
  1415. }
  1416.  
  1417. /*---- HEADER SECTION ----*/
  1418. .xcjya {
  1419. min-width:var(--Post-Total-Width);
  1420. }
  1421.  
  1422. .header-sect[sh="hide"]{
  1423. display:none;
  1424. }
  1425.  
  1426. .header-sect[sh="hide"] + .postscont {
  1427. margin-top:calc(0px - var(--Post-Spacing));
  1428. padding-top:var(--Window-Margin);
  1429. }
  1430.  
  1431. .header-sect {
  1432. position:relative;
  1433. margin-top:var(--Window-Margin);
  1434. width:var(--Post-Total-Width);
  1435. }
  1436.  
  1437. .hfzqw:after {
  1438. content:"";
  1439. position:absolute;
  1440. top:0;left:0;
  1441. margin-top:var(--Post-Shadow-Distance);
  1442. margin-left:var(--Post-Shadow-Distance);
  1443. width:calc(100% - var(--Post-Shadow-Distance) + var(--Post-Shadow-Size));
  1444. height:calc(100% - var(--Post-Shadow-Distance) + var(--Post-Shadow-Size));
  1445. border-radius:var(--Post-Corner-Roundness);
  1446. filter:blur(var(--Post-Shadow-Blur));
  1447. -webkit-filter:blur(var(--Post-Shadow-Blur));
  1448. background:rgba({RGBcolor:post shadow},var(--Post-Shadow-Strength));
  1449. z-index:-1;
  1450. }
  1451.  
  1452. .qmtwu {
  1453. overflow:hidden;
  1454. border-radius:var(--Header-Corner-Roundness);
  1455. }
  1456.  
  1457. [header-img*="assets.tumblr.com/images/x.gif"]{
  1458. display:none;
  1459. }
  1460.  
  1461. [header-img]{
  1462. position:relative;
  1463. background:transparent;
  1464. }
  1465.  
  1466. [header-img]:after {
  1467. content:"";
  1468. position:absolute;
  1469. top:0;left:0;
  1470. display:block;
  1471. width:100%;
  1472. height:100%;
  1473. z-index:2;
  1474. }
  1475.  
  1476. [header-img] img {
  1477. max-width:100%;
  1478. }
  1479.  
  1480. [header-texts]{
  1481. padding:{select:header padding};
  1482. background:{color:header bg};
  1483. line-height:var(--Line-Height);
  1484. visibility:collapse;
  1485. }
  1486.  
  1487. .mwfgi {
  1488. display:grid;
  1489. grid-gap:var(--Header-Info-Column-Spacing);
  1490. grid-template-columns:repeat(var(--Header-Info-Columns), 1fr);
  1491. }
  1492.  
  1493. [header-texts] li {
  1494. list-style-type:none;
  1495. margin:0;
  1496. padding:0;
  1497. }
  1498.  
  1499. [header-texts] li + li {
  1500. margin-top:var(--Header-Info-Row-Spacing);
  1501. }
  1502.  
  1503. [header-texts] li > * {
  1504. display:table-cell;
  1505. }
  1506.  
  1507. .header-sect[has-col-1]:not([has-col-2]) .mwfgi {
  1508. grid-template-columns:repeat(1, 1fr);
  1509. }
  1510.  
  1511. [ht-col]{
  1512.  
  1513. }
  1514.  
  1515. [htl-wrap]{
  1516. white-space:nowrap;
  1517. padding-right:var(--Header-Info-Labels-Gap-Right);
  1518. }
  1519.  
  1520. [htl-wrap] > * {
  1521. display:inline-block;
  1522. vertical-align:middle;
  1523. }
  1524.  
  1525. [header-texts] [class*="ai-"]{
  1526. font-size:var(--Header-Info-Icons-Size);
  1527. color:{color:header info icons};
  1528. }
  1529.  
  1530. [header-texts] [class*="ai-"] + [label]{
  1531. margin-left:var(--Header-Info-Icons-Gap-Right);
  1532. }
  1533.  
  1534. [header-texts] [label]{
  1535. font-family:var(--SmallCaps-Font-Family);
  1536. font-size:var(--Header-Info-Labels-Font-Size);
  1537. text-transform:uppercase;
  1538. letter-spacing:.7px;
  1539. color:{color:header info label};
  1540. }
  1541.  
  1542. [deet-text]{
  1543. font-family:var(--Header-Info-Body-Text-Font-Family);
  1544. font-size:var(--Header-Info-Body-Text-Font-Size);
  1545. color:{color:header info text};
  1546. }
  1547.  
  1548. [deet-text] a {
  1549. color:{color:header info links};
  1550. padding-bottom:.5px;
  1551. border-bottom:1px solid {color:header info links underline};
  1552. }
  1553.  
  1554. /*---- NAVLINKS ----*/
  1555. [dpaec]{
  1556. display:flex;
  1557. align-items:center;
  1558. justify-content:flex-end;
  1559. font-size:0;
  1560. line-height:0;
  1561. margin-top:var(--BoxLinks-Top-Gap);
  1562. }
  1563.  
  1564. [cls="show"] [dpaec]{
  1565. margin-right:calc(var(--enxyf) - 1px);
  1566. }
  1567.  
  1568. [cls="toggle"] [dpaec]{
  1569. margin-right:calc(var(--kihwh) - 1px);
  1570. }
  1571.  
  1572. [boxlinks]{
  1573. display:flex;
  1574. align-items:center;
  1575. }
  1576.  
  1577. [boxlinks] a {
  1578. display:block;
  1579. flex-shrink:0;
  1580. padding:var(--BoxLinks-Icons-Padding);
  1581. background:{color:navlinks bg};
  1582. border-radius:var(--BoxLinks-Corner-Roundness);
  1583. transition:background var(--BoxLinks-Fade-Speed) ease-in-out;
  1584. }
  1585.  
  1586. [boxlinks] a + a {
  1587. margin-left:var(--BoxLinks-Spacing);
  1588. }
  1589.  
  1590. [boxlinks] [lucide]{
  1591. display:block;
  1592. width:var(--BoxLinks-Icons-Size);
  1593. height:var(--BoxLinks-Icons-Size);
  1594. }
  1595.  
  1596. [boxlinks] svg.lucide {
  1597. display:block;
  1598. width:var(--BoxLinks-Icons-Size);
  1599. height:var(--BoxLinks-Icons-Size);
  1600. stroke:{color:navlinks icon};
  1601. stroke-width:1.8;
  1602. transition:stroke var(--BoxLinks-Fade-Speed) ease-in-out;
  1603. pointer-events:none;
  1604. }
  1605.  
  1606. .glenbiz {
  1607. display:block;
  1608. padding-left:.5px;
  1609. margin-right:-.5px;
  1610. width:var(--BoxLinks-Icons-Size);
  1611. height:var(--BoxLinks-Icons-Size);
  1612. pointer-events:none;
  1613. }
  1614.  
  1615. .glenbiz svg {
  1616. display:block;
  1617. width:100%;
  1618. height:100%;
  1619. }
  1620.  
  1621. .glenbiz svg path {
  1622. fill:{color:navlinks icon};
  1623. transition:fill var(--BoxLinks-Fade-Speed) ease-in-out;
  1624. }
  1625.  
  1626. /* navlinks: hover stuff */
  1627. [boxlinks] a:hover {
  1628. background:{color:navlinks HOVER bg};
  1629. }
  1630.  
  1631. [boxlinks] a:hover svg.lucide {
  1632. stroke:{color:navlinks HOVER icon};
  1633. }
  1634.  
  1635. [boxlinks] a:hover .glenbiz svg path {
  1636. fill:{color:navlinks HOVER icon};
  1637. }
  1638.  
  1639. /* customlinks plus icon */
  1640. [cls="show"] [dpaec] .cl-tog {
  1641. display:none;
  1642. }
  1643.  
  1644. .cl-tog {
  1645. --CustomLinks-Toggle-Button-Bonus-Left-Gap:2px;
  1646. margin-left:calc(var(--Description-Gap-X) - (var(--CustomLinks-Toggle-Button-Size) / 2) + var(--CustomLinks-Toggle-Button-Bonus-Left-Gap) - var(--CustomLinks-Toggle-Button-Padding));
  1647. margin-right:calc(0px - var(--CustomLinks-Toggle-Button-Padding));
  1648.  
  1649. padding:var(--CustomLinks-Toggle-Button-Padding);
  1650. cursor:help;
  1651. }
  1652.  
  1653. .cl-tog svg {
  1654. display:block;
  1655. width:var(--CustomLinks-Toggle-Button-Size);
  1656. height:var(--CustomLinks-Toggle-Button-Size);
  1657. transform-origin:center;
  1658. stroke-width:3;
  1659. stroke:{color:customlinks plus};
  1660. transition:transform var(--CustomLinks-Toggle-Button-Spin-Speed) ease-in-out;
  1661. }
  1662.  
  1663. .fcovn svg {
  1664. transform:rotate(var(--CustomLinks-Toggle-Button-Spin-Amount));
  1665. }
  1666.  
  1667. /*---- CUSTOM LINKS ----*/
  1668. [krryo]{
  1669. margin-top:calc(var(--CustomLinks-Spacing-Y) / -2);
  1670. margin-left:calc(var(--CustomLinks-Spacing-X) / -2);
  1671. margin-bottom:calc(var(--CustomLinks-Spacing-Y) / -2);
  1672. }
  1673.  
  1674. [cls="toggle"] [krryo]{
  1675. display:none;
  1676. opacity:0;
  1677. margin-right:calc(var(--pfp-half) - (var(--CustomLinks-Spacing-X) / 2));
  1678. }
  1679.  
  1680. [cls="show"] [krryo]{
  1681. margin-right:calc(var(--Sidebar-Image-Border-Size) + var(--Sidebar-Image-Padding));
  1682. }
  1683.  
  1684. .cl-opac {
  1685. opacity:1!important;
  1686. }
  1687.  
  1688. [cls="toggle"] [krryo], .cl-opac {
  1689. transition:opacity var(--CustomLinks-Fade-Speed) ease-in-out;
  1690. }
  1691.  
  1692. /*-------*/
  1693.  
  1694. [efrhc]{
  1695. display:flex;
  1696. justify-content:flex-end;
  1697. }
  1698.  
  1699. [customlink-col]{
  1700. flex-shrink:0;
  1701. }
  1702.  
  1703. [customlink]{
  1704. display:block;
  1705. overflow:hidden;
  1706. }
  1707.  
  1708. [cl-inner]{
  1709. display:flex;
  1710. padding:calc(var(--CustomLinks-Spacing-Y) / 2) calc(var(--CustomLinks-Spacing-X) / 2);
  1711. }
  1712.  
  1713. [cl-inner] > * {
  1714. flex-shrink:0;
  1715. display:block;
  1716. }
  1717.  
  1718. [customlink] [dot]{
  1719. display:block;
  1720. /* tfw the number of brackets matches the creases on my forehead!! */
  1721. margin-top:calc(((((((var(--CustomLinks-Font-Size) * var(--CustomLinks-Line-Height)) - var(--CustomLinks-Font-Size)) / 2) + (var(--CustomLinks-Font-Size) * var(--CustomLinks-Line-Height))) - var(--CustomLinks-Dot-Size)) / 2) - 1px);
  1722.  
  1723. width:var(--CustomLinks-Dot-Size);
  1724. height:var(--CustomLinks-Dot-Size);
  1725. border-radius:100%;
  1726. background:{color:customlinks dot};
  1727. font-size:0;
  1728. line-height:0;
  1729. }
  1730.  
  1731. [customlink] [dot] + [text]{
  1732. margin-left:var(--CustomLinks-Dot-Gap-Right);
  1733. }
  1734.  
  1735. [customlink] [text]{
  1736. font-family:var(--CustomLinks-Font-Family);
  1737. font-size:var(--CustomLinks-Font-Size);
  1738. text-transform:uppercase;
  1739. letter-spacing:1px;
  1740. color:{color:customlinks text};
  1741. line-height:var(--CustomLinks-Line-Height);
  1742. white-space:pre-line;
  1743. word-break:break-all;
  1744. }
  1745.  
  1746. /*---- POSTS ----*/
  1747. .header-sect[sh="show"] + .postscont {
  1748. margin-top:calc(0px - var(--Post-Spacing));
  1749. padding-top:{select:header bottom gap};
  1750. }
  1751.  
  1752. .postscont {
  1753. padding-bottom:var(--Window-Margin);
  1754. width:var(--Post-Total-Width);
  1755. }
  1756.  
  1757. .posts {
  1758. position:relative;
  1759. margin-top:var(--Post-Spacing);
  1760. }
  1761.  
  1762. .posts:after, .notescont:after {
  1763. content:"";
  1764. position:absolute;
  1765. top:0;left:0;
  1766. margin-top:var(--Post-Shadow-Distance);
  1767. margin-left:var(--Post-Shadow-Distance);
  1768. width:calc(100% - var(--Post-Shadow-Distance) + var(--Post-Shadow-Size));
  1769. height:calc(100% - var(--Post-Shadow-Distance) + var(--Post-Shadow-Size));
  1770. border-radius:var(--Post-Corner-Roundness);
  1771. filter:blur(var(--Post-Shadow-Blur));
  1772. -webkit-filter:blur(var(--Post-Shadow-Blur));
  1773. background:rgba({RGBcolor:post shadow},var(--Post-Shadow-Strength));
  1774. z-index:-1;
  1775. }
  1776.  
  1777. [black-and-white="rb-ico"] [reblogger-icon].cssgram:before {visibility:hidden}
  1778. [black-and-white="rb-ico"] [reblogger-icon].cssgram:after {visibility:hidden}
  1779.  
  1780. [black-and-white="everything"] [reblogger-icon].cssgram:before {visibility:hidden}
  1781. [black-and-white="everything"] [reblogger-icon].cssgram:after {visibility:hidden}
  1782.  
  1783. [black-and-white="rb-ico"] [reblogger-icon]{
  1784. transition:filter var(--Grayscale-Transition-Speed) ease-in-out;
  1785. filter:var(--Grayscale-Settings);
  1786. }
  1787.  
  1788. [black-and-white="everything"] [reblogger-icon],
  1789. [black-and-white="everything"] img,
  1790. [black-and-white="everything"] iframe,
  1791. [black-and-white="everything"] video {
  1792. transition:filter var(--Grayscale-Transition-Speed) ease-in-out;
  1793. filter:var(--Grayscale-Settings);
  1794. }
  1795.  
  1796. [black-and-white="everything"] .posts:hover img,
  1797. [black-and-white="everything"] .posts:hover iframe,
  1798. [black-and-white="everything"] .posts:hover video {
  1799. filter:none;
  1800. }
  1801.  
  1802. /*-----------------------*/
  1803.  
  1804. .postinner, .notescont {
  1805. position:relative;
  1806. padding:var(--Post-Padding);
  1807. background:{color:post};
  1808. border:var(--Post-Border-Size) solid {color:post borders outer};
  1809. border-radius:var(--Post-Corner-Roundness);
  1810. overflow:hidden;
  1811. line-height:var(--Line-Height);
  1812. }
  1813.  
  1814. .postinner a:not(.reblog-url a, .tumblr_blog, .linkpost-title, .single-photo, .post_media_photo_anchor, .inari, .tagsdiv a, .permadiv a, .asker-name a, .tmblr-attribution a), [glvwj] a {
  1815. padding-bottom:.5px;
  1816. border-bottom:1px solid {color:link underline};
  1817. }
  1818.  
  1819. /*---- REBLOG HEAD ----*/
  1820. .reblog-wrap {
  1821. margin:0 calc(0px - var(--Post-Padding));
  1822. padding:0 var(--Post-Padding);
  1823. }
  1824.  
  1825. .reblog-wrap + .reblog-wrap {
  1826. margin-top:var(--Reblogs-Spacing);
  1827. padding-top:var(--Reblogs-Spacing);
  1828. border-top:1px solid var(--Reblogs-Border);
  1829. }
  1830.  
  1831. .reblog-head {
  1832. display:flex;
  1833. align-items:center;
  1834. }
  1835.  
  1836. [reblogger-icon]{
  1837. display:block;
  1838. width:var(--Reblogger-Avatar-Size);
  1839. height:var(--Reblogger-Avatar-Size);
  1840. background-color:{color:post};
  1841. background-size:cover;
  1842. background-position:center;
  1843. border-radius:100%;
  1844. clip-path:circle(50% at 50% 50%);
  1845. overflow:hidden;
  1846. }
  1847.  
  1848. [reblogger-icon] + .reblog-url {
  1849. margin-left:var(--Reblogger-Avatar-Gap-Right);
  1850. }
  1851.  
  1852. .reblog-url, .reblog-url a, [customize-page="true"] .tumblr_blog, .tmblr-attribution {
  1853. font-family:var(--SmallCaps-Font-Family);
  1854. font-size:var(--SmallCaps-Font-Size);
  1855. text-transform:uppercase;
  1856. letter-spacing:.5px;
  1857. color:var(--Reblogger-Username-Color);
  1858. }
  1859.  
  1860. .reblog-url .deac {
  1861. margin-left:3px;
  1862. color:var(--Body-Text-Color);
  1863. }
  1864.  
  1865. .nosrc {
  1866. display:none;
  1867. visibility:collapse;
  1868. margin-bottom:var(--Reblogger-Avatar-Bottom-Gap);
  1869. }
  1870.  
  1871. .reblog-head + .reblog-comment {
  1872. margin-top:calc(0px - var(--Paragraph-Margins) + var(--Reblogger-Avatar-Bottom-Gap));
  1873. }
  1874.  
  1875. /*---- NPF... STUFF ----*/
  1876. figure[data-orig-src] + figure[data-orig-src]{
  1877. margin-top:var(--Photoset-Spacing);
  1878. }
  1879.  
  1880. img.npf-small {
  1881. width:initial!important;
  1882. }
  1883.  
  1884. [customize-page="true"] .npf-video {
  1885. max-height:var(--Post-Width);
  1886. display:flex;
  1887. align-items:center;
  1888. justify-content:center;
  1889. }
  1890.  
  1891. .tmblr-full video {
  1892. cursor:pointer;
  1893. }
  1894.  
  1895. video::-webkit-media-controls-panel {
  1896. position:absolute;
  1897. bottom:0;
  1898. background:transparent!important;
  1899. width:100%;
  1900. box-sizing:border-box;
  1901. opacity:1!important;
  1902. }
  1903.  
  1904. video::-webkit-media-controls-volume-slider, video::-webkit-media-controls-timeline {
  1905. /*display:none!important;*/
  1906. }
  1907.  
  1908. * + .npf-link-block {
  1909. margin-top:10px;
  1910. }
  1911.  
  1912. .npf-link-block {
  1913. margin-top:0px;
  1914. margin-bottom:0;
  1915. border-color:{color:special border}!important;
  1916. border-radius:0!important;
  1917. }
  1918.  
  1919. .npf-link-block + * {
  1920. margin-bottom:var(--Paragraph-Margins);
  1921. }
  1922.  
  1923. .npf-link-block a {
  1924. padding:0!important;
  1925. border:none!important;
  1926. }
  1927.  
  1928. .npf-link-block .title {
  1929. font-family:var(--SmallCaps-Font-Family)!important;
  1930. font-size:calc(var(--SmallCaps-Font-Size) + 4px)!important;
  1931. text-transform:uppercase;
  1932. letter-spacing:.5px;
  1933. color:{color:link}!important;
  1934. line-height:1.7em!important;
  1935. text-shadow:1px 1px 1px rgba(0,0,0,0.1);
  1936. }
  1937.  
  1938. .npf-link-block .bottom {
  1939. background:{color:special background}!important;
  1940. }
  1941.  
  1942. .npf-link-block .description {
  1943. font-family:var(--SmallCaps-Font-Family)!important;
  1944. font-size:calc(var(--SmallCaps-Font-Size) + 2px)!important;
  1945. text-transform:uppercase;
  1946. letter-spacing:.5px;
  1947. color:{color:special text}!important;
  1948. line-height:1.7em!important;
  1949. }
  1950.  
  1951. .npf-link-block .site-name {
  1952. text-transform:initial!important;
  1953. font-family:var(--Body-Font-Family)!important;
  1954. font-weight:normal!important;
  1955. font-size:var(--Body-Font-Size)!important;
  1956. color:rgba({RGBcolor:special text},0.8)!important;
  1957. }
  1958.  
  1959. .npf-link-block .description + .site-name {
  1960. margin-top:0;
  1961. }
  1962.  
  1963. .npf-link-block .poster:before {
  1964. display:none!important;
  1965. }
  1966.  
  1967. .npf-link-block .title {
  1968. font-weight:normal!important;
  1969. }
  1970.  
  1971. .npf-link-block .poster .title {
  1972. display:none!important;
  1973. }
  1974.  
  1975. .npf-link-block.no-poster .title {
  1976. padding:0.8em!important;
  1977. text-shadow:none!important;
  1978. }
  1979.  
  1980. .npf-link-block.no-poster .title + .bottom {
  1981. border-top:1px solid {color:special border};
  1982. }
  1983.  
  1984. /*---- TEXT POSTS (TITLE) ----*/
  1985. .post-title {
  1986. margin-top:2px;
  1987. margin-bottom:0;
  1988. padding:0.8em;
  1989. background:{color:special background};
  1990. border:1px solid {color:special border};
  1991. font-size:var(--Heading-Font-Size);
  1992. color:{color:special text};
  1993. text-align:center;
  1994. }
  1995.  
  1996. .post-title + *, .linkpost-title + * {
  1997. margin-top:var(--Heading-Margins);
  1998. }
  1999.  
  2000. /*---- LINK POSTS ----*/
  2001. .linkpost-title {
  2002. display:block;
  2003. color:{color:special text};
  2004. text-align:center;
  2005. }
  2006.  
  2007. .linkpost-title [link-icon]{
  2008. display:flex;
  2009. align-items:center;
  2010. justify-content:center;
  2011. }
  2012.  
  2013. .linkpost-title i[class*="-"]{
  2014. padding:calc(var(--Body-Font-Size) * 0.69);
  2015. background:{color:special background};
  2016. border:1px solid {color:special border};
  2017. border-radius:100%;
  2018. font-size:calc(var(--Body-Font-Size) * 1.25);
  2019. color:{color:special text};
  2020. line-height:1em;
  2021. }
  2022.  
  2023. .linkpost-title [link-display-text]{
  2024. display:block;
  2025. margin-top:calc(var(--Body-Font-Size) * 1);
  2026. font-family:var(--Heading-Font-Family);
  2027. font-size:var(--Heading-Font-Size);
  2028. text-transform:uppercase;
  2029. letter-spacing:.5px;
  2030. word-spacing:.3px;
  2031. color:{color:text};
  2032. }
  2033.  
  2034. .linkpost-title + .link-excerpt {
  2035. margin-top:calc(var(--Body-Font-Size) * 1.25);
  2036. }
  2037.  
  2038. .link-excerpt {
  2039. padding:0.8em calc(0.8em + 2px);
  2040. border:1px solid {color:post borders inner};
  2041. border-radius:var(--Post-Corner-Roundness);
  2042. }
  2043.  
  2044. .link-excerpt + * {
  2045. margin-top:var(--Reblogger-Avatar-Bottom-Gap);
  2046. }
  2047.  
  2048. .le-host {
  2049. font-family:var(--SmallCaps-Font-Family);
  2050. font-size:var(--SmallCaps-Font-Size);
  2051. text-transform:uppercase;
  2052. letter-spacing:.7px;
  2053. }
  2054.  
  2055. /*---- PHOTO POSTS ----*/
  2056. .nosrc + .single-photo .photopic {
  2057. margin-top:0;
  2058. }
  2059.  
  2060. a.single-photo {
  2061. cursor:pointer;
  2062. }
  2063.  
  2064. img.photopic {
  2065. width:100%;
  2066. }
  2067.  
  2068. .nosrc + .reblog-comment .photoset-grid {
  2069. margin-top:0!important;
  2070. }
  2071.  
  2072. [photoset-layout] {
  2073. grid-gap:var(--Photoset-Spacing);
  2074. }
  2075.  
  2076. [photoset-layout] div {
  2077. cursor:pointer;
  2078. backface-visibility:hidden;
  2079. }
  2080.  
  2081. .caption {
  2082. margin-top:var(--Captions-Gap);
  2083. }
  2084.  
  2085. /*----- LIGHTBOX BS -----*/
  2086. .tmblr-lightbox, #tumblr_lightbox {
  2087. background-color:rgba({RGBcolor:post},0.69)!important;
  2088. }
  2089.  
  2090. .tmblr-lightbox .vignette {
  2091. background-image:none!important;
  2092. }
  2093.  
  2094. #vignette {display:none!important}
  2095.  
  2096. .lightbox-image, #tumblr_lightbox_left_image, #tumblr_lightbox_center_image, #tumblr_lightbox_right_image {
  2097. margin-top:calc(0px - var(--Post-Padding));
  2098. }
  2099.  
  2100. .tmblr-lightbox img, #tumblr_lightbox img {
  2101. max-width:initial;
  2102. box-shadow:none!important;
  2103. border:var(--Post-Border-Size) solid {color:post borders outer}!important;
  2104. border-radius:var(--Post-Corner-Roundness)!important;
  2105. padding:var(--Post-Padding);
  2106. background:{color:post}!important;
  2107. box-shadow:var(--Post-Shadow-Distance) var(--Post-Shadow-Distance) var(--Post-Shadow-Blur) var(--Post-Shadow-Size) rgba({RGBcolor:post shadow},var(--Post-Shadow-Strength))!important;
  2108. }
  2109.  
  2110. /*----- QUOTE POSTS -----*/
  2111. .quote-ico {
  2112. display:grid;
  2113. place-items:center;
  2114. margin-bottom:calc(var(--Body-Font-Size) * 1.3);
  2115. }
  2116.  
  2117. .quote-ico svg.lucide {
  2118. width:calc(var(--Body-Font-Size) * 1.3);
  2119. height:calc(var(--Body-Font-Size) * 1.3);
  2120. stroke:{color:text};
  2121. }
  2122.  
  2123. .quote-words, .npf_quote {
  2124. padding:0 calc(var(--Post-Padding) * 1.69);
  2125. font-family:var(--Quote-Font-Family)!important;
  2126. font-size:var(--Quote-Font-Size)!important;
  2127. text-transform:uppercase;
  2128. letter-spacing:.3px;
  2129. text-align:center;
  2130. line-height:185%;
  2131. }
  2132.  
  2133. .quote-words + .quote-source,
  2134. .npf_quote + p[style*="margin-bottom: 0px;"]{
  2135. margin-top:var(--Paragraph-Margins);
  2136. text-align:center;
  2137. }
  2138.  
  2139. /*----- VIDEO POSTS -----*/
  2140. .nosrc + .tmblr-video {
  2141. margin-top:0!important;
  2142. }
  2143.  
  2144. .tmblr-video {
  2145. max-width:initial;
  2146. }
  2147.  
  2148. .tumblr_video_container, .tumblr_video_iframe {
  2149. width:100%!important;
  2150. }
  2151.  
  2152. /*---- CHAT POSTS ----*/
  2153. .chatwrap {
  2154. display:table;
  2155. width:calc(100% - 2px);
  2156. border:1px solid var(--Post-Borders-Inner);
  2157. }
  2158.  
  2159. .chat_row {
  2160. position:relative;
  2161. display:table-row;
  2162. overflow:hidden;
  2163. }
  2164.  
  2165. .chat_row:after {
  2166. content:"";
  2167. position:absolute;
  2168. bottom:0;left:0;
  2169. transform:perspective(0);
  2170. width:100%;
  2171. height:1px;
  2172. background:var(--Post-Borders-Inner);
  2173. }
  2174.  
  2175. .chatwrap .chat_row:last-child:after {
  2176. display:none;
  2177. }
  2178.  
  2179. .chat_row code:only-child {
  2180. display:block;
  2181. padding:0.8em;
  2182. border:none;
  2183. background:transparent;
  2184. }
  2185.  
  2186. .chat_label, .chat_content {
  2187. box-sizing:border-box;
  2188. }
  2189.  
  2190. .chat_label {
  2191. display:table-cell;
  2192. padding:1em;
  2193. width:30%;
  2194. padding-right:1em;
  2195. font-family:var(--SmallCaps-Font-Family);
  2196. font-size:var(--SmallCaps-Font-Size);
  2197. text-transform:uppercase;
  2198. letter-spacing:.3px;
  2199. }
  2200.  
  2201. .chat_content {
  2202. display:table-cell;
  2203. padding:1em;
  2204. width:70%;
  2205. }
  2206.  
  2207. .chat_label + .chat_content {
  2208. border-left:1px solid var(--Post-Borders-Inner);
  2209. }
  2210.  
  2211. /*---- AUDIO POSTS ----*/
  2212. .audio-post .npf_inst img {
  2213. width:100%;
  2214. }
  2215.  
  2216. .aud-emb {display:none}
  2217.  
  2218. .audiowrap {
  2219. display:flex;
  2220. align-items:center;
  2221. }
  2222.  
  2223. .albumwrap {
  2224. position:relative;
  2225. width:var(--Audio-Post-Album-Size);
  2226. height:var(--Audio-Post-Album-Size);
  2227. display:flex;
  2228. align-items:center;
  2229. justify-content:center;
  2230. }
  2231.  
  2232. .albumwrap[has-cover] .audplac {display:none}
  2233.  
  2234. .butts {
  2235. width:calc(var(--Audio-Post-Buttons-Size) + (var(--Audio-Post-Buttons-Padding) * 2));
  2236. height:calc(var(--Audio-Post-Buttons-Size) + (var(--Audio-Post-Buttons-Padding) * 2));
  2237. background:var(--Audio-Post-Buttons-Background);
  2238. border-radius:100%;
  2239. display:flex;
  2240. align-items:center;
  2241. justify-content:center;
  2242. cursor:pointer;
  2243. z-index:2;
  2244. }
  2245.  
  2246. .overplay, .overpause {
  2247. width:var(--Audio-Post-Buttons-Size);
  2248. height:var(--Audio-Post-Buttons-Size);
  2249. -webkit-mask-size:contain;
  2250. -webkit-mask-repeat:no-repeat;
  2251. -webkit-mask-position:center;
  2252. background:var(--Audio-Post-Buttons-Color);
  2253. }
  2254.  
  2255. .overplay {
  2256. margin-left:2px;
  2257. -webkit-mask-image:var(--audioplay);
  2258. }
  2259.  
  2260. .overpause {
  2261. display:none;
  2262. -webkit-mask-image:var(--audiopause);
  2263. }
  2264.  
  2265. .ov-y {display:block}
  2266. .ov-z {display:none}
  2267.  
  2268. .audplac {
  2269. position:absolute;
  2270. top:0;left:0;
  2271. width:var(--Audio-Post-Album-Size);
  2272. height:var(--Audio-Post-Album-Size);
  2273. /*background:var(--Audio-Post-Buttons-Background);*/
  2274. }
  2275.  
  2276. .albumwrap img {
  2277. position:absolute;
  2278. top:0;left:0;
  2279. width:100%;
  2280. height:100%;
  2281. }
  2282.  
  2283. .audiotxt {
  2284. flex:1;
  2285. height:var(--Audio-Post-Album-Size);
  2286. padding:var(--Audio-Post-Album-Right-Gap);
  2287. background:{color:special background};
  2288. display:flex;
  2289. align-items:center;
  2290. box-sizing:border-box;
  2291. display:flex;
  2292. align-items:center;
  2293. justify-content:space-between;
  2294. font-size:calc(var(--Body-Font-Size) - 1px);
  2295. color:{color:special text};
  2296. }
  2297.  
  2298. .odin > div + div {
  2299. margin-top:-1px;
  2300. }
  2301.  
  2302. .aud-song-name, .npf-audio-title {
  2303. font-family:var(--SmallCaps-Font-Family);
  2304. font-size:calc(var(--SmallCaps-Font-Size) + .5px);
  2305. text-transform:uppercase;
  2306. letter-spacing:.7px;
  2307. word-spacing:.3px;
  2308. -webkit-text-stroke-width:.3px;
  2309. -webkit-text-stroke-color:currentColor;
  2310. }
  2311.  
  2312. .aud-song-name[has-name] .untit {
  2313. display:none;
  2314. }
  2315.  
  2316. .aud-artist[has-artist] .unart {
  2317. display:none;
  2318. }
  2319.  
  2320. .inari {
  2321. display:block;
  2322. padding:6px;
  2323. margin-right:-6px;
  2324. cursor:pointer;
  2325. }
  2326.  
  2327. .int-all {
  2328. display:block;
  2329. width:calc(var(--Audio-Post-Buttons-Size) + 6px);
  2330. height:calc(var(--Audio-Post-Buttons-Size) + 6px);
  2331. -webkit-mask-size:contain;
  2332. -webkit-mask-repeat:no-repeat;
  2333. -webkit-mask-position:center;
  2334. -webkit-mask-image:var(--install);
  2335. background:var(--Audio-Post-Download-Color);
  2336. pointer-events:none;
  2337. }
  2338.  
  2339. /*---- SPOTIFY ----*/
  2340. iframe[src*='open.spotify.com'][src*='track'], figure[data-npf*='open.spotify.com'][data-npf*='track']{
  2341. height:80px!important;
  2342. }
  2343.  
  2344. .spotify_audio_player {
  2345. width:100%;
  2346. }
  2347.  
  2348. /*---- SOUNDCLOUD ----*/
  2349. .tmblr-video iframe[src*='soundcloud.com']{
  2350. }
  2351.  
  2352. .audio-soundcloud {
  2353. max-height:113px;
  2354. border-radius:4px;
  2355. overflow:hidden;
  2356. }
  2357.  
  2358. .soundcloud_audio_player {
  2359. margin:-1px;
  2360. margin-bottom:0;
  2361. width:calc(100% + 2px);
  2362. max-width:initial;
  2363. }
  2364.  
  2365. /*---- ASK/ANSWER POSTS ----*/
  2366. .answer-post .nosrc {
  2367. display:none;
  2368. }
  2369.  
  2370. .une_question {
  2371.  
  2372. }
  2373.  
  2374. .asker-person {
  2375. display:grid;
  2376. place-items:center;
  2377. text-align:center;
  2378. }
  2379.  
  2380. .asker-person a {
  2381. color:{color:special text}!important;
  2382. }
  2383.  
  2384. .une_question .reblog-comment {
  2385. flex:1;
  2386. margin-left:12px;
  2387. }
  2388.  
  2389. .askpot {
  2390. padding:var(--AskerPortrait-Padding);
  2391. background:{color:special background};
  2392. border:1px solid {color:special border};
  2393. border-radius:100%;
  2394. }
  2395.  
  2396. .askpot [reblogger-icon]{
  2397. width:var(--AskerPortrait-Size);
  2398. height:var(--AskerPortrait-Size);
  2399. border-radius:100%;
  2400. }
  2401.  
  2402. .asker-name {
  2403. display:block;
  2404. margin-top:calc(var(--Body-Font-Size) * 1);
  2405. padding:5px 6px;
  2406. background:{color:special background};
  2407. border:1px solid {color:special border};
  2408. border-radius:2px;
  2409. font-family:var(--SmallCaps-Font-Family);
  2410. font-size:var(--SmallCaps-Font-Size);
  2411. text-transform:uppercase;
  2412. letter-spacing:.5px;
  2413. color:{color:special text};
  2414. line-height:1em;
  2415. }
  2416.  
  2417. .question_text {
  2418. margin-top:calc(var(--Body-Font-Size) * 1.25);
  2419. padding:0 var(--Post-Padding);
  2420. text-align:center;
  2421. }
  2422.  
  2423. .question_text > p:first-child {
  2424. margin-top:4px;
  2425. }
  2426.  
  2427. .question_text > p:only-child {
  2428. margin-bottom:0;
  2429. }
  2430.  
  2431. .answerer + * {
  2432. margin-top:var(--Captions-Gap);
  2433. }
  2434.  
  2435. .une_question + .une_reponse {
  2436. margin-top:var(--Paragraph-Margins);
  2437. }
  2438.  
  2439. /*---- TAGS SECTION ----*/
  2440. .tagsdiv {
  2441. margin-top:var(--Captions-Gap);
  2442. }
  2443.  
  2444. .tagsdiv[clicktags="yes"] {
  2445. {block:IndexPage}
  2446. display:none;
  2447. opacity:0;
  2448. transition:opacity var(--Tags-Fade-Speed) ease-in-out;
  2449. {/block:IndexPage}
  2450. }
  2451.  
  2452. .tagsfade {
  2453. opacity:1!important;
  2454. }
  2455.  
  2456. .tagsin {
  2457. display:flex;
  2458. flex-wrap:wrap;
  2459. justify-content:flex-end;
  2460. margin:calc(0px - var(--Tags-Spacing));
  2461. margin-bottom:calc((((var(--SmallCaps-Font-Size) - 1px) * var(--Line-Height-INT)) / 2) * -1);
  2462. text-align:right;
  2463. }
  2464.  
  2465. .tagsin a {
  2466. position:relative;
  2467. display:block;
  2468. margin:0 var(--Tags-Spacing);
  2469. font-family:var(--Tags-Font-Family);
  2470. font-size:var(--Tags-Font-Size);
  2471. text-transform:uppercase;
  2472. letter-spacing:.7px;
  2473. color:{color:tags};
  2474. }
  2475.  
  2476. .tagsin a:before {
  2477. content:"#";
  2478. font-family:work sans;
  2479. margin-right:.5px;
  2480. }
  2481.  
  2482. /*---- PERMALINK BAR ----*/
  2483. .permadiv[topdiff="small"]{
  2484. --Permalink-Top-Gap:var(--Permalink-Font-Size);
  2485. }
  2486.  
  2487. .permadiv[topdiff="regular"]{
  2488. --Permalink-Top-Gap:calc(var(--Post-Padding) + 1px);
  2489. }
  2490.  
  2491. .permadiv[topdiff="large"]{
  2492. --Permalink-Top-Gap:calc(var(--Permalink-Font-Size) * 2.25);
  2493. }
  2494.  
  2495. .permadiv {
  2496. margin-top:var(--Permalink-Top-Gap);
  2497. display:flex;
  2498. align-items:center;
  2499. justify-content:space-between;
  2500. font-family:var(--Permalink-Font-Family);
  2501. font-size:var(--Permalink-Font-Size);
  2502. text-transform:uppercase
  2503. }
  2504.  
  2505. .permadiv, .permadiv a {
  2506. color:{color:permalink};
  2507. }
  2508.  
  2509. .permaleft {
  2510. text-transform:uppercase;
  2511. letter-spacing:1px;
  2512. word-spacing:0px;
  2513. }
  2514.  
  2515. .permaleft a {
  2516. display:flex;
  2517. align-items:center;
  2518. margin:-5px;
  2519. padding:5px;
  2520. }
  2521.  
  2522. .permaleft a:not([href]){
  2523. cursor:default;
  2524. }
  2525.  
  2526. .permaleft [class*="ai-"]{
  2527. margin-right:var(--Permalink-Icon-Gap);
  2528. font-size:var(--Permalink-Icon-Size);
  2529. color:{color:permalink};
  2530. }
  2531.  
  2532. .permaright {
  2533. display:flex;
  2534. align-items:center;
  2535. justify-content:center;
  2536. letter-spacing:1px;
  2537. line-height:var(--Post-Buttons-Size);
  2538. }
  2539.  
  2540. .permaright a {
  2541. display:block;
  2542. position:relative;
  2543. {block:IndexPage}
  2544. width:var(--Post-Buttons-Size);
  2545. height:var(--Post-Buttons-Size);
  2546. {/block:IndexPage}
  2547. backface-visibility:hidden;
  2548. }
  2549.  
  2550. .permaright [class*="ph-"],
  2551. .permaright [class*="ai-"],
  2552. .permaright [class*="mi-"]{
  2553. font-size:var(--Post-Buttons-Size);
  2554. color:var(--Post-Buttons-Color);
  2555. }
  2556.  
  2557. .permaright [class*="mi-"]{
  2558. display:block;
  2559. transform:translateX(-1px) translateY(-0.1px);
  2560. font-size:calc(var(--Post-Buttons-Size) + 1px);
  2561. }
  2562.  
  2563. .permaright [class*="ph-"]{
  2564. transform:translateY(0.4px);
  2565. }
  2566.  
  2567. .permaright [class*="ai-"]{
  2568. display:block;
  2569. transform:translateY(0.5px);
  2570. }
  2571.  
  2572. .permaright span {
  2573. display:block;
  2574. cursor:default;
  2575. }
  2576.  
  2577. .permaright a + a {
  2578. margin-left:var(--Post-Buttons-Spacing);
  2579. }
  2580.  
  2581. .permaright[clicktags="no"] .clicktags {
  2582. display:none;
  2583. }
  2584.  
  2585. .clicktags {
  2586. cursor:help;
  2587. }
  2588.  
  2589. .like_button {
  2590. position:absolute;
  2591. top:0;left:0;
  2592. width:100%;
  2593. height:100%;
  2594. z-index:2;
  2595. }
  2596.  
  2597. .like_button iframe {
  2598. width:100%;
  2599. height:100%;
  2600. vertical-align:initial;
  2601. opacity:0;
  2602. }
  2603.  
  2604. .like_button.liked + .ai-heart {
  2605. color:var(--Like-Button-Liked);
  2606. }
  2607.  
  2608. .permaright a[dash]{
  2609. font-size:calc(var(--SmallCaps-Font-Size) + 1px);
  2610. }
  2611.  
  2612. /*---- POST NOTES ----*/
  2613. .notescont {
  2614. margin-top:var(--Post-Spacing);
  2615. margin-bottom:0!important;
  2616. background:{color:post};
  2617. border:var(--Post-Border-Size) solid {color:post borders outer};
  2618. overflow:initial;
  2619. }
  2620.  
  2621. .notescont h1 {
  2622. margin-top:5px;
  2623. margin-bottom:calc(var(--Heading-Margins) + 4px);
  2624.  
  2625. font-family:var(--Heading-Font-Family);
  2626. font-size:calc(var(--Heading-Font-Size) + 0px);
  2627. font-weight:normal!important;
  2628. letter-spacing:1px;
  2629. text-align:center;
  2630. }
  2631.  
  2632. .notescont ol.notes {
  2633. padding:0;
  2634. margin:0;
  2635. }
  2636.  
  2637. .notescont li {
  2638. max-width:100%;
  2639. list-style-type:none;
  2640. padding:0!important;
  2641. }
  2642.  
  2643. .notescont li + li {
  2644. margin-top:var(--Notes-Row-Spacing);
  2645. }
  2646.  
  2647. .notescont li:before {
  2648. font-family:phosphor;
  2649. font-size:var(--Notes-Indicator-Size);
  2650. color:{color:text};
  2651. vertical-align:middle;
  2652. }
  2653.  
  2654. .notescont li.like:before {
  2655. content:"\f1ca";
  2656. }
  2657.  
  2658. .notescont li.reblog:before {
  2659. content:"\f2c3";
  2660. }
  2661.  
  2662. .notescont li.reply:before,
  2663. .notescont li.with_commentary:before {
  2664. content:"\f0db"!important;
  2665. }
  2666.  
  2667. .notescont .avatar_frame {
  2668. display:none;
  2669. }
  2670.  
  2671. .notescont .avatar_frame + .action {
  2672. margin-left:var(--Notes-Indicator-Gap-Right);
  2673. }
  2674.  
  2675. .notescont .action a {
  2676. font-family:var(--SmallCaps-Font-Family);
  2677. font-size:var(--SmallCaps-Font-Size);
  2678. text-transform:uppercase;
  2679. letter-spacing:.7px;
  2680. color:{color:reblogger};
  2681. }
  2682.  
  2683. .notescont blockquote {
  2684. margin-left:calc(var(--Notes-Indicator-Size) / 2);
  2685. padding-left:calc((var(--Notes-Indicator-Size) / 2) + var(--Notes-Indicator-Gap-Right));
  2686. }
  2687.  
  2688. .more_notes_link_container {
  2689. margin-top:1em!important;
  2690. margin-bottom:calc(var(--Paragraph-Margins) / 2);
  2691. }
  2692.  
  2693. .more_notes_link, .notes_loading {
  2694. font-family:var(--SmallCaps-Font-Family);
  2695. font-size:var(--SmallCaps-Font-Size);
  2696. text-transform:uppercase;
  2697. letter-spacing:.5px;
  2698. }
  2699.  
  2700. /*---- PAGINATION ----*/
  2701. .botpagi {
  2702. display:flex;
  2703. align-items:center;
  2704. justify-content:space-between;
  2705. width:var(--Post-Total-Width);
  2706. margin-top:var(--Post-Spacing);
  2707. margin-bottom:0!important;
  2708. font-family:var(--SmallCaps-Font-Family);
  2709. font-size:calc(var(--SmallCaps-Font-Size) - 1px);
  2710. text-transform:uppercase;
  2711. letter-spacing:.7px;
  2712. line-height:1em;
  2713. }
  2714.  
  2715. .botpagi a {
  2716. padding:0.69em;
  2717. margin:-0.69em;
  2718. color:var(--Pagination-Color)!important;
  2719. }
  2720.  
  2721. .botpagi span {
  2722. padding:0 4px;
  2723. }
  2724.  
  2725. .prev-svg {
  2726. margin-top:-.5px;
  2727. width:calc(var(--Body-Font-Size) + 3px);
  2728. height:calc(var(--Body-Font-Size) + 3px);
  2729. -webkit-mask-image:var(--BackSVG);
  2730. -webkit-mask-repeat:no-repeat;
  2731. -webkit-mask-size:contain;
  2732. background:var(--Pagination-Color)
  2733. }
  2734.  
  2735. .next-svg {
  2736. margin-top:-.5px;
  2737. width:calc(var(--Body-Font-Size) + 3px);
  2738. height:calc(var(--Body-Font-Size) + 3px);
  2739. -webkit-mask-image:var(--NextSVG);
  2740. -webkit-mask-repeat:no-repeat;
  2741. -webkit-mask-size:contain;
  2742. background:var(--Pagination-Color)
  2743. }
  2744.  
  2745. .pn {
  2746. margin-left:auto!important;
  2747. }
  2748.  
  2749. /*---- MUSIC PLAYER ----*/
  2750. #glenplayer07 {
  2751. position:fixed;
  2752. bottom:0;margin-bottom:30px;
  2753. left:0;margin-left:30px;
  2754. z-index:99;
  2755. }
  2756.  
  2757. .song-name {
  2758. font-family:var(--Song-Name-Font-Family);
  2759. font-size:var(--Song-Name-Font-Size);
  2760. text-transform:uppercase;
  2761. letter-spacing:.7px;
  2762. color:var(--Song-Name-Color);
  2763. }
  2764.  
  2765. .artist-name {
  2766. margin-top:3px;
  2767. font-family:var(--Artist-Name-Font-Family);
  2768. font-size:var(--Artist-Name-Font-Size);
  2769. letter-spacing:0.3px;
  2770. color:var(--Artist-Name-Color);
  2771. }
  2772.  
  2773.  
  2774.  
  2775. {CustomCSS}
  2776. </style>
  2777.  
  2778. </head>
  2779.  
  2780. <!--------------------------------------------------->
  2781.  
  2782. <body>
  2783.  
  2784. <div corner-cog>
  2785. <i class="ai-gear"></i>
  2786. </div>
  2787.  
  2788. <!---- MUSIC PLAYER ---->
  2789. {block:ifsongname}
  2790. <div id="glenplayer07">
  2791. <div class="flamingo">
  2792. <div class="circleofdeath">
  2793. <div class="tinfoil">
  2794. <div class="oliveoil"></div>
  2795. </div>
  2796.  
  2797. <div class="crust">
  2798. <div class="cherry">
  2799. <div class="music-controls">
  2800. <i class="ph-play-fill playy"></i>
  2801. <i class="ph-pause-fill pausee"></i>
  2802. </div>
  2803. </div><!--cherry-->
  2804. </div><!--crust-->
  2805. </div><!--circleofdeath-->
  2806.  
  2807. <div class="music-info">
  2808. <div class="song-name">{text:song name}</div>
  2809.  
  2810. {block:ifartistname}
  2811. <div class="artist-name">{text:artist name}</div>
  2812. {/block:ifartistname}
  2813. </div><!--music-info-->
  2814. </div><!--flamingo-->
  2815. </div><!--glenplayer07-->
  2816. {/block:ifsongname}
  2817.  
  2818. {block:ifsongfilemp3}
  2819. <audio id="audio" src="{text:song file mp3}" type="audio" {block:ifsongvolume}volume="{text:song volume}"{/block:ifsongvolume}></audio>
  2820. {/block:ifsongfilemp3}
  2821. <!----end music player---->
  2822.  
  2823.  
  2824. <!---- CONTAINER ---->
  2825. <div class="ubilu">
  2826. <div class="jfqqj">
  2827.  
  2828. <!---- LEFT SIDEBAR ---->
  2829. <div class="vhmqu">
  2830. <div class="abtpk">
  2831. <div class="uaizx">
  2832. <div class="envzk">
  2833. <!-- sidebar stuff, TOP PART -->
  2834. <div czmym>
  2835. <a jbwru href="//{Name}.tumblr.com">
  2836. {/block:ifsidebartitle}
  2837. <div avi-tit>{text:sidebar title}</div>
  2838. {/block:ifsidebartitle}
  2839.  
  2840. <div avi-username>{Name}</div>
  2841. </a>
  2842.  
  2843. <div sb-avi>
  2844. <img src="{image:sidebar icon}">
  2845. <img bvahz src="{image:sidebar icon}">
  2846. </div><!--jbwru-->
  2847. </div><!--czmym-->
  2848.  
  2849. <!-- sidebar stuff, DESCRIPTION -->
  2850. <div amche>
  2851. <div pfgil>
  2852. <div yconm>
  2853. <div ghjax>
  2854. <div desc>
  2855. {block:ifsidebardesc}
  2856. {text:sidebar desc}
  2857. {/block:ifsidebardesc}
  2858.  
  2859. {block:ifnotsidebardesc}
  2860. {block:Description}
  2861. {Description}
  2862. {/block:Description}
  2863. {/block:ifnotsidebardesc}
  2864. </div><!--end desc-->
  2865. </div>
  2866.  
  2867. <div ghjax barlinething></div>
  2868. </div><!--yconm-->
  2869. </div><!--pfgil-->
  2870. </div><!--amche-->
  2871.  
  2872. <!-- sidebar stuff, SEARCHBAR -->
  2873. <div searchbar-form sbf schb="{select:show searchbar}">
  2874. <form action="/search" method="get">
  2875. <input type="text" placeholder="{text:searchbar placeholder text}" name="q" value="{SearchQuery}"/>
  2876.  
  2877. <button type="submit" tib="{select:searchbar icon}">
  2878. <i class="ai-search"></i>
  2879. </button>
  2880. </form>
  2881. </div><!--end searchbar-->
  2882.  
  2883. <!-- sidebar stuff, NAVLINKS -->
  2884. <div dpaec>
  2885. <div boxlinks>
  2886. <!-- icons list: https://lucide.dev/-->
  2887. <a href="//{Name}.tumblr.com" title="home">
  2888. <i lucide icon-name="home"></i>
  2889. </a>
  2890.  
  2891. <a href="//{Name}.tumblr.com/ask" title="askbox">
  2892. <i lucide icon-name="mail"></i>
  2893. </a>
  2894.  
  2895. <a href="//{Name}.tumblr.com/archive" title="archive">
  2896. <i lucide icon-name="layout-grid"></i>
  2897. </a>
  2898.  
  2899. <!-- please do not remove the credit, thank you! <3 -->
  2900. <a href="//glenthemes.tumblr.com" title="&#x2740;&#8201;parfait&#8201;&#x2740; theme &#8202;&#8212;&#8202; @glenthemes">
  2901. <i class="glenbiz"></i>
  2902. </a>
  2903. </div><!--don't delete this line-->
  2904.  
  2905. <!-- 'plus' icon that activates the custom links -->
  2906. <div class="cl-tog">
  2907. <i lucide icon-name="plus"></i>
  2908. </div>
  2909. </div><!--end navlinks-->
  2910.  
  2911. </div><!--envzk-->
  2912.  
  2913. <!-- sidebar stuff, CUSTOM LINKS -->
  2914. <div krryo clpr="{select:customlinks per row}">
  2915. <div efrhc>
  2916. {block:ifcustomlink1name}
  2917. <a customlink href="{text:customlink 1 url}">
  2918. <span cl-inner>
  2919. <span dot></span>
  2920. <span text>{text:customlink 1 name}</span>
  2921. </span>
  2922. </a>
  2923. {/block:ifcustomlink1name}
  2924.  
  2925. {block:ifcustomlink2name}
  2926. <a customlink href="{text:customlink 2 url}">
  2927. <span cl-inner>
  2928. <span dot></span>
  2929. <span text>{text:customlink 2 name}</span>
  2930. </span>
  2931. </a>
  2932. {/block:ifcustomlink2name}
  2933.  
  2934. {block:ifcustomlink3name}
  2935. <a customlink href="{text:customlink 3 url}">
  2936. <span cl-inner>
  2937. <span dot></span>
  2938. <span text>{text:customlink 3 name}</span>
  2939. </span>
  2940. </a>
  2941. {/block:ifcustomlink3name}
  2942.  
  2943. {block:ifcustomlink4name}
  2944. <a customlink href="{text:customlink 4 url}">
  2945. <span cl-inner>
  2946. <span dot></span>
  2947. <span text>{text:customlink 4 name}</span>
  2948. </span>
  2949. </a>
  2950. {/block:ifcustomlink4name}
  2951.  
  2952. {block:ifcustomlink5name}
  2953. <a customlink href="{text:customlink 5 url}">
  2954. <span cl-inner>
  2955. <span dot></span>
  2956. <span text>{text:customlink 5 name}</span>
  2957. </span>
  2958. </a>
  2959. {/block:ifcustomlink5name}
  2960.  
  2961. {block:ifcustomlink6name}
  2962. <a customlink href="{text:customlink 6 url}">
  2963. <span cl-inner>
  2964. <span dot></span>
  2965. <span text>{text:customlink 6 name}</span>
  2966. </span>
  2967. </a>
  2968. {/block:ifcustomlink6name}
  2969.  
  2970. {block:ifcustomlink7name}
  2971. <a customlink href="{text:customlink 7 url}">
  2972. <span cl-inner>
  2973. <span dot></span>
  2974. <span text>{text:customlink 7 name}</span>
  2975. </span>
  2976. </a>
  2977. {/block:ifcustomlink7name}
  2978.  
  2979. {block:ifcustomlink8name}
  2980. <a customlink href="{text:customlink 8 url}">
  2981. <span cl-inner>
  2982. <span dot></span>
  2983. <span text>{text:customlink 8 name}</span>
  2984. </span>
  2985. </a>
  2986. {/block:ifcustomlink8name}
  2987. </div><!--efrhc-->
  2988. </div><!--krryo-->
  2989. </div><!--uaizx-->
  2990. </div><!--abtpk-->
  2991. </div><!--end left sidebar-->
  2992.  
  2993.  
  2994. <!---- HEADER ---->
  2995. <div class="xcjya">
  2996.  
  2997. <div class="header-sect" sh="{select:show header}" {block:ifheadertextcolumn1}has-col-1{/block:ifheadertextcolumn1} {block:ifheadertextcolumn2}has-col-2{/block:ifheadertextcolumn2}>
  2998. <div class="qmtwu">
  2999. <div header-img="{image:header image}">
  3000. <img src="{image:header image}">
  3001. </div>
  3002.  
  3003. {block:ifheadertextcolumn1}
  3004. <div header-texts>
  3005. <div class="mwfgi">
  3006. <div ht-col>{text:header text column 1}</div>
  3007.  
  3008. {block:ifheadertextcolumn2}
  3009. <div ht-col>{text:header text column 2}</div>
  3010. {/block:ifheadertextcolumn2}
  3011. </div>
  3012. </div>
  3013. {/block:ifheadertextcolumn1}
  3014. </div><!--qmtwu-->
  3015. </div><!--end header section-->
  3016.  
  3017.  
  3018. <!---- POSTS ---->
  3019. <div class="postscont" black-and-white="{select:grayscale images}">
  3020.  
  3021. {block:Posts inlineMediaWidth="1280" inlineNestedMediaWidth="1280"}
  3022. <div class="posts {PostType}-post" id="{PostID}" post-type="{PostType}" {block:NotReblog}original-post{/block:NotReblog} {block:RebloggedFrom}reblogged-post{/block:RebloggedFrom}>
  3023.  
  3024. <div class="postinner">
  3025.  
  3026. {block:RebloggedFrom}
  3027. <div class="reblog-head nosrc">
  3028. <span reblogger-icon="{ReblogRootPortraitURL-64}"></span>
  3029. <span class="reblog-url">
  3030. <a href="{ReblogRootURL}">{ReblogRootName}</a>
  3031. </span>
  3032. </div>
  3033. {/block:RebloggedFrom}
  3034.  
  3035. <!------ POST TITLE ------>
  3036. {block:Title}
  3037. <h1 class="post-title">{Title}</h1>
  3038. {/block:Title}
  3039.  
  3040. <!------ TEXT POSTS ------>
  3041. {block:Text}
  3042. {block:NotReblog}{Body}{/block:NotReblog}
  3043. {block:RebloggedFrom}
  3044. {block:Reblogs}
  3045. <div class="reblog-wrap">
  3046. <div class="reblog-head source-head">
  3047. <span reblogger-icon="{PortraitURL-64}"></span>
  3048. <span class="reblog-url">
  3049. <a href="{Permalink}">{Username}</a>
  3050. </span>
  3051. </div>
  3052. <div class="reblog-comment">{Body}</div>
  3053. </div>
  3054. {/block:Reblogs}
  3055. {/block:RebloggedFrom}
  3056. {/block:Text}
  3057.  
  3058. <!------ SINGLE PHOTO ------>
  3059. {block:Photo}
  3060. <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>
  3061. {/block:Photo}
  3062.  
  3063. <!------ PHOTOSETS ------>
  3064. {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}
  3065.  
  3066. <!------ QUOTE POSTS ------>
  3067. {block:Quote}
  3068. <div class="quote-ico">
  3069. <i lucide icon-name="quote"></i>
  3070. </div>
  3071. <div class="quote-words">{Quote}</div>
  3072. {block:Source}
  3073. <div class="quote-source">
  3074. <span mdash>&mdash;</span>
  3075. {Source}
  3076. </div>{/block:Source}
  3077. {/block:Quote}
  3078.  
  3079. <!------ LINK POSTS ------>
  3080. {block:Link}
  3081. <a class="linkpost-title" href="{URL}" {Target}>
  3082. <span link-icon>
  3083. <i class="mi-link-alt"></i>
  3084. </span>
  3085.  
  3086. <span link-display-text>&#8201;{Name} &#8202;»</span>
  3087. </a>
  3088.  
  3089. {block:Excerpt}
  3090. <div class="link-excerpt">
  3091. {Excerpt}
  3092. {block:Host}— <a class="le-host" href="{URL}" {Target}>{Host}</a>{/block:Host}
  3093. </div>
  3094. {/block:Excerpt}
  3095.  
  3096. {block:Description}
  3097. <div class="link-description">
  3098. {block:NotReblog}{Description}{/block:NotReblog}
  3099. {block:RebloggedFrom}
  3100. {block:Reblogs}
  3101. <div class="reblog-wrap">
  3102. <div class="reblog-head">
  3103. <span reblogger-icon="{PortraitURL-64}"></span>
  3104. <span class="reblog-url">
  3105. <a href="{Permalink}">{Username}</a>
  3106. </span>
  3107. </div>
  3108. <div class="reblog-comment">{Body}</div>
  3109. </div>
  3110. {/block:Reblogs}
  3111. {/block:RebloggedFrom}
  3112. </div>
  3113. {/block:Description}
  3114. {/block:Link}
  3115.  
  3116. <!------ CHAT POSTS ------>
  3117. {block:Chat}
  3118. {block:Lines}
  3119. <div class="chat_row">
  3120. {block:Label}
  3121. <div class="chat_label">{Label}</div>
  3122. {/block:Label}
  3123.  
  3124. <div class="chat_content">
  3125. {Line}
  3126. </div>
  3127. </div>
  3128. {/block:Lines}
  3129. {/block:Chat}
  3130.  
  3131. <!------ AUDIO POSTS ------>
  3132. {block:Audio}
  3133. <div class="audiowrap">
  3134. {block:AudioPlayer}
  3135. <div class="aud-emb">
  3136. {AudioPlayer}
  3137. </div>
  3138. {/block:AudioPlayer}
  3139.  
  3140. <div class="albumwrap" {block:AlbumArt}has-cover{/block:AlbumArt}>
  3141. {block:AlbumArt}
  3142. <img src="{AlbumArtURL}">
  3143. {/block:AlbumArt}
  3144.  
  3145. <div class="audplac"></div>
  3146.  
  3147. <div class="butts">
  3148. <div class="overplay"></div>
  3149. <div class="overpause"></div>
  3150. </div>
  3151. </div>
  3152.  
  3153. <div class="audiotxt">
  3154. <div class="odin">
  3155.  
  3156. <div class="aud-song-name" {block:TrackName}has-name{/block:TrackName}>
  3157. <div class="untit">Untitled track</div>
  3158.  
  3159. {block:TrackName}
  3160. <div class="hastit">{TrackName}</div>
  3161. {/block:TrackName}
  3162. </div>
  3163.  
  3164. {block:Album}
  3165. <div class="aud-album-name">{Album}</div>
  3166. {/block:Album}
  3167.  
  3168. <div class="aud-artist" {block:Artist}has-artist{/block:Artist}>
  3169. <div class="unart">Unknown artist</div>
  3170.  
  3171. {block:Artist}
  3172. <div class="hasart">{Artist}</div>
  3173. {/block:Artist}
  3174. </div>
  3175. </div><!--odin-->
  3176.  
  3177. <a class="inari" title="download" target="_blank">
  3178. <span class="int-all"></span>
  3179. </a>
  3180. </div><!--audiotxt-->
  3181. </div><!--audiowrap-->
  3182. {/block:Audio}
  3183.  
  3184. <!------ VIDEO POSTS ------>
  3185. {block:Video}
  3186. <div class="tmblr-video">{Video-500}</div>
  3187. {/block:Video}
  3188.  
  3189. <!------ ANSWER POSTS ------>
  3190. {block:Answer}
  3191. <!-- who asked? -->
  3192. <div class="reblog-wrap une_question">
  3193. <div class="asker-person">
  3194. <div class="askpot">
  3195. <span reblogger-icon="{AskerPortraitURL-64}"></span>
  3196. </div>
  3197. <span class="asker-name">{Asker} asked:</span>
  3198. </div>
  3199.  
  3200. <div class="question_text">{Question}</div>
  3201. </div>
  3202.  
  3203. <!--------------------------------------->
  3204.  
  3205. <!-- who answered? -->
  3206. {block:Answerer}
  3207. <div class="reblog-wrap une_reponse">
  3208. <div class="answerer reblog-head">
  3209. <span reblogger-icon="{AnswererPortraitURL-64}"></span>
  3210. <span class="reblog-url">{Answerer} answered:</span>
  3211. </div>
  3212. <p class="answer_text">{Answer}</p>
  3213. </div>
  3214.  
  3215. <!-- additional reblogs to the ask post -->
  3216. {block:Reblogs}
  3217. <div class="reblog-wrap reply_container">
  3218. <div class="replier reblog-head">
  3219. <span reblogger-icon="{PortraitURL-64}"></span>
  3220. <span class="reblog-url">
  3221. <a href="{Permalink}">{Username}</a>
  3222. </span>
  3223. </div>
  3224. <div class="reply">{Body}</div>
  3225. </div>
  3226. {/block:Reblogs}
  3227. {/block:Answerer}
  3228.  
  3229. <!--------------------------------------->
  3230.  
  3231. <!-- original answer post -->
  3232. {block:NotReblog}
  3233. <div class="reblog-wrap une-reponse">
  3234. <div class="answerer reblog-head">
  3235. <span reblogger-icon="{PortraitURL-64}"></span>
  3236. <span class="reblog-url">
  3237. <a href="{Permalink}">{Name}</a> answered:
  3238. </span>
  3239. </div>
  3240.  
  3241. <div class="answer_text">{Answer}</div>
  3242. </div><!--answer-container-->
  3243. {/block:NotReblog}
  3244. {/block:Answer}
  3245. <!------ END ANSWER ------>
  3246.  
  3247. <!------ 'CAPTION'? ------>
  3248. {block:Caption}
  3249. <div class="caption">
  3250. {block:NotReblog}{Caption}{/block:NotReblog}
  3251. {block:RebloggedFrom}
  3252. {block:Reblogs}
  3253. <div class="reblog-wrap">
  3254. <div class="reblog-head">
  3255. <span reblogger-icon="{PortraitURL-64}"></span>
  3256. <span class="reblog-url">
  3257. <a href="{Permalink}">{Username}</a>
  3258. </span>
  3259. </div><!--reblog-head-->
  3260. <div class="reblog-comment">{Body}</div>
  3261. </div><!--comment-container-->
  3262. {/block:Reblogs}
  3263. {/block:RebloggedFrom}
  3264. </div><!--caption-->
  3265. {/block:Caption}
  3266.  
  3267.  
  3268. <!------ TAGS ------>
  3269. {block:HasTags}
  3270. <div class="tagsdiv" clicktags="{select:click tags}">
  3271. <div class="tagsin">
  3272. {block:Tags}
  3273. <a href="{TagURL}">{Tag}</a>
  3274. {/block:Tags}
  3275. </div>
  3276. </div>
  3277. {/block:HasTags}
  3278.  
  3279. <!------ PERMALINK ------>
  3280. {block:Date}
  3281. <div class="permadiv" topdiff="{select:permalink top gap}">
  3282. <div class="permaleft">
  3283. <a {block:IndexPage}href="{Permalink}"{/block:IndexPage}>
  3284. <i class="ai-{select:permalink icon}"></i>
  3285. {block:PermalinkPage}{ShortDayOfWeek}, {/block:PermalinkPage}{ShortMonth} {DayOfMonthWithZero}{block:PermalinkPage} {Year}{block:PermalinkPage}
  3286. &emsp;&thinsp;{TimeAgo}
  3287. {block:IndexPage}
  3288. &ensp;•&ensp;
  3289. {NoteCountWithLabel}
  3290. {block:PinnedPostLabel}&emsp;&thinsp;Pinned Post{/block:PinnedPostLabel}
  3291. {/block:IndexPage}
  3292. </a>
  3293. </div>
  3294.  
  3295. <!------------------------------>
  3296. {block:IndexPage}
  3297. <div class="permaright" clicktags="{select:click tags}">
  3298. {block:HasTags}
  3299. <a class="clicktags">
  3300. <i class="ph-hash-bold"></i>
  3301. </a>
  3302. {/block:HasTags}
  3303.  
  3304.  
  3305. <a href="{ReblogURL}" title="reblog this post">
  3306. <i class="mi-repeat"></i>
  3307. </a>
  3308.  
  3309. <a title="like this post">
  3310. {LikeButton}
  3311. <i class="ai-heart"></i>
  3312. </a>
  3313. </div>
  3314. {/block:IndexPage}
  3315. <!------------------------------>
  3316.  
  3317. {block:PermalinkPage}
  3318. <div class="permaright">
  3319. {block:NotReblog}
  3320. <span>original post</span>
  3321. {/block:NotReblog}
  3322.  
  3323. {block:RebloggedFrom}
  3324. <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>
  3325. <a dash>/</a>
  3326. <a href="{ReblogRootURL}" title="{ReblogRootName}">source</a>
  3327. {/block:RebloggedFrom}
  3328. </div>
  3329. {/block:PermalinkPage}
  3330.  
  3331. </div><!--permadiv-->
  3332. {/block:Date}
  3333. </div><!--postinner-->
  3334. </div><!--posts-->
  3335.  
  3336. {block:PostNotes}
  3337. <div class="notescont">
  3338. <h1>{NoteCountWithLabel}</h1>
  3339. {PostNotes}
  3340. </div>
  3341. {/block:PostNotes}
  3342.  
  3343. {/block:Posts}
  3344.  
  3345. <!------ PAGINATION ------>
  3346. {block:Pagination}
  3347. <div class="botpagi">
  3348. {block:PreviousPage}
  3349. <a class="flex" href="{PreviousPage}">
  3350. <div class="prev-svg"></div>
  3351. <span>previous page</span>
  3352. </a>
  3353. {/block:PreviousPage}
  3354.  
  3355. {block:NextPage}
  3356. <a class="flex pn" href="{NextPage}">
  3357. <span>next page</span>
  3358. <div class="next-svg"></div>
  3359. </a>
  3360. {/block:NextPage}
  3361. </div>
  3362. {/block:Pagination}
  3363. </div><!--postscont-->
  3364. </div><!--xcjya-->
  3365.  
  3366. </div><!--jfqqj-->
  3367. </div><!--ubilu-->
  3368.  
  3369. <script src="//static.tumblr.com/0podkko/jfMplm3f8/modified_photosets.js"></script>
  3370.  
  3371. <script>
  3372. lucide.createIcons();
  3373. </script>
  3374.  
  3375. </body>
  3376. </html>
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!