API tools faq
paste
caffeous

paper theme

caffeous
Jul 27th, 2020 (edited)
7,178
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 46.27 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.  
  13. paper theme by parisians
  14. (Issue No. 05 of Magazine Series)
  15. 2020 © all rights reserved
  16.  
  17. ASSETS:
  18.  
  19. smooth scroll by Zachary Fury
  20. scroll to top by Adriano Carneiro
  21. unnested captions by neothm and magnusthemes
  22. video width fix by nouvae
  23. photoset fix by annasthms and espoirthemes
  24. icons from fontawesome
  25.  
  26. -->
  27.  
  28. <head>
  29.  
  30. <link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
  31. <script src="https://kit.fontawesome.com/f32ce4ad6d.js" crossorigin="anonymous"></script>
  32.  
  33.  
  34. <title>{title}</title>
  35. {block:Description}<meta name="description" content="{metadescription}" />{/block:Description}
  36. <link rel="shortcut icon" href="{Favicon}">
  37. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  38.  
  39. <meta name="color:Body" content="#000000">
  40. <meta name="color:Bold Text" content="#000000">
  41. <meta name="color:Italic Text" content="#000000">
  42. <meta name="color:Background" content="#ffffff">
  43. <meta name="color:Contained Background" content="#f0e5d3">
  44. <meta name="color:Sidebar" content="#d3def0">
  45. <meta name="color:Avatar Shadow" content="bdc8d8">
  46. <meta name="color:Boxes" content="#ffffff">
  47. <meta name="color:Link" content="#000000">
  48. <meta name="color:Hovered Link" content="#eaeaea">
  49. <meta name="color:Permalink" content="#000000">
  50. <meta name="color:Permalink Background" content="#d3def0">
  51. <meta name="color:Liked Button" content="#ff6961">
  52. <meta name="color:Accent" content="#d3def0">
  53. <meta name="color:Accent 2" content="#336699">
  54. <meta name="color:Highlight" content="#ebebeb">
  55. <meta name="color:Scrollbar" content="#000000">
  56. <meta name="color:Tooltip Background" content="#ffffff">
  57. <meta name="color:Tooltip Border" content="#000000">
  58.  
  59. <meta name="font:Title" content="'Montserrat', sans-serif">
  60. <meta name="font:Body" content="'Montserrat', sans-serif">
  61. <meta name="font:Et Cetera" content="'Didot', serif">
  62.  
  63. <meta name="select:Post Alignment" content="top"/>
  64. <meta name="select:Post Alignment" content="middle"/>
  65. <meta name="select:Post Alignment" content="bottom"/>
  66.  
  67. <meta name="image:Avatar" content="">
  68. <meta name="image:Sidebar Background" content="">
  69. <meta name="image:Background" content="">
  70.  
  71. <meta name="if:Masonry" content=""/>
  72. <meta name="if:Infinite Scroll" content="">
  73. <meta name="if:Manual Load" content="">
  74. <meta name="if:Underlined Link" content="">
  75. <meta name="if:Underlined Link on Hover" content="">
  76. <meta name="if:Avatar" content="">
  77. <meta name="if:FAQ 1" content="">
  78. <meta name="if:FAQ 2" content="">
  79. <meta name="if:FAQ 3" content="">
  80. <meta name="if:FAQ 4" content="">
  81. <meta name="if:FAQ 5" content="">
  82. <meta name="if:FAQ 6" content="">
  83. <meta name="if:FAQ 7" content="">
  84. <meta name="if:FAQ 8" content="">
  85. <meta name="if:FAQ 9" content="">
  86. <meta name="if:FAQ 10" content="">
  87. <meta name="if:Extras" content="">
  88. <meta name="if:Updates" content="">
  89. <meta name="if:Tag" content="">
  90. <meta name="if:Update 1" content="">
  91. <meta name="if:Update 2" content="">
  92. <meta name="if:Update 3" content="">
  93. <meta name="if:Update 4" content="">
  94. <meta name="if:Update 5" content="">
  95. <meta name="if:Caption" content="">
  96. <meta name="if:Tags Under Posts" content="">
  97. <meta name="if:Black and White Photo Hover" content="">
  98. <meta name="if:No Background Repeat" content="">
  99. <meta name="if:Inverted Tumblr Controls" content="">
  100.  
  101. <meta name="text:Sidebar From Top" content="185">
  102. <meta name="text:Description From Top" content="30">
  103. <meta name="text:Posts From Top" content="25">
  104. <meta name="text:Load More From Top" content="-365">
  105. <meta name="text:Ask Tab Title" content="ask me anything">
  106. <meta name="text:Home Link Title" content="home">
  107. <meta name="text:Ask Link Title" content="ask">
  108. <meta name="text:Archive Link Title" content="archive">
  109. <meta name="text:Et Cetera Link Title" content="navigate">
  110. <meta name="text:Search Link Title" content="search">
  111. <meta name="text:Quote" content="Type in a quote here!">
  112. <meta name="text:Post Width" content="300">
  113. <meta name="text:Permalink Background Opacity" content="0.7">
  114. <meta name="text:Extras Title" content="extras">
  115. <meta name="text:Updates Title" content="updates">
  116. <meta name="text:Tags Title" content="tags">
  117. <meta name="text:Link 1" content="/">
  118. <meta name="text:Link 1 Title" content="one">
  119. <meta name="text:Link 2" content="/">
  120. <meta name="text:Link 2 Title" content="two">
  121. <meta name="text:Link 3" content="/">
  122. <meta name="text:Link 3 Title" content="three">
  123. <meta name="text:Link 4" content="/">
  124. <meta name="text:Link 4 Title" content="four">
  125. <meta name="text:Link 5" content="/">
  126. <meta name="text:Link 5 Title" content="five">
  127. <meta name="text:Link 6" content="/"/>
  128. <meta name="text:Link 6 Title" content="six">
  129. <meta name="text:Link 7" content="/">
  130. <meta name="text:Link 7 Title" content="seven">
  131. <meta name="text:Link 8" content="/">
  132. <meta name="text:Link 8 Title" content="eight">
  133. <meta name="text:Link 9" content="/">
  134. <meta name="text:Link 9 Title" content="nine">
  135. <meta name="text:Link 10" content="/">
  136. <meta name="text:Link 10 Title" content="ten">
  137. <meta name="text:FAQ Question 1" content="question #1">
  138. <meta name="text:FAQ Answer 1" content="answer #1">
  139. <meta name="text:FAQ Question 2" content="question #2">
  140. <meta name="text:FAQ Answer 2" content="answer #2">
  141. <meta name="text:FAQ Question 3" content="question #3">
  142. <meta name="text:FAQ Answer 3" content="answer #3">
  143. <meta name="text:FAQ Question 4" content="question #4">
  144. <meta name="text:FAQ Answer 4" content="answer #4">
  145. <meta name="text:FAQ Question 5" content="question #5">
  146. <meta name="text:FAQ Answer 5" content="answer #5">
  147. <meta name="text:FAQ Question 6" content="question #6">
  148. <meta name="text:FAQ Answer 6" content="answer #6">
  149. <meta name="text:FAQ Question 7" content="question #7">
  150. <meta name="text:FAQ Answer 7" content="answer #7">
  151. <meta name="text:FAQ Question 8" content="question #8">
  152. <meta name="text:FAQ Answer 8" content="answer #8">
  153. <meta name="text:FAQ Question 9" content="question #9">
  154. <meta name="text:FAQ Answer 9" content="answer #9">
  155. <meta name="text:FAQ Question 10" content="question #10">
  156. <meta name="text:FAQ Answer 10" content="answer #10">
  157. <meta name="text:Updates 1" content="update #1">
  158. <meta name="text:Updates 2" content="update #2">
  159. <meta name="text:Updates 3" content="update #3">
  160. <meta name="text:Updates 4" content="update #4">
  161. <meta name="text:Updates 5" content="update #5">
  162. <meta name="text:Tags 1 Link" content="/">
  163. <meta name="text:Tags 1" content="tags #1">
  164. <meta name="text:Tags 2 Link" content="/">
  165. <meta name="text:Tags 2" content="tags #2">
  166. <meta name="text:Tags 3 Link" content="/">
  167. <meta name="text:Tags 3" content="tags #3">
  168. <meta name="text:Tags 4 Link" content="/">
  169. <meta name="text:Tags 4" content="tags #4">
  170. <meta name="text:Tags 5 Link" content="/">
  171. <meta name="text:Tags 5" content="tags #5">
  172. <meta name="text:Tags 6 Link" content="/">
  173. <meta name="text:Tags 6" content="tags #6">
  174. <meta name="text:Tags 7 Link" content="/">
  175. <meta name="text:Tags 7" content="tags #7">
  176. <meta name="text:Tags 8 Link" content="/">
  177. <meta name="text:Tags 8" content="tags #8">
  178. <meta name="text:Tags 9 Link" content="/">
  179. <meta name="text:Tags 9" content="tags #9">
  180. <meta name="text:Tags 10 Link" content="/">
  181. <meta name="text:Tags 10" content="tags #10">
  182. <meta name="text:Reblog Name" content="reblog">
  183.  
  184. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  185.  
  186. <link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap" rel="stylesheet">
  187.  
  188. <link rel="stylesheet" href="https://static.tumblr.com/ey6clvb/Tlrqa2hos/animate.css">
  189.  
  190. <style type="text/css">
  191.  
  192. /*SIDEBAR*/
  193.  
  194. /*navigation*/
  195. /*tabs*/
  196. .nu {
  197. position: fixed;
  198. text-align: center;
  199. top: calc(40vh - 205px);
  200. left: 353px;
  201. width: 100%;
  202. list-style: none;
  203. font-size: 1.1em;
  204. font-weight: 500;
  205. z-index: 3;
  206. }
  207.  
  208. .nu li {display: inline;}
  209.  
  210. .nu a {text-decoration: none;padding: 0 5px;color: {color:Link};}
  211.  
  212. .nu a:hover {text-decoration: none;color: {color:Link};}
  213.  
  214. .nu a::before, .nu a::after {
  215. display: inline-block;
  216. opacity: 0;
  217. -webkit-transition: -webkit-transform 0.3s, opacity 0.2s;
  218. -moz-transition: -moz-transform 0.3s, opacity 0.2s;
  219. transition: transform 0.3s, opacity 0.2s;
  220. }
  221.  
  222. .nu a::before {
  223. margin-right: 10px;
  224. content: '[';
  225. -webkit-transform: translateX(20px);
  226. -moz-transform: translateX(20px);
  227. transform: translateX(20px);
  228. }
  229.  
  230. .nu a::after {
  231. margin-left: 10px;
  232. content: ']';
  233. -webkit-transform: translateX(-20px);
  234. -moz-transform: translateX(-20px);
  235. transform: translateX(-20px);
  236. }
  237.  
  238. .nu a:hover::before, .nu a:hover::after {opacity: 1;-webkit-transform: translateX(0px);-moz-transform: translateX(0px);transform: translateX(0px);}
  239.  
  240. .nu > .active > a, .nu > .active > a:hover {color: {color:Link};cursor: default;}
  241.  
  242. .nu > .active > a::before, .nu > .active > a:hover::before, .nu > .active > a::after, .nu > .active > a:hover::after {visibility: hidden;}
  243.  
  244. /*tab content*/
  245. .box.active {display: block;width: auto;z-index: 2;}
  246.  
  247. .box.hide {display: none;}
  248.  
  249. /*search*/
  250.  
  251. .search {
  252. position: fixed;
  253. top: calc(40vh - 205px);
  254. left: 50%;
  255. margin-left: -402px;
  256. z-index: 3;
  257. }
  258.  
  259. .search span {position: absolute;bottom: 2px;}
  260.  
  261. .search input {margin-top: 0px;margin-left: 15px;text-align: left;width: auto;font-family: {font:Body};border: 0;background: transparent;}
  262.  
  263. .search input[type=text] {color: {color:Body};transition: all .3s linear;}
  264.  
  265. .search input:focus {color: {color:Body};outline: none;transition: all .3s linear;
  266. }
  267.  
  268. input::-webkit-input-placeholder {opacity: 0.5;color: {color:Body};transition: all .3s linear;}
  269.  
  270. input:-ms-input-placeholder {opacity: 0.5;color: {color:Body};transition: all .3s linear;}
  271.  
  272. input:-moz-placeholder {opacity: 0.5;color: {color:Body};transition: all .3s linear;}
  273.  
  274. .search-form input[type=text]:focus {color: {color:Body};}
  275.  
  276. input:focus::-webkit-input-placeholder {opacity: 1;}
  277.  
  278. input:focus::-moz-placeholder {opacity: 1;}
  279.  
  280. input:-ms-input-placeholder {opacity: 1;}
  281.  
  282. input[type="enter here..."] {box-sizing: content-box;-webkit-appearance: textfield;-moz-box-sizing: content-box; -webkit-box-sizing:content-box;}
  283.  
  284. input[type="enter here..."]::-webkit-search-cancel-button, input[type="enter here..."]::-webkit-search-decoration {-webkit-appearance: none;}
  285.  
  286. /*ASK TAB*/
  287.  
  288. .wrap h1 {
  289. font-size: 2.4em;
  290. -webkit-text-fill-color: transparent;
  291. -webkit-text-stroke-width: 1px;
  292. -webkit-text-stroke-color: {color:Body};
  293. }
  294.  
  295. .i {
  296. text-align: justify;
  297. position: relative;
  298. margin: 0 auto;
  299. padding: 10px;
  300. max-width: 400px;
  301. }
  302.  
  303. .ques {padding: 10px;background: {color:Accent};}
  304.  
  305. .tion {margin-bottom: 15px;padding: 10px;background: {color:Boxes};}
  306.  
  307. /*NAVIGATE TAB*/
  308.  
  309. .boxes {
  310. position: relative;
  311. top: 0px;
  312. margin: 0 auto;
  313. width: 100%;
  314. z-index: 10;
  315. }
  316.  
  317. .boxes li:first-of-type {padding-top: 20px;}
  318.  
  319. .boxes ul {margin-top: -42px;list-style-type: none;}
  320.  
  321. .boxes li {margin-bottom: 10px;background: {color:Boxes};}
  322.  
  323. .e {width: 100px;}
  324.  
  325. .u {text-align: justify;width: 250px;}
  326.  
  327. .t {width: 150px;}
  328.  
  329. .e li, .t li {padding: 5px;}
  330.  
  331. .u h1 {text-align: center;}
  332.  
  333. .u li {padding: 10px;}
  334.  
  335. /*QUOTE*/
  336.  
  337. .s {display: flex;justify-content: center;width: 100%;}
  338.  
  339. .quote {
  340. position: absolute;
  341. top: calc(50vh + 290px);
  342. margin-left: 135px;
  343. font-family: {font:Et Cetera};
  344. font-size: 1.2em;
  345. font-style: italic;
  346. max-width: 600px;
  347. z-index: 10;
  348. }
  349.  
  350. /*BODY*/
  351.  
  352. body {
  353. color: {color:Body};
  354. font-family: {font:Body};
  355. font-weight: 300;
  356. font-size: 11px;
  357. line-height: 1.6;
  358. text-align: justify;
  359. background-color: {color:Background};
  360. background-image: url({image:Background});
  361. background-attachment: fixed;
  362. background-repeat: repeat;
  363. {block:IfNoBackgroundRepeat}
  364. background-size: cover;
  365. {/block:IfNoBackgroundRepeat}
  366. overflow-x: hidden;
  367. }
  368.  
  369. b {font-weight: 500;color: {color:Bold Text};}
  370.  
  371. i {font-style: italic;color: {color:Italic Text};}
  372.  
  373. /*links*/
  374.  
  375. a {color: {color:Link};display: inline-block;position: relative;text-decoration: {block:IfUnderlinedLink}underline{/block:IfUnderlinedLink}{block:IfNotUnderlinedLink}none{/block:IfNotUnderlinedLink};word-break: break-all;-webkit-transition: all 0.4s ease-in-out;-moz-transition: all 0.4s ease-in-out;}
  376.  
  377. a:hover {color: {color:Hovered Link};text-decoration: {block:IfUnderlinedLinkOnHover}underline{/block:IfUnderlinedLinkOnHover}{block:IfNotUnderlinedLinkOnHover}none{/block:IfNotUnderlinedLinkOnHover};}
  378.  
  379. /*ARTICLE*/
  380.  
  381. #wrapper, .wrap {
  382. text-align: center;
  383. margin: 0 auto;
  384. top: calc(45vh - 230px);
  385. left: 83px;
  386. padding-left: 180px;
  387. height: 500px;
  388. width: 970px;
  389. overflow-y: auto;
  390. overflow-x: hidden;
  391. z-index: 1;
  392. box-sizing: border-box;
  393. }
  394.  
  395. #wrapper {position: relative;}
  396.  
  397. .wraps {
  398. position: absolute;
  399. display: flex;
  400. display: -webkit-flex;
  401. justify-content: center;
  402. -webkit-justify-content: center;
  403. width: 100%;
  404. height: 100%;
  405. }
  406.  
  407. .wrap {position: relative;}
  408.  
  409. .wrap:not(.a) {
  410. display: flex;
  411. display: -webkit-flex;
  412. flex-wrap: wrap;
  413. -webkit-flex-wrap: wrap;
  414. justify-content: space-around;
  415. webkit-justify-content: space-around;
  416. }
  417.  
  418. .w {background: {color:Contained Background};z-index: -2;}
  419.  
  420. #posts {
  421. position: relative;
  422. top: {text:Posts From Top}px;
  423. margin: 0 auto;
  424. {block:IndexPage}{block:IfNotInfiniteScroll}margin-bottom: -170px;{/block:IfNotInfiniteScroll}{/block:IndexPage}
  425. overflow: hidden;
  426. }
  427.  
  428. /*SECTION*/
  429.  
  430. section {
  431. position: relative;
  432. text-align: justify;
  433. display: inline-block;
  434. vertical-align: {select:Post Alignment};
  435. max-width:100%;
  436. margin: 20px 25px;
  437. {block:IndexPage}
  438. width: {text:Post Width}px;
  439. word-wrap: break-word;
  440. padding: 5px;
  441. -moz-transition: all .5s;
  442. -webkit-transition: all .5s;
  443. -o-transition: all .5s;
  444. transition: all .5;
  445. {/block:IndexPage}
  446. {block:PermalinkPage}width: 500px;{/block:PermalinkPage}
  447. box-sizing: border-box;
  448. }
  449.  
  450. #vignette, .vignette {opacity: 0;}
  451.  
  452. #tumblr_lightbox, .tmblr-lightbox {background-color: {color:Contained Background} !important;}
  453.  
  454. .lightbox-image, #tumblr_lightbox img {
  455. box-shadow: none!important;
  456. border-radius: 0!important;
  457. max-width: none;
  458. }
  459.  
  460. #tumblr_lightbox_caption, .lightbox-caption {visibility: hidden;}
  461.  
  462. .title {
  463. font-size: 1.5em;
  464. font-family: {font:Title};
  465. text-align: center;
  466. }
  467.  
  468. .post-content div.npf_row, .post div.npf_row, body div.npf_row {margin: 2px 0px !important;}
  469.  
  470. .lovely img {
  471. width: 100%;
  472. height: auto;
  473. overflow-y: auto;
  474. margin: 0 auto;
  475. }
  476.  
  477. .lovely > blockquote {margin: 0; padding: 0;}
  478.  
  479. blockquote p, ul {margin: 0px; padding: 0px;}
  480.  
  481.  
  482. .entry li {margin-left: 20px;list-style-type: square;}
  483.  
  484. /*photoset*/
  485.  
  486. [photoset-layout] {grid-gap: 5px;}
  487.  
  488. [photoset-layout] img {vertical-align: bottom;display: inline;}
  489.  
  490. /*ask*/
  491.  
  492. .q {padding: 10px 10px 15px 10px; background: {color:Accent};}
  493.  
  494. img.ava {display: block;margin-left: 0px;float: left;border-radius: 100%;}
  495.  
  496. .asker {position: relative;margin-left: 7px;margin-top: 2px;text-align: justify;}
  497.  
  498. a.asker, a.asker:hover {font-weight: bold;}
  499.  
  500. .question {position: relative;padding: 10px;background-color: rgba( {RGBcolor:Accent}, 0.5);}
  501.  
  502. /*chat*/
  503.  
  504. .chat li {
  505. margin-left: 0px;
  506. padding: 5px;
  507. list-style-type: none;
  508. }
  509.  
  510. .chat li:nth-child(odd) {background: {color:Accent};}
  511.  
  512. .label {font-weight: bold;}
  513.  
  514. /*permalink*/
  515. .parol {
  516. position: relative;
  517. overflow: hidden;
  518. padding: 0px;
  519. }
  520.  
  521. .parol img {
  522. {block:IndexPage}
  523. width: {text:Post Width}px;
  524. {/block:IndexPage}
  525. {block:PermalinkPage}
  526. width: 500px;
  527. {/block:PermalinkPage}
  528. max-width: 100%;
  529. height: auto;
  530. overflow: hidden;
  531. -webkit-filter: grayscale(0%);
  532. transition: all .3s linear;
  533. padding: 0px;
  534. vertical-align: bottom;
  535. }
  536.  
  537. {block:IndexPage}
  538. .entry:hover .parol img {
  539. {block:IfBlackAndWhitePhotoHover}-webkit-filter: grayscale(100%);{/block:IfBlackAndWhitePhotoHover}
  540. }
  541. {/block:IndexPage}
  542.  
  543. .parol a {color:{color:Permalink};}
  544.  
  545. .parol a:hover {color: {color:Hovered Link};}
  546.  
  547. {block:IndexPage}
  548.  
  549. .cone {;display: inline-block;position: relative;width: 100%;font-size: 17px;}
  550.  
  551. .cone span {background: {color:Contained Background};}
  552.  
  553. .cone:before {
  554. content:"";
  555. position: absolute;
  556. top: 10px;
  557. border-bottom: 1px solid {color:Accent 2};
  558. width: 100%;
  559. z-index: -1;
  560. }
  561.  
  562. .cone a, .cone a:hover {text-decoration: none;}
  563.  
  564. .cones {font-size: 0.7em;}
  565.  
  566. .entry.pho .cone {display: none;}
  567.  
  568. .con {
  569. text-align: center;
  570. position: absolute;
  571. top: 0px;
  572. font-size: 25px;
  573. height: 100%;
  574. width: 100%;
  575. background-color: rgba({RGBcolor:Permalink Background}, 0);
  576. opacity: 0;
  577. z-index: 2;
  578. -webkit-transition: all 0.4s ease-in-out;
  579. -moz-transition: all 0.4s ease-in-out;
  580. transition: all 0.4s ease-in-out;
  581. }
  582.  
  583. .parol:hover .con {
  584. background-color: rgba({RGBcolor:Permalink Background}, {text:Permalink Background Opacity});
  585. opacity: 1;
  586. }
  587.  
  588. .con a {padding: 10px 0px;}
  589.  
  590. .trol {position: relative;top: calc(50% - 25px);max-height: 100%;}
  591.  
  592. .trol a, .trol a:hover {text-decoration: none;}
  593.  
  594. svg {fill: {color:Link}; max-width: 100%;width: 25px;height: 25px;}
  595.  
  596. .like .liked + span {opacity: 1;color: {color:Liked Button};}
  597.  
  598. .like .like_button iframe {
  599. position: absolute;
  600. top: 0;
  601. left: 0;
  602. bottom: 0;
  603. right: 0;
  604. z-index: 3;
  605. opacity: 0;
  606. width: 100%;
  607. height: 100%;
  608. }
  609. {/block:IndexPage}
  610.  
  611. /*audio*/
  612.  
  613. #audio {height: auto; min-height: 60px; padding-bottom: 0px;}
  614.  
  615. .cover {position: absolute;z-index: 1;width: 60px;height: 62px;}
  616.  
  617. .cover img {float: left;width: 60px;height: 62px;}
  618.  
  619. .play {
  620. opacity: 0.6;
  621. width: 32px;
  622. height: 32px;
  623. overflow-x: hidden;
  624. position: absolute;
  625. z-index: 1;
  626. margin-left: 15px;
  627. margin-top: 17px;
  628. text-align: center;
  629. }
  630.  
  631. .info {
  632. margin-left: 65px;
  633. height: auto;
  634. padding: 0px 5px 5px 5px;
  635. line-height: 14px;
  636. }
  637.  
  638. .spotify_audio_player {height:80px!important;width:100%!important;}
  639.  
  640. .bandcamp_audio_player {height:120px!important;width:100%!important;}
  641.  
  642. .soundcloud_audio_player {height:150px!important;width:100%!important;}
  643.  
  644. /*captions*/
  645. .cap {position: relative;text-align: justify;}
  646.  
  647. .cap .tumblr_parent {border: none;margin:10px 0px 0px;}
  648.  
  649. .cap a.tumblr_blog{position: relative;text-decoration: none;{block:IndexPage}color: {color:Permalink};{/block:IndexPage}font-family: {font:Et Cetera};font-weight: 400;text-transform: uppercase;}
  650.  
  651. /*video*/
  652.  
  653. .video {vertical-align: bottom;line-height: 0;}
  654.  
  655. /*permalink page*/
  656. #noties {text-align: justify;border: 0px;}
  657.  
  658. #noties blockquote {border: 0px;}
  659.  
  660. #notie {
  661. border: 0px;
  662. margin-top: 20px;
  663. margin-left: -60px;
  664. line-height: 20px;
  665. padding: 5px;
  666. z-index: 2;
  667. }
  668.  
  669. #notie img {
  670. display: block;
  671. float: left;
  672. margin-bottom: -5px;
  673. margin-right: 5px;
  674. border-radius: 100%;
  675. }
  676.  
  677. #notie li {list-style-type: none;margin: 5px;margin-left: 10px;}
  678.  
  679.  
  680. /*OTHERS*/
  681.  
  682. /*tumblr controls*/
  683.  
  684. .tmblr-iframe-compact .tmblr-iframe--unified-controls {
  685. position: fixed;
  686. top: 0px;
  687. right: 0px;
  688. opacity: 1;
  689. {block:IfInvertedTumblrControls}
  690. -webkit-filter:invert(85%);
  691. filter:invert(85%);
  692. {/block:IfInvertedTumblrControls}
  693. {block:IfNotInvertedTumblrControls}
  694. -webkit-filter:invert(0%);
  695. filter:invert(0%);
  696. {/block:IfNotInvertedTumblrControls}
  697. transform:scale(0.6);
  698. transform-origin:100% 0;
  699. -webkit-transform:scale(0.6);
  700. -webkit-transform-origin:100% 0;
  701. -ms-transform:scale(0.6);
  702. -ms-transform-origin:100% 0;
  703. }
  704.  
  705. .tmblr-iframe--app-cta-button {display:none!important;}
  706.  
  707. /*pagination*/
  708.  
  709. {block:IfInfiniteScroll}
  710. .page-nav {display: none;}
  711. {/block:IfInfiniteScroll}
  712.  
  713. {block:IfNotInfiniteScroll}
  714. .page-nav {
  715. position: relative;
  716. margin-bottom: -42px;
  717. left: 85px;
  718. width: 50px;
  719. font-family: {font:Body};
  720. font-size: 3em;
  721. font-weight: 700;
  722. text-transform: uppercase;
  723. }
  724.  
  725. .page-nav a {
  726. text-align: center;
  727. color: {color:Permalink};
  728. text-decoration: none;
  729. }
  730. {/block:IfNotInfiniteScroll}
  731.  
  732. #infscr-loading {display: none!important;}
  733.  
  734. .loadmore {
  735. position: relative;
  736. bottom: {text:Load More From Top}px;
  737. left: -20px;
  738. padding: 5px 5px 5px 6px;
  739. color: {color:Permalink};
  740. background: {color:Sidebar};
  741. text-align: center;
  742. width: 75px;
  743. z-index: 10;
  744. }
  745.  
  746. a.loadmore {text-decoration: none;}
  747.  
  748. a.loadmore:hover {color: {color:Link};}
  749.  
  750. .lol {visibility: hidden;}
  751.  
  752. /*scrollbar*/
  753.  
  754. #wrapper::-webkit-scrollbar-thumb, .wrap::-webkit-scrollbar-thumb {
  755. background-color: {color:Scrollbar};
  756. border: 1px solid {color:Contained Background};
  757. height: 6px;
  758. -moz-border-radius: 15px;
  759. border-radius: 15px;
  760. z-index: -1;
  761. }
  762.  
  763. #wrapper::-webkit-scrollbar, .wrap::-webkit-scrollbar {
  764. background-color: {color:Scrollbar};
  765. border: 2px solid {color:Contained Background};
  766. height: 6px;
  767. width: 5px;
  768. }
  769.  
  770. #wrapper::-webkit-scrollbar:horizontal, .wrap::-webkit-scrollbar:horizontal {display: none;}
  771.  
  772. aside .desc::-webkit-scrollbar-thumb, aside .desc::-webkit-scrollbar, aside .desc::-webkit-scrollbar:horizontal {display: none;}
  773.  
  774. /*scroll to top*/
  775. .scroll {position: fixed;bottom: 35px;right: 7px;}
  776.  
  777. /*highlight*/
  778.  
  779. ::selection {color: {color:Highlight};background-color: transparent;}
  780.  
  781. ::-moz-selection {color: {color:Highlight};background-color: transparent;}
  782.  
  783. ::-webkit-selection {color: {color:Highlight};background-color: transparent;}
  784.  
  785. /*tooltip*/
  786.  
  787. #s-m-t-tooltip {
  788. margin: 23px 23px 0 0;
  789. padding: 3px;
  790. border: 1px solid {color:Tooltip Border};
  791. color: #000;
  792. background-color: {color:Tooltip Background};
  793. text-transform: uppercase;
  794. letter-spacing: 2px;
  795. z-index: 999999999999;
  796. max-width: 250px;
  797. }
  798.  
  799. @media screen and (min-width: 1189px) {
  800.  
  801. header {display: none;}
  802.  
  803. {block:IndexPage}.wrap:not(.n) {left: 78px;}{/block:IndexPage}
  804.  
  805. /*SIDEBAR*/
  806.  
  807. aside {
  808. display: flex;
  809. display: -webkit-flex;
  810. flex-direction: column;
  811. -webkit-flex-direction: column;
  812. align-items: stretch;
  813. position: fixed;
  814. top: calc(45vh - {text:Sidebar from Top}px);
  815. left: 50%;
  816. margin-left: -567px;
  817. padding: 0px 20px;
  818. width: 340px;
  819. height: auto;
  820. background: {color:Sidebar};
  821. z-index: 3;
  822. box-sizing: border-box;
  823. }
  824.  
  825. aside h1 {
  826. text-align: right;
  827. position: relative;
  828. margin: 0 auto;
  829. padding: 0px;
  830. margin-top: -51px;
  831. margin-left: 33px;
  832. width: 100%;
  833. font-family: 'Montserrat', sans-serif;
  834. font-size: 3.75em;
  835. line-height: 1.3;
  836. -webkit-text-fill-color: transparent;
  837. -webkit-text-stroke-width: 1px;
  838. -webkit-text-stroke-color: {color:Body};
  839. }
  840.  
  841. aside > h1 > a, aside > h1 > a:hover {text-decoration: none;word-break: normal;}
  842.  
  843. aside .desc {padding: 0px;max-height: 248px;overflow: auto;}
  844.  
  845. .lm {display: none;}
  846.  
  847. .avo {-webkit-align-self: center;align-self: center;}
  848.  
  849. img.avi {width: 65px;border-radius: 100%;box-shadow: -5px -5px {color:Avatar Shadow};}
  850.  
  851. }
  852.  
  853. @media screen and (max-width: 1188px) {
  854.  
  855. #wrapper {
  856. padding-left: 0px;
  857. width: 100%;
  858. max-width: 100%;
  859. border-radius: 10px;
  860. }
  861.  
  862. #wrapper, .wrap {top: calc(45vh - 250px);left: 0px;height: 500px;}
  863.  
  864. .wrap:not(.n) {width: calc(100% - 10px);left: -5px;}
  865.  
  866. .wrap:not(.a) {width: 100%;}
  867.  
  868. .search {top: 5px;left: 10px;margin-left: 0px;}
  869.  
  870. aside h1, aside .desc, aside .avo, aside .page-nav {display: none;}
  871.  
  872. .lm {
  873. display: flex;
  874. display: -webkit-flex;
  875. justify-content: center;
  876. width: 100%;
  877. z-index: 9;
  878. }
  879.  
  880. .lm .page-nav {
  881. position: fixed;
  882. bottom: 40px;
  883. margin-left: -20px;
  884. width: calc(100% - 90px);}
  885.  
  886. .nu {font-weight: bold;top: calc(40vh - 215px);left: 0px;}
  887.  
  888. .wrap {padding-left: 0px;border-radius: 10px;}
  889.  
  890. .wrap:not(.a) {padding: 0px 20px;}
  891.  
  892. .boxes {margin: 20px;}
  893.  
  894. #posts {{block:IndexPage}top: 0px;{/block:IndexPage}}
  895.  
  896. .quote {top: calc(50vh + 277px);margin-left: 0px;padding: 0 20px;}
  897.  
  898. /*header*/
  899. header {
  900. text-align: center;
  901. position: relative;
  902. padding: 5px;
  903. padding-bottom: 10px;
  904. background: {color:Sidebar};
  905. z-index: 3;
  906. border-top-left-radius: 10px;
  907. border-top-right-radius: 10px;
  908. }
  909.  
  910. header h1 {
  911. text-align: center;
  912. position: fixed;
  913. margin-top: -30px;
  914. margin-left: -10px;
  915. padding: 0px;
  916. width: calc(100% - 50px);
  917. font-family: 'Montserrat', sans-serif;
  918. font-size: 4em;
  919. -webkit-text-fill-color: transparent;
  920. -webkit-text-stroke-width: 1px;
  921. -webkit-text-stroke-color: {color:Body};
  922. line-height: 1;
  923. }
  924.  
  925. header > h1 > a, header > h1 > a:hover {text-decoration: none;word-break: normal;}
  926.  
  927. header .desc {
  928. position: relative;
  929. text-align: justify;
  930. margin: auto;
  931. padding-top: {text:Description From Top}px;
  932. width: 500px;
  933. max-height: 200px;
  934. overflow: auto;
  935. }
  936.  
  937. .box.active {display: block;width: auto;}
  938.  
  939. .box.hide {display: none;}
  940.  
  941. .ques {border-top-left-radius: 5px;border-top-right-radius: 5px;}
  942.  
  943. .tion {border-bottom-left-radius: 5px;border-bottom-right-radius: 5px;}
  944.  
  945. #wrapper::-webkit-scrollbar-thumb, #wrapper::-webkit-scrollbar, #wrapper::-webkit-scrollbar:horizontal {display: none;}
  946.  
  947. .loadmore {
  948. position: fixed;
  949. bottom: 0px;
  950. left: 50%;
  951. margin-left: -42px;
  952. color: {color:Permalink};
  953. background: none;
  954. z-index: 10;
  955. }
  956.  
  957. a.loadmore {text-decoration: underline;}
  958.  
  959. .cup {display: none;}
  960. }
  961.  
  962. @media screen and (min-width: 802px) {.nu h1 {display: none;}}
  963.  
  964. @media screen and (max-width: 801px) {
  965.  
  966. #wrapper, .wrap {top: 50px;height: 490px;}
  967.  
  968. .nu {top: 20px;}
  969.  
  970. header h1 {display: none;}
  971.  
  972. .nu {top: 20px;}
  973.  
  974. .nu h1 {
  975. font-size: 1.6em;
  976. -webkit-text-fill-color: transparent;
  977. -webkit-text-stroke-width: 1px;
  978. -webkit-text-stroke-color: {color:Body};
  979. }
  980.  
  981. header .desc {padding: 0px 5px;box-sizing: border-box;}
  982.  
  983. .search {top: 96vh;margin-left: 0px;}
  984.  
  985. #posts {margin-top: 0px;}
  986.  
  987. body {overflow: hidden;}
  988.  
  989. .tmblr-iframe-compact .tmblr-iframe--unified-controls {display: none!important;}
  990.  
  991. tumblr_controls, .tmblr-iframe{display: none!important;}
  992. }
  993.  
  994. @media screen and (width: 1242px) and (height: 699px) {
  995. .tmblr-iframe-compact .tmblr-iframe--unified-controls {display: none!important;}
  996.  
  997. tumblr_controls, .tmblr-iframe{display: none!important;}
  998. }
  999.  
  1000. @media screen and (max-width: 600px) {
  1001.  
  1002. #wrapper, .wrap {height: 510px;}
  1003.  
  1004. #posts {top: 10px;}
  1005.  
  1006. .nu h1 {font-size: 1.2em;letter-spacing: 0.8px;margin-right: 10px;}
  1007.  
  1008. .nu a {word-break: normal;}
  1009.  
  1010. header .desc {width: 100%;}
  1011.  
  1012. .scroll {bottom: 3px;right: 25px;}
  1013.  
  1014. .quote {display: none;}
  1015. }
  1016.  
  1017. @media screen and (max-width: 576px) {
  1018.  
  1019. #posts {margin-top: -49px;}
  1020.  
  1021. section, .parol:not(.ps) img {width: 100%;max-width: 100%;}
  1022.  
  1023. section {margin: 25px 0px;}
  1024. }
  1025.  
  1026. @media screen and (max-width: 303px) {#wrapper, .wrap {top: 100px;height: 450px;}}
  1027.  
  1028. @media screen and (max-width: 802px) and (min-height: 1023px) {
  1029. #wrapper, .wrap {height: 850px;}
  1030. .quote {top: 94vh;}
  1031. }
  1032.  
  1033. @media screen and (max-width: 802px) and (min-height: 1279px) {#wrapper, .wrap {height: 1070px;}}
  1034.  
  1035. @media screen and (max-width: 769px) and (min-height: 959px) {
  1036. #wrapper, .wrap {height: 800px;}}
  1037.  
  1038. @media screen and (max-width: 769px) and (min-height: 1330px) {#wrapper, .wrap {height: 1090px;}}
  1039.  
  1040. @media screen and (max-width: 1188px) and (max-height: 641px) {
  1041. .quote {display: none;}
  1042.  
  1043. #wrapper, .wrap {top: 50px;height: 420px;}
  1044.  
  1045. .nu {top: 20px;}
  1046.  
  1047. .loadmore {position: fixed; bottom: 0px;z-index: 9 !important}
  1048. }
  1049.  
  1050. @media screen and (max-width: 813px) and (max-height: 526px) {
  1051.  
  1052. #wrapper, .wrap {height: 230px;}
  1053.  
  1054. .search {top: 93vh;}
  1055. }
  1056.  
  1057. @media screen and (max-width: 415px) and (max-height: 737px) {
  1058. {block:IfNotInfiniteScroll}.scroll {bottom: 7px;right: 50px;}{/block:IfNotInfiniteScroll}}
  1059.  
  1060. @media screen and (max-width: 321px) and (max-height: 569px) {
  1061. #wrapper, .wrap {height: 375px;}}
  1062.  
  1063. @media screen and (max-width: 321px) and (max-height: 481px) {#wrapper, .wrap {height: 305px;}}
  1064.  
  1065. @media screen and (max-height: 641px) and (max-width: 600px) {
  1066.  
  1067. #wrapper, .wrap {top: 70px;}
  1068.  
  1069. .loadmore {position: fixed;bottom: 100px;}
  1070.  
  1071. a.loadmore {background: {color:Sidebar};}
  1072.  
  1073. }
  1074.  
  1075. @media screen and (max-width: 241px) and (max-height: 320px) {
  1076.  
  1077. #wrapper, .wrap {top: 100px;height: 120px;}
  1078.  
  1079. header {display: none;}
  1080. }
  1081.  
  1082. @media screen and (min-width: 1200px) and (max-height: 700px) {
  1083.  
  1084. #wrapper, .wrap {top: calc(45vh - 230px);height: 450px;}
  1085.  
  1086. .nu, .search {top: calc(40vh - 195px);}
  1087.  
  1088. .quote {top: calc(50vh + 230px);}
  1089.  
  1090. }
  1091.  
  1092. @media screen and (min-width: 1365px) and (min-height: 767px) {
  1093.  
  1094. #wrapper, .wrap {top: calc(45vh - 250px);height: 450px;}
  1095.  
  1096. .nu, .search {top: calc(40vh - 205px);}
  1097.  
  1098. .quote {top: calc(50vh + 200px);}
  1099.  
  1100. aside {top: calc(43vh - {text:Sidebar From Top}px);}
  1101.  
  1102. }
  1103.  
  1104. </style>
  1105.  
  1106. <title>{title}</title>
  1107.  
  1108. <!--scripts-->
  1109.  
  1110. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  1111.  
  1112. <script src="https://rawgit.com/robinpx/tumblr/master/scripts/flexibleFrames/flexibleFrames.min.js"></script>
  1113. <script>
  1114. $(document).ready(function() {
  1115. flexibleFrames($(".video"));
  1116. });
  1117. </script>
  1118.  
  1119. <link href="https://static.tumblr.com/0podkko/oDSpg7y88/photosets.css" rel="stylesheet">
  1120.  
  1121. <script src="https://static.tumblr.com/wgg6svp/OoTofxa0c/unnest.min.js"></script>
  1122. <script> $(function(){ $('.entry').unnest({
  1123. yourCaption: ".cap", //your caption selector, the div wrapping {Caption}
  1124. wrapName: ".tumblr_parent",
  1125. newCaptionUsername: true,
  1126. originalPostCaptionUsername: false,
  1127. tumblrAvatars: false,
  1128. tumblrAvatarClass: ".tumblr_avatar",
  1129. usernameColon: true
  1130. }); });</script>
  1131.  
  1132. <script>
  1133. $(document).ready(function() {
  1134. $('.nu > li > a').click(function(event){
  1135. event.preventDefault();
  1136. var first = $('.nu > li.active > a').attr('href'),
  1137. second = $('.nu > li.active'),
  1138. third = $(this).attr('href');
  1139. $(first).removeClass('active');
  1140. $(first).addClass('hide');
  1141. second.removeClass('active');
  1142. $(this).parents('li').addClass('active');
  1143. $(third).removeClass('hide');
  1144. $(third).addClass('active');
  1145. });
  1146. });
  1147. </script>
  1148.  
  1149. <script src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.10/SmoothScroll.min.js"></script>
  1150.  
  1151. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  1152.  
  1153. <script>
  1154.  
  1155. (function($){
  1156.  
  1157. $(document).ready(function(){
  1158.  
  1159. $("a[title]").style_my_tooltips({
  1160.  
  1161. tip_follows_cursor:true,
  1162.  
  1163. tip_delay_time:200,
  1164.  
  1165. tip_fade_speed:500,
  1166.  
  1167. attribute:"title"
  1168.  
  1169. });
  1170.  
  1171. });
  1172.  
  1173. })(jQuery);
  1174.  
  1175. </script>
  1176.  
  1177. <script>
  1178. $(function() {
  1179. $('.scroll').css('opacity', 0);
  1180.  
  1181. $('#wrapper, .wrap').scroll(function() {
  1182. var total = $(this)[0].scrollHeight - $(this).height();
  1183. var opacity = $(this).scrollTop() / total;
  1184. $('.scroll').css('opacity', opacity);
  1185. });
  1186.  
  1187. $('.scroll').click(function() {
  1188. $('#wrapper, .wrap').animate({
  1189. scrollTop: 0
  1190. }, 800);
  1191. });
  1192. });
  1193. </script>
  1194.  
  1195. <!--infinite scroll-->
  1196. {block:IfMasonry}<script src="https://static.tumblr.com/bswe8t6/UFVlryaq2/jquerymsnryv2.js"></script>{/block:IfMasonry}
  1197. {block:indexpage}
  1198. {block:IfInfiniteScroll}
  1199. <script src="https://static.tumblr.com/ey6clvb/mJoq9x5i5/jquery.infinitescroll.min.js"></script>
  1200. {/block:IfInfiniteScroll}
  1201. <script>
  1202. var isPaused = true;
  1203. var $container = $("#posts");
  1204.  
  1205. function flexFrame() {
  1206. $(".cap").each(function() {
  1207. $(this).find("iframe").wrap("<div class='capframe'></div>"); // wrap iframe
  1208. flexibleFrames($(".capframe"));
  1209. });
  1210. flexibleFrames($(".video"));
  1211. setTimeout(function() {
  1212. isPaused = false;
  1213. }, 2000);
  1214. }
  1215.  
  1216. function check(callback) {
  1217. if (isPaused === true) {
  1218. setTimeout(function() { check(callback) }, 2000);
  1219. }
  1220. else {
  1221. callback();
  1222. isPaused = true;
  1223. }
  1224. }
  1225.  
  1226. $(document).ready(function(){
  1227. {block:IfMasonry}
  1228. var $container = $('#posts');
  1229. $container.imagesLoaded( function(){
  1230. $container.masonry({
  1231. itemSelector: 'section',
  1232. isFitWidth: true,
  1233. isAnimated: false
  1234. });
  1235. });
  1236. {/block:IfMasonry}
  1237. {block:IfInfiniteScroll}
  1238. $('.entry').unnest();
  1239. var $container = $('#posts');
  1240. $container.infinitescroll({
  1241. {block:IfNotManualLoad}binder: $('#wrapper'),{/block:IfNotManualLoad}
  1242. itemSelector: '.entry',
  1243. navSelector: '.page-nav',
  1244. nextSelector: '.page-nav a',
  1245. loadingImg: '',
  1246. loadingText: '<em></em>',
  1247. bufferPx: 2000,
  1248. debug: false,
  1249. {block:IfManualLoad}
  1250. errorCallback: function(){
  1251. $('.loadmore').fadeOut('normal');
  1252. }
  1253. {/block:IfManualLoad}
  1254. {block:IfNotManualLoad}
  1255. errorCallback: function(){
  1256. $('#infscr-loading').fadeOut('normal');
  1257. }
  1258. {/block:IfNotManualLoad}
  1259. },
  1260. function( newElements ) {
  1261. flexibleFrames($(".video"));
  1262. var $newElems = $( newElements );
  1263. {block:IfMasonry}$newElems.hide();{/block:IfMasonry}
  1264. var $newElemsIDs = $newElems.map(function(){
  1265. return this.id;
  1266. }).get();
  1267. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  1268. $newElems.unnest({
  1269. yourCaption: ".cap",
  1270. wrapName: ".tumblr_parent",
  1271. newCaptionUsername: true,
  1272. originalPostCaptionUsername: false,
  1273. tumblrAvatars: false,
  1274. tumblrAvatarClass: ".tumblr_avatar",
  1275. usernameColon: true
  1276. });
  1277. {block:IfMasonry}
  1278. $newElems.imagesLoaded(function(){
  1279. $container.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
  1280. });{/block:IfMasonry}
  1281. });
  1282. {block:IfManualLoad}
  1283. $(window).unbind('.infscr');
  1284. $('.loadmore').click(function(){
  1285. $container.infinitescroll('retrieve');
  1286. $("#posts").fadeIn("slow");
  1287. return false
  1288. });
  1289. {/block:IfManualLoad}
  1290. {/block:IfInfiniteScroll}
  1291. $('section[class=box]').each(function () {
  1292. var $this = $(this);
  1293. $this.on('#wrapper', function () {
  1294. $container.imagesLoaded( function () {
  1295. $container.masonry({
  1296. itemSelector: 'section'
  1297. });
  1298. });
  1299. });
  1300. });
  1301. });
  1302.  
  1303. {block:IfMasonry}
  1304. $('.nu > li > a').on('click', function() {
  1305. setTimeout( function() {
  1306. var $container = $('#posts');
  1307. $container.imagesLoaded( function () {
  1308. $container.masonry({
  1309. itemSelector: 'section'
  1310. });
  1311. }, 0);
  1312. });
  1313. });
  1314. {/block:IfMasonry}
  1315. </script>
  1316. {/block:indexpage}
  1317.  
  1318. </head>
  1319. <body>
  1320.  
  1321. <ul class="nu">
  1322. <h1><a href="/">{Title}</h1></a>
  1323. <li class="active"><a href="#home">{text:Home Link Title}</a></li>
  1324. <li><a href="#ask">{text:Ask Link Title}</a></li>
  1325. {block:SubmissionsEnabled}<a href="/submit">submit</a>{/block:SubmissionsEnabled}
  1326. <a href="/archive">{text:Archive Link Title}</a>
  1327. <li><a href="#etc">{text:Et Cetera Link Title}</a></li>
  1328. <a href="https://cafethemes.tumblr.com/">theme</a>
  1329. </ul>
  1330.  
  1331. <div class="search"><span class="lnr lnr-magnifier"></span> <form action="/search" method="get"><input type="text" id="searchField" name="q" placeholder="search..." value="" autocomplete="off"></form></div>
  1332.  
  1333. <aside><p><h1><a href="/" title="refresh">{Title}</a></h1></p>{block:IfAvatar}<span class="avo"><img ondragstart="return false;" class="avi" src="{image:Avatar}"></span>{/block:IfAvatar}<br><div class="desc">{block:Description}{Description}{/block:Description}</div>
  1334. {block:IfNotInfiniteScroll}{block:Pagination}<div class="page-nav">{block:PreviousPage}<a href="{PreviousPage}" style="float: left;"><</a>{/block:PreviousPage}{block:NextPage}<a href="{NextPage}" style="float: right;">></a>{/block:NextPage}</div>{/block:Pagination}{/block:IfNotInfiniteScroll}</aside>
  1335.  
  1336. <div class="s"><div class="quote">{text:Quote}</div></div>
  1337.  
  1338. <div class="lm">
  1339. {block:IfNotInfiniteScroll}{block:Pagination}<div class="page-nav">{block:PreviousPage}<a href="{PreviousPage}" style="float: left;"><</a>{/block:PreviousPage}{block:NextPage}<a href="{NextPage}" style="float: right;">></a>{/block:NextPage}</div>{/block:Pagination}{/block:IfNotInfiniteScroll}
  1340. </div>
  1341.  
  1342. <section id="home" class="box active">
  1343. <div id="wrapper" class="w">
  1344.  
  1345. <header><h1><a href="/" title="refresh">{Title}</a></h1><div class="desc"><p>{block:Description}{Description}{/block:Description}</p></div></header>
  1346.  
  1347. <article id="posts">
  1348. {block:Posts}
  1349. <section class="entry {block:Photo}pho{/block:Photo}" id="{PostID}">
  1350.  
  1351. {block:Text}
  1352. {block:Title}<div class="title">{Title}</div>{/block:Title}
  1353. <div class="lovely cap">{Body}</div>
  1354. {/block:Text}
  1355.  
  1356.  
  1357. {block:Link}
  1358. <a href="{URL}" class="title">{Name}</a>
  1359. <div class="lovely cap">{block:Description}{Description}{/block:Description}</div>
  1360. {block:Link}
  1361.  
  1362. {block:Photo}
  1363. <div class="parol">
  1364. {block:IndexPage}
  1365. <span class="con"><span class="trol"><a class="reb" href="{ReblogURL}" title="{text:Reblog Name}"><span class="lnr lnr-sync"></span></a>&nbsp;&nbsp;<a href="#" class="like" title="like">{LikeButton} <span class="lnr lnr-heart"></span></a>&nbsp;&nbsp;<a class="perm" href="{Permalink}" title="{NoteCountWithLabel}"><span class="lnr lnr-link"></span></a></span></span>
  1366. <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" src="{PhotoURL-HighRes}" alt="{PhotoAlt}"></a>
  1367. {/block:IndexPage}
  1368. {block:PermalinkPage}{LinkOpenTag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="500"/>{LinkCloseTag}
  1369. {/block:PermalinkPage}
  1370. </div>
  1371. {/block:Photo}
  1372.  
  1373. {block:Photoset}
  1374. {block:IndexPage}
  1375. <div class="parol ps"><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>
  1376. {/block:IndexPage}
  1377. {block:PermalinkPage}<div class="photoset-grid" photoset-layout="{PhotosetLayout}">{block:Photos}<div><img src="{PhotoURL-HighRes}" /></div>{/block:Photos}</div>{/block:PermalinkPage}
  1378. {/block:Photoset}
  1379.  
  1380.  
  1381. {block:Quote}
  1382. <div class="lovely"><p><div class="title" style="font-size: 1.2em;">{Quote}</div></p>
  1383. <p>{block:Source}{Source}{/block:Source}</p></div>
  1384. {/block:Quote}
  1385.  
  1386.  
  1387. {block:Chat}
  1388. {block:Title}<div class="title">{Title}</div>{/block:Title}
  1389. <ul class="chat lovely">
  1390. {block:Lines}
  1391. <li class="user_{UserNumber}">
  1392. {block:Label}
  1393. <span class="label">{Label}</span>
  1394. {/block:Label}
  1395.  
  1396. {Line}
  1397. </li>
  1398. {/block:Lines}
  1399. </ul>
  1400. {/block:Chat}
  1401.  
  1402.  
  1403. {block:Audio}
  1404. <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>
  1405. {/block:Audio}
  1406.  
  1407. {block:Video}
  1408. {block:IndexPage}
  1409. <div class="parol">
  1410. <div class="video">{Video-500}</div></div>
  1411. {/block:IndexPage}
  1412. {block:PermalinkPage}{Video-500}{/block:PermalinkPage}
  1413. {block:Video}
  1414.  
  1415. {block:Answer}
  1416. <div class="q"><img class="ava" src="{AskerPortraitURL-24}"></a><div class="asker">{Asker} said:</div></div><div class="question lovely">{Question}</div></p><div class="lovely">{Answer}</div>
  1417. {/block:Answer}
  1418.  
  1419. {block:IndexPage}
  1420. {block:IfCaption}{block:Caption}<br><span class="lovely cap">{Caption}</span>{/block:Caption}{/block:IfCaption}
  1421. <br>
  1422. <span class="cone"><span style="float: left;padding-right: 10px;"><a href="{ReblogURL}" title="{text:Reblog Name}"><span class="lnr lnr-sync"></span></a>&nbsp;&nbsp;<a href="#" class="like" title="like">{LikeButton} <span class="lnr lnr-heart"></span></a>&nbsp;&nbsp;<a href="{Permalink}" title="{NoteCountWithLabel}"><span class="lnr lnr-link"></span></a></span><span class="cones" style="float: right;padding-left: 10px;">{block:Date}posted on <b>{DayOfMonthWithZero} {ShortMonth} {Year}</b>{/block:Date}</span></span>
  1423. {block:IfTagsUnderPosts}{block:HasTags}<p><center>{block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp{/block:Tags}</center></p>{/block:HasTags}{/block:IfTagsUnderPosts}
  1424. {/block:IndexPage}
  1425.  
  1426. {block:PermalinkPage}
  1427. <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>
  1428. {/block:PermalinkPage}
  1429.  
  1430. {block:PostNotes}
  1431. <div id="notie">
  1432. <div id="noties">{PostNotes}</div>
  1433. </div>
  1434. {/block:PostNotes}
  1435.  
  1436. </section> <!--.entry-->
  1437.  
  1438. <!-- {block:NoRebloggedFrom}
  1439. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  1440. {/block:NoRebloggedFrom} -->
  1441. {block:ContentSource}
  1442. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  1443. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1444. {/block:SourceLogo}
  1445. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1446. {/block:ContentSource}
  1447. {/block:Posts}
  1448. </article> <!--#posts-->
  1449.  
  1450. <aside>{block:IfManualLoad}
  1451. {block:Pagination}{block:IndexPage}<a href="#" class="loadmore">LOAD MORE</a>{/block:IndexPage}{/block:Pagination}{/block:IfManualLoad}</aside>
  1452.  
  1453. {block:Pagination}
  1454. <div class="page-nav lol">{block:PreviousPage}<a href="{PreviousPage}" style="float: left;">previous page</a>{/block:PreviousPage}{block:NextPage}<a href="{NextPage}" style="float: right;">next page</a>{/block:NextPage}</div>
  1455. {/block:Pagination}
  1456. <div class="scroll"><span style="cursor: pointer;font-size: 20px;color: {color:Link};">&#x2912;</span></div>
  1457. </div> <!--#wrapper-->
  1458. </section> <!--#home-->
  1459.  
  1460. <section id="ask" class="box hide">
  1461. <div class="wraps">
  1462. <div class="wrap w a">
  1463. <h1>{text:Ask Tab Title}</h1>
  1464. <div class="i">
  1465. {block:IfFAQ1}
  1466. <div class="ques">{text:FAQ Question 1}</div>
  1467. <div class="tion">{text:FAQ Answer 1}</div>
  1468. {/block:IfFAQ1}
  1469. {block:IfFAQ2}
  1470. <div class="ques">{text:FAQ Question 2}</div>
  1471. <div class="tion">{text:FAQ Answer 2}</div>
  1472. {/block:IfFAQ2}
  1473. {block:IfFAQ3}
  1474. <div class="ques">{text:FAQ Question 3}</div>
  1475. <div class="tion">{text:FAQ Answer 3}</div>
  1476. {/block:IfFAQ3}
  1477. {block:IfFAQ4}
  1478. <div class="ques">{text:FAQ Question 4}</div>
  1479. <div class="tion">{text:FAQ Answer 4}</div>
  1480. {/block:IfFAQ4}
  1481. {block:IfFAQ5}
  1482. <div class="ques">{text:FAQ Question 5}</div>
  1483. <div class="tion">{text:FAQ Answer 5}</div>
  1484. {/block:IfFAQ5}
  1485. {block:IfFAQ6}
  1486. <div class="ques">{text:FAQ Question 6}</div>
  1487. <div class="tion">{text:FAQ Answer 6}</div>
  1488. {/block:IfFAQ6}
  1489. {block:IfFAQ7}
  1490. <div class="ques">{text:FAQ Question 7}</div>
  1491. <div class="tion">{text:FAQ Answer 7}</div>
  1492. {/block:IfFAQ7}
  1493. {block:IfFAQ8}
  1494. <div class="ques">{text:FAQ Question 8}</div>
  1495. <div class="tion">{text:FAQ Answer 8}</div>
  1496. {/block:IfFAQ8}
  1497. {block:IfFAQ9}
  1498. <div class="ques">{text:FAQ Question 9}</div>
  1499. <div class="tion">{text:FAQ Answer 9}</div>
  1500. {/block:IfFAQ9}
  1501. {block:IfFAQ10}
  1502. <div class="ques">{text:FAQ Question 10}</div>
  1503. <div class="tion">{text:FAQ Answer 10}</div>
  1504. {/block:IfFAQ10}
  1505. <iframe frameborder="0" height="260" width="100%" id="ask_form" src="https://www.tumblr.com/ask_form/{Name}.tumblr.com" style="background-color: transparent;"></iframe>
  1506. </div> <!--.i-->
  1507. <div class="scroll"><span style="cursor: pointer;font-size: 20px;color: {color:Link};">&#x2912;</span></div>
  1508. </div> <!--.wrap-->
  1509. </section> <!--#ask-->
  1510. <section id="etc" class="box hide">
  1511. <div class="wrap w n">
  1512. {block:IfExtras}
  1513. <div class="boxes e">
  1514. <h1>{text:Extras Title}</h1>
  1515. <ul>
  1516. {block:IfLink1}<li><a href="{text:Link 1}">{text:Link 1 Title}</a></li>{/block:IfLink1}
  1517. {block:IfLink2}<li><a href="{text:Link 2}">{text:Link 2 Title}</a></li>{/block:IfLink2}
  1518. {block:IfLink3}<li><a href="{text:Link 3}">{text:Link 3 Title}</a></li>{/block:IfLink3}
  1519. {block:IfLink4}<li><a href="{text:Link 4}">{text:Link 4 Title}</a></li>{/block:IfLink4}
  1520. {block:IfLink5}<li><a href="{text:Link 5}">{text:Link 5 Title}</a></li>{/block:IfLink5}
  1521. {block:IfLink6}<li><a href="{text:Link 6}">{text:Link 6 Title}</a></li>{/block:IfLink6}
  1522. {block:IfLink7}<li><a href="{text:Link 7}">{text:Link 7 Title}</a></li>{/block:IfLink7}
  1523. {block:IfLink8}<li><a href="{text:Link 8}">{text:Link 8 Title}</a></li>{/block:IfLink8}
  1524. {block:IfLink9}<li><a href="{text:Link 9}">{text:Link 9 Title}</a></li>{/block:IfLink9}
  1525. {block:IfLink10}<li><a href="{text:Link 10}">{text:Link 10 Title}</a></li>{/block:IfLink10}
  1526. {block:HasPages}{block:Pages}<li><a href="{URL}">{Label}</a></li>{/block:Pages}{/block:HasPages}
  1527. </ul>
  1528. </div> <!--.e-->
  1529. {/block:IfExtras}
  1530. {block:IfUpdates}
  1531. <div class="boxes u">
  1532. <h1>{text:Updates Title}</h1>
  1533. <ul>
  1534. {block:IfUpdate1}<li>{text:Updates 1}</li>{/block:IfUpdate1}
  1535. {block:IfUpdate2}<li>{text:Updates 2}</li>{/block:IfUpdate2}
  1536. {block:IfUpdate3}<li>{text:Updates 3}</li>{/block:IfUpdate3}
  1537. {block:IfUpdate4}<li>{text:Updates 4}</li>{/block:IfUpdate4}
  1538. {block:IfUpdate5}<li>{text:Updates 5}</li>{/block:IfUpdate5}
  1539. </ul>
  1540. </div>
  1541. {/block:IfUpdates}
  1542. {block:IfTag}
  1543. <div class="boxes t">
  1544. <h1>{text:Tags Title}</h1>
  1545. <ul>
  1546. {block:IfTags1}<li><a href="{text:Tags 1 Link}">{text:Tags 1}</a></li>{/block:IfTags1}
  1547. {block:IfTags2}<li><a href="{text:Tags 2 Link}">{text:Tags 2}</a></li>{/block:IfTags2}
  1548. {block:IfTags3}<li><a href="{text:Tags 3 Link}">{text:Tags 3}</a></li>{/block:IfTags3}
  1549. {block:IfTags4}<li><a href="{text:Tags 4 Link}">{text:Tags 4}</a></li>{/block:IfTags4}
  1550. {block:IfTags5}<li><a href="{text:Tags 5 Link}">{text:Tags 5}</a></li>{/block:IfTags5}
  1551. {block:IfTags6}<li><a href="{text:Tags 6 Link}">{text:Tags 6}</a></li>{/block:IfTags6}
  1552. {block:IfTags7}<li><a href="{text:Tags 7 Link}">{text:Tags 7}</a></li>{/block:IfTags7}
  1553. {block:IfTags8}<li><a href="{text:Tags 8 Link}">{text:Tags 8}</a></li>{/block:IfTags8}
  1554. {block:IfTags9}<li><a href="{text:Tags 9 Link}">{text:Tags 9}</a></li>{/block:IfTags9}
  1555. {block:IfTags10}<li><a href="{text:Tags 10 Link}">{text:Tags 10}</a></li>{/block:IfTags10}
  1556. </ul>
  1557. </div> <!--.t-->
  1558. {/block:IfTag}
  1559. <div class="scroll"><span style="cursor: pointer;font-size: 20px;color: {color:Link};">&#x2912;</span></div>
  1560. </div> <!--.wrap-->
  1561. </div> <!--.wraps-->
  1562. </section> <!--#etc-->
  1563.  
  1564. <a href="https://cafethemes.tumblr.com/" title="theme by caffeous"><span class="lnr lnr-coffee-cup cup" style="position: fixed;bottom: 10px; right: 5px;font-size:20px;color: {color:Link};"></span></a>
  1565.  
  1566. </body>
  1567. </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!