zojoh

Thirty Five

Oct 19th, 2013
10,989
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <!---
  5.  
  6. Theme #35 by Heidi @ladmilk
  7.  
  8.  
  9. Credit:
  10. Masonry: (masonry.desandro.com)
  11. Infinitescroll: Paulirish (https://github.com/infinite-scroll/infinite-scroll)
  12. Photoset: PixelUnion (https://github.com/PixelUnion/Extended-Tumblr-Photoset)
  13. Tool-tips: Malihu (manos.malihu.gr/style-my-tooltips-jquery-plugin/)
  14. Video Resizing: Shy Themes (http://shythemes.tumblr.com/post/134536748863/tutorial-resizing-videos)
  15.  
  16.  
  17. ---->
  18.  
  19.  
  20. <head>
  21. <title>{Title}</title>
  22. {block:Description}
  23. <meta name="description" content="{MetaDescription}" />
  24. {/block:Description}
  25. <link rel="shortcut icon" href="{Favicon}" />
  26. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  27.  
  28.  
  29. <meta name="color:Background" content="#ffffff" />
  30. <meta name="color:Posts" content="#fffff" />
  31. <meta name="color:Posts Title" content="#555555" />
  32. <meta name="color:Text" content="#888888" />
  33. <meta name="color:Links" content="#bbbbbb" />
  34. <meta name="color:Links Hover" content="#222222" />
  35. <meta name="color:Bold" content="#555555" />
  36. <meta name="color:Italic" content="#cccccc"/>
  37. <meta name="color:Blockquote" content="#eeeeee"/>
  38. <meta name="color:Borders" content="#f3f3f3" />
  39.  
  40. <meta name="color:Perma" content="#000000" />
  41. <meta name="color:Perma Text" content="#bbbbbb" />
  42.  
  43. <meta name="color:Title" content="#555555" />
  44. <meta name="color:Top Text" content="#aaaaaa" />
  45.  
  46. <meta name="color:Scroll" content="#ffffff" />
  47. <meta name="color:Scrollbar" content="#dddddd" />
  48.  
  49.  
  50. <meta name="image:Background" content="" />
  51. <meta name="image:Permalink Icon" content="http://static.tumblr.com/3yblkz0/QOJnyqjey/cross.png" />
  52. <meta name="image:Reblog Icon" content="http://static.tumblr.com/3yblkz0/shinyqjfp/reblog.gif" />
  53.  
  54.  
  55. <meta name="if:Sticky Top" content="0" />
  56. <meta name="if:Bottom Pagination" content="0" />
  57.  
  58. <meta name="if:Image Fade" content="0" />
  59. <meta name="if:Image Grayscale" content="0" />
  60.  
  61. <meta name="if:Show Captions" content="0" />
  62.  
  63. <meta name="if:Infinitescroll" content="0" />
  64. <meta name="if:Manual Load" content="0" />
  65.  
  66.  
  67. <meta name="select:Tumblr Controls" content="t_w" title="White" />
  68. <meta name="select:Tumblr Controls" content="t_g" title="Grey" />
  69. <meta name="select:Tumblr Controls" content="t_b" title="Black" />
  70.  
  71. <meta name="select:Perma Type" content="dif" title="Different" />
  72. <meta name="select:Perma Type" content="sam1" title="Same : Hover" />
  73. <meta name="select:Perma Type" content="sam2" title="Same : Text" />
  74.  
  75. <meta name="select:Caption Blockquote" content="bdef" title="Normal" />
  76. <meta name="select:Caption Blockquote" content="blin" title="Inline" />
  77. <meta name="select:Caption Blockquote" content="bcen" title="Center" />
  78. <meta name="select:Caption Blockquote" content="bnon" title="None" />
  79.  
  80. <meta name="select:Columns" content="1" title="1" />
  81. <meta name="select:Columns" content="2" title="2" />
  82. <meta name="select:Columns" content="3" title="3" />
  83. <meta name="select:Columns" content="4" title="4" />
  84.  
  85. <meta name="select:Post Size" content="200" title="200px" />
  86. <meta name="select:Post Size" content="250" title="250px" />
  87. <meta name="select:Post Size" content="300" title="300px" />
  88. <meta name="select:Post Size" content="350" title="350px" />
  89. <meta name="select:Post Size" content="400" title="400px" />
  90. <meta name="select:Post Size" content="450" title="450px" />
  91. <meta name="select:Post Size" content="500" title="500px" />
  92.  
  93. <meta name="select:Post Size Permalinkpage" content="200" title="200px" />
  94. <meta name="select:Post Size Permalinkpage" content="250" title="250px" />
  95. <meta name="select:Post Size Permalinkpage" content="300" title="300px" />
  96. <meta name="select:Post Size Permalinkpage" content="350" title="350px" />
  97. <meta name="select:Post Size Permalinkpage" content="400" title="400px" />
  98. <meta name="select:Post Size Permalinkpage" content="450" title="450px" />
  99. <meta name="select:Post Size Permalinkpage" content="500" title="500px" />
  100.  
  101. <meta name="select:Padding" content="5" title="5px" />
  102. <meta name="select:Padding" content="10" title="10px" />
  103. <meta name="select:Padding" content="15" title="15px" />
  104. <meta name="select:Padding" content="20" title="20px" />
  105.  
  106. <meta name="select:Margin" content="10" title="10px" />
  107. <meta name="select:Margin" content="15" title="15px" />
  108. <meta name="select:Margin" content="20" title="20px" />
  109. <meta name="select:Margin" content="25" title="25px" />
  110. <meta name="select:Margin" content="30" title="30px" />
  111. <meta name="select:Margin" content="40" title="40px" />
  112. <meta name="select:Margin" content="50" title="50px" />
  113.  
  114.  
  115. <meta name="text:Link1" content="" />
  116. <meta name="text:Title1" content="" />
  117. <meta name="text:Link2" content="" />
  118. <meta name="text:Title2" content="" />
  119. <meta name="text:Link3" content="" />
  120. <meta name="text:Title3" content="" />
  121. <meta name="text:Link4" content="" />
  122. <meta name="text:Title4" content="" />
  123. <meta name="text:Link5" content="" />
  124. <meta name="text:Title5" content="" />
  125.  
  126.  
  127. <link href="http://static.tumblr.com/3yblkz0/EkLnyuqmx/pxu_ps.css" rel="stylesheet" type="text/css"/>
  128.  
  129.  
  130.  
  131. <!----------- Font ---------------->
  132.  
  133.  
  134. <meta name="select:Body Font" content="Lato" title="Lato" />
  135. <meta name="select:Body Font" content="Roboto" title="Roboto" />
  136. <meta name="select:Body Font" content="Open Sans" title="Open Sans" />
  137. <meta name="select:Body Font" content="calibri" title="Calibri" />
  138. <meta name="select:Body Font" content="helvetica" title="Helvetica" />
  139. <meta name="select:Body Font" content="trebuchet ms" title="Trebuchet ms" />
  140. <meta name="select:Body Font" content="Lora" title="Lora" />
  141. <meta name="select:Body Font" content="Droid Serif" title="Droid Serif" />
  142. <meta name="select:Body Font" content="cambria" title="Cambria" />
  143. <meta name="select:Body Font" content="georgia" title="Georgia" />
  144. <meta name="select:Body Font" content="times new roman" title="Times New Roman" />
  145. <meta name="select:Body Font" content="courier" title="Courier" />
  146. <meta name="select:Body Font" content="consolas" title="Consolas" />
  147. <meta name="select:Body Font" content="lucida console" title="Lucida Console" />
  148.  
  149. <meta name="select:Body Font Size" content="8" title="8px" />
  150. <meta name="select:Body Font Size" content="9" title="9px" />
  151. <meta name="select:Body Font Size" content="10" title="10px" />
  152. <meta name="select:Body Font Size" content="11" title="11px" />
  153. <meta name="select:Body Font Size" content="12" title="12px" />
  154.  
  155. <meta name="select:Title Font" content="Lato" title="Lato" />
  156. <meta name="select:Title Font" content="Roboto" title="Roboto" />
  157. <meta name="select:Title Font" content="Open Sans" title="Open Sans" />
  158. <meta name="select:Title Font" content="calibri" title="Calibri" />
  159. <meta name="select:Title Font" content="helvetica" title="Helvetica" />
  160. <meta name="select:Title Font" content="trebuchet ms" title="Trebuchet ms" />
  161. <meta name="select:Title Font" content="Lora" title="Lora" />
  162. <meta name="select:Title Font" content="Droid Serif" title="Droid Serif" />
  163. <meta name="select:Title Font" content="cambria" title="Cambria" />
  164. <meta name="select:Title Font" content="georgia" title="Georgia" />
  165. <meta name="select:Title Font" content="times new roman" title="Times New Roman" />
  166. <meta name="select:Title Font" content="courier" title="Courier" />
  167. <meta name="select:Title Font" content="consolas" title="Consolas" />
  168. <meta name="select:Title Font" content="lucida console" title="Lucida Console" />
  169.  
  170. <meta name="select:Accent Font" content="Lato" title="Lato" />
  171. <meta name="select:Accent Font" content="Roboto" title="Roboto" />
  172. <meta name="select:Accent Font" content="Open Sans" title="Open Sans" />
  173. <meta name="select:Accent Font" content="calibri" title="Calibri" />
  174. <meta name="select:Accent Font" content="helvetica" title="Helvetica" />
  175. <meta name="select:Accent Font" content="trebuchet ms" title="Trebuchet ms" />
  176. <meta name="select:Accent Font" content="Lora" title="Lora" />
  177. <meta name="select:Accent Font" content="Droid Serif" title="Droid Serif" />
  178. <meta name="select:Accent Font" content="cambria" title="Cambria" />
  179. <meta name="select:Accent Font" content="georgia" title="Georgia" />
  180. <meta name="select:Accent Font" content="times new roman" title="Times New Roman" />
  181. <meta name="select:Accent Font" content="courier" title="Courier" />
  182. <meta name="select:Accent Font" content="consolas" title="Consolas" />
  183. <meta name="select:Accent Font" content="lucida console" title="Lucida Console" />
  184.  
  185.  
  186. <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,700,300|Roboto:400,700,300|Lato:400,300,700|Lora:400,700|Droid+Serif:400,700' rel='stylesheet' type='text/css' />
  187.  
  188.  
  189.  
  190. <style type="text/css">
  191.  
  192.  
  193.  
  194. /* Tumblr Controls */
  195.  
  196.  
  197. .t_b .tmblr-iframe--desktop-logged-in-controls, .tmblr-iframe, .t_b #tumblr_controls, #tumblr_controls {
  198. top:0%!important;
  199. right:0%!important;
  200. position:fixed!important;
  201. z-index:999999999!important;
  202. }
  203.  
  204. .t_w .tmblr-iframe--desktop-logged-in-controls, .t_w #tumblr_controls {
  205. -webkit-filter:invert(100%);
  206. -moz-filter:invert(100%);
  207. -o-filter:invert(100%);
  208. -ms-filter:invert(100%);
  209. filter:invert(100%);
  210. opacity:0.3;
  211. }
  212.  
  213. .t_g .tmblr-iframe--desktop-logged-in-controls, .t_g #tumblr_controls {
  214. -webkit-filter:invert(70%);
  215. -moz-filter:invert(70%);
  216. -o-filter:invert(70%);
  217. -ms-filter:invert(70%);
  218. filter:invert(70%);
  219. opacity:0.4;
  220. }
  221.  
  222.  
  223.  
  224. /* Scrollbar */
  225.  
  226.  
  227. ::-webkit-scrollbar { width:7px; height:7px; }
  228.  
  229. ::-webkit-scrollbar-track-piece { background-color:{color:Scroll}; }
  230.  
  231. ::-webkit-scrollbar-thumb {
  232. background-color:{color:Scrollbar};
  233. border:2px solid {color:Scroll};
  234. }
  235.  
  236.  
  237.  
  238. /* Body - General */
  239.  
  240.  
  241. html, body { margin:0; padding:0; border:0; }
  242.  
  243. body {
  244. background-image:url('{image:Background}');
  245. background-attachment:fixed;
  246. background-repeat:repeat;
  247. background-color:{color:Background};
  248. color:{color:Text};
  249. font-family:{select:Body Font}, sans-serif;
  250. font-size:{select:Body Font Size}px;
  251. line-height:140%;
  252. word-wrap:break-word;
  253. }
  254.  
  255. a {
  256. color:{color:Links};
  257. text-decoration:none;
  258. transition-duration: 0.6s;
  259. -moz-transition-duration: 0.6s;
  260. -webkit-transition-duration: 0.6s;
  261. -o-transition-duration: 0.6s;
  262. }
  263.  
  264. a:hover, .ptext_perma a:hover { color:{color:Links Hover}; }
  265.  
  266. b, strong { color:{color:Bold}; font-weight:bold; }
  267.  
  268. i, em { color:{color:Italic}; font-style:italic; }
  269.  
  270. h1, h2, h3, h4, h5 {
  271. margin:5px 0;
  272. font-size:120%;
  273. font-weight:normal;
  274. line-height:120%;
  275. }
  276.  
  277. .posts > h2 {
  278. margin-top:0;
  279. color:{color:Posts Title};
  280. font-family:{select:Title Font};
  281. letter-spacing:1px;
  282. text-transform:uppercase;
  283. }
  284.  
  285. .posts > h2:only-child { margin:0; }
  286.  
  287. header nav, .pagination, .ptext_perma, #load, #asker, #audio, .notes {
  288. font-family:{select:Accent Font};
  289. font-size:8px;
  290. letter-spacing:2px;
  291. text-transform:uppercase;
  292. }
  293.  
  294. small, sub, sup { font-size:90%; }
  295.  
  296. big { font-size:110%; }
  297.  
  298. sub, sup, small, big { vertical-align:baseline; }
  299.  
  300. p { margin:5px 0; padding:0; }
  301.  
  302. p:first-of-type { margin-top:0; }
  303.  
  304. p:last-of-type { margin-bottom:0; }
  305.  
  306. pre {
  307. margin:5px 0;
  308. padding:2px 4px;
  309. background:#f4f4f4;
  310. white-space:pre-wrap;
  311. word-wrap:break-word;
  312. }
  313.  
  314. .cap { margin:5px 0 0 0; }
  315.  
  316. .cp { display:none; }
  317.  
  318. blockquote, .bdef blockquote {
  319. margin:5px 0;
  320. padding:2px 0 2px 10px;
  321. border-left:1px solid {color:Blockquote};
  322. }
  323.  
  324. .bcen { text-align:center; }
  325.  
  326. .bnon blockquote, .bcen blockquote { border:0; padding:0; }
  327.  
  328. .blin blockquote { margin:0; padding:0; border:0; display:inline; }
  329.  
  330. .blin p { display:block; }
  331.  
  332. .blin p:first-of-type { display:inline; }
  333.  
  334. ul, ol { margin:5px 10px 5px 15px; padding:0; }
  335.  
  336. ul { list-style:square; }
  337.  
  338.  
  339.  
  340. /* Center wrapper - Posts */
  341.  
  342.  
  343. #wrapper {
  344. {block:IndexPage}
  345. width:calc(({select:Post Size}px + 2px + {select:Padding}px*2 + {select:Margin}px*2)*{select:Columns});
  346. margin:20px auto 80px auto;
  347. {/block:IndexPage}
  348. {block:PermalinkPage}
  349. width:calc({select:Post Size Permalinkpage}px + 2px + {select:Padding}px*2);
  350. margin:calc({select:Margin}px + 20px) auto 80px auto;
  351. {/block:PermalinkPage}
  352. padding:0;
  353. position:relative;
  354. border:0;
  355. }
  356.  
  357. .posts {
  358. {block:IndexPage}
  359. width:{select:Post Size}px;
  360. margin:{select:Margin}px;
  361. {/block:IndexPage}
  362. {block:PermalinkPage}
  363. width:{select:Post Size Permalinkpage}px;
  364. margin:{select:Margin}px auto 10px auto;
  365. {/block:PermalinkPage}
  366. height:auto;
  367. padding:{select:Padding}px;
  368. position:relative;
  369. border:1px solid {color:Borders};
  370. background:{color:Posts};
  371. color:{color:Text};
  372. }
  373.  
  374. .sam1 .posts { min-height:30px; }
  375.  
  376.  
  377.  
  378. /* Image */
  379.  
  380.  
  381. .posts img, img :not(.lightbox-image) { max-width:100%; height:auto; }
  382.  
  383. #photo img { width:100%; display:block;}
  384.  
  385.  
  386.  
  387. /* Photoset */
  388.  
  389.  
  390. .tmblr-lightbox, #tumblr_lightbox { background:rgba({RGBcolor:Background}, .7)!important; }
  391.  
  392. .vignette, #vignette, .lightbox-caption, #tumblr_lightbox_caption { opacity:0!important; }
  393.  
  394. .lightbox-image, #tumblr_lightbox img {
  395. border-radius:0px!important;
  396. -webkit-border-radius:0px!important;
  397. -moz-border-radius:0px!important;
  398. box-shadow:none!important;
  399. -webkit-box-shadow:none!important;
  400. -moz-box-shadow:none!important;
  401. }
  402.  
  403.  
  404.  
  405. /* Video */
  406.  
  407.  
  408. #vid, #vid iframe { display:block; overflow:hidden; }
  409.  
  410.  
  411.  
  412. {block:IndexPage}
  413. #vid, .photo-data, #photo img{
  414. {block:ifImageFade}
  415. opacity:.7;
  416. {/block:ifImageFade}
  417. {block:ifImageGrayscale}
  418. -webkit-filter:grayscale(100%);
  419. -moz-filter:grayscale(100%);
  420. -ms-filter:grayscale(100%);
  421. -o-filter:grayscale(100%);
  422. filter:grayscale(100%);
  423. {/block:ifImageGrayscale}
  424. -webkit-transition:all .7s ease;
  425. -moz-transition:all .7s ease;
  426. -o-transition:all .7s ease;
  427. transition:all .7s ease;
  428. }
  429.  
  430. .posts:hover #photo img, .posts:hover .photo-data, .posts:hover #vid {
  431. {block:ifImageFade}
  432. opacity:1;
  433. {/block:ifImageFade}
  434. {block:ifImageGrayscale}
  435. -webkit-filter:grayscale(0%);
  436. -moz-filter:grayscale(0%);
  437. -ms-filter:grayscale(0%);
  438. -o-filter:grayscale(0%);
  439. filter:grayscale(0%);
  440. {/block:ifImageGrayscale}
  441. }
  442. {/block:IndexPage}
  443.  
  444.  
  445.  
  446. /* Audio */
  447.  
  448. #audio {
  449. margin-bottom:10px;
  450. padding: 5px 10px;
  451. border:1px solid {color:Borders};
  452. background:#fff;
  453. text-align:center;
  454. }
  455.  
  456. iframe.tumblr_audio_player {
  457. width:100%;
  458. height:50px;
  459. padding:0 10px;
  460. display:block;
  461. overflow:hidden;
  462. box-sizing:border-box;
  463. border:1px solid {color:Borders};
  464. background:#fff;
  465. }
  466.  
  467. iframe.soundcloud_audio_player {
  468. {block:IndexPage}
  469. width:{select:Post Size}px;
  470. {/block:IndexPage}
  471. {block:PermalinkPage}
  472. width:{select:Post Size Permalinkpage}px;
  473. {/block:PermalinkPage}
  474. height:auto!important;
  475. display:block;
  476. }
  477.  
  478. iframe.spotify_audio_player { height:80px!important; display:block; }
  479.  
  480.  
  481.  
  482. /* Quote */
  483.  
  484.  
  485. #quote { font-size:120%; text-align:center; }
  486.  
  487. #source { margin-top:10px; text-align:center; }
  488.  
  489.  
  490.  
  491. /* Ask */
  492.  
  493.  
  494. #question {
  495. margin-bottom:10px;
  496. padding-bottom:10px;
  497. border-bottom:1px solid {color:Borders};
  498. }
  499.  
  500.  
  501.  
  502. /* Perma - Indexpage */
  503.  
  504.  
  505. .pmedia_perma {
  506. width:auto;
  507. height:auto;
  508. margin:0;
  509. position:absolute;
  510. opacity:0;
  511. z-index:9999;
  512. -webkit-transition:all .7s ease;
  513. -moz-transition:all .7s ease;
  514. -o-transition:all .7s ease;
  515. transition:all .7s ease;
  516. }
  517.  
  518. .posts:hover .pmedia_perma { opacity:1; }
  519.  
  520. .pmedia_perma a {
  521. width:10px;
  522. height:10px;
  523. margin-right:3px;
  524. padding:10px;
  525. display:inline-block;
  526. background:{color:Perma};
  527. text-align:center;
  528. }
  529.  
  530. .pmedia_perma a:hover { opacity:.5; }
  531.  
  532. .pmedia_perma img { max-width:10px; max-height:10px; display:block; }
  533.  
  534. .ptext_perma {
  535. margin-top:calc({select:Padding}px/2);
  536. margin-bottom:calc(-{select:Padding}px/2);
  537. margin-right:calc(-{select:Padding}px/2);
  538. text-align:right;
  539. }
  540.  
  541. .ptext_perma a { color:{color:Perma Text}; }
  542.  
  543. .dif .ptext .pmedia_perma, .dif .pmedia .ptext_perma { display:none; }
  544. .sam1 .ptext_perma { display:none; }
  545. .sam2 .pmedia_perma { display:none; }
  546.  
  547.  
  548.  
  549. /* Post Information - Notes - Permalinkpage */
  550.  
  551.  
  552. .posts_info {
  553. margin:20px 0;
  554. color:{color:Top Text};
  555. text-transform:lowercase;
  556. }
  557.  
  558. .posts_info a, .posts_info span { margin:0 3px; }
  559.  
  560. ol.notes {
  561. margin:20px 0;
  562. padding:0;
  563. list-style-type:none;
  564. color:{color:Top Text};
  565. }
  566.  
  567. li.note { padding:5px 0; }
  568.  
  569. img.avatar { display:none; }
  570.  
  571.  
  572.  
  573. /* Header - Pagination */
  574.  
  575.  
  576. header {
  577. {block:IndexPage}
  578. width:calc(({select:Post Size}px + 2px + {select:Padding}px*2 + {select:Margin}px*2)*{select:Columns} - {select:Margin}px*2);
  579. {/block:IndexPage}
  580. {block:PermalinkPage}
  581. width:calc({select:Post Size Permalinkpage}px + 2px + {select:Padding}px*2);
  582. {/block:PermalinkPage}
  583. margin:80px auto 0px auto;
  584. position:relative;
  585. }
  586.  
  587. .inner {
  588. {block:IndexPage}
  589. width:calc(({select:Post Size}px + 2px + {select:Padding}px*2 + {select:Margin}px*2)*{select:Columns} - {select:Margin}px*2);
  590. {/block:IndexPage}
  591. {block:PermalinkPage}
  592. width:calc({select:Post Size Permalinkpage}px + 2px + {select:Padding}px*2);
  593. {/block:PermalinkPage}
  594. {block:ifStickyTop}
  595. margin:0;
  596. position:absolute;
  597. {/block:ifStickyTop}
  598. padding-bottom:10px;
  599. border-bottom:1px solid {color:Borders};
  600. background:{color:Background};
  601. color:{color:Top Text};
  602. z-index:99999;
  603. -webkit-transition:all .7s ease;
  604. -moz-transition:all .7s ease;
  605. -o-transition:all .7s ease;
  606. transition:all .7s ease;
  607. }
  608.  
  609. {block:ifStickyTop}
  610. .fixed .inner { top:0; padding-top:30px; position:fixed; }
  611. {/block:ifStickyTop}
  612.  
  613. header h1 {
  614. margin-right:10px;
  615. display:inline;
  616. color:{color:Title};
  617. font-family:{select:Title Font};
  618. letter-spacing:1px;
  619. }
  620.  
  621. header nav { margin-left:10px; display:inline; clear:both; }
  622.  
  623. header nav a { margin:0 5px; }
  624.  
  625. header nav a:first-of-type { margin-left:0; }
  626.  
  627. .desc { margin-top:5px; clear:both; }
  628.  
  629. {block:ifnotBottomPagination}
  630. .pagination { display:inline; float:right; }
  631. {/block:ifnotBottomPagination}
  632.  
  633. {block:ifInfinitescroll}
  634. .pagination { display:none; }
  635.  
  636. #infscr-loading { display:none!important; }
  637. {/block:ifInfinitescroll}
  638.  
  639.  
  640.  
  641. /* Footer - Load More */
  642.  
  643.  
  644. footer { margin:80px auto; text-align:center; }
  645.  
  646. #load { cursor:pointer; }
  647.  
  648.  
  649.  
  650. /* Fade */
  651.  
  652.  
  653. @keyframes fadein {
  654. from { opacity: 0; }
  655. to { opacity: 1; }
  656. }
  657. @-moz-keyframes fadein {
  658. from { opacity: 0; }
  659. to { opacity: 1; }
  660. }
  661.  
  662. @-webkit-keyframes fadein {
  663. from { opacity: 0; }
  664. to { opacity: 1; }
  665. }
  666.  
  667. .posts, header, footer {
  668. animation: fadein 2s;
  669. -webkit-animation: fadein 2s;
  670. -moz-animation: fadein 2s;
  671. }
  672.  
  673.  
  674.  
  675. /* Tooltips */
  676.  
  677.  
  678. #s-m-t-tooltip{
  679. max-width:300px;
  680. margin:25px 15px;
  681. padding:2px 5px;
  682. z-index:999999;
  683. border:1px solid {color:Borders};
  684. background:{color:Posts};
  685. color:{color:Text};
  686. }
  687.  
  688.  
  689.  
  690. {CustomCSS}
  691.  
  692.  
  693.  
  694. </style>
  695.  
  696.  
  697. <!---- Scripts ---->
  698.  
  699.  
  700. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  701.  
  702. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  703. <script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  704. <script src="http://static.tumblr.com/3yblkz0/Bu3nywvqg/shythemes_vr.js"></script>
  705.  
  706. {block:ifStickyTop}
  707. <script>
  708. $(document).ready(function(){
  709. var stick = $('header').offset();
  710. $(document).scroll(function(){
  711. if ($(document).scrollTop() > stick.top)
  712. { $('header').addClass('fixed'); }
  713. else
  714. { $('header').removeClass('fixed'); }
  715. });
  716. });
  717. </script>
  718. {/block:ifStickyTop}
  719.  
  720. <script>
  721. $(document).ready(function(){
  722. {block:ifStickyTop}
  723. var ih = $(".inner").outerHeight();
  724. $("header").css({"height" : ih });
  725. {/block:ifStickyTop}
  726. $("[title],a[title],img[title]").style_my_tooltips({
  727. tip_follows_cursor:true,
  728. tip_delay_time:30,
  729. tip_fade_speed:800,
  730. attribute:"title"
  731. });
  732. $('.photo-slideshow').pxuPhotoset({
  733. lightbox: true,
  734. rounded: false,
  735. gutter: '3px',
  736. borderRadius: '0px',
  737. photoset: '.photo-slideshow',
  738. photoWrap: '.photo-data',
  739. photo: '.pxu-photo'
  740. });
  741. });
  742. </script>
  743.  
  744.  
  745.  
  746. </head>
  747. <body class="{select:Tumblr Controls}">
  748.  
  749.  
  750.  
  751. <header><div class="inner">
  752. {block:ShowTitle}<h1>{Title}</h1>{/block:ShowTitle} —
  753. <nav>
  754. <a href="/">home</a>
  755. <a href="/ask">inbox</a>
  756. <a href="/archive">archive</a>
  757. {block:ifLink1}<a href="{text:Link1}">{text:Title1}</a>{/block:ifLink1}
  758. {block:ifLink2}<a href="{text:Link2}">{text:Title2}</a>{/block:ifLink2}
  759. {block:ifLink3}<a href="{text:Link3}">{text:Title3}</a>{/block:ifLink3}
  760. {block:ifLink4}<a href="{text:Link4}">{text:Title4}</a>{/block:ifLink4}
  761. {block:ifLink5}<a href="{text:Link5}">{text:Title5}</a>{/block:ifLink5}
  762. </nav>
  763. {block:ifnotBottomPagination}{block:Pagination}<div class="pagination">
  764. {block:PreviousPage}<a href="{PreviousPage}">less</a> /{/block:PreviousPage}
  765. {block:NextPage}<a id="next" href="{NextPage}">more</a>{/block:NextPage}
  766. </div>{/block:Pagination}{/block:ifnotBottomPagination}
  767. {block:ShowDescription}<div class="desc">{Description}</div>{/block:ShowDescription}
  768. </div></header>
  769.  
  770.  
  771.  
  772. <section id="wrapper" class="{select:Perma Type}">
  773. {block:Posts}
  774. <article class="posts {block:Text}ptext{/block:Text}{block:Link}ptext{/block:Link}{block:Answer}ptext{/block:Answer}{block:Quote}ptext{/block:Quote}{block:Chat}ptext{/block:Chat}{block:Audio}ptext{/block:Audio}{block:Photo}pmedia{/block:Photo}{block:Photoset}pmedia{/block:Photoset}{block:Video}pmedia{/block:Video}">
  775.  
  776.  
  777. {block:ContentSource}
  778. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  779. {/block:SourceLogo}
  780. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  781. {/block:ContentSource}
  782.  
  783.  
  784. {block:IndexPage}
  785. <div class="pmedia_perma">
  786. <a href="{Permalink}" title="{TimeAgo} — {NoteCountWithLabel}"><img src="{image:Permalink Icon}"></a><a href="{ReblogURL}" title="Reblog"><img src="{image:Reblog Icon}"></a>
  787. </div>
  788. {/block:IndexPage}
  789.  
  790.  
  791. {block:Photo}
  792. <div id="photo">
  793. {block:IndexPage}
  794. {LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}" />{LinkCloseTag}
  795. {/block:IndexPage}
  796. {block:PermalinkPage}
  797. {LinkOpenTag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" />{LinkCloseTag}
  798. {/block:PermalinkPage}
  799. </div>
  800. {/block:Photo}
  801.  
  802.  
  803. {block:Photoset}
  804. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">
  805. {block:Photos}
  806. <div class="photo-data">
  807. <div class="pxu-photo">
  808. <img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}">
  809. </div>
  810. <a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a>
  811. </div>
  812. {/block:Photos}
  813. </div>
  814. {/block:Photoset}
  815.  
  816.  
  817. {block:Video}
  818. <div id="vid">{Video-500}</div>
  819. {/block:Video}
  820.  
  821.  
  822. {block:Audio}
  823. <div id="audio">{block:TrackName}{TrackName}{/block:TrackName} {block:Artist}by {Artist}{/block:Artist}</div>
  824. {AudioPlayerWhite}
  825. {/block:Audio}
  826.  
  827.  
  828. {block:Text}
  829. {block:Title}<h2>{Title}</h2>{/block:Title}
  830. {Body}
  831. {/block:Text}
  832.  
  833.  
  834. {block:Link}
  835. <h2><a href="{URL}" {Target}>{Name}</a></h2>
  836. {block:Description}{Description}{/block:Description}
  837. {/block:Link}
  838.  
  839.  
  840. {block:Quote}
  841. <div id="quote">{Quote}</div>
  842. {block:Source}<div id="source">— {Source}</div>{/block:Source}
  843. {/block:Quote}
  844.  
  845.  
  846. {block:Answer}
  847. <div id="question"><p id="asker">{Asker} asked:</p> {Question}</div>
  848. {Answer}
  849. {/block:Answer}
  850.  
  851.  
  852. {block:Chat}
  853. {block:Title}<h2>{Title}</h2>{/block:Title}
  854. {block:Lines}<p>
  855. {block:Label}
  856. <b>{Label}</b>
  857. {/block:Label}
  858. {Line}</p>
  859. {/block:Lines}
  860. {/block:Chat}
  861.  
  862.  
  863. {block:Caption}<div class="cap {block:IndexPage}{block:ifnotShowCaptions}cp{/block:ifnotShowCaptions}{/block:IndexPage} {select:Caption Blockquote}">{Caption}</div>{/block:Caption}
  864.  
  865.  
  866. {block:IndexPage}
  867. <div class="ptext_perma"><a href="{Permalink}" title="{TimeAgo} — {NoteCountWithLabel}">{DayOfMonthWithZero}.{MonthNumberWithZero}.{ShortYear}</a></div>
  868. {/block:IndexPage}
  869.  
  870.  
  871. </article>
  872.  
  873.  
  874. {block:PermalinkPage}
  875. {block:Date}
  876. <div class="posts_info">
  877. <p>Posted {Month} {DayofMonth}, {Year} {block:NoteCount}<span> — </span> {NoteCountWithLabel}{/block:NoteCount}</p>
  878. {block:RebloggedFrom}
  879. <p>From<a href="{ReblogParentURL}">{ReblogParentName}</a> <span> — </span> By <a href="{ReblogRootURL}">{ReblogRootName}</a></p>
  880. {/block:RebloggedFrom}
  881. {block:HasTags}
  882. <p>Tagged {block:Tags}<a href="{TagURL}">{Tag}</a> {/block:Tags}</p>
  883. {/block:HasTags}
  884. </div>
  885. {/block:Date}
  886. {block:PostNotes}{PostNotes}{/block:PostNotes}
  887. {/block:PermalinkPage}
  888.  
  889.  
  890. {/block:Posts}
  891. </section>
  892.  
  893.  
  894.  
  895. {block:IndexPage}<footer>
  896. {block:ifBottomPagination}{block:Pagination}
  897. <div class="pagination">
  898. {block:PreviousPage}<a href="{PreviousPage}">less</a> /{/block:PreviousPage}
  899. {block:NextPage}<a id="next" href="{NextPage}">more</a>{/block:NextPage}
  900. </div>
  901. {/block:Pagination}{/block:ifBottomPagination}
  902. {block:ifInfinitescroll}{block:ifManualLoad}
  903. <a id="load">load more</a>
  904. {/block:ifManualLoad}{/block:ifInfinitescroll}
  905. </footer>{/block:IndexPage}
  906.  
  907.  
  908.  
  909. <a href="http://ladmilk.tumblr.com" style="padding:10px; bottom:5px; left:5px; position:fixed;" title="Theme by Heidi">cr.</a>
  910.  
  911.  
  912.  
  913. <!---- Scripts ---->
  914.  
  915.  
  916. {block:IndexPage}
  917. <script src="http://static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script>
  918. {block:ifInfinitescroll}
  919. <script src="http://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  920. {/block:ifInfinitescroll}
  921.  
  922. <script>
  923. $(document).ready(function(){
  924. var $container = $('#wrapper');
  925. $container.masonry({
  926. itemSelector: '.posts',
  927. columnWidth: {select:Post Size} + {select:Padding}*2 + {select:Margin}*2 + 2,
  928. });
  929. $container.imagesLoaded(function(){
  930. $container.masonry();
  931. });
  932. {block:ifInfinitescroll}
  933. $container.infinitescroll({
  934. itemSelector : ".posts",
  935. navSelector : ".pagination",
  936. nextSelector : ".pagination a#next",
  937. loadingImg : "",
  938. loadingText : "<em> </em>",
  939. bufferPx : 1000,
  940. extraScrollPx: 500,
  941. {block:ifManualLoad}
  942. errorCallback: function () { jQuery('a#load').delay(50).fadeOut(); },
  943. {/block:ifManualLoad}
  944. },
  945. function( newElements ) {
  946. resizeVideos();
  947. $(newElements).find('.photo-slideshow').pxuPhotoset({
  948. lightbox: true,
  949. rounded: false,
  950. gutter: '3px',
  951. borderRadius: '0px',
  952. photoset: '.photo-slideshow',
  953. photoWrap: '.photo-data',
  954. photo: '.pxu-photo'
  955. });
  956. var $newElems = $( newElements ).css({ opacity: 0 });
  957. $newElems.imagesLoaded(function(){
  958. $container.masonry( 'appended', $newElems );
  959. $newElems.animate({ opacity: 1 });
  960. });
  961. });
  962. {block:ifnotManualLoad}
  963. if($(window).height() >= $(document).height()){
  964. $container.infinitescroll('retrieve'); return false;
  965. };
  966. {/block:ifnotManualLoad}
  967. {block:ifManualLoad}
  968. $(window).unbind('.infscr');
  969. $('a#load').click(function() {
  970. $container.infinitescroll('retrieve'); return false;
  971. });
  972. {/block:ifManualLoad}
  973. {/block:ifInfinitescroll}
  974. });
  975. </script>
  976. {/block:IndexPage}
  977.  
  978.  
  979.  
  980. </body>
  981. </html>
RAW Paste Data