API tools faq
paste
caffeous

wonderland. theme (fixed width)

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