API tools faq
paste
Advertisement
glenthemes

Theme [03]: Desiderium

glenthemes
Aug 11th, 2015 (edited)
38,008
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 82.23 KB | None | 0 0
raw download clone embed print report
  1. <!----------------------------------------------------
  2. Theme [03]: Desiderium
  3. Made by glenthemes
  4.  
  5. Initial release: 2015/08/12
  6. Remake date: 2021/09/15
  7. Last updated: 2023/09/28
  8.  
  9. What's new:
  10. ✱ fixed post notes icons showing incorrectly
  11. ✱ NPF audio post support
  12.  
  13. TERMS OF USE:
  14. 1) Do not remove the theme credit.
  15. 2) Do not repost/redistribute my themes.
  16. 3) Do not take parts of the code and use it as your own.
  17. 4) Do not use my themes as a base code.
  18. 5) Do not mix my works together.
  19.  
  20. CREDITS:
  21. (o≧∇≦)o ~ glencredits.tumblr.com/desiderium
  22. ----------------------------------------------------->
  23. <!DOCTYPE html>
  24. <html ls="{select:loading screen}">
  25.  
  26. <head>
  27.  
  28. <title>{Title}</title>
  29.  
  30. {block:Description}
  31. <meta name="description" content="{MetaDescription}">
  32. {/block:Description}
  33.  
  34. <link rel="shortcut icon" href="{Favicon}">
  35.  
  36. <link rel="preload" href="{image:background image}" as="image">
  37. <link rel="preload" href="{image:sidebar image}" as="image">
  38.  
  39. <!-------- FONTS -------->
  40. <link href="//fonts.googleapis.com/css?family=Atkinson+Hyperlegible|Work+Sans|Lora:500|Vollkorn|Arapey|Gabriela|Karla|Open+Sans|Domine|Cousine" rel="stylesheet">
  41.  
  42. <!-------- THEME SCRIPTS -------->
  43. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  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.  
  48. <script src="//rawgit.com/robinpx/tumblr/master/scripts/flexibleFrames/flexibleFrames.min.js"></script>
  49.  
  50. <link href="//static.tumblr.com/0podkko/oDSpg7y88/photosets.css" rel="stylesheet">
  51.  
  52. <script src="//static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  53.  
  54. <script src="https://unpkg.com/phosphor-icons"></script>
  55.  
  56. <script src="//static.tumblr.com/gtjt4bo/sgMrymui0/waitforelement.js"></script>
  57. <script src="//glen-themes.gitlab.io/thms/03/jackwald-supremacy.js"></script>
  58. <script src="//glen-themes.gitlab.io/thms/03/jabberwock.js"></script>
  59.  
  60. <!-- unblue polls -->
  61. <!-- glenthemes.tumblr.com/post/708014819571302400 -->
  62. <link href="//static.tumblr.com/gtjt4bo/mXBrpdj0n/unblue-polls.css" rel="stylesheet">
  63. <style unblue-polls>
  64. .poll-post {
  65. --Poll-Question-Font-Size: var(--Body-Font-Size);
  66.  
  67. --Poll-Option-Background-Color: transparent;
  68. --Poll-Option-Corner-Rounding: 0px;
  69. --Poll-Option-Border-Size: 1px;
  70. --Poll-Option-Border-Color: var(--Blockquote-Border-Color);
  71. --Poll-Option-Padding: 0.69em;
  72. --Poll-Option-Font-Size: var(--Body-Font-Size);
  73. --Poll-Option-Spacing: 10px;
  74. --Poll-Option-Text-Color: {color:text};
  75.  
  76. --Poll-Option-HOVER-Border-Color: var(--Blockquote-Border-Color);
  77. --Poll-Option-HOVER-Background-Color: transparent;
  78. --Poll-Option-HOVER-Text-Color: {color:text};
  79. --Poll-Option-HOVER-Speed: 0.4s;
  80. }
  81.  
  82. .poll-see-results {
  83. padding-bottom:0!important;
  84. border-bottom:none!important;
  85. font-size:calc(var(--Poll-Option-Font-Size) - 1px)!important;
  86. text-transform:uppercase;
  87. letter-spacing:0.5px;
  88. }
  89. </style>
  90.  
  91. <!-- npf audio player -->
  92. <!-- glenthemes.tumblr.com/post/722160746171072512 -->
  93. <script src="//tmblr-npf-audio.gitlab.io/s/init.js"></script>
  94. <link href="//tmblr-npf-audio.gitlab.io/s/base.css" rel="stylesheet">
  95. <script>
  96. tumblr_npf_audio({
  97. emptyTitleText: "Untitled track",
  98. emptyArtistText: "Untitled artist",
  99. emptyAlbumText: "Untitled album",
  100.  
  101. titleLabel: "",
  102. artistLabel: "",
  103. albumLabel: ""
  104. });
  105. </script>
  106. <style edit-npf-audio-player>
  107. .npf-audio-wrapper {
  108. --NPF-Audio-Buttons-Size: var(--Audio-Post-Buttons-Size);
  109. --NPF-Audio-Buttons-Color: var(--Audio-Post-Buttons-Color);
  110. --NPF-Audio-Buttons-Padding: var(--Audio-Post-Buttons-Padding);
  111. --NPF-Audio-Buttons-Spacing: calc(var(--p) + var(--Audio-Post-Album-Right-Gap));
  112. --NPF-Audio-Image-Size: var(--Audio-Post-Album-Size);
  113. --NPF-Audio-Image-Spacing: 0px;
  114.  
  115. --t:calc((var(--NPF-Audio-Buttons-Padding) * 2) + var(--NPF-Audio-Buttons-Size));
  116. --p:calc(var(--NPF-Audio-Buttons-Padding) + ((var(--NPF-Audio-Image-Size) - var(--t)) / 2));
  117. }
  118.  
  119. .npf-audio-wrapper {
  120. position:relative;
  121. margin-bottom:calc(0px - var(--Post-Padding) - 1px);
  122. background:var(--Audio-Post-Info-Background);
  123. z-index:0;
  124. }
  125.  
  126. .npf-no-caption .npf-audio-wrapper {
  127. margin-top:1em!important;
  128. border-top:1px solid {color:post borders inner};
  129. }
  130.  
  131. .npf-audio-background {
  132. margin-left:var(--p);
  133. }
  134.  
  135. .npf-audio-play, .npf-audio-pause {
  136. position:relative;
  137. z-index:0;
  138. }
  139.  
  140. .npf-audio-play:after, .npf-audio-pause:after {
  141. content:"";
  142. position:absolute;
  143. top:0;left:0;
  144. margin-top:calc(0px - var(--NPF-Audio-Buttons-Padding));
  145. margin-left:calc(0px - var(--NPF-Audio-Buttons-Padding));
  146. width:calc(100% + (var(--NPF-Audio-Buttons-Padding) * 2));
  147. height:calc(100% + (var(--NPF-Audio-Buttons-Padding) * 2));
  148. background:var(--Audio-Post-Buttons-Background);
  149. border-radius:100%;
  150. z-index:-1;
  151. }
  152.  
  153. .npf-audio-play svg { margin-left:1px; }
  154. .npf-audio-pause svg { margin-left:0; }
  155.  
  156. figcaption.audio-caption,
  157. figcaption.audio-caption ~ audio[controls]{
  158. display:none;
  159. }
  160.  
  161. .npf-audio-image {
  162. position:absolute;
  163. top:0;left:0;
  164. border-right:1px solid {color:post borders inner};
  165. z-index:-1;
  166. }
  167.  
  168. .npf-audio-details {
  169. color:var(--Body-Text-Color);
  170. }
  171.  
  172. .npf-audio-details > * + * {
  173. margin-top:-4px;
  174. }
  175.  
  176. .npf-audio-title-label,
  177. .npf-audio-artist-label,
  178. .npf-audio-album-label {
  179. font-weight: bold;
  180. }
  181. </style>
  182.  
  183. <script src="//glen-npf.gitlab.io/other/neue.js"></script>
  184. <link href="//glen-npf.gitlab.io/other/neue.css" rel="stylesheet">
  185.  
  186. <!-------- OPTIONS -------->
  187. <!-- hi if you're reading this please press the back arrow to edit! -->
  188. <meta name="image:background image" content="//64.media.tumblr.com/3002b0339c879026b707e08f516db28d/b866213a74f6457d-38/s2048x3072/b1d65709250871a98bfd923b11fac10c51b5b21e.png">
  189. <meta name="image:sidebar image" content="//static.tumblr.com/2pnwama/j58s1pr60/surfacage_jack.png">
  190.  
  191. <meta name="color:background" content="#150a05">
  192.  
  193. <meta name="color:loading screen symbol" content="#6f5e53">
  194. <meta name="color:loading screen symbol hand" content="#a89181">
  195.  
  196. <meta name="color:left bar 1" content="#2d211c">
  197. <meta name="color:left bar 2" content="#422d23">
  198.  
  199. <meta name="color:sidebar title" content="#c3aba5">
  200. <meta name="color:sidebar title background" content="#332620">
  201. <meta name="color:sidebar title border 1" content="#604d47">
  202. <meta name="color:sidebar title border 2" content="#a48271">
  203. <meta name="color:sidebar title shadow" content="#040404">
  204.  
  205. <meta name="color:navlinks background" content="#291d19">
  206. <meta name="color:navlinks icon" content="#b59586">
  207. <meta name="color:navlinks border" content="#8f6f5f">
  208.  
  209. <meta name="color:sidebar frame main" content="#e2c6b8">
  210. <meta name="color:sidebar frame darker" content="#191310">
  211. <meta name="color:sidebar frame leaves" content="#755e57">
  212. <meta name="color:sidebar image background" content="#090909">
  213. <meta name="color:sidebar image shadow" content="#3c2e2d">
  214. <meta name="color:sidebar image glow" content="#dfcdbf">
  215.  
  216. <meta name="color:sidebar desc" content="#c3aba5">
  217. <meta name="color:sidebar desc border 1" content="#8f6f5f">
  218. <meta name="color:sidebar desc border 2" content="#5a3e3b">
  219. <meta name="color:sidebar desc background 1" content="#111">
  220. <meta name="color:sidebar desc background 2" content="#332620">
  221.  
  222. <meta name="color:customlinks border 1" content="#8f6f5f">
  223. <meta name="color:customlinks border 2" content="#3c2826">
  224. <meta name="color:customlinks background 1" content="#1e1613">
  225. <meta name="color:customlinks background 2" content="#332620">
  226. <meta name="color:customlinks text" content="#c3aba5">
  227. <meta name="color:customlinks hover glow" content="#533b35">
  228.  
  229. <meta name="color:post" content="#221915">
  230. <meta name="color:text" content="#bba099">
  231. <meta name="color:accent" content="#c4957f">
  232. <meta name="color:post borders inner" content="#5e4645">
  233. <meta name="color:post borders outer" content="#453534">
  234.  
  235. <meta name="color:permalink" content="#b7857d">
  236. <meta name="color:permalink background" content="#1f1713">
  237. <meta name="color:permalink border" content="#453534">
  238. <meta name="color:like button liked" content="#ff7875">
  239.  
  240. <meta name="color:text selection background" content="#4a3c32">
  241. <meta name="color:text selected" content="#c3b0a5">
  242.  
  243. <meta name="color:scrollbar" content="#604d47">
  244.  
  245. <meta name="select:loading screen" title="on" content="on">
  246. <meta name="select:loading screen" title="off" content="off">
  247.  
  248. <meta name="select:sidebar title width" title="90%" content="90%">
  249. <meta name="select:sidebar title width" title="60%" content="60%">
  250. <meta name="select:sidebar title width" title="70%" content="70%">
  251. <meta name="select:sidebar title width" title="80%" content="80%">
  252. <meta name="select:sidebar title width" title="100%" content="100%">
  253. <meta name="select:sidebar title width" title="110%" content="110%">
  254. <meta name="select:sidebar title width" title="120%" content="120%">
  255. <meta name="select:sidebar title width" title="130%" content="130%">
  256.  
  257. <meta name="select:sidebar title font size" title="11px" content="11px">
  258. <meta name="select:sidebar title font size" title="10px" content="10px">
  259. <meta name="select:sidebar title font size" title="12px" content="12px">
  260. <meta name="select:sidebar title font size" title="13px" content="13px">
  261. <meta name="select:sidebar title font size" title="14px" content="14px">
  262.  
  263. <meta name="select:sidebar title padding" title="10px" content="10px">
  264. <meta name="select:sidebar title padding" title="8px" content="8px">
  265. <meta name="select:sidebar title padding" title="9px" content="9px">
  266. <meta name="select:sidebar title padding" title="11px" content="11px">
  267. <meta name="select:sidebar title padding" title="12px" content="12px">
  268. <meta name="select:sidebar title padding" title="13px" content="13px">
  269. <meta name="select:sidebar title padding" title="14px" content="14px">
  270.  
  271. <meta name="select:sidebar image width" title="250px" content="250px">
  272. <meta name="select:sidebar image width" title="200px" content="200px">
  273. <meta name="select:sidebar image width" title="300px" content="300px">
  274. <meta name="select:sidebar image width" title="350px" content="350px">
  275.  
  276. <meta name="select:sidebar inner leaves transparency" title="70%" content="0.7">
  277. <meta name="select:sidebar inner leaves transparency" title="10%" content="0.1">
  278. <meta name="select:sidebar inner leaves transparency" title="20%" content="0.2">
  279. <meta name="select:sidebar inner leaves transparency" title="30%" content="0.3">
  280. <meta name="select:sidebar inner leaves transparency" title="40%" content="0.4">
  281. <meta name="select:sidebar inner leaves transparency" title="50%" content="0.5">
  282. <meta name="select:sidebar inner leaves transparency" title="60%" content="0.6">
  283. <meta name="select:sidebar inner leaves transparency" title="80%" content="0.8">
  284. <meta name="select:sidebar inner leaves transparency" title="90%" content="0.9">
  285. <meta name="select:sidebar inner leaves transparency" title="100%" content="1">
  286.  
  287. <meta name="select:sidebar outer leaves transparency" title="50%" content="0.5">
  288. <meta name="select:sidebar outer leaves transparency" title="10%" content="0.1">
  289. <meta name="select:sidebar outer leaves transparency" title="20%" content="0.2">
  290. <meta name="select:sidebar outer leaves transparency" title="30%" content="0.3">
  291. <meta name="select:sidebar outer leaves transparency" title="40%" content="0.4">
  292. <meta name="select:sidebar outer leaves transparency" title="60%" content="0.6">
  293. <meta name="select:sidebar outer leaves transparency" title="70%" content="0.7">
  294. <meta name="select:sidebar outer leaves transparency" title="80%" content="0.8">
  295. <meta name="select:sidebar outer leaves transparency" title="90%" content="0.9">
  296. <meta name="select:sidebar outer leaves transparency" title="100%" content="1">
  297.  
  298. <meta name="select:sidebar image margin" title="16px" content="16px">
  299. <meta name="select:sidebar image margin" title="8px" content="8px">
  300. <meta name="select:sidebar image margin" title="12px" content="12px">
  301. <meta name="select:sidebar image margin" title="20px" content="20px">
  302. <meta name="select:sidebar image margin" title="24px" content="24px">
  303.  
  304. <meta name="select:sidebar desc width" title="90%" content="90%">
  305. <meta name="select:sidebar desc width" title="80%" content="80%">
  306. <meta name="select:sidebar desc width" title="100%" content="100%">
  307. <meta name="select:sidebar desc width" title="110%" content="110%">
  308. <meta name="select:sidebar desc width" title="120%" content="120%">
  309. <meta name="select:sidebar desc width" title="130%" content="130%">
  310.  
  311. <meta name="select:sidebar desc font family" title="Arapey" content="Arapey">
  312. <meta name="select:sidebar desc font family" title="Atkinson Hyberlegible" content="Atkinson Hyperlegible">
  313. <meta name="select:sidebar desc font family" title="Lora" content="Lora">
  314. <meta name="select:sidebar desc font family" title="Vollkorn" content="Vollkorn">
  315. <meta name="select:sidebar desc font family" title="Gabriela" content="Gabriela">
  316. <meta name="select:sidebar desc font family" title="Karla" content="Karla">
  317. <meta name="select:sidebar desc font family" title="Domine" content="Domine">
  318. <meta name="select:sidebar desc font family" title="Open Sans" content="Open Sans">
  319.  
  320. <meta name="select:sidebar desc font size" title="13px" content="13px">
  321. <meta name="select:sidebar desc font size" title="10px" content="10px">
  322. <meta name="select:sidebar desc font size" title="11px" content="11px">
  323. <meta name="select:sidebar desc font size" title="12px" content="12px">
  324. <meta name="select:sidebar desc font size" title="14px" content="14px">
  325.  
  326. <meta name="select:sidebar desc padding" title="14px" content="14px">
  327. <meta name="select:sidebar desc padding" title="10px" content="10px">
  328. <meta name="select:sidebar desc padding" title="12px" content="12px">
  329. <meta name="select:sidebar desc padding" title="16px" content="16px">
  330. <meta name="select:sidebar desc padding" title="18px" content="18px">
  331.  
  332. <meta name="select:sidebar desc text align" title="justify" content="justify">
  333. <meta name="select:sidebar desc text align" title="left" content="left">
  334. <meta name="select:sidebar desc text align" title="center" content="center">
  335. <meta name="select:sidebar desc text align" title="right" content="right">
  336.  
  337. <meta name="select:center gap" title="75px" content="75px">
  338. <meta name="select:center gap" title="50px" content="50px">
  339. <meta name="select:center gap" title="55px" content="55px">
  340. <meta name="select:center gap" title="60px" content="60px">
  341. <meta name="select:center gap" title="65px" content="65px">
  342. <meta name="select:center gap" title="70px" content="70px">
  343. <meta name="select:center gap" title="80px" content="80px">
  344. <meta name="select:center gap" title="85px" content="85px">
  345.  
  346. <meta name="select:post width" title="500px" content="500px">
  347. <meta name="select:post width" title="400px" content="400px">
  348. <meta name="select:post width" title="450px" content="450px">
  349. <meta name="select:post width" title="540px" content="540px">
  350.  
  351. <meta name="select:post padding" title="15px" content="15px">
  352. <meta name="select:post padding" title="10px" content="10px">
  353. <meta name="select:post padding" title="20px" content="20px">
  354.  
  355. <meta name="select:photoset spacing" title="4px" content="4px">
  356. <meta name="select:photoset spacing" title="2px" content="2px">
  357. <meta name="select:photoset spacing" title="6px" content="6px">
  358. <meta name="select:photoset spacing" title="8px" content="8px">
  359. <meta name="select:photoset spacing" title="10px" content="10px">
  360.  
  361. <meta name="select:body font" title="Domine" content="Domine">
  362. <meta name="select:body font" title="Atkinson Hyberlegible" content="Atkinson Hyperlegible">
  363. <meta name="select:body font" title="Lora" content="Lora">
  364. <meta name="select:body font" title="Vollkorn" content="Vollkorn">
  365. <meta name="select:body font" title="Gabriela" content="Gabriela">
  366. <meta name="select:body font" title="Karla" content="Karla">
  367. <meta name="select:body font" title="Open Sans" content="Open Sans">
  368.  
  369. <meta name="select:font size" title="12px" content="12px">
  370. <meta name="select:font size" title="11px" content="11px">
  371. <meta name="select:font size" title="13px" content="13px">
  372. <meta name="select:font size" title="14px" content="14px">
  373.  
  374. <meta name="select:reblogger avatar filter" title="yes" content="yes">
  375. <meta name="select:reblogger avatar filter" title="no" content="no">
  376.  
  377. <meta name="select:click tags" title="yes" content="yes">
  378. <meta name="select:click tags" title="no" content="no">
  379.  
  380. <!--------- TUMBLR CONTROLS OPTIONS --------->
  381. <meta name="select:tumblr controls color" title="white" content="white">
  382. <meta name="select:tumblr controls color" title="black" content="black">
  383.  
  384. <!--------- TEXT FIELDS --------->
  385. <meta name="text:how to link music" content="linktr.ee/direct_file_links">
  386. <meta name="text:music player song name" content="Wicked Game (&lt;a title=&quot;Ursine Ulpine ft. Annaca&quot;&gt;cover&lt;/a&gt;)">
  387. <meta name="text:music player song mp3" content="https://rhizo.gitlab.io/m/Wicked_Game__Ursine_Ulpine_ft._Annaca_.mp3">
  388.  
  389. <meta name="text:sidebar title" content="desiderium">
  390.  
  391. <meta name="text:customlink 1 name" content="sample link">
  392. <meta name="text:customlink 1 url" content="https://youtube.com/watch?v=tx2LXzM-Q2A">
  393. <meta name="text:customlink 2 name" content="">
  394. <meta name="text:customlink 2 url" content="">
  395. <meta name="text:customlink 3 name" content="">
  396. <meta name="text:customlink 3 url" content="">
  397. <meta name="text:customlink 4 name" content="">
  398. <meta name="text:customlink 4 url" content="">
  399. <meta name="text:customlink 5 name" content="">
  400. <meta name="text:customlink 5 url" content="">
  401. <meta name="text:customlink 6 name" content="">
  402. <meta name="text:customlink 6 url" content="">
  403.  
  404. <!--------------------------------------------------->
  405.  
  406. <style type="text/css">
  407.  
  408. @font-face { font-family: "regis"; src: url('//glen-assets.github.io/fonts/Regis-Semi Bold.ttf'); }
  409.  
  410. @font-face { font-family: "magical source"; src: url('//glen-assets.github.io/fonts/MagicalSource.ttf'); }
  411.  
  412. /*-------- TUMBLR CONTROLS --------*/
  413. iframe#tumblr_controls, .iframe-controls--desktop {
  414. top:5px!important;
  415. right:15px!important;
  416. position:fixed!important;
  417.  
  418. transform:scale(0.7,0.7);
  419. -webkit-transform:scale(0.7,0.7);
  420.  
  421. transform-origin:100% 0;
  422. z-index:999999!important;
  423. visibility:hidden;
  424. opacity:0;
  425. }
  426.  
  427. .tc-black {
  428. filter:invert(100%) hue-rotate(180deg)!important;
  429. -webkit-filter:invert(100%) hue-rotate(180deg)!important;
  430. }
  431.  
  432. .t-opac {
  433. opacity:1!important;
  434. transition:opacity 0.269s ease-in-out;
  435. }
  436.  
  437. /*---- BASIC STYLING ----*/
  438. #s-m-t-tooltip {
  439. padding:5px 10px;
  440. margin:20px;
  441. background-color:{color:post};
  442. border:1px solid {color:post borders outer};
  443. font-family:var(--Heading-Font-Family);
  444. font-size:calc(var(--Body-Font-Size) - 2px);
  445. text-transform:uppercase;
  446. letter-spacing:0.5px;
  447. color:{color:text};
  448. z-index:99;
  449. max-width:40vw;
  450. }
  451.  
  452. body {
  453. margin:0;
  454. background-color:{color:background};
  455. background-image:url('{image:background image}');
  456. background-attachment:fixed;
  457. background-repeat:repeat;
  458. background-position:center;
  459. font-family:var(--Body-Font-Family);
  460. font-size:var(--Body-Font-Size);
  461. color:var(--Body-Text-Color);
  462. overflow:hidden;
  463. overscroll-behavior-y:none;
  464. }
  465.  
  466. a {
  467. text-decoration:none;
  468. color:var(--Link);
  469. }
  470.  
  471. p {
  472. margin:var(--Paragraph-Margins) 0;
  473. }
  474.  
  475. blockquote {
  476. margin:var(--Paragraph-Margins);
  477. margin-right:0;
  478. padding-left:var(--Paragraph-Margins);
  479. border-left:1px solid var(--Blockquote-Border-Color);
  480. }
  481.  
  482. h1, h2, h3, h4, h5, h6 {
  483. margin:var(--Heading-Margins) 0;
  484. font-family:var(--Heading-Font-Family);
  485. font-size:var(--Heading-Font-Size);
  486. text-transform:uppercase;
  487. letter-spacing:1px;
  488. color:{color:accent};
  489. }
  490.  
  491. .post-title {
  492. margin-top:1px;
  493. font-family:magical source;
  494. font-weight:normal;
  495. padding:calc(var(--Heading-Font-Size) - 2px);
  496. border:1px solid {color:post borders inner};
  497. text-align:center;
  498. }
  499.  
  500. img, iframe {
  501. vertical-align:middle;
  502. max-width:100%;
  503. }
  504.  
  505. figure {
  506. margin:0;
  507. }
  508.  
  509. p code {
  510. padding:3px;
  511. border:1px solid {color:post borders inner};
  512. }
  513.  
  514. code, pre {
  515. font-family:cousine;
  516. font-size:calc(var(--Body-Font-Size) - 2px);
  517. }
  518.  
  519. pre {
  520. white-space:pre-wrap;
  521. padding:calc(var(--Post-Padding) - 4px) var(--Post-Padding);
  522. border:1px solid {color:post borders inner};
  523. }
  524.  
  525. hr {
  526. width:69%;
  527. border-width:0px;
  528. height:1px;
  529. background:{color:post borders inner};
  530. }
  531.  
  532. ul, ol {
  533. margin:var(--Paragraph-Margins) 0;
  534. margin-left:1.69em;
  535. padding:0;
  536. }
  537.  
  538. ol li {
  539. padding-left:0.420em;
  540. }
  541.  
  542. ul li {
  543. position:relative;
  544. padding-left:0.25em;
  545. margin-left:calc((var(--Body-Font-Size) * 1.420) - 3px);
  546. list-style:none;
  547. }
  548.  
  549. ul li:before {
  550. content:"";
  551. position:absolute;
  552. margin-top:calc(((var(--Body-Font-Size) * 1.7) / 2) - 0px);
  553. transform:translateY(-50%);
  554. left:0;margin-left:calc((var(--Body-Font-Size) * -1.420) - 3px);
  555. width:var(--Body-Font-Size);
  556. height:.7px;
  557. background:{color:accent};
  558. }
  559.  
  560. ol li::marker {
  561. color:{color:accent};
  562. }
  563.  
  564. .flex {
  565. display:flex;
  566. align-items:center;
  567. }
  568.  
  569. a.read_more {
  570. display:block;
  571. font-family:var(--Heading-Font-Family);
  572. font-size:calc(var(--Heading-Font-Size));
  573. text-transform:uppercase;
  574. letter-spacing:1px;
  575. text-align:center;
  576. }
  577.  
  578. ::selection {
  579. background:{color:text selection background};
  580. color:{color:text selected};
  581. }
  582.  
  583. ::-moz-selection {
  584. background:{color:text selection background};
  585. color:{color:text selected};
  586. }
  587.  
  588. ::-webkit-scrollbar {
  589. width:15px;
  590. height:15px;
  591. background-color:transparent;
  592. }
  593.  
  594. ::-webkit-scrollbar-thumb {
  595. background-clip:padding-box;
  596. background-color:{color:scrollbar};
  597. border:7px solid transparent;
  598. border-top:10px solid transparent;
  599. border-bottom:10px solid transparent;
  600. }
  601.  
  602. ::-webkit-scrollbar-corner {
  603. background:{color:background};
  604. }
  605.  
  606.  
  607. :root {
  608. --Window-Margin:52px;
  609.  
  610. --Paragraph-Margins:1em;
  611. --Heading-Margins:1em;
  612.  
  613. --Body-Font-Family:{select:body font};
  614. --Body-Font-Size:{select:font size};
  615. --Body-Text-Color:{color:text};
  616.  
  617. --Heading-Font-Family:"Vollkorn";
  618. --Heading-Font-Size:calc(var(--Body-Font-Size) + 2px);
  619.  
  620. --Accent:{color:accent};
  621. --Post-Borders-Outer:{color:post borders outer};
  622. --Post-BG:{color:post};
  623.  
  624. --Container-Shift-Value:25px;
  625.  
  626. --Sidebar-Title-Border-Size:2px;
  627.  
  628. /*--------------*/
  629.  
  630. --HexLinks-Icon-Size:16px;
  631. --HexLinks-Icon-Padding:18px;
  632.  
  633. --HexLinks-Spacing:calc({select:sidebar image width} * 0.0269);
  634. --HexLinks-Right-Gap:-10px;
  635.  
  636. /*--------------*/
  637.  
  638. --Description-Border-Size:2px;
  639. --Description-Bottom-Gap:13px;
  640.  
  641. --Custom-Links-Spacing:4px;
  642. --Custom-Links-Per-Row:2;
  643. --Custom-Links-Size:calc(var(--Body-Font-Size) - 4px);
  644. --Custom-Links-Padding:7px;
  645. --Custom-Links-Border-Size:2px;
  646.  
  647. --Post-Width:{select:post width};
  648. --Post-Padding:{select:post padding};
  649. --Post-Spacing:40px;
  650.  
  651. --Reblogger-Avatar-Size:25px;
  652. --Reblogger-Avatar-Gap-Right:8px;
  653. --Reblogger-Username-Color:{color:accent};
  654. --Reblogger-Avatar-Bottom-Gap:12px;
  655.  
  656. --Reblogs-Spacing:15px;
  657. --Reblogs-Border:{color:post borders inner};
  658.  
  659. --Captions-Gap:15px;
  660.  
  661. --Photoset-Spacing:{select:photoset spacing};
  662.  
  663. --NPF-Caption-Spacing:var(--Captions-Gap);
  664. --NPF-Image-Spacing:var(--Photoset-Spacing);
  665.  
  666. --Audio-Post-Album-Size:64px;
  667. --Audio-Post-Album-Right-Gap:13px;
  668. --Audio-Post-Buttons-Size:11px;
  669. --Audio-Post-Buttons-Color:{color:accent};
  670. --Audio-Post-Buttons-Padding:11px;
  671. --Audio-Post-Buttons-Background:{color:post};
  672. --Audio-Post-Info-Background:transparent;
  673. --Audio-Post-Download-Color:{color:accent};
  674.  
  675. --Link:{color:accent};
  676. --Blockquote-Border-Color:{color:post borders inner};
  677.  
  678. --Quote-Font-Size:calc(var(--Body-Font-Size) + 1px);
  679.  
  680. --Tags-Fade-Speed-MS:420;
  681.  
  682. --Post-Buttons-Size:calc(var(--Body-Font-Size));
  683. --Post-Buttons-Color:{color:permalink};
  684. --Like-Button-Liked:{color:like button liked};
  685. --Post-Buttons-Spacing:5.5px;
  686.  
  687. --Notes-User-Avatar-Size:28px;
  688. --Notes-User-Avatar-Gap-Right:7px;
  689. --Notes-Row-Spacing:10px;
  690.  
  691. --Pagination-Color:{color:accent};
  692.  
  693. --TumblrControls-Color:{select:tumblr controls color};
  694.  
  695. /*---- MUSIC PLAYER ----*/
  696. --MusicPlayer-Icon-Size:calc(var(--Body-Font-Size) - 0px);
  697. --MusicPlayer-Icon-Color:{color:accent};
  698. --MusicPlayer-Circle-Background:{color:post};
  699. --MusicPlayer-Circle-Padding:9px;
  700.  
  701. --MusicPlayer-Bar-Length:18px;
  702. --MusicPlayer-Bar-Color:{color:post};
  703.  
  704. --MusicPlayer-Buttons-Size:calc(var(--Body-Font-Size) - 2px);
  705. --MusicPlayer-Buttons-Color:{color:accent};
  706.  
  707. --MusicPlayer-Text-Color:{color:text};
  708.  
  709. --MusicPlayer-Main-Background:{color:post};
  710. --MusicPlayer-Main-Padding:10px;
  711. --MusicPlayer-Main-Roundness:3px;
  712. }
  713.  
  714. [ls="on"] .tout {
  715. visibility:hidden;
  716. opacity:0;
  717. }
  718.  
  719. .tout {
  720. position:absolute;
  721. top:0;left:0;
  722. width:100vw;
  723. height:100vh;
  724. overflow-y:auto;
  725. overflow-x:hidden;
  726. }
  727.  
  728. [ls="off"] .showlah {
  729. animation:none;
  730. }
  731.  
  732. [ls="on"] .showlah {
  733. opacity:1;
  734. animation:fadeinlah .69s ease-in-out;
  735. visibility:visible;
  736. }
  737.  
  738. @keyframes fadeinlah {
  739. from {
  740. opacity:0;
  741. }
  742.  
  743. to {
  744. opacity:1;
  745. }
  746. }
  747.  
  748. .bigcont {
  749. position:absolute;
  750. left:0;right:0;
  751. margin:auto;
  752. width:calc(var(--Post-Width) + (var(--Post-Padding) * 2) + 2px + {select:center gap} + {select:sidebar image width});
  753. height:100vh;
  754. }
  755.  
  756. .sidecont {
  757. position:fixed;
  758. margin-left:var(--Container-Shift-Value);
  759. width:{select:sidebar image width};
  760. height:100vh;
  761. display:flex;
  762. align-items:center;
  763. }
  764.  
  765. .scone {
  766. position:relative;
  767. --H: calc({select:sidebar title font size} + ({select:sidebar title padding} * 2));
  768. margin-top:var(--H);
  769. }
  770.  
  771. .titwrap {
  772. display:flex;
  773. align-items:center;
  774. justify-content:center;
  775. margin-bottom:calc({select:sidebar image margin} + ({select:sidebar image width} * 0.0269));
  776. }
  777.  
  778. .longue {
  779. position:relative;
  780. margin-left:calc(0px - ({select:sidebar image width} * 0.0420));
  781. width:{select:sidebar title width};
  782. height:calc({select:sidebar title font size} + ({select:sidebar title padding} * 2));
  783. --DV: calc({select:sidebar title font size} * 1.269);
  784. }
  785.  
  786. .crown-abs {
  787. position:absolute;
  788. top:0;left:0;
  789. margin-top:calc(0px - var(--H) - var(--Sidebar-Title-Border-Size) + (var(--H) * 0.085));
  790. width:100%;
  791. height:100%;
  792. -webkit-mask-size:contain;
  793. -webkit-mask-repeat:no-repeat;
  794. -webkit-mask-position:center;
  795. -webkit-mask-image:var(--crown);
  796. background:linear-gradient(to right, {color:sidebar title border 1} 30%, {color:sidebar title border 2}, {color:sidebar title border 1} 70%);
  797. }
  798.  
  799. .doz {
  800. position:absolute;
  801. left:0;right:0;
  802. top:calc(0px - var(--Sidebar-Title-Border-Size) - 4px);
  803. display:block;
  804. margin:auto;
  805. width:5px;
  806. height:5px;
  807. background:{color:sidebar title border 2};
  808. border-radius:100%;
  809. z-index:2;
  810. }
  811.  
  812. .rectang {
  813. width:100%;
  814. height:100%;
  815. -webkit-clip-path: polygon(var(--DV) 0px, calc(100% - var(--DV)) 0px, 100% 50%, calc(100% - var(--DV)) 100%, var(--DV) 100%, 0px 50%);
  816. background:{color:sidebar title background};
  817. display:flex;
  818. align-items:center;
  819. justify-content:center;
  820. box-shadow:inset 0 0 {select:sidebar title padding} {color:sidebar title shadow};
  821. }
  822.  
  823. .stit {
  824. width:calc(100% - calc(var(--DV) * 3));
  825. font-family:regis;
  826. font-size:{select:sidebar title font size};
  827. text-transform:uppercase;
  828. letter-spacing:1.5px;
  829. color:{color:sidebar title};
  830. text-align:center;
  831. white-space:nowrap;
  832. overflow:hidden;
  833. text-shadow:1px 1px 1px rgba({RGBcolor:sidebar title shadow},0.8);
  834. }
  835.  
  836. .recback {
  837. position:absolute;
  838. top:0;margin-top:calc(0px - var(--Sidebar-Title-Border-Size));
  839. left:0;margin-left:calc(0px - (var(--Sidebar-Title-Border-Size) * 2));
  840. width:calc(100% + (var(--Sidebar-Title-Border-Size) * 4));
  841. height:calc(100% + (var(--Sidebar-Title-Border-Size) * 2));
  842.  
  843. --DV: calc(({select:sidebar title font size} * 1.269) + var(--Sidebar-Title-Border-Size));
  844.  
  845. -webkit-clip-path: polygon(var(--DV) 0px, calc(100% - var(--DV)) 0px, 100% 50%, calc(100% - var(--DV)) 100%, var(--DV) 100%, 0px 50%);
  846. background:{color:sidebar title border 1};
  847. z-index:-1;
  848. }
  849.  
  850. /*-------------------------------------------*/
  851. .despair {
  852. position:relative;
  853. width:{select:sidebar image width};
  854. height:{select:sidebar image width};
  855. margin:calc(0px - ({select:sidebar image width} * 0.04)) 0;
  856. }
  857.  
  858. .sidehoe {
  859. position:absolute;
  860. top:0;margin-top:calc(0px - ({select:sidebar image width} * 0.02));
  861. height:100%;
  862. display:table;
  863. right:0;margin-right:calc(100% + var(--HexLinks-Right-Gap));
  864. }
  865.  
  866. .livid {
  867. display:table-cell;
  868. vertical-align:middle;
  869. }
  870.  
  871. .un-lyn {
  872. position:relative;
  873. display:block;
  874. width:calc(var(--HexLinks-Icon-Size) + (var(--HexLinks-Icon-Padding) * 2));
  875. height:calc(var(--HexLinks-Icon-Size) + (var(--HexLinks-Icon-Padding) * 2));
  876. z-index:3;
  877. }
  878.  
  879. .un-lyn + .un-lyn {
  880. margin-top:var(--HexLinks-Spacing);
  881. }
  882.  
  883. /*-----------------------------------------*/
  884.  
  885. /* exactly 4 hexlinks */
  886. /* do something to the TOP and BOTTOM ones */
  887. .un-lyn:first-child:nth-last-child(4), /* selects the first child */
  888. .un-lyn:first-child:nth-last-child(4) ~ .un-lyn:nth-child(4) {
  889. margin-left:20px;
  890. }
  891.  
  892. .un-lyn:first-child:nth-last-child(4) {
  893. margin-bottom:calc(0px - (var(--HexLinks-Spacing) / 3));
  894. }
  895.  
  896. .un-lyn:first-child:nth-last-child(4) ~ .un-lyn:nth-child(4){
  897. margin-top:calc(var(--HexLinks-Spacing) / 3);
  898. }
  899.  
  900. /*-----------------------------------------*/
  901.  
  902. .hex-bg {
  903. position:absolute;
  904. top:0;left:0;
  905. width:100%;
  906. height:100%;
  907. -webkit-mask-repeat:no-repeat;
  908. -webkit-mask-size:contain;
  909. -webkit-mask-position:center;
  910. -webkit-mask-image:var(--squazre);
  911. background:{color:navlinks background};
  912. z-index:1;
  913. }
  914.  
  915. .hex-fg {
  916. position:absolute;
  917. top:0;left:0;
  918. width:100%;
  919. height:100%;
  920. -webkit-mask-repeat:no-repeat;
  921. -webkit-mask-size:contain;
  922. -webkit-mask-position:center;
  923. -webkit-mask-image:var(--fancyframe);
  924. background:{color:navlinks border};
  925. z-index:2;
  926. }
  927.  
  928. .nav-tt {
  929. --dududu: calc(var(--HexLinks-Icon-Size) + (var(--HexLinks-Icon-Padding) * 2));
  930. --duduheight: calc(var(--dududu) * 0.420);
  931. --dudufontsize: calc(var(--Body-Font-Size) - 4px);
  932. --dudupont: calc((var(--duduheight) - var(--dudufontsize)) / 2);
  933. position:absolute;
  934. top:0;margin-top:50%;transform:translateY(-50%);
  935. right:0;margin-right:calc(100% - (var(--dududu) * 0.69));
  936. text-align:right;
  937. white-space:nowrap;
  938. height:calc(var(--duduheight) - 2px);
  939. padding-right:calc((var(--dududu) * 0.2) + (var(--dudupont) * 0.8));
  940. padding-left:calc(var(--dudupont) + 2px);
  941. background:{color:navlinks background};
  942. font-family:vollkorn;
  943. font-size:var(--dudufontsize);
  944. text-transform:uppercase;
  945. letter-spacing:.7px;
  946. color:{color:navlinks icon};
  947. display:grid;
  948. align-items:center;
  949. border:1px solid {color:navlinks border};
  950. border-right:none;
  951. border-radius:3px 0 0 3px;
  952. visibility:hidden;
  953. opacity:0;
  954. transition:visibility 0.269s 0s ease-in-out, opacity 0.269s ease-in-out, margin-right 0.269s ease-in-out;
  955. }
  956.  
  957. .un-lyn:hover .nav-tt {
  958. visibility:visible;
  959. margin-right:calc(100% - (var(--dududu) * 0.2));
  960. opacity:1;
  961. }
  962.  
  963. .spectre {
  964. position:absolute;
  965. top:0;left:0;
  966. width:100%;
  967. height:100%;
  968. display:grid;
  969. place-items:center;
  970. z-index:3;
  971. }
  972.  
  973. .spectre [class^="ph-"]{
  974. font-size:var(--HexLinks-Icon-Size);
  975. color:{color:navlinks icon};
  976. }
  977.  
  978. .tresglen {
  979. width:calc(var(--HexLinks-Icon-Size) - 1.5px);
  980. height:calc(var(--HexLinks-Icon-Size) - 1.5px);
  981. -webkit-mask-repeat:no-repeat;
  982. -webkit-mask-size:contain;
  983. -webkit-mask-position:center;
  984. -webkit-mask-image:var(--glenlogo);
  985. background:{color:navlinks icon};
  986. }
  987.  
  988. /*------------------------*/
  989.  
  990. .leafcont {
  991. position:relative;
  992. width:100%;
  993. height:100%;
  994. }
  995.  
  996. .leaf-fg, .leaves-inside, .leaves-outside {
  997. position:absolute;
  998. top:0;left:0;
  999. width:100%;
  1000. height:100%;
  1001. -webkit-mask-size:contain;
  1002. -webkit-mask-position:center;
  1003. -webkit-mask-repeat:no-repeat;
  1004. }
  1005.  
  1006. .leaf-fg {
  1007. -webkit-mask-image:var(--leaf-outline);
  1008. background:linear-gradient(to bottom left, {color:sidebar frame darker}, {color:sidebar frame main}, {color:sidebar frame darker});
  1009. z-index:10;
  1010. }
  1011.  
  1012. .leaves-inside {
  1013. -webkit-mask-image:var(--leaves-inside);
  1014. background:{color:sidebar frame leaves};
  1015. opacity:calc(1 - {select:sidebar inner leaves transparency});
  1016. z-index:9;
  1017. }
  1018.  
  1019. .leaves-outside {
  1020. -webkit-mask-image:var(--leaves-outside);
  1021. background:{color:sidebar frame leaves};
  1022. opacity:calc(1 - {select:sidebar outer leaves transparency});
  1023. z-index:9;
  1024. }
  1025.  
  1026. .coport {
  1027. position:absolute;
  1028. top:0;
  1029. left:0;
  1030. width:100%;
  1031. height:100%;
  1032. display:flex;
  1033. align-items:center;
  1034. }
  1035.  
  1036. .corcle {
  1037. position:relative;
  1038. margin-left:1.5%;
  1039. margin-top:-2.6%;
  1040. width:86.75%;
  1041. height:86.75%;
  1042. border-radius:100%;
  1043. background-image:url('{image:sidebar image}');
  1044. background-size:cover;
  1045. background-repeat:no-repeat;
  1046. background-position:center;
  1047. }
  1048.  
  1049. .doomie {
  1050. position:absolute;
  1051. top:0;left:0;
  1052. width:100%;
  1053. height:100%;
  1054. border-radius:100%;
  1055. z-index:12;
  1056. }
  1057.  
  1058. .fig-light {
  1059. position:absolute;
  1060. top:0;left:0;
  1061. width:100%;
  1062. height:100%;
  1063. border-radius:100%;
  1064. background:linear-gradient(to bottom right, rgba({RGBcolor:sidebar image glow},0.420) -1%, transparent 50%);
  1065. }
  1066.  
  1067. .fig-back {
  1068. position:absolute;
  1069. top:0;left:0;
  1070. width:100%;
  1071. height:100%;
  1072. border-radius:100%;
  1073. background:{color:sidebar image background};
  1074. z-index:-3;
  1075. }
  1076.  
  1077. .fig-shad {
  1078. position:absolute;
  1079. top:0;left:0;
  1080. width:100%;
  1081. height:100%;
  1082. border-radius:100%;
  1083. box-shadow:inset 0 0 calc({select:sidebar image width} * 0.069) {color:sidebar image shadow};
  1084. z-index:0;
  1085. }
  1086.  
  1087. .deskarea {
  1088. margin:auto;
  1089. margin-top:{select:sidebar image margin};
  1090. width:{select:sidebar desc width};
  1091.  
  1092. }
  1093.  
  1094. .miel {
  1095. margin-left:calc({select:sidebar image width} * -0.02);
  1096. --Arrow-Size:calc(var(--Description-Border-Size) + {select:sidebar desc font size});
  1097. margin-top:calc(0px - var(--Arrow-Size));
  1098. }
  1099.  
  1100. .dt {
  1101. position:relative;
  1102. margin:auto;
  1103. margin-bottom:calc(0px - var(--Description-Border-Size));
  1104. width:var(--Arrow-Size);
  1105. height:var(--Arrow-Size);
  1106. z-index:2;
  1107. }
  1108.  
  1109. .desctri-a {
  1110. width:100%;
  1111. height:100%;
  1112. -webkit-mask-size:contain;
  1113. -webkit-mask-repeat:no-repeat;
  1114. -webkit-mask-position:center;
  1115. -webkit-mask-image:var(--triangu);
  1116. background:{color:sidebar desc background 1};
  1117. padding-bottom:var(--Description-Border-Size);
  1118. }
  1119.  
  1120. .desctri-b {
  1121. position:absolute;
  1122. bottom:0;
  1123. left:0;margin-left:calc(0px - var(--Description-Border-Size));
  1124. width:calc(100% + (var(--Description-Border-Size) * 2));
  1125. height:calc(100% + (var(--Description-Border-Size) * 2));
  1126. -webkit-mask-size:contain;
  1127. -webkit-mask-repeat:no-repeat;
  1128. -webkit-mask-position:center;
  1129. -webkit-mask-image:var(--triangu);
  1130. background:{color:sidebar desc border 1};
  1131. z-index:-1;
  1132. }
  1133.  
  1134. .db-out {
  1135. position:relative;
  1136. margin-top:calc(var(--Description-Border-Size));
  1137. }
  1138.  
  1139. .db-out:before {
  1140. content:"";
  1141. position:absolute;
  1142. top:0;margin-top:calc(0px - var(--Description-Border-Size));
  1143. left:0;margin-left:calc(0px - var(--Description-Border-Size));
  1144. width:calc(100% + (var(--Description-Border-Size) * 2));
  1145. height:calc(100% + (var(--Description-Border-Size) * 2));
  1146. background:linear-gradient(to bottom, {color:sidebar desc border 1}, {color:sidebar desc border 2});
  1147. z-index:-1;
  1148. }
  1149.  
  1150. .descbox {
  1151. padding:{select:sidebar desc padding};
  1152. background:linear-gradient(to bottom, {color:sidebar desc background 1}, {color:sidebar desc background 2});
  1153. font-family:{select:sidebar desc font family};
  1154. font-size:calc(var(--Body-Font-Size) + 1px);
  1155. color:{color:sidebar desc};
  1156. text-shadow:1px 1px 1px {color:sidebar desc background 1};
  1157. box-shadow:inset 0 0 {select:sidebar desc padding} {color:sidebar desc background 1};
  1158. text-align:{select:sidebar desc text align};
  1159. line-height:130%;
  1160. }
  1161.  
  1162. .db-out, .db-out:before, .descbox {
  1163. border-radius:4px;
  1164. }
  1165.  
  1166. .custard {
  1167. margin-top:var(--Description-Bottom-Gap);
  1168. margin-left:calc(0px - var(--Description-Border-Size));
  1169. width:calc(100% + (var(--Description-Border-Size) * 2));
  1170. }
  1171.  
  1172. .creme {
  1173. display:flex;
  1174. flex-wrap:wrap;
  1175. margin-top:calc(var(--Custom-Links-Spacing) * -1);
  1176. margin-left:calc(var(--Custom-Links-Spacing) * -1);
  1177. width:calc(100% + (var(--Custom-Links-Spacing) * 2));
  1178. }
  1179.  
  1180. .un-custo {
  1181. display:block;
  1182. margin:var(--Custom-Links-Spacing);
  1183. width:calc((100% / var(--Custom-Links-Per-Row)) - (var(--Custom-Links-Spacing) * 2));
  1184. background:linear-gradient(to bottom right, {color:customlinks border 1}, {color:customlinks border 2});
  1185. }
  1186.  
  1187. .un-custo > span {
  1188. display:flex;
  1189. align-items:center;
  1190. justify-content:center;
  1191. position:relative;
  1192. margin-top:var(--Custom-Links-Border-Size);
  1193. margin-left:var(--Custom-Links-Border-Size);
  1194. width:calc(100% - (var(--Custom-Links-Border-Size) * 2));
  1195. padding:calc(var(--Custom-Links-Padding) - 2px) var(--Custom-Links-Padding);
  1196. height:calc(100% - (var(--Custom-Links-Border-Size) * 2));
  1197. background:linear-gradient(to bottom, {color:customlinks background 1}, {color:customlinks background 2});
  1198. font-family:lora;
  1199. font-size:var(--Custom-Links-Size);
  1200. text-transform:uppercase;
  1201. letter-spacing:1px;
  1202. word-spacing:-.3px;
  1203. color:{color:customlinks text};
  1204. text-shadow:1px 1px 1px {color:customlinks background 1};
  1205. text-align:center;
  1206. box-sizing:border-box;
  1207. overflow:hidden;
  1208. z-index:2;
  1209. }
  1210.  
  1211. .un-custo > span > span {
  1212. position:relative;
  1213. display:block;
  1214. width:100%;
  1215. margin-bottom:var(--Custom-Links-Border-Size);
  1216. }
  1217.  
  1218. .un-custo, .un-custo > span, .un-cust > span > span:after {
  1219. border-radius:2px;
  1220. }
  1221.  
  1222. .un-custo > span > span:after {
  1223. content:"";
  1224. position:absolute;
  1225. bottom:0;margin-bottom:calc(0px - (var(--Custom-Links-Padding) * 2) + var(--Custom-Links-Border-Size));
  1226. left:0;margin-left:calc(0px - var(--Custom-Links-Padding));
  1227. width:calc(100% + (var(--Custom-Links-Padding) * 2));
  1228. height:calc(100% + (var(--Custom-Links-Padding) * 4));
  1229. background:linear-gradient(to bottom, transparent 25%, rgba({RGBcolor:customlinks hover glow},0.69));
  1230. opacity:0;
  1231. transition:opacity .25s ease-in-out;
  1232. z-index:-1;
  1233. }
  1234.  
  1235. .un-custo:hover > span > span:after {
  1236. opacity:1;
  1237. }
  1238.  
  1239. .thingleft {
  1240. position:fixed;
  1241. top:0;left:0;
  1242. width:15px;
  1243. height:100vh;
  1244. background:{color:left bar 1};
  1245. border-right:10px solid {color:left bar 2};
  1246. z-index:5;
  1247. }
  1248.  
  1249. /*---- POST CONTAINER ----*/
  1250. .postscont {
  1251. position:absolute;
  1252. right:0;margin-right:calc(0px - var(--Container-Shift-Value));
  1253. }
  1254.  
  1255. .onepost:first-child {
  1256. margin-top:var(--Window-Margin);
  1257. }
  1258.  
  1259. .onepost {
  1260. width:calc(var(--Post-Width) + (var(--Post-Padding) * 2));
  1261. }
  1262.  
  1263. .cartel {
  1264. padding:var(--Post-Padding);
  1265. background:{color:post};
  1266. border:1px solid {color:post borders outer};
  1267. overflow:hidden;
  1268. }
  1269.  
  1270. .onepost + .onepost {
  1271. margin-top:var(--Post-Spacing);
  1272. }
  1273.  
  1274. .onepost:last-child {
  1275. margin-bottom:var(--Window-Margin);
  1276. }
  1277.  
  1278. .postinner, .notescont li.reply, .notescont li.with_commentary {
  1279. line-height:1.7em;
  1280. }
  1281.  
  1282. .corps a:not([class]), .descbox a, ol.notes a[class*="tumblelog"]{
  1283. padding-bottom:1px;
  1284. border-bottom:1px solid rgba({RGBcolor:accent},0.420);
  1285. }
  1286.  
  1287. .songtext a {
  1288. cursor:help;
  1289. padding-bottom:.5px;
  1290. border-bottom:1px solid rgba({RGBcolor:accent},0.25);
  1291. }
  1292.  
  1293. /*---- REBLOG HEAD ----*/
  1294. .reblog-wrap {
  1295. margin:0 calc(0px - var(--Post-Padding));
  1296. padding:0 var(--Post-Padding);
  1297. }
  1298.  
  1299. .reblog-wrap + .reblog-wrap {
  1300. margin-top:var(--Reblogs-Spacing);
  1301. padding-top:var(--Reblogs-Spacing);
  1302. border-top:1px solid var(--Reblogs-Border);
  1303. }
  1304.  
  1305. .reblog-head {
  1306. display:flex;
  1307. align-items:center;
  1308. }
  1309.  
  1310. .rbr-imgw {
  1311. position:relative;
  1312. width:var(--Reblogger-Avatar-Size);
  1313. height:var(--Reblogger-Avatar-Size);
  1314. border-radius:3px;
  1315. overflow:hidden;
  1316. }
  1317.  
  1318. .rbr-imgw:before {
  1319. content:"";
  1320. position:absolute;
  1321. top:0;left:0;
  1322. width:100%;
  1323. height:100%;
  1324. z-index:2;
  1325. }
  1326.  
  1327. [reblogger-filter='yes'] .rbr-imgw:before {
  1328. background:rgba({RGBcolor:post},0.420);
  1329. }
  1330.  
  1331. .rbr-imgw img {
  1332. width:100%;
  1333. height:100%;
  1334. }
  1335.  
  1336. [reblogger-filter='yes'] .rbr-imgw img {
  1337. filter:contrast(150%) saturate(125%) brightness(115%);
  1338. }
  1339.  
  1340. .rbr-imgw + .reblog-url {
  1341. margin-left:var(--Reblogger-Avatar-Gap-Right);
  1342. }
  1343.  
  1344. .reblog-url, .reblog-url a {
  1345. font-family:lora;
  1346. font-size:calc(var(--Body-Font-Size) - 2px);
  1347. text-transform:uppercase;
  1348. letter-spacing:.7px;
  1349. color:var(--Reblogger-Username-Color);
  1350. }
  1351.  
  1352. .reblog-url .deac {
  1353. margin-left:3px;
  1354. color:var(--Body-Text-Color);
  1355. }
  1356.  
  1357. .nosrc {
  1358. margin-bottom:var(--Reblogger-Avatar-Bottom-Gap);
  1359. }
  1360.  
  1361. .reblog-head + .reblog-comment {
  1362. margin-top:calc(0px - var(--Paragraph-Margins) + var(--Reblogger-Avatar-Bottom-Gap));
  1363. }
  1364.  
  1365. /*---- NPF... STUFF ----*/
  1366. figure[data-orig-src] + figure[data-orig-src]{
  1367. margin-top:var(--Photoset-Spacing);
  1368. }
  1369.  
  1370. .tmblr-full video {
  1371. cursor:pointer;
  1372. }
  1373.  
  1374. video::-webkit-media-controls-panel {
  1375. position:absolute;
  1376. bottom:0;
  1377. background:transparent!important;
  1378. width:100%;
  1379. box-sizing:border-box;
  1380. opacity:1!important;
  1381. }
  1382.  
  1383. video::-webkit-media-controls-volume-slider, video::-webkit-media-controls-timeline {
  1384. display:none!important;
  1385. }
  1386.  
  1387. .npf-link-block {
  1388. margin-bottom:0;
  1389. border-color:{color:post borders inner}!important;
  1390. border-radius:0!important;
  1391. }
  1392.  
  1393. .npf-link-block + * {
  1394. margin-bottom:var(--Paragraph-Margins);
  1395. }
  1396.  
  1397. .npf-link-block a {
  1398. padding:0!important;
  1399. border:none!important;
  1400. }
  1401.  
  1402. .npf-link-block .title {
  1403. font-family:var(--Heading-Font-Family)!important;
  1404. font-size:calc(var(--Heading-Font-Size) + 4px);
  1405. text-transform:uppercase;
  1406. letter-spacing:.5px;
  1407. color:{color:accent}!important;
  1408. line-height:1.7em!important;
  1409. text-shadow:1px 1px 1px rgba(0,0,0,0.1);
  1410. }
  1411.  
  1412. .npf-link-block .description {
  1413. font-family:var(--Heading-Font-Family)!important;
  1414. font-weight:bold;
  1415. font-size:var(--Heading-Font-Size);
  1416. text-transform:uppercase;
  1417. letter-spacing:.5px;
  1418. color:{color:accent}!important;
  1419. line-height:1.7em!important;
  1420. }
  1421.  
  1422. .npf-link-block .site-name {
  1423. text-transform:initial!important;
  1424. font-family:var(--Body-Font-Family)!important;
  1425. font-weight:normal!important;
  1426. font-size:var(--Body-Font-Size)!important;
  1427. }
  1428.  
  1429. .npf-link-block .description + .site-name {
  1430. margin-top:-4px;
  1431. }
  1432.  
  1433. [post-type="text"] .source-head + .corps > .chatwrap:first-child,
  1434. [post-type="text"] .source-head + .corps > [data-npf*="audio"]:first-child {
  1435. margin-top:var(--Captions-Gap);
  1436. }
  1437.  
  1438. /*---- PHOTO POSTS ----*/
  1439. .nosrc + .single-photo .photopic {
  1440. margin-top:0;
  1441. }
  1442.  
  1443. .single-photo {
  1444. cursor:pointer;
  1445. }
  1446.  
  1447. .nosrc + .reblog-comment .photoset-grid {
  1448. margin-top:0!important;
  1449. }
  1450.  
  1451. [photoset-layout] {
  1452. grid-gap:var(--Photoset-Spacing);
  1453. }
  1454.  
  1455. [photoset-layout] div {
  1456. cursor:pointer;
  1457. backface-visibility:hidden;
  1458. }
  1459.  
  1460. .caption {
  1461. margin-top:var(--Captions-Gap);
  1462. }
  1463.  
  1464. /*----- LIGHTBOX BS -----*/
  1465. .tmblr-lightbox, #tumblr_lightbox {
  1466. background-color:rgba({RGBcolor:post},0.69)!important;
  1467. }
  1468.  
  1469. .tmblr-lightbox .vignette {
  1470. background-image:none!important;
  1471. }
  1472.  
  1473. #vignette {display:none!important}
  1474.  
  1475. .lightbox-image, #tumblr_lightbox_left_image, #tumblr_lightbox_center_image, #tumblr_lightbox_right_image {
  1476. }
  1477.  
  1478. .tmblr-lightbox img, #tumblr_lightbox img {
  1479. margin-top:calc(0px - var(--Post-Padding));
  1480. max-width:initial;
  1481. box-shadow:none!important;
  1482. border-radius:0px!important;
  1483. padding:var(--Post-Padding);
  1484. background:{color:post}!important;
  1485. border:1px solid {color:post borders outer}!important;
  1486. }
  1487.  
  1488. /*---- LINK POSTS ----*/
  1489. .linkpath {
  1490. display:flex;
  1491. align-items:center;
  1492. margin-top:calc(0px - var(--Post-Padding));
  1493. margin-left:calc(0px - var(--Post-Padding));
  1494. width:calc(100% + (var(--Post-Padding) * 2));
  1495. border-bottom:1px solid {color:post borders inner};
  1496. font-family:var(--Heading-Font-Family);
  1497. font-size:calc(var(--Heading-Font-Size) - 1px);
  1498. text-transform:uppercase;
  1499. letter-spacing:.5px;
  1500. }
  1501.  
  1502. .linkpath [class^="ph"]{
  1503. display:block;
  1504. padding:var(--Post-Padding);
  1505. font-size:calc(var(--Reblogger-Avatar-Size) - 3px);
  1506. height:calc(var(--Reblogger-Avatar-Size) - 3px);
  1507. line-height:1em;
  1508. color:{color:accent};
  1509. }
  1510.  
  1511. .linkpath span {
  1512. display:block;
  1513. align-self:stretch;
  1514. display:grid;
  1515. align-items:center;
  1516. padding:var(--Post-Padding);
  1517. border-left:1px solid {color:post borders inner};
  1518. }
  1519.  
  1520. .linkpath + * {
  1521. margin-top:var(--Post-Padding);
  1522. }
  1523.  
  1524. * + .link-excerpt {
  1525. margin-top:var(--Post-Padding);
  1526. }
  1527.  
  1528. .link-excerpt {
  1529. padding:calc(var(--Post-Padding) - 2px) var(--Post-Padding);
  1530. border:1px solid {color:post borders inner};
  1531. }
  1532.  
  1533. .site-host {
  1534. font-family:var(--Heading-Font-Family);
  1535. letter-spacing:1px;
  1536. text-transform:uppercase;
  1537. font-size:calc(var(--Body-Font-Size) - 1.5px);
  1538. color:{color:accent};
  1539. }
  1540.  
  1541. .linkpath + .npf_inst {
  1542. margin-top:var(--Post-Padding);
  1543. }
  1544.  
  1545. .linkwrap + .link-description > .reblog-wrap:first-of-type {
  1546. margin-top:var(--Captions-Gap);
  1547. }
  1548.  
  1549. /*----- QUOTE POSTS -----*/
  1550. .quote-words {
  1551. padding:0 var(--Post-Padding);
  1552. font-family:var(--Heading-Font-Family);
  1553. font-size:var(--Quote-Font-Size);
  1554. text-transform:uppercase;
  1555. letter-spacing:.7px;
  1556. word-spacing:.3px;
  1557. text-align:center;
  1558. line-height:169%;
  1559. }
  1560.  
  1561. .quote-words + .quote-source {
  1562. margin-top:var(--Paragraph-Margins);
  1563. }
  1564.  
  1565. .quote-source {
  1566. text-align:center;
  1567. }
  1568.  
  1569. /*----- VIDEO POSTS -----*/
  1570. .nosrc + .tmblr-video {
  1571. margin-top:0!important;
  1572. }
  1573.  
  1574. .tmblr-video {
  1575. max-width:initial;
  1576. }
  1577.  
  1578. .tumblr_video_container, .tumblr_video_iframe {
  1579. width:100%!important;
  1580. }
  1581.  
  1582. /*---- CHAT POSTS ----*/
  1583. .chatwrap {
  1584. border:1px solid var(--Blockquote-Border-Color);
  1585. }
  1586.  
  1587. .chat_row {
  1588. position:relative;
  1589. display:table-row;
  1590. overflow:hidden;
  1591. }
  1592.  
  1593. .chat_row:after {
  1594. content:"";
  1595. position:absolute;
  1596. bottom:0;left:0;
  1597. transform:translateY(-.5px);
  1598. width:100%;
  1599. height:1px;
  1600. background:var(--Blockquote-Border-Color);
  1601. }
  1602.  
  1603. .chatwrap .chat_row:last-child:after {
  1604. display:none;
  1605. }
  1606.  
  1607. .chat_label {
  1608. white-space:nowrap;
  1609. font-family:var(--Heading-Font-Family);
  1610. font-size:calc(var(--Body-Font-Size) - 2px);
  1611. text-transform:uppercase;
  1612. letter-spacing:.5px;
  1613. }
  1614.  
  1615. .chat_content {
  1616. width:100%;
  1617. }
  1618.  
  1619. .chat_label, .chat_content {
  1620. display:table-cell;
  1621. padding:0.69em;
  1622. }
  1623.  
  1624. .chat_label + .chat_content {
  1625. border-left:1px solid var(--Blockquote-Border-Color);
  1626. }
  1627.  
  1628. /*---- AUDIO POSTS ----*/
  1629. .audio-post .npf_inst img {
  1630. width:100%;
  1631. }
  1632.  
  1633. .aud-emb {display:none}
  1634.  
  1635. .audiowrap, .npf-audio-wrapper {
  1636. display:flex;
  1637. align-items:center;
  1638. margin-top:calc(0px - var(--Post-Padding));
  1639. margin-left:calc(0px - var(--Post-Padding));
  1640. width:calc(100% + (var(--Post-Padding) * 2));
  1641. border-bottom:1px solid {color:post borders inner};
  1642. }
  1643.  
  1644. .audiowrap:only-child {
  1645. margin-bottom:calc(0px - var(--Post-Padding) - 1px);
  1646. }
  1647.  
  1648. p + .audiowrap {
  1649. margin-top:initial!important;
  1650. margin-left:initial!important;
  1651. width:initial!important;
  1652. border:1px solid {color:post borders inner};
  1653. }
  1654.  
  1655. p + .audiowrap:only-child {
  1656. margin-bottom:0;
  1657. }
  1658.  
  1659. .albumwrap {
  1660. position:relative;
  1661. width:var(--Audio-Post-Album-Size);
  1662. height:var(--Audio-Post-Album-Size);
  1663. display:flex;
  1664. align-items:center;
  1665. justify-content:center;
  1666. border-right:1px solid {color:post borders inner};
  1667. }
  1668.  
  1669. .albumwrap[has-cover] .audplac {display:none}
  1670.  
  1671. .butts {
  1672. width:calc(var(--Audio-Post-Buttons-Size) + (var(--Audio-Post-Buttons-Padding) * 2));
  1673. height:calc(var(--Audio-Post-Buttons-Size) + (var(--Audio-Post-Buttons-Padding) * 2));
  1674. background:var(--Audio-Post-Buttons-Background);
  1675. border:1px solid {color:post borders inner};
  1676. border-radius:100%;
  1677. display:flex;
  1678. align-items:center;
  1679. justify-content:center;
  1680. cursor:pointer;
  1681. z-index:2;
  1682. }
  1683.  
  1684. .overplay, .overpause {
  1685. width:var(--Audio-Post-Buttons-Size);
  1686. height:var(--Audio-Post-Buttons-Size);
  1687. -webkit-mask-size:contain;
  1688. -webkit-mask-repeat:no-repeat;
  1689. -webkit-mask-position:center;
  1690. background:var(--Audio-Post-Buttons-Color);
  1691. }
  1692.  
  1693. .overplay {
  1694. margin-left:2px;
  1695. -webkit-mask-image:var(--audioplay);
  1696. }
  1697.  
  1698. .overpause {
  1699. display:none;
  1700. -webkit-mask-image:var(--audiopause);
  1701. }
  1702.  
  1703. .ov-y {display:block}
  1704. .ov-z {display:none}
  1705.  
  1706. .audplac {
  1707. position:absolute;
  1708. top:0;left:0;
  1709. width:var(--Audio-Post-Album-Size);
  1710. height:var(--Audio-Post-Album-Size);
  1711. background:var(--Audio-Post-Buttons-Background);
  1712. }
  1713.  
  1714. .albumwrap img {
  1715. position:absolute;
  1716. top:0;left:0;
  1717. width:100%;
  1718. height:100%;
  1719. }
  1720.  
  1721. .audiotxt {
  1722. flex:1;
  1723. height:var(--Audio-Post-Album-Size);
  1724. padding:var(--Audio-Post-Album-Right-Gap);
  1725. background:var(--Audio-Post-Info-Background);
  1726. display:flex;
  1727. align-items:center;
  1728. box-sizing:border-box;
  1729. display:flex;
  1730. align-items:center;
  1731. justify-content:space-between;
  1732. }
  1733.  
  1734. .odin > div + div {
  1735. margin-top:-4px;
  1736. }
  1737.  
  1738. .aud-song-name, .npf-audio-title {
  1739. font-family:var(--Heading-Font-Family);
  1740. font-size:calc(var(--Body-Font-Size) - 1px);
  1741. text-transform:uppercase;
  1742. letter-spacing:.3px;
  1743. }
  1744.  
  1745. .aud-song-name[has-name] .untit {
  1746. display:none;
  1747. }
  1748.  
  1749. .aud-artist[has-artist] .unart {
  1750. display:none;
  1751. }
  1752.  
  1753. .aud-artist, .npf-audio-artist,
  1754. .aud-album-name, .npf-audio-album {
  1755. font-family:arapey;
  1756. letter-spacing:.5px;
  1757. word-spacing:-.5px;
  1758. }
  1759.  
  1760. .inari {
  1761. display:block;
  1762. padding:6px;
  1763. margin-right:-3px;
  1764. cursor:pointer;
  1765. }
  1766.  
  1767. .inari [class^="ph"]{
  1768. font-size:calc(var(--Audio-Post-Buttons-Size) + var(--Audio-Post-Buttons-Padding) - 3px);
  1769. color:var(--Audio-Post-Download-Color);
  1770. }
  1771.  
  1772. .inari, .inari * {
  1773. line-height:1;
  1774. }
  1775.  
  1776. iframe[src*='open.spotify.com'][src*='track'], figure[data-npf*='open.spotify.com'][data-npf*='track']{
  1777. height:80px!important;
  1778. }
  1779.  
  1780. .tmblr-video iframe[src*='soundcloud.com']{
  1781. }
  1782.  
  1783. .audio-soundcloud {
  1784. max-height:113px;
  1785. border-radius:4px;
  1786. overflow:hidden;
  1787. }
  1788.  
  1789. .soundcloud_audio_player {
  1790. margin:-1px;
  1791. margin-bottom:0;
  1792. width:calc(100% + 2px);
  1793. max-width:initial;
  1794. }
  1795.  
  1796. .spotify_audio_player {
  1797. width:100%;
  1798. }
  1799.  
  1800. /*---- ASK/ANSWER POSTS ----*/
  1801. .answer-post .nosrc {
  1802. display:none;
  1803. }
  1804.  
  1805. .une_question {
  1806. }
  1807.  
  1808. .asker-person {
  1809. margin-top:calc(0px - var(--Post-Padding));
  1810. margin-left:calc(0px - var(--Post-Padding));
  1811. width:calc(100% + (var(--Post-Padding) * 2));
  1812. padding:var(--Post-Padding);
  1813. padding-bottom:0;
  1814. border-bottom:1px solid {color:post borders inner};
  1815. }
  1816.  
  1817. .asker-person [class^='ph-']{
  1818. margin-top:calc(0px - var(--Post-Padding));
  1819. margin-left:calc(0px - var(--Post-Padding));
  1820. padding:var(--Post-Padding);
  1821. border-right:1px solid {color:post borders inner};
  1822. margin-right:calc(var(--Post-Padding) - 2px);
  1823. font-size:var(--Reblogger-Avatar-Size);
  1824. color:{color:accent};
  1825. }
  1826.  
  1827. .asker-person .reblog-url {
  1828. display:block;
  1829. margin-top:calc(0px - var(--Post-Padding));
  1830. }
  1831.  
  1832. .answerer + * {
  1833. margin-top:var(--Captions-Gap);
  1834. }
  1835.  
  1836. .une_question + .une_reponse {
  1837. margin-top:var(--Paragraph-Margins);
  1838. }
  1839.  
  1840. /*---- TAGS SECTION ----*/
  1841. .tagsdiv[clicktags="yes"] {
  1842. {block:IndexPage}
  1843. display:none;
  1844. opacity:0;
  1845. transition:opacity 400ms ease-in-out;
  1846. {/block:IndexPage}
  1847. }
  1848.  
  1849. .tagsfade {
  1850. opacity:1!important;
  1851. }
  1852.  
  1853. .tagsin {
  1854. display:flex;
  1855. flex-wrap:wrap;
  1856. justify-content:flex-end;
  1857. margin:-5px;
  1858. margin-top:calc(var(--Captions-Gap) - 5px);
  1859. }
  1860.  
  1861. .tagsin a {
  1862. position:relative;
  1863. display:block;
  1864. margin:5px;
  1865. font-family:var(--Heading-Font-Family);
  1866. font-size:calc(var(--Body-Font-Size) - 2px);
  1867. text-transform:uppercase;
  1868. letter-spacing:.7px;
  1869. }
  1870.  
  1871. .tagsin a:before {
  1872. content:"#";
  1873. font-family:work sans;
  1874. margin-right:.5px;
  1875. }
  1876.  
  1877. /*---- PERMALINK BAR ----*/
  1878. .permadiv {
  1879. margin-top:10px;
  1880. display:flex;
  1881. align-items:center;
  1882. justify-content:space-between;
  1883. padding:calc(var(--Post-Padding) - 2px) var(--Post-Padding);
  1884. background:{color:permalink background};
  1885. border:1px solid {color:permalink border};
  1886. line-height:1em;
  1887. }
  1888.  
  1889. .permaleft, .permaright {
  1890. display:flex;
  1891. align-items:center;
  1892. font-family:magical source;
  1893. font-size:calc(var(--Body-Font-Size) - 2.5px);
  1894. text-transform:uppercase;
  1895. letter-spacing:0.7px;
  1896. color:{color:permalink};
  1897. }
  1898.  
  1899. .permaleft a, .permaright a {
  1900. display:flex;
  1901. align-items:center;
  1902. color:{color:permalink};
  1903. }
  1904.  
  1905. .permaleft [class^="ph"]{
  1906. margin-right:5px;
  1907. font-size:calc(var(--Body-Font-Size) + 5px);
  1908. color:{color:permalink};
  1909. }
  1910.  
  1911. .permaright {
  1912. display:flex;
  1913. align-items:center;
  1914. justify-content:center;
  1915. }
  1916.  
  1917. .int-but {
  1918. display:block;
  1919. position:relative;
  1920. width:var(--Post-Buttons-Size);
  1921. height:var(--Post-Buttons-Size);
  1922. backface-visibility:hidden;
  1923. }
  1924.  
  1925. .permaright span {display:block}
  1926.  
  1927. .int-but + .int-but {
  1928. margin-left:var(--Post-Buttons-Spacing);
  1929. }
  1930.  
  1931. .permaright[clicktags="no"] .clicktags {
  1932. display:none;
  1933. }
  1934.  
  1935. .hash, .rb_icon, .like_icon {
  1936. width:var(--Post-Buttons-Size);
  1937. height:var(--Post-Buttons-Size);
  1938. -webkit-mask-size:contain;
  1939. -webkit-mask-repeat:no-repeat;
  1940. -webkit-mask-position:center;
  1941. background:var(--Post-Buttons-Color);
  1942. }
  1943.  
  1944. .hash {
  1945. margin-top:.5px;
  1946. -webkit-mask-image:var(--hashtag);
  1947. cursor:help;
  1948. }
  1949.  
  1950. .rb_icon {
  1951. -webkit-mask-image:var(--rb-icon);
  1952. transform:scaleX(1.1);
  1953. }
  1954.  
  1955. .like_icon {
  1956. -webkit-mask-image:var(--like-icon);
  1957. }
  1958.  
  1959. .like_button {
  1960. position:absolute;
  1961. top:0;left:0;
  1962. width:100%;
  1963. height:100%;
  1964. z-index:2;
  1965. }
  1966.  
  1967. .like_button iframe {
  1968. width:100%;
  1969. height:100%;
  1970. vertical-align:initial;
  1971. opacity:0;
  1972. }
  1973.  
  1974. .like_button.liked + .like_icon {
  1975. background:var(--Like-Button-Liked);
  1976. }
  1977.  
  1978. /*---- POST NOTES ----*/
  1979. .notescont {
  1980. margin-top:var(--Post-Spacing);
  1981. width:var(--Post-Width);
  1982. padding:var(--Post-Padding);
  1983. background:{color:post};
  1984. margin-bottom:var(--Window-Margin);
  1985. }
  1986.  
  1987. .notescont h1 {
  1988. margin-top:calc(var(--Post-Padding) / 2);
  1989. font-family:magical source;
  1990. font-weight:normal;
  1991. text-align:center;
  1992. }
  1993.  
  1994. .notescont ol.notes {
  1995. padding:0;
  1996. margin:0;
  1997. }
  1998.  
  1999. .notescont li {
  2000. position:relative;
  2001. list-style-type:none;
  2002. }
  2003.  
  2004. .notescont li.like:before {
  2005. content:"\f460"; /* .ph-heart::before */
  2006. vertical-align:middle;
  2007. font-family:"Phosphor"!important;
  2008. font-size:calc(var(--Body-Font-Size) + 2px);
  2009. }
  2010.  
  2011. .notescont li.reblog:before {
  2012. content:"\f57d"; /* .ph-shuffle-angular::before */
  2013. vertical-align:middle;
  2014. font-family:"Phosphor"!important;
  2015. font-size:calc(var(--Body-Font-Size) + 2px);
  2016. }
  2017.  
  2018. .notescont li.with_commentary:before,
  2019. .notescont li.reply:before,
  2020. .notescont li.original_post:before {
  2021. content:"\f332"!important; /* ph-chat-centered-text::before */
  2022. vertical-align:middle;
  2023. font-family:"Phosphor"!important;
  2024. font-size:calc(var(--Body-Font-Size) + 2px);
  2025. }
  2026.  
  2027. .notescont li + li {
  2028. margin-top:var(--Notes-Row-Spacing);
  2029. }
  2030.  
  2031. .notescont .avatar {
  2032. display:none;
  2033. }
  2034.  
  2035. .notescont .avatar_frame + .action {
  2036. margin-left:var(--Notes-User-Avatar-Gap-Right);
  2037. }
  2038.  
  2039. .notescont .action a {
  2040. font-family:lora;
  2041. font-size:calc(var(--Body-Font-Size) - 2.5px);
  2042. text-transform:uppercase;
  2043. letter-spacing:1px;
  2044. }
  2045.  
  2046. .notescont blockquote {
  2047. margin-left:calc(var(--Notes-User-Avatar-Size) / 2);
  2048. padding-left:calc((var(--Notes-User-Avatar-Size) / 2) + var(--Notes-User-Avatar-Gap-Right));
  2049. }
  2050.  
  2051. .more_notes_link_container {
  2052. margin-top:var(--Captions-Gap)!important;
  2053. margin-bottom:calc(var(--Paragraph-Margins) / 2);
  2054. }
  2055.  
  2056. .more_notes_link {
  2057. font-family:var(--Heading-Font-Family);
  2058. text-transform:uppercase;
  2059. letter-spacing:.5px;
  2060. }
  2061.  
  2062. /*-------------- PAGINATION --------------*/
  2063. .botpagi {
  2064. display:flex;
  2065. align-items:center;
  2066. justify-content:space-between;
  2067. width:calc(var(--Post-Width) + (var(--Post-Padding) * 2) + 2px);
  2068. margin-top:var(--Post-Spacing);
  2069. margin-bottom:calc(var(--Window-Margin) - 10px);
  2070. line-height:1em;
  2071. }
  2072.  
  2073. .botpagi a {
  2074. padding:0.69em;
  2075. margin:-0.69em;
  2076. color:var(--Pagination-Color)!important;
  2077. }
  2078.  
  2079. .botpagi span {
  2080. padding:0 4px;
  2081. font-family:magical source;
  2082. font-size:calc(var(--Body-Font-Size) - 2px);
  2083. text-transform:uppercase;
  2084. letter-spacing:.7px;
  2085. }
  2086.  
  2087. .prev-svg {
  2088. margin-top:-.5px;
  2089. width:calc(var(--Body-Font-Size) + 3px);
  2090. height:calc(var(--Body-Font-Size) + 3px);
  2091. -webkit-mask-image:var(--BackSVG);
  2092. -webkit-mask-repeat:no-repeat;
  2093. -webkit-mask-size:contain;
  2094. background:var(--Pagination-Color)
  2095. }
  2096.  
  2097. .next-svg {
  2098. margin-top:-.5px;
  2099. width:calc(var(--Body-Font-Size) + 3px);
  2100. height:calc(var(--Body-Font-Size) + 3px);
  2101. -webkit-mask-image:var(--NextSVG);
  2102. -webkit-mask-repeat:no-repeat;
  2103. -webkit-mask-size:contain;
  2104. background:var(--Pagination-Color)
  2105. }
  2106.  
  2107. .pn {
  2108. margin-left:auto!important;
  2109. }
  2110.  
  2111. /*--- MUSIC PLAYER ---*/
  2112. .mplayer {
  2113. position:fixed;
  2114. bottom:0;margin-bottom:12px;
  2115. left:0;margin-left:40px;
  2116. display:flex;
  2117. align-items:center;
  2118. z-index:10;
  2119. filter:drop-shadow(2px 2px 1px rgba(0,0,0,0.07))
  2120. }
  2121.  
  2122. .zirc {
  2123. position:relative;
  2124. margin-right:-1px;
  2125. padding:var(--MusicPlayer-Circle-Padding);
  2126. background:var(--MusicPlayer-Circle-Background);
  2127. border-radius:100%;
  2128. overflow:hidden;
  2129. z-index:2;
  2130. }
  2131.  
  2132. /* hover stuff */
  2133. .potatowrap {
  2134. opacity:0;
  2135. transition:opacity .420s ease-in-out;
  2136. transition-delay:0s;
  2137. }
  2138.  
  2139. .mplayer:hover .mline {
  2140. width:var(--MusicPlayer-Bar-Length);
  2141. transition-delay:0s; /* delay when mouseleave */
  2142. }
  2143.  
  2144. .mplayer:hover .potatowrap {
  2145. opacity:1;
  2146. transition-delay:.420s;
  2147. }
  2148.  
  2149. .msym, .blay, .bause {
  2150. -webkit-mask-size:contain;
  2151. -webkit-mask-position:center;
  2152. -webkit-mask-repeat:no-repeat;
  2153. }
  2154.  
  2155. .msym {
  2156. width:var(--MusicPlayer-Icon-Size);
  2157. height:var(--MusicPlayer-Icon-Size);
  2158. -webkit-mask-image:var(--nota);
  2159. background:var(--MusicPlayer-Icon-Color);
  2160. }
  2161.  
  2162. .mline {
  2163. margin-right:-3px;
  2164. width:0px;
  2165. height:3px;
  2166. background:var(--MusicPlayer-Bar-Color);
  2167. border-radius:6px;
  2168. transition:width .420s ease-in-out;
  2169. transition-delay:.420s; /* delay when mouseenter */
  2170. }
  2171.  
  2172. .potatowrap {
  2173. display:flex;
  2174. align-items:center;
  2175. padding:calc(var(--MusicPlayer-Main-Padding) - 2px) var(--MusicPlayer-Main-Padding);
  2176. background:var(--MusicPlayer-Main-Background);
  2177. border-radius:var(--MusicPlayer-Main-Roundness);
  2178. }
  2179.  
  2180. .music-controls {
  2181. margin:-6px;
  2182. padding:6px;
  2183. cursor:pointer;
  2184. }
  2185.  
  2186. .blay {
  2187. width:var(--MusicPlayer-Buttons-Size);
  2188. height:var(--MusicPlayer-Buttons-Size);
  2189. background:var(--MusicPlayer-Buttons-Color);
  2190. -webkit-mask-image:var(--blay);
  2191. }
  2192.  
  2193. .bause {
  2194. width:var(--MusicPlayer-Buttons-Size);
  2195. height:var(--MusicPlayer-Buttons-Size);
  2196. background:var(--MusicPlayer-Buttons-Color);
  2197. -webkit-mask-image:var(--bause);
  2198. }
  2199.  
  2200. .songtext {
  2201. margin-left:6px;
  2202. font-family:var(--Heading-Font-Family);
  2203. font-size:calc(var(--Body-Font-Size) - 3px);
  2204. text-transform:uppercase;
  2205. letter-spacing:.5px;
  2206. color:var(--MusicPlayer-Text-Color);
  2207. }
  2208.  
  2209. .pausee {display:none;}
  2210.  
  2211. .beff {display:none;}
  2212. .aff {display:block;}
  2213.  
  2214. /*---- LOADING SCREEN ----*/
  2215. [ls="off"] .overload {
  2216. display:none;
  2217. }
  2218.  
  2219. .overload {
  2220. position:fixed;
  2221. top:0;left:0;
  2222. width:100%;
  2223. height:100%;
  2224. opacity:1;
  2225. z-index:4;
  2226. }
  2227.  
  2228. .fadechicken {
  2229. animation:fadechicken 0.269s ease-in-out;
  2230. opacity:0;
  2231. }
  2232.  
  2233. @keyframes fadechicken {
  2234. from {
  2235. opacity:1;
  2236. }
  2237.  
  2238. to {
  2239. opacity:0;
  2240. }
  2241. }
  2242.  
  2243. .overint {
  2244. position:absolute;
  2245. top:0;left:0;
  2246. width:100%;
  2247. height:100%;
  2248. display:flex;
  2249. align-items:center;
  2250. justify-content:center;
  2251. }
  2252.  
  2253. .sigcont {
  2254. position:relative;
  2255. width:30vw;
  2256. height:30vw;
  2257. max-width:269px;
  2258. max-height:269px;
  2259. display:flex;
  2260. align-items:center;
  2261. justify-content:center;
  2262. }
  2263.  
  2264. .sigil-ph {
  2265. width:100%;
  2266. height:100%;
  2267. -webkit-mask-repeat:no-repeat;
  2268. -webkit-mask-size:contain;
  2269. -webkit-mask-position:center;
  2270. -webkit-mask-image:var(--pandorasigil);
  2271. background:{color:loading screen symbol};
  2272. animation:sablier 0.5s ease-in-out;
  2273. opacity:1;
  2274. }
  2275.  
  2276. @keyframes sablier {
  2277. from {
  2278. width:25vw;
  2279. height:25vw;
  2280. max-width:calc(269px * 0.8);
  2281. max-height:calc(269px * 0.8);
  2282. opacity:0;
  2283. }
  2284.  
  2285. to {
  2286. width:100%;
  2287. height:100%;
  2288. opacity:1;
  2289. }
  2290. }
  2291.  
  2292. .sighand {
  2293. position:absolute;
  2294. margin-top:-8.3%;
  2295. margin-left:-.69%;
  2296. width:10%;
  2297. height:69%;
  2298. -webkit-mask-repeat:no-repeat;
  2299. -webkit-mask-size:contain;
  2300. -webkit-mask-position:center;
  2301. -webkit-mask-image:var(--pandorahand);
  2302. background:{color:loading screen symbol hand};
  2303. transform-origin:50% 58.22368421052632%;
  2304. animation:hell 2s 0.5s ease-in-out;
  2305. z-index:2;
  2306. }
  2307.  
  2308. @keyframes hell {
  2309. from {
  2310. transform:rotate(0deg);
  2311. }
  2312.  
  2313. to {
  2314. transform:rotate(360deg);
  2315. }
  2316. }
  2317.  
  2318. {CustomCSS}
  2319. </style>
  2320.  
  2321. </head>
  2322.  
  2323. <!--------------------------------------------------->
  2324.  
  2325. <body>
  2326.  
  2327. <div class="overload">
  2328. <div class="overint">
  2329. <div class="sigcont">
  2330. <div class="sigil-ph"></div>
  2331. <div class="sighand"></div>
  2332. </div>
  2333. </div>
  2334. </div>
  2335.  
  2336. <div class="thingleft"></div>
  2337.  
  2338. {block:ifmusicplayersongname}
  2339. <div class="mplayer">
  2340. <div class="zirc">
  2341. <div class="msym"></div>
  2342. </div>
  2343.  
  2344. <div class="mline"></div>
  2345.  
  2346. <div class="potatowrap">
  2347. <div class="music-controls">
  2348. <div class="blay playy"></div>
  2349. <div class="bause pausee"></div>
  2350. </div>
  2351.  
  2352. <div class="songtext">{text:music player song name}</div>
  2353. </div>
  2354.  
  2355. <audio src="{text:music player song mp3}" id="musique"></audio>
  2356. </div>
  2357. {/block:ifmusicplayersongname}
  2358.  
  2359. <div class="tout">
  2360.  
  2361. <div class="bigcont">
  2362.  
  2363. <div class="sidecont">
  2364. <div class="scone">
  2365. <div class="titwrap">
  2366. <div class="longue">
  2367. <div class="crown-abs"></div>
  2368. <div class="doz"></div>
  2369. <div class="rectang">
  2370. {block:ifsidebartitle}
  2371. <div class="stit">{text:sidebar title}</div>
  2372. {/block:ifsidebartitle}
  2373.  
  2374. {block:ifnotsidebartitle}
  2375. <div class="stit">{Title}</div>
  2376. {/block:ifnotsidebartitle}
  2377. </div>
  2378. <div class="recback"></div>
  2379. </div>
  2380. </div>
  2381.  
  2382. <div class="despair">
  2383. <div class="sidehoe">
  2384. <div class="livid">
  2385. <!----- DIAMOND NAVLINKS (LEFT) ----->
  2386. <!-- PLEASE DO NOT ADD OR REMOVE ANY LINKS -->
  2387. <!-- must be 4 in total, no more no less -->
  2388.  
  2389. <a class="un-lyn" href="/" title="home">
  2390. <div class="hex-bg"></div>
  2391. <div class="hex-fg"></div>
  2392.  
  2393. <div class="spectre">
  2394. <i class="ph-house-light"></i>
  2395. </div>
  2396. </a><!--un-lyn-->
  2397.  
  2398.  
  2399. <a class="un-lyn" href="/ask" title="askbox">
  2400. <div class="hex-bg"></div>
  2401. <div class="hex-fg"></div>
  2402.  
  2403. <div class="spectre">
  2404. <i class="ph-envelope-light"></i>
  2405. </div>
  2406. </a><!--un-lyn-->
  2407.  
  2408.  
  2409. <a class="un-lyn" href="/archive" title="archive">
  2410. <div class="hex-bg"></div>
  2411. <div class="hex-fg"></div>
  2412.  
  2413. <div class="spectre">
  2414. <i class="ph-squares-four-light"></i>
  2415. </div>
  2416. </a><!--un-lyn-->
  2417.  
  2418.  
  2419. <!-- pls do not delete the credit thank you :') -->
  2420. <a class="un-lyn" href="//glenthemes.tumblr.com" title="theme by glenthemes">
  2421. <div class="hex-bg"></div>
  2422. <div class="hex-fg"></div>
  2423.  
  2424. <div class="spectre">
  2425. <div class="tresglen"></div>
  2426. </div>
  2427. </a><!--un-lyn-->
  2428. </div><!--livid-->
  2429. </div><!--sidehoe-->
  2430.  
  2431. <div class="leafcont">
  2432. <div class="leaf-fg"></div>
  2433. <div class="leaves-inside"></div>
  2434. <div class="leaves-outside"></div>
  2435.  
  2436. <div class="coport">
  2437. <div class="corcle">
  2438. <div class="doomie"></div>
  2439. <div class="fig-light"></div>
  2440. <div class="fig-back"></div>
  2441. <div class="fig-shad"></div>
  2442. </div>
  2443. </div>
  2444. </div><!--leafcont-->
  2445. </div><!--despair-->
  2446.  
  2447. <div class="deskarea">
  2448. <div class="miel">
  2449.  
  2450. {block:Description}
  2451. <div class="dt">
  2452. <div class="desctri-a"></div>
  2453. <div class="desctri-b"></div>
  2454. </div>
  2455.  
  2456. <div class="db-out">
  2457. <div class="descbox">
  2458. {Description}
  2459. </div>
  2460. </div>
  2461. {/block:Description}
  2462.  
  2463. <div class="custard">
  2464. <div class="creme">
  2465. {block:ifcustomlink1name}
  2466. <a class="un-custo" href="{text:customlink 1 url}">
  2467. <span>
  2468. <span>{text:customlink 1 name}</span>
  2469. </span>
  2470. </a>
  2471. {block:ifcustomlink1name}
  2472.  
  2473. {block:ifcustomlink2name}
  2474. <a class="un-custo" href="{text:customlink 2 url}">
  2475. <span>
  2476. <span>{text:customlink 2 name}</span>
  2477. </span>
  2478. </a>
  2479. {block:ifcustomlink2name}
  2480.  
  2481. {block:ifcustomlink3name}
  2482. <a class="un-custo" href="{text:customlink 3 url}">
  2483. <span>
  2484. <span>{text:customlink 3 name}</span>
  2485. </span>
  2486. </a>
  2487. {block:ifcustomlink3name}
  2488.  
  2489. {block:ifcustomlink4name}
  2490. <a class="un-custo" href="{text:customlink 4 url}">
  2491. <span>
  2492. <span>{text:customlink 4 name}</span>
  2493. </span>
  2494. </a>
  2495. {block:ifcustomlink4name}
  2496.  
  2497. {block:ifcustomlink5name}
  2498. <a class="un-custo" href="{text:customlink 5 url}">
  2499. <span>
  2500. <span>{text:customlink 5 name}</span>
  2501. </span>
  2502. </a>
  2503. {block:ifcustomlink5name}
  2504.  
  2505. {block:ifcustomlink6name}
  2506. <a class="un-custo" href="{text:customlink 6 url}">
  2507. <span>
  2508. <span>{text:customlink 6 name}</span>
  2509. </span>
  2510. </a>
  2511. {block:ifcustomlink6name}
  2512. </div><!--creme-->
  2513. </div><!--custard-->
  2514. </div><!--miel-->
  2515. </div><!--deskarea-->
  2516. </div><!--scone-->
  2517. </div><!--end sidebar-->
  2518.  
  2519. <div class="postscont" reblogger-filter="{select:reblogger avatar filter}">
  2520.  
  2521. {block:Posts inlineMediaWidth="1280" inlineNestedMediaWidth="1280"}
  2522. <div class="onepost {PostType}-post" id="{PostID}" post-type="{PostType}">
  2523. <div class="cartel">
  2524.  
  2525. <div class="postinner">
  2526.  
  2527. {block:RebloggedFrom}
  2528. <div class="reblog-head nosrc">
  2529. <div class="rbr-imgw">
  2530. <img src="{ReblogRootPortraitURL-64}">
  2531. </div>
  2532. <span class="reblog-url">
  2533. <a href="{ReblogRootURL}">{ReblogRootName}</a>
  2534. </span>
  2535. </div>
  2536. {/block:RebloggedFrom}
  2537.  
  2538. <!------ POST TITLE ------>
  2539. {block:Title}
  2540. <h1 class="post-title">{Title}</h1>
  2541. {/block:Title}
  2542.  
  2543. <!------ TEXT POSTS ------>
  2544. {block:Text}
  2545. {block:NotReblog}
  2546. <div class="corps">{Body}</div>
  2547. {/block:NotReblog}
  2548.  
  2549. {block:RebloggedFrom}
  2550. {block:Reblogs}
  2551. <div class="reblog-wrap">
  2552. <div class="reblog-head source-head">
  2553. <div class="rbr-imgw">
  2554. <img src="{PortraitURL-64}">
  2555. </div>
  2556. <span class="reblog-url">
  2557. <a href="{Permalink}">{Username}</a>
  2558. </span>
  2559. </div>
  2560. <div class="reblog-comment corps">{Body}</div>
  2561. </div>
  2562. {/block:Reblogs}
  2563. {/block:RebloggedFrom}
  2564. {/block:Text}
  2565.  
  2566.  
  2567. <!------ SINGLE PHOTO ------>
  2568. {block:Photo}
  2569. <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>
  2570. {/block:Photo}
  2571.  
  2572.  
  2573.  
  2574.  
  2575. <!------ PHOTOSETS ------>
  2576. {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}
  2577.  
  2578.  
  2579.  
  2580. <!------ QUOTE POSTS ------>
  2581. {block:Quote}
  2582. <div class="quote-words">{Quote}</div>
  2583. {block:Source}
  2584. <div class="quote-source corps">
  2585. <span>&mdash;</span>
  2586. {Source}
  2587. </div>{/block:Source}
  2588. {/block:Quote}
  2589.  
  2590.  
  2591. <!------ LINK POSTS ------>
  2592. {block:Link}
  2593. <div class="linkwrap">
  2594. <a href="{URL}" class="linkpath {block:Description}has-desc{/block:Description}" {Target}>
  2595. <i class="ph-globe-light"></i>
  2596. <span>{Name}</span>
  2597. </a>
  2598.  
  2599. {block:Thumbnail}
  2600. <div class="tmblr-full">
  2601. <img class="site-img" src="{Thumbnail-HighRes}">
  2602. </div>
  2603. {/block:Thumbnail}
  2604.  
  2605. {block:Excerpt}
  2606. <div class="link-excerpt">{Excerpt} &mdash; <span class="site-host">{Host}</span></div>
  2607. {/block:Excerpt}
  2608. </div><!--linkwrap-->
  2609.  
  2610. {block:Description}
  2611. <div class="link-description">
  2612. {block:NotReblog}
  2613. <div class="corps">{Description}</div>
  2614. {/block:NotReblog}
  2615.  
  2616. {block:RebloggedFrom}
  2617. {block:Reblogs}
  2618. <div class="reblog-wrap">
  2619. <div class="reblog-head">
  2620. <div class="rbr-imgw">
  2621. <img src="{PortraitURL-64}">
  2622. </div>
  2623. <span class="reblog-url">
  2624. <a href="{Permalink}">{Username}</a>
  2625. </span>
  2626. </div>
  2627. <div class="reblog-comment corps">{Body}</div>
  2628. </div>
  2629. {/block:Reblogs}
  2630. {/block:RebloggedFrom}
  2631. </div><!--link-desc-->
  2632. {/block:Description}
  2633. {/block:Link}
  2634.  
  2635.  
  2636. <!------ CHAT POSTS ------>
  2637. {block:Chat}
  2638. {block:Lines}
  2639. <div class="chat_row">
  2640. {block:Label}
  2641. <div class="chat_label">{Label}</div>
  2642. {/block:Label}
  2643.  
  2644. <div class="chat_content">
  2645. {Line}
  2646. </div>
  2647. </div>
  2648. {/block:Lines}
  2649. {/block:Chat}
  2650.  
  2651.  
  2652.  
  2653. <!------ AUDIO POSTS ------>
  2654. {block:Audio}
  2655. <div class="audiowrap">
  2656. {block:AudioPlayer}
  2657. <div class="aud-emb">
  2658. {AudioPlayer}
  2659. </div>
  2660. {/block:AudioPlayer}
  2661.  
  2662. <div class="albumwrap" {block:AlbumArt}has-cover{/block:AlbumArt}>
  2663. {block:AlbumArt}
  2664. <img src="{AlbumArtURL}">
  2665. {/block:AlbumArt}
  2666.  
  2667. <div class="audplac"></div>
  2668.  
  2669. <div class="butts">
  2670. <div class="overplay"></div>
  2671. <div class="overpause"></div>
  2672. </div>
  2673. </div>
  2674.  
  2675. <div class="audiotxt">
  2676. <div class="odin">
  2677.  
  2678. <div class="aud-song-name" {block:TrackName}has-name{/block:TrackName}>
  2679. <div class="untit">Untitled track</div>
  2680.  
  2681. {block:TrackName}
  2682. <div class="hastit">{TrackName}</div>
  2683. {/block:TrackName}
  2684. </div>
  2685.  
  2686. {block:Album}
  2687. <div class="aud-album-name">{Album}</div>
  2688. {/block:Album}
  2689.  
  2690. <div class="aud-artist" {block:Artist}has-artist{/block:Artist}>
  2691. <div class="unart">Unknown artist</div>
  2692.  
  2693. {block:Artist}
  2694. <div class="hasart">{Artist}</div>
  2695. {/block:Artist}
  2696. </div>
  2697. </div><!--odin-->
  2698.  
  2699. <a class="inari" title="download" target="_blank">
  2700. <i class="ph-download-simple"></i>
  2701. </a>
  2702. </div><!--audiotxt-->
  2703. </div><!--audiowrap-->
  2704. {/block:Audio}
  2705.  
  2706.  
  2707. <!------ VIDEO POSTS ------>
  2708. {block:Video}
  2709. <div class="tmblr-video">{Video-500}</div>
  2710. {/block:Video}
  2711.  
  2712.  
  2713. <!------ ANSWER POSTS ------>
  2714. {block:Answer}
  2715. <!-- who asked? -->
  2716. <div class="reblog-wrap une_question">
  2717. <div class="asker-person reblog-head">
  2718. <i class="ph-envelope-light"></i>
  2719.  
  2720. <span class="reblog-url">{Asker} asked:</span>
  2721. </div>
  2722.  
  2723. <p class="question_text">{Question}</p>
  2724. </div>
  2725.  
  2726. <!--------------------------------------->
  2727.  
  2728. <!-- who answered? -->
  2729. {block:Answerer}
  2730. <div class="reblog-wrap une_reponse">
  2731. <div class="answerer reblog-head">
  2732. <div class="rbr-imgw">
  2733. <img src="{AnswererPortraitURL-64}">
  2734. </div>
  2735. <span class="reblog-url">{Answerer} answered:</span>
  2736. </div>
  2737. <p class="answer_text corps">{Answer}</p>
  2738. </div>
  2739.  
  2740. <!-- additional reblogs to the ask post -->
  2741. {block:Reblogs}
  2742. <div class="reblog-wrap reply_container">
  2743. <div class="replier reblog-head">
  2744. <div class="rbr-imgw">
  2745. <img src="{PortraitURL-64}">
  2746. </div>
  2747. <span class="reblog-url">
  2748. <a href="{Permalink}">{Username}</a>
  2749. </span>
  2750. </div>
  2751. <div class="reply corps">{Body}</div>
  2752. </div>
  2753. {/block:Reblogs}
  2754. {/block:Answerer}
  2755.  
  2756. <!--------------------------------------->
  2757.  
  2758. <!-- original answer post -->
  2759. {block:NotReblog}
  2760. <div class="reblog-wrap une-reponse">
  2761. <div class="answerer reblog-head">
  2762. <div class="rbr-imgw">
  2763. <img src="{PortraitURL-64}">
  2764. </div>
  2765. <span class="reblog-url">
  2766. <a href="{Permalink}">{Name}</a>
  2767. </span>
  2768. </div>
  2769.  
  2770. <div class="answer_text corps">{Answer}</div>
  2771. </div><!--answer-container-->
  2772. {/block:NotReblog}
  2773. {/block:Answer}
  2774. <!------ END ANSWER ------>
  2775.  
  2776. <!------ 'CAPTION'? ------>
  2777. {block:Caption}
  2778. <div class="caption">
  2779. {block:NotReblog}
  2780. <div class="corps">{Caption}</div>
  2781. {/block:NotReblog}
  2782.  
  2783. {block:RebloggedFrom}
  2784. {block:Reblogs}
  2785. <div class="reblog-wrap">
  2786. <div class="reblog-head">
  2787. <div class="rbr-imgw">
  2788. <img src="{PortraitURL-64}">
  2789. </div>
  2790. <span class="reblog-url">
  2791. <a href="{Permalink}">{Username}</a>
  2792. </span>
  2793. </div><!--reblog-head-->
  2794. <div class="reblog-comment corps">{Body}</div>
  2795. </div><!--comment-container-->
  2796. {/block:Reblogs}
  2797. {/block:RebloggedFrom}
  2798. </div><!--caption-->
  2799. {/block:Caption}
  2800. </div><!--postinner-->
  2801.  
  2802. <!------ TAGS ------>
  2803. {block:HasTags}
  2804. <div class="tagsdiv" clicktags="{select:click tags}">
  2805. <div class="tagsin">
  2806. {block:Tags}
  2807. <a href="{TagURL}">{Tag}</a>
  2808. {/block:Tags}
  2809. </div>
  2810. </div>
  2811. {/block:HasTags}
  2812. </div><!--posts-->
  2813.  
  2814. <!------ PERMALINK BAR ------>
  2815. {block:Date}
  2816. <div class="permadiv">
  2817. <div class="permaleft">
  2818. <a href="{Permalink}">
  2819. <i class="ph-note-light"></i>
  2820. {block:IndexPage}
  2821. {ShortMonth} {DayOfMonth}{DayOfMonthSuffix}&emsp;
  2822. {TimeAgo}&emsp;
  2823. {NoteCountWithLabel}
  2824. {block:PinnedPostLabel}&emsp;Pinned Post{/block:PinnedPostLabel}
  2825. {/block:IndexPage}
  2826.  
  2827. {block:PermalinkPage}
  2828. {ShortMonth} {DayOfMonth}{DayOfMonthSuffix} {Year}&emsp;
  2829. {TimeAgo}&emsp;
  2830. {NouteCountWithLabel}
  2831. {/block:PermalinkPage}
  2832. </a>
  2833. </div>
  2834.  
  2835. {block:IndexPage}
  2836. <div class="permaright" clicktags="{select:click tags}">
  2837. {block:HasTags}
  2838. <a class="clicktags int-but">
  2839. <span class="hash"></span>
  2840. </a>
  2841. {/block:HasTags}
  2842.  
  2843.  
  2844. <a class="int-but" href="{ReblogURL}" title="reblog this post">
  2845. <span class="rb_icon"></span>
  2846. </a>
  2847.  
  2848. <a class="int-but" title="like this post">
  2849. {LikeButton}
  2850. <span class="like_icon"></span>
  2851. </a>
  2852. </div>
  2853. {block:IndexPage}
  2854.  
  2855.  
  2856. {block:PermalinkPage}
  2857. <div class="permaright">
  2858. {block:NotReblog}
  2859. original post
  2860. {/block:NotReblog}
  2861.  
  2862. {block:RebloggedFrom}
  2863. <a href="{ReblogParentURL}" title="@{ReblogParentName}">via</a>
  2864. &ensp;/&ensp;
  2865. <a href="{ReblogRootURL}" title="@{ReblogRootName}">source</a>
  2866. {/block:RebloggedFrom}
  2867. </div>
  2868. {/block:PermalinkPage}
  2869. </div><!--permadiv-->
  2870. {/block:Date}
  2871.  
  2872. </div><!--onepost-->
  2873.  
  2874. <!------ POST NOTES ------>
  2875. {block:PostNotes}
  2876. <div class="notescont">
  2877. <h1>{NoteCountWithLabel}</h1>
  2878. {PostNotes}
  2879. </div>
  2880. {/block:PostNotes}
  2881.  
  2882. {/block:Posts}
  2883.  
  2884. <!------ PAGINATION ------>
  2885. {block:Pagination}
  2886. <div class="botpagi">
  2887. {block:PreviousPage}
  2888. <a class="flex" href="{PreviousPage}">
  2889. <div class="prev-svg"></div>
  2890. <span>previous page</span>
  2891. </a>
  2892. {/block:PreviousPage}
  2893.  
  2894. {block:NextPage}
  2895. <a class="flex pn" href="{NextPage}">
  2896. <span>next page</span>
  2897. <div class="next-svg"></div>
  2898. </a>
  2899. {/block:NextPage}
  2900. </div>
  2901. {/block:Pagination}
  2902. </div><!--postscont-->
  2903. </div><!--bigcont-->
  2904.  
  2905. </div><!--tout-->
  2906.  
  2907. <script src="//static.tumblr.com/0podkko/jfMplm3f8/modified_photosets.js"></script>
  2908.  
  2909. </body>
  2910. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!