API tools faq
paste
glenthemes

Theme [08]: Kami no Himegoto

glenthemes
Aug 30th, 2015 (edited)
36,445
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 73.04 KB | None | 0 0
raw download clone embed print report
  1. <!----------------------------------------------------
  2. Theme [08]: Kami no Himegoto
  3. Made by glenthemes
  4.  
  5. Initial release: 2016/11/02
  6. Remake date: 2021/07/25
  7. Last updated: 2025/06/10
  8.  
  9. What's new:
  10. ✱ minor fixes for npf quotes and chats
  11.  
  12. TERMS OF USE:
  13. 1) Do not remove the theme credit.
  14. 2) Do not repost/redistribute my themes.
  15. 3) Do not take parts of the code and use it as your own.
  16. 4) Do not use my themes as a base code.
  17. 5) Do not mix my works together.
  18.  
  19. CREDITS:
  20. ✧( ु•⌄• )◞ ~ glencredits.tumblr.com/kami-no-himegoto
  21. ----------------------------------------------------->
  22. <!DOCTYPE html>
  23. <html lang="en">
  24.  
  25. <head>
  26.  
  27. <title>{Title}</title>
  28.  
  29. <link rel="shortcut icon" href="{Favicon}">
  30. <!---------------------------->
  31.  
  32. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  33.  
  34. <!------ THEME SCRIPTS ------->
  35. <script src="//static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  36.  
  37. <link href="//static.tumblr.com/0podkko/oDSpg7y88/photosets.css" rel="stylesheet">
  38.  
  39. <script src="//glen-themes.gitlab.io/thms/08/fkn-audio.js"></script>
  40.  
  41. <!--
  42. NPF images fix v3.0 by @glenthemes [2021]
  43. 💌 git.io/JRBt7
  44. --->
  45. <script src="//npf-images-v3.github.io/script.js"></script>
  46. <link rel="stylesheet" href="//npf-images-v3.github.io/recon.css">
  47. <style tmblr-npf>
  48. :root {
  49. --NPF-Caption-Spacing:var(--NPF-Bottom-Gap-From-Captions);
  50. --NPF-Image-Spacing:{select:photoset spacing};
  51. }
  52.  
  53. a.post_media_photo_anchor, a.post_media_photo_anchor:hover {
  54. padding-bottom:0!important;
  55. border-bottom:none!important;
  56. }
  57.  
  58. .spotify_audio_player {
  59. height:80px!important;
  60. }
  61. </style>
  62.  
  63. <script src="//static.tumblr.com/gtjt4bo/sgMrymui0/waitforelement.js"></script>
  64. <script src="//glen-themes.gitlab.io/thms/08/yabonku-2025.js"></script>
  65. <script src="//glen-themes.gitlab.io/thms/08/bonks.js"></script>
  66.  
  67. <!-- unblue polls -->
  68. <!-- glenthemes.tumblr.com/post/708014819571302400 -->
  69. <link href="//static.tumblr.com/gtjt4bo/mXBrpdj0n/unblue-polls.css" rel="stylesheet">
  70. <style unblue-polls>
  71. .poll-post {
  72. --Poll-Question-Font-Size: var(--Body-Font-Size);
  73.  
  74. --Poll-Option-Background-Color: {color:post};
  75. --Poll-Option-Corner-Rounding: 5px;
  76. --Poll-Option-Border-Size: 1px;
  77. --Poll-Option-Border-Color: rgba({RGBcolor:post borders inner},0.420);
  78. --Poll-Option-Padding: 8px;
  79. --Poll-Option-Font-Size: var(--Body-Font-Size);
  80. --Poll-Option-Spacing: 10px;
  81. --Poll-Option-Text-Color: {color:text};
  82.  
  83. --Poll-Option-HOVER-Border-Color: rgba({RGBcolor:post borders inner},0.420);
  84. --Poll-Option-HOVER-Background-Color: {color:post};
  85. --Poll-Option-HOVER-Text-Color: {color:link};
  86. --Poll-Option-HOVER-Speed: 0.4s;
  87. }
  88.  
  89. .poll-see-results {
  90. padding-bottom:0!important;
  91. border-bottom:none!important;
  92. font-size:calc(var(--Poll-Option-Font-Size) - 1.5px)!important;
  93. text-transform:uppercase;
  94. letter-spacing:1px;
  95. }
  96. </style>
  97.  
  98. <!-- npf audio player -->
  99. <!-- glenthemes.tumblr.com/post/722160746171072512 -->
  100. <script src="//tmblr-npf-audio.gitlab.io/s/init.js"></script>
  101. <link href="//tmblr-npf-audio.gitlab.io/s/base.css" rel="stylesheet">
  102. <script>
  103. tumblr_npf_audio({
  104. emptyTitleText: "Untitled track",
  105. emptyArtistText: "Untitled artist",
  106. emptyAlbumText: "Untitled album",
  107.  
  108. titleLabel: "",
  109. artistLabel: "",
  110. albumLabel: ""
  111. });
  112. </script>
  113. <style edit-npf-audio-player>
  114. .npf-audio-wrapper {
  115. --NPF-Audio-Buttons-Size: calc(var(--Audio-Post-PlayButton-Size) * 0.6);
  116. --NPF-Audio-Buttons-Color: var(--Audio-Post-Buttons-Color);
  117. --NPF-Audio-Buttons-Padding: calc(var(--Audio-Post-PlayButton-Padding) + (var(--Audio-Post-PlayButton-Size) * 0.2));
  118. --NPF-Audio-Buttons-Spacing: calc(var(--p) + 12px);
  119. --NPF-Audio-Image-Size: var(--Audio-Post-Album-Image-Size);
  120. --NPF-Audio-Image-Spacing: 0px;
  121.  
  122. --t:calc((var(--NPF-Audio-Buttons-Padding) * 2) + var(--NPF-Audio-Buttons-Size));
  123. --p:calc(var(--NPF-Audio-Buttons-Padding) + ((var(--NPF-Audio-Image-Size) - var(--t)) / 2));
  124. }
  125.  
  126. .npf-audio-wrapper {
  127. position:relative;
  128. background:{color:post background 2};
  129. z-index:0;
  130. }
  131.  
  132. .npf-audio-background {
  133. margin-left:var(--p);
  134. }
  135.  
  136. .npf-audio-play, .npf-audio-pause {
  137. position:relative;
  138. z-index:0;
  139. }
  140.  
  141. .npf-audio-play:after, .npf-audio-pause:after {
  142. content:"";
  143. position:absolute;
  144. top:0;left:0;
  145. margin-top:calc(0px - var(--NPF-Audio-Buttons-Padding) - 1px);
  146. margin-left:calc(0px - var(--NPF-Audio-Buttons-Padding) - 1px);
  147. width:calc(100% + (var(--NPF-Audio-Buttons-Padding) * 2));
  148. height:calc(100% + (var(--NPF-Audio-Buttons-Padding) * 2));
  149. background:var(--Audio-Post-Buttons-BG);
  150. border:1px solid var(--Audio-Post-Buttons-Border);
  151. border-radius:100%;
  152. z-index:-1;
  153. }
  154.  
  155. .npf-audio-play svg { margin-left:1px; }
  156. .npf-audio-pause svg { margin-left:0; }
  157.  
  158. figcaption.audio-caption,
  159. figcaption.audio-caption ~ audio[controls],
  160. .npf-audio-album {
  161. display:none;
  162. }
  163.  
  164. .npf-audio-image {
  165. position:absolute;
  166. top:0;left:0;
  167. z-index:-1;
  168. }
  169.  
  170. .npf-audio-details {
  171. color:{color:special text};
  172. }
  173.  
  174. .npf-audio-details > * + * {
  175. margin-top:-2.5px;
  176. }
  177. </style>
  178.  
  179. <script src="//glen-npf.gitlab.io/other/neue.js"></script>
  180. <link href="//glen-npf.gitlab.io/other/neue.css" rel="stylesheet">
  181.  
  182. <!------ FONTS ------->
  183. <link href="//fonts.googleapis.com/css?family=Karla|Roboto+Mono|Inter|Rubik|Amiri|Libre+Franklin|Open+Sans|Manrope:500,800|Sora:500|Lexend+Deca|Public+Sans" rel="stylesheet">
  184.  
  185. <link rel="stylesheet" href="//static.tumblr.com/2pnwama/IUZoyg6qw/specialfonts.css">
  186.  
  187. <!------ ICON FONTS ------->
  188. <link href="//fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
  189.  
  190. <link rel="stylesheet" href="https://glen-assets.github.io/flaticon-uicons/uicons-regular-rounded.css">
  191.  
  192. <!------------ THEME OPTIONS ------------>
  193. <meta name="image:sidebar 1 image" content="//64.media.tumblr.com/af017a6498e25a7686e2153173e14c8e/643d70a11ec20887-78/s2048x3072/b6296ad23bbd9c2154e455ac7fcff5c91a1d66f5.png">
  194. <meta name="image:sidebar 2 icon" content="//static.tumblr.com/2pnwama/iZLs1prtp/5314f2fe_64_cropped.png">
  195.  
  196. <meta name="image:background image" content="//64.media.tumblr.com/17af9b9ce38cc88e7772c475503b98e8/27eb800628c09243-c8/s2048x3072/0874890e14c53d15155c76c336909977980622d7.png">
  197.  
  198. <meta name="color:music player note" content="#222">
  199. <meta name="color:music player buttons" content="#222">
  200. <meta name="color:music player text" content="#777">
  201. <meta name="color:music player bg" content="#fafafa">
  202.  
  203. <meta name="color:sidebar 1 background" content="#fcfcfc">
  204. <meta name="color:sidebar 1 title" content="#a8938a">
  205. <meta name="color:sidebar 1 title special" content="#f19973">
  206. <meta name="color:sidebar 1 border" content="#f2f2f2">
  207. <meta name="color:sidebar 1 desc" content="#6e6660">
  208.  
  209. <meta name="color:sidebar 2 background" content="#fcfcfc">
  210. <meta name="color:sidebar 2 icon border" content="#f0f0f0">
  211. <meta name="color:sidebar 2 title" content="#6e6660">
  212. <meta name="color:sidebar 2 title special" content="#759cac">
  213. <meta name="color:sidebar 2 title underline" content="#d5e9f2">
  214. <meta name="color:sidebar 2 toplinks icon" content="#646464">
  215. <meta name="color:sidebar 2 toplinks icon bg" content="#e2eef5">
  216. <meta name="color:sidebar 2 toplinks text" content="#6e6660">
  217. <meta name="color:sidebar 2 toplinks text bg" content="#f7f7f7">
  218.  
  219. <meta name="color:sidebar 2 desc bg" content="#f9f9f9">
  220. <meta name="color:sidebar 2 desc text" content="#888">
  221.  
  222. <meta name="color:customlinks bg" content="#f5f5f5">
  223. <meta name="color:customlinks text" content="#666">
  224.  
  225. <meta name="color:background" content="#fafafa">
  226.  
  227. <meta name="color:post background" content="#fff">
  228. <meta name="color:post background 2" content="#fafafa">
  229. <meta name="color:post borders inner" content="#d5d5d5">
  230. <meta name="color:post borders outer" content="#eee">
  231. <meta name="color:text" content="#333">
  232. <meta name="color:headings" content="#111">
  233. <meta name="color:bold" content="#000">
  234. <meta name="color:link" content="#000">
  235. <meta name="color:reblogger" content="#222">
  236. <meta name="color:tags" content="#666">
  237.  
  238. <meta name="color:permalink text" content="#888">
  239. <meta name="color:permalink" content="#222">
  240. <meta name="color:permalink background" content="#fcfcfc">
  241. <meta name="color:permalink border" content="#eee">
  242.  
  243. <meta name="color:post buttons" content="#222">
  244. <meta name="color:like button liked" content="#ff7746">
  245. <meta name="color:scrollbar" content="#777">
  246. <meta name="color:scrollbar bg" content="#f7f7f7">
  247. <meta name="color:pagination" content="#222">
  248.  
  249. <meta name="color:highlight" content="#e2eef5">
  250. <meta name="color:highlighted text" content="#252525">
  251.  
  252. <!--------- GENERAL OPTIONS --------->
  253. <meta name="select:&#x2727;&#x28;&#x20;&#x941;&#x2022;&#x2304;&#x2022;&#x20;&#x29;&#x25DE;&#x2002;&#x2501;&#x2002;&#x1D406;&#x1D404;&#x1D40D;&#x1D404;&#x1D411;&#x1D400;&#x1D40B;&#x20;&#x2CE;&#x2CA;&#x2D7;" title="" content="">
  254.  
  255. <meta name="select:tumblr controls color" title="black" content="black">
  256. <meta name="select:tumblr controls color" title="white" content="white">
  257.  
  258. <meta name="select:window margin" title="45px" content="45px">
  259. <meta name="select:window margin" title="30px" content="30px">
  260. <meta name="select:window margin" title="35px" content="35px">
  261. <meta name="select:window margin" title="40px" content="40px">
  262. <meta name="select:window margin" title="50px" content="50px">
  263. <meta name="select:window margin" title="55px" content="55px">
  264.  
  265. <meta name="select:body font" title="Manrope" content="Manrope">
  266. <meta name="select:body font" title="Inter" content="Inter">
  267. <meta name="select:body font" title="Karla" content="Karla">
  268. <meta name="select:body font" title="Libre Franklin" content="Libre Franklin">
  269. <meta name="select:body font" title="Open Sans" content="Open Sans">
  270.  
  271. <!--------- SIDEBAR 1 OPTIONS --------->
  272. <meta name="select:&#x2727;&#x28;&#x20;&#x941;&#x2022;&#x2304;&#x2022;&#x20;&#x29;&#x25DE;&#x2002;&#x2501;&#x2002;&#x1D412;&#x1D408;&#x1D403;&#x1D404;&#x1D401;&#x1D400;&#x1D411;&#x20;&#x1D7CF;&#x20;&#x2CE;&#x2CA;&#x2D7;" title="" content="">
  273.  
  274. <meta name="select:sidebar 1 width" title="370px" content="370px">
  275. <meta name="select:sidebar 1 width" title="310px" content="310px">
  276. <meta name="select:sidebar 1 width" title="330px" content="330px">
  277. <meta name="select:sidebar 1 width" title="350px" content="350px">
  278. <meta name="select:sidebar 1 width" title="390px" content="390px">
  279. <meta name="select:sidebar 1 width" title="410px" content="410px">
  280.  
  281. <meta name="select:sidebar 1 title size" title="12px" content="12px">
  282. <meta name="select:sidebar 1 title size" title="9px" content="9px">
  283. <meta name="select:sidebar 1 title size" title="10px" content="10px">
  284. <meta name="select:sidebar 1 title size" title="11px" content="11px">
  285. <meta name="select:sidebar 1 title size" title="13px" content="13px">
  286. <meta name="select:sidebar 1 title size" title="14px" content="14px">
  287. <meta name="select:sidebar 1 title size" title="15px" content="15px">
  288.  
  289. <meta name="select:sidebar 1 desc size" title="12px" content="12px">
  290. <meta name="select:sidebar 1 desc size" title="9px" content="9px">
  291. <meta name="select:sidebar 1 desc size" title="10px" content="10px">
  292. <meta name="select:sidebar 1 desc size" title="11px" content="11px">
  293. <meta name="select:sidebar 1 desc size" title="13px" content="13px">
  294. <meta name="select:sidebar 1 desc size" title="14px" content="14px">
  295.  
  296. <meta name="select:sidebar 1 desc visibility" title="hover" content="hover">
  297. <meta name="select:sidebar 1 desc visibility" title="always show" content="always-show">
  298.  
  299. <meta name="select:sidebar 1 desc text align" title="center" content="center">
  300. <meta name="select:sidebar 1 desc text align" title="justify" content="justify">
  301. <meta name="select:sidebar 1 desc text align" title="left" content="left">
  302. <meta name="select:sidebar 1 desc text align" title="right" content="right">
  303.  
  304. <!--------- SIDEBAR 2 OPTIONS --------->
  305. <meta name="select:&#x2727;&#x28;&#x20;&#x941;&#x2022;&#x2304;&#x2022;&#x20;&#x29;&#x25DE;&#x2002;&#x2501;&#x2002;&#x1D412;&#x1D408;&#x1D403;&#x1D404;&#x1D401;&#x1D400;&#x1D411;&#x20;&#x1D7D0;&#x20;&#x2CE;&#x2CA;&#x2D7;" title="" content="">
  306.  
  307. <meta name="select:sidebar 2 icon size" title="40px" content="40px">
  308. <meta name="select:sidebar 2 icon size" title="30px" content="30px">
  309. <meta name="select:sidebar 2 icon size" title="35px" content="35px">
  310. <meta name="select:sidebar 2 icon size" title="45px" content="45px">
  311. <meta name="select:sidebar 2 icon size" title="50px" content="50px">
  312.  
  313. <meta name="select:sidebar 2 title size" title="11px" content="11px">
  314. <meta name="select:sidebar 2 title size" title="9px" content="9px">
  315. <meta name="select:sidebar 2 title size" title="10px" content="10px">
  316. <meta name="select:sidebar 2 title size" title="12px" content="12px">
  317. <meta name="select:sidebar 2 title size" title="13px" content="13px">
  318.  
  319. <meta name="select:sidebar 2 desc size" title="11px" content="11px">
  320. <meta name="select:sidebar 2 desc size" title="9px" content="9px">
  321. <meta name="select:sidebar 2 desc size" title="10px" content="10px">
  322. <meta name="select:sidebar 2 desc size" title="12px" content="12px">
  323. <meta name="select:sidebar 2 desc size" title="13px" content="13px">
  324.  
  325. <meta name="select:sidebar 2 desc text align" title="center" content="center">
  326. <meta name="select:sidebar 2 desc text align" title="justify" content="justify">
  327. <meta name="select:sidebar 2 desc text align" title="left" content="left">
  328. <meta name="select:sidebar 2 desc text align" title="right" content="right">
  329.  
  330. <meta name="select:customlinks text size" title="10px" content="8px">
  331. <meta name="select:customlinks text size" title="9px" content="7px">
  332. <meta name="select:customlinks text size" title="11px" content="9px">
  333. <meta name="select:customlinks text size" title="12px" content="10px">
  334. <meta name="select:customlinks text size" title="13px" content="11px">
  335.  
  336. <!--------- MAIN POSTS OPTIONS --------->
  337. <meta name="select:&#x2727;&#x28;&#x20;&#x941;&#x2022;&#x2304;&#x2022;&#x20;&#x29;&#x25DE;&#x2002;&#x2501;&#x2002;&#x1D40F;&#x1D40E;&#x1D412;&#x1D413;&#x1D412;&#x20;&#x2CE;&#x2CA;&#x2D7;" title="" content="">
  338.  
  339. <meta name="select:post width" title="fill remaining space" content="fill">
  340. <meta name="select:post width" title="400px" content="400px">
  341. <meta name="select:post width" title="450px" content="450px">
  342. <meta name="select:post width" title="500px" content="500px">
  343. <meta name="select:post width" title="540px" content="540px">
  344.  
  345. <meta name="select:post padding" title="15px" content="15px">
  346. <meta name="select:post padding" title="10px" content="10px">
  347. <meta name="select:post padding" title="20px" content="20px">
  348. <meta name="select:post padding" title="25px" content="25px">
  349. <meta name="select:post padding" title="30px" content="30px">
  350.  
  351. <meta name="select:post font size" title="12px" content="12px">
  352. <meta name="select:post font size" title="11px" content="11px">
  353. <meta name="select:post font size" title="13px" content="13px">
  354. <meta name="select:post font size" title="14px" content="14px">
  355.  
  356. <meta name="select:post text line height" title="1.7em" content="1.7em">
  357. <meta name="select:post text line height" title="1.5em" content="1.5em">
  358. <meta name="select:post text line height" title="1.9em" content="1.9em">
  359.  
  360. <meta name="select:photoset spacing" title="4px" content="4px">
  361. <meta name="select:photoset spacing" title="6px" content="6px">
  362. <meta name="select:photoset spacing" title="10px" content="10px">
  363.  
  364. <!-- reblogger styling -->
  365.  
  366. <meta name="select:reblogger picture style" title="round" content="100%">
  367. <meta name="select:reblogger picture style" title="soft" content="3px">
  368. <meta name="select:reblogger picture style" title="square" content="0px">
  369.  
  370. <meta name="select:reblog separators" title="yes full width" content="rb-yes rb-full">
  371. <meta name="select:reblog separators" title="yes normal" content="rb-yes rb-thin">
  372. <meta name="select:reblog separators" title="none" content="rb-none">
  373.  
  374. <!-- black-and-white options -->
  375. <meta name="select:grayscale photos" title="only grayscale reblogger icon" content="grayico">
  376. <meta name="select:grayscale photos" title="no (normal)" content="no">
  377. <meta name="select:grayscale photos" title="yes" content="yes">
  378.  
  379. <meta name="select:post buttons size" title="12px" content="12px">
  380. <meta name="select:post buttons size" title="10px" content="10px">
  381. <meta name="select:post buttons size" title="14px" content="14px">
  382. <meta name="select:post buttons size" title="16px" content="16px">
  383.  
  384. <meta name="select:post buttons spacing" title="6px" content="6px">
  385. <meta name="select:post buttons spacing" title="4px" content="4px">
  386. <meta name="select:post buttons spacing" title="8px" content="8px">
  387. <meta name="select:post buttons spacing" title="10px" content="10px">
  388.  
  389. <!-- clicktags or normal tags -->
  390. <meta name="select:show tags on click" title="click toggle + fade" content="yesclick withfade">
  391. <meta name="select:show tags on click" title="click toggle" content="yesclick">
  392. <meta name="select:show tags on click" title="always show" content="default">
  393.  
  394. <meta name="select:permalink top gap" title="6px" content="6px">
  395. <meta name="select:permalink top gap" title="4px" content="4px">
  396. <meta name="select:permalink top gap" title="8px" content="8px">
  397. <meta name="select:permalink top gap" title="10px" content="10px">
  398.  
  399. <meta name="select:permalink padding" title="12px" content="12px">
  400. <meta name="select:permalink padding" title="18px" content="18px">
  401. <meta name="select:permalink padding" title="14px" content="14px">
  402. <meta name="select:permalink padding" title="16px" content="16px">
  403. <meta name="select:permalink padding" title="20px" content="20px">
  404. <meta name="select:permalink padding" title="22px" content="22px">
  405.  
  406. <meta name="select:permalink icon" title="eye" content="eye">
  407. <meta name="select:permalink icon" title="star" content="star">
  408. <meta name="select:permalink icon" title="heart" content="heart">
  409. <meta name="select:permalink icon" title="arrow 1" content="angle-small-right">
  410. <meta name="select:permalink icon" title="arrow 2" content="caret-right">
  411. <meta name="select:permalink icon" title="x" content="cross-small">
  412. <meta name="select:permalink icon" title="crown" content="crown">
  413. <meta name="select:permalink icon" title="diamond" content="diamond">
  414. <meta name="select:permalink icon" title="link" content="link">
  415. <meta name="select:permalink icon" title="—" content="minus">
  416.  
  417. <meta name="select:post spacing" title="35px" content="35px">
  418. <meta name="select:post spacing" title="30px" content="30px">
  419. <meta name="select:post spacing" title="40px" content="40px">
  420. <meta name="select:post spacing" title="45px" content="45px">
  421. <meta name="select:post spacing" title="50px" content="50px">
  422.  
  423. <!--------- TEXT FIELDS --------->
  424. <meta name="text:how to link music" content="linktr.ee/direct_file_links">
  425. <meta name="text:music player song name" content="岩崎 琢 – Glorious">
  426. <meta name="text:music player song mp3" content="https://rhizo.gitlab.io/m/Glorious.mp3">
  427.  
  428. <meta name="text:sidebar 1 title" content="kami no himegoto">
  429. <meta name="text:sidebar 1 desc" content="A &lt;b&gt;god&apos;s greatest secret&lt;/b&gt; (&lt;i&gt;&quot;Kami no Himegoto&quot;&lt;/i&gt;) is a &lt;b&gt;shinki&apos;s real name&lt;/b&gt; from when they were &lt;b&gt;human&lt;/b&gt;. When a god names a shinki, the name bestowed by the god &lt;i&gt;seals the memories&lt;/i&gt; of the shinki&apos;s human life, including their real name. The god sees these memories upon naming the shinki and must keep them a secret.">
  430. <meta name="text:sidebar 2 title" content="神の秘め事">
  431.  
  432. <meta name="text:customlink 1 name" content="link one">
  433. <meta name="text:customlink 1 url" content="//www.youtube.com/watch?v=qfxDEZX9K0o">
  434. <meta name="text:customlink 2 name" content="">
  435. <meta name="text:customlink 2 url" content="">
  436. <meta name="text:customlink 3 name" content="">
  437. <meta name="text:customlink 3 url" content="">
  438. <meta name="text:customlink 4 name" content="">
  439. <meta name="text:customlink 4 url" content="">
  440. <meta name="text:customlink 5 name" content="">
  441. <meta name="text:customlink 5 url" content="">
  442. <meta name="text:customlink 6 name" content="">
  443. <meta name="text:customlink 6 url" content="">
  444.  
  445. <!----------------------------------->
  446.  
  447. <style type="text/css">
  448.  
  449. @font-face { font-family: "hundred ligatture"; src: url('//glen-assets.github.io/fonts/Hundred-Ligatture.otf'); }
  450.  
  451. @font-face { font-family: "851 tegaki zatsu hand"; src: url('//glen-assets.github.io/fonts/851_Tegaki_Zatsu_Hand.woff'); }
  452.  
  453. @font-face { font-family: "brutal medium"; src: url('//glen-assets.github.io/fonts/Brutal-Medium.ttf'); }
  454.  
  455. /*------------ TOOLTIPS ------------*/
  456. #s-m-t-tooltip {
  457. margin:16px;
  458. max-width:{select:post width};
  459. padding:8px 10px;
  460. background:{color:permalink background};
  461. border:1px solid {color:permalink border};
  462. border-radius:3px;
  463. font-family:rubik;
  464. font-size:calc({select:post font size} - 3.5px)!important;
  465. letter-spacing:1px;
  466. word-spacing:1px;
  467. text-transform:uppercase;
  468. color:{color:permalink};
  469. z-index:99;
  470. }
  471.  
  472. /*------------ TUMBLR CONTROLS ------------*/
  473. iframe#tumblr_controls, .iframe-controls--desktop {
  474. top:5px!important;
  475. right:5px!important;
  476. position:fixed!important;
  477.  
  478. transform:scale(0.7,0.7);
  479. -webkit-transform:scale(0.7,0.7);
  480.  
  481. transform-origin:100% 0;
  482. z-index:999999!important;
  483. visibility:hidden;
  484. opacity:0;
  485. user-select:none;
  486. }
  487.  
  488. .tc-black {
  489. filter:invert(100%) hue-rotate(180deg)!important;
  490. -webkit-filter:invert(100%) hue-rotate(180deg)!important;
  491. }
  492.  
  493. .t-opac {
  494. opacity:1!important;
  495. transition:opacity 0.269s ease-in-out;
  496. }
  497.  
  498. /*---------------SCROLLBAR---------------*/
  499. ::-webkit-scrollbar {
  500. width:var(--Scrollbar-Padding);
  501. height:var(--Scrollbar-Padding);
  502. background-color:{color:scrollbar bg};
  503. }
  504.  
  505. ::-webkit-scrollbar-thumb {
  506. background-color:{color:scrollbar};
  507. border:calc((var(--Scrollbar-Padding) - 1px) / 2) solid transparent;
  508. border-top:calc(var(--Scrollbar-Padding) / 2.69) solid transparent;
  509. border-bottom:calc(var(--Scrollbar-Padding) / 2.69) solid transparent;
  510. background-clip:padding-box;
  511. }
  512.  
  513. ::-webkit-scrollbar-corner {
  514. background:transparent;
  515. }
  516.  
  517. ::selection {
  518. background:{color:highlight};
  519. color:{color:highlighted text};
  520. }
  521.  
  522. ::-moz-selection {
  523. background:{color:highlight};
  524. color:{color:highlighted text};
  525. }
  526.  
  527. /*------------ BASICS ------------*/
  528. body {
  529. margin:0;
  530. background-color:{color:background};
  531. background-image:url({image:background image});
  532. background-repeat:repeat;
  533. background-attachment:fixed;
  534. font-family:{select:body font}, 'system-ui';
  535. color:{color:text};
  536. overflow-x:hidden;
  537. overscroll-behavior-y:none;
  538. }
  539.  
  540. img, iframe {
  541. vertical-align:middle;
  542. image-rendering:-webkit-optimize-contrast;
  543. }
  544.  
  545. figure {
  546. margin-left:0;
  547. margin-right:0;
  548. }
  549.  
  550. a, a:visited {
  551. color:{color:link};
  552. text-decoration:none;
  553. }
  554.  
  555. a[title]:not([href]):hover {cursor:help;}
  556.  
  557. h1, h2, h3, h4, h5, h6 {
  558. margin:var(--Heading-Margins) 0;
  559. font-family:Amiri;
  560. font-size:calc({select:post font size} + 4px);
  561. text-transform:uppercase;
  562. font-weight:normal;
  563. letter-spacing:.7px;
  564. }
  565.  
  566. h1.title, .linkpath, a.read_more {
  567. display:block;
  568. margin-top:2px;
  569. padding:0.69em 0.8em;
  570. background:{color:post background 2};
  571. border:1px solid rgba({RGBcolor:post borders inner},0.420);
  572. border-radius:3px;
  573. font-family:Amiri;
  574. font-size:calc({select:post font size} + 2px)!important;
  575. font-weight:normal;
  576. text-transform:uppercase;
  577. letter-spacing:.7px!important;
  578. color:{color:headings}!important;
  579. text-align:center;
  580. line-height:calc({select:post text line height} * 0.8);
  581. }
  582.  
  583. h1.h1c, a.read_more {
  584. display:block;
  585. padding:0!important;
  586. background:transparent!important;
  587. border:none!important;
  588. margin:calc(var(--Heading-Margins) * 1.5) 0;
  589. }
  590.  
  591. h1, h2, h3, h4, h5, h6, a.read_more {
  592. font-size:calc({select:post font size} + 1.5px);
  593. line-height:{select:post text line height};
  594. }
  595.  
  596. a.read_more {
  597. padding-bottom:0;
  598. border:none;
  599. font-size:calc({select:post font size} + 1px);
  600. }
  601.  
  602. p {
  603. margin:var(--Paragraph-Margins) 0;
  604. }
  605.  
  606. ul, ol {
  607. margin:var(--Paragraph-Margins) 0;
  608. margin-left:1.69em;
  609. padding:0;
  610. }
  611.  
  612. ol li {
  613. padding-left:0.420em;
  614. }
  615.  
  616. ul li {
  617. position:relative;
  618. padding-left:0.25em;
  619. margin-left:calc(({select:post font size} * 1.420) - 3px);
  620. list-style:none;
  621. }
  622.  
  623. ul li:before {
  624. content:"";
  625. position:absolute;
  626. margin-top:calc((({select:post font size} * var(--LH)) / 2) - 0px);
  627. transform:translateY(-50%);
  628. left:0;margin-left:calc(({select:post font size} * -1.420) - 3px);
  629. width:{select:post font size};
  630. height:.7px;
  631. background:rgba({RGBcolor:text},0.420);
  632. }
  633.  
  634. pre {
  635. display:block;
  636. white-space:break-spaces;
  637. padding:var(--Captions-Gap);
  638. background:{color:post background 2};
  639. border:1px solid rgba({RGBcolor:post borders inner},0.420);
  640. border-radius:3px;
  641. margin:1em 0;
  642. }
  643.  
  644. pre, code {
  645. font-family:roboto mono;
  646. font-size:calc({select:post font size} - 1.5px);
  647. letter-spacing:0px;
  648. }
  649.  
  650. p code {
  651. margin:0 1px;
  652. padding:5px;
  653. padding-bottom:4px;
  654. background:{color:post background 2};
  655. border:1px solid {color:post borders inner};
  656. border-radius:3px;
  657. }
  658.  
  659. hr {
  660. display:block;
  661. margin:1em auto;
  662. width:69%;
  663. border-width:0px;
  664. height:1px;
  665. background:rgba({RGBcolor:post borders inner}, 0.69);
  666. }
  667.  
  668. p.npf_quirky {
  669. font-size:calc({select:post font size} * 1.4)!important;
  670. line-height:calc({select:post text line height} * 0.7)!important;
  671. }
  672.  
  673. p.npf_quote, p.npf_chat {
  674. font-size:inherit!important;
  675. line-height:inherit!important;
  676. }
  677.  
  678. .npf_color_joey {color:#f8747b!important} /* red */
  679. .npf_color_monica {color:#fe9e89!important} /* orange */
  680. .npf_color_phoebe {color:#facc48!important} /* yellow */
  681. .npf_color_ross {color:#75ca9b!important} /* green */
  682. .npf_color_rachel {color:#8dbfd9!important} /* blue */
  683. .npf_color_chandler {color:#c0a0dc!important} /* purple */
  684. .npf_color_niles {color:#fb94b4!important} /* pink */
  685.  
  686. .npf_row_set img {cursor:default!important}
  687.  
  688. .tmblr-full img {
  689. height:100%!important;
  690. object-fit:cover;
  691. }
  692.  
  693. .post_media_photo_anchor {
  694. height:100%;
  695. }
  696.  
  697. .post_media_photo {
  698. height:inherit!important;
  699. object-fit:cover;
  700. }
  701.  
  702. .flex, [flex] {
  703. display:flex;
  704. align-items:center;
  705. }
  706.  
  707. .flex.space-between {
  708. justify-content:space-between;
  709. }
  710.  
  711. .block {display:block}
  712.  
  713. .allcaps {
  714. letter-spacing:1px;
  715. font-size:90%;
  716. }
  717.  
  718. [invis]{display:none;}
  719.  
  720. :root {
  721. /*---- MUSIC PLAYER ----*/
  722. --MusicPlayer-Edge-Offset:12px;
  723. --MusicPlayer-Icon-Size:12px;
  724. --MusicPlayer-Icon-Color:{color:music player note};
  725. --MusicPlayer-Circle-Background:{color:music player bg};
  726. --MusicPlayer-Circle-Padding:9px;
  727.  
  728. --MusicPlayer-Bar-Length:18px;
  729. --MusicPlayer-Bar-Color:{color:music player bg};
  730.  
  731. --MusicPlayer-Buttons-Size:9px;
  732. --MusicPlayer-Buttons-Color:{color:music player buttons};
  733.  
  734. --MusicPlayer-Text-Size:10px;
  735. --MusicPlayer-Text-Color:{color:music player text};
  736.  
  737. --MusicPlayer-Main-Background:{color:music player bg};
  738. --MusicPlayer-Main-Padding:8px;
  739. --MusicPlayer-Main-Roundness:3px;
  740.  
  741. /*---- SIDEBAR 1 ----*/
  742. --Sidebar-1-Title-Padding:16px;
  743.  
  744. --Sidebar-1-Description-Padding:18px;
  745.  
  746. --Sidebar-1-Desc-Show-Speed:0.5s;
  747. --Sidebar-1-Desc-Hide-Speed:1s;
  748.  
  749. /*---- SIDEBAR 2 ----*/
  750. --Sidebar-2-Width:220px;
  751. --Sidebar-2-Padding:17px;
  752. --Sidebar-2-Icon-Padding:5px;
  753.  
  754. --Sidebar-2-Icon-Gap:10px;
  755.  
  756. --Sidebar-2-TopLinks-Spacing:6.5px;
  757. --Sidebar-2-TopLinks-Icon-Size:9.5px;
  758. --Sidebar-2-TopLinks-Icon-Padding:5px;
  759.  
  760. --Sidebar-2-TopLinks-Text-Size:8px;
  761. --Sidebar-2-TopLinks-Text-Padding:5px;
  762. --Sidebar-2-TopLinks-Text-MinWidth:32px;
  763.  
  764. --Sidebar-2-TopLinks-Roundness:3px;
  765.  
  766. --Sidebar-2-Desc-Padding:12px;
  767.  
  768. --CustomLinks-Per-Row:2;
  769. --CustomLinks-Padding:4px;
  770. --CustomLinks-Spacing:5px;
  771.  
  772. --Sidebar-2-Sections-Spacing:10px;
  773.  
  774. /*---- GENERAL STUFF ----*/
  775. --TumblrControls-Color:{select:tumblr controls color};
  776. --Scrollbar-Padding:17px;
  777.  
  778. /*---- POST SETTINGS ----*/
  779. --Photos-Spacing:{select:photoset spacing};
  780.  
  781. --Posts-Avatar-Size:25px;
  782. --Captions-Gap:0.420em;
  783.  
  784. --Link:{color:link};
  785. --Blockquote-Border-Color:{color:post borders inner};
  786.  
  787. --Paragraph-Margins:0.69em;
  788. --Heading-Margins:0.5em;
  789.  
  790. --NPF-Image-Spacing:{select:photoset spacing};
  791. --NPF-Bottom-Gap-From-Captions:0.420em;
  792.  
  793. --Grayscale-Settings:grayscale(100%) contrast(110%) brightness(104%);
  794. --Grayscale-Hover-Speed:0.420s;
  795.  
  796. --Audio-Post-Album-Image-Size:64px;
  797. --Audio-Post-PlayButton-Size:18px;
  798. --Audio-Post-Buttons-Color:{color:headings};
  799. --Audio-Post-PlayButton-Padding:8px;
  800. --Audio-Post-Buttons-BG:{color:post background 2};
  801. --Audio-Post-Buttons-Border:rgba({RGBcolor:post borders inner},0.420);
  802. --Audio-Post-Download-Color:{color:link};
  803.  
  804. --AskPost-Avatar-Size:48px;
  805.  
  806. --Text-LineHeight:{select:post text line height};
  807.  
  808. --Permalink-Background:{color:permalink background};
  809.  
  810. --Post-Buttons-Color:{color:post buttons};
  811. }
  812.  
  813. /*------------ SIDEBAR 1 ------------*/
  814. .leftside {
  815. position:fixed;
  816. top:0;left:0;
  817. width:{select:sidebar 1 width};
  818. height:100vh;
  819. background-color:{color:sidebar 1 background};
  820. z-index:69;
  821. }
  822.  
  823. .clutch {
  824. position:relative;
  825. width:100%;
  826. height:100%;
  827. }
  828.  
  829. .mplayer {
  830. position:absolute;
  831. top:0;margin-top:var(--MusicPlayer-Edge-Offset);
  832. left:0;margin-left:var(--MusicPlayer-Edge-Offset);
  833. display:flex;
  834. align-items:center;
  835. z-index:10;
  836. filter:drop-shadow(2px 2px 1px rgba(0,0,0,0.07))
  837. }
  838.  
  839. .zirc {
  840. position:relative;
  841. margin-right:-1px;
  842. padding:var(--MusicPlayer-Circle-Padding);
  843. background:var(--MusicPlayer-Circle-Background);
  844. border-radius:100%;
  845. overflow:hidden;
  846. z-index:2;
  847. }
  848.  
  849. /* hover stuff */
  850. .potatowrap {
  851. opacity:0;
  852. transition:opacity .420s ease-in-out;
  853. transition-delay:0s;
  854. }
  855.  
  856. .mplayer:hover .mline {
  857. width:var(--MusicPlayer-Bar-Length);
  858. transition-delay:0s; /* delay when mouseleave */
  859. }
  860.  
  861. .mplayer:hover .potatowrap {
  862. opacity:1;
  863. transition-delay:.420s;
  864. }
  865.  
  866. .msym, .blay, .bause {
  867. -webkit-mask-size:contain;
  868. -webkit-mask-position:center;
  869. -webkit-mask-repeat:no-repeat;
  870. }
  871.  
  872. .msym {
  873. width:var(--MusicPlayer-Icon-Size);
  874. height:var(--MusicPlayer-Icon-Size);
  875. -webkit-mask-image:var(--nota);
  876. background:var(--MusicPlayer-Icon-Color);
  877. }
  878.  
  879. .mline {
  880. margin-right:-3px;
  881. width:0px;
  882. height:3px;
  883. background:var(--MusicPlayer-Bar-Color);
  884. border-radius:6px;
  885. transition:width .420s ease-in-out;
  886. transition-delay:.420s; /* delay when mouseenter */
  887. }
  888.  
  889. .potatowrap {
  890. display:flex;
  891. align-items:center;
  892. padding:calc(var(--MusicPlayer-Main-Padding) - 2px) var(--MusicPlayer-Main-Padding);
  893. background:var(--MusicPlayer-Main-Background);
  894. border-radius:var(--MusicPlayer-Main-Roundness);
  895. }
  896.  
  897. .music-controls {
  898. margin:-6px;
  899. padding:6px;
  900. cursor:pointer;
  901. }
  902.  
  903. .blay {
  904. width:var(--MusicPlayer-Buttons-Size);
  905. height:var(--MusicPlayer-Buttons-Size);
  906. background:var(--MusicPlayer-Buttons-Color);
  907. -webkit-mask-image:var(--blay);
  908. }
  909.  
  910. .bause {
  911. width:var(--MusicPlayer-Buttons-Size);
  912. height:var(--MusicPlayer-Buttons-Size);
  913. background:var(--MusicPlayer-Buttons-Color);
  914. -webkit-mask-image:var(--bause);
  915. }
  916.  
  917. .songtext {
  918. margin-left:6px;
  919. font-size:var(--MusicPlayer-Text-Size);
  920. color:var(--MusicPlayer-Text-Color);
  921. }
  922.  
  923. .pausee {display:none;}
  924.  
  925. .beff {display:none;}
  926. .aff {display:block;}
  927.  
  928. .sbimg {
  929. position:absolute;
  930. top:0;left:0;
  931. width:100%;
  932. height:100%;
  933. background-size:cover;
  934. background-position:50% 0%;
  935. background-repeat:no-repeat;
  936. background-image:url({image:sidebar 1 image});
  937. }
  938.  
  939. .turnip {
  940. position:absolute;
  941. bottom:0;left:0;
  942. width:100%;
  943. transition:margin-bottom var(--Sidebar-1-Desc-Hide-Speed) ease-in-out;
  944. }
  945.  
  946. .sbt {
  947.  
  948. }
  949.  
  950. .sidebar-title {
  951. padding:var(--Sidebar-1-Title-Padding);
  952. background:rgba({RGBcolor:sidebar 1 background},1);
  953. font-family:hundred ligatture;
  954. font-size:{select:sidebar 1 title size};
  955. text-transform:uppercase;
  956. letter-spacing:1.3px;
  957. color:{color:sidebar 1 title};
  958. text-align:center;
  959. transition:letter-spacing .69s ease-in-out;
  960. }
  961.  
  962. .leftside:hover .sidebar-title:not(.beer) {
  963. letter-spacing:1.7px;
  964. }
  965.  
  966. .sidebar-title::first-letter {
  967. color:{color:sidebar 1 title special};
  968. }
  969.  
  970. .beer {
  971. transition:none;
  972. }
  973.  
  974. .sbd {
  975. position:absolute;
  976. visibility:hidden;
  977. }
  978.  
  979. .repose {
  980. position:initial;
  981. visibility:initial;
  982. }
  983.  
  984. .sidebar-desc {
  985. padding:calc(var(--Sidebar-1-Description-Padding) - 4px) var(--Sidebar-1-Description-Padding);
  986. border-top:1px solid {color:sidebar 1 border};
  987. background:rgba({RGBcolor:sidebar 1 background},0.969);
  988. backdrop-filter:blur(3px);
  989. font-size:{select:sidebar 1 desc size};
  990. color:{color:sidebar 1 desc};
  991. text-align:{select:sidebar 1 desc text align};
  992. line-height:150%;
  993. }
  994.  
  995. .leftside:hover .turnip {
  996. margin-bottom:0px!important;
  997. transition:margin-bottom var(--Sidebar-1-Desc-Show-Speed) ease-in-out;
  998. }
  999.  
  1000. .sbd[font='Manrope'] .sidebar-desc {
  1001. line-height:165%;
  1002. }
  1003.  
  1004. .sbd[font='Manrope'] b {
  1005. font-weight:800;
  1006. letter-spacing:0px;
  1007. }
  1008.  
  1009. /*------------ SIDEBAR 2 ------------*/
  1010. .sidebeer {
  1011. position:fixed;
  1012. top:0;
  1013. left:0;margin-left:{select:sidebar 1 width};
  1014. width:calc(var(--Sidebar-2-Width) + (var(--Sidebar-2-Padding) * 2));
  1015. height:100vh;
  1016. background:{color:sidebar 2 background};
  1017. z-index:2;
  1018. }
  1019.  
  1020. .tortilla {
  1021. position:relative;
  1022. width:100%;
  1023. height:100%;
  1024. display:table;
  1025. }
  1026.  
  1027. .pesto {
  1028. position:absolute;
  1029. bottom:0;margin-bottom:15px;
  1030. left:0;
  1031. margin-left:var(--Sidebar-2-Padding);
  1032. width:var(--Sidebar-2-Width);
  1033. font-family:public sans;
  1034. font-size:calc(var(--Sidebar-2-TopLinks-Text-Size) - 1px);
  1035. text-transform:uppercase;
  1036. letter-spacing:.7px;
  1037. text-align:center;
  1038. }
  1039.  
  1040. .pesto a {
  1041. margin:auto;
  1042. padding:5px;
  1043. color:rgba({RGBcolor:sidebar 2 title},0.8);
  1044. }
  1045.  
  1046. .cas {
  1047. display:table-cell;
  1048. vertical-align:middle;
  1049. }
  1050.  
  1051. .taro {
  1052. margin-left:var(--Sidebar-2-Padding);
  1053. width:var(--Sidebar-2-Width);
  1054. }
  1055.  
  1056. .avhead {
  1057. display:flex;
  1058. align-items:center;
  1059. }
  1060.  
  1061. .avi-icon {
  1062. width:{select:sidebar 2 icon size};
  1063. height:{select:sidebar 2 icon size};
  1064. padding:var(--Sidebar-2-Icon-Padding);
  1065. border-radius:100%;
  1066. border:1px solid {color:sidebar 2 icon border};
  1067. }
  1068.  
  1069. .avi-title {
  1070. position:relative;
  1071. margin-left:var(--Sidebar-2-Icon-Gap);
  1072. font-family:lexend deca;
  1073. text-transform:uppercase;
  1074. font-size:{select:sidebar 2 title size};
  1075. letter-spacing:.5px;
  1076. word-spacing:-.3px;
  1077. color:{color:sidebar 2 title};
  1078. line-height:calc({select:sidebar 2 title size} * 1.5);
  1079. opacity:0;
  1080. }
  1081.  
  1082. .avi-title::first-letter {
  1083. color:{color:sidebar 2 title special};
  1084. }
  1085.  
  1086. .undyne {
  1087. position:absolute;
  1088. bottom:0;
  1089. left:0;
  1090. width:100%;
  1091. height:100%;
  1092. -webkit-mask-image:var(--paintSmear);
  1093. -webkit-mask-size:contain;
  1094. -webkit-mask-repeat:no-repeat;
  1095. -webkit-mask-position:0% 0%;
  1096. background:{color:sidebar 2 title underline};
  1097. z-index:-1;
  1098. }
  1099.  
  1100. .jpn {
  1101. padding-bottom:3px;
  1102. font-family:"851 tegaki zatsu hand";
  1103. font-size:calc({select:sidebar 2 title size} * 1.5);
  1104. letter-spacing:1px;
  1105. word-spacing:0px;
  1106. }
  1107.  
  1108. .charge {
  1109. position:absolute;
  1110. margin-top:calc({select:sidebar 2 title size} / -2);
  1111. margin-left:var(--Sidebar-2-Icon-Gap);
  1112. font-family:inter;
  1113. font-size:calc({select:sidebar 2 title size} + 3px);
  1114. letter-spacing:1px;
  1115. color:{color:sidebar 2 title};
  1116. animation:fdgod .269s;
  1117. }
  1118.  
  1119. @-webkit-keyframes fdgod {
  1120. from { opacity: 0; }
  1121. to { opacity: 1; }
  1122. }
  1123.  
  1124. .headlinks {
  1125. display:flex;
  1126. align-items:center;
  1127. flex-wrap:nowrap;
  1128. margin-top:calc(var(--Sidebar-2-Sections-Spacing) + 3px);
  1129. line-height:0;
  1130. }
  1131.  
  1132. .headlinks a {
  1133. display:table;
  1134. margin-right:var(--Sidebar-2-TopLinks-Spacing);
  1135. border-radius:var(--Sidebar-2-TopLinks-Roundness);
  1136. transition:filter .269s ease-in-out;
  1137. overflow:hidden;
  1138. }
  1139.  
  1140. .headlinks a:hover {
  1141. filter:brightness(95%) contrast(102%) saturate(120%);
  1142. }
  1143.  
  1144. .headlinks a:last-child {
  1145. margin-right:0;
  1146. }
  1147.  
  1148. .headlinks i {
  1149. display:block;
  1150. font-size:var(--Sidebar-2-TopLinks-Icon-Size);
  1151. padding:var(--Sidebar-2-TopLinks-Icon-Padding);
  1152. background:{color:sidebar 2 toplinks icon bg};
  1153. color:{color:sidebar 2 toplinks icon};
  1154. }
  1155.  
  1156. .headlinks [text]{
  1157. display:table-cell;
  1158. vertical-align:middle;
  1159. border-top:.5px solid transparent;
  1160. padding-left:var(--Sidebar-2-TopLinks-Text-Padding);
  1161. padding-right:calc(var(--Sidebar-2-TopLinks-Text-Padding) + 2px);
  1162. height:100%;
  1163. background:{color:sidebar 2 toplinks text bg};
  1164. font-family:public sans;
  1165. font-size:var(--Sidebar-2-TopLinks-Text-Size);
  1166. text-transform:uppercase;
  1167. letter-spacing:.5px;
  1168. color:{color:sidebar 2 toplinks text};
  1169. line-height:var(--Sidebar-2-TopLinks-Text-Size);
  1170. min-width:var(--Sidebar-2-TopLinks-Text-MinWidth);
  1171. }
  1172.  
  1173. .descbox {
  1174. margin-top:var(--Sidebar-2-Sections-Spacing);
  1175. padding:calc(var(--Sidebar-2-Desc-Padding) - 1.5px) var(--Sidebar-2-Desc-Padding);
  1176. background:{color:sidebar 2 desc bg};
  1177. font-size:{select:sidebar 2 desc size}!important;
  1178. color:{color:sidebar 2 desc text};
  1179. text-align:{select:sidebar 2 desc text align}!important;
  1180. line-height:150%;
  1181. }
  1182.  
  1183. .descbox[font='Manrope']{
  1184. line-height:160%!important;
  1185. }
  1186.  
  1187. .descbox[font='Manrope'] b {
  1188. font-weight:800;
  1189. letter-spacing:0px;
  1190. }
  1191.  
  1192. .ciels {
  1193. margin-top:var(--Sidebar-2-Sections-Spacing);
  1194. display:flex;
  1195. flex-wrap:wrap;
  1196. margin-left:calc(0px - (var(--CustomLinks-Spacing) / 2));
  1197. width:calc(100% + var(--CustomLinks-Spacing));
  1198. }
  1199.  
  1200. .ciels a {
  1201. display:block;
  1202. margin:calc(var(--CustomLinks-Spacing) / 2);
  1203. width:calc((100% - (var(--CustomLinks-Spacing) * var(--CustomLinks-Per-Row))) / var(--CustomLinks-Per-Row));
  1204. padding:var(--CustomLinks-Padding);
  1205. background:{color:customlinks bg};
  1206. font-family:public sans;
  1207. font-size:{select:customlinks text size};
  1208. text-transform:uppercase;
  1209. letter-spacing:.5px;
  1210. color:{color:customlinks text};
  1211. line-height:155%;
  1212. text-align:center;
  1213. box-sizing:border-box;
  1214. transition:filter .269s ease-in-out;
  1215. }
  1216.  
  1217. .ciels a:hover {
  1218. filter:brightness(95%) contrast(102%) saturate(120%);
  1219. }
  1220.  
  1221. /*------------ MAIN POSTS ------------*/
  1222. .maincont {
  1223. margin-left:calc({select:sidebar 1 width} + var(--Sidebar-2-Width) + (var(--Sidebar-2-Padding) * 2) + {select:window margin});
  1224. width:calc({select:post width} + ({select:post padding} * 2) + 2px);
  1225. max-height:100vh;
  1226. }
  1227.  
  1228. .postscont {
  1229. position:absolute;
  1230. margin:{select:window margin} 0;
  1231. min-width:calc({select:post width} + ({select:post padding} * 2) + 2px); /* fallback for if no posts are found */
  1232. font-size:{select:post font size};
  1233. color:{color:text};
  1234. line-height:{select:post text line height};
  1235. }
  1236.  
  1237. [font='Libre Franklin'], [font='Manrope']{
  1238. letter-spacing:0.3px;
  1239. }
  1240.  
  1241. [font='Manrope'] {
  1242. font-size:calc({select:post font size} - .5px);
  1243. line-height:calc({select:post text line height} * 1.069);
  1244. }
  1245.  
  1246. .posts {
  1247. position:relative;
  1248. margin-bottom:{select:post spacing};
  1249. width:{select:post width};
  1250. overflow:hidden;
  1251. }
  1252.  
  1253. .posts[post-width="fill"]{
  1254. width:500px;
  1255. }
  1256.  
  1257. .suce {
  1258. height:initial!important;
  1259. }
  1260.  
  1261. .pho {
  1262. padding:{select:post padding};
  1263. background:{color:post background};
  1264. border:1px solid {color:post borders outer};
  1265. }
  1266.  
  1267. .body[original] > *:first-child {
  1268. margin-top:0px!important;
  1269. }
  1270.  
  1271. .posts blockquote {
  1272. margin:calc(var(--Posts-Avatar-Size) / 2);
  1273. padding-left:calc(var(--Posts-Avatar-Size) / 2);
  1274. border-left:1px solid var(--Blockquote-Border-Color);
  1275. margin-right:0;
  1276. }
  1277.  
  1278. .posts img {
  1279. max-width:100%;
  1280. }
  1281.  
  1282. [grayscale="yes"] .posts img:not(.nofilter) {
  1283. filter:var(--Grayscale-Settings);
  1284. -webkit-filter:var(--Grayscale-Settings);
  1285. transition:filter var(--Grayscale-Hover-Speed) ease-in-out;
  1286. }
  1287.  
  1288. [grayscale="yes"] .posts:hover img:not(.nofilter) {
  1289. filter:initial;
  1290. -webkit-filter:initial;
  1291. }
  1292.  
  1293. .postinner {
  1294. }
  1295.  
  1296. /* hyperlinks in post */
  1297. .comment a, .body[original] a, .caption[original] a, .link-description[original] a {
  1298. padding-bottom:2px;
  1299. border-bottom:.7px solid rgba({RGBcolor:post borders inner},0.8);
  1300. }
  1301.  
  1302. .comment b, .comment strong, .body b, .body strong {
  1303. color:{color:bold};
  1304. }
  1305.  
  1306. /*----- PINNED POST -----*/
  1307. .pi-n {
  1308. display:flex;
  1309. align-items:center;
  1310. margin-top:calc(var(--Paragraph-Margins) * 2);
  1311. margin-bottom:-2px;
  1312. }
  1313.  
  1314. .pi-n span {
  1315. display:block;
  1316. }
  1317.  
  1318. .pinny {
  1319. margin-right:6px;
  1320. width:calc({select:post font size} + 3px);
  1321. height:calc({select:post font size} + 3px);
  1322. -webkit-mask-image:var(--pushpin);
  1323. -webkit-mask-repeat:no-repeat;
  1324. -webkit-mask-size:contain;
  1325. background:{color:reblogger};
  1326. }
  1327.  
  1328. .pinny ~ span {
  1329. margin-top:.5px;
  1330. font-family:rubik;
  1331. text-transform:uppercase;
  1332. font-size:calc({select:post font size} - 2px);
  1333. letter-spacing:.7px;
  1334. color:{color:reblogger};
  1335. }
  1336.  
  1337. /*------------ REBLOG STYLING ------------*/
  1338. .caption {
  1339. margin-top:var(--NPF-Bottom-Gap-From-Captions);
  1340. }
  1341.  
  1342. [reblog-borders*='rb-yes'] .has-npf .npf_inst ~ .comment_container[nxtpad] {
  1343. padding-top:0;
  1344. }
  1345.  
  1346. [reblog-borders*='rb-thin'] .comment_container {
  1347. padding:calc(var(--Captions-Gap) / 2.5) 0;
  1348. border-bottom:1px solid {color:post borders inner};
  1349. }
  1350.  
  1351. [reblog-borders*='rb-full'] .comment_container {
  1352. margin:0 -{select:post padding};
  1353. padding:calc(var(--Captions-Gap) / 2.5) {select:post padding};
  1354. border-bottom:1px solid rgba({RGBcolor:post borders inner},0.420);
  1355. }
  1356.  
  1357. [reblog-borders='rb-none'] .comment_container {
  1358. /*padding:calc(var(--Captions-Gap) / 2.5) 0;*/
  1359. }
  1360.  
  1361. .comment_container:first-of-type, .ccfirst {
  1362. padding-top:0px;
  1363. border-top:0px solid transparent;
  1364. }
  1365.  
  1366. .body .ccfirst {
  1367. margin-top:calc(var(--Captions-Gap) / -2);
  1368. }
  1369.  
  1370. .comment_container:last-of-type, .cclast {
  1371. padding-bottom:0px;
  1372. border-bottom:0px solid transparent;
  1373. }
  1374.  
  1375. .comment_container + .comment_container .commenter {
  1376. margin-top:2px;
  1377. }
  1378.  
  1379. .commenter {
  1380. padding-top:0.69em;
  1381. margin-bottom:0.69em;
  1382. display:flex;
  1383. align-items:center;
  1384. }
  1385.  
  1386. .commenter img {
  1387. width:var(--Posts-Avatar-Size);
  1388. height:var(--Posts-Avatar-Size);
  1389. border-radius:{select:reblogger picture style};
  1390. }
  1391.  
  1392. [grayscale='grayico'] .commenter img {
  1393. filter:var(--Grayscale-Settings);
  1394. -webkit-filter:var(--Grayscale-Settings);
  1395. }
  1396.  
  1397. .commenter a {
  1398. padding-left:8px;
  1399. }
  1400.  
  1401. .commenter a, .tumblr_blog, .tmblr-attribution a {
  1402. font-family:brutal medium;
  1403. font-size:calc({select:post font size} - 2.5px);
  1404. text-transform:uppercase;
  1405. letter-spacing:.7px;
  1406. color:{color:reblogger};
  1407. }
  1408.  
  1409. .tmblr-attribution a {
  1410. color:{color:link};
  1411. }
  1412.  
  1413. .nosrc {
  1414. display:none;
  1415. margin-top:0;
  1416. padding-top:0;
  1417. }
  1418.  
  1419. /*----- QUOTE POSTS -----*/
  1420. .nosrc + .pq {
  1421. margin-top:0.9em;
  1422. }
  1423.  
  1424. .pq {
  1425. margin:1.2em 0;
  1426. text-align:center;
  1427. }
  1428.  
  1429. .pq:last-child { margin-bottom:0 }
  1430.  
  1431. .quote-words {
  1432. padding:0 1em;
  1433. font-family:Amiri;
  1434. font-size:calc({select:post font size} + 2.5px);
  1435. text-transform:uppercase;
  1436. letter-spacing:.7px;
  1437. line-height:{select:post text line height};
  1438. }
  1439.  
  1440. .quote-source {
  1441. padding-top:1em;
  1442. }
  1443.  
  1444. /*----- ASK POSTS -----*/
  1445. .as {
  1446. padding-bottom:0!important;
  1447. border-bottom:0!important;
  1448. }
  1449.  
  1450. .askcont {
  1451. display:flex;
  1452. margin-bottom:calc(var(--Captions-Gap) / 2.5);
  1453. padding:var(--Captions-Gap);
  1454. background:{color:post background 2};
  1455. }
  1456.  
  1457. [reblog-borders*='rb-yes'] .askcont {
  1458. /*margin:calc(var(--Captions-Gap) / 2) 0;*/
  1459. }
  1460.  
  1461. [reblog-borders*='rb-none'] .anscont {
  1462. padding-top:0;
  1463. }
  1464.  
  1465. .asker {
  1466. margin:0!important;
  1467. margin-top:-2px!important;
  1468. padding-top:0!important;
  1469. font-family:rubik!important;
  1470. text-transform:uppercase;
  1471. font-size:calc({select:post font size} - 1.5px)!important;
  1472. letter-spacing:.7px!important;
  1473. transform:none!important;
  1474. }
  1475.  
  1476. .one-liner {
  1477. margin-top:0px!important;
  1478. padding-top:2px!important;
  1479. }
  1480.  
  1481. .asker b {
  1482. font-weight:normal;
  1483. margin-left:1px;
  1484. }
  1485.  
  1486. .askimg {
  1487. margin-right:calc(({select:post padding} * 0.69) + 2px);
  1488. width:var(--AskPost-Avatar-Size);
  1489. height:var(--AskPost-Avatar-Size);
  1490. border-radius:{select:reblogger picture style};
  1491. }
  1492.  
  1493. .asker i {
  1494. font-size:calc({select:post font size} * 1.5);
  1495. }
  1496.  
  1497. .asker span {
  1498. margin-top:0;
  1499. padding-left:0;
  1500. color:{color:headings};
  1501. }
  1502.  
  1503. .asker span a {
  1504. padding-left:0!important;
  1505. }
  1506.  
  1507. [reblog-borders*='rb-yes'] .anscont {
  1508. margin-top:calc(var(--Captions-Gap) / -2);
  1509. }
  1510.  
  1511. .answerer b {
  1512. font-weight:normal;
  1513. margin-left:4px;
  1514. }
  1515.  
  1516. .question_text {
  1517. margin:0;
  1518. }
  1519.  
  1520. .question_text p:first-child {margin-top:0}
  1521. .question_text p:last-child {margin-bottom:0}
  1522. .question_text p:only-child {margin:0}
  1523.  
  1524. /*----- PHOTO POSTS -----*/
  1525. .photopic {
  1526. width:100%;
  1527. cursor:pointer;
  1528. }
  1529.  
  1530. /*----- PHOTOSETS -----*/
  1531. [photoset-layout] {
  1532. grid-gap:{select:photoset spacing};
  1533. }
  1534.  
  1535. [photoset-layout] div {
  1536. cursor:pointer;
  1537. backface-visibility:hidden;
  1538. }
  1539.  
  1540. /*------- LIGHTBOX BS -------*/
  1541. .vignette, #vignette {
  1542. opacity:0;
  1543. }
  1544.  
  1545. .tmblr-lightbox, #tumblr_lightbox {
  1546. background:rgba({RGBcolor:post background},0.69)!important;
  1547. box-shadow:none!important;
  1548. backdrop-filter:blur(3px) brightness(69%) contrast(131%);
  1549. }
  1550.  
  1551. .lightbox-image, #tumblr_lightbox_left_image, #tumblr_lightbox_center_image, #tumblr_lightbox_right_image {
  1552. margin-top:calc(-{select:post padding} - 1px)!important;
  1553. padding:{select:post padding}!important;
  1554. background:{color:post background}!important;
  1555. border:1px solid {color:post borders outer}!important;
  1556. box-shadow:none!important;
  1557. border-radius:0px!important;
  1558. }
  1559.  
  1560. /*----- CHAT POSTS -----*/
  1561. .chatwrap {
  1562. width:100%;
  1563. border:1px solid rgba({RGBcolor:post borders inner},0.420);
  1564. box-sizing:border-box;
  1565. }
  1566.  
  1567. .chat_row {
  1568. position:relative;
  1569. padding:0.69em 0.8em;
  1570. overflow:hidden;
  1571. }
  1572.  
  1573. .chat_row:after {
  1574. content:"";
  1575. position:absolute;
  1576. bottom:0;left:0;
  1577. transform:translateY(-.5px);
  1578. width:100%;
  1579. height:1px;
  1580. background:rgba({RGBcolor:post borders inner},0.420);
  1581. }
  1582.  
  1583. .chatwrap .chat_row:last-child:after {
  1584. display:none;
  1585. }
  1586.  
  1587. .chat_row code:only-child {
  1588. display:block;
  1589. padding:0.8em;
  1590. border:none;
  1591. background:transparent;
  1592. }
  1593.  
  1594. .chat_label {
  1595. font-family:rubik;
  1596. font-size:calc({select:post font size} - 1px);
  1597. font-weight:bold;
  1598. text-transform:uppercase;
  1599. letter-spacing:.7px;
  1600. }
  1601.  
  1602. /*----- AUDIO POSTS -----*/
  1603. .tumblr_audio_player[width] {
  1604. width:100%!important;
  1605. height:0!important;
  1606. }
  1607.  
  1608. .ogre {
  1609. background:{color:post background 2};
  1610. }
  1611.  
  1612. .audiocont {
  1613. position:absolute;
  1614. display:none;
  1615. overflow:hidden;
  1616. width:0!important;
  1617. height:0!important;
  1618. opacity:0;
  1619. }
  1620.  
  1621. .is_spotify, .spotify_audio_player, .is_soundcloud {
  1622. width:100%;
  1623. }
  1624.  
  1625. [grayscale="yes"] .is_spotify, [grayscale="yes"] .is_soundcloud {
  1626. filter:var(--Grayscale-Settings);
  1627. -webkit-filter:var(--Grayscale-Settings);
  1628. transition:filter var(--Grayscale-Hover-Speed) ease-in-out;
  1629. }
  1630.  
  1631. [grayscale="yes"] .posts:hover .is_spotify,
  1632. [grayscale="yes"] .posts:hover .is_soundcloud {
  1633. filter:initial;
  1634. -webkit-filter:initial;
  1635. }
  1636.  
  1637. .alcove {
  1638. position:relative;
  1639. width:var(--Audio-Post-Album-Image-Size);
  1640. height:var(--Audio-Post-Album-Image-Size);
  1641. }
  1642.  
  1643. .strawberries {
  1644. position:absolute;
  1645. top:0;margin-top:calc((100% - (var(--Audio-Post-PlayButton-Size) + (var(--Audio-Post-PlayButton-Padding) * 2) + 2px)) / 2);
  1646. left:0;margin-left:calc((100% - (var(--Audio-Post-PlayButton-Size) + (var(--Audio-Post-PlayButton-Padding) * 2) + 2px)) / 2);
  1647. width:calc(var(--Audio-Post-PlayButton-Size) + (var(--Audio-Post-PlayButton-Padding) * 2) + 2px);
  1648. height:calc(var(--Audio-Post-PlayButton-Size) + (var(--Audio-Post-PlayButton-Padding) * 2) + 2px);
  1649. }
  1650.  
  1651. .summer {
  1652. border:1px solid var(--Audio-Post-Buttons-Border);
  1653. width:100%;
  1654. height:100%;
  1655. background:var(--Audio-Post-Buttons-BG);
  1656. box-sizing:border-box;
  1657. border-radius:100%;
  1658. display:flex;
  1659. align-items:center;
  1660. justify-content:center;
  1661. line-height:1em;
  1662. cursor:pointer;
  1663. user-select:none;
  1664. }
  1665.  
  1666. .splay {
  1667. margin-top:2px;
  1668. }
  1669.  
  1670. .splay i, .spause i {
  1671. font-size:var(--Audio-Post-PlayButton-Size);
  1672. color:var(--Audio-Post-Buttons-Color);
  1673. }
  1674.  
  1675. .spause {
  1676. display:none;
  1677. margin-top:2px;
  1678. }
  1679.  
  1680. .spause i {
  1681. font-size:calc(var(--Audio-Post-PlayButton-Size) - 1px);
  1682. }
  1683.  
  1684. .a-lbum-img {
  1685. width:100%;
  1686. height:100%;
  1687. visibility:hidden;
  1688. }
  1689.  
  1690. .tin {
  1691. width:calc(100% - var(--Audio-Post-Album-Image-Size));
  1692. height:var(--Audio-Post-Album-Image-Size);
  1693. padding:10px 12px;
  1694. box-sizing:border-box;
  1695. }
  1696.  
  1697. .trackinfo {
  1698. }
  1699.  
  1700. .t-name, .npf-audio-title {
  1701. font-family:rubik;
  1702. font-size:calc({select:post font size} - 1px);
  1703. font-weight:bold;
  1704. text-transform:uppercase;
  1705. letter-spacing:1px;
  1706. }
  1707.  
  1708. .t-name + .t-artist {
  1709. margin-top:-2.5px;
  1710. }
  1711.  
  1712. .dongload {
  1713. text-transform:initial!important;
  1714. }
  1715.  
  1716. .dong {
  1717. width:calc({select:post font size} + 4px);
  1718. height:calc({select:post font size} + 4px);
  1719. -webkit-mask-image:var(--dongload);
  1720. -webkit-mask-repeat:no-repeat;
  1721. -webkit-mask-size:contain;
  1722. background:var(--Audio-Post-Download-Color);
  1723. }
  1724.  
  1725. /*----- VIDEOS -----*/
  1726. video {
  1727. position:relative;
  1728. display:block;
  1729. outline:none;
  1730. cursor:default;
  1731. width:100%;
  1732. }
  1733.  
  1734. [grayscale="yes"] video {
  1735. filter:var(--Grayscale-Settings);
  1736. transition:filter var(--Grayscale-Hover-Speed) ease-in-out;
  1737. }
  1738.  
  1739. [grayscale="yes"] .posts:hover video {
  1740. filter:initial;
  1741. -webkit-filter:initial;
  1742. }
  1743.  
  1744. video::-webkit-media-controls-panel {
  1745. position:absolute;
  1746. bottom:0;
  1747. background:transparent!important;
  1748. width:100%;
  1749. box-sizing:border-box;
  1750. opacity:1!important;
  1751. filter:invert(1);
  1752. }
  1753.  
  1754. video::-webkit-media-controls-volume-slider, video::-webkit-media-controls-timeline {
  1755. display:none!important;
  1756. }
  1757.  
  1758. /*--------*/
  1759.  
  1760. [grayscale="yes"] .tumblr_video_container {
  1761. filter:var(--Grayscale-Settings)!important;
  1762. transition:filter var(--Grayscale-Hover-Speed) ease-in-out!important;
  1763. }
  1764.  
  1765. [grayscale="yes"] .posts:hover .tumblr_video_container {
  1766. filter:initial!important;
  1767. -webkit-filter:initial!important;
  1768. }
  1769.  
  1770. .tumblr_video_container {
  1771. width:initial!important;
  1772. height:initial!important;
  1773. }
  1774.  
  1775. .tumblr_video_iframe {
  1776. width:100%!important;
  1777. }
  1778.  
  1779. /*----- TAGS -----*/
  1780. .tagcont[tags-opt*='yesclick']{
  1781. {block:IndexPage}
  1782. display:none;
  1783. {/block:IndexPage}
  1784. }
  1785.  
  1786. .tagcont[tags-opt*='withfade']{
  1787. {block:IndexPage}
  1788. opacity:0;
  1789. {/block:IndexPage}
  1790. }
  1791.  
  1792. .tagcont {
  1793. margin:-3px -5px;
  1794. }
  1795.  
  1796. .tagcont, .tagsfade {
  1797. transition:opacity 400ms ease-in-out;
  1798. }
  1799.  
  1800. .tagsfade {
  1801. opacity:1!important;
  1802. }
  1803.  
  1804. .tagholder {
  1805. display:flex;
  1806. flex-wrap:wrap;
  1807. justify-content:flex-end;
  1808. padding-top:{select:post padding};
  1809. text-align:right;
  1810. /*margin:0 -5px;*/
  1811. font-family:rubik;
  1812. font-size:calc({select:post font size} - 3px);
  1813. text-transform:uppercase;
  1814. letter-spacing:1px;
  1815. }
  1816.  
  1817. .tagholder a {
  1818. display:block;
  1819. margin:0 3.5px;
  1820. color:{color:tags};
  1821. }
  1822.  
  1823. /*------------ PERMALINK ------------*/
  1824. .permarow {
  1825. display:flex;
  1826. align-items:center;
  1827. justify-content:space-between;
  1828. margin-top:{select:permalink top gap};
  1829. padding:{select:permalink padding};
  1830. background:{color:permalink background};
  1831. border:1px solid {color:permalink border};
  1832. min-height:{select:post buttons size};
  1833. text-transform:uppercase;
  1834. font-family:public sans;
  1835. font-size:calc({select:post font size} - 3.3px);
  1836. letter-spacing:1px;
  1837. color:{color:permalink text};
  1838. line-height:1em;
  1839. }
  1840.  
  1841. .permaleft {
  1842. /*flex:1;*/
  1843. display:flex;
  1844. align-items:center;
  1845. font-family:rubik;
  1846. white-space:nowrap;
  1847. }
  1848.  
  1849. .p_thelink {
  1850. padding:{select:permalink padding} 0;
  1851. margin:-{select:permalink padding} 0;
  1852. }
  1853.  
  1854. .permarow i {
  1855. margin:0 6px;
  1856. font-size:calc({select:post font size} - 2px);
  1857. color:{color:permalink};
  1858. }
  1859.  
  1860. .permarow a {
  1861. color:{color:permalink};
  1862. font-family:public sans;
  1863. }
  1864.  
  1865. .viasrc a {
  1866. display:block;
  1867. margin-left:4px;
  1868. letter-spacing:1px;
  1869. }
  1870.  
  1871. .permaright, .les-controls {
  1872. display:flex;
  1873. align-items:center;
  1874. }
  1875.  
  1876. .les-controls > a {
  1877. display:block;
  1878. margin-right:{select:post buttons spacing};
  1879. width:{select:post buttons size};
  1880. height:{select:post buttons size};
  1881. }
  1882.  
  1883. .les-controls svg {
  1884. display:block;
  1885. width:100%;
  1886. height:100%;
  1887. fill:{color:post buttons};
  1888. }
  1889.  
  1890. .permaright a {margin-right:{select:post buttons spacing};}
  1891. .permaright a:last-of-type {margin-right:0;}
  1892.  
  1893. .viewtags[tags-opt='default']{
  1894. display:none;
  1895. }
  1896.  
  1897. .viewtags {
  1898. cursor:help;
  1899. }
  1900.  
  1901. .hashtag {
  1902. display:block;
  1903. width:{select:post buttons size};
  1904. height:{select:post buttons size};
  1905. -webkit-mask-image:var(--Hashtag);
  1906. -webkit-mask-repeat:no-repeat;
  1907. -webkit-mask-size:contain;
  1908. background:{color:post buttons};
  1909. }
  1910.  
  1911. .retweet, .heart {
  1912. display:block;
  1913. width:{select:post buttons size};
  1914. height:{select:post buttons size};
  1915. -webkit-mask-repeat:no-repeat;
  1916. -webkit-mask-size:contain;
  1917. }
  1918.  
  1919. .retweet {
  1920. -webkit-mask-image:var(--Reblog-Icon);
  1921. transform:scaleX(-1);
  1922. }
  1923.  
  1924. .heart {
  1925. -webkit-mask-image:var(--Heart-Icon);
  1926. }
  1927.  
  1928. .likecont {
  1929. position:relative;
  1930. cursor:pointer;
  1931. }
  1932.  
  1933. .like_button {
  1934. position:absolute;
  1935. width:100%;
  1936. height:100%;
  1937. }
  1938.  
  1939. .like_button iframe {
  1940. position:absolute;
  1941. top:0;left:0;
  1942. width:100%;
  1943. height:100%;
  1944. opacity:0;
  1945. z-index:2;
  1946. }
  1947.  
  1948. .like_button.liked + .heart {
  1949. background-color:{color:like button liked}!important;
  1950. }
  1951.  
  1952. .viasrc a {
  1953. margin-left:0;
  1954. transform-origin:right;
  1955. }
  1956.  
  1957. /*----- POST NOTES -----*/
  1958. .notescont {
  1959. margin-bottom:{select:window margin};
  1960. width:{select:post width};
  1961. background:{color:post background};
  1962. padding:{select:post padding} calc({select:post padding} * 1.269);
  1963. border:1px solid {color:post borders outer};
  1964. box-sizing:border-box;
  1965. }
  1966.  
  1967. .notescont h1 {
  1968. margin-top:0;
  1969. margin-bottom:calc(var(--Captions-Gap) + 4px);
  1970. padding:3px 0;
  1971. font-family:hundred ligatture;
  1972. font-weight:normal;
  1973. font-size:calc({select:post font size} + 0px);
  1974. text-transform:uppercase;
  1975. letter-spacing:.7px;
  1976. color:{color:headings};
  1977. text-align:center;
  1978. }
  1979.  
  1980. ol.notes {
  1981. margin:0;
  1982. list-style:none;
  1983. color:rgba({RGBcolor:text},0.8);
  1984. }
  1985.  
  1986. ol.notes .avatar {
  1987. display:none;
  1988. }
  1989.  
  1990. ol.notes li {
  1991. margin-bottom:4px;
  1992. padding:0;
  1993. }
  1994.  
  1995. ol.notes blockquote {
  1996. margin:1em;
  1997. padding-left:1em;
  1998. border-left:1px solid var(--Blockquote-Border-Color);
  1999. }
  2000.  
  2001. ol.notes .action a[rel='nofollow'] {
  2002. font-family:brutal medium;
  2003. font-size:calc({select:post font size} - 3px);
  2004. text-transform:uppercase;
  2005. letter-spacing:.7px;
  2006. color:{color:reblogger};
  2007. }
  2008.  
  2009. .more_notes_link_container {
  2010. margin-top:{select:post padding};
  2011. margin-bottom:calc({select:post padding} * 0.420)!important;
  2012. font-family:brutal medium;
  2013. font-size:calc({select:post font size} - 3px);
  2014. text-transform:uppercase;
  2015. letter-spacing:.7px;
  2016. }
  2017.  
  2018. .more_notes_link_container a {cursor:help}
  2019.  
  2020. /*-------------- PAGINATION --------------*/
  2021. .botpagi {
  2022. display:flex;
  2023. align-items:center;
  2024. justify-content:space-between;
  2025. width:calc({select:post width} + ({select:post padding} * 2) + 2px);
  2026. margin-bottom:calc({select:window margin} - 10px);
  2027. line-height:1em;
  2028. }
  2029.  
  2030. .botpagi a {
  2031. padding:0.69em;
  2032. margin:-0.69em;
  2033. color:{color:pagination}!important;
  2034. }
  2035.  
  2036. .botpagi span {
  2037. padding:0 4px;
  2038. font-family:rubik;
  2039. font-size:calc({select:post font size} - 2.5px);
  2040. text-transform:uppercase;
  2041. letter-spacing:.7px;
  2042. }
  2043.  
  2044. .prev-svg {
  2045. margin-top:-.5px;
  2046. width:calc({select:post font size} + 3px);
  2047. height:calc({select:post font size} + 3px);
  2048. -webkit-mask-image:var(--BackSVG);
  2049. -webkit-mask-repeat:no-repeat;
  2050. -webkit-mask-size:contain;
  2051. background:{color:pagination};
  2052. }
  2053.  
  2054. .next-svg {
  2055. margin-top:-.5px;
  2056. width:calc({select:post font size} + 3px);
  2057. height:calc({select:post font size} + 3px);
  2058. -webkit-mask-image:var(--NextSVG);
  2059. -webkit-mask-repeat:no-repeat;
  2060. -webkit-mask-size:contain;
  2061. background:{color:pagination};
  2062. }
  2063.  
  2064. .pn {
  2065. margin-left:auto!important;
  2066. }
  2067.  
  2068. .moo {
  2069. position:fixed;
  2070. bottom:0;left:0;
  2071. width:100%;
  2072. z-index:69;
  2073. cursor:pointer;
  2074. }
  2075.  
  2076. .squeesh {
  2077. padding:10px;
  2078. background:#1f1c17;
  2079. font-family:public sans;
  2080. font-size:11px;
  2081. letter-spacing:.3px;
  2082. color:#b49e95;
  2083. text-align:center;
  2084. }
  2085.  
  2086. {CustomCSS}
  2087. </style>
  2088.  
  2089. </head>
  2090.  
  2091. <body>
  2092.  
  2093. <div class="everything">
  2094.  
  2095. <div class="leftside">
  2096. <div class="clutch">
  2097. {block:ifmusicplayersongname}
  2098. <div class="mplayer">
  2099. <div class="zirc">
  2100. <div class="msym"></div>
  2101. </div>
  2102.  
  2103. <div class="mline"></div>
  2104.  
  2105. <div class="potatowrap">
  2106. <div class="music-controls">
  2107. <div class="blay playy"></div>
  2108. <div class="bause pausee"></div>
  2109. </div>
  2110.  
  2111. <div class="songtext">{text:music player song name}</div>
  2112. </div>
  2113.  
  2114. <audio src="{text:music player song mp3}" id="musique"></audio>
  2115. </div>
  2116. {/block:ifmusicplayersongname}
  2117.  
  2118. <div class="sbimg"></div>
  2119.  
  2120. <div class="turnip">
  2121. {block:ifsidebar1title}
  2122. <div class="sbt">
  2123. <div class="sidebar-title">{text:sidebar 1 title}</div>
  2124. </div>
  2125. {/block:ifsidebar1title}
  2126.  
  2127. {block:ifsidebar1desc}
  2128. <div class="sbd" font="{select:body font}" vis="{select:sidebar 1 desc visibility}">
  2129. <div class="sidebar-desc">{text:sidebar 1 desc}</div>
  2130. </div>
  2131. {/block:ifsidebar1desc}
  2132. </div>
  2133. </div>
  2134. </div>
  2135.  
  2136.  
  2137. <div class="sidebeer">
  2138. <div class="tortilla">
  2139. <div class="cas">
  2140. <div class="taro">
  2141. <div class="avhead">
  2142. <img class="avi-icon" src="{image:sidebar 2 icon}">
  2143.  
  2144. {block:ifsidebar2title}
  2145. <div class="avi-title">
  2146. {text:sidebar 2 title}
  2147. <div class="undyne"></div>
  2148. </div>
  2149. {/block:ifsidebar2title}
  2150. </div>
  2151.  
  2152. <div class="headlinks">
  2153. <a href="/">
  2154. <i class="fi-rr-home"></i>
  2155. <span text>index</span>
  2156. </a>
  2157.  
  2158. <a href="/ask">
  2159. <i class="fi-rr-envelope"></i>
  2160. <span text>message</span>
  2161. </a>
  2162.  
  2163. <a href="/archive">
  2164. <i class="fi-rr-calendar"></i>
  2165. <span text>archive</span>
  2166. </a>
  2167. </div>
  2168.  
  2169. <div class="descbox" font="{select:body font}">
  2170. {Description}
  2171. </div>
  2172.  
  2173. <div class="ciels">
  2174. {block:ifcustomlink1name}
  2175. <a href="{text:customlink 1 url}">{text:customlink 1 name}</a>
  2176. {/block:ifcustomlink1name}
  2177.  
  2178. {block:ifcustomlink2name}
  2179. <a href="{text:customlink 2 url}">{text:customlink 2 name}</a>
  2180. {/block:ifcustomlink2name}
  2181.  
  2182. {block:ifcustomlink3name}
  2183. <a href="{text:customlink 3 url}">{text:customlink 3 name}</a>
  2184. {/block:ifcustomlink3name}
  2185.  
  2186. {block:ifcustomlink4name}
  2187. <a href="{text:customlink 4 url}">{text:customlink 4 name}</a>
  2188. {/block:ifcustomlink4name}
  2189.  
  2190. {block:ifcustomlink5name}
  2191. <a href="{text:customlink 5 url}">{text:customlink 5 name}</a>
  2192. {/block:ifcustomlink5name}
  2193.  
  2194. {block:ifcustomlink6name}
  2195. <a href="{text:customlink 6 url}">{text:customlink 6 name}</a>
  2196. {/block:ifcustomlink6name}
  2197. </div>
  2198. </div>
  2199. </div>
  2200. </div>
  2201. </div>
  2202.  
  2203.  
  2204. <div class="maincont" cred-pos="{select:credit location}">
  2205. <div class="postscont" font="{select:body font}" grayscale="{select:grayscale photos}">
  2206.  
  2207. {block:Posts inlineMediaWidth="1280" inlineNestedMediaWidth="1280"}
  2208. <div class="posts" post-width="{select:post width}" reblog-borders="{select:reblog separators}" id="{PostID}" post-type="{PostType}" {block:PermalinkPage}on-permapage{/block:PermalinkPage}>
  2209. <div class="pho">
  2210. <div class="postinner">
  2211.  
  2212. <!------ POST TITLE ------>
  2213. {block:Title}
  2214. <h1 class="title">{Title}</h1>
  2215. {/block:Title}
  2216. <!------ END POST TITLE ------>
  2217.  
  2218.  
  2219. {block:RebloggedFrom}
  2220. <div class="commenter nosrc">
  2221. <img src="{ReblogRootPortraitURL-64}">
  2222. <a href="{ReblogRootURL}">{ReblogRootName}</a>
  2223. </div>
  2224. {/block:RebloggedFrom}
  2225.  
  2226.  
  2227. <!------ TEXT POSTS ------>
  2228. {block:Text}
  2229. <div class="body" {block:NotReblog}original{/block:NotReblog}>
  2230. {block:NotReblog}{Body}{/block:NotReblog}
  2231. {block:RebloggedFrom}
  2232. {block:Reblogs}
  2233. <div class="comment_container">
  2234. <div class="commenter source-head">
  2235. <img src="{PortraitURL-64}">
  2236. <a href="{block:HasPermalink}{Permalink}{/block:HasPermalink}">{Username}</a>
  2237. </div>
  2238. <div class="comment">{Body}</div>
  2239. </div>
  2240. {/block:Reblogs}
  2241. {/block:RebloggedFrom}
  2242. </div>
  2243. {/block:Text}
  2244. <!------ END TEXT POSTS ------>
  2245.  
  2246.  
  2247. <!------ SINGLE PHOTO ------>
  2248. {block:Photo}
  2249. <a class="single" 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>
  2250. {/block:Photo}
  2251. <!------ END SINGLE PHOTO ------>
  2252.  
  2253.  
  2254.  
  2255.  
  2256. <!------ PHOTOSETS ------>
  2257. {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}
  2258. <!------ END PHOTOSETS ------>
  2259.  
  2260.  
  2261.  
  2262. <!------ QUOTE POSTS ------>
  2263. {block:Quote}
  2264. <div class="pq">
  2265. <div class="quote-words">{Quote}</div>
  2266. {block:Source}<div class="quote-source comment">&mdash; {Source}</div>{/block:Source}
  2267. </div>
  2268. {/block:Quote}
  2269. <!------ END QUOTE POSTS ------>
  2270.  
  2271.  
  2272. <!------ LINK POSTS ------>
  2273. {block:Link}
  2274. <a href="{URL}" class="linkpath" {Target}>{Name} »</a>
  2275. {block:Description}
  2276. <div class="link-description" {block:NotReblog}original{/block:NotReblog}>
  2277. {block:NotReblog}{Description}{/block:NotReblog}
  2278. {block:RebloggedFrom}
  2279. {block:Reblogs}
  2280. <div class="comment_container">
  2281. <div class="commenter">
  2282. <img src="{PortraitURL-64}">
  2283. <a href="{block:HasPermalink}{Permalink}{/block:HasPermalink}">{Username}</a>
  2284. </div>
  2285. <div class="comment">{Body}</div>
  2286. </div>
  2287. {/block:Reblogs}
  2288. {/block:RebloggedFrom}
  2289. </div>
  2290. {/block:Description}
  2291. {/block:Link}
  2292. <!------ END LINK POSTS ------>
  2293.  
  2294.  
  2295. <!------ CHAT POSTS ------>
  2296. {block:Chat}
  2297. <div class="chatwrap">
  2298. {block:Lines}
  2299. {block:Label}
  2300. <span class="chat_label">{Label}</span>
  2301. {/block:Label}
  2302.  
  2303. <span class="chat_content">{Line}</span>
  2304. {/block:Lines}
  2305. </div>
  2306. {/block:Chat}
  2307. <!------ END CHAT ------>
  2308.  
  2309.  
  2310.  
  2311. <!------ AUDIO POSTS ------>
  2312. {block:Audio}
  2313. <div class="flex ogre">
  2314. <div class="audiocont">
  2315. {AudioEmbed}
  2316. </div>
  2317.  
  2318. <div class="alcove">
  2319. <img class="a-lbum-img">
  2320.  
  2321. <div class="strawberries">
  2322. <div class="summer">
  2323. <div class="splay">
  2324. <i class="material-icons">play_arrow</i>
  2325. </div>
  2326. <div class="spause">
  2327. <i class="material-icons">pause</i>
  2328. </div>
  2329. </div><!--summer-->
  2330. </div>
  2331. </div>
  2332.  
  2333. <div class="tin flex space-between">
  2334. <div class="trackinfo">
  2335. {block:TrackName}
  2336. <div class="t-name">{TrackName}</div>
  2337. {/block:TrackName}
  2338.  
  2339. {block:Artist}
  2340. <div class="t-artist">{Artist}</div>
  2341. {/block:Artist}
  2342. </div><!--trackinfo-->
  2343.  
  2344. <a class="dongload" title="download">
  2345. <div class="dong"></div>
  2346. </a>
  2347. </div><!--flex-->
  2348. </div><!--oofy-->
  2349. {/block:Audio}
  2350. <!------ END AUDIO ------>
  2351.  
  2352.  
  2353.  
  2354. <!------ VIDEO POSTS ------>
  2355. {block:Video}<div class="video">{Video-500}</div>{/block:Video}
  2356. <!------ END VIDEOS ------>
  2357.  
  2358.  
  2359.  
  2360. <!------ ANSWER POSTS ------>
  2361. {block:Answer}
  2362. <div class="comment_container as">
  2363. <div class="askcont">
  2364. <img class="askimg" src="{AskerPortraitURL-48}">
  2365.  
  2366. <div class="askright">
  2367. <div class="asker commenter">
  2368. <span>{Asker} <b>asked:</b></span>
  2369. </div>
  2370.  
  2371. <div class="question_text">{Question}</div>
  2372. </div>
  2373. </div>
  2374. </div>
  2375. {block:Answerer}
  2376. <div class="comment_container anscont">
  2377. <div class="answerer commenter">
  2378. <img src="{AnswererPortraitURL-48}"/>
  2379. {Answerer}<a class="response">answered:</a>
  2380. </div>
  2381. <div class="answer_text comment">{Answer}</div>
  2382. </div>
  2383. {block:Reblogs}
  2384. <div class="comment_container">
  2385. <div class="replier commenter">
  2386. <img src="{PortraitURL-64}">
  2387. <a href="{block:HasPermalink}{Permalink}{/block:HasPermalink}">{Username}</a>
  2388. </div>
  2389. <div class="reply">{Body}</div>
  2390. </div>
  2391. {/block:Reblogs}
  2392. {/block:Answerer}
  2393. {block:NotReblog}
  2394. <div class="comment_container">
  2395. <div class="answerer commenter">
  2396. <img src="{PortraitURL-48}">
  2397. <a href="{Permalink}">{Name}&nbsp;answered:</a>
  2398. </div><!--answerer-->
  2399. <div class="answer_text">{Answer}</div>
  2400. </div><!--answer-container-->
  2401. {/block:NotReblog}
  2402. {/block:Answer}
  2403. <!------ END ANSWER ------>
  2404.  
  2405. {block:Caption}
  2406. <div class="caption" {block:NotReblog}original{/block:NotReblog}>
  2407. {block:NotReblog}{Caption}{/block:NotReblog}
  2408. {block:RebloggedFrom}
  2409. {block:Reblogs}
  2410. <div class="comment_container">
  2411. <div class="commenter">
  2412. <img src="{PortraitURL-64}">
  2413. <a href="{block:HasPermalink}{Permalink}{/block:HasPermalink}">{Username}</a>
  2414. </div><!--commenter-->
  2415. <div class="comment">{Body}</div>
  2416. </div><!--comment-container-->
  2417. {/block:Reblogs}
  2418. {/block:RebloggedFrom}
  2419. </div><!--caption-->
  2420. {/block:Caption}
  2421.  
  2422.  
  2423. {block:HomePage}
  2424. {block:PinnedPostLabel}
  2425. <p class="pi-n">
  2426. <span class="pinny"></span>
  2427. <span>{PinnedPostLabel}</span>
  2428. </p>
  2429. {/block:PinnedPostLabel}
  2430. {/block:HomePage}
  2431.  
  2432. </div><!--postinner-->
  2433.  
  2434.  
  2435.  
  2436. {block:HasTags}
  2437. <div class="tagcont" tags-opt="{select:show tags on click}">
  2438. <div class="tagholder">
  2439. {block:Tags}
  2440. <a href="{TagURL}" init-tags>#{Tag}</a>
  2441. {/block:Tags}
  2442. </div>
  2443. </div>
  2444. {/block:HasTags}
  2445. </div><!--pho-->
  2446.  
  2447.  
  2448. {block:Date}
  2449. <div class="permarow">
  2450. <div class="permaleft">
  2451. {block:IndexPage}
  2452.  
  2453. {block:NotReblog}Posted{/block:NotReblog}
  2454. {block:RebloggedFrom}Reblogged{/block:RebloggedFrom}
  2455. on&nbsp;&thinsp;
  2456. <a href="{Permalink}" class="flex p_thelink">
  2457. {ShortMonth} {DayofMonthWithSuffix} {Year}
  2458. <i class="fi-rr-{select:permalink icon}"></i>
  2459. {NoteCountWithLabel}
  2460. </a>
  2461.  
  2462. {/block:IndexPage}
  2463.  
  2464. {block:PermalinkPage}
  2465. {block:NotReblog}Posted{/block:NotReblog}
  2466. {block:RebloggedFrom}Reblogged{/block:RebloggedFrom}
  2467. on&nbsp;&thinsp;<a flex>{ShortMonth} {DayofMonthWithSuffix} {Year}
  2468. <i class="fi-rr-minus"></i>
  2469. {TimeAgo}</a>
  2470. {/block:PermalinkPage}
  2471. </div>
  2472.  
  2473. <div class="permaright">
  2474. {block:IndexPage}
  2475. <div class="les-controls flex">
  2476.  
  2477. {block:HasTags}
  2478. <a class="viewtags" tags-opt="{select:show tags on click}">
  2479. <span class="hashtag"></span>
  2480. </a>
  2481. {/block:HasTags}
  2482.  
  2483. <a href="{ReblogURL}" target="_blank">
  2484. <span class="retweet"></span>
  2485. </a>
  2486.  
  2487. <a class="likecont like">
  2488. {LikeButton}
  2489. <span class="heart"></span>
  2490. </a>
  2491. </div>
  2492. {/block:IndexPage}
  2493.  
  2494.  
  2495. {block:PermalinkPage}
  2496. {block:RebloggedFrom}
  2497. <div class="viasrc flex">
  2498. <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>
  2499. <a href="{ReblogRootURL}" title="{ReblogRootName}">source</a>
  2500. </div><!--viasrc-->
  2501. {/block:RebloggedFrom}
  2502. {/block:PermalinkPage}
  2503. </div>
  2504. </div><!--permarow-->
  2505. {/block:Date}
  2506.  
  2507. </div><!--posts-->
  2508.  
  2509. {block:PostNotes}
  2510. <div class="notescont">
  2511. <h1>{NoteCountWithLabel}</h1>
  2512. {PostNotes}
  2513. </div>
  2514. {/block:PostNotes}
  2515. {/block:Posts}
  2516.  
  2517. <!------- PAGINATION ------->
  2518. {block:Pagination}
  2519. <div class="botpagi">
  2520. {block:PreviousPage}
  2521. <a class="flex" href="{PreviousPage}">
  2522. <div class="prev-svg"></div>
  2523. <span>previous page</span>
  2524. </a>
  2525. {/block:PreviousPage}
  2526.  
  2527. {block:NextPage}
  2528. <a class="flex pn" href="{NextPage}">
  2529. <span>next page</span>
  2530. <div class="next-svg"></div>
  2531. </a>
  2532. {/block:NextPage}
  2533. </div>
  2534. {/block:Pagination}
  2535.  
  2536. </div><!--postscont-->
  2537. </div><!--maincont-->
  2538. </div><!--everything-->
  2539.  
  2540. <div invis user-avi>{PortraitURL-64}</div>
  2541.  
  2542. <script src="//static.tumblr.com/0podkko/jfMplm3f8/modified_photosets.js"></script>
  2543.  
  2544. </body>
  2545. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!