glenthemes

Theme [05]: Asphyxia [dark ver.]

Apr 6th, 2019 (edited)
13,255
0
Never
5
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 85.90 KB | None | 0 0
  1. <!-------------------------------------------------------------------
  2.  
  3. Theme [05]: Asphyxia [dark ver.]
  4. Made by glenthemes
  5.  
  6. 「 THEME INFO. 」
  7. ❃ Post: glenthemes.tumblr.com/post/127560381809
  8. ❃ Initial release: 2015/08/25
  9. ❃ Major update: 2021/11/06
  10. ❃ Last updated: 2026/02/04
  11.  
  12. 「 DARK VERSION. 」
  13. ❃ DARK preview: glenthpvs.tumblr.com/asphyxiadark
  14. ❃ DARK code: glen-themes.gitlab.io/thms/05/asphyxia-dark
  15.  
  16. 「 LIGHT VERSION. 」
  17. ❃ LIGHT preview: glenthpvs.tumblr.com/asphyxialight
  18. ❃ LIGHT code: glen-themes.gitlab.io/thms/05/asphyxia-light
  19.  
  20. 「 HOW TO USE. 」
  21. dub.sh/asphyxia-guide
  22.  
  23. 「 TERMS OF USE. 」
  24. 1) Do not remove the credit.
  25. 2) Do not remove parts of the code without my permission.
  26. 3) Do not claim my codes as your own.
  27. 4) Do not use my works as base codes.
  28. 5) You may add widgets to my themes and pages.
  29.  
  30. 「 CREDITS. 」
  31. ಇ(ꈍᴗꈍ)ಇ ~ glencredits.tumblr.com/asphyxia
  32.  
  33. -------------------------------------------------------------------->
  34.  
  35. <!DOCTYPE html>
  36. <html
  37. lang="{block:English}en{/block:English}{block:German}de{/block:German}{block:French}fr{/block:French}{block:Italian}it{/block:Italian}{block:Japanese}ja{/block:Japanese}{block:Turkish}tr{/block:Turkish}{block:Spanish}es{/block:Spanish}{block:Russian}ru{/block:Russian}{block:Polish}pl{/block:Polish}{block:PortuguesePT}pt-PT{/block:PortuguesePT}{block:PortugueseBR}pt-BR{/block:PortugueseBR}{block:Dutch}nl{/block:Dutch}{block:Korean}ko{/block:Korean}{block:ChineseSimplified}zh-CHS{/block:ChineseSimplified}{block:ChineseTraditional}zh-CHT{/block:ChineseTraditional}{block:ChineseHK}zh-HK{/block:ChineseHK}{block:Indonesian}id{/block:Indonesian}{block:Hindi}hi{/block:Hindi}"
  38. font="{select:font}"
  39. tumblr-controls="{select:tumblr controls color}"
  40. bg-type="{select:background image type}"
  41. portrait="{PortraitURL-64}"
  42. sbw="{select:sidebar width}"
  43. sb-img="{image:sidebar background}"
  44. sb-shad="{select:desc box shadow}"
  45. cl-shape="{select:customlinks shape}"
  46. >
  47.  
  48. <head>
  49.  
  50. <!---- GENERIC META STUFF ---->
  51. <meta charset="UTF-8">
  52. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  53. <meta property="og:type" content="website">
  54. <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
  55. <meta name="theme-color" content="{AccentColor}">
  56. {block:PermalinkPage}{block:Posts}{block:NotReblog}
  57. <meta name="author" content="{Name}">
  58. {/block:NotReblog}{/block:Posts}{/block:PermalinkPage}
  59.  
  60. <base href="{BlogURL}">
  61.  
  62. <!-- tab/window title -->
  63. <title>
  64. {Title}
  65. {block:PostSummary} &#x2726; {PostSummary}{/block:PostSummary}
  66. {block:TagPage} &#x2726; #{Tag}{/block:TagPage}
  67. {block:SearchPage} &#x2726;
  68. {lang:Search}: &ldquo;{SearchQuery}&rdquo; &ndash; {lang:SearchResultCount results}{block:NoSearchResults}{lang:No results found}{/block:NoSearchResults}
  69. {/block:SearchPage}
  70. </title>
  71.  
  72. <meta property="og:title" content="
  73. {Title}
  74. {block:PostSummary} &#x2726; {PostSummary}{/block:PostSummary}
  75. {block:TagPage} &#x2726; #{Tag}{/block:TagPage}
  76. {block:SearchPage} &#x2726;
  77. {lang:Search}: &ldquo;{SearchQuery}&rdquo; &ndash; {lang:SearchResultCount results}{block:NoSearchResults}{lang:No results found}{/block:NoSearchResults}
  78. {/block:SearchPage}
  79. ">
  80.  
  81. <!-- favicon -->
  82. <link rel="icon" href="{Favicon}">
  83. <link rel="apple-touch-icon" sizes="128x128" href="{Favicon}">
  84.  
  85. <meta name="description" content="{block:Description}{block:IndexPage}{MetaDescription}{/block:IndexPage}{/block:Description}{block:PermalinkPage}{block:PostSummary}{PostSummary}{/block:PostSummary}{/block:PermalinkPage}"/>
  86. <meta property="og:description" content="{block:Description}{block:IndexPage}{MetaDescription}{/block:IndexPage}{/block:Description}{block:PermalinkPage}{block:PostSummary}{PostSummary}{/block:PostSummary}{/block:PermalinkPage}"/>
  87.  
  88. <!-------- FONTS -------->
  89. <!-- google fonts -->
  90. <link href="//fonts.bunny.net/css2?family=Work+Sans:ital,wght@0,100..900;1,100..900&family=Cousine:ital,wght@0,400;0,700;1,400;1,700&family=Libre+Franklin:ital,wght@0,100..900;1,100..900&family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Manrope:ital,wght@0,200..800;1,200..800&family=Karla:ital,wght@0,200..800;1,200..800&family=Rubik:ital,wght@0,300..900;1,300..900&family=IBM+Plex+Sans:ital,wght@0,100..700;1,100..700&family=Anuphan:ital,wght@0,100..700;1,100..700&display=swap" rel="stylesheet" crossorigin>
  91.  
  92. <!-------- ICON FONTS -------->
  93. <!-- phosphor icons -->
  94. <link rel="stylesheet" href="//unpkg.com/[email protected]/src/css/phosphor.css">
  95.  
  96. <!-- cappuccicons -->
  97. <link href="//cappuccicons.gitlab.io/backup/icons.css" rel="stylesheet" crossorigin>
  98.  
  99. <!-- basicons -->
  100. <link href="//basicons.gitlab.io/i/@/icons.css" rel="stylesheet" crossorigin>
  101.  
  102. <!-------- PRELOAD -------->
  103. <link rel="preload" href="{image:sidebar background}" as="image">
  104. <link rel="preload" href="//glen-assets.github.io/fonts/Roxborough-CF-Thin.ttf" as="font" type="font/ttf">
  105.  
  106. <!-------- JQUERY -------->
  107. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  108.  
  109. <!-------- THEME SCRIPTS -------->
  110. <script src="//glen-npf.gitlab.io/v4-beta/use.min.js"></script>
  111.  
  112. <link href="//static.tumblr.com/0podkko/oDSpg7y88/photosets.css" rel="stylesheet">
  113.  
  114. <script src="//static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  115.  
  116. <script src="//glen-iframes.gitlab.io/i/v2/use.min.js"></script>
  117.  
  118. <script src="//glen-themes.gitlab.io/thms/05/2026/sasaki.min.js"></script>
  119. <link href="//glen-themes.gitlab.io/thms/05/2026/haise.min.css" rel="stylesheet">
  120.  
  121. <script src="//glen-npf.gitlab.io/other/neue.js"></script>
  122. <link href="//glen-npf.gitlab.io/other/neue.css" rel="stylesheet">
  123.  
  124. <!-------- CUSTOMIZE PANEL OPTIONS -------->
  125. <!-- hi if you're reading this click the back arrow to edit! -->
  126. {block:Options}
  127.  
  128. <!-- divider: images -->
  129. <meta name="image:&#x2666;&#xfe0f;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#x2007;&#x1d408;&#x1d40c;&#x1d400;&#x1d406;&#x1d404;&#x1d412;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;" content="//assets.tumblr.com/images/transparent-pixel.png">
  130. <meta name="image:sidebar background" content="//64.media.tumblr.com/7f22deb741869ea0067febf9aad7cff3/887257d6dea635d7-07/s2048x3072/a47a341a9b905f7dee9fd84ba5f68dbd01532ae7.png">
  131. <meta name="image:background image" content="//64.media.tumblr.com/ef3340d18d7e40c6509164fc7edae70a/aa56c24116a90bd2-c4/s2048x3072/67d759b47732934aa504e6b12e2f6f8bafb9e4e1.png">
  132.  
  133. <!-- divider: main BG -->
  134. <meta name="color:&#x2666;&#xfe0f;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#x2007;&#x1d40c;&#x1d400;&#x1d408;&#x1d40d;&#x20;&#x1d401;&#x1d406;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;" content="">
  135. <meta name="color:background" content="#020202">
  136.  
  137. <!-- divider: sidebar colors -->
  138. <meta name="color:&#x2666;&#xfe0f;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#x2007;&#x1d412;&#x1d408;&#x1d403;&#x1d404;&#x1d401;&#x1d400;&#x1d411;&#x20;&#x1d402;&#x1d40e;&#x1d40b;&#x1d40e;&#x1d411;&#x1d412;&#x2007;&#xb7;&#xb7;&#xb7;" content="">
  139. <meta name="color:sidebar background" content="#000007">
  140.  
  141. <meta name="color:music player BG" content="#171717">
  142. <meta name="color:music player text" content="#bab1af">
  143.  
  144. <!-- divider: navlinks -->
  145. <meta name="color:&#x2666;&#xfe0f;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#x2007;&#x1d40d;&#x1d400;&#x1d415;&#x1d40b;&#x1d408;&#x1d40d;&#x1d40a;&#x1d412;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;" content="">
  146. <meta name="color:navlinks BG" content="#000007">
  147. <meta name="color:navlinks text" content="#c8bdbb">
  148. <meta name="color:navlinks border" content="#383838">
  149. <meta name="color:navlinks shadow" content="#000">
  150.  
  151. <!-- divider: desc -->
  152. <meta name="color:&#x2666;&#xfe0f;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#x2007;&#x1d403;&#x1d404;&#x1d412;&#x1d402;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;" content="">
  153. <meta name="color:desc BG" content="#000007">
  154. <meta name="color:desc border" content="#222">
  155. <meta name="color:desc box shadow" content="#000">
  156. <meta name="color:desc text" content="#c0b8b7">
  157. <meta name="color:desc bold" content="#b99c86">
  158. <meta name="color:desc italic" content="#af8f60">
  159. <meta name="color:desc hyperlinks" content="#fa8072">
  160.  
  161. <!-- divider: custom links -->
  162. <meta name="color:&#x2666;&#xfe0f;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#x2007;&#x1d402;&#x1d414;&#x1d412;&#x1d413;&#x1d40e;&#x1d40c;&#x20;&#x1d40b;&#x1d408;&#x1d40d;&#x1d40a;&#x1d412;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;" content="">
  163. <meta name="color:customlinks bar BG" content="#000007">
  164. <meta name="color:customlink 1" content="#593f38">
  165. <meta name="color:customlink 2" content="#7c483e">
  166. <meta name="color:customlink 3" content="#895641">
  167. <meta name="color:customlink 4" content="#aa6954">
  168. <meta name="color:customlink 5" content="#a7716c">
  169. <meta name="color:customlink 6" content="#e2897f">
  170. <meta name="color:customlink 7" content="#ff896c">
  171. <meta name="color:customlink 8" content="#fa8072">
  172. <meta name="color:customlink 1 hover" content="#d55746">
  173. <meta name="color:customlink 2 hover" content="#d55746">
  174. <meta name="color:customlink 3 hover" content="#d55746">
  175. <meta name="color:customlink 4 hover" content="#d55746">
  176. <meta name="color:customlink 5 hover" content="#d55746">
  177. <meta name="color:customlink 6 hover" content="#d55746">
  178. <meta name="color:customlink 7 hover" content="#d55746">
  179. <meta name="color:customlink 8 hover" content="#d55746">
  180.  
  181. <!-- divider: post colors -->
  182. <meta name="color:&#x2666;&#xfe0f;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#x2007;&#x1d40f;&#x1d40e;&#x1d412;&#x1d413;&#x20;&#x1d402;&#x1d40e;&#x1d40b;&#x1d40e;&#x1d411;&#x1d412;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;" content="">
  183. <meta name="color:post" content="#070707">
  184. <meta name="color:text" content="#a2a2a2">
  185. <meta name="color:special background" content="#131313">
  186. <meta name="color:special text" content="#a2a2a2">
  187. <meta name="color:special border" content="#191919">
  188. <meta name="color:bold" content="#b99c86">
  189. <meta name="color:italic" content="#af8f60">
  190. <meta name="color:link" content="#cf8d82">
  191. <meta name="color:post borders outer" content="#222">
  192. <meta name="color:post borders inner" content="#222">
  193. <meta name="color:usernames" content="#ab918d">
  194. <meta name="color:tags" content="#ab918d">
  195. <meta name="color:post info bar border" content="#222">
  196. <meta name="color:post info bar background" content="#070707">
  197. <meta name="color:post info bar text" content="#b1a29f">
  198. <meta name="color:post buttons" content="#b1a29f">
  199. <meta name="color:like button liked" content="#ff5254">
  200.  
  201. <!-- divider: other colors -->
  202. <meta name="color:&#x2666;&#xfe0f;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#x2007;&#x1d40e;&#x1d413;&#x1d407;&#x1d404;&#x1d411;&#x20;&#x1d402;&#x1d40e;&#x1d40b;&#x1d40e;&#x1d411;&#x1d412;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;" content="">
  203. <meta name="color:scrollbar" content="#444">
  204. <meta name="color:scrollbar background" content="#020202">
  205.  
  206. <meta name="color:text selection background" content="#2b2524">
  207. <meta name="color:text selected" content="#aea3a2">
  208.  
  209. <!-- divider: general -->
  210. <meta name="select:&#x2666;&#xfe0f;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#x2007;&#x1d406;&#x1d404;&#x1d40d;&#x1d404;&#x1d411;&#x1d400;&#x1d40b;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;" title="" content="">
  211. <meta name="select:tumblr controls color" title="white" content="white">
  212. <meta name="select:tumblr controls color" title="black" content="black">
  213.  
  214. <meta name="select:tumblr controls transparency" title="10%" content="10%">
  215. <meta name="select:tumblr controls transparency" title="40%" content="40%">
  216. <meta name="select:tumblr controls transparency" title="30%" content="30%">
  217. <meta name="select:tumblr controls transparency" title="20%" content="20%">
  218. <meta name="select:tumblr controls transparency" title="none" content="0%">
  219.  
  220. <meta name="select:center gap" title="45px" content="45px">
  221. <meta name="select:center gap" title="25px" content="25px">
  222. <meta name="select:center gap" title="10px" content="10px">
  223. <meta name="select:center gap" title="15px" content="15px">
  224. <meta name="select:center gap" title="20px" content="20px">
  225. <meta name="select:center gap" title="30px" content="30px">
  226. <meta name="select:center gap" title="35px" content="35px">
  227. <meta name="select:center gap" title="40px" content="40px">
  228. <meta name="select:center gap" title="55px" content="55px">
  229. <meta name="select:center gap" title="50px" content="50px">
  230. <meta name="select:center gap" title="55px" content="55px">
  231. <meta name="select:center gap" title="60px" content="60px">
  232. <meta name="select:center gap" title="65px" content="65px">
  233. <meta name="select:center gap" title="70px" content="70px">
  234.  
  235. <meta name="select:background image type" title="small" content="repeat">
  236. <meta name="select:background image type" title="large" content="full">
  237.  
  238. <!-- divider: main font -->
  239. <meta name="select:&#x2666;&#xfe0f;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#x2007;&#x1d40c;&#x1d400;&#x1d408;&#x1d40d;&#x20;&#x1d405;&#x1d40e;&#x1d40d;&#x1d413;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;" title="" content="">
  240. <meta name="select:font" title="Rubik" content="Rubik">
  241. <meta name="select:font" title="Libre Franklin" content="Libre Franklin">
  242. <meta name="select:font" title="Open Sans" content="Open Sans">
  243. <meta name="select:font" title="Manrope" content="Manrope">
  244. <meta name="select:font" title="Karla" content="Karla">
  245. <meta name="select:font" title="IBM Plex Sans" content="IBM Plex Sans">
  246.  
  247. <meta name="select:font size" title="14px" content="0.85rem">
  248. <meta name="select:font size" title="11px" content="0.725rem">
  249. <meta name="select:font size" title="12px" content="0.75rem">
  250. <meta name="select:font size" title="13px" content="0.8rem">
  251. <meta name="select:font size" title="15px" content="0.9rem">
  252. <meta name="select:font size" title="16px" content="0.95rem">
  253. <meta name="select:font size" title="17px" content="1rem">
  254.  
  255. <meta name="select:small caps font size" title="13px" content="0.675rem">
  256. <meta name="select:small caps font size" title="11px" content="0.575rem">
  257. <meta name="select:small caps font size" title="12px" content="0.625rem">
  258. <meta name="select:small caps font size" title="14px" content="0.725rem">
  259. <meta name="select:small caps font size" title="15px" content="0.775rem">
  260.  
  261. <meta name="select:text line height" title="normal" content="1.9">
  262. <meta name="select:text line height" title="tight" content="1.7">
  263. <meta name="select:text line height" title="taller" content="2.1">
  264.  
  265. <!-- divider: music player -->
  266. <meta name="select:&#x2666;&#xfe0f;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#x2007;&#x1d40c;&#x1d414;&#x1d412;&#x1d408;&#x1d402;&#x20;&#x1d40f;&#x1d40b;&#x1d400;&#x1d418;&#x1d404;&#x1d411;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;" title="" content="">
  267. <meta name="select:show music player" title="show" content="flex">
  268. <meta name="select:show music player" title="hide" content="none">
  269.  
  270. <!-- divider: sidebar -->
  271. <meta name="select:&#x2666;&#xfe0f;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#x2007;&#x1d412;&#x1d408;&#x1d403;&#x1d404;&#x1d401;&#x1d400;&#x1d411;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;" title="" content="">
  272. <meta name="select:sidebar width" title="475px" content="475px">
  273. <meta name="select:sidebar width" title="375px" content="375px">
  274. <meta name="select:sidebar width" title="400px" content="400px">
  275. <meta name="select:sidebar width" title="425px" content="425px">
  276. <meta name="select:sidebar width" title="450px" content="450px">
  277. <meta name="select:sidebar width" title="500px" content="500px">
  278. <meta name="select:sidebar width" title="525px" content="525px">
  279. <meta name="select:sidebar width" title="550px" content="550px">
  280.  
  281. <meta name="select:sidebar background position" title="bottom left" content="bottom left">
  282. <meta name="select:sidebar background position" title="top left" content="top left">
  283. <meta name="select:sidebar background position" title="top center" content="top center">
  284. <meta name="select:sidebar background position" title="top right" content="top right">
  285. <meta name="select:sidebar background position" title="center left" content="center left">
  286. <meta name="select:sidebar background position" title="center center" content="center center">
  287. <meta name="select:sidebar background position" title="center right" content="center right">
  288. <meta name="select:sidebar background position" title="bottom center" content="bottom center">
  289. <meta name="select:sidebar background position" title="bottom right" content="bottom right">
  290.  
  291. <!-- divider: navlinks -->
  292. <meta name="select:&#x2666;&#xfe0f;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#x2007;&#x1d40d;&#x1d400;&#x1d415;&#x1d40b;&#x1d408;&#x1d40d;&#x1d40a;&#x1d412;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;" title="" content="">
  293. <meta name="select:navlinks columns" title="4" content="4">
  294. <meta name="select:navlinks columns" title="1" content="1">
  295. <meta name="select:navlinks columns" title="2" content="2">
  296. <meta name="select:navlinks columns" title="3" content="3">
  297.  
  298. <meta name="select:navlinks transparency" title="40%" content="0.4">
  299. <meta name="select:navlinks transparency" title="none" content="0">
  300. <meta name="select:navlinks transparency" title="10%" content="0.1">
  301. <meta name="select:navlinks transparency" title="20%" content="0.2">
  302. <meta name="select:navlinks transparency" title="30%" content="0.3">
  303. <meta name="select:navlinks transparency" title="50%" content="0.5">
  304. <meta name="select:navlinks transparency" title="60%" content="0.6">
  305. <meta name="select:navlinks transparency" title="70%" content="0.7">
  306. <meta name="select:navlinks transparency" title="80%" content="0.8">
  307. <meta name="select:navlinks transparency" title="90%" content="0.9">
  308.  
  309. <!-- divider: desc -->
  310. <meta name="select:&#x2666;&#xfe0f;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#x2007;&#x1d403;&#x1d404;&#x1d412;&#x1d402;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;" title="" content="">
  311. <meta name="select:desc padding" title="16px" content="16px">
  312. <meta name="select:desc padding" title="10px" content="10px">
  313. <meta name="select:desc padding" title="13px" content="13px">
  314. <meta name="select:desc padding" title="19px" content="19px">
  315. <meta name="select:desc padding" title="21px" content="21px">
  316.  
  317. <meta name="select:desc font size" title="14px" content="0.85rem">
  318. <meta name="select:desc font size" title="11px" content="0.725rem">
  319. <meta name="select:desc font size" title="12px" content="0.75rem">
  320. <meta name="select:desc font size" title="13px" content="0.8rem">
  321. <meta name="select:desc font size" title="15px" content="0.9rem">
  322. <meta name="select:desc font size" title="16px" content="0.95rem">
  323. <meta name="select:desc font size" title="17px" content="1rem">
  324.  
  325. <meta name="select:desc text align" title="justify" content="justify">
  326. <meta name="select:desc text align" title="left" content="left">
  327. <meta name="select:desc text align" title="center" content="center">
  328. <meta name="select:desc text align" title="right" content="right">
  329.  
  330. <meta name="select:desc transparency" title="30%" content="0.3">
  331. <meta name="select:desc transparency" title="none" content="0">
  332. <meta name="select:desc transparency" title="10%" content="0.1">
  333. <meta name="select:desc transparency" title="20%" content="0.2">
  334. <meta name="select:desc transparency" title="40%" content="0.4">
  335. <meta name="select:desc transparency" title="50%" content="0.5">
  336. <meta name="select:desc transparency" title="60%" content="0.6">
  337. <meta name="select:desc transparency" title="70%" content="0.7">
  338. <meta name="select:desc transparency" title="80%" content="0.8">
  339. <meta name="select:desc transparency" title="90%" content="0.9">
  340.  
  341. <meta name="select:desc box shadow" title="yes" content="yes">
  342. <meta name="select:desc box shadow" title="none" content="no">
  343.  
  344. <meta name="select:desc side gap" title="25%" content="0.125">
  345. <meta name="select:desc side gap" title="10%" content="0.05">
  346. <meta name="select:desc side gap" title="15%" content="0.075">
  347. <meta name="select:desc side gap" title="20%" content="0.1">
  348. <meta name="select:desc side gap" title="30%" content="0.15">
  349. <meta name="select:desc side gap" title="35%" content="0.175">
  350.  
  351. <meta name="select:desc bottom gap" title="35px" content="35px">
  352. <meta name="select:desc bottom gap" title="10px" content="10px">
  353. <meta name="select:desc bottom gap" title="15px" content="15px">
  354. <meta name="select:desc bottom gap" title="20px" content="20px">
  355. <meta name="select:desc bottom gap" title="25px" content="25px">
  356. <meta name="select:desc bottom gap" title="30px" content="30px">
  357. <meta name="select:desc bottom gap" title="40px" content="40px">
  358. <meta name="select:desc bottom gap" title="45px" content="45px">
  359. <meta name="select:desc bottom gap" title="50px" content="50px">
  360.  
  361. <!-- divider: custom links -->
  362. <meta name="select:&#x2666;&#xfe0f;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#x2007;&#x1d402;&#x1d414;&#x1d412;&#x1d413;&#x1d40e;&#x1d40c;&#x20;&#x1d40b;&#x1d408;&#x1d40d;&#x1d40a;&#x1d412;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;" title="" content="">
  363. <meta name="select:customlinks shape" title="sparkle" content="sparkle">
  364. <meta name="select:customlinks shape" title="circle" content="circle">
  365.  
  366. <meta name="select:customlinks shape size" title="19px" content="19px">
  367. <meta name="select:customlinks shape size" title="11px" content="11px">
  368. <meta name="select:customlinks shape size" title="13px" content="13px">
  369. <meta name="select:customlinks shape size" title="15px" content="15px">
  370. <meta name="select:customlinks shape size" title="17px" content="17px">
  371. <meta name="select:customlinks shape size" title="21px" content="21px">
  372. <meta name="select:customlinks shape size" title="23px" content="23px">
  373. <meta name="select:customlinks shape size" title="25px" content="25px">
  374. <meta name="select:customlinks shape size" title="27px" content="27px">
  375.  
  376. <meta name="select:customlinks spacing" title="14px" content="14px">
  377. <meta name="select:customlinks spacing" title="4px" content="4px">
  378. <meta name="select:customlinks spacing" title="6px" content="6px">
  379. <meta name="select:customlinks spacing" title="8px" content="8px">
  380. <meta name="select:customlinks spacing" title="10px" content="10px">
  381. <meta name="select:customlinks spacing" title="12px" content="12px">
  382. <meta name="select:customlinks spacing" title="16px" content="16px">
  383. <meta name="select:customlinks spacing" title="18px" content="18px">
  384. <meta name="select:customlinks spacing" title="20px" content="20px">
  385.  
  386. <!-- divider: posts -->
  387. <meta name="select:&#x2666;&#xfe0f;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#x2007;&#x1d40f;&#x1d40e;&#x1d412;&#x1d413;&#x1d412;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;" title="" content="">
  388. <meta name="select:post width" title="fill up remaining space" content="fill">
  389. <meta name="select:post width" title="420px" content="420px">
  390. <meta name="select:post width" title="460px" content="460px">
  391. <meta name="select:post width" title="500px" content="500px">
  392. <meta name="select:post width" title="540px" content="540px">
  393.  
  394. <meta name="select:post padding" title="18px" content="18px">
  395. <meta name="select:post padding" title="10px" content="10px">
  396. <meta name="select:post padding" title="12px" content="12px">
  397. <meta name="select:post padding" title="14px" content="14px">
  398. <meta name="select:post padding" title="16px" content="16px">
  399. <meta name="select:post padding" title="20px" content="20px">
  400. <meta name="select:post padding" title="22px" content="22px">
  401. <meta name="select:post padding" title="24px" content="24px">
  402. <meta name="select:post padding" title="26px" content="26px">
  403.  
  404. <meta name="select:photoset spacing" title="6px" content="6px">
  405. <meta name="select:photoset spacing" title="2px" content="2px">
  406. <meta name="select:photoset spacing" title="4px" content="4px">
  407. <meta name="select:photoset spacing" title="8px" content="8px">
  408. <meta name="select:photoset spacing" title="10px" content="10px">
  409.  
  410. <meta name="select:grayscale images" title="username icon only" content="rb-ico">
  411. <meta name="select:grayscale images" title="everything in posts" content="everything">
  412. <meta name="select:grayscale images" title="off" content="off">
  413.  
  414. <meta name="select:post info bar buttons size" title="14px" content="0.85rem">
  415. <meta name="select:post info bar buttons size" title="13px" content="0.8rem">
  416. <meta name="select:post info bar buttons size" title="12px" content="0.75rem">
  417. <meta name="select:post info bar buttons size" title="15px" content="0.9rem">
  418. <meta name="select:post info bar buttons size" title="16px" content="0.95rem">
  419. <meta name="select:post info bar buttons size" title="17px" content="1rem">
  420.  
  421. <meta name="select:post spacing" title="35px" content="35px">
  422. <meta name="select:post spacing" title="30px" content="30px">
  423. <meta name="select:post spacing" title="25px" content="25px">
  424. <meta name="select:post spacing" title="40px" content="40px">
  425. <meta name="select:post spacing" title="45px" content="45px">
  426. <meta name="select:post spacing" title="50px" content="50px">
  427. <meta name="select:post spacing" title="55px" content="55px">
  428.  
  429. <!-- divider: tags -->
  430. <meta name="select:&#x2666;&#xfe0f;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#x2007;&#x1d413;&#x1d400;&#x1d406;&#x1d412;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;" title="" content="">
  431. <meta name="select:click toggle tags" title="yes" content="yes">
  432. <meta name="select:click toggle tags" title="no" content="no">
  433.  
  434. <meta name="select:tags position" title="right" content="right">
  435. <meta name="select:tags position" title="left" content="left">
  436.  
  437. <!-- divider: music player -->
  438. <meta name="text:&#917536;&#x2060;" content="&#x2666;&#xfe0f;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#x2007;&#x1d40c;&#x1d414;&#x1d412;&#x1d408;&#x1d402;&#x20;&#x1d40f;&#x1d40b;&#x1d400;&#x1d418;&#x1d404;&#x1d411;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&NewLine;">
  439. <meta name="text:how to link music&#x3A;" content="https://linktr.ee/direct_file_links">
  440. <meta name="text:music player song name" content="Dramatic Slow Motion (2020 ver.)">
  441. <meta name="text:music player song mp3" content="https://rhizo.gitlab.io/m/Dramatic_Slow_Motion__Reconstructed_2020_.mp3">
  442. <meta name="text:music player song volume" content="69%">
  443.  
  444. <!-- divider: desc -->
  445. <meta name="text:&#917536;&#x2060;&#x2060;" content="&#x2666;&#xfe0f;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#x2007;&#x1d403;&#x1d404;&#x1d412;&#x1d402;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&NewLine;">
  446. <meta name="text:sidebar desc" content="I fell in love with the vivid oranges and rosy pink skies, the chilly winter breeze teasing my skin, the serenity of nothingness and everything-ness. I accepted and understood that death, indeed, has no rush. Sooner or later, we will all be deep underground; living is not guaranteed. I gasped for air as I had been deprived for eternity.&ensp;&mdash;&ensp;&lt;a href=&quot;https://journalsbyrm.tumblr.com/post/649416599737090048/the-humane-truth-of-living&quot;&gt;@journalsbyrm&lt;/a&gt;">
  447.  
  448. <!-- divider: custom links -->
  449. <meta name="text:&#917536;&#x2060;&#x2060;&#x2060;" content="&#x2666;&#xfe0f;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#x2007;&#x1d402;&#x1d414;&#x1d412;&#x1d413;&#x1d40e;&#x1d40c;&#x20;&#x1d40b;&#x1d408;&#x1d40d;&#x1d40a;&#x1d412;&#x2007;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&NewLine;">
  450. <meta name="text:customlink 1 name" content="sample link">
  451. <meta name="text:customlink 1 url" content="https://youtu.be/ZkNMZlkrzaU">
  452. <meta name="text:customlink 2 name" content="">
  453. <meta name="text:customlink 2 url" content="">
  454. <meta name="text:customlink 3 name" content="">
  455. <meta name="text:customlink 3 url" content="">
  456. <meta name="text:customlink 4 name" content="">
  457. <meta name="text:customlink 4 url" content="">
  458. <meta name="text:customlink 5 name" content="">
  459. <meta name="text:customlink 5 url" content="">
  460. <meta name="text:customlink 6 name" content="">
  461. <meta name="text:customlink 6 url" content="">
  462. <meta name="text:customlink 7 name" content="">
  463. <meta name="text:customlink 7 url" content="">
  464. <meta name="text:customlink 8 name" content="">
  465. <meta name="text:customlink 8 url" content="">
  466. {/block:Options}
  467.  
  468. <!--------------------------------------------------->
  469.  
  470. <style type="text/css">
  471.  
  472. @font-face { font-family: "roxborough cf thin"; src: url('//glen-assets.github.io/fonts/Roxborough-CF-Thin.ttf'); }
  473.  
  474. /*-------- TUMBLR CONTROLS --------*/
  475. iframe#tumblr_controls, .iframe-controls--desktop {
  476. top:5px!important;
  477. right:calc(5px + var(--Scrollbar-Padding))!important;
  478. position:fixed!important;
  479.  
  480. transform:scale(0.7,0.7);
  481. -webkit-transform:scale(0.7,0.7);
  482.  
  483. transform-origin:100% 0;
  484. z-index:999999!important;
  485. opacity:calc(100% - {select:tumblr controls transparency});
  486. user-select:none;
  487. }
  488.  
  489. [tumblr-controls="black"] iframe#tumblr_controls,
  490. [tumblr-controls="black"] .iframe-controls--desktop {
  491. filter:invert(100%) hue-rotate(180deg)!important;
  492. -webkit-filter:invert(100%) hue-rotate(180deg)!important;
  493. }
  494.  
  495. iframe#tumblr_controls.tmblr-iframe--loaded,
  496. .iframe-controls--desktop.tmblr-iframe--loaded {
  497. transition:opacity 0.4s ease-in-out;
  498. }
  499.  
  500. iframe#tumblr_controls.tmblr-iframe--loaded:hover,
  501. .iframe-controls--desktop.tmblr-iframe--loaded:hover {
  502. opacity:1;
  503. }
  504.  
  505. /*------- SCROLLBAR --------*/
  506. ::-webkit-scrollbar {
  507. width:var(--Scrollbar-Padding);
  508. height:var(--Scrollbar-Padding);
  509. background-color:{color:scrollbar background};
  510. }
  511.  
  512. ::-webkit-scrollbar-thumb {
  513. background-color:{color:scrollbar};
  514. border:calc((var(--Scrollbar-Padding) - 1px) / 2) solid transparent;
  515. background-clip:padding-box;
  516. }
  517.  
  518. ::-webkit-scrollbar-thumb:vertical {
  519. border-top:calc(var(--Scrollbar-Padding) / 2.69) solid transparent;
  520. border-bottom:calc(var(--Scrollbar-Padding) / 2.69) solid transparent;
  521. }
  522.  
  523. ::-webkit-scrollbar-thumb:horizontal {
  524. border-left:calc(var(--Scrollbar-Padding) / 2.69) solid transparent;
  525. border-right:calc(var(--Scrollbar-Padding) / 2.69) solid transparent;
  526. }
  527.  
  528. ::-webkit-scrollbar-corner {
  529. background:{color:scrollbar background};
  530. }
  531.  
  532. /*------- TOOLTIPS --------*/
  533. #s-m-t-tooltip {
  534. padding:calc(var(--Tooltips-Padding) - (((var(--Tooltips-Font-Size) * var(--Line-Height-INT)) - var(--Tooltips-Font-Size)) / 2)) var(--Tooltips-Padding);
  535. margin:17px;
  536. background-color:rgba({RGBcolor:desc bg},calc(1 - {select:desc transparency}));
  537. border-radius:2px;
  538. border:1px solid {color:desc border};
  539. color:{color:desc text};
  540. line-height:var(--Line-Height);
  541. backdrop-filter:blur(2px);
  542. z-index:99;
  543. max-width:40vw;
  544. }
  545.  
  546. [sb-shad="yes"] #s-m-t-tooltip {
  547. box-shadow:0 4px 5px rgba({RGBcolor:navlinks shadow},42%);
  548. }
  549.  
  550. /*---- GLOBAL FONT SETTINGS -----*/
  551. [font] body {
  552. font-family:var(--Body-Font-Family);
  553. font-size:var(--Body-Font-Size);
  554. color:var(--Body-Text-Color);
  555. }
  556.  
  557. [font="Libre Franklin"]{
  558. --Body-Font-Size:calc({select:font size} - .5px);
  559. --Desc-Font-Size:calc({select:desc font size} - .5px)!important;
  560. }
  561.  
  562. [font="Libre Franklin"] body {
  563. letter-spacing:0.1px;
  564. }
  565.  
  566. [font="Manrope"]{
  567. --Body-Font-Size:calc({select:font size} - 1px);
  568. --Desc-Font-Size:calc({select:desc font size} - 1px)!important;
  569. }
  570.  
  571. [font="Manrope"] body {
  572. letter-spacing:0.3px;
  573. }
  574.  
  575. /*------- TEXT HIGHLIGHT --------*/
  576. ::selection {
  577. background:{color:text selection background};
  578. color:{color:text selected};
  579. }
  580.  
  581. ::-moz-selection {
  582. background:{color:text selection background};
  583. color:{color:text selected};
  584. }
  585.  
  586. /*------- BASICS --------*/
  587. body {
  588. margin:0;
  589. background-color:{color:background};
  590. background-image:url('{image:background image}');
  591. background-attachment:fixed;
  592. overflow:hidden;
  593. overscroll-behavior-y:none;
  594. }
  595.  
  596. [bg-type="repeat"] body {
  597. background-repeat:repeat;
  598. }
  599.  
  600. [bg-type="full"] body {
  601. background-repeat:no-repeat;
  602. background-size:cover;
  603. background-position:center;
  604. }
  605.  
  606. a {
  607. text-decoration:none;
  608. color:var(--Link);
  609. }
  610.  
  611. a[title][class*="smt-current-element"]:not([href]){
  612. cursor:help;
  613. }
  614.  
  615. a[title=""]:not([href]){
  616. cursor:initial;
  617. }
  618.  
  619. b, strong {
  620. font-weight:var(--Bold-Font-Weight);
  621. color:var(--Bold);
  622. }
  623.  
  624. [font="Rubik"]{
  625. --Bold-Font-Weight:600!important;
  626. }
  627.  
  628. i:not([class]), em {
  629. color:var(--Italic);
  630. }
  631.  
  632. small {
  633. font-size:calc(var(--Body-Font-Size) * 0.875);
  634. }
  635.  
  636. p {
  637. margin:var(--Paragraph-Margins) 0;
  638. }
  639.  
  640. .text-block > :is(p,blockquote:not([class]),h2,h3,h4,h5,h6):first-child { margin-top:0 }
  641. .text-block > :is(p,blockquote:not([class]),h2,h3,h4,h5,h6):last-child { margin-bottom:0 }
  642.  
  643. blockquote, ol.notes .answer_content {
  644. margin:var(--Paragraph-Margins);
  645. margin-right:0;
  646. padding-left:var(--Paragraph-Margins);
  647. border-left:var(--Blockquote-Border-Size) solid var(--Blockquote-Border-Color);
  648. }
  649.  
  650. h1, h2, h3, h4, h5, h6, .linkpost-title {
  651. margin:var(--Heading-Margins) 0;
  652. font-family:var(--Heading-Font-Family);
  653. font-weight:bold;
  654. font-size:var(--Body-Font-Size);
  655. text-transform:uppercase;
  656. letter-spacing:1.7px;
  657. word-spacing:.7px;
  658. line-height:calc(var(--Line-Height) * 1.1);
  659. }
  660.  
  661. img, iframe, canvas {
  662. vertical-align:middle;
  663. max-width:100%;
  664. }
  665.  
  666. figure {
  667. margin:0;
  668. }
  669.  
  670. pre, code {
  671. white-space:pre-wrap;
  672. font-family:cousine;
  673. font-size:calc(var(--Body-Font-Size) - 2px);
  674. background:var(--Special-BG);
  675. border:1px solid var(--Special-Border-Color);
  676. color:var(--Special-Text);
  677. }
  678.  
  679. pre {
  680. padding:0.8em 1em;
  681. }
  682.  
  683. code {
  684. padding:3px 4px;
  685. }
  686.  
  687. hr {
  688. display:block;
  689. margin:var(--Heading-Margins) auto;
  690. border-width:0px;
  691. width:69%;
  692. height:1px;
  693. background:{color:post borders inner};
  694. }
  695.  
  696. p.p-read {
  697. position:relative;
  698. text-align:center;
  699. }
  700.  
  701. p.p-read:before {
  702. content:"";
  703. position:absolute;
  704. top:50%;
  705. transform:translateY(-50%);
  706. left:0;
  707. width:100%;
  708. height:1px;
  709. background:{color:post borders inner};
  710. z-index:1;
  711. }
  712.  
  713. a.read_more {
  714. position:relative;
  715. padding:var(--Captions-Gap) var(--Post-Padding);
  716. background:var(--Post-BG);
  717. font-family:var(--Heading-Font-Family);
  718. font-weight:bold;
  719. font-size:calc(var(--Heading-Font-Size) - .5px);
  720. text-transform:uppercase;
  721. letter-spacing:1.7px;
  722. word-spacing:.3px;
  723. text-align:center;
  724. color:{color:usernames}!important;
  725. z-index:2;
  726. }
  727.  
  728. ul, ol {
  729. margin:var(--Paragraph-Margins) 0;
  730. margin-left:1.69em;
  731. padding:0;
  732. }
  733.  
  734. ol li {
  735. padding-left:0.420em;
  736. }
  737.  
  738. ul li {
  739. position:relative;
  740. padding-left:0.25em;
  741. margin-left:calc((var(--Body-Font-Size) * 1.420) - 3px);
  742. list-style:none;
  743. }
  744.  
  745. ul li:before {
  746. content:"";
  747. position:absolute;
  748. margin-top:calc(((var(--Body-Font-Size) * var(--Line-Height-INT)) / 2) - 0px);
  749. transform:translateY(-50%);
  750. left:0;margin-left:calc((var(--Body-Font-Size) * -1.420) - 3px);
  751. width:var(--Body-Font-Size);
  752. height:.7px;
  753. background:rgba({RGBcolor:text},0.5);
  754. }
  755.  
  756. .flex, [flex]{
  757. display:flex!important;
  758. align-items:center;
  759. }
  760.  
  761. /*----- SMALL CAPS -----*/
  762. .butain span, .desc-body a, .reblog-url, .reblog-url a, p > a.tumblr_blog[target='_blank'], .le-host, .chat_label, .aud-song-name, .npf-audio-title, .tagsin a, .botpagi, .songtext, #s-m-t-tooltip, .permadiv, ol.notes a:not(blockquote a), ol.notes .notes_loading, .npf-alt-text-btn {
  763. font-family:var(--SmallCaps-Font-Family);
  764. font-weight:var(--SmallCaps-Font-Weight);
  765. font-size:var(--SmallCaps-Font-Size);
  766. text-transform:uppercase;
  767. letter-spacing:var(--SmallCaps-Letter-Spacing);
  768. }
  769.  
  770. :root {
  771. /*--- LAYOUT STUFF ---*/
  772. --Scroll-Container-Height:calc(100vh);
  773.  
  774. --CustomLinks-Bar-Width:calc(var(--CustomLinks-Shape-Size) + (var(--CustomLinks-Bar-Padding) * 2));
  775. --Left-Width-Total:calc(var(--Sidebar-Width) + var(--CustomLinks-Bar-Width));
  776.  
  777. --RestOfWidth:calc(100% - var(--Left-Width-Total) - (var(--Center-Gap) * 2));
  778. --RestOfWidth-Adjusted:var(--RestOfWidth);
  779.  
  780. /*--- SIDEBAR SETTINGS ---*/
  781. --Sidebar-Width-Min-Cap:25vw;
  782. --Sidebar-Width-Max-Cap:60vw;
  783. --Sidebar-Width:clamp(calc(var(--Sidebar-Width-Min-Cap) - var(--CustomLinks-Bar-Width)), {select:sidebar width}, calc(var(--Sidebar-Width-Max-Cap) - var(--CustomLinks-Bar-Width)));
  784.  
  785. --NavLinks-Per-Row:{select:navlinks columns};
  786. --NavLinks-Spacing:6px;
  787. --NavLinks-Padding:5px;
  788. --NavLinks-Hover-Speed:0.2s;
  789. --NavLinks-Font-Size:calc(var(--SmallCaps-Font-Size) - 1px);
  790. --NavLinks-Font-Weight:525;
  791.  
  792. --Desc-Top-Gap:7px;
  793. --Desc-Font-Size:{select:desc font size};
  794.  
  795. /*--- CUSTOM LINKS SETTINGS ---*/
  796. --CustomLinks-Shape-Size:{select:customlinks shape size};
  797. --CustomLinks-Shape-Hover-Speed:0.25s;
  798. --CustomLinks-Spacing:{select:customlinks spacing};
  799. --CustomLinks-Bar-Padding:14px;
  800.  
  801. /*--- TEXT/FONT SETTINGS ---*/
  802. --Paragraph-Margins:1em;
  803. --Heading-Margins:1em;
  804.  
  805. --Body-Font-Family:{select:font};
  806. --Body-Font-Size:{select:font size};
  807. --Body-Text-Color:{color:text};
  808.  
  809. --Line-Height:{select:text line height}em; /* line-height with suffix */
  810. --Line-Height-INT:{select:text line height}; /* line-height without suffix */
  811. --LH-V-Gap:calc(((var(--Body-Font-Size) * var(--Line-Height-INT)) - var(--Body-Font-Size)) / 2);
  812.  
  813. --Heading-Font-Family:"roxborough cf thin";
  814. --Heading-Font-Size:calc(var(--Body-Font-Size) * 1.05);
  815.  
  816. --SmallCaps-Font-Family:"Anuphan";
  817. --SmallCaps-Font-Weight:500;
  818. --SmallCaps-Font-Size:{select:small caps font size};
  819. --SmallCaps-Letter-Spacing:0.085em;
  820. --SmallCaps-Bold-Font-Weight:525;
  821.  
  822. --Blockquote-Border-Size:1px;
  823. --Blockquote-Border-Color:rgba({RGBcolor:text},0.3);
  824.  
  825. --Special-Border-Color:{color:special border};
  826. --Special-BG:{color:special background};
  827. --Special-Text:{color:special text};
  828.  
  829. --Link:{color:link};
  830. --Bold:{color:bold};
  831. --Bold-Font-Weight:bold;
  832. --Italic:{color:italic};
  833.  
  834. /*--- POST SETTINGS ---*/
  835. --Post-Width:{select:post width};
  836. --Post-Padding:{select:post padding};
  837. --Post-Spacing:{select:post spacing};
  838.  
  839. --Post-Width-Total:calc(var(--Post-Width) + (var(--Post-Padding) * 2) + 2px);
  840.  
  841. --Post-Borders-Outer:{color:post borders outer};
  842. --Post-Borders-Inner:{color:post borders inner};
  843. --Post-BG:{color:post};
  844.  
  845. /*--- CAPTIONS/REBLOGS SETTINGS ---*/
  846. --Reblogger-Avatar-Size:min(calc(var(--Body-Font-Size) * 2),30px);
  847. --Reblogger-Avatar-Gap-Right:0.725em;
  848. --Reblogger-Username-Color:{color:usernames};
  849. --Reblogger-Avatar-Bottom-Gap:12px;
  850.  
  851. --Reblogs-Spacing:15px;
  852. --Reblogs-Border:{color:post borders inner};
  853.  
  854. --Captions-Gap:15px;
  855. --NPF-Caption-Spacing:var(--Captions-Gap);
  856.  
  857. --Photoset-Spacing:{select:photoset spacing};
  858. --NPF-Images-Spacing:var(--Photoset-Spacing);
  859.  
  860. --NPF-Move-1st-Photoset:"yes";
  861. --Text-Container-Selector:".text-block";
  862. --Text-Reblogs-Selector:".reblog-wrap";
  863.  
  864. --Grayscale-Settings:grayscale(100%) contrast(110%) brightness(104%);
  865. --Grayscale-Transition-Speed:0.269s;
  866.  
  867. --AskerPortrait-Size:42px;
  868. --AskerPortrait-Padding:6px;
  869.  
  870. --Audio-Post-Album-Size:max(64px,calc(var(--post-width-ro) * 0.125));
  871. --Audio-Post-Album-Right-Gap:13px;
  872. --Audio-Post-Buttons-Size:calc(var(--Body-Font-Size) * 0.9);
  873. --Audio-Post-Buttons-Color:var(--Special-Text);
  874. --Audio-Post-Buttons-Padding:calc(var(--Body-Font-Size) * 0.85);
  875. --Audio-Post-Buttons-Background:var(--Special-BG);
  876.  
  877. --Quote-Font-Family:var(--Heading-Font-Family);
  878. --Quote-Font-Size:calc(var(--Body-Font-Size));
  879.  
  880. --Chat-Label-Font-Weight:var(--SmallCaps-Font-Weight);
  881.  
  882. /*--- TAGS SETTINGS ---*/
  883. --Tags-Fade-Speed-MS:269; /* fade speed without suffix */
  884. --Tags-Fade-Speed-MS-SFX:269ms; /* fade speed with suffix */
  885. --Tags-Spacing:0.8em;
  886.  
  887. /*--- PERMALINK SETTINGS ---*/
  888. --Permalink-Bar-Padding:calc(var(--Post-Padding) - 2px);
  889. --Permalink-Bar-Font-Size:calc(var(--SmallCaps-Font-Size) + .5px);
  890. --Permalink-Bar-Line-Height:1.6; /* numbers only */
  891. --Permalink-Bar-LH-V-Gap:calc(((var(--Permalink-Bar-Font-Size) * var(--Permalink-Bar-Line-Height)) - var(--Permalink-Bar-Font-Size)) / 2);
  892.  
  893. /*--- POST BUTTONS SETTINGS ---*/
  894. --Post-Buttons-Size:calc({select:post info bar buttons size} - .5px);
  895. --Post-Buttons-Color:{color:post buttons};
  896. --Like-Button-Liked:{color:like button liked};
  897. --Post-Buttons-Spacing:7px;
  898.  
  899. /*--- POST NOTES SETTINGS ---*/
  900. --Notes-Indicator-Size:calc(var(--Body-Font-Size) * 1.1);
  901. --Notes-Indicator-Gap-Right:calc(var(--Body-Font-Size) - 1px);
  902. --Notes-Row-Spacing:var(--Paragraph-Margins);
  903.  
  904. /*--- MISC ---*/
  905. --Center-Gap:{select:center gap};
  906.  
  907. --Pagination-Font-Size:calc(var(--SmallCaps-Font-Size) + .5px);
  908. --Pagination-Arrows-Size:calc(var(--Pagination-Font-Size) * 1.69);
  909. --Pagination-Color:{color:text};
  910.  
  911. --Scrollbar-Padding:13px;
  912.  
  913. /*---- MUSIC PLAYER ----*/
  914. --MusicPlayer-Edge-Offset:18px;
  915. --MusicPlayer-Icon-Size:calc(var(--SmallCaps-Font-Size) * 1.1);
  916. --MusicPlayer-Icon-Color:{color:music player text};
  917. --MusicPlayer-Circle-Background:{color:music player bg};
  918. --MusicPlayer-Circle-Padding:var(--MusicPlayer-Icon-Size);
  919.  
  920. --MusicPlayer-Bar-Length:18px;
  921. --MusicPlayer-Bar-Color:{color:music player bg};
  922.  
  923. --MusicPlayer-Buttons-Size:calc(var(--SmallCaps-Font-Size) * 1.05);
  924. --MusicPlayer-Buttons-Color:{color:music player text};
  925.  
  926. --MusicPlayer-Text-Gap-Left:9px;
  927. --MusicPlayer-Text-Color:{color:music player text};
  928.  
  929. --MusicPlayer-Main-Background:{color:music player bg};
  930. --MusicPlayer-Main-Padding:10px;
  931. --MusicPlayer-Main-Roundness:3px;
  932.  
  933. /*--- TOOLTIPS SETTINGS ---*/
  934. --Tooltips-Font-Size:calc(var(--SmallCaps-Font-Size) - .5px);
  935. --Tooltips-Padding:9px;
  936. }/* end root */
  937.  
  938. /*---- SEMI-RESPONSIVENESS -----*/
  939. [sbw="400px"]:root { --Sidebar-Width-Min-Cap:30vw }
  940. [sbw="425px"]:root { --Sidebar-Width-Min-Cap:35vw }
  941. [sbw="475px"]:root { --Sidebar-Width-Min-Cap:40vw }
  942. [sbw="500px"]:root { --Sidebar-Width-Min-Cap:45vw }
  943. [sbw="525px"]:root { --Sidebar-Width-Min-Cap:50vw }
  944. [sbw="550px"]:root { --Sidebar-Width-Min-Cap:55vw }
  945.  
  946. @media(max-width: 1024px){
  947. :root {
  948. --NavLinks-Per-Row:2!important;
  949. }
  950. }
  951.  
  952. /*---- CONTAINER -----*/
  953. .tout {
  954. position:absolute;
  955. top:0;left:0;
  956. width:100%;
  957. height:var(--Scroll-Container-Height);
  958. min-height:var(--Scroll-Container-Height);
  959. display:flex;
  960. overflow:auto;
  961. scroll-behavior:smooth;
  962. overscroll-behavior-y:none;
  963. }
  964.  
  965. @-moz-document url-prefix(){
  966. * {
  967. scrollbar-width:thin; /* firefox only */
  968. }
  969. }
  970.  
  971. /*---- LEFT LONG SIDEBAR ----*/
  972. .leftcont {
  973. position:sticky;
  974. top:0;height:0;
  975. width:var(--Sidebar-Width);
  976. flex-shrink:0;
  977. z-index:13;
  978. }
  979.  
  980. .lc-inner {
  981. position:sticky;
  982. top:0;
  983. width:100%;
  984. height:var(--Scroll-Container-Height);
  985. background-image:url('{image:sidebar background}');
  986. background-size:cover;
  987. background-position:{select:sidebar background position};
  988. background-color:{color:sidebar background};
  989. }
  990.  
  991. .cheez-corn {
  992. position:absolute;
  993. margin:auto;
  994. margin-left:calc(var(--Sidebar-Width) * {select:desc side gap});
  995. bottom:0;margin-bottom:{select:desc bottom gap};
  996. width:calc(100% - ((var(--Sidebar-Width) * {select:desc side gap}) * 2));
  997. z-index:1;
  998. }
  999.  
  1000. /*---- NAVLINKS -----*/
  1001. .butain {
  1002. display:grid;
  1003. grid-template-columns:repeat(var(--NavLinks-Per-Row),1fr);
  1004. width:100%;
  1005. gap:var(--NavLinks-Spacing);
  1006. }
  1007.  
  1008. .butain > * { min-width:0 }
  1009.  
  1010. .cheez-corn[shad='yes'] .butain a {
  1011. box-shadow:0 4px 5px rgba({RGBcolor:navlinks shadow},42%);
  1012. text-shadow:1px 1.3px 2.5px {color:navlinks bg};
  1013. }
  1014.  
  1015. .butain a {
  1016. display:flex;
  1017. align-items:center;
  1018. justify-content:center;
  1019. flex:1;
  1020. padding:calc(var(--NavLinks-Padding) - (((var(--NavLinks-Font-Size) * var(--Line-Height-INT)) - var(--NavLinks-Font-Size)) / 2)) var(--NavLinks-Padding);
  1021. background:rgba({RGBcolor:navlinks bg},calc(1 - {select:navlinks transparency}));
  1022. backdrop-filter:blur(3px);
  1023. border:1px solid {color:navlinks border};
  1024. border-radius:3px;
  1025. box-sizing:border-box;
  1026. max-width:100%;
  1027. overflow:hidden;
  1028. transition:background var(--NavLinks-Hover-Speed) ease-in-out;
  1029. line-height:var(--Line-Height);
  1030. text-align:center;
  1031. }
  1032.  
  1033. .butain a:hover {
  1034. background:rgba({RGBcolor:navlinks bg},calc(1 - ({select:navlinks transparency} / 1.420)));
  1035. }
  1036.  
  1037. .butain span {
  1038. display:block;
  1039. font-size:var(--NavLinks-Font-Size);
  1040. font-weight:var(--NavLinks-Font-Weight);
  1041. letter-spacing:calc(var(--SmallCaps-Letter-Spacing) + .5px);
  1042. color:{color:navlinks text};
  1043. }
  1044.  
  1045. /*---- SIDEBAR DESC -----*/
  1046. .butain + .sb-desc {
  1047. margin-top:var(--Desc-Top-Gap);
  1048. }
  1049.  
  1050. .cheez-corn[shad='yes'] .sb-desc {
  1051. box-shadow:0 5px 10px rgba({RGBcolor:desc box shadow},69%);
  1052. text-shadow:1px 1.3px 2.5px {color:desc bg};
  1053. }
  1054.  
  1055. .sb-desc {
  1056. width:100%;
  1057. padding:calc({select:desc padding} - 3px) {select:desc padding};
  1058. background:rgba({RGBcolor:desc bg},calc(1 - {select:desc transparency}));
  1059. backdrop-filter:blur(3px);
  1060. border:1px solid {color:desc border};
  1061. border-radius:6px;
  1062. box-sizing:border-box;
  1063. }
  1064.  
  1065. .desc-body {
  1066. color:{color:desc text};
  1067. font-size:var(--Desc-Font-Size);
  1068. line-height:var(--Line-Height);
  1069. text-align:{select:desc text align};
  1070. }
  1071.  
  1072. .desc-body a {
  1073. padding-bottom:1px;
  1074. border-bottom:1px solid rgba({RGBcolor:desc hyperlinks},0.25);
  1075. font-size:min(calc(var(--Desc-Font-Size) - 2px), var(--SmallCaps-Font-Size));
  1076. color:{color:desc hyperlinks};
  1077. }
  1078.  
  1079. .desc-body b, .desc-body strong {
  1080. color:{color:desc bold};
  1081. }
  1082.  
  1083. .desc-body i:not([class]), .desc-body em {
  1084. color:{color:desc italic};
  1085. }
  1086.  
  1087. /*---- CUSTOM LINKS BAR -----*/
  1088. .leftdong {
  1089. position:sticky;
  1090. top:0;height:0;
  1091. width:var(--CustomLinks-Bar-Width);
  1092. flex-shrink:0;
  1093. z-index:13;
  1094. }
  1095.  
  1096. .ld-inner {
  1097. width:100%;
  1098. height:var(--Scroll-Container-Height);
  1099. background-color:{color:customlinks bar bg};
  1100. display:table;
  1101. }
  1102.  
  1103. .md {
  1104. display:table-cell;
  1105. vertical-align:middle;
  1106. }
  1107.  
  1108. .customlinks a {
  1109. display:block;
  1110. margin:auto;
  1111. font-size:0;
  1112. line-height:0;
  1113. width:var(--CustomLinks-Shape-Size);
  1114. height:var(--CustomLinks-Shape-Size);
  1115. transition:background var(--CustomLinks-Shape-Hover-Speed) ease-in-out;
  1116. }
  1117.  
  1118. [cl-shape="sparkle"]{
  1119. --CustomLinks-Spacing:calc(14px * 1.1);
  1120. }
  1121.  
  1122. [cl-shape="sparkle"] .customlinks a {
  1123. -webkit-mask:var(--sparkle-mask) no-repeat center / contain;
  1124. mask:var(--sparkle-mask) no-repeat center / contain;
  1125. transform-origin:center;
  1126. transform:scale(1.1);
  1127. }
  1128.  
  1129. [cl-shape="circle"] .customlinks a {
  1130. border-radius:100%;
  1131. }
  1132.  
  1133. .customlinks [cl-1]{
  1134. background:{color:customlink 1};
  1135. }
  1136.  
  1137. .customlinks [cl-1]:hover {
  1138. background:{color:customlink 1 hover};
  1139. }
  1140.  
  1141. .customlinks [cl-2]{
  1142. background:{color:customlink 2};
  1143. }
  1144.  
  1145. .customlinks [cl-2]:hover {
  1146. background:{color:customlink 2 hover};
  1147. }
  1148.  
  1149. .customlinks [cl-3]{
  1150. background:{color:customlink 3};
  1151. }
  1152.  
  1153. .customlinks [cl-3]:hover {
  1154. background:{color:customlink 3 hover};
  1155. }
  1156.  
  1157. .customlinks [cl-4]{
  1158. background:{color:customlink 4};
  1159. }
  1160.  
  1161. .customlinks [cl-4]:hover {
  1162. background:{color:customlink 4 hover};
  1163. }
  1164.  
  1165. .customlinks [cl-5]{
  1166. background:{color:customlink 5};
  1167. }
  1168.  
  1169. .customlinks [cl-5]:hover {
  1170. background:{color:customlink 5 hover};
  1171. }
  1172.  
  1173. .customlinks [cl-6]{
  1174. background:{color:customlink 6};
  1175. }
  1176.  
  1177. .customlinks [cl-6]:hover {
  1178. background:{color:customlink 6 hover};
  1179. }
  1180.  
  1181. .customlinks [cl-7]{
  1182. background:{color:customlink 7};
  1183. }
  1184.  
  1185. .customlinks [cl-7]:hover {
  1186. background:{color:customlink 7 hover};
  1187. }
  1188.  
  1189. .customlinks [cl-8]{
  1190. background:{color:customlink 8};
  1191. }
  1192.  
  1193. .customlinks [cl-8]:hover {
  1194. background:{color:customlink 8 hover};
  1195. }
  1196.  
  1197. /*---- POST CONTAINER ----*/
  1198. .postscont {
  1199. margin:var(--Center-Gap);
  1200. margin-bottom:var(--Post-Spacing);
  1201. max-width:var(--RestOfWidth);
  1202. }
  1203.  
  1204. .postscont[postw='fill']{
  1205. flex:1;
  1206. }
  1207.  
  1208. .postscont[postw='fill'] .posts {
  1209. width:100%;
  1210. box-sizing:border-box;
  1211. }
  1212.  
  1213. .posts {
  1214. width:var(--Post-Width-Total);
  1215. overflow:hidden;
  1216. max-width:100%;
  1217. }
  1218.  
  1219. .postscont > *:last-child, .posts {
  1220. margin-bottom:var(--Post-Spacing);
  1221. }
  1222.  
  1223. .posts:last-child {
  1224. margin-bottom:0!important;
  1225. padding-bottom:var(--Center-Gap);
  1226. }
  1227.  
  1228. [black-and-white="rb-ico"] .reblog-head img {
  1229. transition:filter var(--Grayscale-Transition-Speed) ease-in-out;
  1230. filter:var(--Grayscale-Settings);
  1231. }
  1232.  
  1233. [black-and-white="everything"] img,
  1234. [black-and-white="everything"] iframe,
  1235. [black-and-white="everything"] video {
  1236. transition:filter var(--Grayscale-Transition-Speed) ease-in-out;
  1237. filter:var(--Grayscale-Settings);
  1238. }
  1239.  
  1240. [black-and-white="everything"] .posts:hover img,
  1241. [black-and-white="everything"] .posts:hover iframe,
  1242. [black-and-white="everything"] .posts:hover video {
  1243. filter:none;
  1244. }
  1245.  
  1246. /*-----------------------*/
  1247.  
  1248. .postinner {
  1249. padding:var(--Post-Padding);
  1250. background:var(--Post-BG);
  1251. border:1px solid var(--Post-Borders-Outer);
  1252. line-height:var(--Line-Height);
  1253. }
  1254.  
  1255. .postinner a:not(.reblog-url a, .tumblr_blog, .linkpost-title, .single-photo, .post_media_photo_anchor, .inari, .tagsdiv a, .read_more){
  1256. padding-bottom:.5px;
  1257. border-bottom:1px solid rgba({RGBcolor:link},0.420);
  1258. }
  1259.  
  1260. /*---- REBLOG HEAD ----*/
  1261. .reblog-wrap {
  1262. margin:0 calc(0px - var(--Post-Padding));
  1263. padding:0 var(--Post-Padding);
  1264. }
  1265.  
  1266. .reblog-wrap + .reblog-wrap {
  1267. margin-top:var(--Reblogs-Spacing);
  1268. padding-top:var(--Reblogs-Spacing);
  1269. border-top:1px solid var(--Reblogs-Border);
  1270. }
  1271.  
  1272. .reblog-head {
  1273. display:flex;
  1274. align-items:center;
  1275. }
  1276.  
  1277. .reblog-head img {
  1278. width:var(--Reblogger-Avatar-Size);
  1279. height:var(--Reblogger-Avatar-Size);
  1280. border-radius:100%;
  1281. }
  1282.  
  1283. .reblog-head img + .reblog-url {
  1284. margin-left:var(--Reblogger-Avatar-Gap-Right);
  1285. }
  1286.  
  1287. .reblog-url, .reblog-url a, p > a.tumblr_blog[target='_blank']{
  1288. color:var(--Reblogger-Username-Color);
  1289. }
  1290.  
  1291. .reblog-url .deac {
  1292. margin-left:3px;
  1293. color:var(--Body-Text-Color);
  1294. }
  1295.  
  1296. .reblog-head + .reblog-comment {
  1297. margin-top:calc(0px - var(--Paragraph-Margins) + var(--Reblogger-Avatar-Bottom-Gap));
  1298. }
  1299.  
  1300. /*---- NPF... STUFF ----*/
  1301. figure[data-orig-src] + figure[data-orig-src]{
  1302. margin-top:var(--Photoset-Spacing);
  1303. }
  1304.  
  1305. p.npf_quirky {
  1306. font-size:calc(var(--Heading-Font-Size) * 1.35)!important;
  1307. line-height:var(--Line-Height)!important;
  1308. }
  1309.  
  1310. .npf-audio-album { display:none!important }
  1311.  
  1312. /* glen-test.tumblr.com/post/788729210576519169 */
  1313. /* red */.npf_color_joey,[style="color: #ff4930"]{ color:#f87171!important }
  1314. /* orange */.npf_color_monica { color:#ef8843!important }
  1315. /* yellow */.npf_color_phoebe, [style="color: #e8d738"]{ color:#f4ba27!important }
  1316. /* green */.npf_color_ross { color:#70bd76!important }
  1317. /* blue */.npf_color_rachel { color:#5faeec!important }
  1318. /* pink */.npf_color_niles { color:#f36c98!important }
  1319. /* purple */.npf_color_chandler { color:#a995f0!important }
  1320.  
  1321. /*---- TEXT POST TITLES ----*/
  1322. .post-title, .linkpost-title, .postinner > h1:first-child, .reblog-comment h1 {
  1323. margin-top:2px;
  1324. margin-bottom:0;
  1325. padding:calc(0.8em - var(--LH-V-Gap) + 2px) 0.8em;
  1326. background:var(--Special-BG);
  1327. border:1px solid var(--Special-Border-Color);
  1328. font-size:var(--Heading-Font-Size);
  1329. font-weight:bold;
  1330. color:var(--Special-Text);
  1331. text-align:center;
  1332. }
  1333.  
  1334. .postinner > h1:first-child + .text-block {
  1335. margin-top:var(--Heading-Margins);
  1336. }
  1337.  
  1338. .post-title + *, .linkpost-title + *, .reblog-comment :is(h1,h2,h3,h4,h5,h6) + * {
  1339. margin-top:var(--Heading-Margins);
  1340. }
  1341.  
  1342. /*---- LINK POSTS (TITLE) ----*/
  1343. .linkpost-title {
  1344. display:flex;
  1345. align-items:center;
  1346. justify-content:space-between;
  1347. color:var(--Special-Text);
  1348. text-align:left;
  1349. }
  1350.  
  1351. .linkpost-title span {
  1352. display:block;
  1353. max-width:calc(100% - (var(--Heading-Font-Size) * 1.1) - 10px - 2px);
  1354. }
  1355.  
  1356. span + .linksym {
  1357. margin-left:10px;
  1358. margin-right:2px;
  1359. }
  1360.  
  1361. .linksym {
  1362. width:calc(var(--Heading-Font-Size) * 1.1);
  1363. height:calc(var(--Heading-Font-Size) * 1.1);
  1364. -webkit-mask:var(--ext) no-repeat center / contain;
  1365. mask:var(--ext) no-repeat center / contain;
  1366. background:var(--Special-Text);
  1367. }
  1368.  
  1369. .linkpost-title + .link-excerpt {
  1370. margin-top:-1px;
  1371. }
  1372.  
  1373. .link-excerpt {
  1374. padding:0.8em calc(0.8em + 2px);
  1375. border:1px solid {color:post borders inner};
  1376. }
  1377.  
  1378. .link-excerpt + * {
  1379. margin-top:var(--Heading-Margins);
  1380. }
  1381.  
  1382. .le-host {
  1383. letter-spacing:calc(var(--SmallCaps-Letter-Spacing) - .3px);
  1384. }
  1385.  
  1386. /*---- PHOTO POSTS ----*/
  1387. .single-photo {
  1388. cursor:pointer;
  1389. }
  1390.  
  1391. .photopic {
  1392. width:100%;
  1393. }
  1394.  
  1395. [photoset-layout] {
  1396. grid-gap:var(--Photoset-Spacing);
  1397. }
  1398.  
  1399. [photoset-layout] div {
  1400. cursor:pointer;
  1401. backface-visibility:hidden;
  1402. }
  1403.  
  1404. .caption {
  1405. margin-top:var(--Captions-Gap);
  1406. }
  1407.  
  1408. /*----- LIGHTBOX BS -----*/
  1409. .tmblr-lightbox, #tumblr_lightbox {
  1410. background-color:rgba({RGBcolor:post},0.69)!important;
  1411. }
  1412.  
  1413. .tmblr-lightbox .vignette {
  1414. background-image:none!important;
  1415. }
  1416.  
  1417. #vignette {display:none!important}
  1418.  
  1419. .lightbox-image, #tumblr_lightbox_left_image, #tumblr_lightbox_center_image, #tumblr_lightbox_right_image {
  1420. margin-top:calc(0px - var(--Post-Padding));
  1421. }
  1422.  
  1423. .tmblr-lightbox img, #tumblr_lightbox img {
  1424. max-width:initial;
  1425. box-shadow:none!important;
  1426. border-radius:0px!important;
  1427. padding:var(--Post-Padding);
  1428. background:var(--Post-BG)!important;
  1429. border:1px solid var(--Post-Borders-Outer)!important;
  1430. }
  1431.  
  1432. /*----- QUOTE POSTS -----*/
  1433. .postinner > .quote-words:first-child { margin-top:0 }
  1434.  
  1435. .quote-words, .npf_quote {
  1436. padding:0 var(--Post-Padding);
  1437. font-family:var(--Quote-Font-Family)!important;
  1438. font-weight:bold;
  1439. font-size:var(--Quote-Font-Size)!important;
  1440. text-transform:uppercase;
  1441. letter-spacing:1.3px;
  1442. text-align:center;
  1443. line-height:169%;
  1444. }
  1445.  
  1446. .quote-words + .quote-source,
  1447. .npf_quote + p[style*="margin-bottom: 0px;"]{
  1448. margin-top:var(--Paragraph-Margins);
  1449. text-align:center;
  1450. }
  1451.  
  1452. /*----- VIDEO POSTS -----*/
  1453. .tmblr-video {
  1454. max-width:initial;
  1455. }
  1456.  
  1457. .tumblr_video_container, .tumblr_video_iframe {
  1458. width:100%!important;
  1459. }
  1460.  
  1461. /*---- CHAT POSTS ----*/
  1462. .chatwrap {
  1463. display:table;
  1464. width:100%;
  1465. border:1px solid var(--Post-Borders-Inner);
  1466. box-sizing:border-box;
  1467. overflow:hidden;
  1468. }
  1469.  
  1470. .chat_row {
  1471. position:relative;
  1472. display:table-row;
  1473. overflow:hidden;
  1474. }
  1475.  
  1476. .chat_row:not(:has(.chat_label)){
  1477. display:block;
  1478. width:calc(var(--post-width-ro,100%) - 2px);
  1479. margin-right:calc(0px - var(--post-width-ro,100%) - 2px);
  1480. }
  1481.  
  1482. .chat_row:after {
  1483. content:"";
  1484. position:absolute;
  1485. bottom:0;left:0;
  1486. transform:translateY(-.5px);
  1487. width:100%;
  1488. height:1px;
  1489. background:var(--Post-Borders-Inner);
  1490. }
  1491.  
  1492. .chatwrap .chat_row:last-child:after {
  1493. display:none;
  1494. }
  1495.  
  1496. .chat_row code:only-child {
  1497. display:block;
  1498. padding:0.8em;
  1499. border:none;
  1500. background:transparent;
  1501. }
  1502.  
  1503. .chat_label {
  1504. display:table-cell;
  1505. white-space:nowrap;
  1506. padding-right:1em;
  1507. font-weight:var(--Chat-Label-Font-Weight);
  1508. }
  1509.  
  1510. .chat_label b, .chat_label strong {
  1511. font-weight:var(--Chat-Label-Font-Weight)!important;
  1512. color:var(--Body-Text-Color)!important;
  1513. }
  1514.  
  1515. .chat_label small {
  1516. font-size:calc(var(--SmallCaps-Font-Size) * 0.875);
  1517. }
  1518.  
  1519. .chat_label, .chat_content {
  1520. padding:calc(1em - var(--LH-V-Gap)) 1em;
  1521. }
  1522.  
  1523. .chat_content {
  1524. display:table-cell;
  1525. width:100%;
  1526. }
  1527.  
  1528. .chat_label + .chat_content {
  1529. border-left:1px solid var(--Post-Borders-Inner);
  1530. }
  1531.  
  1532. .chat_row .chat_label + .chat_content {
  1533. min-width:calc((var(--post-width-ro,100%) - 3px) / 2);
  1534. box-sizing:border-box;
  1535. }
  1536.  
  1537. /*---- AUDIO POSTS ----*/
  1538. .audio-post .npf_inst img {
  1539. width:100%;
  1540. }
  1541.  
  1542. .aud-emb {display:none}
  1543.  
  1544. .audiowrap {
  1545. display:flex;
  1546. align-items:center;
  1547. }
  1548.  
  1549. .albumwrap {
  1550. position:relative;
  1551. width:var(--Audio-Post-Album-Size);
  1552. height:var(--Audio-Post-Album-Size);
  1553. display:flex;
  1554. align-items:center;
  1555. justify-content:center;
  1556. flex-shrink:0;
  1557. }
  1558.  
  1559. .albumwrap[has-cover] .audplac {display:none}
  1560.  
  1561. .butts {
  1562. width:calc(var(--Audio-Post-Buttons-Size) + (var(--Audio-Post-Buttons-Padding) * 2));
  1563. height:calc(var(--Audio-Post-Buttons-Size) + (var(--Audio-Post-Buttons-Padding) * 2));
  1564. background:var(--Audio-Post-Buttons-Background);
  1565. border-radius:100%;
  1566. display:flex;
  1567. align-items:center;
  1568. justify-content:center;
  1569. cursor:pointer;
  1570. z-index:2;
  1571. }
  1572.  
  1573. .overplay, .overpause {
  1574. width:var(--Audio-Post-Buttons-Size);
  1575. height:var(--Audio-Post-Buttons-Size);
  1576. -webkit-mask:url("//assets.tumblr.com/images/x.gif") no-repeat center / contain;
  1577. mask:url("//assets.tumblr.com/images/x.gif") no-repeat center / contain;
  1578. background:var(--Audio-Post-Buttons-Color);
  1579. }
  1580.  
  1581. .overplay {
  1582. margin-left:2px;
  1583. -webkit-mask-image:var(--audioplay);
  1584. }
  1585.  
  1586. .overpause {
  1587. display:none;
  1588. -webkit-mask-image:var(--audiopause);
  1589. }
  1590.  
  1591. .ov-y {display:block}
  1592. .ov-z {display:none}
  1593.  
  1594. .audplac {
  1595. position:absolute;
  1596. top:0;left:0;
  1597. width:var(--Audio-Post-Album-Size);
  1598. height:var(--Audio-Post-Album-Size);
  1599. background:var(--Audio-Post-Buttons-Background);
  1600. }
  1601.  
  1602. .albumwrap img {
  1603. position:absolute;
  1604. top:0;left:0;
  1605. width:100%;
  1606. height:100%;
  1607. }
  1608.  
  1609. .audiotxt {
  1610. flex:1;
  1611. height:var(--Audio-Post-Album-Size);
  1612. padding:var(--Audio-Post-Album-Right-Gap);
  1613. background:var(--Special-BG);
  1614. display:flex;
  1615. align-items:center;
  1616. justify-content:space-between;
  1617. box-sizing:border-box;
  1618. color:var(--Special-Text);
  1619. overflow:hidden;
  1620. }
  1621.  
  1622. .audiotxt, .npf-audio-details {
  1623. font-size:calc(var(--Body-Font-Size) - .5px);
  1624. }
  1625.  
  1626.  
  1627. .odin, .npf-audio-details {
  1628. max-width:100%;
  1629. overflow:hidden;
  1630. }
  1631.  
  1632. .odin > div, .npf-audio-details > * {
  1633. display:block;
  1634. max-width:100%;
  1635. text-overflow:ellipsis;
  1636. white-space:nowrap;
  1637. overflow:hidden;
  1638. }
  1639.  
  1640. .odin > div + div, .npf-audio-details > * + * {
  1641. margin-top:-4px;
  1642. }
  1643.  
  1644. .aud-song-name, .npf-audio-title {
  1645. font-size:calc(var(--SmallCaps-Font-Size) + .5px);
  1646. font-weight:var(--SmallCaps-Bold-Font-Weight);
  1647. }
  1648.  
  1649. .aud-song-name[has-name] .untit {
  1650. display:none;
  1651. }
  1652.  
  1653. .aud-artist[has-artist] .unart {
  1654. display:none;
  1655. }
  1656.  
  1657. .inari {
  1658. display:block;
  1659. padding:6px;
  1660. margin-right:-6px;
  1661. cursor:pointer;
  1662. }
  1663.  
  1664. .int-all {
  1665. display:block;
  1666. width:calc(var(--Audio-Post-Buttons-Size) + 6px);
  1667. height:calc(var(--Audio-Post-Buttons-Size) + 6px);
  1668. -webkit-mask:var(--install) no-repeat center / contain;
  1669. mask:var(--install) no-repeat center / contain;
  1670. background:var(--Special-Text);
  1671. }
  1672.  
  1673. /*---- SPOTIFY ----*/
  1674. iframe[src*='open.spotify.com'][src*='track'], figure[data-npf*='open.spotify.com'][data-npf*='track']{
  1675. height:80px!important;
  1676. }
  1677.  
  1678. .spotify_audio_player {
  1679. width:100%;
  1680. }
  1681.  
  1682. /*---- SOUNDCLOUD ----*/
  1683. .tmblr-video iframe[src*='soundcloud.com']{
  1684. }
  1685.  
  1686. .audio-soundcloud {
  1687. max-height:113px;
  1688. border-radius:4px;
  1689. overflow:hidden;
  1690. }
  1691.  
  1692. .soundcloud_audio_player {
  1693. margin:-1px;
  1694. margin-bottom:0;
  1695. width:calc(100% + 2px);
  1696. max-width:initial;
  1697. }
  1698.  
  1699. /*---- ASK/ANSWER POSTS ----*/
  1700. .une_question {
  1701. display:flex;
  1702. }
  1703.  
  1704. .asker-person {
  1705. align-self:baseline;
  1706. }
  1707.  
  1708. .une_question .reblog-comment {
  1709. flex:1;
  1710. margin-left:12px;
  1711. }
  1712.  
  1713. .askpot {
  1714. padding:var(--AskerPortrait-Padding);
  1715. background:var(--Special-BG);
  1716. border:1px solid var(--Special-Border-Color);
  1717. }
  1718.  
  1719. .asker-person img {
  1720. width:var(--AskerPortrait-Size);
  1721. height:var(--AskerPortrait-Size);
  1722. border-radius:0;
  1723. }
  1724.  
  1725. .une_question .reblog-url {
  1726. margin-top:1px;
  1727. padding:3px 4px;
  1728. background:var(--Special-BG);
  1729. border:1px solid var(--Special-Border-Color);
  1730. border-radius:2px;
  1731. color:var(--Special-Text);
  1732. }
  1733.  
  1734. .question_text > p:first-child {
  1735. margin-top:4px;
  1736. }
  1737.  
  1738. .question_text > p:only-child {
  1739. margin-bottom:0;
  1740. }
  1741.  
  1742. .answerer + * {
  1743. margin-top:var(--Captions-Gap);
  1744. }
  1745.  
  1746. .une_question + .une_reponse {
  1747. margin-top:var(--Paragraph-Margins);
  1748. }
  1749.  
  1750. /*---- TAGS SECTION ----*/
  1751. .tagsdiv {
  1752. margin-top:var(--Captions-Gap);
  1753. }
  1754.  
  1755. .tagsdiv[clicktags="yes"]{
  1756. {block:IndexPage}
  1757. display:none;
  1758. opacity:0;
  1759. transition:opacity var(--Tags-Fade-Speed-MS-SFX) ease-in-out;
  1760. {/block:IndexPage}
  1761. }
  1762.  
  1763. .tagsfade {
  1764. opacity:1!important;
  1765. }
  1766.  
  1767. .tagsin {
  1768. display:flex;
  1769. flex-wrap:wrap;
  1770. gap:calc(var(--Tags-Spacing) - var(--LH-V-Gap)) var(--Tags-Spacing);
  1771. margin-top:calc(0px - var(--LH-V-Gap) + 1px);
  1772. margin-bottom:calc(0px - var(--LH-V-Gap));
  1773. }
  1774.  
  1775. .tagsdiv[tags-pos="left"] .tagsin {
  1776. justify-content:flex-start;
  1777. text-align:left;
  1778. }
  1779.  
  1780. .tagsdiv[tags-pos="right"] .tagsin {
  1781. justify-content:flex-end;
  1782. text-align:right;
  1783. }
  1784.  
  1785. .tagsin a {
  1786. position:relative;
  1787. display:block;
  1788. color:{color:tags};
  1789. }
  1790.  
  1791. .tagsin a:before {
  1792. content:"#";
  1793. font-family:work sans;
  1794. margin-right:.5px;
  1795. }
  1796.  
  1797. /*---- PERMALINK BAR ----*/
  1798. .permadiv {
  1799. margin-top:10px;
  1800. display:flex;
  1801. flex-flow:row wrap;
  1802. align-items:center;
  1803. justify-content:space-between;
  1804. padding:var(--Permalink-Bar-Padding);
  1805. background:{color:post info bar background};
  1806. border:1px solid {color:post info bar border};
  1807. letter-spacing:max(0px,calc(var(--SmallCaps-Letter-Spacing) - .3px));
  1808. word-spacing:max(0px,calc(var(--SmallCaps-Letter-Spacing) - .3px));
  1809. }
  1810.  
  1811. .permadiv, .permadiv a {
  1812. color:{color:post info bar text};
  1813. }
  1814.  
  1815. .permaleft {
  1816. --Basicons-Icon-Size:calc(var(--Body-Font-Size) + 1.5px);
  1817. --Basicons-Icon-Color:{color:post info bar text};
  1818. --c:4;
  1819. max-width:calc(100% - var(--Permalink-Bar-Padding) - (var(--Post-Buttons-Size) * var(--c)) - (var(--Post-Buttons-Size) * (var(--c) - 2)));
  1820. font-size:var(--Permalink-Bar-Font-Size);
  1821. line-height:var(--Permalink-Bar-Line-Height);
  1822. }
  1823.  
  1824. .permaleft a {
  1825. position:relative;
  1826.  
  1827. margin:calc(0px - var(--Post-Padding));
  1828. margin-right:0;
  1829. padding:var(--Post-Padding);
  1830. padding-right:2px;
  1831.  
  1832. display:block;
  1833. max-width:100%;
  1834. text-overflow:ellipsis;
  1835. white-space:nowrap;
  1836. overflow:hidden;
  1837. }
  1838.  
  1839. .permaleft .basicons {
  1840. position:absolute;
  1841. display:flex;
  1842. --h:calc(var(--Permalink-Bar-Font-Size) * var(--Permalink-Bar-Line-Height,1));
  1843. height:var(--h);
  1844. align-items:center;
  1845. font-size:var(--Basicons-Icon-Size);
  1846. transform-origin:left;
  1847. transform:scaleX(1.1);
  1848. color:var(--Basicons-Icon-Color);
  1849. }
  1850.  
  1851. .permaleft .basicons[icon-name="pin-8"]{ margin-top:calc(var(--Basicons-Icon-Size) * 0.069) }
  1852.  
  1853. .permadiv .is-pinned + .basicons { display:none }
  1854.  
  1855. .permatext {
  1856. --g:calc(8px + (var(--Basicons-Icon-Size) * 0.1));
  1857. margin-left:calc(var(--Basicons-Icon-Size) + var(--g));
  1858. }
  1859.  
  1860. .permaright {
  1861. display:flex;
  1862. align-items:center;
  1863. justify-content:center;
  1864. letter-spacing:1px;
  1865. margin-left:auto;
  1866. {block:PermalinkPage}
  1867. gap:var(--Post-Buttons-Spacing);
  1868. {/block:PermalinkPage}
  1869. }
  1870.  
  1871. .permaright a {
  1872. display:block;
  1873. position:relative;
  1874. {block:IndexPage}
  1875. display:flex;
  1876. align-items:center;
  1877. justify-content:center;
  1878. width:calc(var(--Post-Buttons-Size) + (var(--Post-Buttons-Spacing) * 1));
  1879. height:calc(var(--Post-Buttons-Size) + (var(--Post-Buttons-Spacing) * 1));
  1880. {/block:IndexPage}
  1881. }
  1882.  
  1883. .permaright span {display:block}
  1884.  
  1885. .permaright[clicktags="no"] .clicktags {
  1886. display:none;
  1887. }
  1888.  
  1889. .clicktags {
  1890. cursor:help;
  1891. display:block;
  1892. transform:translate(-1px,1px);
  1893. }
  1894.  
  1895. .clicktags .cp {
  1896. display:block;
  1897. transform:scaleX(-1);
  1898. }
  1899.  
  1900. .permaright .cp, .permaright [class*='ph-']{
  1901. font-size:var(--Post-Buttons-Size);
  1902. color:var(--Post-Buttons-Color);
  1903. line-height:var(--Post-Buttons-Size);
  1904. -webkit-text-stroke:0.15px currentColor;
  1905. }
  1906.  
  1907. .permaright [class*='ph-']{
  1908. margin-top:1px;
  1909. font-size:calc(var(--Post-Buttons-Size) + 2px);
  1910. }
  1911.  
  1912. .permaright .ph-paperclip { transform:translateX(-1px) }
  1913. .permaright .ph-user { transform:translate(-1px,-.3px) }
  1914.  
  1915. .like_button {
  1916. position:absolute;
  1917. top:0;left:0;
  1918. width:100%;
  1919. height:100%;
  1920. z-index:2;
  1921. }
  1922.  
  1923. .like_button iframe {
  1924. width:100%;
  1925. height:100%;
  1926. vertical-align:initial;
  1927. opacity:0;
  1928. }
  1929.  
  1930. .like_button.liked + .cp {
  1931. color:var(--Like-Button-Liked);
  1932. }
  1933.  
  1934. .permaright a[dash]{
  1935. font-size:calc(var(--SmallCaps-Font-Size) + 1px);
  1936. }
  1937.  
  1938. /*---- POST NOTES ----*/
  1939. .notescont {
  1940. margin-top:var(--Post-Spacing);
  1941. margin-bottom:0!important;
  1942. }
  1943.  
  1944. .nc-inner {
  1945. background:var(--Post-BG);
  1946. border:1px solid var(--Post-Borders-Outer);
  1947. padding:var(--Post-Padding);
  1948. }
  1949.  
  1950. .notescont h1 {
  1951. margin-top:5px;
  1952. margin-bottom:calc(var(--Heading-Margins) + 4px);
  1953. letter-spacing:1.3px;
  1954. text-align:center;
  1955. }
  1956.  
  1957. .notescont ol.notes {
  1958. margin:0;
  1959. padding:0;
  1960. }
  1961.  
  1962. .notescont li {
  1963. list-style-type:none;
  1964. padding:0!important;
  1965. }
  1966.  
  1967. /*---- PAGINATION ----*/
  1968. .botpagi {
  1969. display:flex;
  1970. align-items:center;
  1971. justify-content:space-between;
  1972. width:var(--Post-Width-Total);
  1973. margin-top:var(--Post-Spacing);
  1974. margin-bottom:0!important;
  1975. padding-bottom:var(--Center-Gap);
  1976. font-size:var(--Pagination-Font-Size);
  1977. line-height:1em;
  1978. }
  1979.  
  1980. .botpagi a {
  1981. padding:0.69em;
  1982. margin:-0.69em;
  1983. color:var(--Pagination-Color)!important;
  1984. }
  1985.  
  1986. .botpagi span {
  1987. padding:0 4px;
  1988. }
  1989.  
  1990. .prev-svg, .next-svg {
  1991. margin-top:-.5px;
  1992. width:var(--Pagination-Arrows-Size);
  1993. height:var(--Pagination-Arrows-Size);
  1994. background:var(--Pagination-Color);
  1995. }
  1996.  
  1997. .prev-svg {
  1998. -webkit-mask:var(--BackSVG) no-repeat center / contain;
  1999. mask:var(--BackSVG) no-repeat center / contain;
  2000. }
  2001.  
  2002. .next-svg {
  2003. -webkit-mask:var(--NextSVG) no-repeat center / contain;
  2004. mask:var(--NextSVG) no-repeat center / contain;
  2005. }
  2006.  
  2007. .pn {
  2008. margin-left:auto!important;
  2009. }
  2010.  
  2011. /*---- CORNER MUSIC PLAYER ----*/
  2012. .mplayer {
  2013. position:fixed;
  2014. top:0;margin-top:var(--MusicPlayer-Edge-Offset);
  2015. left:0;margin-left:var(--MusicPlayer-Edge-Offset);
  2016. display:{select:show music player};
  2017. align-items:center;
  2018. z-index:70;
  2019. }
  2020.  
  2021. [sb-shad="yes"] .mplayer {
  2022. filter:drop-shadow(2px 2px 1px rgba(0,0,0,4%))
  2023. }
  2024.  
  2025. .zirc {
  2026. position:relative;
  2027. margin-right:-1px;
  2028. padding:var(--MusicPlayer-Circle-Padding);
  2029. background:var(--MusicPlayer-Circle-Background);
  2030. border-radius:100%;
  2031. overflow:hidden;
  2032. line-height:0;
  2033. z-index:2;
  2034. }
  2035.  
  2036. /* hover stuff */
  2037. .potatowrap {
  2038. opacity:0;
  2039. transition:opacity .420s ease-in-out;
  2040. transition-delay:0s;
  2041. }
  2042.  
  2043. .mplayer:hover .mline {
  2044. width:var(--MusicPlayer-Bar-Length);
  2045. transition-delay:0s; /* delay when mouseleave */
  2046. }
  2047.  
  2048. .mplayer:hover .potatowrap {
  2049. opacity:1;
  2050. transition-delay:.420s;
  2051. }
  2052.  
  2053. .blay, .bause {
  2054. -webkit-mask:url("//assets.tumblr.com/images/x.gif") no-repeat center / contain;
  2055. mask:url("//assets.tumblr.com/images/x.gif") no-repeat center / contain;
  2056. }
  2057.  
  2058. .zirc .basicons {
  2059. --Basicons-Icon-Size:var(--MusicPlayer-Icon-Size);
  2060. --Basicons-Icon-Color:var(--MusicPlayer-Icon-Color);
  2061. font-size:var(--Basicons-Icon-Size);
  2062. color:var(--Basicons-Icon-Color);
  2063. }
  2064.  
  2065. .mline {
  2066. margin-right:-3px;
  2067. width:0px;
  2068. height:3px;
  2069. background:var(--MusicPlayer-Bar-Color);
  2070. border-radius:6px;
  2071. transition:width .420s ease-in-out;
  2072. transition-delay:.420s; /* delay when mouseenter */
  2073. }
  2074.  
  2075. .potatowrap {
  2076. display:flex;
  2077. align-items:center;
  2078. padding:calc(var(--MusicPlayer-Main-Padding) - 2px) var(--MusicPlayer-Main-Padding);
  2079. background:var(--MusicPlayer-Main-Background);
  2080. border-radius:var(--MusicPlayer-Main-Roundness);
  2081. }
  2082.  
  2083. .music-controls {
  2084. margin:-6px;
  2085. padding:6px;
  2086. cursor:pointer;
  2087. }
  2088.  
  2089. .blay {
  2090. width:var(--MusicPlayer-Buttons-Size);
  2091. height:var(--MusicPlayer-Buttons-Size);
  2092. background:var(--MusicPlayer-Buttons-Color);
  2093. -webkit-mask-image:var(--blay);
  2094. }
  2095.  
  2096. .bause {
  2097. width:var(--MusicPlayer-Buttons-Size);
  2098. height:var(--MusicPlayer-Buttons-Size);
  2099. background:var(--MusicPlayer-Buttons-Color);
  2100. -webkit-mask-image:var(--bause);
  2101. }
  2102.  
  2103. .songtext {
  2104. margin-left:var(--MusicPlayer-Text-Gap-Left);
  2105. font-size:calc(var(--SmallCaps-Font-Size) - .5px);
  2106. word-spacing:max(0px,calc(var(--SmallCaps-Letter-Spacing) - .5px));
  2107. color:var(--MusicPlayer-Text-Color);
  2108. }
  2109.  
  2110. .pausee {display:none;}
  2111.  
  2112. .beff {display:none;}
  2113. .aff {display:block;}
  2114.  
  2115. .uzmsg {
  2116. position:sticky;
  2117. bottom:0;margin-bottom:0;
  2118. left:0;margin-left:calc(0px - var(--Center-Gap));
  2119. width:calc(100% + (var(--Center-Gap) * 2));
  2120. padding:14px 18px;
  2121. background:{color:desc bg};
  2122. border-top:1px solid {color:desc border};
  2123. color:{color:desc text};
  2124. line-height:185%;
  2125. box-sizing:border-box;
  2126. cursor:help;
  2127. z-index:9;
  2128. }
  2129.  
  2130. .uzmsg img {
  2131. display:inline-block;
  2132. margin-right:4px;
  2133. width:calc(var(--Body-Font-Size) * 2);
  2134. vertical-align:middle;
  2135. }
  2136.  
  2137. /*----- CUSTOMIZE PAGE ONLY -----*/
  2138. [customize-page='true']{
  2139. --RestOfWidth-Adjusted:max(500px,var(--RestOfWidth));
  2140. }
  2141.  
  2142. [customize-page='true'] .postscont {
  2143. max-width:100%;
  2144. }
  2145.  
  2146. {CustomCSS}
  2147. </style>
  2148.  
  2149. </head>
  2150.  
  2151. <!------------------------------------------->
  2152.  
  2153. <body>
  2154.  
  2155. <!---- CORNER MUSIC PLAYER ---->
  2156. {block:ifmusicplayersongname}
  2157. <div class="mplayer">
  2158. <div class="zirc">
  2159. <i class="basicons" icon-name="headphones-2"></i>
  2160. </div>
  2161.  
  2162. <div class="mline"></div>
  2163.  
  2164. <div class="potatowrap">
  2165. <div class="music-controls">
  2166. <div class="blay playy"></div>
  2167. <div class="bause pausee"></div>
  2168. </div>
  2169.  
  2170. <div class="songtext">{text:music player song name}</div>
  2171. </div>
  2172.  
  2173. <audio src="{text:music player song mp3}" id="musique" volume="{text:music player song volume}"></audio>
  2174. </div>
  2175. {/block:ifmusicplayersongname}
  2176.  
  2177.  
  2178. <!---- MAIN CONTAINER ---->
  2179. <div class="tout">
  2180.  
  2181. <!---- left sidebar ---->
  2182. <div class="leftcont">
  2183. <div class="lc-inner">
  2184. <div class="cheez-corn" shad="{select:desc box shadow}">
  2185. <div class="butain">
  2186.  
  2187. <!-- navlinks: HOME -->
  2188. <a href="/">
  2189. <span>home</span>
  2190. </a>
  2191.  
  2192. <!-- navlinks: ASK -->
  2193. <a href="/ask">
  2194. <span>askbox</span>
  2195. </a>
  2196.  
  2197. <!-- navlinks: ARCHIVE -->
  2198. <a href="/archive">
  2199. <span>archive</span>
  2200. </a>
  2201.  
  2202. <!-- please do not delete the credit thank u! -->
  2203. <a href="//glenthemes.tumblr.com" title="&#34;Asphyxia&#34; by glenthemes&#8194;&#x29A;(&acute;&#x25E1;&grave;)&#x25E;">
  2204. <span>theme</span>
  2205. </a>
  2206. </div>
  2207.  
  2208. <div class="sb-desc">
  2209. {block:ifsidebardesc}
  2210. <div class="desc-body">{text:sidebar desc}</div>
  2211. {/block:ifsidebardesc}
  2212.  
  2213. {block:ifnotsidebardesc}
  2214. {block:Description}
  2215. <div class="desc-body">{Description}</div>
  2216. {/block:Description}
  2217. {/block:ifnotsidebardesc}
  2218. </div>
  2219. </div>
  2220. </div><!--end lc-inner-->
  2221. </div><!--end leftcont-->
  2222.  
  2223. <!---- CUSTOM LINKS BAR ---->
  2224. <div class="leftdong">
  2225. <div class="ld-inner">
  2226. <div class="md">
  2227. <div class="customlinks">
  2228. {block:ifcustomlink1name}
  2229. <a href="{text:customlink 1 url}" cl-1 title="{text:customlink 1 name}"></a>
  2230. {/block:ifcustomlink1name}
  2231.  
  2232. {block:ifcustomlink2name}
  2233. <a href="{text:customlink 2 url}" cl-2 title="{text:customlink 2 name}"></a>
  2234. {/block:ifcustomlink2name}
  2235.  
  2236. {block:ifcustomlink3name}
  2237. <a href="{text:customlink 3 url}" cl-3 title="{text:customlink 3 name}"></a>
  2238. {/block:ifcustomlink3name}
  2239.  
  2240. {block:ifcustomlink4name}
  2241. <a href="{text:customlink 4 url}" cl-4 title="{text:customlink 4 name}"></a>
  2242. {/block:ifcustomlink4name}
  2243.  
  2244. {block:ifcustomlink5name}
  2245. <a href="{text:customlink 5 url}" cl-5 title="{text:customlink 5 name}"></a>
  2246. {/block:ifcustomlink5name}
  2247.  
  2248. {block:ifcustomlink6name}
  2249. <a href="{text:customlink 6 url}" cl-6 title="{text:customlink 6 name}"></a>
  2250. {/block:ifcustomlink6name}
  2251.  
  2252. {block:ifcustomlink7name}
  2253. <a href="{text:customlink 7 url}" cl-7 title="{text:customlink 7 name}"></a>
  2254. {/block:ifcustomlink7name}
  2255.  
  2256. {block:ifcustomlink8name}
  2257. <a href="{text:customlink 8 url}" cl-8 title="{text:customlink 8 name}"></a>
  2258. {/block:ifcustomlink8name}
  2259. </div>
  2260. </div><!--end md-->
  2261. </div><!--end ld-inner-->
  2262. </div><!--end leftdong-->
  2263.  
  2264. <!---- POSTS ---->
  2265. <div class="postscont" postw="{select:post width}" black-and-white="{select:grayscale images}">
  2266.  
  2267. {block:Posts inlineMediaWidth="1280" inlineNestedMediaWidth="1280"}
  2268. <div class="posts {PostType}-post" id="{PostID}" post-type="{PostType}">
  2269.  
  2270. <div class="postinner">
  2271.  
  2272. <!------ POST TITLE ------>
  2273. {block:Title}
  2274. <h1 class="post-title">{Title}</h1>
  2275. {/block:Title}
  2276.  
  2277. <!------ TEXT POSTS ------>
  2278. {block:Text}
  2279. <div class="text-block">
  2280. {block:NotReblog}{Body}{/block:NotReblog}
  2281.  
  2282. {block:RebloggedFrom}
  2283. {block:Reblogs}
  2284. <div class="reblog-wrap">
  2285. <div class="reblog-head source-head">
  2286. <img src="{PortraitURL-64}">
  2287. <span class="reblog-url">
  2288. <a href="{Permalink}">{Username}</a>
  2289. </span>
  2290. </div>
  2291. <div class="reblog-comment">{Body}</div>
  2292. </div>
  2293. {/block:Reblogs}
  2294. {/block:RebloggedFrom}
  2295. </div>
  2296. {/block:Text}
  2297.  
  2298. <!------ SINGLE PHOTO ------>
  2299. {block:Photo}
  2300. <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>
  2301. {/block:Photo}
  2302.  
  2303. <!------ PHOTOSETS ------>
  2304. {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}
  2305.  
  2306. <!------ QUOTE POSTS ------>
  2307. {block:Quote}
  2308. <div class="quote-words">{Quote}</div>
  2309. {block:Source}
  2310. <div class="quote-source">
  2311. <span mdash>&mdash;</span>
  2312. {Source}
  2313. </div>{/block:Source}
  2314. {/block:Quote}
  2315.  
  2316. <!------ LINK POSTS ------>
  2317. {block:Link}
  2318. <a class="linkpost-title" href="{URL}" {Target}>
  2319. <span>{Name}</span>
  2320. <div class="linksym"></div>
  2321. </a>
  2322.  
  2323. {block:Excerpt}
  2324. <div class="link-excerpt">
  2325. {Excerpt}
  2326. {block:Host}— <a class="le-host" href="{URL}" {Target}>{Host}</a>{/block:Host}
  2327. </div>
  2328. {/block:Excerpt}
  2329.  
  2330. {block:Description}
  2331. <div class="link-description">
  2332. {block:NotReblog}{Description}{/block:NotReblog}
  2333. {block:RebloggedFrom}
  2334. {block:Reblogs}
  2335. <div class="reblog-wrap">
  2336. <div class="reblog-head">
  2337. <img src="{PortraitURL-64}">
  2338. <span class="reblog-url">
  2339. <a href="{Permalink}">{Username}</a>
  2340. </span>
  2341. </div>
  2342. <div class="reblog-comment">{Body}</div>
  2343. </div>
  2344. {/block:Reblogs}
  2345. {/block:RebloggedFrom}
  2346. </div>
  2347. {/block:Description}
  2348. {/block:Link}
  2349.  
  2350. <!------ CHAT POSTS ------>
  2351. {block:Chat}
  2352. <div class="chatwrap">
  2353. {block:Lines}
  2354. <div class="chat_row">
  2355. {block:Label}
  2356. <div class="chat_label">{Label}</div>
  2357. {/block:Label}
  2358.  
  2359. <div class="chat_content">
  2360. {Line}
  2361. </div>
  2362. </div>
  2363. {/block:Lines}
  2364. </div>
  2365. {/block:Chat}
  2366.  
  2367. <!------ AUDIO POSTS ------>
  2368. {block:Audio}
  2369. <div class="audiowrap">
  2370. {block:AudioPlayer}
  2371. <div class="aud-emb">
  2372. {AudioPlayer}
  2373. </div>
  2374. {/block:AudioPlayer}
  2375.  
  2376. <div class="albumwrap" {block:AlbumArt}has-cover{/block:AlbumArt}>
  2377. {block:AlbumArt}
  2378. <img src="{AlbumArtURL}">
  2379. {/block:AlbumArt}
  2380.  
  2381. <div class="audplac"></div>
  2382.  
  2383. <div class="butts">
  2384. <div class="overplay"></div>
  2385. <div class="overpause"></div>
  2386. </div>
  2387. </div>
  2388.  
  2389. <div class="audiotxt">
  2390. <div class="odin">
  2391.  
  2392. <div class="aud-song-name" {block:TrackName}has-name{/block:TrackName}>
  2393. <div class="untit">Untitled track</div>
  2394.  
  2395. {block:TrackName}
  2396. <div class="hastit">{TrackName}</div>
  2397. {/block:TrackName}
  2398. </div>
  2399.  
  2400. <div class="aud-artist" {block:Artist}has-artist{/block:Artist}>
  2401. <div class="unart">Unknown artist</div>
  2402.  
  2403. {block:Artist}
  2404. <div class="hasart">{Artist}</div>
  2405. {/block:Artist}
  2406. </div>
  2407. </div><!--odin-->
  2408.  
  2409. <a class="inari" title="download" target="_blank">
  2410. <span class="int-all"></span>
  2411. </a>
  2412. </div><!--audiotxt-->
  2413. </div><!--audiowrap-->
  2414. {/block:Audio}
  2415.  
  2416. <!------ VIDEO POSTS ------>
  2417. {block:Video}
  2418. <div class="tmblr-video">{Video-500}</div>
  2419. {/block:Video}
  2420.  
  2421. <!------ ANSWER POSTS ------>
  2422. {block:Answer}
  2423. <!-- who asked? -->
  2424. <div class="reblog-wrap une_question">
  2425. <div class="asker-person reblog-head">
  2426. <div class="askpot">
  2427. <img src="{AskerPortraitURL-64}">
  2428. </div>
  2429.  
  2430. </div>
  2431.  
  2432. <div class="reblog-comment">
  2433. <span class="reblog-url">{Asker} asked:</span>
  2434. <div class="question_text">{Question}</div>
  2435. </div>
  2436. </div>
  2437.  
  2438. <!--------------------------------------->
  2439.  
  2440. <!-- who answered? -->
  2441. {block:Answerer}
  2442. <div class="reblog-wrap une_reponse">
  2443. <div class="answerer reblog-head">
  2444. <img src="{AnswererPortraitURL-64}">
  2445. <span class="reblog-url">{Answerer} answered:</span>
  2446. </div>
  2447. <p class="answer_text">{Answer}</p>
  2448. </div>
  2449.  
  2450. <!-- additional reblogs to the ask post -->
  2451. {block:Reblogs}
  2452. <div class="reblog-wrap reply_container">
  2453. <div class="replier reblog-head">
  2454. <img src="{PortraitURL-64}">
  2455. <span class="reblog-url">
  2456. <a href="{Permalink}">{Username}</a>
  2457. </span>
  2458. </div>
  2459. <div class="reply">{Body}</div>
  2460. </div>
  2461. {/block:Reblogs}
  2462. {/block:Answerer}
  2463.  
  2464. <!--------------------------------------->
  2465.  
  2466. <!-- original answer post -->
  2467. {block:NotReblog}
  2468. <div class="reblog-wrap une-reponse">
  2469. <div class="answerer reblog-head">
  2470. <img src="{PortraitURL-64}">
  2471. <span class="reblog-url">
  2472. <a href="{Permalink}">{Name}</a>
  2473. </span>
  2474. </div>
  2475.  
  2476. <div class="answer_text">{Answer}</div>
  2477. </div><!--answer-container-->
  2478. {/block:NotReblog}
  2479. {/block:Answer}
  2480. <!------ END ANSWER ------>
  2481.  
  2482. <!------ 'CAPTION'? ------>
  2483. {block:Caption}
  2484. <div class="caption">
  2485. {block:NotReblog}{Caption}{/block:NotReblog}
  2486. {block:RebloggedFrom}
  2487. {block:Reblogs}
  2488. <div class="reblog-wrap">
  2489. <div class="reblog-head">
  2490. <img src="{PortraitURL-64}">
  2491. <span class="reblog-url">
  2492. <a href="{Permalink}">{Username}</a>
  2493. </span>
  2494. </div><!--reblog-head-->
  2495. <div class="reblog-comment">{Body}</div>
  2496. </div><!--comment-container-->
  2497. {/block:Reblogs}
  2498. {/block:RebloggedFrom}
  2499. </div><!--caption-->
  2500. {/block:Caption}
  2501.  
  2502.  
  2503. <!------ TAGS ------>
  2504. {block:HasTags}
  2505. <div class="tagsdiv" clicktags="{select:click toggle tags}" tags-pos="{select:tags position}">
  2506. <div class="tagsin">
  2507. {block:Tags}
  2508. <a href="{TagURL}">{Tag}</a>
  2509. {/block:Tags}
  2510. </div>
  2511. </div>
  2512. {/block:HasTags}
  2513. </div><!--postinner-->
  2514.  
  2515. <!------ PERMALINK ------>
  2516. {block:Date}
  2517. <div class="permadiv">
  2518. <div class="permaleft">
  2519. <a {block:IndexPage}href="{Permalink}"{/block:IndexPage}>
  2520. {block:PinnedPostLabel}
  2521. <i class="basicons is-pinned" icon-name="pin-8"></i>
  2522. {/block:PinnedPostLabel}
  2523. <i class="basicons" icon-name="calendar"></i>
  2524. <span class="permatext">
  2525. {ShortMonth} {DayOfMonth}{DayOfMonthSuffix} '{ShortYear}&ensp;&thinsp;{24HourWithZero}:{Minutes}
  2526. &ensp;&thinsp;{TimeAgo}</span>
  2527. {block:IndexPage}
  2528. &ensp;&thinsp;{NoteCountWithLabel}</span>
  2529. {/block:IndexPage}
  2530. </span>
  2531. </a>
  2532. </div><!--end permaleft-->
  2533.  
  2534. <!------------------------------>
  2535. {block:IndexPage}
  2536. <div class="permaright" clicktags="{select:click toggle tags}">
  2537. {block:HasTags}
  2538. <a class="clicktags">
  2539. <span class="cp cp-tags-o"></span>
  2540. </a>
  2541. {/block:HasTags}
  2542.  
  2543. {block:RebloggedFrom}
  2544. <a href="{ReblogRootURL}" title="{lang:Source}: @{ReblogRootName}" class="rb-root">
  2545. <i class="ph-user"></i>
  2546. </a>
  2547. {/block:RebloggedFrom}
  2548.  
  2549. {block:ContentSource}
  2550. <a href="{SourceURL}" title="{lang:Source}: {SourceTitle}" class="content-src">
  2551. <i class="ph-paperclip"></i>
  2552. </a>
  2553. {/block:ContentSource}
  2554.  
  2555. <a href="{ReblogURL}" title="reblog this post">
  2556. <span class="cp cp-reblog-alt"></span>
  2557. </a>
  2558.  
  2559. <a title="like this post">
  2560. {LikeButton}
  2561. <span class="cp cp-heart-o"></span>
  2562. </a>
  2563. </div>
  2564. {/block:IndexPage}
  2565. <!------------------------------>
  2566.  
  2567. {block:PermalinkPage}
  2568. <div class="permaright">
  2569. {block:NotReblog}
  2570. original post
  2571. {/block:NotReblog}
  2572.  
  2573. {block:RebloggedFrom}
  2574. <a href="{ReblogParentURL}" title="@{ReblogParentName}">{lang:Via}</a>
  2575. <a dash>/</a>
  2576. <a href="{ReblogRootURL}" title="@{ReblogRootName}" class="rb-root">{lang:Source}</a>
  2577. {block:ContentSource}
  2578. <a dash>/</a>
  2579. <a href="{SourceURL}" title="{SourceTitle}" class="content-src">{lang:Source}</a>
  2580. {/block:ContentSource}
  2581.  
  2582. {/block:RebloggedFrom}
  2583. </div>
  2584. {/block:PermalinkPage}
  2585.  
  2586. </div><!--permadiv-->
  2587. {/block:Date}
  2588.  
  2589. {block:PostNotes}
  2590. <div class="notescont">
  2591. <div class="nc-inner">
  2592. <h1>{NoteCountWithLabel}</h1>
  2593. {PostNotes}
  2594. </div>
  2595. </div>
  2596. {/block:PostNotes}
  2597. </div><!--posts-->
  2598.  
  2599. {/block:Posts}
  2600.  
  2601. <!------ PAGINATION ------>
  2602. {block:Pagination}
  2603. <div class="botpagi">
  2604. {block:PreviousPage}
  2605. <a class="flex" href="{PreviousPage}">
  2606. <div class="prev-svg"></div>
  2607. <span>previous page</span>
  2608. </a>
  2609. {/block:PreviousPage}
  2610.  
  2611. {block:NextPage}
  2612. <a class="flex pn" href="{NextPage}">
  2613. <span>next page</span>
  2614. <div class="next-svg"></div>
  2615. </a>
  2616. {/block:NextPage}
  2617. </div>
  2618. {/block:Pagination}
  2619. </div><!--postscont-->
  2620. </div><!--tout-->
  2621.  
  2622. <script src="//static.tumblr.com/0podkko/jfMplm3f8/modified_photosets.js"></script>
  2623.  
  2624. </body>
  2625. </html>
Comments
  • User was banned
  • User was banned
  • User was banned
  • Terjuxel
    225 days
    Comment was deleted
  • User was banned
Add Comment
Please, Sign In to add comment