Advertisement
themesbydoori

Breach

Dec 26th, 2021 (edited)
3,549
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 71.89 KB | None | 0 0
  1. <!--
  2.  
  3. ╭━━━┳╮╱╭┳━━━┳━━━┳━━━━┳╮╱╭┳━━━┳━╮╭━┳━━━┳━━━╮
  4. ┃╭━╮┃┃╱┃┃╭━━┫╭━╮┃╭╮╭╮┃┃╱┃┃╭━━┫┃╰╯┃┃╭━━┫╭━╮┃
  5. ┃╰━━┫╰━╯┃╰━━┫┃╱┃┣╯┃┃╰┫╰━╯┃╰━━┫╭╮╭╮┃╰━━┫╰━━╮
  6. ╰━━╮┃╭━╮┃╭━━┫╰━╯┃╱┃┃╱┃╭━╮┃╭━━┫┃┃┃┃┃╭━━┻━━╮┃
  7. ┃╰━╯┃┃╱┃┃╰━━┫╭━╮┃╱┃┃╱┃┃╱┃┃╰━━┫┃┃┃┃┃╰━━┫╰━╯┃
  8. ╰━━━┻╯╱╰┻━━━┻╯╱╰╯╱╰╯╱╰╯╱╰┻━━━┻╯╰╯╰┻━━━┻━━━╯
  9.  
  10. Theme ⎾BREACH⏌ by sheathemes @ tumblr
  11.  
  12.  
  13.  
  14. - TERMS -
  15.  
  16. I. Do NOT remove my credit from the index page. Keep it exactly where it is
  17. II. Do NOT take any part of my code to use for your personal designs
  18. III. Do NOT claim any part of my code as your own
  19. IV. NO redistrubuting of any of my code
  20. V. Editing is allowed. As long as it's NOT being claimed as your own
  21.  
  22. CREDITS
  23.  
  24. > PixelUnion/Extended-Tumblr-Photoset: https://github.com/PixelUnion/Extended-Tumblr-Photoset | Modified PXU photoset script tutorial by bychloethemes @ tumblr: http://bychloethemes.tumblr.com/post/155956945114/modified-pxu-photoset-script-modified-by
  25.  
  26. > Video resize script: http://shythemes.tumblr.com/post/134536748863/tutorial-resizing-videos
  27.  
  28. > Custom Tumblr lightbox: http://shythemes.tumblr.com/post/140444996328/tutorial-lightboxes
  29.  
  30. > Icons: https://icons8.com/line-awesome / https://feathericons.com/
  31.  
  32. > Smoothscroll script: https://cdnjs.com/libraries/smoothscroll
  33.  
  34. > Tippy.js: https://atomiks.github.io/tippyjs/
  35.  
  36. > NPF Photoset Fix: https://annalogs.tumblr.com/photosets
  37.  
  38. > customaudio.js: https://annasthms.tumblr.com/more/js/customaudio/new
  39.  
  40. > Mini spotify player: https://glenthemes.tumblr.com/post/659842079511461888
  41.  
  42. > NPF images fix v3.0: https://github.com/npf-images-v3/npf-images-v3.github.io/blob/main/WELCOME.md
  43.  
  44. > Customized page border: https://glenthemes.tumblr.com/post/671422052920705024/customize-page-divider-tutorial
  45.  
  46. !-->
  47.  
  48. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  49. <html xmlns="https://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  50.  
  51. <head>
  52.  
  53. <!------------Smooth Scroll Script------------>
  54. <script src="//cdn.jsdelivr.net/npm/jquery@latest/dist/jquery.min.js"></script>
  55. <script src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.6/SmoothScroll.min.js"></script>
  56. <!------------Smooth Scroll Script------------>
  57.  
  58. <!--------------Custom Fonts-------------->
  59. <link rel="preconnect" href="https://fonts.gstatic.com">
  60. <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700&family=Lato:wght@400;700&family=Noto+Sans+JP:wght@400;700&family=Open+Sans:wght@400;700&family=Playfair+Display&family=Poppins:wght@400;700&family=Roboto:wght@400;700&family=Epilogue:wght@400;700&family=Source+Sans+Pro:wght@400;700&display=swap" rel="stylesheet">
  61. <!--------------Custom Fonts-------------->
  62.  
  63. <!--------------Homelinks Icons -------------->
  64. <link href="https://maxst.icons8.com/vue-static/landings/line-awesome/line-awesome/1.3.0/css/line-awesome.min.css" rel="stylesheet">
  65. <!--------------Homelinks Icons-------------->
  66.  
  67.     <title>{Title}</title>
  68.     <link rel="shortcut icon" href="{Favicon}">
  69.     <link rel="altertnate" type="application/rss+xml" href="{RSS}">
  70.     <meta charset="utf-8">
  71.     {block:Description}
  72.     <meta name="description" content="{MetaDescription}" />
  73.     {/block:Description}
  74.     <meta http-equiv="x-dns-prefetch-control" content="off"/>
  75.     <meta name="viewport" content="width=device-width, initial-scale=1">
  76.  
  77. <!----------------Custom Options---------------->
  78.  
  79. <meta name="color:background" content="#fbfbfb" />
  80. <meta name="color:accent" content="#79D7FF" />
  81. <meta name="color:accented text" content="#ffffff" />
  82. <meta name="color:text" content="#414552" />    
  83. <meta name="color:bold" content="#b8baff"/>
  84. <meta name="color:italic" content="#b8baff"/>
  85. <meta name="color:Links" content="#000000" />
  86. <meta name="color:Link Hover" content="#b8baff" />
  87. <meta name="color:text selection" content="#000000" />
  88. <meta name="color:text selection background" content="#79D7FF" />
  89. <meta name="color:blockquote" content="#79D7FF" />
  90. <meta name="color:scrollbar" content="#79D7FF" />
  91.  
  92. <meta name="color:sidebar title" content="#000000" />
  93. <meta name="color:sidebar description" content="#414552" />
  94. <meta name="color:navigation" content="#000000" />
  95. <meta name="color:navigation hover" content="#b8baff" />
  96. <meta name="color:Posts" content="#ffffff" />
  97. <meta name="color:Post Title" content="#000000" />
  98. <meta name="color:Post Borders" content="#f6f6f6" />
  99. <meta name="color:question" content="#000000" />
  100. <meta name="color:question background" content="#fafafa" />
  101. <meta name="color:chat odd" content="#b8baff"/>
  102. <meta name="color:chat even" content="#000000"/>
  103. <meta name="color:pagination" content="#000000" />
  104. <meta name="color:permalink" content="#ffffff" />
  105. <meta name="color:permalink background" content="#23192d" />
  106. <meta name="color:permalink hover" content="#cccccc" />
  107.  
  108. <meta name="color:&#x25C6;&#x3A;&#x2A;&#x3A;&#x25C7;&#x3A;&#x2A;&#x3A;&#x25C6;&#x3A;&#x2A;&#x3A;&#x25C7;&#x3A;&#x2A;&#x3A;&#x25C6;">
  109.  
  110. <meta name="color:accent night" content="#79D7FF" />
  111. <meta name="color:accented text night" content="#000000" />
  112. <meta name="color:background night" content="#313131" />
  113. <meta name="color:lightbox background night" content="#313131" />
  114. <meta name="color:text night" content="#ffffff" />
  115. <meta name="color:bold night" content="#79D7FF" />
  116. <meta name="color:italic night" content="#79D7FF" />
  117. <meta name="color:links night" content="#ffffff" />
  118. <meta name="color:link hover night" content="#79D7FF" />
  119. <meta name="color:posts background night" content="#414141" />
  120. <meta name="color:night borders" content="#313131" />
  121. <meta name="color:posts title night" content="#ffffff" />
  122. <meta name="color:sidebar title night" content="#ffffff" />
  123. <meta name="color:navigation night" content="#ffffff" />
  124. <meta name="color:navigation hover night" content="#79D7FF" />
  125. <meta name="color:question night" content="#ffffff" />
  126. <meta name="color:question background night" content="#525252" />
  127. <meta name="color:permalink night" content="#ffffff" />
  128. <meta name="color:permalink background night" content="#525252" />
  129. <meta name="color:permalink hover night" content="#79D7FF" />
  130.  
  131. <meta name="select:Background Attachment" content="fixed" title="fixed">
  132. <meta name="select:Background Attachment" content="scroll" title="scroll">
  133. <meta name="select:Background Repeat" content="repeat" title="repeat">
  134. <meta name="select:Background Repeat" content="no-repeat" title="no repeat">
  135.  
  136. <meta name="select:Body Font" content="Open Sans" title="Open Sans">
  137. <meta name="select:Body Font" content="Lato" title="Lato">
  138. <meta name="select:Body Font" content="Titillium Web" title="Titillium Web">
  139. <meta name="select:Body Font" content="Noto Sans JP" title="Noto Sans JP">
  140. <meta name="select:Body Font" content="Roboto" title="Roboto">
  141. <meta name="select:Body Font" content="Inter" title="Inter">
  142. <meta name="select:Body Font" content="Poppins" title="Poppins">
  143. <meta name="select:Body Font" content="Source Sans Pro" title="Source Sans Pro">
  144.  
  145. <meta name="select:font size" content="11" title="11px">
  146. <meta name="select:font size" content="12" title="12px">
  147. <meta name="select:font size" content="13" title="13px">
  148. <meta name="select:font size" content="14" title="14px">
  149.  
  150. <meta name="select:text align" content="left" title="left">
  151. <meta name="select:text align" content="justify" title="justify">
  152.  
  153. <meta name="select:description text align" content="left" title="left">
  154. <meta name="select:description text align" content="justify" title="justify">
  155.  
  156. <meta name="select:Post Size" content="300" title="300px">
  157. <meta name="select:Post Size" content="350" title="350px">
  158. <meta name="select:Post Size" content="375" title="375px">
  159. <meta name="select:Post Size" content="400" title="400px">
  160. <meta name="select:Post Size" content="450" title="450px">
  161. <meta name="select:Post Size" content="475" title="475px">
  162. <meta name="select:Post Size" content="500" title="500px">
  163. <meta name="select:Post Size" content="525" title="525px">
  164. <meta name="select:Post Size" content="540" title="540px">
  165.  
  166. <meta name="select:Post Padding" content="0" title="0px">
  167. <meta name="select:Post Padding" content="2" title="2px">
  168. <meta name="select:Post Padding" content="5" title="5px">
  169. <meta name="select:Post Padding" content="10" title="10px">
  170. <meta name="select:Post Padding" content="15" title="15px">
  171. <meta name="select:Post Padding" content="20" title="20px">
  172.  
  173. <meta name="select:Photoset gutter" content="1" title="1px">
  174. <meta name="select:Photoset gutter" content="2" title="2px">
  175. <meta name="select:Photoset gutter" content="4" title="4px">
  176. <meta name="select:Photoset gutter" content="6" title="6px">
  177. <meta name="select:Photoset gutter" content="8" title="8px">
  178. <meta name="select:Photoset gutter" content="10" title="10px">
  179.  
  180. <meta name="text:topbar title" content="topbar title"/>
  181. <meta name="text:margin bottom" content="50"/>
  182.  
  183. <meta name="if:Link1" content="1" />
  184. <meta name="if:Link2" content="1" />
  185. <meta name="if:Link3" content="1" />
  186. <meta name="if:Link4" content="1" />
  187. <meta name="if:Link5" content="1" />
  188. <meta name="if:Link6" content="1" />
  189.  
  190. <meta name="text:CustomLink1URL" content="Link 1 URL" />
  191. <meta name="text:CustomLink1Name" content="Link 1" />
  192. <meta name="text:CustomLink2URL" content="Link 2 URL" />
  193. <meta name="text:CustomLink2Name" content="Link 2" />
  194. <meta name="text:CustomLink3URL" content="Link 3 URL" />
  195. <meta name="text:CustomLink3Name" content="Link 3" />
  196. <meta name="text:CustomLink4URL" content="Link 4 URL" />
  197. <meta name="text:CustomLink4Name" content="Link 4" />
  198. <meta name="text:CustomLink5URL" content="Link 5 URL" />
  199. <meta name="text:CustomLink5Name" content="Link 5" />
  200. <meta name="text:CustomLink6URL" content="Link 6 URL" />
  201. <meta name="text:CustomLink6Name" content="Link 6" />
  202.  
  203. <meta name="image:background" content=""/>
  204. <meta name="image:sidebar" content=""/>
  205.  
  206. <meta name="if:inverted tumblr controls" content="1" />
  207. <meta name="if:Small Cursor" content="0" />
  208. <meta name="if:Custom Text Selection" content="0"/>
  209. <meta name="if:Faded Images" content="0"/>
  210. <meta name="if:Grayscale Images" content="0"/>
  211. <meta name="if:Show Captions" content="1"/>
  212. <meta name="if:hover tags" content="1" />
  213.  
  214. <!----------------Custom Options---------------->
  215.  
  216. <!--
  217.        NPF images fix v3.0 by @glenthemes [2021]
  218.        💌 git.io/JRBt7
  219. --->
  220. <script src="//npf-images-v3.github.io/script.js"></script>
  221. <link rel="stylesheet" href="//npf-images-v3.github.io/recon.css">
  222.  
  223. <style tmblr-npf>
  224.  
  225. :root {
  226.     --NPF-Caption-Spacing:1em;
  227.     --NPF-Image-Spacing:4px;
  228.    
  229.     /*---------- NIGHT MODE COLOR CUSTOMIZATION (DO NOT TOUCH)----------*/
  230.    
  231.     --accent-night: {color:accent night};
  232.     --accented-text-night: {color:accented text night};
  233.     --background-night: {color:background night};
  234.     --lightbox-background-night: rgba({RGBcolor:background night}, 0.6);
  235.     --text-night: {color:text night};
  236.     --bold-night: {color:bold night};
  237.     --italic-night: {color:italic night};
  238.     --links-night: {color:links night};
  239.     --link-hover-night: {color:link hover night};
  240.     --posts-background-night: {color:posts background night};
  241.     --night-borders: {color:night borders};
  242.     --posts-title-night: {color:posts title night};
  243.     --sidebar-title-night: {color:sidebar title night};
  244.     --navigation-night: {color:navigation night};
  245.     --navigation-hover-night: {color:navigation hover night};
  246.     --question-night: {color:question night};
  247.     --question-background-night: {color:question background night};
  248.     --permalink-night: {color:permalink night};
  249.     --permalink-background-night: {color:permalink background night};
  250.     --permalink-hover-night: {color:permalink hover night};
  251. }
  252.  
  253. /*----------TUMBLR CONTROLS----------*/
  254.  
  255. iframe.tmblr-iframe {
  256.     position:fixed!important;
  257.     z-index: 300!important;
  258.     top: 20px!important;
  259.     right: 15px!important;
  260.     opacity:0.6!important;
  261.     {block:ifinvertedtumblrcontrols}
  262.     filter:invert(1);
  263.     -webkit-filter:invert(1);
  264.     -o-filter:invert(1);
  265.     -moz-filter:invert(1);
  266.     -ms-filter:invert(1);
  267.     filter:invert(100%) hue-rotate(180deg);
  268.     -webkit-filter:invert(100%) hue-rotate(180deg);
  269.     -moz-filter:invert(100%) hue-rotate(180deg);
  270.     -o-filter:invert(100%) hue-rotate(180deg);
  271.     -ms-filter:invert(100%) hue-rotate(180deg);
  272.     {/block:ifinvertedtumblrcontrols}
  273.     transform:scale(0.7);
  274.     transform-origin:100% 0;
  275.     -webkit-transform:scale(0.7);
  276.     -webkit-transform-origin:100% 0;
  277.     -o-transform:scale(0.7);
  278.     -o-transform-origin:100% 0;
  279.     -moz-transform:scale(0.7);
  280.     -moz-transform-origin:100% 0;
  281.     -ms-transform:scale(0.7);
  282.     -ms-transform-origin:100% 0;
  283.     -webkit-transition: 0.8s ease;
  284.     -moz-transition: 0.8s ease;
  285.     -o-transition: 0.8s ease;
  286.     transition: 0.8s ease;
  287. }
  288.  
  289. iframe.tmblr-iframe:hover {
  290.     opacity:0.8!important;
  291.     -webkit-transition: 0.8s ease;
  292.     -moz-transition: 0.8s ease;
  293.     -o-transition: 0.8s ease;
  294.     transition: 0.8s ease;
  295. }
  296.  
  297. body.night iframe.tmblr-iframe {
  298.     opacity: 1;
  299.     filter:invert(0)!important;
  300.     -webkit-filter:invert(0)!important;
  301.     -o-filter:invert(0)!important;
  302.     -moz-filter:invert(0)!important;
  303.     -ms-filter:invert(0)!important;
  304.     filter:invert(100%) hue-rotate(180deg);
  305.     -webkit-filter:invert(100%) hue-rotate(180deg);
  306.     -moz-filter:invert(100%) hue-rotate(180deg);
  307.     -o-filter:invert(100%) hue-rotate(180deg);
  308.     -ms-filter:invert(100%) hue-rotate(180deg);
  309.     -webkit-transition: 0.8s ease;
  310.     -moz-transition: 0.8s ease;
  311.     -o-transition: 0.8s ease;
  312.     transition: 0.8s ease;
  313. }
  314.  
  315. /*--------CUSTOM TUMBLR LIGHTBOX--------*/
  316.  
  317. .vignette, #vignette {
  318.     opacity:0;
  319. }
  320. .lightbox-image, #tumblr_lightbox img {
  321.     box-shadow:none !important;
  322.     border-radius:0 !important;
  323.     max-width:none;
  324. }
  325.  
  326. .tmblr-lightbox, #tumblr_lightbox {
  327.     background-color:rgba({RGBcolor:Background}, 0.6) !important;
  328. }
  329.  
  330. body.night .tmblr-lightbox, body.night #tumblr_lightbox {
  331.     background-color:var(--lightbox-background-night)!important;
  332.     transition: 0.6s;
  333. }
  334.  
  335. .lightbox-image, #tumblr_lightbox img {
  336.     background-color: {color:posts} !important;
  337.     padding: 10px !important;
  338.     -moz-box-sizing:border-box;
  339.     box-sizing:border-box;
  340. }
  341.  
  342. body.night .lightbox-image, body.night #tumblr_lightbox img {
  343.     background-color: var(--posts-background-night)!important;
  344.     transition: 0.6s;
  345. }
  346.  
  347. /*----------SCROLLBAR----------*/
  348.  
  349. ::-webkit-scrollbar {
  350.     width: 10px;
  351.     height: 6px;
  352. }
  353. ::-webkit-scrollbar-button {
  354.     width: 0px;
  355.     height: 0px;
  356. }
  357. ::-webkit-scrollbar-thumb {
  358.     background-color: {color:scrollbar};
  359.     border-radius: 20px;
  360.     border: 2px solid {color:Background};
  361. }
  362.  
  363. body.night::-webkit-scrollbar-thumb {
  364.     background-color: var(--accent-night);
  365.     border: 2px solid var(--background-night)!important;
  366.     transition: 0.6s;
  367. }
  368.  
  369. ::-webkit-scrollbar-track {
  370.     background: {color:posts};
  371.     border: 8px solid {color:posts};
  372.     border-radius: 20px;
  373. }
  374.  
  375. body.night::-webkit-scrollbar-track {
  376.     background-color: var(--background-night)!important;
  377.     border: 8px solid var(--background-night)!important;
  378.     transition: 0.6s;
  379. }
  380.  
  381. ::-webkit-scrollbar-corner {
  382.     background: transparent;
  383. }
  384.  
  385. /*----------TOOLTIPS----------*/
  386.  
  387. .tippy-tooltip.custom-theme {
  388.     background-color: {color:accent};
  389.     color: {color:accented text};
  390.     text-align:center;
  391.     font-size: 12px;
  392.     font-weight: 700;
  393. }
  394.  
  395. body.night .tippy-tooltip.custom-theme {
  396.     background-color: var(--accent-night);
  397.     color: var(--accented-text-night);
  398. }
  399.  
  400. .tippy-tooltip.custom-theme .tippy-svg-arrow {
  401.     fill: {color:accent};
  402. }
  403.  
  404. body.night .tippy-svg-arrow {
  405.     fill: var(--accent-night)!important;
  406. }
  407.  
  408. /*----------TEXT SELECTION----------*/
  409.  
  410. {block:ifCustomTextSelection}
  411. ::selection {
  412.     background: {color:text selection background};
  413.     color: {color:text selection};
  414. }
  415.  
  416. ::-moz-selection {
  417.     background: {color:text selection background};
  418.     color: {color:text selection};
  419. }
  420.  
  421. ::-webkit-selection {
  422.     background: {color:text selection background};
  423.     color: {color:text selection};
  424. }
  425. {/block:ifCustomTextSelection}
  426.  
  427. /*----------THEME BASICS----------*/
  428.  
  429. html, body {
  430.     color: {color:text};
  431.     font-family: {select:Body Font}, helvetica, sans-serif;
  432.     font-weight: 400;
  433.     font-size: {select:font size}px;
  434.     line-height:180%;
  435.     margin:0;
  436.     padding: 0;
  437.     text-align:left;
  438.     background: {color:background} url({image:Background}) center;
  439.     background-attachment: {select:Background Attachment};
  440.     background-repeat: {select:Background Repeat};
  441.     transition: 0.2s;
  442. }
  443.  
  444. body.night {
  445.     background: var(--background-night)!important;
  446.     color:var(--text-night)!important;
  447.     transition:0.2s;
  448. }
  449.  
  450. p:empty {
  451.     display: none;
  452. }
  453.  
  454. b,strong {
  455.     color:{color:bold};
  456.     font-weight: 700;
  457. }
  458.  
  459. body.night b, body.night strong {
  460.     color:var(--bold-night)!important;
  461.     transition:.6s;
  462. }
  463.  
  464. i,em {
  465.     color:{color:italic};
  466. }
  467.  
  468. body.night i, body.night em {
  469.     color: var(--italic-night)!important;
  470.     transition: 0.6s;
  471. }
  472.  
  473. small,sub,sup {
  474.     font-size: calc({select:font size}px - 0.5px);
  475. }
  476.  
  477. h1,h2,h3 {
  478.     font-weight: 700;
  479.     font-size: 1.3em;
  480.     color: {color:bold};
  481.     transition: 0.6s;
  482. }
  483.  
  484. body.night h1,body.night h2,body.night h3 {
  485.     color:var(--bold-night)!important;
  486.     transition:.6s;
  487. }
  488.  
  489. h4,h5,h6 {
  490.     font-weight: 700;
  491.     font-size: 1.2em;
  492.     color: {color:bold};
  493.     transition: 0.6s;
  494. }
  495.  
  496. body.night h4,body.night h5,body.night h6 {
  497.     color:var(--bold-night)!important;
  498.     transition:.6s;
  499. }
  500.  
  501. pre {
  502.     white-space: pre-wrap;
  503.     white-space: -moz-pre-wrap;
  504.     white-space: -pre-wrap;
  505.     white-space: -o-pre-wrap;
  506.     word-wrap: break-word;
  507.     padding: 5px 10px;
  508.     font-family: inherit;
  509.     font-weight: 400;
  510.     line-height: 150%;
  511. }
  512.  
  513. blockquote:not(.tumblr_parent) {
  514.     padding-left: 10px;
  515.     margin: 10px;
  516.     border-radius: 5px;
  517.     border-left: 3px solid {color:blockquote};
  518.     transition: 0.6s;
  519. }
  520.  
  521. body.night blockquote:not(.tumblr_parent) {
  522.     border-left: 3px solid var(--accent-night);
  523.     transition:.6s;
  524. }
  525.  
  526. blockquote img {
  527.     max-width: 100%;
  528.     height: auto;
  529. }
  530.  
  531. figure {
  532.   margin: 1em 3px;
  533. }
  534.  
  535. a {
  536.     color:{color:links};
  537.     text-decoration:none;
  538.     -moz-transition-duration: 0.6s;
  539.     -o-transition-duration: 0.6s;
  540.     -webkit-transition-duration: 0.6s;
  541.     transition-duration: 0.6s;
  542. }
  543.  
  544. body.night a {
  545.     color: var(--links-night)!important;
  546.     transition: 0.6s;
  547. }
  548.  
  549. a:hover {
  550.     color:{color:link hover};
  551.     -moz-transition-duration: 0.6s;
  552.     -o-transition-duration: 0.6s;
  553.     -webkit-transition-duration: 0.6s;
  554.     transition-duration: 0.6s;
  555. }
  556.  
  557. body.night a:hover {
  558.     color: var(--link-hover-night)!important;
  559. }
  560.  
  561. {block:ifSmallCursor}
  562. html, body, a { cursor:url("https://i.imgur.com/2qleX.jpg"), auto !important; }
  563. a:hover{cursor:url("https://i.imgur.com/IepP2.jpg"), auto !important;}
  564. {/block:ifSmallCursor}
  565.  
  566. /*----------PAGINATION----------*/
  567.  
  568. #pagination {
  569.     margin: 20px auto 0 auto;
  570.     text-align:center;
  571.     background-color: {color:posts};
  572.     padding: 15px 20px;
  573.     font-size: 1.1em;
  574. }
  575.  
  576. body.night #pagination {
  577.     background-color: var(--posts-background-night)!important;
  578.     transition: 0.6s;
  579. }
  580.  
  581. .current_page {
  582.     color:{color:pagination};
  583.     border-bottom: 2px solid {color:accent};
  584.     padding: 5px 10px;
  585.     transition: 0.6s;
  586.     font-weight: 700;
  587.     transition: 0.6s;
  588. }
  589.  
  590. body.night .current_page {
  591.     color: var(--links-night);
  592.     border-bottom: 2px solid var(--accent-night);
  593.     transition: 0.6s;
  594. }
  595.  
  596. #pagination a {
  597.     margin: 0 10px;
  598.     padding: 5px 10px;
  599.     color: {color:pagination};
  600.     font-weight: 700;
  601.     border-bottom: 2px solid transparent;
  602.     transition: 0.6s;
  603. }
  604.  
  605. body.night #pagination a {
  606.     color: var(--links-night)!important;
  607.     transition: 0.6s;
  608. }
  609.  
  610. #pagination a:hover {
  611.     color: {color:link hover};
  612.     transition: 0.6s;
  613. }
  614.  
  615. body.night #pagination a:hover {
  616.     color: var(--link-hover-night)!important;
  617.     transition: 0.6s;
  618. }
  619.  
  620. /*----------POSIS CONTAINER----------*/
  621.  
  622. .cage {
  623.     width: 100%;
  624.     height: 100%;
  625.     position: relative;
  626. }
  627.  
  628. .wrap {
  629.     position: relative;
  630.     margin: 0 auto;
  631.     padding-top: 120px;
  632.     display: flex;
  633.     align-items: flex-start;
  634.     flex-flow: row wrap;
  635.     width: calc({select:post size}px + 720px);
  636.     {block:PermalinkPage}
  637.     width: calc(540px + 680px);
  638.     {/block:PermalinkPage}
  639. }
  640.  
  641. #content {
  642.     position: relative;
  643.     margin: 60px 85px 60px auto;
  644.     width: {select:Post Size}px;
  645.     {block:PermalinkPage}
  646.     width: 540px;
  647.     {/block:PermalinkPage}
  648. }
  649.  
  650. .posts {
  651.     position: relative;
  652.     border: 1px solid {color:post borders};
  653.     width: {select:post size}px;
  654.     background-color: {color:posts};
  655.     {block:IndexPage}
  656.     margin-bottom: {text:margin bottom}px;
  657.     {/block:IndexPage}
  658.     {block:PermalinkPage}
  659.     margin-bottom: 50px;
  660.     width: 540px;
  661.     {/block:PermalinkPage}
  662.     transition: 0.6s;
  663. }
  664.  
  665. body.night .posts {
  666.     background-color: var(--posts-background-night)!important;
  667.     border: 1px solid var(--night-borders);
  668.     transition: 0.6s;
  669. }
  670.  
  671. .la-thumbtack {
  672.     color: {color:links};
  673.     border: 3px solid {color:accent};
  674.     padding: 5px;
  675.     font-size: 18px;
  676.     width: 20px;
  677.     height: 20px;
  678.     transition: 0.6s;
  679. }
  680.  
  681. body.night .la-thumbtack {
  682.     background-color: var(--posts-background-night);
  683.     color: var(--links-night);
  684.     border: 3px solid var(--accent-night);
  685.     transition: 0.6s;
  686. }
  687.  
  688. .posts ul li {
  689.     list-style: none;
  690.     margin-left: -25px;
  691.     padding-left: 10;
  692. }
  693.  
  694. .posts ul li:before {
  695.     content: "―";
  696.     padding-right: 5px;
  697.     color: {color:accent};
  698.     transition: 0.6s;
  699. }
  700.  
  701. body.night .posts ul li:before {
  702.     color: var(--accent-night);
  703.     transition: 0.6s;
  704. }
  705.  
  706. .posts ol {
  707.     list-style-type: upper-roman;
  708.     text-transform: justify;
  709.     margin-left: -10px;
  710. }
  711.  
  712. .posts iframe {
  713.     max-width:100%;
  714.     display: block;
  715.     padding: 0;
  716.     margin: 0
  717. }
  718.  
  719. .posts img {
  720.     max-width: 100%;
  721.     display: block;
  722.     border: 0;
  723. }
  724.  
  725. .tumblr_video_container {
  726.     width: auto !important;
  727.     height: auto !important;
  728. }
  729.  
  730. .posts .photo img {
  731.     {block:ifFadedImages}
  732.     {block:IndexPage}
  733.     opacity: 0.6;
  734.     -moz-transition: all 0.8s ease-in;
  735.     -o-transition: all 0.8s ease-in;
  736.     -webkit-transition: all 0.8s ease-in;
  737.     transition: all 0.8s ease-in;
  738. }
  739.  
  740. .posts:hover .photo img {
  741.     opacity: 1.0;
  742.     -moz-transition: all 0.8s ease-in;
  743.     -o-transition: all 0.8s ease-in;
  744.     -webkit-transition: all 0.8s ease-in;
  745.     transition: all 0.8s ease-in;
  746.     {/block:IndexPage}
  747.     {/block:ifFadedImages}
  748. }
  749.  
  750. {block:ifGrayscaleImages}
  751. {block:IndexPage}
  752. .posts .photo img {
  753.     z-index: -9999999999999999999999999px;
  754.     -webkit-filter: grayscale(100%);
  755.     filter: grayscale(100%);
  756.     filter: gray;
  757.     /* IE 6-9 */
  758.     -moz-transition: all 0.8s ease-in;
  759.     -o-transition: all 0.8s ease-in;
  760.     -webkit-transition: all 0.8s ease-in;
  761.     transition: all 0.8s ease-in;
  762. }
  763.  
  764. .posts:hover .photo img {
  765.     -webkit-filter: none;
  766.     filter: none;
  767.     -moz-transition: all 0.8s ease-in;
  768.     -o-transition: all 0.8s ease-in;
  769.     -webkit-transition: all 0.8s ease-in;
  770.     transition: all 0.8s ease-in;
  771. }
  772. {/block:IndexPage}
  773. {/block:ifGrayscaleImages}
  774.  
  775. /*----------TEXT/CAPTION CONTAINER----------*/
  776.  
  777. .photo, .video, .photo-slideshow {
  778.     padding: {select:Post Padding}px;
  779. }
  780.  
  781. .npf_inst, #npf_a0rsv {
  782.     margin-bottom: 20px;
  783. }
  784.  
  785. .npf_inst.photo-origin, #npf_wmw57 {
  786.     padding-top: 10px;
  787. }
  788.  
  789. .caption {
  790.     text-align: {select:text align};
  791. }
  792.  
  793. .caption figcaption {
  794.     padding: 15px;
  795. }
  796.  
  797. figcaption p {
  798.     margin: 5px 0 0;
  799. }
  800.  
  801. .caption img {
  802.     max-width: 100%;
  803.     height: auto;
  804. }
  805.  
  806. .reblog-list {
  807.     padding: 0 10px;
  808. }
  809.  
  810. .reblog-header {
  811.     padding: 20px 15px 0 15px;
  812.     margin-bottom: 10px;
  813. }
  814.  
  815. .reblog-header img {
  816.     width: 25px;
  817.     height: 25px;
  818.     display: inline-block;
  819.     vertical-align: middle;
  820.     margin-right: 10px;
  821.     border-radius: 100%;
  822. }
  823.  
  824. .inactive, .user, .deactivated {
  825.     font-weight: 700;
  826.     color: {color:links};
  827.     text-align: center;
  828.     transition: 0.6s;
  829. }
  830.  
  831. body.night .inactive, body.night .user, body.night .deactivated {
  832.     color: var(--links-night)!important;
  833.     transition: 0.6s;
  834. }
  835.  
  836. .user:hover {
  837.     color: {color:link hover};
  838.     transition: 0.6s;
  839. }
  840.  
  841. body.night .user:hover {
  842.     color: var(--link-hover-night)!important;
  843.     transition: 0.6s;
  844. }
  845.  
  846. .reblog-content {
  847.     padding: 5px 15px;
  848. }
  849.  
  850. .read_more {
  851.     position: relative;
  852.     width: 100%;
  853.     padding: 2px 10px;
  854.     font-weight: 700;
  855.     transition: 0.6s;
  856.     color: {color:accented text};
  857.     background-color: {color:accent};
  858. }
  859.  
  860. body.night .read_more {
  861.     color: var(--accented-text-night)!important;
  862.     background-color: var(--accent-night);
  863.     transition: 0.6s;
  864. }
  865.  
  866. .read_more:hover {
  867.     background-color: transparent;
  868.     color: {color:links};
  869.     transition: 0.6s;
  870. }
  871.  
  872. body.night .read_more:hover {
  873.     background-color: transparent;
  874.     color: var(--links-night);
  875.     transition: 0.6s;
  876. }
  877.  
  878. /*----------POST INFO & PERMALINKS----------*/
  879.  
  880. .src-box {
  881.    position: sticky;
  882.     top: 100px;
  883. }
  884.  
  885. .src {
  886.     position: absolute;
  887.     right: -50px;
  888. }
  889.  
  890. .src img {
  891.     width: 35px;
  892.     height: 35px;
  893.     margin-bottom: 8px;
  894.     border: 3px solid {color:accent};
  895.     box-sizing: border-box;
  896.     padding: 3px;
  897.     transition: 0.6s;
  898. }
  899.  
  900. body.night .src img  {
  901.     border: 3px solid var(--accent-night)!important;
  902.     transition: 0.6s;
  903. }
  904.  
  905. .time {
  906.     background-color: {color:permalink background};
  907.     display: flex;
  908.     justify-content: space-between;
  909.     align-items: center;
  910.     padding-right: 10px;
  911.     transition: 0.6s;
  912. }
  913.  
  914. body.night .time {
  915.     background-color: var(--permalink-background-night)!important;
  916.     transition: 0.6s;
  917. }
  918.  
  919. .time a {
  920.     color: {color:permalink};
  921.     transition: 0.6s;
  922. }
  923.  
  924. body.night .time a {
  925.     color: var(--links-night)!important;
  926.     transition: 0.6s;
  927. }
  928.  
  929. .time a:hover {
  930.     color: {color:permalink hover};
  931.     transition: 0.6s;
  932. }
  933.  
  934. body.night .time a:hover {
  935.     color: var(--permalink-hover-night)!important;
  936.     transition: 0.6s;
  937. }
  938.  
  939. #date-box {
  940.     width: 60px;
  941.     height: 60px;
  942.     background-color: {color:accent};
  943.     text-align: center;
  944.     padding: 6px 10px 10px;
  945.     box-sizing: border-box;
  946.     transition: 0.6s;
  947. }
  948.  
  949. body.night #date-box {
  950.     background-color: var(--accent-night);
  951.     transition: 0.6s;
  952. }
  953.  
  954. #date-box a {
  955.     font-weight: 700;
  956.     font-size: 1.1em;
  957.     line-height: 10px;
  958.     color: {color:accented text};
  959.     transition: 0.6s;
  960. }
  961.  
  962. body.night #date-box a {
  963.     color: var(--accented-text-night)!important;
  964.     transition: 0.6s;
  965. }
  966.  
  967. #date-box span {
  968.     font-size: 0.9em;
  969.     font-weight: 400;
  970. }
  971.  
  972. .controls a {
  973.     position:relative;
  974.     display:inline-block;
  975.     margin: 0 2px;
  976. }
  977.  
  978. .la-chart-bar, .la-sync, .la-grin-hearts {
  979.     color: {color:permalink};
  980.     font-size: 20px;
  981.     display: inline-block;
  982.     vertical-align: middle;
  983.     transition: 0.6s;
  984. }
  985.  
  986. body.night .la-chart-bar, body.night .la-sync, body.night .la-grin-hearts {
  987.     color: var(--links-night)!important;
  988.     transition: 0.6s;
  989. }
  990.  
  991. .la-chart-bar {
  992.     margin-right: 5px;
  993. }
  994.  
  995. .like .liked + .la-grin-hearts {
  996.    opacity: 1;
  997. }
  998.  
  999. .like .liked + .la-grin-hearts {
  1000.      color: #ec5a5a;
  1001. }
  1002.  
  1003. .like .like_button iframe {
  1004.    position:absolute;
  1005.    top: -1px;
  1006.    left:0;
  1007.    bottom:0;
  1008.    right:0;
  1009.    width:100%;
  1010.    height:100%;
  1011.    z-index:2;
  1012.    opacity:0.000001;
  1013. }
  1014.  
  1015. /*--------POST TAGS--------*/
  1016.  
  1017. .post_tags {
  1018.     margin-top: 15px;
  1019.     padding: 10px 0;
  1020.     white-space: nowrap;
  1021.     overflow: hidden;
  1022.     position: absolute;
  1023.     width: {select:post size}px;
  1024.     {block:ifhovertags}
  1025.     opacity: 0;
  1026.     {/block:ifhovertags}
  1027.     -moz-transition-duration: 0.8s;
  1028.     -o-transition-duration: 0.8s;
  1029.     -webkit-transition-duration: 0.8s;
  1030.     transition-duration: 0.8s;
  1031. }
  1032.  
  1033. .posts:hover .post_tags {
  1034.     opacity: 1;
  1035.     -moz-transition-duration: 0.8s;
  1036.     -o-transition-duration: 0.8s;
  1037.     -webkit-transition-duration: 0.8s;
  1038.     transition-duration: 0.8s;
  1039. }
  1040.  
  1041. .post_tags.draggable .post_tags_inner {
  1042.     cursor: col-resize;
  1043.     -webkit-touch-callout: none;
  1044.     -webkit-user-select: none;
  1045.     -khtml-user-select: none;
  1046.     -moz-user-select: none;
  1047.     -ms-user-select: none;
  1048.     user-select: none;
  1049. }
  1050.  
  1051. .post_tags_inner {
  1052.     float: left;
  1053.     position: relative;
  1054.     padding: 0px 20px 0px 0;
  1055. }
  1056.  
  1057. .post_tags a,
  1058. .post_tags .post_tag {
  1059.     display: inline-block;
  1060.     color: {color:links};
  1061.     font-size: 12px;
  1062.     font-weight: 700;
  1063.     transition: 0.6s;
  1064. }
  1065.  
  1066. body.night .post_tags a,
  1067. .post_tags .post_tag {
  1068.     color: var(--links-night)!important;
  1069.     transition: 0.6s;
  1070. }
  1071.  
  1072. .post_tags:after {
  1073.     content: '';
  1074.     position: absolute;
  1075.     right: 0;
  1076.     bottom: 0;
  1077.     width: 50px;
  1078.     height: 40px;
  1079. }
  1080.  
  1081. .post_tags a:hover,
  1082. .post_tags .post_tag:hover,
  1083. .post_tags a:focus,
  1084. .post_tags .post_tag:focus,
  1085. .post_tags a:active,
  1086. .post_tags .post_tag:active {color:{color:permalink hover};}
  1087.  
  1088. .la-tag {
  1089.     margin-right: 10px;
  1090.     padding: 5px;
  1091.     background-color: {color:accent};
  1092.     color: {color:accented text};
  1093.     font-size:18px;
  1094.     display:inline-block;
  1095.     vertical-align: middle;
  1096.     transition: 0.6s;
  1097. }
  1098.  
  1099. body.night .la-tag {
  1100.     background-color: var(--accent-night);
  1101.     color: var(--accented-text-night)!important;
  1102.     transition: 0.6s;
  1103. }
  1104.  
  1105. /*----------PERMALINK PAGE----------*/
  1106.  
  1107. #perma {
  1108.     width: 540px;
  1109.     padding: 10px 5px;
  1110.     margin: 0 auto;
  1111.     background-color: {color:posts};
  1112.     text-align: center;
  1113.     text-transform: lowercase;
  1114.     box-sizing: border-box;
  1115.     position: relative;
  1116. }
  1117.  
  1118. body.night #perma {
  1119.     background-color: var(--posts-background-night)!important;
  1120.     border: 1px solid var(--night-borders);
  1121.     transition: 0.6s;
  1122. }
  1123.  
  1124. #perma span {
  1125.     font-family: 'Merriweather', serif;
  1126.     font-size: 1.2em;
  1127. }
  1128.  
  1129. #permatg {
  1130.     width: 540px;
  1131.     padding: 10px;
  1132.     margin: 10px auto 10px;
  1133.     background-color: {color:posts};
  1134.     text-align: center;
  1135.     text-transform: lowercase;
  1136.     box-sizing: border-box;
  1137.     position: relative;
  1138.     transition: 0.6s;
  1139. }
  1140.  
  1141. body.night #permatg  {
  1142.     background-color: var(--posts-background-night)!important;
  1143.     border: 1px solid var(--night-borders);
  1144.     transition: 0.6s;
  1145. }
  1146.  
  1147. #permatg a {
  1148.     display: inline-block;
  1149.     margin: 0 5px;
  1150.     color: {color:links};
  1151.     transition: 0.6s;
  1152. }
  1153.  
  1154. body.night #permatg a {
  1155.     color: var(--links-night);
  1156.     transition: 0.6s;
  1157. }
  1158.  
  1159. #permatg a:hover {
  1160.     color: {color:link hover};
  1161. }
  1162.  
  1163. body.night #permatg a:hover {
  1164.     color: var(--link-hover-night);
  1165.     transition: 0.6s;
  1166. }
  1167.  
  1168. .rb {
  1169.     position: absolute;
  1170.     left: 46%;
  1171.     margin-top: 27px;
  1172.     display: inline-block;
  1173.     z-index: 1;
  1174. }
  1175.  
  1176. .root img, .via img {
  1177.     border-radius: 100%;
  1178.     padding: 3px;
  1179.     margin-right: 2px;
  1180.     background-color: {color:accent};
  1181.     transition: 0.6s;
  1182. }
  1183.  
  1184. body.night .root img, .via img {
  1185.     background-color: var(--accent-night);
  1186.     transition: 0.6s;
  1187. }
  1188.  
  1189. #notecontainer {
  1190.     margin: 10px auto;
  1191.     width: 540px;
  1192.     background-color: {color:posts};
  1193.     position: relative;
  1194.     transition: 0.6s;
  1195. }
  1196.  
  1197. body.night #notecontainer  {
  1198.     background-color: var(--posts-background-night)!important;
  1199.     border: 1px solid var(--night-borders);
  1200.     transition: 0.6s;
  1201. }
  1202.  
  1203. #notecontainer ol.notes {
  1204.     list-style-type: none;
  1205.     margin: 0;
  1206.     padding: 0;
  1207.     font-size: {text:body font}px;
  1208. }
  1209.  
  1210. #notecontainer ol.notes li.note {
  1211.     padding: 15px;
  1212. }
  1213.  
  1214. #notecontainer img.avatar {
  1215.     margin-right: 10px;
  1216.     vertical-align: middle;
  1217.     width: 25px;
  1218.     height: 25px;
  1219.     border-radius: 5px;
  1220. }
  1221.  
  1222. #permpage {
  1223.     text-align: center;
  1224.     margin-top: 50px;
  1225. }
  1226.  
  1227. .la-angle-double-left, .la-angle-double-right {
  1228.     padding: 5px;
  1229.     font-size: 20px;
  1230.     line-height: 14px;
  1231.     display: inline-block;
  1232.     height: 16px;
  1233.     border-radius: 5px;
  1234.     margin: 0 10px;
  1235.     background-color: {color:accent};
  1236.     color: {color:accented text};
  1237.     -webkit-transition: all 0.6s ease;
  1238.     -moz-transition: all 0.6s ease;
  1239.     -o-transition: all 0.6s ease;
  1240.     transition: all 0.6s ease;
  1241. }
  1242.  
  1243. body.night .la-angle-double-left, body.night .la-angle-double-right {
  1244.     background-color: var(--accent-night);
  1245.     color: var(--accented-text-night)!important;
  1246.     transition: 0.6s;
  1247. }
  1248.  
  1249. .la-angle-double-left:hover, .la-angle-double-right:hover {
  1250.     background-color: transparent;
  1251.     color: {color:links};
  1252.     -webkit-transition: all 0.6s ease;
  1253.     -moz-transition: all 0.6s ease;
  1254.     -o-transition: all 0.6s ease;
  1255.     transition: all 0.6s ease;
  1256. }
  1257.  
  1258. body.night .la-angle-double-left:hover, body.night .la-angle-double-right:hover {
  1259.     color: var(--links-night)!important;
  1260.     background-color: transparent;
  1261.     transition: 0.6s;
  1262. }
  1263.  
  1264. /*----------TUMBLR TEXT/LINKS----------*/  
  1265.  
  1266. .posts .title, .posts .link {
  1267.     color: {color:post title};
  1268.     padding: 20px;
  1269.     font-size: 1.5em;
  1270.     font-weight: 700;
  1271.     line-height: 200%;
  1272.     position: relative;
  1273.     line-height: 120%;
  1274.     transition: 0.6s;
  1275. }
  1276.  
  1277. body.night .posts .title, body.night .posts .link {
  1278.     color: var(--posts-title-night)!important;
  1279.     transition: 0.6s;
  1280. }
  1281.  
  1282. .posts .title:before, .posts .link:before {
  1283.     content: '';
  1284.     position: absolute;
  1285.     top: 90%;
  1286.     left: 20px;
  1287.     width: 10%;
  1288.     height: 3px;
  1289.     background-color: {color:accent};
  1290.     transition: 0.6s;
  1291. }
  1292.  
  1293. body.night .posts .title:before, body.night .posts .link:before {
  1294.     background-color: var(--accent-night);
  1295.     transition: 0.6s;
  1296. }
  1297.  
  1298. .posts .link a {
  1299.     color: {color:post title};
  1300.     transition: 0.6s;
  1301. }
  1302.  
  1303. body.night .posts .link a {
  1304.     color: var(--links-night)!important;
  1305.     transition: 0.6s;
  1306. }
  1307.  
  1308. .posts .link a:hover {
  1309.     color: {color:link hover};
  1310.     transition: 0.6s;
  1311. }
  1312.  
  1313. body.night .posts .link a:hover {
  1314.     color: var(--link-hover-night)!important;
  1315.     transition: 0.6s;
  1316. }
  1317.  
  1318. .thumbnail img {
  1319.     width: 100%;
  1320.     height: auto;
  1321.     display: block;
  1322. }
  1323.  
  1324. /*----------TUMBLR QUOTES----------*/  
  1325.  
  1326. .qt {
  1327.     padding: 20px 20px 0;
  1328.     display: flex;
  1329.     flex-direction: row;
  1330.     justify-content: space-between;
  1331. }
  1332.  
  1333. .quote {
  1334.     line-height: 150%;
  1335.     font-size: 1.5em;
  1336.     font-family: 'Roboto Slab', serif;
  1337.     padding: 20px;
  1338.     padding-left: 20px;
  1339.     border-left: 1px solid {color:post borders};
  1340.     transition: 0.6s;
  1341. }
  1342.  
  1343. body.night .quote {
  1344.     border-left: 1px solid var(--accent-night);
  1345. }
  1346.  
  1347. .la-quote-right {
  1348.     border: 2px solid {color:accent};
  1349.     color: {color:links};
  1350.     padding: 5px;
  1351.     font-size: 1.2em;
  1352.     align-self: center;
  1353.     border-radius: 5px;
  1354.     transition: 0.6s;
  1355. }
  1356.  
  1357. body.night .la-quote-right {
  1358.     color: var(--links-night)!important;
  1359.     border: 2px solid var(--accent-night);
  1360.     transition: 0.6s;
  1361. }
  1362.  
  1363. .quote-box {
  1364.     font-size: 20px;
  1365.     align-self: center;
  1366.     margin-right: 20px;
  1367. }
  1368.  
  1369. .qtsource {
  1370.     padding: 0 20px 20px;
  1371. }
  1372.  
  1373. /*----------TUMBLR AUDIO----------*/
  1374.  
  1375. .audiowrapper {
  1376.     clear: both;
  1377.     background-color: {color:question background};
  1378.     display:flex;
  1379.     transition: 0.6s;
  1380.     height: 200px;
  1381.     transition: 0.6s;
  1382. }
  1383.  
  1384. body.night .audiowrapper {
  1385.     background-color: var(--question-background-night)!important;
  1386.     transition: 0.6s;
  1387. }
  1388.  
  1389. .audio-content {
  1390.     width:30%;
  1391.     padding:10%;
  1392.     position:relative;
  1393.     display: flex;
  1394.     justify-content: center;
  1395.     align-items: center;
  1396. }
  1397.  
  1398. .audio-content .audio_player {
  1399.     background-color: {color:posts};
  1400. }
  1401.  
  1402. .audio_player {
  1403.     position: absolute;
  1404.     z-index: 2;
  1405.     width: 70px;
  1406.     height: 70px;
  1407.     border-radius: 50%;
  1408. }
  1409.  
  1410. body.night .audio-content .audio_player {
  1411.     background-color: var(--question-background-night)!important;
  1412.     transition: 0.6s;
  1413. }
  1414.  
  1415. .audio_player > div {
  1416.     display: inline-block;
  1417.     margin: 0 0.5em 0 0;
  1418.     vertical-align: middle;
  1419. }
  1420.  
  1421. .custom_audio_buttons {
  1422.     height: 1.25em;
  1423. }
  1424. .custom_audio_buttons svg {
  1425.     width : 1.70em;
  1426.     height: 1.70em;
  1427.     margin-left: 24px;
  1428.     margin-top: 22px;
  1429.     stroke: {color:text};
  1430.     transition: 0.6s;
  1431. }
  1432.  
  1433. body.night .custom_audio_buttons svg {
  1434.     stroke: var(--text-night)!important;
  1435.     transition:.6s;
  1436. }
  1437.  
  1438. .custom_audio_error_icon svg {
  1439.     stroke: red;
  1440. }
  1441.  
  1442. .custom_audio_duration {
  1443.     display: inline;
  1444. }
  1445.  
  1446. .custom_audio_seekbar {
  1447.     height: 0.5em;
  1448.     border: 1px solid {color:text};
  1449.     margin-top: 20px;
  1450.     transition: 0.6s;
  1451. }
  1452.  
  1453. body.night .custom_audio_seekbar {
  1454.     border: 1px solid var(--accent-night)!important;
  1455.     transition:.6s;
  1456. }
  1457.  
  1458. .custom_audio_seekbar_progress {
  1459.     width: 0;
  1460.     height: 100%;
  1461.     background: {color:links};
  1462.     transition: 0.6s;
  1463. }
  1464.  
  1465. body.night .custom_audio_seekbar_progress {
  1466.     background: var(--links-night);
  1467.     transition: 0.6s;
  1468. }
  1469.  
  1470. .custom_audio_current_time, .custom_audio_time_left {
  1471.     font-size: 12px;
  1472. }
  1473.  
  1474. .custom_audio_time_left {
  1475.     float: right;
  1476. }
  1477.  
  1478. .audio_info p {
  1479.     margin: 0.25em 0;
  1480. }
  1481.  
  1482. .music_menu {
  1483.     margin:0px;
  1484.     padding:0px;
  1485.     list-style:none;
  1486.     padding: 5%;
  1487.     width: 55%;
  1488.     align-self: center;
  1489.     font-size:18px;
  1490.     font-weight: 700;
  1491.     color: {color:links};
  1492.     transition: 0.6s;
  1493. }
  1494.  
  1495. body.night .music_menu {
  1496.     color: var(--links-night)!important;
  1497.     transition: 0.6s;
  1498. }
  1499.  
  1500. .music_menu  p {
  1501.     margin: 5px 0;
  1502. }
  1503.  
  1504. .music_menu  p:nth-child(2) {
  1505.     font-weight: 400;
  1506.     font-size: 15px;
  1507. }
  1508.  
  1509. /*----------TUMBLR QUESTION/ANSWER----------*/
  1510.  
  1511. #askcont, #replycont {
  1512.     padding: 15px;
  1513.     display: flex;
  1514.     flex-direction: column;
  1515. }
  1516.  
  1517. #askcont img {
  1518.     float:left;
  1519.     display: inline-block;
  1520.     vertical-align: middle;
  1521.     margin-right: 20px;
  1522.     width: 40px;
  1523.     height: 40px;
  1524.     padding: 5px;
  1525.     border: 3px solid {color:accent};
  1526.     border-radius: 100%;
  1527.     transition: 0.6s;
  1528. }
  1529.  
  1530. body.night #askcont img {
  1531.     border: 3px solid var(--accent-night);
  1532.     transition: 0.6s;
  1533. }
  1534.  
  1535. #replycont img {
  1536.     float: right;
  1537.     display: inline-block;
  1538.     vertical-align: middle;
  1539.     margin-left: 20px;
  1540.     width: 40px;
  1541.     height: 40px;
  1542.     padding: 5px;
  1543.     border: 3px solid {color:accent};
  1544.     border-radius: 100%;
  1545.     transition: 0.6s;
  1546. }
  1547.  
  1548. body.night #replycont img {
  1549.     border: 3px solid var(--accent-night);
  1550.     transition: 0.6s;
  1551. }
  1552.  
  1553. #asker {
  1554.     text-transform: lowercase;
  1555.     color: {color:links};
  1556.     margin: 10px 0 20px;
  1557.     display: flex;
  1558.     transition: 0.6s;
  1559. }
  1560.  
  1561. body.night #asker {
  1562.     color: var(--links-night)!important;
  1563.     transition: 0.6s;
  1564. }
  1565.  
  1566. #asking, #replying {
  1567.     align-self: center;
  1568.     line-height: 20px;
  1569. }
  1570.  
  1571. #replier {
  1572.     text-transform: lowercase;
  1573.     color: {color:links};
  1574.     margin-bottom: 20px;
  1575.     display: flex;
  1576.     justify-content: flex-end;
  1577.     transition: 0.6s;
  1578. }
  1579.  
  1580. body.night #replier {
  1581.     color: var(--links-night)!important;
  1582.     transition: 0.6s;
  1583. }
  1584.  
  1585. #replying {
  1586.     text-align: right;
  1587. }
  1588.  
  1589. #asker a, #replier a {
  1590.     color: {color:links};
  1591.     font-weight: 700;
  1592.     font-size: 1.1em;
  1593.     transition: 0.6s;
  1594. }
  1595.  
  1596. #asker a:hover, #replier a:hover {
  1597.     color: {color:link hover};
  1598. }
  1599.  
  1600. body.night #asker a, body.night #replier a  {
  1601.     color: var(--links-night)!important;
  1602.     transition: 0.6s;
  1603. }
  1604.  
  1605. #asker a:hover, #replier a:hover {
  1606.     color: {color:links};
  1607.     transition: 0.6s;
  1608. }
  1609.  
  1610. body.night #asker a:hover , body.night #replier a:hover {
  1611.     color: var(--link-hover-night)!important;
  1612.     transition: 0.6s;
  1613. }
  1614.  
  1615. .asker-text, .replier-text {
  1616.     color: {color:text};
  1617.     transition: 0.6s;
  1618. }
  1619.  
  1620. body.night .asker-text, body.night .replier-text {
  1621.     color: var(--text-night)!important;
  1622.     transition: 0.6s;
  1623. }
  1624.  
  1625. .question {
  1626.     display: block;
  1627.     text-align: justify;
  1628.     padding: 10px 15px;
  1629.     background-color: {color:question background};
  1630.     color: {color:question};
  1631.     transition: 0.6s;
  1632. }
  1633.  
  1634. body.night .question {
  1635.     color: var(--question-night)!important;
  1636.     background-color: var(--question-background-night)!important;
  1637.     transition: 0.6s;
  1638. }
  1639.  
  1640. .answer {
  1641.     padding: 15px;
  1642.     background-color: {color:question background};
  1643.     color: {color:question};
  1644.     transition: 0.6s;
  1645. }
  1646.  
  1647. body.night .answer {
  1648.     color: var(--question-night)!important;
  1649.     background-color: var(--question-background-night)!important;
  1650.     transition: 0.6s;
  1651. }
  1652.  
  1653. .question p {margin: 0!important;}
  1654. .answer p {margin: 0!important;}
  1655. .asker-link {font-weight: 700;}
  1656.  
  1657. /*----------TUMBLR CHAT----------*/
  1658.  
  1659. .chatp {
  1660.     padding: 20px;
  1661. }
  1662.  
  1663. .chat .line {
  1664.     margin-top: 0px;
  1665.     padding: 20px;
  1666.     border-bottom: 1px solid {color:post borders};
  1667.     transition: 0.6s;
  1668. }
  1669.  
  1670. body.night .line {
  1671.     border-bottom: 1px solid var(--night-borders);
  1672. }
  1673.  
  1674. .chat .line:last-of-type {
  1675.     margin-bottom: 0px;
  1676.     border-bottom: none;
  1677. }
  1678.  
  1679. .chat .label {
  1680.     text-transform: capitalize;
  1681. }
  1682.  
  1683. .line:nth-child(odd) .label b {
  1684.     color: {color:chat odd};
  1685.     font-weight: 700;
  1686.     margin-right: 5px;
  1687.     font-size: 1.1em;
  1688.     transition: 0.6s;
  1689. }
  1690.  
  1691. body.night .line:nth-child(odd) .label b {
  1692.     color: var(--bold-night)!important;
  1693.     transition: 0.6s;
  1694. }
  1695.  
  1696. .line:nth-child(even) .label b {
  1697.     color: {color:chat even};
  1698.     font-weight: 700;
  1699.     margin-right: 5px;
  1700.     font-size: 1.1em;
  1701.     transition: 0.6s;
  1702. }
  1703.  
  1704. body.night .line:nth-child(even) .label b {
  1705.     color: var(--links-night)!important;
  1706.     transition: 0.6s;
  1707. }
  1708.  
  1709. /*----------LINK BAR----------*/
  1710.  
  1711. #top-bar {
  1712.     width: 100%;
  1713.     height: 80px;
  1714.     background-color: {color:posts};
  1715.     position: fixed;
  1716.     top: 0;
  1717.     padding: 10px 20px;
  1718.     box-sizing: border-box;
  1719.     z-index: 9;
  1720.     display: flex;
  1721.     align-items: center;
  1722.     border-bottom: 1px solid {color:post borders};
  1723.     transition: 0.6s;
  1724. }
  1725.  
  1726. body.night #top-bar {
  1727.     background-color: var(--posts-background-night)!important;
  1728.     border-bottom: 1px solid var(--night-borders);
  1729.     transition: 0.6s;
  1730. }
  1731.  
  1732. .daynight {
  1733.     margin-right: 20px;
  1734.     cursor: pointer;
  1735. }
  1736.  
  1737. .la-moon, .la-sun {
  1738.     font-size: 25px;
  1739.     border-radius: 100%;
  1740.     padding: 10px;
  1741.     background-color: {color:accent};
  1742.     color: {color:accented text};
  1743.     box-sizing: border-box;
  1744.     transition: 0.6s;
  1745. }
  1746.  
  1747. body.night .la-moon, body.night .la-sun {
  1748.     background-color: var(--accent-night)!important;
  1749.     color: var(--accented-text-night)!important;
  1750.     transition: 0.6s;
  1751. }
  1752.  
  1753. #top-title {
  1754.     font-size: 1.6em;
  1755.     text-transform: uppercase;
  1756.     font-weight: 700;
  1757.     letter-spacing: 1px;
  1758. }
  1759.  
  1760. #top-title:first-letter {
  1761.     color: {color:accent};
  1762.     transition: 0.6s;
  1763. }
  1764.  
  1765. body.night #top-title:first-letter {
  1766.     color: var(--accent-night);
  1767.     transition: 0.6s;
  1768. }
  1769.  
  1770. /*----------NAVIGATION LINKS----------*/
  1771.  
  1772. .morelinks {
  1773.     margin-left: 40px;
  1774. }
  1775.  
  1776. .morelinks a {
  1777.     display: inline-block;
  1778.     margin: 0 15px;
  1779.     font-weight: 700;
  1780.     color: {color:navigation};
  1781.     transition: 0.6s;
  1782. }
  1783.  
  1784. body.night ..morelinks a {
  1785.     color: var(--links-night)!important;
  1786.     transition: 0.6s;
  1787. }
  1788.  
  1789. .morelinks a:hover {
  1790.     color: {color:navigation hover};
  1791.     transition: 0.6s;
  1792. }
  1793.  
  1794. body.night .morelinks a:hover {
  1795.     color: var(--link-hover-night)!important;
  1796.     transition: 0.6s;
  1797. }
  1798.  
  1799. /*----------TUMBLR LINKS----------*/
  1800.  
  1801. .homelinks {
  1802.     position: absolute;
  1803.     right: -150px;
  1804.     top: -11px;
  1805. }
  1806.  
  1807. .la-home, .la-envelope, .la-calendar, .la-inbox {
  1808.     background-color: {color:permalink background};
  1809.     color: {color:permalink};
  1810.     padding: 5px;
  1811.     font-size: 18px;
  1812.     border-radius: 5px;
  1813.     transition: 0.6s;
  1814. }
  1815.  
  1816. body.night .la-home, body.night .la-envelope, body.night .la-calendar, body.night .la-inbox {
  1817.     background-color: var(--permalink-background-night)!important;
  1818.     color: var(--links-night)!important;
  1819.     transition: 0.6s;
  1820. }
  1821.  
  1822. /*----------SIDEBAR----------*/
  1823.  
  1824. #sidebar {
  1825.     width: 550px;
  1826.     height: 350px;
  1827.     position: fixed;
  1828.     margin-top: 60px;
  1829.     box-sizing: border-box;
  1830.     display: flex;
  1831.     justify-content: space-between;
  1832. }
  1833.  
  1834. .sidebar-cont {
  1835.     width: 350px;
  1836. }
  1837.  
  1838. .sidebar-title {
  1839.     font-size: 2.0em;
  1840.     color: {color:sidebar title};
  1841.     font-weight: 700;
  1842.     position: absolute;
  1843.     margin-left: 36%;
  1844.     margin-top: 15%;
  1845.     transition:.6s;
  1846. }
  1847.  
  1848. body.night .sidebar-title {
  1849.     color: var(--sidebar-title-night)!important;
  1850.     transition: 0.6s;
  1851. }
  1852.  
  1853. #title-line {
  1854.     width: 200px;
  1855.     height: 10px;
  1856.     background-color: {color:accent};
  1857.     position: absolute;
  1858.     top: 55px;
  1859.     transition: 0.6s;
  1860. }
  1861.  
  1862. body.night #title-line {
  1863.     background-color: var(--accent-night)!important;
  1864.     transition: 0.6s;
  1865. }
  1866.  
  1867. .sidebar-image {
  1868.     width: 180px;
  1869.     height: 330px;
  1870.     overflow: hidden;
  1871.     border: 10px solid {color:accent};
  1872.     background-color: {color:accent};
  1873.     box-sizing: border-box;
  1874.     border-radius: 90px;
  1875.     transition: 0.6s;
  1876. }
  1877.  
  1878. .sidebar-image img {
  1879.     width: 100%;
  1880.     height: 100%;
  1881. }
  1882.  
  1883. body.night .sidebar-image {
  1884.     background-color: var(--accent-night)!important;
  1885.     border: 10px solid var(--accent-night)!important;
  1886.     transition: 0.6s;
  1887. }
  1888.  
  1889. .sidebar-description {
  1890.     position: absolute;
  1891.     bottom: 0;
  1892.     background-color: {color:posts};
  1893.     color: {color:sidebar description};
  1894.     text-align: {select:description text align};
  1895.     padding: 20px;
  1896.     box-sizing: border-box;
  1897.     transition:.6s;
  1898.     border: 1px solid {color:post borders};
  1899.     height: 165px;
  1900.     overflow: auto;
  1901.     margin-left: -4px;
  1902.     transition: 0.6s;
  1903. }
  1904.  
  1905. body.night .sidebar-description {
  1906.     color: var(--text-night)!important;
  1907.     background-color: var(--posts-background-night)!important;
  1908.     border: 1px solid var(--night-borders);
  1909.     transition: 0.6s;
  1910. }
  1911.  
  1912. /*----------THEME CREDIT/DO NOT REMOVE!!!---------*/
  1913.  
  1914. #bottom {
  1915.     bottom: 40px;
  1916.     position: fixed;
  1917.     right: 40px;
  1918.     z-index: 99;
  1919.     display: flex;
  1920. }
  1921.  
  1922. body.night .cred {
  1923.     background-color: var(--accent-night);
  1924.     color: var(--accented-text-night)!important;
  1925. }
  1926.  
  1927. .la-arrow-circle-up, .la-copyright {
  1928.     padding: 3px;
  1929.     font-size: 22px;
  1930.     width: 22px;
  1931.     height: 22px;
  1932.     margin: 0 2px;
  1933.     background-color: {color:accent};
  1934.     color: {color:accented text};
  1935.     transition: 0.6s;
  1936. }
  1937.  
  1938. body.night .la-arrow-circle-up, body.night .la-copyright {
  1939.     background-color: var(--accent-night);
  1940.     color: var(--accented-text-night)!important;
  1941.     transition: 0.6s;
  1942. }
  1943.  
  1944. /*----------SCROLL TO TOP---------*/
  1945.  
  1946. #scrollToTop:link,
  1947. #scrollToTop:visited {
  1948.     display: none;
  1949.     font-size: 12px;
  1950.     color: var(--accented-text);
  1951.     padding: 0px 5px;
  1952.     width: auto;
  1953.     z-index: 900;
  1954.     font-weight: 700;
  1955. }
  1956.  
  1957. {CustomCSS}
  1958. </style>
  1959.  
  1960. <!-----------Scroll To Top Script----------->
  1961. <script type="text/javascript" src="https://static.tumblr.com/ikeq9mi/DfYl6o46t/scrolltotop.min.js"></script>
  1962. <!-----------Scroll To Top Script----------->
  1963.  
  1964. <script>
  1965. $(document).ready(function(){
  1966.    
  1967.     //TOGGLE NIGHT MODE SCRIPT
  1968.       $('.daynight').click(function(){
  1969.          $('body').toggleClass('night');
  1970.          $('.daynight i').toggleClass('la-sun');
  1971.       });
  1972. });
  1973. </script>
  1974.  
  1975. </head>
  1976.  
  1977. <body>
  1978.  
  1979. <footer id="bottom">
  1980.  
  1981. <!-----------SCROLL TO TOP ----------->
  1982. <a href="javascript:;" id="scrollToTop" rel="nofollow" title="scroll to top"><i class="las la-arrow-circle-up"></i></a>
  1983. <!-----------SCROLL TO TOP ----------->
  1984.  
  1985. <!-------------------DO NOT REMOVE THEME CREDIT!!!------------------->
  1986.  <a href="https://sheathemes.tumblr.com" target="_blank" title="theme by sheathemes"><i class="las la-copyright"></i></a>  
  1987. <!-------------------DO NOT REMOVE THEME CREDIT!!!------------------->
  1988. </footer>
  1989.  
  1990. <div class="cage"> <!-----------BLOG CONTAINER----------->
  1991.  
  1992. <div id="top-bar">
  1993. <div class="daynight"><i class="las la-moon"></i></div>
  1994. <div id="top-title"><a href="/">{text:topbar title}</a></div>
  1995.     <nav class="morelinks"> <!-----------NAVIGATION LINKS----------->
  1996.     {block:ifLink1}<a href="{text:CustomLink1URL}">{text:CustomLink1Name}</a>{/block:ifLink1}
  1997.     {block:ifLink2}<a href="{text:CustomLink2URL}">{text:CustomLink2Name}</a>{/block:ifLink2}
  1998.     {block:ifLink3}<a href="{text:CustomLink3URL}">{text:CustomLink3Name}</a>{/block:ifLink3}
  1999.     {block:ifLink4}<a href="{text:CustomLink4URL}">{text:CustomLink4Name}</a>{/block:ifLink4}
  2000.     {block:ifLink5}<a href="{text:CustomLink5URL}">{text:CustomLink5Name}</a>{/block:ifLink5}
  2001.     {block:ifLink6}<a href="{text:CustomLink6URL}">{text:CustomLink6Name}</a>{/block:ifLink6}
  2002.     </nav> <!-----------NAVIGATION LINKS----------->
  2003. </div>
  2004.  
  2005. <div class="wrap"> <!-----------POST CONTAINER----------->
  2006.  
  2007. <aside id="sidebar"> <!-----------SIDEBAR----------->
  2008. <div class="sidebar-image"><img src="{image:sidebar}"></div>
  2009.         <div class="sidebar-title">{Title}<div id="title-line">
  2010.             <nav class="homelinks"> <!-----------TUMBLR LINKS----------->
  2011.                 <a href="/" title="home"><i class="las la-home"></i></a>
  2012.                 <a href="/ask" title="inbox"><i class="las la-envelope"></i></a>
  2013.                 <a href="/archive" title="archive"><i class="las la-calendar"></i></a>
  2014.                 <a href="/submit" title="submit"><i class="las la-inbox"></i></a>
  2015.             </nav> <!-----------TUMBLR LINKS----------->
  2016.         </div></div>
  2017.     <div class="sidebar-cont">
  2018.         <div class="sidebar-description">{Description}</div>
  2019.     </div>
  2020. </aside> <!-----------SIDEBAR----------->
  2021.  
  2022. <section id="content"> <!-----------POST WRAPPER----------->
  2023.  
  2024. {block:posts inlineMediaWidth="1280" inlineNestedMediaWidth="1280"}
  2025.  
  2026. <article class="posts" id="{PostID}" post-type="{PostType}"> <!-----------POSTS----------->
  2027.  
  2028. {block:IndexPage}
  2029. <div class="src-box"> <!-----------REBLOGGED / SOURCE----------->
  2030. <div class="src">
  2031. {block:RebloggedFrom}
  2032.     <a href="{ReblogParentURL}" title="{ReblogParentName}"><img src="{ReblogParentPortraitURL-64}"></a>
  2033.     <a href="{ReblogRootURL}" title="{ReblogRootName}"><img src="{ReblogRootPortraitURL-64}"></a>
  2034. {/block:RebloggedFrom}
  2035. {block:NotReblog}
  2036. <a href="{Permalink}" title="{Name}"><img src="{PortraitURL-40}"></a>{/block:NotReblog}
  2037. {block:PinnedPostLabel}<a href="{Permalink}" title="{PinnedPostLabel}"><i class="las la-thumbtack"></i></a>{/block:PinnedPostLabel}
  2038. </div></div> <!-----------REBLOGGED / SOURCE----------->
  2039. {/block:IndexPage}
  2040.  
  2041. {block:ContentSource}
  2042. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  2043. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  2044. {/block:SourceLogo}
  2045. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  2046. {/block:ContentSource}
  2047.  
  2048. <!-- {block:NoRebloggedFrom}
  2049. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  2050. {/block:NoRebloggedFrom} -->
  2051.  
  2052. {block:Text}
  2053. <div class="text">
  2054. {block:Title}<div class="title">{Title}</div>{/block:Title}
  2055. <div class="caption">{block:NotReblog} <figcaption> {Body} </figcaption> {/block:NotReblog} {block:RebloggedFrom} <div class="reblog-list">
  2056.  
  2057. {block:Reblogs}
  2058. <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}">
  2059. <div class="source-head">
  2060. <div class="reblog-header">
  2061.  
  2062. {block:IsActive} <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank"> <img src="{PortraitURL-64}"> </a> {/block:IsActive}
  2063.  
  2064. {block:IsDeactivated} <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}"> <img src="{PortraitURL-64}"> </span> {/block:IsDeactivated} {block:IsActive} <a target="_blank" href="{Permalink}" class="user"> {Username} </a> {/block:IsActive}
  2065.  
  2066. {block:IsDeactivated} <span class="inactive deactivated">{Username} </span> {/block:IsDeactivated} </div> <div class="reblog-content"> {Body} </div> </div> </div>{/block:Reblogs} </div> {/block:RebloggedFrom} </div>
  2067. </div>
  2068. {/block:Text}
  2069.  
  2070. {block:Photo}
  2071. <div class="photo">
  2072. {LinkOpenTag}
  2073. <a href="#" onclick="Tumblr.Lightbox.init([{ width: {PhotoWidth-HighRes}, height: {PhotoHeight-HighRes}, low_res: '{PhotoURL-500}', high_res: '{PhotoURL-HighRes}' }]); $('body').toggleClass('tumblr_lightbox_active'); return false">
  2074. <center><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"></center>
  2075. </a>
  2076. {LinkCloseTag}
  2077. </div>
  2078. {block:IfShowCaptions}
  2079. {block:Caption} <div class="caption"> {block:NotReblog} <figcaption> {Caption} </figcaption> {/block:NotReblog} {block:RebloggedFrom} <div class="reblog-list">
  2080.  
  2081. {block:Reblogs} <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}"> <div class="reblog-header">
  2082.  
  2083. {block:IsActive} <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank"> <img src="{PortraitURL-64}"> </a> {/block:IsActive}
  2084.  
  2085. {block:IsDeactivated} <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}"> <img src="{PortraitURL-64}"> </span> {/block:IsDeactivated}
  2086.  
  2087. {block:IsActive} <a target="_blank" href="{Permalink}" class="user">{Username} </a> {/block:IsActive}
  2088.  
  2089. {block:IsDeactivated} <span class="inactive deactivated">{Username} </span> {/block:IsDeactivated} </div> <div class="reblog-content"> {Body} </div> </div> {/block:Reblogs} </div> {/block:RebloggedFrom} </div> {/block:Caption}
  2090. {/block:IfShowCaptions}
  2091.  
  2092. {block:IfnotShowCaptions}
  2093. {block:PermalinkPage}
  2094. {block:Caption} <div class="caption"> {block:NotReblog} <figcaption> {Caption} </figcaption> {/block:NotReblog} {block:RebloggedFrom} <div class="reblog-list">
  2095.  
  2096. {block:Reblogs} <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}"> <div class="reblog-header">
  2097.  
  2098. {block:IsActive} <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank"> <img src="{PortraitURL-64}"> </a> {/block:IsActive}
  2099.  
  2100. {block:IsDeactivated} <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}"> <img src="{PortraitURL-64}"> </span> {/block:IsDeactivated}
  2101.  
  2102. {block:IsActive} <a target="_blank" href="{Permalink}" class="user">{Username} </a> {/block:IsActive}
  2103.  
  2104. {block:IsDeactivated} <span class="inactive deactivated">{Username} </span> {/block:IsDeactivated} </div> <div class="reblog-content"> {Body} </div> </div> {/block:Reblogs} </div> {/block:RebloggedFrom} </div> {/block:Caption}
  2105. {/block:PermalinkPage}
  2106. {/block:IfnotShowCaptions}
  2107. {/block:Photo}
  2108.  
  2109. {block:Photoset}
  2110. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div>
  2111. {block:IfShowCaptions}
  2112. {block:Caption}
  2113. <div class="caption"> {block:NotReblog} <figcaption> {Caption} </figcaption> {/block:NotReblog} {block:RebloggedFrom}
  2114. <div class="reblog-list">
  2115.  
  2116. {block:Reblogs}
  2117. <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}"> <div class="reblog-header">
  2118. {block:IsActive} <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank"> <img src="{PortraitURL-64}"> </a> {/block:IsActive}
  2119.  
  2120. {block:IsDeactivated} <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}"> <img src="{PortraitURL-64}"> </span> {/block:IsDeactivated}
  2121.  
  2122. {block:IsActive}
  2123. <a target="_blank" href="{Permalink}" class="user">{Username} </a> {/block:IsActive}
  2124.  
  2125. {block:IsDeactivated}
  2126. <span class="inactive deactivated">{Username} </span> {/block:IsDeactivated}
  2127. </div>
  2128. <div class="reblog-content"> {Body}</div></div> {/block:Reblogs} </div>
  2129. {/block:RebloggedFrom} </div>
  2130. {/block:Caption}
  2131. {/block:IfShowCaptions}
  2132.  
  2133. {block:IfnotShowCaptions}
  2134. {block:PermalinkPage}
  2135. {block:Caption}
  2136. <div class="caption"> {block:NotReblog} <figcaption> {Caption} </figcaption> {/block:NotReblog} {block:RebloggedFrom}
  2137. <div class="reblog-list">
  2138.  
  2139. {block:Reblogs}
  2140. <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}"> <div class="reblog-header">
  2141. {block:IsActive} <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank"> <img src="{PortraitURL-64}"> </a> {/block:IsActive}
  2142.  
  2143. {block:IsDeactivated} <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}"> <img src="{PortraitURL-64}"> </span> {/block:IsDeactivated}
  2144.  
  2145. {block:IsActive}
  2146. <a target="_blank" href="{Permalink}" class="user">{Username} </a> {/block:IsActive}
  2147.  
  2148. {block:IsDeactivated}
  2149. <span class="inactive deactivated">{Username} </span> {/block:IsDeactivated}
  2150. </div>
  2151. <div class="reblog-content"> {Body}</div></div> {/block:Reblogs} </div>
  2152. {/block:RebloggedFrom} </div>
  2153. {/block:Caption}
  2154. {/block:PermalinkPage}
  2155. {/block:IfnotShowCaptions}
  2156. {/block:Photoset}
  2157.  
  2158. {block:Quote}
  2159. <div class="qt">
  2160. <div class="quote-box"><i class="las la-quote-right"></i></div>
  2161. <div class="quote">
  2162. {Quote}
  2163. </div>
  2164. </div>
  2165. {block:Source}<div class="qtsource"><br><center>~ {Source}</center></div>{/block:Source}
  2166. {/block:Quote}
  2167.  
  2168. {block:Link}
  2169. <div class="link"><a href="{URL}">{Name} »</a></div>
  2170. {block:Description}
  2171. <div class="caption">{block:NotReblog} <figcaption> {Description} </figcaption> {/block:NotReblog} {block:RebloggedFrom} <div class="reblog-list">
  2172.  
  2173. {block:Reblogs} <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}"> <div class="reblog-header">
  2174.  
  2175. {block:IsActive} <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank"> <img src="{PortraitURL-64}"> </a> {/block:IsActive}
  2176.  
  2177. {block:IsDeactivated} <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}"> <img src="{PortraitURL-64}"> </span> {/block:IsDeactivated} {block:IsActive} <a target="_blank" href="{Permalink}" class="user"> {Username} </a> {/block:IsActive}
  2178.  
  2179. {block:IsDeactivated} <span class="inactive deactivated">{Username} </span> {/block:IsDeactivated} </div> <div class="reblog-content"> {Body} </div> </div> {/block:Reblogs} </div> {/block:RebloggedFrom} </div>
  2180. {/block:Description}
  2181. {/block:Link}
  2182.  
  2183. {block:Audio}
  2184. <div class="audiop">
  2185. <div class="audiowrapper">
  2186. {block:AudioPlayer}
  2187. {AudioPlayer}
  2188. <div class="audio-content" style="{block:AlbumArt} background:url({AlbumArtURL}); {/block:AlbumArt} -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;">
  2189.     <div class="audio_player">
  2190.         <span class="custom_audio_buttons"></span>
  2191.     </div>
  2192. </div>
  2193. <div class="music_menu">
  2194. {block:TrackName}<p><span class="info">{TrackName}</span></p>{/block:TrackName}
  2195. {block:Artist}<p><span class="info">{Artist}</span></p>{/block:Artist}
  2196.     <div class="custom_audio_seekbar"></div>
  2197.     <span class="custom_audio_current_time"></span>
  2198.     <span class="custom_audio_time_left"></span>
  2199. </div>
  2200. {/block:AudioPlayer}
  2201. </div>
  2202. </div>
  2203.  
  2204. {block:IfShowCaptions}
  2205. {block:Caption} <div class="caption"> {block:NotReblog} <figcaption> {Caption} </figcaption> {/block:NotReblog} {block:RebloggedFrom} <div class="reblog-list">
  2206.  
  2207. {block:Reblogs} <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}"> <div class="reblog-header">
  2208.  
  2209. {block:IsActive} <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank"> <img src="{PortraitURL-64}"> </a> {/block:IsActive}
  2210.  
  2211. {block:IsDeactivated} <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}"> <img src="{PortraitURL-64}"> </span> {/block:IsDeactivated}
  2212.  
  2213. {block:IsActive} <a target="_blank" href="{Permalink}" class="user">{Username} </a> {/block:IsActive}
  2214.  
  2215. {block:IsDeactivated} <span class="inactive deactivated">{Username} </span> {/block:IsDeactivated} </div> <div class="reblog-content"> {Body} </div> </div> {/block:Reblogs} </div> {/block:RebloggedFrom} </div> {/block:Caption}
  2216. {/block:IfShowCaptions}
  2217.  
  2218. {block:IfnotShowCaptions}
  2219. {block:PermalinkPage}
  2220. {block:Caption} <div class="caption"> {block:NotReblog} <figcaption> {Caption} </figcaption> {/block:NotReblog} {block:RebloggedFrom} <div class="reblog-list">
  2221.  
  2222. {block:Reblogs} <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}"> <div class="reblog-header">
  2223.  
  2224. {block:IsActive} <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank"> <img src="{PortraitURL-64}"> </a> {/block:IsActive}
  2225.  
  2226. {block:IsDeactivated} <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}"> <img src="{PortraitURL-64}"> </span> {/block:IsDeactivated}
  2227.  
  2228. {block:IsActive} <a target="_blank" href="{Permalink}" class="user">{Username} </a> {/block:IsActive}
  2229.  
  2230. {block:IsDeactivated} <span class="inactive deactivated">{Username} </span> {/block:IsDeactivated} </div> <div class="reblog-content"> {Body} </div> </div> {/block:Reblogs} </div> {/block:RebloggedFrom} </div> {/block:Caption}
  2231. {/block:PermalinkPage}
  2232. {/block:IfnotShowCaptions}
  2233. {/block:Audio}
  2234.  
  2235. {block:Video}
  2236. <div class="video">{Video-500}</div>
  2237. {block:IfShowCaptions}
  2238. {block:Caption} <div class="caption"> {block:NotReblog} <figcaption> {Caption} </figcaption> {/block:NotReblog} {block:RebloggedFrom} <div class="reblog-list">
  2239.  
  2240. {block:Reblogs} <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}"> <div class="reblog-header">
  2241.  
  2242. {block:IsActive} <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank"> <img src="{PortraitURL-64}"> </a> {/block:IsActive}
  2243.  
  2244. {block:IsDeactivated} <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}"> <img src="{PortraitURL-64}"> </span> {/block:IsDeactivated}
  2245.  
  2246. {block:IsActive} <a target="_blank" href="{Permalink}" class="user">{Username} </a> {/block:IsActive}
  2247.  
  2248. {block:IsDeactivated} <span class="inactive deactivated">{Username} </span> {/block:IsDeactivated}
  2249.  
  2250. </div> <div class="reblog-content"> {Body} </div> </div> {/block:Reblogs} </div> {/block:RebloggedFrom} </div> {/block:Caption}
  2251. {/block:IfShowCaptions}
  2252.  
  2253. {block:IfnotShowCaptions}
  2254. {block:PermalinkPage}
  2255. {block:Caption} <div class="caption"> {block:NotReblog} <figcaption> {Caption} </figcaption> {/block:NotReblog} {block:RebloggedFrom} <div class="reblog-list">
  2256.  
  2257. {block:Reblogs} <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}"> <div class="reblog-header">
  2258.  
  2259. {block:IsActive} <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank"> <img src="{PortraitURL-64}"> </a> {/block:IsActive}
  2260.  
  2261. {block:IsDeactivated} <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}"> <img src="{PortraitURL-64}"> </span> {/block:IsDeactivated}
  2262.  
  2263. {block:IsActive} <a target="_blank" href="{Permalink}" class="user">{Username} </a> {/block:IsActive}
  2264.  
  2265. {block:IsDeactivated} <span class="inactive deactivated">{Username} </span> {/block:IsDeactivated}
  2266.  
  2267. </div> <div class="reblog-content"> {Body} </div> </div> {/block:Reblogs} </div> {/block:RebloggedFrom} </div> {/block:Caption}
  2268. {/block:PermalinkPage}
  2269. {/block:IfnotShowCaptions}
  2270. {/block:Video}
  2271.  
  2272. {block:Chat}
  2273. {block:Title}<div class="title">{Title}</div>{/block:Title}
  2274. <div class="chatp">
  2275. <div class="chat">{block:Lines}<div class="line">{block:Label}<span class="label"><b>{Label}</b></span><br><br>{/block:Label}
  2276. {Line}</div>{/block:Lines}</div>
  2277. </div>
  2278. {/block:Chat}
  2279.  
  2280. {block:Answer}
  2281. <div id="askcont">
  2282. <div id="asker">
  2283. <img src="{AskerPortraitURL-128}">
  2284. <div id="asking">
  2285. <div class="asker-link">{Asker}</div>
  2286. <div class="asker-text">asked a question</div>
  2287. </div>
  2288. </div>
  2289. <div class="question">{Question}</div>
  2290. </div>
  2291.  
  2292. {block:Answerer}
  2293. <div id="replycont">
  2294. <div id="replier">
  2295. <div id="replying">
  2296. <div class="replier-link">{Answerer}</div>
  2297. <div class="replier-text">replied to your question</div>
  2298. </div>
  2299. <img src="{AnswererPortraitURL-128}">
  2300. </div>
  2301. <div class="answer">{Answer}</div>
  2302. </div>
  2303. {/block:Answerer}
  2304.  
  2305. {block:NotReblog}  <div class="caption"><figcaption> {Answer} </figcaption> </div> {/block:NotReblog}
  2306. {block:RebloggedFrom} <div class="reblog-list">
  2307. {block:Reblogs} <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}"> <div class="reblog-header">
  2308.  
  2309. {block:IsActive} <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank"> <img src="{PortraitURL-64}"> </a> {/block:IsActive}
  2310.  
  2311. {block:IsDeactivated} <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}"> <img src="{PortraitURL-64}"> </span> {/block:IsDeactivated}
  2312.  
  2313. {block:IsActive} <a target="_blank" href="{Permalink}" class="user">{Username} </a> {/block:IsActive}
  2314.  
  2315. {block:IsDeactivated} <span class="inactive deactivated">{Username} </span> {/block:IsDeactivated} </div>
  2316.  
  2317. <div class="reblog-content">{Body} </div> </div> {/block:Reblogs} </div> {/block:RebloggedFrom}
  2318. {/block:Answer}
  2319.  
  2320. {block:IndexPage}
  2321. {block:Date}
  2322. <div class="time"> <!-----------POST INFO & PERMALINKS----------->
  2323. <div id="date-box">
  2324.     {block:Date}
  2325.     <a href="{Permalink}" title="{TimeAgo}"> {ShortMonth} <span>{DayOfMonth}{DayOfMonthSuffix}</span></a>
  2326.     {/block:Date}
  2327. </div>
  2328.  
  2329. {block:NoteCount}
  2330. <div class="note-count"><a href="{Permalink}"><i class="las la-chart-bar"></i>{NoteCount}</a></div>{/block:NoteCount}
  2331.  
  2332. <div class="controls">  
  2333. <a href="{ReblogURL}" target="_blank" title="reblog this post" class="reblog"><i class="las la-sync"></i></a>
  2334. <a title="like this post" class="like">{LikeButton size="15"}<i class="las la-grin-hearts"></i></a>
  2335. </div>  
  2336.  
  2337. </div> <!-----------POST INFO & PERMALINKS----------->
  2338. {/block:Date}
  2339. {/block:IndexPage}
  2340.  
  2341. {block:IndexPage}
  2342.  {block:HasTags} <!-----------POST TAGS----------->
  2343. <div class="post_tags draggable">
  2344. <div class="post_tags_inner">{block:Tags}
  2345. <a href="{TagURL}"><i class="las la-tag"></i>{Tag}</a>{/block:Tags}</div></div>
  2346. {/block:HasTags} <!-----------POST TAGS----------->
  2347. {/block:IndexPage}
  2348.  
  2349. </article> <!-----------POSTS----------->
  2350.  
  2351. <!-----------PERMALINK PAGE----------->
  2352. {block:PermalinkPage}
  2353. {block:Date}
  2354. <div id="perma">
  2355. <span>
  2356. Posted {ShortMonth} {DayOfMonthWithZero}, {Year} @ {12Hour} {AmPm}
  2357. {block:NoteCount}with {NoteCountWithLabel}{/block:NoteCount}
  2358. </span>
  2359.  
  2360. {block:RebloggedFrom}
  2361. <div class="rb">
  2362. <a class="via" href="{ReblogParentURL}" title="{ReblogParentName}"><img src="{ReblogParentPortraitURL-16}"></a>
  2363. <a class="root" href="{ReblogRootURL}" title="{ReblogRootName}"><img src="{ReblogRootPortraitURL-16}"></a>
  2364. </div>
  2365. {/block:RebloggedFrom}
  2366.  
  2367. </div>
  2368.  
  2369. {block:HasTags}
  2370. <div id="permatg">
  2371. {block:Tags}<a href="{TagURL}" title="Tagged as">#{Tag}</a> {/block:Tags}
  2372. </div>
  2373. {/block:HasTags}
  2374.  
  2375. {block:PostNotes}
  2376. <div id="notecontainer">{PostNotes}</div>
  2377. {/block:PostNotes}
  2378.  
  2379. {block:PermalinkPagination}
  2380. <div id="permpage">
  2381.     {block:NextPost}
  2382.         <a href="{NextPost}" title="Previous Post"><i class="las la-angle-double-left"></i></a>
  2383.     {/block:NextPost}
  2384.    
  2385.     {block:PreviousPost}
  2386.         <a href="{PreviousPost}" title="Next Post"><i class="las la-angle-double-right"></i></a>
  2387.     {/block:PreviousPost}
  2388. </div>
  2389. {/block:PermalinkPagination}
  2390. {/block:Date}
  2391. {/block:PermalinkPage}
  2392. <!-----------PERMALINK PAGE----------->
  2393. {/block:Posts}
  2394.  
  2395. {block:IndexPage}
  2396. <footer id="pagination"> <!-----------PAGINATION----------->
  2397. {block:Pagination}
  2398. {block:PreviousPage}
  2399. <a href="{PreviousPage}">Prev</a>
  2400. {/block:PreviousPage}
  2401. {block:JumpPagination length="3"}
  2402. {block:CurrentPage}
  2403. <span class="current_page">{CurrentPage}</a></span>
  2404. {/block:CurrentPage}
  2405. {block:JumpPage}
  2406. <a class="jump_page" href="{URL}">{PageNumber}</a>
  2407. {/block:JumpPage}
  2408. {/block:JumpPagination}
  2409. {block:NextPage}
  2410. <a href="{NextPage}">Next</a>
  2411. {/block:NextPage}
  2412. {/block:Pagination}
  2413. </footer> <!-----------PAGINATION----------->
  2414. {/block:IndexPage}
  2415.  
  2416. </section><!------------------POSTS WRAPPER----------------------->
  2417.  
  2418. </div>  <!--------- POSTS CONTAINER ----------->
  2419.  
  2420. </div> <!--------- BLOG CONTAINER ----------->
  2421.  
  2422. <!-------------------SCRIPTS/JQUERY (PART TWO)------------------->
  2423.  
  2424. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  2425.  
  2426. <!-----------Pixel Union photosets script----------->
  2427. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  2428. <script src="https://static.tumblr.com/yxfeliq/hHwojmt8m/bctphotoset.min.js"></script>
  2429. <!-----------Pixel Union photosets script----------->
  2430.  
  2431. <!-----------Video resizing script shythemes @ tumblr----------->
  2432. <script src="https://static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  2433. <!-----------Video resizing script shythemes @ tumblr----------->
  2434.  
  2435. <!-----------Tooltips Script----------->
  2436. <script src="https://unpkg.com/popper.js@1"></script> <script src="https://unpkg.com/tippy.js@5/dist/tippy-bundle.iife.js"></script> <link rel="stylesheet" href="https://unpkg.com/tippy.js@5/dist/svg-arrow.css" />
  2437. <!-----------Tooltips Script----------->
  2438.  
  2439. <!-----------NPF photosets script by annasthms @ tumblr----------->
  2440. <script src="https://static.tumblr.com/0podkko/qWqq8va08/photosets.js"></script>
  2441. <!-----------NPF photosets script by annasthms @ tumblr----------->
  2442.  
  2443. <!-----------customaudio.js script by annasthms @ tumblr----------->
  2444. <script src="https://cdn.jsdelivr.net/gh/annasthms/customaudio@latest/customaudio.min.js"></script>
  2445. <!-----------customaudio.js script by annasthms @ tumblr----------->
  2446.  
  2447. <script src="https://unpkg.com/feather-icons"></script>
  2448.  
  2449. <script>
  2450. $(document).ready(function(){
  2451.     //NPF photosets script by annasthms
  2452.     undoPhotoset({
  2453.         'posts': '.text',
  2454.         'text class': 'caption',
  2455.         'photoset class': 'photoset'
  2456.     },true);
  2457.     //pxu photosets by @ shythemes & bychloethemes
  2458.    $('.photo-slideshow').pxuPhotoset({
  2459.        lightbox: true,
  2460.        rounded: false,
  2461.        gutter: '{select:photoset gutter}px',
  2462.        photoset: '.photo-slideshow',
  2463.        photoWrap: '.photo-data',
  2464.        photo: '.pxu-photo'
  2465.    });
  2466.     //Tippy.js
  2467.         tippy('a[title]', {
  2468.             theme: 'custom',
  2469.             arrow: tippy.roundArrow,
  2470.             zIndex: 9999999999,
  2471.             placement: 'auto',
  2472.             maxWidth: 300,
  2473.             content(reference) {
  2474.                 const title = reference.getAttribute('title');
  2475.                 reference.removeAttribute('title'); return title; },
  2476.            
  2477.         });
  2478.     //mini spotify player by glenthemes @ tumblr    
  2479. var spotsongs = document.querySelectorAll("iframe[src*='open.spotify.com'][src*='track'], figure[data-npf*='open.spotify.com'][data-npf*='track']");
  2480.  
  2481. Array.prototype.forEach.call(spotsongs,function(minitrack){
  2482.    minitrack.setAttribute("height","80");
  2483.     });
  2484.     //customaudio.js script by annasthms @ tumblr
  2485.     customAudio({
  2486.     post: ".posts",
  2487.     wrappers: {
  2488.         audio: ".custom_audio_wrapper",
  2489.         buttons: ".custom_audio_buttons",
  2490.         duration: ".custom_audio_duration",
  2491.         timeCurrent: ".custom_audio_current_time",
  2492.         timeLeft: ".custom_audio_time_left",
  2493.         seekbar: ".custom_audio_seekbar"
  2494.     },
  2495.     default: false,
  2496.     pauseAll: true,
  2497.     playButton: "<i data-feather='play'></i>",
  2498.     pauseButton: "<i data-feather='pause'></i>",
  2499.     errorIcon: "<i data-feather='x'></i>",
  2500.     hideInfoIfError: true,
  2501.     callAfterLoad: () => {
  2502.         feather.replace();
  2503.     }
  2504. });
  2505.    
  2506. });
  2507. </script>
  2508.  
  2509. <!-----------Draggable Tags Script----------->
  2510. <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
  2511. <script src="https://static.tumblr.com/pbhn8p5/OSRos9gz8/draggabletags.js"></script>
  2512. <!-----------Draggable Tags Script----------->
  2513.  
  2514. <!-------------------SCRIPTS/JQUERY (PART TWO)------------------->
  2515.  
  2516. </body>
  2517. </html> <!---------------------------END--------------------------->
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement