API tools faq
paste
Advertisement
sexycullen

theme 219

sexycullen
Dec 15th, 2020 (edited)
8,467
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 57.22 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2.  
  3. maziekeen's theme #219
  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. base code: egg.design
  16.  
  17. captions and audio style by seyche
  18. css photosets by annasthms
  19. tumblr controls by cyantists
  20. smooth scroll by michael herf and balazs galambosi
  21. saturn icons by suiomi.com
  22. feathericons by github.com/feathericons/feather
  23. normalize reest html by necolas.github.io
  24. tippyjs tooltips by silbrigthemes
  25. like and reblog, video resize by shythemes
  26. npf images readjustment v.02 by glenthemes
  27.  
  28. -->
  29.  
  30.  
  31. <!DOCTYPE html>
  32. <html>
  33. <head>
  34.  
  35. <link rel="shortcut icon" href="{Favicon}" />
  36. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  37. <title>{Title}</title>
  38. {block:Description}
  39. <meta name="description" content="{MetaDescription}" />
  40. {/block:Description}
  41. <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
  42.  
  43. <!-- stylesheets -->
  44. <link href="https://static.tumblr.com/0siu224/1Eaqd80d8/normalize.css" rel="stylesheet"> <!-- reset html code -->
  45. <link href="https://static.tumblr.com/0podkko/oDSpg7y88/photosets.css" rel="stylesheet"> <!-- photosets -->
  46. <link href="//solrainha.github.io/saturnicons/saturnicons.css" rel="stylesheet"> <!-- custom icons -->
  47. <script src="https://unpkg.com/feather-icons"></script> <!-- custom icons -->
  48.  
  49. <!-- custom fonts -->
  50. <link href="https://fonts.googleapis.com/css2?family={text:Body Font Family}:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap" rel="stylesheet" />
  51.  
  52. <!-- image options -->
  53. <meta name="image:Background Image" content="" />
  54. <meta name="image:Sidebar Image" content="" />
  55.  
  56. <!-- color options -->
  57. <meta name="color:Background Theme Color" content="#fefefe" />
  58. <meta name="color:Body Text Color" content="#222222" />
  59. <meta name="color:Body Link Color" content="#222222" />
  60. <meta name="color:Body Link Hover Color" content="#d1d1d1" />
  61. <meta name="color:Bold Color" content="#222222">
  62. <meta name="color:Italic Color" content="#6d6d6d">
  63. <meta name="color:Sidebar Title Color" content="#f3f3f3">
  64. <meta name="color:Sidebar Text Color" content="#f3f3f3">
  65. <meta name="color:Sidebar Link Color" content="#f3f3f3">
  66. <meta name="color:Hover Text Background Color" content="#222222" />
  67. <meta name="color:Hover Text Color" content="#f3f3f3" />
  68. <meta name="color:Date Link Color" content="#222222">
  69. <meta name="color:Tags Link Color" content="#222222">
  70. <meta name="color:Liked Link Color" content="#222222">
  71. <meta name="color:Posts Background Color" content="#ffffff" />
  72. <meta name="color:Borders Color" content="#ededed" />
  73. <meta name="color:Scrollbar Color" content="#222222" />
  74. <meta name="color:Tumblr Controls Icon Color" content="#222222" />
  75.  
  76.  
  77. <!-- text, font style and sizes options -->
  78. <meta name="text:Body Font Family" content="Karla" />
  79.  
  80. <meta name="select:Body Font Size" content="13px" />
  81. <meta name="select:Body Font Size" content="8px" />
  82. <meta name="select:Body Font Size" content="9px" />
  83. <meta name="select:Body Font Size" content="10px" />
  84. <meta name="select:Body Font Size" content="11px" />
  85. <meta name="select:Body Font Size" content="12px" />
  86. <meta name="select:Body Font Size" content="14px" />
  87. <meta name="select:Body Font Size" content="15px" />
  88. <meta name="select:Body Font Size" content="16px" />
  89. <meta name="select:Body Font Size" content="17px" />
  90. <meta name="select:Body Font Size" content="18px" />
  91.  
  92. <meta name="select:Bold Font Weight" content="bold" />
  93. <meta name="select:Bold Font Weight" content="normal" />
  94.  
  95. <meta name="select:Posts Text Position" content="left">
  96. <meta name="select:Posts Text Position" content="justify">
  97.  
  98. <!-- posts titles (h1, h2, h3...) -->
  99. <meta name="select:Posts Titles Font Size" content="16px" />
  100. <meta name="select:Posts Titles Font Size" content="10px" />
  101. <meta name="select:Posts Titles Font Size" content="11px" />
  102. <meta name="select:Posts Titles Font Size" content="12px" />
  103. <meta name="select:Posts Titles Font Size" content="13px" />
  104. <meta name="select:Posts Titles Font Size" content="14px" />
  105. <meta name="select:Posts Titles Font Size" content="15px" />
  106. <meta name="select:Posts Titles Font Size" content="17px" />
  107. <meta name="select:Posts Titles Font Size" content="18px" />
  108.  
  109. <meta name="select:Posts Titles Font Weight" content="bold">
  110. <meta name="select:Posts Titles Font Weight" content="normal">
  111.  
  112. <meta name="select:Posts Titles Font Style" content="normal">
  113. <meta name="select:Posts Titles Font Style" content="italic">
  114.  
  115. <meta name="select:Posts Titles Text Transform" content="none">
  116. <meta name="select:Posts Titles Text Transform" content="uppercase">
  117. <meta name="select:Posts Titles Text Transform" content="lowercase">
  118. <meta name="select:Posts Titles Text Transform" content="capitalize">
  119.  
  120. <meta name="select:Posts Titles Text Position" content="left">
  121. <meta name="select:Posts Titles Text Position" content="center">
  122. <meta name="select:Posts Titles Text Position" content="justify">
  123. <meta name="select:Posts Titles Text Position" content="right">
  124.  
  125. <!-- sidebar position -->
  126. <meta name="select:Sidebar Content Position" content="flex-start" title="top">
  127. <meta name="select:Sidebar Content Position" content="center" title="center">
  128. <meta name="select:Sidebar Content Position" content="flex-end" title="bottom">
  129.  
  130. <!-- sidebar title -->
  131. <meta name="select:Sidebar Title Font Size" content="16px" />
  132. <meta name="select:Sidebar Title Font Size" content="10px" />
  133. <meta name="select:Sidebar Title Font Size" content="11px" />
  134. <meta name="select:Sidebar Title Font Size" content="12px" />
  135. <meta name="select:Sidebar Title Font Size" content="13px" />
  136. <meta name="select:Sidebar Title Font Size" content="14px" />
  137. <meta name="select:Sidebar Title Font Size" content="15px" />
  138. <meta name="select:Sidebar Title Font Size" content="17px" />
  139. <meta name="select:Sidebar Title Font Size" content="18px" />
  140.  
  141. <meta name="select:Sidebar Title Font Weight" content="bold">
  142. <meta name="select:Sidebar Title Font Weight" content="normal">
  143.  
  144. <meta name="select:Sidebar Title Font Style" content="normal">
  145. <meta name="select:Sidebar Title Font Style" content="italic">
  146.  
  147. <meta name="select:Sidebar Title Text Transform" content="none">
  148. <meta name="select:Sidebar Title Text Transform" content="uppercase">
  149. <meta name="select:Sidebar Title Text Transform" content="lowercase">
  150. <meta name="select:Sidebar Title Text Transform" content="capitalize">
  151.  
  152. <meta name="select:Sidebar Title Text Position" content="center">
  153. <meta name="select:Sidebar Title Text Position" content="left">
  154. <meta name="select:Sidebar Title Text Position" content="right">
  155.  
  156.  
  157. <!-- sidebar icons -->
  158. <meta name="select:Sidebar Icons Size" content="14px" />
  159. <meta name="select:Sidebar Icons Size" content="8px" />
  160. <meta name="select:Sidebar Icons Size" content="9px" />
  161. <meta name="select:Sidebar Icons Size" content="10px" />
  162. <meta name="select:Sidebar Icons Size" content="11px" />
  163. <meta name="select:Sidebar Icons Size" content="12px" />
  164. <meta name="select:Sidebar Icons Size" content="13px" />
  165. <meta name="select:Sidebar Icons Size" content="15px" />
  166. <meta name="select:Sidebar Icons Size" content="16px" />
  167. <meta name="select:Sidebar Icons Size" content="17px" />
  168. <meta name="select:Sidebar Icons Size" content="18px" />
  169.  
  170.  
  171. <!-- description -->
  172. <meta name="select:Description Font Size" content="13px" />
  173. <meta name="select:Description Font Size" content="8px" />
  174. <meta name="select:Description Font Size" content="9px" />
  175. <meta name="select:Description Font Size" content="10px" />
  176. <meta name="select:Description Font Size" content="11px" />
  177. <meta name="select:Description Font Size" content="12px" />
  178. <meta name="select:Description Font Size" content="14px" />
  179. <meta name="select:Description Font Size" content="15px" />
  180. <meta name="select:Description Font Size" content="16px" />
  181.  
  182. <meta name="select:Description Font Weight" content="normal" />
  183. <meta name="select:Description Font Weight" content="bold" />
  184.  
  185. <meta name="select:Description Font Style" content="normal" />
  186. <meta name="select:Description Font Style" content="italic" />
  187.  
  188. <meta name="select:Description Text Transform" content="lowercase" />
  189. <meta name="select:Description Text Transform" content="none" />
  190. <meta name="select:Description Text Transform" content="uppercase" />
  191. <meta name="select:Description Text Transform" content="capitalize" />
  192.  
  193. <meta name="select:Description Text Position" content="center" />
  194. <meta name="select:Description Text Position" content="left" />
  195. <meta name="select:Description Text Position" content="justify" />
  196. <meta name="select:Description Text Position" content="right" />
  197.  
  198.  
  199. <!-- date / post info -->
  200. <meta name="select:Date Font Size" content="13px" />
  201. <meta name="select:Date Font Size" content="8px" />
  202. <meta name="select:Date Font Size" content="9px" />
  203. <meta name="select:Date Font Size" content="10px" />
  204. <meta name="select:Date Font Size" content="11px" />
  205. <meta name="select:Date Font Size" content="12px" />
  206. <meta name="select:Date Font Size" content="14px" />
  207. <meta name="select:Date Font Size" content="15px" />
  208. <meta name="select:Date Font Size" content="16px" />
  209.  
  210. <meta name="select:Date Font Weight" content="bold" />
  211. <meta name="select:Date Font Weight" content="normal" />
  212.  
  213. <meta name="select:Date Font Style" content="normal" />
  214. <meta name="select:Date Font Style" content="italic" />
  215.  
  216. <meta name="select:Date Text Transform" content="lowercase" />
  217. <meta name="select:Date Text Transform" content="none" />
  218. <meta name="select:Date Text Transform" content="uppercase" />
  219. <meta name="select:Date Text Transform" content="capitalize" />
  220.  
  221. <meta name="select:Date Text Position" content="left" />
  222. <meta name="select:Date Text Position" content="center" />
  223. <meta name="select:Date Text Position" content="justify" />
  224. <meta name="select:Date Text Position" content="right" />
  225.  
  226.  
  227. <!-- tags / post info -->
  228. <meta name="select:Tags Font Size" content="13px" />
  229. <meta name="select:Tags Font Size" content="8px" />
  230. <meta name="select:Tags Font Size" content="9px" />
  231. <meta name="select:Tags Font Size" content="10px" />
  232. <meta name="select:Tags Font Size" content="11px" />
  233. <meta name="select:Tags Font Size" content="12px" />
  234. <meta name="select:Tags Font Size" content="14px" />
  235. <meta name="select:Tags Font Size" content="15px" />
  236. <meta name="select:Tags Font Size" content="16px" />
  237.  
  238. <meta name="select:Tags Font Weight" content="normal" />
  239. <meta name="select:Tags Font Weight" content="bold" />
  240.  
  241. <meta name="select:Tags Font Style" content="normal" />
  242. <meta name="select:Tags Font Style" content="italic" />
  243.  
  244. <meta name="select:Tags Text Transform" content="none" />
  245. <meta name="select:Tags Text Transform" content="uppercase" />
  246. <meta name="select:Tags Text Transform" content="lowercase" />
  247. <meta name="select:Tags Text Transform" content="capitalize" />
  248.  
  249. <meta name="select:Tags Text Position" content="left" />
  250. <meta name="select:Tags Text Position" content="center" />
  251. <meta name="select:Tags Text Position" content="justify" />
  252. <meta name="select:Tags Text Position" content="right" />
  253.  
  254. <meta name="select:Borders Size" content="1px" />
  255. <meta name="select:Borders Size" content="0px" />
  256. <meta name="select:Borders Size" content="2px" />
  257. <meta name="select:Borders Size" content="3px" />
  258.  
  259. <meta name="select:Borders Style" content="solid" />
  260. <meta name="select:Borders Style" content="dotted" />
  261. <meta name="select:Borders Style" content="dashed" />
  262. <meta name="select:Borders Style" content="double" />
  263. <meta name="select:Borders Style" content="ridge" />
  264.  
  265. <!-- booleans -->
  266. <meta name="if:Posts size 540px" content="1"/>
  267. <meta name="if:Posts size 500px" content="0"/>
  268. <meta name="if:Posts size 400px" content="0"/>
  269.  
  270. <meta name="if:Sidebar Link 1" content="1" />
  271. <meta name="if:Sidebar Link 2" content="1" />
  272. <meta name="if:Sidebar Link 3" content="1" />
  273. <meta name="if:Sidebar Link 4" content="1" />
  274.  
  275. <meta name="if:Sidebar Title" content="1" />
  276. <meta name="if:Sidebar Image" content="1" />
  277. <meta name="if:Images Black and White" content="0" />
  278. <meta name="if:Images Opacity" content="0" />
  279. <meta name="if:Links Underline Border" content="1" />
  280. <meta name="if:Tumblr Captions" content="1"/>
  281. <meta name="if:Custom Caption Icon" content="0" />
  282. <meta name="if:Box Shadow" content="0" />
  283. <meta name="if:Posts Borders" content="0" />
  284. <meta name="if:Custom Controls" content="1"/>
  285.  
  286. <meta name="text:Sidebar Background Color" content="#1a1a1a" />
  287. <meta name="text:Box Shadow Size" content="0px 4px 8px" />
  288. <meta name="text:Box Shadow Color" content="0, 0, 0, 0.1" />
  289.  
  290. <!-- sidebar links -->
  291. <meta name="text:Index URL" content="/" />
  292. <meta name="text:Index Text" content="Index" />
  293. <meta name="text:Index Icon" content="home" />
  294. <meta name="text:Ask URL" content="/ask" />
  295. <meta name="text:Ask Text" content="Ask" />
  296. <meta name="text:Ask Icon" content="mail" />
  297.  
  298. <meta name="text:Sidebar Link 1 URL" content="/" />
  299. <meta name="text:Sidebar Link 1 Text" content="Link 1" />
  300. <meta name="text:Sidebar Link 1 Icon" content="grid" />
  301. <meta name="text:Sidebar Link 2 URL" content="/" />
  302. <meta name="text:Sidebar Link 2 Text" content="Link 2" />
  303. <meta name="text:Sidebar Link 2 Icon" content="edit" />
  304. <meta name="text:Sidebar Link 3 URL" content="/" />
  305. <meta name="text:Sidebar Link 3 Text" content="Link 3" />
  306. <meta name="text:Sidebar Link 3 Icon" content="user" />
  307. <meta name="text:Sidebar Link 4 URL" content="/" />
  308. <meta name="text:Sidebar Link 4 Text" content="Link 4" />
  309. <meta name="text:Sidebar Link 4 Icon" content="file-text" />
  310.  
  311.  
  312. <style>
  313.  
  314. :root {
  315.  
  316. /* colors */
  317. --backgroundThemeColor: {color:Background Theme Color};
  318. --bodyTextColor: {color:Body Text Color};
  319. --bodyLinkColor: {color:Body Link Color};
  320. --bodyLinkHoverColor: {color:Body Link Hover Color};
  321. --boldColor: {color:Bold Color};
  322. --italicColor: {color:Italic Color};
  323. --sidebarTitleColor: {color:Sidebar Title Color};
  324. --sidebarTextColor: {color:Sidebar Text Color};
  325. --sidebarLinkColor: {color:Sidebar Link Color};
  326. --sidebarBackgroundColor: {text:Sidebar Background Color};
  327. --hoverTextBackgroundColor: {color:Hover Text Background Color};
  328. --hoverTextColor: {color:Hover Text Color};
  329. --dateLinkColor:{color:Date Link Color};
  330. --tagsLinkColor: {color:Tags Link Color};
  331. --likedLinkColor: {color:Liked Link Color};
  332. --scrollbarColor: {color:Scrollbar Color};
  333. --bordersColor: {color:Borders Color};
  334. --postsBackgroundColor: {color:Posts Background Color};
  335. --blocksBackgroundColor: {color:Blocks Background Color};
  336. --blocksTextColor: {color:Blocks Text Color};
  337. --tumblrControlsIconColor: {color:Tumblr Controls Icon Color};
  338.  
  339.  
  340. /* fonts, sizes, styles */
  341. --bodyFontFamily: {text:Body Font Family};
  342.  
  343.  
  344. --bodyFontSize: {select:Body Font Size};
  345. --postsTitlesFontSize: {select:Posts Titles Font Size};
  346. --sidebarTitleFontSize: {select:Sidebar TItle Font Size};
  347. --sidebarIconsSize: {select:Sidebar Icons Size};
  348. --descriptionFontSize: {select:Description Font Size};
  349. --dateFontSize:{select:Date Font Size};
  350. --tagsFontSize:{select:Tags Font Size};
  351.  
  352. --boldFontWeight: {select:Bold Font Weight};
  353. --postsTitlesFontWeight: {select:Posts Titles Font Weight};
  354. --sidebarTitleFontWeight: {select:Sidebar Title Font Weight};
  355. --bodyLineHeight: calc(var(--bodyFontSize) * 1.5);
  356. --postsTitlesLineHeight: calc(var(--postsTitlesFontSize) * 1.2);
  357. --sidebarTitleLineHeight: calc(var(--sidebarTitleFontSize) * 1.2);
  358. --descriptionFontWeight: {select:Description Font Weight};
  359. --dateFontWeight:{select:Date Font Weight};
  360. --tagsFontWeight:{select:Tags Font Weight};
  361.  
  362. --postsTitlesTextTransform: {select:Posts Titles Text Transform};
  363. --postsTitlesFontStyle: {select:Posts Titles Font Style};
  364. --sidebarTitleTextTransform: {select:Sidebar Title Text Transform};
  365. --sidebarTitleFontStyle: {select:Sidebar Title Font Style};
  366. --descriptionTextTransform: {select:Description Text Transform};
  367. --descriptionFontStyle: {select:Description Font Style};
  368. --dateTextTransform:{select:Date Text Transform};
  369. --dateFontStyle:{select:Date Font Style};
  370. --tagsTextTransform:{select:Tags Text Transform};
  371. --tagsFontStyle:{select:Tags Font Style};
  372.  
  373. --postsTextPosition: {select:Posts Text Position};
  374. --postsTitlesTextPosition: {select:Posts Titles Text Position};
  375. --sidebarTitleTextPosition: {select:Sidebar Title Text Position};
  376. --descriptionTextPosition: {select:Description Text Position};
  377. --dateTextPosition:{select:Date Text Position};
  378. --tagsTextPosition:{select:Tags Text Position};
  379.  
  380.  
  381. /* other styles */
  382. --bordersStyle: {select:Borders Style};
  383. --bordersSize: {select:Borders Size};
  384. --boxShadowSize:{text:Box Shadow Size};
  385. --boxShadowColor:{text:Box Shadow Color};
  386. --sidebarContentPosition: {select:Sidebar Content Position};
  387. --transitions: all .3s ease;
  388.  
  389. /*npf images readjustment */
  390. --NPF-Image-Spacing:4px;
  391. --NPF-Bottom-Gap-From-Captions:1em;
  392. }
  393.  
  394.  
  395. /* tumblr controls */
  396. {block:ifCustomControls}
  397. iframe.tmblr-iframe {
  398. z-index:99999999999999!important;
  399. top: 15px!important;
  400. right: 15px!important;
  401. opacity:0;
  402. padding-right:38px;
  403. -webkit-transform:scale(0.75);
  404. -ms-transform:scale(0.75);
  405. transform:scale(0.75);
  406. -webkit-transform-origin:100% 0;
  407. -ms-transform-origin:100% 0;
  408. transform-origin:100% 0;
  409. cursor: pointer;
  410. }
  411.  
  412. iframe.tmblr-iframe:hover {
  413. opacity:1!important;
  414. }
  415.  
  416. .hcontrols {
  417. position:fixed;
  418. top:23px;
  419. right:15px;
  420. z-index:999999999;
  421. cursor: pointer;
  422. }
  423.  
  424. .hcontrols .feather {
  425. width:25px;
  426. height:25px;
  427. stroke-width: 2;
  428. stroke:var(--tumblrControlsIconColor);
  429. cursor: pointer;
  430. }
  431.  
  432. .hcontrols .feather:hover {
  433. stroke: var(--bodyLinkHoverColor);
  434. }
  435. {/block:ifCustomControls}
  436.  
  437.  
  438. /* scrollbar */
  439. ::-webkit-scrollbar {
  440. width:7px;
  441. height:7px;
  442. }
  443. ::-webkit-scrollbar {
  444. background-color:var(--backgroundThemeColor);
  445. }
  446. ::-webkit-scrollbar-track {
  447. border:8px solid var(--backgroundThemeColor);
  448. background-color:var(--backgroundThemeColor);
  449. }
  450. ::-webkit-scrollbar-thumb {
  451. border:2.1px solid var(--backgroundThemeColor);
  452. background-color:var(--scrollbarColor);
  453. border-radius:10px;
  454. min-height:24px;
  455. min-width:24px;
  456. }
  457.  
  458. /* scroll to top */
  459. .scrolltop .feather {
  460. margin:-3px 5px -3px -5px;
  461. }
  462.  
  463. .scrolltop {
  464. width:15px;
  465. height:15px;
  466. text-align:center;
  467. color:var(--bodyLinkColor);
  468. display: none;
  469. font-size:var(--bodyFontSize);
  470. }
  471.  
  472. .scrolltop:hover {
  473. color:var(--bodyLinkHoverColor);
  474. }
  475.  
  476. html {
  477. -webkit-box-sizing: border-box;
  478. box-sizing: border-box;
  479. }
  480.  
  481. * {
  482. transition:var(--transitions);
  483. }
  484.  
  485. *::after,
  486. *::before {
  487. box-sizing: inherit;
  488. }
  489.  
  490.  
  491. html,
  492. body {
  493. height: 100vh;
  494. }
  495.  
  496. body {
  497. margin:0;
  498. background:var(--backgroundThemeColor) url({image:Background Image});
  499. font-size:var(--bodyFontSize);
  500. line-height:var(--bodyLineHeight);
  501. background-attachment: fixed;
  502. background-position-x: 30vw;
  503. background-size: cover;
  504. font-family:var(--bodyFontFamily), -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
  505. word-wrap:break-word;
  506. color: var(--bodyTextColor);
  507. }
  508.  
  509.  
  510. a {
  511. text-decoration:none;
  512. color:var(--bodyLinkColor);
  513. }
  514.  
  515. a:hover {
  516. color:var(--bodyLinkHoverColor);
  517. }
  518.  
  519.  
  520.  
  521. {block:IfLinksUnderlineBorder}
  522. .description a,
  523. .pagination a,
  524. .date-content a,
  525. .caption a,
  526. .caption-content a,
  527. .tumblr_blog a,
  528. .ask-user a {
  529. text-decoration:underline;
  530. }
  531. {/block:IfLinksUnderlineBorder}
  532.  
  533. blockquote {
  534. border-left:2px solid {color:blockquote border};
  535. padding-left:10px;
  536. }
  537.  
  538. p:first-child {
  539. margin-block-start: 0;
  540. margin-block-end: 0;
  541. }
  542.  
  543. p:last-child {
  544. margin-block-end: 0;
  545. }
  546.  
  547.  
  548. small, sup, sub {
  549. font-size:var(--bodyFontSize);
  550. }
  551.  
  552. pre {
  553. word-wrap:break-word!Important;
  554. white-space: pre-wrap;
  555. }
  556.  
  557. h1, h2 {
  558. margin: 15px;
  559. font-style:var(--postsTitlesFontStyle);
  560. font-weight:var(--postsTitlesFontWeight);
  561. color:var(--boldColor);
  562. text-transform:var(--postsTitlesTextTransform);
  563. font-size:var(--postsTitlesFontSize);
  564. text-align:var(--postsTitlesTextPosition);
  565. line-height:var(--postsTitlesLineHeight);
  566. }
  567.  
  568. bold, b, strong {
  569. color:var(--boldColor);
  570. font-weight:var(--boldFontWeight);
  571. }
  572.  
  573. italic, i, em {
  574. color:var(--italicColor);
  575. }
  576.  
  577.  
  578. hr {
  579. width:100px;
  580. margin:10px 0 10px 0;
  581. border-width: var(--bordersSize) 0px 0px 0px;
  582. border-style: var(--bordersStyle);
  583. border-color: var(--bordersColor);
  584. }
  585.  
  586.  
  587. img {
  588. {block:ifImagesOpacity}
  589. opacity:0.6;
  590. {/block:ifImagesOpacity}
  591. border:0;
  592. max-width:100%;
  593. height:auto;
  594. display:block;
  595. margin: 0;
  596. padding: 0;
  597. {block:ifImagesBlackandWhite}
  598. -webkit-filter: grayscale(100%);
  599. {/block:ifImagesBlackandWhite}
  600. }
  601.  
  602. img:hover {
  603. opacity:1;
  604. -webkit-filter: grayscale(0%);
  605. }
  606.  
  607. .posts:hover img {
  608. -webkit-filter: grayscale(0%);
  609. opacity:1;
  610. }
  611.  
  612. ::-moz-selection {
  613. background-color: var(--boldColor);
  614. color:var(--postsBackgroundColor);
  615. }
  616.  
  617. ::selection {
  618. background-color: var(--boldColor);
  619. color:var(--postsBackgroundColor);
  620. }
  621.  
  622. /* tooltips */
  623. .tippy-tooltip.custom-theme {
  624. text-align:center;
  625. font-size:var(--bodyFontSize);
  626. font-weight:var(--boldFontWeight);
  627. color:var(--hoverTextColor);
  628. background-color:var(--hoverTextBackgroundColor);
  629. {block:ifBoxShadow}
  630. -webkit-box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  631. box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  632. {/block:ifBoxShadow}
  633. }
  634.  
  635. /* custom icons */
  636. .feather {
  637. width: var(--sidebarIconsSize);
  638. height: var(--sidebarIconsSize);
  639. }
  640.  
  641. .toggle-link .feather:hover,
  642. .navigation ul li .feather:hover {
  643. color: var(--bodyLinkHoverColor);
  644. stroke: var(--bodyLinkHoverColor);
  645. }
  646.  
  647.  
  648. /* sidebar */
  649. .sidebar-title {
  650. width: 268px;
  651. margin: 0 auto 10px;
  652. font-style:var(--sidebarTitleFontStyle);
  653. font-weight:var(--sidebarTitleFontWeight);
  654. color:var(--sidebarTitleColor);
  655. text-transform:var(--sidebarTitleTextTransform);
  656. font-size:var(--sidebarTitleFontSize);
  657. text-align:var(--sidebarTitleTextPosition);
  658. line-height:var(--sidebarTitleLineHeight);
  659. }
  660.  
  661. .sidebar {
  662. position: fixed;
  663. width: 30%;
  664. left: 0;
  665. height: 100vh;
  666. top: 0;
  667. color: var(--sidebarTextColor);
  668. order: 1;
  669. background: #1a1a1a;
  670. background: var(--sidebarBackgroundColor);
  671. display:flex;
  672. align-items: var(--sidebarContentPosition);
  673. justify-content: center;
  674. }
  675.  
  676. .sidebar a {
  677. color: var(--sidebarLinkColor);
  678. }
  679.  
  680. .sidebar-content {
  681. position: fixed;
  682. width: 30%;
  683. max-width:268px;
  684. margin: 50px 0;
  685. overflow: hidden;
  686. }
  687.  
  688. .sidebar img {
  689. width:268px;
  690. height:auto;
  691. object-fit: cover;
  692. display:block;
  693. margin: 0 auto 5px;
  694. }
  695.  
  696. {block:ifPostsSize400px}
  697. .sidebar,
  698. .sidebar-content {
  699. width: 27%;
  700. }
  701.  
  702. .posts-container {
  703. margin-left: 2rem;
  704. }
  705. {/block:ifPostsSize400px}
  706.  
  707. .description {
  708. margin: 5px auto;
  709. box-sizing: border-box;
  710. font-size:var(--descriptionFontSize);
  711. font-style:var(--descriptionFontStyle);
  712. font-weight:var(--descriptionFontWeight);
  713. text-align:var(--descriptionTextPosition);
  714. text-transform:var(--descriptionTextTransform);
  715. }
  716.  
  717. .sidebar .description strong {
  718. color: var(--sidebarTextColor);
  719. }
  720.  
  721. .sidebar .description i {
  722. color: var(--sidebarTextColor);
  723. }
  724.  
  725. .description a:hover {
  726. color: var(--bodyLinkHoverColor);
  727. }
  728.  
  729. .navigation {
  730. width: 100%;
  731. margin: 0;
  732. }
  733.  
  734. .nav-content {
  735. margin: auto;
  736. }
  737.  
  738. .navigation a {
  739. width:100%;
  740. padding: 10px 0 0;
  741. color: var(--sidebarLinkColor);
  742. }
  743.  
  744. .navigation a:hover {
  745. color: var(--bodyLinkHoverColor);
  746. }
  747.  
  748. .navigation ul {
  749. width:100%;
  750. text-align:var(--descriptionTextPosition);
  751. margin: 0;
  752. padding:0;
  753. }
  754.  
  755. .navigation ul li {
  756. display:inline-block;
  757. list-style-type:none;
  758. margin: 0;
  759. padding: 0 3px;
  760. }
  761.  
  762. .navigation ul li:before {
  763. content: '';
  764. width: 0px;
  765. height: 0px;
  766. margin:0px;
  767. background-color: none;
  768. display: none;
  769. }
  770.  
  771. .navigation ul li .feather {
  772. width: var(--sidebarIconsSize);
  773. height: var(--sidebarIconsSize);
  774. stroke: var(--sidebarLinkColor);
  775. padding: 10px;
  776. background-color: var(--sidebarBackgroundColor);
  777. }
  778.  
  779. .navigation ul li:last-child {
  780. padding-right:0px;
  781. }
  782. .navigation ul li:first-child {
  783. padding-left:0px;
  784. }
  785.  
  786. /* pagination */
  787. .pagination {
  788. margin: auto;
  789. text-align:var(--descriptionTextPosition);
  790. }
  791.  
  792. .pagination a {
  793. padding: 7px 0;
  794. margin: 0 5px;
  795. font-weight:bold;
  796. border: 1px solid transparent;
  797. color:var(--sidebarLinkColor);
  798. color: var(--sidebarLinkColor);
  799. font-size:var(--descriptionFontSize);
  800. font-style:var(--descriptionFontStyle);
  801. font-weight:var(--boldFontWeight);
  802. text-align:var(--descriptionTextPosition);
  803. text-transform:var(--descriptionTextTransform);
  804. }
  805.  
  806. .pagination a:hover {
  807. color:var(--bodyLinkHoverColor);
  808. }
  809.  
  810. /* posts */
  811. .container {
  812. width: 95%;
  813. height: auto;
  814. display: flex;
  815. flex-wrap: no-wrap;
  816. justify-content: space-around;
  817. align-items: flex-start;
  818. margin: auto;
  819. }
  820.  
  821. .tumblr-posts {
  822. margin-bottom:5px;
  823. }
  824.  
  825. .tumblr-posts a {
  826. font-size:var(--bodyFontSize);
  827. display:inline-block;
  828. padding:6px 8px;
  829. cursor: pointer;
  830. border: 1px solid transparent;
  831. font-weight:var(--boldFontWeight);
  832. color:var(--hoverTextColor);
  833. background-color:var(--hoverTextBackgroundColor);
  834. {block:ifBoxShadow}
  835. -webkit-box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  836. box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  837. {/block:ifBoxShadow}
  838. }
  839.  
  840. .tumblr-posts a:hover {
  841. color:var(--hoverTextBackgroundColor);
  842. background-color:var(--hoverTextColor);
  843. border:var(--bordersSize) var(--bordersStyle) var(--bordersColor);
  844. }
  845.  
  846. .posts-container {
  847. order: 2;
  848. width:auto;
  849. margin-left: 15rem;
  850. }
  851.  
  852. .posts {
  853. background:var(--postsBackgroundColor);
  854. {block:ifPostsSize540px}
  855. width: 541px;
  856. {/block:ifPostsSize540px}
  857. {block:ifPostsSize500px}
  858. width: 501px;
  859. {/block:ifPostsSize500px}
  860. {block:ifPostsSize400px}
  861. width:400px;
  862. {/block:ifPostsSize400px}
  863. margin:100px auto;
  864. text-align:var(--postsTextPosition);
  865. padding: 10px;
  866. {block:ifPostsBorders}
  867. border:var(--bordersSize) var(--bordersStyle) var(--bordersColor);
  868. {/block:ifPostsBorders}
  869. {block:ifBoxShadow}
  870. -webkit-box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  871. box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  872. {/block:ifBoxShadow}
  873. }
  874.  
  875. .posts:first-child {
  876. margin:50px auto 50px;
  877. }
  878.  
  879. .posts img {
  880. max-width:100%;
  881. display:block;
  882. height:auto;
  883. }
  884.  
  885. .posts b, strong {
  886. font-weight:var(--boldFontWeight);
  887. }
  888.  
  889.  
  890. /* photosets */
  891. [photoset-layout] {
  892. display: grid;
  893. grid-template-columns: repeat(6, 1fr);
  894. {block:ifPostsSize540px}
  895. grid-gap: 4.5px;
  896. {/block:ifPostsSize540px}
  897. {block:ifPostsSize500px}
  898. grid-gap: 9.5px;
  899. {/block:ifPostsSize500px}
  900. {block:ifPostsSize400px}
  901. grid-gap: 4px;
  902. {/block:ifPostsSize400px}
  903. }
  904.  
  905. [photoset-layout] img {
  906. display: block;
  907. height: 100%;
  908. width: 100%;
  909. -o-object-fit: cover;
  910. object-fit: cover;
  911. }
  912.  
  913. .photoset-grid {
  914. {block:ifPostsSize540px}
  915. max-width: 540px;
  916. {/block:ifPostsSize540px}
  917. {block:ifPostsSize500px}
  918. max-width: 500px;
  919. {/block:ifPostsSize500px}
  920. {block:ifPostsSize400px}
  921. max-width:400px;
  922. {/block:ifPostsSize400px}
  923. }
  924.  
  925. .photoset-grid div {
  926. cursor: pointer;
  927. }
  928.  
  929.  
  930. /* captions & blockquote */
  931. .tumblr_blog {
  932. display:inline-block;
  933. line-height:var(--bodyLineHeight);
  934. margin-right:2px;
  935. text-transform:lowercase;
  936. font-family: var(--bodyFont), Arial, sans-serif;
  937. font-size:var(--bodyFontSize);
  938. color:var(--bodyLinkColor);
  939. font-weight:var(--boldFontWeight);
  940. }
  941.  
  942. .tumblr_blog a {
  943. color:var(--bodyLinkColor);
  944. font-weight:var(--boldFontWeight);
  945. vertical-align:bottom;
  946.  
  947. }
  948.  
  949. .tumblr_blog a:hover {
  950. text-decoration:none;
  951. color:var(--bodyLinkHoverColor);
  952. }
  953.  
  954. /* old captions style */
  955. {block:ifNotTumblrCaptions}
  956. blockquote {
  957. border-left:1px solid var(--bordersColor);
  958. padding-left: 15px;
  959. margin: 10px 10px;
  960. }
  961. {/block:ifNotTumblrCaptions}
  962.  
  963.  
  964. /* tumblr's dashboad captions style */
  965. {block:ifTumblrCaptions}
  966. blockquote {
  967. border-left:0px solid;
  968. padding-left: 0px;
  969. margin: 0px;
  970. }
  971. {/block:ifTumblrCaptions}
  972.  
  973.  
  974. /* custom captions icons */
  975. {block:ifCustomCaptionIcon}
  976. .caption-user .feather {
  977. display:inline-block;
  978. vertical-align: middle;
  979. width:var(--bodyFontSize);
  980. height:var(--bodyFontSize);
  981. margin-right: 5px;
  982. }
  983. {/block:ifCustomCaptionIcon}
  984.  
  985. .caption-user .feather {
  986. {block:ifNotCustomCaptionIcon}
  987. display:none;
  988. {/block:ifNotCustomCaptionIcon}
  989. }
  990.  
  991. .caption-user {
  992. display: inline-block;
  993. vertical-align: middle;
  994. font-weight:var(--boldFontWeight);
  995. }
  996.  
  997. .caption-user a::after {
  998. content:none;
  999. }
  1000.  
  1001. .deactive::after {
  1002. content: '(deactivated)';
  1003. margin-left: 1em;
  1004. opacity: 0.75;
  1005. color: var(--bodyTextColor);
  1006. }
  1007.  
  1008.  
  1009. .caption-wrapper {
  1010. border:0px solid blue;
  1011. }
  1012.  
  1013. .caption, figcaption {
  1014. margin: 15px auto;
  1015. }
  1016.  
  1017. /* captions links */
  1018. .caption a, .caption-content a, figcaption a {
  1019. color:var(--bodyLinkColor);
  1020. }
  1021.  
  1022. .caption a:hover, .caption-content a:hover, figcaption a:hover {
  1023. color:var(--bodyLinkHoverColor);
  1024. }
  1025.  
  1026. figure {
  1027. display:block;
  1028. }
  1029.  
  1030. figure.tmblr-full {
  1031. margin-bottom:5px;
  1032. }
  1033.  
  1034. /* post info */
  1035. .date {
  1036. margin: 10px 0;
  1037. }
  1038.  
  1039. .date-content {
  1040. display:flex;
  1041. align-items:center;
  1042. flex-wrap: wrap;
  1043. justify-content:var(--dateTextPosition);
  1044. }
  1045.  
  1046. .date-links {
  1047. margin-right:15px;
  1048. }
  1049.  
  1050. .date-links:last-child {
  1051. margin-right:0px;
  1052. }
  1053.  
  1054. .date-links a {
  1055. font-size:var(--dateFontSize);
  1056. font-weight:var(--dateFontWeight);
  1057. text-transform: var(--dateTextTransform);
  1058. font-style:var(--dateFontStyle);
  1059. color:var(--dateLinkColor);
  1060. }
  1061. .date-links a:hover {
  1062. color:var(--bodyLinkHoverColor);
  1063. }
  1064.  
  1065. /* like text */
  1066. .like-b {
  1067. position:relative;
  1068. display:inline-block;
  1069. height:1em;
  1070. line-height:1.5em;
  1071. padding: 0 1px;
  1072. }
  1073.  
  1074. .like-b .like_button iframe {
  1075. position:absolute;
  1076. top:0;
  1077. left:0;
  1078. bottom:0;
  1079. right:0;
  1080. z-index:2;
  1081. opacity:0;
  1082. }
  1083.  
  1084. .like-b .liked + .b {
  1085. color: var(--likedLinkColor);
  1086. font-weight:var(--boldFontWeight);
  1087. }
  1088.  
  1089. .like-b .liked + .b:after {
  1090. content:'d';
  1091. }
  1092.  
  1093. .like-b a:hover {
  1094. color:var(--bodyLinkHoverColor);
  1095.  
  1096. }
  1097.  
  1098. /* tags */
  1099. .tags {
  1100. text-align: var(--tagsTextPosition);
  1101. text-transform: var(--tagsTextTransform);
  1102. font-style:var(--tagsFontStyle);
  1103. font-size:var(--tagsFontSize);
  1104. word-wrap:break-word;
  1105. margin:3px 0 0;
  1106.  
  1107. }
  1108.  
  1109. .tags a {
  1110. font-weight:var(--tagsFontWeight);
  1111. color:var(--tagsLinkColor);
  1112. margin-right:10px;
  1113. }
  1114.  
  1115. .tags a:last-child{
  1116. margin-right:0px;
  1117. }
  1118.  
  1119. .tags a:first-child {
  1120. margin-left:0px;
  1121. }
  1122.  
  1123. .tags a:hover {
  1124. color:var(--bodyLinkHoverColor);
  1125. }
  1126.  
  1127. /* lists */
  1128. ul {
  1129. margin:15px 0;
  1130. padding: 0;
  1131. list-style:none;
  1132. }
  1133.  
  1134. ul li {
  1135. margin:5px 15px;
  1136. list-style:none;
  1137. }
  1138.  
  1139. ul li::before {
  1140. content: '\e08f';
  1141. font-family:'saturnicons';
  1142. font-size:calc(var(--bodyFontSize) - 50%);
  1143. bottom:0.5px;
  1144. margin-right:7px;
  1145. display:inline-block;
  1146. vertical-align:middle;
  1147. position:relative;
  1148. color: var(--bodyLinkColor);
  1149. }
  1150.  
  1151. ol {
  1152. padding: 0 30px;
  1153. }
  1154.  
  1155. ol li {
  1156. list-style-type: decimal;
  1157. }
  1158.  
  1159. /* quote */
  1160. .quote {
  1161. font-size:var(--postsTitlesFontSize);
  1162. text-transform:var(--postsTitlesTextTransform);
  1163. color:var(--boldColor);
  1164. font-weight:var(--boldFontWeight);
  1165. text-align:var(--postsTextPosition);
  1166. }
  1167.  
  1168. .quote-source::before {
  1169. content: '';
  1170. width: 15px;
  1171. height: 1px;
  1172. margin-right:10px;
  1173. display:inline-block;
  1174. vertical-align:middle;
  1175. position:relative;
  1176. background-color: var(--bordersColor);
  1177. }
  1178.  
  1179. /* link */
  1180. .link-image img {
  1181. object-fit: cover;
  1182. margin-bottom:5px;
  1183. }
  1184.  
  1185.  
  1186. .link {
  1187. font-weight:var(--boldFontWeight);
  1188. color:var(--boldColor);
  1189. font-size:var(--postsTitlesFontSize);
  1190. text-align:var(--postsTextPosition);
  1191. }
  1192.  
  1193. /* chat */
  1194.  
  1195. .label {
  1196. font-weight:var(--boldFontWeight);
  1197. color:var(--boldColor);
  1198. }
  1199.  
  1200. .line {
  1201. padding: 0px 0px 5px;
  1202. margin: 0px 0px 5px;
  1203. }
  1204.  
  1205.  
  1206. p.npf_chat {
  1207. font-size:var(--bodyFontSize);
  1208. font-family: var(--bodyFont), Arial, sans-serif;
  1209. list-style:none;
  1210. }
  1211.  
  1212. /* asks */
  1213. .clearfix::before, .clearfix::after{
  1214. content:'';
  1215. clear:both;
  1216. display:table;
  1217. }
  1218.  
  1219. .ask-user {
  1220. color:var(--bodyLinkColor);
  1221. font-weight:var(--boldFontWeight);
  1222. text-transform:lowercase;
  1223. }
  1224.  
  1225. .ask-user a {
  1226. color:var(--bodyLinkColor);
  1227. font-weight:var(--boldFontWeight);
  1228. }
  1229.  
  1230. .ask-user a:hover {
  1231. color:var(--bodyLinkHoverColor);
  1232. }
  1233.  
  1234. .ask-question {
  1235. position: relative;
  1236. top: -2px;
  1237. }
  1238.  
  1239. .ask-question p {
  1240. margin: 0 0 5px;
  1241. }
  1242.  
  1243. .ask .feather {
  1244. width:var(--bodyFontSize);
  1245. height:var(--bodyFontSize);
  1246. stroke:var(--bodyLinkColor);
  1247. display:inline-block;
  1248. vertical-align: middle;
  1249. margin-right: 10px;
  1250. float:left;
  1251. margin-top: 2px;
  1252. }
  1253.  
  1254. .ask-answer.caption-content::after {
  1255. content: '';
  1256. height: 0px;
  1257. }
  1258.  
  1259. /* video */
  1260. .video {
  1261. {block:ifPostsSize540px}
  1262. width:540px;
  1263. {/block:ifPostsSize540px}
  1264. {block:ifPostsSize500px}
  1265. width:500px;
  1266. {/block:ifPostsSize500px}
  1267. {block:ifPostsSize400px}
  1268. width:400px;
  1269. {/block:ifPostsSize400px}
  1270. }
  1271.  
  1272.  
  1273. {block:if400pxposts}
  1274. iframe#youtube_iframe {
  1275. width: 400px;
  1276. height: 280px;
  1277. border-top-width: 0px;
  1278. border-right-width: 0px;
  1279. border-bottom-width: 0px;
  1280. border-left-width: 0px;
  1281. }
  1282. {/block:if400pxposts}
  1283.  
  1284. /*audio */
  1285. .audio {
  1286. display:flex;
  1287. {block:ifPostsBorders}
  1288. outline:var(--bordersSize) var(--bordersStyle) var(--bordersColor);
  1289. {/block:ifPostsBorders}
  1290. align-items: center;
  1291. }
  1292.  
  1293.  
  1294. .album-art {
  1295. z-index: 1;
  1296. display: inline-block;
  1297. vertical-align: middle;
  1298. float: left;
  1299. width: 100px;
  1300. height: 100px;
  1301. }
  1302.  
  1303. .button {
  1304. width: 30px;
  1305. height: 30px;
  1306. overflow: hidden;
  1307. position: relative;
  1308. z-index: 2;
  1309. margin: 7px;
  1310. }
  1311.  
  1312. .audiobox {
  1313. background-color: #f2f2f2;
  1314. z-index: 3;
  1315. position: absolute;
  1316. margin: 28px;
  1317. border-radius: 50%;
  1318. }
  1319.  
  1320. .audio_trackinfo {
  1321. display: flex;
  1322. max-height: 74px;
  1323. min-height: 74px;
  1324. flex: 4;
  1325. align-items: flex-start;
  1326. margin-left:15px;
  1327. justify-content: center;
  1328. flex-direction: column;
  1329. padding: 5px;
  1330. background: var(--postsBackgroundColor);
  1331. color: var(--bodyTextColor);
  1332. }
  1333.  
  1334. .audio_trackname {
  1335. font-weight:var(--boldFontWeight);
  1336. color:var(--boldColor);
  1337. text-align:var(--postsTextPosition);
  1338. font-size:16px;
  1339. }
  1340.  
  1341.  
  1342. /* postnotes */
  1343. .post-notes {
  1344. {block:ifPostsSize540px}
  1345. width:540px;
  1346. {/block:ifPostsSize540px}
  1347. {block:ifPostsSize500px}
  1348. width:500px;
  1349. {/block:ifPostsSize500px}
  1350. {block:ifPostsSize400px}
  1351. max-width:400px;
  1352. {/block:ifPostsSize400px}
  1353. margin-top:50px;
  1354. list-style-type: none;
  1355. font-family: var(--bodyFont), Arial, sans-serif;
  1356. font-size:var(--bodyFontSize);
  1357. color:var(--bodyTextColor);
  1358. background-color:var(--postsBackgroundColor);
  1359. }
  1360.  
  1361. .post-notes ol li,
  1362. .post-notes ul li {
  1363. list-style-type: none;
  1364. margin:0;
  1365. }
  1366.  
  1367. .post-notes ol li::before {
  1368. content: '\e08f';
  1369. font-family:'saturnicons';
  1370. font-size:calc(var(--bodyFontSize) - 50%);
  1371. bottom:0.5px;
  1372. margin-right:7px;
  1373. display:inline-block;
  1374. vertical-align:middle;
  1375. position:relative;
  1376. color: var(--bodyLinkColor);
  1377. }
  1378.  
  1379. .post-notes ol li:hover:before {
  1380. color:var(--bodyLinkHoverColor);
  1381. }
  1382.  
  1383. .post-notes ol li .more_notes_link a::before {
  1384. content: '';
  1385.  
  1386. }
  1387.  
  1388.  
  1389. ol.notes {
  1390. list-style:none;
  1391. color:var(--bodyTextColor);
  1392. padding:0;
  1393. }
  1394.  
  1395. ol.notes img {
  1396. display: none;
  1397. }
  1398.  
  1399.  
  1400.  
  1401.  
  1402. /* mobile */
  1403. @media only screen and (max-width: 1020px) {
  1404. body {
  1405. background-position-x: 100%;
  1406. background-size: cover;
  1407. }
  1408.  
  1409. .hcontrols .feather {
  1410. width:25px;
  1411. height:25px;
  1412. stroke-width: 2;
  1413. stroke:var(--sidebarLinkColor);
  1414. cursor: pointer;
  1415. }
  1416.  
  1417. /*container // mobile */
  1418. .container {
  1419. width: 90%;
  1420. max-width: 1090px;
  1421. height: 100vh;
  1422. display:flex;
  1423. flex-wrap:wrap;
  1424. justify-content: space-around;
  1425. align-items: flex-start;
  1426. margin: auto;
  1427. }
  1428.  
  1429. /* sidebar-title // mobile */
  1430. .sidebar-title {
  1431. width: 100%;
  1432. text-align:center;
  1433. }
  1434.  
  1435. /* sidebar // mobile */
  1436. .sidebar {
  1437. position: fixed;
  1438. width: 100%;
  1439. height: auto;
  1440. max-height: 200px;
  1441. min-height: 140px;
  1442. left: auto;
  1443. z-index: 99;
  1444. align-items: center;
  1445. overflow:hidden;
  1446. }
  1447.  
  1448. /* sidebar image // mobile */
  1449. .sidebar img {
  1450. display: none;
  1451. }
  1452.  
  1453. /* sidebar-content // mobile */
  1454. .sidebar-content {
  1455. width: 100%;
  1456. max-width: 530px;
  1457. position:relative;
  1458. margin: auto;
  1459. padding: 15px 0;
  1460. }
  1461.  
  1462. /* description // mobile */
  1463. .description {
  1464. margin-bottom:5px;
  1465. padding: 0;
  1466. width: auto;
  1467. text-align:center;
  1468. }
  1469.  
  1470. /* nav-content // mobile */
  1471. .nav-content {
  1472. position:relative;
  1473. width:100%;
  1474. left:auto;
  1475. max-width:700px;
  1476. order: 2;
  1477. }
  1478.  
  1479. .nav-content ul {
  1480. text-align:center;
  1481. }
  1482.  
  1483. /* pagination // mobile */
  1484. .pagination {
  1485. text-align:center;
  1486. }
  1487.  
  1488. /* posts-container // mobile */
  1489. .posts-container {
  1490. width:100%;
  1491. order: 3;
  1492. margin-left: 1px;
  1493. margin-top: 155px;
  1494. }
  1495.  
  1496. /* posts // mobile */
  1497. .posts {
  1498. {block:ifPostsSize540px}
  1499. max-width: 540px;
  1500. {/block:ifPostsSize540px}
  1501. {block:ifPostsSize500px}
  1502. max-width: 501px;
  1503. {/block:ifPostsSize500px}
  1504. {block:ifPostsSize400px}
  1505. max-width:400px;
  1506. {/block:ifPostsSize400px}
  1507. width: 90%;
  1508. }
  1509.  
  1510. /* posts // mobile */
  1511. article {
  1512. margin:100px auto;
  1513. }
  1514. }
  1515.  
  1516.  
  1517. /* DO NOT REMOVE */
  1518. .mcredito {
  1519. position:fixed;
  1520. right:5px;
  1521. bottom:10px;
  1522. padding:8px 12px;
  1523. background: var(--sidebarBackgroundColor);
  1524. {block:ifBoxShadow}
  1525. -webkit-box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  1526. box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  1527. {/block:ifBoxShadow}
  1528. }
  1529.  
  1530. .mcredito a {
  1531. margin:0;
  1532. font-weight:var(--boldFontWeight);
  1533. text-transform:lowercase;
  1534. text-align:center;
  1535. color:var(--sidebarLinkColor);
  1536. }
  1537.  
  1538. .mcredito a:hover {
  1539. color:var(--bodyLinkHoverColor);
  1540. }
  1541.  
  1542.  
  1543. {CustomCSS}
  1544. </style>
  1545. </head>
  1546. <body>
  1547. <!-- main container -->
  1548. <main class="container">
  1549.  
  1550. <!-- sidebar -->
  1551. <aside class="sidebar">
  1552. <div class="sidebar-content">
  1553. {block:IfSidebarTitle}
  1554. <div class="sidebar-title">
  1555. {Title}
  1556. </div>
  1557. {/block:IfSidebarTitle}
  1558.  
  1559. {block:IfSidebarImage}
  1560. <img src="{image:Sidebar Image}">
  1561. {/block:IfSidebarImage}
  1562. <div class="description">
  1563. {Description}
  1564. </div>
  1565.  
  1566. <!-- navigation links -->
  1567. <nav class="navigation">
  1568. <div class="nav-content">
  1569. <ul>
  1570. <li>
  1571. <a href="{text:Index URL}" title="{text:Index Text}">
  1572. <i data-feather="{text:Index Icon}" class="feather"></i>
  1573. </a>
  1574. </li>
  1575.  
  1576. <li>
  1577. <a href="{text:Ask URL}" title="{text:Ask Text}">
  1578. <i data-feather="{text:Ask Icon}" class="feather"></i>
  1579. </a>
  1580. </li>
  1581.  
  1582. {block:ifSidebarLink1}
  1583. <li>
  1584. <a href="{text:Sidebar Link 1 URL}" title="{text:Sidebar Link 1 Text}">
  1585. <i data-feather="{text:Sidebar Link 1 Icon}" class="feather"></i>
  1586. </a>
  1587. </li>
  1588. {/block:ifSidebarLink1}
  1589.  
  1590. {block:ifSidebarLink2}
  1591. <li>
  1592. <a href="{text:Sidebar Link 2 URL}" title="{text:Sidebar Link 2 Text}">
  1593. <i data-feather="{text:Sidebar Link 2 Icon}" class="feather"></i>
  1594. </a>
  1595. </li>
  1596. {/block:ifSidebarLink2}
  1597.  
  1598. {block:ifSidebarLink3}
  1599. <li>
  1600. <a href="{text:Sidebar Link 3 URL}" title="{text:Sidebar Link 3 Text}">
  1601. <i data-feather="{text:Sidebar Link 3 Icon}" class="feather"></i>
  1602. </a>
  1603. </li>
  1604. {/block:ifSidebarLink3}
  1605.  
  1606. {block:ifSidebarLink4}
  1607. <li>
  1608. <a href="{text:Sidebar Link 4 URL}" title="{text:Sidebar Link 4 Text}">
  1609. <i data-feather="{text:Sidebar Link 4 Icon}" class="feather"></i>
  1610. </a>
  1611. </li>
  1612. {/block:ifSidebarLink4}
  1613. </ul>
  1614. </div>
  1615. </nav>
  1616.  
  1617. <!-- pagination -->
  1618. {block:Pagination}
  1619. <div class="pagination">
  1620. {block:previouspage}
  1621. <a href="{previouspage}">{lang:Previous page}</a>
  1622. {/block:previouspage}
  1623. {block:nextpage}
  1624. <a href="{nextpage}">{lang:Next page}</a>
  1625. {/block:nextpage}
  1626. </div>
  1627. {/block:pagination}
  1628. </div>
  1629. </aside>
  1630.  
  1631. <section class="posts-container">
  1632. <!-- posts -->
  1633. {block:Posts}
  1634. <!-- {block:NoRebloggedFrom}
  1635. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  1636. {/block:NoRebloggedFrom} -->
  1637. {block:ContentSource}<!-- {SourceURL}
  1638. {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  1639. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1640. {/block:ContentSource}
  1641.  
  1642. <article class="{posttype}post posts">
  1643.  
  1644. <!-- pinned post -->
  1645. {block:PinnedPostLabel}
  1646. <div class="tumblr-posts">
  1647. <a target="_blank" href="{Permalink}">{PinnedPostLabel}</a>
  1648. </div>
  1649. {/block:PinnedPostLabel}
  1650.  
  1651. <!-- text posts -->
  1652. {block:Text}
  1653. {block:Title}
  1654. <h1>{Title}</h1>
  1655. {/block:Title}
  1656.  
  1657. <!-- captions -->
  1658. {block:ifTumblrCaptions}
  1659. {block:Notreblog}
  1660. <div class="caption-wrapper">
  1661. <div class="caption">
  1662. <div class="caption-content">{Body}</div>
  1663. </div>
  1664. </div>
  1665. {/block:Notreblog}
  1666. {block:Rebloggedfrom}
  1667. <div class="caption-wrapper">
  1668. {block:Reblogs}
  1669. <div class="caption">
  1670. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  1671. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Username}</a>
  1672. </div>
  1673. <div class="caption-content">{Body}</div>
  1674. </div>
  1675. {/block:Reblogs}
  1676. </div>
  1677. {/block:RebloggedFrom}
  1678. {/block:ifTumblrCaptions}
  1679.  
  1680. {block:ifNotTumblrCaptions}
  1681. <div class="caption caption-content">
  1682. {Body}
  1683. </div>
  1684. {/block:ifNotTumblrCaptions}
  1685. {/block:Text}
  1686.  
  1687. <!-- photo posts -->
  1688. {block:Photo}
  1689. <img src="{PhotoURL-highres}" al="{photoalt}" class="photos">
  1690. {block:Caption}
  1691. {block:ifTumblrCaptions}
  1692. {block:Notreblog}
  1693. <div class="caption-wrapper">
  1694. <div class="caption">
  1695. <div class="caption-content">{Caption}</div>
  1696. </div>
  1697. </div>
  1698. {/block:Notreblog}
  1699. {block:Rebloggedfrom}
  1700. <div class="caption-wrapper">
  1701. {block:Reblogs}
  1702. <div class="caption">
  1703. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  1704. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Username}</a>
  1705. </div>
  1706. <div class="caption-content">{Body}</div>
  1707. </div>
  1708. {/block:Reblogs}
  1709. </div>
  1710. {/block:RebloggedFrom}
  1711. {/block:ifTumblrCaptions}
  1712.  
  1713. {block:ifNotTumblrCaptions}
  1714. <div class="caption caption-content">
  1715. {Caption}
  1716. </div>
  1717. {/block:ifNotTumblrCaptions}
  1718. {/block:Caption}
  1719. {/block:Photo}
  1720.  
  1721. <!-- photoset -->
  1722. {block:Photoset}
  1723. <div class="photoset">
  1724. <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>
  1725. </div>
  1726. {block:Caption}
  1727. {block:ifTumblrCaptions}
  1728. {block:Notreblog}
  1729. <div class="caption-wrapper">
  1730. <div class="caption">
  1731. <div class="caption-content">{Caption}</div>
  1732. </div>
  1733. </div>
  1734. {/block:Notreblog}
  1735. {block:Rebloggedfrom}
  1736. <div class="caption-wrapper">
  1737. {block:Reblogs}
  1738. <div class="caption">
  1739. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  1740. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Username}</a>
  1741. </div>
  1742. <div class="caption-content">{Body}</div>
  1743. </div>
  1744. {/block:Reblogs}
  1745. </div>
  1746. {/block:RebloggedFrom}
  1747. {/block:ifTumblrCaptions}
  1748.  
  1749. {block:ifNotTumblrCaptions}
  1750. <div class="caption caption-content">
  1751. {Caption}
  1752. </div>
  1753. {/block:ifNotTumblrCaptions}
  1754. {/block:Caption}
  1755. {/block:Photoset}
  1756.  
  1757. <!-- quote posts -->
  1758. {block:Quote}
  1759. <div class="quote">
  1760. "{Quote}"
  1761. </div>
  1762. {block:Source}
  1763. <div class="quote-source">
  1764. {Source}
  1765. </div>
  1766. {/block:Source}
  1767. {/block:Quote}
  1768.  
  1769. <!-- chat posts -->
  1770. {block:Chat}
  1771. {block:Title}
  1772. <h2>{Title}</h2>
  1773. {/block:Title}
  1774. <div class="chat">
  1775. {block:Lines}
  1776. {block:Label}
  1777. <div class="label">{Label}</div>
  1778. {/block:Label}
  1779. <div class="line">{Line}</div>
  1780. {/block:Lines}
  1781. </div>
  1782. {/block:Chat}
  1783.  
  1784. <!--Link posts-->
  1785. {block:Link}
  1786. {block:Thumbnail}
  1787. <div class="link-image">
  1788. <img src="{Thumbnail-HighRes}">
  1789. </div>
  1790. {/block:Thumbnail}
  1791. <div class="link-content">
  1792. <a href="{URL}" style="border:none" class="link" {Target}>{Name} </a>
  1793. {block:Excerpt}<div class="link-excerpt">{Excerpt}</div>{/block:Excerpt}
  1794. {block:Host}<div class="link-host">{Host}</div>{/block:Host}
  1795. </div>
  1796. {block:ifTumblrCaptions}
  1797. {block:Description}
  1798. {block:Notreblog}
  1799. <div class="caption-wrapper">
  1800. <div class="caption">
  1801. <div class="caption-content">{Description}</div>
  1802. </div>
  1803. </div>
  1804. {/block:Notreblog}
  1805. {/block:Description}
  1806. {block:Rebloggedfrom}
  1807. <div class="caption-wrapper">
  1808. {block:Reblogs}
  1809. <div class="caption">
  1810. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  1811. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Username}</a>
  1812. </div>
  1813. <div class="caption-content">{Body}</div>
  1814. </div>
  1815. {/block:Reblogs}
  1816. </div>
  1817. {/block:RebloggedFrom}
  1818. {/block:ifTumblrCaptions}
  1819.  
  1820. {block:ifNotTumblrCaptions}
  1821. <div class="caption caption-content">
  1822. {Description}
  1823. </div>
  1824. {/block:ifNotTumblrCaptions}
  1825. {/block:Link}
  1826.  
  1827. <!-- video posts -->
  1828. {block:Video}
  1829. <div class="video">{Video-500}</div>
  1830. {block:Caption}
  1831. {block:ifTumblrCaptions}
  1832. {block:Notreblog}
  1833. <div class="caption-wrapper">
  1834. <div class="caption">
  1835. <div class="caption-content">{Caption}</div>
  1836. </div>
  1837. </div>
  1838. {/block:Notreblog}
  1839. {block:Rebloggedfrom}
  1840. <div class="caption-wrapper">
  1841. {block:Reblogs}
  1842. <div class="caption">
  1843. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  1844. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Username}</a>
  1845. </div>
  1846. <div class="caption-content">{Body}</div>
  1847. </div>
  1848. {/block:Reblogs}
  1849. </div>
  1850. {/block:RebloggedFrom}
  1851. {/block:ifTumblrCaptions}
  1852.  
  1853. {block:ifNotTumblrCaptions}
  1854. <div class="caption caption-content">
  1855. {Caption}
  1856. </div>
  1857. {/block:ifNotTumblrCaptions}
  1858. {/block:Caption}
  1859. {/block:Video}
  1860.  
  1861. <!-- audio posts -->
  1862. {block:Audio}
  1863. <div class="audio">
  1864. <div class="audiobox"><div class="button">
  1865. {block:AudioPlayer}{AudioPlayer}{/block:AudioPlayer}
  1866. </div></div>
  1867. <div class="album-art">
  1868. {block:AlbumArt}
  1869. <img src="{AlbumArtURL}">
  1870. {/block:AlbumArt}
  1871. </div>
  1872.  
  1873. {block:TrackName}
  1874. <div class="audio_trackinfo">
  1875. <div class="audio_trackname">{TrackName}</div>
  1876. {block:Artist}<div class="audio_artist">{Artist}</div>{/block:Artist}
  1877. {block:Album}<div class="audio_album">{Album}</div>{/block:Album}
  1878. </div>
  1879. {/block:TrackName}
  1880. </div>
  1881.  
  1882. {block:Caption}
  1883. {block:ifTumblrCaptions}
  1884. {block:Notreblog}
  1885. <div class="caption-wrapper">
  1886. <div class="caption">
  1887. <div class="caption-content">{Caption}</div>
  1888. </div>
  1889. </div>
  1890. {/block:Notreblog}
  1891. {block:Rebloggedfrom}
  1892. <div class="caption-wrapper">
  1893. {block:Reblogs}
  1894. <div class="caption">
  1895. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  1896. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Username}</a>
  1897. </div>
  1898. <div class="caption-content">{Body}</div>
  1899. </div>
  1900. {/block:Reblogs}
  1901. </div>
  1902. {/block:RebloggedFrom}
  1903. {/block:ifTumblrCaptions}
  1904.  
  1905. {block:ifNotTumblrCaptions}
  1906. <div class="caption caption-content">
  1907. {Caption}
  1908. </div>
  1909. {/block:ifNotTumblrCaptions}
  1910. {/block:Caption}
  1911. {/block:Audio}
  1912.  
  1913. <!-- ask posts -->
  1914. {block:Answer}
  1915. <div class="ask">
  1916. <i data-feather="mail" class="feather"></i>
  1917. <span class="ask-question">
  1918. {Question}
  1919. </span>
  1920. <span class="clearfix"></span>
  1921. <i data-feather="message-circle" class="feather"></i>
  1922. <span class="ask-user">
  1923. {lang:Asked by Asker 2}
  1924. </span>
  1925. </div>
  1926. <div class="caption-wrapper">
  1927. <div class="caption">
  1928. {block:Answerer}
  1929. {block:ifTumblrCaptions}
  1930. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  1931. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Answerer}</a>
  1932. </div>
  1933. {/block:ifTumblrCaptions}
  1934. <div class="ask-answer caption-content">
  1935. {Answer}
  1936. </div>
  1937. {/block:Answerer}
  1938. </div>
  1939. </div>
  1940. {block:ifTumblrCaptions}
  1941. {block:NotReblog}
  1942. <div class="caption-wrapper">
  1943. <div class="caption">
  1944. <div class="caption-content">{Replies}</div>
  1945. </div>
  1946. </div>
  1947. {/block:NotReblog}
  1948. {block:Rebloggedfrom}
  1949. <div class="caption-wrapper">
  1950. {block:Reblogs}
  1951. <div class="caption">
  1952. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  1953. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Username}</a>
  1954. </div>
  1955. <div class="caption-content">{Body}</div>
  1956. </div>
  1957. {/block:Reblogs}
  1958. </div>
  1959. {/block:RebloggedFrom}
  1960. {/block:ifTumblrCaptions}
  1961.  
  1962. {block:ifNotTumblrCaptions}
  1963. <div class="caption caption-content">
  1964. {Replies}
  1965. </div>
  1966. {/block:ifNotTumblrCaptions}
  1967. {/block:Answer}
  1968.  
  1969. <!-- post info -->
  1970. {block:Date}
  1971. <div class="date">
  1972. <div class="date-content">
  1973. <div class="date-links">
  1974. <a href="{Permalink}">
  1975. {timeago}
  1976. </a>
  1977. </div>
  1978.  
  1979. {block:NoteCount}
  1980. <div class="date-links">
  1981. <a href="{Permalink}">
  1982. {NoteCountWithLabel}
  1983. </a>
  1984. </div>
  1985. {/block:NoteCount}
  1986.  
  1987. {block:Permalink}
  1988. {block:RebloggedFrom}
  1989. <div class="date-links">
  1990. <a target="_blank" href="{ReblogParentURL}" title="{lang:Reblogged from} {ReblogParentName}">
  1991. {ReblogParentName}
  1992. </a>
  1993. </div>
  1994. {/block:RebloggedFrom}
  1995. {/block:Permalink}
  1996.  
  1997. {block:ContentSource}
  1998. <div class="date-links">
  1999. <a target="_blank" href="{SourceURL}" title="{lang:Originally from ReblogRootName}">
  2000. {SourceTitle}
  2001. </a>
  2002. </div>
  2003. {/block:ContentSource}
  2004.  
  2005. <div class="date-links">
  2006. <a target="_blank" href="{ReblogURL}" target="_blank" class="details">
  2007. reblog
  2008. </a>
  2009. </div>
  2010.  
  2011. <div class="date-links">
  2012. <a class="like-b" href="#">
  2013. {LikeButton}<span class="b">like</span>
  2014. </a>
  2015. </div>
  2016. </div>
  2017.  
  2018. <!-- tags -->
  2019. {block:HasTags}
  2020. <div class="tags">
  2021. {block:Tags}
  2022. <a target="_blank" href="{TagURL}">
  2023. #{Tag}</a>
  2024. {/block:Tags}
  2025. </div>
  2026. {/block:HasTags}
  2027. </div>
  2028. {/block:Date}
  2029. <!-- end post info -->
  2030.  
  2031. <!-- post note list -->
  2032. {block:PostNotes}
  2033. <div class="post-notes">
  2034. {PostNotes}
  2035. </div>
  2036. {/block:PostNotes}
  2037. </article> <!-- end posts -->
  2038. {/block:Posts}
  2039. </section> <!-- end post section -->
  2040. </main> <!-- end container -->
  2041.  
  2042. <div class="mcredito">
  2043. <a class="scrolltop" href="javascript:;" id="scrollToTop" title="Scroll to top">
  2044. <i data-feather="arrow-up" class="feather"></i>
  2045. </a>
  2046. <a href="http://maziekeen.tumblr.com/" target="_blank">maziekeen</a>
  2047. </div>
  2048.  
  2049. <!-- top right icon for custom tumblr controls -->
  2050. {block:ifCustomControls}
  2051. <div class="hcontrols"><i data-feather="more-horizontal" class="feather"></i></div>
  2052. {/block:ifCustomControls}
  2053.  
  2054. <!-- scripts -->
  2055. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <!-- for tooltips -->
  2056. <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>
  2057. <script src="https://unpkg.com/popper.js@1"></script> <!-- tooltips -->
  2058. <script src="https://unpkg.com/tippy.js@5/dist/tippy-bundle.iife.js"></script> <!-- tooltips -->
  2059. <script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script> <!-- resize videos -->
  2060. <script src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.10/SmoothScroll.min.js"></script> <!-- smooth scroll -->
  2061. <script src="https://static.tumblr.com/ikeq9mi/DfYl6o46t/scrolltotop.min.js"></script>
  2062. <link href="//dl.dropbox.com/s/bnoj86mka0bkplb/npf-override.css" rel="stylesheet"> <!-- npf images readjustment -->
  2063. <script src="//dl.dropbox.com/s/vwrm94pcg4c9e71/npf-evenize.js"></script> <!-- npf images readjustment -->
  2064. <script src="//dl.dropbox.com/s/aqo7pinjzfub4tn/npf-legacy.js"></script> <!-- npf images readjustment -->
  2065.  
  2066. <script type="text/javascript">
  2067. // update-toggle
  2068. $(document).ready(function() {
  2069. $(".toggle-content").hide();
  2070.  
  2071. $(".toggle-link").click(function(event) {
  2072. event.preventDefault();
  2073. $(this).next(".toggle-content").slideToggle(500);
  2074. });
  2075.  
  2076. });
  2077.  
  2078. // photosets lightbox
  2079.  
  2080. function gatherData(images, arr) {
  2081. for (let i = 0; i < images.length; i++) {
  2082. let currentData = {
  2083. "width": images[i].getAttribute('data-width'),
  2084. "height": images[i].getAttribute('data-height'),
  2085. "low_res": images[i].getAttribute('data-lowres'),
  2086. "high_res": images[i].getAttribute('data-highres')
  2087. };
  2088. arr.push(currentData);
  2089. }
  2090. }
  2091. function getIndex(elem) {
  2092. let i = 0;
  2093. while( (elem = elem.previousElementSibling) != null ) i++;
  2094. return i;
  2095. }
  2096. function lightbox(elem) {
  2097. let currentPhotoset = elem.parentNode;
  2098. let photosetPhotos = currentPhotoset.getElementsByTagName('div');
  2099. let data = [];
  2100. gatherData(photosetPhotos, data);
  2101. Tumblr.Lightbox.init(data, getIndex(elem) + 1);
  2102. }
  2103.  
  2104.  
  2105. // tooltips
  2106. tippy('a[title]', {
  2107. theme: 'custom',
  2108. arrow: false,
  2109. zIndex: 9999999999,
  2110. maxWidth: 300,
  2111.  
  2112. content(reference) {
  2113. const title = reference.getAttribute('title');
  2114. reference.removeAttribute('title');
  2115. return title;
  2116. },
  2117. });
  2118.  
  2119. // feather icons (custom icons)
  2120. feather.replace();
  2121.  
  2122.  
  2123. // remove tumblr redirects script by magnusthemes@tumblr
  2124. $('a[href*="t.umblr.com/redirect"]').each(function(){
  2125. var originalURL = $(this).attr("href").split("?z=")[1].split("&t=")[0];
  2126. var replaceURL = decodeURIComponent(originalURL);
  2127. $(this).attr("href", replaceURL);
  2128. });
  2129.  
  2130. </script>
  2131. </body>
  2132. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!