API tools faq
paste
caffeous

frankie theme

caffeous
May 17th, 2020 (edited)
3,100
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 44.29 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="https://www.w3.org/1999/xhtml">
  3.  
  4. <!--
  5. ╱╱╱╱╱╱╱╭━╮╱╱╱╱╭╮╭╮
  6. ╱╱╱╱╱╱╱┃╭╯╱╱╱╭╯╰┫┃
  7. ╭━━┳━━┳╯╰┳━━╮╰╮╭┫╰━┳━━┳╮╭┳━━┳━━╮
  8. ┃╭━┫╭╮┣╮╭┫┃━┫╱┃┃┃╭╮┃┃━┫╰╯┃┃━┫━━┫
  9. ┃╰━┫╭╮┃┃┃┃┃━┫╱┃╰┫┃┃┃┃━┫┃┃┃┃━╋━━┃
  10. ╰━━┻╯╰╯╰╯╰━━╯╱╰━┻╯╰┻━━┻┻┻┻━━┻━━╯
  11.  
  12. frankie theme by caffeous
  13. (Issue No. 02 of Magazine Series)
  14. 2020 © all rights reserved
  15.  
  16. CREDITS:
  17.  
  18. unnested captions by neothm and magnusthemes
  19. smooth scroll by Zachary Fury
  20. video width fix by shythemes
  21. photoset fix by annasthms and espoirthemes
  22. icons from fontawesome
  23. linear icon by Perxis
  24. -->
  25.  
  26. <head>
  27.  
  28. <link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
  29. <script src="https://kit.fontawesome.com/f32ce4ad6d.js" crossorigin="anonymous"></script>
  30.  
  31.  
  32. <title>{title}</title>
  33. {block:Description}<meta name="description" content="{metadescription}" />{/block:Description}
  34. <link rel="shortcut icon" href="{Favicon}"/>
  35. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  36.  
  37. <meta name="color:Body" content="#000000"/>
  38. <meta name="color:Top Border" content="#f3f3f3"/>
  39. <meta name="color:Blogtitle" content="#000000"/>
  40. <meta name="color:Navigation" content="#000000"/>
  41. <meta name="color:Background 1" content="#dbe0c5"/>
  42. <meta name="color:Background 2" content="#ffffff"/>
  43. <meta name="color:Posts" content="#ffffff"/>
  44. <meta name="color:Avatar Border" content="#f3f3f3"/>
  45. <meta name="color:Permalink" content="#000000"/>
  46. <meta name="color:Permalink Background" content="#f3f3f3"/>
  47. <meta name="color:Liked Button" content="#ffb2ae"/>
  48. <meta name="color:Link" content="#000000"/>
  49. <meta name="color:Hovered Link" content="#808080"/>
  50. <meta name="color:Question" content="#d2d2d2"/>
  51. <meta name="color:Chat" content="#d2d2d2"/>
  52. <meta name="color:Highlight" content="#eaeaea"/>
  53. <meta name="color:Scrollbar" content="#000000"/>
  54. <meta name="color:Tooltip Text" content="#000000"/>
  55. <meta name="color:Tooltip Background" content="#dbe0c5"/>
  56. <meta name="color:Tooltip Border" content="#dbe0c5"/>
  57.  
  58. <meta name="font:Body" content="Favorit"/>
  59. <meta name="font:Title" content="Gibson"/>
  60.  
  61. <meta name="select:Body Font" content="11px"/>
  62. <meta name="select:Body Font" content="12px"/>
  63. <meta name="select:Body Font" content="13px"/>
  64. <meta name="select:Body Font" content="14px"/>
  65.  
  66. <meta name="image:Avatar" content=""/>
  67. <meta name="image:Background" content=""/>
  68. <meta name="image:Posts Background" content=""/>
  69.  
  70. <meta name="if:Three Columns" content="1"/>
  71. <meta name="if:Two Columns" content="0"/>
  72. <meta name="if:One Column" content="0"/>
  73. <meta name="if:Infinite Scroll" content="1"/>
  74. <meta name="if:Manual Load" content="1"/>
  75. <meta name="if:Top Border" content="1"/>
  76. <meta name="if:Avatar" content="1"/>
  77. <meta name="if:Custom Link 1" content="1"/>
  78. <meta name="if:Custom Link 2" content="1"/>
  79. <meta name="if:Custom Link 3" content="1"/>
  80. <meta name="if:Custom Link 4" content="1"/>
  81. <meta name="if:Custom Link 5" content="1"/>
  82. <meta name="if:Two Backgrounds" content="1"/>
  83. <meta name="if:No Background Repeat" content="1"/>
  84. <meta name="if:Black and White Photo Hover" content="1"/>
  85. <meta name="if:Caption" content="0"/>
  86. <meta name="if:Inverted Tumblr Controls" content="1"/>
  87.  
  88. <meta name="text:Blogtitle Vertical Placement" content="-40"/>
  89. <meta name="text:Blogtitle Font Size" content="39"/>
  90. <meta name="text:Description Width" content="270"/>
  91. <meta name="text:Search Width" content="60"/>
  92. <meta name="text:Ask Link" content="/ask"/>
  93. <meta name="text:Post Opacity" content="0.7"/>
  94. <meta name="text:Link 1" content="/"/>
  95. <meta name="text:Link 1 Title" content="one"/>
  96. <meta name="text:Link 2" content="/"/>
  97. <meta name="text:Link 2 Title" content="two"/>
  98. <meta name="text:Link 3" content="/"/>
  99. <meta name="text:Link 3 Title" content="three"/>
  100. <meta name="text:Link 4" content="/"/>
  101. <meta name="text:Link 4 Title" content="four"/>
  102. <meta name="text:Link 5" content="/"/>
  103. <meta name="text:Link 5 Title" content="five"/>
  104.  
  105. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  106.  
  107. <style type="text/css">
  108.  
  109. /*HEADER*/
  110.  
  111. header {
  112. display: inline-block;
  113. position: relative;
  114. top: {text:Blogtitle Vertical Placement}px;
  115. margin: auto;
  116. height: auto;
  117. width: 100%;
  118. text-align: center;
  119. -webkit-animation:fadeInDown 1.5s;
  120. -moz-animation:fadeInDown 1.5s;
  121. -ms-animation:fadeInDown 1.5s;
  122. }
  123.  
  124. header a {{block:IfAvatar}padding-left: 10px;{/block:IfAvatar}font-size: {text:Blogtitle Font Size}px;font-family: {font:Title};color: {color:Blogtitle};font-weight: bold;}
  125.  
  126.  
  127. img.tar {
  128. display: inline-block;
  129. vertical-align: bottom;
  130. position: relative;
  131. bottom: 5px;
  132. width: 45px;
  133. height: 45px;
  134. border: 5px solid rgba({RGBcolor:Avatar Border}, {text:Post Opacity});
  135. }
  136.  
  137. .desc {
  138. position: relative;
  139. margin: auto;
  140. top: -45px;
  141. padding: 20px 40px 20px 30px;
  142. width: {text:Description Width}px;
  143. font-size: 0.975em;
  144. text-align: justify;
  145. -webkit-animation:fadeInDown 1.5s;
  146. -moz-animation:fadeInDown 1.5s;
  147. -ms-animation:fadeInDown 1.5s;}
  148.  
  149. #title {display: none;position: fixed;float: right;top: 15px; margin-left: {block:IfThreeColumns}785{/block:IfThreeColumns}{block:IfTwoColumns}635{/block:IfTwoColumns}{block:IfOneColumn}485{/block:IfOneColumn}px;font-family: {font:Title};font-size: 1.7em;writing-mode: vertical-lr;}
  150.  
  151. #title a {color: {color:Blogtitle};}
  152.  
  153. /*border*/
  154. .linen {
  155. position: absolute;
  156. border-top: 10px solid {color:Top Border};
  157. left: 0px;
  158. top: 0px;
  159. min-width: 100vw;
  160. opacity: 1;
  161. z-index: 4;
  162. {block:IfNotTopBorder}display: none;{/block:IfNotTopBorder}
  163. }
  164.  
  165. /*navigation*/
  166.  
  167. nav {
  168. position: absolute;
  169. {block:IndexPage}
  170. margin-left: -75px;
  171. text-align: right;
  172. {/block:IndexPage}
  173. {block:PermalinkPage}
  174. margin-left: 5px;
  175. text-align: left;
  176. {/block:PermalinkPage}
  177. margin-top: -5px;
  178. padding: 5px;
  179. height: auto;
  180. width: 60px;
  181. z-index: 3;
  182. -webkit-animation:fadeIn 1.5s;
  183. -moz-animation:fadeIn 1.5s;
  184. -ms-animation:fadeIn 1.5s;
  185. }
  186.  
  187.  
  188. nav a {font-size: 15px;color: {color:Navigation};}
  189.  
  190. .stick {position: fixed;{block:IndexPage}margin-left: -75px;{/block:IndexPage}{block:PermalinkPage}margin-left: 5px;{/block:PermalinkPage}top: 0px;}
  191.  
  192. #cetera {
  193. display: none;
  194. position: relative;
  195. height: auto;
  196. {block:IndexPage}text-align: right;{/block:IndexPage}
  197. {block:PermalinkPage}text-align: left;{/block:PermalinkPage}
  198. }
  199.  
  200. #cetera a {font-size: 1.0em;display: block;height: auto;}
  201.  
  202. /*search*/
  203.  
  204. .search {
  205. position: absolute;
  206. right: 5px;
  207. top: -25px;
  208. border: none;
  209. text-align: right;
  210. z-index: 2;
  211. -webkit-animation:fadeInDown 1.5s;
  212. -moz-animation:fadeInDown 1.5s;
  213. -ms-animation:fadeInDown 1.5s;
  214. }
  215.  
  216. .search input, .searcher input {font-size: 1em;width: {text:Search Width}px;text-align: right;font: {font:Body};border: 0;background: transparent;}
  217.  
  218. .search input[type=text], .searcher input[type=text] {color: {color:Body};transition: all .3s linear;}
  219.  
  220. .search input:focus, .searcher input:focus {width: {text:Search Width}px;color: {color:Body};outline: none;transition: all .3s linear;
  221. }
  222.  
  223. input::-webkit-input-placeholder {opacity: 0.5;color: {color:Body};transition: all .3s linear;}
  224.  
  225. input:-ms-input-placeholder {opacity: 0.5;color: {color:Body};transition: all .3s linear;}
  226.  
  227. input:-moz-placeholder {opacity: 0.5;color: {color:Body};transition: all .3s linear;}
  228.  
  229. .search-form input[type=text]:focus {color: {color:Body};}
  230.  
  231. input:focus::-webkit-input-placeholder {opacity: 1;}
  232.  
  233. input:focus::-moz-placeholder {opacity: 1;}
  234.  
  235. input:-ms-input-placeholder {opacity: 1;}
  236.  
  237. input[type="SEARCH..."] {text-align: right;box-sizing: content-box;-webkit-appearance: textfield;-moz-box-sizing: content-box; -webkit-box-sizing:content-box;}
  238.  
  239. input[type="SEARCH..."]::-webkit-search-cancel-button, input[type="SEARCH..."]::-webkit-search-decoration {-webkit-appearance: none;}
  240.  
  241. /*BODY*/
  242.  
  243. body {
  244. color: {color:Body};
  245. font-family: {font:Body};
  246. font-size: {select:Body Font};
  247. font-weight: 300;
  248. line-height: 1.6;
  249. height: 100vh;
  250. text-align: justify;
  251. background-color: {color:Background 2};
  252. background-image: url({image:Background});
  253. background-attachment: fixed;
  254. background-repeat: repeat;
  255. {block:IfNoBackgroundRepeat}
  256. background-size: cover;
  257. {/block:IfNoBackgroundRepeat}
  258. overflow-x: hidden;
  259. }
  260.  
  261. /*background*/
  262. .bg {
  263. {block:IfNotTwoBackgrounds}display: none;{/block:IfNotTwoBackgrounds}
  264. position: fixed;
  265. height: 50vh;
  266. top: 0;
  267. left: 0;
  268. width: 100%;
  269. background: {color:Background 1};
  270. }
  271.  
  272. /*links*/
  273.  
  274. a {color: {color:Link};display: inline-block;position: relative;text-decoration: none;word-break: break-all;-webkit-transition: all 0.4s ease-in-out;-moz-transition: all 0.4s ease-in-out;}
  275.  
  276. a:hover {color: {color:Hovered Link};text-decoration: none;}
  277.  
  278. /*ARTICLE*/
  279.  
  280. #wrapper {
  281. position: relative;
  282. top: 100px;
  283. margin: auto;
  284. height: auto;
  285. {block:IndexPage}max-width: {block:IfThreeColumns}810{/block:IfThreeColumns}{block:IfTwoColumns}660{/block:IfTwoColumns}{block:IfOneColumn}508{/block:IfOneColumn}px;{/block:IndexPage}
  286. width: 100%;
  287. background-color: rgba( {RGBcolor:Posts}, {text:Post Opacity});
  288. background-image: url({image:Posts Background});
  289. background-repeat: repeat;
  290. background-attachment: fixed;
  291. {block:IfNoBackgroundRepeat}
  292. background-size: cover;
  293. {/block:IfNoBackgroundRepeat}
  294. }
  295.  
  296. #posts {
  297. position: relative;
  298. top: -50px;
  299. {block:PermalinkPage}width: 550px;padding-bottom: 80px;{/block:PermalinkPage}
  300. {block:IndexPage}width: 100%;display: none;padding-bottom: 40px;{/block:IndexPage}
  301. margin: auto;
  302. overflow: hidden;
  303. -webkit-animation:fadeInUp 1.5s;
  304. -moz-animation:fadeInUp 1.5s;
  305. -ms-animation:fadeInUp 1.5s;
  306. }
  307.  
  308. /*SECTION*/
  309.  
  310. .entry {
  311. position: relative;
  312. display: inline-block;
  313. max-width:100%;
  314. padding: 5px;
  315. margin: 25px;
  316. {block:IndexPage}
  317. word-wrap: break-word;
  318. overflow: hidden;
  319. -moz-transition: all .5s;
  320. -webkit-transition: all .5s;
  321. -o-transition: all .5s;
  322. transition: all .5;
  323. -webkit-animation:fadeIn 1.5s;
  324. -moz-animation:fadeIn 1.5s;
  325. -ms-animation:fadeIn 1.5s;
  326. width: {block:IfThreeColumns}210{/block:IfThreeColumns}{block:IfTwoColumns}240{/block:IfTwoColumns}{block:IfOneColumn}450{/block:IfOneColumn}px;
  327. {/block:IndexPage}
  328. {block:PermalinkPage}width: 500px;{/block:PermalinkPage}
  329. }
  330.  
  331. .small {{block:IndexPage}width: {block:IfThreeColumns}210{/block:IfThreeColumns}{block:IfTwoColumns}240{/block:IfTwoColumns}{block:IfOneColumn}450{/block:IfOneColumn}px;{/block:IndexPage}{block:PermalinkPage}width: 500px;{/block:PermalinkPage}}
  332.  
  333. #vignette, .vignette {opacity: 0;}
  334.  
  335. #tumblr_lightbox, .tmblr-lightbox {background-color: {color:Posts} !important;}
  336.  
  337. .lightbox-image, #tumblr_lightbox img {
  338. box-shadow: none!important;
  339. border-radius: 0!important;
  340. max-width: none;
  341. }
  342.  
  343. #tumblr_lightbox_caption, .lightbox-caption {visibility: hidden;}
  344.  
  345. .title {
  346. font-size: 1.5em;
  347. font-family: {font:Title};
  348. }
  349.  
  350. .post-content div.npf_row, .post div.npf_row, body div.npf_row {margin: 2px 0px !important;}
  351.  
  352. .lovely img {
  353. {block:IndexPage}
  354. max-width: {block:IfThreeColumns}200{/block:IfThreeColumns}{block:IfTwoColumns}230{/block:IfTwoColumns}{block:IfOneColumn}450{/block:IfOneColumn}px;
  355. {/block:IndexPage}
  356. width: 100%;
  357. margin: 0 auto;
  358. height: auto;
  359. overflow-y: auto;
  360. {block:PermalinkPage}max-width: 500px;{/block:PermalinkPage}
  361. }
  362.  
  363. blockquote p, ul {margin: 0px; padding: 0px;}
  364.  
  365. .entry li {margin-left: 20px;list-style-type: square;}
  366.  
  367. /*photoset*/
  368.  
  369. [photoset-layout] {
  370. grid-gap: 5px; /* this is the gap between both the rows and the columns; you should probably use this if they are the same value */
  371. }
  372.  
  373. /*ask*/
  374.  
  375. .q {padding: 10px 10px 15px 10px; background: {color:Question};}
  376.  
  377. img.ava {display: block;margin-left: 0px;float: left;border-radius: 100%;}
  378.  
  379. .asker {position: relative;left: 5px;margin-top: 2px;text-align: justify;}
  380.  
  381. .asker span {font-weight: bold;}
  382.  
  383. a.asker, a.asker:hover {left: 0px;}
  384.  
  385. .question {position: relative;padding: 10px;background-color: rgba( {RGBcolor:Question}, 0.8);}
  386.  
  387. /*chat*/
  388.  
  389. .chat li {
  390. margin-left: 0px;
  391. padding: 5px;
  392. list-style-type: none;
  393. }
  394.  
  395. .chat li:nth-child(odd) {background: {color:Chat};}
  396.  
  397. .chat li:nth-child(even) {background: rgba({RGBcolor:Chat}, 0.7);}
  398.  
  399. /*permalink*/
  400. {block:IndexPage}
  401. .reb, .likes, .lin {
  402. position: absolute;
  403. opacity: 0;
  404. background-color: rgba( {RGBcolor:Permalink Background}, {text:Post Opacity});
  405. color: {color:Permalink};
  406. margin: 10px;
  407. z-index: 1;
  408. }
  409.  
  410. .reb, .lin {padding: 5px;}
  411.  
  412. .reb {top: 5px;}
  413.  
  414. .likes {top: 37px;padding: 5px 5px 0px 5px;}
  415.  
  416. .lin {top: 69px;}
  417.  
  418. a.reb:hover, a.lin:hover {color: {color:Permalink};}
  419.  
  420. .entry:hover .reb {opacity: 1;}
  421.  
  422. .entry:hover .likes {opacity: 1; transition-delay: 0.14s;}
  423.  
  424. .entry:hover .lin {opacity: 1; transition-delay: 0.28s;}
  425.  
  426. svg {fill: {color:Permalink}; max-width: 100%;width: 12px;height: 12px;}
  427.  
  428. .likes .liked + svg, .like .liked + svg {opacity: 1;}
  429.  
  430. .likes .liked + svg path, .like .liked + svg path {fill: {color:Liked Button};}
  431.  
  432. .likes .like_button iframe, .like .like_button iframe {
  433. position: absolute;
  434. top: 0;
  435. left: 0;
  436. bottom: 0;
  437. right: 0;
  438. z-index: 2;
  439. opacity: 0;
  440. }
  441.  
  442. .con a {display: inline-block;padding: 5px;color: {color:Permalink};}
  443. {/block:IndexPage}
  444.  
  445. .parol {
  446. position: relative;
  447. overflow: hidden;
  448. }
  449.  
  450. .parol img {
  451. display: block;
  452. height: auto;
  453. overflow: hidden;
  454. -webkit-filter: grayscale(0%);
  455. transition: all .3s linear;
  456. }
  457.  
  458. .entry:hover .parol img {
  459. {block:IfBlackAndWhitePhotoHover}-webkit-filter: grayscale(100%);{/block:IfBlackAndWhitePhotoHover}
  460. }
  461.  
  462. /*audio*/
  463.  
  464. #audio {height: auto; min-height: 60px; padding-bottom: 0px;}
  465.  
  466. .cover {position: absolute;z-index: 1;width: 60px;height: 62px;}
  467.  
  468. .cover img {float: left;width: 60px;height: 62px;}
  469.  
  470. .play {
  471. opacity: 0.6;
  472. width: 32px;
  473. height: 32px;
  474. overflow-x: hidden;
  475. position: absolute;
  476. z-index: 1;
  477. margin-left: 15px;
  478. margin-top: 17px;
  479. text-align: center;
  480. }
  481.  
  482. .info {
  483. margin-left: 65px;
  484. height: auto;
  485. padding: 0px 5px 5px 5px;
  486. line-height: 14px;
  487. }
  488.  
  489. .spotify_audio_player {
  490. height:80px!important;
  491. width:100%!important;
  492. }
  493. .bandcamp_audio_player {
  494. height:120px!important;
  495. width:100%!important;
  496. }
  497.  
  498. .soundcloud_audio_player {
  499. height:150px!important;
  500. width:100%!important;
  501. }
  502.  
  503. /*captions*/
  504.  
  505. .cap {position: relative; top: 10px;}
  506.  
  507. img.tumblr_avatar {position: relative; display:inline-block;bottom: 7px;border-radius:50%;width:15px;}
  508.  
  509. .cap .tumblr_parent {border: none;margin:10px 0px 15px;width: {block:IfThreeColumns}210{/block:IfThreeColumns}{block:IfTwoColumns}240{/block:IfTwoColumns}{block:IfOneColumn}450{/block:IfOneColumn}px;}
  510.  
  511. .cap a.tumblr_blog{position: relative;{block:IndexPage}bottom: 10px;margin-left: 7px;{/block:IndexPage}padding-bottom: 0px;font-size: 1.085em;font-weight: bold;}
  512.  
  513. .tagz {text-align: center;-webkit-transition: all 0.4s ease-in-out;-moz-transition: all 0.4s ease-in-out;}
  514.  
  515. /*video*/
  516.  
  517. .video {
  518. vertical-align: bottom;
  519. line-height: 0;
  520. width: {block:IfThreeColumns}210{/block:IfThreeColumns}{block:IfTwoColumns}240{/block:IfTwoColumns}{block:IfOneColumn}450{/block:IfOneColumn}px;
  521. }
  522.  
  523. /*permalink page*/
  524. #noties {text-align: justify;border: 0px;}
  525.  
  526. #noties blockquote {border: 0px;}
  527.  
  528. #notie {
  529. border: 0px;
  530. margin-top: 20px;
  531. margin-left: -60px;
  532. line-height: 20px;
  533. padding: 5px;
  534. z-index: 2;
  535. width: 530px;
  536. }
  537.  
  538. #notie img {display: block;float: left;margin-right: 5px;border-radius: 100%;}
  539.  
  540. #notie li {list-style-type: none;}
  541.  
  542.  
  543. /*OTHERS*/
  544.  
  545. /*tumblr controls*/
  546.  
  547. .tmblr-iframe-compact .tmblr-iframe--unified-controls {
  548. position: fixed;
  549. top: {block:IfTopBorder}15{/block:IfTopBorder}{block:IfNotTopBorder}5{/block:IfNotTopBorder}px;
  550. right: 5px;
  551. opacity: 1;
  552. {block:IfInvertedTumblrControls}
  553. -webkit-filter:invert(85%);
  554. filter:invert(85%);
  555. {/block:IfInvertedTumblrControls}
  556. {block:IfNotInvertedTumblrControls}
  557. -webkit-filter:invert(0%);
  558. filter:invert(0%);
  559. {/block:IfNotInvertedTumblrControls}
  560. transform:scale(0.6);
  561. transform-origin:100% 0;
  562. -webkit-transform:scale(0.6);
  563. -webkit-transform-origin:100% 0;
  564. -ms-transform:scale(0.6);
  565. -ms-transform-origin:100% 0;
  566. }
  567.  
  568. .tmblr-iframe--app-cta-button {display:none!important;}
  569.  
  570. /*pagination*/
  571.  
  572. {block:IfInfiniteScroll}
  573. #page-nav {display: none;}
  574. {/block:IfInfiniteScroll}
  575.  
  576. {block:IfNotInfiniteScroll}
  577. #page-nav {position: absolute; width: inherit; text-align: center; bottom: 0px;font-family: {font:Title};font-weight: bold;}
  578. {/block:IfNotInfiniteScroll}
  579.  
  580. #infscr-loading {display: none!important;}
  581.  
  582. #loadmore {
  583. position: absolute;
  584. padding: 5px 5px 5px 6px;
  585. color: {color:Permalink};
  586. background: {color:Background 1};
  587. left: 50%;
  588. margin-left: -35px;
  589. bottom: 0px;
  590. z-index: 5;
  591. -webkit-animation:fadeIn 1.5s;
  592. -moz-animation:fadeIn 1.5s;
  593. -ms-animation:fadeIn 1.5s;
  594. }
  595.  
  596. /*scrollbar*/
  597.  
  598. ::-webkit-scrollbar-thumb {
  599. background-color: {color:Scrollbar};
  600. {block:IfTwoBackgrounds}
  601. border: 1px solid transparent;
  602. border-image: -webkit-linear-gradient(to bottom, {color:Background 1} 50%, {color:Background 2} 50%);
  603. border-image: linear-gradient(to bottom, {color:Background 1} 50%, {color:Background 2} 50%);
  604. border-image-slice: 1;
  605. {/block:IfTwoBackgrounds}
  606. {block:IfNotTwoBackgrounds}
  607. border: 1px solid {color:Background 2};
  608. {/block:IfNotTwoBackgrounds}
  609. height: 6px;
  610. -moz-border-radius: 15px;
  611. border-radius: 15px;
  612. }
  613.  
  614. ::-webkit-scrollbar {
  615. background-color: {color:Scrollbar};
  616. {block:IfTwoBackgrounds}
  617. border: 2px solid transparent;
  618. border-image: -webkit-linear-gradient(to bottom, {color:Background 1} 50%, {color:Background 2} 50%);
  619. border-image: linear-gradient(to bottom, {color:Background 1} 50%, {color:Background 2} 50%);
  620. border-image-slice: 1;
  621. {/block:IfTwoBackgrounds}
  622. {block:IfNotTwoBackgrounds}
  623. border: 2px solid {color:Background 2};
  624. {/block:IfNotTwoBackgrounds}
  625. height: 6px;
  626. width: 5px;}
  627.  
  628. ::-webkit-scrollbar:horizontal {display: none;}
  629.  
  630. /*highlight*/
  631.  
  632. ::selection {color: {color:Highlight};background-color: transparent;}
  633.  
  634. ::-moz-selection {color: {color:Highlight};background-color: transparent;}
  635.  
  636. ::-webkit-selection {color: {color:Highlight};background-color: transparent;}
  637.  
  638. /*tooltip*/
  639.  
  640. #s-m-t-tooltip {
  641. margin: 23px 23px 0 0;
  642. padding: 3px;
  643. border: 1px solid {color:Tooltip Border};
  644. color: {color:Tooltip Text};
  645. background-color: {color:Tooltip Background};
  646. text-transform: uppercase;
  647. letter-spacing: 2px;
  648. z-index: 999999999999;
  649. max-width: 250px;
  650. }
  651.  
  652.  
  653. /*animation*/
  654.  
  655. @-webkit-keyframes fadeIn {
  656. 0% {opacity: 0;}
  657.  
  658. 100% {opacity: 1;}
  659. }
  660.  
  661. @keyframes fadeIn {
  662. 0% {opacity: 0;}
  663.  
  664. 100% {opacity: 1;}
  665. }
  666.  
  667. @keyframes fadeInUp {
  668. from {transform: translate3d(0,40px,0)}
  669. to {transform: translate3d(0,0,0);opacity: 1;}
  670. }
  671.  
  672. @-webkit-keyframes fadeInUp {
  673. from {transform: translate3d(0,40px,0)}
  674. to {transform: translate3d(0,0,0); opacity: 1;}
  675. }
  676.  
  677. @keyframes fadeInDown {
  678. 0% {opacity: 0; transform: translateY(-20px);}
  679. 100% {opacity: 1; transform: translateY(0);}
  680. }
  681.  
  682. @keyframes fadeInLeft {
  683. 0% {opacity: 0;transform: translateX(-20px);}
  684. 100% {opacity: 1;transform: translateX(0);}
  685. }
  686.  
  687. @-webkit-keyframes fadeInLeft {
  688. 0% {opacity: 0;transform: translateX(-20px);}
  689. 100% {opacity: 1;transform: translateX(0);}
  690. }
  691.  
  692. @media screen and (max-width: 800px) {
  693. {block:IfNotOneColumn}
  694. nav, .stick {margin-left: 5px;text-align: left;width: 20px;}
  695. #cetera {text-align: left;}
  696. {/block:IfNotOneColumn}
  697. #title {display: none;}
  698. }
  699.  
  700. @media screen and (max-width: 384px) {
  701. nav {position: fixed;left: -5px;top: 5px;}
  702. .search {display: none;}
  703. header {top: -30px;}
  704. header a {font-size: 22px;}
  705. img.tar {vertical-align: middle;}
  706. .desc {top: -50px;width: auto;}
  707. #wrapper {top: 60px;}
  708. #posts {top: -70px;}
  709. }
  710.  
  711. @media screen and (max-width: 550px) {
  712. {block:PermalinkPage}
  713. #posts {width: 300px;}
  714. .entry {padding: 5px;}
  715. .small {width: 250px;}
  716. {/block:PermalinkPage}
  717. nav, .stick {margin-left: 5px;text-align: left;width: 20px;}
  718. #cetera {text-align: left;}
  719. }
  720.  
  721. @media screen and (min-width: 385px) {.searcher {display: none;}}
  722.  
  723. {block:IfOneColumn}
  724. @media screen and (max-width: 550px) {
  725. .small {{block:IndexPage}width: 250px;{/block:IndexPage}}
  726. .desc {width: 250px;}
  727. .cap .tumblr_parent {{block:IndexPage}width: 250px;{/block:IndexPage}}
  728. #wrapper {width: 100%;}
  729. #posts, element.style {max-width: 310px;}
  730. header a {font-size: 2em;}
  731. }
  732. @media screen and (min-width: 551px) {
  733. .small {{block:IndexPage}width: 450px;{/block:IndexPage}}
  734. .cap .tumblr_parent {{block:IndexPage}width: 450px;{/block:IndexPage}}
  735. }
  736. {/block:IfOneColumn}
  737.  
  738. </style>
  739.  
  740. <title>{title}</title>
  741. <meta name="viewport" content="width=820" />
  742.  
  743. <!--scripts-->
  744.  
  745. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  746.  
  747. <link href="https://static.tumblr.com/0podkko/oDSpg7y88/photosets.css" rel="stylesheet">
  748.  
  749. <script src="https://static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  750.  
  751. <script src="https://static.tumblr.com/wgg6svp/OoTofxa0c/unnest.min.js"></script>
  752.  
  753. <script src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.10/SmoothScroll.min.js"></script>
  754.  
  755. <script>
  756.  
  757. $(document).ready(function(){
  758. $("#et").click(function(){
  759. $(this).toggleClass("click");
  760. $("#cetera").fadeToggle(300);
  761. });
  762. });
  763. </script>
  764.  
  765. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  766.  
  767. <script>
  768.  
  769. (function($){
  770.  
  771. $(document).ready(function(){
  772.  
  773. $("a[title]").style_my_tooltips({
  774.  
  775. tip_follows_cursor:true,
  776.  
  777. tip_delay_time:200,
  778.  
  779. tip_fade_speed:500,
  780.  
  781. attribute:"title"
  782.  
  783. });
  784.  
  785. });
  786.  
  787. })(jQuery);
  788.  
  789. </script>
  790.  
  791. <script type="text/javascript">//** jQuery Scroll to Top Control script- (c) I made this script myself (Kyle Monk) and it is hosted on my personal site so would appreciate if you followed my blog at kylemonk.tumblr.com if you use it or for details on how to change the location.
  792. //** Graphic originally from tumbler dashboard, for details on how to change graphic colour, contact me at kylemonk.tumblr.com
  793. //** v1.1 (April 7th, 10'):
  794. //** 1) Adds ability to scroll to an absolute position (from top of page) or specific element on the page instead.
  795. //** 2) Fixes scroll animation not working in Opera.
  796.  
  797.  
  798. var scrolltotop={
  799. //startline: Integer. Number of pixels from top of doc scrollbar is scrolled before showing control
  800. //scrollto: Keyword (Integer, or "Scroll_to_Element_ID"). How far to scroll document up when control is clicked on (0=top).
  801. setting: {startline:100, scrollto: 0, scrollduration:1000, fadeduration:[500, 100]},
  802. controlHTML: '<span style="font-size: 20px;color:{color:Link};">&#x2912;</span>', //HTML for control, which is auto wrapped in DIV w/ ID="topcontrol"
  803. controlattrs: {offsetx:7, offsety:35}, //offset of control relative to right/ bottom of window corner
  804. anchorkeyword: '#top', //Enter href value of HTML anchors on the page that should also act as "Scroll Up" links
  805.  
  806. state: {isvisible:false, shouldvisible:false},
  807.  
  808. scrollup:function(){
  809. if (!this.cssfixedsupport) //if control is positioned using JavaScript
  810. this.$control.css({opacity:0}) //hide control immediately after clicking it
  811. var dest=isNaN(this.setting.scrollto)? this.setting.scrollto : parseInt(this.setting.scrollto)
  812. if (typeof dest=="string" && jQuery('#'+dest).length==1) //check element set by string exists
  813. dest=jQuery('#'+dest).offset().top
  814. else
  815. dest=0
  816. this.$body.animate({scrollTop: dest}, this.setting.scrollduration);
  817. },
  818.  
  819. keepfixed:function(){
  820. var $window=jQuery(window)
  821. var controlx=$window.scrollLeft() + $window.width() - this.$control.width() - this.controlattrs.offsetx
  822. var controly=$window.scrollTop() + $window.height() - this.$control.height() - this.controlattrs.offsety
  823. this.$control.css({left:controlx+'px', top:controly+'px'})
  824. },
  825.  
  826. togglecontrol:function(){
  827. var scrolltop=jQuery(window).scrollTop()
  828. if (!this.cssfixedsupport)
  829. this.keepfixed()
  830. this.state.shouldvisible=(scrolltop>=this.setting.startline)? true : false
  831. if (this.state.shouldvisible && !this.state.isvisible){
  832. this.$control.stop().animate({opacity:1}, this.setting.fadeduration[0])
  833. this.state.isvisible=true
  834. }
  835. else if (this.state.shouldvisible==false && this.state.isvisible){
  836. this.$control.stop().animate({opacity:0}, this.setting.fadeduration[1])
  837. this.state.isvisible=false
  838. }
  839. },
  840.  
  841. init:function(){
  842. jQuery(document).ready(function($){
  843. var mainobj=scrolltotop
  844. var iebrws=document.all
  845. mainobj.cssfixedsupport=!iebrws || iebrws && document.compatMode=="CSS1Compat" && window.XMLHttpRequest //not IE or IE7+ browsers in standards mode
  846. mainobj.$body=(window.opera)? (document.compatMode=="CSS1Compat"? $('html') : $('body')) : $('html,body')
  847. mainobj.$control=$('<div id="topcontrol">'+mainobj.controlHTML+'</div>')
  848. .css({position:mainobj.cssfixedsupport? 'fixed' : 'absolute', bottom:mainobj.controlattrs.offsety, right:mainobj.controlattrs.offsetx, opacity:0, cursor:'pointer'})
  849. .attr({title:'back to top'})
  850. .click(function(){mainobj.scrollup(); return false})
  851. .appendTo('body')
  852. if (document.all && !window.XMLHttpRequest && mainobj.$control.text()!='') //loose check for IE6 and below, plus whether control contains any text
  853. mainobj.$control.css({width:mainobj.$control.width()}) //IE6- seems to require an explicit width on a DIV containing text
  854. mainobj.togglecontrol()
  855. $('a[href="' + mainobj.anchorkeyword +'"]').click(function(){
  856. mainobj.scrollup()
  857. return false
  858. })
  859. $(window).bind('scroll resize', function(e){
  860. mainobj.togglecontrol()
  861. })
  862. })
  863. }
  864. }
  865.  
  866. scrolltotop.init()
  867. </script>
  868.  
  869. <!--infinite scroll-->
  870. <script src="https://static.tumblr.com/bswe8t6/UFVlryaq2/jquerymsnryv2.js"></script>
  871. {block:indexpage}
  872. {block:IfInfiniteScroll}
  873. <script src="https://static.tumblr.com/ey6clvb/mJoq9x5i5/jquery.infinitescroll.min.js"></script>
  874. {/block:IfInfiniteScroll}
  875. <script>
  876. $(document).ready(function(){
  877. var $container = $('#posts');
  878. $container.imagesLoaded( function(){
  879. $('#posts').show();
  880. $container.masonry({
  881. itemSelector: '.entry',
  882. isFitWidth: true,
  883. isAnimated: false
  884. });
  885. });
  886. $('.entry').unnest({
  887. yourCaption: ".cap", //your caption selector, the div wrapping {Caption}
  888. wrapName: ".tumblr_parent", //the name of the captions’ new wrapper
  889. newCaptionUsername: false, //if the user adds a new caption, following a series of captions, show their username above the caption
  890. originalPostCaptionUsername: true, //for the original captions, or a user-added caption that previously didn’t have any, have their username on it
  891. tumblrAvatars: true, //”dashboard style” caption, have the avatar of the blog next to the username
  892. tumblrAvatarClass: ".tumblr_avatar", //class of the avatar next to the username
  893. usernameColon: false //if turned to false, removes the colon at the end of usernames
  894. });
  895. {block:IfInfiniteScroll}
  896. var $container = $('#posts');
  897. $container.infinitescroll({
  898. itemSelector: '.entry',
  899. navSelector: '#page-nav',
  900. nextSelector: '#page-nav a',
  901. loadingImg: '',
  902. loadingText: '<em></em>',
  903. bufferPx: 2000,
  904. debug : false,
  905. {block:IfManualLoad}
  906. errorCallback: function(){
  907. $('#loadmore').fadeOut('normal');
  908. }
  909. {/block:IfManualLoad}
  910. {block:IfNotManualLoad}
  911. errorCallback: function(){
  912. $('#infscr-loading').fadeOut('normal');
  913. }
  914. {/block:IfNotManualLoad}
  915. },
  916. function( newElements ) {
  917. var $newElems = $( newElements );
  918. var $newElemsIDs = $newElems.map(function(){
  919. return this.id;
  920. }).get();
  921. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  922. $newElems.hide();
  923. $newElems.unnest({
  924. yourCaption: ".cap",
  925. wrapName: ".tumblr_parent",
  926. newCaptionUsername: false,
  927. originalPostCaptionUsername: true,
  928. tumblrAvatars: true,
  929. tumblrAvatarClass: ".tumblr_avatar",
  930. usernameColon: false
  931. });
  932. $newElems.imagesLoaded(function(){
  933. $container.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
  934. });
  935.  
  936. });
  937. {block:IfManualLoad}
  938. $(window).unbind('.infscr');
  939. $('#loadmore').click(function(){
  940. $container.infinitescroll('retrieve');
  941. $("#posts").fadeIn("slow");
  942. return false
  943. });
  944. {/block:IfManualLoad}
  945. {/block:IfInfiniteScroll}
  946. });
  947. </script>
  948. {/block:indexpage}
  949. </head>
  950. <body>
  951.  
  952. <div class="linen"></div>
  953. <div class="bg"></div>
  954.  
  955. <div id="wrapper">
  956.  
  957. <div class="search"><form action="/search" method="get"><input type="text" id="searchField" name="q" placeholder="SEARCH..." value="" autocomplete="off"></form></div>
  958.  
  959. <div id="anchor"></div><nav><p><a class="fas fa-home" href="/" title="home"></a></p><p><a class="fas fa-envelope" href="{text:Ask Link}" title="ask"></a></p><p><a class="fas fa-th-large" id="et" style="cursor: pointer;" title="+links"></a></p><div id="cetera">{block:IfCustomLink1}<a href="{text:Link 1}">{text:Link 1 Title}</a>&nbsp;{/block:IfCustomLink1}{block:IfCustomLink2}<a href="{text:Link 2}">{text:Link 2 Title}</a>&nbsp;{/block:IfCustomLink2}{block:IfCustomLink3}<a href="{text:Link 3}">{text:Link 3 Title}</a>&nbsp;{/block:IfCustomLink3}{block:IfCustomLink4}<a href="{text:Link 4}">{text:Link 4 Title}</a>&nbsp;{/block:IfCustomLink4}{block:IfCustomLink5}<a href="{text:Link 5}">{text:Link 5 Title}</a>&nbsp;{/block:IfCustomLink5}{block:HasPages}{block:Pages}<a href="{URL}">{Label}</a>&nbsp;{/block:Pages}{/block:HasPages}</div><a class="fas fa-cog" href="https://cafethemes.tumblr.com/" title="theme"></a></nav>
  960.  
  961. {block:IndexPage}<div id="title"><h1><a href="/">{Title}</a></h1></div>{/block:IndexPage}
  962.  
  963. <header>{block:IfAvatar}<img class="tar" src="{image:Avatar}">{/block:IfAvatar}<a href="/">{Title}</a></header>
  964. <div class="desc"><span style="float:left;">{block:Description}{Description}{/block:Description}</span><div class="searcher"><form action="/search" method="get"><input type="text" id="searchField" name="q" placeholder="SEARCH..." value="" autocomplete="off"></form></div></div>
  965.  
  966. <article id="posts">
  967.  
  968. {block:Posts}
  969. <section class="entry" id="{PostID}">
  970.  
  971. {block:Text}
  972. <div class="small">{block:Title}<div class="title">{Title}</div>{/block:Title}
  973. <div class="lovely cap">{Body}</div>
  974. {block:IndexPage}
  975. <center><span class="con"><a class="fas fa-redo" href="{ReblogURL}" style="font-size: 12px;"></a><a href="#" class="like">{LikeButton}
  976. <svg viewBox="0 0 19 16" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" fill="#000000">
  977. <path d="M14.0425097,0.000920262799 C16.1435097,-0.0400797372 18.8835097,1.28192026 18.9635097,5.36992026 C19.0525097,9.95492026 15.1985097,13.3079203 9.48350967,16.2089203 C3.76650967,13.3079203 -0.0874903349,9.95492026 0.00150966509,5.36992026 C0.0815096651,1.28192026 2.82150967,-0.0400797372 4.92250967,0.000920262799 C7.02450967,0.0419202628 8.87050967,2.26592026 9.46950967,2.92792026 C10.0945097,2.26592026 11.9405097,0.0419202628 14.0425097,0.000920262799 Z"></path></svg>
  978. </a><a class="fas fa-link" href="{Permalink}" style="font-size: 12px;" title="{NoteCountWithLabel}"></a></span></center>
  979. {block:HasTags}<br><div class="tagz">{block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp{/block:Tags}</div>{/block:HasTags}
  980. {/block:IndexPage}
  981. </div>
  982. {/block:Text}
  983.  
  984.  
  985. {block:Link}
  986. <div class="small"><a href="{URL}" class="title">{Name}</a>
  987. <div class="lovely cap">{block:Description}{Description}{/block:Description}</div>
  988. {block:IndexPage}
  989. <center><span class="con"><a class="fas fa-redo" href="{ReblogURL}" style="font-size: 12px;"></a><a href="#" class="like">{LikeButton}
  990. <svg viewBox="0 0 19 16" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" fill="#000000">
  991. <path d="M14.0425097,0.000920262799 C16.1435097,-0.0400797372 18.8835097,1.28192026 18.9635097,5.36992026 C19.0525097,9.95492026 15.1985097,13.3079203 9.48350967,16.2089203 C3.76650967,13.3079203 -0.0874903349,9.95492026 0.00150966509,5.36992026 C0.0815096651,1.28192026 2.82150967,-0.0400797372 4.92250967,0.000920262799 C7.02450967,0.0419202628 8.87050967,2.26592026 9.46950967,2.92792026 C10.0945097,2.26592026 11.9405097,0.0419202628 14.0425097,0.000920262799 Z"></path></svg>
  992. </a><a class="fas fa-link" href="{Permalink}" style="font-size: 12px;" title="{NoteCountWithLabel}"></a></span></center>
  993. {block:HasTags}<br><div class="tagz">{block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp{/block:Tags}</div>{/block:HasTags}
  994. {/block:IndexPage}
  995. </div>
  996. {block:Link}
  997.  
  998. {block:Photo}
  999. {block:IndexPage}
  1000. <a class="reb fas fa-redo" href="{ReblogURL}" style="font-size: 12px;"></a>
  1001. <a href="#" class="likes">{LikeButton}
  1002. <svg viewBox="0 0 19 16" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" fill="#000000">
  1003. <path d="M14.0425097,0.000920262799 C16.1435097,-0.0400797372 18.8835097,1.28192026 18.9635097,5.36992026 C19.0525097,9.95492026 15.1985097,13.3079203 9.48350967,16.2089203 C3.76650967,13.3079203 -0.0874903349,9.95492026 0.00150966509,5.36992026 C0.0815096651,1.28192026 2.82150967,-0.0400797372 4.92250967,0.000920262799 C7.02450967,0.0419202628 8.87050967,2.26592026 9.46950967,2.92792026 C10.0945097,2.26592026 11.9405097,0.0419202628 14.0425097,0.000920262799 Z"></path>
  1004. </svg>
  1005. </a><a class="lin fas fa-link" href="{Permalink}" title="{NoteCountWithLabel}" style="font-size: 12px;"></a>
  1006. <div class="parol">
  1007. <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 class="photo small" src="{PhotoURL-HighRes}" alt="{PhotoAlt}"></a>
  1008. </div>
  1009. {block:IfCaption}{block:Caption}<span class="cap lovely">{Caption}</span>{/block:Caption}{block:HasTags}<br><div class="tagz">{block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp{/block:Tags}</div>{/block:HasTags}{/block:IfCaption}
  1010. {/block:IndexPage}
  1011. {block:PermalinkPage}{LinkOpenTag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="495"/>
  1012. {/block:PermalinkPage}
  1013. {/block:Photo}
  1014.  
  1015. {block:Photoset}
  1016. {block:IndexPage}
  1017. <a class="reb fas fa-redo" href="{ReblogURL}" style="font-size: 12px;"></a>
  1018. <a href="#" class="likes">{LikeButton}
  1019. <svg viewBox="0 0 19 16" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" fill="#000000">
  1020. <path d="M14.0425097,0.000920262799 C16.1435097,-0.0400797372 18.8835097,1.28192026 18.9635097,5.36992026 C19.0525097,9.95492026 15.1985097,13.3079203 9.48350967,16.2089203 C3.76650967,13.3079203 -0.0874903349,9.95492026 0.00150966509,5.36992026 C0.0815096651,1.28192026 2.82150967,-0.0400797372 4.92250967,0.000920262799 C7.02450967,0.0419202628 8.87050967,2.26592026 9.46950967,2.92792026 C10.0945097,2.26592026 11.9405097,0.0419202628 14.0425097,0.000920262799 Z"></path>
  1021. </svg>
  1022. </a><a class="lin fas fa-link" href="{Permalink}" title="{NoteCountWithLabel}" style="font-size: 12px;"></a>
  1023. <div class="parol">
  1024. <div class="small"><a href="#" onclick="Tumblr.Lightbox.init([/*{block:Photos}, /**/ { width: {PhotoWidth-HighRes}, height: {PhotoHeight-HighRes}, low_res: '{PhotoURL-500}', high_res: '{PhotoURL-HighRes}' }{/block:Photos}]); $('body').toggleClass('tumblr_lightbox_active'); return false"><div class="photoset-grid" photoset-layout="{PhotosetLayout}">{block:Photos}<div><img src="{PhotoURL-HighRes}"></div>{/block:Photos}</div></a></div>
  1025. </div>
  1026. {block:IfCaption}{block:Caption}<span class="cap lovely">{Caption}</span>{/block:Caption}{block:HasTags}<br><div class="tagz">{block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp{/block:Tags}</div>{/block:HasTags}{/block:IfCaption}
  1027. {/block:IndexPage}
  1028. {block:PermalinkPage}<div class="photoset-grid" photoset-layout="{PhotosetLayout}">{block:Photos}<div><img src="{PhotoURL-HighRes}" /></div>{/block:Photos}</div>{/block:PermalinkPage}
  1029. {/block:Photoset}
  1030.  
  1031.  
  1032. {block:Quote}
  1033. <div class="small"><div class="lovely"><p><div class="title">{Quote}</div></p>
  1034. <p>{block:Source}{Source}{/block:Source}</p></div>
  1035. {block:IndexPage}
  1036. <center><span class="con"><a class="fas fa-redo" href="{ReblogURL}" style="font-size: 12px;"></a><a href="#" class="like">{LikeButton}
  1037. <svg viewBox="0 0 19 16" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" fill="#000000">
  1038. <path d="M14.0425097,0.000920262799 C16.1435097,-0.0400797372 18.8835097,1.28192026 18.9635097,5.36992026 C19.0525097,9.95492026 15.1985097,13.3079203 9.48350967,16.2089203 C3.76650967,13.3079203 -0.0874903349,9.95492026 0.00150966509,5.36992026 C0.0815096651,1.28192026 2.82150967,-0.0400797372 4.92250967,0.000920262799 C7.02450967,0.0419202628 8.87050967,2.26592026 9.46950967,2.92792026 C10.0945097,2.26592026 11.9405097,0.0419202628 14.0425097,0.000920262799 Z"></path></svg>
  1039. </a><a class="fas fa-link" href="{Permalink}" style="font-size: 12px;" title="{NoteCountWithLabel}"></a></span></center>
  1040. {block:HasTags}<br><div class="tagz">{block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp{/block:Tags}</div>{/block:HasTags}
  1041. {/block:IndexPage}
  1042. </div>
  1043. {/block:Quote}
  1044.  
  1045.  
  1046. {block:Chat}
  1047. <div class="small cap">
  1048. {block:Title}<div class="title">{Title}</div>{/block:Title}
  1049. <ul class="chat lovely">
  1050. {block:Lines}
  1051. <li class="user_{UserNumber}">
  1052. {block:Label}
  1053. <span class="label">{Label}</span>
  1054. {/block:Label}
  1055.  
  1056. {Line}
  1057. </li>
  1058. {/block:Lines}
  1059. </ul>
  1060. {block:IndexPage}
  1061. <center><span class="con"><a class="fas fa-redo" href="{ReblogURL}" style="font-size: 12px;"></a><a href="#" class="like">{LikeButton}
  1062. <svg viewBox="0 0 19 16" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" fill="#000000">
  1063. <path d="M14.0425097,0.000920262799 C16.1435097,-0.0400797372 18.8835097,1.28192026 18.9635097,5.36992026 C19.0525097,9.95492026 15.1985097,13.3079203 9.48350967,16.2089203 C3.76650967,13.3079203 -0.0874903349,9.95492026 0.00150966509,5.36992026 C0.0815096651,1.28192026 2.82150967,-0.0400797372 4.92250967,0.000920262799 C7.02450967,0.0419202628 8.87050967,2.26592026 9.46950967,2.92792026 C10.0945097,2.26592026 11.9405097,0.0419202628 14.0425097,0.000920262799 Z"></path></svg>
  1064. </a><a class="fas fa-link" href="{Permalink}" style="font-size: 12px;" title="{NoteCountWithLabel}"></a></span></center>
  1065. {block:HasTags}<br><div class="tagz">{block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp{/block:Tags}</div>{/block:HasTags}
  1066. {/block:IndexPage}
  1067. </div>
  1068. {/block:Chat}
  1069.  
  1070.  
  1071. {block:Audio}
  1072. <div class="small cap"><div id="audio"><div class="cover"><img src="https://static.tumblr.com/k9utpfa/tcom8wpif/default_cover_m.jpg"></div>{block:AlbumArt}<div class="cover"><img src="{AlbumArtURL}"></div>{/block:AlbumArt}<div class="play">{block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}</div><div class="info lovely"><b>Artist:</b> <span{block:Artist} style="display:none;"{/block:Artist}>Unknown</span>{block:Artist}{Artist}{/block:Artist}<br><b>Title:</b> <span{block:TrackName} style="display:none;"{/block:TrackName}>Unknown</span>{block:TrackName}{TrackName}{/block:TrackName}<br><b>Album:</b> <span{block:Album} style="display:none;"{/block:Album}>Unknown</span>{block:Album}{Album}{/block:Album}{block:PlayCount}<br><b>Plays:</b> {FormattedPlayCount}{/block:PlayCount}</div></div>
  1073. {block:IndexPage}
  1074. <center><span class="con"><a class="fas fa-redo" href="{ReblogURL}" style="font-size: 12px;"></a><a href="#" class="like">{LikeButton}
  1075. <svg viewBox="0 0 19 16" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" fill="#000000">
  1076. <path d="M14.0425097,0.000920262799 C16.1435097,-0.0400797372 18.8835097,1.28192026 18.9635097,5.36992026 C19.0525097,9.95492026 15.1985097,13.3079203 9.48350967,16.2089203 C3.76650967,13.3079203 -0.0874903349,9.95492026 0.00150966509,5.36992026 C0.0815096651,1.28192026 2.82150967,-0.0400797372 4.92250967,0.000920262799 C7.02450967,0.0419202628 8.87050967,2.26592026 9.46950967,2.92792026 C10.0945097,2.26592026 11.9405097,0.0419202628 14.0425097,0.000920262799 Z"></path></svg>
  1077. </a><a class="fas fa-link" href="{Permalink}" style="font-size: 12px;" title="{NoteCountWithLabel}"></a></span></center>
  1078. {block:HasTags}<br><div class="tagz">{block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp{/block:Tags}</div>{/block:HasTags}
  1079. {/block:IndexPage}
  1080. </div>
  1081. {/block:Audio}
  1082.  
  1083. {block:Video}
  1084. {block:IndexPage}
  1085. <a class="reb fas fa-redo" href="{ReblogURL}" style="font-size: 12px;"></a>
  1086. <a href="#" class="likes">{LikeButton}
  1087. <svg viewBox="0 0 19 16" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" fill="#000000">
  1088. <path d="M14.0425097,0.000920262799 C16.1435097,-0.0400797372 18.8835097,1.28192026 18.9635097,5.36992026 C19.0525097,9.95492026 15.1985097,13.3079203 9.48350967,16.2089203 C3.76650967,13.3079203 -0.0874903349,9.95492026 0.00150966509,5.36992026 C0.0815096651,1.28192026 2.82150967,-0.0400797372 4.92250967,0.000920262799 C7.02450967,0.0419202628 8.87050967,2.26592026 9.46950967,2.92792026 C10.0945097,2.26592026 11.9405097,0.0419202628 14.0425097,0.000920262799 Z"></path>
  1089. </svg>
  1090. </a><a class="lin fas fa-link" href="{Permalink}" title="{NoteCountWithLabel}" style="font-size: 12px;"></a>
  1091. <div class="parol video">{Video-500}</div>
  1092. {block:IfCaption}{block:Caption}<span class="cap lovely">{Caption}</span>{/block:Caption}{block:HasTags}<br><div class="tagz">{block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp{/block:Tags}</div>{/block:HasTags}{/block:IfCaption}
  1093. {/block:IndexPage}
  1094. {block:PermalinkPage}
  1095. {Video-500}
  1096. {/block:PermalinkPage}
  1097. {block:Video}
  1098.  
  1099. {block:Answer}
  1100. <div class="small"><div class="q"><img class="ava" src="{AskerPortraitURL-24}"></a><div class="asker"><span>{Asker}</span> asked:</div></div><div class="question lovely">{Question}</div></p><div class="lovely cap">{Answer}</div>
  1101. {block:IndexPage}
  1102. <center><span class="con"><a class="fas fa-redo" href="{ReblogURL}" style="font-size: 12px;"></a><a href="#" class="like">{LikeButton}
  1103. <svg viewBox="0 0 19 16" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" fill="#000000">
  1104. <path d="M14.0425097,0.000920262799 C16.1435097,-0.0400797372 18.8835097,1.28192026 18.9635097,5.36992026 C19.0525097,9.95492026 15.1985097,13.3079203 9.48350967,16.2089203 C3.76650967,13.3079203 -0.0874903349,9.95492026 0.00150966509,5.36992026 C0.0815096651,1.28192026 2.82150967,-0.0400797372 4.92250967,0.000920262799 C7.02450967,0.0419202628 8.87050967,2.26592026 9.46950967,2.92792026 C10.0945097,2.26592026 11.9405097,0.0419202628 14.0425097,0.000920262799 Z"></path></svg>
  1105. </a><a class="fas fa-link" href="{Permalink}" style="font-size: 12px;" title="{NoteCountWithLabel}"></a></span></center>
  1106. {block:HasTags}<br><div class="tagz">{block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp{/block:Tags}</div>{/block:HasTags}
  1107. {/block:IndexPage}
  1108. </div>
  1109. {/block:Answer}
  1110.  
  1111. {block:PermalinkPage}
  1112. <p>{block:Caption}{Caption}{/block:Caption}</p><center>{block:NoteCount}<div style="text-transform: uppercase; color: #5d5d5d;">POSTED {TimeAgo} with {NoteCount} NOTES</div>{/block:NoteCount}<p>{block:RebloggedFrom}via: <a href="{ReblogParentURL}">{ReblogParentName}</a>{block:ContentSource},&nbsp;from: <a href="{ReblogRootURL}">{ReblogRootName}</a>{/block:ContentSource}{/block:RebloggedFrom}</p>{block:HasTags}<p>tagged as: {block:Tags}#<a href="{TagURL}">{Tag}</a>&nbsp;{/block:Tags}</p>{/block:HasTags}</center>
  1113. {/block:PermalinkPage}
  1114.  
  1115. {block:PostNotes}
  1116. <div id="notie">
  1117. <div id="noties">{PostNotes}</div>
  1118. </div>
  1119. {/block:PostNotes}
  1120.  
  1121. </section> <!--.entry-->
  1122.  
  1123. {/block:Posts}
  1124.  
  1125. {block:IfManualLoad}
  1126. {block:Pagination}{block:IndexPage}<a href="#" id="loadmore">LOAD MORE</a>{/block:IndexPage}{/block:Pagination}{/block:IfManualLoad}
  1127.  
  1128. {block:Pagination}
  1129. <div id="page-nav">{block:PreviousPage}<a href="{PreviousPage}">previous</a></a>&nbsp;{/block:PreviousPage}{block:NextPage}&nbsp;<a href="{NextPage}">next</a>{/block:NextPage}</div>
  1130. {/block:Pagination}
  1131.  
  1132. </article> <!--#posts-->
  1133. </div> <!--#wrapper-->
  1134. <a href="https://cafethemes.tumblr.com/" title="theme by caffeous"><span class="lnr lnr-coffee-cup" style="position: fixed;bottom: 10px; right: 5px;font-size:20px;color: {color:Link};"></span></a>
  1135.  
  1136. <script>
  1137. function sticky() {
  1138. var window_top = $(window).scrollTop();
  1139. var div_top = $('#anchor').offset().top;
  1140. var x = window.matchMedia("(min-width: 384px)")
  1141. if (window_top > div_top && x.matches) {
  1142. $('nav').addClass('stick');
  1143. } else {
  1144. $('nav').removeClass('stick');
  1145. }
  1146. }
  1147.  
  1148. $(function () {
  1149. $(window).scroll(sticky);
  1150. sticky();
  1151. });
  1152.  
  1153.  
  1154. $(document).scroll(function () {
  1155. var y = $(this).scrollTop();
  1156. if (y > 200) {
  1157. $('#title').fadeIn();
  1158. } if (y < 200) {
  1159. $('#title').hide();
  1160. }
  1161. });
  1162.  
  1163. </script>
  1164.  
  1165. </body>
  1166. </html>
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!