sexycullen

theme 223

Jan 2nd, 2022 (edited)
5,181
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 131.83 KB | None | 0 0
  1. <!--
  2.  
  3. maziekeen's theme #223
  4. https://maziekeen.tumblr.com/
  5.  
  6.  
  7. PLEASE DO NOT:
  8. remove the credits; claim as your own; use as a base, take parts
  9. of the theme, repost as your own
  10. YOU CAN:
  11. edit as much as you want for your own personal use only.
  12.  
  13.  
  14. CREDITS,
  15.  
  16. captions and audio style by seyche
  17. css photosets by annasthms
  18. time stamp by bychloethemes
  19. smooth scroll by michael herf and balazs galambosi
  20. feathericons by github.com/feathericons/feather
  21. normalize reest html by necolas.github.io
  22. tippyjs tooltips by silbrigthemes
  23. short notecount, like and reblog, video resize by shythemes
  24. npf images readjustment v.02 by glenthemes
  25. dark mode by twan mulder at blog.prototypr.io/8b461864644b
  26. & ananya neogi at dev.to/ananyaneogi/create-a-dark-light-mode-switch-with-css-variables-34l8
  27.  
  28. -->
  29.  
  30. <!doctype html>
  31. <html>
  32.  
  33. <head>
  34. <meta charset="utf-8">
  35. <title>{block:TagPage}{Tag} | {/block:TagPage} {block:SearchPage}{lang:Search results for SearchQuery} | {/block:SearchPage}{block:PostSummary}{PostSummary} | {/block:PostSummary}{Title}</title>
  36. {block:Description}
  37. <meta name="description" content="{MetaDescription}" />
  38. {/block:Description}
  39.  
  40. {block:Hidden}
  41. <!-- image options -->
  42.  
  43. <meta name="image:Sidebar Image" content="" />
  44. <meta name="image:Background Image" content="" />
  45.  
  46. <!-- light color options -->
  47. <meta name="color:Background Theme Color" content="#fdfdfd" />
  48. <meta name="color:Body Text Color" content="#404040" />
  49. <meta name="color:Body Bold Color" content="#404040">
  50. <meta name="color:Body Italic Color" content="#828282">
  51. <meta name="color:Body Link Color" content="#949494" />
  52. <meta name="color:Body Link Hover Color" content="#404040" />
  53. <meta name="color:Sidebar Title Color" content="#404040">
  54. <meta name="color:Sidebar Text Color" content="#404040">
  55. <meta name="color:Sidebar Bold Color" content="#404040">
  56. <meta name="color:Sidebar Italic Color" content="#828282">
  57. <meta name="color:Sidebar Link Icons Color" content="#404040">
  58. <meta name="color:Sidebar Link Text Color" content="#404040">
  59. <meta name="color:Sidebar Primary Link Color" content="#404040">
  60. <meta name="color:Sidebar Primary Background Color" content="#ffffff">
  61. <meta name="color:Sidebar Secondary Link Color" content="#404040">
  62. <meta name="color:Sidebar Secondary Background Color" content="#edecec">
  63. <meta name="color:Hover Text Background Color" content="#1a1a1a" />
  64. <meta name="color:Hover Text Color" content="#ffffff" />
  65. <meta name="color:Date Text Color" content="#262626" />
  66. <meta name="color:Date Primary Link Color" content="#262626">
  67. <meta name="color:Date Primary Background Color" content="#edecec" />
  68. <meta name="color:Date Secondary Link Color" content="#262626">
  69. <meta name="color:Date Secondary Background Color" content="#edecec" />
  70. <meta name="color:Tags Link Color" content="#9d9d9d">
  71. <meta name="color:Liked Link Color" content="#6a6a6a">
  72. <meta name="color:Posts Background Color" content="#ffffff" />
  73. <meta name="color:Borders Color" content="#ececec" />
  74. <meta name="color:Scrollbar Color" content="#1a1a1a" />
  75. <meta name="color:Tumblr Controls Icon Color" content="#1a1a1a" />
  76.  
  77.  
  78. <!-- dark color options -->
  79. <meta name="color:Dark Background Theme Color" content="#0e0e0e" />
  80. <meta name="color:Dark Body Text Color" content="#959595" />
  81. <meta name="color:Dark Body Bold Color" content="#f7f7f7">
  82. <meta name="color:Dark Body Italic Color" content="#acacac">
  83. <meta name="color:Dark Body Link Color" content="#f7f7f7" />
  84. <meta name="color:Dark Body Link Hover Color" content="#f6cf6a" />
  85. <meta name="color:Dark Sidebar Title Color" content="#f7f7f7">
  86. <meta name="color:Dark Sidebar Text Color" content="#959595">
  87. <meta name="color:Dark Sidebar Bold Color" content="#404040">
  88. <meta name="color:Dark Sidebar Italic Color" content="#828282">
  89. <meta name="color:Dark Sidebar Link Icons Color" content="#f7f7f7">
  90. <meta name="color:Dark Sidebar Link Text Color" content="#404040">
  91. <meta name="color:Dark Sidebar Primary Link Color" content="#404040">
  92. <meta name="color:Dark Sidebar Primary Background Color" content="#191919">
  93. <meta name="color:Dark Sidebar Secondary Link Color" content="#404040">
  94. <meta name="color:Dark Sidebar Secondary Background Color" content="#151515">
  95. <meta name="color:Dark Hover Text Background Color" content="#ffffff" />
  96. <meta name="color:Dark Hover Text Color" content="#171717" />
  97. <meta name="color:Dark Date Text Color" content="#e2e2e2" />
  98. <meta name="color:Dark Date Primary Link Color" content="#ffffff">
  99. <meta name="color:Dark Date Primary Background Color" content="#151515" />
  100. <meta name="color:Dark Date Secondary Link Color" content="#ffffff">
  101. <meta name="color:Dark Date Secondary Background Color" content="#151515" />
  102. <meta name="color:Dark Tags Link Color" content="#f6cf6a">
  103. <meta name="color:Dark Liked Link Color" content="#f6cf6a">
  104. <meta name="color:Dark Posts Background Color" content="#191919" />
  105. <meta name="color:Dark Borders Color" content="#202020" />
  106. <meta name="color:Dark Scrollbar Color" content="#f6cf6a" />
  107. <meta name="color:Dark Tumblr Controls Icon Color" content="#f6cf6a" />
  108.  
  109. <!-- text, font style and sizes options -->
  110. <meta name="text:Body Font Family" content="Hind Siliguri" />
  111. <meta name="text:Sidebar Title Font Family" content="Poppins" />
  112. <meta name="text:Posts Title Font Family" content="Poppins" />
  113.  
  114. <meta name="select:Body Font Size" content="1.1rem" title="11px" />
  115. <meta name="select:Body Font Size" content="0.8rem" title="8px" />
  116. <meta name="select:Body Font Size" content="0.9rem" title="9px" />
  117. <meta name="select:Body Font Size" content="1rem" title="10px" />
  118. <meta name="select:Body Font Size" content="1.2rem" title="12px" />
  119. <meta name="select:Body Font Size" content="1.3rem" title="13px" />
  120. <meta name="select:Body Font Size" content="1.4rem" title="14px" />
  121. <meta name="select:Body Font Size" content="1.5rem" title="15px" />
  122. <meta name="select:Body Font Size" content="1.6rem" title="16px" />
  123. <meta name="select:Body Font Size" content="1.7rem" title="17px" />
  124. <meta name="select:Body Font Size" content="1.8rem" title="18px" />
  125.  
  126. <meta name="select:Body Font Letter Spacing" content="0.015rem" title="0.15px" />
  127. <meta name="select:Body Font Letter Spacing" content="normal" title="none" />
  128. <meta name="select:Body Font Letter Spacing" content="0.025rem" title="0.25px" />
  129. <meta name="select:Body Font Letter Spacing" content="0.075rem" title="0.75px" />
  130. <meta name="select:Body Font Letter Spacing" content="0.08rem" title="0.80px" />
  131. <meta name="select:Body Font Letter Spacing" content="0.085rem" title="0.85px" />
  132. <meta name="select:Body Font Letter Spacing" content="0.09rem" title="0.90px" />
  133. <meta name="select:Body Font Letter Spacing" content="0.095rem" title="0.95px" />
  134. <meta name="select:Body Font Letter Spacing" content="0.1rem" title="1px" />
  135. <meta name="select:Body Font Letter Spacing" content="0.2rem" title="2px" />
  136. <meta name="select:Body Font Letter Spacing" content="0.3rem" title="3px" />
  137.  
  138. <meta name="select:Body Font Word Spacing" content="normal" title="none" />
  139. <meta name="select:Body Font Word Spacing" content="0.015rem" title="0.15px" />
  140. <meta name="select:Body Font Word Spacing" content="0.025rem" title="0.25px" />
  141. <meta name="select:Body Font Word Spacing" content="0.075rem" title="0.75px" />
  142. <meta name="select:Body Font Word Spacing" content="0.08rem" title="0.80px" />
  143. <meta name="select:Body Font Word Spacing" content="0.085rem" title="0.85px" />
  144. <meta name="select:Body Font Word Spacing" content="0.09rem" title="0.90px" />
  145. <meta name="select:Body Font Word Spacing" content="0.095rem" title="0.95px" />
  146. <meta name="select:Body Font Word Spacing" content="0.1rem" title="1px" />
  147. <meta name="select:Body Font Word Spacing" content="0.2rem" title="2px" />
  148. <meta name="select:Body Font Word Spacing" content="0.3rem" title="3px" />
  149.  
  150. <meta name="select:Body Font Weight" content="400" title="normal" />
  151. <meta name="select:Body Font Weight" content="700" title="bold" />
  152. <meta name="select:Body Font Weight" content="300" title="light" />
  153. <meta name="select:Body Font Weight" content="500" title="medium" />
  154. <meta name="select:Body Font Weight" content="600" title="semi-bold" />
  155.  
  156. <meta name="select:Bold Font Weight" content="500" title="medium" />
  157. <meta name="select:Bold Font Weight" content="700" title="bold" />
  158. <meta name="select:Bold Font Weight" content="300" title="light" />
  159. <meta name="select:Bold Font Weight" content="400" title="normal" />
  160. <meta name="select:Bold Font Weight" content="600" title="semi-bold" />
  161.  
  162. <meta name="select:Posts Text Position" content="left">
  163. <meta name="select:Posts Text Position" content="justify">
  164.  
  165. <!-- posts titles (h1, h2, h3, h4, h5, h6) -->
  166. <meta name="select:Posts Titles Font Size" content="1.4rem" title="14px" />
  167. <meta name="select:Posts Titles Font Size" content="1rem" title="10px" />
  168. <meta name="select:Posts Titles Font Size" content="1.1rem" title="11px" />
  169. <meta name="select:Posts Titles Font Size" content="1.2rem" title="12px" />
  170. <meta name="select:Posts Titles Font Size" content="1.3rem" title="13px" />
  171. <meta name="select:Posts Titles Font Size" content="1.5rem" title="15px" />
  172. <meta name="select:Posts Titles Font Size" content="1.6rem" title="16px" />
  173. <meta name="select:Posts Titles Font Size" content="1.7rem" title="17px" />
  174. <meta name="select:Posts Titles Font Size" content="1.8rem" title="18px" />
  175.  
  176. <meta name="select:Posts Titles Font Letter Spacing" content="normal" title="none" />
  177. <meta name="select:Posts Titles Font Letter Spacing" content="0.015rem" title="0.15px" />
  178. <meta name="select:Posts Titles Font Letter Spacing" content="0.025rem" title="0.25px" />
  179. <meta name="select:Posts Titles Font Letter Spacing" content="0.075rem" title="0.75px" />
  180. <meta name="select:Posts Titles Font Letter Spacing" content="0.08rem" title="0.80px" />
  181. <meta name="select:Posts Titles Font Letter Spacing" content="0.085rem" title="0.85px" />
  182. <meta name="select:Posts Titles Font Letter Spacing" content="0.09rem" title="0.90px" />
  183. <meta name="select:Posts Titles Font Letter Spacing" content="0.095rem" title="0.95px" />
  184. <meta name="select:Posts Titles Font Letter Spacing" content="0.1rem" title="1px" />
  185. <meta name="select:Posts Titles Font Letter Spacing" content="0.2rem" title="2px" />
  186. <meta name="select:Posts Titles Font Letter Spacing" content="0.3rem" title="3px" />
  187.  
  188. <meta name="select:Posts Titles Font Word Spacing" content="normal" title="none" />
  189. <meta name="select:Posts Titles Font Word Spacing" content="0.015rem" title="0.15px" />
  190. <meta name="select:Posts Titles Font Word Spacing" content="0.025rem" title="0.25px" />
  191. <meta name="select:Posts Titles Font Word Spacing" content="0.075rem" title="0.75px" />
  192. <meta name="select:Posts Titles Font Word Spacing" content="0.08rem" title="0.80px" />
  193. <meta name="select:Posts Titles Font Word Spacing" content="0.085rem" title="0.85px" />
  194. <meta name="select:Posts Titles Font Word Spacing" content="0.09rem" title="0.90px" />
  195. <meta name="select:Posts Titles Font Word Spacing" content="0.095rem" title="0.95px" />
  196. <meta name="select:Posts Titles Font Word Spacing" content="0.1rem" title="1px" />
  197. <meta name="select:Posts Titles Font Word Spacing" content="0.2rem" title="2px" />
  198. <meta name="select:Posts Titles Font Word Spacing" content="0.3rem" title="3px" />
  199.  
  200. <meta name="select:Posts Titles Font Weight" content="700" title="bold" />
  201. <meta name="select:Posts Titles Font Weight" content="300" title="light" />
  202. <meta name="select:Posts Titles Font Weight" content="400" title="normal" />
  203. <meta name="select:Posts Titles Font Weight" content="500" title="medium" />
  204. <meta name="select:Posts Titles Font Weight" content="600" title="semi-bold" />
  205.  
  206. <meta name="select:Posts Titles Font Style" content="normal">
  207. <meta name="select:Posts Titles Font Style" content="italic">
  208.  
  209. <meta name="select:Posts Titles Text Transform" content="none">
  210. <meta name="select:Posts Titles Text Transform" content="uppercase">
  211. <meta name="select:Posts Titles Text Transform" content="lowercase">
  212. <meta name="select:Posts Titles Text Transform" content="capitalize">
  213.  
  214. <meta name="select:Posts Titles Text Position" content="left">
  215. <meta name="select:Posts Titles Text Position" content="center">
  216. <meta name="select:Posts Titles Text Position" content="justify">
  217. <meta name="select:Posts Titles Text Position" content="right">
  218.  
  219.  
  220. <!-- sidebar position -->
  221. <meta name="select:Sidebar Content Position" content="center" title="center">
  222. <meta name="select:Sidebar Content Position" content="flex-start" title="top">
  223.  
  224.  
  225. <!-- sidebar title -->
  226. <meta name="select:Sidebar Title Font Size" content="1.4rem" title="14px" />
  227. <meta name="select:Sidebar Title Font Size" content="0.8rem" title="8px" />
  228. <meta name="select:Sidebar Title Font Size" content="0.9rem" title="9px" />
  229. <meta name="select:Sidebar Title Font Size" content="1rem" title="10px" />
  230. <meta name="select:Sidebar Title Font Size" content="1.1rem" title="11px" />
  231. <meta name="select:Sidebar Title Font Size" content="1.2rem" title="12px" />
  232. <meta name="select:Sidebar Title Font Size" content="1.3rem" title="13px" />
  233. <meta name="select:Sidebar Title Font Size" content="1.5rem" title="15px" />
  234. <meta name="select:Sidebar Title Font Size" content="1.6rem" title="16px" />
  235. <meta name="select:Sidebar Title Font Size" content="1.7rem" title="17px" />
  236. <meta name="select:Sidebar Title Font Size" content="1.8rem" title="18px" />
  237.  
  238. <meta name="select:Sidebar Title Font Letter Spacing" content="normal" title="none" />
  239. <meta name="select:Sidebar Title Font Letter Spacing" content="0.015rem" title="0.15px" />
  240. <meta name="select:Sidebar Title Font Letter Spacing" content="0.025rem" title="0.25px" />
  241. <meta name="select:Sidebar Title Font Letter Spacing" content="0.075rem" title="0.75px" />
  242. <meta name="select:Sidebar Title Font Letter Spacing" content="0.08rem" title="0.80px" />
  243. <meta name="select:Sidebar Title Font Letter Spacing" content="0.085rem" title="0.85px" />
  244. <meta name="select:Sidebar Title Font Letter Spacing" content="0.09rem" title="0.90px" />
  245. <meta name="select:Sidebar Title Font Letter Spacing" content="0.095rem" title="0.95px" />
  246. <meta name="select:Sidebar Title Font Letter Spacing" content="0.1rem" title="1px" />
  247. <meta name="select:Sidebar Title Font Letter Spacing" content="0.2rem" title="2px" />
  248. <meta name="select:Sidebar Title Font Letter Spacing" content="0.3rem" title="3px" />
  249.  
  250. <meta name="select:Sidebar Title Font Word Spacing" content="normal" title="none" />
  251. <meta name="select:Sidebar Title Font Word Spacing" content="0.015rem" title="0.15px" />
  252. <meta name="select:Sidebar Title Font Word Spacing" content="0.025rem" title="0.25px" />
  253. <meta name="select:Sidebar Title Font Word Spacing" content="0.075rem" title="0.75px" />
  254. <meta name="select:Sidebar Title Font Word Spacing" content="0.08rem" title="0.80px" />
  255. <meta name="select:Sidebar Title Font Word Spacing" content="0.085rem" title="0.85px" />
  256. <meta name="select:Sidebar Title Font Word Spacing" content="0.09rem" title="0.90px" />
  257. <meta name="select:Sidebar Title Font Word Spacing" content="0.095rem" title="0.95px" />
  258. <meta name="select:Sidebar Title Font Word Spacing" content="0.1rem" title="1px" />
  259. <meta name="select:Sidebar Title Font Word Spacing" content="0.2rem" title="2px" />
  260. <meta name="select:Sidebar Title Font Word Spacing" content="0.3rem" title="3px" />
  261.  
  262. <meta name="select:Sidebar Title Font Weight" content="500" title="medium" />
  263. <meta name="select:Sidebar Title Font Weight" content="700" title="bold" />
  264. <meta name="select:Sidebar Title Font Weight" content="400" title="normal" />
  265. <meta name="select:Sidebar Title Font Weight" content="300" title="light" />
  266. <meta name="select:Sidebar Title Font Weight" content="600" title="semi-bold" />
  267.  
  268.  
  269. <meta name="select:Sidebar Title Font Style" content="normal">
  270. <meta name="select:Sidebar Title Font Style" content="italic">
  271.  
  272. <meta name="select:Sidebar Title Text Transform" content="none">
  273. <meta name="select:Sidebar Title Text Transform" content="uppercase">
  274. <meta name="select:Sidebar Title Text Transform" content="lowercase">
  275. <meta name="select:Sidebar Title Text Transform" content="capitalize">
  276.  
  277. <meta name="select:Sidebar Title Text Position" content="left" />
  278. <meta name="select:Sidebar Title Text Position" content="center" />
  279. <meta name="select:Sidebar Title Text Position" content="right" />
  280.  
  281. <!-- sidebar links icons -->
  282. <meta name="select:Sidebar Link Icons Size" content="1.1rem" title="11px" />
  283. <meta name="select:Sidebar Link Icons Size" content="1rem" title="10px" />
  284. <meta name="select:Sidebar Link Icons Size" content="0.8rem" title="8px" />
  285. <meta name="select:Sidebar Link Icons Size" content="0.9rem" title="9px" />
  286. <meta name="select:Sidebar Link Icons Size" content="1.2rem" title="12px" />
  287. <meta name="select:Sidebar Link Icons Size" content="1.3rem" title="13px" />
  288. <meta name="select:Sidebar Link Icons Size" content="1.4rem" title="14px" />
  289. <meta name="select:Sidebar Link Icons Size" content="1.5rem" title="15px" />
  290. <meta name="select:Sidebar Link Icons Size" content="1.6rem" title="16px" />
  291. <meta name="select:Sidebar Link Icons Size" content="1.7rem" title="17px" />
  292. <meta name="select:Sidebar Link Icons Size" content="1.8rem" title="18px" />
  293.  
  294. <meta name="select:Sidebar Link Icons Position" content="center" title="center" />
  295. <meta name="select:Sidebar Link Icons Position" content="flex-start" title="top" />
  296. <meta name="select:Sidebar Link Icons Position" content="flex-end" title="bottom" />
  297.  
  298. <!-- sidebar links text -->
  299. <meta name="select:Sidebar Link Font Size" content="1.1rem" title="11px" />
  300. <meta name="select:Sidebar Link Font Size" content="1rem" title="10px" />
  301. <meta name="select:Sidebar Link Font Size" content="0.8rem" title="8px" />
  302. <meta name="select:Sidebar Link Font Size" content="0.9rem" title="9px" />
  303. <meta name="select:Sidebar Link Font Size" content="1.2rem" title="12px" />
  304. <meta name="select:Sidebar Link Font Size" content="1.3rem" title="13px" />
  305. <meta name="select:Sidebar Link Font Size" content="1.4rem" title="14px" />
  306. <meta name="select:Sidebar Link Font Size" content="1.5rem" title="15px" />
  307. <meta name="select:Sidebar Link Font Size" content="1.6rem" title="16px" />
  308. <meta name="select:Sidebar Link Font Size" content="1.7rem" title="17px" />
  309. <meta name="select:Sidebar Link Font Size" content="1.8rem" title="18px" />
  310.  
  311. <meta name="select:Sidebar Link Font Letter Spacing" content="0.015rem" title="0.15px" />
  312. <meta name="select:Sidebar Link Font Letter Spacing" content="normal" title="none" />
  313. <meta name="select:Sidebar Link Font Letter Spacing" content="0.025rem" title="0.25px" />
  314. <meta name="select:Sidebar Link Font Letter Spacing" content="0.075rem" title="0.75px" />
  315. <meta name="select:Sidebar Link Font Letter Spacing" content="0.08rem" title="0.80px" />
  316. <meta name="select:Sidebar Link Font Letter Spacing" content="0.085rem" title="0.85px" />
  317. <meta name="select:Sidebar Link Font Letter Spacing" content="0.09rem" title="0.90px" />
  318. <meta name="select:Sidebar Link Font Letter Spacing" content="0.095rem" title="0.95px" />
  319. <meta name="select:Sidebar Link Font Letter Spacing" content="0.1rem" title="1px" />
  320. <meta name="select:Sidebar Link Font Letter Spacing" content="0.2rem" title="2px" />
  321. <meta name="select:Sidebar Link Font Letter Spacing" content="0.3rem" title="3px" />
  322.  
  323. <meta name="select:Sidebar Link Font Word Spacing" content="normal" title="none" />
  324. <meta name="select:Sidebar Link Font Word Spacing" content="0.015rem" title="0.15px" />
  325. <meta name="select:Sidebar Link Font Word Spacing" content="0.025rem" title="0.25px" />
  326. <meta name="select:Sidebar Link Font Word Spacing" content="0.075rem" title="0.75px" />
  327. <meta name="select:Sidebar Link Font Word Spacing" content="0.08rem" title="0.80px" />
  328. <meta name="select:Sidebar Link Font Word Spacing" content="0.085rem" title="0.85px" />
  329. <meta name="select:Sidebar Link Font Word Spacing" content="0.09rem" title="0.90px" />
  330. <meta name="select:Sidebar Link Font Word Spacing" content="0.095rem" title="0.95px" />
  331. <meta name="select:Sidebar Link Font Word Spacing" content="0.1rem" title="1px" />
  332. <meta name="select:Sidebar Link Font Word Spacing" content="0.2rem" title="2px" />
  333. <meta name="select:Sidebar Link Font Word Spacing" content="0.3rem" title="3px" />
  334.  
  335.  
  336. <meta name="select:Sidebar Link Font Weight" content="400" title="normal" />
  337. <meta name="select:Sidebar Link Font Weight" content="700" title="bold" />
  338. <meta name="select:Sidebar Link Font Weight" content="300" title="light" />
  339. <meta name="select:Sidebar Link Font Weight" content="500" title="medium" />
  340. <meta name="select:Sidebar Link Font Weight" content="600" title="semi-bold" />
  341.  
  342. <meta name="select:Sidebar Link Font Style" content="normal" />
  343. <meta name="select:Sidebar Link Font Style" content="italic" />
  344.  
  345. <meta name="select:Sidebar Link Text Transform" content="none">
  346. <meta name="select:Sidebar Link Text Transform" content="uppercase">
  347. <meta name="select:Sidebar Link Text Transform" content="lowercase">
  348. <meta name="select:Sidebar Link Text Transform" content="capitalize">
  349.  
  350. <meta name="select:Sidebar Link Text Position" content="left" title="left" />
  351. <meta name="select:Sidebar Link Text Position" content="center" title="center" />
  352. <meta name="select:Sidebar Link Text Position" content="right" title="right" />
  353.  
  354.  
  355. <!-- description -->
  356. <meta name="select:Description Font Size" content="1.1rem" title="11px" />
  357. <meta name="select:Description Font Size" content="1rem" title="10px" />
  358. <meta name="select:Description Font Size" content="0.8rem" title="8px" />
  359. <meta name="select:Description Font Size" content="0.9rem" title="9px" />
  360. <meta name="select:Description Font Size" content="1.2rem" title="12px" />
  361. <meta name="select:Description Font Size" content="1.3rem" title="13px" />
  362. <meta name="select:Description Font Size" content="1.4rem" title="14px" />
  363. <meta name="select:Description Font Size" content="1.5rem" title="15px" />
  364. <meta name="select:Description Font Size" content="1.6rem" title="16px" />
  365. <meta name="select:Description Font Size" content="1.7rem" title="17px" />
  366. <meta name="select:Description Font Size" content="1.8rem" title="18px" />
  367.  
  368. <meta name="select:Description Font Letter Spacing" content="0.015rem" title="0.15px" />
  369. <meta name="select:Description Font Letter Spacing" content="normal" title="none" />
  370. <meta name="select:Description Font Letter Spacing" content="0.025rem" title="0.25px" />
  371. <meta name="select:Description Font Letter Spacing" content="0.075rem" title="0.75px" />
  372. <meta name="select:Description Font Letter Spacing" content="0.08rem" title="0.80px" />
  373. <meta name="select:Description Font Letter Spacing" content="0.085rem" title="0.85px" />
  374. <meta name="select:Description Font Letter Spacing" content="0.09rem" title="0.90px" />
  375. <meta name="select:Description Font Letter Spacing" content="0.095rem" title="0.95px" />
  376. <meta name="select:Description Font Letter Spacing" content="0.1rem" title="1px" />
  377. <meta name="select:Description Font Letter Spacing" content="0.2rem" title="2px" />
  378. <meta name="select:Description Font Letter Spacing" content="0.3rem" title="3px" />
  379.  
  380. <meta name="select:Description Font Word Spacing" content="normal" title="none" />
  381. <meta name="select:Description Font Word Spacing" content="0.015rem" title="0.15px" />
  382. <meta name="select:Description Font Word Spacing" content="0.025rem" title="0.25px" />
  383. <meta name="select:Description Font Word Spacing" content="0.075rem" title="0.75px" />
  384. <meta name="select:Description Font Word Spacing" content="0.08rem" title="0.80px" />
  385. <meta name="select:Description Font Word Spacing" content="0.085rem" title="0.85px" />
  386. <meta name="select:Description Font Word Spacing" content="0.09rem" title="0.90px" />
  387. <meta name="select:Description Font Word Spacing" content="0.095rem" title="0.95px" />
  388. <meta name="select:Description Font Word Spacing" content="0.1rem" title="1px" />
  389. <meta name="select:Description Font Word Spacing" content="0.2rem" title="2px" />
  390. <meta name="select:Description Font Word Spacing" content="0.3rem" title="3px" />
  391.  
  392.  
  393. <meta name="select:Description Font Weight" content="400" title="normal" />
  394. <meta name="select:Description Font Weight" content="700" title="bold" />
  395. <meta name="select:Description Font Weight" content="300" title="light" />
  396. <meta name="select:Description Font Weight" content="500" title="medium" />
  397. <meta name="select:Description Font Weight" content="600" title="semi-bold" />
  398.  
  399. <meta name="select:Description Font Style" content="normal" />
  400. <meta name="select:Description Font Style" content="italic" />
  401.  
  402. <meta name="select:Description Text Transform" content="none">
  403. <meta name="select:Description Text Transform" content="uppercase">
  404. <meta name="select:Description Text Transform" content="lowercase">
  405. <meta name="select:Description Text Transform" content="capitalize">
  406.  
  407. <meta name="select:Description Text Horizontal Position" content="left" title="left" />
  408. <meta name="select:Description Text Horizontal Position" content="center" title="center" />
  409. <meta name="select:Description Text Horizontal Position" content="right" title="right" />
  410.  
  411. <meta name="select:Description Text Vertical Position" content="center" title="center" />
  412. <meta name="select:Description Text Vertical Position" content="flex-start" title="top" />
  413. <meta name="select:Description Text Vertical Position" content="flex-end" title="bottom" />
  414.  
  415.  
  416. <!-- pagination links -->
  417. <meta name="select:Pagination Links Font Size" content="1.1rem" title="11px" />
  418. <meta name="select:Pagination Links Font Size" content="1rem" title="10px" />
  419. <meta name="select:Pagination Links Font Size" content="0.8rem" title="8px" />
  420. <meta name="select:Pagination Links Font Size" content="0.9rem" title="9px" />
  421. <meta name="select:Pagination Links Font Size" content="1.2rem" title="12px" />
  422. <meta name="select:Pagination Links Font Size" content="1.3rem" title="13px" />
  423. <meta name="select:Pagination Links Font Size" content="1.4rem" title="14px" />
  424. <meta name="select:Pagination Links Font Size" content="1.5rem" title="15px" />
  425. <meta name="select:Pagination Links Font Size" content="1.6rem" title="16px" />
  426. <meta name="select:Pagination Links Font Size" content="1.7rem" title="17px" />
  427. <meta name="select:Pagination Links Font Size" content="1.8rem" title="18px" />
  428.  
  429. <meta name="select:Pagination Font Letter Spacing" content="0.015rem" title="0.15px" />
  430. <meta name="select:Pagination Font Letter Spacing" content="normal" title="none" />
  431. <meta name="select:Pagination Font Letter Spacing" content="0.025rem" title="0.25px" />
  432. <meta name="select:Pagination Font Letter Spacing" content="0.075rem" title="0.75px" />
  433. <meta name="select:Pagination Font Letter Spacing" content="0.08rem" title="0.80px" />
  434. <meta name="select:Pagination Font Letter Spacing" content="0.085rem" title="0.85px" />
  435. <meta name="select:Pagination Font Letter Spacing" content="0.09rem" title="0.90px" />
  436. <meta name="select:Pagination Font Letter Spacing" content="0.095rem" title="0.95px" />
  437. <meta name="select:Pagination Font Letter Spacing" content="0.1rem" title="1px" />
  438. <meta name="select:Pagination Font Letter Spacing" content="0.2rem" title="2px" />
  439. <meta name="select:Pagination Font Letter Spacing" content="0.3rem" title="3px" />
  440.  
  441. <meta name="select:Pagination Font Word Spacing" content="normal" title="none" />
  442. <meta name="select:Pagination Font Word Spacing" content="0.015rem" title="0.15px" />
  443. <meta name="select:Pagination Font Word Spacing" content="0.025rem" title="0.25px" />
  444. <meta name="select:Pagination Font Word Spacing" content="0.075rem" title="0.75px" />
  445. <meta name="select:Pagination Font Word Spacing" content="0.08rem" title="0.80px" />
  446. <meta name="select:Pagination Font Word Spacing" content="0.085rem" title="0.85px" />
  447. <meta name="select:Pagination Font Word Spacing" content="0.09rem" title="0.90px" />
  448. <meta name="select:Pagination Font Word Spacing" content="0.095rem" title="0.95px" />
  449. <meta name="select:Pagination Font Word Spacing" content="0.1rem" title="1px" />
  450. <meta name="select:Pagination Font Word Spacing" content="0.2rem" title="2px" />
  451. <meta name="select:Pagination Font Word Spacing" content="0.3rem" title="3px" />
  452.  
  453.  
  454. <meta name="select:Pagination Links Font Weight" content="400" title="normal" />
  455. <meta name="select:Pagination Links Font Weight" content="700" title="bold" />
  456. <meta name="select:Pagination Links Font Weight" content="300" title="light" />
  457. <meta name="select:Pagination Links Font Weight" content="500" title="medium" />
  458. <meta name="select:Pagination Links Font Weight" content="600" title="semi-bold" />
  459.  
  460. <meta name="select:Pagination Links Font Style" content="normal" />
  461. <meta name="select:Pagination Links Font Style" content="italic" />
  462.  
  463. <meta name="select:Pagination Links Text Transform" content="lowercase" />
  464. <meta name="select:Pagination Links Text Transform" content="none" />
  465. <meta name="select:Pagination Links Text Transform" content="uppercase" />
  466. <meta name="select:Pagination Links Text Transform" content="capitalize" />
  467.  
  468. <!-- date / post info -->
  469. <meta name="select:Date Font Size" content="1.1rem" title="11px" />
  470. <meta name="select:Date Font Size" content="1rem" title="10px" />
  471. <meta name="select:Date Font Size" content="0.8rem" title="8px" />
  472. <meta name="select:Date Font Size" content="0.9rem" title="9px" />
  473. <meta name="select:Date Font Size" content="1.2rem" title="12px" />
  474. <meta name="select:Date Font Size" content="1.3rem" title="13px" />
  475. <meta name="select:Date Font Size" content="1.4rem" title="14px" />
  476. <meta name="select:Date Font Size" content="1.5rem" title="15px" />
  477. <meta name="select:Date Font Size" content="1.6rem" title="16px" />
  478. <meta name="select:Date Font Size" content="1.7rem" title="17px" />
  479. <meta name="select:Date Font Size" content="1.8rem" title="18px" />
  480.  
  481. <meta name="select:Date Font Letter Spacing" content="0.015rem" title="0.15px" />
  482. <meta name="select:Date Font Letter Spacing" content="normal" title="none" />
  483. <meta name="select:Date Font Letter Spacing" content="0.025rem" title="0.25px" />
  484. <meta name="select:Date Font Letter Spacing" content="0.075rem" title="0.75px" />
  485. <meta name="select:Date Font Letter Spacing" content="0.08rem" title="0.80px" />
  486. <meta name="select:Date Font Letter Spacing" content="0.085rem" title="0.85px" />
  487. <meta name="select:Date Font Letter Spacing" content="0.09rem" title="0.90px" />
  488. <meta name="select:Date Font Letter Spacing" content="0.095rem" title="0.95px" />
  489. <meta name="select:Date Font Letter Spacing" content="0.1rem" title="1px" />
  490. <meta name="select:Date Font Letter Spacing" content="0.2rem" title="2px" />
  491. <meta name="select:Date Font Letter Spacing" content="0.3rem" title="3px" />
  492.  
  493. <meta name="select:Date Font Word Spacing" content="normal" title="none" />
  494. <meta name="select:Date Font Word Spacing" content="0.015rem" title="0.15px" />
  495. <meta name="select:Date Font Word Spacing" content="0.025rem" title="0.25px" />
  496. <meta name="select:Date Font Word Spacing" content="0.075rem" title="0.75px" />
  497. <meta name="select:Date Font Word Spacing" content="0.08rem" title="0.80px" />
  498. <meta name="select:Date Font Word Spacing" content="0.085rem" title="0.85px" />
  499. <meta name="select:Date Font Word Spacing" content="0.09rem" title="0.90px" />
  500. <meta name="select:Date Font Word Spacing" content="0.095rem" title="0.95px" />
  501. <meta name="select:Date Font Word Spacing" content="0.1rem" title="1px" />
  502. <meta name="select:Date Font Word Spacing" content="0.2rem" title="2px" />
  503. <meta name="select:Date Font Word Spacing" content="0.3rem" title="3px" />
  504.  
  505. <meta name="select:Date Font Weight" content="500" title="medium" />
  506. <meta name="select:Date Font Weight" content="700" title="bold" />
  507. <meta name="select:Date Font Weight" content="400" title="normal" />
  508. <meta name="select:Date Font Weight" content="300" title="light" />
  509. <meta name="select:Date Font Weight" content="600" title="semi-bold" />
  510.  
  511. <meta name="select:Date Font Style" content="normal" />
  512. <meta name="select:Date Font Style" content="italic" />
  513.  
  514. <meta name="select:Date Text Transform" content="lowercase" />
  515. <meta name="select:Date Text Transform" content="none" />
  516. <meta name="select:Date Text Transform" content="uppercase" />
  517. <meta name="select:Date Text Transform" content="capitalize" />
  518.  
  519.  
  520. <!-- tags / post info -->
  521. <meta name="select:Tags Font Size" content="1.1rem" title="11px" />
  522. <meta name="select:Tags Font Size" content="1rem" title="10px" />
  523. <meta name="select:Tags Font Size" content="0.8rem" title="8px" />
  524. <meta name="select:Tags Font Size" content="0.9rem" title="9px" />
  525. <meta name="select:Tags Font Size" content="1.2rem" title="12px" />
  526. <meta name="select:Tags Font Size" content="1.3rem" title="13px" />
  527. <meta name="select:Tags Font Size" content="1.4rem" title="14px" />
  528. <meta name="select:Tags Font Size" content="1.5rem" title="15px" />
  529. <meta name="select:Tags Font Size" content="1.6rem" title="16px" />
  530. <meta name="select:Tags Font Size" content="1.7rem" title="17px" />
  531. <meta name="select:Tags Font Size" content="1.8rem" title="18px" />
  532.  
  533. <meta name="select:Tags Font Letter Spacing" content="0.015rem" title="0.15px" />
  534. <meta name="select:Tags Font Letter Spacing" content="normal" title="none" />
  535. <meta name="select:Tags Font Letter Spacing" content="0.025rem" title="0.25px" />
  536. <meta name="select:Tags Font Letter Spacing" content="0.075rem" title="0.75px" />
  537. <meta name="select:Tags Font Letter Spacing" content="0.08rem" title="0.80px" />
  538. <meta name="select:Tags Font Letter Spacing" content="0.085rem" title="0.85px" />
  539. <meta name="select:Tags Font Letter Spacing" content="0.09rem" title="0.90px" />
  540. <meta name="select:Tags Font Letter Spacing" content="0.095rem" title="0.95px" />
  541. <meta name="select:Tags Font Letter Spacing" content="0.1rem" title="1px" />
  542. <meta name="select:Tags Font Letter Spacing" content="0.2rem" title="2px" />
  543. <meta name="select:Tags Font Letter Spacing" content="0.3rem" title="3px" />
  544.  
  545. <meta name="select:Tags Font Word Spacing" content="normal" title="none" />
  546. <meta name="select:Tags Font Word Spacing" content="0.015rem" title="0.15px" />
  547. <meta name="select:Tags Font Word Spacing" content="0.025rem" title="0.25px" />
  548. <meta name="select:Tags Font Word Spacing" content="0.075rem" title="0.75px" />
  549. <meta name="select:Tags Font Word Spacing" content="0.08rem" title="0.80px" />
  550. <meta name="select:Tags Font Word Spacing" content="0.085rem" title="0.85px" />
  551. <meta name="select:Tags Font Word Spacing" content="0.09rem" title="0.90px" />
  552. <meta name="select:Tags Font Word Spacing" content="0.095rem" title="0.95px" />
  553. <meta name="select:Tags Font Word Spacing" content="0.1rem" title="1px" />
  554. <meta name="select:Tags Font Word Spacing" content="0.2rem" title="2px" />
  555. <meta name="select:Tags Font Word Spacing" content="0.3rem" title="3px" />
  556.  
  557. <meta name="select:Tags Font Weight" content="400" title="normal" />
  558. <meta name="select:Tags Font Weight" content="300" title="light" />
  559. <meta name="select:Tags Font Weight" content="500" title="medium" />
  560. <meta name="select:Tags Font Weight" content="600" title="semi-bold" />
  561. <meta name="select:Tags Font Weight" content="700" title="bold" />
  562.  
  563. <meta name="select:Tags Font Style" content="normal" />
  564. <meta name="select:Tags Font Style" content="italic" />
  565.  
  566. <meta name="select:Tags Text Transform" content="none" />
  567. <meta name="select:Tags Text Transform" content="uppercase" />
  568. <meta name="select:Tags Text Transform" content="lowercase" />
  569. <meta name="select:Tags Text Transform" content="capitalize" />
  570.  
  571. <meta name="select:Tags Text Position" content="left" />
  572. <meta name="select:Tags Text Position" content="center" />
  573. <meta name="select:Tags Text Position" content="right" />
  574.  
  575.  
  576. <!--posts sizes-->
  577. <meta name="select:Post Width" content="54rem" title="540px" />
  578. <meta name="select:Post Width" content="50rem" title="500px" />
  579. <meta name="select:Post Width" content="40rem" title="400px" />
  580.  
  581. <meta name="select:Photoset Gutter" content="0.44rem" title="For 540px" />
  582. <meta name="select:Photoset Gutter" content="1rem" title="For 500px" />
  583. <meta name="select:Photoset Gutter" content="0.2rem" title="For 400px" />
  584.  
  585. <meta name="text:Posts Margin" content="9.5rem" />
  586. <meta name="text:Posts Padding" content="0rem" />
  587.  
  588. <!--posts box shadow-->
  589. <meta name="text:Box Shadow Size" content="0px 0.4rem 0.8rem" />
  590. <meta name="text:Box Shadow Color" content="0, 0, 0, 0.1" />
  591.  
  592. <!-- sidebar and posts borders -->
  593. <meta name="select:Borders Size" content="0.1rem" title="1px" />
  594. <meta name="select:Borders Size" content="0rem" title="0px" />
  595. <meta name="select:Borders Size" content="0.2rem" title="2px" />
  596. <meta name="select:Borders Size" content="0.3rem" title="3px" />
  597. <meta name="select:Borders Size" content="0.4rem" title="4px" />
  598. <meta name="select:Borders Size" content="0.5rem" title="5px" />
  599.  
  600. <meta name="select:Borders Style" content="solid" />
  601. <meta name="select:Borders Style" content="dotted" />
  602. <meta name="select:Borders Style" content="dashed" />
  603. <meta name="select:Borders Style" content="double" />
  604. <meta name="select:Borders Style" content="ridge" />
  605.  
  606.  
  607. <!-- sidebar image sizes and position -->
  608. <meta name="select:Sidebar Icon Image Size" content="10rem" title="100px" />
  609. <meta name="select:Sidebar Icon Image Size" content="6rem" title="60px" />
  610. <meta name="select:Sidebar Icon Image Size" content="7rem" title="70px" />
  611. <meta name="select:Sidebar Icon Image Size" content="8rem" title="80px" />
  612. <meta name="select:Sidebar Icon Image Size" content="9rem" title="90px" />
  613. <meta name="select:Sidebar Icon Image Size" content="17rem" title="160px" />
  614.  
  615. <meta name="select:Sidebar Image Position" content="center" />
  616. <meta name="select:Sidebar Image Position" content="left" />
  617. <meta name="select:Sidebar Image Position" content="right" />
  618.  
  619.  
  620. <!-- conditionals -->
  621. <meta name="if:Sidebar Image" content="1"/>
  622. <meta name="if:Sidebar Icon Image" content="0"/>
  623. <meta name="if:Sidebar Icon Square Style" content="0"/>
  624. <meta name="if:Sidebar Title" content="1"/>
  625. <meta name="if:Sidebar Links Text" content="0"/>
  626. <meta name="if:Show Pages Link" content="0"/>
  627. <meta name="if:Hide Description" content="0"/>
  628. <meta name="if:Disable Switch Theme Color" content="0" />
  629. <meta name="if:Custom Controls" content="1"/>
  630. <meta name="if:Links Underline Border" content="0" />
  631. <meta name="if:Tumblr Captions" content="1"/>
  632. <meta name="if:Caption Avatar" content="0" />
  633. <meta name="if:Custom Caption Icon" content="1" />
  634. <meta name="if:Username Original Post" content="1"/>
  635. <meta name="if:Show More Info Text" content="0"/>
  636. <meta name="if:Disable Show More Info" content="0"/>
  637. <meta name="if:Box Shadow" content="1" />
  638. <meta name="if:Show Borders" content="1" />
  639. <meta name="if:Images Black and White" content="0" />
  640.  
  641. <meta name="if:Sidebar Link 1" content="1" />
  642. <meta name="if:Sidebar Link 2" content="1" />
  643. <meta name="if:Sidebar Link 3" content="1" />
  644. <meta name="if:Sidebar Link 4" content="1" />
  645.  
  646.  
  647. <!--sidebar link-->
  648. <meta name="text:Home URL" content="/" />
  649. <meta name="text:Home Text" content="Home" />
  650. <meta name="text:Home Icon" content="home" />
  651.  
  652. <meta name="text:Ask URL" content="/ask" />
  653. <meta name="text:Ask Text" content="Ask" />
  654. <meta name="text:Ask Icon" content="mail" />
  655.  
  656. <meta name="text:Sidebar Link 1 URL" content="/" />
  657. <meta name="text:Sidebar Link 1 Text" content="Link 1" />
  658. <meta name="text:Sidebar Link 1 Icon" content="grid" />
  659.  
  660. <meta name="text:Sidebar Link 2 URL" content="/" />
  661. <meta name="text:Sidebar Link 2 Text" content="Link 2" />
  662. <meta name="text:Sidebar Link 2 Icon" content="trash" />
  663.  
  664. <meta name="text:Sidebar Link 3 URL" content="/" />
  665. <meta name="text:Sidebar Link 3 Text" content="Link 3" />
  666. <meta name="text:Sidebar Link 3 Icon" content="hash" />
  667.  
  668. <meta name="text:Sidebar Link 4 URL" content="/" />
  669. <meta name="text:Sidebar Link 4 Text" content="Link 4" />
  670. <meta name="text:Sidebar Link 4 Icon" content="edit" />
  671.  
  672. {/block:Hidden}
  673.  
  674. <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
  675. <link rel="shortcut icon" href="{Favicon}">
  676. <link rel="apple-touch-icon-precomposed" href="{PortraitURL-128}">
  677. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  678.  
  679. <!-- stylesheets -->
  680. <link href="https://static.tumblr.com/0siu224/1Eaqd80d8/normalize.css" rel="stylesheet"> <!-- reset html code -->
  681.  
  682. <link href="https://static.tumblr.com/0podkko/oDSpg7y88/photosets.css" rel="stylesheet"> <!-- photosets -->
  683.  
  684. <!-- custom icons -->
  685. <script src="https://unpkg.com/feather-icons"></script> <!-- custom icons -->
  686. <link href="//solrainha.github.io/saturnicons/saturnicons.css" rel="stylesheet"> <!-- custom icons -->
  687.  
  688. <!-- custom fonts -->
  689. <link
  690. href="https://fonts.googleapis.com/css2?family={text:Body Font Family}:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap"
  691. rel="stylesheet" />
  692. <link
  693. href="https://fonts.googleapis.com/css2?family={text:Sidebar Title Font Family}:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap"
  694. rel="stylesheet" />
  695. <link
  696. href="https://fonts.googleapis.com/css2?family={text:Posts Title Font Family}:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap"
  697. rel="stylesheet" />
  698.  
  699. <link rel="stylesheet" href="//npf-images-v3.github.io/recon.css"> <!-- npf images readjustment -->
  700.  
  701.  
  702. <style>
  703. :root {
  704. /* colors */
  705. --backgroundThemeColor: {color:Background Theme Color};
  706. --bodyTextColor: {color:Body Text Color};
  707. --bodyBoldColor: {color:Body Bold Color};
  708. --bodyItalicColor: {color:Body Italic Color};
  709. --bodyLinkColor: {color:Body Link Color};
  710. --bodyLinkHoverColor: {color:Body Link Hover Color};
  711. --sidebarTextColor: {color:Sidebar Text Color};
  712. --sidebarBoldColor: {color:Sidebar Bold Color};
  713. --sidebarItalicColor: {color:Sidebar Italic Color};
  714. --sidebarLinkIconsColor: {color:Sidebar Link Icons Color};
  715. --sidebarLinkTextColor: {color:Sidebar Link Text Color};
  716. --sidebarTitleColor: {color:Sidebar Title Color};
  717. --sidebarPrimaryLinkColor: {color:Sidebar Primary Link Color};
  718. --sidebarPrimaryBackgroundColor: {color:Sidebar Primary Background Color};
  719. --sidebarSecondaryLinkColor: {color:Sidebar Secondary Link Color};
  720. --sidebarSecondaryBackgroundColor: {color:Sidebar Secondary Background Color};
  721. --hoverTextBackgroundColor: {color:Hover Text Background Color};
  722. --hoverTextColor: {color:Hover Text Color};
  723. --datePrimaryLinkColor:{color:Date Primary Link Color};
  724. --datePrimaryBackgroundColor: {color:Date Primary Background Color};
  725. --dateSecondaryLinkColor:{color:Date Secondary Link Color};
  726. --dateSecondaryBackgroundColor: {color:Date Secondary Background Color};
  727. --dateTextColor: {color:Date Text Color};
  728. --tagsLinkColor: {color:Tags Link Color};
  729. --likedLinkColor: {color:Liked Link Color};
  730. --scrollbarColor: {color:Scrollbar Color};
  731. --bordersColor: {color:Borders Color};
  732. --postsBackgroundColor: {color:Posts Background Color};
  733. --tumblrControlsIconColor: {color:Tumblr Controls Icon Color};
  734.  
  735. /* fonts, sizes, styles */
  736. --bodyFontFamily: {text:Body Font Family};
  737. --sidebarTitleFontFamily: {text:Sidebar Title Font Family};
  738. --postsTitleFontFamily: {text:Posts Title Font Family};
  739.  
  740. /* body */
  741. --bodyFontSize: {select:Body Font Size};
  742. --bodyFontLetterSpacing: {select:Body Font Letter Spacing};
  743. --bodyFontWordSpacing: {select:Body Font Word Spacing};
  744. --bodyFontWeight: {select:Body Font Weight};
  745. --boldFontWeight: {select:Bold Font Weight};
  746.  
  747. /*sidebar title*/
  748. --sidebarTitleFontSize: {select:Sidebar Title Font Size};
  749. --sidebarTitleFontLetterSpacing: {select:Sidebar Title Font Letter Spacing};
  750. --sidebarTitleFontWordSpacing: {select:Sidebar Title Font Word Spacing};
  751. --sidebarTitleFontWeight: {select:Sidebar Title Font Weight};
  752. --sidebarTitleTextTransform: {select:Sidebar Title Text Transform};
  753. --sidebarTitleFontStyle: {select:Sidebar Title Font Style};
  754. --sidebarTitleTextPosition: {select:Sidebar Title Text Position};
  755.  
  756. --sidebarTitleLineHeight: calc(var(--sidebarTitleFontSize) * 1.5);
  757.  
  758. /*description*/
  759. --descriptionFontSize: {select:Description Font Size};
  760. --descriptionFontLetterSpacing: {select:Description Font Letter Spacing};
  761. --descriptionFontWordSpacing: {select:Description Font Word Spacing};
  762. --descriptionFontWeight: {select:Description Font Weight};
  763. --descriptionTextTransform: {select:Description Text Transform};
  764. --descriptionFontStyle: {select:Description Font Style};
  765. --descriptionTextHorizontalPosition: {select:Description Text Horizontal Position};
  766. --descriptionTextVerticalPosition: {select:Description Text Vertical Position};
  767.  
  768.  
  769. --descriptionLineHeight: calc(var(--descriptionFontSize) * 1.3);
  770.  
  771.  
  772. /*sidebar links icons*/
  773. --sidebarLinkIconsSize: {select:Sidebar Link Icons Size};
  774. --sidebarLinkIconsPosition: {select:Sidebar Link Icons Position};
  775.  
  776. /*sidebar links text*/
  777. --sidebarLinkFontSize: {select:Sidebar Link Font Size};
  778. --sidebarLinkFontLetterSpacing: {select:Sidebar Link Font Letter Spacing};
  779. --sidebarLinkFontWordSpacing: {select:Sidebar Link Font Word Spacing};
  780. --sidebarLinkFontWeight: {select:Sidebar Link Font Weight};
  781. --sidebarLinkTextTransform: {select:Sidebar Link Text Transform};
  782. --sidebarLinkFontStyle: {select:Sidebar Link Font Style};
  783. --sidebarLinkTextPosition: {select:Sidebar Link Text Position};
  784.  
  785. --sidebarLinkLineHeight: calc(var(--sidebarLinkFontSize) * 1.3);
  786.  
  787.  
  788. /*pagination, dark switch, credit*/
  789. --sidebarContentPosition: {select:Sidebar Content Position};
  790. --paginationLinksFontSize: {select:Pagination Links Font Size};
  791. --paginationFontLetterSpacing: {select:Pagination Font Letter Spacing};
  792. --paginationFontWordSpacing: {select:Pagination Font Word Spacing};
  793. --paginationLinksFontWeight: {select:Pagination Links Font Weight};
  794. --paginationLinksTextTransform: {select:Pagination Links Text Transform};
  795. --paginationLinksFontStyle: {select:Pagination Links Font Style};
  796. --paginationLinksPosition: {select:Pagination Links Position};
  797.  
  798. /*sizes*/
  799. --sidebarImageSize: 26.8rem;
  800. --sidebarIconImageSize: {select:Sidebar Icon Image Size};
  801.  
  802. /*margins, paddings, spaces*/
  803. --postsMargin: {text:Posts Margin};
  804. --postsPadding:{text:Posts Padding};
  805.  
  806. /*posts*/
  807. --postWidth: {select:Post Width};
  808. --postsTextPosition: {select:Posts Text Position};
  809. --postsTitlesFontSize: {select:Posts Titles Font Size};
  810. --postsTitlesFontWeight: {select:Posts Titles Font Weight};
  811. --postsTitlesFontLetterSpacing: {select:Posts Titles Font Letter Spacing};
  812. --postsTitlesFontWordSpacing: {select:Posts Titles Font Word Spacing};
  813. --postsTitlesTextTransform: {select:Posts Titles Text Transform};
  814. --postsTitlesFontStyle: {select:Posts Titles Font Style};
  815. --postsTextPosition: {select:Posts Text Position};
  816. --postsTitlesTextPosition: {select:Posts Titles Text Position};
  817.  
  818. --poststLineHeight: calc(var(--bodyFontSize) * 1.4);
  819. --postsTitlesLineHeight: calc(var(--postsTitlesFontSize) * 1.2);
  820.  
  821. /*date,tags, post info*/
  822. --dateFontSize:{select:Date Font Size};
  823. --dateFontLetterSpacing: {select:Date Font Letter Spacing};
  824. --dateFontWordSpacing: {select:Date Font Word Spacing};
  825. --dateFontWeight:{select:Date Font Weight};
  826. --dateTextTransform:{select:Date Text Transform};
  827. --dateFontStyle:{select:Date Font Style};
  828.  
  829. --dateLineHeight: calc(var(--bodyFontSize) * 1.4);
  830. --tagsLineHeight: calc(var(--bodyFontSize) * 1.4);
  831.  
  832. --tagsFontSize:{select:Tags Font Size};
  833. --tagsFontLetterSpacing: {select:Tags Font Letter Spacing};
  834. --tagsFontWordSpacing: {select:Tags Font Word Spacing};
  835. --tagsFontWeight:{select:Tags Font Weight};
  836. --tagsTextTransform:{select:Tags Text Transform};
  837. --tagsFontStyle:{select:Tags Font Style};
  838. --tagsTextPosition: {select:Tags Text Position};
  839.  
  840. /* posts and sidebar borders */
  841. --bordersStyle: {select:Borders Style};
  842. --bordersSize: {select:Borders Size};
  843. --boxShadowSize:{text:Box Shadow Size};
  844. --boxShadowColor:{text:Box Shadow Color};
  845.  
  846.  
  847.  
  848. /* other styles */
  849. --transitions: all .3s ease;
  850.  
  851.  
  852. /*npf images readjustment */
  853. --NPF-Image-Spacing:0.4rem;
  854. --NPF-Bottom-Gap-From-Captions:1em;
  855. }
  856.  
  857. /* dark colors */
  858. [data-theme="dark"] {
  859. --backgroundThemeColor: {color:Dark Background Theme Color};
  860. --bodyTextColor: {color:Dark Body Text Color};
  861. --bodyBoldColor: {color:Dark Body Bold Color};
  862. --bodyItalicColor: {color:Dark Body Italic Color};
  863. --bodyLinkColor: {color:Dark Body Link Color};
  864. --bodyLinkHoverColor: {color:Dark Body Link Hover Color};
  865. --sidebarTextColor: {color:Dark Sidebar Text Color};
  866. --sidebarBoldColor: {color:Dark Sidebar Bold Color};
  867. --sidebarItalicColor: {color:Dark Sidebar Italic Color};
  868. --sidebarLinkIconsColor: {color:Dark Sidebar Link Icons Color};
  869. --sidebarLinkTextColor: {color:Dark Sidebar Link Text Color};
  870. --sidebarTitleColor: {color:Dark Sidebar Title Color};
  871. --sidebarPrimaryLinkColor: {color:Dark Sidebar Primary Link Color};
  872. --sidebarPrimaryBackgroundColor: {color:Dark Sidebar Primary Background Color};
  873. --sidebarSecondaryLinkColor: {color:Dark Sidebar Secondary Link Color};
  874. --sidebarSecondaryBackgroundColor: {color:Dark Sidebar Secondary Background Color};
  875. --hoverTextBackgroundColor: {color:Dark Hover Text Background Color};
  876. --hoverTextColor: {color:Dark Hover Text Color};
  877. --datePrimaryLinkColor:{color:Dark Date Primary Link Color};
  878. --datePrimaryBackgroundColor: {color:Dark Date Primary Background Color};
  879. --dateSecondaryLinkColor:{color:Dark Date Secondary Link Color};
  880. --dateSecondaryBackgroundColor: {color:Dark Date Secondary Background Color};
  881. --dateTextColor: {color:Dark Date Text Color};
  882. --tagsLinkColor: {color:Dark Tags Link Color};
  883. --likedLinkColor: {color:Dark Liked Link Color};
  884. --scrollbarColor: {color:Dark Scrollbar Color};
  885. --bordersColor: {color:Dark Borders Color};
  886. --postsBackgroundColor: {color:Dark Posts Background Color};
  887. --tumblrControlsIconColor: {color:Dark Tumblr Controls Icon Color};
  888. }
  889.  
  890. * {
  891. margin: 0;
  892. padding: 0;
  893. -webkit-box-sizing: inherit;
  894. box-sizing: inherit;
  895. }
  896.  
  897. html {
  898. font-size: 62.5%;
  899. }
  900.  
  901. body {
  902. background:var(--backgroundThemeColor) url({image:Background Image});
  903. background-attachment:fixed;
  904. background-color:var(--backgroundThemeColor);
  905. font-size:var(--bodyFontSize);
  906. font-family: var(--bodyFontFamily), Arial, sans-serif;
  907. font-weight: var(--bodyFontWeight);
  908. letter-spacing: var(--bodyFontLetterSpacing);
  909. word-spacing: var(--bodyFontWordSpacing);
  910. color: var(--bodyTextColor);
  911. }
  912.  
  913. a {
  914. text-decoration:none;
  915. color:var(--bodyLinkColor);
  916. transition:var(--transitions);
  917. }
  918.  
  919. a:hover {
  920. color:var(--bodyLinkHoverColor);
  921. }
  922.  
  923. p:first-child {
  924. margin-block-start: 0;
  925. margin-block-end: 0;
  926. }
  927.  
  928. p:last-child {
  929. margin-block-end: 0;
  930. }
  931.  
  932. small, sup, sub {
  933. font-size:var(--bodyFontSize);
  934. }
  935.  
  936. pre {
  937. word-wrap:break-word!Important;
  938. white-space: pre-wrap;
  939. }
  940.  
  941. h1, h2, h3, h4, h5, h6 {
  942. padding: 1rem 0 0.5rem;
  943. margin: 0;
  944. font-family:var(--postsTitleFontFamily);
  945. font-style:var(--postsTitlesFontStyle);
  946. font-weight:var(--postsTitlesFontWeight);
  947. letter-spacing: var(--postsTitlesFontLetterSpacing);
  948. word-spacing: var(--postsTitlesFontWordSpacing);
  949. color:var(--bodyBoldColor);
  950. text-transform:var(--postsTitlesTextTransform);
  951. font-size:var(--postsTitlesFontSize);
  952. text-align:var(--postsTitlesTextPosition);
  953. line-height:var(--postsTitlesLineHeight);
  954. }
  955.  
  956. strong, bold, b {
  957. color:var(--bodyBoldColor);
  958. font-weight:var(--boldFontWeight);
  959. }
  960.  
  961. italic, em, i {
  962. color:var(--bodyItalicColor);
  963. }
  964.  
  965. hr {
  966. width:10rem;
  967. margin:1rem 0 1rem 0;
  968. border-width: var(--bordersSize) 0px 0px 0px;
  969. border-style: var(--bordersStyle);
  970. border-color: var(--bordersColor);
  971. }
  972.  
  973.  
  974. {block:IfLinksUnderlineBorder}
  975. .sidebar-description a, .sidebar-pagination a, .container-date a,
  976. .caption a, .caption-content a, .tumblr_blog a, .ask-user a {
  977. text-decoration:underline;
  978. }
  979. {/block:IfLinksUnderlineBorder}
  980.  
  981. img {
  982. max-width:100%;
  983. height:auto;
  984. display:block;
  985. margin: 0;
  986. padding: 0;
  987. {block:ifImagesBlackandWhite}
  988. -webkit-filter: grayscale(100%);
  989. filter: grayscale(100%);
  990. {/block:ifImagesBlackandWhite}
  991. transition:var(--transitions);
  992. }
  993.  
  994. img:hover,
  995. .container-posts:hover img,
  996. .sidebar:hover img {
  997. opacity:1;
  998. -webkit-filter: grayscale(0%);
  999. filter: grayscale(0%);
  1000. }
  1001.  
  1002. ::-moz-selection {
  1003. background-color: var(--bodyBoldColor);
  1004. color:var(--postsBackgroundColor);
  1005. }
  1006.  
  1007. ::selection {
  1008. background-color: var(--bodyBoldColor);
  1009. color:var(--postsBackgroundColor);
  1010. }
  1011.  
  1012. input {
  1013. width: 100%;
  1014. padding: 1rem 0;
  1015. }
  1016.  
  1017. /* scrollbar */
  1018. ::-webkit-scrollbar {
  1019. width:0.7rem;
  1020. height:0.7rem;
  1021. }
  1022. ::-webkit-scrollbar {
  1023. background-color:var(--backgroundThemeColor);
  1024. }
  1025. ::-webkit-scrollbar-track {
  1026. border:0.8rem solid var(--backgroundThemeColor);
  1027. background-color:var(--backgroundThemeColor);
  1028. }
  1029. ::-webkit-scrollbar-thumb {
  1030. border:0.2rem solid var(--backgroundThemeColor);
  1031. background-color:var(--scrollbarColor);
  1032. border-radius:1rem;
  1033. min-height:2.4rem;
  1034. min-width:2.4rem;
  1035. }
  1036.  
  1037. /* scroll to top */
  1038. .scrolltop .feather {
  1039. margin:-3px 5px -3px -5px;
  1040. }
  1041.  
  1042. .scrolltop {
  1043. width:15px;
  1044. height:15px;
  1045. text-align:center;
  1046. color:var(--bodyLinkColor);
  1047. display: none;
  1048. font-size:var(--bodyFontSize);
  1049. }
  1050.  
  1051. .scrolltop:hover {
  1052. color:var(--bodyLinkHoverColor);
  1053. }
  1054.  
  1055. /* tooltips */
  1056. .tippy-tooltip.custom-theme {
  1057. text-align:center;
  1058. font-size:var(--bodyFontSize);
  1059. font-weight:var(--boldFontWeight);
  1060. color:var(--hoverTextColor);
  1061. background-color:var(--hoverTextBackgroundColor);
  1062. {block:ifBoxShadow}
  1063. -webkit-box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  1064. box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  1065. {/block:ifBoxShadow}
  1066. transition:var(--transitions);
  1067. }
  1068.  
  1069. /* custom icons */
  1070. .feather:hover {
  1071. color: var(--bodyLinkHoverColor);
  1072. stroke: var(--bodyLinkHoverColor);
  1073. }
  1074.  
  1075.  
  1076. .feather {
  1077. width: var(--bodyFontSize);
  1078. height: var(--bodyFontSize);
  1079. }
  1080.  
  1081. .clearfix::before, .clearfix::after{
  1082. content:'';
  1083. clear:both;
  1084. display:table;
  1085. }
  1086.  
  1087.  
  1088. /*global list style*/
  1089. ul li {
  1090. list-style: none;
  1091. margin: 0;
  1092. padding: 0;
  1093. }
  1094.  
  1095. /* lists style for posts */
  1096. .type-text ul,
  1097. .caption ul {
  1098. margin: 0 0 1rem 0;
  1099. padding: 0;
  1100. list-style:none;
  1101. }
  1102.  
  1103. .type-text ul li,
  1104. .caption ul li {
  1105. margin:0.5rem 1.5rem;
  1106. list-style:none;
  1107. }
  1108.  
  1109. .type-text ul li::before,
  1110. .caption ul li::before {
  1111. content: '\e08f';
  1112. font-family:'saturnicons';
  1113. font-size:calc(var(--bodyFontSize) - 50%);
  1114. margin-right:0.7rem;
  1115. display:inline-block;
  1116. vertical-align:middle;
  1117. color: var(--bodyLinkColor);
  1118. }
  1119.  
  1120. .type-text ol,
  1121. .caption ol {
  1122. margin:1.5rem 0;
  1123. padding: 0 3rem;
  1124. }
  1125.  
  1126. .type-text ol li,
  1127. .caption ol li {
  1128. list-style-type: decimal;
  1129. }
  1130.  
  1131.  
  1132. /*main container*/
  1133. .theme-container {
  1134. display: grid;
  1135. grid-template-columns: 27rem 55rem;
  1136. grid-template-rows:1fr;
  1137. gap: 10rem;
  1138. margin: 5rem 2rem;
  1139. justify-content: center;
  1140. }
  1141.  
  1142. .sidebar {
  1143. width: 26.8rem;
  1144. height: 100vh;
  1145. display: flex;
  1146. align-items: var(--sidebarContentPosition);
  1147. }
  1148.  
  1149. .sidebar-content {
  1150. position: fixed;
  1151. width: 26.8rem;
  1152. background-color:var(--sidebarPrimaryBackgroundColor);
  1153. {block:IfSidebarIconImage}
  1154. margin-top: 4rem;
  1155. {block:IfSidebarIconImage}
  1156. {block:ifShowBorders}
  1157. outline:var(--bordersSize) var(--bordersStyle) var(--bordersColor);
  1158. {/block:ifShowBorders}
  1159.  
  1160. {block:ifBoxShadow}
  1161. -webkit-box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  1162. box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  1163. {/block:ifBoxShadow}
  1164. }
  1165.  
  1166. .sidebar-title, .sidebar-description, .sidebar-search {
  1167. padding: 0 1rem;
  1168. box-sizing: border-box;
  1169. }
  1170.  
  1171. .sidebar-description a {
  1172. color: var(--sidebarPrimaryLinkColor);
  1173. }
  1174.  
  1175. .sidebar-pagination a {
  1176. color: var(--sidebarSecondaryLinkColor);
  1177. }
  1178.  
  1179. .theme-switch-svg svg {
  1180. width:var(--paginationLinksFontSize);
  1181. height:var(--paginationLinksFontSize);
  1182. stroke: var(--sidebarSecondaryLinkColor);
  1183. }
  1184.  
  1185. .sidebar-description a:hover, .sidebar-navigation a:hover, .sidebar-pagination a:hover {
  1186. color: var(--bodyLinkHoverColor);
  1187. }
  1188.  
  1189. .sidebar-image, .sidebar-image-icon {
  1190. float:{select:Sidebar Image Position};
  1191.  
  1192. {block:IfSidebarIconImage}
  1193. {block:IfNotSidebarImage}
  1194. position: relative;
  1195. top: calc(var(--sidebarIconImageSize) / -2);
  1196. height: calc(var(--sidebarIconImageSize) - var(--sidebarIconImageSize) / 2);
  1197. {/block:IfNotSidebarImage}
  1198. {/block:IfSidebarIconImage}
  1199. }
  1200.  
  1201. .sidebar-image img {
  1202. width: var(--sidebarImageSize);
  1203. margin: auto auto 1rem;
  1204. transition:var(--transitions);
  1205. }
  1206.  
  1207. .sidebar-icon-container {
  1208. position: relative;
  1209. }
  1210.  
  1211. .sidebar-image-icon img {
  1212. width: var(--sidebarIconImageSize);
  1213. height: var(--sidebarIconImageSize);
  1214. {block:IfNotSidebarIconSquareStyle}
  1215. border-radius: 50%;
  1216. {/block:IfNotSidebarIconSquareStyle}
  1217. object-fit: cover;
  1218. margin: auto auto 1rem;
  1219. }
  1220.  
  1221. .sidebar-image img:hover,
  1222. .sidebar-image-icon img:hover {
  1223. opacity:1;
  1224. -webkit-filter: grayscale(0%);
  1225. filter: grayscale(0%);
  1226. }
  1227.  
  1228. .sidebar-title {
  1229. margin: 1rem 0;
  1230. font-family: var(--sidebarTitleFontFamily), Arial, sans-serif;
  1231. font-weight:var(--sidebarTitleFontWeight);
  1232. font-style:var(--sidebarTitleFontStyle);
  1233. text-transform:var(--sidebarTitleTextTransform);
  1234. font-size:var(--sidebarTitleFontSize);
  1235. line-height:var(--sidebarTitleLineHeight);
  1236. letter-spacing: var(--sidebarTitleFontLetterSpacing);
  1237. word-spacing: var(--sidebarTitleFontWordSpacing);
  1238. text-align:var(--sidebarTitleTextPosition);
  1239. color: var(--sidebarTitleColor);
  1240. }
  1241.  
  1242.  
  1243. .sidebar-links-description {
  1244. display: flex;
  1245. padding: 1rem 0;
  1246. display:flex;
  1247. align-content:var(--sidebarLinkIconsPosition);
  1248. justify-content:var(--sidebarLinkIconsPosition);
  1249. {block:ifShowBorders}
  1250. border-bottom:var(--bordersSize) var(--bordersStyle) var(--bordersColor);
  1251. {/block:ifShowBorders}
  1252. {block:IfNotSidebarTitle}
  1253. border-bottom:0;
  1254. {/block:IfNotSidebarTitle}
  1255.  
  1256.  
  1257. {block:IfSidebarIconImage}
  1258. padding-top: 1rem;
  1259. {block:IfSidebarIconImage}
  1260.  
  1261. {block:IfNotSidebarIconImage}
  1262. {block:IfNotSidebarImage}
  1263. padding-top: 1rem;
  1264. {/block:IfNotSidebarImage}
  1265. {/block:IfNotSidebarIconImage}
  1266. }
  1267.  
  1268. .sidebar-description {
  1269. width:100%;
  1270. display: flex;
  1271. color: var(--sidebarTextColor);
  1272. font-weight:var(--descriptionFontWeight);
  1273. font-style:var(--descriptionFontStyle);
  1274. text-transform:var(--descriptionTextTransform);
  1275. font-size:var(--descriptionFontSize);
  1276. letter-spacing: var(--descriptionFontLetterSpacing);
  1277. word-spacing: var(--descriptionFontWordSpacing);
  1278. line-height:var(--descriptionLineHeight);
  1279. align-items:var(--descriptionTextVerticalPosition);
  1280. }
  1281.  
  1282. .sidebar-description strong,
  1283. .sidebar-description bold,
  1284. .sidebar-description b {
  1285. color:var(--sidebarBoldColor);
  1286. font-weight:var(--boldFontWeight);
  1287. }
  1288.  
  1289. .sidebar-description italic,
  1290. .sidebar-description em,
  1291. .sidebar-description i {
  1292. color:var(--sidebarItalicColor);
  1293. }
  1294.  
  1295. .sidebar-description-content {
  1296. text-align:var(--descriptionTextHorizontalPosition);
  1297. }
  1298.  
  1299. .sidebar-navigation {
  1300. {block:ifShowBorders}
  1301. border-left:var(--bordersSize) var(--bordersStyle) var(--bordersColor);
  1302. {/block:ifShowBorders}
  1303. {block:IfSidebarLinksText}
  1304. margin: 0 1rem;
  1305. {/block:IfSidebarLinksText}
  1306. {block:IfNotSidebarLinksText}
  1307. padding:0 1rem;
  1308. {/block:IfNotSidebarLinksText}
  1309. {block:IfNotHideDescription}
  1310. width:23%;
  1311. {/block:IfNotHideDescription}
  1312. }
  1313.  
  1314. .sidebar-navigation .feather {
  1315. width:var(--sidebarLinkIconsSize);
  1316. height:var(--sidebarLinkIconsSize);
  1317. color: var(--sidebarLinkIconsColor);
  1318. }
  1319.  
  1320. .sidebar-navigation ul {
  1321. list-style: none;
  1322. display:flex;
  1323. align-content:var(--sidebarLinkIconsPosition);
  1324. justify-content:center;
  1325. height: 100%;
  1326. flex-wrap: wrap;
  1327. gap: 1.5rem;
  1328. }
  1329.  
  1330. .sidebar-links-text {
  1331. display: block;
  1332. box-sizing: border-box;
  1333. }
  1334.  
  1335. .sidebar-links-text .sidebar-navigation {
  1336. width: 100%;
  1337. margin: 1rem 0;
  1338. border-left:0;
  1339. }
  1340.  
  1341. .sidebar-links-text .sidebar-navigation ul {
  1342. gap: 0.5rem 1rem;
  1343. padding: 0 1rem;
  1344. color: var(--sidebarLinkTextColor);
  1345. font-weight:var(--sidebarLinkFontWeight);
  1346. font-style:var(--sidebarLinkFontStyle);
  1347. text-transform:var(--sidebarLinkTextTransform);
  1348. font-size:var(--sidebarLinkFontSize);
  1349. letter-spacing: var(--sidebarLinkFontLetterSpacing);
  1350. word-spacing: var(--sidebarLinkFontWordSpacing);
  1351. line-height:var(--sidebarLinkLineHeight);
  1352. justify-content:var(--sidebarLinkTextPosition);
  1353. }
  1354.  
  1355. .sidebar-links-text a {
  1356. color: var(--sidebarLinkIconsColor);
  1357. }
  1358.  
  1359. .sidebar-search {
  1360. width: 100%;
  1361. box-sizing: border-box;
  1362. padding: 0 1rem;
  1363. {block:ifShowBorders}
  1364. border-bottom:var(--bordersSize) var(--bordersStyle) var(--bordersColor);
  1365. {/block:ifShowBorders}
  1366. }
  1367.  
  1368. .sidebar-search input {
  1369. background-color:var(--sidebarBackgroundColor);
  1370. color: var(--sidebarTextColor);
  1371. border: none;
  1372. }
  1373.  
  1374. .sidebar-search input:focus {
  1375. border:none;
  1376. outline:none;
  1377. }
  1378.  
  1379. .sidebar-search input:placeholder {
  1380. color: var(--sidebarTextColor);
  1381. }
  1382.  
  1383. .sidebar-search input:focus::placeholder {
  1384. color: var(--sidebarLinkIconsColor);
  1385. }
  1386.  
  1387. .sidebar-pagination {
  1388. font-size:var(--paginationLinksFontSize);
  1389. font-style:var(--paginationLinksFontStyle);
  1390. font-weight:var(--paginationLinksFontWeight);
  1391. letter-spacing: var(--paginationFontLetterSpacing);
  1392. text-transform:var(--paginationLinksTextTransform);
  1393. word-spacing: var(--paginationFontWordSpacing);
  1394. padding: 1rem 1.5rem 1rem 1rem;
  1395. background-color:var(--sidebarSecondaryBackgroundColor);
  1396. }
  1397.  
  1398. .sidebar-pagination ul {
  1399. list-style: none;
  1400. display:flex;
  1401. align-items: center;
  1402. justify-content: space-between;
  1403. gap: 1rem;
  1404. }
  1405.  
  1406. .sidebar-pagination .credit {
  1407. width: var(--bodyFontSize);
  1408. height: var(--bodyFontSize);
  1409. }
  1410.  
  1411.  
  1412.  
  1413.  
  1414.  
  1415. /* posts */
  1416.  
  1417. .container-posts, .container-header {
  1418. width:100%;
  1419. max-width: calc(var(--postWidth) + 1px);
  1420. margin: 0 auto;
  1421. text-align:var(--postsTextPosition);
  1422. padding: var(--postsPadding);
  1423. background-color: var(--postsBackgroundColor);
  1424. line-height:var(--poststLineHeight);
  1425. {block:ifShowBorders}
  1426. outline:var(--bordersSize) var(--bordersStyle) var(--bordersColor);
  1427. {/block:ifShowBorders}
  1428.  
  1429. {block:ifBoxShadow}
  1430. -webkit-box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  1431. box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  1432. {/block:ifBoxShadow}
  1433. }
  1434.  
  1435. .container-header {
  1436. margin-bottom: 2rem;
  1437. }
  1438.  
  1439. .container-header-content {
  1440. padding: 1rem;
  1441. box-sizing: border-box;
  1442. }
  1443.  
  1444. .search-result .search_query, .tag-wrapper .tag {
  1445. font-weight: var(--boldFontWeight);
  1446. color: var(--bodyBoldColor);
  1447. }
  1448.  
  1449. .container-posts img {
  1450. max-width:100%;
  1451. display:block;
  1452. height:auto;
  1453. }
  1454.  
  1455. .container-posts b, strong {
  1456. font-weight:var(--boldFontWeight);
  1457. }
  1458.  
  1459. .container-posts:not(:last-of-type) {
  1460. margin-bottom: var(--postsMargin);
  1461. }
  1462.  
  1463. .caption iframe, .caption figure {
  1464. width:100%;
  1465. }
  1466.  
  1467. /* photosets */
  1468. [photoset-layout] {
  1469. display: grid;
  1470. grid-template-columns: repeat(6, 1fr);
  1471. grid-gap: {select:Photoset Gutter};
  1472. }
  1473.  
  1474. [photoset-layout] img {
  1475. display: block;
  1476. height: 100%;
  1477. width: 100%;
  1478. -o-object-fit: cover;
  1479. object-fit: cover;
  1480. }
  1481.  
  1482. .photoset-grid {
  1483. max-width: 100%;
  1484. width: var(--postWidth);
  1485. grid-gap: {select:Photoset Gutter};
  1486. }
  1487.  
  1488. .photoset-grid div {
  1489. cursor: pointer;
  1490. }
  1491.  
  1492.  
  1493.  
  1494. /* captions & blockquote */
  1495. .tumblr_blog {
  1496. display:inline-block;
  1497. line-height:var(--bodyLineHeight);
  1498. margin-right:0.2rem;
  1499. text-transform:lowercase;
  1500. font-family: var(--bodyFont), Arial, sans-serif;
  1501. font-size:var(--bodyFontSize);
  1502. color:var(--bodyLinkColor);
  1503. font-weight:var(--boldFontWeight);
  1504. }
  1505.  
  1506. .tumblr_blog a {
  1507. color:var(--bodyLinkColor);
  1508. font-weight:var(--boldFontWeight);
  1509. vertical-align:bottom;
  1510.  
  1511. }
  1512.  
  1513. .tumblr_blog a:hover {
  1514. text-decoration:none;
  1515. color:var(--bodyLinkHoverColor);
  1516. }
  1517.  
  1518. /* old captions style */
  1519. {block:ifNotTumblrCaptions}
  1520. blockquote {
  1521. border-left:0.1rem solid var(--bordersColor);
  1522. padding-left: 1.5rem;
  1523. margin: 1rem 1rem;
  1524. }
  1525. {/block:ifNotTumblrCaptions}
  1526.  
  1527. /* tumblr's dashboad captions style */
  1528. {block:ifTumblrCaptions}
  1529. blockquote {
  1530. border-left:0px solid;
  1531. padding-left: 0px;
  1532. margin: 0px;
  1533. }
  1534. {/block:ifTumblrCaptions}
  1535.  
  1536.  
  1537. /* custom captions icons */
  1538. {block:ifCustomCaptionIcon}
  1539. .caption-user .feather,
  1540. .ask-user .feather {
  1541. display:inline-block;
  1542. vertical-align: middle;
  1543. width:var(--bodyFontSize);
  1544. height:var(--bodyFontSize);
  1545. margin-right: 0.5rem;
  1546. }
  1547. {/block:ifCustomCaptionIcon}
  1548.  
  1549. .caption-user {
  1550. display: flex;
  1551. align-items: center;
  1552. }
  1553.  
  1554. .caption-user-icon {
  1555. width:2rem;
  1556. border-radius: 50%;
  1557. margin: 0 0.5rem 0.2rem 0;
  1558. }
  1559.  
  1560. .caption-user .feather,
  1561. .ask-user .feather {
  1562. {block:ifNotCustomCaptionIcon}
  1563. display:none;
  1564. {/block:ifNotCustomCaptionIcon}
  1565. transition:var(--transitions);
  1566. }
  1567.  
  1568. .caption-user,
  1569. .tmblr-attribution a {
  1570. font-weight:var(--boldFontWeight);
  1571. }
  1572.  
  1573. .caption-user a::after {
  1574. content:none;
  1575. }
  1576.  
  1577. .deactive::after {
  1578. content: '(deactivated)';
  1579. margin-left: 1em;
  1580. opacity: 0.75;
  1581. color: var(--bodyTextColor);
  1582. }
  1583.  
  1584. .posts-title {
  1585. padding: 1rem 1rem 0.5rem;
  1586. }
  1587.  
  1588. .caption-content h2, h3, h4, h5, h6 {
  1589. padding: 0.5rem 0 0.2rem;
  1590. }
  1591.  
  1592. .caption {
  1593. padding: 1rem;
  1594. -ms-word-break: break-all;
  1595. word-break: break-all;
  1596.  
  1597. /* Non standard for WebKit */
  1598. word-break: break-word;
  1599. -webkit-hyphens: auto;
  1600. -moz-hyphens: auto;
  1601. hyphens: auto;
  1602. }
  1603.  
  1604. .caption p {
  1605. padding: 0.4rem 0;
  1606. }
  1607.  
  1608. .caption p:first-child {
  1609. padding: 0.2rem 0;
  1610. }
  1611.  
  1612. .caption p:last-child {
  1613. padding: 0.2rem 0;
  1614. }
  1615.  
  1616. /* captions links */
  1617. .caption a, .caption-content a, figcaption a, .tmblr-attribution a {
  1618. color:var(--bodyLinkColor);
  1619. }
  1620.  
  1621. .caption a:hover, .caption-content a:hover, figcaption a:hover {
  1622. color:var(--bodyLinkHoverColor);
  1623. }
  1624.  
  1625. .container-date a:hover
  1626. .container-date-content .show-more-info:hover {
  1627. color:var(--bodyLinkHoverColor);
  1628. }
  1629.  
  1630. .container-date ul {
  1631. list-style: none;
  1632. width:100%;
  1633. }
  1634.  
  1635. .container-date ul li {
  1636. display:inline-block;
  1637. padding: 0.2rem 0;
  1638. }
  1639.  
  1640. .container-date ul li:not(:last-child) {
  1641. margin-right:1rem;
  1642. }
  1643.  
  1644. .more-info-first a:not(:last-child),
  1645. .more-info-second a:not(:last-child) {
  1646. margin-right: 1rem;
  1647. }
  1648.  
  1649. .container-date-content, .container-more-info {
  1650. display: grid;
  1651. align-items: center;
  1652. justify-content: start;
  1653. font-weight:var(--dateFontWeight);
  1654. font-style:var(--dateFontStyle);
  1655. color:var(--dateTextColor);
  1656. font-size:var(--dateFontSize);
  1657. text-transform: var(--dateTextTransform);
  1658. letter-spacing: var(--dateFontLetterSpacing);
  1659. word-spacing: var(--dateFontWordSpacing);
  1660. line-height:var(--dateLineHeight);
  1661. padding: 0.5rem 1rem;
  1662. {block:ifShowBorders}
  1663. border-top:var(--bordersSize) var(--bordersStyle) var(--bordersColor);
  1664. padding: 1rem;
  1665. {/block:ifShowBorders}
  1666. }
  1667.  
  1668. .container-date-content {
  1669. grid-template-columns: repeat(3, 1fr);
  1670. background-color: var(--datePrimaryBackgroundColor);
  1671. }
  1672.  
  1673. .container-show-more-info {
  1674. grid-template-rows: repeat(2, 1fr);
  1675. }
  1676.  
  1677. .container-more-info {
  1678. grid-template-columns: repeat(2, 1fr);
  1679. background-color: var(--dateSecondaryBackgroundColor);
  1680. }
  1681.  
  1682. .container-date-content a {
  1683. color: var(--datePrimaryLinkColor);
  1684. }
  1685.  
  1686. .container-more-info a {
  1687. color: var(--dateSecondaryLinkColor);
  1688. }
  1689.  
  1690. .container-date-content .date-time {
  1691. justify-self: end;
  1692. }
  1693.  
  1694. .container-date-content .show-more-info {
  1695. justify-self: start;
  1696. cursor: pointer;
  1697. }
  1698.  
  1699. .container-date-content .show-more-info .feather {
  1700. color: var(--datePrimaryLinkColor);
  1701. width:var(--dateFontSize);
  1702. height:var(--dateFontSize);
  1703. }
  1704.  
  1705. .container-date-content .pinned-post {
  1706. justify-self: center;
  1707. align-self: center;
  1708. }
  1709.  
  1710. .container-date-content .pinned-post .feather {
  1711. margin-left: 0.5rem;
  1712. width:calc(var(--dateFontSize) - 1px);
  1713. height:calc(var(--dateFontSize) - 1px);
  1714. }
  1715.  
  1716. .container-date-content .pinned-post .feather:hover {
  1717. color:inherit;
  1718. }
  1719.  
  1720. .container-tags {
  1721. padding: 0.5rem 1rem;
  1722. box-sizing: border-box;
  1723. text-align: var(--tagsTextPosition);
  1724. text-transform: var(--tagsTextTransform);
  1725. font-style:var(--tagsFontStyle);
  1726. font-size:var(--tagsFontSize);
  1727. letter-spacing: var(--tagsFontLetterSpacing);
  1728. word-spacing: var(--tagsFontWordSpacing);
  1729. font-weight:var(--tagsFontWeight);
  1730. line-height:var(--tagsLineHeight);
  1731. grid-row: 1;
  1732. grid-column: 1 / 3;
  1733. {block:ifShowBorders}
  1734. border-top:var(--bordersSize) var(--bordersStyle) var(--bordersColor);
  1735. padding: 1rem;
  1736. {/block:ifShowBorders}
  1737. }
  1738.  
  1739. .container-tags a {
  1740. color:var(--tagsLinkColor);
  1741. }
  1742.  
  1743. .container-more-info .more-info-first {
  1744. display: flex;
  1745. justify-self: start;
  1746. grid-row: 2;
  1747. margin: 0;
  1748. }
  1749.  
  1750. .container-more-info .more-info-second {
  1751. display: flex;
  1752. justify-self: end;
  1753. grid-row: 2;
  1754. text-align: right;
  1755. margin: 0;
  1756. }
  1757.  
  1758. .container-more-info .more-info-second .reblog-link {
  1759. max-width: 170px;
  1760. white-space: nowrap;
  1761. overflow: hidden;
  1762. text-overflow: ellipsis;
  1763. display: block;
  1764. }
  1765.  
  1766.  
  1767.  
  1768. /* like text */
  1769. .like-b {
  1770. position:relative;
  1771. display:inline-block;
  1772. height:1em;
  1773. padding: 0 0.1rem;
  1774. }
  1775.  
  1776. .like-b iframe {
  1777. position:absolute;
  1778. top:0;
  1779. left:0;
  1780. bottom:0;
  1781. right:0;
  1782. z-index:2;
  1783. opacity:0;
  1784. }
  1785.  
  1786. .like-b .liked + .b {
  1787. color: var(--likedLinkColor);
  1788. font-weight:var(--boldFontWeight);
  1789. }
  1790.  
  1791. .like-b .liked + .b:after {
  1792. content:'d';
  1793. }
  1794.  
  1795. .like-b a:hover {
  1796. color:var(--bodyLinkHoverColor);
  1797. }
  1798.  
  1799. /* asks */
  1800. .ask {
  1801. color:var(--dateTextColor);
  1802. padding: 1rem;
  1803. background-color: var(--datePrimaryBackgroundColor);
  1804. {block:ifShowBorders}
  1805. border-bottom:var(--bordersSize) var(--bordersStyle) var(--bordersColor);
  1806. {/block:ifShowBorders}
  1807. }
  1808.  
  1809. .ask-user {
  1810. color:var(--datePrimaryLinkColor);
  1811. font-weight:var(--boldFontWeight);
  1812. text-transform:lowercase;
  1813. }
  1814.  
  1815. .ask-user a {
  1816. color:var(--datePrimaryLinkColor);
  1817. font-weight:var(--boldFontWeight);
  1818. }
  1819.  
  1820. .ask-user a:hover {
  1821. color:var(--bodyLinkHoverColor);
  1822. }
  1823.  
  1824. .ask-question {
  1825. display:block;
  1826. margin: 0 0 0.7rem;
  1827. }
  1828.  
  1829. .ask-answer.caption-content::after {
  1830. content: '';
  1831. height: 0px;
  1832. }
  1833.  
  1834. /*audio */
  1835. .audio {
  1836. display:flex;
  1837. {block:ifShowBorders}
  1838. border-bottom:var(--bordersSize) var(--bordersStyle) var(--bordersColor);
  1839. {/block:ifShowBorders}
  1840. align-items: center;
  1841. position: relative;
  1842. }
  1843.  
  1844. .album-art {
  1845. z-index: 1;
  1846. display: inline-block;
  1847. vertical-align: middle;
  1848. float: left;
  1849. width: 10rem;
  1850. height: 10rem;
  1851. }
  1852.  
  1853. .button {
  1854. width: 3rem;
  1855. height: 3rem;
  1856. overflow: hidden;
  1857. position: relative;
  1858. z-index: 2;
  1859. margin: 0.7rem;
  1860. }
  1861.  
  1862. .audiobox {
  1863. background-color: #f2f2f2;
  1864. z-index: 3;
  1865. position: absolute;
  1866. margin: 2.8rem;
  1867. border-radius: 50%;
  1868. }
  1869.  
  1870. .audio_trackinfo {
  1871. max-height: 7.4rem;
  1872. min-height: 7.4rem;
  1873. display: flex;
  1874. flex: 4;
  1875. align-items: flex-start;
  1876. justify-content: center;
  1877. flex-direction: column;
  1878. padding: 0.5rem;
  1879. padding: 1rem;
  1880. background-color: var(--backgroundAskColor);
  1881. color:var(--askTextColor);
  1882. }
  1883.  
  1884. .audio_trackname {
  1885. font-weight:var(--boldFontWeight);
  1886. color:var(--askLinkColor);
  1887. text-align:var(--postsTextPosition);
  1888. font-size:1.6rem;
  1889. }
  1890.  
  1891. .spotify_audio_player {
  1892. max-width: 100%;
  1893. width: var(--postWidth);
  1894. height: 80px;
  1895. }
  1896.  
  1897.  
  1898. /* postnotes */
  1899. .post-notes {
  1900. list-style-type: none;
  1901. /*margin: var(--postsMargin) 0;*/
  1902. font-family: var(--bodyFont), Arial, sans-serif;
  1903. font-size:var(--bodyFontSize);
  1904. color:var(--bodyTextColor);
  1905. background-color:var(--postsBackgroundColor);
  1906. text-align:center;
  1907. }
  1908.  
  1909. .post-notes ol li, .post-notes ul li {
  1910. list-style-type: none;
  1911. margin:0;
  1912. line-height: calc(var(--postsLineHeight) + 0.5rem);
  1913. }
  1914.  
  1915. .post-notes ol li.like::before {
  1916. content: '\e12c';
  1917. font-family:'saturnicons';
  1918. font-size:calc(var(--bodyFontSize) - 40%);
  1919. margin-right:0.7rem;
  1920. display:inline-block;
  1921. vertical-align:middle;
  1922. position:relative;
  1923. color: var(--bodyLinkColor);
  1924. }
  1925.  
  1926. .post-notes ol li.reblog::before {
  1927. content: '\e1f5';
  1928. font-family:'saturnicons';
  1929. font-size:calc(var(--bodyFontSize) - 40%);
  1930. margin-right:0.7rem;
  1931. display:inline-block;
  1932. vertical-align:middle;
  1933. position:relative;
  1934. color: var(--bodyLinkColor);
  1935. }
  1936.  
  1937. .post-notes ol li.original_post::before {
  1938. content: '\e213';
  1939. font-family:'saturnicons';
  1940. font-size:calc(var(--bodyFontSize) - 40%);
  1941. bottom:0.5rem;
  1942. margin-right:0.7rem;
  1943. display:inline-block;
  1944. vertical-align:middle;
  1945. position:relative;
  1946. color: var(--bodyLinkColor);
  1947. }
  1948.  
  1949.  
  1950. .post-notes ol li:hover:before {
  1951. color:var(--bodyLinkHoverColor);
  1952. }
  1953.  
  1954. .post-notes ol li .more_notes_link a::before {
  1955. content: '';
  1956. }
  1957.  
  1958.  
  1959. ol.notes {
  1960. list-style:none;
  1961. color:var(--bodyTextColor);
  1962. padding: 2rem;
  1963. }
  1964.  
  1965. ol.notes img {
  1966. display: none;
  1967. }
  1968.  
  1969. /* quote */
  1970. .type-quote {
  1971. padding:1rem 2rem;
  1972. font-size:var(--postsTitlesFontSize);
  1973. text-transform:var(--postsTitlesTextTransform);
  1974. color:var(--bodyBoldColor);
  1975. font-weight:var(--boldFontWeight);
  1976. text-align:var(--postsTextPosition);
  1977. }
  1978.  
  1979. .type-quote blockquote {
  1980. padding: 0 0 1rem;
  1981. }
  1982.  
  1983. .quote-source {
  1984. font-weight: normal;
  1985. font-size: var(--bodyFontSize);
  1986. }
  1987.  
  1988. .quote-source::before {
  1989. content: '';
  1990. width: 1.5rem;
  1991. height: 0.1rem;
  1992. margin-right:1rem;
  1993. display:inline-block;
  1994. vertical-align:middle;
  1995. position:relative;
  1996. background-color: var(--bordersColor);
  1997. }
  1998.  
  1999. /* link */
  2000.  
  2001. .link-image img {
  2002. -o-object-fit: cover;
  2003. object-fit: cover;
  2004. margin-bottom:0.5rem;
  2005. }
  2006.  
  2007. .container-link-txt, .container-link-host {
  2008. padding:0.5rem 1rem;
  2009. }
  2010.  
  2011. .container-link-txt {
  2012. font-style: italic;
  2013. }
  2014.  
  2015. /* chat */
  2016. .type-chat .chat-lines li::before {
  2017. content: '';
  2018. margin: 0;
  2019. padding: 0;
  2020. }
  2021.  
  2022. .label {
  2023. font-weight:var(--boldFontWeight);
  2024. color:var(--bodyBoldColor);
  2025. }
  2026.  
  2027. .line {
  2028. padding: 0px 0px 0.5rem;
  2029. margin: 0px 0px 0.5rem;
  2030. }
  2031.  
  2032.  
  2033. p.npf_chat {
  2034. font-size:var(--bodyFontSize);
  2035. font-family: var(--bodyFont), Arial, sans-serif;
  2036. list-style:none;
  2037. }
  2038.  
  2039. #btn-mobile, #mobile-pagination {
  2040. overflow:hidden;
  2041. visibility: hidden;
  2042. display: none;
  2043. }
  2044.  
  2045.  
  2046. /* DO NOT REMOVE */
  2047. .mcredito {
  2048. display: flex;
  2049. align-items: center;
  2050. justify-content: center;
  2051. position:fixed;
  2052. right:5px;
  2053. bottom:10px;
  2054. padding:8px 12px;
  2055. background-color:var(--sidebarPrimaryBackgroundColor);
  2056. {block:ifBoxShadow}
  2057. -webkit-box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  2058. box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  2059. {/block:ifBoxShadow}
  2060. {block:ifShowBorders}
  2061. outline:var(--bordersSize) var(--bordersStyle) var(--bordersColor);
  2062. {/block:ifShowBorders}
  2063. }
  2064.  
  2065. .mcredito a {
  2066. margin:0;
  2067. font-weight:var(--boldFontWeight);
  2068. text-transform:lowercase;
  2069. text-align:center;
  2070. color:var(--bodyLinkColor);
  2071. }
  2072.  
  2073. .mcredito a:hover {
  2074. color:var(--bodyLinkHoverColor);
  2075. }
  2076.  
  2077. .dot-separator {
  2078. width: 0.3rem;
  2079. height: 0.3rem;
  2080. margin:0.1rem 0.5rem;
  2081. display:inline-block;
  2082. border-radius: 50%;
  2083. background-color: var(--bodyLinkColor);
  2084. }
  2085.  
  2086.  
  2087. /*STYLES FOR MOBILE*/
  2088.  
  2089. @media (max-width:950px) {
  2090.  
  2091. /*mobile container*/
  2092. .theme-container {
  2093. width: 100%;
  2094. display: grid;
  2095. grid-template-columns: 1fr;
  2096. grid-template-rows: auto 1fr;
  2097. gap: 3rem;
  2098. justify-content: center;
  2099. margin:0;
  2100. }
  2101.  
  2102. .sidebar {
  2103. width: 90%;
  2104. height: auto;
  2105. justify-content: center;
  2106. max-width: calc(var(--postWidth) + 1px);
  2107. margin: 10rem auto 5rem;
  2108. }
  2109.  
  2110. .sidebar-content {
  2111. width: 90%;
  2112. position: static;
  2113. }
  2114.  
  2115. .sidebar-navigation {
  2116. width: 50%;
  2117. }
  2118.  
  2119. .container {
  2120. width: 90%;
  2121. margin: 0 auto var(--postsMargin);
  2122. }
  2123.  
  2124. .sidebar-image {
  2125. display: none;
  2126. overflow:hidden;
  2127. visibility: hidden;
  2128. }
  2129.  
  2130. .photoset-grid {
  2131. width:100%;
  2132. max-width: var(--postWidth);
  2133. grid-gap: {select:Photoset Gutter};
  2134. margin: 0 auto;
  2135. }
  2136.  
  2137. .mcredito {
  2138. width: 100%;
  2139. right:0px;
  2140. bottom:0px;
  2141. padding:15px;
  2142. }
  2143.  
  2144.  
  2145.  
  2146. /* menu mobile */
  2147.  
  2148. #mobile-pagination {
  2149. visibility: visible;
  2150. display: inline-block;
  2151. margin-right:1rem;
  2152. }
  2153.  
  2154. }
  2155.  
  2156. /* tumblr controls */
  2157. {block:ifCustomControls}
  2158. .controls-button {
  2159. position: fixed;
  2160. cursor: help;
  2161. top: 20px;
  2162. right: 2rem;
  2163. z-index: 1000;
  2164. cursor: pointer;
  2165. right:1.5rem;
  2166. }
  2167.  
  2168. .tmblr-iframe {
  2169. z-index: 999999999!important;
  2170. opacity: 0;
  2171. visibility: hidden;
  2172. -webkit-transition: all 0.5s;
  2173. -moz-transition: all 0.5s;
  2174. -ms-transition: all 0.5s;
  2175. -o-transition: all 0.5s;
  2176. transition: all 0.5s;
  2177. }
  2178.  
  2179. body.controls-click .tmblr-iframe {
  2180. opacity: 1;
  2181. margin-right: 4rem;
  2182. visibility: visible;
  2183. -webkit-transition: all 0.5s;
  2184. -moz-transition: all 0.5s;
  2185. -ms-transition: all 0.5s;
  2186. -o-transition: all 0.5s;
  2187. transition: all 0.5s;
  2188. }
  2189.  
  2190. .controls-button .feather,
  2191. #btn-mobile .feather {
  2192. color: var(--tumblrControlsIconColor);
  2193. width:1.5rem;
  2194. height:1.5rem;
  2195. }
  2196.  
  2197. {/block:ifCustomControls}
  2198.  
  2199. {block:ifNotDisableSwitchThemeColor}
  2200. /* css for dark theme */
  2201. .theme-switch input {
  2202. display: none;
  2203. }
  2204.  
  2205. .theme-switch-svg {
  2206. cursor: pointer;
  2207. width: var(--bodyFontSize);
  2208. height: var(--bodyFontSize);
  2209. }
  2210.  
  2211. .theme-switch-svg svg {
  2212. cursor: pointer;
  2213. }
  2214. {/block:ifNotDisableSwitchThemeColor}
  2215.  
  2216.  
  2217. /* Tumblr: Custom CSS */
  2218. {CustomCSS}
  2219. </style>
  2220. </head>
  2221.  
  2222. <body>
  2223. <div class="theme-container">
  2224. <aside class="sidebar">
  2225. <div class="sidebar-content">
  2226. {block:IfNotSidebarIconImage}
  2227. {block:IfSidebarImage}
  2228. <div class="sidebar-image">
  2229. <img src="{image:Sidebar Image}" />
  2230. </div>
  2231. {/block:IfSidebarImage}
  2232. {/block:IfNotSidebarIconImage}
  2233.  
  2234. {block:IfNotSidebarImage}
  2235. {block:IfSidebarIconImage}
  2236. <div class="sidebar-icon-container">
  2237. <div class="sidebar-image-icon">
  2238. <img src="{image:Sidebar Image}" />
  2239. </div>
  2240. </div>
  2241. {/block:IfSidebarIconImage}
  2242. {/block:IfNotSidebarImage}
  2243. <span class="clearfix"></span>
  2244.  
  2245. <div class="sidebar-links-description {block:IfSidebarLinksText}sidebar-links-text{/block:IfSidebarLinksText}">
  2246. {block:IfNotHideDescription}
  2247. <div class="sidebar-description">
  2248. <div class="sidebar-description-content">
  2249. {Description}
  2250. </div>
  2251. </div>
  2252. {/block:IfNotHideDescription}
  2253.  
  2254. <nav class="sidebar-navigation {block:IfSidebarLinksText}sidebar-links-text{/block:IfSidebarLinksText}">
  2255. <ul>
  2256. <li>
  2257. <a href="{text:Home URL}">
  2258. {block:IfNotSidebarLinksText}
  2259. <span title="{text:Home Text}">
  2260. <i data-feather="{text:Home Icon}" class="feather"></i>
  2261. </span>
  2262. {/block:IfNotSidebarLinksText}
  2263. {block:IfSidebarLinksText}
  2264. {text:Home Text}
  2265. {/block:IfSidebarLinksText}
  2266. </a>
  2267. </li>
  2268.  
  2269. <li>
  2270. <a href="{text:Ask URL}">
  2271. {block:IfNotSidebarLinksText}
  2272. <span title="{text:Ask Text}">
  2273. <i data-feather="{text:Ask Icon}" class="feather"></i>
  2274. </span>
  2275. {/block:IfNotSidebarLinksText}
  2276. {block:IfSidebarLinksText}
  2277. {text:Ask Text}
  2278. {/block:IfSidebarLinksText}
  2279. </a>
  2280. </li>
  2281.  
  2282. {block:ifSidebarLink1}
  2283. <li>
  2284. <a href="{text:Sidebar Link 1 URL}">
  2285. {block:IfNotSidebarLinksText}
  2286. <span title="{text:Sidebar Link 1 Text}">
  2287. <i data-feather="{text:Sidebar Link 1 Icon}" title="{text:Sidebar Link 1 Text}" class="feather"></i>
  2288. </span>
  2289. {/block:IfNotSidebarLinksText}
  2290. {block:IfSidebarLinksText}
  2291. {text:Sidebar Link 1 Text}
  2292. {/block:IfSidebarLinksText}
  2293. </a>
  2294. </li>
  2295. {/block:ifSidebarLink1}
  2296.  
  2297. {block:ifSidebarLink2}
  2298. <li>
  2299. <a href="{text:Sidebar Link 2 URL}">
  2300. {block:IfNotSidebarLinksText}
  2301. <span title="{text:Sidebar Link 2 Text}">
  2302. <i data-feather="{text:Sidebar Link 2 Icon}" class="feather"></i>
  2303. </span>
  2304. {/block:IfNotSidebarLinksText}
  2305. {block:IfSidebarLinksText}
  2306. {text:Sidebar Link 2 Text}
  2307. {/block:IfSidebarLinksText}
  2308. </a>
  2309. </li>
  2310. {/block:ifSidebarLink2}
  2311.  
  2312. {block:ifSidebarLink3}
  2313. <li>
  2314. <a href="{text:Sidebar Link 3 URL}">
  2315. {block:IfNotSidebarLinksText}
  2316. <span title="{text:Sidebar Link 3 Text}">
  2317. <i data-feather="{text:Sidebar Link 3 Icon}" class="feather"></i>
  2318. </span>
  2319. {/block:IfNotSidebarLinksText}
  2320. {block:IfSidebarLinksText}
  2321. {text:Sidebar Link 3 Text}
  2322. {/block:IfSidebarLinksText}
  2323. </a>
  2324. </li>
  2325. {/block:ifSidebarLink3}
  2326.  
  2327. {block:ifSidebarLink4}
  2328. <li>
  2329. <a href="{text:Sidebar Link 4 URL}">
  2330. {block:IfNotSidebarLinksText}
  2331. <span title="{text:Sidebar Link 4 Text}">
  2332. <i data-feather="{text:Sidebar Link 4 Icon}" class="feather"></i>
  2333. </span>
  2334. {/block:IfNotSidebarLinksText}
  2335. {block:IfSidebarLinksText}
  2336. {text:Sidebar Link 4 Text}
  2337. {/block:IfSidebarLinksText}
  2338. </a>
  2339. </li>
  2340. {/block:ifSidebarLink4}
  2341.  
  2342. {block:IfShowPagesLink}
  2343. {block:HasPages}
  2344. {block:Pages}
  2345. <li>
  2346. <a href="{URL}">{Label}</a>
  2347. </li>
  2348. {/block:Pages}
  2349. {/block:HasPages}
  2350. {/block:IfShowPagesLink}
  2351. </ul>
  2352. </nav>
  2353. </div>
  2354.  
  2355.  
  2356. {block:IfSidebarTitle}
  2357. <div class="sidebar-title">
  2358. {Title}
  2359. </div>
  2360. {/block:IfSidebarTitle}
  2361.  
  2362. <form action="javascript:return false" method="get" class="search sidebar-search">
  2363. <input type="text" name="q" value="{SearchQuery}" placeholder="{lang:Search}" />
  2364. </form>
  2365. <nav class="sidebar-pagination">
  2366. <ul>
  2367. <ul>
  2368. {block:PreviousPage}<li><a href="{PreviousPage}">{lang:Previous page}</a></li>{/block:PreviousPage}
  2369. {block:NextPage}<li><a href="{NextPage}">{lang:Next page}</a></li>{/block:NextPage}
  2370. </ul>
  2371. <ul>
  2372. <li>
  2373. {block:ifNotDisableSwitchThemeColor}
  2374. <div class="theme-switch-wrapper">
  2375. <label class="theme-switch" for="checkbox">
  2376. <input type="checkbox" id="checkbox" />
  2377. <div class="theme-switch-svg" title="Change Theme Color">
  2378. </div>
  2379. </label>
  2380. </div>
  2381. {/block:ifNotDisableSwitchThemeColor}
  2382. </li>
  2383. </ul>
  2384. </ul>
  2385. </nav>
  2386. </div>
  2387. </aside>
  2388.  
  2389. <main class="container">
  2390. {block:SearchPage}
  2391. <div class="search-page container-header">
  2392. {block:SearchResults}
  2393. <p class="search-result container-header-content">{lang:Search results for SearchQuery 2}</p>
  2394. {/block:SearchResults}
  2395.  
  2396. {block:NoSearchResults}
  2397. <p class="search-result container-header-content">{lang:Sorry no results for SearchQuery 2}</p>
  2398. {/block:NoSearchResults}
  2399. </div>
  2400. {/block:SearchPage}
  2401.  
  2402. {block:TagPage}
  2403. <div class="tag-page container-header">
  2404. <p class="tag-wrapper container-header-content">{lang:Showing TagResultCount posts tagged Tag 2}</p>
  2405. </div>
  2406. {/block:TagPage}
  2407.  
  2408. {block:posts inlineMediaWidth="1280" inlineNestedMediaWidth="1280"}
  2409. <article class="container-posts" id="{PostID}" post-type="{PostType}">
  2410. {block:Text}
  2411. <div class="type-text post">
  2412. {block:Title}
  2413. <h1 class="posts-title">
  2414. <a href="{Permalink}">{Title}</a>
  2415. </h1>
  2416. {/block:Title}
  2417.  
  2418. <!-- captions -->
  2419. {block:ifTumblrCaptions}
  2420. {block:NotReblog}
  2421. <div class="caption">
  2422. {block:IfUsernameOriginalPost}
  2423. <div class="caption-user">
  2424. {block:ifCaptionAvatar}
  2425. {block:ifNotCustomCaptionIcon}
  2426. <img src="{PortraitURL-64}" class="caption-user-icon">
  2427. {/block:ifNotCustomCaptionIcon}
  2428. {/block:ifCaptionAvatar}
  2429. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Name}</a>
  2430. </div>
  2431. {/block:IfUsernameOriginalPost}
  2432. <div class="caption-content">{Body}</div>
  2433. </div>
  2434. {/block:NotReblog}
  2435. {block:RebloggedFrom}
  2436. {block:Reblogs}
  2437. <div class="caption">
  2438. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  2439. {block:ifCaptionAvatar}
  2440. {block:ifNotCustomCaptionIcon}
  2441. <img src="{ReblogRootPortraitURL-64}" class="caption-user-icon">
  2442. {/block:ifNotCustomCaptionIcon}
  2443. {/block:ifCaptionAvatar}
  2444. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Username}</a>
  2445. </div>
  2446. <div class="caption-content">{Body}</div>
  2447. </div>
  2448. {/block:Reblogs}
  2449. {/block:RebloggedFrom}
  2450. {/block:ifTumblrCaptions}
  2451.  
  2452. {block:ifNotTumblrCaptions}
  2453. <div class="caption caption-content">
  2454. {Body}
  2455. </div>
  2456. {/block:ifNotTumblrCaptions}
  2457. </div>
  2458. {/block:Text}
  2459.  
  2460. {block:Photo}
  2461. <figure class="type-photo post">
  2462. {LinkOpenTag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" />{LinkCloseTag}
  2463. {block:Caption}
  2464. {block:ifTumblrCaptions}
  2465. {block:NotReblog}
  2466. <figcaption class="caption">
  2467. {block:IfUsernameOriginalPost}
  2468. {block:NotReblog}
  2469. <div class="caption-user">
  2470. {block:ifCaptionAvatar}
  2471. {block:ifNotCustomCaptionIcon}
  2472. <img src="{PortraitURL-64}" class="caption-user-icon">
  2473. {/block:ifNotCustomCaptionIcon}
  2474. {/block:ifCaptionAvatar}
  2475. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Name}</a>
  2476. </div>
  2477. {/block:NotReblog}
  2478. {/block:IfUsernameOriginalPost}
  2479. <div class="caption-content">{Caption}</div>
  2480. </figcaption>
  2481. {/block:NotReblog}
  2482. {block:Rebloggedfrom}
  2483. {block:Reblogs}
  2484. <div class="caption">
  2485. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  2486. {block:ifCaptionAvatar}
  2487. <img src="{ReblogRootPortraitURL-64}" class="caption-user-icon">
  2488. {/block:ifCaptionAvatar}
  2489. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Username}</a>
  2490. </div>
  2491. <figcaption class="caption-content">{Body}</figcaption>
  2492. </div>
  2493. {/block:Reblogs}
  2494. {/block:RebloggedFrom}
  2495. {/block:ifTumblrCaptions}
  2496.  
  2497. {block:ifNotTumblrCaptions}
  2498. <figcaption class="caption caption-content">
  2499. {Caption}
  2500. </figcaption>
  2501. {/block:ifNotTumblrCaptions}
  2502. {/block:Caption}
  2503. </figure>
  2504. {/block:Photo}
  2505.  
  2506. {block:Photoset}
  2507. <figure class="type-photoset post">
  2508. <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>
  2509. {block:Caption}
  2510. {block:ifTumblrCaptions}
  2511. {block:NotReblog}
  2512. <figcaption class="caption">
  2513. {block:IfUsernameOriginalPost}
  2514. {block:NotReblog}
  2515. <div class="caption-user">
  2516. {block:ifCaptionAvatar}
  2517. {block:ifNotCustomCaptionIcon}
  2518. <img src="{PortraitURL-64}" class="caption-user-icon">
  2519. {/block:ifNotCustomCaptionIcon}
  2520. {/block:ifCaptionAvatar}
  2521. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Name}</a>
  2522. </div>
  2523. {/block:NotReblog}
  2524. {/block:IfUsernameOriginalPost}
  2525. <div class="caption-content">{Caption}</div>
  2526. </figcaption>
  2527. {/block:NotReblog}
  2528. {block:Rebloggedfrom}
  2529. {block:Reblogs}
  2530. <div class="caption">
  2531. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  2532. {block:ifCaptionAvatar}
  2533. {block:ifNotCustomCaptionIcon}
  2534. <img src="{ReblogRootPortraitURL-64}" class="caption-user-icon">
  2535. {/block:ifNotCustomCaptionIcon}
  2536. {/block:ifCaptionAvatar}
  2537. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Username}</a>
  2538. </div>
  2539. <figcaption class="caption-content">{Body}</figcaption>
  2540. </div>
  2541. {/block:Reblogs}
  2542. {/block:RebloggedFrom}
  2543. {/block:ifTumblrCaptions}
  2544.  
  2545. {block:ifNotTumblrCaptions}
  2546. <figcaption class="caption caption-content">
  2547. {Caption}
  2548. </figcaption>
  2549. {/block:ifNotTumblrCaptions}
  2550. {/block:Caption}
  2551. </figure>
  2552. {/block:Photoset}
  2553.  
  2554. {block:Quote}
  2555. <div class="type-quote post">
  2556. <blockquote>{Quote}</blockquote>
  2557.  
  2558. {block:Source}
  2559. <cite class="quote-source">
  2560. {Source}
  2561. </cite>
  2562. {/block:Source}
  2563. </div>
  2564. {/block:Quote}
  2565.  
  2566. {block:Link}
  2567. <div class="type-link post">
  2568. <div class="link-content caption">
  2569. <a href="{URL}" class="link-wrap">
  2570. {block:Thumbnail}<img class="link-image" src="{Thumbnail-HighRes}">{/block:Thumbnail}
  2571. </a>
  2572. <div class="container-link">
  2573. <h3><a href="{URL}" class="link-wrap">{Name}</a></h3>
  2574.  
  2575. {block:Excerpt}<div class="container-link-txt">{Excerpt}</div>{/block:Excerpt}
  2576. <a href="{URL}" class="link-wrap">
  2577. {block:Host}<div class="container-link-host">{Host}</div>{/block:Host}
  2578. </a>
  2579. </div>
  2580. </div>
  2581.  
  2582. {block:Description}
  2583. {block:ifTumblrCaptions}
  2584. {block:NotReblog}
  2585. <div class="caption">
  2586. <div class="caption-content">{Description}</div>
  2587. </div>
  2588. {/block:NotReblog}
  2589. {block:Rebloggedfrom}
  2590. {block:Reblogs}
  2591. <div class="caption">
  2592. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  2593. {block:ifCaptionAvatar}
  2594. {block:ifNotCustomCaptionIcon}
  2595. <img src="{ReblogRootPortraitURL-64}" class="caption-user-icon">
  2596. {/block:ifNotCustomCaptionIcon}
  2597. {/block:ifCaptionAvatar}
  2598. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Username}</a>
  2599. </div>
  2600. <div class="caption-content">{Body}</div>
  2601. </div>
  2602. {/block:Reblogs}
  2603. {/block:RebloggedFrom}
  2604. {/block:ifTumblrCaptions}
  2605.  
  2606. {block:ifNotTumblrCaptions}
  2607. <div class="caption caption-content">
  2608. {Description}
  2609. </div>
  2610. {/block:ifNotTumblrCaptions}
  2611. {/block:Description}
  2612. </div>
  2613. {/block:Link}
  2614.  
  2615. {block:Chat}
  2616. <div class="type-chat post">
  2617. {block:Title}
  2618. <h2 class="posts-title"><a href="{Permalink}">{Title}</a></h2>
  2619. {/block:Title}
  2620. <div class="caption">
  2621. {block:Lines}
  2622. {block:Label}
  2623. <div class="label">{Label}</div>
  2624. {/block:Label}
  2625. <div class="line">{Line}</div>
  2626. {/block:Lines}
  2627. </div>
  2628. </div>
  2629. {/block:Chat}
  2630.  
  2631. {block:Audio}
  2632. <div class="type-audio post">
  2633. <div class="audio">
  2634. <div class="audiobox">
  2635. <div class="button">
  2636. {block:AudioPlayer}{AudioPlayer}{/block:AudioPlayer}
  2637. </div>
  2638. </div>
  2639. <div class="album-art">
  2640. {block:AlbumArt}
  2641. <img src="{AlbumArtURL}" />
  2642. {/block:AlbumArt}
  2643. </div>
  2644.  
  2645. {block:TrackName}
  2646. <div class="audio_trackinfo">
  2647. <div class="audio_trackname">{TrackName}</div>
  2648. {block:Artist}<div class="audio_artist">{Artist}</div>{/block:Artist}
  2649. {block:Album}<div class="audio_album">{Album}</div>{/block:Album}
  2650. </div>
  2651. {/block:TrackName}
  2652. </div>
  2653. {block:Caption}
  2654. {block:ifTumblrCaptions}
  2655. {block:NotReblog}
  2656. <div class="caption">
  2657. {block:IfUsernameOriginalPost}
  2658. {block:NotReblog}
  2659. <div class="caption-user">
  2660. {block:ifCaptionAvatar}
  2661. {block:ifNotCustomCaptionIcon}
  2662. <img src="{PortraitURL-64}" class="caption-user-icon">
  2663. {/block:ifNotCustomCaptionIcon}
  2664. {/block:ifCaptionAvatar}
  2665. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Name}</a>
  2666. </div>
  2667. {/block:NotReblog}
  2668. {/block:IfUsernameOriginalPost}
  2669. <div class="caption-content">{Caption}</div>
  2670. </div>
  2671. {/block:NotReblog}
  2672. {block:Rebloggedfrom}
  2673. {block:Reblogs}
  2674. <div class="caption">
  2675. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  2676. {block:ifCaptionAvatar}
  2677. {block:ifNotCustomCaptionIcon}
  2678. <img src="{ReblogRootPortraitURL-64}" class="caption-user-icon">
  2679. {/block:ifNotCustomCaptionIcon}
  2680. {/block:ifCaptionAvatar}
  2681. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Username}</a>
  2682. </div>
  2683. <div class="caption-content">{Body}</div>
  2684. </div>
  2685. {/block:Reblogs}
  2686. {/block:RebloggedFrom}
  2687. {/block:ifTumblrCaptions}
  2688.  
  2689. {block:ifNotTumblrCaptions}
  2690. <div class="caption caption-content">
  2691. {Caption}
  2692. </div>
  2693. {/block:ifNotTumblrCaptions}
  2694. {/block:Caption}
  2695. </div>
  2696. {/block:Audio}
  2697.  
  2698. {block:Video}
  2699. <div class="type-video post video">
  2700. {Video-500}
  2701. {block:Caption}
  2702. {block:ifTumblrCaptions}
  2703. {block:NotReblog}
  2704. <div class="caption">
  2705. {block:IfUsernameOriginalPost}
  2706. {block:NotReblog}
  2707. <div class="caption-user">
  2708. {block:ifCaptionAvatar}
  2709. {block:ifNotCustomCaptionIcon}
  2710. <img src="{ReblogRootPortraitURL-64}" class="caption-user-icon">
  2711. {/block:ifNotCustomCaptionIcon}
  2712. {/block:ifCaptionAvatar}
  2713. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Name}</a>
  2714. </div>
  2715. {/block:NotReblog}
  2716. {/block:IfUsernameOriginalPost}
  2717. <div class="caption-content">{Caption}</div>
  2718. </div>
  2719. {/block:NotReblog}
  2720. {block:Rebloggedfrom}
  2721. {block:Reblogs}
  2722. <div class="caption">
  2723. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  2724. {block:ifCaptionAvatar}
  2725. {block:ifNotCustomCaptionIcon}
  2726. <img src="{ReblogRootPortraitURL-64}" class="caption-user-icon">
  2727. {/block:ifNotCustomCaptionIcon}
  2728. {/block:ifCaptionAvatar}
  2729. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Username}</a>
  2730. </div>
  2731. <div class="caption-content">{Body}</div>
  2732. </div>
  2733. {/block:Reblogs}
  2734. {/block:RebloggedFrom}
  2735. {/block:ifTumblrCaptions}
  2736.  
  2737. {block:ifNotTumblrCaptions}
  2738. <div class="caption caption-content">
  2739. {Caption}
  2740. </div>
  2741. {/block:ifNotTumblrCaptions}
  2742. {/block:Caption}
  2743. </div>
  2744. {/block:Video}
  2745.  
  2746.  
  2747. {block:Answer}
  2748. <div class="type-ask">
  2749. <div class="ask">
  2750. <span class="ask-question">
  2751. {Question}
  2752. </span>
  2753. <span class="clearfix"></span>
  2754.  
  2755. <span class="ask-user">
  2756. {lang:Asked by Asker 2}
  2757. </span>
  2758. </div>
  2759. {block:Answerer}
  2760. <div class="caption">
  2761. {block:ifTumblrCaptions}
  2762. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  2763. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Answerer}</a>
  2764. </div>
  2765. {/block:ifTumblrCaptions}
  2766. <div class="ask-answer caption-content">
  2767. {Answer}
  2768. </div>
  2769. </div>
  2770. {/block:Answerer}
  2771. {block:ifTumblrCaptions}
  2772. {block:NotReblog}
  2773. <div class="caption">
  2774. {block:IfUsernameOriginalPost}
  2775. {block:NotReblog}
  2776. <div class="caption-user">
  2777. {block:ifCaptionAvatar}
  2778. {block:ifNotCustomCaptionIcon}
  2779. <img src="{PortraitURL-64}" class="caption-user-icon">
  2780. {/block:ifNotCustomCaptionIcon}
  2781. {/block:ifCaptionAvatar}
  2782. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Name}</a>
  2783. </div>
  2784. {/block:NotReblog}
  2785. {/block:IfUsernameOriginalPost}
  2786. <div class="caption-content">{Replies}</div>
  2787. </div>
  2788. {/block:NotReblog}
  2789. {block:Rebloggedfrom}
  2790. {block:Reblogs}
  2791. <div class="caption">
  2792. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  2793. {block:ifCaptionAvatar}
  2794. {block:ifNotCustomCaptionIcon}
  2795. <img src="{ReblogRootPortraitURL-64}" class="caption-user-icon">
  2796. {/block:ifNotCustomCaptionIcon}
  2797. {/block:ifCaptionAvatar}
  2798. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Username}</a>
  2799. </div>
  2800. <div class="caption-content">{Body}</div>
  2801. </div>
  2802. {/block:Reblogs}
  2803. {/block:RebloggedFrom}
  2804. {/block:ifTumblrCaptions}
  2805.  
  2806. {block:ifNotTumblrCaptions}
  2807. <div class="caption caption-content">
  2808. {Replies}
  2809. </div>
  2810. {/block:ifNotTumblrCaptions}
  2811. </div>
  2812. {/block:Answer}
  2813.  
  2814. {block:Date}
  2815. <div class="container-date">
  2816. <div class="container-date-content">
  2817. <div class="show-more-info toggle-tags">
  2818. {block:IfDisableShowMoreInfo}
  2819. <a href="{Permalink}" class="date-time" title="{timeago}"><span class="time-ago">{TimeStamp}</span></a>
  2820. {/block:IfDisableShowMoreInfo}
  2821.  
  2822. {block:IfNotDisableShowMoreInfo}
  2823. {block:IfShowMoreInfoText}
  2824. Show more info
  2825. {/block:IfShowMoreInfoText}
  2826. {block:IfNotShowMoreInfoText}
  2827. <span title="Show more info">
  2828. <i data-feather="plus-circle" class="feather"></i>
  2829. </span>
  2830. {/block:IfNotShowMoreInfoText}
  2831. {/block:IfNotDisableShowMoreInfo}
  2832. </div>
  2833.  
  2834. <div class="pinned-post">
  2835. {block:PinnedPostLabel}
  2836. {PinnedPostLabel}
  2837. <i data-feather="map-pin" class="feather"></i>
  2838. {/block:PinnedPostLabel}
  2839. </div>
  2840.  
  2841. {block:IfNotDisableShowMoreInfo}
  2842. <a href="{Permalink}" class="date-time" title="{timeago}"><span class="time-ago">{TimeStamp}</span>
  2843. </a>
  2844. {/block:IfNotDisableShowMoreInfo}
  2845.  
  2846. {block:IfDisableShowMoreInfo}
  2847. <a class="note-count date-time" href="{Permalink}">
  2848. <span class="notecount" title="{NoteCountWithLabel}">{NoteCount}</span>
  2849. </a>
  2850. {/block:IfDisableShowMoreInfo}
  2851. </div>
  2852.  
  2853. <div class="container-show-more-info">
  2854. {block:HasTags}
  2855. <ul class="container-tags">
  2856. {block:Tags}<li class="container-tags-info"><a href="{TagURL}">#{Tag}</a> </li>{/block:Tags}
  2857. </ul>
  2858. {/block:HasTags}
  2859. <div class="container-more-info">
  2860. <div class="more-info-first">
  2861. <a target="_blank" href="{ReblogURL}" target="_blank" title="Reblog this post"> reblog</a>
  2862.  
  2863. <a class="like-b" href="#" title="Like this post">
  2864. {LikeButton}<span class="b">like</span>
  2865. </a>
  2866. </div>
  2867. <div class="more-info-second">
  2868. {block:IfNotDisableShowMoreInfo}
  2869. <a class="note-count" href="{Permalink}">
  2870. <span class="notecount" title="{NoteCountWithLabel}">{NoteCount}</span>
  2871. </a>
  2872. {/block:IfNotDisableShowMoreInfo}
  2873.  
  2874. <div class="reblog-link">
  2875. {block:RebloggedFrom}
  2876. <a target="_blank" href="{ReblogParentURL}" title="{lang:Reblogged from} {ReblogParentName}">{ReblogParentName}</a>
  2877. <a target="_blank" href="{ReblogRootURL}" title="{lang:Originally from ReblogRootName}">{ReblogRootName}</a>
  2878. {/block:RebloggedFrom}
  2879. {block:NotReblog}
  2880. <a target="_blank" href="{Permalink}" title="Original post">{Name}</a>
  2881. {/block:NotReblog}
  2882. </div>
  2883. </div>
  2884. </div>
  2885. </div>
  2886. </div>
  2887. {/block:Date}
  2888. </article>
  2889. {block:PostNotes}
  2890. <div class="post-notes container-posts">
  2891. {PostNotes}
  2892. </div>
  2893. {/block:PostNotes}
  2894. {/block:Posts}
  2895. </main>
  2896.  
  2897. <div class="mcredito">
  2898. {block:Pagination}
  2899. <div id="mobile-pagination">
  2900. {block:PreviousPage}<a href="{PreviousPage}">{lang:Previous page}</a> <span class="dot-separator"></span> {/block:PreviousPage}
  2901. {block:NextPage}<a href="{NextPage}">{lang:Next page}</a>{/block:NextPage} <span class="dot-separator"></span>
  2902. </div>
  2903. {/block:Pagination}
  2904. <a class="scrolltop" href="javascript:;" id="scrollToTop" title="Scroll to top">
  2905. <i data-feather="arrow-up" class="feather"></i>
  2906. </a>
  2907. <a href="http://maziekeen.tumblr.com/" target="_blank">maziekeen</a>
  2908. </div>
  2909. </div>
  2910.  
  2911. <!-- top right icon for custom tumblr controls -->
  2912. {block:ifCustomControls}
  2913. <div title="Tumblr Controls" class="controls-button">
  2914. <span title="Tumblr Controls">
  2915. <i data-feather="menu" class="feather"></i>
  2916. </span>
  2917. </div>
  2918. {/block:ifCustomControls}
  2919.  
  2920.  
  2921. {block:ifNotDisableSwitchThemeColor}
  2922. <!-- scripts for dark theme -->
  2923. <script type="text/javascript">
  2924.  
  2925. // The icons
  2926. const sunIcon = '<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round" class="css-i6dzq1"><circle cx="12" cy="12" r="5"></circle><line x1="12" y1="1" x2="12" y2="3"></line><line x1="12" y1="21" x2="12" y2="23"></line><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line><line x1="1" y1="12" x2="3" y2="12"></line><line x1="21" y1="12" x2="23" y2="12"></line><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line></svg>';
  2927.  
  2928. const moonIcon = '<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round" class="css-i6dzq1"><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path></svg>';
  2929.  
  2930.  
  2931. // Get the div where the icons will be added
  2932. const themeIcon = document.querySelector('.theme-switch-svg');
  2933.  
  2934. // Get the current theme from local storage
  2935. const currentTheme = localStorage.getItem('theme') ? localStorage.getItem('theme') : null;
  2936.  
  2937. // Get the theme toggle input
  2938. const toggleSwitch = document.querySelector('.theme-switch input[type="checkbox"]');
  2939.  
  2940.  
  2941. // Check for saved user preference and set the icons for the respective theme accordingly
  2942. if (currentTheme === 'dark') {
  2943. document.documentElement.setAttribute('data-theme', currentTheme);
  2944. toggleSwitch.checked = true;
  2945. themeIcon.innerHTML = sunIcon;
  2946. } else {
  2947. document.documentElement.setAttribute('data-theme', currentTheme);
  2948. toggleSwitch.checked = false;
  2949. themeIcon.innerHTML = moonIcon;
  2950. }
  2951.  
  2952.  
  2953. // Function that will switch the theme based on the if the theme toggle is checked or not
  2954. function switchTheme(e) {
  2955. if (e.target.checked) {
  2956. document.documentElement.setAttribute('data-theme', 'dark');
  2957. localStorage.setItem('theme', 'dark');
  2958. themeIcon.innerHTML = sunIcon;
  2959. toggleSwitch.checked = true;
  2960. themeIcon.innerHTML = sunIcon;
  2961. } else {
  2962. document.documentElement.setAttribute('data-theme', 'light');
  2963. localStorage.setItem('theme', 'light');
  2964. themeIcon.innerHTML = moonIcon;
  2965. toggleSwitch.checked = false;
  2966. }
  2967. }
  2968.  
  2969. // Add an event listener to the theme toggle, which will switch the theme
  2970. toggleSwitch.addEventListener('change', switchTheme, false);
  2971. </script>
  2972. {/block:ifNotDisableSwitchThemeColor}
  2973.  
  2974. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  2975. <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>
  2976. <script type="text/javascript" src="https://static.tumblr.com/i5s2zks/9Acok8oo2/bct-timeago.min.js"></script> <!-- time stamp style -->
  2977. <script src="https://unpkg.com/popper.js@1"></script> <!-- tooltips -->
  2978. <script src="https://unpkg.com/tippy.js@5/dist/tippy-bundle.iife.js"></script> <!-- tooltips -->
  2979. <script src="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script> <!-- resize videos -->
  2980. <script src="//npf-images-v3.github.io/script.js"></script> <!-- npf images readjustment -->
  2981. <script src="https://static.tumblr.com/0podkko/jfMplm3f8/modified_photosets.js"></script> <!-- photosets -->
  2982. <script src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.10/SmoothScroll.min.js"></script> <!-- smooth scroll -->
  2983. <script src="https://static.tumblr.com/ikeq9mi/DfYl6o46t/scrolltotop.min.js"></script> <!-- scroll to top -->
  2984.  
  2985. <!-- masonry navigation -->
  2986. <script src="https://static.tumblr.com/0siu224/Ljlqmh1nv/masonry.pkgd.min.js"></script>
  2987.  
  2988. <script type="text/javascript">
  2989.  
  2990. // masonry navigation
  2991. var elements = document.getElementsByClassName('masonry-navigation');
  2992. var msnry;
  2993. var nElements = elements.length;
  2994. for(var i = 0; i < nElements; i++){
  2995. msnry = new Masonry( elements[i], {
  2996. // columnWidth: 268,
  2997. gutter: 10,
  2998. itemSelector: '.masonry-navigation-item',
  2999. });
  3000. }
  3001. </script>
  3002.  
  3003.  
  3004. <script type="text/javascript">
  3005. // tumblr custom controls click
  3006. $('.controls-button').click(function(){
  3007. $('body').toggleClass('controls-click');
  3008. });
  3009.  
  3010. {block:IfNotDisableShowMoreInfo}
  3011. // toggle more info
  3012. $('.container-show-more-info').hide();
  3013. $('.toggle-tags').click(function(event) {
  3014. $(this).closest('.container-posts').find('.container-show-more-info').slideToggle(200)
  3015. event.preventDefault();
  3016. });
  3017.  
  3018. {/block:IfNotDisableShowMoreInfo}
  3019.  
  3020. // custom date
  3021. $(document).ready(function() {
  3022. $(".time-ago").timeAgo({
  3023. time: "letter", // can be "letter" "short" or "word"
  3024. spaces: false, // adds spaces between words and numbers
  3025. words: false, // turns numbers to words
  3026. prefix: "", // adds a prefix to the outputted string. could be "~" or "about"
  3027. suffix: "", // adds a suffix to the outputted string. could be "ago"
  3028. });
  3029. });
  3030.  
  3031. // tooltips
  3032. tippy('a[title], span[title], div[title], i[title]', {
  3033. theme: 'custom',
  3034. arrow: false,
  3035. zIndex: 9999999999,
  3036. maxWidth: 300,
  3037.  
  3038. content(reference) {
  3039. const title = reference.getAttribute('title');
  3040. reference.removeAttribute('title');
  3041. return title;
  3042. },
  3043. });
  3044.  
  3045. // custom notecount
  3046. var $container = $('.theme-container');
  3047. $container.find('.notecount').each(function(){
  3048. var n = $(this).html().split(' ')[0].replace(/,/g, '');
  3049. if (n > 999) {
  3050. n = Math.floor(n / 100) / 10;
  3051. $(this).text(n + 'k');
  3052. }
  3053. });
  3054.  
  3055. // search box
  3056. $(document).ready(function(){
  3057. $('.search').submit(function(event){
  3058. var value = $('input:first').val();
  3059. location.replace('http://{Name}.tumblr.com/tagged/' + value);
  3060. });
  3061. });
  3062.  
  3063.  
  3064. // initialize css photosets
  3065. function gatherData(images, arr) {
  3066. for (let i = 0; i < images.length; i++) {
  3067. let currentData = {
  3068. "width": images[i].getAttribute('data-width'),
  3069. "height": images[i].getAttribute('data-height'),
  3070. "low_res": images[i].getAttribute('data-lowres'),
  3071. "high_res": images[i].getAttribute('data-highres')
  3072. };
  3073. arr.push(currentData);
  3074. }
  3075. }
  3076. function getIndex(elem) {
  3077. let i = 0;
  3078. while( (elem = elem.previousElementSibling) != null ) i++;
  3079. return i;
  3080. }
  3081. function lightbox(elem) {
  3082. let currentPhotoset = elem.parentNode;
  3083. let photosetPhotos = currentPhotoset.getElementsByTagName('div');
  3084. let data = [];
  3085. gatherData(photosetPhotos, data);
  3086. Tumblr.Lightbox.init(data, getIndex(elem) + 1);
  3087. }
  3088.  
  3089. // detach sidebar on small screens
  3090. var sidebarBottom = document.querySelector('.sidebar-content');
  3091. var selectedSidebarBottom = sidebarBottom.getBoundingClientRect().bottom;
  3092. var selectedSidebarWidth = sidebarBottom.getBoundingClientRect().width;
  3093. var windowHeight = $(window).height();
  3094.  
  3095. if(selectedSidebarBottom >= windowHeight) {
  3096. $('.sidebar-content').css('position', 'static');
  3097. $('#mobile-pagination').css({'visibility': 'visible','overflow':'visible','display': 'inline-block', 'margin-right':'1rem'});
  3098. }
  3099.  
  3100.  
  3101. // feather icons (custom icons)
  3102. feather.replace();
  3103.  
  3104. </script>
  3105. </body>
  3106.  
  3107. </html>
Add Comment
Please, Sign In to add comment