API tools faq
paste
Advertisement
glenthemes

Theme [06]: Determination

glenthemes
Feb 5th, 2019 (edited)
30,347
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 54.10 KB | None | 0 0
raw download clone embed print report
  1. <!-----------------------------------------------------------------------
  2. Theme [06]: Determination
  3. Made by glenthemes
  4.  
  5. Initial release: 2015/08/29
  6. Remake date: 2019/02/05
  7. Last updated: 2023/07/27
  8.  
  9. What's new:
  10. ✱ NPF audio post support
  11. ✱ improved NPF post types detection
  12.  
  13. TERMS OF USE:
  14. 1) Do not remove the theme credit.
  15. 2) Do not repost/redistribute my themes.
  16. 3) Do not take parts of the code and use it as your own.
  17. 4) Do not use my themes as a base code.
  18. 5) Do not integrate my codes together.
  19.  
  20. I worked on this for 20 hours straight on no sleep nor caffeine so if you wanna support this dumb bitch then feel free to drop me a donation
  21.  
  22. ko-fi.com/glenthemes
  23.  
  24. --- Credits:
  25.  
  26. Images:
  27. - sidebar animation: Waterstride-Sunrise @ DeviantArt
  28. - corner image: @pixelins
  29.  
  30. Fonts:
  31. - 'PixelOperator Bold' by Jayvee Enaguas @ dafont
  32. - 'Silkscreen' by Jason Aleksandr Kottke @ dafont
  33.  
  34. Icon font:
  35. - LinearIcons by Perxis
  36.  
  37. Music:
  38. - NieR: Automata OST - Peaceful Sleep (music box)
  39.  
  40. Inspiration:
  41. - Undertale UI and old Windows OS UI
  42. ------------------------------------------------------------------------>
  43.  
  44. <!DOCTYPE html>
  45. <html lang="en">
  46.  
  47. <head>
  48.  
  49. <title>{Title}</title>
  50.  
  51. <link rel="shortcut icon" href="{Favicon}">
  52.  
  53. <!--------------------JAVASCRIPTS-------------------->
  54. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  55. <script src="//static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  56. <script>
  57. (function($){
  58. $(document).ready(function(){
  59. $("a[title]").style_my_tooltips({
  60. tip_follows_cursor:true,
  61. tip_delay_time:50,
  62. tip_fade_speed:0,
  63. attribute:"title"
  64. });
  65. });
  66. })(jQuery);
  67. </script>
  68.  
  69. <script>
  70. $(document).ready(function() {
  71. $('iframe.tumblr_audio_player').load( function() {
  72. $('iframe.tumblr_audio_player').contents().find("head")
  73. .append($("<style type='text/css'> .audio-player{background:{color:post box shadow} !important; padding:5px 10px 5px 0px !important} .play-pause{color:{color:post} !important; font-size:15px!important; padding:0 9.5px!important} </style>"));
  74. });
  75. });
  76. </script>
  77.  
  78. <link href="//static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  79. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  80. <script src="//static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  81.  
  82.  
  83. <script>
  84. $(document).ready(function(){
  85. $('.photo-slideshow').pxuPhotoset({
  86. lightbox: true,
  87. rounded: false,
  88. gutter: '{select:photos spacing}',
  89. borderRadius: '0px',
  90. photoset: '.photo-slideshow',
  91. photoWrap: '.photo-data',
  92. photo: '.pxu-photo'
  93. });
  94. });
  95. </script>
  96.  
  97. <script src="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  98.  
  99. <link href="//fonts.googleapis.com/css?family={select:body font family}" rel="stylesheet">
  100.  
  101. <link href="//fonts.googleapis.com/css?family=Domine" rel="stylesheet">
  102.  
  103. <link rel="stylesheet" href="//static.tumblr.com/2pnwama/IUZoyg6qw/specialfonts.css">
  104.  
  105. <script src="//static.tumblr.com/snld4jp/rTori7q11/gtresizing.js"></script>
  106.  
  107. <link rel="stylesheet" href="//cdn.linearicons.com/free/1.0.0/icon-font.min.css">
  108.  
  109. <script src="//glen-themes.gitlab.io/thms/06/lukewarm-spaghetti.js"></script>
  110.  
  111. <!--------------------------------------------->
  112.  
  113. <script>
  114. $(document).ready(function(){
  115. var mapelle = '{text:music name}';
  116. var char = 24;
  117.  
  118. if (mapelle.length > char) {
  119. $(".ensou").html('<marquee scrollamount="' + '4' + '">' + mapelle + '</marquee>');
  120. }
  121. });
  122.  
  123. $(document).ready(function(){
  124. var june = '{text:description title}';
  125. var kar = 22;
  126.  
  127. if (june.length > kar) {
  128. $(".ttb").html('<marquee scrollamount="' + '3' + '">' + june + '</marquee>');
  129. }
  130. });
  131. </script>
  132.  
  133. <!--
  134. NPF images fix v3.0 by @glenthemes [2021]
  135. 💌 git.io/JRBt7
  136. --->
  137. <script src="//npf-images-v3.github.io/script.js"></script>
  138. <link rel="stylesheet" href="//npf-images-v3.github.io/recon.css">
  139. <style tmblr-npf>
  140. :root {
  141. --NPF-Caption-Spacing:1em;
  142. --NPF-Image-Spacing:{select:photos spacing};
  143.  
  144. --Sidebar-Image-Width:{select:sidebar image width};
  145. --Sidebar-Width:{select:sidebar total width};
  146. }
  147.  
  148. a.post_media_photo_anchor, a.post_media_photo_anchor:hover {
  149. padding-bottom:0!important;
  150. border-bottom:none!important;
  151. }
  152.  
  153. .spotify_audio_player {
  154. height:80px!important;
  155. }
  156. </style>
  157.  
  158. <link rel="stylesheet" media="screen" href="//assets.tumblr.com/client/prod/standalone/blog-network-npf/index.build.css">
  159.  
  160. <script>
  161. $(document).ready(function(){
  162. $(".has-npf h1:first").each(function(){
  163. if($(this).parent().is(".pcontent")){
  164. if($(this).parent().prev().is(".npf_inst")){
  165. var lol = $(this).parent().prev();
  166. lol.insertAfter($(this))
  167. }
  168. }
  169. });
  170. });//end ready
  171. </script>
  172.  
  173. <script>
  174. // minimal soundcloud player @ shythemes.tumblr
  175. // shythemes.tumblr.com/post/114792480648
  176. $(document).ready(function(){
  177. var soundcloud_btn = '{color:Link}';
  178. $('.soundcloud_audio_player').each(function(){
  179. $(this).attr({ src: $(this).attr('src').split('&')[0] + '&amp;liking=false&amp;sharing=false&amp;auto_play=false&amp;show_comments=false&amp;continuous_play=false&amp;buying=false&amp;show_playcount=false&amp;show_artwork=true&amp;origin=tumblr&amp;color=' + soundcloud_btn.split('#')[1], height: 116, width: '100%' });
  180. });
  181. });
  182. </script>
  183.  
  184. <!-- unblue polls -->
  185. <!-- glenthemes.tumblr.com/post/708014819571302400 -->
  186. <link href="//static.tumblr.com/gtjt4bo/mXBrpdj0n/unblue-polls.css" rel="stylesheet">
  187. <style unblue-polls>
  188. .poll-post {
  189. --Poll-Question-Font-Size: {select:font size};
  190.  
  191. --Poll-Option-Background-Color: {color:post};
  192. --Poll-Option-Corner-Rounding: 0px;
  193. --Poll-Option-Border-Size: 1px;
  194. --Poll-Option-Border-Color: {color:post borders};
  195. --Poll-Option-Padding: 8px;
  196. --Poll-Option-Font-Size: {select:font size};
  197. --Poll-Option-Spacing: 10px;
  198. --Poll-Option-Text-Color: {color:text};
  199.  
  200. --Poll-Option-HOVER-Border-Color: {color:post borders};
  201. --Poll-Option-HOVER-Background-Color: {color:post};
  202. --Poll-Option-HOVER-Text-Color: {color:Link};
  203. --Poll-Option-HOVER-Speed: 0.4s;
  204. }
  205.  
  206. .poll-see-results {
  207. padding-bottom:0!important;
  208. border-bottom:none!important;
  209. font-size:calc(var(--Poll-Option-Font-Size) - 1px)!important;
  210. text-transform:uppercase;
  211. letter-spacing:0.5px;
  212. }
  213. </style>
  214.  
  215. <!-- npf audio player -->
  216. <!-- glenthemes.tumblr.com/post/722160746171072512 -->
  217. <script src="//tmblr-npf-audio.gitlab.io/s/init.js"></script>
  218. <link href="//tmblr-npf-audio.gitlab.io/s/base.css" rel="stylesheet">
  219. <script>
  220. tumblr_npf_audio({
  221. emptyTitleText: "Untitled track",
  222. emptyArtistText: "Untitled artist",
  223. emptyAlbumText: "Untitled album",
  224.  
  225. titleLabel: "Track:",
  226. artistLabel: "Artist:",
  227. albumLabel: "Album:"
  228. });
  229. </script>
  230. <style edit-npf-audio-player>
  231. .npf-audio-wrapper {
  232. --NPF-Audio-Buttons-Size: {select:font size};
  233. --NPF-Audio-Buttons-Color: {color:post};
  234. --NPF-Audio-Buttons-Padding: 10px;
  235. --NPF-Audio-Buttons-Spacing: calc((var(--NPF-Audio-Buttons-Padding) * 2) + 14px);
  236. --NPF-Audio-Image-Spacing: 0.9rem;
  237. }
  238.  
  239. .npf-audio-background {
  240. margin-left:calc(15px + var(--NPF-Audio-Buttons-Padding));
  241. }
  242.  
  243. .npf-audio-play, .npf-audio-pause {
  244. position:relative;
  245. z-index:0;
  246. }
  247.  
  248. .npf-audio-play:after, .npf-audio-pause:after {
  249. content:"";
  250. position:absolute;
  251. top:0;left:0;
  252. margin-top:calc(0px - var(--NPF-Audio-Buttons-Padding));
  253. margin-left:calc(0px - var(--NPF-Audio-Buttons-Padding));
  254. width:calc(100% + (var(--NPF-Audio-Buttons-Padding) * 2));
  255. height:calc(100% + (var(--NPF-Audio-Buttons-Padding) * 2));
  256. background:{color:post box shadow};
  257. border-radius:100%;
  258. z-index:-1;
  259. }
  260.  
  261. .npf-audio-play svg { margin-left:1px; }
  262. .npf-audio-pause svg { margin-left:0; }
  263.  
  264. .npf-audio-title-label,
  265. .npf-audio-artist-label,
  266. .npf-audio-album-label {
  267. color:{color:bold};
  268. text-transform:uppercase;
  269. }
  270.  
  271. figcaption.audio-caption,
  272. figcaption.audio-caption ~ audio[controls],
  273. figcaption.audio-caption img, .npf-audio-image {
  274. display:none;
  275. }
  276. </style>
  277.  
  278. <script src="//glen-npf.gitlab.io/other/neue.js"></script>
  279. <link href="//glen-npf.gitlab.io/other/neue.css" rel="stylesheet">
  280.  
  281. <!--------------------IMAGES-------------------->
  282. <meta name="image:background image" content="//static.tumblr.com/d40eae727a79de74c5b3c4cb5c8e9fd5/2pnwama/mW8pmgswh/tumblr_static_2ddnvvrhh78k4ogc880kokg8c.png"/>
  283. <meta name="image:sidebar image" content="//static.tumblr.com/2ea4a1fad481c84fc2ea8d9ef2ac743d/2pnwama/m4Lpmgsh7/tumblr_static_8mbbntkkf7k00swwcgccososw.gif"/>
  284. <meta name="image:corner image" content="//static.tumblr.com/fd8db8d5cb0f9311af276d4fb6b9fff9/2pnwama/uB6pmgsol/tumblr_static_6rad1tctxs84w4w48444ookws.gif"/>
  285.  
  286. <!--------------------COLORS-------------------->
  287. <meta name="color:background" content="#fefefe"/>
  288.  
  289. <meta name="color:sidebar nav heart" content="#ec5a5a">
  290. <meta name="color:sidebar nav links" content="#f8a096">
  291.  
  292. <meta name="color:description box borders" content="#f3d7d7"/>
  293. <meta name="color:description box shadow" content="#f6e3e3"/>
  294. <meta name="color:description background" content="#fefefe"/>
  295. <meta name="color:desc title" content="#ec5a5a"/>
  296. <meta name="color:desc text" content="#888"/>
  297. <meta name="color:desc bold" content="#ffb3b3"/>
  298. <meta name="color:desc italic" content="#f0bfb6"/>
  299. <meta name="color:desc link" content="#fb897e"/>
  300.  
  301. <meta name="color:custom links background" content="#fefefe"/>
  302. <meta name="color:custom links border" content="#f3d7d7"/>
  303. <meta name="color:custom links box shadow" content="#f6e3e3"/>
  304. <meta name="color:custom links" content="#e8abab"/>
  305. <meta name="color:custom links hover" content="#fff"/>
  306. <meta name="color:custom links background hover" content="#fca097"/>
  307. <meta name="color:custom links border hover" content="#fca097"/>
  308.  
  309. <meta name="color:music player button" content="#eec9c9"/>
  310. <meta name="color:music player background" content="#fefefe"/>
  311. <meta name="color:music player border" content="#f3d7d7"/>
  312. <meta name="color:music player box shadow" content="#f6e3e3"/>
  313. <meta name="color:music player text" content="#e8abab"/>
  314.  
  315. <meta name="color:post" content="#fff"/>
  316. <meta name="color:post borders" content="#f3d7d7"/>
  317. <meta name="color:post box shadow" content="#f6e3e3"/>
  318. <meta name="color:post top bar permalink" content="#e8abab"/>
  319. <meta name="color:post top bar permalink hover" content="#f8a096"/>
  320. <meta name="color:text" content="#999"/>
  321. <meta name="color:bold" content="#666">
  322. <meta name="color:Italic" content="#f0bfb6">
  323. <meta name="color:Link" content="#f8a096">
  324. <meta name="color:Link Hover" content="#ec5a5a">
  325. <meta name="color:blockquote" content="#f3d7d7"/>
  326.  
  327. <meta name="color:permalink" content="#e8abab">
  328. <meta name="color:tags" content="#e8abab">
  329. <meta name="color:tags hover" content="#ec5a5a">
  330.  
  331. <meta name="color:scrollbar thumb" content="#ffb3b3"/>
  332. <meta name="color:scrollbar track" content="#eee"/>
  333. <meta name="color:scrollbar background" content="#fefefe"/>
  334.  
  335. <meta name="color:highlight" content="#fff"/>
  336. <meta name="color:highlighted text" content="#f8a096"/>
  337.  
  338. <!-----------------DROPDOWN OPTS----------------->
  339. <meta name="select:body font family" title="Muli" content="Muli"/>
  340. <meta name="select:body font family" title="Karla" content="Karla"/>
  341. <meta name="select:body font family" title="Lato" content="Lato"/>
  342. <meta name="select:body font family" title="Open Sans" content="Open Sans"/>
  343. <meta name="select:body font family" title="Quicksand" content="Quicksand"/>
  344.  
  345. <meta name="select:font size" title="12px" content="12px">
  346. <meta name="select:font size" title="11px" content="11px">
  347. <meta name="select:font size" title="13px" content="13px">
  348. <meta name="select:font size" title="14px" content="14px">
  349. <meta name="select:font size" title="15px" content="15px">
  350. <meta name="select:font size" title="16px" content="16px">
  351.  
  352. <meta name="select:post width" title="400px" content="400px">
  353. <meta name="select:post width" title="300px" content="300px">
  354. <meta name="select:post width" title="350px" content="375px">
  355. <meta name="select:post width" title="450px" content="450px">
  356. <meta name="select:post width" title="500px" content="500px">
  357. <meta name="select:post width" title="540px" content="540px">
  358. <meta name="select:post width" title="600px" content="600px">
  359.  
  360. <meta name="select:post padding" title="25px" content="25px">
  361. <meta name="select:post padding" title="10px" content="10px">
  362. <meta name="select:post padding" title="15px" content="15px">
  363. <meta name="select:post padding" title="20px" content="20px">
  364. <meta name="select:post padding" title="30px" content="30px">
  365.  
  366. <meta name="select:photos spacing" title="10px" content="10px">
  367. <meta name="select:photos spacing" title="0px" content="0px">
  368. <meta name="select:photos spacing" title="2px" content="2px">
  369. <meta name="select:photos spacing" title="4px" content="4px">
  370. <meta name="select:photos spacing" title="6px" content="6px">
  371. <meta name="select:photos spacing" title="8px" content="8px">
  372.  
  373. <meta name="select:permalink padding" title="10px" content="10px">
  374. <meta name="select:permalink padding" title="15px" content="15px">
  375. <meta name="select:permalink padding" title="20px" content="20px">
  376. <meta name="select:permalink padding" title="25px" content="25px">
  377. <meta name="select:permalink padding" title="30px" content="30px">
  378.  
  379. <meta name="select:post spacing" title="45px" content="45px">
  380. <meta name="select:post spacing" title="20px" content="20px">
  381. <meta name="select:post spacing" title="25px" content="25px">
  382. <meta name="select:post spacing" title="30px" content="30px">
  383. <meta name="select:post spacing" title="35px" content="35px">
  384. <meta name="select:post spacing" title="40px" content="40px">
  385. <meta name="select:post spacing" title="50px" content="50px">
  386. <meta name="select:post spacing" title="55px" content="55px">
  387. <meta name="select:post spacing" title="60px" content="60px">
  388.  
  389. <meta name="select:side gaps" title="80px" content="80px">
  390. <meta name="select:side gaps" title="30px" content="30px">
  391. <meta name="select:side gaps" title="40px" content="40px">
  392. <meta name="select:side gaps" title="50px" content="50px">
  393. <meta name="select:side gaps" title="60px" content="60px">
  394. <meta name="select:side gaps" title="70px" content="70px">
  395. <meta name="select:side gaps" title="90px" content="90px">
  396. <meta name="select:side gaps" title="100px" content="100px">
  397. <meta name="select:side gaps" title="110px" content="110px">
  398. <meta name="select:side gaps" title="120px" content="120px">
  399. <meta name="select:side gaps" title="130px" content="130px">
  400.  
  401. <meta name="select:top gap" title="60px" content="60px">
  402. <meta name="select:top gap" title="30px" content="30px">
  403. <meta name="select:top gap" title="40px" content="40px">
  404. <meta name="select:top gap" title="50px" content="50px">
  405. <meta name="select:top gap" title="80px" content="80px">
  406. <meta name="select:top gap" title="70px" content="70px">
  407. <meta name="select:top gap" title="90px" content="90px">
  408. <meta name="select:top gap" title="100px" content="100px">
  409.  
  410. <meta name="select:description text align" title="center" content="center"/>
  411. <meta name="select:description text align" title="left" content="left"/>
  412. <meta name="select:description text align" title="justify" content="justify"/>
  413. <meta name="select:description text align" title="right" content="right"/>
  414.  
  415. <meta name="select:sidebar image width" title="100px" content="100px">
  416. <meta name="select:sidebar image width" title="75px" content="75px">
  417. <meta name="select:sidebar image width" title="125px" content="125px">
  418. <meta name="select:sidebar image width" title="150px" content="150px">
  419. <meta name="select:sidebar image width" title="175px" content="175px">
  420. <meta name="select:sidebar image width" title="200px" content="200px">
  421.  
  422. <meta name="select:sidebar total width" title="225px" content="225px">
  423. <meta name="select:sidebar total width" title="175px" content="175px">
  424. <meta name="select:sidebar total width" title="200px" content="200px">
  425. <meta name="select:sidebar total width" title="250px" content="250px">
  426. <meta name="select:sidebar total width" title="275px" content="275px">
  427. <meta name="select:sidebar total width" title="300px" content="300px">
  428. <meta name="select:sidebar total width" title="325px" content="325px">
  429. <meta name="select:sidebar total width" title="350px" content="350px">
  430. <meta name="select:sidebar total width" title="375px" content="375px">
  431. <meta name="select:sidebar total width" title="400px" content="400px">
  432. <meta name="select:sidebar total width" title="425px" content="425px">
  433. <meta name="select:sidebar total width" title="450px" content="450px">
  434.  
  435. <meta name="select:corner image width" title="120px" content="120px">
  436. <meta name="select:corner image width" title="80px" content="80px">
  437. <meta name="select:corner image width" title="160px" content="160px">
  438. <meta name="select:corner image width" title="200px" content="200px">
  439. <meta name="select:corner image width" title="240px" content="240px">
  440. <meta name="select:corner image width" title="280px" content="280px">
  441. <meta name="select:corner image width" title="320px" content="320px">
  442. <meta name="select:corner image width" title="360px" content="360px">
  443.  
  444. <meta name="select:corner image from bottom" title="60px" content="60px">
  445. <meta name="select:corner image from bottom" title="0px" content="0px">
  446. <meta name="select:corner image from bottom" title="20px" content="20px">
  447. <meta name="select:corner image from bottom" title="40px" content="40px">
  448. <meta name="select:corner image from bottom" title="80px" content="80px">
  449. <meta name="select:corner image from bottom" title="100px" content="100px">
  450.  
  451. <!-----------------TOGGLE OPTS----------------->
  452.  
  453. <meta name="if:photo fade" content="0" />
  454. <meta name="if:monochrome posts" content="0" />
  455. <meta name="if:hide music player" content="0" />
  456. <meta name="if:dark tumblr controls" content="0" />
  457.  
  458. <!--------------------TITLES-------------------->
  459.  
  460. <meta name="text:how to link music" content="linktr.ee/direct_file_links">
  461. <meta name="text:music name" content="Peaceful Sleep">
  462. <meta name="text:music file URL" content="https://rhizo.gitlab.io/nier/Peaceful_Sleep__Music_Box_.mp3">
  463.  
  464. <meta name="text:description title" content="C:\ welcome!">
  465. <meta name="text:Link 1" content="Sample link 1">
  466. <meta name="text:Link 1 URL" content="/">
  467. <meta name="text:Link 2" content="">
  468. <meta name="text:Link 2 URL" content="">
  469. <meta name="text:Link 3" content="">
  470. <meta name="text:Link 3 URL" content="">
  471. <meta name="text:Link 4" content="">
  472. <meta name="text:Link 4 URL" content="">
  473. <meta name="text:Link 5" content="">
  474. <meta name="text:Link 5 URL" content="">
  475. <meta name="text:Link 6" content="">
  476. <meta name="text:Link 6 URL" content="">
  477.  
  478. <!-------------------------------------------------------------------->
  479.  
  480. <style type="text/css">
  481.  
  482. @font-face { font-family: "pixeloperator bold"; src: url('//glen-assets.github.io/fonts/PixelOperator-Bold.ttf'); }
  483.  
  484. @font-face { font-family: "silkscreen"; src: url('//glen-assets.github.io/fonts/silkscreen.ttf'); }
  485.  
  486. @font-face { font-family: "quicksand regular"; src: url('//glen-assets.github.io/fonts/Quicksand Regular.ttf'); }
  487.  
  488. @font-face { font-family: "consolas-alt"; src: url('//glen-assets.github.io/fonts/consolas.TTF'); }
  489.  
  490.  
  491. /*--------------------TOOLTIPS--------------------*/
  492. #s-m-t-tooltip {
  493. padding: 4px 9px;
  494. margin: 20px;
  495. background-color:{color:post}; /* tooltip background color */
  496. border:1px solid {color:post borders}; /* tooltip border color */
  497. box-shadow:4px 4px {color:post box shadow};
  498. font-family:silkscreen;
  499. font-size:9px;
  500. letter-spacing:-1px;
  501. color: {color:text};
  502. max-width: calc({select:post width} * 1.25);
  503. }
  504.  
  505. /*--------------------TUMBLR CONTROLS--------------------*/
  506. iframe#tumblr_controls, .iframe-controls--desktop {
  507. top:5px!important;
  508. right:5px!important;
  509. position:fixed!important;
  510.  
  511. {block:ifdarktumblrcontrols}
  512. filter:invert(100%) hue-rotate(180deg);
  513. -webkit-filter:invert(100%) hue-rotate(180deg);
  514. {/block:ifdarktumblrcontrols}
  515.  
  516. transform:scale(0.7,0.7);
  517. -webkit-transform:scale(0.7,0.7);
  518.  
  519. transform-origin:100% 0;
  520. z-index:999999!important;
  521. }
  522.  
  523. /*--------------------SCROLLBAR--------------------*/
  524. ::-webkit-scrollbar {
  525. width:13px;
  526. height:13px;
  527. background-color:{color:scrollbar background};
  528. }
  529.  
  530. ::-webkit-scrollbar-thumb {
  531. border-top:8px solid {color:scrollbar background};
  532. border-right:6px solid {color:scrollbar background};
  533. border-bottom:8px solid {color:scrollbar background};
  534. border-left:6px solid {color:scrollbar background};
  535. background-color:{color:scrollbar thumb};
  536. }
  537.  
  538. ::-webkit-scrollbar-track {
  539. border-top:8px solid {color:scrollbar background};
  540. border-right:6px solid {color:scrollbar background};
  541. border-bottom:8px solid {color:scrollbar background};
  542. border-left:6px solid {color:scrollbar background};
  543. background-color:{color:scrollbar track};
  544. }
  545.  
  546. /*--------------------TEXT HIGHLIGHT--------------------*/
  547. ::selection {
  548. background: {color:highlight};
  549. color:{color:highlighted text};
  550. }
  551.  
  552. ::-moz-selection {
  553. background: {color:highlight};
  554. color:{color:highlighted text};
  555. }
  556.  
  557. /*--------------------BASICS--------------------*/
  558. body {
  559. background:{color:background} url({image:background image});
  560. background-attachment:fixed;
  561. background-repeat:repeat;
  562. color:{color:text};
  563. cursor:normal;
  564. font-family:{select:body font family};
  565. line-height:1.6em;
  566. font-size:{select:font size};
  567. text-align:left;
  568. overflow-x:hidden;
  569. }
  570.  
  571. blockquote {
  572. padding-left:10px;
  573. margin-left:5px;
  574. border-left:1px solid;
  575. border-color:{color:blockquote};
  576. margin:10px;
  577. }
  578.  
  579. b, strong {font-weight:bold;color: {color:Bold};}
  580.  
  581. .non a, a.non {
  582. padding-bottom:0px!important;
  583. border-bottom:0px solid transparent!important;
  584. }
  585.  
  586. .nonn a {
  587. border-bottom:0px solid transparent!important;
  588. }
  589.  
  590. i, em, .em {color: {color:Italic};}
  591.  
  592. pre, code {
  593. white-space:pre-wrap;
  594. display:block;
  595. }
  596.  
  597. hr {
  598. width:70%;
  599. border-width:0px;
  600. height:1px;
  601. background-color:rgba({RGBcolor:text},0.3);
  602. }
  603.  
  604. p.npf_quirky, p.npf_quote {font-size:calc({select:font size} + 5px);line-height:1em;}
  605.  
  606. /*--------------------LINKS--------------------*/
  607. a {
  608. color:{color:link};
  609. text-decoration:none;
  610. cursor:normal;
  611. text-decoration:none;
  612. -webkit-transition: all 0.4s ease-in-out;
  613. -moz-transition: all 0.4s ease-in-out;
  614. -o-transition: all 0.4s ease-in-out;
  615. }
  616.  
  617. a:hover {text-decoration:none;}
  618.  
  619. img {opacity:1;text-decoration:none;}
  620.  
  621. h1 {
  622. font-size:calc({select:font size} + 1px);
  623. font-family:quicksand regular;
  624. text-transform: uppercase;
  625. letter-spacing: 2px;
  626. color:{color:text};
  627. text-align:center;
  628. }
  629.  
  630. h1:first-child {margin-top:0px}
  631.  
  632. .pp p:first-child {margin-top:0px;}
  633.  
  634. /*-----------------CONT-----------------*/
  635.  
  636. #container {
  637. position:absolute;
  638. margin:0 auto;
  639. margin-top:{select:top gap};
  640. margin-bottom:{select:top gap};
  641. top:0;left:0;right:0;
  642. width:calc(var(--Sidebar-Width) + {select:side gaps} + {select:post width} + ({select:post padding} * 2) + (({select:post width} + ({select:post padding} * 2)) * 0.025) + {select:side gaps} + {select:corner image width});
  643. }
  644.  
  645.  
  646. #nudge {
  647. margin-left:calc(var(--Sidebar-Width) + {select:side gaps});
  648. }
  649.  
  650. #c0rner {
  651. position:fixed;
  652. margin-left:calc((var(--Sidebar-Width) + {select:side gaps} + {select:post width} + ({select:post padding} * 2) + (({select:post width} + ({select:post padding} * 2)) * 0.025)) + {select:side gaps});
  653. bottom:0;margin-bottom:{select:corner image from bottom};
  654. width:{select:corner image width};
  655. height:auto;
  656. }
  657.  
  658. /*-----------------SIDEBAR-----------------*/
  659. #galaxy {
  660. position:fixed;
  661. margin-top:0px;
  662. margin-left:0px;
  663. /* total post width + gap between posts and sb */
  664. width:var(--Sidebar-Width);
  665. }
  666.  
  667. .mushroom {display:flex;}
  668.  
  669. .mushroom > * {
  670. align-self:center;
  671. -webkit-align-self:center;
  672. }
  673.  
  674. .yeacon {
  675. width:var(--Sidebar-Image-Width);
  676. }
  677.  
  678. .yeaboi {
  679. display:block;
  680. margin:auto;
  681. max-width:100%;
  682. }
  683.  
  684. .salmon {
  685. display:flex;
  686. margin-left:20px;
  687. padding-bottom:10px;
  688. }
  689.  
  690. .salmon:last-of-type {padding-bottom:0px}
  691.  
  692. .kokoro {
  693. width:16px;
  694. height:16px;
  695. opacity:0;
  696. -webkit-transition: all 0.1s ease-in-out;
  697. -moz-transition: all 0.1s ease-in-out;
  698. -o-transition: all 0.1s ease-in-out;
  699. }
  700.  
  701. .salmon:first-child .kokoro {opacity:1}
  702.  
  703. .salmon:hover .kokoro {
  704. opacity:1;
  705. }
  706. .salmonwrap:hover .salmon:first-child .kokoro {opacity:0}
  707. .salmonwrap:hover .salmon:first-child:hover .kokoro {opacity:1}
  708.  
  709. .daydreamer .kokoro {opacity:1}
  710.  
  711. .raw {display:flex;}
  712.  
  713. .gt-fill {
  714. background:{color:sidebar nav heart};
  715. height:1px;
  716. }
  717.  
  718. .f2 {width:2px;}
  719. .f4 {width:4px;}
  720. .f5 {width:5px;}
  721. .f7 {width:7px;}
  722. .f8 {width:8px;}
  723. .f12 {width:12px;}
  724. .f16 {width:16px;height:6px;}
  725.  
  726. .gtwo {height:2px;}
  727.  
  728. .cue, .custard {
  729. margin-top:-2px;
  730. font-family:pixeloperator bold;
  731. text-transform:uppercase;
  732. color:{color:sidebar nav links};
  733. }
  734.  
  735. .cue {
  736. margin-left:10px;
  737. font-size:19px;
  738. }
  739.  
  740. .custard {
  741. margin-left:10px;
  742. font-size:13px;
  743. letter-spacing:0.3px;
  744. }
  745.  
  746. .bigboyy {
  747. margin-top:20px;
  748. width:inherit;
  749. background-color:{color:description background};
  750. box-shadow:6px 6px {color:description box shadow};
  751. }
  752.  
  753. .heyboy {
  754. border:1px solid {color:description box borders};
  755. padding:5px 5px 0px 5px;
  756. }
  757.  
  758. .winboy {
  759. border:1px solid {color:description box borders};
  760. padding:5px;
  761. overflow:auto;
  762. margin-bottom:5px;
  763. }
  764.  
  765. .change {margin-bottom:0px!important}
  766.  
  767. .titboy {
  768. float:left;
  769. margin-top:2.5px;
  770. width:calc(100% - 50px);
  771. font-family:silkscreen;
  772. font-size:9px;
  773. color:{color:desc title};
  774. line-height:1em;
  775. max-height:1em;
  776. overflow:hidden;
  777. }
  778.  
  779. .winny {
  780. position:absolute;
  781. white-space:nowrap;
  782. }
  783.  
  784. .velvet .titboy {
  785. width:auto;
  786. letter-spacing:-0.5px;
  787. color:{color:post top bar permalink};
  788. }
  789.  
  790. .velvet .titboy:hover {color:{color:post top bar permalink hover};}
  791.  
  792. .niceboy {
  793. float:right;
  794. display:flex;
  795. }
  796.  
  797. .smallbox {
  798. margin-right:3px;
  799. padding:3px;
  800. width:5px;
  801. height:5px;
  802. border:1px solid {color:description box borders};
  803. cursor:help;
  804. }
  805.  
  806. .smallbox:last-of-type {margin-right:0px}
  807.  
  808. .sm-min {
  809. margin-top:4px;
  810. width:5px;
  811. height:1px;
  812. background:{color:description box borders};
  813. }
  814.  
  815. .velvet .sm-min {background:{color:post borders};}
  816.  
  817. .sm-max {
  818. margin-top:-1px;margin-left:-1px;
  819. width:5px;height:5px;
  820. border:1px solid {color:description box borders};
  821. }
  822.  
  823. .velvet .sm-max {border:1px solid {color:post borders};}
  824.  
  825. .sm-x {
  826. margin-top:-7px;margin-left:-1.5px;
  827. height:0;
  828. font-size:9px;
  829. color:{color:description box borders};
  830. }
  831.  
  832. .velvet .sm-x {
  833. margin-top:-0.5px;
  834. margin-left:-1.3px;
  835. color:{color:description box borders};
  836. }
  837.  
  838. .desc {
  839. margin-bottom:5px;
  840. border:1px solid {color:description box borders};
  841. padding:13px 15px;
  842. font-family:silkscreen;
  843. font-size:9px;
  844. color:{color:desc text};
  845. line-height:1.9em;
  846. text-align:{select:description text align};
  847. }
  848.  
  849. .desc b, .desc strong {color:{color:desc bold}}
  850. .desc i, .desc em {color:{color:desc italic}}
  851.  
  852. .desc a {
  853. color:{color:desc link};
  854. padding-bottom:1px;
  855. border-bottom:0.5px solid rgba({RGBcolor:desc link},0.4);
  856. }
  857.  
  858. .desc a:hover {
  859. color:{color:desc link hover};
  860. border-bottom:0.5px solid rgba({RGBcolor:desc link hover},0.4);
  861. }
  862.  
  863. .marshmallow {
  864. margin-top:20px;
  865. display:flex;
  866. {block:ifhidemusicplayer}display:none;{/block:ifhidemusicplayer}
  867. }
  868.  
  869. .on-cont {
  870. width:22px;
  871. height:22px;
  872. background:{color:music player background};
  873. border:1px solid {color:music player border};
  874. box-shadow:6px 5px {color:music player box shadow};
  875. cursor:pointer;
  876. }
  877.  
  878. .tri-h {
  879. margin-left:6.5px;
  880. margin-top:4.5px;
  881. }
  882.  
  883. .b-tri {
  884. width:1px;
  885. height:1.3px;
  886. }
  887. .b1 {width:1px}
  888. .b3 {width:3px}
  889. .b5 {width:5px}
  890. .b7 {width:7px}
  891. .b8 {width:8px}
  892. .b9 {width:9px}
  893.  
  894. .ll-h {
  895. display:none;
  896. margin-top:6px;
  897. margin-left:7px;
  898. }
  899.  
  900. .ll-z {display:flex;}
  901.  
  902. .ll-a, .ll-b {
  903. width:3px;
  904. height:9px;
  905. }
  906.  
  907. .ll-b {margin-left:3px}
  908.  
  909. .b-tri, .ll-a, .ll-b {background:{color:music player button};}
  910.  
  911. .ensou {
  912. margin-left:12px;
  913. width:calc(100% - 39px - 12px);
  914. padding:calc((22px - 9px) / 2);
  915. background:{color:music player background};
  916. border:1px solid {color:music player border};
  917. box-shadow:6px 5px {color:music player box shadow};
  918. font-family:silkscreen;
  919. font-size:9px;
  920. color:{color:music player text};
  921. line-height:1em;
  922. max-height:1em;
  923. overflow:hidden;
  924. }
  925.  
  926. .ennei {
  927. position:absolute;
  928. white-space:nowrap;
  929. }
  930.  
  931. .cloud {margin-top:20px;}
  932.  
  933. .ensei {
  934. display:flex;
  935. margin-bottom:calc(10px + 2px);
  936. }
  937.  
  938. .ensei:last-of-type {margin-bottom:0px}
  939.  
  940. .yi, .er {
  941. width:calc((100% / 2) - 23px);
  942. padding:3px 8px;
  943. background:{color:custom links background};
  944. border:1px solid {color:custom links border};
  945. font-family:silkscreen;
  946. font-size:9px;
  947. color:{color:custom links};
  948. line-height:2em;
  949. text-align:center;
  950. cursor:pointer;
  951. -webkit-transition: all 0.1s ease-in-out;
  952. -moz-transition: all 0.1s ease-in-out;
  953. -o-transition: all 0.1s ease-in-out;
  954. }
  955.  
  956. .yi {box-shadow:5px 6px {color:custom links box shadow};}
  957.  
  958. .er {
  959. margin-left:calc(5px + 5px);
  960. box-shadow:6px 6px {color:custom links box shadow};
  961. }
  962.  
  963. .yi:hover, .er:hover {
  964. background:{color:custom links background hover};
  965. border:1px solid {color:custom links border hover};
  966. color:{color:custom links hover};
  967. }
  968.  
  969. /*--------------------POSTS--------------------*/
  970. .velvet {
  971. padding:5px;
  972. border:1px solid {color:post borders};
  973. font-family:silkscreen;
  974. font-size:9px;
  975. color:#ec5a5a;
  976. line-height:1em;
  977. overflow:auto;
  978. }
  979.  
  980. .pcontent {
  981. margin-top:0px;
  982. padding-top:{select:post padding};
  983. }
  984.  
  985. .posts {
  986. overflow:hidden;
  987. margin-bottom:{select:post spacing};
  988. width:{select:post width};
  989. min-width:210px;
  990. padding:{select:post padding};
  991. background-color:{color:post};
  992. border:1px solid {color:post borders};
  993. box-shadow:calc(({select:post width} + ({select:post padding} * 2)) * 0.025) calc(({select:post width} + ({select:post padding} * 2)) * 0.025) {color:post box shadow};
  994. }
  995.  
  996. .posts:last-of-type {margin-bottom:0px;}
  997.  
  998. .posts a {
  999. color:{color:link};
  1000. padding-bottom:1px;
  1001. border-bottom:0.5px solid rgba({RGBcolor:link},0.4);
  1002. }
  1003.  
  1004. a.post_media_photo_anchor {
  1005. padding-bottom:0;
  1006. border-bottom:0;
  1007. }
  1008.  
  1009. .posts a:hover {
  1010. color:{color:link hover};
  1011. border-bottom:0.5px solid rgba({RGBcolor:link hover},0.4);
  1012. }
  1013.  
  1014. .photos, .photos img {
  1015. position:relative;
  1016. overflow:hidden;
  1017. width:{select:post width};
  1018.  
  1019. {block:IndexPage}
  1020. {block:ifphotofade}
  1021. opacity:0.8;
  1022. -webkit-transition: all 0.8s ease-in-out;
  1023. -moz-transition: all 0.8s ease-in-out;
  1024. -o-transition: all 0.8s ease-in-out;
  1025. {/block:ifphotofade}
  1026.  
  1027. {block:ifmonochromeposts}
  1028. -webkit-filter:grayscale(100%);
  1029. filter:grayscale(100%);
  1030. -webkit-transition: all 0.8s ease-in-out;
  1031. -moz-transition: all 0.8s ease-in-out;
  1032. -o-transition: all 0.8s ease-in-out;
  1033. {/block:ifmonochromeposts}
  1034. {/block:IndexPage}
  1035. }
  1036.  
  1037. .posts:hover .photos {
  1038. opacity:1;
  1039. -webkit-filter:grayscale(0%);
  1040. filter:grayscale(0%);
  1041. }
  1042.  
  1043. .posts img {
  1044. {block:IndexPage}
  1045. {block:ifphotofade}
  1046. opacity:0.8;
  1047. -webkit-transition: all 0.8s ease-in-out;
  1048. -moz-transition: all 0.8s ease-in-out;
  1049. -o-transition: all 0.8s ease-in-out;
  1050. {/block:ifphotofade}
  1051.  
  1052. {block:ifmonochromeposts}
  1053. -webkit-filter:grayscale(100%);
  1054. filter:grayscale(100%);
  1055. -webkit-transition: all 0.8s ease-in-out;
  1056. -moz-transition: all 0.8s ease-in-out;
  1057. -o-transition: all 0.8s ease-in-out;
  1058. {/block:ifmonochromeposts}
  1059. {/block:IndexPage}
  1060. }
  1061.  
  1062. .posts:hover img {
  1063. opacity:1;
  1064. -webkit-filter:grayscale(0%);
  1065. filter:grayscale(0%);
  1066. }
  1067.  
  1068. .posts img, .posts li, .posts blockquote {max-width:100%;height:auto;}
  1069.  
  1070. .posts iframe {max-width:100%;}
  1071.  
  1072. /*--------------------PERMALINK--------------------*/
  1073. .permawrap {
  1074. margin-top:{select:post padding};
  1075. margin-left:-{select:post padding};
  1076. margin-bottom:-{select:post padding};
  1077. width:calc({select:post width} + ({select:post padding} * 2));
  1078. border-top:1px solid {color:post borders};
  1079. }
  1080.  
  1081. .poof{
  1082. padding:{select:permalink padding};
  1083. overflow:auto;
  1084. }
  1085.  
  1086. .perma {float:left}
  1087.  
  1088. .candy {
  1089. margin-right:10px;
  1090. font-family:consolas-alt;
  1091. font-size:8px;
  1092. letter-spacing:1px;
  1093. color:{color:permalink}!important;
  1094. text-transform:uppercase;
  1095. font-weight:bold;
  1096. }
  1097.  
  1098. .candy:last-of-type {margin-right:0px;}
  1099.  
  1100. .candy txt {
  1101. font-family:silkscreen;
  1102. font-size:9px;
  1103. letter-spacing:-1px;
  1104. font-weight:normal;
  1105. }
  1106.  
  1107. .tagsin {
  1108. margin-top:5px;
  1109. margin-right:-3px;
  1110. font-family:silkscreen;
  1111. line-height:1.5em;
  1112. letter-spacing:-1px;
  1113. font-size:9px;
  1114. text-align:right;
  1115. }
  1116.  
  1117. .tagsin a {
  1118. display:inline-block;
  1119. margin:3px;
  1120. color:{color:tags};
  1121. }
  1122.  
  1123. .tagsin a:hover {color:{color:tags hover};}
  1124.  
  1125. .vinegar {float:right;}
  1126.  
  1127. /* -- Like + Reblog buttons (1/2) -- */
  1128. /* -- mikedidthis from StackOverflow: //stackoverflow.com/users/2312574/mikedidthis -- */
  1129. /* -- and tutorial by shythemes: //shythemes.tumblr.com/post/147903463743/custom-like-and-reblog-buttons -- */
  1130. /* -- and help from borntobewildcodes -- */
  1131. .controls {
  1132. margin-top:2px;
  1133. height:0;
  1134. }
  1135.  
  1136. .controls li {
  1137. position:relative;
  1138. display:inline-block;
  1139. margin:0 2px;
  1140. list-style-type:none;
  1141. }
  1142.  
  1143. .controls li:first-child {margin-left:0px;}
  1144. .controls li:last-child {margin-right:0px;}
  1145.  
  1146. /* both svg colors */
  1147. .controls .lnr {
  1148. font-size:11px;
  1149. color:{color:permalink};
  1150. }
  1151.  
  1152. .controls .like .liked + .lnr {
  1153. color:#ED1C24;
  1154. font-weight:bold;
  1155. }
  1156.  
  1157. .controls .like .like_button {
  1158. position:absolute;
  1159. width:11px;
  1160. height:11px;
  1161. margin-top:4px;
  1162. }
  1163.  
  1164. .controls .like .like_button iframe {
  1165. position:absolute;
  1166. top:0;left:0;bottom:0;right:0;
  1167. width:100%;height:100%;
  1168. z-index:2;
  1169. opacity:0.0000001;
  1170. }
  1171.  
  1172.  
  1173. /*--------------------POST NOTES--------------------*/
  1174. ol.notes {
  1175. margin-top:-2px;
  1176. margin-bottom:{select:post spacing};
  1177. width:{select:post width};
  1178. padding:{select:post padding};
  1179. background:{color:post};
  1180. border:1px solid {color:post borders};
  1181. list-style-type:none;
  1182. box-shadow:calc(({select:post width} + ({select:post padding} * 2)) * 0.025) calc(({select:post width} + ({select:post padding} * 2)) * 0.025) {color:post box shadow};
  1183. }
  1184.  
  1185. .heyho {
  1186. width:calc(({select:post width} + ({select:post padding} * 2)) - ({select:permalink padding} * 2));
  1187. padding:{select:permalink padding};
  1188. background:{color:post};
  1189. border:1px solid {color:post borders};
  1190. box-shadow:calc(({select:post width} + ({select:post padding} * 2)) * 0.025) calc(({select:post width} + ({select:post padding} * 2)) * 0.025) {color:post box shadow};
  1191. }
  1192.  
  1193. ol.notes li.note {
  1194. padding:10px;
  1195. }
  1196.  
  1197. ol.notes li.note img.avatar {
  1198. vertical-align:-4px;
  1199. margin-right:10px;
  1200. width:16px;
  1201. height:16px;
  1202. }
  1203.  
  1204. ol.notes li.note span.action {
  1205. font-weight:none;
  1206. }
  1207.  
  1208. ol.notes li.note .answer_content {
  1209. font-weight:normal;
  1210. }
  1211.  
  1212. ol.notes li.note blockquote {
  1213. padding:4px 10px;
  1214. margin:10px 0px 0px 25px;
  1215. }
  1216.  
  1217. ol.notes li.note blockquote a {
  1218. text-decoration:none;
  1219. }
  1220.  
  1221. /*---------------------------LIGHTBOXES---------------------------*/
  1222. .vignette, #vignette {
  1223. opacity:0;
  1224. }
  1225. .lightbox-image, #tumblr_lightbox img {
  1226. z-index:99999999999999999999999999999 !important;
  1227. box-shadow:none !important;
  1228. border-radius:0px !important;
  1229. max-width:none;
  1230. margin-top:-{select:post padding}!important;
  1231. padding:{select:post padding} !important;
  1232. background:{color:post} !important;
  1233. border:1px solid {color:post borders} !important;
  1234. }
  1235.  
  1236. .tmblr-lightbox, #tumblr_lightbox {
  1237. background-color:rgba({RGBcolor:post},0.78) !important;
  1238. z-index:99999999999999999999999999999 !important;
  1239. }
  1240.  
  1241. /*---------------------------QUOTES---------------------------*/
  1242. .daydreamer {
  1243. display:block;
  1244. margin:auto;
  1245. width:16px;
  1246. padding:10px;
  1247. background:{color:post};
  1248. border:1px solid {color:post borders};
  1249. }
  1250.  
  1251. .glae {
  1252. width:calc((({select:post width} + ({select:post padding} * 2)) - 38px) / 2);
  1253. height:1px;
  1254. background:{color:post borders};
  1255. }
  1256.  
  1257. .glae.g1 {
  1258. float:left;
  1259. margin-top:calc(-20px);
  1260. margin-left:calc(-{select:post padding});
  1261. }
  1262.  
  1263. .glae.g2 {
  1264. float:right;
  1265. margin-top:calc(-20px);
  1266. margin-right:calc(-{select:post padding});
  1267. }
  1268.  
  1269. .quote {
  1270. margin-top:{select:post padding};
  1271. font-family:domine;letter-spacing:0.5px;
  1272. font-size:{select:font size};
  1273. font-style:italic;
  1274. line-height:2em;
  1275. text-align:center;
  1276. }
  1277.  
  1278. .quotesource {
  1279. text-align:center;
  1280. margin-top:10px;
  1281. }
  1282.  
  1283. /*---------------------------CHATS---------------------------*/
  1284. .chat {
  1285. line-height:2em;
  1286. list-style:none;
  1287. color:{color:text};
  1288. border:1px solid {color:post borders};
  1289. }
  1290.  
  1291. .line.odd {
  1292. padding:10px;
  1293. border-top:1px solid {color:post borders};
  1294. list-style:none;
  1295. }
  1296.  
  1297. .line.odd:first-of-type {
  1298. border-top:0px solid transparent;
  1299. }
  1300.  
  1301. .line.even {
  1302. padding:10px;
  1303. border-top:1px solid {color:post borders};
  1304. list-style:none;
  1305. }
  1306.  
  1307. .label.odd, .label.even {
  1308. padding-right:1px;
  1309. text-transform:uppercase;
  1310. font-weight:bold;
  1311. }
  1312.  
  1313. p.npf_chat { font-family:Courier; font-size:{select:font size}; }
  1314.  
  1315. /*---------------------------ASKS---------------------------*/
  1316. .q-wrap {
  1317. padding:10px;
  1318. border:1px solid {color:post borders};
  1319. min-height:64px;
  1320. display:flex;
  1321. }
  1322.  
  1323. .askimg {
  1324. width:64px;height:64px!important;
  1325. }
  1326.  
  1327. .question {
  1328. margin-left:10px;
  1329. color:{color:text};
  1330. }
  1331.  
  1332. .asker, .asker b, .asker a {
  1333. text-transform:uppercase;color:{color:text};
  1334. }
  1335.  
  1336. .answer {
  1337. margin:0px auto;
  1338. text-transform:none;
  1339. color:{color:text};
  1340. }
  1341.  
  1342. /*---------------------------AUDIO---------------------------*/
  1343. .playerbutton {
  1344. position:absolute;
  1345. margin-top:18.5px;
  1346. margin-left:18.5px;
  1347. width:27px;
  1348. height:27px;
  1349. overflow:hidden;
  1350. border-radius:100%;
  1351. }
  1352.  
  1353. .trackdetails {
  1354. width:auto;
  1355. display:inline-block;
  1356. margin-left:70px;
  1357. padding:5px;
  1358. line-height:1.7;
  1359. }
  1360.  
  1361. .trackdetails b {
  1362. font-weight:normal;
  1363. }
  1364.  
  1365. .audiowrapper {
  1366. position:relative;
  1367. display:inline;
  1368. height:0px;
  1369. }
  1370.  
  1371. /*---------------------------VIDEO---------------------------*/
  1372. .tumblr_video_container {
  1373. width:{select:post width}!important;
  1374. min-width:210px!important;
  1375. height:auto!important;
  1376. max-height:540px!important;
  1377. overflow:hidden!important;
  1378. {block:IndexPage}
  1379. {block:ifphotofade}
  1380. opacity:0.8;
  1381. -webkit-transition: all 0.8s ease-in-out;
  1382. -moz-transition: all 0.8s ease-in-out;
  1383. -o-transition: all 0.8s ease-in-out;
  1384. {/block:ifphotofade}
  1385.  
  1386. {block:ifmonochromeposts}
  1387. -webkit-filter:grayscale(100%);
  1388. filter:grayscale(100%);
  1389. -webkit-transition: all 0.8s ease-in-out;
  1390. -moz-transition: all 0.8s ease-in-out;
  1391. -o-transition: all 0.8s ease-in-out;
  1392. {/block:ifmonochromeposts}
  1393. {/block:IndexPage}
  1394. }
  1395.  
  1396. .posts:hover .tumblr_video_container {
  1397. opacity:1;
  1398. -webkit-filter:grayscale(0%);
  1399. filter:grayscale(0%);
  1400. }
  1401.  
  1402. video {
  1403. max-width:100%;
  1404. height:auto!important;
  1405. }
  1406.  
  1407. /*------------------------BOT PAGI------------------------*/
  1408. .botpagi {
  1409. margin-bottom:{select:post spacing};
  1410. width:calc(({select:post width} + ({select:post padding} * 2)) - ({select:permalink padding} * 2));
  1411. background:{color:post};
  1412. padding:{select:permalink padding};
  1413. border:1px solid {color:post borders};
  1414. box-shadow:calc(({select:post width} + ({select:post padding} * 2)) * 0.025) calc(({select:post width} + ({select:post padding} * 2)) * 0.025) {color:post box shadow};
  1415. text-align:center;
  1416. }
  1417.  
  1418. /* 'Current page' number */
  1419. .botpagi span {
  1420. font-size:9px;
  1421. color:{color:Text};
  1422. padding:3px 5px;
  1423. width:9px;
  1424. display:inline-block;
  1425. margin-left:5px;
  1426. text-align:center;
  1427. }
  1428.  
  1429. /* Other page numbers */
  1430. .botpagi a {
  1431. font-size:9px;
  1432. font-family:silkscreen;
  1433. font-size:9px;
  1434. color:{color:text};
  1435. padding:3px 5px;
  1436. width:9px;
  1437. display:inline-block;
  1438. margin-left:2px;
  1439. text-align:center;
  1440. }
  1441.  
  1442. </style>
  1443.  
  1444. </head>
  1445.  
  1446. <body>
  1447.  
  1448. <!---- main shit ---->
  1449. <div id="container">
  1450.  
  1451. <div id="galaxy">
  1452.  
  1453. <div class="mushroom">
  1454.  
  1455. <div class="yeacon">
  1456. <img class="yeaboi" src="{image:sidebar image}">
  1457. </div><!--yeacon-->
  1458.  
  1459. <div class="salmonwrap">
  1460. <a class="salmon" href="/">
  1461. <div class="kokoro">
  1462. <div class="raw">
  1463. <div class="gt-fill f2" style="margin-left:2px"></div>
  1464. <div class="gt-fill f2" style="margin-left:8px"></div></div>
  1465. <div class="raw">
  1466. <div class="gt-fill f5" style="margin-left:1px"></div>
  1467. <div class="gt-fill f5" style="margin-left:4px"></div></div>
  1468. <div class="raw">
  1469. <div class="gt-fill f7 gtwo"></div>
  1470. <div class="gt-fill f7 gtwo" style="margin-left:2px"></div></div>
  1471. <div class="gt-fill f16" style="top:4px;"></div>
  1472. <div class="gt-fill f12 gtwo" style="margin-left:2px"></div>
  1473. <div class="gt-fill f8 gtwo" style="margin-left:4px"></div>
  1474. <div class="gt-fill f4 gtwo" style="margin-left:6px"></div>
  1475. </div><!--kokoro-->
  1476. <span class="cue">∗</span>
  1477. <span class="custard">go home</span>
  1478. </a><!--salmon-->
  1479.  
  1480. <a class="salmon" href="/ask">
  1481. <div class="kokoro">
  1482. <div class="raw">
  1483. <div class="gt-fill f2" style="margin-left:2px"></div>
  1484. <div class="gt-fill f2" style="margin-left:8px"></div></div>
  1485. <div class="raw">
  1486. <div class="gt-fill f5" style="margin-left:1px"></div>
  1487. <div class="gt-fill f5" style="margin-left:4px"></div></div>
  1488. <div class="raw">
  1489. <div class="gt-fill f7 gtwo"></div>
  1490. <div class="gt-fill f7 gtwo" style="margin-left:2px"></div></div>
  1491. <div class="gt-fill f16" style="top:4px;"></div>
  1492. <div class="gt-fill f12 gtwo" style="margin-left:2px"></div>
  1493. <div class="gt-fill f8 gtwo" style="margin-left:4px"></div>
  1494. <div class="gt-fill f4 gtwo" style="margin-left:6px"></div>
  1495. </div><!--kokoro-->
  1496. <span class="cue">∗</span>
  1497. <span class="custard">send mail</span>
  1498. </a><!--salmon-->
  1499.  
  1500. <a class="salmon" href="/archive">
  1501. <div class="kokoro">
  1502. <div class="raw">
  1503. <div class="gt-fill f2" style="margin-left:2px"></div>
  1504. <div class="gt-fill f2" style="margin-left:8px"></div></div>
  1505. <div class="raw">
  1506. <div class="gt-fill f5" style="margin-left:1px"></div>
  1507. <div class="gt-fill f5" style="margin-left:4px"></div></div>
  1508. <div class="raw">
  1509. <div class="gt-fill f7 gtwo"></div>
  1510. <div class="gt-fill f7 gtwo" style="margin-left:2px"></div></div>
  1511. <div class="gt-fill f16" style="top:4px;"></div>
  1512. <div class="gt-fill f12 gtwo" style="margin-left:2px"></div>
  1513. <div class="gt-fill f8 gtwo" style="margin-left:4px"></div>
  1514. <div class="gt-fill f4 gtwo" style="margin-left:6px"></div>
  1515. </div><!--kokoro-->
  1516. <span class="cue">∗</span>
  1517. <span class="custard">archive</span>
  1518. </a><!--salmon-->
  1519.  
  1520. <!-- PLEASE DO NOT DELETE THE CREDIT! Thank you x -->
  1521. <a class="salmon" href="//glenthemes.tumblr.com">
  1522. <div class="kokoro">
  1523. <div class="raw">
  1524. <div class="gt-fill f2" style="margin-left:2px"></div>
  1525. <div class="gt-fill f2" style="margin-left:8px"></div></div>
  1526. <div class="raw">
  1527. <div class="gt-fill f5" style="margin-left:1px"></div>
  1528. <div class="gt-fill f5" style="margin-left:4px"></div></div>
  1529. <div class="raw">
  1530. <div class="gt-fill f7 gtwo"></div>
  1531. <div class="gt-fill f7 gtwo" style="margin-left:2px"></div></div>
  1532. <div class="gt-fill f16" style="top:4px;"></div>
  1533. <div class="gt-fill f12 gtwo" style="margin-left:2px"></div>
  1534. <div class="gt-fill f8 gtwo" style="margin-left:4px"></div>
  1535. <div class="gt-fill f4 gtwo" style="margin-left:6px"></div>
  1536. </div><!--kokoro-->
  1537. <span class="cue">∗</span>
  1538. <span class="custard">theme</span>
  1539. </a><!--salmon-->
  1540. </div><!--salmonwrap-->
  1541.  
  1542. </div><!--mushroom-->
  1543.  
  1544. <div class="bigboyy">
  1545. <div class="heyboy">
  1546. <div class="winboy">
  1547. <div class="titboy ttb">
  1548. <div class="winny">{text:description title}</div></div>
  1549. <div class="niceboy">
  1550.  
  1551. <div class="smallbox d-min">
  1552. <div class="sm-min"></div></div>
  1553.  
  1554. <div class="smallbox d-max">
  1555. <div class="sm-max"></div></div>
  1556.  
  1557. <div class="smallbox d-x">
  1558. <div class="sm-x">✖</div></div>
  1559. </div><!--niceboy-->
  1560. </div><!--winboy-->
  1561.  
  1562. {block:Description}
  1563. <div class="desc">{Description}</div>
  1564. {/block:Description}
  1565. </div><!--heyboyy-->
  1566. </div><!--bigboy-->
  1567.  
  1568. <div class="cloud">
  1569. {block:ifLink1}
  1570. <div class="ensei">
  1571. <a class="yi" href="{text:Link 1 URL}">{text:Link 1}</a>
  1572. {block:ifLink2}
  1573. <a class="er" href="{text:Link 2 URL}">{text:Link 2}</a>
  1574. {/block:ifLink2}
  1575. </div>{/block:ifLink1}
  1576.  
  1577. {block:ifLink3}
  1578. <div class="ensei">
  1579. <a class="yi" href="{text:Link 3 URL}">{text:Link 3}</a>
  1580. {block:ifLink4}
  1581. <a class="er" href="{text:Link 4 URL}">{text:Link 4}</a>
  1582. {/block:ifLink4}
  1583. </div>{/block:ifLink3}
  1584.  
  1585. {block:ifLink5}
  1586. <div class="ensei">
  1587. <a class="yi" href="{text:Link 5 URL}">{text:Link 5}</a>
  1588. {block:ifLink6}
  1589. <a class="er" href="{text:Link 6 URL}">{text:Link 6}</a>
  1590. {/block:ifLink6}
  1591. </div>{/block:ifLink5}
  1592. </div>
  1593.  
  1594. <div class="marshmallow">
  1595. <div class="on-cont m-o">
  1596. <div class="tri-h">
  1597. <div class="b-tri"></div>
  1598. <div class="b-tri b3"></div>
  1599. <div class="b-tri b5"></div>
  1600. <div class="b-tri b7"></div>
  1601. <div class="b-tri b9"></div>
  1602. <div class="b-tri b7"></div>
  1603. <div class="b-tri b5"></div>
  1604. <div class="b-tri b3"></div>
  1605. <div class="b-tri"></div>
  1606. </div><!--tri-h-->
  1607.  
  1608. <div class="ll-h"><div class="ll-z">
  1609. <div class="ll-a"></div>
  1610. <div class="ll-b"></div>
  1611. </div></div><!--ll-->
  1612. </div><!--on-cont-->
  1613.  
  1614. <div class="ensou">
  1615. <div class="ennei">{text:music name}</div></div>
  1616.  
  1617. <audio id="melody" src="{text:music file URL}" type="audio"></audio>
  1618.  
  1619. </div><!--marshmallow-->
  1620. </div><!--galaxy-->
  1621.  
  1622. <div id="nudge">
  1623.  
  1624. {block:Posts inlineMediaWidth="1280" inlineNestedMediaWidth="1280"}
  1625. <div class="posts" id="{PostID}" post-type="{PostType}">
  1626. <div class="velvet">
  1627. {block:Date}
  1628. <a class="titboy non" href="{Permalink}">
  1629. {block:Text}
  1630. <span class="post-type-display">{PostType}</span> &mdash; {Timestamp}
  1631. {/block:Text}
  1632.  
  1633. {block:Photo}
  1634. image &mdash; {Timestamp}
  1635. {/block:Photo}
  1636.  
  1637. {block:Photoset}
  1638. photoset &mdash; {Timestamp}
  1639. {/block:Photoset}
  1640.  
  1641. {block:Quote}
  1642. {PostType} &mdash; {Timestamp}
  1643. {/block:Quote}
  1644.  
  1645. {block:Link}
  1646. {PostType} &mdash; {Timestamp}
  1647. {/block:Link}
  1648.  
  1649. {block:Chat}
  1650. {PostType} &mdash; {Timestamp}
  1651. {/block:Chat}
  1652.  
  1653. {block:Audio}
  1654. {PostType} &mdash; {Timestamp}
  1655. {/block:Audio}
  1656.  
  1657. {block:Video}
  1658. {PostType} &mdash; {Timestamp}
  1659. {/block:Video}
  1660.  
  1661. {block:Answer}
  1662. {PostType} &mdash; {Timestamp}
  1663. {/block:Answer}
  1664. </a>
  1665. {/block:Date}
  1666.  
  1667. <div class="niceboy">
  1668.  
  1669. <div class="smallbox p-min">
  1670. <div class="sm-min"></div></div>
  1671.  
  1672. <div class="smallbox p-max">
  1673. <div class="sm-max"></div></div>
  1674.  
  1675. <div class="smallbox p-x">
  1676. <div class="sm-x">✖</div></div>
  1677. </div><!--niceboy-->
  1678. </div>
  1679. <div class="pcontent">
  1680.  
  1681.  
  1682. {block:Text}
  1683. {block:Title}<h1>{Title}</h1>{/block:Title}
  1684. <div class="pp">{Body}</div>
  1685. {/block:Text}
  1686.  
  1687.  
  1688. {block:Photo}
  1689.  
  1690. <div class="photos">
  1691. <div class="non">{LinkOpenTag}<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"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="500"></a>{LinkCloseTag}</div></div>
  1692.  
  1693. {block:Caption}{Caption}{/block:Caption}
  1694. {/block:Photo}
  1695.  
  1696.  
  1697. {block:Photoset}
  1698.  
  1699. <div class="photos">
  1700. <div class="non">
  1701. <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>
  1702. </div>
  1703. </div>
  1704.  
  1705. {block:Caption}{Caption}{/block:Caption}
  1706. {/block:Photoset}
  1707.  
  1708.  
  1709. {block:Quote}
  1710. <div class="daydreamer">
  1711. <div class="kokoro">
  1712. <div class="raw">
  1713. <div class="gt-fill f2" style="margin-left:2px"></div>
  1714. <div class="gt-fill f2" style="margin-left:8px"></div></div>
  1715. <div class="raw">
  1716. <div class="gt-fill f5" style="margin-left:1px"></div>
  1717. <div class="gt-fill f5" style="margin-left:4px"></div></div>
  1718. <div class="raw">
  1719. <div class="gt-fill f7 gtwo"></div>
  1720. <div class="gt-fill f7 gtwo" style="margin-left:2px"></div></div>
  1721. <div class="gt-fill f16" style="top:4px;"></div>
  1722. <div class="gt-fill f12 gtwo" style="margin-left:2px"></div>
  1723. <div class="gt-fill f8 gtwo" style="margin-left:4px"></div>
  1724. <div class="gt-fill f4 gtwo" style="margin-left:6px"></div>
  1725. </div><!--kokoro-->
  1726. </div><!--daydreamer-->
  1727. <div class="glae g1"></div>
  1728. <div class="glae g2"></div>
  1729. <div class="quote">{Quote}</div>
  1730. {block:Source}<div class="quotesource"> — {Source}</div>
  1731. {/block:Source}{/block:Quote}
  1732.  
  1733.  
  1734. {block:Link}
  1735. <h1><div class="non"><a href="{URL}" {Target}>{Name} »</a></div></h1>
  1736. {block:Description}{Description}{/block:Description}
  1737. {/block:Link}
  1738.  
  1739.  
  1740. {block:Chat}
  1741. {block:Title}<h1>{Title}</h1>{/block:Title} <div class="chat"> {block:Lines} <li class="line {Alt}"> {block:Label} <span class="label {Alt}"> {Label}</span> {/block:Label}{Line}</li> {/block:Lines}</div>
  1742. {/block:Chat}
  1743.  
  1744.  
  1745. {block:Audio}
  1746. {block:AudioPlayer}
  1747. <div class="audiowrapper">
  1748. <div class="playerbutton">{AudioPlayer}</div>
  1749.  
  1750. <div class="trackdetails">
  1751. <b>TRACK:</b> {block:TrackName}{TrackName}{/block:TrackName}<br>
  1752.  
  1753. <b>ARTIST:</b> {block:Artist}{Artist}{/block:Artist}<br>
  1754.  
  1755. <b>PLAYS:</b> {FormattedPlayCount}</div>
  1756. </div><!--audiowrapper-->
  1757. {/block:AudioPlayer}
  1758.  
  1759. {block:Caption}
  1760. <div class="caption">{Caption}</div>
  1761. {/block:Caption}
  1762. {/block:Audio}
  1763.  
  1764.  
  1765. {block:Video}
  1766. <div class="video">{Video-500}</div>
  1767. {block:Caption}{Caption}{/block:Caption}
  1768. {/block:Video}
  1769.  
  1770.  
  1771. {block:Answer}
  1772. <div class="q-wrap">
  1773. <img class="askimg" src="{AskerPortraitURL-64}" ondragstart='return false;'>
  1774. <div class="question">
  1775. <div class="asker"><b>{Asker} asked:</b></div>
  1776. {Question}</div><!--question-->
  1777. </div><!--qwrap-->
  1778. <div class="answer">{Answer}</div><!--answer-->
  1779. {/block:Answer}
  1780.  
  1781.  
  1782.  
  1783. {block:IndexPage}
  1784. {block:Date}
  1785.  
  1786. {block:HasTags}
  1787. <div class="tagsin non">
  1788. {block:Tags}
  1789. <a href="{TagURL}">#{Tag}</a>
  1790. {/block:Tags}
  1791. </div><!--tagsin-->
  1792. {/block:HasTags}
  1793.  
  1794. <div class="permawrap">
  1795. <div class="poof">
  1796.  
  1797. <div class="perma nonn">
  1798. <a class="candy" href="{Permalink}">
  1799. <txt>{ShortMonth}</txt> {DayOfMonthWithZero}
  1800. </a>
  1801.  
  1802. <a class="candy" href="{Permalink}">{24Hour}:{Minutes}</a>
  1803.  
  1804. <a class="candy" href="{Permalink}">{NoteCount}<txt>N</txt></a>
  1805. </div><!--perma-->
  1806.  
  1807.  
  1808.  
  1809. {Block:IndexPage}
  1810. <div class="vinegar non">
  1811.  
  1812. <!-- Like + Reblog buttons (2/2) -->
  1813.  
  1814. <div class="controls">
  1815.  
  1816. <li class="like"><a title="like this post?">{LikeButton}
  1817. <span class="lnr lnr-heart"></span>
  1818. </a></li>
  1819.  
  1820. <li><a href="{ReblogURL}" target="_blank" title="reblog"><span class="lnr lnr-redo"></span></a></li>
  1821.  
  1822. </div><!--controls-->
  1823. </div><!--vinegar-->
  1824. {/block:IndexPage}
  1825.  
  1826.  
  1827. </div><!--poof-->
  1828. </div><!--permawrap-->
  1829. {/block:Date}
  1830. {/block:IndexPage}
  1831.  
  1832.  
  1833.  
  1834.  
  1835. <!-----------PERMA ON PERMAPAGE----------->
  1836. {block:PermalinkPage}
  1837. {block:Date}
  1838. {block:HasTags}
  1839. <div class="tagsin nonn" style="text-align:left;">
  1840. {block:Tags}
  1841. <a href="{TagURL}">#{Tag}</a>
  1842. {/block:Tags}
  1843. </div><!--tagsin-->
  1844. {/block:HasTags}
  1845.  
  1846. <div class="permawrap">
  1847. <div class="poof">
  1848.  
  1849. <div class="perma nonn">
  1850. <a class="candy">
  1851. <txt>{ShortMonth}</txt> {DayOfMonthWithZero} {Year}
  1852. </a>
  1853.  
  1854. <a class="candy">{24Hour}:{Minutes}</a>
  1855.  
  1856. <a class="candy"><txt>{DayOfWeek}</txt></a>
  1857. </div><!--perma-->
  1858.  
  1859. {block:RebloggedFrom}
  1860. <div class="vinegar non">
  1861. <a class="candy" href="{ReblogParentURL}" title="{ReblogParentName}"><txt>via</txt></a>
  1862. {block:ContentSource}
  1863. <a class="candy" href="{ReblogRootURL}" title="{ReblogRootName}"><txt>source</txt></a>
  1864. {/block:ContentSource}
  1865. </div><!--vinegar-->
  1866. {/block:RebloggedFrom}
  1867. </div><!--poof-->
  1868. </div><!--permawrap-->
  1869. {block:Date}
  1870. {block:PermalinkPage}
  1871.  
  1872.  
  1873. </div><!--pcontent-->
  1874. </div><!--posts-->
  1875.  
  1876.  
  1877. {block:PostNotes}
  1878. <div class="heyho"><span class="candy"><txt>{NoteCountWithLabel}</txt></span></div>
  1879. {PostNotes}
  1880. {/block:PostNotes}
  1881.  
  1882. {/block:Posts}
  1883.  
  1884.  
  1885.  
  1886. {block:Pagination}
  1887. <div class="botpagi">
  1888. {block:PreviousPage}<a title="Previous Page" href="{PreviousPage}">«</a>{/block:PreviousPage}
  1889. {block:JumpPagination length="4"}
  1890. {block:CurrentPage}<span class="current_page">✗</span>{/block:CurrentPage}
  1891. {block:JumpPage}<a href="{URL}" title="page {PageNumber}">{PageNumber}</a> {/block:JumpPage}
  1892. {/block:JumpPagination}
  1893. {block:NextPage}<a title="Next Page" href="{NextPage}">»</a>{/block:NextPage}
  1894. </div>
  1895. {/block:Pagination}
  1896.  
  1897. </div><!--nudge-->
  1898.  
  1899. <img id="c0rner" src="{image:corner image}">
  1900. </div><!--cont-->
  1901.  
  1902.  
  1903. </body>
  1904. </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!