glenthemes

Theme [26]: Nebulae

Jan 29th, 2018 (edited)
19,428
1
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 62.91 KB | None | 1 0
  1. <!----------------------------------------------------------------
  2. Theme [26]: Nebulae
  3. Made by glenthemes
  4.  
  5. Initial release: 2018/01/30
  6. Last updated: 2026/02/09
  7.  
  8. What's new:
  9. ✱ improved npf links, chats, quotes support
  10. ✱ improved post types detection
  11.  
  12. TERMS OF USE:
  13. 1) Do not remove the credit.
  14. 2) Do not remove parts of the code without my permission.
  15. 3) Do not claim my codes as your own.
  16. 4) Do not use my works as base codes.
  17. 5) You may add widgets to my themes and pages.
  18.  
  19. To change the updates icons:
  20. 1. Go to this site: saturnicons.gitlab.io/backup/icons-list
  21. 2. Pick an icon you want to use and copy its name.
  22. 3. Paste it in any of these text fields:
  23. - "star 1 box icon"
  24. - "star 2 box icon"
  25. - "star 3 box icon"
  26. ----------------------------------------------------------------->
  27.  
  28. <!DOCTYPE html>
  29. <html lang="en">
  30.  
  31. <head>
  32.  
  33. <title>{Title}</title>
  34.  
  35. <link rel="shortcut icon" href="{Favicon}">
  36.  
  37. <!--------------------JAVASCRIPTS-------------------->
  38. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  39. <script src="//static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  40. <script>
  41. (function($){
  42. $(document).ready(function(){
  43. $("a[title]").style_my_tooltips({
  44. tip_follows_cursor:true,
  45. tip_delay_time:120,
  46. tip_fade_speed:120,
  47. attribute:"title"
  48. });
  49. });
  50. })(jQuery);
  51. </script>
  52.  
  53. <script>
  54. $(document).ready(function() {
  55. $('iframe.tumblr_audio_player').load( function() {
  56. $('iframe.tumblr_audio_player').contents().find("head")
  57. .append($("<style type='text/css'> .audio-player{background:{color:permalink icon background} !important; padding:5px 10px 5px 0px !important;} .play-pause{color:{color:permalink icon} !important; font-size:15px!important; padding:0 9.5px!important} </style>"));
  58. });
  59. });
  60. </script>
  61.  
  62. <link href="//static.tumblr.com/2pnwama/mtXp3g4vy/style.css" rel="stylesheet" type="text/css"/>
  63. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  64. <script src="//static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  65.  
  66.  
  67. <script>
  68. $(document).ready(function(){
  69. $('.photo-slideshow').pxuPhotoset({
  70. lightbox: true,
  71. rounded: false,
  72. gutter: '{select:photos spacing}',
  73. borderRadius: '0px',
  74. photoset: '.photo-slideshow',
  75. photoWrap: '.photo-data',
  76. photo: '.pxu-photo'
  77. });
  78. });
  79. </script>
  80.  
  81. <script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  82.  
  83. {block:ifsmoothscrolling}
  84. <script src="//cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.4/SmoothScroll.js"></script>
  85. {/block:ifsmoothscrolling}
  86.  
  87. <link href="//fonts.googleapis.com/css?family=Karla|Averia+Sans+Libre|Quicksand" rel="stylesheet">
  88.  
  89. <script src="//static.tumblr.com/snld4jp/rTori7q11/gtresizing.js"></script>
  90.  
  91. <!-- "saturnicons" icon font by suiomi -->
  92. <link href="//saturnicons.gitlab.io/backup/icons.css" rel="stylesheet" crossorigin>
  93.  
  94. {block:ifheader}
  95. {block:ifLink1}
  96. <script>
  97. $(function(){
  98. var iamcrying = $('#lilac').position().top+0.25;
  99. $('#postbox').scroll(function(){
  100. if( $('#postbox').scrollTop() >= iamcrying ) {
  101. $('#lilac').addClass("tea");
  102. } else {
  103. $('#lilac').removeClass("tea");
  104. }
  105. });
  106. });
  107. </script>
  108. {/block:ifLink1}
  109. {/block:ifheader}
  110.  
  111. <link rel="stylesheet" media="screen" href="//assets.tumblr.com/client/prod/standalone/blog-network-npf/index.build.css">
  112.  
  113. <script src="//npf-images-v3.github.io/script.js"></script>
  114. <link rel="stylesheet" href="//npf-images-v3.github.io/recon.css">
  115. <style tmblr-npf>
  116. :root {
  117. --NPF-Caption-Spacing:1em;
  118. --NPF-Image-Spacing:4px;
  119. }
  120.  
  121. a.post_media_photo_anchor, a.post_media_photo_anchor:hover {
  122. padding-bottom:0!important;
  123. border-bottom:none!important;
  124. }
  125.  
  126. .spotify_audio_player {
  127. height:80px!important;
  128. }
  129. </style>
  130.  
  131. <script src="//glen-themes.gitlab.io/thms/26/ochako.js"></script>
  132.  
  133. <script>
  134. // minimal soundcloud player @ shythemes.tumblr
  135. // shythemes.tumblr.com/post/114792480648
  136. $(document).ready(function(){
  137. var soundcloud_btn = '{color:link}';
  138. $('.soundcloud_audio_player').each(function(){
  139. $(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%' });
  140. });
  141. });
  142. </script>
  143.  
  144. <!-- unblue polls -->
  145. <!-- glenthemes.tumblr.com/post/708014819571302400 -->
  146. <link href="//static.tumblr.com/gtjt4bo/mXBrpdj0n/unblue-polls.css" rel="stylesheet">
  147. <style unblue-polls>
  148. .poll-post {
  149. --Poll-Question-Font-Size: {select:font size};
  150.  
  151. --Poll-Option-Background-Color: transparent;
  152. --Poll-Option-Corner-Rounding: 5px;
  153. --Poll-Option-Border-Size: 1px;
  154. --Poll-Option-Border-Color: rgba({RGBcolor:text},0.15);
  155. --Poll-Option-Padding: 11px;
  156. --Poll-Option-Font-Size: {select:font size};
  157. --Poll-Option-Spacing: 10px;
  158. --Poll-Option-Text-Color: {color:text};
  159.  
  160. --Poll-Option-HOVER-Border-Color: rgba({RGBcolor:text},0.15);
  161. --Poll-Option-HOVER-Background-Color: transparent;
  162. --Poll-Option-HOVER-Text-Color: {color:link};
  163. --Poll-Option-HOVER-Speed: 0.4s;
  164. }
  165.  
  166. .poll-see-results {
  167. padding-bottom:0!important;
  168. border-bottom:none!important;
  169. font-size:calc(var(--Poll-Option-Font-Size) - 1px)!important;
  170. text-transform:uppercase;
  171. letter-spacing:0.5px;
  172. }
  173. </style>
  174.  
  175. <!-- npf audio player -->
  176. <!-- glenthemes.tumblr.com/post/722160746171072512 -->
  177. <script src="//tmblr-npf-audio.gitlab.io/s/init.js"></script>
  178. <link href="//tmblr-npf-audio.gitlab.io/s/base.css" rel="stylesheet">
  179. <script>
  180. tumblr_npf_audio({
  181. emptyTitleText: "Untitled track",
  182. emptyArtistText: "Untitled artist",
  183. emptyAlbumText: "Untitled album",
  184.  
  185. titleLabel: "Track:",
  186. artistLabel: "Artist:",
  187. albumLabel: "Album:"
  188. });
  189. </script>
  190. <style edit-npf-audio-player>
  191. .npf-audio-wrapper {
  192. --NPF-Audio-Buttons-Size: calc({select:font size} - 1px);
  193. --NPF-Audio-Buttons-Color: {color:permalink icon};
  194. --NPF-Audio-Buttons-Padding: 9px;
  195. --NPF-Audio-Buttons-Spacing: calc((var(--NPF-Audio-Buttons-Padding) * 2) + 10px);
  196. --NPF-Audio-Image-Spacing: 0.9rem;
  197. }
  198.  
  199. .npf-audio-background {
  200. margin-left:calc(18px + var(--NPF-Audio-Buttons-Padding));
  201. }
  202.  
  203. .npf-audio-play, .npf-audio-pause {
  204. position:relative;
  205. z-index:0;
  206. }
  207.  
  208. .npf-audio-play:after, .npf-audio-pause:after {
  209. content:"";
  210. position:absolute;
  211. top:0;left:0;
  212. margin-top:calc(0px - var(--NPF-Audio-Buttons-Padding));
  213. margin-left:calc(0px - var(--NPF-Audio-Buttons-Padding));
  214. width:calc(100% + (var(--NPF-Audio-Buttons-Padding) * 2));
  215. height:calc(100% + (var(--NPF-Audio-Buttons-Padding) * 2));
  216. background:{color:permalink icon background};
  217. border-radius:100%;
  218. z-index:-1;
  219. }
  220.  
  221. .npf-audio-play svg { margin-left:1px; }
  222. .npf-audio-pause svg { margin-left:0; }
  223.  
  224. .npf-audio-title-label,
  225. .npf-audio-artist-label,
  226. .npf-audio-album-label {
  227. color:{color:bold};
  228. text-transform:uppercase;
  229. }
  230.  
  231. figcaption.audio-caption,
  232. figcaption.audio-caption ~ audio[controls],
  233. figcaption.audio-caption img, .npf-audio-image {
  234. display:none;
  235. }
  236. </style>
  237.  
  238. <script src="//glen-npf.gitlab.io/other/neue.js"></script>
  239. <link href="//glen-npf.gitlab.io/other/neue.css" rel="stylesheet">
  240.  
  241. <!--------------------IMAGES-------------------->
  242.  
  243. <meta name="image:background image" content="//rhizo.gitlab.io/random/images/isewwsp.png"/>
  244. <meta name="image:sidebar icon" content="//68.media.tumblr.com/2bb735f0ca03c5997ffd6a8204252182/tumblr_ooo6td425a1s4s960o8_r1_250.png"/>
  245. <meta name="image:header image" content="//78.media.tumblr.com/2357a40238917a305fbbb74600d60643/tumblr_p3ailxOttO1qg2f5co4_r1_1280.png"/>
  246. <meta name="image:custom links bar background" content="//78.media.tumblr.com/b082898e3637cce6bad6f87f402557b8/tumblr_p3ailxOttO1qg2f5co5_r1_250.png"/>
  247.  
  248. <!--------------------COLORS-------------------->
  249.  
  250. <meta name="color:background" content="#fdfdfd"/>
  251.  
  252. <meta name="color:desc bg" content="#fff">
  253. <meta name="color:desc border" content="#fff">
  254. <meta name="color:desc text" content="#999">
  255.  
  256. <meta name="color:sidebar icon background" content="#d1b4ab"/>
  257. <meta name="color:sidebar links background" content="#d1b4ab"/>
  258. <meta name="color:sidebar links" content="#fff"/>
  259. <meta name="color:sidebar links background hover" content="#fff"/>
  260. <meta name="color:sidebar links hover" content="#d1b4ab"/>
  261. <meta name="color:sidebar title color" content="#d1b4ab"/>
  262. <meta name="color:sidebar subtitle color" content="#888"/>
  263.  
  264. <meta name="color:header background" content="#f9f8f9"/>
  265.  
  266. <meta name="color:custom links background" content="#fff"/>
  267. <meta name="color:custom links" content="#777"/>
  268. <meta name="color:custom links background hover" content="#d1b4ab"/>
  269. <meta name="color:custom links hover" content="#fff"/>
  270.  
  271. <meta name="color:post container background" content="#fcfcfc"/>
  272. <meta name="color:post container border" content="#f3f3f3"/>
  273. <meta name="color:post" content="#fff"/>
  274. <meta name="color:post border" content="#f9f9f9"/>
  275. <meta name="color:text" content="#888"/>
  276. <meta name="color:bold" content="#ecaca1">
  277. <meta name="color:Italic" content="#888">
  278. <meta name="color:Link" content="#f57d7d">
  279. <meta name="color:Link Hover" content="#222">
  280.  
  281. <meta name="color:permalink background" content="#fbfbfb">
  282. <meta name="color:permalink text" content="#666">
  283. <meta name="color:permalink icon background" content="#d1b4ab">
  284. <meta name="color:permalink icon" content="#fff">
  285.  
  286. <meta name="color:post tags background" content="#fbfbfb">
  287. <meta name="color:post tags" content="#928d88">
  288. <meta name="color:post tags background hover" content="#d1b4ab">
  289. <meta name="color:post tags hover" content="#fff">
  290.  
  291. <meta name="color:star 1" content="#f18b80">
  292. <meta name="color:star 1 hover" content="#f6d9d3">
  293. <meta name="color:star 2" content="#d88682">
  294. <meta name="color:star 2 hover" content="#f6d9d3">
  295. <meta name="color:star 3" content="#d39587">
  296. <meta name="color:star 3 hover" content="#f6d9d3">
  297.  
  298. <meta name="color:scrollbar" content="#b8b8b8"/>
  299. <meta name="color:scrollbar background" content="#fff"/>
  300.  
  301. <meta name="color:highlight" content="#fafafa"/>
  302. <meta name="color:highlighted text" content="#777"/>
  303.  
  304. <!-----------------DROPDOWN OPTS----------------->
  305. <meta name="select:font size" title="12px" content="12px">
  306. <meta name="select:font size" title="11px" content="11px">
  307. <meta name="select:font size" title="13px" content="13px">
  308. <meta name="select:font size" title="14px" content="14px">
  309. <meta name="select:font size" title="15px" content="15px">
  310. <meta name="select:font size" title="16px" content="16px">
  311.  
  312. <meta name="select:sidebar width" title="360px" content="360px">
  313. <meta name="select:sidebar width" title="200px" content="200px">
  314. <meta name="select:sidebar width" title="240px" content="240px">
  315. <meta name="select:sidebar width" title="280px" content="280px">
  316. <meta name="select:sidebar width" title="320px" content="320px">
  317. <meta name="select:sidebar width" title="400px" content="400px">
  318. <meta name="select:sidebar width" title="360px" content="360px">
  319. <meta name="select:sidebar width" title="400px" content="400px">
  320. <meta name="select:sidebar width" title="440px" content="440px">
  321.  
  322. <meta name="select:desc border transparency" title="60%" content="0.4">
  323. <meta name="select:desc border transparency" title="0% (solid)" content="1">
  324. <meta name="select:desc border transparency" title="10%" content="0.9">
  325. <meta name="select:desc border transparency" title="20%" content="0.8">
  326. <meta name="select:desc border transparency" title="30%" content="0.7">
  327. <meta name="select:desc border transparency" title="40%" content="0.6">
  328. <meta name="select:desc border transparency" title="50%" content="0.5">
  329. <meta name="select:desc border transparency" title="70%" content="0.3">
  330. <meta name="select:desc border transparency" title="80%" content="0.2">
  331. <meta name="select:desc border transparency" title="90%" content="0.1">
  332. <meta name="select:desc border transparency" title="100% (no color)" content="0">
  333.  
  334. <meta name="select:sidebar right gap" title="65px" content="65px">
  335. <meta name="select:sidebar right gap" title="20px" content="20px">
  336. <meta name="select:sidebar right gap" title="25px" content="25px">
  337. <meta name="select:sidebar right gap" title="30px" content="30px">
  338. <meta name="select:sidebar right gap" title="35px" content="35px">
  339. <meta name="select:sidebar right gap" title="40px" content="40px">
  340. <meta name="select:sidebar right gap" title="45px" content="45px">
  341. <meta name="select:sidebar right gap" title="50px" content="50px">
  342. <meta name="select:sidebar right gap" title="55px" content="55px">
  343. <meta name="select:sidebar right gap" title="60px" content="60px">
  344. <meta name="select:sidebar right gap" title="70px" content="70px">
  345. <meta name="select:sidebar right gap" title="75px" content="75px">
  346. <meta name="select:sidebar right gap" title="80px" content="80px">
  347. <meta name="select:sidebar right gap" title="85px" content="85px">
  348. <meta name="select:sidebar right gap" title="90px" content="90px">
  349. <meta name="select:sidebar right gap" title="95px" content="95px">
  350. <meta name="select:sidebar right gap" title="100px" content="100px">
  351. <meta name="select:sidebar right gap" title="105px" content="105px">
  352. <meta name="select:sidebar right gap" title="110px" content="110px">
  353.  
  354. <meta name="select:post width" title="450px" content="450px">
  355. <meta name="select:post width" title="300px" content="300px">
  356. <meta name="select:post width" title="350px" content="375px">
  357. <meta name="select:post width" title="400px" content="400px">
  358. <meta name="select:post width" title="500px" content="500px">
  359. <meta name="select:post width" title="540px" content="540px">
  360. <meta name="select:post width" title="600px" content="600px">
  361.  
  362. <meta name="select:post padding" title="15px" content="15px">
  363. <meta name="select:post padding" title="10px" content="10px">
  364. <meta name="select:post padding" title="20px" content="20px">
  365. <meta name="select:post padding" title="25px" content="25px">
  366.  
  367. <meta name="select:photos spacing" title="4px" content="4px">
  368. <meta name="select:photos spacing" title="0px" content="0px">
  369. <meta name="select:photos spacing" title="2px" content="2px">
  370. <meta name="select:photos spacing" title="6px" content="6px">
  371. <meta name="select:photos spacing" title="8px" content="8px">
  372. <meta name="select:photos spacing" title="10px" content="10px">
  373.  
  374. <meta name="select:permalink padding" title="15px" content="15px">
  375. <meta name="select:permalink padding" title="10px" content="10px">
  376. <meta name="select:permalink padding" title="20px" content="20px">
  377. <meta name="select:permalink padding" title="25px" content="25px">
  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:post side gaps" title="45px" content="45px">
  390. <meta name="select:post side gaps" title="10px" content="10px">
  391. <meta name="select:post side gaps" title="15px" content="15px">
  392. <meta name="select:post side gaps" title="20px" content="20px">
  393. <meta name="select:post side gaps" title="25px" content="25px">
  394. <meta name="select:post side gaps" title="30px" content="30px">
  395. <meta name="select:post side gaps" title="35px" content="35px">
  396. <meta name="select:post side gaps" title="40px" content="40px">
  397. <meta name="select:post side gaps" title="50px" content="50px">
  398. <meta name="select:post side gaps" title="55px" content="55px">
  399. <meta name="select:post side gaps" title="60px" content="60px">
  400. <meta name="select:post side gaps" title="65px" content="65px">
  401. <meta name="select:post side gaps" title="70px" content="70px">
  402. <meta name="select:post side gaps" title="75px" content="75px">
  403. <meta name="select:post side gaps" title="80px" content="80px">
  404.  
  405. <meta name="select:updates boxes width" title="200px" content="200px">
  406. <meta name="select:updates boxes width" title="150px" content="150px">
  407. <meta name="select:updates boxes width" title="175px" content="175px">
  408. <meta name="select:updates boxes width" title="225px" content="225px">
  409. <meta name="select:updates boxes width" title="250px" content="250px">
  410. <meta name="select:updates boxes width" title="275px" content="275px">
  411. <meta name="select:updates boxes width" title="300px" content="300px">
  412. <meta name="select:updates boxes width" title="325px" content="325px">
  413. <meta name="select:updates boxes width" title="350px" content="350px">
  414.  
  415. <!------------------TOGGLE OPTS------------------>
  416. <meta name="if:header" content="1" />
  417.  
  418. <meta name="if:post container border" content="1" />
  419. <meta name="if:post borders" content="1" />
  420.  
  421. <meta name="if:photo fade" content="0" />
  422. <meta name="if:monochrome posts" content="0" />
  423.  
  424. <meta name="if:updates boxes" content="1" />
  425.  
  426. <meta name="if:smooth scrolling" content="0" />
  427. <meta name="if:dark tumblr controls" content="0" />
  428.  
  429. <!----------------TEXT FIELDS---------------->
  430.  
  431. <meta name="text:sidebar title" content="a title">
  432. <meta name="text:sidebar subtitle" content="a subtitle">
  433.  
  434. <meta name="text:&#917536;&#x200B;" content="&#x263D;&#x2727;&#xA8;&#x2A;&#x3003;&#x2E;&#xB8;&#xB8;&#x2727;&#xB8;&#xB8;&#x2E;&#x3003;&#x2A;&#xA8;&#x2727;&#x263E;&NewLine;">
  435.  
  436. <!--"how to change icons"-->
  437. <meta name="text:&#x1F496;&#x2002;&#x29C;&#x1D0F;&#x1D21;&#x20;&#x1D1B;&#x1D0F;&#x20;&#x1D04;&#x29C;&#x1D00;&#x274;&#x262;&#x1D07;&#x20;&#x26A;&#x1D04;&#x1D0F;&#x274;&#x73;" content="glenthemes.tumblr.com/nebulae">
  438. <meta name="text:star 1 title" content="a title here">
  439. <meta name="text:star 1 box icon" content="leaf-2-o">
  440. <meta name="text:star 1 box content" content="some text here">
  441. <meta name="text:star 2 title" content="a title here">
  442. <meta name="text:star 2 box icon" content="constellation-o">
  443. <meta name="text:star 2 box content" content="some text here">
  444. <meta name="text:star 3 title" content="a title here">
  445. <meta name="text:star 3 box icon" content="graph-3-o">
  446. <meta name="text:star 3 box content" content="some text here">
  447.  
  448. <meta name="text:&#917536;&#x200B;&#x200B;" content="&#x263D;&#x2727;&#xA8;&#x2A;&#x3003;&#x2E;&#xB8;&#xB8;&#x2727;&#xB8;&#xB8;&#x2E;&#x3003;&#x2A;&#xA8;&#x2727;&#x263E;&NewLine;">
  449.  
  450. <meta name="text:Link 1" content="">
  451. <meta name="text:Link 1 URL" content="">
  452. <meta name="text:Link 2" content="">
  453. <meta name="text:Link 2 URL" content="">
  454. <meta name="text:Link 3" content="">
  455. <meta name="text:Link 3 URL" content="">
  456. <meta name="text:Link 4" content="">
  457. <meta name="text:Link 4 URL" content="">
  458. <meta name="text:Link 5" content="">
  459. <meta name="text:Link 5 URL" content="">
  460. <meta name="text:Link 6" content="">
  461. <meta name="text:Link 6 URL" content="">
  462. <meta name="text:Link 7" content="">
  463. <meta name="text:Link 7 URL" content="">
  464. <meta name="text:Link 8" content="">
  465. <meta name="text:Link 8 URL" content="">
  466. <meta name="text:Link 9" content="">
  467. <meta name="text:Link 9 URL" content="">
  468. <meta name="text:Link 10" content="">
  469. <meta name="text:Link 10 URL" content="">
  470.  
  471. <!-------------------------------------------------------------------->
  472.  
  473. <style type="text/css">
  474.  
  475. /*--------------------TOOLTIPS--------------------*/
  476. #s-m-t-tooltip {
  477. padding: 4px 9px;
  478. margin: 26px 9px 0px 15px;
  479. background-color: {color:permalink icon background};
  480. border-radius:5px;
  481. font-family: karla;
  482. font-size: calc({select:font size} - 3px);
  483. letter-spacing: 1px;
  484. text-transform: uppercase;
  485. color: {color:permalink icon};
  486. z-index:99999999999999999999999999998!important;
  487. max-width: calc({select:post width} * 1.25);
  488. -webkit-transition: all 0.3s ease-in-out;
  489. -moz-transition: all 0.3s ease-in-out;
  490. -o-transition: all 0.3s ease-in-out;
  491. }
  492.  
  493. /*--------------------TUMBLR CONTROLS--------------------*/
  494. iframe#tumblr_controls, .iframe-controls--desktop {
  495. top:3px!important;
  496. right:3px!important;
  497. position:fixed!important;
  498. z-index:999999!important;
  499.  
  500. {block:ifdarktumblrcontrols}
  501. filter:invert(100%) hue-rotate(180deg);
  502. -webkit-filter:invert(100%) hue-rotate(180deg);
  503. {/block:ifdarktumblrcontrols}
  504.  
  505. transform-origin:100% 0;
  506. z-index:999999!important;
  507. }
  508.  
  509. /*--------------------SCROLLBAR--------------------*/
  510. ::-webkit-scrollbar {
  511. width: 9px;
  512. height: 9px;
  513. }
  514.  
  515. ::-webkit-scrollbar-thumb {
  516. background-color:{color:scrollbar};
  517. border:4px solid {color:scrollbar background};
  518. }
  519.  
  520. ::-webkit-scrollbar-track {
  521. background-color: {color:scrollbar background};
  522. }
  523.  
  524. /*--------------------SCROLLBAR--------------------*/
  525. ::selection {
  526. background: {color:highlight};
  527. color:{color:highlighted text};
  528. }
  529.  
  530. ::-moz-selection {
  531. background: {color:highlight};
  532. color:{color:highlighted text};
  533. }
  534.  
  535. /*--------------------BASICS--------------------*/
  536. body {
  537. background:{color:background} url({image:background image});
  538. background-attachment:fixed;
  539. background-repeat:repeat;
  540. overflow:hidden;
  541. color:{color:text};
  542. cursor:normal;
  543. font-family:karla;
  544. line-height:1.6em;
  545. font-size:{select:font size};
  546. text-align:left;
  547. }
  548.  
  549. blockquote {
  550. padding-left:10px;
  551. margin-left:5px;
  552. border-left:1px solid;
  553. border-color:rgba({RGBcolor:text},0.7);
  554. margin:10px;
  555. }
  556.  
  557. b, strong {font-weight:bold;color: {color:Bold};}
  558.  
  559. .posts a, .desc a, .parsley a {
  560. color:{color:link};
  561. padding-bottom:1px;
  562. border-bottom:0.5px solid rgba({RGBcolor:link},0.4);
  563. }
  564.  
  565. .posts a:hover, .desc a:hover, .parsley a:hover {
  566. color:{color:link hover};
  567. border-bottom:0.5px solid rgba({RGBcolor:link hover},0.4);
  568. }
  569.  
  570. .non a {
  571. padding-bottom:0px!important;
  572. border-bottom:0px solid transparent!important;
  573. }
  574.  
  575. .nonn a {
  576. border-bottom:0px solid transparent!important;
  577. }
  578.  
  579. i, em, .em {color: {color:Italic};}
  580.  
  581. pre, code {
  582. white-space:pre-wrap;
  583. display:block;
  584. }
  585.  
  586. hr {
  587. width:70%;
  588. border-width:0px;
  589. height:1px;
  590. background-color:rgba({RGBcolor:text},0.3);
  591. }
  592.  
  593. /*--------------------LINKS--------------------*/
  594. a {
  595. color:{color:link};
  596. text-decoration:none;
  597. cursor:normal;
  598. text-decoration:none;
  599. -webkit-transition: all 0.4s ease-in-out;
  600. -moz-transition: all 0.4s ease-in-out;
  601. -o-transition: all 0.4s ease-in-out;
  602. }
  603.  
  604. a:hover {text-decoration:none;}
  605.  
  606. img {opacity:1;text-decoration:none;}
  607.  
  608. h1 {
  609. font-size:calc({select:font size} + 1px);
  610. font-family:quicksand;
  611. text-transform: uppercase;
  612. letter-spacing: 2px;
  613. color:{color:text};
  614. text-align:center;
  615. }
  616.  
  617. .pp p:first-child {margin-top:0px;}
  618.  
  619. /*--------------------HOSHI--------------------*/
  620. #star-cont {
  621. position:fixed;
  622. bottom:0;margin-bottom:45px;
  623. left:0;margin-left:-40px;
  624. font-size:12px;
  625. transform:scale(1.1);
  626. }
  627.  
  628. /* stars are made of pure css! if you're here to see how I did it, I followed 2 tutorials! it doesn't tell how to make 'a rounded star' precisely but I was like "I REALLY WANT TO MAKE A ROUNDED STAR and couldn't do it with just the star css, so I made a pentagon, then positioned 5 triangles on each side of the pentagon! */
  629.  
  630. /* please do not copy the entire chunk of code, that's against my Terms and is incredibly disrespectful. this is NOT a tutorial, so do not copy */
  631.  
  632. /* rounded triangle tutorial: //stackoverflow.com/questions/14446677#14451916 */
  633.  
  634. /* how to make a star: //css-tricks.com/examples/ShapesOfCSS/ */
  635.  
  636. #one-holder {
  637. position:absolute;
  638. bottom:100%;
  639. transform:translateY(100%);
  640. cursor:pointer;
  641. }
  642.  
  643. #one-holder, .triangle, .pentagon, .pentagon:before {
  644. -webkit-transition: all 0.6s ease-in-out;
  645. -moz-transition: all 0.6s ease-in-out;
  646. -o-transition: all 0.6s ease-in-out;
  647. transition: all 0.6s ease-in-out;
  648. }
  649.  
  650. #one-holder:hover .triangle, #one-holder:hover .pentagon, #one-holder:hover .pentagon:before {
  651. -webkit-transition: all 0.8s cubic-bezier(0.68, -0.55, 0.65, 1.0);
  652. -moz-transition: all 0.8s cubic-bezier(0.68, -0.55, 0.65, 1.0);
  653. -o-transition: all 0.8s cubic-bezier(0.68, -0.55, 0.65, 1.0);
  654. transition: all 0.8s cubic-bezier(0.68, -0.55, 0.65, 1.0);
  655. }
  656.  
  657. /* star 1 */
  658. #one-holder:nth-of-type(1) {
  659. margin-left:38px;
  660. margin-bottom:77px;
  661. width:55px;height:55px;
  662. transform:translateY(100%) scale(0.62) rotate(-33deg);
  663. }
  664.  
  665. #one-holder:nth-of-type(1):hover {
  666. transform:translateY(100%) scale(0.62) rotate(33deg);
  667. }
  668.  
  669. #one-holder:nth-of-type(1) .triangle {
  670. background-color:{color:star 1};
  671. }
  672.  
  673. #one-holder:nth-of-type(1) .pentagon {
  674. border-color:{color:star 1} transparent;
  675. }
  676.  
  677. #one-holder:nth-of-type(1) .pentagon:before {
  678. border-color:transparent transparent {color:star 1};
  679. }
  680.  
  681. #one-holder:nth-of-type(1):hover .triangle {
  682. background-color:{color:star 1 hover};
  683. }
  684.  
  685. #one-holder:nth-of-type(1):hover .pentagon {
  686. border-color:{color:star 1 hover} transparent;
  687. }
  688.  
  689. #one-holder:nth-of-type(1):hover .pentagon:before {
  690. border-color:transparent transparent {color:star 1 hover};
  691. }
  692.  
  693. /* star 2 */
  694. #one-holder:nth-of-type(2) {
  695. margin-left:57px;
  696. margin-bottom:30px;
  697. width:60px;height:60px;
  698. transform:translateY(100%) rotate(-15deg);
  699. }
  700.  
  701. #one-holder:nth-of-type(2):hover {
  702. transform:translateY(100%) rotate(15deg);
  703. }
  704.  
  705. #one-holder:nth-of-type(2) .triangle {
  706. background-color:{color:star 2};
  707. }
  708.  
  709. #one-holder:nth-of-type(2) .pentagon {
  710. border-color:{color:star 2} transparent;
  711. }
  712.  
  713. #one-holder:nth-of-type(2) .pentagon:before {
  714. border-color:transparent transparent {color:star 2};
  715. }
  716.  
  717. #one-holder:nth-of-type(2):hover .triangle {
  718. background-color:{color:star 2 hover};
  719. }
  720.  
  721. #one-holder:nth-of-type(2):hover .pentagon {
  722. border-color:{color:star 2 hover} transparent;
  723. }
  724.  
  725. #one-holder:nth-of-type(2):hover .pentagon:before {
  726. border-color:transparent transparent {color:star 2 hover};
  727. }
  728.  
  729. /* star 3 */
  730. #one-holder:nth-of-type(3) {
  731. margin-left:114px;
  732. margin-bottom:22px;
  733. width:58px;height:58px;
  734. transform:translateY(100%) scale(0.83) rotate(30deg);
  735. }
  736.  
  737. #one-holder:nth-of-type(3):hover {
  738. transform:translateY(100%) scale(0.83) rotate(-30deg);
  739. }
  740.  
  741. #one-holder:nth-of-type(3) .triangle {
  742. background-color:{color:star 3};
  743. }
  744.  
  745. #one-holder:nth-of-type(3) .pentagon {
  746. border-color:{color:star 3} transparent;
  747. }
  748.  
  749. #one-holder:nth-of-type(3) .pentagon:before {
  750. border-color:transparent transparent {color:star 3};
  751. }
  752.  
  753. #one-holder:nth-of-type(3):hover .triangle {
  754. background-color:{color:star 3 hover};
  755. }
  756.  
  757. #one-holder:nth-of-type(3):hover .pentagon {
  758. border-color:{color:star 3 hover} transparent;
  759. }
  760.  
  761. #one-holder:nth-of-type(3):hover .pentagon:before {
  762. border-color:transparent transparent {color:star 3 hover};
  763. }
  764.  
  765. .tri-holder {
  766. transform:scale(0.07,0.07);
  767. font-family:karla;line-height:1.6em;
  768. }
  769.  
  770. .triangle {
  771. position:relative;
  772. background-color:{color:stars background};
  773. }
  774.  
  775. .triangle:before, .triangle:after {content:'';position:absolute;background-color:inherit;} .triangle, .triangle:before, .triangle:after {width:10em;height:10em;}
  776.  
  777. .triangle {transform:rotate(-60deg) skewX(-30deg) scale(1,.866);}.triangle:before {transform:rotate(-135deg) skewX(-45deg) scale(1.414,.707) translate(0,-50%);}.triangle:after {transform:rotate(135deg) skewY(-45deg) scale(.707,1.414) translate(50%);}
  778.  
  779. .triangle:nth-of-type(1) {
  780. border-top-right-radius:100%;
  781. }
  782.  
  783. .triangle:nth-of-type(2) {
  784. position:absolute;
  785. margin-top:45px;
  786. margin-left:240px;
  787. transform:rotate(10deg) skewX(-30deg) scale(1,.866);
  788. border-top-right-radius:100%;
  789. }
  790.  
  791. .triangle:nth-of-type(3) {
  792. position:absolute;
  793. margin-top:270px;
  794. margin-left:150px;
  795. transform:rotate(-40deg) skewX(-30deg) scale(1,.866);
  796. }
  797.  
  798. .triangle:nth-of-type(3)::after {
  799. border-top-right-radius:100%;
  800. }
  801.  
  802. .triangle:nth-of-type(4) {
  803. position:absolute;
  804. margin-top:310px;
  805. margin-left:-95px;
  806. transform:rotate(37deg) skewX(-30deg) scale(1,.866);
  807. }
  808.  
  809. .triangle:nth-of-type(4)::after {
  810. border-top-right-radius:100%;
  811. }
  812.  
  813. .triangle:nth-of-type(5) {
  814. position:absolute;
  815. margin-top:35px;
  816. margin-left:-180px;
  817. transform:rotate(-10deg) skewX(-30deg) scale(1,.866);
  818. }
  819.  
  820. .triangle:nth-of-type(5)::before {
  821. border-top-right-radius:100%;
  822. }
  823.  
  824. .penta-holder {
  825. margin-left:19px;
  826. margin-bottom:-99px;
  827. transform:rotate(180deg) scale(0.29,0.29);
  828. }
  829.  
  830. .pentagon {
  831. position:relative;
  832. width:54px;
  833. border-width:50px 18px 0;
  834. border-style:solid;
  835. border-color:{color:stars background} transparent;
  836. }
  837. .pentagon:before {
  838. content:"";
  839. position:absolute;
  840. height:0;
  841. width:0;
  842. top:-81px;
  843. left:-19px;
  844. border-width:0px 49px 30px 46px;
  845. border-style:solid;
  846. border-color:transparent transparent {color:stars background};
  847. transform:scale(1,1.3);
  848. }
  849.  
  850. /*--------------------STARBOXES--------------------*/
  851. #vanilla1, #vanilla2, #vanilla3 {
  852. display:none;
  853. position:fixed;
  854. bottom:0;margin-bottom:95px;
  855. left:0;margin-left:95px;
  856. width:{select:updates boxes width};
  857. padding:10px;
  858. background-color:{color:post};
  859. border:1px solid {color:post border};
  860. border-radius:10px;
  861. z-index:1;
  862. }
  863.  
  864. .paprika {
  865. width:calc(100% - 20px);
  866. min-height:calc(17px + 10px);
  867. padding:10px;
  868. background-color:{color:permalink background};
  869. border-radius:10px;
  870. display:table;
  871. }
  872.  
  873. .paprika .sf {
  874. position:absolute;
  875. margin-top:-1px;
  876. padding:8px 8px 2px 8px;
  877. background-color:{color:permalink icon background};
  878. font-size:13px;
  879. color:{color:permalink icon};
  880. border-radius:10px;
  881. }
  882.  
  883. .yin {
  884. display:table-cell;
  885. vertical-align:middle;
  886. }
  887.  
  888. .caramel {
  889. margin-left:calc(28px + 10px);
  890. font-family:quicksand;
  891. font-weight:bold;
  892. text-transform:uppercase;
  893. letter-spacing:1px;
  894. font-size:9px;
  895. line-height:1.4em;
  896. color:rgba({color:permalink text},0.9);
  897. }
  898.  
  899. .parsley {
  900. margin-top:calc(10px - 0.25em);
  901. line-height:1.5em;
  902. font-size:11px;
  903. }
  904.  
  905. .parsley p:last-child {margin-bottom:0px;}
  906.  
  907. /*--------------------POST CONTAINER--------------------*/
  908. #container {
  909. position:absolute;
  910. margin:0 auto;
  911. top:0;left:0;right:0;
  912. width:calc({select:post width} + ({select:post padding} * 2) + ({select:post side gaps} * 2) + {select:sidebar right gap} + {select:sidebar width});
  913. }
  914.  
  915. #nudge {
  916. margin-left:calc({select:sidebar width} + {select:sidebar right gap});
  917. }
  918.  
  919. /*--------------------SIDEBAR-------------------*/
  920. #glass {
  921. position:fixed;
  922. top:50%;transform:translateY(-50%);
  923. margin-left:0px;
  924. /* u already nudged the post over by sbmarg, so sb pos = -sbWidth */
  925. /* basically only need to subtract sbWidth and yor good */
  926. width:{select:sidebar width};
  927. /*height:500px;*/
  928. background-color:transparent;
  929. }
  930.  
  931. .burrito {display:flex;}
  932.  
  933. .salsa {
  934. width:calc({select:sidebar width} - 80px - 16px - 10px);
  935. /* take 10px away : gap between desc and pic */
  936. height:96px;
  937. background-color:rgba({RGBcolor:desc border},{select:desc border transparency});
  938. display:table;
  939. }
  940.  
  941. .goo {display:table-cell;vertical-align:middle;}
  942.  
  943. .desc {
  944. /* width:calc({select:sidebar width} - 80px - 16px); */
  945. margin-left:50%;
  946. transform:translateX(-50%);
  947. width:calc(100% - 16px - 16px);
  948. height:calc(96px - 16px - 16px);
  949. overflow-x:hidden;
  950. overflow-y:auto;
  951. padding:8px; /* maybe make way for scrollbar? unsure */
  952. background-color:{color:desc bg};
  953. line-height:1.4em;
  954. font-size:11.6px;
  955. text-align:justify;
  956. color:{color:desc text};
  957. z-index:5;
  958. }
  959.  
  960. .desc p:last-child {margin-bottom:0px;}
  961.  
  962. .angelface {
  963. -webkit-align-self:center;
  964. align-self:center;
  965. margin-left:10px; /* left from desc */
  966. width:80px;
  967. height:80px;
  968. padding:8px;
  969. background-color:{color:sidebar icon background};
  970. border-radius:25%;
  971. z-index:-1;
  972. }
  973.  
  974. /* 3 links */
  975. .breathe {
  976. float:right;
  977. margin-top:10px;
  978. width:calc(80px + 16px);
  979. }
  980.  
  981. .breathe a {
  982. display:inline-block;
  983. margin:3px 0px;
  984. width:calc(100% - 10px - 2px); /* 100% - leftright padding */
  985. padding:5px;
  986. background-color:{color:sidebar links background};
  987. border-radius:5px;
  988. border:1px solid transparent;
  989. font-family:quicksand;
  990. text-transform:uppercase;line-height:1em;text-align:center;
  991. font-size:9px;font-weight:bold;letter-spacing:1px;
  992. color:{color:sidebar links};
  993. }
  994.  
  995. .breathe a:first-child {margin-top:0px;}
  996. .breathe a:last-child {margin-bottom:0px;}
  997.  
  998. .breathe a:hover {
  999. background-color:{color:sidebar links background hover};
  1000. border:1px solid {color:sidebar links hover};
  1001. color:{color:sidebar links hover};
  1002. }
  1003.  
  1004. /* sb tit */
  1005. .honor {
  1006. position:absolute;
  1007. margin-top:calc(10px - 6px);
  1008. right:0;margin-right:calc(80px + 16px + 10px + 8px);
  1009. font-family:Averia Sans Libre;
  1010. font-size:40px;line-height:1em;letter-spacing:0.5px;
  1011. text-align:right;
  1012. text-transform:uppercase;
  1013. color:{color:sidebar title color};
  1014. }
  1015.  
  1016. /* sb subtitty */
  1017. .glory {
  1018. margin-top:5px;
  1019. font-family:quicksand;
  1020. text-transform:uppercase;line-height:1.7em;
  1021. font-size:7px;font-weight:bold;letter-spacing:1.3px;
  1022. color:{color:sidebar subtitle color};
  1023. }
  1024.  
  1025. /*--------------------POST BLOCK--------------------*/
  1026. #postbox {
  1027. position:fixed;
  1028. margin-top:60px;
  1029. width:calc({select:post width} + ({select:post padding} * 2) + ({select:post side gaps} * 2));
  1030. height:calc(100vh - 60px - 60px);
  1031. overflow-x:hidden;
  1032. overflow-y:auto;
  1033. background-color:{color:post container background};
  1034. {block:ifpostcontainerborder}border:1px solid {color:post container border};{/block:ifpostcontainerborder}
  1035. z-index:-1;
  1036. }
  1037.  
  1038. /* bannah */
  1039. #heather {
  1040. width:inherit;
  1041. height:calc(({select:post width} + ({select:post side gaps} * 2)) / 21 * 9);
  1042. background-image:url('{image:header image}');
  1043. background-color:{color:header background};
  1044. background-position:center;
  1045. background-size:cover;
  1046. background-repeat:no-repeat;
  1047. }
  1048.  
  1049. {block:ifnotheader}
  1050. #heather {display:none;}
  1051. {/block:ifnotheader}
  1052.  
  1053. /* clinks bar */
  1054. #lilac {
  1055. position:absolute;
  1056. width:inherit;
  1057. height:80px;
  1058. background-image:url('{image:custom links bar background}');
  1059. background-color:{color:header background};
  1060. background-position:center;
  1061. background-repeat:repeat;
  1062. display:table;
  1063. z-index:5;
  1064. }
  1065.  
  1066. {block:ifnotheader}
  1067. #lilac {
  1068. position:fixed!important;
  1069. margin-top:-0.25px;
  1070. }
  1071. {/block:ifnotheader}
  1072.  
  1073. {block:ifnotLink1}
  1074. #lilac {display:none;}
  1075. {/block:ifnotLink1}
  1076.  
  1077. .pupil {
  1078. display:table-cell;
  1079. vertical-align:middle;
  1080. }
  1081.  
  1082. .coltsfoot {
  1083. text-align:center;
  1084. padding:0px 10px;
  1085. }
  1086.  
  1087. .coltsfoot a {
  1088. display:inline-block;
  1089. margin:4px;
  1090. width:70px;
  1091. padding:5px 7px;
  1092. background-color:{color:custom links background};
  1093. border:1px solid {color:custom links};
  1094. border-radius:5px;
  1095. font-family:quicksand;
  1096. line-height:1em;
  1097. text-transform:uppercase;
  1098. font-size:9px;font-weight:bold;letter-spacing:1px;
  1099. color:{color:custom links};
  1100. }
  1101.  
  1102. .coltsfoot a:hover {
  1103. background-color:{color:custom links background hover};
  1104. border:1px solid {color:custom links hover};
  1105. color:{color:custom links hover};
  1106. }
  1107.  
  1108. .tea {
  1109. position:fixed!important;
  1110. margin-top:calc(((({select:post width} + ({select:post side gaps} * 2)) / 21 * 9) * -1) - 0.25px)!important;
  1111. /* calc((({select:post width} + ({select:post side gaps} * 2)) / 21 * 9) * -1) */
  1112. }
  1113.  
  1114. /* bot bar pagi */
  1115. #saffron {
  1116. position:fixed;
  1117. bottom:0;margin-bottom:calc(60px - 1px);
  1118. width:inherit;
  1119. padding:15px 0px;
  1120. background-color:{color:permalink background};
  1121. text-align:center;
  1122. border-top:1px solid {color:post border};
  1123. z-index:5;
  1124. }
  1125.  
  1126. /* 'Current page' number */
  1127. #saffron span {
  1128. margin:0px 3px;
  1129. padding:0px 5px;
  1130. color:{color:permalink text};
  1131. display:inline-block;
  1132. text-align:center;
  1133. }
  1134.  
  1135. /* Other page numbers */
  1136. #saffron a {
  1137. margin:0px 3px;
  1138. padding:0px 5px 2px 5px;
  1139. color:rgba({RGBcolor:permalink text},0.8);
  1140. border-bottom:0.5px solid rgba({RGBcolor:permalink text},0.4);
  1141. display:inline-block;
  1142. text-align:center;
  1143. }
  1144.  
  1145. .small-nudge {
  1146. {block:ifLink1}margin-top:calc({select:post spacing} + 80px);{/block:ifLink1}
  1147.  
  1148. {block:ifnotLink1}
  1149. margin-top:{select:post spacing};
  1150. {/block:ifnotLink1}
  1151.  
  1152. margin-bottom:{select:post spacing};
  1153.  
  1154. {block:Pagination}margin-bottom:calc({select:post spacing} + 52.5px);{/block:Pagination}
  1155.  
  1156. margin-left:{select:post side gaps};
  1157. }
  1158.  
  1159. .posts {
  1160. overflow:hidden;
  1161. margin-bottom:{select:post spacing};
  1162. width:{select:post width};
  1163. padding:{select:post padding};
  1164. background-color:{color:post};
  1165. {block:ifpostborders}border:1px solid {color:post border};{/block:ifpostborders}
  1166. }
  1167.  
  1168. .posts:last-of-type {margin-bottom:0px;}
  1169.  
  1170. .photos, .photos img {
  1171. position:relative;
  1172. overflow:hidden;
  1173. width:{select:post width};
  1174.  
  1175. {block:IndexPage}
  1176. {block:ifphotofade}
  1177. opacity:0.8;
  1178. -webkit-transition: all 0.8s ease-in-out;
  1179. -moz-transition: all 0.8s ease-in-out;
  1180. -o-transition: all 0.8s ease-in-out;
  1181. {/block:ifphotofade}
  1182.  
  1183. {block:ifmonochromeposts}
  1184. -webkit-filter:grayscale(100%);
  1185. filter:grayscale(100%);
  1186. -webkit-transition: all 0.8s ease-in-out;
  1187. -moz-transition: all 0.8s ease-in-out;
  1188. -o-transition: all 0.8s ease-in-out;
  1189. {/block:ifmonochromeposts}
  1190. {/block:IndexPage}
  1191. }
  1192.  
  1193. .posts:hover .photos {
  1194. opacity:1;
  1195. -webkit-filter:grayscale(0%);
  1196. filter:grayscale(0%);
  1197. }
  1198.  
  1199. .posts iframe{max-width:100%;}
  1200.  
  1201. .posts img {
  1202. {block:IndexPage}
  1203. {block:ifphotofade}
  1204. opacity:0.8;
  1205. -webkit-transition: all 0.8s ease-in-out;
  1206. -moz-transition: all 0.8s ease-in-out;
  1207. -o-transition: all 0.8s ease-in-out;
  1208. {/block:ifphotofade}
  1209.  
  1210. {block:ifmonochromeposts}
  1211. -webkit-filter:grayscale(100%);
  1212. filter:grayscale(100%);
  1213. -webkit-transition: all 0.8s ease-in-out;
  1214. -moz-transition: all 0.8s ease-in-out;
  1215. -o-transition: all 0.8s ease-in-out;
  1216. {/block:ifmonochromeposts}
  1217. {/block:IndexPage}
  1218. }
  1219.  
  1220. .posts:hover img {
  1221. opacity:1;
  1222. -webkit-filter:grayscale(0%);
  1223. filter:grayscale(0%);
  1224. }
  1225.  
  1226. .posts img, .posts li, .posts blockquote {max-width:100%;height:auto;}
  1227.  
  1228. /*--------------------TOP PERMA--------------------*/
  1229. .citrus {
  1230. margin-bottom:{select:post padding};
  1231. background-color:{color:permalink background};
  1232. padding-top:calc(10px + {select:permalink padding});
  1233. padding-right:{select:permalink padding};
  1234. padding-bottom:calc(5px + {select:permalink padding});
  1235. padding-left:{select:permalink padding};
  1236. font-family:karla;line-height:1.6em;
  1237. }
  1238.  
  1239. .citrus .sf {
  1240. padding:12px 10px 5px 10px;
  1241. background-color:{color:permalink icon background};
  1242. font-size:20px;
  1243. color:{color:permalink icon};
  1244. border-radius:10px;
  1245. }
  1246.  
  1247. .sour {
  1248. position:absolute;
  1249. margin-top:-29px;
  1250. margin-left:40px;
  1251. padding-left:10px;
  1252. font-family:quicksand;
  1253. line-height:1.35em;
  1254. text-transform:uppercase;
  1255. font-size:11px;font-weight:bold;letter-spacing:0.5px;
  1256. color:{color:permalink text};
  1257. }
  1258.  
  1259. .sour uke {
  1260. font-size:9px;
  1261. letter-spacing:1px;
  1262. color:rgba({RGBcolor:permalink text},0.8);
  1263. }
  1264.  
  1265. .vinegar {float:right;}
  1266. .vinaigrette {
  1267. float:right;
  1268. margin-top:calc(-{select:post padding} - {select:permalink padding} - 10px - 18px);
  1269. margin-right:calc(2px + {select:permalink padding});
  1270. }
  1271.  
  1272. .salad {
  1273. font-family:quicksand;
  1274. line-height:1.45em;
  1275. text-transform:uppercase;
  1276. font-size:10px;font-weight:bold;letter-spacing:1px;
  1277. }
  1278.  
  1279. .salad {color:rgba({RGBcolor:permalink text},0.8);}
  1280. .salad a, .salad a:hover {color:{color:permalink text};}
  1281.  
  1282. /*--------------------TAGS--------------------*/
  1283. .tagsin {
  1284. margin-right:-3px; /* make room for last tag padding */
  1285. text-transform:uppercase;
  1286. letter-spacing:1.3px;
  1287. text-align:right;line-height:1.4em;
  1288. font-size:calc({select:font size} - 3.5px);
  1289. margin-top:10px;
  1290. }
  1291.  
  1292. .tagsin a {
  1293. display:inline-block;
  1294. margin:3px calc(3px + 1ch);
  1295. padding:4px calc(6px - 2ch); /* 6px orig. 2ch = 1ch on either side */
  1296. /* bc box-shadow makes up for it */
  1297. background-color:{color:post tags background};
  1298. box-shadow: 1ch 0 0 {color:post tags background}, -1ch 0 0 {color:post tags background};
  1299. color:{color:post tags};
  1300. border-bottom:0px solid transparent;
  1301. }
  1302.  
  1303. .tagsin a:hover {
  1304. background-color:{color:post tags background hover};
  1305. box-shadow: 1ch 0 0 {color:post tags background hover}, -1ch 0 0 {color:post tags background hover};
  1306. color:{color:post tags hover};
  1307. }
  1308.  
  1309. /*--------------------POST NOTES--------------------*/
  1310. ol.notes {
  1311. width:{select:post width};
  1312. padding:0px;
  1313. margin-top:30px;
  1314. list-style-type:none;
  1315. }
  1316.  
  1317. ol.notes li.note {
  1318. padding:10px;
  1319. }
  1320.  
  1321. ol.notes li.note img.avatar {
  1322. vertical-align:-4px;
  1323. margin-right:10px;
  1324. width:16px;
  1325. height:16px;
  1326. }
  1327.  
  1328. ol.notes li.note span.action {
  1329. font-weight:none;
  1330. }
  1331.  
  1332. ol.notes li.note .answer_content {
  1333. font-weight:normal;
  1334. }
  1335.  
  1336. ol.notes li.note blockquote {
  1337. padding:4px 10px;
  1338. margin:10px 0px 0px 25px;
  1339. }
  1340.  
  1341. ol.notes li.note blockquote a {
  1342. text-decoration:none;
  1343. }
  1344.  
  1345. /*---------------------------LIGHTBOXES---------------------------*/
  1346. .vignette, #vignette {
  1347. opacity:0;
  1348. }
  1349. .lightbox-image, #tumblr_lightbox img {
  1350. z-index:99999999999999999999999999999 !important;
  1351. box-shadow:none !important;
  1352. border-radius:0px !important;
  1353. max-width:none;
  1354. padding:{select:post padding} !important;
  1355. background:{color:post} !important;
  1356. border:1px solid {color:post border}!important;
  1357. }
  1358.  
  1359. .tmblr-lightbox, #tumblr_lightbox {
  1360. background-color:rgba({RGBcolor:post},0.78) !important;
  1361. z-index:99999999999999999999999999999 !important;
  1362. }
  1363.  
  1364. /*---------------------------QUOTES---------------------------*/
  1365. .daydreamer {
  1366. margin-top:6px;
  1367. margin-bottom:10px;
  1368. text-align:center;
  1369. }
  1370.  
  1371. .daydreamer .sf {
  1372. color:{color:text};
  1373. padding:7px 10px 2px 10px;
  1374. font-size:calc({select:font size} + 5px);
  1375. }
  1376.  
  1377. .daydreamer::before {
  1378. content:"";
  1379. position:absolute;
  1380. margin-top:8px;
  1381. margin-left:calc(-{select:post width} / 4);
  1382. width:calc({select:post width} / 4);
  1383. height:1px;
  1384. background:-webkit-linear-gradient(left, transparent 0%, {color:text} 80%, transparent 100%);
  1385. }
  1386.  
  1387. .daydreamer::after {
  1388. content:"";
  1389. position:absolute;
  1390. margin-top:8px;
  1391. margin-left:0px;
  1392. width:calc({select:post width} / 4);
  1393. height:1px;
  1394. background:-webkit-linear-gradient(right, transparent 0%, {color:text} 80%, transparent 100%);
  1395. }
  1396.  
  1397. .quote {
  1398. font-family:quicksand;
  1399. text-transform:uppercase;letter-spacing:1px;
  1400. font-size:calc({select:font size} + 1px);
  1401. font-weight:bold;
  1402. text-align:center;
  1403. }
  1404.  
  1405. .quotesource {
  1406. text-align:center;
  1407. margin-top:10px;
  1408. }
  1409.  
  1410. /*---------------------------CHATS---------------------------*/
  1411. .chat {
  1412. line-height:2em;
  1413. list-style:none;
  1414. }
  1415.  
  1416. .line.odd {
  1417. background-color:rgba({RGBcolor:permalink background}, 0.8);
  1418. padding:5px;
  1419. list-style:none;
  1420. color:rgba({RGBcolor:permalink text}, 0.8);
  1421. }
  1422.  
  1423. .line.even {
  1424. background:{color:post};
  1425. padding:5px;
  1426. list-style:none;
  1427. }
  1428.  
  1429. .label.odd, .label.even {
  1430. padding-right:1px;
  1431. text-transform:uppercase;
  1432. font-weight:bold;
  1433. }
  1434.  
  1435. .label.odd {color:{color:permalink text};}
  1436. .label.even {color:{color:link};}
  1437.  
  1438. /*---------------------------ASKS---------------------------*/
  1439. .q-wrap {
  1440. padding:10px;
  1441. background-color:rgba({RGBcolor:permalink background},0.8);
  1442. min-height:64px;
  1443. }
  1444.  
  1445. .question {margin-left:75px;}
  1446.  
  1447. .askimg {
  1448. position:absolute;
  1449. width:64px;height:64px;
  1450. }
  1451.  
  1452. .asker, .asker b, .asker a, .answer {
  1453. text-transform:uppercase;color:{color:permalink text};
  1454. }
  1455.  
  1456. .answer {
  1457. margin:0px auto;
  1458. text-transform:none;
  1459. }
  1460.  
  1461. /*---------------------------AUDIO---------------------------*/
  1462. .playerbutton {
  1463. position:absolute;
  1464. margin-top:18.5px;
  1465. margin-left:18.5px;
  1466. width:27px;
  1467. height:27px;
  1468. overflow:hidden;
  1469. border-radius:100%;
  1470. }
  1471.  
  1472. .trackdetails {
  1473. width:auto;
  1474. display:inline-block;
  1475. margin-left:70px;
  1476. padding:5px;
  1477. line-height:1.7;
  1478. }
  1479.  
  1480. .trackdetails b {letter-spacing:0.3px;}
  1481.  
  1482. .audiowrapper {
  1483. position:relative;
  1484. display:inline;
  1485. height:0px;
  1486. }
  1487.  
  1488. /*---------------------------VIDEO---------------------------*/
  1489. video {
  1490. display:block;
  1491. outline:none;
  1492. cursor:default;
  1493. width:100%;
  1494. }
  1495.  
  1496. .tumblr_video_container {
  1497. width:{select:post width}!important;
  1498. height:auto!important;
  1499. max-height:540px!important;
  1500. overflow:hidden!important;
  1501. {block:IndexPage}
  1502. {block:ifphotofade}
  1503. opacity:0.8;
  1504. -webkit-transition: all 0.8s ease-in-out;
  1505. -moz-transition: all 0.8s ease-in-out;
  1506. -o-transition: all 0.8s ease-in-out;
  1507. {/block:ifphotofade}
  1508.  
  1509. {block:ifmonochromeposts}
  1510. -webkit-filter:grayscale(100%);
  1511. filter:grayscale(100%);
  1512. -webkit-transition: all 0.8s ease-in-out;
  1513. -moz-transition: all 0.8s ease-in-out;
  1514. -o-transition: all 0.8s ease-in-out;
  1515. {/block:ifmonochromeposts}
  1516. {/block:IndexPage}
  1517. }
  1518.  
  1519. .posts:hover .tumblr_video_container {
  1520. opacity:1;
  1521. -webkit-filter:grayscale(0%);
  1522. filter:grayscale(0%);
  1523. }
  1524.  
  1525. #yo-pls-dont-remove-thx {
  1526. position:fixed;
  1527. bottom:0;margin-bottom:15px;
  1528. right:0;margin-right:15px;
  1529. z-index:999999;
  1530. padding:7px 9px;
  1531. background-color:{color:post};
  1532. {block:ifpostborders}border:1px solid {color:post border};{/block:ifpostborders}
  1533. {block:ifnotpostborders}border:1px solid transparent;{/block:ifnotpostborders}
  1534. border-radius:5px;
  1535. font-family:karla;
  1536. text-transform:uppercase;line-height:1em;text-align:center;
  1537. font-size:9px;letter-spacing:1.3px;
  1538. }
  1539.  
  1540. #yo-pls-dont-remove-thx a {
  1541. color:rgba({RGBcolor:text},0.92);
  1542. }
  1543.  
  1544. {CustomCSS}
  1545.  
  1546. /* -- Like + Reblog buttons (1/2) -- */
  1547. /* -- mikedidthis from StackOverflow: //stackoverflow.com/users/2312574/mikedidthis -- */
  1548. /* -- and tutorial by shythemes: //shythemes.tumblr.com/post/147903463743/custom-like-and-reblog-buttons -- */
  1549. .controls {
  1550. transform:scale(1.2,1.2);
  1551. transform-origin:0% 50%;
  1552. display:flex;
  1553. align-items:center;
  1554. }
  1555. .controls a {
  1556. position:relative;
  1557. display:block;
  1558. overflow:hidden;
  1559. padding:3px!important;
  1560. flex-shrink:0;
  1561. }
  1562. .controls a + a {
  1563. }
  1564. .controls svg {
  1565. width:calc({select:font size} - 2px);
  1566. height:auto;
  1567. padding:1px;
  1568. display:block;
  1569. overflow:visible;
  1570. fill:rgba({RGBcolor:permalink text},0.8); /* svg icons color */
  1571. }
  1572. .controls .reblog svg {
  1573. width:calc({select:font size} - 3px); /* rb butt size */
  1574. }
  1575. .controls .like .liked + svg path {
  1576. fill:#ec5a5a; /* LIKED color */
  1577. }
  1578. .controls .like .like_button {
  1579. position:relative;
  1580. }
  1581. .controls .like .like_button iframe {
  1582. position:absolute;
  1583. top:0;
  1584. left:0;
  1585. bottom:0;
  1586. right:0;
  1587. z-index:2;
  1588. opacity:0.000001;
  1589. }
  1590.  
  1591. </style>
  1592.  
  1593. </head>
  1594.  
  1595. <body>
  1596.  
  1597. {block:ifupdatesboxes}
  1598. <div id="star-cont">
  1599. <a class="choco1"><div id="one-holder">
  1600. <div class="penta-holder" style="margin-left:21px;">
  1601. <div class="pentagon"></div>
  1602. </div><!--pentaholder-->
  1603. <div class="tri-holder">
  1604. <div class="triangle"></div>
  1605. <div class="triangle"></div>
  1606. <div class="triangle"></div>
  1607. <div class="triangle"></div>
  1608. <div class="triangle"></div>
  1609. </div><!--triholder-->
  1610. </a></div><!--ONE STAR-->
  1611.  
  1612. <a class="choco2"><div id="one-holder">
  1613. <div class="penta-holder">
  1614. <div class="pentagon"></div>
  1615. </div><!--pentaholder-->
  1616. <div class="tri-holder">
  1617. <div class="triangle"></div>
  1618. <div class="triangle"></div>
  1619. <div class="triangle"></div>
  1620. <div class="triangle"></div>
  1621. <div class="triangle"></div>
  1622. </div><!--triholder-->
  1623. </a></div><!--ONE STAR-->
  1624.  
  1625. <a class="choco3"><div id="one-holder">
  1626. <div class="penta-holder">
  1627. <div class="pentagon"></div>
  1628. </div><!--pentaholder-->
  1629. <div class="tri-holder">
  1630. <div class="triangle"></div>
  1631. <div class="triangle"></div>
  1632. <div class="triangle"></div>
  1633. <div class="triangle"></div>
  1634. <div class="triangle"></div>
  1635. </div><!--triholder-->
  1636. </a></div><!--ONE STAR-->
  1637. </div><!--star-cont-->
  1638.  
  1639.  
  1640. <!----ONE STAR BOX START---->
  1641. <div id="vanilla1">
  1642. <div class="paprika">
  1643. <span class="sf sf-{text:star 1 box icon}"></span>
  1644. <div class="yin">
  1645. <div class="caramel">{text:star 1 title}</div>
  1646. </div><!--yin-->
  1647. </div><!--paprika-->
  1648.  
  1649. <div class="parsley">{text:star 1 box content}</div>
  1650. </div><!--vanilla1-->
  1651. <!----ONE STAR BOX END---->
  1652.  
  1653. <!----ONE STAR BOX START---->
  1654. <div id="vanilla2">
  1655. <div class="paprika">
  1656. <span class="sf sf-{text:star 2 box icon}"></span>
  1657. <div class="yin">
  1658. <div class="caramel">{text:star 2 title}</div>
  1659. </div><!--yin-->
  1660. </div><!--paprika-->
  1661.  
  1662. <div class="parsley">{text:star 2 box content}</div>
  1663. </div><!--vanilla1-->
  1664. <!----ONE STAR BOX END---->
  1665.  
  1666. <!----ONE STAR BOX START---->
  1667. <div id="vanilla3">
  1668. <div class="paprika">
  1669. <span class="sf sf-{text:star 3 box icon}"></span>
  1670. <div class="yin">
  1671. <div class="caramel">{text:star 3 title}</div>
  1672. </div><!--yin-->
  1673. </div><!--paprika-->
  1674.  
  1675. <div class="parsley">{text:star 3 box content}</div>
  1676. </div><!--vanilla1-->
  1677. <!----ONE STAR BOX END---->
  1678. {/block:ifupdatesboxes}
  1679.  
  1680. <script>
  1681. $(document).ready(function(){
  1682. // star box 1
  1683. $('.choco1').click(function(e){
  1684. e.stopPropagation();
  1685. $("#vanilla1").fadeIn('slow');
  1686. $("#vanilla2, #vanilla3").fadeOut('slow');
  1687. });
  1688. // star box 2
  1689. $('.choco2').click(function(e){
  1690. e.stopPropagation();
  1691. $("#vanilla2").fadeIn('slow');
  1692. $("#vanilla1, #vanilla3").fadeOut('slow');
  1693. });
  1694. // star box 3
  1695. $('.choco3').click(function(e){
  1696. e.stopPropagation();
  1697. $("#vanilla3").fadeIn('slow');
  1698. $("#vanilla1, #vanilla2").fadeOut('slow');
  1699. });
  1700. });
  1701.  
  1702. // if(out) = disappear
  1703. $(document).click(function(outside){
  1704. var box = $('#vanilla1, #vanilla2, #vanilla3');
  1705. if(!box.is(outside.target) && box.has(outside.target).length === 0){
  1706. $('#vanilla1, #vanilla2, #vanilla3').fadeOut('slow');
  1707. }
  1708. });
  1709. </script>
  1710.  
  1711.  
  1712. <!---- main shit ---->
  1713. <div id="container">
  1714.  
  1715. <div id="glass">
  1716.  
  1717. <div class="burrito">
  1718. <div class="salsa">
  1719. <div class="goo">
  1720. <div class="desc">{Description}</div>
  1721. </div><!--goo-->
  1722. </div><!--salsa-->
  1723.  
  1724. <img class="angelface" src="{image:sidebar icon}">
  1725.  
  1726. </div><!--burr-->
  1727.  
  1728. <div class="breathe">
  1729. <a href="/">return</a>
  1730. <a href="/ask">message</a>
  1731. <a href="/archive">archive</a>
  1732. </div><!--breathe-->
  1733.  
  1734. <div class="honor">{text:sidebar title}
  1735. <div class="glory">{text:sidebar subtitle}</div>
  1736. </div><!--honor-->
  1737. </div><!--glass-->
  1738.  
  1739. <div id="nudge">
  1740. <div id="postbox">
  1741.  
  1742. <div id="heather"></div>
  1743.  
  1744. <div id="lilac">
  1745. <div class="pupil">
  1746. <div class="coltsfoot">
  1747. {block:ifLink1}<a href="{text:Link 1 URL}">{text:Link 1}</a>{/block:ifLink1}
  1748. {block:ifLink2}<a href="{text:Link 2 URL}">{text:Link 2}</a>{/block:ifLink2}
  1749. {block:ifLink3}<a href="{text:Link 3 URL}">{text:Link 3}</a>{/block:ifLink3}
  1750. {block:ifLink4}<a href="{text:Link 4 URL}">{text:Link 4}</a>{/block:ifLink4}
  1751. {block:ifLink5}<a href="{text:Link 5 URL}">{text:Link 5}</a>{/block:ifLink5}
  1752. {block:ifLink6}<a href="{text:Link 6 URL}">{text:Link 6}</a>{/block:ifLink6}
  1753. {block:ifLink7}<a href="{text:Link 7 URL}">{text:Link 7}</a>{/block:ifLink7}
  1754. {block:ifLink8}<a href="{text:Link 8 URL}">{text:Link 8}</a>{/block:ifLink8}
  1755. {block:ifLink9}<a href="{text:Link 9 URL}">{text:Link 9}</a>{/block:ifLink9}
  1756. {block:ifLink10}<a href="{text:Link 10 URL}">{text:Link 10}</a>{/block:ifLink10}
  1757. </div>
  1758. </div><!--pupil-->
  1759. </div><!--lilac-->
  1760.  
  1761. {block:Pagination}
  1762. <div id="saffron">
  1763. {block:PreviousPage}<a title="Previous" href="{PreviousPage}">«</a>{/block:PreviousPage}
  1764. {block:JumpPagination length="8"}
  1765. {block:CurrentPage}<span class="current_page">{PageNumber}</span>{/block:CurrentPage}
  1766. {block:JumpPage}<a href="{URL}">{PageNumber}</a> {/block:JumpPage}
  1767. {/block:JumpPagination}
  1768. {block:NextPage}<a title="Next" href="{NextPage}">»</a>{/block:NextPage}
  1769. </div>
  1770. {/block:Pagination}
  1771.  
  1772.  
  1773.  
  1774. <div class="small-nudge">
  1775.  
  1776. {block:Posts inlineMediaWidth="1280" inlineNestedMediaWidth="1280"}
  1777. <div class="posts" id="{PostID}" post-type="{PostType}">
  1778.  
  1779. {Block:IndexPage}
  1780. {block:Date}
  1781. <!--citrus types start-->
  1782. {block:Text}
  1783. <div class="citrus non">
  1784. <a href="{Permalink}" title="{PostType} posted {TimeAgo}">
  1785. <span class="sf sf-font"></span>
  1786. <div class="sour">
  1787. {DayOfWeek} {DayOfMonthWithZero}{DayOfMonthSuffix} {Month}
  1788. <br>
  1789. <uke>{24HourWithZero}:{Minutes}{AMPM} @ {NoteCountWithLabel}</uke>
  1790. </div><!--sour-->
  1791. </a><!--link-->
  1792. </div><!--citrus-->
  1793. {/block:Text}
  1794.  
  1795. {block:Photo}
  1796. <div class="citrus non">
  1797. <a href="{Permalink}" title="{PostType} posted {TimeAgo}">
  1798. <span class="sf sf-camera-o"></span>
  1799. <div class="sour">
  1800. {DayOfWeek} {DayOfMonthWithZero}{DayOfMonthSuffix} {Month}
  1801. <br>
  1802. <uke>{24HourWithZero}:{Minutes}{AMPM} @ {NoteCountWithLabel}</uke>
  1803. </div><!--sour-->
  1804. </a><!--link-->
  1805. </div><!--citrus-->
  1806. {/block:Photo}
  1807.  
  1808. {block:Photoset}
  1809. <div class="citrus non">
  1810. <a href="{Permalink}" title="photoset posted {TimeAgo}">
  1811. <span class="sf sf-picture-o"></span>
  1812. <div class="sour">
  1813. {DayOfWeek} {DayOfMonthWithZero}{DayOfMonthSuffix} {Month}
  1814. <br>
  1815. <uke>{24HourWithZero}:{Minutes}{AMPM} @ {NoteCountWithLabel}</uke>
  1816. </div><!--sour-->
  1817. </a><!--link-->
  1818. </div><!--citrus-->
  1819. {/block:Photoset}
  1820.  
  1821. {block:Quote}
  1822. <div class="citrus non">
  1823. <a href="{Permalink}" title="{PostType} posted {TimeAgo}">
  1824. <span class="sf sf-book-o"></span>
  1825. <div class="sour">
  1826. {DayOfWeek} {DayOfMonthWithZero}{DayOfMonthSuffix} {Month}
  1827. <br>
  1828. <uke>{24HourWithZero}:{Minutes}{AMPM} @ {NoteCountWithLabel}</uke>
  1829. </div><!--sour-->
  1830. </a><!--link-->
  1831. </div><!--citrus-->
  1832. {/block:Quote}
  1833.  
  1834. {block:Link}
  1835. <div class="citrus non">
  1836. <a href="{Permalink}" title="{PostType} posted {TimeAgo}">
  1837. <span class="sf sf-link-2-o"></span>
  1838. <div class="sour">
  1839. {DayOfWeek} {DayOfMonthWithZero}{DayOfMonthSuffix} {Month}
  1840. <br>
  1841. <uke>{24HourWithZero}:{Minutes}{AMPM} @ {NoteCountWithLabel}</uke>
  1842. </div><!--sour-->
  1843. </a><!--link-->
  1844. </div><!--citrus-->
  1845. {/block:Link}
  1846.  
  1847. {block:Chat}
  1848. <div class="citrus non">
  1849. <a href="{Permalink}" title="{PostType} posted {TimeAgo}">
  1850. <span class="sf sf-chat-bubbles-o"></span>
  1851. <div class="sour">
  1852. {DayOfWeek} {DayOfMonthWithZero}{DayOfMonthSuffix} {Month}
  1853. <br>
  1854. <uke>{24HourWithZero}:{Minutes}{AMPM} @ {NoteCountWithLabel}</uke>
  1855. </div><!--sour-->
  1856. </a><!--link-->
  1857. </div><!--citrus-->
  1858. {/block:Chat}
  1859.  
  1860. {block:Audio}
  1861. <div class="citrus non">
  1862. <a href="{Permalink}" title="{PostType} posted {TimeAgo}">
  1863. <span class="sf sf-megaphone-1-o"></span>
  1864. <div class="sour">
  1865. {DayOfWeek} {DayOfMonthWithZero}{DayOfMonthSuffix} {Month}
  1866. <br>
  1867. <uke>{24HourWithZero}:{Minutes}{AMPM} @ {NoteCountWithLabel}</uke>
  1868. </div><!--sour-->
  1869. </a><!--link-->
  1870. </div><!--citrus-->
  1871. {/block:Audio}
  1872.  
  1873. {block:Video}
  1874. <div class="citrus non">
  1875. <a href="{Permalink}" title="{PostType} posted {TimeAgo}">
  1876. <span class="sf sf-video-o"></span>
  1877. <div class="sour">
  1878. {DayOfWeek} {DayOfMonthWithZero}{DayOfMonthSuffix} {Month}
  1879. <br>
  1880. <uke>{24HourWithZero}:{Minutes}{AMPM} @ {NoteCountWithLabel}</uke>
  1881. </div><!--sour-->
  1882. </a><!--link-->
  1883. </div><!--citrus-->
  1884. {/block:Video}
  1885.  
  1886. {block:Answer}
  1887. <div class="citrus non">
  1888. <a href="{Permalink}" title="{PostType} posted {TimeAgo}">
  1889. <span class="sf sf-receive-o"></span>
  1890. <div class="sour">
  1891. {DayOfWeek} {DayOfMonthWithZero}{DayOfMonthSuffix} {Month}
  1892. <br>
  1893. <uke>{24HourWithZero}:{Minutes}{AMPM} @ {NoteCountWithLabel}</uke>
  1894. </div><!--sour-->
  1895. </a><!--link-->
  1896. </div><!--citrus-->
  1897. {/block:Answer}
  1898.  
  1899. <div class="vinaigrette non">
  1900.  
  1901. <!-- Like + Reblog buttons (2/2) -->
  1902. <div class="controls">
  1903.  
  1904. <a href="#" title="like this post?" class="like">{LikeButton}
  1905. <svg xmlns="//w3.org/2000/svg" xmlns:xlink="//w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 442.403 442.403" style="enable-background:new 0 0 442.403 442.403;" xml:space="preserve"><g><g><path d="M213.05,422.652c2.833,1.7,5.95,2.833,9.35,2.833c3.117,0,6.517-0.85,9.35-2.833c7.65-5.1,187.283-123.533,207.683-243.95 c10.483-62.333-8.783-100.867-26.633-122.117c-20.967-24.933-52.133-39.667-83.017-39.667c-10.2,0-20.117,1.7-28.9,5.1 c-43.067,16.15-72.25,44.767-88.117,64.317c-15.583-19.267-42.217-47.033-74.517-58.083c-9.917-3.4-20.683-5.1-32.017-5.1 c-28.9,0-56.383,11.9-75.367,32.867c-16.717,18.417-35.7,53.55-29.75,114.75C13.016,291.185,204.833,417.268,213.05,422.652z M56.083,78.685c17.283-18.983,38.817-21.817,50.15-21.817c7.367,0,14.45,1.133,20.967,3.4 c39.383,13.317,70.833,63.467,71.4,63.75c3.117,5.1,8.783,8.217,14.733,7.933c5.95,0,11.333-3.4,14.45-8.5 c0.283-0.567,28.617-48.733,85.283-69.983c4.817-1.7,10.767-2.833,16.717-2.833c20.967,0,42.217,10.483,56.95,27.767 c19.267,22.667,25.783,55.533,18.983,94.633c-7.367,43.067-42.5,94.633-101.717,149.317c-33.433,30.883-66.3,54.683-81.6,65.45 c-16.15-11.05-51-36.55-86.417-68.85C74.216,262.285,39.366,209.868,35.116,167.368C31.433,128.552,38.516,97.952,56.083,78.685z"/></g></g></svg>
  1906. </a>
  1907.  
  1908. <a href="{ReblogURL}" title="reblog this post?" target="_blank" class="reblog">
  1909. <svg xmlns="//w3.org/2000/svg" xmlns:xlink="//w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 361.095 361.095" style="enable-background:new 0 0 361.095 361.095;" xml:space="preserve"><g><g><path d="M182.595,325.678c-63.183,0-120.133-42.217-138.267-102.567c-2.833-9.067-12.183-14.167-21.25-11.333 c-9.067,2.833-14.167,12.183-11.333,21.25c22.95,75.933,91.517,126.65,170.85,126.65c98.317,0,178.5-80.183,178.5-178.5 s-80.183-178.5-178.5-178.5c-55.817,0-108.233,26.633-141.667,69.7l-7.083-56.1c-1.133-9.35-9.633-15.867-18.983-14.733 C5.511,2.678-1.005,11.178,0.128,20.528l13.317,103.7c1.133,8.5,8.5,14.733,16.717,14.733c0.567,0,1.417,0,1.983,0l102.567-11.617 c9.35-1.133,16.15-9.35,15.017-18.7s-9.35-16.15-18.7-15.017l-68.85,7.65c26.633-39.95,71.683-64.6,120.417-64.6 c79.617,0,144.5,64.883,144.5,144.5S262.211,325.678,182.595,325.678z"/></g></g></svg>
  1910. </a>
  1911.  
  1912. </div><!--controls-->
  1913. </div><!--vinegar-->
  1914.  
  1915. <!--citrus types end-->
  1916. {/block:Date}
  1917. {/block:IndexPage}
  1918.  
  1919.  
  1920.  
  1921. <!--citrus on perma ONLY-->
  1922. {block:PermalinkPage}
  1923. {block:Date}
  1924. <div class="citrus non">
  1925. <span class="sf sf-jupiter-o"></span>
  1926. <div class="sour">
  1927. Posted on {Year} {Month} {DayOfMonthWithZero}{DayOfMonthSuffix}
  1928. <br>
  1929. <uke>{DayOfWeek} {24HourWithZero}:{Minutes}{AMPM} @ {NoteCountWithLabel}</uke>
  1930. </div><!--sour-->
  1931. </div><!--citrus-->
  1932.  
  1933. {block:RebloggedFrom}
  1934. <div class="vinaigrette salad non">
  1935. <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a> / <a href="{ReblogRootURL}" title="{ReblogRootName}">source</a>
  1936. </span>
  1937. </div><!--vinaigrette-->
  1938. {/block:RebloggedFrom}
  1939.  
  1940. {/block:Date}
  1941. {/block:PermalinkPage}
  1942.  
  1943.  
  1944. {block:Text}
  1945. {block:Title}<h1>{Title}</h1>{/block:Title}
  1946. <div class="pp">{Body}</div>
  1947. {/block:Text}
  1948.  
  1949.  
  1950. {block:Photo}
  1951.  
  1952. <div class="photos">
  1953. <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>
  1954.  
  1955. {block:Caption}{Caption}{/block:Caption}
  1956. {/block:Photo}
  1957.  
  1958.  
  1959. {block:Photoset}
  1960.  
  1961. <div class="photos">
  1962. <div class="non">
  1963. <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>
  1964. </div>
  1965. </div>
  1966.  
  1967. {block:Caption}{Caption}{/block:Caption}
  1968. {/block:Photoset}
  1969.  
  1970.  
  1971. {block:Quote}
  1972. <div class="daydreamer"><span class="sf sf-quotation-mark"></span></div>
  1973. <div class="quote">{Quote}</div>
  1974. {block:Source}<div class="quotesource"> — {Source}</div>
  1975. {/block:Source}{/block:Quote}
  1976.  
  1977.  
  1978. {block:Link}
  1979. <h1><div class="non"><a href="{URL}" {Target}>{Name} »</a></div></h1>
  1980. {block:Description}{Description}{/block:Description}
  1981. {/block:Link}
  1982.  
  1983.  
  1984. {block:Chat}
  1985. {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>
  1986. {/block:Chat}
  1987.  
  1988.  
  1989. {block:Audio}
  1990. {block:AudioPlayer}
  1991. <div class="audiowrapper">
  1992. <div class="playerbutton">
  1993. {AudioPlayer}
  1994. </div>
  1995.  
  1996. <div class="trackdetails">
  1997. <b>TRACK:</b> {block:TrackName}{TrackName}{/block:TrackName}<br>
  1998.  
  1999. <b>ARTIST:</b> {block:Artist}{Artist}{/block:Artist}<br>
  2000.  
  2001. <b>PLAYS:</b> {FormattedPlayCount}</div></div>
  2002. {/block:AudioPlayer}
  2003.  
  2004. {block:Caption}
  2005. <div class="caption">{Caption}</div>
  2006. {/block:Caption}
  2007. {/block:Audio}
  2008.  
  2009.  
  2010. {block:Video}
  2011. <div class="video">{Video-500}</div>
  2012. {block:Caption}{Caption}{/block:Caption}
  2013. {/block:Video}
  2014.  
  2015.  
  2016. {block:Answer}
  2017. <div class="q-wrap">
  2018. <img class="askimg" src="{AskerPortraitURL-64}" ondragstart='return false;'>
  2019. <div class="question">
  2020. <div class="asker"><b>{Asker} asked:</b></div>
  2021. {Question}</div><!--question-->
  2022. </div><!--qwrap-->
  2023. <div class="answer">{Answer}</div><!--answer-->
  2024. {/block:Answer}
  2025.  
  2026.  
  2027. {block:HasTags}
  2028. <div class="tagsin nonn">
  2029. {block:Tags}
  2030. <a href="{TagURL}">#{Tag}</a>
  2031. {/block:Tags}
  2032. </div>
  2033. {/block:HasTags}
  2034.  
  2035. </div><!--posts-->
  2036.  
  2037.  
  2038. {block:PostNotes}
  2039. {PostNotes}
  2040. {/block:PostNotes}
  2041.  
  2042. {/block:Posts}
  2043.  
  2044. </div><!--small-nudge-->
  2045. </div><!--postbox-->
  2046. </div><!--nudge-->
  2047. </div><!--cont-->
  2048.  
  2049. <div id="yo-pls-dont-remove-thx"><a href="//glenthemes.tumblr.com" title="theme by glenthemes">glenthemes</a></div>
  2050.  
  2051. </body>
  2052. </html>
Advertisement
Add Comment
Please, Sign In to add comment